:root {
  --primary: #6366f1;
  --primary-hover: #4f46e5;
  --primary-glow: rgba(99, 102, 241, 0.2);
  --bg-main: #0f172a;
  --bg-sidebar: #1e293b;
  --bg-card: #1e293b;
  --bg-input: #334155;
  --border: #334155;
  --text-main: #f8fafc;
  --text-muted: #94a3b8;
  --accent: #10b981;
  --danger: #ef4444;
  --warning: #f59e0b;
  --shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --sidebar-width: 280px;
  --top-nav-height: 70px;
  --radius: 12px;
}
[data-theme="light"] {
  --bg-main: #f1f5f9;
  --bg-sidebar: #ffffff;
  --bg-card: #ffffff;
  --bg-input: #f8fafc;
  --border: #e2e8f0;
  --text-main: #1e293b;
  --text-muted: #64748b;
  --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
}
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  font-family: "Inter", sans-serif;
  background-color: var(--bg-main);
  color: var(--text-main);
  transition:
    background-color 0.3s,
    color 0.3s;
  overflow-x: hidden;
  padding-top: env(safe-area-inset-top);
  padding-bottom: env(safe-area-inset-bottom);
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
}
#app {
  display: flex;
  min-height: 100vh;
}
.sidebar {
  width: var(--sidebar-width);
  background-color: var(--bg-sidebar);
  border-right: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  height: 100vh;
  position: fixed;
  z-index: 1000;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 10px 0 30px rgba(0, 0, 0, 0.2);
}
.sidebar-header {
  padding: 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.logo {
  display: flex;
  align-items: center;
  gap: 12px;
}
.logo-icon {
  width: 40px;
  height: 40px;
  background-color: var(--primary);
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius);
  font-size: 20px;
  box-shadow: 0 0 15px var(--primary-glow);
}
.logo-text h1 {
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -0.5px;
}
.logo-text span {
  font-size: 11px;
  color: var(--text-muted);
  font-family: "JetBrains Mono", monospace;
}
.sidebar-search {
  padding: 0 24px 16px;
}
.search-input-wrapper {
  position: relative;
  display: flex;
  align-items: center;
}
.search-input-wrapper i {
  position: absolute;
  left: 12px;
  color: var(--text-muted);
  font-size: 14px;
}
.search-input-wrapper input {
  width: 100%;
  padding: 10px 12px 10px 36px;
  background-color: var(--bg-input);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text-main);
  font-size: 14px;
  outline: none;
}
.sidebar-nav {
  flex: 1;
  overflow-y: auto;
  padding: 0 16px;
}
.nav-group-label {
  font-size: 11px;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 1px;
  padding: 24px 8px 8px;
}
.nav-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 12px;
  min-height: 44px;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.2s;
  color: var(--text-muted);
  font-size: 14px;
  font-weight: 500;
  background: none;
  border: none;
  width: 100%;
  text-align: left;
}
.nav-item:hover {
  background-color: var(--bg-input);
  color: var(--text-main);
}
.nav-item.active {
  background-color: var(--primary);
  color: white;
}
.nav-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}
.sidebar-footer {
  padding: 20px;
  border-top: 1px solid var(--border);
}
.settings-btn {
  width: 100%;
  padding: 10px;
  background: none;
  border: 1px solid var(--border);
  color: var(--text-main);
  border-radius: 8px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 14px;
  transition: background 0.2s;
}
.settings-btn:hover {
  background-color: var(--bg-input);
}
.status-indicator {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  font-size: 12px;
  color: var(--text-muted);
}
.pulse {
  width: 8px;
  height: 8px;
  background-color: var(--accent);
  border-radius: 50%;
  box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7);
  animation: pulse-green 2s infinite;
}
@keyframes pulse-green {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7);
  }
  70% {
    transform: scale(1);
    box-shadow: 0 0 0 6px rgba(16, 185, 129, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(16, 185, 129, 0);
  }
}
.main-content {
  margin-left: var(--sidebar-width);
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
.top-nav {
  height: var(--top-nav-height);
  background-color: var(--bg-sidebar);
  border-bottom: 1px solid var(--border);
  padding: 0 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: sticky;
  top: 0;
  z-index: 900;
  backdrop-filter: blur(8px);
}
.top-nav-left,
.top-nav-right {
  display: flex;
  align-items: center;
  gap: 16px;
}
.breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: var(--text-muted);
}
.breadcrumb .active-page {
  color: var(--text-main);
  font-weight: 600;
}
.theme-toggle {
  background: none;
  border: 1px solid var(--border);
  color: var(--text-main);
  width: 36px;
  height: 36px;
  border-radius: 8px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}
.theme-toggle:hover {
  background-color: var(--bg-input);
  border-color: var(--primary);
  color: var(--primary);
}
.api-key-badge {
  background-color: var(--bg-input);
  padding: 6px 12px;
  border-radius: 20px;
  font-size: 12px;
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--border);
  cursor: pointer;
  transition: all 0.2s;
  user-select: none;
  color: var(--text-main);
  font-family: inherit;
}
.api-key-badge:hover {
  border-color: var(--primary);
  background-color: var(--bg-card);
}
.api-key-badge i {
  color: var(--primary);
}
.view {
  padding: 32px;
  display: none;
  animation: fade-in 0.3s ease;
}
.view.active {
  display: block;
}
@keyframes fade-in {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.view-header {
  margin-bottom: 32px;
}
.view-header h2 {
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -1px;
}
.view-header p {
  color: var(--text-muted);
  margin-top: 4px;
}
.stat-card {
  background-color: var(--bg-card);
  padding: 16px 24px;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  display: flex;
  flex-direction: column;
}
.stat-value {
  font-size: 24px;
  font-weight: 700;
  color: var(--primary);
}
.stat-label {
  font-size: 12px;
  color: var(--text-muted);
  text-transform: uppercase;
  font-weight: 600;
}
.filter-bar {
  margin-bottom: 24px;
}
.category-tabs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.cat-tab {
  padding: 8px 16px;
  background-color: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 20px;
  color: var(--text-muted);
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}
.cat-tab:hover {
  border-color: var(--primary);
  color: var(--text-main);
}
.cat-tab.active {
  background-color: var(--primary);
  color: white;
  border-color: var(--primary);
}
.endpoints-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 20px;
}
.ep-card {
  background-color: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 20px;
  transition:
    transform 0.2s,
    box-shadow 0.2s,
    border-color 0.2s;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 16px;
  text-align: left;
  font-family: inherit;
  width: 100%;
}
.ep-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 20px -5px rgba(0, 0, 0, 0.2);
  border-color: var(--primary);
}
.ep-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.ep-icon {
  width: 40px;
  height: 40px;
  background-color: var(--bg-input);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
}
.ep-badge {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  padding: 4px 8px;
  border-radius: 4px;
}
.badge-dl {
  background: rgba(16, 185, 129, 0.1);
  color: #10b981;
}
.badge-get {
  background: rgba(59, 130, 246, 0.1);
  color: #3b82f6;
}
.badge-ai {
  background: rgba(139, 92, 246, 0.1);
  color: #8b5cf6;
}
.ep-info h4 {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 4px;
}
.ep-info code {
  font-family: "JetBrains Mono", monospace;
  font-size: 11px;
  color: var(--primary);
}
.ep-desc {
  font-size: 13px;
  color: var(--text-muted);
  line-height: 1.5;
  flex: 1;
}
.ep-card-footer {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.param-badge {
  font-size: 10px;
  background-color: var(--bg-input);
  padding: 2px 6px;
  border-radius: 4px;
  color: var(--text-muted);
}
.param-badge.required {
  color: var(--warning);
}
.dl-container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: start;
}
.dl-card {
  background-color: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: visible;
}
.dl-card-header {
  padding: 20px;
  border-bottom: 1px solid var(--border);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.dl-card-header h3 {
  font-size: 18px;
}
.dl-card-header code {
  font-family: "JetBrains Mono", monospace;
  font-size: 12px;
  color: var(--primary);
}
.dl-card-body {
  padding: 24px;
}
.form-group {
  margin-bottom: 20px;
}
.form-group label {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  margin-bottom: 8px;
}
.input-with-icon {
  position: relative;
}
.input-with-icon i {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--text-muted);
}
.input-with-icon input {
  width: 100%;
  padding: 12px 14px 12px 42px;
  background-color: var(--bg-input);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text-main);
  font-size: 16px;
}
.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
select,
textarea,
input {
  width: 100%;
  padding: 12px;
  background-color: var(--bg-input);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text-main);
  font-size: 16px;
  font-family: inherit;
}
textarea {
  resize: vertical;
}
/* ✅ Read-only & Warning styling */
textarea[readonly],
input[readonly] {
  background-color: var(--bg-card);
  opacity: 0.85;
  cursor: default;
  border-color: transparent;
}
select:focus,
textarea:focus,
input:focus {
  outline: 2px solid var(--primary);
  border-color: var(--primary);
}
.btn {
  padding: 12px 24px;
  min-height: 44px;
  border-radius: 8px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.btn-primary {
  background-color: var(--primary);
  color: white;
}
.btn-primary:hover {
  background-color: var(--primary-hover);
  box-shadow: 0 4px 14px var(--primary-glow);
  transform: translateY(-1px);
}
.btn:active {
  transform: translateY(0);
}
.btn-block {
  width: 100%;
}
.back-link {
  background: none;
  border: none;
  color: var(--primary);
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  margin-bottom: 16px;
}
.result-card {
  min-height: 300px;
  background-color: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 32px;
}
.result-card.empty {
  color: var(--text-muted);
  text-align: center;
}
.placeholder-icon {
  font-size: 64px;
  margin-bottom: 16px;
  opacity: 0.2;
}
.loader-spinner {
  width: 48px;
  height: 48px;
  border: 4px solid var(--bg-input);
  border-top-color: var(--primary);
  border-radius: 50%;
  animation: spin 1s linear infinite;
  margin-bottom: 16px;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
.result-card.data {
  justify-content: flex-start;
  align-items: stretch;
  padding: 0;
  overflow: visible;
}
.result-card-header {
  padding: 16px 20px;
  border-bottom: 1px solid var(--border);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.status-badge {
  font-size: 11px;
  font-weight: 700;
  color: var(--accent);
  background: rgba(16, 185, 129, 0.1);
  padding: 4px 10px;
  border-radius: 20px;
}
.platform-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-muted);
}
.result-card-body {
  padding: 24px;
}
.media-container {
  margin-bottom: 24px;
}
.media-container video,
.media-container img {
  width: 100%;
  border-radius: 8px;
  box-shadow: var(--shadow);
}
.media-container audio {
  width: 100%;
  margin-top: 10px;
}
.download-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background-color: var(--accent);
  color: white;
  text-decoration: none;
  padding: 10px 20px;
  border-radius: 8px;
  font-weight: 600;
  margin-top: 16px;
  margin-right: 12px;
  transition: opacity 0.2s;
}
.download-btn:hover {
  opacity: 0.9;
}
.json-viewer {
  margin-top: 24px;
  background-color: #000;
  border-radius: 8px;
  overflow: hidden;
}
.json-toggle {
  width: 100%;
  background: none;
  border: none;
  padding: 12px 16px;
  color: #fff;
  font-size: 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  font-family: "JetBrains Mono", monospace;
}
pre#jsonPre {
  padding: 0 16px;
  max-height: 0;
  overflow: hidden;
  transition: all 0.3s ease;
  font-size: 12px;
  color: #10b981;
  font-family: "JetBrains Mono", monospace;
  white-space: pre-wrap;
  word-break: break-all;
}
pre#jsonPre.open {
  padding: 16px;
  max-height: 400px;
  overflow-y: auto;
}
.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.7);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 2000;
  backdrop-filter: blur(4px);
}
.modal {
  background-color: var(--bg-card);
  width: 90%;
  max-width: 450px;
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
  animation: modal-pop 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes modal-pop {
  from {
    transform: scale(0.9);
    opacity: 0;
  }
  to {
    transform: scale(1);
    opacity: 1;
  }
}
.modal-header {
  padding: 20px;
  border-bottom: 1px solid var(--border);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.modal-close {
  background: none;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  font-size: 18px;
}
.modal-body {
  padding: 24px;
}
.input-with-action {
  display: flex;
  gap: 12px;
}
.input-with-action input {
  flex: 1;
  padding: 10px 12px;
  background-color: var(--bg-input);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text-main);
}
.help-text {
  font-size: 12px;
  color: var(--text-muted);
  margin-top: 8px;
}
.history-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 800px;
  margin: 0 auto;
}
.history-item {
  background-color: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 16px 20px;
  display: flex;
  align-items: center;
  gap: 20px;
  transition: transform 0.2s;
}
.history-item:hover {
  transform: translateX(4px);
  border-color: var(--primary);
}
.history-icon {
  width: 44px;
  height: 44px;
  background-color: var(--bg-input);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: var(--primary);
}
.history-info {
  flex: 1;
  min-width: 0;
}
.history-path {
  font-family: "JetBrains Mono", monospace;
  font-size: 13px;
  font-weight: 600;
  color: var(--primary);
}
.history-url {
  font-size: 14px;
  color: var(--text-main);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin: 2px 0;
}
.history-date {
  font-size: 11px;
  color: var(--text-muted);
}
.mobile-toggle,
.mobile-close {
  display: none;
  background: none;
  border: none;
  color: var(--text-main);
  font-size: 20px;
  cursor: pointer;
}
.main-footer {
  margin-top: auto;
  padding: 32px;
  border-top: 1px solid var(--border);
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--text-muted);
  font-size: 14px;
}
.footer-right {
  display: flex;
  gap: 20px;
}
.footer-right a {
  color: var(--text-muted);
  font-size: 18px;
  transition: color 0.2s;
}
.footer-right a:hover {
  color: var(--primary);
}
@media (max-width: 1200px) {
  .sidebar {
    width: 240px;
  }
  .main-content {
    margin-left: 240px;
  }
}
@media (max-width: 1024px) {
  .dl-container {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .sidebar {
    width: 220px;
  }
  .main-content {
    margin-left: 220px;
  }
}
@media (max-width: 991px) {
  .sidebar {
    transform: translateX(-100%);
    width: 280px;
  }
  .sidebar.open {
    transform: translateX(0);
  }
  .main-content {
    margin-left: 0;
  }
  .mobile-toggle {
    display: block;
  }
  .mobile-close {
    display: block;
  }
  .top-nav {
    padding: 0 16px;
  }
  .breadcrumb {
    display: none;
  }
  .main-footer {
    flex-direction: column;
    gap: 16px;
    text-align: center;
  }
}
@media (max-width: 768px) {
  .sidebar.open {
    transform: translateX(0);
  }
  .view {
    padding: 20px;
  }
  .endpoints-grid {
    grid-template-columns: 1fr;
  }
  .form-row {
    grid-template-columns: 1fr;
  }
  .view-header h2 {
    font-size: 24px;
  }
}
@media (max-width: 480px) {
  .top-nav-right {
    gap: 8px;
  }
  .api-key-badge span {
    display: none;
  }
  .api-key-badge {
    padding: 8px;
    border-radius: 50%;
  }
  .logo-text h1 {
    font-size: 16px;
  }
}
:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}
.nav-item:focus-visible,
.ep-card:focus-visible,
.api-key-badge:focus-visible,
.btn:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: -2px;
}
#toastContainer {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 3000;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.toast {
  padding: 12px 20px;
  border-radius: 8px;
  background-color: var(--bg-card);
  border: 1px solid var(--border);
  color: var(--text-main);
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 250px;
  animation: toast-in 0.3s ease;
}
.toast-success i {
  color: var(--accent);
}
.toast-danger i {
  color: var(--danger);
}
.toast-warning i {
  color: var(--warning);
}
@keyframes toast-in {
  from {
    transform: translateX(100%);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}
.toast.fade-out {
  opacity: 0;
  transform: translateY(10px);
  transition: all 0.5s ease;
}
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-track {
  background: var(--bg-main);
}
::-webkit-scrollbar-thumb {
  background: var(--border);
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--text-muted);
}

