/* ═══════════════════════════════════════════════════════════════════════════
   SIGNAL — channel analytics · design system v3 "Broadcast Grade"
   Dark glass over a deep blue-black field. Bricolage Grotesque carries the
   display voice, Spline Sans the body, Spline Sans Mono the numbers.
   One accent runs the room (signal green); violet is the intelligence tint.
   ═══════════════════════════════════════════════════════════════════════ */

:root{
  --bg:#07090e;
  --bg-2:#0b0e15;
  --panel:rgba(21,25,36,.72);
  --panel-solid:#151924;
  --panel-2:#1b2030;
  --line:rgba(140,155,190,.13);
  --line-strong:rgba(140,155,190,.24);
  --ink:#eef1f8;
  --ink-dim:#9aa1b5;
  --ink-faint:#606880;
  --accent:#6ef2c4;
  --accent-deep:#0f7a56;
  --violet:#a78bfa;
  --blue:#6aa8ff;
  --warn:#ffb454;
  --bad:#ff6b7a;
  --yt:#ff4d5e; --tt:#2ef2ea; --ig:#ff5fa2; --fb:#5b8def;
  --radius:16px;
  --radius-sm:11px;
  --glow-accent:0 0 24px rgba(110,242,196,.25);
  --shadow-1:0 1px 0 rgba(255,255,255,.03) inset, 0 10px 30px rgba(0,0,0,.35);
  --ease:cubic-bezier(.22,.9,.24,1);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:"Spline Sans",system-ui,sans-serif;
  font-size:14px;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
::selection{background:rgba(110,242,196,.28);color:#fff}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:#232a3c;border-radius:6px;border:2px solid var(--bg)}
::-webkit-scrollbar-thumb:hover{background:#2e3750}
::-webkit-scrollbar-track{background:transparent}

/* ambient field: aurora + grain */
.aurora{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.aurora::before,.aurora::after{content:"";position:absolute;border-radius:50%;filter:blur(90px);opacity:.5}
.aurora::before{width:900px;height:520px;top:-260px;right:-140px;
  background:radial-gradient(closest-side, rgba(106,168,255,.16), transparent 70%);
  animation:drift 26s var(--ease) infinite alternate}
.aurora::after{width:760px;height:480px;bottom:-240px;left:-160px;
  background:radial-gradient(closest-side, rgba(110,242,196,.11), transparent 70%);
  animation:drift 32s var(--ease) infinite alternate-reverse}
@keyframes drift{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(-60px,40px,0) scale(1.12)}}
.grain{position:fixed;inset:0;pointer-events:none;opacity:.05;z-index:1;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
@media (prefers-reduced-motion:reduce){
  .aurora::before,.aurora::after{animation:none}
  *,*::before,*::after{animation-duration:.001s !important;transition-duration:.001s !important}
}

/* ── topbar ──────────────────────────────────────────────────────────────── */
.topbar{display:flex;justify-content:space-between;align-items:center;gap:14px;
  padding:16px 30px;position:sticky;top:0;z-index:40;
  background:linear-gradient(180deg, rgba(7,9,14,.92), rgba(7,9,14,.78));
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line)}
.topbar::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg, transparent, rgba(110,242,196,.5) 18%, rgba(167,139,250,.4) 55%, transparent 90%);
  opacity:.55}
.brand{display:flex;align-items:center;gap:12px}
.brand-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;
  color:var(--accent);font-size:16px;
  background:linear-gradient(160deg, rgba(110,242,196,.16), rgba(110,242,196,.03));
  border:1px solid rgba(110,242,196,.35);
  box-shadow:var(--glow-accent), inset 0 1px 0 rgba(255,255,255,.08);
  animation:markPulse 5s var(--ease) infinite}
