@import url("../cupcakes/style.css?v=20260615-181704");

:root {
  --page-bg: linear-gradient(165deg, #071224 0%, #0d2344 42%, #1f3a67 100%);
  --panel-bg: rgba(10, 20, 38, 0.92);
  --panel-border: rgba(126, 176, 255, 0.22);
  --board-bg: #17355f;
  --cell-bg: rgba(168, 204, 255, 0.15);
  --text-main: #f4f8ff;
  --text-muted: #dce9ff;
  --button-main: #78b4ff;
  --button-main-hover: #5b9af0;
  --button-secondary: rgba(15, 31, 56, 0.98);
  --shadow-soft: 0 22px 48px rgba(4, 11, 25, 0.45);
  --shadow-card: 0 10px 24px rgba(8, 18, 36, 0.32);
  --chrome-surface: rgba(5, 13, 27, 0.96);
  --chrome-surface-strong: rgba(9, 19, 36, 0.985);
  --chrome-border: rgba(126, 176, 255, 0.2);
  --chrome-text: #f4f8ff;
  --chrome-text-muted: #dce9ff;
  --chrome-accent: #9fd0ff;
  --chrome-accent-hover: #c2e1ff;
}

.site-nav,
.seo-content,
.overlay-card,
.score-card {
  background: rgba(10, 20, 38, 0.9);
  border-color: rgba(126, 176, 255, 0.2);
}

.site-nav {
  background: rgba(6, 16, 32, 0.96) !important;
  border-bottom-color: rgba(126, 176, 255, 0.18) !important;
}

.site-nav-inner,
.site-nav-mobile {
  background: transparent;
}

.site-brand,
.site-nav-link,
.theme-card,
.variant-comparison,
.board-frame {
  background: rgba(15, 31, 56, 0.94);
  border-color: rgba(126, 176, 255, 0.18);
}

.site-brand,
.site-nav-link,
.site-nav-mobile-link,
.site-nav-dropdown > summary,
.site-nav-mobile-group > summary,
.theme-card h3,
.variant-comparison th,
.faq-section h3,
.seo-content h2,
.seo-content h3 {
  color: var(--text-main);
}

.site-nav-link,
.site-nav-mobile-link,
.site-nav-dropdown > summary,
.site-nav-mobile-group > summary,
.seo-content p,
.faq-section p,
.theme-card p,
.variant-comparison td,
.score-card .label {
  color: var(--text-muted);
}

.site-nav-link,
.site-nav-mobile-link,
.site-nav-dropdown > summary,
.site-nav-mobile-group > summary {
  color: #eaf3ff;
}

.site-theme-link {
  color: #f4f8ff;
}

.site-nav-link:hover,
.site-nav-link.is-active,
.site-nav-mobile-link:hover,
.site-nav-mobile-link.is-active,
.site-nav-dropdown > summary:hover,
.site-nav-dropdown > summary.is-active,
.site-nav-mobile-group > summary.is-active,
.site-nav-mobile-group > summary:hover,
.site-theme-link:hover,
.site-theme-link.is-active,
.seo-content a {
  color: #9fd0ff;
}

.site-theme-link {
  opacity: 1;
}

.site-nav-link.is-active,
.site-nav-mobile-link.is-active,
.site-nav-dropdown > summary.is-active,
.site-nav-mobile-group > summary.is-active,
.site-theme-link.is-active {
  font-weight: 800;
}

.site-nav-link::after,
.site-nav-mobile-link::after,
.site-nav-dropdown > summary::after,
.site-theme-link::after {
  opacity: 0.9;
}

.site-nav-toggle,
.site-nav-toggle:hover,
.site-nav-toggle:focus-visible,
.site-nav-toggle-bars span {
  color: var(--text-main);
  background-color: var(--text-main);
  border-color: rgba(126, 176, 255, 0.32);
}

.site-nav-mobile,
.site-nav-menu {
  background: rgba(5, 13, 27, 0.985) !important;
  border-color: rgba(126, 176, 255, 0.2) !important;
}

.site-nav-menu,
.site-nav-mobile {
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.35);
}

.site-brand,
.site-nav-link,
.site-nav-mobile-link,
.site-nav-dropdown > summary,
.site-nav-mobile-group > summary,
.site-theme-link,
.site-language-trigger,
.site-language-option {
  color: #f7fbff !important;
}

.site-nav-link:hover,
.site-nav-link.is-active,
.site-nav-mobile-link:hover,
.site-nav-mobile-link.is-active,
.site-nav-dropdown > summary:hover,
.site-nav-dropdown > summary.is-active,
.site-nav-mobile-group > summary:hover,
.site-nav-mobile-group > summary.is-active,
.site-theme-link:hover,
.site-theme-link.is-active,
.site-language-trigger:hover,
.site-language-option:hover,
.site-language-option.is-active {
  color: #9fd0ff !important;
}

.site-language-trigger,
.site-language-menu,
.site-nav-mobile-theme-links {
  background: rgba(10, 20, 38, 0.94) !important;
  border-color: rgba(126, 176, 255, 0.18) !important;
}

.site-language-trigger-label,
.site-language-option span {
  color: #f7fbff !important;
}

.site-language-trigger-meta,
.site-language-option small {
  color: #cfe1ff !important;
}

.site-language-option {
  background: rgba(10, 20, 38, 0.72) !important;
  border-color: transparent !important;
}

.site-language-option:hover,
.site-language-option:focus-visible {
  background: rgba(20, 42, 74, 0.96) !important;
  border-color: rgba(126, 176, 255, 0.2) !important;
}

.site-language-option.is-active {
  background: rgba(38, 86, 148, 0.96) !important;
  border-color: rgba(159, 208, 255, 0.34) !important;
  color: #ffffff !important;
  box-shadow: inset 0 0 0 1px rgba(209, 231, 255, 0.12);
}

.site-language-option.is-active span,
.site-language-option.is-active small {
  color: #ffffff !important;
}

.site-nav-link::after,
.site-nav-mobile-link::after,
.site-nav-dropdown > summary::after,
.site-theme-link::after {
  background: currentColor !important;
}

.site-nav-toggle,
.site-nav-toggle:hover,
.site-nav-toggle:focus-visible {
  color: #f7fbff !important;
  border-color: rgba(126, 176, 255, 0.24) !important;
  background: rgba(10, 20, 38, 0.92) !important;
}

.site-nav-toggle-bars span {
  background: #f7fbff !important;
}

.site-nav-link:hover,
.site-brand:hover,
.theme-card:hover {
  box-shadow: 0 16px 32px rgba(5, 13, 27, 0.28);
}

.board-frame {
  border-color: rgba(126, 176, 255, 0.22);
}

.overlay {
  background: rgba(4, 11, 25, 0.58);
}

.primary,
#overlay-restart-btn {
  color: #061425;
  box-shadow: 0 12px 24px rgba(95, 157, 255, 0.28);
}

.secondary,
.back-link {
  color: var(--text-main);
}

.theme-label {
  color: #a9d1ff;
}

.variant-comparison thead {
  background: linear-gradient(180deg, rgba(120, 180, 255, 0.2), rgba(120, 180, 255, 0.08));
}

.variant-comparison tbody tr:hover {
  background: rgba(120, 180, 255, 0.08);
}

.tile.level-missing {
  background: linear-gradient(160deg, #cfe2ff, #79aef3);
  color: #0d2344;
}