:root{--cream:#f4ede1;--ink:#5a5147;--wood:#a9744f;--line:#7e543352;--panel:#f6efe2ed;--shadow:0 10px 26px #281e1438}*{box-sizing:border-box}html,body{height:100%;margin:0}body{color:var(--ink);-webkit-font-smoothing:antialiased;background:#0d1420;font-family:Songti SC,Noto Serif CJK SC,SimSun,serif;overflow:hidden}#stage{touch-action:none;cursor:grab;position:fixed;inset:0}#stage:active{cursor:grabbing}#stage canvas{display:block}.hud{pointer-events:none;flex-direction:column;justify-content:space-between;padding:18px 20px 20px;display:flex;position:absolute;inset:0}.hud button,.hud input{pointer-events:auto}.topbar{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.modes{border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);border-radius:999px;gap:6px;padding:5px;display:flex}.pill{color:#5f5346;letter-spacing:.04em;cursor:pointer;background:0 0;border:0;border-radius:999px;padding:9px 16px;font:500 14px/1 Songti SC,serif;transition:background .18s,color .18s}.pill:hover{background:#fbf5ea}.pill.on{color:#40372d;background:linear-gradient(#e8d6b8,#dcc39c);box-shadow:inset 0 0 0 1px #7e543340}.clock{border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);border-radius:999px;align-items:center;gap:9px;padding:8px 16px;display:flex}.clock-icon{color:#5f5346;font-size:15px}.clock-time{letter-spacing:.04em;color:#3d352c;font:600 18px/1 ui-monospace,SF Mono,Menlo,monospace}.clock-phase{color:#5f5346;letter-spacing:.08em;font-size:12px}.bottom{flex-direction:column;align-items:center;gap:9px;display:flex}.timebar{border:1px solid var(--line);background:var(--panel);max-width:94vw;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);border-radius:14px;align-items:center;gap:9px;padding:9px 14px;display:flex}.timebar-label{color:#5f5346;letter-spacing:.1em;white-space:nowrap;font-size:12px}.preset{color:#4a4136;cursor:pointer;white-space:nowrap;background:#f7efe2;border:1px solid #7e543347;border-radius:10px;padding:8px 12px;font:500 13px/1 Songti SC,serif;transition:background .15s}.preset:hover{background:#fff}.preset.on{color:#40372d;background:linear-gradient(#e8d6b8,#dcc39c)}.slider{width:170px;min-height:26px;accent-color:var(--wood);cursor:pointer}.caption{letter-spacing:.08em;color:#ffffffe6;text-shadow:0 1px 8px #1e140a99;font:500 13px/1.4 Songti SC,serif}.plot-addr{letter-spacing:.14em;color:#fffffff0;text-shadow:0 1px 8px #1e140a99;opacity:0;pointer-events:none;background:#28201652;border-radius:999px;padding:3px 12px;font:500 12.5px/1.4 Songti SC,serif;transition:opacity .25s,transform .25s;transform:translateY(-4px)}.plot-addr.on{opacity:1;transform:translateY(0)}.hint{letter-spacing:.02em;color:#ffffffad;text-shadow:0 1px 8px #1e140a8c;text-align:center;font:400 12.5px/1.4 ui-sans-serif,system-ui,sans-serif}.vignette{pointer-events:none;background:radial-gradient(#0000 46%,#1810085c 100%);position:absolute;inset:0}.loading{color:#fffc;letter-spacing:.12em;z-index:50;pointer-events:none;background:#10161f;place-items:center;font:400 14px/1 Songti SC,serif;transition:opacity .6s;display:grid;position:absolute;inset:0}.loading.gone{opacity:0}.joystick{pointer-events:none;z-index:20;background:#f4ede129;border:1.5px solid #ffffff80;border-radius:50%;width:108px;height:108px;margin:-54px 0 0 -54px;position:fixed}.joystick-knob{background:#f4ede1e6;border-radius:50%;width:44px;height:44px;margin:-22px 0 0 -22px;position:absolute;top:50%;left:50%;box-shadow:0 3px 12px #00000052}@media (width<=560px){.hud{padding:12px 12px 14px}.pill{padding:8px 12px;font-size:13px}.clock{padding:7px 12px}.clock-time{font-size:16px}.timebar{gap:6px;padding:8px 10px}.timebar-label,.slider{display:none}.preset{padding:7px 10px;font-size:12px}.caption{font-size:12px}.hint{font-size:11.5px}}