@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600;700&family=Inter:wght@400;500;600&display=swap");

:root{
  --bg:#111210;--el:#0d0f0e;--nav-bg:#0d0e0c;
  --card:#111a16;--card-h:#101412;--code:#090b0a;--inset:#0b0d0c;
  --grid:#191c1b;--brd:#1f2422;--brd-a:#253530;
  --ac:#00d4aa;--ac-m:rgba(0,212,170,.4);
  --tx:#e8e8e0;--bd:#8a9e98;--mu:#6a7a78;--dm:#354845;
  --sc:#ffb84d;--sc-bg:#3a1a0a;--dn:#ff4444;
  --tag:#5a9a88;--ln:#3a5a3a;
  --mono:"IBM Plex Mono",ui-monospace,"Courier New",monospace;
  --sans:"Inter",system-ui,sans-serif;
  --nav-h:52px;--side-w:220px;
  --glow:0 0 20px rgba(0,212,170,.18);--glow-a:0 0 14px rgba(255,184,77,.2);
  /* Scraps coin: use images/scrap-logo.png only (no fallback) */
  --scrap-logo:url("../../images/scrap-logo.png");
  /* Coin sizes (tune globally) */
  --scrap-size-inline:2.45em;
  --scrap-size-nav:34px;
  --scrap-size-btn:40px;
  --scrap-size-section:38px;
  --scrap-size-hero:2.8em;
  /* Vertical align coin in running text (e.g. hero) */
  --scrap-align-inline:-0.42em;
}
/* Inline Scraps mark (optional): <span class="scrap-ico" aria-hidden="true"></span> */
.scrap-ico{display:inline-block;width:var(--scrap-size-inline);height:var(--scrap-size-inline);vertical-align:-0.15em;margin-right:.3em;background:var(--scrap-logo) center/contain no-repeat;flex-shrink:0}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:var(--ac-m) var(--bg)}
html::-webkit-scrollbar{width:8px;height:8px}
html::-webkit-scrollbar-track{background:var(--bg)}
html::-webkit-scrollbar-thumb{background:var(--ac-m);border-radius:4px;border:2px solid var(--bg)}
html::-webkit-scrollbar-thumb:hover{background:var(--ac)}
body{margin:0;font-family:var(--sans);font-size:.95rem;line-height:1.65;color:var(--bd);background:var(--bg);overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:linear-gradient(var(--grid) .5px,transparent .5px),linear-gradient(90deg,var(--grid) .5px,transparent .5px);
  background-size:40px 40px;opacity:.35}
img{max-width:100%;height:auto;display:block}
a{color:var(--ac);text-decoration:none}a:hover{text-decoration:underline}
/* Focus visibility (keyboard / a11y) */
:focus{outline:none}
:focus-visible{outline:2px solid var(--ac);outline-offset:2px}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.btn:focus-visible,.hamburger:focus-visible,.cookie-banner__btn:focus-visible{outline-offset:3px}
.skip:focus-visible{outline-color:var(--tx)}
input:focus-visible,textarea:focus-visible{border-color:var(--ac)}

.skip{position:absolute;top:-60px;left:12px;z-index:9999;padding:8px 14px;background:var(--ac);color:var(--nav-bg);font:600 .75rem var(--mono);border-radius:2px}
.skip:focus{top:12px}

/* ══════════════════════════════════════
   SHARED: TOP BAR
   ══════════════════════════════════════ */
