/* ── UI Scale ── */
/* Zoom scoped to page content only.
   nav, modals, toast, and the settings panel wrapper are NOT zoomed.
   .view is the full-page content area; .sidebar is the left panel.
   We wrap both in .vc-zoomable via JS rather than using .vc-scaled
   directly on descendants to avoid the settings panel shifting mid-drag. */
:root { --vc-ui-zoom: 1; --vc-nav-h: 66px; }
.vc-scaled .view { zoom: var(--vc-ui-zoom); }
.vc-scaled .sidebar { zoom: min(var(--vc-ui-zoom), 1.25); }
.vc-scaled .mobile-nav-drawer { zoom: var(--vc-ui-zoom); }
/* Zoom the modal box only — never the backdrop (zooming fixed elements breaks positioning) */
.vc-scaled .modal { zoom: var(--vc-ui-zoom); max-width: min(860px, calc(96vw / var(--vc-ui-zoom, 1))) !important; max-height: calc(90vh / var(--vc-ui-zoom, 1)) !important; }
/* padding-top and sidebar top are set directly by vcApplyUIScale() as inline styles
   so they're always correct even when called before the DOM is fully ready */
/* ─────────── */

:root {
  /* Theme-tunable Codex control surfaces */
  --codex-control-bg: rgba(12,9,22,.85);
  --codex-control-border: var(--border);
  --codex-control-text: var(--static);

  --codex-chip-bg: rgba(255,255,255,.02);
  --codex-chip-border: rgba(201,151,58,.2);
  --codex-chip-text: var(--fog);
  --codex-chip-bg-active: rgba(201,151,58,.12);
  --codex-chip-border-active: rgba(201,151,58,.55);
  --codex-chip-text-active: var(--gold);

  /* Ritual badge theming */
  --ritual-subtext: rgba(231,224,206,.82);

  --codex-stat-bg-a: rgba(22,14,40,.7);
  --codex-stat-bg-b: rgba(10,8,18,.85);

  
  /* Ritual Badges (tunable) */
  --ritual-bg-a: rgba(8,9,18,.92);
  --ritual-bg-b: rgba(10,8,14,.92);
  --ritual-glow-a: rgba(169,119,255,.10);
  --ritual-glow-b: rgba(139,26,26,.16);
  --ritual-border: rgba(201,151,58,.22);
  --ritual-recent-border: rgba(232,184,75,.72);
  --ritual-subtext: rgba(230,215,185,.82);
--void: #050407;
  --abyss: #080610;
  --deep: #0e0b18;
  --chamber: #150f22;
  --altar: #1e1530;
  --surface: #251c3a;
  --rim: rgba(180,120,60,0.15);
  --border: rgba(180,120,60,0.2);
  --border-bright: rgba(180,120,60,0.45);
  --blood: #8b1a1a;
  --blood-bright: #c0392b;
  --blood-glow: rgba(139,26,26,0.3);
  --gold: #c9973a;
  --gold-bright: #e8b84b;
  --gold-pale: #f0d080;
  --gold-glow: rgba(201,151,58,0.2);
  --static: #b8a898;
  --fog: #7a6e80;
  --dust: #4a4255;
  --green: #4ecf8a;
  --violet: #b9c7ff;
  --mist: #a79db6;
  --font-occult: 'Cinzel', serif;
  --font-vhs: 'Share Tech Mono', monospace;
  --font-grimoire: 'Crimson Text', serif;
  --radius: 8px;
  --radius-lg: 14px;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background:var(--void); color:var(--static); font-family:var(--font-grimoire); font-size:16px; line-height:1.7; overflow-x:hidden; }
body::before { content:''; position:fixed; inset:0; z-index:999; pointer-events:none; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E"); opacity:0.35; }
body::after { content:''; position:fixed; inset:0; z-index:998; pointer-events:none; background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,0.08) 2px,rgba(0,0,0,0.08) 4px); }

/* PASS 3.3 — Optional FX toggles (GPU/paint savings) */
body.vc-fx-noise-off::before { content:none !important; }
body.vc-fx-scanlines-off::after { content:none !important; }

/* ══════════════════════════════════════════════════════════════
   FX COLOUR SYSTEM — CSS custom property driven
   Each theme declares --fx-trace-color, --fx-trace-color-2,
   --fx-icegrid-h, --fx-icegrid-v, --fx-icegrid-opacity.
   New themes just set these vars and get themed FX for free.
   ══════════════════════════════════════════════════════════════ */

/* Default (Videoccult) FX colours */
:root {
  --fx-trace-color:   rgba(201,151,58,.20);   /* gold sweep */
  --fx-icegrid-h:     rgba(201,151,58,.06);
  --fx-icegrid-v:     rgba(201,151,58,.04);
  --fx-icegrid-opacity: 0.14;
  --fx-icegrid-size:  28px;
}

/* ── Per-theme FX colour overrides ── */
:root[data-vc-theme="netrunner"] {
  --fx-trace-color:   rgba(0,240,255,.22);
  --fx-icegrid-h:     rgba(0,240,255,.07);
  --fx-icegrid-v:     rgba(0,240,255,.05);
  --fx-icegrid-opacity: 0.14;
}
:root[data-vc-theme="blackwall"] {
  --fx-trace-color:   rgba(255,31,53,.24);
  --fx-icegrid-h:     rgba(255,31,53,.08);
  --fx-icegrid-v:     rgba(155,48,255,.06);
  --fx-icegrid-opacity: 0.12;
}
:root[data-vc-theme="witch"] {
  --fx-trace-color:   rgba(172,134,255,.20);
  --fx-icegrid-h:     rgba(172,134,255,.06);
  --fx-icegrid-v:     rgba(127,74,182,.05);
  --fx-icegrid-opacity: 0.12;
}
:root[data-vc-theme="lovecraft"] {
  --fx-trace-color:   rgba(90,138,136,.22);
  --fx-icegrid-h:     rgba(90,138,136,.07);
  --fx-icegrid-v:     rgba(32,54,59,.05);
  --fx-icegrid-opacity: 0.13;
}
:root[data-vc-theme="dark_academia"] {
  --fx-trace-color:   rgba(188,148,96,.18);
  --fx-icegrid-h:     rgba(188,148,96,.05);
  --fx-icegrid-v:     rgba(141,90,67,.04);
  --fx-icegrid-opacity: 0.11;
}
:root[data-vc-theme="hedgerow"] {
  --fx-trace-color:   rgba(144,166,127,.20);
  --fx-icegrid-h:     rgba(144,166,127,.06);
  --fx-icegrid-v:     rgba(120,153,112,.04);
  --fx-icegrid-opacity: 0.12;
}

/* Netrunner FX modules (toggleable) */
body.vc-fx-icegrid-on .modal,
body.vc-fx-icegrid-on .card,
body.vc-fx-icegrid-on .panel,
body.vc-fx-icegrid-on .settings-section{
  position: relative;
}
body.vc-fx-icegrid-on .modal::before,
body.vc-fx-icegrid-on .card::before,
body.vc-fx-icegrid-on .panel::before,
body.vc-fx-icegrid-on .settings-section::before{
  content:"";
  position:absolute; inset:0;
  border-radius: inherit;
  pointer-events:none;
  background-image:
    linear-gradient(to right, var(--fx-icegrid-h) 1px, transparent 1px),
    linear-gradient(to bottom, var(--fx-icegrid-v) 1px, transparent 1px);
  background-size: var(--fx-icegrid-size, 28px) var(--fx-icegrid-size, 28px);
  opacity: var(--fx-icegrid-opacity, 0.12);
  mix-blend-mode: screen;
}

body.vc-fx-trace-on .btn,
body.vc-fx-trace-on .vc-theme-card,
body.vc-fx-trace-on .watch-item,
body.vc-fx-trace-on .result-card,
body.vc-fx-trace-on .queue-item{
  position: relative;
  overflow: hidden;
}
body.vc-fx-trace-on .btn::after,
body.vc-fx-trace-on .vc-theme-card::after,
body.vc-fx-trace-on .watch-item::after,
body.vc-fx-trace-on .result-card::after,
body.vc-fx-trace-on .queue-item::after{
  content:"";
  position:absolute; top:-30%; left:-60%;
  width: 60%; height: 160%;
  transform: rotate(18deg);
  background: linear-gradient(90deg, transparent, var(--fx-trace-color), transparent);
  opacity: 0;
  pointer-events:none;
}
body.vc-fx-trace-on .btn:hover::after,
body.vc-fx-trace-on .vc-theme-card:hover::after,
body.vc-fx-trace-on .watch-item:hover::after,
body.vc-fx-trace-on .result-card:hover::after,
body.vc-fx-trace-on .queue-item:hover::after{
  opacity: 1;
  animation: vcTraceSweep 0.65s ease-out 1;
}
@keyframes vcTraceSweep{
  from{ left:-70%; }
  to{ left:130%; }
}

body.vc-fx-sigils-on .tag.gold,
body.vc-fx-sigils-on .queue-auto-badge,
body.vc-fx-sigils-on .watch-history-badge.first-watch-badge{
  position:relative;
}
/* .vc-theme-active is position:absolute — must NOT get position:relative */
/* Sigil glyph prepended to Active badge via ::before (inline, not offset) */
body.vc-fx-sigils-on .vc-theme-active::before{
  content:"⛧ ";
  font-size:9px;
  opacity:.85;
  color: var(--gold);
  filter: drop-shadow(0 0 6px rgba(201,151,58,.5));
  vertical-align:middle;
}
body[data-vc-theme="blackwall"].vc-fx-sigils-on .vc-theme-active::before{
  color: var(--bw-red, #ff1f35);
  filter: drop-shadow(0 0 6px rgba(255,31,53,.65));
}

/* Tag gold gets old floating sigil */
body.vc-fx-sigils-on .tag.gold::before{
  content:"⛧";
  position:absolute;
  left:-10px; top:-8px;
  font-size:10px;
  opacity:.65;
  color: var(--gold);
  filter: drop-shadow(0 0 10px rgba(0,240,255,.25));
}
body[data-vc-theme="blackwall"].vc-fx-sigils-on .tag.gold::before{
  color: var(--bw-red, #ff1f35);
  filter: drop-shadow(0 0 10px rgba(255,31,53,.35));
}

/* Corner sigil points on theme cards when Daemon Sigils active */
body.vc-fx-sigils-on .vc-theme-card::before{
  content:"" !important; /* keep the gradient, corners handled via ::after below */
}
body.vc-fx-sigils-on .vc-theme-card.active{
  --sigil-corner-color: rgba(201,151,58,.22);
}
/* Tiny corner tick marks: use outline trick on the card */
body.vc-fx-sigils-on .vc-theme-card{
  outline: 1px solid transparent;
  box-shadow:
    -1px -1px 0 0 var(--sigil-corner-color, rgba(201,151,58,.10)),
     1px -1px 0 0 var(--sigil-corner-color, rgba(201,151,58,.10)),
    -1px  1px 0 0 var(--sigil-corner-color, rgba(201,151,58,.10)),
     1px  1px 0 0 var(--sigil-corner-color, rgba(201,151,58,.10));
}
body.vc-fx-sigils-on .vc-theme-card.active{
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--gold) 24%, transparent),
    0 10px 26px color-mix(in srgb, var(--gold) 12%, transparent),
    -2px -2px 0 0 rgba(201,151,58,.35),
     2px -2px 0 0 rgba(201,151,58,.35),
    -2px  2px 0 0 rgba(201,151,58,.35),
     2px  2px 0 0 rgba(201,151,58,.35);
}
body[data-vc-theme="blackwall"].vc-fx-sigils-on .vc-theme-card{
  box-shadow:
    -1px -1px 0 0 rgba(255,31,53,.18),
     1px -1px 0 0 rgba(255,31,53,.18),
    -1px  1px 0 0 rgba(255,31,53,.18),
     1px  1px 0 0 rgba(255,31,53,.18);
}
body[data-vc-theme="blackwall"].vc-fx-sigils-on .vc-theme-card.active{
  box-shadow:
    0 0 0 1px rgba(255,31,53,.32),
    0 10px 26px rgba(255,31,53,.18),
    -2px -2px 0 0 rgba(255,31,53,.50),
     2px -2px 0 0 rgba(255,31,53,.50),
    -2px  2px 0 0 rgba(255,31,53,.50),
     2px  2px 0 0 rgba(255,31,53,.50);
}

body.vc-fx-glitch-on .modal{ animation: none; }
body.vc-fx-glitch-pulse .modal{
  animation: vcGlitchPulse 180ms ease-out 1;
}
@keyframes vcGlitchPulse{
  0%{ transform:translateY(0); filter:none; }
  20%{ transform:translateY(-1px); filter:contrast(1.05) saturate(1.05); }
  55%{ transform:translateY(1px); filter:contrast(1.10) saturate(1.10); }
  100%{ transform:translateY(0); filter:none; }
}


/* PASS 3.4 — Diagnostics overlay (Ctrl+Shift+D) */
#vc-diag-overlay {
  position: fixed;
  right: 14px;
  bottom: 14px;
  width: 320px;
  max-width: calc(100vw - 28px);
  z-index: 999999;
  border-radius: 14px;
  border: 1px solid rgba(201,151,58,0.22);
  background: rgba(10,8,16,0.86);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 16px 40px rgba(0,0,0,0.45);
  overflow: hidden;
}
#vc-diag-overlay .hdr {
  display:flex; align-items:center; justify-content:space-between;
  padding: 10px 12px;
  font-family: var(--font-vhs);
  font-size: 10px;
  letter-spacing: 2px;
  color: rgba(201,151,58,0.95);
  border-bottom: 1px solid rgba(201,151,58,0.18);
}
#vc-diag-overlay .body { padding: 12px; font-size: 12px; color: var(--fog); }
#vc-diag-overlay .row { display:flex; justify-content:space-between; gap: 12px; margin: 6px 0; }
#vc-diag-overlay .k { opacity: 0.85; }
#vc-diag-overlay .v { color: rgba(255,255,255,0.88); font-variant-numeric: tabular-nums; }
#vc-diag-overlay .btns { display:flex; gap: 8px; margin-top: 10px; }
#vc-diag-overlay .btns .btn { flex:1; padding: 6px 10px; font-size: 11px; }
@media (prefers-reduced-motion: reduce){
  /* Reduce visual noise/scanlines for users who prefer less motion/visual strain */
  body::before { opacity: 0.12; }
  body::after { opacity: 0.12; }
}
::-webkit-scrollbar { width:5px; } ::-webkit-scrollbar-track { background:var(--void); } ::-webkit-scrollbar-thumb { background:var(--surface); border-radius:2px; }

/* GLITCH */
.glitch { position:relative; display:inline-block; }
.glitch::before,.glitch::after { content:attr(data-text); position:absolute; top:0; left:0; width:100%; height:100%; clip:rect(0,0,0,0); }
.glitch::before { color:var(--blood-bright); animation:glitch-a 4s infinite; text-shadow:2px 0 var(--blood-bright); }
.glitch::after { color:var(--gold); animation:glitch-b 4s infinite; text-shadow:-2px 0 var(--gold); }
@keyframes glitch-a { 0%,90%,100%{clip:rect(0,9999px,0,0);transform:translate(0)} 92%{clip:rect(8px,9999px,24px,0);transform:translate(-2px,0)} 94%{clip:rect(44px,9999px,52px,0);transform:translate(2px,0)} 96%{clip:rect(12px,9999px,18px,0);transform:translate(-1px,0)} }
@keyframes glitch-b { 0%,90%,100%{clip:rect(0,9999px,0,0);transform:translate(0)} 91%{clip:rect(30px,9999px,40px,0);transform:translate(2px,0)} 93%{clip:rect(6px,9999px,14px,0);transform:translate(-2px,0)} 95%{clip:rect(50px,9999px,60px,0);transform:translate(1px,0)} }
@keyframes flicker { 0%,98%,100%{opacity:1} 99%{opacity:0.85} }
@keyframes fadeUp { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:translateY(0)} }
@keyframes scaleIn { from{opacity:0;transform:scale(0.95)} to{opacity:1;transform:scale(1)} }
@keyframes scrollLeft { from{transform:translateX(0)} to{transform:translateX(-50%)} }
@keyframes rotate-slow { from{transform:rotate(0deg)} to{transform:rotate(360deg)} }
@keyframes candleFlicker { 0%,100%{box-shadow:0 0 12px 4px rgba(201,151,58,0.4),0 0 40px 8px rgba(139,26,26,0.2)} 33%{box-shadow:0 0 18px 6px rgba(201,151,58,0.6),0 0 60px 12px rgba(139,26,26,0.3)} 66%{box-shadow:0 0 8px 2px rgba(201,151,58,0.3),0 0 30px 6px rgba(139,26,26,0.15)} }
@keyframes spin { from{transform:rotate(0deg)} to{transform:rotate(360deg)} }