@keyframes markPulse{0%,100%{box-shadow:0 0 18px rgba(110,242,196,.18), inset 0 1px 0 rgba(255,255,255,.08)}50%{box-shadow:0 0 30px rgba(110,242,196,.34), inset 0 1px 0 rgba(255,255,255,.08)}}
.brand-name{font-family:"Bricolage Grotesque";font-weight:800;letter-spacing:.22em;font-size:17px;
  background:linear-gradient(90deg, #fff, #c9d2e6);-webkit-background-clip:text;background-clip:text;color:transparent}
.brand-sub{color:var(--ink-faint);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;
  border-left:1px solid var(--line-strong);padding-left:12px;transform:translateY(1px)}
.topbar-actions{display:flex;align-items:center;gap:9px}
.last-run{color:var(--ink-faint);font-family:"Spline Sans Mono";font-size:11.5px;margin-right:4px}
.kbd-hint{display:inline-flex;align-items:center;gap:6px;color:var(--ink-faint);font-size:12px;
  border:1px solid var(--line);border-radius:9px;padding:7px 11px;cursor:pointer;background:transparent;
  font-family:"Spline Sans Mono";transition:.18s var(--ease)}
.kbd-hint:hover{color:var(--ink);border-color:var(--line-strong);background:var(--panel)}
.kbd-hint kbd{font-family:inherit;font-size:10.5px;border:1px solid var(--line-strong);border-bottom-width:2px;
  border-radius:5px;padding:1px 5px;color:var(--ink-dim)}

/* buttons */
.btn{border:1px solid var(--line);background:var(--panel);color:var(--ink);
  padding:9px 16px;border-radius:11px;font:inherit;font-size:13px;font-weight:600;
  cursor:pointer;text-decoration:none;transition:.18s var(--ease);position:relative}
.btn:hover{border-color:var(--line-strong);background:var(--panel-2);transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn-ghost{background:transparent}
.btn-primary{background:linear-gradient(160deg, var(--accent), #46d6a5);color:#052a1b;
  border-color:transparent;font-weight:700;box-shadow:0 4px 18px rgba(110,242,196,.25)}
.btn-primary:hover{box-shadow:0 6px 26px rgba(110,242,196,.4);background:linear-gradient(160deg, #85f7d0, #4fe0ae)}

/* ── tab rail ─────────────────────────────────────────────────────────────── */
.tabs{display:flex;align-items:center;gap:4px;padding:14px 30px;position:relative;z-index:5}
.tabs::before{content:"";position:absolute;left:30px;right:30px;bottom:0;height:1px;background:var(--line)}
.tab{background:none;border:1px solid transparent;color:var(--ink-dim);font:inherit;font-weight:600;font-size:13.5px;
  padding:9px 16px 9px 14px;border-radius:11px;cursor:pointer;transition:.2s var(--ease);
  display:inline-flex;align-items:center;gap:8px;letter-spacing:.01em}
.tab::before{font-size:12px;opacity:.75;transform:translateY(-.5px)}
.tab[data-tab="overview"]::before{content:"◧"}
.tab[data-tab="pulse"]::before{content:"◉"}
.tab[data-tab="content"]::before{content:"▤"}
.tab[data-tab="health"]::before{content:"✚"}
.tab[data-tab="monetization"]::before{content:"◈"}
.tab:hover{color:var(--ink);background:var(--panel);border-color:var(--line)}
.tab.is-active{color:#062b1c;border-color:transparent;
  background:linear-gradient(160deg, var(--accent), #4bdcab);
  box-shadow:0 4px 20px rgba(110,242,196,.3), inset 0 1px 0 rgba(255,255,255,.35)}
.tab.is-active::before{opacity:1}
.platform-filter{margin-left:auto;display:flex;gap:8px;align-items:center}
select,.cat-select{background:var(--panel);color:var(--ink);border:1px solid var(--line);
  border-radius:11px;padding:9px 34px 9px 13px;font:inherit;font-size:13px;cursor:pointer;
  appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%239aa1b5' fill='none' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 13px center;transition:.18s var(--ease)}
select:hover,.cat-select:hover{border-color:var(--line-strong)}

main{padding:30px;position:relative;z-index:2;max-width:1320px;margin:0 auto}
.panel{display:none;animation:rise .45s var(--ease) both}
.panel.is-active{display:block}
@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

.section-title{font-family:"Bricolage Grotesque";font-weight:700;font-size:21px;letter-spacing:-.01em;
  margin:8px 0 18px;display:flex;align-items:center;gap:10px}
.sub-title{font-family:"Bricolage Grotesque";font-weight:600;font-size:12px;color:var(--ink-dim);
  margin:30px 0 12px;text-transform:uppercase;letter-spacing:.16em;display:flex;align-items:center;gap:10px}
.sub-title::after{content:"";flex:1;height:1px;background:var(--line)}

/* ── date range + search rails ───────────────────────────────────────────── */
.daterange{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 30px 0;position:relative;z-index:4}
.dr-label{color:var(--ink-faint);font-size:10.5px;text-transform:uppercase;letter-spacing:.16em;font-weight:600}
.dr-btns{display:flex;gap:4px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:4px}
.dr-note{color:var(--ink-faint);font-size:11.5px;font-family:"Spline Sans Mono"}
.dr-custom{display:flex;gap:8px;align-items:center}
.dr-arrow{color:var(--ink-faint)}
input[type="date"],input[type="month"],input[type="number"],input[type="password"],input[type="text"]{
  background:var(--panel);border:1px solid var(--line);color:var(--ink);
  border-radius:10px;padding:9px 12px;font:inherit;font-size:13px;transition:.18s var(--ease)}
input:focus{outline:none;border-color:rgba(110,242,196,.5);box-shadow:0 0 0 3px rgba(110,242,196,.12)}
.range-btn{background:transparent;border:1px solid transparent;color:var(--ink-dim);
  border-radius:9px;padding:6px 12px;font:inherit;font-size:12px;font-weight:600;cursor:pointer;transition:.16s var(--ease)}
.range-btn:hover{color:var(--ink);background:var(--panel-2)}
.range-btn.active{background:linear-gradient(160deg, var(--accent), #4bdcab);color:#062b1c;
  box-shadow:0 2px 12px rgba(110,242,196,.3)}
.range-bar{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:12px;background:var(--panel);
  border:1px solid var(--line);border-radius:12px;padding:4px;width:max-content;max-width:100%}

.creator-search{display:flex;gap:10px;align-items:center;margin:16px 30px 6px;position:relative;z-index:4}
.global-search{max-width:1320px}
.chip-input{flex:1;display:flex;align-items:center;flex-wrap:wrap;gap:6px;position:relative;
  background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:7px 10px;
  transition:.18s var(--ease)}
.chip-input:focus-within{border-color:rgba(110,242,196,.45);box-shadow:0 0 0 3px rgba(110,242,196,.1)}
#creatorSearch{flex:1;min-width:200px;background:transparent;border:none;color:var(--ink);
  padding:7px 8px;font:inherit;font-size:14px}
#creatorSearch:focus{outline:none}
.chip{display:inline-flex;align-items:center;gap:7px;background:rgba(110,242,196,.13);
  border:1px solid rgba(110,242,196,.35);color:var(--accent);border-radius:20px;
  padding:5px 7px 5px 12px;font-size:12.5px;font-weight:600;margin:2px}
.chip button{background:rgba(110,242,196,.15);border:none;color:var(--accent);cursor:pointer;
  border-radius:50%;width:17px;height:17px;line-height:1;font-size:11px;display:grid;place-items:center}
.chip button:hover{background:rgba(110,242,196,.35)}
.creator-dropdown{position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:60;max-height:300px;overflow-y:auto;
  background:var(--panel-2);border:1px solid var(--line-strong);border-radius:14px;
  box-shadow:0 24px 60px rgba(0,0,0,.55);padding:6px}
.dd-item{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:10px 12px;
  border-radius:9px;cursor:pointer;font-size:13px}
.dd-item:hover{background:var(--panel)}
.dd-name b{color:var(--accent)}
.dd-meta{color:var(--ink-faint);font-size:11px;flex-shrink:0}
.dd-empty{color:var(--ink-faint);padding:12px;font-size:12.5px;text-align:center}

.filter-banner{display:flex;align-items:center;gap:8px;background:rgba(167,139,250,.08);
  border:1px solid rgba(167,139,250,.25);color:var(--ink-dim);border-radius:12px;
  padding:10px 16px;font-size:13px;margin-bottom:18px}
.filter-banner strong{color:var(--violet)}
.banner-clear{color:var(--accent);cursor:pointer;font-weight:600;margin-left:auto}
.banner-clear:hover{text-decoration:underline}

/* ── hero stat row ───────────────────────────────────────────────────────── */
.stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:30px}
.stat{position:relative;background:linear-gradient(165deg, rgba(27,32,48,.75), rgba(14,17,26,.9));
  border:1px solid var(--line);border-radius:var(--radius);padding:22px 22px 20px;overflow:hidden;
  box-shadow:var(--shadow-1);transition:.22s var(--ease)}
.stat:hover{border-color:var(--line-strong);transform:translateY(-2px)}
.stat::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg, transparent, rgba(110,242,196,.55), transparent)}
.stat::after{content:"";position:absolute;top:14px;right:16px;width:7px;height:7px;border-radius:50%;
  background:var(--accent);opacity:.35;box-shadow:0 0 10px var(--accent)}
.stat .label{color:var(--ink-faint);font-size:10.5px;text-transform:uppercase;letter-spacing:.18em;font-weight:600}
.stat .value{font-family:"Bricolage Grotesque";font-weight:800;margin-top:12px;
  font-size:clamp(21px, 2.6vw + 12px, 38px);
  font-variant-numeric:tabular-nums;letter-spacing:-.03em;line-height:1.05;
  overflow-wrap:anywhere;
  background:linear-gradient(180deg, #fff 30%, #b9c4dc);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 18px rgba(110,242,196,.14))}
.stat .meta{color:var(--ink-dim);font-size:12px;margin-top:9px}
.win-delta{font-size:12.5px;font-weight:700;margin-top:9px;font-family:"Spline Sans Mono"}
.win-delta.up{color:var(--accent)} .win-delta.down{color:var(--bad)} .win-delta.flat{color:var(--ink-faint)}
.win-lbl{color:var(--ink-faint);font-weight:400}

/* ── trend card ──────────────────────────────────────────────────────────── */
.trend-card{background:var(--panel);backdrop-filter:blur(8px);border:1px solid var(--line);
  border-radius:var(--radius);padding:20px 22px;margin-bottom:28px;box-shadow:var(--shadow-1)}
.trend-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.trend-head h3{font-family:"Bricolage Grotesque";font-weight:700;font-size:15px;margin:0}
.trend-controls{display:flex;gap:6px}
.trend-note{color:var(--ink-faint);font-size:11.5px;font-family:"Spline Sans Mono"}
.chart-wrap{position:relative;width:100%}
@keyframes dash{to{stroke-dashoffset:0}}
.ch-tip{position:absolute;top:-8px;transform:translateX(-50%);background:rgba(11,14,21,.95);
  border:1px solid var(--line-strong);border-radius:9px;padding:6px 11px;font-family:"Spline Sans Mono";
  font-size:12px;pointer-events:none;transition:opacity .12s;white-space:nowrap;z-index:5;
  box-shadow:0 10px 30px rgba(0,0,0,.5)}
.ch-tip b{color:var(--accent);margin-right:8px}
.ch-tip span{color:var(--ink-faint)}
.ch-axis{display:flex;justify-content:space-between;color:var(--ink-faint);
  font-family:"Spline Sans Mono";font-size:10.5px;margin-top:8px;letter-spacing:.04em}
.chart-head{display:flex;justify-content:space-between;font-family:"Spline Sans Mono";font-size:12px;color:var(--ink-dim);margin-bottom:6px}

/* ── channel cards ───────────────────────────────────────────────────────── */
.channels-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.card{position:relative;background:linear-gradient(170deg, rgba(24,29,43,.7), rgba(13,16,24,.85));
  border:1px solid var(--line);border-radius:var(--radius);padding:18px;
  transition:.22s var(--ease);overflow:hidden;box-shadow:var(--shadow-1)}
.card::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;opacity:.85;
  background:linear-gradient(90deg, var(--pc,transparent), transparent 75%)}
.card:has(.tag.youtube){--pc:var(--yt)} .card:has(.tag.tiktok){--pc:var(--tt)}
.card:has(.tag.instagram){--pc:var(--ig)} .card:has(.tag.facebook){--pc:var(--fb)}
.card:hover{transform:translateY(-3px);border-color:var(--line-strong);
  box-shadow:0 16px 40px rgba(0,0,0,.45), 0 0 0 1px rgba(255,255,255,.02) inset}
.card.clickable{cursor:pointer}
.card.clickable:hover{box-shadow:0 16px 40px rgba(0,0,0,.45), 0 0 26px -8px var(--pc, rgba(110,242,196,.3))}
.card.attention{border-color:rgba(255,180,84,.35)}
.card{animation:cardIn .5s var(--ease) both}
@keyframes cardIn{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}
.card:nth-child(2){animation-delay:.03s}.card:nth-child(3){animation-delay:.06s}
.card:nth-child(4){animation-delay:.09s}.card:nth-child(5){animation-delay:.12s}
.card:nth-child(6){animation-delay:.15s}.card:nth-child(7){animation-delay:.18s}
.card:nth-child(8){animation-delay:.21s}
.card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:13px}
.card-name{font-weight:650;font-size:15px;line-height:1.25;letter-spacing:-.005em}
.card-bio{color:var(--ink-faint);font-size:11.5px;margin:-6px 0 12px;line-height:1.5}
.tag{font-size:9.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  padding:4px 9px;border-radius:20px;border:1px solid transparent;flex-shrink:0}
.tag.youtube{background:rgba(255,77,94,.13);color:var(--yt);border-color:rgba(255,77,94,.3)}
.tag.tiktok{background:rgba(46,242,234,.1);color:var(--tt);border-color:rgba(46,242,234,.28)}
.tag.instagram{background:rgba(255,95,162,.12);color:var(--ig);border-color:rgba(255,95,162,.3)}
.tag.facebook{background:rgba(91,141,239,.13);color:var(--fb);border-color:rgba(91,141,239,.3)}
.metrics{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.metric .k{color:var(--ink-faint);font-size:10px;text-transform:uppercase;letter-spacing:.12em;font-weight:600}
.metric .v{font-family:"Spline Sans Mono";font-weight:600;font-size:17.5px;margin-top:4px;
  font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.delta{font-size:11.5px;font-weight:700;margin-left:6px}
.delta.up{color:var(--accent)} .delta.down{color:var(--bad)} .delta.flat{color:var(--ink-faint)}
.dot{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:7px;position:relative;top:-1px}
.dot.connected{background:var(--accent);box-shadow:0 0 8px rgba(110,242,196,.7)}
.dot.error{background:var(--warn);box-shadow:0 0 8px rgba(255,180,84,.6)}
.dot.revoked{background:var(--bad);box-shadow:0 0 8px rgba(255,107,122,.6)}
.attn-flag{color:var(--warn)}
.card-hint{margin-top:13px;font-size:10px;color:var(--ink-faint);text-transform:uppercase;letter-spacing:.14em;
  opacity:0;transform:translateX(-4px);transition:.2s var(--ease)}
.card:hover .card-hint{opacity:1;transform:none;color:var(--accent)}
.card-spark{display:flex;align-items:center;gap:8px;margin:-2px 0 11px}
.card-spark-lbl{color:var(--ink-faint);font-size:9.5px;text-transform:uppercase;letter-spacing:.12em}
.spark{display:block;filter:drop-shadow(0 0 4px rgba(110,242,196,.25))}
.pulse-chip{font-family:"Spline Sans Mono";font-size:11px;font-weight:700;border-radius:20px;
  padding:3.5px 9px;line-height:1;border:1px solid transparent}
.pulse-chip.hot{background:rgba(110,242,196,.13);color:var(--accent);border-color:rgba(110,242,196,.35)}
.pulse-chip.warm{background:rgba(255,180,84,.12);color:var(--warn);border-color:rgba(255,180,84,.3)}
.pulse-chip.cold{background:rgba(255,107,122,.11);color:var(--bad);border-color:rgba(255,107,122,.3)}

/* eligibility + velocity on cards */
.elig{margin-top:14px;border-top:1px dashed var(--line);padding-top:11px;font-size:11.5px}
.elig-header{display:flex;justify-content:space-between;color:var(--ink-dim);margin-bottom:7px;font-weight:600}
.elig-chips{display:flex;flex-wrap:wrap;gap:5px}
.elig-chip{border-radius:14px;padding:3px 9px;font-size:10.5px;font-family:"Spline Sans Mono"}
.elig-chip-ok{background:rgba(110,242,196,.12);color:var(--accent)}
.elig-chip-no{background:var(--panel-2);color:var(--ink-dim)}
.elig-chip-unknown{background:var(--panel-2);color:var(--ink-faint);font-style:italic}
.elig-bar{height:5px;background:var(--panel-2);border-radius:4px;overflow:hidden;margin-top:8px}
.elig-bar > span{display:block;height:100%;background:linear-gradient(90deg, var(--blue), var(--accent));border-radius:4px}
.elig-window{color:var(--ink-faint);font-size:10px;margin-top:6px}
.velo{font-size:11.5px;margin-top:9px;font-family:"Spline Sans Mono"}
.velo-go{color:var(--accent)} .velo-stall{color:var(--warn)} .velo-wait{color:var(--ink-faint)}

.empty{color:var(--ink-dim);text-align:center;padding:60px 40px;border:1px dashed var(--line-strong);
  border-radius:var(--radius);background:radial-gradient(400px 160px at 50% 0%, rgba(110,242,196,.05), transparent)}
.hidden{display:none !important}

/* ── content lists ───────────────────────────────────────────────────────── */
.split{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.content-list{display:flex;flex-direction:column;gap:9px}
.row{display:flex;align-items:center;gap:13px;background:var(--panel);border:1px solid var(--line);
  border-radius:13px;padding:12px 15px;transition:.16s var(--ease)}
.row:hover{border-color:var(--line-strong);background:var(--panel-2)}
.row .rank{font-family:"Spline Sans Mono";color:var(--ink-faint);font-size:12px;width:24px;flex-shrink:0}
.content-row:nth-child(1) .rank,.content-row:nth-child(2) .rank,.content-row:nth-child(3) .rank{color:var(--accent);font-weight:700}
.row .title{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13.5px}
.row .title a{color:var(--ink);text-decoration:none}
.row .title a:hover{color:var(--accent)}
.row .num{font-family:"Spline Sans Mono";font-size:12.5px;color:var(--ink-dim);text-align:right;flex-shrink:0}
.row .num b{color:var(--ink);display:block;font-weight:600;font-size:14px}
.row-meta{color:var(--ink-faint);font-size:11px}
.pub-date{color:var(--ink-faint)} .pub-unknown{font-style:italic}
.eng-detail{color:var(--ink-faint);font-size:10.5px}
.content-thumb-wrap{position:relative;flex-shrink:0}
.content-thumb{width:64px;height:40px;object-fit:cover;border-radius:8px;border:1px solid var(--line);display:block}
.content-thumb-placeholder{width:64px;height:40px;border-radius:8px;border:1px solid var(--line);
  background:linear-gradient(135deg, var(--panel-2), var(--panel-solid))}
.dur-badge{position:absolute;bottom:3px;right:3px;background:rgba(0,0,0,.8);color:#fff;
  font-family:"Spline Sans Mono";font-size:9px;border-radius:4px;padding:1px 4px}
.pill{font-size:9.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;border-radius:20px}
.pill-good{background:rgba(110,242,196,.13);color:var(--accent);border:1px solid rgba(110,242,196,.3)}
.pill-warn{background:rgba(255,180,84,.12);color:var(--warn);border:1px solid rgba(255,180,84,.3)}

/* ── health ──────────────────────────────────────────────────────────────── */
.health-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;margin-bottom:12px}
.hcount{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px;position:relative;overflow:hidden}
.hcount::before{content:"";position:absolute;top:0;left:0;bottom:0;width:2px;background:var(--accent);opacity:.55}
.hcount .n{font-family:"Bricolage Grotesque";font-weight:800;font-size:30px;letter-spacing:-.02em}
.hcount .l{color:var(--ink-dim);font-size:11.5px;text-transform:capitalize;margin-top:5px}
.problem-list,.error-log{display:flex;flex-direction:column;gap:8px}
.problem{background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--warn);
  border-radius:11px;padding:13px 15px;font-size:13px}
.problem.revoked{border-left-color:var(--bad)}
.problem .who{font-weight:650;margin-bottom:4px}
.problem .why{color:var(--ink-dim);line-height:1.6}
.elog{font-family:"Spline Sans Mono";font-size:11.5px;color:var(--ink-dim);
  background:rgba(11,14,21,.7);border:1px solid var(--line);border-radius:9px;padding:10px 13px;line-height:1.6}
.elog time{color:var(--ink-faint);margin-right:10px}
.healthy{color:var(--ink-dim);text-align:center;padding:26px;border:1px dashed var(--line);border-radius:12px}
.miss-chip{display:inline-flex;align-items:center;gap:6px;background:rgba(255,180,84,.09);
  border:1px solid rgba(255,180,84,.3);border-radius:16px;padding:2px 4px 2px 11px;
  font-size:12px;color:var(--warn);margin:2px 5px 2px 0}
.exempt-btn,.unexempt-btn{background:transparent;border:none;color:var(--ink-faint);font-size:9.5px;
  cursor:pointer;padding:3px 8px;border-radius:12px;text-transform:uppercase;letter-spacing:.06em;font-weight:700}
.exempt-btn:hover,.unexempt-btn:hover{background:var(--panel-2);color:var(--ink)}
.exempt-chip{display:inline-flex;align-items:center;gap:4px;background:var(--panel-2);
  border:1px solid var(--line);border-radius:16px;padding:2px 4px 2px 11px;font-size:12px;
  color:var(--ink-faint);margin:2px 5px 2px 0;text-decoration:line-through}

/* ── pulse tab ───────────────────────────────────────────────────────────── */
.pulse-head{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:20px}
.pulse-sub{color:var(--ink-faint);font-size:12px}
.movers-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:24px}
.movers-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:18px 20px;box-shadow:var(--shadow-1);position:relative;overflow:hidden}
.movers-card:first-child::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg, var(--accent), transparent 70%)}
.movers-card:last-child::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg, var(--bad), transparent 70%)}
.movers-note{font-weight:400;color:var(--ink-faint);font-size:10px;text-transform:none;letter-spacing:.02em}
.movers-card .sub-title::after{display:none}
.mover-row{display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:10px 11px;border-radius:10px;cursor:pointer;transition:.14s var(--ease)}
.mover-row:hover{background:var(--panel-2);transform:translateX(3px)}
.mover-name{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;align-items:center;gap:8px}
.mover-rate{font-family:"Spline Sans Mono";font-size:13px;font-weight:700;flex-shrink:0}
.mover-rate.up{color:var(--accent)} .mover-rate.down{color:var(--bad)}
.pulse-controls{display:flex;justify-content:flex-end;margin-bottom:12px}
.pulse-board{display:flex;flex-direction:column;gap:7px}
.pulse-row{display:grid;grid-template-columns:36px minmax(170px,1.6fr) 66px 1fr 1fr 1.1fr 96px;
  align-items:center;gap:12px;background:var(--panel);border:1px solid var(--line);
  border-radius:13px;padding:12px 16px;font-size:13px;transition:.16s var(--ease)}
