*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}@supports (height:100dvh){html,body,#root{height:100dvh}}body{overscroll-behavior:none;-webkit-tap-highlight-color:transparent;background:#120a1e;font-family:Courier New,monospace;overflow:hidden}.stage{touch-action:none;width:100%;height:100%;position:relative}.stage canvas{display:block}.hud{color:#f3eee6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);-webkit-user-select:none;user-select:none;accent-color:#d8b98a;background:linear-gradient(160deg,#1e1822d9,#100d14d9);border:1px solid #d8b98a2e;border-radius:14px;max-width:min(460px,100vw - 32px);padding:14px 16px 12px;font-size:12px;line-height:1.5;position:absolute;top:16px;left:16px;box-shadow:0 8px 28px #00000059}.hud-clock-row{align-items:center;gap:14px;margin:8px 0 4px;display:flex}.clock{cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;filter:drop-shadow(0 3px 8px #0006);flex:none;width:108px;height:108px}.clock:active{cursor:grabbing}.clock-face{fill:#ffffff0f;stroke:#f3eee68c;stroke-width:2.5px}.clock-tick{stroke:#f3eee666;stroke-width:2px;stroke-linecap:round}.clock-tick-major{stroke:#f3eee6d9;stroke-width:3px}.clock-hand{stroke-linecap:round;pointer-events:none}.clock-hand-hour{stroke:#f3eee6;stroke-width:5px}.clock-hand-min{stroke:#d8b98a;stroke-width:3px}.clock-pin{fill:#d8b98a}.hud-clock-side{flex-direction:column;align-items:flex-start;gap:3px;display:flex}.hud-btn-row{flex-wrap:wrap;gap:6px;display:flex}.hud-clock-side button{font:inherit;color:#f0e2c8;cursor:pointer;background:#d8b98a1f;border:1px solid #d8b98a66;border-radius:999px;margin-top:4px;padding:3px 10px;transition:background .15s,border-color .15s}.hud-clock-side button:hover:not(:disabled){background:#d8b98a47;border-color:#d8b98ab3}.hud-clock-side button:disabled{opacity:.35;cursor:default}.hud-time{letter-spacing:2px;font-size:22px;font-weight:700}.hud-row{flex-wrap:wrap;align-items:center;gap:6px 10px;display:flex}.hud-title{border-bottom:1px solid #f3eee61f;padding-bottom:8px;font-size:14px;font-weight:700}.hud-icon{font-size:18px}.hud-close{font:inherit;width:30px;height:30px;color:inherit;cursor:pointer;background:#ffffff14;border:1px solid #f3eee640;border-radius:50%;margin-left:auto;font-size:14px}.hud-dim{color:#f3eee699}.hud-controls{border-top:1px solid #f3eee61f;gap:8px 12px;margin-top:8px;padding-top:8px}.hud-controls label{color:#f3eee6bf;align-items:center;gap:6px;display:inline-flex}.hud-controls input[type=range]{width:140px}.hud-controls button,.hud-controls select{font:inherit;color:inherit;cursor:pointer;background:#ffffff14;border:1px solid #ffffff40;border-radius:6px;padding:2px 8px}.hud-controls button:disabled{opacity:.4;cursor:default}.hint{color:#281e1480;letter-spacing:3px;text-transform:uppercase;pointer-events:none;-webkit-user-select:none;user-select:none;font-size:12px;position:absolute;bottom:18px;left:50%;transform:translate(-50%)}.touchbar{right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:2;gap:8px;display:flex;position:absolute}.touchbar button{font:inherit;letter-spacing:1px;text-transform:uppercase;color:#f0e2c8;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer;background:#100d14b8;border:1px solid #d8b98a73;border-radius:999px;min-width:42px;min-height:42px;padding:0 16px;font-size:13px;box-shadow:0 6px 18px #00000059}.touchbar button:active{background:#d8b98a4d}.touch .hint{bottom:calc(66px + env(safe-area-inset-bottom,0px));color:#f3eee6d9;text-shadow:0 1px 4px #000000b3}@media (width<=640px){.hud{top:calc(10px + env(safe-area-inset-top,0px));max-width:none;max-height:calc(100% - 90px);padding:12px 14px 10px;left:10px;right:10px;overflow-y:auto}.hud-time{font-size:20px}.hud-controls input[type=range]{width:min(220px,55vw)}.hud-clock-side button,.hud-controls button{min-height:34px;padding:6px 12px}.hint{text-align:center;letter-spacing:1.5px;font-size:11px;line-height:1.5;left:12px;right:12px;transform:none}}