/* FULL CSS WITH LAB FIX APPLIED */

/* ONLY CHANGE MADE:
   #labsGrid converted to grid instead of block
   lab-card sizing constrained
*/

:root {
  --bg-dark: #080808;
  --bg-mid: #101010;
  --bg-soft: #171717;
  --panel: rgba(12, 12, 12, 0.96);
  --panel-2: rgba(18, 18, 18, 0.98);
  --accent: #cfac2d;
  --accent-border: rgba(207, 172, 45, 0.30);
  --text: #ffffff;
  --muted: rgba(255, 255, 255, 0.72);
  --line: rgba(255, 255, 255, 0.10);
  --shadow: 0 0 0 1px rgba(255,255,255,0.035), 0 18px 50px rgba(0,0,0,0.42);
  --nav-height: 78px;
  --max-width: 1240px;
  --transition: 180ms linear;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  min-width: 320px;
  font-family: "Bebas Neue", sans-serif;
  color: var(--text);
  background:
    radial-gradient(circle at top right, rgba(255,255,255,0.03), transparent 18%),
    radial-gradient(circle at bottom left, rgba(255,255,255,0.02), transparent 18%),
    linear-gradient(180deg, #050505 0%, #0c0c0c 34%, #121212 100%);
  line-height: 1.6;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
.noise {
  position: fixed; inset: 0; pointer-events: none; opacity: 0.05;
  background-image: radial-gradient(rgba(255,255,255,0.16) 0.6px, transparent 0.6px);
  background-size: 6px 6px; mix-blend-mode: soft-light; z-index: -3;
}
.screen-glow {
  position: fixed; inset: 0; pointer-events: none;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.015), transparent 25%, transparent 75%, rgba(255,255,255,0.015)),
    radial-gradient(circle at center, rgba(255,255,255,0.02), transparent 55%);
  z-index: -2;
}
.container { width: min(calc(100% - 36px), var(--max-width)); margin: 0 auto; }
.site-header { position: sticky; top: 0; z-index: 1000; }
.navbar {
  background: rgba(3, 3, 3, 0.95);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.nav-inner {
  min-height: var(--nav-height);
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
}
.brand { display: inline-flex; align-items: center; }
.brand-logo {
  height: 34px; width: auto; object-fit: contain;
  filter: drop-shadow(0 0 8px rgba(255,255,255,0.08));
  transition: filter 180ms linear;
}
.brand:hover .brand-logo { filter: drop-shadow(0 0 10px rgba(207,172,45,0.20)); }
.nav-menu {
  display: flex;
  list-style: none;
  gap: 4px;
  align-items: center;
}

.nav-menu a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid transparent;
  color: rgba(255,255,255,0.82);
  text-transform: uppercase;
  letter-spacing: 0.10em;
  font-size: 0.92rem;
  line-height: 1;
  font-family: "IBM Plex Mono", monospace;
  transition: background var(--transition), color var(--transition), border-color var(--transition);
}
.nav-menu a:hover, .nav-menu a.active {
  color: var(--accent);
  background: rgba(207, 172, 45, 0.06);
  border-color: var(--accent-border);
}
.nav-divider { height: 1px; width: 100%; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.10), transparent); }
.nav-toggle {
  display: none; width: 42px; height: 42px; border: 1px solid var(--line);
  background: rgba(255,255,255,0.03); align-items: center; justify-content: center;
  flex-direction: column; gap: 5px; cursor: pointer;
}
.nav-toggle span { width: 18px; height: 2px; background: var(--accent); display: block; }

.section { padding: 104px 0; scroll-margin-top: 100px; }
.hero { min-height: calc(100vh - var(--nav-height)); display: flex; align-items: center; }
.hero-layout {
  display: grid;
  grid-template-columns: 1fr 1.02fr;
  gap: 34px;
  align-items: center;
}
.eyebrow, .panel-label, .hero-note, .text-link, .footer-inner, .window-title, .track-list, .track-heading {
  font-family: "IBM Plex Mono", monospace;
}
.hero-copy {
  text-align: center;
  margin: 0 auto;
  display: flex; flex-direction: column; align-items: center;
  max-width: 760px;
}
.hero-visual { width: 100%; max-width: 700px; }
.about-heading { max-width: 760px; }
.eyebrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 0 18px;
  border: 1px solid rgba(255,255,255,0.18);
  background: rgba(255,255,255,0.03);
  color: #ffffff;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 34px;
  line-height: 1;
  margin-bottom: 20px;
  font-family: "Creepster", cursive;
  text-shadow:
    0 0 10px rgba(207, 172, 45, 0.45),
    0 0 3px rgba(207, 172, 45, 0.9);
}
.hero-title-wrap { margin-bottom: 18px; }
.hero-title-logo {
  width: min(100%, 540px);
  max-height: 180px;
  object-fit: contain;
  filter: drop-shadow(0 0 18px rgba(255,255,255,0.04));
  margin: 0 auto;
}
h1, h2, h3 { line-height: 1.04; }
h2 {
  font-size: clamp(1.2rem, 2.5vw, 2rem);
  letter-spacing: 0.12em;
  margin-bottom: 6px;
  font-family: "Libre Barcode 39", system-ui;
  line-height: 1;
  font-weight: 400;
  opacity: 0.55;
}
h3 { font-size: 1.16rem; margin-bottom: 10px; }
p { color: var(--muted); }
.hero-text, .section-heading p { max-width: 60ch; }
.hero-actions {
  display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; margin-bottom: 16px;
  justify-content: center;
}
.hero-note {
  color: rgba(255,255,255,0.50); text-transform: uppercase; letter-spacing: 0.1em;
  font-size: 0.72rem; text-align: center;
}
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 16px;
  background: rgba(255,255,255,0.03);
  color: rgba(255,255,255,0.92);
  border: 1px solid var(--line);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.94rem;
  font-family: "IBM Plex Mono", monospace;
  transition: background var(--transition), color var(--transition), border-color var(--transition), box-shadow var(--transition);
}
.button:hover { color: var(--accent); border-color: var(--accent-border); background: rgba(207,172,45,0.06); }
.button-ghost { background: rgba(255,255,255,0.02); }

