/* ============================================================
   OnDestination - Stel je beleving samen
   Extends home.css (nav, footer, btn, kard, eye, wrap already defined)
   ============================================================ */

/* ── PAGE HEADER ── */
.config-header {
  padding: 72px 0 60px;
  background: #000;
  position: relative;
  overflow: hidden;
}
.config-header::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(ellipse 90% 70% at 50% 110%, rgba(111,224,0,.13), transparent 55%);
}
.config-header .wrap { position: relative; z-index: 1; }
.config-header h1 {
  font-family: 'Kardige', sans-serif; font-weight: 400;
  font-size: clamp(44px, 6vw, 84px); line-height: .97;
  letter-spacing: -.025em; margin: 0 0 22px; color: #F8F5EE;
}
.config-header h1 em { font-style: normal; color: #6FE000; text-shadow: 0 0 44px rgba(111,224,0,.38); }
.config-header .lead {
  font-size: 18px; line-height: 1.6; font-weight: 300;
  color: rgba(248,245,238,.62); max-width: 54ch; margin: 0;
}

/* ── PROGRESS STRIP ── */
.progress-wrap {
  position: sticky; top: 68px; z-index: 50;
  background: #080808; border-bottom: 1px solid rgba(255,255,255,.07);
}
.progress-inner {
  max-width: 1240px; margin: 0 auto; padding: 0 40px;
  display: flex; align-items: stretch; overflow-x: auto; scrollbar-width: none;
}
.progress-inner::-webkit-scrollbar { display: none; }
.prog-step {
  flex-shrink: 0; background: none; border: 0; cursor: default;
  display: flex; flex-direction: column; align-items: flex-start; gap: 3px;
  padding: 14px 22px; position: relative; font-family: 'Luxe Uno', sans-serif;
}
.prog-step::after {
  content: ""; position: absolute; bottom: 0; left: 0; right: 0; height: 2px;
  background: transparent; transition: background 220ms;
}
.prog-step.is-done::after  { background: rgba(111,224,0,.35); }
.prog-step.is-active::after { background: #6FE000; }
.pnum {
  font-size: 10px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: rgba(255,255,255,.22); transition: color 200ms;
}
.prog-step.is-done .pnum,
.prog-step.is-active .pnum { color: rgba(111,224,0,.8); }
.plabel {
  font-size: 13px; font-weight: 600; color: rgba(248,245,238,.32);
  white-space: nowrap; transition: color 200ms;
}
.prog-step.is-done .plabel  { color: rgba(248,245,238,.55); }
.prog-step.is-active .plabel { color: #F8F5EE; }

/* ── CONFIG MAIN ── */
.config-main {
  background: #000; padding: 52px 0 160px; min-height: 70vh;
}
.config-layout {
  max-width: 1240px; margin: 0 auto; padding: 0 40px;
  display: grid; grid-template-columns: 1fr 340px; gap: 48px; align-items: start;
}

/* ── STEP PANELS ── */
.step-wrap { display: none; }
.step-wrap.is-active {
  display: block;
  animation: step-rise 300ms cubic-bezier(.22,.61,.36,1) both;
}
@keyframes step-rise {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: none; }
}
.step-title {
  font-family: 'Kardige', sans-serif; font-weight: 400;
  font-size: clamp(30px, 3.8vw, 48px); line-height: 1.06;
  letter-spacing: -.022em; color: #F8F5EE; margin: 0 0 8px;
}
.step-subtitle {
  font-size: 16px; line-height: 1.55; color: rgba(248,245,238,.48);
  margin: 0 0 36px; max-width: 54ch;
}

/* ── FIELD GROUPS ── */
.field-group { margin-bottom: 36px; }
.field-label {
  display: block; font-size: 11px; font-weight: 700; letter-spacing: .16em;
  text-transform: uppercase; color: rgba(255,255,255,.32); margin-bottom: 14px;
}
.field-divider { height: 1px; background: rgba(255,255,255,.06); margin: 4px 0 34px; }

/* ── OPTION CARD GRID ── */
.opt-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 10px; }
.opt-grid.wide { grid-template-columns: repeat(auto-fill, minmax(165px, 1fr)); }
.opt-grid.col4 { grid-template-columns: repeat(4, 1fr); }
.opt-grid.col5 { grid-template-columns: repeat(5, 1fr); }
.opt-grid.col3 { grid-template-columns: repeat(3, 1fr); }

.opt-card {
  background: #121212; border: 1.5px solid rgba(255,255,255,.07);
  border-radius: 14px; padding: 16px 14px 14px; cursor: pointer;
  position: relative; overflow: hidden;
  display: flex; flex-direction: column; gap: 5px;
  transition: border-color 180ms, background 180ms, transform 180ms;
  user-select: none;
}
.opt-card:hover { border-color: rgba(111,224,0,.3); background: #181818; transform: translateY(-2px); }
.opt-card.is-selected { border-color: #6FE000; background: rgba(111,224,0,.07); }
.opt-card-chk {
  position: absolute; top: 10px; right: 10px;
  width: 17px; height: 17px; border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.18);
  transition: all 180ms; display: grid; place-items: center;
}
.opt-card.is-selected .opt-card-chk {
  background: #6FE000; border-color: #6FE000;
}
.opt-card.is-selected .opt-card-chk::after {
  content: "";
  width: 9px; height: 9px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 8.5l3 3 6-7'/%3E%3C/svg%3E");
  background-size: contain; background-repeat: no-repeat; background-position: center;
}
.opt-letter {
  font-family: 'Kardige', sans-serif; font-size: 32px;
  color: rgba(111,224,0,.2); line-height: 1; transition: color 180ms;
}
.opt-card.is-selected .opt-letter { color: rgba(111,224,0,.48); }
.opt-name { font-size: 14px; font-weight: 700; color: #F8F5EE; line-height: 1.2; }
.opt-desc { font-size: 12px; color: rgba(248,245,238,.38); line-height: 1.4; }
.opt-price { font-size: 11px; color: #6FE000; font-weight: 700; margin-top: 2px; }

/* ── PACKAGE CARDS ── */
.pkg-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.pkg-card {
  background: #121212; border: 1.5px solid rgba(255,255,255,.07);
  border-radius: 16px; padding: 22px 20px 20px; cursor: pointer;
  position: relative; transition: all 200ms cubic-bezier(.22,.61,.36,1); user-select: none;
}
.pkg-card:hover { border-color: rgba(111,224,0,.28); background: #181818; }
.pkg-card.is-selected { border-color: #6FE000; background: rgba(111,224,0,.06); }
.pkg-tier {
  font-size: 10px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: rgba(255,255,255,.25); margin-bottom: 8px;
}
.pkg-card.is-selected .pkg-tier { color: rgba(111,224,0,.65); }
.pkg-name {
  font-family: 'Kardige', sans-serif; font-size: 22px;
  letter-spacing: -.01em; color: #F8F5EE; margin-bottom: 8px; font-weight: 400;
}
.pkg-specs { font-size: 12.5px; color: rgba(248,245,238,.44); line-height: 1.5; margin-bottom: 14px; }
.pkg-price { font-size: 13px; font-weight: 700; color: #6FE000; }
.pkg-chk {
  position: absolute; top: 14px; right: 14px;
  width: 22px; height: 22px; border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.18);
  display: grid; place-items: center; transition: all 200ms;
}
.pkg-card.is-selected .pkg-chk { background: #6FE000; border-color: #6FE000; }
.pkg-card.is-selected .pkg-chk::after {
  content: ""; width: 11px; height: 11px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 8.5l3 3 6-7'/%3E%3C/svg%3E");
  background-size: contain; background-repeat: no-repeat; background-position: center;
}
.pkg-advies { border-style: dashed; }
.pkg-advies .pkg-tier { color: rgba(111,224,0,.6); }

/* ── GENRE CHIPS ── */
.chip-grid { display: flex; flex-wrap: wrap; gap: 8px; }
.chip {
  padding: 9px 18px; border-radius: 999px; border: 1.5px solid rgba(255,255,255,.1);
  background: #121212; font-size: 14px; font-weight: 600;
  color: rgba(248,245,238,.65); cursor: pointer; transition: all 160ms; user-select: none;
}
.chip:hover { border-color: rgba(111,224,0,.35); color: #F8F5EE; }
.chip.is-selected { border-color: #6FE000; background: rgba(111,224,0,.09); color: #6FE000; }

/* ── ARTIST CARDS ── */
.artist-opt-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.artist-opt {
  position: relative; border-radius: 18px; overflow: hidden; aspect-ratio: 2/3;
  cursor: pointer; border: 2px solid rgba(255,255,255,.06); background: #141414;
  transition: all 240ms cubic-bezier(.22,.61,.36,1);
}
.artist-opt:hover { transform: translateY(-4px); border-color: rgba(111,224,0,.38); }
.artist-opt.is-selected { border-color: #6FE000; box-shadow: 0 0 28px rgba(111,224,0,.26); }
.artist-opt img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ao-ph {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: repeating-linear-gradient(135deg, #141414 0 14px, #1c1c1c 14px 28px);
}
.ao-ph-icon { font-family: 'Kardige', sans-serif; font-size: 72px; color: rgba(111,224,0,.14); }
.ao-grad {
  position: absolute; inset: auto 0 0 0; height: 65%;
  background: linear-gradient(to top, #000 18%, rgba(0,0,0,.58) 60%, transparent);
}
.ao-meta { position: absolute; bottom: 0; left: 0; right: 0; padding: 0 14px 14px; }
.ao-name { font-family: 'Kardige', sans-serif; font-size: 18px; color: #F8F5EE; margin: 0 0 4px; font-weight: 400; }
.ao-genres { font-size: 11px; color: rgba(248,245,238,.55); font-weight: 600; }
.ao-badge {
  position: absolute; top: 11px; right: 11px;
  width: 26px; height: 26px; border-radius: 50%;
  border: 2px solid rgba(255,255,255,.35); background: rgba(0,0,0,.45);
  display: grid; place-items: center; backdrop-filter: blur(4px); transition: all 220ms;
}
.artist-opt.is-selected .ao-badge { background: #6FE000; border-color: #6FE000; }
.ao-chk-icon {
  width: 12px; height: 12px; opacity: 0; transition: opacity 180ms;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 8.5l3 3 6-7'/%3E%3C/svg%3E");
  background-size: contain; background-repeat: no-repeat; background-position: center;
}
.artist-opt.is-selected .ao-chk-icon { opacity: 1; }

/* ── RANGE SLIDER ── */
.range-field { display: flex; flex-direction: column; gap: 10px; }
.range-val {
  font-family: 'Kardige', sans-serif; font-size: 38px;
  letter-spacing: -.025em; color: #F8F5EE; line-height: 1;
}
.range-val .unit {
  font-family: 'Luxe Uno', sans-serif; font-size: 16px; font-weight: 400;
  color: rgba(248,245,238,.42); margin-left: 6px; letter-spacing: 0;
}
input[type=range] {
  -webkit-appearance: none; appearance: none; width: 100%; height: 4px;
  background: rgba(255,255,255,.12); border-radius: 999px; outline: none; cursor: pointer;
}
input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none; width: 22px; height: 22px; border-radius: 50%;
  background: #6FE000;
  box-shadow: 0 0 0 3px rgba(111,224,0,.2), 0 2px 8px rgba(0,0,0,.5);
  cursor: pointer; transition: box-shadow 160ms;
}
input[type=range]::-webkit-slider-thumb:hover {
  box-shadow: 0 0 0 6px rgba(111,224,0,.22), 0 2px 8px rgba(0,0,0,.5);
}
input[type=range]::-moz-range-thumb {
  width: 22px; height: 22px; border-radius: 50%; background: #6FE000; border: 0;
}
.range-ticks {
  display: flex; justify-content: space-between;
  font-size: 11px; color: rgba(255,255,255,.2); margin-top: 2px;
}

/* ── TOGGLE ── */
.toggle-row {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 16px 0; border-bottom: 1px solid rgba(255,255,255,.06);
}
.toggle-row:first-child { padding-top: 0; }
.toggle-row:last-child { border-bottom: 0; padding-bottom: 0; }
.toggle-info { display: flex; flex-direction: column; gap: 3px; }
.toggle-lbl { font-size: 16px; font-weight: 600; color: #F8F5EE; }
.toggle-sub { font-size: 13px; color: rgba(248,245,238,.4); }
.tgl { position: relative; width: 48px; height: 26px; flex-shrink: 0; }
.tgl input { opacity: 0; width: 0; height: 0; position: absolute; }
.tgl-track {
  position: absolute; inset: 0; border-radius: 999px;
  background: rgba(255,255,255,.1); cursor: pointer; transition: background 220ms;
}
.tgl-track::after {
  content: ""; position: absolute; left: 3px; top: 3px; width: 20px; height: 20px;
  background: rgba(255,255,255,.62); border-radius: 50%;
  transition: transform 220ms cubic-bezier(.22,.61,.36,1), background 220ms;
}
.tgl input:checked + .tgl-track { background: #6FE000; }
.tgl input:checked + .tgl-track::after { transform: translateX(22px); background: #000; }

/* ── SELECT ── */
.sel-wrap { position: relative; }
.sel-wrap select {
  -webkit-appearance: none; appearance: none; width: 100%;
  background: #121212; border: 1.5px solid rgba(255,255,255,.1);
  border-radius: 12px; padding: 13px 42px 13px 16px;
  font-family: 'Luxe Uno', sans-serif; font-size: 15px; color: #F8F5EE;
  cursor: pointer; outline: none; transition: border-color 180ms;
}
.sel-wrap select:focus { border-color: #6FE000; }
.sel-wrap::after {
  content: ""; position: absolute; right: 15px; top: 50%; transform: translateY(-50%);
  width: 16px; height: 16px; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%236FE000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
  background-size: contain; background-repeat: no-repeat;
}

/* ── TEXT INPUT ── */
.txt {
  background: #121212; border: 1.5px solid rgba(255,255,255,.1);
  border-radius: 12px; padding: 13px 16px;
  font-family: 'Luxe Uno', sans-serif; font-size: 15px; color: #F8F5EE;
  width: 100%; outline: none; transition: border-color 180ms;
}
.txt::placeholder { color: rgba(248,245,238,.28); }
.txt:focus { border-color: #6FE000; }
textarea.txt { resize: vertical; min-height: 96px; }
input[type=date].txt { cursor: pointer; color-scheme: dark; }

/* ── PILL SELECTOR ── */
.pill-sel { display: flex; gap: 8px; flex-wrap: wrap; }
.pill-sel button {
  padding: 10px 22px; border-radius: 999px; border: 1.5px solid rgba(255,255,255,.12);
  background: #121212; font-family: 'Luxe Uno', sans-serif; font-size: 14px; font-weight: 600;
  color: rgba(248,245,238,.58); cursor: pointer; transition: all 160ms;
}
.pill-sel button:hover { border-color: rgba(111,224,0,.35); color: #F8F5EE; }
.pill-sel button.is-active { border-color: #6FE000; background: rgba(111,224,0,.09); color: #6FE000; }

/* ── GRID HELPERS ── */
.g2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.g3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px; }

/* ── COLLAPSIBLE / REVEAL ── */
.reveal-wrap { overflow: hidden; max-height: 0; transition: max-height 380ms ease; }
.reveal-wrap.is-open { max-height: 800px; }

/* ── STEP NAV ── */
.step-nav {
  display: flex; align-items: center; justify-content: space-between;
  margin-top: 44px; padding-top: 28px; border-top: 1px solid rgba(255,255,255,.07);
}
.sn-left { display: flex; align-items: center; gap: 16px; }
.step-of { font-size: 13px; color: rgba(248,245,238,.26); font-weight: 600; }
.btn-prev {
  display: inline-flex; align-items: center; gap: 8px; font: inherit; cursor: pointer;
  font-size: 14px; font-weight: 600; color: rgba(248,245,238,.5);
  background: none; border: 0; padding: 0; transition: color 160ms;
}
.btn-prev:hover { color: #F8F5EE; }

/* ── PRICE PANEL (sticky sidebar) ── */
.price-panel {
  position: sticky; top: 142px;
  background: #0d0d0d; border: 1px solid rgba(255,255,255,.09);
  border-radius: 22px; padding: 28px; overflow: hidden;
}
.price-panel::before {
  content: ""; position: absolute; top: -60px; right: -40px;
  width: 200px; height: 200px; border-radius: 50%;
  background: radial-gradient(circle, rgba(111,224,0,.11), transparent 68%);
  pointer-events: none;
}
.pp-ey {
  font-size: 11px; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: rgba(255,255,255,.26); margin-bottom: 6px;
}
.pp-range-display {
  font-family: 'Kardige', sans-serif; letter-spacing: -.02em; line-height: 1;
  color: #F8F5EE; margin-bottom: 5px;
}
.pp-range-display .pp-num { font-size: 34px; }
.pp-range-display .pp-sep {
  font-size: 16px; color: rgba(248,245,238,.28);
  margin: 0 5px; font-family: 'Luxe Uno', sans-serif; font-weight: 300;
}
.pp-note { font-size: 11px; color: rgba(248,245,238,.2); line-height: 1.45; margin-top: 5px; }
.pp-div { height: 1px; background: rgba(255,255,255,.07); margin: 18px 0; }
.pp-items { display: flex; flex-direction: column; gap: 9px; min-height: 60px; }
.pp-item {
  display: flex; justify-content: space-between; align-items: baseline; gap: 8px;
  animation: pp-in 200ms ease both;
}
@keyframes pp-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; } }
.pp-item-lbl {
  font-size: 12.5px; color: rgba(248,245,238,.48); flex: 1; min-width: 0;
  overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
}
.pp-item-amt { font-size: 12.5px; font-weight: 600; color: rgba(248,245,238,.68); white-space: nowrap; }
.pp-item.is-base .pp-item-lbl,
.pp-item.is-base .pp-item-amt { color: rgba(248,245,238,.26); }

/* ── SUMMARY STEP ── */
.sum-section {
  background: #111; border: 1px solid rgba(255,255,255,.07);
  border-radius: 18px; padding: 24px; margin-bottom: 14px;
}
.sum-section h4 {
  font-family: 'Kardige', sans-serif; font-weight: 400; font-size: 20px;
  letter-spacing: -.01em; color: #F8F5EE; margin: 0 0 16px;
}
.sum-row {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: 9px 0; border-bottom: 1px solid rgba(255,255,255,.05); gap: 16px;
}
.sum-row:last-child { border-bottom: 0; padding-bottom: 0; }
.sum-key { font-size: 13.5px; color: rgba(248,245,238,.4); flex-shrink: 0; }
.sum-val { font-size: 13.5px; font-weight: 600; color: #F8F5EE; text-align: right; }
.sum-val.green { color: #6FE000; }
.sum-none { font-size: 13.5px; color: rgba(248,245,238,.22); font-style: italic; }

.final-price-box {
  background: rgba(111,224,0,.07); border: 1px solid rgba(111,224,0,.22);
  border-radius: 22px; padding: 32px; text-align: center; margin-bottom: 32px;
}
.fpb-label {
  font-size: 11px; font-weight: 700; letter-spacing: .16em;
  text-transform: uppercase; color: rgba(111,224,0,.65); margin-bottom: 10px;
}
.fpb-price {
  font-family: 'Kardige', sans-serif; font-size: 52px;
  letter-spacing: -.025em; color: #F8F5EE; line-height: 1;
}
.fpb-price .fsep {
  font-size: 26px; color: rgba(248,245,238,.32); margin: 0 10px;
  font-family: 'Luxe Uno', sans-serif; font-weight: 300;
}
.fpb-disc { font-size: 12px; color: rgba(248,245,238,.26); margin-top: 10px; line-height: 1.5; }

.cf-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
.cf-lbl {
  display: block; font-size: 11px; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; color: rgba(255,255,255,.3); margin-bottom: 8px;
}
.cf-full { grid-column: span 2; }

/* ── MOBILE PRICE BAR ── */
.mpb {
  display: none; position: fixed; bottom: 0; left: 0; right: 0; z-index: 80;
  background: rgba(10,10,10,.96); border-top: 1px solid rgba(255,255,255,.1);
  padding: 12px 22px; align-items: center; justify-content: space-between; gap: 12px;
  backdrop-filter: blur(10px);
}
.mpb-left { display: flex; flex-direction: column; gap: 2px; }
.mpb-ey { font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.26); }
.mpb-num { font-family: 'Kardige', sans-serif; font-size: 22px; letter-spacing: -.01em; color: #F8F5EE; }
.mpb-nav { display: flex; gap: 10px; }
.mpb-nav .btn { padding: 11px 18px; font-size: 13px; }

/* ── RESPONSIVE ── */
@media (max-width: 1100px) {
  .artist-opt-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 900px) {
  .config-layout { grid-template-columns: 1fr; padding: 0 22px; }
  .price-panel { display: none; }
  .mpb { display: flex; }
  .config-main { padding-bottom: 90px; }
  .progress-wrap { top: 58px; }
  .progress-inner { padding: 0 0 0 22px; }
  .artist-opt-grid { grid-template-columns: repeat(2, 1fr); }
  .pkg-grid { grid-template-columns: 1fr; }
  .g2, .g3 { grid-template-columns: 1fr; }
  .cf-grid { grid-template-columns: 1fr; }
  .cf-full { grid-column: span 1; }
  .fpb-price { font-size: 38px; }
  .opt-grid.col4, .opt-grid.col5 { grid-template-columns: repeat(2, 1fr); }
  .opt-grid.col3 { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 540px) {
  .opt-grid { grid-template-columns: repeat(2, 1fr); }
  .opt-grid.col3 { grid-template-columns: repeat(2, 1fr); }
  .artist-opt-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ── DISABLED CARD ── */
.opt-card.is-disabled,
.pkg-card.is-disabled {
  opacity: .32;
  pointer-events: none;
  cursor: not-allowed;
}
/* Re-enable for tooltip-only hover + badge readability */
.pkg-card.is-disabled {
  opacity: 1;
  pointer-events: auto;
  cursor: default;
  background: #0e0e0e;
  border-color: rgba(255,255,255,.05);
}
.pkg-card.is-disabled .pkg-tier,
.pkg-card.is-disabled .pkg-name,
.pkg-card.is-disabled .pkg-specs,
.pkg-card.is-disabled .pkg-price,
.pkg-card.is-disabled .pkg-chk,
.pkg-card.is-disabled .rec-badge { opacity: .22; }
.pkg-card.is-disabled:hover {
  transform: none;
  border-color: rgba(255,255,255,.05);
  background: #0e0e0e;
}

/* ── DISABLED MESSAGE ── */
.field-disabled-msg {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 18px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 12px;
  font-size: 13.5px;
  color: rgba(248,245,238,.42);
  margin-bottom: 18px;
}
.field-disabled-msg svg { flex-shrink: 0; color: rgba(248,245,238,.28); }

/* ── ARTIST TAGS ── */
.artist-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-height: 34px;
  align-items: center;
}
.artist-tag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 10px 7px 14px;
  background: rgba(111,224,0,.1);
  border: 1.5px solid rgba(111,224,0,.35);
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  color: #6FE000;
}
.artist-tag button {
  background: none;
  border: 0;
  cursor: pointer;
  color: rgba(111,224,0,.55);
  font-size: 17px;
  line-height: 1;
  padding: 0 2px;
  display: flex;
  align-items: center;
  transition: color 160ms;
}
.artist-tag button:hover { color: #6FE000; }

/* ── ARTIST MODAL ── */
.artist-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 200;
  background: rgba(0,0,0,.82);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px 20px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 260ms;
  backdrop-filter: blur(4px);
}
.artist-modal-overlay.is-open {
  opacity: 1;
  pointer-events: auto;
}
.artist-modal {
  background: #0d0d0d;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 24px;
  width: 100%;
  max-width: 880px;
  max-height: 82vh;
  overflow-y: auto;
  padding: 32px;
  transform: translateY(18px);
  transition: transform 280ms cubic-bezier(.22,.61,.36,1);
}
.artist-modal-overlay.is-open .artist-modal { transform: none; }
.modal-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 26px;
  gap: 20px;
}
.modal-head h3 {
  font-family: 'Kardige', sans-serif;
  font-size: 28px;
  font-weight: 400;
  letter-spacing: -.02em;
  color: #F8F5EE;
  margin: 0;
}
.modal-close {
  background: none;
  border: 1.5px solid rgba(255,255,255,.18);
  border-radius: 50%;
  width: 36px;
  height: 36px;
  cursor: pointer;
  display: grid;
  place-items: center;
  color: rgba(248,245,238,.55);
  flex-shrink: 0;
  transition: all 160ms;
}
.modal-close:hover { border-color: rgba(255,255,255,.4); color: #F8F5EE; }
.modal-artists-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.modal-confirm {
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid rgba(255,255,255,.08);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.modal-selected-count { font-size: 14px; color: rgba(248,245,238,.45); }
.modal-selected-count strong { color: #6FE000; }

/* Disabled tier badge inside pkg-card */
.pkg-card .tier-limit {
  position: absolute;
  bottom: 10px;
  right: 10px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(248,245,238,.38);
  background: rgba(255,255,255,.06);
  padding: 3px 8px;
  border-radius: 6px;
}
.pkg-card.is-disabled .tier-limit {
  color: #ff6060;
  background: rgba(255,60,60,.14);
  border: 1px solid rgba(255,80,80,.32);
  opacity: 1;
}

@media (max-width: 640px) {
  .modal-artists-grid { grid-template-columns: repeat(2, 1fr); }
  .artist-modal { padding: 22px; max-height: 90vh; }
}

/* ── MODAL GROUP LABELS ── */
.modal-group-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(248,245,238,.4);
  margin: 22px 0 12px;
}
.modal-group-label:first-child { margin-top: 0; }
#modalArtistGrid .modal-artists-grid { margin-bottom: 4px; }

/* ── TIMETABLE ── */
.timetable {
  background: #0e0e0e;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  padding: 18px 20px 20px;
}
.tt-axis {
  display: flex;
  align-items: center;
  margin-bottom: 14px;
}
.tt-axis-spacer { width: 230px; flex-shrink: 0; }
.tt-axis-hours {
  flex: 1;
  display: flex;
  justify-content: space-between;
  font-size: 10.5px;
  font-weight: 600;
  color: rgba(248,245,238,.32);
  letter-spacing: .02em;
}
.tt-rows { display: flex; flex-direction: column; gap: 12px; }
.tt-row {
  display: flex;
  align-items: center;
  gap: 14px;
}
.tt-info {
  width: 138px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.tt-name { font-size: 14px; font-weight: 700; color: #F8F5EE; line-height: 1.2; }
.tt-type { font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.tt-fields { display: flex; gap: 6px; flex-shrink: 0; }
.tt-sel {
  -webkit-appearance: none; appearance: none;
  background: #1a1a1a;
  border: 1.5px solid rgba(255,255,255,.12);
  border-radius: 8px;
  padding: 7px 10px;
  font-family: 'Luxe Uno', sans-serif;
  font-size: 12.5px;
  color: #F8F5EE;
  cursor: pointer;
  outline: none;
  transition: border-color 160ms;
}
.tt-sel:focus { border-color: #6FE000; }
.tt-track {
  flex: 1;
  height: 26px;
  background: rgba(255,255,255,.04);
  border-radius: 7px;
  position: relative;
  overflow: hidden;
  min-width: 80px;
}
.tt-bar {
  position: absolute;
  top: 3px; bottom: 3px;
  border-radius: 5px;
  opacity: .85;
  transition: left 220ms cubic-bezier(.22,.61,.36,1), width 220ms cubic-bezier(.22,.61,.36,1);
  min-width: 6px;
}
.tt-bar-clash {
  opacity: 1;
  background-image: repeating-linear-gradient(45deg, rgba(0,0,0,.25) 0 5px, transparent 5px 10px);
}

/* ── TIMETABLE v2: STAGES ── */
.tt-stage {
  background: #0e0e0e;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  padding: 16px 18px 18px;
  margin-bottom: 12px;
}
.tt-stage-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
}
.tt-stage-name {
  background: transparent;
  border: 0;
  border-bottom: 1.5px solid rgba(255,255,255,.12);
  font-family: 'Kardige', sans-serif;
  font-size: 19px;
  letter-spacing: -.01em;
  color: #F8F5EE;
  padding: 2px 2px 5px;
  outline: none;
  flex: 1;
  min-width: 0;
  transition: border-color 160ms;
}
.tt-stage-name:focus { border-color: #6FE000; }
.tt-stage-del {
  width: 28px; height: 28px;
  border-radius: 8px;
  background: none;
  border: 1px solid rgba(255,255,255,.14);
  color: rgba(248,245,238,.5);
  font-size: 17px;
  cursor: pointer;
  flex-shrink: 0;
  transition: all 160ms;
}
.tt-stage-del:hover { border-color: rgba(224,72,72,.5); color: #E04848; }
.tt-empty-stage {
  font-size: 13px;
  color: rgba(248,245,238,.32);
  font-style: italic;
  padding: 8px 0;
}
.tt-warn {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 12.5px;
  color: #ff8585;
  background: rgba(224,72,72,.1);
  border: 1px solid rgba(224,72,72,.28);
  border-radius: 10px;
  padding: 10px 14px;
  margin: 12px 0 4px;
}
.tt-warn svg { flex-shrink: 0; }
.tt-stage-sel { max-width: 110px; }

/* ── COVERAGE BAR ── */
.tt-cov { margin-top: 14px; }
.tt-cov-label {
  font-size: 12px;
  color: rgba(248,245,238,.42);
  margin-bottom: 7px;
}
.tt-cov-label strong { color: #6FE000; font-weight: 700; }
.tt-cov-track {
  position: relative;
  height: 30px;
  background: rgba(255,255,255,.035);
  border-radius: 8px;
  overflow: hidden;
}
.cov-seg {
  position: absolute;
  top: 0; bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.cov-lead { background: rgba(111,224,0,.42); }
.cov-pl {
  background: rgba(58,147,232,.4);
  border-left: 1px solid rgba(58,147,232,.6);
  cursor: pointer;
  transition: background 160ms;
}
.cov-pl:hover { background: rgba(58,147,232,.6); }
.cov-pl span {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #cfe6ff;
  white-space: nowrap;
  overflow: hidden;
}
.cov-gap {
  position: absolute;
  top: 0; bottom: 0;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  border-left: 1px dashed rgba(255,255,255,.1);
  transition: background 160ms;
}
.cov-gap:hover { background: rgba(111,224,0,.08); }
.cov-gap span {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: rgba(248,245,238,.3);
  white-space: nowrap;
  overflow: hidden;
}
.cov-gap:hover span { color: #6FE000; }

/* ── ADD STAGE BUTTON ── */
.tt-add-stage {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: transparent;
  border: 1.5px dashed rgba(255,255,255,.18);
  border-radius: 12px;
  padding: 12px 20px;
  font-family: 'Luxe Uno', sans-serif;
  font-size: 13.5px;
  font-weight: 600;
  color: rgba(248,245,238,.6);
  cursor: pointer;
  transition: all 180ms;
  width: 100%;
  justify-content: center;
}
.tt-add-stage:hover { border-color: rgba(111,224,0,.4); color: #6FE000; }

/* ── SPOTIFY / LINK INPUTS ── */
.spotify-input { position: relative; display: flex; align-items: center; }
.spotify-ico { position: absolute; left: 14px; flex-shrink: 0; pointer-events: none; }
.spotify-url { padding-left: 42px !important; padding-right: 110px !important; }
.link-status { position: absolute; right: 14px; font-size: 12px; font-weight: 600; pointer-events: none; }
.link-status.ok { color: #1DB954; }
.link-status.err { color: #ff6060; }
.txt.field-ok { border-color: rgba(29,185,84,.5); }
.ref-row { display: flex; align-items: center; gap: 14px; margin-bottom: 10px; }
.ref-name { width: 140px; flex-shrink: 0; font-size: 14px; font-weight: 600; color: #F8F5EE; }
.ref-row .spotify-input { flex: 1; }
@media (max-width: 640px) {
  .ref-row { flex-direction: column; align-items: stretch; gap: 6px; }
  .ref-name { width: auto; }
}

/* ── PINTEREST / PHOTO MOODBOARD ── */
.moodboard { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.mood-item {
  position: relative;
  width: 110px; height: 110px;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.1);
  background: #141414;
}
.mood-item img { width: 100%; height: 100%; object-fit: cover; }
.mood-pin {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 6px; text-align: center; padding: 8px;
}
.mood-pin svg { color: #E60023; }
.mood-pin span { font-size: 10px; color: rgba(248,245,238,.5); word-break: break-all; line-height: 1.3; }
.mood-del {
  position: absolute; top: 5px; right: 5px;
  width: 22px; height: 22px; border-radius: 50%;
  background: rgba(0,0,0,.65); border: 0; color: #fff;
  font-size: 14px; cursor: pointer; display: grid; place-items: center;
}
.mood-del:hover { background: #E04848; }
.mood-add {
  width: 110px; height: 110px; border-radius: 12px;
  border: 1.5px dashed rgba(255,255,255,.18);
  background: transparent; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 6px; color: rgba(248,245,238,.5);
  font-family: 'Luxe Uno', sans-serif; font-size: 11px; font-weight: 600;
  transition: all 160ms;
}
.mood-add:hover { border-color: rgba(111,224,0,.4); color: #6FE000; }

/* ── TIMING GRID ── */
.timing-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.timing-field { display: flex; flex-direction: column; gap: 7px; }
.timing-field label { font-size: 12px; font-weight: 600; color: rgba(248,245,238,.55); }
.timing-summary { margin-top: 14px; font-size: 13px; color: rgba(248,245,238,.5); line-height: 1.6; }
.timing-summary strong { color: #6FE000; font-weight: 700; }
.sel-wrap.locked { opacity: .65; }
.sel-wrap.locked::before {
  content: ""; position: absolute; right: 38px; top: 50%; transform: translateY(-50%);
  width: 13px; height: 13px; z-index: 1; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236FE000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='11' width='18' height='11' rx='2'/%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'/%3E%3C/svg%3E");
  background-size: contain; background-repeat: no-repeat;
}
@media (max-width: 760px) { .timing-grid { grid-template-columns: 1fr 1fr; } }

/* ── EVENT PREVIEW SCENE ── */
.event-preview {
  position: relative;
  width: 100%;
  height: 150px;
  border-radius: 14px;
  overflow: hidden;
  margin-bottom: 20px;
  background: radial-gradient(ellipse 80% 60% at 50% 18%, #14210a 0%, #0a0a0a 62%);
  border: 1px solid rgba(255,255,255,.08);
}
.ev-sky { position: absolute; inset: 0; }
.ev-beam {
  position: absolute; top: -6%;
  width: 14px; height: 78%;
  transform-origin: top center;
  background: linear-gradient(to bottom, rgba(111,224,0,.55), rgba(111,224,0,0) 88%);
  filter: blur(3px);
  animation: ev-sway 3.2s ease-in-out infinite alternate;
}
.ev-beam.off { background: linear-gradient(to bottom, rgba(255,255,255,.05), transparent 80%); animation: none; }
@keyframes ev-sway { from { transform: rotate(-14deg); opacity: .5; } to { transform: rotate(14deg); opacity: .95; } }
.ev-laser {
  position: absolute; top: 12%;
  width: 2px; height: 70%;
  transform-origin: top center;
  transform: rotate(var(--r));
  background: linear-gradient(to bottom, rgba(224,72,72,.9), rgba(224,72,72,0) 90%);
  animation: ev-laser-flick 1.4s steps(2) infinite;
}
@keyframes ev-laser-flick { 0%,100% { opacity: .25; } 50% { opacity: .95; } }
.ev-spk {
  position: absolute;
  width: 14px; height: 14px;
  background: #1c1c1c;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 2px;
}
.ev-spk::after { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: rgba(111,224,0,.3); }
.ev-booth {
  position: absolute; bottom: 22%; left: 50%; transform: translateX(-50%);
  width: 54px; height: 30px;
  background: linear-gradient(to bottom, #1f1f1f, #111);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 4px 4px 0 0;
}
.ev-booth-glow {
  position: absolute; top: -10px; left: 50%; transform: translateX(-50%);
  width: 30px; height: 10px; border-radius: 50%;
  background: radial-gradient(circle, rgba(111,224,0,.6), transparent 70%);
  animation: ev-pulse 1.6s ease-in-out infinite;
}
@keyframes ev-pulse { 0%,100% { opacity: .5; } 50% { opacity: 1; } }
.ev-fog {
  position: absolute; bottom: 16%; left: 0; right: 0; height: 30px;
  background: linear-gradient(to top, rgba(200,230,255,.16), transparent);
  filter: blur(5px);
  animation: ev-fog-drift 5s ease-in-out infinite alternate;
}
@keyframes ev-fog-drift { from { opacity: .5; transform: translateX(-6px); } to { opacity: .85; transform: translateX(6px); } }
.ev-co2 {
  position: absolute; bottom: 24%;
  width: 4px; height: 0; border-radius: 2px;
  background: linear-gradient(to top, rgba(255,255,255,.9), transparent);
  animation: ev-co2 2.4s ease-out infinite;
}
@keyframes ev-co2 { 0% { height: 0; opacity: 0; } 15% { opacity: .9; } 60% { height: 56%; opacity: 0; } 100% { opacity: 0; } }
.ev-spark {
  position: absolute; bottom: 22%;
  width: 3px; height: 0;
  background: linear-gradient(to top, #FFD23A, #fff);
  box-shadow: 0 0 6px #FFD23A;
  animation: ev-spark 2s ease-out infinite;
}
@keyframes ev-spark { 0% { height: 0; opacity: 0; } 20% { opacity: 1; } 70% { height: 40%; opacity: .6; } 100% { opacity: 0; } }
.ev-crowd { position: absolute; inset: 0; }
.ev-person {
  position: absolute;
  width: 6px; height: 9px;
  background: #000;
  border-radius: 3px 3px 0 0;
  box-shadow: 0 0 3px rgba(111,224,0,.25);
  animation: ev-bob 0.8s ease-in-out infinite alternate;
}
@keyframes ev-bob { from { transform: translateY(0); } to { transform: translateY(-2px); } }
.ev-conf {
  position: absolute; top: -8px;
  width: 5px; height: 5px;
  border-radius: 1px;
  animation: ev-fall 2.4s linear infinite;
}
@keyframes ev-fall { to { transform: translateY(160px) rotate(360deg); opacity: .2; } }
.ev-label {
  position: absolute; top: 9px; left: 12px;
  font-size: 11px; font-weight: 700; letter-spacing: .04em;
  color: rgba(248,245,238,.85);
  background: rgba(0,0,0,.4);
  padding: 4px 9px; border-radius: 999px;
  backdrop-filter: blur(3px);
}
@media (prefers-reduced-motion: reduce) {
  .ev-beam, .ev-laser, .ev-booth-glow, .ev-fog, .ev-co2, .ev-spark, .ev-person, .ev-conf { animation: none !important; }
}

/* ── VENUE LIST (modal) ── */
.venue-list { display: flex; flex-direction: column; gap: 10px; }
.venue-card {
  display: flex;
  gap: 16px;
  align-items: center;
  background: #121212;
  border: 1.5px solid rgba(255,255,255,.08);
  border-radius: 14px;
  padding: 12px;
  cursor: pointer;
  transition: all 180ms cubic-bezier(.22,.61,.36,1);
}
.venue-card:hover { border-color: rgba(111,224,0,.3); background: #181818; }
.venue-card.is-selected { border-color: #6FE000; background: rgba(111,224,0,.07); }
.venue-card.is-disabled { opacity: .4; cursor: not-allowed; }
.venue-card.is-disabled:hover { border-color: rgba(255,255,255,.08); background: #121212; }
.venue-img {
  width: 110px;
  height: 76px;
  border-radius: 10px;
  flex-shrink: 0;
}
.venue-info { flex: 1; min-width: 0; }
.venue-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.venue-name { font-family: 'Kardige', sans-serif; font-size: 19px; color: #F8F5EE; letter-spacing: -.01em; }
.venue-check { color: #6FE000; font-size: 16px; font-weight: 700; }
.venue-meta { font-size: 12.5px; color: rgba(248,245,238,.48); margin: 4px 0 6px; }
.venue-price { font-size: 13px; font-weight: 700; color: #6FE000; }
.venue-toosmall { font-size: 11.5px; color: #ff6060; margin-top: 4px; font-weight: 600; }

/* ── VENUE SELECTED TAG ── */
.venue-selected { min-height: 20px; }
.venue-tag {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  background: rgba(111,224,0,.08);
  border: 1.5px solid rgba(111,224,0,.3);
  border-radius: 14px;
  padding: 14px 16px;
}
.venue-tag strong { display: block; font-size: 15px; color: #F8F5EE; margin-bottom: 2px; }
.venue-tag span { font-size: 12.5px; color: rgba(248,245,238,.5); }
.venue-tag button {
  background: none; border: 0; cursor: pointer;
  color: rgba(111,224,0,.6); font-size: 20px; line-height: 1;
  padding: 0 4px; flex-shrink: 0; transition: color 160ms;
}
.venue-tag button:hover { color: #6FE000; }

/* ── FIELD ERROR (inline validation) ── */
.txt.field-error { border-color: #ff5555; background: rgba(255,60,60,.06); }
.form-error-msg {
  display: none;
  align-items: center;
  gap: 10px;
  padding: 13px 18px;
  background: rgba(255,60,60,.1);
  border: 1px solid rgba(255,80,80,.3);
  border-radius: 12px;
  font-size: 13.5px;
  color: #ff8080;
  margin-bottom: 16px;
}

@media (max-width: 760px) {
  .tt-row { flex-wrap: wrap; }
  .tt-info { width: auto; }
  .tt-track { flex-basis: 100%; order: 3; }
  .tt-axis-spacer { display: none; }
  .tt-axis-hours { width: 100%; }
  .venue-img { width: 84px; height: 60px; }
}


/* ============================================================
   BIG EVENT SCENE
   ============================================================ */
.bigscene-section { background: #000; padding: 80px 0 100px; border-top: 1px solid rgba(255,255,255,.06); }
.bigscene {
  position: relative; width: 100%; height: 440px; border-radius: 22px; overflow: hidden;
  background: linear-gradient(to bottom, #0a1505 0%, #060a04 40%, #050505 100%);
  border: 1px solid rgba(255,255,255,.09);
}
.bs-backdrop { position: absolute; inset: 0; }
.bs-horizon { position: absolute; left: 0; right: 0; bottom: 22%; height: 1px; background: rgba(111,224,0,.16); }
.bs-tree { position: absolute; bottom: 20%; width: 26px; height: 60px; background: linear-gradient(to top,#0c1206,#0a0f05); border-radius: 50% 50% 40% 40%; opacity: .7; }
.bs-building { position: absolute; bottom: 20%; left: 50%; transform: translateX(-50%); opacity: .5; }
.bs-villa { width: 220px; height: 90px; background: #0c1408; border-radius: 6px; }
.bs-villa::before { content:""; position:absolute; top:-34px; left:50%; transform:translateX(-50%); border-left:120px solid transparent; border-right:120px solid transparent; border-bottom:36px solid #0c1408; }
.bs-industrial { width: 320px; height: 84px; background: repeating-linear-gradient(90deg,#0c1408 0 40px,#0a1106 40px 44px); border-radius: 3px; }
.bs-generic { width: 240px; height: 80px; background: #0c1408; border-radius: 4px; }
.bs-skyline { position:absolute; bottom:20%; left:0; right:0; height:70px; opacity:.55;
  background: repeating-linear-gradient(90deg, transparent 0 14px, #0c1408 14px 46px, transparent 46px 56px, #0a1106 56px 92px); }
.bs-waterline { position:absolute; left:0; right:0; bottom:0; height:20%; background: linear-gradient(to bottom, rgba(58,147,232,.08), rgba(58,147,232,.02)); }

.bs-sky { position: absolute; inset: 0; }
.bs-beam { position:absolute; top:-8%; width:20px; height:62%; transform-origin:top center; filter:blur(4px);
  background: linear-gradient(to bottom, rgba(111,224,0,.5), transparent 88%); animation: bs-sway 3.4s ease-in-out infinite alternate; }
@keyframes bs-sway { from{ transform:rotate(-16deg); opacity:.45; } to{ transform:rotate(16deg); opacity:.9; } }
.bs-laser { position:absolute; top:8%; width:2px; height:74%; transform-origin:top center; transform:rotate(var(--r));
  background: linear-gradient(to bottom, rgba(224,72,72,.85), transparent 92%); animation: bs-laserflick 1.5s steps(2) infinite; }
@keyframes bs-laserflick { 0%,100%{opacity:.2;} 50%{opacity:.95;} }

.bs-stage { position:absolute; bottom:20%; transform:translateX(-50%); width:120px; animation: bs-pop .5s cubic-bezier(.34,1.56,.64,1) both; }
@keyframes bs-pop { from{ opacity:0; transform:translateX(-50%) translateY(12px) scale(.9);} to{ opacity:1; transform:translateX(-50%) translateY(0) scale(1);} }
.bs-stage-top { width:100%; height:8px; background: linear-gradient(to right, transparent, #1c1c1c 20%, #1c1c1c 80%, transparent); border-radius:4px; }
.bs-booth { position:relative; width:64px; height:38px; margin:6px auto 0; background:linear-gradient(to bottom,#222,#111); border:1px solid rgba(255,255,255,.14); border-radius:5px 5px 0 0; }
.bs-booth-glow { position:absolute; top:-12px; left:50%; transform:translateX(-50%); width:38px; height:12px; border-radius:50%; background:radial-gradient(circle,rgba(111,224,0,.6),transparent 70%); animation: bs-pulse 1.6s ease-in-out infinite; }
@keyframes bs-pulse { 0%,100%{opacity:.5;} 50%{opacity:1;} }
.bs-artist { position:absolute; bottom:38px; width:9px; height:16px; border-radius:4px 4px 2px 2px; transform:translateX(-50%); box-shadow:0 0 8px currentColor; animation: bs-bob .7s ease-in-out infinite alternate, bs-pop .5s cubic-bezier(.34,1.56,.64,1) both; }
.bs-stage-label { position:absolute; bottom:-18px; left:50%; transform:translateX(-50%); font-size:10px; font-weight:700; letter-spacing:.05em; color:rgba(248,245,238,.5); white-space:nowrap; }
.bs-spk { position:absolute; width:18px; height:24px; background:#161616; border:1px solid rgba(255,255,255,.16); border-radius:3px; animation: bs-pop .4s ease both; }
.bs-spk::after { content:""; position:absolute; left:50%; top:55%; transform:translate(-50%,-50%); width:9px; height:9px; border-radius:50%; background:rgba(111,224,0,.35); }

.bs-fog { position:absolute; bottom:16%; left:0; right:0; height:54px; background:linear-gradient(to top, rgba(200,230,255,.14), transparent); filter:blur(8px); animation: bs-fogdrift 6s ease-in-out infinite alternate; }
@keyframes bs-fogdrift { from{opacity:.5; transform:translateX(-10px);} to{opacity:.85; transform:translateX(10px);} }
.bs-co2 { position:absolute; bottom:22%; width:6px; height:0; border-radius:3px; background:linear-gradient(to top,rgba(255,255,255,.9),transparent); animation: bs-co2 2.6s ease-out infinite; }
@keyframes bs-co2 { 0%{height:0;opacity:0;} 12%{opacity:.9;} 60%{height:62%;opacity:0;} 100%{opacity:0;} }
.bs-spark { position:absolute; bottom:20%; width:3px; height:0; background:linear-gradient(to top,#FFD23A,#fff); box-shadow:0 0 8px #FFD23A; animation: bs-spark 2.1s ease-out infinite; }
@keyframes bs-spark { 0%{height:0;opacity:0;} 18%{opacity:1;} 70%{height:46%;opacity:.6;} 100%{opacity:0;} }
.bs-foam { position:absolute; left:0; right:0; bottom:0; height:14%; background:radial-gradient(circle at 20% 50%, rgba(255,255,255,.18) 6px, transparent 7px) , radial-gradient(circle at 50% 60%, rgba(255,255,255,.16) 8px, transparent 9px), radial-gradient(circle at 80% 50%, rgba(255,255,255,.18) 6px, transparent 7px); background-size: 40px 40px; opacity:.7; }

.bs-crowd { position:absolute; inset:0; }
.bs-person { position:absolute; width:7px; height:12px; background:#000; border-radius:3px 3px 0 0; box-shadow:0 0 4px rgba(111,224,0,.3); animation: bs-bob .8s ease-in-out infinite alternate; }
@keyframes bs-bob { from{transform:translateY(0);} to{transform:translateY(-3px);} }
.bs-conf { position:absolute; top:-10px; width:7px; height:7px; border-radius:1px; animation: bs-fall 2.8s linear infinite; }
@keyframes bs-fall { to{ transform:translateY(460px) rotate(540deg); opacity:.15; } }

.bs-crew { position:absolute; bottom:6%; display:flex; flex-direction:column; align-items:center; gap:4px; animation: bs-pop .5s ease both; }
.bs-cam { position:relative; width:20px; height:14px; background:#1a1a1a; border:1px solid rgba(255,255,255,.2); border-radius:3px; }
.bs-cam::before { content:""; position:absolute; left:-6px; top:50%; transform:translateY(-50%); width:7px; height:8px; background:#1a1a1a; border-radius:50%; }
.bs-cam-v::before { width:9px; height:9px; }
.bs-flash { position:absolute; top:-2px; left:50%; transform:translateX(-50%); width:8px; height:8px; border-radius:50%; background:#fff; opacity:0; animation: bs-flash 3.5s ease-out infinite; }
@keyframes bs-flash { 0%,92%{opacity:0;} 94%{opacity:1;box-shadow:0 0 16px #fff;} 100%{opacity:0;} }
.bs-rec { position:absolute; top:0; right:-2px; width:6px; height:6px; border-radius:50%; background:#E04848; animation: bs-rec 1.2s steps(2) infinite; }
@keyframes bs-rec { 0%,100%{opacity:.3;} 50%{opacity:1;} }
.bs-crew-lbl { font-size:9px; font-weight:700; letter-spacing:.04em; color:rgba(248,245,238,.5); white-space:nowrap; }

.bs-banner { position:absolute; top:16px; left:50%; transform:translateX(-50%); font-family:'Kardige',sans-serif; font-size:26px; letter-spacing:-.01em; color:#F8F5EE; text-shadow:0 2px 20px rgba(0,0,0,.6); }
.bs-venue-lbl { position:absolute; top:54px; left:50%; transform:translateX(-50%); font-size:12px; font-weight:600; color:rgba(248,245,238,.55); white-space:nowrap; }

@media (prefers-reduced-motion: reduce) { .bs-beam,.bs-laser,.bs-booth-glow,.bs-fog,.bs-co2,.bs-spark,.bs-person,.bs-artist,.bs-conf,.bs-flash,.bs-rec { animation:none !important; } }
@media (max-width: 700px) { .bigscene { height: 320px; } .bs-banner { font-size:20px; } }

/* ── BIG SCENE READ-ONLY TIMETABLE ── */
.bigscene-tt { margin-top: 28px; }
.bstt-title { font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:rgba(248,245,238,.4); margin-bottom:16px; }
.bstt-stage { background:#0e0e0e; border:1px solid rgba(255,255,255,.08); border-radius:14px; padding:16px 18px; margin-bottom:10px; }
.bstt-stage-name { font-family:'Kardige',sans-serif; font-size:17px; color:#F8F5EE; margin-bottom:10px; letter-spacing:-.01em; }
.bstt-axis { display:flex; justify-content:space-between; font-size:10px; font-weight:600; color:rgba(248,245,238,.3); margin-bottom:8px; padding-left:128px; }
.bstt-row { display:flex; align-items:center; gap:14px; margin-bottom:7px; }
.bstt-name { width:114px; flex-shrink:0; font-size:13px; font-weight:600; color:#F8F5EE; }
.bstt-track { flex:1; height:26px; background:rgba(255,255,255,.04); border-radius:7px; position:relative; }
.bstt-bar { position:absolute; top:3px; bottom:3px; border-radius:5px; opacity:.9; display:flex; align-items:center; justify-content:center; min-width:30px; }
.bstt-bar span { font-size:9px; font-weight:700; color:rgba(0,0,0,.7); white-space:nowrap; overflow:hidden; }
.bstt-pl { background:rgba(58,147,232,.5); }
.bstt-pl span { color:#cfe6ff; }
@media (max-width:700px){ .bstt-axis{ padding-left:0; } .bstt-row{ flex-wrap:wrap; } .bstt-name{ width:auto; } .bstt-track{ flex-basis:100%; } }


/* ============================================================
   BIG SCENE v2 - colorful, richer, zoom
   ============================================================ */
.bs-zoom { position:absolute; inset:0; transform-origin:50% 86%; transition: transform .55s cubic-bezier(.22,.61,.36,1); }

/* colorful lights */
.bs-beam { background: linear-gradient(to bottom, var(--c,#6FE000), transparent 86%) !important; opacity:.7; width:22px !important; }
.bs-laser { background: linear-gradient(to bottom, var(--lc,#E0489C), transparent 92%) !important; box-shadow:0 0 4px var(--lc); width:2.5px !important; }

/* visible colorful people */
.bs-person { width:8px !important; height:16px !important; background:linear-gradient(to bottom,var(--pc,#6FE000),color-mix(in srgb,var(--pc,#6FE000) 75%,#000)) !important; border-radius:4px 4px 3px 3px !important; box-shadow:0 0 5px var(--pc) !important; opacity:.97; transform:scale(var(--ps,1)); transform-origin:bottom center; }
.bs-person::before { content:""; position:absolute; top:-6px; left:50%; transform:translateX(-50%); width:6px; height:6px; border-radius:50%; background:var(--pc); box-shadow:0 0 5px var(--pc); }
.bs-person::after { content:""; position:absolute; bottom:-4px; left:50%; transform:translateX(-50%); width:8px; height:4px; border-radius:50%; background:radial-gradient(ellipse,rgba(0,0,0,.55),transparent 72%); z-index:-1; }

/* artists on stage */
.bs-artist { width:11px !important; height:20px !important; border-radius:5px 5px 2px 2px; background:var(--ac,#6FE000) !important; box-shadow:0 0 12px var(--ac) !important; }
.bs-artist::before { content:""; position:absolute; top:-6px; left:50%; transform:translateX(-50%); width:7px; height:7px; border-radius:50%; background:var(--ac); box-shadow:0 0 6px var(--ac); }
.bs-art-live { opacity:.95; }

/* line-array speakers */
.bs-array { position:absolute; bottom:46px; display:flex; flex-direction:column-reverse; gap:2px; }
.bs-array-l { left:-26px; }
.bs-array-r { right:-26px; }
.bs-la { width:14px; height:9px; background:linear-gradient(to bottom,#2a2a2a,#141414); border:1px solid rgba(255,255,255,.18); border-radius:2px; }
.bs-la::after { content:""; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:5px; height:5px; border-radius:50%; background:rgba(111,224,0,.4); }
.bs-subs { position:absolute; bottom:-2px; left:50%; transform:translateX(-50%); display:flex; gap:3px; }
.bs-sub { width:16px; height:12px; background:#161616; border:1px solid rgba(255,255,255,.16); border-radius:2px; }

/* catering: bar + tables */
.bs-bar { position:absolute; bottom:9%; left:14%; width:48px; height:20px; }
.bs-bar-top { position:absolute; inset:0; background:linear-gradient(to bottom,#3a2a16,#241a0e); border:1px solid rgba(255,210,120,.3); border-radius:3px; }
.bs-bottle { position:absolute; bottom:14px; width:4px; height:9px; background:#6FE000; border-radius:1px; box-shadow:0 0 4px rgba(111,224,0,.5); }
.bs-table { position:absolute; bottom:11%; width:26px; height:14px; transform:translateX(-50%); background:radial-gradient(ellipse at center,#2a2a2a,#161616); border:1px solid rgba(255,255,255,.12); border-radius:50%; }
.bs-table::before { content:""; position:absolute; top:-4px; left:50%; transform:translateX(-50%); width:8px; height:5px; border-radius:50%; background:rgba(255,210,120,.5); box-shadow:0 0 6px rgba(255,210,120,.4); }

/* decor */
.bs-garland { position:absolute; top:18%; left:0; right:0; height:30px; background:radial-gradient(circle at 10% 0,rgba(255,210,120,.6) 1.5px,transparent 2px) repeat-x; background-size:26px 30px; opacity:.7; border-top:1px dashed rgba(255,210,120,.3); }
.bs-balloon { position:absolute; top:24%; width:13px; height:17px; border-radius:50%; opacity:.85; animation: bs-float 3s ease-in-out infinite alternate; }
.bs-balloon::after { content:""; position:absolute; bottom:-8px; left:50%; width:1px; height:8px; background:rgba(255,255,255,.3); }
@keyframes bs-float { from{transform:translateY(0);} to{transform:translateY(-6px);} }

/* occasion accents */
.bs-arch { position:absolute; bottom:20%; left:50%; transform:translateX(-50%); width:90px; height:70px; border:4px solid rgba(255,255,255,.25); border-bottom:0; border-radius:45px 45px 0 0; box-shadow:0 0 14px rgba(255,210,230,.3); }
.bs-redcarpet { position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:70px; height:22%; background:linear-gradient(to top,rgba(224,72,72,.5),rgba(224,72,72,.15)); }

/* clearer effects */
.bs-fog { height:70px !important; background:linear-gradient(to top, rgba(210,235,255,.28), transparent) !important; filter:blur(7px) !important; opacity:.9 !important; }
.bs-fog-low { bottom:8% !important; height:46px !important; background:linear-gradient(to top, rgba(220,240,255,.4), rgba(220,240,255,.05)) !important; }
.bs-co2 { width:9px !important; background:linear-gradient(to top, rgba(255,255,255,1), rgba(255,255,255,.2), transparent) !important; box-shadow:0 0 10px rgba(255,255,255,.5); }
.bs-spark { width:4px !important; box-shadow:0 0 12px #FFD23A !important; }

/* bigger crew */
.bs-crew { bottom:8% !important; gap:5px !important; }
.bs-cam { width:30px !important; height:20px !important; }
.bs-cam::before { width:10px !important; height:11px !important; left:-8px !important; }
.bs-crew-lbl { font-size:11px !important; color:#fff !important; background:rgba(0,0,0,.55); padding:2px 8px; border-radius:6px; font-weight:700; }
.bs-flash { width:11px !important; height:11px !important; }
.bs-photo .bs-cam { background:#222; }

/* moment buttons */
.tt-moment-btns { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.tt-moment-btn { padding:9px 16px; border-radius:999px; border:1.5px dashed rgba(255,255,255,.16); background:transparent; font-family:'Luxe Uno',sans-serif; font-size:12.5px; font-weight:600; color:rgba(248,245,238,.6); cursor:pointer; transition:all 160ms; }
.tt-moment-btn:hover { border-color:rgba(111,224,0,.4); color:#6FE000; }

/* big TT phase line */
.bstt-phases { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:14px; }
.bstt-phase { font-size:12px; color:rgba(248,245,238,.5); background:#0e0e0e; border:1px solid rgba(255,255,255,.08); border-radius:999px; padding:7px 14px; }
.bstt-phase b { color:#6FE000; }


/* ============================================================
   SCENE PLAYBACK + SHARED SMALL/BIG
   ============================================================ */
.bs-scene { position:absolute; inset:0; }
.event-preview .bs-scene-sm { font-size: .5em; }
/* timeline bar */
.scene-tl { position:absolute; top:0; left:0; right:0; height:14px; background:rgba(0,0,0,.5); z-index:6; border-bottom:1px solid rgba(255,255,255,.08); }
.scene-tl-seg { position:absolute; top:0; bottom:0; }
.tl-inloop { background:rgba(255,255,255,.05); }
.tl-prog { background:rgba(111,224,0,.1); }
.scene-tl-art { position:absolute; top:3px; height:8px; border-radius:2px; opacity:.85; }
.scene-tl-moment { position:absolute; top:2px; width:3px; height:10px; border-radius:1px; }
.scene-ph { position:absolute; top:-2px; bottom:-2px; width:2px; background:#fff; box-shadow:0 0 8px #fff; z-index:7; transition:left .12s linear; }
.scene-ph::after { content:""; position:absolute; top:-3px; left:50%; transform:translateX(-50%); width:7px; height:7px; border-radius:50%; background:#fff; box-shadow:0 0 8px #fff; }
.scene-phase { position:absolute; top:20px; left:50%; transform:translateX(-50%); z-index:6; font-size:12px; font-weight:700; letter-spacing:.02em; color:#fff; background:rgba(0,0,0,.55); padding:4px 12px; border-radius:999px; backdrop-filter:blur(4px); white-space:nowrap; max-width:90%; overflow:hidden; text-overflow:ellipsis; }
.event-preview .scene-phase { font-size:9px; top:18px; padding:3px 8px; }
.event-preview .scene-tl { height:9px; }

/* dancing crowd (program) */
.bs-person { animation: bs-dance .7s ease-in-out infinite alternate; }
@keyframes bs-dance { 0%{ transform:scale(var(--ps,1)) translate(0,0) rotate(-5deg);} 100%{ transform:scale(var(--ps,1)) translate(var(--sx,3px),-16%) rotate(5deg);} }
/* inloop: guests walk in from the sides */
.bs-scene[data-phase="inloop"] .bs-person { animation: bs-walkin 2.8s ease-out both !important; }
@keyframes bs-walkin { 0%{ transform:scale(var(--ps,1)) translateX(var(--wf,-70px)); opacity:0;} 12%{ opacity:.95;} 78%{ transform:scale(var(--ps,1)) translateX(2px);} 100%{ transform:scale(var(--ps,1)) translateX(0); opacity:.97;} }
/* uitloop: guests drift out and thin */
.bs-scene[data-phase="uitloop"] .bs-person { animation: bs-walkout 3.6s ease-in both !important; }
@keyframes bs-walkout { 0%{ transform:scale(var(--ps,1)) translateX(0); opacity:.92;} 100%{ transform:scale(var(--ps,1)) translateX(var(--wf,70px)); opacity:.04;} }
/* diner: standing crowd sits down at the tables */
.bs-crowd { transition:opacity .7s ease; }
.bs-scene[data-phase="diner"] .bs-crowd { opacity:0; }
.bs-table[data-dinner] { opacity:.5; transition:opacity .5s ease; }
.bs-scene[data-phase="diner"] .bs-table[data-dinner] { opacity:1; }
.bs-table[data-dinner] .bs-seat { opacity:.4; transition:opacity .5s ease; }
.bs-scene[data-phase="diner"] .bs-table[data-dinner] .bs-seat { opacity:1; animation: bs-eat 1.7s ease-in-out infinite alternate; }
@keyframes bs-eat { from{ transform:translate(-50%,-50%);} to{ transform:translate(-50%,calc(-50% - 1.5px));} }
/* dim inactive artists during playback */
.bs-scene.has-active .bs-artist:not(.is-active) { opacity:.28 !important; box-shadow:none !important; }
.bs-artist.is-active { box-shadow:0 0 18px var(--ac) !important; }

/* statafels (standing tables) */
.bs-statafel { position:absolute; bottom:9%; width:11px; height:18px; transform:translateX(-50%); }
.bs-statafel::before { content:""; position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:3px; height:14px; background:#2a2a2a; }
.bs-statafel::after { content:""; position:absolute; top:0; left:50%; transform:translateX(-50%); width:11px; height:5px; border-radius:50%; background:#3a3a3a; border:1px solid rgba(255,255,255,.12); }
/* dinner tables with seated guests */
.bs-table[data-dinner] { width:30px; height:15px; transform:translateX(-50%); background:radial-gradient(ellipse at center,#3c3c3c,#1a1a1a 80%); border:1px solid rgba(255,255,255,.14); border-radius:50%; box-shadow:0 3px 7px rgba(0,0,0,.5); }
.bs-candle { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:3px; height:3px; border-radius:50%; background:#FFD98A; box-shadow:0 0 9px 2px rgba(255,200,80,.85); animation: bs-flicker 1.4s ease-in-out infinite alternate; }
@keyframes bs-flicker { from{ opacity:.7;} to{ opacity:1; box-shadow:0 0 12px 3px rgba(255,200,80,.95);} }
.bs-table[data-dinner] .bs-seat { position:absolute; width:6px; height:8px; border-radius:3px 3px 2px 2px; background:var(--pc,#999); box-shadow:0 0 5px var(--pc,#999); transform:translate(-50%,-50%); }
.bs-table[data-dinner] .bs-seat::before { content:""; position:absolute; top:-4px; left:50%; transform:translateX(-50%); width:4px; height:4px; border-radius:50%; background:var(--pc,#999); box-shadow:0 0 4px var(--pc,#999); }


/* scene anchor + CTA */
.scene-anchor { display:inline-flex; align-items:center; gap:7px; width:100%; justify-content:center; margin-bottom:18px; background:rgba(111,224,0,.1); border:1px solid rgba(111,224,0,.3); border-radius:12px; padding:11px; font-family:'Luxe Uno',sans-serif; font-size:13px; font-weight:700; color:#6FE000; cursor:pointer; transition:all 160ms; }
.scene-anchor:hover { background:rgba(111,224,0,.18); }
.bigscene-cta { display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; margin-top:28px; padding:24px 28px; background:#0e0e0e; border:1px solid rgba(255,255,255,.09); border-radius:18px; }
.bsc-eyebrow { font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:#6FE000; margin:0 0 6px; }
.bsc-title { font-family:'Kardige',sans-serif; font-size:24px; letter-spacing:-.01em; color:#F8F5EE; margin:0; }

/* total gantt */
.bstt-total { background:#111; }
.bstt-total-track { position:relative; height:34px; border-radius:7px; overflow:hidden; background:rgba(255,255,255,.03); }
.btt-seg { position:absolute; top:0; bottom:0; display:flex; align-items:center; padding-left:8px; }
.btt-seg span { font-size:10px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:rgba(248,245,238,.6); white-space:nowrap; overflow:hidden; }
.btt-inloop { background:rgba(255,255,255,.05); }
.btt-prog { background:rgba(111,224,0,.14); }
.btt-prog span { color:rgba(111,224,0,.85); }
.btt-uitloop { background:rgba(255,255,255,.05); }
.btt-moment { position:absolute; top:4px; bottom:4px; border-radius:4px; display:flex; align-items:center; justify-content:center; opacity:.92; }
.btt-moment span { font-size:9px; font-weight:700; color:rgba(0,0,0,.75); white-space:nowrap; overflow:hidden; padding:0 3px; }
@media (max-width:700px){ .bigscene-cta { flex-direction:column; align-items:flex-start; } }


/* ── fixes round: phase label position, bigger stage, contact under sim ── */
.scene-phase { top:auto !important; bottom:12px !important; }
.event-preview .scene-phase { bottom:8px !important; top:auto !important; }
.bs-venue-lbl { top:48px; }
/* bigger stage / booth */
.bs-booth { width:92px !important; height:54px !important; }
.bs-booth-glow { width:54px !important; height:16px !important; top:-15px !important; }
.bs-stage { width:160px !important; }
.bs-stage-top { height:11px !important; }
.bs-artist { width:13px !important; height:24px !important; }
.bs-artist::before { width:8px !important; height:8px !important; top:-7px !important; }
.bs-array { bottom:58px !important; }
.bs-array-l { left:-30px !important; }
.bs-array-r { right:-30px !important; }

/* contact form moved under simulation */
.contact-under-sim { margin-top:30px; padding:32px; background:#0e0e0e; border:1px solid rgba(255,255,255,.09); border-radius:20px; }
.contact-under-sim .sum-section { background:transparent; border:0; padding:0; margin:0; }
.contact-under-sim .sum-section h4 { display:none; }


/* ============================================================
   ANIMATED ARTIST FIGURES (DJ, horn, singer, percussion, violin, guitar)
   ============================================================ */
.bs-artist { width:22px !important; height:28px !important; background:none !important; box-shadow:none !important; border-radius:0 !important; animation:none !important; bottom:44px !important; overflow:visible; }
.bs-artist::before { display:none !important; content:none !important; }
.actfig { width:100%; height:100%; overflow:visible; display:block; filter:drop-shadow(0 0 4px var(--ac)); animation:figbob .62s ease-in-out infinite alternate; }
@keyframes figbob { from{ transform:translateY(0);} to{ transform:translateY(-1.6px);} }
.actfig .af-head,.actfig .af-body,.actfig .af-arm { fill:currentColor; }
.actfig .af-inst,.actfig .af-bell,.actfig .af-drum,.actfig .af-deck { fill:currentColor; }
.actfig .af-deck { opacity:.5; }
.actfig .af-drum { opacity:.5; }
.actfig .af-tube { fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; }
.actfig [class*="a-"] { transform-box:fill-box; }
/* DJ - hands scratching the decks */
.actfig .a-dj-l { transform-origin:50% 0; animation:djL .46s ease-in-out infinite alternate; }
.actfig .a-dj-r { transform-origin:50% 0; animation:djR .52s ease-in-out infinite alternate; }
@keyframes djL { from{ transform:rotate(-20deg);} to{ transform:rotate(-42deg);} }
@keyframes djR { from{ transform:rotate(20deg);} to{ transform:rotate(42deg);} }
/* Horn (sax / trumpet) - sway & blow */
.actfig .a-horn { transform-origin:42% 28%; animation:hornbob .85s ease-in-out infinite alternate; }
@keyframes hornbob { from{ transform:rotate(-5deg);} to{ transform:rotate(6deg);} }
/* Singer - mic to mouth, sway */
.actfig .a-mic { transform-origin:28% 92%; animation:micsway .7s ease-in-out infinite alternate; }
@keyframes micsway { from{ transform:rotate(-7deg);} to{ transform:rotate(9deg);} }
/* Percussionist - drumming hands */
.actfig .a-perc-l { transform-origin:50% 0; animation:percL .25s ease-in-out infinite alternate; }
.actfig .a-perc-r { transform-origin:50% 0; animation:percR .25s ease-in-out infinite alternate; }
@keyframes percL { from{ transform:rotate(-8deg);} to{ transform:rotate(14deg);} }
@keyframes percR { from{ transform:rotate(8deg);} to{ transform:rotate(-14deg);} }
/* Violinist - bow sliding */
.actfig .a-bow { transform-origin:50% 50%; animation:bowslide .5s ease-in-out infinite alternate; }
@keyframes bowslide { from{ transform:translate(-3px,1px) rotate(-20deg);} to{ transform:translate(3px,-1px) rotate(-20deg);} }
/* Guitarist (band) - strumming */
.actfig .a-strum { transform-origin:50% 0; animation:strum .26s ease-in-out infinite alternate; }
@keyframes strum { from{ transform:rotate(-10deg);} to{ transform:rotate(16deg);} }
/* intensify the act that is currently playing; calm the rest */
.bs-artist.is-active .actfig { filter:drop-shadow(0 0 9px var(--ac)); }
.bs-scene.has-active .bs-artist:not(.is-active) .actfig *,
.bs-scene.has-active .bs-artist:not(.is-active) .actfig { animation-play-state:paused; }
@media (prefers-reduced-motion: reduce) { .actfig, .actfig * { animation:none !important; } }


/* ============================================================
   EXTRA DETAIL - figures (legs/headphones/notes), speakers, lasers
   ============================================================ */
.bs-artist { height:30px !important; bottom:40px !important; }
.actfig .af-leg { fill:currentColor; }
.actfig .af-hp { fill:none; stroke:currentColor; stroke-width:1.3; }
.actfig .af-hpc { fill:currentColor; }
.actfig .af-platter { fill:#0a0a0a; stroke:currentColor; stroke-width:.6; }
.actfig .af-drumtop { fill:currentColor; opacity:.8; }
.actfig .af-note { fill:currentColor; }
/* dance step for non-DJ acts */
.bs-artist:not(.af-dj) .af-leg-l { transform-origin:50% 0; animation:stepL .5s ease-in-out infinite alternate; }
.bs-artist:not(.af-dj) .af-leg-r { transform-origin:50% 0; animation:stepR .5s ease-in-out infinite alternate; }
@keyframes stepL { from{ transform:rotate(-7deg);} to{ transform:rotate(6deg);} }
@keyframes stepR { from{ transform:rotate(7deg);} to{ transform:rotate(-6deg);} }
/* singer raised arm */
.actfig .a-armup { transform-origin:50% 100%; animation:armup 1s ease-in-out infinite alternate; }
@keyframes armup { from{ transform:rotate(6deg);} to{ transform:rotate(-14deg);} }
/* floating music notes (horn / singer / band) */
.actfig .a-note { transform-box:fill-box; opacity:0; animation:noteFloat 1.8s ease-out infinite; }
@keyframes noteFloat { 0%{ opacity:0; transform:translateY(0) scale(.8);} 18%{ opacity:.95;} 100%{ opacity:0; transform:translateY(-9px) scale(1.05);} }
/* pumping line-array speakers */
.bs-la::after { animation: laPulse .5s ease-in-out infinite alternate; }
@keyframes laPulse { from{ transform:translate(-50%,-50%) scale(.8); opacity:.5;} to{ transform:translate(-50%,-50%) scale(1.18); opacity:1;} }
.bs-sub { animation: subPump .5s ease-in-out infinite alternate; }
@keyframes subPump { from{ transform:scaleY(1);} to{ transform:scaleY(1.12);} }
/* laser emitter + floor hit */
.bs-laser::before { content:""; position:absolute; top:-2px; left:50%; transform:translateX(-50%); width:4px; height:4px; border-radius:50%; background:var(--lc,#E0489C); box-shadow:0 0 8px 2px var(--lc); }
.bs-laser::after { content:""; position:absolute; bottom:-2px; left:50%; transform:translateX(-50%); width:6px; height:2px; border-radius:50%; background:var(--lc,#E0489C); filter:blur(1px); opacity:.75; }
/* light beams: gentle flicker layered over the sway */
.bs-beam::after { content:""; position:absolute; inset:0; background:var(--c,#6FE000); opacity:0; mix-blend-mode:screen; animation:beamFlick 2.4s ease-in-out infinite; }
@keyframes beamFlick { 0%,100%{ opacity:0;} 45%{ opacity:.12;} 55%{ opacity:.04;} }
@media (prefers-reduced-motion: reduce) { .bs-la::after,.bs-sub,.bs-laser::before,.bs-laser::after,.bs-beam::after { animation:none !important; } }


/* ============================================================
   RIGGING (truss, fixtures), PA SPEAKERS, GUEST + CREW FIGURES
   ============================================================ */
.bs-rig { position:absolute; inset:0; pointer-events:none; z-index:3; }
.bs-truss { position:absolute; top:42%; left:7%; right:7%; height:7px; border-radius:2px;
  background:repeating-linear-gradient(90deg,#3a3a3a 0 3px,#1c1c1c 3px 5px,#3a3a3a 5px 8px); border-top:1px solid rgba(255,255,255,.2); border-bottom:1px solid rgba(0,0,0,.5); box-shadow:0 2px 5px rgba(0,0,0,.5); }
.bs-truss-2 { top:47.5%; left:11%; right:11%; }
.bs-tower { position:absolute; top:42%; bottom:24%; width:7px; border-radius:2px;
  background:repeating-linear-gradient(0deg,#3a3a3a 0 3px,#1c1c1c 3px 5px,#3a3a3a 5px 8px); box-shadow:0 0 5px rgba(0,0,0,.5); }
.bs-tower-l { left:6%; } .bs-tower-r { right:6%; }
.bs-fixture { position:absolute; transform:translateX(-50%); width:8px; height:7px; }
.bs-fixture.on-truss { top:43.5%; }
.bs-fixture.on-floor { bottom:30%; }
.bs-fixture::before { content:""; position:absolute; top:0; left:50%; transform:translateX(-50%); width:5px; height:4px; background:#222; border:1px solid rgba(255,255,255,.18); border-radius:1px; }
.bs-fixture::after { content:""; position:absolute; bottom:-1px; left:50%; width:4px; height:4px; border-radius:50%; background:var(--c,#6FE000); box-shadow:0 0 7px 1px var(--c,#6FE000); transform:translateX(-50%); transform-origin:50% -120%; animation:fixpan 2.4s ease-in-out infinite alternate; }
@keyframes fixpan { from{ transform:translateX(-50%) rotate(-26deg);} to{ transform:translateX(-50%) rotate(26deg);} }
.bs-laserunit { position:absolute; top:43%; left:50%; transform:translateX(-50%); width:9px; height:5px; background:#181818; border:1px solid rgba(224,72,156,.5); border-radius:1px; box-shadow:0 0 6px rgba(224,72,156,.5); }
.bs-laserunit.floor { top:auto; bottom:28%; }

/* PA / speakers */
.bs-pa { position:absolute; z-index:4; }
.bs-pa-stand { bottom:17%; width:15px; height:46px; }
.bs-pa-stand.bs-pa-l { left:4%; } .bs-pa-stand.bs-pa-r { right:4%; }
.bs-pa-stand .bs-pa-box { position:absolute; bottom:24px; left:0; width:15px; height:19px; background:linear-gradient(#2c2c2c,#131313); border:1px solid rgba(255,255,255,.18); border-radius:2px; box-shadow:0 1px 4px rgba(0,0,0,.5); }
.bs-pa-stand .bs-pa-box::after { content:""; position:absolute; left:50%; top:56%; transform:translate(-50%,-50%); width:7px; height:7px; border-radius:50%; background:radial-gradient(circle,#444,#111); box-shadow:0 0 5px rgba(111,224,0,.4); animation:laPulse .5s ease-in-out infinite alternate; }
.bs-pa-stand.big .bs-pa-box { width:18px; height:23px; bottom:22px; }
.bs-pa-stand .bs-pa-pole { position:absolute; bottom:3px; left:50%; transform:translateX(-50%); width:2px; height:24px; background:#333; }
.bs-pa-stand .bs-pa-legs { position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:16px; height:6px; }
.bs-pa-stand .bs-pa-legs::before,.bs-pa-stand .bs-pa-legs::after { content:""; position:absolute; bottom:0; left:50%; width:2px; height:8px; background:#333; transform-origin:bottom; }
.bs-pa-stand .bs-pa-legs::before { transform:rotate(28deg); } .bs-pa-stand .bs-pa-legs::after { transform:rotate(-28deg); }
.bs-pa-flown { top:44%; display:flex; flex-direction:column; align-items:center; }
.bs-pa-flown.bs-pa-l { left:7%; } .bs-pa-flown.bs-pa-r { right:7%; }
.bs-pa-flown .bs-pa-rope { width:1px; height:14px; background:#444; }
.bs-array-box { width:14px; height:6px; background:linear-gradient(#2c2c2c,#121212); border:1px solid rgba(255,255,255,.16); border-radius:2px; margin-top:1px; transform:rotate(calc((var(--i) - 1.5) * 7deg)); box-shadow:0 1px 2px rgba(0,0,0,.4); }
.bs-array-box::after { content:""; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:3px; height:3px; border-radius:50%; background:rgba(111,224,0,.5); }
.bs-substack { position:absolute; bottom:14%; display:flex; gap:2px; z-index:4; }
.bs-substack-l { left:9%; } .bs-substack-r { right:9%; }
.bs-subbox { width:12px; height:12px; background:#161616; border:1px solid rgba(255,255,255,.16); border-radius:2px; animation:subPump .5s ease-in-out infinite alternate; }
.bs-subbox::after { content:""; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:6px; height:6px; border-radius:50%; background:radial-gradient(circle,#3a3a3a,#0c0c0c); }

/* GUEST FIGURES */
.bs-person { width:11px !important; height:20px !important; background:none !important; box-shadow:none !important; border-radius:0 !important; color:var(--pc,#6FE000); }
.bs-person::before, .bs-person::after { display:none !important; content:none !important; }
.pf { width:100%; height:100%; overflow:visible; display:block; filter:drop-shadow(0 1.4px 1px rgba(0,0,0,.5)); }
.pf .pf-head,.pf .pf-body,.pf .pf-arm,.pf .pf-leg { fill:currentColor; }
.pf [class*="pf-"] { transform-box:fill-box; }
.pf .pf-arm-l { transform-origin:50% 0; animation:pArmL .55s ease-in-out infinite alternate; }
.pf .pf-arm-r { transform-origin:50% 0; animation:pArmR .6s ease-in-out infinite alternate; }
@keyframes pArmL { from{ transform:rotate(-10deg);} to{ transform:rotate(12deg);} }
@keyframes pArmR { from{ transform:rotate(10deg);} to{ transform:rotate(-12deg);} }
.pf .pf-up { transform-origin:50% 100%; animation:pWave .45s ease-in-out infinite alternate; }
@keyframes pWave { from{ transform:rotate(-12deg);} to{ transform:rotate(12deg);} }
.pf .pf-leg-l { transform-origin:50% 0; animation:pStepL .55s ease-in-out infinite alternate; }
.pf .pf-leg-r { transform-origin:50% 0; animation:pStepR .55s ease-in-out infinite alternate; }
@keyframes pStepL { from{ transform:rotate(-5deg);} to{ transform:rotate(5deg);} }
@keyframes pStepR { from{ transform:rotate(5deg);} to{ transform:rotate(-5deg);} }

/* CREW FIGURES (photographer / videographer) */
.bs-crew { color:#c7ccd6; }
.bs-crew .cf { width:30px; height:30px; display:block; filter:drop-shadow(0 1px 2px rgba(0,0,0,.55)); }
.cf .cf-head,.cf .cf-body,.cf .cf-leg,.cf .cf-arm { fill:currentColor; }
.cf .cf-cam { fill:#0e0e0e; stroke:rgba(255,255,255,.28); stroke-width:.5; }
.cf .cf-lens { fill:#1a1a1a; stroke:rgba(255,255,255,.28); stroke-width:.5; }
.cf .cf-flashdot { fill:#fff; opacity:0; animation:cfFlash 3.4s ease-out infinite; }
@keyframes cfFlash { 0%,90%{ opacity:0;} 93%{ opacity:1; filter:drop-shadow(0 0 4px #fff);} 100%{ opacity:0;} }
.cf .cf-recdot { fill:#E04848; animation:cfRec 1.2s steps(2) infinite; }
@keyframes cfRec { 0%,100%{ opacity:.3;} 50%{ opacity:1;} }

@media (prefers-reduced-motion: reduce) {
  .bs-fixture::after,.bs-pa-stand .bs-pa-box::after,.bs-subbox,.pf *,.cf .cf-flashdot,.cf .cf-recdot { animation:none !important; }
}

.bs-person.mirror .pf { transform:scaleX(-1); }


/* ── SCENE CLOCK ── */
.scene-clock {
  position: absolute;
  bottom: 42px;
  right: 14px;
  font-family: 'Luxe Uno', monospace;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .06em;
  color: rgba(248,245,238,.65);
  background: rgba(0,0,0,.52);
  padding: 4px 10px;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,.1);
  backdrop-filter: blur(4px);
  z-index: 8;
}
.event-preview .scene-clock { font-size: 9px; bottom: 28px; right: 8px; padding: 3px 7px; }

/* ── BARS PLACED AT SIDES ── */
.bs-bar-scene {
  position: absolute;
  bottom: 7%;
  width: 38px;
  height: 18px;
}

.bs-crowd-extra { position:absolute; left:50%; bottom:4%; transform:translateX(-50%); background:rgba(0,0,0,.6); border:1px solid rgba(255,255,255,.18); border-radius:999px; padding:4px 12px; font-size:12px; font-weight:700; color:rgba(248,245,238,.7); white-space:nowrap; backdrop-filter:blur(4px); }

/* ── MOMENT TIME FIELDS ── */
.tt-field-wrap { display:flex; flex-direction:column; gap:3px; }
.tt-field-lbl { font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.35); padding-left:2px; }
.tt-sel-wrap { position:relative; }
.tt-sel-wrap select { -webkit-appearance:none; appearance:none; padding-right:24px; }
.tt-sel-wrap::after { content:""; position:absolute; right:8px; top:50%; transform:translateY(-50%); width:10px; height:10px; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%236FE000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
  background-size:contain; background-repeat:no-repeat; background-position:center; }
.tt-fields { align-items:flex-end; }

/* ── CATERING MOMENT PLANNER (stap 6) ── */
.catering-planner { background:#0e0e0e; border:1px solid rgba(255,255,255,.08); border-radius:14px; padding:18px 20px; margin-top:4px; margin-bottom:18px; }
.cm-row { display:flex; align-items:flex-end; gap:12px; flex-wrap:wrap; margin-bottom:12px; }
.cm-row:last-child { margin-bottom:0; }
.cm-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; margin-bottom:9px; }
.cm-label { font-size:15px; font-weight:700; color:#F8F5EE; flex-shrink:0; min-width:120px; margin-bottom:8px; }
.cm-field { display:flex; flex-direction:column; gap:3px; }
.cm-sel { min-width:88px; }

@media (prefers-reduced-motion: reduce) {
  .bs-drone, .bs-drone::before, .bs-fw, .bs-fw::after { animation: none !important; }
}

/* ── DRONE SHOW (phase-gated, hovers high above crowd) ── */
.bs-drones { position:absolute; inset:0; pointer-events:none; opacity:0; transition:opacity .8s ease; }
.bs-scene[data-active-drone="1"] .bs-drones { opacity:1; }
.bs-drone {
  position:absolute;
  width:12px; height:12px;
  transform:translateX(-50%);
  z-index:12;
}
.bs-drone::before {
  content:"";
  position:absolute; inset:1px;
  border-radius:50%;
  background:var(--dc,#6FE000);
  box-shadow:0 0 12px 5px var(--dc);
  animation:droneGlow .65s ease-in-out infinite alternate;
}
.bs-drone::after {
  content:"";
  position:absolute; top:50%; left:50%;
  width:22px; height:2.5px;
  transform:translate(-50%,-50%);
  background:rgba(255,255,255,.12);
  border-radius:2px;
}
.bs-scene[data-active-drone="1"] .bs-drone {
  animation:droneFly 2.8s ease-in-out infinite alternate;
}
@keyframes droneFly {
  from { transform:translateX(-50%) translateY(0) rotate(-2deg); }
  to   { transform:translateX(calc(-50% + 6px)) translateY(-7px) rotate(2deg); }
}
@keyframes droneGlow {
  from { opacity:.55; box-shadow:0 0 7px 2px var(--dc); }
  to   { opacity:1;  box-shadow:0 0 16px 6px var(--dc); }
}

/* ── VUURWERK - rocket rises to burst position, explodes high ── */
.bs-fireworks { position:absolute; inset:0; pointer-events:none; opacity:0; transition:opacity .5s ease; }
.bs-scene[data-active-vuurwerk="1"] .bs-fireworks { opacity:1; }
.bs-fw-wrap {
  position:absolute;
  width:8px; height:8px;
  border-radius:50%;
  transform:translateX(-50%);
  /* burst at this position */
  animation: fwBurst var(--fd,2.2s) ease-out infinite;
}
/* Rocket: pseudo-element rises from below to reach the wrap */
.bs-fw-wrap::before {
  content:"";
  position:absolute;
  left:50%; top:0;
  width:3px;
  background:linear-gradient(to top, var(--fc,#FFB23A) 60%, rgba(255,255,255,.9));
  border-radius:2px 2px 0 0;
  transform-origin:50% 100%;
  animation:rocketUp var(--fd,2.2s) ease-in infinite;
}
/* Smoke trail behind rocket */
.bs-fw-wrap::after {
  content:"";
  position:absolute;
  left:50%; top:0;
  width:8px; height:8px;
  transform:translate(-50%,50%);
  border-radius:50%;
  background:radial-gradient(circle, rgba(255,255,255,.6), transparent 70%);
  animation:rocketGlow var(--fd,2.2s) ease-in infinite;
}
@keyframes rocketUp {
  0%   { height:220px; transform:translateX(-50%) translateY(220px); opacity:0; }
  4%   { opacity:1; }
  50%  { height:30px;  transform:translateX(-50%) translateY(5px);   opacity:.7; }
  55%  { height:0;     transform:translateX(-50%) translateY(0);     opacity:0; }
  100% { height:0; opacity:0; }
}
@keyframes rocketGlow {
  0%,4%{ opacity:0; transform:translate(-50%,230px) scale(.5); }
  10%  { opacity:.9; }
  50%  { transform:translate(-50%,10px) scale(1.2); opacity:.6; }
  55%  { opacity:0; }
  100% { opacity:0; }
}
@keyframes fwBurst {
  0%,50%{ background:var(--fc); transform:translateX(-50%) scale(0); opacity:0;
    box-shadow: 0 0 0 0 transparent; }
  57%  { transform:translateX(-50%) scale(1.2); opacity:1;
    box-shadow:
      0 0 6px 3px var(--fc),
      18px 0 0 -1px var(--fc),  -18px 0 0 -1px var(--fc),
      0 -20px 0 -1px var(--fc), 0 20px 0 -1px var(--fc),
      13px -14px 0 -1px var(--fc), -13px -14px 0 -1px var(--fc),
      13px 14px 0 -1px var(--fc), -13px 14px 0 -1px var(--fc),
      22px -8px 0 -2px var(--fc), -22px -8px 0 -2px var(--fc),
      8px -22px 0 -2px var(--fc), -8px -22px 0 -2px var(--fc); }
  100% { transform:translateX(-50%) scale(3.8); opacity:0;
    box-shadow:
      0 0 0 0 transparent,
      36px 0 0 -4px var(--fc),  -36px 0 0 -4px var(--fc),
      0 -40px 0 -4px var(--fc), 0 40px 0 -4px var(--fc),
      26px -28px 0 -4px var(--fc),-26px -28px 0 -4px var(--fc),
      26px 28px 0 -4px var(--fc),-26px 28px 0 -4px var(--fc),
      44px -16px 0 -5px var(--fc),-44px -16px 0 -5px var(--fc),
      16px -44px 0 -5px var(--fc),-16px -44px 0 -5px var(--fc); }
}

/* Outdoor notice */
.opt-card.warn-outdoor { border-color:#FFB23A !important; }
.outdoor-notice { display:block; font-size:11px; font-weight:700; color:#FFB23A; margin-top:4px; }

@media (prefers-reduced-motion: reduce) {
  .bs-drone::before, .bs-fw-rocket, .bs-fw-burst { animation:none !important; }
}

.outdoor-warn { display:block; font-size:11px; font-weight:700; color:#FFB23A; margin-top:5px; }
.opt-card.is-selected .outdoor-warn { color:#FFB23A; }

/* ── CREW QUANTITY STEPPER ── */
.crew-qty { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:12px; padding:12px 16px; background:#0e0e0e; border:1px solid rgba(255,255,255,.08); border-radius:12px; }
.crew-qty-lbl { font-size:14px; font-weight:600; color:#F8F5EE; }
.stepper { display:flex; align-items:center; gap:2px; }
.stepper button { width:34px; height:34px; border-radius:9px; border:1.5px solid rgba(255,255,255,.14); background:#161616; color:#F8F5EE; font-size:18px; font-weight:600; cursor:pointer; display:grid; place-items:center; transition:all 160ms; }
.stepper button:hover { border-color:rgba(111,224,0,.4); color:#6FE000; }
.stepper span { min-width:38px; text-align:center; font-family:'Kardige',sans-serif; font-size:20px; color:#F8F5EE; }

/* ── PRINT QTY INPUT ── */
.qty-input-wrap { display:flex; align-items:center; gap:6px; }
.qty-input-wrap button { width:34px; height:34px; border-radius:9px; border:1.5px solid rgba(255,255,255,.14); background:#161616; color:#F8F5EE; font-size:18px; font-weight:600; cursor:pointer; display:grid; place-items:center; transition:all 160ms; }
.qty-input-wrap button:hover { border-color:rgba(111,224,0,.4); color:#6FE000; }
.qty-input-wrap input { width:80px; height:34px; text-align:center; background:#161616; border:1.5px solid rgba(255,255,255,.14); border-radius:9px; color:#F8F5EE; font-family:'Luxe Uno',sans-serif; font-size:16px; font-weight:600; outline:none; -moz-appearance:textfield; }
.qty-input-wrap input:focus { border-color:#6FE000; }
.qty-input-wrap input::-webkit-outer-spin-button, .qty-input-wrap input::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }

/* ── PRINT PER-GUEST ── */
.print-perguest { display:flex; align-items:flex-start; gap:12px; margin-top:12px; padding:14px 16px; background:#0e0e0e; border:1px solid rgba(255,255,255,.08); border-radius:12px; }
.ppg-config { display:flex; align-items:center; flex-wrap:wrap; gap:8px; font-size:13.5px; color:rgba(248,245,238,.5); }
.print-perguest.is-active .ppg-config { color:#F8F5EE; }
.qty-input-sm button { width:28px; height:28px; font-size:15px; border-radius:7px; }
.qty-input-sm input { width:48px; height:28px; font-size:14px; }
.ppg-config #perGuestCount, .ppg-config #perGuestTotal { color:#6FE000; font-weight:700; }

/* ── moment planner: delete + added state ── */
.cm-del { width:30px; height:30px; border-radius:8px; border:1.5px solid rgba(255,255,255,.14); background:#161616; color:rgba(248,245,238,.5); font-size:16px; cursor:pointer; display:grid; place-items:center; transition:all 160ms; flex-shrink:0; }
.cm-del:hover { border-color:rgba(224,72,72,.5); color:#E04848; }
.tt-moment-btn.is-added { border-style:solid; border-color:rgba(111,224,0,.45); color:#6FE000; background:rgba(111,224,0,.08); }


/* ============================================================
   STAGE v2 - LED wall, DJ deck, wash, riser
   ============================================================ */
.bs-stage { overflow:visible; }
.bs-ledwall { display:none; }
.bs-stage.has-led .bs-ledwall {
  display:flex; gap:2px; align-items:flex-end; justify-content:center;
  position:absolute; left:50%; bottom:46px; transform:translateX(-50%);
  width:128%; height:30px; padding:3px 4px; z-index:0;
  background:linear-gradient(#070707,#0c0c0c); border:1px solid rgba(255,255,255,.1);
  border-radius:3px; box-shadow:0 0 16px rgba(0,0,0,.55), inset 0 0 10px rgba(0,0,0,.6);
}
.bs-ledwall i {
  flex:1; align-self:flex-end; height:45%; border-radius:1px;
  background:linear-gradient(to top, var(--lc,#6FE000), rgba(255,255,255,.6));
  box-shadow:0 0 6px var(--lc,#6FE000); opacity:.85;
  animation:ledEq .85s ease-in-out infinite alternate; animation-delay:var(--d,0s);
}
@keyframes ledEq { 0%{ height:22%; opacity:.55; } 100%{ height:96%; opacity:1; } }

.bs-riser {
  position:absolute; left:50%; bottom:-3px; transform:translateX(-50%);
  width:122%; height:7px; z-index:0; border-radius:2px;
  background:radial-gradient(ellipse at 50% 0, rgba(255,255,255,.14), transparent 72%);
}
.bs-stage-wash {
  position:absolute; left:50%; bottom:-6px; transform:translateX(-50%);
  width:96%; height:54px; z-index:0; pointer-events:none;
  background:radial-gradient(ellipse at 50% 100%, rgba(111,224,0,.20), transparent 70%);
  animation:washPulse 2.6s ease-in-out infinite;
}
@keyframes washPulse { 0%,100%{ opacity:.45; } 50%{ opacity:.9; } }

/* DJ booth + deck */
.bs-booth { background:linear-gradient(#262626,#0d0d0d) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.08); overflow:visible; z-index:2; }
.bs-booth::after {
  content:""; position:absolute; left:9%; right:9%; bottom:5px; height:5px; border-radius:3px;
  background:rgba(111,224,0,.55); box-shadow:0 0 9px rgba(111,224,0,.7);
  animation:boothFacade 1.6s ease-in-out infinite;
}
@keyframes boothFacade { 0%,100%{ opacity:.4; } 50%{ opacity:.95; } }
.bs-deck {
  position:absolute; top:5px; left:50%; transform:translateX(-50%); z-index:3;
  width:80%; height:11px; border-radius:2px;
  background:linear-gradient(#161616,#0a0a0a); border:1px solid rgba(255,255,255,.16);
}
.bs-deck.is-dj::before, .bs-deck.is-dj::after {
  content:""; position:absolute; top:50%; transform:translateY(-50%);
  width:7px; height:7px; border-radius:50%;
  background:radial-gradient(circle at 50% 40%, #3a3a3a, #0a0a0a 70%);
  border:1px solid rgba(255,255,255,.22);
  animation:platterSpin 1.4s linear infinite;
}
.bs-deck.is-dj::before { left:12%; }
.bs-deck.is-dj::after { right:12%; }
@keyframes platterSpin { to { transform:translateY(-50%) rotate(360deg); } }
.bs-deck:not(.is-dj) {
  background:linear-gradient(#1a1a1a,#0c0c0c);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08), 2px 0 0 -1px rgba(111,224,0,.4), -2px 0 0 -1px rgba(58,147,232,.4);
}

/* ============================================================
   BAR v2 - backbar shelf, counter, bartender
   ============================================================ */
.bs-bar2 { position:absolute; transform:translateX(-50%); width:48px; height:30px; }
.bar2-glow {
  position:absolute; left:50%; bottom:-3px; transform:translateX(-50%);
  width:150%; height:22px; border-radius:50%;
  background:radial-gradient(ellipse, rgba(255,205,120,.28), transparent 70%);
}
.bar2-back {
  position:absolute; left:50%; bottom:12px; transform:translateX(-50%);
  width:88%; height:15px; display:flex; gap:3px; align-items:flex-end; justify-content:center;
}
.bar2-back::after {
  content:""; position:absolute; left:-3px; right:-3px; bottom:-2px; height:2px;
  background:rgba(255,210,140,.25); border-radius:1px;
}
.bar2-back i {
  width:5px; height:12px; border-radius:1px 1px 0 0;
  background:linear-gradient(to top, var(--bc,#6FE000), rgba(255,255,255,.55));
  box-shadow:0 0 5px var(--bc,#6FE000); opacity:.92;
  animation:bottleTwinkle 2.4s ease-in-out infinite; animation-delay:calc(var(--bc) * 0);
}
.bar2-back i:nth-child(2){ animation-delay:.5s; }
.bar2-back i:nth-child(3){ animation-delay:1s; }
.bar2-back i:nth-child(4){ animation-delay:1.5s; }
@keyframes bottleTwinkle { 0%,100%{ opacity:.7; } 50%{ opacity:1; filter:brightness(1.3); } }
.bar2-counter {
  position:absolute; left:50%; bottom:0; transform:translateX(-50%);
  width:100%; height:13px; border-radius:3px 3px 2px 2px;
  background:linear-gradient(#3c2c17,#23190d);
  border:1px solid rgba(255,210,120,.32);
  box-shadow:inset 0 1px 0 rgba(255,210,140,.25), 0 2px 5px rgba(0,0,0,.4);
  z-index:2;
}
.bar2-tender {
  position:absolute; left:50%; bottom:10px; transform:translateX(-50%);
  width:7px; height:13px; border-radius:3px 3px 0 0; background:#1a140b; z-index:1;
}
.bar2-tender::before {
  content:""; position:absolute; top:-5px; left:50%; transform:translateX(-50%);
  width:5px; height:5px; border-radius:50%; background:#241a0e;
}
.bs-bar2 .bs-crew-lbl {
  position:absolute; left:50%; bottom:-14px; transform:translateX(-50%);
  white-space:nowrap; z-index:3;
}

@media (prefers-reduced-motion: reduce) {
  .bs-ledwall i, .bs-stage-wash, .bs-booth::after, .bs-deck.is-dj::before, .bs-deck.is-dj::after, .bar2-back i { animation:none !important; }
}


/* ============================================================
   ARTIST FIGURES v2 - no glow, more detail
   ============================================================ */
.actfig { filter:none !important; }
.bs-artist.is-active .actfig { filter:none !important; }
.bs-artist.is-active { box-shadow:none !important; }
.bs-artist { box-shadow:none !important; }
/* two-tone detail: skin head/hands, colored shirt, dark trousers */
.actfig .af-head { fill:#ece3cf; }
.actfig .af-body { fill:currentColor; }
.actfig .af-leg { fill:#16181c; }
.actfig .af-arm { fill:#ece3cf; }
/* little hands at the end of arms */
.actfig .af-hand { fill:#ece3cf; }
/* subtle hair cap on the head for definition */
.actfig .af-hair { fill:#2a2118; opacity:.9; }
/* crisp dark outline instead of glow */
.actfig .af-head, .actfig .af-body { stroke:rgba(0,0,0,.35); stroke-width:.4; }
/* ground shadow under each performer */
.bs-artist::after {
  content:""; position:absolute; left:50%; bottom:-2px; transform:translateX(-50%);
  width:16px; height:4px; border-radius:50%; background:rgba(0,0,0,.45); filter:blur(1px); z-index:-1;
}
/* active performer: a touch brighter + bigger, no glow */
.bs-artist.is-active .actfig { transform:scale(1.06); }

/* ============================================================
   STAGE TRUSS - goalpost frame with hanging light cans
   ============================================================ */
.bs-stagetruss { position:absolute; left:50%; bottom:0; transform:translateX(-50%); width:138%; height:96px; z-index:0; pointer-events:none; }
.st-leg { position:absolute; bottom:0; width:7px; height:92px;
  background:
    repeating-linear-gradient(0deg, #3a3d42 0 4px, #23262b 4px 9px),
    linear-gradient(90deg, #15171a, #43464c 50%, #15171a);
  border-radius:1px; box-shadow:0 0 0 1px rgba(0,0,0,.4);
}
.st-leg::before { content:""; position:absolute; inset:0;
  background:repeating-linear-gradient(58deg, transparent 0 6px, rgba(255,255,255,.07) 6px 7px),
            repeating-linear-gradient(-58deg, transparent 0 6px, rgba(255,255,255,.07) 6px 7px); }
.st-leg-l { left:0; }
.st-leg-r { right:0; }
.st-beam { position:absolute; top:0; left:0; right:0; height:9px;
  background:
    repeating-linear-gradient(90deg, #3a3d42 0 5px, #23262b 5px 11px),
    linear-gradient(0deg, #15171a, #43464c 50%, #15171a);
  border-radius:1px; box-shadow:0 1px 0 rgba(0,0,0,.4);
}
.st-beam::before { content:""; position:absolute; inset:0;
  background:repeating-linear-gradient(32deg, transparent 0 7px, rgba(255,255,255,.08) 7px 8px); }
.st-can { position:absolute; top:7px; width:7px; height:11px; transform:translateX(-50%);
  background:linear-gradient(#2b2e33,#141619); border:1px solid rgba(0,0,0,.5); border-radius:2px 2px 3px 3px; }
.st-can::after { content:""; position:absolute; left:50%; top:100%; transform:translateX(-50%);
  width:0; height:0; border-left:6px solid transparent; border-right:6px solid transparent;
  border-top:26px solid var(--c,#6FE000); opacity:.16; filter:blur(1px);
  animation:canFlick 1.8s ease-in-out infinite alternate; }
@keyframes canFlick { 0%{ opacity:.07; } 100%{ opacity:.26; } }

@media (prefers-reduced-motion: reduce) { .st-can::after { animation:none !important; } }


/* ============================================================
   ROAMING ACT - walks through the crowd
   ============================================================ */
.bs-roamer {
  position:absolute; bottom:8%; left:0; width:24px; height:30px;
  z-index:55; pointer-events:none; opacity:0;
  transform:translateX(-50%);
}
.bs-roamer.is-active { opacity:1; animation:roamWalk var(--rd,7s) ease-in-out infinite alternate; }
.bs-roamer .actfig { width:100%; height:100%; }
/* face walking direction; flip on the return leg */
@keyframes roamWalk {
  0%   { left:18%; transform:translateX(-50%) scaleX(1); }
  48%  { left:82%; transform:translateX(-50%) scaleX(1); }
  50%  { left:82%; transform:translateX(-50%) scaleX(-1); }
  98%  { left:18%; transform:translateX(-50%) scaleX(-1); }
  100% { left:18%; transform:translateX(-50%) scaleX(1); }
}
/* legs stride while roaming */
.bs-roamer .af-leg-l { transform-origin:50% 0; animation:roamStepL .42s ease-in-out infinite alternate; }
.bs-roamer .af-leg-r { transform-origin:50% 0; animation:roamStepR .42s ease-in-out infinite alternate; }
@keyframes roamStepL { from{ transform:rotate(-22deg);} to{ transform:rotate(20deg);} }
@keyframes roamStepR { from{ transform:rotate(20deg);} to{ transform:rotate(-22deg);} }
.bs-roamer::after { content:""; position:absolute; left:50%; bottom:-2px; transform:translateX(-50%); width:15px; height:4px; border-radius:50%; background:rgba(0,0,0,.4); filter:blur(1px); }

/* ── ROAM TOGGLE BUTTON (timetable) ── */
.tt-roam-btn {
  flex-shrink:0; padding:0 12px; height:34px; border-radius:9px;
  border:1.5px solid rgba(255,255,255,.16); background:#161616;
  font-family:'Luxe Uno',sans-serif; font-size:12px; font-weight:600;
  color:rgba(248,245,238,.6); cursor:pointer; transition:all 160ms; white-space:nowrap;
}
.tt-roam-btn:hover { border-color:rgba(111,224,0,.4); color:#6FE000; }
.tt-roam-btn.is-on { border-color:#6FE000; background:rgba(111,224,0,.1); color:#6FE000; }
.tt-roam-stage { border-style:dashed; }
.tt-bar-roam { background-image:repeating-linear-gradient(45deg, rgba(255,255,255,.18) 0 4px, transparent 4px 9px); }

@media (prefers-reduced-motion: reduce) { .bs-roamer.is-active { animation:none !important; left:50%; } .bs-roamer .af-leg-l, .bs-roamer .af-leg-r { animation:none !important; } }

/* ── ROAM PILL (compact, in artist info) ── */
.tt-info { position:relative; }
.tt-roam-pill {
  display:inline-flex; align-items:center; gap:5px; margin-top:6px;
  padding:4px 10px; border-radius:999px;
  border:1.5px solid rgba(255,255,255,.16); background:#161616;
  font-family:'Luxe Uno',sans-serif; font-size:11px; font-weight:600;
  color:rgba(248,245,238,.55); cursor:pointer; transition:all 150ms; white-space:nowrap;
  align-self:flex-start;
}
.tt-roam-pill:hover { border-color:rgba(111,224,0,.4); color:#6FE000; }
.tt-roam-pill.is-on { border-color:#6FE000; background:rgba(111,224,0,.12); color:#6FE000; }
.tt-roam-pill svg { flex-shrink:0; }

/* ── ROAMING WALK v2 - casual stroll, not a sprint ── */
@keyframes roamWalk {
  0%   { left:22%; transform:translateX(-50%) scaleX(1); }
  6%   { left:22%; transform:translateX(-50%) scaleX(1); }   /* pause / mingle */
  44%  { left:78%; transform:translateX(-50%) scaleX(1); }
  50%  { left:78%; transform:translateX(-50%) scaleX(-1); }
  56%  { left:78%; transform:translateX(-50%) scaleX(-1); }  /* pause / mingle */
  94%  { left:22%; transform:translateX(-50%) scaleX(-1); }
  100% { left:22%; transform:translateX(-50%) scaleX(1); }
}
/* gentle, slower steps - a relaxed walking pace */
.bs-roamer .af-leg-l { transform-origin:50% 0; animation:roamStepL .78s ease-in-out infinite alternate !important; }
.bs-roamer .af-leg-r { transform-origin:50% 0; animation:roamStepR .78s ease-in-out infinite alternate !important; }
@keyframes roamStepL { from{ transform:rotate(-11deg);} to{ transform:rotate(11deg);} }
@keyframes roamStepR { from{ transform:rotate(11deg);} to{ transform:rotate(-11deg);} }
/* soft body bob in time with the steps */
.bs-roamer.is-active .actfig { animation:roamBob .78s ease-in-out infinite alternate; }
@keyframes roamBob { from{ transform:translateY(0);} to{ transform:translateY(-1.2px);} }
@media (prefers-reduced-motion: reduce) { .bs-roamer.is-active .actfig { animation:none !important; } }


/* ============================================================
   STAGE v3 - moving heads, PA, subs, haze, screen content
   ============================================================ */
/* moving-head fixture with sweeping beam */
.st-can.st-mh { background:linear-gradient(#33373d,#16181b); }
.st-mh .st-beam-ray {
  position:absolute; top:100%; left:50%; transform-origin:top center;
  width:9px; height:42px; transform:translateX(-50%) rotate(0deg);
  background:linear-gradient(to bottom, var(--c,#6FE000), transparent 88%);
  filter:blur(1.5px); opacity:.5; border-radius:0 0 40% 40%;
  animation:mhSweep 4.2s ease-in-out infinite alternate;
}
@keyframes mhSweep {
  0%   { transform:translateX(-50%) rotate(-32deg); opacity:.25; }
  50%  { opacity:.6; }
  100% { transform:translateX(-50%) rotate(32deg); opacity:.25; }
}
.st-can:not(.st-mh) .st-beam-ray { display:none; }

/* PA line-array hanging at truss corners */
.st-pa { position:absolute; top:9px; width:9px; height:34px; border-radius:2px;
  background:repeating-linear-gradient(0deg,#26282c 0 5px,#15171a 5px 7px);
  border:1px solid rgba(0,0,0,.5); box-shadow:0 0 0 1px rgba(255,255,255,.05);
  transform:perspective(40px) rotateX(8deg); }
.st-pa-l { left:-11px; transform:perspective(40px) rotateX(8deg) rotateZ(6deg); }
.st-pa-r { right:-11px; transform:perspective(40px) rotateX(8deg) rotateZ(-6deg); }

.st-beam-bot { position:absolute; bottom:0; left:0; right:0; height:5px;
  background:repeating-linear-gradient(90deg,#3a3d42 0 5px,#23262b 5px 11px);
  border-radius:1px; opacity:.6; }

/* sub-bass stacks beside the riser */
.bs-substack { position:absolute; bottom:calc(2px + var(--i,0)*13px); width:17px; height:12px;
  background:linear-gradient(#202225,#0c0d0f); border:1px solid rgba(255,255,255,.12);
  border-radius:2px; z-index:1; }
.bs-substack::after { content:""; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:7px; height:7px; border-radius:50%;
  background:radial-gradient(circle at 50% 40%, #2c2c2c, #050505 72%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12); }
.bs-sub-l { left:-20px; }
.bs-sub-r { right:-20px; }

/* riser front edge with safety stripes */
.bs-riser-edge { position:absolute; left:0; right:0; bottom:0; height:3px;
  background:repeating-linear-gradient(45deg,#d9b21a 0 5px,#1a1a1a 5px 10px); opacity:.5; }

/* LED wall scan-line content */
.bs-led-scan { position:absolute; inset:3px 4px; pointer-events:none; border-radius:2px;
  background:linear-gradient(120deg, transparent 0%, rgba(255,255,255,.16) 48%, transparent 60%);
  background-size:220% 100%; mix-blend-mode:screen;
  animation:ledScan 3.4s linear infinite; }
@keyframes ledScan { from{ background-position:130% 0; } to{ background-position:-130% 0; } }

/* booth screen glow */
.bs-booth-screen { position:absolute; top:5px; left:50%; transform:translateX(-50%);
  width:70%; height:9px; border-radius:2px;
  background:linear-gradient(90deg, rgba(58,147,232,.55), rgba(111,224,0,.55), rgba(224,72,156,.55));
  background-size:200% 100%; filter:blur(.5px); opacity:.7;
  animation:boothScreen 5s linear infinite; }
@keyframes boothScreen { from{ background-position:0 0; } to{ background-position:200% 0; } }
.bs-deck { z-index:2; }

/* stage haze drifting up from the deck */
.bs-haze { position:absolute; left:50%; bottom:0; transform:translateX(-50%);
  width:150%; height:60px; z-index:0; pointer-events:none;
  background:radial-gradient(ellipse at 50% 100%, rgba(180,210,255,.10), transparent 72%);
  animation:hazeDrift 6s ease-in-out infinite alternate; }
@keyframes hazeDrift { from{ opacity:.4; transform:translateX(-52%);} to{ opacity:.8; transform:translateX(-48%);} }

@media (prefers-reduced-motion: reduce) {
  .st-mh .st-beam-ray, .bs-led-scan, .bs-booth-screen, .bs-haze { animation:none !important; }
}


/* ============================================================
   STAGE v4 - backdrop screen, skirt, wedges, floor uplights
   ============================================================ */
/* large backdrop video screen behind the LED bar */
.bs-backdrop-screen { position:absolute; left:50%; bottom:50px; transform:translateX(-50%);
  width:150%; height:40px; z-index:-1; border-radius:3px; overflow:hidden;
  background:linear-gradient(#0a0c10,#05060a); border:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 0 18px rgba(0,0,0,.7), 0 0 22px rgba(0,0,0,.5); }
.bs-backdrop-screen .bs-screen-bars { position:absolute; inset:4px 5px; display:flex; gap:3px; align-items:flex-end; opacity:.5; }
.bs-backdrop-screen .bs-screen-bars i { flex:1; align-self:flex-end; border-radius:1px;
  background:linear-gradient(to top,var(--lc,#6FE000),transparent); box-shadow:0 0 5px var(--lc,#6FE000);
  animation:ledEq 1s ease-in-out infinite alternate; animation-delay:var(--d,0s); }
.bs-stage:not(.has-led) .bs-backdrop-screen { display:none; }

/* stage skirt (black drape under the deck) */
.bs-riser-skirt { position:absolute; left:-1%; right:-1%; top:100%; height:18px;
  background:repeating-linear-gradient(90deg, #0a0a0a 0 4px, #111 4px 8px);
  border-top:1px solid rgba(255,255,255,.06); opacity:.92; }

/* monitor wedges (floor speakers) angled up toward performer */
.bs-wedge { position:absolute; bottom:1px; width:13px; height:7px; z-index:3;
  background:linear-gradient(#222,#0c0c0c); border:1px solid rgba(255,255,255,.12);
  clip-path:polygon(0 100%, 100% 100%, 100% 30%, 0 0); }
.bs-wedge::after { content:""; position:absolute; left:22%; top:30%; width:5px; height:4px; border-radius:50%;
  background:radial-gradient(circle,#2c2c2c,#070707 70%); box-shadow:inset 0 0 0 1px rgba(255,255,255,.14); }
.bs-wedge-l { left:24%; transform:scaleX(-1); }
.bs-wedge-r { right:24%; }

/* floor uplights washing up the backdrop */
.bs-uplights { position:absolute; left:0; right:0; bottom:2px; height:0; z-index:0; }
.bs-uplight { position:absolute; bottom:0; width:6px; height:5px; transform:translateX(-50%);
  border-radius:2px 2px 1px 1px; background:var(--c,#6FE000); box-shadow:0 0 6px var(--c,#6FE000); }
.bs-uplight::after { content:""; position:absolute; left:50%; bottom:100%; transform:translateX(-50%);
  width:0; height:0; border-left:7px solid transparent; border-right:7px solid transparent;
  border-bottom:40px solid var(--c,#6FE000); opacity:.12; filter:blur(2px);
  animation:upFlick 2.6s ease-in-out infinite alternate; animation-delay:inherit; }
@keyframes upFlick { 0%{ opacity:.06; } 100%{ opacity:.2; } }

@media (prefers-reduced-motion: reduce) {
  .bs-backdrop-screen .bs-screen-bars i, .bs-uplight::after { animation:none !important; }
}


/* ============================================================
   STAGE v5 - volumetric beams, spotlight towers, cabling, laptop
   ============================================================ */
/* volumetric atmospheric beams sweeping through haze */
.bs-volbeams { position:absolute; left:0; right:0; bottom:46px; height:60px; z-index:0; pointer-events:none; }
.bs-volbeam { position:absolute; bottom:0; width:16px; height:58px; transform-origin:bottom center;
  background:linear-gradient(to top, var(--c,#6FE000), transparent 90%);
  filter:blur(3px); opacity:.22; mix-blend-mode:screen; border-radius:50% 50% 0 0;
  animation:volSweep 5s ease-in-out infinite alternate; animation-delay:inherit; }
@keyframes volSweep {
  0%   { transform:rotate(calc(var(--sw,1) * -26deg)) scaleY(.92); opacity:.12; }
  50%  { opacity:.32; }
  100% { transform:rotate(calc(var(--sw,1) * 26deg)) scaleY(1.04); opacity:.12; }
}

/* spotlight / delay towers beside the stage */
.bs-tower { position:absolute; bottom:0; width:9px; height:96px; z-index:0;
  background:repeating-linear-gradient(0deg,#34373c 0 5px,#1d2024 5px 10px);
  border:1px solid rgba(0,0,0,.5); border-radius:2px; }
.bs-tower::before { content:""; position:absolute; inset:0;
  background:repeating-linear-gradient(56deg,transparent 0 6px,rgba(255,255,255,.06) 6px 7px),
            repeating-linear-gradient(-56deg,transparent 0 6px,rgba(255,255,255,.06) 6px 7px); }
.bs-tower::after { content:""; position:absolute; top:6px; left:50%; transform:translateX(-50%);
  width:13px; height:10px; background:linear-gradient(#2b2e33,#141619); border:1px solid rgba(0,0,0,.5);
  border-radius:2px; box-shadow:0 0 8px rgba(255,255,255,.08); }
.bs-tower-l { left:-26px; }
.bs-tower-r { right:-26px; }

/* power/signal cables draped along the deck top */
.bs-cable { position:absolute; top:2px; height:5px; border-bottom:1.5px solid rgba(0,0,0,.5);
  border-radius:0 0 50% 50%; opacity:.55; }
.bs-cable-1 { left:8%; right:30%; }
.bs-cable-2 { left:34%; right:6%; top:4px; border-color:rgba(0,0,0,.4); }

/* DJ laptop glow on the booth */
.bs-booth-laptop { position:absolute; top:-3px; left:50%; transform:translateX(-50%);
  width:14px; height:9px; background:linear-gradient(#1b1d20,#0a0b0d); border:1px solid rgba(255,255,255,.18);
  border-radius:2px 2px 0 0; z-index:4; }
.bs-booth-laptop::after { content:""; position:absolute; inset:1px 1px 2px; border-radius:1px;
  background:linear-gradient(120deg, rgba(111,224,0,.7), rgba(58,147,232,.7));
  background-size:180% 100%; animation:boothScreen 4s linear infinite; }
.bs-deck:not(.is-dj) ~ .bs-booth-laptop { display:none; }

@media (prefers-reduced-motion: reduce) {
  .bs-volbeam, .bs-booth-laptop::after { animation:none !important; }
}


/* ============================================================
   STAGE v6 - extra props (mic, setlist, stagehand, cannons, tape)
   ============================================================ */
.bs-screen-pixels { position:absolute; inset:4px 5px; border-radius:2px; opacity:.18; mix-blend-mode:overlay;
  background-image:radial-gradient(rgba(255,255,255,.7) 0.5px, transparent 0.6px); background-size:4px 4px; }
.bs-riser-tape { position:absolute; left:0; right:0; bottom:-2px; height:2px;
  background:repeating-linear-gradient(90deg, rgba(111,224,0,.5) 0 7px, transparent 7px 14px); opacity:.45; }
.bs-setlist { position:absolute; bottom:1px; left:20%; width:5px; height:6px; background:#e8e2d2; opacity:.55; border-radius:1px; transform:rotate(-8deg); }
.bs-booth-mic { position:absolute; top:-9px; left:34%; width:1.5px; height:11px; background:#1a1a1a; z-index:5; }
.bs-booth-mic::after { content:""; position:absolute; top:-3px; left:50%; transform:translateX(-50%); width:4px; height:5px; border-radius:50%; background:radial-gradient(circle,#444,#0a0a0a 70%); }
.bs-stagehand { position:absolute; bottom:0; left:8%; width:7px; height:15px; border-radius:3px 3px 1px 1px; background:#14161a; z-index:3; opacity:.85; }
.bs-stagehand::before { content:""; position:absolute; top:-5px; left:50%; transform:translateX(-50%); width:5px; height:5px; border-radius:50%; background:#ece3cf; }
.bs-confetti-cannon { position:absolute; bottom:42%; width:8px; height:5px; background:linear-gradient(#2a2d31,#15171a); border:1px solid rgba(0,0,0,.5); border-radius:2px; z-index:2; }
.bs-cc-l { left:-2%; transform:rotate(28deg); }
.bs-cc-r { right:-2%; transform:rotate(-28deg); }
.bs-stage:not(.has-led) .bs-confetti-cannon, .bs-stage:not(.has-led) .bs-screen-pixels, .bs-stage:not(.has-led) .bs-booth-mic { display:none; }

/* ============================================================
   STAGE 3D - perspective floor + extruded platform
   ============================================================ */
.bs-stage {
  transform-style:preserve-3d;
  perspective:680px;
  perspective-origin:50% 36%;
}
/* gentle backward tilt so the stage floor recedes into depth */
.bs-stage > .bs-stage-top,
.bs-stage > .bs-riser,
.bs-stage > .bs-uplights,
.bs-stage > .bs-booth,
.bs-stage > .bs-backdrop-screen,
.bs-stage > .bs-ledwall {
  will-change:transform;
}
/* riser becomes a real 3D platform: top face tilts away, front face stays vertical */
.bs-riser { transform-style:preserve-3d; }
.bs-riser-face {
  position:absolute; left:-6%; right:-6%; bottom:0; height:20px;
  background:linear-gradient(#1a1c20,#0c0d10);
  transform:rotateX(60deg); transform-origin:bottom center;
  border:1px solid rgba(255,255,255,.06);
  box-shadow:inset 0 0 22px rgba(0,0,0,.55);
}
/* subtle plank/grid texture on the deck top */
.bs-riser-face::after { content:""; position:absolute; inset:0;
  background:
    repeating-linear-gradient(90deg, rgba(255,255,255,.05) 0 1px, transparent 1px 14px),
    repeating-linear-gradient(0deg, rgba(0,0,0,.25) 0 1px, transparent 1px 9px);
  opacity:.6; }
/* LED wall + backdrop stand upright behind the deck (push back in Z) */
.bs-stage.has-led .bs-ledwall { transform:translateX(-50%) translateZ(-26px) rotateX(-4deg); }
.bs-stage.has-led .bs-backdrop-screen { transform:translateX(-50%) translateZ(-40px) rotateX(-3deg); }
/* booth gains a 3D faceplate */
.bs-booth { transform-style:preserve-3d; }
.bs-booth::before {
  content:""; position:absolute; left:0; right:0; bottom:-5px; height:7px;
  background:linear-gradient(#141414,#070707);
  transform:rotateX(58deg); transform-origin:bottom center; opacity:.8;
}
/* subs angle slightly in 3D toward the floor */
.bs-sub-l { transform:rotateY(22deg); }
.bs-sub-r { transform:rotateY(-22deg); }
/* monitor wedges sit on the tilted floor */
.bs-wedge-l { transform:scaleX(-1) rotateX(20deg); }
.bs-wedge-r { transform:rotateX(20deg); }

@media (prefers-reduced-motion: reduce) { }


/* ============================================================
   STAGE FINAL - clarity pass + solid 3D deck + planted performers
   (authoritative: appended last so it wins the cascade)
   ============================================================ */
/* tone down the murk so the stage reads clearly */
.bs-haze { opacity:.4 !important; height:42px !important; background:radial-gradient(ellipse at 50% 100%, rgba(180,210,255,.07), transparent 70%) !important; }
.bs-stage-wash { height:40px !important; background:radial-gradient(ellipse at 50% 100%, rgba(111,224,0,.16), transparent 72%) !important; }

/* backdrop screen reads as a lit LED video wall, not a black void */
.bs-backdrop-screen { background:linear-gradient(#10141c,#0a0e16) !important;
  box-shadow:inset 0 0 22px rgba(0,0,0,.5), 0 0 16px rgba(60,90,140,.18) !important; }
.bs-backdrop-screen .bs-screen-bars { opacity:.7 !important; }

/* SOLID 3D STAGE DECK - a real platform the performers stand on */
.bs-deckplatform {
  position:absolute; left:50%; bottom:30px; transform:translateX(-50%);
  width:128%; height:30px; z-index:1; transform-style:preserve-3d;
}
.bs-deckplatform .dp-top {
  position:absolute; left:0; right:0; bottom:8px; height:30px;
  background:
    repeating-linear-gradient(90deg, rgba(255,255,255,.05) 0 1px, transparent 1px 15px),
    linear-gradient(#2a2d33, #191b20);
  transform:rotateX(62deg); transform-origin:bottom center;
  border:1px solid rgba(255,255,255,.10);
  box-shadow:inset 0 0 26px rgba(0,0,0,.45);
}
.bs-deckplatform .dp-front {
  position:absolute; left:0; right:0; bottom:0; height:9px;
  background:linear-gradient(#16181c,#0a0b0d);
  border-top:1px solid rgba(255,255,255,.12);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.bs-deckplatform .dp-front::after {
  content:""; position:absolute; left:0; right:0; bottom:0; height:2px;
  background:repeating-linear-gradient(90deg, #d9b21a 0 6px, #14140a 6px 12px); opacity:.45;
}

/* plant performers ON the deck with a firm contact shadow (kill the float) */
.bs-artist { bottom:44px !important; z-index:4 !important; }
.bs-artist .actfig { filter:drop-shadow(0 1px 1px rgba(0,0,0,.5)) !important; }
.bs-artist::after {
  content:"" !important; position:absolute !important; left:50% !important; bottom:-3px !important;
  transform:translateX(-50%) scaleX(1.1) !important;
  width:15px !important; height:5px !important; border-radius:50% !important;
  background:radial-gradient(ellipse, rgba(0,0,0,.6), transparent 72%) !important; filter:blur(1px) !important; z-index:-1 !important;
}
.bs-art-live { bottom:44px !important; }

/* booth sits in front of the deck, clearly solid */
.bs-booth { z-index:5 !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.10), 0 3px 8px rgba(0,0,0,.5) !important; }

@media (prefers-reduced-motion: reduce) { }


/* ── STAGE: single clean deck (remove duplicate riser deck) ── */
.bs-riser, .bs-riser-face, .bs-riser-skirt, .bs-riser-edge, .bs-riser-tape { display:none !important; }
/* one clear deck platform, brighter top so it reads as a stage floor */
.bs-deckplatform { bottom:28px !important; }
.bs-deckplatform .dp-top {
  background:
    repeating-linear-gradient(90deg, rgba(255,255,255,.06) 0 1px, transparent 1px 16px),
    linear-gradient(#34373e, #1f2228) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  box-shadow:inset 0 0 24px rgba(0,0,0,.4), 0 -1px 0 rgba(255,255,255,.06) !important;
}
.bs-deckplatform .dp-front { height:10px !important; background:linear-gradient(#1b1e22,#0c0d10) !important; }


/* ============================================================
   SCENE OVERHAUL - 30-point pass
   ============================================================ */
/* stop the pop-animation overriding per-stage inline scale */
.bs-stage { animation:none !important; }
.bs-stage-sub { opacity:.96; }

/* per-stage 'live now' marker */
.bs-stage.is-live::after {
  content:"LIVE"; position:absolute; top:-14px; left:50%; transform:translateX(-50%);
  font-size:8px; font-weight:800; letter-spacing:.12em; color:#0a0a0a;
  background:var(--stagecol,#6FE000); padding:2px 7px; border-radius:999px; z-index:9;
  box-shadow:0 0 12px var(--stagecol,#6FE000); animation:livePulse 1.1s ease-in-out infinite;
}
@keyframes livePulse { 0%,100%{ opacity:.75; } 50%{ opacity:1; } }
.bs-stage:not(.is-live) { filter:saturate(.7) brightness(.82); transition:filter .5s; }
.bs-stage.is-live { filter:none; }

/* clearer stage label: chip under the deck, never over the crowd */
.bs-stage-label {
  bottom:-30px !important; font-size:9px !important; font-weight:700 !important;
  color:rgba(248,245,238,.78) !important; background:rgba(0,0,0,.55);
  padding:2px 8px; border-radius:999px; backdrop-filter:blur(3px);
  white-space:nowrap; z-index:8;
}

/* ── OUTDOOR SKY ── */
.bs-outsky { position:absolute; left:0; right:0; top:0; height:62%; z-index:-3; overflow:hidden;
  background:linear-gradient(to bottom, #0a1226 0%, #0d1a30 40%, #12243d 70%, transparent 100%); }
.bs-stars { position:absolute; inset:0; }
.bs-stars i { position:absolute; width:2px; height:2px; border-radius:50%; background:#fff; opacity:.8;
  box-shadow:0 0 3px #fff; animation:twinkle 3s ease-in-out infinite alternate; }
@keyframes twinkle { from{ opacity:.25; } to{ opacity:.9; } }
.bs-moon { position:absolute; top:10%; right:12%; width:26px; height:26px; border-radius:50%;
  background:radial-gradient(circle at 38% 35%, #fdfbe9, #cfd4c0 70%, #aeb59c);
  box-shadow:0 0 26px rgba(255,250,220,.4); }
.bs-skyline-far { position:absolute; left:0; right:0; bottom:0; height:26%; opacity:.5;
  background:repeating-linear-gradient(90deg, transparent 0 16px, #0a1018 16px 30px, transparent 30px 40px, #0c121c 40px 70px); }
.bs-horizon-glow { position:absolute; left:0; right:0; bottom:0; height:30%;
  background:linear-gradient(to top, rgba(111,224,0,.10), transparent); }

/* ── TIMELINE clarity ── */
.scene-tl { height:18px !important; background:rgba(0,0,0,.62) !important; }
.scene-ph { width:3px !important; box-shadow:0 0 12px #fff, 0 0 4px #fff !important; }
.scene-ph::after { width:9px !important; height:9px !important; }
.scene-clock { font-size:14px !important; bottom:auto !important; top:8px !important; right:12px !important;
  background:rgba(0,0,0,.62) !important; padding:4px 11px !important; z-index:12 !important; }

/* ── BAR labels: compact, above bar, no clash with stage labels ── */
.bs-bar2 .bs-crew-lbl { bottom:-13px !important; font-size:8px !important; padding:1px 6px !important;
  background:rgba(0,0,0,.5); border-radius:999px; }

@media (prefers-reduced-motion: reduce) { .bs-stars i, .bs-stage.is-live::after { animation:none !important; } }


/* ── PERF: cheaper crowd paint at high guest counts ── */
.bs-person { box-shadow:none !important; }
.bs-person .pfig, .bs-person svg { filter:none !important; }
.bs-person, .bs-person * { will-change:auto; }
/* keep transform animations (GPU) but drop costly shadow/filter repaint on the crowd */

/* ── roam pill: compact, never stretch full width ── */
.tt-roam-pill { align-self:flex-start !important; width:auto !important; max-width:max-content !important;
  padding:3px 9px !important; font-size:10px !important; gap:4px !important; margin-top:5px !important; }
.tt-roam-pill svg { width:10px !important; height:10px !important; }

/* ── timetable: keep selects compact + track aligned with axis ── */
.tt-fields { flex-shrink:0; }
.tt-fields .tt-sel { width:auto; min-width:58px; max-width:96px; }
.tt-fields .tt-stage-sel { max-width:108px; }
.tt-info { width:130px !important; flex-shrink:0; }

/* ── roaming: calmer walking pace (was too fast) ── */
.bs-roamer .af-leg-l { animation:roamStepL 1.15s ease-in-out infinite alternate !important; }
.bs-roamer .af-leg-r { animation:roamStepR 1.15s ease-in-out infinite alternate !important; }
.bs-roamer.is-active .actfig { animation:roamBob 1.15s ease-in-out infinite alternate !important; }

/* ── roaming: even calmer pace + clear artist marker ── */
.bs-roamer .af-leg-l { animation:roamStepL 1.6s ease-in-out infinite alternate !important; }
.bs-roamer .af-leg-r { animation:roamStepR 1.6s ease-in-out infinite alternate !important; }
.bs-roamer.is-active .actfig { animation:roamBob 1.6s ease-in-out infinite alternate !important; }
/* name tag above a roaming artist so it's clearly a performer */
.bs-roamer-tag { position:absolute; bottom:108%; left:50%; transform:translateX(-50%);
  font-size:7px; font-weight:800; letter-spacing:.02em; color:#08120a; padding:1px 5px;
  border-radius:999px; white-space:nowrap; box-shadow:0 0 6px rgba(0,0,0,.5); }
.bs-roamer-tag::after { content:""; position:absolute; top:100%; left:50%; transform:translateX(-50%);
  border:3px solid transparent; border-top-color:inherit; }
/* spotlight pool following the performer */
.bs-roamer-spot { position:absolute; bottom:-3px; left:50%; transform:translateX(-50%);
  width:22px; height:7px; border-radius:50%; background:radial-gradient(ellipse, var(--ac,#6FE000), transparent 70%);
  opacity:.5; }

/* ── timetable alignment: fixed left column so bars line up with the axis ── */
.tt-row { gap:14px !important; }
.tt-axis { gap:0 !important; }
.tt-info { width:118px !important; flex-shrink:0 !important; }
.tt-fields { width:186px !important; flex-shrink:0 !important; justify-content:flex-start !important; gap:6px !important; align-items:center !important; }
.tt-fields .tt-sel { flex:1 1 0 !important; min-width:0 !important; max-width:none !important; }
.tt-fields .tt-stage-sel { flex:1.3 1 0 !important; }
.tt-axis-spacer { width:332px !important; }  /* 118 + 14 + 186 + 14 */

/* ── roaming: distributed lanes + zig-zag weave through the crowd ── */
.bs-roamer { bottom:var(--rb,8%) !important; }
.bs-roamer.is-active { animation:roamWeave var(--rd,28s) ease-in-out infinite alternate !important; }
@keyframes roamWeave {
  0%   { left:var(--rx1,20%); transform:translateX(-50%) translateY(0) scaleX(1); }
  6%   { left:var(--rx1,20%); transform:translateX(-50%) translateY(0) scaleX(1); }
  20%  { transform:translateX(-50%) translateY(-7px) scaleX(1); }
  35%  { transform:translateX(-50%) translateY(5px) scaleX(1); }
  46%  { left:var(--rx2,78%); transform:translateX(-50%) translateY(-6px) scaleX(1); }
  50%  { left:var(--rx2,78%); transform:translateX(-50%) translateY(0) scaleX(-1); }
  56%  { left:var(--rx2,78%); transform:translateX(-50%) translateY(0) scaleX(-1); }
  70%  { transform:translateX(-50%) translateY(6px) scaleX(-1); }
  84%  { transform:translateX(-50%) translateY(-5px) scaleX(-1); }
  96%  { left:var(--rx1,20%); transform:translateX(-50%) translateY(4px) scaleX(-1); }
  100% { left:var(--rx1,20%); transform:translateX(-50%) translateY(0) scaleX(1); }
}
@media (prefers-reduced-motion: reduce){ .bs-roamer.is-active { animation:none !important; left:50% !important; } }

/* ── drones: sweep further left-right as a group ── */
.bs-drone { animation:droneSweep var(--dsd,7s) ease-in-out infinite alternate !important; }
@keyframes droneSweep {
  0%   { transform:translateX(-26px) translateY(0); }
  50%  { transform:translateX(0) translateY(-5px); }
  100% { transform:translateX(26px) translateY(0); }
}

/* ── MOMENT FX (champagne / speech / cake) gated by playback ── */
.bs-fx { position:absolute; inset:0; pointer-events:none; opacity:0; transition:opacity .5s ease; z-index:14; }
.bs-scene[data-fx-champagne="1"] .bs-fx-champagne,
.bs-scene[data-fx-speech="1"] .bs-fx-speech,
.bs-scene[data-fx-cake="1"] .bs-fx-cake { opacity:1; }
.fxc-label { position:absolute; top:32%; left:50%; transform:translateX(-50%);
  font-size:13px; font-weight:800; letter-spacing:.02em; color:#fff;
  background:rgba(0,0,0,.55); padding:5px 13px; border-radius:999px; backdrop-filter:blur(3px); white-space:nowrap; }
/* champagne: rising golden bubbles */
.bs-fx-champagne i { position:absolute; bottom:18%; width:6px; height:6px; border-radius:50%;
  background:radial-gradient(circle at 40% 35%, #fff, #FFD23A 70%); box-shadow:0 0 6px #FFD23A;
  animation:champRise 2.4s ease-in infinite; }
.bs-fx-champagne i:nth-child(2){ left:18%; animation-delay:.2s; }
.bs-fx-champagne i:nth-child(3){ left:30%; animation-delay:.9s; }
.bs-fx-champagne i:nth-child(4){ left:44%; animation-delay:.4s; }
.bs-fx-champagne i:nth-child(5){ left:56%; animation-delay:1.2s; }
.bs-fx-champagne i:nth-child(6){ left:68%; animation-delay:.7s; }
.bs-fx-champagne i:nth-child(7){ left:80%; animation-delay:1.5s; }
.bs-fx-champagne i:nth-child(8){ left:88%; animation-delay:.3s; }
.bs-fx-champagne i:nth-child(9){ left:10%; animation-delay:1.0s; }
@keyframes champRise { 0%{ transform:translateY(0) scale(.6); opacity:0; } 20%{ opacity:1; } 100%{ transform:translateY(-90px) scale(1); opacity:0; } }
/* speech: a moving spotlight cone center-stage */
.fxs-spot { position:absolute; bottom:24%; left:50%; transform:translateX(-50%);
  width:0; height:0; border-left:40px solid transparent; border-right:40px solid transparent;
  border-top:120px solid rgba(255,245,200,.16); filter:blur(3px);
  transform-origin:bottom center; animation:speechSpot 3.5s ease-in-out infinite alternate; }
@keyframes speechSpot { from{ transform:translateX(-50%) rotate(-8deg); } to{ transform:translateX(-50%) rotate(8deg); } }
/* cake: a glowing cake with candle flicker, centre dancefloor */
.fxcake { position:absolute; bottom:16%; left:50%; transform:translateX(-50%); width:26px; height:16px;
  background:linear-gradient(#f6e7d0,#e6c9a8); border-radius:4px 4px 3px 3px; box-shadow:0 0 14px rgba(255,210,140,.5); }
.fxcake::before { content:""; position:absolute; top:-8px; left:50%; transform:translateX(-50%); width:2px; height:8px; background:#caa; }
.fxcake::after { content:""; position:absolute; top:-13px; left:50%; transform:translateX(-50%); width:5px; height:7px; border-radius:50% 50% 50% 50%;
  background:radial-gradient(circle at 50% 70%, #FFD23A, #ff7a00); box-shadow:0 0 10px #FFB23A; animation:cakeFlick .4s ease-in-out infinite alternate; }
@keyframes cakeFlick { from{ transform:translateX(-50%) scaleY(1); opacity:.9; } to{ transform:translateX(-52%) scaleY(1.2); opacity:1; } }
@media (prefers-reduced-motion: reduce){ .bs-drone, .bs-fx-champagne i, .fxs-spot, .fxcake::after { animation:none !important; } }

/* ── crew in a clear foreground layer, in front of crowd, no overlap ── */
.bs-crew { position:absolute; bottom:3% !important; z-index:90 !important; }
.bs-crew .bs-crew-lbl { z-index:91; }
/* a subtle dark base so the crew reads against the crowd */
.bs-crew::before { content:""; position:absolute; left:50%; bottom:-2px; transform:translateX(-50%);
  width:24px; height:6px; border-radius:50%; background:radial-gradient(ellipse, rgba(0,0,0,.55), transparent 72%); z-index:-1; }
/* keep dinner tables out of the far-edge crew/bar zones (they sit 10-90% already; clamp visually) */
.bs-table[data-dinner] { z-index:18; }

/* ── roaming: pronounced up/down zig-zag weave through the crowd ── */
.bs-roamer.is-active { animation:roamZig var(--rd,28s) linear infinite alternate !important; }
@keyframes roamZig {
  0%   { left:var(--rx1,18%); transform:translateX(-50%) translateY(16px) scaleX(1); }
  12%  { transform:translateX(-50%) translateY(-18px) scaleX(1); }
  25%  { transform:translateX(-50%) translateY(14px) scaleX(1); }
  38%  { transform:translateX(-50%) translateY(-16px) scaleX(1); }
  49%  { left:var(--rx2,80%); transform:translateX(-50%) translateY(12px) scaleX(1); }
  50%  { left:var(--rx2,80%); transform:translateX(-50%) translateY(12px) scaleX(-1); }
  62%  { transform:translateX(-50%) translateY(-18px) scaleX(-1); }
  75%  { transform:translateX(-50%) translateY(14px) scaleX(-1); }
  88%  { transform:translateX(-50%) translateY(-16px) scaleX(-1); }
  100% { left:var(--rx1,18%); transform:translateX(-50%) translateY(16px) scaleX(-1); }
}

/* ── moment FX labels stack vertically so simultaneous popups don't overlap ── */
.bs-fx-champagne .fxc-label { top:26% !important; }
.bs-fx-speech .fxc-label    { top:35% !important; }
.bs-fx-cake .fxc-label      { top:44% !important; }

/* ── crew: only visible while their time window is active (live count) ── */
.bs-crew[data-start] { opacity:0; transition:opacity .4s ease; }
.bs-crew[data-start].is-active { opacity:1; }
.bs-crew-count { position:absolute; bottom:1%; z-index:91; }

/* ── playlist toggle: needs-planning warning ── */
.toggle-row.needs-plan { border:1.5px solid rgba(255,178,58,.7); border-radius:12px; padding:12px 14px; background:rgba(255,178,58,.06); }
.plan-hint { font-size:12.5px; color:#FFB23A; background:rgba(255,178,58,.08); border:1px solid rgba(255,178,58,.3); border-radius:10px; padding:9px 13px; margin-top:10px; line-height:1.45; }

/* ── crew figures: only the ones active at the current time are shown (match the count) ── */
.bs-crew[data-start] { animation:none !important; opacity:0 !important; }
.bs-crew[data-start].is-active { opacity:1 !important; }

/* ── info buttons on artist + venue cards ── */
.ao-info { position:absolute; top:10px; left:10px; z-index:6; width:24px; height:24px; border-radius:50%;
  display:grid; place-items:center; background:rgba(0,0,0,.55); border:1px solid rgba(255,255,255,.25);
  color:#fff; backdrop-filter:blur(3px); transition:all 160ms; }
.ao-info:hover { background:#6FE000; border-color:#6FE000; color:#08120a; }
.venue-info-link { display:inline-flex; align-items:center; gap:5px; margin-top:8px; font-size:12px; font-weight:700;
  color:#6FE000; text-decoration:none; }
.venue-info-link:hover { text-decoration:underline; }

/* ── artist info: longer labeled pill ── */
.ao-info { position:absolute !important; top:9px; left:9px; width:auto !important; height:auto !important;
  display:inline-flex !important; align-items:center; gap:5px; padding:4px 9px !important; border-radius:999px !important;
  background:rgba(0,0,0,.62); border:1px solid rgba(255,255,255,.25); color:#fff; backdrop-filter:blur(3px);
  font-size:10px; font-weight:700; white-space:nowrap; transition:all 160ms; }
.ao-info:hover { background:#6FE000; border-color:#6FE000; color:#08120a; }
.pkg-advies { border-style:dashed; }

/* ── standalone playlist planner group (step 6) ── */
.cm-plgroup { border-top:1px solid rgba(255,255,255,.08); margin-top:14px; padding-top:14px; }
.cm-pl-title { font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:#3A93E8; margin-bottom:10px; }

/* ── week calendar (preferred days) ── */
.weekcal { display:flex; gap:6px; flex-wrap:wrap; }
.weekcal button { width:42px; height:42px; border-radius:10px; border:1.5px solid rgba(255,255,255,.14); background:#161616; color:rgba(248,245,238,.7); font-family:'Luxe Uno',sans-serif; font-size:13px; font-weight:700; text-transform:uppercase; cursor:pointer; transition:all 150ms; }
.weekcal button:hover { border-color:rgba(111,224,0,.4); color:#F8F5EE; }
.weekcal button.is-on { border-color:#6FE000; background:rgba(111,224,0,.12); color:#6FE000; }
.tt-pl-stage { border-style:dashed; }

/* ============================================================
   MOBILE FIXES - pkg cards (geluid/licht) + moment planner rows
   ============================================================ */
@media (max-width: 760px) {
  .pkg-grid { grid-template-columns: 1fr !important; }
  .pkg-card { padding: 16px 14px 40px !important; }
  .pkg-card .tier-limit { left: 14px; right: auto; bottom: 12px; }
  .pkg-card .rec-badge { position: static !important; margin-bottom: 8px; }
  /* single column: stop the full-width advies card (grid-column span 2) from breaking the grid into an overlapping 2-col layout */
  .pkg-card, .pkg-advies { grid-column: auto !important; }
  .pkg-card:not(.pkg-advies) { min-height: 0 !important; }

  .cm-row { display: grid !important; grid-template-columns: auto 1fr 1fr auto !important; grid-template-areas: "dot label label del" "van van duur duur" !important; align-items: center !important; gap: 6px 8px !important; }
  .cm-dot { grid-area: dot !important; margin: 0 !important; }
  .cm-label { grid-area: label !important; min-width: 0 !important; margin: 0 !important; font-size: 14px; }
  .cm-del { grid-area: del !important; position: static !important; margin: 0 !important; justify-self: end; }
  .cm-field:nth-of-type(2) { grid-area: van !important; }
  .cm-field:nth-of-type(3) { grid-area: duur !important; }
  .cm-field { min-width: 0 !important; }
  .cm-field .sel-wrap, .cm-field select { width: 100%; }
}
/* equal-size package tier cards (height + width); advies card excluded */
.pkg-card:not(.pkg-advies) { min-height: 226px; }
/* package cards: equal columns; grid stretches rows to equal height automatically */
.pkg-grid { grid-template-columns: repeat(2, minmax(0,1fr)); align-items: stretch; }
.pkg-card { min-width: 0; }