@import url("/branding/design-system/tokens.css");

/* ── Custom font: GC Epic Pro ── */
@font-face {
  font-family: "GC Epic Pro Demo ExtBd";
  src: url("/fonts/gc-epic-pro-demo.extra-bold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
html,body{max-width:100%;overflow-x:hidden}
body{
  background:var(--bg);color:var(--text);
  font:15px/1.55 -apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Helvetica Neue",Arial,sans-serif;
  transition:background .35s ease,color .35s ease;
}
body::selection{background:var(--lime);color:var(--ink)}
button:not(:disabled),[role=button]:not(:disabled){cursor:pointer}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

.siteGlow{
  position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(circle at 22% 28%,var(--lime-dim),transparent 22%),
    radial-gradient(circle at 78% 10%,rgba(255,255,255,.035),transparent 28%);
}
main{position:relative;z-index:1;max-width:1500px;margin:0 auto;padding:0 42px 80px}

/* HEADER */
.top{
  height:76px;display:flex;align-items:center;justify-content:space-between;
  border-bottom:1px solid var(--border-subtle);gap:24px
}
.brand{display:flex;align-items:center;gap:12px}
.brandMark{width:34px;height:34px;flex:0 0 34px}
.brandMark img{width:100%;height:100%;object-fit:contain}
.brandText{display:flex;flex-direction:column;gap:0}
.eyebrow,.kicker{
  color:var(--muted);font-size:9px;line-height:1.2;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase
}
.eyebrow{color:var(--text);display:flex;align-items:center;gap:7px}
.liveDot{width:5px;height:5px;border-radius:50%;background:var(--lime);box-shadow:0 0 9px var(--lime)}
.tag{font-size:10px;color:var(--muted);letter-spacing:.02em}
.topRight{display:flex;align-items:center;gap:22px}
.srcLink{font-size:10px;color:var(--muted-strong);transition:color .2s ease}
.srcLink:hover{color:var(--text)}
.demoBadge{
  font-size:8px;letter-spacing:.14em;color:var(--lime);
  border:1px solid var(--lime-dim);padding:5px 8px;border-radius:999px
}
.themeToggle{
  width:30px;height:30px;border:0;border-radius:50%;
  background:transparent;color:var(--muted);font-size:17px
}
.themeToggle:hover{color:var(--lime)}

/* HERO */
.hero{min-height:calc(100vh - 76px);display:flex;flex-direction:column;justify-content:center}
.heroInner{
  display:grid;grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr);
  align-items:center;gap:4vw;min-height:650px
}
.heroVisual{position:relative;min-height:560px;display:flex;align-items:center;justify-content:center}
.heroHalo{
  position:absolute;width:min(42vw,560px);height:min(42vw,560px);border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.08),rgba(198,255,0,.055) 34%,transparent 68%);
  filter:blur(1px)
}
.heroDardar{position:relative;z-index:2;width:min(72%,540px)}
.heroDardar img{width:100%;filter:drop-shadow(0 38px 55px rgba(0,0,0,.42));transition:filter .4s ease,transform .5s cubic-bezier(.2,0,0,1)}
body.scanning .heroDardar img{filter:drop-shadow(0 38px 55px rgba(0,0,0,.42)) drop-shadow(0 0 42px var(--lime-glow));transform:translateY(-5px)}
.heroSignal{position:absolute;right:9%;bottom:16%;width:110px;height:46px;opacity:.7}
.heroSignal span,.heroSignal i,.heroSignal b{position:absolute;display:block;height:1px;background:var(--lime)}
.heroSignal span{left:0;right:0;top:22px;transform:rotate(-7deg)}
.heroSignal i{width:30px;left:28px;top:16px;transform:rotate(28deg)}
.heroSignal b{width:42px;right:0;top:11px;transform:rotate(-30deg)}

.heroCopy{max-width:620px;padding-bottom:4vh}
.heroEyebrow{margin-bottom:22px;color:var(--lime)}
.hero h1{
  font-size:clamp(88px,11vw,172px);line-height:.78;letter-spacing:-.055em;
  font-weight:600;margin:0 0 30px
}
.hero h1 em{font-style:normal;color:var(--lime)}
.lede{
  color:var(--text-secondary);font-size:clamp(18px,1.5vw,23px);
  line-height:1.35;letter-spacing:-.02em;margin-bottom:38px;max-width:530px
}
.actions{display:flex;align-items:center;gap:18px;margin-bottom:14px}
#run{
  border:0;background:var(--lime);color:var(--ink);
  min-height:52px;padding:0 25px;border-radius:999px;
  font-size:14px;font-weight:750;letter-spacing:-.01em;
  display:inline-flex;align-items:center;gap:10px;
  box-shadow:0 10px 30px var(--lime-dim);
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease
}
#run:hover{transform:translateY(-2px);background:var(--lime2);box-shadow:0 14px 38px var(--lime-glow)}
#run:active{transform:scale(.98)}
#run:disabled{opacity:.5;transform:none}
.play{font-size:13px}
.scanCounter{font-size:10px;color:var(--muted);letter-spacing:.06em}
.heroNote{font-size:10px;color:var(--muted);letter-spacing:.02em}
.heroFoot{
  display:flex;justify-content:space-between;border-top:1px solid var(--border-subtle);
  padding-top:13px;color:var(--muted);font-size:8px;letter-spacing:.16em
}

/* CREW */
.crew{padding:150px 0 120px}
.sectionIntro{display:grid;grid-template-columns:1fr 3fr;gap:30px;margin-bottom:58px}
.sectionIntro h2{font-size:clamp(48px,6vw,88px);line-height:.9;letter-spacing:-.05em;font-weight:600}
.sectionIntro h2 span{color:var(--muted)}
.sectionIntro>div>p{margin-top:22px;color:var(--muted-strong);font-size:14px}
.crewGrid{
  display:grid;grid-template-columns:repeat(6,1fr);gap:1px;
  border-top:1px solid var(--border);border-bottom:1px solid var(--border)
}
.crewCard{
  min-width:0;position:relative;padding:28px 16px 26px;
  background:transparent;border-right:1px solid var(--border-subtle);
  transition:background .25s ease,transform .25s ease
}
.crewCard:last-child{border-right:0}
.crewCard:hover{background:var(--surface-hover);transform:translateY(-4px)}
.crewCard.active{background:var(--agent-surface-active)}
.crewImg{
  width:100%;height:150px;margin-bottom:22px;display:flex;align-items:end;justify-content:center
}
.crewImg img{width:145px;height:145px;object-fit:contain;filter:drop-shadow(0 14px 22px rgba(0,0,0,.28));transition:transform .3s ease}
.crewCard:hover .crewImg img{transform:translateY(-5px) scale(1.035)}
.crewIndex{font-size:8px;color:var(--muted);letter-spacing:.16em}
.crewInfo h3{font-size:13px;line-height:1.15;letter-spacing:-.01em;margin:6px 0 9px}
.crewInfo p{font-size:10px;line-height:1.45;color:var(--muted);max-width:190px}
.crewCard.active .crewIndex,.crewCard.active h3{color:var(--lime)}

