/* ==========================================================================
   Lingora — Dark Theme (GENERATED by tools/build-dark-theme.mjs, do not edit)
   Edit css/theme-dark-extra.css for hand-written tweaks, then run: npm run build:theme
   ========================================================================== */

html[data-theme="dark"] {
  color-scheme: dark;
  --lp-blue-soft: #07090b;
  --lp-blue-light: #07090b;
  --lp-bg: #050708;
  --lp-cream: #0b0a07;
  --lp-text: #c8d2df;
  --lp-border: #293441;
  --lp-shadow: 0 2px 10px rgba(0, 0, 0, 0.088), 0 1px 3px rgba(0, 0, 0, 0.044);
  --lp-shadow-hover: 0 8px 24px -4px rgba(0, 0, 0, 0.352);
  --primary-900: #cad4e5;
  --primary-800: #bfccdf;
  --primary-100: #0a0c0f;
  --primary-50: #07080a;
  --amber-100: #14130d;
  --amber-50: #0b0a07;
  --emerald-700: #bce7da;
  --emerald-100: #0c130f;
  --emerald-50: #070b09;
  --rose-100: #0d0809;
  --rose-50: #0a0606;
  --slate-900: #d9dde8;
  --slate-800: #d3d8df;
  --slate-700: #c8cdd5;
  --slate-300: #131518;
  --slate-200: #0c0e0f;
  --slate-100: #08090a;
  --slate-50: #060708;
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.11);
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.132);
  --shadow-md: 0 8px 24px -4px rgba(0, 0, 0, 0.176);
  --shadow-lg: 0 16px 36px -6px rgba(0, 0, 0, 0.308);
  --shadow-3d-soft: inset 0 2px 4px rgba(255, 255, 255, 0.108),
    inset 0 -3px 6px rgba(0, 0, 0, 0.176),
    0 8px 18px -4px rgba(0, 0, 0, 0.308);
  --lingora-light-blue: #07090b;
  --lingora-bg: #050708;
  --lingora-white: #111111;
  --lingora-cream: #0b0a07;
  --lingora-main-text: #c8d2df;
  --lingora-border: #293441;
}

/* ---- from css/platform-polish.css ---- */
html[data-theme="dark"] .lingora-platform-main {
  background: #050708;
}

html[data-theme="dark"] .dash-section-card,
html[data-theme="dark"] .create-post-card,
html[data-theme="dark"] .community-post-card,
html[data-theme="dark"] .lesson-select-card,
html[data-theme="dark"] .interactive-lesson-player,
html[data-theme="dark"] .placement-test-card,
html[data-theme="dark"] .arena-solo-card,
html[data-theme="dark"] .arena-pvp-card,
html[data-theme="dark"] .leaderboard-table-card,
html[data-theme="dark"] .creator-metric-card,
html[data-theme="dark"] .shop-item-card,
html[data-theme="dark"] .mascot-collection-card,
html[data-theme="dark"] .private-room-card,
html[data-theme="dark"] .partner-card,
html[data-theme="dark"] .profile-hero-card,
html[data-theme="dark"] .auth-card,
html[data-theme="dark"] .llm-card {
  background: #111111;
  border: 1.5px solid #293441;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.088), 0 1px 3px rgba(0, 0, 0, 0.044);
}

html[data-theme="dark"] .lesson-select-card:hover,
html[data-theme="dark"] .community-post-card:hover,
html[data-theme="dark"] .mascot-collection-card:hover,
html[data-theme="dark"] .shop-item-card:hover,
html[data-theme="dark"] .private-room-card:hover,
html[data-theme="dark"] .partner-card:hover {
  box-shadow: 0 8px 24px -4px rgba(0, 0, 0, 0.352);
}

html[data-theme="dark"] .dash-section-title {
  color: #c8d2df;
}

html[data-theme="dark"] .dash-section-sub {
  color: #adb2b8;
}

html[data-theme="dark"] .lps-card {
  background: #111111;
  border: 1.5px solid #293441;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.088), 0 1px 3px rgba(0, 0, 0, 0.044);
}

html[data-theme="dark"] .lps-card:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.264);
}

html[data-theme="dark"] .lps-card.active {
  background: linear-gradient(180deg, #07090b 0%, #111111 80%);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.352);
}

html[data-theme="dark"] .lps-top {
  color: #c8d2df;
}

html[data-theme="dark"] .lps-pct {
  color: #afc0d5;
}

html[data-theme="dark"] .learning-filters-bar {
  background: #111111;
  border: 1.5px solid #293441;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.088), 0 1px 3px rgba(0, 0, 0, 0.044);
}

html[data-theme="dark"] .lfb-selects select.lingora-select {
  border: 1.5px solid #293441;
  background: #111111;
  color: #c8d2df;
}

html[data-theme="dark"] .lfb-selects select.lingora-select:focus {
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.33);
}

html[data-theme="dark"] .lesson-select-card.active {
  background: linear-gradient(180deg, #06080a 0%, #111111 70%);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.308);
}

html[data-theme="dark"] .lsc-lang {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .lsc-diff {
  color: #adb2b8;
}

html[data-theme="dark"] .lsc-title {
  color: #c8d2df;
}

html[data-theme="dark"] .skill-mini-tag {
  background: #08090a;
  border: 1px solid #2c333c;
  color: #c8cdd5;
}

html[data-theme="dark"] .lsc-footer {
  color: #adb2b8;
  border-top: 1px dashed #293441;
}

html[data-theme="dark"] .lsc-status {
  color: #b2e3d4;
}

html[data-theme="dark"] .interactive-lesson-player {
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.22);
}

html[data-theme="dark"] .ilp-header {
  border-bottom: 1.5px solid #293441;
}

html[data-theme="dark"] .ilp-badge {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .ilp-title {
  color: #c8d2df;
}

html[data-theme="dark"] .ilp-xp-pill {
  background: #0b0a07;
  border: 1px solid #544735;
  color: #dfc4b3;
}

html[data-theme="dark"] .ilp-box {
  background: #060708;
  border: 1.5px solid #2c333c;
}

html[data-theme="dark"] .ilp-box h4 {
  color: #c8d2df;
}

html[data-theme="dark"] .ilp-box ul {
  color: #c8cdd5;
}

html[data-theme="dark"] .ilp-box.cream {
  background: #0b0a07;
  border-color: #524c34;
}

html[data-theme="dark"] .speech-capability-note {
  background: #111111;
  color: #dfc4b3;
}

html[data-theme="dark"] .ilp-vocab-section h4 {
  color: #c8d2df;
}

html[data-theme="dark"] .ilp-vocab-card {
  background: #111111;
  border: 1.5px solid #293441;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.066);
}

html[data-theme="dark"] .ilp-vocab-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.176);
}

html[data-theme="dark"] .ivc-word {
  color: #c8d2df;
}

html[data-theme="dark"] .ivc-reading {
  color: #adb2b8;
}

html[data-theme="dark"] .ivc-meaning {
  color: #c8cdd5;
}

html[data-theme="dark"] .ivc-example {
  color: #b2b6bd;
}

html[data-theme="dark"] .ilp-exercise-stage {
  background: #060708;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .ilp-ex-header h4 {
  color: #c8d2df;
}

html[data-theme="dark"] .step-dot-btn {
  border: 1.5px solid #293441;
  background: #111111;
  color: #c0c5cb;
}

html[data-theme="dark"] .step-dot-btn:hover {
  color: #afc0d5;
  background: #07090b;
}

html[data-theme="dark"] .step-dot-btn.active {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.6);
}

html[data-theme="dark"] .step-dot-btn.done {
  background: #070b09;
  border-color: #314e40;
  color: #c5e8de;
}

html[data-theme="dark"] .ilp-ex-nav-bar {
  border-top: 1px dashed #293441;
}

html[data-theme="dark"] .lec-match-row {
  background: #111111;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .lec-match-left {
  color: #c8d2df;
}

html[data-theme="dark"] .lec-match-arrow {
  color: #a0b4c7;
}

html[data-theme="dark"] .community-filter-bar {
  background: #111111;
  border: 1.5px solid #293441;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.088), 0 1px 3px rgba(0, 0, 0, 0.044);
}

html[data-theme="dark"] .cfb-langs {
  border-top: 1px dashed #2c333c;
}

html[data-theme="dark"] .cfb-tab {
  border: 1.5px solid #293441;
  background: #111111;
  color: #c8d2df;
}

html[data-theme="dark"] .cfb-tab:hover {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .cfb-tab.active {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.6);
}

html[data-theme="dark"] .lang-topic-chip {
  border: 1.5px solid #2c333c;
  background: #060708;
  color: #c0c5cb;
}

html[data-theme="dark"] .lang-topic-chip:hover {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .lang-topic-chip.active {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.6);
}

html[data-theme="dark"] .cpc-author-name {
  color: #c8d2df;
}

html[data-theme="dark"] .cpc-meta-line {
  color: #adb2b8;
}

