:root{--bg:#07080a;--text:#f4f0e8;--muted:#b9bbc0;--accent:#d0a652;--line:rgba(255,255,255,.16)}
*{box-sizing:border-box} html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#000;color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif}
body{display:grid;place-items:center}
#stage{position:relative;width:min(100vw,56.25vh);height:min(177.7778vw,100vh);background:#07080a;overflow:hidden}
#bg{position:absolute;inset:-5%;background-position:center;background-size:cover;filter:blur(34px) brightness(.3);transform:scale(1.1);opacity:.75}
#mediaWrap{position:absolute;inset:3.5% 4% 30%;display:grid;place-items:center;z-index:2}
#media{max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 20px 32px rgba(0,0,0,.45))}
#fallback{display:none;width:100%;height:100%;padding:9%;border:1px solid rgba(255,255,255,.14);background:radial-gradient(circle at 20% 12%,rgba(208,166,82,.2),transparent 36%),linear-gradient(145deg,#1a1e25,#090a0d 70%);align-items:center;text-align:center}
#fallback.show{display:flex}
#fallback .inner{width:100%}
#fy{font:800 8vh Georgia,serif;color:rgba(255,255,255,.1)}
#ft{margin-top:2vh;color:var(--accent);font-size:1.4vh;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
#fd{margin:1.8vh auto 0;max-width:90%;font:2.3vh/1.3 Georgia,serif;color:#e5dfd3}
#shade{position:absolute;inset:0;background:linear-gradient(to bottom,transparent 56%,rgba(0,0,0,.4) 70%,#050608 82%);z-index:3;pointer-events:none}
#info{position:absolute;left:0;right:0;bottom:0;z-index:4;padding:2.6vh 4.2vw 3vh}
#eyebrow{color:var(--accent);font-size:1.15vh;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
#artist{margin-top:.9vh;font:700 3.9vh/.98 Georgia,serif;letter-spacing:-.03em}
#venue{margin-top:.9vh;font-size:1.75vh;font-weight:650}
#location{font-size:1.35vh;color:var(--muted)}
#support{margin-top:.7vh;font-size:1.25vh;color:#d5d0c6}
#pageCount{position:absolute;right:3%;bottom:1.4vh;z-index:4;color:var(--muted);font-size:1vh;letter-spacing:.04em;opacity:.65;pointer-events:none}
#progressTrack{position:absolute;left:0;right:0;bottom:0;height:.35vh;background:rgba(255,255,255,.08);z-index:8}
#progress{height:100%;background:var(--accent);width:0}
#controls{position:absolute;right:1.3vw;top:1.2vh;z-index:10;display:flex;gap:.6vw;opacity:0;transition:.2s}
#stage.controls #controls{opacity:1}
button{width:4vh;height:4vh;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.55);color:white;font-size:1.6vh}
#source{position:absolute;left:1.3vw;top:1.3vh;z-index:10;color:white;text-decoration:none;font-size:1vh;background:rgba(0,0,0,.52);padding:.6vh .9vw;border-radius:99px;opacity:0}
#stage.controls #source{opacity:1}.hidden{display:none}
/* Keep spacing tied to the portrait stage, including on wide TV screens. */
#info{padding:2.6vh 7.5% 3vh}#controls{right:3%;gap:.6vh}#source{left:3%;padding:.6vh 1vh}#stage:focus-within #controls,#stage:focus-within #source{opacity:1}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}#artist{font-size:clamp(16px,3.3vh,44px)}#mediaWrap{bottom:25%}
#ticketOverlay{position:absolute;inset:0;z-index:4;pointer-events:none}
.ticket-big{position:absolute;bottom:7%;left:50%;width:40%;max-width:28vh;margin:0;opacity:0;transform:translateX(-50%) translateY(4vh) rotate(-2deg) scale(.92);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
.ticket-big.show{opacity:1;transform:translateX(-50%) translateY(0) rotate(-2deg) scale(1)}
.ticket-big img{display:block;width:100%;height:auto;border:.7vh solid #f4f0e8;border-radius:3px;box-shadow:0 2vh 3.4vh rgba(0,0,0,.6)}
#media{transition:opacity .7s ease}
@media (prefers-reduced-motion:reduce){.ticket-big,#media{transition:opacity .3s ease}}
@media (max-aspect-ratio:9/16){#artist{font-size:6vw}#eyebrow{font-size:2vw}#venue{font-size:3.1vw}#location{font-size:2.4vw}#support{font-size:2.2vw}#pageCount{font-size:2vw}#info{padding-bottom:5vw}#mediaWrap{bottom:26%}}
@media (prefers-reduced-motion:reduce){#controls{transition:none}}
#media{position:absolute;inset:0;width:100%;height:100%;min-width:0;min-height:0;object-fit:contain}
#shade{z-index:1}