/* Agency Leaderboard v2 — modern dashboard theme (light/dark), per-org accent via --accent. */
:root{
  --accent:#6366f1;
  --accent-2:color-mix(in oklab, var(--accent) 55%, #ec4899);
  --grad:linear-gradient(135deg, var(--accent) 0%, var(--accent-2) 100%);
  --radius:16px; --radius-sm:10px;
  --ease:cubic-bezier(.2,.8,.2,1);
}
html[data-theme="light"]{
  color-scheme:light;
  --bg:#f4f5fb; --bg-2:#eef0fa; --surface:#ffffff; --surface-2:#f7f8fc; --text:#0f1222; --text-2:#4a4f67; --muted:#8a8fa8;
  --border:rgba(15,18,34,.08); --grid:rgba(15,18,34,.06); --shadow:0 1px 2px rgba(15,18,34,.04),0 8px 24px -12px rgba(15,18,34,.14);
  --shadow-hover:0 2px 4px rgba(15,18,34,.05),0 18px 40px -16px rgba(15,18,34,.25);
  --good:#059669; --good-soft:rgba(5,150,105,.12); --warn:#dc2626; --warn-soft:rgba(220,38,38,.08); --notice:#fff8e6; --notice-border:#f1d48a;
  --chip:#eceefa;
}
html[data-theme="dark"]{
  color-scheme:dark;
  --bg:#090b14; --bg-2:#0f1220; --surface:#131729; --surface-2:#191e34; --text:#eef0ff; --text-2:#b3b8d4; --muted:#7c82a3;
  --border:rgba(255,255,255,.07); --grid:rgba(255,255,255,.06); --shadow:0 1px 2px rgba(0,0,0,.4),0 10px 30px -14px rgba(0,0,0,.7);
  --shadow-hover:0 2px 6px rgba(0,0,0,.5),0 22px 44px -18px rgba(0,0,0,.9);
  --good:#34d399; --good-soft:rgba(52,211,153,.14); --warn:#f87171; --warn-soft:rgba(248,113,113,.12); --notice:#231d0c; --notice-border:#6b5620;
  --chip:#1c2138;
}
*{box-sizing:border-box;margin:0;}
body{background:radial-gradient(1200px 500px at 10% -10%, color-mix(in oklab, var(--accent) 12%, transparent), transparent 60%),radial-gradient(900px 400px at 100% 0%, color-mix(in oklab, var(--accent-2) 10%, transparent), transparent 60%),var(--bg);
  background-attachment:fixed; color:var(--text); font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; font-size:14px; line-height:1.45; min-height:100vh; -webkit-font-smoothing:antialiased;}
a{color:var(--accent); text-decoration:none;} a:hover{text-decoration:underline;}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}
.page{max-width:1320px; margin:0 auto; padding:8px 22px 64px;}
/* ---------- app bar ---------- */
.appbar{position:sticky; top:0; z-index:20; display:flex; align-items:center; gap:14px; padding:12px 22px; backdrop-filter:saturate(1.4) blur(14px); -webkit-backdrop-filter:saturate(1.4) blur(14px);
  background:color-mix(in oklab, var(--bg) 78%, transparent); border-bottom:1px solid var(--border);}
