/* ───────────────────────────────────────────────────────────────────────────
   legal.css — shared by terms.html and privacy.html.

   Same tokens as the landing page, but a document rather than a pitch: the
   sheet sits on the light surface from the brand kit, because long-form text on
   #04080A is tiring to read and this is the one place on the site somebody is
   expected to read every word. Dark chrome above and below keeps it recognisably
   the same site.
   ─────────────────────────────────────────────────────────────────────────── */
:root{
  --acc:#33F063; --acc-deep:#24A845; --term:#7CFF8A;
  --ink:#CFEFD2; --muted:#5E8F66; --faint:#37543C;
  --bg:#04080A; --bg2:#061009; --panel:#08130C; --raised:#0E1512;
  --teal:#2BD6C0; --warn:#E3C34A;
  --light:#E8F5EC; --sheet:#F2F9F4; --light-ink:#0A0F0D; --light-mute:#3C5A43;
  --light-line:#C3DECB;
  --acc-a14:rgba(51,240,99,.14); --acc-a22:rgba(51,240,99,.22); --acc-a40:rgba(51,240,99,.40);

  --notch:11px;
  --cut:polygon(0 0, calc(100% - var(--notch)) 0, 100% var(--notch), 100% 100%,
                var(--notch) 100%, 0 calc(100% - var(--notch)));

  --disp:"Archivo Black","Arial Black","Segoe UI Black",system-ui,sans-serif;
  --word:"Orbitron","Archivo Black","Arial Black",sans-serif;
  --title:"Chakra Petch","Segoe UI Semibold",system-ui,sans-serif;
  --mono:"JetBrains Mono","Cascadia Mono",Consolas,ui-monospace,monospace;

  --maxw:1180px;
  --gut:clamp(20px,5vw,48px);
  --ease:cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:96px}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:var(--mono);font-size:clamp(14.5px,1.05vw,15.5px);line-height:1.75;
  -webkit-font-smoothing:antialiased
}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2{margin:0;font-weight:400}
:focus-visible{outline:2px solid var(--acc);outline-offset:3px;border-radius:2px}

.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gut)}
.skip{
  position:fixed;top:-100px;left:16px;z-index:200;padding:12px 18px;
  background:var(--acc);color:#04080A;font-weight:500;text-decoration:none;transition:top .2s
}
.skip:focus{top:14px}
.kicker{
  font-family:var(--mono);font-weight:300;font-size:11px;letter-spacing:.34em;
  text-transform:uppercase;color:var(--light-mute);margin:0 0 16px
}

/* ── chrome ── */
.doc-head{
  position:sticky;top:0;z-index:50;
  background:rgba(4,8,10,.9);backdrop-filter:blur(14px) saturate(1.2);
  border-bottom:1px solid var(--acc-a14)
}
.doc-head-in{display:flex;align-items:center;gap:20px;height:72px}
.brand{display:flex;align-items:center;gap:13px;text-decoration:none;margin-right:auto}
.brand .mark{width:36px;height:36px;flex:none}
.wordmark{font-family:var(--word);font-weight:900;font-size:1.1rem;letter-spacing:.1em;white-space:nowrap}
.wordmark i{font-style:normal;color:var(--acc)}
.back{
  display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:0 16px;
  clip-path:var(--cut);background:var(--acc-a14);color:var(--ink);text-decoration:none;
  font-size:12.5px;font-weight:300;letter-spacing:.14em;text-transform:uppercase;
  transition:background .25s,transform .25s var(--ease)
}
.back:hover,.back:focus-visible{background:var(--acc-a40);transform:translateX(-3px)}
@media(max-width:560px){.back span{display:none}.back{padding:0 13px}}

/* ── the sheet ── */
.sheet{background:var(--light);color:var(--light-ink);padding-block:clamp(44px,6vw,84px)}
.doc-grid{display:grid;gap:clamp(32px,4vw,56px);align-items:start}
@media(min-width:920px){.doc-grid{grid-template-columns:minmax(0,232px) minmax(0,1fr)}}

.doc-side{display:flex;flex-direction:column;gap:26px}
@media(min-width:920px){.doc-side{position:sticky;top:104px}}

