/* Full-site visual system and day/night theme. Loaded after page-specific styles. */

:root {
  --ng-surface: rgba(255, 255, 255, .9);
  --ng-surface-soft: rgba(246, 249, 255, .92);
  --ng-surface-strong: #fff;
  --ng-border: rgba(190, 205, 229, .72);
  --ng-text: #122039;
  --ng-muted: #687892;
  --ng-blue: #2f6bff;
  --ng-blue-soft: #edf3ff;
  --ng-shadow: 0 14px 38px rgba(37, 72, 132, .09);
}

html[data-theme="dark"] {
  --bg: #07111f;
  --page-bg: #07111f;
  --panel: rgba(16, 28, 47, .96);
  --card: #111e32;
  --text: #edf4ff;
  --muted: #97a8c0;
  --line: #273a58;
  --ng-surface: rgba(15, 27, 46, .94);
  --ng-surface-soft: rgba(12, 23, 40, .96);
  --ng-surface-strong: #111e32;
  --ng-border: rgba(75, 101, 139, .48);
  --ng-text: #edf4ff;
  --ng-muted: #97a8c0;
  --ng-blue: #6d98ff;
  --ng-blue-soft: #182b4b;
  --ng-shadow: 0 16px 44px rgba(0, 0, 0, .28);
  color-scheme: dark;
  background: #07111f;
}

html[data-theme="dark"] body {
  color: var(--ng-text);
  background-color: #07111f;
}

