/* ============================================================
   123PLAY — UI 2027 (ธีมล้ำ-ไฮเทค: HUD / glass / นีออน)
   ชุดดีไซน์กลาง ใช้ร่วมทุกหน้า — เปิดใช้ด้วย <body class="pv-2027">
   ทุกสไตล์ขอบเขตอยู่ใต้ .pv-2027 เพื่อไม่กระทบหน้าที่ยังไม่แปลง
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Chakra+Petch:wght@400;500;600;700&family=Kanit:wght@300;400;500;600;700&display=swap');

:root{
  --pv-bg:#06080f; --pv-bg2:#0a0e1a;
  --pv-glass:rgba(146,180,255,.045); --pv-glass2:rgba(146,180,255,.08);
  --pv-line:rgba(120,170,255,.16); --pv-line-bright:rgba(120,200,255,.42);
  --pv-fg:#e9f1ff; --pv-muted:#8595bd;
  --pv-cyan:#37e1ff; --pv-cyan-deep:#0ea5c4; --pv-violet:#b071ff;
  --pv-gold:#ffce45; --pv-gold-deep:#e0a42a;
  --pv-emerald:#30e08c; --pv-red:#ff4d6a; --pv-live:#4a8cff;
  --pv-radius:16px; --pv-shadow:0 20px 50px rgba(0,0,0,.55);
  --pv-display:'Chakra Petch', system-ui, -apple-system, sans-serif;
  --pv-body:'Kanit', system-ui, -apple-system, sans-serif;
}

/* ─── BASE ─── */
.pv-2027{
  font-family:var(--pv-body); color:var(--pv-fg); line-height:1.6;
  background:
    radial-gradient(900px 560px at 50% -120px, rgba(55,225,255,.12), transparent 62%),
    radial-gradient(760px 540px at 8% 10%, rgba(176,113,255,.14), transparent 60%),
    radial-gradient(760px 540px at 95% 4%, rgba(255,206,69,.08), transparent 60%),
    var(--pv-bg);
  background-attachment:fixed;
}
/* HUD grid field */
.pv-2027::after{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:.5;
  background-image:
    linear-gradient(rgba(120,180,255,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(120,180,255,.06) 1px, transparent 1px);
  background-size:46px 46px;
  -webkit-mask-image:radial-gradient(circle at 50% 22%, #000 0%, transparent 80%);
  mask-image:radial-gradient(circle at 50% 22%, #000 0%, transparent 80%);
  animation:pv-drift 32s linear infinite;
}
@keyframes pv-drift{ from{ background-position:0 0,0 0; } to{ background-position:46px 46px,46px 46px; } }
.pv-2027 a{ text-decoration:none; }
.pv-2027 h1,.pv-2027 h2,.pv-2027 h3,.pv-2027 h4,.pv-2027 h5{ font-family:var(--pv-display); text-wrap:balance; }
.pv-mono{ font-family:var(--pv-display); font-variant-numeric:tabular-nums; }
.pv-wrap{ max-width:1140px; margin-inline:auto;
  padding-left:max(18px, env(safe-area-inset-left,0px)); padding-right:max(18px, env(safe-area-inset-right,0px)); }
.pv-eyebrow{ font-family:var(--pv-display); letter-spacing:.24em; text-transform:uppercase; font-size:.7rem; font-weight:600; }

/* ─── HEADER ─── */
.pv-header{ position:sticky; top:env(safe-area-inset-top,0px); z-index:30;
  background:linear-gradient(180deg, rgba(6,8,15,.94), rgba(6,8,15,.72)); backdrop-filter:blur(14px);
  border-bottom:1px solid var(--pv-line); }
.pv-header::after{ content:""; position:absolute; left:0; right:0; bottom:-1px; height:1px;
  background:linear-gradient(90deg, transparent, var(--pv-cyan), var(--pv-violet), transparent); opacity:.6; }
.pv-bar{ display:flex; align-items:center; gap:14px; padding-block:12px; }
.pv-brand{ display:flex; align-items:center; gap:10px; font-family:var(--pv-display); font-weight:700; font-size:1.28rem; flex-shrink:0; }
.pv-brand img{ max-height:46px; object-fit:contain; }
.pv-brand .pv-mark{ width:34px; height:34px; border-radius:10px; display:grid; place-items:center; font-size:1rem;
  background:linear-gradient(135deg, rgba(55,225,255,.2), rgba(176,113,255,.2)); border:1px solid var(--pv-line-bright);
  box-shadow:0 0 18px rgba(55,225,255,.3), inset 0 0 12px rgba(55,225,255,.15); }
.pv-brand b{ background:linear-gradient(100deg,#fff, var(--pv-cyan) 45%, var(--pv-gold) 95%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.pv-ticker{ flex:1; min-width:0; display:flex; align-items:center; gap:10px; overflow:hidden;
  background:var(--pv-glass); border:1px solid var(--pv-line); border-radius:10px; padding:6px 14px; }
.pv-ticker .pv-dot{ width:8px; height:8px; border-radius:50%; background:var(--pv-cyan); box-shadow:0 0 10px var(--pv-cyan); flex-shrink:0; animation:pv-blink 1.4s infinite; }
@keyframes pv-blink{ 50%{ opacity:.3; } }
.pv-ticker .pv-track{ white-space:nowrap; font-size:.85rem; color:#cfe0ff; animation:pv-ticker 26s linear infinite; }
@keyframes pv-ticker{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
.pv-chip-line{ flex-shrink:0; display:inline-flex; align-items:center; gap:6px; font-weight:600; font-size:.82rem;
  background:#06C755; color:#fff; padding:7px 14px; border-radius:10px; box-shadow:0 0 16px rgba(6,199,85,.35); }
@media(max-width:640px){ .pv-chip-line span{ display:none; } .pv-chip-line{ padding:8px 10px; } }

/* ─── HERO ─── */
.pv-hero{ padding-block:38px 14px; text-align:center; display:grid; gap:15px; justify-items:center; }
.pv-badge{ display:inline-flex; align-items:center; gap:9px; padding:7px 16px; border-radius:50px; color:var(--pv-cyan);
  background:var(--pv-glass); border:1px solid var(--pv-line-bright); box-shadow:0 0 20px rgba(55,225,255,.12); }
.pv-badge .pv-sq{ width:7px; height:7px; background:var(--pv-cyan); box-shadow:0 0 8px var(--pv-cyan); }
.pv-hero h1{ font-size:clamp(2rem,6.4vw,3.4rem); font-weight:700; line-height:1.15; }
.pv-holo{ background:linear-gradient(100deg, var(--pv-cyan) 0%, #fff 40%, var(--pv-violet) 75%, var(--pv-gold) 100%);
  background-size:200% auto; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; animation:pv-holo 6s linear infinite; }
@keyframes pv-holo{ to{ background-position:200% center; } }
.pv-sub{ color:var(--pv-muted); font-size:1.03rem; max-width:40ch; }
.pv-trust{ display:flex; flex-wrap:wrap; gap:9px; justify-content:center; }
.pv-trust span{ display:inline-flex; align-items:center; gap:7px; font-size:.83rem; color:#cfdcff;
  background:var(--pv-glass); border:1px solid var(--pv-line); border-radius:50px; padding:7px 15px; }

/* ─── SECTION HEAD ─── */
.pv-sechead{ display:flex; align-items:center; gap:13px; margin:30px 0 18px; }
.pv-sechead h2{ font-size:1.22rem; font-weight:700; white-space:nowrap; letter-spacing:.03em; display:flex; align-items:center; gap:9px; margin:0; }
.pv-sechead h2::before{ content:""; width:4px; height:20px; background:linear-gradient(var(--pv-cyan),var(--pv-violet)); box-shadow:0 0 10px rgba(55,225,255,.5); border-radius:2px; }
.pv-sechead .pv-rule{ flex:1; height:1px; background:linear-gradient(90deg,var(--pv-line-bright),transparent); }
.pv-sechead .pv-count{ font-family:var(--pv-display); font-size:.78rem; color:var(--pv-cyan); letter-spacing:.08em; }

/* ─── SLIDER (skin Bootstrap carousel) ─── */
.pv-2027 .slider-wrap{ border-radius:var(--pv-radius); overflow:hidden; border:1px solid var(--pv-line-bright);
  box-shadow:var(--pv-shadow), 0 0 40px rgba(55,225,255,.08); }

/* ─── ACTIVITY GRID / CARDS ─── */
.pv-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:18px; }
.pv-card{ position:relative; border-radius:var(--pv-radius); overflow:hidden; background:var(--pv-glass);
  border:1px solid var(--pv-line); backdrop-filter:blur(10px); display:flex; flex-direction:column;
  transition:transform .28s, box-shadow .28s, border-color .28s; }
.pv-card::before{ content:""; position:absolute; top:0; left:0; width:16px; height:16px; z-index:4;
  border-top:2px solid var(--pv-line-bright); border-left:2px solid var(--pv-line-bright); border-top-left-radius:var(--pv-radius); opacity:.6; }
.pv-card:hover{ transform:translateY(-6px); border-color:var(--pv-line-bright); box-shadow:var(--pv-shadow), 0 0 26px rgba(55,225,255,.18); }
.pv-card.pv-feat{ border-color:rgba(255,206,69,.4); }
.pv-card.pv-feat::before{ border-color:var(--pv-gold); }
.pv-banner{ aspect-ratio:1/1; position:relative; overflow:hidden; background:#070b16; }
.pv-banner img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s; }
.pv-card:hover .pv-banner img{ transform:scale(1.06); }
.pv-banner::after{ content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(0deg, rgba(120,180,255,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(120,180,255,.07) 1px, transparent 1px);
  background-size:24px 24px; opacity:.5; }
.pv-card.pv-closed .pv-banner{ filter:grayscale(.7) brightness(.45); }
.pv-pill{ position:absolute; top:11px; right:11px; z-index:5; display:inline-flex; align-items:center; gap:5px; font-family:var(--pv-display);
  font-size:.7rem; font-weight:600; letter-spacing:.04em; padding:5px 11px; border-radius:50px; backdrop-filter:blur(6px); border:1px solid rgba(255,255,255,.2); }
.pv-p-open{ background:rgba(48,224,140,.16); color:var(--pv-emerald); border-color:rgba(48,224,140,.5); box-shadow:0 0 14px rgba(48,224,140,.25); }
.pv-p-close{ background:rgba(255,77,106,.15); color:var(--pv-red); border-color:rgba(255,77,106,.45); }
.pv-p-live{ background:rgba(74,140,255,.2); color:#9ec2ff; border-color:rgba(74,140,255,.6); box-shadow:0 0 14px rgba(74,140,255,.35); animation:pv-livepulse 1.6s infinite; }
.pv-p-maint{ background:rgba(255,206,69,.16); color:var(--pv-gold); border-color:rgba(255,206,69,.5); }
@keyframes pv-livepulse{ 0%,100%{ box-shadow:0 0 0 0 rgba(74,140,255,.4); } 50%{ box-shadow:0 0 0 7px rgba(74,140,255,0); } }
.pv-cardbody{ padding:14px 15px 17px; text-align:center; display:flex; flex-direction:column; gap:10px; flex:1; }
.pv-cardbody h3,.pv-cardbody h5{ font-size:1rem; font-weight:600; margin:0; }
.pv-countdown{ display:inline-flex; align-items:center; gap:6px; align-self:center; font-family:var(--pv-display); font-size:.78rem;
  color:var(--pv-cyan); background:rgba(55,225,255,.08); border:1px solid rgba(55,225,255,.3); border-radius:50px; padding:4px 12px; font-variant-numeric:tabular-nums; }

/* ─── BUTTONS ─── */
.pv-btn{ margin-top:auto; display:block; width:100%; text-align:center; font-family:var(--pv-display); font-weight:600;
  font-size:.95rem; letter-spacing:.03em; border:none; border-radius:10px; padding:11px 0; cursor:pointer;
  transition:transform .18s, box-shadow .18s; text-decoration:none; }
.pv-btn:hover{ transform:scale(1.03); }
.pv-btn-go{ background:linear-gradient(135deg, rgba(48,224,140,.92), rgba(14,165,120,.92)); color:#021a0f; box-shadow:0 0 18px rgba(48,224,140,.3); }
.pv-btn-go:hover{ color:#021a0f; }
.pv-btn-gold{ background:linear-gradient(135deg, var(--pv-gold), var(--pv-gold-deep)); color:#201500; box-shadow:0 0 18px rgba(255,206,69,.35); }
.pv-btn-gold:hover{ color:#201500; }
.pv-btn-dim{ background:var(--pv-glass2); border:1px solid var(--pv-line); color:var(--pv-muted); }
.pv-btn-dim:hover{ background:rgba(255,255,255,.1); color:var(--pv-fg); }

/* ─── CTA BAND ─── */
.pv-cta{ margin:36px 0 10px; display:grid; gap:12px; max-width:560px; margin-inline:auto; }
.pv-cta-big{ display:flex; align-items:center; justify-content:center; gap:10px; font-family:var(--pv-display);
  font-weight:700; font-size:1.08rem; letter-spacing:.02em; border-radius:12px; padding:16px; border:none; cursor:pointer;
  transition:transform .18s, box-shadow .18s; text-decoration:none; }
.pv-cta-big:hover{ transform:translateY(-2px); }
.pv-cta-play{ background:linear-gradient(135deg, var(--pv-cyan), var(--pv-violet)); color:#04121f; box-shadow:0 0 28px rgba(55,225,255,.35); }
.pv-cta-play:hover{ color:#04121f; }
.pv-cta-line{ background:#06C755; color:#fff; box-shadow:0 0 22px rgba(6,199,85,.35); font-size:1rem; }
.pv-cta-line:hover{ color:#fff; }
.pv-cta-ai{ background:var(--pv-glass2); color:#cfe0ff; border:1px solid var(--pv-line-bright); font-size:1rem; box-shadow:0 0 18px rgba(176,113,255,.15); }
.pv-cta-ai:hover{ color:#fff; }
.pv-cta-row{ display:flex; gap:12px; justify-content:center; margin-top:4px; flex-wrap:wrap; }
.pv-cta-row a{ display:inline-flex; align-items:center; gap:7px; font-weight:500; font-size:.9rem; color:#cfdcff;
  background:var(--pv-glass); border:1px solid var(--pv-line); border-radius:50px; padding:9px 18px; transition:.2s; text-decoration:none; }
.pv-cta-row a:hover{ background:rgba(255,255,255,.1); color:#fff; border-color:var(--pv-line-bright); }

/* ─── FOOTER ─── */
.pv-footer{ text-align:center; padding:28px 0 44px; color:rgba(180,200,240,.4); font-size:.78rem; display:grid; gap:8px; }

/* ─── FLOAT LINE ─── */
.pv-line-float{ position:fixed; z-index:40; right:max(18px, env(safe-area-inset-right,0px)); bottom:calc(18px + env(safe-area-inset-bottom,0px));
  display:flex; align-items:center; gap:9px; background:#06C755; color:#fff; font-weight:600; font-family:var(--pv-display);
  padding:12px 18px; border-radius:50px; box-shadow:0 0 26px rgba(6,199,85,.5); transition:transform .25s; text-decoration:none; }
.pv-line-float:hover{ transform:scale(1.07); color:#fff; }
@media(max-width:640px){ .pv-line-float span{ display:none; } .pv-line-float{ padding:14px; } }

/* ============================================================
   BOOTSTRAP 5 DARK SKIN (scoped .pv-2027) — ให้หน้าที่ใช้ Bootstrap
   กลายเป็นโทนมืดนีออนทันทีเมื่อเติม class="pv-2027" ที่ body
   ============================================================ */
.pv-2027 .card{ background:var(--pv-glass); border:1px solid var(--pv-line); color:var(--pv-fg);
  border-radius:var(--pv-radius); backdrop-filter:blur(10px); }
.pv-2027 .card-header,.pv-2027 .card-footer{ background:rgba(255,255,255,.03); border-color:var(--pv-line); color:var(--pv-fg); }
.pv-2027 .modal-content{ background:var(--pv-bg2); border:1px solid var(--pv-line-bright); color:var(--pv-fg); border-radius:var(--pv-radius); }
.pv-2027 .modal-header,.pv-2027 .modal-footer{ border-color:var(--pv-line); }
.pv-2027 .list-group-item{ background:var(--pv-glass); border-color:var(--pv-line); color:var(--pv-fg); }
.pv-2027 .dropdown-menu{ background:var(--pv-bg2); border:1px solid var(--pv-line); }
.pv-2027 .dropdown-item{ color:var(--pv-fg); }
.pv-2027 .dropdown-item:hover{ background:var(--pv-glass2); color:#fff; }

/* text / background utilities remapped to theme */
.pv-2027 .text-muted{ color:var(--pv-muted) !important; }
.pv-2027 .text-dark{ color:var(--pv-fg) !important; }
.pv-2027 .bg-white,.pv-2027 .bg-light{ background:var(--pv-glass) !important; color:var(--pv-fg) !important; }
.pv-2027 .border{ border-color:var(--pv-line) !important; }
.pv-2027 hr{ border-color:var(--pv-line); opacity:.6; }

/* forms */
.pv-2027 .form-label{ color:var(--pv-muted); font-weight:500; }
.pv-2027 .form-control,.pv-2027 .form-select{ background:rgba(255,255,255,.04); border:1px solid var(--pv-line);
  color:var(--pv-fg); border-radius:10px; }
.pv-2027 .form-control::placeholder{ color:#6f7da3; }
.pv-2027 .form-control:focus,.pv-2027 .form-select:focus{ background:rgba(255,255,255,.06); border-color:var(--pv-cyan);
  color:var(--pv-fg); box-shadow:0 0 0 .2rem rgba(55,225,255,.18); }
.pv-2027 .input-group-text{ background:var(--pv-glass2); border:1px solid var(--pv-line); color:var(--pv-muted); }
.pv-2027 .form-check-input{ background-color:rgba(255,255,255,.08); border-color:var(--pv-line); }
.pv-2027 .form-check-input:checked{ background-color:var(--pv-cyan); border-color:var(--pv-cyan); }

/* tables */
.pv-2027 .table{ color:var(--pv-fg); --bs-table-bg:transparent; --bs-table-color:var(--pv-fg);
  --bs-table-striped-color:var(--pv-fg); --bs-table-striped-bg:rgba(255,255,255,.03); border-color:var(--pv-line); }
.pv-2027 .table > :not(caption) > * > *{ border-color:var(--pv-line); }
.pv-2027 .table thead th{ color:var(--pv-cyan); font-family:var(--pv-display); font-weight:600; letter-spacing:.02em; }

/* alerts (tinted) */
.pv-2027 .alert{ border-radius:12px; border:1px solid var(--pv-line); background:var(--pv-glass); color:var(--pv-fg); }
.pv-2027 .alert-success{ background:rgba(48,224,140,.12); border-color:rgba(48,224,140,.4); color:#a9f3cd; }
.pv-2027 .alert-danger{ background:rgba(255,77,106,.12); border-color:rgba(255,77,106,.4); color:#ffc0cc; }
.pv-2027 .alert-warning{ background:rgba(255,206,69,.12); border-color:rgba(255,206,69,.4); color:#ffe6a3; }
.pv-2027 .alert-info{ background:rgba(55,225,255,.1); border-color:rgba(55,225,255,.4); color:#bdeeff; }

/* badges */
.pv-2027 .badge.bg-success{ background:rgba(48,224,140,.9) !important; color:#031a0f; }
.pv-2027 .badge.bg-danger{ background:rgba(255,77,106,.9) !important; }
.pv-2027 .badge.bg-warning{ background:var(--pv-gold) !important; color:#201500; }
.pv-2027 .badge.bg-secondary{ background:var(--pv-glass2) !important; color:var(--pv-fg); border:1px solid var(--pv-line); }
.pv-2027 .badge.bg-primary,.pv-2027 .badge.bg-info{ background:rgba(55,225,255,.9) !important; color:#042430; }

/* buttons — keep Bootstrap layout, recolor to neon palette */
.pv-2027 .btn{ border-radius:10px; font-family:var(--pv-display); font-weight:600; letter-spacing:.02em; }
.pv-2027 .btn-primary{ background:linear-gradient(135deg,var(--pv-cyan),var(--pv-cyan-deep)); border:none; color:#042430; }
.pv-2027 .btn-success{ background:linear-gradient(135deg,var(--pv-emerald),rgba(14,165,120,.95)); border:none; color:#021a0f; }
.pv-2027 .btn-danger{ background:linear-gradient(135deg,var(--pv-red),#b11d34); border:none; color:#fff; }
.pv-2027 .btn-warning{ background:linear-gradient(135deg,var(--pv-gold),var(--pv-gold-deep)); border:none; color:#201500; }
.pv-2027 .btn-secondary{ background:var(--pv-glass2); border:1px solid var(--pv-line); color:var(--pv-fg); }
.pv-2027 .btn-outline-primary{ border:1px solid var(--pv-cyan); color:var(--pv-cyan); background:transparent; }
.pv-2027 .btn-outline-primary:hover{ background:var(--pv-cyan); color:#042430; }
.pv-2027 .btn-outline-secondary{ border:1px solid var(--pv-line); color:var(--pv-muted); background:transparent; }
.pv-2027 .btn-outline-secondary:hover{ background:var(--pv-glass2); color:var(--pv-fg); }
.pv-2027 .btn-light{ background:var(--pv-glass2); border:1px solid var(--pv-line); color:var(--pv-fg); }

/* nav / tabs */
.pv-2027 .nav-tabs{ border-color:var(--pv-line); }
.pv-2027 .nav-tabs .nav-link{ color:var(--pv-muted); border:none; }
.pv-2027 .nav-tabs .nav-link.active{ color:var(--pv-cyan); background:transparent; border-bottom:2px solid var(--pv-cyan); }

/* links inside content */
.pv-2027 a:not(.btn):not(.pv-btn):not([class*="pv-"]){ color:var(--pv-cyan); }

/* ============================================================
   LEGACY CLASS SKIN (scoped .pv-2027) — สกินคลาสเดิมของหน้ากิจกรรม
   ให้เข้าธีม 2027 โดยไม่ต้องรื้อ markup (แค่เติม class="pv-2027" ที่ body)
   ============================================================ */
/* บังคับพื้นหลัง 2027 ชนะ body{..!important} ของ _wc_bg และซ่อน canvas/ธงบอลโลก */
.pv-2027{ background:
    radial-gradient(900px 560px at 50% -120px, rgba(55,225,255,.12), transparent 62%),
    radial-gradient(760px 540px at 8% 10%, rgba(176,113,255,.14), transparent 60%),
    radial-gradient(760px 540px at 95% 4%, rgba(255,206,69,.08), transparent 60%),
    var(--pv-bg) !important; }
.pv-2027 #wc-bg-canvas,.pv-2027 #wc-flags-bg,.pv-2027 .wc-grass-strip{ display:none !important; }

/* containers / panels */
.pv-2027 .main-container{ padding-left:max(16px, env(safe-area-inset-left,0px)); padding-right:max(16px, env(safe-area-inset-right,0px)); }
.pv-2027 .hero-card,.pv-2027 .match-card,.pv-2027 .step-card,.pv-2027 .glass,.pv-2027 .glass-card,
.pv-2027 .glass-white,.pv-2027 .rules-box,.pv-2027 .prize-box,.pv-2027 .cred-box,.pv-2027 .pred-card,
.pv-2027 .phase-card,.pv-2027 .board-row{
  background:var(--pv-glass) !important; border:1px solid var(--pv-line) !important; color:var(--pv-fg) !important;
  border-radius:var(--pv-radius) !important; backdrop-filter:blur(10px); box-shadow:none; }
.pv-2027 .hero-card{ position:relative; }
.pv-2027 .hero-card::before{ content:""; position:absolute; top:0; left:0; width:16px; height:16px;
  border-top:2px solid var(--pv-line-bright); border-left:2px solid var(--pv-line-bright); border-top-left-radius:var(--pv-radius); opacity:.6; }

/* hero banners (leaderboard/history) */
.pv-2027 .hero{ background:linear-gradient(135deg, rgba(55,225,255,.18), rgba(176,113,255,.16)) !important;
  border:1px solid var(--pv-line-bright) !important; border-radius:var(--pv-radius); color:var(--pv-fg) !important; }

/* numbered step circles */
.pv-2027 .step-num,.pv-2027 .step-badge,.pv-2027 .stepn,.pv-2027 .step-num-badge{
  background:linear-gradient(135deg, rgba(55,225,255,.25), rgba(176,113,255,.25)) !important;
  border:1px solid var(--pv-line-bright) !important; color:#fff !important; box-shadow:0 0 12px rgba(55,225,255,.3); }

/* club / team logos */
.pv-2027 .club-logo,.pv-2027 .hero-ico,.pv-2027 .movie-ico,.pv-2027 .ai-ico{
  border:1px solid var(--pv-line-bright) !important; box-shadow:0 0 16px rgba(55,225,255,.2); }

/* choice / team buttons */
.pv-2027 .choice-btn,.pv-2027 .team-btn{ background:var(--pv-glass2) !important; border:1px solid var(--pv-line) !important;
  color:var(--pv-fg) !important; border-radius:12px !important; }
.pv-2027 .choice-btn.selected,.pv-2027 .team-btn.selected{ background:linear-gradient(135deg, rgba(55,225,255,.3), rgba(14,165,196,.3)) !important;
  border-color:var(--pv-cyan) !important; box-shadow:0 0 18px rgba(55,225,255,.35) !important; color:#fff !important; }

/* number / score inputs */
.pv-2027 .score-input,.pv-2027 .lotto-input,.pv-2027 #user-input,.pv-2027 #userId,.pv-2027 #user_id,
.pv-2027 #phone-input,.pv-2027 #play_user_id,.pv-2027 #play_code,.pv-2027 #top3,.pv-2027 #bottom2{
  background:rgba(255,255,255,.04) !important; border:1px solid var(--pv-line) !important; color:var(--pv-fg) !important;
  border-radius:10px !important; }

/* status / check blocks */
.pv-2027 .status-success,.pv-2027 .status-approved,.pv-2027 .check-ok{
  background:rgba(48,224,140,.12) !important; border:1px solid rgba(48,224,140,.45) !important; color:#a9f3cd !important; }
.pv-2027 .status-fail,.pv-2027 .status-rejected,.pv-2027 .check-bad{
  background:rgba(255,77,106,.12) !important; border:1px solid rgba(255,77,106,.45) !important; color:#ffc0cc !important; }
.pv-2027 .status-pending{ background:rgba(255,206,69,.12) !important; border:1px solid rgba(255,206,69,.45) !important; color:#ffe6a3 !important; }

/* countdown */
.pv-2027 .countdown-box{ background:var(--pv-glass) !important; border:1px solid rgba(55,225,255,.3) !important; }
.pv-2027 .countdown-num,.pv-2027 .timer-item{ font-family:var(--pv-display) !important; color:var(--pv-cyan) !important; font-variant-numeric:tabular-nums; }
.pv-2027 .countdown-label,.pv-2027 .timer-label{ color:var(--pv-muted) !important; }
.pv-2027 .countdown-sep,.pv-2027 .cd-sep{ color:var(--pv-cyan) !important; }

/* badges (free / bonus / deposit / loss) */
.pv-2027 .bonus-badge,.pv-2027 .deposit-badge{ background:rgba(255,206,69,.15) !important; border:1px solid rgba(255,206,69,.45) !important; color:var(--pv-gold) !important; }
.pv-2027 .loss-badge{ background:rgba(48,224,140,.14) !important; border:1px solid rgba(48,224,140,.45) !important; color:#a9f3cd !important; }
.pv-2027 .badge-free{ background:rgba(55,225,255,.14) !important; border:1px solid rgba(55,225,255,.45) !important; color:var(--pv-cyan) !important; }
.pv-2027 .member-chip{ background:var(--pv-glass2) !important; border:1px solid var(--pv-line) !important; color:var(--pv-fg) !important; }

/* phase cards (worldcup champion) */
.pv-2027 .phase-1{ border-color:rgba(55,225,255,.5) !important; }
.pv-2027 .phase-2{ border-color:rgba(255,206,69,.5) !important; }

/* leaderboard ranks keep medal colours; others muted */
.pv-2027 .rank-n{ color:var(--pv-muted) !important; }
.pv-2027 .nav-pills .nav-link{ color:var(--pv-muted); background:var(--pv-glass); border:1px solid var(--pv-line); }
.pv-2027 .nav-pills .nav-link.active{ background:linear-gradient(135deg, rgba(55,225,255,.3), rgba(176,113,255,.3)); color:#fff; border-color:var(--pv-line-bright); }

/* result badges (history) */
.pv-2027 .result-badge.win,.pv-2027 .win{ background:rgba(48,224,140,.16) !important; color:#a9f3cd !important; }
.pv-2027 .result-badge.loss,.pv-2027 .loss{ background:rgba(255,77,106,.16) !important; color:#ffc0cc !important; }
.pv-2027 .pending-badge{ background:rgba(255,206,69,.16) !important; color:#ffe6a3 !important; }

/* custom action buttons → neon (keep watch/live specific colours) */
.pv-2027 .btn-send,.pv-2027 .btn-verify,.pv-2027 .btn-checkuser{
  background:linear-gradient(135deg,var(--pv-cyan),var(--pv-cyan-deep)) !important; border:none !important; color:#042430 !important; font-family:var(--pv-display); }
.pv-2027 .btn-register,.pv-2027 .link-register{ color:var(--pv-emerald) !important; }

@media (prefers-reduced-motion: reduce){ .pv-2027 *{ animation:none !important; } }