:root {
  --bg: #050505;
  --white: #F9F2DF;
  --accent: #462121;
  --logo-scale: 1;
  --logo-blur: 0px;
  --logo-glow: 0.12;
  --logo-y: 0px;
  --ring-scale: 1;
  --ring-opacity: 0.22;
  --subtitle-opacity: 0.96;
  --burn-x: 0px;
  --burn-y: 0px;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{width:100%;height:100%;overflow:hidden;background:var(--bg);cursor:none}
body{position:relative;font-family:'Inter',sans-serif;color:var(--white);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.bg-video-wrap{position:fixed;inset:0;overflow:hidden;z-index:0;background:#000}
.bg-video,.bg-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bg-image{background-size:cover;background-position:center center}
.bg-video{top:50%;left:50%;width:auto;height:auto;min-width:100%;min-height:100%;transform:translate(-50%,-50%);filter:brightness(.42) contrast(1.04) saturate(.95)}
.bg-overlay{position:absolute;inset:0;background:radial-gradient(circle at 50% 46%,rgba(249,242,223,.04),transparent 18%),radial-gradient(circle at 20% 20%,rgba(70,33,33,.18),transparent 24%),radial-gradient(circle at 80% 22%,rgba(249,242,223,.03),transparent 22%),linear-gradient(180deg,rgba(0,0,0,.28),rgba(0,0,0,.62));z-index:1}
.floating-fog{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:.42;background:radial-gradient(circle at 28% 60%,rgba(249,242,223,.035),transparent 18%),radial-gradient(circle at 68% 30%,rgba(249,242,223,.03),transparent 16%),radial-gradient(circle at 50% 76%,rgba(249,242,223,.02),transparent 20%);animation:fogMove 16s linear infinite alternate}
@keyframes fogMove{0%{transform:translate(0,0) scale(1)}100%{transform:translate(-20px,10px) scale(1.06)}}
.home-layer{position:relative;z-index:10;width:100%;height:100%;opacity:1;transition:opacity .9s ease,transform .9s ease,filter .9s ease}.home-layer.dimmed{opacity:0;transform:scale(1.06);filter:blur(8px)}
.main-stage{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:24px}
.brand-wrap{position:relative;display:flex;align-items:center;justify-content:center;text-align:center;width:100%;max-width:1400px;transform:translate(var(--burn-x),var(--burn-y));transition:transform 8s linear;animation:brandFadeIn 1.2s ease}
.brand-core{position:relative;display:flex;flex-direction:column;align-items:center;gap:10px;padding:20px 24px}
.sound-ring{position:absolute;inset:50% auto auto 50%;width:min(62vw,780px);height:min(62vw,780px);transform:translate(-50%,-54%) scale(var(--ring-scale));border-radius:50%;pointer-events:none;opacity:var(--ring-opacity);background:radial-gradient(circle,rgba(70,33,33,.22) 0%,rgba(70,33,33,.10) 28%,rgba(249,242,223,.05) 42%,rgba(249,242,223,.02) 56%,transparent 70%);filter:blur(10px);animation:ringBreath 4s ease-in-out infinite}
.sound-ring::before,.sound-ring::after{content:"";position:absolute;inset:10%;border-radius:50%;border:1px solid rgba(249,242,223,.10);animation:ringRotate 18s linear infinite}
.sound-ring::after{inset:18%;border-color:rgba(70,33,33,.30);animation-direction:reverse;animation-duration:24s}
@keyframes ringBreath{0%,100%{opacity:calc(var(--ring-opacity)*.75)}50%{opacity:calc(var(--ring-opacity)*1.08)}}
@keyframes ringRotate{from{transform:rotate(0)}to{transform:rotate(360deg)}}
.logo-glow{position:absolute;width:min(60vw,900px);height:min(30vw,360px);left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none;background:radial-gradient(circle,rgba(70,33,33,.28),transparent 65%);filter:blur(42px);opacity:calc(.55 + var(--logo-glow));animation:glowFloat 6s ease-in-out infinite alternate}
@keyframes glowFloat{0%{transform:translate(-50%,-50%) scale(.95)}100%{transform:translate(-50%,-50%) scale(1.05)}}
.now-playing{position:absolute;font-size:clamp(20px,2.3vw,34px);top:17%;left:67%;transform:translate(-50%,-50%);font-family:'Amarante',serif;line-height:1;color:var(--white);opacity:.9;white-space:nowrap;z-index:5;pointer-events:none}
.np-wrap{position:relative;max-width:420px;overflow:hidden}
#sonic_title{display:inline-block;white-space:nowrap;will-change:transform;transform:translateX(0)}
.np-wrap::before,.np-wrap::after{content:"";position:absolute;top:0;width:34px;height:100%;z-index:2;pointer-events:none}
.np-wrap::before{left:0;background:linear-gradient(to right,rgba(5,5,5,.95),transparent)}
.np-wrap::after{right:0;background:linear-gradient(to left,rgba(5,5,5,.95),transparent)}
.brand-logo{position:relative;font-family:'Amarante',serif;font-size:clamp(78px,13vw,230px);line-height:.88;color:var(--white);user-select:none;transform:translateY(var(--logo-y)) scale(var(--logo-scale));filter:blur(var(--logo-blur));text-shadow:0 8px 28px rgba(0,0,0,.28),0 0 16px rgba(249,242,223,.05),0 0 34px rgba(70,33,33,var(--logo-glow));transition:transform 90ms linear,filter 90ms linear,text-shadow 120ms linear;animation:logoIdle 5.5s ease-in-out infinite;z-index:2;overflow:hidden}
.brand-logo::after{content:"";position:absolute;top:-20%;left:-35%;width:24%;height:140%;transform:skewX(-20deg);background:linear-gradient(90deg,rgba(249,242,223,0) 0%,rgba(249,242,223,.06) 35%,rgba(249,242,223,.35) 50%,rgba(249,242,223,.06) 65%,rgba(249,242,223,0) 100%);filter:blur(2px);animation:shimmerSweep 7s ease-in-out infinite;pointer-events:none;mix-blend-mode:screen}
@keyframes shimmerSweep{0%,72%,100%{left:-35%;opacity:0}76%{opacity:1}90%{left:120%;opacity:1}100%{left:120%;opacity:0}}
@keyframes logoIdle{0%,100%{transform:translateY(calc(var(--logo-y) + 0px)) scale(var(--logo-scale))}50%{transform:translateY(calc(var(--logo-y) - 4px)) scale(calc(var(--logo-scale) + .006))}}
.brand-sub{position:relative;font-family:'Amarante',serif;font-size:clamp(20px,2.3vw,34px);font-weight:400;letter-spacing:.04em;color:var(--white);text-shadow:0 4px 18px rgba(0,0,0,.22),0 0 18px rgba(70,33,33,.16);animation:subtitleFloat 6s ease-in-out infinite;z-index:2;opacity:var(--subtitle-opacity)}
@keyframes subtitleFloat{0%,100%{transform:translateY(0) scale(1);opacity:.92}50%{transform:translateY(3px) scale(1.01);opacity:1}}
@keyframes brandFadeIn{0%{opacity:0;transform:translateY(16px) scale(.985)}100%{opacity:1;transform:translateY(0) scale(1)}}
.brand-logo.fx-glitch{animation:logoGlitch 1.4s ease-in-out}.brand-logo.fx-flicker{animation:logoFlicker 1.8s ease-in-out}.brand-logo.fx-zoomflash{animation:logoZoomFlash 1.8s ease-in-out}.brand-logo.fx-typewriter{animation:logoTypewriter 3.2s steps(8,end)}
@keyframes logoTypewriter{0%{clip-path:inset(0 100% 0 0);opacity:.2;letter-spacing:.12em}20%{opacity:1}100%{clip-path:inset(0 0 0 0);opacity:1;letter-spacing:0}}
@keyframes logoGlitch{0%,100%{transform:translateY(var(--logo-y)) scale(var(--logo-scale));filter:blur(var(--logo-blur))}10%{transform:translateY(calc(var(--logo-y) - 1px)) translateX(-2px) scale(calc(var(--logo-scale) + .01));text-shadow:-2px 0 rgba(249,242,223,.18),2px 0 rgba(70,33,33,.28),0 8px 28px rgba(0,0,0,.28)}20%{transform:translateY(calc(var(--logo-y) + 1px)) translateX(2px) scale(calc(var(--logo-scale) + .015))}30%{transform:translateY(calc(var(--logo-y) - 2px)) translateX(-1px)}40%{transform:translateY(calc(var(--logo-y) + 1px)) translateX(3px)}50%{transform:translateY(calc(var(--logo-y) - 1px)) translateX(-3px)}60%{transform:translateY(calc(var(--logo-y) + 2px)) translateX(1px)}70%{transform:translateY(calc(var(--logo-y) - 1px)) translateX(-1px)}}
@keyframes logoFlicker{0%,100%{opacity:1}8%,18%,32%,52%{opacity:.55}12%,26%,44%,70%{opacity:1}60%{text-shadow:0 8px 28px rgba(0,0,0,.28),0 0 24px rgba(249,242,223,.18),0 0 48px rgba(70,33,33,.38)}}
@keyframes logoZoomFlash{0%,100%{transform:translateY(var(--logo-y)) scale(var(--logo-scale));filter:blur(var(--logo-blur))}20%{transform:translateY(calc(var(--logo-y) - 2px)) scale(calc(var(--logo-scale) + .05));filter:blur(.4px)}40%{transform:translateY(calc(var(--logo-y) - 1px)) scale(calc(var(--logo-scale) + .025));text-shadow:0 8px 28px rgba(0,0,0,.28),0 0 28px rgba(249,242,223,.22),0 0 56px rgba(70,33,33,.42)}60%{transform:translateY(var(--logo-y)) scale(calc(var(--logo-scale) + .01))}}
.brand-logo.fx-typewriter .logo-letter{opacity:0;transform:translateY(10px);animation:logoLetterIn .45s ease forwards}
@keyframes logoLetterIn{to{opacity:1;transform:translateY(0)}}
.wifi-qr{position:fixed;right:28px;bottom:26px;z-index:30;width:148px;padding:12px;border-radius:20px;background:rgba(8,8,8,.28);border:1px solid rgba(249,242,223,.12);backdrop-filter:blur(14px);box-shadow:0 12px 40px rgba(0,0,0,.28);text-align:center;transition:opacity .8s ease,transform .8s ease,filter .8s ease;transform:translate(var(--burn-x),var(--burn-y))}.wifi-qr.dimmed{opacity:0;transform:scale(.98);filter:blur(4px)}.wifi-qr img{width:100%;display:block;border-radius:12px;background:#fff}.wifi-qr .qr-label{margin-top:10px;font-size:15px;font-weight:600;color:var(--white);line-height:1.2}
.hidden-audio{position:fixed;width:0;height:0;opacity:0;pointer-events:none}
.site-footer{position:fixed;bottom:18px;left:24px;z-index:5;font-size:13px;letter-spacing:.4px;color:rgba(249,242,223,.65);text-shadow:0 2px 10px rgba(0,0,0,.25);pointer-events:none;user-select:none;transition:opacity .4s ease}.home-layer.dimmed .site-footer{opacity:0}
.ad-overlay{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:20px;overflow:hidden;opacity:0;transition:opacity .7s ease}.ad-overlay.show{display:flex;opacity:1}.ad-backdrop{position:absolute;inset:0;background:radial-gradient(circle at 20% 20%,rgba(249,242,223,.08),transparent 28%),radial-gradient(circle at 80% 25%,rgba(70,33,33,.22),transparent 24%),rgba(5,5,7,.72);backdrop-filter:blur(14px)}
.ad-shell{position:relative;z-index:2;width:min(96vw,1580px);height:min(88vh,900px);border-radius:38px;overflow:hidden;background:rgba(255,255,255,.04);border:1px solid rgba(249,242,223,.10);box-shadow:0 30px 120px rgba(0,0,0,.5);backdrop-filter:blur(18px)}
.ad-slides{position:absolute;inset:0;overflow:hidden;background:#0d0d10}.ad-slide{position:absolute;inset:0;opacity:0;transform:scale(1.1);filter:blur(6px);transition:opacity 1.1s ease,transform 8.5s ease,filter 1.1s ease;pointer-events:none}.ad-slide.active{opacity:1;transform:scale(1);filter:blur(0)}.ad-slide img,.ad-slide video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.ad-slide::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.12),rgba(0,0,0,.42)),linear-gradient(90deg,rgba(0,0,0,.38),rgba(0,0,0,.10) 45%,rgba(0,0,0,.28))}
.ad-slide .light-sweep{position:absolute;top:-10%;left:-30%;width:22%;height:130%;transform:skewX(-20deg);background:linear-gradient(90deg,rgba(249,242,223,0) 0%,rgba(249,242,223,.03) 35%,rgba(249,242,223,.18) 50%,rgba(249,242,223,.03) 65%,rgba(249,242,223,0) 100%);filter:blur(4px);opacity:0;pointer-events:none}.ad-slide.active .light-sweep{animation:slideSweep 2.8s ease .35s 1 forwards}
@keyframes slideSweep{0%{left:-30%;opacity:0}15%{opacity:1}100%{left:120%;opacity:0}}
.ad-content-layer{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;justify-content:flex-end;padding:34px 38px}.ad-body{position:relative;width:100%;display:flex;align-items:flex-end}.ad-style{width:100%;display:none}.ad-style.active{display:flex}.ad-style-cinematic{justify-content:flex-start;align-items:flex-end}.ad-style-cinematic .ad-text-wrap{width:min(760px,62%);padding:28px 30px;border-radius:28px;background:rgba(8,8,8,.22);border:1px solid rgba(249,242,223,.10);backdrop-filter:blur(16px);box-shadow:0 16px 50px rgba(0,0,0,.25)}.ad-style-centered{justify-content:center;align-items:center;text-align:center}.ad-style-centered .ad-text-wrap{width:min(920px,84%);margin:0 auto;padding:34px 36px;border-radius:34px;background:rgba(8,8,8,.20);border:1px solid rgba(249,242,223,.12);backdrop-filter:blur(16px);box-shadow:0 22px 70px rgba(0,0,0,.28)}.ad-style-card{justify-content:flex-end;align-items:flex-end}.ad-style-card .ad-card{width:min(520px,100%);padding:30px 28px;border-radius:30px;background:linear-gradient(145deg,rgba(70,33,33,.28),rgba(12,8,8,.50)),rgba(0,0,0,.22);border:1px solid rgba(249,242,223,.14);backdrop-filter:blur(18px);box-shadow:0 20px 60px rgba(0,0,0,.32),inset 0 0 0 1px rgba(249,242,223,.03)}
.ad-card-line{width:56px;height:2px;margin-bottom:16px;background:linear-gradient(90deg,#F9F2DF,#462121);opacity:.9;transform:scaleX(0);transform-origin:left center}.ad-style.active .ad-card-line{animation:lineGrow .8s ease .25s forwards}@keyframes lineGrow{to{transform:scaleX(1)}}
.ad-title,.ad-desc{opacity:0;transform:translateY(16px)}.ad-style.active .ad-title{animation:textReveal .7s cubic-bezier(.2,.8,.2,1) .35s forwards}.ad-style.active .ad-desc{animation:textReveal .7s cubic-bezier(.2,.8,.2,1) .65s forwards}@keyframes textReveal{from{opacity:0;transform:translateY(18px);filter:blur(6px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}
.ad-title{font-size:clamp(38px,4.8vw,82px);line-height:.95;font-weight:800;margin-bottom:16px;white-space:pre-line;color:var(--white);text-shadow:0 8px 24px rgba(0,0,0,.24),0 0 22px rgba(70,33,33,.12)}.ad-style-card .ad-title{font-size:clamp(30px,3.6vw,52px)}.ad-desc{font-size:clamp(17px,1.7vw,26px);line-height:1.45;color:rgba(249,242,223,.92);max-width:700px}.ad-style-card .ad-desc{font-size:clamp(16px,1.35vw,20px);max-width:100%}.ad-bottomfade{position:absolute;left:0;right:0;bottom:0;height:200px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.30));pointer-events:none}.ad-progress{position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(249,242,223,.08);overflow:hidden;z-index:6}.ad-progress-bar{width:0%;height:100%;background:linear-gradient(90deg,#462121,#6b3a3a,#F9F2DF);box-shadow:0 0 12px rgba(70,33,33,.35)}
.special-overlay{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;padding:24px;background:radial-gradient(circle at center,rgba(70,33,33,.20),transparent 40%),rgba(5,5,5,.72);backdrop-filter:blur(12px);opacity:0;pointer-events:none;transition:opacity .7s ease,transform .7s ease}.special-overlay.show{opacity:1;pointer-events:auto}
.special-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.42) contrast(1.04) saturate(.95);z-index:0}.special-video-overlay{position:absolute;inset:0;z-index:1;background:radial-gradient(circle at center,rgba(70,33,33,.22),transparent 42%),linear-gradient(180deg,rgba(0,0,0,.28),rgba(0,0,0,.62))}
.special-inner{position:relative;z-index:2;width:min(1100px,92vw);margin:0 auto;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;transform:translateY(18px) scale(.98);transition:transform .7s ease}.special-overlay.show .special-inner{transform:translateY(0) scale(1)}
.special-name{display:block;font-family:'Amarante',serif;font-size:clamp(78px,11vw,210px);line-height:.9;color:var(--white);text-shadow:0 8px 30px rgba(0,0,0,.30),0 0 28px rgba(249,242,223,.10),0 0 48px rgba(70,33,33,.24);margin:0;animation:specialFloat 4s ease-in-out infinite}
.special-message{font-size:clamp(18px,1.8vw,26px);line-height:1.55;color:rgba(249,242,223,.90);text-shadow:0 4px 18px rgba(0,0,0,.24);max-width:760px;font-weight:500;letter-spacing:.01em;margin:0}.special-meta{display:flex;justify-content:center;width:100%;margin-bottom:0}.special-meta-card{display:inline-flex;flex-direction:column;gap:10px;padding:18px 24px;border-radius:24px;background:rgba(8,8,8,.22);border:1px solid rgba(249,242,223,.10);backdrop-filter:blur(14px);box-shadow:0 16px 50px rgba(0,0,0,.22)}.special-meta-line{font-size:clamp(15px,1.4vw,22px);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(249,242,223,.82);text-shadow:0 4px 14px rgba(0,0,0,.24)}
.tagline{position:relative;display:inline-block;transition:opacity .6s ease,transform .6s ease}.tagline.hidden{opacity:0;transform:translateY(10px)}.tagline.show{opacity:1;transform:translateY(0)}.tagline .tagline-letter{display:inline-block;opacity:0;transform:translateY(8px)}.tagline.reveal .tagline-letter{animation:taglineLetterReveal .45s ease forwards}@keyframes taglineLetterReveal{to{opacity:1;transform:translateY(0)}}
.tagline.quote-style::before,.tagline.quote-style::after{position:absolute;font-family:'Amarante',serif;color:rgba(249,242,223,.42);text-shadow:0 0 14px rgba(70,33,33,.18);pointer-events:none;line-height:1}.tagline.quote-style::before{content:'“';top:-.35em;left:-.55em;font-size:.9em}.tagline.quote-style::after{content:'”';bottom:-.42em;right:-.48em;font-size:.9em}.tagline.quote-style.shimmering::before,.tagline.quote-style.shimmering::after{animation:taglineQuoteGlow 2.2s ease-in-out infinite}@keyframes taglineQuoteGlow{0%,100%{opacity:.5;transform:scale(1)}50%{opacity:.9;transform:scale(1.06)}}.tagline.shimmering{overflow:hidden}.tagline-shimmer{position:absolute;top:-18%;left:-32%;width:20%;height:150%;transform:skewX(-20deg);background:linear-gradient(90deg,rgba(249,242,223,0) 0%,rgba(249,242,223,.04) 35%,rgba(249,242,223,.26) 50%,rgba(249,242,223,.04) 65%,rgba(249,242,223,0) 100%);filter:blur(2px);opacity:0;pointer-events:none;mix-blend-mode:screen}.tagline.shimmering .tagline-shimmer{animation:taglineShimmerSweep 2.8s ease-in-out 1 forwards}@keyframes taglineShimmerSweep{0%{left:-32%;opacity:0}12%{opacity:1}100%{left:118%;opacity:0}}
body::after{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 50%,rgba(70,33,33,.08),transparent 60%);animation:ambientPulse 6s ease-in-out infinite;z-index:1}@keyframes ambientPulse{0%,100%{opacity:.6;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}}@keyframes specialFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@media (max-width:1180px){.sound-ring{width:min(84vw,700px);height:min(84vw,700px)}.ad-style-cinematic .ad-text-wrap,.ad-style-centered .ad-text-wrap{max-width:100%}.ad-style-card{justify-content:center}.ad-style-card .ad-card{margin:0 auto;width:min(680px,100%)}.wifi-qr{width:132px}}
@media (max-width:900px){.site-footer{display:none!important}.ad-overlay{padding:10px}.ad-shell{width:100%;height:calc(100vh - 20px);border-radius:24px}.ad-content-layer{padding:20px}.ad-style-cinematic,.ad-style-centered,.ad-style-card{justify-content:center;align-items:flex-end;text-align:left}.ad-style-cinematic .ad-text-wrap,.ad-style-centered .ad-text-wrap,.ad-style-card .ad-card{width:100%;max-width:100%;padding:20px;border-radius:22px;margin:0}.ad-title{font-size:clamp(28px,8vw,52px)}.ad-desc{font-size:clamp(16px,4vw,20px)}.ad-progress{height:3px}.wifi-qr{right:14px;bottom:14px;width:116px;padding:10px;border-radius:16px}.wifi-qr .qr-label{font-size:13px}.brand-core{padding-top:34px}.now-playing{top:-26px;left:50%;transform:translateX(-50%);font-size:16px;width:78vw;max-width:78vw;text-align:center}.np-wrap{width:78vw;max-width:78vw;margin:0 auto;overflow:hidden}.special-inner{width:min(94vw,94vw);gap:14px}.special-meta-card{width:100%;max-width:92vw;padding:14px 16px;border-radius:18px}.special-meta-line{font-size:clamp(13px,3.8vw,17px);letter-spacing:.06em}.special-name{font-size:clamp(54px,16vw,120px)}.special-message{font-size:clamp(15px,4.6vw,22px);max-width:92vw}}
@media (max-width:700px){.main-stage{padding:14px}.brand-core{gap:10px}.brand-logo{font-size:clamp(58px,18vw,126px)}.brand-sub{font-size:clamp(16px,5vw,24px)}}
@media (max-width:600px){.brand-core{padding-top:28px}.now-playing{top:-18px;left:50%;transform:translateX(-50%);font-size:14px;max-width:82vw;width:82vw}.np-wrap{max-width:82vw;width:82vw}}