/* ══════════════════════════════════════════════════════════════
   PRO THEMES — 20 UNIQUE THEMES
   Each theme has DARK variant as :root default
   and LIGHT variant as [data-theme="<name>-light"]
   Active via: document.documentElement.setAttribute("data-theme", themeName)
   ══════════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────────
   1. SOFT PASTEL DREAM 🌸
   Dreamy cotton-candy pinks and lilac tones
───────────────────────────────────────────── */
[data-theme="pastel-dream-dark"] {
  --primary: #d48bce;
  --primary-hover: #c070b8;
  --primary-glow: rgba(212, 139, 206, 0.25);
  --bg-main: #1a0f1e;
  --bg-sidebar: #251530;
  --bg-card: #2e1a3a;
  --bg-input: #3a2248;
  --border: #4a2d5a;
  --text-main: #f7e6f9;
  --text-muted: #c9a8d4;
  --accent: #f9a8d4;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 20px rgba(212, 139, 206, 0.15);
}
[data-theme="pastel-dream-light"] {
  --primary: #c084c0;
  --primary-hover: #a855a8;
  --primary-glow: rgba(192, 132, 192, 0.2);
  --bg-main: #fdf4ff;
  --bg-sidebar: #fff0fc;
  --bg-card: #ffffff;
  --bg-input: #fce7f9;
  --border: #f0c5ef;
  --text-main: #3b1040;
  --text-muted: #9d6fa8;
  --accent: #e879b0;
  --danger: #e53e3e;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(192, 132, 192, 0.15);
}

/* ─────────────────────────────────────────────
   2. AURORA BOREALIS 🌌
   Deep cosmic greens and teals dancing in the dark
───────────────────────────────────────────── */
[data-theme="aurora-dark"] {
  --primary: #34d399;
  --primary-hover: #10b981;
  --primary-glow: rgba(52, 211, 153, 0.25);
  --bg-main: #020c12;
  --bg-sidebar: #071a26;
  --bg-card: #0d2535;
  --bg-input: #123040;
  --border: #1a4560;
  --text-main: #e0faf3;
  --text-muted: #7ecfb8;
  --accent: #818cf8;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 20px rgba(52, 211, 153, 0.12);
}
[data-theme="aurora-light"] {
  --primary: #059669;
  --primary-hover: #047857;
  --primary-glow: rgba(5, 150, 105, 0.2);
  --bg-main: #f0fdf8;
  --bg-sidebar: #ffffff;
  --bg-card: #ffffff;
  --bg-input: #d1fae5;
  --border: #a7f3d0;
  --text-main: #064e3b;
  --text-muted: #047857;
  --accent: #6366f1;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(5, 150, 105, 0.12);
}

/* ─────────────────────────────────────────────
   3. PEACH CREAM 🍑
   Warm peachy blushes and creamy whites
───────────────────────────────────────────── */
[data-theme="peach-cream-dark"] {
  --primary: #fb923c;
  --primary-hover: #f97316;
  --primary-glow: rgba(251, 146, 60, 0.22);
  --bg-main: #120600;
  --bg-sidebar: #1e1000;
  --bg-card: #2a1800;
  --bg-input: #362000;
  --border: #543200;
  --text-main: #fff7ed;
  --text-muted: #fed7aa;
  --accent: #fdba74;
  --danger: #ef4444;
  --warning: #d97706;
  --shadow: 0 4px 24px rgba(251, 146, 60, 0.2);
}
[data-theme="peach-cream-light"] {
  --primary: #ea580c;
  --primary-hover: #c2410c;
  --primary-glow: rgba(234, 88, 12, 0.18);
  --bg-main: #fff7ed;
  --bg-sidebar: #ffedd5;
  --bg-card: #ffffff;
  --bg-input: #fed7aa;
  --border: #fdba74;
  --text-main: #431407;
  --text-muted: #c2410c;
  --accent: #f97316;
  --danger: #dc2626;
  --warning: #b45309;
  --shadow: 0 2px 12px rgba(234, 88, 12, 0.12);
}

/* ─────────────────────────────────────────────
   4. LAVENDER HAZE 💜
   Misty purples and soft violet fog
───────────────────────────────────────────── */
[data-theme="lavender-haze-dark"] {
  --primary: #a78bfa;
  --primary-hover: #8b5cf6;
  --primary-glow: rgba(167, 139, 250, 0.25);
  --bg-main: #0e0a1f;
  --bg-sidebar: #160e2e;
  --bg-card: #1e1640;
  --bg-input: #271d50;
  --border: #382a6b;
  --text-main: #ede9fe;
  --text-muted: #c4b5fd;
  --accent: #f472b6;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 20px rgba(139, 92, 246, 0.2);
}
[data-theme="lavender-haze-light"] {
  --primary: #7c3aed;
  --primary-hover: #6d28d9;
  --primary-glow: rgba(124, 58, 237, 0.18);
  --bg-main: #f5f3ff;
  --bg-sidebar: #faf5ff;
  --bg-card: #ffffff;
  --bg-input: #ede9fe;
  --border: #ddd6fe;
  --text-main: #2e1065;
  --text-muted: #6d28d9;
  --accent: #db2777;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(124, 58, 237, 0.12);
}

/* ─────────────────────────────────────────────
   5. MINT BREEZE 🌿
   Fresh cool greens like a garden morning
───────────────────────────────────────────── */
[data-theme="mint-breeze-dark"] {
  --primary: #6ee7b7;
  --primary-hover: #34d399;
  --primary-glow: rgba(110, 231, 183, 0.2);
  --bg-main: #071410;
  --bg-sidebar: #0d2018;
  --bg-card: #102b20;
  --bg-input: #15382a;
  --border: #1e5040;
  --text-main: #ecfdf5;
  --text-muted: #86efac;
  --accent: #38bdf8;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 20px rgba(52, 211, 153, 0.12);
}
[data-theme="mint-breeze-light"] {
  --primary: #059669;
  --primary-hover: #047857;
  --primary-glow: rgba(5, 150, 105, 0.18);
  --bg-main: #f0fdf4;
  --bg-sidebar: #f7fffe;
  --bg-card: #ffffff;
  --bg-input: #dcfce7;
  --border: #bbf7d0;
  --text-main: #14532d;
  --text-muted: #166534;
  --accent: #0284c7;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(5, 150, 105, 0.1);
}

/* ─────────────────────────────────────────────
   6. SUNSET GLOW 🌅
   Warm amber, crimson and horizon oranges
───────────────────────────────────────────── */
[data-theme="sunset-glow-dark"] {
  --primary: #e879f9;
  --primary-hover: #d946ef;
  --primary-glow: rgba(232, 121, 249, 0.25);
  --bg-main: #0e0214;
  --bg-sidebar: #1a0620;
  --bg-card: #260a2e;
  --bg-input: #320e3a;
  --border: #541c5e;
  --text-main: #fdf4ff;
  --text-muted: #f0abfc;
  --accent: #c026d3;
  --danger: #ef4444;
  --warning: #f59e0b;
  --shadow: 0 4px 24px rgba(232, 121, 249, 0.25);
}
[data-theme="sunset-glow-light"] {
  --primary: #a21caf;
  --primary-hover: #86198f;
  --primary-glow: rgba(162, 28, 175, 0.18);
  --bg-main: #fdf4ff;
  --bg-sidebar: #fae8ff;
  --bg-card: #ffffff;
  --bg-input: #f5d0fe;
  --border: #e879f9;
  --text-main: #4a044e;
  --text-muted: #86198f;
  --accent: #c026d3;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(162, 28, 175, 0.12);
}

/* ─────────────────────────────────────────────
   7. OCEAN DEPTHS 🌊
   Deep navy blues and teal oceanic tones
───────────────────────────────────────────── */
[data-theme="ocean-depths-dark"] {
  --primary: #38bdf8;
  --primary-hover: #0ea5e9;
  --primary-glow: rgba(56, 189, 248, 0.2);
  --bg-main: #020818;
  --bg-sidebar: #061228;
  --bg-card: #0c1e3e;
  --bg-input: #102550;
  --border: #1a3a70;
  --text-main: #e0f2fe;
  --text-muted: #7dd3fc;
  --accent: #34d399;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 20px rgba(14, 165, 233, 0.15);
}
[data-theme="ocean-depths-light"] {
  --primary: #0284c7;
  --primary-hover: #0369a1;
  --primary-glow: rgba(2, 132, 199, 0.18);
  --bg-main: #f0f9ff;
  --bg-sidebar: #e0f2fe;
  --bg-card: #ffffff;
  --bg-input: #bae6fd;
  --border: #7dd3fc;
  --text-main: #0c2a50;
  --text-muted: #0369a1;
  --accent: #059669;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(2, 132, 199, 0.1);
}

/* ─────────────────────────────────────────────
   8. FOREST MIST 🌲
   Earthy greens and foggy woodland browns
───────────────────────────────────────────── */
[data-theme="forest-mist-dark"] {
  --primary: #16a34a;
  --primary-hover: #15803d;
  --primary-glow: rgba(22, 163, 74, 0.22);
  --bg-main: #020e06;
  --bg-sidebar: #041a0c;
  --bg-card: #062612;
  --bg-input: #083218;
  --border: #0e5024;
  --text-main: #f0fdf4;
  --text-muted: #86efac;
  --accent: #4ade80;
  --danger: #ef4444;
  --warning: #f59e0b;
  --shadow: 0 4px 24px rgba(22, 163, 74, 0.2);
}
[data-theme="forest-mist-light"] {
  --primary: #15803d;
  --primary-hover: #166534;
  --primary-glow: rgba(21, 128, 61, 0.18);
  --bg-main: #f0fdf4;
  --bg-sidebar: #dcfce7;
  --bg-card: #ffffff;
  --bg-input: #bbf7d0;
  --border: #86efac;
  --text-main: #052e16;
  --text-muted: #166534;
  --accent: #22c55e;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(21, 128, 61, 0.12);
}

/* ─────────────────────────────────────────────
   9. ROSE QUARTZ 🌹
   Elegant warm rose and blush pinks
───────────────────────────────────────────── */
[data-theme="rose-quartz-dark"] {
  --primary: #fb7185;
  --primary-hover: #f43f5e;
  --primary-glow: rgba(251, 113, 133, 0.25);
  --bg-main: #160810;
  --bg-sidebar: #240e1c;
  --bg-card: #301428;
  --bg-input: #3e1a34;
  --border: #5c2848;
  --text-main: #fff1f2;
  --text-muted: #fda4af;
  --accent: #f9a8d4;
  --danger: #ef4444;
  --warning: #fbbf24;
  --shadow: 0 4px 20px rgba(244, 63, 94, 0.15);
}
[data-theme="rose-quartz-light"] {
  --primary: #e11d48;
  --primary-hover: #be123c;
  --primary-glow: rgba(225, 29, 72, 0.18);
  --bg-main: #fff1f2;
  --bg-sidebar: #ffe4e6;
  --bg-card: #ffffff;
  --bg-input: #fecdd3;
  --border: #fda4af;
  --text-main: #4c0519;
  --text-muted: #9f1239;
  --accent: #db2777;
  --danger: #b91c1c;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(225, 29, 72, 0.1);
}

