:root{--bg:#f1f0ee;--stage:#e9e7e4;--surface:#fff;--line:#dedad6;--fg:#1b1917;--muted:#6b655f;--accent:#ff6b1a;--accent-ink:#b93c0a;--accent-soft:#ffeadf;--ring:#e9581c;--ring-track:#1b19171f;--shadow:0 1px 2px #1b19171a;--card-shadow:0 10px 30px #1b19171f;--on-accent:#1b1917;--font-display:"Noto Sans",system-ui,-apple-system,"Segoe UI",sans-serif;--font-body:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;--font-mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#131211;--stage:#1a1918;--surface:#1e1d1b;--line:#312e2b;--fg:#f2efeb;--muted:#a59e97;--accent:#ff7a2e;--accent-ink:#ff9b5e;--accent-soft:#3a2114;--ring:#ff8a45;--ring-track:#f2efeb24;--shadow:0 1px 2px #00000080;--card-shadow:0 10px 30px #00000080;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=dark]{--bg:#131211;--stage:#1a1918;--surface:#1e1d1b;--line:#312e2b;--fg:#f2efeb;--muted:#a59e97;--accent:#ff7a2e;--accent-ink:#ff9b5e;--accent-soft:#3a2114;--ring:#ff8a45;--ring-track:#f2efeb24;--shadow:0 1px 2px #00000080;--card-shadow:0 10px 30px #00000080;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}body{background:var(--bg);color:var(--fg);font:15px/1.55 var(--font-body);-webkit-font-smoothing:antialiased}.page{gap:32px;max-width:1180px;margin:0 auto;padding-block:28px 64px;padding-inline:20px;display:grid}.top{gap:6px;display:grid}.eyebrow{font:500 11px/1.2 var(--font-mono);letter-spacing:.09em;text-transform:uppercase;color:var(--accent-ink);margin:0}.top h1{font:600 clamp(28px,4.2vw,40px)/1.1 var(--font-display);letter-spacing:-.015em;text-wrap:balance;margin:0}.lede{color:var(--muted);max-width:64ch;margin:0}.bench{grid-template-columns:minmax(0,1fr) 344px;align-items:start;gap:24px;display:grid}@media (width<=900px){.bench{grid-template-columns:minmax(0,1fr)}}.stage-col{gap:18px;min-width:0;display:grid}.stage{aspect-ratio:1;background:var(--stage);border-radius:28px;width:100%;max-width:640px;margin-inline:auto;position:relative;overflow:hidden}.switch{cursor:pointer;align-items:center;gap:8px;font-size:13px;display:flex}.gesture-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;display:grid}.gesture-grid .btn{text-align:center;padding:8px 6px;font-size:12px}.card-slot{z-index:2;width:min(82%,330px);transition:bottom .6s cubic-bezier(.3,1.25,.5,1),transform .6s cubic-bezier(.3,1.25,.5,1);position:absolute;bottom:6%;left:50%;transform:translate(-50%)}.card-slot.is-centered{bottom:50%;transform:translate(-50%,50%)}.ui-card{background:var(--surface);border:1px solid var(--line);box-shadow:var(--card-shadow);transform-origin:50%;border-radius:16px;gap:3px;padding:14px 16px;display:grid}.ui-eyebrow{font:500 10.5px/1.3 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--accent-ink);margin:0}.ui-title{font:600 15px/1.3 var(--font-display);text-wrap:balance;margin:0}.ui-meta{color:var(--muted);font-variant-numeric:tabular-nums;margin:0;font-size:13px}.ui-actions{flex-wrap:wrap;justify-content:flex-end;gap:6px;margin-top:8px;display:flex}.btn.ui-primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent);transition:box-shadow .25s}.btn.ui-primary:hover:not(:disabled){border-color:var(--accent);filter:brightness(1.05)}.btn.ui-primary.is-pointed{box-shadow:0 0 0 3px var(--surface),0 0 0 5px var(--accent)}.vocab{gap:4px;display:grid}.vocab h2{font:600 19px/1.25 var(--font-display);margin:0 0 8px}.switch input{width:16px;height:16px;accent-color:var(--accent);margin:0}.caption{align-content:start;gap:4px;width:100%;max-width:640px;min-height:96px;margin-inline:auto;display:grid}.caption-head{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:12px;display:flex}.caption h2{font:600 21px/1.2 var(--font-display);margin:0}.caption p{color:var(--muted);max-width:60ch;margin:0}.mono{font-family:var(--font-mono);letter-spacing:.02em;font-variant-numeric:tabular-nums;font-size:12px}.step{color:var(--accent-ink)}.note{color:var(--muted);margin:0;font-size:13px}.note.warn{color:var(--accent-ink)}.panel{background:var(--surface);border:1px solid var(--line);border-radius:20px;gap:24px;min-width:0;padding:20px;display:grid}.group{gap:10px;min-width:0;display:grid}.group-head{justify-content:space-between;align-items:center;gap:8px;min-height:28px;display:flex}.group h3{font:500 11px/1 var(--font-mono);letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin:0}.hint{color:var(--muted);font-size:12px}.btn{appearance:none;font:500 13px/1.2 var(--font-body);color:var(--fg);background:var(--surface);border:1px solid var(--line);cursor:pointer;border-radius:10px;padding:9px 12px;transition:border-color .15s,background .15s}.btn:hover:not(:disabled){border-color:var(--muted)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--fg);border-color:var(--fg);color:var(--bg)}.btn-primary:hover:not(:disabled){border-color:var(--fg);opacity:.9}.btn-small{padding:6px 10px;font-size:12px}.row{flex-wrap:wrap;gap:6px;display:flex}.row .btn{flex:auto}.state-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;display:grid}.state-btn{text-align:left;justify-content:space-between;align-items:center;gap:6px;display:flex}.state-btn kbd{font:500 10px/1 var(--font-mono);color:var(--muted)}.state-btn[aria-pressed=true]{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-ink)}.state-btn[aria-pressed=true] kbd{color:var(--accent-ink)}.seg{border:1px solid var(--line);background:var(--bg);border-radius:11px;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;padding:3px;display:grid}.seg button{appearance:none;color:var(--muted);font:500 12.5px/1.2 var(--font-body);cursor:pointer;background:0 0;border:0;border-radius:8px;padding:8px 6px}.seg button[aria-checked=true]{background:var(--surface);color:var(--fg);box-shadow:var(--shadow)}.linkish{appearance:none;font:inherit;color:var(--accent-ink);text-underline-offset:2px;cursor:pointer;background:0 0;border:0;padding:0;text-decoration:underline}.meters{gap:9px;display:grid}.meter{grid-template-columns:76px minmax(0,1fr) 46px;align-items:center;gap:10px;font-size:13px;display:grid}.bar{background:var(--line);border-radius:3px;height:6px;overflow:hidden}.bar i{background:var(--accent);border-radius:inherit;width:0;height:100%;display:block}.meter output{text-align:right;color:var(--muted)}.sliders{gap:12px;display:grid}.slider{gap:4px;display:grid}.slider-head{justify-content:space-between;align-items:baseline;font-size:13px;display:flex}.slider-head output{color:var(--muted)}input[type=range]{width:100%;accent-color:var(--accent);margin:0}textarea{width:100%;min-height:120px;font:12px/1.5 var(--font-mono);color:var(--fg);background:var(--bg);border:1px solid var(--line);resize:vertical;border-radius:10px;padding:10px}.spec{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:28px;display:grid}@media (width<=900px){.spec{grid-template-columns:minmax(0,1fr)}}.spec h2{font:600 19px/1.25 var(--font-display);margin:0 0 12px}.spec-intro{color:var(--muted);max-width:60ch;margin:0 0 14px;font-size:14px}.table-wrap{border:1px solid var(--line);background:var(--surface);border-radius:14px;overflow-x:auto}table{border-collapse:collapse;width:100%;min-width:560px;font-size:13.5px}th,td{text-align:left;vertical-align:top;border-bottom:1px solid var(--line);padding:10px 14px}tr:last-child td{border-bottom:0}th{font:500 11px/1.3 var(--font-mono);letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}td:first-child{white-space:nowrap;font-weight:600}dl{gap:12px;margin:0;display:grid}dl div{border-bottom:1px solid var(--line);gap:2px;padding-bottom:12px;display:grid}dl div:last-child{border-bottom:0}dt{font-size:14px;font-weight:600}dd{color:var(--muted);margin:0;font-size:13.5px}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}noui-orb{width:100%;height:100%;position:absolute;inset:0}.stage{touch-action:manipulation}.card-slot{pointer-events:none}.card-slot .ui-card{pointer-events:auto}.guide h2{font:600 19px/1.25 var(--font-display);margin:0 0 8px}.guide code,.top code{font:12.5px var(--font-mono);background:var(--stage);border-radius:5px;padding:1px 5px}.steps{gap:26px;max-width:760px;margin:0;padding:0;list-style:none;display:grid}.steps li{gap:8px;min-width:0;display:grid}.steps h3{font:600 16px/1.3 var(--font-display);margin:0}.steps p{color:var(--muted);max-width:64ch;margin:0;font-size:14px}.code{gap:6px;min-width:0;display:grid}.code pre{font-variant-ligatures:none;background:var(--surface);border:1px solid var(--line);font:12.5px/1.6 var(--font-mono);color:var(--fg);tab-size:2;border-radius:12px;margin:0;padding:14px 16px;overflow-x:auto}.code pre code{font:inherit;font-variant-ligatures:none;font-feature-settings:"liga" 0,"calt" 0;background:0 0;padding:0}.copy{font:500 11px/1 var(--font-body);border:1px solid var(--line);background:var(--bg);color:var(--fg);cursor:pointer;border-radius:7px;order:-1;justify-self:end;padding:6px 10px}.copy:hover{border-color:var(--muted)}.top-links{color:var(--muted);margin:4px 0 0;font-size:14px}.top-links a,.guide a{color:var(--accent-ink)}