@import url('https://fonts.googleapis.com/css2?family=Black+Ops+One&family=Share+Tech+Mono&display=swap');
:root{--c:#16e8f2;--p:#ff3f77}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}body{margin:0;min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 50% 0,#192652,#060714 54%);color:#d7fbff;font-family:'Share Tech Mono',monospace}main{width:min(920px,100%);padding:22px}header{min-height:66px;padding:8px 16px;border:1px solid #24355d;border-bottom:0;background:#090d1b;display:grid;grid-template-columns:1fr .65fr 2fr 1.1fr 36px;gap:16px;align-items:center;box-shadow:0 0 28px #101f5c inset}header div{display:grid;gap:3px}small{color:#8193ba;font-size:.7rem;letter-spacing:.12em}header b{color:var(--c);letter-spacing:.08em;white-space:nowrap}.area{grid-template-columns:auto 1fr}.area i{grid-column:1/3;height:5px;border-radius:9px;overflow:hidden;background:#17203c}.area em{display:block;width:0;height:100%;background:var(--c);box-shadow:0 0 10px var(--c);transition:width .25s}header div:nth-child(4) b{color:var(--p);text-shadow:0 0 8px var(--p)}button{border:1px solid #3d527d;color:#a8def1;background:#0c1730;font:inherit;cursor:pointer}header button{height:30px}section{position:relative;border:1px solid #30446e;box-shadow:0 0 38px #153487,0 0 12px #16e8f2 inset}canvas{touch-action:none;display:block;width:100%;height:auto;image-rendering:pixelated;background:#070b18}#overlay{position:absolute;inset:0;display:grid;place-content:center;text-align:center;background:#080c1be8}#overlay.hide{display:none}h1{margin:7px 0;font:clamp(2.8rem,10vw,5rem)/.8 'Black Ops One';color:#e9fdff;text-shadow:4px 4px #a2165c,-2px -2px #00b8df,0 0 25px var(--c)}h1 strong{color:var(--p)}#start{justify-self:center;padding:12px 25px;border-color:var(--c);background:#102e48;color:#e9fdff;box-shadow:0 0 18px #16e8f277;margin:7px 0 20px}.help{color:#94a9ca;font-size:.78rem;line-height:1.5}nav{display:none}@media(max-width:600px){main{padding:9px}header{grid-template-columns:1fr 1fr 1.6fr 34px;gap:6px;padding:8px}header div:nth-child(4){display:none}header b{font-size:.78rem}nav{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:14px}nav button{padding:15px 11px;color:var(--c);font-size:1.45rem;touch-action:manipulation;border-color:#4477a3}.help{font-size:.68rem}}