.doc-tabs{display:flex;flex-direction:column;gap:8px}
.doc-tabs a{
  display:block;padding:12px 16px;clip-path:var(--cut);
  background:rgba(10,15,13,.06);color:var(--light-mute);text-decoration:none;
  font-family:var(--title);font-weight:700;font-size:14px;letter-spacing:.02em;
  transition:background .24s,color .24s,transform .24s var(--ease)
}
.doc-tabs a:hover{background:rgba(10,15,13,.12);color:var(--light-ink);transform:translateX(3px)}
.doc-tabs a[aria-current="page"]{
  background:linear-gradient(135deg,var(--acc),var(--acc-deep));color:#04080A
}

.doc-toc h2{
  font-family:var(--mono);font-weight:300;font-size:10.5px;letter-spacing:.28em;
  text-transform:uppercase;color:var(--light-mute);margin-bottom:14px
}
.doc-toc ol{margin:0;padding:0 0 0 1.5em;display:flex;flex-direction:column;gap:9px}
.doc-toc li{font-size:12.5px;line-height:1.5}
.doc-toc a{color:var(--light-mute);text-decoration:none;transition:color .2s}
.doc-toc a:hover{color:var(--acc-deep);text-decoration:underline}

/* ── document body ── */
.doc-body{max-width:70ch}
.doc-body h1{
  font-family:var(--disp);font-size:clamp(2rem,4.4vw,3rem);line-height:1.04;
  letter-spacing:-.015em;text-transform:uppercase;margin-bottom:20px
}
.doc-lede{font-size:clamp(15px,1.3vw,17px);line-height:1.7;color:var(--light-mute);margin:0}

.doc-note{
  margin:clamp(28px,3.5vw,40px) 0 0;padding:20px 24px;clip-path:var(--cut);
  background:rgba(227,195,74,.14);border-left:3px solid var(--warn);
  font-size:13px;line-height:1.7;color:var(--light-ink)
}
.doc-note strong{font-family:var(--title);font-weight:700}
.doc-note-todo{display:block;margin-top:10px;color:var(--light-mute)}

.doc-sec{margin-top:clamp(30px,3.6vw,44px);scroll-margin-top:104px}
.doc-sec h2{
  font-family:var(--mono);font-weight:500;font-size:11px;letter-spacing:.24em;
  text-transform:uppercase;color:var(--acc-deep);margin-bottom:10px
}
.doc-sec p{margin:0;font-size:14.5px;line-height:1.85;color:var(--light-ink)}

/* placeholders the seller still has to write — impossible to ship by accident */
mark.todo{
  background:rgba(227,195,74,.32);color:#4A3A05;
  padding:1px 5px;border-radius:2px;font-weight:500
}

.doc-foot{
  margin-top:clamp(40px,5vw,64px);padding-top:24px;
  border-top:1px solid var(--light-line);
  font-size:12.5px;line-height:1.7;color:var(--light-mute)
}
.doc-foot p{margin:0 0 6px}
.doc-foot code{font-family:var(--mono);color:var(--light-ink)}
.doc-foot a{color:var(--acc-deep)}

/* ── site footer ── */
.site-foot{padding:clamp(34px,4vw,52px) 0 30px;background:var(--bg2);border-top:1px solid var(--acc-a14)}
.foot-in{
  display:flex;flex-wrap:wrap;gap:14px 26px;align-items:center;
  font-size:12px;font-weight:300;color:var(--muted)
}
.foot-in nav{display:flex;flex-wrap:wrap;gap:20px;margin-left:auto}
.foot-in a{color:var(--muted);text-decoration:none;transition:color .2s}
.foot-in a:hover,.foot-in a:focus-visible{color:var(--acc)}
.disclaim{margin:18px auto 0;font-size:11.5px;line-height:1.75;color:var(--muted);max-width:88ch}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.001ms !important;animation-duration:.001ms !important}
}
@media print{
  .doc-head,.doc-side,.skip,.site-foot{display:none}
  body,.sheet{background:#fff;color:#000}
  .doc-body{max-width:none}
  mark.todo{background:none;outline:1px solid #999}
}