html[data-theme="dark"] .cpc-lvl-pill,
html[data-theme="dark"] .cpc-cat-badge {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .cpc-title {
  color: #c8d2df;
}

html[data-theme="dark"] .cpc-content {
  color: #c8cdd5;
}

html[data-theme="dark"] .cpc-attachment-pill {
  background: #0b0a07;
  border: 1px solid #544735;
  color: #dfc4b3;
}

html[data-theme="dark"] .cpc-interaction-bar {
  border-top: 1px dashed #2c333c;
}

html[data-theme="dark"] .cpc-act-btn {
  border: 1.5px solid #293441;
  background: #060708;
  color: #c8cdd5;
}

html[data-theme="dark"] .cpc-act-btn:hover {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .cpc-act-btn.active {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .cpc-comments-box {
  background: #060708;
  border: 1px solid #2c333c;
}

html[data-theme="dark"] .cpc-comment-item {
  color: #d3d8df;
}

html[data-theme="dark"] .sidebar-assistant-card {
  background: linear-gradient(135deg, #0b0a07 0%, #111111 70%);
  border: 1.5px solid #544735;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.176);
}

html[data-theme="dark"] .sidebar-assistant-card .sac-speech-bubble {
  background: #111111;
  border: 1px solid #524c34;
  color: #dfc4b3;
}

html[data-theme="dark"] .dash-welcome-banner {
  background: linear-gradient(120deg, #07090b 0%, #111111 50%, #0b0a07 100%);
  border: 1.5px solid #293441;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.088), 0 1px 3px rgba(0, 0, 0, 0.044);
}

html[data-theme="dark"] .dwb-title-pill {
  background: linear-gradient(135deg, #15120e 0%, #221d16 100%);
  color: #e1d0bb;
}

html[data-theme="dark"] .dwb-demo-tag {
  background: #111111;
  border: 1px dashed #293441;
  color: #adb2b8;
}

html[data-theme="dark"] .dwb-greeting {
  color: #c8d2df;
}

html[data-theme="dark"] .dwb-motivational {
  color: #c0c5cb;
}

html[data-theme="dark"] .dwb-mascot-frame {
  background: #111111;
  border: 2px solid #544735;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.264);
}

html[data-theme="dark"] .dwb-mascot-caption {
  color: #dfc4b3;
}

html[data-theme="dark"] .arena-hero-banner {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.44);
}

html[data-theme="dark"] .arena-mode-tab {
  border: 1.5px solid #293441;
  background: #111111;
  color: #c8d2df;
}

html[data-theme="dark"] .arena-mode-tab.active {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.6);
}

html[data-theme="dark"] .aqc-opt-btn {
  border: 1.5px solid #293441;
  background: #111111;
  color: #c8d2df;
}

html[data-theme="dark"] .aqc-opt-btn:hover {
  background: #07090b;
}

html[data-theme="dark"] .aqc-opt-btn.selected {
  background: #07090b;
}

html[data-theme="dark"] .aqc-opt-btn.correct {
  background: #070b09;
  color: #c5e8de;
}

html[data-theme="dark"] .aqc-opt-btn.wrong {
  background: #0a0606;
  color: #dcaebb;
}

html[data-theme="dark"] .leaderboard-full-row {
  border: 1.5px solid #293441;
  background: #111111;
}

html[data-theme="dark"] .leaderboard-full-row:hover {
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.176);
}

html[data-theme="dark"] .leaderboard-full-row.highlight-kk {
  background: linear-gradient(135deg, #0b0a07 0%, #0b0a07 100%);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.33);
}

html[data-theme="dark"] .shop-hero-banner {
  background: linear-gradient(120deg, #0b0a07 0%, #111111 50%, #07090b 100%);
  border: 1.5px solid #544735;
}

html[data-theme="dark"] .shop-balance-card {
  background: #111111;
  border: 2px solid #544735;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.264);
}

html[data-theme="dark"] .sbc-label {
  color: #dfc4b3;
}

html[data-theme="dark"] .sbc-amount {
  color: #debfa7;
}

html[data-theme="dark"] .sic-cat {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .sic-title {
  color: #c8d2df;
}

html[data-theme="dark"] .sic-desc {
  color: #c0c5cb;
}

html[data-theme="dark"] .sic-req {
  color: #dfc4b3;
  background: #0b0a07;
  border: 1px dashed #524c34;
}

html[data-theme="dark"] .sic-footer {
  border-top: 1px dashed #293441;
}

html[data-theme="dark"] .sic-price {
  color: #debfa7;
}

html[data-theme="dark"] .interface-lang-card {
  border: 1.5px solid #293441;
  background: #111111;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.088), 0 1px 3px rgba(0, 0, 0, 0.044);
}

html[data-theme="dark"] .interface-lang-card:hover {
  background: #07090b;
}

html[data-theme="dark"] .interface-lang-card.active {
  background: linear-gradient(180deg, #07090b 0%, #111111 80%);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.33);
}

html[data-theme="dark"] .ilc-texts strong {
  color: #c8d2df;
}

html[data-theme="dark"] .ilc-texts span {
  color: #adb2b8;
}

html[data-theme="dark"] .ilc-check {
  color: #afc0d5;
}

html[data-theme="dark"] .srs-header-banner,
html[data-theme="dark"] .quest-hero-banner,
html[data-theme="dark"] .speech-hero-banner,
html[data-theme="dark"] .stroke-hero-banner,
html[data-theme="dark"] .analytics-hero-banner {
  background: linear-gradient(135deg, #111111 0%, #07090b 60%, #0b0a07 100%);
  border: 1.5px solid #293441;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.11);
}

html[data-theme="dark"] .srs-page-title,
html[data-theme="dark"] .quest-page-title,
html[data-theme="dark"] .speech-page-title,
html[data-theme="dark"] .stroke-page-title,
html[data-theme="dark"] .analytics-page-title {
  color: #c8d2df;
}

html[data-theme="dark"] .srs-page-subtitle,
html[data-theme="dark"] .quest-page-subtitle,
html[data-theme="dark"] .speech-page-subtitle,
html[data-theme="dark"] .stroke-page-subtitle,
html[data-theme="dark"] .analytics-page-subtitle {
  color: #b2b6bd;
}

html[data-theme="dark"] .srs-toggle-practice-btn {
  background: #07090b !important;
  color: #afc0d5 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.176);
}

html[data-theme="dark"] .srs-stat-card,
html[data-theme="dark"] .kpi-card {
  background: #111111;
  border: 1.5px solid #293441;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.066);
}

html[data-theme="dark"] .srs-stat-icon,
html[data-theme="dark"] .kpi-icon {
  background: #07090b;
}

html[data-theme="dark"] .due-stat .srs-stat-icon {
  background: #0d0909;
}

html[data-theme="dark"] .learning-stat .srs-stat-icon {
  background: #14130d;
}

html[data-theme="dark"] .reviewing-stat .srs-stat-icon {
  background: #090c0e;
}

html[data-theme="dark"] .mastered-stat .srs-stat-icon {
  background: #0a0f0c;
}

html[data-theme="dark"] .srs-stat-value,
html[data-theme="dark"] .kpi-val {
  color: #c8d2df;
}

html[data-theme="dark"] .srs-stat-label,
html[data-theme="dark"] .kpi-label {
  color: #b2b6bd;
}

html[data-theme="dark"] .srs-flashcard {
  background: #111111;
  border: 2px solid #293441;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.154);
}

html[data-theme="dark"] .srs-card-header {
  border-bottom: 1.5px solid #293441;
}

html[data-theme="dark"] .srs-hsk-badge,
html[data-theme="dark"] .srs-stroke-badge,
html[data-theme="dark"] .srs-state-badge {
  background: #08090a;
  color: #c0c5cb;
}

html[data-theme="dark"] .srs-state-badge.state-learning {
  background: #14130d;
  color: #dfc4b3;
}

html[data-theme="dark"] .srs-state-badge.state-reviewing {
  background: #090c0e;
  color: #b7d4e4;
}

html[data-theme="dark"] .srs-state-badge.state-mastered {
  background: #0a0f0c;
  color: #c3e0ce;
}

html[data-theme="dark"] .srs-card-counter {
  color: #b2b6bd;
}

html[data-theme="dark"] .srs-character-display {
  color: #afc0d5;
}

html[data-theme="dark"] .srs-tts-circle-btn {
  background: #07090b !important;
  color: #afc0d5 !important;
}

html[data-theme="dark"] .srs-reveal-btn {
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.55);
}

html[data-theme="dark"] .srs-reveal-btn:hover {
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.6);
}

html[data-theme="dark"] .srs-card-back {
  border-top: 1.5px dashed #293441;
}

html[data-theme="dark"] .srs-pinyin-display {
  color: #d4b491;
}

html[data-theme="dark"] .srs-meaning-display {
  color: #c8d2df;
}

html[data-theme="dark"] .srs-example-box {
  background: #060708;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .srs-example-zh {
  color: #c8d2df;
}

html[data-theme="dark"] .srs-example-pinyin {
  color: #b2b6bd;
}

html[data-theme="dark"] .srs-example-th {
  color: #c8cdd5;
}

html[data-theme="dark"] .srs-example-audio-btn {
  background: #111111;
  border: 1px solid #293441;
  color: #afc0d5;
}

html[data-theme="dark"] .srs-example-audio-btn:hover {
  background: #07090b;
}

html[data-theme="dark"] .srs-rating-prompt {
  color: #c0c5cb;
}

html[data-theme="dark"] .srs-rate-btn {
  border: 2px solid #293441;
  background: #111111;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.088);
}

html[data-theme="dark"] .rate-1-again {
  background: #0a0606 !important;
  border-color: #4c3030 !important;
  color: #d9b0b0 !important;
}

html[data-theme="dark"] .rate-1-again:hover {
  background: #0d0909 !important;
}

html[data-theme="dark"] .rate-2-hard {
  background: #0b0a07 !important;
  border-color: #524c34 !important;
  color: #dfc4b3 !important;
}

html[data-theme="dark"] .rate-2-hard:hover {
  background: #14130d !important;
}

html[data-theme="dark"] .rate-3-good {
  background: #07080a !important;
  border-color: #2c3745 !important;
  color: #a8b3d6 !important;
}

html[data-theme="dark"] .rate-3-good:hover {
  background: #0a0c0f !important;
}

html[data-theme="dark"] .rate-4-easy {
  background: #070a08 !important;
  border-color: #314e40 !important;
  color: #c5e8de !important;
}

html[data-theme="dark"] .rate-4-easy:hover {
  background: #0a0f0c !important;
}

html[data-theme="dark"] .srs-curve-card {
  background: #111111;
  border: 1.5px solid #293441;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.088);
}

html[data-theme="dark"] .srs-curve-title {
  color: #c8d2df;
}

html[data-theme="dark"] .srs-retention-pill {
  background: #0a0f0c;
  color: #c3e0ce;
}

html[data-theme="dark"] .srs-curve-desc {
  color: #b2b6bd;
}

html[data-theme="dark"] .srs-svg-graph-wrap {
  background: #050607;
  border: 1px solid #262f39;
}

html[data-theme="dark"] .srs-curve-legend {
  color: #c0c5cb;
}

html[data-theme="dark"] .legend-color.no-review {
  background: #301f1f;
}

html[data-theme="dark"] .srs-tip-box {
  background: #111111;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .srs-tip-title {
  color: #c8d2df;
}

html[data-theme="dark"] .srs-tip-list {
  color: #c0c5cb;
}

html[data-theme="dark"] .srs-complete-card {
  background: #111111;
  border: 2px solid #293441;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.176);
}

html[data-theme="dark"] .srs-complete-title {
  color: #c8d2df;
}

html[data-theme="dark"] .srs-complete-desc {
  color: #b2b6bd;
}

html[data-theme="dark"] .sc-stat {
  background: #060708;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .sc-val {
  color: #afc0d5;
}

html[data-theme="dark"] .sc-lbl {
  color: #b2b6bd;
}

html[data-theme="dark"] .btn-secondary-action {
  background: #111111;
  color: #c8d2df;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .btn-secondary-action:hover {
  background: #060708;
}

html[data-theme="dark"] .streak-badge-main {
  background: #111111;
  border: 2px solid #584837;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.33);
}

html[data-theme="dark"] .streak-num {
  color: #dbb3a2;
}

html[data-theme="dark"] .streak-lbl {
  color: #d7ab95;
}

html[data-theme="dark"] .streak-sub-stat {
  color: #c0c5cb;
}

html[data-theme="dark"] .quest-simulation-box {
  background: #111111;
  border: 2px solid #544735;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.44);
}

html[data-theme="dark"] .sim-box-title {
  color: #dfc4b3;
}

html[data-theme="dark"] .sim-box-desc {
  color: #b2b6bd;
}

html[data-theme="dark"] .btn-simulate-day {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.55);
}

html[data-theme="dark"] .btn-simulate-day:hover {
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.6);
}

html[data-theme="dark"] .daily-quest-card {
  background: #111111;
  border: 1.5px solid #293441;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.066);
}

html[data-theme="dark"] .daily-quest-card.is-completed {
  border-color: #375742;
  background: #070a08;
}

html[data-theme="dark"] .dqc-icon-wrap {
  background: #07090b;
}

html[data-theme="dark"] .dqc-title {
  color: #c8d2df;
}

html[data-theme="dark"] .reward-xp {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .reward-coins {
  background: #0b0a07;
  color: #dfc4b3;
}

html[data-theme="dark"] .dqc-desc {
  color: #b2b6bd;
}

html[data-theme="dark"] .dqc-counter {
  color: #b2b6bd;
}

html[data-theme="dark"] .btn-quest-go {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.44);
}

html[data-theme="dark"] .badge-completed {
  color: #c3e0ce;
  background: #0a0f0c;
}

html[data-theme="dark"] .evolution-mascot-stage {
  background: linear-gradient(180deg, #111111 0%, #0b0a07 100%);
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .evo-mascot-name {
  color: #c8d2df;
}

html[data-theme="dark"] .evo-mascot-title {
  color: #d4b491;
}

html[data-theme="dark"] .milestone-item {
  background: #111111;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .milestone-item.unlocked {
  border-color: #375742;
  background: #070a08;
}

html[data-theme="dark"] .ms-title {
  color: #c8d2df;
}

html[data-theme="dark"] .ms-days {
  color: #d4b491;
}

html[data-theme="dark"] .ms-desc {
  color: #b2b6bd;
}

html[data-theme="dark"] .ms-status-tag.unlocked {
  background: #0a0f0c;
  color: #c3e0ce;
}

html[data-theme="dark"] .ms-status-tag.locked {
  background: #08090a;
  color: #b2b6bd;
}

html[data-theme="dark"] .speech-studio-card {
  background: #111111;
  border: 1.5px solid #293441;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.11);
}

html[data-theme="dark"] .speech-nav-tabs {
  border-bottom: 1px solid #293441;
}

html[data-theme="dark"] .speech-tab-btn {
  border: 1.5px solid #293441;
  background: #060708;
  color: #c0c5cb;
}

html[data-theme="dark"] .speech-tab-btn:hover,
html[data-theme="dark"] .speech-tab-btn.active {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.44);
}

html[data-theme="dark"] .speech-target-box {
  background: linear-gradient(135deg, #060708 0%, #07090b 100%);
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .target-category-tag {
  background: #111111;
  border: 1px solid #293441;
  color: #b2b6bd;
}

html[data-theme="dark"] .target-chinese-text {
  color: #c8d2df;
}

html[data-theme="dark"] .target-pinyin-text {
  color: #d4b491;
}

html[data-theme="dark"] .target-meaning-text {
  color: #c0c5cb;
}

html[data-theme="dark"] .btn-tts-listen {
  background: #07090b !important;
  color: #afc0d5 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.176);
}

html[data-theme="dark"] .btn-mic-record {
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.6);
}

html[data-theme="dark"] .btn-mic-record:hover {
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.6);
}

html[data-theme="dark"] .btn-mic-record.listening {
  background: linear-gradient(135deg, #dc2626 0%, #301f1f 100%) !important;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.6);
}

html[data-theme="dark"] .speech-demo-sim-bar {
  background: #08090a;
  border: 1.5px solid #293441;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.066);
}

html[data-theme="dark"] .sim-label {
  color: #c8cdd5;
}

html[data-theme="dark"] .btn-sim-preset {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.11);
}

html[data-theme="dark"] .btn-sim-preset.perfect {
  background: #070b09 !important;
  border: 1.5px solid #375742 !important;
  color: #bce7da !important;
}

html[data-theme="dark"] .btn-sim-preset.perfect:hover {
  background: #0c130f !important;
}

html[data-theme="dark"] .btn-sim-preset.good {
  background: #07080a !important;
  border: 1.5px solid #2c3745 !important;
  color: #9aa9d2 !important;
}

html[data-theme="dark"] .btn-sim-preset.good:hover {
  background: #0a0c0f !important;
}

html[data-theme="dark"] .btn-sim-preset.poor {
  background: #0b0907 !important;
  border: 1.5px solid #4a3e2f !important;
  color: #dbb3a2 !important;
}

html[data-theme="dark"] .btn-sim-preset.poor:hover {
  background: #100e0b !important;
}

html[data-theme="dark"] .pronunciation-score-card {
  background: #111111;
  border: 2px solid #293441;
}

html[data-theme="dark"] .pronunciation-score-card.score-excellent {
  border-color: #375742;
  background: #070a08;
}

html[data-theme="dark"] .pronunciation-score-card.score-good {
  border-color: #334150;
  background: #050608;
}

html[data-theme="dark"] .pronunciation-score-card.score-needs-work {
  border-color: #584837;
  background: #090706;
}

html[data-theme="dark"] .score-circle-display {
  background: #111111;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.264);
}

html[data-theme="dark"] .score-number {
  color: #afc0d5;
}

html[data-theme="dark"] .score-grade-title {
  color: #c8d2df;
}

html[data-theme="dark"] .score-summary-text {
  color: #c0c5cb;
}

html[data-theme="dark"] .character-diff-box {
  background: #111111;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .diff-title {
  color: #b2b6bd;
}

html[data-theme="dark"] .diff-char-chip {
  border: 1px solid #293441;
  background: #060708;
}

html[data-theme="dark"] .diff-char-chip.correct {
  border-color: #375742;
  background: #0a0f0c;
}

html[data-theme="dark"] .diff-char-chip.substituted,
html[data-theme="dark"] .diff-char-chip.missed {
  border-color: #4c3030;
  background: #0d0909;
}

html[data-theme="dark"] .diff-char {
  color: #c8d2df;
}

html[data-theme="dark"] .diff-char-chip.correct .diff-status-icon {
  color: #c3e0ce;
}

html[data-theme="dark"] .diff-char-chip.substituted .diff-status-icon,
html[data-theme="dark"] .diff-char-chip.missed .diff-status-icon {
  color: #d9b0b0;
}

html[data-theme="dark"] .diff-label {
  color: #b2b6bd;
}

html[data-theme="dark"] .transcribed-text-row {
  color: #c0c5cb;
}

html[data-theme="dark"] .speech-empty-state {
  background: #060708;
  border: 1.5px dashed #293441;
}

html[data-theme="dark"] .empty-title {
  color: #c8d2df;
}

html[data-theme="dark"] .empty-desc {
  color: #b2b6bd;
}

html[data-theme="dark"] .speech-info-card {
  background: #111111;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .info-card-title {
  color: #c8d2df;
}

html[data-theme="dark"] .info-card-text {
  color: #c0c5cb;
}

html[data-theme="dark"] .info-card-list {
  color: #c0c5cb;
}

html[data-theme="dark"] .stroke-char-picker {
  background: #111111;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .picker-title {
  color: #c8d2df;
}

html[data-theme="dark"] .char-pick-btn {
  border: 1.5px solid #293441;
  background: #111111;
}

html[data-theme="dark"] .char-pick-btn:hover,
html[data-theme="dark"] .char-pick-btn.active {
  background: #07090b;
}

html[data-theme="dark"] .cp-char {
  color: #c8d2df;
}

html[data-theme="dark"] .cp-pinyin {
  color: #d4b491;
}

html[data-theme="dark"] .char-meta-card {
  background: #060708;
  border: 1px solid #293441;
}

html[data-theme="dark"] .cm-header {
  color: #c0c5cb;
}

html[data-theme="dark"] .cm-hsk {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .cm-meaning {
  color: #c8d2df;
}

html[data-theme="dark"] .btn-tts-char {
  background: #111111;
  border: 1.5px solid #293441;
  color: #afc0d5;
}

html[data-theme="dark"] .btn-tts-char:hover {
  background: #07090b;
}

html[data-theme="dark"] .stroke-board-section {
  background: #111111;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .sm-tab {
  border: 1.5px solid #293441;
  background: #060708;
  color: #c0c5cb;
}

html[data-theme="dark"] .sm-tab:hover,
html[data-theme="dark"] .sm-tab.active {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.44);
}

html[data-theme="dark"] .hanzi-writer-stage-wrap {
  border: 2px solid #343b44;
  background: #111111;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.132);
}

html[data-theme="dark"] .mzg-line {
  background-color: #0c0e0f;
}

html[data-theme="dark"] .mzg-line.diag-1 {
  border-top: 1px dashed #2c333c;
}

html[data-theme="dark"] .mzg-line.diag-2 {
  border-top: 1px dashed #2c333c;
}

html[data-theme="dark"] .hanzi-fallback-text {
  color: #afc0d5;
}

html[data-theme="dark"] .btn-stroke-act {
  border: 1.5px solid #293441;
  background: #060708;
  color: #c8d2df;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.11);
}

html[data-theme="dark"] .btn-stroke-act:hover {
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.22);
}

html[data-theme="dark"] .stroke-quiz-status {
  color: #b2b6bd;
}

html[data-theme="dark"] .chart-card,
html[data-theme="dark"] .heatmap-section-card {
  background: #111111;
  border: 1.5px solid #293441;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.066);
}

html[data-theme="dark"] .chart-title {
  color: #c8d2df;
}

html[data-theme="dark"] .chart-sub {
  color: #b2b6bd;
}

html[data-theme="dark"] .chart-tag-blue {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .chart-tag-gold {
  background: #0b0a07;
  color: #debfa7;
}

html[data-theme="dark"] .heatmap-legend {
  color: #b2b6bd;
}

html[data-theme="dark"] .hm-tile.lvl-0 {
  background: #08090a;
}

html[data-theme="dark"] .hm-tile.lvl-1 {
  background: #0e1216;
}

html[data-theme="dark"] .hm-tile.lvl-2 {
  background: #1b2129;
}

html[data-theme="dark"] .dash-srs-quick-card,
html[data-theme="dark"] .dash-quests-quick-card,
html[data-theme="dark"] .dash-practice-quick-card {
  background: #111111;
  border: 1.5px solid #293441;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.088);
}

html[data-theme="dark"] .dash-srs-quick-card:hover,
html[data-theme="dark"] .dash-quests-quick-card:hover,
html[data-theme="dark"] .dash-practice-quick-card:hover {
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.198);
}

html[data-theme="dark"] .dsqc-badge {
  color: #afc0d5;
  background: #07090b;
}

html[data-theme="dark"] .dsqc-badge.orange {
  color: #dbb3a2;
  background: #100e0b;
}

html[data-theme="dark"] .dsqc-badge.green {
  color: #c3e0ce;
  background: #0a0f0c;
}

html[data-theme="dark"] .dsqc-retention,
html[data-theme="dark"] .dsqc-streak-tag,
html[data-theme="dark"] .dsqc-badge-pill {
  color: #b2b6bd;
}

html[data-theme="dark"] .dsqc-title {
  color: #c8d2df;
}

html[data-theme="dark"] .dsqc-desc {
  color: #b2b6bd;
}

html[data-theme="dark"] .dsqc-footer {
  border-top: 1px solid #262f39;
}

html[data-theme="dark"] .dsqc-num {
  color: #c8d2df;
}

html[data-theme="dark"] .dash-weakness-quick-card {
  background: #111111;
  border: 1px solid #293441;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.066);
}

html[data-theme="dark"] .dash-weakness-quick-card:hover {
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.176);
}

html[data-theme="dark"] .dsqc-badge.purple {
  background: #060609;
  color: #aa93d2;
  border: 1px solid #2c283f;
}

html[data-theme="dark"] .weakness-hero-banner {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.396);
}

html[data-theme="dark"] .weakness-pill-badge {
  background: rgba(17, 17, 17, 0.18);
  border: 1px solid rgba(43, 43, 43, 0.35);
}

html[data-theme="dark"] .weakness-section-card {
  background: #111111;
  border: 1px solid #293441;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.11);
}

html[data-theme="dark"] .wsc-title {
  color: #c8d2df;
}

html[data-theme="dark"] .wsc-sub {
  color: #b2b6bd;
}

html[data-theme="dark"] .skill-meter-card {
  background: #060708;
  border: 1px solid #2c333c;
}

html[data-theme="dark"] .skill-meter-card.alert {
  background: #0b0907;
  border-color: #4a3e2f;
}

html[data-theme="dark"] .smc-label {
  color: #c0c5cb;
}

html[data-theme="dark"] .smc-score.high {
  color: #b2e3d4;
}

html[data-theme="dark"] .smc-score.low {
  color: #d7ab95;
}

html[data-theme="dark"] .smc-score.medium {
  color: #93a7d2;
}

html[data-theme="dark"] .smc-status {
  color: #b2b6bd;
}

html[data-theme="dark"] .smc-status.warning {
  color: #dbb3a2;
}

html[data-theme="dark"] .lingora-progress-track {
  background: #0c0e0f;
}

html[data-theme="dark"] .weakness-item-card {
  background: #111111;
  border: 1.5px solid #2c333c;
}

html[data-theme="dark"] .weakness-item-card:hover {
  border-color: #334150;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.176);
}

html[data-theme="dark"] .weakness-item-card.solved {
  border-color: #375742;
  background: linear-gradient(180deg, #111111 0%, #070a08 100%);
}

html[data-theme="dark"] .wic-cat-pill.critical {
  background: #0d0909;
  color: #d5a5a5;
}

html[data-theme="dark"] .wic-cat-pill.high {
  background: #100e0b;
  color: #dbb3a2;
}

html[data-theme="dark"] .wic-cat-pill.medium {
  background: #15140e;
  color: #e1ccae;
}

html[data-theme="dark"] .wic-acc-status {
  color: #b2b6bd;
}

html[data-theme="dark"] .wic-acc-status.done {
  color: #b9dec7;
}

html[data-theme="dark"] .wic-acc-status.err-status {
  color: #cf9898 !important;
}

html[data-theme="dark"] .wic-problem-title {
  color: #d3d8df;
}

html[data-theme="dark"] .wic-solution-box {
  background: #07080a;
}

html[data-theme="dark"] .wsb-heading {
  color: #9aa9d2;
}

html[data-theme="dark"] .wsb-text {
  color: #c8cdd5;
}

html[data-theme="dark"] .wic-drill-wrap {
  background: #060708;
  border: 1px solid #2c333c;
}

html[data-theme="dark"] .btn-refresh-all-drills {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .btn-refresh-all-drills:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.44);
}

html[data-theme="dark"] .drill-prompt-title {
  color: #d3d8df;
}

html[data-theme="dark"] .drill-q-count {
  background: #0c0e0f;
  color: #c0c5cb;
}

html[data-theme="dark"] .btn-refresh-single-drill {
  border: 1.5px solid #343b44;
  background: #111111;
  color: #c0c5cb;
}

html[data-theme="dark"] .btn-refresh-single-drill:hover {
  background: #08090a;
  color: #afc0d5;
}

html[data-theme="dark"] .btn-drill-opt {
  border: 1.5px solid #343b44;
  background: #111111;
  color: #c8cdd5;
}

html[data-theme="dark"] .btn-drill-opt:hover {
  background: #06080a;
}

html[data-theme="dark"] .btn-drill-opt.correct.selected,
html[data-theme="dark"] .btn-drill-opt.is-correct {
  background: #0a0f0c !important;
  color: #b9dec7 !important;
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.55) !important;
}

html[data-theme="dark"] .btn-drill-opt.wrong.selected,
html[data-theme="dark"] .btn-drill-opt.is-wrong {
  background: #0a0606 !important;
  color: #d5a5a5 !important;
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.55) !important;
}

