@import url('https://fonts.googleapis.com/css2?family=Creepster&family=IBM+Plex+Mono:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--red:#e32636;--blood:#7c0714;--ink:#080708;--muted:#8d8587;--line:rgba(255,255,255,.12)}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--ink);color:#f5eeee;font-family:'Space Grotesk',Arial,sans-serif}
body{min-height:100vh;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.16;background-image:radial-gradient(rgba(255,255,255,.16) .55px,transparent .55px);background-size:5px 5px}
.home-screen{position:relative;z-index:1;min-height:100vh;display:flex;flex-direction:column;padding:22px 5vw 18px;background:radial-gradient(ellipse at 50% 48%,rgba(83,5,17,.27),transparent 56%),linear-gradient(180deg,#0b090a,#080708 72%)}
.signal-line,.home-screen footer,.home-meta,.hud-status{font:11px 'IBM Plex Mono',monospace;letter-spacing:.13em;color:#9b9294}
.signal-line{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line);padding:0 0 16px}.signal-right{margin-left:auto;color:#665d60}
.signal-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#e32636;box-shadow:0 0 12px #e32636;animation:signal 1.7s infinite}
.hero{width:min(720px,100%);margin:auto;text-align:center;padding:55px 0 80px}
.eye-mark{width:62px;height:34px;margin:0 auto 26px;border:1px solid rgba(227,38,54,.7);border-radius:50% 50% 48% 48%;transform:rotate(-7deg);position:relative;box-shadow:0 0 32px rgba(227,38,54,.12),inset 0 0 18px rgba(227,38,54,.12)}
.eye-mark:before{content:"";position:absolute;width:17px;height:17px;border:2px solid #d8293b;border-radius:50%;left:21px;top:7px;box-shadow:0 0 15px #e32636}.eye-mark span{position:absolute;width:6px;height:6px;background:#f4d9dc;border-radius:50%;left:28px;top:14px;box-shadow:0 0 12px white}
.eyebrow{font:10px 'IBM Plex Mono',monospace;letter-spacing:.24em;color:#a85a63;margin:0 0 16px}
h1{font-size:clamp(48px,9vw,94px);line-height:.95;letter-spacing:-.075em;margin:0;font-weight:700}h1 span{color:var(--red);text-shadow:0 0 28px rgba(227,38,54,.2)}
.subtitle{font:12px 'IBM Plex Mono',monospace;letter-spacing:.22em;color:#a69b9e;margin:22px 0 42px}
.address-form{display:flex;gap:9px;width:min(650px,100%);margin:0 auto;padding:7px;border:1px solid rgba(227,38,54,.36);background:rgba(17,12,14,.88);box-shadow:0 0 50px rgba(117,0,17,.12);border-radius:4px}
#sj-address{min-width:0;flex:1;height:49px;padding:0 16px;border:0;outline:0;background:transparent;color:#fff;font:14px 'IBM Plex Mono',monospace}#sj-address::placeholder{color:#746b6e}
.address-form button,#return-home{border:1px solid #a91a2b;background:#8e1020;color:white;padding:0 21px;font:600 11px 'IBM Plex Mono',monospace;letter-spacing:.14em;cursor:pointer;border-radius:2px;transition:.2s}.address-form button:hover,#return-home:hover{background:#c51c32;box-shadow:0 0 20px rgba(227,38,54,.35)}.address-form button span{font-size:16px;margin-left:9px}
.home-meta{display:flex;justify-content:space-between;width:min(650px,100%);margin:14px auto 0;color:#746b6e;font-size:10px}
.warning-copy{margin:45px 0 0;color:#746b6e;font:11px/1.9 'IBM Plex Mono',monospace;letter-spacing:.04em}
#sj-error{color:#ff6676;font:12px 'IBM Plex Mono',monospace;white-space:pre-wrap}#sj-error-code{color:#b5aeb0;font-size:11px;white-space:pre-wrap}
.home-screen footer{display:flex;justify-content:space-between;gap:15px;border-top:1px solid var(--line);padding-top:14px;color:#5e5659;font-size:9px}
#sj-frame{position:fixed;inset:0;width:100vw;height:100vh;border:0;background:#fff;z-index:2}
#horror-hud{position:fixed;z-index:20;top:0;left:0;right:0;height:43px;padding:0 15px;display:flex;align-items:center;gap:20px;background:rgba(7,6,7,.88);border-bottom:1px solid rgba(227,38,54,.35);backdrop-filter:blur(8px);font:10px 'IBM Plex Mono',monospace;letter-spacing:.12em;color:#e7dfe1}
#horror-hud[hidden]{display:none}.hud-brand{font-weight:700;color:#f2e8e9}.hud-eye{color:var(--red);font-size:15px;margin-right:6px}.hud-status{display:flex;align-items:center;gap:12px;flex:1;font-size:9px}.hud-status #hud-stage{color:#e16a76}#return-home{height:27px;padding:0 13px;font-size:9px}
.nav-form{display:flex;align-items:center;gap:5px;margin-left:auto}.nav-form input{width:min(25vw,260px);height:27px;background:rgba(0,0,0,.42);border:1px solid rgba(255,255,255,.16);color:#eee;padding:0 9px;font:10px 'IBM Plex Mono',monospace;outline:none}.nav-form input:focus{border-color:rgba(227,38,54,.75)}.nav-form button{height:27px;padding:0 10px;border:1px solid #77101d;background:#390b11;color:#f1dfe1;font:10px 'IBM Plex Mono',monospace;cursor:pointer}
#horror-overlay{position:fixed;inset:0;z-index:10;pointer-events:none;opacity:0;transition:opacity .8s;background:repeating-linear-gradient(0deg,rgba(0,0,0,.14) 0px,rgba(0,0,0,.14) 1px,transparent 2px,transparent 4px),radial-gradient(ellipse at center,transparent 40%,rgba(0,0,0,.45) 100%)}
#horror-flash{position:fixed;inset:0;z-index:15;pointer-events:none;background:rgba(160,0,20,.22);opacity:0}
#horror-message{position:fixed;z-index:21;bottom:17px;left:50%;transform:translateX(-50%);pointer-events:none;color:#ff9aa4;background:rgba(8,4,5,.78);border:1px solid rgba(227,38,54,.35);padding:7px 13px;font:10px 'IBM Plex Mono',monospace;letter-spacing:.12em;opacity:0;transition:opacity .4s;white-space:nowrap;max-width:90vw;overflow:hidden;text-overflow:ellipsis}
body[data-stage="1"] #horror-overlay,body[data-stage="2"] #horror-overlay{opacity:.18}
body[data-stage="3"] #horror-overlay,body[data-stage="4"] #horror-overlay{opacity:.36;background-color:rgba(55,0,8,.08)}
body[data-stage="5"] #horror-overlay,body[data-stage="6"] #horror-overlay{opacity:.55;background-color:rgba(70,0,8,.13)}
body[data-stage="7"] #horror-overlay,body[data-stage="8"] #horror-overlay,body[data-stage="9"] #horror-overlay{opacity:.75;background-color:rgba(95,0,12,.17)}
body[data-stage="10"] #horror-overlay{opacity:.9;background-color:rgba(120,0,14,.2)}
body[data-stage="3"] #sj-frame,body[data-stage="4"] #sj-frame{filter:contrast(1.06) saturate(.85)}
body[data-stage="5"] #sj-frame,body[data-stage="6"] #sj-frame{filter:contrast(1.12) saturate(.72) hue-rotate(-5deg)}
body[data-stage="7"] #sj-frame,body[data-stage="8"] #sj-frame,body[data-stage="9"] #sj-frame,body[data-stage="10"] #sj-frame{filter:contrast(1.18) saturate(.62) hue-rotate(-9deg)}
body[data-stage="3"] #horror-message,body[data-stage="4"] #horror-message,body[data-stage="5"] #horror-message,body[data-stage="6"] #horror-message,body[data-stage="7"] #horror-message,body[data-stage="8"] #horror-message,body[data-stage="9"] #horror-message,body[data-stage="10"] #horror-message{opacity:.88}
body[data-stage="4"] .hud-brand,body[data-stage="5"] .hud-brand,body[data-stage="6"] .hud-brand,body[data-stage="7"] .hud-brand,body[data-stage="8"] .hud-brand,body[data-stage="9"] .hud-brand,body[data-stage="10"] .hud-brand{animation:brandGlitch 4s infinite}
body[data-stage="6"] #horror-flash,body[data-stage="7"] #horror-flash,body[data-stage="8"] #horror-flash,body[data-stage="9"] #horror-flash,body[data-stage="10"] #horror-flash{animation:flashPulse 7s infinite}
body[data-stage="8"] #horror-overlay,body[data-stage="9"] #horror-overlay,body[data-stage="10"] #horror-overlay{animation:haunt 6s infinite}
@keyframes signal{50%{opacity:.25;box-shadow:0 0 2px #e32636}}@keyframes brandGlitch{0%,94%,100%{transform:none;text-shadow:none}95%{transform:translateX(2px);text-shadow:-2px 0 #ed1b35,2px 0 #5bb9bd}97%{transform:translateX(-1px)}}@keyframes flashPulse{0%,91%,93%,100%{opacity:0}92%{opacity:.32}}@keyframes haunt{0%,88%,90%,100%{opacity:.75}89%{opacity:1;filter:contrast(2)}}
@media(max-width:600px){.home-screen{padding:17px 20px}.hero{padding:30px 0 60px}.subtitle{font-size:9px;letter-spacing:.12em}.address-form{flex-direction:column}#sj-address{width:100%}.address-form button{height:43px}.home-screen footer{font-size:8px;flex-direction:column}.hud-status{gap:7px;font-size:8px}#horror-hud{gap:7px;padding:0 7px}.hud-brand{font-size:8px}.nav-form input{width:24vw;font-size:9px}.nav-form button{padding:0 6px}#return-home{padding:0 8px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* THE THING IN THE GLASS — the haunting begins on the first visit. */
#horror-entity{position:fixed;z-index:11;pointer-events:none;right:-12vw;bottom:-18vh;width:34vw;height:82vh;opacity:0;transform:translateX(18vw) scale(.72);transform-origin:bottom center;transition:opacity 2.2s ease,transform 5s cubic-bezier(.18,.7,.2,1);filter:drop-shadow(0 0 34px rgba(0,0,0,.95))}
#horror-entity:before{content:"";position:absolute;left:31%;top:5%;width:39%;height:30%;border-radius:48% 48% 43% 43%;background:radial-gradient(ellipse at 50% 40%,#080607 0 42%,#020202 72%);box-shadow:0 0 35px 18px rgba(0,0,0,.72)}
#horror-entity:after{content:"";position:absolute;left:12%;top:29%;width:78%;height:76%;background:linear-gradient(90deg,transparent 0%,#030203 20%,#080607 48%,#020202 78%,transparent 100%);clip-path:polygon(36% 0,64% 0,78% 14%,100% 100%,0 100%,22% 14%);border-radius:48% 48% 0 0;filter:blur(5px)}
.entity-eye{position:absolute;z-index:2;top:17%;width:5px;height:3px;background:#d7192d;opacity:0;box-shadow:0 0 12px 5px rgba(226,0,25,.7);border-radius:50%;transition:opacity 1s}.entity-eye.left{left:45%}.entity-eye.right{left:57%}
#horror-static{position:fixed;inset:0;z-index:12;pointer-events:none;opacity:0;background:repeating-linear-gradient(0deg,transparent 0 2px,rgba(255,255,255,.055) 3px,transparent 4px),linear-gradient(90deg,transparent 0 48%,rgba(255,255,255,.12) 49%,transparent 50%);mix-blend-mode:screen}
body[data-stage="1"] #horror-overlay{opacity:.22}
body[data-stage="1"] #horror-entity{opacity:.38;transform:translateX(5vw) scale(.82)}
body[data-stage="2"] #horror-entity{opacity:.48;transform:translateX(4vw) scale(.86)}
body[data-stage="2"] #horror-static{opacity:.12;animation:staticFlicker 9s steps(2) infinite}
body[data-stage="3"] #horror-entity{opacity:.56;transform:translateX(2vw) scale(.92)}
body[data-stage="4"] #horror-entity{opacity:.66;transform:translateX(0) scale(.98)}
body[data-stage="3"] #horror-entity .entity-eye,body[data-stage="4"] #horror-entity .entity-eye{opacity:.35}
body[data-stage="3"] #horror-static,body[data-stage="4"] #horror-static{opacity:.18;animation:staticFlicker 5s steps(2) infinite}
body[data-stage="5"] #horror-entity,body[data-stage="6"] #horror-entity{opacity:.62;transform:translateX(-5vw) scale(1.08)}
body[data-stage="5"] #horror-entity .entity-eye,body[data-stage="6"] #horror-entity .entity-eye{opacity:.72;box-shadow:0 0 18px 8px rgba(226,0,25,.9)}
body[data-stage="5"] #horror-static,body[data-stage="6"] #horror-static{opacity:.28;animation:staticFlicker 2.8s steps(2) infinite}
body[data-stage="7"] #horror-entity,body[data-stage="8"] #horror-entity,body[data-stage="9"] #horror-entity,body[data-stage="10"] #horror-entity{opacity:.9;transform:translateX(-15vw) scale(1.32)}
body[data-stage="7"] #horror-entity .entity-eye,body[data-stage="8"] #horror-entity .entity-eye,body[data-stage="9"] #horror-entity .entity-eye,body[data-stage="10"] #horror-entity .entity-eye{opacity:1;box-shadow:0 0 24px 11px rgba(235,0,24,1)}
body[data-stage="7"] #horror-static,body[data-stage="8"] #horror-static,body[data-stage="9"] #horror-static,body[data-stage="10"] #horror-static{opacity:.42;animation:staticFlicker 1.3s steps(2) infinite}
body[data-stage="8"] #horror-entity,body[data-stage="9"] #horror-entity,body[data-stage="10"] #horror-entity{animation:entityLurch 8s infinite}
body[data-stage="9"] #horror-message,body[data-stage="10"] #horror-message{background:#160307;border-color:#ff1b35;color:#fff;box-shadow:0 0 28px rgba(220,0,25,.35)}
body[data-stage="10"] #horror-overlay{opacity:.94;animation:haunt 2.8s infinite}
@keyframes staticFlicker{0%,92%,94%,100%{opacity:0}93%{opacity:.7}95%{opacity:.2}}@keyframes entityLurch{0%,74%,78%,100%{transform:translateX(-15vw) scale(1.32)}76%{transform:translateX(-21vw) scale(1.48)}}
@media(max-width:600px){#horror-entity{width:70vw;height:70vh;right:-28vw}body[data-stage="7"] #horror-entity,body[data-stage="8"] #horror-entity,body[data-stage="9"] #horror-entity,body[data-stage="10"] #horror-entity{transform:translateX(-12vw) scale(1.25)}}


/* NORMAL MODE IS A FIVE-SECOND FALSE PROMISE. */
.normal-mode-button{display:block;margin:15px auto 0;padding:12px 23px;border:1px solid rgba(220,210,210,.42);background:linear-gradient(180deg,#171416,#080708);color:#d7d0d2;font:600 10px 'IBM Plex Mono',monospace;letter-spacing:.22em;cursor:pointer;box-shadow:0 0 20px rgba(255,255,255,.035),inset 0 0 12px rgba(255,255,255,.025);transition:all .2s}
.normal-mode-button span{color:#e32636;margin-left:12px;font-size:15px}.normal-mode-button:hover{color:#fff;border-color:#e32636;box-shadow:0 0 24px rgba(227,38,54,.22)}.normal-mode-button:disabled{opacity:.45;cursor:wait}
#normal-mode-sequence{position:fixed;inset:0;z-index:1000;overflow:hidden;background:#020102;color:#fff;isolation:isolate}
#normal-mode-sequence[hidden]{display:none}
.sequence-noise,.sequence-vignette{position:absolute;inset:-20%;pointer-events:none}
.sequence-noise{z-index:5;opacity:.28;background-image:repeating-radial-gradient(circle at 20% 30%,rgba(255,255,255,.7) 0 1px,transparent 1px 3px);background-size:7px 9px;mix-blend-mode:screen;animation:sequenceNoise .11s steps(2) infinite}
.sequence-vignette{z-index:6;background:radial-gradient(ellipse at center,transparent 15%,rgba(0,0,0,.5) 55%,#000 100%);box-shadow:inset 0 0 150px 65px #000}
.sequence-figure{position:absolute;z-index:2;left:50%;top:52%;width:min(58vw,650px);height:110vh;transform:translate(-50%,-43%) scale(.72);opacity:0;background:linear-gradient(90deg,transparent,#030203 20%,#050305 50%,#020102 80%,transparent);clip-path:polygon(43% 0,57% 0,68% 13%,76% 36%,100% 100%,0 100%,24% 36%,32% 13%);filter:blur(3px) drop-shadow(0 0 50px #000);transition:opacity .2s,transform .6s}
.sequence-figure:before{content:"";position:absolute;left:29%;top:4%;width:42%;height:28%;border-radius:48% 48% 42% 42%;background:radial-gradient(ellipse at 50% 35%,#090709,#010101 72%);box-shadow:0 0 60px 35px #000}
.sequence-figure:after{content:"";position:absolute;left:35%;top:30%;width:30%;height:35%;background:#010101;clip-path:polygon(50% 0,100% 100%,0 100%);filter:blur(15px)}
.sequence-eye{position:absolute;z-index:4;top:17%;width:12px;height:5px;border-radius:50%;background:#ff001e;opacity:0;box-shadow:0 0 22px 12px rgba(255,0,30,.95)}.eye-a{left:42%}.eye-b{left:56%}
.sequence-face{position:absolute;z-index:4;left:50%;top:50%;width:min(48vw,500px);aspect-ratio:1/1;transform:translate(-50%,-50%) scale(.1) rotate(-8deg);opacity:0;border-radius:48% 48% 42% 42%;background:radial-gradient(ellipse at 50% 35%,#160d10 0 20%,#030203 68%);box-shadow:0 0 80px 35px rgba(100,0,15,.4);filter:contrast(2)}
.sequence-face i{position:absolute;top:39%;width:16%;height:5%;background:#ff001e;border-radius:50%;box-shadow:0 0 35px 18px rgba(255,0,25,.85)}.sequence-face i:first-child{left:22%}.sequence-face i:nth-child(2){right:22%}.sequence-face b{position:absolute;left:39%;top:62%;width:22%;height:18%;background:#000;clip-path:polygon(0 0,100% 0,75% 100%,25% 100%);box-shadow:0 0 30px #000}
#normal-mode-caption{position:absolute;z-index:8;left:0;right:0;top:12%;padding:0 18px;text-align:center;color:#e9dfe1;font:clamp(14px,2.4vw,25px) 'IBM Plex Mono',monospace;letter-spacing:.28em;text-shadow:0 0 15px #e00024;animation:captionJitter .16s infinite}
.sequence-counter{position:absolute;z-index:8;left:0;right:0;bottom:7%;text-align:center;color:#8b7b80;font:10px 'IBM Plex Mono',monospace;letter-spacing:.25em}.sequence-counter span{color:#ff2945;margin-left:12px}
#normal-mode-sequence[data-beat="0"]{animation:sequenceDark .85s steps(2) both}
#normal-mode-sequence[data-beat="1"]{background:#080106;animation:sequenceStrobe .17s steps(2) infinite}
#normal-mode-sequence[data-beat="1"] .sequence-figure{opacity:.92;transform:translate(-50%,-43%) scale(1.05)}
#normal-mode-sequence[data-beat="2"]{background:#180008;animation:sequenceStrobe .12s steps(2) infinite}
#normal-mode-sequence[data-beat="2"] .sequence-figure{opacity:1;transform:translate(-50%,-40%) scale(1.35)}
#normal-mode-sequence[data-beat="2"] .sequence-eye{opacity:1}
#normal-mode-sequence[data-beat="3"]{background:#020102;animation:sequenceShake .08s steps(2) infinite}
#normal-mode-sequence[data-beat="3"] .sequence-figure{opacity:.75;transform:translate(-50%,-39%) scale(1.55);filter:blur(1px) contrast(2)}
#normal-mode-sequence[data-beat="3"] .sequence-face{opacity:1;transform:translate(-50%,-50%) scale(1.25) rotate(5deg);animation:faceLunge .38s steps(2) infinite}
#normal-mode-sequence[data-beat="4"]{background:#000;animation:none}
#normal-mode-sequence[data-beat="4"] .sequence-figure,#normal-mode-sequence[data-beat="4"] .sequence-face{opacity:0;transition:none}
#normal-mode-sequence[data-beat="4"] #normal-mode-caption{color:#fff;text-shadow:0 0 25px #fff;animation:none}
@keyframes sequenceNoise{0%{transform:translate(0,0)}25%{transform:translate(-4%,2%)}50%{transform:translate(3%,-3%)}75%{transform:translate(2%,4%)}100%{transform:translate(-3%,-2%)}}
@keyframes sequenceStrobe{0%,100%{box-shadow:inset 0 0 100px rgba(255,0,25,.05)}50%{box-shadow:inset 0 0 100px rgba(255,0,25,.5)}}
@keyframes sequenceShake{0%{transform:translate(0)}25%{transform:translate(7px,-3px)}50%{transform:translate(-6px,4px)}75%{transform:translate(3px,5px)}}
@keyframes captionJitter{0%,100%{transform:translate(0)}50%{transform:translate(1px,-1px);text-shadow:2px 0 #f00,-2px 0 #0ff}}
@keyframes faceLunge{0%,100%{transform:translate(-50%,-50%) scale(1.15) rotate(-5deg)}50%{transform:translate(-50%,-50%) scale(1.48) rotate(7deg)}}
@media(prefers-reduced-motion:reduce){.sequence-noise,.sequence-face,#normal-mode-caption{animation:none!important}}
@media(max-width:600px){.normal-mode-button{margin-top:12px}.sequence-figure{width:95vw}.sequence-face{width:82vw}#normal-mode-caption{top:16%;letter-spacing:.12em}}

/* The normal-mode exit is genuinely clean: no lingering haunt over the proxy. */
body.normal-browsing #horror-overlay,body.normal-browsing #horror-entity,body.normal-browsing #horror-static,body.normal-browsing #horror-message,body.normal-browsing #horror-flash{display:none!important}
body.normal-browsing #sj-frame{filter:none!important}
body.normal-browsing .hud-brand,body.normal-browsing .hud-status .signal-dot{animation:none!important;filter:none!important}

/* NORMAL SCRAMJET MODE: keep the proxy, remove the horror presentation. */
body.normal-browsing #horror-hud{background:rgba(18,20,24,.96);border-bottom:1px solid #343a43;backdrop-filter:none;color:#e8edf2}
body.normal-browsing .hud-brand{color:#e8edf2;animation:none!important;text-shadow:none!important}
body.normal-browsing .hud-eye,body.normal-browsing .hud-status{display:none!important}
body.normal-browsing .nav-form input{background:#0b0e12;border-color:#414954;color:#f4f6f8}
body.normal-browsing .nav-form button,body.normal-browsing #return-home{background:#252c35;border:1px solid #596575;color:#f4f6f8;box-shadow:none}
body.normal-browsing .nav-form button:hover,body.normal-browsing #return-home:hover{background:#35404d}
body.normal-browsing #sj-frame{z-index:2;filter:none!important}


/* FIVE-SECOND NORMAL-MODE FALSE PROMISE: deliberately extreme, then fully gone. */
#normal-mode-sequence{background:#000!important;animation:nightmareScreen .095s steps(2,end) infinite!important;cursor:none}
#normal-mode-sequence:before,#normal-mode-sequence:after{content:"";position:absolute;inset:-8%;pointer-events:none;z-index:7;mix-blend-mode:screen}
#normal-mode-sequence:before{background:repeating-linear-gradient(0deg,transparent 0 2px,rgba(255,255,255,.17) 3px,transparent 4px 6px),repeating-linear-gradient(90deg,transparent 0 47px,rgba(255,0,35,.14) 48px,transparent 50px);animation:hardScan .055s steps(3) infinite}
#normal-mode-sequence:after{background:linear-gradient(90deg,transparent 0 12%,rgba(255,0,35,.22) 13%,transparent 15% 48%,rgba(255,255,255,.12) 50%,transparent 53% 86%,rgba(0,220,255,.16) 88%,transparent 90%);animation:rgbTear .13s steps(2) infinite}
.sequence-noise{z-index:9!important;inset:-40%!important;opacity:.55!important;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E")!important;background-size:170px 170px!important;mix-blend-mode:screen;animation:violentNoise .075s steps(2) infinite!important}
.sequence-vignette{z-index:10!important;background:radial-gradient(ellipse at center,transparent 0 9%,rgba(0,0,0,.55) 45%,#000 83%)!important;box-shadow:inset 0 0 90px 35px #000!important}
.sequence-tear{position:absolute;z-index:8;left:-10%;width:120%;height:7vh;opacity:0;background:linear-gradient(90deg,transparent,#fff 18%,#ff002b 37%,#050505 52%,#00d9ff 72%,transparent);mix-blend-mode:screen;filter:contrast(4);transform:skewY(-5deg)}
.tear-one{top:24%;animation:tearA .31s steps(2) infinite}.tear-two{top:57%;height:3vh;animation:tearB .23s steps(2) infinite}.tear-three{top:78%;height:11vh;animation:tearC .41s steps(2) infinite}
.sequence-flash{position:absolute;z-index:6;inset:0;pointer-events:none;background:#fff;opacity:0;animation:flashbang .77s steps(1) infinite}
.sequence-warning{position:absolute;z-index:11;top:4%;left:-20%;width:140%;text-align:center;color:#ff193b;font:900 clamp(12px,2vw,22px) 'IBM Plex Mono',monospace;letter-spacing:.5em;text-shadow:4px 0 #00eaff,-4px 0 #f00;transform:rotate(-3deg);animation:warningSlam .38s steps(2) infinite}
.sequence-figure{z-index:3!important;width:min(95vw,1100px)!important;height:130vh!important;top:55%!important;opacity:0;filter:contrast(2.5) brightness(.6) drop-shadow(0 0 45px #f00028)!important;clip-path:polygon(40% 0,60% 0,72% 8%,82% 28%,100% 100%,0 100%,18% 28%,28% 8%)!important}
.sequence-figure:before{left:22%!important;top:2%!important;width:56%!important;height:34%!important;background:radial-gradient(ellipse at 50% 30%,#090609 0 35%,#000 72%)!important;box-shadow:0 0 90px 65px #000,0 0 30px 8px #5c0015!important}
.sequence-figure:after{top:29%!important;left:34%!important;width:32%!important;height:45%!important;background:#000!important;filter:blur(8px)!important}
.sequence-eye{top:18%!important;width:clamp(22px,5vw,65px)!important;height:clamp(7px,1.4vw,17px)!important;background:#fff!important;box-shadow:0 0 12px 8px #f00,0 0 65px 28px #ff001e!important;animation:eyeBlink .19s steps(2) infinite}
.sequence-face{z-index:5!important;width:min(78vw,780px)!important;background:radial-gradient(ellipse at 50% 38%,#240008 0 12%,#080307 48%,#000 73%)!important;box-shadow:0 0 140px 70px rgba(255,0,35,.55),inset 0 0 80px #000!important;filter:contrast(3) brightness(.8)!important}
.sequence-face i{height:8%!important;background:#fff!important;box-shadow:0 0 25px 18px #f00,0 0 75px 30px #f00024!important;animation:eyeBlink .13s steps(2) infinite}
.sequence-face b{top:61%!important;height:24%!important;width:32%!important;left:34%!important;background:repeating-linear-gradient(0deg,#000 0 7px,#8c0019 8px 10px)!important;clip-path:polygon(0 0,100% 0,78% 100%,22% 100%)!important;filter:drop-shadow(0 0 12px red)}
.sequence-mouth{position:absolute;z-index:6;left:50%;top:70%;width:clamp(50px,17vw,190px);height:clamp(24px,6vw,68px);transform:translateX(-50%);background:repeating-linear-gradient(0deg,#000 0 5px,#e00025 6px 8px);clip-path:polygon(0 0,100% 0,76% 100%,24% 100%);opacity:0;filter:drop-shadow(0 0 22px red)}
.sequence-crosshair{position:absolute;z-index:12;inset:0;display:grid;place-items:center;color:rgba(255,0,40,.5);font:100px monospace;opacity:.3;animation:crosshair .4s steps(2) infinite}
#normal-mode-caption{z-index:13!important;top:44%!important;padding:0 5vw!important;font-weight:900!important;font-size:clamp(19px,4vw,48px)!important;letter-spacing:.12em!important;color:#fff!important;text-shadow:4px 0 #f00,-4px 0 #00eaff,0 0 30px red!important;animation:captionViolence .09s steps(2) infinite!important}
#normal-mode-caption:before,#normal-mode-caption:after{content:attr(data-text);position:absolute;inset:0;pointer-events:none;overflow:hidden}
#normal-mode-caption:before{color:#f00;transform:translate(-5px,1px);clip-path:inset(0 0 48%);animation:captionSlice .16s steps(2) infinite}
#normal-mode-caption:after{color:#00efff;transform:translate(5px,-2px);clip-path:inset(52% 0 0);animation:captionSlice .11s steps(2) reverse infinite}
.sequence-counter{z-index:13!important;bottom:5%!important;color:#fff!important;text-shadow:0 0 12px red!important;animation:counterFreak .2s steps(2) infinite}
.sequence-coordinates{position:absolute;z-index:13;left:0;right:0;bottom:2%;text-align:center;color:#ff193b;font:9px 'IBM Plex Mono',monospace;letter-spacing:.18em;animation:counterFreak .12s steps(2) infinite}
#normal-mode-sequence[data-beat="0"] .sequence-figure{opacity:.2;transform:translate(-50%,-43%) scale(.8)}
#normal-mode-sequence[data-beat="1"]{background:#190008!important}#normal-mode-sequence[data-beat="1"] .sequence-figure{opacity:1;transform:translate(-50%,-43%) scale(1.2)}
#normal-mode-sequence[data-beat="2"]{background:#f00020!important;animation:nightmareScreen .055s steps(2) infinite!important}#normal-mode-sequence[data-beat="2"] .sequence-figure{opacity:1;transform:translate(-48%,-42%) scale(1.8)}
#normal-mode-sequence[data-beat="3"]{background:#000!important}#normal-mode-sequence[data-beat="3"] .sequence-face{opacity:1!important;transform:translate(-50%,-50%) scale(1.45) rotate(4deg)!important;animation:faceLunge .18s steps(2) infinite!important}
#normal-mode-sequence[data-beat="4"] .sequence-mouth{opacity:1;animation:mouthSnap .16s steps(2) infinite}
#normal-mode-sequence[data-beat="5"]{background:#fff!important;animation:nightmareScreen .045s steps(2) infinite!important}#normal-mode-sequence[data-beat="5"] .sequence-figure,#normal-mode-sequence[data-beat="5"] .sequence-face{opacity:1!important;transform:translate(-50%,-50%) scale(2.2)!important;filter:invert(1) contrast(4)!important}
#normal-mode-sequence[data-beat="6"]{background:#030003!important}#normal-mode-sequence[data-beat="6"] .sequence-face{opacity:1!important;transform:translate(-50%,-50%) scale(1.9)!important;filter:contrast(4) brightness(1.4)!important}
#normal-mode-sequence[data-beat="7"]{background:#000!important;animation:nightmareScreen .07s steps(2) infinite!important}#normal-mode-sequence[data-beat="7"] .sequence-figure,#normal-mode-sequence[data-beat="7"] .sequence-face{opacity:0!important}
#normal-mode-sequence[data-beat="7"] .sequence-flash{animation:finalFlash .09s steps(1) infinite}
#normal-mode-sequence[data-beat="7"] #normal-mode-caption{top:44%!important;color:#fff!important;font-size:clamp(17px,3vw,35px)!important}
#normal-mode-sequence[data-beat="1"] .tear-one,#normal-mode-sequence[data-beat="2"] .tear-two,#normal-mode-sequence[data-beat="3"] .tear-three,#normal-mode-sequence[data-beat="4"] .tear-one,#normal-mode-sequence[data-beat="5"] .tear-two,#normal-mode-sequence[data-beat="6"] .tear-three{opacity:.85}
@keyframes nightmareScreen{0%{transform:translate(0);filter:none}20%{transform:translate(-3px,2px);filter:contrast(2)}40%{transform:translate(4px,-2px);filter:hue-rotate(90deg)}60%{transform:translate(-2px,-4px);filter:invert(.18) contrast(3)}80%{transform:translate(5px,1px);filter:hue-rotate(-90deg)}}
@keyframes hardScan{0%{transform:translateY(-8%)}100%{transform:translateY(8%)}}
@keyframes rgbTear{0%{transform:translateX(-5%) skewX(-5deg)}50%{transform:translateX(6%) skewX(8deg)}100%{transform:translateX(-3%) skewX(-8deg)}}
@keyframes violentNoise{0%{transform:translate(-8%,-5%) scale(1.2)}50%{transform:translate(7%,4%) scale(1.1)}100%{transform:translate(-4%,8%) scale(1.3)}}
@keyframes tearA{0%,100%{transform:translateX(-80%) skewY(8deg)}50%{transform:translateX(80%) skewY(-8deg);opacity:.9}}
@keyframes tearB{0%,100%{transform:translateX(90%)}50%{transform:translateX(-90%);opacity:.8}}
@keyframes tearC{0%,100%{transform:translateX(-70%) scaleY(.4)}50%{transform:translateX(70%) scaleY(1.6);opacity:.9}}
@keyframes flashbang{0%,88%,100%{opacity:0}89%{opacity:.9}90%{opacity:0}93%{opacity:.45}94%{opacity:0}}
@keyframes finalFlash{0%,100%{opacity:0}45%{opacity:1;background:#fff}50%{opacity:0}65%{opacity:.9;background:#e00025}}
@keyframes eyeBlink{0%,35%,100%{transform:scaleY(1)}50%,70%{transform:scaleY(.12)}}
@keyframes warningSlam{0%,100%{transform:translateX(-4%) rotate(-3deg)}50%{transform:translateX(4%) rotate(3deg);filter:blur(1px)}}
@keyframes captionViolence{0%{transform:translate(3px,-2px) skewX(8deg)}50%{transform:translate(-4px,2px) skewX(-9deg)}100%{transform:translate(2px,1px) skewX(4deg)}}
@keyframes captionSlice{0%{clip-path:inset(0 0 75% 0);transform:translate(-8px,2px)}50%{clip-path:inset(35% 0 25% 0);transform:translate(7px,-3px)}100%{clip-path:inset(70% 0 0 0);transform:translate(-4px,1px)}}
@keyframes crosshair{0%,100%{transform:translate(0);opacity:.15}50%{transform:translate(8px,-5px);opacity:.65}}
@keyframes counterFreak{0%,100%{transform:translateX(0);opacity:.9}50%{transform:translateX(4px);opacity:.35}}
@keyframes mouthSnap{0%,100%{transform:translateX(-50%) scaleY(.2)}50%{transform:translateX(-50%) scaleY(1.5)}}
@media(prefers-reduced-motion:reduce){#normal-mode-sequence *{animation-duration:.5s!important}}

/* Keep the apparition legible above the interference layers. */
.sequence-figure{z-index:11!important}
.sequence-face{z-index:12!important}
.sequence-mouth{z-index:12!important}
.sequence-warning{z-index:13!important}
.sequence-crosshair{z-index:14!important}
#normal-mode-caption,.sequence-counter,.sequence-coordinates{z-index:15!important}

