/* Kuaima OJ theme system. The saved preference defaults to light on first visit. */
html[data-km-theme="dark"] {
  color-scheme: dark;
  --km-night-bg: #0b1220;
  --km-night-surface: #111b2b;
  --km-night-raised: #17243a;
  --km-night-hover: #1e3049;
  --km-night-border: #2a3b52;
  --km-night-border-strong: #3b526e;
  --km-night-text: #e5edf7;
  --km-night-muted: #a7b6ca;
  --km-night-subtle: #8497b0;
  --km-night-link: #b5cefa;
  --km-night-accent: #a9c8f5;
  --km-night-accent-soft: #23334c;
  --km-night-shadow: 0 14px 38px rgba(0, 0, 0, .34);
}

/* Opaque Hydro page shells were the main source of the old light patches. */
html[data-km-theme="dark"],
html[data-km-theme="dark"] body,
html[data-km-theme="dark"] #panel,
html[data-km-theme="dark"] .slideout-panel,
html[data-km-theme="dark"] .km-live-shell,
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) #panel,
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) .main,
html[data-km-theme="dark"] body:has(.km-contest-hero) .main,
html[data-km-theme="dark"] body:has(.km-problem-topbar) .main {
  color: var(--km-night-text) !important;
  background-color: var(--km-night-bg) !important;
}
html[data-km-theme="dark"] body,
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) { min-height: 100vh; }

/* Shared surfaces across Hydro pages and the Kuaima-specific sections. */
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  .section,
  .km-card,
  .km-draw-card,
  .km-growth,
  .km-profile-panel,
  .km-profile-mini,
  .km-profile-sidebar,
  .km-profile-left,
  .km-profile-awards,
  .km-profile-equipped,
  .km-profile-growth,
  .km-profile-feed,
  .km-problem-card,
  .km-list-surface,
  .km-community-post,
  .km-award-card,
  .km-ranking-card,
  .kt-workspace,
  .kt-side-card,
  .kt-leaderboard,
  .km-footer-top,
  .km-footer-bottom
) {
  color: var(--km-night-text) !important;
  background-color: var(--km-night-surface) !important;
  border-color: var(--km-night-border) !important;
  box-shadow: none;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  .section__header,
  .section__body,
  .section__footer,
  .km-profile-section-head,
  .km-profile-tabs,
  .km-profile-table-scroll,
  .km-community-heading,
  .km-training-search,
  .km-filter-popover,
  .km-tag-popover,
  .km-contest-filters,
  .km-contest-score-tools,
  .km-record-page form .section,
  .kt-toolbar,
  .kt-stats,
  .kt-under-code,
  .kt-side-divider,
  .kt-library-tabs,
  .kt-filter-tags,
  .kt-library-footer,
  .km-ide-statement-tabs,
  .km-ide-tab-panel
) {
  color: var(--km-night-text) !important;
  background-color: var(--km-night-surface) !important;
  border-color: var(--km-night-border) !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  .km-profile-page,
  .km-home,
  .km-prototype,
  .km-community-page,
  .km-contest-page,
  .km-record-page,
  .km-problem-page,
  .km-training-page,
  .km-training-detail,
  .km-draw-layout,
  .km-typing,
  .km-awards-page,
  .km-ranking-page
) { color: var(--km-night-text) !important; }

