@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Thai:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#210b08;--panel:#35120e;--line:#71382c;--muted:#dfbcb0;--accent:#ffb9a0;--gradient:linear-gradient(135deg,#fff5ba 0%,#ff9c88 25%,#ff5b65 52%,#b6001c 100%)}*{box-sizing:border-box}body{margin:0;background:var(--gradient);background-attachment:fixed;min-height:100vh;color:#f5f6ee;font-family:'Space Grotesk','IBM Plex Sans Thai',sans-serif;font-size:16px}button,a{-webkit-tap-highlight-color:transparent}header{min-height:108px;max-width:1400px;margin:auto;padding:28px 5%;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.brand{color:inherit;text-decoration:none;font-size:25px;line-height:1;font-weight:700;letter-spacing:-1px}.brand>span{display:block;font-size:14px;letter-spacing:2px;margin-top:7px;color:var(--accent)}.brand small{display:block;margin-top:9px;font-size:11px;letter-spacing:4px;font-weight:400}.header-right{display:flex;gap:28px;align-items:center;font-size:12px;letter-spacing:1px;color:var(--muted)}.demo{border:1px solid var(--line);padding:7px 12px;border-radius:30px;font-size:14px;letter-spacing:0}main{max-width:1400px;margin:auto;padding:0 5%}.heading{display:flex;align-items:flex-end;justify-content:space-between;padding:54px 0 45px}.eyebrow{font-size:12px;font-weight:600;letter-spacing:2px;color:var(--muted)}h1{font-size:clamp(48px,6.5vw,88px);line-height:1.23;margin:17px 0 0;font-weight:600;letter-spacing:-2px}.accent{color:var(--accent)}.intro{display:flex;gap:25px;align-items:center;padding-bottom:10px}.intro p{color:#f0c9bb;line-height:1.8;margin:0}.asterisk{font-size:88px;line-height:1;color:var(--accent)}.schedule{border-top:1px solid var(--line);padding-bottom:35px}.section-top{display:flex;align-items:center;justify-content:space-between;padding:25px 0 20px}.section-top h2{font-size:20px;margin:0;font-weight:500}.section-top>span{font-size:14px;color:var(--muted)}.days{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}.days button{font:inherit;border:1px solid var(--line);border-radius:5px;background:transparent;color:#f5d9cd;padding:14px 6px;cursor:pointer;transition:background .15s}.days button small{display:block;letter-spacing:1px;font-size:12px;color:var(--muted);margin-top:4px}.days button:hover{background:#632819}.days button[aria-selected=true]{background:linear-gradient(135deg,#fff5ba,#ff9c88);color:#230804;border-color:#ffb9a0;font-weight:600}.days button[aria-selected=true] small{color:#3a1009}.days button:focus-visible{outline:3px solid white;outline-offset:3px}.lineup-head{display:flex;align-items:center;justify-content:space-between;margin:35px 0 20px}.lineup-head h2{font-size:28px;margin:5px 0 0;font-weight:500}.lineup-head>span{font-size:14px;color:var(--muted)}.gig{display:grid;grid-template-columns:1fr;gap:28px;align-items:center;padding:28px 32px;background:linear-gradient(110deg,rgba(137,52,20,.42),rgba(84,17,35,.45));border:1px solid var(--line);border-radius:6px;margin:10px 0;position:relative}.gig:first-child{border-left:3px solid var(--accent)}.time{font-size:25px}.time small{display:block;color:var(--muted);font-size:14px;margin-top:5px}.band h3{font-size:28px;font-weight:500;margin:0}.band p{color:var(--muted);font-size:14px;margin:0}.genre{border:1px solid #474d3e;border-radius:30px;padding:7px 15px;font-size:13px;color:#cbd4be}.note{display:flex;gap:12px;color:var(--muted);font-size:14px;padding:18px 0 40px}.note>span{color:var(--accent)}footer{display:flex;justify-content:space-between;gap:15px;padding:24px 0;border-top:1px solid var(--line);color:var(--muted);font-size:12px}footer>span:first-child{color:var(--accent);letter-spacing:1px}@media(max-width:650px){header{padding:25px 6%}.header-right{font-size:0}.demo{font-size:12px}main{padding:0 6%}.heading{padding:35px 0}.intro{display:none}h1{font-size:56px}.section-top h2{font-size:18px}.section-top>span{font-size:12px}.days{gap:4px}.days button{font-size:14px;padding:12px 2px}.days button small{font-size:10px}.gig{grid-template-columns:1fr;gap:15px;padding:22px 18px}.time{font-size:21px}.band h3{font-size:23px}.genre{grid-column:2;justify-self:start;font-size:12px;padding:4px 10px}.lineup-head h2{font-size:25px}.note{font-size:12px}footer{flex-wrap:wrap}footer>span:nth-child(2){order:3;width:100%}}

.accent,.asterisk{background:var(--gradient);background-clip:text;-webkit-background-clip:text;color:transparent}.brand{line-height:1.1}h1{letter-spacing:0}@media(max-width:420px){.header-right{display:none}}

/* Reference palette: cream upper left, coral center, crimson lower right. */
header,.heading{color:#300b12}
header{border-bottom-color:rgba(48,11,18,.28)}
header .brand>span,header .header-right,.heading .eyebrow,.intro p{color:#4d1620}
.demo{border-color:rgba(48,11,18,.35)}
.heading .accent,.heading .asterisk{background:none;color:#780e23}
.schedule{background:rgba(37,5,13,.94);border:1px solid rgba(255,220,207,.3);border-radius:16px;padding:0 28px 28px;box-shadow:0 16px 45px rgba(71,0,12,.12)}
.gig{background:linear-gradient(120deg,rgba(255,156,136,.16),rgba(182,0,28,.2))}
footer{color:#fff4e8;border:0;text-shadow:0 1px 3px rgba(48,0,10,.65)}
footer>span:first-child{color:#fff5ba}
@media(max-width:650px){.schedule{padding:0 14px 20px}.gig{padding:22px 16px}.section-top{gap:10px}.section-top h2{font-size:16px}}

.band-row{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.video-toggle{font:inherit;font-size:14px;cursor:pointer;border:1px solid #ffb9a0;border-radius:24px;background:linear-gradient(135deg,#fff5ba,#ff9c88);color:#300b12;padding:9px 18px}
.video-toggle:focus-visible{outline:3px solid #fff5ba;outline-offset:4px}
.video-panel{width:100%;max-width:360px;min-width:0}
.video-panel[hidden]{display:none}
.video-panel iframe{display:block;width:100%;aspect-ratio:9/16;border:0;border-radius:12px;background:#090909}
.video-panel a{display:inline-block;color:#ffe6d3;font-size:14px;margin-top:14px;text-underline-offset:4px}

/* Keep mobile artist names and clip controls on separate, tidy rows. */
@media(max-width:650px){
  .band-row{display:block}
  .band-row h3{margin:0 0 14px;width:100%}
  .band-row .video-toggle{display:inline-flex;margin:0 8px 8px 0}
}