:root{color-scheme:dark;--ink:#e9ece4;--muted:#acb5a8;--line:#ffffff28;--accent:#c5e6a0}*{box-sizing:border-box}body{margin:0;background:#111512;color:var(--ink);font-family:Arial,Helvetica,sans-serif}button,a,input{touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer}button:disabled{opacity:.45;cursor:default}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid var(--accent);outline-offset:4px}[hidden]{display:none!important}#scope-app{position:relative;height:100svh;min-height:570px;overflow:hidden}#scope-field{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}.optics{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 20%,#05090715 55%,#020503b0 100%),repeating-linear-gradient(transparent 0 3px,#0000000c 3px 4px);box-shadow:inset 0 0 70px #0005}.edge-marks{position:absolute;inset:82px 32px 95px;pointer-events:none;border:1px solid #c5d6b515;clip-path:polygon(0 0,35px 0,35px 1px,calc(100% - 35px) 1px,calc(100% - 35px) 0,100% 0,100% 35px,calc(100% - 1px) 35px,calc(100% - 1px) calc(100% - 35px),100% calc(100% - 35px),100% 100%,calc(100% - 35px) 100%,calc(100% - 35px) calc(100% - 1px),35px calc(100% - 1px),35px 100%,0 100%,0 calc(100% - 35px),1px calc(100% - 35px),1px 35px,0 35px)}header{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;gap:24px;padding:24px 32px;background:linear-gradient(#070b09b0,transparent);z-index:3}.wordmark{font-weight:900;font-size:19px;letter-spacing:-.5px}.location{font:10px monospace;letter-spacing:2px;color:#c0c7bd}header button{border:1px solid var(--line);background:#111b1580;min-height:40px;padding:10px 14px;font:11px monospace}#scope-sound{margin-left:auto}#scope-pause{width:42px}#reticle{position:absolute;left:50%;top:50%;width:100px;height:100px;transform:translate(-50%,-50%);pointer-events:none;color:#a1d995cc}#reticle i,#reticle b{position:absolute;display:block;background:currentColor;font-weight:normal}#reticle i{top:50%;left:0;width:100%;height:1px}#reticle b{top:50%;left:50%;width:1px;height:50%}#reticle span{position:absolute;left:calc(50% - 1px);top:calc(50% - 1px);width:2px;height:2px;background:#d2f4b7}#reticle.hit{color:#fff6d2}.readout{position:absolute;top:90px;left:42px;right:42px;display:flex;justify-content:space-between;font:11px monospace;letter-spacing:2px;color:#c6cfc0;pointer-events:none}.readout b{font-weight:normal}#scope-message{position:absolute;top:calc(50% + 75px);left:20px;right:20px;text-align:center;font:11px monospace;letter-spacing:1px;color:#d3dfc7;text-shadow:0 1px 4px #000;pointer-events:none}.controls{position:absolute;bottom:54px;left:42px;right:42px;display:flex;align-items:center;gap:12px}.controls button{border:1px solid var(--line);background:#101812c9;min-height:52px;padding:10px 18px;font:11px monospace;letter-spacing:1px}.controls small{display:block;font-size:9px;margin-top:6px;color:var(--muted)}#scope-ammo{color:var(--accent);letter-spacing:5px}#scope-fire{margin-left:auto;background:#c5e6a0;color:#172014;min-width:125px;font-weight:bold;display:flex;align-items:center;justify-content:space-between;gap:20px}#scope-fire span{font-size:24px}.welcome{position:absolute;inset:0;display:flex;align-items:center;padding:110px 8vw;background:linear-gradient(90deg,#101611ed, #101611b0 32%,#10161108 75%)}.intro-card{max-width:430px}.eyebrow{font:11px monospace;letter-spacing:2px;color:var(--accent);margin:0 0 25px}h1{font-size:clamp(60px,6.7vw,100px);line-height:.95;letter-spacing:-5px;margin:0 0 28px;font-weight:900}.lead{font-size:24px;line-height:1.35;margin:0 0 24px}.instruction{font-size:15px;line-height:1.7;color:var(--muted);margin:0 0 25px}.primary{border:0;display:flex;align-items:center;justify-content:space-between;width:100%;min-height:54px;padding:17px 20px;background:var(--accent);color:#152011;font:700 12px monospace;letter-spacing:1px}.primary span{font-size:20px}.comparison{display:block;font:12px monospace;color:#c0cbb8;margin-top:20px;text-decoration:underline;text-underline-offset:4px}.motion-setting{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:8px;margin-top:24px}.pause-layer,.end-layer,.error-layer{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#081009bd;backdrop-filter:blur(7px);z-index:5;padding:24px;overflow:auto}.end-card{width:100%;max-width:390px;text-align:center;margin:auto}.end-card h2{font-size:46px;line-height:1.05;letter-spacing:-2px;margin:10px 0 25px}.end-card p{color:var(--muted);line-height:1.6;font-size:15px}.end-card .eyebrow{color:var(--accent);font-size:11px}.end-stats{display:flex;justify-content:space-between;border-block:1px solid var(--line);padding:20px 0;margin:25px 0}.end-stats strong{display:block;font-size:30px}.end-stats span{display:block;font:10px monospace;letter-spacing:1px;margin-top:6px;color:var(--muted)}.quiet{background:none;border:0;font:12px monospace;padding:20px;margin-top:5px}footer{position:absolute;bottom:16px;left:42px;right:42px;display:flex;justify-content:space-between;gap:20px;font:10px monospace;letter-spacing:1px;color:#aebba5;pointer-events:none}footer a{pointer-events:auto}#scope-app[data-state=menu] footer{opacity:.6}#scope-app[data-state=playing][data-input=mouse] #scope-field{cursor:none}.touch-help{display:none}#scope-app[data-input=touch] .touch-help{display:inline}#scope-app[data-input=touch] .mouse-help{display:none}@media(max-width:700px){header{padding:16px;gap:10px}.wordmark{font-size:16px}.location{display:none}header button{font-size:10px;padding:8px 10px}.readout{top:77px;left:22px;right:22px}.edge-marks{inset:70px 12px 118px}.welcome{padding:100px 28px 65px;background:linear-gradient(90deg,#101611e6,#10161177)}h1{font-size:65px;letter-spacing:-3px}.lead{font-size:21px}.eyebrow{font-size:10px}.controls{left:16px;right:16px;bottom:58px;gap:8px}.controls button{padding:10px;font-size:10px}#scope-fire{min-width:92px}.controls small{font-size:9px}#scope-ammo{letter-spacing:2px}footer{left:16px;right:16px;bottom:20px;font-size:9px;letter-spacing:.3px}.end-card h2{font-size:38px}#reticle{width:80px;height:80px}}@media(max-height:720px){.welcome{padding-top:85px;padding-bottom:55px}h1{font-size:58px;margin-bottom:18px}.lead{margin-bottom:16px}.eyebrow{margin-bottom:16px}.instruction{margin-bottom:18px}.motion-setting{margin-top:16px}.comparison{margin-top:14px}}

#scope-field{filter:grayscale(1)}.asset-credit{position:absolute;bottom:36px;left:42px;z-index:3;font:9px monospace;color:#aebba5}.asset-credit a{text-decoration:underline}@media(max-width:700px){.asset-credit{left:16px;bottom:39px;font-size:8px}}
/* Keep aiming and firing reachable on short landscape phone screens. */
@media(max-height:500px){#scope-app{min-height:320px}.welcome{overflow:auto;align-items:flex-start;padding-top:80px;padding-bottom:55px}.welcome h1{font-size:40px;margin-bottom:12px}.welcome .lead{font-size:18px;margin-bottom:10px}.welcome .eyebrow{margin-bottom:10px}.welcome .instruction{margin-bottom:12px}.controls{bottom:48px}.controls button{min-height:44px}.readout{top:72px}.edge-marks{inset:65px 12px 104px}}

/* Pointer locked: the cursor is hidden, so the on-screen buttons are dimmed and the hint is emphasized. */
#scope-app[data-locked="true"] .controls{opacity:.45;pointer-events:none}
#scope-app[data-locked="true"] #scope-hint{color:#d7f3b5;letter-spacing:.14em}
.pause-help{margin:.2rem 0 1rem;opacity:.75;font-size:.85rem}

/* P1-04 night-vision play screen. The image itself comes from the IR pass in real-rat-renderer.js. */
#scope-field{filter:none}
#scope-app[data-state=playing] .optics,#scope-app[data-state=playing] .edge-marks,#scope-app[data-state=playing] .readout,#scope-app[data-state=playing] .asset-credit{display:none}
#scope-app[data-state=playing] header{background:none;padding:14px 16px}
#scope-app[data-state=playing] header .wordmark,#scope-app[data-state=playing] header .location,#scope-app[data-state=playing] #scope-sound{display:none}
#scope-app[data-state=playing] footer{opacity:.55}
#reticle{width:74px;height:74px;color:rgba(86,226,96,.92)}
#reticle i{height:1px;top:50%}
#reticle b{top:0;height:100%;width:1px;left:50%}
#reticle span{display:none}
#reticle.hit{color:rgba(170,255,170,1)}
#hud-mini{position:absolute;top:14px;left:18px;z-index:3;display:flex;flex-direction:column;gap:6px;pointer-events:none;font-family:Arial,Helvetica,sans-serif}
#hud-mini[hidden]{display:none}
#kill-count{color:#e8322a;font-weight:900;font-size:30px;letter-spacing:.5px;text-shadow:0 0 2px #000,1px 1px 0 #000,-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000}
#ammo-mini{color:#dfe6da;font:12px monospace;letter-spacing:3px;opacity:.8;text-shadow:0 1px 2px #000}
@media (pointer:fine){#scope-app[data-state=playing] .controls,#scope-app[data-state=playing] header{display:none}}
@media (pointer:coarse){#scope-app[data-state=playing] .controls button{background:#0008;border-color:#fff2}#scope-app[data-state=playing] #scope-reload{display:none}}

/* Scene picker (P1-07) */
.scenes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:14px 0 12px}
.scenes .scene{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:8px 10px;border:1px solid rgba(214,226,210,.22);background:rgba(10,14,11,.55);color:#d8e2d4;font:inherit;text-align:left;cursor:pointer}
.scenes .scene b{font-size:12px;letter-spacing:.08em}
.scenes .scene small{font-size:10px;letter-spacing:.08em;opacity:.65}
.scenes .scene.current{border-color:#7dff8a;box-shadow:inset 0 0 0 1px #7dff8a}
.scenes .scene:disabled{cursor:not-allowed;opacity:.45}
.scenes .scene:not(:disabled):not(.current):hover{border-color:rgba(214,226,210,.6)}
.scenes .scene-note{grid-column:1/-1;margin:2px 0 0;font-size:10px;letter-spacing:.08em;opacity:.55}

/* Run loop (P1-05) */
#kill-count{transform-origin:left center;transition:transform .18s ease-out}
#kill-count.pop{transform:scale(1.35);transition:none}
#streak{color:#ffd23a;font-weight:900;font-size:18px;letter-spacing:.5px;min-height:20px;text-shadow:0 0 2px #000,1px 1px 0 #000,-1px -1px 0 #000}
#run-timer{color:#d8e2d4;font:700 14px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.12em;opacity:.8;text-shadow:0 0 2px #000}
#run-timer.low{color:#e8322a;opacity:1}
.end-stats{grid-template-columns:repeat(4,minmax(0,1fr))}
#scope-end .quiet,#scope-paused .quiet{margin-top:8px}

.legal-links{margin:10px 0 0;font-size:11px;letter-spacing:.06em;opacity:.6}.legal-links a{color:inherit}
#scope-app[data-clip=true] #scope-end{display:none}
/* Touch: the pause button sits top-left, so the counter moves beside it. */
#scope-app[data-input=touch] #hud-mini{left:70px}
/* The counter scales with the screen so it reads on phones and on large monitors. */
#kill-count{font-size:clamp(28px,4.4vmin,60px)}#streak{font-size:clamp(17px,2.6vmin,34px);min-height:1.1em}#run-timer{font-size:clamp(13px,1.9vmin,24px)}#ammo-mini{font-size:clamp(11px,1.6vmin,20px)}