/*
Theme Name: Night Vision: Rat Hunt
Description: Hold your position, scan the dark, clear every rat. The Night Vision: Rat Hunt game microsite.
Version: 1.0.0
Author: asquared
Text Domain: rat-hunt
Requires PHP: 7.4
*/

@font-face{font-family:"Libre Franklin";src:url("assets/fonts/LibreFranklin-400.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Libre Franklin";src:url("assets/fonts/LibreFranklin-600.woff2") format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Libre Franklin";src:url("assets/fonts/LibreFranklin-800.woff2") format("woff2");font-weight:800;font-display:swap}

/* The game's own interface palette (InterfacePolishSetup, HuntSetup, HuntSession).
   --amber is HuntSession's HudAmber, the colour of the in-game HEADSHOT feedback. */
:root{
	--night:#040605;--panel:#0e130e;--glass:rgba(4,6,5,.64);
	--ink:#edf0e3;--ink-2:rgba(237,240,227,.8);--muted:#a1ada1;
	--lime:#9edb6e;--lime-hi:#b6e98f;--hud:#66c261;--amber:#ffb852;
	--line:rgba(237,240,227,.13);--line-2:rgba(237,240,227,.3);
	--font:"Libre Franklin",system-ui,-apple-system,sans-serif;
	--gutter:clamp(20px,3.4vw,52px);
	--out:cubic-bezier(.16,1,.3,1);
	--noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* Base */
*,*::before,*::after{box-sizing:border-box}
html{background:var(--night);color-scheme:dark;-webkit-text-size-adjust:100%;scrollbar-color:#2b342b var(--night);scroll-padding-top:24px}
body{margin:0;background:var(--night);color:var(--ink);font:400 17px/1.6 var(--font);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip}
img,video,svg{display:block;max-width:100%}
h1,h2,h3{margin:0;font-weight:800;text-wrap:balance}
p{margin:0;text-wrap:pretty}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.22em;text-decoration-color:rgba(158,219,110,.7);transition:color .2s}
a:hover{color:var(--lime)}
button{font:inherit;color:inherit}
a,button,summary{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
:focus-visible{outline:2px solid var(--lime);outline-offset:4px}
::selection{background:var(--lime);color:var(--night)}
::-webkit-scrollbar{width:11px;height:11px}::-webkit-scrollbar-track{background:var(--night)}::-webkit-scrollbar-thumb{background:#2b342b;border:3px solid var(--night)}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip-link{position:absolute;left:12px;top:-80px;z-index:100;padding:12px 16px;background:var(--lime);color:var(--night);font-weight:800;text-decoration:none}
.skip-link:focus{top:12px}

/* HUD type: the small tracked capitals the game uses for telemetry and control labels. */
.hud-title-shift,.hud-signal,.hud-nav a,.counter-caption,.control-label,.action-note,.store-soon-where,.document-date,.footer-nav a,.facts li,.shift-rats,.shift-access,.magazine-count,.offer-devices{font-weight:600;font-size:11px;line-height:1.25;letter-spacing:.16em;text-transform:uppercase}

/* HUD bar */
.hud-bar{position:relative;z-index:20;display:grid;grid-template-columns:1fr auto 1fr;align-items:start;gap:16px;padding:calc(18px + env(safe-area-inset-top)) var(--gutter) 18px}
.hud-bar-over{position:absolute;inset:0 0 auto}
.hud-title{justify-self:start;display:grid;gap:5px;min-height:44px;align-content:center;text-decoration:none}
.hud-title-name{font-weight:800;font-size:15px;line-height:1.1;letter-spacing:.01em;text-transform:uppercase}
.hud-title-shift{color:var(--muted);transition:opacity .15s}
.hud-title-shift.is-switching{animation:switch .42s steps(3) both}
.hud-title:hover .hud-title-name{color:var(--lime)}
.hud-signal{justify-self:center;display:flex;align-items:center;gap:10px;min-height:44px;color:var(--hud);letter-spacing:.24em}
.signal-sep{opacity:.7}
.signal-dot{width:7px;height:7px;border-radius:50%;background:var(--hud);animation:signal 2.4s steps(1) infinite}
.hud-nav{grid-column:-2;justify-self:end;display:flex;gap:28px}
.hud-nav a{display:inline-flex;align-items:center;min-height:44px;font-size:12px;text-decoration:none}
.hud-nav a[aria-current]{color:var(--lime)}
@keyframes signal{0%,62%{opacity:1}63%,100%{opacity:.25}}
@keyframes switch{0%{opacity:.2}50%{opacity:.8}100%{opacity:1}}

/* Sensor: the optic's grain, scan lines and vignette, laid over footage only. */
/* The layer blends as a whole (overlay), so grain lives in the mid-tones and blacks stay black. */
.sensor{position:absolute;inset:0;z-index:2;overflow:hidden;pointer-events:none;mix-blend-mode:overlay}
.sensor::before{content:"";position:absolute;inset:-60%;background:var(--noise);background-size:240px;opacity:.55;animation:grain .6s steps(5) infinite}
.sensor::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 72% 78% at 50% 50%,transparent 58%,rgba(0,0,0,.6) 100%),repeating-linear-gradient(0deg,rgba(0,0,0,.16) 0 1px,transparent 1px 3px)}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-9%,5%)}40%{transform:translate(6%,-8%)}60%{transform:translate(-4%,-11%)}80%{transform:translate(10%,7%)}100%{transform:translate(2%,-3%)}}

