@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800;900&family=DM+Mono:wght@400;500&display=swap');
:root{font-family:'DM Mono',monospace;color:#e7f5ff;background:#080d18;font-synthesis:none;text-rendering:optimizeLegibility;--cyan:#47f6dc;--pink:#ff477e;--muted:#8292a8}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}button{font:inherit;color:inherit}#game-shell{position:relative;width:100%;height:100%;min-height:440px;overflow:hidden;background:radial-gradient(ellipse at 50% 35%,#162344,#080d18 70%)}#game{position:absolute;inset:0}#game canvas{display:block;width:100%;height:100%}.topbar{position:absolute;z-index:2;top:0;left:0;right:0;height:88px;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;border-bottom:1px solid #b3ddff18;background:linear-gradient(#080d18c9,transparent)}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#e7f5ff;font-size:11px;line-height:1.05;letter-spacing:1px}.brand b{color:var(--cyan)}.brand-mark{font:800 28px 'Barlow Condensed',sans-serif;border:1px solid var(--cyan);color:var(--cyan);padding:0 8px;line-height:32px;transform:skew(-8deg)}.run-stats{display:flex;gap:34px}.run-stats div{display:grid;gap:3px}.run-stats small{font-size:9px;color:var(--muted);letter-spacing:1.3px}.run-stats strong{font:700 19px 'Barlow Condensed',sans-serif;letter-spacing:1px}.icon-button,.close-button{border:1px solid #a5b8d138;background:#0a1120a8;width:38px;height:38px;border-radius:50%;font-size:21px;cursor:pointer}.player-badge{position:absolute;z-index:2;top:100px;right:5vw;display:flex;align-items:center;gap:8px;padding:8px 13px;border:1px solid #a5b8d124;border-radius:30px;background:#09101bb8;font-size:11px}.player-badge small{color:var(--muted)}.online-dot,footer i{width:6px;height:6px;background:var(--cyan);box-shadow:0 0 9px var(--cyan);border-radius:50%}.player-badge button{background:transparent;border:0;color:var(--cyan);cursor:pointer;font-size:10px}.overlay{position:absolute;z-index:1;left:10vw;top:50%;transform:translateY(-44%);max-width:500px;pointer-events:none}.overlay>*{pointer-events:auto}.eyebrow{color:var(--cyan);font-size:10px;letter-spacing:2px;display:flex;align-items:center;gap:9px}.eyebrow i{width:17px;height:1px;background:var(--cyan)}h1,h2{font:900 clamp(68px,11vw,132px)/.78 'Barlow Condensed',sans-serif;letter-spacing:-2px;margin:21px 0;color:#f0f7ff}h1 span,h2 span{color:var(--cyan)}.overlay p{font-size:12px;color:#a3b4ca;letter-spacing:.3px;margin:25px 0}.controls{display:flex;flex-wrap:wrap;gap:11px 20px;color:#8090a6;font-size:9px;letter-spacing:.5px;margin:30px 0}.controls span{display:flex;align-items:center;gap:4px}kbd{font:10px 'DM Mono',monospace;color:#dce8f5;border:1px solid #b7cde038;background:#101a2b;padding:5px 7px;border-radius:3px}.primary-button{border:0;background:var(--cyan);color:#08111b;padding:15px 21px;font-weight:500;font-size:11px;letter-spacing:1px;cursor:pointer;min-width:165px;display:flex;justify-content:space-between;align-items:center;clip-path:polygon(0 0,100% 0,100% 78%,92% 100%,0 100%)}.primary-button:hover{filter:brightness(1.15)}footer{position:absolute;z-index:2;left:5vw;right:5vw;bottom:20px;display:flex;justify-content:space-between;color:#76869b;font-size:9px;letter-spacing:1px}footer b{color:var(--pink);padding:0 4px}footer span:last-child{display:flex;align-items:center;gap:8px}.compact{left:50%;top:50%;transform:translate(-50%,-45%);width:min(430px,86vw);padding:30px;background:#0a1120eF;border:1px solid #9bdad72e;box-shadow:0 20px 90px #0009}.compact h2{font-size:75px}.compact p{margin:18px 0}.board{max-height:80vh;overflow:auto}.close-button{position:absolute;right:20px;top:20px}.board h2{font-size:57px}.board ol{padding-left:25px;color:var(--cyan);font-size:12px}.board li{padding:10px 3px;border-bottom:1px solid #ffffff12}.board li span{color:#e7f5ff}.muted{color:var(--muted)!important}
@media(max-width:640px){.topbar{height:70px;padding:0 18px}.player-badge{top:80px;right:16px;font-size:9px}.overlay{left:7vw;top:48%;max-width:86vw}h1{font-size:clamp(72px,20vw,110px)}.controls{gap:8px 12px}.controls span{font-size:8px}footer{left:18px;right:18px;bottom:13px;font-size:8px}.run-stats{gap:15px}.icon-button{width:32px;height:32px}}
.end-actions{display:flex;gap:10px;flex-wrap:wrap}.secondary-button{min-width:125px;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;gap:18px;background:#111b2c;border:1px solid #9cbbd340;color:#d1dfec;font-size:11px;letter-spacing:1px;cursor:pointer;clip-path:polygon(0 0,100% 0,100% 78%,92% 100%,0 100%)}.secondary-button:hover{border-color:var(--cyan);color:var(--cyan)}