:root{--glass: rgba(14, 18, 16, .55);--line: rgba(255, 255, 255, .14);--text: #eef2ea;--muted: rgba(238, 242, 234, .62);--accent: #c9e27a}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#0b0f0c;color:var(--text);font:13px/1.4 system-ui,-apple-system,sans-serif;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}canvas{display:block;touch-action:none}#loading{position:fixed;inset:0;display:grid;place-items:center;background:#0b0f0c;font-size:15px;letter-spacing:.04em;color:var(--muted);z-index:10;transition:opacity .8s}#panel{position:fixed;top:16px;right:16px;width:236px;padding:14px;background:var(--glass);border:1px solid var(--line);border-radius:14px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);display:grid;gap:10px;max-height:calc(100dvh - 32px);overflow-y:auto;overscroll-behavior:contain}#panel h1{margin:0;font-size:13px}#panelToggle{width:100%;display:flex;justify-content:space-between;align-items:center;padding:0;border:0;background:none;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}#panelToggle:after{content:"";width:7px;height:7px;margin-right:3px;border:solid currentColor;border-width:0 1.5px 1.5px 0;transform:translateY(1px) rotate(-135deg);transition:transform .2s}#panel.collapsed #panelToggle:after{transform:translateY(-2px) rotate(45deg)}#panel.collapsed{width:auto;padding:10px 14px}#panel.collapsed>:not(h1){display:none}#panel.collapsed #panelToggle{gap:12px}.seasons{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}button{font:inherit;color:var(--text);background:rgba(255,255,255,.06);border:1px solid var(--line);border-radius:8px;padding:6px 0;cursor:pointer}button:hover{background:rgba(255,255,255,.12)}button.active{background:var(--accent);color:#18210c;border-color:transparent;font-weight:600}.row{display:flex;justify-content:space-between;align-items:center;color:var(--muted)}.row b{color:var(--text);font-weight:500;font-variant-numeric:tabular-nums}.row.small{font-size:11px;font-variant-numeric:tabular-nums;margin-top:-4px}input[type=range]{width:100%;accent-color:var(--accent);margin:0}label.check{display:flex;gap:8px;align-items:center;color:var(--muted);cursor:pointer}#sound{width:100%}#hint{position:fixed;left:50%;bottom:22px;transform:translate(-50%);padding:8px 14px;border-radius:999px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:var(--muted);white-space:nowrap;transition:opacity .4s}#stats{position:fixed;left:14px;top:12px;color:var(--muted);font:11px/1.5 ui-monospace,monospace}body.hide-ui #panel,body.hide-ui #hint,body.hide-ui #stats{display:none}body.locked #hint,body.touched #hint{opacity:0;pointer-events:none}.touch-only,#touch{display:none}body.touch .touch-only{display:inline}body.touch .desk-only{display:none}body.touch #touch{display:block}body.touch #hint{top:calc(72px + env(safe-area-inset-top));bottom:auto}#stick{position:fixed;left:-52px;top:-52px;width:104px;height:104px;border-radius:50%;border:1.5px solid rgba(255,255,255,.35);background:rgba(14,18,16,.25);opacity:0;pointer-events:none;transition:opacity .15s}#stick.on{opacity:1}#knob{position:absolute;left:30px;top:30px;width:44px;height:44px;border-radius:50%;background:rgba(238,242,234,.75)}#stick.run #knob{background:var(--accent)}#touchButtons{position:fixed;right:calc(16px + env(safe-area-inset-right));bottom:calc(20px + env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(2,56px);gap:10px}#touchButtons button{width:56px;height:56px;padding:0;border-radius:50%;background:var(--glass);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-size:11px;font-weight:600;touch-action:none}#touchButtons button:active{background:rgba(255,255,255,.22)}body.flying #touchButtons [data-key=KeyF]{background:var(--accent);color:#18210c}#touchButtons [data-key=KeyC]{visibility:hidden}body.flying #touchButtons [data-key=KeyC]{visibility:visible}body.hide-ui #touchButtons{display:none}@media (max-height: 500px){#panel:not(.collapsed)~#touch #touchButtons{display:none}}@media (max-width: 600px){#panel:not(.collapsed){left:16px;right:16px;width:auto}#hint{white-space:normal;width:calc(100% - 32px);text-align:center;border-radius:12px}}