html[data-theme="dark"] .wic-drill-wrap.drill-error-wrap {
  border-color: #4c3030 !important;
  background: #090606 !important;
}

html[data-theme="dark"] .drill-feedback-box {
  background: #070b09;
  color: #c5e8de;
  border: 1px solid #314e40;
}

html[data-theme="dark"] .drill-feedback-box.error {
  background: #0a0606;
  color: #d5a5a5;
  border-color: #5a3939;
}

html[data-theme="dark"] .interest-tab-btn {
  border: 1.5px solid #343b44;
  background: #111111;
  color: #c0c5cb;
}

html[data-theme="dark"] .interest-tab-btn:hover {
  color: #afc0d5;
}

html[data-theme="dark"] .interest-tab-btn.active {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.55);
}

html[data-theme="dark"] .personalized-plan-card {
  background: #060708;
  border: 1.5px solid #2c333c;
}

html[data-theme="dark"] .ppc-badge {
  color: #93a7d2;
}

html[data-theme="dark"] .ppc-role-title {
  color: #d9dde8;
}

html[data-theme="dark"] .ppc-col-title {
  color: #c8cdd5;
}

html[data-theme="dark"] .ppc-col-desc {
  color: #c0c5cb;
}

html[data-theme="dark"] .ppc-daily-box {
  background: #111111;
  border: 1px solid #2c333c;
  color: #d3d8df;
}

