:root{color-scheme:light dark;--surface:#f7f5f0;--surface-raised:#ffffff;--surface-sunken:#eeebe4;--line:#e1ddd4;--line-strong:#858075;--ink:#171b2b;--ink-muted:#5f6578;--ink-faint:#858a9b;--lumen:#f2a93b;--on-lumen:#1a1400;--lumen-text:#8f5300;--lumen-soft:#fbeccf;--lumen-glow:#f2a93b59;--success:#276b44;--success-soft:#ddf3e6;--warning:#a34d0b;--warning-soft:#fde6d3;--danger:#b42323;--danger-soft:#fbe1e1;--info:#2453c4;--info-soft:#e0e8fb;--waveform:#171b2b;--waveform-played:var(--lumen);--scrim:#171b2b73;--focus-ring:var(--lumen-text);--user-bubble:#ffffff;--ai-bubble:var(--lumen-soft);--toast-surface:var(--ink);--toast-ink:var(--surface);--toast-action:#f2a93b;--shadow-card:0 1px 2px #171b2b0f, 0 8px 24px #171b2b0f;--shadow-sheet:0 -8px 32px #171b2b1f;--shadow-glow:0 0 0 8px #f2a93b40, 0 0 32px #f2a93b66}
@media (prefers-color-scheme: dark){:root{--surface:#0c1120;--surface-raised:#151c2e;--surface-sunken:#080c17;--line:#26304a;--line-strong:#5b6786;--ink:#f1efe9;--ink-muted:#a9b0c4;--ink-faint:#6e7790;--lumen:#f7b955;--on-lumen:#1a1400;--lumen-text:#f7b955;--lumen-soft:#2a2010;--lumen-glow:#f7b9554d;--success:#5fd39a;--success-soft:#12301f;--warning:#ffb27a;--warning-soft:#3b2110;--danger:#ff7a7a;--danger-soft:#3a1414;--info:#7ea6ff;--info-soft:#14213d;--waveform:#f1efe9;--waveform-played:var(--lumen);--scrim:#00000099;--focus-ring:var(--lumen-text);--user-bubble:#1b2438;--ai-bubble:var(--lumen-soft);--toast-surface:var(--ink);--toast-ink:var(--surface);--toast-action:#8f5300;--shadow-card:0 1px 2px #00000066, 0 8px 24px #00000080;--shadow-sheet:0 -8px 32px #000000a6;--shadow-glow:0 0 0 8px #f7b95538, 0 0 32px #f7b9555c}}
:root{--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--radius-xs:6px;--radius-sm:10px;--radius-md:14px;--radius-lg:20px;--radius-xl:28px;--radius-pill:999px;--size-touch:44px;--size-record:88px;--size-record-sm:56px;--size-record-lg:112px;--size-icon:24px;--size-icon-sm:18px;--size-orb:64px;--size-sidebar:320px;--size-sidebar-wide:400px;--size-reading:680px;--size-sheet:540px;--opacity-disabled:0.4;--opacity-pressed:0.72;--font-display:"Unbounded", "Onest", system-ui, sans-serif;--font-sans:"Onest", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-mono:"JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;--display-xl-size:2.5rem;--display-xl-line:2.75rem;--display-xl-weight:600;--display-xl-tracking:-0.02em;--display-size:1.75rem;--display-line:2.125rem;--display-weight:600;--display-tracking:-0.015em;--display-sm-size:1.5rem;--display-sm-line:1.875rem;--display-sm-weight:600;--display-sm-tracking:-0.01em;--title-size:1.375rem;--title-line:1.75rem;--title-weight:600;--title-tracking:-0.01em;--heading-size:1.0625rem;--heading-line:1.5rem;--heading-weight:600;--heading-tracking:normal;--body-size:1rem;--body-line:1.5rem;--body-weight:400;--body-tracking:normal;--body-strong-size:1rem;--body-strong-line:1.5rem;--body-strong-weight:600;--body-strong-tracking:normal;--callout-size:0.9375rem;--callout-line:1.375rem;--callout-weight:500;--callout-tracking:normal;--caption-size:0.8125rem;--caption-line:1.125rem;--caption-weight:500;--caption-tracking:normal;--label-size:0.6875rem;--label-line:0.875rem;--label-weight:600;--label-tracking:0.06em;--timer-size:2.75rem;--timer-line:3rem;--timer-weight:500;--timer-tracking:-0.01em;--timer-xl-size:4.5rem;--timer-xl-line:5rem;--timer-xl-weight:500;--timer-xl-tracking:-0.01em;--timestamp-size:0.75rem;--timestamp-line:1rem;--timestamp-weight:500;--timestamp-tracking:normal;--key-size:0.875rem;--key-line:1.25rem;--key-weight:400;--key-tracking:normal}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--surface);color:var(--ink);font-family:var(--font-sans);font-size:var(--body-size);line-height:var(--body-line);font-weight:var(--body-weight);overflow-wrap:break-word}
img{max-width:100%;height:auto}
a{color:var(--lumen-text);text-underline-offset:0.15em}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
.wrap{max-width:var(--size-reading);margin-inline:auto;padding-inline:var(--space-4)}
.vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.skip{position:absolute;left:var(--space-4);top:var(--space-2);transform:translateY(-200%);background:var(--surface-raised);color:var(--ink);padding:var(--space-2) var(--space-4);border-radius:var(--radius-md);z-index:1}
.skip:focus{transform:none}
.top{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding-block:var(--space-3)}
.brand{display:inline-flex;align-items:center;gap:var(--space-2);min-height:var(--size-touch);color:var(--ink);text-decoration:none;font-family:var(--font-display);font-weight:var(--display-sm-weight);font-size:var(--display-sm-size);letter-spacing:var(--display-sm-tracking)}
.brand img{width:32px;height:32px;border-radius:var(--radius-sm)}
.pill{display:inline-flex;align-items:center;min-height:var(--size-touch);padding-inline:var(--space-4);border:1px solid var(--line-strong);border-radius:var(--radius-pill);color:var(--ink);text-decoration:none;font-size:var(--callout-size);font-weight:var(--callout-weight)}
main{padding-block:var(--space-6) var(--space-12)}
h1{font-family:var(--font-display);font-weight:var(--display-weight);font-size:var(--display-size);line-height:var(--display-line);letter-spacing:var(--display-tracking);margin:0 0 var(--space-4)}
h2{font-size:var(--title-size);line-height:var(--title-line);font-weight:var(--title-weight);letter-spacing:var(--title-tracking);margin:var(--space-8) 0 var(--space-3)}
h3{font-size:var(--heading-size);line-height:var(--heading-line);font-weight:var(--heading-weight);margin:var(--space-6) 0 var(--space-2)}
p,ul,ol,table{margin:0 0 var(--space-4)}
ul{padding-inline-start:var(--space-6)}
li+li{margin-top:var(--space-2)}
code{font-family:var(--font-mono);font-size:var(--key-size);background:var(--surface-sunken);border-radius:var(--radius-xs);padding:0 var(--space-1)}
.lead{font-size:var(--title-size);line-height:var(--title-line);margin-bottom:var(--space-6)}
.muted{color:var(--ink-muted)}
.hero{padding-top:var(--space-4)}
.hero .icon{width:var(--size-orb);height:var(--size-orb);border-radius:var(--radius-md);display:block;margin-bottom:var(--space-6)}
.badge{display:inline-block;background:var(--lumen-soft);color:var(--ink);border-radius:var(--radius-md);padding:var(--space-1) var(--space-3);font-size:var(--callout-size);line-height:var(--callout-line);font-weight:var(--callout-weight)}
.cards{display:grid;gap:var(--space-4);grid-template-columns:1fr;padding:0;list-style:none}
.cards>li+li{margin-top:0}
.card{background:var(--surface-raised);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);padding:var(--space-4) var(--space-5)}
.card h3{margin-top:0}
.card p{margin:0}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:var(--size-touch);padding:var(--space-2) var(--space-6);border:0;border-radius:var(--radius-md);background:var(--lumen);color:var(--on-lumen);font:inherit;font-size:var(--callout-size);font-weight:var(--callout-weight);text-decoration:none;cursor:pointer}
.button:active{opacity:var(--opacity-pressed)}
details{border-top:1px solid var(--line)}
details:last-of-type{border-bottom:1px solid var(--line)}
summary{display:list-item;cursor:pointer;min-height:var(--size-touch);padding-block:var(--space-3);font-size:var(--heading-size);line-height:var(--heading-line);font-weight:var(--heading-weight)}
summary::marker{color:var(--lumen-text)}
details>p{margin-top:0}
.notice{border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);margin-bottom:var(--space-6);border:1px solid}
.notice>:last-child{margin-bottom:0}
.notice h2{margin:0 0 var(--space-2);font-size:var(--heading-size);line-height:var(--heading-line)}
.notice.danger{background:var(--danger-soft);border-color:var(--danger)}
.notice.warning{background:var(--warning-soft);border-color:var(--warning)}
.notice.success{background:var(--success-soft);border-color:var(--success)}
.field{display:grid;gap:var(--space-1);margin-bottom:var(--space-5)}
label{font-size:var(--callout-size);line-height:var(--callout-line);font-weight:var(--heading-weight)}
.hint{font-size:var(--caption-size);line-height:var(--caption-line);color:var(--ink-muted);margin:0}
.error{font-size:var(--callout-size);line-height:var(--callout-line);font-weight:var(--callout-weight);color:var(--danger);margin:0}
input,select,textarea{font:inherit;color:var(--ink);background:var(--surface-sunken);border:1px solid var(--line-strong);border-radius:var(--radius-sm);min-height:var(--size-touch);padding:var(--space-2) var(--space-3);width:100%}
textarea{min-height:calc(var(--size-touch) * 4);resize:vertical}
[aria-invalid="true"]{border:2px solid var(--danger)}
.hp{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.doc h2{font-size:var(--heading-size);line-height:var(--heading-line)}
.doc table{width:100%;border-collapse:collapse;font-size:var(--caption-size);line-height:var(--caption-line)}
.doc th,.doc td{text-align:start;vertical-align:top;padding:var(--space-2);border-bottom:1px solid var(--line);overflow-wrap:anywhere}
.doc th{font-weight:var(--heading-weight);border-bottom-color:var(--line-strong)}
.doc blockquote{margin:0 0 var(--space-4);padding-inline-start:var(--space-4);border-inline-start:4px solid var(--line-strong)}
mark.placeholder{background:var(--warning-soft);color:var(--ink);border:1px dashed var(--warning);border-radius:var(--radius-xs);padding:0 var(--space-1)}
.foot{border-top:1px solid var(--line);padding-block:var(--space-6) var(--space-8)}
.foot ul{display:flex;flex-wrap:wrap;gap:0 var(--space-4);list-style:none;padding:0;margin:0 0 var(--space-2)}
.foot li+li{margin-top:0}
.foot a{display:inline-flex;align-items:center;min-height:var(--size-touch)}
.foot p{font-size:var(--caption-size);line-height:var(--caption-line);color:var(--ink-muted);margin:0}
@media (min-width:600px){
.wrap{padding-inline:var(--space-6)}
.hero h1{font-size:var(--display-xl-size);line-height:var(--display-xl-line);letter-spacing:var(--display-xl-tracking)}
.cards{grid-template-columns:1fr 1fr}
}
