/* Assign Members marketing: shared tokens, base, nav, footer.
   Light is the default; dark follows the OS unless the visitor picks a theme
   (html[data-theme]). Every colour a page uses comes from a token here. */
:root{
  --ground:#f7f4ef; --surface:#ffffff; --surface-2:#faf8f4;
  --ink:#2c2c2c; --ink-2:#4a4a4a; --muted:#666666; --line:#f0ede8; --line-2:#e4e0d8;
  --accent:#a21caf; --accent-deep:#86198f; --accent-700:#701a75; --accent-tint:#f7e9f8;
  --btn-bg:#86198f; --btn-bg-hover:#a21caf; --on-accent:#ffffff;
  --gold:#d9a441; --ok:#15833f; --warn:#a15c00; --bad:#b42318;
  --nav-bg:rgba(247,244,239,.86);
  --shadow:rgba(40,40,40,.14);
  --display:"Fraunces",Georgia,serif;
  --body:filson-pro,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:ui-monospace,Menlo,Monaco,Consolas,monospace;
  --pad:clamp(1rem,5vw,4.5rem); --maxw:1180px;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --ground:#151117; --surface:#1f1a22; --surface-2:#1a161d;
    --ink:#f2edf1; --ink-2:#d6cfd7; --muted:#b1a8b3; --line:#2a2330; --line-2:#3a3140;
    --accent:#e879f9; --accent-deep:#d946ef; --accent-700:#f0abfc; --accent-tint:#341538;
    --gold:#e8b85a; --ok:#4ade80; --warn:#fbbf24; --bad:#f87171;
    --nav-bg:rgba(21,17,23,.86);
    --shadow:rgba(0,0,0,.45);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --ground:#151117; --surface:#1f1a22; --surface-2:#1a161d;
  --ink:#f2edf1; --ink-2:#d6cfd7; --muted:#b1a8b3; --line:#2a2330; --line-2:#3a3140;
  --accent:#e879f9; --accent-deep:#d946ef; --accent-700:#f0abfc; --accent-tint:#341538;
  --gold:#e8b85a; --ok:#4ade80; --warn:#fbbf24; --bad:#f87171;
  --nav-bg:rgba(21,17,23,.86);
  --shadow:rgba(0,0,0,.45);
  color-scheme:dark;
}

*{box-sizing:border-box;margin:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--ground);color:var(--ink);font-family:var(--body);
  line-height:1.55;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
a{color:inherit;text-decoration:none}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:3px}
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--pad)}
h1,h2,h3,h4{font-family:var(--display);font-weight:600;line-height:1.05;letter-spacing:-.015em}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--btn-bg);color:var(--on-accent);padding:10px 14px;border-radius:8px;font-weight:700}
.skip:focus{top:12px}

.eyebrow{display:inline-flex;align-items:center;gap:9px;color:var(--accent);font-size:.72rem;
  font-weight:800;letter-spacing:.2em;text-transform:uppercase}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--accent);border-radius:2px}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:1px solid transparent;border-radius:11px;
  padding:14px 24px;font-family:inherit;font-size:.96rem;font-weight:700;cursor:pointer;text-align:center;
  transition:transform .18s ease,background .18s ease,box-shadow .18s ease,color .18s,border-color .18s}
.btn:hover{transform:translateY(-2px)}
.btn--accent{background:var(--btn-bg);color:var(--on-accent);box-shadow:0 8px 28px rgba(134,25,143,.30)}
.btn--accent:hover{background:var(--btn-bg-hover);box-shadow:0 12px 36px rgba(162,28,175,.42)}
.btn--ghost{background:transparent;border-color:var(--line-2);color:var(--ink)}
.btn--ghost:hover{border-color:var(--accent);color:var(--accent)}
.btn--soon,.btn--soon:hover{cursor:not-allowed;opacity:.6;transform:none;box-shadow:none}
.btn--ghost.btn--soon:hover{border-color:var(--line-2);color:var(--ink)}
.btn--accent.btn--soon:hover{background:var(--btn-bg)}
@media (prefers-reduced-motion:reduce){.btn:hover{transform:none}html{scroll-behavior:auto}}