html[data-theme="dark"] .ppc-keyword-chip {
  background: #111111;
  border: 1px solid #343b44;
  color: #d3d8df;
}

html[data-theme="dark"] .btn-song-switch {
  border: 1px solid #343b44;
  background: #111111;
  color: #c0c5cb;
}

html[data-theme="dark"] .song-stage-board {
  background: #060606;
  border: 1.5px solid #2c333c;
}

html[data-theme="dark"] .ssb-title {
  color: #d9dde8;
}

html[data-theme="dark"] .ssb-style-tag {
  background: #090a0e;
  color: #a09dc9;
}

html[data-theme="dark"] .ssb-connection {
  color: #c0c5cb;
}

html[data-theme="dark"] .song-line-box {
  background: #111111;
  border: 1px solid #2c333c;
}

html[data-theme="dark"] .slb-full-zh {
  color: #d3d8df;
}

html[data-theme="dark"] .slb-full-pinyin {
  color: #b2b6bd;
}

html[data-theme="dark"] .slb-full-thai {
  color: #c8cdd5;
}

html[data-theme="dark"] .btn-play-line-tts {
  background: #08090a;
  border: 1px solid #343b44;
  color: #c8cdd5;
}

html[data-theme="dark"] .btn-play-line-tts:hover {
  background: #0c0e0f;
  color: #d9dde8;
}

html[data-theme="dark"] .word-token-chip {
  background: #060708;
  border: 1px solid #343b44;
}

html[data-theme="dark"] .word-token-chip:hover {
  background: #07090b;
}

html[data-theme="dark"] .wt-zh {
  color: #d3d8df;
}

html[data-theme="dark"] .wt-pinyin {
  color: #b2b6bd;
}

html[data-theme="dark"] .wt-thai {
  color: #a1cadf;
}

html[data-theme="dark"] .quotes-slang-hero-banner,
html[data-theme="dark"] .career-hero-banner {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.33);
}

html[data-theme="dark"] .qsh-badge,
html[data-theme="dark"] .chb-badge {
  background: rgba(17, 17, 17, 0.16);
  border: 1px solid rgba(43, 43, 43, 0.3);
}

html[data-theme="dark"] .daily-slang-highlight-card {
  background: linear-gradient(135deg, #0b0a07 0%, #111111 100%);
  border: 2px solid #544735;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.44);
}

html[data-theme="dark"] .dsh-vibe-pill {
  color: #afc0d5;
}

html[data-theme="dark"] .dsh-hanzi {
  color: #c8d2df;
}

html[data-theme="dark"] .dsh-pinyin {
  color: #a0b4c7;
}

html[data-theme="dark"] .dsh-meaning {
  color: #c8d2df;
}

html[data-theme="dark"] .dsh-situation {
  color: #b6bdc4;
}

html[data-theme="dark"] .dsh-example-box {
  background: #111111;
  border: 1px solid #293441;
}

html[data-theme="dark"] .dsh-eg-zh {
  color: #afc0d5;
}

html[data-theme="dark"] .dsh-eg-py {
  color: #adb2b8;
}

html[data-theme="dark"] .dsh-eg-th {
  color: #c8d2df;
}

html[data-theme="dark"] .slang-tab-btn {
  border: 1px solid #293441;
  background: #111111;
  color: #c8d2df;
}

html[data-theme="dark"] .slang-tab-btn:hover {
  background: #07090b;
}

html[data-theme="dark"] .slang-search-icon {
  color: #adb2b8;
}

html[data-theme="dark"] .slang-search-input {
  border: 1px solid #293441;
  color: #c8d2df;
  background: #111111;
}

html[data-theme="dark"] .slang-search-input:focus {
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.264);
}

html[data-theme="dark"] .slang-search-clear {
  color: #adb2b8;
}

html[data-theme="dark"] .slang-card {
  background: #111111;
  border: 1px solid #293441;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.088);
}

html[data-theme="dark"] .slang-card:hover {
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.176);
}

html[data-theme="dark"] .sc-category-tag {
  color: #afc0d5;
  background: #07090b;
}

html[data-theme="dark"] .sc-vibe-tag {
  color: #adb2b8;
}

html[data-theme="dark"] .sc-hanzi {
  color: #c8d2df;
}

html[data-theme="dark"] .sc-pinyin {
  color: #a0b4c7;
}

html[data-theme="dark"] .sc-meaning {
  color: #c8d2df;
}

html[data-theme="dark"] .sc-context {
  color: #b6bdc4;
  background: #060708;
}

html[data-theme="dark"] .sc-example {
  background: #0b0a07;
}

html[data-theme="dark"] .sc-ex-zh {
  color: #c8d2df;
}

html[data-theme="dark"] .sc-ex-th {
  color: #adb2b8;
}

html[data-theme="dark"] .sc-actions {
  border-top: 1px solid #27313a;
}

html[data-theme="dark"] .btn-icon-label {
  border: 1px solid #293441;
  background: #111111;
  color: #c8d2df;
}

html[data-theme="dark"] .btn-icon-label:hover {
  background: #07090b;
}

html[data-theme="dark"] .btn-icon-label.accent {
  background: #0b0a07;
  border-color: #544735;
  color: #dbbd9b;
}

html[data-theme="dark"] .btn-icon-label.accent:hover {
  background: #211e15;
}

html[data-theme="dark"] .slang-practice-section {
  background: #111111;
  border: 1px solid #293441;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.088);
}