.window-frame, .panel, .cat-terminal {
  background: linear-gradient(180deg, var(--panel-2), var(--panel));
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  overflow: hidden;
}
.window-bar {
  display: flex; align-items: center; gap: 12px; min-height: 34px; padding: 0 12px;
  background: linear-gradient(180deg, rgba(255,255,255,0.07), rgba(255,255,255,0.02));
  border-bottom: 1px solid var(--line);
}
.window-controls { display: flex; gap: 6px; }
.window-controls span,
.window-control { width: 10px; height: 10px; border: 1px solid rgba(255,255,255,0.18); background: rgba(255,255,255,0.06); display: block; }
.window-control { padding: 0; appearance: none; -webkit-appearance: none; border-radius: 0; box-shadow: none; }
.window-controls-secret .secret-control {
  cursor: default;
}
.window-controls-secret .secret-control:hover,
.window-controls-secret .secret-control:focus,
.window-controls-secret .secret-control:focus-visible,
.window-controls-secret .secret-control:active { background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.18); outline: none; box-shadow: none; transform: none; }
.window-title { color: rgba(255,255,255,0.66); text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.72rem; }
.window-body.hero-window {
  position: relative; min-height: 510px; padding: 34px; display: grid; place-items: center;
  background:
    radial-gradient(circle at center, rgba(255,255,255,0.02), transparent 40%),
    linear-gradient(180deg, rgba(255,255,255,0.015), rgba(255,255,255,0.01)),
    linear-gradient(90deg, rgba(255,255,255,0.012), transparent 20%, transparent 80%, rgba(255,255,255,0.012));
}
.hero-window:hover .hero-logo { animation: spin-record 1.8s linear infinite; }
@keyframes spin-record { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
.hero-logo {
  position: relative; z-index: 1; max-width: min(440px, 88%); max-height: 380px; object-fit: contain;
  filter: drop-shadow(0 0 24px rgba(0,0,0,0.20));
}
.scanlines {
  position: absolute; inset: 0;
  background: repeating-linear-gradient(180deg, rgba(255,255,255,0.02) 0px, rgba(255,255,255,0.02) 1px, transparent 1px, transparent 4px);
  pointer-events: none; opacity: 0.18;
}
.section-heading { margin-bottom: 24px; }
.content-grid, .event-list { display: grid; gap: 20px; }
.two-col { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.three-col { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.panel { padding: 22px; transition: border-color var(--transition), background var(--transition); }
.panel:hover, .window-frame:hover, .cat-terminal:hover { border-color: rgba(255,255,255,0.18); }
.panel-label {
  color: rgba(255,255,255,0.62); text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.72rem;
  margin-bottom: 12px;
}
.media-box, .media-box-image {
  min-height: 220px; border: 1px dashed rgba(255,255,255,0.12);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.012)),
    repeating-linear-gradient(0deg, rgba(255,255,255,0.02) 0 1px, transparent 1px 20px);
  display: grid; place-items: center; color: rgba(255,255,255,0.42); text-transform: uppercase;
  letter-spacing: 0.1em; font-size: 0.74rem; margin-bottom: 18px; text-align: center; padding: 18px;
}
.media-box.tall, .media-box-image.tall { min-height: 300px; }
.media-box-image { overflow: hidden; padding: 0; }
.media-box-image img { width: 100%; height: 100%; min-height: inherit; object-fit: cover; display: block; }
.text-link {
  display: inline-flex; margin-top: 14px; color: rgba(255,255,255,0.80); text-transform: uppercase;
  letter-spacing: 0.1em; font-size: 0.74rem; font-weight: 600; transition: color var(--transition);
}
.text-link:hover { color: var(--accent); }
.event-card { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.event-left { display: flex; align-items: center; gap: 16px; }
.date-box {
  width: 78px; height: 78px; flex: 0 0 78px; border: 1px solid rgba(255,255,255,0.12);
  display: grid; place-items: center; background: rgba(255,255,255,0.02); color: rgba(255,255,255,0.74);
  font-family: "IBM Plex Mono", monospace; font-size: 0.95rem; font-weight: 700; letter-spacing: 0.08em;
}
.track-heading {
  margin-top: 14px; margin-bottom: 8px; color: rgba(255,255,255,0.64); font-size: 0.74rem;
  text-transform: uppercase; letter-spacing: 0.08em;
}
.track-list{
  list-style:none;
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:8px 18px;
  font-size:.76rem;
  color:rgba(255,255,255,0.78);
}
.track-list li{
  padding-top:8px;
  border-top:1px dashed rgba(255,255,255,0.08);
  min-width:0;
}
.cat-zone { padding: 30px 0 90px; }
.cat-wrap { display: flex; justify-content: center; }
.cat-terminal { width: min(100%, 420px); }
.cat-body {
  display: grid;
  place-items: center;
  padding: 20px 20px 18px;
  width: 100%;
  border: 0;
  cursor: pointer;
  text-align: center;
  color: inherit;
  background:
    radial-gradient(circle at center, rgba(255,255,255,0.03), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,0.015), rgba(255,255,255,0.01));
}
.cat-body:focus-visible {
  outline: 1px solid rgba(207,172,45,0.9);
  outline-offset: -1px;
}
.cat-image { max-width: 260px; width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 8px 16px rgba(0,0,0,0.45)); }
.cat-terminal.is-glitching .cat-image {
  animation:
    catShake 110ms steps(2, end) 0s 10,
    catHue 220ms linear 0s 5,
    catSlice 180ms steps(2, end) 0s 8;
  filter:
    drop-shadow(0 0 10px rgba(207,172,45,0.35))
    drop-shadow(-6px 0 0 rgba(255,0,102,0.45))
    drop-shadow(6px 0 0 rgba(0,255,255,0.35));
}
@keyframes catShake {
  0% { transform: translate(0,0); }
  20% { transform: translate(-3px,2px); }
  40% { transform: translate(4px,-2px); }
  60% { transform: translate(-2px,1px); }
  80% { transform: translate(3px,2px); }
  100% { transform: translate(0,0); }
}
@keyframes catHue {
  0% { filter: hue-rotate(0deg) saturate(1); }
  50% { filter: hue-rotate(120deg) saturate(1.5); }
  100% { filter: hue-rotate(0deg) saturate(1); }
}
@keyframes catSlice {
  0% { clip-path: inset(0 0 0 0); }
  20% { clip-path: inset(8% 0 52% 0); }
  40% { clip-path: inset(55% 0 12% 0); }
  60% { clip-path: inset(18% 0 44% 0); }
  80% { clip-path: inset(62% 0 6% 0); }
  100% { clip-path: inset(0 0 0 0); }
}
.site-footer { border-top: 1px solid var(--line); padding: 22px 0 34px; background: rgba(0,0,0,0.16); }
.footer-inner {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 28px;
  padding: 0 56px;
  color: rgba(255,255,255,0.5);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 0.72rem;
}

