:root { color-scheme: dark; background: #141b29; color: #eee1c9; }
* { box-sizing: border-box; }
html, body { margin: 0; width: 100%; height: 100%; overflow: hidden; overscroll-behavior: none; }
body { touch-action: none; font-family: system-ui, sans-serif; }
#canvas { display: block; outline: none; width: 100%; height: 100%; }
#loading { position: fixed; inset: 0; background: #141b29; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 24px; padding: 32px; }
#loading-name { font-size: 20px; font-weight: 400; letter-spacing: .04em; }
progress { appearance: none; border: 0; border-radius: 2px; width: min(220px, 65vw); height: 2px; background: #323c47; accent-color: #eee1c9; }
progress::-webkit-progress-bar { background: #323c47; }
progress::-webkit-progress-value { background: #eee1c9; transition: width .2s; }
progress::-moz-progress-bar { background: #eee1c9; }
#notice { max-width: 360px; text-align: center; line-height: 1.5; font-size: 15px; color: #bbb7ad; }
button { font: inherit; color: inherit; background: transparent; padding: 10px 18px; border: 1px solid #727873; border-radius: 4px; cursor: pointer; }
[hidden] { display: none !important; }
noscript { position: fixed; inset: 40% 24px auto; text-align: center; }