/* Reticle, as drawn in the game's HUD. */
.feed-reticle,.scan-reticle,.optic-reticle{position:absolute;left:50%;top:50%;z-index:3;width:48px;height:48px;margin:-24px 0 0 -24px;color:var(--hud);pointer-events:none}
.icon-reticle{width:100%;height:100%;overflow:visible}

/* Dial: the right-hand optic control, with lit ticks up to the magnification needle. */
.dial{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.dial-ring{fill:rgba(4,6,5,.5);stroke:var(--line-2);stroke-width:1.2}
.tick{stroke:rgba(237,240,227,.3);stroke-width:1.3}
.tick-major{stroke:rgba(237,240,227,.62);stroke-width:1.8}
.tick.is-lit{stroke:var(--lime)}
.dial-sign{fill:none;stroke:var(--ink);stroke-width:1.8}
.dial-needle line{stroke:var(--lime);stroke-width:3;stroke-linecap:round}
.optic-readout{font-weight:800;font-size:15px;line-height:1;letter-spacing:.04em;font-variant-numeric:tabular-nums;color:var(--lime)}

/* Rat counter */
.hud-counter{position:relative;display:flex;align-items:center;gap:12px;margin:0;padding:10px 18px 10px 16px;background:var(--glass)}
.hud-counter::before{content:"";position:absolute;left:0;top:50%;width:2px;height:62%;transform:translateY(-50%);background:var(--hud)}
.icon-rat{width:38px;height:22px;color:var(--ink)}
.counter-value{font-weight:800;font-size:32px;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.counter-value.is-pulse{animation:pulse .32s var(--out)}
.counter-caption{max-width:5.5em;color:var(--muted);font-size:10px}
@keyframes pulse{0%{color:var(--lime);transform:scale(1.18)}100%{transform:none}}

/* Store action */
.store-badge{display:inline-flex;border-radius:9px;transition:transform .25s var(--out)}
.store-badge img{width:auto;height:52px}
.store-badge:hover{transform:scale(1.04)}.store-badge:active{transform:scale(.97)}
.store-soon{display:grid;justify-items:center;gap:6px;text-align:center}
.store-soon-state{font-weight:800;font-size:19px;line-height:1;letter-spacing:.01em;text-transform:uppercase;color:var(--lime)}

/* Hero */
.hero{position:relative;height:100vh;height:100svh;min-height:620px;max-height:1240px;overflow:hidden;isolation:isolate;background:var(--night)}
.feed,.feed picture,.feed-poster,.feed-video{position:absolute;inset:0;width:100%;height:100%}
.feed-poster,.feed-video{object-fit:cover}
.feed-video{opacity:0;transition:opacity .8s var(--out)}
.feed.is-live .feed-video{opacity:1}
.feed::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,6,5,.88),rgba(4,6,5,.5) 34%,transparent 62%),linear-gradient(0deg,rgba(4,6,5,.94),rgba(4,6,5,.36) 32%,transparent 56%),linear-gradient(180deg,rgba(4,6,5,.72),transparent 24%)}
.feed-hud{position:absolute;z-index:5;top:calc(92px + env(safe-area-inset-top));right:var(--gutter);display:flex;align-items:center;gap:12px}
.feed-toggle{display:grid;place-items:center;width:48px;height:48px;padding:0;border:1px solid var(--line-2);border-radius:50%;background:var(--glass);cursor:pointer;transition:border-color .2s,color .2s}
.feed-toggle:hover{border-color:var(--lime);color:var(--lime)}
.feed-toggle svg{width:20px;height:20px}
.feed-toggle-play,.feed-toggle[aria-pressed="true"] .feed-toggle-pause{display:none}
.feed-toggle[aria-pressed="true"] .feed-toggle-play{display:block}
.hero-copy{position:absolute;z-index:4;left:var(--gutter);bottom:calc(var(--gutter) + env(safe-area-inset-bottom));max-width:min(620px,54vw)}
.wordmark{display:grid;gap:clamp(12px,1.7vh,20px)}
.wordmark-main{position:relative;font-size:clamp(56px,min(11vh,7.6vw),96px);line-height:.86;letter-spacing:-.035em;text-transform:uppercase}
.wordmark-main::before{content:"";position:absolute;left:-.13em;top:-.12em;width:2px;height:.4em;background:var(--lime)}
.wordmark-sub{font-weight:600;font-size:clamp(14px,1.35vw,18px);line-height:1;letter-spacing:.42em;text-transform:uppercase;color:var(--lime)}
.hero-lede{margin-top:clamp(22px,3.2vh,34px);font-weight:800;font-size:clamp(19px,1.6vw,23px);line-height:1.2;text-transform:uppercase;letter-spacing:-.005em}
.hero-text{margin-top:10px;max-width:40ch;color:var(--ink-2);font-size:16px;line-height:1.55}
.hero-action{position:absolute;z-index:4;right:var(--gutter);bottom:calc(var(--gutter) + env(safe-area-inset-bottom));display:grid;justify-items:center;gap:12px}
.action-dial{position:relative;display:grid;place-items:center;width:252px;height:252px}
.action-dial-core{position:relative;z-index:1}
.action-dial .store-badge img{height:48px}
.action-note{color:var(--muted)}
.action-icon{display:none;width:48px;height:48px;border-radius:11px}