/* Readable hierarchy; award/rank colors are intentionally excluded below. */
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  h1, h2, h3, h4, h5,
  .section__title,
  .km-page-heading h1,
  .km-page-heading h2,
  .km-community-post h2 a,
  .km-training-title,
  .km-post-header h1,
  .km-post-page .topic__content,
  .km-contest-title,
  .km-profile-panel h2,
  .km-profile-section-head h2,
  .km-profile-feed a,
  .kt-heading h1,
  .kt-side-card h2,
  .kt-side-card h3,
  .kt-rank-heading h2,
  .km-footer-company,
  .km-footer-links a
) { color: var(--km-night-text) !important; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  .km-muted,
  .km-page-heading p,
  .km-page-heading small,
  .km-community-meta,
  .km-training-meta,
  .km-training-id,
  .km-row-meta,
  .km-profile-empty,
  .km-profile-note,
  .km-mini-caption,
  .km-heat-legend,
  .km-footer-company small,
  .km-footer-bottom,
  .km-record-page label,
  .km-filter-label,
  .km-pf-meta,
  .kt-eyebrow,
  .kt-small-label,
  .kt-heading p,
  .kt-code-head,
  .kt-side-card p,
  .kt-rules li,
  .kt-rank-note,
  .kt-rank-heading p,
  .kt-under-code > span
) { color: var(--km-night-muted) !important; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) a:not(
  .km-difficulty, .km-state, .km-button, .button, .kt-library-change,
  .km-profile-name, .user-profile-name, .user-profile-link,
  .km-name-green, .km-name-teal, .km-name-blue, .km-name-purple, .km-name-gold, .km-name-red,
  .problem__tag-link, .contest-type-tag, .record-status--text, .training-section-status--text
) { color: var(--km-night-link) !important; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) a:not(
  .km-name-green, .km-name-teal, .km-name-blue, .km-name-purple, .km-name-gold, .km-name-red
):hover { color: #d6e5ff !important; }

/* Tables, forms, filters and selected pagination. */
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  .data-table, .km-profile-table, .km-library-table table,
  .kt-library-table table, .kt-leaderboard table
) { color: var(--km-night-text) !important; background: transparent !important; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  .data-table th, .km-library-table th, .kt-library-table th, .kt-leaderboard th
) {
  color: #b5c3d7 !important;
  background: #17263b !important;
  border-color: var(--km-night-border) !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  .data-table td, .km-library-table td, .kt-library-table td, .kt-leaderboard td
) { color: var(--km-night-text); border-color: var(--km-night-border) !important; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  .data-table tbody tr, .km-library-table tbody tr, .kt-library-table tbody tr, .kt-leaderboard tbody tr
) { background: var(--km-night-surface) !important; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  .data-table tbody tr:hover, .km-library-table .kt-lesson-row:hover,
  .kt-library-table .kt-lesson-row:hover, .km-library-table .kt-selected, .kt-library-table .kt-selected
) { background: var(--km-night-hover) !important; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
  select, textarea, .textbox, .select,
  .km-training-search input, .km-profile-search, .km-profile-filter, .km-contest-search,
  .kt-library-filters input, .kt-library-filters select, .kt-toolbar select, .kt-library-open,
  .km-tag-dialog
) {
  color: var(--km-night-text) !important;
  background-color: #0e1929 !important;
  border-color: var(--km-night-border-strong) !important;
  box-shadow: none;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(input, textarea, select)::placeholder { color: #8092a9 !important; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(input, textarea, select, button, a, summary):focus-visible { outline-color: #9fc5ff; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  .km-filter-popover, .km-tag-popover, .km-library, .km-account-dropdown,
  .dropdown-menu, .dialog, .reveal-modal, dialog:not(.km-news-paper)
) {
  color: var(--km-night-text) !important;
  background-color: var(--km-night-raised) !important;
  border-color: var(--km-night-border) !important;
  box-shadow: var(--km-night-shadow) !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  .km-tag-group h3, .km-tag-chip, .km-filter-options span, .km-filter-label, .km-filter-line
) {
  color: #c5d1e2 !important;
  background-color: #1a2a40 !important;
  border-color: var(--km-night-border) !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  .km-tag-chip.selected, .km-tag-selected .km-tag-chip, .km-filter-options input:checked + span
) {
  color: #e8f1ff !important;
  background-color: #2a4262 !important;
  border-color: #6282a9 !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) .pager .pager__item,
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) .pager .pager__item a {
  color: #b6c5d9 !important;
  background: var(--km-night-raised) !important;
  border-color: var(--km-night-border) !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) .pager .pager__item.current,
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) .pager .pager__item.current a {
  color: #fff !important;
  background: #476b99 !important;
  border-color: #476b99 !important;
}

/* Keep difficulty, contest, award and OJ-status colors recognizable. */
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  .km-state, .km-profile-tag, .km-topic-tag, .km-side-tag, .kt-library-tag,
  .km-problem__tag, .problem__tag-item, .km-list-tabs a, .km-list-tabs button
) { border-color: var(--km-night-border) !important; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(.km-profile-tag, .km-topic-tag, .km-side-tag, .kt-library-tag),
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) .km-state:not(.done):not(.muted) {
  background: #1b2b42 !important;
  color: #c1cee0 !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(.km-state.done, .km-list-state.ongoing) {
  color: #86d9b4 !important;
  background-color: #17372f !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) .km-state.muted {
  color: #a9b6c8 !important;
  background-color: #1b2739 !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) .km-list-state.upcoming {
  color: #c7b17d !important;
  background-color: #332e22 !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  .km-list-tabs a.active, .km-profile-tabs a[aria-current="page"], .km-profile-tabs .selected,
  .km-profile-tabs .active
) {
  color: #e1edff !important;
  background: #1a2b41 !important;
  border-color: #7e9fc5 !important;
}

