/* =========================================================
   Sky Thumbnails Appearance System
   Shared light / dark / system styling for web + desktop shell
   ========================================================= */

html {
  accent-color: #1d7df2;

  --theme-bg-base: #eef4ff;
  --theme-bg-top: #fafdff;
  --theme-bg-mid: #f4f8ff;
  --theme-bg-bottom: #edf3ff;

  --theme-surface-shell: linear-gradient(160deg, rgba(255, 255, 255, 0.95), rgba(245, 250, 255, 0.8));
  --theme-surface-card: linear-gradient(145deg, rgba(255, 255, 255, 0.88), rgba(244, 249, 255, 0.68));
  --theme-surface-elevated: linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(242, 248, 255, 0.82));
  --theme-surface-soft: linear-gradient(145deg, rgba(255, 255, 255, 0.8), rgba(246, 250, 255, 0.62));
  --theme-surface-tint: linear-gradient(145deg, rgba(29, 125, 242, 0.14), rgba(255, 255, 255, 0.72));

  --theme-border-soft: rgba(255, 255, 255, 0.72);
  --theme-border: rgba(148, 163, 184, 0.28);
  --theme-border-strong: rgba(29, 125, 242, 0.34);
  --theme-highlight: rgba(255, 255, 255, 0.78);

  --theme-text-strong: rgba(8, 15, 29, 0.92);
  --theme-text: rgba(18, 32, 55, 0.76);
  --theme-text-muted: rgba(18, 32, 55, 0.58);
  --theme-text-soft: rgba(18, 32, 55, 0.44);

  --theme-accent: #1d7df2;
  --theme-accent-strong: #0a63d3;
  --theme-accent-soft: rgba(29, 125, 242, 0.16);

  --theme-shadow-soft: 0 18px 42px rgba(98, 130, 184, 0.2);
  --theme-shadow-md: 0 24px 58px rgba(88, 118, 172, 0.24);
  --theme-shadow-lg: 0 32px 72px rgba(84, 112, 166, 0.28);
  --theme-overlay: linear-gradient(rgba(244, 249, 255, 0.58), rgba(232, 242, 255, 0.74));

  --window-chrome-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.24), rgba(255, 255, 255, 0));
  --window-chrome-bg-soft: transparent;
  --window-chrome-text: rgba(39, 54, 81, 0.72);
  --window-chrome-icon: rgba(39, 54, 81, 0.78);
  --window-chrome-hover: rgba(255, 255, 255, 0.2);
  --window-chrome-active: rgba(29, 125, 242, 0.16);
  --window-chrome-active-icon: #ffffff;
  --window-chrome-close-hover: #e5484d;
  --window-chrome-close-icon: #ffffff;
  --window-chrome-divider: rgba(148, 163, 184, 0.18);
  --window-chrome-focus: rgba(29, 125, 242, 0.38);

  --bg-base: var(--theme-bg-base);
  --bg-gradient-top: var(--theme-bg-top);
  --bg-gradient-mid: var(--theme-bg-mid);
  --bg-gradient-bottom: var(--theme-bg-bottom);
  --glass-surface: rgba(255, 255, 255, 0.72);
  --glass-surface-strong: rgba(255, 255, 255, 0.84);
  --glass-surface-soft: rgba(255, 255, 255, 0.58);
  --glass-border: var(--theme-border-soft);
  --glass-outline: var(--theme-border);
  --glass-highlight: var(--theme-highlight);
  --text-primary: var(--theme-text-strong);
  --text-secondary: var(--theme-text);
  --text-soft: var(--theme-text-soft);
  --accent-blue: var(--theme-accent);
  --accent-blue-strong: var(--theme-accent-strong);
  --accent-blue-soft: var(--theme-accent-soft);
  --shadow-soft: var(--theme-shadow-soft);
  --shadow-md: var(--theme-shadow-md);
  --shadow-lg: var(--theme-shadow-lg);
  --shadow-focus: 0 0 0 3px rgba(29, 125, 242, 0.22);

  --primary: var(--theme-accent);
  --primary-dark: var(--theme-accent-strong);
  --text-dark: var(--theme-text-strong);
  --text-gray: var(--theme-text-muted);
  --bg-light: var(--theme-bg-base);
  --glass: var(--theme-surface-card);
  --glass-bg: var(--theme-surface-soft);
  --shadow-sm: 0 8px 20px rgba(94, 122, 171, 0.1);
  --polish-glass-bg: rgba(255, 255, 255, 0.66);

  --hv2-accent: var(--theme-accent);
  --hv2-accent2: #76a6ff;
  --hv2-text: var(--theme-text-strong);
  --hv2-text-muted: var(--theme-text-muted);
  --hv2-glass-bg: rgba(255, 255, 255, 0.72);
  --hv2-glass-border: rgba(10, 132, 255, 0.14);

  --ads-bg: rgba(255, 255, 255, 0.72);
  --ads-bg-strong: rgba(255, 255, 255, 0.9);
  --ads-border: rgba(148, 163, 184, 0.22);
  --ads-border-hover: rgba(99, 160, 255, 0.35);
  --ads-shadow: 0 8px 32px rgba(30, 64, 175, 0.07), 0 1px 3px rgba(30, 64, 175, 0.04);
  --ads-shadow-lift: 0 16px 48px rgba(30, 64, 175, 0.12), 0 2px 6px rgba(30, 64, 175, 0.06);
  --ads-accent: var(--theme-accent);
  --ads-accent-2: #76a6ff;
  --ads-text: var(--theme-text-strong);
  --ads-muted: var(--theme-text-muted);
  --ads-muted-light: rgba(126, 146, 178, 0.9);
}

html[data-theme='dark'] {
  color-scheme: dark;

  --theme-bg-base: #0a1220;
  --theme-bg-top: #0d1525;
  --theme-bg-mid: #0a1322;
  --theme-bg-bottom: #060b14;

  --theme-surface-shell: linear-gradient(160deg, rgba(24, 36, 56, 0.9), rgba(11, 18, 31, 0.76));
  --theme-surface-card: linear-gradient(145deg, rgba(22, 34, 53, 0.84), rgba(11, 18, 31, 0.68));
  --theme-surface-elevated: linear-gradient(145deg, rgba(28, 43, 66, 0.92), rgba(14, 22, 36, 0.82));
  --theme-surface-soft: linear-gradient(145deg, rgba(22, 34, 53, 0.76), rgba(11, 18, 31, 0.62));
  --theme-surface-tint: linear-gradient(145deg, rgba(74, 168, 255, 0.18), rgba(18, 29, 46, 0.84));

  --theme-border-soft: rgba(128, 160, 210, 0.18);
  --theme-border: rgba(96, 123, 168, 0.32);
  --theme-border-strong: rgba(74, 168, 255, 0.42);
  --theme-highlight: rgba(255, 255, 255, 0.08);

  --theme-text-strong: rgba(239, 245, 255, 0.94);
  --theme-text: rgba(207, 220, 243, 0.82);
  --theme-text-muted: rgba(168, 185, 214, 0.72);
  --theme-text-soft: rgba(134, 154, 189, 0.58);

  --theme-accent: #4aa8ff;
  --theme-accent-strong: #1780ff;
  --theme-accent-soft: rgba(74, 168, 255, 0.2);

  --theme-shadow-soft: 0 18px 46px rgba(2, 8, 20, 0.46);
  --theme-shadow-md: 0 26px 62px rgba(2, 8, 20, 0.56);
  --theme-shadow-lg: 0 36px 84px rgba(2, 8, 20, 0.62);
  --theme-overlay: linear-gradient(rgba(7, 12, 22, 0.56), rgba(6, 10, 18, 0.82));

  --window-chrome-bg: linear-gradient(180deg, rgba(7, 12, 22, 0.44), rgba(7, 12, 22, 0));
  --window-chrome-bg-soft: transparent;
  --window-chrome-text: rgba(214, 225, 242, 0.74);
  --window-chrome-icon: rgba(229, 236, 247, 0.82);
  --window-chrome-hover: rgba(255, 255, 255, 0.08);
  --window-chrome-active: rgba(65, 145, 255, 0.28);
  --window-chrome-divider: rgba(126, 150, 188, 0.14);
  --window-chrome-focus: rgba(74, 168, 255, 0.42);

  --glass-surface: rgba(20, 31, 49, 0.72);
  --glass-surface-strong: rgba(26, 39, 60, 0.82);
  --glass-surface-soft: rgba(14, 23, 37, 0.6);
  --shadow-focus: 0 0 0 3px rgba(74, 168, 255, 0.24);

  --glass: var(--theme-surface-card);
  --glass-bg: linear-gradient(145deg, rgba(22, 34, 53, 0.76), rgba(11, 18, 31, 0.6));
  --shadow-sm: 0 8px 20px rgba(2, 8, 20, 0.28);
  --polish-glass-bg: rgba(18, 28, 45, 0.76);

  --hv2-accent2: #8a9cff;
  --hv2-glass-bg: rgba(18, 28, 45, 0.74);
  --hv2-glass-border: rgba(82, 129, 201, 0.2);

  --ads-bg: rgba(18, 29, 45, 0.72);
  --ads-bg-strong: rgba(23, 35, 53, 0.88);
  --ads-border: rgba(96, 123, 168, 0.3);
  --ads-border-hover: rgba(74, 168, 255, 0.4);
  --ads-shadow: 0 18px 42px rgba(2, 8, 20, 0.34), 0 2px 8px rgba(2, 8, 20, 0.18);
  --ads-shadow-lift: 0 24px 56px rgba(2, 8, 20, 0.42), 0 4px 10px rgba(2, 8, 20, 0.24);
  --ads-accent-2: #8a9cff;
  --ads-muted-light: rgba(134, 154, 189, 0.72);
}