/* Field manual steps */
.step{padding:clamp(104px,13vw,184px) var(--gutter)}
.step-copy{max-width:680px}
.step-title{font-size:clamp(34px,4.6vw,64px);line-height:.98;letter-spacing:-.025em;text-transform:uppercase}
.step-no{display:inline-block;margin-right:.45em;font-size:.36em;letter-spacing:.02em;vertical-align:.95em;font-variant-numeric:tabular-nums;color:var(--lime)}
.step-copy p,.optic-step p{margin-top:22px;max-width:50ch;color:var(--ink-2);font-size:clamp(17px,1.25vw,19px)}
.control-label{color:var(--ink);font-size:10px}

/* 01 Scan */
.step-scan{padding-bottom:clamp(56px,7vw,96px)}
.scan{margin:clamp(44px,5vw,72px) calc(var(--gutter) * -1) 0}
.scan-view{position:relative;height:clamp(380px,66vh,720px);overflow:hidden;background:#0b0e0b;touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none}
.scan-view.is-dragging{cursor:grabbing}
.scan-track{position:absolute;left:50%;top:-9%;height:118%;aspect-ratio:2880/810;transform:translateX(-50%);will-change:transform}
.scan-poster,.scan-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.scan-video{opacity:0;transition:opacity .6s}
.scan-video.is-live{opacity:1}
.scan-view::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(0deg,rgba(4,6,5,.7),transparent 34%)}
.stick{position:absolute;z-index:4;left:clamp(22px,4vw,64px);bottom:clamp(48px,8vh,84px);width:136px;height:136px;border:2px solid rgba(237,240,227,.55);border-radius:50%;background:rgba(4,6,5,.34);touch-action:none;cursor:grab}
.stick:hover{border-color:var(--ink)}
.stick-knob{position:absolute;left:50%;top:50%;width:60px;height:60px;margin:-30px 0 0 -30px;border-radius:50%;background:rgba(222,228,214,.86);box-shadow:0 6px 18px rgba(0,0,0,.4);transition:transform .45s var(--out)}
.stick.is-held .stick-knob{transition:none}
.stick:focus-visible{outline-offset:6px}
.control-label-stick{position:absolute;z-index:4;left:clamp(22px,4vw,64px);bottom:clamp(20px,4vh,40px);width:136px;text-align:center}
.scan-readout{position:absolute;z-index:4;right:var(--gutter);bottom:clamp(24px,4.4vh,44px)}
.scan-caption{padding:16px var(--gutter) 0;color:var(--muted);font-size:14px}