.nav{position:sticky;top:0;z-index:200;height:var(--nav-h);background:var(--nav-bg);border-bottom:1px solid var(--ac-m);display:flex;align-items:center;padding:0 24px;font-family:var(--mono)}
.nav__brand{display:flex;flex-direction:column;gap:0;text-decoration:none;color:var(--ac);margin-right:16px}
.nav__brand b{font-size:.85rem;letter-spacing:.22em;text-shadow:var(--glow)}
.nav__brand small{font-size:.5rem;letter-spacing:.14em;opacity:.5}
.nav__dot{width:8px;height:8px;border-radius:50%;background:var(--ac);box-shadow:0 0 8px var(--ac);animation:pulse 2s ease-in-out infinite;display:none;margin-right:16px}
@media(min-width:900px){.nav__dot{display:block}}
@keyframes pulse{0%,100%{opacity:.9}50%{opacity:.3}}
.nav__links{display:none;list-style:none;margin:0;padding:0;gap:20px;align-items:center;margin-right:auto}
@media(min-width:900px){.nav__links{display:flex}}
.nav__links a{color:var(--mu);font-size:.65rem;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;transition:color .15s}
.nav__links a:hover,.nav__links a.act{color:var(--ac)}
.nav__right{display:flex;align-items:center;gap:10px;margin-left:auto}
.nav__scraps{padding:5px 12px;background:var(--card);border:1px solid var(--ac-m);font-size:.6rem;letter-spacing:.06em;color:var(--sc);text-shadow:var(--glow-a);display:none;font-family:var(--mono);align-items:center;gap:6px;text-decoration:none;cursor:pointer;box-sizing:border-box}
@media(min-width:640px){.nav__scraps.nav__scraps--visible{display:inline-flex}}
.nav__scraps::before{content:"";width:var(--scrap-size-nav);height:var(--scrap-size-nav);flex-shrink:0;background:var(--scrap-logo) center/contain no-repeat}
.nav__scraps__amount{min-width:0}
.drawer__scraps{display:none;align-items:center;gap:8px;margin-top:4px;padding:14px 0;font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;color:var(--sc);text-decoration:none;border-bottom:1px solid var(--brd);text-shadow:var(--glow-a)}
.drawer__scraps.drawer__scraps--visible{display:flex}
.drawer__scraps::before{content:"";width:var(--scrap-size-nav);height:var(--scrap-size-nav);flex-shrink:0;background:var(--scrap-logo) center/contain no-repeat}
.btn-s{padding:6px 14px;font:600 .6rem var(--mono);letter-spacing:.1em;text-transform:uppercase;border-radius:2px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;border:1px solid transparent;transition:all .15s}
.btn-login{background:transparent;color:var(--ac);border-color:var(--ac-m)}
.btn-login:hover{border-color:var(--ac);background:rgba(0,212,170,.06);text-decoration:none}
.btn-register{background:var(--ac);color:var(--nav-bg)}
.btn-register:hover{filter:brightness(1.08);text-decoration:none}
.hamburger{display:flex;flex-direction:column;justify-content:center;gap:5px;width:36px;height:36px;padding:0;border:1px solid var(--brd);background:var(--card);cursor:pointer;border-radius:2px}
.hamburger span{display:block;height:2px;background:var(--ac);margin:0 7px}
@media(min-width:900px){.hamburger{display:none}}
.drawer{display:none;position:fixed;inset:var(--nav-h) 0 0;background:rgba(13,15,14,.97);z-index:199;padding:24px;font-family:var(--mono);overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--ac-m) var(--el)}
.drawer::-webkit-scrollbar{width:6px}
.drawer::-webkit-scrollbar-thumb{background:var(--ac-m);border-radius:3px}
.drawer.open{display:block}
.drawer ul{list-style:none;margin:0;padding:0}
.drawer a{display:block;padding:14px 0;color:var(--bd);text-decoration:none;font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;border-bottom:1px solid var(--brd)}
.drawer a:hover{color:var(--ac)}
.drawer__auth{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:20px}

/* ══════════════════════════════════════
   LANDING PAGE (index.html)
   ══════════════════════════════════════ */
.wrap{position:relative;z-index:1;max-width:1200px;margin:0 auto;padding:0 24px}
section{padding:48px 0}

/* corner ticks */
.tick{position:relative}
.tick::before,.tick::after{content:"";position:absolute;width:14px;height:14px;border-color:var(--ac);border-style:solid;opacity:.7;pointer-events:none}
.tick::before{top:-1px;left:-1px;border-width:2px 0 0 2px}
.tick::after{bottom:-1px;right:-1px;border-width:0 2px 2px 0}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 22px;font:600 .7rem var(--mono);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border-radius:2px;border:1px solid transparent;cursor:pointer;transition:all .15s}
.btn--p{background:var(--ac);color:var(--nav-bg);border-color:var(--ac)}
.btn--p:hover{filter:brightness(1.08);text-decoration:none}
.btn--g{background:transparent;color:var(--ac);border-color:var(--ac-m)}
.btn--g:hover{border-color:var(--ac);background:rgba(0,212,170,.06);text-decoration:none}
.btn--sc{background:var(--sc-bg);color:var(--sc);border-color:rgba(255,184,77,.3)}
.btn--sc::before{content:"";width:var(--scrap-size-btn);height:var(--scrap-size-btn);margin-right:10px;flex-shrink:0;background:var(--scrap-logo) center/contain no-repeat}
.btn--sc:hover{border-color:var(--sc);text-decoration:none}
.btn-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.btn-row .btn{margin:0}
.btn-row--center{justify-content:center;width:100%}