/* Readable problem statements, Markdown discussions and sample code. */
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(.problem-content, .topic__content, .typo, .richmedia) {
  color: var(--km-night-text);
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  pre, code, .km-code-block, .problem-content pre, .topic__content pre, .sample pre
) {
  color: #dce8f7 !important;
  background-color: #0a1422 !important;
  border-color: var(--km-night-border) !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(blockquote, hr, .km-post-header, .km-community-post, .km-profile-feed, .km-profile-tabs) {
  border-color: var(--km-night-border) !important;
}

/* Home map, profile, contest, badge collection and community details. */
html[data-km-theme="dark"] .km-home .km-card,
html[data-km-theme="dark"] .km-home .section,
html[data-km-theme="dark"] .km-home .learning-path,
html[data-km-theme="dark"] .km-draw-card,
html[data-km-theme="dark"] .km-list-surface { background: var(--km-night-surface) !important; }
html[data-km-theme="dark"] .km-home .km-guide a,
html[data-km-theme="dark"] .km-recommend-card,
html[data-km-theme="dark"] .km-recommend-title,
html[data-km-theme="dark"] .km-draw-banner { background: #142238 !important; border-color: var(--km-night-border) !important; }
html[data-km-theme="dark"] .km-home .km-recommend-title a,
html[data-km-theme="dark"] .km-home-post h3 a,
html[data-km-theme="dark"] .km-home .km-guide a { color: var(--km-night-text) !important; }
html[data-km-theme="dark"] .km-home .km-links a,
html[data-km-theme="dark"] .km-home .km-muted,
html[data-km-theme="dark"] .km-home .km-empty { color: var(--km-night-muted) !important; }
html[data-km-theme="dark"] .km-home .pixel-map,
html[data-km-theme="dark"] .pixel-map { background: linear-gradient(#14243a, #20354a) !important; }
html[data-km-theme="dark"] .pixel-map .map-cloud { opacity: .42; }
html[data-km-theme="dark"] .km-profile-banner,
html[data-km-theme="dark"] .km-contest-hero,
html[data-km-theme="dark"] .km-contest-heading {
  color: var(--km-night-text) !important;
  background: linear-gradient(115deg, #14243a, #1b2d46 62%, #20334d) !important;
}
html[data-km-theme="dark"] .km-profile-numbers,
html[data-km-theme="dark"] .km-profile-mini,
html[data-km-theme="dark"] .km-profile-ac,
html[data-km-theme="dark"] .km-post-header,
html[data-km-theme="dark"] .km-community-heading { border-color: var(--km-night-border) !important; }
html[data-km-theme="dark"] .km-contest-status,
html[data-km-theme="dark"] .km-contest-host,
html[data-km-theme="dark"] .km-contest-meta,
html[data-km-theme="dark"] .km-contest-finish-note { color: #c1cee0 !important; }
html[data-km-theme="dark"] .km-draw-layout .km-draw-banner,
html[data-km-theme="dark"] .km-draw-card { color: var(--km-night-text) !important; }

/* Typing practice and editor chrome; Monaco follows the site theme by default. */
html[data-km-theme="dark"] .km-typing :is(.kt-workspace, .kt-side-card, .kt-leaderboard, .kt-library) {
  background: var(--km-night-surface) !important;
}
html[data-km-theme="dark"] .km-typing .kt-stage,
html[data-km-theme="dark"] .km-typing .kt-stage:focus-within { background: #0b1422 !important; }
html[data-km-theme="dark"] .km-typing .kt-stage pre { color: #9baec6 !important; }
html[data-km-theme="dark"] .kt-char.correct { color: #e0e9f7 !important; }
html[data-km-theme="dark"] .kt-char.wrong { color: #ffe1bb !important; background: #55302d !important; }
html[data-km-theme="dark"] .kt-char.current::before { background: #a9c8f5 !important; }
html[data-km-theme="dark"] .kt-line::before,
html[data-km-theme="dark"] .kt-char.newline { color: #71849d !important; }
html[data-km-theme="dark"] #kt-focus-hint { color: #c2cfe1 !important; background: #18263a !important; border-color: #344861 !important; }
html[data-km-theme="dark"] .kt-progress-track { background: #243349 !important; }
html[data-km-theme="dark"] body.km-ide-page :is(.scratchpad__toolbar, .km-editor-tools, .km-ide-statement-tabs, .km-ide-tab-panel) {
  color: var(--km-night-text) !important;
  background-color: var(--km-night-surface) !important;
  border-color: var(--km-night-border) !important;
}
html[data-km-theme="dark"] body.km-ide-page .km-editor-tools :is(button, select) {
  color: #d4e0f0 !important;
  background-color: #17243a !important;
  border-color: var(--km-night-border) !important;
}

/* Main navigation reuses Kuaima's visual language in a quieter midnight tone. */
html[data-km-theme="dark"] .km-topbar {
  color: var(--km-night-text) !important;
  background: rgba(14, 23, 37, .97) !important;
  border-bottom-color: var(--km-night-border) !important;
  box-shadow: 0 3px 16px rgba(0, 0, 0, .2) !important;
  backdrop-filter: blur(14px);
}
html[data-km-theme="dark"] .km-primary-nav a,
html[data-km-theme="dark"] .km-nav-bell { color: #afbed2 !important; }
html[data-km-theme="dark"] .km-primary-nav a.active { color: #e5edf7 !important; }
html[data-km-theme="dark"] .km-primary-nav a.active::after { background: #9fc5ff !important; }
@media (hover: hover) {
  html[data-km-theme="dark"] .km-primary-nav a:hover::before,
  html[data-km-theme="dark"] .km-primary-nav a:focus-visible::before { background: #21314a !important; }
}
html[data-km-theme="dark"] .km-nav-search { background: #0b1422 !important; border-color: #304057 !important; }
html[data-km-theme="dark"] .km-nav-search label,
html[data-km-theme="dark"] .km-nav-search button { color: #a6b5c9 !important; border-color: var(--km-night-border) !important; }
html[data-km-theme="dark"] .km-nav-search input { color: var(--km-night-text) !important; }
html[data-km-theme="dark"] .km-nav-search input::placeholder { color: #74859c !important; }
html[data-km-theme="dark"] .km-nav-bell { border-left-color: var(--km-night-border) !important; }
html[data-km-theme="dark"] .km-account-menu summary { color: #bed2f0 !important; background: #1c2d44 !important; border-color: #3e5571 !important; }
html[data-km-theme="dark"] .km-account-dropdown a:hover { color: #d6e5ff !important; background: #21314a !important; }

/* Sun / moon selector, placed beside notification/avatar and on the problem bar. */
.km-theme-switch {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 2px;
  height: 30px;
  padding: 3px;
  box-sizing: border-box;
  border: 1px solid #e3e6ec;
  border-radius: 999px;
  background: #f6f7fa;
}
.km-theme-switch button {
  display: grid;
  place-items: center;
  width: 25px;
  height: 22px;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 999px;
  color: #8792a2;
  background: transparent;
  cursor: pointer;
  transition: color .16s ease, background-color .16s ease, box-shadow .16s ease;
}
.km-theme-switch button svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.km-theme-switch button[aria-pressed="true"] {
  color: #715bd2;
  background: #fff;
  box-shadow: 0 1px 4px rgba(27, 35, 54, .14);
}
.km-theme-switch button:hover { color: #5f4db5; }
.km-theme-switch button:focus-visible { outline: 2px solid #927ee5; outline-offset: 2px; }
html[data-km-theme="dark"] .km-theme-switch { background: #0b1422; border-color: #34465c; }
html[data-km-theme="dark"] .km-theme-switch button { color: #8292a9; }
html[data-km-theme="dark"] .km-theme-switch button[aria-pressed="true"] {
  color: #e5edf7;
  background: #263c58;
  box-shadow: inset 0 0 0 1px #486789;
}
html[data-km-theme="dark"] .km-theme-switch button:hover { color: #d8e8ff; }
.km-navigation-inner > .km-theme-switch { margin-left: -10px; }
@media (max-width: 900px) { .km-navigation-inner > .km-theme-switch { margin-left: auto; } }
.km-problem-topbar .km-theme-switch {
  margin-left: auto;
  border-color: rgba(230, 238, 255, .28);
  background: rgba(7, 14, 25, .26);
}
.km-problem-topbar .km-theme-switch button { color: #b4c1d8; }
.km-problem-topbar .km-theme-switch button[aria-pressed="true"] { color: #6557bc; background: #eef0ff; }
html[data-km-theme="dark"] .km-problem-topbar .km-theme-switch { border-color: #536280; background: #101a2b; }
html[data-km-theme="dark"] .km-problem-topbar .km-theme-switch button[aria-pressed="true"] { color: #e5edf7; background: #2b415e; }

/* The problem-only navigation remains distinct, but follows the same palette. */
html[data-km-theme="dark"] .km-problem-topbar {
  color: var(--km-night-text) !important;
  background: linear-gradient(108deg, #14243a 0%, #192b44 52%, #20334d 100%) !important;
  border-bottom-color: #34435e !important;
  box-shadow: 0 3px 16px rgba(0, 0, 0, .32) !important;
}
html[data-km-theme="dark"] .km-problem-topbar::before { opacity: .11; }
html[data-km-theme="dark"] .km-problem-topbar::after { opacity: .38; }
html[data-km-theme="dark"] .km-problem-topbar__copy strong { color: #e4ebf5 !important; }
html[data-km-theme="dark"] .km-problem-topbar__copy small { color: #aabbd2 !important; }

/* Preserve the bulletin's frame; darken only the reading surface. */
html[data-km-theme="dark"] .km-news-paper {
  color: #e4ebf5 !important;
  background: #152238 !important;
  border-color: #35445c !important;
}
html[data-km-theme="dark"] .km-news-paper :is(.km-news-head, .km-news-meta, .km-news-summary, .km-news-lead, .km-news-body, .km-news-status) { color: #d7e1ef !important; }
html[data-km-theme="dark"] .km-news-paper a { color: #b4caff !important; }
html[data-km-theme="dark"] .km-news-paper :is(hr, .km-news-head) { border-color: #34445b !important; }

html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) ::selection { color: #f5f8ff; background: #38577e; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) ::-webkit-scrollbar-thumb { background-color: #344861; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) ::-webkit-scrollbar-track { background-color: #101a29; }
@media (max-width: 620px) {
  .km-navigation-inner > .km-theme-switch { margin-left: 0; }
  .km-topbar .km-theme-switch { height: 29px; }
  .km-topbar .km-theme-switch button { width: 24px; height: 21px; }
}
@media (prefers-reduced-motion: reduce) { .km-theme-switch button { transition: none; } }

/* Components with their own HTOJ-inspired light palettes need a local night surface too. */
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  .km-training-content,
  .km-contest-content,
  .km-contest-tabs > [aria-current="page"],
  .km-contest-menu,
  .km-contest-exports > div,
  .km-contest-clock b,
  .km-training-members[open],
  .km-rating-rules,
  .km-wallet,
  .km-badge-cell,
  .km-results,
  .km-application,
  .km-award-row
) {
  color: var(--km-night-text) !important;
  background-color: var(--km-night-surface) !important;
  border-color: var(--km-night-border) !important;
}
html[data-km-theme="dark"] .km-training-hero::before {
  background:
    linear-gradient(180deg, transparent, #0b1220),
    linear-gradient(90deg, #8fb5e218 1px, transparent 1px),
    linear-gradient(#8fb5e218 1px, transparent 1px), #172943 !important;
  background-size: auto, 24px 24px, 24px 24px, auto !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  .km-training-tabs a.active,
  .km-stage-switcher button:not([aria-pressed="true"]),
  .km-badge-cell button,
  .km-contest-share,
  .km-contest-more > summary,
  .km-contest-tabs > a[aria-current="page"]
) {
  color: #cedbed !important;
  background-color: #1a2a40 !important;
  border-color: var(--km-night-border) !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  .km-training-tabs a.active,
  .km-contest-tabs > [aria-current="page"]
) { color: #e5edf7 !important; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  .km-training-content,
  .km-contest-content
) :is(.data-table tbody tr:nth-child(odd), .data-table tbody tr:nth-child(even)) {
  background: var(--km-night-surface) !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  .km-training-stage-list .data-table tbody tr:hover,
  .km-contest-content .data-table tbody tr:hover,
  .km-training-stage-list .data-table tbody tr:nth-child(odd),
  .km-contest-content .data-table tbody tr:nth-child(odd)
) { background: var(--km-night-hover) !important; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(
  .km-training-breadcrumb,
  .km-training-breadcrumb a,
  .km-training-breadcrumb [aria-current],
  .km-training-subtitle,
  .km-training-progress,
  .km-training-tools,
  .km-contest-breadcrumb,
  .km-contest-meta,
  .km-contest-meta b,
  .km-contest-host,
  .km-contest-clock-row,
  .km-contest-clock b,
  .km-contest-materials,
  .training-section-status--text,
  .col--ratio > span,
  .km-training-tags span,
  .km-profile-award-line,
  .km-profile-award-result,
  .km-rating-rules,
  .km-wallet small,
  .km-history-row,
  .km-history-row time
) { color: var(--km-night-muted) !important; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(.km-badge-cell[data-equipped="true"], .km-badge-cell[data-equipped="true"] button) {
  color: #dce9fb !important;
  background: #1d3149 !important;
  border-color: #526e90 !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) .km-application :is(input, select, textarea) {
  color: var(--km-night-text) !important;
  background: #0e1929 !important;
  border-color: var(--km-night-border-strong) !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(.km-award-notices, .km-award-notices a) {
  color: var(--km-night-text) !important;
  background-color: var(--km-night-raised) !important;
  border-color: var(--km-night-border) !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) .km-award-notices :is(h3, p) { color: var(--km-night-muted) !important; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(.km-rating-rules summary, .km-training-breadcrumb a) { color: #b5cefa !important; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) .km-growth p,
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) .km-rating-rules p { color: var(--km-night-muted) !important; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) .km-training-tags span {
  color: #c7d3e4 !important;
  background: #1b2b42 !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) .km-button.secondary {
  color: #d4e3f8 !important;
  background: #1a2a40 !important;
  border-color: #3b526e !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(.km-home .km-side-wallet, .km-side-wallet, .km-side-hint) { color: var(--km-night-muted) !important; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(#draw-result, #dialog) {
  color: var(--km-night-text) !important;
  background: var(--km-night-raised) !important;
  border-color: var(--km-night-border) !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) #draw-result[data-rarity="UR"] {
  background: radial-gradient(ellipse at 50% 45%, #173a38, #142438 72%) !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) #draw-result[data-rarity="UR"] h2 { color: #8ed6c1 !important; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) :is(.km-home-post, .km-home-post-meta, .km-discussion-excerpt) {
  border-color: var(--km-night-border) !important;
  color: var(--km-night-muted) !important;
}

/* Live visual QA: retain readable contrast in legacy metadata and pixel-map links. */
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) .problem__tag-item {
  background: #1c2b40 !important; color: #c4d2e5 !important; border-color: #31435b !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) .learning-topic {
  background: #23384b !important; border-color: #4a6574 !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) .learning-topic strong { color: #e0ebf3 !important; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) .learning-tabs button { color: #b8cce0 !important; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) .learning-tabs button[aria-pressed="true"] {
  background: #294650 !important; color: #dbf2ee !important; border-color: #507678 !important;
}
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) .km-recommend-tabs button,
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) .map-hud { color: #c0cfe2 !important; }
html[data-km-theme="dark"] :is(.km-live-shell, .slideout-panel) .map-hud button { background: #263d54 !important; color: #e1eaf5 !important; }
html[data-km-theme="dark"] .km-brand-logo { background: #e8eef5; padding: 4px 6px; border-radius: 6px; }

/* Legacy Hydro pages and body-mounted dialogs do not live inside km-live-shell. */
html[data-km-theme="dark"] :is(.km-site-footer,.footer,.km-discussion-rules,.km-pf-popup,.km-tag-dialog) {
 background:var(--km-night-surface)!important;color:var(--km-night-text)!important;border-color:var(--km-night-border)!important;
}
html[data-km-theme="dark"] :is(.km-discussion-rules h2,.km-discussion-rules h3,.km-footer-wechat strong,.km-mini-stats b,.km-profile-numbers b,.km-pf-field>span,.km-tag-group h3) {color:var(--km-night-text)!important}
html[data-km-theme="dark"] :is(.km-discussion-rules ol,.km-mini-stats,.km-profile-numbers,.km-tag-tabs button) {color:var(--km-night-muted)!important}
html[data-km-theme="dark"] :is(.km-pf summary,.km-tag-chip,.km-tag-group h3,.km-tag-search) {background:#1b2b40!important;color:#c6d4e6!important;border-color:#344961!important}
html[data-km-theme="dark"] :is(.km-pf-popup label:hover,.km-tag-chip:hover,.km-tag-chip[aria-pressed="true"]) {background:#2a405b!important;color:#e5edf7!important}
html[data-km-theme="dark"] :is(.km-tag-head,.km-tag-tools,.km-tag-group,.km-tag-footer,.km-tag-tabs button.active) {border-color:#344961!important}
html[data-km-theme="dark"] .km-tag-tabs button.active {color:#c9dcff!important}
html[data-km-theme="dark"] .km-profile-equipped.km-physics-stage {background:transparent!important;border:0!important;box-shadow:none!important}
html[data-km-theme="dark"] :is(.km-mini-heat i,.km-heatmap button) {background:#233046!important}
html[data-km-theme="dark"] :is(.km-mini-heat,.km-heatmap) [data-level="1"] {background:#3c3e69!important}
html[data-km-theme="dark"] :is(.km-mini-heat,.km-heatmap) [data-level="2"] {background:#62528f!important}
html[data-km-theme="dark"] :is(.km-mini-heat,.km-heatmap) [data-level="3"] {background:#9071be!important}
html[data-km-theme="dark"] :is(.km-mini-heat,.km-heatmap) [data-level="4"] {background:#bd96ec!important}
/* Semantic names: same ranks, adapted luminance; no styling of ordinary prose. */
html[data-km-theme="dark"] .user-profile-name {color:#cbd6e5!important}
html[data-km-theme="dark"] .km-name-green {color:#73ce8b!important}
html[data-km-theme="dark"] .km-name-teal {color:#66d1c5!important}
html[data-km-theme="dark"] .km-name-blue {color:#80b0ff!important}
html[data-km-theme="dark"] .km-name-purple {color:#d398ee!important}
html[data-km-theme="dark"] .km-name-gold {color:#edc16e!important}
html[data-km-theme="dark"] .km-name-red {color:#ff858d!important}
html[data-km-theme="dark"] .slideout-panel .user-profile-badge {background:#263851!important;color:#c7d7ec!important;border-color:#3a506d!important;box-shadow:none!important}
html[data-km-theme="dark"] .slideout-panel .data-table :is(td,th,tr) {border-color:#29394e!important}
/* Scratchpad is mounted outside the page shell. Do not recolor Monaco tokens. */
html[data-km-theme="dark"] body.km-ide-page.mode--scratchpad .scratchpad-container {background:#0b1220!important}
html[data-km-theme="dark"] body.km-ide-page.mode--scratchpad :is(.scratchpad__problem,#km-ide-submissions-panel,#km-ide-submissions-frame,.problem-content) {background:#111b2b!important;color:#e5edf7!important}
html[data-km-theme="dark"] body.km-ide-page .problem-content :is(h1,h2,h3,h4) {color:#e5edf7!important}
html[data-km-theme="dark"] body.km-ide-page .problem-content :is(pre,.km-code-frame) {background:#17243a!important;color:#d5e1ef!important;border-color:#2a3b52!important}
html[data-km-theme="dark"] body.km-ide-page .problem-content .km-code-frame>.toolbar>.toolbar-item>span {background:#22334b!important;color:#cedbed!important;border-color:#3b526e!important}
body.km-ide-page.mode--scratchpad:not(.km-ide-light) :is(.scratchpad__toolbar,.scratchpad__panel-title,.scratchpad__tablist,.splitpane-fill:has(>.scratchpad__panel-title)) {background:#17243a!important;color:#cbd9ec!important;border-color:#304159!important}
body.km-ide-page.mode--scratchpad:not(.km-ide-light) :is(.scratchpad__data-input,.km-run-host,.km-run-result) {background:#111b2b!important;color:#dce7f5!important;border-color:#304159!important}
body.km-ide-page.mode--scratchpad:not(.km-ide-light) .scratchpad__toolbar select {background:#22334b!important;color:#dce7f5!important;border-color:#3b526e!important}
/* Explicit light editor choice keeps its own toolbar consistent. */
html[data-km-theme="dark"] body.km-ide-page.km-ide-light :is(.scratchpad__toolbar,.km-editor-tools) {background:#f3f5f9!important;color:#465469!important;border-color:#dce2eb!important}
html[data-km-theme="dark"] body.km-ide-page.km-ide-light .km-editor-tools :is(button,select) {background:#f3f5f9!important;color:#465469!important;border-color:#ccd6e2!important}
/* Nested legacy label/tag declarations carry their own light-mode foreground. */
html[data-km-theme="dark"] .km-pf .km-pf-popup :is(label,span) {color:#c6d4e6!important}
html[data-km-theme="dark"] .slideout-panel .problem__tag-link {background:#22334b!important;color:#cbd9eb!important;border-color:#344961!important}
html[data-km-theme="dark"] .slideout-panel .km-state {color:#abbdd3!important;background:#233146!important}
html[data-km-theme="dark"] .slideout-panel .km-state.done {color:#89d6b0!important;background:#183d35!important}
html[data-km-theme="dark"] :is(.km-difficulty,.km-profile-difficulty).d0 {background:#30394b!important;color:#cad2de!important}
html[data-km-theme="dark"] :is(.km-difficulty,.km-profile-difficulty).d1 {background:#492932!important;color:#ffadb5!important}
html[data-km-theme="dark"] :is(.km-difficulty,.km-profile-difficulty).d2 {background:#493823!important;color:#f5c27c!important}
html[data-km-theme="dark"] :is(.km-difficulty,.km-profile-difficulty).d3 {background:#494126!important;color:#f5d980!important}
html[data-km-theme="dark"] :is(.km-difficulty,.km-profile-difficulty).d4 {background:#223e2d!important;color:#a4de8d!important}
html[data-km-theme="dark"] :is(.km-difficulty,.km-profile-difficulty).d5 {background:#203b54!important;color:#95caff!important}
html[data-km-theme="dark"] :is(.km-difficulty,.km-profile-difficulty).d6 {background:#3c2d50!important;color:#ccaff3!important}
html[data-km-theme="dark"] :is(.km-difficulty,.km-profile-difficulty).d7 {background:#402d48!important;color:#e4b2df!important}

/* September audit: adapt component chrome, never recolor character art or Monaco. */
html[data-km-theme="dark"] .km-home :is(.km-side-stats b,.km-side-task,.km-side-notice) {
  color:var(--km-night-text)!important;
}
html[data-km-theme="dark"] .km-home :is(.km-side-stats span,.km-side-hint,.km-side-wallet,.km-side-task small,.km-side-notice small) {
  color:var(--km-night-muted)!important;
}
html[data-km-theme="dark"] .km-home :is(.km-side-task,.km-side-notice,.km-side-stats>div+div) {
  border-color:var(--km-night-border)!important;
}
html[data-km-theme="dark"] .km-home :is(.km-side-task a,.km-side-tag) {
  background:#28334c!important;color:#d4dfff!important;
}
html[data-km-theme="dark"] .km-home .km-side-task a:hover {
  background:#344561!important;color:#fff!important;
}
html[data-km-theme="dark"] .km-home .km-task-done {
  background:#19392f!important;color:#a2d9b8!important;
}
html[data-km-theme="dark"] .km-footer-wechat span {
  background:#19392f!important;color:#a2d9b8!important;
}
html[data-km-theme="dark"] :is(.km-live-shell,.slideout-panel) .autocomplete-wrapper {
  background:var(--km-night-raised)!important;color:var(--km-night-text)!important;
  border-color:var(--km-night-border)!important;
}
html[data-km-theme="dark"] :is(.km-live-shell,.slideout-panel) a.button:not(.primary):not(.rounded) {
  background:var(--km-night-raised)!important;color:var(--km-night-text)!important;
  border-color:var(--km-night-border)!important;
}
html[data-km-theme="dark"] :is(.km-live-shell,.slideout-panel) a.button:not(.primary):not(.rounded):hover {
  background:var(--km-night-hover)!important;
}
/* Transparent rarity lettering preserves the badge artwork. */
html[data-km-theme="dark"] .badge-art > strong {
  background:transparent!important;color:#e5edf7!important;
  text-shadow:1px 1px 1px #182338,-1px -1px 1px #182338,1px -1px 1px #182338,-1px 1px 1px #182338!important;letter-spacing:0;
  border:0!important;box-shadow:none!important;border-radius:0;padding:0;
}
html[data-km-theme="dark"] .badge-art.rarity-SR > strong {color:#d8b5ff!important}
html[data-km-theme="dark"] .badge-art.rarity-SSR > strong {color:#ffda85!important}
html[data-km-theme="dark"] .badge-art.rarity-UR > strong {color:#ffbcd9!important}
html[data-km-theme="dark"] :is(.km-pretest-run,.km-compose-button):not(:disabled):not([aria-disabled="true"]) {
  background:#2464ad!important;border-color:#4687ce!important;color:#fff!important;
}
html[data-km-theme="dark"] :is(.km-pretest-run,.km-compose-button):not(:disabled):not([aria-disabled="true"]):hover {
  background:#1d548f!important;
}
html[data-km-theme="dark"] .error__container {
  color:var(--km-night-text);background:var(--km-night-surface);
  border:1px solid var(--km-night-border);border-radius:12px;padding:28px;
}
html[data-km-theme="dark"] .error__text-container :is(h1,p,li) {color:var(--km-night-text)!important}

/* Follow-up: Markdown's CodeMirror is separate from the problem Monaco editor. */
html[data-km-theme="dark"] .md-editor {
  --md-color:#e5edf7;--md-hover-color:#fff;
  --md-bk-color:#111b2b;--md-bk-color-outstand:#17243a;--md-bk-hover-color:#23334c;
  --md-border-color:#2a3b52;--md-border-hover-color:#526d90;--md-border-active-color:#8bbcff;
  --md-modal-mask:#0009;--md-modal-shadow:0 12px 35px #0006;
  --md-scrollbar-bg-color:#111b2b;--md-scrollbar-thumb-color:#405672;
  color:var(--md-color)!important;background:var(--md-bk-color)!important;
}
html[data-km-theme="dark"] .md-editor :is(.cm-editor,.cm-scroller,.cm-content,.cm-gutters,.cm-tooltip) {
  background:#111b2b!important;color:#e5edf7!important;border-color:#2a3b52!important;
}
html[data-km-theme="dark"] .md-editor .cm-content {caret-color:#b5cefa!important}
html[data-km-theme="dark"] .md-editor .cm-cursor {border-left-color:#b5cefa!important}
html[data-km-theme="dark"] .md-editor :is(.cm-activeLine,.cm-activeLineGutter) {background:#17243a!important}
html[data-km-theme="dark"] .md-editor .cm-selectionBackground {background:#36527a!important}
html[data-km-theme="dark"] .md-editor .cm-content ::selection {background:#36527a!important}
html[data-km-theme="dark"] .md-editor .cm-line span {color:inherit!important}
html[data-km-theme="dark"] .md-editor :is(.md-editor-toolbar-item,.md-editor-footer) {color:#c4d3e7!important}
html[data-km-theme="dark"] .md-editor .md-editor-toolbar-item:hover:not(:disabled) {background:#23334c!important;color:#fff!important}
html[data-km-theme="dark"] .md-editor .md-editor-toolbar-item:disabled {opacity:.4}
html[data-km-theme="dark"] .md-editor .md-editor-preview {
  --md-theme-color:#e5edf7;--md-theme-link-color:#b5cefa;--md-theme-border-color:#2a3b52;
  --md-theme-bg-color:#111b2b;--md-theme-bg-color-inset:#17243a;
}
html[data-km-theme="dark"] .km-discussion-editor-hint {
  background:#1d2b43!important;color:#c3d1e7!important;border:1px solid #30445f;
}
html[data-km-theme="dark"] .section:has(.md-editor) label {color:#c3d1e7!important}
html[data-km-theme="dark"] .km-live-shell .km-contest-table .contest-type-tag {
  background:#2b2647!important;color:#d6c1ff!important;border:1px solid #494065;
}
html[data-km-theme="dark"] .km-live-shell .km-contest-table .contest-type--gesp {
  background:#17364b!important;color:#a5d5ff!important;border-color:#31576f;
}
html[data-km-theme="dark"] .km-contest-status {background:#263750!important;color:#d1ddec!important}
html[data-km-theme="dark"] .km-contest-status.ongoing {background:#19392f!important;color:#a2d9b8!important}
html[data-km-theme="dark"] .km-contest-status.upcoming {background:#203956!important;color:#b5d7ff!important}
/* Preserve the pixel landscape; tint with a translucent layer, not an opaque replacement. */
html[data-km-theme="dark"] .km-contest-hero {
  background:linear-gradient(115deg,#0b182cbb,#13233d99),url('/km-contest-pixel.svg?v=20260924pixel1') center bottom / cover no-repeat!important;
}
html[data-km-theme="dark"] .km-contest-heading {background:transparent!important}

/* Problem statement surfaces are governed by the site, not the editor toggle. */
html[data-km-theme="dark"] body.km-ide-page :is(.scratchpad__problem,#km-ide-description-panel) blockquote {
  background:#17283e!important;color:#cddbec!important;border-color:#6499cf!important;
}
html[data-km-theme="dark"] body.km-ide-page :is(.scratchpad__problem,#km-ide-description-panel) blockquote :is(p,li) {color:inherit!important}
html[data-km-theme="dark"] body.km-ide-page :is(.scratchpad__problem,#km-ide-description-panel) blockquote.note:before {color:#99c7f5!important}
html[data-km-theme="dark"] body.km-ide-page :is(.scratchpad__problem,#km-ide-description-panel) blockquote.warn {border-color:#d9ad62!important}
html[data-km-theme="dark"] body.km-ide-page :is(.scratchpad__problem,#km-ide-description-panel) blockquote.warn:before {color:#f0cf93!important}
html[data-km-theme="dark"] body.km-ide-page .problem-content :not(pre)>code {
  background:#20324a!important;color:#d8e8fb!important;border:0!important;border-radius:3px;padding:1px 4px;
}
html[data-km-theme="dark"] body.km-ide-page .problem-content pre code {background:transparent!important;color:inherit!important}
/* Keep both self-test columns together, including when a light editor is explicitly selected. */
body.km-ide-page.mode--scratchpad:not(.km-ide-light) :is(.scratchpad__data,.scratchpad__data-output,.scratchpad__data-input,.km-run-host,.km-run-result) {
  background:#111b2b!important;color:#dce7f5!important;border-color:#304159!important;color-scheme:dark;
}
html[data-km-theme] body.km-ide-page.mode--scratchpad.km-ide-light :is(.scratchpad__data,.scratchpad__data-input,.scratchpad__data-output,.km-run-host,.km-run-result) {
  background:#fff!important;color:#334155!important;border-color:#dce2eb!important;color-scheme:light;
}
html[data-km-theme] body.km-ide-page.mode--scratchpad.km-ide-light :is(.scratchpad__panel-title,.scratchpad__toolbar select) {
  background:#f3f5f9!important;color:#465469!important;border-color:#ccd6e2!important;
}