/* ─── DESIGN TOKENS ─── */
:root {
  --black: #030302;
  --charcoal: #0b0907;
  --deep-brown: #18110b;
  --gold: #d8a735;
  --gold-light: #f8d676;
  --bright-gold: #f8d676;
  --muted-gold: #8f671f;
  --gold-dim: rgba(216, 167, 53, 0.24);
  --navy: #18110b;
  --navy-dark: #030302;
  --surface: rgba(12, 8, 5, 0.86);
  --surface-2: rgba(24, 17, 11, 0.82);
  --surface-3: rgba(39, 28, 16, 0.86);
  --border: rgba(216, 167, 53, 0.32);
  --text: #f5ead6;
  --muted: #8f8270;
  --muted-2: #b8aa92;
  --green: #5fe09a;
  --red: #ff6b6b;
  --purple: #d8a735;
  --radius: 14px;
  --radius-sm: 8px;
  --radius-lg: 24px;
  --sidebar-w: 260px;
  --transition: 0.18s ease;
  --shadow: rgba(248, 214, 118, 0.18);
}

/* ─── RESET & BASE ─── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Inter', 'SF Pro Display', system-ui, -apple-system, sans-serif;
  background:
    radial-gradient(circle at 20% 10%, rgba(216, 167, 53, 0.15), transparent 25%),
    radial-gradient(circle at 80% 20%, rgba(248, 214, 118, 0.08), transparent 28%),
    linear-gradient(135deg, var(--black), var(--charcoal), #020201);
  color: var(--text);
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(216, 167, 53, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(216, 167, 53, 0.035) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: radial-gradient(circle at center, black, transparent 78%);
  z-index: 0;
}
a { color: inherit; text-decoration: none; }
button { cursor: pointer; font-family: inherit; }
input, select, textarea { font-family: inherit; }
img { max-width: 100%; }
ul { list-style: none; }

/* ─── TYPOGRAPHY ─── */
.gold { color: var(--gold); }
.muted { color: var(--muted-2); }
.text-gold { color: var(--gold); }
.text-green { color: var(--green); }
.text-red { color: var(--red); }
.text-sm { font-size: 0.875rem; }
.text-xs { font-size: 0.75rem; }
.font-semibold { font-weight: 600; }
.font-bold { font-weight: 700; }
.text-center { text-align: center; }
.opacity-50 { opacity: 0.5; }

/* ─── LAYOUT ─── */
.app-layout {
  display: flex;
  min-height: 100vh;
  background: var(--black);
}
.main-content {
  flex: 1;
  margin-left: var(--sidebar-w);
  padding: 2rem 2.5rem;
  max-width: 1400px;
  min-height: 100vh;
  padding-bottom: 6rem;
}
.main-content.no-sidebar { margin-left: 0; padding: 0; }
.full-width { width: 100%; }
.hidden { display: none !important; }

/* ─── SIDEBAR ─── */
.sidebar {
  width: var(--sidebar-w);
  background: var(--surface);
  border-right: 1px solid var(--border);
  position: fixed;
  top: 0; left: 0; bottom: 0;
  display: flex;
  flex-direction: column;
  z-index: 100;
  overflow-y: auto;
}
.sidebar-logo {
  padding: 1.5rem 1.25rem 1rem;
  border-bottom: 1px solid var(--border);
}
.logo-text {
  font-size: 1.4rem;
  font-weight: 900;
  letter-spacing: 2px;
  text-transform: uppercase;
}
.logo-text.sm { font-size: 1rem; }
.sidebar-links {
  flex: 1;
  padding: 1rem 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.sidebar-link {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.625rem 0.875rem;
  border-radius: var(--radius-sm);
  color: var(--muted-2);
  font-size: 0.875rem;
  font-weight: 500;
  transition: all var(--transition);
}
.sidebar-link:hover { background: var(--surface-3); color: var(--text); }
.sidebar-link.active { background: var(--gold-dim); color: var(--gold); }
.sidebar-link svg { width: 18px; height: 18px; flex-shrink: 0; }
.sidebar-footer {
  padding: 1rem 0.75rem;
  border-top: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.sidebar-user {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.5rem 0.25rem;
}

/* ─── MOBILE NAV ─── */
.mobile-nav {
  display: none;
  position: fixed;
  bottom: 0; left: 0; right: 0;
  background: var(--surface);
  border-top: 1px solid var(--border);
  height: 64px;
  z-index: 200;
  align-items: center;
  justify-content: space-around;
}
.mobile-nav-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  color: var(--muted);
  font-size: 0.65rem;
  padding: 0.5rem;
  transition: color var(--transition);
}
.mobile-nav-item svg { width: 22px; height: 22px; }
.mobile-nav-special { background: var(--gold); border-radius: 50%; width: 48px; height: 48px; color: #000; display: flex; align-items: center; justify-content: center; }
.mobile-nav-special svg { width: 24px; height: 24px; }

/* ─── PAGE HEADER ─── */
.page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 1.75rem;
  gap: 1rem;
}
.page-title { font-size: 1.75rem; font-weight: 700; }
.page-sub { color: var(--muted-2); margin-top: 0.25rem; font-size: 0.875rem; }
.page-actions { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }

/* ─── BUTTONS ─── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.5rem 1rem;
  border-radius: var(--radius-sm);
  font-weight: 600;
  font-size: 0.875rem;
  border: none;
  transition: all var(--transition);
  white-space: nowrap;
}
.btn-gold { background: var(--gold); color: #000; }
.btn-gold:hover { background: var(--gold-light); transform: translateY(-1px); box-shadow: 0 4px 16px var(--gold-dim); }
.btn-ghost { background: transparent; color: var(--text); border: 1px solid var(--border); }
.btn-ghost:hover { background: var(--surface-3); border-color: var(--gold); }
.btn-outline { background: transparent; color: var(--text); border: 2px solid var(--text); }
.btn-outline:hover { border-color: var(--gold); color: var(--gold); }
.btn-lg { padding: 0.75rem 1.75rem; font-size: 1rem; border-radius: var(--radius); }
.btn-sm { padding: 0.35rem 0.75rem; font-size: 0.8rem; }
.btn svg { width: 16px; height: 16px; }
.btn-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px; height: 36px;
  border-radius: var(--radius-sm);
  background: transparent;
  border: 1px solid var(--border);
  color: var(--muted-2);
  transition: all var(--transition);
}
.btn-icon:hover { background: var(--surface-3); color: var(--text); }
.btn-icon.active { background: var(--gold-dim); color: var(--gold); border-color: var(--gold); }
.btn-icon.light { border-color: rgba(255,255,255,0.2); color: white; }
.btn-icon.danger:hover { background: rgba(239,68,68,0.1); color: var(--red); border-color: var(--red); }

/* ─── BADGES ─── */
.badge {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.6rem;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.badge-live { background: rgba(34,197,94,0.15); color: var(--green); border: 1px solid rgba(34,197,94,0.3); }
.badge-upcoming { background: rgba(201,168,76,0.15); color: var(--gold); border: 1px solid rgba(201,168,76,0.3); }
.badge-past { background: rgba(107,114,128,0.15); color: var(--muted-2); border: 1px solid var(--border); }
.badge-draft { background: rgba(59,130,246,0.15); color: #60a5fa; border: 1px solid rgba(59,130,246,0.3); }
.badge-type { background: rgba(11,20,55,0.7); color: var(--muted-2); border: 1px solid var(--border); text-transform: capitalize; }
.badge-free { background: rgba(34,197,94,0.15); color: var(--green); }
.badge-paid { background: rgba(201,168,76,0.15); color: var(--gold); }
.badge-vip { background: rgba(139,92,246,0.15); color: #a78bfa; }
.badge-table { background: rgba(59,130,246,0.15); color: #60a5fa; }

/* ─── STAT CARDS ─── */
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-bottom: 2rem; }
.stats-grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-bottom: 1.5rem; }
.stat-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.25rem;
  transition: border-color var(--transition);
}
.stat-card:hover { border-color: var(--gold); }
.stat-card-sm {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1rem 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.stat-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.5rem; }
.stat-label { font-size: 0.75rem; color: var(--muted-2); text-transform: uppercase; letter-spacing: 0.08em; }
.stat-value { font-size: 1.75rem; font-weight: 700; }
.stat-sub { font-size: 0.75rem; color: var(--muted-2); margin-top: 0.25rem; }
.stat-icon { width: 20px; height: 20px; color: var(--gold); opacity: 0.7; }
.stat-delta { font-size: 0.75rem; margin-top: 0.5rem; font-weight: 600; }
.stat-delta.positive { color: var(--green); }
.stat-delta.negative { color: var(--red); }

/* ─── FORMS ─── */
.form-group { display: flex; flex-direction: column; gap: 0.4rem; margin-bottom: 1rem; }
.form-label { font-size: 0.8rem; font-weight: 600; color: var(--muted-2); text-transform: uppercase; letter-spacing: 0.05em; }
.form-input {
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text);
  padding: 0.625rem 0.875rem;
  font-size: 0.875rem;
  transition: border-color var(--transition);
  outline: none;
  width: 100%;
}
.form-input:focus { border-color: var(--gold); box-shadow: 0 0 0 3px var(--gold-dim); }
.form-input::placeholder { color: var(--muted); }
.form-input:disabled { opacity: 0.5; cursor: not-allowed; }
.form-textarea { resize: vertical; min-height: 100px; }
.form-input-sm { padding: 0.4rem 0.6rem; font-size: 0.8rem; }
.form-row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.form-row-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0.75rem; }
.form-section {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.5rem;
  margin-bottom: 1.25rem;
}
.form-section-title {
  font-size: 1rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 1.25rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--border);
}
.form-section-title svg { width: 18px; height: 18px; color: var(--gold); }
.form-actions { display: flex; justify-content: flex-end; gap: 0.75rem; margin-top: 1rem; }

/* ─── TOGGLE SWITCH ─── */
.toggle { position: relative; display: inline-block; width: 44px; height: 24px; flex-shrink: 0; }
.toggle input { opacity: 0; width: 0; height: 0; }
.toggle-slider {
  position: absolute; inset: 0;
  background: var(--surface-3);
  border-radius: 999px;
  cursor: pointer;
  transition: var(--transition);
  border: 1px solid var(--border);
}
.toggle-slider::before {
  content: '';
  position: absolute;
  width: 18px; height: 18px;
  left: 2px; top: 50%;
  transform: translateY(-50%);
  background: var(--muted);
  border-radius: 50%;
  transition: var(--transition);
}
.toggle input:checked + .toggle-slider { background: var(--gold-dim); border-color: var(--gold); }
.toggle input:checked + .toggle-slider::before { background: var(--gold); transform: translate(20px, -50%); }
.toggle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.875rem 0;
  border-bottom: 1px solid var(--border);
  gap: 1rem;
}
.toggle-row:last-child { border-bottom: none; }

/* ─── DATA TABLE ─── */
.table-wrap { overflow-x: auto; border-radius: var(--radius); border: 1px solid var(--border); }
.data-table { width: 100%; border-collapse: collapse; }
.data-table th {
  background: var(--surface-2);
  padding: 0.75rem 1rem;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted-2);
  border-bottom: 1px solid var(--border);
  text-align: left;
  white-space: nowrap;
}
.data-table td {
  padding: 0.875rem 1rem;
  border-bottom: 1px solid var(--border);
  font-size: 0.875rem;
  vertical-align: middle;
}
.data-table tr:last-child td { border-bottom: none; }
.data-table tbody tr:hover { background: var(--surface-2); }
.row-actions { display: flex; gap: 0.25rem; }

/* ─── PROGRESS BARS ─── */
.progress-bar-wrap { background: var(--surface-3); border-radius: 999px; height: 4px; margin: 0.5rem 0; }
.progress-bar { background: var(--gold); height: 100%; border-radius: 999px; transition: width 0.5s ease; }
.mini-progress { background: var(--surface-3); border-radius: 999px; height: 3px; width: 80px; overflow: hidden; }
.mini-progress div { height: 100%; background: var(--gold); border-radius: 999px; }
.mini-progress.wide { width: 120px; }

/* ─── EVENT CARDS ─── */
.cards-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.event-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  cursor: pointer;
  transition: all var(--transition);
}
.event-card:hover { border-color: var(--gold); transform: translateY(-2px); box-shadow: 0 8px 32px rgba(0,0,0,0.4); }
.event-card-img {
  height: 180px;
  background-size: cover;
  background-position: center;
  position: relative;
}
.event-card-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, transparent 60%);
  padding: 0.75rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.event-card-badges { display: flex; gap: 0.4rem; flex-wrap: wrap; }
.event-card-body { padding: 1rem; }
.event-card-title { font-size: 1rem; font-weight: 700; margin-bottom: 0.5rem; }
.event-card-meta { display: flex; gap: 1rem; font-size: 0.8rem; color: var(--muted-2); margin-bottom: 0.25rem; align-items: center; }
.event-card-meta svg { width: 12px; height: 12px; margin-right: 0.25rem; }
.event-card-footer { margin-top: 0.75rem; padding-top: 0.75rem; border-top: 1px solid var(--border); }
.event-card-stats { display: flex; justify-content: space-between; margin-bottom: 0.5rem; }