/* NAV */
nav { position:fixed; top:0; left:0; right:0; z-index:100; display:flex; align-items:center; justify-content:space-between; padding:0 28px; height:66px; background:var(--nav-shell, rgba(5,4,7,0.92)); backdrop-filter:blur(16px); border-bottom:1px solid var(--nav-border, var(--border)); }
.nav-logo { font-family:var(--font-occult); font-weight:900; font-size:22px; letter-spacing:1px; color:var(--gold); cursor:pointer; text-shadow:0 0 20px var(--gold-glow); text-transform:uppercase; animation:flicker 8s infinite; }
.nav-logo .sigil { color:var(--blood-bright); margin:0 2px; }
.nav-links { display:flex; gap:2px; }
.nav-links a { color:var(--dust); text-decoration:none; font-family:var(--font-vhs); font-size:13px; letter-spacing:2px; text-transform:uppercase; padding:8px 16px; border-radius:4px; transition:all 0.2s; cursor:pointer; border:1px solid transparent; }
.nav-links a:hover,.nav-links a.active { color:var(--gold); background:var(--nav-active-bg, rgba(201,151,58,0.08)); border-color:var(--nav-active-border, rgba(201,151,58,0.15)); }
.nav-right { display:flex; gap:8px; align-items:center; }
.btn { display:inline-flex; align-items:center; gap:6px; padding:8px 18px; border-radius:4px; font-family:var(--font-vhs); font-size:11px; letter-spacing:2px; text-transform:uppercase; cursor:pointer; transition:all 0.2s; border:none; text-decoration:none; }
.btn-ghost { background:transparent; color:var(--dust); border:1px solid rgba(180,120,60,0.2); }
.btn-ghost:hover { color:var(--gold); border-color:var(--gold); background:rgba(201,151,58,0.05); }
.btn-watchthrough { background:rgba(201,151,58,0.10); color:var(--gold-pale); border:1px solid rgba(201,151,58,0.45); box-shadow:inset 0 0 0 1px rgba(201,151,58,0.08), 0 0 12px rgba(201,151,58,0.08); }
.btn-watchthrough:hover { color:var(--gold); border-color:rgba(201,151,58,0.75); background:rgba(201,151,58,0.16); box-shadow:0 0 18px rgba(201,151,58,0.14); transform:translateY(-1px); }
.btn-ritual { background:linear-gradient(135deg,var(--blood) 0%,#5a0e0e 100%); color:var(--gold-pale); border:1px solid var(--blood-bright); box-shadow:0 0 16px var(--blood-glow); }
.btn-ritual:hover { background:linear-gradient(135deg,var(--blood-bright) 0%,var(--blood) 100%); box-shadow:0 0 28px var(--blood-glow),0 4px 20px rgba(0,0,0,0.5); transform:translateY(-1px); }
.btn-sm { padding:6px 14px; font-size:10px; }
.btn-danger { background:rgba(139,26,26,0.15); color:#e07070; border:1px solid rgba(139,26,26,0.3); }
.btn-danger:hover { background:rgba(139,26,26,0.3); }

/* VIEWS */
.view { display:none; padding-top:66px; min-height:100vh; }
.view.active { display:block; }

/* LOADING */
.loading-spinner { display:inline-block; width:16px; height:16px; border:2px solid var(--border); border-top-color:var(--gold); border-radius:50%; animation:spin 0.6s linear infinite; }
.loading-overlay { position:fixed; inset:0; background:rgba(5,4,7,0.9); z-index:500; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; }
.loading-overlay .logo { font-family:var(--font-occult); font-size:32px; font-weight:900; color:var(--gold); letter-spacing:4px; animation:flicker 3s infinite; }
.loading-overlay p { font-family:var(--font-vhs); font-size:11px; letter-spacing:3px; color:var(--dust); text-transform:uppercase; }

/* AUTH SCREEN */
#view-auth { background:var(--void); display:flex; align-items:center; justify-content:center; min-height:100vh; padding:20px; }
.auth-box { background:var(--deep); border:1px solid var(--border-bright); border-radius:var(--radius-lg); width:100%; max-width:400px; overflow:hidden; box-shadow:0 0 60px rgba(139,26,26,0.3),0 32px 80px rgba(0,0,0,0.8); }
.auth-top { height:3px; background:linear-gradient(90deg,var(--blood),var(--gold),var(--blood)); }
.auth-header { padding:32px 32px 0; text-align:center; }
.auth-logo { font-family:'Cinzel',serif; font-weight:900; font-size:36px; color:var(--gold); text-shadow:0 0 30px rgba(201,151,58,0.4); margin-bottom:4px; letter-spacing:4px; }
.auth-logo-sub { font-family:var(--font-vhs); font-size:9px; letter-spacing:4px; color:var(--dust); text-transform:uppercase; margin-bottom:24px; }
.auth-tabs { display:flex; border-bottom:1px solid var(--border); }
.auth-tab { flex:1; padding:10px; font-family:var(--font-vhs); font-size:10px; letter-spacing:2px; text-transform:uppercase; text-align:center; cursor:pointer; color:var(--dust); transition:all 0.2s; border-bottom:2px solid transparent; margin-bottom:-1px; }
.auth-tab.active { color:var(--gold); border-bottom-color:var(--gold); }
.auth-body { padding:28px 32px 32px; }
.form-group { margin-bottom:16px; }
.form-label { font-family:var(--font-vhs); font-size:9px; letter-spacing:2px; text-transform:uppercase; color:var(--dust); margin-bottom:6px; display:block; }
.form-input { width:100%; padding:10px 14px; background:var(--chamber); border:1px solid var(--border); border-radius:6px; color:var(--static); font-family:var(--font-grimoire); font-size:15px; outline:none; transition:border-color 0.2s; }
.form-input:focus { border-color:var(--border-bright); box-shadow:0 0 0 3px rgba(201,151,58,0.08); }
.form-input::placeholder { color:var(--dust); font-style:italic; }
.auth-error { font-family:var(--font-vhs); font-size:10px; letter-spacing:1px; color:#e07070; background:rgba(139,26,26,0.15); border:1px solid rgba(139,26,26,0.3); border-radius:4px; padding:8px 12px; margin-bottom:14px; display:none; }
.auth-note { font-family:var(--font-grimoire); font-size:13px; color:var(--dust); font-style:italic; text-align:center; margin-top:12px; }
.invite-section { margin-top:16px; padding-top:16px; border-top:1px solid var(--border); }

/* HERO */
.hero { position:relative; overflow:hidden; min-height:calc(100vh - 56px); display:flex; flex-direction:column; align-items:center; justify-content:center; padding:60px 32px 40px; text-align:center; }
.ritual-circle { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:min(700px,90vw); height:min(700px,90vw); animation:rotate-slow 60s linear infinite; opacity:0.12; pointer-events:none; }
.ritual-circle-inner { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:min(500px,65vw); height:min(500px,65vw); animation:rotate-slow 40s linear infinite reverse; opacity:0.18; pointer-events:none; }
.hero-bg-glow { position:absolute; inset:0; pointer-events:none; background:radial-gradient(ellipse 60% 50% at 50% 50%,rgba(139,26,26,0.12) 0%,transparent 60%),radial-gradient(ellipse 40% 30% at 50% 50%,rgba(201,151,58,0.06) 0%,transparent 50%); }
.hero-content { position:relative; z-index:1; max-width:800px; }
.hero-eyebrow { font-family:var(--font-vhs); font-size:11px; letter-spacing:4px; color:var(--blood-bright); text-transform:uppercase; margin-bottom:20px; animation:fadeUp 0.7s ease both; }
.hero-title { font-family:var(--font-occult); font-weight:900; text-transform:uppercase; font-size:clamp(58px,10vw,120px); line-height:0.92; letter-spacing:6px; color:var(--gold); text-shadow:0 0 40px rgba(201,151,58,0.35),0 0 80px rgba(139,26,26,0.25); animation:fadeUp 0.7s 0.1s ease both,flicker 10s infinite; margin-bottom:8px; }
.hero-subtitle { font-family:var(--font-occult); font-size:clamp(11px,1.5vw,14px); letter-spacing:6px; text-transform:uppercase; color:var(--fog); margin-bottom:28px; animation:fadeUp 0.7s 0.2s ease both; }
.hero-divider { width:200px; height:1px; background:linear-gradient(90deg,transparent,var(--gold),transparent); margin:0 auto 28px; animation:fadeUp 0.7s 0.25s ease both; }
.hero-desc { font-family:var(--font-grimoire); font-size:18px; font-style:italic; color:var(--fog); max-width:480px; margin:0 auto 36px; line-height:1.8; animation:fadeUp 0.7s 0.3s ease both; }
.hero-cta { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; animation:fadeUp 0.7s 0.4s ease both; }
.hero-cta .btn { padding:12px 28px; font-size:11px; }
.candle { position:absolute; width:4px; height:4px; border-radius:50%; background:var(--gold); animation:candleFlicker 3s ease-in-out infinite; }
.candle:nth-child(1){top:20%;left:15%;animation-delay:0s} .candle:nth-child(2){top:75%;left:10%;animation-delay:1.2s} .candle:nth-child(3){top:30%;right:12%;animation-delay:0.6s} .candle:nth-child(4){top:70%;right:18%;animation-delay:1.8s} .candle:nth-child(5){top:55%;left:5%;animation-delay:0.3s}

/* FILMSTRIP */
.filmstrip { position:relative; overflow:hidden; margin-top:48px; padding:16px 0; border-top:1px solid var(--border); border-bottom:1px solid var(--border); background:linear-gradient(180deg,var(--abyss) 0%,transparent 50%,var(--abyss) 100%); animation:fadeUp 0.7s 0.5s ease both; }
.filmstrip-track { display:flex; gap:10px; animation:scrollLeft 35s linear infinite; width:max-content; }
.filmstrip:hover .filmstrip-track { animation-play-state:paused; }
.film-card { width:110px; height:163px; border-radius:6px; background:var(--chamber); overflow:hidden; flex-shrink:0; border:1px solid var(--border); position:relative; transition:all 0.25s; cursor:pointer; }
.film-card:hover { border-color:var(--gold); transform:scale(1.06); box-shadow:0 8px 32px rgba(0,0,0,0.6),0 0 16px rgba(201,151,58,0.2); z-index:2; }
.film-card img { width:100%; height:100%; object-fit:cover; filter:saturate(0.7) brightness(0.85); transition:filter 0.25s; }
.film-card:hover img { filter:saturate(1) brightness(1); }
.film-card-label { position:absolute; bottom:0; left:0; right:0; padding:20px 8px 8px; background:linear-gradient(transparent,rgba(0,0,0,0.85)); font-family:var(--font-vhs); font-size:9px; color:var(--gold); letter-spacing:1px; opacity:0; transition:opacity 0.2s; }
.film-card:hover .film-card-label { opacity:1; }
.film-card-type { position:absolute; top:6px; left:6px; background:rgba(0,0,0,0.7); border:1px solid var(--border); border-radius:3px; padding:2px 6px; font-family:var(--font-vhs); font-size:8px; color:var(--blood-bright); }
.filmstrip-fade { position:absolute; top:0; bottom:0; width:100px; z-index:1; pointer-events:none; }
.filmstrip-fade.left { left:0; background:linear-gradient(to right,var(--void),transparent); }
.filmstrip-fade.right { right:0; background:linear-gradient(to left,var(--void),transparent); }

/* SECTION */
.section { padding:80px 32px; max-width:1100px; margin:0 auto; }
.section-rune { font-family:var(--font-vhs); font-size:10px; letter-spacing:4px; text-transform:uppercase; color:var(--blood-bright); margin-bottom:10px; }
.section-rune::before{content:'⛧ '} .section-rune::after{content:' ⛧'}
.section-title { font-family:var(--font-occult); font-size:clamp(28px,4vw,42px); font-weight:700; letter-spacing:-0.5px; color:var(--gold-pale); text-shadow:0 0 30px rgba(201,151,58,0.2); }
.feature-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:14px; margin-top:40px; }
.feature-card { background:var(--deep); border:1px solid var(--border); border-radius:var(--radius-lg); padding:28px; position:relative; overflow:hidden; transition:all 0.3s; }
.feature-card::before { content:''; position:absolute; top:0; left:0; right:0; height:1px; background:linear-gradient(90deg,transparent,var(--gold),transparent); opacity:0; transition:opacity 0.3s; }
.feature-card:hover { border-color:var(--border-bright); transform:translateY(-3px); background:var(--chamber); }
.feature-card:hover::before { opacity:1; }
.feature-icon { font-size:28px; margin-bottom:14px; display:block; filter:drop-shadow(0 0 8px rgba(201,151,58,0.4)); }
.feature-title { font-family:var(--font-occult); font-size:15px; font-weight:600; color:var(--gold-pale); margin-bottom:8px; letter-spacing:0.5px; }
.feature-desc { color:var(--fog); font-size:15px; line-height:1.7; font-style:italic; }

/* DASHBOARD */
#view-dashboard { background:var(--void); }
.dashboard-layout { display:grid; grid-template-columns:220px 1fr; min-height:calc(100vh - 66px); }
.sidebar { background:var(--sidebar-shell, var(--abyss)); border-right:1px solid var(--sidebar-border, var(--border)); padding:16px 12px 20px; position:sticky; top:66px; height:calc(100vh - 66px); overflow-y:auto; display:flex; flex-direction:column; gap:2px; }
.sidebar-section-label { font-family:var(--font-vhs); font-size:9px; letter-spacing:3px; text-transform:uppercase; color:var(--dust); padding:14px 10px 6px; }

.sidebar-item { display:flex; align-items:center; gap:10px; padding:9px 10px; border-radius:6px; font-family:var(--font-vhs); font-size:11px; letter-spacing:1px; text-transform:uppercase; color:var(--dust); cursor:pointer; transition:all 0.15s; border:1px solid transparent; }
.sidebar-item:hover { background:var(--sidebar-active-bg, var(--chamber)); color:var(--gold); border-color:var(--sidebar-active-border, var(--rim)); }
.sidebar-item.active { background:var(--sidebar-active-bg, var(--chamber)); color:var(--gold); border-color:var(--sidebar-active-border, var(--border)); }
.sidebar-item .icon { font-size:14px; width:18px; text-align:center; }
.sidebar-badge { margin-left:auto; background:var(--blood); color:var(--gold-pale); font-size:9px; font-weight:700; padding:2px 6px; border-radius:3px; font-family:var(--font-vhs); }
.sidebar-group-icon { width:24px; height:24px; border-radius:4px; background:var(--surface); display:flex; align-items:center; justify-content:center; font-family:var(--font-occult); font-size:10px; color:var(--gold); flex-shrink:0; border:1px solid var(--border); }
.main-content { padding:0 32px 32px; overflow-y:auto; }
.shared-search-main.main-content, .shared-history-main.main-content,
.shared-queue-main.main-content, .shared-my-locker-main.main-content,
.shared-coven-locker-main.main-content, .shared-coven-main.main-content,
.shared-my-wishlist-main.main-content, .shared-coven-wishlist-main.main-content { padding:0; }
/* Standardize top padding across all shared view main areas */
.shared-search-main.main-content, .shared-history-main.main-content,
.shared-queue-main.main-content, .shared-my-locker-main.main-content,
.shared-coven-locker-main.main-content, .shared-coven-main.main-content,
.shared-settings-main.main-content,
.shared-my-wishlist-main.main-content, .shared-coven-wishlist-main.main-content { padding-top:0; }
.shared-coven-main.main-content .main-content { padding-top:0; }
.shared-page-main{min-width:0;}
.dashboard-layout .shared-search-main .search-wrap{max-width:1240px;margin:0 auto;padding:0 24px 40px;}

/* Discover (Search view): Locker-style full-bleed + poster-wall option */
#view-search .search-wrap{max-width:none;width:100%;margin:0;padding:0 24px 40px;}
@media (max-width:720px){#view-search .search-wrap{padding:0 16px 32px;}}
#view-search .result-grid{gap:var(--space-lg);margin-top:var(--space-xl);align-items:start;}
#view-search .filter-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
#view-search .filter-spacer{flex:1 1 auto;}
#view-search.discover-poster-only .result-info{display:none;}
#view-search.discover-poster-only .result-card{border-radius:var(--radius);}
/* Slightly denser hover when poster-only */
#view-search.discover-poster-only .result-card:hover{transform:translateY(-2px) scale(1.01);}
.dashboard-layout .shared-history-main .history-wrap{max-width:none;margin:0 auto;padding:0 28px 40px;}
.dashboard-layout .shared-profile-main{padding:0; display:block;}
.dashboard-layout .shared-profile-main #view-profile{min-height:100%;}
.dashboard-layout .shared-profile-main .profile-banner{margin:0; width:100%; min-height:160px;}
.dashboard-layout .shared-profile-main .profile-body{max-width:1100px; margin:0 auto; padding:0 24px 48px;}
.dashboard-layout .shared-profile-main .profile-avatar-row{position:relative; z-index:2; margin-top:-28px;}
.dashboard-layout .shared-settings-main .settings-wrap{margin:0 auto;padding-top:0 !important;}
/* Locker + Wishlist + Codex pages: use full available width, not the 860px history-wrap cap */
.dashboard-layout .shared-my-locker-main .history-wrap,
.dashboard-layout .shared-coven-locker-main .history-wrap,
.dashboard-layout .shared-my-wishlist-main .history-wrap,
.dashboard-layout .shared-coven-wishlist-main .history-wrap,
#view-history .history-wrap {
  max-width: none;
  padding: 0 28px 40px;
  margin: 0;
}
.page-header { padding-top:16px; margin-bottom:32px; border-bottom:1px solid var(--border); padding-bottom:20px; }
.page-header h2 { font-family:var(--font-occult); font-size:28px; font-weight:700; color:var(--gold-pale); letter-spacing:0.5px; }
.page-header p { color:var(--dust); font-family:var(--font-vhs); font-size:11px; letter-spacing:2px; margin-top:4px; text-transform:uppercase; }
.dash-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:28px; }
.stat-card { background:var(--deep); border:1px solid var(--border); border-radius:var(--radius); padding:18px; text-align:center; transition:border-color 0.2s; }
.stat-card:hover { border-color:var(--border-bright); }
.stat-label { font-family:var(--font-vhs); font-size:9px; letter-spacing:2px; text-transform:uppercase; color:var(--dust); margin-bottom:6px; }
.stat-value { font-family:var(--font-occult); font-size:30px; font-weight:700; color:var(--gold); text-shadow:0 0 20px rgba(201,151,58,0.3); }
.stat-sub { font-size:12px; color:var(--dust); margin-top:2px; font-family:var(--font-vhs); }
.dash-row { display:grid; grid-template-columns:1fr 340px; gap:14px; margin-bottom:28px; }
.card { background:var(--deep); border:1px solid var(--border); border-radius:var(--radius-lg); padding:22px; }
.card-title { font-family:var(--font-occult); font-size:14px; font-weight:600; letter-spacing:1px; color:var(--gold-pale); margin-bottom:16px; text-transform:uppercase; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--rim); padding-bottom:12px; }
.card-title a { font-family:var(--font-vhs); font-size:10px; letter-spacing:1px; color:var(--blood-bright); cursor:pointer; text-decoration:none; }
.card-title a:hover { color:var(--gold); }

/* EMPTY STATES */
.empty-state { text-align:center; padding:32px 20px; font-family:var(--font-grimoire); font-style:italic; color:var(--dust); font-size:15px; line-height:1.8; }
.empty-state-icon { font-size:32px; display:block; margin-bottom:10px; opacity:0.5; }
.empty-state-cta { margin-top:14px; display:inline-block; font-family:var(--font-vhs); font-size:10px; letter-spacing:2px; color:var(--gold); text-transform:uppercase; cursor:pointer; border-bottom:1px solid rgba(201,151,58,0.3); padding-bottom:2px; }
.empty-state-cta:hover { color:var(--gold-bright); border-color:var(--gold); }

/* WATCH ITEMS */
.watch-list { display:flex; flex-direction:column; gap:10px; }
.watch-item { display:flex; gap:12px; align-items:center; padding:11px 12px; border-radius:10px; transition:all 0.15s; cursor:pointer; border:1px solid transparent; }
.watch-item:hover { background:var(--chamber); border-color:var(--border-bright); box-shadow:0 8px 22px rgba(0,0,0,0.22); }
.watch-poster { width:42px; height:62px; border-radius:5px; background:var(--surface); object-fit:cover; flex-shrink:0; border:1px solid var(--border); filter:saturate(0.78); transition:filter 0.2s; }
.watch-item:hover .watch-poster { filter:saturate(1); }
.watch-info { flex:1; min-width:0; }
.watch-title { font-family:var(--font-occult); font-size:15px; line-height:1.2; color:var(--gold-pale); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-shadow:0 0 10px rgba(201,151,58,0.08); }
.watch-meta { font-family:var(--font-vhs); font-size:11px; color:var(--fog); letter-spacing:1.1px; margin-top:3px; line-height:1.35; }
.watch-tags { display:flex; gap:4px; flex-wrap:wrap; margin-top:6px; }
.tag { font-family:var(--font-vhs); font-size:9px; letter-spacing:1px; text-transform:uppercase; padding:2px 8px; border-radius:3px; background:var(--surface); color:var(--dust); border:1px solid var(--border); cursor:pointer; transition:all 0.15s; }
.tag:hover { border-color:var(--gold); color:var(--gold); }
.tag.gold { background:rgba(201,151,58,0.1); color:var(--gold); border-color:rgba(201,151,58,0.3); }
.watch-rating { font-family:var(--font-vhs); font-size:11px; color:var(--gold); white-space:nowrap; margin-left:8px; align-self:center; display:flex; align-items:center; }

.continue-rail { margin-bottom:28px; }
.continue-scroll { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:10px; }

/* ── RITUALS PAGE ── */
.rituals-wrap { padding:0 28px 48px; }
.rituals-page-header { padding-top:16px; margin-bottom:28px; border-bottom:1px solid var(--border); padding-bottom:20px; display:flex; align-items:flex-start; justify-content:space-between; flex-wrap:wrap; gap:12px; }
.rituals-page-header h2 { font-family:var(--font-occult); font-size:28px; font-weight:700; color:var(--gold-pale); letter-spacing:0.5px; }
.rituals-page-header p { font-family:var(--font-vhs); font-size:10px; letter-spacing:3px; text-transform:uppercase; color:var(--fog); margin-top:4px; }
.rituals-section { margin-bottom:40px; }
.rituals-section-header { display:flex; align-items:center; gap:12px; margin-bottom:16px; }
.rituals-section-title { font-family:var(--font-vhs); font-size:10px; letter-spacing:4px; text-transform:uppercase; color:var(--gold); opacity:0.9; }
.rituals-section-header::after { content:''; flex:1; height:1px; background:linear-gradient(90deg, rgba(201,151,58,0.25), transparent); }
.rituals-section-count { font-family:var(--font-vhs); font-size:9px; color:var(--fog); background:var(--surface); border:1px solid var(--border); border-radius:999px; padding:1px 7px; }
.rituals-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:1px; }
.ritual-card { position:relative; background:var(--deep); cursor:pointer; overflow:hidden; border-radius:var(--radius); border:1px solid rgba(180,120,60,0.12); transition:all 0.25s; }
.ritual-card:hover { transform:scale(1.04); z-index:2; border-color:rgba(201,151,58,0.35); box-shadow:0 16px 40px rgba(0,0,0,0.7),0 0 20px rgba(201,151,58,0.15); }
.ritual-card-poster { width:100%; aspect-ratio:2/3; object-fit:cover; display:block; filter:saturate(0.75) brightness(0.8); transition:filter 0.25s; }
.ritual-card:hover .ritual-card-poster { filter:saturate(1) brightness(0.95); }
.ritual-card-no-poster { width:100%; aspect-ratio:2/3; background:var(--chamber); display:flex; align-items:center; justify-content:center; font-size:36px; }
.ritual-status-badge { position:absolute; top:7px; left:7px; z-index:3; font-family:var(--font-vhs); font-size:8px; letter-spacing:1px; padding:3px 7px; border-radius:4px; font-weight:700; text-transform:uppercase; line-height:1; }
.ritual-status-badge.new-ep { background:rgba(180,30,30,0.95); color:#fff; border:1px solid rgba(255,80,80,0.5); box-shadow:0 0 10px rgba(200,40,40,0.4); animation:ritual-pulse 2s ease-in-out infinite; }
.ritual-status-badge.new-ep.out-today { background:rgba(220,50,50,0.97); border-color:rgba(255,120,120,0.7); box-shadow:0 0 14px rgba(220,50,50,0.6); letter-spacing:1.5px; }
.ritual-status-badge.airing-soon { background:rgba(201,151,58,0.95); color:#0a0810; border:1px solid rgba(230,185,80,0.8); font-weight:900; }
.ritual-status-badge.in-progress { background:rgba(10,8,20,0.82); color:var(--fog); border:1px solid rgba(180,120,60,0.25); }
.ritual-status-badge.caught-up { background:rgba(78,207,138,0.15); color:#4ecf8a; border:1px solid rgba(78,207,138,0.3); }
@keyframes ritual-pulse { 0%,100%{box-shadow:0 0 8px rgba(200,40,40,0.4)} 50%{box-shadow:0 0 16px rgba(200,40,40,0.7)} }
.ritual-air-pill { position:absolute; top:30px; left:7px; z-index:3; font-family:var(--font-vhs); font-size:9px; letter-spacing:0.5px; padding:3px 7px; border-radius:4px; background:rgba(0,0,0,0.88); backdrop-filter:blur(4px); line-height:1; font-weight:700; }
.ritual-air-pill.this-week { color:#fff; border:1px solid rgba(201,151,58,0.5); }
.ritual-air-pill.soon { color:rgba(255,255,255,0.7); border:1px solid rgba(120,100,60,0.3); }
.ritual-card-progress { position:absolute; bottom:0; left:0; right:0; height:3px; background:rgba(255,255,255,0.06); z-index:3; }
.ritual-card-progress-fill { height:100%; background:linear-gradient(90deg, rgba(201,151,58,0.6), rgba(230,190,95,0.95)); transition:width 0.3s; }
.ritual-card-info { position:absolute; bottom:0; left:0; right:0; background:linear-gradient(transparent, rgba(4,3,9,0.75) 25%, rgba(4,3,9,0.97) 100%); padding:32px 8px 10px; opacity:0; transform:translateY(6px); transition:opacity 0.2s, transform 0.2s; pointer-events:none; }
.ritual-card:hover .ritual-card-info { opacity:1; transform:translateY(0); }
.ritual-card-title { font-family:var(--font-occult); font-size:11px; color:var(--gold-pale); line-height:1.3; margin-bottom:3px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.ritual-card-next { font-family:var(--font-vhs); font-size:8px; color:rgba(255,255,255,0.55); letter-spacing:0.5px; margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ritual-card-airdate { font-family:var(--font-vhs); font-size:8px; color:var(--gold); letter-spacing:0.5px; margin-top:3px; }
.rituals-empty { text-align:center; padding:48px 24px; color:var(--dust); font-family:var(--font-grimoire); font-style:italic; font-size:15px; }
.rituals-loading { text-align:center; padding:48px 24px; }
.continue-card { border:1px solid var(--border); background:linear-gradient(180deg, rgba(191,165,106,0.05), rgba(12,10,20,0.68)); border-radius:12px; padding:10px; cursor:pointer; transition:all .15s; }
.continue-card:hover { border-color:var(--border-bright); background:var(--chamber); transform:translateY(-2px); }
.continue-head { display:flex; gap:10px; align-items:center; }
.continue-poster { width:42px; height:62px; border-radius:6px; border:1px solid var(--border); object-fit:cover; background:var(--surface); flex-shrink:0; }
.continue-title { font-family:var(--font-occult); font-size:13px; color:var(--gold-pale); line-height:1.1; max-height:2.2em; overflow:hidden; }
.continue-meta { font-family:var(--font-vhs); font-size:9px; letter-spacing:1px; color:var(--fog); margin-top:3px; text-transform:uppercase; line-height:1.35; }
.continue-progress { margin-top:8px; }
.continue-bar { height:6px; background:rgba(255,255,255,0.05); border:1px solid rgba(201,151,58,0.14); border-radius:999px; overflow:hidden; }
.continue-fill { height:100%; background:linear-gradient(90deg, rgba(201,151,58,0.55), rgba(230,190,95,0.9)); }
.continue-foot { margin-top:7px; display:flex; justify-content:space-between; align-items:center; gap:8px; }
.continue-next { font-family:var(--font-vhs); font-size:9px; letter-spacing:1px; color:var(--dust); line-height:1.35; text-transform:uppercase; }
.continue-btn { border:1px solid rgba(201,151,58,0.35); border-radius:999px; padding:4px 8px; font-family:var(--font-vhs); font-size:9px; letter-spacing:1px; color:var(--gold); background:rgba(201,151,58,0.06); white-space:nowrap; }
.continue-empty { padding:14px; border:1px dashed var(--border); border-radius:10px; color:var(--dust); font-family:var(--font-grimoire); font-style:italic; }

/* QUEUE */
.queue-list { display:flex; flex-direction:column; gap:8px; }

.queue-page-toolbar { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:12px; }
.queue-sort-btn { padding:7px 10px; border-radius:999px; border:1px solid var(--border); background:rgba(12,10,20,0.75); color:var(--dust); font-family:var(--font-vhs); font-size:10px; letter-spacing:1px; text-transform:uppercase; cursor:pointer; }
.queue-sort-btn.active { color:var(--gold); border-color:var(--gold); box-shadow:0 0 12px rgba(191,165,106,0.2) inset; }
.queue-reco-card { border:1px solid var(--border); background:linear-gradient(180deg, rgba(191,165,106,0.08), rgba(12,10,20,0.55)); border-radius:12px; padding:12px; margin-bottom:12px; }
.queue-reco-title { font-family:var(--font-occult); font-size:15px; color:var(--gold); margin-bottom:4px; }
.queue-reco-sub { font-family:var(--font-vhs); font-size:10px; letter-spacing:1px; color:var(--dust); text-transform:uppercase; margin-bottom:8px; }
.queue-reco-list { display:flex; flex-direction:column; gap:8px; }
.queue-page-empty { border:1px dashed var(--border); border-radius:12px; padding:14px; color:var(--dust); font-family:var(--font-grimoire); }


/* Queue — Locker-like full-bleed controls + dense poster wall */
#view-queue .history-wrap.queue-fullbleed{
  max-width: none;
  width: 100%;
  margin: 0;
  padding-left: 24px;
  padding-right: 24px;
}
@media (max-width: 700px){
  #view-queue .history-wrap.queue-fullbleed{ padding-left: 16px; padding-right: 16px; }
}

#view-queue .queue-controls-strip{
  margin: 0 0 var(--space-lg) 0;
  padding: 0 0 10px 0;
  border-bottom: 1px solid rgba(201,151,58,0.12);
}
#view-queue .queue-page-toolbar{ margin-bottom: 0; }
#view-queue .queue-display-spacer{ flex: 1 1 auto; min-width: 12px; }

/* Match Coven Locker poster density */
#view-queue .vc-queue-grid{ margin-top: var(--space-xl); }
#view-queue.queue-poster-only .vc-queue-grid-info{ display:none; }
#view-queue.queue-poster-only .vc-queue-grid-card{
  border-radius: 0;
  border: none;
}
#view-queue.queue-poster-only .vc-queue-grid-card:hover{
  transform: scale(1.04);
  box-shadow: 0 10px 28px rgba(0,0,0,0.5);
}
.queue-display-spacer { width:6px; }
.queue-item.compact .queue-poster { width:26px; height:38px; }
.queue-item.compact .queue-title { font-size:11px; }
.queue-item.compact .queue-meta { font-size:8px; }
.queue-item.expanded { align-items:flex-start; }
.queue-item.expanded .queue-poster { width:40px; height:58px; }
.queue-item.expanded .queue-title { white-space:normal; line-height:1.2; }
.queue-item.expanded .queue-meta { white-space:normal; line-height:1.35; }
.queue-voters { display:flex; align-items:center; gap:4px; flex-wrap:wrap; margin-top:5px; }
.voter-chip { display:inline-flex; align-items:center; justify-content:center; padding:2px 7px; border-radius:999px; border:1px solid rgba(201,151,58,0.18); background:rgba(18,14,28,0.85); font-family:var(--font-vhs); font-size:8px; letter-spacing:1px; color:var(--dust); text-transform:lowercase; max-width:96px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.voter-chip.me { border-color:rgba(201,151,58,0.35); color:var(--gold); }
.voter-chip.more { color:var(--fog); }
.queue-auto-icon { display:none; }
.queue-auto-badge { display:inline-flex; align-items:center; justify-content:center; min-width:24px; height:18px; padding:0 6px; border-radius:999px; border:1px solid rgba(201,151,58,0.28); background:linear-gradient(180deg, rgba(201,151,58,0.14), rgba(12,10,20,0.7)); color:var(--gold); font-family:var(--font-vhs); font-size:10px; letter-spacing:1px; box-shadow:0 0 10px rgba(201,151,58,0.08) inset; }
.queue-auto-badge .sigil { font-size:11px; line-height:1; transform:translateY(-0.5px); }

.queue-item { display:flex; gap:10px; align-items:center; padding:8px; border-radius:6px; cursor:pointer; transition:all 0.15s; border:1px solid transparent; }
.queue-item:hover { background:var(--chamber); border-color:var(--rim); }
.queue-poster { width:32px; height:46px; border-radius:4px; background:var(--surface); object-fit:cover; flex-shrink:0; border:1px solid var(--border); filter:saturate(0.6); }
.queue-info { flex:1; min-width:0; }
.queue-title { font-family:var(--font-occult); font-size:12px; color:var(--static); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.queue-meta { font-family:var(--font-vhs); font-size:9px; color:var(--dust); letter-spacing:1px; margin-top:2px; }
.queue-picker { font-family:var(--font-vhs); font-size:9px; color:var(--fog); margin-top:2px; }
.vote-wrap { display:flex; flex-direction:column; align-items:center; gap:2px; }
.vote-btn { width:22px; height:22px; border-radius:4px; border:1px solid var(--border); background:var(--surface); color:var(--dust); cursor:pointer; font-size:11px; display:flex; align-items:center; justify-content:center; transition:all 0.15s; }
.vote-btn:hover { border-color:var(--gold); color:var(--gold); }
.vote-btn.voted { border-color:var(--blood-bright); color:#e07070; background:rgba(139,26,26,0.15); }
.vote-count { font-family:var(--font-vhs); font-size:10px; color:var(--dust); }

/* SEARCH */
#view-search { background:var(--void); }
.search-wrap { max-width:920px; margin:0 auto; padding:16px 32px 40px; }
.search-bar-container { position:relative; margin-bottom:18px; }
.search-bar { width:100%; padding:14px 20px 14px 50px; background:var(--deep); border:1px solid var(--border); border-radius:var(--radius); color:var(--static); font-family:var(--font-grimoire); font-size:16px; font-style:italic; outline:none; transition:all 0.2s; }
.search-bar:focus { border-color:var(--border-bright); box-shadow:0 0 0 3px rgba(201,151,58,0.08),0 0 20px rgba(201,151,58,0.1); }
.search-bar::placeholder { color:var(--dust); font-style:italic; }
.search-icon { position:absolute; left:16px; top:50%; transform:translateY(-50%); font-size:18px; pointer-events:none; }
.filter-row { display:flex; gap:6px; flex-wrap:wrap; }
.filter-chip { font-family:var(--font-vhs); font-size:10px; letter-spacing:2px; text-transform:uppercase; padding:6px 14px; border-radius:3px; background:var(--deep); border:1px solid var(--border); color:var(--dust); cursor:pointer; transition:all 0.15s; }
.filter-chip:hover { border-color:var(--gold); color:var(--gold); }
.filter-chip.active { border-color:var(--blood-bright); color:#e07070; background:rgba(139,26,26,0.1); }
.results-label { font-family:var(--font-vhs); font-size:10px; letter-spacing:3px; text-transform:uppercase; color:var(--dust); margin-bottom:16px; margin-top:24px; }
.result-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:14px; }
.result-card { border-radius:var(--radius); overflow:hidden; background:var(--deep); border:1px solid var(--border); cursor:pointer; transition:all 0.25s; position:relative; }
.result-card:hover { transform:translateY(-5px) scale(1.02); border-color:var(--border-bright); box-shadow:0 16px 40px rgba(0,0,0,0.7),0 0 20px rgba(201,151,58,0.15); }
.result-poster { width:100%; aspect-ratio:2/3; object-fit:cover; display:block; background:var(--chamber); filter:saturate(0.7) brightness(0.8); transition:filter 0.25s; }
.result-card:hover .result-poster { filter:saturate(0.9) brightness(1); }
.result-info { padding:8px 10px 10px; }
.result-title { font-family:var(--font-occult); font-size:11px; color:var(--static); line-height:1.4; margin-bottom:3px; }
.result-year { font-family:var(--font-vhs); font-size:9px; color:var(--dust); letter-spacing:1px; }
.result-rating { position:absolute; top:6px; right:6px; background:rgba(0,0,0,0.8); backdrop-filter:blur(6px); border:1px solid rgba(201,151,58,0.3); border-radius:3px; padding:2px 6px; font-family:var(--font-vhs); font-size:10px; color:var(--gold); }
.result-overlay { position:absolute; inset:0; background:rgba(5,4,7,0.82); backdrop-filter:blur(4px); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; opacity:0; transition:opacity 0.2s; }
.result-card:hover .result-overlay { opacity:1; }

/* HISTORY */
#view-history { background:var(--void); }
.history-wrap { max-width:860px; margin:0 auto; padding:16px 32px 40px; }
.timeline { position:relative; }
.timeline::before { content:''; position:absolute; left:18px; top:0; bottom:0; width:1px; background:linear-gradient(180deg,var(--border),var(--rim),var(--border)); }
.timeline-month { margin-bottom:36px; }
.timeline-month-label { font-family:var(--font-occult); font-size:11px; letter-spacing:3px; text-transform:uppercase; color:var(--gold); margin-bottom:16px; margin-left:46px; opacity:0.8; }
.timeline-item { display:flex; gap:14px; margin-bottom:12px; }
.timeline-dot { width:36px; height:36px; border-radius:6px; flex-shrink:0; background:var(--chamber); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; font-size:16px; position:relative; z-index:1; }
.timeline-content { flex:1; background:var(--deep); border:1px solid var(--border); border-radius:var(--radius); padding:12px 16px; cursor:pointer; transition:all 0.15s; }
.timeline-content:hover { border-color:var(--border-bright); background:var(--chamber); }
.timeline-content-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:4px; }
.timeline-title { font-family:var(--font-occult); font-size:13px; color:var(--static); }
.timeline-date { font-family:var(--font-vhs); font-size:10px; color:var(--dust); letter-spacing:1px; }
.timeline-meta { font-family:var(--font-vhs); font-size:10px; color:var(--dust); letter-spacing:1px; }
.timeline-members { display:flex; gap:5px; align-items:center; margin-top:7px; flex-wrap:wrap; }
.member-chip { font-family:var(--font-vhs); font-size:9px; letter-spacing:1px; padding:2px 7px; border-radius:3px; background:var(--surface); border:1px solid var(--border); color:var(--fog); }

/* PROFILE */
#view-profile { background:var(--void); }
.profile-banner { height:160px; background:linear-gradient(135deg,rgba(139,26,26,0.2),rgba(5,4,7,0.8),rgba(201,151,58,0.08)); border-bottom:1px solid var(--border); position:relative; overflow:hidden; }
.profile-banner-sigil { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); opacity:0.06; font-size:200px; color:var(--gold); font-family:var(--font-occult); pointer-events:none; }
.profile-body { max-width:960px; margin:0 auto; padding:0 32px 48px; }
.profile-avatar-row { display:flex; align-items:flex-end; gap:20px; margin-top:-44px; margin-bottom:24px; }
.profile-avatar { width:88px; height:88px; border-radius:12px; background:linear-gradient(135deg,var(--blood),var(--surface)); border:2px solid var(--border-bright); display:flex; align-items:center; justify-content:center; font-family:var(--font-occult); font-size:32px; font-weight:700; color:var(--gold); flex-shrink:0; box-shadow:0 0 24px rgba(139,26,26,0.4); }
.profile-name-col h2 { font-family:var(--font-occult); font-size:22px; font-weight:700; color:var(--gold-pale); }
.profile-name-col p { font-family:var(--font-vhs); font-size:10px; letter-spacing:2px; color:var(--dust); margin-top:3px; text-transform:uppercase; }
.profile-stats-row { display:flex; gap:28px; margin-bottom:28px; padding-bottom:22px; border-bottom:1px solid var(--border); flex-wrap:wrap; }
.pstat-num { font-family:var(--font-occult); font-size:22px; font-weight:700; color:var(--gold); }
.pstat-label { font-family:var(--font-vhs); font-size:9px; letter-spacing:2px; color:var(--dust); text-transform:uppercase; margin-top:2px; }
.profile-grid { display:grid; grid-template-columns:1fr 280px; gap:20px; }
.genre-bar-row { margin-bottom:12px; }
.genre-bar-label { display:flex; justify-content:space-between; font-family:var(--font-vhs); font-size:10px; letter-spacing:1px; text-transform:uppercase; color:var(--fog); margin-bottom:4px; }
.genre-bar-track { height:4px; background:var(--surface); border-radius:2px; overflow:hidden; }
.genre-bar-fill { height:100%; background:linear-gradient(90deg,var(--blood),var(--gold)); border-radius:2px; transition:width 1.2s ease; }

/* MODAL */
.modal-backdrop { position:fixed; inset:0; background:rgba(0,0,0,0.88); backdrop-filter:blur(10px); z-index:200; display:none; align-items:center; justify-content:center; padding:20px; }
.modal-backdrop.open { display:flex; }
.modal { background:var(--deep); border:1px solid var(--border-bright); border-radius:var(--radius-lg); width:100%; max-width:860px; max-height:90vh; overflow-y:auto; overflow-x:hidden; box-shadow:0 0 60px rgba(139,26,26,0.3),0 32px 80px rgba(0,0,0,0.8); animation:scaleIn 0.2s ease; display:flex; flex-direction:column; }
.modal .modal-body { flex:1; min-height:0; overflow-y:auto; overflow-x:hidden; }
.modal-top-line { height:1px; background:linear-gradient(90deg,transparent,var(--gold),transparent); }
.modal-header { padding:20px 22px 0; display:flex; justify-content:space-between; align-items:flex-start; gap:16px; }
.modal-close { width:30px; height:30px; border-radius:6px; border:1px solid var(--border); background:var(--chamber); color:var(--dust); cursor:pointer; font-size:14px; display:flex; align-items:center; justify-content:center; transition:all 0.15s; flex-shrink:0; font-family:var(--font-vhs); }
.modal-close:hover { border-color:var(--blood-bright); color:#e07070; }
.modal-body { padding:18px 22px 24px; }
.modal-movie-header { display:flex; gap:16px; margin-bottom:20px; }
.modal-poster { width:90px; height:134px; border-radius:6px; flex-shrink:0; background:var(--surface); object-fit:cover; border:1px solid var(--border); filter:saturate(0.8); }
.modal-title { font-family:var(--font-occult); font-size:18px; font-weight:700; color:var(--gold-pale); margin-bottom:6px; }
.modal-meta { font-family:var(--font-vhs); font-size:10px; letter-spacing:2px; color:var(--dust); text-transform:uppercase; margin-bottom:10px; }
.modal-overview { font-family:var(--font-grimoire); font-style:italic; font-size:15px; color:var(--fog); line-height:1.7; }
.modal-divider { height:1px; background:var(--border); margin:16px 0; }
.modal-section-label { font-family:var(--font-vhs); font-size:9px; letter-spacing:3px; text-transform:uppercase; color:var(--dust); margin-bottom:10px; }
.star-row { display:flex; gap:3px; align-items:center; }
.star { font-size:16px; cursor:pointer; color:var(--dust); transition:color 0.1s; }
.star.lit { color:var(--gold); text-shadow:0 0 8px rgba(201,151,58,0.5); }
.rating-val { font-family:var(--font-vhs); font-size:13px; color:var(--fog); margin-left:8px; }
.textarea { width:100%; background:var(--chamber); border:1px solid var(--border); border-radius:6px; padding:10px 12px; color:var(--static); font-family:var(--font-grimoire); font-style:italic; font-size:15px; outline:none; resize:vertical; min-height:72px; line-height:1.6; transition:border-color 0.2s; }
.textarea:focus { border-color:var(--border-bright); }
.tag-input { background:var(--chamber); border:1px solid var(--border); border-radius:6px; padding:8px 12px; color:var(--static); font-family:var(--font-vhs); font-size:11px; letter-spacing:1px; outline:none; transition:border-color 0.2s; flex:1; }
.tag-input:focus { border-color:var(--border-bright); }
.modal-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:16px; padding-top:16px; border-top:1px solid var(--border); }

/* WATCHED MODAL OVERHAUL */
.modal-poster-large { width:140px; height:210px; border-radius:8px; flex-shrink:0; background:var(--surface); object-fit:cover; border:1px solid var(--border); filter:saturate(0.85); position:relative; }
.modal-poster-wrap { position:relative; flex-shrink:0; }
.picker-badge { position:absolute; bottom:6px; left:0; right:0; text-align:center; font-family:var(--font-vhs); font-size:8px; letter-spacing:1px; text-transform:uppercase; background:rgba(139,26,26,0.92); color:var(--gold-pale); padding:3px 6px; border-top:1px solid var(--blood-bright); }
.rewatch-tag { display:inline-flex; align-items:center; gap:4px; font-family:var(--font-vhs); font-size:9px; letter-spacing:1px; text-transform:uppercase; padding:3px 8px; border-radius:3px; border:1px solid var(--border); color:var(--dust); cursor:pointer; transition:all 0.15s; }
.rewatch-tag.active { background:rgba(201,151,58,0.12); color:var(--gold); border-color:var(--gold); }
.watch-history-list { display:flex; flex-direction:column; gap:6px; margin-bottom:14px; }
.watch-history-entry { display:flex; align-items:center; gap:10px; padding:8px 12px; background:var(--chamber); border:1px solid var(--border); border-radius:6px; }
.watch-history-entry.is-rewatch { border-color:rgba(201,151,58,0.25); background:rgba(201,151,58,0.04); }
.watch-history-icon { font-size:13px; flex-shrink:0; }
.watch-history-date-input { background:transparent; border:none; color:var(--static); font-family:var(--font-vhs); font-size:11px; letter-spacing:1px; outline:none; flex:1; cursor:pointer; }
.watch-history-date-input::-webkit-calendar-picker-indicator { opacity:0; width:0; padding:0; margin:0; display:none; }
.watch-history-date-input::-webkit-inner-spin-button { display:none; }
.watch-history-date-input:hover { color:var(--gold); }
.watch-history-badge { font-family:var(--font-vhs); font-size:8px; letter-spacing:1px; text-transform:uppercase; padding:2px 6px; border-radius:3px; background:rgba(201,151,58,0.1); color:var(--gold); border:1px solid rgba(201,151,58,0.25); flex-shrink:0; }
.watch-history-badge.rewatch-badge { background:rgba(139,26,26,0.12); color:#e07070; border-color:rgba(139,26,26,0.3); }
.watch-history-badge.wt-badge { background:rgba(201,151,58,0.10); color:var(--gold); border-color:rgba(201,151,58,0.28); }
.watch-history-badge.kind-badge { background:rgba(122,92,255,0.08); color:var(--ink-soft); border-color:rgba(122,92,255,0.20); }
.watch-history-badge.first-watch-badge { background:rgba(201,151,58,0.12); color:var(--gold-pale); border-color:rgba(201,151,58,0.45); font-weight:700; }
.codex-flag-stack { position:absolute; top:6px; left:6px; display:flex; flex-direction:column; gap:4px; align-items:flex-start; }
.codex-flag { background:rgba(0,0,0,0.82); border:1px solid rgba(201,151,58,0.25); border-radius:4px; padding:2px 5px; font-family:var(--font-vhs); font-size:8px; color:var(--gold-pale); letter-spacing:1px; line-height:1; }
.codex-flag.ep { }
.codex-flag.rw { background:rgba(201,151,58,0.88); color:#0a0810; border-color:rgba(201,151,58,0.95); font-weight:700; }
.codex-flag.wt { background:rgba(201,151,58,0.12); color:var(--gold); border-color:rgba(201,151,58,0.35); }
.continue-mini-badges { display:flex; gap:4px; margin-top:4px; flex-wrap:wrap; }
.continue-mini-badge { display:inline-flex; align-items:center; padding:2px 6px; border-radius:999px; border:1px solid rgba(201,151,58,0.25); background:rgba(0,0,0,0.35); color:var(--gold-pale); font-family:var(--font-vhs); font-size:8px; letter-spacing:1px; line-height:1; }
.continue-mini-badge.wt { color:var(--gold); border-color:rgba(201,151,58,0.35); background:rgba(201,151,58,0.08); }
.watch-history-del { width:20px; height:20px; border-radius:4px; border:1px solid transparent; background:transparent; color:var(--dust); cursor:pointer; font-size:11px; display:flex; align-items:center; justify-content:center; transition:all 0.15s; flex-shrink:0; }
.watch-history-del:hover { border-color:rgba(139,26,26,0.4); color:#e07070; background:rgba(139,26,26,0.1); }

.watch-history-badge.vc-tl-start{border-color:rgba(104,148,255,.45);background:rgba(48,72,130,.18);color:#b9d2ff;}
.watch-history-badge.vc-tl-finish{border-color:rgba(88,190,132,.45);background:rgba(34,90,58,.18);color:#b9f0c8;}
.watch-history-badge.vc-tl-progress{border-color:rgba(220,160,66,.45);background:rgba(120,78,20,.16);color:#f1cd84;}
.watch-history-precision{font-family:var(--font-vhs);font-size:8px;letter-spacing:1px;text-transform:uppercase;padding:2px 6px;border-radius:3px;border:1px solid rgba(201,151,58,0.18);background:rgba(201,151,58,0.06);color:var(--fog);}
.watch-date-editor-backdrop{position:fixed;inset:0;background:rgba(5,6,12,.82);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;z-index:2500;padding:20px;}
.watch-date-editor{width:min(760px,100%);background:linear-gradient(180deg,rgba(14,12,28,.99),rgba(10,9,20,.99));border:1px solid rgba(194,142,63,.38);border-radius:16px;box-shadow:0 28px 80px rgba(0,0,0,.65), inset 0 0 0 1px rgba(194,142,63,.12);padding:22px 24px 20px;}
.watch-date-editor-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:16px;}
.watch-date-editor-title{font-family:var(--font-vhs);font-size:10px;letter-spacing:2px;color:var(--gold);text-transform:uppercase;}
.watch-date-editor-close{background:rgba(194,142,63,.08);border:1px solid rgba(194,142,63,.28);color:var(--fog);border-radius:8px;padding:5px 10px;cursor:pointer;font-size:14px;transition:border-color .15s,color .15s;}
.watch-date-editor-close:hover{border-color:rgba(194,142,63,.55);color:var(--gold);}
.watch-date-precision-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-bottom:14px;}
.watch-date-precision-btn{border:1px solid rgba(201,151,58,.18);background:rgba(255,255,255,.01);color:var(--fog);border-radius:8px;padding:7px 6px;font-family:var(--font-vhs);font-size:9px;letter-spacing:1px;cursor:pointer;}
.watch-date-precision-btn.active{border-color:rgba(201,151,58,.55);background:rgba(201,151,58,.10);color:var(--gold);}
.watch-date-editor-panel{border:1px solid rgba(194,142,63,.18);border-radius:10px;padding:14px 16px;background:linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,.006));margin-bottom:4px;}
.watch-date-editor-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.watch-date-editor-field{display:flex;flex-direction:column;gap:4px;}
.watch-date-editor-field label{font-family:var(--font-vhs);font-size:9px;letter-spacing:1.5px;color:var(--gold-pale);text-transform:uppercase;margin-bottom:2px;display:block;}
.watch-date-editor-field input,.watch-date-editor-field select{width:100%;height:42px;background:rgba(8,11,14,.98);color:var(--static);border:1px solid rgba(201,151,58,.28);border-radius:8px;padding:0 10px;font-family:var(--font-vhs);font-size:12px;letter-spacing:1px;outline:none;box-shadow:inset 0 0 0 1px rgba(0,0,0,.15);color-scheme:dark;}
.watch-date-editor-field input::placeholder{color:rgba(201,151,58,.45);}
.watch-date-editor-field input:focus,.watch-date-editor-field select:focus{border-color:rgba(201,151,58,.55);box-shadow:0 0 0 2px rgba(201,151,58,.12), inset 0 0 0 1px rgba(201,151,58,.08);}
.watch-date-editor-field input[type="number"]{appearance:textfield;-moz-appearance:textfield;}
.watch-date-editor-field input[type="date"],.watch-date-editor-field input[type="month"],.watch-date-editor-field input[type="time"]{min-height:36px;}
.watch-date-editor-field input[type="date"]::-webkit-calendar-picker-indicator,.watch-date-editor-field input[type="month"]::-webkit-calendar-picker-indicator,.watch-date-editor-field input[type="time"]::-webkit-calendar-picker-indicator{filter:invert(72%) sepia(18%) saturate(658%) hue-rotate(355deg) brightness(92%) contrast(90%);cursor:pointer;}
.watch-date-editor-field select{cursor:pointer;background-image:linear-gradient(45deg,transparent 50%, rgba(201,151,58,.8) 50%),linear-gradient(135deg, rgba(201,151,58,.8) 50%, transparent 50%);background-position:calc(100% - 16px) 13px, calc(100% - 11px) 13px;background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:28px;appearance:none;-webkit-appearance:none;-moz-appearance:none;}
.watch-date-editor-note{font-family:var(--font-vhs);font-size:9px;letter-spacing:1px;color:var(--dust);opacity:.9;margin-top:6px;}
.watch-date-editor-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:16px;}
@media (max-width: 640px){.watch-date-precision-grid{grid-template-columns:1fr 1fr;}.watch-date-editor-grid{grid-template-columns:1fr;}}

.watch-history-flex-btn{font-family:var(--font-vhs);font-size:8px;letter-spacing:1px;text-transform:uppercase;padding:2px 6px;border-radius:3px;border:1px solid var(--border);background:transparent;color:var(--dust);cursor:pointer;}
.watch-history-flex-btn:hover{border-color:var(--gold);color:var(--gold);}
.member-ratings { display:flex; flex-direction:column; gap:8px; margin-top:8px; }
.member-rating-row { display:flex; align-items:center; gap:10px; }
.member-rating-avatar { width:24px; height:24px; border-radius:5px; background:linear-gradient(135deg,var(--blood),var(--surface)); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; font-family:var(--font-occult); font-size:10px; font-weight:700; color:var(--gold); flex-shrink:0; }
.member-rating-name { font-family:var(--font-vhs); font-size:10px; color:var(--fog); letter-spacing:1px; flex:1; text-transform:uppercase; }
.member-rating-stars { display:flex; gap:2px; }
.member-rating-star { font-size:11px; color:var(--dust); }
.member-rating-star.lit { color:var(--gold); }
.member-rating-val { font-family:var(--font-vhs); font-size:10px; color:var(--gold); margin-left:4px; }

/* CODEX POSTER GRID */
.codex-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:1px; align-items:start; }
.codex-card { position:relative; border-radius:var(--radius); overflow:hidden; cursor:pointer; border:1px solid rgba(180,120,60,0.12); transition:all 0.25s; background:var(--deep); }
.codex-card:hover { transform:scale(1.04); z-index:2; border-color:rgba(201,151,58,0.35); box-shadow:0 16px 40px rgba(0,0,0,0.7),0 0 20px rgba(201,151,58,0.15); }
.codex-card:focus-visible { outline:none; border-color:var(--gold); box-shadow:0 0 0 2px rgba(201,151,58,0.18), 0 8px 28px rgba(0,0,0,.55); }
.codex-card-poster { width:100%; aspect-ratio:2/3; object-fit:cover; display:block; filter:saturate(0.7) brightness(0.8); transition:filter 0.25s; }
.codex-card:hover .codex-card-poster { filter:saturate(1) brightness(0.95); }
.codex-card-info { padding:8px 10px 10px; min-height:52px; display:flex; flex-direction:column; justify-content:space-between; }
.codex-card-title { font-family:var(--font-occult); font-size:12px; color:var(--static); line-height:1.35; margin-bottom:4px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:2lh; flex:1; }
.codex-card-meta { font-family:var(--font-vhs); font-size:9px; color:var(--fog); letter-spacing:1px; flex-shrink:0; margin-top:2px; }
.codex-card-rating { position:absolute; top:6px; right:6px; background:rgba(0,0,0,0.85); backdrop-filter:blur(4px); border:1px solid rgba(201,151,58,0.3); border-radius:3px; padding:2px 6px; font-family:var(--font-vhs); font-size:10px; color:var(--gold); }
.codex-card-picker { display:inline-flex; align-items:center; align-self:flex-start; gap:4px; margin-bottom:6px; background:rgba(139,26,26,0.22); border:1px solid rgba(196,63,63,0.35); border-radius:999px; padding:2px 7px; font-family:var(--font-vhs); font-size:8px; letter-spacing:1px; color:var(--gold-pale); text-transform:uppercase; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.codex-no-poster { width:100%; aspect-ratio:2/3; background:var(--chamber); display:flex; align-items:center; justify-content:center; font-size:36px; }
.codex-search{flex:1 1 240px;min-width:220px}
.codex-select{background:var(--codex-control-bg);border:1px solid var(--codex-control-border);color:var(--codex-control-text);border-radius:8px;padding:8px 10px;font-family:var(--font-vhs);font-size:10px;letter-spacing:1px;min-width:130px}
.codex-chip{border:1px solid var(--codex-chip-border);background:var(--codex-chip-bg);color:var(--codex-chip-text);border-radius:999px;padding:6px 10px;font-family:var(--font-vhs);font-size:10px;letter-spacing:1px;cursor:pointer}
.codex-chip.active{border-color:var(--codex-chip-border-active);background:var(--codex-chip-bg-active);color:var(--codex-chip-text-active)}
.codex-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 14px}
.codex-stat{border:1px solid var(--border);border-radius:12px;background:linear-gradient(180deg,var(--codex-stat-bg-a, rgba(22,14,40,.7)), var(--codex-stat-bg-b, rgba(10,8,18,.85)));padding:10px 12px}
.codex-stat .k{font-family:var(--font-occult);font-size:18px;color:var(--gold);line-height:1.1}
.codex-stat .l{font-family:var(--font-vhs);font-size:9px;letter-spacing:1.3px;color:var(--dust);margin-top:2px}
.codex-list{display:grid;gap:8px}
.codex-list-item{display:grid;grid-template-columns:52px 1fr auto;gap:10px;align-items:center;border:1px solid var(--border);border-radius:10px;padding:7px 9px;background:rgba(18,12,30,.7);cursor:pointer}
.codex-list-item:hover{border-color:var(--border-bright);background:rgba(25,17,40,.82)}
.codex-list-thumb{width:52px;height:72px;border-radius:6px;object-fit:cover;background:var(--chamber)}
.codex-list-title{font-family:var(--font-occult);font-size:12px;color:var(--static);line-height:1.25}
.codex-list-meta{font-family:var(--font-vhs);font-size:9px;letter-spacing:1px;color:var(--fog);margin-top:2px}
.codex-list-side{text-align:right;font-family:var(--font-vhs);font-size:9px;color:var(--dust);letter-spacing:1px}
.codex-toolbar{display:grid;gap:10px;margin:2px 0 14px}
.codex-toolbar-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.codex-search{height:36px;padding:0 12px;border-radius:10px;background:rgba(14,10,24,.82)}
.codex-select{height:36px;border-radius:10px;padding:0 12px;min-width:136px;background:rgba(14,10,24,.82)}
.codex-chip{height:34px;display:inline-flex;align-items:center;justify-content:center;padding:0 12px;border-radius:999px}
.codex-active-row{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 0}
.codex-active-pill{display:inline-flex;align-items:center;gap:6px;border:1px solid rgba(201,151,58,.25);background:rgba(201,151,58,.06);color:var(--fog);border-radius:999px;padding:4px 10px;font-family:var(--font-vhs);font-size:10px;letter-spacing:1px}
.codex-active-pill b{color:var(--gold);font-weight:600}
.codex-active-pill button{all:unset;cursor:pointer;color:var(--gold);padding-left:2px}
.codex-stats{gap:12px;margin:2px 0 16px}
.codex-stat{padding:12px 14px;display:flex;flex-direction:column;justify-content:space-between;min-height:58px}
.codex-stat .k{line-height:1;margin-bottom:6px}
.codex-stat .l{margin-top:auto}
.codex-stat.codex-stat-breakdown .k{font-size:17px;letter-spacing:0;white-space:nowrap;line-height:1.05;margin-bottom:4px;font-variant-numeric:tabular-nums;padding-top:2px}
.codex-card{overflow:hidden}
.codex-card-poster-wrap{position:relative;overflow:hidden}
.codex-card-overlay-picker{position:absolute;top:6px;right:6px;left:auto;bottom:auto;pointer-events:none;display:block;width:auto;max-width:none;border:0 !important;outline:0 !important;background:transparent !important}
.codex-card-overlay-picker .codex-card-picker{margin:0;max-width:92px;background:rgba(0,0,0,.82);border-color:rgba(201,151,58,.28);display:inline-flex;padding:2px 6px;font-size:7px;letter-spacing:.9px;gap:3px;vertical-align:top}
.codex-card-overlay-picker .codex-card-picker .pill-label{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block}
.codex-card.codex-card-compact .codex-card-poster,.codex-card.codex-card-compact .codex-no-poster{aspect-ratio:2/3}
/* Poster Only hover overlay — gradient + info slides up from bottom */
.codex-card.codex-card-compact .codex-card-info {
  display: flex !important;
  position: absolute;
  bottom: 0; left: 0; right: 0;
  background: linear-gradient(transparent 0%, rgba(4,3,9,0.72) 28%, rgba(4,3,9,0.97) 100%);
  padding: 28px 8px 8px;
  flex-direction: column;
  justify-content: flex-end;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity 0.2s ease, transform 0.2s ease;
  pointer-events: none;
  min-height: unset;
}
.codex-card.codex-card-compact:hover .codex-card-info {
  opacity: 1;
  transform: translateY(0);
}
.codex-card.codex-card-compact .codex-card-title {
  font-size: 10px;
  -webkit-line-clamp: 2;
  min-height: unset;
  margin-bottom: 2px;
  color: #fff;
}
.codex-card.codex-card-compact .codex-card-meta {
  font-size: 8px;
  color: rgba(255,255,255,0.6);
  margin-top: 1px;
}
.codex-card.codex-card-compact .codex-card-info .codex-card-picker {
  display: none;
}
.codex-grid-compact { gap:1px !important; }
.codex-grid-compact .codex-card { border:1px solid rgba(180,120,60,0.12) !important; border-radius:var(--radius) !important; }
.codex-grid-compact .codex-card:hover { transform:scale(1.04); z-index:2; border-color:rgba(201,151,58,0.35) !important; box-shadow:0 6px 24px rgba(0,0,0,0.7); }
.timeline-month:has(.codex-grid-compact) .timeline-month-label-v2 { margin-bottom:6px; }

.codex-toolbar,.codex-stats,.codex-grid,.codex-list{border-left:none !important;}
.codex-wrap,.view-codex .content-shell{border-left-color:transparent;}
.view-codex .timeline::before{display:none !important;}
.timeline.codex-mode::before{display:none !important; content:none !important; width:0 !important; background:transparent !important; border:none !important;}
#timeline.codex-mode::before{display:none !important; content:none !important; width:0 !important; background:transparent !important; border:none !important;}
.codex-stat .k{font-weight:700;}
.codex-stat .l{font-weight:600;color:#8e86a9;}
.codex-stat.codex-stat-breakdown{align-items:flex-start;justify-content:center;}
.codex-stat.codex-stat-breakdown .k,.codex-stat.codex-stat-breakdown .l{width:100%;}
.codex-stat.codex-stat-breakdown .k{margin-bottom:6px;padding-top:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));text-align:left;}
.codex-stat.codex-stat-breakdown .k span{display:block;text-align:left;}
.codex-stat.codex-stat-breakdown .l{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));text-align:left;}
.codex-stat.codex-stat-breakdown .l span{display:block;text-align:left;}
.codex-card-rating{height:18px;display:inline-flex;align-items:center;justify-content:center;padding:0 6px;font-size:8px;line-height:1;border-radius:4px;}
.codex-card-overlay-picker .codex-card-picker{height:18px;display:inline-flex;align-items:center;padding:0 6px;font-size:8px;line-height:1;border-radius:999px;max-width:110px;box-sizing:border-box;}

