@font-face{font-family:'Inter';font-style:normal;font-weight:400 600;font-display:swap;src:url('/fonts/Inter.woff2') format('woff2')}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:400 700;font-display:swap;src:url('/fonts/SpaceGrotesk.woff2') format('woff2')}
@font-face{font-family:'Outfit';font-style:normal;font-weight:600 900;font-display:swap;src:url('/fonts/outfit.woff2') format('woff2')}
:root{
  --bg:#06081A; --cyan:#00DFFF; --violet:#783DFF; --pink:#FF5CC8; --gold:#F4C56A;
  --text:#F8FAFF; --muted:#A9B9D8; --line:rgba(0,223,255,.28);
  --kb:0px; --dockH:96px; --clusterH:190px; --dockH:96px; --font-d:'Space Grotesk',system-ui,sans-serif; --font-b:'Inter',system-ui,sans-serif;
}
*{box-sizing:border-box} html,body{margin:0;padding:0;height:100%}
body{background:var(--bg);color:var(--text);font-family:var(--font-b);overflow:hidden}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
button{font-family:inherit;cursor:pointer}
#room h1:focus,#room h2:focus{outline:none}

/* ---------- environment stage ---------- */
.stage-bg{position:fixed;inset:0;z-index:0;background-size:cover;background-position:center 26%;opacity:0;transition:opacity .45s ease,transform .5s ease,filter .5s ease;will-change:opacity,transform,filter}
.stage-bg.is-active{opacity:1}
.stage-bg.depart{transform:scale(1.05);filter:brightness(.68) blur(5px)}
#scrim{position:fixed;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(6,8,26,.34) 0%,rgba(6,8,26,0) 26%,rgba(6,8,26,0) 55%,rgba(6,8,26,.66) 100%)}
#room{position:fixed;inset:0;z-index:2;overflow:hidden;padding:calc(14px + env(safe-area-inset-top)) 18px calc(96px + env(safe-area-inset-bottom))}
#room.arrive .rise{animation:rise .55s cubic-bezier(.22,.8,.3,1) both}
#room.arrive .rise.d1{animation-delay:.05s} #room.arrive .rise.d2{animation-delay:.13s} #room.arrive .rise.d3{animation-delay:.21s}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.kicker{font-family:var(--font-d);letter-spacing:.34em;font-size:11px;text-transform:uppercase;color:var(--cyan);margin:0 0 8px;text-shadow:0 2px 12px rgba(0,0,0,.8)}
.stage-id{position:absolute;top:calc(16px + env(safe-area-inset-top));left:18px;right:18px;pointer-events:none}
.stage-id h1{font-family:var(--font-d);font-weight:700;font-size:clamp(26px,6.4vw,40px);line-height:1.05;margin:0;text-shadow:0 4px 30px rgba(0,0,0,.75)}
.glass{background:rgba(9,13,34,.72);border:1px solid rgba(140,170,255,.20);border-radius:20px;box-shadow:0 18px 50px rgba(0,0,0,.45)}

/* ---------- welcome (F6 composition) ---------- */
.brand-block{position:absolute;left:18px;right:18px;bottom:calc(108px + env(safe-area-inset-bottom))}
.brand-block .hero-title{font-family:var(--font-d);font-weight:700;font-size:clamp(40px,10.5vw,84px);line-height:.98;margin:0 0 8px;text-shadow:0 6px 44px rgba(0,0,0,.65)}
.brand-block .hero-title em{font-style:normal;color:var(--cyan)}
.brand-block .hero-tag{font-size:clamp(15px,4vw,19px);margin:0;text-shadow:0 2px 16px rgba(0,0,0,.8)}

