/* SUNION brand tokens adapted to the existing OJ components, without changing routes. */
html[data-sunion-theme="light"] {
  color-scheme:light;
  --sun-bg:#f6f8fb;--sun-panel:#ffffff;--sun-soft:#eef3f8;
  --sun-text:#101828;--sun-muted:#5f6f89;--sun-line:#d9e2ef;
  --sun-accent:#0e7490;--sun-on-accent:#ffffff;--sun-accent-soft:#e7f4f8;
  --sun-success:#047857;--sun-warn:#b45309;--sun-danger:#be123c;
  --sun-code:#eff3f8;--sun-shadow:0 5px 20px rgba(16,24,40,.045);
  --sun-level-1:#b91c1c;--sun-level-2:#c2410c;--sun-level-3:#925800;--sun-level-4:#147837;--sun-level-5:#0e7490;--sun-level-6:#1d4ed8;--sun-level-7:#7e22ce;--sun-level-8:#334155;
  --sun-level-8-bg:#334155;--sun-level-8-text:#f1f5f9;--sun-level-8-line:#94a3b8;
  --sun-topic-expression:#0e7490;--sun-topic-data:#b45309;--sun-topic-algorithms:#047857;
  --sun-topic-states:#1d4ed8;--sun-topic-composite:#a21caf;--sun-topic-advanced:#b45309;
}
html[data-sunion-theme="dark"] {
  color-scheme:dark;
  --sun-bg:#07111f;--sun-panel:#101c2f;--sun-soft:#16253b;
  --sun-text:#e5edf7;--sun-muted:#a7b6cc;--sun-line:#293d57;
  --sun-accent:#22d3ee;--sun-on-accent:#08111f;--sun-accent-soft:#123345;
  --sun-success:#4ade80;--sun-warn:#fbbf24;--sun-danger:#fb7185;
  --sun-code:#08111f;--sun-shadow:0 8px 26px rgba(0,0,0,.16);
  --sun-level-1:#f87171;--sun-level-2:#fb923c;--sun-level-3:#facc15;--sun-level-4:#4ade80;--sun-level-5:#22d3ee;--sun-level-6:#60a5fa;--sun-level-7:#c084fc;--sun-level-8:#334155;
  --sun-level-8-bg:#334155;--sun-level-8-text:#f1f5f9;--sun-level-8-line:#94a3b8;
  --sun-topic-expression:#22d3ee;--sun-topic-data:#fbbf24;--sun-topic-algorithms:#4ade80;
  --sun-topic-states:#60a5fa;--sun-topic-composite:#e879f9;--sun-topic-advanced:#fbbf24;
}
html[data-sunion-theme] body {
  background:var(--sun-bg)!important;color:var(--sun-text)!important;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif!important;
  -webkit-font-smoothing:antialiased;
}
html[data-sunion-theme] body #app {color:var(--sun-text)}
html[data-sunion-theme] body #header,html[data-sunion-theme] body .mobile-nav,
html[data-sunion-theme] body .el-menu,html[data-sunion-theme] body .mu-appbar {
  background:var(--sun-panel)!important;color:var(--sun-text)!important;border-color:var(--sun-line)!important;
  box-shadow:none!important;
}
html[data-sunion-theme] body #header {border-bottom:1px solid var(--sun-line)}
html[data-sunion-theme] body .el-menu-item,html[data-sunion-theme] body .el-submenu__title,
html[data-sunion-theme] body .el-menu-item i,html[data-sunion-theme] body .el-submenu__title i,
html[data-sunion-theme] body .el-dropdown-link {color:var(--sun-muted)!important}
html[data-sunion-theme] body .el-menu-item:hover,html[data-sunion-theme] body .el-submenu__title:hover,
html[data-sunion-theme] body .el-menu-item.is-active {background:var(--sun-accent-soft)!important;color:var(--sun-accent)!important;border-color:var(--sun-accent)!important}
html[data-sunion-theme] body .el-card,html[data-sunion-theme] body .el-dialog,
html[data-sunion-theme] body .el-message-box,html[data-sunion-theme] body .el-popover,
html[data-sunion-theme] body .el-popper,html[data-sunion-theme] body .el-dropdown-menu,
html[data-sunion-theme] body .mu-paper,html[data-sunion-theme] body .mu-drawer {
  background:var(--sun-panel)!important;color:var(--sun-text)!important;border-color:var(--sun-line)!important;
}
html[data-sunion-theme] body .el-card {border-radius:12px;box-shadow:var(--sun-shadow)!important}
html[data-sunion-theme] body .el-card__header {border-color:var(--sun-line)}
html[data-sunion-theme] body .el-dialog__title,html[data-sunion-theme] body .el-dialog__body,
html[data-sunion-theme] body .el-form-item__label,html[data-sunion-theme] body .mu-item-title,
html[data-sunion-theme] body .panel-title,html[data-sunion-theme] body .home-title,
html[data-sunion-theme] body .el-tabs__item {color:var(--sun-text)!important}
html[data-sunion-theme] body .el-tabs__item.is-active {color:var(--sun-accent)!important}
html[data-sunion-theme] body .el-tabs__active-bar {background:var(--sun-accent)}
html[data-sunion-theme] body .el-tabs__nav-wrap:after {background:var(--sun-line)}
html[data-sunion-theme] body .el-input__inner,html[data-sunion-theme] body .el-textarea__inner,
html[data-sunion-theme] body .vxe-input,html[data-sunion-theme] body .vxe-input--inner,
html[data-sunion-theme] body .el-select-dropdown,html[data-sunion-theme] body .el-date-picker {
  background:var(--sun-panel)!important;color:var(--sun-text)!important;border-color:var(--sun-line)!important;
}
html[data-sunion-theme] body input::placeholder,html[data-sunion-theme] body textarea::placeholder {color:var(--sun-muted)!important;opacity:.85}
html[data-sunion-theme] body .el-input__inner:focus,html[data-sunion-theme] body .el-textarea__inner:focus {border-color:var(--sun-accent)!important}
html[data-sunion-theme] body .el-button {background:var(--sun-panel);border-color:var(--sun-line);color:var(--sun-text);border-radius:7px}
html[data-sunion-theme] body .el-button--primary {background:var(--sun-accent)!important;border-color:var(--sun-accent)!important;color:var(--sun-on-accent)!important}
html[data-sunion-theme] body .el-button--primary.is-plain {background:var(--sun-accent-soft)!important;color:var(--sun-accent)!important}
html[data-sunion-theme] body .el-button--text {background:transparent!important;border-color:transparent!important;color:var(--sun-accent)!important}
html[data-sunion-theme] body .el-button--success {background:var(--sun-success);color:var(--sun-on-accent)}
html[data-sunion-theme] body .el-button--danger {background:var(--sun-danger);color:var(--sun-on-accent)}
html[data-sunion-theme] body .el-link--primary,html[data-sunion-theme] body a:hover {color:var(--sun-accent)!important}
html[data-sunion-theme] body .el-link--info {color:var(--sun-muted)!important}
html[data-sunion-theme] body .el-link--danger {color:var(--sun-danger)!important}
html[data-sunion-theme] body .el-pagination button,html[data-sunion-theme] body .el-pager li {background:var(--sun-panel)!important;color:var(--sun-muted)!important}
html[data-sunion-theme] body .el-pager li.active {background:var(--sun-accent)!important;color:var(--sun-on-accent)!important}
html[data-sunion-theme] body .el-table,html[data-sunion-theme] body .el-table tr,
html[data-sunion-theme] body .vxe-table,html[data-sunion-theme] body .vxe-table--render-wrapper,
html[data-sunion-theme] body .vxe-table--header-wrapper,html[data-sunion-theme] body .vxe-table--body-wrapper,
html[data-sunion-theme] body .vxe-table--footer-wrapper {
  background:var(--sun-panel)!important;color:var(--sun-text)!important;border-color:var(--sun-line)!important;
}
html[data-sunion-theme] body .el-table th,html[data-sunion-theme] body .vxe-header--column {background:var(--sun-soft)!important;color:var(--sun-muted)!important;font-weight:600}
html[data-sunion-theme] body .el-table td,html[data-sunion-theme] body .vxe-body--column {border-color:var(--sun-line)!important}
html[data-sunion-theme] body .vxe-body--row.row--stripe,html[data-sunion-theme] body .el-table__row--striped td {background:var(--sun-soft)!important}
html[data-sunion-theme] body .vxe-body--row.row--hover,html[data-sunion-theme] body .el-table__body tr:hover>td {background:var(--sun-accent-soft)!important}
html[data-sunion-theme] body .vxe-body--column {padding-top:12px;padding-bottom:12px}
html[data-sunion-theme] body .el-empty__description p,html[data-sunion-theme] body .vxe-table--empty-content {color:var(--sun-muted)!important}
html[data-sunion-theme] body .el-tag {border-radius:5px}
html[data-sunion-theme] body .el-tag--plain {background:var(--sun-panel)!important}
html[data-sunion-theme] body .el-tag--dark {color:var(--sun-on-accent)!important}
html[data-sunion-theme] body .el-tag--info {color:var(--sun-muted);background:var(--sun-soft);border-color:var(--sun-line)}
html[data-sunion-theme] body .el-progress-bar__outer {background:var(--sun-soft)!important}
html[data-sunion-theme] body .el-progress-bar__inner {background:var(--sun-accent)!important}
html[data-sunion-theme] body .el-progress__text {color:var(--sun-muted)!important}
html[data-sunion-theme] body footer {background:var(--sun-panel);color:var(--sun-muted)!important;border-top:1px solid var(--sun-line)}
html[data-sunion-theme] body footer h1 {color:var(--sun-text)}
html[data-sunion-theme] body .markdown-body {color:var(--sun-text)!important;font-size:15px;line-height:1.8}
html[data-sunion-theme] body .markdown-body h1,html[data-sunion-theme] body .markdown-body h2 {color:var(--sun-text)!important;background:transparent!important;border-color:var(--sun-line)!important}
html[data-sunion-theme] body .markdown-body pre,html[data-sunion-theme] body .markdown-body code,
html[data-sunion-theme] body .markdown-body blockquote {background:var(--sun-code)!important;color:var(--sun-text)!important;border-color:var(--sun-accent)!important}
html[data-sunion-theme] body .markdown-body table tr,html[data-sunion-theme] body .markdown-body table th,html[data-sunion-theme] body .markdown-body table td {background:var(--sun-panel)!important;border-color:var(--sun-line)!important}
html[data-sunion-theme] body .learning-header {background:var(--sun-accent-soft)!important;color:var(--sun-text)!important}
html[data-sunion-theme] body .record-status,html[data-sunion-theme] body .help-section,
html[data-sunion-theme] body .node-list li,html[data-sunion-theme] body .training-card,
html[data-sunion-theme] body .advanced-note,html[data-sunion-theme] body .hint-panel,
html[data-sunion-theme] body .help-panel,html[data-sunion-theme] body .classroom-panel {
  background:var(--sun-panel)!important;color:var(--sun-text)!important;border-color:var(--sun-line)!important;
}
html[data-sunion-theme] body .learning-home h1,html[data-sunion-theme] body .learning-home h2,
html[data-sunion-theme] body .learning-home h3,html[data-sunion-theme] body .node-content h3 {color:var(--sun-text)!important}
html[data-sunion-theme] body .muted,html[data-sunion-theme] body .node-content p {color:var(--sun-muted)!important}
html[data-sunion-theme] body #admin-content {background:var(--sun-bg)!important}
html[data-sunion-theme] body .sunion-theme-toggle {
  display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;box-sizing:border-box;flex-shrink:0;
  border:1px solid var(--sun-line);border-radius:7px;background:var(--sun-soft);color:var(--sun-text);font-size:12px;cursor:pointer;white-space:nowrap;
}
html[data-sunion-theme] body .sunion-theme-toggle i {font-size:16px}
.desktop-theme-switch {float:right;margin:14px 12px 0 0}
.admin-theme-switch {position:fixed;right:165px;top:10px;z-index:3000}
html[data-sunion-theme] body .sunion-theme-toggle:focus-visible {outline:3px solid var(--sun-accent);outline-offset:3px}
html[data-sunion-theme] body .mobile-nav .sunion-theme-toggle {margin-right:4px;padding:0 7px}
html[data-sunion-theme] body .mobile-nav .mu-button {min-width:45px;padding:0 6px;color:var(--sun-text)}
html[data-sunion-theme] body .mobile-nav .mu-appbar-title {font-size:18px}
html[data-sunion-theme] body .curriculum-filter {align-items:flex-start;margin-bottom:0}
html[data-sunion-theme] body .simple-training-filters {flex:1;min-width:0}
html[data-sunion-theme] body .level-strip,html[data-sunion-theme] body .topic-strip {display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
html[data-sunion-theme] body .level-button,html[data-sunion-theme] body .topic-button {border:1px solid var(--level-color,var(--sun-line));border-radius:5px;padding:7px 11px;background:var(--sun-panel);color:var(--level-color,var(--sun-text));font-size:14px;cursor:pointer;box-shadow:none}
html[data-sunion-theme] body .level-button.active,html[data-sunion-theme] body .topic-button.active {background:var(--level-color,var(--sun-accent));color:var(--sun-on-accent)}
/* Route groups retain their color inheritance without forcing a new layout row. */
html[data-sunion-theme] body .primary-topic-blocks {display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
html[data-sunion-theme] body .primary-topic-blocks > .primary-topic-block {display:contents}
html[data-sunion-theme] body .primary-topic-blocks .topic-button {flex:0 0 auto;white-space:nowrap}
/* Main topics use route-block colors; row-level badges keep independent level tokens. */
html[data-sunion-theme] body .primary-topic-button {border-color:var(--topic-color);color:var(--topic-color)}
html[data-sunion-theme] body .primary-topic-button.active {background:var(--topic-color);color:var(--sun-on-accent)}
html[data-sunion-theme] body .supplementary-tag {color:var(--sun-muted);border-color:var(--sun-line)}
html[data-sunion-theme] body .supplementary-tag.active {background:var(--sun-accent);color:var(--sun-on-accent);border-color:var(--sun-accent)}
html[data-sunion-theme] body .row-level {font-size:12px;color:var(--level-color);border:1px solid var(--level-color);background:transparent;padding:2px 6px;border-radius:4px}
html[data-sunion-theme] body .row-level[data-learning-level="8"] {background:var(--sun-level-8-bg);color:var(--sun-level-8-text);border-color:var(--sun-level-8-line)}
html[data-sunion-theme] body .training-category-tag {background:var(--sun-panel)!important;color:var(--sun-muted)!important;border-color:var(--sun-line)!important}
html[data-sunion-theme] body h1,html[data-sunion-theme] body h2,html[data-sunion-theme] body h3,html[data-sunion-theme] body h4 {color:var(--sun-text)}
html[data-sunion-theme] body .el-alert {background:var(--sun-soft)!important;color:var(--sun-muted)!important}
html[data-sunion-theme] body .el-alert--warning {color:var(--sun-warn)!important}
html[data-sunion-theme] body .el-alert--error {color:var(--sun-danger)!important}
html[data-sunion-theme] body .el-alert--success {color:var(--sun-success)!important}
html[data-sunion-theme] body .el-tag--dark {background:var(--sun-accent);border-color:var(--sun-accent)}
html[data-sunion-theme] body .el-tag--success.el-tag--dark {background:var(--sun-success);border-color:var(--sun-success)}
html[data-sunion-theme] body .el-tag--danger.el-tag--dark {background:var(--sun-danger);border-color:var(--sun-danger)}
html[data-sunion-theme] body .el-tag--warning.el-tag--dark {background:var(--sun-warn);border-color:var(--sun-warn)}
html[data-sunion-theme] body .el-select-dropdown__item {color:var(--sun-text)}
html[data-sunion-theme] body .el-select-dropdown__item.hover,html[data-sunion-theme] body .el-select-dropdown__item:hover {background:var(--sun-accent-soft)}
html[data-sunion-theme] body .el-dropdown-menu__item {color:var(--sun-text)}
html[data-sunion-theme] body .el-dropdown-menu__item:hover {background:var(--sun-accent-soft);color:var(--sun-accent)}
html[data-sunion-theme] body .el-loading-mask {background:var(--sun-panel);opacity:.9}
html[data-sunion-theme] body .el-table:before,html[data-sunion-theme] body .el-table:after {background:var(--sun-line)}
html[data-sunion-theme] body .markdown-body .hljs {background:var(--sun-code)!important;color:var(--sun-text)!important}
html[data-sunion-theme] body .markdown-body .hljs-comment {color:var(--sun-muted)!important}
html[data-sunion-theme] body .markdown-body .hljs-keyword {color:var(--sun-accent)!important}
html[data-sunion-theme] body .markdown-body .hljs-string {color:var(--sun-success)!important}
html[data-sunion-theme] body .markdown-body .hljs-number {color:var(--sun-warn)!important}
html[data-sunion-theme] body #header .el-menu .el-menu-item.is-active,
html[data-sunion-theme] body #header .el-menu .el-menu-item:hover,
html[data-sunion-theme] body #header .el-menu .el-submenu__title:hover {
  background:var(--sun-accent-soft)!important;color:var(--sun-accent)!important;border-color:var(--sun-accent)!important;
}
html[data-sunion-theme] body #header .el-menu .el-menu-item.is-active i {background:none!important;color:var(--sun-accent)!important}
html[data-sunion-theme] body #header-hidden {min-height:62px}
html[data-sunion-theme] body .mobile-nav-spacer {height:56px}
html[data-sunion-theme] body .sunion-logo-dark {display:none}
html[data-sunion-theme="dark"] body .sunion-logo-dark {display:inline-block}
html[data-sunion-theme="dark"] body .sunion-logo-light {display:none}
html[data-sunion-theme] body .vxe-body--column,html[data-sunion-theme] body .vxe-header--column {background-image:none!important;border-bottom:1px solid var(--sun-line)!important}
html[data-sunion-theme] body .vxe-table--border-line {border-color:var(--sun-line)!important}
html[data-sunion-theme] body .el-tabs--border-card,
html[data-sunion-theme] body .el-tabs--border-card>.el-tabs__header,
html[data-sunion-theme] body .el-tabs__nav-wrap,
html[data-sunion-theme] body .card,html[data-sunion-theme] body .binary-unit,
html[data-sunion-theme] body .title-article,html[data-sunion-theme] body .discussion-header,
html[data-sunion-theme] body .signature-body,html[data-sunion-theme] body .description-body,
html[data-sunion-theme] body .login-container {
  background:var(--sun-panel)!important;color:var(--sun-text)!important;border-color:var(--sun-line)!important;
}
html[data-sunion-theme] body .el-tabs--border-card>.el-tabs__header .el-tabs__item.is-active {background:var(--sun-panel)!important;color:var(--sun-accent)!important;border-color:var(--sun-line)!important}
html[data-sunion-theme] body .question-intr {background:var(--sun-soft)!important;color:var(--sun-text)!important;border-color:var(--sun-line)!important;border-left-color:var(--sun-accent)!important}
html[data-sunion-theme] body #problem-content .title {color:var(--sun-accent)!important}
html[data-sunion-theme] body .example pre {background:var(--sun-code)!important;color:var(--sun-text)!important;border-color:var(--sun-line)!important}
html[data-sunion-theme] body .CodeMirror,html[data-sunion-theme] body .CodeMirror-gutters {background:var(--sun-code)!important;color:var(--sun-text)!important;border-color:var(--sun-line)!important}
html[data-sunion-theme] body .CodeMirror-linenumber {color:var(--sun-muted)!important}
html[data-sunion-theme] body .CodeMirror-activeline-background {background:var(--sun-soft)!important}
html[data-sunion-theme] body h1,html[data-sunion-theme] body h2,html[data-sunion-theme] body h3,
html[data-sunion-theme] body h4,html[data-sunion-theme] body h5,html[data-sunion-theme] body h6,
html[data-sunion-theme] body .home-title,html[data-sunion-theme] body .panel-title {font-family:inherit!important}
html[data-sunion-theme] body .home-title :not(i) {font-family:inherit!important}
@media(max-width:700px) {
  html[data-sunion-theme] body .curriculum-filter {display:block}
  html[data-sunion-theme] body .curriculum-filter .training-category {display:block;margin-bottom:10px}
  html[data-sunion-theme] body .level-button,html[data-sunion-theme] body .topic-button {font-size:13px;padding:7px 9px}
  html[data-sunion-theme] body .find-training {font-size:20px}
}

/* Classroom surfaces share the same readable foreground and background tokens. */
html[data-sunion-theme] body .training-hub,
html[data-sunion-theme] body .learning-home,
html[data-sunion-theme] body .teacher-help,
html[data-sunion-theme] body .legacy-lessons {color:var(--sun-text)!important}
html[data-sunion-theme] body .training-tabs,
html[data-sunion-theme] body .classroom-panel .binary-preview,
html[data-sunion-theme] body .assessment-summary,
html[data-sunion-theme] body .classroom-panel .notice,
html[data-sunion-theme] body .classroom-panel .pending,
html[data-sunion-theme] body .classroom-panel .task-list li,
html[data-sunion-theme] body .assessment .status-card,
html[data-sunion-theme] body .teacher-help header,
html[data-sunion-theme] body .teacher-help pre {
 background:var(--sun-panel)!important;color:var(--sun-text)!important;border-color:var(--sun-line)!important;
}
html[data-sunion-theme] body .classroom-panel .binary-preview,
html[data-sunion-theme] body .classroom-panel .notice,
html[data-sunion-theme] body .classroom-panel .pending,
html[data-sunion-theme] body .assessment-summary {background:var(--sun-soft)!important}
html[data-sunion-theme] body .training-tabs a {color:var(--sun-muted)!important}
html[data-sunion-theme] body .training-tabs a.selected {background:var(--sun-accent-soft)!important;color:var(--sun-accent)!important}
html[data-sunion-theme] body .training-hub .eyebrow,
html[data-sunion-theme] body .training-hub .node-number,
html[data-sunion-theme] body .training-hub .task-number,
html[data-sunion-theme] body .training-hub a,
html[data-sunion-theme] body .teacher-help .eyebrow {color:var(--sun-accent)!important}
html[data-sunion-theme] body .assessment-summary .summary-heading p,
html[data-sunion-theme] body .assessment-summary .latest,
html[data-sunion-theme] body .training-hub .state-locked,
html[data-sunion-theme] body .training-hub .unit-status {color:var(--sun-muted)!important}
html[data-sunion-theme] body .training-hub .state-waiting,
html[data-sunion-theme] body .training-hub .pending:not(div) {color:var(--sun-warn)!important}
html[data-sunion-theme] body .training-hub .state-available,
html[data-sunion-theme] body .training-hub .state-passed,
html[data-sunion-theme] body .assessment-summary .passed {color:var(--sun-success)!important}
html[data-sunion-theme] body .training-hub button {background:var(--sun-accent)!important;color:var(--sun-on-accent)!important;border-color:var(--sun-accent)!important}
html[data-sunion-theme] body .training-hub .unit-stage.focused {background:var(--sun-bg)!important}


.sunion-training-list section {display:flex;min-height:3em;margin-bottom:1em;align-items:center}
.sunion-training-list .find-training {margin-right:1em;white-space:nowrap;font-size:1.7em;font-weight:bold;line-height:1.2}
.sunion-training-list .training-category {margin-right:1.5em;font-weight:600;white-space:nowrap;font-size:16px;margin-top:8px}
.sunion-training-list .category-item {margin-right:1em;margin-top:.5em;font-size:14px}
.sunion-training-list .category-item:hover {cursor:pointer}
@media(max-width:700px) {.sunion-training-list section {flex-wrap:wrap}}


html[data-sunion-theme] body #oj-content{background:var(--sun-bg)!important}html[data-sunion-theme] body #header + #header-hidden{display:block!important;height:64px;flex-shrink:0}

.sunion-theme-toggle svg{width:16px;height:16px;display:block}.sunion-original-theme-slot{float:right;margin:14px 10px 0 0}.sunion-original-mobile-slot{float:none;position:static;margin:0 8px 0 0}

html[data-sunion-theme] #header .logo{background-image:url("/assets/sunion-20261004/logo-black.png");background-size:contain;background-repeat:no-repeat;background-position:center}html[data-sunion-theme="dark"] #header .logo{background-image:url("/assets/sunion-20261004/logo-white.png")}html[data-sunion-theme] #header .logo .el-image{visibility:hidden}