@media (max-width:900px){.codex-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* TV SHOW MODAL NAVIGATION */
.modal-nav-back { display:inline-flex; align-items:center; gap:6px; font-family:var(--font-vhs); font-size:10px; letter-spacing:2px; text-transform:uppercase; color:var(--dust); cursor:pointer; margin-bottom:16px; padding:6px 10px; border-radius:4px; border:1px solid var(--border); background:transparent; transition:all 0.15s; }
.modal-nav-back:hover { color:var(--gold); border-color:var(--gold); background:rgba(201,151,58,0.05); }
.modal-nav-breadcrumb { font-family:var(--font-vhs); font-size:9px; letter-spacing:2px; text-transform:uppercase; color:var(--dust); margin-bottom:14px; display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
/* Breadcrumb chips for legibility */
.modal-nav-breadcrumb .sep { display:none; }
.modal-nav-breadcrumb .crumb { display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:999px; border:1px solid rgba(255,214,140,0.16); background:rgba(255,214,140,0.05); color:var(--fog); cursor:pointer; transition:transform 0.12s, background 0.12s, border-color 0.12s; }
.modal-nav-breadcrumb .crumb:hover { background:rgba(255,214,140,0.08); border-color:rgba(255,214,140,0.26); transform:translateY(-1px); }
.modal-nav-breadcrumb .crumb.current { background:rgba(255,214,140,0.10); border-color:rgba(255,214,140,0.34); color:var(--gold); cursor:default; transform:none; }
.series-rating-block { background:var(--chamber); border:1px solid var(--border); border-radius:8px; padding:16px; margin-bottom:16px; }
.series-rating-block .srl-title { font-family:var(--font-vhs); font-size:9px; letter-spacing:2px; text-transform:uppercase; color:var(--dust); margin-bottom:10px; }
.series-rating-block .srl-stars { display:flex; gap:4px; align-items:center; margin-bottom:8px; }
.series-rating-block .srl-star { font-size:20px; cursor:pointer; color:var(--dust); transition:all 0.1s; line-height:1; }
.series-rating-block .srl-star.lit { color:var(--gold); text-shadow:0 0 10px rgba(201,151,58,0.5); }
.series-rating-block .srl-val { font-family:var(--font-vhs); font-size:14px; color:var(--fog); margin-left:6px; }
.series-rating-block .srl-coven { display:flex; flex-direction:column; gap:5px; margin-top:10px; padding-top:10px; border-top:1px solid var(--border); }
.series-rating-block .srl-picker { display:flex; gap:8px; margin-top:10px; }
.season-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(110px,1fr)); gap:12px; margin-top:4px; }
.season-card { border-radius:var(--radius); overflow:hidden; cursor:pointer; border:1px solid var(--border); transition:all 0.2s; background:var(--deep); position:relative; }
.season-card:hover { transform:translateY(-3px) scale(1.03); border-color:var(--gold); box-shadow:0 10px 28px rgba(0,0,0,0.6),0 0 14px rgba(201,151,58,0.15); }
.season-card-poster { width:100%; aspect-ratio:2/3; object-fit:cover; display:block; filter:saturate(0.65) brightness(0.8); transition:filter 0.2s; }
.season-card:hover .season-card-poster { filter:saturate(0.9) brightness(1); }
.season-card-no-poster { width:100%; aspect-ratio:2/3; background:var(--chamber); display:flex; align-items:center; justify-content:center; font-size:28px; }
.season-card-info { padding:6px 8px 8px; }
.season-card-name { font-family:var(--font-occult); font-size:10px; color:var(--static); line-height:1.3; margin-bottom:2px; }
.season-card-meta { font-family:var(--font-vhs); font-size:8px; color:var(--dust); letter-spacing:1px; }
.season-card-rating { position:absolute; top:5px; right:5px; background:rgba(0,0,0,0.85); border:1px solid rgba(201,151,58,0.3); border-radius:3px; padding:2px 5px; font-family:var(--font-vhs); font-size:9px; color:var(--gold); }
.season-card-picker { position:absolute; bottom:0; left:0; right:0; background:linear-gradient(0deg,rgba(139,26,26,0.9),transparent); padding:18px 6px 6px; font-family:var(--font-vhs); font-size:7px; letter-spacing:1px; color:var(--gold-pale); text-transform:uppercase; opacity:0; transition:opacity 0.2s; pointer-events:none; }
.season-card:hover .season-card-picker { opacity:1; }
.season-detail-header { display:flex; gap:14px; margin-bottom:16px; align-items:flex-start; }
.season-detail-poster { width:80px; height:120px; border-radius:6px; object-fit:cover; flex-shrink:0; border:1px solid var(--border); filter:saturate(0.8); }
.season-detail-no-poster { width:80px; height:120px; border-radius:6px; background:var(--chamber); display:flex; align-items:center; justify-content:center; font-size:24px; flex-shrink:0; border:1px solid var(--border); }
.season-detail-title { font-family:var(--font-occult); font-size:16px; font-weight:700; color:var(--gold-pale); margin-bottom:4px; }
.season-detail-meta { font-family:var(--font-vhs); font-size:9px; letter-spacing:2px; color:var(--dust); text-transform:uppercase; margin-bottom:10px; }
.season-detail-overview { font-family:var(--font-grimoire); font-style:italic; font-size:14px; color:var(--fog); line-height:1.7; }

