@import "reset.css";
@import "fonts.css";
@import "imgsvg.css";
@import "content.css";
@import "element.css";

:root { /*  var(--vis) */
  --bg:#0d1117;--bg2:#161b22;--bg3:#1c2333;--border:#30363d;
  --text:#e6edf3;--muted:#8b949e;--blue:#58a6ff;--green:#3fb950;
  --red:#f85149;--cyan:#39d2c0;--purple:#bc8cff;--orange:#f0883e;
  --yellow:#d29922;--gold:#ffd700;
}

body{background:var(--bg);color:var(--text);font-family:'Segoe UI',-apple-system,sans-serif;line-height:1.6;}
a{color:var(--blue);text-decoration:none;}
a:hover{text-decoration:underline;}
.nav{position:sticky;top:0;z-index:100;background:var(--bg2);border-bottom:1px solid var(--border);
     padding:8px 20px;display:flex;gap:4px;align-items:center;flex-wrap:wrap;position:relative;}
.nav-brand{display:contents;}
.nav-links{display:contents;}
.nav-controls{display:contents;}
.nav .logo{order:10;margin-left:auto;}
.ai-brand{order:30;}
.nav-meta{margin-left:auto;order:20;}
.nav a{color:var(--muted);text-decoration:none;padding:6px 12px;border-radius:6px;font-size:12px;font-weight:500;}
.nav a:hover{background:var(--bg3);color:var(--blue);}
.nav .logo{display:flex;align-items:center;gap:10px;pointer-events:none;}
.nav .logo .brand-mark{width:38px;height:38px;flex-shrink:0;filter:drop-shadow(0 0 6px rgba(201,168,76,0.4));}
.nav .logo .brand-mark svg{width:100%;height:100%;}
.nav .logo .brand-div{width:1px;height:22px;background:linear-gradient(180deg,transparent,rgba(201,168,76,0.5),transparent);}
.nav .logo .brand-name{font-family:'Georgia','Times New Roman',serif;
  font-size:20px;font-weight:700;letter-spacing:3px;text-transform:uppercase;
  background:linear-gradient(135deg,#f0dfa8 0%,#c9a84c 40%,#f0dfa8 70%,#96751a 100%);
  background-size:200% 100%;animation:brand-shimmer 3s ease-in-out infinite;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,0.4));}
@keyframes brand-shimmer{0%,100%{background-position:0% 50%;}50%{background-position:100% 50%;}}
/* SHOWCASE / HERO */
.showcase{position:relative;overflow:hidden;padding:32px 24px 28px;
  background:linear-gradient(170deg,#0d1117 0%,#111d2e 40%,#0a1628 100%);
  border-bottom:1px solid var(--border);}
.showcase::before{content:'';position:absolute;top:-120px;right:-80px;width:420px;height:420px;
  background:radial-gradient(circle,rgba(88,166,255,0.08) 0%,transparent 70%);pointer-events:none;}
.showcase::after{content:'';position:absolute;bottom:-100px;left:-60px;width:350px;height:350px;
  background:radial-gradient(circle,rgba(57,210,192,0.06) 0%,transparent 70%);pointer-events:none;}
.showcase-inner{max-width:1400px;margin:0 auto;position:relative;z-index:1;}
.hero-row{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;}
.hero-left{flex:1;min-width:320px;}
.hero-left h1{font-size:38px;font-weight:800;line-height:1.15;margin-bottom:6px;
  background:linear-gradient(135deg,#ffffff 0%,#a8d8ff 50%,#58a6ff 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.hero-left h1 .accent{background:linear-gradient(135deg,#39d2c0 0%,#58a6ff 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.hero-sub{color:var(--muted);font-size:14px;line-height:1.5;max-width:520px;margin-bottom:12px;}
.hero-sub strong{color:var(--text);}
.hero-right{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;min-width:280px;padding-top:22px;}
.trust-card{background:linear-gradient(145deg,rgba(22,27,34,0.95),rgba(13,17,23,0.95));
  border:1px solid var(--border);border-radius:12px;padding:14px 14px;width:170px;
  text-align:center;backdrop-filter:blur(4px);transition:transform .25s,border-color .25s;}
.trust-card:hover{transform:translateY(-4px);border-color:var(--blue);}
.trust-card .tc-icon{font-size:22px;margin-bottom:4px;}
.trust-card .tc-title{font-size:13px;font-weight:700;color:var(--text);margin-bottom:4px;}
.trust-card .tc-desc{font-size:11px;color:var(--muted);line-height:1.4;}
.pulse-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;
  animation:pulse-live 2s ease-in-out infinite;}
@keyframes pulse-live{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(63,185,80,0.5);}
  50%{opacity:.7;box-shadow:0 0 0 6px rgba(63,185,80,0);}}
.live-badge{display:inline-flex;align-items:center;background:rgba(63,185,80,0.1);
  border:1px solid rgba(63,185,80,0.3);border-radius:20px;padding:4px 14px 4px 10px;
  font-size:12px;font-weight:600;color:var(--green);margin-bottom:10px;}
.tg-cta{display:flex;align-items:center;gap:16px;margin-top:18px;padding:10px 24px;
  background:linear-gradient(135deg,rgba(0,136,204,0.08) 0%,rgba(0,136,204,0.15) 50%,rgba(57,210,192,0.06) 100%);
  border:1px solid rgba(0,136,204,0.22);border-radius:16px;
  backdrop-filter:blur(8px);cursor:pointer;text-decoration:none;color:inherit;
  transition:border-color .3s,box-shadow .3s,transform .3s;}
.tg-cta:hover{border-color:rgba(0,136,204,0.50);box-shadow:0 8px 32px rgba(0,136,204,0.18);
  transform:translateY(-2px);}
.tg-cta .tg-icon{flex-shrink:0;width:32px;height:32px;}
.tg-cta .tg-icon svg{width:32px;height:32px;fill:#2aabee;filter:drop-shadow(0 2px 8px rgba(42,171,238,0.4));
  transition:filter .3s;}
.tg-cta:hover .tg-icon svg{filter:drop-shadow(0 2px 12px rgba(42,171,238,0.7));}
.tg-cta .tg-body{flex:1;min-width:0;}
.tg-cta .tg-title{font-size:15px;font-weight:700;color:var(--text);margin-bottom:3px;}
.tg-cta .tg-desc{font-size:12px;color:var(--muted);line-height:1.45;}
.tg-cta .tg-arrow{flex-shrink:0;font-size:22px;color:rgba(42,171,238,0.6);transition:color .3s,transform .3s;}
.tg-cta:hover .tg-arrow{color:#2aabee;transform:translateX(4px);}
.container{max-width:1400px;margin:0 auto;padding:24px;}
.section{margin-bottom:48px;}
/* DAY CARDS (index page) */
.day-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;margin:24px 0;}
.day-card{position:relative;background:linear-gradient(145deg,rgba(22,27,34,0.95),rgba(16,20,30,0.98));
  border:1px solid var(--border);border-radius:16px;padding:28px 24px 22px;
  cursor:pointer;transition:all .3s ease;overflow:hidden;text-decoration:none;display:block;}
.day-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--cyan),var(--blue));opacity:0;transition:opacity .3s;}
.day-card:hover{transform:translateY(-4px);border-color:var(--cyan);
  box-shadow:0 12px 40px rgba(57,210,192,0.12);}
