/* braindumpi site chrome — paper theme. Built on the design-system tokens. */
@import url("styles.css");

/* ——— layout ——— */
.wrap{max-width:var(--page-max);margin:0 auto;padding-inline:var(--gutter)}
body{background:var(--bg-page);color:var(--text-body)}
/* the design canvas is 1440 wide — on bigger screens scale the whole page up
   so it reads at the intended size instead of sitting small in the middle */
@media(min-width:1440px){body{zoom:1.12}}
@media(min-width:1600px){body{zoom:1.25}}
@media(min-width:1800px){body{zoom:1.40}}
@media(min-width:2100px){body{zoom:1.62}}
a{text-decoration:none}

/* ——— buttons (site aliases over the DS button) ——— */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);font:var(--fw-semi) var(--fs-body-s)/1 var(--font-text);letter-spacing:-.01em;border-radius:var(--r-pill);border:var(--bw-hair) solid transparent;cursor:pointer;transition:var(--t-control);text-decoration:none;white-space:nowrap;height:var(--control-h);padding:0 var(--sp-5)}
.btn--sm{height:var(--control-h-s);padding:0 var(--sp-4);font-size:var(--fs-caption)}
.btn--lg{height:var(--control-h-l);padding:0 var(--sp-7);font-size:var(--fs-body-l)}
.btn--primary{background:var(--accent);color:var(--on-accent);border-color:rgba(18,17,16,.14)}
.btn--primary:hover{background:var(--accent-hover);color:var(--on-accent)}
.btn--primary:active{background:var(--accent-press);transform:scale(.985)}
.btn--sticker{background:var(--accent);color:var(--on-accent);border:var(--bw-ink) solid var(--ink-900);box-shadow:var(--shadow-sticker)}
.btn--sticker:hover{background:var(--accent-hover);color:var(--on-accent);transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink-900)}
.btn--sticker:active{background:var(--accent-press);transform:translate(2px,2px);box-shadow:var(--shadow-sticker-press)}
.btn--secondary{background:var(--surface-card);color:var(--text-strong);border-color:var(--border-soft);box-shadow:var(--shadow-1)}
.btn--secondary:hover{border-color:var(--border-ink);color:var(--text-strong);box-shadow:var(--shadow-2)}
.btn--dark{background:var(--ink-900);color:var(--bone-100)}
.btn--dark:hover{background:var(--ink-700);color:var(--bone-100)}
.btn--ghost{background:transparent;border-color:var(--border-soft);color:var(--text-body)}
.btn--ghost:hover{background:var(--surface-inset);color:var(--text-strong);border-color:var(--border-ink)}
.btn svg{width:16px;height:16px;flex:none}

/* ——— top nav ——— */
.nav{position:sticky;top:0;z-index:20;background:rgba(247,242,232,.82);backdrop-filter:saturate(160%) blur(14px);border-bottom:var(--bw-hair) solid transparent;transition:var(--t-surface)}
.nav[data-scrolled="true"]{border-bottom-color:var(--border-hairline)}
.nav__in{display:flex;align-items:center;gap:var(--sp-7);height:var(--topbar-h)}
.nav__logo{height:22px;width:auto;display:block}
.nav__links{display:flex;align-items:center;gap:var(--sp-6);margin-left:var(--sp-5)}
.nav__link{font:var(--fw-medium) var(--fs-body)/1 var(--font-text);color:var(--text-body);cursor:pointer;background:none;border:none;padding:0;transition:var(--t-control)}
.nav__link:hover{color:var(--coral-500)}
.nav__right{margin-left:auto;display:flex;align-items:center;gap:var(--sp-4)}
@media(max-width:780px){.nav__links{display:none}}

/* ——— eyebrow / section heads ——— */
.eyebrow{font:var(--text-eyebrow);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--text-muted)}
.sechead{display:flex;flex-direction:column;gap:var(--sp-4);max-width:var(--prose-max)}
.sechead h2{font:var(--text-display-l);font-weight:var(--fw-black);letter-spacing:var(--ls-display);text-transform:lowercase}
.sechead p{margin:0;font:var(--text-body-l);color:var(--text-body)}

