/* ============================================
   KELIBATMU V2 - LIGHT THEME OVERRIDES
   Loaded last so dark-first page CSS remains intact.
   ============================================ */

:root[data-theme-preference="light"],
:root[data-theme-preference="light"] body {
  color-scheme: light;
  color: var(--color-text-primary);
  background: var(--theme-page-bg);
}

:root[data-theme-preference="light"] .main-content {
  background: var(--theme-page-bg);
  color: var(--color-text-primary);
}

:root[data-theme-preference="light"] .landing-premium-body {
  --bg: #f8f5ef;
  --bg-soft: #ede6dc;
  --surface: rgba(255, 255, 255, 0.82);
  --surface-strong: rgba(255, 255, 255, 0.96);
  --border: rgba(23, 19, 15, 0.12);
  --accent: #8b2c2c;
  --accent-strong: #8b2c2c;
  --text: #17130f;
  --muted: #5e554c;
  --dim: #857a70;
  --shadow: 0 18px 48px rgba(63, 45, 29, 0.13);
  --accent-crimson: #8b2c2c;
  --color-text-primary: #17130f;
  --color-text-secondary: #5e554c;
  --color-text-muted: #857a70;
  --theme-page-bg: #f8f5ef;
  --theme-page-bg-deep: #ede6dc;
  --theme-surface: #ffffff;
  --theme-surface-raised: #fffaf3;
  --theme-surface-soft: rgba(23, 19, 15, 0.045);
  --theme-border: rgba(23, 19, 15, 0.12);
  --theme-shadow: rgba(63, 45, 29, 0.12);
  --theme-input-bg: #fffaf3;
  background: var(--theme-page-bg);
  color: var(--color-text-primary);
}

