:root{--ui-bg:#0a0b0db8;--ui-line:#ffffff1a;--ui-fg:#ffffffeb;--ui-dim:#ffffff6b;--ui-accent:#d8dee6}*{box-sizing:border-box}html,body,#root{background:#000;height:100%;margin:0;overflow:hidden}body{color:var(--ui-fg);-webkit-font-smoothing:antialiased;font:400 12px/1.4 ui-sans-serif,-apple-system,SF Pro Text,Inter,system-ui,sans-serif}canvas{touch-action:none;display:block}.hud{pointer-events:none;z-index:10;position:fixed;inset:0}.hud>*{pointer-events:auto}.brand{letter-spacing:.34em;text-transform:uppercase;color:var(--ui-dim);font-size:10px;position:absolute;top:22px;left:26px}.brand b{letter-spacing:.18em;color:var(--ui-fg);margin-top:4px;font-size:15px;font-weight:500;display:block}.panel{background:var(--ui-bg);-webkit-backdrop-filter:blur(18px)saturate(1.3);backdrop-filter:blur(18px)saturate(1.3);border:1px solid var(--ui-line);border-radius:12px;flex-direction:column;gap:13px;width:232px;max-height:calc(100vh - 44px);padding:14px 14px 12px;display:flex;position:absolute;top:22px;right:22px;overflow-y:auto}.panel::-webkit-scrollbar{width:0}.grp{flex-direction:column;gap:6px;display:flex}.grp>label{letter-spacing:.16em;text-transform:uppercase;color:var(--ui-dim);justify-content:space-between;font-size:9px;display:flex}.grp>label span{letter-spacing:0;text-transform:none;color:var(--ui-fg);font-variant-numeric:tabular-nums}.seg{flex-wrap:wrap;gap:4px;display:flex}.seg button{min-width:0;color:var(--ui-dim);font:inherit;cursor:pointer;white-space:nowrap;text-overflow:ellipsis;background:#ffffff0b;border:1px solid #0000;border-radius:7px;flex:auto;padding:6px 7px;font-size:11px;transition:background .16s,color .16s,border-color .16s;overflow:hidden}.seg button:hover{color:var(--ui-fg);background:#ffffff17}.seg button[data-on="1"]{background:var(--ui-accent);color:#0b0c0e;border-color:var(--ui-accent)}input[type=range]{-webkit-appearance:none;background:#ffffff29;border-radius:2px;outline:none;width:100%;height:3px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--ui-accent);cursor:pointer;border-radius:50%;width:11px;height:11px}.swatches{flex-wrap:wrap;gap:6px;display:flex}.swatches button{cursor:pointer;border:1px solid #ffffff38;border-radius:50%;width:22px;height:22px;padding:0;transition:transform .14s,box-shadow .14s}.swatches button:hover{transform:scale(1.12)}.swatches button[data-on="1"]{box-shadow:0 0 0 2px #0b0c0e, 0 0 0 3.5px var(--ui-accent)}.hint{letter-spacing:.1em;color:var(--ui-dim);text-transform:uppercase;font-size:10px;position:absolute;bottom:20px;left:26px}.stat{letter-spacing:.12em;color:var(--ui-dim);font-variant-numeric:tabular-nums;text-align:right;font-size:10px;position:absolute;bottom:20px;right:24px}.loader{z-index:50;background:#000;place-content:center;justify-items:center;gap:18px;transition:opacity .7s;display:grid;position:fixed;inset:0}.loader[data-done="1"]{opacity:0;pointer-events:none}.loader .bar{background:#ffffff24;width:190px;height:1px;overflow:hidden}.loader .bar i{background:#fff;height:100%;transition:width .3s;display:block}.loader p{letter-spacing:.32em;text-transform:uppercase;color:var(--ui-dim);margin:0;font-size:10px}@media (width<=720px){.panel{width:auto;max-height:44vh;inset:auto 12px 12px}.hint,.stat{display:none}}