/* ——— long-form document pages (privacy / terms / docs) ——— */
.docwrap{display:grid;grid-template-columns:220px 1fr;gap:var(--sp-9);padding-block:var(--sp-9) var(--sp-11);align-items:start}
@media(max-width:900px){.docwrap{grid-template-columns:1fr}}
.toc{position:sticky;top:80px}
@media(max-width:900px){.toc{position:static}}
.toc h4{font:var(--text-eyebrow);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--text-muted);margin-bottom:var(--sp-4)}
.toc a{display:block;font:var(--fw-medium) var(--fs-body-s)/1.4 var(--font-text);color:var(--text-muted);padding:6px 0;transition:var(--t-control)}
.toc a:hover{color:var(--text-strong)}
.doc{max-width:760px;padding-block:var(--sp-10) var(--sp-11)}
.docwrap .doc{padding-block:0;max-width:720px}
.doc__head{margin-bottom:var(--sp-9)}
.doc__head h1{font-family:var(--font-display);font-weight:var(--fw-black);font-size:clamp(38px,5vw,60px);line-height:1;letter-spacing:-.04em;color:var(--text-strong);margin:var(--sp-4) 0;text-transform:lowercase}
.doc__head h1 em{font-style:normal;color:var(--coral-500)}
.doc__updated{font:var(--fw-medium) 12px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}
.doc__lede{font:var(--fw-regular) 18px/1.6 var(--font-text);color:var(--ink-600);margin-top:var(--sp-5);max-width:60ch}
.doc section{scroll-margin-top:80px;padding-top:var(--sp-8);border-top:var(--bw-hair) solid var(--border-hairline);margin-top:var(--sp-8)}
.doc section:first-of-type{border-top:none;margin-top:var(--sp-6);padding-top:0}
.doc h2{font-family:var(--font-display);font-weight:var(--fw-bold);font-size:clamp(22px,2.6vw,30px);line-height:1.1;letter-spacing:var(--ls-display);color:var(--text-strong);margin:var(--sp-9) 0 var(--sp-4);display:flex;align-items:baseline;gap:12px}
.docwrap .doc h2{margin-top:0}
.doc h2 em{font-style:normal;color:var(--coral-500)}
.doc h2 .num{font:var(--fw-semi) 14px/1 var(--font-mono);color:var(--text-muted);letter-spacing:0}
.doc h3{font:var(--fw-semi) var(--fs-body-l)/1.3 var(--font-display);color:var(--text-strong);margin:var(--sp-6) 0 var(--sp-2)}
.doc p{color:var(--ink-600);margin:0 0 var(--sp-4);max-width:66ch}
.doc a.inline{color:var(--coral-600);text-decoration:underline;text-underline-offset:2px}
.doc ol{margin:0 0 var(--sp-4);padding-left:0;list-style:none;counter-reset:step;display:flex;flex-direction:column;gap:var(--sp-4);max-width:66ch}
.doc ol li{counter-increment:step;display:flex;gap:var(--sp-4);color:var(--ink-600)}
.doc ol li::before{content:counter(step);flex:none;width:28px;height:28px;border-radius:var(--r-pill);background:var(--lime-200);color:var(--ink-900);font:var(--fw-bold) 13px/28px var(--font-mono);text-align:center}
.doc ul{margin:0 0 var(--sp-4);padding:0;list-style:none;display:flex;flex-direction:column;gap:var(--sp-3);max-width:66ch}
.doc ul li,.doc li{display:flex;gap:var(--sp-3);color:var(--ink-600)}
.doc li svg{width:16px;height:16px;color:var(--lime-600);flex:none;margin-top:4px}
.doc strong{color:var(--text-strong);font-weight:var(--fw-semi)}
.callout{background:var(--lime-100);border:var(--bw-hair) solid var(--lime-600);border-radius:var(--r-l);padding:var(--sp-6);margin:var(--sp-6) 0;max-width:66ch}
.callout p{margin:0;color:var(--ink-600)}
.callout p+p{margin-top:var(--sp-3)}
.perm{display:flex;flex-direction:column;gap:var(--sp-3);max-width:66ch;margin:0 0 var(--sp-4)}
.perm__row{display:flex;gap:var(--sp-4);padding:var(--sp-4);border:var(--bw-hair) solid var(--border-hairline);border-radius:var(--r-m);background:var(--surface-card)}
.perm__row b{color:var(--text-strong);font-family:var(--font-display);font-weight:var(--fw-semi)}
.perm__row span{display:block;color:var(--text-muted);font-size:var(--fs-body-s);margin-top:3px}
.keycap{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:34px;padding:0 10px;border-radius:var(--r-s);background:var(--surface-card);border:var(--bw-hair) solid var(--border-soft);border-bottom-width:3px;font:var(--fw-semi) 13px/1 var(--font-mono);color:var(--text-body);vertical-align:middle;box-shadow:var(--shadow-1)}