/* EPISODE DETAIL PAGE */
.ep-detail-still { width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:var(--radius); border:1px solid var(--border); margin-bottom:16px; filter:saturate(0.85) brightness(0.9); display:block; }
.ep-detail-still-placeholder { width:100%; aspect-ratio:16/9; background:var(--chamber); border-radius:var(--radius); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; font-size:48px; margin-bottom:16px; }
.ep-detail-title { font-family:var(--font-occult); font-size:20px; font-weight:700; color:var(--gold-pale); margin-bottom:6px; }
.ep-detail-meta { font-family:var(--font-vhs); font-size:10px; letter-spacing:2px; color:var(--dust); text-transform:uppercase; margin-bottom:12px; }
.ep-detail-overview { font-family:var(--font-grimoire); font-style:italic; font-size:16px; color:var(--fog); line-height:1.8; margin-bottom:20px; }
.ep-detail-watched-bar { display:flex; align-items:center; gap:8px; padding:10px 14px; background:var(--chamber); border:1px solid var(--border); border-radius:var(--radius); margin-bottom:16px; }
.ep-detail-watched-label { font-family:var(--font-vhs); font-size:10px; letter-spacing:1px; text-transform:uppercase; color:var(--fog); flex:1; }

/* EPISODE RATING PANEL */
.ep-row { display:flex; flex-direction:column; border:1px solid var(--border); border-radius:6px; background:var(--chamber); overflow:hidden; transition:border-color 0.15s; }
.ep-row.watched-ep { border-color:rgba(201,151,58,0.3); background:rgba(201,151,58,0.04); }
.ep-row-main { display:flex; align-items:center; gap:8px; padding:8px 10px; cursor:pointer; }
.ep-row-main:hover { background:rgba(255,255,255,0.03); }
.ep-num { min-width:36px; font-family:var(--font-vhs); font-size:10px; letter-spacing:1px; color:var(--dust); flex-shrink:0; }
.ep-row.watched-ep .ep-num { color:var(--gold); }
.ep-info { flex:1; min-width:0; }
.ep-name { font-family:var(--font-occult); font-size:12px; color:var(--static); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ep-date { font-family:var(--font-vhs); font-size:9px; letter-spacing:1px; color:var(--dust); margin-top:1px; }
.ep-mini-ratings { display:flex; gap:3px; align-items:center; margin-left:4px; flex-shrink:0; }
.ep-mini-star { font-size:10px; color:var(--dust); }
.ep-mini-star.lit { color:var(--gold); }
.ep-mini-avg { font-family:var(--font-vhs); font-size:9px; color:var(--gold); margin-left:2px; }
.ep-expand-panel { display:none; border-top:1px solid var(--border); padding:10px 12px; background:rgba(0,0,0,0.2); }
.ep-expand-panel.open { display:block; }
.ep-section-label { font-family:var(--font-vhs); font-size:8px; letter-spacing:2px; text-transform:uppercase; color:var(--dust); margin-bottom:6px; }
.ep-coven-ratings { display:flex; flex-direction:column; gap:5px; margin-bottom:10px; }
.ep-member-row { display:flex; align-items:center; gap:8px; }
.ep-member-name { font-family:var(--font-vhs); font-size:9px; letter-spacing:1px; color:var(--fog); text-transform:uppercase; min-width:80px; max-width:80px; overflow:hidden; text-overflow:ellipsis; }
.ep-member-stars { display:flex; gap:1px; }
.ep-member-star { font-size:10px; color:var(--dust); cursor:pointer; transition:color 0.1s; }
.ep-member-star.lit { color:var(--gold); text-shadow:0 0 6px rgba(201,151,58,0.5); }
.ep-member-val { font-family:var(--font-vhs); font-size:9px; color:var(--gold); margin-left:4px; min-width:32px; }
.ep-picker-row { display:flex; gap:6px; align-items:center; margin-top:8px; }
.ep-picker-input { background:var(--deep); border:1px solid var(--border); border-radius:4px; padding:5px 8px; color:var(--static); font-family:var(--font-vhs); font-size:10px; letter-spacing:1px; outline:none; flex:1; transition:border-color 0.15s; }
.ep-picker-input:focus { border-color:var(--border-bright); }
.season-header-bar { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; padding:8px 10px; background:var(--deep); border:1px solid var(--border); border-radius:6px; }
.season-header-title { font-family:var(--font-occult); font-size:11px; letter-spacing:1px; color:var(--gold-pale); text-transform:uppercase; }
.season-header-meta { display:flex; gap:10px; align-items:center; }
.season-avg-badge { font-family:var(--font-vhs); font-size:9px; letter-spacing:1px; color:var(--gold); background:rgba(201,151,58,0.1); border:1px solid rgba(201,151,58,0.25); border-radius:3px; padding:2px 7px; }
.season-picker-badge { font-family:var(--font-vhs); font-size:9px; letter-spacing:1px; color:var(--fog); cursor:pointer; border-bottom:1px dashed rgba(180,120,60,0.3); }
.season-picker-badge:hover { color:var(--gold); }


/* PHASE G — UI POLISH */
.vc-badge { display:inline-flex; align-items:center; gap:4px; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; flex-shrink:0;
  font-family:var(--font-vhs); font-size:9px; letter-spacing:1px; border-radius:999px; padding:2px 7px; border:1px solid var(--border); color:var(--fog); background:rgba(255,255,255,0.02); }
.vc-badge-rating { color:var(--gold); background:rgba(201,151,58,0.10); border-color:rgba(201,151,58,0.25); }
.vc-badge-picker { color:var(--violet); background:rgba(169,119,255,0.10); border-color:rgba(169,119,255,0.25); }
.vc-badge-seen { color:var(--green); background:rgba(78,207,138,0.10); border-color:rgba(78,207,138,0.25); }

/* Season episode watched pill (shows when row has .watched-ep) */
.vc-ep-seen-badge{
  display:none;
  align-items:center;
  gap:8px;
  padding:6px 12px;
  border-radius:999px;
  font-size:12px;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color: rgba(165, 255, 205, 0.85);
  border: 1px solid rgba(110, 255, 190, 0.22);
  background: radial-gradient(120% 120% at 30% 10%,
    rgba(70, 255, 170, 0.10),
    rgba(20, 30, 30, 0.02));
  box-shadow: 0 0 0 1px rgba(30, 255, 180, 0.05) inset, 0 10px 30px rgba(0,0,0,0.25);
}
.vc-ep-seen-badge .dot{
  width:8px;height:8px;border-radius:999px;
  background: rgba(90, 255, 170, 0.75);
  box-shadow: 0 0 14px rgba(90, 255, 170, 0.45);
}
.ep-row.watched-ep .vc-ep-seen-badge{ display:inline-flex; }
.vc-badge-next { color:var(--gold-pale); background:rgba(139,26,26,0.18); border-color:rgba(196,63,63,0.35); }

.watch-type-pill { display:inline-flex; align-items:center; justify-content:center; min-width:32px; height:20px; padding:0 8px; border-radius:999px; border:1px solid rgba(201,151,58,0.22); background:rgba(201,151,58,0.08); color:var(--gold-pale); font-family:var(--font-vhs); font-size:9px; letter-spacing:1px; }
.pill { display:inline-flex; align-items:center; gap:4px; padding:2px 8px; border-radius:999px; border:1px solid rgba(201,151,58,0.18); background:rgba(18,14,28,0.85); color:var(--fog); font-family:var(--font-vhs); font-size:9px; letter-spacing:1px; }
.pill:hover { border-color:rgba(201,151,58,0.3); color:var(--gold-pale); }
.queue-reco-card { border-color:rgba(201,151,58,0.18); box-shadow:0 10px 28px rgba(0,0,0,0.25), inset 0 0 0 1px rgba(201,151,58,0.04); }
.queue-reco-title { font-size:16px; letter-spacing:.3px; color:var(--gold-pale); }
.queue-reco-sub { color:var(--fog); }
.queue-reco-list .queue-item { background:rgba(255,255,255,0.015); border:1px solid rgba(201,151,58,0.10); border-radius:10px; }
.queue-reco-list .queue-item:hover { border-color:rgba(201,151,58,0.28); }
.codex-card-meta { line-height:1.35; }
.codex-progress-badge { margin-top:5px; display:inline-flex; align-items:center; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding:3px 8px; border-radius:999px; border:1px solid rgba(201,151,58,0.25); background:rgba(201,151,58,0.09); color:var(--gold-pale); font-family:var(--font-vhs); font-size:9px; letter-spacing:1px; }
.codex-ep-title { margin-top:3px; color:var(--static); opacity:.95; }
.queue-meta .vc-badge { transform:translateY(-1px); margin-right:4px; }

.queue-item { padding:10px; border-radius:8px; align-items:flex-start; }
.queue-item:hover { transform:translateY(-1px); }
.queue-poster { border-radius:4px; border:1px solid rgba(255,255,255,0.05); }
.queue-title { font-size:13px; line-height:1.28; color:var(--gold-pale); }
.queue-meta { font-size:10px; line-height:1.45; color:var(--fog); letter-spacing:1px; }
.queue-item .member-chip { font-size:9px; padding:2px 8px; }

.codex-card-info { padding:10px 11px 11px; }
.codex-card-title { font-size:12px; line-height:1.35; margin-bottom:4px; }
.codex-card-meta { font-size:9px; color:var(--fog); }
.codex-card:hover { box-shadow:0 12px 32px rgba(0,0,0,0.6),0 0 18px rgba(201,151,58,0.14); }
.codex-card:focus-visible { outline:none; border-color:var(--gold); box-shadow:0 0 0 2px rgba(201,151,58,0.18), 0 8px 28px rgba(0,0,0,.55); }

.member-chip { font-size:10px; color:var(--fog); }

.ep-row { border-radius:8px; transition:border-color .15s, box-shadow .15s, transform .15s; }
.ep-row:hover { border-color:var(--border-bright); box-shadow:0 6px 18px rgba(0,0,0,0.22); }
.ep-row-main { gap:10px; padding:8px 9px; align-items:flex-start; }
.ep-thumb { width:64px; height:36px; border-radius:5px; object-fit:cover; object-position:center; background:var(--deep); border:1px solid var(--border); flex-shrink:0; }
.ep-thumb-placeholder { width:64px; height:36px; border-radius:5px; background:var(--deep); border:1px solid var(--border); color:var(--dust); font-size:14px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.ep-num { min-width:34px; margin-top:2px; font-size:10px; color:var(--fog); }
.ep-info { padding-top:1px; }
.ep-name { font-size:13px; line-height:1.28; white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.ep-date { font-size:9px; margin-top:3px; color:var(--fog); line-height:1.35; }
.ep-badges { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:5px; margin-left:auto; max-width:44%; }
.ep-chevron { font-family:var(--font-vhs); font-size:11px; color:var(--dust); margin-left:2px; flex-shrink:0; align-self:center; }
.ep-expand-panel { padding:11px 12px; }

.ep-detail-header-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:12px; margin-bottom:4px; }
.ep-detail-body { min-width:0; }
.ep-detail-title { font-size:22px; line-height:1.2; margin-bottom:7px; }
.ep-detail-meta { font-size:10px; color:var(--fog); }
.ep-detail-overview { font-size:15px; line-height:1.65; color:var(--fog); margin-bottom:16px; }

.settings-section { border-radius:12px; }
.settings-row { padding:13px 0; }
.settings-row-label { font-size:11px; color:var(--gold-pale); }
.settings-row-desc { font-size:14px; line-height:1.4; color:var(--fog); }

button:focus-visible, .btn:focus-visible, a:focus-visible, .settings-tab:focus-visible, .queue-item:focus-visible, .ep-row-main:focus-visible {
  outline:2px solid rgba(201,151,58,0.75); outline-offset:2px; border-radius:6px;
}

@media (min-width: 900px) {
  .ep-row-main { padding:8px 10px; }
  .ep-thumb, .ep-thumb-placeholder { width:72px; height:40px; }
  .ep-badges { max-width:48%; }
  .ep-detail-header-grid { grid-template-columns: minmax(0, 340px) minmax(0, 1fr); align-items:start; gap:16px; margin-bottom:10px; }
  .ep-detail-still, .ep-detail-still-placeholder { margin-bottom:0; }
}
@media (max-width: 720px) {
  .ep-row-main { flex-wrap:wrap; }
  .ep-badges { max-width:none; width:100%; justify-content:flex-start; margin-left:0; padding-left:98px; }
  .ep-chevron { margin-left:auto; }
  .queue-title { font-size:11px; }
}


/* PHASE G.3 — CONSISTENCY SWEEP */
.nav-logo, .auth-logo, .loading-overlay .logo { letter-spacing:3px; }
.nav-logo { font-size:22px; }
.auth-logo { letter-spacing:3px; }

.btn, .queue-sort-btn, .settings-tab, .sidebar-item { transition:all .18s ease, box-shadow .18s ease, transform .18s ease; }
.btn:hover, .queue-sort-btn:hover { box-shadow:0 4px 14px rgba(0,0,0,.28); }
.card:hover { border-color:rgba(201,151,58,.28); box-shadow:0 10px 26px rgba(0,0,0,.22); }
.card-title { margin-bottom:14px; }

.vc-badge, .pill, .member-chip, .watch-history-badge, .season-avg-badge, .queue-auto-badge, .voter-chip { font-weight:600; }
.vc-badge, .pill { min-height:20px; }
.vc-badge-picker { color:#c8b4ff; background:rgba(169,119,255,0.13); }
.voter-chip, .member-chip { border-radius:999px; padding:3px 8px; color:var(--mist); }
.queue-auto-badge { min-width:30px; height:20px; }
.queue-auto-badge .sigil { margin-right:1px; }

/* Coven hub members panel */
.coven-member-summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin-bottom:12px}
.coven-member-summary-card{background:linear-gradient(180deg,rgba(20,12,32,.98),rgba(10,8,16,.95));border:1px solid var(--border);border-radius:10px;padding:11px}
.coven-member-summary-label{font-family:var(--font-vhs);font-size:9px;color:var(--fog);letter-spacing:1.2px;text-transform:uppercase}
.coven-member-summary-name{font-family:var(--font-occult);font-size:16px;color:var(--gold-pale);margin-top:4px;line-height:1.2}
.coven-member-summary-meta{font-family:var(--font-vhs);font-size:10px;color:var(--mist);margin-top:4px;line-height:1.35}
.coven-members-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(240px,.65fr);gap:10px;align-items:start}
.coven-members-listcol{display:grid;gap:8px}
.coven-member-row{background:rgba(18,12,28,.78);border:1px solid var(--border);border-radius:10px;padding:10px}
.coven-member-row-grid{display:grid;grid-template-columns:auto minmax(0,1fr) 190px;gap:10px;align-items:start}
.coven-member-avatar{width:34px;height:34px;border-radius:8px;background:linear-gradient(135deg,var(--blood),var(--surface));border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0;color:var(--gold-pale)}
.coven-member-name{font-family:var(--font-occult);font-size:15px;color:var(--gold-pale);line-height:1.15;text-transform:uppercase;letter-spacing:1px}
.coven-member-you{font-family:var(--font-vhs);font-size:9px;color:var(--fog);letter-spacing:1px;text-transform:uppercase}
.coven-member-pills{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.coven-bars{display:grid;gap:5px;margin-top:9px}
.coven-bar{display:grid;grid-template-columns:74px 1fr 34px;gap:7px;align-items:center}
.coven-bar-label,.coven-bar-val{font-family:var(--font-vhs);font-size:9px;color:var(--mist);letter-spacing:1px}
.coven-bar-val{text-align:right}
.coven-bar-track{height:6px;border-radius:999px;background:rgba(255,255,255,.04);overflow:hidden}
.coven-bar-fill{height:100%}
.coven-breakdown{border:1px solid var(--border);border-radius:8px;padding:8px;background:rgba(11,9,18,.55)}
.coven-breakdown-title{font-family:var(--font-vhs);font-size:9px;color:var(--fog);letter-spacing:1px;text-transform:uppercase;margin-bottom:6px}
.coven-breakdown-list{display:flex;flex-direction:column;gap:5px}

/* Settings members panel */
.s-member-row{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--rim)}
.s-member-avatar{width:32px;height:32px;border-radius:7px;background:linear-gradient(135deg,var(--blood),var(--surface));border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0;color:var(--gold-pale)}
.s-member-main{flex:1;min-width:0}
.s-member-head{font-family:var(--font-vhs);font-size:11px;color:var(--gold-pale);letter-spacing:1px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.s-member-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:220px}
.s-member-you{color:var(--fog)}
.s-member-joined{font-family:var(--font-vhs);font-size:9px;color:var(--mist);margin-top:3px;letter-spacing:.8px}
.s-member-role{display:inline-flex;align-items:center;padding:2px 7px;border-radius:999px;border:1px solid rgba(201,151,58,.18);background:rgba(255,255,255,.02);font-family:var(--font-vhs);font-size:9px;letter-spacing:1px;text-transform:uppercase}
.s-member-role.owner{color:var(--gold)}
.s-member-role.admin{color:#c8d2ff;border-color:rgba(185,199,255,.25);background:rgba(185,199,255,.08)}
.s-member-role.member{color:var(--mist)}
.s-member-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.s-member-actions .btn{padding:6px 10px;font-size:9px}

@media (max-width: 980px){
  .coven-members-layout{grid-template-columns:1fr}
  .coven-member-row-grid{grid-template-columns:auto minmax(0,1fr)}
  .coven-breakdown{grid-column:1 / -1}
}


/* Phase G.4 — Coven Insights */
.coven-insights-wrap{display:grid;gap:12px}
.coven-insights-grid{display:grid;grid-template-columns:1.1fr 1.1fr .8fr 1fr;gap:10px}
.coven-insight-card{
  border:1px solid rgba(212,170,74,.16);
  background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01));
  border-radius:10px;
  padding:10px;
}
.coven-insight-title{
  font-family:var(--font-vhs);
  font-size:10px;
  color:var(--fog);
  letter-spacing:1.2px;
  text-transform:uppercase;
  margin-bottom:8px;
}
.coven-insight-list{display:grid;gap:6px}
.coven-insight-row{
  display:grid;grid-template-columns:minmax(0,1fr) auto;
  gap:8px;align-items:center;
  padding:6px 8px;
  border:1px solid rgba(212,170,74,.10);
  border-radius:8px;
  background:rgba(14,10,22,.55);
}
.coven-insight-name{font-family:var(--font-occult);color:var(--gold-pale);font-size:13px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-transform:uppercase;letter-spacing:0.5px}
.coven-insight-sub{color:var(--mist);font-size:10px;margin-top:2px;line-height:1.3}
.coven-insight-val{font-family:var(--font-vhs);font-size:10px;color:var(--gold);letter-spacing:1px}
.coven-trend-list{display:grid;gap:7px}
.coven-trend-row{display:grid;grid-template-columns:54px 1fr auto;gap:8px;align-items:center}
.coven-trend-label,.coven-trend-val{font-family:var(--font-vhs);font-size:9px;color:var(--mist);letter-spacing:1px}
.coven-trend-val{text-align:right}
.coven-trend-track{height:7px;border-radius:999px;background:rgba(255,255,255,.04);border:1px solid rgba(212,170,74,.10);overflow:hidden}
.coven-trend-fill{height:100%;background:linear-gradient(90deg,rgba(201,151,58,.58),rgba(240,214,155,.88))}
.coven-insight-summary{display:flex;flex-wrap:wrap;gap:6px}
@media (max-width: 1100px){ .coven-insights-grid{grid-template-columns:1fr 1fr} }
@media (max-width: 720px){ .coven-insights-grid{grid-template-columns:1fr} }