.brand{display:flex; align-items:center; gap:11px; color:inherit; margin-right:auto; min-width:0;}
.brand:hover{text-decoration:none;}
.logo{width:38px; height:38px; border-radius:11px; object-fit:contain; flex:none;}
.mono-logo{display:grid; place-items:center; background:var(--grad); color:#fff; font-weight:800; letter-spacing:.02em; box-shadow:0 6px 16px -6px var(--accent);}
.brand-name{font-weight:750; font-size:16px; letter-spacing:-.01em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.brand-sub{font-size:11.5px; color:var(--muted);}
.appbar-actions{display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.appbar-actions form{display:inline;}
.iconbtn{font:inherit; font-size:13px; font-weight:600; display:inline-flex; align-items:center; gap:4px; padding:7px 11px; border-radius:10px; border:1px solid var(--border); background:var(--surface); color:var(--text-2); cursor:pointer; transition:all .18s var(--ease);}
.iconbtn:hover{color:var(--text); border-color:color-mix(in oklab, var(--accent) 40%, var(--border)); text-decoration:none; transform:translateY(-1px);}
.switcher select{min-width:220px; font-weight:600;}
.subnav{display:flex; gap:4px; padding:10px 22px 0; max-width:1320px; margin:0 auto; overflow-x:auto; scrollbar-width:none;}
.subnav a{padding:7px 13px; border-radius:999px; color:var(--text-2); font-weight:600; font-size:13px; white-space:nowrap; transition:background .18s;}
.subnav a:hover{background:var(--chip); text-decoration:none;}
.subnav a[aria-current="page"]{background:var(--grad); color:#fff; box-shadow:0 6px 16px -8px var(--accent);}
.crumbs{max-width:1320px; margin:0 auto; padding:14px 22px 0; font-size:13px; color:var(--muted); display:flex; gap:8px; align-items:center; flex-wrap:wrap;}
.crumbs a{color:var(--text-2); font-weight:600;} .crumbs [aria-current]{color:var(--text); font-weight:700;} .crumbs .sep{opacity:.6;}
.banner-demo{max-width:1276px; margin:12px auto 0; padding:9px 14px; border-radius:12px; font-size:13px; color:var(--text-2); background:linear-gradient(90deg, color-mix(in oklab, var(--accent) 12%, var(--surface)), color-mix(in oklab, var(--accent-2) 10%, var(--surface))); border:1px dashed color-mix(in oklab, var(--accent) 35%, transparent);}
/* ---------- hero + toolbar ---------- */
.hero{position:relative; overflow:hidden; border-radius:22px; padding:22px 26px; margin:14px 0 14px; color:#fff; background:var(--grad); box-shadow:0 20px 50px -26px var(--accent);}
.hero::before,.hero::after{content:""; position:absolute; border-radius:50%; background:rgba(255,255,255,.12);}
.hero::before{width:280px; height:280px; right:-60px; top:-120px;} .hero::after{width:180px; height:180px; right:180px; bottom:-120px; background:rgba(255,255,255,.08);}
.hero h1{font-size:26px; font-weight:800; letter-spacing:-.02em; position:relative;}
.hero-sub{opacity:.88; margin-top:3px; position:relative;}
.toolbar{display:flex; flex-wrap:wrap; gap:10px 16px; align-items:center; justify-content:space-between; margin:0 0 16px;}
.chips{display:flex; gap:6px; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; padding:2px;}
.chip{font:inherit; font-size:13px; font-weight:650; padding:7px 14px; border-radius:999px; border:1px solid var(--border); background:var(--surface); color:var(--text-2); cursor:pointer; white-space:nowrap; transition:all .18s var(--ease);}
.chip:hover{border-color:color-mix(in oklab, var(--accent) 45%, var(--border)); color:var(--text);}
.chip[aria-selected="true"]{background:var(--grad); color:#fff; border-color:transparent; box-shadow:0 8px 18px -10px var(--accent);}
.range{display:none; gap:8px; align-items:center;} .range.show{display:flex;}
.status{display:flex; gap:10px; align-items:center; color:var(--text-2); font-size:12.5px; flex-wrap:wrap;}
.plabel{font-weight:650; color:var(--text);}
/* ---------- cards & grids ---------- */
.card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:18px 18px 16px; box-shadow:var(--shadow); margin-bottom:16px;}
.card h2{font-size:15px; font-weight:750; letter-spacing:-.01em; display:flex; align-items:center; gap:8px;}
.card h2 .tag{font-size:11px; font-weight:650; color:var(--muted); background:var(--chip); padding:2px 8px; border-radius:999px;}
.card-head{display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:12px; flex-wrap:wrap;}
.note{color:var(--muted); font-size:12.5px; line-height:1.55;}
.content{display:block;}
.grid2{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px;}
.grid3{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px;}
.grid-21{display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:16px;}
.grid2>.card,.grid3>.card,.grid-21>.card{margin-bottom:0;}
.stack{display:flex; flex-direction:column; gap:16px; margin-bottom:16px;}
.row{display:flex; gap:8px; align-items:center; flex-wrap:wrap;} .between{justify-content:space-between;}
/* ---------- KPI tiles ---------- */
.kpis{display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:14px; margin-bottom:16px;}
.tile{position:relative; overflow:hidden; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:15px 16px 12px; box-shadow:var(--shadow); transition:transform .2s var(--ease), box-shadow .2s var(--ease);}
.tile:hover{transform:translateY(-2px); box-shadow:var(--shadow-hover);}
.tile .ico{width:32px; height:32px; border-radius:10px; display:grid; place-items:center; font-size:16px; background:color-mix(in oklab, var(--accent) 14%, transparent); margin-bottom:8px;}
.tile .label{font-size:12px; color:var(--text-2); font-weight:600;}
.tile .value{font-size:26px; font-weight:800; letter-spacing:-.02em; margin-top:2px; font-variant-numeric:tabular-nums; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.tile .sub{font-size:12px; color:var(--muted); margin-top:1px;}
.tile svg.spark{display:block; width:100%; height:38px; margin-top:6px;}
.tile.accent{background:var(--grad); color:#fff; border-color:transparent;} .tile.accent .label,.tile.accent .sub{color:rgba(255,255,255,.85);} .tile.accent .ico{background:rgba(255,255,255,.18);}
/* ---------- progress ---------- */
.progress{position:relative; height:9px; border-radius:999px; background:var(--chip); overflow:visible; margin-top:8px;}
.progress .fill{position:absolute; left:0; top:0; bottom:0; border-radius:999px; background:var(--grad); width:0; transition:width .9s var(--ease);}
.progress .fill.done{background:linear-gradient(90deg,#10b981,#34d399);}
.progress .pace{position:absolute; top:-3px; bottom:-3px; width:2px; background:var(--text); opacity:.45; border-radius:2px;}
.tile.accent .progress{background:rgba(255,255,255,.25);} .tile.accent .progress .fill{background:#fff;} .tile.accent .progress .pace{background:#fff;}
.progress.sm{height:6px; margin-top:5px;}
.goaltext{display:flex; justify-content:space-between; font-size:11.5px; color:var(--muted); margin-top:5px;}
.onpace{color:var(--good); font-weight:650;} .offpace{color:var(--warn); font-weight:650;}
/* ---------- podium ---------- */
.podium{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) minmax(0,1fr); gap:12px; align-items:end;}
.pod{position:relative; text-align:center; border-radius:18px; padding:16px 10px 14px; background:var(--surface-2); border:1px solid var(--border); cursor:pointer; transition:transform .22s var(--ease), box-shadow .22s var(--ease);}
.pod:hover{transform:translateY(-4px); box-shadow:var(--shadow-hover);}
.pod.p1{padding-top:22px; padding-bottom:22px; background:linear-gradient(180deg, color-mix(in oklab, #f5b301 18%, var(--surface)), var(--surface)); border-color:color-mix(in oklab, #f5b301 40%, var(--border));}
.pod.p2{background:linear-gradient(180deg, color-mix(in oklab, #a3aec2 22%, var(--surface)), var(--surface));}
.pod.p3{background:linear-gradient(180deg, color-mix(in oklab, #d08a4a 20%, var(--surface)), var(--surface));}
.pod .medal{font-size:26px; line-height:1;} .pod.p1 .medal{font-size:34px;}
.pod .avatar{margin:8px auto 8px; width:64px; height:64px; font-size:22px; box-shadow:0 10px 24px -12px rgba(0,0,0,.5);} .pod.p1 .avatar{width:80px; height:80px; font-size:27px;}
.pod .pname{font-weight:750; font-size:14.5px;} .pod .pag{font-size:11.5px; color:var(--muted); margin-top:1px;}
.pod .pval{font-size:20px; font-weight:800; letter-spacing:-.02em; margin-top:6px; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent;}
.pod.p1 .pval{font-size:25px;}
.pod .psub{font-size:12px; color:var(--text-2);}
.avatar{display:inline-grid; place-items:center; width:32px; height:32px; border-radius:50%; color:#fff; font-weight:750; font-size:12.5px; flex:none; letter-spacing:.02em; text-shadow:0 1px 1px rgba(0,0,0,.2);}
/* ---------- tables ---------- */
.tablewrap{overflow-x:auto; -webkit-overflow-scrolling:touch;}
table{width:100%; border-collapse:separate; border-spacing:0; font-size:13px;}
th{text-align:right; color:var(--muted); font-weight:650; font-size:11.5px; text-transform:uppercase; letter-spacing:.04em; padding:8px 10px; border-bottom:1px solid var(--border); white-space:nowrap;}
th.sortable{cursor:pointer; user-select:none;} th.sortable:hover,th.active{color:var(--text);} th.active::after{content:" ▾";}
th.l,td.l{text-align:left;}
td{padding:9px 10px; border-bottom:1px solid var(--grid); text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap;}
tbody tr{transition:background .15s;}
tbody tr.click{cursor:pointer;} tbody tr.click:hover td{background:color-mix(in oklab, var(--accent) 7%, transparent);}
td.rank{width:34px; color:var(--muted); font-weight:700;}
.who{display:flex; align-items:center; gap:10px;} .who .nm{font-weight:650;} .who .sm{font-size:11.5px; color:var(--muted);}
.bar{position:relative; height:6px; border-radius:999px; background:var(--chip); min-width:90px;} .bar>i{position:absolute; left:0; top:0; bottom:0; border-radius:999px; background:var(--grad); width:0; transition:width .8s var(--ease);}
.sharecell{min-width:140px;} .sharecell .pct{font-size:12px; color:var(--text-2); margin-bottom:4px; display:block;}
.badge{display:inline-flex; align-items:center; gap:5px; font-size:11.5px; font-weight:650; padding:2px 8px; border-radius:999px; background:var(--chip); color:var(--text-2);}
.badge .sw{width:8px; height:8px; border-radius:50%;}
/* ---------- agency cards ---------- */
.agcards{display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:14px;}
.agcard{position:relative; overflow:hidden; border-radius:16px; padding:16px; background:var(--surface-2); border:1px solid var(--border); cursor:pointer; transition:transform .22s var(--ease), box-shadow .22s var(--ease), border-color .2s;}
.agcard:hover{transform:translateY(-3px); box-shadow:var(--shadow-hover); border-color:color-mix(in oklab, var(--ac, var(--accent)) 45%, var(--border));}
.agcard .stripe{position:absolute; left:0; top:0; right:0; height:4px;}
.agcard .top{display:flex; align-items:center; gap:10px;}
.agcard .rk{width:30px; height:30px; border-radius:9px; display:grid; place-items:center; font-weight:800; color:#fff;}
.agcard .an{font-weight:750; font-size:14.5px; line-height:1.2;} .agcard .am{font-size:11.5px; color:var(--muted);}
.agcard .big{font-size:24px; font-weight:800; letter-spacing:-.02em; margin-top:10px;}
.agcard .stats{display:flex; gap:12px; font-size:12px; color:var(--text-2); margin-top:2px;}
.agcard svg.spark{display:block; width:100%; height:34px; margin-top:8px;}
/* ---------- charts ---------- */
.chartbox{position:relative; height:280px;} .chartbox.sm{height:220px;} .chartbox.lg{height:340px;}
.donutwrap{display:grid; grid-template-columns:170px 1fr; gap:14px; align-items:center;}
.donutwrap .chartbox{height:170px;}
.legend{list-style:none; padding:0; display:flex; flex-direction:column; gap:6px; font-size:12.5px; max-height:190px; overflow:auto;}
.legend li{display:flex; align-items:center; gap:8px;} .legend .sw{width:10px; height:10px; border-radius:3px; flex:none;} .legend .lv{margin-left:auto; color:var(--text-2); font-variant-numeric:tabular-nums;}
.donut-center{position:absolute; inset:0; display:grid; place-items:center; pointer-events:none; text-align:center;} .donut-center b{font-size:18px; display:block;} .donut-center span{font-size:11px; color:var(--muted);}
/* ---------- agent profile ---------- */
.profile{display:flex; gap:18px; align-items:center; flex-wrap:wrap;}
.profile .avatar{width:88px; height:88px; font-size:30px; box-shadow:0 14px 30px -14px rgba(0,0,0,.6);}
.profile h2{font-size:22px;} .profile .chips-row{display:flex; gap:8px; flex-wrap:wrap; margin-top:8px;}
.rankchip{font-size:12.5px; font-weight:700; padding:5px 11px; border-radius:999px; background:var(--grad); color:#fff;}
.rankchip.alt{background:var(--chip); color:var(--text);}
.lifetime{margin-left:auto; display:flex; gap:22px;} .lifetime div{text-align:right;} .lifetime b{display:block; font-size:18px;} .lifetime span{font-size:11.5px; color:var(--muted);}
/* ---------- forms / misc ---------- */
.form label{display:block; font-size:12.5px; color:var(--text-2); margin:12px 0 5px; font-weight:650;}
.form input[type=text],.form input[type=email],.form input[type=password],.form input[type=url],.form input[type=number],.form input[type=date],.form select,.inp,textarea.inp{font:inherit; width:100%; padding:9px 11px; border:1px solid var(--border); border-radius:10px; background:var(--surface-2); color:var(--text); transition:border-color .15s, box-shadow .15s;}
.inp{width:auto;} textarea.inp.wide,.wide{width:100%;}
.form input:focus,.inp:focus,select:focus,textarea:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 3px color-mix(in oklab, var(--accent) 22%, transparent);}
.form input[type=color]{width:60px; height:38px; border:1px solid var(--border); border-radius:10px; background:var(--surface-2); padding:3px;}
.btn{font:inherit; font-weight:700; font-size:13px; padding:9px 16px; border-radius:11px; border:1px solid transparent; background:var(--grad); color:#fff; cursor:pointer; text-decoration:none; display:inline-block; transition:transform .15s var(--ease), box-shadow .15s, filter .15s; box-shadow:0 8px 18px -10px var(--accent);}
.btn:hover{transform:translateY(-1px); filter:brightness(1.05); text-decoration:none;}
.btn.secondary{background:var(--surface-2); color:var(--text); border-color:var(--border); box-shadow:none;}
.btn.ghost{background:transparent; color:var(--text-2); border-color:var(--border); box-shadow:none;}
.btn.danger{background:var(--warn); box-shadow:none;}
.btn.small{padding:6px 11px; font-size:12px;} .btn.wide{width:100%;}
.btn:disabled{opacity:.6; cursor:progress;}
.error{background:var(--warn-soft); color:var(--warn); border:1px solid color-mix(in oklab, var(--warn) 30%, transparent); padding:10px 13px; border-radius:11px; margin:10px 0; font-size:13px;}
.ok{background:var(--good-soft); color:var(--good); border:1px solid color-mix(in oklab, var(--good) 30%, transparent); padding:10px 13px; border-radius:11px; margin:10px 0; font-size:13px;}
.warnbox{background:var(--notice); border:1px solid var(--notice-border); border-radius:14px; padding:13px 15px; margin:14px 0 16px; font-size:13px; line-height:1.55;}
.warnbox strong{display:block; margin-bottom:3px;}
.pill{display:inline-block; font-size:11px; padding:2px 9px; border-radius:999px; background:var(--chip); color:var(--text-2); font-weight:600;}
.pill.good{background:var(--good-soft); color:var(--good);} .pill.bad{background:var(--warn-soft); color:var(--warn);}
code,.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:12px; word-break:break-all;}
.copybox{background:var(--chip); padding:10px 12px; border-radius:10px; margin:8px 0; font-family:ui-monospace,monospace; font-size:12.5px; word-break:break-all; color:var(--text);}
ol.steps{margin:6px 0 0 18px; line-height:1.8; font-size:13px; color:var(--text-2);}
.maptable td,.maptable th{text-align:left;}
.dim{color:var(--muted);}
.mt{margin-top:14px;} .m0{margin:0 !important;} .w70{width:74px !important;} .w120{width:120px !important;} .minw280{min-width:280px;}
.h1{font-size:22px; font-weight:800; margin:18px 0 10px;}
.dot-sw{display:inline-block; width:10px; height:10px; border-radius:50%; vertical-align:middle;}
.empty{text-align:center; padding:36px 18px;}
.skeleton{height:420px; border-radius:var(--radius); background:linear-gradient(90deg, var(--surface) 0%, var(--surface-2) 50%, var(--surface) 100%); background-size:200% 100%; animation:shimmer 1.4s infinite linear;}
@keyframes shimmer{to{background-position:-200% 0;}}
@keyframes rise{from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:none;}}
.content>*{animation:rise .45s var(--ease) both;}
.content>*:nth-child(2){animation-delay:.04s} .content>*:nth-child(3){animation-delay:.08s} .content>*:nth-child(4){animation-delay:.12s} .content>*:nth-child(5){animation-delay:.16s}
footer.foot{color:var(--muted); font-size:12px; margin-top:8px; line-height:1.6;}
/* ---------- auth ---------- */
.auth-wrap{display:grid; grid-template-columns:1fr 440px; gap:40px; align-items:center; max-width:1000px; margin:6vh auto; padding:0 20px;}
.auth-hero{padding:30px; border-radius:26px; color:#fff; background:var(--grad); min-height:360px; display:flex; flex-direction:column; justify-content:flex-end; position:relative; overflow:hidden; box-shadow:0 30px 60px -30px var(--accent);}
.auth-hero::before{content:""; position:absolute; width:320px; height:320px; border-radius:50%; background:rgba(255,255,255,.12); top:-100px; right:-80px;}
.auth-hero .hero-logo{font-size:44px; position:relative;} .auth-hero h1{font-size:32px; font-weight:800; letter-spacing:-.02em; position:relative;} .auth-hero p{opacity:.9; margin-top:6px; position:relative; font-size:15px;}
.auth-card{margin:0;}
/* ---------- responsive ---------- */
@media (max-width:1024px){ .grid3{grid-template-columns:repeat(2,minmax(0,1fr));} .grid-21{grid-template-columns:minmax(0,1fr);} }
@media (max-width:760px){
  .page{padding:6px 12px 48px;} .appbar{padding:10px 12px; gap:8px;} .subnav,.crumbs{padding-left:12px; padding-right:12px;}
  .hide-sm{display:none;} .switcher select{min-width:0; max-width:46vw;}
  .grid2,.grid3{grid-template-columns:minmax(0,1fr);} .kpis{grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px;}
  .tile .value{font-size:21px;} .hero{padding:18px; border-radius:18px;} .hero h1{font-size:21px;}
  .podium{gap:8px;} .pod .avatar{width:46px; height:46px; font-size:16px;} .pod.p1 .avatar{width:58px; height:58px; font-size:20px;} .pod .pval{font-size:16px;} .pod.p1 .pval{font-size:19px;} .pod .pname{font-size:12.5px;}
  .donutwrap{grid-template-columns:130px 1fr;} .donutwrap .chartbox{height:130px;}
  .auth-wrap{grid-template-columns:1fr; margin:3vh auto;} .auth-hero{min-height:200px;}
  .lifetime{margin-left:0;} .toolbar{flex-direction:column; align-items:stretch;} .chips{max-width:100%;}
}
/* ---------- TV mode ---------- */
body.tv{overflow:hidden; background:radial-gradient(1400px 700px at 0% 0%, color-mix(in oklab, var(--accent) 25%, transparent), transparent 60%),radial-gradient(1000px 600px at 100% 100%, color-mix(in oklab, var(--accent-2) 22%, transparent), transparent 60%),#070912;}
body.tv .appbar,body.tv .subnav,body.tv .crumbs,body.tv .banner-demo{display:none;}
body.tv .page{max-width:none; padding:0;}
.tv-top{display:flex; align-items:center; gap:22px; padding:18px 34px 10px; color:#fff;}
.tv-brand{font-weight:800; font-size:22px;} .tv-slide-title{font-size:22px; color:#c7cbe8; flex:1;} .tv-clock{font-size:22px; font-variant-numeric:tabular-nums; color:#c7cbe8;}
.tv-controls{display:flex; gap:6px; opacity:.35; transition:opacity .2s;} .tv-controls:hover{opacity:1;}
.tv-progress{height:4px; margin:0 34px; background:rgba(255,255,255,.1); border-radius:4px; overflow:hidden;} #tv-bar{height:100%; width:0; background:var(--grad);}
.tv-stage{height:calc(100vh - 80px); padding:22px 34px 30px; color:#eef0ff;}
.tv-slide{height:100%; display:flex; flex-direction:column; gap:22px; animation:tvin .7s var(--ease) both;}
@keyframes tvin{from{opacity:0; transform:scale(.985) translateY(10px);} to{opacity:1; transform:none;}}
.tv-slide h2{font-size:clamp(28px,3.2vw,52px); font-weight:800; letter-spacing:-.02em;}
.tv-slide .kpis{grid-template-columns:repeat(4,1fr); gap:20px;}
.tv-slide .tile{background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.08);} .tv-slide .tile .value{font-size:clamp(28px,3.4vw,58px);} .tv-slide .tile .label{font-size:clamp(14px,1.2vw,20px); color:#c7cbe8;}
.tv-grid{display:grid; grid-template-columns:1.1fr 1fr; gap:26px; flex:1; min-height:0;}
.tv-panel{background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08); border-radius:24px; padding:22px; min-height:0; display:flex; flex-direction:column;}
.tv-panel .chartbox{flex:1; height:auto; min-height:200px;}
.tv .podium .pod{background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.1);} .tv .pod.p1{background:linear-gradient(180deg, rgba(245,179,1,.28), rgba(255,255,255,.04));}
.tv .pod .avatar{width:96px; height:96px; font-size:34px;} .tv .pod.p1 .avatar{width:124px; height:124px; font-size:44px;}
.tv .pod .pname{font-size:clamp(16px,1.6vw,28px);} .tv .pod .pval{font-size:clamp(22px,2.4vw,42px);} .tv .pod.p1 .pval{font-size:clamp(26px,3vw,52px);} .tv .pod .psub,.tv .pod .pag{font-size:clamp(12px,1vw,18px); color:#c7cbe8;}
.tvlist{list-style:none; padding:0; display:flex; flex-direction:column; gap:10px; overflow:hidden;}
.tvlist li{display:flex; align-items:center; gap:14px; padding:10px 14px; border-radius:14px; background:rgba(255,255,255,.04); font-size:clamp(15px,1.4vw,24px);}
.tvlist .r{width:36px; font-weight:800; color:#9aa0c7;} .tvlist .v{margin-left:auto; font-weight:800; font-variant-numeric:tabular-nums;} .tvlist .avatar{width:40px; height:40px; font-size:15px;}
@media (max-width:900px){ .tv-grid{grid-template-columns:1fr;} .tv-slide .kpis{grid-template-columns:repeat(2,1fr);} }

/* v2 polish */
.pod,.agcard{color:inherit;} .pod:hover,.agcard:hover{text-decoration:none;}
.agcard .stats{flex-wrap:wrap; row-gap:2px;}
.legend li{min-width:0;} .legend li>span.nmx{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.legend{font-size:12px;} .legend .lv{white-space:nowrap;}
.tv-panel h2{font-size:clamp(18px,1.6vw,28px); margin-bottom:12px;}
.tv-slide .tile.accent{background:var(--grad); border-color:transparent;}
.tv-slide .progress{margin-top:12px;}
.grid-12{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.25fr); gap:22px; align-items:center;}
@media (max-width:1024px){ .grid-12{grid-template-columns:minmax(0,1fr);} }
@media (max-width:760px){ .kpis .tile:last-child:nth-child(odd){grid-column:span 2;} }
.tv-panel{justify-content:center;}
.tvn{display:flex; flex-direction:column; line-height:1.2; min-width:0;} .tvn small,.tvlist .v small{font-size:.62em; color:#9aa0c7; font-weight:500;}
.tvlist .v{display:flex; flex-direction:column; align-items:flex-end; line-height:1.15; white-space:nowrap;}
.grid-12>div{min-width:0;} .pod .pname,.pod .pag{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
@media (max-width:760px){ .pod{padding:12px 6px;} .pod .pag{font-size:10.5px;} .card{padding:14px 12px;} }
@media (max-width:760px){ .appbar{flex-wrap:wrap; row-gap:8px;} .appbar-actions{display:contents;} .brand{flex:1 1 0;} .switcher{order:5; flex:1 1 100%;} .switcher select{width:100%; max-width:none;} }
.auth-top{max-width:1000px; margin:18px auto 0; padding:0 20px; display:flex; align-items:center; justify-content:space-between;} .auth-brand{display:inline-flex; align-items:center; gap:10px; color:inherit;} .auth-brand:hover{text-decoration:none;}
.auth-mark{width:32px; height:32px;} .auth-hero-mark{width:64px; height:64px; filter:drop-shadow(0 10px 20px rgba(0,0,0,.25));}
.sb-word{font-weight:850; font-size:20px; letter-spacing:-.03em; color:var(--text);} .sb-word b{font-weight:850; background:linear-gradient(120deg,#4f46e5,#8b5cf6 55%,#ec4899); -webkit-background-clip:text; background-clip:text; color:transparent;}
.wrapcell{white-space:normal; min-width:220px; max-width:360px;}
/* column-mapping auto-detect hints */
.detect-summary{margin:12px 0 4px; padding:11px 14px; border-radius:12px; font-size:13.5px; line-height:1.5; color:var(--text-2); background:color-mix(in oklab, var(--accent) 9%, var(--surface)); border:1px solid color-mix(in oklab, var(--accent) 28%, var(--border));}
.detect-summary strong{color:var(--text);}
.detect-note{margin:4px 0 8px; font-size:12.5px; color:var(--text-2); padding:7px 11px; border-radius:10px; background:var(--chip); display:flex; flex-wrap:wrap; gap:8px; align-items:center;}
.detect-note.warn{background:var(--warn-soft); color:var(--warn);}
.conf{display:inline-flex; align-items:center; gap:6px; font-size:11.5px; font-weight:700; padding:3px 9px; border-radius:999px; white-space:nowrap; background:var(--chip); color:var(--text-2);}
.conf::before{content:""; width:7px; height:7px; border-radius:50%; background:currentColor;}
.conf-high{background:var(--good-soft); color:var(--good);}
.conf-medium{background:color-mix(in oklab, #f59e0b 16%, var(--surface)); color:#b45309;}
[data-theme="dark"] .conf-medium{color:#fcd34d;}
.conf-low{background:var(--warn-soft); color:var(--warn);}
.conf-none{color:var(--muted);}
.conf-user,.conf-saved{background:color-mix(in oklab, var(--accent) 14%, var(--surface)); color:var(--accent);}
.conf-why{font-size:11.5px; margin-top:4px; max-width:300px; line-height:1.35;}
.conf-row-low td,.conf-row-medium td{background:color-mix(in oklab, #f59e0b 5%, transparent);}
.conf-row-low select{border-color:color-mix(in oklab, var(--warn) 55%, var(--border));}
@media (max-width:760px){ .maptable .conf-why{display:none;} }
