:root{--pnl-sheet:0px;--pnl-font:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--pnl-bg:#fff;--pnl-line:#e6e6e8;--pnl-row:#f2f2f3;--pnl-row-hover:#ececee;--pnl-fill:#e1e1e4;--pnl-tick:#a9a9ae;--pnl-ink:#1c1c1e;--pnl-muted:#6c6c72;--pnl-accent:#3b82f6;--pnl-pill:#ececeeeb;--pnl-pill-hover:#e2e2e5;--pnl-strong:#111113;--pnl-strong-ink:#fff;--pnl-shadow:0 -10px 40px #0000000f;--pnl-focus:0 0 0 2px var(--pnl-bg), 0 0 0 4px var(--pnl-accent)}:root[data-panel-theme=dark]{--pnl-bg:#151517;--pnl-line:#2a2a2e;--pnl-row:#212124;--pnl-row-hover:#26262a;--pnl-fill:#303035;--pnl-tick:#66666d;--pnl-ink:#f1f1f3;--pnl-muted:#9b9ba2;--pnl-accent:#5b9bf6;--pnl-pill:#242428e6;--pnl-pill-hover:#303035;--pnl-strong:#f4f4f5;--pnl-strong-ink:#111113;--pnl-shadow:0 -10px 40px #00000059}.pnl-bar{z-index:20;font:500 15px/1 var(--pnl-font);gap:8px;display:flex;position:fixed;top:clamp(14px,3vh,28px);right:clamp(14px,2.4vw,28px)}.pnl-pill{background:var(--pnl-pill);height:44px;color:var(--pnl-ink);font:inherit;cursor:pointer;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:0;border-radius:12px;align-items:center;gap:8px;padding:0 18px;text-decoration:none;transition:background-color .15s,transform .15s;display:inline-flex}.pnl-pill:hover{background:var(--pnl-pill-hover)}.pnl-pill:active{transform:scale(.97)}.pnl-pill:focus-visible{box-shadow:var(--pnl-focus);outline:none}.pnl-pill--strong{background:var(--pnl-strong);color:var(--pnl-strong-ink)}.pnl-pill--strong:hover{background:var(--pnl-strong);opacity:.86}.pnl-pill svg{fill:none;stroke:currentColor;stroke-width:1.7px;stroke-linecap:round;stroke-linejoin:round;flex:none;width:18px;height:18px}.pnl-pill--strong svg{order:1;width:16px;height:16px;margin-right:-4px}.pnl-sheet{z-index:15;max-height:min(46vh,420px);padding-bottom:env(safe-area-inset-bottom);background:var(--pnl-bg);color:var(--pnl-ink);border-top:1px solid var(--pnl-line);box-shadow:var(--pnl-shadow);font:400 15px/1.3 var(--pnl-font);-webkit-font-smoothing:antialiased;visibility:hidden;border-radius:20px 20px 0 0;flex-direction:column;transition:translate .36s cubic-bezier(.2,.8,.2,1),visibility 0s linear .36s;display:flex;position:fixed;bottom:0;left:0;right:0;translate:0 calc(100% + 24px)}.pnl-sheet.is-open{visibility:visible;transition:translate .36s cubic-bezier(.2,.8,.2,1),visibility;translate:0}.pnl-handle{cursor:pointer;background:0 0;border:0;flex:none;place-items:center;width:120px;height:22px;margin:0 auto;display:grid}.pnl-handle i{background:var(--pnl-line);border-radius:3px;width:120px;height:5px;transition:background-color .15s}.pnl-handle:hover i{background:var(--pnl-tick)}.pnl-handle:focus-visible{outline:none}.pnl-handle:focus-visible i{box-shadow:var(--pnl-focus)}.pnl-tabs{scrollbar-width:none;flex:none;gap:4px;width:100%;max-width:1340px;margin:0 auto;padding:4px 24px 12px;display:flex;overflow-x:auto}.pnl-tabs::-webkit-scrollbar{display:none}.pnl-tab{height:34px;color:var(--pnl-muted);font:500 14px/1 var(--pnl-font);cursor:pointer;background:0 0;border:0;border-radius:9px;flex:none;padding:0 14px;transition:background-color .15s,color .15s}.pnl-tab:hover{color:var(--pnl-ink)}.pnl-tab[aria-selected=true]{background:var(--pnl-row);color:var(--pnl-ink)}.pnl-tab:focus-visible{box-shadow:var(--pnl-focus);outline:none}.pnl-body{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--pnl-fill) transparent;flex:auto;align-content:start;width:100%;max-width:1340px;min-height:0;margin:0 auto;padding:4px 24px 24px;display:grid;overflow-y:auto}.pnl-pane{grid-area:1/1}.pnl-pane[hidden]{visibility:hidden;display:block}.pnl-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));align-items:end;gap:12px 28px;display:grid}.pnl-ctrl[hidden]{display:none}.pnl-slider,.pnl-toggle,.pnl-field,.pnl-color,.pnl-button{border:1px solid var(--pnl-line);background:var(--pnl-row);width:100%;height:42px;color:var(--pnl-ink);font:inherit;text-align:left;border-radius:9px;align-items:center;padding:0 16px;transition:background-color .15s,border-color .15s;display:flex;position:relative;overflow:hidden}.pnl-slider:hover,.pnl-toggle:hover,.pnl-color:hover,.pnl-button:hover{background:var(--pnl-row-hover)}.pnl-slider:focus-visible,.pnl-toggle:focus-visible,.pnl-button:focus-visible{box-shadow:var(--pnl-focus);outline:none}.pnl-slider{cursor:ew-resize;touch-action:pan-y;-webkit-user-select:none;user-select:none}.pnl-slider__fill{background:var(--pnl-fill);pointer-events:none;position:absolute;inset:0 auto 0 0}.pnl-slider__fill:after{content:"";background:var(--pnl-tick);border-radius:1px;width:2px;height:18px;position:absolute;top:50%;right:0;translate:0 -50%}.pnl-slider.is-active .pnl-slider__fill:after{background:var(--pnl-ink)}.pnl-slider__label,.pnl-slider__value{pointer-events:none;position:relative}.pnl-slider__label{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-width:0;overflow:hidden}.pnl-slider__value{color:var(--pnl-ink);font-variant-numeric:tabular-nums;flex:none;padding-left:12px}.pnl-slider__input{pointer-events:auto;border:1px solid var(--pnl-accent);background:var(--pnl-bg);width:6.5em;height:28px;color:var(--pnl-ink);font:inherit;text-align:right;font-variant-numeric:tabular-nums;border-radius:6px;outline:none;margin-right:-8px;padding:0 8px}.pnl-toggle{cursor:pointer;justify-content:space-between;gap:12px}.pnl-toggle__label{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.pnl-toggle__switch{background:var(--pnl-fill);border-radius:12px;flex:none;width:42px;height:24px;transition:background-color .2s;position:relative}.pnl-toggle__switch i{background:#fff;border-radius:50%;width:18px;height:18px;transition:translate .2s cubic-bezier(.2,.8,.2,1);position:absolute;top:3px;left:3px;box-shadow:0 1px 3px #00000040}.pnl-toggle[aria-checked=true] .pnl-toggle__switch{background:var(--pnl-accent)}.pnl-toggle[aria-checked=true] .pnl-toggle__switch i{translate:18px}.pnl-field{cursor:text;gap:12px}.pnl-field__label{color:var(--pnl-muted);flex:none}.pnl-field__input{min-width:0;height:100%;color:var(--pnl-ink);font:inherit;text-align:right;background:0 0;border:0;outline:none;flex:auto}.pnl-field:focus-within{border-color:var(--pnl-accent)}.pnl-select{gap:7px;display:grid}.pnl-select__label{color:var(--pnl-muted);font-size:14px}.pnl-select__box{display:block;position:relative}.pnl-select__input{appearance:none;border:1px solid var(--pnl-line);background:var(--pnl-bg);width:100%;height:44px;color:var(--pnl-ink);font:inherit;cursor:pointer;border-radius:9px;padding:0 44px 0 16px;transition:border-color .15s}.pnl-select__input:hover{border-color:var(--pnl-tick)}.pnl-select__input:focus-visible{box-shadow:var(--pnl-focus);outline:none}.pnl-select__input option{background:var(--pnl-bg);color:var(--pnl-ink)}.pnl-select__chevron{pointer-events:none;display:grid;position:absolute;top:50%;right:14px;translate:0 -50%}.pnl-select__chevron svg,.pnl-select__chevron{width:20px;height:20px}.pnl-select__chevron svg{fill:none;stroke:currentColor;stroke-width:1.7px;stroke-linecap:round;stroke-linejoin:round}.pnl-color{cursor:pointer;gap:12px}.pnl-color__label{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-width:0;overflow:hidden}.pnl-color__hex{color:var(--pnl-muted);font-variant-numeric:tabular-nums;letter-spacing:.02em;flex:none;font-size:13px}.pnl-color__swatch{border-radius:7px;flex:none;width:24px;height:24px;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #0000001f}.pnl-color__input{opacity:0;cursor:pointer;border:0;width:calc(100% + 16px);height:calc(100% + 16px);padding:0;position:absolute;inset:-8px}.pnl-color:focus-within{box-shadow:var(--pnl-focus)}.pnl-button{background:var(--pnl-bg);cursor:pointer;justify-content:center;font-weight:500}.pnl-button:active{transform:scale(.99)}.credit,.stats,.toast{transition:translate .36s cubic-bezier(.2,.8,.2,1)}.pnl-has-sheet .credit,.pnl-has-sheet .stats{translate:0 calc(-1 * var(--pnl-sheet))}.pnl-has-sheet .toast{bottom:calc(var(--pnl-sheet) + 24px)}@media (max-width:720px){.pnl-bar{gap:6px}.pnl-pill{height:40px;padding:0 12px}.pnl-pill:not(.pnl-pill--strong) span{clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}.pnl-sheet{border-radius:18px 18px 0 0;max-height:52vh}html .hud{top:calc(env(safe-area-inset-top) + 70px)}.pnl-tabs{padding:2px 14px 10px}.pnl-body{padding:2px 14px 20px}.pnl-grid{grid-template-columns:1fr;gap:10px}}@media (prefers-reduced-motion:reduce){.pnl-sheet,.pnl-sheet.is-open,.credit,.stats,.toast,.pnl-toggle__switch i{transition:none}}*,:before,:after{box-sizing:border-box}:root{--studio:#dcdfe3;--lift:1;--ink:#17181a}html,body{height:100%;color:var(--ink);-webkit-font-smoothing:antialiased;margin:0;font:400 15px/1.55 system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;overflow:hidden}body{background:radial-gradient(ellipse 62% 20% at 50% 68%, color-mix(in oklab, var(--studio), white calc(var(--lift) * 80%)) 0%, transparent 100%), radial-gradient(ellipse 46% 42% at 50% 42%, color-mix(in oklab, var(--studio), white calc(var(--lift) * 50%)) 0%, transparent 100%), linear-gradient(180deg, color-mix(in oklab, var(--studio), black 5%) 0%, var(--studio) 34%, color-mix(in oklab, var(--studio), white calc(var(--lift) * 35%)) 58%, color-mix(in oklab, var(--studio), white calc(var(--lift) * 65%)) 68%, color-mix(in oklab, var(--studio), white calc(var(--lift) * 26%)) 82%, color-mix(in oklab, var(--studio), black 3%) 100%);background-color:var(--studio)}body.is-dark{--ink:#f1eee9}body:after{content:"";z-index:0;pointer-events:none;opacity:.5;mix-blend-mode:soft-light;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .5  0 0 0 0 .5  0 0 0 0 .5  0 0 0 .55 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");position:fixed;inset:0}#stage{z-index:1;width:100%;height:calc(100% - var(--pnl-sheet));touch-action:none;display:block;position:fixed;inset:0 0 auto}.hud{z-index:2;pointer-events:none;max-width:34ch;position:fixed;top:clamp(18px,4vh,48px);left:clamp(18px,4vw,52px)}.hud h1{letter-spacing:-.02em;margin:0 0 10px;font-size:clamp(30px,4.4vw,54px);font-weight:300}.hud p{opacity:.74;margin:0 0 10px;font-size:14px;font-weight:300}.hint{font-size:12.5px;opacity:.55!important}kbd{font:inherit;opacity:.8;border:1px solid;border-radius:5px;padding:1px 5px;font-size:11px}.credit{z-index:2;margin:0;font-size:13px;position:fixed;bottom:clamp(16px,3vh,34px);left:clamp(18px,4vw,52px)}.credit a{color:inherit;opacity:.6;text-underline-offset:4px}.credit a:hover{opacity:1}.stats{z-index:2;font-variant-numeric:tabular-nums;opacity:.5;pointer-events:none;margin:0;font-size:12px;position:fixed;bottom:clamp(16px,3vh,34px);right:clamp(16px,3vw,32px)}.toast{z-index:3;color:#f3f4f6;opacity:0;pointer-events:none;background:#17181ae6;border-radius:999px;margin:0;padding:9px 16px;font-size:13px;transition:opacity .25s,translate .25s;position:fixed;bottom:34px;left:50%;translate:-50% 12px}.toast.is-on{opacity:1;translate:-50%}.fallback{z-index:4;text-align:center;background:var(--studio);place-items:center;padding:24px;display:grid;position:fixed;inset:0}.fallback[hidden]{display:none}@media (max-width:720px){.hud p:not(.hint){display:none}.hud h1{font-size:30px}.stats{display:none}}@media (prefers-reduced-motion:reduce){.toast{transition:none}}