.footer-site {
  justify-self: start;
  white-space: nowrap;
}

.footer-socials {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
}

.footer-socials a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 34px;
  font-size: 1.9rem;
  color: rgba(255,255,255,0.72);
  transition: color var(--transition), transform var(--transition);
}

.footer-socials a:hover {
  color: var(--accent);
}

.footer-credit {
  justify-self: end;
  text-align: right;
  white-space: nowrap;
}
.reveal { opacity: 0; transform: translateY(18px); transition: opacity 700ms ease, transform 700ms ease; }
.reveal.visible { opacity: 1; transform: translateY(0); }
.delay-1 { transition-delay: 120ms; }

@media (max-width: 1020px) {
  .two-col, .three-col { grid-template-columns: 1fr; }
  .hero { min-height: auto; }
}
@media (max-width: 780px) {
  .nav-toggle { display: inline-flex; }
  .nav-menu {
    position: absolute; top: calc(var(--nav-height) - 1px); left: 0; right: 0;
    width: min(calc(100% - 20px), var(--max-width)); margin: 0 auto; display: none;
    flex-direction: column; align-items: stretch; gap: 8px; padding: 14px;
    background: rgba(10,10,10,0.98); border: 1px solid var(--line); border-top: none;
  }
  .nav-menu.open { display: flex; }
  .nav-menu a { width: 100%; justify-content: flex-start; }
  .section { padding: 84px 0; }
  .window-body.hero-window { min-height: 360px; padding: 24px; }
.event-card, .event-left { flex-direction: column; align-items: flex-start; }

.footer-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}

.footer-credit {
  justify-self: auto;
  text-align: center;
}
}

.gallery-header { margin-top: 52px; margin-bottom: 22px; display: flex; justify-content: space-between; align-items: flex-end; gap: 18px; }
.gallery-title { font-size: 2rem; margin-bottom: 8px; }
.gallery-copy { color: var(--muted); }
.gallery-chip-wrap { display: flex; justify-content: flex-end; }
.gallery-chip { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 0 14px; border: 1px solid rgba(255,255,255,0.12); border-radius: 999px; text-transform: uppercase; letter-spacing: 0.12em; font-size: 0.74rem; color: var(--accent); background: rgba(255,255,255,0.02); font-family: "IBM Plex Mono", monospace; }
.gallery-chip span { color: #46cfff; }
.flyer-wall { display: grid; grid-template-columns: 56px minmax(0, 1fr) 56px; gap: 18px; align-items: center; }
.gallery-arrow { width: 56px; height: 56px; border-radius: 999px; border: 1px solid rgba(255,255,255,0.12); background: rgba(255,255,255,0.02); color: #fff; font-size: 2rem; line-height: 1; cursor: pointer; }
.gallery-arrow:hover { border-color: var(--accent-border); color: var(--accent); background: rgba(207,172,45,0.06); }
.flyer-track-window { overflow: hidden; }
.flyer-track { display: flex; gap: 18px; transition: transform 320ms ease; will-change: transform; }
.flyer-card { flex: 0 0 clamp(180px, 22vw, 250px); display: grid; gap: 10px; }
.flyer-card-button, .event-poster-click { background: none; border: 0; padding: 0; cursor: pointer; color: inherit; text-align: left; width: 100%; }
.flyer-card-image { min-height: clamp(270px, 36vw, 380px); border: 1px solid rgba(255,255,255,0.12); border-radius: 18px; background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.012)), repeating-linear-gradient(0deg, rgba(255,255,255,0.02) 0 1px, transparent 1px 20px); overflow: hidden; }
.flyer-card-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.flyer-card-caption { font-size: 0.88rem; color: rgba(255,255,255,0.78); }
.event-meta-stack { display: grid; gap: 6px; margin-bottom: 12px; color: rgba(255,255,255,0.8); }
.event-modal { position: fixed; inset: 0; z-index: 2000; display: none; }
.event-modal.open { display: block; }
.event-modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.72); backdrop-filter: blur(6px); }
.event-modal-card{
  position:relative;
  width:min(calc(100% - 28px), 1100px);
  margin:20px auto;
  padding:0;
  z-index:2;
  background:linear-gradient(180deg, rgba(15,15,15,0.99), rgba(8,8,8,0.99));
  border:1px solid var(--line);
  box-shadow:var(--shadow);
  overflow:hidden;
}
.event-modal-layout{
  display:grid;
  grid-template-columns:minmax(320px, 420px) minmax(0, 1fr);
  gap:28px;
  align-items:start;
}
.event-modal-poster{
  width:100%;
  display:block;
  border-radius:0;
  object-fit:cover;
  border:1px solid rgba(255,255,255,0.10);
  aspect-ratio:4 / 5;
  background:#050505;
}
.event-modal-close { position: absolute; top: 14px; right: 14px; width: 42px; height: 42px; border-radius: 999px; border: 1px solid rgba(255,255,255,0.12); background: rgba(255,255,255,0.03); color: #fff; font-size: 1.5rem; cursor: pointer; }
.event-modal-close:hover { color: var(--accent); border-color: var(--accent-border); }
@media (max-width: 1020px) { .event-modal-layout { grid-template-columns: 1fr; } }
@media (max-width: 780px) { .gallery-header { flex-direction: column; align-items: flex-start; display: flex; } .flyer-wall { grid-template-columns: 44px minmax(0, 1fr) 44px; gap: 10px; } .gallery-arrow { width: 44px; height: 44px; } }


.events-block-past { margin-top: 32px; }

.music-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px 30px;
  align-items: start;
}

.music-tile {
  padding: 0;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(18,18,18,0.98), rgba(10,10,10,0.98));
}

.music-cover-button {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  text-align: left;
}

.music-cover-button .media-box-image,
.music-cover-button .media-box {
  min-height: auto;
  margin-bottom: 0;
  border: 0;
  aspect-ratio: 1 / 1.12;
  background: #040404;
}

.music-cover-button .media-box-image img {
  min-height: 0;
  transition: transform 220ms ease, filter 220ms ease;
}

.music-tile:hover .music-cover-button .media-box-image img {
  transform: scale(1.02);
  filter: brightness(1.04);
}

.music-tile-body {
  padding: 18px 20px 20px;
  display: grid;
  gap: 6px;
}