:root[data-theme-preference="light"] :where(
  .cinematic-void,
  .cinematic-fog,
  .landing-loading
) {
  background:
    radial-gradient(circle at 70% 14%, rgba(139, 44, 44, 0.07), transparent 29rem),
    radial-gradient(circle at 20% 54%, rgba(47, 125, 72, 0.06), transparent 24rem),
    linear-gradient(180deg, #ffffff 0%, #f8f5ef 50%, #ede6dc 100%);
}

:root[data-theme-preference="light"] .cinematic-grain {
  opacity: 0.08;
}

:root[data-theme-preference="light"] :where(
  .landing-brand,
  .landing-nav a,
  .header-auth,
  .hero-title,
  .section-title,
  .feature-card h3,
  .collection-title,
  .cta-title,
  .landing-footer
) {
  color: var(--color-text-primary);
  text-shadow: none;
}

:root[data-theme-preference="light"] :where(
  .hero-description,
  .section-subtitle,
  .feature-card p,
  .feature-card small,
  .collection-meta,
  .cta-text,
  .footer-copy
) {
  color: var(--color-text-secondary);
}

:root[data-theme-preference="light"] .feature-card strong {
  color: var(--color-text-primary);
}

:root[data-theme-preference="light"] :where(
  .header-auth-outline,
  .btn-secondary,
  .feature-card,
  .collection-card,
  .landing-footer
) {
  background: var(--theme-surface);
  border-color: var(--theme-border);
  color: var(--color-text-primary);
  box-shadow: var(--shadow);
}

:root[data-theme-preference="light"] :where(
  .header-auth-filled,
  .btn-primary,
  .cta-button
) {
  background: var(--accent-crimson);
  border-color: var(--accent-crimson);
  color: #fffaf4;
}

:root[data-theme-preference="light"] :where(
  .btn-primary *,
  .header-auth-filled *,
  .cta-button *
) {
  color: #fffaf4;
}

:root[data-theme-preference="light"] :where(
  p,
  small,
  label,
  .section-description,
  .hero-subtitle,
  .contact-subtitle,
  .presence-title,
  .email-label,
  .social-label,
  .field-label,
  .contact-turnstile-subtext,
  .contact-turnstile-help,
  .homepage .recent-added-subtitle,
  .homepage .echo-retention-label,
  .homepage .echo-retention-note,
  .homepage .echo-retention-stats span,
  .mobile-nav-tagline,
  .mobile-profile-email,
  .card-info p,
  .related-song-info p,
  .kv2-profile-muted,
  .kv2-profile-meta
) {
  color: var(--color-text-secondary);
  opacity: 1;
}

:root[data-theme-preference="light"] :where(
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  .nav-link.active,
  .contact-turnstile-label,
  .mobile-profile-username,
  .dropdown-username,
  .kv2-auth-menu__name,
  .card-info h3,
  .song-title-link,
  .kv2-profile-shell
) {
  color: var(--color-text-primary);
}

:root[data-theme-preference="light"] :where(
  input,
  textarea,
  select,
  .form-control,
  .form-field input,
  .form-field textarea,
  .cinematic-select,
  .filter-search-label input,
  .filter-select-label select
) {
  color-scheme: light;
  background: var(--theme-input-bg);
  border-color: var(--theme-border);
  color: var(--color-text-primary);
}

:root[data-theme-preference="light"] :where(
  input::placeholder,
  textarea::placeholder,
  .form-field input::placeholder,
  .form-field textarea::placeholder,
  .kv2-search__input::placeholder
) {
  color: var(--color-text-muted);
  opacity: 1;
}

:root[data-theme-preference="light"] :where(select option, .cinematic-select option) {
  background: var(--theme-select-option-bg);
  color: var(--theme-select-option-text);
}

:root[data-theme-preference="light"] .navbar,
:root[data-theme-preference="light"] .mobile-top-bar,
:root[data-theme-preference="light"] .kv2-mbn,
:root[data-theme-preference="light"] .kv2-auth-menu__panel,
:root[data-theme-preference="light"] .auth-dropdown {
  background: color-mix(in srgb, var(--theme-surface) 94%, transparent);
  border-color: var(--theme-border);
  box-shadow: 0 14px 38px var(--theme-shadow);
}

:root[data-theme-preference="light"] .mobile-nav-overlay {
  background-color: rgba(23, 19, 15, 0.22);
}

:root[data-theme-preference="light"] .mobile-nav-container {
  background: linear-gradient(135deg, #ffffff, #f7f1e8);
  border-right-color: var(--theme-border);
  box-shadow: 8px 0 28px rgba(63, 45, 29, 0.16);
}

:root[data-theme-preference="light"] :where(
  .nav-link,
  .auth-username,
  .kv2-auth-menu__item,
  .dropdown-item,
  .kv2-mbn__label
) {
  color: var(--color-text-secondary);
}

:root[data-theme-preference="light"] :where(
  .nav-link:hover,
  .kv2-auth-menu__item:hover,
  .kv2-auth-menu__item:focus-visible,
  .dropdown-item:hover,
  .kv2-mbn__item:hover .kv2-mbn__label
) {
  color: var(--color-text-primary);
}

:root[data-theme-preference="light"] :where(
  .auth-trigger-btn,
  .mobile-user-avatar,
  .mobile-profile-action,
  .dropdown-item:hover,
  .kv2-auth-menu__item:hover,
  .kv2-auth-menu__item:focus-visible,
  .kv2-mbn__item:hover,
  .kv2-search__close
) {
  background: var(--theme-surface-soft);
  border-color: var(--theme-border);
}

@media (min-width: 769px) {
  :root[data-theme-preference="light"] .kv2-language-select--navbar select {
    background-color: transparent;
    border-color: transparent;
    box-shadow: none;
    color: var(--color-text-secondary);
  }

  :root[data-theme-preference="light"] .kv2-language-select--navbar select:hover,
  :root[data-theme-preference="light"] .kv2-language-select--navbar select:focus,
  :root[data-theme-preference="light"] .kv2-language-select--navbar select:focus-visible {
    background-color: transparent;
    border-color: transparent;
    box-shadow: none;
    color: var(--color-text-primary);
  }
}

:root[data-theme-preference="light"] .hamburger-icon span,
:root[data-theme-preference="light"] .kv2-mbn__icon,
:root[data-theme-preference="light"] .kv2-search__icon,
:root[data-theme-preference="light"] .kv2-search__close-icon {
  stroke: var(--color-text-secondary);
  background: var(--color-text-secondary);
}

:root[data-theme-preference="light"] .kv2-mbn__item:hover .kv2-mbn__icon,
:root[data-theme-preference="light"] .kv2-mbn__item--search:hover .kv2-mbn__icon,
:root[data-theme-preference="light"] .kv2-search__close:hover .kv2-search__close-icon {
  stroke: var(--color-text-primary);
}

:root[data-theme-preference="light"] .kv2-mbn__app-prompt-close {
  background: rgba(23, 19, 15, 0.08);
  color: var(--color-text-primary);
}

:root[data-theme-preference="light"] .kv2-search__backdrop {
  background: rgba(248, 245, 239, 0.97);
}

:root[data-theme-preference="light"] .kv2-search__input {
  color: var(--color-text-primary);
}

:root[data-theme-preference="light"] :where(
  .kv2-search__empty-title,
  .kv2-search__empty-text
) {
  color: var(--color-text-secondary);
}

:root[data-theme-preference="light"] .kv2-search__empty-icon {
  stroke: color-mix(in srgb, var(--color-text-secondary) 40%, transparent);
}

:root[data-theme-preference="light"] :where(
  .placeholder-card,
  .placeholder-card-small,
  .homepage .echo-retention-card,
  .contact-form-cinematic,
  .contact-turnstile-group,
  .form-placeholder,
  .kv2-settings-card,
  .kv2-profile-panel,
  .kv2-profile-card,
  .profile-card,
  .music-card,
  .song-card,
  .blog-card,
  .compact-composer,
  .global-player
) {
  background: var(--theme-surface);
  border-color: var(--theme-border);
  box-shadow: 0 14px 34px var(--theme-shadow);
  color: var(--color-text-primary);
}

:root[data-theme-preference="light"] .homepage .echo-retention-card--streak,
:root[data-theme-preference="light"] .active-track {
  background: color-mix(in srgb, var(--accent-crimson) 8%, var(--theme-surface));
  border-color: color-mix(in srgb, var(--accent-crimson) 34%, var(--theme-border));
}

:root[data-theme-preference="light"] .kv2-settings-page,
:root[data-theme-preference="light"] .contact-cinematic {
  background:
    radial-gradient(circle at 18% 0%, rgba(139, 44, 44, 0.08), transparent 34%),
    linear-gradient(180deg, var(--theme-page-bg), var(--theme-page-bg-deep));
}

:root[data-theme-preference="light"] .contact-title,
:root[data-theme-preference="light"] .homepage .recent-added-title,
:root[data-theme-preference="light"] .hero-section h1,
:root[data-theme-preference="light"] .mobile-top-logo-text,
:root[data-theme-preference="light"] .mobile-nav-brand,
:root[data-theme-preference="light"] .logo-text {
  background: none;
  -webkit-background-clip: initial;
  background-clip: initial;
  color: var(--color-text-primary);
}

:root[data-theme-preference="light"] :where(
  .email-address,
  .social-icon,
  .contact-turnstile-label,
  .submit-text,
  .submit-arrow
) {
  color: var(--color-text-primary);
}

:root[data-theme-preference="light"] .email-address:hover,
:root[data-theme-preference="light"] .social-icon:hover {
  color: var(--accent-crimson);
}

:root[data-theme-preference="light"] .social-icon,
:root[data-theme-preference="light"] .card-action-btn,
:root[data-theme-preference="light"] .artwork-overlay-btn {
  background: rgba(255, 255, 255, 0.86);
  border-color: var(--theme-border);
  color: var(--color-text-secondary);
}

:root[data-theme-preference="light"] .card-action-btn:hover,
:root[data-theme-preference="light"] .artwork-overlay-btn:hover {
  background: var(--accent-crimson);
  color: #fffaf4;
}

:root[data-theme-preference="light"] .contact-form-cinematic:hover {
  border-color: color-mix(in srgb, var(--accent-crimson) 28%, var(--theme-border));
  box-shadow: 0 20px 46px rgba(63, 45, 29, 0.14);
}

:root[data-theme-preference="light"] :where(
  .form-field input:focus,
  .form-field textarea:focus,
  .cinematic-select:focus,
  .form-control:focus
) {
  background: #ffffff;
  border-color: var(--accent-crimson);
  color: var(--color-text-primary);
  box-shadow: var(--glow-focus);
}

:root[data-theme-preference="light"] :where(
  .form-field input:hover,
  .form-field textarea:hover,
  .cinematic-select:hover
) {
  background: #ffffff;
  border-color: color-mix(in srgb, var(--accent-crimson) 24%, var(--theme-border));
}

:root[data-theme-preference="light"] .form-notification-success {
  background: rgba(46, 125, 90, 0.1);
  border-color: rgba(46, 125, 90, 0.24);
  color: #1f6a43;
}

:root[data-theme-preference="light"] :where(
  .form-notification-error,
  .form-error-summary
) {
  background: rgba(139, 44, 44, 0.08);
  border-color: rgba(139, 44, 44, 0.22);
  color: #8b2c2c;
}

:root[data-theme-preference="light"] :where(
  .field-error,
  .contact-turnstile-help-strong,
  .kv2-auth-menu__item--danger,
  .dropdown-item.logout
) {
  color: #9c2e2e;
}

:root[data-theme-preference="light"] .submit-button {
  background: var(--accent-crimson);
  color: #fffaf4;
}

:root[data-theme-preference="light"] .submit-button :where(.submit-text, .submit-arrow) {
  color: #fffaf4;
}

:root[data-theme-preference="light"] .contact-cinematic input:-webkit-autofill,
:root[data-theme-preference="light"] .contact-cinematic textarea:-webkit-autofill,
:root[data-theme-preference="light"] .contact-cinematic select:-webkit-autofill {
  -webkit-text-fill-color: var(--color-text-primary);
  -webkit-box-shadow: 0 0 0 1000px #ffffff inset;
}

:root[data-theme-preference="light"] .kv2-profile-shell {
  --kv2-profile-bg: var(--theme-page-bg-deep);
  --kv2-profile-ink: var(--color-text-primary);
  --kv2-profile-muted: var(--color-text-secondary);
  --kv2-profile-faint: var(--color-text-muted);
  --kv2-profile-line: var(--theme-border);
  --kv2-profile-surface: color-mix(in srgb, var(--theme-surface) 86%, transparent);
  --kv2-profile-surface-strong: color-mix(in srgb, var(--theme-surface-raised) 92%, transparent);
  background:
    radial-gradient(circle at 22% 8%, rgba(139, 44, 44, 0.08), transparent 34%),
    linear-gradient(180deg, var(--theme-page-bg) 0%, var(--theme-page-bg-deep) 100%);
  color: var(--color-text-primary);
}

:root[data-theme-preference="light"] :where(
  .kv2-profile-hero-card,
  .kv2-profile-stat,
  .kv2-profile-action,
  .kv2-profile-music-panel,
  .kv2-profile-status-card
) {
  background: var(--theme-surface);
  border-color: var(--theme-border);
  color: var(--color-text-primary);
  box-shadow: 0 18px 48px var(--theme-shadow);
}

:root[data-theme-preference="light"] .global-player {
  background: rgba(255, 255, 255, 0.94);
}

@media (prefers-color-scheme: light) {
  :root[data-theme-preference="system"],
  :root[data-theme-preference="system"] body {
    color-scheme: light;
    color: var(--color-text-primary);
    background: var(--theme-page-bg);
  }

  :root[data-theme-preference="system"] .main-content {
    background: var(--theme-page-bg);
    color: var(--color-text-primary);
  }

  :root[data-theme-preference="system"] .landing-premium-body {
    --bg: #f8f5ef;
    --bg-soft: #ede6dc;
    --surface: rgba(255, 255, 255, 0.82);
    --surface-strong: rgba(255, 255, 255, 0.96);
    --border: rgba(23, 19, 15, 0.12);
    --accent: #8b2c2c;
    --accent-strong: #8b2c2c;
    --text: #17130f;
    --muted: #5e554c;
    --dim: #857a70;
  --shadow: 0 18px 48px rgba(63, 45, 29, 0.13);
    --accent-crimson: #8b2c2c;
    --color-text-primary: #17130f;
    --color-text-secondary: #5e554c;
    --color-text-muted: #857a70;
    --theme-page-bg: #f8f5ef;
    --theme-page-bg-deep: #ede6dc;
    --theme-surface: #ffffff;
    --theme-surface-raised: #fffaf3;
    --theme-surface-soft: rgba(23, 19, 15, 0.045);
    --theme-border: rgba(23, 19, 15, 0.12);
    --theme-shadow: rgba(63, 45, 29, 0.12);
    --theme-input-bg: #fffaf3;
    background: var(--theme-page-bg);
    color: var(--color-text-primary);
  }

  :root[data-theme-preference="system"] :where(
    .cinematic-void,
    .cinematic-fog,
    .landing-loading
  ) {
    background:
      radial-gradient(circle at 70% 14%, rgba(139, 44, 44, 0.07), transparent 29rem),
      radial-gradient(circle at 20% 54%, rgba(47, 125, 72, 0.06), transparent 24rem),
      linear-gradient(180deg, #ffffff 0%, #f8f5ef 50%, #ede6dc 100%);
  }

  :root[data-theme-preference="system"] .cinematic-grain {
    opacity: 0.08;
  }

  :root[data-theme-preference="system"] :where(
    .landing-brand,
    .landing-nav a,
    .header-auth,
    .hero-title,
    .section-title,
    .feature-card h3,
    .collection-title,
    .cta-title,
    .landing-footer
  ) {
    color: var(--color-text-primary);
    text-shadow: none;
  }

  :root[data-theme-preference="system"] :where(
    .hero-description,
    .section-subtitle,
    .feature-card p,
    .feature-card small,
    .collection-meta,
    .cta-text,
    .footer-copy
  ) {
    color: var(--color-text-secondary);
  }

  :root[data-theme-preference="system"] .feature-card strong {
    color: var(--color-text-primary);
  }

  :root[data-theme-preference="system"] :where(
    .header-auth-outline,
    .btn-secondary,
    .feature-card,
    .collection-card,
    .landing-footer
  ) {
    background: var(--theme-surface);
    border-color: var(--theme-border);
    color: var(--color-text-primary);
    box-shadow: var(--shadow);
  }

  :root[data-theme-preference="system"] :where(
    .header-auth-filled,
    .btn-primary,
    .cta-button
  ) {
    background: var(--accent-crimson);
    border-color: var(--accent-crimson);
    color: #fffaf4;
  }

  :root[data-theme-preference="system"] :where(
    .btn-primary *,
    .header-auth-filled *,
    .cta-button *
  ) {
    color: #fffaf4;
  }

  :root[data-theme-preference="system"] :where(
    p,
    small,
    label,
    .section-description,
    .hero-subtitle,
    .contact-subtitle,
    .presence-title,
    .email-label,
    .social-label,
    .field-label,
    .contact-turnstile-subtext,
    .contact-turnstile-help,
    .homepage .recent-added-subtitle,
    .homepage .echo-retention-label,
    .homepage .echo-retention-note,
    .homepage .echo-retention-stats span,
    .mobile-nav-tagline,
    .mobile-profile-email,
    .card-info p,
    .related-song-info p,
    .kv2-profile-muted,
    .kv2-profile-meta
  ) {
    color: var(--color-text-secondary);
    opacity: 1;
  }

  :root[data-theme-preference="system"] :where(
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    .nav-link.active,
    .contact-turnstile-label,
    .mobile-profile-username,
    .dropdown-username,
    .kv2-auth-menu__name,
    .card-info h3,
    .song-title-link,
    .kv2-profile-shell
  ) {
    color: var(--color-text-primary);
  }

  :root[data-theme-preference="system"] :where(
    input,
    textarea,
    select,
    .form-control,
    .form-field input,
    .form-field textarea,
    .cinematic-select,
    .filter-search-label input,
    .filter-select-label select
  ) {
    color-scheme: light;
    background: var(--theme-input-bg);
    border-color: var(--theme-border);
    color: var(--color-text-primary);
  }

  :root[data-theme-preference="system"] :where(
    input::placeholder,
    textarea::placeholder,
    .form-field input::placeholder,
    .form-field textarea::placeholder,
    .kv2-search__input::placeholder
  ) {
    color: var(--color-text-muted);
    opacity: 1;
  }

  :root[data-theme-preference="system"] :where(select option, .cinematic-select option) {
    background: var(--theme-select-option-bg);
    color: var(--theme-select-option-text);
  }

  :root[data-theme-preference="system"] .navbar,
  :root[data-theme-preference="system"] .mobile-top-bar,
  :root[data-theme-preference="system"] .kv2-mbn,
  :root[data-theme-preference="system"] .kv2-auth-menu__panel,
  :root[data-theme-preference="system"] .auth-dropdown {
    background: color-mix(in srgb, var(--theme-surface) 94%, transparent);
    border-color: var(--theme-border);
    box-shadow: 0 14px 38px var(--theme-shadow);
  }

  :root[data-theme-preference="system"] .mobile-nav-overlay {
    background-color: rgba(23, 19, 15, 0.22);
  }

  :root[data-theme-preference="system"] .mobile-nav-container {
    background: linear-gradient(135deg, #ffffff, #f7f1e8);
    border-right-color: var(--theme-border);
    box-shadow: 8px 0 28px rgba(63, 45, 29, 0.16);
  }

  :root[data-theme-preference="system"] :where(
    .nav-link,
    .auth-username,
    .kv2-auth-menu__item,
    .dropdown-item,
    .kv2-mbn__label
  ) {
    color: var(--color-text-secondary);
  }

  :root[data-theme-preference="system"] :where(
    .nav-link:hover,
    .kv2-auth-menu__item:hover,
    .kv2-auth-menu__item:focus-visible,
    .dropdown-item:hover,
    .kv2-mbn__item:hover .kv2-mbn__label
  ) {
    color: var(--color-text-primary);
  }

  :root[data-theme-preference="system"] :where(
    .auth-trigger-btn,
    .mobile-user-avatar,
    .mobile-profile-action,
    .dropdown-item:hover,
    .kv2-auth-menu__item:hover,
    .kv2-auth-menu__item:focus-visible,
    .kv2-mbn__item:hover,
    .kv2-search__close
  ) {
    background: var(--theme-surface-soft);
    border-color: var(--theme-border);
  }

  :root[data-theme-preference="system"] .hamburger-icon span,
  :root[data-theme-preference="system"] .kv2-mbn__icon,
  :root[data-theme-preference="system"] .kv2-search__icon,
  :root[data-theme-preference="system"] .kv2-search__close-icon {
    stroke: var(--color-text-secondary);
    background: var(--color-text-secondary);
  }

  :root[data-theme-preference="system"] .kv2-mbn__item:hover .kv2-mbn__icon,
  :root[data-theme-preference="system"] .kv2-mbn__item--search:hover .kv2-mbn__icon,
  :root[data-theme-preference="system"] .kv2-search__close:hover .kv2-search__close-icon {
    stroke: var(--color-text-primary);
  }

  :root[data-theme-preference="system"] .kv2-mbn__app-prompt-close {
    background: rgba(23, 19, 15, 0.08);
    color: var(--color-text-primary);
  }

  :root[data-theme-preference="system"] .kv2-search__backdrop {
    background: rgba(248, 245, 239, 0.97);
  }

  :root[data-theme-preference="system"] .kv2-search__input {
    color: var(--color-text-primary);
  }

  :root[data-theme-preference="system"] :where(
    .kv2-search__empty-title,
    .kv2-search__empty-text
  ) {
    color: var(--color-text-secondary);
  }

  :root[data-theme-preference="system"] .kv2-search__empty-icon {
    stroke: color-mix(in srgb, var(--color-text-secondary) 40%, transparent);
  }

  :root[data-theme-preference="system"] :where(
    .placeholder-card,
    .placeholder-card-small,
    .homepage .echo-retention-card,
    .contact-form-cinematic,
    .contact-turnstile-group,
    .form-placeholder,
    .kv2-settings-card,
    .kv2-profile-panel,
    .kv2-profile-card,
    .profile-card,
    .music-card,
    .song-card,
    .blog-card,
    .compact-composer,
    .global-player
  ) {
    background: var(--theme-surface);
    border-color: var(--theme-border);
    box-shadow: 0 14px 34px var(--theme-shadow);
    color: var(--color-text-primary);
  }

  :root[data-theme-preference="system"] .homepage .echo-retention-card--streak,
  :root[data-theme-preference="system"] .active-track {
    background: color-mix(in srgb, var(--accent-crimson) 8%, var(--theme-surface));
    border-color: color-mix(in srgb, var(--accent-crimson) 34%, var(--theme-border));
  }

  :root[data-theme-preference="system"] .kv2-settings-page,
  :root[data-theme-preference="system"] .contact-cinematic {
    background:
      radial-gradient(circle at 18% 0%, rgba(139, 44, 44, 0.08), transparent 34%),
      linear-gradient(180deg, var(--theme-page-bg), var(--theme-page-bg-deep));
  }

  :root[data-theme-preference="system"] .contact-title,
  :root[data-theme-preference="system"] .homepage .recent-added-title,
  :root[data-theme-preference="system"] .hero-section h1,
  :root[data-theme-preference="system"] .mobile-top-logo-text,
  :root[data-theme-preference="system"] .mobile-nav-brand,
  :root[data-theme-preference="system"] .logo-text {
    background: none;
    -webkit-background-clip: initial;
    background-clip: initial;
    color: var(--color-text-primary);
  }

  :root[data-theme-preference="system"] :where(
    .email-address,
    .social-icon,
    .contact-turnstile-label,
    .submit-text,
    .submit-arrow
  ) {
    color: var(--color-text-primary);
  }

  :root[data-theme-preference="system"] .email-address:hover,
  :root[data-theme-preference="system"] .social-icon:hover {
    color: var(--accent-crimson);
  }

  :root[data-theme-preference="system"] .social-icon,
  :root[data-theme-preference="system"] .card-action-btn,
  :root[data-theme-preference="system"] .artwork-overlay-btn {
    background: rgba(255, 255, 255, 0.86);
    border-color: var(--theme-border);
    color: var(--color-text-secondary);
  }

  :root[data-theme-preference="system"] .card-action-btn:hover,
  :root[data-theme-preference="system"] .artwork-overlay-btn:hover {
    background: var(--accent-crimson);
    color: #fffaf4;
  }

  :root[data-theme-preference="system"] .contact-form-cinematic:hover {
    border-color: color-mix(in srgb, var(--accent-crimson) 28%, var(--theme-border));
    box-shadow: 0 20px 46px rgba(63, 45, 29, 0.14);
  }

  :root[data-theme-preference="system"] :where(
    .form-field input:focus,
    .form-field textarea:focus,
    .cinematic-select:focus,
    .form-control:focus
  ) {
    background: #ffffff;
    border-color: var(--accent-crimson);
    color: var(--color-text-primary);
    box-shadow: var(--glow-focus);
  }

  :root[data-theme-preference="system"] :where(
    .form-field input:hover,
    .form-field textarea:hover,
    .cinematic-select:hover
  ) {
    background: #ffffff;
    border-color: color-mix(in srgb, var(--accent-crimson) 24%, var(--theme-border));
  }

  :root[data-theme-preference="system"] .form-notification-success {
    background: rgba(46, 125, 90, 0.1);
    border-color: rgba(46, 125, 90, 0.24);
    color: #1f6a43;
  }

  :root[data-theme-preference="system"] :where(
    .form-notification-error,
    .form-error-summary
  ) {
    background: rgba(139, 44, 44, 0.08);
    border-color: rgba(139, 44, 44, 0.22);
    color: #8b2c2c;
  }

  :root[data-theme-preference="system"] :where(
    .field-error,
    .contact-turnstile-help-strong,
    .kv2-auth-menu__item--danger,
    .dropdown-item.logout
  ) {
    color: #9c2e2e;
  }

  :root[data-theme-preference="system"] .submit-button {
    background: var(--accent-crimson);
    color: #fffaf4;
  }

  :root[data-theme-preference="system"] .submit-button :where(.submit-text, .submit-arrow) {
    color: #fffaf4;
  }

  :root[data-theme-preference="system"] .contact-cinematic input:-webkit-autofill,
  :root[data-theme-preference="system"] .contact-cinematic textarea:-webkit-autofill,
  :root[data-theme-preference="system"] .contact-cinematic select:-webkit-autofill {
    -webkit-text-fill-color: var(--color-text-primary);
    -webkit-box-shadow: 0 0 0 1000px #ffffff inset;
  }

  :root[data-theme-preference="system"] .kv2-profile-shell {
    --kv2-profile-bg: var(--theme-page-bg-deep);
    --kv2-profile-ink: var(--color-text-primary);
    --kv2-profile-muted: var(--color-text-secondary);
    --kv2-profile-faint: var(--color-text-muted);
    --kv2-profile-line: var(--theme-border);
    --kv2-profile-surface: color-mix(in srgb, var(--theme-surface) 86%, transparent);
    --kv2-profile-surface-strong: color-mix(in srgb, var(--theme-surface-raised) 92%, transparent);
    background:
      radial-gradient(circle at 22% 8%, rgba(139, 44, 44, 0.08), transparent 34%),
      linear-gradient(180deg, var(--theme-page-bg) 0%, var(--theme-page-bg-deep) 100%);
    color: var(--color-text-primary);
  }

  :root[data-theme-preference="system"] :where(
    .kv2-profile-hero-card,
    .kv2-profile-stat,
    .kv2-profile-action,
    .kv2-profile-music-panel,
    .kv2-profile-status-card
  ) {
    background: var(--theme-surface);
    border-color: var(--theme-border);
    color: var(--color-text-primary);
    box-shadow: 0 18px 48px var(--theme-shadow);
  }

  :root[data-theme-preference="system"] .global-player {
    background: rgba(255, 255, 255, 0.94);
  }
}