/* hero */
.hero{padding:72px 0 48px;text-align:center}
.hero__eye{font-family:var(--mono);font-size:.7rem;letter-spacing:.28em;color:var(--ac);opacity:.6;margin:0 0 14px}
.hero__h{font-family:var(--mono);font-size:clamp(1.6rem,4.5vw,2.8rem);font-weight:700;letter-spacing:.04em;color:var(--tx);line-height:1.15;margin:0 0 20px;text-shadow:var(--glow)}
.hero__h em{font-style:normal;color:var(--ac)}
.hero__p{font-size:1.05rem;line-height:1.75;max-width:40em;margin:0 auto 40px;color:var(--bd)}
/* Hero CTAs: equal height; coin uses --scrap-size-btn */
.hero__cta{display:flex;flex-wrap:wrap;align-items:stretch;gap:12px;justify-content:center;margin-top:4px}
.hero__cta .btn{align-self:stretch}
/* index.html: emblem under nav, larger; transparent PNG — light glow only */
.wrap--home{padding-top:8px}
.home-emblem{
  position:absolute;
  left:max(4px,env(safe-area-inset-left));
  top:8px;
  width:clamp(88px,22vw,220px);
  z-index:2;
  pointer-events:none;
  transform:rotate(-12deg);
  filter:drop-shadow(0 8px 20px rgba(0,0,0,.5)) drop-shadow(0 0 18px rgba(0,212,170,.12));
}
.home-emblem img{display:block;width:100%;height:auto}
@media (max-width:520px){
  .home-emblem{top:6px;width:clamp(72px,26vw,120px);transform:rotate(-10deg)}
}
@media (prefers-reduced-motion:reduce){
  .home-emblem{transform:rotate(-8deg)}
}
/* In paragraphs: avoid inline-flex on large coin (baseline) */
.hero-scrap{display:inline;color:var(--sc);font-weight:700}
.hero-scrap .scrap-ico{
  display:inline-block;
  margin-right:.22em;
  vertical-align:var(--scrap-align-inline);
}
.hero-scrap-lg{display:inline-flex;align-items:center;gap:10px;justify-content:center;color:var(--sc);font-weight:600}
.hero-scrap-lg .scrap-ico{width:var(--scrap-size-hero);height:var(--scrap-size-hero);margin-right:0}
/* Section label with Scraps coin */
.sh--scrap-mark{display:inline-flex;align-items:center;gap:8px}
.sh--scrap-mark::before{content:"";width:var(--scrap-size-section);height:var(--scrap-size-section);flex-shrink:0;background:var(--scrap-logo) center/contain no-repeat}

/* stats row */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;padding:0 0 24px}
.stat{background:var(--card);border:1px solid var(--brd);padding:16px 18px}
.stat b{display:block;font-family:var(--mono);font-size:1.4rem;font-weight:700;color:var(--ac);margin-bottom:2px}
.stat b.sc{color:var(--sc);text-shadow:var(--glow-a)}
.stat span{font-size:.75rem;color:var(--mu)}

/* section headers */
.sh{font-family:var(--mono);font-size:.7rem;letter-spacing:.22em;color:var(--ac);opacity:.6;margin:0 0 8px}
.st{font-family:var(--mono);font-size:1.1rem;font-weight:700;letter-spacing:.08em;color:var(--tx);margin:0 0 8px}
.sd{margin:0 0 24px;max-width:42em}

/* steps (how it works) */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:2px;counter-reset:step}
.step{background:var(--el);border:1px solid var(--brd);padding:22px 20px 24px;counter-increment:step;position:relative}
.step::before{content:counter(step,decimal-leading-zero);font-family:var(--mono);font-size:1.8rem;font-weight:700;color:var(--ac);opacity:.18;position:absolute;top:12px;right:14px}
.step h3{font-family:var(--mono);font-size:.78rem;letter-spacing:.1em;color:var(--ac);margin:0 0 8px}
.step p{margin:0;font-size:.9rem}

/* feature cards */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.card{background:var(--el);border:1px solid var(--brd);padding:20px}
.card h3{font-family:var(--mono);font-size:.78rem;letter-spacing:.1em;color:var(--ac);margin:0 0 8px}
.card p{margin:0;font-size:.9rem}
.badge{display:inline-block;padding:2px 7px;font-family:var(--mono);font-size:.55rem;letter-spacing:.06em;border-radius:1px;margin-left:4px;vertical-align:middle}
.badge--t{background:rgba(0,212,170,.1);color:var(--ac);border:1px solid var(--ac-m)}
.badge--a{background:var(--sc-bg);color:var(--sc);border:1px solid rgba(255,184,77,.3)}