.music-title {
  margin: 0;
  font-size: 1.22rem;
  line-height: 1.08;
}

.music-artist {
  color: rgba(255,255,255,0.72);
  font-size: 1.08rem;
  letter-spacing: 0.02em;
}

.music-modal, .event-modal {
  position: fixed;
  inset: 0;
  display: none;
  z-index: 9999;
}

.music-modal.open, .event-modal.open {
  display: block;
}

.music-modal-backdrop, .event-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.76);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.music-modal-card, .event-modal-card {
  position: relative;
  width: min(1100px, calc(100vw - 40px));
  max-height: calc(100vh - 40px);
  overflow: auto;
  margin: 20px auto;
  background: linear-gradient(180deg, rgba(15,15,15,0.99), rgba(8,8,8,0.99));
  border: 1px solid rgba(255,255,255,0.12);
  box-shadow: 0 20px 80px rgba(0,0,0,0.55);
}

.music-modal-close, .event-modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255,255,255,0.15);
  background: rgba(255,255,255,0.04);
  color: #fff;
  font-size: 1.5rem;
  cursor: pointer;
  z-index: 2;
}

.music-modal-layout, .event-modal-layout {
  display: grid;
  grid-template-columns: minmax(280px, 420px) minmax(0, 1fr);
  gap: 28px;
  padding: 28px;
}

.music-modal-cover, .event-modal-poster {
  width: 100%;
  display: block;
  border: 1px solid rgba(255,255,255,0.08);
  background: #050505;
}

.music-modal-content h3,
.event-modal-content h3 {
  margin-bottom: 8px;
}

.music-modal-artist {
  font-size: 1rem;
  color: rgba(255,255,255,0.74);
  margin-bottom: 14px;
}

.music-social-links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 18px;
  margin-bottom: 20px;
}

.music-modal-links {
  margin-top: 22px;
}

.event-poster-click {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  text-align: left;
}

.event-poster-click .media-box-image,
.event-poster-click .media-box {
  margin-bottom: 18px;
}

@media (max-width: 1180px) {
  .music-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1020px) {
  .music-grid, .two-col, .three-col {
    grid-template-columns: 1fr;
  }

  .hero { min-height: auto; }
}

@media (max-width: 820px) {
  .music-modal-layout, .event-modal-layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .music-modal-card, .event-modal-card {
    width: min(100vw - 20px, 1100px);
    max-height: calc(100vh - 20px);
    margin: 10px auto;
  }

  .music-modal-layout, .event-modal-layout {
    padding: 18px;
    gap: 18px;
  }
}


.artist-card {
  padding: 0;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(18,18,18,0.98), rgba(10,10,10,0.98));
}

.artist-card-button {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: none;
  text-align: left;
  cursor: pointer;
  color: inherit;
}

.artist-card-button .media-box-image,
.artist-card-button .media-box {
  margin-bottom: 0;
  border: 0;
  aspect-ratio: 1 / 1;
  background: #040404;
}

.artist-card-button .media-box-image img {
  transition: transform 220ms ease, filter 220ms ease;
}

.artist-card:hover .artist-card-button .media-box-image img {
  transform: scale(1.02);
  filter: brightness(1.04);
}

.artist-card-body {
  padding: 18px 20px 22px;
  display: grid;
  gap: 8px;
}

.artist-card-body h3 {
  margin: 0;
  font-size: 1.18rem;
}

.artist-card-body p {
  margin: 0;
  color: rgba(255,255,255,0.74);
  font-size: 1.04rem;
  display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
}

.music-grid,
#musicGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px 30px;
  align-items: start;
}

.music-tile {
  padding: 0;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(18,18,18,0.98), rgba(10,10,10,0.98));
}

.music-cover-button {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  text-align: left;
}

.music-cover-button .media-box-image,
.music-cover-button .media-box {
  min-height: auto;
  margin-bottom: 0;
  border: 0;
  aspect-ratio: 1 / 1.12;
  background: #040404;
}

.music-cover-button .media-box-image img {
  min-height: 0;
  transition: transform 220ms ease, filter 220ms ease;
}

.music-tile:hover .music-cover-button .media-box-image img {
  transform: scale(1.02);
  filter: brightness(1.04);
}

.music-tile-body {
  padding: 18px 20px 20px;
  display: grid;
  gap: 6px;
}

.music-title {
  margin: 0;
  font-size: 1.22rem;
  line-height: 1.08;
}

.music-artist,
.music-artist-link {
  color: rgba(255,255,255,0.72);
  font-size: 1.08rem;
  letter-spacing: 0.02em;
}

.music-artist-link,
.music-modal-artist-button,
.artist-release-link {
  width: fit-content;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  color: #f4ebaa;
  text-decoration: underline;
  text-underline-offset: 0.18em;
}

.music-modal-artist-button[disabled] {
  cursor: default;
  opacity: 0.75;
  text-decoration: none;
}

.artist-modal, .music-modal, .event-modal {
  position: fixed;
  inset: 0;
  display: none;
  z-index: 9999;
}

.artist-modal.open, .music-modal.open, .event-modal.open {
  display: block;
}

.artist-modal-backdrop, .music-modal-backdrop, .event-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.76);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.artist-modal-card, .music-modal-card, .event-modal-card {
  position: relative;
  width: min(1100px, calc(100vw - 40px));
  max-height: calc(100vh - 40px);
  overflow: auto;
  margin: 20px auto;
  background: linear-gradient(180deg, rgba(15,15,15,0.99), rgba(8,8,8,0.99));
  border: 1px solid rgba(255,255,255,0.12);
  box-shadow: 0 20px 80px rgba(0,0,0,0.55);
}

.artist-modal-close, .music-modal-close, .event-modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255,255,255,0.15);
  background: rgba(255,255,255,0.04);
  color: #fff;
  font-size: 1.5rem;
  cursor: pointer;
  z-index: 2;
}

.artist-modal-layout, .music-modal-layout, .event-modal-layout {
  display: grid;
  grid-template-columns: minmax(280px, 420px) minmax(0, 1fr);
  gap: 28px;
  padding: 28px;
}

.artist-modal-image, .music-modal-cover, .event-modal-poster {
  width: 100%;
  display: block;
  border: 1px solid rgba(255,255,255,0.08);
  background: #050505;
}

.artist-modal-content h3,
.music-modal-content h3,
.event-modal-content h3 {
  margin-bottom: 8px;
}