/* ─── EVENT ROW ─── */
.events-list { display: flex; flex-direction: column; gap: 0.5rem; }
.event-row {
  display: grid;
  grid-template-columns: 56px 1fr 160px 100px auto;
  align-items: center;
  gap: 1rem;
  padding: 0.875rem 1rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: all var(--transition);
}
.event-row:hover { border-color: var(--gold); background: var(--surface-2); }
.event-row-img { width: 56px; height: 40px; border-radius: var(--radius-sm); background-size: cover; background-position: center; flex-shrink: 0; }
.event-row-info { min-width: 0; }
.event-row-title { font-weight: 600; font-size: 0.9rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.event-row-meta { font-size: 0.75rem; color: var(--muted-2); display: flex; gap: 0.5rem; align-items: center; margin-top: 0.25rem; }
.event-row-stats { display: flex; flex-direction: column; align-items: flex-end; }
.event-row-status { display: flex; justify-content: center; }
.event-row-actions { display: flex; gap: 0.25rem; }

/* ─── SECTIONS ─── */
.section-block {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.5rem;
  margin-bottom: 1.5rem;
}
.section-row { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; }
.section-title-sm { font-size: 1rem; font-weight: 700; }
.two-col-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }

/* ─── QUICK ACTIONS ─── */
.quick-actions { display: grid; grid-template-columns: repeat(6, 1fr); gap: 0.75rem; margin-bottom: 2rem; }
.quick-action {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  padding: 1rem 0.5rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-size: 0.75rem;
  color: var(--muted-2);
  transition: all var(--transition);
  font-weight: 500;
}
.quick-action:hover { border-color: var(--gold); color: var(--gold); background: var(--gold-dim); }
.quick-action svg { width: 22px; height: 22px; }

/* ─── TABS ─── */
.tab-group { display: flex; gap: 0.25rem; background: var(--surface-2); border-radius: var(--radius-sm); padding: 0.25rem; }
.tab {
  padding: 0.4rem 0.875rem;
  border-radius: 4px;
  font-size: 0.8rem;
  font-weight: 600;
  border: none;
  background: transparent;
  color: var(--muted-2);
  transition: all var(--transition);
}
.tab.active { background: var(--gold); color: #000; }
.tab:hover:not(.active) { color: var(--text); }
.tab-filter-row { display: flex; gap: 0.25rem; margin-bottom: 1rem; }

/* ─── CHECKLIST & ACTIVITY ─── */
.checklist { display: flex; flex-direction: column; gap: 0.5rem; }
.checklist-item { display: flex; align-items: center; gap: 0.75rem; font-size: 0.875rem; color: var(--text); }
.checklist-item.done { color: var(--muted-2); text-decoration: line-through; }
.checklist-item.done .check-icon svg { color: var(--green); }
.check-icon svg { width: 18px; height: 18px; }
.activity-list { display: flex; flex-direction: column; gap: 0.25rem; }
.activity-item { display: flex; align-items: center; gap: 0.75rem; padding: 0.625rem 0; border-bottom: 1px solid var(--border); }
.activity-item:last-child { border-bottom: none; }
.activity-icon { width: 32px; height: 32px; border-radius: 50%; background: var(--surface-3); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.activity-icon.gold { background: var(--gold-dim); color: var(--gold); }
.activity-icon svg { width: 14px; height: 14px; }
.activity-text { display: flex; flex-direction: column; gap: 0.15rem; flex: 1; font-size: 0.8rem; }

/* ─── AVATARS ─── */
.avatar-sm { width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.7rem; font-weight: 700; flex-shrink: 0; }
.avatar-md { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.8rem; font-weight: 700; flex-shrink: 0; }
.gold-bg { background: var(--gold); color: #000; }
.navy-bg { background: var(--navy); color: var(--text); border: 1px solid var(--border); }

/* ─── ICON SIZES ─── */
.icon-xs { width: 12px; height: 12px; display: inline; vertical-align: middle; }

/* ─── SEARCH & FILTER ─── */
.table-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.search-bar { display: flex; align-items: center; gap: 0.5rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 0.5rem 0.875rem; flex: 1; min-width: 200px; }
.search-bar svg { width: 16px; height: 16px; color: var(--muted); flex-shrink: 0; }
.search-input { background: none; border: none; outline: none; color: var(--text); font-size: 0.875rem; flex: 1; }
.filter-group { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }

/* ─── GUEST CELLS ─── */
.guest-cell { display: flex; align-items: center; gap: 0.625rem; }
.checkin-yes { display: flex; align-items: center; gap: 0.375rem; font-size: 0.8rem; color: var(--green); }
.checkin-no { display: flex; align-items: center; gap: 0.375rem; font-size: 0.8rem; color: var(--muted); }
.checkin-yes svg, .checkin-no svg { width: 16px; height: 16px; }
.source-badge { background: var(--surface-3); border: 1px solid var(--border); border-radius: 999px; padding: 0.15rem 0.5rem; font-size: 0.7rem; color: var(--muted-2); }

/* ─── MODALS ─── */
.modal-overlay {
  position: fixed; inset: 0;
  background: rgba(0,0,0,0.7);
  backdrop-filter: blur(8px);
  display: flex; align-items: center; justify-content: center;
  z-index: 1000;
  padding: 1rem;
}
.modal {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  max-width: 520px; width: 100%;
  max-height: 90vh;
  overflow-y: auto;
}
.modal-lg { max-width: 680px; }
.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.25rem 1.5rem;
  border-bottom: 1px solid var(--border);
  font-size: 1rem;
  font-weight: 700;
}
.modal-body { padding: 1.5rem; }
.modal-footer { padding: 1rem 1.5rem; border-top: 1px solid var(--border); display: flex; justify-content: flex-end; gap: 0.75rem; }

/* ─── TOAST ─── */
.toast {
  position: fixed;
  bottom: 80px;
  right: 1.5rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 0.75rem 1.25rem;
  display: flex;
  align-items: center;
  gap: 0.625rem;
  font-size: 0.875rem;
  font-weight: 500;
  box-shadow: 0 8px 32px rgba(0,0,0,0.4);
  z-index: 2000;
  opacity: 0;
  transform: translateY(12px);
  transition: all var(--transition);
}
.toast.show { opacity: 1; transform: translateY(0); }
.toast svg { width: 18px; height: 18px; }
.toast-success { border-color: var(--green); }
.toast-success svg { color: var(--green); }
.toast-error { border-color: var(--red); }
.toast-error svg { color: var(--red); }

/* ─── AUTH PAGE ─── */
.auth-page {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 6rem 1.5rem 2rem;
  background:
    radial-gradient(circle at 20% 10%, rgba(201,168,76,0.18), transparent 28rem),
    radial-gradient(circle at 80% 0%, rgba(11,20,55,0.9), transparent 32rem),
    var(--black);
}
.auth-brand {
  position: fixed;
  top: 1.5rem;
  left: 1.5rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.14em;
}
.auth-brand img { width: 40px; height: 40px; }
.auth-brand small { display: block; color: var(--gold); font-size: 0.65rem; letter-spacing: 0.08em; }
.auth-card {
  width: min(100%, 460px);
  background: rgba(17,24,39,0.86);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 2rem;
  box-shadow: 0 24px 80px rgba(0,0,0,0.55);
  backdrop-filter: blur(18px);
}
.auth-card__eyebrow {
  color: var(--gold);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  margin-bottom: 0.75rem;
}
.auth-card h1 { font-size: 2rem; margin-bottom: 0.75rem; }
.auth-card p { color: var(--muted-2); line-height: 1.6; margin-bottom: 1.5rem; }
.auth-form { display: grid; gap: 0.75rem; }
.auth-form .btn { margin-top: 0.5rem; justify-content: center; }
.auth-error {
  border: 1px solid rgba(239,68,68,0.45);
  background: rgba(239,68,68,0.12);
  color: #fecaca;
  border-radius: var(--radius-sm);
  padding: 0.75rem;
  margin-bottom: 1rem;
  font-size: 0.875rem;
}
.auth-hint { color: var(--muted); font-size: 0.8rem; margin-top: 1rem; }

/* ─── LANDING PAGE ─── */
.landing { background: var(--black); }
.landing-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.25rem 2.5rem;
  position: fixed; top: 0; left: 0; right: 0;
  z-index: 100;
  background: rgba(10,10,10,0.85);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border);
}
.landing-nav-links { display: flex; align-items: center; gap: 1.5rem; }
.nav-link { font-size: 0.875rem; color: var(--muted-2); transition: color var(--transition); font-weight: 500; }
.nav-link:hover { color: var(--text); }
.hero {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  padding: 6rem 2rem 4rem;
}
.hero-bg {
  position: absolute; inset: 0;
  background: url('https://images.unsplash.com/photo-1540575467063-178a50c2df87?w=1600&q=80') center/cover;
  opacity: 0.3;
  filter: blur(2px);
}
.hero-bg::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, rgba(10,10,10,0.3) 0%, rgba(10,10,10,0.9) 100%);
}
.hero-content { position: relative; text-align: center; max-width: 800px; }
.hero-tag {
  display: inline-block;
  padding: 0.35rem 1rem;
  background: var(--gold-dim);
  border: 1px solid var(--gold);
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: var(--gold);
  margin-bottom: 1.5rem;
}
.hero-title { font-size: 4rem; font-weight: 900; line-height: 1.05; margin-bottom: 1.25rem; }
.hero-sub { font-size: 1.1rem; color: var(--muted-2); max-width: 600px; margin: 0 auto 2rem; line-height: 1.6; }
.hero-cta { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; margin-bottom: 3rem; }
.hero-stats { display: flex; align-items: center; justify-content: center; gap: 2rem; flex-wrap: wrap; }
.hero-stat { text-align: center; }
.hero-stat-val { display: block; font-size: 1.75rem; font-weight: 800; color: var(--gold); }
.hero-stat-lbl { font-size: 0.75rem; color: var(--muted-2); text-transform: uppercase; letter-spacing: 0.08em; }
.hero-stat-div { width: 1px; height: 40px; background: var(--border); }

.section { padding: 5rem 2.5rem; }
.section-dark { background: var(--surface); }
.section-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 2.5rem; }
.section-header.center { flex-direction: column; text-align: center; gap: 1rem; }
.section-title { font-size: 2rem; font-weight: 800; }
.section-sub { color: var(--muted-2); font-size: 1rem; max-width: 500px; }
.features-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.feature-card {
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.75rem;
  transition: all var(--transition);
}
.feature-card:hover { border-color: var(--gold); transform: translateY(-2px); }
.feature-icon { width: 48px; height: 48px; background: var(--gold-dim); border-radius: var(--radius-sm); display: flex; align-items: center; justify-content: center; margin-bottom: 1rem; color: var(--gold); }
.feature-icon svg { width: 24px; height: 24px; }
.feature-card h3 { font-size: 1.05rem; font-weight: 700; margin-bottom: 0.5rem; }
.feature-card p { font-size: 0.875rem; color: var(--muted-2); line-height: 1.6; }
.event-types-grid { display: flex; flex-wrap: wrap; gap: 0.75rem; justify-content: center; }
.event-type-pill {
  display: flex; align-items: center; gap: 0.5rem;
  padding: 0.625rem 1.25rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 999px;
  font-size: 0.875rem;
  transition: all var(--transition);
}
.event-type-pill:hover { border-color: var(--gold); background: var(--gold-dim); }
.cta-section { text-align: center; }
.cta-inner { max-width: 600px; margin: 0 auto; }
.cta-inner h2 { font-size: 2.5rem; font-weight: 800; margin-bottom: 1rem; }
.cta-inner p { color: var(--muted-2); margin-bottom: 2rem; }
.feat-event-card {
  height: 320px;
  border-radius: var(--radius);
  background-size: cover;
  background-position: center;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  transition: transform var(--transition);
}
.feat-event-card:hover { transform: scale(1.02); }
.feat-event-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, transparent 50%);
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 1.5rem;
}
.feat-event-overlay span { margin-bottom: 0.5rem; }
.feat-event-overlay h3 { font-size: 1.2rem; font-weight: 700; }
.feat-event-overlay p { font-size: 0.8rem; color: var(--muted-2); margin-top: 0.25rem; }
.landing-footer { background: var(--surface); border-top: 1px solid var(--border); text-align: center; padding: 2rem; }
.footer-logo { font-size: 1.25rem; font-weight: 900; letter-spacing: 2px; margin-bottom: 1rem; }
.footer-links { display: flex; gap: 1.5rem; justify-content: center; margin-bottom: 1rem; }
.footer-links a { font-size: 0.875rem; color: var(--muted-2); transition: color var(--transition); }
.footer-links a:hover { color: var(--gold); }