/* 02 Zoom and 03 Fire share one pinned optic. */
.optic{position:relative;height:430vh}
.optic-stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;isolation:isolate;background:#0b0e0b}
.optic-frames{position:absolute;inset:0}
.optic-frame,.optic-shot{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform-origin:50% 50%}
.optic-frame{opacity:0;will-change:transform,opacity;-webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent),linear-gradient(0deg,transparent,#000 9%,#000 91%,transparent);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent),linear-gradient(0deg,transparent,#000 9%,#000 91%,transparent);mask-composite:intersect}
.optic-frame.is-base{-webkit-mask-image:none;mask-image:none}
.optic-frame:first-child{opacity:1}
.optic-shot{z-index:1;opacity:0}
.optic.is-fired .optic-shot{opacity:1}
.optic-stage::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(90deg,rgba(4,6,5,.82),rgba(4,6,5,.34) 36%,transparent 60%),linear-gradient(0deg,rgba(4,6,5,.8),transparent 38%)}
.optic-hud{position:absolute;z-index:4;top:calc(26px + env(safe-area-inset-top));right:var(--gutter);display:grid;justify-items:end;gap:10px}
.optic-shift{font-weight:600;font-size:11px;line-height:1.25;letter-spacing:.16em;text-transform:uppercase;color:var(--ink)}
.optic-copy{position:absolute;z-index:4;left:var(--gutter);bottom:calc(var(--gutter) + env(safe-area-inset-bottom));display:grid;max-width:min(560px,46vw)}
/* The outgoing step keeps its visibility until it has faded; the incoming one shows at once. */
.optic-step{grid-area:1/1;align-self:end;transition:opacity .5s var(--out),transform .6s var(--out),visibility 0s linear .6s}
.optic-step-fire,.optic.is-armed .optic-step-zoom{opacity:0;visibility:hidden}
.optic-step-fire{transform:translateY(14px)}
.optic.is-armed .optic-step-zoom{transform:translateY(-14px)}
.optic.is-armed .optic-step-fire,.optic:not(.is-armed) .optic-step-zoom{opacity:1;transform:none;visibility:visible;transition-delay:0s}
.optic-control{position:absolute;z-index:4;right:var(--gutter);bottom:calc(var(--gutter) + env(safe-area-inset-bottom));display:grid;justify-items:center;gap:12px}
.magazine{display:grid;justify-items:center;gap:8px;margin:0}
.magazine-pips{display:flex;gap:7px}
.magazine-pips i{width:10px;height:16px;border-radius:50%;background:var(--ink);transition:background .2s}
.magazine-pips i.is-spent{background:transparent;box-shadow:inset 0 0 0 1.5px rgba(237,240,227,.45)}
.fire-dial{position:relative;display:grid;place-items:center;width:204px;height:204px}
.fire-button{position:relative;z-index:1;display:grid;place-items:center;width:94px;height:94px;padding:0;border:2px solid rgba(237,240,227,.7);border-radius:50%;background:rgba(4,6,5,.6);font-weight:800;font-size:15px;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:border-color .25s,color .25s,transform .15s var(--out)}
.fire-button::after{content:"";position:absolute;inset:-9px;border:1px solid var(--lime);border-radius:50%;opacity:0}
.optic.is-armed:not(.is-fired) .fire-button{border-color:var(--lime);color:var(--lime)}
.optic.is-armed:not(.is-fired) .fire-button::after{animation:ready 1.8s var(--out) infinite}
.fire-button:hover{border-color:var(--lime);color:var(--lime)}
.fire-button:active{transform:scale(.96)}
@keyframes ready{0%{opacity:.8;transform:scale(.92)}100%{opacity:0;transform:scale(1.18)}}
.hit-ring{position:absolute;left:50%;top:50%;width:48px;height:48px;margin:-24px 0 0 -24px;border:2px solid var(--amber);border-radius:50%;opacity:0}
.hit-callout{position:absolute;z-index:4;left:50%;top:calc(50% + 46px);margin:0;transform:translateX(-50%);font-weight:800;font-size:15px;letter-spacing:.22em;text-transform:uppercase;color:var(--amber);opacity:0}
.optic.is-hit .hit-ring{animation:hit .7s var(--out) both}
.optic.is-hit .hit-callout{animation:callout 1.6s var(--out) both}
@keyframes hit{0%{opacity:1;transform:scale(.55)}100%{opacity:0;transform:scale(1.3)}}
@keyframes callout{0%{opacity:0;transform:translate(-50%,6px)}12%,70%{opacity:1;transform:translate(-50%,0)}100%{opacity:0}}