html[data-theme="dark"] .sps-pill {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .sps-title {
  color: #c8d2df;
}

html[data-theme="dark"] .sps-desc {
  color: #adb2b8;
}

html[data-theme="dark"] .sps-quiz-box {
  background: #060708;
  border: 1px solid #2c333c;
}

html[data-theme="dark"] .sps-target-meaning {
  color: #c8d2df;
}

html[data-theme="dark"] .sps-hint {
  color: #adb2b8;
}

html[data-theme="dark"] .sps-workspace {
  background: #111111;
  border: 2px dashed #343b44;
}

html[data-theme="dark"] .sps-workspace.solved {
  background: #070a08;
}

html[data-theme="dark"] .sps-workspace.wrong {
  background: #0a0606;
}

html[data-theme="dark"] .sps-ws-label,
html[data-theme="dark"] .sps-bank-label {
  color: #adb2b8;
}

html[data-theme="dark"] .sps-token-chip {
  border: 1px solid #343b44;
  background: #111111;
  color: #c8d2df;
}

html[data-theme="dark"] .sps-token-chip:hover {
  background: #07090b;
}

html[data-theme="dark"] .sps-feedback.success {
  background: #0a0f0c;
  color: #c3e0ce;
  border: 1px solid #375742;
}

html[data-theme="dark"] .sps-feedback.error {
  background: #0d0909;
  color: #d9b0b0;
  border: 1px solid #4c3030;
}

html[data-theme="dark"] .career-nav-tabs {
  border-bottom: 2px solid #2c333c;
}

html[data-theme="dark"] .cnt-tab-btn {
  color: #b6bdc4;
}

html[data-theme="dark"] .cnt-tab-btn:hover {
  color: #afc0d5;
}

html[data-theme="dark"] .cnt-tab-btn.active {
  color: #afc0d5;
}

html[data-theme="dark"] .career-filter-bar,
html[data-theme="dark"] .scholarship-filter-bar {
  background: #111111;
  border: 1px solid #293441;
}

html[data-theme="dark"] .cfb-label,
html[data-theme="dark"] .sfb-label {
  color: #c8d2df;
}

html[data-theme="dark"] .cfb-pill {
  border: 1px solid #293441;
  background: #060708;
  color: #b6bdc4;
}

html[data-theme="dark"] .cfb-pill:hover {
  background: #07090b;
}

html[data-theme="dark"] .career-card {
  background: #111111;
  border: 1px solid #293441;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.066);
}

html[data-theme="dark"] .cc-title-th {
  color: #c8d2df;
}

html[data-theme="dark"] .cc-title-zh {
  color: #a0b4c7;
}

html[data-theme="dark"] .cc-hsk-badge {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .cc-salary-row {
  background: #0b0a07;
}

html[data-theme="dark"] .cs-label {
  color: #adb2b8;
}

html[data-theme="dark"] .cs-val {
  color: #dbbd9b;
}

html[data-theme="dark"] .cs-sub {
  color: #d5c6b4;
}

html[data-theme="dark"] .cc-desc {
  color: #b6bdc4;
}

html[data-theme="dark"] .csb-title {
  color: #c8d2df;
}

html[data-theme="dark"] .company-tag {
  background: #08090a;
  color: #c8cdd5;
}

html[data-theme="dark"] .cc-vocab-chip {
  background: #060708;
  border: 1px solid #2c333c;
}

html[data-theme="dark"] .cc-vocab-chip:hover {
  background: #07090b;
}

html[data-theme="dark"] .cv-word {
  color: #afc0d5;
}

html[data-theme="dark"] .cv-py {
  color: #adb2b8;
}

html[data-theme="dark"] .cv-mean {
  color: #c8d2df;
}

html[data-theme="dark"] .cv-speaker {
  color: #a0b4c7;
}

html[data-theme="dark"] .cc-roadmap-steps {
  color: #b6bdc4;
}

html[data-theme="dark"] .cc-footer {
  border-top: 1px solid #262f39;
}

html[data-theme="dark"] .scholarship-card {
  background: #111111;
  border: 1px solid #293441;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.066);
}

html[data-theme="dark"] .sc-name-th {
  color: #c8d2df;
}

html[data-theme="dark"] .sc-name-zh {
  color: #a0b4c7;
}

html[data-theme="dark"] .sc-level-tag {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .sc-stipend-box {
  background: #070b09;
  border: 1px solid #314e40;
}

html[data-theme="dark"] .ssb-label {
  color: #c5e8de;
}

html[data-theme="dark"] .ssb-val {
  color: #bce7da;
}

html[data-theme="dark"] .sc-block-title {
  color: #c8d2df;
}

html[data-theme="dark"] .sc-benefits-list {
  color: #b6bdc4;
}

html[data-theme="dark"] .uni-chip {
  background: #08090a;
  color: #afc0d5;
}

html[data-theme="dark"] .sc-criteria-grid {
  background: #060708;
}

html[data-theme="dark"] .crit-lbl {
  color: #adb2b8;
}

html[data-theme="dark"] .crit-col strong {
  color: #c8d2df;
}

html[data-theme="dark"] .sc-agency-note {
  color: #b6bdc4;
}

html[data-theme="dark"] .career-matcher-section {
  background: #111111;
  border: 1px solid #293441;
}

html[data-theme="dark"] .cms-pill {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .cms-title {
  color: #c8d2df;
}

html[data-theme="dark"] .cms-desc {
  color: #adb2b8;
}

html[data-theme="dark"] .matcher-quiz-card {
  background: #060708;
  border: 1px solid #2c333c;
}

html[data-theme="dark"] .mq-label {
  color: #c8d2df;
}

html[data-theme="dark"] .mq-option-btn {
  border: 1px solid #293441;
  background: #111111;
  color: #c8d2df;
}

html[data-theme="dark"] .mq-option-btn:hover {
  background: #07090b;
}

html[data-theme="dark"] .mq-option-btn.selected {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.44);
}

html[data-theme="dark"] .matcher-result-card {
  background: linear-gradient(135deg, #0b0a07 0%, #111111 100%);
  border: 2px solid #544735;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.55);
}

html[data-theme="dark"] .mrc-title {
  color: #c8d2df;
}

html[data-theme="dark"] .mrc-sub {
  color: #a0b4c7;
}

html[data-theme="dark"] .mrc-reason {
  color: #c8d2df;
}

html[data-theme="dark"] .mrc-roadmap-box {
  background: #111111;
  border: 1px solid #293441;
}

html[data-theme="dark"] .mrc-box-heading {
  color: #afc0d5;
}

html[data-theme="dark"] .mrc-steps {
  color: #b6bdc4;
}

html[data-theme="dark"] .csc-header {
  background: #111111;
  border: 1px solid #293441;
}

html[data-theme="dark"] .csc-pill {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .csc-title {
  color: #c8d2df;
}

html[data-theme="dark"] .csc-desc {
  color: #adb2b8;
}

html[data-theme="dark"] .cpb-stat {
  color: #afc0d5;
}

html[data-theme="dark"] .checklist-item-card {
  background: #111111;
  border: 1px solid #293441;
}

html[data-theme="dark"] .checklist-item-card:hover {
  background: #060708;
}

html[data-theme="dark"] .checklist-item-card.done {
  background: #070a08;
  border-color: #375742;
}

html[data-theme="dark"] .cic-checkbox {
  border: 2px solid #343b44;
  background: #111111;
}

html[data-theme="dark"] .cic-name {
  color: #c8d2df;
}

html[data-theme="dark"] .req-tag {
  color: #cf9898;
  background: #0d0909;
}

html[data-theme="dark"] .cic-desc {
  color: #adb2b8;
}

html[data-theme="dark"] .sop-guide-card {
  background: #111111;
  border: 1px solid #293441;
}

html[data-theme="dark"] .sgc-title {
  color: #c8d2df;
}

html[data-theme="dark"] .sgc-intro {
  color: #b6bdc4;
}

html[data-theme="dark"] .sop-part {
  background: #060708;
  border: 1px solid #2c333c;
}

html[data-theme="dark"] .sp-num {
  color: #afc0d5;
  background: #07090b;
}

html[data-theme="dark"] .sop-part h4 {
  color: #c8d2df;
}

html[data-theme="dark"] .sop-part p {
  color: #b6bdc4;
}

html[data-theme="dark"] .sp-example {
  background: #111111;
  border: 1px solid #343b44;
  color: #afc0d5;
}

html[data-theme="dark"] .dash-quotes-quick-card,
html[data-theme="dark"] .dash-career-quick-card {
  background: #111111;
  border: 1px solid #293441;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.088);
}
/* ---- from css/styles.css ---- */
html[data-theme="dark"] body {
  background-color: #08090a;
  color: #d9dde8;
}

html[data-theme="dark"] .soft-3d-box {
  background: linear-gradient(145deg, #111111 0%, #08090a 100%);
  box-shadow: inset 0 2px 4px rgba(255, 255, 255, 0.108),
    inset 0 -3px 6px rgba(0, 0, 0, 0.176),
    0 8px 18px -4px rgba(0, 0, 0, 0.308);
  border: 1px solid rgba(43, 43, 43, 0.9);
}

html[data-theme="dark"] .welcome-view {
  background: radial-gradient(circle at 12% 18%, rgba(59, 130, 246, 0.14) 0%, transparent 38%),
    radial-gradient(circle at 88% 15%, rgba(245, 158, 11, 0.14) 0%, transparent 36%),
    radial-gradient(circle at 50% 85%, rgba(16, 185, 129, 0.1) 0%, transparent 45%),
    linear-gradient(180deg, #050608 0%, #07080a 52%, #060708 100%);
}

html[data-theme="dark"] .welcome-navbar {
  background: rgba(17, 17, 17, 0.88);
  border-bottom: 1px solid #2c333c;
}

html[data-theme="dark"] .brand-logo-mark {
  box-shadow: inset 0 2px 3px rgba(255, 255, 255, 0.042),
    0 4px 12px rgba(0, 0, 0, 0.6);
}

html[data-theme="dark"] .brand-name {
  color: #d9dde8;
}

html[data-theme="dark"] .brand-tag-chinese {
  color: #dbbd9b;
  background: #0b0a07;
  border: 1px solid #524c34;
}

html[data-theme="dark"] .brand-subtitle {
  color: #b2b6bd;
}

html[data-theme="dark"] .welcome-nav-link {
  color: #c8cdd5;
}

html[data-theme="dark"] .welcome-nav-link:hover,
html[data-theme="dark"] .welcome-nav-link.active {
  color: #9aa9d2;
  background: #07080a;
  border-color: #27313e;
}

html[data-theme="dark"] .btn-launch-app {
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.6);
}

html[data-theme="dark"] .btn-launch-app:hover {
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.6);
}

html[data-theme="dark"] .welcome-eyebrow {
  background: linear-gradient(90deg, #07080a 0%, #14130d 100%);
  border: 1px solid #2c3745;
  color: #bfccdf;
}

html[data-theme="dark"] .welcome-hero h1 {
  color: #d9dde8;
}

html[data-theme="dark"] .welcome-hero-desc {
  color: #c0c5cb;
}

html[data-theme="dark"] .btn-hero-primary {
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.6);
}

html[data-theme="dark"] .btn-hero-primary:hover {
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.6);
}

html[data-theme="dark"] .btn-hero-secondary {
  background: #111111;
  color: #d3d8df;
  border: 1.5px solid #343b44;
}

html[data-theme="dark"] .btn-hero-secondary:hover {
  color: #9aa9d2;
  background: #07080a;
}

html[data-theme="dark"] .quick-mode-chip {
  background: rgba(17, 17, 17, 0.9);
  border: 1px solid #2c333c;
  color: #c8cdd5;
}

html[data-theme="dark"] .quick-mode-chip:hover {
  color: #9aa9d2;
  background: #111111;
}

html[data-theme="dark"] .welcome-showcase-card {
  background: rgba(17, 17, 17, 0.92);
  border: 1px solid #27313e;
  box-shadow: 0 16px 36px -6px rgba(0, 0, 0, 0.308);
}

html[data-theme="dark"] .showcase-mini-card {
  background: linear-gradient(145deg, #111111 0%, #060708 100%);
  border: 1px solid #2c333c;
}

html[data-theme="dark"] .showcase-mini-card:hover {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.132);
}

html[data-theme="dark"] .showcase-mini-card h4 {
  color: #d9dde8;
}

html[data-theme="dark"] .showcase-mini-card p {
  color: #b2b6bd;
}

html[data-theme="dark"] .section-heading h2 {
  color: #d9dde8;
}

html[data-theme="dark"] .section-heading p {
  color: #c0c5cb;
}

html[data-theme="dark"] .overview-card {
  background: #111111;
  border: 1px solid #2c333c;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.11);
}

html[data-theme="dark"] .overview-card:hover {
  box-shadow: 0 8px 24px -4px rgba(0, 0, 0, 0.176);
}

html[data-theme="dark"] .overview-card h3 {
  color: #d9dde8;
}

html[data-theme="dark"] .overview-card p {
  color: #c0c5cb;
}

html[data-theme="dark"] .faq-item {
  background: #111111;
  border: 1px solid #2c333c;
}

html[data-theme="dark"] .faq-item.open {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.132);
}

html[data-theme="dark"] .faq-question-btn {
  color: #d9dde8;
}

html[data-theme="dark"] .faq-answer {
  color: #c0c5cb;
  border-top: 1px dashed #2c333c;
}

html[data-theme="dark"] .contact-info-card,
html[data-theme="dark"] .contact-form-card {
  background: #111111;
  border: 1px solid #2c333c;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.11);
}

html[data-theme="dark"] .contact-form-group label {
  color: #c8cdd5;
}

html[data-theme="dark"] .contact-form-group input,
html[data-theme="dark"] .contact-form-group select,
html[data-theme="dark"] .contact-form-group textarea {
  border: 1px solid #343b44;
  color: #d9dde8;
  background: #060708;
}

html[data-theme="dark"] .contact-form-group input:focus,
html[data-theme="dark"] .contact-form-group select:focus,
html[data-theme="dark"] .contact-form-group textarea:focus {
  background: #111111;
}

html[data-theme="dark"] .app-header {
  background: #111111;
  border-bottom: 1px solid #2c333c;
}

html[data-theme="dark"] .hamburger-btn {
  border: 1px solid #2c333c;
  background: #060708;
  color: #c8cdd5;
}

html[data-theme="dark"] .hamburger-btn:hover {
  background: #07080a;
  color: #9aa9d2;
}

html[data-theme="dark"] .header-quick-nav {
  border-left: 1px solid #2c333c;
}

html[data-theme="dark"] .header-nav-pill {
  color: #c0c5cb;
}

html[data-theme="dark"] .header-nav-pill:hover {
  background: #08090a;
  color: #9aa9d2;
}

html[data-theme="dark"] .stat-pill.daily {
  background: #07080a;
  color: #9aa9d2;
  border: 1px solid #2c3745;
}

html[data-theme="dark"] .stat-pill.streak {
  background: #0b0907;
  color: #d7ab95;
  border: 1px solid #4a3e2f;
}

html[data-theme="dark"] .stat-pill.xp {
  background: #0c0c08;
  color: #debfa7;
  border: 1px solid #524c34;
}

html[data-theme="dark"] .stat-pill.hearts {
  background: #0a0606;
  color: #d197a4;
  border: 1px solid #422a2c;
}

html[data-theme="dark"] .audio-toggle-btn {
  border: 1px solid #2c333c;
  background: #111111;
  color: #9aa9d2;
}

html[data-theme="dark"] .audio-toggle-btn:hover {
  background: #07080a;
}

html[data-theme="dark"] .audio-toggle-btn.muted {
  background: #08090a;
}

html[data-theme="dark"] .app-sidebar {
  background: #111111;
  border-right: 1px solid #2c333c;
}

html[data-theme="dark"] .sidebar-nav-btn {
  color: #c8cdd5;
}

html[data-theme="dark"] .sidebar-nav-btn:hover {
  background: #060708;
  color: #d9dde8;
}

html[data-theme="dark"] .sidebar-nav-btn.active {
  background: #07080a;
  color: #9aa9d2;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.176);
}

html[data-theme="dark"] .sidebar-btn-icon {
  color: #b2b6bd;
}

html[data-theme="dark"] .sidebar-nav-btn.active .sidebar-btn-icon {
  color: #9aa9d2;
}

html[data-theme="dark"] .sidebar-nav-btn.active .sidebar-title-zh {
  color: #90aad5;
}

html[data-theme="dark"] .sidebar-badge.soft {
  background: #0c0e0f;
  color: #c8cdd5;
}

html[data-theme="dark"] .mascot-card {
  background: #0b0a07;
  border: 1px solid #524c34;
}

html[data-theme="dark"] .mascot-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.308);
}

html[data-theme="dark"] .mascot-card-title {
  color: #dfc4b3;
}

html[data-theme="dark"] .mascot-card-quote {
  color: #debfa7;
}

html[data-theme="dark"] .main-content.bg-mode-story {
  background: radial-gradient(circle at 92% 8%, rgba(37, 99, 235, 0.09) 0%, transparent 35%),
    radial-gradient(circle at 8% 90%, rgba(245, 158, 11, 0.08) 0%, transparent 35%),
    #070809;
}

html[data-theme="dark"] .main-content.bg-mode-hanzi {
  background: radial-gradient(circle at 85% 12%, rgba(245, 158, 11, 0.1) 0%, transparent 38%),
    linear-gradient(180deg, #060708 0%, #090806 100%);
}

html[data-theme="dark"] .main-content.bg-mode-career {
  background: radial-gradient(circle at 10% 10%, rgba(15, 58, 109, 0.07) 0%, transparent 40%),
    #07080a;
}

html[data-theme="dark"] .main-content.bg-mode-dialogue {
  background: radial-gradient(circle at 90% 15%, rgba(16, 185, 129, 0.09) 0%, transparent 38%),
    #070909;
}

html[data-theme="dark"] .main-content.bg-mode-grammar {
  background: radial-gradient(circle at 80% 20%, rgba(27, 28, 42, 0.08) 0%, transparent 38%),
    #070809;
}

html[data-theme="dark"] .main-content.bg-mode-accents {
  background: radial-gradient(circle at 15% 20%, rgba(2, 132, 199, 0.1) 0%, transparent 40%),
    radial-gradient(circle at 85% 80%, rgba(245, 158, 11, 0.09) 0%, transparent 40%),
    #07080a;
}

html[data-theme="dark"] .main-content.bg-mode-ai {
  background: radial-gradient(circle at 88% 12%, rgba(225, 29, 72, 0.08) 0%, transparent 36%),
    radial-gradient(circle at 12% 85%, rgba(37, 99, 235, 0.09) 0%, transparent 40%),
    #070709;
}

html[data-theme="dark"] .mode-header-title {
  color: #cad4e5;
}

html[data-theme="dark"] .mode-header-sub {
  color: #b2b6bd;
}

html[data-theme="dark"] .episode-card {
  background: #111111;
  border: 1.5px solid #2c333c;
}

html[data-theme="dark"] .episode-card:hover {
  border-color: #334150;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.132);
}

html[data-theme="dark"] .episode-card.active {
  background: #07080a;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.264);
}

html[data-theme="dark"] .ep-diff-badge {
  background: #0b0a07;
  color: #dbbd9b;
  border: 1px solid #524c34;
}

html[data-theme="dark"] .episode-title-en {
  color: #cad4e5;
}

html[data-theme="dark"] .episode-title-zh {
  color: #93a7d2;
}

html[data-theme="dark"] .episode-desc {
  color: #c0c5cb;
}

html[data-theme="dark"] .story-stage-card {
  background: #111111;
  border: 1px solid #2c333c;
  box-shadow: 0 8px 24px -4px rgba(0, 0, 0, 0.176);
}

html[data-theme="dark"] .speed-control-box {
  border: 1px solid rgba(43, 43, 43, 0.18);
}

html[data-theme="dark"] .speed-btn.active {
  background: #111111;
  color: #cad4e5;
}

html[data-theme="dark"] .npc-dialogue-bubble {
  background: #111111;
  border: 1px solid #2c333c;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.11);
}

html[data-theme="dark"] .npc-name-badge {
  background: #07080a;
  color: #a8b3d6;
}

html[data-theme="dark"] .btn-listen-audio {
  background: #07080a;
  color: #9aa9d2;
  border: 1px solid #2c3745;
}

html[data-theme="dark"] .btn-listen-audio:hover {
  background: #0a0c0f;
}

html[data-theme="dark"] .npc-chinese-line {
  color: #d9dde8;
}

html[data-theme="dark"] .npc-pinyin-line {
  color: #b2b6bd;
}

html[data-theme="dark"] .npc-thai-line {
  color: #d3d8df;
}

html[data-theme="dark"] .scene-vocab-box {
  background: #060708;
  border: 1px solid #2c333c;
}

html[data-theme="dark"] .scene-vocab-header {
  color: #c0c5cb;
}

html[data-theme="dark"] .vocab-mini-card {
  background: #111111;
  border: 1px solid #2c333c;
}

html[data-theme="dark"] .vocab-mini-card:hover {
  background: #07080a;
}

html[data-theme="dark"] .vocab-mini-word {
  color: #cad4e5;
}

html[data-theme="dark"] .vocab-mini-meaning {
  color: #c8cdd5;
}

html[data-theme="dark"] .cultural-tip-box {
  background: #0b0a07;
  border: 1px solid #524c34;
}

html[data-theme="dark"] .cultural-tip-title {
  color: #debfa7;
}

html[data-theme="dark"] .cultural-tip-text {
  color: #dfc4b3;
}

html[data-theme="dark"] .choices-heading {
  color: #c8cdd5;
}

html[data-theme="dark"] .choice-option-card {
  background: #111111;
  border: 1.5px solid #2c333c;
}

html[data-theme="dark"] .choice-option-card:hover {
  background: #050608;
}

html[data-theme="dark"] .choice-option-card.selected {
  background: #070b09;
}

html[data-theme="dark"] .choice-intent-tag {
  color: #c0d0e3;
}

html[data-theme="dark"] .choice-zh {
  color: #d9dde8;
}

html[data-theme="dark"] .choice-pinyin {
  color: #b2b6bd;
}

html[data-theme="dark"] .choice-th {
  color: #c8cdd5;
}

html[data-theme="dark"] .btn-choose-answer {
  background: #14130d;
  color: #debfa7;
  border: 1px solid #524c34;
}

html[data-theme="dark"] .story-feedback-banner {
  background: #070b09;
}

html[data-theme="dark"] .hanzi-top-card {
  background: #06080a;
  border: 1px solid #27313e;
}

html[data-theme="dark"] .hanzi-mode-switch {
  background: #111111;
  border: 1px solid #2c333c;
}

html[data-theme="dark"] .hanzi-switch-btn {
  color: #c0c5cb;
}

html[data-theme="dark"] .hanzi-tab-btn {
  background: #111111;
  border: 1.5px solid #2c333c;
}

html[data-theme="dark"] .hanzi-tab-btn.active {
  background: #07080a;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.33);
}

html[data-theme="dark"] .hanzi-tab-btn.completed::after {
  color: #a5dac9;
}

html[data-theme="dark"] .hanzi-tab-char {
  color: #cad4e5;
}

html[data-theme="dark"] .hanzi-tab-pinyin {
  color: #b2b6bd;
}

html[data-theme="dark"] .hanzi-board-card,
html[data-theme="dark"] .hanzi-detail-card {
  background: #111111;
  border: 1px solid #2c333c;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.11);
}

html[data-theme="dark"] .word-step-pill {
  background: #07080a;
  color: #9aa9d2;
}

html[data-theme="dark"] .btn-outline-sm {
  background: #111111;
  border: 1px solid #2c333c;
  color: #c8cdd5;
}

html[data-theme="dark"] .btn-outline-sm:hover {
  color: #9aa9d2;
}

html[data-theme="dark"] .mizige-wrapper {
  background: #080705;
  border: 2.5px solid #584837;
  box-shadow: inset 0 0 18px rgba(0, 0, 0, 0.176);
}

html[data-theme="dark"] .btn-submit-hanzi {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.55);
}

html[data-theme="dark"] .stroke-order-box {
  border-top: 1px solid #262f39;
}

html[data-theme="dark"] .stroke-order-label {
  color: #b2b6bd;
}

html[data-theme="dark"] .stroke-pill {
  background: #060708;
  border: 1px solid #2c333c;
  color: #a8b3d6;
}

html[data-theme="dark"] .stroke-pill:hover {
  background: #07080a;
  border-color: #334150;
}

html[data-theme="dark"] .stroke-pill.done {
  background: #070b09;
  color: #bce7da;
}

html[data-theme="dark"] .detail-big-char {
  color: #cad4e5;
}

html[data-theme="dark"] .detail-pinyin {
  color: #9aa9d2;
}

html[data-theme="dark"] .detail-tone-text {
  color: #b2b6bd;
}

html[data-theme="dark"] .detail-meaning-line {
  color: #cad4e5;
}

html[data-theme="dark"] .detail-meta-box {
  background: #060708;
  border: 1px solid #2c333c;
}

html[data-theme="dark"] .detail-meta-label {
  color: #b2b6bd;
}

html[data-theme="dark"] .detail-meta-val {
  color: #cad4e5;
}

html[data-theme="dark"] .example-sentence-card {
  background: #060708;
  border: 1px solid #2c333c;
}

html[data-theme="dark"] .directional-dict-section {
  border-top: 1px dashed #2c333c;
}

html[data-theme="dark"] .directional-item {
  background: #050608;
  border: 1px solid #27313e;
}

html[data-theme="dark"] .directional-item:hover {
  background: #07080a;
}

html[data-theme="dark"] .career-track-tab {
  background: #111111;
  border: 1.5px solid #2c333c;
  color: #c8cdd5;
}

html[data-theme="dark"] .career-track-tab.active {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.484);
}