/* ——— footer ——— */
.foot{border-top:var(--bw-hair) solid var(--border-hairline);padding-block:var(--sp-9) var(--sp-7);display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:var(--sp-6)}
@media(max-width:760px){.foot{grid-template-columns:1fr 1fr}}
.foot__logo{height:22px;width:auto;margin-bottom:var(--sp-4);display:block}
.foot p{font:var(--text-body-s);color:var(--text-muted);max-width:28ch}
.foot h4{font:var(--text-eyebrow);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--text-muted);margin-bottom:var(--sp-4)}
.foot a{display:block;font:var(--text-body-s);color:var(--ink-600);margin-bottom:var(--sp-3);transition:var(--t-control)}
.foot a:hover{color:var(--coral-500)}
.footbar{border-top:var(--bw-hair) solid var(--border-hairline);padding-block:var(--sp-5);display:flex;gap:var(--sp-5);font:var(--text-mono);font-size:var(--fs-micro);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--text-muted);flex-wrap:wrap}

/* ——— paper header + minimal footer (same chrome as the home page) ——— */
.pagehead{height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 24px;max-width:1200px;margin:0 auto}
.pagehead img{height:22px;width:auto;display:block}
.pagehead nav{display:flex;align-items:center;gap:28px}
.pagehead nav a{font-size:16px;color:#121110}
.pagehead nav a:hover{color:#FF5C29}
@media(max-width:700px){.pagehead{padding:0 20px}.pagehead nav a:not(.keep){display:none}}
.pagefoot{max-width:1200px;margin:0 auto;padding:0 24px 56px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#57514A}
.pagefoot img{height:18px;width:auto;display:block}
.pagefoot div{display:flex;gap:24px;flex-wrap:wrap}
.pagefoot a{color:#57514A}
.pagefoot a:hover{color:#FF5C29}

/* ——— ink bar + dark tail (legacy, unused) ——— */
.inkbar{height:64px;flex:none;display:flex;align-items:center;justify-content:space-between;padding:0 32px;border-bottom:1px solid rgba(247,242,232,.12);position:sticky;top:0;z-index:20;background:#121110}
.inkbar img{height:22px;width:auto;display:block}
.inkbar__nav{display:flex;align-items:center;gap:28px}
.inkbar__nav a{font-family:'JetBrains Mono',monospace;font-size:13px;color:#A79E93;transition:var(--t-control)}
.inkbar__nav a:hover{color:#C9F031}
@media(max-width:700px){.inkbar{padding:0 20px}.inkbar__nav a:not(.keep){display:none}}
/* ═══════════ footer ═══════════ */
.tail{background:#121110;color:#A79E93;padding:48px 32px 40px}
.tail__in{max-width:1200px;margin:0 auto;display:flex;align-items:flex-start;justify-content:space-between;gap:32px;flex-wrap:wrap}
.tail img{height:22px;width:auto;display:block;margin-bottom:12px}
.tail p{margin:0;font-size:14px;color:#57514A;max-width:32ch}
.tail__links{display:flex;gap:28px;flex-wrap:wrap}
.tail__links a{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#A79E93}
.tail__links a:hover{color:#C9F031}
.tail__bar{max-width:1200px;margin:32px auto 0;padding-top:20px;border-top:1px solid rgba(247,242,232,.12);display:flex;gap:20px;flex-wrap:wrap;font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#57514A}
