/* theme.css — DESIGN TOKENS & CUSTOM CLASSES (edit colours, fonts, effects here) */
:root{--twilight-base: #070b14;--twilight-card: #0d1527;--twilight-surface: #121c33;--gold-pure: #dfb141;--gold-glow: #ffd768;--gold-light: #fce8a6;--gold-dark: #8a6516;--ruby-accent: #c41e3a;--emerald-accent: #1b4d3e}
html{scroll-behavior:smooth;color-scheme:dark}
body{background-color:var(--twilight-base);color:#f8edd1;font-family:Jost,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
::-webkit-scrollbar{width:8px}
::-webkit-scrollbar-track{background:#070b14}
::-webkit-scrollbar-thumb{background:#3b2c0f;border:1px solid #dfb141;border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:#dfb141}
.font-royal{font-family:Cinzel,serif}
.font-serif-display{font-family:Playfair Display,serif}
.font-script{font-family:Great Vibes,cursive}
.gold-text-glow{background:linear-gradient(135deg,#b88a28,#ffd768,#fff,#ffd768,#b88a28);background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 30px rgba(223,177,65,.4);animation:goldFoilShimmer 6s linear infinite}
@keyframes goldFoilShimmer{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}
.gold-accent-text{color:#dfb141;text-shadow:0 0 12px rgba(223,177,65,.35)}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1);will-change:opacity,transform}
.reveal.is-visible{opacity:1;transform:translateY(0)}
@keyframes lanternFloat{0%{transform:translateZ(0) scale(1);opacity:.9}50%{transform:translate3d(var(--drift-x, 20px),-45vh,0) scale(.9);opacity:.95}to{transform:translate3d(calc(var(--drift-x, 20px) * 2),-105vh,0) scale(.7);opacity:0}}
.animate-lantern{animation:lanternFloat linear forwards}
@keyframes ringRotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}
.animate-spin-slow{animation:ringRotate 25s linear infinite}
.animate-spin-reverse-slow{animation:ringRotate 35s linear infinite reverse}
@keyframes royalTwilightGlow{0%,to{box-shadow:0 0 25px #dfb1414d,inset 0 0 20px #dfb14140}50%{box-shadow:0 0 50px 10px #dfb1418c,inset 0 0 35px #dfb14166}}
.twilight-glow{animation:royalTwilightGlow 4s ease-in-out infinite}
.glass-twilight{background:#0d1527d1;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(223,177,65,.35);box-shadow:0 20px 50px #00000080,inset 0 1px #ffffff1a}
.glass-twilight-card{background:linear-gradient(135deg,#121c33d9,#090e1af2);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(223,177,65,.3);box-shadow:0 15px 35px #0006}
@keyframes equalizer{0%,to{height:4px}50%{height:16px}}
.royal-corners{position:relative}
.royal-corners:before,.royal-corners:after{content:"";position:absolute;width:14px;height:14px;border:2px solid #dfb141;pointer-events:none}
.royal-corners:before{top:8px;left:8px;border-right:none;border-bottom:none}
.royal-corners:after{bottom:8px;right:8px;border-left:none;border-top:none}
.ornament{display:flex;align-items:center;gap:14px;justify-content:center;color:#dfb141}
.ornament:before,.ornament:after{content:"";height:1px;width:60px;background:linear-gradient(90deg,transparent,rgba(223,177,65,.8))}
.ornament:after{background:linear-gradient(90deg,rgba(223,177,65,.8),transparent)}

/* The rebuild keeps the light-box / mobile menu in the markup (the original
   React build mounted them on demand) and toggles them with the `hidden`
   attribute. Tailwind display utilities would otherwise beat the UA rule. */
[hidden]{display:none!important}