html[data-theme="dark"] .career-dict-card,
html[data-theme="dark"] .career-chat-card {
  background: #111111;
  border: 1px solid #2c333c;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.11);
}

html[data-theme="dark"] .term-pill-btn {
  background: #08090a;
  border: 1px solid #2c333c;
  color: #c8cdd5;
}

html[data-theme="dark"] .active-term-box {
  border: 1px solid #2c333c;
  background: #111111;
}

html[data-theme="dark"] .workplace-bubble {
  background: #060708;
  border: 1px solid #2c333c;
}

html[data-theme="dark"] .workplace-bubble.supplier {
  background: #06080a;
  border-color: #2c3745;
}

html[data-theme="dark"] .card-surface {
  background: #111111;
  border: 1px solid #2c333c;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.11);
}

html[data-theme="dark"] .slot-builder-area {
  background: #060708;
  border: 2px dashed #334150;
}

html[data-theme="dark"] .word-token-btn {
  background: #111111;
  color: #cad4e5;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.11);
}

html[data-theme="dark"] .word-token-btn:hover {
  background: #07080a;
}

html[data-theme="dark"] .lyric-word-chip {
  background: #111111;
  border: 1px solid #2c333c;
}

html[data-theme="dark"] .lyric-word-chip:hover,
html[data-theme="dark"] .lyric-word-chip.active {
  background: #0a0608;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.308);
}