.pulse-row.clickable{cursor:pointer}
.pulse-row.clickable:hover{border-color:rgba(110,242,196,.4);transform:translateX(3px);
  box-shadow:0 6px 24px rgba(0,0,0,.35)}
.pulse-header-row{background:transparent;border:none;color:var(--ink-faint);font-size:9.5px;
  text-transform:uppercase;letter-spacing:.14em;padding:2px 16px;font-weight:700}
.pulse-rank{font-family:"Spline Sans Mono";color:var(--ink-faint);font-size:12px}
.pulse-row:nth-child(2) .pulse-rank,.pulse-row:nth-child(3) .pulse-rank,.pulse-row:nth-child(4) .pulse-rank{color:var(--accent);font-weight:700}
.pulse-name b{display:block;font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pulse-meta{display:block;color:var(--ink-faint);font-size:11px;margin-top:3px}
.pulse-vel{font-family:"Spline Sans Mono";font-weight:600}
.pulse-vel.up{color:var(--accent)} .pulse-vel.down{color:var(--bad)}
.pulse-ring{--deg:0deg;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;
  background:conic-gradient(currentColor var(--deg), rgba(140,155,190,.14) 0);position:relative;
  filter:drop-shadow(0 0 6px currentColor)}
.pulse-ring::before{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--panel-solid)}
.pulse-ring b{position:relative;font-family:"Spline Sans Mono";font-size:12.5px;color:var(--ink)}
.pulse-ring.hot{color:var(--accent)} .pulse-ring.warm{color:var(--warn)} .pulse-ring.cold{color:var(--bad)}
.pulse-ring.empty{background:var(--panel-2);color:var(--ink-faint);font-size:12px;filter:none}
.pct-bar{display:inline-block;width:72px;height:7px;background:var(--panel-2);border-radius:4px;
  overflow:hidden;vertical-align:middle;margin-right:8px}
