/* Guest-facing identity adapted from the supplied Let's Rock Party poster. */
.newsletter-lead {line-height: 1.65; margin-bottom: 24px; color: #d5d1c8;}
.newsletter-consent {display: flex; align-items: flex-start; gap: 12px; line-height: 1.6; margin: 20px 0 14px;}
.newsletter-consent input {width: 19px; height: 19px; flex: 0 0 19px; margin-top: 3px; accent-color: #ed343e;}
.newsletter-consent span {font-size: 12px; color: #f8e7cf;}
.newsletter-privacy {font-size: 11px; color: #c2bdb4; line-height: 1.7; margin: 14px 0 22px;}
.newsletter-privacy a,.newsletter-page a,#newsletter-privacy-link {color: #eea080; text-decoration: underline; text-underline-offset: 3px;}
.newsletter-skip {display: block; margin: 12px auto 0; padding: 12px 28px; background: transparent; color: #e1dacc; border: 1px solid #d8c9b855; cursor: pointer;}
.newsletter-footer {white-space: normal;}
.newsletter-footer button {background: none; border: 0; padding: 0; color: #eea080; text-decoration: underline; cursor: pointer; font: inherit;}
.newsletter-page {max-width: 740px; margin: 32px auto; padding: 28px; background: #191b23; border-top: 4px solid #ed343e;}
.newsletter-page h1 {font-family: Impact, 'Arial Narrow', sans-serif; text-transform: uppercase; font-size: clamp(32px,6vw,52px); line-height: 1.1; margin-bottom: 25px;}
.newsletter-page h2 {font-size: 21px; margin: 28px 0 10px;}
.newsletter-page p {font-size: 14px; line-height: 1.8; color: #ddd7ca; margin-bottom: 18px; overflow-wrap: anywhere;}
.newsletter-admin {border-top: 1px solid var(--line); padding-top: 24px; margin-top: 26px;}
.newsletter-admin p {font-size: 12px; line-height: 1.8; color: var(--muted); margin: 14px 0;}
#newsletter-page-status:not(:empty) {border-left: 3px solid #ee835c; padding: 12px; background: #112239;}
/* Preserve the supplied PNG's transparency and trim surrounding whitespace. */
.site-header, .guest-theme .site-header {height: 132px;}
.venue-logo {display: block; position: relative; overflow: hidden; width: 154px; height: 112px; background: transparent; flex: 0 0 auto;}
.venue-logo img {position: absolute; width: 185px; height: auto; max-width: none; left: -17px; top: -19px;}
.venue-tagline {font-size: 10px; letter-spacing: 1.5px; color: #ed835d;}
body.guest-theme {
  --bg: #101116;
  --panel: #192d48;
  --line: #f5eed22b;
  --muted: #c9c2b2;
  --ink: #fbf5df;
  --accent: #ed343e;
  --purple: #ed835d;
  background: radial-gradient(ellipse at 85% 5%, #7b182326, transparent 48%), repeating-linear-gradient(115deg, #ffffff02 0 1px, transparent 1px 6px), var(--bg);
  font-family: 'Segoe UI', Arial, sans-serif;
}
.guest-theme .site-header {
  max-width: none;
  height: 132px;
  padding: 0 max(32px, calc((100vw - 1184px) / 2));
  background: #0d0e13;
  border-bottom: 3px solid #ed343e;
}
.guest-theme .brand {font-size: 14px; letter-spacing: 1.6px;}
.guest-theme .brand-icon {background: none; color: #ed343e; font-size: 36px; width: 25px; border-radius: 0;}
.guest-theme .brand-light {color: #e27b58; font-size: 11px;}
.guest-theme .site-header nav {display: none;}
.guest-theme nav a {color: #c8c9ca;}
.guest-theme nav a.active {color: #fbf5df;}
.guest-theme nav span {color: #ed835d;}
.guest-theme main {padding-top: 32px; padding-bottom: 42px;}
.guest-theme .hero {
  display: grid;
  grid-template-columns: minmax(0, 440px) minmax(0, 1fr);
  min-height: 0;
  gap: 52px;
  padding: 0;
  margin-bottom: 28px;
  align-items: stretch;
}
.poster-art {
  /* The visible region is only x=0..922, y=0..866 of the supplied 1920x1080 poster.
     This excludes its QR, venue block and date. It is a CSS crop, not a new QR. */
  aspect-ratio: 922 / 866;
  background: #192d48 url('/rock-reference.png') no-repeat left top;
  background-size: 208.2429501% auto;
  border: 8px solid #112239;
  outline: 1px solid #f5eed21c;
  position: relative;
  overflow: hidden;
}
.poster-art::after {content: ''; position: absolute; inset: 0; box-shadow: inset 0 0 35px #07142744; pointer-events: none;}
.poster-copy {padding: 28px 0 22px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start;}
.guest-theme .hero .live {font-size: 10px; letter-spacing: 2px; color: #f0d9c3; line-height: 1.7; flex-wrap: wrap;}
.guest-theme .dot {background: #ee835c; box-shadow: none;}
.guest-theme .hero h1 {font-family: Impact, 'Arial Narrow', sans-serif; font-size: clamp(54px, 6vw, 84px); text-transform: uppercase; letter-spacing: 1px; font-weight: 900; line-height: .96; margin: 27px 0 20px; text-shadow: 3px 3px 0 #ed343e; transform: rotate(-2deg);}
.poster-rule {height: 7px; width: 130px; background: #ed343e; margin: 0 0 24px; transform: skew(-25deg);}
.guest-theme .hero .poster-lead {color: #fbf5df; font-size: 19px; line-height: 1.6; max-width: 520px;}
.poster-caption {margin-top: 24px; display: flex; gap: 10px; align-items: center; color: #f4c6a9; font-size: 10px; letter-spacing: 2px; font-weight: 600;}
.poster-caption span {color: #ed343e; font-size: 22px;}
.guest-theme .banner {border: 1px solid #ffffff26; background: #181a21; color: #cbc6bc; font-size: 11px; border-radius: 0; padding: 11px 16px; margin-bottom: 16px;}
.guest-theme .theme-banner {background: #192d48; border: none; border-left: 4px solid #ed343e; border-radius: 2px; padding: 13px 17px; margin-bottom: 26px;}
.guest-theme .theme-banner strong {color: #fbf5df; font-size: 13px; letter-spacing: .3px;}
.guest-theme .theme-banner > span {color: #ed343e;}
.guest-theme .theme-banner p {color: #c5c4bd; font-size: 11px;}
.guest-theme .content-grid {grid-template-columns: minmax(0, 1fr) 350px; gap: 26px; align-items: start;}
.guest-theme .content-grid > section {background: #192d48; border: 1px solid #102238; padding: 25px 27px 20px; border-radius: 3px; box-shadow: 0 10px 28px #38241418;}
.guest-theme .section-head h2 {font-family: Impact, 'Arial Narrow', sans-serif; text-transform: uppercase; font-size: 28px; font-weight: 800; letter-spacing: .6px;}
.guest-theme .count {border: 1px solid #f5eed233; color: #d9d0bb; border-radius: 2px; font-size: 9px; letter-spacing: .8px; padding: 6px 8px;}
.guest-theme .search-box {height: 56px; background: #112239; border: 1px solid #c4bba455; border-radius: 3px; padding: 0 16px;}
.guest-theme .search-box:focus-within {border-color: #ee835c; box-shadow: 0 0 0 2px #ee835c22;}
.guest-theme .search-box svg {color: #e9835f;}
.guest-theme .search-box input {color: #fbf5df; font-size: 13px;}
.guest-theme .search-box input::placeholder {color: #c8c4b7;}
.guest-theme .search-box kbd {border-color: #f5eed22b; color: #b8c0c8; border-radius: 2px;}
.guest-theme .catalog-header {font-size: 9px; letter-spacing: .6px; margin-top: 22px; color: #c2c2bc;}
.guest-theme .tidal {color: #fbf5df;}
.guest-theme .track {min-height: 77px; border-bottom: 1px solid #f5eed21a;}
.guest-theme .cover {border-radius: 2px; border-color: #f5eed21a;}
.guest-theme .track-title {color: #fbf5df;}
.guest-theme .track-artist {color: #bfc5c9; font-size: 11px;}
.guest-theme .duration {color: #b3b9bd;}
.guest-theme .request-button {background: #ed343e; color: #fff8e9; border: 1px solid #ed343e; border-radius: 2px; font-weight: 650; font-size: 11px; padding: 9px 12px;}
.guest-theme .request-button:hover {background: #ce2731; border-color: #ce2731;}
.guest-theme .request-button.mine {background: #fbf5df10; border-color: #f5eed24d; color: #f5e7c9;}
.guest-theme .sidebar {background: #191b23; border: 1px solid #ffffff26; border-top: 4px solid #ed343e; border-radius: 0; padding: 26px 23px;}
.guest-theme .eyebrow {color: #f2b496; letter-spacing: 1.8px; font-size: 9px;}
.guest-theme .sidebar .section-head h2 {font-size: 25px; font-weight: 800;}
.guest-theme .sidebar-description {color: #f0dfca; font-size: 11px; line-height: 1.7;}
.guest-theme .tabs {background: #101116; border: 1px solid #ffffff26; border-radius: 0; padding: 3px;}
.guest-theme .tab {border-radius: 1px; color: #debea6; font-size: 11px;}
.guest-theme .tab.active {background: #ed343e; color: #fff8e9; font-weight: 700;}
.guest-theme .queue-track {border-color: #e8c4a629;}
.guest-theme .rank {color: #c7a78f;}
.guest-theme .vote {color: #f2b18d;}
.guest-theme .status {color: #e5ccb5;}
.guest-theme .status.added,.guest-theme .status.demo,.guest-theme .status.played {color: #ffe0a9;}
.guest-theme .sidebar-note {color: #e9cdb5; font-size: 10px; line-height: 1.8;}
.guest-theme .empty {color: #c9c5bb;}
.guest-theme .empty-icon {color: #ed835d;}
.guest-theme .how {border-color: #e2be9e44; margin-top: 30px; padding-top: 23px;}
.guest-theme .step {background: #192d48; color: #e9835f; border: 1px solid #192d48; border-radius: 2px; font-weight: 700;}
.guest-theme .how-item p {color: #e2c7b2;}
.guest-theme footer {border-color: #e2be9e44; color: #e3c9b5; padding-top: 24px;}
.guest-theme footer span:first-child {font-weight: 800; letter-spacing: 2px; color: #f3d6b7;}
.guest-theme dialog {background: #192d48; border: 1px solid #e9835f70; border-top: 5px solid #ed343e; border-radius: 3px;}
.guest-theme dialog::backdrop {background: #09172bd9;}
.guest-theme dialog h2 {font-weight: 550; color: #fbf5df;}
.guest-theme .dialog-close {color: #e8c6a5;}
.guest-theme label {color: #f8e7cf;}
.guest-theme label > span {color: #c6c3b9;}
.guest-theme dialog input,.guest-theme dialog textarea {background: #112239; color: #fbf5df; border-color: #d0bfa650; border-radius: 3px;}
.guest-theme input:focus,.guest-theme textarea:focus {outline-color: #ed835d;}
.guest-theme .primary {background: #ed343e; color: #fff8e9; border-radius: 2px;}
.guest-theme .primary:hover {background: #ce2731;}
.guest-theme #toast {background: #fbf5df; color: #192d48; border-radius: 3px; border-left: 4px solid #ed343e;}
.guest-theme #dialog-error:not(:empty) {background: #532e33; border-color: #ed7279; color: #ffddd6; border-radius: 2px;}
@media (max-width: 1100px) {
  .guest-theme .hero {grid-template-columns: 340px minmax(0, 1fr); gap: 36px;}
  .guest-theme .hero h1 {font-size: 47px;}
  .guest-theme .hero .poster-lead {font-size: 17px;}
  .poster-copy {padding: 10px 0;}
  .guest-theme .content-grid {grid-template-columns: minmax(0, 1fr) 300px; gap: 20px;}
  .guest-theme .content-grid > section {padding: 23px 20px;}
}
@media (max-width: 800px) {
  .guest-theme .hero {grid-template-columns: 280px minmax(0, 1fr); gap: 26px;}
  .guest-theme .hero h1 {font-size: 37px; margin: 19px 0 16px;}
  .guest-theme .hero .poster-lead {font-size: 14px;}
  .poster-caption {font-size: 9px; letter-spacing: 1px; margin-top: 16px;}
  .poster-rule {margin-bottom: 16px; width: 80px;}
  .guest-theme .content-grid {grid-template-columns: 1fr; gap: 22px;}
}
@media (max-width: 600px) {
  .site-header, .guest-theme .site-header {height: 96px; padding: 0 18px;}
  .venue-logo {width: 110px; height: 82px;}
  .venue-logo img {width: 135px; left: -12px; top: -14px;}
  .venue-tagline {display: none;}
  .guest-theme .brand {font-size: 11px; gap: 7px; letter-spacing: .8px;}
  .guest-theme .brand-icon {font-size: 30px; width: 22px;}
  .guest-theme nav {gap: 15px; font-size: 10px;}
  .guest-theme main {padding: 18px 16px 34px;}
  .guest-theme .hero {grid-template-columns: 1fr; gap: 0; margin-bottom: 20px;}
  .poster-art {width: 100%; max-width: 240px; margin: 0 auto; aspect-ratio: 922 / 866; border-width: 6px;}
  .poster-copy {padding: 20px 4px 8px;}
  .guest-theme .hero .live {font-size: 9px; letter-spacing: 1.6px;}
  .guest-theme .hero h1 {font-size: 41px; letter-spacing: -1px; margin: 16px 0 15px;}
  .guest-theme .hero .poster-lead {font-size: 15px; line-height: 1.6; max-width: none;}
  .poster-caption {display: none;}
  .guest-theme .banner {font-size: 10px; padding: 10px 12px;}
  .guest-theme .theme-banner {padding: 12px; gap: 10px; margin-bottom: 20px;}
  .guest-theme .theme-banner strong {font-size: 12px;}
  .guest-theme .theme-banner p {font-size: 10px;}
  .guest-theme .content-grid > section {padding: 20px 15px 15px;}
  .guest-theme .section-head h2 {font-size: 22px;}
  .guest-theme .count {font-size: 8px; padding: 5px 6px;}
  .guest-theme .cover {width: 43px; height: 43px;}
  .guest-theme .track {gap: 9px; min-height: 70px;}
  .guest-theme .track-title {font-size: 12px;}
  .guest-theme .request-button {font-size: 10px; padding: 8px;}
  .guest-theme .sidebar {padding: 22px 20px;}
  .guest-theme footer {margin: 0 16px; font-size: 8px;}
  .guest-theme dialog {padding: 27px 21px;}
}
.social-lead {color:#d5d9df;line-height:1.6;}
.social-actions {display:grid;gap:12px;margin:24px 0;}
.social-link {display:flex;justify-content:space-between;align-items:center;padding:17px 20px;border:1px solid #ef7050;border-radius:8px;color:#fff;text-decoration:none;font-weight:750;font-size:18px;background:#342638;}
.social-facebook {background:#192d48;border-color:#7195c3;}
.social-link:hover {filter:brightness(1.2);}
.social-measure {display:flex;align-items:flex-start;gap:10px;font-size:13px;line-height:1.5;}
.social-measure input {width:18px;height:18px;flex-shrink:0;accent-color:#ef7050;}
.social-note {font-size:12px;line-height:1.6;color:#aeb8c7;}
.social-note a,#social-footer a {color:#ef997e;}
.social-skip {display:block;width:100%;margin-top:20px;padding:12px;background:transparent;border:1px solid #566173;color:#e0e5ed;border-radius:7px;cursor:pointer;}
.social-badges {display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin:12px 0;}
.social-badges span {font-size:11px;padding:5px 8px;border:1px solid #424957;border-radius:5px;color:#9ca9bc;}
.social-badges .clicked {color:#ffbc9d;border-color:#bd6b4d;background:#372720;}
.social-badges small {font-size:10px;color:#9ca9bc;}
#social-admin {border-top:1px solid #424957;margin-top:25px;padding-top:22px;}
#social-admin p {font-size:13px;line-height:1.6;}
#social-footer {display:flex;flex-wrap:wrap;gap:8px;align-items:center;}
#social-dialog {max-height:90dvh;overflow:auto;}

/* Keep forms readable without focus zoom, while retaining user pinch zoom. */
html {-webkit-text-size-adjust:100%;text-size-adjust:100%;}
.content-grid > *, .admin-grid > *, .poster-copy {min-width:0;}
dialog {max-height:calc(100dvh - 24px);overflow-y:auto;overscroll-behavior:contain;scroll-padding-block:20px;}
#social-dialog {max-height:calc(100dvh - 24px);}
html:has(dialog[open]) {overflow:hidden;}
.dialog-close {min-width:44px;min-height:44px;right:4px;top:4px;display:grid;place-items:center;}
dialog h2 {padding-right:22px;overflow-wrap:anywhere;}
.social-measure > span {float:none;font-size:13px;line-height:1.6;}
@media (max-width:900px), (pointer:coarse) {
  input:not([type=checkbox]),textarea,select,.search-box input,.guest-theme .search-box input {font-size:16px;}
  input:not([type=checkbox]),select {min-height:48px;}
  input,textarea,select {min-width:0;max-width:100%;scroll-margin-block:24px;}
  .search-box input {min-height:44px;flex:1;}
  .primary,.secondary,.tab,.filter-bar button,.request-actions button {min-height:44px;}
}
@media (max-width:600px) {
  .guest-theme .hero {grid-template-columns:100px minmax(0,1fr);gap:16px;align-items:center;}
  .poster-art {width:100%;max-width:100px;border-width:3px;}
  .poster-copy {padding:8px 0;}
  .guest-theme .hero h1 {font-size:clamp(28px,8vw,36px);line-height:1.08;margin:12px 0;overflow-wrap:anywhere;}
  .guest-theme .hero .poster-lead {font-size:14px;line-height:1.5;}
  .poster-rule {height:4px;width:60px;margin-bottom:12px;}
  .section-head {gap:10px;flex-wrap:wrap;}
  .catalog-header {gap:10px;flex-wrap:wrap;line-height:1.5;}
  .guest-theme .track {gap:10px;padding-block:14px;}
  .guest-theme .track-title {font-size:14px;white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;}
  .guest-theme .track-artist {font-size:12px;}
  .guest-theme .request-button {font-size:12px;min-height:44px;padding:10px;flex-shrink:0;}
  .guest-theme .tab {font-size:13px;}
  #guest-limits {font-size:12px;line-height:1.6;margin-bottom:16px;}
  .guest-theme .theme-banner p,.guest-theme .sidebar-description,.guest-theme .sidebar-note {font-size:12px;}
  .guest-theme footer,footer {flex-wrap:wrap;gap:12px;line-height:1.6;font-size:10px;}
  #social-footer {flex-basis:100%;gap:12px;}
  #social-footer a {display:inline-flex;align-items:center;min-height:44px;font-size:12px;}
  .guest-theme dialog,dialog {width:440px;max-width:calc(100% - 24px);padding:24px 20px;}
  dialog label {font-size:13px;}
  .guest-theme dialog label > span {font-size:11px;}
  .social-measure {min-height:44px;align-items:center;}
  .guest-theme .social-measure > span {font-size:13px;}
  #qr-image {max-width:100%;height:auto;aspect-ratio:1;}
  .newsletter-page {padding:20px;margin-block:12px;}
  .live {overflow-wrap:anywhere;}
}
@media (max-width:360px) {
  .guest-theme .hero {grid-template-columns:80px minmax(0,1fr);gap:12px;}
  .guest-theme .content-grid > section {padding-inline:12px;}
  .guest-theme .section-head h2 {font-size:20px;}
  .guest-theme .request-button {padding-inline:8px;font-size:11px;}
}