/* ─────────────────────────────────────────────
   10. HONEY DRIZZLE 🍯
   Rich amber gold and warm amber shades
───────────────────────────────────────────── */
[data-theme="honey-drizzle-dark"] {
  --primary: #d97706;
  --primary-hover: #b45309;
  --primary-glow: rgba(217, 119, 6, 0.25);
  --bg-main: #0e0600;
  --bg-sidebar: #1c0e00;
  --bg-card: #281600;
  --bg-input: #341e00;
  --border: #523200;
  --text-main: #fffbeb;
  --text-muted: #fde68a;
  --accent: #fbbf24;
  --danger: #ef4444;
  --warning: #b45309;
  --shadow: 0 4px 24px rgba(217, 119, 6, 0.22);
}
[data-theme="honey-drizzle-light"] {
  --primary: #b45309;
  --primary-hover: #92400e;
  --primary-glow: rgba(180, 83, 9, 0.18);
  --bg-main: #fffbeb;
  --bg-sidebar: #fef3c7;
  --bg-card: #ffffff;
  --bg-input: #fde68a;
  --border: #fcd34d;
  --text-main: #3a1e00;
  --text-muted: #92400e;
  --accent: #d97706;
  --danger: #dc2626;
  --warning: #78350f;
  --shadow: 0 2px 12px rgba(180, 83, 9, 0.12);
}

/* ─────────────────────────────────────────────
   11. MOONLIT SILVER 🌙
   Cold grey silvers and icy moonlight blues
───────────────────────────────────────────── */
[data-theme="moonlit-silver-dark"] {
  --primary: #cbd5e1;
  --primary-hover: #94a3b8;
  --primary-glow: rgba(203, 213, 225, 0.2);
  --bg-main: #060810;
  --bg-sidebar: #0c1020;
  --bg-card: #121828;
  --bg-input: #1a2235;
  --border: #2a3550;
  --text-main: #f1f5f9;
  --text-muted: #94a3b8;
  --accent: #818cf8;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 20px rgba(148, 163, 184, 0.12);
}
[data-theme="moonlit-silver-light"] {
  --primary: #475569;
  --primary-hover: #334155;
  --primary-glow: rgba(71, 85, 105, 0.18);
  --bg-main: #f8fafc;
  --bg-sidebar: #f1f5f9;
  --bg-card: #ffffff;
  --bg-input: #e2e8f0;
  --border: #cbd5e1;
  --text-main: #0f172a;
  --text-muted: #475569;
  --accent: #6366f1;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(71, 85, 105, 0.1);
}

/* ─────────────────────────────────────────────
   12. CORAL REEF 🐠
   Vivid coral oranges and tropical aquas
───────────────────────────────────────────── */
[data-theme="coral-reef-dark"] {
  --primary: #f97171;
  --primary-hover: #ef4444;
  --primary-glow: rgba(249, 113, 113, 0.25);
  --bg-main: #130808;
  --bg-sidebar: #1f1010;
  --bg-card: #2b1818;
  --bg-input: #372020;
  --border: #573030;
  --text-main: #fff5f5;
  --text-muted: #2dd4bf;
  --accent: #2dd4bf;
  --danger: #ef4444;
  --warning: #f59e0b;
  --shadow: 0 4px 24px rgba(249, 113, 113, 0.22);
}
[data-theme="coral-reef-light"] {
  --primary: #dc2626;
  --primary-hover: #b91c1c;
  --primary-glow: rgba(220, 38, 38, 0.18);
  --bg-main: #fff5f5;
  --bg-sidebar: #fee2e2;
  --bg-card: #ffffff;
  --bg-input: #fecaca;
  --border: #2dd4bf;
  --text-main: #450a0a;
  --text-muted: #0d9488;
  --accent: #0d9488;
  --danger: #b91c1c;
  --warning: #b45309;
  --shadow: 0 2px 12px rgba(220, 38, 38, 0.12);
}

/* ─────────────────────────────────────────────
   13. BUTTERCUP FIELD 🌼
   Sunny yellows and meadow greens
───────────────────────────────────────────── */
[data-theme="buttercup-field-dark"] {
  --primary: #facc15;
  --primary-hover: #eab308;
  --primary-glow: rgba(250, 204, 21, 0.25);
  --bg-main: #0f0d00;
  --bg-sidebar: #1c1800;
  --bg-card: #282400;
  --bg-input: #343000;
  --border: #524c00;
  --text-main: #fefce8;
  --text-muted: #fde047;
  --accent: #86efac;
  --danger: #f87171;
  --warning: #f59e0b;
  --shadow: 0 4px 20px rgba(234, 179, 8, 0.15);
}
[data-theme="buttercup-field-light"] {
  --primary: #a16207;
  --primary-hover: #854d0e;
  --primary-glow: rgba(161, 98, 7, 0.18);
  --bg-main: #fefce8;
  --bg-sidebar: #fef9c3;
  --bg-card: #ffffff;
  --bg-input: #fef08a;
  --border: #fde047;
  --text-main: #422006;
  --text-muted: #854d0e;
  --accent: #166534;
  --danger: #dc2626;
  --warning: #92400e;
  --shadow: 0 2px 12px rgba(161, 98, 7, 0.1);
}

/* ─────────────────────────────────────────────
   14. ICY BLUE ❄️
   Crisp arctic blues and crystal whites
───────────────────────────────────────────── */
[data-theme="icy-blue-dark"] {
  --primary: #7dd3fc;
  --primary-hover: #38bdf8;
  --primary-glow: rgba(125, 211, 252, 0.2);
  --bg-main: #040e18;
  --bg-sidebar: #081828;
  --bg-card: #0e2438;
  --bg-input: #142e48;
  --border: #1e4568;
  --text-main: #e0f7ff;
  --text-muted: #93c5fd;
  --accent: #e879f9;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 20px rgba(56, 189, 248, 0.12);
}
[data-theme="icy-blue-light"] {
  --primary: #0369a1;
  --primary-hover: #075985;
  --primary-glow: rgba(3, 105, 161, 0.18);
  --bg-main: #f0f9ff;
  --bg-sidebar: #e0f7ff;
  --bg-card: #ffffff;
  --bg-input: #bae6fd;
  --border: #7dd3fc;
  --text-main: #082044;
  --text-muted: #0369a1;
  --accent: #9333ea;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(3, 105, 161, 0.1);
}

/* ─────────────────────────────────────────────
   15. VELVET VIOLET 🟣
   Deep royal purples and rich velvet tones
───────────────────────────────────────────── */
[data-theme="velvet-violet-dark"] {
  --primary: #c084fc;
  --primary-hover: #a855f7;
  --primary-glow: rgba(192, 132, 252, 0.25);
  --bg-main: #0c0514;
  --bg-sidebar: #140a22;
  --bg-card: #1c1030;
  --bg-input: #25163e;
  --border: #38226a;
  --text-main: #faf5ff;
  --text-muted: #d8b4fe;
  --accent: #f472b6;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 20px rgba(168, 85, 247, 0.2);
}
[data-theme="velvet-violet-light"] {
  --primary: #7e22ce;
  --primary-hover: #6b21a8;
  --primary-glow: rgba(126, 34, 206, 0.18);
  --bg-main: #fdf4ff;
  --bg-sidebar: #f3e8ff;
  --bg-card: #ffffff;
  --bg-input: #e9d5ff;
  --border: #d8b4fe;
  --text-main: #2e0a4e;
  --text-muted: #7e22ce;
  --accent: #be185d;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(126, 34, 206, 0.12);
}

/* ══════════════════════════════════════════════════════════════
   EXTRA THEMES
   ══════════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────────
   16. CHERRY BLOSSOM 🌺
   Delicate Japanese sakura pinks and ivory whites
   Inspired by spring hanami season
───────────────────────────────────────────── */
[data-theme="cherry-blossom-dark"] {
  --primary: #f9a8c9;
  --primary-hover: #f472b6;
  --primary-glow: rgba(249, 168, 201, 0.22);
  --bg-main: #0e0218;
  --bg-sidebar: #1a0624;
  --bg-card: #260a32;
  --bg-input: #320e3e;
  --border: #541a5e;
  --text-main: #fdf4ff;
  --text-muted: #a5b4fc;
  --accent: #a5b4fc;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(249, 168, 201, 0.2);
}
[data-theme="cherry-blossom-light"] {
  --primary: #9333ea;
  --primary-hover: #7e22ce;
  --primary-glow: rgba(147, 51, 234, 0.18);
  --bg-main: #fdf4ff;
  --bg-sidebar: #fae8ff;
  --bg-card: #ffffff;
  --bg-input: #f3e8ff;
  --border: #e9d5ff;
  --text-main: #3b0764;
  --text-muted: #7e22ce;
  --accent: #9333ea;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(147, 51, 234, 0.12);
}

/* ─────────────────────────────────────────────
   17. NORDIC FROST ❄️🏔️
   Scandinavian-inspired cool greys and pale blues
   Clean, minimal, ultra-modern aesthetic
───────────────────────────────────────────── */
[data-theme="nordic-frost-dark"] {
  --primary: #93c5fd;
  --primary-hover: #60a5fa;
  --primary-glow: rgba(147, 197, 253, 0.18);
  --bg-main: #090c12;
  --bg-sidebar: #10151f;
  --bg-card: #161d2e;
  --bg-input: #1e2840;
  --border: #2c3e60;
  --text-main: #e8edf5;
  --text-muted: #8ba8cc;
  --accent: #67e8f9;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 20px rgba(96, 165, 250, 0.1);
}
[data-theme="nordic-frost-light"] {
  --primary: #2563eb;
  --primary-hover: #1d4ed8;
  --primary-glow: rgba(37, 99, 235, 0.15);
  --bg-main: #f0f4fa;
  --bg-sidebar: #e8eef8;
  --bg-card: #ffffff;
  --bg-input: #dbe4f0;
  --border: #bfcfe8;
  --text-main: #0d1b35;
  --text-muted: #3b5a8a;
  --accent: #0891b2;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(37, 99, 235, 0.08);
}

/* ─────────────────────────────────────────────
   18. MATCHA GREEN 🍵
   Earthy Japanese matcha and warm bamboo tones
   Calm, grounded, zen-like aesthetic
───────────────────────────────────────────── */
[data-theme="matcha-green-dark"] {
  --primary: #86efac;
  --primary-hover: #4ade80;
  --primary-glow: rgba(134, 239, 172, 0.18);
  --bg-main: #050e08;
  --bg-sidebar: #0a1810;
  --bg-card: #102018;
  --bg-input: #162a1e;
  --border: #224030;
  --text-main: #f0fdf4;
  --text-muted: #86efac;
  --accent: #d4a574;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 20px rgba(74, 222, 128, 0.1);
}
[data-theme="matcha-green-light"] {
  --primary: #16a34a;
  --primary-hover: #15803d;
  --primary-glow: rgba(22, 163, 74, 0.15);
  --bg-main: #f0fdf4;
  --bg-sidebar: #dcfce7;
  --bg-card: #ffffff;
  --bg-input: #bbf7d0;
  --border: #86efac;
  --text-main: #052e16;
  --text-muted: #166534;
  --accent: #92400e;
  --danger: #dc2626;
  --warning: #b45309;
  --shadow: 0 2px 12px rgba(22, 163, 74, 0.08);
}
/* ─────────────────────────────────────────────
   19. TWILIGHT EMBER 🌆
   Deep dusk oranges fading into midnight purple
   Urban sunset aesthetic — warm yet mysterious
───────────────────────────────────────────── */
[data-theme="twilight-ember-dark"] {
  --primary: #e879f9;
  --primary-hover: #d946ef;
  --primary-glow: rgba(232, 121, 249, 0.28);
  --bg-main: #0e0214;
  --bg-sidebar: #1a0622;
  --bg-card: #260a30;
  --bg-input: #320e3e;
  --border: #541860;
  --text-main: #fdf4ff;
  --text-muted: #f472b6;
  --accent: #f472b6;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(232, 121, 249, 0.28);
}
[data-theme="twilight-ember-light"] {
  --primary: #c026d3;
  --primary-hover: #a21caf;
  --primary-glow: rgba(192, 38, 211, 0.18);
  --bg-main: #fdf4ff;
  --bg-sidebar: #fae8ff;
  --bg-card: #ffffff;
  --bg-input: #f5d0fe;
  --border: #e879f9;
  --text-main: #4a044e;
  --text-muted: #be185d;
  --accent: #db2777;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(192, 38, 211, 0.12);
}

/* ─────────────────────────────────────────────
   20. DEEP SPACE 🚀
   Pure cosmic black with electric cyan accents
   Hacker/terminal inspired — ultra dark, sharp
───────────────────────────────────────────── */
[data-theme="deep-space-dark"] {
  --primary: #22d3ee;
  --primary-hover: #06b6d4;
  --primary-glow: rgba(34, 211, 238, 0.2);
  --bg-main: #000000;
  --bg-sidebar: #070a10;
  --bg-card: #0d1117;
  --bg-input: #161b22;
  --border: #21262d;
  --text-main: #e6edf3;
  --text-muted: #8b949e;
  --accent: #7ee787;
  --danger: #f85149;
  --warning: #d29922;
  --shadow: 0 4px 20px rgba(34, 211, 238, 0.12);
}
[data-theme="deep-space-light"] {
  --primary: #0891b2;
  --primary-hover: #0e7490;
  --primary-glow: rgba(8, 145, 178, 0.18);
  --bg-main: #f0f9fc;
  --bg-sidebar: #e0f4f8;
  --bg-card: #ffffff;
  --bg-input: #cceeff;
  --border: #a5d8e8;
  --text-main: #012a38;
  --text-muted: #0e7490;
  --accent: #166534;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(8, 145, 178, 0.1);
}

/* ══════════════════════════════════════════════════════════════
   PREMIUM THEMES — 5 New Additions
   ══════════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────────
   P1. BLACK ROSE 🖤🌹
   Luxurious deep black with crimson rose accents
   Gothic elegance — dark and sensual
───────────────────────────────────────────── */
[data-theme="black-rose-dark"] {
  --primary: #e11d48;
  --primary-hover: #be123c;
  --primary-glow: rgba(225, 29, 72, 0.28);
  --bg-main: #030305;
  --bg-sidebar: #0c0508;
  --bg-card: #140810;
  --bg-input: #1c0c18;
  --border: #3a1228;
  --text-main: #fff0f3;
  --text-muted: #fda4af;
  --accent: #f9a8d4;
  --danger: #f43f5e;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(225, 29, 72, 0.2);
}
[data-theme="black-rose-light"] {
  --primary: #9f1239;
  --primary-hover: #881337;
  --primary-glow: rgba(159, 18, 57, 0.18);
  --bg-main: #fff1f2;
  --bg-sidebar: #ffe4e6;
  --bg-card: #ffffff;
  --bg-input: #fecdd3;
  --border: #fda4af;
  --text-main: #3b0010;
  --text-muted: #9f1239;
  --accent: #be185d;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(159, 18, 57, 0.12);
}

