:root{--ink:#2b2b2b;--mustard:#ffc93c;--mustard2:#ffd23f;--maroon:#8c2f39;--rblue:#2b4c8c;--pink:#ff6fae;--cream:#fff6e6;--sky:#8fd0ff;--sunset:#ff7b54}
*{box-sizing:border-box;margin:0;padding:0}
html,body{width:100%;height:100%;overflow:hidden;background:#111;font-family:'Baloo 2',system-ui,sans-serif;color:var(--ink);user-select:none}

#stage{position:absolute;left:50%;top:50%;width:1600px;height:900px;overflow:clip;background:#000;transform-origin:center}
#world,#ui{position:absolute;inset:0}
#world{z-index:1}
#fx{position:absolute;inset:0;width:1600px;height:900px;pointer-events:none;z-index:8}
#fade{position:absolute;inset:0;background:#000;opacity:0;pointer-events:none;z-index:9}
#ui{pointer-events:none;z-index:10}
#ui>*{pointer-events:auto}
#ui>.bubble,#ui>.card-big,#ui>.vignette,#ui>.snack,#ui>.sboard,#ui>.mini-ticket,#ui>.caption,#ui>.nom,#ui>.big-x,#ui>.face-spinner,#ui>.whiteflash,#ui>.breath-ring,#ui>.plane-svg,#ui>.crumb-prop{pointer-events:none}
.scene{position:absolute;inset:0;overflow:clip}
.layer{position:absolute;inset:0;width:100%;height:100%}
.char-wrap{position:absolute;transform-origin:50% 100%;pointer-events:none}
.char-wrap.clickable{pointer-events:auto;cursor:pointer}
.char-wrap svg{display:block;overflow:visible}
/* layer stacking: each layer is its own stacking context */
.scene>.layer.chars-back{z-index:1}
.scene>.layer.counter{z-index:2}
.scene>.layer.cakes{z-index:4}
.scene>.layer.chars{z-index:3}
.coach .room-tint,.coach .lamp-glow{z-index:5}
.hidden{display:none!important}

/* ---------- buttons ---------- */
.btn{font-family:'Baloo 2';font-weight:800;font-size:30px;padding:12px 34px;border:4px solid var(--ink);border-radius:999px;background:var(--mustard);color:var(--ink);box-shadow:0 7px 0 var(--ink);cursor:pointer;white-space:nowrap;position:absolute}
.btn:hover{background:#ffd95e}
.btn:active{box-shadow:0 2px 0 var(--ink);translate:0 4px}
.btn.small{font-size:22px;padding:8px 22px;box-shadow:0 5px 0 var(--ink)}
.btn.ghost{background:#fff}
.btn.ghost:hover{background:#fff3c4}
.intro .btn,.prompt-card .btn,.polaroid .btn,.diary .btn{position:relative}

/* ---------- speech bubbles (styled per emotion) ---------- */
.bubble{position:absolute;max-width:400px;background:#fff;border:4px solid var(--ink);border-radius:26px;padding:10px 20px;font-size:24px;font-weight:600;line-height:1.25;text-align:center;box-shadow:0 6px 0 rgba(0,0,0,.18);z-index:5;--tail:50%}
.bubble::after{content:'';position:absolute;left:var(--tail);bottom:-17px;width:24px;height:24px;margin-left:-12px;background:inherit;border-right:4px solid var(--ink);border-bottom:4px solid var(--ink);border-color:inherit;border-top:0;border-left:0;transform:rotate(45deg)}
.bubble.free::after,.bubble.notail::after{display:none}
.bubble.free{z-index:6}
.bubble.narr{background:#2b2b3a;color:#fff;border-color:#ffd23f;font-size:26px;max-width:900px}
.bubble.narr::after{display:none}
.bubble .who{color:var(--maroon)}
.bubble .txt{position:relative}
.bubble.small{font-size:18px;padding:6px 14px;max-width:320px}
.bubble.em-excited{font-weight:800;animation:wob 0.5s ease-in-out infinite alternate}
@keyframes wob{from{rotate:-1.5deg}to{rotate:1.5deg}}
.bubble.em-astonished{background:transparent;border:0;box-shadow:none;font-weight:800}
.bubble.em-astonished::after{display:none}
.bubble .burst{position:absolute;left:-22px;top:-20px;z-index:0;filter:drop-shadow(0 6px 0 rgba(0,0,0,.18))}
.bubble.em-cheer{font-size:28px;font-weight:800;background:linear-gradient(135deg,#fff3c4,#ffd6ec 50%,#d6f0ff);border-color:var(--pink)}
.bubble.em-cheer::after{background:#ffd6ec}
.bubble.em-sad{background:#e4e7ec;color:#555;border-color:#6b7280}
.bubble.em-sad::after{background:#e4e7ec}
.bubble.em-sigh{font-size:19px;padding:6px 16px;color:#555;background:#f1f2f4}
.bubble.em-sigh::after{background:#f1f2f4}
.bubble.em-annoyed{border-color:#d62828;box-shadow:0 6px 0 rgba(214,40,40,.35)}
.bubble.em-panicked .txt span{display:inline-block;animation:jit .12s steps(2) infinite}
.bubble.em-panicked .txt span:nth-child(3n){animation-delay:.04s}
@keyframes jit{0%{translate:0 0}50%{translate:1px -1.5px}100%{translate:-1px 1px}}
.bubble.em-dizzy .txt span{display:inline-block;animation:wave 1s ease-in-out infinite;animation-delay:calc(var(--i) * -0.08s)}
@keyframes wave{0%,100%{translate:0 -3px}50%{translate:0 3px}}
.bubble.em-emotional{background:#ffeaf3;border-color:#c97a9a;color:#7a3b55}
.bubble.em-emotional::after{background:#ffeaf3}
.bubble.em-whisper{border-style:dashed;font-size:18px;color:#555;font-style:italic;padding:6px 16px}
.bubble.em-proud{font-weight:700}

#subtitle{position:absolute;left:50%;bottom:34px;max-width:1250px;text-align:center;font-size:27px;font-weight:600;color:#fff;background:rgba(20,20,30,.82);padding:10px 26px;border-radius:14px;opacity:0;pointer-events:none;z-index:20}
#mood{position:absolute;top:22px;right:26px;display:flex;align-items:center;gap:10px;background:#fff;border:4px solid var(--ink);border-radius:999px;padding:4px 16px;font-weight:800;font-size:20px;box-shadow:0 5px 0 var(--ink);z-index:20}
#mood .mood-face{font-size:30px}
#mood .mood-bar{width:120px;height:14px;border:3px solid var(--ink);border-radius:9px;overflow:hidden;background:#eee}
#mood .mood-bar i{display:block;height:100%;width:5%;background:linear-gradient(90deg,#9aa0a6,#3d7bd9,#ffc93c)}
#grain{position:absolute;inset:-50%;pointer-events:none;opacity:.05;z-index:30;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");animation:grain 1s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}25%{transform:translate(-3%,2%)}50%{transform:translate(2%,-3%)}75%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}

/* ---------- volume + debug (outside the stage) ---------- */
#volume{position:fixed;left:12px;bottom:12px;z-index:100;display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.85);border:2px solid var(--ink);border-radius:999px;padding:2px 8px}
#volume .vbtn{background:none;border:0;font-size:20px;cursor:pointer;line-height:1}
#volume .vrange{width:0;opacity:0;transition:width .2s,opacity .2s;accent-color:var(--pink)}
#volume:hover .vrange{width:90px;opacity:1}
#debug{position:fixed;left:10px;top:10px;z-index:200;background:rgba(15,15,25,.9);color:#eee;font:13px/1.6 ui-monospace,monospace;padding:10px 12px;border-radius:10px;display:flex;flex-direction:column;gap:4px;min-width:250px}
#debug b{color:var(--mustard)}
#debug .d-songbox{margin-top:4px;padding-top:6px;border-top:1px solid #444}
#debug .d-vol{width:150px;vertical-align:middle}
#debug .d-vnow{color:#9fd;font-size:12px}
#debug button,#debug select{font:inherit;border-radius:6px;border:1px solid #666;background:#2a2a3a;color:#fff;padding:1px 6px;cursor:pointer}
#debug .d-micbar{display:inline-block;width:110px;height:9px;background:#333;border-radius:5px;overflow:hidden;vertical-align:middle}
#debug .d-micbar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#7ee081,#ffd23f,#ff6fae)}

/* ---------- intro / loader ---------- */
.intro{background:#0d0d12;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}
.intro h1{font-size:46px;font-weight:800;color:var(--mustard);min-height:64px}
.intro .rule{font-size:30px;opacity:0}
.intro .btn{opacity:0;margin-top:26px}
.loader{background:#0d0d12;color:#fff}
.loader .pct{position:absolute;left:0;right:0;top:330px;text-align:center;font-size:58px;font-weight:800;color:var(--mustard)}
.loader .track{position:absolute;left:200px;right:200px;top:470px;height:26px;border-radius:13px;background:#2a2a35}
.loader .fill{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:13px;background:linear-gradient(90deg,var(--pink),var(--mustard))}
.loader .mini-train{position:absolute;top:-68px;left:0}
.loader .bite{position:absolute;top:-12px;width:46px;height:46px;border-radius:50%;background:#0d0d12;opacity:0}
.loader .line{position:absolute;left:0;right:0;top:545px;text-align:center;font-size:30px;color:#ddd}
.dev-start{z-index:50}

/* ---------- ticket ---------- */
.ticket{position:absolute;left:50%;top:50%;width:820px;height:540px;margin:-270px 0 0 -410px;background:#f8c9d4;border:5px solid var(--ink);border-radius:18px;padding:26px 44px;box-shadow:0 18px 0 rgba(0,0,0,.25);font-family:'Kalam',cursive;overflow:hidden}
.ticket::before,.ticket::after{content:'';position:absolute;top:50%;width:60px;height:60px;margin-top:-30px;border-radius:50%;background:#2c2c3a;border:5px solid var(--ink)}
.ticket::before{left:-34px}.ticket::after{right:-34px}
.ticket header{display:flex;justify-content:space-between;align-items:center;border-bottom:3px dashed var(--maroon);padding-bottom:6px;margin-bottom:10px;font-family:'Baloo 2';font-weight:800;color:var(--maroon);font-size:25px}
.ticket .row{display:flex;gap:12px;font-size:22px;line-height:1.4}
.ticket .row b{font-family:'Baloo 2';min-width:250px;color:var(--maroon)}
.ticket .chk{position:absolute;display:flex;align-items:center;gap:10px;font-size:21px;white-space:nowrap;cursor:pointer}
.ticket .chk .box{width:30px;height:30px;border:4px solid var(--ink);border-radius:6px;background:#fff;flex:none}
.ticket .tmsg{position:absolute;left:44px;bottom:22px;font-family:'Baloo 2';font-weight:700;font-size:24px;color:var(--maroon);transform-origin:left center}
.stamp{position:absolute;right:56px;bottom:50px;font-family:'Baloo 2';font-weight:800;font-size:62px;color:#1e8c3a;border:7px solid #1e8c3a;border-radius:14px;padding:0 22px;opacity:0;mix-blend-mode:multiply}

/* ---------- TTE register ---------- */
.register{position:absolute;left:50%;top:50%;width:900px;height:560px;margin:-300px 0 0 -450px;background:#7a4a2a;border:5px solid var(--ink);border-radius:20px;padding:22px;box-shadow:0 16px 0 rgba(0,0,0,.3);z-index:3}
.register .page{width:100%;height:100%;border-radius:10px;padding:22px 36px;position:relative;background:repeating-linear-gradient(#fffbe9 0 38px,#cfe0f5 38px 40px)}
.register h3{font-family:'Special Elite';font-size:22px;color:var(--maroon);display:flex;justify-content:space-between}
.register .fine{display:inline-block}
.register .q{font-size:32px;font-weight:800;margin:18px 0 20px;line-height:1.2;min-height:78px}
.register .opts{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.register .opt{font-family:'Baloo 2';font-size:23px;font-weight:600;text-align:left;padding:12px 18px;border:4px solid var(--ink);border-radius:16px;background:#fff;cursor:pointer;box-shadow:0 5px 0 var(--ink);color:var(--ink)}
.register .opt:hover:not(:disabled){background:#fff3c4}
.register .opt.wrong{background:#ffb3b3}.register .opt.right{background:#b6f0c2}
.chit{position:absolute;width:300px;padding:14px 18px;background:#fffbe0;border:3px solid var(--ink);font-family:'Kalam';font-size:21px;box-shadow:4px 6px 0 rgba(0,0,0,.2);z-index:4}
.slip{position:absolute;left:50%;top:50%;width:560px;margin:-140px 0 0 -280px;background:#fff;border:5px solid var(--ink);border-radius:12px;padding:22px 30px;font-family:'Special Elite';font-size:25px;text-align:center;box-shadow:0 12px 0 rgba(0,0,0,.25)}
.slip b{display:block;font-family:'Baloo 2';font-size:34px;color:var(--maroon)}
.mini-ticket{position:absolute;padding:10px 50px 10px 22px;background:#f8c9d4;border:4px solid var(--ink);border-radius:10px;font-family:'Kalam';font-weight:700;font-size:24px;white-space:nowrap}
.mini-ticket .hole{position:absolute;right:14px;top:50%;width:20px;height:20px;margin-top:-10px;border-radius:50%;background:#2c2c3a;border:3px solid var(--ink)}

/* ---------- cards / boards ---------- */
.card-big{position:absolute;left:50%;top:44%;font-size:64px;font-weight:800;color:#fff;text-align:center;width:max-content;max-width:1400px;line-height:1.15;z-index:12;text-shadow:0 6px 0 rgba(0,0,0,.45),0 0 30px rgba(0,0,0,.4)}
.card-big small{display:block;font-size:32px;font-weight:700;color:var(--mustard2);margin-top:6px}
.snack{position:absolute;font-size:62px;line-height:1;z-index:6}
.snack small{display:block;font-size:15px;font-weight:800;text-align:center}
.sboard{position:absolute;left:50%;top:36px;width:680px;margin-left:-340px;background:var(--mustard2);border:6px solid var(--ink);border-radius:14px;text-align:center;padding:8px 20px 12px;font-weight:800;font-size:50px;line-height:1.1;box-shadow:0 10px 0 rgba(0,0,0,.25);z-index:15}
.sboard small{display:block;font-size:22px;letter-spacing:3px;text-transform:uppercase}
.sboard i{display:block;font-style:normal;font-size:22px;font-weight:600;color:var(--maroon)}
.vignette{position:absolute;inset:0;z-index:1;background:radial-gradient(ellipse at center,transparent 42%,rgba(0,0,0,.68))}
.caption{position:absolute;left:50%;max-width:1100px;text-align:center;background:rgba(255,255,255,.95);border:4px solid var(--ink);border-radius:18px;padding:8px 24px;font-size:28px;font-weight:800;box-shadow:0 6px 0 rgba(0,0,0,.2);z-index:14}
.caption small{display:block;font-size:19px;font-weight:600;color:var(--maroon)}
.prompt-card{position:absolute;left:50%;top:50%;width:680px;margin:-170px 0 0 -340px;background:var(--cream);border:5px solid var(--ink);border-radius:24px;padding:26px 36px 30px;text-align:center;box-shadow:0 14px 0 rgba(0,0,0,.3);z-index:20}
.prompt-card .pc-emoji{font-size:64px;line-height:1}
.prompt-card p{font-size:28px;font-weight:700;margin:10px 0 22px}
.prompt-card .pc-btns{display:flex;gap:18px;justify-content:center;padding-bottom:8px}
.prompt-card .btn{font-size:24px;padding:8px 22px}
.aage{z-index:40}
.big-x{position:absolute;left:50%;top:40%;font-size:200px;margin-left:-100px;z-index:20}

/* ---------- coach ---------- */
.coach .room-tint{background:#141a45;opacity:0;pointer-events:none}
.coach .lamp-glow{pointer-events:none;opacity:0;background:radial-gradient(ellipse 260px 160px at 240px 36px,rgba(255,226,150,.45),transparent),radial-gradient(ellipse 260px 160px at 1360px 36px,rgba(255,226,150,.45),transparent);mix-blend-mode:screen}
.prop{position:absolute}

/* ---------- selfie ---------- */
.selfie-ui{position:absolute;inset:0;background:rgba(10,10,20,.72);z-index:20}
.selfie-win{position:absolute;left:350px;top:110px;width:900px;height:560px;border:20px solid #9aa3ad;outline:5px solid var(--ink);border-radius:38px;overflow:hidden;background:#000;box-shadow:0 16px 0 rgba(0,0,0,.4)}
.selfie-win canvas{display:block;width:860px;height:520px}
.selfie-win .oval{position:absolute;left:50%;top:46%;width:250px;height:320px;margin:-160px 0 0 -125px;border:4px dashed rgba(255,255,255,.8);border-radius:50%;pointer-events:none}
.selfie-win .sw-bars{position:absolute;inset:0;background:linear-gradient(transparent 33%,rgba(184,192,200,.9) 33% calc(33% + 8px),transparent calc(33% + 8px));pointer-events:none;opacity:.6}
.selfie-win .count{position:absolute;left:0;right:0;top:140px;text-align:center;font-size:200px;font-weight:800;color:#fff;text-shadow:0 8px 0 rgba(0,0,0,.4)}
.selfie-win .flash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none}
.selfie-win .seg-note{position:absolute;left:16px;top:12px;background:rgba(0,0,0,.6);color:#fff;font-size:18px;padding:2px 12px;border-radius:999px}
.selfie-ui .shoot{left:800px;top:770px;transform:translateX(-50%)}
.polaroid{position:absolute;background:#fffdf7;border:4px solid var(--ink);padding:18px 18px 22px;box-shadow:0 18px 30px rgba(0,0,0,.35);z-index:25;text-align:center}
.polaroid.big{width:640px}
.polaroid .ph{position:relative;width:100%;aspect-ratio:860/520;background:#222;overflow:hidden}
.polaroid .ph img{width:100%;height:100%;object-fit:cover;display:block}
.polaroid .pcap{font-family:'Kalam';font-weight:700;font-size:30px;margin-top:10px}
.polaroid .pbtns{display:flex;gap:14px;justify-content:center;margin-top:10px;padding-bottom:6px}
.polaroid.final{width:620px;padding-bottom:26px}
.polaroid.final .ph{aspect-ratio:1/0.8;background:linear-gradient(#8fd0ff,#fff0c2 60%,#ffd23f 60%,#e8b923)}
.polaroid.final .ph-chars{position:absolute;inset:0}
.polaroid.final .pin{position:absolute;right:12px;top:12px;width:170px;transform:rotate(7deg);background:#fff;padding:7px 7px 18px;box-shadow:0 6px 12px rgba(0,0,0,.3);z-index:3}
.polaroid.final .pin img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.polaroid.final .tape{position:absolute;left:50%;top:-12px;width:80px;height:24px;margin-left:-40px;background:rgba(255,230,140,.75);transform:rotate(-6deg)}
.polaroid .btn.small{font-size:20px}

/* ---------- cheesecake jn ---------- */
.flapboard{position:absolute;left:520px;top:150px;width:560px;height:160px;background:var(--mustard2);border:6px solid var(--ink);border-radius:14px;box-shadow:0 10px 0 rgba(0,0,0,.25);text-align:center;padding-top:8px}
.flapboard::before{content:'';position:absolute;left:110px;right:110px;top:-36px;height:30px;border-left:6px solid var(--ink);border-right:6px solid var(--ink)}
.flap-hi{font-size:40px;font-weight:800;line-height:1.1;height:50px}
.flap-row{display:flex;justify-content:center;gap:4px;margin-top:6px}
.flap{display:inline-block;width:32px;height:62px;line-height:62px;background:#232323;color:#ffd23f;font-weight:800;font-size:40px;border-radius:5px;box-shadow:inset 0 -31px 0 rgba(255,255,255,.04),inset 0 -1px 0 #000;transform-origin:50% 50%}
.cjn .cakes{pointer-events:none}
.cjn .cakes .char-wrap{pointer-events:auto}

/* ---------- night station ---------- */
.night .lamp-glows{z-index:6;pointer-events:none;mix-blend-mode:screen}
.night .lglow{position:absolute;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(255,228,150,.85),rgba(255,228,150,.25) 40%,transparent 70%)}
.night .tglow{position:absolute;left:1400px;top:120px;width:240px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(230,246,255,.8),transparent 70%)}
.night .nboard{position:absolute;left:530px;top:116px;width:560px;height:120px;background:#1b2148;border:6px solid var(--ink);border-radius:14px;box-shadow:0 10px 0 rgba(0,0,0,.3);z-index:6;display:flex;align-items:center;justify-content:center;flex-direction:column}
.night .nb-text{font-size:32px;font-weight:800;color:#ffd23f;opacity:.85}
.night .nb-hb{display:none;font-size:42px;font-weight:800;letter-spacing:2px;white-space:nowrap}
.night .nl{color:#3b3f63;transition:color .15s,text-shadow .15s}
.night .nl.on{color:#ffe36e;text-shadow:0 0 10px #ffb627,0 0 24px #ff6fae}
.night .tint{background:#0b1640;opacity:0;pointer-events:none;z-index:5}
.night .dark{background:#000;opacity:0;pointer-events:none;z-index:7}
.night .glow{z-index:8;pointer-events:none}
.night .candle-glow{position:absolute;inset:0;opacity:0;background:radial-gradient(ellipse 520px 360px at 800px 600px,rgba(255,190,90,.38),rgba(255,160,60,.12) 50%,transparent 75%)}
.breath-ring{position:absolute;left:800px;top:330px;width:0;height:0;z-index:30}
.breath-ring .ring{position:absolute;left:-180px;top:-180px;width:360px;height:360px;border-radius:50%;border:8px solid rgba(255,230,160,.85);background:radial-gradient(circle,rgba(255,220,140,.25),transparent 70%)}
.breath-ring .bt{position:absolute;left:-300px;width:600px;top:-40px;text-align:center;font-size:52px;font-weight:800;color:#fff;text-shadow:0 4px 0 rgba(0,0,0,.5)}
.breath-ring.go .bt{color:#ffd23f;font-size:84px}
.hold-btn{z-index:40;touch-action:none}
.hold-btn.down{background:#7fd3ff;translate:0 4px;box-shadow:0 2px 0 var(--ink)}

/* ---------- cake cutting ---------- */
.cut-ui{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 55%,rgba(40,20,60,.55),rgba(10,10,25,.85));z-index:20}
.cut-ui .chars{pointer-events:none}
.cut-ui .knife{position:absolute;pointer-events:none;z-index:30;filter:drop-shadow(0 6px 0 rgba(0,0,0,.3))}
#stage.knife-cursor,#stage.knife-cursor *{cursor:none!important}
.plate-wrap{position:absolute;width:220px;height:120px}
.plate-wrap .plate{position:absolute;left:0;top:70px;width:220px;height:50px;border-radius:50%;background:#f5f7fb;border:4px solid var(--ink);box-shadow:0 6px 0 rgba(0,0,0,.25)}
.plate-wrap .slice{position:absolute;left:34px;top:0;cursor:grab;touch-action:none}
.plate-wrap .slice.dragging{cursor:grabbing;filter:drop-shadow(0 14px 8px rgba(0,0,0,.35))}
.nom{position:absolute;font-size:56px;font-weight:800;color:#ffd23f;-webkit-text-stroke:3px var(--ink);z-index:40}

/* ---------- night train: diet, toilet, letter, diary ---------- */
.envelope{position:absolute;width:460px;height:290px;cursor:pointer;perspective:900px}
.envelope .env-back{position:absolute;inset:0;background:#e9c98f;border:5px solid var(--ink);border-radius:10px}
.envelope .env-paper{position:absolute;left:30px;right:30px;top:20px;height:230px;background:#fffdf4;border:3px solid var(--ink)}
.envelope .env-front{position:absolute;inset:0;background:linear-gradient(to top right,#f3d9a6 50%,transparent 50%) left/50% 100% no-repeat,linear-gradient(to top left,#f3d9a6 50%,transparent 50%) right/50% 100% no-repeat;border:5px solid var(--ink);border-radius:10px}
.envelope .env-flap{position:absolute;left:0;right:0;top:0;height:160px;background:linear-gradient(to bottom,#e2bb78,#d9ad63);clip-path:polygon(0 0,100% 0,50% 100%);border-top:5px solid var(--ink)}
.envelope .env-txt{position:absolute;left:0;right:0;bottom:30px;text-align:center;font-family:'Kalam';font-weight:700;font-size:30px;color:var(--maroon)}
.envelope .env-txt small{font-size:22px;color:#555}
.envelope .env-hint{position:absolute;left:0;right:0;bottom:-46px;text-align:center;color:#fff;font-size:22px;font-weight:700}
.letter{position:absolute;width:820px;height:760px;background:#fffdf4;border:4px solid var(--ink);box-shadow:0 18px 40px rgba(0,0,0,.45);padding:40px 56px;background-image:linear-gradient(90deg,transparent 46px,#f3b3c4 46px 48px,transparent 48px)}
.letter .lbody{height:100%;overflow-y:auto;font-family:'Special Elite',monospace;font-size:24px;line-height:1.55;color:#2b2b2b;scrollbar-width:thin}
.letter p{margin-bottom:6px;white-space:pre-wrap}
.letter .greet{font-size:30px;color:var(--maroon)}
.letter .sign{text-align:right;color:var(--maroon)}
.letter .editme{background:#fff6c8;outline:2px dashed #e0b520;outline-offset:3px}
.letter .wrong{position:relative;display:inline-block;color:#777}
.letter .wrong::after{content:'';position:absolute;left:-3px;right:-3px;top:52%;height:3px;background:#d62828;transform:scaleX(0);transform-origin:left;transition:transform .35s ease}
.letter .wrong.struck::after{transform:scaleX(1)}
.diary{position:absolute;width:1000px;height:580px;display:flex;background:#7a3b2a;border:5px solid var(--ink);border-radius:18px;padding:18px;gap:6px;box-shadow:0 18px 40px rgba(0,0,0,.45)}
.diary .dpage{flex:1;background:#fffaf0;background-image:repeating-linear-gradient(#fffaf0 0 42px,#d7e4f2 42px 44px);border:3px solid var(--ink);padding:24px 30px;font-family:'Kalam';font-size:28px;line-height:44px}
.diary .dpage.left{border-radius:10px 0 0 10px}
.diary .dpage.right{border-radius:0 10px 10px 0}
.diary .dd{font-weight:700;color:var(--maroon);font-size:34px}
.diary textarea{width:100%;height:100%;border:0;background:transparent;resize:none;font:inherit;line-height:44px;outline:none;color:#2b4c8c}
.diary .fly{position:absolute;left:50%;bottom:-34px;transform:translateX(-50%)}
.plane-svg{position:absolute;overflow:visible;z-index:30}

/* ---------- tunnel / video ---------- */
.face-spinner{position:absolute;text-align:center;z-index:30}
.face-spinner .sp-txt{color:#fff;font-size:28px;font-weight:800;margin-top:6px}
.whiteflash{position:absolute;inset:0;background:#fff8e0;z-index:30}
.vframe{position:absolute;inset:0;z-index:25;background:#000}
.vframe .vsky{position:absolute;inset:0;background:linear-gradient(#ffb36b,#fff1b8 55%,#ffd23f 55%,#e8b923)}
.vframe .vbox{position:absolute;inset:30px 30px 90px;display:flex;align-items:center;justify-content:center}
.vframe video{max-width:100%;max-height:100%;border:6px solid var(--ink);border-radius:14px;background:#000;box-shadow:0 12px 30px rgba(0,0,0,.4)}
.vframe .vbar{position:absolute;left:0;right:0;bottom:22px;height:50px;display:flex;justify-content:center}
.vframe .vbar .btn{position:relative}
.vplaceholder{background:rgba(255,255,255,.92);border:5px dashed var(--ink);border-radius:24px;padding:50px 80px;text-align:center;font-size:56px;font-weight:800}
.vplaceholder small{display:block;font-size:24px;color:var(--maroon);font-weight:600}

/* ---------- final ---------- */
.crumb-prop{position:absolute;font-size:40px;text-align:center;z-index:30}
.crumb-prop small{display:block;font-size:14px;font-weight:800}
.credits{position:absolute;inset:0;overflow:hidden;z-index:12;pointer-events:none}
.credits .roll{position:absolute;left:50%;width:900px;margin-left:-450px;text-align:center;color:#fff;text-shadow:0 3px 0 rgba(0,0,0,.45);background:rgba(25,12,45,.45);border-radius:28px;padding:40px 30px}
.credits h2{font-size:58px;color:#ffe36e;margin-bottom:40px}
.credits h3{font-size:54px;color:#ffe36e;margin-top:60px}
.credits p{font-size:34px;font-weight:700;margin:22px 0}
.credits p span{display:block;font-size:20px;letter-spacing:4px;text-transform:uppercase;color:#ffe9c8;opacity:.85}
.credits p.note{font-size:26px;font-style:italic;font-weight:600;margin-top:34px}
.post{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:rgba(20,10,40,.55);color:#fff;text-align:center;z-index:30}
.post .pc1{font-size:60px;font-weight:800;color:#ffe36e}
.post .pc2{font-size:38px;font-weight:700}
.post .btn{position:relative;margin-top:30px}
.ctrain{position:absolute}

/* ---------- #ui z-order: overlays < bubbles/captions < cards < buttons ---------- */
#ui>.bubble{z-index:28}
#ui>.bubble.free{z-index:29}
#ui>.caption{z-index:27}
#ui>.card-big{z-index:30}
#ui>.sboard{z-index:32}
#ui>.btn{z-index:40}
#ui>.snack{z-index:21}
.cut-ui .table-svg{z-index:2}
.cut-ui .chars{z-index:1}
.cut-ui .wo.grab{cursor:grab}
.cut-ui .wo.dragging{cursor:grabbing}
.night .darkhole{z-index:7;opacity:0;pointer-events:none;background:radial-gradient(ellipse 520px 330px at 800px 610px,rgba(8,4,16,.08) 0%,rgba(8,4,16,.45) 38%,rgba(6,3,12,.9) 70%,rgba(4,2,8,.97) 100%)}
.night .candle-glow{background:radial-gradient(ellipse 420px 260px at 800px 610px,rgba(255,176,80,.32),rgba(255,150,60,.1) 55%,transparent 80%)!important;mix-blend-mode:screen}
#debug.paused{outline:3px solid #ffd23f}
#debug .d-line{color:#7fd3ff;max-width:300px}
.loader .bigmouth{position:absolute;z-index:3;filter:drop-shadow(0 8px 0 rgba(0,0,0,.35))}
/* thought cloud */
.bubble.think{max-width:540px;background:transparent;border:0;box-shadow:none;font-family:'Kalam',cursive;font-weight:700;color:#4a5160;font-size:23px;padding:14px 26px}
.bubble.think .cloud{position:absolute;left:-28px;top:-24px;z-index:0;overflow:visible;filter:drop-shadow(0 5px 0 rgba(0,0,0,.15))}
.bubble.think::after{display:none}
/* TTE quiz: register above the snack pile, hint chits above the register */
#ui>.register{z-index:24}
#ui>.chit{z-index:26}
.char-wrap .held-cakes{position:absolute;left:16px;top:206px;display:flex;gap:0;pointer-events:none}
.char-wrap .held-cakes svg{width:96px;height:96px}
#ui>.clasp{position:absolute;font-size:54px;z-index:30;pointer-events:none}
/* shaking/wavy text keeps its spaces */
.bubble .txt span{white-space:pre}
.prompt-card .pc-sub{font-size:22px;font-weight:600;margin:-12px 0 18px;color:#8c2f39}
.breath-ring .bt2{position:absolute;left:-300px;width:600px;top:70px;text-align:center;font-size:24px;font-weight:700;color:#fff3c4}
.cut-ui .chars-front{z-index:3;pointer-events:none}
.cut-ui .wo1.grab,.cut-ui .wo2.grab{cursor:grab}
.cut-ui .wo2.dragging{cursor:grabbing}

/* ---------- Chapter 0: greenery welcome + light loader ---------- */
.greenery{background:#7cc8ff}
.welcome{position:absolute;left:50%;top:50%;width:820px;margin-left:-410px;transform:translateY(-58%);background:rgba(255,253,244,.92);border:5px solid var(--ink);border-radius:30px;padding:30px 46px 34px;box-shadow:0 14px 0 rgba(0,0,0,.18),0 30px 60px rgba(30,60,20,.25);text-align:left;z-index:5}
.welcome .w-hi{font-family:'Kalam',cursive;font-size:58px;font-weight:700;color:var(--maroon);min-height:76px;line-height:1.1}
.welcome .w-sub{font-size:28px;font-weight:700;min-height:40px;margin:2px 0 14px}
.welcome .rule{font-size:27px;font-weight:600;margin:8px 0;opacity:0;display:flex;gap:14px;align-items:center;background:#eaf7e2;border:3px solid #9fd88a;border-radius:16px;padding:8px 16px}
.welcome .rule span{font-size:34px}
.welcome .w-go{font-size:25px;font-weight:700;color:#2b4c8c;margin:16px 0 22px;opacity:0}
.welcome .btn.chalo{position:relative;display:block;margin:0 auto;font-size:34px;padding:14px 44px;background:linear-gradient(#ffd23f,#ffb300);opacity:0}
.loader.light{background:transparent;color:var(--ink);--track:#3a2c26}
.loader.light .pct{color:#2b2b2b;text-shadow:0 0 12px #fff,0 3px 0 #fff;top:340px}
.loader.light .track{background:var(--track);border:4px solid var(--ink);height:30px;border-radius:16px;box-shadow:0 6px 0 rgba(0,0,0,.2)}
.loader.light .fill{border-radius:12px}
.loader.light .line{color:#2b2b2b;font-weight:800;top:560px}
.loader.light .line:not(:empty){display:table;margin:0 auto;left:0;right:0;width:max-content;background:rgba(255,253,244,.92);border:3px solid var(--ink);border-radius:999px;padding:6px 26px}
.loader .bitemark{position:absolute;top:-17px;width:80px;height:64px;pointer-events:none;z-index:2}
.ticket.v2{height:580px;margin-top:-290px}
.ticket.v2 .row{margin-bottom:4px}
.ticket.v2 .row b{min-width:150px}
.ticket.v2 .row span{flex:1}
.ticket.v2 .chk{font-size:22px;background:#fff6fa;border:3px dashed #ff6fae;border-radius:12px;padding:6px 12px}
.ticket.v2 .tmsg{bottom:26px}
.ticket.v2 .stamp{bottom:70px}
.welcome{top:96px;transform:none}
.loader .track-clip{position:absolute;inset:0;border-radius:12px;overflow:hidden}
.loader.light .bitemark{top:-17px}
.loader.light .track{height:40px;border-radius:20px}
.loader.light .track-clip{border-radius:16px}
.loader.light .bitemark{top:-12px}
.loader.light .mini-train{top:-70px}

/* welcome = an Indian-Railways style yellow notice board standing in the field */
.welcome{top:70px;background:#ffd23f;border:7px solid var(--ink);border-radius:18px;padding:84px 50px 34px;box-shadow:0 12px 0 rgba(0,0,0,.25)}
.welcome .w-band{position:absolute;left:0;right:0;top:0;height:62px;background:var(--maroon);border-bottom:5px solid var(--ink);border-radius:10px 10px 0 0;display:flex;justify-content:space-between;align-items:center;padding:0 26px;color:#ffd23f;font-weight:800;font-size:24px;letter-spacing:1px}
.welcome .bolt{position:absolute;width:14px;height:14px;border-radius:50%;background:#c9c9c9;border:3px solid var(--ink)}
.welcome .bolt.b1{left:12px;top:74px}.welcome .bolt.b2{right:12px;top:74px}.welcome .bolt.b3{left:12px;bottom:12px}.welcome .bolt.b4{right:12px;bottom:12px}
.welcome .w-post{position:absolute;top:100%;width:26px;height:400px;background:linear-gradient(90deg,#5b5b5b,#8a8a8a 45%,#5b5b5b);border:5px solid var(--ink);border-top:0;z-index:-1}
.welcome .w-post.l{left:120px}.welcome .w-post.r{right:120px}
.welcome .w-hi{color:var(--maroon);font-size:56px}
.welcome .w-sub{color:#2b2b2b}
.welcome .rule{background:rgba(255,255,255,.55);border:3px solid var(--ink);box-shadow:0 4px 0 rgba(0,0,0,.15)}
.welcome .w-go{color:var(--maroon)}
.welcome .btn.chalo{background:var(--maroon);color:#ffd23f;border-color:var(--ink);box-shadow:0 7px 0 var(--ink)}
.welcome .btn.chalo:hover{background:#a3394a}
/* loader caption = a small maroon station sign, not a white pill */
.loader.light .line:not(:empty){background:var(--maroon);color:#ffd23f;border:4px solid var(--ink);box-shadow:0 5px 0 rgba(0,0,0,.25)}

/* "Press here to catch the Train" — big, glowing, impossible to miss */
#ui>.catch-wrap{position:absolute;z-index:40;text-align:center;pointer-events:auto}
.catch-wrap .catch-arrow{font-size:46px;line-height:1;margin-bottom:6px;filter:drop-shadow(0 4px 0 rgba(0,0,0,.25))}
.catch-wrap .btn.catch{position:relative;font-size:28px;padding:14px 30px;background:linear-gradient(#ffe066,#ffb300);border:5px solid var(--ink);box-shadow:0 7px 0 var(--ink),0 0 0 0 rgba(255,214,0,.8);animation:catchGlow 1s ease-out infinite}
.catch-wrap .btn.catch:hover{background:linear-gradient(#fff07a,#ffc400)}
@keyframes catchGlow{0%{box-shadow:0 7px 0 var(--ink),0 0 0 0 rgba(255,214,0,.85)}70%{box-shadow:0 7px 0 var(--ink),0 0 0 26px rgba(255,214,0,0)}100%{box-shadow:0 7px 0 var(--ink),0 0 0 0 rgba(255,214,0,0)}}
/* Station 1: things from the bag, ticked flute answers, trap button */
#ui>.bagitem{position:absolute;z-index:21;pointer-events:none;filter:drop-shadow(0 6px 4px rgba(0,0,0,.25))}
.register .opt.ticked::after{content:' ✅';font-size:20px}
.register .opt{line-height:1.2}
#ui>.btn.trap{background:var(--maroon);color:#ffd23f;font-size:26px;animation:catchGlow 1.1s ease-out infinite}

/* Station 2: his diary + the flush close-up */
.diary-book{position:absolute;filter:drop-shadow(3px 6px 0 rgba(0,0,0,.25))}
.diary-page{position:absolute;width:500px;min-height:360px;padding:22px 30px 26px 64px;background:#fffdf4;border:4px solid var(--ink);border-radius:6px 14px 14px 6px;font-family:'Kalam',cursive;font-size:25px;line-height:38px;color:#22325a;box-shadow:8px 12px 0 rgba(0,0,0,.22);background-image:linear-gradient(90deg,transparent 46px,#f3a6a6 46px 49px,transparent 49px),repeating-linear-gradient(#fffdf4 0 37px,#c9d8f0 37px 38px);transform:rotate(-2deg)}
.diary-page .dp-head{font-family:'Baloo 2';font-weight:800;font-size:30px;color:var(--maroon);margin-bottom:4px}
.diary-page .dp-list{padding-left:24px;margin:0}
.diary-page .dp-list li{margin-bottom:6px}
.flush-ui{position:absolute;inset:0;overflow:hidden}
.flush-ui .layer{position:absolute;inset:0;width:100%;height:100%}
.flush-cap{position:absolute;left:50%;top:40px;transform:translateX(-50%);font-family:'Baloo 2';font-weight:800;font-size:38px;color:#fff;background:var(--maroon);border:4px solid var(--ink);border-radius:14px;padding:4px 26px;box-shadow:0 6px 0 var(--ink);white-space:nowrap}

/* Station 2 walk-up selfie */
.selfie-count{position:absolute;left:800px;top:330px;transform:translate(-50%,-50%);font-family:'Baloo 2';font-weight:800;font-size:150px;color:#fff;-webkit-text-stroke:5px var(--ink);text-shadow:0 8px 0 var(--ink);pointer-events:none}
.selfie-flash{position:absolute;inset:0;background:#fff;pointer-events:none}
.polaroid.huge{width:820px}

/* Bakingo: cake name on hover */
#ui>.cake-tag{position:absolute;z-index:30;pointer-events:none;visibility:hidden;opacity:0;font-family:'Baloo 2';font-weight:800;font-size:28px;color:#2f1a12;background:#fff3e6;border:4px solid var(--ink);border-radius:14px;padding:4px 18px;box-shadow:0 6px 0 var(--ink);white-space:nowrap}
#ui>.cake-tag::after{content:'';position:absolute;left:50%;bottom:-14px;margin-left:-10px;border:10px solid transparent;border-top-color:var(--ink)}
.breath-ring.go .bt{font-size:64px;left:-520px;width:1040px;white-space:nowrap}

/* Station 4 party */
#ui>.party-flash{position:absolute;inset:0;background:#fff;pointer-events:none;z-index:40}
#ui>.party-banner{position:absolute;left:0;right:0;top:70px;text-align:center;pointer-events:none;z-index:35;font-family:'Baloo 2';font-weight:800;line-height:.95}
#ui>.party-banner .pb-row{font-size:118px;letter-spacing:4px;-webkit-text-stroke:5px var(--ink);text-shadow:0 9px 0 var(--ink)}
#ui>.party-banner .pb-row span{display:inline-block}
#ui>.party-banner .pb-sub{display:inline-block;margin-top:14px;font-size:40px;color:#fff;background:var(--maroon);border:5px solid var(--ink);border-radius:18px;padding:2px 26px;box-shadow:0 7px 0 var(--ink)}
#ui>.balloon{position:absolute;pointer-events:none;z-index:30}
.cut-ui .top-svg{z-index:4}
#ui>.boy-phone{position:absolute;font-size:44px;z-index:25;pointer-events:none}
#ui>.party-banner{top:118px}
#ui>.party-banner .pb-row{font-size:100px}

/* Station 6: diet plan page + the gift diary */
#ui>.diet-page{background-color:#fff4f8;background-image:linear-gradient(90deg,transparent 46px,#f3a6a6 46px 49px,transparent 49px),repeating-linear-gradient(#fff4f8 0 37px,#f6cfe0 37px 38px)}
.diet-page .dp-but{color:var(--maroon);font-weight:700}
.diet-page .dp-sign{text-align:right;font-size:20px;color:#b05a7a;margin-top:6px}
#ui>.gift-diary{position:absolute;z-index:26;pointer-events:none;filter:drop-shadow(3px 6px 0 rgba(0,0,0,.25))}
#ui>.gb-dim{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,rgba(20,10,30,.35),rgba(10,5,20,.75));z-index:27;pointer-events:none}
#ui>.gift-book{position:absolute;width:1040px;height:660px;z-index:28;perspective:2400px;pointer-events:none}
.gift-book .gb-backing{position:absolute;inset:-18px -22px;background:linear-gradient(135deg,#8c2340,#5e1530);border:5px solid var(--ink);border-radius:18px;box-shadow:0 24px 50px rgba(0,0,0,.5)}
.gift-book .gb-page{position:absolute;top:0;bottom:0;width:50%;border:3px solid #c9b48f;box-sizing:border-box;transform-style:preserve-3d;backface-visibility:hidden}
.gift-book .gb-left{left:0;border-radius:10px 0 0 10px;background:linear-gradient(to left,rgba(80,50,20,.22),transparent 70px),repeating-linear-gradient(to bottom,transparent 0 79px,#c9d8f0 79px 80px) 0 6px/100% 40px,#fffdf4;background:linear-gradient(to left,rgba(80,50,20,.22),transparent 70px),repeating-linear-gradient(to bottom,#fffdf4 0 39px,#d3e0f3 39px 40px)}
.gift-book .gb-right{left:50%;border-radius:0 10px 10px 0;background:linear-gradient(to right,rgba(80,50,20,.22),transparent 70px),repeating-linear-gradient(to bottom,#fffdf4 0 39px,#d3e0f3 39px 40px)}
.gift-book .gb-leaf{z-index:3;box-shadow:-10px 0 30px rgba(0,0,0,.15)}
.gift-book .gb-leaf.back{background:linear-gradient(to right,rgba(80,50,20,.22),transparent 70px),repeating-linear-gradient(to bottom,#fffdf4 0 39px,#d3e0f3 39px 40px);transform-origin:0% 50%}
.gift-book .gb-text{position:absolute;left:54px;right:40px;top:44px;bottom:44px;overflow:hidden;font-family:'Kalam',cursive;font-size:27px;line-height:40px;color:#23315e}
.gift-book .gb-left .gb-text{left:46px;right:50px}
.gift-book .gb-text p{margin:0;white-space:pre-wrap}
.gift-book .gb-text .greet{font-size:34px;font-weight:700;color:var(--maroon)}
.gift-book .gb-text .sign{text-align:right;color:var(--maroon);font-weight:700}
.gift-book .gb-text .real{font-family:'Caveat','Kalam',cursive;font-size:31px;line-height:40px;color:#1b2440;font-weight:500}
.gift-book .gb-text .real.greet{font-size:38px;font-weight:700;color:var(--maroon)}
.gift-book .gb-text .real.sign{font-weight:700;color:var(--maroon)}
.gift-book .gb-text .wrong{position:relative;display:inline-block;color:#7a7a8a}
.gift-book .gb-text .wrong::after{content:'';position:absolute;left:-3px;right:-3px;top:54%;height:3px;background:#d62828;border-radius:2px;transform:scaleX(0);transform-origin:left;transition:transform .35s ease}
.gift-book .gb-text .wrong.struck::after{transform:scaleX(1)}
.gift-book .gb-num{position:absolute;bottom:10px;left:0;right:0;text-align:center;font-family:'Kalam';font-size:18px;color:#9a8a6a}
.gift-book .gb-ribbon{position:absolute;left:70%;top:-22px;width:22px;height:120px;background:#e63946;border:3px solid var(--ink);border-top:none;clip-path:polygon(0 0,100% 0,100% 100%,50% 86%,0 100%);z-index:4}
.gift-book .gb-cover{position:absolute;left:50%;top:-6px;bottom:-6px;width:calc(50% + 8px);background:linear-gradient(135deg,#9a2a4a,#6b1834);border:5px solid var(--ink);border-radius:4px 16px 16px 4px;transform-origin:0% 50%;z-index:5;display:flex;align-items:center;justify-content:center;backface-visibility:hidden}
.gift-book .gbc-frame{width:70%;height:72%;border:4px solid #e9b23c;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}
.gift-book .gbc-t{font-family:'Kalam';font-weight:700;font-size:72px;color:#ffd9e8;text-shadow:0 4px 0 rgba(0,0,0,.3)}
.gift-book .gbc-h{font-size:60px}
.gift-book .gbc-y{font-family:'Baloo 2';font-weight:800;letter-spacing:6px;font-size:26px;color:#e9b23c}
.gift-book .gb-pen{position:absolute;font-size:44px;opacity:0;z-index:6;transform:rotate(-8deg);filter:drop-shadow(2px 3px 0 rgba(0,0,0,.25))}
.gift-book .editme{background:#fff6c8;outline:2px dashed #e0b520;outline-offset:3px}
.gift-book .gb-ribbon{left:auto;right:26px}

/* Station 6: wish in the diary + glowing plane */
.gift-book .gb-text .dd{font-size:24px;line-height:40px;white-space:pre-wrap}
.gift-book textarea.gb-wish{display:block;width:100%;height:440px;border:0;outline:0;resize:none;background:transparent;font-family:'Kalam',cursive;font-size:27px;line-height:40px;color:#23315e;pointer-events:auto;padding:0}
.gift-book .gb-fly{position:absolute;right:20px;bottom:-34px;pointer-events:auto;z-index:7}
#ui>.wish-plane.glow{filter:drop-shadow(0 0 10px rgba(255,236,170,.95)) drop-shadow(0 0 24px rgba(255,190,220,.7))}
#ui>.wish-burst{position:absolute;width:60px;height:60px;border-radius:50%;border:4px solid #fff6a8;box-shadow:0 0 30px 10px rgba(255,240,170,.8);pointer-events:none;z-index:30}
#ui>.wish-cap{position:absolute;left:50%;top:560px;transform:translateX(-50%);font-family:'Kalam';font-weight:700;font-size:34px;color:#fff;text-shadow:0 3px 12px rgba(0,0,0,.6);white-space:nowrap;z-index:30;pointer-events:none}

/* Station 7: sunrise */
#ui>.win-fx{position:absolute;inset:0;pointer-events:none;z-index:2;overflow:hidden}
.win-fx .sun-glow{position:absolute;width:520px;height:520px;margin:-260px 0 0 -260px;border-radius:50%;background:radial-gradient(circle,rgba(255,244,200,.95) 0,rgba(255,214,120,.55) 18%,rgba(255,170,90,.18) 42%,rgba(255,170,90,0) 70%);mix-blend-mode:screen}
.win-fx .bird{position:absolute}
#ui>.morning-rays{position:absolute;inset:0;pointer-events:none;z-index:1;mix-blend-mode:screen;background:repeating-linear-gradient(115deg,rgba(255,226,150,0) 0 70px,rgba(255,226,150,.16) 70px 120px,rgba(255,226,150,0) 120px 200px);-webkit-mask-image:linear-gradient(200deg,#000 10%,transparent 75%);mask-image:linear-gradient(200deg,#000 10%,transparent 75%)}
#ui>.float-heart{position:absolute;font-size:38px;pointer-events:none;z-index:25}

/* Final: the journey photo + keepsake downloads */
#ui>.polaroid.journey{width:760px;padding:22px 22px 30px;transform-origin:50% 50%}
.polaroid.journey .ph{position:relative;overflow:hidden;border:3px solid var(--ink)}
.polaroid.journey .ph img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.polaroid.journey .pcap{font-family:'Kalam';font-weight:700;font-size:30px;color:var(--maroon);margin-top:12px}
.polaroid.journey .stk{position:absolute;font-size:56px;filter:drop-shadow(2px 4px 0 rgba(0,0,0,.25))}
.polaroid.journey .s1{left:-30px;top:-26px}
.polaroid.journey .s2{right:-26px;top:-30px}
.polaroid.journey .s3{right:-40px;bottom:70px;font-family:'Baloo 2';font-weight:800;font-size:40px;background:#ffd23f;border:4px solid var(--ink);border-radius:14px;padding:0 12px;color:var(--ink)}
.polaroid.journey .s4{left:-28px;bottom:84px}
.polaroid.journey .tape{position:absolute;top:-14px;width:110px;height:28px;background:rgba(255,230,140,.8)}
.polaroid.journey .t1{left:120px;transform:rotate(-8deg)}
.polaroid.journey .t2{right:120px;transform:rotate(7deg)}
.post .keepsakes{display:flex;gap:18px;margin-top:22px}
.post .keepsakes .btn{position:relative;margin-top:0}
.credits .roll>*{will-change:opacity,transform,filter}

/* Station 7: the video gift grows out of the window */
#ui>.win-shine{position:absolute;border-radius:22px;pointer-events:none;z-index:24;background:radial-gradient(ellipse at 50% 50%,rgba(255,255,240,.95),rgba(255,236,170,.6) 45%,rgba(255,220,150,.15) 80%);box-shadow:0 0 80px 30px rgba(255,236,170,.6)}
#ui>.v-dim{position:absolute;inset:0;z-index:25;pointer-events:none;background:radial-gradient(ellipse at 50% 50%,rgba(40,20,70,.55),rgba(14,6,30,.92) 75%)}
.v-dim .firefly{position:absolute;width:8px;height:8px;border-radius:50%;background:#fff3a8;box-shadow:0 0 12px 5px rgba(255,236,140,.75)}
#ui>.v-frame{position:absolute;z-index:26;border:10px solid #e9b23c;border-radius:26px;background:#120a24;box-shadow:0 0 0 4px var(--ink),0 0 60px 14px rgba(255,205,120,.45),0 30px 60px rgba(0,0,0,.6)}
.v-frame .v-box{position:absolute;inset:0;border-radius:16px;overflow:hidden;background:#000}
.v-frame .v-box video{width:100%;height:100%;object-fit:cover;display:block}
.v-frame .v-lights{position:absolute;left:-14px;right:-14px;top:-30px;height:34px;pointer-events:none;background:radial-gradient(circle,#ffe58a 0 5px,rgba(255,229,138,.5) 6px,transparent 11px) 0 0/48px 34px repeat-x;filter:drop-shadow(0 0 6px rgba(255,220,120,.9))}
.v-frame .v-title{position:absolute;left:50%;top:-74px;transform:translateX(-50%);font-family:'Kalam';font-weight:700;font-size:40px;color:#fff3c4;text-shadow:0 3px 14px rgba(0,0,0,.7);white-space:nowrap}
.v-frame .v-bar{position:absolute;left:0;right:0;bottom:-62px;display:flex;align-items:center;gap:16px;pointer-events:auto}
.v-frame .v-bar .btn{position:relative}
.v-frame .v-prog{flex:1;height:10px;border-radius:6px;background:rgba(255,255,255,.18);overflow:hidden;border:2px solid rgba(233,178,60,.7)}
.v-frame .v-prog i{display:block;height:100%;width:0;background:linear-gradient(90deg,#ffd23f,#ff8db8)}
/* end screen: text column + the keepsakes that swoop in on the left */
.post-info{display:flex;flex-direction:column;align-items:center;gap:16px}
.post .keep{position:absolute;left:0;top:0;will-change:transform}
.post .keep-in{position:relative;border:4px solid var(--ink);background:#fffdf7;box-shadow:0 24px 44px rgba(0,0,0,.55)}
.post .keep img{display:block}
.post .keep.k-photo img{width:524px;height:620px}
.post .keep.k-ticket img{width:680px;height:311px}
.post .keep .tape{position:absolute;left:50%;top:-17px;width:124px;height:30px;margin-left:-62px;background:rgba(255,230,140,.88);transform:rotate(-5deg);z-index:2}
.post .keep .kflash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none}
.post .keep .sheenbox{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.post .keep .sheen{position:absolute;top:-20%;bottom:-20%;left:0;width:30%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);transform:skewX(-18deg)}

/* ---- HOTEL DECENT neon sign (night station + cake close-up) ---- */
.hotel-sign{position:absolute;left:22px;top:150px;width:426px;height:142px;z-index:6;pointer-events:none;background:#1a1030;border:6px solid var(--ink);border-radius:16px;box-shadow:0 10px 0 rgba(0,0,0,.3);display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden}
.hotel-sign .hs-name{font-family:'Baloo 2',sans-serif;font-weight:800;font-size:50px;line-height:1;letter-spacing:3px;color:#6b4b6e;transition:color .2s,text-shadow .2s}
.hotel-sign .hs-name b{font-weight:800;color:inherit}
.hotel-sign .hs-stars{margin-top:6px;font-size:18px;font-weight:800;color:#7a6a55;white-space:nowrap}
.hotel-sign .hs-stars span{font-size:15px;margin-left:6px;letter-spacing:.5px}
.hotel-sign .hs-bulbs{position:absolute;left:10px;right:10px;display:flex;justify-content:space-between}
.hotel-sign .hs-top{top:7px}.hotel-sign .hs-bot{bottom:7px}
.hotel-sign .hs-bulbs i{width:9px;height:9px;border-radius:50%;background:#5a4a3a}
.hotel-sign.on .hs-name{color:#ffe1f0;text-shadow:0 0 6px #ff6fae,0 0 16px #ff6fae,0 0 34px #ff2d8a;animation:hs-buzz 5s infinite}
.hotel-sign.on .hs-name b{color:#fff6c8;text-shadow:0 0 6px #ffd23f,0 0 16px #ffb627,0 0 34px #ff9f43}
.hotel-sign.on .hs-stars{color:#ffd23f;text-shadow:0 0 8px rgba(255,210,63,.7)}
.hotel-sign.on .hs-bulbs i{background:#ffe9a8;box-shadow:0 0 8px #ffd23f;animation:hs-chase 1.2s infinite}
.hotel-sign.on .hs-bulbs i:nth-child(3n+2){animation-delay:.4s}
.hotel-sign.on .hs-bulbs i:nth-child(3n){animation-delay:.8s}
@keyframes hs-chase{0%,100%{opacity:1}50%{opacity:.25}}
@keyframes hs-buzz{0%,91%,100%{opacity:1}92%{opacity:.55}93%{opacity:1}95%{opacity:.7}96%{opacity:1}}
/* in the cake close-up the sign sits above the dim overlay, with a soft halo + a "you are here" tag */
.cut-ui .hotel-sign.hl{z-index:0;box-shadow:0 10px 0 rgba(0,0,0,.3),0 0 40px rgba(255,111,174,.55),0 0 90px rgba(255,210,63,.3)}
.cut-ui .hs-halo{position:absolute;left:-60px;top:70px;width:590px;height:300px;z-index:0;pointer-events:none;border-radius:50%;background:radial-gradient(ellipse at center,rgba(255,150,200,.28),rgba(255,210,120,.1) 45%,transparent 70%);mix-blend-mode:screen}
.cut-ui .hs-tag{position:absolute;left:470px;top:196px;z-index:0;pointer-events:none;font-family:'Baloo 2',sans-serif;font-weight:800;font-size:22px;color:#2b2b2b;background:#ffd23f;border:4px solid var(--ink);border-radius:14px;padding:4px 14px;white-space:nowrap;box-shadow:0 5px 0 rgba(0,0,0,.3)}
.cut-ui .hs-tag::before{content:'';position:absolute;left:-16px;top:50%;margin-top:-10px;border:10px solid transparent;border-right:12px solid var(--ink);border-left:0}

/* feeding guide: sits on the slice itself */
.slice-guide{position:absolute;z-index:40;pointer-events:none;transform:translate(-50%,-100%);display:flex;align-items:center;gap:10px;background:#fff;border:4px solid var(--ink);border-radius:16px;padding:8px 16px;font-family:'Baloo 2',sans-serif;font-weight:700;font-size:22px;line-height:1.15;color:#2b2b2b;white-space:nowrap;box-shadow:0 6px 0 rgba(0,0,0,.3)}
.slice-guide::after{content:'';position:absolute;left:50%;bottom:-16px;margin-left:-12px;border:12px solid transparent;border-top:14px solid var(--ink);border-bottom:0}
.slice-guide .sg-n{flex:none;width:34px;height:34px;border-radius:50%;background:#ff6fae;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;border:3px solid var(--ink)}
.slice-guide small{display:block;font-size:16px;font-weight:600;color:#666}
.cut-ui .top-svg .mouth-ring{fill:rgba(255,210,63,.18);stroke:#ffd23f;stroke-width:5}
.cut-ui .top-svg .feed-arrow{fill:none;stroke:#fff;stroke-width:6;stroke-linecap:round;stroke-dasharray:14 14;opacity:.9}
/* starry-night celebration: the HAPPY BIRTHDAY HAATHI board glows warmer against the sky */
.night .nboard{transition:box-shadow 2.5s ease}
.night .nboard.sky{box-shadow:0 0 70px 14px rgba(255,170,80,.28),0 0 22px rgba(255,120,170,.25),0 10px 0 rgba(0,0,0,.3)}
/* live mic meter while she blows the candles */
.mic-meter{position:absolute;display:flex;align-items:center;gap:12px;padding:10px 20px;background:rgba(20,12,36,.82);border:3px solid #ffd23f;border-radius:999px;color:#fff;font-weight:700;font-size:22px;z-index:30;white-space:nowrap}
.mic-meter span{font-size:26px}
.mic-meter i{display:block;width:210px;height:14px;border-radius:8px;background:rgba(255,255,255,.16);overflow:hidden}
.mic-meter b{display:block;height:100%;width:4%;border-radius:8px;background:linear-gradient(90deg,#7ee081,#ffd23f,#ff6fae);transition:width .06s linear}
.mic-meter em{font-style:normal;font-size:20px;opacity:.92}
/* ================= BLOOPERS ================= */
.post .bl-open{position:relative;margin-top:22px;background:var(--maroon);color:#ffd23f;transition:background-color .5s,color .5s,border-color .5s,box-shadow .5s}
.post .bl-open.locked{background:#ead7da;color:#a3868c;border-color:#b9a4a8;box-shadow:0 7px 0 #b9a4a8;cursor:not-allowed}
.post .bl-hint{font-size:20px;color:#ffe9cf;opacity:0;margin-top:4px}
.bloopers{position:absolute;inset:0;z-index:6;overflow:hidden;background:#000}
.bloopers .scene{z-index:1}
.bloopers .curtain-gl,.bloopers .css-curtain{z-index:4}
.css-curtain{position:absolute;left:-48px;top:22px;height:870px;width:160px;background:repeating-linear-gradient(90deg,#5e0712 0 18px,#a3142a 34px,#c41a33 44px,#8a0f22 60px,#5e0712 76px);box-shadow:inset -14px 0 24px rgba(0,0,0,.5);border-bottom:22px solid #d9a441}
.bl-leak{position:absolute;left:0;right:0;bottom:0;height:90px;z-index:3;pointer-events:none}
.bl-leak i{position:absolute;inset:0;opacity:0}
.bl-leak .cool{background:radial-gradient(ellipse 55% 100% at 50% 100%,rgba(170,190,255,.55),rgba(120,140,220,.12) 55%,transparent 80%)}
.bl-leak .warm{background:radial-gradient(ellipse 60% 100% at 50% 100%,rgba(255,214,140,.95),rgba(255,170,80,.3) 50%,transparent 78%)}
#ui>.bl-film{position:absolute;inset:0;z-index:6;pointer-events:none;background:radial-gradient(ellipse at 50% 50%,transparent 58%,rgba(20,10,0,.5) 100%);animation:blFlicker .18s steps(2) infinite}
@keyframes blFlicker{0%{opacity:.92}50%{opacity:1}}
#ui>.bl-clap{position:absolute;width:470px;z-index:34;pointer-events:none;filter:drop-shadow(0 18px 24px rgba(0,0,0,.5))}
.bl-clap .bc-top{height:64px;border:5px solid var(--ink);border-radius:10px 10px 0 0;background:repeating-linear-gradient(-55deg,#111 0 34px,#f5f5f5 34px 68px);overflow:hidden}
.bl-clap .bc-body{background:#1b1b1b;border:5px solid var(--ink);border-top:0;border-radius:0 0 14px 14px;padding:18px 28px 22px;color:#fff;font-family:'Special Elite',monospace}
.bl-clap b{display:block;font-family:'Baloo 2';font-size:52px;font-weight:800;color:#ffd23f;letter-spacing:2px;margin-bottom:8px}
.bl-clap p{font-size:26px;margin:6px 0;border-top:2px dashed #555;padding-top:6px}
.bl-clap span{display:inline-block;width:150px;color:#aaa;font-size:20px}
.bl-page{position:absolute;left:152px;top:238px;width:74px;height:92px;background:#fff4f8;border:3px solid var(--ink);border-radius:4px;transform:rotate(8deg);transform-origin:50% 90%;box-shadow:2px 3px 0 rgba(0,0,0,.25);padding:6px 6px 0;pointer-events:none}
.bl-page b{display:block;font:800 9px/1.1 'Baloo 2';color:#c2185b;margin-bottom:5px}
.bl-page i{display:block;height:3px;margin:7px 0;background:#f2a5c0;border-radius:2px}
#ui>.bl-rose{position:absolute;left:0;top:0;width:80px;height:170px;z-index:23;pointer-events:none;filter:drop-shadow(0 4px 4px rgba(0,0,0,.3))}
.bl-rose svg{display:block;position:relative;z-index:1}
.bl-rose .rose-glow{position:absolute;left:-30px;top:-34px;width:140px;height:140px;border-radius:50%;background:radial-gradient(circle,rgba(255,120,150,.55),rgba(255,120,150,0) 68%);opacity:0}
#ui>.bl-petal{position:absolute;z-index:31;pointer-events:none}
.bl-clap em{display:block;font-style:normal;font-family:'Kalam',cursive;font-size:24px;color:#ffe9a8;margin:-6px 0 6px;letter-spacing:1px}
#ui>.bl-star{position:absolute;z-index:32;pointer-events:none;filter:drop-shadow(0 0 6px #fff3c4) drop-shadow(0 0 14px rgba(255,214,120,.8))}
#ui>.bl-knock{position:absolute;width:60px;height:60px;border-radius:50%;z-index:33;pointer-events:none;border:3px solid rgba(255,255,255,.85);box-shadow:0 0 18px rgba(200,230,255,.8),inset 0 0 12px rgba(200,230,255,.6)}
#ui>.bl-sweat{position:absolute;z-index:33;font-size:46px;pointer-events:none}
#ui>.bl-fingers{position:absolute;left:0;top:0;z-index:22;pointer-events:none;filter:drop-shadow(1px 2px 0 rgba(0,0,0,.25))}
#ui>.bl-glass{position:absolute;inset:0;z-index:20;pointer-events:none;overflow:hidden}
.bl-glass .refl{position:absolute;left:-10%;top:-30%;width:26%;height:170%;transform:rotate(24deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.12),transparent)}
.bl-glass .refl.r2{left:58%;width:9%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent)}
.bl-glass .fog{position:absolute;width:240px;height:100px;border-radius:50%;background:radial-gradient(ellipse,rgba(235,240,250,.6),rgba(235,240,250,0) 70%);filter:blur(4px)}
.bl-glass .sweat{position:absolute;left:1060px;top:170px;font-size:70px}
#ui>.bl-thumb{position:absolute;font-size:56px;z-index:30;pointer-events:none}
#ui>.bl-end{position:absolute;left:0;right:0;top:300px;text-align:center;z-index:30;pointer-events:none}
.bl-end .te{font-family:'Kalam',cursive;font-weight:700;font-size:130px;line-height:1;letter-spacing:6px;background:linear-gradient(180deg,#fff6d6,#ffd36e 50%,#e59a3a);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 18px rgba(255,190,90,.6)) drop-shadow(0 4px 0 rgba(80,10,20,.6))}
.bl-end .ts{margin-top:24px;font-family:'Kalam',cursive;font-size:28px;letter-spacing:1px;color:#ffe2a8;opacity:0;text-shadow:0 0 10px rgba(255,190,90,.35),0 2px 6px rgba(0,0,0,.75)}
#ui>.bl-back{position:absolute;z-index:40}
.bl-stage{position:absolute;inset:0;z-index:1;overflow:hidden}
.bl-stage>*{position:absolute}
.bl-stage .bs-back{inset:0;background:radial-gradient(ellipse 50% 60% at 50% 40%,rgba(150,40,70,.45),transparent 70%),repeating-linear-gradient(90deg,#24060f 0 34px,#3a0a1a 52px,#4a0f22 64px,#30081a 80px,#24060f 100px)}
.bl-stage .bs-lights,.bl-stage .bs-floor{left:0;top:0}
.bl-stage .bs-lans{inset:0;z-index:1}
.bl-stage .bs-lan{position:absolute;width:70px;height:96px;scale:var(--s);transform-origin:50% -60px}
.bl-stage .bs-lan .str{position:absolute;left:34px;top:-260px;width:2px;height:260px;background:#3b2a20}
.bl-stage .bs-lan .glow{position:absolute;left:-55px;top:-40px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(255,180,90,.5),rgba(255,160,70,0) 70%)}
.bl-stage .bs-lan svg{position:relative}
.bl-stage .bs-pool{left:510px;top:770px;width:580px;height:130px;border-radius:50%;background:radial-gradient(ellipse,rgba(255,222,160,.75),rgba(255,200,120,.25) 55%,transparent 72%)}
.bl-stage .bs-petals{inset:0}
.bl-stage .bs-fp{position:absolute;opacity:.85}
.bl-stage .chars{z-index:2}
.bl-stage .bs-beam{left:0;top:0;width:1600px;height:900px;z-index:3;pointer-events:none;mix-blend-mode:screen;opacity:1;clip-path:polygon(46.5% 0,53.5% 0,68% 93%,32% 93%);background:linear-gradient(180deg,rgba(255,236,190,.42),rgba(255,214,150,.16) 70%,rgba(255,214,150,.05));filter:blur(5px)}
.bl-stage .bs-dust{left:0;top:0;width:1600px;height:900px;z-index:4;pointer-events:none;mix-blend-mode:screen}
.bl-stage .bs-vig{inset:0;z-index:5;pointer-events:none;background:radial-gradient(ellipse 52% 62% at 50% 55%,transparent 45%,rgba(6,2,10,.78) 100%)}


/* ---- BTS finale: dim stage, laptop portal, golden bloom, heart, valley feast ---- */
.bl-stage .bs-dim{inset:0;z-index:2;pointer-events:none;background:radial-gradient(ellipse 60% 70% at 50% 62%,rgba(6,2,12,.5),rgba(3,1,7,.86))}
#ui>.bl-portal{position:absolute;inset:0;z-index:35;pointer-events:none;overflow:hidden}
.bl-portal>i{position:absolute;display:block}
.bl-portal .pg{inset:0;background:radial-gradient(ellipse 62% 58% at 50% 50%,rgba(255,120,190,.3),rgba(255,150,210,.1) 55%,transparent 78%)}
.bl-portal .sheen{left:-30%;top:-20%;width:40%;height:160%;transform:rotate(18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.18),transparent);animation:blSheen 2.6s ease-in-out infinite}
.bl-portal .sheen.s2{width:16%;animation-delay:.9s;opacity:.7}
@keyframes blSheen{0%{left:-40%}100%{left:120%}}
.bl-portal .scan{inset:0;background:repeating-linear-gradient(0deg,rgba(255,200,235,.06) 0 2px,transparent 2px 6px);mix-blend-mode:screen;animation:blScan .35s steps(3) infinite}
@keyframes blScan{0%{transform:translateY(0)}100%{transform:translateY(6px)}}
.bl-portal .ring{left:650px;top:300px;width:300px;height:300px;border-radius:50%;border:4px solid rgba(255,175,218,.75);box-shadow:0 0 30px rgba(255,120,190,.6),inset 0 0 30px rgba(255,120,190,.45)}
.bl-portal .flash{inset:0;background:radial-gradient(circle at 50% 50%,#fff,rgba(255,205,232,.7) 38%,transparent 78%)}
.bl-portal .drop{width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;box-shadow:0 0 12px rgba(255,255,255,.9)}
#ui>.bl-bloom{position:absolute;left:-800px;top:-200px;width:3200px;height:2400px;z-index:36;pointer-events:none;transform-origin:50% 8%;
  background:radial-gradient(ellipse 38% 34% at 50% 8%,#fffdf4 0,#fff4cc 30%,#ffe7b0 55%,rgba(255,226,160,.85) 72%,rgba(255,220,150,0) 100%)}
.bl-heart{position:absolute;pointer-events:none;filter:drop-shadow(0 0 16px rgba(255,120,180,.85))}
.bl-scenery{position:absolute;inset:0;z-index:2;overflow:hidden;background:#ffd9a8}
.bl-scenery>*{position:absolute;left:0;top:0}
.bl-scenery .scn{width:1600px;height:900px}
.bl-scenery .sc-pollen{width:1600px;height:900px;pointer-events:none;mix-blend-mode:screen;z-index:1}
.bl-scenery .chars{z-index:2}
.bl-scenery .sc-table{inset:0;z-index:3;pointer-events:none}
.bl-scenery .sc-table .tbl{position:absolute;left:0;top:0}
.bl-scenery .food{position:absolute;inset:0}
.bl-scenery .dish{position:absolute}
.bl-scenery .dish svg{display:block;overflow:visible}
.bl-scenery .sc-held{inset:0;z-index:4;pointer-events:none}
.bl-scenery .held-food{position:absolute;filter:drop-shadow(0 3px 3px rgba(0,0,0,.25))}
.bl-scenery .held-food svg{display:block;overflow:visible}
.bl-scenery .crumb{position:absolute;width:6px;height:6px;border-radius:2px}
.bl-scenery .cheese{position:absolute;left:0;top:0;overflow:visible}
.bl-scenery .sc-vig{inset:0;z-index:5;pointer-events:none;background:radial-gradient(ellipse 72% 78% at 50% 48%,transparent 58%,rgba(70,35,10,.3))}
.bl-stage .bs-follow{left:0;top:0;width:1600px;height:900px;z-index:3;pointer-events:none;mix-blend-mode:screen;filter:blur(7px);opacity:0}
.bl-stage .bs-follow.pink{background:linear-gradient(180deg,rgba(255,150,205,.42),rgba(255,120,190,.16) 75%,rgba(255,120,190,.05))}
.bl-stage .bs-follow.cyan{background:linear-gradient(180deg,rgba(150,215,255,.4),rgba(120,190,255,.15) 75%,rgba(120,190,255,.05))}
.bl-stage .bs-fpool{width:340px;height:90px;border-radius:50%;z-index:1;opacity:0;pointer-events:none}
.bl-stage .bs-fpool.pink{background:radial-gradient(ellipse,rgba(255,160,210,.6),rgba(255,150,205,.18) 55%,transparent 72%)}
.bl-stage .bs-fpool.cyan{background:radial-gradient(ellipse,rgba(170,220,255,.55),rgba(150,210,255,.16) 55%,transparent 72%)}
#ui>.bl-hand{position:absolute;z-index:37;pointer-events:none;filter:drop-shadow(0 10px 18px rgba(0,0,0,.35))}
#ui>.bl-hand svg{display:block;overflow:visible}
.bl-portal.touch .pg{background:radial-gradient(ellipse 40% 40% at 50% 64%,rgba(255,130,195,.32),rgba(255,150,210,.1) 55%,transparent 78%)}
/* BTS dance: disco mode */
.bs-disco{position:absolute;inset:0;pointer-events:none}
.bs-disco>*{position:absolute;left:0;top:0}
.bs-disco .dc-wash{inset:0;width:1600px;height:900px;mix-blend-mode:screen;opacity:0}
.bs-disco .dc-beams{mix-blend-mode:screen;opacity:.6}
.bs-disco .dc-ball{left:745px;top:0;width:110px;height:170px}
.bs-disco .dc-ball .str{position:absolute;left:54px;top:0;width:2px;height:62px;background:#bbb}
.bs-disco .dc-ball svg{position:absolute;left:0;top:56px}
.bs-disco .dc-specks{width:1600px;height:900px;mix-blend-mode:screen}
.bl-stage .bs-disco.back{z-index:1}
.bl-stage .bs-disco.front{z-index:4}
/* the ticket check (password) on the notice board */
.gate .gate-card .w-sub{margin-bottom:20px}
.gate-form{display:flex;gap:16px;align-items:center;justify-content:center;margin:6px 0 4px}
.gate-pw{font:700 34px 'Baloo 2',sans-serif;letter-spacing:8px;text-align:center;width:360px;padding:10px 18px;border:5px solid var(--ink);border-radius:16px;background:#fffdf4;color:var(--ink);outline:none;box-shadow:0 6px 0 rgba(0,0,0,.18)}
.gate-pw:focus{border-color:var(--maroon)}
.gate .btn.gate-go{position:relative;font-size:30px;padding:10px 30px;background:var(--maroon);color:#ffd23f;border-color:var(--ink);box-shadow:0 7px 0 var(--ink)}
.gate .btn.gate-go:disabled{opacity:.6}
.gate-msg{min-height:38px;margin:14px 0 0;text-align:center;font-size:24px;font-weight:700;color:var(--maroon)}

/* the notice boards (password + welcome) sit in the middle of the screen */
.scene.greenery .welcome{top:50%;margin-top:0}
.cake-choose{position:absolute;z-index:30;text-align:center;background:#fff3e6;border:5px solid var(--ink);border-radius:18px;padding:8px 26px;font-family:'Baloo 2';font-size:34px;font-weight:800;color:var(--maroon);box-shadow:0 6px 0 var(--ink);white-space:nowrap}
.cake-choose small{display:block;font-size:19px;font-weight:600;color:#2f1a12}
#ui>.cake-tag.pick{pointer-events:auto;cursor:pointer;font-size:24px;padding:4px 14px}
/* the sad meter is gone from the whole site */
#mood{display:none!important}
/* diary buttons: one look for all of them (‹ Pichhla panna · Agla panna › · Please Turn Over ▶ · Let it fly ✨) */
#ui>.btn.gb-btn{width:240px;padding:10px 0;text-align:center;font-family:'Baloo 2';font-size:22px;font-weight:800;color:#ffd23f;background:var(--maroon);border:4px solid var(--ink);border-radius:999px;box-shadow:0 6px 0 var(--ink);z-index:40}
#ui>.btn.gb-btn:hover{background:#a3394a}
#ui>.btn.gb-btn:disabled{opacity:.35;cursor:default}
#ui>.btn.gb-btn:disabled:hover{background:var(--maroon)}
#ui>.btn.gb-btn.off{filter:saturate(.3) brightness(1.35);cursor:default}
/* chapters button (bottom-right) */
#chapters{position:fixed;right:12px;bottom:12px;z-index:100;font-family:'Baloo 2',sans-serif}
#chapters .ch-btn{background:rgba(255,255,255,.88);border:2px solid var(--ink);border-radius:999px;padding:4px 14px;font:700 15px 'Baloo 2',sans-serif;color:var(--ink);cursor:pointer}
#chapters .ch-btn:hover{background:#fff}
#chapters .ch-menu{position:absolute;right:0;bottom:44px;display:flex;flex-direction:column;gap:4px;min-width:290px;max-height:70vh;overflow:auto;background:#fffdf4;border:3px solid var(--ink);border-radius:16px;padding:10px;box-shadow:0 8px 0 rgba(0,0,0,.25)}
#chapters .ch-menu[hidden]{display:none}
#chapters .ch-menu b{color:var(--maroon);font-size:18px;padding:0 6px 4px}
#chapters .ch-menu button{text-align:left;font:600 15px 'Baloo 2',sans-serif;color:var(--ink);background:#fff3c4;border:2px solid #e6cf7a;border-radius:10px;padding:5px 10px;cursor:pointer}
#chapters .ch-menu button:hover{background:#ffd23f;border-color:var(--ink)}
#chapters .ch-menu button.on{background:var(--maroon);color:#ffd23f;border-color:var(--ink)}