/* ─── CREATE EVENT PAGE ─── */
.create-steps { display: flex; align-items: center; margin-bottom: 2rem; }
.create-step {
  display: flex; align-items: center; gap: 0.5rem;
  font-size: 0.8rem; font-weight: 600; color: var(--muted-2);
}
.create-step.active { color: var(--gold); }
.create-step span {
  width: 28px; height: 28px; border-radius: 50%;
  border: 2px solid currentColor;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.75rem;
}
.create-step-line { flex: 1; height: 1px; background: var(--border); margin: 0 0.75rem; }
.create-layout { display: grid; grid-template-columns: 1fr 360px; gap: 2rem; align-items: start; }
.create-preview { position: sticky; top: 1rem; }
.preview-label { font-size: 0.7rem; font-weight: 700; letter-spacing: 0.1em; color: var(--muted-2); text-align: center; margin-bottom: 0.75rem; }
.preview-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
.preview-img { height: 180px; background-size: cover; background-position: center; position: relative; padding: 0.75rem; }
.preview-body { padding: 1.25rem; }
.preview-body h3 { font-size: 1rem; font-weight: 700; margin-bottom: 0.75rem; }
.preview-meta { font-size: 0.8rem; color: var(--muted-2); display: flex; align-items: center; gap: 0.375rem; margin-bottom: 0.35rem; }
.preview-meta svg { width: 12px; height: 12px; }
.preview-tickets { border-top: 1px solid var(--border); margin-top: 0.875rem; padding-top: 0.875rem; display: flex; flex-direction: column; gap: 0.4rem; }
.preview-ticket { display: flex; justify-content: space-between; font-size: 0.8rem; }
.event-type-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0.5rem; }
.event-type-option {
  display: flex; flex-direction: column; align-items: center; gap: 0.25rem;
  padding: 0.75rem 0.5rem;
  background: var(--surface-2);
  border: 2px solid var(--border);
  border-radius: var(--radius-sm);
  cursor: pointer; transition: all var(--transition);
  text-align: center;
}
.event-type-option input { display: none; }
.event-type-option.selected, .event-type-option:has(input:checked) { border-color: var(--gold); background: var(--gold-dim); }
.event-type-icon { font-size: 1.25rem; }
.event-type-label { font-size: 0.75rem; font-weight: 600; }
.event-type-desc { font-size: 0.65rem; color: var(--muted-2); }
.upload-zone {
  border: 2px dashed var(--border);
  border-radius: var(--radius);
  padding: 2rem;
  text-align: center;
  color: var(--muted-2);
  transition: border-color var(--transition);
  display: flex; flex-direction: column; align-items: center; gap: 0.5rem;
}
.upload-zone.compact { padding: 1rem; }
.upload-zone svg { width: 32px; height: 32px; color: var(--gold); }
.upload-zone:hover { border-color: var(--gold); }
.invite-row { display: flex; gap: 0.5rem; align-items: center; }
.ticket-builder {
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 1rem;
  margin-bottom: 0.5rem;
}
.ticket-builder-header { display: flex; gap: 0.5rem; margin-bottom: 0.75rem; align-items: center; }
.ticket-name-input { flex: 1; font-weight: 600; }

/* ─── EVENT DETAIL PAGE ─── */
.event-hero {
  height: 400px;
  background-size: cover;
  background-position: center;
  position: relative;
  border-radius: var(--radius);
  margin-bottom: 2rem;
  overflow: hidden;
}
.event-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.3) 60%, transparent 100%);
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 2rem;
}
.event-hero-badges { display: flex; gap: 0.5rem; margin-bottom: 0.75rem; }
.event-hero-title { font-size: 2.25rem; font-weight: 900; margin-bottom: 0.75rem; }
.event-hero-meta { display: flex; flex-wrap: wrap; gap: 1.25rem; font-size: 0.875rem; color: var(--muted-2); }
.event-hero-meta svg { width: 16px; height: 16px; display: inline; vertical-align: middle; margin-right: 0.3rem; }
.host-action-bar { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
.event-detail-layout { display: grid; grid-template-columns: 1fr 320px; gap: 2rem; align-items: start; }
.event-detail-section { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.5rem; margin-bottom: 1.25rem; }
.event-detail-section h2 { font-size: 1rem; font-weight: 700; margin-bottom: 1rem; padding-bottom: 0.75rem; border-bottom: 1px solid var(--border); }
.event-description { color: var(--muted-2); line-height: 1.7; font-size: 0.9rem; }
.event-details-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-top: 1.25rem; }
.event-detail-item { display: flex; align-items: center; gap: 0.75rem; font-size: 0.875rem; }
.event-detail-item svg { width: 18px; height: 18px; color: var(--gold); flex-shrink: 0; }
.event-detail-item > div { display: flex; flex-direction: column; gap: 0.15rem; }
.event-detail-item .label { font-size: 0.7rem; color: var(--muted-2); text-transform: uppercase; letter-spacing: 0.06em; }
.tickets-overview { display: flex; flex-direction: column; gap: 0.75rem; }
.ticket-overview-row { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem; background: var(--surface-2); border-radius: var(--radius-sm); flex-wrap: wrap; gap: 0.5rem; }
.ticket-overview-info { display: flex; align-items: center; gap: 0.5rem; }
.ticket-overview-stats { display: flex; align-items: center; gap: 0.75rem; }
.capacity-bar-wrap { margin-top: 1.25rem; }
.capacity-bar-label { display: flex; justify-content: space-between; font-size: 0.8rem; margin-bottom: 0.4rem; }
.capacity-bar { background: var(--surface-3); border-radius: 999px; height: 8px; overflow: hidden; }
.capacity-bar div { height: 100%; border-radius: 999px; transition: width 0.5s ease; }
.promoter-chips { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.promo-chip { display: flex; align-items: center; gap: 0.625rem; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 0.5rem 0.875rem; }
.promo-chip > div { display: flex; flex-direction: column; }
.event-tags { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.tag { background: var(--surface-2); border: 1px solid var(--border); border-radius: 999px; padding: 0.25rem 0.75rem; font-size: 0.75rem; color: var(--muted-2); }
.sidebar-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.25rem; margin-bottom: 1rem; }
.sidebar-card-title { font-size: 0.8rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted-2); margin-bottom: 1rem; }
.revenue-big { display: flex; flex-direction: column; align-items: center; gap: 0.25rem; padding: 1rem 0; }
.revenue-big .gold { font-size: 2.25rem; font-weight: 800; }
.revenue-breakdown { margin-top: 0.75rem; }
.rev-row { display: flex; justify-content: space-between; font-size: 0.875rem; padding: 0.5rem 0; border-bottom: 1px solid var(--border); }
.rev-row:last-child { border-bottom: none; }
.rev-row.total { font-weight: 700; }
.sidebar-action { justify-content: flex-start; gap: 0.75rem; margin-bottom: 0.35rem; }
.sidebar-action svg { width: 16px; height: 16px; }
.sidebar-action.danger { color: var(--red); }
.sidebar-action.danger:hover { background: rgba(239,68,68,0.1); border-color: var(--red); }
.share-url { display: flex; gap: 0.5rem; margin-bottom: 0.75rem; }
.share-buttons { display: flex; gap: 0.5rem; }
.share-btn {
  flex: 1; padding: 0.5rem; border-radius: var(--radius-sm);
  border: 1px solid var(--border); background: var(--surface-2);
  display: flex; align-items: center; justify-content: center;
  font-size: 0.75rem; font-weight: 700; color: var(--text);
  transition: all var(--transition);
}
.share-btn svg { width: 16px; height: 16px; }
.share-btn:hover { border-color: var(--gold); }

/* ─── CHECKOUT ─── */
.checkout-page { background: var(--black); min-height: 100vh; }
.checkout-nav { display: flex; align-items: center; justify-content: space-between; padding: 1rem 2rem; border-bottom: 1px solid var(--border); background: var(--surface); position: sticky; top: 0; z-index: 100; }
.checkout-title { font-size: 1.5rem; font-weight: 700; margin-bottom: 1.5rem; }
.checkout-layout { display: grid; grid-template-columns: 1fr 380px; gap: 2rem; max-width: 1100px; margin: 0 auto; padding: 2rem; }
.checkout-section { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.5rem; margin-bottom: 1.25rem; }
.checkout-section h3 { font-size: 1rem; font-weight: 700; margin-bottom: 1.25rem; }
.ticket-select-list { display: flex; flex-direction: column; gap: 0.75rem; }
.ticket-select-row { display: flex; justify-content: space-between; align-items: center; padding: 1rem; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); }
.ticket-select-info { display: flex; flex-direction: column; gap: 0.15rem; }
.ticket-select-name { font-weight: 600; }
.ticket-select-price { font-size: 0.875rem; font-weight: 600; color: var(--gold); }
.ticket-select-avail { }
.qty-control { display: flex; align-items: center; gap: 0.75rem; }
.qty-btn { width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--border); background: var(--surface-3); color: var(--text); font-size: 1.1rem; display: flex; align-items: center; justify-content: center; transition: all var(--transition); }
.qty-btn:hover { background: var(--gold); color: #000; border-color: var(--gold); }
.qty-val { width: 24px; text-align: center; font-weight: 700; }
.promo-input-row { display: flex; gap: 0.5rem; }
.promo-result { padding: 0.5rem 0.75rem; border-radius: var(--radius-sm); font-size: 0.8rem; margin-top: 0.5rem; display: flex; align-items: center; gap: 0.375rem; }
.promo-result svg { width: 14px; height: 14px; }
.promo-result.success { background: rgba(34,197,94,0.1); color: var(--green); border: 1px solid var(--green); }
.promo-result.error { background: rgba(239,68,68,0.1); color: var(--red); border: 1px solid var(--red); }
.payment-methods { display: flex; gap: 0.75rem; margin-bottom: 1rem; }
.payment-method { flex: 1; padding: 0.75rem; background: var(--surface-2); border: 2px solid var(--border); border-radius: var(--radius-sm); cursor: pointer; display: flex; flex-direction: column; align-items: center; gap: 0.25rem; font-size: 0.8rem; font-weight: 600; transition: all var(--transition); }
.payment-method input { display: none; }
.payment-method:has(input:checked), .payment-method.selected { border-color: var(--gold); background: var(--gold-dim); }
.payment-method svg { width: 20px; height: 20px; }
.card-fields { }
.checkout-event-preview { display: flex; gap: 0.75rem; padding: 1rem; background: var(--surface-2); border-radius: var(--radius-sm); margin-bottom: 1rem; }
.checkout-event-img { width: 70px; height: 60px; border-radius: var(--radius-sm); background-size: cover; background-position: center; flex-shrink: 0; }
.checkout-event-info h3 { font-size: 0.9rem; font-weight: 700; margin-bottom: 0.25rem; }
.order-summary { background: var(--surface-2); border-radius: var(--radius-sm); padding: 1rem; margin-bottom: 1rem; }
.order-summary-title { font-weight: 700; font-size: 0.85rem; margin-bottom: 0.75rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted-2); }
.order-line { display: flex; justify-content: space-between; font-size: 0.875rem; padding: 0.4rem 0; }
.total-line { border-top: 1px solid var(--border); margin-top: 0.5rem; padding-top: 0.75rem; font-weight: 700; font-size: 1rem; }
.checkout-trust { text-align: center; font-size: 0.75rem; color: var(--muted); display: flex; align-items: center; justify-content: center; gap: 0.375rem; margin-top: 0.75rem; }
.checkout-trust svg { width: 14px; height: 14px; color: var(--green); }
.refund-policy { background: var(--surface-2); border-radius: var(--radius-sm); padding: 0.75rem; font-size: 0.75rem; color: var(--muted-2); display: flex; gap: 0.5rem; margin-top: 0.75rem; }
.refund-policy svg { width: 14px; height: 14px; flex-shrink: 0; margin-top: 1px; }
.success-modal { text-align: center; padding: 3rem 2rem; }
.success-icon { width: 72px; height: 72px; border-radius: 50%; background: rgba(34,197,94,0.15); border: 2px solid var(--green); display: flex; align-items: center; justify-content: center; font-size: 2rem; color: var(--green); margin: 0 auto 1.5rem; }
.qr-placeholder { margin: 1.5rem auto; display: inline-flex; flex-direction: column; align-items: center; gap: 0.5rem; }
.qr-mock { width: 120px; height: 120px; background: white; border-radius: var(--radius-sm); display: flex; align-items: center; justify-content: center; padding: 12px; }
.qr-inner { width: 100%; height: 100%; background: repeating-linear-gradient(0deg, #000 0, #000 4px, transparent 4px, transparent 8px), repeating-linear-gradient(90deg, #000 0, #000 4px, transparent 4px, transparent 8px); }
.success-ticket-name { font-size: 1.1rem; font-weight: 700; margin-top: 1rem; }

/* ─── PROMOTERS ─── */
.leaderboard { display: flex; flex-direction: column; gap: 0.5rem; }
.leaderboard-row { display: flex; align-items: center; gap: 1rem; padding: 1rem; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); }
.leaderboard-row.top { border-color: var(--gold); background: var(--gold-dim); }
.leaderboard-rank { width: 32px; text-align: center; font-size: 1.25rem; }
.leaderboard-info { flex: 1; min-width: 0; }
.leaderboard-info > div:first-child { font-weight: 600; }
.leaderboard-level { font-size: 0.75rem; font-weight: 700; padding: 0.2rem 0.6rem; border-radius: 999px; background: rgba(255,255,255,0.05); }
.leaderboard-stats { display: flex; gap: 1.5rem; margin-left: auto; }
.leaderboard-stat { display: flex; flex-direction: column; align-items: flex-end; gap: 0.1rem; }
.code-chip { background: var(--surface-3); border: 1px solid var(--border); border-radius: 4px; padding: 0.1rem 0.4rem; font-size: 0.7rem; font-family: monospace; color: var(--gold); }
.code-chip.large { padding: 0.25rem 0.625rem; font-size: 0.8rem; }
.payout-list { display: flex; flex-direction: column; gap: 0.5rem; }
.payout-row { display: flex; align-items: center; gap: 1rem; padding: 0.875rem; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); }
.payout-info { flex: 1; }
.payout-amount { margin-left: auto; }
.event-check-list { display: flex; flex-direction: column; gap: 0.5rem; }
.event-check { display: flex; align-items: center; gap: 0.5rem; font-size: 0.875rem; }
.event-check input { accent-color: var(--gold); }

