:root{--hex-light:#6dd5d0;--hex-dark:#3a9ba8;--glow-cyan:#5eead4;--panel-bg:#06161cc7;--panel-cut:14px;--text-color:#fff;--text-stroke:#04141a;--font-game:"Fredoka", system-ui, sans-serif}*{box-sizing:border-box;margin:0;padding:0}html,body{background:var(--hex-dark);width:100%;height:100%;font-family:var(--font-game);overflow:hidden}canvas{display:block;position:fixed;top:0;left:0;width:100%!important;height:100%!important}.hex-bg{background-color:var(--hex-dark);background-image:radial-gradient(circle at 30% 15%, #ffffff14, transparent 55%), linear-gradient(30deg, var(--hex-light) 12%, transparent 12.5%, transparent 87%, var(--hex-light) 87.5%, var(--hex-light)), linear-gradient(150deg, var(--hex-light) 12%, transparent 12.5%, transparent 87%, var(--hex-light) 87.5%, var(--hex-light)), linear-gradient(30deg, var(--hex-light) 12%, transparent 12.5%, transparent 87%, var(--hex-light) 87.5%, var(--hex-light)), linear-gradient(150deg, var(--hex-light) 12%, transparent 12.5%, transparent 87%, var(--hex-light) 87.5%, var(--hex-light)), linear-gradient(60deg, var(--hex-light) 25%, transparent 25.5%, transparent 75%, var(--hex-light) 75.5%, var(--hex-light)), linear-gradient(60deg, var(--hex-light) 25%, transparent 25.5%, transparent 75%, var(--hex-light) 75.5%, var(--hex-light));background-position:0 0,0 0,0 0,40px 70px,40px 70px,0 0,40px 70px;background-size:100% 100%,80px 140px,80px 140px,80px 140px,80px 140px,80px 140px,80px 140px;animation:60s linear infinite hexDrift}@keyframes hexDrift{0%{background-position:0 0,0 0,0 0,40px 70px,40px 70px,0 0,40px 70px}to{background-position:0 0,80px 140px,80px 140px,120px 210px,120px 210px,80px 140px,120px 210px}}.panel-tech{background:var(--panel-bg);clip-path:polygon(var(--panel-cut) 0, calc(100% - var(--panel-cut)) 0, 100% var(--panel-cut), 100% calc(100% - var(--panel-cut)), calc(100% - var(--panel-cut)) 100%, var(--panel-cut) 100%, 0 calc(100% - var(--panel-cut)), 0 var(--panel-cut));box-shadow:inset 0 0 0 2px var(--glow-cyan);filter:drop-shadow(0 0 2px var(--glow-cyan)) drop-shadow(0 0 10px #5eead480);position:relative}.text-outline{color:var(--text-color);-webkit-text-stroke:1.5px var(--text-stroke);text-shadow:-2px -2px 0 var(--text-stroke), 2px -2px 0 var(--text-stroke), -2px 2px 0 var(--text-stroke), 2px 2px 0 var(--text-stroke), 0 3px 6px #00000080}#hud{z-index:10;pointer-events:none;padding:8px 20px;font-size:18px;font-weight:600;position:fixed;top:16px;left:16px}#leaderboard{z-index:10;width:210px;color:var(--text-color);pointer-events:none;padding:10px 14px;font-size:13px;position:fixed;top:68px;left:16px}.lb-title{letter-spacing:1px;text-align:center;margin-bottom:6px;font-size:14px}.lb-list{flex-direction:column;gap:2px;list-style:none;display:flex}.lb-row{color:#cfe9e7;border-radius:4px;align-items:center;gap:6px;padding:2px 4px;display:flex}.lb-row.lb-me{color:var(--glow-cyan);background:#5eead438;font-weight:600}.lb-rank{width:34px;color:inherit;opacity:.85;flex-shrink:0}.lb-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.lb-size{text-align:right;flex-shrink:0}.lb-self{color:var(--glow-cyan);text-align:center;border-top:1px solid #5eead459;margin-top:6px;padding-top:6px;font-weight:600}#gameover{z-index:100;background:#000000bf;flex-direction:column;justify-content:center;align-items:center;gap:16px;display:flex;position:fixed;inset:0}.go-title{letter-spacing:4px;filter:drop-shadow(0 0 16px #e74c3c);font-size:64px;font-weight:700}.go-sub{color:#ddd;font-size:20px;font-weight:500}#respawn-btn{color:#fff;cursor:pointer;background:linear-gradient(#ff6b5b,#e74c3c);border:none;border-radius:8px;margin-top:8px;padding:12px 36px;font-family:inherit;font-size:20px;font-weight:600;transition:transform 80ms,box-shadow 80ms,filter .15s;box-shadow:0 4px #a93226,0 6px 12px #00000059}#respawn-btn:hover{filter:brightness(1.05)}#respawn-btn:active{transform:translateY(3px);box-shadow:0 1px #a93226,0 2px 6px #0000004d}#auth-screen,#main-menu{z-index:200;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.auth-box,.menu-box{flex-direction:column;gap:16px;width:min(380px,90vw);padding:32px 28px;display:flex}.auth-title,.menu-title{letter-spacing:2px;text-align:center;font-size:26px;font-weight:700}.auth-tabs{border:1px solid #5eead459;border-radius:8px;display:flex;overflow:hidden}.auth-tab{color:#8fd8d3;cursor:pointer;background:#04141a99;border:none;flex:1;padding:10px;font-family:inherit;font-size:14px;font-weight:600;transition:background .2s,color .2s}.auth-tab.active{color:var(--glow-cyan);background:#5eead42e}.auth-form{flex-direction:column;gap:10px;display:flex}.auth-form input{color:#fff;background:#041014b3;border:1px solid #5eead459;border-radius:6px;padding:10px 12px;font-family:inherit;font-size:14px}.auth-form input:focus{border-color:var(--glow-cyan);outline:none}.auth-submit,.play-wrap,.menu-btn{font-family:inherit}.auth-submit{color:#042a2d;cursor:pointer;background:linear-gradient(#7ee8e3,#2f8f95);border:none;border-radius:8px;padding:11px;font-size:15px;font-weight:700;transition:transform 80ms,box-shadow 80ms,filter .15s;box-shadow:0 4px #1f6a6f,0 6px 10px #0000004d}.auth-submit:hover{filter:brightness(1.06)}.auth-submit:active{transform:translateY(3px);box-shadow:0 1px #1f6a6f,0 2px 6px #00000040}.auth-submit:disabled{color:#9fc2c0;box-shadow:none;cursor:default;background:#38585b;transform:none}.auth-error{color:#ff6b6b;text-align:center;min-height:18px;font-size:13px;font-weight:600}.auth-guest{color:#9fc2c0;cursor:pointer;background:0 0;border:1px solid #5eead459;border-radius:6px;padding:10px;font-family:inherit;font-size:13px;transition:border-color .2s,color .2s}.auth-guest:hover{border-color:var(--glow-cyan);color:var(--glow-cyan)}#top-actions{z-index:10;gap:8px;display:flex;position:fixed;top:16px;right:16px}#quit-btn,#logout-btn{color:#9fc2c0;cursor:pointer;background:#06161cd9;border:1px solid #5eead459;border-radius:6px;padding:8px 14px;font-family:inherit;font-size:13px;font-weight:600;transition:border-color .2s,color .2s}#quit-btn:hover,#logout-btn:hover{border-color:var(--glow-cyan);color:var(--glow-cyan)}#quit-btn:disabled,#logout-btn:disabled{opacity:.6;cursor:default}.menu-user{text-align:center;letter-spacing:1px;text-transform:uppercase;font-size:13px;font-weight:600}.menu-title{margin-top:-6px}.menu-stats{background:#04101499;border:1px solid #5eead44d;border-radius:8px;flex-direction:column;gap:6px;padding:12px 14px}.menu-stat{color:#cfe9e7;justify-content:space-between;font-size:13px;display:flex}.menu-stat-label{color:#7fb8b5}.menu-stat-value{color:#fff;font-weight:700}.menu-actions{flex-direction:column;align-items:center;gap:16px;display:flex}.play-wrap{flex-direction:column;align-items:center;gap:8px;display:flex}.play-btn{cursor:pointer;background:radial-gradient(circle at 35% 28%,#b3f08a,#5fbf3a 55%,#3f9424 100%);border:none;border-radius:50%;justify-content:center;align-items:center;width:92px;height:92px;transition:transform 80ms,box-shadow 80ms,filter .15s;display:flex;box-shadow:0 6px #2f7a1c,0 10px 18px #00000073,0 0 0 3px #5eead48c}.play-btn:hover{filter:brightness(1.08)}.play-btn:active{transform:translateY(4px);box-shadow:0 2px #2f7a1c,0 4px 10px #0006,0 0 0 3px #5eead48c}.play-triangle{filter:drop-shadow(0 2px 1px #0000004d);border-top:16px solid #0000;border-bottom:16px solid #0000;border-left:26px solid #fff;width:0;height:0;margin-left:6px}.play-label{letter-spacing:1px;font-size:15px;font-weight:700}.menu-btn{cursor:pointer;border:none;border-radius:8px;width:100%;padding:13px;font-size:16px;font-weight:700;transition:background .2s,opacity .2s}.menu-btn-secondary{color:#7fb8b5;background:#04101499;border:1px solid #5eead44d;flex-direction:column;align-items:center;gap:2px;display:flex}.menu-btn-secondary:disabled{cursor:default;opacity:.7}.menu-soon{color:#5a7a78;letter-spacing:.5px;font-size:11px;font-weight:500}