html {
  color-scheme: dark;
  scroll-behavior: auto !important;
  --calm-text: #e6edf9;
  --calm-muted: #98a6c4;
  --calm-card: rgba(17, 24, 39, 0.9);
  --calm-card-soft: rgba(255, 255, 255, 0.04);
  --calm-border: rgba(148, 163, 184, 0.16);
  --calm-shadow: 0 8px 22px rgba(0, 0, 0, 0.18);
}

html[data-theme="light"] {
  color-scheme: light;
  --calm-text: #152238;
  --calm-muted: #5f6f88;
  --calm-card: rgba(255, 255, 255, 0.94);
  --calm-card-soft: rgba(37, 57, 99, 0.04);
  --calm-border: rgba(37, 57, 99, 0.1);
  --calm-shadow: 0 8px 22px rgba(25, 39, 69, 0.06);
}

html[data-theme="galaxy"] {
  --calm-text: #f1e7ff;
  --calm-muted: #b8a4d6;
  --calm-card: rgba(30, 12, 52, 0.9);
}

html[data-theme="cyberpunk"] {
  --calm-text: #eef6ff;
  --calm-muted: #9eb6c9;
  --calm-card: rgba(12, 18, 40, 0.92);
}

html[data-theme="ocean"] {
  --calm-text: #e4f4ff;
  --calm-muted: #95b5cf;
  --calm-card: rgba(6, 27, 50, 0.92);
}

html[data-theme="forest"] {
  --calm-text: #ebfbf0;
  --calm-muted: #98b9a4;
  --calm-card: rgba(8, 30, 22, 0.92);
}

html[data-theme="sunset"] {
  --calm-text: #fff1df;
  --calm-muted: #d0a98b;
  --calm-card: rgba(40, 22, 8, 0.92);
}

html[data-theme="matrix"] {
  --calm-text: #d6ffd6;
  --calm-muted: #79b879;
  --calm-card: rgba(4, 14, 4, 0.94);
}

html[data-theme="nord"] {
  --calm-text: #eceff4;
  --calm-muted: #a7b2c2;
  --calm-card: rgba(46, 52, 64, 0.92);
}