/* pricing */
.pricing{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.pcard{background:var(--el);border:1px solid var(--brd);padding:26px 22px;text-align:center}
.pcard.pop{border-color:var(--ac);box-shadow:var(--glow)}
.pcard h3{font-family:var(--mono);font-size:.8rem;letter-spacing:.12em;color:var(--tx);margin:0 0 4px}
.pcard .amt{font-family:var(--mono);font-size:1.8rem;font-weight:700;color:var(--sc);text-shadow:var(--glow-a)}
.pcard .unit{font-family:var(--mono);font-size:.65rem;color:var(--mu);margin-bottom:4px}
.pcard .real{font-size:.85rem;color:var(--bd);margin:0}
.pcard .old{text-decoration:line-through;color:var(--dm);font-size:.75rem;margin:0}
.pcard .save{font-family:var(--mono);font-size:.6rem;color:var(--ac);letter-spacing:.06em;margin:8px 0 14px}
.pcard .btn{width:100%}

/* ranks table */
.ranks{width:100%;border-collapse:collapse;font-size:.85rem}
.ranks th{font-family:var(--mono);font-size:.6rem;letter-spacing:.1em;color:var(--ac);text-align:left;padding:8px 10px;border-bottom:1px solid var(--brd);opacity:.7}
.ranks td{padding:10px;border-bottom:1px solid var(--brd);vertical-align:top}
.ranks td:first-child{font-family:var(--mono);color:var(--ac);font-weight:600;width:30px}
.ranks tr:last-child td{border-bottom:none}

/* CTA band */
.cta-band{background:linear-gradient(90deg,rgba(0,212,170,.08),rgba(255,184,77,.04));border:1px solid var(--brd);padding:36px 28px;text-align:center;margin:0 0 24px}
.cta-band h2{font-family:var(--mono);font-size:1.05rem;color:var(--tx);letter-spacing:.08em;margin:0 0 10px}
.cta-band p{margin:0 auto 18px;max-width:32em}
.cta-band .btn{margin:0 6px}
.cta-band .btn-row .btn{margin:0}

/* footer */
.foot{border-top:1px solid var(--brd);padding:28px 0 36px;font-family:var(--mono);font-size:.7rem;color:var(--mu)}
.foot__row{display:flex;flex-wrap:wrap;gap:12px 32px;justify-content:space-between;margin-bottom:14px}
.foot a{color:var(--bd);margin-right:14px;text-decoration:none}
.foot a:hover{color:var(--ac)}
.foot__copy{opacity:.6;letter-spacing:.02em;margin:0}
.foot__copy-row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px 18px;justify-content:space-between;margin-top:6px}
.foot__copy-row .foot__copy{flex:1;min-width:min(100%,260px)}
.foot__stamp{flex-shrink:0;opacity:.88;line-height:0;align-self:flex-end}
.foot__stamp img{display:block;width:52px;height:auto}
.foot__stamp:hover{opacity:1}

/* S.P.E.C.I.A.L. bars (landing) */
.score-row{display:flex;flex-wrap:wrap;gap:8px 18px;margin:10px 0}
.score-item{display:flex;align-items:center;gap:5px;font-family:var(--mono);font-size:.75rem}
.score-item span:first-child{color:var(--mu);width:22px;text-align:right}
.bar-t{width:80px;height:6px;background:var(--grid);border-radius:1px;overflow:hidden}
.bar-f{height:100%;border-radius:1px}
.bar-f.t{background:var(--ac);opacity:.85}
.bar-f.a{background:var(--sc);opacity:.85}
.score-v{font-weight:600;color:var(--ac);width:14px}
.score-v.lo{color:var(--sc)}

/* necropsy block */
.necro{background:var(--inset);border:1px solid var(--brd);padding:16px 18px;font-family:var(--mono);font-size:.8rem;line-height:1.7;white-space:pre-wrap;overflow-x:hidden;overflow-y:visible;word-break:break-word;margin:10px 0}
.necro .g{color:var(--ac)}
/* thin themed scrollbars only when content actually overflows (e.g. long reports) */
.necro--scroll{max-height:min(60vh,420px);overflow-y:auto;overflow-x:hidden;white-space:pre-line;word-break:break-word;scrollbar-width:thin;scrollbar-color:var(--ac-m) var(--inset)}
.necro--scroll::-webkit-scrollbar{width:6px;height:6px}
.necro--scroll::-webkit-scrollbar-track{background:var(--inset);border-radius:3px}
.necro--scroll::-webkit-scrollbar-thumb{background:var(--ac-m);border-radius:3px;border:1px solid var(--inset)}
.necro--scroll::-webkit-scrollbar-thumb:hover{background:var(--ac)}
.necro--panel{position:relative;border-color:var(--brd);box-shadow:none}