/* ─── VIP TABLES ─── */
.venue-map { background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.5rem; }
.venue-stage { background: linear-gradient(135deg, var(--gold-dim), transparent); border: 1px solid var(--gold); border-radius: var(--radius-sm); padding: 0.75rem 1.5rem; text-align: center; font-size: 0.8rem; font-weight: 700; color: var(--gold); margin-bottom: 1.5rem; letter-spacing: 0.1em; }
.venue-sections { display: flex; gap: 1.5rem; flex-wrap: wrap; justify-content: center; }
.venue-section { }
.venue-section-label { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: var(--muted-2); margin-bottom: 0.625rem; }
.venue-section-tables { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.venue-table {
  width: 72px; height: 72px;
  border-radius: var(--radius-sm);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px;
  cursor: pointer; transition: all var(--transition);
  border: 2px solid transparent;
}
.venue-table.reserved { background: var(--gold-dim); border-color: var(--gold); }
.venue-table.available { background: rgba(34,197,94,0.1); border-color: rgba(34,197,94,0.3); }
.venue-table.pending { background: rgba(59,130,246,0.1); border-color: rgba(59,130,246,0.3); }
.venue-table:hover { transform: scale(1.05); }
.venue-table-num { font-weight: 800; font-size: 0.9rem; }
.venue-table-cap { font-size: 0.6rem; color: var(--muted-2); }
.venue-table-guest { font-size: 0.6rem; color: var(--gold); }
.map-legend { display: flex; gap: 1.5rem; margin-top: 1.25rem; justify-content: center; }
.legend-item { display: flex; align-items: center; gap: 0.375rem; font-size: 0.75rem; color: var(--muted-2); }
.legend-dot { width: 10px; height: 10px; border-radius: 2px; }
.legend-dot.reserved { background: var(--gold); }
.legend-dot.available { background: var(--green); }
.legend-dot.pending { background: #60a5fa; }
.table-cards-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1rem; }
.table-card {
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.25rem;
  cursor: pointer;
  transition: all var(--transition);
}
.table-card:hover { transform: translateY(-2px); }
.table-card-reserved { border-color: var(--gold); }
.table-card-available { border-color: rgba(34,197,94,0.3); }
.table-card-pending { border-color: rgba(59,130,246,0.3); }
.table-card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.625rem; }
.table-card-num { font-size: 1.1rem; font-weight: 800; }
.table-card-section { font-size: 0.75rem; color: var(--muted-2); margin-bottom: 0.5rem; }
.table-card-guest { font-size: 0.875rem; font-weight: 600; display: flex; align-items: center; gap: 0.375rem; margin-bottom: 0.625rem; }
.table-card-guest svg { width: 14px; height: 14px; }
.table-card-meta { display: flex; justify-content: space-between; font-size: 0.8rem; margin-bottom: 0.625rem; }
.table-card-balance { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; border-top: 1px solid var(--border); padding-top: 0.625rem; }
.balance-item { display: flex; flex-direction: column; gap: 0.15rem; }
.bottle-preview { display: flex; flex-wrap: wrap; gap: 0.25rem; margin-top: 0.5rem; }
.bottle-chip-sm { background: var(--surface); border: 1px solid var(--border); border-radius: 4px; padding: 0.1rem 0.3rem; font-size: 0.65rem; color: var(--muted-2); }
.packages-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.package-card { background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.5rem; transition: border-color var(--transition); }
.package-card:hover { border-color: var(--gold); }
.package-name { font-size: 1rem; font-weight: 700; margin-bottom: 0.25rem; }
.package-price { font-size: 1.25rem; font-weight: 800; margin-bottom: 1rem; }
.package-includes { display: flex; flex-direction: column; gap: 0.4rem; margin-bottom: 1.25rem; }
.package-includes li { display: flex; align-items: center; gap: 0.5rem; font-size: 0.8rem; color: var(--muted-2); }
.package-includes li svg { width: 14px; height: 14px; color: var(--gold); flex-shrink: 0; }
.table-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.875rem; }
.table-detail-item { display: flex; flex-direction: column; gap: 0.25rem; }
.table-detail-item.full-span { grid-column: span 2; }
.table-detail-item .label { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted-2); }
.bottle-list { display: flex; flex-wrap: wrap; gap: 0.375rem; margin-top: 0.25rem; }
.bottle-chip { background: var(--gold-dim); border: 1px solid var(--gold); border-radius: 4px; padding: 0.2rem 0.5rem; font-size: 0.75rem; color: var(--gold); }

/* ─── ANALYTICS ─── */
.analytics-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.25rem; }
.chart-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.5rem; }
.chart-card.wide { grid-column: span 2; }
.chart-title { font-size: 0.875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted-2); margin-bottom: 1rem; }
.chart-container { height: 260px; }
.ticket-breakdown-list { display: flex; flex-direction: column; gap: 0.75rem; }
.breakdown-row { display: flex; align-items: center; gap: 0.75rem; }
.breakdown-name { width: 120px; font-size: 0.8rem; flex-shrink: 0; }
.breakdown-bar-wrap { flex: 1; background: var(--surface-2); border-radius: 999px; height: 8px; }
.breakdown-bar { height: 100%; background: var(--gold); border-radius: 999px; }
.breakdown-val { width: 60px; font-size: 0.75rem; color: var(--muted-2); text-align: right; }
.breakdown-rev { width: 60px; text-align: right; font-size: 0.8rem; }
.funnel { display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem; }
.funnel-step { }
.funnel-bar { background: var(--surface-2); border-radius: var(--radius-sm); padding: 0.5rem 0.875rem; display: flex; justify-content: space-between; font-size: 0.8rem; font-weight: 600; min-width: 40%; transition: width 0.5s ease; }
.checkin-rate-big { display: flex; flex-direction: column; align-items: center; gap: 0.25rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.demo-bars { display: flex; flex-direction: column; gap: 0.75rem; }
.demo-row { display: flex; align-items: center; gap: 0.75rem; }
.demo-label { width: 48px; font-size: 0.8rem; color: var(--muted-2); }
.demo-bar-wrap { flex: 1; background: var(--surface-2); border-radius: 999px; height: 8px; }
.demo-bar { height: 100%; background: var(--purple); border-radius: 999px; }
.demo-pct { width: 36px; text-align: right; font-size: 0.75rem; }
.promo-perf-list { display: flex; flex-direction: column; gap: 0.625rem; }
.promo-perf-row { display: flex; align-items: center; gap: 0.625rem; }
.promo-perf-name { width: 100px; font-size: 0.8rem; }
.promo-perf-bar-wrap { flex: 1; background: var(--surface-2); border-radius: 999px; height: 8px; }
.promo-perf-bar { height: 100%; background: var(--gold); border-radius: 999px; }
.rev-split { display: flex; flex-direction: column; gap: 0.875rem; }
.rev-split-row { display: flex; align-items: center; gap: 0.625rem; }
.rev-split-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.rev-split-bar-wrap { flex: 1; background: var(--surface-2); border-radius: 999px; height: 8px; }
.rev-split-bar { height: 100%; border-radius: 999px; }
.metrics-list { display: flex; flex-direction: column; gap: 0.5rem; }
.metric-row { display: flex; align-items: center; gap: 0.75rem; padding: 0.5rem 0; border-bottom: 1px solid var(--border); }
.metric-row:last-child { border-bottom: none; }
.metric-icon { width: 16px; height: 16px; color: var(--gold); flex-shrink: 0; }
.metric-label { flex: 1; font-size: 0.8rem; color: var(--muted-2); }
.metric-val { font-size: 0.875rem; font-weight: 600; }

/* ─── DISCOVERY ─── */
.discovery-page { background: var(--black); }
.discovery-nav {
  display: flex; align-items: center; gap: 1.5rem;
  padding: 1rem 2rem;
  background: rgba(10,10,10,0.9);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border);
  position: sticky; top: 0; z-index: 100;
}
.discovery-search-bar {
  flex: 1; max-width: 500px;
  display: flex; align-items: center; gap: 0.5rem;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: 999px; padding: 0.5rem 1rem;
}
.discovery-search-bar svg { width: 16px; height: 16px; color: var(--muted); }
.discovery-search-input { background: none; border: none; outline: none; color: var(--text); font-size: 0.875rem; flex: 1; }
.discovery-nav-right { display: flex; gap: 0.75rem; margin-left: auto; }
.discovery-hero {
  height: 300px;
  background: linear-gradient(135deg, var(--navy-dark) 0%, var(--navy) 50%, #0d1f3c 100%);
  display: flex; align-items: center; justify-content: center; text-align: center;
  position: relative;
}
.discovery-hero::before {
  content: '';
  position: absolute; inset: 0;
  background: url('https://images.unsplash.com/photo-1516450360452-9312f5e86fc7?w=1200&q=80') center/cover;
  opacity: 0.15;
}
.discovery-hero-content { position: relative; }
.discovery-hero-content h1 { font-size: 2.5rem; font-weight: 900; margin-bottom: 0.75rem; }
.discovery-hero-content p { color: var(--muted-2); margin-bottom: 1.5rem; }
.discovery-filters { display: flex; gap: 0.75rem; justify-content: center; flex-wrap: wrap; }
.filter-select {
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: 999px;
  color: var(--text);
  padding: 0.5rem 1rem;
  font-size: 0.85rem;
  outline: none;
}
.filter-select:focus { border-color: var(--gold); }
.filter-select.sm { border-radius: var(--radius-sm); background: var(--surface-2); border-color: var(--border); }
.discovery-main { max-width: 1400px; margin: 0 auto; padding: 2rem 2.5rem 5rem; }
.category-filters { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 2rem; }
.category-pill {
  padding: 0.5rem 1rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--surface);
  font-size: 0.8rem; font-weight: 600;
  color: var(--muted-2);
  transition: all var(--transition);
}
.category-pill:hover { border-color: var(--gold); color: var(--gold); }
.category-pill.active { background: var(--gold); color: #000; border-color: var(--gold); }
.discovery-section { margin-bottom: 3rem; }
.discovery-section-title { font-size: 1.25rem; font-weight: 700; margin-bottom: 1.25rem; }
.discovery-feat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.disc-feat-card {
  height: 360px; border-radius: var(--radius);
  background-size: cover; background-position: center;
  cursor: pointer; position: relative; overflow: hidden;
  transition: transform var(--transition);
}
.disc-feat-card:hover { transform: scale(1.02); }
.disc-feat-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.2) 60%, transparent 100%);
  display: flex; flex-direction: column; justify-content: space-between; padding: 1.25rem;
}
.disc-feat-top { display: flex; gap: 0.5rem; }
.disc-feat-bottom h3 { font-size: 1.25rem; font-weight: 700; margin-bottom: 0.375rem; }
.disc-feat-meta { display: flex; gap: 1rem; font-size: 0.8rem; color: var(--muted-2); margin-bottom: 0.75rem; }
.disc-feat-footer { display: flex; justify-content: space-between; align-items: center; }
.discovery-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1.25rem; }
.disc-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; cursor: pointer; transition: all var(--transition); }
.disc-card:hover { border-color: var(--gold); transform: translateY(-2px); }
.disc-card-img { height: 180px; background-size: cover; background-position: center; position: relative; }
.disc-card-type { position: absolute; top: 0.5rem; left: 0.5rem; background: rgba(0,0,0,0.7); border: 1px solid var(--border); border-radius: 999px; padding: 0.15rem 0.5rem; font-size: 0.7rem; color: var(--muted-2); text-transform: capitalize; }
.sold-out-ribbon { position: absolute; top: 0.5rem; right: 0.5rem; background: var(--red); border-radius: 999px; padding: 0.15rem 0.5rem; font-size: 0.65rem; font-weight: 700; color: white; }
.disc-card-body { padding: 1rem; }
.disc-card-title { font-size: 0.95rem; font-weight: 700; margin-bottom: 0.5rem; }
.disc-card-meta { display: flex; flex-direction: column; gap: 0.2rem; font-size: 0.8rem; color: var(--muted-2); margin-bottom: 0.75rem; }
.disc-card-meta svg { width: 12px; height: 12px; }
.disc-card-footer { display: flex; justify-content: space-between; align-items: center; }
.disc-card-price { font-size: 0.95rem; font-weight: 700; color: var(--gold); }
.cities-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.city-card { height: 160px; border-radius: var(--radius); background-size: cover; background-position: center; cursor: pointer; overflow: hidden; position: relative; transition: transform var(--transition); }
.city-card:hover { transform: scale(1.03); }
.city-card-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, transparent 60%); display: flex; flex-direction: column; justify-content: flex-end; padding: 1rem; }
.city-name { font-weight: 700; font-size: 1.1rem; }
.city-count { font-size: 0.75rem; color: var(--muted-2); }
.sort-group { }

