/* src/css/dark-mode.css */
html[data-eye-mode=dim] {
  color-scheme: dark;
  --color-background: #242424;
  --color-text: #d8d4c4;
  --color-text-strong: #ece9dc;
  --color-text-subtle: #b8b2a2;
  --color-meta: #aaa596;
  --color-border: #4a4943;
  --color-link-underline: #777062;
  --color-code-bg: #1d1d1b;
  --color-surface: #30302d;
  --color-surface-hover: #3a3a36;
  --color-overlay-bg: rgba(0, 0, 0, 0.75);
  --color-shadow: rgba(0, 0, 0, 0.3);
  --color-highlight: #f9a825;
  --color-inline-code-bg: rgba(200, 200, 190, 0.1);
  --color-article-gradient: rgba(255, 255, 255, 0.02);
  --color-blockquote-bg: rgba(255, 255, 255, 0.04);
  --color-header-bg: rgba(36, 36, 36, 0.85);
  --color-home-bg: #242424;
  --color-token-base: #d4d0c4;
  --color-token-comment: #6a7586;
  --color-token-punctuation: #8c8fa6;
  --color-token-property: #e06c75;
  --color-token-number: #c678dd;
  --color-token-string: #98c379;
  --color-token-operator: #d19aee;
  --color-token-keyword: #8ab4f8;
  --color-token-function: #e5c07b;
  --color-token-regex: #e06c75;
  --color-alert-note: #4493f8;
  --color-alert-note-bg: rgba(68, 147, 248, 0.1);
  --color-alert-tip: #3fb950;
  --color-alert-tip-bg: rgba(63, 185, 80, 0.1);
  --color-alert-important: #a371f7;
  --color-alert-important-bg: rgba(163, 113, 247, 0.1);
  --color-alert-warning: #d29922;
  --color-alert-warning-bg: rgba(210, 153, 34, 0.1);
  --color-alert-caution: #f85149;
  --color-alert-caution-bg: rgba(248, 81, 73, 0.1);
  --color-404-error: #f85149;
  --color-sweltering: #e8854a;
  --color-search-icon: #888880;
  --color-glass-bg: rgba(36, 36, 36, 0.85);
  --color-glass-border: rgba(255, 255, 255, 0.06);
  --color-glass-shadow: rgba(0, 0, 0, 0.2);
  --color-glass-header-bg: rgba(36, 36, 36, 0.5);
  --color-copy-btn-border: rgba(255, 255, 255, 0.08);
  --color-copy-btn-bg: rgba(255, 255, 255, 0.06);
  --color-copy-btn-hover-border: rgba(255, 255, 255, 0.15);
  --color-copy-btn-hover-bg: rgba(255, 255, 255, 0.1);
  --color-copy-btn-focus-border: rgba(255, 255, 255, 0.2);
  --color-copy-btn-focus-bg: rgba(255, 255, 255, 0.15);
  --color-copy-btn-focus-ring: rgba(200, 200, 190, 0.1);
  --color-scrollbar-thumb: rgba(200, 200, 190, 0.25);
  --color-success: #3fb950;
  --color-success-bg: rgba(63, 185, 80, 0.1);
  --color-error: #f85149;
  --color-error-bg: rgba(248, 81, 73, 0.1);
  --mp-bg: #30302d;
  --mp-border: #4a4943;
  --mp-shadow: rgba(0, 0, 0, 0.25);
  --mp-text: #ece9dc;
  --mp-text-secondary: #aaa596;
  --mp-cover-bg:
    linear-gradient(
      135deg,
      #3a3a36,
      #30302d);
  --mp-cover-fallback-color: #888880;
  --mp-play-bg: #ece9dc;
  --mp-play-color: #242424;
  --mp-bar-bg: #4a4943;
  --mp-fill-bg: #ece9dc;
  --mp-item-active-bg: #3a3a36;
  --mp-item-hover-bg: #353530;
  --waline-white: #ece9dc;
  --waline-light-grey: #aaa596;
  --waline-dark-grey: #d8d4c4;
  --waline-color: #d8d4c4;
  --waline-bg-color: #242424;
  --waline-bg-color-light: #30302d;
  --waline-bg-color-hover: #3a3a36;
  --waline-border-color: #4a4943;
  --waline-disable-bg-color: #30302d;
  --waline-disable-color: #b8b2a2;
  --waline-bq-color: #3a3a36;
  --waline-info-bg-color: #30302d;
  --waline-info-color: #aaa596;
  --waline-warning-color: #d29922;
  --waline-warning-bg-color: rgba(210, 153, 34, 0.1);
  --waline-badge-color: #8ab4f8;
}
html[data-eye-mode=dim] body.photography-layout .site-header,
html[data-eye-mode=dim] body:has(.post-cover-fullwidth) .site-header {
  background-color: rgba(36, 36, 36, 0.85);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
html[data-eye-mode=dim] body.photography-layout {
  --photo-bg: #242424;
  --photo-bg-secondary: #1d1d1b;
  --photo-bg-tertiary: #30302d;
  --photo-text: #d8d4c4;
  --photo-text-strong: #ece9dc;
  --photo-text-secondary: #b8b2a2;
  --photo-text-muted: #aaa596;
  --photo-border: #4a4943;
  --photo-border-light: rgba(255, 255, 255, 0.06);
  --photo-shadow: rgba(0, 0, 0, 0.3);
  --photo-shadow-hover: rgba(0, 0, 0, 0.45);
}
html[data-eye-mode=dim] .photography-layout .photography-view-icon {
  background: rgba(0, 0, 0, 0.72);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
}
html[data-eye-mode=dim] .photography-layout .photography-year-heading {
  color: var(--photo-text-strong, #ece9dc);
}
html[data-eye-mode=dim] .photography-layout .photography-meta {
  color: rgba(255, 255, 255, 0.6);
}
html[data-eye-mode=dim] .copy-toast {
  background: rgba(48, 48, 45, 0.95);
  color: var(--color-text-strong);
  border: 1px solid var(--color-border);
}
html[data-eye-mode=dim] .simple-search-input {
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23888880' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='16.65' y1='16.65' x2='21' y2='21'/%3E%3C/svg%3E");
}
html[data-eye-mode=dim] .search-overlay-content {
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
}
html[data-eye-mode=dim] .pagination-quickjump {
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
}
html[data-eye-mode=dim] .footnote-preview {
  background-color: var(--color-background);
  color: var(--color-text);
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.3);
}
html[data-eye-mode=dim] .footnote-preview::after {
  border-color: var(--color-background) transparent transparent transparent;
}
html[data-eye-mode=dim] .footnote-preview[data-placement=bottom]::after {
  border-color: transparent transparent var(--color-background) transparent;
}
html[data-eye-mode=dim] .footnote-target-highlight {
  animation-name: footnote-target-highlight-dim;
}
@keyframes footnote-target-highlight-dim {
  0% {
    background-color: rgba(255, 235, 167, 0.5);
    box-shadow: 0 0 0 6px rgba(255, 235, 167, 0.15);
  }
  100% {
    background-color: transparent;
    box-shadow: none;
  }
}
html[data-eye-mode=dim] .page-404 .terminal-header {
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
html[data-eye-mode=dim] .mobile-nav-overlay {
  background-color: rgba(0, 0, 0, 0.6);
}
html[data-eye-mode=dim] .mobile-nav-sidebar {
  box-shadow: -5px 0 25px rgba(0, 0, 0, 0.3);
}
html[data-eye-mode=dim] .about-contact-toast {
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
  color: var(--color-text-strong);
}
body,
.site-header,
.home-intro,
.home-scroll-content {
  transition: background-color 0.3s ease, color 0.3s ease;
}
html[data-eye-mode=dim] .mermaid-error {
  border-color: var(--color-404-error);
  color: var(--color-404-error);
  background-color: rgba(248, 81, 73, 0.08);
}
html[data-eye-mode=dim] .comment-section .wl-editor:focus,
html[data-eye-mode=dim] .comment-section .wl-input:focus {
  background: var(--waline-bg-color-light);
}
html[data-eye-mode=dim] .comment-section .wl-card .wl-content.expand::before {
  background:
    linear-gradient(
      180deg,
      #242424,
      rgba(36, 36, 36, 0.9));
}
html[data-eye-mode=dim] .comment-section .wl-card .wl-content.expand::after {
  background: rgba(36, 36, 36, 0.9);
  color: var(--waline-dark-grey);
}
html[data-eye-mode=dim] .comment-section .wl-card .wl-quote {
  border-inline-start-color: rgba(255, 255, 255, 0.1);
}
html[data-eye-mode=dim] .comment-section .wl-gif-popup img {
  border-color: var(--waline-border-color);
}
html[data-eye-mode=dim] .post-content mark,
html[data-eye-mode=dim] .page-content mark {
  color: #fff;
  background-color: #f9a825;
}
html[data-eye-mode=dim] .footnote-preview mark {
  color: #fff;
  background-color: #f9a825;
}
html[data-eye-mode=dim] .wl-custom-toast {
  background: rgba(48, 48, 45, 0.95) !important;
  color: var(--color-text-strong) !important;
  border-color: var(--color-border) !important;
}
html[data-eye-mode=dim] .post-content li.task-list-item > input[type=checkbox],
html[data-eye-mode=dim] .page-content li.task-list-item > input[type=checkbox] {
  background: var(--color-code-bg);
  border-color: var(--color-border);
}
html[data-eye-mode=dim] .post-content li.task-list-item > input[type=checkbox]:not([checked]):not(:disabled):hover,
html[data-eye-mode=dim] .page-content li.task-list-item > input[type=checkbox]:not([checked]):not(:disabled):hover {
  border-color: var(--color-text-subtle);
}
html[data-eye-mode=dim] .post-content li.task-list-item > input[type=checkbox][checked],
html[data-eye-mode=dim] .page-content li.task-list-item > input[type=checkbox][checked] {
  background: var(--color-text-subtle);
  border-color: var(--color-text-subtle);
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23242424' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3.5 8.5 6.5 11.5 12.5 5.5'/%3E%3C/svg%3E");
  background-size: 12px 12px;
  background-position: center;
  background-repeat: no-repeat;
}
html[data-eye-mode=dim] .post-content li.task-list-item > input[type=checkbox][checked] + label,
html[data-eye-mode=dim] .page-content li.task-list-item > input[type=checkbox][checked] + label {
  color: var(--color-meta);
}