html[data-theme="dark"] body::before {
  background:
    radial-gradient(760px 460px at 0% -8%, rgba(47, 107, 255, .23), transparent 64%),
    radial-gradient(720px 460px at 110% 8%, rgba(36, 176, 188, .13), transparent 62%),
    linear-gradient(160deg, #07111f 0%, #0a1628 48%, #07111f 100%);
}

html[data-theme="dark"] .wm {
  opacity: .09;
  background-image:
    repeating-linear-gradient(45deg, transparent 0 40px, rgba(104, 145, 224, .13) 40px 41px),
    repeating-linear-gradient(-45deg, transparent 0 40px, rgba(62, 187, 218, .1) 40px 41px);
}

/* Theme switch: placed directly above the customer-service launcher. */
.theme-mode-toggle {
  position: fixed;
  right: 22px;
  bottom: 84px;
  z-index: 82;
  display: inline-flex;
  width: 112px;
  height: 48px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 14px;
  border: 1px solid rgba(255, 255, 255, .62);
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(135deg, #245ee8 0%, #2f6bff 52%, #5b91ff 100%);
  box-shadow: 0 12px 28px rgba(47, 107, 255, .32), inset 0 1px rgba(255, 255, 255, .24);
  backdrop-filter: blur(16px) saturate(1.1);
  font-size: 12px;
  font-weight: 850;
  line-height: 1;
  animation: ngFloatingBreath 2.9s ease-in-out infinite;
  transition: transform .2s ease, opacity .2s ease, border-color .2s ease, filter .2s ease;
}
.theme-mode-toggle:hover { border-color: rgba(255, 255, 255, .88); filter: brightness(1.07); transform: translateY(-2px); }
.theme-mode-toggle:focus-visible { outline: 3px solid rgba(47, 107, 255, .28); outline-offset: 3px; }
.theme-mode-icon {
  display: grid;
  width: 24px;
  height: 24px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: transparent;
  box-shadow: none;
  font-size: 16px;
}
body:not(.theme-has-service) .theme-mode-toggle { bottom: 24px; }
body.theme-service-open .theme-mode-toggle { opacity: 0; pointer-events: none; transform: translateY(8px); }
html[data-theme="dark"] .theme-mode-toggle {
  border-color: rgba(130, 170, 255, .62);
  color: #fff;
  background: linear-gradient(135deg, #1e4fc8 0%, #2f6bff 54%, #477fe9 100%);
}
html[data-theme="dark"] .theme-mode-icon { color: #fff2b8; background: transparent; }

.page-shell .service-float-btn {
  width: 112px;
  height: 48px;
  border: 1px solid rgba(255, 255, 255, .62);
  background: linear-gradient(135deg, #245ee8 0%, #2f6bff 52%, #5b91ff 100%);
  box-shadow: 0 12px 28px rgba(47, 107, 255, .32), inset 0 1px rgba(255, 255, 255, .24);
  animation: ngFloatingBreath 2.9s ease-in-out infinite;
  transition: transform .2s ease, border-color .2s ease, filter .2s ease;
}
html[data-theme="dark"] .page-shell .service-float-btn {
  border-color: rgba(130, 170, 255, .62);
  background: linear-gradient(135deg, #1e4fc8 0%, #2f6bff 54%, #477fe9 100%);
}
.page-shell .service-float-btn:hover { border-color: rgba(255, 255, 255, .88); filter: brightness(1.07); transform: translateY(-2px); }
.page-shell .service-float-btn b { animation: ngBadgeBreath 2.2s ease-in-out infinite; }

@keyframes ngFloatingBreath {
  0%, 100% { box-shadow: 0 10px 24px rgba(47, 107, 255, .3), 0 0 0 0 rgba(72, 128, 255, .24), inset 0 1px rgba(255, 255, 255, .24); }
  50% { box-shadow: 0 14px 32px rgba(47, 107, 255, .44), 0 0 0 8px rgba(72, 128, 255, 0), inset 0 1px rgba(255, 255, 255, .28); }
}
@keyframes ngBadgeBreath {
  0%, 100% { box-shadow: 0 4px 11px rgba(229, 72, 97, .34), 0 0 0 0 rgba(255, 76, 101, .26); }
  50% { box-shadow: 0 6px 16px rgba(229, 72, 97, .48), 0 0 0 5px rgba(255, 76, 101, 0); }
}

/* Unified component heights and richer light-theme hierarchy. */
.page-shell .category-buttons { align-items: stretch; }
.page-shell .category-button[hidden] { display: none !important; }
.page-shell .category-button,
.page-shell .category-button.fixed-primary-category {
  position: relative;
  display: inline-flex;
  height: 48px;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  overflow: hidden;
  padding: 0 13px;
  font-size: 14px;
  line-height: 1;
}
.page-shell .category-button::before {
  content: "◆";
  display: grid;
  width: 24px;
  height: 24px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 8px;
  color: #2f6bff;
  background: #eaf1ff;
  font-size: 11px;
  box-shadow: inset 0 0 0 1px rgba(47, 107, 255, .08);
}
.page-shell .category-button[data-fixed-category="trial"]::before { content: "◆"; }
.page-shell .category-button[data-fixed-category="lottery"]::before { content: "◉"; }
.page-shell .category-button[data-fixed-category="recommendation"]::before { content: "★"; }
.page-shell .category-button[data-fixed-category="movies"]::before { content: "▶"; }
.page-shell .category-button[data-fixed-category="adult"]::before { content: "☾"; }
.page-shell .category-button[data-fixed-category="tools"]::before { content: "⌘"; }
.page-shell .category-button.active::before {
  color: #fff;
  background: rgba(255, 255, 255, .18);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .16);
}
.page-shell .category-button.active {
  background: linear-gradient(120deg, #225ee7 0%, #3978ff 54%, #68a3ff 100%);
  box-shadow: 0 10px 24px rgba(47, 107, 255, .28), inset 0 1px rgba(255, 255, 255, .22);
}
.page-shell .pk16-category-title { min-height: 48px; }
.page-shell .card-grid,
.page-shell .trial-featured,
.page-shell .game-grid,
.page-shell .trial-category-grid,
.common-tools-grid,
.collector-grid { align-items: stretch; }
.page-shell .card,
.page-shell .game-card,
.common-tool-card,
.collector-card { height: 100%; }
.page-shell .card { min-height: 112px; }
.page-shell .game-card { min-height: 123px; }
html[data-theme="dark"] .page-shell .trial-vendor-shell {
  border-color: #29415f;
  background: rgba(13, 28, 49, .96);
  box-shadow: 0 12px 32px rgba(0, 0, 0, .28);
}
html[data-theme="dark"] .page-shell .trial-vendor-tab { color: #9cafc8; }
html[data-theme="dark"] .page-shell .trial-vendor-tab:hover { color: #fff; background: #182b48; }
html[data-theme="dark"] .page-shell .trial-vendor-tab.active {
  border-color: #294a72;
  color: #fff;
  background: #193354;
  box-shadow: inset 0 1px rgba(255, 255, 255, .08), 0 7px 18px rgba(0, 0, 0, .16);
}
html[data-theme="dark"] .page-shell .trial-vendor-icon { border-color: color-mix(in srgb, var(--vendor-tint) 18%, #dce9ff); color: var(--vendor-tint); background: var(--vendor-soft); }
html[data-theme="dark"] .page-shell .trial-vendor-tab.active .trial-vendor-icon { color: #fff; background: rgba(255, 255, 255, .13); }
.common-tool-card { min-height: 136px; }
.page-shell .card::after,
.page-shell .game-card::after,
.common-tool-card::after,
.collector-card::after {
  content: "";
  position: absolute;
  top: 0;
  right: 12px;
  left: 12px;
  height: 2px;
  border-radius: 0 0 999px 999px;
  background: linear-gradient(90deg, transparent, rgba(47, 107, 255, .62), transparent);
  opacity: .55;
  pointer-events: none;
}
.page-shell .card,
.page-shell .game-card,
.common-tool-card,
.collector-card { position: relative; }
.page-shell .brand-footer,
.fixed-page-footer,
.lottery-shell > .site-footer {
  min-height: 74px;
  justify-content: center;
  box-sizing: border-box;
}
.page-shell .brand-footer { padding-top: 8px; padding-bottom: 8px; line-height: 1.35; }

.common-tools-heading { min-height: 82px; }
.common-tools-group,
.collector-catalog-shell {
  position: relative;
  isolation: isolate;
}
.common-tools-group::before,
.collector-catalog-shell::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1;
  height: 3px;
  background: linear-gradient(90deg, #2f6bff, #63a1ff 45%, #2dc1b5, transparent 92%);
  pointer-events: none;
}
.common-tools-group-head h3,
.collector-catalog-head h2 { display: flex; align-items: center; gap: 9px; }
.common-tools-group-head h3::before,
.collector-catalog-head h2::before {
  content: "";
  width: 10px;
  height: 10px;
  flex: 0 0 auto;
  border: 4px solid #dce8ff;
  border-radius: 50%;
  background: #2f6bff;
  box-shadow: 0 0 0 1px rgba(47, 107, 255, .2);
}
.common-tools-group {
  overflow: hidden;
  background-image: radial-gradient(circle at 100% 0%, rgba(47, 107, 255, .055), transparent 240px);
}
.collector-catalog-head { min-height: 104px; box-sizing: border-box; }
.collector-grid { background: radial-gradient(circle at 0 0, rgba(47, 107, 255, .04), transparent 360px); }
@media (min-width: 621px) {
  .collector-grid:has(.collector-card:only-child) { grid-template-columns: minmax(190px, 260px); }
}

/* Main navigation application — dark template. */
html[data-theme="dark"] .page-shell header,
html[data-theme="dark"] .page-shell .carousel-wrap,
html[data-theme="dark"] .page-shell .nav-section,
html[data-theme="dark"] .page-shell .marquee-wrap,
html[data-theme="dark"] .page-shell .category-button,
html[data-theme="dark"] .page-shell .card,
html[data-theme="dark"] .page-shell .game-card,
html[data-theme="dark"] .page-shell .empty,
html[data-theme="dark"] .page-shell .popup-modal,
html[data-theme="dark"] .page-shell .service-panel {
  border-color: var(--ng-border);
  background: linear-gradient(180deg, rgba(18, 33, 55, .96), rgba(13, 26, 44, .96));
  box-shadow: var(--ng-shadow), inset 0 1px rgba(255, 255, 255, .04);
}
html[data-theme="dark"] .page-shell header::before { opacity: .35; }
html[data-theme="dark"] .page-shell .brand-text,
html[data-theme="dark"] .page-shell .pk16-category-title,
html[data-theme="dark"] .page-shell .title,
html[data-theme="dark"] .page-shell .game-card strong,
html[data-theme="dark"] .page-shell .popup-header h3,
html[data-theme="dark"] .page-shell .service-item strong { color: #edf4ff; }
html[data-theme="dark"] .page-shell .desc,
html[data-theme="dark"] .page-shell .game-card span,
html[data-theme="dark"] .page-shell .score,
html[data-theme="dark"] .page-shell .brand-footer,
html[data-theme="dark"] .page-shell .brand-footer .name { color: #94a6bf; }
html[data-theme="dark"] .page-shell .category-button { color: #dce7f8; }
html[data-theme="dark"] .page-shell .category-button::before { color: #8eb0ff; background: #1a3155; }
html[data-theme="dark"] .page-shell .category-button.active { color: #fff; border-color: #6f96f5; }
html[data-theme="dark"] .page-shell .category-button.active::before { color: #fff; background: rgba(255,255,255,.15); }
html[data-theme="dark"] .page-shell .avatar,
html[data-theme="dark"] .page-shell .game-card img { border-color: #314866; background: #172945; }
html[data-theme="dark"] .page-shell .ghost-action,
html[data-theme="dark"] .page-shell .trial-tools input,
html[data-theme="dark"] .page-shell .trial-categories button {
  border-color: #314866;
  color: #dbe7fb;
  background: #101e33;
}
html[data-theme="dark"] .page-shell .trial-tools input::placeholder { color: #71839d; }
html[data-theme="dark"] .page-shell .service-panel-header button { color: #b7c6da; background: #1c2d48; }
html[data-theme="dark"] .page-shell .service-item { border-color: #2b4263; color: #eef4ff; background: #142541; }
html[data-theme="dark"] .page-shell .service-item small { color: #8fa2bc; }
html[data-theme="dark"] .page-shell .service-action { border-color: #365378; color: #a9c1f4; background: #1b3152; }
html[data-theme="dark"] .page-shell .popup-modal p { border-color: #294564; color: #b7c8df; background: #122540; }
html[data-theme="dark"] .page-shell .player-panel,
html[data-theme="dark"] .page-shell .player-head { background: #050b14; }

/* Catalog pages — dark template and consistent content surfaces. */
html[data-theme="dark"] .collector-catalog-panel { color: #edf4ff; }
html[data-theme="dark"] .collector-catalog-shell {
  border-color: #283d5b;
  background: rgba(13, 25, 42, .97);
  box-shadow: 0 22px 58px rgba(0,0,0,.28);
}
html[data-theme="dark"] .collector-catalog-head {
  border-bottom-color: #263a57;
  background: linear-gradient(140deg, #142844, #101e34);
}
html[data-theme="dark"] .collector-catalog-head h2,
html[data-theme="dark"] .collector-card-copy strong,
html[data-theme="dark"] .collector-info-column h3,
html[data-theme="dark"] .collector-empty h3,
html[data-theme="dark"] .collector-age-gate h3 { color: #edf4ff; }
html[data-theme="dark"] .collector-catalog-head p,
html[data-theme="dark"] .collector-catalog-updated,
html[data-theme="dark"] .collector-card-copy span,
html[data-theme="dark"] .collector-meta,
html[data-theme="dark"] .collector-description,
html[data-theme="dark"] .collector-empty p,
html[data-theme="dark"] .collector-age-gate p,
html[data-theme="dark"] .collector-pagination span { color: #94a6bf; }
html[data-theme="dark"] .collector-toolbar { border-bottom-color: #223650; }
html[data-theme="dark"] .collector-toolbar input,
html[data-theme="dark"] .collector-toolbar select {
  border-color: #304765;
  color: #edf4ff;
  background: #0b1728;
}
html[data-theme="dark"] .collector-toolbar input::placeholder { color: #71839c; }
html[data-theme="dark"] .collector-grid { background: radial-gradient(circle at 0 0, rgba(83, 131, 235, .1), transparent 380px); }
html[data-theme="dark"] .collector-card {
  border-color: #2a3e5d;
  background: #111f35;
  box-shadow: 0 9px 26px rgba(0,0,0,.2);
}
html[data-theme="dark"] .collector-cover { background: linear-gradient(145deg, #162945, #0c182a); }
html[data-theme="dark"] .collector-pagination button,
html[data-theme="dark"] .collector-age-actions .is-quiet,
html[data-theme="dark"] .collector-episode,
html[data-theme="dark"] .collector-episodes-more {
  border-color: #304765;
  color: #c7d7ee;
  background: #12233b;
}
html[data-theme="dark"] .collector-episode.is-active { border-color: #4b7fff; color: #fff; background: #2f6bff; }
html[data-theme="dark"] .collector-detail-dialog { color: #edf4ff; background: #101d31; }
html[data-theme="dark"] .collector-info-column { background: #101d31; }
html[data-theme="dark"] .fixed-page-footer { border-top-color: #263a56; color: #8193ac; }
html[data-theme="dark"] .fixed-page-footer strong { color: #aebed3; }

/* Common tools — dark template. */
html[data-theme="dark"] .common-tools-heading p,
html[data-theme="dark"] .common-tools-group-head p,
html[data-theme="dark"] .common-tool-copy span { color: #93a5be; }
html[data-theme="dark"] .common-tools-group {
  border-color: #283d5b;
  background-color: #101d31;
  background-image: radial-gradient(circle at 100% 0%, rgba(82, 130, 235, .12), transparent 250px);
  box-shadow: 0 12px 36px rgba(0,0,0,.22);
}
html[data-theme="dark"] .common-tools-group-head h3,
html[data-theme="dark"] .common-tool-copy strong { color: #edf4ff; }
html[data-theme="dark"] .common-tool-card { border-color: #2a3f5d; background: #13233a; }
html[data-theme="dark"] .common-tool-download { border-color: #36547d; color: #a8c0ff; background: #172d4e; }
html[data-theme="dark"] .common-tool-download:hover { border-color: #4f80ef; color: #fff; background: #2f6bff; }
html[data-theme="dark"] .common-tools-warning { border-color: #654d24; color: #e8c681; background: #2b2214; }
html[data-theme="dark"] .common-tools-empty { border-color: #344963; color: #93a5bd; background: #101d31; }

/* Lottery data center — full dark template. */
html[data-theme="dark"] .lottery-shell .site-header {
  border-color: #273b59;
  background: rgba(11, 22, 38, .94);
  box-shadow: 0 12px 34px rgba(0,0,0,.28);
}
html[data-theme="dark"] .lottery-shell .main-nav {
  border-color: #2a3f5e;
  background: linear-gradient(180deg, #14233a, #101d30);
}
html[data-theme="dark"] .lottery-shell .main-nav a { color: #9cafc8; }
html[data-theme="dark"] .lottery-shell .main-nav a:hover { background: #182b48; }
html[data-theme="dark"] .lottery-shell .source-badge,
html[data-theme="dark"] .lottery-shell .back-link,
html[data-theme="dark"] .lottery-shell .button,
html[data-theme="dark"] .lottery-shell .period-button,
html[data-theme="dark"] .lottery-shell .segmented button {
  border-color: #304662;
  color: #bdcce0;
  background: #122238;
}
html[data-theme="dark"] .lottery-shell .button.primary,
html[data-theme="dark"] .lottery-shell .period-button.active,
html[data-theme="dark"] .lottery-shell .segmented button.active { border-color: #4e7cf0; color: #fff; background: #2f6bff; }
html[data-theme="dark"] .lottery-shell .data-note { border-color: #5c4728; color: #e3c483; background: #2b2114; }
html[data-theme="dark"] .lottery-shell .eyebrow { color: #7fa3ff; }
html[data-theme="dark"] .lottery-shell .page-head h1,
html[data-theme="dark"] .lottery-shell .panel-head h2,
html[data-theme="dark"] .lottery-shell .draw-heading,
html[data-theme="dark"] .lottery-shell .draw-issue,
html[data-theme="dark"] .lottery-shell .robot-lab-title strong,
html[data-theme="dark"] .lottery-shell .robot-section-head strong { color: #edf4ff; }
html[data-theme="dark"] .lottery-shell .page-head p,
html[data-theme="dark"] .lottery-shell .panel-head span,
html[data-theme="dark"] .lottery-shell .stat-card span,
html[data-theme="dark"] .lottery-shell .stat-card small { color: #97a8c0; }
html[data-theme="dark"] .lottery-shell .panel,
html[data-theme="dark"] .lottery-shell .draw-card,
html[data-theme="dark"] .lottery-shell .stat-card,
html[data-theme="dark"] .lottery-shell .prediction-card,
html[data-theme="dark"] .lottery-shell .robot-lab-head,
html[data-theme="dark"] .lottery-shell .robot-card {
  border-color: #283d5b;
  background: linear-gradient(180deg, rgba(17, 31, 52, .98), rgba(12, 24, 41, .98));
  box-shadow: 0 10px 30px rgba(0,0,0,.22), inset 0 1px rgba(255,255,255,.035);
}
html[data-theme="dark"] .lottery-shell .draw-top,
html[data-theme="dark"] .lottery-shell .panel-head { border-bottom-color: #263b58; }
html[data-theme="dark"] .lottery-shell .result-main { color: #60d9ad; background: #12382e; }
html[data-theme="dark"] .lottery-shell .countdown { color: #dbe6f5; background: #17263c; }
html[data-theme="dark"] .lottery-shell .meta-box,
html[data-theme="dark"] .lottery-shell .prediction-meta div,
html[data-theme="dark"] .lottery-shell .omission-item,
html[data-theme="dark"] .lottery-shell .robot-lab-stats span,
html[data-theme="dark"] .lottery-shell .robot-category-tabs button,
html[data-theme="dark"] .lottery-shell .segmented,
html[data-theme="dark"] .lottery-shell .field input,
html[data-theme="dark"] .lottery-shell .field select {
  border-color: #2c4261;
  color: #dce7f6;
  background: #111f34;
}
html[data-theme="dark"] .lottery-shell .field input::placeholder { color: #71849f; }
html[data-theme="dark"] .lottery-shell .stat-card strong,
html[data-theme="dark"] .lottery-shell .meta-box strong,
html[data-theme="dark"] .lottery-shell .robot-lab-stats b,
html[data-theme="dark"] .lottery-shell .robot-record b { color: #edf4ff; }
html[data-theme="dark"] .lottery-shell thead,
html[data-theme="dark"] .lottery-shell th { color: #9dafc8; background: #13233a; }
html[data-theme="dark"] .lottery-shell th,
html[data-theme="dark"] .lottery-shell td { border-bottom-color: #243955; }
html[data-theme="dark"] .lottery-shell tbody tr:hover { background: #142642; }
html[data-theme="dark"] .lottery-shell .mini-ball,
html[data-theme="dark"] .lottery-shell .result-chip,
html[data-theme="dark"] .lottery-shell .sequence i { color: #9bb8ff; background: #1a3155; }
html[data-theme="dark"] .lottery-shell .bar-track { background: #1b2e49; }
html[data-theme="dark"] .lottery-shell .robot-card { color: #edf4ff; }
html[data-theme="dark"] .lottery-shell .robot-avatar i { border-color: #111e32; }
html[data-theme="dark"] .lottery-shell .robot-modal { border-color: #30445f; color: #edf4ff; background: #0e1a2c; }
html[data-theme="dark"] .lottery-shell .robot-modal-head { border-bottom-color: #2a405e; background: rgba(16, 29, 49, .98); }
html[data-theme="dark"] .lottery-shell .robot-modal-close { color: #b8c6d9; background: #1b2c46; }
html[data-theme="dark"] .lottery-shell .robot-modal-stats span,
html[data-theme="dark"] .lottery-shell .robot-history-chart,
html[data-theme="dark"] .lottery-shell .robot-history-table { border-color: #2b405e; color: #dce7f6; background: #111f34; }
html[data-theme="dark"] .lottery-shell .robot-modal-stats strong { color: #edf4ff; }
html[data-theme="dark"] .lottery-shell .robot-rule-note { border-color: #2b4d79; color: #aebdd0; background: #132744; }
html[data-theme="dark"] .lottery-shell .error-banner { border-color: #693342; color: #ff9bab; background: #321824; }
html[data-theme="dark"] .lottery-shell .skeleton-card { background: #111f34; }
html[data-theme="dark"] .lottery-shell .skeleton { background: linear-gradient(90deg, #172a45, #213958, #172a45); background-size: 220% 100%; }
html[data-theme="dark"] .lottery-shell > .site-footer { color: #8295ae; }
html[data-theme="dark"] .lottery-shell > .site-footer strong { color: #afbed2; }

/* Route detector — dark template. */
html[data-theme="dark"] .line-page {
  background:
    radial-gradient(circle at 12% 0%, rgba(53, 104, 221, .2), transparent 30rem),
    linear-gradient(180deg, #081321 0%, #0a1728 100%);
}
html[data-theme="dark"] .line-shell { border-color: #2a405f; background: rgba(12, 24, 41, .96); box-shadow: 0 30px 90px rgba(0,0,0,.34); }
html[data-theme="dark"] .line-hero { background: linear-gradient(125deg, #183d9e 0%, #285ec9 56%, #366fca 100%); }
html[data-theme="dark"] .progress-panel,
html[data-theme="dark"] .route-card,
html[data-theme="dark"] .retry-button,
html[data-theme="dark"] .result-panel,
html[data-theme="dark"] .error-panel {
  border-color: #2c4261;
  color: #eaf2ff;
  background: #111f34;
}
html[data-theme="dark"] .progress-track { background: #1b2e49; }
html[data-theme="dark"] .progress-panel p,
html[data-theme="dark"] .route-name span,
html[data-theme="dark"] .metric small,
html[data-theme="dark"] .site-footer { color: #91a3bb; }
html[data-theme="dark"] .route-name strong,
html[data-theme="dark"] .metric strong,
html[data-theme="dark"] .section-heading h2 { color: #edf4ff; }
html[data-theme="dark"] .route-card.is-best { border-color: #4d7de8; background: linear-gradient(90deg, #152a49, #111f34); }
html[data-theme="dark"] .route-card.is-down { background: #0e1b2e; }
html[data-theme="dark"] .best-label { color: #9db9ff !important; background: #1b345d; }

@media (max-width: 768px) {
  .page-shell .category-button,
  .page-shell .category-button.fixed-primary-category {
    height: 44px;
    min-height: 44px;
    gap: 5px;
    padding: 0 8px;
    font-size: 13px;
  }
  .page-shell .category-button::before { width: 21px; height: 21px; border-radius: 7px; font-size: 10px; }
  .page-shell .pk16-category-title { min-height: 44px; }
  .page-shell .card { min-height: 122px; }
  .page-shell .game-card { min-height: 114px; }
  .common-tools-heading { min-height: 70px; }
  .collector-catalog-head { min-height: 96px; }
}

@media (max-width: 600px) {
  .theme-mode-toggle {
    right: 16px;
    bottom: calc(84px + env(safe-area-inset-bottom));
    width: 54px;
    height: 54px;
    padding: 0;
    border-radius: 50%;
  }
  .theme-mode-icon { width: 25px; height: 25px; border-radius: 50%; font-size: 20px; }
  .theme-mode-label { display: none; }
  body:not(.theme-has-service) .theme-mode-toggle { bottom: calc(18px + env(safe-area-inset-bottom)); }
  .page-shell .service-float-btn {
    right: 16px;
    bottom: calc(18px + env(safe-area-inset-bottom, 0px));
    width: 54px;
    height: 54px;
    padding: 0;
  }
  .common-tool-card { min-height: 112px; }
}

@media (max-width: 390px) {
  .page-shell .category-button,
  .page-shell .category-button.fixed-primary-category { gap: 4px; padding: 0 6px; font-size: 12px; }
  .page-shell .category-button::before { width: 19px; height: 19px; font-size: 9px; }
}

@media (prefers-reduced-motion: reduce) {
  .theme-mode-toggle,
  .page-shell .service-float-btn,
  .page-shell .service-float-btn b { animation: none; }
  .theme-mode-toggle { transition: none; }
}