/* Page-level chrome only — everything inside the canvas is drawn by wechat-minigame/js/app.js and untouched by this file. This just centers a max-width "phone" column so the game reads naturally on a wide desktop browser instead of stretching a mobile-first layout edge to edge. */ :root { color-scheme: light; --page-background: #17231d; } * { box-sizing: border-box; } /* Standard "visually hidden but present" technique — keeps index.html's real-content block (game list/description, for search engines and screen readers, since the canvas itself has no readable text) out of sighted layout without display:none/visibility:hidden, which would hide it from crawlers and assistive tech too, not just visually. */ .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } html, body { margin: 0; padding: 0; width: 100%; height: 100%; background: var(--page-background); overscroll-behavior: none; } body { display: flex; justify-content: center; align-items: stretch; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', sans-serif; } #game-shell { position: relative; width: 100%; max-width: 480px; height: 100vh; height: 100dvh; background: #dfc9a7; box-shadow: 0 0 60px rgba(0, 0, 0, 0.35); overflow: hidden; } #game-canvas { display: block; /* Pointer gestures (menu swipe, drag-to-scroll) are handled entirely by wechat-minigame/js/app.js's own touch logic — disabling the browser's native pan/zoom/scroll on the canvas stops it from fighting those. */ touch-action: none; -webkit-user-select: none; user-select: none; /* A single