/* The same fixed header is used by both games. */
body>header{width:100%;max-width:none;height:76px;min-height:76px;flex:0 0 76px;margin:0;padding:12px 5%;display:flex;align-items:center;gap:24px;border-bottom:1px solid var(--line);background:var(--bg);overflow:hidden}
body>header .brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none;font:800 14px Arial,Helvetica,sans-serif;letter-spacing:1px;min-width:0;white-space:nowrap}
body>header .logo{display:grid;place-items:center;flex:0 0 42px;width:42px;height:42px;padding:0;background:var(--lime);color:var(--bg);border-radius:6px;font:800 23px Arial,Helvetica,sans-serif}
body>header .edition{margin-left:auto;font:12px monospace;color:var(--muted);white-space:nowrap}
body>header #sound{flex:none;min-height:44px;margin-left:auto;padding:10px 14px;border:1px solid var(--line);border-radius:6px;background:transparent;color:var(--muted);font:14px Arial,Helvetica,sans-serif;white-space:nowrap}
@media(max-width:1000px){body>header .edition{display:none}}
@media(max-width:760px){
 body>header{height:64px;min-height:64px;flex-basis:64px;padding:10px 4%;gap:8px}
 body>header .brand{font-size:11px;gap:7px;letter-spacing:.4px}
 body>header .logo{flex-basis:36px;width:36px;height:36px;font-size:20px}
 body>header #sound{font-size:12px;padding:8px;min-height:44px}
}

/* Slim scrollbars for the internal game panels. */
:where(.game-viewport,.intro,.welcome,#result,#store,.communication [role=tabpanel]){scrollbar-width:thin;scrollbar-color:#657082 transparent}
:where(.game-viewport,.intro,.welcome,#result,#store,.communication [role=tabpanel])::-webkit-scrollbar{width:6px;height:6px}
:where(.game-viewport,.intro,.welcome,#result,#store,.communication [role=tabpanel])::-webkit-scrollbar-track{background:transparent}
:where(.game-viewport,.intro,.welcome,#result,#store,.communication [role=tabpanel])::-webkit-scrollbar-thumb{background:#657082;border-radius:8px}