/* SCAN */
.scanStatus{
  padding:88px 0 110px;border-top:1px solid var(--border);
}
.scanStatusHead{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:44px}
.scanStatusHead h2{font-size:clamp(36px,4vw,62px);line-height:.95;letter-spacing:-.045em;margin-top:9px}
.agentDeckStatus{font-size:9px;letter-spacing:.16em;color:var(--lime);padding-bottom:6px}
.pipeline{display:grid;grid-template-columns:1fr 32px 1fr 32px 1fr 32px 1fr;align-items:center}
.pipelineStep{
  display:grid;grid-template-columns:70px 1fr;align-items:center;gap:15px;
  min-height:105px;padding:14px 15px;border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);transition:border-color .25s ease,background .25s ease
}
.pipelineStep.active{border-color:var(--lime);background:var(--agent-surface-active)}
.pipelineStep.done{border-color:var(--lime-dim)}
.pipelineIcon{width:66px;height:66px;opacity:.38;transition:opacity .25s ease,transform .25s ease}
.pipelineStep.active .pipelineIcon,.pipelineStep.done .pipelineIcon{opacity:1}
.pipelineStep.active .pipelineIcon{transform:translateY(-3px)}
.pipelineIcon img{width:100%;height:100%;object-fit:contain}
.pipelineLabel{display:block;font-size:9px;letter-spacing:.15em;color:var(--muted);font-weight:700}
.pipelineStep.active .pipelineLabel{color:var(--lime)}
.pipelineDesc{display:block;font-size:11px;color:var(--muted);margin-top:4px}
.pipelineArrow{text-align:center;color:var(--border-strong);font-size:16px}
.scanProgress{margin-top:34px}
.meter{height:3px;background:var(--meter-bg);overflow:hidden}
#heroMeter{display:block;width:0;height:100%;background:var(--lime);box-shadow:0 0 12px var(--lime);transition:width .4s var(--ease)}
.scanProgressInfo{display:flex;justify-content:space-between;align-items:baseline;margin-top:9px}
.pct{font-size:12px;font-variant-numeric:tabular-nums}
.tiny{font-size:8px;color:var(--muted);letter-spacing:.16em}
.scanQueue{margin-top:38px;padding-top:18px;border-top:1px solid var(--border-subtle)}
.queue{list-style:none;margin-top:8px}
.queue li{font-size:11px;color:var(--muted);padding:3px 0}
.queue li::before{content:"";display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--agent-idle);margin:0 10px 2px 0}
.queue li.active{color:var(--lime)}
.queue li.active::before{background:var(--lime);box-shadow:0 0 7px var(--lime)}
.queue li.done{color:var(--text-secondary)}

/* STATS */
.stats{
  display:grid;grid-template-columns:repeat(5,1fr);
  border-top:1px solid var(--border);border-bottom:1px solid var(--border);
  margin:0 0 120px
}
.stats div{padding:23px 18px;border-right:1px solid var(--border-subtle)}
.stats div:last-child{border-right:0}
.stats b{display:block;font-size:30px;line-height:1;letter-spacing:-.05em;font-weight:500}
.stats span{display:block;margin-top:8px;font-size:8px;color:var(--muted);letter-spacing:.15em;text-transform:uppercase}

/* RESULTS */
.results{padding-bottom:100px}
.resultsHead{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:28px}
.resultsHead h3{font-size:clamp(30px,4vw,54px);line-height:.95;letter-spacing:-.045em;margin-top:8px}
.resultsActions{display:flex;gap:18px;align-items:center}
.resultsActions a{font-size:9px;letter-spacing:.14em;color:var(--muted)}
.resultsActions a:hover{color:var(--lime)}
.exportBtn{color:var(--lime)!important}
.liveTag{font-size:7px;color:var(--lime);border-left:1px solid var(--lime);padding-left:8px;margin-left:8px;letter-spacing:.1em}
.filterBar{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:24px}
.filterBtn{
  border:0;border-bottom:1px solid var(--border);background:transparent;color:var(--muted);
  padding:8px 7px;font-size:9px;letter-spacing:.08em
}
.filterBtn:hover{color:var(--text)}
.filterBtn.hot{color:var(--lime)}
.filterBtn.active{color:var(--text);border-color:var(--lime)}
.signals{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--border)}
.card{
  background:var(--bg);padding:28px;cursor:pointer;min-height:190px;
  transition:background .2s ease,transform .2s ease
}
.card:hover{background:var(--surface-hover);transform:translateY(-2px)}
.meta{display:flex;justify-content:space-between;color:var(--muted);font-size:8px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px}
.hotBadge{color:var(--lime);font-weight:700}
.card h4{font-size:20px;line-height:1.15;letter-spacing:-.025em;margin-bottom:12px}
.card p{font-size:12px;line-height:1.55;color:var(--muted-strong);max-width:65ch}
.card p.src{margin-top:12px;font-size:10px}
.card p.src a{color:var(--lime)}
.verdictBadge{font-size:7px;padding:2px 5px}
.unavailable,.unavailable-title{color:var(--orange)}
.empty{padding:60px 20px;color:var(--muted);text-align:center;grid-column:1/-1;border:1px dashed var(--border)}
.signals .card.hot{position:relative}
.signals .card.hot::before{content:"HOT";position:absolute;top:18px;right:18px;color:var(--lime);font-size:8px;letter-spacing:.13em;font-weight:700}
.signals .card.hidden{display:none}

/* PRINCIPLES */
.principles{display:grid;grid-template-columns:1fr 1fr;gap:80px;padding:90px 0;border-top:1px solid var(--border)}
.principles>div{max-width:600px}
.principles strong{display:block;font-size:clamp(24px,2.5vw,38px);line-height:1.05;letter-spacing:-.04em;margin:12px 0 14px}
.principles p{font-size:13px;color:var(--muted-strong);max-width:48ch}

/* LIFETIME */
.lifetimeStats{border-top:1px solid var(--border);padding:70px 0 20px}
.statsRow{display:flex;justify-content:flex-start;gap:90px}
.statItem{display:flex;flex-direction:column;gap:4px}
.statNum{font-size:42px;letter-spacing:-.05em;color:var(--lime)}
.statLabel{font-size:8px;letter-spacing:.15em;color:var(--muted);text-transform:uppercase}

/* FOOTER */
footer{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--border);padding-top:18px;color:var(--muted);font-size:8px;letter-spacing:.14em}