.artist-social-links,
.artist-release-links,
.music-modal-actions,
.music-social-links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 18px;
  margin-bottom: 20px;
}

.artist-social-link,
.artist-release-link {
  font-family: inherit;
  font-size: 0.95rem;
}

.music-modal-links {
  margin-top: 22px;
}

.button-small {
  padding: 10px 14px;
  font-size: 0.9rem;
}

.events-block-past {
  margin-top: 32px;
}

.event-poster-click {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  text-align: left;
}

.event-poster-click .media-box-image,
.event-poster-click .media-box {
  margin-bottom: 18px;
}

@media (max-width: 1180px) {
  .music-grid,
  #musicGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1020px) {
  .music-grid, .two-col, .three-col,
  #musicGrid {
    grid-template-columns: 1fr;
  }

  .hero { min-height: auto; }
}

@media (max-width: 820px) {
  .artist-modal-layout, .music-modal-layout, .event-modal-layout {
    grid-template-columns: 1fr;
  }
}


.artist-card-button,
.music-modal-artist-button{
  appearance:none;
  border:0;
  background:none;
  padding:0;
  cursor:pointer;
  text-align:left;
  color:inherit;
}

.artist-card-button{
  display:block;
  width:100%;
}

.artist-card-button:disabled,
.music-modal-artist-button:disabled{
  cursor:default;
}

.artist-modal,
.music-modal{
  position:fixed;
  inset:0;
  display:none;
  z-index:9999;
}

.artist-modal.open,
.music-modal.open{
  display:block;
}

.artist-modal-backdrop,
.music-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.72);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}

.artist-modal-card,
.music-modal-card{
  position:relative;
  width:min(1100px, calc(100vw - 40px));
  max-height:calc(100vh - 40px);
  overflow:auto;
  margin:20px auto;
  background:#08090b;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 20px 80px rgba(0,0,0,.55);
}

.artist-modal-close,
.music-modal-close{
  position:absolute;
  top:14px;
  right:14px;
  width:42px;
  height:42px;
  border:1px solid rgba(255,255,255,.15);
  background:rgba(255,255,255,.04);
  color:#fff;
  font-size:1.5rem;
  cursor:pointer;
  z-index:2;
}

.artist-modal-layout,
.music-modal-layout{
  display:grid;
  grid-template-columns:minmax(280px, 420px) minmax(0, 1fr);
  gap:28px;
  padding:28px;
}

.artist-modal-image,
.music-modal-cover{
  width:100%;
  display:block;
}

.artist-social-links,
.music-release-links{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:10px;
}

.music-modal-artist-button{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:1rem;
  opacity:.9;
  margin-bottom:14px;
  text-decoration:underline;
  text-underline-offset:4px;
}

.music-modal-artist-button:disabled{
  text-decoration:none;
  opacity:.72;
}

@media (max-width: 980px){
  .artist-modal-layout,
  .music-modal-layout{
    grid-template-columns:1fr;
  }
}


.hero-section {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.hero-media {
  position: absolute;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  opacity: 0;
  transition: opacity .35s ease;
}

.hero-media.has-video {
  opacity: 1;
}

.hero-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(.92) brightness(.46);
}

.hero-video-overlay {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 24% 45%, rgba(0,0,0,.18), transparent 32%),
    linear-gradient(90deg, rgba(6,7,10,.92) 0%, rgba(6,7,10,.80) 36%, rgba(6,7,10,.58) 58%, rgba(6,7,10,.74) 100%),
    linear-gradient(180deg, rgba(6,7,10,.46) 0%, rgba(6,7,10,.18) 28%, rgba(6,7,10,.50) 100%);
}

.hero-layout {
  position: relative;
  z-index: 1;
}

.hero-copy, .hero-visual {
  position: relative;
  z-index: 1;
}

.hero-section::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 160px;
  background: linear-gradient(180deg, rgba(5,6,8,0) 0%, rgba(5,6,8,.92) 100%);
  pointer-events: none;
  z-index: -1;
}


/* Event refresh */
.events-grid-stack{ gap: 22px; }
.event-card-layout{ display:grid; grid-template-columns:minmax(240px, 360px) minmax(0,1fr); gap:24px; align-items:start; }
.upcoming-event-card{ overflow:hidden; }
.upcoming-event-card .event-poster-click .media-box-image{ margin-bottom:0; min-height:auto; aspect-ratio: 4 / 5; background:#050505; border:1px solid rgba(255,255,255,.08); }
.upcoming-event-card .event-poster-click .media-box-image img{ width:100%; height:100%; object-fit:cover; display:block; }
.event-card-copy{ display:grid; gap:10px; }
.event-inline-links{ display:grid; gap:8px; }
.event-chip-row{ display:flex; flex-wrap:wrap; gap:10px; }
.event-chip{
  display:inline-flex; align-items:center; padding:10px 12px; border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.03); color:rgba(255,255,255,.84); text-decoration:none; text-transform:uppercase; letter-spacing:.08em; font-size:.72rem;
}
.event-chip-accent{ border-color: rgba(207,172,45,.35); color: var(--accent); background: rgba(207,172,45,.06); }
.event-chip:hover{ border-color: rgba(255,255,255,.22); color:#fff; }
.os-modal-card{ padding:0 !important; overflow:hidden; }
.os-modal-bar{ display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:14px; padding:12px 16px; border-bottom:1px solid rgba(255,255,255,.08); background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02)); }
.os-modal-layout{ padding:24px 28px 28px; }
.os-modal-close{ position:static !important; width:44px; height:44px; border-radius:0 !important; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.03); }
.os-modal-close:hover{ color:var(--accent); border-color:var(--accent-border); background:rgba(207,172,45,.06); }
.event-modal-poster{ border-radius:0; }
.event-modal-content, .music-modal-content, .artist-modal-content{ display:grid; gap:12px; align-content:start; }
.event-modal-meta{ margin-bottom:0; }
.event-links-block{ display:grid; gap:10px; }
.event-link-stack{ display:flex; flex-wrap:wrap; gap:10px; }
.event-link-rolodex{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  overflow:visible;
  padding-bottom:0;
  scroll-snap-type:none;
}
.event-rolodex-card{
  flex:0 0 auto;
  min-width:0;
  width:auto;
  max-width:100%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:0;
  padding:10px 14px;
  text-decoration:none;
  border:1px solid rgba(255,255,255,.10);
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
  white-space:nowrap;
  border-radius:0;
  letter-spacing:.10em;
  box-shadow:none;
}
.event-rolodex-name{
  color:#fff;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:.74rem;
  line-height:1;
}
.event-rolodex-url{
  display:none;
}
.event-rolodex-card:hover{
  border-color:rgba(207,172,45,.35);
  box-shadow:0 0 0 1px rgba(207,172,45,.08) inset;
  background:rgba(207,172,45,.07);
  color:var(--accent);
}
@media (max-width: 900px){
  .event-card-layout,
  .event-modal-layout{
    grid-template-columns:1fr;
  }

  .track-list{
    grid-template-columns:1fr;
  }
}



