/* SITE-DESIGN-1016 · the approved Method D6 design (assets/method-app/d2.css + d6.css) as ONE layer for every public page.
   Load it LAST in <head> (after the page's own <style>) so it wins: <link rel="stylesheet" href="/assets/site/d6-site.css?v=1016a">
   Rules: ink #14171F background, paper #F4F6FA text, red #FE2C55 ONLY on the page's one main action, Bricolage (display) + Inter (UI),
   big display type, flat (no shadows, no gradients), generous space, 44px+ tap targets, house easing.
   Old token names are remapped to dark values here so pages built on languy-tokens.css / their own :root switch over without
   touching their markup. html:root beats a page's plain :root, whatever the order. Page-specific fixes live in the page, not here. */
/* Latin subsets of the D6 fonts (assets/method-min/*.woff2, 205+48 KB): Bricolage wght 600-800 wdth 100 = 63 KB, Inter full weight range = 36 KB.
   Other scripts (Japanese, Korean...) fall through to the system fonts, as before. */
@font-face{font-family:"Bricolage Grotesque";font-weight:600 800;font-display:swap;src:url(/assets/site/bricolage-latin.woff2) format("woff2")}
@font-face{font-family:Inter;font-weight:100 900;font-display:swap;src:url(/assets/site/inter-latin.woff2) format("woff2")}
html:root{
  /* D6 system (namespaced: D6's own "--ink" means background, the old pages use "--ink" for text) */
  --d6-ink:#14171F;--d6-ink2:#1B1F29;--d6-ink3:#252A36;--d6-paper:#F4F6FA;--d6-mute:#A3ACBA;--d6-line:rgba(244,246,250,.12);
  --d6-red:#FE2C55;--d6-red-d:#C8173A;--d6-ok:#22B05A;
  --d6-display:"Bricolage Grotesque",system-ui,sans-serif;--d6-ui:Inter,system-ui,-apple-system,sans-serif;
  --d6-big:clamp(38px,5.2vw,72px);--d6-mid:clamp(26px,3vw,36px);--d6-ease:cubic-bezier(.16,1,.3,1);
  color-scheme:dark;
  /* legacy names → dark values (languy-tokens.css + the per-page palettes) */
  --bg:#14171F;--bg-2:#14171F;--bg-soft:#1B1F29;--b:#1B1F29;--surface:#1B1F29;--surface-2:#252A36;--card:#1B1F29;--raised:#252A36;
  --paper-2:#1B1F29;--tint:#1B1F29;--accent-tint:#1B1F29;--skySoft:#1B1F29;--blue-soft:#1B1F29;--accent-soft:#252A36;--action-soft:#252A36;
  --good-soft:#1B1F29;--owned-soft:#1B1F29;--earned-soft:#1B1F29;
  --text:#F4F6FA;--head:#F4F6FA;--ink-2:#C9D0DB;--ink2:#C9D0DB;--muted:#A3ACBA;--muted-2:#8A93A3;--faint:#A3ACBA;--dim:#8A93A3;
  --line:rgba(244,246,250,.12);--line-2:rgba(244,246,250,.18);--hair:rgba(244,246,250,.12);
  --accent:#FE2C55;--accent-bright:#FE2C55;--accent-cta:#FE2C55;--accent-deep:#C8173A;--accent-text:#F4F6FA;--accent-press:#C8173A;
  --action:#FE2C55;--action-hi:#C8173A;--action-lip:#C8173A;--action-text:#F4F6FA;--on-action:#FFFFFF;--cta:#FE2C55;--cta-hover:#C8173A;
  --blue:#F4F6FA;--blue-2:#F4F6FA;--sky:#F4F6FA;--teal:#F4F6FA;--link:#F4F6FA;--green:#22B05A;--lip:#C8173A;--navy:#14171F;
  --shadow:none;--shadow-lg:none;--lift:none;--btn-depth:0;
  --disp:var(--d6-display);--wide:var(--d6-display);--sans:var(--d6-ui);
  --td-bg:#14171F;--td-surface:#1B1F29;--td-raised:#252A36;--td-ink:#F4F6FA;--td-ink-2:#C9D0DB;--td-muted:#A3ACBA;--td-line:rgba(244,246,250,.12);--td-line-2:rgba(244,246,250,.18);
}
html{background:var(--d6-ink)}
body{background:var(--d6-ink);color:var(--d6-paper);font-family:var(--d6-ui);-webkit-font-smoothing:antialiased;text-size-adjust:100%;-webkit-tap-highlight-color:transparent}
h1,h2,h3,.d6-big,.d6-mid{font-family:var(--d6-display);color:var(--d6-paper);text-transform:none;text-wrap:balance}
h1,.d6-big{font-weight:800;letter-spacing:-.035em;line-height:1.04}
h2,.d6-mid{font-weight:700;letter-spacing:-.02em;line-height:1.1}
h3{font-weight:700;letter-spacing:-.01em}
p,li,dd,td{text-wrap:pretty}
a{color:inherit}
::selection{background:var(--d6-red);color:#fff}
:focus-visible{outline:2px solid var(--d6-paper);outline-offset:4px}
input,select,textarea{color:var(--d6-paper);background:var(--d6-ink2);border-color:var(--d6-line)}
input::placeholder,textarea::placeholder{color:#8A93A3}

/* the shared parts a page opts into (class names are new, so they never collide with page CSS) */
.d6-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;max-width:360px;min-height:60px;padding:0 24px;border:0;border-radius:999px;
  background:var(--d6-red);color:#fff;font:600 17px/1.2 var(--d6-ui);letter-spacing:0;text-transform:none;text-decoration:none;box-shadow:none;cursor:pointer;
  transition:transform .2s var(--d6-ease),opacity .2s}
.d6-btn:active{transform:scale(.97)}
.d6-ghost{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;max-width:360px;min-height:56px;padding:0 24px;border:0;border-radius:999px;
  background:rgba(244,246,250,.08);color:var(--d6-paper);font:600 17px/1.2 var(--d6-ui);text-transform:none;text-decoration:none;box-shadow:none;cursor:pointer}
.d6-link{display:inline-flex;align-items:center;min-height:44px;color:rgba(244,246,250,.72);text-decoration:none}
@media(hover:hover){.d6-btn:hover{opacity:.92}.d6-link:hover{color:var(--d6-paper)}}
.d6-mark{display:inline-flex;align-items:center;min-height:44px;font:700 17px/1 var(--d6-display);letter-spacing:-.01em;color:var(--d6-paper);text-decoration:none}
.d6-mute{color:var(--d6-mute)}
.d6-kick{color:var(--d6-mute);font:500 15px/1.4 var(--d6-ui);letter-spacing:0;text-transform:none}
.d6-foot{color:var(--d6-mute);font-size:14px;text-align:center}
.d6-foot a{display:inline-flex;min-height:44px;align-items:center;color:var(--d6-mute)}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

/* the shared feedback bubble + sheet (feedback-widget.js injects its own CSS later; "html body" outranks it) */
html body .lb{background:#252A36;color:var(--d6-paper);border:1px solid rgba(244,246,250,.18);box-shadow:0 0 0 4px #14171F;opacity:1}
html body .lb.lb-yield{opacity:0}
html body .ls{background:var(--d6-ink2);color:var(--d6-paper);font-family:var(--d6-ui)}
html body .lh{font-family:var(--d6-display);letter-spacing:-.015em}
html body .lu,html body .lm,html body .la,html body .lc{color:var(--d6-mute)}
html body .la,html body .lt,html body .le{border-color:var(--d6-line)}
html body .la,html body .lt,html body .le{background:var(--d6-ink3);color:var(--d6-paper)}
html body .la.lg,html body .lk,html body .ln{background:var(--d6-red);border-color:var(--d6-red);color:#fff}
html body .ln{border-radius:999px;font-family:var(--d6-ui);font-weight:600}
html body .lt:focus,html body .le:focus{border-color:var(--d6-paper);box-shadow:none}

/* old font names some pages still hard-code → the D6 faces (declared after the pages' own @font-face, so these win;
   the old files are then never downloaded) */
@font-face{font-family:"DM Sans";font-weight:100 900;font-display:swap;src:url(/assets/site/inter-latin.woff2) format("woff2")}
@font-face{font-family:"Instrument Sans";font-weight:100 900;font-display:swap;src:url(/assets/site/inter-latin.woff2) format("woff2")}
@font-face{font-family:Archivo;font-weight:100 900;font-display:swap;src:url(/assets/site/bricolage-latin.woff2) format("woff2")}
@font-face{font-family:"Archivo Black";font-weight:100 900;font-display:swap;src:url(/assets/site/bricolage-latin.woff2) format("woff2")}
@media(max-width:600px){html body .lb{width:40px;height:40px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom))}html body .lb svg{width:18px;height:18px}}