/* code window */
.codewin{background:var(--code);border:1px solid var(--brd);overflow:hidden;margin:14px 0}
.codewin__bar{display:flex;align-items:center;gap:6px;padding:8px 12px;background:var(--card-h);border-bottom:1px solid var(--brd)}
.codewin__dot{width:8px;height:8px;border-radius:50%}
.codewin__dot:nth-child(1){background:var(--dn);opacity:.85}
.codewin__dot:nth-child(2){background:var(--sc);opacity:.85}
.codewin__dot:nth-child(3){background:var(--ac);opacity:.85}
.codewin__title{font-family:var(--mono);font-size:.6rem;color:var(--dm);letter-spacing:.06em;margin-left:8px}
.codewin__body{padding:12px 14px;font-family:var(--mono);font-size:.8rem;line-height:1.6;color:var(--bd)}
.codewin__body .ln{color:var(--ln);user-select:none;margin-right:12px}
.codewin__body .kw{color:var(--tag)}
.codewin__body .fn{color:var(--ac)}
.codewin__enc{padding:10px 14px;border-top:1px dashed rgba(255,184,77,.3);text-align:center;font-family:var(--mono);font-size:.7rem;color:var(--sc);opacity:.8}

/* vault timeline */
.timeline{display:flex;align-items:flex-start;overflow-x:auto;padding:10px 0;margin:12px 0;scrollbar-width:thin;scrollbar-color:var(--ac-m) var(--el)}
.timeline::-webkit-scrollbar{height:5px}
.timeline::-webkit-scrollbar-track{background:var(--el);border-radius:2px}
.timeline::-webkit-scrollbar-thumb{background:var(--ac-m);border-radius:2px}
.timeline::-webkit-scrollbar-thumb:hover{background:var(--ac)}
.tl-s{display:flex;flex-direction:column;align-items:center;min-width:90px;position:relative}
.tl-s::after{content:"";position:absolute;top:7px;left:calc(50% + 10px);width:calc(100% - 20px);height:2px;background:var(--brd)}
.tl-s:last-child::after{display:none}
.tl-s.done::after{background:var(--ac);opacity:.7}
.tl-d{width:12px;height:12px;border-radius:50%;border:2px solid var(--brd);background:var(--el);margin-bottom:6px;z-index:1}
.tl-s.done .tl-d{background:var(--ac);border-color:var(--ac);box-shadow:var(--glow)}
.tl-s.act .tl-d{border-color:var(--sc);box-shadow:var(--glow-a);animation:pulse 1.5s ease-in-out infinite}
.tl-l{font-family:var(--mono);font-size:.55rem;letter-spacing:.06em;color:var(--dm);text-align:center}
.tl-s.done .tl-l{color:var(--ac)}
.tl-s.act .tl-l{color:var(--sc)}

/* full-width centered vault timeline + CTAs (homepage) */
.vault-flow{max-width:1100px;margin:40px auto 0;padding:36px 28px 40px;text-align:center;border:1px solid var(--brd);background:var(--el);position:relative}
.vault-flow::before,.vault-flow::after{content:"";position:absolute;width:18px;height:18px;border-color:var(--ac);border-style:solid;opacity:.65;pointer-events:none}
.vault-flow::before{top:-1px;left:-1px;border-width:2px 0 0 2px}
.vault-flow::after{bottom:-1px;right:-1px;border-width:0 2px 2px 0}
.vault-flow__title{margin:0 0 24px!important;text-align:center;letter-spacing:.28em;font-size:.72rem!important}
.timeline--hero{display:flex;align-items:flex-start;justify-content:space-between;width:100%;max-width:1000px;margin:0 auto;overflow:visible;padding:8px 8px 16px;gap:0}
.timeline--hero .tl-s{flex:1;min-width:0;position:relative}
.timeline--hero .tl-s::after{top:7px;left:calc(50% + 8px);width:calc(100% - 16px);height:3px}
.timeline--hero .tl-d{width:16px;height:16px;margin-bottom:12px;border-width:2px}
.timeline--hero .tl-l{font-size:.72rem;letter-spacing:.14em;line-height:1.35;max-width:7em}
.timeline--hero .tl-s.done .tl-l{font-weight:600}
.timeline--hero .tl-s.act .tl-l{font-weight:600}
.vault-flow__ctas{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:18px;margin-top:36px}
.vault-flow__ctas .btn{margin:0}
.btn--hero{padding:17px 40px!important;font-size:.78rem!important;letter-spacing:.14em!important;min-width:240px}
@media(max-width:700px){
  .timeline--hero{overflow-x:auto;justify-content:flex-start;padding-bottom:12px;gap:4px}
  .timeline--hero .tl-s{flex:0 0 auto;min-width:88px}
  .timeline--hero .tl-s::after{width:calc(100% - 18px)}
  .timeline--hero .tl-l{font-size:.6rem;letter-spacing:.08em}
  .btn--hero{min-width:100%;width:100%}
}