/* DRAWER — keep functional, align with new language */
.signalDrawer{
  position:fixed;inset:0 0 0 auto;z-index:3000;width:min(520px,100vw);
  display:flex;flex-direction:column;background:var(--drawer-bg);
  border-left:1px solid var(--border);box-shadow:var(--drawer-shadow);
  transform:translateX(100%);transition:transform .35s var(--ease)
}
.signalDrawer.open{transform:translateX(0)}
.drawerHead{display:flex;justify-content:space-between;align-items:flex-start;padding:24px;border-bottom:1px solid var(--border)}
.drawerKicker{color:var(--muted);font-size:9px;letter-spacing:.16em}
.drawerMeta{display:flex;gap:14px;margin-top:8px;font-size:9px;letter-spacing:.1em;text-transform:uppercase}
.drawerClose{background:none;border:0;color:var(--muted);font-size:28px;line-height:1}
.drawerClose:hover{color:var(--text)}
.drawerBody{flex:1;overflow-y:auto;padding:30px 24px}
.drawerBody h2{font-size:28px;line-height:1.15;letter-spacing:-.03em;margin:4px 0 10px}
.drawerTags{margin-bottom:12px}
.drawerAuthor{color:var(--muted);font-size:12px;margin-bottom:24px}
.drawerAuthor b{color:var(--text)}
.drawerSection{margin:24px 0}
.drawerSection>b{display:block;color:var(--muted);font-size:9px;letter-spacing:.16em;margin-bottom:9px}
.drawerSection p{color:var(--text-secondary);font-size:14px;line-height:1.65}
.drawerSection.lead p{color:var(--text)}
.drawerSection ul{list-style:none}
.drawerSection li{color:var(--text-secondary);font-size:13px;line-height:1.55;padding:7px 0;border-top:1px solid var(--border-subtle)}
.drawerAssessment{border-top:1px solid var(--border);padding-top:18px}
.drawerAssessment strong{color:var(--lime);margin-left:6px}
.drawerFoot{display:flex;gap:18px;padding:15px 24px;border-top:1px solid var(--border)}
.drawerFoot a{color:var(--lime);font-size:10px;letter-spacing:.13em}
.drawerEntities{display:flex;flex-wrap:wrap;gap:7px}
.drawerEntities span{font-size:10px;padding:5px 8px;border:1px solid var(--border);color:var(--muted)}
.assessmentGrid{display:flex;gap:22px;margin-bottom:10px}
.assessmentGrid span{font-size:11px;color:var(--muted)}
.assessmentGrid strong{display:block;color:var(--text);font-size:13px;margin-top:4px}

/* SPLASH */
.splashOverlay{position:fixed;inset:0;z-index:2000;background:var(--splash-bg);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;pointer-events:none}
.splashOverlay.ready{opacity:1;visibility:visible;pointer-events:auto;animation:fadeIn .3s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.splashCard{width:min(440px,90vw);padding:35px 10px;text-align:center}
.splashDardar{width:150px;height:150px;margin:0 auto 28px}
.splashDardar img{width:100%;height:100%;object-fit:contain}
.splashKicker{font-size:9px;color:var(--lime);letter-spacing:.18em;font-weight:700;margin-bottom:12px}
.splashCard h2{font-size:48px;line-height:.88;letter-spacing:-.05em;margin-bottom:20px}
.splashTyping{color:var(--text);font-size:13px;min-height:20px;margin-bottom:10px}
.splashDesc{color:var(--muted);font-size:12px;line-height:1.6;margin-bottom:25px}
.splashLinks{display:flex;justify-content:center;gap:18px;margin-bottom:20px}
.splashLinks a{font-size:9px;letter-spacing:.12em;color:var(--muted)}
.splashLinks a:hover{color:var(--lime)}
.splashAuthor{font-size:10px;color:var(--muted);margin-bottom:22px}
.splashAuthor a{color:var(--lime)}
.splashStart{border:0;background:var(--lime);color:var(--ink);padding:12px 28px;border-radius:999px;font-size:12px;font-weight:700}

/* EXIT */
.exitOverlay{position:fixed;inset:0;z-index:9999;background:var(--splash-bg);display:flex;align-items:center;justify-content:center;animation:fadeIn .2s ease}
.exitCard{text-align:center;padding:32px;max-width:360px}
.exitClose{position:absolute;top:12px;right:16px;background:none;border:0;color:var(--muted);font-size:24px}
.exitCard h3{font-size:28px;margin:16px 0 8px}
.exitCard p{color:var(--muted);font-size:13px}
.exitLinks{margin-top:16px!important}
.exitLinks a{color:var(--lime);font-size:12px}

/* TIMELINE */
.timeline{margin-top:12px}
.tlDay{margin-bottom:28px}
.tlDate{font-size:28px;letter-spacing:.04em;color:var(--lime);margin-bottom:12px;border-bottom:1px solid var(--border);padding-bottom:8px}
.tlRuns{display:flex;flex-direction:column;gap:1px;background:var(--border)}
.tlRun{display:grid;grid-template-columns:80px 1fr auto;align-items:center;gap:12px;padding:15px 16px;background:var(--bg)}
.tlRun.ok{border-left:2px solid var(--lime)}
.tlRun.idle{opacity:.65}
.tlTime{font-size:11px;color:var(--muted)}
.tlInfo{display:flex;flex-direction:column;gap:2px}
.tlId{font-size:10px;color:var(--muted)}
.tlStats{font-size:13px}
.tlBadge{font-size:8px;letter-spacing:.12em;padding:3px 7px}
.tlBadge.ok{color:var(--lime)}
.tlBadge.idle{color:var(--muted)}

/* RESPONSIVE */
@media(max-width:1100px){
  main{padding:0 28px 60px}
  .heroInner{grid-template-columns:1fr 1fr;gap:25px}
  .heroDardar{width:min(95%,500px)}
  .crewGrid{grid-template-columns:repeat(3,1fr)}
  .crewCard:nth-child(3){border-right:0}
  .crewCard:nth-child(n+4){border-top:1px solid var(--border-subtle)}
  .pipeline{grid-template-columns:1fr 24px 1fr 24px 1fr 24px 1fr}
}
@media(max-width:780px){
  main{padding:0 18px 48px}
  .top{height:auto;min-height:68px;padding:12px 0}
  .topRight{gap:13px}
  .demoBadge,.srcLink:nth-of-type(1){display:none}
  .hero{min-height:auto;padding:50px 0 0}
  .heroInner{grid-template-columns:1fr;min-height:0;gap:18px}
  .heroVisual{min-height:390px;order:0}
  .heroDardar{width:min(76vw,390px)}
  .heroCopy{padding:0 0 30px;text-align:center;margin:auto}
  .heroEyebrow{justify-content:center}
  .hero h1{font-size:clamp(76px,18vw,125px)}
  .lede{font-size:17px;margin-left:auto;margin-right:auto}
  .actions{justify-content:center;flex-wrap:wrap}
  .heroNote{display:none}
  .heroFoot{font-size:7px}
  .crew{padding:100px 0 80px}
  .sectionIntro{grid-template-columns:1fr;gap:18px;margin-bottom:38px}
  .sectionIntro h2{font-size:clamp(50px,12vw,76px)}
  .crewGrid{grid-template-columns:repeat(2,1fr)}
  .crewCard:nth-child(2n){border-right:0}
  .crewCard:nth-child(n+3){border-top:1px solid var(--border-subtle)}
  .crewImg{height:125px}
  .scanStatus{padding:70px 0 80px}
  .pipeline{display:flex;overflow-x:auto;gap:8px;padding-bottom:8px}
  .pipelineArrow{display:none}
  .pipelineStep{min-width:210px;border:1px solid var(--border)}
  .stats{grid-template-columns:repeat(3,1fr);margin-bottom:80px}
  .stats div{border-bottom:1px solid var(--border-subtle)}
  .stats div:nth-child(3){border-right:0}
  .signals{grid-template-columns:1fr}
  .principles{grid-template-columns:1fr;gap:50px;padding:70px 0}
  .statsRow{gap:45px}
  footer{flex-direction:column}
}
@media(max-width:500px){
  .topRight .srcLink:last-of-type{display:none}
  .heroVisual{min-height:310px}
  .heroDardar{width:min(72vw,290px)}
  .heroSignal{right:3%;bottom:8%;transform:scale(.7)}
  .hero h1{font-size:clamp(66px,19vw,96px)}
  .lede{font-size:16px}
  #run{width:100%;justify-content:center}
  .crewGrid{grid-template-columns:1fr}
  .crewCard{display:grid;grid-template-columns:105px 1fr;gap:16px;align-items:center;border-right:0!important}
  .crewImg{width:105px;height:105px;margin:0}
  .crewImg img{width:105px;height:105px}
  .crewInfo p{font-size:10px}
  .stats{grid-template-columns:repeat(2,1fr)}
  .stats div:nth-child(2n){border-right:0}
  .resultsActions{width:100%;justify-content:space-between}
  .resultsHead{align-items:flex-start;flex-direction:column}
  .card{padding:22px;min-height:0}
  .statsRow{gap:28px}
  .statNum{font-size:34px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}
}
/* ───────────────────────────────────────────────────────────────
   DARDAR ART-DIRECTION PASS
   Editorial / monochrome / no glass / lime as signal only
   ─────────────────────────────────────────────────────────────── */

.siteGlow{display:none!important}
main{max-width:1480px;padding-left:48px;padding-right:48px}

.top{height:72px;border-bottom-color:var(--border)}
.topRight{gap:24px}
.demoBadge{border:0;border-left:1px solid var(--lime);border-radius:0;padding:0 0 0 9px}
.themeToggle{border-radius:0}

.hero{
  min-height:calc(100vh - 72px);
  padding-top:12px;
}
.heroInner{
  grid-template-columns:minmax(0,1.08fr) minmax(390px,.92fr);
  gap:clamp(40px,7vw,120px);
  min-height:690px;
  padding:35px 0 24px;
}
.heroVisual{min-height:590px}
.heroHalo{
  width:min(44vw,570px);
  height:min(44vw,570px);
  border:1px solid var(--border);
  background:none!important;
  filter:none!important;
}
.heroHalo::before,.heroHalo::after{background:none!important}
.heroDardar{width:min(80%,600px)}
.heroDardar img{filter:drop-shadow(0 34px 38px rgba(0,0,0,.28))}
.heroSignal{opacity:.8}
.heroEyebrow{margin-bottom:28px}
.hero h1{
  font-size:clamp(96px,11.5vw,182px);
  line-height:.76;
  letter-spacing:-.075em;
  margin-bottom:36px;
}
.hero h1 em{color:var(--text)}
.lede{max-width:500px;font-size:clamp(17px,1.3vw,21px);margin-bottom:32px}
#run{
  min-height:50px;
  padding:0 23px;
  border-radius:6px;
  box-shadow:none;
}
#run:hover{box-shadow:none}
.heroFoot{margin-top:5px}

