*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;background:#050505;color:#ffe2a0;font-family:Arial,Helvetica,sans-serif;overflow:hidden}.film{position:fixed;inset:0;background:#060504;overflow:hidden}.arrival,.inside{position:absolute;inset:-3%;background-size:cover;background-position:center;will-change:transform,opacity}.arrival{background-image:url('casino-arrival.png');animation:arrivalCam 10s ease-in-out both}.inside{background-image:url('casino-inside.png');background-position:center 28%;opacity:0;transform:scale(1.1);z-index:4}.warm-lights{position:absolute;inset:0;background:radial-gradient(ellipse at 65% 30%,transparent 20%,#0008 100%);pointer-events:none;z-index:1}.cinematic-bars:before,.cinematic-bars:after{content:"";position:absolute;left:0;right:0;height:4.5vh;background:#000;z-index:8}.cinematic-bars:before{top:0}.cinematic-bars:after{bottom:0}.skip{position:absolute;right:3vw;top:7vh;z-index:15;border:1px solid #e9bf6c;border-radius:40px;background:#050505cf;color:#ffe2a0;padding:14px 24px;font-size:14px;font-weight:700;cursor:pointer;letter-spacing:.08em}.skip:hover,.actions a:hover,.actions button:hover{background:#b88b38;color:#080808}.caption{position:absolute;bottom:15vh;left:6vw;z-index:6;text-shadow:0 3px 16px #000;opacity:0;animation:captionIn 7s ease both;pointer-events:none}.caption small{display:block;font-size:clamp(12px,1.2vw,18px);letter-spacing:.45em}.caption strong{display:block;font:700 clamp(25px,4.4vw,78px) Georgia,serif;letter-spacing:.035em}.timeline{position:absolute;z-index:15;left:5vw;bottom:6.3vh;width:78vw;height:4px;background:#ffffff55;border-radius:4px}.timeline div{width:0;height:100%;background:#f6c76b;box-shadow:0 0 15px #ffcf77}.clock{position:absolute;z-index:15;right:4vw;bottom:5.5vh;font-size:13px}.doorway{position:absolute;z-index:3;inset:0;display:flex;justify-content:center;align-items:stretch;opacity:0;pointer-events:none;background:radial-gradient(ellipse at center,#d3a15a 0%,#211208 60%,#000 100%)}.door{height:100%;width:50%;border:12px ridge #bb8534;background:repeating-linear-gradient(90deg,#2e1508 0%,#573018 18%,#9c6029 34%,#48230d 51%);display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 80px #080402,0 0 25px #000;transform-origin:left center}.door.right{transform-origin:right center}.door span{font:9vw Georgia,serif;color:#ffdd86;text-shadow:0 0 20px #ffc970}.doorway.open .left{animation:openLeft 1.65s ease-in forwards}.doorway.open .right{animation:openRight 1.65s ease-in forwards}.doorway.open{opacity:1}.inside.show{animation:insideShow 2s ease-out forwards}.flash{position:absolute;inset:0;background:#f9d99a;opacity:0;pointer-events:none;z-index:7}.flash.on{animation:flash .75s ease-out}.welcome{position:fixed;inset:0;background:linear-gradient(#0009,#000b),url('casino-inside.png') center/cover;display:grid;place-items:center;padding:24px}.welcome[hidden]{display:none}.card{text-align:center;max-width:760px;width:100%;padding:clamp(25px,5vw,65px);border:1px solid #ba8b38;background:#080704e8;box-shadow:0 0 80px #000;border-radius:18px}.crown{font-size:65px;color:#f8c96b}.eyebrow{letter-spacing:.35em;font-size:13px}.card h1{font:700 clamp(36px,6vw,75px) Georgia,serif;line-height:1.08;margin:20px 0}.card h1 em{display:block;font-style:normal;color:#f1bb55}.card p{color:#e6d0a7}.actions{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-top:35px}.actions button,.actions a{border:1px solid #e2b75c;border-radius:8px;background:#1a1209;color:#f7d18a;text-decoration:none;padding:16px 22px;font-size:14px;font-weight:bold;cursor:pointer}.note{font-size:11px;margin-top:25px;opacity:.7}@keyframes arrivalCam{0%{transform:scale(1.19) translate(7%,1%);filter:brightness(.65)}18%{filter:brightness(1)}45%{transform:scale(1.07) translate(1%,0)}70%{transform:scale(1.2) translate(-7%,-2%)}100%{transform:scale(1.48) translate(-15%,-3%);filter:brightness(1.2)}}@keyframes captionIn{0%,15%{opacity:0;transform:translateY(18px)}30%,68%{opacity:1;transform:translateY(0)}95%,100%{opacity:0}}@keyframes openLeft{to{transform:perspective(900px) rotateY(-87deg)}}@keyframes openRight{to{transform:perspective(900px) rotateY(87deg)}}@keyframes insideShow{0%{opacity:0;transform:scale(1.18)}25%{opacity:1}100%{opacity:1;transform:scale(1)}}@keyframes flash{0%{opacity:0}30%{opacity:.75}100%{opacity:0}}@media(max-width:700px){.arrival{background-position:39% center}.caption{bottom:18vh}.door{border-width:5px}.skip{top:6vh;right:5vw;padding:11px 16px}.timeline{width:68vw}}@media(prefers-reduced-motion:reduce){.arrival,.caption{animation:none}.arrival{transform:none}.caption{opacity:1}}
/* V4: Doors split outward to reveal casino; camera enters through opening. */
.doorway{z-index:5;overflow:hidden;perspective:1300px;background:transparent;isolation:isolate}
.doorway::before{content:"";position:absolute;inset:0;background:url('casino-inside.png') center 30%/cover;filter:brightness(.6) blur(3px);z-index:-1}
.door{position:relative;width:50%;flex:0 0 50%;height:100%;backface-visibility:hidden;transform:translateX(0);transition:none;will-change:transform;box-shadow:inset 0 0 80px #080402,0 0 30px #000}
.door.left{border-right:6px solid #f9d484;transform-origin:left center}
.door.right{border-left:6px solid #f9d484;transform-origin:right center}
.doorway.open .left{animation:slideDoorLeft 1.9s cubic-bezier(.55,.05,.2,1) forwards}
.doorway.open .right{animation:slideDoorRight 1.9s cubic-bezier(.55,.05,.2,1) forwards}
@keyframes slideDoorLeft{0%{transform:translateX(0)}100%{transform:translateX(-102%)}}
@keyframes slideDoorRight{0%{transform:translateX(0)}100%{transform:translateX(102%)}}
.inside{z-index:4;opacity:0;transform:scale(1.26);pointer-events:none}
.inside.show{animation:enterCasino 2.35s cubic-bezier(.2,.6,.25,1) forwards}
@keyframes enterCasino{0%{opacity:0;transform:scale(1.28)}30%{opacity:1}100%{opacity:1;transform:scale(1.02)}}
.doorway.recede{animation:doorFade .8s ease forwards}
@keyframes doorFade{from{opacity:1}to{opacity:0}}

/* V5: opening the doors leads directly to login, not a static casino screenshot */
.doorway::before{background:radial-gradient(ellipse at center,#ae7b39 0%,#251307 48%,#050404 100%);filter:none}
.doorway.open{opacity:1}
@media(max-width:650px){.caption strong{font-size:clamp(23px,7vw,42px)}}