/* tags */
.tags{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}
.tag{padding:3px 8px;font-family:var(--mono);font-size:.6rem;color:var(--tag);background:var(--grid);border:1px solid var(--brd-a);border-radius:1px}

/* two-col layout */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:700px){.two-col{grid-template-columns:1fr}}

/* The Overseer: full-width S.P.E.C.I.A.L. + 30 / 40 / 30 */
.overseer-special-full{border:1px solid var(--brd);background:var(--el);padding:22px 20px 18px;margin:0 0 18px;text-align:center;position:relative}
.overseer-special-full::before,.overseer-special-full::after{content:"";position:absolute;width:14px;height:14px;border-color:var(--ac);border-style:solid;opacity:.65;pointer-events:none}
.overseer-special-full::before{top:-1px;left:-1px;border-width:2px 0 0 2px}
.overseer-special-full::after{bottom:-1px;right:-1px;border-width:0 2px 2px 0}
.overseer-special-full .sh{margin:0 0 14px;text-align:center}
.overseer-bars-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px 10px;max-width:100%;margin:0 auto}
.special-cell{display:flex;flex-direction:column;align-items:center;gap:6px;width:100%;text-align:center}
.special-num{font-family:var(--mono);font-size:1.35rem;font-weight:700;color:var(--ac);line-height:1;text-shadow:var(--glow)}
.special-num.lo{color:var(--sc);text-shadow:var(--glow-a)}
.special-letter{font-size:.62rem;font-weight:600;color:var(--mu);letter-spacing:.14em}
.overseer-bars-grid .bar-t{width:100%;max-width:100%;height:8px}
.special-label{font-size:.52rem;color:var(--dm);letter-spacing:.1em;text-transform:uppercase;line-height:1.25;max-width:100%}
.overseer-bars-grid--panel{gap:6px 4px}
.panel__body .overseer-bars-grid--panel .special-num{font-size:1.05rem}
.panel__body .overseer-bars-grid--panel .special-letter{font-size:.55rem}
.panel__body .overseer-bars-grid--panel .special-label{font-size:.45rem;letter-spacing:.06em}
.panel__body .overseer-bars-grid--panel .bar-t{height:6px}
.overseer-legend{font-family:var(--mono);font-size:.68rem;margin:16px 0 0;color:var(--mu);line-height:1.5;opacity:.85}
.overseer-triple{display:grid;grid-template-columns:3fr 4fr 3fr;gap:16px;align-items:start;margin:0 0 8px}
.overseer-triple__col{display:flex;flex-direction:column;min-width:0}
.overseer-triple__col .sh{margin:0 0 8px}
/* No flex stretch + no overflow:auto = no ugly OS scrollbars on short copy */
.overseer-triple__col .necro{flex:0 1 auto;margin:0;font-size:.75rem;white-space:pre-line;overflow:visible;overflow-x:hidden}
.overseer-triple__col .codewin{margin:0;display:flex;flex-direction:column;min-height:260px;width:100%}
/* Static code panel: no inner scroll */
.overseer-triple__col .codewin--static{min-height:auto}
.overseer-triple__col .codewin--static .codewin__body{flex:0 1 auto;min-height:0;overflow:visible}
/* Long code / dashboard: themed thin scrollbar only when needed */
.overseer-triple__col .codewin:not(.codewin--static) .codewin__body,
.panel__body .codewin__body--scroll{flex:1;min-height:0;max-height:min(50vh,320px);overflow:auto;scrollbar-width:thin;scrollbar-color:var(--ac-m) var(--code)}
.overseer-triple__col .codewin:not(.codewin--static) .codewin__body::-webkit-scrollbar,
.panel__body .codewin__body--scroll::-webkit-scrollbar{width:5px;height:5px}
.overseer-triple__col .codewin:not(.codewin--static) .codewin__body::-webkit-scrollbar-track,
.panel__body .codewin__body--scroll::-webkit-scrollbar-track{background:var(--code)}
.overseer-triple__col .codewin:not(.codewin--static) .codewin__body::-webkit-scrollbar-thumb,
.panel__body .codewin__body--scroll::-webkit-scrollbar-thumb{background:var(--ac-m);border-radius:2px}
.overseer-triple__col .codewin:not(.codewin--static) .codewin__body::-webkit-scrollbar-thumb:hover,
.panel__body .codewin__body--scroll::-webkit-scrollbar-thumb:hover{background:var(--ac)}
.overseer-side .tags{margin:0 0 16px}
.overseer-stats{margin:0;padding:0;font-family:var(--mono);font-size:.72rem}
.overseer-stats dt{color:var(--ac);opacity:.75;font-size:.58rem;letter-spacing:.12em;margin:12px 0 4px;text-transform:uppercase}
.overseer-stats dt:first-child{margin-top:0}
.overseer-stats dd{margin:0;color:var(--bd);line-height:1.45}
.overseer-stats dd.score-big{font-size:1.35rem;font-weight:700;color:var(--ac);text-shadow:var(--glow)}
@media(max-width:900px){
  .overseer-bars-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .overseer-triple{grid-template-columns:1fr}
}
@media(max-width:600px){
  .overseer-bars-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ══════════════════════════════════════
   DASHBOARD (dashboard.html)
   ══════════════════════════════════════ */
body.dash{font-family:var(--mono);font-size:.85rem}
body.dash .nav{height:44px}
.sidebar{display:none;position:fixed;top:44px;left:0;bottom:0;width:var(--side-w);background:var(--el);border-right:1px solid var(--brd);z-index:100;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--ac-m) var(--el)}
.sidebar::-webkit-scrollbar{width:5px}
.sidebar::-webkit-scrollbar-thumb{background:var(--ac-m);border-radius:2px}
@media(min-width:1024px){body.dash .sidebar{display:block}}
.side-label{font-size:.5rem;letter-spacing:.2em;color:var(--ac);opacity:.6;padding:14px 16px 4px;margin:0}
.side-sep{border:0;border-top:1px solid var(--brd);margin:6px 16px}
.side-nav{list-style:none;margin:0;padding:0}
.side-nav a{display:flex;align-items:center;gap:8px;padding:9px 16px 9px 24px;font-size:.65rem;letter-spacing:.08em;color:var(--mu);text-decoration:none;transition:all .12s}
.side-nav a:hover{color:var(--ac);background:rgba(0,212,170,.03)}
.side-nav a.act{color:var(--ac);background:var(--card);text-shadow:var(--glow);position:relative}
.side-nav a.act::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--ac)}
.side-active{background:var(--card);border:1px solid var(--brd);margin:6px 12px;padding:10px;font-size:.6rem}
.side-active p{margin:0}
.side-active .label{color:var(--bd);letter-spacing:.08em}
.side-active .repo{color:var(--sc);margin-top:3px;text-shadow:var(--glow-a)}
.side-active .meta{color:var(--mu);margin-top:2px}
.side-active .dn-t{color:var(--dn)}
.side-cmd{position:absolute;bottom:12px;left:12px;right:12px;padding:6px 10px;background:var(--card);border:1px solid var(--ac-m);display:flex;align-items:center;gap:6px;font-size:.55rem;color:var(--ac);opacity:.5}
.side-cmd kbd{margin-left:auto;opacity:.4}

