:root{--ink:#0b0d10;--paper:#e8e4da;--amber:#f0c27a;--pink:#e4a5a8;--line:#e8e4da21;--line-strong:#e8e4da3d;--glass:#0d0f12d1;--glass-deep:#0b0d10eb;--mono:ui-monospace, "SF Mono", Menlo, Consolas, monospace;--grotesk:system-ui, sans-serif}.ui-panel{background:var(--glass);border:1px solid var(--line);color:var(--paper);font-family:var(--grotesk);-webkit-backdrop-filter:blur(10px);border-radius:12px;position:relative;box-shadow:0 18px 50px #00000073,inset 0 1px #e8e4da0f}.ui-panel:before{content:"";background:linear-gradient(90deg, var(--amber), #f0c27a00);pointer-events:none;border-radius:2px;width:34px;height:2px;position:absolute;top:-1px;left:16px}.ui-label{font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;color:#e8e4da94;font-size:11px;font-weight:600}.ui-cell{background:var(--glass);border:1px solid var(--line);color:var(--paper);font-family:var(--grotesk);-webkit-backdrop-filter:blur(6px);border-radius:9px;padding:6px 11px;font-size:15px;line-height:1.4}.ui-caption{background:var(--glass-deep);color:var(--paper);font-family:var(--grotesk);text-align:center;border:1px solid #e8e4da14;border-radius:9px;max-width:min(560px,86vw);padding:10px 16px;font-size:16px;line-height:1.5}.ui-guide{font-family:var(--grotesk);color:var(--paper);opacity:.68;margin:10px 0 0;padding-left:14px;font-size:13px;line-height:1.5;position:relative}.ui-guide:before{content:"";background:var(--amber);opacity:.85;border-radius:1px;width:2px;position:absolute;top:3px;bottom:3px;left:2px}.ui-btn{font-family:var(--grotesk);color:var(--paper);border:1px solid var(--line-strong);cursor:pointer;background:#e8e4da0a;border-radius:9px;padding:9px 16px;font-size:15px;transition:border-color .15s,box-shadow .15s,transform .15s,background .15s}.ui-btn:hover:not(:disabled){border-color:#f0c27a8c;transform:translateY(-1px);box-shadow:0 0 0 1px #f0c27a33,0 0 18px #f0c27a1f}.ui-btn:active:not(:disabled){transform:translateY(0)}.ui-btn:disabled{opacity:.5;cursor:default}button:focus-visible{outline:2px solid var(--amber);outline-offset:2px}.ui-btn--primary{color:#211708;background:linear-gradient(#f7dda6,#e2ae60);border-color:#f0c27acc;font-weight:600;box-shadow:0 0 22px #f0c27a33,inset 0 1px #ffffff59}.ui-btn--primary:hover:not(:disabled){border-color:#f0c27a;box-shadow:0 0 30px #f0c27a61,inset 0 1px #ffffff59}.ui-btn--small{border-radius:7px;padding:5px 12px;font-size:13px}.ui-btn--block{text-align:left;width:100%;margin-top:10px;padding:10px 14px;display:block}.ui-btn--accent{color:var(--amber);border-color:#f0c27aa6}.ui-title{letter-spacing:.05em;text-shadow:0 1px 8px #000000b3;margin-top:0;font-weight:500}.ui-display{letter-spacing:.14em;background:linear-gradient(#f4ecdb 30%,#cfb187 100%);color:#0000;filter:drop-shadow(0 2px 18px #000000d9);-webkit-background-clip:text;background-clip:text;margin:0 0 6px;font-size:clamp(30px,6vw,52px);font-weight:600}.ui-key{border:1px solid var(--line-strong);width:56px;height:56px;color:var(--paper);font-family:var(--grotesk);-webkit-user-select:none;user-select:none;touch-action:none;background-color:#101216d1;background-image:linear-gradient(#0e1014b8,#0b0d10d6),url(/paintings/key_face.jpg);background-position:50%;background-size:cover;border-radius:10px;place-items:center;font-size:20px;transition:transform 80ms,border-color .12s,box-shadow .12s;display:grid;box-shadow:inset 0 1px #e8e4da14}.ui-key:active{border-color:#f0c27abf;transform:scale(.95);box-shadow:0 0 16px #f0c27a47,inset 0 0 12px #f0c27a24}.ui-key--wide{width:auto;min-width:56px;padding:0 14px;font-size:14px}.wheel-wrap{transform-origin:top;transform:translate(-50%)}@media (max-width:520px){.wheel-wrap{transform:translate(-50%)scale(.78)}.ui-cell{padding:4px 8px;font-size:13px}}@media (prefers-reduced-motion:reduce){.ui-btn,.ui-key{transition:none}.ui-btn:hover:not(:disabled),.ui-key:active{transform:none}}