.artist-select-row {
  display: grid;
  grid-template-columns: minmax(180px, 240px) minmax(0, 1fr);
  gap: 12px;
}

.music-kicker-row .panel-label {
  margin-bottom: 0;
}

.music-modal-meta-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 16px;
  margin-bottom: 14px;
}

.music-modal-release-type {
  font-family: "IBM Plex Mono", monospace;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.78rem;
  color: rgba(255,255,255,0.64);
  padding: 6px 10px;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.03);
}

.music-player-shell {
  display: grid;
  gap: 12px;
  margin-top: 16px;
  padding: 16px;
  border: 1px solid rgba(255,255,255,0.1);
  background: rgba(255,255,255,0.03);
}

.music-modal-audio {
  width: 100%;
}

.music-player-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.music-player-status {
  font-family: "IBM Plex Mono", monospace;
  font-size: 0.78rem;
  color: rgba(255,255,255,0.64);
  word-break: break-word;
}

.audio-preview {
  min-height: 140px;
  display: grid;
  place-items: center;
  text-align: center;
}

@media (max-width: 780px) {
  .artist-select-row {
    grid-template-columns: 1fr;
  }
}


.ghost-btn {
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid rgba(255,255,255,0.14);
  background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.92);
  border-radius: 12px;
  cursor: pointer;
}

.ghost-btn:hover {
  border-color: rgba(207,172,45,0.28);
  color: var(--accent);
}


.event-modal-content,
.music-modal-content,
.artist-modal-content {
  min-width: 0;
}

.event-links-block,
.event-link-stack,
.event-link-rolodex,
.event-modal-meta,
.event-modal-content > * {
  min-width: 0;
}

.event-link-stack .event-chip,
#eventModalVrcTl .event-chip,
#eventModalVrcTl a {
  width: auto;
  max-width: 100%;
  flex: 0 0 auto;
  align-self: flex-start;
}

.event-chip {
  max-width: 100%;
  white-space: nowrap;
}

.event-chip-row {
  align-items: flex-start;
}

#eventModalVrcTl {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}

#eventModalVrcTl .event-chip-accent {
  display: inline-flex;
}

.event-modal-layout {
  align-items: start;
}


.music-track-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.music-track-item.is-playable {
  cursor: pointer;
}

.music-track-item.is-playable:hover {
  color: var(--accent);
}

.music-track-flag {
  font-family: "IBM Plex Mono", monospace;
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgba(255,255,255,0.46);
}


.event-modal-content{
  display:grid;
  gap:14px;
  align-content:start;
}

#eventModalGroupsBlock,
#eventModalTlBlock,
#eventModalLineupWrap{
  margin-top:2px;
}


.artist-modal {
  z-index: 10020;
}

.music-modal {
  z-index: 10000;
}

.music-modal.modal-underlay-open .music-modal-backdrop {
  background: rgba(0,0,0,0.46);
}

.music-modal.modal-underlay-open .music-modal-card {
  transform: scale(0.985);
  opacity: 0.9;
}

.artist-modal-socials,
#artistModalSocials,
.music-modal-links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

.modal-link-btn,
.music-artist-link,
.music-modal-artist-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.03);
  color: rgba(255,255,255,0.92);
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.76rem;
  font-family: "IBM Plex Mono", monospace;
  transition: background var(--transition), color var(--transition), border-color var(--transition), box-shadow var(--transition), transform var(--transition);
}

.modal-link-btn:hover,
.music-artist-link:hover,
.music-modal-artist-button:hover:not([disabled]) {
  color: var(--accent);
  border-color: rgba(207,172,45,0.32);
  background: rgba(207,172,45,0.08);
  transform: translateY(-1px);
}

.music-artist-link,
.music-modal-artist-button,
.artist-release-link {
  width: auto;
  text-decoration: none;
}

.music-modal-artist-button[disabled] {
  opacity: 0.72;
  cursor: default;
}

.music-modal-meta-row {
  margin-bottom: 6px;
}

#musicModalText,
#artistModalText {
  white-space: pre-line;
  line-height: 1.8;
  color: rgba(255,255,255,0.78);
}

.music-modal-links {
  margin-top: 18px;
}

.music-waveform {
  width: 100%;
  height: 96px;
  display: block;
  border: none;
  background: linear-gradient(
    to bottom,
    rgba(255,255,255,0.03),
    rgba(255,255,255,0.01)
  );
  margin: 0;
  padding: 0;
}

.music-player-shell {
  display: grid;
  grid-auto-rows: min-content;
  align-content: start;
  row-gap: 0;
  padding: 12px;
  border: 1px solid rgba(255,255,255,0.1);
  background: rgba(255,255,255,0.03);
}

.music-modal-audio {
  width: 100%;
  height: 42px;
  min-height: 42px;
  margin: 0;
  display: block;
  overflow: hidden;
}

.music-player-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 10px;
}

.artist-modal-content,
.music-modal-content {
  min-width: 0;
}

.track-list {
  gap: 8px 18px;
}


.hero-video-overlay {
  --hero-overlay-strength: 0.72;
  background:
    radial-gradient(circle at 24% 45%, rgba(0,0,0, calc(0.08 + (var(--hero-overlay-strength) * 0.16))), transparent 32%),
    linear-gradient(90deg, rgba(6,7,10, calc(0.28 + (var(--hero-overlay-strength) * 0.56))) 0%, rgba(6,7,10, calc(0.20 + (var(--hero-overlay-strength) * 0.54))) 36%, rgba(6,7,10, calc(0.12 + (var(--hero-overlay-strength) * 0.42))) 58%, rgba(6,7,10, calc(0.22 + (var(--hero-overlay-strength) * 0.52))) 100%),
    linear-gradient(180deg, rgba(6,7,10, calc(0.10 + (var(--hero-overlay-strength) * 0.44))) 0%, rgba(6,7,10, calc(0.04 + (var(--hero-overlay-strength) * 0.22))) 28%, rgba(6,7,10, calc(0.16 + (var(--hero-overlay-strength) * 0.46))) 100%);
}

