:root{--ivory:#efe8da;--accent:#3fe8d2;--amber:#ffb224;--ink:#070a1c;font-family:Helvetica Neue,Helvetica,Inter,system-ui,sans-serif}*{box-sizing:border-box;margin:0}html,body{background:var(--ink);height:100%;color:var(--ivory);-webkit-user-select:none;user-select:none;overflow:hidden}#view{width:100%;height:100%;display:block;position:fixed;inset:0}.hidden{display:none!important}#hud{pointer-events:none;position:fixed;inset:0}#crosshair{--gap:5px;width:0;height:0;position:absolute;top:50%;left:50%}#crosshair i{background:var(--ivory);opacity:.9;transition:opacity .12s;position:absolute;box-shadow:0 0 4px #0009}#crosshair i:first-child{width:1.5px;height:7px;left:-.75px;top:calc(-7px - var(--gap))}#crosshair i:nth-child(2){width:1.5px;height:7px;left:-.75px;top:var(--gap)}#crosshair i:nth-child(3){width:7px;height:1.5px;top:-.75px;left:calc(-7px - var(--gap))}#crosshair i:nth-child(4){width:7px;height:1.5px;top:-.75px;left:var(--gap)}#crosshair b{background:var(--accent);width:3px;height:3px;box-shadow:0 0 6px var(--accent);border-radius:50%;position:absolute;top:-1.5px;left:-1.5px}#crosshair.busy i{opacity:.35}#crosshair.busy b{background:var(--ivory);box-shadow:none;opacity:.5}#hitmarker{opacity:0;background:linear-gradient(var(--ivory), var(--ivory)) center / 1.5px 100% no-repeat, linear-gradient(var(--ivory), var(--ivory)) center / 100% 1.5px no-repeat;width:22px;height:22px;transition:opacity .18s,transform .18s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)rotate(45deg)scale(.6);-webkit-mask:radial-gradient(circle,#0000 5px,#000 5.5px);mask:radial-gradient(circle,#0000 5px,#000 5.5px)}#hitmarker.show{opacity:1;transition:none;transform:translate(-50%,-50%)rotate(45deg)scale(1)}#hitmarker.kill{background:linear-gradient(var(--amber), var(--amber)) center / 2px 100% no-repeat, linear-gradient(var(--amber), var(--amber)) center / 100% 2px no-repeat;width:30px;height:30px}#damage-dir{opacity:0;background:conic-gradient(from -22deg,#0000 0deg,#ffa02af2 22deg,#0000 44deg);border-radius:50%;width:240px;height:240px;transition:opacity .5s;position:absolute;top:50%;left:50%;-webkit-mask:radial-gradient(circle,#0000 108px,#000 110px 118px,#0000 120px);mask:radial-gradient(circle,#0000 108px,#000 110px 118px,#0000 120px)}#damage-dir.show{opacity:1;transition:none}#status{letter-spacing:.32em;opacity:.62;white-space:nowrap;gap:18px;font-size:11px;display:flex;position:absolute;top:26px;left:50%;transform:translate(-50%)}#kills{color:var(--amber)}#banner{letter-spacing:.6em;opacity:0;white-space:nowrap;text-shadow:0 0 24px #3fe8d280;padding-left:.6em;font-size:30px;font-weight:200;transition:opacity .6s,transform .6s;position:absolute;top:24%;left:50%;transform:translate(-50%)translateY(8px)}#banner.show{opacity:.95;transform:translate(-50%)}#prompt{letter-spacing:.3em;opacity:0;color:var(--accent);font-size:11px;transition:opacity .2s;position:absolute;top:calc(50% + 46px);left:50%;transform:translate(-50%)}#prompt.show{opacity:.9}#health{gap:6px;display:flex;position:absolute;bottom:32px;left:34px}#health i{background:var(--ivory);width:26px;height:7px;transition:background .3s,box-shadow .3s;transform:skew(-18deg);box-shadow:0 0 10px #efe8da73}#health i.off{box-shadow:none;background:#efe8da24}#ammo{align-items:flex-end;gap:12px;display:flex;position:absolute;bottom:26px;right:34px}#ammo-count{letter-spacing:.04em;font-variant-numeric:tabular-nums;font-size:34px;font-weight:200;line-height:.9}#ammo-pips{gap:3px;padding-bottom:3px;display:flex}#ammo-pips i{background:var(--accent);width:3px;height:14px;box-shadow:0 0 6px #3fe8d299}#ammo-pips i.off{box-shadow:none;background:#efe8da29}#ammo-pips.reloading{animation:.5s infinite blink}@keyframes blink{50%{opacity:.3}}#timebar{background:#efe8da24;width:150px;height:2px;position:absolute;bottom:36px;left:50%;transform:translate(-50%)}#timebar-fill{background:var(--accent);transform-origin:50%;width:100%;height:100%;box-shadow:0 0 8px var(--accent);transform:scaleX(.04)}.screen{text-align:center;-webkit-backdrop-filter:blur(3px);background:radial-gradient(#070a1c80,#070a1ce6);place-items:center;display:grid;position:fixed;inset:0}.panel{flex-direction:column;align-items:center;gap:22px;padding:24px;display:flex}h1{letter-spacing:.42em;padding-left:.42em;font-size:clamp(36px,8vw,84px);font-weight:100}h2{letter-spacing:.4em;text-transform:uppercase;padding-left:.4em;font-size:clamp(24px,4.5vw,44px);font-weight:200}.tag{letter-spacing:.14em;opacity:.66;font-size:13px}.stats{letter-spacing:.24em;text-transform:uppercase;color:var(--amber);font-size:15px}.hint{letter-spacing:.2em;opacity:.4;margin-top:-10px;font-size:11px}.cta{font:inherit;letter-spacing:.4em;text-transform:uppercase;color:var(--ink);background:var(--ivory);cursor:pointer;border:0;margin-top:6px;padding:15px 30px 15px calc(30px + .4em);font-size:12px;transition:background .2s,box-shadow .2s}.cta:hover{background:var(--accent);box-shadow:0 0 34px #3fe8d273}.keys{grid-template-columns:repeat(3,auto);gap:12px 30px;margin-top:14px;padding:0;list-style:none;display:grid}.keys li{letter-spacing:.16em;flex-direction:column;gap:5px;font-size:11px;display:flex}.keys kbd{font:inherit;color:var(--accent);text-transform:uppercase}.keys span{opacity:.55;text-transform:uppercase}.credit{letter-spacing:.24em;text-transform:uppercase;width:max-content;max-width:calc(100% - 32px);color:var(--ivory);flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 14px;font-size:11px;display:flex;position:absolute;bottom:22px;left:50%;transform:translate(-50%)}.credit a{color:inherit;opacity:.45;text-decoration:none;transition:opacity .2s,color .2s}.credit a:hover{opacity:1;color:var(--accent)}.credit .sep{opacity:.25}@media (width<=520px){.credit .sep{display:none}}#crosshair.hide{opacity:0}#weapons{letter-spacing:.22em;white-space:nowrap;gap:16px;font-size:10px;display:flex;position:absolute;bottom:74px;right:34px}#weapons span{opacity:.32;transition:opacity .2s,color .2s}#weapons b{opacity:.7;margin-right:6px;font-weight:400}#weapons span.on{opacity:1;color:var(--accent)}#ammo-pips.many{gap:2px}#ammo-pips.many i{width:2px}#scope{opacity:0;background:radial-gradient(circle,#0000 0 38vh,#3fe8d280 38.2vh,#02030af7 38.7vh);transition:opacity 80ms;position:absolute;inset:0}#scope.show{opacity:1}#scope i{background:#efe8dabf;position:absolute}#scope i:first-child{width:1px;height:76vh;top:calc(50% - 38vh);left:50%}#scope i:nth-child(2){width:76vh;height:1px;top:50%;left:calc(50% - 38vh)}#scope:after{content:"";background:var(--accent);width:5px;height:5px;box-shadow:0 0 8px var(--accent);border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#damage-dir{transform:translate(-50%,-50%)}.keys{grid-template-columns:repeat(3,auto)}html,body{touch-action:none;overscroll-behavior:none}.touch-help{letter-spacing:.12em;opacity:.7;max-width:260px;font-size:12px;line-height:1.6;display:none}body.touch .keys{display:none}body.touch .touch-help{display:block}#touch{touch-action:none;-webkit-tap-highlight-color:transparent;display:none;position:fixed;inset:0}body.touch.playing #touch{display:block}#t-look{position:absolute;inset:0}#t-stick{width:48%;height:50%;position:absolute;bottom:0;left:0}#t-base{left:30px;bottom:calc(40px + env(safe-area-inset-bottom));pointer-events:none;background:#efe8da0d;border:1.5px solid #efe8da47;border-radius:50%;place-items:center;width:120px;height:120px;transition:border-color .15s;display:grid;position:absolute}#t-base.on{border-color:var(--accent)}#t-knob{background:#efe8da66;border-radius:50%;width:54px;height:54px;box-shadow:0 0 18px #3fe8d259}.t-btn{font:inherit;letter-spacing:.16em;color:var(--ivory);-webkit-backdrop-filter:blur(4px);touch-action:none;-webkit-user-select:none;user-select:none;background:#070a1c6b;border:1.5px solid #efe8da57;border-radius:50%;place-items:center;padding:0;font-size:10px;display:grid;position:absolute}.t-btn:active,.t-btn.on,.t-btn.active{border-color:var(--accent);background:#3fe8d24d}#t-fire{right:22px;bottom:calc(58px + env(safe-area-inset-bottom));border-color:var(--accent);width:92px;height:92px;font-size:12px}#t-jump{right:128px;bottom:calc(34px + env(safe-area-inset-bottom));width:62px;height:62px}#t-zoom{right:112px;bottom:calc(118px + env(safe-area-inset-bottom));width:58px;height:58px}#t-reload{right:30px;bottom:calc(168px + env(safe-area-inset-bottom));width:54px;height:54px;font-size:13px}#t-weapon{right:14px;top:calc(58px + env(safe-area-inset-top));width:auto;height:34px;color:var(--accent);border-radius:17px;padding:0 14px 0 16px}#t-pause{left:14px;top:calc(14px + env(safe-area-inset-top));letter-spacing:.1em;width:38px;height:38px;font-size:11px}body.touch #health{left:64px;top:calc(28px + env(safe-area-inset-top));gap:4px;bottom:auto}body.touch #health i{width:17px;height:6px}body.touch #ammo{right:16px;top:calc(14px + env(safe-area-inset-top));gap:8px;bottom:auto}body.touch #ammo-count{font-size:26px}body.touch #ammo-pips i{height:11px}body.touch #weapons{display:none}body.touch #status{top:calc(62px + env(safe-area-inset-top));gap:12px;font-size:9px;left:16px;transform:none}body.touch #timebar{bottom:calc(14px + env(safe-area-inset-bottom));width:110px}body.touch #banner{font-size:20px}body.touch #scope{background:radial-gradient(circle,#0000 0 44vmin,#3fe8d280 44.3vmin,#02030af7 45vmin)}body.touch #scope i:first-child{height:88vmin;top:calc(50% - 44vmin)}body.touch #scope i:nth-child(2){width:88vmin;left:calc(50% - 44vmin)}.ghost{font:inherit;letter-spacing:.24em;text-transform:uppercase;cursor:pointer;color:var(--accent);background:0 0;border:1px solid #3fe8d266;margin-top:-8px;padding:10px 18px 10px calc(18px + .24em);font-size:11px;transition:background .2s}.ghost:hover{background:#3fe8d224}#shout{letter-spacing:.04em;color:#8fdcff;text-shadow:0 0 22px #50b4ffcc,0 3px #070a1cb3;opacity:0;white-space:nowrap;pointer-events:none;font-size:clamp(26px,6vw,54px);font-style:italic;font-weight:800;position:absolute;top:34%;left:50%;transform:translate(-50%)rotate(-4deg)scale(.6)}#shout.show{animation:1.1s cubic-bezier(.2,.9,.3,1) forwards shout}@keyframes shout{0%{opacity:0;transform:translate(-50%)rotate(-4deg)scale(.5)}14%{opacity:1;transform:translate(-50%)rotate(-4deg)scale(1.12)}26%{transform:translate(-50%)rotate(-4deg)scale(1)}75%{opacity:1}to{opacity:0;transform:translate(-50%,-22px)rotate(-4deg)scale(1.04)}}#t-view{right:14px;top:calc(100px + env(safe-area-inset-top));border-radius:17px;width:auto;height:34px;padding:0 14px 0 16px}#hint{letter-spacing:.2em;text-transform:uppercase;flex-direction:column;gap:9px;font-size:10px;display:flex;position:absolute;top:24px;left:34px}#hint span{opacity:.6;align-items:center;gap:10px;transition:opacity .4s;display:flex}#hint b{text-align:center;white-space:nowrap;min-width:26px;color:var(--accent);border:1px solid #3fe8d273;border-radius:4px;padding:4px 7px;font-weight:400}#hint i{font-style:normal}#hint span.flash{animation:1.6s ease-out hint-flash}@keyframes hint-flash{0%,35%{opacity:1;text-shadow:0 0 12px var(--accent)}to{opacity:.6}}body.touch #hint{display:none}#threat{color:#35d6ff}.row{flex-wrap:wrap;justify-content:center;gap:12px;margin-top:-8px;display:flex}.row .ghost{margin-top:0}#install-tip{color:var(--accent);opacity:.85;margin-top:-8px;font-size:11px}