.day-card:hover::before{opacity:1;}
.day-card.today{border-color:rgba(63,185,80,0.4);}
.day-card.today::before{opacity:1;background:linear-gradient(90deg,var(--green),var(--cyan));}
.day-card .dc-date{font-size:24px;font-weight:800;color:var(--text);margin-bottom:2px;}
.day-card .dc-label{font-size:13px;color:var(--muted);margin-bottom:16px;}
.day-card .dc-count{font-size:48px;font-weight:900;line-height:1;margin-bottom:4px;}
.day-card .dc-matches-lbl{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;}
.day-card .dc-tiers{display:flex;gap:6px;margin-top:16px;flex-wrap:wrap;}
.day-card .dc-tier{font-size:10px;font-weight:700;padding:3px 10px;border-radius:12px;letter-spacing:0.5px;}
.day-card .dc-flags{display:flex;gap:4px;margin-top:12px;flex-wrap:wrap;align-items:center;}
.day-card .dc-arrow{position:absolute;right:20px;top:50%;transform:translateY(-50%);
  font-size:24px;color:var(--muted);transition:all .3s;}
.day-card:hover .dc-arrow{color:var(--cyan);transform:translateY(-50%) translateX(4px);}
/* MATCH TABLE (day pages) */
table{width:100%;border-collapse:collapse;margin:10px 0;font-size:13px;}
th{background:var(--bg2);color:var(--blue);padding:10px 12px;text-align:left;
   border-bottom:2px solid var(--border);font-weight:600;position:sticky;top:42px;z-index:10;}
