:root { color-scheme: dark; font-family: Inter, "Noto Sans JP", system-ui, sans-serif; }
* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; background: #05050e; }
#game { position: fixed; inset: 0; width: 100%; height: 100%; display: block; }
#boot { position: fixed; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 24px; text-align: center; background: radial-gradient(circle at 50% 40%, rgba(54,25,105,.62), rgba(3,3,12,.96) 65%); z-index: 10; transition: opacity .35s; }
#boot.hidden { opacity: 0; pointer-events: none; }
.logo { font-weight: 900; letter-spacing: .08em; font-size: clamp(36px, 8vw, 82px); text-shadow: 0 0 18px #9d62ff, 0 0 42px #4ce4ff; }
.logo span { color: #63efff; }
.tag { color: #d8d1ff; font-size: clamp(14px, 2vw, 22px); }
#status { min-height: 1.4em; color: #8eeeff; }
button { min-width: 220px; border: 1px solid rgba(139,237,255,.75); border-radius: 999px; padding: 13px 28px; color: white; font-weight: 800; font-size: 17px; cursor: pointer; background: linear-gradient(135deg, rgba(82,32,184,.9), rgba(0,177,214,.9)); box-shadow: 0 0 22px rgba(83,210,255,.25); }
button:disabled { opacity: .38; cursor: default; }
#desktopStart { background: rgba(255,255,255,.08); }
.help { max-width: 760px; margin-top: 8px; color: #aaa5c2; font-size: 13px; line-height: 1.8; }
#desktopHud { position: fixed; inset: 0; pointer-events: none; z-index: 4; display: none; }
#desktopHud.visible { display: block; }
#hudTop { position: absolute; left: 18px; top: 15px; padding: 10px 14px; border: 1px solid rgba(96,237,255,.3); border-radius: 10px; background: rgba(4,7,20,.6); white-space: pre-line; line-height: 1.45; font-weight: 700; }
#crosshair { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); font-size: 27px; color: rgba(145,246,255,.88); text-shadow: 0 0 10px #54edff; }
#message { position: absolute; left: 50%; top: 18%; transform: translateX(-50%); max-width: 720px; text-align: center; font-size: clamp(18px, 3vw, 34px); font-weight: 900; color: white; text-shadow: 0 0 16px #7b5cff; white-space: pre-line; }
@media (max-width: 600px) { .help { font-size: 11px; } }