#artistsGrid,
#musicGrid,
#eventsList {
  display: block;
}

/* LAB GRID FIX */
#labsGrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 340px));
  gap: 22px;
  align-items: start;
  justify-content: start;
}

.slider-shell {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr) 56px;
  gap: 18px;
  align-items: center;
}
.slider-viewport { overflow: hidden; }
.slider-stage-grid {
  display: grid;
  grid-template-columns: repeat(var(--slider-cols, 1), minmax(0, 1fr));
  gap: 20px;
}
#artistsGrid .slider-stage-grid,
#musicGrid .slider-stage-grid { --slider-cols: 6; }
#pastEventsGallery .slider-stage-grid { --slider-cols: 4; }
.slider-arrow {
  width: 56px;
  height: 56px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.03);
  color: #fff;
  font-size: 2rem;
  cursor: pointer;
}
.slider-arrow:hover {
  border-color: var(--accent-border);
  color: var(--accent);
  background: rgba(207,172,45,.08);
}
.slider-status { margin-top: 12px; color: rgba(255,255,255,.54); font-size: .78rem; text-transform: uppercase; letter-spacing: .12em; text-align: center; }
.slider-shell.is-sliding-next .slider-stage,
.slider-shell.is-sliding-prev .slider-stage {
  animation-duration: 300ms;
  animation-timing-function: cubic-bezier(.22,.61,.36,1);
  animation-fill-mode: both;
}
.slider-shell.is-sliding-next .slider-stage { animation-name: sliderSlideInNext; }
.slider-shell.is-sliding-prev .slider-stage { animation-name: sliderSlideInPrev; }
@keyframes sliderSlideInNext {
  from { opacity: .34; transform: translateX(42px); }
  to { opacity: 1; transform: translateX(0); }
}
@keyframes sliderSlideInPrev {
  from { opacity: .34; transform: translateX(-42px); }
  to { opacity: 1; transform: translateX(0); }
}

.manual-flyer {
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
}
.manual-flyer .flyer-card-image {
  display: block;
  min-height: clamp(280px, 34vw, 400px);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 18px;
  overflow: hidden;
  background: #050505;
}
.manual-flyer img { width: 100%; height: 100%; object-fit: cover; display: block; }

.lab-card { padding: 0; overflow: hidden; }
.lab-card-link { display: block; color: inherit; text-decoration: none; }
.lab-card .media-box-image,
.lab-card .media-box { margin-bottom: 0; aspect-ratio: 16 / 10; min-height: 0; }
.lab-card-body { padding: 18px; display: grid; gap: 10px; }
.lab-link-row { display: flex; align-items: center; gap: 10px; color: rgba(255,255,255,.72); font-size: .86rem; word-break: break-all; }
.lab-icon { display: inline-flex; width: 34px; height: 34px; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; color: var(--accent); }
.lab-card:hover .lab-icon { border-color: var(--accent-border); background: rgba(207,172,45,.08); }

body.site-is-glitching { animation: siteGlitchFlash 180ms steps(2,end) 0s 10, siteGlitchJitter 90ms steps(2,end) 0s 18; }
body.site-is-glitching::before,
body.site-is-glitching::after { content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 99999; mix-blend-mode: screen; }
body.site-is-glitching::before { background: repeating-linear-gradient(180deg, rgba(255,0,110,.16) 0 3px, transparent 3px 9px), linear-gradient(90deg, rgba(255,0,110,.12), rgba(0,255,255,.12)); transform: translateX(-6px); animation: siteColorSplit 160ms steps(2,end) infinite; }
body.site-is-glitching::after { background: repeating-linear-gradient(0deg, rgba(255,255,255,.06) 0 1px, transparent 1px 4px); animation: siteColorSplitAlt 120ms steps(2,end) infinite; }
@keyframes siteGlitchFlash { 0%,100% { filter: none; } 50% { filter: contrast(1.35) brightness(1.08) saturate(1.4); } }
@keyframes siteGlitchJitter { 0% { transform: translate(0,0); } 25% { transform: translate(-4px, 2px); } 50% { transform: translate(4px, -2px); } 75% { transform: translate(-2px, -1px); } 100% { transform: translate(0,0); } }
@keyframes siteColorSplit { 0% { transform: translateX(-7px); opacity: .62; } 50% { transform: translateX(7px); opacity: .34; } 100% { transform: translateX(-7px); opacity: .62; } }
@keyframes siteColorSplitAlt { 0% { transform: translateX(6px); opacity: .26; } 50% { transform: translateX(-6px); opacity: .58; } 100% { transform: translateX(6px); opacity: .26; } }

@media (max-width: 1180px) {
  #artistsGrid .slider-stage-grid,
  #musicGrid .slider-stage-grid { --slider-cols: 4; }
  #pastEventsGallery .slider-stage-grid { --slider-cols: 3; }
}

@media (max-width: 780px) {
  .slider-shell { grid-template-columns: 44px minmax(0, 1fr) 44px; gap: 10px; }
  .slider-arrow { width: 44px; height: 44px; }
  #artistsGrid .slider-stage-grid,
  #musicGrid .slider-stage-grid,
  #pastEventsGallery .slider-stage-grid { --slider-cols: 1; }
}


.slider-viewport {
  overflow: hidden;
  min-width: 0;
}

.slider-stage {
  align-items: flex-start;
  will-change: transform, opacity;
}

.slider-stage-grid > * {
  min-width: 0;
  height: auto;
}

#artistsGrid,
#musicGrid,
#eventsUpcomingSlider,
#pastEventsGallery,
.slider-shell,
.slider-viewport,
.slider-stage,
.slider-stage-grid {
  min-height: 0 !important;
  height: auto !important;
}

.slider-shell {
  align-items: start !important;
}

.slider-viewport {
  display: block;
  overflow: hidden;
  min-width: 0;
}

.slider-stage {
  display: block;
  transform: translateZ(0);
  backface-visibility: hidden;
  will-change: transform, opacity;
}

.slider-stage-grid {
  display: grid;
  align-items: start !important;
}

.slider-stage-grid > * {
  align-self: start !important;
}

.artist-card,
.music-tile,
.upcoming-event-card,
.manual-flyer {
  align-self: start !important;
  height: auto !important;
}