/* ─── HOST PROFILE ─── */
.profile-hero { position: relative; height: 380px; overflow: hidden; }
.profile-hero-bg { position: absolute; inset: 0; background-size: cover; background-position: center; filter: blur(3px); opacity: 0.3; }
.profile-hero-bg::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(10,10,10,0.95) 0%, rgba(10,10,10,0.5) 100%); }
.profile-hero-content { position: relative; max-width: 1100px; margin: 0 auto; padding: 2rem 2.5rem; display: flex; align-items: flex-end; gap: 2rem; height: 100%; }
.profile-avatar-wrap { position: relative; flex-shrink: 0; }
.profile-avatar { width: 96px; height: 96px; border-radius: 50%; background: var(--gold); color: #000; display: flex; align-items: center; justify-content: center; font-size: 2rem; font-weight: 900; border: 4px solid var(--surface); }
.profile-avatar-lg { width: 80px; height: 80px; border-radius: 50%; background: var(--gold); color: #000; display: flex; align-items: center; justify-content: center; font-size: 1.75rem; font-weight: 900; }
.profile-verified { position: absolute; bottom: 0; right: 0; width: 24px; height: 24px; background: var(--green); border-radius: 50%; border: 2px solid var(--surface); display: flex; align-items: center; justify-content: center; }
.profile-verified svg { width: 14px; height: 14px; color: white; }
.profile-info { flex: 1; }
.profile-info h1 { font-size: 1.75rem; font-weight: 900; }
.profile-handle { color: var(--muted-2); font-size: 0.875rem; margin-bottom: 0.5rem; }
.profile-bio { color: var(--muted-2); font-size: 0.875rem; max-width: 500px; margin-bottom: 0.75rem; }
.profile-tags { display: flex; flex-wrap: wrap; gap: 0.375rem; margin-bottom: 1rem; }
.profile-stats { display: flex; gap: 2rem; }
.profile-stat { display: flex; flex-direction: column; }
.profile-stat-val { font-size: 1.25rem; font-weight: 700; }
.profile-stat-lbl { font-size: 0.7rem; color: var(--muted-2); }
.profile-actions { display: flex; gap: 0.5rem; align-items: flex-end; flex-shrink: 0; }
.profile-body { max-width: 1100px; margin: 0 auto; padding: 2rem 2.5rem 5rem; }
.profile-tabs { display: flex; gap: 0.25rem; border-bottom: 1px solid var(--border); margin-bottom: 1.5rem; }
.profile-tab { padding: 0.875rem 1.25rem; border: none; background: transparent; color: var(--muted-2); font-size: 0.9rem; font-weight: 600; border-bottom: 2px solid transparent; transition: all var(--transition); margin-bottom: -1px; }
.profile-tab.active { color: var(--gold); border-bottom-color: var(--gold); }
.profile-events-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 1.25rem; }
.profile-event-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; cursor: pointer; transition: all var(--transition); }
.profile-event-card:hover { border-color: var(--gold); transform: translateY(-2px); }
.profile-event-img { height: 150px; background-size: cover; background-position: center; display: flex; align-items: flex-start; padding: 0.75rem; }
.profile-event-body { padding: 1rem; }
.profile-event-body h3 { font-weight: 700; font-size: 0.95rem; margin-bottom: 0.375rem; }
.reviews-list { display: flex; flex-direction: column; gap: 1rem; }
.review-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.25rem; }
.review-header { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.75rem; }
.review-stars { margin-left: auto; font-size: 0.875rem; }
.review-text { font-size: 0.875rem; color: var(--muted-2); line-height: 1.6; font-style: italic; }
.about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.about-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.5rem; }
.about-card h3 { font-weight: 700; margin-bottom: 0.875rem; }
.about-card p { color: var(--muted-2); font-size: 0.875rem; line-height: 1.6; }
.brand-logos { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.brand-chip { background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 0.375rem 0.75rem; font-size: 0.8rem; }
.contact-list { display: flex; flex-direction: column; gap: 0.625rem; }
.contact-row { display: flex; align-items: center; gap: 0.625rem; font-size: 0.875rem; color: var(--muted-2); }
.contact-row svg { width: 16px; height: 16px; color: var(--gold); }

/* ─── CHECK-IN PAGE ─── */
.checkin-page { background: var(--black); min-height: 100vh; display: flex; flex-direction: column; }
.checkin-header { display: flex; align-items: center; gap: 1rem; padding: 1rem 1.5rem; background: var(--surface); border-bottom: 1px solid var(--border); position: sticky; top: 0; z-index: 100; }
.checkin-title-block { flex: 1; }
.checkin-event-name { font-weight: 700; font-size: 0.95rem; }
.checkin-date { font-size: 0.75rem; }
.checkin-stats { display: flex; align-items: center; justify-content: space-around; background: var(--surface); padding: 1rem; border-bottom: 1px solid var(--border); }
.checkin-stat { display: flex; flex-direction: column; align-items: center; gap: 0.25rem; }
.checkin-stat-val { font-size: 2rem; font-weight: 800; }
.checkin-stat-lbl { font-size: 0.7rem; color: var(--muted-2); text-transform: uppercase; letter-spacing: 0.06em; }
.checkin-stat-div { width: 1px; height: 40px; background: var(--border); }
.checkin-progress-wrap { padding: 1rem 1.5rem; background: var(--surface); border-bottom: 1px solid var(--border); }
.checkin-progress { background: var(--surface-3); height: 8px; border-radius: 999px; overflow: hidden; }
.checkin-progress-bar { height: 100%; background: linear-gradient(90deg, var(--gold), #F5D788); border-radius: 999px; transition: width 0.5s ease; }
.checkin-progress-label { font-size: 0.75rem; color: var(--muted-2); text-align: right; margin-top: 0.375rem; }
.scanner-section { padding: 1.5rem; }
.scanner-area { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 2rem; display: flex; justify-content: center; margin-bottom: 1rem; }
.scanner-frame { position: relative; width: 220px; height: 220px; display: flex; align-items: center; justify-content: center; }
.scanner-corner { position: absolute; width: 24px; height: 24px; border-color: var(--gold); border-style: solid; }
.scanner-corner.tl { top: 0; left: 0; border-width: 3px 0 0 3px; border-radius: 4px 0 0 0; }
.scanner-corner.tr { top: 0; right: 0; border-width: 3px 3px 0 0; border-radius: 0 4px 0 0; }
.scanner-corner.bl { bottom: 0; left: 0; border-width: 0 0 3px 3px; border-radius: 0 0 0 4px; }
.scanner-corner.br { bottom: 0; right: 0; border-width: 0 3px 3px 0; border-radius: 0 0 4px 0; }
.scanner-line { position: absolute; width: 80%; height: 2px; background: linear-gradient(90deg, transparent, var(--gold), transparent); animation: scan 2s ease-in-out infinite; }
@keyframes scan { 0%,100% { top: 20%; } 50% { top: 80%; } }
.scanner-label { position: absolute; bottom: -24px; font-size: 0.7rem; color: var(--muted-2); white-space: nowrap; }
.scanner-btn { margin-bottom: 1rem; }
.scan-result { padding: 1rem; border-radius: var(--radius); text-align: center; }
.checkin-search-section { padding: 0 1.5rem 1rem; }
.checkin-search-bar { display: flex; align-items: center; gap: 0.5rem; background: var(--surface); border: 1px solid var(--border); border-radius: 999px; padding: 0.625rem 1rem; }
.checkin-search-bar svg { width: 16px; height: 16px; color: var(--muted); flex-shrink: 0; }
.checkin-search-input { background: none; border: none; outline: none; color: var(--text); font-size: 0.875rem; flex: 1; }
.checkin-guest-list { flex: 1; overflow-y: auto; padding: 0 1rem 5rem; }
.checkin-guest-row {
  display: flex; align-items: center; gap: 0.875rem;
  padding: 0.875rem 0.5rem;
  border-bottom: 1px solid var(--border);
  transition: background var(--transition);
}
.checkin-guest-row:hover { background: var(--surface-2); }
.checkin-guest-row.checked-in { opacity: 0.6; }
.ci-avatar { width: 38px; height: 38px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.75rem; font-weight: 700; flex-shrink: 0; }
.ci-info { flex: 1; min-width: 0; }
.ci-name { font-weight: 600; font-size: 0.9rem; }
.ci-ticket { }
.ci-promoter { }
.ci-time { width: 60px; text-align: center; flex-shrink: 0; }
.ci-status { width: 100px; display: flex; justify-content: flex-end; flex-shrink: 0; }
.ci-status svg { width: 22px; height: 22px; }
.text-green svg { color: var(--green) !important; }
.text-red svg { color: var(--red) !important; }
.checkin-modal {
  position: fixed; inset: 0;
  background: rgba(0,0,0,0.8);
  display: flex; align-items: center; justify-content: center;
  z-index: 1000;
}
.checkin-modal-content {
  background: var(--surface);
  border: 1px solid var(--gold);
  border-radius: var(--radius-lg);
  padding: 2.5rem 2rem;
  text-align: center;
  max-width: 320px; width: 100%;
}
.checkin-success-icon { width: 80px; height: 80px; border-radius: 50%; background: rgba(34,197,94,0.15); border: 3px solid var(--green); display: flex; align-items: center; justify-content: center; font-size: 2.5rem; color: var(--green); margin: 0 auto 1rem; }
.checkin-success-name { font-size: 1.4rem; font-weight: 800; margin-bottom: 0.25rem; }
.checkin-success-ticket { color: var(--gold); font-size: 0.875rem; margin-bottom: 0.5rem; }
.checkin-success-plus { color: var(--muted-2); font-size: 0.8rem; margin-bottom: 1.25rem; }

/* ─── PHOTO ALBUM ─── */
.photo-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.875rem; }
.photo-card { position: relative; overflow: hidden; border-radius: var(--radius-sm); cursor: pointer; aspect-ratio: 1; }
.photo-card.featured { grid-column: span 2; grid-row: span 2; aspect-ratio: auto; }
.photo-card img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition); }
.photo-card:hover img { transform: scale(1.04); }
.photo-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.8) 0%, transparent 50%); opacity: 0; transition: opacity var(--transition); display: flex; flex-direction: column; justify-content: flex-end; padding: 0.875rem; }
.photo-card:hover .photo-overlay { opacity: 1; }
.photo-caption { font-size: 0.8rem; font-weight: 600; margin-bottom: 0.375rem; }
.photo-meta { display: flex; justify-content: space-between; align-items: center; font-size: 0.75rem; }
.photo-uploader { color: var(--muted-2); display: flex; align-items: center; gap: 0.25rem; }
.photo-uploader svg { width: 12px; height: 12px; }
.photo-like { background: none; border: none; color: var(--muted-2); display: flex; align-items: center; gap: 0.25rem; font-size: 0.75rem; transition: color var(--transition); }
.photo-like:hover, .photo-like.liked { color: var(--red); }
.photo-like svg { width: 14px; height: 14px; }
.photo-upload-slot { aspect-ratio: 1; border: 2px dashed var(--border); border-radius: var(--radius-sm); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.5rem; cursor: pointer; color: var(--muted); transition: all var(--transition); font-size: 0.8rem; }
.photo-upload-slot:hover { border-color: var(--gold); color: var(--gold); }
.photo-upload-slot svg { width: 28px; height: 28px; }
.album-toolbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.25rem; }
.view-toggle { display: flex; gap: 0.25rem; }
.lightbox { position: fixed; inset: 0; background: rgba(0,0,0,0.95); z-index: 2000; display: flex; align-items: center; justify-content: center; }
.lightbox-close { position: absolute; top: 1.5rem; right: 1.5rem; width: 44px; height: 44px; border-radius: 50%; background: rgba(255,255,255,0.1); border: none; color: white; display: flex; align-items: center; justify-content: center; }
.lightbox-close svg { width: 20px; height: 20px; }
.lightbox-nav { position: absolute; width: 52px; height: 52px; border-radius: 50%; background: rgba(255,255,255,0.1); border: none; color: white; display: flex; align-items: center; justify-content: center; transition: background var(--transition); }
.lightbox-nav:hover { background: rgba(255,255,255,0.2); }
.lightbox-nav.prev { left: 1.5rem; }
.lightbox-nav.next { right: 1.5rem; }
.lightbox-nav svg { width: 24px; height: 24px; }
.lightbox-content { max-width: 80vw; display: flex; flex-direction: column; align-items: center; gap: 1rem; }
.lightbox-content img { max-height: 80vh; max-width: 100%; border-radius: var(--radius); object-fit: contain; }
.lightbox-info { text-align: center; }
.lightbox-caption { font-size: 1rem; font-weight: 600; }
.recap-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
.recap-hero { height: 200px; background-size: cover; background-position: center; position: relative; display: flex; align-items: flex-end; }
.recap-hero-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.8) 0%, transparent 60%); padding: 1.5rem; display: flex; flex-direction: column; justify-content: flex-end; }
.recap-hero-overlay h2 { font-size: 1.25rem; font-weight: 800; }
.recap-highlights { display: grid; grid-template-columns: repeat(4, 1fr); padding: 1.5rem; gap: 1rem; border-bottom: 1px solid var(--border); }
.recap-stat { display: flex; flex-direction: column; align-items: center; gap: 0.25rem; }
.recap-actions { display: flex; gap: 0.75rem; padding: 1.25rem; justify-content: flex-end; }
.photo-list { display: flex; flex-direction: column; gap: 0.5rem; }