.dash-main{position:relative;z-index:1;margin-top:44px;min-height:calc(100vh - 44px);padding:0 16px 20px}
@media(min-width:1024px){.dash-main{margin-left:var(--side-w);padding:0 24px 24px}}
.page-head{display:flex;align-items:baseline;gap:10px;padding:14px 0 10px;border-bottom:1px solid var(--brd);margin-bottom:14px}
.page-head h1{font-family:var(--mono);font-size:1rem;letter-spacing:.2em;color:var(--ac);margin:0;text-shadow:var(--glow)}
.page-head .sep{color:var(--dm)}
.page-head .sub{font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;color:var(--mu)}

/* panels (dashboard) */
.split{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:900px){.split{grid-template-columns:1fr 1fr}}
.panel{background:var(--el);border:1px solid var(--brd);position:relative;overflow:hidden}
.panel::before,.panel::after{content:"";position:absolute;width:14px;height:14px;border-color:var(--ac);border-style:solid;opacity:.7;pointer-events:none;z-index:2}
.panel::before{top:-1px;left:-1px;border-width:2px 0 0 2px}
.panel::after{bottom:-1px;right:-1px;border-width:0 2px 2px 0}
.panel__head{background:var(--card-h);padding:8px 14px;font-family:var(--mono);font-size:.5rem;letter-spacing:.14em;color:var(--ac);opacity:.7}
.panel__body{padding:14px}
.panel__body .necro{white-space:pre-line;word-break:break-word;overflow:visible;overflow-x:hidden;margin:8px 0}
.panel__body .codewin--static .codewin__body{overflow:visible}

