.cinematic-door{margin-top:48px;padding:0!important;overflow:hidden!important;background:rgba(5,8,9,.82)!important;border:1px solid rgba(255,255,255,.1)!important;box-shadow:0 40px 120px rgba(0,0,0,.55),0 0 70px rgba(0,245,212,.04)}
.door-intro{padding:42px 42px 26px;position:relative;z-index:2}.door-intro h2{font-size:clamp(38px,5vw,68px);line-height:.95;margin:10px 0}.door-intro h2 em{font-style:normal;color:var(--cyan);text-shadow:0 0 30px rgba(0,245,212,.3)}.door-intro p{margin:0;color:var(--muted);max-width:650px}
.hack-stage{height:min(760px,72vw);min-height:600px;position:relative;overflow:hidden;background:radial-gradient(circle at 50% 48%,rgba(31,43,43,.55),rgba(2,5,6,.98) 60%),linear-gradient(135deg,#0b1011,#030506);isolation:isolate;perspective:1400px}
.stage-vignette{position:absolute;inset:-10%;z-index:15;pointer-events:none;background:radial-gradient(circle at center,transparent 38%,rgba(0,0,0,.65) 85%,rgba(0,0,0,.95));mix-blend-mode:multiply}.stage-scanlines{position:absolute;inset:0;z-index:16;pointer-events:none;opacity:.12;background:repeating-linear-gradient(0deg,transparent 0 4px,rgba(255,255,255,.04) 5px 6px);animation:scanMove 8s linear infinite}.stage-hud{position:absolute;top:22px;z-index:20;font:700 9px ui-monospace,monospace;letter-spacing:.16em;color:#697779}.stage-hud span{display:block;color:#4e5b5c;margin-bottom:6px}.stage-hud b{color:var(--cyan)}.stage-hud-left{left:28px}.stage-hud-right{right:28px;text-align:right}
.door-camera{position:absolute;left:50%;top:51%;width:420px;height:560px;transform:translate(-50%,-50%) translateZ(0) rotateX(2deg);transform-style:preserve-3d;transition:transform 1.2s cubic-bezier(.16,1,.3,1),filter 1.2s,opacity .7s;z-index:3}.rust-door-image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 45px 60px rgba(0,0,0,.75));user-select:none}.door-frame-glow{position:absolute;inset:8% 10%;border-radius:18px;background:radial-gradient(ellipse,rgba(255,170,50,.14),transparent 60%);filter:blur(30px);opacity:.6}.door-depth{position:absolute;inset:6% 11%;border:1px solid rgba(255,255,255,.06);border-radius:18px;box-shadow:inset 0 0 60px rgba(0,0,0,.65)}
.approach-button{position:absolute;left:50%;bottom:38px;z-index:25;transform:translateX(-50%);border:1px solid rgba(255,255,255,.13);background:rgba(4,8,8,.78);backdrop-filter:blur(14px);border-radius:14px;padding:14px 20px;color:#fff;cursor:pointer;display:flex;align-items:center;gap:10px;box-shadow:0 15px 50px rgba(0,0,0,.45);transition:.35s}.approach-button:hover{border-color:rgba(0,245,212,.5);box-shadow:0 0 40px rgba(0,245,212,.12);transform:translateX(-50%) translateY(-3px)}.approach-button b{font:800 10px ui-monospace,monospace;letter-spacing:.14em}.approach-button small{font:700 7px ui-monospace,monospace;color:#637071}.approach-dot{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 15px var(--cyan);animation:dotPulse 1.2s infinite}
.hack-stage.approaching .door-camera{transform:translate(-50%,-50%) translateZ(260px) scale(1.55) rotateX(7deg);filter:brightness(.72) saturate(.8)}.hack-stage.approaching .approach-button{opacity:0;pointer-events:none}.hack-stage.approaching .lock-camera{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) translateZ(300px) scale(1)}
.lock-camera{position:absolute;left:50%;top:52%;width:570px;height:620px;z-index:8;opacity:0;pointer-events:none;transform:translate(-50%,-48%) translateZ(0) scale(.45);transform-style:preserve-3d;transition:transform 1.25s cubic-bezier(.12,.9,.16,1),opacity .7s}.lock-shadow{position:absolute;left:50%;top:50%;width:430px;height:450px;transform:translate(-50%,-45%);border-radius:50%;background:rgba(0,0,0,.8);filter:blur(35px)}.lock-device{position:absolute;left:50%;top:47%;width:390px;height:470px;transform:translate(-50%,-50%) rotateX(3deg) rotateY(-2deg);filter:drop-shadow(0 35px 35px rgba(0,0,0,.8));transform-style:preserve-3d}.codelock-image{position:absolute;width:100%;height:100%;object-fit:contain;filter:contrast(1.05) saturate(.92)}
.lock-screen{position:absolute;left:24%;top:11%;width:52%;height:20%;border-radius:7px;background:linear-gradient(180deg,#080c0c,#020404);border:1px solid rgba(0,245,212,.24);box-shadow:inset 0 0 15px rgba(0,0,0,.9),0 0 15px rgba(0,245,212,.05);display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:3;font-family:ui-monospace,monospace;text-shadow:0 0 10px currentColor}.lock-screen span{font-size:9px;letter-spacing:.2em;color:#647071}.lock-screen strong{font-size:25px;letter-spacing:.18em;color:#d9fdf8;line-height:1;margin:3px 0}.lock-screen small{font-size:6px;letter-spacing:.14em;color:#657273}.lock-screen.error{animation:screenError .38s}.lock-screen.success{color:var(--cyan);box-shadow:0 0 30px rgba(0,245,212,.35),inset 0 0 20px rgba(0,245,212,.1)}
.lock-keyboard{position:absolute;left:23%;top:39%;width:54%;display:grid;grid-template-columns:repeat(3,1fr);gap:7px;z-index:5}.lock-keyboard button{height:48px;border:1px solid rgba(255,255,255,.18);border-radius:6px;background:linear-gradient(180deg,#f4dfd3,#b9988b);color:#19130f;font-weight:900;box-shadow:inset 0 2px 0 rgba(255,255,255,.45),0 4px 0 #6e574f,0 7px 10px rgba(0,0,0,.35);cursor:pointer;transition:transform .07s,box-shadow .07s,filter .2s}.lock-keyboard button:hover{filter:brightness(1.12)}.lock-keyboard button:active,.lock-keyboard button.pressed{transform:translateY(4px);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 0 0 #6e574f,0 2px 5px rgba(0,0,0,.4)}.lock-keyboard button[data-key="enter"]{background:linear-gradient(180deg,#9be5c9,#438a72);color:#07110d}.lock-keyboard button[data-key="clear"]{background:linear-gradient(180deg,#e4c5b9,#8e6a5d)}
.hack-hand{position:absolute;z-index:10;left:68%;top:74%;width:120px;height:150px;opacity:0;transform:translate(100px,120px) rotate(-16deg) scale(.7);filter:drop-shadow(0 15px 14px rgba(0,0,0,.7));pointer-events:none;transition:opacity .35s}.hack-stage.approaching .hack-hand{opacity:1;animation:handEnter 1.1s .65s cubic-bezier(.16,1,.3,1) forwards}.hand-palm{position:absolute;right:5px;bottom:12px;width:72px;height:85px;border-radius:38% 48% 38% 42%;background:linear-gradient(145deg,#f4c6a8,#a96346);transform:rotate(-12deg);box-shadow:inset -8px -8px 12px rgba(90,40,25,.22),inset 4px 4px 8px rgba(255,255,255,.18)}.hand-finger{position:absolute;right:60px;top:15px;width:25px;height:108px;border-radius:18px;background:linear-gradient(90deg,#d18d69,#f0b898);transform:rotate(8deg);box-shadow:inset 4px 2px 5px rgba(255,255,255,.15)}
.electric-field{position:absolute;inset:8% 5%;z-index:12;pointer-events:none;opacity:0;background:repeating-linear-gradient(72deg,transparent 0 18px,rgba(0,245,212,.8) 19px 20px,transparent 21px 42px);mix-blend-mode:screen}.hack-stage.shock .electric-field{opacity:1;animation:electric .34s steps(3) 2}.hack-stage.shock .lock-device{animation:deviceShock .34s steps(4) 2}.hack-stage.shock .hack-hand{animation:handShock .34s steps(3) 2}.hack-toast{position:absolute;left:50%;bottom:30px;transform:translateX(-50%);z-index:30;font:800 9px ui-monospace,monospace;letter-spacing:.15em;color:#9ba7a7;background:rgba(3,6,6,.78);border:1px solid rgba(255,255,255,.1);padding:9px 14px;border-radius:9px;opacity:0;transition:.25s}.hack-toast.show{opacity:1}.hack-toast.error{color:#ff806f;border-color:rgba(255,80,60,.3)}.hack-toast.success{color:var(--cyan);border-color:rgba(0,245,212,.3)}
.hack-caption{position:absolute;right:30px;bottom:35px;z-index:9;text-align:right;font:700 8px ui-monospace,monospace;color:#5c696b;letter-spacing:.13em}.hack-caption b{display:block;color:#9aa5a6;margin-top:5px}.hack-flash{position:absolute;inset:0;z-index:50;background:#fff;opacity:0;pointer-events:none}.hack-stage.success-flash .hack-flash{animation:whiteFlash .8s cubic-bezier(.2,.7,.2,1) forwards}
.loot-reveal{position:absolute;inset:0;z-index:45;display:grid;place-items:center;background:radial-gradient(circle at 50% 55%,rgba(255,182,49,.26),rgba(8,6,2,.92) 45%,rgba(1,3,4,.98) 78%);opacity:0;pointer-events:none;transform:scale(1.08);transition:opacity .6s,transform 1s}.loot-reveal.show{opacity:1;pointer-events:auto;transform:scale(1)}.loot-glow{position:absolute;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(255,190,50,.5),rgba(255,150,20,.1) 40%,transparent 70%);filter:blur(20px);animation:goldPulse 2.4s ease-in-out infinite}.loot-chest{position:absolute;top:43%;left:50%;width:220px;height:150px;transform:translate(-50%,-50%);filter:drop-shadow(0 35px 35px rgba(0,0,0,.8));animation:chestReveal 1s .25s cubic-bezier(.16,1,.3,1) both}.chest-body{position:absolute;left:0;right:0;bottom:0;height:90px;border-radius:10px;background:linear-gradient(145deg,#9b5f1f,#3e1d08);border:2px solid #d89a43;box-shadow:inset 0 0 25px rgba(255,210,110,.18)}.chest-lid{position:absolute;left:3px;right:3px;top:10px;height:72px;border-radius:14px 14px 6px 6px;background:linear-gradient(145deg,#e3a74c,#63300b);border:2px solid #f1bd66;transform-origin:bottom;animation:chestOpen .8s .8s cubic-bezier(.2,.8,.2,1) forwards}.chest-lock{position:absolute;left:50%;bottom:28px;width:30px;height:34px;transform:translateX(-50%);border-radius:5px;background:#f0c15e;box-shadow:0 0 22px rgba(255,193,70,.8);z-index:4}.loot-cards{position:absolute;inset:0;pointer-events:none}.loot-card-xl{position:absolute;width:170px;height:230px;border:1px solid rgba(255,207,95,.5);border-radius:16px;background:linear-gradient(160deg,#292018,#080705);color:#fff;text-align:left;padding:18px;box-shadow:0 30px 70px rgba(0,0,0,.65),0 0 40px rgba(255,182,49,.08);opacity:0;cursor:pointer;pointer-events:auto;transform:translate(-50%,-50%) scale(.5) rotate(var(--rot));transition:transform .3s,filter .3s,box-shadow .3s}.loot-card-xl span{display:grid;place-items:center;width:58px;height:58px;border:1px solid rgba(255,200,70,.55);border-radius:14px;color:#ffd878;font-weight:1000;font-size:19px;margin-bottom:26px}.loot-card-xl b{display:block;font-size:15px;line-height:1.05}.loot-card-xl small{display:block;margin-top:8px;color:#8f8778;font:700 7px ui-monospace,monospace;letter-spacing:.12em}.loot-reveal.show .loot-card-xl:nth-child(1){--rot:-10deg;left:22%;top:44%;animation:lootCardIn .8s .95s cubic-bezier(.16,1,.3,1) forwards}.loot-reveal.show .loot-card-xl:nth-child(2){--rot:8deg;left:77%;top:38%;animation:lootCardIn .85s 1.08s cubic-bezier(.16,1,.3,1) forwards}.loot-reveal.show .loot-card-xl:nth-child(3){--rot:-4deg;left:29%;top:75%;animation:lootCardIn .8s 1.2s cubic-bezier(.16,1,.3,1) forwards}.loot-reveal.show .loot-card-xl:nth-child(4){--rot:11deg;left:72%;top:73%;animation:lootCardIn .9s 1.32s cubic-bezier(.16,1,.3,1) forwards}.loot-card-xl:hover{transform:translate(-50%,-56%) scale(1.06) rotate(0deg);filter:brightness(1.2);box-shadow:0 40px 80px rgba(0,0,0,.75),0 0 50px rgba(255,182,49,.22)}.loot-pick{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);z-index:4;font:800 8px ui-monospace,monospace;letter-spacing:.18em;color:#d0c3aa}
@keyframes handEnter{0%{opacity:0;transform:translate(110px,130px) rotate(-18deg) scale(.7)}100%{opacity:1;transform:translate(0,0) rotate(-8deg) scale(1)}}@keyframes handShock{50%{transform:translate(8px,4px) rotate(-10deg)}100%{transform:translate(0,0) rotate(-8deg)}}@keyframes deviceShock{25%{transform:translate(-55%,-50%) rotateX(3deg) rotateY(-4deg)}50%{transform:translate(-46%,-50%) rotateX(3deg) rotateY(4deg)}75%{transform:translate(-53%,-50%) rotateX(3deg) rotateY(-2deg)}}@keyframes electric{0%{clip-path:inset(40% 20% 40% 20%)}50%{clip-path:inset(5% 2% 8% 3%)}100%{clip-path:inset(30% 8% 12% 15%)}}@keyframes screenError{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}@keyframes whiteFlash{0%{opacity:0}18%{opacity:1}42%{opacity:.75}100%{opacity:0}}@keyframes chestReveal{0%{opacity:0;transform:translate(-50%,-42%) scale(.55)}100%{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes chestOpen{0%{transform:rotateX(0)}100%{transform:rotateX(-62deg) translateY(-8px)}}@keyframes lootCardIn{0%{opacity:0;transform:translate(-50%,100px) scale(.35) rotate(var(--rot))}70%{opacity:1;transform:translate(-50%,-20px) scale(1.08) rotate(calc(var(--rot) * .5))}100%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(var(--rot))}}@keyframes goldPulse{50%{transform:scale(1.12);opacity:.75}}@keyframes scanMove{to{background-position:0 80px}}@keyframes dotPulse{50%{opacity:.35;transform:scale(.65)}}
.hack-stage.selected .loot-card-xl{filter:saturate(.6) brightness(.65)}.hack-stage.selected .loot-card-xl.chosen{filter:none;transform:translate(-50%,-58%) scale(1.1) rotate(0);box-shadow:0 0 0 1px rgba(255,211,103,.8),0 0 70px rgba(255,183,50,.35)}
@media(max-width:800px){.hack-stage{height:680px;min-height:680px}.door-camera{width:280px;height:410px}.lock-camera{width:440px;transform:translate(-50%,-48%) scale(.82)}.hack-stage.approaching .lock-camera{transform:translate(-50%,-50%) scale(.9)}.hack-caption{display:none}.stage-hud-right{right:16px}.stage-hud-left{left:16px}.loot-card-xl{width:135px;height:190px}.loot-reveal.show .loot-card-xl:nth-child(1){left:20%;top:32%}.loot-reveal.show .loot-card-xl:nth-child(2){left:80%;top:31%}.loot-reveal.show .loot-card-xl:nth-child(3){left:22%;top:76%}.loot-reveal.show .loot-card-xl:nth-child(4){left:78%;top:76%}}
.hack-stage.approaching{cursor:url('../img/hack-hand-cursor.svg') 8 4,pointer}.lock-keyboard button{cursor:url('../img/hack-hand-cursor.svg') 8 4,pointer}.hack-hand{transition:left .28s cubic-bezier(.16,1,.3,1),top .28s cubic-bezier(.16,1,.3,1)}


/* WAYRUST / DOOR REFERENCE v6 — exact supplied screenshot recreation */
.cinematic-door{margin-top:72px!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;overflow:visible!important}
.exact-reference{position:relative;width:100%;aspect-ratio:1031/530;min-height:0!important;height:auto!important;overflow:hidden;background:#050708;isolation:isolate;border:1px solid rgba(255,255,255,.08);border-radius:8px;box-shadow:0 45px 120px rgba(0,0,0,.7),0 0 80px rgba(0,245,212,.04)}
.reference-layer{position:absolute;inset:0;transform-origin:81.8% 49.5%;transition:transform 1.35s cubic-bezier(.12,.86,.16,1),filter 1.1s;will-change:transform;z-index:2}
.reference-scene{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;display:block;user-select:none;pointer-events:none}
.lock-hotspot{position:absolute;left:65.1%;top:4.5%;width:34.3%;height:76.5%;border:0;background:transparent;cursor:pointer;z-index:8;border-radius:18px;outline:none}
.lock-hotspot::after{content:"";position:absolute;inset:5%;border:1px solid rgba(0,245,212,0);border-radius:15px;transition:.35s;box-shadow:0 0 0 rgba(0,245,212,0)}
.lock-hotspot:hover::after{border-color:rgba(0,245,212,.3);box-shadow:0 0 35px rgba(0,245,212,.12),inset 0 0 20px rgba(0,245,212,.04)}
.exact-reference.lock-focus .reference-layer{transform:scale(1.68);filter:brightness(.88) saturate(.92)}
.exact-reference.lock-focus .lock-hotspot{pointer-events:none}
.code-overlay{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity .45s;z-index:12}
.lock-focus .code-overlay{opacity:1;pointer-events:auto}
.code-screen{position:absolute;left:73.35%;top:16.4%;width:15.3%;height:12.7%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#bffff5;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;background:rgba(1,5,5,.72);border:1px solid rgba(0,245,212,.2);box-shadow:inset 0 0 25px rgba(0,0,0,.95),0 0 20px rgba(0,245,212,.08);border-radius:7px;text-shadow:0 0 10px currentColor;z-index:3}
.code-screen span{font-size:clamp(5px,.58vw,9px);letter-spacing:.12em;color:#93a4a5}.code-screen strong{font-size:clamp(15px,2.1vw,28px);letter-spacing:.18em;line-height:1;margin:4px 0}.code-screen small{font-size:clamp(4px,.45vw,7px);color:#526263;letter-spacing:.1em}
.code-screen.error{animation:refScreenError .36s steps(2)}.code-screen.success{color:#8affdc;box-shadow:0 0 35px rgba(0,245,212,.35),inset 0 0 25px rgba(0,245,212,.15)}
.reference-keypad{position:absolute;left:71.6%;top:39.2%;width:15.7%;height:31%;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(4,1fr);gap:1.3%;z-index:5}
.reference-keypad button{border:0;background:transparent;color:transparent;border-radius:5px;cursor:pointer;transition:transform .07s,background .12s,box-shadow .12s;min-width:0;min-height:0}.reference-keypad button:hover{background:rgba(0,245,212,.12);box-shadow:inset 0 0 12px rgba(0,245,212,.2)}.reference-keypad button.pressed{background:rgba(255,255,255,.13);transform:translateY(2px);box-shadow:inset 0 0 15px rgba(0,245,212,.28)}.reference-keypad button[data-key="enter"]{background:rgba(0,245,212,.03)}
.lock-beam{position:absolute;left:70.5%;top:31.5%;width:18%;height:1px;background:linear-gradient(90deg,transparent,rgba(0,245,212,.9),transparent);opacity:.0;box-shadow:0 0 16px rgba(0,245,212,.9)}.lock-focus .lock-beam{animation:beamSweep 1.2s .15s ease-out forwards}
.lock-cursor{position:absolute;left:82%;top:66%;width:26px;height:26px;border-radius:50%;border:1px solid rgba(0,245,212,.65);box-shadow:0 0 0 8px rgba(0,245,212,.04),0 0 25px rgba(0,245,212,.25);opacity:0;pointer-events:none}.lock-cursor span{position:absolute;left:50%;top:50%;width:4px;height:4px;background:#d8fff8;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 12px #00f5d4}.lock-focus .lock-cursor{animation:cursorHack 1.5s .2s cubic-bezier(.2,.8,.2,1) forwards}
.cinematic-effects{position:absolute;inset:0;pointer-events:none;z-index:14;opacity:.0;transition:opacity .4s}.lock-focus .cinematic-effects{opacity:1}.scan-line{position:absolute;left:65%;top:-5%;width:1px;height:110%;background:linear-gradient(180deg,transparent,rgba(0,245,212,.45),transparent);box-shadow:0 0 20px rgba(0,245,212,.25);transform:rotate(8deg);animation:refScan 2.8s linear infinite}.scan-line-2{animation-delay:-1.2s;opacity:.4}.spark{position:absolute;color:#c7fff8;text-shadow:0 0 15px #00f5d4;opacity:0}.lock-focus .s1{left:70%;top:32%;animation:sparkPop 1s .3s}.lock-focus .s2{left:91%;top:20%;animation:sparkPop 1s .6s}.lock-focus .s3{left:74%;top:73%;animation:sparkPop 1s .9s}.lock-focus .s4{left:88%;top:67%;animation:sparkPop 1s 1.1s}
.shock-grid{position:absolute;inset:0;background:repeating-linear-gradient(115deg,transparent 0 34px,rgba(255,62,62,.3) 35px,transparent 36px 72px);mix-blend-mode:screen;opacity:0}.shock .shock-grid{animation:gridShock .38s steps(2) 2}
.reference-vignette{position:absolute;inset:0;z-index:16;pointer-events:none;background:radial-gradient(circle at 50% 45%,transparent 45%,rgba(0,0,0,.18) 78%,rgba(0,0,0,.55));mix-blend-mode:multiply}.reference-hint{position:absolute;right:2.5%;bottom:2.8%;z-index:18;color:#6f7b7d;font:700 clamp(5px,.6vw,9px) ui-monospace,monospace;letter-spacing:.13em;text-align:right;opacity:.75}.reference-hint b{display:block;color:#aab6b7;margin-top:5px}.stage-status{position:absolute;left:2.8%;top:3.8%;z-index:18;display:flex;gap:8px;align-items:center;font:800 clamp(5px,.55vw,8px) ui-monospace,monospace;letter-spacing:.12em;color:#6d7b7c}.stage-status span{color:#00f5d4}.stage-status b{color:#9da9aa}
.door-opening-layer{position:absolute;inset:0;z-index:25;pointer-events:none;opacity:0;background:#020303;overflow:hidden}.success .door-opening-layer{opacity:1;animation:openingFade .35s .25s both}.door-opening-frame{position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,rgba(0,245,212,.2),transparent 42%),#020303}.door-open-left,.door-open-right{position:absolute;top:0;width:47.8%;height:100%;background-image:url('../img/door_reference_open.png');background-size:200% 100%;background-repeat:no-repeat;filter:brightness(.82) contrast(1.05);box-shadow:0 0 70px rgba(0,0,0,.95)}.door-open-left{left:2%;background-position:left center;transform-origin:left center}.door-open-right{right:2%;background-position:right center;transform-origin:right center}.success .door-open-left{animation:doorLeftOpen 1.35s .55s cubic-bezier(.16,1,.3,1) forwards}.success .door-open-right{animation:doorRightOpen 1.35s .55s cubic-bezier(.16,1,.3,1) forwards}.vault-light{position:absolute;left:50%;top:50%;width:25%;height:70%;transform:translate(-50%,-50%) scaleY(.2);background:linear-gradient(90deg,transparent,#dffff9,transparent);filter:blur(20px);opacity:0}.success .vault-light{animation:vaultBurst 1.4s .75s cubic-bezier(.2,.8,.2,1) forwards}.loot-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.4);text-align:center;color:#d9fff8;font-family:ui-monospace,monospace;opacity:0}.success .loot-core{animation:coreReveal 1.1s 1s cubic-bezier(.16,1,.3,1) forwards}.loot-core b{display:block;font-size:clamp(15px,2.3vw,34px);letter-spacing:.2em;text-shadow:0 0 30px #00f5d4}.loot-core span{display:block;margin-top:8px;color:#658080;font-size:clamp(5px,.55vw,8px);letter-spacing:.18em}.loot-ring{position:absolute;left:50%;top:50%;width:160px;height:160px;border:1px solid rgba(0,245,212,.65);border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 35px rgba(0,245,212,.2),inset 0 0 30px rgba(0,245,212,.08);animation:ringSpin 4s linear infinite}
.cinematic-loot{position:absolute;inset:0;opacity:0;pointer-events:none}.success .cinematic-loot{animation:lootBankIn .6s 1.8s forwards}.cinematic-loot .loot-card-xl{position:absolute;width:18%;height:28%;border:1px solid rgba(0,245,212,.35);border-radius:10px;background:linear-gradient(150deg,rgba(22,32,31,.95),rgba(2,6,6,.98));color:#e8fffb;text-align:left;padding:14px;box-shadow:0 20px 60px rgba(0,0,0,.7),0 0 35px rgba(0,245,212,.08);cursor:pointer}.cinematic-loot .loot-card-xl:nth-child(1){left:7%;top:57%}.cinematic-loot .loot-card-xl:nth-child(2){right:7%;top:48%}.cinematic-loot .loot-card-xl:nth-child(3){right:18%;bottom:5%}.cinematic-loot .loot-card-xl b{display:block;font-size:clamp(8px,1vw,14px)}.cinematic-loot .loot-card-xl small{display:block;margin-top:8px;color:#6f8382;font:700 clamp(5px,.5vw,8px) ui-monospace,monospace;letter-spacing:.1em}
.hack-toast{bottom:4%!important;z-index:40!important}.hack-flash{position:absolute;inset:0;z-index:50;background:#fff;opacity:0;pointer-events:none}.success-flash .hack-flash{animation:whiteFlash .8s cubic-bezier(.2,.7,.2,1) forwards}.success .reference-layer{filter:brightness(.4) saturate(.6);transform:scale(1.04);transition:transform .9s,filter .9s}.success .reference-vignette{opacity:.15}
@keyframes refScreenError{0%,100%{transform:translateX(0);filter:none}25%{transform:translateX(-7px);filter:hue-rotate(120deg)}50%{transform:translateX(7px)}75%{transform:translateX(-4px);filter:hue-rotate(80deg)}}
@keyframes beamSweep{0%{opacity:0;transform:scaleX(.2)}25%{opacity:1}100%{opacity:0;transform:scaleX(1.4)}}
@keyframes cursorHack{0%{opacity:0;transform:translate(35px,20px) scale(.6)}40%{opacity:1}72%{transform:translate(-40px,-35px) scale(1)}100%{opacity:0;transform:translate(-40px,-35px) scale(1.2)}}
@keyframes refScan{from{transform:translateX(-40px) rotate(8deg)}to{transform:translateX(450px) rotate(8deg)}}
@keyframes sparkPop{0%{opacity:0;transform:scale(.2) rotate(0)}30%{opacity:1;transform:scale(1.2) rotate(30deg)}100%{opacity:0;transform:translateY(20px) scale(.3) rotate(90deg)}}
@keyframes gridShock{0%,100%{opacity:0}40%{opacity:1}70%{opacity:.15}}
@keyframes openingFade{from{background:#020303}to{background:#010202}}
@keyframes doorLeftOpen{0%{transform:perspective(1200px) rotateY(0) translateX(0)}100%{transform:perspective(1200px) rotateY(-82deg) translateX(-8%)}}
@keyframes doorRightOpen{0%{transform:perspective(1200px) rotateY(0) translateX(0)}100%{transform:perspective(1200px) rotateY(82deg) translateX(8%)}}
@keyframes vaultBurst{0%{opacity:0;transform:translate(-50%,-50%) scaleY(.2)}35%{opacity:1}100%{opacity:.55;transform:translate(-50%,-50%) scaleY(1.4)}}
@keyframes coreReveal{0%{opacity:0;transform:translate(-50%,-50%) scale(.35)}60%{opacity:1;transform:translate(-50%,-50%) scale(1.08)}100%{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes ringSpin{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes lootBankIn{from{opacity:0}to{opacity:1;pointer-events:auto}}
@media(max-width:800px){.exact-reference{aspect-ratio:1031/530;border-radius:0}.reference-hint{display:none}.stage-status{display:none}.lock-focus .reference-layer{transform:scale(1.85)}.cinematic-door{margin-top:48px!important}.cinematic-loot .loot-card-xl{width:25%;height:24%}}

/* v7 — clean single-door cinematic */
.exact-reference{image-rendering:auto}
.exact-reference .reference-layer{transform-origin:50% 50%;will-change:transform,filter}
.exact-reference.lock-focus .reference-layer{transform:scale(1.72);filter:brightness(.9) saturate(.98)}
.exact-reference.success .reference-layer{transform-origin:48% 50%;animation:doorSingleOpen 1.35s cubic-bezier(.16,1,.3,1) .15s forwards}
.exact-reference.door-closing .reference-layer{animation:doorSingleClose 1.15s cubic-bezier(.2,.8,.2,1) forwards}
.exact-reference.success .door-opening-layer{background:radial-gradient(circle at 50% 50%,rgba(0,245,212,.22),transparent 30%),linear-gradient(90deg,rgba(0,0,0,.98),rgba(0,245,212,.07),rgba(0,0,0,.98));animation:openingFade .5s .05s both}
.door-open-left,.door-open-right{display:none!important}
.door-opening-frame{background:radial-gradient(ellipse at 50% 50%,rgba(224,255,250,.45),rgba(0,245,212,.08) 24%,rgba(0,0,0,.98) 62%);opacity:0;transform:scaleX(.05);filter:blur(16px)}
.exact-reference.success .door-opening-frame{animation:vaultDoorReveal 1.3s .3s cubic-bezier(.16,1,.3,1) forwards}
.exact-reference.door-closing .door-opening-frame{animation:vaultDoorHide .9s both}
.vault-light{width:34%;height:78%;background:linear-gradient(90deg,transparent,#eafffb 45%,#00f5d4 50%,#eafffb 55%,transparent);filter:blur(28px)}
.exact-reference.success .vault-light{animation:vaultBurstPro 1.2s .42s cubic-bezier(.16,1,.3,1) forwards}
.exact-reference.door-closing .vault-light{animation:vaultHide .8s both}
.reference-keypad button{min-width:24px;min-height:24px;touch-action:manipulation}
.reference-keypad button:focus-visible{outline:2px solid rgba(0,245,212,.9);outline-offset:2px;background:rgba(0,245,212,.18)}
.exact-reference.lock-focus .reference-keypad button{animation:keyReady .9s both}
.exact-reference.lock-focus .reference-keypad button:nth-child(2n){animation-delay:.04s}
.exact-reference.lock-focus .reference-keypad button:nth-child(3n){animation-delay:.08s}
.exact-reference .hack-flash{mix-blend-mode:screen}
.exact-reference.success .cinematic-effects{opacity:1}
.exact-reference.success .scan-line{animation:successScan .9s linear 2}
.exact-reference.success .spark{animation:sparkBurst .9s ease-out infinite}
.cinematic-loot .loot-card-xl{backdrop-filter:blur(16px);transition:transform .35s,box-shadow .35s,border-color .35s}
.cinematic-loot .loot-card-xl:hover{transform:translateY(-8px) scale(1.03);border-color:rgba(0,245,212,.7);box-shadow:0 25px 80px rgba(0,0,0,.75),0 0 45px rgba(0,245,212,.18)}
@keyframes doorSingleOpen{0%{transform:scale(1.72) translate3d(0,0,0) rotateY(0);filter:brightness(.9)}55%{transform:scale(1.78) translate3d(-4%,0,0) rotateY(-9deg);filter:brightness(.7)}100%{transform:scale(1.84) translate3d(-10%,0,0) rotateY(-17deg);filter:brightness(.5)}}
@keyframes doorSingleClose{0%{transform:scale(1.84) translate3d(-10%,0,0) rotateY(-17deg);filter:brightness(.5)}60%{transform:scale(1.77) translate3d(-3%,0,0) rotateY(-7deg);filter:brightness(.78)}100%{transform:scale(1.72) translate3d(0,0,0) rotateY(0);filter:brightness(.9)}}
@keyframes vaultDoorReveal{0%{opacity:0;transform:scaleX(.05);filter:blur(22px)}45%{opacity:1;transform:scaleX(.65);filter:blur(10px)}100%{opacity:.75;transform:scaleX(1);filter:blur(3px)}}
@keyframes vaultDoorHide{0%{opacity:.75;transform:scaleX(1)}100%{opacity:0;transform:scaleX(.05)}}
@keyframes vaultBurstPro{0%{opacity:0;transform:translate(-50%,-50%) scaleX(.1) scaleY(.15)}35%{opacity:1;transform:translate(-50%,-50%) scaleX(.7) scaleY(.8)}100%{opacity:.32;transform:translate(-50%,-50%) scaleX(1.3) scaleY(1.2)}}
@keyframes vaultHide{to{opacity:0;transform:translate(-50%,-50%) scale(.1)}}
@keyframes keyReady{0%{filter:brightness(.7)}45%{filter:brightness(1.35)}100%{filter:brightness(1)}}
@keyframes successScan{0%{transform:translateX(-20px) rotate(8deg);opacity:0}25%{opacity:1}100%{transform:translateX(460px) rotate(8deg);opacity:0}}
@keyframes sparkBurst{0%{opacity:0;transform:translate(0,0) scale(.2)}25%{opacity:1}100%{opacity:0;transform:translate(25px,-35px) scale(1.5) rotate(90deg)}}

/* v8 — stable initial scene: never replace the reference with the success screen */
.exact-reference .reference-layer{opacity:1!important;visibility:visible!important;display:block!important;}
.exact-reference .door-opening-layer{opacity:0;visibility:hidden;}
.exact-reference.success .door-opening-layer{visibility:visible;}
.exact-reference:not(.success) .cinematic-loot{opacity:0!important;visibility:hidden!important;}
.exact-reference:not(.success) .loot-core{opacity:0!important;}
.exact-reference:not(.success) .vault-light{opacity:0!important;}

/* v9 — one-piece door animation / clean boot */
.exact-reference .reference-layer{opacity:1!important;visibility:visible!important;display:block!important;transform-origin:78% 50%;}
.exact-reference .reference-scene{image-rendering:auto;backface-visibility:hidden;}
.exact-reference:not(.success) .reference-layer{transform:none!important;filter:none!important;animation:none!important;}
.exact-reference .door-opening-layer{opacity:0!important;visibility:hidden!important;background:radial-gradient(ellipse at 50% 50%,rgba(210,255,247,.55),rgba(0,245,212,.12) 28%,rgba(0,0,0,.98) 70%);}
.exact-reference.success .door-opening-layer{opacity:1!important;visibility:visible!important;}
.exact-reference .door-open-left,.exact-reference .door-open-right{display:none!important;}
.exact-reference .door-opening-frame{opacity:0;transform:scaleX(.08);filter:blur(24px);background:radial-gradient(ellipse at center,#f5fffd 0%,#00f5d4 12%,rgba(0,245,212,.12) 32%,rgba(0,0,0,.98) 70%);}
.exact-reference.success .door-opening-frame{animation:v9VaultReveal 1.15s .35s cubic-bezier(.16,1,.3,1) forwards;}
.exact-reference.door-opened .reference-layer{animation:v9DoorOpen 1.35s cubic-bezier(.16,1,.3,1) forwards!important;}
.exact-reference.door-closing .reference-layer{animation:v9DoorClose 1.2s cubic-bezier(.2,.8,.2,1) forwards!important;}
.exact-reference.door-closing .door-opening-frame{animation:v9VaultHide .9s both!important;}
.exact-reference .vault-light{opacity:0;}
.exact-reference.success .vault-light{animation:v9Light 1.25s .45s cubic-bezier(.16,1,.3,1) forwards;}
.exact-reference.door-closing .vault-light{animation:v9LightHide .8s both;}
.exact-reference.success .loot-core{animation:coreReveal 1s 1.1s cubic-bezier(.16,1,.3,1) forwards;}
.exact-reference .cinematic-loot{pointer-events:none;}
.exact-reference.success .cinematic-loot{animation:lootBankIn .7s 2s forwards;pointer-events:auto;}
.exact-reference .lock-hotspot{cursor:pointer;}
.exact-reference .lock-hotspot:hover::after{border-color:rgba(0,245,212,.5);box-shadow:0 0 45px rgba(0,245,212,.18),inset 0 0 25px rgba(0,245,212,.08);}
.exact-reference.lock-focus .reference-layer{transform:scale(1.7)!important;filter:brightness(.94) saturate(1.02)!important;transition:transform 1s cubic-bezier(.16,1,.3,1),filter .7s;}
.exact-reference.shock .reference-layer{animation:v9Glitch .42s steps(2) both!important;}
.exact-reference .reference-keypad button{cursor:pointer;transition:transform .08s,filter .15s,box-shadow .15s;}
.exact-reference .reference-keypad button.pressed{transform:translateY(2px) scale(.96);filter:brightness(1.5);box-shadow:0 0 22px rgba(0,245,212,.28);}
@keyframes v9DoorOpen{0%{transform:scale(1.7) translate3d(0,0,0) rotateY(0);filter:brightness(.94)}45%{transform:scale(1.74) translate3d(-3%,0,0) rotateY(-7deg);filter:brightness(.78)}100%{transform:scale(1.8) translate3d(-10%,0,0) rotateY(-16deg);filter:brightness(.55)}}
@keyframes v9DoorClose{0%{transform:scale(1.8) translate3d(-10%,0,0) rotateY(-16deg);filter:brightness(.55)}55%{transform:scale(1.74) translate3d(-3%,0,0) rotateY(-7deg);filter:brightness(.78)}100%{transform:none;filter:none}}
@keyframes v9VaultReveal{0%{opacity:0;transform:scaleX(.08);filter:blur(24px)}45%{opacity:1;transform:scaleX(.55);filter:blur(10px)}100%{opacity:.78;transform:scaleX(1);filter:blur(2px)}}
@keyframes v9VaultHide{0%{opacity:.78;transform:scaleX(1)}100%{opacity:0;transform:scaleX(.08);filter:blur(20px)}}
@keyframes v9Light{0%{opacity:0;transform:translate(-50%,-50%) scale(.08)}35%{opacity:1;transform:translate(-50%,-50%) scale(.75)}100%{opacity:.35;transform:translate(-50%,-50%) scale(1.3)}}
@keyframes v9LightHide{to{opacity:0;transform:translate(-50%,-50%) scale(.08)}}
@keyframes v9Glitch{0%{transform:translateX(0);filter:none}25%{transform:translateX(-8px);filter:hue-rotate(80deg) brightness(1.3)}50%{transform:translateX(8px);filter:contrast(1.4)}75%{transform:translateX(-4px)}100%{transform:none;filter:none}}

/* v11 keypad alignment — keep the clickable cells exactly over the visible digits. */
.exact-reference .reference-keypad{pointer-events:auto!important}
.exact-reference .reference-keypad button{pointer-events:auto!important}
@media(max-width:900px){
  .exact-reference .reference-keypad{left:69%!important;top:38.7%!important;width:21%!important;height:33%!important}
  .exact-reference .lock-hotspot{left:76%!important;top:47%!important;width:17%!important;height:28%!important}
}

/* v18: ACCESS GRANTED is a transient transition, not a permanent screen. */
.exact-reference.grant-fade .loot-core{animation:grantFade .75s ease forwards!important}
@keyframes grantFade{0%{opacity:1}100%{opacity:0;visibility:hidden}}