.crew{
  padding:132px 0 118px;
  border-top:0;
}
.sectionIntro{grid-template-columns:minmax(130px,1fr) minmax(0,3fr);margin-bottom:50px}
.sectionIntro h2{letter-spacing:-.065em}
.crewGrid{
  grid-template-columns:repeat(6,1fr);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}
.crewCard{
  padding:18px 14px 24px;
  border-right:1px solid var(--border-subtle);
}
.crewCard:hover{transform:none;background:var(--surface-hover)}
.crewImg{height:188px;margin-bottom:20px}
.crewImg img{width:168px;height:168px;filter:drop-shadow(0 15px 20px rgba(0,0,0,.22))}
.crewCard:hover .crewImg img{transform:translateY(-5px) scale(1.02)}
.crewInfo h3{font-size:13px}
.crewInfo p{max-width:185px}

.scanStatus{
  padding:82px 0 104px;
  border-top:1px solid var(--border);
}
.scanStatusHead{margin-bottom:38px}
.pipeline{grid-template-columns:1fr 24px 1fr 24px 1fr 24px 1fr}
.pipelineStep{
  min-height:112px;
  border-radius:0;
  padding:12px 13px;
}
.pipelineStep.active{background:var(--agent-surface-active)}
.pipelineArrow{font-size:13px}
.meter{height:2px}

.stats{
  margin-bottom:118px;
  border-color:var(--border);
}
.stats div{padding:22px 18px}

.results{padding-bottom:104px}
.resultsHead{margin-bottom:25px}
.filterBtn{border-radius:0}
.card{border-radius:0;box-shadow:none}
.card:hover{transform:none;background:var(--surface-hover)}

.principles{
  gap:clamp(50px,9vw,130px);
  padding:88px 0;
}
.lifetimeStats{padding:68px 0 20px}

.signalDrawer{
  border-radius:0;
  box-shadow:-28px 0 70px rgba(0,0,0,.28);
}
.drawerEntities span{border-radius:0}

.splashOverlay{background:var(--splash-bg)}
.splashCard{width:min(500px,90vw)}
.splashDardar{width:190px;height:190px}
.splashStart{border-radius:6px}

@media(max-width:1100px){
  main{padding-left:30px;padding-right:30px}
  .heroInner{gap:32px}
  .crewGrid{grid-template-columns:repeat(3,1fr)}
  .crewCard:nth-child(3){border-right:0}
  .crewCard:nth-child(n+4){border-top:1px solid var(--border-subtle)}
}
@media(max-width:780px){
  main{padding-left:20px;padding-right:20px}
  .hero{padding-top:35px}
  .heroInner{grid-template-columns:1fr;min-height:0;gap:10px;padding:0}
  .heroVisual{min-height:430px}
  .heroHalo{width:350px;height:350px}
  .heroDardar{width:min(80vw,410px)}
  .heroCopy{text-align:center}
  .heroEyebrow{justify-content:center}
  .hero h1{font-size:clamp(82px,18vw,128px)}
  .lede{margin-left:auto;margin-right:auto}
  .crew{padding-top:96px}
  .crewGrid{grid-template-columns:repeat(2,1fr)}
  .crewCard:nth-child(2n){border-right:0}
  .crewCard:nth-child(n+3){border-top:1px solid var(--border-subtle)}
}
@media(max-width:500px){
  main{padding-left:18px;padding-right:18px}
  .heroVisual{min-height:320px}
  .heroDardar{width:min(74vw,300px)}
  .hero h1{font-size:clamp(68px,19vw,98px)}
  .crewGrid{grid-template-columns:1fr}
  .crewCard{border-right:0!important}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}