.coven-hub-toggle{display:flex;gap:8px;margin:2px 0 12px;flex-wrap:wrap}
.coven-hub-toggle .toggle-btn{background:rgba(255,255,255,.03);border:1px solid rgba(212,160,70,.22);color:var(--dust);padding:7px 12px;border-radius:999px;font-family:var(--font-vhs);font-size:10px;letter-spacing:1.4px;cursor:pointer;transition:.15s}
.coven-hub-toggle .toggle-btn:hover{background:rgba(212,160,70,.08);color:var(--bone);border-color:rgba(212,160,70,.45)}
.coven-hub-toggle .toggle-btn.active{background:linear-gradient(180deg, rgba(212,160,70,.16), rgba(212,160,70,.08));color:var(--gold);border-color:rgba(212,160,70,.55);box-shadow:0 0 0 1px rgba(212,160,70,.08) inset}
.coven-panel{display:none}
.coven-panel.active{display:block}
.coven-placeholder{min-height:240px;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--dust)}

/* ═══════════════════════════════════════════════════════════════════════════
   PHASE H: Media Locker
   ═══════════════════════════════════════════════════════════════════════════ */

/* Add to Locker Modal - Format Selector Grid */
.format-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(110px, 1fr)); gap:8px; }
.format-option { display:flex; flex-direction:column; align-items:center; gap:6px; padding:12px; background:var(--chamber); border:2px solid var(--border); border-radius:var(--radius); cursor:pointer; transition:all 0.15s; text-align:center; }
.format-option:hover { border-color:var(--border-bright); background:var(--surface); }
.format-option.selected { border-color:var(--gold); background:rgba(201, 151, 58, 0.1); }
.format-icon { font-size:24px; }
.format-label { font-family:var(--font-vhs); font-size:10px; letter-spacing:1px; text-transform:uppercase; color:var(--fog); }
.format-option.selected .format-label { color:var(--gold); }

/* Locker View Pages */
.locker-filters { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:var(--space-lg); }

/* ── Locker unified controls bar ── */
.locker-controls { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:14px; align-items:center; }
.locker-ctrl-divider { width:1px; height:18px; background:var(--border); margin:0 4px; flex-shrink:0; }
.locker-sort-label { font-family:var(--font-vhs); font-size:9px; letter-spacing:2px; color:var(--dust); text-transform:uppercase; margin-right:2px; }
.locker-ctrl-btn { font-family:var(--font-vhs); font-size:10px; letter-spacing:1px; padding:5px 12px; border-radius:999px; border:1px solid var(--border); background:transparent; color:var(--fog); cursor:pointer; transition:all .15s; white-space:nowrap; }
.locker-ctrl-btn:hover { border-color:rgba(201,151,58,.45); color:var(--gold-pale); }
.locker-ctrl-btn.active { border-color:rgba(201,151,58,.55); background:rgba(201,151,58,.10); color:var(--gold); }
.locker-ctrl-btn.drag-active { border-color:var(--blood-bright) !important; color:#e07070 !important; background:rgba(139,26,26,.12) !important; box-shadow:0 0 10px rgba(139,26,26,.2) inset; }
.locker-drag-hint { font-family:var(--font-vhs); font-size:9px; color:var(--dust); letter-spacing:1px; padding:3px 0 8px; display:none; }
.locker-drag-hint.visible { display:block; }
/* hide old view-toggle for locker pages — replaced by .locker-controls */
#my-locker-view-toggle, #coven-locker-view-toggle { display:none !important; }

/* ── Franchise section headers ── */
.vc-franchise-section { margin-bottom:36px; }
.vc-franchise-untagged { opacity:.65; }
.vc-franchise-hdr { display:flex; align-items:center; gap:9px; margin-bottom:14px; padding-bottom:10px; border-bottom:1px solid rgba(201,151,58,.15); flex-wrap:wrap; row-gap:6px; }
.vc-franchise-hdr-icon { font-size:20px; line-height:1; flex-shrink:0; }
.vc-franchise-hdr-name { font-family:var(--font-occult); font-size:18px; color:var(--gold); letter-spacing:.4px; }
.vc-franchise-hdr-count { font-family:var(--font-vhs); font-size:9px; color:var(--dust); letter-spacing:1.5px; padding:2px 8px; border:1px solid rgba(201,151,58,.2); border-radius:999px; background:rgba(201,151,58,.05); }
.vc-franchise-hdr-actions { display:flex; gap:5px; align-items:center; margin-left:auto; flex-wrap:wrap; }
.vc-franchise-sort-pill { font-family:var(--font-vhs); font-size:9px; letter-spacing:.8px; padding:3px 9px; border-radius:999px; border:1px solid var(--border); background:transparent; color:var(--fog); cursor:pointer; transition:all .12s; white-space:nowrap; }
.vc-franchise-sort-pill:hover { border-color:rgba(201,151,58,.4); color:var(--gold-pale); }
.vc-franchise-sort-pill.active { border-color:rgba(201,151,58,.5); background:rgba(201,151,58,.08); color:var(--gold); }
.vc-franchise-sort-pill.drag-active { border-color:var(--blood-bright) !important; color:#e07070 !important; }
.locker-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:var(--space-lg); margin-top:var(--space-xl); align-items:start; }
.locker-card { position:relative; background:var(--deep); border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; transition:border-color .18s ease, box-shadow .18s ease; cursor:pointer; width:100%; }
.locker-card:hover { border-color:var(--border-bright); box-shadow:0 10px 24px rgba(0, 0, 0, 0.45); }
.locker-card:hover .locker-card-info, .locker-card:focus-within .locker-card-info { transform:translateY(0); opacity:1; }
.locker-card:hover .locker-card-poster::after, .locker-card:focus-within .locker-card-poster::after { opacity:1; }
.locker-card-poster::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,4,7,0) 45%, rgba(5,4,7,.38) 72%, rgba(5,4,7,.7) 100%);opacity:0;transition:opacity .18s ease;pointer-events:none;}
.locker-card-poster { position:relative; width:100%; aspect-ratio:2/3; display:block; overflow:hidden; background:var(--chamber); }
.locker-card-poster img { width:100%; height:100%; object-fit:cover; display:block; }
.locker-card-format { position:absolute; top:8px; left:8px; display:flex; align-items:center; gap:6px; padding:6px 10px; background:rgba(5,4,7,.92); backdrop-filter:blur(10px); border:1px solid rgba(212,170,74,.42); border-radius:6px; box-shadow:0 4px 14px rgba(0,0,0,.35); }
.locker-card-format .format-icon { font-size:15px; line-height:1; }
.locker-card-format .format-label { font-family:var(--font-vhs); font-size:10px; letter-spacing:1.1px; text-transform:uppercase; color:var(--gold-pale); text-shadow:0 1px 0 rgba(0,0,0,.55); }
.locker-card-info { position:absolute; left:0; right:0; bottom:0; z-index:2; padding:10px; background:linear-gradient(180deg, rgba(5,4,7,0) 0%, rgba(5,4,7,.90) 22%, rgba(5,4,7,.98) 100%); transform:translateY(100%); opacity:0; transition:transform .18s ease, opacity .18s ease; pointer-events:none; }
.locker-card-title { font-family:var(--font-occult); font-size:13px; font-weight:600; color:var(--static); margin-bottom:6px; line-height:1.25; text-shadow:0 1px 2px rgba(0,0,0,.55); }
.locker-card-meta { display:flex; flex-direction:column; gap:4px; margin-bottom:8px; }
.locker-owner, .locker-edition { font-family:var(--font-vhs); font-size:9px; letter-spacing:1px; color:var(--fog); }
.locker-edition { color:var(--gold); }
.locker-card-actions { display:flex; gap:4px; justify-content:flex-end; pointer-events:auto; }
.locker-edition-preset {
  display:inline-flex; align-items:center; gap:5px;
  padding:5px 10px; border-radius:7px;
  background:var(--chamber); border:1px solid var(--border);
  color:var(--fog); font-family:var(--font-vhs); font-size:9px;
  letter-spacing:.8px; text-transform:uppercase; cursor:pointer;
  transition:all .14s;
}
.locker-edition-preset:hover { border-color:var(--border-bright); color:var(--static); background:var(--surface); }
.locker-edition-preset.selected { border-color:var(--gold); background:rgba(201,151,58,.10); color:var(--gold); }
.locker-version-badge { display:inline-flex;align-items:center;gap:3px;padding:2px 6px;background:rgba(201,151,58,.10);border:1px solid rgba(201,151,58,.22);border-radius:4px;font-family:var(--font-vhs);font-size:9px;color:var(--gold-pale);letter-spacing:.5px;white-space:nowrap; }
@media (hover:none){
  .locker-card-info{transform:translateY(0);opacity:1;}
  .locker-card-poster::after{opacity:1;}
}
.btn-icon { width:28px; height:28px; border-radius:4px; border:1px solid var(--border); background:var(--surface); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all 0.15s; font-size:14px; }
.btn-icon:hover { border-color:var(--gold); background:rgba(201, 151, 58, 0.1); }

/* Locker Entry Chips (in title modal) */
.locker-entries-list { display:flex; flex-wrap:wrap; gap:8px; }
.locker-entry-chip { display:inline-flex; align-items:center; gap:6px; padding:6px 12px; background:var(--chamber); border:1px solid var(--border); border-radius:6px; font-size:12px; }
.locker-entry-icon { font-size:16px; }
.locker-entry-owner { color:var(--static); font-weight:600; }
.locker-entry-format { color:var(--fog); font-family:var(--font-vhs); font-size:10px; letter-spacing:1px; }
.locker-entry-edition { color:var(--gold); font-family:var(--font-vhs); font-size:9px; letter-spacing:1px; padding-left:6px; border-left:1px solid var(--border); }

/* Modal Section Styles */
.modal-section { margin-bottom:var(--space-lg); }
.section-header-inline { display:flex; justify-content:space-between; align-items:center; margin-bottom:var(--space-md); }
.section-title-sm { font-family:var(--font-vhs); font-size:10px; letter-spacing:2px; text-transform:uppercase; color:var(--dust); }

/* View Toggle */
.view-toggle { display:flex; gap:4px; margin-bottom:var(--space-lg); background:var(--deep); border:1px solid var(--border); border-radius:6px; padding:4px; display:inline-flex; }
.toggle-btn { padding:8px 16px; border-radius:4px; border:none; background:transparent; font-family:var(--font-vhs); font-size:10px; letter-spacing:1px; text-transform:uppercase; color:var(--fog); cursor:pointer; transition:all 0.15s; }
.toggle-btn:hover { color:var(--static); }
.toggle-btn.active { background:rgba(201, 151, 58, 0.15); color:var(--gold); }

/* No Items State */
.locker-empty { text-align:center; padding:var(--space-3xl) var(--space-xl); }
.locker-empty-icon { font-size:48px; margin-bottom:var(--space-lg); opacity:0.5; }
.locker-empty-text { font-family:var(--font-grimoire); font-size:16px; font-style:italic; color:var(--dust); margin-bottom:var(--space-lg); }


/* TOAST */
.toast-container { position:fixed; bottom:20px; right:20px; z-index:300; display:flex; flex-direction:column; gap:8px; }
.toast { background:var(--chamber); border:1px solid var(--border-bright); border-radius:6px; padding:10px 14px; font-family:var(--font-vhs); font-size:11px; letter-spacing:1px; color:var(--gold); display:flex; align-items:center; gap:8px; animation:fadeUp 0.3s ease; box-shadow:0 8px 24px rgba(0,0,0,0.6),0 0 16px rgba(201,151,58,0.1); }
.toast.error { color:#e07070; border-color:rgba(139,26,26,0.5); }
.toast.warning { color:#f0c56a; border-color:rgba(201,151,58,0.55); }
.toast.info { color:#a9c6ff; border-color:rgba(90,120,200,0.45); }
.toast.success { color:#d8d8d8; }


/* SETTINGS */
#view-settings { background:var(--void); }
.settings-wrap { max-width:760px; margin:0 auto; padding:32px; }
.settings-tabs { display:flex; gap:4px; margin-bottom:28px; border-bottom:1px solid var(--border); }
.settings-tab { font-family:var(--font-vhs); font-size:10px; letter-spacing:2px; text-transform:uppercase; padding:10px 16px; cursor:pointer; color:var(--dust); border-bottom:2px solid transparent; margin-bottom:-1px; transition:all 0.2s; }
.settings-tab.active { color:var(--gold); border-bottom-color:var(--gold); }
.settings-panel { display:none; } .settings-panel.active { display:block; }
.settings-section { background:var(--deep); border:1px solid var(--border); border-radius:var(--radius-lg); padding:24px; margin-bottom:16px; }
.settings-section-title { font-family:var(--font-occult); font-size:13px; font-weight:600; color:var(--gold-pale); letter-spacing:1px; text-transform:uppercase; margin-bottom:18px; padding-bottom:12px; border-bottom:1px solid var(--rim); }
.settings-row { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 0; border-bottom:1px solid var(--rim); }
.settings-row:last-child { border-bottom:none; padding-bottom:0; }
.settings-row-info { flex:1; }
.settings-row-label { font-family:var(--font-vhs); font-size:11px; letter-spacing:1px; text-transform:uppercase; color:var(--static); margin-bottom:3px; }
.settings-row-desc { font-family:var(--font-grimoire); font-size:13px; font-style:italic; color:var(--dust); }
.toggle { position:relative; width:44px; height:24px; flex-shrink:0; }
.toggle input { opacity:0; width:0; height:0; }
.toggle-slider { position:absolute; inset:0; background:var(--surface); border:1px solid var(--border); border-radius:12px; cursor:pointer; transition:all 0.2s; }
.toggle-slider::before { content:''; position:absolute; width:18px; height:18px; left:2px; top:2px; background:var(--dust); border-radius:50%; transition:all 0.2s; }
.toggle input:checked + .toggle-slider { background:rgba(139,26,26,0.3); border-color:var(--blood-bright); }
.toggle input:checked + .toggle-slider::before { transform:translateX(20px); background:var(--blood-bright); }
.avatar-picker { display:flex; gap:10px; flex-wrap:wrap; margin-top:14px; }
.avatar-option { width:52px; height:52px; border-radius:10px; border:2px solid var(--border); background:var(--chamber); cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:24px; transition:all 0.15s; }
.avatar-option:hover { border-color:var(--gold); transform:scale(1.08); }
.avatar-option.selected { border-color:var(--blood-bright); box-shadow:0 0 12px var(--blood-glow); }
.color-picker-row { display:flex; gap:10px; flex-wrap:wrap; margin-top:14px; }
.color-swatch { width:36px; height:36px; border-radius:50%; border:2px solid transparent; cursor:pointer; transition:all 0.15s; }
.color-swatch:hover { transform:scale(1.1); }
.color-swatch.selected { border-color:var(--gold); box-shadow:0 0 10px rgba(201,151,58,0.4); }
.danger-zone { background:rgba(139,26,26,0.08); border-color:rgba(139,26,26,0.3); }
.hamburger { display:none; flex-direction:column; gap:4px; cursor:pointer; padding:6px; border-radius:4px; border:1px solid transparent; transition:border-color 0.2s; }
.hamburger:hover { border-color:var(--border); }
.hamburger span { display:block; width:20px; height:2px; background:var(--gold); border-radius:1px; }
.mobile-menu { display:none; position:fixed; top:66px; left:0; right:0; background:rgba(8,6,16,0.98); backdrop-filter:blur(20px); border-bottom:1px solid var(--border); z-index:99; padding:12px; flex-direction:column; gap:4px; }
.mobile-menu.open { display:flex; }
.mobile-menu a { font-family:var(--font-vhs); font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--dust); padding:12px 16px; border-radius:6px; cursor:pointer; border:1px solid transparent; transition:all 0.15s; }
.mobile-menu a:hover,.mobile-menu a.active { color:var(--gold); background:rgba(201,151,58,0.08); border-color:var(--rim); }
.mobile-menu-bottom { border-top:1px solid var(--border); margin-top:8px; padding-top:12px; display:flex; justify-content:space-between; align-items:center; }
.mobile-username { font-family:var(--font-vhs); font-size:10px; color:var(--dust); letter-spacing:1px; }
@media (max-width:768px) {
  .dashboard-layout { grid-template-columns:1fr; }
  .sidebar { display:none; }
  .dash-grid { grid-template-columns:1fr 1fr; }
  .dash-row { grid-template-columns:1fr; }
  .profile-grid { grid-template-columns:1fr; }
  nav .nav-links { display:none !important; }
  nav #nav-right-landing { display:none !important; }
  nav #nav-right-app { display:none !important; }
  .hamburger { display:flex; }
  .nav-logo { font-size:14px; letter-spacing:2px; }
  .search-wrap,.history-wrap,.settings-wrap { padding:20px 16px; }
  .dashboard-layout .shared-search-main .search-wrap,.dashboard-layout .shared-history-main .history-wrap{padding:20px 16px;max-width:none;}
  .profile-body { padding:0 16px 48px; }
  .main-content { padding:20px 16px; }
  .result-grid { grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); }
  .settings-tabs { overflow-x:auto; }
}

    .stat-value.metric-breakdown {
      font-size: clamp(18px, 2vw, 24px);
      line-height: 1.2;
      letter-spacing: .02em;
      white-space: normal;
      text-transform: uppercase;
    }
    .metric-breakdown-subline{
      margin-top: 10px !important;
      display:block;
    }


/* Coven Activity feed density polish */
.coven-activity-list{padding-top:2px}
.coven-activity-wrap{display:grid;gap:10px}
.coven-activity-toolbar{display:flex;flex-wrap:wrap;gap:6px;padding:2px 0 4px}
.coven-activity-chip{
  display:inline-flex;align-items:center;gap:5px;
  border:1px solid rgba(212,170,74,.18);
  background:rgba(255,255,255,.02);
  color:var(--mist);
  border-radius:999px;
  padding:4px 8px;
  font-size:10px;
  letter-spacing:.6px;
}
.coven-activity-chip b{color:var(--gold);font-weight:600}
.coven-activity-chip{cursor:pointer}
button.coven-activity-chip{appearance:none;-webkit-appearance:none;font-family:inherit}
.coven-activity-chip.active{border-color:rgba(212,170,74,.42);background:rgba(212,170,74,.12);color:var(--gold);box-shadow:0 0 0 1px rgba(212,170,74,.08) inset}
.coven-activity-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.coven-activity-item{
  display:grid;grid-template-columns:28px 1fr auto;
  gap:10px;align-items:start;
  border:1px solid rgba(212,170,74,.14);
  background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01));
  border-radius:10px;
  padding:8px 10px;
}
.coven-activity-icon{
  width:28px;height:28px;border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  border:1px solid rgba(212,170,74,.18);
  background:rgba(212,170,74,.06);
  font-size:13px;line-height:1;
}
.coven-activity-main{min-width:0}

