:root{--ink:#f3ece0;--ink-dim:#f3ece09e;--ink-faint:#f3ece059;--gold:#ffd27a;--glass:#0e101c9e;--glass-border:#ffe6be1f;--serif:"Cormorant Garamond", "Times New Roman", serif;--sans:"Inter", system-ui, -apple-system, "Segoe UI", sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{height:100%;color:var(--ink);font:14px/1.5 var(--sans);background:#04050a;margin:0;overflow:hidden}#stage{width:100vw;height:100vh;display:block;position:fixed;inset:0}.hud-top{pointer-events:none;z-index:5;justify-content:space-between;align-items:center;padding:18px 24px;display:flex;position:fixed;top:0;left:0;right:0}.style-badge{pointer-events:auto;border:1px solid var(--glass-border);color:var(--ink);cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0a0c1673;border-radius:999px;align-items:center;gap:12px;padding:6px 16px 6px 18px;transition:border-color .3s;display:flex}.style-badge:hover{border-color:var(--style,var(--gold))}.style-name{font:italic 600 21px/1 var(--serif);color:var(--style,var(--gold))}.style-dots{gap:5px;display:flex}.style-dots i{background:#fff3;border-radius:50%;width:6px;height:6px;transition:background .3s,transform .3s}.style-dots i.on{background:var(--style,var(--gold));transform:scale(1.3)}.hud-actions{pointer-events:auto;gap:6px;display:flex}.hud-left{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.mode-tabs{pointer-events:auto;border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0a0c1673;border-radius:999px;padding:3px;display:flex}.mode-tabs[hidden]{display:none}.mode-tabs button{color:var(--ink-dim);font:500 13px var(--sans);cursor:pointer;background:0 0;border:0;border-radius:999px;padding:7px 14px;transition:background .2s,color .2s}.mode-tabs button:hover{color:var(--ink)}.mode-tabs button.on{background:var(--gold);color:#1c1406}.mode-tabs button:disabled{cursor:progress}.style-badge[hidden]{display:none}.icon-btn{width:40px;height:40px;color:var(--ink-dim);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:50%;place-items:center;transition:background .2s,color .2s,border-color .2s;display:grid}.icon-btn[hidden]{display:none}.icon-btn:hover{border-color:var(--glass-border);color:var(--ink);background:#ffffff0f}.icon-btn svg{fill:none;stroke:currentColor;stroke-width:1.6px;stroke-linecap:round;stroke-linejoin:round;width:20px;height:20px}.icon-btn.paused{color:var(--gold)}.toast{font:italic 500 clamp(26px, 3.6vw, 46px)/1.1 var(--serif);color:var(--ink);text-shadow:0 0 30px #ffd27a73;opacity:0;pointer-events:none;text-align:center;white-space:nowrap;z-index:4;transition:opacity .5s,transform .5s;position:fixed;top:54vh;left:50%;transform:translate(-50%,8px)}.toast.show{opacity:1;transform:translate(-50%)}.toast small{font:400 15px/1.3 var(--sans);letter-spacing:.3px;color:var(--ink-dim);text-shadow:none;margin-top:8px;display:block}.hint{text-align:center;max-width:min(92vw,640px);font:400 15px/1.4 var(--sans);color:var(--ink-dim);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);pointer-events:none;z-index:4;background:#0a0c1673;border-radius:999px;padding:8px 18px;transition:opacity .4s;position:fixed;bottom:118px;left:50%;transform:translate(-50%)}.hint:empty{opacity:0}.hint b{color:var(--ink);font-weight:600}.status{color:var(--ink-faint);z-index:4;max-width:40vw;font-size:12px;position:fixed;bottom:20px;left:24px}.status.error{color:#ff8f7a}kbd{font:500 11px var(--sans);border:1px solid var(--glass-border);background:#ffffff0d;border-radius:5px;margin:0 1px;padding:1px 6px}.intro{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:10;background:radial-gradient(at 50% 0,#ffd27a1f,#0000 60%),#04050ac7;place-items:center;padding:24px 16px;transition:opacity .7s,visibility .7s;display:grid;position:fixed;inset:0;overflow-y:auto}.intro.hidden{opacity:0;visibility:hidden}.intro-inner{text-align:center;max-width:1040px}.intro-note{color:var(--ink-dim);margin:22px 0 0;font-size:14px}.intro-note b{color:var(--ink)}.kicker{font:500 12px var(--sans);letter-spacing:3px;text-transform:uppercase;color:var(--gold);margin:0 0 10px}.intro h1{font:500 clamp(48px, 8vw, 96px)/.95 var(--serif);letter-spacing:-1px;margin:0}.intro h1 em{color:var(--gold);font-weight:500}.lead{font:400 clamp(22px, 2.4vw, 30px)/1.4 var(--serif);color:var(--ink);max-width:720px;margin:0 auto 36px}.mode-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:720px;margin:0 auto 28px;display:grid}.mode-card{color:var(--ink);background:var(--glass);border:1px solid var(--glass-border);cursor:pointer;border-radius:16px;justify-items:center;gap:3px;padding:14px 10px;transition:border-color .2s,background .2s;display:grid}.mode-card:hover{border-color:#ffd27a73}.mode-card.on{border-color:var(--gold);background:#ffd27a1f}.mode-card span{font-size:28px;line-height:1.2}.mode-card b{font:600 22px/1.1 var(--serif)}.mode-card small{color:var(--ink-dim);font-size:12px}@media (width<=560px){.mode-card small{display:none}}.intro [hidden]{display:none}.gestures{text-align:left;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;display:grid}@media (width<=1000px){.gestures{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=760px){.gestures{grid-template-columns:1fr}}.gesture{background:var(--glass);border:1px solid var(--glass-border);border-radius:18px;padding:20px 20px 18px}.g-icon{margin-bottom:12px;font-size:34px;line-height:1;display:inline-block}.g-icon.left{transform:scaleX(-1)}.gesture h3{font:600 21px/1.2 var(--serif);margin:0 0 6px}.gesture h3 em{color:var(--gold);font-weight:600}.gesture p{color:var(--ink-dim);margin:0;font-size:13.5px}.gesture b{color:var(--ink);font-weight:600}.start-btn{font:600 22px var(--serif);letter-spacing:.5px;color:#1c1406;cursor:pointer;background:linear-gradient(#ffe2a6,#f2b25c);border:0;border-radius:999px;margin-top:36px;padding:14px 44px;transition:transform .2s;animation:2.8s ease-in-out infinite breathe;box-shadow:0 0 #ffd27a80,0 10px 40px #f2b25c40}.start-btn:hover{transform:translateY(-1px)scale(1.02)}.start-btn:disabled{opacity:.6;cursor:progress;animation:none}@keyframes breathe{0%,to{box-shadow:0 0 #ffd27a59,0 10px 40px #f2b25c40}50%{box-shadow:0 0 0 14px #ffd27a00,0 10px 50px #f2b25c66}}.intro-status{color:var(--ink-faint);margin-top:16px;font-size:12.5px}.intro-status.error{color:#ff8f7a}.intro-credits{color:var(--ink-dim);margin:14px 0 0;font-size:12px}.intro-credits a{color:inherit;text-decoration:underline}.intro-credits a:hover{color:var(--gold)}.drawer{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-left:1px solid var(--glass-border);z-index:20;background:#0a0c16eb;width:min(380px,100vw);padding:18px 20px 28px;transition:transform .35s;position:fixed;top:0;bottom:0;right:0;overflow-y:auto;transform:translate(100%)}.drawer.open{transform:none}.drawer-head{justify-content:space-between;align-items:center;margin-bottom:6px;display:flex}.drawer-head h2{font:500 26px var(--serif);margin:0}.calib fieldset{border:0;border-top:1px solid var(--glass-border);margin:14px 0 0;padding:10px 0 0}.calib legend{font:600 16px var(--serif);color:var(--gold);padding:0 8px 0 0}.calib-row{color:var(--ink-dim);grid-template-columns:1fr 118px 44px;align-items:center;gap:2px 8px;margin:8px 0;font-size:12.5px;display:grid}.calib-row input[type=range]{width:100%;accent-color:var(--gold)}.calib-row output{text-align:right;font-variant-numeric:tabular-nums;color:var(--ink-faint)}.calib-row small{color:var(--ink-faint);grid-column:1/-1;margin-top:-3px;font-size:11px}.calib-row.check{gap:8px;display:flex}.calib-row.check input{accent-color:var(--gold)}.calib-row.select{grid-template-columns:1fr 1.4fr}.calib select{color:var(--ink);border:1px solid var(--glass-border);font:inherit;background:#ffffff0d;border-radius:8px;padding:6px 8px}.calib .btn{color:var(--ink-dim);border:1px solid var(--glass-border);font:500 12px var(--sans);cursor:pointer;background:0 0;border-radius:999px;margin-top:16px;padding:7px 14px}.calib .btn:hover{color:var(--ink)}.live-row+.live-row{margin-top:10px}.calib-live{color:var(--ink-dim);background:#ffffff0a;border-radius:12px;margin-top:10px;padding:10px 12px;font-size:12.5px}.calib-live b{color:var(--ink)}.open-scale{background:#ffffff14;border-radius:4px;height:8px;margin-top:8px;position:relative;overflow:hidden}.open-zone{position:absolute;top:0;bottom:0}.open-zone.fist{background:#ff7a5c80;left:0}.open-zone.open{background:#6fd39a80;right:0}.open-marker{opacity:0;background:#fff;width:3px;margin-left:-1px;position:absolute;top:-2px;bottom:-2px}