.pct-fill{display:block;height:100%;background:linear-gradient(90deg, var(--violet), var(--accent));border-radius:4px}
.pct-num{font-family:"Spline Sans Mono";font-size:12px;color:var(--ink-dim)}
.pct-na{color:var(--ink-faint)}
.accel{font-size:12px;font-weight:600}
.accel.up{color:var(--accent)} .accel.down{color:var(--warn)} .accel.flat{color:var(--ink-faint)}

/* ── focus tiles ─────────────────────────────────────────────────────────── */
.creator-focus{margin-bottom:14px}
.focus-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.tile{background:linear-gradient(170deg, rgba(24,29,43,.7), rgba(13,16,24,.85));border:1px solid var(--line);
  border-radius:var(--radius);padding:18px;min-height:172px;transition:.2s var(--ease);cursor:pointer;
  position:relative;overflow:hidden;box-shadow:var(--shadow-1)}
.tile[data-id]:hover{transform:translateY(-3px);border-color:var(--line-strong)}
.tile-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.tile-name{font-size:13px;color:var(--ink-dim);margin-bottom:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tile-metrics{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tile-metrics .k{display:block;color:var(--ink-faint);font-size:10px;text-transform:uppercase;letter-spacing:.1em}
.tile-metrics b{font-family:"Spline Sans Mono";font-size:16px;font-weight:600;margin-top:4px;display:block}
.tile-empty{display:flex;flex-direction:column;cursor:default;opacity:.55}
.tile-missing{margin:auto;color:var(--ink-faint);font-size:12px;font-style:italic}
.tile-delta{font-size:11.5px;font-family:"Spline Sans Mono";font-weight:700}
.tile-delta.up{color:var(--accent)} .tile-delta.down{color:var(--bad)}
.tile-foot{margin-top:10px;color:var(--ink-faint);font-size:11px}
.tile-agg{cursor:default}

/* ── drawer ──────────────────────────────────────────────────────────────── */
.drawer{position:fixed;top:0;right:0;height:100vh;width:440px;max-width:94vw;z-index:70;
  background:linear-gradient(180deg, rgba(22,27,40,.97), rgba(10,13,20,.99));
  backdrop-filter:blur(16px);border-left:1px solid var(--line-strong);
  transform:translateX(102%);transition:transform .32s var(--ease);
  box-shadow:-40px 0 90px rgba(0,0,0,.55);overflow-y:auto}
.drawer.open{transform:translateX(0)}
.drawer::before{content:"";position:sticky;top:0;display:block;height:2px;z-index:2;
  background:linear-gradient(90deg, var(--accent), var(--violet), transparent)}
.drawer-head{display:flex;justify-content:space-between;align-items:center;padding:19px 24px;
  border-bottom:1px solid var(--line);position:sticky;top:2px;z-index:1;
  background:rgba(16,20,31,.92);backdrop-filter:blur(10px)}
.drawer-head h3{font-family:"Bricolage Grotesque";font-weight:700;font-size:17px;margin:0;letter-spacing:-.01em}
.drawer-body{padding:22px 24px 40px}
.detail-stats{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-bottom:8px}
.detail-stats > div{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:13px}
.detail-stats .k{display:block;color:var(--ink-faint);font-size:10px;text-transform:uppercase;letter-spacing:.1em}
.detail-stats b{font-family:"Spline Sans Mono";font-size:17px;font-weight:600;margin-top:5px;display:block}
.detail-h{font-family:"Bricolage Grotesque";font-weight:600;font-size:11.5px;color:var(--ink-dim);
  margin:24px 0 12px;text-transform:uppercase;letter-spacing:.14em;display:flex;align-items:center;gap:10px}
.detail-h::after{content:"";flex:1;height:1px;background:var(--line)}
.detail-bio{color:var(--ink-dim);font-size:13px;line-height:1.65;margin-bottom:10px}
.detail-link a{color:var(--accent);font-size:12.5px;text-decoration:none}
.detail-link a:hover{text-decoration:underline}
.detail-note{color:var(--ink-faint);font-size:11.5px;margin-top:14px;line-height:1.6;
  border-left:2px solid var(--line-strong);padding-left:12px}
.detail-profile-row{display:flex;gap:14px;align-items:flex-start;margin-bottom:14px}
.detail-avatar{width:52px;height:52px;border-radius:50%;border:2px solid var(--line-strong)}
.detail-actions{margin-top:26px;padding-top:18px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:8px}
.range-note{font-size:11.5px;color:var(--ink-faint);margin-bottom:16px;line-height:1.6}
.range-note strong{color:var(--accent)}
.bar-row{display:flex;align-items:center;gap:10px;margin-bottom:9px;font-size:12px}
.bar-label{flex:0 0 120px;color:var(--ink-dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bar-track{flex:1;height:7px;background:var(--panel-2);border-radius:4px;overflow:hidden}
.bar-fill{display:block;height:100%;background:linear-gradient(90deg, var(--blue), var(--accent));border-radius:4px}
.bar-val{flex:0 0 auto;font-family:"Spline Sans Mono";color:var(--ink);font-size:12px}

/* ── monetization ────────────────────────────────────────────────────────── */
.gate-box{max-width:440px;margin:8vh auto;background:var(--panel);border:1px solid var(--line);
  border-radius:var(--radius);padding:34px;text-align:center;box-shadow:var(--shadow-1)}
.mon-table{width:100%;border-collapse:collapse;background:var(--panel);border:1px solid var(--line);
  border-radius:var(--radius);overflow:hidden}
.mon-table th{font-size:10px;text-transform:uppercase;letter-spacing:.14em;color:var(--ink-faint);
  text-align:left;padding:13px 15px;border-bottom:1px solid var(--line);font-weight:700}
.mon-table td{padding:12px 15px;border-bottom:1px solid var(--line);font-size:13px}
.mon-table tr:last-child td{border-bottom:none}
.mon-table tr:hover td{background:rgba(255,255,255,.015)}
.mon-table .ok{color:var(--accent);font-weight:700}
.mon-table .pend{color:var(--warn)}
.elig-caption{color:var(--ink-faint);font-size:12px;margin:0 0 12px;line-height:1.6}
.earn-form{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.earn-total{color:var(--ink-dim);font-family:"Spline Sans Mono";font-size:13px;margin-bottom:12px}

/* ── modal ───────────────────────────────────────────────────────────────── */
.modal{position:fixed;inset:0;background:rgba(4,6,10,.7);backdrop-filter:blur(6px);z-index:90;
  display:grid;place-items:center;padding:20px}
.modal-box{background:var(--panel-2);border:1px solid var(--line-strong);border-radius:18px;
  padding:26px;width:520px;max-width:94vw;max-height:86vh;overflow-y:auto;
  box-shadow:0 40px 100px rgba(0,0,0,.6);animation:rise .25s var(--ease) both}
.modal-box h3{font-family:"Bricolage Grotesque";margin:0 0 16px;font-size:18px}
.set-label{display:block;color:var(--ink-dim);font-size:11px;text-transform:uppercase;
  letter-spacing:.14em;font-weight:700;margin-bottom:8px}

/* ── command palette ─────────────────────────────────────────────────────── */
.palette{position:fixed;inset:0;background:rgba(4,6,10,.65);backdrop-filter:blur(6px);
  z-index:100;display:grid;place-items:start center;padding-top:13vh}
.palette-box{width:580px;max-width:93vw;background:rgba(20,24,36,.97);border:1px solid var(--line-strong);
  border-radius:18px;overflow:hidden;box-shadow:0 40px 110px rgba(0,0,0,.7), 0 0 0 1px rgba(110,242,196,.08);
  animation:palIn .2s var(--ease) both}
@keyframes palIn{from{opacity:0;transform:translateY(-12px) scale(.98)}to{opacity:1;transform:none}}
#paletteInput{width:100%;background:transparent;border:none;border-bottom:1px solid var(--line);
  color:var(--ink);padding:18px 22px;font:inherit;font-size:16px;outline:none;box-sizing:border-box}
.palette-results{max-height:350px;overflow-y:auto;padding:8px}
.palette-item{display:flex;align-items:center;gap:13px;padding:11px 13px;border-radius:10px;cursor:pointer}
.palette-item.active,.palette-item:hover{background:rgba(110,242,196,.07)}
.palette-item.active{box-shadow:inset 2px 0 0 var(--accent)}
.palette-icon{color:var(--accent);font-size:14px;width:20px;text-align:center;flex-shrink:0}
.palette-label{font-size:14px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.palette-sub{color:var(--ink-faint);font-size:11px;margin-left:10px;font-weight:400}
.palette-empty{color:var(--ink-faint);text-align:center;padding:24px;font-size:13px}
.palette-foot{border-top:1px solid var(--line);color:var(--ink-faint);font-size:11px;
  padding:10px 18px;font-family:"Spline Sans Mono";letter-spacing:.04em}

/* ── responsive ──────────────────────────────────────────────────────────── */
@media(max-width:980px){
  .movers-grid{grid-template-columns:1fr}
  .pulse-row{grid-template-columns:28px minmax(120px,1.4fr) 56px 1fr 90px;gap:9px}
  .pulse-row > span:nth-child(5),.pulse-row > span:nth-child(6){display:none}
  .pulse-header-row > span:nth-child(5),.pulse-header-row > span:nth-child(6){display:none}
  .focus-tiles{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  main{padding:18px}
  .stat-row{grid-template-columns:1fr 1fr;gap:12px}
  .stat{padding:17px 16px 15px}
  .stat .value{font-size:clamp(19px, 5.4vw, 28px)}
  .split{grid-template-columns:1fr}
  .topbar{flex-wrap:wrap;gap:10px;padding:14px 18px}
  .tabs,.daterange{padding-left:18px;padding-right:18px}
  .creator-search{margin-left:18px;margin-right:18px}
  .tab{padding:8px 12px}
  .focus-tiles{grid-template-columns:1fr}
  .drawer{width:100vw;max-width:100vw}
}

/* entrance animation runs once per page view, not on background refreshes */
.cards.loaded .card{animation:none}

/* ═════════ v4: live sync strip ═════════ */
.sync-strip{position:sticky;top:67px;z-index:35;background:rgba(10,13,20,.95);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);padding:0 30px 9px;animation:rise .3s var(--ease) both}
.sync-bar{height:3px;background:var(--panel-2);border-radius:2px;overflow:hidden;margin:0 -30px 8px}
.sync-fill{display:block;height:100%;width:0%;border-radius:2px;transition:width .6s var(--ease);
  background:linear-gradient(90deg, var(--blue), var(--accent));
  box-shadow:0 0 12px rgba(110,242,196,.6)}
.sync-row{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.sync-label{font-family:"Spline Sans Mono";font-size:11.5px;color:var(--ink-dim)}
.sync-label b{color:var(--accent)}
.sync-lanes{display:flex;gap:6px;flex-wrap:wrap}
.lane{font-family:"Spline Sans Mono";font-size:10px;color:var(--ink-dim);border:1px solid var(--line);
  border-radius:12px;padding:2px 9px}
.lane-done{color:var(--accent);border-color:rgba(110,242,196,.35)}
.sync-strip.done .sync-label{color:var(--accent)}

/* ═════════ v4: intel ticker ═════════ */
.ticker{display:flex;align-items:center;gap:14px;background:linear-gradient(90deg, rgba(110,242,196,.06), rgba(167,139,250,.05) 60%, transparent);
  border:1px solid var(--line);border-left:2px solid var(--accent);border-radius:13px;
  padding:11px 18px;margin:-12px 0 26px;overflow:hidden}
.ticker-brand{font-family:"Spline Sans Mono";font-size:9.5px;font-weight:700;letter-spacing:.18em;
  color:var(--accent);flex-shrink:0}
.ticker-view{flex:1;min-width:0}
.ticker-item{font-size:13px;color:var(--ink-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  opacity:0;transform:translateY(5px);transition:.28s var(--ease)}
.ticker-item.in{opacity:1;transform:none}
.ticker-item b{color:var(--ink)}
.ticker-icn{font-size:12px;margin-right:4px}
.ticker-icn.good{color:var(--accent)} .ticker-icn.bad{color:var(--bad)}
.ticker-icn.warn{color:var(--warn)} .ticker-icn.neutral{color:var(--violet)}
.ticker-dots{display:flex;gap:4px;flex-shrink:0}
.ticker-dots i{width:5px;height:5px;border-radius:50%;background:var(--line-strong);transition:.2s}
.ticker-dots i.on{background:var(--accent);box-shadow:0 0 6px rgba(110,242,196,.7)}

/* ═════════ v4: platform mix ═════════ */
.mix{margin:-8px 0 26px}
.mix-track{display:flex;height:10px;border-radius:6px;overflow:hidden;gap:2px;background:var(--panel-2)}
.mix-seg{display:block;height:100%;min-width:3px;transition:width .7s var(--ease);opacity:.9}
.mix-legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:9px}
.mix-chip{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;color:var(--ink-dim)}
.mix-chip i{width:8px;height:8px;border-radius:3px;display:inline-block}
.mix-chip b{color:var(--ink);font-family:"Spline Sans Mono";font-weight:600}
.mix-pct{color:var(--ink-faint);font-family:"Spline Sans Mono"}
.mix-total{margin-left:auto;color:var(--ink-faint);font-size:10px;text-transform:uppercase;letter-spacing:.12em}
@media(max-width:760px){.sync-strip{top:auto}}

/* very narrow phones: one full-width stat per row — 8-digit numbers stay whole */
@media(max-width:430px){
  .stat-row{grid-template-columns:1fr}
  .stat .value{font-size:clamp(26px, 9vw, 34px)}
  .topbar{padding:12px 14px}
  .hud-clock{display:none}
  .tabs{overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}
  .tabs::-webkit-scrollbar{display:none}
  .tab{flex-shrink:0}
}

/* ═════════ v6 CINEMA — sci-fi command deck ═════════ */
/* blueprint grid field behind everything */
.gridfield{position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(rgba(110,242,196,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(110,242,196,.05) 1px, transparent 1px),
    linear-gradient(rgba(106,168,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(106,168,255,.035) 1px, transparent 1px);
  background-size:120px 120px,120px 120px,24px 24px,24px 24px;
  mask-image:radial-gradient(1100px 640px at 50% 0%, rgba(0,0,0,.9), transparent 78%);
  -webkit-mask-image:radial-gradient(1100px 640px at 50% 0%, rgba(0,0,0,.9), transparent 78%)}
/* slow scan sweep */
.scanline{position:fixed;inset:0;pointer-events:none;z-index:1;overflow:hidden}
.scanline::before{content:"";position:absolute;left:0;right:0;height:180px;top:-200px;
  background:linear-gradient(180deg, transparent, rgba(110,242,196,.045), transparent);
  animation:scanmove 9s linear infinite}
@keyframes scanmove{0%{top:-200px}100%{top:110vh}}

/* HUD corner brackets on key panels (multi-background L-ticks) */
.stat,.tile,.movers-card,.trend-card{
  background-image:
    linear-gradient(rgba(110,242,196,.55), rgba(110,242,196,.55)),
    linear-gradient(rgba(110,242,196,.55), rgba(110,242,196,.55)),
    linear-gradient(rgba(110,242,196,.55), rgba(110,242,196,.55)),
    linear-gradient(rgba(110,242,196,.55), rgba(110,242,196,.55)),
    linear-gradient(rgba(110,242,196,.55), rgba(110,242,196,.55)),
    linear-gradient(rgba(110,242,196,.55), rgba(110,242,196,.55)),
    linear-gradient(rgba(110,242,196,.55), rgba(110,242,196,.55)),
    linear-gradient(rgba(110,242,196,.55), rgba(110,242,196,.55)),
    linear-gradient(165deg, rgba(27,32,48,.75), rgba(14,17,26,.9));
  background-size:12px 1.5px,1.5px 12px, 12px 1.5px,1.5px 12px, 12px 1.5px,1.5px 12px, 12px 1.5px,1.5px 12px, cover;
  background-position:top 7px left 7px, top 7px left 7px,
    top 7px right 7px, top 7px right 7px,
    bottom 7px left 7px, bottom 7px left 7px,
    bottom 7px right 7px, bottom 7px right 7px, center;
  background-repeat:no-repeat}

/* holo sheen sweep across stats on load */
.stat{position:relative}
.stat > *{position:relative;z-index:1}
.stat::before{z-index:2}
@keyframes sheen{0%{transform:translateX(-130%) skewX(-18deg)}100%{transform:translateX(240%) skewX(-18deg)}}
.stat:hover::after{opacity:.7}

/* terminal prefix on section titles */
.section-title::before{content:"//";font-family:"Spline Sans Mono";font-size:14px;
  color:var(--accent);opacity:.7;font-weight:600;letter-spacing:0}

/* HUD clock */
.hud-clock{font-family:"Spline Sans Mono";font-size:11.5px;color:var(--accent);
  border:1px solid rgba(110,242,196,.25);border-radius:8px;padding:5px 10px;
  background:rgba(110,242,196,.05);letter-spacing:.08em;font-variant-numeric:tabular-nums}

/* clipped sci-fi corners on primary actions + active tab */
.btn-primary,.tab.is-active{
  clip-path:polygon(9px 0, 100% 0, 100% calc(100% - 9px), calc(100% - 9px) 100%, 0 100%, 0 9px)}

/* intel ticker: blinking terminal cursor */
.ticker-item.in::after{content:"▍";color:var(--accent);margin-left:5px;animation:blink 1.05s steps(1) infinite}
@keyframes blink{50%{opacity:0}}

/* sync fill: motion stripes */
.sync-fill{background-image:linear-gradient(90deg, var(--blue), var(--accent)),
  repeating-linear-gradient(-55deg, rgba(255,255,255,.22) 0 8px, transparent 8px 16px);
  background-blend-mode:overlay;animation:stripes 1.1s linear infinite}
@keyframes stripes{to{background-position:0 0, 32px 0}}

/* pulse rings breathe */
.pulse-ring.hot{animation:ringbreathe 2.6s var(--ease) infinite}
@keyframes ringbreathe{0%,100%{filter:drop-shadow(0 0 5px currentColor)}50%{filter:drop-shadow(0 0 13px currentColor)}}

/* mix track shimmer */
.mix-track{position:relative;overflow:hidden}
.mix-track::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg, transparent 30%, rgba(255,255,255,.14) 50%, transparent 70%);
  transform:translateX(-100%);animation:sheen 4.5s var(--ease) infinite}

/* boot sequence overlay */
.boot{position:fixed;inset:0;z-index:200;background:#05070b;display:grid;place-items:center;
  transition:opacity .45s var(--ease)}
.boot-out{opacity:0;pointer-events:none}
.boot-inner{text-align:center}
.boot-mark{font-size:34px;color:var(--accent);filter:drop-shadow(0 0 24px rgba(110,242,196,.7));
  animation:markPulse 1.4s var(--ease) infinite}
.boot-name{font-family:"Bricolage Grotesque";font-weight:800;font-size:22px;letter-spacing:.5em;
  margin:18px 0 26px;padding-left:.5em;
  background:linear-gradient(90deg,#fff,#b9c4dc);-webkit-background-clip:text;background-clip:text;color:transparent}
.boot-bar{width:240px;height:2.5px;background:var(--panel-2);border-radius:2px;margin:0 auto 18px;overflow:hidden}
.boot-bar span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--blue),var(--accent));
  box-shadow:0 0 12px rgba(110,242,196,.8);animation:bootfill 1.25s var(--ease) forwards}
@keyframes bootfill{to{width:100%}}
.boot-line{font-family:"Spline Sans Mono";font-size:10.5px;letter-spacing:.22em;color:var(--ink-faint)}

@media (prefers-reduced-motion:reduce){
  .scanline::before,.mix-track::after,.sync-fill,.pulse-ring.hot,.ticker-item.in::after{animation:none}
}


/* ── v7: channel links, pins, freshness, audit, auto-refresh ─────────────── */
.ext-link{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:6px;
  color:var(--ink-dim);text-decoration:none;font-size:12px;border:1px solid transparent;transition:.15s;flex-shrink:0}
.ext-link:hover{color:var(--accent);border-color:var(--accent);background:rgba(110,242,196,.08);
  box-shadow:0 0 12px rgba(110,242,196,.25)}
.pulse-name .ext-link{width:18px;height:18px;font-size:11px;vertical-align:middle}
.pin-btn{background:none;border:none;cursor:pointer;color:var(--ink-faint);font-size:13px;
  padding:2px 3px;line-height:1;transition:.15s;opacity:.45}
.card:hover .pin-btn{opacity:1}
.pin-btn:hover{color:#ffd166;transform:scale(1.2)}
.pin-btn.on{color:#ffd166;opacity:1;text-shadow:0 0 10px rgba(255,209,102,.5)}
.card.pinned{border-color:rgba(255,209,102,.28)}
.card.pinned::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,rgba(255,209,102,.7),transparent 70%);border-radius:inherit}
.card-foot{display:flex;justify-content:space-between;align-items:center;gap:8px}
.card-sync{color:var(--ink-faint);font-size:10px;font-family:'Spline Sans Mono',monospace;white-space:nowrap}
.auto-refresh{font-size:11px;font-family:'Spline Sans Mono',monospace;color:var(--accent)}
.auto-refresh.off{color:var(--ink-faint)}
.audit-row{display:flex;gap:8px;align-items:baseline;padding:4px 0;border-bottom:1px dashed var(--line)}
.audit-row time{color:var(--ink-faint);font-size:10px;font-family:'Spline Sans Mono',monospace;white-space:nowrap;flex-shrink:0}
.audit-action{color:var(--accent);font-weight:600;white-space:nowrap;flex-shrink:0}
.audit-detail{color:var(--ink-dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#trendPngBtn{padding:3px 10px;font-size:11px}
.tile .live .ext-link{width:18px;height:18px;font-size:11px}