/* The offer sits over dimmed game footage, as the game's own menus do. */
.offer{position:relative;isolation:isolate}
.backdrop{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.backdrop img{width:100%;height:100%;object-fit:cover;opacity:.24;filter:contrast(1.1)}
.backdrop::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--night),rgba(4,6,5,.35) 22%,rgba(4,6,5,.35) 78%,var(--night))}
.offer>.sensor{z-index:1}
.offer>:not(.backdrop):not(.sensor){position:relative;z-index:2}

/* 04 Clear: the campaign as the game's location list, one charcoal panel per row. */
.step-clear{padding-bottom:clamp(72px,8vw,120px)}
.shift-list{display:grid;gap:8px;margin:clamp(44px,5vw,72px) 0 0;padding:0;list-style:none}
.shift{position:relative;display:grid;grid-template-columns:clamp(150px,17vw,248px) 48px minmax(0,1fr) auto 128px;align-items:center;gap:0 clamp(18px,2.6vw,40px);padding:12px clamp(16px,2vw,24px) 12px 12px;background:rgba(9,12,9,.86)}
.shift.is-ready::before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:1px;background:var(--lime)}
.shift-image{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;background:#0b0e0b;filter:contrast(1.06)}
.shift-no{font-weight:800;font-size:20px;line-height:1;font-variant-numeric:tabular-nums;color:var(--lime)}
.shift-name{display:block;font-weight:800;font-size:clamp(20px,2vw,28px);line-height:1.05;letter-spacing:-.01em;text-transform:uppercase}
.shift-brief{display:block;margin-top:7px;color:var(--muted);font-size:15px;line-height:1.45}
.shift-rats{display:flex;align-items:baseline;gap:8px;color:var(--muted);white-space:nowrap}
.shift-rats b{font-weight:800;font-size:36px;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--ink)}
.shift-access{justify-self:end;display:grid;justify-items:end;gap:6px;text-align:right;white-space:nowrap}
.shift-state{color:var(--muted)}
.shift-state.is-free{color:var(--lime)}
.shift-lock{color:rgba(161,173,161,.72);font-size:10px}