/* ─── SETTINGS ─── */
.settings-layout { display: grid; grid-template-columns: 200px 1fr; gap: 2rem; align-items: start; }
.settings-nav { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 0.75rem; display: flex; flex-direction: column; gap: 0.25rem; position: sticky; top: 1rem; }
.settings-nav-item { text-align: left; padding: 0.625rem 0.875rem; border-radius: var(--radius-sm); background: transparent; border: none; color: var(--muted-2); font-size: 0.875rem; font-weight: 500; transition: all var(--transition); }
.settings-nav-item:hover { background: var(--surface-3); color: var(--text); }
.settings-nav-item.active { background: var(--gold-dim); color: var(--gold); }
.settings-content { }
.settings-panel-title { font-size: 1.125rem; font-weight: 700; margin-bottom: 1.5rem; padding-bottom: 0.875rem; border-bottom: 1px solid var(--border); }
.profile-edit-section { display: grid; grid-template-columns: auto 1fr; gap: 2rem; }
.profile-edit-avatar { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; }
.team-list { display: flex; flex-direction: column; gap: 0.5rem; }
.team-member-row { display: flex; align-items: center; gap: 1rem; padding: 0.875rem; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); }
.team-member-info { flex: 1; }
.team-member-role { }
.roles-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
.role-card { background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.25rem; }
.role-card-title { font-weight: 700; font-size: 0.9rem; margin-bottom: 0.875rem; color: var(--gold); }
.role-perms { display: flex; flex-direction: column; gap: 0.4rem; }
.role-perms li { display: flex; align-items: center; gap: 0.5rem; font-size: 0.8rem; color: var(--muted-2); }
.role-perms li svg { width: 12px; height: 12px; flex-shrink: 0; }
.payment-settings-section { display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1.5rem; }
.payment-method-row { display: flex; align-items: center; gap: 1rem; padding: 1rem; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); }
.payment-method-row.connected { border-color: var(--green); }
.payment-method-row svg { width: 24px; height: 24px; }
.payment-method-row > div { flex: 1; }
.notif-list { display: flex; flex-direction: column; }
.integrations-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.integration-card { display: flex; align-items: center; gap: 0.875rem; padding: 1rem; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); }
.integration-icon { width: 24px; height: 24px; color: var(--gold); flex-shrink: 0; }
.integration-info { flex: 1; }
.bank-row { display: flex; gap: 0.5rem; }
.color-pickers { display: flex; flex-direction: column; gap: 0.5rem; }
.color-pick-row { display: flex; align-items: center; gap: 0.75rem; font-size: 0.875rem; }
.color-pick-row input[type=color] { width: 40px; height: 32px; border-radius: 4px; border: 1px solid var(--border); background: none; cursor: pointer; }
.billing-plan-card { max-width: 400px; background: linear-gradient(135deg, var(--surface-2) 0%, var(--navy) 100%); border: 1px solid var(--gold); border-radius: var(--radius-lg); padding: 2rem; }
.billing-plan-badge { display: inline-block; padding: 0.25rem 0.75rem; background: var(--gold); color: #000; border-radius: 999px; font-size: 0.7rem; font-weight: 800; letter-spacing: 0.1em; margin-bottom: 1rem; }
.billing-plan-price { font-size: 1.25rem; margin-bottom: 1.5rem; }
.billing-plan-features { display: flex; flex-direction: column; gap: 0.625rem; margin-bottom: 1.5rem; }
.billing-feature { display: flex; align-items: center; gap: 0.625rem; font-size: 0.875rem; }
.billing-feature svg { width: 16px; height: 16px; color: var(--green); flex-shrink: 0; }

/* ─── WAITLIST ─── */
.waitlist-item { display: flex; align-items: center; gap: 1rem; padding: 0.875rem; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); }
.waitlist-info { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.waitlist-actions { display: flex; gap: 0.5rem; }

/* ─── RESPONSIVE ─── */
@media (max-width: 1024px) {
  .main-content { margin-left: 0; padding: 1.5rem 1.25rem 6rem; }
  .sidebar { display: none; }
  .mobile-nav { display: flex; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .quick-actions { grid-template-columns: repeat(3, 1fr); }
  .two-col-grid { grid-template-columns: 1fr; }
  .event-detail-layout { grid-template-columns: 1fr; }
  .event-detail-sidebar { order: -1; }
  .create-layout { grid-template-columns: 1fr; }
  .create-preview { display: none; }
  .checkout-layout { grid-template-columns: 1fr; }
  .analytics-grid { grid-template-columns: 1fr; }
  .chart-card.wide { grid-column: 1; }
  .settings-layout { grid-template-columns: 1fr; }
  .settings-nav { flex-direction: row; flex-wrap: wrap; position: static; }
  .discovery-feat-grid { grid-template-columns: 1fr; }
  .cities-grid { grid-template-columns: repeat(2, 1fr); }
  .hero-title { font-size: 2.5rem; }
  .features-grid { grid-template-columns: 1fr 1fr; }
  .cards-grid-3 { grid-template-columns: 1fr 1fr; }
  .packages-grid { grid-template-columns: 1fr; }
  .table-cards-grid { grid-template-columns: repeat(2, 1fr); }
  .profile-hero-content { flex-direction: column; align-items: flex-start; gap: 1rem; }
  .about-grid { grid-template-columns: 1fr; }
  .roles-grid { grid-template-columns: 1fr; }
  .event-type-grid { grid-template-columns: repeat(3, 1fr); }
  .photo-grid { grid-template-columns: repeat(2, 1fr); }
  .photo-card.featured { grid-column: span 1; grid-row: span 1; }
  .recap-highlights { grid-template-columns: repeat(2, 1fr); }
  .leaderboard-stats { gap: 0.75rem; }
  .integrations-grid { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .hero-title { font-size: 2rem; }
  .hero-cta { flex-direction: column; align-items: center; }
  .stats-grid { grid-template-columns: 1fr 1fr; }
  .stats-grid-4 { grid-template-columns: repeat(2, 1fr); }
  .quick-actions { grid-template-columns: repeat(3, 1fr); }
  .page-header { flex-direction: column; }
  .event-row { grid-template-columns: 48px 1fr auto; }
  .event-row-stats, .event-row-status, .event-row-actions { display: none; }
  .table-toolbar { flex-direction: column; align-items: stretch; }
  .form-row-2, .form-row-3 { grid-template-columns: 1fr; }
  .features-grid { grid-template-columns: 1fr; }
  .cards-grid-3 { grid-template-columns: 1fr; }
  .event-type-grid { grid-template-columns: repeat(2, 1fr); }
  .discovery-hero-content h1 { font-size: 1.75rem; }
  .profile-stats { gap: 1rem; }
  .photo-grid { grid-template-columns: repeat(2, 1fr); }
  .checkin-stats { gap: 0; }
  .leaderboard-stats { display: none; }
  .cities-grid { grid-template-columns: 1fr 1fr; }
  .checkout-layout { padding: 1rem; }
}

/* ============================================================
   NEW SIDEBAR PILLAR STRUCTURE
   ============================================================ */
.sidebar-tagline {
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--gold);
  opacity: 0.7;
  margin-top: -0.25rem;
  margin-bottom: 0.5rem;
}
.sidebar-body {
  flex: 1;
  overflow-y: auto;
  padding: 0.5rem 0 1rem;
  scrollbar-width: none;
}
.sidebar-body::-webkit-scrollbar { display: none; }
.sidebar-pillar { margin-bottom: 0.25rem; }
.sidebar-pillar-label {
  font-size: 0.6rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--muted);
  padding: 0.75rem 1.25rem 0.3rem;
  opacity: 0.6;
}

/* ============================================================
   ARTIST ROSTER PAGE
   ============================================================ */
.artist-roster-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 1.25rem;
}
.artist-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  cursor: pointer;
  transition: transform 0.2s, box-shadow 0.2s;
}
.artist-card:hover { transform: translateY(-3px); box-shadow: 0 8px 32px rgba(201,168,76,0.15); }
.artist-card-cover {
  height: 160px;
  background-size: cover;
  background-position: center;
  position: relative;
}
.artist-card-cover-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.8) 0%, transparent 60%);
}
.artist-card-cover-info {
  position: absolute;
  bottom: 0.75rem;
  left: 0.75rem;
  right: 0.75rem;
  display: flex;
  align-items: flex-end;
  gap: 0.5rem;
}
.artist-card-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 2px solid var(--gold);
  background: var(--surface-2);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  flex-shrink: 0;
}
.artist-card-name { font-weight: 700; font-size: 0.95rem; color: #fff; }
.artist-card-genre { font-size: 0.7rem; color: rgba(255,255,255,0.7); }
.artist-card-body { padding: 0.875rem 1rem 1rem; }
.artist-card-stats {
  display: flex;
  gap: 1rem;
  margin-bottom: 0.875rem;
}
.artist-stat { display: flex; flex-direction: column; gap: 0.1rem; }
.artist-stat .label { font-size: 0.65rem; color: var(--muted); text-transform: uppercase; letter-spacing: 0.08em; }
.booking-requests-summary {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.booking-req-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.625rem 0.75rem;
  background: var(--surface-2);
  border-radius: 8px;
}
.booking-req-artist { font-size: 0.75rem; font-weight: 600; min-width: 90px; }
.booking-req-event { flex: 1; font-size: 0.7rem; color: var(--muted); }
.booking-req-budget { font-size: 0.75rem; color: var(--gold); font-weight: 600; }

/* ============================================================
   ARTIST EPK PAGE (public, no sidebar)
   ============================================================ */
.epk-page { min-height: 100vh; background: var(--bg); }
.epk-hero {
  position: relative;
  height: 480px;
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: flex-end;
}
.epk-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.92) 0%, rgba(0,0,0,0.3) 60%, transparent 100%);
}
.epk-hero-content {
  position: relative;
  z-index: 1;
  padding: 2.5rem;
  width: 100%;
}
.epk-genre-tag {
  display: inline-block;
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--gold);
  border: 1px solid var(--gold);
  padding: 0.2rem 0.6rem;
  border-radius: 999px;
  margin-bottom: 0.5rem;
}
.epk-artist-name { font-size: 3rem; font-weight: 900; color: #fff; line-height: 1; margin-bottom: 0.25rem; }
.epk-location { color: rgba(255,255,255,0.6); font-size: 0.85rem; }
.epk-stats-strip {
  display: flex;
  gap: 0;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
}
.epk-stat-item {
  flex: 1;
  padding: 1rem;
  text-align: center;
  border-right: 1px solid var(--border);
}
.epk-stat-item:last-child { border-right: none; }
.epk-stat-value { font-size: 1.3rem; font-weight: 800; color: var(--gold); }
.epk-stat-label { font-size: 0.65rem; color: var(--muted); text-transform: uppercase; letter-spacing: 0.08em; margin-top: 0.15rem; }
.epk-cta-bar {
  display: flex;
  gap: 0.75rem;
  padding: 1rem 2rem;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
  flex-wrap: wrap;
}
.epk-social-bar {
  display: flex;
  gap: 0.5rem;
  padding: 0.75rem 2rem;
  background: var(--surface-2);
  border-bottom: 1px solid var(--border);
}
.epk-social-link {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.75rem;
  color: var(--muted);
  text-decoration: none;
  padding: 0.3rem 0.6rem;
  border-radius: 6px;
  transition: color 0.2s, background 0.2s;
}
.epk-social-link:hover { color: var(--gold); background: rgba(201,168,76,0.1); }
.epk-section { padding: 2rem; max-width: 1100px; margin: 0 auto; }
.epk-section-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--gold);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-bottom: 1.25rem;
  border-bottom: 1px solid var(--border);
  padding-bottom: 0.5rem;
}
.epk-bio-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 2rem; }
.platform-stats-row { display: flex; flex-direction: column; gap: 0.75rem; }
.platform-stat-card {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 1rem;
  background: var(--surface-2);
  border-radius: 10px;
  border: 1px solid var(--border);
}
.platform-stat-icon { font-size: 1.1rem; }
.platform-stat-info { flex: 1; }
.platform-stat-name { font-size: 0.75rem; font-weight: 600; }
.platform-stat-count { font-size: 0.7rem; color: var(--gold); }
.epk-releases-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1rem; }
.epk-release-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
}
.epk-release-art {
  aspect-ratio: 1;
  background-size: cover;
  background-position: center;
  background-color: var(--surface-2);
  position: relative;
}
.epk-release-play {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.4);
  opacity: 0;
  transition: opacity 0.2s;
}
.epk-release-card:hover .epk-release-play { opacity: 1; }
.epk-release-info { padding: 0.75rem; }
.epk-release-title { font-size: 0.85rem; font-weight: 600; }
.epk-release-meta { font-size: 0.7rem; color: var(--muted); }
.epk-release-streams { font-size: 0.75rem; color: var(--gold); font-weight: 600; margin-top: 0.25rem; }
.epk-release-platforms { display: flex; gap: 0.4rem; margin-top: 0.5rem; flex-wrap: wrap; }
.performances-list { display: flex; flex-direction: column; gap: 0.75rem; }
.performance-row {
  display: flex;
  gap: 1rem;
  align-items: center;
  padding: 0.875rem 1rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
}
.performance-date-block {
  text-align: center;
  min-width: 48px;
  background: var(--gold);
  color: #000;
  border-radius: 8px;
  padding: 0.4rem 0.5rem;
}
.performance-date-block .month { font-size: 0.6rem; font-weight: 700; text-transform: uppercase; }
.performance-date-block .day { font-size: 1.3rem; font-weight: 900; line-height: 1; }
.performance-info { flex: 1; }
.performance-venue { font-weight: 600; font-size: 0.875rem; }
.performance-city { font-size: 0.75rem; color: var(--muted); }
.rider-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.rider-section-title { font-weight: 700; font-size: 0.85rem; margin-bottom: 0.75rem; color: var(--gold); }
.rider-list { list-style: none; display: flex; flex-direction: column; gap: 0.4rem; }
.rider-list li { font-size: 0.8rem; color: var(--muted); display: flex; align-items: center; gap: 0.5rem; }
.rider-list li::before { content: '✦'; color: var(--gold); font-size: 0.5rem; }
.fee-display {
  background: var(--surface-2);
  border: 1px solid var(--gold);
  border-radius: 10px;
  padding: 1rem;
  text-align: center;
  margin-top: 0.75rem;
}
.fee-display .fee-label { font-size: 0.7rem; color: var(--muted); text-transform: uppercase; letter-spacing: 0.1em; }
.fee-display .fee-amount { font-size: 1.8rem; font-weight: 900; color: var(--gold); }
.press-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1rem; }
.press-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 1rem;
}
.press-card-outlet { font-size: 0.7rem; color: var(--gold); text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 0.25rem; }
.press-card-headline { font-weight: 600; font-size: 0.875rem; line-height: 1.4; margin-bottom: 0.25rem; }
.press-card-date { font-size: 0.7rem; color: var(--muted); }
.epk-download-banner {
  background: linear-gradient(135deg, var(--navy), #1a2550);
  border: 1px solid var(--gold);
  border-radius: 12px;
  padding: 2rem;
  text-align: center;
  margin: 0 2rem 2rem;
}
.epk-booking-cta {
  background: var(--gold);
  color: #000;
  text-align: center;
  padding: 3rem 2rem;
}
.epk-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.875rem 2rem;
  background: rgba(0,0,0,0.95);
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  z-index: 100;
}