html[data-theme="dark"] .term-pill-btn.wrong {
  background: #0a0606;
  border-color: #4c3033;
  color: #d9a4b1;
}

html[data-theme="dark"] .skill-bar-track {
  background: #08090a;
}

html[data-theme="dark"] .lingora-toast {
  box-shadow: 0 16px 36px -6px rgba(0, 0, 0, 0.308);
}

html[data-theme="dark"] .lingora-toast.success {
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.6), 0 8px 10px -6px rgba(0, 0, 0, 0.6);
}

html[data-theme="dark"] .lingora-toast.error {
  border: 1.5px solid #5a3939;
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.6), 0 8px 10px -6px rgba(0, 0, 0, 0.6);
}

@media (max-width: 820px) {
  html[data-theme="dark"] .app-sidebar {
    box-shadow: 0 16px 36px -6px rgba(0, 0, 0, 0.308);
  }
}

html[data-theme="dark"] .lingora-platform-shell {
  background: #050708;
  color: #c8d2df;
}

html[data-theme="dark"] .lingora-brand-word {
  color: #afc0d5;
}

html[data-theme="dark"] .lingora-brand-tagline {
  color: #d4b491;
}

html[data-theme="dark"] .lingora-top-navbar {
  background: #111111;
  border-bottom: 1.5px solid #293441;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.088);
}

html[data-theme="dark"] .platform-mobile-menu-btn {
  background: #07090b;
  color: #afc0d5;
  border: 1px solid #293441;
}

html[data-theme="dark"] .top-nav-search-wrap {
  background: #050708;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .top-nav-search-wrap:focus-within {
  background: #111111;
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.308);
}

html[data-theme="dark"] .top-nav-search-input {
  color: #c8d2df;
}

html[data-theme="dark"] .search-go-btn,
html[data-theme="dark"] .search-clear-btn {
  color: #FFFFFF;
}

html[data-theme="dark"] .global-search-results-panel {
  background: #111111;
  border: 1.5px solid #293441;
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.308);
}

html[data-theme="dark"] .gsr-header {
  color: #adb2b8;
  border-bottom: 1px solid #293441;
}

html[data-theme="dark"] .gsr-group-title {
  color: #afc0d5;
}

html[data-theme="dark"] .gsr-item {
  background: #050708;
  border: 1px solid #293441;
}

html[data-theme="dark"] .gsr-item:hover {
  background: #07090b;
}

html[data-theme="dark"] .top-nav-icon-pill,
html[data-theme="dark"] .top-nav-icon-btn {
  background: #07090b;
  color: #afc0d5;
  border: 1px solid #293441;
}

html[data-theme="dark"] .nav-counter-badge {
  color: #FFFFFF;
}

html[data-theme="dark"] .top-nav-coin-pill {
  background: #0b0a07;
  border: 1.5px solid #544735;
}

html[data-theme="dark"] .coin-balance-btn {
  color: #c8d2df;
}

html[data-theme="dark"] .coin-add-btn {
  color: #FFFFFF;
}

html[data-theme="dark"] .top-nav-user-trigger {
  background: #111111;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .top-nav-display-name {
  color: #c8d2df;
}

html[data-theme="dark"] .top-nav-level-badge {
  background: #0b0a07;
  color: #debfa7;
  border: 1px solid #544735;
}

html[data-theme="dark"] .top-nav-user-title {
  color: #afc0d5;
}

html[data-theme="dark"] .lingora-dropdown-menu {
  background: #111111;
  border: 1.5px solid #293441;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.352);
}

html[data-theme="dark"] .uds-level {
  color: #debfa7;
}

html[data-theme="dark"] .uds-xp {
  color: #adb2b8;
}

html[data-theme="dark"] .dropdown-divider {
  border-top: 1px solid #293441;
}

html[data-theme="dark"] .dropdown-item {
  color: #c8d2df;
}