/* ─────────────────────────────────────────────
   P2. ROSE GOLD ✨
   Glamorous rose gold luxury — warm blush + gold
   Premium metallic feminine aesthetic
───────────────────────────────────────────── */
[data-theme="rose-gold-dark"] {
  --primary: #f0a090;
  --primary-hover: #e8806a;
  --primary-glow: rgba(240, 160, 144, 0.25);
  --bg-main: #120a08;
  --bg-sidebar: #1e1008;
  --bg-card: #2a1810;
  --bg-input: #341e14;
  --border: #5a3020;
  --text-main: #fff5f0;
  --text-muted: #f4b8a8;
  --accent: #fcd34d;
  --danger: #ef4444;
  --warning: #f59e0b;
  --shadow: 0 4px 24px rgba(240, 160, 144, 0.18);
}
[data-theme="rose-gold-light"] {
  --primary: #c87060;
  --primary-hover: #b05040;
  --primary-glow: rgba(200, 112, 96, 0.18);
  --bg-main: #fff5f2;
  --bg-sidebar: #fde8e0;
  --bg-card: #ffffff;
  --bg-input: #fcd5c8;
  --border: #f9b8a8;
  --text-main: #3b0a00;
  --text-muted: #a04030;
  --accent: #b45309;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(200, 112, 96, 0.12);
}

/* ─────────────────────────────────────────────
   P3. MYSTIC PLUM 🔮
   Deep mystical purples with gold shimmer
   Magical premium — crystal ball vibes
───────────────────────────────────────────── */
[data-theme="mystic-plum-dark"] {
  --primary: #d8b4fe;
  --primary-hover: #c084fc;
  --primary-glow: rgba(216, 180, 254, 0.22);
  --bg-main: #08040e;
  --bg-sidebar: #120a1c;
  --bg-card: #1c1028;
  --bg-input: #261534;
  --border: #432060;
  --text-main: #fdf4ff;
  --text-muted: #e9d5ff;
  --accent: #fcd34d;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(192, 132, 252, 0.22);
}
[data-theme="mystic-plum-light"] {
  --primary: #9333ea;
  --primary-hover: #7e22ce;
  --primary-glow: rgba(147, 51, 234, 0.18);
  --bg-main: #faf5ff;
  --bg-sidebar: #f3e8ff;
  --bg-card: #ffffff;
  --bg-input: #e9d5ff;
  --border: #d8b4fe;
  --text-main: #2e0060;
  --text-muted: #7e22ce;
  --accent: #a16207;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(147, 51, 234, 0.12);
}

/* ─────────────────────────────────────────────
   P4. SILK PINK 🎀
   Ultra-soft luxury silk — whisper pinks + ivory
   Couture fashion aesthetic — timeless elegance
───────────────────────────────────────────── */
[data-theme="silk-pink-dark"] {
  --primary: #f472b6;
  --primary-hover: #ec4899;
  --primary-glow: rgba(244, 114, 182, 0.25);
  --bg-main: #120814;
  --bg-sidebar: #1e1020;
  --bg-card: #2a182c;
  --bg-input: #362038;
  --border: #5a3460;
  --text-main: #fdf4ff;
  --text-muted: #f0abfc;
  --accent: #e879f9;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(244, 114, 182, 0.25);
}
[data-theme="silk-pink-light"] {
  --primary: #db2777;
  --primary-hover: #be185d;
  --primary-glow: rgba(219, 39, 119, 0.18);
  --bg-main: #fdf4ff;
  --bg-sidebar: #fae8ff;
  --bg-card: #ffffff;
  --bg-input: #f5d0fe;
  --border: #e879f9;
  --text-main: #4a044e;
  --text-muted: #be185d;
  --accent: #a21caf;
  --danger: #dc2626;
  --warning: #92400e;
  --shadow: 0 2px 12px rgba(219, 39, 119, 0.12);
}

/* ─────────────────────────────────────────────
   P5. AMBER GOLD 👑
   Rich royal amber and warm gold luxury
   Premium crown jewel — opulent and bold
───────────────────────────────────────────── */
[data-theme="amber-gold-dark"] {
  --primary: #fcd34d;
  --primary-hover: #fbbf24;
  --primary-glow: rgba(252, 211, 77, 0.25);
  --bg-main: #0e0800;
  --bg-sidebar: #1a1000;
  --bg-card: #261800;
  --bg-input: #322000;
  --border: #5a3c00;
  --text-main: #fffbeb;
  --text-muted: #fde68a;
  --accent: #f97316;
  --danger: #ef4444;
  --warning: #f59e0b;
  --shadow: 0 4px 24px rgba(252, 211, 77, 0.18);
}
[data-theme="amber-gold-light"] {
  --primary: #92400e;
  --primary-hover: #78350f;
  --primary-glow: rgba(146, 64, 14, 0.18);
  --bg-main: #fffbeb;
  --bg-sidebar: #fef3c7;
  --bg-card: #ffffff;
  --bg-input: #fde68a;
  --border: #fcd34d;
  --text-main: #3b1a00;
  --text-muted: #92400e;
  --accent: #c2410c;
  --danger: #dc2626;
  --warning: #b45309;
  --shadow: 0 2px 12px rgba(146, 64, 14, 0.1);
}

/* ══════════════════════════════════════════════════════════════
   SPECIAL THEMES — 5 New Additions
   ══════════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────────
   S1. NEON CYBER 🎮
   Cyberpunk neon green + electric purple on void black
   Hacker terminal meets futuristic city nights
───────────────────────────────────────────── */
[data-theme="neon-cyber-dark"] {
  --primary: #39ff14;
  --primary-hover: #22cc00;
  --primary-glow: rgba(57, 255, 20, 0.2);
  --bg-main: #000000;
  --bg-sidebar: #050508;
  --bg-card: #0a0a10;
  --bg-input: #101018;
  --border: #1a1a2e;
  --text-main: #e0ffe0;
  --text-muted: #39ff14;
  --accent: #bf00ff;
  --danger: #ff0050;
  --warning: #ffcc00;
  --shadow: 0 4px 24px rgba(57, 255, 20, 0.15);
}
[data-theme="neon-cyber-light"] {
  --primary: #15803d;
  --primary-hover: #166534;
  --primary-glow: rgba(21, 128, 61, 0.18);
  --bg-main: #f0fff4;
  --bg-sidebar: #dcfce7;
  --bg-card: #ffffff;
  --bg-input: #bbf7d0;
  --border: #86efac;
  --text-main: #052e16;
  --text-muted: #166534;
  --accent: #7c3aed;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(21, 128, 61, 0.1);
}

/* ─────────────────────────────────────────────
   S2. STEEL BLUE 🔷
   Industrial steel blue — sharp, precise, reliable
   Tech-pro aesthetic — clean and powerful
───────────────────────────────────────────── */
[data-theme="steel-blue-dark"] {
  --primary: #60a5fa;
  --primary-hover: #3b82f6;
  --primary-glow: rgba(96, 165, 250, 0.2);
  --bg-main: #03080f;
  --bg-sidebar: #070e1c;
  --bg-card: #0d1628;
  --bg-input: #121e34;
  --border: #1e3050;
  --text-main: #eff6ff;
  --text-muted: #93c5fd;
  --accent: #34d399;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(59, 130, 246, 0.15);
}
[data-theme="steel-blue-light"] {
  --primary: #1d4ed8;
  --primary-hover: #1e40af;
  --primary-glow: rgba(29, 78, 216, 0.15);
  --bg-main: #eff6ff;
  --bg-sidebar: #dbeafe;
  --bg-card: #ffffff;
  --bg-input: #bfdbfe;
  --border: #93c5fd;
  --text-main: #0c1a4e;
  --text-muted: #1e40af;
  --accent: #059669;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(29, 78, 216, 0.1);
}

/* ─────────────────────────────────────────────
   S3. VOLCANIC ASH 🌋
   Dark charcoal and molten orange lava tones
   Intense dramatic energy — raw power
───────────────────────────────────────────── */
[data-theme="volcanic-ash-dark"] {
  --primary: #ff6b35;
  --primary-hover: #e85520;
  --primary-glow: rgba(255, 107, 53, 0.22);
  --bg-main: #080604;
  --bg-sidebar: #120e08;
  --bg-card: #1c1610;
  --bg-input: #261e16;
  --border: #42301c;
  --text-main: #fff8f0;
  --text-muted: #fdba74;
  --accent: #facc15;
  --danger: #ef4444;
  --warning: #f59e0b;
  --shadow: 0 4px 24px rgba(255, 107, 53, 0.18);
}
[data-theme="volcanic-ash-light"] {
  --primary: #c2410c;
  --primary-hover: #9a3412;
  --primary-glow: rgba(194, 65, 12, 0.18);
  --bg-main: #fff7ed;
  --bg-sidebar: #ffedd5;
  --bg-card: #ffffff;
  --bg-input: #fed7aa;
  --border: #fdba74;
  --text-main: #431407;
  --text-muted: #9a3412;
  --accent: #a16207;
  --danger: #b91c1c;
  --warning: #92400e;
  --shadow: 0 2px 12px rgba(194, 65, 12, 0.1);
}

/* ─────────────────────────────────────────────
   S4. ARCTIC TEAL 🧊
   Pure arctic whites with sharp teal precision
   Clean cold modern — refreshingly minimal
───────────────────────────────────────────── */
[data-theme="arctic-teal-dark"] {
  --primary: #67e8f9;
  --primary-hover: #22d3ee;
  --primary-glow: rgba(103, 232, 249, 0.22);
  --bg-main: #00080e;
  --bg-sidebar: #001420;
  --bg-card: #002030;
  --bg-input: #002c40;
  --border: #004860;
  --text-main: #ecfeff;
  --text-muted: #a5f3fc;
  --accent: #a5f3fc;
  --danger: #ef4444;
  --warning: #f59e0b;
  --shadow: 0 4px 24px rgba(103, 232, 249, 0.22);
}
[data-theme="arctic-teal-light"] {
  --primary: #0e7490;
  --primary-hover: #155e75;
  --primary-glow: rgba(14, 116, 144, 0.18);
  --bg-main: #ecfeff;
  --bg-sidebar: #cffafe;
  --bg-card: #ffffff;
  --bg-input: #a5f3fc;
  --border: #67e8f9;
  --text-main: #083344;
  --text-muted: #155e75;
  --accent: #06b6d4;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(14, 116, 144, 0.12);
}