body {
  background: var(--bg, #111827) !important;
  color: var(--calm-text) !important;
  font-family: 'Outfit', sans-serif !important;
}

#space-canvas,
.bg-gif,
.bg-nebula,
.bg-vignette {
  display: none !important;
}

*,
*::before,
*::after {
  text-shadow: none !important;
  animation: none !important;
  transition: none !important;
}

header {
  background: var(--calm-card) !important;
  border-bottom: 1px solid var(--calm-border) !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
}

.logo,
.brand,
.brand-logo,
h1,
h2,
h3,
h4,
.rank,
.time,
.admin-badge,
.control-title,
.section-title,
.stat-value,
.info-box-value,
.squad-total-value {
  font-family: 'Outfit', sans-serif !important;
  color: var(--calm-text) !important;
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  filter: none !important;
}

h1,
h2,
h3,
h4 {
  letter-spacing: -0.02em !important;
  font-weight: 700 !important;
}

p,
label,
small,
li,
td,
th,
.subtitle,
.description,
.text-muted,
.hint,
.no-data,
.match-subtitle,
.profile-subtitle,
.setting-description {
  color: var(--calm-muted) !important;
}

main,
.container,
.content,
.dashboard,
.page,
.page-wrap,
.shell {
  position: relative;
  z-index: 1;
}

.card,
.panel,
.info-box,
.control-panel,
.leaderboard,
.stat-card,
.feature-box,
.pricing-card,
.modal-content,
.profile-panel,
.match-panel,
.match-card,
.welcome,
.autotrack-live,
.account-delete-card,
.glass-card,
.settings-section,
.settings-panel,
.friend-card,
.squad-card {
  background: var(--calm-card) !important;
  color: var(--calm-text) !important;
  border: 1px solid var(--calm-border) !important;
  box-shadow: var(--calm-shadow) !important;
  backdrop-filter: none !important;
}

.card::before,
.control-panel::before,
.leaderboard::before,
.info-box::before,
.stat-card::before,
.feature-box::before,
.theme-card::before {
  display: none !important;
}

button,
.btn,
.btn-primary,
.btn-secondary,
.btn-danger,
.btn-success,
.action-btn,
.secondary-btn,
.mini-btn,
.match-btn,
.back-link,
.back-dashboard-btn,
a.button,
a.btn {
  background: var(--calm-card-soft) !important;
  color: var(--calm-text) !important;
  border: 1px solid var(--calm-border) !important;
  box-shadow: none !important;
  transform: none !important;
}

.btn-primary,
.action-btn.primary,
.match-btn.primary,
button.primary,
a.primary {
  background: var(--primary, #5865f2) !important;
  color: #ffffff !important;
  border-color: transparent !important;
}

.btn-danger,
button.danger,
.danger-btn {
  background: rgba(248, 113, 113, 0.12) !important;
  color: #ffd6d6 !important;
  border-color: rgba(248, 113, 113, 0.18) !important;
}

.btn-success,
button.success {
  background: rgba(52, 211, 153, 0.12) !important;
  color: #d2ffef !important;
  border-color: rgba(52, 211, 153, 0.18) !important;
}

button:hover,
.btn:hover,
.action-btn:hover,
.secondary-btn:hover,
.mini-btn:hover,
.match-btn:hover,
a.button:hover,
a.btn:hover,
.back-link:hover,
.back-dashboard-btn:hover {
  transform: none !important;
  box-shadow: none !important;
}

input,
select,
textarea,
.input,
.select {
  background: var(--calm-card-soft) !important;
  color: var(--calm-text) !important;
  border: 1px solid var(--calm-border) !important;
  box-shadow: none !important;
}

input:focus,
select:focus,
textarea:focus,
.input:focus,
.select:focus {
  outline: none !important;
  border-color: var(--primary, #5865f2) !important;
  box-shadow: 0 0 0 3px rgba(88, 101, 242, 0.12) !important;
}

table,
thead,
tbody,
tr,
th,
td {
  border-color: var(--border, rgba(148, 163, 184, 0.16)) !important;
}

th {
  background: rgba(255, 255, 255, 0.03) !important;
  color: var(--calm-muted) !important;
  font-family: 'Outfit', sans-serif !important;
  letter-spacing: 0.04em !important;
}

tr:hover td {
  background: rgba(255, 255, 255, 0.025) !important;
}

.footer-links a,
footer a,
a {
  color: var(--accent, var(--primary, #a5b4fc)) !important;
}

.footer-links a:hover,
footer a:hover,
a:hover {
  color: var(--text, #e5eefc) !important;
}

.spinner,
.status-indicator,
.match-trigger-dot {
  animation: none !important;
}

.status-indicator {
  box-shadow: none !important;
}

.match-trigger,
.profile-trigger {
  background: var(--calm-card) !important;
  color: var(--calm-text) !important;
  border: 1px solid var(--calm-border) !important;
  box-shadow: none !important;
}

.match-trigger-count {
  background: var(--primary, #5865f2) !important;
  color: #ffffff !important;
}

.match-trigger-icon,
.profile-close,
.match-close {
  background: var(--calm-card-soft) !important;
  color: var(--calm-text) !important;
  border: 1px solid var(--calm-border) !important;
}

.match-backdrop,
.profile-backdrop {
  background: rgba(0, 0, 0, 0.28) !important;
  backdrop-filter: none !important;
}

.profile-chart-bar {
  background: var(--primary, #5865f2) !important;
}

.state-dot.online,
.autotrack-live-status.online {
  color: var(--success, #34d399) !important;
  background: transparent !important;
}

.autotrack-live-status.offline,
.state-dot.offline {
  color: var(--danger, #f87171) !important;
  background: transparent !important;
}

.autotrack-live-title {
  color: var(--accent, var(--primary, #a5b4fc)) !important;
}

.autotrack-live-time {
  color: var(--calm-text) !important;
}

.autotrack-live-status {
  color: var(--calm-text) !important;
}

.theme-card {
  background: var(--calm-card-soft) !important;
  border: 1px solid var(--calm-border) !important;
  box-shadow: none !important;
  transform: none !important;
}

.theme-card.selected {
  border-color: var(--primary, #5865f2) !important;
  background: rgba(255, 255, 255, 0.05) !important;
  box-shadow: none !important;
}

.theme-preview {
  filter: none !important;
}

[style*="box-shadow"] {
  box-shadow: none !important;
}

[style*="backdrop-filter"] {
  backdrop-filter: none !important;
}

[style*="font-family:'Orbitron'"],
[style*='font-family:"Orbitron"'] {
  font-family: 'Outfit', sans-serif !important;
}

html[data-theme="light"] body {
  background: #eef3fb !important;
  color: #152238 !important;
}

html[data-theme="light"] header,
html[data-theme="light"] .card,
html[data-theme="light"] .panel,
html[data-theme="light"] .info-box,
html[data-theme="light"] .control-panel,
html[data-theme="light"] .leaderboard,
html[data-theme="light"] .stat-card,
html[data-theme="light"] .feature-box,
html[data-theme="light"] .pricing-card,
html[data-theme="light"] .modal-content,
html[data-theme="light"] .profile-panel,
html[data-theme="light"] .match-panel,
html[data-theme="light"] .match-card,
html[data-theme="light"] .welcome,
html[data-theme="light"] .autotrack-live,
html[data-theme="light"] .account-delete-card,
html[data-theme="light"] .glass-card,
html[data-theme="light"] .settings-section,
html[data-theme="light"] .settings-panel,
html[data-theme="light"] .friend-card,
html[data-theme="light"] .squad-card,
html[data-theme="light"] .match-trigger,
html[data-theme="light"] .profile-trigger {
  background: rgba(255, 255, 255, 0.94) !important;
  color: #152238 !important;
  border-color: rgba(37, 57, 99, 0.1) !important;
}

.welcome h1,
.stat-value,
#global-rank,
#today-hours,
#total-hours,
#squad-members,
.username,
#user-name,
.match-trigger-label,
.match-title,
.profile-title,
.action-btn,
.secondary-btn {
  color: var(--calm-text) !important;
}

.welcome p,
.stat-label,
.profile-label,
.match-trigger-kicker,
footer,
footer p,
.footer-links a,
#squad-hint {
  color: var(--calm-muted) !important;
}

.action-btn,
.secondary-btn {
  background: var(--calm-card-soft) !important;
  border-color: var(--calm-border) !important;
}

.stat-card,
.welcome,
.match-panel,
.profile-panel,
.autotrack-live {
  background: var(--calm-card) !important;
  border-color: var(--calm-border) !important;
}

.profile-panel {
  background: color-mix(in srgb, var(--calm-card) 92%, black 8%) !important;
  border: 1px solid var(--calm-border) !important;
  box-shadow: var(--calm-shadow) !important;
}

.match-panel {
  background: color-mix(in srgb, var(--calm-card) 92%, black 8%) !important;
  border: 1px solid var(--calm-border) !important;
  box-shadow: var(--calm-shadow) !important;
}

.match-title,
.match-name,
.match-metric-value,
.match-score {
  color: var(--calm-text) !important;
}

.match-subtitle,
.match-reasons,
.match-updated-pill,
.match-footer-note,
.match-metric-label {
  color: var(--calm-muted) !important;
}

.match-tab {
  background: rgba(255, 255, 255, 0.04) !important;
  color: var(--calm-muted) !important;
  border: 1px solid var(--calm-border) !important;
}

.match-tab.active {
  background: rgba(255, 255, 255, 0.08) !important;
  color: var(--calm-text) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

.match-source-pill,
.match-updated-pill,
.match-ai-card,
.match-empty,
.match-inline-status,
.match-metric {
  background: rgba(255, 255, 255, 0.045) !important;
  border: 1px solid var(--calm-border) !important;
}

.match-source-pill {
  color: var(--calm-text) !important;
}

.match-card {
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid var(--calm-border) !important;
  box-shadow: none !important;
}

.match-avatar {
  border: 1px solid var(--calm-border) !important;
  background-color: rgba(255, 255, 255, 0.05) !important;
}

.match-score {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid var(--calm-border) !important;
}

.match-ai-title,
.match-kicker {
  color: var(--primary, #5865f2) !important;
}

.match-ai-body,
.match-empty {
  color: var(--calm-text) !important;
}

.match-btn.secondary {
  background: rgba(255, 255, 255, 0.04) !important;
  color: var(--calm-text) !important;
  border: 1px solid var(--calm-border) !important;
}

html[data-theme="light"] .match-panel {
  background: rgba(255, 255, 255, 0.96) !important;
}

html[data-theme="light"] .match-source-pill,
html[data-theme="light"] .match-updated-pill,
html[data-theme="light"] .match-ai-card,
html[data-theme="light"] .match-empty,
html[data-theme="light"] .match-inline-status,
html[data-theme="light"] .match-metric,
html[data-theme="light"] .match-card {
  background: rgba(37, 57, 99, 0.04) !important;
}

html[data-theme="light"] .match-tab {
  background: rgba(37, 57, 99, 0.05) !important;
  color: #5f6f88 !important;
}

html[data-theme="light"] .match-tab.active {
  background: rgba(37, 57, 99, 0.09) !important;
  color: #152238 !important;
}

.profile-card-top {
  border-bottom: 1px solid var(--calm-border) !important;
}

.profile-avatar-lg {
  border: 1px solid var(--calm-border) !important;
  background-color: rgba(255, 255, 255, 0.05) !important;
}

.profile-kicker,
.profile-chart-title {
  color: var(--primary, #5865f2) !important;
}

.profile-title,
.profile-stat-value {
  color: var(--calm-text) !important;
}

.profile-subtitle,
.profile-stat-label,
.profile-chart-labels,
.profile-chart-bar::after {
  color: var(--calm-muted) !important;
}

.profile-stat,
.profile-chart-card {
  background: rgba(255, 255, 255, 0.045) !important;
  border: 1px solid var(--calm-border) !important;
  box-shadow: none !important;
}

.profile-chart-tab {
  background: rgba(255, 255, 255, 0.04) !important;
  color: var(--calm-muted) !important;
  border: 1px solid var(--calm-border) !important;
}

.profile-chart-tab.active {
  background: rgba(255, 255, 255, 0.08) !important;
  color: var(--calm-text) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

.profile-chart-bar {
  background: linear-gradient(180deg, color-mix(in srgb, var(--primary, #5865f2) 88%, white 12%), color-mix(in srgb, var(--primary, #5865f2) 46%, transparent 54%)) !important;
  opacity: 1 !important;
}

.profile-panel-actions .mini-btn {
  background: rgba(255, 255, 255, 0.04) !important;
  color: var(--calm-text) !important;
  border-color: var(--calm-border) !important;
}

.profile-close {
  background: rgba(255, 255, 255, 0.05) !important;
  color: var(--calm-text) !important;
  border: 1px solid var(--calm-border) !important;
}

html[data-theme="light"] .profile-panel {
  background: rgba(255, 255, 255, 0.96) !important;
}

html[data-theme="light"] .profile-stat,
html[data-theme="light"] .profile-chart-card {
  background: rgba(37, 57, 99, 0.04) !important;
}

html[data-theme="light"] .profile-chart-tab {
  background: rgba(37, 57, 99, 0.05) !important;
  color: #5f6f88 !important;
}

html[data-theme="light"] .profile-chart-tab.active {
  background: rgba(37, 57, 99, 0.09) !important;
  color: #152238 !important;
}