.artist-card,
.music-tile,
.upcoming-event-card,
.manual-flyer {
  height: auto;
}

.artist-card {
  display: flex;
  flex-direction: column;
  max-height: 460px;
}

.artist-card-body p {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  overflow: hidden;
}

.upcoming-event-card {
  min-height: clamp(460px, 42vw, 620px);
}

.event-card-copy p {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 6;
  overflow: hidden;
}




/* ===== Slider / Card hardening fixes ===== */

.slider-shell{
  align-items:start;
}

.slider-shell > .slider-arrow{
  align-self:center;
  justify-self:center;
}

.slider-viewport{
  overflow:hidden;
  min-width:0;
  align-self:start;
}

.slider-stage{
  display:block;
  min-width:0;
  will-change:transform, opacity;
  backface-visibility:hidden;
  transform:translateZ(0);
}

.slider-stage-grid{
  display:grid;
  grid-template-columns:repeat(var(--slider-cols, 1), minmax(0, 1fr));
  gap:20px;
  align-items:start;
}

.slider-stage-grid > *{
  min-width:0;
  height:auto;
  align-self:start;
}

#artistsGrid,
#musicGrid,
#eventsUpcomingSlider,
#pastEventsGallery{
  min-height:0 !important;
  transition:none !important;
}

.slider-status{
  min-height:1.2em;
}

.slider-arrow,
.artist-card-button,
.music-cover-button,
.event-poster-click,
.manual-flyer,
.flyer-card-button{
  appearance:none;
  -webkit-appearance:none;
  outline:none;
  box-shadow:none;
  -webkit-tap-highlight-color:transparent;
}

.slider-arrow:focus,
.slider-arrow:focus-visible,
.artist-card-button:focus,
.artist-card-button:focus-visible,
.music-cover-button:focus,
.music-cover-button:focus-visible,
.event-poster-click:focus,
.event-poster-click:focus-visible,
.manual-flyer:focus,
.manual-flyer:focus-visible,
.flyer-card-button:focus,
.flyer-card-button:focus-visible{
  outline:none;
  box-shadow:none;
}

.artist-card-button img,
.music-cover-button img,
.event-poster-click img,
.manual-flyer img,
.flyer-card-button img{
  user-select:none;
  -webkit-user-drag:none;
}

.artist-card,
.music-tile{
  height:auto;
  display:flex;
  flex-direction:column;
  align-self:start;
  overflow:hidden;
}

.artist-card{
  max-height:none;
  min-height:0;
}

.artist-card-button .media-box-image,
.artist-card-button .media-box{
  aspect-ratio:1 / 1;
  min-height:0;
  margin-bottom:0;
  flex:0 0 auto;
}

.artist-card-button .media-box-image img{
  width:100%;
  height:100%;
  min-height:0;
  object-fit:cover;
  display:block;
}

.artist-card-body{
  padding:18px 20px 22px;
  display:grid;
  gap:8px;
  align-content:start;
  flex:1 1 auto;
  min-height:156px;
}

.artist-card-body h3{
  margin:0;
  line-height:1.02;
}

.artist-card-body p{
  margin:0;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
  overflow:hidden;
}

.music-tile{
  min-height:0;
}

.music-cover-button .media-box-image,
.music-cover-button .media-box{
  aspect-ratio:1 / 1;
  min-height:0;
  margin-bottom:0;
  flex:0 0 auto;
}

.music-cover-button .media-box-image img{
  width:100%;
  height:100%;
  min-height:0;
  object-fit:cover;
  display:block;
}

.music-tile-body{
  padding:18px 20px 20px;
  display:grid;
  gap:6px;
  align-content:start;
  flex:1 1 auto;
  min-height:120px;
}

.music-title{
  margin:0;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
}

.music-artist,
.music-artist-link{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
}

.upcoming-event-card,
.manual-flyer{
  height:auto;
  align-self:start;
}

.upcoming-event-card{
  min-height:0;
}

.event-card-layout{
  align-items:start;
}

.event-card-copy{
  align-content:start;
}

.event-card-copy p{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:6;
  overflow:hidden;
}

.manual-flyer .flyer-card-image{
  min-height:0;
  aspect-ratio:4 / 5;
}

@media (max-width: 1180px){
  #artistsGrid .slider-stage-grid,
  #musicGrid .slider-stage-grid{
    --slider-cols:4;
  }

  #pastEventsGallery .slider-stage-grid{
    --slider-cols:3;
  }
}

@media (max-width: 780px){
  .slider-shell{
    grid-template-columns:44px minmax(0, 1fr) 44px;
    gap:10px;
  }

  .slider-arrow{
    width:44px;
    height:44px;
  }

  #artistsGrid .slider-stage-grid,
  #musicGrid .slider-stage-grid,
  #pastEventsGallery .slider-stage-grid{
    --slider-cols:1;
  }

  .artist-card-body,
  .music-tile-body{
    min-height:0;
  }
}


.secret-modal {
  position: fixed;
  inset: 0;
  display: none;
  z-index: 10000;
}

.secret-modal.open {
  display: block;
}

.secret-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.82);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.secret-modal-card {
  position: relative;
  width: min(960px, calc(100vw - 40px));
  max-height: calc(100vh - 40px);
  overflow: auto;
  margin: 20px auto;
  background: linear-gradient(180deg, rgba(15,15,15,0.99), rgba(8,8,8,0.99));
  border: 1px solid rgba(255,255,255,0.12);
  box-shadow: 0 20px 80px rgba(0,0,0,0.55);
}

.secret-modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255,255,255,0.15);
  background: rgba(255,255,255,0.04);
  color: #fff;
  font-size: 1.5rem;
  cursor: pointer;
  z-index: 2;
}

.secret-modal-body {
  padding: 20px;
}

.secret-modal-media {
  width: 100%;
}

.secret-modal-media-video iframe {
  width: 100%;
  aspect-ratio: 9 / 16;
  max-height: calc(100vh - 130px);
  border: 1px solid rgba(255,255,255,0.08);
  background: #000;
  display: block;
  margin: 0 auto;
}

.secret-modal-media-image img {
  width: 100%;
  max-height: calc(100vh - 130px);
  object-fit: contain;
  display: block;
  border: 1px solid rgba(255,255,255,0.08);
  background: #000;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 640px) {
  .secret-modal-body { padding: 14px; }
  .secret-modal-media-video iframe { width: 100%; max-height: none; }
}
