:root { color-scheme: dark; --gold:#d8ad63; --ivory:#f5ead3; --ink:#080604; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--ink); }
body { margin:0; min-width:320px; overflow-x:hidden; background:#050403; color:var(--ivory); font-family:"Cormorant Garamond",Georgia,serif; }
button,a { -webkit-tap-highlight-color:transparent; }
.welcome { position:fixed; z-index:300; inset:0; display:grid; place-items:center; padding:24px; overflow:hidden; background:#050302; opacity:1; visibility:visible; transition:opacity 1.1s ease,visibility 1.1s; }
.welcome.is-entered { opacity:0; visibility:hidden; pointer-events:none; }
.welcome__veil { position:absolute; inset:0; background:linear-gradient(rgba(5,3,2,.34),rgba(5,3,2,.85)),url("assets/aodai-site-map-clean.png") center/cover; filter:blur(3px) saturate(.85); transform:scale(1.04); }
.welcome__veil::after { content:""; position:absolute; inset:0; background:radial-gradient(circle at 50% 45%,rgba(158,62,18,.1),rgba(0,0,0,.78) 70%); }
.welcome__content { position:relative; width:min(720px,92vw); padding:clamp(36px,6vw,72px); text-align:center; border:1px solid rgba(220,176,95,.47); background:rgba(7,5,3,.72); box-shadow:0 35px 100px #000,inset 0 0 80px rgba(169,77,21,.1); backdrop-filter:blur(11px); }
.welcome__content::before { content:""; position:absolute; inset:10px; border:1px solid rgba(218,173,91,.14); }
.welcome__content>p:first-child { margin:0 0 12px; color:#d9ad63; font:500 11px Cinzel,serif; letter-spacing:.26em; text-transform:uppercase; }
.welcome h1 { margin:0; color:#f4d69a; font:500 clamp(43px,8vw,82px)/.95 "Cormorant Garamond",serif; text-shadow:0 4px 30px rgba(231,123,30,.25); }
.welcome__ornament { display:block; width:130px; height:1px; margin:25px auto; background:linear-gradient(90deg,transparent,#d8ad63,transparent); box-shadow:0 0 8px rgba(255,175,55,.45); }
.welcome__invitation { margin:0 auto 25px; max-width:480px; color:rgba(249,237,214,.82); font-size:clamp(17px,2.5vw,22px); }
.welcome button { position:relative; padding:14px 26px; border:1px solid #b98843; background:linear-gradient(145deg,#641512,#2e0908); color:#f0d08f; box-shadow:0 10px 35px rgba(0,0,0,.45); font:500 11px Cinzel,serif; letter-spacing:.13em; text-transform:uppercase; cursor:pointer; transition:.25s ease; }
.welcome button:hover,.welcome button:focus-visible { transform:translateY(-2px); box-shadow:0 0 28px rgba(255,153,36,.35); filter:brightness(1.18); }
.welcome small { display:block; margin-top:13px; color:rgba(244,224,187,.54); font-size:12px; letter-spacing:.05em; }
.music-dock { position:fixed; z-index:90; left:18px; bottom:18px; width:min(360px,calc(100vw - 36px)); border:1px solid rgba(216,173,99,.44); background:rgba(8,6,4,.92); box-shadow:0 18px 55px rgba(0,0,0,.68),0 0 25px rgba(205,101,22,.11); backdrop-filter:blur(13px); opacity:0; transform:translateY(18px); pointer-events:none; transition:.45s ease; }
.music-dock.is-ready { opacity:1; transform:none; pointer-events:auto; }
.music-dock__toggle { width:100%; min-height:58px; display:flex; align-items:center; gap:12px; padding:9px 13px; border:0; background:transparent; color:#f0d397; text-align:left; cursor:pointer; }
.music-dock__toggle>span:nth-child(2) { flex:1; font:500 14px "Cormorant Garamond",serif; letter-spacing:.03em; }.music-dock__toggle small{display:block;color:#bb8b47;font:500 8px Cinzel,serif;letter-spacing:.13em;text-transform:uppercase}.music-dock__toggle b{color:#c49a59;transition:transform .3s}.music-dock.is-open .music-dock__toggle b{transform:rotate(180deg)}
.music-dock__equalizer { height:20px; display:flex; align-items:flex-end; gap:3px; }.music-dock__equalizer i{display:block;width:2px;background:#dd9f42;box-shadow:0 0 6px #ff9d23;animation:eq 1s ease-in-out infinite alternate}.music-dock__equalizer i:nth-child(1){height:40%}.music-dock__equalizer i:nth-child(2){height:100%;animation-delay:.25s}.music-dock__equalizer i:nth-child(3){height:65%;animation-delay:.5s}@keyframes eq{to{height:25%}}
.music-dock__player { display:grid; grid-template-rows:0fr; overflow:hidden; border-top:0 solid rgba(216,173,99,.2); transition:grid-template-rows .35s ease,border-width .35s; }.music-dock__player>*{min-height:0}.music-dock.is-open .music-dock__player{grid-template-rows:1fr;border-top-width:1px}.music-dock__player iframe{display:block;width:100%;height:152px;border:0}.music-dock__player>a{display:block;padding:8px 13px 10px;color:#cda968;font:500 9px Cinzel,serif;text-align:right;text-decoration:none;letter-spacing:.06em;text-transform:uppercase}
.stage { position:relative; width:100%; aspect-ratio:3/2; overflow:hidden; background:#090604; isolation:isolate; }
.site-map { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; user-select:none; pointer-events:none; transition:transform 1.4s cubic-bezier(.2,.8,.2,1),filter .5s ease; }
.stage:hover .site-map { transform:scale(1.003); filter:saturate(1.035) contrast(1.015); }
.vignette { position:absolute; inset:0; pointer-events:none; box-shadow:inset 0 0 8vw rgba(0,0,0,.22); }
.light-sweep { position:absolute; inset:-40%; pointer-events:none; opacity:.15; background:linear-gradient(112deg,transparent 40%,rgba(255,224,164,.16) 50%,transparent 60%); animation:sweep 13s ease-in-out infinite; mix-blend-mode:screen; }
@keyframes sweep { 0%,35%{transform:translateX(-35%)} 80%,100%{transform:translateX(38%)} }
.ambient-lights { position:absolute; z-index:4; inset:0; overflow:hidden; pointer-events:none; }
.ambient-lights i { position:absolute; width:clamp(2px,.32vw,5px); aspect-ratio:1; border-radius:50%; background:#ffd36f; box-shadow:0 0 10px #ff9a2e,0 0 22px rgba(255,105,20,.8); opacity:0; animation:lantern-drift 9s ease-in-out infinite; }
.ambient-lights i:nth-child(1){left:8%;top:63%;animation-delay:0s}.ambient-lights i:nth-child(2){left:18%;top:72%;animation-delay:2s}.ambient-lights i:nth-child(3){left:31%;top:62%;animation-delay:4s}.ambient-lights i:nth-child(4){left:43%;top:74%;animation-delay:1s}.ambient-lights i:nth-child(5){left:55%;top:66%;animation-delay:5s}.ambient-lights i:nth-child(6){left:68%;top:71%;animation-delay:3s}.ambient-lights i:nth-child(7){left:79%;top:64%;animation-delay:6s}.ambient-lights i:nth-child(8){left:90%;top:73%;animation-delay:2.8s}.ambient-lights i:nth-child(9){left:48%;top:38%;animation-delay:7s}.ambient-lights i:nth-child(10){left:74%;top:30%;animation-delay:4.7s}
@keyframes lantern-drift { 0%{opacity:0;transform:translate(0,18px) scale(.6)} 20%{opacity:.85} 65%{opacity:.35} 100%{opacity:0;transform:translate(22px,-72px) scale(1.35)} }
.hotspot,.hot-nav button,.cta,.feature-links button { position:absolute; display:block; background:transparent; border:0; cursor:pointer; }
.logo { left:1.5%; top:1.2%; width:11%; height:4.6%; }
.hot-nav { position:absolute; left:20.5%; top:1.2%; width:51%; height:4.5%; display:grid; grid-template-columns:.8fr 1fr 1.25fr .85fr 1.2fr 1fr 1fr .8fr; }
.hot-nav button { position:relative; }
.hot-nav button:focus-visible,.logo:focus-visible,.cta:focus-visible,.feature-links button:focus-visible,.timeline-arrow:focus-visible,.side-dots button:focus-visible { outline:2px solid var(--gold); outline-offset:-2px; border-radius:2px; }
.hot-nav button::after { content:""; position:absolute; left:18%; right:18%; bottom:0; height:1px; background:linear-gradient(90deg,transparent,#f2c878,transparent); transform:scaleX(0); transition:transform .25s ease,filter .25s; }
.hot-nav button:hover::after,.hot-nav button:focus-visible::after { transform:scaleX(1); filter:drop-shadow(0 0 5px #ffb340); }
.logo,.cta,.feature-links button,.timeline-arrow,.side-dots button { transition:filter .25s ease,box-shadow .25s ease,background .25s ease,transform .25s ease; }
.logo:hover,.logo:focus-visible { filter:drop-shadow(0 0 9px rgba(255,189,76,.9)) brightness(1.2); background:radial-gradient(ellipse,rgba(245,172,58,.12),transparent 70%); }
.cta { left:14%; top:43.2%; width:16%; height:5.2%; }
.cta:hover,.cta:focus-visible { transform:translateY(-2px); box-shadow:0 0 22px rgba(255,157,41,.38),inset 0 0 18px rgba(255,183,70,.15); background:rgba(122,34,18,.12); }
.timeline { position:absolute; z-index:5; left:3.2%; right:3.2%; top:55.2%; height:27.5%; display:grid; grid-template-columns:repeat(8,1fr); }
.era { position:relative; isolation:isolate; border:0; background:transparent; padding:0; cursor:pointer; color:transparent; }
.era span { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.era::before { content:""; position:absolute; z-index:-1; left:4%; right:4%; top:2%; bottom:0; opacity:0; background:radial-gradient(ellipse at 50% 60%,rgba(255,191,91,.34) 0%,rgba(205,82,21,.14) 34%,transparent 69%); filter:blur(5px); transform:scale(.82); transition:opacity .3s ease,transform .38s cubic-bezier(.2,.8,.2,1),filter .3s; mix-blend-mode:screen; }
.era:hover::before,.era:focus-visible::before,.era[aria-expanded="true"]::before { opacity:1; transform:scale(1.08); filter:blur(2px) saturate(1.25); }
.era::after { content:""; position:absolute; left:50%; top:8%; width:clamp(6px,.7vw,12px); aspect-ratio:1; translate:-50% -50%; border:1px solid rgba(255,235,195,.9); border-radius:50%; transition:.25s ease; }
.era:hover::after,.era:focus-visible::after,.era[aria-expanded="true"]::after { background:#a10c14; border-color:#f2ca7a; box-shadow:0 0 0 5px rgba(191,132,47,.16),0 0 18px rgba(218,166,80,.8); }
.era:focus-visible { outline:1px solid rgba(224,177,96,.72); outline-offset:-1px; }
.dress-focus { --focus-x:3.2%; --tilt-x:0deg; --tilt-y:0deg; --dress-url:none; position:absolute; z-index:16; left:var(--focus-x); top:50.8%; width:11.7%; aspect-ratio:3/4; opacity:0; pointer-events:none; perspective:1000px; transform:translateY(6%) scale(.88) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)); transform-origin:50% 78%; transition:left .3s ease,opacity .25s ease,transform .4s cubic-bezier(.17,.84,.24,1),filter .35s; }
.dress-rotator { position:absolute; inset:0; transform-style:preserve-3d; animation:dress-turn 10s cubic-bezier(.45,.05,.55,.95) infinite; }
.dress-face { position:absolute; inset:0; overflow:hidden; border-radius:48% 48% 8% 8%/12% 12% 5% 5%; background-image:var(--dress-url); background-repeat:no-repeat; background-size:200% 100%; backface-visibility:hidden; -webkit-backface-visibility:hidden; }
.dress-face--front { background-position:left center; }.dress-face--back { background-position:right center; transform:rotateY(180deg); }
.dress-focus.is-visible { opacity:1; transform:translateY(-9%) scale(1.18) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)); filter:brightness(1.12) saturate(1.12) drop-shadow(0 22px 18px rgba(0,0,0,.72)) drop-shadow(0 0 12px rgba(213,34,25,.72)) drop-shadow(0 0 28px rgba(255,185,60,.92)); }
@keyframes dress-turn { 0%,36%{transform:rotateY(0deg)} 48%,84%{transform:rotateY(180deg)} 96%,100%{transform:rotateY(360deg)} }
.era-card { --card-x:2%; position:absolute; z-index:20; left:var(--card-x); top:auto; bottom:.55%; width:17%; height:14.2%; min-height:0; overflow:hidden; padding:.72% .95%; border:1px solid rgba(244,197,105,.92); outline:1px solid rgba(125,12,13,.62); outline-offset:4px; background:radial-gradient(circle at 84% 12%,rgba(145,15,16,.24),transparent 35%),linear-gradient(145deg,rgba(31,12,8,.98),rgba(4,3,3,.97)); box-shadow:0 20px 55px rgba(0,0,0,.72),0 0 14px rgba(237,30,24,.28),0 0 32px rgba(244,164,45,.3),inset 0 0 30px rgba(156,19,15,.18),inset 0 0 0 1px rgba(255,222,144,.08); opacity:0; transform:translateY(10px) scale(.95); pointer-events:none; transition:opacity .22s ease,transform .34s cubic-bezier(.17,.84,.24,1),left .28s ease,box-shadow .3s ease; backdrop-filter:blur(10px); }
.era-card::marker{display:none}
.era-card:after { filter:drop-shadow(0 0 5px #ffad32); }
.era-card::before,.era-card::after { content:"✦"; position:absolute; color:var(--gold); font-size:clamp(6px,.65vw,11px); line-height:1; }
.era-card::before { left:-3px; top:-5px; }.era-card::after { right:-3px; bottom:-5px; }
.era-card.is-visible { opacity:1; transform:none; pointer-events:auto; animation:card-aura 2.4s ease-in-out infinite alternate; }
.era-card.is-visible:hover { box-shadow:0 22px 60px rgba(0,0,0,.76),0 0 19px rgba(237,32,27,.52),0 0 44px rgba(255,179,56,.54),inset 0 0 38px rgba(168,21,16,.23); }
@keyframes card-aura { from { outline-color:rgba(119,11,13,.52); box-shadow:0 20px 55px rgba(0,0,0,.72),0 0 12px rgba(215,28,22,.26),0 0 26px rgba(229,147,37,.27),inset 0 0 28px rgba(149,18,15,.15); } to { outline-color:rgba(191,32,25,.78); box-shadow:0 22px 58px rgba(0,0,0,.75),0 0 18px rgba(238,38,27,.42),0 0 42px rgba(255,183,62,.46),inset 0 0 36px rgba(169,23,17,.21); } }
.era-card.is-visible::before { animation:corner-pulse 1.8s ease-in-out infinite alternate; }
@keyframes corner-pulse { to { color:#ffe4a3; filter:drop-shadow(0 0 8px #ff9d24); } }
.era-card__period { margin:0 0 2%; color:#e5b85e; font-family:Cinzel,serif; font-size:clamp(6px,.62vw,11px); letter-spacing:.07em; text-transform:uppercase; text-shadow:0 0 9px rgba(255,166,50,.45); }
.era-card h2 { margin:0 0 2%; color:#ffe0a0; font-family:Cinzel,serif; font-size:clamp(9px,.86vw,15px); font-weight:500; text-shadow:0 0 12px rgba(221,76,24,.38); }
.era-card>p:last-of-type { margin:0; color:rgba(255,247,232,.88); font-size:clamp(7px,.67vw,12px); line-height:1.25; }
.era-card button { margin-top:3%; padding:0; border:0; background:transparent; color:var(--gold); font-family:Cinzel,serif; font-size:clamp(6px,.58vw,10px); letter-spacing:.07em; text-transform:uppercase; cursor:pointer; }
.era-card button:hover { color:#ffe0a3; }
.settings-gear { position:fixed; z-index:92; right:18px; bottom:18px; width:54px; height:54px; border:1px solid rgba(229,183,91,.78); border-radius:50%; background:radial-gradient(circle at 35% 30%,#6d1b14,#180807 70%); color:#f0cb83; box-shadow:0 12px 35px rgba(0,0,0,.68),0 0 18px rgba(212,41,24,.32),0 0 29px rgba(238,161,48,.24); font:27px/1 Georgia,serif; cursor:pointer; transition:.3s ease; }.settings-gear:hover,.settings-gear:focus-visible{transform:rotate(30deg) scale(1.08);box-shadow:0 15px 40px #000,0 0 24px rgba(231,49,27,.46),0 0 38px rgba(255,181,57,.4)}
.settings-panel { position:fixed; z-index:91; right:18px; bottom:84px; width:min(360px,calc(100vw - 36px)); padding:0; border:1px solid rgba(224,176,87,.66); outline:1px solid rgba(126,15,14,.55); outline-offset:3px; background:linear-gradient(145deg,rgba(24,10,7,.98),rgba(5,4,3,.99)); box-shadow:0 28px 75px rgba(0,0,0,.82),0 0 24px rgba(194,31,22,.28),0 0 42px rgba(237,157,42,.2); opacity:0; visibility:hidden; transform:translateY(16px) scale(.97); transform-origin:bottom right; transition:.3s ease; backdrop-filter:blur(15px); }.settings-panel.is-open{opacity:1;visibility:visible;transform:none}.settings-panel>header{display:flex;align-items:center;justify-content:space-between;padding:15px 17px;border-bottom:1px solid rgba(213,165,79,.24)}.settings-panel header small{display:block;color:#b48745;font:500 8px Cinzel,serif;letter-spacing:.15em;text-transform:uppercase}.settings-panel header strong{display:block;color:#f0d095;font:500 23px "Cormorant Garamond",serif}.settings-panel header button{width:34px;height:34px;border:0;background:transparent;color:#dfb76c;font:27px/1 Georgia,serif;cursor:pointer}
.settings-panel[hidden] { display:none!important; }
.settings-media{padding:15px 17px 18px}.settings-media>p:first-child{display:flex;align-items:center;gap:8px;margin:0 0 11px;color:#d6ad64;font:500 9px Cinzel,serif;letter-spacing:.1em;text-transform:uppercase}.settings-media>p:first-child span{width:6px;height:6px;border-radius:50%;background:#b71b19;box-shadow:0 0 9px #f3a22e}.settings-video{overflow:hidden;border:1px solid rgba(214,162,74,.35);background:#000;aspect-ratio:16/9}.settings-video iframe{display:block;width:100%;height:100%;border:0}.media-controls{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:11px}.media-controls button{padding:9px 5px;border:1px solid rgba(208,158,73,.46);background:#2a0b09;color:#e7c27c;font:500 8px Cinzel,serif;letter-spacing:.06em;text-transform:uppercase;cursor:pointer}.media-controls button:hover{background:#56120f;box-shadow:0 0 13px rgba(237,151,41,.23)}.volume-control{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;margin-top:13px;color:#cda969;font:500 8px Cinzel,serif;letter-spacing:.08em;text-transform:uppercase}.volume-control input{accent-color:#a91d18}.volume-control output{min-width:29px;text-align:right}.autoplay-note{margin:10px 0 0!important;color:rgba(237,216,178,.52)!important;font-size:11px!important;text-transform:none!important;letter-spacing:0!important}
.version-badge { position:absolute; z-index:30; right:.65%; bottom:.35%; color:rgba(222,183,112,.55); font:500 clamp(6px,.48vw,9px) Cinzel,serif; letter-spacing:.08em; pointer-events:none; }
.feature-links { position:absolute; left:2%; right:2%; top:86.3%; height:9.2%; display:grid; grid-template-columns:repeat(6,1fr); gap:1.4%; }
.feature-links button { position:relative; width:100%; height:100%; }
.feature-links button:hover,.feature-links button:focus-visible { transform:translateY(-3px); background:radial-gradient(ellipse at 50% 55%,rgba(255,168,55,.15),transparent 67%); box-shadow:0 0 28px rgba(255,150,37,.28),inset 0 0 20px rgba(255,206,112,.08); filter:brightness(1.18) saturate(1.12); }
.timeline-arrow { position:absolute; z-index:8; top:65.3%; width:4.2%; height:6.5%; padding:0; border:0; border-radius:50%; background:transparent; cursor:pointer; }
.timeline-arrow--left { left:1%; }.timeline-arrow--right { right:1%; }
.timeline-arrow:hover,.timeline-arrow:focus-visible { transform:scale(1.1); background:rgba(143,53,15,.16); box-shadow:0 0 24px rgba(255,167,49,.52); filter:brightness(1.45); }
.side-dots { position:absolute; z-index:8; right:1.5%; top:31.8%; width:2%; height:13%; display:grid; grid-template-rows:repeat(4,1fr); }
.side-dots button { border:0; background:transparent; cursor:pointer; }
.side-dots button:hover,.side-dots button:focus-visible { transform:scale(1.25); filter:brightness(1.8) drop-shadow(0 0 7px #ffad2d); }
.panel { position:fixed; z-index:100; inset:0; display:grid; place-items:center; padding:24px; visibility:hidden; opacity:0; transition:opacity .32s ease,visibility .32s; }
.panel.is-open { visibility:visible; opacity:1; }
.panel__backdrop { position:absolute; inset:0; background:radial-gradient(circle at 55% 34%,rgba(57,25,15,.48),rgba(0,0,0,.9)); backdrop-filter:blur(13px); }
.panel-card { position:relative; width:min(720px,92vw); max-height:min(780px,88vh); overflow:auto; padding:clamp(30px,5vw,62px); border:1px solid rgba(216,173,99,.66); background:linear-gradient(145deg,rgba(25,14,10,.98),rgba(6,5,4,.99)); box-shadow:0 35px 100px #000,inset 0 0 80px rgba(164,79,23,.08); transform:translateY(22px) scale(.985); transition:transform .34s cubic-bezier(.2,.8,.2,1); }
.panel.is-open .panel-card { transform:none; }
.panel-card::before { content:""; position:absolute; inset:10px; border:1px solid rgba(216,173,99,.17); pointer-events:none; }
.panel-card__close { position:absolute; z-index:2; right:18px; top:13px; width:42px; height:42px; border:0; background:transparent; color:var(--gold); font:300 34px/1 Georgia,serif; cursor:pointer; }
.panel-card__kicker { margin:0 0 10px; color:var(--gold); font:500 12px/1.4 Cinzel,serif; letter-spacing:.24em; text-transform:uppercase; }
.panel-card h1 { margin:0; color:#f3d599; font:500 clamp(38px,7vw,72px)/.98 "Cormorant Garamond",serif; }
.panel-card__rule { display:flex; align-items:center; margin:25px 0; height:10px; }
.panel-card__rule::before,.panel-card__rule::after { content:""; height:1px; flex:1; background:linear-gradient(90deg,transparent,rgba(216,173,99,.65)); }.panel-card__rule::after{transform:scaleX(-1)}
.panel-card__rule span { width:10px; height:10px; margin:0 14px; border:1px solid var(--gold); transform:rotate(45deg); }
.panel-card__body { color:rgba(248,238,219,.84); font-size:clamp(17px,2vw,21px); line-height:1.65; }
.panel-card__body p { margin:0 0 16px; }.panel-card__body strong { color:#e8c67e; font-weight:600; }
.panel-card__body ul { display:grid; gap:9px; padding-left:20px; }
.panel-card__actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; }
.panel-card__actions button { padding:13px 18px; border:1px solid rgba(216,173,99,.55); background:#42100f; color:#f2d391; font:500 11px Cinzel,serif; letter-spacing:.08em; text-transform:uppercase; cursor:pointer; }.panel-card__actions button+button{background:transparent;color:#d7c7aa}
body.panel-open { overflow:hidden; }
.mobile-site { display:none; }
.sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
@media (max-width:760px) {
  body { overflow-x:hidden; background:#080503; }
  .stage { display:none; }
  .mobile-site { display:block; min-height:100svh; background:radial-gradient(circle at 70% 12%,rgba(117,26,14,.17),transparent 32%),#080503; }
  .mobile-hero { position:relative; min-height:86svh; display:flex; flex-direction:column; justify-content:space-between; padding:22px 20px 56px; overflow:hidden; background:linear-gradient(180deg,rgba(4,3,2,.15),rgba(5,3,2,.12) 45%,rgba(5,3,2,.92)),url('assets/aodai-site-map-clean.png') 68% center/cover; }
  .mobile-hero::after { content:""; position:absolute; inset:0; pointer-events:none; box-shadow:inset 0 -45px 55px #080503; }
  .mobile-brand { position:relative; z-index:2; margin:0; color:#f0d293; font:500 25px Cinzel,serif; letter-spacing:.08em; text-transform:uppercase; }.mobile-brand span{color:#c11719}
  .mobile-hero__copy { position:relative; z-index:2; max-width:310px; }.mobile-hero__copy>p{margin:0 0 4px;color:#e7c47c;font:500 11px Cinzel,serif;letter-spacing:.18em;text-transform:uppercase}.mobile-hero h1{margin:0;color:#f6deb0;font:500 clamp(70px,23vw,100px)/.86 "Cormorant Garamond",serif;text-shadow:0 8px 35px #000}.mobile-hero button{margin-top:26px;padding:14px 20px;border:1px solid #c5964f;background:linear-gradient(145deg,#641512,#300908);color:#f3d393;font:500 10px Cinzel,serif;letter-spacing:.12em;text-transform:uppercase}
  .mobile-nav { position:sticky; z-index:50; top:0; display:grid; grid-template-columns:repeat(4,1fr); height:54px; border-block:1px solid rgba(212,164,81,.28); background:rgba(7,4,3,.94); backdrop-filter:blur(12px); }.mobile-nav button{border:0;background:transparent;color:#d7ba82;font:500 9px Cinzel,serif;text-transform:uppercase;letter-spacing:.05em}
  .mobile-timeline { padding:58px 16px 72px; }.mobile-kicker{margin:0;color:#bc8e4a;font:500 9px Cinzel,serif;letter-spacing:.22em;text-align:center;text-transform:uppercase}.mobile-timeline h2{margin:8px 0 30px;color:#f0d39a;font:500 38px/1 "Cormorant Garamond",serif;text-align:center}
  .mobile-era-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }.mobile-era-grid button{position:relative;min-height:230px;overflow:hidden;padding:0;border:1px solid rgba(207,156,71,.31);background:linear-gradient(#0b0705,#160b07);color:#e6c584;box-shadow:0 12px 28px rgba(0,0,0,.38)}.mobile-era-grid button i{position:absolute;inset:0 0 35px;background-image:var(--asset);background-position:left center;background-size:200% 100%;background-repeat:no-repeat;transition:.35s ease}.mobile-era-grid button span{position:absolute;left:7px;right:7px;bottom:9px;font:500 9px/1.25 Cinzel,serif;letter-spacing:.04em;text-transform:uppercase}.mobile-era-grid button:active i,.mobile-era-grid button.is-active i{transform:scale(1.06);filter:brightness(1.18) drop-shadow(0 0 12px rgba(255,171,45,.65))}.mobile-era-grid button.is-active{border-color:#d1a052;box-shadow:0 0 22px rgba(201,31,22,.28),0 14px 35px #000}
  .mobile-showcase { margin-top:18px;padding:20px 16px 24px;border:1px solid rgba(219,169,83,.55);background:radial-gradient(circle at 50% 25%,rgba(145,22,15,.18),transparent 45%),#090604;box-shadow:0 25px 55px #000}.mobile-dress{--mobile-asset:url('assets/dresses/1700-front-back.png');position:relative;width:min(78vw,310px);aspect-ratio:3/4;margin:0 auto;transform-style:preserve-3d;animation:dress-turn 10s ease-in-out infinite}.mobile-dress>div{position:absolute;inset:0;background-image:var(--mobile-asset);background-size:200% 100%;background-repeat:no-repeat;backface-visibility:hidden}.mobile-dress__front{background-position:left center}.mobile-dress__back{background-position:right center;transform:rotateY(180deg)}.mobile-history{padding:18px 6px 0;border-top:1px solid rgba(207,157,76,.25)}.mobile-history>p:first-child{margin:0;color:#c9984e;font:500 9px Cinzel,serif;letter-spacing:.13em;text-transform:uppercase}.mobile-history h3{margin:7px 0;color:#f0d19a;font:500 32px "Cormorant Garamond",serif}.mobile-history>p:last-child{margin:0;color:rgba(249,237,215,.78);font-size:17px;line-height:1.55}
  .mobile-footer{display:grid;gap:6px;padding:35px 20px 88px;border-top:1px solid rgba(213,164,80,.25);text-align:center}.mobile-footer strong{color:#edcf94;font:500 23px Cinzel,serif;text-transform:uppercase}.mobile-footer span{color:rgba(245,225,190,.64);font-size:15px}.mobile-footer small{color:#8d754f;font:8px Cinzel,serif}
  .panel { position:fixed; left:0; width:100vw; }
  .settings-gear { right:12px; bottom:12px; width:50px; height:50px; }
  .settings-panel { right:10px; bottom:74px; width:calc(100vw - 20px); }
}
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto}.light-sweep,.ambient-lights i,.era-card.is-visible,.era-card.is-visible::before,.music-dock__equalizer i,.dress-rotator{animation:none}.era-card,.era::after,.era::before{transition:none} }

/* v1.13ao: keep the image-based portal as the only homepage at every size. */
.mobile-site { display:none!important; }
@media (max-width:760px) {
  body { overflow-x:auto; }
  .stage { display:block!important; width:1024px; height:683px; }
}