/* ── FINAL STATIC COMPOSITION PASS ───────────────────────────── */
.heroCopy{align-self:center}
.heroCopy::after{
  content:"";
  display:block;
  width:54px;
  height:1px;
  margin-top:38px;
  background:var(--lime);
  opacity:.7;
}
.heroFoot{max-width:100%;letter-spacing:.19em}
.sectionIntro .kicker{padding-top:8px}
.crewCard::after{
  content:"";
  position:absolute;
  left:14px;
  bottom:0;
  width:0;
  height:1px;
  background:var(--lime);
  transition:width .3s ease;
}
.crewCard:hover::after{width:34px}
.pipelineStep{background:transparent}
.pipelineStep.active .pipelineLabel{letter-spacing:.18em}
.resultsHead h3{max-width:17ch}
.resultsActions a{transition:color .2s ease}
.principles strong{max-width:15ch}
footer{
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding:22px 0 8px;
  border-top:1px solid var(--border);
  color:var(--muted);
  font-size:8px;
  letter-spacing:.15em;
}
@media(max-width:780px){
  .heroCopy::after{margin:30px auto 0}
  footer{flex-direction:column;gap:8px}
}

/* ── DARDAR COMPOSITION / EDITORIAL GRID ─────────────────────── */
:root{--content-max:1480px}
body{letter-spacing:-.005em}
.top{position:relative}
.top::after{
  content:"";
  position:absolute;
  left:0;bottom:-1px;
  width:72px;height:1px;
  background:var(--lime);
}
.brandMark{width:38px;height:38px}
.brandText .eyebrow{font-size:10px;font-weight:800}
.tag{font-size:9px}
.heroInner{grid-template-columns:minmax(0,1fr) minmax(430px,.9fr);gap:clamp(30px,6vw,100px)}
.heroVisual{justify-content:flex-start;padding-left:clamp(10px,4vw,70px)}
.heroHalo{left:0;transform:translateX(-5%);opacity:.45}
.heroDardar{width:min(82%,620px)}
.heroCopy{padding-right:3vw}
.hero h1{
  font-size:clamp(100px,12.2vw,190px);
  font-weight:650;
  letter-spacing:-.085em;
}
.hero h1 em{display:inline-block}
.lede{font-weight:450}
.actions{margin-top:4px}
#run{font-weight:800;padding-inline:25px}
.heroFoot{font-size:7px;padding-bottom:2px}

.crew .sectionIntro{grid-template-columns:180px 1fr}
.crewGrid{margin-left:0}
.crewCard{min-height:385px;padding:20px 16px 26px}
.crewImg{height:220px}
.crewImg img{width:195px;height:195px}
.crewInfo h3{font-size:14px}
.crewInfo p{font-size:10px}
.crewIndex{font-size:7px}

.scanStatusHead h2{font-size:clamp(44px,5vw,70px)}
.pipelineStep{min-height:124px}
.pipelineIcon{width:74px;height:74px}
.pipelineDesc{font-size:10px}
.scanQueue{max-width:800px}

.stats{grid-template-columns:repeat(5,1fr)}
.stats b{font-size:34px}

.results{padding-top:12px}
.resultsHead h3{font-size:clamp(34px,4.5vw,62px)}
.signals{grid-template-columns:repeat(2,1fr)}
.card{min-height:205px;padding:32px}
.card h4{font-size:21px}

@media(min-width:1400px){
  main{padding-left:64px;padding-right:64px}
  .heroInner{min-height:730px}
  .heroVisual{min-height:620px}
}
@media(max-width:1100px){
  .heroVisual{padding-left:0}
  .crew .sectionIntro{grid-template-columns:130px 1fr}
  .crewCard{min-height:350px}
  .crewImg{height:185px}
  .crewImg img{width:165px;height:165px}
}
@media(max-width:780px){
  .top::after{width:46px}
  .brandMark{width:34px;height:34px}
  .heroInner{gap:0}
  .heroVisual{padding:0}
  .heroCopy{padding:0}
  .hero h1{font-size:clamp(82px,18vw,128px)}
  .crew .sectionIntro{grid-template-columns:1fr}
  .crewCard{min-height:0}
  .crewImg{height:155px}
  .crewImg img{width:150px;height:150px}
}

/* ── MASSIVE LANDING ─────────────────────────────────────────── */
/* When landing is active, dashboard is structurally hidden */
body.has-landing main { display: none !important; }

.massiveLanding{
  background:var(--bg)!important;
  color:var(--text);
  overflow:hidden;
  isolation:isolate;
  display:block!important;
}
.massiveLanding .landingWordmark{
  position:absolute;left:clamp(24px,4vw,64px);top:clamp(22px,4vw,54px);
  z-index:4;font-size:clamp(13px,1vw,17px);font-weight:800;
  letter-spacing:.22em;
}
.massiveLanding .landingVisual{
  position:absolute;z-index:2;
  width:50vw;max-width:750px;height:130vh;
  left:0;top:-2vh;
  transform:rotate(-5deg);
  transform-origin:80% 55%;
  display:flex;align-items:center;justify-content:center;
}
.massiveLanding .landingVisual img{
  width:100%;height:100%;object-fit:contain;
  filter:drop-shadow(0 42px 50px rgba(0,0,0,.34));
}
.massiveLanding .landingCrew{
  position:absolute;z-index:3;
  left:50vw;top:50%;transform:translateY(-50%);
  padding-left:clamp(8px,1.5vw,24px);
  width:calc(50vw - clamp(24px,5vw,90px));
  display:flex;flex-direction:column;align-items:flex-start;
  gap:clamp(0px,.08vw,2px);
}
.massiveLanding .landingCrew span{
  display:block;
  font-family:"GC Epic Pro Demo ExtBd",var(--display);
  font-size:155px;
  line-height:.76;
  letter-spacing:-.09em;
  font-weight:800;
  white-space:nowrap;
  color:var(--text);
  z-index:1;
}
.massiveLanding .landingCrew span:nth-child(even){color:var(--muted)}
.massiveLanding .landingEnter{
  position:absolute;z-index:5;right:clamp(24px,5vw,90px);bottom:clamp(24px,4vw,55px);
  margin:0;border-radius:0;background:transparent;color:var(--text);
  border:0;border-bottom:1px solid var(--text);
  padding:0 0 5px;min-height:auto;font-size:12px;font-weight:800;
  letter-spacing:.16em;box-shadow:none;
}
.massiveLanding .landingEnter span{display:inline-block;margin-left:8px;transition:transform .2s ease}
.massiveLanding .landingEnter:hover{background:transparent;box-shadow:none;transform:none;color:var(--lime)}
.massiveLanding .landingEnter:hover span{transform:translateX(4px)}
.massiveLanding .landingEnter:active{transform:none}
.massiveLanding.ready{opacity:1;visibility:visible;pointer-events:auto}
@media(max-width:900px){
  .massiveLanding .landingVisual{width:55vw;max-width:none;left:0;top:4vh}
  .massiveLanding .landingCrew{left:50vw;width:calc(50vw - 20px)}
  .massiveLanding .landingCrew span{font-size:clamp(40px,9vw,72px)}
}
@media(max-width:600px){
  .massiveLanding .landingVisual{width:70vw;max-width:none;left:-5vw;top:6vh;transform:rotate(-5deg)}
  .massiveLanding .landingCrew{left:30vw;top:auto;bottom:18vh;width:65vw;transform:none;padding-left:12px}
  .massiveLanding .landingCrew span{font-size:clamp(32px,10vw,52px)}
  .massiveLanding .landingEnter{right:5vw;bottom:5vh}
  .massiveLanding .landingWordmark{left:5vw;top:4vh}
}