/* The game's end-of-hunt report, as a manual figure spanning the list's width. */
.report{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,2.2fr);grid-template-areas:"title stats" "sub stats" "foot foot";align-items:start;gap:0 clamp(28px,5vw,72px);margin-top:clamp(28px,3vw,40px);padding:clamp(24px,3vw,36px) clamp(24px,3vw,40px);border:1px solid var(--line);background:var(--panel)}
.report-title{grid-area:title}.report-sub{grid-area:sub}.report-stats{grid-area:stats}.report-foot{grid-area:foot}
.report-title{position:relative;padding-left:18px;font-size:clamp(30px,3.2vw,44px);line-height:1;letter-spacing:-.02em;text-transform:uppercase}
.report-title::before{content:"";position:absolute;left:0;top:.06em;bottom:.06em;width:2px;background:var(--lime)}
.report-sub{margin-top:12px;padding-left:18px;color:var(--muted);font-size:15px}
.report-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:0;padding-top:4px}
.report-stats div{display:grid;gap:8px;align-content:start}
.report-stats dt{font-weight:800;font-size:13px;letter-spacing:.14em;text-transform:uppercase}
.report-stats dd{margin:0;color:var(--muted);font-size:15px;line-height:1.45}
.report-foot{margin-top:24px;padding-top:20px;border-top:1px solid var(--line);color:var(--ink-2);font-size:15px}
.report-foot b{font-weight:800;font-variant-numeric:tabular-nums;color:var(--lime)}

/* Offer */
.offer{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);align-items:end;gap:48px;padding:clamp(96px,11vw,160px) var(--gutter) clamp(104px,13vw,184px)}
.offer .backdrop img{opacity:.34;object-position:50% 70%}
.offer .backdrop::after{background:linear-gradient(90deg,rgba(4,6,5,.9),rgba(4,6,5,.5) 60%,rgba(4,6,5,.3)),linear-gradient(180deg,var(--night),transparent 30%,transparent 70%,var(--night))}
.offer-title{font-size:clamp(40px,5.8vw,84px);line-height:.94;letter-spacing:-.03em;text-transform:uppercase}
.offer-copy p{margin-top:26px;max-width:48ch;color:var(--ink-2);font-size:clamp(17px,1.3vw,20px)}
.facts{display:flex;flex-wrap:wrap;gap:12px 30px;margin:34px 0 0;padding:0;list-style:none}
.facts li{display:flex;align-items:center;gap:10px;color:var(--lime)}
.facts li::before{content:"";width:6px;height:6px;background:currentColor}
.offer-action{display:grid;justify-items:end;gap:14px}
.offer-action .store-soon{justify-items:end;text-align:right;padding:22px 26px;border:1px solid var(--line-2);background:rgba(4,6,5,.6)}
.offer-action .store-soon-state{font-size:24px}
.offer-devices{color:var(--muted)}

/* Footer */
.site-footer{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:28px 48px;padding:52px var(--gutter) calc(40px + env(safe-area-inset-bottom));border-top:1px solid var(--line)}
.footer-motto{font-weight:800;font-size:clamp(28px,3vw,40px);line-height:1;letter-spacing:-.01em;text-transform:uppercase}
.footer-credit{margin-top:14px;color:var(--muted);font-size:14px}
.footer-year{white-space:nowrap}
.footer-nav{display:flex;flex-wrap:wrap;gap:4px 30px}
.footer-nav a{display:inline-flex;align-items:center;min-height:44px;font-size:12px;text-decoration:none}
.footer-nav a[aria-current]{color:var(--lime)}