/* ---------- gallery stage ---------- */
.featured-stage{position:absolute;left:0;right:0;top:12.5%;display:flex;flex-direction:column;align-items:center}
.featured-frame{position:relative;width:min(64vw,350px);aspect-ratio:1/1.06;border-radius:24px;overflow:hidden;border:1px solid rgba(140,170,255,.28);box-shadow:0 30px 80px rgba(0,0,0,.6);cursor:pointer;background:rgba(8,10,28,.4)}
.featured-frame img.feat-main{position:relative;z-index:1;width:100%;height:100%;object-fit:cover;display:block;transition:opacity .3s ease}
.featured-frame img.feat-ghost{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:blur(14px) saturate(1.2);transform:scale(1.06);opacity:.85}
.featured-frame::after{content:"";position:absolute;z-index:2;left:10%;right:10%;bottom:-24px;height:52px;border-radius:50%;background:radial-gradient(closest-side,var(--glow,#00DFFF),transparent);opacity:.45;filter:blur(8px);pointer-events:none}
.stage-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:rgba(9,13,34,.66);color:var(--text);font-size:19px}
.stage-nav.prev{left:-14px} .stage-nav.next{right:-14px}
.featured-wrap{position:relative}
.counter{margin-top:14px;font-family:var(--font-d);font-size:12px;letter-spacing:.22em;color:var(--text);background:rgba(5,7,20,.72);border:1px solid rgba(140,170,255,.20);padding:5px 13px;border-radius:999px}
.caption{position:absolute;left:18px;right:18px;bottom:calc(212px + env(safe-area-inset-bottom));padding:14px 16px;pointer-events:none}
.caption h2{font-family:var(--font-d);font-size:clamp(21px,5.6vw,28px);margin:0 0 4px}
.caption p{color:var(--muted);margin:0;font-size:13.5px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.caption .row{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.caption .price{font-family:var(--font-d);color:var(--gold);font-size:15.5px}
.caption .hintline{margin-top:8px;font-size:12px;color:#8fa3cc}
@media (max-height:700px){ .featured-stage{top:12%} .featured-frame{width:min(64vw,340px)} }

/* ---------- lounge stage ---------- */
.lounge-caption{position:absolute;left:18px;right:18px;bottom:calc(170px + env(safe-area-inset-bottom));padding:16px 18px}
.lounge-caption h2{font-family:var(--font-d);font-size:clamp(22px,6vw,30px);margin:0 0 5px}
.lounge-caption p{color:var(--muted);margin:0;font-size:14px;line-height:1.55}
.ctx-chip{display:inline-block;margin-top:10px;font-family:var(--font-d);font-size:12px;letter-spacing:.05em;color:var(--gold);border:1px solid rgba(244,197,106,.5);border-radius:999px;padding:5px 11px}

/* ---------- preview rooms ---------- */
.preview-wrap{position:absolute;inset:0;display:grid;place-items:center;padding:18px}
.preview-card{padding:24px 22px;max-width:560px;width:100%;max-height:72svh;overflow-y:auto}
.badge{display:inline-block;font-family:var(--font-d);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);border:1px solid rgba(244,197,106,.45);border-radius:999px;padding:5px 11px;margin-bottom:14px}
.preview-card h1{font-family:var(--font-d);font-size:clamp(28px,7vw,40px);margin:0 0 10px}
.preview-card p{color:var(--muted);line-height:1.6;font-size:14.5px;margin:0 0 12px}
.preview-card ul{margin:0 0 16px;padding-left:18px;color:var(--muted);font-size:14px;line-height:1.7}
.preview-card .fact{color:var(--text)} .fact b{color:var(--gold);font-family:var(--font-d);font-weight:600}
.btn{border-radius:999px;padding:12px 20px;font-family:var(--font-d);font-size:14px;border:1px solid var(--line);background:rgba(12,20,48,.7);color:var(--text);text-decoration:none;display:inline-block}
.btn.primary{background:linear-gradient(90deg,var(--violet),var(--pink));border-color:transparent;color:#fff;font-weight:600}
.btn.gold{background:linear-gradient(90deg,#8a6a25,var(--gold));color:#221a05;border-color:transparent;font-weight:600}
.cta-row{display:flex;gap:10px;flex-wrap:wrap}

/* ---------- contextual panel ---------- */
#panelShade{position:fixed;inset:0;z-index:54;background:rgba(3,4,12,.32);opacity:0;pointer-events:none;transition:opacity .3s}
#panelShade.open{opacity:1;pointer-events:auto}
#panel{position:fixed;z-index:60;left:8px;right:8px;bottom:calc(86px + env(safe-area-inset-bottom));max-height:calc(78svh - 90px);border:1px solid rgba(0,223,255,.30);border-radius:24px;display:flex;flex-direction:column;background:rgba(8,11,30,.97);border-top:1px solid rgba(0,223,255,.30);border-radius:24px 24px 0 0;transform:translateY(106%);visibility:hidden;transition:transform .38s cubic-bezier(.22,.8,.3,1),visibility 0s linear .38s;max-width:680px;margin:0 auto}
#panel.open{transform:none;visibility:visible;transition:transform .38s cubic-bezier(.22,.8,.3,1)}
#panel header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px 8px}
#panel header h2{font-family:var(--font-d);font-size:20px;margin:0}
#panelClose{flex:0 0 auto;width:38px;height:38px;border-radius:50%;border:1px solid rgba(140,170,255,.3);background:rgba(12,20,48,.8);color:var(--text);font-size:16px}
#panelBody{overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;touch-action:pan-y;padding:6px 18px calc(18px + env(safe-area-inset-bottom));-webkit-overflow-scrolling:touch}
#panelFoot{display:none}
#panelFoot.on{display:block;padding:10px 18px calc(10px + env(safe-area-inset-bottom));border-top:1px solid rgba(140,170,255,.14);background:rgba(8,11,30,.98)}
#panelFoot .stg-foot{position:static;background:none;padding:0;margin:0}
#panelFoot .cta-row{margin:0}
.ck-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:14px}
.ck-tile{display:flex;flex-direction:column;gap:3px;align-items:flex-start;text-align:left;border:1px solid rgba(140,170,255,.3);border-radius:16px;padding:13px 12px;background:rgba(13,19,52,.72);color:var(--text);cursor:pointer;min-height:96px}
.ck-tile.on{border-color:var(--cyan);box-shadow:0 0 0 1px rgba(0,223,255,.5);background:rgba(0,223,255,.10)}
.ck-tile-name{font-family:var(--font-d);font-size:14.5px}
.ck-tile-serves{color:var(--muted);font-size:12px}
.ck-tile-price{color:var(--gold);font-size:15px;margin-top:auto}
.ck-suggest{font-size:13.5px;color:var(--text);background:rgba(0,223,255,.08);border:1px solid rgba(0,223,255,.25);border-radius:10px;padding:9px 12px;line-height:1.5}
.ck-dim{color:var(--muted);font-size:12px}
.ck-sizes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.ck-size{display:flex;flex-direction:column;gap:2px;align-items:flex-start;border:1px solid rgba(140,170,255,.3);border-radius:14px;padding:10px;background:rgba(13,19,52,.7);color:var(--text);cursor:pointer;text-align:left}
.ck-size.on{border-color:var(--cyan);box-shadow:0 0 0 1px rgba(0,223,255,.5);background:rgba(0,223,255,.10)}
.ck-size b{font-size:13.5px}
.ck-size span{color:var(--muted);font-size:11.5px}
.ck-size em{font-style:normal;color:var(--gold);font-size:13px}
.ck-price-note{font-size:12.5px;color:var(--muted);line-height:1.5;margin:6px 0 0}
.ck-price-status{font-family:var(--font-d);font-size:16px;color:var(--gold);margin:0 0 6px}
body[data-room="cakes"] .stage-bg{filter:brightness(.92)}
.ck-strip-img{width:38px;height:38px;border-radius:10px;object-fit:cover;border:1px solid rgba(244,197,106,.45);flex:0 0 auto}
.stage-id{transition:opacity .3s ease}
body.cakewiz .stage-id{opacity:0}
#ckFrame .feat-main{object-position:center 60%}
.ck-scene3{position:absolute;left:0;right:0;top:0;bottom:calc(var(--dockH,96px) + var(--clusterH,150px) + 12px + env(safe-area-inset-bottom));overflow:hidden;z-index:0;background:#07060e;transition:transform .55s ease}
.ck-plate{position:absolute;width:var(--pw,390px);height:var(--ph,585px);left:var(--ox,0px);top:var(--oy,0px);pointer-events:none}
.ck-room3 img{width:100%;height:100%;display:block}
.ck-ring3{opacity:1}
.ck-ring3 .ring-base{fill:none;stroke:rgba(150,120,255,.25);stroke-width:3}
.ck-ring3.ring-on .ring-base{stroke:rgba(178,148,255,.55)}
.ck-ring3 .ring-arc{display:none}
.ck-fx3{overflow:visible}
.ck-cake-img{position:absolute;display:block;pointer-events:none;opacity:0;transition:none}
.ck-shadow{position:absolute;border-radius:50%;background:radial-gradient(ellipse at center,rgba(0,0,0,.40) 0%,rgba(0,0,0,.18) 55%,transparent 72%);pointer-events:none}

.ck-skip3{position:absolute;right:14px;bottom:12px;background:rgba(10,12,20,.55);color:#e8e2d2;border:1px solid rgba(255,255,255,.28);border-radius:999px;padding:10px 18px;font:600 13.5px var(--font-d);cursor:pointer;backdrop-filter:blur(6px);z-index:5}

.ck-glow{position:absolute;inset:0;pointer-events:none;transition:opacity .5s ease;background:radial-gradient(62% 44% at 50% 60%,rgba(244,197,106,.16),transparent 70%)}
.ck-glow[data-cake="petite"]{background:radial-gradient(62% 44% at 50% 60%,rgba(255,244,214,.15),transparent 70%)}
.ck-glow[data-cake="classic"]{background:radial-gradient(62% 44% at 50% 60%,rgba(167,139,250,.17),transparent 70%)}
.ck-glow[data-cake="grand"]{background:radial-gradient(62% 44% at 50% 60%,rgba(244,197,106,.19),transparent 70%)}
body.cakewiz .ck-scene3{transform:scale(1.05) translateY(-5.5%)}
.ck-cluster{position:absolute;left:14px;right:14px;bottom:calc(var(--dockH,96px) + 8px + env(safe-area-inset-bottom));z-index:4;display:flex;flex-direction:column;gap:8px;padding:10px 12px;border-radius:18px;background:rgba(8,11,30,.52);border:1px solid rgba(167,139,250,.22);backdrop-filter:blur(16px) saturate(1.25);-webkit-backdrop-filter:blur(16px) saturate(1.25);transition:opacity .35s ease,transform .35s ease}
.ck-cluster.ck-pre{opacity:0;pointer-events:none;transform:translateY(10px);animation:none}
.ck-cluster.ck-busy [data-cake-quote]{opacity:.45;pointer-events:none}
.ck-cta{padding:11px 16px}
body.cakewiz .ck-cluster{opacity:0;pointer-events:none;transform:translateY(10px)}
.ck-seg{display:flex;gap:8px}
.ck-seg-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:6px 6px;border-radius:13px;background:rgba(140,170,255,.07);border:1px solid rgba(140,170,255,.16);color:var(--text);font:600 13.5px var(--font-d);cursor:pointer;min-height:44px}
.ck-seg-btn img{width:26px;height:26px;border-radius:8px;object-fit:cover}
.ck-seg-btn.on{border-color:rgba(244,197,106,.85);background:rgba(244,197,106,.13);color:#fff;box-shadow:0 0 0 1px rgba(244,197,106,.35)}
.ck-info{display:flex;flex-direction:row;flex-wrap:wrap;gap:1px 8px;align-items:baseline;padding:0 2px;margin:0}
.ck-info-name{font:600 16.5px var(--font-d);color:#fff}
.ck-info-sub{font-size:12.5px;color:var(--dim)}
.ck-info-sub b{color:var(--gold);font-weight:600}
.ck-cta{width:100%}
@media (max-height:740px){ .ck-layer{top:-13%;height:110%} .ck-cluster{gap:7px;padding:10px;bottom:calc(92px + env(safe-area-inset-bottom))} .ck-seg-btn{min-height:44px} .ck-seg-btn img{width:26px;height:26px} }
@media (prefers-reduced-motion: reduce){ .ck-layer{transition:opacity .01s ease;transform:none} .ck-layer.is-on{transform:none} .ck-scene2{transition:none} }
.ck-caption{pointer-events:auto}
.ck-cap-actions{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.ck-cap-actions .btn{flex:1 1 auto;white-space:nowrap;padding:11px 10px}
.ck-frame{--glow:#F4C56A}
#ckImg{transition:transform .45s ease,opacity .3s ease}
.caption,.rail-wrap{transition:opacity .35s ease,transform .35s ease}
body.cakewiz .caption,body.cakewiz .rail-wrap{opacity:0;pointer-events:none;transform:translateY(10px)}
.featured-stage{transition:top .45s ease}
body.cakewiz .featured-stage{top:5.5%}
body.cakewiz .featured-frame{width:min(42vw,225px)}
#panel.deck{background:linear-gradient(180deg,rgba(17,21,50,.95),rgba(7,9,24,.98));border-top:1px solid rgba(244,197,106,.42);box-shadow:0 -18px 50px rgba(0,0,0,.5)}
.exhibit.ck-tile.on img{border-color:var(--gold);box-shadow:0 0 0 2px rgba(244,197,106,.55),0 6px 18px rgba(0,0,0,.4)}
.ck-strip{display:flex;justify-content:space-between;align-items:center;gap:12px;border:1px solid rgba(244,197,106,.4);background:rgba(244,197,106,.07);border-radius:12px;padding:9px 12px;margin:0 0 14px}
.ck-strip-name{font-family:var(--font-d);font-size:14px}
.ck-strip-sub{color:var(--gold);font-size:13px;text-align:right;white-space:nowrap}
.carried-line{font-size:12.5px;color:var(--cyan);background:rgba(0,223,255,.08);border:1px solid rgba(0,223,255,.25);border-radius:10px;padding:8px 11px;margin:0 0 12px;line-height:1.45}
.sw{display:inline-block;width:11px;height:11px;border-radius:50%;margin-right:6px;vertical-align:-1px;border:1px solid rgba(255,255,255,.35)}
#panelBody .sub{color:var(--muted);font-size:13.5px;line-height:1.55;margin:0 0 12px}
@media (min-width:900px){
  #panel{left:auto;right:22px;bottom:22px;width:430px;max-height:78svh;border:1px solid rgba(0,223,255,.30);border-radius:24px;transform:translateX(112%)}
  #panel.open{transform:none;visibility:visible;transition:transform .38s cubic-bezier(.22,.8,.3,1)}
}
.cat-list{display:flex;flex-direction:column;gap:6px}
.cat-row{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:rgba(12,20,48,.55);border:1px solid rgba(140,170,255,.16);border-radius:14px;padding:8px 10px;color:var(--text)}
.cat-row img{width:52px;height:52px;border-radius:10px;object-fit:cover;flex:0 0 auto}
.cat-row b{font-family:var(--font-d);font-size:14.5px;display:block}
.cat-row span{color:var(--muted);font-size:12px}
.cat-row .p{margin-left:auto;color:var(--gold);font-family:var(--font-d);font-size:14px;flex:0 0 auto}
.detail-hero{width:100%;height:180px;object-fit:cover;border-radius:16px;display:block;margin-bottom:12px}
.detail-price{font-family:var(--font-d);color:var(--gold);font-size:17px}
.tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.tags i{font-style:normal;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--cyan);border:1px solid var(--line);padding:4px 9px;border-radius:999px}
.pkg-row{padding:13px 15px;border:1px solid rgba(140,170,255,.16);border-radius:16px;background:rgba(12,20,48,.55);margin-bottom:9px}
.pkg-row h3{font-family:var(--font-d);margin:0 0 3px;font-size:16px}
.pkg-row .per{color:var(--gold);font-family:var(--font-d);font-size:14px}
.pkg-row p{color:var(--muted);font-size:13px;line-height:1.5;margin:6px 0 0}
.pkg-row .total{margin-top:8px;font-family:var(--font-d);color:var(--text);font-size:14.5px}
.stepper{display:flex;align-items:center;gap:14px;margin:4px 0 14px}
.stepper button{width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:rgba(12,20,48,.7);color:var(--text);font-size:19px}
.stepper b{font-family:var(--font-d);font-size:19px;min-width:110px;text-align:center}
.demo-note{font-size:11.5px;color:var(--muted);letter-spacing:.05em;text-transform:uppercase;margin-top:10px}
.choice-list{display:flex;flex-direction:column;gap:8px}
.choice-list button{text-align:left;border:1px solid rgba(140,170,255,.22);background:rgba(12,20,48,.6);color:var(--text);border-radius:14px;padding:13px 15px;font-family:var(--font-d);font-size:15px}
/* plan form inside panel */
#panelBody form{display:grid;grid-template-columns:1fr 1fr;gap:10px}
#panelBody label{font-size:12px;color:var(--muted);display:flex;flex-direction:column;gap:5px;letter-spacing:.03em}
#panelBody label.full{grid-column:1/-1}
#panelBody input,#panelBody select,#panelBody textarea{background:#0d1334;border:1px solid rgba(140,170,255,.3);border-radius:12px;color:var(--text);padding:11px 12px;font-size:16px;font-family:inherit;width:100%}
#panelBody .actions{grid-column:1/-1;display:flex;gap:10px;margin-top:4px}
#planResult{grid-column:1/-1;display:none;padding:14px;border-radius:14px;border:1px solid rgba(0,223,255,.4);background:rgba(0,223,255,.07);font-size:14px;line-height:1.55}
#planResult.show{display:block} #planResult b{color:var(--cyan);font-family:var(--font-d)}

/* ---------- nav drawer (discreet fallback) ---------- */
#drawer{position:fixed;z-index:64;left:12px;bottom:calc(92px + env(safe-area-inset-bottom));width:250px;background:rgba(8,11,30,.97);border:1px solid rgba(140,170,255,.25);border-radius:18px;padding:10px;transform:translateY(12px);opacity:0;pointer-events:none;transition:opacity .25s,transform .25s}
#drawer.open{opacity:1;transform:none;pointer-events:auto}
#drawer p{margin:4px 8px 8px;color:var(--muted);font-size:12px;line-height:1.5}
#drawer a{display:block;padding:11px 10px;border-radius:12px;color:var(--text);text-decoration:none;font-family:var(--font-d);font-size:14.5px}
#drawer a:hover,#drawer a[aria-current="page"]{background:rgba(0,223,255,.10)}

/* ---------- transition veil ---------- */
#asm2{position:fixed;inset:0;z-index:61;background:radial-gradient(120% 90% at 50% 110%,rgba(52,28,110,.35),transparent 60%),radial-gradient(80% 50% at 50% 0%,rgba(94,234,255,.10),transparent 60%),#04050d}
#asm2Guides{position:absolute;inset:0;width:100%;height:100%}
#asm2Guides path{fill:none;stroke:rgba(120,220,255,.4);stroke-width:1.4;stroke-dasharray:100;stroke-dashoffset:100}
#asm2Bg,#asm2Stage{position:absolute;inset:0}
.asm-piece{position:absolute;background-size:100% 100%;background-repeat:no-repeat;will-change:transform,opacity}
#asm2Glow{position:absolute;inset:0;background:radial-gradient(60% 42% at 50% 58%,rgba(190,140,255,.5),rgba(94,234,255,.12) 55%,transparent 75%);opacity:0;pointer-events:none}
#passage{position:fixed;inset:0;z-index:60;pointer-events:none;perspective:1100px;display:none}
#passage.on{display:block;pointer-events:auto}
.pg-panel{position:absolute;top:0;height:100%;overflow:hidden;background:#04050d;will-change:transform,opacity;box-shadow:inset -1px 0 0 rgba(140,240,255,.28),inset 1px 0 0 rgba(0,0,0,.4)}
.pg-panel i{position:absolute;top:0;height:100%;display:block;background-size:cover;filter:brightness(1.03) saturate(1.06)}
.pg-panel.enter{animation:pgIn .55s cubic-bezier(.22,.8,.3,1) both}
@keyframes pgIn{from{transform:rotateY(var(--ry,34deg)) translateX(var(--tx,0));opacity:.45}to{transform:rotateY(0) translateX(0);opacity:1}}
#passage.leaving .pg-panel{animation:pgOut .3s ease both}
@keyframes pgOut{to{opacity:0}}
body.passage-push #room{transform:scale(1.05);filter:brightness(1.13);transition:transform .28s ease,filter .28s ease}
#veil{position:fixed;inset:0;z-index:50;pointer-events:none;opacity:0}
#veil .tint{position:absolute;inset:0;opacity:0;background:radial-gradient(120% 90% at 50% 110%,rgba(40,20,80,.55),transparent 60%),radial-gradient(90% 60% at 50% -10%,rgba(94,234,255,.16),transparent 60%)}
#veil[data-dest="cakes"] .tint{background:radial-gradient(120% 90% at 50% 110%,rgba(96,64,10,.5),transparent 60%),radial-gradient(90% 60% at 50% -10%,rgba(190,140,255,.22),transparent 60%)}
#veil[data-dest="parties"] .tint{background:radial-gradient(120% 90% at 50% 110%,rgba(96,36,52,.5),transparent 60%),radial-gradient(90% 60% at 50% -10%,rgba(255,190,150,.16),transparent 60%)}
#veil[data-dest="visit"] .tint{background:radial-gradient(120% 90% at 50% 110%,rgba(8,60,70,.5),transparent 60%),radial-gradient(90% 60% at 50% -10%,rgba(94,234,255,.24),transparent 60%)}
#veil[data-dest="welcome"] .tint{background:radial-gradient(120% 90% at 50% 110%,rgba(30,16,70,.6),transparent 60%)}
#veil.phase-b .tint{animation:mistIn var(--tb,400ms) ease forwards}
#veil.phase-c .tint{animation:mistOut var(--tc,450ms) ease forwards}
#veil.on{opacity:1}
.mist{position:absolute;inset:-12%;opacity:0;will-change:transform,opacity}
.mist-a{background:radial-gradient(58% 46% at 50% 58%,rgba(120,61,255,.5),rgba(120,61,255,0) 70%),radial-gradient(40% 34% at 30% 40%,rgba(0,223,255,.32),rgba(0,223,255,0) 70%)}
.mist-b{background:radial-gradient(50% 40% at 68% 44%,rgba(255,92,200,.30),rgba(255,92,200,0) 70%),radial-gradient(66% 52% at 50% 62%,rgba(28,22,80,.88),rgba(28,22,80,0) 74%)}
#veil.phase-b .mist-a{animation:mistIn var(--tb,400ms) ease forwards}
#veil.phase-b .mist-b{animation:mistIn var(--tb,400ms) ease .05s forwards}
#veil.phase-c .mist-a{animation:mistOut var(--tc,450ms) ease forwards}
#veil.phase-c .mist-b{animation:mistOut var(--tc,450ms) ease forwards}
@keyframes mistIn{from{opacity:0;transform:scale(.92) translateY(2%)}to{opacity:1;transform:scale(1.06) translateY(0)}}
@keyframes mistOut{from{opacity:1;transform:scale(1.06)}to{opacity:0;transform:scale(1.14) translateY(-2%)}}
.sweep{position:absolute;top:0;bottom:0;left:-30%;width:34%;opacity:0;background:linear-gradient(100deg,transparent,rgba(180,240,255,.20),transparent);transform:skewX(-8deg)}
#veil.phase-b .sweep{animation:sweep var(--tb,400ms) ease forwards}
@keyframes sweep{0%{left:-30%;opacity:0}30%{opacity:1}100%{left:105%;opacity:0}}
#veil.xfade{transition:opacity .16s ease}

/* ---------- concierge dock (single control) ---------- */
#dock{position:fixed;left:0;right:0;bottom:var(--kb);z-index:62;padding:8px 8px calc(10px + env(safe-area-inset-bottom));max-width:760px;margin:0 auto}
#reply{display:inline-block;max-width:100%;font-size:13.5px;color:var(--text);background:rgba(5,7,20,.85);border:1px solid rgba(140,170,255,.16);border-radius:12px;padding:6px 11px;margin:0 2px 7px;opacity:0;transition:opacity .25s;pointer-events:none}
#reply.show{opacity:1} #reply:empty{padding:0;border:none;background:none}
#reply b{color:var(--cyan);font-family:var(--font-d);font-weight:600}
#ask{display:flex;gap:5px;padding:4px;align-items:flex-end;background:rgba(10,14,36,.92);border:1px solid rgba(140,170,255,.38);border-radius:24px;padding:6px;box-shadow:0 16px 44px rgba(0,0,0,.55)}
#ask:focus-within{border-color:var(--cyan)}
#menuBtn{flex:0 0 auto;width:36px;height:36px;border-radius:50%;border:1px solid rgba(140,170,255,.25);background:rgba(12,20,48,.6);color:var(--muted);font-size:17px}
#askInput{flex:1;background:none;border:none;outline:none;color:var(--text);font-size:16px;font-family:inherit;resize:none;max-height:96px;line-height:1.35;padding:9px 2px 9px 6px}
#askInput::placeholder{color:var(--muted);font-size:15px}
#askSend{flex:0 0 auto;width:36px;height:36px;border-radius:50%;border:none;background:linear-gradient(135deg,var(--cyan),var(--violet));color:#fff;display:grid;place-items:center}
body.transitioning #askSend{opacity:.45;pointer-events:none}

@media (prefers-reduced-motion: reduce){
  .stage-bg{transition:opacity .15s}
  #room.arrive .rise{animation:none}
  #panel,#drawer{transition:none}
}

/* ================= The Opening — RESTORED from the approved original (society.css) ================= */
#entrance{position:fixed;inset:0;z-index:0;opacity:0;pointer-events:none;transition:opacity .5s ease;background:#0A0618}
body.at-entrance #entrance{opacity:1}
.eblob{position:absolute;border-radius:50%;filter:blur(60px);mix-blend-mode:screen;will-change:transform}
.e1{width:52vmax;height:52vmax;left:-14vw;top:-16vh;background:radial-gradient(circle at 50% 50%,#00F0FF,transparent 62%);opacity:.17;animation:edrift1 26s ease-in-out infinite alternate}
.e2{width:58vmax;height:58vmax;right:-16vw;top:6vh;background:radial-gradient(circle at 50% 50%,#2878FF,transparent 62%);opacity:.21;animation:edrift2 32s ease-in-out infinite alternate}
.e3{width:72vmax;height:72vmax;left:6vw;top:16vh;background:radial-gradient(circle at 50% 50%,#9747FF,transparent 62%);opacity:.46;animation:edrift1 38s ease-in-out infinite alternate-reverse}
.e4{width:46vmax;height:46vmax;right:-5vw;bottom:-8vh;background:radial-gradient(circle at 50% 50%,#FF149D,transparent 62%);opacity:.30;animation:edrift2 44s ease-in-out infinite alternate-reverse}
.e5{width:34vmax;height:34vmax;left:44vw;top:34vh;background:radial-gradient(circle at 50% 50%,#32FFC8,transparent 62%);opacity:.13;animation:edrift1 48s ease-in-out infinite alternate}
.spot{position:absolute;left:50%;top:-14vh;transform:translateX(-50%);width:min(92vw,460px);height:78vh;background:radial-gradient(ellipse 52% 44% at 50% 36%,rgba(255,246,224,.38),rgba(186,216,255,.14) 44%,transparent 70%);filter:blur(8px);pointer-events:none}
@keyframes edrift1{from{transform:translate(0,0) scale(1)}to{transform:translate(4vw,3vh) scale(1.08)}}
@keyframes edrift2{from{transform:translate(0,0) scale(1.05)}to{transform:translate(-3vw,-2vh) scale(.97)}}
#flare{position:absolute;left:50%;top:32%;width:64vmin;height:64vmin;transform:translate(-50%,-50%) scale(.35);border-radius:50%;opacity:0;background:radial-gradient(closest-side,rgba(255,255,255,.95),rgba(150,230,255,.45) 55%,rgba(255,255,255,0) 72%)}
body.flare-on #flare{animation:flarePulse .5s ease-out}
@keyframes flarePulse{0%{opacity:0;transform:translate(-50%,-50%) scale(.35)}35%{opacity:.95}100%{opacity:0;transform:translate(-50%,-50%) scale(1.45)}}
.brandbar{position:absolute;top:calc(18px + env(safe-area-inset-top));left:20px;font-family:'Outfit',var(--font-d);font-weight:700;font-size:12.5px;letter-spacing:.34em;color:#F7FAFF}
.crave-core{position:absolute;left:0;right:0;top:12.5vh;display:flex;flex-direction:column;align-items:center}
.sculpt-wrap{position:relative;height:min(29.5vh,272px);text-align:center}
.sculpt-halo{position:absolute;left:50%;top:46%;width:250px;height:250px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(205,170,255,.34),rgba(120,220,255,.12) 46%,transparent 68%);filter:blur(6px);animation:haloBreath 6s ease-in-out infinite}
@keyframes haloBreath{0%,100%{opacity:.85;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.06)}}
.sculpt{position:relative;height:100%;width:auto;aspect-ratio:1/1;filter:saturate(1.16) contrast(1.07);animation:sculptFloat 7.5s ease-in-out infinite;will-change:transform}
.rot-stack{position:absolute;inset:0;animation:sculptFloat 7.5s ease-in-out infinite;will-change:transform}
.rot{position:absolute;left:50%;top:0;height:100%;width:auto;aspect-ratio:540/1241;transform:translateX(-50%);filter:saturate(1.16) contrast(1.07);opacity:0}
.rot.f0{opacity:1}
.rot.f1{animation-delay:2.5s}.rot.f2{animation-delay:5s}.rot.f3{animation-delay:7.5s}
@keyframes coneX{0%{opacity:0}4%{opacity:1}25%{opacity:1}29%{opacity:0}100%{opacity:0}}
@media (prefers-reduced-motion: no-preference){ .rot{animation-name:coneX;animation-duration:10s;animation-timing-function:linear;animation-iteration-count:infinite} }
@media (prefers-reduced-motion: reduce){ .rot-stack{animation:none} }
@keyframes sculptFloat{0%,100%{transform:translateY(-5px)}50%{transform:translateY(6px)}}
.sculpt-shadow{position:absolute;left:50%;bottom:-4px;width:110px;height:16px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(ellipse,rgba(0,0,0,.75),transparent 70%);animation:shadowPulse 7.5s ease-in-out infinite}
@keyframes shadowPulse{0%,100%{transform:translateX(-50%) scaleX(1);opacity:.9}50%{transform:translateX(-50%) scaleX(.86);opacity:.7}}
.craving{font-family:'Outfit',var(--font-d);font-weight:800;font-size:clamp(36px,9.4vw,56px);line-height:1.04;color:#F7FAFF;letter-spacing:-.015em;text-shadow:0 0 34px rgba(0,229,255,.28),0 4px 30px rgba(36,107,255,.35);margin-top:5.6vh;text-align:center;padding:0 16px}
/* the original crave bar + fixed util-position menu button */
#ask{background:#080B14;border:1px solid rgba(0,229,255,.28);border-radius:99px;padding:8px;box-shadow:0 0 0 1px rgba(133,77,255,.12),0 16px 44px rgba(0,0,0,.6),0 0 26px rgba(0,229,255,.07);align-items:center;gap:10px}
#askInput{padding:6px 6px 6px 14px;font-weight:600;line-height:1.25;white-space:nowrap;overflow:hidden}
#askInput::placeholder{color:#98A0BE;font-size:14.5px}
#askSend{width:46px;height:46px;flex:0 0 auto;border-radius:50%;border:none;background:linear-gradient(135deg,#00E5FF,#246BFF);color:#02141F;font-size:20px;font-weight:800;box-shadow:none}
#menuBtn{position:fixed;top:calc(14px + env(safe-area-inset-top));right:16px;z-index:63;width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.4);background:rgba(16,8,34,.55);color:#FBF4E8;font-size:17px}
/* starter chips + disclosure — welcome screen only */
#starterBar{display:none}
body[data-room="welcome"] #starterBar{display:block}
.idle-chips{display:flex;gap:9px;justify-content:center;flex-wrap:wrap;margin-top:14px;padding:0 4px}
.hchip{background:rgba(8,11,20,.66);border:1px solid rgba(166,178,201,.34);color:#E8EEFA;border-radius:99px;padding:10px 16px;font-size:13.5px;font-family:var(--font-d);min-height:44px;cursor:pointer}
.shell-disc{margin:12px 0 2px;text-align:center;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:rgba(166,178,201,.5)}

/* ================= depth + transition upgrades ================= */
#depthfx{position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(120% 90% at 50% 42%,rgba(0,0,0,0) 55%,rgba(3,4,12,.42) 100%),linear-gradient(115deg,rgba(255,255,255,.075),rgba(255,255,255,0) 42%);transition:opacity .5s}
body.at-entrance #depthfx{opacity:0}
.stage-bg.arrive-settle{animation:bgSettle .95s cubic-bezier(.22,.8,.3,1)}
@keyframes bgSettle{from{transform:scale(1.07)}to{transform:scale(1)}}
.ribbon{position:absolute;left:-25%;width:150%;height:15vh;opacity:0;transform:skewY(-7deg);will-change:transform,opacity}
.ribbon.r1{top:26%;background:linear-gradient(90deg,transparent,rgba(0,223,255,.20),rgba(160,240,255,.34),transparent)}
.ribbon.r2{top:56%;background:linear-gradient(90deg,transparent,rgba(255,92,200,.16),rgba(190,140,255,.26),transparent);transform:skewY(-7deg)}
#veil.phase-b .ribbon.r1{animation:ribbonL var(--tb,400ms) ease forwards}
#veil.phase-b .ribbon.r2{animation:ribbonR var(--tb,400ms) ease .06s forwards}
@keyframes ribbonL{0%{transform:translateX(-32%) skewY(-7deg);opacity:0}30%{opacity:1}100%{transform:translateX(30%) skewY(-7deg);opacity:0}}
@keyframes ribbonR{0%{transform:translateX(32%) skewY(-7deg);opacity:0}30%{opacity:1}100%{transform:translateX(-30%) skewY(-7deg);opacity:0}}

/* ================= Gallery exhibit rail ================= */
.featured-frame{-webkit-box-reflect:below 4px linear-gradient(transparent 68%,rgba(255,255,255,.13))}
.rail-wrap{position:absolute;left:12px;right:12px;bottom:calc(102px + env(safe-area-inset-bottom));background:rgba(9,13,34,.66);border:1px solid rgba(140,170,255,.18);border-radius:18px;padding:8px 10px 10px;backdrop-filter:none}
.rail-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:0 2px 7px}
.rail-head .rh-l{font-family:var(--font-d);font-size:11px;letter-spacing:.20em;text-transform:uppercase;color:var(--cyan)}
.rail-head button{background:none;border:none;color:var(--gold);font-family:var(--font-d);font-size:12px;padding:2px 4px}
.rail{display:flex;gap:9px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.rail::-webkit-scrollbar{display:none}
.exhibit{flex:0 0 auto;width:62px;display:flex;flex-direction:column;align-items:center;gap:4px;background:none;border:none;padding:3px 2px;border-radius:12px;color:var(--muted)}
.exhibit img{width:52px;height:52px;border-radius:12px;object-fit:cover;border:1px solid rgba(140,170,255,.22)}
.exhibit span{font-size:9.5px;line-height:1.15;text-align:center;font-family:var(--font-d);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.exhibit[aria-current="true"]{color:var(--text)}
.exhibit[aria-current="true"] img{border-color:var(--cyan);box-shadow:0 0 0 2px rgba(0,223,255,.45),0 6px 18px rgba(0,0,0,.4)}
@media (max-height:740px){ .featured-frame{width:min(58vw,320px)} .caption p{display:-webkit-box;-webkit-line-clamp:1} }

@media (max-width:430px){ .craving{font-size:33px} .idle-chips{flex-wrap:nowrap;gap:7px} .hchip{padding:10px 12px;font-size:12.5px;white-space:nowrap} }

/* ================= Concierge Planner (Phases B+C) ================= */
.pkg-cards{display:grid;gap:10px}
.pkg-card{display:block;width:100%;text-align:left;background:rgba(16,22,52,.72);border:1px solid rgba(140,170,255,.22);border-radius:16px;padding:13px 14px;color:var(--text);cursor:pointer}
.pkg-card .pkg-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.pkg-card h3,.pkg-card b{font-family:var(--font-d);font-size:16.5px}
.pkg-card .per{display:block;color:var(--gold);font-family:var(--font-d);font-size:13px;margin-top:2px}
.pkg-card .pkg-line{display:block;color:var(--muted);font-size:13px;line-height:1.45;margin-top:5px}
.pkg-card .total{display:block;margin-top:8px;font-family:var(--font-d);color:var(--cyan);font-size:14px}
.pkg-card.selected{border-color:var(--cyan);box-shadow:0 0 0 2px rgba(0,223,255,.45),0 10px 26px rgba(0,0,0,.35)}
.pkg-badge{font-family:var(--font-d);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:#02141F;background:linear-gradient(135deg,#00E5FF,#7DD3FF);border-radius:99px;padding:3px 9px}
.q-prog{font-family:var(--font-d);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan);margin:0 0 8px}
.q-prompt{font-family:var(--font-d);font-size:19px;line-height:1.3;margin:0 0 14px;color:var(--text)}
.q-choices{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:6px}
.q-chip{background:rgba(20,28,64,.8);border:1px solid rgba(140,170,255,.35);color:var(--text);border-radius:99px;padding:10px 15px;font-size:14px;font-family:var(--font-d);min-height:44px;cursor:pointer}
.q-chip.ghost{background:transparent;border-style:dashed;color:var(--muted)}
.q-chip.toggle.on{border-color:var(--cyan);background:rgba(0,223,255,.16);box-shadow:0 0 0 1px rgba(0,223,255,.5)}
.q-ctls{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;border-top:1px solid rgba(140,170,255,.14);padding-top:12px}
.q-ctls button{background:none;border:1px solid rgba(140,170,255,.25);color:var(--muted);border-radius:99px;padding:8px 13px;font-size:13px;min-height:40px;cursor:pointer}
.q-ctls button:disabled{opacity:.35}
.q-count{font-size:12px;color:var(--muted);margin:10px 0 0}
.pv-sec{border:1px solid rgba(140,170,255,.16);border-radius:14px;padding:11px 13px;margin-bottom:10px;background:rgba(12,18,44,.5)}
.pv-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.pv-head h3{font-family:var(--font-d);font-size:15px;margin:0}
.pv-edit{background:none;border:1px solid rgba(0,223,255,.4);color:var(--cyan);border-radius:99px;padding:5px 12px;font-size:12.5px;font-family:var(--font-d);cursor:pointer}
.pv-row{display:flex;justify-content:space-between;gap:14px;margin:4px 0;font-size:13.5px}
.pv-row span{color:var(--muted);flex:0 0 auto}
.pv-row b{color:var(--text);text-align:right;font-weight:600}
.pv-row.dim{color:var(--muted);display:block}
.pv-row.total{border-top:1px solid rgba(140,170,255,.2);padding-top:7px;margin-top:8px}
.pv-row.total b{color:var(--gold)}
.pv-est{border:1px solid rgba(255,209,102,.3);border-radius:14px;padding:11px 13px;margin-bottom:10px;background:rgba(24,20,8,.35)}
.pv-est h3{font-family:var(--font-d);font-size:15px;margin:0 0 6px}
.pv-est h4{font-family:var(--font-d);font-size:12.5px;color:var(--gold);margin:12px 0 4px}
.pv-out{font-size:12.5px;color:var(--muted)}
.pv-sent{font-size:13.5px;color:var(--text);background:rgba(0,223,255,.08);border:1px solid rgba(0,223,255,.3);border-radius:12px;padding:10px 12px}
.plan-done h3{font-family:var(--font-d);font-size:19px;margin:0 0 8px}
.resume-pill{display:inline-block;margin-top:12px;background:rgba(0,223,255,.1);border:1px solid rgba(0,223,255,.45);color:var(--cyan);border-radius:99px;padding:9px 15px;font-family:var(--font-d);font-size:13.5px;cursor:pointer}
.pv-row .pv-none{color:var(--muted);font-style:normal;text-align:right;flex:1}
.pv-row .pv-edit{flex:0 0 auto}

/* ================= Five-Stage Planning Sheet (Gate 3 UX) ================= */
/* the chat dock is NEVER hidden — chat access is always available, panels included */
.stg-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px}
.stg-step{font-family:var(--font-d);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan)}
.stg-tools{display:flex;gap:6px}
.mini-btn{background:none;border:1px solid rgba(0,223,255,.4);color:var(--cyan);border-radius:99px;padding:6px 12px;font-size:12.5px;font-family:var(--font-d);cursor:pointer;min-height:36px}
.segs{display:flex;gap:5px;margin-bottom:12px}
.seg{flex:1;height:4px;border-radius:99px;background:rgba(140,170,255,.18)}
.seg.on{background:linear-gradient(90deg,#00E5FF,#7DD3FF)}
.stg-intro{font-size:15px;line-height:1.5;color:var(--text);margin:0 0 14px}
.ack-line{font-size:13.5px;color:var(--cyan);background:rgba(0,223,255,.08);border:1px solid rgba(0,223,255,.25);border-radius:10px;padding:8px 11px;margin:0 0 12px;min-height:40px}
.ack-line.ack-empty{background:transparent;border-color:transparent}
.fld{margin-bottom:16px}
.fld-label{display:block;font-family:var(--font-d);font-size:13px;letter-spacing:.06em;color:var(--text);margin-bottom:8px}
.fld-label em{color:var(--muted);font-style:normal;font-size:12px}
.fld-label.sub-label{margin-top:10px}
.fld-note{font-size:12.5px;color:var(--muted);line-height:1.45;margin:8px 0 0}
.fld-note b{color:var(--text)}
.chiprow{display:flex;flex-wrap:wrap;gap:8px}
.q-chip.on{border-color:var(--cyan);background:rgba(0,223,255,.16);box-shadow:0 0 0 1px rgba(0,223,255,.5)}
.txt-input{width:100%;box-sizing:border-box;background:rgba(10,14,36,.85);border:1px solid rgba(140,170,255,.35);border-radius:12px;color:var(--text);font-size:16px;padding:12px 13px;font-family:var(--font-b,inherit)}
.txt-input:focus{outline:2px solid rgba(0,223,255,.6);border-color:var(--cyan)}
textarea.txt-input{resize:vertical;min-height:56px}
.stepper{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.stepper button{width:46px;height:46px;border-radius:50%;border:1px solid rgba(0,223,255,.45);background:rgba(0,223,255,.08);color:var(--cyan);font-size:22px;cursor:pointer}
.stepper input{width:90px;text-align:center;background:rgba(10,14,36,.85);border:1px solid rgba(140,170,255,.35);border-radius:12px;color:var(--text);font-size:18px;padding:11px 6px;font-family:var(--font-d)}
.sayit{display:flex;gap:8px}
.sayit .txt-input{flex:1}
.btn.small{padding:10px 14px;min-height:46px}
.btn.ghost-b{background:none;border:1px solid rgba(140,170,255,.35);color:var(--muted)}
.btn.ghost-b:disabled{opacity:.35}
.flav-grid .q-chip{font-size:13px;padding:9px 12px;min-height:42px}
.chip-price{color:var(--gold);font-size:11.5px;margin-left:4px}
.stg-foot{position:sticky;bottom:0;display:flex;gap:8px;flex-wrap:wrap;background:linear-gradient(180deg,rgba(8,11,26,0),rgba(8,11,26,.96) 30%);padding:14px 0 4px;margin-top:6px}
.stg-foot .btn{flex:1;min-height:48px}
.stg-foot #plNext{flex:1.6}

/* ---------- Phase 5: architectural assembly ---------- */
#assembly{position:fixed;inset:0;z-index:40;pointer-events:none;opacity:0}
#assembly.on{opacity:1}
#assembly.off{opacity:0;transition:opacity .5s ease}
.asm-base{position:absolute;inset:0;background:#04060f}
.asm-traces{position:absolute;inset:0;width:100%;height:100%;opacity:0}
.asm-traces path{fill:none;stroke:rgba(110,240,255,.85);stroke-width:2.5;stroke-dasharray:100;stroke-dashoffset:100;filter:drop-shadow(0 0 6px rgba(110,240,255,.8))}
#assembly.on .asm-traces{opacity:1}
#assembly.on .asm-traces path{animation:asmDraw .9s ease forwards}
#assembly.on .asm-traces path:nth-child(2){animation-delay:.18s}
#assembly.on .asm-traces path:nth-child(3){animation-delay:.34s}
@keyframes asmDraw{to{stroke-dashoffset:0}}
.asm-slice{position:absolute;overflow:hidden;opacity:0}
.asm-slice i{position:absolute;display:block;background:url('/img/env/hall-asm.webp') center 16%/cover no-repeat}
#assembly.on .asm-floor{animation:asmFloor 1s .45s cubic-bezier(.2,.8,.3,1) both}
#assembly.on .asm-wallL{animation:asmWallL 1s .8s cubic-bezier(.2,.8,.3,1) both}
#assembly.on .asm-wallR{animation:asmWallR 1s .95s cubic-bezier(.2,.8,.3,1) both}
#assembly.on .asm-ceil{animation:asmCeil .95s 1.15s cubic-bezier(.2,.8,.3,1) both}
@keyframes asmFloor{0%{opacity:0;transform:translateY(36%);filter:brightness(.3)}55%{opacity:1}78%{filter:brightness(1.35)}100%{opacity:1;transform:translateY(0);filter:brightness(1)}}
@keyframes asmWallL{0%{opacity:0;transform:translateX(-27%);filter:brightness(.3)}55%{opacity:1}78%{filter:brightness(1.3)}100%{opacity:1;transform:translateX(0);filter:brightness(1)}}
@keyframes asmWallR{0%{opacity:0;transform:translateX(27%);filter:brightness(.3)}55%{opacity:1}78%{filter:brightness(1.3)}100%{opacity:1;transform:translateX(0);filter:brightness(1)}}
@keyframes asmCeil{0%{opacity:0;transform:translateY(-58%);filter:brightness(.3)}55%{opacity:1}78%{filter:brightness(1.3)}100%{opacity:1;transform:translateY(0);filter:brightness(1)}}
.asm-mist{position:absolute;left:-32%;bottom:-5%;width:168%;opacity:0;mix-blend-mode:screen;pointer-events:none}
#assembly.on .asm-mist{animation:asmMist 1.2s 1.78s ease-in-out both}
@keyframes asmMist{0%{opacity:0;transform:translateX(-5%)}35%{opacity:.9}100%{opacity:0;transform:translateX(12%)}}
.asm-flash{position:absolute;inset:0;background:radial-gradient(62% 46% at 50% 42%,rgba(170,240,255,.5),transparent 70%);opacity:0;pointer-events:none}
#assembly.on .asm-flash{animation:asmFlash .9s 1.95s ease both}
@keyframes asmFlash{0%{opacity:0}40%{opacity:.55}100%{opacity:0}}

/* ---------- Phase 5: robotic tray service ---------- */
.svc-bay{position:absolute;inset:0;z-index:6;opacity:0;pointer-events:none;transition:opacity .35s ease;overflow:hidden;background:#05070f}
.svc-video,.svc-still{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%;display:none}
.svc-bay.has-video .svc-video{display:block}
.svc-bay:not(.has-video) .svc-still{display:block}
.svc-bay.on{opacity:1;pointer-events:none}
.svc-bay.on .svc-video,.svc-bay.on .svc-still{object-position:50% 58%}
.svc-bay .svc-close{pointer-events:auto}
.svc-armwrap{position:absolute;inset:0;transform:translateY(60%);-webkit-mask-image:linear-gradient(180deg,#000 80%,transparent 99%);mask-image:linear-gradient(180deg,#000 80%,transparent 99%);transition:transform .85s cubic-bezier(.22,.9,.26,1)}
.svc-bay.presented .svc-armwrap{transform:translateY(0)}
.svc-bay.exchanging .svc-armwrap{transform:translateY(19%);transition:transform .38s ease}
.svc-bay.leaving .svc-armwrap{transform:translateY(60%);transition:transform .45s ease}
.svc-armimg{position:absolute;inset:0;width:100%;height:100%}
.svc-foreimg{position:absolute;left:28%;top:10%;width:72%;height:36%;transform-origin:4.2% 44%;transform:rotate(-5deg);transition:transform .8s cubic-bezier(.3,.8,.3,1) .12s}
.svc-bay.presented .svc-foreimg{transform:rotate(0deg)}
.svc-bay.exchanging .svc-foreimg{transform:rotate(-3.5deg);transition:transform .38s ease}
.svc-dessert{position:absolute;left:69%;top:-1%;width:27%;opacity:0;transform:scale(.92);transition:opacity .45s ease .18s,transform .5s ease .18s;filter:drop-shadow(0 10px 14px rgba(0,0,0,.45))}
.svc-bay.presented .svc-dessert{opacity:1;transform:scale(1)}
.svc-bay.exchanging .svc-dessert{opacity:0;transition:opacity .3s ease}
.svc-trayglow{position:absolute;left:70.5%;top:22.8%;width:24%;height:5%;background:radial-gradient(50% 50% at 50% 50%,rgba(120,240,255,.75),rgba(150,110,255,.25) 60%,transparent 75%);filter:blur(3px);opacity:0;transition:opacity .5s ease .3s}
.svc-bay.presented .svc-trayglow{opacity:.85}
.svc-counter{position:absolute;left:2%;right:2%;bottom:-3.5%;height:15%;z-index:3;background:linear-gradient(180deg,#232c4d,#0a0d1e 70%);border-top:1px solid rgba(150,190,255,.35);border-radius:10px 10px 14px 14px;box-shadow:0 -6px 24px rgba(90,160,255,.16),0 18px 30px rgba(0,0,0,.5)}
.svc-bay.on .svc-counter{border-top-color:rgba(140,240,255,.85);box-shadow:0 -6px 28px rgba(110,220,255,.35),0 18px 30px rgba(0,0,0,.5)}
.svc-glow{position:absolute;top:10%;right:1%;width:48%;height:36%;z-index:2;background:radial-gradient(closest-side,rgba(255,196,110,.45),rgba(255,170,80,.13) 55%,transparent 72%);opacity:0;transition:opacity .13s ease;pointer-events:none;mix-blend-mode:screen}
.svc-glow.on{opacity:1}
.svc-close{position:absolute;top:12px;right:12px;z-index:5;width:34px;height:34px;border-radius:50%;border:1px solid rgba(160,190,255,.4);background:rgba(10,14,30,.72);color:#dfe8ff;font-size:15px;line-height:1;cursor:pointer;opacity:0;transition:opacity .3s ease .4s}
.svc-bay.presented .svc-close{opacity:1}
.svc-tag{position:absolute;top:12px;left:12px;z-index:5;margin:0;padding:6px 10px;border-radius:999px;background:rgba(8,12,28,.66);border:1px solid rgba(150,190,255,.3);color:#cfe0ff;font-size:11px;letter-spacing:.08em;opacity:0;transition:opacity .4s ease .35s}
.svc-tag b{color:#ffd98a}
.svc-bay.presented .svc-tag{opacity:1}
body.serving .featured-frame{transform:scale(.93);filter:brightness(.48) saturate(.75);transition:transform .5s ease,filter .5s ease}
body.serving .featured-stage .counter{opacity:.3}
.svc-line{color:#ffd98a;font-size:12.5px;margin-top:6px}
@media (prefers-reduced-motion: reduce){
  .svc-armwrap,.svc-foreimg,.svc-dessert,.svc-trayglow,.svc-close,.svc-tag{transition:none}
}

/* ---------- The Rising Masterpiece overlay ---------- */
#risingIntro{position:fixed;inset:0;z-index:120;background:#05060a;transition:opacity .35s ease}
#risingIntro.out{opacity:0;pointer-events:none}
#risingIntro video{width:100%;height:100%;object-fit:cover;display:block}
#risingIntro .rise-skip{position:absolute;right:16px;bottom:calc(18px + env(safe-area-inset-bottom));background:rgba(10,12,20,.55);color:#e8e2d2;border:1px solid rgba(255,255,255,.28);border-radius:999px;padding:11px 20px;font:600 14px var(--font-d);cursor:pointer;backdrop-filter:blur(6px)}

/* ===== Cake Atelier V2 — Gallery of Three Masterpieces (integrated) ===== */
.ck2-stage{background:#07060e}
.ck2-track{position:absolute;inset:0;display:flex;height:100%}
.ck2-bay{position:relative;flex:0 0 auto;height:100%;overflow:hidden;background:#0a0a18;margin:0;cursor:pointer}
.ck2-bay img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 60%;display:block}
.ck2-bay[data-bay="petite"] img{transform:scale(1.14);transform-origin:50% 66%}
.ck2-bay.dim img{filter:brightness(.6) saturate(.8)}
.ck2-tag{position:absolute;left:50%;transform:translateX(-50%);bottom:12px;background:rgba(5,6,14,.72);border:1px solid rgba(216,164,65,.28);color:#f2ead8;border-radius:999px;padding:6px 14px;font-size:.78rem;letter-spacing:.05em;white-space:nowrap;pointer-events:none}
.ck2-bay.sel .ck2-tag{border-color:#d8a441;color:#ffd98a}
.vs-room{display:flex;flex-direction:column;gap:12px;min-height:calc(100svh - 196px)}
.vs-sub{color:#d5dcee;line-height:1.55;max-width:36ch;text-shadow:0 2px 16px rgba(0,0,0,.75);margin:6px 0 0}
.vs-sheet{border-radius:20px;padding:16px 18px;margin-top:auto;margin-bottom:14px}
.vs-row{display:flex;gap:10px;align-items:baseline;margin:7px 0}
.vs-row .vs-flabel{flex:0 0 88px}
.vs-row>span:last-child{color:#ccd4e6;line-height:1.45}
.vs-row b{color:#f5efdd}
.vs-scene{margin:0 0 14px;border-radius:20px;overflow:hidden;border:1px solid rgba(190,160,255,.22);box-shadow:0 24px 60px rgba(0,0,0,.5)}
.vs-scene img{display:block;width:100%;height:min(36vh,300px);object-fit:cover;object-position:50% 64%}
.vs-card{border-radius:20px;padding:18px;margin-bottom:18px}
.vs-lede{color:#dfe4f2;line-height:1.55;margin:2px 0 6px}
.vs-facts{display:grid;gap:12px;margin:12px 0 4px}
.vs-fact{display:grid;gap:2px}
.vs-fact b{color:#f5efdd}
.vs-fact span{color:#b9c1d6;line-height:1.5}
.vs-flabel{letter-spacing:.14em;font-size:11px;color:#5eeaff;text-transform:uppercase}
.vs-asks{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 6px}
.vs-form-title{color:#ffe9b0;font-weight:600;margin:14px 0 10px}
.vs-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.vs-grid label{display:flex;flex-direction:column;gap:5px;font-size:12.5px;color:#c9cfdf}
.vs-grid label.full{grid-column:1/-1}
.vs-grid select.txt-input{appearance:none}
@media (max-width:560px){.vs-grid{grid-template-columns:1fr}}
.vs-consent{font-size:11.5px;color:#8fa3cc;line-height:1.5;margin:10px 0}
.vs-err{color:#ff9db0;font-size:13px;margin:6px 0}
.vs-done{padding:8px 0 2px}
.vs-done-t{font-size:1.05rem;color:#ffe9b0;margin:0 0 4px}
.vs-ref{color:#5eeaff;margin:0 0 6px}
.vs-done-s{color:#b9c1d6;margin:0;line-height:1.5}
.ck-seg-btn img{object-fit:cover;object-position:50% 62%}