/* ── MASSIVE LANDING / ART-DIRECTION — LOCKED COMPOSITION ─────── */
/*
   Desktop composition is intentionally fixed:
   left half = Dardar / right half = crew type.
   The crew sits BEHIND Dardar at the central seam.
   Do not introduce breakpoint-specific rearrangements here.
*/
body.has-landing .splashCard,
body.has-landing .splashTyping,
body.has-landing .splashDesc,
body.has-landing .splashLinks,
body.has-landing .splashAuthor,
body.has-landing .splashKicker,
body.has-landing .splashDardar,
body.has-landing .splashOverlay > :not(.landingWordmark):not(.landingVisual):not(.landingCrew):not(.landingEnter) {
  display:none !important;
}

body.has-landing .massiveLanding {
  inset:0 !important;
  width:100vw !important;
  height:100vh !important;
  overflow:hidden !important;
}

/* Brand lockup */
body.has-landing .massiveLanding .landingWordmark {
  left:40px;
  top:38px;
  z-index:4;
}

/* Central seam = 50vw. Dardar owns the left side but intentionally
   crosses the seam so the typography can pass visually behind it. */
body.has-landing .massiveLanding .landingVisual {
  position:absolute;
  left:0;
  top:0;
  width:50vw;
  height:100vh;
  max-width:none;
  display:block;
  z-index:2;
  transform:none;
  overflow:visible;
}

body.has-landing .massiveLanding .landingVisual img {
  position:absolute;
  width:1000px;
  max-width:none;
  height:auto;
  right:-150px;
  bottom:-72px;
  object-fit:contain;
  transform:rotate(-8deg);
  transform-origin:80% 80%;
  z-index:2;
}

/* Typography deliberately behind Dardar. */
body.has-landing .massiveLanding .landingCrew {
  position:absolute;
  left:50vw;
  top:50%;
  width:50vw;
  max-width:none;
  padding:0 40px 0 0;
  transform:translateY(-50%);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:0;
  z-index:1;
}

body.has-landing .massiveLanding .landingCrew span {
  display:block;
  /*
     Landing display type: GC Epic Pro Demo Extra Bold.
     The demo TTF is free for personal use only; do not ship it to
     production/commercial traffic until the appropriate webfont license
     is cleared. Keep the local-family fallback for visual testing.
  */
  font-family:"GC Epic Pro Demo ExtBd","GC Epic Pro Demo Extra Bold",var(--display),sans-serif !important;
  font-size:155px;
  line-height:.76;
  letter-spacing:-.055em;
  font-weight:800;
  white-space:nowrap;
  color:#a9e600 !important;
}

body.has-landing .massiveLanding .landingCrew span:nth-child(even) {
  color:#a9e600 !important;
}

/* The display font is intentionally allowed to cross the seam.
   Dardar (z-index 2) masks it where the two forms overlap. */
body.has-landing .massiveLanding .landingCrew {
  overflow:visible;
}

body.has-landing .massiveLanding .landingEnter {
  right:40px;
  bottom:34px;
  z-index:5;
}

/* Responsive physical-size correction.
   Wide + standard desktop compositions are locked.
   Tablet keeps the 50vw seam but scales both halves down enough
   to keep the complete crew block inside the viewport.
   Mobile becomes a vertical composition: the crew is the main block
   and Dardar sits across its lower edge. */
@media (min-width:1201px) and (max-width:2200px){
  body.has-landing .massiveLanding .landingVisual img {
    width:670px;
    right:-100px;
    bottom:-48px;
  }

  body.has-landing .massiveLanding .landingCrew span {
    font-size:104px;
  }
}

/* Tablet — same geometry, proportional reduction only. */
@media (min-width:601px) and (max-width:1200px){
  body.has-landing .massiveLanding .landingVisual img {
    width:clamp(560px, 66vw, 720px);
    right:clamp(-108px, -10vw, -72px);
    bottom:clamp(-56px, -6vw, -42px);
  }

  body.has-landing .massiveLanding .landingCrew {
    padding:0 12px 0 0;
  }

  body.has-landing .massiveLanding .landingCrew span {
    font-size:clamp(64px, 9vw, 92px);
    letter-spacing:-.055em;
  }

  body.has-landing .massiveLanding .landingWordmark {
    left:28px;
    top:30px;
  }

  body.has-landing .massiveLanding .landingEnter {
    right:28px;
    bottom:28px;
  }
}

/* Phone — deliberately becomes a different composition.
   The text remains massive but is contained in the viewport.
   Dardar overlaps the lower part of the crew as if sitting on it. */
@media(max-width:600px){
  body.has-landing .massiveLanding .landingVisual {
    left:0;
    top:0;
    width:100vw;
    height:100vh;
    z-index:2;
    pointer-events:none;
  }

  body.has-landing .massiveLanding .landingVisual img {
    width:clamp(420px, 118vw, 500px);
    left:50%;
    right:auto;
    bottom:clamp(-72px, -13vw, -48px);
    transform:translateX(-50%) rotate(-3deg);
    transform-origin:80% 80%;
    z-index:2;
  }

  body.has-landing .massiveLanding .landingCrew {
    left:0;
    top:15%;
    width:100vw;
    padding:0 14px;
    transform:none;
    align-items:center;
    text-align:center;
    z-index:1;
  }

  body.has-landing .massiveLanding .landingCrew span {
    font-size:clamp(48px, 15vw, 64px);
    line-height:.78;
    letter-spacing:-.055em;
    white-space:nowrap;
  }

  /* The landing is intentionally monochrome on the hero composition. */
  body.has-landing .massiveLanding .landingCrew span,
  body.has-landing .massiveLanding .landingCrew span:nth-child(even) {
    color:#a9e600 !important;
  }

  body.has-landing .massiveLanding .landingWordmark {
    left:24px;
    top:24px;
  }

  body.has-landing .massiveLanding .landingEnter {
    left:50%;
    right:auto;
    bottom:50%;
    transform:translate(-50%, 50%);
  }
}