/* Documents: privacy, terms, support, not found */
.document{padding:clamp(40px,7vw,104px) var(--gutter) clamp(96px,11vw,168px)}
.document-header{max-width:920px}
.document-title{font-size:clamp(44px,7vw,96px);line-height:.92;letter-spacing:-.035em;text-transform:uppercase}
.document-intro{margin-top:24px;max-width:56ch;color:var(--ink-2);font-size:clamp(18px,1.5vw,21px);line-height:1.55}
.document-date{margin-top:26px;color:var(--hud)}
.document-layout{display:grid;grid-template-columns:minmax(200px,260px) minmax(0,1fr);gap:clamp(40px,7vw,112px);margin-top:clamp(40px,5vw,64px);padding-top:clamp(40px,5vw,64px);border-top:1px solid var(--line)}
.document-index{position:sticky;top:24px;align-self:start;display:grid}
.document-index a{padding:8px 0;color:var(--muted);font-size:14px;line-height:1.3;text-decoration:none}
.document-index a:hover{color:var(--lime)}
.document-body{max-width:70ch}
.document-body section{margin-bottom:60px;scroll-margin-top:24px}
.document-body h2{margin-bottom:18px;font-size:clamp(22px,2vw,28px);line-height:1.15;letter-spacing:-.005em;text-transform:uppercase}
.document-body h2 span{margin-right:.45em;font-variant-numeric:tabular-nums;color:var(--lime)}
.document-body h3{margin:30px 0 8px;font-weight:600;font-size:18px;line-height:1.35}
.document-body p,.document-body li{color:var(--ink-2);line-height:1.7}
.document-body p+p{margin-top:14px}
.document-body ul{margin:14px 0;padding-left:1.1em}
.document-body li+li{margin-top:8px}
.document-body li::marker{color:var(--lime)}
.document-body strong{color:var(--ink);font-weight:600}
.document-body a{color:var(--ink)}
.document-body a:hover{color:var(--lime)}
.document-address{margin-top:28px!important;color:var(--muted)!important;font-size:15px}
.support-layout{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:start;gap:clamp(40px,7vw,112px);margin-top:clamp(40px,5vw,64px);padding-top:clamp(40px,5vw,64px);border-top:1px solid var(--line)}
.contact{position:sticky;top:24px;padding:clamp(28px,3vw,44px);border:1px solid var(--line);background:var(--panel)}
.contact-title,.faq-title{font-size:clamp(26px,2.6vw,36px);line-height:1;letter-spacing:-.015em;text-transform:uppercase}
.contact p{margin-top:14px;color:var(--ink-2)}
.button-primary{display:inline-flex;align-items:center;gap:12px;min-height:52px;margin-top:28px;padding:0 24px;background:var(--lime);color:var(--night);font-weight:800;font-size:14px;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;transition:background .2s,transform .15s var(--out)}
.button-primary:hover{background:var(--lime-hi);color:var(--night)}
.button-primary:active{transform:scale(.97)}
.button-primary svg{width:20px;height:20px}
.contact-address{display:block;margin-top:18px;overflow-wrap:anywhere}
.contact .contact-note{margin-top:22px;padding-top:20px;border-top:1px solid var(--line);color:var(--muted);font-size:14px}
.faq-title{margin-bottom:12px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 0;font-weight:600;font-size:clamp(17px,1.4vw,19px);line-height:1.35;list-style:none;cursor:pointer}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--lime)}
.icon-plus{flex:none;width:20px;height:20px;color:var(--lime);transition:transform .3s var(--out)}
.faq details[open] .icon-plus{transform:rotate(45deg)}
.faq details p{max-width:62ch;padding-bottom:26px;color:var(--ink-2);line-height:1.7}
.lost{display:grid;justify-items:start;align-content:center;min-height:62vh}
.lost-reticle{width:64px;height:64px;margin-bottom:36px;color:var(--hud)}
.lost .button-primary svg{width:20px}

/* Tablet */
@media (max-width:1080px){
	.hero-copy{max-width:60vw}
	.action-dial{width:212px;height:212px}
	.action-dial .store-badge img{height:42px}
	.shift{grid-template-columns:clamp(132px,22vw,200px) 36px minmax(0,1fr) auto;row-gap:12px}
	.shift-access{grid-column:3/-1;justify-self:start;justify-items:start;grid-auto-flow:column;gap:14px;text-align:left}
	.optic-copy{max-width:52vw}
	.document-layout,.support-layout{grid-template-columns:1fr}
	.document-index{position:static;display:flex;flex-wrap:wrap;gap:2px 22px;padding-bottom:28px;border-bottom:1px solid var(--line)}
	.contact{position:static}
}

