/** Shopify CDN: Minification failed

Line 29:0 All "@import" rules must come first

**/
/* =============================================================
   SULLIOS VAULT — sullios-vault.css
   Upload to: Online Store → Themes → Edit Code → Assets
   ============================================================= */

/* RESET & BASE */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }

.sv-gate,
.sv-vault {
  background: var(--sv-navy, #07101E);
  color: var(--sv-mid, #C8C3BA);
  font-family: 'Barlow', sans-serif;
  font-weight: 300;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

/* FONTS — load in theme.liquid or layout file */
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,300;0,400;0,700;0,900;1,300;1,700&family=Barlow:wght@300;400;500&display=swap');

img { display: block; width: 100%; height: 100%; object-fit: cover; }
a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; }

/* ── NAV ── */
.sv-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.75rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  background: var(--sv-navy, #07101E);
  position: sticky;
  top: 0;
  z-index: 50;
}
.sv-nav-logo {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--sv-text, #F0EBE0);
}
.sv-nav-right { display: flex; align-items: center; gap: 1.25rem; }
.sv-nav-link {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--sv-dim, #3A3835);
  font-weight: 500;
}
.sv-nav-vault-tag {
  display: flex;
  align-items: center;
  gap: 6px;
  background: rgba(210,255,30,0.08);
  border: 1px solid rgba(210,255,30,0.18);
  border-radius: 100px;
  padding: 4px 10px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--sv-acid, #D2FF1E);
}
.sv-nav-dot {
  width: 5px; height: 5px;
  border-radius: 50%;
  background: var(--sv-acid, #D2FF1E);
  animation: sv-pulse 2s ease-in-out infinite;
}
.sv-nav-member {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--sv-dim, #3A3835);
  font-weight: 500;
}
@keyframes sv-pulse { 0%,100%{opacity:1;} 50%{opacity:0.2;} }

/* ── SHARED TYPOGRAPHY ── */
.sv-kicker {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--sv-acid, #D2FF1E);
  font-weight: 500;
  margin-bottom: 0.6rem;
}

/* ── GATE PAGE ── */
.sv-gate-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 3rem 1.75rem;
  text-align: center;
}
.sv-gate-icon {
  width: 64px; height: 64px;
  border-radius: 50%;
  border: 1px solid rgba(210,255,30,0.15);
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 1.75rem;
  transition: border-color 0.3s;
}
.sv-gate-icon.checking { border-color: rgba(210,255,30,0.4); animation: sv-gate-ring 1.5s ease-in-out infinite; }
.sv-gate-icon.success  { border-color: rgba(210,255,30,0.6); }
.sv-gate-icon.fail     { border-color: rgba(210,80,30,0.4); }
@keyframes sv-gate-ring {
  0%   { box-shadow: 0 0 0 0 rgba(210,255,30,0.2); }
  50%  { box-shadow: 0 0 0 8px rgba(210,255,30,0.04); }
  100% { box-shadow: 0 0 0 0 rgba(210,255,30,0); }
}
.sv-gate-h1 {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(36px, 8vw, 64px);
  font-weight: 900;
  line-height: 0.88;
  text-transform: uppercase;
  color: var(--sv-text, #F0EBE0);
  margin-bottom: 0.75rem;
  letter-spacing: -0.01em;
}
.sv-gate-h1 em { font-style: italic; font-weight: 300; color: var(--sv-dim, #3A3835); display: block; }
.sv-gate-intro {
  font-size: 14px;
  color: var(--sv-dim, #3A3835);
  font-weight: 300;
  line-height: 1.7;
  max-width: 280px;
  margin: 0 auto 2rem;
}
.sv-gate-form { width: 100%; max-width: 300px; margin: 0 auto; display: flex; flex-direction: column; gap: 8px; }
.sv-input-wrap { position: relative; }
.sv-input {
  background: var(--sv-navy-mid, #060F1B);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 3px;
  padding: 13px 14px;
  font-size: 14px;
  color: var(--sv-text, #F0EBE0);
  font-family: 'Barlow', sans-serif;
  font-weight: 300;
  outline: none;
  width: 100%;
  transition: border-color 0.2s;
  -webkit-appearance: none;
}
.sv-input::placeholder { color: rgba(255,255,255,0.08); }
.sv-input:focus  { border-color: rgba(210,255,30,0.22); }
.sv-input.error  { border-color: rgba(210,80,30,0.45); }
.sv-input.valid  { border-color: rgba(210,255,30,0.35); }
.sv-gate-status {
  font-size: 12px;
  font-weight: 300;
  line-height: 1.5;
  min-height: 18px;
}
.sv-gate-status.fail { color: rgba(210,80,30,0.8); }
.sv-gate-status.checking { color: var(--sv-muted, #6A665F); }

.sv-join-prompt { display: none; margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,0.05); width: 100%; max-width: 300px; }
.sv-join-prompt.visible { display: block; }
.sv-join-prompt p { font-size: 12px; color: var(--sv-dim, #3A3835); font-weight: 300; margin-bottom: 0.75rem; }

.sv-unlocking { display: none; text-align: center; width: 100%; max-width: 300px; margin: 0 auto; }
.sv-unlocking.visible { display: block; }
.sv-unlock-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 22px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.06em; color: var(--sv-text, #F0EBE0); margin-bottom: 0.4rem;
}
.sv-unlock-sub  { font-size: 13px; color: var(--sv-acid, #D2FF1E); font-weight: 300; margin-bottom: 1rem; }
.sv-unlock-bar-wrap { width: 100%; height: 2px; background: rgba(255,255,255,0.06); border-radius: 2px; overflow: hidden; margin-bottom: 0.5rem; }
.sv-unlock-bar  { height: 100%; background: var(--sv-acid, #D2FF1E); width: 0%; border-radius: 2px; transition: width 1.8s ease; }
.sv-unlock-note { font-size: 11px; color: var(--sv-dim, #3A3835); font-weight: 300; }

/* ── SHARED BUTTONS ── */
.sv-btn-primary {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  background: var(--sv-acid, #D2FF1E);
  color: var(--sv-navy, #07101E);
  border: none;
  border-radius: 3px;
  padding: 13px 20px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 12px; font-weight: 700;
  letter-spacing: 0.2em; text-transform: uppercase;
  cursor: pointer;
  width: 100%;
  transition: background 0.15s, transform 0.1s, opacity 0.15s;
}
.sv-btn-primary:hover   { background: var(--sv-acid-h, #E0FF50); }
.sv-btn-primary:active  { transform: scale(0.98); }
.sv-btn-primary:disabled { opacity: 0.35; cursor: default; }

.sv-btn-ghost {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  background: transparent;
  color: var(--sv-dim, #3A3835);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 3px;
  padding: 11px 20px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px; font-weight: 600;
  letter-spacing: 0.18em; text-transform: uppercase;
  cursor: pointer; width: 100%;
  transition: border-color 0.15s, color 0.15s;
}
.sv-btn-ghost:hover { border-color: rgba(255,255,255,0.15); color: var(--sv-muted, #6A665F); }

/* ── FOOTER ── */
.sv-footer {
  padding: 1.1rem 1.75rem;
  border-top: 1px solid rgba(255,255,255,0.04);
  display: flex; align-items: center; justify-content: space-between;
  margin-top: auto;
}
.sv-footer-brand {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px; letter-spacing: 0.15em; text-transform: uppercase;
  color: rgba(255,255,255,0.08); font-weight: 500;
}
.sv-footer-link { font-size: 11px; color: rgba(255,255,255,0.08); }

/* ── VAULT PAGE ── */
.sv-vault-header {
  padding: 2rem 1.75rem 1.5rem;
  border-bottom: 1px solid rgba(255,255,255,0.05);
}
.sv-vault-h1 {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(38px,7vw,64px);
  font-weight: 900; line-height: 0.88;
  text-transform: uppercase; letter-spacing: -0.01em;
  color: var(--sv-text, #F0EBE0);
}
.sv-vault-h1 em { font-style: italic; font-weight: 300; color: var(--sv-dim, #3A3835); }
.sv-vault-sub { font-size: 13px; color: var(--sv-dim, #3A3835); font-weight: 300; margin-top: 0.5rem; }

/* ── TABS ── */
.sv-tabs {
  display: flex;
  border-bottom: 1px solid rgba(255,255,255,0.05);
  background: var(--sv-navy-mid, #060F1B);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.sv-tab {
  flex: 1; min-width: 80px;
  padding: 0.9rem 0.5rem;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; font-weight: 500;
  color: var(--sv-dim, #3A3835);
  background: none; border: none;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  transition: color 0.15s, border-color 0.15s;
  white-space: nowrap; text-align: center;
}
.sv-tab.active { color: var(--sv-acid, #D2FF1E); border-bottom-color: var(--sv-acid, #D2FF1E); }
.sv-tab:hover:not(.active) { color: var(--sv-muted, #6A665F); }

/* ── PANELS ── */
.sv-panel { display: none; }
.sv-panel.active { display: block; }

/* ── DROP TAB ── */
.sv-drop-hero {
  display: grid; grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid rgba(255,255,255,0.05);
  min-height: 260px;
}
.sv-drop-hero-l { padding: 2rem 1.75rem; display: flex; flex-direction: column; justify-content: center; }
.sv-drop-hero-r {
  background: var(--sv-navy-deep, #040D1A);
  display: flex; align-items: center; justify-content: center;
  overflow: hidden; position: relative;
}
.sv-drop-img { width: 100%; height: 100%; object-fit: cover; }
.sv-drop-placeholder {
  display: flex; flex-direction: column; align-items: center; gap: 1rem; padding: 1.5rem;
}
.sv-drop-placeholder-text {
  font-size: 11px; color: rgba(255,255,255,0.1); text-align: center;
  font-family: 'Barlow Condensed', sans-serif; letter-spacing: 0.1em; text-transform: uppercase;
}

.sv-drop-badge {
  display: inline-flex; align-items: center; gap: 6px;
  border-radius: 100px; padding: 4px 10px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase;
  margin-bottom: 0.7rem; width: fit-content;
}
.sv-drop-badge.members { background: rgba(210,255,30,0.1); border: 1px solid rgba(210,255,30,0.25); color: var(--sv-acid, #D2FF1E); }
.sv-drop-badge.public  { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); color: var(--sv-muted, #6A665F); }
.sv-drop-badge.closed  { background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06); color: var(--sv-dim, #3A3835); }
.sv-badge-dot { width: 5px; height: 5px; border-radius: 50%; background: currentColor; animation: sv-pulse 2s ease-in-out infinite; }

.sv-drop-name {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(26px,5vw,46px);
  font-weight: 900; text-transform: uppercase; letter-spacing: -0.01em;
  color: var(--sv-text, #F0EBE0); line-height: 0.9; margin-bottom: 0.5rem;
}
.sv-drop-tagline { font-size: 13px; color: var(--sv-dim, #3A3835); font-weight: 300; margin-bottom: 1rem; line-height: 1.5; }

.sv-countdown { display: flex; gap: 6px; align-items: flex-end; margin-bottom: 0.5rem; }
.sv-cd-block {
  background: var(--sv-navy-mid, #060F1B);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 4px; padding: 7px 9px; text-align: center; min-width: 42px;
}
.sv-cd-num {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 22px; font-weight: 900; color: var(--sv-acid, #D2FF1E); line-height: 1; display: block;
}
.sv-cd-lbl {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 9px; letter-spacing: 0.15em; text-transform: uppercase;
  color: var(--sv-dim, #3A3835); font-weight: 500; display: block; margin-top: 2px;
}
.sv-cd-sep { font-family: 'Barlow Condensed', sans-serif; font-size: 16px; font-weight: 700; color: var(--sv-dim, #3A3835); padding-bottom: 10px; }
.sv-cd-note { font-size: 11px; color: var(--sv-dim, #3A3835); font-weight: 300; margin-bottom: 1rem; }

.sv-public-notice {
  background: var(--sv-navy-mid, #060F1B);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 6px; padding: 10px 12px; margin-bottom: 1rem;
  display: flex; align-items: center; gap: 10px;
}
.sv-public-notice strong {
  display: block; font-family: 'Barlow Condensed', sans-serif;
  font-size: 13px; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.06em; color: var(--sv-muted, #6A665F); margin-bottom: 2px;
}
.sv-public-notice div { font-size: 12px; color: var(--sv-dim, #3A3835); font-weight: 300; line-height: 1.5; }
.sv-closed-notice {
  background: var(--sv-navy-mid, #060F1B);
  border: 1px solid rgba(255,255,255,0.05);
  border-radius: 6px; padding: 10px 12px; margin-bottom: 1rem;
}
.sv-closed-notice p { font-size: 12px; color: var(--sv-dim, #3A3835); font-weight: 300; line-height: 1.5; }

/* STYLES */
.sv-styles-section { padding: 1.5rem 1.75rem; border-bottom: 1px solid rgba(255,255,255,0.05); }
.sv-styles-label {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--sv-dim, #3A3835); font-weight: 500; margin-bottom: 0.75rem;
}
.sv-style-list { display: flex; flex-direction: column; gap: 7px; margin-bottom: 1rem; }
.sv-style-row {
  display: flex; align-items: center; justify-content: space-between;
  background: var(--sv-navy-mid, #060F1B);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 6px; padding: 10px 12px;
  cursor: pointer; transition: border-color 0.15s;
}
.sv-style-row:hover  { border-color: rgba(210,255,30,0.18); }
.sv-style-row.sel    { border-color: rgba(210,255,30,0.32); }
.sv-style-row.sv-sold-out { opacity: 0.45; pointer-events: none; }
.sv-style-left  { display: flex; align-items: center; gap: 9px; }
.sv-style-right { text-align: right; }
.sv-swatch { width: 15px; height: 15px; border-radius: 50%; border: 1px solid rgba(255,255,255,0.1); flex-shrink: 0; }
.sv-style-name  {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 14px; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.06em; color: var(--sv-mid, #C8C3BA);
}
.sv-style-price { font-family: 'Barlow Condensed', sans-serif; font-size: 14px; font-weight: 700; color: var(--sv-text, #F0EBE0); }
.sv-style-stock { font-size: 10px; color: var(--sv-acid, #D2FF1E); font-weight: 300; }
.sv-style-gone  { font-size: 10px; color: var(--sv-dim, #3A3835); font-weight: 300; }
.sv-drop-ctas   { display: flex; flex-direction: column; gap: 8px; }

/* NEXT DROP */
.sv-next-drop { padding: 1.75rem; }
.sv-next-rule  { display: flex; align-items: center; margin-bottom: 1.5rem; }
.sv-rule-line  { flex: 1; height: 1px; background: rgba(255,255,255,0.05); }
.sv-rule-label {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px; letter-spacing: 0.25em; text-transform: uppercase;
  color: var(--sv-dim, #3A3835); font-weight: 500; padding: 0 1rem;
}
.sv-next-card { background: var(--sv-navy-mid, #060F1B); border: 1px solid rgba(255,255,255,0.06); border-radius: 8px; overflow: hidden; }
.sv-next-card-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1rem 1.25rem; border-bottom: 1px solid rgba(255,255,255,0.05);
}
.sv-next-drop-label {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--sv-dim, #3A3835); font-weight: 500;
}
.sv-next-drop-date {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--sv-dim, #3A3835); font-weight: 500;
}
.sv-next-card-body { display: grid; grid-template-columns: 1fr 1fr; }
.sv-next-info  { padding: 1.25rem; }
.sv-next-name  {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 22px; font-weight: 900; text-transform: uppercase;
  color: var(--sv-dim, #3A3835); line-height: 0.92; margin-bottom: 0.5rem;
}
.sv-next-teaser { font-size: 12px; color: var(--sv-dim, #3A3835); font-weight: 300; line-height: 1.6; margin-bottom: 0.75rem; }
.sv-next-locked {
  display: flex; align-items: center; gap: 6px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--sv-dim, #3A3835); font-weight: 500;
}
.sv-next-swatches { padding: 1.25rem; border-left: 1px solid rgba(255,255,255,0.05); display: flex; flex-direction: column; gap: 8px; }
.sv-next-swatches-label {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 9px; letter-spacing: 0.2em; text-transform: uppercase;
  color: rgba(255,255,255,0.08); font-weight: 500; margin-bottom: 2px;
}
.sv-next-swatch-row { display: flex; align-items: center; gap: 8px; }
.sv-preview-swatch { width: 18px; height: 18px; border-radius: 50%; border: 1px solid rgba(255,255,255,0.06); filter: blur(1px); opacity: 0.4; flex-shrink: 0; }
.sv-preview-name   { font-family: 'Barlow Condensed', sans-serif; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: rgba(255,255,255,0.06); filter: blur(2px); user-select: none; }
.sv-next-footer {
  padding: 0.9rem 1.25rem; border-top: 1px solid rgba(255,255,255,0.05);
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
}
.sv-next-vote-prompt { font-size: 12px; color: var(--sv-dim, #3A3835); font-weight: 300; }
.sv-vote-link {
  background: rgba(210,255,30,0.08);
  border: 1px solid rgba(210,255,30,0.18);
  border-radius: 3px; padding: 6px 12px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--sv-acid, #D2FF1E); transition: background 0.15s;
}
.sv-vote-link:hover { background: rgba(210,255,30,0.15); }

/* ── VOTE TAB ── */
.sv-vote-wrap    { padding: 2rem 1.75rem; }
.sv-section-header { margin-bottom: 1.5rem; }
.sv-section-h2   {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(26px,4.5vw,40px); font-weight: 900;
  text-transform: uppercase; color: var(--sv-text, #F0EBE0);
  line-height: 0.92; margin-bottom: 0.5rem;
}
.sv-section-sub  { font-size: 13px; color: var(--sv-dim, #3A3835); font-weight: 300; }
.sv-vote-card    {
  background: var(--sv-navy-mid, #060F1B);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 8px; padding: 1.25rem; margin-bottom: 1rem;
}
.sv-vote-card-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 16px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.05em; color: var(--sv-mid, #C8C3BA); margin-bottom: 0.25rem;
}
.sv-vote-card-meta { font-size: 11px; color: var(--sv-dim, #3A3835); font-weight: 300; margin-bottom: 1rem; }
.sv-vote-opts    { display: flex; flex-direction: column; gap: 7px; }
.sv-vote-opt     {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,0.06); border-radius: 6px;
  cursor: pointer; position: relative; overflow: hidden;
  transition: border-color 0.15s;
}
.sv-vote-opt:hover  { border-color: rgba(210,255,30,0.18); }
.sv-vote-opt.voted  { border-color: rgba(210,255,30,0.32); }
.sv-vote-bar        { position: absolute; left: 0; top: 0; bottom: 0; background: rgba(210,255,30,0.05); transition: width 0.5s ease; }
.sv-vote-opt-text   {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 13px; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.06em; color: var(--sv-mid, #C8C3BA); position: relative; z-index: 1;
}
.sv-vote-opt-pct    { font-family: 'Barlow Condensed', sans-serif; font-size: 12px; color: var(--sv-dim, #3A3835); position: relative; z-index: 1; }
.sv-vote-opt.voted .sv-vote-opt-pct { color: var(--sv-acid, #D2FF1E); }

/* ── ARCHIVE TAB ── */
.sv-archive-wrap  { padding: 2rem 1.75rem; }
.sv-archive-grid  { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.sv-archive-card  { background: var(--sv-navy-mid, #060F1B); border: 1px solid rgba(255,255,255,0.06); border-radius: 8px; overflow: hidden; }
.sv-archive-img   { height: 160px; background: var(--sv-navy-deep, #040D1A); display: flex; align-items: center; justify-content: center; position: relative; }
.sv-archive-img img { object-fit: cover; }
.sv-archive-badge {
  position: absolute; top: 8px; right: 8px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 9px; letter-spacing: 0.15em; text-transform: uppercase;
  background: rgba(210,255,30,0.1); border: 1px solid rgba(210,255,30,0.2);
  border-radius: 100px; padding: 3px 8px; color: var(--sv-acid, #D2FF1E); font-weight: 600;
}
.sv-archive-body   { padding: 0.85rem; }
.sv-archive-name   {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 15px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.05em; color: var(--sv-mid, #C8C3BA); margin-bottom: 2px;
}
.sv-archive-season { font-size: 11px; color: var(--sv-dim, #3A3835); font-weight: 300; margin-bottom: 0.5rem; }
.sv-archive-prices { display: flex; align-items: baseline; gap: 6px; margin-bottom: 0.5rem; }
.sv-archive-cost   { font-family: 'Barlow Condensed', sans-serif; font-size: 16px; font-weight: 700; color: var(--sv-acid, #D2FF1E); }
.sv-archive-rrp    { font-size: 11px; color: var(--sv-dim, #3A3835); text-decoration: line-through; font-weight: 300; }
.sv-archive-add    {
  display: block; text-align: center;
  background: rgba(210,255,30,0.08); border: 1px solid rgba(210,255,30,0.15);
  border-radius: 3px; padding: 8px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--sv-acid, #D2FF1E); transition: background 0.15s;
}
.sv-archive-add:hover { background: rgba(210,255,30,0.15); }
.sv-archive-gone  {
  width: 100%; background: transparent;
  border: 1px solid rgba(255,255,255,0.05); border-radius: 3px; padding: 8px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px; font-weight: 500; letter-spacing: 0.15em; text-transform: uppercase;
  color: var(--sv-dim, #3A3835); cursor: default;
}
.sv-archive-empty { font-size: 13px; color: var(--sv-dim, #3A3835); font-weight: 300; margin-top: 1.5rem; text-align: center; }

/* ── ACCOUNT TAB ── */
.sv-account-wrap { padding: 2rem 1.75rem; }
.sv-account-top  { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.75rem; padding-bottom: 1.75rem; border-bottom: 1px solid rgba(255,255,255,0.05); }
.sv-avatar       {
  width: 48px; height: 48px; border-radius: 50%;
  background: rgba(210,255,30,0.08); border: 1px solid rgba(210,255,30,0.2);
  display: flex; align-items: center; justify-content: center;
  font-family: 'Barlow Condensed', sans-serif; font-size: 16px; font-weight: 700;
  color: var(--sv-acid, #D2FF1E); flex-shrink: 0;
}
.sv-account-name {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 18px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.05em; color: var(--sv-text, #F0EBE0); margin-bottom: 2px;
}
.sv-account-since { font-size: 11px; color: var(--sv-dim, #3A3835); font-weight: 300; }
.sv-founding-badge {
  display: inline-flex; align-items: center;
  background: rgba(210,255,30,0.08); border: 1px solid rgba(210,255,30,0.18);
  border-radius: 100px; padding: 3px 10px; margin-top: 4px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--sv-acid, #D2FF1E);
}
.sv-prefs-label  {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--sv-dim, #3A3835); font-weight: 500; margin-bottom: 0.75rem;
}
.sv-pref-row     { display: flex; align-items: center; justify-content: space-between; padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,0.04); gap: 1rem; }
.sv-pref-row:last-of-type { border-bottom: none; }
.sv-pref-title   {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 13px; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.05em; color: var(--sv-muted, #6A665F);
}
.sv-pref-val     { font-size: 12px; color: var(--sv-dim, #3A3835); font-weight: 300; margin-top: 2px; }
.sv-toggle       {
  width: 34px; height: 18px; border-radius: 100px;
  background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1);
  position: relative; cursor: pointer; flex-shrink: 0; transition: background 0.2s, border-color 0.2s;
}
.sv-toggle.on    { background: rgba(210,255,30,0.2); border-color: rgba(210,255,30,0.4); }
.sv-toggle-knob  {
  width: 12px; height: 12px; border-radius: 50%; background: rgba(255,255,255,0.2);
  position: absolute; top: 2px; left: 2px; transition: left 0.15s, background 0.15s;
}
.sv-toggle.on .sv-toggle-knob { left: 18px; background: var(--sv-acid, #D2FF1E); }
.sv-account-footer { margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,0.05); }
.sv-signout-btn    {
  background: transparent; border: none;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px; letter-spacing: 0.15em; text-transform: uppercase;
  color: var(--sv-dim, #3A3835); font-weight: 500; cursor: pointer;
  transition: color 0.15s;
}
.sv-signout-btn:hover { color: var(--sv-muted, #6A665F); }

/* ── RESPONSIVE ── */
@media (max-width: 600px) {
  .sv-drop-hero        { grid-template-columns: 1fr; }
  .sv-drop-hero-r      { min-height: 200px; }
  .sv-next-card-body   { grid-template-columns: 1fr; }
  .sv-next-swatches    { border-left: none; border-top: 1px solid rgba(255,255,255,0.05); }
  .sv-archive-grid     { grid-template-columns: 1fr; }
  .sv-nav              { padding: 1rem 1.25rem; }
  .sv-vault-header     { padding: 1.5rem 1.25rem; }
  .sv-styles-section   { padding: 1.25rem; }
  .sv-vote-wrap        { padding: 1.5rem 1.25rem; }
  .sv-archive-wrap     { padding: 1.5rem 1.25rem; }
  .sv-account-wrap     { padding: 1.5rem 1.25rem; }
  .sv-next-drop        { padding: 1.25rem; }
  .sv-next-footer      { flex-direction: column; align-items: flex-start; }
}