/* galacticmerge.afterdarkclub.vip -- the v3 game on its own page (site/galacticmerge/, built by site/tools/build_site.py) */
@font-face{font-family:Bungee;src:url(/fonts/bungee_Bungee-Regular.ttf) format("truetype");font-display:swap}
@font-face{font-family:Monoton;src:url(/fonts/monoton_Monoton-Regular.ttf) format("truetype");font-display:swap}
:root{color-scheme:dark;--text:#F3EEF7;--muted:#A9A3B8;--line:rgba(243,238,247,.12);--pink:#E5007D}
*{box-sizing:border-box}
html,body{margin:0;background:#05030b;color:var(--text);font:15px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif}
body{min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden}
a{color:inherit}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 16px;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:800;letter-spacing:.14em;font-size:14px}
.bar nav{display:flex;align-items:center;gap:16px;font-size:14px}
.bar nav a{text-decoration:none;color:var(--muted)}
.bar nav a:hover{color:var(--text)}
.bar .join{color:#fff;background:var(--pink);padding:8px 14px;border-radius:999px;font-weight:700}
.bar .join:hover{color:#fff}
@media (max-width:420px){.bar nav a:not(.join){display:none}}
main{flex:1;display:flex;flex-direction:column;align-items:center;gap:10px;padding:12px 16px 24px}
.pre{position:absolute;opacity:0;pointer-events:none;font-family:Bungee}
.pre-m{font-family:Monoton}
#stage{position:relative;width:min(100%,calc((100vh - 150px) * 1.6));min-width:min(100%,320px);aspect-ratio:16/10;cursor:crosshair;touch-action:none}
#stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block;border-radius:6px}
.keys{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 16px;margin:0;color:var(--muted);font-size:13px}
@media (pointer:coarse){.keys span:not(.sound){display:none}}
kbd{font:600 12px/1 system-ui,sans-serif;padding:3px 6px;border:1px solid var(--line);border-bottom-width:2px;border-radius:5px;color:var(--text)}
.about{max-width:640px;margin:6px 0 0;text-align:center;color:var(--muted);font-size:13px}