/* nav */
.nav{position:sticky;top:0;z-index:30;background:var(--nav-bg);backdrop-filter:blur(12px) saturate(140%);-webkit-backdrop-filter:blur(12px) saturate(140%);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;height:68px}
.brand{display:flex;align-items:center;gap:11px;font-weight:800;font-size:1rem;white-space:nowrap}
.brand .bc{width:32px;height:26px;display:block;flex:none}
.nav-links{display:flex;align-items:center;gap:24px}
.nav-links a:not(.btn){color:var(--muted);font-size:.92rem;font-weight:600}
.nav-links a:not(.btn):hover,.nav-links a[aria-current="page"]{color:var(--ink)}
.nav-cta{padding:9px 16px;font-size:.85rem}
.theme-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;flex:none;border-radius:10px;
  border:1px solid var(--line-2);background:transparent;color:var(--ink);cursor:pointer}
.theme-btn:hover{border-color:var(--accent);color:var(--accent)}
.theme-btn svg{width:18px;height:18px}
.theme-btn .moon{display:none}
:root[data-theme="dark"] .theme-btn .sun{display:none}
:root[data-theme="dark"] .theme-btn .moon{display:block}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .theme-btn .sun{display:none}
  :root:not([data-theme="light"]) .theme-btn .moon{display:block}
}
@media (max-width:860px){ .nav-links a:not(.btn){display:none} .nav-links{gap:10px} }
@media (max-width:420px){ .brand{font-size:.92rem;gap:8px} .nav-cta{padding:8px 12px;font-size:.8rem} }

/* footer */
footer{border-top:1px solid var(--line);padding:40px 0 50px;margin-top:30px}
footer .ftop{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:18px}
footer .fbrand{display:flex;align-items:center;gap:11px;font-weight:800;font-size:1.1rem}
footer nav{display:flex;gap:10px 24px;flex-wrap:wrap}
footer nav a{color:var(--muted);font-size:.9rem;font-weight:600;padding:4px 0}
footer nav a:hover{color:var(--ink)}
footer .fbot{margin-top:24px;padding-top:18px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;color:var(--muted);font-size:.82rem}
.family-link{background:none;border:none;color:var(--accent);font:inherit;font-size:.82rem;font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:3px;padding:0}

/* long-form pages (privacy, support) */
.doc{padding:clamp(2.5rem,7vw,5rem) 0 clamp(2rem,5vw,4rem)}
.doc .wrap{max-width:860px}
.doc h1{font-size:clamp(2.2rem,7vw,3.6rem);margin:.35em 0 .3em}
.doc .lede{color:var(--muted);font-size:1.12rem;max-width:62ch}
.doc h2{font-size:clamp(1.4rem,4vw,1.8rem);margin:2.2rem 0 .7rem}
.doc h3{font-size:1.15rem;margin:1.4rem 0 .4rem}
.doc p,.doc li{color:var(--ink-2);font-size:1rem}
.doc p+p{margin-top:.8rem}
.doc ul{padding-left:1.2rem;margin:.6rem 0}
.doc li{margin:.35rem 0}
.doc a:not(.btn){color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.doc .meta{color:var(--muted);font-size:.9rem;margin-top:.6rem}
.draft{display:inline-flex;align-items:center;gap:8px;margin-top:18px;background:var(--accent-tint);border:1px solid var(--accent);
  color:var(--ink);border-radius:999px;padding:8px 15px;font-weight:800;font-size:.86rem}
.panel{background:var(--surface);border:1px solid var(--line-2);border-radius:18px;padding:22px 24px;margin:1.2rem 0}
.panel h2:first-child,.panel h3:first-child{margin-top:0}
.table-wrap{overflow-x:auto;margin:.8rem 0}
.dtable{width:100%;border-collapse:collapse;font-size:.94rem}
.dtable th,.dtable td{text-align:left;vertical-align:top;padding:10px 12px;border-bottom:1px solid var(--line-2);color:var(--ink-2)}
.dtable th{color:var(--ink);font-weight:800;font-size:.8rem;text-transform:uppercase;letter-spacing:.05em}

/* copy-to-clipboard row */
.copyrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:10px}
.copyrow code{font-family:var(--mono);font-size:1.02rem;background:var(--surface-2);border:1px solid var(--line-2);border-radius:10px;padding:10px 14px;color:var(--ink);overflow-wrap:anywhere}
.copy-btn{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line-2);background:var(--surface);color:var(--ink);
  border-radius:10px;padding:10px 14px;font:inherit;font-size:.88rem;font-weight:700;cursor:pointer}
.copy-btn:hover{border-color:var(--accent);color:var(--accent)}
.copy-btn svg{width:16px;height:16px}
.copy-status{color:var(--ok);font-weight:700;font-size:.88rem;min-height:1.2em}