/* ═══════════════════════════════════════════════════════════════════════
   THE SANCTUM — dashboard hub (js/sanctum.js, index.html #view-dashboard)
   Tonight hero · live event · Up Next + Landing · Most Wanted / Coven Pulse
   · this-month line. Accent = who (member dots/names), event color = data.
   ═══════════════════════════════════════════════════════════════════════ */
@layer features {

/* ── Header ─────────────────────────────────────────────────────────── */
.snc-header { display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; margin-bottom:1.5rem; }
.snc-date { font-family:var(--font-vhs); font-size:0.6875rem; letter-spacing:2px; color:var(--dust); text-transform:uppercase; white-space:nowrap; padding-bottom:0.25rem; }

.snc-eyebrow { font-family:var(--font-vhs); font-size:0.6875rem; letter-spacing:3px; color:var(--gold); text-transform:uppercase; }
.snc-quiet { font-family:var(--font-literary); font-size:0.8125rem; color:var(--fog); }

/* ── Tonight hero ───────────────────────────────────────────────────── */
.snc-tonight {
  position:relative; margin-bottom:1rem; border-radius:var(--radius-lg); overflow:hidden;
  border:1px solid color-mix(in srgb, var(--gold) 28%, transparent);
  background:
    radial-gradient(120% 140% at 0% 0%, color-mix(in srgb, var(--gold) 9%, transparent), transparent 60%),
    linear-gradient(180deg, var(--chamber), var(--deep));
}
.snc-tonight-main { display:grid; grid-template-columns:9.5rem minmax(0,1fr); gap:1.375rem; padding:1.375rem; }
.snc-tonight-poster {
  position:relative; aspect-ratio:2/3; border-radius:var(--radius); overflow:hidden; cursor:pointer;
  background:var(--abyss); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; font-size:2rem;
  box-shadow:0 14px 34px rgba(0,0,0,.55);
}
.snc-tonight-poster img { width:100%; height:100%; object-fit:cover; display:block; }
.snc-tonight-poster .vc-watchon-slot { position:absolute; left:7px; bottom:7px; }
.snc-tonight-body { display:flex; flex-direction:column; gap:0.375rem; min-width:0; align-self:center; }
.snc-tonight-title { font-family:var(--font-occult); font-size:1.875rem; font-weight:700; line-height:1.1; color:var(--gold-pale); letter-spacing:0.5px; }
.snc-tonight-ep { font-family:var(--font-vhs); font-size:0.875rem; letter-spacing:2px; color:var(--static); }
.snc-tonight-status { font-family:var(--font-vhs); font-size:0.6875rem; letter-spacing:1.5px; color:var(--gold); text-transform:uppercase; }
.snc-tonight-status.is-new { color:#4ecf8a; }
.snc-tonight-sub { font-family:var(--font-literary); font-size:0.9375rem; color:var(--mist); }
.snc-tonight-actions { display:flex; gap:0.625rem; margin-top:0.625rem; flex-wrap:wrap; }

.snc-tonight-alt {
  display:flex; align-items:center; gap:0.75rem; padding:0.75rem 1.375rem; cursor:pointer;
  border-top:1px solid var(--border); background:color-mix(in srgb, var(--abyss) 60%, transparent);
  transition:background .15s;
}
.snc-tonight-alt:hover { background:color-mix(in srgb, var(--gold) 6%, var(--abyss)); }
.snc-tonight-alt.is-solo { border-top:0; padding:1.25rem 1.375rem; }
.snc-alt-label { font-family:var(--font-vhs); font-size:0.625rem; letter-spacing:2px; color:var(--dust); text-transform:uppercase; white-space:nowrap; }
.snc-alt-poster { width:1.75rem; height:2.625rem; object-fit:cover; border-radius:3px; flex-shrink:0; }
.snc-alt-title { font-family:var(--font-occult); font-size:1rem; font-weight:600; color:var(--static); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.snc-alt-year { font-family:var(--font-literary); font-weight:400; color:var(--fog); }
.snc-tonight-alt .snc-in { margin-left:auto; }

.snc-tonight-empty { padding:1.375rem; display:flex; flex-direction:column; gap:0.625rem; }
.snc-tonight-empty-line { font-family:var(--font-literary); font-size:1rem; color:var(--mist); }
.snc-tonight-empty-line a { color:var(--gold); cursor:pointer; }

/* "I'm in" member dots — accent = who */
.snc-in { display:inline-flex; align-items:center; gap:0.375rem; font-family:var(--font-vhs); font-size:0.625rem; letter-spacing:1px; color:var(--static); white-space:nowrap; }
.snc-in b, .snc-row-meta b { font-weight:400; color:var(--static); margin-left:0.25rem; }
.snc-dot {
  display:inline-flex; align-items:center; justify-content:center; width:1.25rem; height:1.25rem; border-radius:50%;
  margin-left:-0.3125rem; font-family:var(--font-vhs); font-size:0.625rem; color:var(--m-accent);
  background:var(--abyss); border:1px solid color-mix(in srgb, var(--m-accent) 70%, transparent);
}
.snc-dot:first-child { margin-left:0; }

/* ── Live event ─────────────────────────────────────────────────────── */
.snc-events { display:flex; flex-direction:column; gap:0.625rem; margin-bottom:1rem; }
.snc-event {
  padding:0.875rem 1.25rem; border-radius:var(--radius-lg); cursor:pointer;
  background:linear-gradient(90deg, color-mix(in srgb, var(--evt) 12%, var(--deep)), var(--deep) 70%);
  border:1px solid color-mix(in srgb, var(--evt) 35%, transparent); transition:border-color .15s;
}
.snc-event:hover { border-color:color-mix(in srgb, var(--evt) 70%, transparent); }
.snc-event-head { display:flex; align-items:baseline; gap:0.75rem; flex-wrap:wrap; }
.snc-event-name { font-family:var(--font-occult); font-size:1.0625rem; font-weight:700; color:var(--gold-pale); }
.snc-event-live { font-family:var(--font-vhs); font-size:0.625rem; letter-spacing:2px; color:#e05a5a; }
.snc-event-when { font-family:var(--font-vhs); font-size:0.625rem; letter-spacing:1.5px; color:var(--fog); text-transform:uppercase; }
.snc-event-open { margin-left:auto; font-family:var(--font-vhs); font-size:0.625rem; letter-spacing:1px; color:var(--gold); }
.snc-event-bar { height:0.375rem; border-radius:999px; background:rgba(255,255,255,.07); overflow:hidden; margin-top:0.625rem; }
.snc-event-bar > div { height:100%; background:var(--evt); border-radius:999px; }
.snc-event-meta { font-family:var(--font-vhs); font-size:0.625rem; letter-spacing:1px; color:var(--dust); margin-top:0.375rem; }
.snc-event.is-soon { background:var(--deep); }

/* ── Cards ──────────────────────────────────────────────────────────── */
.snc-card { margin-bottom:1rem; }
.snc-card .card-title { margin-bottom:0.875rem; }
.snc-rail { display:grid; grid-auto-flow:column; grid-auto-columns:8.5rem; gap:0.875rem; overflow-x:auto; padding-bottom:0.375rem; scrollbar-width:thin; }

.snc-landing-row { display:flex; align-items:center; gap:0.875rem; margin-top:1rem; padding-top:0.875rem; border-top:1px solid var(--rim); flex-wrap:wrap; }
.snc-landing-label { font-family:var(--font-vhs); font-size:0.625rem; letter-spacing:2px; color:var(--dust); text-transform:uppercase; white-space:nowrap; }
.snc-landing { display:flex; gap:0.5rem; flex-wrap:wrap; }
.snc-land {
  display:inline-flex; align-items:center; gap:0.5rem; padding:0.3125rem 0.375rem 0.3125rem 0.625rem; cursor:pointer;
  background:var(--abyss); border:1px solid var(--border); border-radius:999px; color:var(--static);
}
.snc-land:hover { border-color:color-mix(in srgb, var(--gold) 50%, transparent); }
.snc-land-day { font-family:var(--font-vhs); font-size:0.625rem; letter-spacing:1px; color:#b9c7ff; }
.snc-land-title { font-family:var(--font-literary); font-size:0.8125rem; }
.snc-land-logo { width:1.25rem; height:1.25rem; border-radius:4px; object-fit:cover; }

.snc-split { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:1rem; }

/* Most wanted rows */
.snc-list { display:flex; flex-direction:column; }
.snc-row {
  display:flex; align-items:center; justify-content:space-between; gap:0.75rem; padding:0.5625rem 0.25rem; cursor:pointer;
  border-top:1px solid color-mix(in srgb, var(--bronze) 10%, transparent);
}
.snc-row:first-child { border-top:0; }
.snc-row:hover .snc-row-title { color:var(--gold-pale); }
.snc-row-title { font-family:var(--font-occult); font-size:0.875rem; font-weight:600; color:var(--static); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.snc-row-meta { display:inline-flex; align-items:center; font-family:var(--font-vhs); font-size:0.625rem; letter-spacing:1px; color:var(--dust); white-space:nowrap; }

/* Coven pulse: watches have no subject; the picker is credited in their accent */
.snc-pulse-pick { font-weight:600; color:var(--m-accent); }

/* ── This month ─────────────────────────────────────────────────────── */
.snc-month {
  display:flex; align-items:baseline; gap:0.5rem 1.25rem; flex-wrap:wrap; margin:0.5rem 0 1rem; padding:0.875rem 0.25rem 0;
  border-top:1px solid var(--border); font-family:var(--font-vhs); font-size:0.6875rem; letter-spacing:1px; color:var(--dust);
}
.snc-month b { color:var(--static); font-weight:400; }
.snc-month span[title] { cursor:help; }
.snc-month-label { color:var(--gold); letter-spacing:2px; text-transform:uppercase; }
.snc-month-more { margin-left:auto; color:var(--fog); cursor:pointer; }
.snc-month-more:hover { color:var(--gold); }

/* ── Narrow screens ─────────────────────────────────────────────────── */
@media (max-width: 52rem) {
  .snc-split { grid-template-columns:1fr; }
  .snc-tonight-main { grid-template-columns:6.5rem minmax(0,1fr); gap:1rem; padding:1rem; }
  .snc-tonight-title { font-size:1.375rem; }
  .snc-tonight-alt { flex-wrap:wrap; }
}

} /* end @layer features */