td{padding:8px 12px;border-bottom:1px solid var(--border);}
tr:hover td{background:var(--bg3);}
.flag-img{display:inline-block;height:16px;width:22px;vertical-align:middle;margin-right:4px;border-radius:2px;background-size:contain;background-repeat:no-repeat;background-position:center;}
.team-logo{display:inline-block;height:22px;width:22px;vertical-align:middle;margin:0 3px;background-size:contain;background-repeat:no-repeat;background-position:center;}
.match-row{cursor:pointer;}
.match-row:hover td{background:var(--bg3);}
.detail-row{display:none;}
.detail-row.open{display:table-row;}
.detail-row td{padding:0;border-bottom:2px solid var(--border);}
.detail-panel{background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:16px;margin:4px 8px 8px;}
.expand-icon{display:inline-block;width:16px;text-align:center;color:var(--muted);font-size:10px;transition:transform .2s;margin-right:4px;}
.match-row.expanded .expand-icon{transform:rotate(90deg);}
.fav-star{cursor:pointer;font-size:18px;color:#555;transition:color .2s,transform .2s;user-select:none;}
.fav-star:hover{transform:scale(1.3);}
.fav-star.active{color:#F1C40F;text-shadow:0 0 6px rgba(241,196,15,0.5);}
.nav a.fav-nav{position:relative;}
.nav a.fav-nav .fav-count{background:#E74C3C;color:#fff;font-size:9px;font-weight:700;
  padding:1px 5px;border-radius:8px;margin-left:4px;min-width:14px;text-align:center;display:inline-block;}
.score-badge{display:inline-block;padding:2px 6px;border-radius:4px;font-size:11px;font-weight:700;margin:0 2px;}
.odds-group{display:inline-flex;gap:3px;align-items:center;}
.odds-pill{display:inline-block;padding:2px 5px;border-radius:4px;font-size:10px;font-weight:600;
  background:var(--bg3);color:var(--muted);border:1px solid var(--border);letter-spacing:0.3px;
  transition:all .15s ease;line-height:1.3;}
.odds-pill.fav{background:rgba(63,185,80,0.12);color:var(--green);border-color:rgba(63,185,80,0.3);}
.odds-pill .odds-lbl{font-size:8px;opacity:0.6;margin-right:2px;font-weight:500;}
.odds-group.imputed{opacity:0.7;}
.odds-approx{font-size:11px;color:#b22222;margin-right:2px;opacity:1;font-weight:700;}
.filter-bar{background:var(--bg2);border:1px solid var(--border);border-radius:10px;
            padding:14px 18px;margin-bottom:20px;display:flex;flex-wrap:wrap;gap:10px;align-items:end;}
.filter-bar label{color:var(--muted);font-size:11px;text-transform:uppercase;display:block;margin-bottom:3px;}
.filter-bar select{background:var(--bg3);color:var(--text);border:1px solid var(--border);
  border-radius:6px;padding:6px 10px;font-size:12px;min-width:120px;outline:none;}
.filter-bar select:focus{border-color:var(--cyan);}
.filter-bar .fbtn{background:var(--bg3);color:var(--cyan);border:1px solid var(--border);
  border-radius:6px;padding:6px 14px;font-size:12px;cursor:pointer;font-weight:600;}
.filter-bar .fbtn:hover{background:var(--border);color:var(--gold);}
.filter-stats{color:var(--muted);font-size:12px;margin:6px 0 14px;padding-left:4px;}
.filter-stats b{color:var(--cyan);}
.date-group{margin-bottom:8px;}
.date-header{background:var(--bg3);border:1px solid var(--border);border-left:4px solid var(--cyan);
  border-radius:8px;padding:12px 18px;margin:0 0 12px;font-size:18px;font-weight:700;color:var(--cyan);
  display:flex;align-items:center;justify-content:space-between;}
.match-row td{vertical-align:middle;}
.score-cell{color:var(--orange);font-weight:700;font-size:16px;
  padding:2px 10px;background:#2d1800;border-radius:6px;display:inline-block;}
.ai-brand{display:inline-flex;align-items:center;gap:8px;margin-left:16px;
  padding:5px 16px 5px 12px;border-radius:20px;
  background:linear-gradient(135deg,rgba(40,50,80,0.9),rgba(25,30,50,0.95));
  border:1px solid rgba(100,140,255,0.25);
  box-shadow:0 0 12px rgba(80,120,255,0.15),inset 0 1px 0 rgba(255,255,255,0.06);}
.ai-brand .brain{font-size:22px;filter:drop-shadow(0 0 6px rgba(100,180,255,0.5));}
.ai-brand .txt{font:700 15px 'Segoe UI',sans-serif;letter-spacing:1.5px;
  background:linear-gradient(135deg,#7eb8ff 0%,#c4a0ff 40%,#ff9cf5 70%,#7eb8ff 100%);
  background-size:200% 200%;-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;animation:brandShimmer 4s ease infinite;}
@keyframes brandShimmer{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
/* BACK BUTTON (day pages) */
.back-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;
  background:var(--bg3);border:1px solid var(--border);border-radius:10px;
  color:var(--cyan);font-weight:600;font-size:14px;text-decoration:none;
  transition:all .2s;margin-bottom:20px;}
.back-btn:hover{background:var(--bg2);border-color:var(--cyan);transform:translateX(-4px);text-decoration:none;}
.back-btn .arrow{font-size:18px;transition:transform .2s;}
.back-btn:hover .arrow{transform:translateX(-4px);}
/* DAY PAGE HEADER */
.day-page-header{background:linear-gradient(135deg,rgba(20,20,32,0.95),rgba(16,16,26,0.98));
  border:1px solid var(--border);border-radius:14px;padding:24px 28px;margin-bottom:20px;
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;}
.day-page-header .dph-title{font-size:28px;font-weight:800;color:var(--text);}
.day-page-header .dph-sub{font-size:14px;color:var(--muted);}
.day-page-header .dph-stats{display:flex;gap:8px;flex-wrap:wrap;}
.day-page-header .dph-pill{font-size:10px;font-weight:700;padding:4px 12px;border-radius:12px;letter-spacing:0.5px;}
/* NAV DAY LINKS */
.day-nav{display:flex;gap:8px;align-items:center;margin-bottom:20px;}
.day-nav a{display:inline-flex;align-items:center;gap:4px;padding:6px 14px;
  background:var(--bg3);border:1px solid var(--border);border-radius:8px;
  color:var(--muted);font-size:12px;font-weight:600;text-decoration:none;transition:all .2s;}
.day-nav a:hover{border-color:var(--cyan);color:var(--cyan);text-decoration:none;}
.day-nav a.active{background:rgba(57,210,192,0.12);border-color:var(--cyan);color:var(--cyan);}
/* DAY TABS */
.day-tabs{display:flex;gap:4px;align-items:stretch;padding:6px;margin-bottom:20px;
  background:linear-gradient(145deg,rgba(22,27,34,0.92),rgba(13,17,23,0.96));
  border:1px solid rgba(48,54,61,0.6);border-radius:14px;
  box-shadow:0 4px 24px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.03);
  overflow-x:auto;scrollbar-width:thin;scrollbar-color:var(--border) transparent;
  position:relative;}
.day-tabs::after{content:'';position:absolute;bottom:0;left:20px;right:20px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(57,210,192,0.15),rgba(88,166,255,0.15),transparent);}
.day-tab{display:inline-flex;flex-direction:column;align-items:center;gap:2px;
  padding:10px 22px;background:transparent;border:1px solid transparent;
  border-radius:10px;color:var(--muted);font-size:12px;font-weight:600;
  text-decoration:none;transition:all .25s ease;white-space:nowrap;min-width:90px;
  position:relative;}
.day-tab:hover{background:rgba(255,255,255,0.04);border-color:rgba(48,54,61,0.8);
  color:var(--text);text-decoration:none;transform:translateY(-1px);}
.day-tab.active{background:linear-gradient(145deg,rgba(57,210,192,0.1),rgba(88,166,255,0.08));
  border-color:rgba(57,210,192,0.35);color:var(--cyan);
  box-shadow:0 0 16px rgba(57,210,192,0.1),inset 0 1px 0 rgba(57,210,192,0.1);}
.day-tab .dt-label{font-size:11px;font-weight:600;letter-spacing:0.3px;text-transform:uppercase;}
.day-tab .dt-count{font-size:22px;font-weight:900;line-height:1;
  background:linear-gradient(180deg,currentColor 30%,rgba(255,255,255,0.5));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.day-tab .dt-sub{font-size:9px;opacity:0.5;letter-spacing:0.5px;text-transform:uppercase;}
.day-tab.dt-overview{flex-direction:row;gap:6px;min-width:auto;padding:10px 16px;
  border-right:1px solid rgba(48,54,61,0.5);margin-right:4px;}
.day-tab.dt-overview:hover{color:var(--cyan);}
/* Responsive */
@media(max-width:768px){
  /* Nav — vertical stacking */
  .nav{padding:0;gap:0;flex-direction:column;align-items:stretch;}
  /* Row 1: brand centered */
  .nav-brand{display:flex;align-items:center;justify-content:center;gap:12px;
    padding:10px 12px 8px;border-bottom:1px solid var(--border);}
  .nav .logo{margin-left:0;order:0;}
  .nav .logo .brand-mark{width:32px;height:32px;}
  .nav .logo .brand-name{font-size:18px;letter-spacing:2px;}
  .nav .logo .brand-div{height:20px;}
  .ai-brand{padding:3px 10px 3px 8px;margin-left:0;order:0;}
  .ai-brand .brain{font-size:18px;}
  .ai-brand .txt{font-size:13px;letter-spacing:1.2px;}
  /* Row 2: nav links centered */
  .nav-links{display:flex;align-items:center;justify-content:center;gap:2px;
    padding:6px 10px;border-bottom:1px solid var(--border);}
  .nav a{padding:4px 8px;font-size:11px;}
  /* Row 3: controls — TZ + Lang + date on one row */
  .nav-controls{display:flex;align-items:center;justify-content:center;gap:8px;
    padding:6px 10px;flex-wrap:wrap;}
  .nav-meta{margin-left:0;order:0;}
  .nav-meta>span{font-size:11px;}
  /* Hero / Showcase */
  .showcase{padding:30px 14px 18px;}
  .voxnar-corner{top:4px !important;right:8px !important;gap:1px !important;}
  .voxnar-corner span:first-child{font-size:12px !important;}
  .voxnar-corner a{font-size:8px !important;}
  .hero-row{gap:14px;}
  .hero-left{min-width:0;}
  .hero-left h1{font-size:24px;line-height:1.45;}
  .hero-sub{font-size:12px;margin-bottom:8px;}
  .hero-right{min-width:0;gap:8px;padding-top:10px;}
  .trust-card{width:calc(50% - 6px);min-width:0;padding:10px 8px;}
  .trust-card .tc-icon{font-size:18px;}
  .trust-card .tc-title{font-size:11px;}
  .trust-card .tc-desc{font-size:10px;}
  /* Day grid (index page) */
  .day-grid{grid-template-columns:1fr;}
  .day-card .dc-count{font-size:36px;}
  /* Day tabs (day pages) */
  .day-nav{overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:4px;}
  .day-tabs{flex-wrap:nowrap;}
  .day-tab{min-width:60px;padding:8px 10px;}
  .day-tab .dt-count{font-size:18px;}
  .day-tab .dt-label{font-size:9px;}
  .day-tab .dt-sub{font-size:8px;}
  /* Filters — compact 2-col grid on mobile */
  .filter-bar{display:grid;grid-template-columns:1fr 1fr;padding:10px 10px;gap:6px 8px;}
  .filter-bar>div{min-width:0;}
  .filter-bar label{font-size:10px;margin-bottom:2px;}
  .filter-bar select{width:100%;min-width:0;padding:5px 8px;font-size:11px;}
  .filter-bar .fbtn{width:100%;text-align:center;padding:5px 10px;font-size:11px;}
  /* Table — FlashScore card layout */
  .date-group{overflow-x:hidden;}
  .date-header{font-size:14px;padding:8px 12px;}
  table{display:block;width:100%;border-collapse:collapse;}
  table>tbody{display:block;}
  /* Hide header row (th) */
  table>tbody>tr:first-child{display:none;}
  /* Match card: 3-row grid */
  tr.match-row{display:grid !important;
    grid-template-columns:28px 1fr auto;
    grid-template-rows:auto auto auto;
    padding:7px 8px;gap:1px 6px;align-items:center;
    border-bottom:1px solid var(--border);cursor:pointer;}
  tr.match-row:hover{background:var(--bg3);}
  /* td1: ★ star — col1, spans all rows */
  tr.match-row>td:nth-child(1){grid-row:1/4;grid-column:1;
    text-align:center;padding:0;border:0;align-self:center;}
  /* td2: ► Time — row1, col2 */
  tr.match-row>td:nth-child(2){grid-row:1;grid-column:2;
    padding:0 0 2px;border:0;font-size:11px;}
  /* td3: Home team — row2, col2 */
  tr.match-row>td:nth-child(3){grid-row:2;grid-column:2;
    text-align:left !important;padding:1px 0;border:0;font-size:13px;}
  /* td4: Score — row2-3, col3, vertically centered */
  tr.match-row>td:nth-child(4){grid-row:2/4;grid-column:3;
    text-align:center;align-self:center;padding:0 4px;border:0;}
  /* td5: Away team — row3, col2 */
  tr.match-row>td:nth-child(5){grid-row:3;grid-column:2;
    text-align:left;padding:1px 0;border:0;font-size:13px;}
  /* td6: Odds — row1, col3 */
  tr.match-row>td:nth-child(6){grid-row:1;grid-column:3;
    text-align:right !important;padding:0;border:0;}
  /* td7-11: hidden */
  tr.match-row>td:nth-child(n+7){display:none;}
  /* Detail row — full width block */
  tr.detail-row{display:none !important;}
  tr.detail-row.open{display:block !important;}
  tr.detail-row>td{display:block;padding:0;border:0;}
  /* Compact elements */
  .team-logo{width:18px;height:18px;margin:0 3px 0 0;vertical-align:middle;}
  .fav-star{font-size:16px;}
  .expand-icon{width:12px;font-size:9px;margin-right:3px;}
  .score-cell{font-size:15px;font-weight:700;padding:2px 6px;}
  .odds-pill{font-size:8px;padding:1px 3px;}
  .odds-pill .odds-lbl{font-size:6px;}
  .odds-group{gap:2px;}
  /* Detail panel */
  .detail-panel{padding:8px 6px;margin:2px 2px 6px;}
  /* ── Detail-panel mobile cascade (dp-*) ── */
  .dp-wrap{flex-direction:column;gap:8px;}
  .dp-svg{flex:0 0 auto;min-height:0;width:100%;max-width:100%;overflow:hidden;}
  .dp-svg svg{max-width:100%;height:auto;}
  .dp-cards{min-width:0;gap:6px;}
  .dp-card{padding:8px 10px;}
  .dp-card-h{margin-bottom:4px;}
  .dp-sc{font-size:18px;}
  .dp-st{flex-wrap:wrap;gap:4px;padding:3px 5px;}
  .dp-st-txt{font-size:10px;}
  .dp-axl{width:55px;font-size:10px;}
  .dp-box{padding:8px;margin-top:6px;}
  .dp-bh{flex-direction:column !important;align-items:center !important;gap:4px;}
  .dp-f16{flex-direction:column;gap:8px;}
  .dp-col{min-width:0;}
  .dp-col{text-align:center;}
  .dp-atbl{font-size:10px !important;width:auto !important;max-width:290px !important;margin-left:auto !important;margin-right:auto !important;display:table !important;border-collapse:separate !important;border-spacing:6px 0;}
  .dp-ath{padding:5px 8px !important;font-size:9px;letter-spacing:0.5px;}
  .dp-atd{padding:5px 8px !important;}
  .dp-rm{margin-top:6px;}
  .dp-rmh{padding:8px 10px;}
  .dp-rmg{grid-template-columns:1fr;gap:4px;padding:6px;}
  .dp-rmcw{grid-column:1;}
  .dp-rmc{padding:6px 4px 4px;}
  .dp-duel{flex-wrap:nowrap;}
  .dp-duel-p{padding:2px 6px;}
  .dp-duel-s{padding:1px 6px;}
  .dp-duel-vp{min-width:24%;font-size:9px;}
  .dp-duel-v{min-width:24%;font-size:8px;}
  .dp-dl{font-size:7px;}
  .dp-mp{gap:1px 6px;padding:1px 4px;}
  .dp-mpl{font-size:6px;}
  .dp-note{padding:8px 10px;font-size:10px;margin-top:8px;}
  .dp-xbar{height:24px;}
  .dp-xvh,.dp-xva{font-size:12px;}
  .dp-pr{height:16px;}
  .dp-pl{width:42px;font-size:8px;}
  .dp-pbg{height:6px;}
  .dp-pv{width:34px;font-size:8px;}
  .dp-ar{height:14px;}
  .dp-abg{height:6px;}
  .dp-av{width:36px;font-size:8px;}
  .dp-axr{height:12px;}
  .dp-axrl{width:42px;font-size:7px;}
  .dp-axrb{height:4px;}
  .dp-axrv{width:36px;font-size:7px;}
  .dp-leg{gap:8px;font-size:7px;}
  .dp-sh{font-size:8px;}
  .dp-st2{font-size:9px !important;text-align:center !important;}
  .dp-nms{font-size:8px;}
  .dp-early{padding:3px 6px;gap:4px;}
  /* Live badge */
  .live-badge{font-size:8px;padding:2px 7px 2px 6px;margin-top:2px;max-width:calc(100% - 100px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .live-badge .pulse-dot{width:5px;height:5px;margin-right:4px;}
}
/* INFO PAGE */
.info-page{max-width:860px;margin:0 auto;padding:32px 20px 60px;}
.info-hero{text-align:center;margin-bottom:40px;}
.info-hero .info-icon{font-size:56px;margin-bottom:12px;filter:drop-shadow(0 0 18px rgba(88,166,255,0.3));}
.info-hero h1{font-size:32px;font-weight:800;
  background:linear-gradient(135deg,#ffffff 0%,#a8d8ff 50%,#58a6ff 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:6px;}
.info-hero .info-sub{font-size:14px;color:var(--muted);}
.info-card{background:linear-gradient(145deg,rgba(22,27,34,0.95),rgba(16,20,30,0.98));
  border:1px solid var(--border);border-radius:16px;padding:28px 28px 24px;
  margin-bottom:20px;position:relative;overflow:hidden;transition:border-color .3s;}
.info-card:hover{border-color:rgba(88,166,255,0.25);}
.info-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;border-radius:16px 16px 0 0;opacity:0.7;}
.info-card.card-about::before{background:linear-gradient(90deg,var(--cyan),var(--blue));}
.info-card.card-rules::before{background:linear-gradient(90deg,var(--green),var(--cyan));}
.info-card.card-disclaimer::before{background:linear-gradient(90deg,var(--orange),var(--gold));}
.info-card.card-contact::before{background:linear-gradient(90deg,var(--purple),var(--blue));}
.info-card.card-howto::before{background:linear-gradient(90deg,var(--gold),var(--green));}
.info-card .ic-head{display:flex;align-items:center;gap:12px;margin-bottom:16px;}
.info-card .ic-emoji{font-size:28px;}
.info-card .ic-title{font-size:18px;font-weight:700;color:var(--text);}
.info-card .ic-body{font-size:13px;color:var(--muted);line-height:1.75;}
.info-card .ic-body strong{color:var(--text);}
.info-card .ic-body ul{margin:10px 0 10px 20px;}
.info-card .ic-body li{margin-bottom:6px;}
.info-card .ic-body li::marker{color:var(--cyan);}
.nav-info{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;
  border-radius:50%;background:rgba(88,166,255,0.08);border:1px solid rgba(88,166,255,0.2);
  color:var(--blue);font-size:16px;font-weight:700;font-family:Georgia,serif;
  text-decoration:none !important;transition:all .25s;cursor:pointer;margin:0 4px;}
.nav-info:hover{background:rgba(88,166,255,0.18);border-color:rgba(88,166,255,0.5);
  box-shadow:0 0 12px rgba(88,166,255,0.2);transform:scale(1.1);text-decoration:none !important;}
.info-steps{display:flex;flex-direction:column;gap:0;margin:16px 0 8px;position:relative;}
.info-steps::before{content:'';position:absolute;left:22px;top:28px;bottom:28px;width:2px;
  background:linear-gradient(180deg,var(--gold),var(--green),var(--cyan));border-radius:2px;opacity:0.35;}
.info-step{display:flex;gap:16px;align-items:flex-start;padding:12px 0;position:relative;}
.info-step .step-num{flex-shrink:0;width:44px;height:44px;border-radius:50%;display:flex;
  align-items:center;justify-content:center;font-size:20px;font-weight:800;
  background:linear-gradient(145deg,rgba(22,27,34,0.95),rgba(30,35,45,0.95));
  border:2px solid var(--border);color:var(--gold);z-index:1;
  box-shadow:0 2px 12px rgba(0,0,0,0.3);transition:border-color .3s,transform .3s;}
.info-step:hover .step-num{border-color:var(--gold);transform:scale(1.1);}
.info-step .step-body{flex:1;padding-top:8px;}
.info-step .step-title{font-size:14px;font-weight:700;color:var(--text);margin-bottom:4px;}
.info-step .step-desc{font-size:12px;color:var(--muted);line-height:1.6;}
.info-step .step-desc strong{color:var(--text);}
.info-highlight{margin-top:16px;padding:14px 18px;background:linear-gradient(135deg,rgba(255,215,0,0.06),rgba(57,210,192,0.06));
  border:1px solid rgba(255,215,0,0.15);border-radius:12px;font-size:12px;color:var(--muted);line-height:1.7;}
.info-highlight strong{color:var(--gold);}
.tg-gate-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.75);
  backdrop-filter:blur(6px);z-index:9999;display:flex;align-items:center;justify-content:center;
  opacity:0;transition:opacity .3s;pointer-events:none;}
.tg-gate-overlay.active{opacity:1;pointer-events:auto;}
.tg-gate{background:linear-gradient(180deg,#1a2035 0%,#141824 100%);border-radius:16px;
  border:1px solid rgba(88,166,255,0.15);padding:32px;max-width:480px;width:90%;
  box-shadow:0 24px 64px rgba(0,0,0,0.6);transform:translateY(20px) scale(0.97);transition:transform .3s;}
.tg-gate-overlay.active .tg-gate{transform:translateY(0) scale(1);}
.tg-gate-icon{text-align:center;font-size:40px;margin-bottom:12px;}
.tg-gate-title{text-align:center;font-size:17px;font-weight:800;color:var(--text);margin-bottom:12px;}
.tg-gate-text{font-size:12px;color:var(--muted);line-height:1.7;margin-bottom:16px;text-align:center;}
.tg-gate-info{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:20px;
  padding:10px 16px;background:rgba(88,166,255,0.06);border:1px solid rgba(88,166,255,0.15);
  border-radius:10px;cursor:pointer;text-decoration:none !important;transition:all .25s;
  color:var(--blue);font-size:13px;font-weight:600;}
.tg-gate-info:hover{background:rgba(88,166,255,0.12);border-color:rgba(88,166,255,0.3);
  box-shadow:0 0 16px rgba(88,166,255,0.15);}
.tg-gate-check{display:flex;align-items:flex-start;gap:10px;cursor:pointer;
  padding:12px 14px;background:rgba(255,215,0,0.04);border:1px solid rgba(255,215,0,0.1);
  border-radius:10px;transition:border-color .25s;margin-bottom:20px;}
.tg-gate-check:hover{border-color:rgba(255,215,0,0.25);}
.tg-gate-check input[type="checkbox"]{width:18px;height:18px;margin-top:2px;accent-color:var(--gold);cursor:pointer;flex-shrink:0;}
.tg-gate-check label{font-size:11px;color:var(--muted);line-height:1.6;cursor:pointer;}
.tg-gate-check label strong{color:var(--gold);}
.tg-gate-btns{display:flex;gap:10px;justify-content:center;}
.tg-gate-btn{padding:10px 24px;border-radius:10px;font-size:13px;font-weight:700;cursor:pointer;
  border:none;transition:all .25s;}
.tg-gate-btn.primary{background:linear-gradient(135deg,#2ea6ff,#0d8fec);color:#fff;
  opacity:0.35;pointer-events:none;}
.tg-gate-btn.primary.enabled{opacity:1;pointer-events:auto;}
.tg-gate-btn.primary.enabled:hover{box-shadow:0 4px 20px rgba(46,166,255,0.4);transform:translateY(-1px);}
.tg-gate-btn.secondary{background:rgba(255,255,255,0.06);color:var(--muted);
  border:1px solid rgba(255,255,255,0.08);}
.tg-gate-btn.secondary:hover{background:rgba(255,255,255,0.1);}
.tg-ch-step{text-align:center;}
.tg-ch-title{font-size:16px;font-weight:800;color:var(--text);margin-bottom:6px;}
.tg-ch-sub{font-size:11px;color:var(--muted);margin-bottom:20px;line-height:1.6;}
.tg-ch-cards{display:flex;gap:14px;justify-content:center;margin-bottom:20px;}
.tg-ch-card{flex:1;max-width:180px;padding:20px 16px;background:rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.08);border-radius:14px;cursor:pointer;
  transition:all .3s;text-align:center;position:relative;overflow:hidden;}
.tg-ch-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;
  border-radius:14px 14px 0 0;opacity:0;transition:opacity .3s;}
.tg-ch-card:first-child::before{background:linear-gradient(90deg,#2ea6ff,#58a6ff);}
.tg-ch-card:last-child::before{background:linear-gradient(90deg,#e74c3c,#ff6b6b);}
.tg-ch-card:hover{border-color:rgba(88,166,255,0.3);background:rgba(88,166,255,0.06);
  transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,0.3);}
.tg-ch-card:hover::before{opacity:1;}
.tg-ch-flag{font-size:36px;margin-bottom:10px;display:block;}
.tg-ch-lang{font-size:13px;font-weight:700;color:var(--text);margin-bottom:4px;}
.tg-ch-desc{font-size:10px;color:var(--muted);line-height:1.5;}
.age-badge{display:inline-flex;align-items:center;justify-content:center;width:30px;height:20px;
  border-radius:5px;background:linear-gradient(135deg,#e74c3c,#c0392b);color:#fff;
  font-size:10px;font-weight:900;font-family:system-ui,sans-serif;letter-spacing:-0.3px;
  border:1px solid rgba(231,76,60,0.5);box-shadow:0 1px 6px rgba(231,76,60,0.25);
  user-select:none;flex-shrink:0;margin:0 4px;line-height:1;}
.info-card.card-copyright::before{background:linear-gradient(90deg,#e74c3c,#e67e22);}
/* ── Detail-panel classes (dp-*) ── */
.dp-wrap{display:flex;gap:20px;flex-wrap:wrap;align-items:stretch}
.dp-svg{flex:0 0 340px;min-height:400px}
.dp-cards{flex:1;min-width:200px;display:flex;flex-direction:column;gap:8px}
.dp-card{background:#1e1e2a;border-radius:8px;padding:10px 12px}
.dp-card-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.dp-nm{color:#DDE;font-size:11px;font-weight:600}
.dp-sc{font-size:20px;font-weight:bold}
.dp-sbar{display:flex;align-items:center;gap:6px;margin-bottom:8px}
.dp-sbg{flex:1;background:#32323C;border-radius:3px;height:6px;position:relative;overflow:hidden}
.dp-sfill{height:100%;background:linear-gradient(90deg,#E74C3C 0%,#E67E22 30%,#F39C12 45%,#3498DB 55%,#2ECC71 100%);border-radius:3px}
.dp-st{display:flex;align-items:center;gap:6px;margin-bottom:6px;padding:4px 6px;background:#16161e;border-radius:4px}
.dp-pos{color:#fff;font-size:12px;font-weight:bold;padding:2px 6px;border-radius:3px;min-width:24px;text-align:center}
.dp-st-txt{color:#A0A5B8;font-size:11px}
.dp-early{display:flex;align-items:center;gap:6px;padding:4px 8px;margin-top:2px;background:#F39C120D;border:1px dashed #F39C1240;border-radius:4px}
.dp-ebar{flex:1;background:#32323C;border-radius:2px;height:4px;overflow:hidden}
.dp-ax{display:flex;align-items:center;gap:4px;margin:2px 0}
.dp-axl{width:70px;font-size:11px;color:#A0A5B8}
.dp-axb{flex:1;background:#2a2a3a;border-radius:2px;height:5px}
.dp-axv{width:30px;text-align:right;font-size:11px;font-weight:bold}
.dp-box{background:#14141c;border-radius:8px;padding:12px;margin-top:8px}
.dp-bh{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.dp-bt{color:#A0A5B8;font-size:11px;font-weight:600}
.dp-xbar{background:#23232f;border-radius:6px;height:28px;position:relative;margin-bottom:4px}
.dp-xfh{position:absolute;left:0;top:0;height:100%;background:linear-gradient(90deg,rgba(52,152,219,0.7),rgba(52,152,219,0.3));border-radius:6px}
.dp-xfa{position:absolute;right:0;top:0;height:100%;background:linear-gradient(270deg,rgba(243,156,18,0.7),rgba(243,156,18,0.3));border-radius:6px}
.dp-xvh{position:absolute;left:8px;top:4px;color:#DCE6F5;font-weight:bold;font-size:14px}
.dp-xva{position:absolute;right:8px;top:4px;color:#FFE6C8;font-weight:bold;font-size:14px}
.dp-nms{display:flex;justify-content:space-between;font-size:9px;margin-bottom:10px}
.dp-f16{display:flex;gap:16px;flex-wrap:wrap}
.dp-col{flex:1;min-width:200px}
.dp-st2{color:#A0A5B8;font-size:10px;font-weight:600;text-align:center;margin-bottom:4px}
.dp-sh{color:#82829A;font-size:9px;font-weight:600;margin:6px 0 2px}
.dp-pr{display:flex;align-items:center;margin:2px 0;height:18px;gap:4px}
.dp-pl{width:50px;font-size:9px;color:#C8C8D6}
.dp-pbg{flex:1;background:#23232f;border-radius:3px;height:8px;position:relative}
.dp-pv{width:40px;text-align:right;font-size:9px;font-weight:bold}
.dp-ar{display:flex;align-items:center;margin:2px 0 0;height:16px;gap:4px}
.dp-abg{flex:1;background:#23232f;border-radius:3px;height:7px;position:relative}
.dp-av{width:42px;text-align:right;font-size:9px;font-weight:bold}
.dp-axr{display:flex;align-items:center;margin:0 0 2px;height:14px;gap:4px}
.dp-axrl{width:50px;font-size:8px;color:#555}
.dp-axrb{flex:1;background:#23232f;border-radius:3px;height:5px;position:relative}
.dp-axrv{width:42px;text-align:right;font-size:8px}
.dp-leg{display:flex;gap:12px;justify-content:flex-end;margin-top:8px;font-size:8px;align-items:center}
.dp-legi{display:flex;align-items:center;gap:3px}
.dp-atbl{width:100%;border-collapse:collapse;font-size:10px}
.dp-ath{color:#82829A;text-align:center;padding:3px;font-weight:600}
.dp-atd{text-align:center;padding:3px}
.dp-rm{background:#0e0e16;border-radius:10px;padding:0;margin-top:10px;border:1px solid rgba(255,255,255,0.05);overflow:hidden}
.dp-rmh{display:flex;justify-content:space-between;align-items:center;padding:10px 14px}
.dp-rmg{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:8px}
.dp-rmc{background:rgba(255,255,255,0.015);border-radius:8px;padding:8px 6px 6px;overflow:hidden}
.dp-rmcw{grid-column:1/-1;background:rgba(255,255,255,0.015);border-radius:8px;padding:8px 6px 6px;overflow:hidden}
.dp-rmct{color:#6b7194;font-size:7.5px;font-weight:700;letter-spacing:1.8px;text-transform:uppercase;margin-bottom:5px;padding:0 8px}
.dp-duel{position:relative;display:flex;align-items:center;border-radius:3px;margin:1px 0;background:rgba(255,255,255,0.012)}
.dp-duel-p{padding:3px 8px}
.dp-duel-s{padding:2px 8px}
.dp-duel-vp{position:relative;min-width:28%;font-size:10px}
.dp-duel-v{position:relative;min-width:28%;font-size:9px}
.dp-duel-vh{text-align:right}
.dp-duel-va{text-align:left}
.dp-dl{position:relative;flex:1;text-align:center;font-size:8px;font-weight:600;letter-spacing:0.4px;text-transform:uppercase}
.dp-mp{display:flex;flex-wrap:wrap;gap:2px 12px;padding:2px 8px;justify-content:center}
.dp-mpc{display:flex;align-items:baseline;gap:3px;padding:1px 0}
.dp-mpl{color:#3e4260;font-size:7px;font-weight:600;letter-spacing:0.3px;text-transform:uppercase}
.dp-sep{height:1px;background:rgba(255,255,255,0.03);margin:2px 8px}
.dp-note{margin-top:14px;padding:10px 12px;background:rgba(88,166,255,0.06);border-left:3px solid var(--blue);border-radius:6px;font-size:11px;color:var(--muted);line-height:1.55}