/* Phone */
@media (max-width:720px){
	body{font-size:16px}
	.hud-bar{grid-template-columns:1fr auto}
	.hud-signal{display:none}
	.hud-title-name{font-size:13px}
	.hud-title-shift{font-size:10px;letter-spacing:.12em}
	.feed-hud{top:calc(82px + env(safe-area-inset-top))}
	.hud-counter{gap:9px;padding:8px 12px 8px 12px}
	.icon-rat{width:30px;height:18px}
	.counter-value{font-size:24px}
	.counter-caption{font-size:9px}
	.feed-toggle{width:44px;height:44px}
	.feed::after{background:linear-gradient(0deg,rgba(4,6,5,.96),rgba(4,6,5,.82) 36%,rgba(4,6,5,.2) 64%,transparent 76%),linear-gradient(180deg,rgba(4,6,5,.74),transparent 26%)}
	.hero-copy{right:var(--gutter);bottom:calc(112px + env(safe-area-inset-bottom));max-width:none}
	.wordmark-main{font-size:clamp(54px,17.5vw,84px)}
	.hero-lede{margin-top:20px;font-size:18px}
	.hero-text{font-size:15px}
	.hero-action{left:var(--gutter);right:var(--gutter);bottom:calc(24px + env(safe-area-inset-bottom));grid-template-columns:auto 1fr;align-items:center;justify-items:start;gap:0 14px;padding:10px 16px 10px 10px;border:1px solid var(--line-2);background:var(--glass)}
	.hero-action .optic-readout,.action-note,.action-dial .dial{display:none}
	.action-dial{display:contents}
	.action-icon{display:block}
	.action-dial-core .store-soon{justify-items:start;text-align:left;gap:4px}
	.action-dial .store-badge img{height:44px}
	.store-soon-state{font-size:17px}
	.step{padding-top:92px;padding-bottom:92px}
	.scan-view{height:min(64vh,520px)}
	.stick{width:112px;height:112px;bottom:52px}
	.stick-knob{width:50px;height:50px;margin:-25px 0 0 -25px}
	.control-label-stick{width:112px;bottom:24px}
	.optic{height:380vh}
	.optic-stage::after{background:linear-gradient(180deg,rgba(4,6,5,.9),rgba(4,6,5,.55) 34%,transparent 52%),linear-gradient(0deg,rgba(4,6,5,.7),transparent 30%)}
	.optic-copy{top:calc(var(--gutter) + 8px + env(safe-area-inset-top));bottom:auto;right:var(--gutter);max-width:none}
	.optic-step{align-self:start}
	.optic-step p{margin-top:14px;font-size:15px}
	.optic-step .step-title{font-size:30px}
	.optic-hud{top:auto;bottom:calc(var(--gutter) + env(safe-area-inset-bottom));left:var(--gutter);right:auto}
	.fire-dial{width:156px;height:156px}
	.fire-button{width:76px;height:76px;font-size:13px}
	.shift{grid-template-columns:40px minmax(0,1fr) auto;gap:14px 14px;padding:12px 12px 18px}
	.shift-image{grid-column:1/-1}
	.shift-no{align-self:start;padding-top:4px}
	.shift-access{grid-column:2/-1}
	.shift-rats b{font-size:28px}
	.report{grid-template-columns:1fr;grid-template-areas:"title" "sub" "stats" "foot"}
	.report-stats{grid-template-columns:1fr;gap:16px;margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}
	.optic-shift{display:none}
	.offer{grid-template-columns:1fr;align-items:start}
	.offer-action{justify-items:start}
	.offer-action .store-soon{justify-items:start;text-align:left}
	.site-footer{flex-direction:column;align-items:flex-start}
}

@media (max-width:720px) and (max-height:700px){
	.wordmark-main{font-size:48px}
	.hero-text{display:none}
}

@media (prefers-reduced-motion:reduce){
	.sensor::before,.signal-dot,.hud-title-shift.is-switching,.optic.is-armed:not(.is-fired) .fire-button::after{animation:none}
	.feed-video,.scan-video,.optic-step,.stick-knob{transition:none}
}