html[data-theme-ready='false'] *,
html[data-theme-ready='false'] *::before,
html[data-theme-ready='false'] *::after {
  transition: none !important;
}

html[data-theme='dark'] body {
  background-color: var(--theme-bg-base);
  color: var(--theme-text);
}

html[data-theme='dark'] body::before {
  background:
    radial-gradient(700px circle at 10% 10%, rgba(53, 138, 255, 0.18), transparent 62%),
    radial-gradient(640px circle at 88% 6%, rgba(81, 138, 255, 0.18), transparent 58%),
    radial-gradient(860px circle at 50% 112%, rgba(0, 162, 255, 0.12), transparent 72%);
}

html[data-theme='dark'] body::after {
  opacity: 0.026;
  background-image:
    linear-gradient(rgba(126, 150, 188, 0.1) 1px, transparent 1px),
    linear-gradient(90deg, rgba(126, 150, 188, 0.08) 1px, transparent 1px),
    radial-gradient(circle at 1px 1px, rgba(255, 255, 255, 0.22) 1px, transparent 1px);
  background-size: 42px 42px, 42px 42px, 3px 3px;
}

html[data-theme='dark'] body.home-polish {
  --polish-glass-bg: rgba(16, 27, 44, 0.78);
  --glass-bg: linear-gradient(145deg, rgba(22, 34, 53, 0.76), rgba(12, 19, 31, 0.6));
  --glass-border: rgba(122, 151, 202, 0.18);
  --polish-card-shadow: 0 20px 44px rgba(2, 8, 20, 0.34);
  --polish-card-shadow-hover: 0 28px 54px rgba(2, 8, 20, 0.42);
  --polish-line: rgba(102, 130, 178, 0.28);
  --polish-text-soft: rgba(170, 186, 212, 0.72);
  background:
    radial-gradient(960px circle at 12% 8%, rgba(35, 101, 214, 0.16), transparent 58%),
    radial-gradient(780px circle at 84% 14%, rgba(46, 134, 255, 0.12), transparent 52%),
    linear-gradient(180deg, #05070c 0%, #04070d 52%, #020307 100%);
}

html[data-theme='dark'] body.home-polish::before {
  background-image:
    linear-gradient(rgba(86, 112, 158, 0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(86, 112, 158, 0.08) 1px, transparent 1px);
  opacity: 0.18;
}

html[data-theme='dark'] body.home-polish::after {
  background:
    radial-gradient(40% 36% at 12% 10%, rgba(40, 129, 255, 0.14), transparent 72%),
    radial-gradient(34% 30% at 85% 15%, rgba(89, 132, 255, 0.12), transparent 72%);
}

html[data-theme='dark'] * {
  scrollbar-color: rgba(96, 123, 168, 0.72) rgba(11, 18, 31, 0.72);
}

html[data-theme='dark'] *::-webkit-scrollbar-track {
  background: rgba(11, 18, 31, 0.72);
}

html[data-theme='dark'] *::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(96, 123, 168, 0.72), rgba(74, 168, 255, 0.72));
  border: 2px solid rgba(11, 18, 31, 0.88);
}

html[data-theme='dark'] ::selection {
  background: rgba(74, 168, 255, 0.28);
  color: #ffffff;
}

html[data-theme='dark'] h1,
html[data-theme='dark'] h2,
html[data-theme='dark'] h3,
html[data-theme='dark'] h4,
html[data-theme='dark'] h5,
html[data-theme='dark'] h6,
html[data-theme='dark'] strong,
html[data-theme='dark'] .logo,
html[data-theme='dark'] .hero-title {
  color: var(--theme-text-strong);
}

html[data-theme='dark'] .muted,
html[data-theme='dark'] .text-muted,
html[data-theme='dark'] .empty-text,
html[data-theme='dark'] .admin-empty,
html[data-theme='dark'] .auth-helper,
html[data-theme='dark'] .faq-answer,
html[data-theme='dark'] .ticket-card-preview,
html[data-theme='dark'] .ticket-card-time,
html[data-theme='dark'] .ticket-card-ticket-id,
html[data-theme='dark'] .admin-ticket-time,
html[data-theme='dark'] .admin-ticket-preview,
html[data-theme='dark'] .admin-user-email,
html[data-theme='dark'] .checkout-product-desc,
html[data-theme='dark'] .checkout-stripe-head p,
html[data-theme='dark'] .checkout-loading-card p,
html[data-theme='dark'] .checkout-message-card p,
html[data-theme='dark'] .checkout-success-card p {
  color: var(--theme-text-muted);
}

html[data-theme='dark'] .glass-nav,
html[data-theme='dark'] .lg-glass-card,
html[data-theme='dark'] .glass-panel,
html[data-theme='dark'] .glass-card,
html[data-theme='dark'] .modal-card,
html[data-theme='dark'] .modal,
html[data-theme='dark'] .auth-modal,
html[data-theme='dark'] .rules-modal,
html[data-theme='dark'] .settings-modal,
html[data-theme='dark'] .ticket-modal,
html[data-theme='dark'] .lightbox-card,
html[data-theme='dark'] .notif-dropdown,
html[data-theme='dark'] .context-menu,
html[data-theme='dark'] .chat-profile-card,
html[data-theme='dark'] .plan-picker-modal,
html[data-theme='dark'] .footer-inner {
  background: var(--theme-surface-shell);
  border-color: var(--theme-border-soft);
  box-shadow: var(--theme-shadow-soft);
}

html[data-theme='dark'] .glass-nav {
  background: linear-gradient(160deg, rgba(18, 29, 47, 0.78), rgba(9, 15, 27, 0.72));
  border-color: rgba(122, 151, 202, 0.18);
  box-shadow: 0 20px 40px rgba(2, 8, 20, 0.34);
}

html[data-theme='dark'] .glass-nav.scrolled,
html[data-theme='dark'] body.home-polish .glass-nav.scrolled,
html[data-theme='dark'] body.nav-match .glass-nav.scrolled {
  background: linear-gradient(160deg, rgba(17, 27, 44, 0.9), rgba(9, 15, 26, 0.8));
  border-color: rgba(126, 151, 198, 0.24);
  box-shadow: 0 18px 34px rgba(2, 8, 20, 0.42);
}

