/* 4789 interior pages — prose + consolidated docs. Built on site.css tokens. */
main.page{min-height:60vh}
.page-hero{position:relative;padding:150px 0 22px;overflow:hidden}
.page-hero .halo{position:absolute;inset:0;background:radial-gradient(58% 80% at 50% -12%,rgba(255,120,73,.14),transparent 60%);opacity:calc(var(--flood) + .3);pointer-events:none}
.page-hero h1{font-size:clamp(34px,5vw,58px);margin-top:14px}
.page-hero .lead{margin-top:18px;max-width:60ch}
.updated{color:var(--muted);font-size:13.5px;margin-top:14px}

/* ---- prose (privacy / terms / support) ---- */
.prose{max-width:760px;margin:0 auto;padding:16px 0 30px}
.prose section+section{margin-top:4px}
.prose h2{font-size:22px;margin:42px 0 10px;letter-spacing:-.01em}
.prose h3{font-size:17px;margin:26px 0 6px;font-weight:650}
.prose p,.prose li{color:var(--dek);font-size:16px;line-height:1.7}
.prose p{margin:10px 0}
.prose ul,.prose ol{padding-left:20px;margin:12px 0;display:grid;gap:7px}
.prose a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.prose a:hover{color:var(--orange-2)}
.prose .btn{text-decoration:none}
.prose .small{font-size:13.5px;color:var(--muted)}
.prose .note{margin:22px 0}
.note strong{color:var(--text);font-weight:650}

/* ---- consolidated docs ---- */
.docs-shell{max-width:var(--maxw);margin:0 auto;padding:6px var(--pad) 30px;display:grid;grid-template-columns:238px minmax(0,1fr);gap:54px;align-items:start}
.docs-nav{position:sticky;top:92px;align-self:start;max-height:calc(100vh - 116px);overflow:auto}
.docs-nav .group{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin:20px 0 8px}
.docs-nav .group:first-child{margin-top:0}
.docs-nav a{display:block;color:var(--dek);font-size:14px;padding:6px 12px;border-radius:9px;border-left:2px solid transparent;transition:color .18s,background .18s}
.docs-nav a:hover{color:var(--text);background:rgba(255,255,255,.04)}
.docs-nav a.active{color:var(--text);background:var(--card);border-left-color:var(--accent)}
.docs-body{min-width:0}
.docs-body h1{font-size:clamp(30px,4vw,46px)}
.docs-body>.dek{font-size:18px;color:var(--dek);margin:14px 0 20px;max-width:64ch;line-height:1.62}
.docs-body h2{font-size:25px;margin:52px 0 12px;scroll-margin-top:92px;padding-top:14px;border-top:1px solid var(--line);letter-spacing:-.01em}
.docs-body h2:first-of-type{border-top:0}
.docs-body h3{font-size:16.5px;margin:26px 0 8px;font-weight:650}
.docs-body p,.docs-body li{color:var(--dek);font-size:15.5px;line-height:1.68;max-width:72ch}
.docs-body p{margin:10px 0}
.docs-body ul,.docs-body ol{padding-left:20px;margin:12px 0;display:grid;gap:8px}
.docs-body a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.docs-body a:hover{color:var(--orange-2)}
.docs-body code{font-family:var(--mono,ui-monospace,SFMono-Regular,Menlo,monospace);font-size:.9em;background:var(--card-2);border:1px solid var(--line);border-radius:6px;padding:2px 6px;overflow-wrap:anywhere}
.docs-body pre{background:#0b0e12;border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;overflow-x:auto;margin:16px 0}
.docs-body pre code{background:none;border:0;padding:0;color:#c7d3de;font-size:13.5px;line-height:1.6;white-space:pre}
.docs-body table{border-collapse:collapse;width:100%;margin:16px 0;font-size:14.5px;display:block;overflow-x:auto}
.docs-body th{text-align:left;color:var(--text);font-weight:600;padding:10px 12px;border-bottom:1px solid var(--line-2);white-space:nowrap}
.docs-body td{color:var(--dek);padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.docs-body td:first-child code{white-space:nowrap}
.docs-body .note{margin:20px 0}

@media(max-width:900px){
  .docs-shell{grid-template-columns:1fr;gap:8px}
  .docs-nav{position:static;max-height:none;display:flex;flex-wrap:wrap;gap:6px;padding-bottom:14px;border-bottom:1px solid var(--line);margin-bottom:12px}
  .docs-nav .group{display:none}
  .docs-nav a{border:1px solid var(--line);border-radius:999px;padding:6px 13px;border-left:1px solid var(--line)}
  .docs-nav a.active{border-color:var(--accent);border-left:1px solid var(--accent)}
}

/* Docs code surfaces — adopted from the 4789 Motion Playbook artifact: deeper
   code canvas + JetBrains-class mono + white-alpha hairlines. Docs pages only. */
.docs-body pre, .prose pre{background:#0a0c0f;border:1px solid rgba(255,255,255,.08)}
.docs-body code, .prose code{font-family:"SF Mono",ui-monospace,"JetBrains Mono",Menlo,Consolas,monospace}
.docs-body table td, .docs-body table th{border-color:rgba(255,255,255,.08)}