.coven-activity-head{
  color:var(--gold-pale);
  font-size:13px;
  line-height:1.3;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.coven-activity-head .kind{color:var(--gold);margin-right:6px}
.coven-activity-meta{
  margin-top:4px;
  color:var(--fog);
  font-size:11px;
  letter-spacing:1px;
  display:flex;flex-wrap:wrap;gap:6px;
}
.coven-activity-meta .meta-pill{
  border:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.03);
  border-radius:999px;
  padding:2px 6px;
}
.coven-activity-time{
  color:var(--fog);
  font-size:10px;
  text-align:right;
  letter-spacing:.8px;
  white-space:nowrap;
  padding-top:2px;
}
@media (max-width: 1100px){
  .coven-activity-grid{grid-template-columns:1fr}
  .coven-activity-item{grid-template-columns:24px 1fr}
  .coven-activity-time{grid-column:2; text-align:left; padding-top:0}
  .coven-activity-icon{width:24px;height:24px;font-size:12px}
}


/* TV modal breadcrumb drill transition */
#modal-body.tv-drill-enter .modal-nav-breadcrumb{
  animation: tvCrumbSlide 220ms ease-out;
}
#modal-body.tv-drill-enter .modal-nav-breadcrumb .crumb.current{
  color: var(--gold);
  text-shadow: 0 0 10px rgba(212,160,70,.25);
}
#modal-body.tv-drill-enter.tv-drill-episode .ep-detail-header-grid,
#modal-body.tv-drill-enter.tv-drill-episode .ep-detail-watched-bar,
#modal-body.tv-drill-enter.tv-drill-episode .member-ratings,
#modal-body.tv-drill-enter.tv-drill-episode .modal-section-label,
#modal-body.tv-drill-enter.tv-drill-episode .tag-input,
#modal-body.tv-drill-enter.tv-drill-episode #ep-page-picker{
  animation: tvDrillRise 260ms ease-out both;
}
#modal-body.tv-drill-enter.tv-drill-season #episode-list,
#modal-body.tv-drill-enter.tv-drill-season .modal-section-label,
#modal-body.tv-drill-enter.tv-drill-season .series-rating-block{
  animation: tvDrillRise 240ms ease-out both;
}
#modal-body.tv-drill-enter.tv-drill-series .tv-title-hero,
#modal-body.tv-drill-enter.tv-drill-series .modal-section-label,
#modal-body.tv-drill-enter.tv-drill-series .season-grid{
  animation: tvDrillRise 220ms ease-out both;
}
@keyframes tvCrumbSlide{
  from{opacity:.55; transform:translateX(8px);}
  to{opacity:1; transform:translateX(0);}
}
@keyframes tvDrillRise{
  from{opacity:.55; transform:translateY(8px);}
  to{opacity:1; transform:translateY(0);}
}


.picker-quick-row{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.picker-quick-row .btn{border-radius:6px}
.picker-quick-row .btn.btn-sm{min-height:28px;padding:5px 10px;line-height:1}
.picker-quick-row .tiny{line-height:1.2}
.picker-editor-wrap{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.picker-editor-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.picker-editor-row .tag-input,.picker-editor-row .ep-picker-input{flex:1;min-width:180px}
.picker-editor-row .btn{flex-shrink:0}
.picker-editor-wrap .picker-quick-row{margin-top:0}
@media (max-width:640px){.picker-editor-row{gap:6px}.picker-editor-row .btn{width:100%;justify-content:center}.picker-editor-row .tag-input,.picker-editor-row .ep-picker-input{min-width:0;width:100%}}


/* Codex import shell */
.codex-import-drop{border:1px dashed rgba(201,151,58,0.35);border-radius:10px;padding:14px;background:rgba(0,0,0,0.22)}
.codex-import-drop.dragover{border-color:rgba(201,151,58,0.8);background:rgba(201,151,58,0.08);box-shadow:0 0 0 1px rgba(201,151,58,0.2) inset}
.codex-import-dropzone{margin-top:10px;border:1px dashed rgba(201,151,58,0.25);border-radius:8px;padding:14px;text-align:center;background:rgba(8,10,14,0.45);cursor:pointer;transition:.15s ease}
.codex-import-dropzone:hover{border-color:rgba(201,151,58,0.45);background:rgba(201,151,58,0.05)}
.codex-import-dropzone .big{font-family:var(--font-vhs);font-size:10px;letter-spacing:1.5px;color:var(--gold-pale)}
.codex-import-dropzone .sub{margin-top:4px;font-family:var(--font-vhs);font-size:9px;letter-spacing:1px;color:var(--dust);opacity:.9}
.codex-import-map-row select.input{background:rgba(8,10,14,0.88)!important;border:1px solid rgba(201,151,58,0.22)!important;color:var(--static)!important;font-family:var(--font-vhs);font-size:10px;letter-spacing:.7px;appearance:none;-webkit-appearance:none;padding-right:28px;background-image:linear-gradient(45deg,transparent 50%, var(--gold-pale) 50%),linear-gradient(135deg,var(--gold-pale) 50%, transparent 50%);background-position:calc(100% - 16px) calc(1em + 1px),calc(100% - 11px) calc(1em + 1px);background-size:5px 5px,5px 5px;background-repeat:no-repeat}
.codex-import-map-row select.input:focus{outline:none;border-color:rgba(201,151,58,0.55)!important;box-shadow:0 0 0 1px rgba(201,151,58,0.25)}
.codex-import-map-row select.input option{background:#0b0d12;color:#f4e7bf}

.codex-import-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.codex-import-map-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:center;padding:8px 10px;border:1px solid rgba(201,151,58,0.12);border-radius:8px;background:rgba(8,10,14,0.5)}
.codex-import-map-row .src{font-family:var(--font-vhs);font-size:10px;letter-spacing:1px;color:var(--gold-pale)}
.codex-import-help{font-family:var(--font-vhs);font-size:9px;letter-spacing:1px;color:var(--dust);opacity:.9;line-height:1.5}
.codex-import-preview-wrap{max-height:280px;overflow:auto;border:1px solid rgba(201,151,58,0.18);border-radius:8px;background:rgba(0,0,0,0.22)}
.codex-import-preview{width:100%;border-collapse:collapse;font-family:var(--font-vhs);font-size:9px;letter-spacing:0.7px}
.codex-import-preview th,.codex-import-preview td{padding:7px 8px;border-bottom:1px solid rgba(201,151,58,0.08);text-align:left;vertical-align:top}
.codex-import-preview th{position:sticky;top:0;background:#0a0c11;color:var(--gold-pale);z-index:1}
.codex-import-statline{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
.codex-import-pill{border:1px solid rgba(201,151,58,0.25);border-radius:999px;padding:4px 8px;font-family:var(--font-vhs);font-size:9px;letter-spacing:1px;background:rgba(201,151,58,0.06);color:var(--gold-pale)}
@media (max-width: 720px){ .codex-import-grid, .codex-import-map-row{grid-template-columns:1fr;} }


.provider-panel{background:rgba(10,8,13,.5);border:1px solid var(--border);border-radius:8px;padding:10px}
.provider-region-label{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-vhs);font-size:9px;letter-spacing:1px;color:var(--dust)}
.provider-region-select{min-width:180px;padding:6px 8px;font-size:11px;background:var(--chamber)!important;color:var(--static)!important}
.provider-group{margin-bottom:10px}
.provider-group:last-child{margin-bottom:0}
.provider-group-label{font-family:var(--font-vhs);font-size:9px;letter-spacing:1px;color:var(--gold);margin-bottom:6px}
.provider-chip-row{display:flex;flex-wrap:wrap;gap:6px}
.provider-chip{display:inline-flex;align-items:center;gap:6px;background:var(--chamber);border:1px solid var(--border);border-radius:999px;padding:4px 8px;max-width:220px}
.provider-chip img{width:18px;height:18px;border-radius:4px;object-fit:cover;display:block}
.provider-chip span{font-size:11px;color:var(--static);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.provider-chip-fallback{width:18px;height:18px;border-radius:4px;background:rgba(201,151,58,.12);border:1px solid rgba(201,151,58,.3);display:flex;align-items:center;justify-content:center;font-family:var(--font-vhs);font-size:9px;color:var(--gold)}


.codex-card-poster-wrap{position:relative;overflow:hidden;}
.codex-card-overlay-media{position:absolute;top:6px;left:6px;z-index:3;padding:2px 6px;border-radius:4px;background:rgba(10,12,10,.82);border:1px solid rgba(201,151,58,.35);color:var(--gold);font-family:var(--font-vhs);font-size:10px;letter-spacing:1px;line-height:1.1;}
.codex-card-overlay-picker{position:absolute;top:6px;right:6px;z-index:3;}
.codex-card-overlay-picker .codex-card-picker{margin:0;background:rgba(10,12,10,.82);}
.codex-card-overlay-progress{position:absolute;left:6px;z-index:3;max-width:calc(100% - 12px);}
.codex-progress-badge-compact{display:inline-block;margin:0;padding:2px 6px;border-radius:999px;background:rgba(10,12,10,.82);border:1px solid rgba(201,151,58,.35);color:var(--gold);font-family:var(--font-vhs);font-size:10px;letter-spacing:1px;line-height:1.1;}


.vc-spoiler-blur{filter:blur(12px) saturate(.35) brightness(.75);}

.codex-archivist-row{align-items:center;gap:8px;flex-wrap:wrap}
.codex-archivist-row .codex-select{min-width:180px}

/* ── Codex Redesign v2 ─────────────────────────────────────────────────────── */
.codex-toolbar-v2{display:grid;gap:8px;margin:0 0 16px}
.codex-toolbar-primary{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.codex-toolbar-primary .codex-search{flex:1;min-width:160px;max-width:320px}
.codex-filters-panel{display:none;border:1px solid rgba(201,151,58,0.15);border-radius:12px;padding:12px 14px;background:rgba(8,6,18,0.7);gap:10px;flex-direction:column}
.codex-filters-panel.open{display:flex}
.codex-filters-row{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.codex-filters-label{font-family:var(--font-vhs);font-size:9px;letter-spacing:2px;color:var(--dust);text-transform:uppercase;min-width:60px}
.codex-filters-btn{height:28px;padding:0 10px;font-size:9px;letter-spacing:1px;border-radius:999px;border:1px solid var(--border);background:transparent;color:var(--fog);font-family:var(--font-vhs);cursor:pointer;transition:all .15s;white-space:nowrap}
.codex-filters-btn:hover{border-color:rgba(201,151,58,0.35);color:var(--gold-pale)}
.codex-filters-btn.active{border-color:rgba(201,151,58,0.5);background:rgba(201,151,58,0.10);color:var(--gold)}
.codex-toggle-filters{height:34px;padding:0 14px;border-radius:999px;border:1px solid var(--border);background:transparent;color:var(--fog);font-family:var(--font-vhs);font-size:10px;letter-spacing:1px;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center;gap:6px}
.codex-toggle-filters:hover,.codex-toggle-filters.active{border-color:rgba(201,151,58,0.4);color:var(--gold-pale)}
.codex-toggle-filters.has-active{border-color:rgba(201,151,58,0.55);background:rgba(201,151,58,0.08);color:var(--gold)}
.codex-member-chips{display:flex;flex-wrap:wrap;gap:6px}
.codex-member-chip{display:inline-flex;align-items:center;gap:5px;height:30px;padding:0 10px;border-radius:999px;border:1px solid rgba(139,26,26,0.4);background:rgba(139,26,26,0.10);color:var(--fog);font-family:var(--font-vhs);font-size:9px;letter-spacing:1px;cursor:pointer;transition:all .15s}
.codex-member-chip:hover{border-color:rgba(196,63,63,0.5);color:var(--gold-pale)}
.codex-member-chip.active{border-color:rgba(196,63,63,0.7);background:rgba(139,26,26,0.28);color:var(--gold-pale)}
.codex-member-chip-avatar{width:18px;height:18px;border-radius:4px;background:rgba(201,151,58,0.15);border:1px solid rgba(201,151,58,0.25);display:inline-flex;align-items:center;justify-content:center;font-size:9px;color:var(--gold)}
.codex-member-chip.active-member{border-color:rgba(196,63,63,0.7);background:rgba(139,26,26,0.28);color:var(--gold-pale)}

/* ── Quick-Log Sheet ─────────────────────────────────────────────────────── */
.vc-quick-log-backdrop{position:fixed;inset:0;z-index:4500;background:rgba(2,4,10,0.7);backdrop-filter:blur(4px);display:flex;align-items:flex-end;justify-content:center;animation:qlFadeIn .18s ease}
.vc-quick-log-sheet{width:min(560px,100vw);border-radius:20px 20px 0 0;background:linear-gradient(180deg,rgba(14,10,26,0.99),rgba(8,6,18,1));border:1px solid rgba(201,151,58,0.25);border-bottom:none;padding:20px 20px 36px;animation:qlSlideUp .22s cubic-bezier(0.34,1.3,0.64,1);position:relative}
.vc-quick-log-handle{width:36px;height:4px;border-radius:999px;background:rgba(201,151,58,0.25);margin:0 auto 16px}
.vc-quick-log-title{font-family:var(--font-display);font-size:17px;color:var(--gold);letter-spacing:0.5px;margin-bottom:4px}
.vc-quick-log-subtitle{font-family:var(--font-vhs);font-size:10px;letter-spacing:2px;color:var(--dust);text-transform:uppercase;margin-bottom:18px}
.vc-quick-log-section{margin-bottom:16px}
.vc-quick-log-label{font-family:var(--font-vhs);font-size:9px;letter-spacing:2px;color:var(--gold-pale);text-transform:uppercase;margin-bottom:8px}
.vc-quick-log-picker-chips{display:flex;flex-wrap:wrap;gap:6px}
.vc-quick-log-picker-chip{height:32px;padding:0 12px;border-radius:999px;border:1px solid rgba(139,26,26,0.4);background:rgba(139,26,26,0.08);color:var(--fog);font-family:var(--font-vhs);font-size:10px;letter-spacing:1px;cursor:pointer;transition:all .15s}
.vc-quick-log-picker-chip:hover{border-color:rgba(196,63,63,0.55);color:var(--gold-pale)}
.vc-quick-log-picker-chip.selected{border-color:rgba(196,63,63,0.7);background:rgba(139,26,26,0.25);color:var(--gold-pale)}
.vc-quick-log-occasion-chips{display:flex;flex-wrap:wrap;gap:6px}
.vc-quick-log-occasion-chip{height:30px;padding:0 10px;border-radius:999px;border:1px solid var(--border);background:transparent;color:var(--fog);font-family:var(--font-vhs);font-size:9px;letter-spacing:1px;cursor:pointer;transition:all .15s}
.vc-quick-log-occasion-chip:hover{border-color:rgba(201,151,58,0.35);color:var(--gold-pale)}
.vc-quick-log-occasion-chip.selected{border-color:rgba(201,151,58,0.55);background:rgba(201,151,58,0.10);color:var(--gold)}
.vc-quick-log-date-input{width:100%;background:rgba(13,11,26,0.9);color:var(--text);border:1px solid rgba(201,151,58,0.22);border-radius:10px;padding:9px 12px;font-family:var(--font-vhs);font-size:11px;letter-spacing:0.5px;outline:none}
.vc-quick-log-date-input:focus{border-color:rgba(201,151,58,0.45)}
.vc-quick-log-actions{display:flex;gap:8px;margin-top:20px}
.vc-quick-log-actions .btn{flex:1;height:44px;font-size:12px}
@keyframes qlFadeIn{from{opacity:0}to{opacity:1}}
@keyframes qlSlideUp{from{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}

/* ── Picker Profile Panel ────────────────────────────────────────────────── */
.vc-picker-profile{border:1px solid rgba(201,151,58,0.2);border-radius:14px;padding:16px;background:rgba(8,6,18,0.8);margin-bottom:16px}
.vc-picker-profile-header{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.vc-picker-profile-avatar{width:40px;height:40px;border-radius:10px;background:rgba(139,26,26,0.25);border:1px solid rgba(196,63,63,0.4);display:flex;align-items:center;justify-content:center;font-size:18px;color:var(--gold);flex-shrink:0}
.vc-picker-profile-name{font-family:var(--font-display);font-size:16px;color:var(--static)}
.vc-picker-profile-sub{font-family:var(--font-vhs);font-size:9px;letter-spacing:2px;color:var(--dust);text-transform:uppercase;margin-top:2px}
.vc-picker-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px}
.vc-picker-stat{text-align:center;background:rgba(201,151,58,0.05);border:1px solid rgba(201,151,58,0.12);border-radius:8px;padding:10px 6px}
.vc-picker-stat-val{font-family:var(--font-display);font-size:18px;color:var(--gold)}
.vc-picker-stat-label{font-family:var(--font-vhs);font-size:8px;letter-spacing:1.5px;color:var(--dust);text-transform:uppercase;margin-top:2px}
.vc-picker-genre-bar{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.vc-picker-genre-name{font-family:var(--font-vhs);font-size:9px;letter-spacing:1px;color:var(--fog);min-width:80px}
.vc-picker-genre-track{flex:1;height:4px;background:rgba(201,151,58,0.1);border-radius:999px;overflow:hidden}
.vc-picker-genre-fill{height:100%;background:linear-gradient(90deg,rgba(201,151,58,0.5),rgba(201,151,58,0.8));border-radius:999px;transition:width .4s ease}
.vc-picker-genre-count{font-family:var(--font-vhs);font-size:8px;color:var(--dust);min-width:24px;text-align:right}

/* ── Occasion tag on Codex cards ──────────────────────────────────────────── */
.codex-card-occasion{position:absolute;bottom:6px;left:6px;right:6px;text-align:center;background:rgba(0,0,0,0.75);backdrop-filter:blur(3px);border-radius:4px;padding:2px 5px;font-family:var(--font-vhs);font-size:8px;letter-spacing:1px;color:var(--gold-pale);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;z-index:4}

/* ── Month label redesign ─────────────────────────────────────────────────── */
.timeline-month-label-v2{font-family:var(--font-vhs);font-size:10px;letter-spacing:4px;text-transform:uppercase;color:var(--gold);margin-bottom:14px;display:flex;align-items:center;gap:12px;opacity:0.85}
.timeline-month-label-v2::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,rgba(201,151,58,0.3),transparent)}
.vc-ritual-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin-top:6px}
.vc-ritual-card{position:relative;padding:12px;border-radius:12px;border:1px solid var(--ritual-border);background:
  radial-gradient(120% 120% at 100% 0%, var(--ritual-glow-a), transparent 50%),
  radial-gradient(120% 120% at 0% 100%, var(--ritual-glow-b), transparent 60%),
  linear-gradient(180deg, var(--ritual-bg-a), var(--ritual-bg-b));
  box-shadow: inset 0 0 18px rgba(201,151,58,.05), 0 8px 22px rgba(0,0,0,.22);}
.vc-ritual-card::before{content:'';position:absolute;inset:0;border-radius:12px;pointer-events:none;background:linear-gradient(135deg, rgba(201,151,58,.08), transparent 35%, rgba(201,151,58,.03));}
.vc-ritual-sigil{font-size:20px;line-height:1;margin-bottom:6px;filter:drop-shadow(0 0 8px rgba(201,151,58,.18))}
.vc-ritual-name{font-family:var(--font-serif);color:var(--gold-pale);font-size:13px;letter-spacing:.4px}
.vc-ritual-sub{margin-top:6px;color:var(--ritual-subtext);font-size:12px;line-height:1.35}
.vc-ritual-card.vc-ritual-recent{border-color:var(--ritual-recent-border); box-shadow: inset 0 0 18px rgba(232,184,75,.10), 0 8px 22px rgba(0,0,0,.22);}
.vc-ritual-recent-tag{
  position:absolute; top:10px; right:10px;
  padding:3px 8px; border-radius:999px;
  border:1px solid rgba(232,184,75,.55);
  color:rgba(244,220,140,.95);
  background:rgba(12,12,20,.55);
  text-transform:uppercase;
  /* Prevent duplicated text renders (we render the label via ::before) */
  font-size:0; letter-spacing:0;
}
.vc-ritual-recent-tag::before{
  content:"RECENT";
  font-family:var(--font-vhs);
  font-size:11px;
  letter-spacing:1.2px;
}

/* Force-hide RECENT pill (keep recent highlight border/glow) */
.vc-ritual-recent-tag{display:none !important;}


/* Ritual badge hover + legible flavor (single renderer) */
.vc-ritual-flavor{margin-top:6px;color:rgba(232,224,206,0.82);font-size:12.5px;line-height:1.35;max-width:92%;}
.vc-ritual-card{position:relative;overflow:hidden;}
.vc-ritual-hover{position:absolute;inset:0;display:flex;align-items:flex-end;padding:14px 16px;background:rgba(0,0,0,0.62);color:rgba(245,236,210,0.92);font-size:12.5px;line-height:1.35;opacity:0;pointer-events:none;transition:opacity .15s ease;}
.vc-ritual-card:hover .vc-ritual-hover{opacity:1;}
.vc-ritual-card:hover .vc-ritual-flavor{opacity:0;}
.vc-ritual-recent-tag + .vc-ritual-recent-tag{display:none;}


.vc-ritual-card{overflow:hidden; cursor:default;}
.vc-ritual-card.vc-ritual-locked{opacity:.55;}
.vc-ritual-hover{
  position:absolute; inset:0; border-radius:12px;
  display:flex; flex-direction:column; justify-content:center;
  padding:14px;
  background:rgba(6,6,10,.72);
  backdrop-filter: blur(6px);
  opacity:0;
  transition: opacity .18s ease;
}
.vc-ritual-hover-title{
  font-family:var(--font-vhs);
  font-size:11px;
  letter-spacing:1.2px;
  color:rgba(244,220,140,.92);
  text-transform:uppercase;
  margin-bottom:6px;
}
.vc-ritual-hover-rule{
  color:var(--dust);
  font-size:12px;
  line-height:1.35;
}
.vc-ritual-card:hover .vc-ritual-hover,
.vc-ritual-card:focus .vc-ritual-hover{
  opacity:1;
}


/* === VC polish patch: locker spacing, queue readability, badges, themed prompts === */
#view-locker .section-subtitle{margin-bottom:18px !important;}
#view-locker .locker-filters{margin-top:18px !important; gap:12px !important; row-gap:10px !important;}
#view-locker .locker-grid{margin-top:16px !important;}
#view-locker .locker-card{margin-top:2px;}
#view-locker .locker-chip{margin-bottom:8px;}

.queue-item.compact .queue-info,
.queue-item.expanded .queue-info{padding-right:10px;}
.queue-item .queue-title{line-height:1.18;}
.queue-item .queue-meta{line-height:1.25; opacity:.9;}
.queue-item .queue-meta + .queue-meta{opacity:.82;}
.queue-item .vote-wrap{min-width:44px; gap:6px;}
.queue-item .vote-btn{display:flex; align-items:center; justify-content:center;}
.queue-item .queue-auto-badge{display:flex; align-items:center; justify-content:center;}
.queue-item .queue-poster{border-radius:6px;}
.queue-item .vc-badge-next{margin-right:6px;}
.queue-item .queue-meta .vc-badge{vertical-align:middle;}
.queue-item .queue-info .queue-voter-chips{margin-top:6px;}

.vc-ritual-card .vc-ritual-sub,
#p-ritual-badges .vc-ritual-sub,
#p-badges .vc-ritual-sub{color:var(--ritual-subtext); opacity:1; text-shadow:0 0 8px rgba(0,0,0,.35);}

/* Ritual badges hover overlay (earned-only) */
.vc-ritual-card{position:relative; overflow:hidden;}
.vc-ritual-hover{
  position:absolute; inset:0;
  display:flex; align-items:flex-end;
  padding:12px 14px;
  font-size:12px; line-height:1.35;
  color:rgba(231,224,206,.92);
  background:rgba(0,0,0,.55);
  opacity:0; transition:opacity .14s ease;
}
.vc-ritual-card:hover .vc-ritual-hover{opacity:1;}
.vc-ritual-card:hover .vc-ritual-sub{opacity:.18;}

.vc-prompt-backdrop{position:fixed; inset:0; z-index:10000; background:rgba(5,6,12,.74); backdrop-filter:blur(3px); display:flex; align-items:center; justify-content:center; padding:20px;}
.vc-prompt-box{width:min(560px,96vw); border-radius:14px; padding:16px 16px 14px; background:linear-gradient(180deg, rgba(14,12,28,.98), rgba(10,9,20,.98)); border:1px solid rgba(194,142,63,.35); box-shadow:0 20px 60px rgba(0,0,0,.45), inset 0 0 0 1px rgba(194,142,63,.12);}
.vc-prompt-head{display:flex; align-items:center; gap:8px; margin-bottom:10px; color:var(--gold); font-weight:600; letter-spacing:.08em; text-transform:uppercase; font-size:11px;}
.vc-prompt-head .sig{display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; border-radius:999px; border:1px solid rgba(194,142,63,.45); background:rgba(194,142,63,.10); font-size:11px;}
.vc-prompt-label{color:var(--bone); font-size:13px; margin:2px 2px 8px;}
.vc-prompt-input{width:100%; border-radius:10px; padding:10px 12px; background:rgba(10,9,20,.7); color:var(--bone); border:1px solid rgba(194,142,63,.28); outline:none; font-family:var(--font-vhs);}
.vc-prompt-input:focus{border-color:rgba(194,142,63,.6); box-shadow:0 0 0 2px rgba(194,142,63,.14);}
.vc-prompt-actions{display:flex; justify-content:flex-end; gap:8px; margin-top:12px;}


/* === VC ritual badge manager === */
.vc-ritual-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.vc-ritual-head .btn{flex-shrink:0}
.vc-ritual-muted{margin-top:6px;color:rgba(231,224,206,.78);font-size:11px}
.vc-badge-picker-list{display:grid;grid-template-columns:1fr;gap:8px;max-height:42vh;overflow:auto;padding-right:2px}
.vc-badge-picker-item{display:flex;align-items:flex-start;gap:10px;padding:10px;border:1px solid rgba(201,151,58,.18);border-radius:10px;background:rgba(9,10,18,.55)}
.vc-badge-picker-item input{margin-top:3px}
.vc-badge-picker-label{font-family:var(--font-serif);color:var(--gold-pale);font-size:13px}
.vc-badge-picker-sub{font-size:11px;color:rgba(231,224,206,.78);line-height:1.35}


/* Theme Grimoire */
.vc-theme-picker-card{
  margin-top:12px; border:1px solid var(--line); border-radius:14px; padding:14px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--panel) 94%, transparent), color-mix(in srgb, var(--bg2) 92%, transparent));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--gold) 8%, transparent);
}
.vc-theme-picker-card .card-title{ margin-bottom:8px; }
.vc-theme-grimoire-help{
  color: color-mix(in srgb, var(--text) 88%, var(--muted));
  font-size:12px; line-height:1.45; margin-bottom:10px;
}
.vc-theme-recent-row{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:10px; }
.vc-theme-recent-label{ font-size:10px; letter-spacing:.20em; text-transform:uppercase; color: var(--muted); }
.vc-theme-recent-chip{
  border:1px solid color-mix(in srgb, var(--gold) 28%, var(--line));
  background: color-mix(in srgb, var(--panel) 96%, transparent);
  color: var(--gold-pale);
  border-radius:999px; padding:4px 10px; font-size:11px; cursor:pointer;
}
.vc-theme-grid{ display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:10px; }
.vc-theme-card{
  position:relative; text-align:left; cursor:pointer; border-radius:12px;
  border:1px solid color-mix(in srgb, var(--gold) 18%, var(--line));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--panel) 96%, transparent), color-mix(in srgb, var(--bg2) 93%, transparent)),
    repeating-linear-gradient(0deg, rgba(255,255,255,.015), rgba(255,255,255,.015) 1px, transparent 1px, transparent 3px);
  padding:12px 12px 10px; overflow:hidden;
  transition: transform .12s ease, border-color .12s ease, box-shadow .12s ease;
}
.vc-theme-card::before{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.85;
  background:
    radial-gradient(140px 80px at 8% 10%, color-mix(in srgb, var(--gold) 10%, transparent), transparent 70%),
    linear-gradient(135deg, color-mix(in srgb, var(--gold) 7%, transparent), transparent 45%);
}
.vc-theme-card::after{
  content:""; position:absolute; inset:8px; pointer-events:none; border-radius:10px;
  border:1px solid color-mix(in srgb, var(--gold) 10%, transparent);
}
.vc-theme-card:hover{
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--gold) 38%, var(--line));
  box-shadow: 0 8px 20px rgba(0,0,0,.2);
}
.vc-theme-card.active{
  border-color: color-mix(in srgb, var(--gold) 70%, var(--line));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--gold) 24%, transparent), 0 10px 26px color-mix(in srgb, var(--gold) 12%, transparent);
}
.vc-theme-card.active .vc-theme-name{ color: var(--gold); }
.vc-theme-active{
  position:absolute; top:10px; right:10px; z-index:10;
  /* Intense pill — solid gold border, glowing background */
  border:1px solid color-mix(in srgb, var(--gold) 70%, transparent);
  background: color-mix(in srgb, var(--gold) 16%, rgba(0,0,0,.6));
  color: var(--gold);
  border-radius:6px;
  padding:4px 10px 3px;
  font-family: var(--font-vhs, ui-monospace, monospace);
  font-size:9px;
  font-weight:700;
  letter-spacing:.22em;
  text-transform:uppercase;
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--gold) 22%, transparent) inset,
    0 0 10px color-mix(in srgb, var(--gold) 28%, transparent),
    0 2px 6px rgba(0,0,0,.5);
  text-shadow: 0 0 8px color-mix(in srgb, var(--gold) 70%, transparent);
  pointer-events:none;
}
.vc-theme-name{
  position:relative; z-index:1; margin:0 0 4px;
  font-family:var(--font-display); font-size:13px; line-height:1.15;
  color: color-mix(in srgb, var(--text) 96%, white);
  text-shadow: 0 1px 0 rgba(0,0,0,.3);
}
/* Active badge is position:absolute last-child — no padding-right needed */
.vc-theme-flavor{
  position:relative; z-index:1; margin:0;
  color: color-mix(in srgb, var(--bone) 92%, white 8%);
  font-size:12px; line-height:1.45; min-height:32px;
  text-shadow: 0 1px 0 rgba(0,0,0,.35);
}
.vc-theme-swatches{ position:relative; z-index:1; display:flex; gap:6px; margin-top:9px; }
.vc-theme-swatch{ width:13px; height:13px; border-radius:999px; border:1px solid rgba(255,255,255,.22); box-shadow: inset 0 0 0 1px rgba(0,0,0,.2); }