/* ============================================================
   ARTIST DASHBOARD
   ============================================================ */
.artist-selector-bar {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.75rem 1rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  margin-bottom: 1.5rem;
}
.pipeline-stages {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
}
.pipeline-stage {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 1rem;
}
.pipeline-stage-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.875rem;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.pipeline-stage-card {
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0.75rem;
  margin-bottom: 0.5rem;
  cursor: pointer;
  transition: border-color 0.2s;
}
.pipeline-stage-card:hover { border-color: var(--gold); }
.pipeline-stage-card .requester { font-weight: 600; font-size: 0.8rem; }
.pipeline-stage-card .event-name { font-size: 0.7rem; color: var(--muted); }
.pipeline-stage-card .card-meta { display: flex; justify-content: space-between; margin-top: 0.4rem; }
.itinerary-list { display: flex; flex-direction: column; gap: 0.5rem; }
.itinerary-row {
  display: flex;
  align-items: center;
  gap: 0.875rem;
  padding: 0.625rem 0.875rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
}
.itinerary-icon {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.itinerary-info { flex: 1; }
.itinerary-title { font-size: 0.8rem; font-weight: 600; }
.itinerary-detail { font-size: 0.7rem; color: var(--muted); }
.itinerary-time { font-size: 0.7rem; color: var(--gold); font-weight: 600; }
.financial-table { width: 100%; border-collapse: collapse; }
.financial-row { display: flex; justify-content: space-between; align-items: center; padding: 0.5rem 0; border-bottom: 1px solid var(--border); }
.financial-row:last-child { border-bottom: none; }
.financial-total { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 0 0; font-weight: 700; }

/* ============================================================
   BOOKING REQUESTS (KANBAN)
   ============================================================ */
.pipeline-board {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  align-items: start;
}
.pipeline-col {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
}
.pipeline-col-header {
  padding: 0.75rem 1rem;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.pipeline-col-body { padding: 0.75rem; display: flex; flex-direction: column; gap: 0.5rem; }
.pipeline-booking-card {
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0.75rem;
  cursor: pointer;
  transition: border-color 0.2s, transform 0.2s;
}
.pipeline-booking-card:hover { border-color: var(--gold); transform: translateY(-1px); }
.pipeline-booking-card .requester-name { font-weight: 700; font-size: 0.8rem; }
.pipeline-booking-card .event-type { font-size: 0.65rem; color: var(--muted); margin-bottom: 0.4rem; }
.pipeline-booking-card .card-footer { display: flex; justify-content: space-between; margin-top: 0.5rem; }

/* ============================================================
   CONTRACTS
   ============================================================ */
.contract-meta-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem;
  margin-bottom: 1rem;
}
.contract-meta-item { background: var(--surface-2); border-radius: 8px; padding: 0.75rem; }
.contract-meta-item .label { font-size: 0.65rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted); margin-bottom: 0.2rem; }
.contract-meta-item .value { font-weight: 600; font-size: 0.9rem; }
.contract-preview {
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 1.25rem;
  font-size: 0.8rem;
  line-height: 1.7;
  color: var(--muted);
  max-height: 280px;
  overflow-y: auto;
}
.contract-preview p { margin-bottom: 0.75rem; }
.contract-preview strong { color: var(--text); }
.templates-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 1rem;
}
.template-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 1.25rem;
  text-align: center;
  cursor: pointer;
  transition: border-color 0.2s, transform 0.2s;
}
.template-card:hover { border-color: var(--gold); transform: translateY(-2px); }
.template-card i { color: var(--gold); margin-bottom: 0.5rem; }
.template-card-name { font-weight: 600; font-size: 0.85rem; margin-bottom: 0.25rem; }
.template-card-desc { font-size: 0.7rem; color: var(--muted); }

/* ============================================================
   RELEASES / MUSIC
   ============================================================ */
.releases-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1.25rem;
}
.release-full-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
}
.release-art-wrap {
  aspect-ratio: 1;
  background-size: cover;
  background-position: center;
  background-color: var(--surface-2);
  position: relative;
}
.release-play-btn {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.45);
  opacity: 0;
  transition: opacity 0.2s;
  font-size: 2rem;
}
.release-full-card:hover .release-play-btn { opacity: 1; }
.release-card-body { padding: 1rem; }
.release-card-title { font-weight: 700; font-size: 0.95rem; margin-bottom: 0.2rem; }
.release-card-artist { font-size: 0.75rem; color: var(--muted); margin-bottom: 0.5rem; }
.release-streams { font-size: 0.85rem; color: var(--gold); font-weight: 700; margin-bottom: 0.5rem; }
.release-platforms { display: flex; gap: 0.4rem; flex-wrap: wrap; margin-bottom: 0.75rem; }
.release-card-actions { display: flex; gap: 0.5rem; }
.smart-link-form { display: grid; grid-template-columns: 1fr 1fr; gap: 0.875rem; }
.presave-list { display: flex; flex-direction: column; gap: 0.75rem; }
.presave-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 1rem;
  display: flex;
  align-items: center;
  gap: 1rem;
}
.presave-art { width: 48px; height: 48px; border-radius: 8px; background-size: cover; background-position: center; background-color: var(--surface-2); flex-shrink: 0; }
.presave-info { flex: 1; }
.presave-title { font-weight: 600; font-size: 0.85rem; }
.presave-artist { font-size: 0.7rem; color: var(--muted); }
.presave-progress { margin-top: 0.4rem; }
.presave-count { font-size: 0.75rem; color: var(--gold); font-weight: 600; }

/* ============================================================
   PAYMENT DASHBOARD
   ============================================================ */
.payout-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.25rem;
  background: linear-gradient(135deg, rgba(201,168,76,0.12), rgba(201,168,76,0.05));
  border: 1px solid rgba(201,168,76,0.4);
  border-radius: 12px;
  margin-bottom: 1.5rem;
  gap: 1rem;
}
.payout-banner-info { display: flex; align-items: center; gap: 0.875rem; }
.rev-breakdown-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.5rem 0;
}
.rev-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.rev-bar-wrap { flex: 1; height: 6px; background: var(--surface-2); border-radius: 999px; overflow: hidden; }
.rev-bar { height: 100%; border-radius: 999px; }
.payout-summary-rows { display: flex; flex-direction: column; gap: 0; }
.payout-sum-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.625rem 0;
  border-bottom: 1px solid var(--border);
}
.payout-sum-total {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.875rem 0 0;
}
.pm-card {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: 10px;
}
.pm-card.connected { border-color: rgba(201,168,76,0.3); }
.pm-info { flex: 1; }
.payment-methods-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; }

/* ============================================================
   CRM / CONTACTS
   ============================================================ */
