:root{--bg:#5f6266;--ink:#f4f4f2;--ink-dim:#f4f4f2b8;--glass:#1416196b;--glass-hi:#1416199e;--accent:#f4f4f2;--font:"Hiragino Sans GB", "PingFang SC", "Noto Sans SC", system-ui, -apple-system, sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{background:var(--bg);height:100%;color:var(--ink);font-family:var(--font);overscroll-behavior:none;margin:0;overflow:hidden}canvas#view{touch-action:none;width:100vw;height:100vh;display:block;position:fixed;inset:0}#photo{pointer-events:none;background:var(--bg);justify-content:center;align-items:center;transition:opacity 1.6s;display:flex;position:fixed;inset:0}#photo img{object-fit:contain;width:100%;height:100%}#photo.fade{opacity:0;background:0 0}#loading{left:50%;bottom:max(28px, env(safe-area-inset-bottom));text-align:center;width:min(280px,70vw);transition:opacity .6s;position:fixed;transform:translate(-50%)}#loading .bar{background:#ffffff40;border-radius:2px;height:3px;overflow:hidden}#loading .bar i{background:var(--ink);width:0;height:100%;transition:width .3s;display:block}#loading .msg{color:var(--ink-dim);letter-spacing:.06em;margin:10px 0 0;font-size:13px}#intro{left:50%;bottom:max(36px, calc(env(safe-area-inset-bottom) + 20px));text-align:center;background:var(--glass);-webkit-backdrop-filter:blur(10px);border-radius:16px;width:max-content;max-width:calc(100vw - 32px);padding:20px 28px;transition:opacity .6s;position:fixed;transform:translate(-50%)}#intro h1{letter-spacing:.18em;margin:0 0 6px;font-size:22px;font-weight:600}#intro p{color:var(--ink-dim);margin:0 0 14px;font-size:14px}#intro .hint{margin:10px 0 0;font-size:12px}button{font:inherit;color:var(--ink);background:var(--glass-hi);cursor:pointer;border:1px solid #ffffff47;border-radius:999px;padding:8px 16px}button:hover{background:#282a2ebf}button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}#enter{background:var(--ink);color:#222;border-color:#0000;padding:11px 30px;font-size:16px;font-weight:600}#enter:hover{background:#fff}#hud{top:max(12px, env(safe-area-inset-top));right:max(12px, env(safe-area-inset-right));left:max(12px, env(safe-area-inset-left));pointer-events:none;position:fixed}#hud .buttons{pointer-events:auto;flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}#hud button{-webkit-backdrop-filter:blur(8px);padding:7px 13px;font-size:13px}#hud button.on{background:var(--ink);color:#222}#help{text-align:right;color:var(--ink-dim);text-shadow:0 1px 3px #00000080;margin:10px 0 0;font-size:12px}#stick{left:max(24px, env(safe-area-inset-left));bottom:max(28px, env(safe-area-inset-bottom));touch-action:none;background:#14161947;border:1px solid #ffffff4d;border-radius:50%;width:120px;height:120px;position:fixed}#stick i{background:#f4f4f2b3;border-radius:50%;width:52px;height:52px;margin:-26px 0 0 -26px;position:absolute;top:50%;left:50%}.touch-only{right:max(20px, env(safe-area-inset-right));border-radius:50%;width:54px;height:54px;padding:0;font-size:14px;position:fixed}#btn-up{bottom:calc(max(28px, env(safe-area-inset-bottom)) + 66px)}#btn-down{bottom:max(28px, env(safe-area-inset-bottom))}.hidden{display:none!important}.gone{opacity:0;pointer-events:none}@media (width<=520px){#intro h1{font-size:19px}#hud button{padding:6px 11px;font-size:12px}}