/* Improve readability in light themes specifically */
:root[data-vc-theme="light_academia"] .vc-theme-card,
:root[data-vc-theme="hedgerow"] .vc-theme-card{
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--panel) 99%, white 1%), color-mix(in srgb, var(--bg2) 97%, white 3%)),
    repeating-linear-gradient(0deg, rgba(0,0,0,.018), rgba(0,0,0,.018) 1px, transparent 1px, transparent 3px);
}
:root[data-vc-theme="light_academia"] .vc-theme-name,
:root[data-vc-theme="hedgerow"] .vc-theme-name{
  color: color-mix(in srgb, var(--text) 96%, black);
  text-shadow:none;
}
:root[data-vc-theme="light_academia"] .vc-theme-flavor,
:root[data-vc-theme="hedgerow"] .vc-theme-flavor{
  color: color-mix(in srgb, var(--text) 82%, #3a3127);
}

/* Theme surface polish for softer themes */
:root[data-vc-theme="dark_academia"] .card,
:root[data-vc-theme="dark_academia"] .modal-shell,
:root[data-vc-theme="dark_academia"] .panel,
:root[data-vc-theme="dark_academia"] .queue-item,
:root[data-vc-theme="dark_academia"] .rail-card{
  background: linear-gradient(180deg, rgba(35,27,21,.94), rgba(26,20,16,.94)) !important;
}
:root[data-vc-theme="light_academia"] .card,
:root[data-vc-theme="light_academia"] .modal-shell,
:root[data-vc-theme="light_academia"] .panel,
:root[data-vc-theme="light_academia"] .queue-item,
:root[data-vc-theme="light_academia"] .rail-card{
  background: linear-gradient(180deg, rgba(244,238,226,.96), rgba(236,228,214,.95)) !important;
  color: var(--text) !important;
}
:root[data-vc-theme="hedgerow"] .card,
:root[data-vc-theme="hedgerow"] .modal-shell,
:root[data-vc-theme="hedgerow"] .panel,
:root[data-vc-theme="hedgerow"] .queue-item,
:root[data-vc-theme="hedgerow"] .rail-card{
  background: linear-gradient(180deg, rgba(246,242,234,.96), rgba(236,230,220,.95)) !important;
  color: var(--text) !important;
}
@media (max-width: 860px){ .vc-theme-grid{ grid-template-columns: 1fr; } }


/* ==== Theme Grimoire Legibility + Light Theme Surface Polish ==== */
.theme-grimoire-header p{
  color: rgba(235,226,206,.90) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.35);
}
.theme-grimoire-panel{
  background:
    radial-gradient(120% 120% at 10% 0%, rgba(212,170,74,.08), rgba(212,170,74,0) 55%),
    radial-gradient(120% 120% at 100% 100%, rgba(90,120,200,.07), rgba(90,120,200,0) 55%),
    rgba(8,10,18,.62) !important;
  border-color: rgba(212,170,74,.14) !important;
}
.grimoire-recent{
  color: rgba(226,210,172,.82) !important;
}
.grimoire-recent-chip{
  background: rgba(18,22,34,.85) !important;
  color: rgba(247,238,220,.95) !important;
  border-color: rgba(212,170,74,.22) !important;
}
.grimoire-recent-chip:hover{
  background: rgba(32,38,56,.92) !important;
  border-color: rgba(212,170,74,.35) !important;
}
.grimoire-theme-card{
  background:
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0)),
    rgba(10,12,22,.78) !important;
  border-color: rgba(212,170,74,.16) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.02);
}
.grimoire-theme-card::before{
  opacity:.22 !important;
}
.grimoire-theme-card:hover{
  border-color: rgba(212,170,74,.28) !important;
  background:
    linear-gradient(180deg, rgba(212,170,74,.03), rgba(212,170,74,0)),
    rgba(12,14,26,.86) !important;
}
.grimoire-theme-card.active{
  border-color: rgba(212,170,74,.50) !important;
  box-shadow:
    0 0 0 1px rgba(212,170,74,.10) inset,
    0 0 24px rgba(212,170,74,.10),
    inset 0 1px 0 rgba(255,255,255,.03);
}
.grimoire-theme-card.active::after{
  background: rgba(10,12,20,.82) !important;
  color: #f1ce82 !important;
  border-color: rgba(212,170,74,.24) !important;
}
.grimoire-theme-name{
  color: #f5dfaa !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.35);
}
.grimoire-theme-desc{
  color: rgba(236,229,214,.88) !important;
}
.grimoire-swatch{
  box-shadow: 0 0 0 1px rgba(255,255,255,.05) inset, 0 0 0 1px rgba(0,0,0,.35);
}

/* make settings surfaces match theme vibe more for academia/hedgerow */
body[data-vc-theme="dark-academia"] .settings-section{
  background:
    radial-gradient(120% 120% at 15% 0%, rgba(211,168,102,.08), rgba(211,168,102,0) 55%),
    rgba(29,23,18,.92) !important;
  border-color: rgba(197,154,94,.22) !important;
}
body[data-vc-theme="light-academia"] .settings-section{
  background:
    radial-gradient(120% 120% at 15% 0%, rgba(209,169,112,.10), rgba(209,169,112,0) 55%),
    linear-gradient(180deg, rgba(255,252,244,.06), rgba(255,252,244,.02)),
    rgba(228,218,198,.22) !important;
  border-color: rgba(156,126,87,.28) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35);
}
body[data-vc-theme="hedgerow-witch"] .settings-section{
  background:
    radial-gradient(120% 120% at 10% 0%, rgba(134,164,120,.12), rgba(134,164,120,0) 55%),
    linear-gradient(180deg, rgba(250,247,236,.04), rgba(250,247,236,.01)),
    rgba(23,35,28,.60) !important;
  border-color: rgba(139,166,126,.26) !important;
}
body[data-vc-theme="light-academia"] .theme-grimoire-panel{
  background:
    radial-gradient(120% 120% at 8% 0%, rgba(210,169,111,.10), rgba(210,169,111,0) 55%),
    rgba(241,233,217,.18) !important;
  border-color: rgba(156,126,87,.22) !important;
}
body[data-vc-theme="hedgerow-witch"] .theme-grimoire-panel{
  background:
    radial-gradient(120% 120% at 8% 0%, rgba(134,164,120,.10), rgba(134,164,120,0) 55%),
    rgba(18,30,23,.52) !important;
  border-color: rgba(139,166,126,.22) !important;
}
body[data-vc-theme="dark-academia"] .theme-grimoire-panel{
  background:
    radial-gradient(120% 120% at 8% 0%, rgba(211,168,102,.08), rgba(211,168,102,0) 55%),
    rgba(25,20,16,.74) !important;
  border-color: rgba(197,154,94,.18) !important;
}


/* Grimoire legibility hardening + theme-aware panel surfaces (CSS-only) */
.vc-theme-shell, .vc-theme-shell *{ color: inherit; }
.vc-theme-shell .vc-theme-head{ color: rgba(236,229,214,.95) !important; }
.vc-theme-shell .vc-theme-sub{ color: rgba(236,229,214,.80) !important; }
.vc-theme-shell .vc-theme-recent-label{ color: rgba(236,229,214,.78) !important; }
.vc-theme-shell .vc-theme-recent-chip{
  color: rgba(248,238,212,.96) !important;
  background: rgba(255,214,122,.06) !important;
  border-color: rgba(214,170,80,.28) !important;
}
.vc-theme-card .vc-theme-name{
  color: rgba(248,236,201,.97) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.35);
}
.vc-theme-card .vc-theme-flavor{ color: rgba(231,223,206,.92) !important; }
.vc-theme-card .vc-theme-active{
  color: rgba(247,219,137,.97) !important;
  background: rgba(255,215,120,.14) !important;
  border-color: rgba(214,170,80,.55) !important;
  box-shadow: 0 0 10px rgba(214,170,80,.20), 0 0 0 1px rgba(214,170,80,.14) inset, 0 2px 6px rgba(0,0,0,.5) !important;
  text-shadow: 0 0 8px rgba(247,219,137,.55) !important;
}
/* lighter cards on lighter themes */
:root[data-vc-theme="light_academia"] .vc-theme-shell,
:root[data-vc-theme="hedgerow"] .vc-theme-shell{
  background:
    radial-gradient(120% 120% at 12% 0%, rgba(210,169,111,.08), rgba(210,169,111,0) 55%),
    linear-gradient(180deg, rgba(255,252,246,.03), rgba(255,252,246,.01)),
    rgba(245,239,228,.08) !important;
  border-color: rgba(156,126,87,.20) !important;
}
:root[data-vc-theme="light_academia"] .vc-theme-card,
:root[data-vc-theme="hedgerow"] .vc-theme-card{
  background:
    radial-gradient(120% 120% at 10% 0%, rgba(255,255,255,.16), rgba(255,255,255,0) 60%),
    rgba(255,255,255,.05) !important;
  border-color: rgba(156,126,87,.20) !important;
}
:root[data-vc-theme="light_academia"] .vc-theme-card .vc-theme-name,
:root[data-vc-theme="hedgerow"] .vc-theme-card .vc-theme-name{ color: var(--bone) !important; text-shadow:none; }
:root[data-vc-theme="light_academia"] .vc-theme-card .vc-theme-flavor,
:root[data-vc-theme="hedgerow"] .vc-theme-card .vc-theme-flavor{ color: rgba(44, 34, 26, .86) !important; text-shadow:none !important; }
:root[data-vc-theme="light_academia"] .vc-theme-shell .vc-theme-head,
:root[data-vc-theme="hedgerow"] .vc-theme-shell .vc-theme-head{ color: var(--bone) !important; }
:root[data-vc-theme="light_academia"] .vc-theme-shell .vc-theme-sub,
:root[data-vc-theme="hedgerow"] .vc-theme-shell .vc-theme-sub,
:root[data-vc-theme="light_academia"] .vc-theme-shell .vc-theme-recent-label,
:root[data-vc-theme="hedgerow"] .vc-theme-shell .vc-theme-recent-label{ color: color-mix(in srgb, var(--text) 78%, transparent) !important; }
:root[data-vc-theme="light_academia"] .vc-theme-shell .vc-theme-recent-chip,
:root[data-vc-theme="hedgerow"] .vc-theme-shell .vc-theme-recent-chip{
  color: var(--bone) !important;
  background: rgba(255,255,255,.15) !important;
  border-color: rgba(156,126,87,.28) !important;
}

/* Fix theme surface selectors to use root attr ids actually used by JS */
:root[data-vc-theme="dark_academia"] .settings-section{
  background:
    radial-gradient(120% 120% at 15% 0%, rgba(211,168,102,.08), rgba(211,168,102,0) 55%),
    rgba(29,23,18,.92) !important;
  border-color: rgba(197,154,94,.22) !important;
}
:root[data-vc-theme="light_academia"] .settings-section{
  background:
    radial-gradient(120% 120% at 15% 0%, rgba(209,169,112,.10), rgba(209,169,112,0) 55%),
    linear-gradient(180deg, rgba(255,252,244,.06), rgba(255,252,244,.02)),
    rgba(228,218,198,.22) !important;
  border-color: rgba(156,126,87,.28) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35);
}
:root[data-vc-theme="hedgerow"] .settings-section{
  background:
    radial-gradient(120% 120% at 10% 0%, rgba(134,164,120,.12), rgba(134,164,120,0) 55%),
    linear-gradient(180deg, rgba(250,247,236,.04), rgba(250,247,236,.01)),
    rgba(233,239,229,.22) !important;
  border-color: rgba(139,166,126,.26) !important;
}


/* === Theme Grimoire readability + themed chrome polish (CSS-only safe patch) === */

/* Keep Grimoire text readable over dark cards/shells */
.vc-theme-shell .vc-theme-head,
.vc-theme-shell .vc-theme-sub,
.vc-theme-shell .vc-theme-recent-label{
  color: color-mix(in srgb, var(--bone) 92%, white 8%) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.25);
}
.vc-theme-shell .vc-theme-recent-chip{
  color: var(--gold-pale) !important;
  background: rgba(8,10,18,.55) !important;
  border-color: rgba(201,151,58,.28) !important;
}
.vc-theme-card .vc-theme-name{
  color: color-mix(in srgb, var(--gold-pale) 88%, white 12%) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.35);
}
.vc-theme-card .vc-theme-flavor{
  color: color-mix(in srgb, var(--bone) 82%, transparent) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.25);
}
.vc-theme-card .vc-theme-active{
  color: var(--gold-pale) !important;
  background: rgba(18,22,36,.78) !important;
  border-color: rgba(201,151,58,.55) !important;
  box-shadow: 0 0 10px rgba(201,151,58,.22), 0 0 0 1px rgba(201,151,58,.14) inset, 0 2px 6px rgba(0,0,0,.5) !important;
  text-shadow: 0 0 8px rgba(201,151,58,.55) !important;
}

/* Hedgerow: make the settings shell a little darker so text and cards pop */
:root[data-vc-theme="hedgerow"]{
  --settings-shell-bg: radial-gradient(120% 120% at 12% 8%, rgba(138,167,120,.07), transparent 55%), linear-gradient(180deg, rgba(17,22,16,.94), rgba(11,15,13,.94));
  --settings-shell-border: rgba(164,186,146,.20);
}

:root[data-vc-theme="netrunner"]{
  /* Clean cyan-forward netrunning */
  --void:#05070c; --void2:#080b14; --chamber:#0b1120; --deep:#080b14; --altar:#0b1120; --surface:#101a2c;
  --text:rgba(236,248,255,.92); --static:rgba(236,248,255,.90); --fog:rgba(184,210,235,.55); --dust:rgba(184,210,235,.38);
  --gold:#00f0ff; --gold-pale:rgba(220,252,255,.92);
  --blood:#ff2a3d; --blood-bright:#ff5a67;
  --rim:rgba(0,240,255,.18); --border:rgba(0,240,255,.16); --border-bright:rgba(0,240,255,.40);
  --nr-cyan:#00f0ff; --nr-blue:#2c7bff; --nr-violet:#7b2cff; --nr-red:#ff2a3d;
}
:root[data-vc-theme="blackwall"]{
  /* Blackwall — CP2077 arterial red, corrupted void, daemon static */
  --void:#07040a; --void2:#0e0508; --chamber:#160a0c; --deep:#0e0508; --altar:#160a0c; --surface:#200b0e;
  --bg:#07040a; --bg2:#0e0508; --panel:#160a0c; --panel2:#1c0c0f;
  --text:rgba(255,228,228,.92); --static:rgba(255,220,220,.88);
  --fog:rgba(255,160,160,.50); --dust:rgba(255,130,130,.32);
  /* Primary accent: hot arterial red */
  --gold:#ff1f35; --gold-pale:rgba(255,200,200,.94);
  --gold-dim:rgba(255,31,53,.55); --gold-glow:rgba(255,31,53,.28);
  /* Secondary: corrupted violet flickers */
  --blood:#9b30ff; --blood-bright:#c466ff;
  /* Borders + rims bleed red */
  --rim:rgba(255,31,53,.22); --border:rgba(255,31,53,.20); --border-bright:rgba(255,31,53,.55);
  --line:rgba(255,31,53,.14);
  /* Named aliases */
  --bw-red:#ff1f35; --bw-violet:#9b30ff; --bw-cyan:#00f0ff;
  /* Scrollbars, selections */
  --accent:var(--bw-red); --accent-dim:rgba(255,31,53,.18);
}

/* Netrunner: active badge in cyan */
:root[data-vc-theme="netrunner"] .vc-theme-active{
  border-color: rgba(0,240,255,.70) !important;
  background: rgba(0,240,255,.12) !important;
  color: #00f0ff !important;
  box-shadow: 0 0 12px rgba(0,240,255,.30), 0 0 0 1px rgba(0,240,255,.18) inset, 0 2px 6px rgba(0,0,0,.5) !important;
  text-shadow: 0 0 10px rgba(0,240,255,.70) !important;
}
/* Blackwall: active badge — arterial red glow */
:root[data-vc-theme="blackwall"] .vc-theme-active{
  border-color: rgba(255,31,53,.75) !important;
  background: rgba(255,10,30,.13) !important;
  color: #ff4d60 !important;
  box-shadow: 0 0 14px rgba(255,31,53,.40), 0 0 0 1px rgba(255,31,53,.22) inset, 0 2px 8px rgba(0,0,0,.6) !important;
  text-shadow: 0 0 10px rgba(255,31,53,.75) !important;
}:root[data-vc-theme="hedgerow"] .settings-section,
:root[data-vc-theme="hedgerow"] .theme-grimoire-panel,
:root[data-vc-theme="hedgerow"] .settings-tabs,
:root[data-vc-theme="hedgerow"] .settings-subtabs{
  background: var(--settings-shell-bg) !important;
  border-color: var(--settings-shell-border) !important;
  box-shadow: inset 0 1px 0 rgba(241,236,220,.04), 0 10px 32px rgba(0,0,0,.22);
}