.contacts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1rem;
}
.contact-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 1rem;
  cursor: pointer;
  transition: border-color 0.2s, transform 0.2s;
}
.contact-card:hover { border-color: var(--gold); transform: translateY(-2px); }
.contact-card-header { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.625rem; }
.contact-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 0.85rem;
  flex-shrink: 0;
}
.contact-card-info { flex: 1; min-width: 0; }
.contact-card-name { font-weight: 700; font-size: 0.875rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.contact-card-type { font-size: 0.7rem; }
.contact-card-notes {
  font-size: 0.75rem;
  line-height: 1.5;
  margin-bottom: 0.5rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.contact-tags { display: flex; flex-wrap: wrap; gap: 0.3rem; margin-bottom: 0.625rem; }
.contact-card-footer { display: flex; justify-content: space-between; align-items: center; }
.contact-detail-header { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.25rem; }
.contact-detail-avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--gold);
  color: #000;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  font-weight: 800;
  flex-shrink: 0;
}
.contact-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.contact-detail-item { background: var(--surface-2); border-radius: 8px; padding: 0.75rem; display: flex; flex-direction: column; gap: 0.2rem; }
.contact-detail-item.full-span { grid-column: 1 / -1; }
.contact-detail-item .label { font-size: 0.65rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted); }
.reminder-list { display: flex; flex-direction: column; gap: 0.5rem; }
.reminder-row {
  display: flex;
  align-items: center;
  gap: 0.875rem;
  padding: 0.75rem 1rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
}
.reminder-row.urgent { border-color: rgba(239,68,68,0.3); background: rgba(239,68,68,0.04); }
.reminder-icon { color: var(--muted); }
.reminder-icon.urgent { color: var(--red, #ef4444); }
.reminder-info { flex: 1; }
.reminder-due { min-width: 60px; text-align: right; }
.stats-grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.75rem; margin-bottom: 1.5rem; }
.stat-card-sm {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 0.875rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.category-filters { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.category-pill {
  padding: 0.3rem 0.875rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 500;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--muted);
  cursor: pointer;
  transition: all 0.2s;
}
.category-pill.active,
.category-pill:hover { border-color: var(--gold); color: var(--gold); background: rgba(201,168,76,0.08); }

/* ============================================================
   CAMPAIGN BUILDER
   ============================================================ */
.campaigns-list { display: flex; flex-direction: column; gap: 0.625rem; }
.campaign-row {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.875rem 1rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
}
.campaign-row-info { display: flex; align-items: center; gap: 0.75rem; flex: 1; min-width: 0; }
.campaign-type-badge {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.campaign-type-badge.email { background: rgba(201,168,76,0.15); color: var(--gold); }
.campaign-type-badge.sms { background: rgba(139,92,246,0.15); color: #8B5CF6; }
.campaign-row-metrics { display: flex; gap: 0.5rem; }
.metric-chip {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: var(--surface-2);
  border-radius: 6px;
  padding: 0.35rem 0.6rem;
  min-width: 48px;
}
.metric-chip span:first-child { font-size: 0.8rem; font-weight: 700; }
.campaign-builder {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 1.5rem;
}
.builder-sidebar { display: flex; flex-direction: column; gap: 0.375rem; }
.builder-step {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.625rem 0.875rem;
  border-radius: 8px;
  font-size: 0.8rem;
  color: var(--muted);
  cursor: pointer;
}
.builder-step span {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--surface-2);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.7rem;
  font-weight: 700;
  flex-shrink: 0;
}
.builder-step.active { background: rgba(201,168,76,0.1); color: var(--gold); }
.builder-step.active span { background: var(--gold); color: #000; }
.builder-content { display: flex; flex-direction: column; gap: 1rem; }
.editor-toolbar {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.5rem;
  background: var(--surface-2);
  border-radius: 8px 8px 0 0;
  border: 1px solid var(--border);
  border-bottom: none;
}
.builder-actions { display: flex; gap: 0.75rem; margin-top: 0.5rem; justify-content: flex-end; }
.campaign-type-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.75rem;
}
.campaign-type-card {
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 1rem;
  text-align: center;
  cursor: pointer;
  transition: border-color 0.2s;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
}
.campaign-type-card i { color: var(--muted); }
.campaign-type-card:hover,
.campaign-type-card.selected { border-color: var(--gold); background: rgba(201,168,76,0.08); }
.campaign-type-card.selected i { color: var(--gold); }
.tab-group { display: flex; gap: 0.25rem; }
.tab {
  padding: 0.3rem 0.875rem;
  border-radius: 6px;
  font-size: 0.78rem;
  font-weight: 500;
  border: 1px solid var(--border);
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  transition: all 0.2s;
}
.tab.active,
.tab:hover { border-color: var(--gold); color: var(--gold); background: rgba(201,168,76,0.08); }

/* ============================================================
   MERCH DASHBOARD
   ============================================================ */
.merch-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1rem; }
.merch-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  transition: transform 0.2s;
}
.merch-card:hover { transform: translateY(-2px); }
.merch-card.low-stock { border-color: rgba(201,168,76,0.5); }
.merch-card-img {
  height: 180px;
  background-size: cover;
  background-position: center;
  background-color: var(--surface-2);
  position: relative;
}
.low-stock-ribbon {
  position: absolute;
  top: 0.5rem;
  right: 0;
  background: var(--gold);
  color: #000;
  font-size: 0.65rem;
  font-weight: 800;
  text-transform: uppercase;
  padding: 0.2rem 0.6rem 0.2rem 0.4rem;
  letter-spacing: 0.06em;
}
.merch-card-body { padding: 0.875rem; }
.merch-card-name { font-weight: 700; font-size: 0.875rem; margin-bottom: 0.2rem; }
.merch-card-sku { margin-bottom: 0.4rem; }
.merch-card-price { font-size: 1rem; margin-bottom: 0.2rem; }
.merch-card-sizes { margin-bottom: 0.625rem; }
.merch-inventory { margin-bottom: 0.75rem; }
.merch-card-actions { display: flex; gap: 0.4rem; }
.code-chip {
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 0.2rem 0.5rem;
  font-family: monospace;
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--gold);
  letter-spacing: 0.05em;
}
.code-chip.large { font-size: 0.85rem; padding: 0.25rem 0.625rem; }
.drops-grid { display: flex; flex-direction: column; gap: 1rem; }
.drop-card {
  display: flex;
  gap: 1.25rem;
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
}
.upcoming-drop { border-color: rgba(201,168,76,0.4); }
.drop-art {
  width: 120px;
  min-height: 120px;
  background-size: cover;
  background-position: center;
  background-color: var(--surface-2);
  flex-shrink: 0;
}
.drop-info { flex: 1; padding: 1rem 0; }
.drop-countdown { font-size: 0.875rem; margin-top: 0.4rem; }
.drop-actions { display: flex; flex-direction: column; gap: 0.5rem; padding: 1rem; flex-shrink: 0; }
.badge-upcoming {
  display: inline-block;
  background: rgba(201,168,76,0.2);
  color: var(--gold);
  border: 1px solid rgba(201,168,76,0.4);
  font-size: 0.6rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  padding: 0.2rem 0.5rem;
  border-radius: 4px;
}

/* ============================================================
   MEDIA STORAGE
   ============================================================ */
.storage-bar-section { margin-bottom: 1.5rem; }
.storage-bar-info { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.5rem; }
.storage-bar-wrap {
  height: 8px;
  background: var(--surface-2);
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid var(--border);
}
.storage-bar { height: 100%; background: var(--gold); border-radius: 999px; }
.folders-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 0.875rem;
}
.folder-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 1.25rem 1rem;
  text-align: center;
  cursor: pointer;
  transition: border-color 0.2s, transform 0.2s;
}
.folder-card:hover,
.folder-card.active { border-color: var(--gold); transform: translateY(-2px); background: rgba(201,168,76,0.05); }
.folder-card.add-folder:hover { border-style: dashed; }
.folder-icon { width: 36px; height: 36px; color: var(--gold); margin: 0 auto 0.5rem; }
.folder-name { font-size: 0.8rem; font-weight: 600; margin-bottom: 0.2rem; }
.folder-count { font-size: 0.68rem; }
.media-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 1rem;
}
.media-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
  cursor: pointer;
  transition: border-color 0.2s, transform 0.2s;
}
.media-card:hover { border-color: var(--gold); transform: translateY(-2px); }
.media-card-thumb {
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
}
.media-approved {
  position: absolute;
  top: 0.4rem;
  right: 0.4rem;
  color: #22c55e;
  background: rgba(0,0,0,0.6);
  border-radius: 50%;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.media-approved i { width: 14px; height: 14px; }
.media-card-info { padding: 0.625rem 0.75rem 0.375rem; }
.media-card-name { font-size: 0.78rem; font-weight: 600; margin-bottom: 0.2rem; }
.media-card-meta { font-size: 0.68rem; }
.media-card-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.25rem;
  padding: 0.25rem 0.5rem 0.5rem;
}
.file-meta-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; }
.file-meta-item { background: var(--surface-2); border-radius: 6px; padding: 0.625rem; }
.file-meta-item .label { display: block; font-size: 0.62rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted); margin-bottom: 0.15rem; }
.upload-zone {
  border: 2px dashed var(--border);
  border-radius: 10px;
  padding: 2rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  color: var(--muted);
  cursor: pointer;
  transition: border-color 0.2s;
}
.upload-zone:hover { border-color: var(--gold); }
.upload-zone i { width: 40px; height: 40px; color: var(--gold); }
.upload-zone.compact { padding: 1rem; flex-direction: row; gap: 0.5rem; }
.upload-zone.compact i { width: 20px; height: 20px; }
.view-toggle { display: flex; gap: 0.25rem; }

/* ============================================================
   RESPONSIVE — new pages
   ============================================================ */
@media (max-width: 1024px) {
  .pipeline-board { grid-template-columns: repeat(2, 1fr); }
  .pipeline-stages { grid-template-columns: 1fr; }
  .epk-bio-grid { grid-template-columns: 1fr; }
  .rider-grid { grid-template-columns: 1fr; }
  .campaign-builder { grid-template-columns: 1fr; }
  .builder-sidebar { flex-direction: row; flex-wrap: wrap; }
  .smart-link-form { grid-template-columns: 1fr; }
  .stats-grid-4 { grid-template-columns: repeat(2, 1fr); }
  .artist-roster-grid { grid-template-columns: repeat(2, 1fr); }
  .epk-hero { height: 360px; }
  .epk-artist-name { font-size: 2.2rem; }
  .epk-stats-strip { flex-wrap: wrap; }
  .epk-stat-item { min-width: 33%; }
  .drop-card { flex-direction: column; }
  .drop-art { width: 100%; height: 160px; }
}
@media (max-width: 640px) {
  .pipeline-board { grid-template-columns: 1fr; }
  .contract-meta-grid { grid-template-columns: 1fr; }
  .contact-detail-grid { grid-template-columns: 1fr; }
  .campaign-type-grid { grid-template-columns: repeat(2, 1fr); }
  .merch-grid { grid-template-columns: repeat(2, 1fr); }
  .folders-grid { grid-template-columns: repeat(3, 1fr); }
  .media-grid { grid-template-columns: repeat(2, 1fr); }
  .epk-cta-bar { padding: 0.75rem 1rem; }
  .epk-section { padding: 1.25rem 1rem; }
  .epk-artist-name { font-size: 1.8rem; }
  .payout-banner { flex-direction: column; align-items: stretch; text-align: center; }
  .payout-banner-info { flex-direction: column; }
}

/* ─── SEYVN BRAND OVERRIDES ─── */
.app-layout, .main-content { position: relative; z-index: 1; background: transparent; }
.sidebar, .mobile-nav {
  background: linear-gradient(180deg, rgba(12,8,5,.96), rgba(3,3,2,.98));
  border-color: var(--border);
  box-shadow: 20px 0 80px rgba(0,0,0,.28);
}
.sidebar-logo { border-color: var(--border); }
.logo-text, .footer-logo {
  font-family: Georgia, 'Times New Roman', serif;
  font-weight: 500;
  letter-spacing: .22em;
  color: var(--bright-gold);
  text-shadow: 0 0 28px var(--shadow);
}
.sidebar-tagline, .hero-tag, .section-sub { color: var(--muted-2); letter-spacing: .14em; text-transform: uppercase; }
.sidebar-link.active, .sidebar-link:hover { background: rgba(216,167,53,.13); color: var(--bright-gold); }
.btn, button { border-radius: 999px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; }
.btn-gold, .gold-bg, .mobile-nav-special {
  background: linear-gradient(135deg, var(--gold), var(--bright-gold), var(--muted-gold)) !important;
  color: #090603 !important;
  border-color: transparent !important;
  box-shadow: 0 0 38px var(--shadow);
}
.btn-outline, .btn-ghost { border-color: var(--border); color: var(--bright-gold); background: rgba(3,3,2,.22); }
.btn-outline:hover, .btn-ghost:hover { background: rgba(216,167,53,.12); border-color: var(--bright-gold); }
.card, .stat-card, .feature-card, .event-card, .dashboard-card, .form-card, .settings-card, .table-card, .modal-content, .analytics-card,
.cards-grid-3 > *, .event-type-pill {
  background: rgba(12, 8, 5, 0.72) !important;
  border-color: var(--border) !important;
  box-shadow: 0 18px 60px rgba(0,0,0,.28);
}
input, select, textarea { background: rgba(0,0,0,.35); border-color: rgba(216,167,53,.28); color: var(--text); }
.gold, .text-gold, .stat-value, .hero-stat-val { color: var(--bright-gold) !important; }
.badge-live, .badge-vip, .badge-paid, .badge-table { background: rgba(216,167,53,.16) !important; color: var(--bright-gold) !important; border: 1px solid var(--border); }
.badge-upcoming, .badge-draft, .badge-free { background: rgba(245,234,214,.08) !important; color: var(--text) !important; border: 1px solid rgba(245,234,214,.18); }

.brand-lockup { display:flex; align-items:center; gap:14px; color:var(--text); text-transform:uppercase; letter-spacing:.18em; }
.brand-lockup img { width:54px; height:54px; object-fit:contain; border:1px solid var(--border); border-radius:50%; padding:4px; box-shadow:0 0 28px var(--shadow); }
.brand-lockup span { display:flex; flex-direction:column; font-family:Georgia,serif; font-size:1.35rem; color:var(--bright-gold); }
.brand-lockup small { font-family:Inter,system-ui,sans-serif; font-size:.52rem; color:var(--muted-2); letter-spacing:.22em; margin-top:-3px; }
.landing-nav { background: rgba(3,3,2,.34); backdrop-filter: blur(18px); border-bottom:1px solid var(--border); }
.seyvn-hero { min-height: 86vh; display:grid; grid-template-columns: 1.05fr .95fr; align-items:center; gap:48px; padding-inline: max(24px, calc((100vw - 1180px)/2)); overflow:hidden; }
.hero-title { font-family: Georgia, 'Times New Roman', serif; font-weight:500; letter-spacing:-.035em; }
.hero-sub { color: var(--muted-2); max-width: 720px; }
.hero-brand-card { position:relative; display:grid; place-items:center; min-height:560px; border:1px solid var(--border); border-radius:34px; background: radial-gradient(circle at center, rgba(248,214,118,.14), transparent 48%), rgba(7,5,3,.72); overflow:hidden; }
.hero-brand-card::before, .hero-brand-card::after { content:""; position:absolute; border:1px solid rgba(216,167,53,.25); border-radius:50%; }
.hero-brand-card::before { width:430px; height:430px; }
.hero-brand-card::after { width:310px; height:310px; }
.hero-brand-card img { position:relative; z-index:1; width:min(92%, 540px); height:auto; filter: drop-shadow(0 0 40px var(--shadow)); }
.feat-event-card { border:1px solid var(--border); border-radius:24px; overflow:hidden; }
.feat-event-overlay { background: linear-gradient(180deg, transparent, rgba(3,3,2,.92)); }
.cta-inner { border:1px solid var(--border); border-radius:34px; background: radial-gradient(circle at center, rgba(216,167,53,.16), transparent 55%), rgba(12,8,5,.72); }
.cta-inner h2, .section-title { font-family: Georgia, 'Times New Roman', serif; font-weight:500; }
@media (max-width: 980px) { .seyvn-hero { grid-template-columns:1fr; padding-top:96px; } .hero-brand-card { min-height:430px; } }
@media (max-width: 720px) { .landing-nav-links .nav-link { display:none; } .brand-lockup small { display:none; } }