:root{color-scheme:dark;font-family:system-ui,sans-serif;background:#04090c;color:#d4ebe0}
nav{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
#loading{align-items:flex-start!important;justify-content:flex-end!important;text-align:left!important;padding:5%!important;gap:0!important}
#loading .loading-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
#loading::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#04090c 4%,#04090ce8 31%,#04090c30 80%);z-index:1}
#loading>:not(.loading-art):not(.loading-motes){position:relative;z-index:2}
#loading h2{margin:10px 0;max-width:80%;font-family:Georgia,serif}
#loading .loading-motes{position:absolute;top:10%;left:8%;width:84%;color:#d6b77a;font:clamp(14px,2vw,25px)/3 monospace;white-space:pre;opacity:.4;animation:loading-drift 9s ease-in-out infinite;z-index:1}
@keyframes loading-drift{0%,100%{transform:translateY(10px);opacity:.15}50%{transform:translate(12px,-16px);opacity:.55}}
dialog{color:#d4ebe0;background:#09191f;border:1px solid #568e83;padding:28px;width:min(780px,95vw);max-height:90vh;overflow:auto}
dialog::backdrop{background:#020709cf;backdrop-filter:blur(4px)}dialog h2{margin:12px 0}.rank-close{float:right}
select,input{font:inherit;background:#10282d;color:#d4ebe0;border:1px solid #568e83;padding:10px;border-radius:3px}
.rank-table{overflow:auto;margin:20px 0}table{width:100%;border-collapse:collapse;text-align:left;font-size:14px}th{color:#82e0cc;font-size:12px}th,td{padding:12px 10px;border-bottom:1px solid #264048}td:nth-child(n+3){font-variant-numeric:tabular-nums;white-space:nowrap}
#score-name-form div{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap}#score-name-form[hidden]{display:none}#rank-notice:empty,#rank-storage:empty{display:none}#rank-notice{color:#d6b77a}
@media(prefers-reduced-motion:reduce){#loading .loading-motes{animation:none}}
@media(max-width:700px){nav button{padding:8px;font-size:11px}dialog{padding:16px}#loading .loading-motes{display:none}#loading .small{max-width:90%}#loading h2{font-size:22px}#loading progress{margin:6px 0}#loading p{margin:3px 0!important}}
*{box-sizing:border-box}body{margin:0}main{max-width:1328px;margin:auto;padding:20px 24px}header{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px}h1{font-size:26px;font-weight:600;margin:3px 0}h2{font-size:clamp(22px,3vw,38px);font-weight:500}.eyebrow{font-size:11px;letter-spacing:.2em;color:#82e0cc;margin:0}button{border:1px solid #568e83;background:#0d272a;color:#d4ebe0;border-radius:4px;font:inherit;padding:12px 22px;cursor:pointer}button:hover{background:#173b3c}button:disabled{opacity:.4;cursor:wait}button:focus-visible{outline:2px solid #82e0cc;outline-offset:4px}#game{position:relative;background:#04090c;aspect-ratio:16/9;width:100%;overflow:hidden;border:1px solid #203336}canvas{display:block;width:100%;height:100%;object-fit:contain;image-rendering:pixelated;outline:none}#loading,#error{position:absolute;inset:0;background:#04090cf5;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px;gap:10px}#loading p{margin:8px 0}#error[hidden],#loading[hidden]{display:none}#error{background:#190d10f5;color:#ffc0b4}progress{width:min(340px,80%);height:5px;accent-color:#82e0cc;margin:12px 0 20px}.small{font-size:12px;color:#8fa7a5;line-height:1.6;max-width:850px}footer{font-size:13px;line-height:2;margin-top:18px}kbd{font:12px monospace;border:1px solid #314a4d;border-radius:3px;padding:2px 5px;color:#82e0cc}#game:fullscreen{width:100vw;height:100vh;aspect-ratio:auto;border:0}#game:fullscreen canvas{width:100%;height:100%;object-fit:contain}@media(max-width:700px){main{padding:12px}h1{font-size:21px}header{margin-bottom:12px}#loading{padding:10px;gap:0}#loading h2{margin:6px}#loading .small{font-size:10px}footer{line-height:2.6}}