/* Loom v1 tokens (design/design_handoff_loom_v1/loom_tokens.css, Madder): sRGB first, oklch where supported. */
:root{--bg:#FBF9F5;--card:#FFFFFF;--ink:#1C1714;--muted:#605954;--line:rgba(60,40,30,.09);--accent:#BD3C22;--accent-text:#852917;--accent-ink:#FFFFFF;--draft:#FBF0E8;
--font:"Geist",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--mono:"Geist Mono",ui-monospace,"SF Mono",Menlo,monospace}
@supports (color:oklch(0 0 0)){:root{--bg:oklch(0.982 0.005 80);--ink:oklch(0.21 0.01 60);--muted:oklch(0.47 0.012 60);--line:oklch(0.3 0.03 50 / .09);--accent:oklch(0.54 0.17 33);--accent-text:oklch(0.42 0.13 33)}}
@media (prefers-color-scheme:dark){
:root{--bg:#120E0C;--card:#1C1715;--ink:#EEEAE5;--muted:#ADA7A0;--line:rgba(255,245,230,.08);--accent:#EB7955;--accent-text:#FAA685;--accent-ink:#15100E;--draft:#2A1F19}
@supports (color:oklch(0 0 0)){:root{--bg:oklch(0.17 0.008 50);--card:oklch(0.21 0.009 50);--ink:oklch(0.94 0.008 75);--muted:oklch(0.73 0.012 70);--line:oklch(1 0.02 70 / .08);--accent:oklch(0.7 0.15 38);--accent-text:oklch(0.8 0.11 42);--accent-ink:oklch(0.18 0.01 50)}}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.6 var(--font)}
h1,h2,h3,.brand{font-family:var(--font);font-weight:600;line-height:1.2}
h1{letter-spacing:-0.025em}h2{letter-spacing:-0.015em}
h1{font-size:clamp(2rem,6vw,3.2rem);margin:.2em 0}
a{color:var(--accent-text)}
.wrap{max-width:860px;margin:0 auto;padding:0 16px}
header{border-bottom:1px solid var(--line)}
nav{display:flex;align-items:center;gap:20px;padding:16px 0;flex-wrap:wrap}
nav .brand{font-weight:700;font-size:1.2rem;color:var(--ink);text-decoration:none;margin-right:auto}
nav a{text-decoration:none;color:var(--muted)}
main{padding:40px 0 64px}
.lede{font-size:1.25rem;color:var(--muted);max-width:40em}
.btn{display:inline-block;background:var(--accent);color:var(--accent-ink);padding:12px 22px;border-radius:8px;text-decoration:none;font-weight:600;border:0;font-size:1rem}
.btn[aria-disabled=true]{opacity:.55;cursor:not-allowed}
.small{font-size:.9rem;color:var(--muted)}
.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));margin:24px 0}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:20px}
.card h3{margin:0 0 6px}
.price{font-size:2rem;font-weight:600;letter-spacing:-0.03em;font-variant-numeric:tabular-nums}
.draft{background:var(--draft);border:1px solid var(--line);border-radius:12px;padding:12px 16px;margin-bottom:24px}
footer{border-top:1px solid var(--line);padding:24px 0;color:var(--muted);font-size:.9rem}
footer a{color:var(--muted);margin-right:16px}
nav a[aria-current]{color:var(--ink);font-weight:600}
.docs{display:grid;gap:32px;grid-template-columns:200px 1fr}
.docs aside a{display:block;padding:4px 0;color:var(--muted);text-decoration:none}
.docs aside a:hover{color:var(--ink)}
@media (max-width:720px){.docs{grid-template-columns:1fr}.docs aside{border-bottom:1px solid var(--line);padding-bottom:12px}}
.note{border-left:3px solid var(--accent);padding:4px 14px;margin:16px 0;color:var(--muted)}
.msg{font-weight:600}
dt{font-weight:600;margin-top:18px}dd{margin:4px 0 0 0}
figure{margin:24px 0}figure img{max-width:100%;border-radius:12px;border:1px solid var(--line)}figcaption{font-size:.9rem;color:var(--muted)}
kbd{font-family:var(--mono);background:var(--card);border:1px solid var(--line);border-radius:6px;padding:0 6px}
table{border-collapse:collapse;width:100%;margin:12px 0}th,td{text-align:left;padding:8px;border-bottom:1px solid var(--line)}a.card{color:inherit;text-decoration:none}a.card:hover{border-color:var(--accent)}
section.widget{border-top:1px solid var(--line);padding:8px 0 4px}section.widget h3{margin:16px 0 8px}
section.widget img{max-width:min(100%,564px)}
.brand img{vertical-align:-3px;border-radius:5px;margin-right:4px}