.studio{min-height:100dvh}.studio__wrap{width:min(100% - 2 * var(--gutter), 560px);margin-inline:auto}.studio__bar{border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top)}.studio__wrap--wide{width:min(100% - 2 * var(--gutter), 1120px)}.studio__bar .studio__wrap{min-height:var(--header-h);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem 1.5rem;display:flex}.studio__nav{align-items:center;gap:1.5rem;font-size:.9375rem;display:flex}.studio__nav a{color:var(--ink-2);min-height:44px;transition:color var(--dur) var(--ease-out);align-items:center;text-decoration:none;display:inline-flex}.studio__nav a:hover,.studio__nav a[aria-current=page]{color:var(--ink)}.studio__nav a[aria-current=page]{box-shadow:inset 0 -2px 0 var(--accent)}.studio main:focus{outline:none}.skip{z-index:100;background:var(--accent);color:#fff5f5;border-radius:var(--radius);padding:.6rem 1rem;text-decoration:none;position:absolute;top:-100px;left:1rem}.skip:focus{top:1rem}.studio__brand{letter-spacing:-.01em;align-items:center;gap:.6rem;font-weight:500;display:inline-flex}.studio__main{padding-block:clamp(2.5rem, 8vw, 5rem) calc(4rem + env(safe-area-inset-bottom));gap:2.5rem;display:grid}.studio h1{font-size:clamp(2rem,5vw,2.75rem)}.studio h2{letter-spacing:-.015em;font-size:clamp(1.25rem,2.4vw,1.5rem)}.panel{border-top:1px solid var(--line);gap:1.25rem;padding-top:2rem;display:grid}.panel--first{border-top:0;padding-top:0}.panel[hidden],.studio [hidden]{display:none}.form{gap:1.25rem;display:grid}.field{gap:.4rem;display:grid}.field label{font-size:.9375rem;font-weight:500}.field__hint{color:var(--ink-3);font-size:.875rem}.field input{border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--bg-raise);width:100%;min-height:46px;color:var(--ink);font:inherit;transition:border-color var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out);padding:0 .875rem}.field input:hover{border-color:var(--accent-soft)}.field input:focus-visible{border-color:var(--focus);box-shadow:0 0 0 1px var(--focus), 0 0 0 4px #ffb3b82e;outline:none}.field input[aria-invalid=true]{border-color:var(--accent-bright)}.field input.is-code{font-family:var(--font-mono);letter-spacing:.2em;font-size:1.25rem}.field__error,.form__error{color:var(--accent-soft);font-size:.9375rem}.field__error:before,.form__error:before{content:"! ";font-family:var(--font-mono)}.form__actions{flex-wrap:wrap;align-items:center;gap:1rem 1.5rem;display:flex}.btn[aria-busy=true]{cursor:progress;opacity:.8}.btn:disabled{cursor:progress}.linkbtn{min-height:44px;color:var(--ink-2);font:inherit;text-decoration:underline;-webkit-text-decoration-color:var(--line-strong);text-decoration-color:var(--line-strong);text-underline-offset:.18em;cursor:pointer;transition:color var(--dur) var(--ease-out), text-decoration-color var(--dur) var(--ease-out);background:0 0;border:0;padding:0;font-size:.9375rem}.linkbtn:hover{color:var(--ink);-webkit-text-decoration-color:var(--accent-soft);text-decoration-color:var(--accent-soft)}.notice{border:1px solid var(--line-strong);border-left:3px solid var(--accent-soft);border-radius:var(--radius);background:var(--bg-raise);color:var(--ink);padding:.875rem 1rem}.expander{transition:grid-template-rows var(--dur) var(--ease-out);grid-template-rows:0fr;display:grid}.expander[data-open]{grid-template-rows:1fr}.expander>*{min-height:0;overflow:hidden}.switchrow{justify-content:space-between;align-items:flex-start;gap:1.5rem;display:flex}.switchrow__label{font-weight:500}.switch{min-height:44px;color:var(--ink);font:inherit;cursor:pointer;background:0 0;border:0;flex:none;align-items:center;gap:.6rem;padding:0 .25rem;font-size:.9375rem;display:inline-flex}.switch__track{background:var(--bg-raise);border:1px solid var(--line-strong);width:44px;height:24px;transition:background-color var(--dur) var(--ease-out), border-color var(--dur) var(--ease-out);border-radius:12px;position:relative}.switch__track:after{content:"";background:var(--ink-2);width:16px;height:16px;transition:transform var(--dur) var(--ease-out), background-color var(--dur) var(--ease-out);border-radius:50%;position:absolute;top:3px;left:3px}.switch[aria-checked=true] .switch__track{background:var(--accent-deep);border-color:var(--accent)}.switch[aria-checked=true] .switch__track:after{background:var(--ink);transform:translate(20px)}.switch:hover:not(:disabled) .switch__track{border-color:var(--accent-soft)}.switch:disabled{cursor:not-allowed;opacity:.55}.dialog{border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--bg-raise);width:min(100% - 2rem,30rem);color:var(--ink);opacity:0;transition:opacity var(--dur) var(--ease-out), transform var(--dur) var(--ease-out), overlay var(--dur) allow-discrete, display var(--dur) allow-discrete;padding:1.5rem;transform:translateY(8px);box-shadow:0 24px 60px #0000008c,0 2px 8px #00000059}.dialog[open]{opacity:1;gap:1rem;display:grid;transform:none}@starting-style{.dialog[open]{opacity:0;transform:translateY(8px)}}.dialog::backdrop{transition:background-color var(--dur) var(--ease-out), overlay var(--dur) allow-discrete, display var(--dur) allow-discrete;background:#07050600}.dialog[open]::backdrop{background:#070506b8}@starting-style{.dialog[open]::backdrop{background:#07050600}}.dialog h2{font-size:1.25rem}.dialog__title{overflow-wrap:anywhere;font-weight:500}.prose{gap:1rem;line-height:1.7;display:grid}.prose>*{margin:0}.prose h1{font-size:clamp(1.75rem,3vw,2.25rem)}.prose h2{margin-top:1rem;font-size:1.375rem}.prose h3{margin-top:.5rem;font-size:1.125rem}.prose ul,.prose ol{gap:.35rem;padding-left:1.25rem;display:grid}.prose blockquote{border-left:2px solid var(--accent);color:var(--ink-2);padding-left:1rem}.prose code{font-family:var(--font-mono);background:var(--bg-raise);border-radius:var(--radius);padding:.1em .35em;font-size:.875em}.prose pre{background:var(--bg-raise);border-radius:var(--radius);padding:1rem;overflow-x:auto}.prose pre code{background:0 0;padding:0}.prose .prose__excerpt{color:var(--ink-2);font-size:1.0625rem}.prose .prose__tldr{border:1px solid var(--line-strong);border-left:3px solid var(--accent);border-radius:var(--radius);background:var(--bg-raise);padding:1rem 1.25rem}.prose .prose__tldr>*{margin:0}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;position:absolute!important}