:root{--cream: #fff6e6;--cream-deep: #f4e2c4;--tomato: #e8452f;--mango: #ffb020;--berry: #3a6fe0;--leaf: #35b36a;--grape: #8b6bd9;--cocoa: #4a2e22;--ink: #2e1c14;--sky: #bee9f7;--mint: #d8f0e0;--ui-font: "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", "Microsoft YaHei", system-ui, -apple-system, "Segoe UI", sans-serif;--font-scale: 1;--ui-scale: 1}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;overflow:hidden;background:#2e1c14;font-family:var(--ui-font);-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%}#stage{position:fixed;inset:0;display:block;overflow:hidden}#game{position:absolute;inset:0}#game canvas{display:block;width:100%;height:100%}#ui-root{position:absolute;inset:0;pointer-events:none}#ui-root>*{pointer-events:auto}#ui-root>.overlay--clear{pointer-events:none;background:transparent;backdrop-filter:none}#ui-root>.overlay--clear>*{pointer-events:auto}.topbar{align-items:flex-start;justify-content:flex-end}.tabbar{align-items:flex-start;justify-content:center}.panel{background:var(--cream);border:5px solid var(--cocoa);border-radius:30px;box-shadow:0 10px #4a2e2238;color:var(--cocoa);padding:22px 26px}.panel h1,.panel h2{margin:0 0 6px;font-size:calc(30px * var(--font-scale));line-height:1.2;letter-spacing:1px}.panel p{margin:6px 0 0;font-size:calc(16px * var(--font-scale));line-height:1.55;opacity:.86}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:max(14px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));background:#2e1c148c;backdrop-filter:blur(2px)}.overlay[hidden]{display:none}.overlay--clear{background:transparent;backdrop-filter:none}.btn{min-height:calc(48px * var(--ui-scale));min-width:calc(48px * var(--ui-scale));padding:calc(14px * var(--ui-scale)) calc(24px * var(--ui-scale));border-radius:22px;border:4px solid var(--cocoa);background:var(--mango);color:var(--ink);font-family:inherit;font-size:calc(19px * var(--font-scale) * var(--ui-scale));font-weight:700;cursor:pointer;box-shadow:0 5px #4a2e2259;transition:transform .12s ease,box-shadow .12s ease,background .12s ease}.btn:hover{transform:translateY(-2px);box-shadow:0 7px #4a2e2259}.btn:active{transform:translateY(3px);box-shadow:0 1px #4a2e2259}.btn:focus-visible{outline:4px solid var(--berry);outline-offset:3px}.btn--leaf{background:var(--leaf);color:#fff}.btn--berry{background:var(--berry);color:#fff}.btn--cream{background:var(--cream)}.btn--ghost{background:transparent;box-shadow:none;border-color:#4a2e2266}.btn-row{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:18px}.menu{width:min(760px,100%);max-height:100%;overflow:auto;text-align:center}.menu__title{font-size:calc(44px * var(--font-scale));margin:0;letter-spacing:3px}.menu__sub{font-size:calc(17px * var(--font-scale));opacity:.8;margin:4px 0 18px}.menu__modes{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}.mode-card{border:4px solid var(--cocoa);border-radius:24px;padding:14px;background:var(--mint);cursor:pointer;text-align:center;min-height:48px}.mode-card--duo{background:var(--sky)}.mode-card:hover{transform:translateY(-3px)}.mode-card h3{margin:8px 0 4px;font-size:calc(20px * var(--font-scale))}.mode-card p{margin:0;font-size:calc(14px * var(--font-scale));opacity:.8}.mode-card img{height:118px;object-fit:contain;display:block;margin:0 auto}.howto{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin-top:18px;text-align:left}.howto__step{display:flex;align-items:center;gap:8px;background:#fff;border:3px solid var(--cream-deep);border-radius:16px;padding:8px 10px;font-size:calc(13px * var(--font-scale));line-height:1.35}.howto__step img{width:42px;height:42px;flex:none;object-fit:contain}.settings__help{margin-top:14px}.settings__help>summary{list-style:none;cursor:pointer}.settings__help>summary::-webkit-details-marker{display:none}.settings__help[open]>summary{margin-bottom:10px;background:var(--leaf);color:#fff}.settings{width:min(520px,100%);max-height:100%;overflow:auto}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 4px;border-bottom:3px dashed rgba(74,46,34,.16);font-size:calc(17px * var(--font-scale))}.setting-row:last-child{border-bottom:none}.switch{position:relative;width:78px;height:44px;flex:none;border-radius:22px;border:4px solid var(--cocoa);background:#e6d6c2;cursor:pointer;padding:0}.switch[aria-checked=true]{background:var(--leaf)}.switch:after{content:"";position:absolute;top:3px;left:3px;width:30px;height:30px;border-radius:50%;background:#fff;border:3px solid var(--cocoa);transition:transform .15s ease}.switch[aria-checked=true]:after{transform:translate(34px)}.summary{width:min(520px,100%);text-align:center}.summary__stats{display:flex;justify-content:center;gap:16px;margin:14px 0 6px;flex-wrap:wrap}.stat{display:flex;align-items:center;gap:8px;font-size:calc(26px * var(--font-scale));font-weight:800}.stat img{width:46px;height:46px}.summary__praise{font-size:calc(21px * var(--font-scale));font-weight:700;color:var(--tomato);margin-top:6px}.rotate{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:var(--cream);color:var(--cocoa);text-align:center;padding:24px;z-index:30}.rotate[hidden]{display:none}.rotate__icon{width:96px;height:96px;border:8px solid var(--cocoa);border-radius:20px;animation:tilt 2.2s ease-in-out infinite}@keyframes tilt{0%,40%{transform:rotate(0)}60%,to{transform:rotate(-90deg)}}@media (prefers-reduced-motion: reduce){.rotate__icon{animation:none}.btn:hover,.mode-card:hover{transform:none}}@media (max-height: 520px){.panel{padding:14px 18px;border-radius:22px}.menu__title{font-size:calc(32px * var(--font-scale))}.mode-card img{height:88px}}