:root { color-scheme:dark; font-family:"Courier New",Courier,monospace; background:#000; color:#eafffa; --ice:#a7ffe7; --cyan:#53d7d0; }
* { box-sizing:border-box; }
html,body { margin:0; min-height:100%; width:100%; background:#000; }
body { overflow:hidden; }
button { font:inherit; -webkit-tap-highlight-color:transparent; }
button:focus-visible { outline:2px solid #b6ffe9; outline-offset:10px; }
.cyber-gate { position:relative; width:100%; height:100vh; height:100svh; min-height:360px; overflow:hidden; background:#000; isolation:isolate; --lamp:1; }
.gate-stage { position:absolute; inset:0; display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:minmax(0,1fr); place-items:center; transition:opacity .5s ease; }
.camera { position:relative; width:min(780px,100vw,calc(100svh * .72)); aspect-ratio:3/4; transform-origin:50.2% 54%; will-change:transform,opacity; container-type:inline-size; }
.scene { position:absolute; inset:0; pointer-events:none; }
.scene-art { display:block; position:absolute; inset:0; width:100%; height:100%; object-fit:fill; user-select:none; mask-image:linear-gradient(to bottom,transparent 0%,#000 6%,#000 89%,transparent 100%); }
.portal { position:absolute; left:34.44%; top:26.04%; width:31.49%; height:51.17%; overflow:hidden; isolation:isolate; box-shadow:inset 0 0 5px #000; }
.scene-art,.portal { filter:brightness(calc(.055 + var(--lamp) * .945)); transition:filter 55ms ease-out; }
.interior-glow { position:absolute; inset:0; background:radial-gradient(ellipse at 50% 75%,#0b383c33,transparent 65%); opacity:0; transition:opacity 1.2s; }
.door-shutter { position:absolute; inset:-.4%; will-change:transform; transform:translateY(0); filter:brightness(.67); box-shadow:0 10px 25px #000,0 2px 2px #53e6df99; }
.door-shutter img { width:100%; height:100%; display:block; object-fit:fill; }
.door-scan { position:absolute; inset:0; opacity:.11; background:linear-gradient(110deg,transparent 30%,#c4d5cd55 45%,transparent 56%); }
.edge-shine { position:absolute; inset:0; pointer-events:none; box-shadow:inset 2px 0 6px #affffb12,inset -2px 0 6px #affffb12; }
.sign { position:absolute; left:27.3%; top:12.7%; width:45.8%; height:7.3%; display:flex; align-items:center; justify-content:center; background:linear-gradient(#050b0af2,#040707f5); border:1px solid #253834; box-shadow:0 0 0 2px #050605,0 0 16px #16b5a21a,inset 0 1px 1px #4f626344; border-radius:2px; overflow:hidden; }
.sign-text { text-align:center; text-transform:uppercase; font-size:clamp(12px,3.6cqw,22px); font-weight:700; letter-spacing:.075em; line-height:1.35; color:var(--ice); text-shadow:0 0 3px #b1ffec,0 0 12px #30dbc5,0 0 22px #119c81; animation:sign-hum 10.4s infinite; }
.sign-grid { position:absolute; inset:0; pointer-events:none; opacity:.45; background-image:radial-gradient(#0009 .55px,transparent .8px); background-size:3px 3px; }
.lamp-aura { position:absolute; left:11.7%; top:19.4%; width:21%; height:19%; border-radius:50%; background:radial-gradient(ellipse,#d5fff34d,transparent 68%); mix-blend-mode:screen; filter:blur(5px); opacity:var(--lamp); }
.lamp-spill { position:absolute; left:3.2%; top:28.9%; width:38%; height:56%; opacity:calc(var(--lamp) * .34); background:conic-gradient(from 163deg at 50% 0,transparent,#9bf5e844 5deg,#d4fff522 12deg,#9bf5e844 30deg,transparent 37deg); filter:blur(8px); mix-blend-mode:screen; }
.floor-mist { position:absolute; left:6%; bottom:15%; width:88%; height:8%; background:radial-gradient(ellipse,#69aeae0c,transparent 68%); filter:blur(9px); animation:mist-drift 13s ease-in-out infinite alternate; }
.entry-glow { position:absolute; left:25%; top:22%; width:50%; height:60%; background:radial-gradient(ellipse,#52daca14,transparent 70%); mix-blend-mode:screen; opacity:0; transition:opacity 1s; }
.gate-prompt { position:absolute; top:81.5%; width:100%; display:flex; justify-content:center; isolation:isolate; z-index:2; transition:opacity .4s,filter .4s; }
.gate-prompt:before { content:""; position:absolute; left:50%; top:50%; width:min(97%,42rem); height:calc(100% + 52px); transform:translate(-50%,-50%); z-index:-1; pointer-events:none; background:radial-gradient(ellipse,#000f 3%,#000d 34%,#0008 56%,transparent 76%); filter:blur(12px); }
.unlock { position:relative; min-height:64px; max-width:calc(100vw - 24px); padding:12px 10px; display:flex; align-items:center; justify-content:center; gap:12px; border:0; background:transparent; color:#d1ffed; cursor:pointer; text-shadow:0 0 5px #7fffce77,0 0 18px #77efcc66; font-size:clamp(1.35rem,4.8cqw,2rem); font-weight:600; line-height:1.3; letter-spacing:.01em; white-space:normal; transition:color .2s,filter .2s; }
.unlock:hover { color:#fff; filter:drop-shadow(0 0 6px #4fdc9d77); }
.unlock:disabled { cursor:default; }
.lock-icon { width:20px; height:20px; flex:none; opacity:.8; }
.prompt-text { animation:text-drift 2.6s ease-in-out infinite; }
.cursor { margin-left:-8px; animation:cursor-blink .65s steps(1) infinite; }
.unlock.is-glitching .prompt-text,.thankyou-title.is-glitching .prompt-text { text-shadow:1px 0 #76f4c7,-1px 0 #b065ae; filter:blur(.3px); }
.cyber-gate[data-state="unlocking"] .sign-text { animation:none; color:#d1ffee; }
.cyber-gate[data-state="opening"] .door-shutter { animation:shutter-rise 1.75s cubic-bezier(.63,.03,.27,1) both; }
.cyber-gate[data-state="opening"] .interior-glow,.cyber-gate[data-state="entering"] .interior-glow { opacity:1; }
.cyber-gate[data-state="opening"] .entry-glow { opacity:1; }
.cyber-gate[data-state="entering"] .door-shutter,.cyber-gate[data-state="opened"] .door-shutter { transform:translateY(-102%); }
.cyber-gate[data-state="entering"] .camera { animation:enter-door 1.65s cubic-bezier(.66,.04,.36,1) both; }
.cyber-gate[data-state="opening"] .gate-prompt,.cyber-gate[data-state="entering"] .gate-prompt { opacity:0; filter:blur(5px); pointer-events:none; }
.transition-veil { position:absolute; inset:0; pointer-events:none; opacity:0; background:#000; z-index:3; }
.cyber-gate[data-state="entering"] .transition-veil { animation:enter-black 1.65s ease both; }
.cyber-gate[data-state="opened"] .gate-stage { visibility:hidden; opacity:0; }
.destination { position:absolute; inset:0; display:block; overflow-y:auto; overscroll-behavior:contain; z-index:4; background:#000; }
.destination[hidden] { display:none; }
.destination-backdrop { position:fixed; inset:0; pointer-events:none; background:url('assets/door-scene.webp') center 52%/auto 115% no-repeat; opacity:.35; filter:blur(3px) saturate(.5); }
.destination-backdrop:after { content:""; position:absolute; inset:0; background:radial-gradient(ellipse,#0003 5%,#0009 65%,#000 100%); }
.destination-content { position:relative; width:min(100%,1040px); margin:0 auto; padding:24px 20px max(20px,env(safe-area-inset-bottom)); animation:destination-arrive .8s ease both; }
.destination h1 { outline:none; }
.form-shell { position:relative; min-height:360px; }
.jotform-frame { display:block; width:100%; height:760px; height:max(640px,calc(100svh - 100px)); border:0; background:transparent; color-scheme:normal; }
.form-loading { position:absolute; inset:40px 0 auto; text-align:center; color:#eafffa; font-size:16px; pointer-events:none; }
.form-loading[hidden] { display:none; }
.form-fallback { margin:16px 0 0; text-align:center; color:#a5b6af; font-size:14px; line-height:1.6; }
.form-fallback a,.noscript-note a { color:#c7fff0; text-underline-offset:4px; }
.form-fallback a:focus-visible { outline:2px solid #b6ffe9; outline-offset:4px; }
@media(max-width:540px) { .destination-content { padding:12px 6px max(16px,env(safe-area-inset-bottom)); } .form-fallback { padding:0 12px; } }
.sr-only { position:absolute; width:1px; height:1px; margin:-1px; padding:0; clip:rect(0,0,0,0); overflow:hidden; white-space:nowrap; border:0; }
.noscript-note { position:fixed; bottom:20px; z-index:10; text-align:center; width:100%; color:#fff; font-size:16px; }
@keyframes shutter-rise { 0% { transform:translateY(0); } 6% { transform:translateY(-.5%); } 11% { transform:translateY(0); } 100% { transform:translateY(-102%); } }
@keyframes enter-door { 0% { transform:scale(1); opacity:1; } 75% { opacity:1; } 100% { transform:scale(5.6); opacity:.25; } }
@keyframes enter-black { 0%,60% { opacity:0; } 100% { opacity:1; } }
@keyframes destination-arrive { from { opacity:0; transform:translateY(7px); } to { opacity:1; transform:translateY(0); } }
@keyframes cursor-blink { 0%,50% { opacity:.7; } 51%,100% { opacity:0; } }
@keyframes text-drift { 0%,24%,52%,83%,100% { opacity:1; filter:blur(0); } 29% { opacity:.45; filter:blur(1.2px); } 33% { opacity:.95; filter:blur(0); } 68% { opacity:.55; filter:blur(1.8px); } 74% { opacity:.95; filter:blur(.1px); } }
@keyframes sign-hum { 0%,41%,43%,76%,79%,100% { opacity:1; } 42% { opacity:.65; } 77% { opacity:.87; } 78% { opacity:.6; } }
@keyframes mist-drift { from { transform:translateX(-2%); opacity:.4; } to { transform:translateX(3%); opacity:.8; } }
@media(max-width:540px) {
  .camera { width:min(118vw,calc(100svh * .72)); }
  .unlock { font-size:clamp(1.3rem,4.8cqw,1.65rem); gap:8px; }
}
@media(max-height:550px) and (orientation:landscape) {
  .camera { width:calc(100svh * .62); }
  .sign-text { font-size:12px; letter-spacing:0; line-height:1.05; }
  .gate-prompt { top:82%; }
  .unlock { font-size:1.2rem; }
}
@media(prefers-reduced-motion:reduce) {
  *,*:before,*:after { animation:none!important; transition:none!important; }
  .lamp-aura,.lamp-spill { opacity:.3!important; }
  .scene-art,.portal { filter:brightness(1)!important; }
  .cyber-gate[data-state="opening"] .door-shutter { transform:translateY(-102%); }
}

/* Shared thank-you view, both inline and at /estoy-fatal/. */
.thankyou-page { overflow:auto; }
.thankyou-content { position:relative; z-index:1; width:min(100%,850px); min-height:100vh; min-height:100svh; margin:0 auto; padding:56px 26px; display:flex; flex-direction:column; justify-content:center; text-align:center; }
.thankyou-content[hidden],.destination-content[hidden] { display:none; }
.thankyou-title { margin:0 0 34px; color:#d1ffed; font-family:"Courier New",Courier,monospace; font-size:clamp(1.7rem,4.5vw,2.5rem); font-weight:600; line-height:1.3; letter-spacing:.01em; text-shadow:0 0 5px #7fffce77,0 0 18px #77efcc66; outline:none; }
.thankyou-title .cursor { margin-left:.1em; }
.thankyou-copy { max-width:650px; margin:0 auto; color:#f3f7f5; font-family:Arial,Helvetica,sans-serif; font-size:clamp(1.0625rem,2.1vw,1.25rem); line-height:1.8; text-shadow:0 2px 10px #000; }
.thankyou-copy p { margin:0 0 1.2em; }
.thankyou-copy p:last-child { margin-bottom:0; }
@media(max-width:540px) { .thankyou-content { padding:40px 24px; } .thankyou-title { margin-bottom:28px; } }