html[data-theme="dark"] .dropdown-item:hover {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .dropdown-item.danger {
  color: #ca9b9f;
}

html[data-theme="dark"] .notif-item {
  background: #050708;
}

html[data-theme="dark"] .notif-item.unread {
  background: #07090b;
}

html[data-theme="dark"] .notif-time {
  color: #adb2b8;
}

html[data-theme="dark"] .lingora-left-sidebar {
  background: #111111;
  border-right: 1.5px solid #293441;
}

html[data-theme="dark"] .sidebar-group-heading {
  color: #adb2b8;
}

html[data-theme="dark"] .platform-nav-btn {
  color: #c8d2df;
}

html[data-theme="dark"] .platform-nav-btn:hover {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .platform-nav-btn.active {
  color: #FFFFFF;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.55);
}

html[data-theme="dark"] .sq-pill {
  background: #050708;
  color: #c8d2df;
  border: 1px solid #293441;
}

html[data-theme="dark"] .sq-pill.active,
html[data-theme="dark"] .sq-pill:hover {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .sidebar-lang-chip {
  background: #050708;
  border: 1px solid #293441;
}

html[data-theme="dark"] .sidebar-lang-chip.active {
  color: #FFFFFF;
}

html[data-theme="dark"] .sidebar-sublink-btn {
  color: #a0b4c7;
}

html[data-theme="dark"] .sidebar-learn-lang-row {
  background: #050708;
  border: 1px solid #293441;
}

html[data-theme="dark"] .sll-pct {
  color: #afc0d5;
}

html[data-theme="dark"] .sidebar-assistant-card {
  background: linear-gradient(155deg, #0b0a07 0%, #111111 100%);
  border: 1.5px solid #544735;
}

html[data-theme="dark"] .sac-badge {
  color: #debfa7;
}

html[data-theme="dark"] .sac-name {
  color: #c8d2df;
}

html[data-theme="dark"] .sac-quote {
  color: #adb2b8;
}

html[data-theme="dark"] .sac-btn {
  border: 1px solid #293441;
}

html[data-theme="dark"] .sac-btn.primary {
  color: #FFFFFF;
}

html[data-theme="dark"] .sac-btn.secondary {
  background: #111111;
  color: #c8d2df;
}

html[data-theme="dark"] .sac-btn.accent {
  color: #FFFFFF;
}

html[data-theme="dark"] .btn-lingora-primary {
  color: #FFFFFF;
}

html[data-theme="dark"] .btn-lingora-secondary {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .btn-lingora-caramel {
  color: #FFFFFF;
}

html[data-theme="dark"] .btn-lingora-outline {
  background: #111111;
  color: #c8d2df;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .btn-lingora-outline:hover {
  color: #afc0d5;
}

html[data-theme="dark"] .btn-lingora-outline.danger {
  color: #ca9b9f;
  border-color: #422a2c;
}

html[data-theme="dark"] .btn-text-link {
  color: #afc0d5;
}

html[data-theme="dark"] .dashboard-welcome-banner {
  background: linear-gradient(135deg, #0b0a07 0%, #07090b 58%, #0e0c09 100%);
  border: 1.5px solid #544735;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.132);
}

html[data-theme="dark"] .dwb-level-pill {
  color: #FFFFFF;
}

html[data-theme="dark"] .dwb-title-pill {
  color: #FFFFFF;
}

html[data-theme="dark"] .dwb-demo-tag {
  background: #111111;
  color: #adb2b8;
  border: 1px solid #293441;
}

html[data-theme="dark"] .dwb-greeting {
  color: #c8d2df;
}

html[data-theme="dark"] .dwb-motivational {
  color: #adb2b8;
}

html[data-theme="dark"] .dwb-xp-progress-box {
  background: rgba(17, 17, 17, 0.85);
  border: 1px solid #293441;
}

html[data-theme="dark"] .lingora-progress-track {
  background: #0a0c0f;
}

html[data-theme="dark"] .dwb-mascot-frame {
  background: #111111;
  border: 1.5px solid #544735;
}

html[data-theme="dark"] .dwb-mascot-caption {
  color: #c8d2df;
}

html[data-theme="dark"] .dash-section-card {
  background: #111111;
  border: 1.5px solid #293441;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.066);
}

html[data-theme="dark"] .dash-section-title {
  color: #afc0d5;
}

html[data-theme="dark"] .dash-section-sub {
  color: #adb2b8;
}

html[data-theme="dark"] .dash-lang-card {
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .dlc-symbol {
  color: #afc0d5;
}

html[data-theme="dark"] .dlc-pct-badge {
  background: #111111;
  color: #c8d2df;
}

html[data-theme="dark"] .dlc-status {
  color: #adb2b8;
}

html[data-theme="dark"] .dash-course-card {
  border: 1.5px solid #293441;
  background: #111111;
}

html[data-theme="dark"] .dcc-thumb.theme-cream-gold {
  background: linear-gradient(135deg, #0b0a07 0%, #15120e 100%);
  color: #dcc8b0;
}

html[data-theme="dark"] .dcc-thumb.theme-blue-sky {
  background: linear-gradient(135deg, #07090b 0%, #0d1014 100%);
  color: #afc0d5;
}

html[data-theme="dark"] .dcc-thumb.theme-rose-cream {
  background: linear-gradient(135deg, #0a0608 0%, #0d080b 100%);
  color: #daafc0;
}

html[data-theme="dark"] .dcc-thumb.theme-mint-blue {
  background: linear-gradient(135deg, #070b09 0%, #0c130f 100%);
  color: #c5e8de;
}

html[data-theme="dark"] .dcc-diff-pill {
  background: rgba(17, 17, 17, 0.85);
}

html[data-theme="dark"] .dcc-meta-row {
  color: #adb2b8;
}

html[data-theme="dark"] .dcc-title {
  color: #c8d2df;
}

html[data-theme="dark"] .dcc-desc {
  color: #adb2b8;
}

html[data-theme="dark"] .dcc-footer {
  border-top: 1px solid #293441;
}

html[data-theme="dark"] .dcc-price {
  color: #d4b491;
}

html[data-theme="dark"] .dash-post-mini {
  background: #050708;
  border: 1px solid #293441;
}

html[data-theme="dark"] .dpm-meta {
  color: #adb2b8;
}

html[data-theme="dark"] .dpm-excerpt {
  color: #adb2b8;
}

html[data-theme="dark"] .dpm-act-btn {
  background: #111111;
  border: 1px solid #293441;
}

html[data-theme="dark"] .dash-chat-row {
  background: #050708;
  border: 1px solid #293441;
}

html[data-theme="dark"] .online-dot {
  border: 2px solid #2b2b2b;
}

html[data-theme="dark"] .dcr-msg {
  color: #adb2b8;
}

html[data-theme="dark"] .unread-pill {
  color: #FFFFFF;
}

html[data-theme="dark"] .psw-level {
  color: #debfa7;
}

html[data-theme="dark"] .psw-stats {
  color: #adb2b8;
}

html[data-theme="dark"] .psw-bio {
  color: #adb2b8;
}

html[data-theme="dark"] .top10-mini-row {
  background: #050708;
  border: 1px solid #293441;
}

html[data-theme="dark"] .top10-mini-row.is-kk {
  background: #0b0a07;
}

html[data-theme="dark"] .t10-rank {
  color: #afc0d5;
}

html[data-theme="dark"] .t10-sub {
  color: #adb2b8;
}

html[data-theme="dark"] .t10-score {
  color: #afc0d5;
}

html[data-theme="dark"] .adw-pill {
  color: #debfa7;
  background: #0b0a07;
}

html[data-theme="dark"] .adw-desc {
  color: #adb2b8;
}

html[data-theme="dark"] .adw-suggestion {
  background: #0b0a07;
  border: 1px solid #544735;
}

html[data-theme="dark"] .recent-activity-item {
  background: #050708;
  border: 1px solid #293441;
}

html[data-theme="dark"] .rai-meta {
  color: #adb2b8;
}

html[data-theme="dark"] .rai-xp {
  color: #aecbc4;
}

html[data-theme="dark"] .mpp-studio-badge {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .mpp-species-tag {
  color: #adb2b8;
}

html[data-theme="dark"] .mpp-canvas-stage {
  background: #050708;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .mpp-char-name {
  color: #c8d2df;
}

html[data-theme="dark"] .mpp-summary-card {
  background: #050708;
  border: 1px solid #293441;
}

html[data-theme="dark"] .mcp-block {
  border-bottom: 1px solid #293441;
}

html[data-theme="dark"] .mcp-block-title {
  color: #afc0d5;
}

html[data-theme="dark"] .mcp-char-btn,
html[data-theme="dark"] .mcp-preset-chip,
html[data-theme="dark"] .mcp-tab-btn {
  background: #050708;
  color: #c8d2df;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .mcp-char-btn.active,
html[data-theme="dark"] .mcp-preset-chip.active,
html[data-theme="dark"] .mcp-tab-btn.active {
  color: #FFFFFF;
}

html[data-theme="dark"] .mcp-char-btn.locked,
html[data-theme="dark"] .cust-choice-btn.locked {
  background: #08090a;
}

html[data-theme="dark"] .color-swatch-card,
html[data-theme="dark"] .cust-choice-btn {
  background: #050708;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .color-swatch-card.active,
html[data-theme="dark"] .cust-choice-btn.active {
  background: #07090b;
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.33);
}

html[data-theme="dark"] .custom-color-picker-row {
  background: #050708;
}

html[data-theme="dark"] .page-heading {
  color: #afc0d5;
}

html[data-theme="dark"] .page-subheading {
  color: #adb2b8;
}

html[data-theme="dark"] .form-field label {
  color: #c8d2df;
}

html[data-theme="dark"] .lingora-input,
html[data-theme="dark"] .lingora-select,
html[data-theme="dark"] .lingora-textarea {
  border: 1.5px solid #293441;
  color: #c8d2df;
  background: #111111;
}

html[data-theme="dark"] .form-feedback-banner.success {
  background: #070b09;
  color: #c5e8de;
}

html[data-theme="dark"] .form-feedback-banner.error {
  background: #0a0606;
  color: #dcaebb;
  border: 1.5px solid #422a2c;
}

html[data-theme="dark"] .demo-mode-banner {
  background: #0b0a07;
  border: 1.5px solid #544735;
  color: #dcc8b0;
}

html[data-theme="dark"] .public-hero-banner {
  background: linear-gradient(135deg, #111111 0%, #07090b 60%, #0b0a07 100%);
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .text-primary-blue {
  color: #afc0d5;
}

html[data-theme="dark"] .public-mascot-showcase-card {
  background: #111111;
  border: 1.5px solid #544735;
}

html[data-theme="dark"] .public-feature-card,
html[data-theme="dark"] .mascot-collection-card,
html[data-theme="dark"] .shop-item-card,
html[data-theme="dark"] .private-room-card,
html[data-theme="dark"] .partner-card {
  background: #111111;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .mascot-collection-card.featured-snake {
  background: linear-gradient(180deg, #0b0a07 0%, #111111 35%);
}

html[data-theme="dark"] .auth-card {
  background: #111111;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .lps-card {
  background: #111111;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .lps-card.active {
  background: #07090b;
}

html[data-theme="dark"] .learning-filters-bar {
  background: #111111;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .lesson-select-card {
  background: #111111;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .lesson-select-card.active {
  background: #07090b;
}

html[data-theme="dark"] .interactive-lesson-player {
  background: #111111;
}

html[data-theme="dark"] .ilp-box,
html[data-theme="dark"] .ilp-vocab-card {
  background: #050708;
  border: 1px solid #293441;
}

html[data-theme="dark"] .ilp-box.cream {
  background: #0b0a07;
  border-color: #544735;
}

html[data-theme="dark"] .ilp-exercise-stage {
  background: #050708;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .lec-option-btn {
  background: #111111;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .lec-option-btn.selected {
  color: #FFFFFF;
}

html[data-theme="dark"] .lec-feedback.ok {
  background: #070b09;
  color: #c5e8de;
}

html[data-theme="dark"] .lec-feedback.err {
  background: #0a0606;
  color: #dcaebb;
}

html[data-theme="dark"] .lesson-completion-summary {
  background: #0b0a07;
}

html[data-theme="dark"] .community-post-card {
  background: #111111;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .cpc-act-btn {
  background: #050708;
  border: 1px solid #293441;
}

html[data-theme="dark"] .cpc-act-btn.active {
  background: #07090b;
  color: #afc0d5;
}

html[data-theme="dark"] .chat-messenger-layout {
  background: #111111;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .chat-conv-sidebar {
  border-right: 1.5px solid #293441;
  background: #050708;
}

html[data-theme="dark"] .ccs-item.active {
  background: #111111;
}

html[data-theme="dark"] .caw-header {
  border-bottom: 1px solid #293441;
}

html[data-theme="dark"] .caw-messages-area {
  background: #050607;
}

html[data-theme="dark"] .chat-bubble {
  background: #111111;
  border: 1px solid #293441;
}

html[data-theme="dark"] .chat-bubble-row.mine .chat-bubble {
  color: #FFFFFF;
}

html[data-theme="dark"] .caw-input-bar {
  border-top: 1px solid #293441;
}

html[data-theme="dark"] .leaderboard-full-row {
  border: 1px solid #293441;
  background: #050708;
}

html[data-theme="dark"] .leaderboard-full-row.highlight-kk {
  background: #0b0a07;
}

html[data-theme="dark"] .profile-hero-card {
  background: #111111;
  border: 1.5px solid #293441;
}

html[data-theme="dark"] .phc-pill {
  background: rgba(17, 17, 17, 0.9);
}

html[data-theme="dark"] .lingora-modal-card {
  background: #111111;
  border: 2px solid #293441;
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.55);
}

html[data-theme="dark"] .modal-close-btn {
  background: #050708;
  border: 1px solid #293441;
}

@media (max-width: 820px) {
  html[data-theme="dark"] .lingora-left-sidebar.mobile-open {
    box-shadow: 8px 0 28px rgba(0, 0, 0, 0.396);
  }
}

/* ---- from css/theme-dark-extra.css ---- */
/* Hand-written theme rules, appended to css/theme-dark.css by tools/build-dark-theme.mjs.
   Rules here apply in both themes unless scoped to html[data-theme="dark"]. */

/* Theme toggle button: shows the moon in light mode, the sun in dark mode */
.theme-toggle-btn .theme-icon-to-light,
html[data-theme="dark"] .theme-toggle-btn .theme-icon-to-dark {
  display: none;
}

html[data-theme="dark"] .theme-toggle-btn .theme-icon-to-light {
  display: inline;
}

.theme-toggle-btn {
  font-size: 15px;
  line-height: 1;
}

.welcome-theme-toggle {
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
  border-radius: 12px;
  border: 1px solid var(--lp-border);
  background: var(--lp-blue-soft);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  margin-right: 10px;
}

html,
body {
  transition: background-color 0.2s ease, color 0.2s ease;
}

html[data-theme="dark"],
html[data-theme="dark"] body {
  background: #000000;
  color: #e5e5e5;
}

/* Inputs without their own colors follow the dark surface */
html[data-theme="dark"] input:not([type="range"]):not([type="checkbox"]):not([type="radio"]),
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
  color: #e5e5e5;
}

html[data-theme="dark"] ::placeholder {
  color: #8a8a8a;
}

/* Mascot art and photos keep their original colors; only soften them a little */
html[data-theme="dark"] img:not([src$=".svg"]) {
  filter: brightness(0.92);
}