html[data-theme='dark'] .nav-links a,
html[data-theme='dark'] .profile-text .role,
html[data-theme='dark'] .notif-section-label,
html[data-theme='dark'] .chat-profile-section-label,
html[data-theme='dark'] .chat-profile-username {
  color: var(--theme-text-muted);
}

html[data-theme='dark'] .nav-links a:hover,
html[data-theme='dark'] .nav-links a.active,
html[data-theme='dark'] .nav-link.active {
  color: #9ed2ff;
}

html[data-theme='dark'] .nav-cta,
html[data-theme='dark'] .nav-action-btn,
html[data-theme='dark'] body.home-polish .nav-shop-btn,
html[data-theme='dark'] body.nav-match .nav-shop-btn {
  background: linear-gradient(140deg, #1780ff, #4aa8ff);
  border-color: rgba(196, 228, 255, 0.2);
  box-shadow: 0 14px 28px rgba(8, 90, 194, 0.3);
}

html[data-theme='dark'] body.home-polish .nav-dashboard-btn,
html[data-theme='dark'] body.nav-match .nav-dashboard-btn,
html[data-theme='dark'] .nav-notif-btn,
html[data-theme='dark'] .admin-notif-btn,
html[data-theme='dark'] .plan-picker-close,
html[data-theme='dark'] .modal-close-btn,
html[data-theme='dark'] .gallery-arrow,
html[data-theme='dark'] .carousel-btn,
html[data-theme='dark'] .modal-close,
html[data-theme='dark'] .admin-image-viewer-close {
  background: var(--theme-surface-soft);
  border-color: rgba(122, 151, 202, 0.22);
  color: var(--theme-text-strong);
  box-shadow: 0 12px 26px rgba(2, 8, 20, 0.22);
}

html[data-theme='dark'] body.nav-match .nav-signout-btn {
  border: 1px solid rgba(255, 141, 141, 0.18);
  box-shadow: 0 14px 28px rgba(144, 26, 45, 0.26);
}

html[data-theme='dark'] .nav-notif-btn:hover,
html[data-theme='dark'] .admin-notif-btn:hover,
html[data-theme='dark'] .modal-close-btn:hover,
html[data-theme='dark'] .gallery-arrow:hover,
html[data-theme='dark'] .carousel-btn:hover,
html[data-theme='dark'] .plan-picker-close:hover,
html[data-theme='dark'] .modal-close:hover,
html[data-theme='dark'] .admin-image-viewer-close:hover,
html[data-theme='dark'] body.home-polish .nav-dashboard-btn:hover,
html[data-theme='dark'] body.nav-match .nav-dashboard-btn:hover {
  background: var(--theme-surface-elevated);
  border-color: var(--theme-border-strong);
  color: #ffffff;
}

html[data-theme='dark'] .btn-secondary,
html[data-theme='dark'] .btn-outline,
html[data-theme='dark'] .lg-btn-glass,
html[data-theme='dark'] .glass-button.secondary,
html[data-theme='dark'] .glass-button.ghost,
html[data-theme='dark'] .lg-btn-danger,
html[data-theme='dark'] .btn-danger {
  background: var(--theme-surface-soft);
  border-color: rgba(122, 151, 202, 0.22);
  color: var(--theme-text-strong);
  box-shadow: 0 12px 24px rgba(2, 8, 20, 0.18);
}

html[data-theme='dark'] .btn-outline {
  background: rgba(74, 168, 255, 0.08);
  color: #98ceff;
}

html[data-theme='dark'] .lg-input,
html[data-theme='dark'] .glass-input,
html[data-theme='dark'] .glass-textarea,
html[data-theme='dark'] input[type='text'],
html[data-theme='dark'] input[type='email'],
html[data-theme='dark'] input[type='search'],
html[data-theme='dark'] input[type='password'],
html[data-theme='dark'] input[type='number'],
html[data-theme='dark'] input[type='url'],
html[data-theme='dark'] select,
html[data-theme='dark'] textarea {
  background: linear-gradient(145deg, rgba(11, 18, 31, 0.84), rgba(22, 34, 53, 0.72));
  border-color: rgba(96, 123, 168, 0.34);
  color: var(--theme-text-strong);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

html[data-theme='dark'] input::placeholder,
html[data-theme='dark'] textarea::placeholder {
  color: var(--theme-text-soft);
}

html[data-theme='dark'] .glass-pill,
html[data-theme='dark'] .ticket-filter-pill,
html[data-theme='dark'] .admin-ticket-filter-pills button,
html[data-theme='dark'] .filter-btn,
html[data-theme='dark'] .pill-option,
html[data-theme='dark'] .ticket-section-pill,
html[data-theme='dark'] .checkout-pane-pill,
html[data-theme='dark'] .hero-trust-row span {
  background: rgba(18, 29, 45, 0.74);
  border-color: rgba(96, 123, 168, 0.3);
  color: var(--theme-text-muted);
}

html[data-theme='dark'] .glass-pill.active,
html[data-theme='dark'] .ticket-filter-pill.active,
html[data-theme='dark'] .admin-ticket-filter-pills button.active,
html[data-theme='dark'] .filter-btn.active,
html[data-theme='dark'] .pill-option.active,
html[data-theme='dark'] .ticket-section-pill.active {
  background: linear-gradient(145deg, rgba(74, 168, 255, 0.24), rgba(18, 29, 45, 0.92));
  border-color: rgba(74, 168, 255, 0.42);
  color: #b6deff;
}

html[data-theme='dark'] .glass-list-item,
html[data-theme='dark'] .ticket-sidebar-card,
html[data-theme='dark'] .ticket-list-item,
html[data-theme='dark'] .admin-ticket-row,
html[data-theme='dark'] .admin-users-row,
html[data-theme='dark'] .admin-chat-member-row,
html[data-theme='dark'] .dash-ticket-item,
html[data-theme='dark'] .notif-item {
  background: var(--theme-surface-soft);
  border-color: rgba(96, 123, 168, 0.3);
}

html[data-theme='dark'] .notif-dropdown,
html[data-theme='dark'] .context-menu,
html[data-theme='dark'] [role='menu'],
html[data-theme='dark'] .tooltip {
  background: linear-gradient(160deg, rgba(23, 35, 54, 0.94), rgba(10, 16, 28, 0.84));
  border-color: rgba(96, 123, 168, 0.28);
}

html[data-theme='dark'] .notif-item:hover,
html[data-theme='dark'] .context-menu-item:hover,
html[data-theme='dark'] .admin-notif-item:hover {
  background: rgba(74, 168, 255, 0.12);
  border-color: rgba(74, 168, 255, 0.36);
}

html[data-theme='dark'] .notif-title,
html[data-theme='dark'] .notif-text .notif-line,
html[data-theme='dark'] .notif-mark-all,
html[data-theme='dark'] .admin-notif-title,
html[data-theme='dark'] .admin-notif-item-title {
  color: var(--theme-text-strong);
}

html[data-theme='dark'] .notif-text .notif-time,
html[data-theme='dark'] .notif-empty,
html[data-theme='dark'] .admin-notif-subtitle,
html[data-theme='dark'] .admin-notif-item-body,
html[data-theme='dark'] .admin-notif-item-time,
html[data-theme='dark'] .admin-notif-mark-all {
  color: var(--theme-text-muted);
}

html[data-theme='dark'] .modal-overlay,
html[data-theme='dark'] .glass-backdrop,
html[data-theme='dark'] .plan-picker-overlay,
html[data-theme='dark'] .plan-modal-backdrop,
html[data-theme='dark'] .checkout-view-backdrop {
  background: var(--theme-overlay);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

html[data-theme='dark'] .lg-toast,
html[data-theme='dark'] .toast {
  background: linear-gradient(160deg, rgba(25, 39, 60, 0.96), rgba(14, 22, 36, 0.88));
  border-color: rgba(96, 123, 168, 0.28);
  color: var(--theme-text-strong);
}

html[data-theme='dark'] .chat-profile-card {
  border: 1px solid rgba(122, 151, 202, 0.18);
}

html[data-theme='dark'] .chat-profile-banner {
  background: linear-gradient(135deg, rgba(23, 120, 255, 0.5), rgba(17, 32, 52, 0.24));
}

html[data-theme='dark'] .chat-profile-body {
  color: var(--theme-text);
}

html[data-theme='dark'] .chat-profile-avatar {
  box-shadow: 0 0 0 4px rgba(9, 15, 27, 0.8);
}

html[data-theme='dark'] .plan-picker-overlay {
  background: rgba(5, 10, 18, 0.72);
}

html[data-theme='dark'] .ppo-card {
  background: linear-gradient(145deg, rgba(18, 29, 45, 0.76), rgba(11, 18, 31, 0.66));
  border-color: rgba(96, 123, 168, 0.32);
}

html[data-theme='dark'] .ppo-card:hover {
  background: linear-gradient(145deg, rgba(24, 38, 58, 0.88), rgba(12, 20, 33, 0.76));
}

html[data-theme='dark'] .ppo-label,
html[data-theme='dark'] .plan-picker-title {
  color: var(--theme-text-strong);
}

html[data-theme='dark'] .ppo-desc,
html[data-theme='dark'] .plan-picker-subtitle {
  color: var(--theme-text-muted);
}

html[data-theme='dark'] .ppo-qty {
  background: rgba(74, 168, 255, 0.12);
  color: #9ed2ff;
}

html[data-theme='dark'] body.home-polish .hero-trust-row span,
html[data-theme='dark'] .svc-card,
html[data-theme='dark'] .price-glass-card,
html[data-theme='dark'] .stat-glass-card,
html[data-theme='dark'] .review-glass-card,
html[data-theme='dark'] .team-tilt-card,
html[data-theme='dark'] .cta-glass-panel,
html[data-theme='dark'] .hero-stat,
html[data-theme='dark'] .hero-stage-card,
html[data-theme='dark'] .hero-mini-card {
  background: var(--theme-surface-card);
  border-color: rgba(96, 123, 168, 0.24);
  box-shadow: 0 16px 36px rgba(2, 8, 20, 0.28);
}

html[data-theme='dark'] .hero-stage-card::after,
html[data-theme='dark'] .hero-mini-card::after {
  background: linear-gradient(180deg, transparent, rgba(74, 168, 255, 0.12));
}

html[data-theme='dark'] .ps-dot,
html[data-theme='dark'] .carousel-btn {
  background: rgba(18, 29, 45, 0.84);
  border-color: rgba(74, 168, 255, 0.24);
}

html[data-theme='dark'] .rgc-quote,
html[data-theme='dark'] .price-glass-card ul li,
html[data-theme='dark'] .team-tilt-card .social-link,
html[data-theme='dark'] .ps-desc {
  color: var(--theme-text-muted);
}

html[data-theme='dark'] .svc-card:hover,
html[data-theme='dark'] .price-glass-card:hover,
html[data-theme='dark'] .stat-glass-card:hover,
html[data-theme='dark'] .team-tilt-card:hover {
  box-shadow: 0 24px 56px rgba(2, 8, 20, 0.4);
}

html[data-theme='dark'] .team-tilt-card .ttc-shine {
  background: linear-gradient(108deg, transparent 40%, rgba(255, 255, 255, 0.12) 50%, transparent 60%);
}

html[data-theme='dark'] .hero-float-card {
  box-shadow: 0 22px 60px rgba(2, 8, 20, 0.42), 0 0 0 1px rgba(122, 151, 202, 0.16);
}

html[data-theme='dark'] .shop-page {
  --shop-accent: #4aa8ff;
  --shop-accent-strong: #1780ff;
  --shop-ink: var(--theme-text-strong);
  --shop-muted: var(--theme-text-muted);
  --shop-soft: var(--theme-text-soft);
  --shop-glass: linear-gradient(145deg, rgba(22, 34, 53, 0.84), rgba(12, 19, 31, 0.68));
  --shop-glass-strong: linear-gradient(145deg, rgba(27, 41, 62, 0.92), rgba(12, 19, 31, 0.78));
  --shop-border: rgba(122, 151, 202, 0.18);
  --shop-outline: rgba(96, 123, 168, 0.32);
  --shop-shadow: 0 20px 48px rgba(2, 8, 20, 0.32);
  --shop-shadow-lg: 0 30px 72px rgba(2, 8, 20, 0.42);
  background:
    radial-gradient(880px circle at 10% 8%, rgba(43, 115, 234, 0.16), transparent 58%),
    radial-gradient(760px circle at 88% 12%, rgba(74, 168, 255, 0.12), transparent 52%),
    linear-gradient(180deg, #06080d 0%, #05070c 48%, #020307 100%);
}

html[data-theme='dark'] .shop-page .sky-bg-layer.layer-1 {
  background: radial-gradient(circle at center, rgba(59, 130, 246, 0.12), transparent 74%);
  opacity: 0.72;
}

html[data-theme='dark'] .shop-page .sky-bg-layer.layer-2,
html[data-theme='dark'] .shop-page .sky-bg-layer.aurora-bg {
  background:
    radial-gradient(circle at 18% 16%, rgba(59, 130, 246, 0.15), transparent 30%),
    radial-gradient(circle at 82% 18%, rgba(14, 165, 233, 0.12), transparent 28%),
    radial-gradient(circle at 50% 100%, rgba(37, 99, 235, 0.1), transparent 32%);
  opacity: 0.82;
}

html[data-theme='dark'] .shop-page .floating-particles {
  opacity: 0.18;
}

html[data-theme='dark'] .shop-page .shop-hero::before,
html[data-theme='dark'] .shop-page .shop-block::before,
html[data-theme='dark'] .shop-page .plan-card::before,
html[data-theme='dark'] .shop-page .addon-card::before,
html[data-theme='dark'] .shop-page .plan-modal-card::before {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.1), transparent 24%),
    radial-gradient(circle at top right, rgba(74, 168, 255, 0.16), transparent 36%);
}

html[data-theme='dark'] .shop-page .hero-stat,
html[data-theme='dark'] .shop-page .hero-stage-card,
html[data-theme='dark'] .shop-page .hero-mini-card,
html[data-theme='dark'] .shop-page .plan-card,
html[data-theme='dark'] .shop-page .addon-card,
html[data-theme='dark'] .shop-page .checkout-visual-card,
html[data-theme='dark'] .shop-page .checkout-highlight-chip,
html[data-theme='dark'] .shop-page .checkout-list-card {
  background: var(--theme-surface-elevated);
  border-color: rgba(122, 151, 202, 0.18);
  box-shadow: 0 16px 38px rgba(2, 8, 20, 0.3);
}

html[data-theme='dark'] .shop-page .modal-thumb,
html[data-theme='dark'] .shop-page .modal-main-image-wrap,
html[data-theme='dark'] .shop-page .embedded-checkout-host {
  background: rgba(11, 18, 31, 0.78);
  border-color: rgba(122, 151, 202, 0.18);
}

html[data-theme='dark'] .shop-page .modal-details-panel,
html[data-theme='dark'] .shop-page .modal-gallery-panel,
html[data-theme='dark'] .shop-page .checkout-summary-panel,
html[data-theme='dark'] .shop-page .checkout-stripe-panel,
html[data-theme='dark'] .shop-page .checkout-loading-state,
html[data-theme='dark'] .shop-page .checkout-message-card,
html[data-theme='dark'] .shop-page .checkout-success-card,
html[data-theme='dark'] .shop-page .checkout-embed-shell,
html[data-theme='dark'] .shop-page .checkout-view-shell,
html[data-theme='dark'] .shop-page .plan-modal-card {
  background: var(--theme-surface-shell);
  border-color: rgba(122, 151, 202, 0.18);
  box-shadow: var(--theme-shadow-md);
}

html[data-theme='dark'] .shop-page .checkout-summary-panel {
  border-right-color: rgba(122, 151, 202, 0.16);
  background:
    radial-gradient(circle at top left, rgba(74, 168, 255, 0.18), transparent 34%),
    linear-gradient(180deg, rgba(21, 33, 52, 0.7), rgba(11, 18, 31, 0.38));
}

html[data-theme='dark'] .shop-page .checkout-stripe-panel {
  background:
    linear-gradient(180deg, rgba(18, 29, 45, 0.78), rgba(11, 18, 31, 0.42)),
    radial-gradient(circle at top right, rgba(76, 192, 255, 0.12), transparent 30%);
}

html[data-theme='dark'] .shop-page .checkout-product-image,
html[data-theme='dark'] .shop-page .modal-main-image {
  background: rgba(6, 10, 18, 0.68);
}

html[data-theme='dark'] .shop-page .checkout-pane-pill,
html[data-theme='dark'] .shop-page .checkout-visual-type {
  background: rgba(18, 29, 45, 0.72);
  border-color: rgba(122, 151, 202, 0.2);
  color: var(--theme-text-strong);
}

html[data-theme='dark'] .shop-page .checkout-loading-lines span {
  background: linear-gradient(90deg, rgba(74, 168, 255, 0.1), rgba(74, 168, 255, 0.24), rgba(74, 168, 255, 0.1));
}

html[data-theme='dark'] body[data-page='dashboard'] .dashboard-sidebar,
html[data-theme='dark'] body[data-page='dashboard'] .dashboard-topbar,
html[data-theme='dark'] body[data-page='dashboard'] .dash-card,
html[data-theme='dark'] body[data-page='dashboard'] .welcome-banner,
html[data-theme='dark'] body[data-page='dashboard'] .ticket-sidebar,
html[data-theme='dark'] body[data-page='dashboard'] .ticket-main,
html[data-theme='dark'] body[data-page='dashboard'] .settings-v2-wrap,
html[data-theme='dark'] body[data-page='dashboard'] .gallery-viewer-card,
html[data-theme='dark'] body[data-page='dashboard'] .context-menu {
  background: var(--theme-surface-shell);
  border-color: rgba(122, 151, 202, 0.18);
  box-shadow: var(--theme-shadow-soft);
}

html[data-theme='dark'] body[data-page='dashboard'] .sidebar-nav .nav-item {
  color: var(--theme-text-muted);
}

html[data-theme='dark'] body[data-page='dashboard'] .sidebar-nav .nav-item:hover {
  color: var(--theme-text-strong);
  border-color: rgba(74, 168, 255, 0.24);
  background: rgba(74, 168, 255, 0.1);
}

html[data-theme='dark'] body[data-page='dashboard'] .sidebar-nav .nav-item.active {
  color: #ffffff;
  border-color: rgba(74, 168, 255, 0.38);
  background: linear-gradient(145deg, rgba(74, 168, 255, 0.28), rgba(18, 29, 45, 0.92));
  box-shadow: 0 14px 28px rgba(8, 90, 194, 0.26);
}

html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-sidebar,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-sidebar,
html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets #ticket-chat-panel,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support #support-chat-panel,
html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-chat-header,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-chat-header,
html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-chat-compose,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-chat-compose,
html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-chat-form,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-chat-form {
  background: var(--theme-surface-card);
  border-color: rgba(96, 123, 168, 0.28);
}

html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-filter-pill,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-filter-pill,
html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-sidebar-card,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-sidebar-card,
html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-msg-inner,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-msg-inner,
html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-msg-file,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-msg-file,
html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-card-avatar,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-msg-avatar img,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-msg-avatar-fallback {
  background: var(--theme-surface-soft);
  border-color: rgba(96, 123, 168, 0.3);
  color: var(--theme-text-strong);
}

html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-card-name,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-msg-name,
html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets #ticket-chat-title,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support #support-chat-title {
  color: var(--theme-text-strong);
}

html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-msg-text,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-msg-text,
html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-msg a,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-msg a {
  color: var(--theme-text-strong);
}

html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-msg--me .ticket-msg-inner,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-msg--me .ticket-msg-inner {
  background: linear-gradient(145deg, rgba(74, 168, 255, 0.22), rgba(20, 41, 72, 0.88));
  border-color: rgba(74, 168, 255, 0.34);
}

html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-reply-preview,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-reply-preview,
html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .msg-reply-context,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .msg-reply-context {
  background: linear-gradient(145deg, rgba(74, 168, 255, 0.16), rgba(18, 29, 45, 0.88));
  border-color: rgba(74, 168, 255, 0.3);
  color: #b6deff;
}

html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-reply-cancel,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-reply-cancel,
html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-msg-inner .msg-actions .msg-reply-btn,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-msg-inner .msg-actions .msg-reply-btn {
  background: rgba(11, 18, 31, 0.9);
  border-color: rgba(96, 123, 168, 0.32);
  color: var(--theme-text-strong);
}

html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-closed-overlay {
  background: rgba(74, 15, 24, 0.72);
  border-bottom-color: rgba(244, 114, 182, 0.2);
}

html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-closed-overlay p {
  color: #ff9aaa;
}

html[data-theme='dark'] body[data-page='dashboard'] .settings-banner-preview,
html[data-theme='dark'] body[data-page='dashboard'] .settings-avatar-preview {
  background: linear-gradient(180deg, rgba(14, 24, 38, 0.92), rgba(18, 29, 45, 0.72));
  border-color: rgba(74, 168, 255, 0.32);
}

html[data-theme='dark'] body[data-page='dashboard'] .settings-notification-card,
html[data-theme='dark'] body[data-page='dashboard'] .settings-appearance-card {
  background:
    radial-gradient(circle at top right, rgba(74, 168, 255, 0.16), transparent 38%),
    linear-gradient(135deg, rgba(23, 35, 54, 0.88), rgba(14, 22, 36, 0.76));
  border-color: rgba(96, 123, 168, 0.24);
  box-shadow: 0 24px 48px rgba(2, 8, 20, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

html[data-theme='dark'] body[data-page='dashboard'] .settings-toggle-row,
html[data-theme='dark'] body[data-page='dashboard'] .settings-appearance-option {
  background: rgba(18, 29, 45, 0.72);
  border-color: rgba(96, 123, 168, 0.22);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

html[data-theme='dark'] body[data-page='dashboard'] .settings-toggle-title,
html[data-theme='dark'] body[data-page='dashboard'] .settings-appearance-option__title {
  color: var(--theme-text-strong);
}

html[data-theme='dark'] body[data-page='dashboard'] .settings-toggle-sub,
html[data-theme='dark'] body[data-page='dashboard'] .settings-appearance-option__copy,
html[data-theme='dark'] body[data-page='dashboard'] .settings-appearance-card__subtitle {
  color: var(--theme-text-muted);
}

html[data-theme='dark'] body[data-page='dashboard'] .settings-notification-pill,
html[data-theme='dark'] body[data-page='dashboard'] .settings-appearance-pill {
  background: rgba(18, 29, 45, 0.74);
  border-color: rgba(74, 168, 255, 0.22);
  color: #9ed2ff;
}

html[data-theme='dark'] {
  --theme-surface-panel: linear-gradient(160deg, rgba(18, 28, 43, 0.94), rgba(8, 14, 24, 0.88));
  --theme-surface-panel-soft: linear-gradient(160deg, rgba(20, 31, 48, 0.86), rgba(10, 17, 28, 0.78));
}

html[data-theme='dark'] .shop-page .block-side-note,
html[data-theme='dark'] .shop-page .plan-cover,
html[data-theme='dark'] .shop-page .modal-feature-group {
  border-color: rgba(96, 123, 168, 0.22);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

html[data-theme='dark'] .shop-page .block-side-note {
  background:
    radial-gradient(circle at top right, rgba(74, 168, 255, 0.12), transparent 36%),
    linear-gradient(145deg, rgba(20, 31, 49, 0.88), rgba(11, 18, 31, 0.76));
}

html[data-theme='dark'] .shop-page .block-side-note span,
html[data-theme='dark'] .shop-page .modal-feature-group h4 {
  color: var(--theme-text-muted);
}

html[data-theme='dark'] .shop-page .block-side-note strong {
  color: var(--theme-text-strong);
}

html[data-theme='dark'] .shop-page .plan-cover {
  background:
    radial-gradient(circle at top right, rgba(74, 168, 255, 0.12), transparent 34%),
    linear-gradient(160deg, rgba(18, 29, 45, 0.82), rgba(10, 17, 28, 0.66));
  border-bottom-color: rgba(96, 123, 168, 0.22);
}

html[data-theme='dark'] .shop-page .plan-body,
html[data-theme='dark'] .shop-page .addon-body {
  background:
    linear-gradient(180deg, transparent 56%, rgba(74, 168, 255, 0.04));
}

html[data-theme='dark'] .shop-page .plan-btn,
html[data-theme='dark'] .shop-page .addon-btn {
  background: var(--theme-surface-panel-soft);
  border-color: rgba(96, 123, 168, 0.26);
  color: var(--theme-text-strong);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

html[data-theme='dark'] .shop-page .plan-btn:hover,
html[data-theme='dark'] .shop-page .addon-btn:hover {
  border-color: rgba(74, 168, 255, 0.34);
  box-shadow: 0 12px 26px rgba(2, 8, 20, 0.22);
}

html[data-theme='dark'] .shop-page .modal-feature-group {
  background:
    radial-gradient(circle at top right, rgba(74, 168, 255, 0.1), transparent 40%),
    linear-gradient(145deg, rgba(20, 31, 49, 0.9), rgba(11, 18, 31, 0.78));
}

html[data-theme='dark'] .shop-page .modal-feature-list li {
  color: var(--theme-text);
}

html[data-theme='dark'] body[data-page='dashboard'] {
  background:
    radial-gradient(960px circle at 11% 9%, rgba(35, 101, 214, 0.16), transparent 58%),
    radial-gradient(780px circle at 86% 13%, rgba(56, 189, 248, 0.12), transparent 52%),
    linear-gradient(180deg, #05070c 0%, #04070c 48%, #020307 100%);
}

html[data-theme='dark'] body[data-page='dashboard'] .sky-bg-layer.layer-1 {
  background: radial-gradient(circle at center, rgba(37, 99, 235, 0.12), transparent 72%);
  opacity: 0.74;
}

html[data-theme='dark'] body[data-page='dashboard'] .sky-bg-layer.layer-2,
html[data-theme='dark'] body[data-page='dashboard'] .sky-bg-layer.aurora-bg {
  background:
    radial-gradient(circle at 18% 14%, rgba(37, 99, 235, 0.14), transparent 30%),
    radial-gradient(circle at 80% 18%, rgba(14, 165, 233, 0.12), transparent 28%),
    radial-gradient(circle at 50% 100%, rgba(29, 78, 216, 0.1), transparent 34%);
  opacity: 0.82;
}

html[data-theme='dark'] body[data-page='dashboard'] .floating-particles {
  opacity: 0.18;
}

html[data-theme='dark'] body[data-page='dashboard'] .dashboard-container,
html[data-theme='dark'] body[data-page='dashboard'] .dashboard-main,
html[data-theme='dark'] body[data-page='dashboard'] .dashboard-content {
  background: transparent;
}

html[data-theme='dark'] body[data-page='dashboard'] .user-profile-dropdown:hover {
  background: rgba(74, 168, 255, 0.08);
}

html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-layout,
html[data-theme='dark'] body[data-page='dashboard'] .support-ticket-layout {
  background: var(--theme-surface-panel);
  border: 1px solid rgba(96, 123, 168, 0.22);
  box-shadow: var(--theme-shadow-md);
}

html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-sidebar,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-sidebar,
html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-main,
html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets #ticket-chat-panel,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support #support-chat-panel,
html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .addon-right-sidebar {
  background: var(--theme-surface-panel-soft);
}

html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .addon-right-sidebar {
  border-left: 1px solid rgba(96, 123, 168, 0.22);
}

html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-sidebar-top,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-sidebar-top,
html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-filter-pills,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-filter-pills,
html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-chat-header,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-chat-header,
html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-chat-compose,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-chat-compose {
  background: linear-gradient(180deg, rgba(18, 29, 45, 0.94), rgba(11, 18, 31, 0.82));
  border-color: rgba(96, 123, 168, 0.22);
}

html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-sidebar-scroll,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-sidebar-scroll {
  background: linear-gradient(180deg, rgba(13, 21, 34, 0.42), rgba(8, 14, 24, 0.12));
}

html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-sidebar-card,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-sidebar-card {
  background: linear-gradient(150deg, rgba(16, 26, 41, 0.94), rgba(10, 17, 28, 0.84));
  border-color: rgba(96, 123, 168, 0.28);
  box-shadow: 0 12px 28px rgba(2, 8, 20, 0.22);
}

html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-card-avatar,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-card-avatar {
  background: linear-gradient(140deg, rgba(24, 37, 57, 0.94), rgba(10, 17, 28, 0.88));
  border-color: rgba(96, 123, 168, 0.28);
}

html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-card-avatar i,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-card-avatar i {
  color: var(--theme-text-muted);
}

html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-card-status.status-open,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-card-status.status-open,
html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-status-badge.status-open,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-status-badge.status-open {
  background: rgba(34, 197, 94, 0.18);
  color: #7ff0ad;
  border-color: rgba(52, 211, 153, 0.28);
}

html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-card-status.status-pending,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-card-status.status-pending,
html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-status-badge.status-pending,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-status-badge.status-pending {
  background: rgba(245, 158, 11, 0.18);
  color: #ffcf7d;
  border-color: rgba(251, 191, 36, 0.28);
}

html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-card-status.status-closed,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-card-status.status-closed,
html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-status-badge.status-closed,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-status-badge.status-closed {
  background: rgba(96, 123, 168, 0.22);
  color: #c5d4eb;
  border-color: rgba(96, 123, 168, 0.28);
}

html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets .ticket-chat-form,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support .ticket-chat-form {
  background: linear-gradient(145deg, rgba(12, 19, 31, 0.88), rgba(20, 31, 49, 0.76));
  border-color: rgba(96, 123, 168, 0.3);
}

html[data-theme='dark'] body[data-page='dashboard'] #tab-tickets #ticket-chat-input,
html[data-theme='dark'] body[data-page='dashboard'] #tab-support #support-chat-input {
  background: rgba(8, 14, 24, 0.94);
  border-color: rgba(96, 123, 168, 0.32);
  color: var(--theme-text-strong);
}

html[data-theme='dark'] body[data-page='dashboard'] .settings-switch-slider {
  background: rgba(96, 123, 168, 0.32);
  box-shadow: inset 0 0 0 1px rgba(96, 123, 168, 0.24);
}

html[data-theme='dark'] body[data-page='dashboard'] .settings-switch-slider::before {
  background: linear-gradient(180deg, rgba(244, 247, 252, 0.96), rgba(194, 207, 230, 0.94));
}

html[data-theme='dark'] body[data-page='admin'] .admin-sidebar,
html[data-theme='dark'] body[data-page='admin'] .admin-content,
html[data-theme='dark'] body[data-page='admin'] .admin-sidebar-profile,
html[data-theme='dark'] body[data-page='admin'] .admin-panel .lg-glass-card,
html[data-theme='dark'] body[data-page='admin'] .admin-users-panel,
html[data-theme='dark'] body[data-page='admin'] .admin-chat-viewer,
html[data-theme='dark'] body[data-page='admin'] .admin-internal-chat,
html[data-theme='dark'] body[data-page='admin'] .finalize-modal-card,
html[data-theme='dark'] body[data-page='admin'] .block-modal,
html[data-theme='dark'] body[data-page='admin'] .admin-ticket-inbox-toolbar,
html[data-theme='dark'] body[data-page='admin'] .admin-chat-subheader,
html[data-theme='dark'] body[data-page='admin'] .admin-internal-chat-header,
html[data-theme='dark'] body[data-page='admin'] .admin-chat-input-area {
  background: var(--theme-surface-shell);
  border-color: rgba(122, 151, 202, 0.18);
  box-shadow: var(--theme-shadow-soft);
}

/* Per-message name+time row: must NOT get a panel background */
html[data-theme='dark'] body[data-page='admin'] .admin-chat-header {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}

/* ── Admin internal chat: message list panel ──────────────────────────
   #admin-chat-messages has its own opaque light gradient in base CSS,
   so it needs an explicit dark override (the outer .admin-internal-chat
   rule above is not enough).                                          */
html[data-theme='dark'] body[data-page='admin'] #admin-chat-messages {
  background: #06101c;
  box-shadow: inset 0 0 0 1px rgba(96, 123, 168, 0.14);
}

/* ── Staff members sidebar ──────────────────────────────────────────── */
html[data-theme='dark'] body[data-page='admin'] #admin-chat-members,
html[data-theme='dark'] body[data-page='admin'] .admin-chat-members {
  background: var(--theme-surface-shell);
  border-color: rgba(122, 151, 202, 0.18);
  box-shadow: var(--theme-shadow-soft);
}

/* ── Internal admin chat message bubbles ────────────────────────────── */
html[data-theme='dark'] body[data-page='admin'] .admin-room-msg-inner {
  background: linear-gradient(160deg, rgba(18, 29, 45, 0.94), rgba(10, 17, 28, 0.88));
  border-color: rgba(96, 123, 168, 0.28);
  box-shadow: 0 10px 20px rgba(2, 8, 20, 0.24);
}

html[data-theme='dark'] body[data-page='admin'] .admin-room-msg--me .admin-room-msg-inner {
  background: linear-gradient(160deg, rgba(30, 58, 92, 0.92), rgba(18, 38, 64, 0.84));
  border-color: rgba(74, 168, 255, 0.34);
}

html[data-theme='dark'] body[data-page='admin'] .admin-room-msg-name,
html[data-theme='dark'] body[data-page='admin'] .admin-room-msg-text {
  color: var(--theme-text-strong);
}

html[data-theme='dark'] body[data-page='admin'] .admin-room-msg-time {
  color: var(--theme-text-muted);
}

html[data-theme='dark'] body[data-page='admin'] .admin-room-msg-inner .msg-actions .msg-reply-btn {
  background: rgba(11, 18, 31, 0.92);
  border-color: rgba(96, 123, 168, 0.32);
  color: var(--theme-text-strong);
}

/* ── File attachment card in chat ───────────────────────────────────── */
html[data-theme='dark'] body[data-page='admin'] .admin-file-card {
  background: linear-gradient(160deg, rgba(18, 29, 45, 0.9), rgba(10, 17, 28, 0.8));
  border-color: rgba(96, 123, 168, 0.28);
}

html[data-theme='dark'] body[data-page='admin'] .admin-file-name,
html[data-theme='dark'] body[data-page='admin'] .admin-file-icon {
  color: var(--theme-text-strong);
}

html[data-theme='dark'] body[data-page='admin'] .admin-file-sub {
  color: var(--theme-text-muted);
}

html[data-theme='dark'] body[data-page='admin'] {
  background:
    radial-gradient(900px circle at 12% 10%, rgba(41, 122, 255, 0.18), transparent 58%),
    radial-gradient(720px circle at 88% 8%, rgba(74, 168, 255, 0.16), transparent 54%),
    linear-gradient(180deg, #0b1220 0%, #09101c 45%, #050a12 100%);
  color: var(--theme-text);
}

html[data-theme='dark'] body[data-page='admin'] .sky-bg-layer.layer-1 {
  background: radial-gradient(circle at center, rgba(56, 189, 248, 0.12), transparent 72%);
  opacity: 0.75;
}

html[data-theme='dark'] body[data-page='admin'] .sky-bg-layer.layer-2,
html[data-theme='dark'] body[data-page='admin'] .sky-bg-layer.aurora-bg {
  background:
    radial-gradient(circle at 20% 20%, rgba(59, 130, 246, 0.16), transparent 32%),
    radial-gradient(circle at 78% 16%, rgba(96, 165, 250, 0.14), transparent 30%),
    radial-gradient(circle at 50% 100%, rgba(14, 165, 233, 0.12), transparent 34%);
  opacity: 0.85;
}

html[data-theme='dark'] body[data-page='admin'] .floating-particles {
  opacity: 0.2;
}

html[data-theme='dark'] body[data-page='admin'] .admin-tab {
  color: var(--theme-text-muted);
}

html[data-theme='dark'] body[data-page='admin'] .admin-tab:hover {
  background: rgba(74, 168, 255, 0.1);
  color: var(--theme-text-strong);
  border-color: rgba(74, 168, 255, 0.22);
}

html[data-theme='dark'] body[data-page='admin'] .admin-tab.active {
  background: linear-gradient(145deg, rgba(74, 168, 255, 0.24), rgba(18, 29, 45, 0.92));
  border-color: rgba(74, 168, 255, 0.34);
  color: #ffffff;
  box-shadow: 0 12px 24px rgba(8, 90, 194, 0.26);
}

html[data-theme='dark'] body[data-page='admin'] .admin-ticket-search,
html[data-theme='dark'] body[data-page='admin'] .admin-users-search,
html[data-theme='dark'] body[data-page='admin'] .admin-ticket-filter-pills button,
html[data-theme='dark'] body[data-page='admin'] .admin-ticket-row,
html[data-theme='dark'] body[data-page='admin'] .admin-ticket-card,
html[data-theme='dark'] body[data-page='admin'] .admin-ticket-card-closed,
html[data-theme='dark'] body[data-page='admin'] .admin-users-row,
html[data-theme='dark'] body[data-page='admin'] .admin-chat-member-row,
html[data-theme='dark'] body[data-page='admin'] .admin-user-row,
html[data-theme='dark'] body[data-page='admin'] .admin-users-empty,
html[data-theme='dark'] body[data-page='admin'] .admin-empty-state,
html[data-theme='dark'] body[data-page='admin'] .admin-chat-access-state,
html[data-theme='dark'] body[data-page='admin'] .admin-attachment-tray,
html[data-theme='dark'] body[data-page='admin'] .admin-file-chip,
html[data-theme='dark'] body[data-page='admin'] .admin-image-chip,
html[data-theme='dark'] body[data-page='admin'] .ticket-msg-inner,
html[data-theme='dark'] body[data-page='admin'] .admin-chat-bubble,
html[data-theme='dark'] body[data-page='admin'] .finalize-preview-wrap,
html[data-theme='dark'] body[data-page='admin'] .finalize-image-option,
html[data-theme='dark'] body[data-page='admin'] .news-image-preview-wrap {
  background: var(--theme-surface-soft);
  border-color: rgba(96, 123, 168, 0.3);
  color: var(--theme-text-strong);
}

html[data-theme='dark'] body[data-page='admin'] .ticket-msg.self .ticket-msg-inner,
html[data-theme='dark'] body[data-page='admin'] .admin-chat-message.own .admin-chat-bubble {
  background: linear-gradient(145deg, rgba(74, 168, 255, 0.22), rgba(20, 41, 72, 0.88));
  border-color: rgba(74, 168, 255, 0.34);
}

html[data-theme='dark'] body[data-page='admin'] .admin-ticket-search input,
html[data-theme='dark'] body[data-page='admin'] .admin-users-search input,
html[data-theme='dark'] body[data-page='admin'] .admin-user-top strong,
html[data-theme='dark'] body[data-page='admin'] .admin-ticket-top strong,
html[data-theme='dark'] body[data-page='admin'] .admin-chat-bubble,
html[data-theme='dark'] body[data-page='admin'] .ticket-msg-inner,
html[data-theme='dark'] body[data-page='admin'] .news-image-dropzone-title {
  color: var(--theme-text-strong);
}

html[data-theme='dark'] body[data-page='admin'] .admin-notif-dropdown {
  border-color: rgba(118, 158, 219, 0.22);
  background:
    radial-gradient(circle at top right, rgba(74, 168, 255, 0.16), transparent 28%),
    linear-gradient(180deg, rgba(15, 24, 40, 0.96), rgba(10, 16, 28, 0.94));
}

html[data-theme='dark'] body[data-page='admin'] .admin-notif-item {
  border-color: rgba(118, 158, 219, 0.18);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.03));
}

html[data-theme='dark'] body[data-page='admin'] .admin-reply-preview,
html[data-theme='dark'] body[data-page='admin'] .msg-reply-context {
  background: linear-gradient(145deg, rgba(74, 168, 255, 0.16), rgba(18, 29, 45, 0.84));
  border-color: rgba(74, 168, 255, 0.3);
  color: #b6deff;
}

html[data-theme='dark'] body[data-page='admin'] .ticket-msg-inner .msg-actions button,
html[data-theme='dark'] body[data-page='admin'] .admin-chat-bubble .msg-actions button {
  background: rgba(11, 18, 31, 0.9);
  border-color: rgba(96, 123, 168, 0.32);
  color: var(--theme-text-strong);
}

html[data-theme='dark'] body[data-page='admin'] .finalize-dropzone,
html[data-theme='dark'] body[data-page='admin'] .news-image-dropzone {
  background: linear-gradient(180deg, rgba(18, 29, 45, 0.84), rgba(11, 18, 31, 0.66));
  border-color: rgba(74, 168, 255, 0.34);
}

html[data-theme='dark'] body[data-page='admin'] .finalize-dropzone-icon,
html[data-theme='dark'] body[data-page='admin'] .news-image-dropzone-icon {
  background: rgba(74, 168, 255, 0.12);
  color: #9ed2ff;
}

html[data-theme='dark'] body[data-page='admin'] .finalize-image-option.selected {
  box-shadow: 0 0 0 3px rgba(74, 168, 255, 0.32);
}

html[data-theme='dark'] body[data-page='admin'] .finalize-preview-wrap img,
html[data-theme='dark'] body[data-page='admin'] .admin-user-avatar img {
  background: rgba(11, 18, 31, 0.88);
}

html[data-theme='dark'] body[data-page='admin'] .admin-image-viewer {
  background: rgba(2, 8, 20, 0.92);
}

html[data-theme='dark'] .status-open,
html[data-theme='dark'] .lg-tag-open {
  background: rgba(19, 163, 101, 0.16);
  color: #7de1ae;
}

html[data-theme='dark'] .status-pending,
html[data-theme='dark'] .lg-tag-pending {
  background: rgba(211, 131, 0, 0.18);
  color: #ffcf78;
}

html[data-theme='dark'] .status-closed,
html[data-theme='dark'] .lg-tag-closed {
  background: rgba(208, 69, 69, 0.16);
  color: #ff9da1;
}

.settings-appearance-card {
  position: relative;
  margin-top: 22px;
  padding: 22px;
  border-radius: 26px;
  overflow: hidden;
  background:
    radial-gradient(circle at top left, rgba(29, 125, 242, 0.16), transparent 40%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.84), rgba(236, 246, 255, 0.62));
  border: 1px solid rgba(148, 163, 184, 0.18);
  box-shadow:
    0 24px 48px rgba(148, 163, 184, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(18px);
}

.settings-appearance-card::before {
  content: '';
  position: absolute;
  inset: auto auto -20% 56%;
  width: 220px;
  height: 220px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(76, 192, 255, 0.18), transparent 72%);
  pointer-events: none;
}

.settings-appearance-card__head,
.settings-appearance-grid,
.settings-appearance-resolved,
.settings-appearance-status {
  position: relative;
  z-index: 1;
}

.settings-appearance-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.settings-appearance-card__subtitle {
  margin: 6px 0 0;
}

.settings-appearance-pill {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(29, 125, 242, 0.2);
  color: #0a63d3;
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.16em;
}

.settings-appearance-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 18px;
}

.settings-appearance-option {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  text-align: left;
  width: 100%;
  padding: 16px;
  border-radius: 20px;
  border: 1px solid rgba(148, 163, 184, 0.16);
  background: rgba(255, 255, 255, 0.56);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.62);
  cursor: pointer;
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
  font: inherit;
  color: inherit;
}

.settings-appearance-option:hover {
  transform: translateY(-1px);
  border-color: rgba(29, 125, 242, 0.28);
}

.settings-appearance-option[data-selected='true'] {
  border-color: rgba(29, 125, 242, 0.34);
  background: linear-gradient(145deg, rgba(29, 125, 242, 0.14), rgba(255, 255, 255, 0.8));
  box-shadow: 0 16px 30px rgba(29, 125, 242, 0.12);
}

.settings-appearance-option__icon {
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(29, 125, 242, 0.12);
  color: var(--accent-blue-strong);
  font-size: 1rem;
}

.settings-appearance-option__body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.settings-appearance-option__title {
  font-size: 0.95rem;
  font-weight: 700;
  color: #0f172a;
}

.settings-appearance-option__copy {
  font-size: 0.86rem;
  line-height: 1.5;
  color: #64748b;
}

.settings-appearance-resolved,
.settings-appearance-status {
  margin-top: 14px;
  min-height: 20px;
}

@media (max-width: 900px) {
  .settings-appearance-grid {
    grid-template-columns: 1fr;
  }

  .settings-appearance-card__head {
    flex-direction: column;
    align-items: flex-start;
  }
}

html[data-theme='dark'] body[data-page='dashboard'] .settings-appearance-card {
  background:
    radial-gradient(circle at top right, rgba(74, 168, 255, 0.16), transparent 38%),
    linear-gradient(135deg, rgba(23, 35, 54, 0.88), rgba(14, 22, 36, 0.76));
  border-color: rgba(96, 123, 168, 0.24);
  box-shadow: 0 24px 48px rgba(2, 8, 20, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

html[data-theme='dark'] body[data-page='dashboard'] .settings-appearance-option {
  background: rgba(18, 29, 45, 0.72);
  border-color: rgba(96, 123, 168, 0.22);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

html[data-theme='dark'] body[data-page='dashboard'] .settings-appearance-option[data-selected='true'] {
  border-color: rgba(74, 168, 255, 0.38);
  background: linear-gradient(145deg, rgba(74, 168, 255, 0.22), rgba(18, 29, 45, 0.92));
  box-shadow: 0 18px 34px rgba(8, 90, 194, 0.22);
}

html[data-theme='dark'] body[data-page='dashboard'] .settings-appearance-option__title {
  color: var(--theme-text-strong);
}

html[data-theme='dark'] body[data-page='dashboard'] .settings-appearance-option__copy,
html[data-theme='dark'] body[data-page='dashboard'] .settings-appearance-card__subtitle,
html[data-theme='dark'] body[data-page='dashboard'] .settings-appearance-resolved,
html[data-theme='dark'] body[data-page='dashboard'] .settings-appearance-status {
  color: var(--theme-text-muted);
}

html[data-theme='dark'] body[data-page='dashboard'] .settings-appearance-pill {
  background: rgba(18, 29, 45, 0.74);
  border-color: rgba(74, 168, 255, 0.22);
  color: #9ed2ff;
}