*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#070b12;color:#eef7ff;font-family:Inter,Segoe UI,Arial,sans-serif}canvas{display:block;width:100%;height:100%}#hud{position:fixed;inset:0;pointer-events:none}.topbar{position:absolute;top:18px;left:50%;transform:translateX(-50%);display:flex;gap:28px;align-items:center;padding:10px 18px;background:#07111dcc;border:1px solid #36d9ff55;clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%);font-weight:800;letter-spacing:1px}#team{color:#36d9ff}#timer{font-variant-numeric:tabular-nums}.status{position:absolute;left:24px;bottom:22px;display:flex;gap:12px}.status div{min-width:110px;padding:10px 14px;background:#07111ddd;border-left:3px solid #36d9ff}.status small{display:block;color:#8aa1b5;font-size:10px;letter-spacing:2px}.status strong{font-size:27px}#feed{position:absolute;right:20px;top:75px;text-align:right;color:#bceeff}#crosshair{position:absolute;left:50%;top:50%;width:18px;height:18px;transform:translate(-50%,-50%)}#crosshair:before,#crosshair:after{content:"";position:absolute;background:#fff;box-shadow:0 0 5px #36d9ff}#crosshair:before{width:18px;height:2px;top:8px}#crosshair:after{height:18px;width:2px;left:8px}.panel{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(520px,calc(100% - 30px));padding:34px;background:linear-gradient(145deg,#101b2bea,#07101aee);border:1px solid #36d9ff66;box-shadow:0 0 60px #006d8d55;text-align:center}.panel h1{margin:0;font-size:clamp(42px,9vw,76px);font-style:italic;letter-spacing:-3px;color:#fff;text-shadow:4px 4px #ff2851}.eyebrow{color:#36d9ff;letter-spacing:4px;font-size:11px}.panel label{display:block;margin:22px auto 12px;color:#8aa1b5}.panel input{display:block;width:100%;margin-top:8px;padding:13px;background:#050a11;border:1px solid #334b60;color:white;text-align:center;font-size:18px}.panel button{width:100%;padding:15px;border:0;background:#ff2851;color:white;font-weight:900;letter-spacing:2px;cursor:pointer}.help{font-size:12px;color:#8aa1b5}.panel nav{display:flex;justify-content:center;gap:16px}.panel a{color:#36d9ff;font-size:12px}.hidden{display:none!important}#message{position:fixed;left:50%;top:35%;transform:translate(-50%,-50%);font-size:26px;font-weight:900;text-shadow:0 2px 10px #000;pointer-events:none}#mobile-controls{display:none;position:fixed;inset:0;pointer-events:none}#mobile-controls button,#joystick{pointer-events:auto;touch-action:none}#joystick{position:absolute;left:25px;bottom:35px;width:130px;height:130px;border-radius:50%;border:2px solid #ffffff33;background:#ffffff10}#joystick i{position:absolute;left:40px;top:40px;width:48px;height:48px;border-radius:50%;background:#36d9ff88}#shoot,#reload,#jump{position:absolute;border-radius:50%;border:2px solid #ffffff55;color:#fff;font-weight:800;background:#ff285188}#shoot{right:28px;bottom:42px;width:92px;height:92px}#reload{right:128px;bottom:130px;width:55px;height:55px;background:#36d9ff66}#jump{right:138px;bottom:45px;width:68px;height:68px;background:#43d17a88}#skills{position:absolute;right:20px;bottom:22px;display:flex;gap:8px}#skills div{padding:8px 10px;background:#07111ddd;border-bottom:2px solid #ff7b35;font-size:11px;color:#9fb2c3}#skills span{display:block;margin-top:3px;color:#ff7b35;font-weight:800}#skills span.ready{color:#43d17a}#mobile-skills{position:absolute;right:20px;bottom:150px;display:flex;gap:7px;pointer-events:auto}#mobile-skills button{position:static;width:44px;height:44px;padding:0;border:1px solid #ffffff55;border-radius:8px;background:#7736aa99;color:#fff;font-weight:800;touch-action:none}#damage-flash{position:fixed;inset:0;background:#ff173c55;opacity:0;pointer-events:none;transition:opacity .12s}#damage-flash.active{opacity:1}#portal-link{position:fixed;top:18px;left:18px;z-index:30;padding:8px 12px;background:#07111dcc;border:1px solid #36d9ff66;color:#36d9ff;font-size:11px;font-weight:800;letter-spacing:2px;text-decoration:none;pointer-events:auto;backdrop-filter:blur(6px)}#portal-link:hover{background:#36d9ff22;color:#fff}.hud-nav{position:fixed;top:18px;left:18px;z-index:30;display:flex;gap:8px;pointer-events:auto}#resume-link{position:static;padding:8px 12px;background:#07111dcc;border:1px solid #2cff7a66;color:#2cff7a;font-size:11px;font-weight:800;letter-spacing:2px;text-decoration:none;backdrop-filter:blur(6px)}#resume-link:hover{background:#2cff7a22;color:#fff}@media(pointer:coarse),(max-width:760px){#mobile-controls{display:block}.status{left:12px;bottom:180px}.status div{min-width:76px;padding:7px}.status strong{font-size:20px}.topbar{top:8px;gap:10px;width:95%;justify-content:center;font-size:12px}.help{display:none}#skills{right:8px;top:55px;bottom:auto;flex-direction:column}}