:root {
  color-scheme: dark;
  --ink: #101b4f;
  --deep: #0a1237;
  --blue: #1e408c;
  --signal: #2e62ba;
  --haze: #7893c8;
  --star: #c9d4ed;
  --white: #f8faff;
  --muted: #9baed2;
  --line: rgba(201, 212, 237, .17);
  --brick: #b96143;
  --gold: #e2ae73;
  --display: 'Space Grotesk', 'Arial Narrow', sans-serif;
  --body: 'DM Sans', system-ui, sans-serif;
  --mono: 'DM Mono', monospace;
  font-family: var(--body);
  background: var(--deep);
  color: var(--white);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 86px; }
body { margin: 0; min-width: 320px; background: var(--deep); color: var(--white); }
button, a { font: inherit; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }
::selection { background: #7893c8; color: var(--ink); }
.site-shell { width: 100%; overflow: hidden; padding-bottom: 86px; }

.topbar { height: 76px; padding: 0 clamp(22px, 5.7vw, 88px); display: flex; align-items: center; justify-content: space-between; gap: 26px; background: rgba(9, 17, 52, .97); border-bottom: 1px solid rgba(201, 212, 237, .11); position: relative; z-index: 20; }
.brand { display: inline-flex; align-items: center; flex: 0 0 auto; }
.brand-name { display: inline-block; font-family: var(--display); font-size: 12px; font-weight: 700; line-height: .94; letter-spacing: .14em; }.brand-name i { font-style: normal; color: var(--haze); }
.desktop-nav { display: flex; align-items: center; gap: clamp(22px, 3vw, 45px); margin-left: auto; margin-right: auto; }
.desktop-nav a { color: #bdc8e0; font-size: 12px; letter-spacing: .025em; transition: color .2s ease; }.desktop-nav a:hover, .desktop-nav a.active { color: var(--white); }.desktop-nav a.active::after { content: ''; display: block; margin-top: 7px; width: 14px; height: 1px; background: var(--gold); }
.top-actions { display: flex; align-items: center; gap: 18px; }.text-button, .footer-links button { background: none; border: 0; color: #d5deef; cursor: pointer; font-size: 11px; }.text-button span { color: var(--gold); margin-left: 3px; }.sign-in { background: transparent; border: 1px solid rgba(201,212,237,.52); padding: 9px 17px; border-radius: 999px; font-size: 11px; cursor: pointer; transition: background .2s, color .2s; }.sign-in:hover { background: var(--white); color: var(--ink); }

.hero { min-height: 670px; height: min(740px, calc(100svh - 76px)); max-height: 830px; position: relative; display: flex; align-items: center; padding: 82px clamp(22px, 8vw, 128px) 90px; isolation: isolate; overflow: hidden; background: linear-gradient(135deg, #1e408c, #101b4f 60%, #091234); }
.hero-art, .hero-wash { position: absolute; inset: 0; width: 100%; height: 100%; }.hero-art { object-fit: cover; object-position: center 55%; z-index: -3; }.hero-wash { z-index: -2; background: linear-gradient(90deg, rgba(7, 14, 43, .94) 0%, rgba(10, 20, 58, .79) 36%, rgba(10, 23, 63, .33) 74%, rgba(10, 18, 55, .62) 100%), linear-gradient(0deg, rgba(9, 17, 49, .94) 0%, transparent 37%, rgba(16,27,79,.08) 78%); }
.hero::after { content: ''; position: absolute; inset: 0; z-index: -1; opacity: .12; pointer-events: none; background-image: radial-gradient(rgba(248,250,255,.9) .6px,transparent .8px); background-size: 89px 89px; animation: stars-drift 100s linear infinite; }
.constellation { position: absolute; inset: 0; width: 100%; height: 76%; z-index: -1; opacity: .35; overflow: visible; animation: star-breathe 20s ease-in-out infinite alternate; pointer-events: none; }.star-lines { fill: none; stroke: #c9d4ed; stroke-width: 1; opacity: .52; }.star-dots { fill: #f8faff; filter: drop-shadow(0 0 5px rgba(248,250,255,.7)); }
.hero-content { max-width: 690px; position: relative; z-index: 1; padding-bottom: 12px; }.eyebrow, .section-label, .micro-label, .card-kicker, .format-tag, .room-number, .room-status, .poster-caption, .hero-index, .footer>small { font-family: var(--mono); font-size: 9px; letter-spacing: .13em; }.eyebrow { display: flex; align-items: center; gap: 11px; color: #d9e2f4; }.live-dot { width: 7px; height: 7px; display: inline-block; background: #ee8165; border-radius: 50%; box-shadow: 0 0 10px rgba(238,129,101,.7); animation: live-pulse 2.2s ease-in-out infinite; }.eyebrow-line { width: 24px; height: 1px; background: rgba(201,212,237,.45); margin-left: 1px; }
h1, h2, h3, p { margin-top: 0; }.hero h1 { max-width: 760px; margin: 25px 0 16px; font-family: var(--display); font-size: clamp(62px, 8.2vw, 124px); line-height: .87; letter-spacing: -.075em; font-weight: 600; text-wrap: balance; }.hero h1 em, .room-top h2 em, .hype-copy h2 em, .final-cta h2 em { font-style: normal; color: #bdd0ef; }.hero-copy { max-width: 400px; margin: 0 0 27px; color: #d0dbed; font-size: 14px; line-height: 1.65; }.hero-ctas { display: flex; align-items: center; gap: 11px; flex-wrap: wrap; }.button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; border: 1px solid transparent; border-radius: 999px; padding: 14px 20px; cursor: pointer; font-size: 11px; line-height: 1; letter-spacing: .015em; transition: transform .2s ease, background .2s ease, border-color .2s ease; }.button:hover { transform: translateY(-2px); }.button-light { background: var(--white); color: #111a47; font-weight: 700; box-shadow: 0 10px 27px rgba(5, 13, 39, .2); }.button-light:hover { background: #dce7fa; }.play-symbol { font-size: 10px; }.button-ghost { color: var(--white); border-color: rgba(248,250,255,.44); background: rgba(9,17,52,.15); }.button-ghost:hover { background: rgba(248,250,255,.12); }.button-blue { background: var(--signal); color: white; font-weight: 600; }.button-blue:hover { background: #3c74cb; }.button-outline { color: var(--white); background: transparent; border-color: rgba(248,250,255,.48); }.button-outline:hover { background: rgba(248,250,255,.1); }
.hero-footnote { display: flex; align-items: center; gap: 10px; margin-top: 52px; color: #c4d0e8; font-family: var(--mono); font-size: 8px; letter-spacing: .08em; }.footnote-sep { color: #8497bd; }.mini-wave { height: 15px; display: flex; gap: 2px; align-items: center; }.mini-wave i { width: 2px; background: #e1b27a; border-radius: 3px; animation: wave 1.3s ease-in-out infinite alternate; }.mini-wave i:nth-child(1),.mini-wave i:nth-child(7){height:5px}.mini-wave i:nth-child(2),.mini-wave i:nth-child(6){height:10px;animation-delay:.2s}.mini-wave i:nth-child(3),.mini-wave i:nth-child(5){height:7px;animation-delay:.5s}.mini-wave i:nth-child(4){height:14px;animation-delay:.1s}
.on-air-card { position: absolute; z-index: 2; width: 248px; right: clamp(22px, 7.5vw, 112px); top: 50%; transform: translateY(-46%); padding: 13px 14px 15px; background: rgba(10, 19, 55, .76); border: 1px solid rgba(208,220,242,.36); backdrop-filter: blur(18px); border-radius: 9px; box-shadow: 0 24px 55px rgba(0,0,0,.23); }.card-topline { display: flex; justify-content: space-between; align-items: center; font-family: var(--mono); font-size: 8px; color: #dce7fa; letter-spacing: .12em; }.card-topline .live-dot { width: 5px; height: 5px; margin-right: 6px; }.mono { font-family: var(--mono); color: #8ca4d0; }.on-air-art { height: 132px; margin: 13px 0 15px; background: radial-gradient(circle at 65% 45%,#586fb5 0,#243f84 35%,#101b4f 76%); position: relative; overflow: hidden; border-radius: 4px; }.on-air-art::before { content: ''; position: absolute; width: 190px; height: 190px; left: 35px; top: -24px; border: 1px solid rgba(225,234,249,.22); border-radius: 50%; box-shadow: 0 0 0 15px rgba(201,212,237,.03),0 0 0 37px rgba(201,212,237,.04); }.on-air-orbit { position: absolute; border: 1px solid rgba(225,234,249,.36); border-radius: 50%; transform: rotate(-28deg); }.orbit-one { width: 202px; height: 73px; left: 14px; top: 32px; }.orbit-two { width: 190px; height: 55px; left: 27px; top: 40px; transform: rotate(23deg); }.on-air-sun { position: absolute; width: 8px; height: 8px; border-radius: 50%; background: #f2d6a6; top: 43px; left: 136px; box-shadow: 0 0 19px #e2ae73; }.on-air-caption { position: absolute; left: 15px; bottom: 13px; color: rgba(248,250,255,.9); font: 500 17px/.9 var(--display); letter-spacing: -.04em; }.on-air-caption i { color: #e9bb83; font-style: normal; }.card-kicker { color: #9eb4da; margin: 0 0 7px; font-size: 8px; }.on-air-card h2 { font: 500 24px/.98 var(--display); letter-spacing: -.05em; margin-bottom: 12px; }.artist-line { display: flex; gap: 9px; align-items: center; border-top: 1px solid rgba(201,212,237,.18); padding-top: 10px; }.avatar { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: #b9775d; font-family: var(--display); font-size: 12px; }.artist-line b, .artist-line small { display: block; }.artist-line b { font-size: 10px; font-weight: 600; }.artist-line small { margin-top: 2px; font-size: 8px; color: #9fb2d4; }.icon-button { margin-left: auto; background: transparent; border: 0; color: var(--white); cursor: pointer; font-size: 16px; }.hero-index { position: absolute; right: clamp(23px, 7.5vw, 112px); bottom: 28px; display: flex; gap: 9px; align-items: center; color: rgba(233,239,250,.62); font-size: 8px; }.index-rule { height: 1px; width: 32px; background: rgba(233,239,250,.38); }

.signal-strip { min-height: 85px; display: grid; grid-template-columns: 1fr 1fr 1fr auto; align-items: center; padding: 12px clamp(22px, 7.7vw, 118px); gap: 22px; background: #101b4f; border-bottom: 1px solid var(--line); }.signal-cell { display: flex; align-items: center; gap: 11px; }.signal-icon { color: #e7b47d; font-size: 18px; width: 23px; }.signal-cell small,.signal-cell b { display: block; }.signal-cell small { font-family: var(--mono); font-size: 7px; letter-spacing: .1em; color: #90a4ca; margin-bottom: 5px; }.signal-cell b { font-size: 10px; font-weight: 500; color: #e4eafa; }.signal-link, .inline-link { font-size: 10px; color: #dbe5f6; white-space: nowrap; }.signal-link span, .inline-link span { color: var(--gold); margin-left: 5px; }

.content-section { padding: 100px clamp(22px, 7.7vw, 118px); background: #0b143e; }.section-heading,.artist-head { display: flex; justify-content: space-between; align-items: end; gap: 22px; margin-bottom: 33px; }.section-label { margin-bottom: 12px; color: #9eb1d6; font-size: 8px; }.section-label span { color: #e2ae73; margin: 0 4px; }.section-heading h2,.artist-head h2 { margin: 0; font: 500 clamp(30px,4vw,50px)/1 var(--display); letter-spacing: -.06em; }.lineup-layout { display: grid; grid-template-columns: minmax(0,1fr) minmax(235px, .36fr); gap: clamp(30px, 5vw, 76px); align-items: stretch; }.lineup-list { position: relative; }.lineup-list::before { content: ''; position: absolute; top: 24px; bottom: 25px; left: 93px; width: 1px; background: rgba(201,212,237,.23); }.lineup-item { position: relative; display: grid; grid-template-columns: 70px 20px minmax(0,1fr) 42px; gap: 12px; align-items: center; min-height: 98px; border-bottom: 1px solid var(--line); }.time-col { text-align: right; font-family: var(--mono); }.time-col span,.time-col small { display: block; }.time-col span { font-size: 11px; color: #e6edfa; }.time-col small { margin-top: 4px; color: #8499c1; font-size: 8px; letter-spacing: .08em; }.timeline-mark { position: relative; display: flex; justify-content: center; }.timeline-mark i { width: 7px; height: 7px; background: #8ea8d6; border: 1px solid #b9c9e5; border-radius: 50%; z-index: 1; }.now-item .timeline-mark i { background: #e7886b; border-color: #ffc7a8; box-shadow: 0 0 10px rgba(238,129,101,.55); }.lineup-info { padding: 15px 0; }.format-tag { display: inline-flex; font-size: 7px; letter-spacing: .1em; padding: 4px 6px; border: 1px solid rgba(153,177,217,.25); border-radius: 3px; color: #c4d2eb; }.tag-story { color: #e3bb86; border-color: rgba(227,187,134,.32); }.tag-comedy { color: #dba0ad; border-color: rgba(219,160,173,.35); }.tag-music { color: #a9c5f0; border-color: rgba(169,197,240,.34); }.tag-open { color: #b9d8c7; border-color: rgba(185,216,199,.33); }.lineup-info h3 { font: 500 17px/1.15 var(--display); letter-spacing: -.03em; margin: 7px 0 4px; }.lineup-info p { margin: 0; color: #92a6cc; font-size: 9px; }.lineup-info p span { color: #657ca7; padding: 0 3px; }.item-action { width: 33px; height: 33px; border-radius: 50%; border: 1px solid rgba(201,212,237,.34); background: transparent; color: #dce6f8; cursor: pointer; transition: .2s; }.item-action:hover { color: var(--ink); background: var(--white); }.book-inline { color: #d6ad7e; border-color: rgba(214,173,126,.5); font-size: 19px; font-weight: 300; }
.booking-card { position: relative; overflow: hidden; background: #122255; border: 1px solid rgba(201,212,237,.2); border-radius: 7px; padding: 17px 19px 15px; display: flex; flex-direction: column; min-height: 390px; }.booking-card-top { display: flex; align-items: center; justify-content: space-between; position: relative; z-index: 2; }.micro-label { color: #acc0df; font-size: 7px; }.queue-pulse { display: inline-flex; gap: 5px; align-items: center; font: 8px var(--mono); letter-spacing: .08em; color: #b9d8c7; }.queue-pulse i { width: 5px; height: 5px; border-radius: 50%; background: #a4d1af; }.booking-art { position: absolute; inset: 0 0 100px; overflow: hidden; background: radial-gradient(ellipse at 56% 45%,rgba(69,100,166,.45),transparent 52%); }.booking-art::before { content: ''; position: absolute; width: 170px; height: 170px; right: 10px; top: 25px; border: 1px solid rgba(193,208,233,.22); border-radius: 50%; box-shadow: 0 0 0 14px rgba(201,212,237,.025),0 0 0 31px rgba(201,212,237,.025); }.booking-star { position: absolute; width: 4px; height: 4px; background: var(--white); border-radius: 50%; box-shadow: 0 0 7px #fff; }.star-a { top: 62px; left: 24%; }.star-b { top: 104px; right: 23%; width: 5px; height: 5px; }.star-c { top: 142px; right: 39%; }.booking-thread { position: absolute; left: 20%; right: 12%; top: 87px; height: 70px; border-top: 1px solid rgba(201,212,237,.38); border-right: 1px solid rgba(201,212,237,.38); transform: skew(-32deg) rotate(-18deg); }.booking-window { position: absolute; top: 70px; right: 17%; width: 66px; height: 78px; padding: 5px; border: 1px solid rgba(231,187,133,.55); background: #332f54; display: grid; grid-template-columns: 1fr 1fr; gap: 4px; transform: skewY(-4deg); box-shadow: 0 0 40px rgba(221,160,105,.17); }.booking-window span { background: linear-gradient(135deg,#e1ac72,#9a5b51); opacity: .86; }.booking-haze { position: absolute; bottom: -39px; right: -38px; width: 180px; height: 85px; border-radius: 70% 5% 0 0; border-top: 4px solid #c7815e; background: linear-gradient(160deg,#9c4d47,#282344 78%); opacity: .75; }.booking-orbit-text { position: absolute; left: 17px; top: 77px; font: 500 11px/.93 var(--display); letter-spacing: -.03em; color: #e7c59d; }.booking-card h3 { margin: 190px 0 8px; position: relative; z-index: 1; font: 500 25px/.95 var(--display); letter-spacing: -.05em; }.booking-card>p { position: relative; z-index: 1; color: #aebddb; font-size: 9px; line-height: 1.5; max-width: 230px; margin-bottom: 14px; }.booking-button { width: 100%; padding: 12px 15px; justify-content: space-between; border-radius: 4px; position: relative; z-index: 1; }.booking-card-foot { display: flex; justify-content: center; gap: 7px; color: #8ba0c6; font-family: var(--mono); font-size: 7px; margin-top: 12px; }

.room-section { padding: 100px clamp(22px, 7.7vw, 118px) 105px; background: #101b4f; border-top: 1px solid rgba(201,212,237,.1); }.room-top { display: flex; justify-content: space-between; align-items: end; gap: 45px; margin-bottom: 35px; }.room-top h2,.hype-copy h2 { margin: 0; font: 500 clamp(38px,5.2vw,65px)/.92 var(--display); letter-spacing: -.07em; }.room-intro { max-width: 290px; margin: 0 4% 3px 0; color: #9fb2d4; font-size: 11px; line-height: 1.6; }.room-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }.room-card { min-width: 0; }.room-visual { height: clamp(170px, 20vw, 252px); position: relative; overflow: hidden; background: #1a2c67; border: 1px solid rgba(201,212,237,.2); border-radius: 5px; }.room-number { position: absolute; z-index: 2; top: 13px; left: 14px; color: rgba(229,237,249,.74); font-size: 7px; }.room-status { position: absolute; z-index: 2; bottom: 12px; left: 14px; display: inline-flex; align-items: center; gap: 6px; color: #d5e0f2; font-size: 7px; letter-spacing: .08em; }.room-status i { width: 5px; height: 5px; border-radius: 50%; background: #d68166; }.room-status .status-soon { background: #e7b67d; }.room-open .room-visual { background: radial-gradient(ellipse at 53% 67%,#493855 0,#252958 42%,#17275c 83%); }.openmic-art { position: absolute; inset: 0; }.stage-glow { position: absolute; left: 21%; right: 20%; bottom: -34%; height: 95%; border-radius: 50% 50% 0 0; background: radial-gradient(ellipse at 50% 35%,rgba(227,157,102,.85),rgba(155,79,71,.6) 20%,rgba(69,47,75,.2) 61%,transparent 70%); filter: blur(3px); }.mic-stand { position: absolute; width: 2px; height: 115px; left: 50%; bottom: 14%; background: linear-gradient(#cdd7e8,#6676a0); transform: rotate(-8deg); z-index: 1; }.mic-stand::before { content: ''; position: absolute; top: -5px; left: -7px; width: 16px; height: 7px; border-radius: 5px; background: #d8dced; transform: rotate(14deg); }.mic-stand::after { content: ''; position: absolute; bottom: 0; left: -25px; width: 52px; height: 1px; background: #95a7c9; transform: rotate(8deg); }.room-spark { position: absolute; top: 31%; right: 26%; font-size: 14px; color: #e8bc85; }
.room-session .room-visual { background: radial-gradient(ellipse at 50% 55%,#33498a,#18265e 62%,#111c4c); }.session-art { position: absolute; inset: 0; overflow: hidden; }.disc { position: absolute; width: 148px; height: 148px; border-radius: 50%; border: 1px solid rgba(205,219,242,.45); left: 36%; top: 12%; background: repeating-radial-gradient(circle,transparent 0 8px,rgba(205,219,242,.12) 9px 10px); box-shadow: 0 0 40px rgba(153,178,220,.12); }.disc::after { content: ''; position: absolute; inset: 46%; border-radius: 50%; background: #e5bd8a; box-shadow: 0 0 10px #e5bd8a; }.disc-two { width: 96px; height: 96px; left: 15%; top: 48%; opacity: .65; }.session-line { position: absolute; width: 2px; height: 70%; left: 61%; top: 13%; background: linear-gradient(transparent,#c8d3ea,transparent); transform: rotate(45deg); opacity: .4; }
.room-story .room-visual { background: radial-gradient(ellipse at 54% 52%,#293e7d,#192758 58%,#111b4b); }.story-art { position: absolute; inset: 0; overflow: hidden; }.moon { position: absolute; width: 74px; height: 74px; border-radius: 50%; top: 19%; left: 57%; background: #d9d6d5; box-shadow: 0 0 30px rgba(222,219,215,.23); }.moon::after { content: ''; position: absolute; width: 75px; height: 75px; border-radius: 50%; top: -8px; left: 18px; background: #23356f; }.story-horizon { position: absolute; left: -4%; right: -4%; bottom: -29%; height: 78%; border-top: 1px solid rgba(201,212,237,.35); border-radius: 50% 50% 0 0; background: linear-gradient(150deg,#304480,#111b4a 70%); transform: rotate(-4deg); }.story-star { position: absolute; left: 31%; top: 36%; color: #e6ba82; font-size: 10px; }
.room-meta { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 13px 1px 5px; }.room-meta h3 { margin: 0 0 4px; font: 500 15px/1.1 var(--display); letter-spacing: -.03em; }.room-meta p { margin: 0; font-size: 8px; color: #99acce; }.room-arrow { width: 32px; height: 32px; border: 1px solid rgba(201,212,237,.34); border-radius: 50%; background: transparent; font-size: 14px; cursor: pointer; }.room-arrow:hover { background: var(--white); color: var(--ink); }

.artist-section { padding: 97px clamp(22px, 7.7vw, 118px) 104px; background: #0c153f; }.artist-head { margin-bottom: 31px; }.artist-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 13px; }.artist-card { min-width: 0; }.artist-image { height: clamp(162px, 19vw, 224px); position: relative; overflow: hidden; background: #1b2b64; }.artist-image::before { content: ''; position: absolute; inset: 0; opacity: .68; }.ari-image::before { background: radial-gradient(ellipse at 69% 26%,#ba8b75 0 6%,transparent 22%),linear-gradient(135deg,#485c8f,#213268 52%,#131a49); }.kemi-image::before { background: radial-gradient(ellipse at 39% 39%,#e0a479 0 9%,transparent 23%),linear-gradient(144deg,#6a3c4f,#4e2d59 52%,#1a2356); }.mira-image::before { background: radial-gradient(ellipse at 61% 30%,#c8b5c9 0 8%,transparent 24%),linear-gradient(135deg,#53547f,#363c75 52%,#19234f); }.image-caption { position: absolute; top: 13px; left: 13px; font: 500 11px/.94 var(--display); letter-spacing: -.025em; color: rgba(248,250,255,.81); }.artist-avatar { position: absolute; right: 13px; bottom: 13px; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font: 600 11px var(--display); background: #8a5b5c; border: 1px solid rgba(255,255,255,.45); }.artist-avatar-warm { background: #b97051; }.artist-avatar-lilac { background: #756480; }.artist-card-info { display: flex; justify-content: space-between; align-items: center; gap: 7px; padding: 10px 1px 0; }.artist-card-info h3 { font: 500 13px var(--display); letter-spacing: -.025em; margin: 0 0 3px; }.artist-card-info p { color: #93a7ca; font-size: 8px; margin: 0; }.follow-button { border: 1px solid rgba(201,212,237,.35); background: none; border-radius: 999px; color: #e0e8f6; font-size: 8px; padding: 6px 9px; white-space: nowrap; cursor: pointer; }.follow-button span { color: #dfb27c; margin-left: 3px; }.follow-button.is-following { color: #101b4f; background: #d9e2f2; }.follow-button.is-following span { color: #101b4f; }.artist-create { background: rgba(24,39,91,.37); border: 1px dashed rgba(201,212,237,.37); display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; text-align: left; padding: 16px; color: var(--white); min-height: 220px; cursor: pointer; }.create-orbit { color: #e1b47f; font-size: 20px; }.artist-create>span:nth-child(2) { font: 500 20px/.96 var(--display); letter-spacing: -.05em; }.artist-create small { font: 8px var(--mono); color: #9fb2d4; letter-spacing: .08em; }.artist-create:hover { background: rgba(48,73,137,.45); }

.hype-section { display: grid; grid-template-columns: 1fr 1fr; min-height: 470px; background: #142359; border-top: 1px solid rgba(201,212,237,.1); }.hype-visual { padding: 48px clamp(22px, 7.7vw, 118px); display: flex; align-items: center; justify-content: center; flex-direction: column; background: #15255a; }.poster-sky { width: min(350px, 100%); height: 330px; background: radial-gradient(ellipse at 75% 12%,#4567ac,#223d83 45%,#101b4f 90%); position: relative; overflow: hidden; box-shadow: 15px 18px 0 rgba(8,15,43,.17); }.poster-sky::before { content: ''; position: absolute; inset: 0; opacity: .6; background-image: radial-gradient(#fff 1px,transparent 1.4px),radial-gradient(#b9c8e2 1px,transparent 1.4px); background-size: 43px 43px,69px 69px; background-position: 9px 12px,34px 27px; }.poster-constellation { position: absolute; left: 8%; right: 8%; top: 17%; height: 26%; border-bottom: 1px solid rgba(233,239,250,.45); border-left: 1px solid rgba(233,239,250,.45); transform: skew(29deg) rotate(-14deg); }.poster-building { position: absolute; bottom: 0; right: 0; width: 64%; height: 36%; border-top: 5px solid #c88462; border-radius: 68% 0 0 0; background: linear-gradient(150deg,#a7544b,#713644 65%,#30244b); display: flex; justify-content: space-evenly; align-items: flex-start; padding-top: 27px; }.poster-building span { width: 19px; height: 33px; background: linear-gradient(#f0bd80,#bd7257); border: 2px solid #6d3a45; box-shadow: 0 0 12px rgba(237,176,111,.5); }.poster-copy { position: absolute; left: 22px; top: 25px; color: #f8faff; display: flex; flex-direction: column; }.poster-copy>span { font: 8px var(--mono); letter-spacing: .13em; color: #c9d4ed; }.poster-copy>b { margin: 26px 0 11px; font: 700 58px/.77 var(--display); letter-spacing: -.08em; }.poster-copy>i { font: 10px var(--body); color: #d8e2f1; }.poster-stamp { position: absolute; top: 34px; right: 21px; border: 1px solid rgba(248,250,255,.45); border-radius: 50%; width: 48px; height: 48px; display: grid; place-items: center; text-align: center; font: 7px/1.1 var(--mono); color: #eed1a4; transform: rotate(12deg); }.poster-caption { width: min(350px,100%); display: flex; justify-content: space-between; padding-top: 13px; color: #9eb1d5; font-size: 7px; }.poster-caption span { color: #e3b27a; }.hype-copy { padding: 77px clamp(30px, 6vw, 95px); display: flex; flex-direction: column; justify-content: center; }.hype-copy h2 { margin-bottom: 17px; }.hype-copy>p:not(.section-label) { max-width: 390px; color: #a8bad9; font-size: 11px; line-height: 1.7; margin-bottom: 20px; }.hype-actions { display: flex; gap: 9px; flex-wrap: wrap; }.hype-actions .button { font-size: 9px; padding: 12px 15px; }.social-note { display: flex; gap: 10px; align-items: center; border-top: 1px solid var(--line); margin-top: 24px; padding-top: 15px; }.wa-icon { width: 25px; height: 25px; display: grid; place-items: center; border: 1px solid rgba(201,212,237,.38); border-radius: 50%; color: #c4d5c4; }.social-note b,.social-note small { display: block; }.social-note b { font-size: 9px; font-weight: 600; }.social-note small { font-size: 8px; margin-top: 3px; color: #92a7ce; }
.final-cta { padding: 85px 20px 73px; text-align: center; position: relative; background: radial-gradient(ellipse at 50% -20%,#244781,#101b4f 62%,#0a143e); border-top: 1px solid rgba(201,212,237,.15); overflow: hidden; }.final-cta::before { content: ''; position: absolute; left: 5%; right: 5%; top: 4%; height: 140px; opacity: .14; background-image: radial-gradient(#fff .7px,transparent 1.1px); background-size: 77px 77px; }.cta-stars { color: #d7bf9f; font-size: 10px; margin-bottom: 17px; }.final-cta .section-label { margin-bottom: 15px; }.final-cta h2 { font: 500 clamp(40px,6vw,72px)/.91 var(--display); letter-spacing: -.065em; margin-bottom: 24px; }.final-cta .button { position: relative; }.cta-foot { margin: 20px auto 0; max-width: 380px; color: #97aaca; font-size: 9px; line-height: 1.5; }
.footer { min-height: 170px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 18px; padding: 28px clamp(22px, 7.7vw, 118px) 42px; background: #080f31; position: relative; }.footer>p { margin: 0; color: #91a4c8; font-size: 9px; }.footer-links { display: flex; gap: 18px; align-items: center; font-size: 9px; color: #bdcbe2; }.footer-links button { padding: 0; font-size: 9px; }.footer>small { position: absolute; left: clamp(22px, 7.7vw, 118px); bottom: 17px; color: #677da8; font-size: 7px; }

.mobile-tabs { display: none; }.player-dock { position: fixed; z-index: 25; left: 50%; transform: translateX(-50%); bottom: max(12px, env(safe-area-inset-bottom)); width: min(1120px, calc(100% - 40px)); height: 62px; border-radius: 9px; border: 1px solid rgba(201,212,237,.27); background: rgba(9,17,51,.93); backdrop-filter: blur(22px); box-shadow: 0 12px 40px rgba(0,0,0,.35); display: grid; grid-template-columns: minmax(0,1fr) 56px minmax(0,1.15fr) 34px; align-items: center; gap: 16px; padding: 0 16px; }.dock-current { display: flex; align-items: center; gap: 9px; min-width: 0; }.dock-cover { width: 36px; height: 36px; background: radial-gradient(circle at 60% 35%,#6785c1,#233c7a 55%,#121d50); border: 1px solid rgba(201,212,237,.25); position: relative; overflow: hidden; }.dock-cover::before { content: ''; position: absolute; width: 42px; height: 42px; border: 1px solid rgba(237,239,245,.45); border-radius: 50%; top: 3px; left: 0; }.dock-sun { width: 5px; height: 5px; background: #e4bb83; border-radius: 50%; position: absolute; top: 9px; left: 20px; }.dock-text { min-width: 0; }.dock-text b,.dock-text small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.dock-text b { font: 500 10px var(--display); }.dock-text small { margin-top: 3px; color: #8da2c7; font-size: 8px; }.dock-controls { display: flex; align-items: center; justify-content: center; gap: 13px; }.dock-play { border: 0; background: none; cursor: pointer; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--white); color: var(--ink); font-size: 9px; }.dock-play .play-symbol { margin-left: 1px; }.dock-play.is-playing .play-symbol { font-size: 0; width: 7px; height: 9px; border-left: 2px solid var(--ink); border-right: 2px solid var(--ink); }.dock-progress { display: flex; align-items: center; gap: 8px; font-family: var(--mono); font-size: 7px; color: #8297be; }.progress-track { height: 2px; background: rgba(201,212,237,.23); flex: 1; overflow: hidden; }.progress-track span { display: block; width: 2%; height: 100%; background: #e4bb83; transition: width .3s linear; }.dock-share { color: #c9d4ed; border: 0; background: transparent; font-size: 15px; cursor: pointer; }

.modal-backdrop { position: fixed; z-index: 70; inset: 0; padding: 18px; background: rgba(3,8,28,.77); backdrop-filter: blur(10px); display: grid; place-items: center; }.modal-backdrop[hidden] { display: none; }.modal { position: relative; width: min(450px,100%); max-height: min(88svh,820px); overflow-y: auto; padding: 31px; background: #101b4f; border: 1px solid rgba(201,212,237,.3); box-shadow: 0 30px 90px rgba(0,0,0,.45); border-radius: 9px; }.modal-close { position: absolute; top: 12px; right: 14px; width: 30px; height: 30px; background: none; border: 1px solid rgba(201,212,237,.27); color: #d8e2f2; border-radius: 50%; font-size: 18px; cursor: pointer; }.modal .section-label { margin-top: 8px; }.modal h2 { font: 500 35px/.98 var(--display); letter-spacing: -.06em; margin: 15px 35px 10px 0; }.modal-copy { color: #a8b8d4; font-size: 11px; line-height: 1.6; margin-bottom: 21px; }.form-field { display: block; margin: 14px 0; }.form-field span { display: block; color: #a9bbd9; font-family: var(--mono); font-size: 8px; letter-spacing: .1em; margin-bottom: 7px; }.form-field input,.form-field select,.form-field textarea { width: 100%; min-height: 42px; border: 1px solid rgba(201,212,237,.27); border-radius: 4px; color: var(--white); background: #0b153e; padding: 10px 12px; font: 11px var(--body); }.form-field textarea { min-height: 76px; resize: vertical; }.form-field select option { background: #0b153e; }.modal .button { width: 100%; margin-top: 11px; border-radius: 4px; }.modal .inline-note { margin: 12px 0 0; color: #8298be; font-size: 8px; line-height: 1.5; text-align: center; }.social-buttons { display: grid; gap: 9px; margin-top: 19px; }.social-button { display: flex; align-items: center; justify-content: space-between; gap: 8px; border: 1px solid rgba(201,212,237,.3); border-radius: 4px; background: rgba(9,18,54,.5); color: #e9eff8; padding: 12px 14px; font-size: 10px; cursor: pointer; }.social-button:hover { background: rgba(61,88,149,.4); }.social-button span:last-child { color: #93a8cf; font-size: 8px; }.modal-success { border-left: 2px solid #e2ae73; padding: 11px 13px; margin-top: 14px; background: rgba(226,174,115,.08); color: #e4d2b8; font-size: 9px; line-height: 1.5; }.booking-summary { border: 1px solid rgba(201,212,237,.22); background: #0b153e; padding: 12px; margin: 16px 0; display: flex; justify-content: space-between; align-items: center; font-size: 9px; }.booking-summary b { color: #e2ae73; font-family: var(--mono); font-weight: 400; }.booking-summary small { display: block; color: #90a5ca; font-size: 8px; margin-top: 4px; }.toast { position: fixed; z-index: 90; left: 50%; bottom: 96px; transform: translate(-50%,14px); opacity: 0; pointer-events: none; padding: 11px 16px; max-width: calc(100vw - 32px); background: #f8faff; color: #101b4f; border-radius: 999px; box-shadow: 0 8px 25px rgba(0,0,0,.3); font-size: 10px; transition: opacity .2s ease, transform .2s ease; white-space: nowrap; }.toast.show { opacity: 1; transform: translate(-50%,0); }

@keyframes live-pulse { 50% { box-shadow: 0 0 0 4px rgba(238,129,101,.12),0 0 12px rgba(238,129,101,.7); } }
@keyframes wave { to { transform: scaleY(.55); opacity: .65; } }
@keyframes stars-drift { to { background-position: 89px 89px; } }
@keyframes star-breathe { to { opacity: .2; transform: translateY(3px); } }

@media (min-width: 1500px) { .hero { padding-left: max(128px, calc((100vw - 1280px)/2)); padding-right: max(128px, calc((100vw - 1280px)/2)); }.hero-index { right: max(112px,calc((100vw - 1280px)/2)); } }
@media (max-width: 980px) { .hero { min-height: 620px; height: 690px; padding-left: 7vw; }.hero h1 { font-size: clamp(58px,9vw,92px); }.on-air-card { width: 218px; right: 5vw; }.signal-strip { grid-template-columns: repeat(3,1fr); }.signal-link { display: none; }.lineup-layout { grid-template-columns: minmax(0,1fr) minmax(220px,.44fr); gap: 28px; }.lineup-list::before { left: 84px; }.lineup-item { grid-template-columns: 61px 20px minmax(0,1fr) 38px; gap: 10px; }.footer { grid-template-columns: auto 1fr; }.footer-links { grid-column: 2; justify-self: end; } }
@media (max-width: 700px) { 
  html { scroll-padding-top: 16px; }.site-shell { padding-bottom: calc(145px + env(safe-area-inset-bottom)); }.topbar { height: 64px; padding: 0 19px; gap: 8px; }.brand-name { font-size: 10px; }.desktop-nav { display: none; }.top-actions { gap: 10px; }.text-button { font-size: 9px; }.sign-in { font-size: 9px; padding: 8px 12px; }
  .hero { min-height: 770px; height: calc(100svh - 64px); max-height: 850px; align-items: flex-start; padding: 62px 22px 130px; }.hero-art { object-position: 61% center; }.hero-wash { background: linear-gradient(90deg,rgba(7,14,43,.88),rgba(10,20,58,.56) 67%,rgba(10,18,55,.35)),linear-gradient(0deg,rgba(9,17,49,.97) 0%,rgba(9,17,49,.46) 42%,rgba(16,27,79,.05) 100%); }.hero-content { max-width: 100%; }.eyebrow { font-size: 7px; gap: 7px; }.eyebrow-line { width: 15px; }.hero h1 { font-size: clamp(56px,15.6vw,82px); line-height: .89; letter-spacing: -.076em; margin: 20px 0 13px; }.hero-copy { max-width: 300px; font-size: 12px; margin-bottom: 19px; }.hero-ctas { gap: 8px; }.hero-ctas .button { padding: 12px 14px; font-size: 9px; }.hero-footnote { margin-top: 25px; flex-wrap: wrap; gap: 7px; font-size: 7px; max-width: 320px; }.on-air-card { top: auto; bottom: 93px; left: 22px; right: auto; transform: none; width: min(287px, calc(100% - 44px)); padding: 10px 11px; display: grid; grid-template-columns: 92px 1fr; column-gap: 11px; }.card-topline { grid-column: 1/-1; padding-bottom: 8px; }.on-air-art { grid-column: 1; grid-row: 2 / span 3; height: 86px; margin: 0; }.on-air-art::before { width: 120px; height: 120px; left: -5px; top: -14px; }.orbit-one { width: 120px; height: 47px; left: -11px; top: 17px; }.orbit-two { width: 118px; height: 40px; left: -4px; top: 21px; }.on-air-sun { top: 25px; left: 61px; width: 6px; height: 6px; }.on-air-caption { font-size: 11px; left: 8px; bottom: 8px; }.card-kicker { grid-column: 2; align-self: end; margin: 1px 0 4px; font-size: 7px; }.on-air-card h2 { grid-column: 2; font-size: 20px; margin: 0 0 6px; }.artist-line { grid-column: 2; padding-top: 6px; gap: 6px; }.avatar { width: 21px; height: 21px; font-size: 9px; }.artist-line b { font-size: 8px; }.artist-line small { font-size: 7px; }.hero-index { display: none; }
  .signal-strip { grid-template-columns: 1fr 1fr; min-height: 70px; gap: 10px; padding: 13px 21px; }.signal-cell:nth-child(3) { display: none; }.signal-cell { gap: 7px; }.signal-icon { width: 18px; font-size: 15px; }.signal-cell small { font-size: 6px; margin-bottom: 3px; }.signal-cell b { font-size: 8px; }
  .content-section,.room-section,.artist-section { padding: 67px 20px 70px; }.section-heading,.artist-head { align-items: end; margin-bottom: 25px; }.section-label { font-size: 7px; margin-bottom: 9px; }.section-heading h2,.artist-head h2 { font-size: 35px; }.inline-link { font-size: 8px; }.lineup-layout { grid-template-columns: 1fr; gap: 22px; }.lineup-list::before { left: 69px; top: 22px; bottom: 18px; }.lineup-item { min-height: 84px; grid-template-columns: 50px 18px minmax(0,1fr) 33px; gap: 9px; }.time-col span { font-size: 9px; }.time-col small { font-size: 7px; }.format-tag { font-size: 6px; padding: 3px 5px; }.lineup-info h3 { font-size: 14px; margin: 5px 0 3px; }.lineup-info p { font-size: 8px; }.item-action { width: 29px; height: 29px; font-size: 10px; }.booking-card { min-height: 358px; padding: 15px 17px; }.booking-art { bottom: 96px; }.booking-card h3 { margin-top: 177px; font-size: 24px; }.booking-card>p { font-size: 9px; max-width: 265px; }.booking-card-foot { font-size: 7px; }
  .room-top { display: block; margin-bottom: 25px; }.room-top h2,.hype-copy h2 { font-size: 45px; }.room-intro { margin: 17px 0 0; max-width: 300px; font-size: 10px; }.room-grid { grid-template-columns: 1fr; gap: 23px; }.room-visual { height: 220px; }.room-meta h3 { font-size: 16px; }.room-meta p { font-size: 8px; }.room-arrow { width: 31px; height: 31px; }
  .artist-head { align-items: start; flex-direction: column; gap: 14px; }.artist-grid { grid-template-columns: 1fr 1fr; gap: 18px 11px; }.artist-image { height: 185px; }.artist-card-info { align-items: start; flex-direction: column; gap: 7px; }.artist-card-info h3 { font-size: 13px; }.artist-card-info p { font-size: 7px; }.artist-create { min-height: 185px; padding: 12px; }.artist-create>span:nth-child(2) { font-size: 19px; }.artist-create small { font-size: 6px; }
  .hype-section { grid-template-columns: 1fr; }.hype-visual { padding: 36px 20px 28px; }.poster-sky { width: min(310px,100%); height: 292px; }.poster-copy>b { font-size: 53px; }.hype-copy { padding: 49px 23px 55px; }.hype-copy h2 { font-size: 48px; }.hype-copy>p:not(.section-label) { font-size: 10px; }.hype-actions .button { font-size: 8px; padding: 11px 12px; }.social-note { margin-top: 21px; }.final-cta { padding: 69px 20px 63px; }.final-cta h2 { font-size: 49px; }.cta-foot { font-size: 8px; max-width: 275px; }
  .footer { padding: 27px 21px 44px; grid-template-columns: 1fr; gap: 12px; }.footer>p { margin-top: 2px; }.footer-links { grid-column: 1; justify-self: start; gap: 18px; }.footer>small { left: 21px; bottom: 17px; font-size: 6px; }
  .mobile-tabs { position: fixed; z-index: 24; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: repeat(4,1fr); align-items: center; padding: 7px 10px max(8px, env(safe-area-inset-bottom)); height: calc(57px + env(safe-area-inset-bottom)); background: rgba(8,15,44,.97); border-top: 1px solid rgba(201,212,237,.18); backdrop-filter: blur(18px); }.mobile-tabs a,.mobile-tabs button { border: 0; background: none; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; height: 42px; color: #92a6cc; cursor: pointer; }.mobile-tabs span { font-size: 16px; line-height: 1; }.mobile-tabs small { font-size: 7px; letter-spacing: .03em; }.mobile-tabs .tab-active { color: var(--white); }.mobile-tabs .tab-active span { color: #e3b37d; }
  .player-dock { z-index: 26; bottom: calc(57px + env(safe-area-inset-bottom)); width: calc(100% - 18px); height: 55px; grid-template-columns: minmax(0,1fr) 42px 28px; gap: 8px; padding: 0 9px; border-radius: 6px; }.dock-cover { width: 31px; height: 31px; }.dock-text b { font-size: 9px; }.dock-text small { font-size: 7px; }.dock-controls { justify-content: end; gap: 5px; }.dock-skip { display: none; }.dock-play { width: 29px; height: 29px; }.dock-progress,.dock-volume { display: none; }.dock-share { font-size: 14px; }.toast { bottom: calc(130px + env(safe-area-inset-bottom)); font-size: 9px; }.modal-backdrop { padding: 10px; align-items: end; }.modal { width: 100%; max-height: 91svh; padding: 26px 22px 22px; border-radius: 12px 12px 6px 6px; }.modal h2 { font-size: 32px; }.modal .section-label { font-size: 7px; }
}
@media (max-width: 380px) { .top-actions { gap: 7px; }.text-button { font-size: 8px; }.sign-in { padding: 7px 9px; }.hero h1 { font-size: 54px; }.hero-ctas .button { padding: 11px 10px; gap: 7px; }.artist-image { height: 155px; }.section-heading h2,.artist-head h2 { font-size: 31px; } }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }

/* The archive is a separate listening destination from the live schedule. */
.archive-section { padding: 94px clamp(22px, 7.7vw, 118px) 88px; background: #111d50; border-top: 1px solid rgba(201,212,237,.12); }
.archive-heading { display: flex; align-items: end; justify-content: space-between; gap: 32px; margin-bottom: 28px; }
.archive-heading h2 { margin: 0 0 10px; font: 500 clamp(39px,5vw,62px)/.94 var(--display); letter-spacing: -.07em; }
.archive-heading>div>p:last-child { max-width: 485px; margin: 0; color: #a8bad9; font-size: 11px; line-height: 1.65; }
.archive-layout { display: grid; grid-template-columns: minmax(0,1.45fr) minmax(250px,.75fr); gap: 18px; }
.recording-list { display: grid; gap: 10px; align-content: start; }
.recording-card { min-height: 105px; display: grid; grid-template-columns: 78px minmax(0,1fr) 40px; align-items: center; gap: 15px; padding: 11px 15px 11px 11px; background: rgba(7,15,47,.53); border: 1px solid rgba(201,212,237,.17); border-radius: 5px; }
.recording-cover { width: 78px; height: 78px; position: relative; overflow: hidden; display: flex; align-items: end; padding: 8px; background: radial-gradient(circle at 70% 24%,#9e7f84,#4d527e 32%,#18295f 72%); }
.recording-cover::before,.recording-cover::after { content: ''; position: absolute; border: 1px solid rgba(233,239,250,.55); border-radius: 50%; transform: rotate(-25deg); }
.recording-cover::before { width: 105px; height: 42px; left: -12px; top: 7px; }.recording-cover::after { width: 82px; height: 34px; left: 1px; top: 17px; }
.recording-cover span { position: relative; z-index: 1; font: 6px/1.3 var(--mono); letter-spacing: .08em; color: #eff2f8; }
.cover-kemi { background: radial-gradient(circle at 67% 25%,#dd9b73,#71496b 43%,#192959 83%); }
.recording-info { min-width: 0; }.recording-info small { display: block; color: #9eb2d5; font: 7px var(--mono); letter-spacing: .08em; }
.recording-info h3 { margin: 6px 0 4px; font: 500 17px/1.08 var(--display); letter-spacing: -.035em; color: #f5f7fb; }
.recording-info p { margin: 0; color: #9daecc; font-size: 9px; }
.recording-play { width: 34px; height: 34px; border: 1px solid rgba(201,212,237,.35); border-radius: 50%; background: transparent; color: #f5f7fb; font-size: 10px; cursor: pointer; transition: background .2s,border-color .2s; }
.recording-play:hover { background: rgba(215,187,146,.15); border-color: #d7bb92; }
.hall-card { position: relative; min-height: 220px; overflow: hidden; padding: 22px; border: 1px solid rgba(215,187,146,.27); background: radial-gradient(ellipse at 88% 0%,rgba(64,91,148,.6),transparent 47%),#0a143d; }
.hall-card .section-label { position: relative; z-index: 1; }.hall-mark { position: absolute; right: 18px; top: 29px; color: rgba(215,187,146,.55); font-size: 50px; }
.hall-card h3 { position: relative; z-index: 1; margin: 46px 0 8px; max-width: 220px; font: 500 28px/.98 var(--display); letter-spacing: -.06em; }
.hall-card>p:not(.section-label) { position: relative; z-index: 1; max-width: 285px; margin: 0 0 13px; color: #a8bad9; font-size: 9px; line-height: 1.55; }
.hall-card .button { position: relative; z-index: 1; padding: 10px 12px; font-size: 8px; }
.archive-note { max-width: 760px; margin: 18px 0 0; color: #8196bd; font-size: 9px; line-height: 1.6; }
@media (max-width: 700px) { .archive-section { padding: 67px 20px 70px; }.archive-heading { align-items: flex-start; flex-direction: column; gap: 15px; margin-bottom: 23px; }.archive-heading h2 { font-size: 39px; }.archive-heading>div>p:last-child { font-size: 10px; }.archive-layout { grid-template-columns: 1fr; gap: 14px; }.recording-card { grid-template-columns: 62px minmax(0,1fr) 34px; min-height: 82px; gap: 11px; padding: 9px; }.recording-cover { width: 62px; height: 62px; }.recording-info small { font-size: 6px; }.recording-info h3 { font-size: 14px; }.recording-info p { font-size: 8px; }.recording-play { width: 30px; height: 30px; }.hall-card { min-height: 215px; padding: 18px; }.hall-card h3 { font-size: 26px; margin-top: 48px; }.archive-note { font-size: 8px; } }

@media (max-width: 980px) and (min-width: 701px) {
  .hero { padding-left: clamp(28px, 6vw, 60px); padding-right: clamp(26px, 4vw, 40px); }
  .hero-content { max-width: min(610px, calc(100vw - 330px)); }
  .hero h1 { font-size: clamp(53px, 7vw, 84px); }
  .on-air-card { width: min(218px, 29vw); right: 4vw; }
}
@media (max-width: 700px) {
  .button,.sign-in { min-height: 44px; }
  .text-button { min-height: 44px; padding: 0 2px; }
  .timezone-button,.inline-link { min-height: 44px; display: inline-flex; align-items: center; }
  .section-label,.mobile-tabs small { font-size: 8px; }
  .signal-cell small { font-size: 8px; }
  .signal-cell b { font-size: 9px; line-height: 1.25; }
  .lineup-item { grid-template-columns: 50px 18px minmax(0,1fr) 40px; }
  .lineup-info p,.room-meta p { font-size: 9px; }
  .format-tag { font-size: 7px; }
  .room-status,.time-col small,.artist-card-info p { font-size: 8px; }
  .item-action,.room-arrow,.recording-play { min-width: 44px; min-height: 44px; }
  .dock-play { width: 40px; height: 40px; }
  .mobile-tabs { grid-template-columns: repeat(5,1fr); height: calc(61px + env(safe-area-inset-bottom)); }
  .mobile-tabs a,.mobile-tabs button { min-height: 44px; }
  .player-dock { bottom: calc(61px + env(safe-area-inset-bottom)); grid-template-columns: minmax(0,1fr) 48px 44px; }
  .dock-share { min-width: 44px; min-height: 44px; }
  .site-shell { padding-bottom: calc(151px + env(safe-area-inset-bottom)); }
  .footer-links { flex-wrap: wrap; row-gap: 12px; }
  .recording-card { grid-template-columns: 62px minmax(0,1fr) 48px; }
  .recording-info small,.archive-note,.footer>small { font-size: 8px; }
  .recording-play { width: 44px; height: 44px; }
}
@media (max-width: 380px) {
  .hero h1 { font-size: clamp(46px, 14vw, 54px); }
  .hero-footnote { font-size: 7px; }
  .hero-ctas .button { padding-inline: 10px; }
  .top-actions { gap: 8px; }
  .text-button,.sign-in { font-size: 8px; }
}

.share-menu-trigger[aria-expanded="true"] { color: var(--gold); }
.more-dots { display: inline-flex; align-items: center; justify-content: center; gap: 3px; vertical-align: middle; }
.more-dots i { width: 3px; height: 3px; display: block; border-radius: 50%; background: currentColor; }
.button-light .more-dots { margin-left: 2px; }
.share-menu { position: fixed; z-index: 80; display: grid; min-width: 188px; padding: 6px; border: 1px solid rgba(201,212,237,.28); border-radius: 8px; background: rgba(10,18,55,.98); box-shadow: 0 16px 40px rgba(0,0,0,.38); backdrop-filter: blur(18px); }
.share-menu [role="menuitem"] { min-height: 44px; padding: 0 13px; border: 0; border-radius: 5px; background: transparent; color: var(--white); font: 500 13px/1 var(--body); text-align: left; cursor: pointer; }
.share-menu [role="menuitem"]:hover,.share-menu [role="menuitem"]:focus-visible { outline: 0; background: rgba(201,212,237,.13); color: var(--white); }
.social-note.share-menu-trigger { width: 100%; padding: 15px 0 0; border: 0; border-top: 1px solid var(--line); background: transparent; color: inherit; text-align: left; cursor: pointer; }
.social-note.share-menu-trigger .more-dots { margin-left: auto; color: var(--star); }

.section-tools { display: flex; align-items: center; gap: 18px; }.timezone-button { padding: 0; background: transparent; border: 0; color: #9eb2d5; font: 8px var(--mono); letter-spacing: .07em; cursor: pointer; white-space: nowrap; }.timezone-button b { color: #e6edf8; font-weight: 400; }.timezone-button>span { color: var(--gold); font-size: 11px; margin-left: 4px; }.timezone-button:hover b { color: #f2c48d; }
.time-col time { display: block; color: #e6edfa; font-size: 11px; font-style: normal; }
@media (max-width: 700px) { .section-heading { flex-direction: column; align-items: flex-start; gap: 13px; }.section-tools { width: 100%; justify-content: space-between; }.timezone-button,.inline-link { min-height: 44px; display: inline-flex; align-items: center; }.lineup-list::before { left: 69px; }.lineup-item { grid-template-columns: 50px 18px minmax(0,1fr) 44px; }.time-col time { font-size: 9px; }.time-col small { font-size: 8px; line-height: 1.15; } }

.soundcheck-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 9px; }
.modal .soundcheck-actions .button { margin-top: 0; }
.form-field input[type="file"] { min-height: 48px; padding: 9px; color: #cbd7ec; font-size: 10px; }
.item-action[data-performer-room] { font-size: 16px; }
.reminder-optin .check-row { display: flex; align-items: flex-start; gap: 10px; color: #cbd7ec; font: 10px/1.45 var(--body); letter-spacing: 0; }
.reminder-optin .check-row input { flex: 0 0 18px; width: 18px; min-height: 18px; margin: 1px 0 0; accent-color: #98b2e0; }
.reminder-optin .check-row span { margin: 0; color: inherit; font: inherit; letter-spacing: 0; }
@media (max-width: 430px) { .soundcheck-actions { grid-template-columns: 1fr; } }