.demo .hero h1{font:600 clamp(2.4rem, 1rem + 4vw, 4.5rem)/1 var(--font-sans);letter-spacing:-.045em;text-wrap:balance;margin:0 0 .6rem}.demo .hero .lead a{color:var(--signal);text-underline-offset:.25em;white-space:nowrap}.demo .hero .lead{font-size:var(--t-lead);color:var(--fg-2);max-width:46ch;margin:0 0 2.25rem}.demo.plain{width:min(100% - 2 * var(--gutter), 56rem);padding:calc(76px + clamp(2.5rem, 8vh, 6rem)) 0 var(--bay);margin-inline:auto}.demo .sr{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.demo [hidden]{display:none!important}.demo-panel{border:1px solid var(--line-strong);background:color-mix(in oklab, var(--navy-850) 70%, transparent);border-radius:20px;max-width:46rem;padding:clamp(1.25rem,.5rem + 3vw,2.25rem)}.demo-progress{grid-template-columns:1fr 1fr;gap:.75rem;margin:0 0 1.75rem;padding:0;list-style:none;display:grid}.demo-progress li{border-top:2px solid var(--line-strong);color:var(--fg-3);font-size:var(--t-small);align-items:center;gap:.6rem;padding-top:.75rem;font-weight:500;display:flex}.demo-progress li.is-current{border-top-color:var(--signal);color:var(--fg-1)}.demo-progress li.is-done{border-top-color:var(--signal);color:var(--fg-2)}.demo-progress__n{width:1.6rem;height:1.6rem;font:500 .8125rem/1 var(--font-mono);border:1px solid;border-radius:999px;place-items:center;display:grid}.demo-progress li.is-current .demo-progress__n{background:var(--signal);border-color:var(--signal);color:var(--navy-950)}.demo-progress li.is-done .demo-progress__n{background:color-mix(in oklab, var(--signal) 22%, transparent);border-color:var(--signal);color:var(--signal)}.demo-step>h2{font:600 1.5rem/1.2 var(--font-sans);letter-spacing:-.025em;margin:0 0 1.1rem}.demo-step>h2:focus{outline:none}.demo-step>h2:focus-visible{outline:2px solid var(--signal);outline-offset:6px}.demo-grid{grid-template-columns:1fr 1fr;gap:1.1rem 1.25rem;margin:0 0 1.5rem;display:grid}.demo-field{align-content:start;gap:.4rem;min-width:0;display:grid}.demo-field label{font:500 .9375rem/1.3 var(--font-sans);color:var(--fg-1)}.demo-hint{color:var(--fg-3);margin-left:.35rem;font-size:.8125rem;font-weight:400}.demo-field input{border:1px solid var(--line-strong);background:var(--navy-950);width:100%;min-height:52px;color:var(--fg-1);font:400 1rem/1.2 var(--font-sans);transition:border-color var(--d-small);border-radius:12px;padding:0 1rem}.demo-field input:hover{border-color:var(--fg-3)}.demo-field input:focus-visible{outline:2px solid var(--signal);outline-offset:2px;border-color:var(--signal)}.demo-field input[aria-invalid=true]{border-color:var(--bad)}.demo-err{color:var(--bad);margin:0;font-size:.875rem;line-height:1.35}.demo-format{border:0;min-width:0;margin:0 0 1.5rem;padding:0}.demo-format legend{font:500 .9375rem/1.3 var(--font-sans);color:var(--fg-1);margin-bottom:.6rem;padding:0}.demo-format__row{grid-template-columns:1fr 1fr;gap:.75rem;display:grid}.demo-choice{border:1px solid var(--line-strong);cursor:pointer;min-height:64px;transition:border-color var(--d-small), background var(--d-small);border-radius:12px;gap:.15rem;padding:.95rem 1rem .95rem 2.75rem;display:grid;position:relative}.demo-choice:hover{border-color:var(--fg-3)}.demo-choice:has(input:checked){border-color:var(--signal);background:color-mix(in oklab, var(--signal) 8%, transparent)}.demo-choice:has(input:focus-visible){outline:2px solid var(--signal);outline-offset:3px}.demo-choice input{width:1.05rem;height:1.05rem;accent-color:var(--signal);margin:0;position:absolute;top:1.15rem;left:1rem}.demo-choice__name{font:500 1rem/1.2 var(--font-sans)}.demo-choice__note{color:var(--fg-2);font-size:.875rem}.demo-trap{width:1px;height:1px;position:absolute;left:-9999px;overflow:hidden}.demo-go{cursor:pointer;border:0;min-height:56px;padding:0 1.75rem;font-size:1.0625rem}.demo-go:disabled{opacity:.45;cursor:not-allowed;background:var(--fg-4)}.demo .btn--ghost{cursor:pointer;border:1px solid var(--line-strong);background:0 0;min-height:56px}.demo-msg{border:1px solid var(--line-strong);font-size:var(--t-small);color:var(--fg-1);border-radius:12px;margin:0 0 1rem;padding:.85rem 1.1rem}.demo-msg a{color:var(--signal)}.demo-msg--bad{border-color:var(--warn);background:color-mix(in oklab, var(--warn) 12%, transparent)}.demo-tz{color:var(--fg-2);font-size:var(--t-small);margin:-.5rem 0 1.25rem}.demo-days{grid-template-columns:repeat(auto-fit,minmax(4.25rem,1fr));gap:.5rem;margin:0 0 1.25rem;display:grid}.demo-day{border:1px solid var(--line-strong);min-height:64px;color:var(--fg-1);font:inherit;cursor:pointer;transition:border-color var(--d-small), background var(--d-small);background:0 0;border-radius:12px;justify-items:center;gap:.15rem;padding:.5rem .25rem;display:grid}.demo-day:hover:not(:disabled){border-color:var(--fg-3)}.demo-day[aria-pressed=true]{border-color:var(--signal);background:color-mix(in oklab, var(--signal) 10%, transparent)}.demo-day:disabled{opacity:.4;cursor:not-allowed}.demo-day__dow{font:500 .75rem/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--fg-2)}.demo-day__n{font:600 1.375rem/1 var(--font-sans);letter-spacing:-.02em}.demo-slots{grid-template-columns:repeat(auto-fill,minmax(6.25rem,1fr));gap:.5rem;margin:0 0 1.25rem;display:grid}.demo-slot{border:1px solid var(--line-strong);min-height:48px;color:var(--fg-1);font:500 1rem/1 var(--font-sans);cursor:pointer;transition:border-color var(--d-small), background var(--d-small);background:0 0;border-radius:12px;padding:0 .5rem}.demo-slot:hover{border-color:var(--fg-3)}.demo-slot[aria-pressed=true]{border-color:var(--signal);background:var(--signal);color:var(--navy-950)}.demo-picked{min-height:1.5em;color:var(--fg-1);margin:0 0 1rem;font-weight:500}.demo-actions{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.demo-loading{color:var(--fg-2);font-size:var(--t-small);align-items:center;gap:.85rem;margin:0 0 1.25rem;display:flex}.demo-loading__bar{background:linear-gradient(90deg, var(--line-strong) 0 30%, var(--signal) 50%, var(--line-strong) 70% 100%) 0 0 / 300% 100%;border-radius:999px;width:4.5rem;height:6px;animation:1.4s linear infinite demo-shimmer}@keyframes demo-shimmer{to{background-position:-300% 0}}.demo-check{background:color-mix(in oklab, var(--signal) 16%, transparent);border:1px solid var(--signal);width:3.25rem;height:3.25rem;color:var(--signal);border-radius:999px;place-items:center;margin:0 0 1rem;display:grid}.demo-check svg{width:1.6rem;height:1.6rem}.demo-done{font-size:var(--t-lead);max-width:34ch;margin:0 0 .5rem;line-height:1.35}.demo-done--quiet{color:var(--fg-2);font-size:1.0625rem}.demo-alt{color:var(--fg-2);font-size:var(--t-small);max-width:46rem;margin:1.5rem 0 0}.demo-alt a{color:var(--signal);align-items:center;min-height:44px;display:inline-flex}@media (width<=560px){.demo-grid,.demo-format__row{grid-template-columns:1fr}.demo-actions .btn{flex:auto;justify-content:center}.demo-go{justify-content:center;width:100%}.demo-actions .demo-go{width:auto}}