/* ─────────────────────────────────────────────
   S5. GRAPHITE PRO ⚙️
   Ultra-premium graphite dark — minimal pro tool
   Designer/developer dark mode — timeless
───────────────────────────────────────────── */
[data-theme="graphite-pro-dark"] {
  --primary: #a1a1aa;
  --primary-hover: #71717a;
  --primary-glow: rgba(161, 161, 170, 0.18);
  --bg-main: #030303;
  --bg-sidebar: #0a0a0a;
  --bg-card: #111111;
  --bg-input: #1a1a1a;
  --border: #2a2a2a;
  --text-main: #fafafa;
  --text-muted: #71717a;
  --accent: #3b82f6;
  --danger: #ef4444;
  --warning: #f59e0b;
  --shadow: 0 4px 24px rgba(0, 0, 0, 0.5);
}
[data-theme="graphite-pro-light"] {
  --primary: #3f3f46;
  --primary-hover: #27272a;
  --primary-glow: rgba(63, 63, 70, 0.15);
  --bg-main: #fafafa;
  --bg-sidebar: #f4f4f5;
  --bg-card: #ffffff;
  --bg-input: #e4e4e7;
  --border: #d4d4d8;
  --text-main: #09090b;
  --text-muted: #52525b;
  --accent: #2563eb;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}
/* ══════════════════════════════════════════════════════════════
   NEW PREMIUM THEMES — Elegant Soft Light Collection
   ══════════════════════════════════════════════════════════════ */

/* P-NEW1. GOLDEN BLUSH 🌟 */
[data-theme="golden-blush-dark"] {
  --primary: #f9c5b0;
  --primary-hover: #f5a888;
  --primary-glow: rgba(249, 197, 176, 0.25);
  --bg-main: #180e0a;
  --bg-sidebar: #261610;
  --bg-card: #321e18;
  --bg-input: #402818;
  --border: #5c3a28;
  --text-main: #fff5f0;
  --text-muted: #fde8d8;
  --accent: #fde8c8;
  --danger: #ef4444;
  --warning: #f59e0b;
  --shadow: 0 4px 24px rgba(249, 197, 176, 0.18);
}
[data-theme="golden-blush-light"] {
  --primary: #c2603a;
  --primary-hover: #a84e2c;
  --primary-glow: rgba(194, 96, 58, 0.18);
  --bg-main: #fff9f6;
  --bg-sidebar: #fdf0e8;
  --bg-card: #ffffff;
  --bg-input: #fde8d8;
  --border: #f9c5b0;
  --text-main: #3c1a10;
  --text-muted: #a84e2c;
  --accent: #d97706;
  --danger: #dc2626;
  --warning: #b45309;
  --shadow: 0 2px 12px rgba(194, 96, 58, 0.1);
}

/* P-NEW2. CHAMPAGNE ROSE 🥂 */
[data-theme="champagne-rose-dark"] {
  --primary: #f9a8d4;
  --primary-hover: #f472b6;
  --primary-glow: rgba(249, 168, 212, 0.22);
  --bg-main: #140610;
  --bg-sidebar: #200c1c;
  --bg-card: #2c1228;
  --bg-input: #381834;
  --border: #582850;
  --text-main: #fdf2f8;
  --text-muted: #fbcfe8;
  --accent: #f472b6;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(249, 168, 212, 0.2);
}
[data-theme="champagne-rose-light"] {
  --primary: #be185d;
  --primary-hover: #9d174d;
  --primary-glow: rgba(190, 24, 93, 0.18);
  --bg-main: #fdf2f8;
  --bg-sidebar: #fce7f3;
  --bg-card: #ffffff;
  --bg-input: #fbcfe8;
  --border: #f9a8d4;
  --text-main: #500724;
  --text-muted: #9d174d;
  --accent: #db2777;
  --danger: #dc2626;
  --warning: #92400e;
  --shadow: 0 2px 12px rgba(190, 24, 93, 0.12);
}

/* P-NEW3. DUSTY MAUVE 🌷 */
[data-theme="dusty-mauve-dark"] {
  --primary: #c8a0b4;
  --primary-hover: #b080a0;
  --primary-glow: rgba(200, 160, 180, 0.22);
  --bg-main: #130a10;
  --bg-sidebar: #1e1018;
  --bg-card: #2a1824;
  --bg-input: #382030;
  --border: #503044;
  --text-main: #fdf0f8;
  --text-muted: #e8ccd8;
  --accent: #e8ccd8;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(200, 160, 180, 0.2);
}
[data-theme="dusty-mauve-light"] {
  --primary: #8b4070;
  --primary-hover: #723060;
  --primary-glow: rgba(139, 64, 112, 0.18);
  --bg-main: #fdf6fc;
  --bg-sidebar: #faeef8;
  --bg-card: #ffffff;
  --bg-input: #f0d8ee;
  --border: #e0c0d8;
  --text-main: #2e0828;
  --text-muted: #723060;
  --accent: #a855f7;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(139, 64, 112, 0.1);
}

/* P-NEW4. NUDE BEIGE 🪷 */
[data-theme="nude-beige-dark"] {
  --primary: #e8d5c0;
  --primary-hover: #d4b898;
  --primary-glow: rgba(232, 213, 192, 0.2);
  --bg-main: #140e08;
  --bg-sidebar: #201610;
  --bg-card: #2c1e14;
  --bg-input: #38281c;
  --border: #503c2c;
  --text-main: #fef8f0;
  --text-muted: #f0dcc8;
  --accent: #f5ece0;
  --danger: #ef4444;
  --warning: #f59e0b;
  --shadow: 0 4px 24px rgba(232, 213, 192, 0.15);
}
[data-theme="nude-beige-light"] {
  --primary: #8c6040;
  --primary-hover: #7a5030;
  --primary-glow: rgba(140, 96, 64, 0.18);
  --bg-main: #fdfaf6;
  --bg-sidebar: #f8f0e8;
  --bg-card: #ffffff;
  --bg-input: #f0e4d4;
  --border: #e8d5c0;
  --text-main: #3c2410;
  --text-muted: #7a5030;
  --accent: #d97706;
  --danger: #dc2626;
  --warning: #b45309;
  --shadow: 0 2px 12px rgba(140, 96, 64, 0.1);
}

/* P-NEW5. MOCHA LATTE ☕ */
[data-theme="mocha-latte-dark"] {
  --primary: #c0906c;
  --primary-hover: #a87850;
  --primary-glow: rgba(192, 144, 108, 0.22);
  --bg-main: #100a06;
  --bg-sidebar: #1a1008;
  --bg-card: #261810;
  --bg-input: #322018;
  --border: #4a3020;
  --text-main: #fef7f0;
  --text-muted: #e8c8a8;
  --accent: #e8c8a8;
  --danger: #ef4444;
  --warning: #f59e0b;
  --shadow: 0 4px 24px rgba(192, 144, 108, 0.2);
}
[data-theme="mocha-latte-light"] {
  --primary: #8c4820;
  --primary-hover: #763a18;
  --primary-glow: rgba(140, 72, 32, 0.18);
  --bg-main: #fdf8f4;
  --bg-sidebar: #f8efe8;
  --bg-card: #ffffff;
  --bg-input: #f0dcc8;
  --border: #e0c0a0;
  --text-main: #3c1c08;
  --text-muted: #763a18;
  --accent: #b45309;
  --danger: #dc2626;
  --warning: #92400e;
  --shadow: 0 2px 12px rgba(140, 72, 32, 0.1);
}

/* P-NEW6. IVORY PEARL 🤍 */
[data-theme="ivory-pearl-dark"] {
  --primary: #f5f0e8;
  --primary-hover: #e8e0d0;
  --primary-glow: rgba(245, 240, 232, 0.15);
  --bg-main: #0e0c0a;
  --bg-sidebar: #181410;
  --bg-card: #221e18;
  --bg-input: #2c2820;
  --border: #403c34;
  --text-main: #fdfaf6;
  --text-muted: #e8e0d0;
  --accent: #fce8d8;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(245, 240, 232, 0.1);
}
[data-theme="ivory-pearl-light"] {
  --primary: #786050;
  --primary-hover: #604c40;
  --primary-glow: rgba(120, 96, 80, 0.15);
  --bg-main: #fdfcfa;
  --bg-sidebar: #f8f5f0;
  --bg-card: #ffffff;
  --bg-input: #f0ebe0;
  --border: #e8e0d0;
  --text-main: #2c2418;
  --text-muted: #604c40;
  --accent: #d97706;
  --danger: #dc2626;
  --warning: #b45309;
  --shadow: 0 2px 12px rgba(120, 96, 80, 0.1);
}

/* P-NEW7. SOFT BURGUNDY 🍷 */
[data-theme="soft-burgundy-dark"] {
  --primary: #c08090;
  --primary-hover: #a86878;
  --primary-glow: rgba(192, 128, 144, 0.22);
  --bg-main: #120808;
  --bg-sidebar: #1c0e10;
  --bg-card: #281418;
  --bg-input: #361c20;
  --border: #502830;
  --text-main: #fdf0f2;
  --text-muted: #e8c0c8;
  --accent: #d4a0b8;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(192, 128, 144, 0.2);
}
[data-theme="soft-burgundy-light"] {
  --primary: #8c3050;
  --primary-hover: #742040;
  --primary-glow: rgba(140, 48, 80, 0.18);
  --bg-main: #fdf6f8;
  --bg-sidebar: #f8ecf0;
  --bg-card: #ffffff;
  --bg-input: #f0d4dc;
  --border: #e0b8c4;
  --text-main: #3c0c18;
  --text-muted: #742040;
  --accent: #be185d;
  --danger: #dc2626;
  --warning: #92400e;
  --shadow: 0 2px 12px rgba(140, 48, 80, 0.1);
}

/* P-NEW8. TERRACOTTA GLOW 🏺 */
[data-theme="terracotta-glow-dark"] {
  --primary: #c8805c;
  --primary-hover: #b06844;
  --primary-glow: rgba(200, 128, 92, 0.22);
  --bg-main: #140a06;
  --bg-sidebar: #201008;
  --bg-card: #2c180e;
  --bg-input: #382018;
  --border: #503020;
  --text-main: #fef4ee;
  --text-muted: #f0c0a0;
  --accent: #f0c0a0;
  --danger: #ef4444;
  --warning: #f59e0b;
  --shadow: 0 4px 24px rgba(200, 128, 92, 0.2);
}
[data-theme="terracotta-glow-light"] {
  --primary: #a04828;
  --primary-hover: #883818;
  --primary-glow: rgba(160, 72, 40, 0.18);
  --bg-main: #fdf8f4;
  --bg-sidebar: #f8efe8;
  --bg-card: #ffffff;
  --bg-input: #f0d8c4;
  --border: #e4c0a0;
  --text-main: #3c1808;
  --text-muted: #883818;
  --accent: #b45309;
  --danger: #dc2626;
  --warning: #92400e;
  --shadow: 0 2px 12px rgba(160, 72, 40, 0.1);
}

/* ─────────────────────────────────────────────
   P-NEW9. BLUSH SAND 🌸
   Soft warm blush with sandy undertones — delicate feminine
───────────────────────────────────────────── */
[data-theme="blush-sand-dark"] {
  --primary: #e8a898;
  --primary-hover: #d88878;
  --primary-glow: rgba(232, 168, 152, 0.22);
  --bg-main: #160c08;
  --bg-sidebar: #221410;
  --bg-card: #2e1c18;
  --bg-input: #3a2420;
  --border: #583830;
  --text-main: #fff8f5;
  --text-muted: #f4c0b0;
  --accent: #f4c0b0;
  --danger: #ef4444;
  --warning: #f59e0b;
  --shadow: 0 4px 24px rgba(232, 168, 152, 0.2);
}
[data-theme="blush-sand-light"] {
  --primary: #c07060;
  --primary-hover: #a85848;
  --primary-glow: rgba(192, 112, 96, 0.18);
  --bg-main: #fff9f6;
  --bg-sidebar: #fdf0e8;
  --bg-card: #ffffff;
  --bg-input: #f8e0d4;
  --border: #f0c8b8;
  --text-main: #3c180c;
  --text-muted: #a85848;
  --accent: #d97706;
  --danger: #dc2626;
  --warning: #b45309;
  --shadow: 0 2px 12px rgba(192, 112, 96, 0.1);
}

/* ─────────────────────────────────────────────
   P-NEW10. ROSE PETAL 🌹
   Soft pure rose — gentle romantic pink blush
───────────────────────────────────────────── */
[data-theme="rose-petal-dark"] {
  --primary: #fb7185;
  --primary-hover: #f43f5e;
  --primary-glow: rgba(251, 113, 133, 0.25);
  --bg-main: #130608;
  --bg-sidebar: #1f0c10;
  --bg-card: #2b1018;
  --bg-input: #371620;
  --border: #572030;
  --text-main: #fff1f2;
  --text-muted: #fda4af;
  --accent: #f9a8d4;
  --danger: #ef4444;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(251, 113, 133, 0.22);
}
[data-theme="rose-petal-light"] {
  --primary: #e11d48;
  --primary-hover: #be123c;
  --primary-glow: rgba(225, 29, 72, 0.18);
  --bg-main: #fff1f2;
  --bg-sidebar: #ffe4e6;
  --bg-card: #ffffff;
  --bg-input: #fecdd3;
  --border: #fda4af;
  --text-main: #4c0519;
  --text-muted: #be123c;
  --accent: #fb7185;
  --danger: #b91c1c;
  --warning: #b45309;
  --shadow: 0 2px 12px rgba(225, 29, 72, 0.12);
}

/* ─────────────────────────────────────────────
   P-NEW11. VANILLA CREAM 🍦
   Warm soft vanilla whites — buttery and luxe
───────────────────────────────────────────── */
[data-theme="vanilla-cream-dark"] {
  --primary: #f5e6c8;
  --primary-hover: #e8d0a8;
  --primary-glow: rgba(245, 230, 200, 0.18);
  --bg-main: #120e04;
  --bg-sidebar: #1e1808;
  --bg-card: #2a2210;
  --bg-input: #362c18;
  --border: #544828;
  --text-main: #fefdf5;
  --text-muted: #f0e4c8;
  --accent: #fde68a;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(245, 230, 200, 0.15);
}
[data-theme="vanilla-cream-light"] {
  --primary: #a08040;
  --primary-hover: #886828;
  --primary-glow: rgba(160, 128, 64, 0.15);
  --bg-main: #fefdf5;
  --bg-sidebar: #fdf8e8;
  --bg-card: #ffffff;
  --bg-input: #f8f0d0;
  --border: #f0e4b8;
  --text-main: #3c3000;
  --text-muted: #886828;
  --accent: #d97706;
  --danger: #dc2626;
  --warning: #b45309;
  --shadow: 0 2px 12px rgba(160, 128, 64, 0.1);
}

/* ─────────────────────────────────────────────
   P-NEW12. WARM COCOA 🍫
   Rich dark cocoa with warm cream highlights
───────────────────────────────────────────── */
[data-theme="warm-cocoa-dark"] {
  --primary: #d4b090;
  --primary-hover: #b89070;
  --primary-glow: rgba(212, 176, 144, 0.22);
  --bg-main: #0e0806;
  --bg-sidebar: #180e08;
  --bg-card: #22160e;
  --bg-input: #2e1e14;
  --border: #483020;
  --text-main: #fef8f0;
  --text-muted: #e8d0b8;
  --accent: #e8d0b8;
  --danger: #ef4444;
  --warning: #f59e0b;
  --shadow: 0 4px 24px rgba(212, 176, 144, 0.18);
}
[data-theme="warm-cocoa-light"] {
  --primary: #8c5830;
  --primary-hover: #744420;
  --primary-glow: rgba(140, 88, 48, 0.18);
  --bg-main: #fdf9f4;
  --bg-sidebar: #f8f0e8;
  --bg-card: #ffffff;
  --bg-input: #f0e0d0;
  --border: #e0c8b0;
  --text-main: #3c2010;
  --text-muted: #744420;
  --accent: #b46838;
  --danger: #dc2626;
  --warning: #b45309;
  --shadow: 0 2px 12px rgba(140, 88, 48, 0.1);
}

/* ─────────────────────────────────────────────
   P-NEW13. LYCHEE MIST 🌿
   Pale lychee pink with creamy white mist glow
───────────────────────────────────────────── */
[data-theme="lychee-mist-dark"] {
  --primary: #fda4af;
  --primary-hover: #fb7185;
  --primary-glow: rgba(253, 164, 175, 0.22);
  --bg-main: #140810;
  --bg-sidebar: #200e1c;
  --bg-card: #2c1428;
  --bg-input: #381a34;
  --border: #5c2a50;
  --text-main: #fff5f8;
  --text-muted: #fecdd3;
  --accent: #fecdd3;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(253, 164, 175, 0.2);
}
[data-theme="lychee-mist-light"] {
  --primary: #e11d48;
  --primary-hover: #be123c;
  --primary-glow: rgba(225, 29, 72, 0.18);
  --bg-main: #fff5f6;
  --bg-sidebar: #ffe4e6;
  --bg-card: #ffffff;
  --bg-input: #fecdd3;
  --border: #fda4af;
  --text-main: #4c0519;
  --text-muted: #be123c;
  --accent: #fb7185;
  --danger: #b91c1c;
  --warning: #b45309;
  --shadow: 0 2px 12px rgba(225, 29, 72, 0.12);
}

/* ══════════════════════════════════════════════════════════════
   PREMIUM — 6 New Additions (replacing moved themes)
   ══════════════════════════════════════════════════════════════ */

/* MAUVE SMOKE 🪻 */
[data-theme="mauve-smoke-dark"] {
  --primary: #c8a0b4;
  --primary-hover: #b080a0;
  --primary-glow: rgba(200, 160, 180, 0.22);
  --bg-main: #120a10;
  --bg-sidebar: #1e1018;
  --bg-card: #2a1824;
  --bg-input: #362030;
  --border: #54304a;
  --text-main: #fdf0f8;
  --text-muted: #e8ccd8;
  --accent: #e8ccd8;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(200, 160, 180, 0.2);
}
[data-theme="mauve-smoke-light"] {
  --primary: #8b4070;
  --primary-hover: #723060;
  --primary-glow: rgba(139, 64, 112, 0.18);
  --bg-main: #fdf6fc;
  --bg-sidebar: #faeef8;
  --bg-card: #ffffff;
  --bg-input: #f0d8ee;
  --border: #e0c0d8;
  --text-main: #2e0828;
  --text-muted: #723060;
  --accent: #a855f7;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(139, 64, 112, 0.1);
}

/* PEONY BLUSH 🌸 */
[data-theme="peony-blush-dark"] {
  --primary: #f472b6;
  --primary-hover: #ec4899;
  --primary-glow: rgba(244, 114, 182, 0.25);
  --bg-main: #140610;
  --bg-sidebar: #200c1c;
  --bg-card: #2c1228;
  --bg-input: #381834;
  --border: #5c2850;
  --text-main: #fdf4ff;
  --text-muted: #f9a8d4;
  --accent: #e879f9;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(244, 114, 182, 0.22);
}
[data-theme="peony-blush-light"] {
  --primary: #db2777;
  --primary-hover: #be185d;
  --primary-glow: rgba(219, 39, 119, 0.18);
  --bg-main: #fdf2f8;
  --bg-sidebar: #fce7f3;
  --bg-card: #ffffff;
  --bg-input: #fbcfe8;
  --border: #f9a8d4;
  --text-main: #500724;
  --text-muted: #9d174d;
  --accent: #ec4899;
  --danger: #dc2626;
  --warning: #92400e;
  --shadow: 0 2px 12px rgba(219, 39, 119, 0.12);
}

/* MIDNIGHT BERRY 🫐 */
[data-theme="midnight-berry-dark"] {
  --primary: #c084c0;
  --primary-hover: #a060a0;
  --primary-glow: rgba(192, 132, 192, 0.22);
  --bg-main: #0e0610;
  --bg-sidebar: #180c1c;
  --bg-card: #221228;
  --bg-input: #2e1a34;
  --border: #4c2858;
  --text-main: #faf0fc;
  --text-muted: #ddb8e0;
  --accent: #e879f9;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(192, 132, 192, 0.2);
}
[data-theme="midnight-berry-light"] {
  --primary: #7c3a6e;
  --primary-hover: #642858;
  --primary-glow: rgba(124, 58, 110, 0.18);
  --bg-main: #fdf5ff;
  --bg-sidebar: #f8e8fc;
  --bg-card: #ffffff;
  --bg-input: #f0d0f8;
  --border: #e4b8f0;
  --text-main: #2c0840;
  --text-muted: #642858;
  --accent: #a855f7;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(124, 58, 110, 0.1);
}

/* PLUM VELVET 🍇 */
[data-theme="plum-velvet-dark"] {
  --primary: #a855f7;
  --primary-hover: #9333ea;
  --primary-glow: rgba(168, 85, 247, 0.25);
  --bg-main: #0a0414;
  --bg-sidebar: #120820;
  --bg-card: #1a0c2e;
  --bg-input: #22103c;
  --border: #3c1c5e;
  --text-main: #faf5ff;
  --text-muted: #d8b4fe;
  --accent: #c084fc;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(168, 85, 247, 0.25);
}
[data-theme="plum-velvet-light"] {
  --primary: #7e22ce;
  --primary-hover: #6b21a8;
  --primary-glow: rgba(126, 34, 206, 0.18);
  --bg-main: #faf5ff;
  --bg-sidebar: #f3e8ff;
  --bg-card: #ffffff;
  --bg-input: #e9d5ff;
  --border: #d8b4fe;
  --text-main: #3b0764;
  --text-muted: #6b21a8;
  --accent: #9333ea;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(126, 34, 206, 0.12);
}

/* FROSTED ROSE 🥀 */
[data-theme="frosted-rose-dark"] {
  --primary: #e8c0d0;
  --primary-hover: #d4a0b8;
  --primary-glow: rgba(232, 192, 208, 0.18);
  --bg-main: #120a0e;
  --bg-sidebar: #1e1018;
  --bg-card: #2a1822;
  --bg-input: #36202e;
  --border: #543044;
  --text-main: #fef8fc;
  --text-muted: #f8e8f0;
  --accent: #f8e8f0;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(232, 192, 208, 0.15);
}
[data-theme="frosted-rose-light"] {
  --primary: #b06090;
  --primary-hover: #984878;
  --primary-glow: rgba(176, 96, 144, 0.15);
  --bg-main: #fefafd;
  --bg-sidebar: #fdf0f8;
  --bg-card: #ffffff;
  --bg-input: #f8e0f0;
  --border: #f0cce4;
  --text-main: #3c0828;
  --text-muted: #984878;
  --accent: #c026d3;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(176, 96, 144, 0.1);
}

/* WINE VELVET 🍷 */
[data-theme="wine-velvet-dark"] {
  --primary: #c86080;
  --primary-hover: #a84060;
  --primary-glow: rgba(200, 96, 128, 0.22);
  --bg-main: #100408;
  --bg-sidebar: #1c0810;
  --bg-card: #280e18;
  --bg-input: #341620;
  --border: #542030;
  --text-main: #fef0f4;
  --text-muted: #f0b8cc;
  --accent: #f472b6;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(200, 96, 128, 0.22);
}
[data-theme="wine-velvet-light"] {
  --primary: #8b1a3a;
  --primary-hover: #730e28;
  --primary-glow: rgba(139, 26, 58, 0.18);
  --bg-main: #fff5f8;
  --bg-sidebar: #fde8f0;
  --bg-card: #ffffff;
  --bg-input: #fccce0;
  --border: #f8aac8;
  --text-main: #400818;
  --text-muted: #730e28;
  --accent: #be185d;
  --danger: #b91c1c;
  --warning: #92400e;
  --shadow: 0 2px 12px rgba(139, 26, 58, 0.1);
}

/* ══════════════════════════════════════════════════════════════
   SCREENSHOT-INSPIRED PREMIUM THEMES — 10 New
   ══════════════════════════════════════════════════════════════ */

/* RUBY RED 🍒 — #9B111E deep dark ruby */
[data-theme="ruby-red-dark"] {
  --primary: #dc2626;
  --primary-hover: #b91c1c;
  --primary-glow: rgba(220, 38, 38, 0.28);
  --bg-main: #0e0000;
  --bg-sidebar: #1c0000;
  --bg-card: #280000;
  --bg-input: #340000;
  --border: #560000;
  --text-main: #fff5f5;
  --text-muted: #fca5a5;
  --accent: #f87171;
  --danger: #ef4444;
  --warning: #f59e0b;
  --shadow: 0 4px 24px rgba(220, 38, 38, 0.3);
}
[data-theme="ruby-red-light"] {
  --primary: #b91c1c;
  --primary-hover: #991b1b;
  --primary-glow: rgba(185, 28, 28, 0.18);
  --bg-main: #fff5f5;
  --bg-sidebar: #fee2e2;
  --bg-card: #ffffff;
  --bg-input: #fecaca;
  --border: #fca5a5;
  --text-main: #450a0a;
  --text-muted: #991b1b;
  --accent: #dc2626;
  --danger: #b91c1c;
  --warning: #b45309;
  --shadow: 0 2px 12px rgba(185, 28, 28, 0.12);
}

/* AMARANTH GLOW 🌺 — #E52B50 hot pink-red */
[data-theme="amaranth-glow-dark"] {
  --primary: #ec4899;
  --primary-hover: #db2777;
  --primary-glow: rgba(236, 72, 153, 0.25);
  --bg-main: #140612;
  --bg-sidebar: #200c1e;
  --bg-card: #2c122a;
  --bg-input: #381836;
  --border: #5c2858;
  --text-main: #fdf2f8;
  --text-muted: #f9a8d4;
  --accent: #f472b6;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(236, 72, 153, 0.25);
}
[data-theme="amaranth-glow-light"] {
  --primary: #be185d;
  --primary-hover: #9d174d;
  --primary-glow: rgba(190, 24, 93, 0.18);
  --bg-main: #fdf2f8;
  --bg-sidebar: #fce7f3;
  --bg-card: #ffffff;
  --bg-input: #fbcfe8;
  --border: #f9a8d4;
  --text-main: #500724;
  --text-muted: #9d174d;
  --accent: #db2777;
  --danger: #dc2626;
  --warning: #92400e;
  --shadow: 0 2px 12px rgba(190, 24, 93, 0.12);
}

/* PERIWINKLE DREAM 🫧 — #CCCCFF soft blue-lavender */
[data-theme="periwinkle-dream-dark"] {
  --primary: #a0a8e8;
  --primary-hover: #8090d8;
  --primary-glow: rgba(160, 168, 232, 0.22);
  --bg-main: #080c18;
  --bg-sidebar: #101420;
  --bg-card: #181e2e;
  --bg-input: #20283c;
  --border: #303c58;
  --text-main: #f0f4ff;
  --text-muted: #c8d0f0;
  --accent: #ccccff;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(160, 168, 232, 0.2);
}
[data-theme="periwinkle-dream-light"] {
  --primary: #5060c0;
  --primary-hover: #3848a8;
  --primary-glow: rgba(80, 96, 192, 0.18);
  --bg-main: #f5f6ff;
  --bg-sidebar: #eaecff;
  --bg-card: #ffffff;
  --bg-input: #d8dcff;
  --border: #c0c8ff;
  --text-main: #10184a;
  --text-muted: #3848a8;
  --accent: #6366f1;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(80, 96, 192, 0.12);
}

/* WISTERIA MIST 🌿 — #C9A0DC soft wisteria */
[data-theme="wisteria-mist-dark"] {
  --primary: #c4b5fd;
  --primary-hover: #a78bfa;
  --primary-glow: rgba(196, 181, 253, 0.22);
  --bg-main: #0c0818;
  --bg-sidebar: #181024;
  --bg-card: #241830;
  --bg-input: #30203c;
  --border: #4e3460;
  --text-main: #f5f3ff;
  --text-muted: #ddd6fe;
  --accent: #ddd6fe;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(196, 181, 253, 0.2);
}
[data-theme="wisteria-mist-light"] {
  --primary: #7c3aed;
  --primary-hover: #6d28d9;
  --primary-glow: rgba(124, 58, 237, 0.18);
  --bg-main: #f5f3ff;
  --bg-sidebar: #ede9fe;
  --bg-card: #ffffff;
  --bg-input: #ddd6fe;
  --border: #c4b5fd;
  --text-main: #2e1065;
  --text-muted: #6d28d9;
  --accent: #8b5cf6;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(124, 58, 237, 0.12);
}

/* AMETHYST DEEP 💜 — #9966CC rich amethyst */
[data-theme="amethyst-deep-dark"] {
  --primary: #9966cc;
  --primary-hover: #7a48b0;
  --primary-glow: rgba(153, 102, 204, 0.25);
  --bg-main: #0a060e;
  --bg-sidebar: #120c18;
  --bg-card: #1c1224;
  --bg-input: #261a30;
  --border: #3e2850;
  --text-main: #f8f0ff;
  --text-muted: #d0a8f0;
  --accent: #c084fc;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(153, 102, 204, 0.25);
}
[data-theme="amethyst-deep-light"] {
  --primary: #7b2fbe;
  --primary-hover: #6320a0;
  --primary-glow: rgba(123, 47, 190, 0.18);
  --bg-main: #faf5ff;
  --bg-sidebar: #f3e8ff;
  --bg-card: #ffffff;
  --bg-input: #e9d5ff;
  --border: #d8b4fe;
  --text-main: #2e1060;
  --text-muted: #6320a0;
  --accent: #9333ea;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(123, 47, 190, 0.12);
}

/* FLAMINGO BLUSH 🌸 — #FC8EAC soft flamingo */
[data-theme="flamingo-blush-dark"] {
  --primary: #fc8eac;
  --primary-hover: #f06890;
  --primary-glow: rgba(252, 142, 172, 0.25);
  --bg-main: #140810;
  --bg-sidebar: #200e1c;
  --bg-card: #2c1428;
  --bg-input: #381a34;
  --border: #5c2a50;
  --text-main: #fff0f6;
  --text-muted: #ffc1d8;
  --accent: #ffc1cc;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(252, 142, 172, 0.22);
}
[data-theme="flamingo-blush-light"] {
  --primary: #e8547a;
  --primary-hover: #d03060;
  --primary-glow: rgba(232, 84, 122, 0.18);
  --bg-main: #fff5f9;
  --bg-sidebar: #ffe8f2;
  --bg-card: #ffffff;
  --bg-input: #ffd0e8;
  --border: #ffb8d8;
  --text-main: #400828;
  --text-muted: #d03060;
  --accent: #db2777;
  --danger: #dc2626;
  --warning: #92400e;
  --shadow: 0 2px 12px rgba(232, 84, 122, 0.12);
}

/* BYZANTIUM DUSK 🍇 — #702963 dark Byzantine purple */
[data-theme="byzantium-dusk-dark"] {
  --primary: #a0527a;
  --primary-hover: #883860;
  --primary-glow: rgba(112, 41, 99, 0.25);
  --bg-main: #0a040e;
  --bg-sidebar: #140818;
  --bg-card: #1e0e22;
  --bg-input: #28142e;
  --border: #44204a;
  --text-main: #f8eeff;
  --text-muted: #d8a8e0;
  --accent: #c084c0;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(112, 41, 99, 0.25);
}
[data-theme="byzantium-dusk-light"] {
  --primary: #702963;
  --primary-hover: #581850;
  --primary-glow: rgba(112, 41, 99, 0.18);
  --bg-main: #fdf5ff;
  --bg-sidebar: #f5e8fa;
  --bg-card: #ffffff;
  --bg-input: #ead0f5;
  --border: #d8b0ec;
  --text-main: #280840;
  --text-muted: #581850;
  --accent: #9333ea;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(112, 41, 99, 0.12);
}

/* HELIOTROPE 🔮 — #DF73FF bright electric purple */
[data-theme="heliotrope-dark"] {
  --primary: #df73ff;
  --primary-hover: #c855f0;
  --primary-glow: rgba(223, 115, 255, 0.28);
  --bg-main: #0a0214;
  --bg-sidebar: #140620;
  --bg-card: #1e0a2e;
  --bg-input: #280e3c;
  --border: #441858;
  --text-main: #fdf0ff;
  --text-muted: #e8b0ff;
  --accent: #e0b0ff;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(223, 115, 255, 0.28);
}
[data-theme="heliotrope-light"] {
  --primary: #9c27b0;
  --primary-hover: #7b1fa2;
  --primary-glow: rgba(156, 39, 176, 0.18);
  --bg-main: #fdf4ff;
  --bg-sidebar: #fae8ff;
  --bg-card: #ffffff;
  --bg-input: #f5d0fe;
  --border: #e879f9;
  --text-main: #4a044e;
  --text-muted: #7b1fa2;
  --accent: #a855f7;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(156, 39, 176, 0.12);
}

/* MULBERRY GLOW 🌹 — #C54B8C deep berry pink */
[data-theme="mulberry-glow-dark"] {
  --primary: #e880b8;
  --primary-hover: #d060a0;
  --primary-glow: rgba(197, 75, 140, 0.25);
  --bg-main: #120610;
  --bg-sidebar: #1e0c1c;
  --bg-card: #2a1028;
  --bg-input: #381634;
  --border: #5a2850;
  --text-main: #fff0fc;
  --text-muted: #f0b0d8;
  --accent: #f472b6;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(197, 75, 140, 0.25);
}
[data-theme="mulberry-glow-light"] {
  --primary: #c54b8c;
  --primary-hover: #a83070;
  --primary-glow: rgba(197, 75, 140, 0.18);
  --bg-main: #fff5fc;
  --bg-sidebar: #fde8f6;
  --bg-card: #ffffff;
  --bg-input: #fcd0ec;
  --border: #f8b0dc;
  --text-main: #3c0830;
  --text-muted: #a83070;
  --accent: #db2777;
  --danger: #dc2626;
  --warning: #92400e;
  --shadow: 0 2px 12px rgba(197, 75, 140, 0.12);
}

/* BUBBLEGUM POP 🩷 — #FFC1CC sweet pastel pink */
[data-theme="bubblegum-pop-dark"] {
  --primary: #f9a8d4;
  --primary-hover: #f472b6;
  --primary-glow: rgba(249, 168, 212, 0.25);
  --bg-main: #140610;
  --bg-sidebar: #200c1c;
  --bg-card: #2c1228;
  --bg-input: #381834;
  --border: #5a2850;
  --text-main: #fff0f8;
  --text-muted: #fce7f3;
  --accent: #fbcfe8;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(249, 168, 212, 0.22);
}
[data-theme="bubblegum-pop-light"] {
  --primary: #ec4899;
  --primary-hover: #db2777;
  --primary-glow: rgba(236, 72, 153, 0.18);
  --bg-main: #fdf2f8;
  --bg-sidebar: #fce7f3;
  --bg-card: #ffffff;
  --bg-input: #fbcfe8;
  --border: #f9a8d4;
  --text-main: #500724;
  --text-muted: #9d174d;
  --accent: #f472b6;
  --danger: #dc2626;
  --warning: #92400e;
  --shadow: 0 2px 12px rgba(236, 72, 153, 0.12);
}

/* PEACH BLOSSOM 🍑 (Warm Tones) */
[data-theme="peach-blossom-dark"] {
  --primary: #fda06c;
  --primary-hover: #f97c44;
  --primary-glow: rgba(253, 160, 108, 0.22);
  --bg-main: #120800;
  --bg-sidebar: #1e1000;
  --bg-card: #2a1800;
  --bg-input: #362000;
  --border: #543400;
  --text-main: #fff8f0;
  --text-muted: #ffc8a0;
  --accent: #fbbf24;
  --danger: #ef4444;
  --warning: #f59e0b;
  --shadow: 0 4px 24px rgba(253, 160, 108, 0.2);
}
[data-theme="peach-blossom-light"] {
  --primary: #c05820;
  --primary-hover: #a04010;
  --primary-glow: rgba(192, 88, 32, 0.18);
  --bg-main: #fff9f4;
  --bg-sidebar: #fff0e8;
  --bg-card: #ffffff;
  --bg-input: #ffdcc0;
  --border: #ffc8a0;
  --text-main: #3c1800;
  --text-muted: #a04010;
  --accent: #d97706;
  --danger: #dc2626;
  --warning: #b45309;
  --shadow: 0 2px 12px rgba(192, 88, 32, 0.1);
}

/* ══════════════════════════════════════════════════════════════
   NEW SPECIAL THEMES — 6 Additions
   ══════════════════════════════════════════════════════════════ */

/* S-NEW1. CRIMSON NIGHT 🔴 */
[data-theme="crimson-night-dark"] {
  --primary: #9f1239;
  --primary-hover: #881337;
  --primary-glow: rgba(159, 18, 57, 0.28);
  --bg-main: #0a0004;
  --bg-sidebar: #140008;
  --bg-card: #1e000e;
  --bg-input: #280014;
  --border: #440020;
  --text-main: #fff0f4;
  --text-muted: #fda4af;
  --accent: #fb7185;
  --danger: #ef4444;
  --warning: #f59e0b;
  --shadow: 0 4px 24px rgba(159, 18, 57, 0.28);
}
[data-theme="crimson-night-light"] {
  --primary: #9f1239;
  --primary-hover: #881337;
  --primary-glow: rgba(159, 18, 57, 0.18);
  --bg-main: #fff1f2;
  --bg-sidebar: #ffe4e6;
  --bg-card: #ffffff;
  --bg-input: #fecdd3;
  --border: #fda4af;
  --text-main: #4c0519;
  --text-muted: #881337;
  --accent: #e11d48;
  --danger: #b91c1c;
  --warning: #b45309;
  --shadow: 0 2px 12px rgba(159, 18, 57, 0.12);
}

/* S-NEW2. JADE STONE 🟢 */
[data-theme="jade-stone-dark"] {
  --primary: #4ade80;
  --primary-hover: #22c55e;
  --primary-glow: rgba(74, 222, 128, 0.2);
  --bg-main: #020c04;
  --bg-sidebar: #051408;
  --bg-card: #081e0c;
  --bg-input: #0c2810;
  --border: #144020;
  --text-main: #f0fdf4;
  --text-muted: #86efac;
  --accent: #34d399;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(34, 197, 94, 0.15);
}
[data-theme="jade-stone-light"] {
  --primary: #15803d;
  --primary-hover: #166534;
  --primary-glow: rgba(21, 128, 61, 0.18);
  --bg-main: #f0fdf4;
  --bg-sidebar: #dcfce7;
  --bg-card: #ffffff;
  --bg-input: #bbf7d0;
  --border: #86efac;
  --text-main: #052e16;
  --text-muted: #166534;
  --accent: #0d9488;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(21, 128, 61, 0.1);
}

/* S-NEW3. COBALT STORM ⛈️ */
[data-theme="cobalt-storm-dark"] {
  --primary: #3b82f6;
  --primary-hover: #2563eb;
  --primary-glow: rgba(59, 130, 246, 0.22);
  --bg-main: #020510;
  --bg-sidebar: #040918;
  --bg-card: #080e22;
  --bg-input: #0e1530;
  --border: #182048;
  --text-main: #eff6ff;
  --text-muted: #93c5fd;
  --accent: #818cf8;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(37, 99, 235, 0.2);
}
[data-theme="cobalt-storm-light"] {
  --primary: #1d4ed8;
  --primary-hover: #1e40af;
  --primary-glow: rgba(29, 78, 216, 0.15);
  --bg-main: #eff6ff;
  --bg-sidebar: #dbeafe;
  --bg-card: #ffffff;
  --bg-input: #bfdbfe;
  --border: #93c5fd;
  --text-main: #1e3a8a;
  --text-muted: #1e40af;
  --accent: #4f46e5;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(29, 78, 216, 0.1);
}

/* S-NEW4. BRONZE DUSK 🥉 */
[data-theme="bronze-dusk-dark"] {
  --primary: #78350f;
  --primary-hover: #63290b;
  --primary-glow: rgba(120, 53, 15, 0.28);
  --bg-main: #080400;
  --bg-sidebar: #140a00;
  --bg-card: #201000;
  --bg-input: #2c1600;
  --border: #482800;
  --text-main: #fef9f0;
  --text-muted: #d97706;
  --accent: #b45309;
  --danger: #ef4444;
  --warning: #d97706;
  --shadow: 0 4px 24px rgba(120, 53, 15, 0.25);
}
[data-theme="bronze-dusk-light"] {
  --primary: #78350f;
  --primary-hover: #63290b;
  --primary-glow: rgba(120, 53, 15, 0.18);
  --bg-main: #fdf8f0;
  --bg-sidebar: #fef3c7;
  --bg-card: #ffffff;
  --bg-input: #fde68a;
  --border: #fcd34d;
  --text-main: #3c2000;
  --text-muted: #63290b;
  --accent: #92400e;
  --danger: #dc2626;
  --warning: #78350f;
  --shadow: 0 2px 12px rgba(120, 53, 15, 0.12);
}

/* S-NEW5. SAGE GRAY 🪨 */
[data-theme="sage-gray-dark"] {
  --primary: #94a3b8;
  --primary-hover: #748394;
  --primary-glow: rgba(148, 163, 184, 0.18);
  --bg-main: #080a08;
  --bg-sidebar: #101410;
  --bg-card: #181e18;
  --bg-input: #202820;
  --border: #303e30;
  --text-main: #f4f6f4;
  --text-muted: #9ab09a;
  --accent: #86efac;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(148, 163, 184, 0.15);
}
[data-theme="sage-gray-light"] {
  --primary: #4a6058;
  --primary-hover: #384e48;
  --primary-glow: rgba(74, 96, 88, 0.15);
  --bg-main: #f4f6f4;
  --bg-sidebar: #e8ede8;
  --bg-card: #ffffff;
  --bg-input: #d8e4d8;
  --border: #c0d0c0;
  --text-main: #1a2a1a;
  --text-muted: #384e48;
  --accent: #16a34a;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(74, 96, 88, 0.1);
}

/* S-NEW6. CARBON BLACK 🖤 */
[data-theme="carbon-black-dark"] {
  --primary: #71717a;
  --primary-hover: #52525b;
  --primary-glow: rgba(113, 113, 122, 0.18);
  --bg-main: #000000;
  --bg-sidebar: #050505;
  --bg-card: #0d0d0d;
  --bg-input: #141414;
  --border: #202020;
  --text-main: #f5f5f5;
  --text-muted: #a1a1aa;
  --accent: #52525b;
  --danger: #ef4444;
  --warning: #f59e0b;
  --shadow: 0 4px 24px rgba(0, 0, 0, 0.6);
}
[data-theme="carbon-black-light"] {
  --primary: #27272a;
  --primary-hover: #18181b;
  --primary-glow: rgba(39, 39, 42, 0.15);
  --bg-main: #f4f4f5;
  --bg-sidebar: #e4e4e7;
  --bg-card: #ffffff;
  --bg-input: #d4d4d8;
  --border: #a1a1aa;
  --text-main: #09090b;
  --text-muted: #3f3f46;
  --accent: #3b82f6;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
}

/* ══════════════════════════════════════════════════════════════
   WARM TONES THEMES — 10 New Additions
   ══════════════════════════════════════════════════════════════ */

/* W1. MAPLE SPICE 🍁 */
[data-theme="maple-spice-dark"] {
  --primary: #ea580c;
  --primary-hover: #c2410c;
  --primary-glow: rgba(234, 88, 12, 0.22);
  --bg-main: #100602;
  --bg-sidebar: #1a0c04;
  --bg-card: #261208;
  --bg-input: #32180c;
  --border: #4e2810;
  --text-main: #fff7f0;
  --text-muted: #fdba74;
  --accent: #fcd34d;
  --danger: #ef4444;
  --warning: #f59e0b;
  --shadow: 0 4px 24px rgba(234, 88, 12, 0.18);
}
[data-theme="maple-spice-light"] {
  --primary: #c2410c;
  --primary-hover: #9a3412;
  --primary-glow: rgba(194, 65, 12, 0.18);
  --bg-main: #fff7ed;
  --bg-sidebar: #ffedd5;
  --bg-card: #ffffff;
  --bg-input: #fed7aa;
  --border: #fdba74;
  --text-main: #431407;
  --text-muted: #9a3412;
  --accent: #a16207;
  --danger: #b91c1c;
  --warning: #92400e;
  --shadow: 0 2px 12px rgba(194, 65, 12, 0.1);
}

/* W2. CINNAMON SMOKE 🪵 */
[data-theme="cinnamon-smoke-dark"] {
  --primary: #b45309;
  --primary-hover: #92400e;
  --primary-glow: rgba(180, 83, 9, 0.22);
  --bg-main: #0c0602;
  --bg-sidebar: #160e04;
  --bg-card: #201408;
  --bg-input: #2a1a0c;
  --border: #442c10;
  --text-main: #fefce8;
  --text-muted: #fde68a;
  --accent: #f59e0b;
  --danger: #ef4444;
  --warning: #d97706;
  --shadow: 0 4px 24px rgba(180, 83, 9, 0.2);
}
[data-theme="cinnamon-smoke-light"] {
  --primary: #92400e;
  --primary-hover: #78350f;
  --primary-glow: rgba(146, 64, 14, 0.18);
  --bg-main: #fffbeb;
  --bg-sidebar: #fef3c7;
  --bg-card: #ffffff;
  --bg-input: #fde68a;
  --border: #fcd34d;
  --text-main: #3c1c02;
  --text-muted: #78350f;
  --accent: #d97706;
  --danger: #dc2626;
  --warning: #b45309;
  --shadow: 0 2px 12px rgba(146, 64, 14, 0.1);
}

/* W3. GOLDEN AUTUMN 🍂 */
[data-theme="golden-autumn-dark"] {
  --primary: #c2410c;
  --primary-hover: #9a3412;
  --primary-glow: rgba(194, 65, 12, 0.25);
  --bg-main: #100400;
  --bg-sidebar: #1c0800;
  --bg-card: #281000;
  --bg-input: #341800;
  --border: #522c00;
  --text-main: #fff7ed;
  --text-muted: #fed7aa;
  --accent: #f97316;
  --danger: #ef4444;
  --warning: #d97706;
  --shadow: 0 4px 24px rgba(194, 65, 12, 0.22);
}
[data-theme="golden-autumn-light"] {
  --primary: #9a3412;
  --primary-hover: #7c2d12;
  --primary-glow: rgba(154, 52, 18, 0.18);
  --bg-main: #fff7ed;
  --bg-sidebar: #ffedd5;
  --bg-card: #ffffff;
  --bg-input: #fed7aa;
  --border: #fdba74;
  --text-main: #431407;
  --text-muted: #7c2d12;
  --accent: #ea580c;
  --danger: #b91c1c;
  --warning: #92400e;
  --shadow: 0 2px 12px rgba(154, 52, 18, 0.12);
}

/* W4. CARAMEL LATTE 🧡 */
[data-theme="caramel-latte-dark"] {
  --primary: #d4a574;
  --primary-hover: #c08850;
  --primary-glow: rgba(212, 165, 116, 0.25);
  --bg-main: #100800;
  --bg-sidebar: #1c1000;
  --bg-card: #281800;
  --bg-input: #342000;
  --border: #523400;
  --text-main: #fef8f0;
  --text-muted: #e8c8a0;
  --accent: #f0c070;
  --danger: #ef4444;
  --warning: #d97706;
  --shadow: 0 4px 24px rgba(212, 165, 116, 0.22);
}
[data-theme="caramel-latte-light"] {
  --primary: #a06030;
  --primary-hover: #884818;
  --primary-glow: rgba(160, 96, 48, 0.18);
  --bg-main: #fdf8f0;
  --bg-sidebar: #f8efe0;
  --bg-card: #ffffff;
  --bg-input: #f0dcc0;
  --border: #e4c898;
  --text-main: #3c2000;
  --text-muted: #884818;
  --accent: #d97706;
  --danger: #dc2626;
  --warning: #b45309;
  --shadow: 0 2px 12px rgba(160, 96, 48, 0.1);
}

/* W5. SAFFRON DRIFT 🌾 */
[data-theme="saffron-drift-dark"] {
  --primary: #fbbf24;
  --primary-hover: #f59e0b;
  --primary-glow: rgba(251, 191, 36, 0.25);
  --bg-main: #0e0c00;
  --bg-sidebar: #1a1600;
  --bg-card: #262000;
  --bg-input: #322a00;
  --border: #504400;
  --text-main: #fffde7;
  --text-muted: #fef08a;
  --accent: #fde047;
  --danger: #ef4444;
  --warning: #d97706;
  --shadow: 0 4px 24px rgba(251, 191, 36, 0.22);
}
[data-theme="saffron-drift-light"] {
  --primary: #d97706;
  --primary-hover: #b45309;
  --primary-glow: rgba(217, 119, 6, 0.18);
  --bg-main: #fffde7;
  --bg-sidebar: #fef9c3;
  --bg-card: #ffffff;
  --bg-input: #fef08a;
  --border: #fde047;
  --text-main: #3a2c00;
  --text-muted: #b45309;
  --accent: #f59e0b;
  --danger: #dc2626;
  --warning: #92400e;
  --shadow: 0 2px 12px rgba(217, 119, 6, 0.12);
}

/* W6. CLAY EARTH 🏔 */
[data-theme="clay-earth-dark"] {
  --primary: #a16207;
  --primary-hover: #854d0e;
  --primary-glow: rgba(161, 98, 7, 0.22);
  --bg-main: #080602;
  --bg-sidebar: #120e04;
  --bg-card: #1c1608;
  --bg-input: #262010;
  --border: #403418;
  --text-main: #fefdf8;
  --text-muted: #fde68a;
  --accent: #d97706;
  --danger: #ef4444;
  --warning: #f59e0b;
  --shadow: 0 4px 24px rgba(161, 98, 7, 0.18);
}
[data-theme="clay-earth-light"] {
  --primary: #78350f;
  --primary-hover: #63290b;
  --primary-glow: rgba(120, 53, 15, 0.18);
  --bg-main: #fdfaf2;
  --bg-sidebar: #fef3c7;
  --bg-card: #ffffff;
  --bg-input: #fde68a;
  --border: #fcd34d;
  --text-main: #3c2c08;
  --text-muted: #63290b;
  --accent: #b45309;
  --danger: #dc2626;
  --warning: #92400e;
  --shadow: 0 2px 12px rgba(120, 53, 15, 0.1);
}

/* W7. BURNT SIENNA 🔶 */
[data-theme="burnt-sienna-dark"] {
  --primary: #e97451;
  --primary-hover: #c8531a;
  --primary-glow: rgba(233, 116, 81, 0.22);
  --bg-main: #100600;
  --bg-sidebar: #1e0e00;
  --bg-card: #2a1600;
  --bg-input: #361e00;
  --border: #543200;
  --text-main: #fff7ed;
  --text-muted: #fdba74;
  --accent: #fbbf24;
  --danger: #dc2626;
  --warning: #f59e0b;
  --shadow: 0 4px 24px rgba(127, 29, 29, 0.28);
}
[data-theme="burnt-sienna-light"] {
  --primary: #c2410c;
  --primary-hover: #9a3412;
  --primary-glow: rgba(194, 65, 12, 0.18);
  --bg-main: #fff7ed;
  --bg-sidebar: #ffedd5;
  --bg-card: #ffffff;
  --bg-input: #fed7aa;
  --border: #fdba74;
  --text-main: #431407;
  --text-muted: #9a3412;
  --accent: #d97706;
  --danger: #991b1b;
  --warning: #b45309;
  --shadow: 0 2px 12px rgba(127, 29, 29, 0.12);
}

/* W8. WARM SAND 🏜️ */
[data-theme="warm-sand-dark"] {
  --primary: #fde68a;
  --primary-hover: #fcd34d;
  --primary-glow: rgba(253, 230, 138, 0.2);
  --bg-main: #0e0c04;
  --bg-sidebar: #1a1808;
  --bg-card: #262210;
  --bg-input: #322c18;
  --border: #4a4024;
  --text-main: #fdfcf0;
  --text-muted: #fef3c7;
  --accent: #f59e0b;
  --danger: #ef4444;
  --warning: #d97706;
  --shadow: 0 4px 24px rgba(253, 230, 138, 0.15);
}
[data-theme="warm-sand-light"] {
  --primary: #a16207;
  --primary-hover: #854d0e;
  --primary-glow: rgba(161, 98, 7, 0.18);
  --bg-main: #fdfdf0;
  --bg-sidebar: #fefce8;
  --bg-card: #ffffff;
  --bg-input: #fef9c3;
  --border: #fef08a;
  --text-main: #3c3000;
  --text-muted: #854d0e;
  --accent: #ea580c;
  --danger: #dc2626;
  --warning: #b45309;
  --shadow: 0 2px 12px rgba(161, 98, 7, 0.1);
}

/* W9. DUSTY ROSE FIELD 🌹 */
[data-theme="dusty-rose-field-dark"] {
  --primary: #f9a8d4;
  --primary-hover: #f472b6;
  --primary-glow: rgba(249, 168, 212, 0.22);
  --bg-main: #140a10;
  --bg-sidebar: #20121c;
  --bg-card: #2c1a28;
  --bg-input: #382234;
  --border: #5a3452;
  --text-main: #fdf4ff;
  --text-muted: #f5d0fe;
  --accent: #f0abfc;
  --danger: #f87171;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(249, 168, 212, 0.2);
}
[data-theme="dusty-rose-field-light"] {
  --primary: #c026d3;
  --primary-hover: #a21caf;
  --primary-glow: rgba(192, 38, 211, 0.18);
  --bg-main: #fdf4ff;
  --bg-sidebar: #fae8ff;
  --bg-card: #ffffff;
  --bg-input: #f5d0fe;
  --border: #f0abfc;
  --text-main: #4a044e;
  --text-muted: #a21caf;
  --accent: #c026d3;
  --danger: #dc2626;
  --warning: #d97706;
  --shadow: 0 2px 12px rgba(192, 38, 211, 0.12);
}

/* W10. TERRACOTTA CLAY 🏺 */
[data-theme="terracotta-clay-dark"] {
  --primary: #f43f5e;
  --primary-hover: #e11d48;
  --primary-glow: rgba(244, 63, 94, 0.25);
  --bg-main: #130408;
  --bg-sidebar: #1f0810;
  --bg-card: #2b0c18;
  --bg-input: #371020;
  --border: #571830;
  --text-main: #fff1f2;
  --text-muted: #fda4af;
  --accent: #fb7185;
  --danger: #ef4444;
  --warning: #fbbf24;
  --shadow: 0 4px 24px rgba(244, 63, 94, 0.25);
}
[data-theme="terracotta-clay-light"] {
  --primary: #e11d48;
  --primary-hover: #be123c;
  --primary-glow: rgba(225, 29, 72, 0.18);
  --bg-main: #fff1f2;
  --bg-sidebar: #ffe4e6;
  --bg-card: #ffffff;
  --bg-input: #fecdd3;
  --border: #fda4af;
  --text-main: #4c0519;
  --text-muted: #be123c;
  --accent: #f43f5e;
  --danger: #b91c1c;
  --warning: #b45309;
  --shadow: 0 2px 12px rgba(225, 29, 72, 0.12);
}

/* ══════════════════════════════════════════════════════════════
   THEME SWITCHER UI COMPONENT
   ══════════════════════════════════════════════════════════════ */
.theme-switcher-wrapper {
  position: relative;
  display: inline-block;
}
.theme-switcher-btn {
  background: var(--bg-card);
  border: 1px solid var(--border);
  color: var(--text-main);
  padding: 8px 12px;
  border-radius: var(--radius);
  cursor: pointer;
  font-size: 13px;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: all 0.2s;
  white-space: nowrap;
}
.theme-switcher-btn:hover {
  border-color: var(--primary);
  box-shadow: 0 0 0 2px var(--primary-glow);
}
.theme-dropdown {
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  z-index: 9999;
  min-width: 240px;
  max-height: 400px;
  overflow-y: auto;
  padding: 8px;
}
.theme-dropdown.open {
  display: block;
}
.theme-dropdown-section {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
  padding: 8px 8px 4px;
  font-weight: 600;
}
.theme-option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 13px;
  color: var(--text-main);
  transition: background 0.15s;
  border: none;
  background: transparent;
  width: 100%;
  text-align: left;
}
.theme-option:hover {
  background: var(--bg-input);
}
.theme-option.active {
  background: var(--primary-glow);
  color: var(--primary);
  font-weight: 600;
}
.theme-option-swatch {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  flex-shrink: 0;
  border: 2px solid rgba(255, 255, 255, 0.15);
}
/* ── PREMIUM LOCK STYLES ── */
.theme-option.theme-locked {
  opacity: 0.5;
  cursor: not-allowed;
  position: relative;
}
.theme-option.theme-locked:hover {
  background: transparent;
  transform: none;
}
.theme-option.theme-locked .theme-option-swatch {
  filter: grayscale(60%);
}
.theme-lock {
  margin-left: auto;
  font-size: 11px;
  opacity: 0.9;
  flex-shrink: 0;
  background: rgba(0, 0, 0, 0.25);
  border-radius: 4px;
  padding: 1px 4px;
}
/* Premium section label gets a crown badge */
.theme-dropdown-section.premium-label::after {
  content: " 👑";
  font-size: 10px;
}
/* Premium unlock banner shown inside dropdown */
.premium-unlock-hint {
  font-size: 10px;
  color: var(--text-muted);
  text-align: center;
  padding: 4px 8px 6px;
  opacity: 0.8;
  display: none;
}
.premium-unlock-hint.visible {
  display: block;
}
.theme-mode-toggle {
  display: flex;
  gap: 4px;
  background: var(--bg-input);
  border-radius: 8px;
  padding: 4px;
  margin: 6px 8px 4px;
}
.theme-mode-btn {
  flex: 1;
  padding: 5px 8px;
  border-radius: 6px;
  border: none;
  background: transparent;
  color: var(--text-muted);
  font-size: 12px;
  cursor: pointer;
  transition: all 0.15s;
}
.theme-mode-btn.active {
  background: var(--bg-card);
  color: var(--primary);
  font-weight: 600;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
}