:root{color-scheme:dark;--ink:#060a12;--white:#f6f8fc;--muted:#a9b9cb;--cyan:#a9eaff;--orange:#ff8745}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--white);font-family:"Noto Sans KR",sans-serif;overflow-x:hidden}
button,input{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
a{color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.skip-link{position:fixed;z-index:100;top:10px;left:10px;padding:10px;background:#fff;color:#111;transform:translateY(-160%)}
.skip-link:focus{transform:none}
.site-shell{min-height:100svh}
.scene{position:relative;isolation:isolate;display:flex;justify-content:center;min-height:100svh;padding:clamp(30px,5vh,58px) 24px 64px;overflow:hidden;background:#080e19}
.scene-bg,.scene-vignette,.scene-rays,.scene-flash{position:absolute;inset:0;pointer-events:none}
.scene-bg{z-index:-4;background:url("img/Lobby_01_pin_fhd_2.png") center center/cover no-repeat;transform:scale(1.075);transition:transform 7s cubic-bezier(.15,.7,.2,1),filter 1s;filter:brightness(.57) saturate(.87)}
.intro-complete .scene-bg{transform:scale(1);filter:brightness(.72) saturate(.95)}
.scene-vignette{z-index:-2;background:linear-gradient(180deg,#050a13bc 0%,#050a1325 22%,#050a1344 54%,#050a13d9 100%),radial-gradient(circle at 50% 42%,transparent 4%,#04081288 88%)}
.scene-rays{z-index:-3;opacity:.55;background:radial-gradient(ellipse 25% 40% at 51% 43%,#d6f7ff77,transparent 70%),conic-gradient(from 210deg at 51% 43%,transparent 0deg,#90eaff22 23deg,transparent 32deg,transparent 75deg,#90eaff26 100deg,transparent 113deg);mix-blend-mode:screen;animation:rays-breathe 5s ease-in-out infinite alternate}
.scene-flash{z-index:16;opacity:0;background:#e9fbff;mix-blend-mode:screen}
.scene-flash.fire{animation:lab-flash .82s ease-out forwards}
@keyframes lab-flash{0%{opacity:0}20%{opacity:.95}100%{opacity:0}}
@keyframes rays-breathe{to{opacity:.9;transform:scale(1.15)}}
.doors{position:fixed;inset:0;z-index:30;display:flex;overflow:hidden;pointer-events:none;transition:opacity .55s}
.door{position:relative;width:50%;height:100%;background:linear-gradient(135deg,#202837,#111723 44%,#050910 85%);box-shadow:inset 0 0 90px #000a;transition:transform 1.05s cubic-bezier(.77,0,.16,1)}
.door::before{content:"";position:absolute;inset:0;opacity:.55;background:repeating-linear-gradient(0deg,transparent 0 17%,#79acc21a 17.1% 17.25%,transparent 17.35% 30%),linear-gradient(135deg,transparent 45%,#859ba614 46%,transparent 48%)}
.door-left{border-right:3px solid #7bc7e1}.door-right{border-left:3px solid #7bc7e1}
.door-left img,.door-right img{position:absolute;top:50%;width:clamp(130px,15vw,270px);height:min(70vh,630px);object-fit:fill;opacity:.65;filter:drop-shadow(0 0 12px #85e9ff55);transform:translateY(-50%)}
.door-left img{right:0}.door-right img{left:0}
.door-seam{position:absolute;left:50%;top:0;height:100%;width:5px;transform:translateX(-50%);background:#b5edff;box-shadow:0 0 22px 6px #6fe0ff,0 0 100px 14px #6fe0ff;transition:opacity .25s}
.doors.open .door-left{transform:translateX(-104%)}.doors.open .door-right{transform:translateX(104%)}.doors.open .door-seam{opacity:0}
.doors.dismissed{opacity:0;visibility:hidden}
.door-frame{position:fixed;z-index:29;left:50%;top:50%;width:min(82vw,650px);height:min(100vh,940px);transform:translate(-50%,-50%);pointer-events:none;transition:opacity .5s,transform .9s}
.door-frame img{width:100%;height:100%;object-fit:fill;filter:drop-shadow(0 0 32px #91dfff80)}
.door-frame.dismissed{opacity:0;transform:translate(-50%,-50%) scale(1.45)}
.intro-ui{position:fixed;inset:0;z-index:35;pointer-events:none;font:600 13px "Barlow Condensed",sans-serif;letter-spacing:.22em}
.intro-code{position:absolute;top:28px;left:clamp(20px,4vw,64px);color:#d6ecfa}
.intro-code i{display:inline-block;width:5px;height:5px;margin:0 12px 2px;background:var(--orange);border-radius:50%;box-shadow:0 0 12px var(--orange)}
.intro-status{position:absolute;bottom:40px;left:50%;transform:translateX(-50%);white-space:nowrap;color:#d6e8f4}
.intro-complete .intro-ui{display:none}
.characters{position:fixed;inset:0;z-index:19;overflow:hidden;pointer-events:none}
.character-player{position:absolute;left:50%;bottom:-5vh;width:min(73vh,650px);max-width:none;height:auto;transform:translate(-50%,15%) scale(.86);opacity:0;filter:drop-shadow(0 0 26px #a7e8ff88);transition:opacity .3s,transform .6s cubic-bezier(.14,.74,.24,1)}
.characters.player-show .character-player{opacity:1;transform:translate(-50%,0) scale(1)}
.characters.player-out .character-player{opacity:0;transform:translate(-50%,-4%) scale(1.09)}
.character-guest{position:absolute;inset:0}
.guest{position:absolute;bottom:-9vh;width:min(78vh,720px);height:auto;max-width:none;opacity:0;filter:drop-shadow(0 0 22px #9be5ff99);animation:guest-swipe .48s cubic-bezier(.15,.8,.3,1) forwards}
.guest.left{left:4%;--from:-48vw;--to:-8vw;--tilt:-7deg}.guest.right{right:4%;--from:48vw;--to:8vw;--tilt:7deg}
@keyframes guest-swipe{0%{opacity:0;transform:translateX(var(--from)) rotate(var(--tilt)) scale(.9);filter:drop-shadow(0 0 26px #a7edff)}12%{opacity:1}68%{opacity:1;transform:translateX(0) rotate(0) scale(1);filter:drop-shadow(0 0 26px #a7edff)}100%{opacity:0;transform:translateX(var(--to)) rotate(calc(var(--tilt) * -1)) scale(1.04);filter:drop-shadow(0 0 20px #a7edff)}}
.scene-content{position:relative;z-index:20;width:min(100%,970px);text-align:center;opacity:1;transform:none;transition:opacity .7s,transform .8s cubic-bezier(.2,.8,.2,1)}
.js:not(.intro-complete) .scene-content{opacity:0;transform:translateY(36px);pointer-events:none}
.scene-overline,.small-label{font:600 13px "Barlow Condensed",sans-serif;letter-spacing:.28em;color:#b8d5e4}
.scene-overline{display:flex;align-items:center;justify-content:center;gap:18px;margin:0 0 10px;text-shadow:0 2px 8px #000}
.scene-overline span{width:30px;height:1px;background:var(--orange)}
.brand{display:flex;flex-direction:column;align-items:center;margin:0;font-family:"Barlow Condensed","Noto Sans KR",sans-serif;line-height:.84;letter-spacing:.025em;text-shadow:0 4px 38px #000,0 0 38px #a0e7ff44}
.brand-korean{margin-bottom:7px;font:900 clamp(22px,3vw,37px) "Noto Sans KR",sans-serif;letter-spacing:.3em}
.brand-main{font-size:clamp(88px,12vw,176px);font-weight:800;letter-spacing:.005em}
.brand::after{content:"";width:min(65%,510px);height:3px;margin-top:10px;background:linear-gradient(90deg,transparent,#f9fafb 20%,#ff8342 50%,#f9fafb 80%,transparent);box-shadow:0 0 13px #ff9c5b}
.brand-tagline{margin:12px 0 25px;color:#f5fbff;font-size:clamp(13px,1.4vw,17px);font-weight:700;letter-spacing:.14em;text-shadow:0 2px 12px #000}
.market-panel{position:relative;max-width:950px;margin:0 auto;border:1px solid #86bdcf99;background:#0c1525;box-shadow:0 24px 75px #000c,0 0 34px #91dcff35, inset 0 0 0 4px #0a1322}
.market-panel::before,.market-panel::after{content:"";position:absolute;z-index:2;top:-7px;width:42px;height:14px;border-top:2px solid #d3f5ff}
.market-panel::before{left:-2px;border-left:2px solid #d3f5ff;transform:skewX(-25deg)}.market-panel::after{right:-2px;border-right:2px solid #d3f5ff;transform:skewX(25deg)}
.market-window{position:relative;overflow:hidden;aspect-ratio:16/8.2;background:#0e1524}
.market-slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.045);transition:opacity .8s,transform 5s}
.market-slide.active{opacity:1;transform:scale(1)}
.market-controls{display:flex;align-items:center;justify-content:space-between;gap:15px;height:45px;padding:0 15px;background:#091321;border-top:1px solid #5c91a874}
.panel-label{font:600 13px "Barlow Condensed",sans-serif;letter-spacing:.13em;color:#a8bfcb;white-space:nowrap}.panel-label b{color:#ff9659;font-size:18px;margin-left:8px}
.market-dots{display:flex;gap:8px}.market-dots button{width:25px;height:3px;padding:0;border:0;background:#506578;transition:background .2s}.market-dots button.active{background:var(--orange);box-shadow:0 0 8px var(--orange)}
.market-arrows{display:flex;align-self:stretch}.market-arrows button{width:42px;border:0;border-left:1px solid #384b5a;background:none;color:#d5ecf6;font-size:22px}.market-arrows button:hover{background:#1d3143;color:#fff}
.market-timer{height:2px;background:#1a2a36}.market-timer span{display:block;width:0;height:100%;background:var(--orange);box-shadow:0 0 9px var(--orange)}.market-timer.running span{animation:timer 4.7s linear forwards}@keyframes timer{to{width:100%}}
.store-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:950px;margin:17px auto 0}
.store-button{display:flex;align-items:center;gap:15px;min-height:72px;padding:12px 20px;text-align:left;text-decoration:none;border:1px solid #b3d5e2;background:linear-gradient(115deg,#f6fbff,#d8e8f0);color:#0b1722;transition:transform .2s,box-shadow .2s,border-color .2s}
.store-button:hover{transform:translateY(-3px);box-shadow:0 10px 30px #0008}.store-button svg{width:30px;height:30px;flex:none}.store-button span{display:flex;flex-direction:column;line-height:1.22}.store-button small{font-size:11px;font-weight:700;letter-spacing:.06em}.store-button strong{font-size:21px;font-weight:900}.store-button>b{margin-left:auto;font-size:21px;font-weight:400}
.store-button.ios{border-color:#6facc5;background:linear-gradient(115deg,#142536,#1c3649);color:#f2faff}.store-button.ios small{color:#aee8ff}
.reservation{max-width:950px;margin:13px auto 0;padding:28px 32px 24px;text-align:left;border:1px solid #5b9dbb;background:linear-gradient(140deg,#122438,#0a1726);box-shadow:0 18px 40px #0007;animation:reserve-in .38s ease both}
@keyframes reserve-in{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}
.reservation-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:17px}.reservation-heading h2{margin:3px 0 0;font-size:25px;letter-spacing:-.04em}.reservation-heading p{margin:0;color:#c0d3df;font-size:13px}.small-label{color:var(--orange);font-size:12px}
.email-row{display:flex;gap:9px;margin-bottom:17px}.email-row input{flex:1;min-width:0;height:50px;padding:0 14px;border:1px solid #647e91;background:#091421;color:#fff;border-radius:0}.email-row input::placeholder{color:#8498a7}.email-row button{min-width:175px;border:0;background:var(--orange);color:#111a23;font-weight:900}.email-row button:disabled{opacity:.6;cursor:wait}.email-row button span{margin-left:7px}
.consent{display:flex;align-items:flex-start;gap:8px;margin:6px 0;color:#c9d7df;font-size:12px}.consent input{margin:3px 0 0;accent-color:var(--orange)}.consent a,.terms a{color:#c1eaff;text-underline-offset:3px}.terms{margin-top:11px;color:#a9bfcc;font-size:12px}.terms summary{width:max-content;cursor:pointer;text-decoration:underline;text-underline-offset:3px}.terms ul{padding-left:18px;line-height:1.7}.form-status{min-height:1em;margin:10px 0 0;color:#d8f5ff;font-size:13px}
.footer{display:flex;justify-content:space-between;gap:15px;align-items:center;max-width:1200px;margin:auto;padding:20px 24px 28px;color:#8397a8;font:600 12px "Barlow Condensed","Noto Sans KR",sans-serif;letter-spacing:.08em}.footer div{display:flex;gap:20px;flex-wrap:wrap}.footer a{text-decoration:none}.footer a:hover{color:#fff}
@media(max-width:760px){.scene{padding:32px 15px 42px;min-height:100svh}.scene-bg{background-position:53% center}.scene-overline{font-size:10px;gap:8px;letter-spacing:.13em}.scene-overline span{width:15px}.brand-korean{font-size:22px}.brand-main{font-size:clamp(66px,15vw,112px)}.brand-tagline{font-size:12px;margin-bottom:20px}.market-window{aspect-ratio:16/9}.store-button{padding:10px 14px;min-height:68px}.store-button strong{font-size:16px}.store-button svg{width:24px;height:24px}.store-button>b{font-size:16px}.reservation{padding:22px 18px}.reservation-heading{display:block}.reservation-heading p{margin-top:6px}.character-player{width:min(90vh,600px);bottom:4vh}.guest{width:min(90vh,650px);animation-duration:.64s}.guest.left{left:-45%}.guest.right{right:-45%}.door-frame{width:min(95vw,500px);height:min(90vh,780px)}}
@media(max-width:520px){.scene{padding:36px 12px 28px}.scene-content{align-self:center}.brand-main{font-size:clamp(58px,16vw,82px)}.brand-korean{font-size:18px}.brand-tagline{margin:12px 0 17px;letter-spacing:.05em}.market-panel{margin:0 -4px}.market-controls{padding:0 8px;gap:6px;height:39px}.panel-label{font-size:10px;letter-spacing:.05em}.panel-label b{font-size:15px;margin-left:3px}.market-dots{gap:4px}.market-dots button{width:13px}.market-arrows button{width:29px;font-size:16px}.store-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:10px}.store-button{min-width:0;min-height:58px;padding:9px 10px;gap:8px}.store-button small{font-size:9px}.store-button strong{font-size:14px;white-space:nowrap}.store-button svg{width:20px;height:20px}.store-button>b{font-size:14px}.reservation{margin-top:8px}.email-row{flex-direction:column}.email-row button{height:48px}.footer{display:block;text-align:center;font-size:11px;line-height:1.5}.footer div{justify-content:center;margin-top:8px;gap:11px}.intro-code{font-size:10px}.intro-status{bottom:82px}.skip-intro{bottom:25px;right:20px}.door-left img,.door-right img{width:135px;height:60vh}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.scene-bg{transform:none}.scene-rays{opacity:.5}}
.brand img{display:block;width:min(68vw,650px);height:auto;filter:brightness(0) invert(1) drop-shadow(0 0 20px #a4ddff65)}
@media(max-width:760px){.brand img{width:min(88vw,560px)}}