/* stats bar (dashboard) */
.statsbar{background:var(--inset);border:1px solid var(--brd);display:flex;flex-wrap:wrap;margin:14px 0 0;padding:8px 0;font-family:var(--mono)}
.statsbar__item{flex:1;min-width:100px;padding:4px 14px;border-right:1px solid var(--brd)}
.statsbar__item:last-child{border-right:none}
.statsbar__label{font-size:.5rem;letter-spacing:.08em;color:var(--mu);margin:0}
.statsbar__val{font-size:.85rem;font-weight:700;color:var(--ac);margin:0}
.statsbar__val.sc{color:var(--sc);text-shadow:var(--glow-a)}
.statsbar .status{display:flex;align-items:center;gap:6px}
.statsbar .status-dot{width:7px;height:7px;border-radius:50%;background:var(--ac);box-shadow:var(--glow);animation:pulse 1.8s ease-in-out infinite}
.cmdbar{max-width:500px;margin:10px auto 0;padding:8px 14px;background:var(--nav-bg);border:1px solid var(--ac-m);display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.6rem;color:var(--mu)}
.cmdbar kbd{margin-left:auto;color:var(--ac);opacity:.3}

/* overseer.html — audit request layout */
.ovs-hero{padding:40px 0 28px;text-align:center;border-bottom:1px solid var(--brd);margin-bottom:8px}
.ovs-hero .hero__h{font-size:clamp(1.35rem,3.2vw,2rem)}
.ovs-lead{max-width:36em;margin:0 auto;font-size:1rem;color:var(--bd)}
.ovs-form .ovs-field{margin-bottom:14px}
.ovs-form label{display:block;font-family:var(--mono);font-size:.62rem;letter-spacing:.08em;color:var(--mu);margin-bottom:4px;text-transform:uppercase}
.ovs-form input,.ovs-form select,.ovs-form textarea{width:100%;padding:10px 12px;background:var(--card);border:1px solid var(--brd);color:var(--tx);font:400 .85rem var(--mono);border-radius:2px;outline:none}
.ovs-form input:focus,.ovs-form select:focus,.ovs-form textarea:focus{border-color:var(--ac)}
.ovs-form textarea{min-height:80px;resize:vertical}
.ovs-form .ovs-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;align-items:center}
.checklist{display:grid;gap:0;margin:14px 0;border:1px solid var(--brd)}
.checklist__row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;font-family:var(--mono);font-size:.72rem;border-bottom:1px solid var(--brd);color:var(--bd)}
.checklist__row:last-child{border-bottom:none}
.checklist__badge{font-size:.55rem;letter-spacing:.08em;padding:3px 8px;border-radius:1px;text-transform:uppercase;flex-shrink:0}
.checklist__badge--ok{background:rgba(0,212,170,.12);color:var(--ac);border:1px solid var(--ac-m)}
.checklist__badge--warn{background:rgba(255,184,77,.12);color:var(--sc);border:1px solid rgba(255,184,77,.35)}
.checklist__badge--fail{background:rgba(255,68,68,.1);color:var(--dn);border:1px solid rgba(255,68,68,.35)}
.checklist__badge--skip{background:var(--grid);color:var(--mu);border:1px solid var(--brd)}

/* responsive */
@media(max-width:700px){
  .steps,.cards,.pricing{grid-template-columns:1fr}
  .two-col{grid-template-columns:1fr}
  .timeline{justify-content:flex-start}
  .statsbar{flex-direction:column}
  .statsbar__item{border-right:none;border-bottom:1px solid var(--brd)}
}

/* cookie-consent.js */
.cookie-banner{position:fixed;bottom:0;left:0;right:0;z-index:10000;padding:16px 20px;background:var(--nav-bg);border-top:1px solid var(--ac-m);box-shadow:0 -8px 32px rgba(0,0,0,.45)}
.cookie-banner[hidden]{display:none!important}
.cookie-banner__inner{max-width:56rem;margin:0 auto;display:flex;flex-wrap:wrap;align-items:flex-end;gap:14px;justify-content:space-between}
.cookie-banner__text{margin:0;font-family:var(--mono);font-size:.68rem;line-height:1.55;color:var(--mu);flex:1;min-width:min(100%,220px)}
.cookie-banner__text code{font-size:.85em;color:var(--tx);word-break:break-all}
.cookie-banner__text a{color:var(--ac)}
.cookie-banner__actions{display:flex;flex-wrap:wrap;gap:8px}
.cookie-banner__btn{font-size:.65rem!important;padding:8px 14px!important}

.foot__legal{display:flex;flex-wrap:wrap;gap:10px 16px;justify-content:center;margin-bottom:10px;font-family:var(--mono);font-size:.62rem}
.foot__legal a{color:var(--mu)}
.foot__legal a:hover{color:var(--ac)}