/* ═══════════════════════════════════════════════
   WORKSPACE — TweetDeck-style multi-column shell
   ═══════════════════════════════════════════════ */

.workspaceShell {
  display:flex;
  height:100vh;
  width:100vw;
  overflow:hidden;
  background:var(--bg, #0a0a0a);
  color:var(--fg, #e8e8e8);
}

/* ── Sidebar ── */
.wsSidebar {
  width:220px;
  min-width:220px;
  background:var(--surface, #111);
  border-right:1px solid var(--border, #222);
  display:flex;
  flex-direction:column;
  padding:0;
  overflow-y:auto;
}

.wsSidebarBrand {
  display:flex;
  align-items:center;
  gap:10px;
  padding:20px 16px;
  border-bottom:1px solid var(--border, #222);
}

.wsSidebarLogo {
  font-size:18px;
  color:var(--lime, #a9e600);
}

.wsSidebarName {
  font-family:"GC Epic Pro Demo ExtBd", "Impact", sans-serif;
  font-size:14px;
  letter-spacing:2px;
  color:var(--fg, #e8e8e8);
}

.wsSidebarNav {
  flex:1;
  padding:8px 0;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.wsNavItem {
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 16px;
  background:none;
  border:none;
  color:var(--muted, #888);
  font-family:inherit;
  font-size:13px;
  cursor:pointer;
  text-align:left;
  transition:background .15s, color .15s;
}

.wsNavItem:hover {
  background:var(--hover, rgba(255,255,255,.05));
  color:var(--fg, #e8e8e8);
}

.wsNavItem.active {
  background:var(--hover, rgba(255,255,255,.08));
  color:var(--lime, #a9e600);
}

.wsNavIcon {
  font-size:14px;
  width:20px;
  text-align:center;
}

.wsNavLabel {
  flex:1;
  letter-spacing:1px;
}

.wsNavCount {
  font-size:11px;
  color:var(--muted, #666);
  min-width:20px;
  text-align:right;
}

.wsSidebarFooter {
  padding:12px 16px;
  border-top:1px solid var(--border, #222);
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.wsResetBtn {
  background:none;
  border:1px solid var(--border, #333);
  border-radius:3px;
  color:var(--muted, #888);
  font-family:inherit;
  font-size:10px;
  padding:3px 8px;
  cursor:pointer;
  transition:color .12s, border-color .12s;
}

.wsResetBtn:hover {
  color:var(--danger, #ff5b5b);
  border-color:var(--danger, #ff5b5b);
}

.wsSidebarVersion {
  font-size:10px;
  color:var(--muted, #555);
  letter-spacing:1px;
}

/* ── Main area ── */
.wsMain {
  flex:1;
  display:flex;
  flex-direction:column;
  min-width:0;
  overflow:hidden;
}

/* ── Topbar ── */
.wsTopbar {
  display:flex;
  align-items:center;
  gap:16px;
  height:48px;
  min-height:48px;
  padding:0 20px;
  border-bottom:1px solid var(--border, #222);
  background:var(--surface, #111);
}

.wsTopbarLeft {
  display:flex;
  align-items:center;
  gap:8px;
}

.wsTopbarTitle {
  font-size:12px;
  letter-spacing:2px;
  color:var(--muted, #888);
  font-weight:600;
}

.wsTopbarDot {
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--lime, #a9e600);
}

.wsTopbarStatus {
  font-size:11px;
  letter-spacing:1px;
  color:var(--muted, #888);
}

.wsTopbarStatus.scanning {
  color:var(--orange, #ffb52e);
}

.wsTopbarCenter {
  flex:1;
  display:flex;
  justify-content:center;
}

.wsSearchInput {
  width:100%;
  max-width:400px;
  padding:6px 14px;
  border:1px solid var(--border, #333);
  border-radius:6px;
  background:var(--bg, #0a0a0a);
  color:var(--fg, #e8e8e8);
  font-size:13px;
  font-family:inherit;
  outline:none;
  transition:border-color .15s;
}

.wsSearchInput:focus {
  border-color:var(--lime, #a9e600);
}

/* ── Search wrapper + clear button ── */
.wsSearchWrapper {
  position:relative;
  width:100%;
  max-width:400px;
}

.wsSearchWrapper .wsSearchInput {
  width:100%;
  padding-right:28px;
}

.wsSearchClear {
  position:absolute;
  right:4px;
  top:50%;
  transform:translateY(-50%);
  width:20px;
  height:20px;
  border:none;
  border-radius:3px;
  background:none;
  color:var(--muted, #888);
  font-size:14px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:color .12s;
}

.wsSearchClear:hover {
  color:var(--fg, #e8e8e8);
}

.wsTopbarRight {
  font-size:11px;
  color:var(--muted, #666);
  display:flex;
  align-items:center;
  gap:12px;
}

/* ── Add column button + dropdown ── */
.wsAddColWrapper {
  position:relative;
}

.wsAddColBtn {
  width:28px;
  height:28px;
  border:1px solid var(--border, #333);
  border-radius:4px;
  background:var(--bg, #0a0a0a);
  color:var(--lime, #a9e600);
  font-size:16px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:border-color .15s, background .15s;
}

.wsAddColBtn:hover {
  border-color:var(--lime, #a9e600);
  background:rgba(169,230,0,.08);
}

.wsAddMenu {
  display:none;
  position:absolute;
  top:100%;
  right:0;
  margin-top:4px;
  background:var(--surface, #111);
  border:1px solid var(--border, #333);
  border-radius:6px;
  min-width:160px;
  z-index:100;
  box-shadow:0 4px 16px rgba(0,0,0,.4);
}

.wsAddMenu.open {
  display:block;
}

.wsAddMenuItem {
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
  padding:8px 12px;
  background:none;
  border:none;
  color:var(--fg, #e8e8e8);
  font-family:inherit;
  font-size:12px;
  cursor:pointer;
  text-align:left;
  transition:background .12s;
}

.wsAddMenuItem:hover {
  background:var(--hover, rgba(255,255,255,.06));
}

.wsAddMenuEmpty {
  display:block;
  padding:8px 12px;
  font-size:11px;
  color:var(--muted, #666);
}

/* ── Columns container ── */
.wsColumns {
  flex:1;
  display:flex;
  overflow-x:auto;
  overflow-y:hidden;
  gap:0;
}

.wsColumns::-webkit-scrollbar {
  height:6px;
}

.wsColumns::-webkit-scrollbar-track {
  background:var(--surface, #111);
}

.wsColumns::-webkit-scrollbar-thumb {
  background:var(--border, #333);
  border-radius:3px;
}

/* ── Single column ── */
.wsColumn {
  flex:1;
  min-width:280px;
  max-width:400px;
  display:flex;
  flex-direction:column;
  border-right:1px solid var(--border, #222);
  overflow:hidden;
}

.wsColumn:last-child {
  border-right:none;
}

.colHead {
  display:flex;
  align-items:center;
  gap:8px;
  padding:12px 16px;
  border-bottom:1px solid var(--border, #222);
  background:var(--surface, #111);
  min-height:44px;
}

.colTitle {
  font-size:12px;
  letter-spacing:2px;
  font-weight:600;
  color:var(--fg, #e8e8e8);
}

.colFilterTag {
  font-size:10px;
  padding:2px 6px;
  border-radius:3px;
  background:var(--hover, rgba(255,255,255,.08));
  color:var(--lime, #a9e600);
}

.colCount {
  margin-left:auto;
  font-size:11px;
  color:var(--muted, #666);
}

/* ── Column header controls ── */
.colControls {
  display:flex;
  align-items:center;
  gap:2px;
  margin-left:8px;
}

.colControls button {
  width:22px;
  height:22px;
  border:1px solid var(--border, #333);
  border-radius:3px;
  background:none;
  color:var(--muted, #888);
  font-size:13px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:color .12s, border-color .12s, background .12s;
  padding:0;
  line-height:1;
}

.colControls button:hover:not(.disabled):not(:disabled) {
  color:var(--fg, #e8e8e8);
  border-color:var(--border-hover, #555);
  background:var(--hover, rgba(255,255,255,.06));
}

.colControls .colRemove:hover:not(.disabled):not(:disabled) {
  color:var(--danger, #ff5b5b);
  border-color:var(--danger, #ff5b5b);
}

.colControls button.disabled,
.colControls button:disabled {
  opacity:.25;
  cursor:default;
}

/* ── Column filter bar (category filters) ── */
.colFilterBar {
  padding:6px 12px;
  border-bottom:1px solid var(--border, #222);
  background:var(--surface, #111);
}

.wsCatFilters {
  display:flex;
  flex-wrap:wrap;
  gap:4px;
}

.wsCatFilter {
  padding:3px 8px;
  border:1px solid var(--border, #333);
  border-radius:3px;
  background:none;
  color:var(--muted, #888);
  font-family:inherit;
  font-size:10px;
  letter-spacing:.5px;
  cursor:pointer;
  transition:all .12s;
}

.wsCatFilter:hover {
  color:var(--fg, #e8e8e8);
  border-color:var(--border-hover, #555);
}

.wsCatFilter.active {
  color:var(--lime, #a9e600);
  border-color:var(--lime, #a9e600);
  background:rgba(169,230,0,.08);
}

.colScroll {
  flex:1;
  overflow-y:auto;
  padding:8px;
  display:flex;
  flex-direction:column;
  gap:6px;
}

.colScroll::-webkit-scrollbar {
  width:4px;
}

.colScroll::-webkit-scrollbar-thumb {
  background:var(--border, #333);
  border-radius:2px;
}

.colEmpty {
  padding:40px 16px;
  text-align:center;
  color:var(--muted, #555);
  font-size:13px;
}

.colEmptyIcon {
  display:block;
  font-size:24px;
  margin-bottom:8px;
  opacity:.5;
}

/* ── Workspace cards ── */
.wsCard {
  padding:12px 14px;
  border:1px solid var(--border, #222);
  border-radius:6px;
  background:var(--surface, #111);
  cursor:pointer;
  transition:border-color .15s, background .15s;
}

.wsCard:hover {
  border-color:var(--border-hover, #444);
  background:var(--hover, rgba(255,255,255,.03));
}

.wsCardMeta {
  display:flex;
  align-items:center;
  gap:6px;
  margin-bottom:6px;
  font-size:10px;
  color:var(--muted, #666);
  letter-spacing:0.5px;
}

.wsCardEntity {
  text-transform:uppercase;
  font-weight:600;
  color:var(--lime, #a9e600);
}

.wsCardDate {
  margin-left:auto;
}

.wsCardTitle {
  font-size:13px;
  font-weight:600;
  line-height:1.3;
  margin:0 0 4px;
  color:var(--fg, #e8e8e8);
}

.wsCardDesc {
  font-size:12px;
  line-height:1.4;
  color:var(--muted, #999);
  margin:0;
}

.wsCardStatus {
  display:inline-block;
  margin-top:6px;
  font-size:10px;
  padding:2px 6px;
  border-radius:3px;
  text-transform:uppercase;
  letter-spacing:0.5px;
}

.cardHot {
  font-size:9px;
  padding:1px 4px;
  border-radius:2px;
  background:rgba(255,91,91,.15);
  color:var(--danger, #ff5b5b);
  font-weight:600;
}

.wsEmpty {
  flex:1;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--muted, #555);
  font-size:14px;
}

/* ── Signal cards inside workspace columns ── */
.wsColumn .card {
  padding:12px 14px;
  min-height:auto;
  border-radius:6px;
  border:1px solid var(--border, #222);
  background:var(--surface, #111);
  cursor:pointer;
  transition:border-color .15s, background .15s;
}

.wsColumn .card:hover {
  border-color:var(--border-hover, #444);
  background:var(--hover, rgba(255,255,255,.03));
}

.wsColumn .card h4 {
  font-size:13px;
  line-height:1.3;
  margin-bottom:4px;
}

.wsColumn .card p {
  font-size:12px;
  line-height:1.4;
  color:var(--muted, #999);
  max-width:none;
}

.wsColumn .card .meta {
  display:flex;
  align-items:center;
  gap:6px;
  margin-bottom:6px;
  font-size:10px;
  color:var(--muted, #666);
}

.wsColumn .card .meta span:first-child {
  text-transform:uppercase;
  font-weight:600;
  color:var(--lime, #a9e600);
}

.wsColumn .card .verdictBadge,
.wsColumn .card .hotBadge {
  font-size:9px;
  padding:1px 4px;
  border-radius:2px;
}

/* ── Responsive workspace ── */
@media (max-width:1024px) {
  .wsSidebar {
    width:60px;
    min-width:60px;
  }
  .wsSidebarName,
  .wsNavLabel,
  .wsNavCount,
  .wsSidebarFooter {
    display:none;
  }
  .wsSidebarBrand {
    justify-content:center;
    padding:16px 0;
  }
  .wsNavItem {
    justify-content:center;
    padding:10px 0;
  }
  .wsNavIcon {
    font-size:16px;
  }
}

@media (max-width:768px) {
  .wsSidebar {
    display:none;
  }
  .wsColumn {
    min-width:100%;
    max-width:100%;
  }
}\n