html,body{margin:0;min-height:100%;background:#071320;color:#f5e6c2;font-family:Arial,sans-serif}body{min-height:100dvh;display:grid;place-items:center}*{box-sizing:border-box}.gate{width:min(92vw,590px);text-align:center;padding:24px 0 130px}.gate h1{font-size:18px;letter-spacing:4px;margin:0 0 18px}.ring-wrap{width:min(70vw,390px);aspect-ratio:1;margin:0 auto 22px;position:relative}#gate-ring{position:absolute;inset:0}.gate-logo{position:absolute;inset:37%;width:26%;height:26%;pointer-events:none}label{display:block;font-size:12px;letter-spacing:2px;margin-bottom:10px}form{display:flex;gap:8px;justify-content:center}input{width:min(57vw,240px);min-width:0;background:#0d2132;color:#fff;border:1px solid #9cabaa;border-radius:8px;padding:13px;font-size:16px}button{cursor:pointer}form button{border:1px solid #d9c18a;border-radius:8px;padding:12px 18px;background:#e4d2a7;color:#071320;font-weight:bold}#gate-status{font-size:13px;min-height:34px;line-height:1.5;margin:14px 12px 0}#locked-browser{position:fixed;right:26px;bottom:26px;width:88px;height:88px;border-radius:50%;border:2px solid #c8b681;background:#fff url('/assets/vinyl-white-bandanna.webp') center/cover;box-shadow:0 0 22px #a3c8dc44;padding:18px}#locked-browser img{width:100%;height:100%;object-fit:contain}#browser-status{position:fixed;right:20px;bottom:121px;width:100px;text-align:center;font-size:11px;letter-spacing:2px}input:focus-visible,button:focus-visible{outline:3px solid #fff;outline-offset:4px}@media(max-height:650px){.gate{padding-top:15px}.ring-wrap{width:min(50vh,290px);margin-bottom:12px}}#locked-app-orbit{position:fixed;right:10px;bottom:10px;width:210px;height:210px;pointer-events:none;border:1px solid #b8cce122;border-radius:50%}#locked-browser{right:71px;bottom:71px;width:88px;height:88px}#browser-status{right:65px;bottom:225px}#locked-app-orbit .locked-app{position:absolute;left:50%;top:50%;width:28px;height:28px;margin:-14px;padding:3px;border:1px solid #9eb6c866;border-radius:50%;background:#102333;color:#fff;pointer-events:auto;animation:locked-app-travel 70s linear infinite;animation-delay:calc(var(--angle) / 360deg * -70s);display:grid;place-items:center}#locked-app-orbit span{display:grid;place-items:center;width:100%;height:100%;font-size:9px;font-weight:bold}#locked-app-orbit svg,#locked-app-orbit img{width:21px;height:21px;display:block}#locked-app-orbit .locked-app>span{animation:locked-app-upright 70s linear infinite;animation-delay:inherit}@keyframes locked-app-travel{from{transform:rotate(0deg) translateX(95px)}to{transform:rotate(360deg) translateX(95px)}}@keyframes locked-app-upright{to{transform:rotate(-360deg)}}@media(prefers-reduced-motion:reduce){#locked-app-orbit .locked-app{animation:none;transform:rotate(var(--angle)) translateX(95px)}#locked-app-orbit .locked-app>span{animation:none;transform:rotate(calc(-1 * var(--angle)))}}@media(max-width:600px){#locked-app-orbit{width:150px;height:150px}#locked-browser{right:54px;bottom:54px;width:62px;height:62px;padding:12px}#browser-status{right:35px;bottom:170px}@keyframes locked-app-travel{from{transform:rotate(0deg) translateX(68px)}to{transform:rotate(360deg) translateX(68px)}}}
/* Large click-entry lock */
.gate{width:min(96vw,820px);padding:20px 0 220px}.ring-wrap{width:min(92vw,680px);margin-bottom:16px}.gate h1{font-size:22px}#gate-status{font-size:15px}@media(min-width:900px){.gate{padding-bottom:30px}.ring-wrap{width:min(76vh,680px)}}@media(max-height:650px) and (min-width:900px){.ring-wrap{width:min(75vh,570px)}}

body{display:flex;flex-direction:column;align-items:center}.gate{flex:none;padding-bottom:20px}.website-locked{display:inline-block;border:1px solid #e6c477;border-radius:24px;padding:10px 20px;margin-bottom:18px;color:#ffe6a4;background:#182b3b;font-size:15px;font-weight:800;letter-spacing:2px}.opportunity-act{margin:12px auto 260px}#locked-app-orbit{z-index:1001;width:250px;height:250px;right:16px;bottom:16px;background:#071320ed;border:1px solid #b8cce188}#locked-browser{z-index:1002;right:97px;bottom:97px;width:88px;height:88px}#locked-app-orbit .locked-app{width:44px;height:44px;margin:-22px;padding:6px;background:#18364b;border:2px solid #c3dbe9;box-shadow:0 0 10px #0009}#locked-app-orbit svg,#locked-app-orbit img{width:30px;height:30px}#locked-app-orbit span{font-size:11px}#browser-status{z-index:1003;right:89px;bottom:275px}#locked-app-orbit .locked-app:after{content:"LOCKED";position:absolute;font:700 7px Arial;bottom:-12px;left:-2px;background:#071320;color:#ffe6a4;padding:2px 3px;border-radius:3px;transform:rotate(0deg)}@keyframes locked-app-travel{from{transform:rotate(0deg) translateX(102px)}to{transform:rotate(360deg) translateX(102px)}}@media(max-width:600px){#locked-app-orbit{width:200px;height:200px;right:8px;bottom:8px}#locked-app-orbit .locked-app{width:36px;height:36px;margin:-18px;padding:4px}#locked-app-orbit svg,#locked-app-orbit img{width:25px;height:25px}#locked-browser{right:77px;bottom:77px;width:62px;height:62px}#browser-status{right:57px;bottom:218px}@keyframes locked-app-travel{from{transform:rotate(0deg) translateX(81px)}to{transform:rotate(360deg) translateX(81px)}}}

.opportunity-act{margin-bottom:35px}

body{background:radial-gradient(ellipse at 50% 20%,#3d4851 0,#17232d 45%,#080f16 100%)}.ring-wrap{filter:drop-shadow(0 20px 24px #0009)}.gate-logo{border-radius:50%;box-shadow:0 3px 12px #0008}.website-locked{box-shadow:inset 0 1px 0 #ffffff33,0 4px 12px #0007}

.ring-wrap:before{content:"";position:absolute;inset:-9px;border-radius:50%;border:3px solid #667580;box-shadow:0 0 0 2px #080d12,0 0 0 5px #36444e,inset 0 0 15px #000;pointer-events:none}.ring-wrap{background:radial-gradient(circle,#78868f,#1a252d);border-radius:50%;box-shadow:0 0 0 1px #b5c0c7,0 18px 45px #000c}

.ring-wrap{isolation:isolate}.vault-music-spill{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:visible}.vault-music-spill span{position:absolute;left:var(--note-x);top:var(--note-y);color:var(--note-color);font-size:var(--note-size);font-family:"Noto Music","Segoe UI Symbol",serif;line-height:1;text-shadow:0 0 9px currentColor;pointer-events:none;opacity:0;animation:vault-note-fall var(--note-duration) linear infinite;animation-delay:var(--note-delay);will-change:transform,opacity}.ring-wrap:after{content:"";position:absolute;inset:-14px;border-radius:50%;box-shadow:0 0 25px #72cfff22;pointer-events:none;z-index:-2}@keyframes vault-note-fall{0%{transform:translate3d(0,-20px,0) rotate(0deg);opacity:0}12%{opacity:.85}60%{opacity:.9}100%{transform:translate3d(var(--note-drift),620px,0) rotate(var(--note-spin));opacity:0}}@media(max-width:600px){@keyframes vault-note-fall{0%{transform:translate3d(0,-15px,0) rotate(0deg);opacity:0}12%{opacity:.85}60%{opacity:.9}100%{transform:translate3d(var(--note-drift),430px,0) rotate(var(--note-spin));opacity:0}}}.opportunity-act{z-index:5}@media(prefers-reduced-motion:reduce){.vault-music-spill{display:none}}

.gate .device-code-prompt{position:relative;z-index:5;margin:8px auto 18px;color:#f5e6c2;font:700 clamp(12px,2.3vw,16px)/1.4 Arial,sans-serif;letter-spacing:.12em;text-align:center}

/* Bright readable Hebrew cores with separate upward flame trails. */
.vault-music-spill span.hebrew-falling-fire{color:#fffbe8!important;font-family:Arial,sans-serif;font-weight:800;-webkit-text-stroke:.35px #251006;text-shadow:0 1px 1px #1b0800,1px 0 1px #1b0800,-1px 0 1px #1b0800,0 -2px 2px #ffb535,0 -6px 5px #ff5b15,0 -11px 9px #db270c}
.hebrew-falling-fire:before{content:attr(data-fire-text);position:absolute;inset:0;z-index:-1;color:#ff961f;filter:blur(1px);transform-origin:center bottom;animation:hebrew-word-flames 1.7s ease-in-out infinite}
@keyframes hebrew-word-flames{0%,100%{transform:translateY(-3px) scaleY(1.12);opacity:.8}45%{transform:translateY(-9px) scaleY(1.45);opacity:.6}75%{transform:translateY(-5px) scaleY(1.25);opacity:.9}}
@media(prefers-reduced-motion:reduce){.hebrew-falling-fire:before{animation:none}}

/* Avoid repainting a large filtered SVG and hundreds of promoted particle layers on phones. */
@media(max-width:768px),(pointer:coarse){
 .ring-wrap{filter:none!important}
 .vault-music-spill span{will-change:auto;text-shadow:0 0 3px currentColor}
 .vault-music-spill span.hebrew-falling-fire{text-shadow:0 1px 1px #1b0800,0 -2px 2px #ffb535,0 -4px 3px #ff5b15}
 .hebrew-falling-fire:before{filter:none;animation:none;transform:translateY(-4px)}
}

/* Keep decorative spill and smoke from creating empty horizontal scrolling space. */
@media(max-width:768px),(pointer:coarse){
 html,body{width:100%;max-width:100%;overflow-x:clip}
 .gate{width:min(96%,820px);max-width:100%;margin-inline:auto;min-width:0}
 .ring-wrap{width:92%;max-width:680px;margin-inline:auto}
 .music-lock-video{width:92%!important;max-width:720px!important;margin-inline:auto!important;min-width:0}
 .music-lock-video iframe{width:100%!important;max-width:100%}
 .bible-purchase{width:92%;max-width:680px;margin-inline:auto;min-width:0}
 .bible-purchase-link{max-width:100%;overflow-wrap:anywhere}
 #site-altar-footer{max-width:100%;box-sizing:border-box}
}

/* Reserve the player frame without loading YouTube until its own Play tap. */
.video-on-demand{position:relative;aspect-ratio:16/9;width:100%;overflow:hidden;border:1px solid #9cabaa;border-radius:12px;background:#000;contain:layout paint}
.video-on-demand iframe,.video-load{display:block;width:100%;height:100%;border:0;margin:0;padding:0;background:#000}
.video-load{position:relative;cursor:pointer;overflow:hidden}
.video-load img{display:block;width:100%;height:100%;object-fit:cover}
.video-play-icon{position:absolute;inset:0;margin:auto;width:68px;height:46px;display:grid;place-items:center;color:white;background:#e60000;border-radius:13px;font:23px Arial,sans-serif;padding-left:3px}
.video-load:focus-visible{outline:3px solid #f3dc9d;outline-offset:-4px}

.video-poster-title{position:absolute;left:16px;top:15px;right:16px;color:#fff;text-align:left;text-shadow:0 1px 4px #000;font:600 16px Arial,sans-serif}.video-load{background:linear-gradient(145deg,#142533,#03070c)}

/* Playback reduces decorative layers; mechanical animations keep moving. */
body.video-focus .ring-wrap,body.video-focus .ring-wrap *{will-change:auto!important;filter:none!important;text-shadow:none!important}
body.video-focus .vault-music-spill>span:not([data-playback-note]){display:none!important}
body.video-focus .hebrew-fire-flame,body.video-focus .hebrew-falling-fire:before{display:none!important}
body.video-focus .vault-electricity,body.video-focus .vault-synapses{opacity:.3}
body.video-focus .video-on-demand{isolation:isolate;contain:layout paint}
.vault-music-spill span{will-change:auto;text-shadow:0 0 3px currentColor}
@media(max-width:768px),(pointer:coarse){body{background-attachment:scroll!important}.ring-wrap.lock-motion-paused *{will-change:auto!important}.ring-wrap.lock-motion-paused .vault-music-spill{display:none!important}}

/* The sole native player is prepared before its Play button is pressed. */
body.video-focus .vault-synapses,body.video-focus .water-impact{display:none!important}

/* Keep the lock's paint surface separate from the video and page background.
   The shared mechanical clock advances water, wheels and notes together. */
.ring-wrap{filter:none!important;contain:layout style;isolation:isolate}
.eota-live-lock{isolation:isolate}
body.video-focus .vault-electricity{display:none!important}
body.video-focus .water-inlet-droplet{display:none!important}
body.video-focus .vault-music-spill>span[data-playback-note]{text-shadow:none!important}

/* Stable paint when opening the page or resuming a mobile browser tab.
   Keep flame colors and movement without GPU turbulence/filter surfaces. */
html{background-color:#071320;color-scheme:dark}
body{background-color:#071320!important}
.ring-wrap{contain:layout style paint;isolation:isolate}
.ring-wrap svg,.ring-wrap svg *{filter:none!important;will-change:auto!important}
.hebrew-falling-fire::before{filter:none!important}

/* Tab switching must not rebuild a fixed wallpaper or isolated SVG surface. */
html body{background-attachment:scroll!important}
.ring-wrap{contain:layout style!important;isolation:auto!important}
.eota-live-lock{isolation:auto!important}
.vault-music-spill span{transform-style:flat;backface-visibility:visible}
@keyframes vault-note-fall{0%{transform:translate(0,-20px) rotate(0deg);opacity:0}12%{opacity:.85}60%{opacity:.9}100%{transform:translate(var(--note-drift),620px) rotate(var(--note-spin));opacity:0}}
@media(max-width:600px){@keyframes vault-note-fall{0%{transform:translate(0,-15px) rotate(0deg);opacity:0}12%{opacity:.85}60%{opacity:.9}100%{transform:translate(var(--note-drift),430px) rotate(var(--note-spin));opacity:0}}}