/* Dynamic top nav + sidebar chrome for academia/hedgerow themes */
:root[data-vc-theme="dark_academia"]{
  --nav-shell: linear-gradient(180deg, rgba(27,22,18,.96), rgba(22,18,15,.95));
  --nav-border: rgba(201,164,112,.18);
}
:root[data-vc-theme="dark_academia"]{
  --sidebar-shell: linear-gradient(180deg, rgba(24,20,16,.98), rgba(18,15,12,.98));
  --sidebar-border: rgba(201,164,112,.14);
}
:root[data-vc-theme="dark_academia"]{
  --nav-active-bg: rgba(201,164,112,.08);
  --nav-active-border: rgba(201,164,112,.20);
  --sidebar-active-bg: rgba(201,164,112,.08);
  --sidebar-active-border: rgba(201,164,112,.20);
}
:root[data-vc-theme="light_academia"]{
  --nav-shell: linear-gradient(180deg, rgba(243,239,228,.96), rgba(236,231,217,.94));
  --nav-border: rgba(145,115,84,.20);
}
:root[data-vc-theme="light_academia"]{
  --sidebar-shell: linear-gradient(180deg, rgba(241,236,224,.98), rgba(232,226,212,.98));
  --sidebar-border: rgba(145,115,84,.16);
}
:root[data-vc-theme="light_academia"] .nav-logo{ color:#6c5032 !important; text-shadow:none !important; }
:root[data-vc-theme="light_academia"] .nav-logo .sigil{ color:#9f6a47 !important; }
:root[data-vc-theme="light_academia"] .nav-links a,
:root[data-vc-theme="light_academia"] .nav-right span,
:root[data-vc-theme="light_academia"] .sidebar-item,
:root[data-vc-theme="light_academia"] .sidebar-section-label{ color: rgba(56,44,32,.78) !important; }
:root[data-vc-theme="light_academia"]{
  --nav-active-bg: rgba(145,115,84,.08);
  --nav-active-border: rgba(145,115,84,.20);
  --sidebar-active-bg: rgba(145,115,84,.08);
  --sidebar-active-border: rgba(145,115,84,.20);
}
:root[data-vc-theme="light_academia"] .nav-links a:hover,
:root[data-vc-theme="light_academia"] .nav-links a.active,
:root[data-vc-theme="light_academia"] .sidebar-item:hover,
:root[data-vc-theme="light_academia"] .sidebar-item.active{
  color: #5a4126 !important;
}
:root[data-vc-theme="light_academia"] .sidebar-group-icon{
  background: rgba(255,250,242,.75) !important;
  border-color: rgba(145,115,84,.20) !important;
  color: #6c5032 !important;
}

:root[data-vc-theme="hedgerow"]{
  --nav-shell: radial-gradient(90% 180% at 10% 0%, rgba(120,153,112,.10), transparent 60%), linear-gradient(180deg, rgba(21,27,21,.96), rgba(15,20,16,.95));
  --nav-border: rgba(164,186,146,.18);
}
:root[data-vc-theme="hedgerow"]{
  --sidebar-shell: radial-gradient(120% 140% at 10% 0%, rgba(120,153,112,.08), transparent 60%), linear-gradient(180deg, rgba(17,23,18,.98), rgba(12,16,13,.98));
  --sidebar-border: rgba(164,186,146,.14);
}
:root[data-vc-theme="hedgerow"]{
  --nav-active-bg: rgba(164,186,146,.07);
  --nav-active-border: rgba(164,186,146,.18);
  --sidebar-active-bg: rgba(164,186,146,.07);
  --sidebar-active-border: rgba(164,186,146,.18);
}
.vc-ritual-card.vc-ritual-locked{opacity:.55;filter:saturate(.6) brightness(.9)}

/* === merged from vc-next-bundle-patch-css === */

/* Themeable form controls (fix white native selects/inputs) */
select, .select, input[type="text"], input[type="search"], input[type="number"], textarea{
  background: linear-gradient(180deg, rgba(14,12,28,.96), rgba(10,9,20,.96));
  color: var(--bone);
  border: 1px solid rgba(201,151,58,.24);
}
select:focus, input[type="text"]:focus, input[type="search"]:focus, input[type="number"]:focus, textarea:focus{
  outline:none; border-color: rgba(201,151,58,.5); box-shadow:0 0 0 2px rgba(201,151,58,.12);
}
#modal-content select{ min-height:34px; border-radius:8px; padding:4px 8px; }

/* Ritual readability + glow */
#p-ritual-badges .vc-ritual-sub{ color: rgba(241,236,223,.96) !important; opacity:1 !important; }
#p-ritual-badges .vc-ritual-card.vc-recent-earned{
  border-color: rgba(240,195,92,.65);
  box-shadow: 0 0 0 1px rgba(240,195,92,.18), 0 0 22px rgba(240,195,92,.18), inset 0 0 18px rgba(240,195,92,.06);
  animation: vcRecentPulse 2.8s ease-in-out infinite;
}
#p-ritual-badges .vc-ritual-card .vc-recent-chip{
  margin-left:auto; font-size:9px; letter-spacing:.15em; text-transform:uppercase;
  color:#f3d68e; border:1px solid rgba(240,195,92,.35); border-radius:999px; padding:2px 6px; background:rgba(240,195,92,.08);
}
@keyframes vcRecentPulse { 0%,100%{ box-shadow:0 0 0 1px rgba(240,195,92,.18),0 0 14px rgba(240,195,92,.10);} 50%{ box-shadow:0 0 0 1px rgba(240,195,92,.24),0 0 28px rgba(240,195,92,.22);} }

/* Queue layout cleanup */
.queue-item .vote-wrap{
  min-width: 42px !important;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  align-self:center !important; gap:6px;
}
.queue-item .vote-btn{ margin-top:0 !important; width:30px; height:30px; }
.queue-item .queue-auto-badge{ width:30px; height:30px; }
.queue-item.compact, .queue-item.expanded{ align-items:center; }
.queue-item .queue-info{ min-width:0; flex:1; }

/* Locker spacing */
#view-locker .segmented{ margin-top: 16px !important; margin-bottom: 12px !important; }
#view-locker .poster-grid, #view-locker .grid{ margin-top: 10px !important; }
#view-locker .title-card, #view-locker .locker-card, #view-locker .poster-card{ margin-top: 6px; }

/* TV modal spacing + collapse */
#modal-content .vc-tv-collapse-toggle{ border-color:rgba(201,151,58,.45) !important; box-shadow:0 0 12px rgba(201,151,58,.08); }
#modal-content.vc-collapse-meta .modal-section-label,
#modal-content.vc-collapse-meta .watch-history-list,
#modal-content.vc-collapse-meta #tv-series-instance-panel,
#modal-content.vc-collapse-meta #tv-season-instance-panel,
#modal-content.vc-collapse-meta .tag-input,
#modal-content.vc-collapse-meta textarea,
#modal-content.vc-collapse-meta .modal-actions{
  display:none !important;
}
#modal-content.vc-collapse-meta [id*="review-input"]{ display:none !important; }
#modal-content .modal-actions{ margin-bottom: 12px !important; }
#modal-content .modal-section-label{ margin-top: 12px !important; }

/* Theme variables */
:root[data-vc-theme="videoccult"]{ }
:root[data-vc-theme="lovecraft"]{
  --void:#071014; --void2:#0b1a20; --chamber:#0f2228; --ink:#d6e6de; --text:#d6e6de; --bone:#dbe8e2;
  --gold:#8fb6a5; --gold-pale:#d5efe5; --blood:#153a38; --blood-bright:#2c6b68; --rim:rgba(143,182,165,.28);
}
:root[data-vc-theme="witch"]{
  --void:#0c0714; --void2:#140b1f; --chamber:#1b1029; --text:#efe6f8; --bone:#f2eaf9;
  --gold:#b78cff; --gold-pale:#f3eaff; --blood:#5b246f; --blood-bright:#8e44ad; --rim:rgba(183,140,255,.28);
}
:root[data-vc-theme="dark_academia"]{
  --void:#120d0a; --void2:#1a1410; --chamber:#231b15; --text:#efe3cf; --bone:#f3e8d6;
  --gold:#b98b55; --gold-pale:#f0ddbf; --blood:#5a2e21; --blood-bright:#85412f; --rim:rgba(185,139,85,.26);
}
:root[data-vc-theme="light_academia"]{
  --void:#ede6da; --void2:#e8dfcf; --chamber:#f4eee2; --text:#2b2218; --bone:#33291e;
  --gold:#8e6a3d; --gold-pale:#f6f0e3; --blood:#8a4c3c; --blood-bright:#a55c49; --rim:rgba(142,106,61,.25);
}
:root[data-vc-theme="hedgerow"]{
  --void:#f2eee5; --void2:#ebe5d8; --chamber:#f6f2ea; --text:#2e342d; --bone:#3a4038;
  --gold:#7e8f74; --gold-pale:#f3eee6; --blood:#a07a84; --blood-bright:#b28c96; --rim:rgba(126,143,116,.22);
}
:root[data-vc-theme="light_academia"] body,
:root[data-vc-theme="hedgerow"] body{ color:var(--text); }


/* === merged from vc-hotfix-followup === */

/* Follow-up UI bugfixes */
#view-my-locker .page-header{margin-bottom:22px !important;}
#view-my-locker .locker-filters{margin-top:22px !important; margin-bottom:18px !important; padding-top:4px !important;}
#view-my-locker #my-locker-grid{margin-top:20px !important; padding-top:8px !important;}
#view-coven-locker .locker-filters{margin-top:22px !important; margin-bottom:18px !important; padding-top:4px !important;}
#view-coven-locker #coven-locker-grid{margin-top:20px !important; padding-top:8px !important;}

#modal-content select,
#modal-content input[type="text"],
#modal-content input[type="number"],
#modal-content textarea{
  background: rgba(12,10,18,0.92) !important;
  color: var(--static) !important;
  border: 1px solid var(--border) !important;
  border-radius: 6px !important;
  box-shadow: inset 0 0 0 1px rgba(201,151,58,0.04);
}
#modal-content select:focus,
#modal-content input[type="text"]:focus,
#modal-content input[type="number"]:focus,
#modal-content textarea:focus{
  outline: none !important;
  border-color: var(--gold) !important;
  box-shadow: 0 0 0 2px rgba(201,151,58,0.16) !important;
}
#modal-content select option{
  background:#0f0c14 !important;
  color:#efe6cf !important;
}

/* VC hotfix: remove RECENT pill + recent highlight */
.vc-ritual-recent-tag{display:none !important;}
.vc-ritual-card.vc-ritual-recent{border-color: rgba(255,255,255,0.10) !important; box-shadow:none !important;}
.vc-ritual-card.vc-ritual-recent:hover{box-shadow:none !important;}

/* --- Grimoire flavor text legibility override (final) --- */
.vc-theme-card .vc-theme-flavor{
  opacity: 1 !important;
  font-size: 12.5px !important;
  line-height: 1.5 !important;
  color: rgba(236, 228, 210, .92) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.45) !important;
}
:root[data-vc-theme="light_academia"] .vc-theme-card .vc-theme-flavor,
:root[data-vc-theme="hedgerow"] .vc-theme-card .vc-theme-flavor{
  color: rgba(44, 34, 26, .86) !important;
  text-shadow: none !important;
}


/* === merged from vc-session-k1-styles === */


/* ── K1-D: Uniform info box height under discover posters ── */
/* Every result-card info panel is the same height regardless of
   title length, so the grid rows align cleanly. */
.result-info {
  padding: 8px 10px 10px;
  min-height: 52px;          /* enough for 2-line title + year */
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.result-title {
  /* clamp to exactly 2 lines */
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  min-height: 2lh;           /* reserve 2-line height even for short titles */
  flex: 1;
}
.result-year {
  margin-top: 4px;
  flex-shrink: 0;
}

/* ── K1-E: Queue grid action buttons pinned to bottom ── */
/* Give the info panel flex-column layout so the actions row
   always sits at the very bottom regardless of title/meta height */
.vc-queue-grid-info {
  display: flex !important;
  flex-direction: column !important;
}
.vc-queue-grid-actions {
  margin-top: auto !important;   /* push buttons to bottom */
  padding-top: 6px;
}

/* ── K1-B: Wishlist sort buttons ── */
.vc-wl-sort-bar {
  display: flex;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 8px;
}
.vc-wl-sort-btn {
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: rgba(12,10,20,0.75);
  color: var(--dust);
  font-family: var(--font-vhs);
  font-size: 9px;
  letter-spacing: 1px;
  text-transform: uppercase;
  cursor: pointer;
  transition: all 0.15s;
}
.vc-wl-sort-btn:hover { border-color: var(--gold); color: var(--gold); }
.vc-wl-sort-btn.active {
  color: var(--gold);
  border-color: var(--gold);
  box-shadow: 0 0 10px rgba(191,165,106,0.18) inset;
}

/* ── K1-C: Infinite scroll sentinel ── */
#vc-discover-sentinel {
  grid-column: 1 / -1;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#vc-discover-sentinel .loading-spinner {
  opacity: 0;
  transition: opacity 0.2s;
}
#vc-discover-sentinel.loading .loading-spinner {
  opacity: 1;
}


/* === merged from vc-session-l1-styles === */

.vc-card-franchise-slot {
  margin-top: 5px;
  min-height: 18px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
}
.locker-card .vc-add-franchise-btn,
.vc-wishlist-card .vc-add-franchise-btn {
  font-size: 8px;
  padding: 1px 5px;
  opacity: 0;
  transition: opacity 0.15s;
}
.locker-card:hover .vc-add-franchise-btn,
.vc-wishlist-card:hover .vc-add-franchise-btn,
.locker-card:focus-within .vc-add-franchise-btn,
.vc-wishlist-card:focus-within .vc-add-franchise-btn,
.vc-wl-list-card:hover .vc-add-franchise-btn { opacity: 1; }
.locker-card .vc-franchise-badge,
.vc-wishlist-card .vc-franchise-badge { opacity: 1 !important; }
.queue-item .vc-add-franchise-btn { opacity: 0; transition: opacity 0.15s; }
.queue-item:hover .vc-add-franchise-btn { opacity: 1; }


/* === merged from vc-session-p-styles === */

/* SESSION P — TV System Rewrite — no additional CSS required; leverages existing vc-badge-wt */


/* === merged from vc-queue-system-styles === */


/* ── Queue card: list view — full-height poster ── */
.vc-queue-card .vc-queue-poster-wrap {
  width: 96px !important;
  flex-shrink: 0 !important;
  align-self: stretch !important;
  position: relative !important;
  overflow: hidden !important;
  min-height: 110px;
}
.vc-queue-card .vc-queue-poster-wrap img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  position: static !important;
}
.vc-queue-card .vc-queue-poster-wrap .vc-queue-poster-placeholder {
  width: 100% !important;
  height: 100% !important;
  min-height: 110px;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 28px;
}
.vc-queue-card .vc-queue-poster-wrap .vc-queue-rank {
  position: absolute;
  top: 4px;
  left: 4px;
  z-index: 2;
}
.vc-queue-card {
  min-height: 120px;
}

/* ── Drag states ── */
/* Card being dragged */
.vcq-dragging {
  opacity: 0.4 !important;
  outline: 2px dashed rgba(201,151,58,0.6);
  outline-offset: -2px;
}
/* Drop target highlight */
.vcq-drag-target {
  outline: 2px solid rgba(201,151,58,0.8) !important;
  outline-offset: -2px;
  background: rgba(201,151,58,0.06) !important;
}
/* Suppress hover lift during drag */
body.vcq-drag-active .vc-queue-card:hover,
body.vcq-drag-active .vc-queue-grid-card:hover {
  transform: none !important;
  box-shadow: none !important;
}

/* ── Events panel spacing ── */
#vc-events-panel-host {
  margin-top: 8px !important;
  padding-top: 10px !important;
  border-top: 1px solid var(--border);
}
#queue-page-recommendation {
  margin-bottom: 18px;
}

/* ── Queue grid layout ── */
.vc-queue-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 0;
  padding: 0;
}
.vc-queue-grid-card {
  background: var(--surface);
  border: none;
  border-radius: 0;
  overflow: hidden;
  cursor: pointer;
  transition: transform 0.15s, box-shadow 0.15s;
  transition: transform 0.15s, box-shadow 0.15s;
  position: relative;
  display: flex;
  flex-direction: column;
}
.vc-queue-grid-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0,0,0,0.4);
}
.vc-queue-grid-poster {
  position: relative;
  aspect-ratio: 2/3;
  overflow: hidden;
  background: var(--chamber);
}
.vc-queue-grid-poster img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
}
.vc-queue-grid-poster-placeholder {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  font-size: 28px; color: var(--dust);
}
.vc-queue-grid-rank {
  position: absolute; top: 4px; left: 4px;
  background: rgba(0,0,0,0.7); color: var(--gold);
  font-family: var(--font-vhs); font-size: 9px;
  padding: 1px 4px; border-radius: 3px; z-index: 2;
}
.vc-queue-grid-drag {
  position: absolute; top: 4px; right: 4px;
  background: rgba(0,0,0,0.6); color: var(--fog);
  font-size: 12px; padding: 2px 4px; border-radius: 3px;
  cursor: grab; z-index: 2;
}
.vc-queue-grid-vote-overlay {
  position: absolute; bottom: 0; left: 0; right: 0;
  background: linear-gradient(transparent, rgba(0,0,0,0.7));
  padding: 8px 6px 4px;
  display: flex; align-items: center; gap: 4px;
}
.vc-queue-grid-votes-label {
  font-family: var(--font-vhs); font-size: 9px; color: var(--fog);
}
.vc-queue-grid-info {
  padding: 6px 8px 8px;
  flex: 1; display: flex; flex-direction: column; gap: 3px;
}
.vc-queue-grid-title {
  font-family: var(--font-occult); font-size: 11px;
  color: var(--static); line-height: 1.3;
  display: -webkit-box; -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; overflow: hidden;
}
.vc-queue-grid-meta {
  font-family: var(--font-vhs); font-size: 8px; color: var(--fog);
}
.vc-queue-grid-actions {
  display: flex; gap: 4px; margin-top: 4px;
}
.vc-queue-grid-btn {
  flex: 1; padding: 4px; background: var(--chamber);
  border: 1px solid var(--border); border-radius: 3px;
  color: var(--fog); font-size: 11px; cursor: pointer;
  transition: background 0.1s, color 0.1s;
}
.vc-queue-grid-btn:hover { background: var(--surface); color: var(--static); }
.vc-queue-grid-btn.voted { color: var(--gold); border-color: var(--gold); }
.vc-queue-grid-btn.vetoed { color: var(--blood-bright); border-color: var(--blood); }
.vc-queue-grid-btn.danger:hover { background: var(--blood); color: #fff; }

/* ── Coven Favorites rail ── */
.vc-queue-favorites-rail {
  margin-bottom: 8px;
}
.vc-queue-favorites-header {
  display: flex; align-items: baseline; gap: 10px; margin-bottom: 10px;
}
.vc-queue-favorites-title {
  font-family: var(--font-occult); font-size: 13px; color: var(--gold);
}
.vc-queue-favorites-sub {
  font-family: var(--font-vhs); font-size: 9px; color: var(--fog);
}
.vc-queue-favorites-scroll {
  display: flex; gap: 10px; overflow-x: auto;
  padding-bottom: 6px; scrollbar-width: thin;
}
.vc-queue-fav-card {
  flex-shrink: 0; width: 120px; cursor: pointer;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); overflow: hidden;
  transition: transform 0.15s;
}
.vc-queue-fav-card:hover { transform: translateY(-2px); }
.vc-queue-fav-card img { width: 100%; height: 160px; object-fit: cover; display: block; }
.vc-queue-fav-body { padding: 6px 8px 8px; }
.vc-queue-fav-rank { font-family: var(--font-vhs); font-size: 9px; color: var(--gold); }
.vc-queue-fav-title {
  font-family: var(--font-occult); font-size: 10px; color: var(--static);
  margin-top: 2px; display: -webkit-box; -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; overflow: hidden;
}
.vc-queue-fav-votes { font-family: var(--font-vhs); font-size: 8px; color: var(--fog); margin-top: 3px; }
.vc-queue-fav-signal { font-family: var(--font-vhs); font-size: 7px; color: var(--dust); margin-top: 2px; }
.vc-queue-fav-coverage-bar {
  height: 2px; background: var(--chamber); border-radius: 1px; margin-top: 4px;
}
.vc-queue-fav-coverage-fill { height: 100%; background: var(--gold); border-radius: 1px; }

/* ── Sort toolbar "Manual Order" button ── */
.queue-sort-btn.vc-drag-mode-active {
  background: rgba(201,151,58,0.12);
  border-color: rgba(201,151,58,0.5);
  color: var(--gold);
}

/* ── Wishlist sort bar ── */
.vc-wl-sort-bar {
  display: flex; align-items: center; gap: 6px;
  margin: 10px 0 6px; padding: 6px 0;
  border-bottom: 1px solid var(--border);
}
.vc-wl-sort-btn {
  font-family: var(--font-vhs); font-size: 9px; letter-spacing: 0.5px;
  background: transparent; border: 1px solid var(--border);
  border-radius: 3px; color: var(--fog); padding: 3px 8px; cursor: pointer;
}
.vc-wl-sort-btn.active { border-color: var(--gold); color: var(--gold); }


/* === ritual badges CSS === */
.vc-ritual-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.vc-ritual-actions{display:flex;gap:8px;flex-wrap:wrap}
.vc-ritual-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.vc-ritual-card{position:relative;border:1px solid rgba(212,170,88,.28);border-radius:16px;padding:14px 14px 12px;background:linear-gradient(180deg, rgba(12,14,28,.9), rgba(8,9,18,.95));box-shadow:inset 0 0 0 1px rgba(255,255,255,.02)}
.vc-ritual-card::before{content:'';position:absolute;inset:0;border-radius:16px;pointer-events:none;background:radial-gradient(80% 120% at 8% 100%, rgba(197,74,41,.12), transparent 55%), radial-gradient(85% 85% at 100% 0%, rgba(73,54,175,.16), transparent 60%)}
.vc-ritual-card.uncommon{border-color:rgba(115,185,140,.35)}
.vc-ritual-card.rare{border-color:rgba(98,136,215,.42)}
.vc-ritual-card.epic{border-color:rgba(174,109,230,.42)}
.vc-ritual-card.legendary{border-color:rgba(225,180,80,.48); box-shadow:0 0 0 1px rgba(225,180,80,.12), 0 8px 28px rgba(0,0,0,.28)}
.vc-ritual-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:8px}
.vc-ritual-sigil{font-size:22px;line-height:1;opacity:.95}
.vc-ritual-rarity{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:rgba(235,223,189,.75);border:1px solid rgba(212,170,88,.22);padding:2px 6px;border-radius:999px;background:rgba(255,255,255,.02)}
.vc-ritual-name{font-family: var(--font-display,serif);font-size:15px;line-height:1.2;color:#f2d48d;margin-bottom:5px}
.vc-ritual-sub{font-size:12px;line-height:1.35;color:rgba(235,230,214,.92);opacity:.98}
.vc-ritual-lore{margin-top:7px;font-size:11px;line-height:1.35;color:rgba(194,182,157,.82);font-style:italic}
.vc-ritual-locked{opacity:.48;filter:saturate(.55)}
.vc-ritual-locked .vc-ritual-name{color:#d4c9af}
.vc-ritual-locked .vc-ritual-sub{color:rgba(219,210,191,.78)}
.vc-ritual-manager-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 10px}
.vc-ritual-manager-list{display:grid;gap:8px;max-height:52vh;overflow:auto;padding-right:4px}
.vc-ritual-manager-item{display:flex;align-items:flex-start;gap:10px;border:1px solid rgba(212,170,88,.16);border-radius:12px;padding:10px;background:rgba(10,12,22,.55)}
.vc-ritual-manager-item .meta{flex:1;min-width:0}
.vc-ritual-manager-item .name{color:#f2d48d;font-size:14px}
.vc-ritual-manager-item .sub{font-size:12px;color:rgba(235,230,214,.9);margin-top:2px}
.vc-ritual-manager-item .lore{font-size:11px;color:rgba(194,182,157,.82);font-style:italic;margin-top:4px}
.vc-ritual-manager-item .state{font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:rgba(235,223,189,.7)}
.vc-ritual-manager-item.locked{opacity:.65}
.vc-ritual-manager-item input{margin-top:2px}
.vc-ritual-muted{margin-top:8px;font-size:11px;color:rgba(194,182,157,.78)}