:root{
  --ink:#0b1026; --ink2:#141b3d; --paper:#f6efe2; --cream:#efe3c8; --dawn:#ff9a6b; --rose:#f05d7a; --gold:#f6c667;
  --mute:#9aa3c7; --line:rgba(246,239,226,.14);
  --serif:'Fraunces',Georgia,serif; --sans:'Inter',system-ui,sans-serif; --mono:'JetBrains Mono',ui-monospace,monospace;
}
*{box-sizing:border-box;margin:0}
html{background:var(--ink);color:var(--paper);font:16px/1.55 var(--sans);-webkit-text-size-adjust:100%}
body{min-height:100vh;overflow-x:hidden}
a{color:inherit}
.mono{font-family:var(--mono);font-size:.78rem;letter-spacing:.04em}
#sky{position:fixed;inset:0;width:100%;height:100%;z-index:-2}
.horizon{position:fixed;left:0;right:0;bottom:0;height:55vh;z-index:-1;pointer-events:none;
  background:radial-gradient(120% 70% at 50% 110%,rgba(255,154,107,.45),rgba(240,93,122,.18) 45%,transparent 75%);
  transition:opacity 1.2s}
.sun{position:absolute;left:50%;bottom:-38vmin;width:60vmin;height:60vmin;margin-left:-30vmin;border-radius:50%;
  background:radial-gradient(circle,#ffe2b3 0,#ffb37a 38%,rgba(255,120,90,.0) 70%);filter:blur(2px);
  animation:rise 9s cubic-bezier(.2,.7,.2,1) both}
@keyframes rise{from{transform:translateY(25vmin);opacity:.2}to{transform:none;opacity:.9}}

.top{display:flex;justify-content:space-between;align-items:center;padding:20px clamp(18px,5vw,48px)}
.brand{display:flex;gap:10px;align-items:center;font:600 1.05rem var(--serif);text-decoration:none;letter-spacing:.01em}
.brand-mark{width:18px;height:18px;border-radius:50%;background:conic-gradient(from 200deg,var(--gold),var(--dawn),var(--rose),var(--gold));box-shadow:0 0 18px rgba(255,170,110,.7)}
.counter{color:var(--mute)}

.view{padding:0 clamp(18px,5vw,48px) 60px;max-width:1080px;margin:0 auto}
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;min-height:calc(100vh - 140px);padding:20px 0 40px}
.eyebrow{font:500 .76rem var(--mono);text-transform:uppercase;letter-spacing:.22em;color:var(--gold);grid-column:1}
h1{grid-column:1;font:300 clamp(2.4rem,6vw,4.6rem)/1.02 var(--serif);letter-spacing:-.02em}
h1 em{font-style:italic;font-weight:400;background:linear-gradient(90deg,var(--gold),var(--dawn) 50%,var(--rose));-webkit-background-clip:text;background-clip:text;color:transparent}
.lede{grid-column:1;max-width:34em;color:#d6d9ec;font-size:1.06rem}
.hero>.eyebrow,.hero>h1,.hero>.lede{align-self:end}
.hero{grid-template-rows:auto auto auto}
.ticket{grid-column:2;grid-row:1/span 3;position:relative;background:var(--paper);color:var(--ink);border-radius:18px;padding:22px 22px 18px;
  box-shadow:0 30px 80px -20px rgba(0,0,0,.6),0 0 0 1px rgba(0,0,0,.05) inset;
  -webkit-mask:radial-gradient(circle 12px at 0 62px,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 12px at 100% 62px,#0000 98%,#000) right/51% 100% no-repeat;
  mask:radial-gradient(circle 12px at 0 62px,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 12px at 100% 62px,#0000 98%,#000) right/51% 100% no-repeat}
.ticket-head{display:flex;justify-content:space-between;font:600 .72rem var(--mono);text-transform:uppercase;letter-spacing:.2em;color:#8a6f4a;padding-bottom:18px;margin-bottom:16px;border-bottom:2px dashed #d8c9a8}
.field{display:block;margin-bottom:14px;position:relative}
.field>span{display:block;font:600 .7rem var(--mono);text-transform:uppercase;letter-spacing:.14em;color:#6b5a40;margin-bottom:5px}
.field i{font-style:normal;opacity:.6;text-transform:none;letter-spacing:0}
.field input{width:100%;font:500 1.05rem var(--sans);color:var(--ink);background:#fffaf0;border:1.5px solid #e2d4b4;border-radius:10px;padding:11px 12px;outline:none;transition:border .2s,box-shadow .2s}
.field input:focus{border-color:var(--dawn);box-shadow:0 0 0 4px rgba(255,154,107,.2)}
.row{display:grid;grid-template-columns:1.4fr 1fr;gap:10px}
.suggest{position:absolute;z-index:5;left:0;right:0;top:100%;list-style:none;padding:4px;margin-top:4px;background:#fff;border-radius:10px;box-shadow:0 14px 40px rgba(0,0,0,.25);display:none}
.suggest.on{display:block}
.suggest li{padding:9px 10px;border-radius:7px;cursor:pointer;font-size:.95rem}
.suggest li small{color:#887}
.suggest li.act,.suggest li:hover{background:#fbe9d9}
.go{width:100%;display:flex;justify-content:center;align-items:center;gap:10px;margin-top:6px;border:0;border-radius:12px;padding:15px;cursor:pointer;
  font:600 1rem var(--sans);color:#fff;background:linear-gradient(100deg,var(--ink2),#2b2f6e 60%,#5b2d6e);transition:transform .2s,box-shadow .2s}
.go:hover{transform:translateY(-1px);box-shadow:0 12px 30px -8px rgba(43,47,110,.7)}
.go svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;transition:transform .25s}
.go:hover svg{transform:translateX(4px)}
.fine{text-align:center;font-size:.78rem;color:#7c6c55;margin-top:10px}

.samples{padding:30px 0}
.samples h2{font:400 1.6rem var(--serif);margin-bottom:18px}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.sample{display:flex;flex-direction:column;gap:2px;text-decoration:none;padding:18px;border:1px solid var(--line);border-radius:14px;background:rgba(20,27,61,.55);backdrop-filter:blur(6px);transition:transform .3s,border-color .3s}
.sample:hover{transform:translateY(-4px);border-color:rgba(246,198,103,.6)}
.sample b{font:500 .78rem var(--mono);color:var(--gold);letter-spacing:.05em}
.sample span{font:500 1.35rem var(--serif)}
.sample small{color:var(--mute)}

.reveal{opacity:0;transform:translateY(18px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}

.foot{border-top:1px solid var(--line);padding:24px clamp(18px,5vw,48px);color:var(--mute);font-size:.82rem;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}

/* story */
.loading{min-height:70vh;display:grid;place-content:center;justify-items:center;gap:20px;color:var(--mute)}
.orbit{width:80px;height:80px;border-radius:50%;border:1px dashed rgba(246,198,103,.5);position:relative;animation:spin 2.4s linear infinite}
.orbit i{position:absolute;top:-6px;left:34px;width:12px;height:12px;border-radius:50%;background:var(--gold);box-shadow:0 0 16px var(--gold)}
@keyframes spin{to{transform:rotate(360deg)}}
.s-hero{text-align:center;padding:40px 0 30px}
.s-hero .eyebrow{display:block;margin-bottom:12px}
.s-hero h1{font-size:clamp(2.3rem,7vw,5rem)}
.s-hero .meta{margin-top:14px;color:#d6d9ec}
.count{display:flex;justify-content:center;gap:clamp(14px,4vw,40px);margin:28px 0 8px;flex-wrap:wrap}
.count div{text-align:center}
.count b{display:block;font:300 clamp(1.8rem,5vw,3rem) var(--serif);font-variant-numeric:tabular-nums}
.count small{font:500 .68rem var(--mono);text-transform:uppercase;letter-spacing:.16em;color:var(--mute)}

.grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin-top:30px}
.panel{grid-column:span 2;border:1px solid var(--line);border-radius:18px;padding:22px;background:rgba(20,27,61,.6);backdrop-filter:blur(8px);position:relative;overflow:hidden}
.panel.w3{grid-column:span 3}.panel.w4{grid-column:span 4}.panel.w6{grid-column:span 6}
.panel h3{font:600 .7rem var(--mono);text-transform:uppercase;letter-spacing:.2em;color:var(--gold);margin-bottom:14px}
.big{font:300 3rem/1 var(--serif)}
.sub{color:#cfd3ea;margin-top:6px}
.kv{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;margin-top:14px;font-size:.9rem;color:#cfd3ea}
.kv dt{color:var(--mute)}
.wx-icon{position:absolute;right:16px;top:14px;width:64px;height:64px}
.song .title{font:italic 400 1.8rem/1.1 var(--serif)}
.song .artist{margin-top:6px;color:#cfd3ea}
.vinyl{position:absolute;right:-40px;bottom:-40px;width:150px;height:150px;border-radius:50%;
  background:repeating-radial-gradient(circle,#111 0 2px,#1b1b1b 2px 4px);animation:spin 6s linear infinite;opacity:.8}
.vinyl::after{content:"";position:absolute;inset:38%;border-radius:50%;background:conic-gradient(var(--rose),var(--gold),var(--dawn),var(--rose))}
.moon{display:flex;gap:18px;align-items:center}
.moon svg{width:90px;height:90px;flex:none;filter:drop-shadow(0 0 18px rgba(246,239,226,.35))}
ul.events{list-style:none;padding:0;display:grid;gap:12px}
ul.events li{padding-left:16px;border-left:2px solid rgba(246,198,103,.5)}
ul.events li b{font:500 .74rem var(--mono);color:var(--gold);display:block}
.prices{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px}
.price{background:rgba(246,239,226,.05);border-radius:12px;padding:12px}
.price b{font:400 1.7rem var(--serif);display:block}
.price span{color:#cfd3ea;font-size:.85rem}
.price small{display:block;color:var(--mute);font-size:.75rem;margin-top:4px}
.note{color:var(--mute);font-size:.78rem;margin-top:12px}
.people{display:flex;flex-wrap:wrap;gap:10px}
.person{display:flex;gap:10px;align-items:center;background:rgba(246,239,226,.05);border-radius:40px;padding:5px 14px 5px 5px;font-size:.88rem;text-decoration:none}
.person img,.person .ph{width:36px;height:36px;border-radius:50%;object-fit:cover;background:#2b2f6e}
.person small{color:var(--mute);display:block;font-size:.72rem}

.cert{grid-column:span 6;margin-top:10px;background:var(--paper);color:var(--ink);border-radius:20px;padding:clamp(22px,5vw,48px);text-align:center;position:relative;
  background-image:radial-gradient(circle at 20% 10%,rgba(255,154,107,.15),transparent 40%),radial-gradient(circle at 80% 90%,rgba(240,93,122,.12),transparent 40%)}
.cert::before{content:"";position:absolute;inset:12px;border:1.5px solid #c9b48a;border-radius:12px;pointer-events:none}
.cert .eyebrow{color:#8a6f4a}
.cert h2{font:400 clamp(2rem,6vw,3.4rem) var(--serif);margin:10px 0 6px}
.cert p{color:#4a4256;max-width:36em;margin:0 auto}
.cert .seal{width:86px;height:86px;margin:20px auto 0;border-radius:50%;display:grid;place-items:center;font:600 .62rem var(--mono);letter-spacing:.1em;color:#fff;
  background:conic-gradient(from 0deg,var(--rose),var(--dawn),var(--gold),var(--rose));box-shadow:0 8px 24px rgba(240,93,122,.4);animation:spin 30s linear infinite}
.actions{display:flex;gap:10px;justify-content:center;margin-top:22px;flex-wrap:wrap}
.btn{border:0;border-radius:40px;padding:11px 20px;font:600 .9rem var(--sans);cursor:pointer;background:var(--ink);color:#fff;text-decoration:none}
.btn.ghost{background:transparent;color:var(--ink);border:1.5px solid var(--ink)}
.err{text-align:center;padding:80px 0}
.err h2{font:400 2rem var(--serif);margin-bottom:10px}

@media (max-width:860px){
  .hero{grid-template-columns:1fr;min-height:auto;gap:22px;padding-top:10px}
  .ticket{grid-column:1;grid-row:auto}
  .cards{grid-template-columns:1fr 1fr}
  .grid{grid-template-columns:1fr}
  .panel,.panel.w3,.panel.w4,.panel.w6,.cert{grid-column:1}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}
@media print{#sky,.horizon,.top,.foot,.panel,.s-hero,.actions{display:none!important}.cert{box-shadow:none}html{background:#fff}}