/* Neutral reading surfaces; banner accents are constrained, paired palettes. */
:root,
html[data-user-color-scheme=light] {
  color-scheme: light;
  --body-bg-color: #f4f6f8;
  --board-bg-color: #fff;
  --text-color: #283648;
  --post-text-color: #283648;
  --post-heading-color: #1f2d3e;
  --sec-text-color: #647487;
  --line-color: #e1e7ed;
  --fold-title-color: var(--text-color);
  --fold-border-color: var(--line-color);
  --navbar-bg-color: #f4f6f8;
  --navbar-text-color: #283648;
  --subtitle-color: #fff;
  --scrollbar-color: #aab6c3;
  --scrollbar-hover-color: #7f90a2;
  --button-bg-color: transparent;
  --button-hover-bg-color: #eaf0f5;
  --link-hover-bg-color: #edf2f7;
  --site-nav-surface: rgba(244,246,248,.94);
  --site-accent: var(--site-accent-light, #315f89);
  --site-accent-hover: var(--site-accent-hover-light, #24496c);
  --site-accent-soft: var(--site-accent-soft-light, #edf3fa);
  --site-on-accent: #fff;
  --site-tool-accent: #315f89;
  --site-tool-hover: #24496c;
  --site-tool-soft: #edf3fa;
  --site-warning: #925609;
  --site-warning-bg: #fff4e3;
  --site-error: #b43542;
  --site-success: #24704c;
  --site-shadow: 0 12px 45px rgba(24,49,83,.06);
  --post-link-color: var(--site-accent);
  --link-hover-color: var(--site-accent-hover);
}
html[data-user-color-scheme=dark] {
  color-scheme: dark;
  --body-bg-color: #151c26;
  --board-bg-color: #202b38;
  --text-color: #dfe7ef;
  --post-text-color: #dfe7ef;
  --post-heading-color: #edf2f8;
  --sec-text-color: #a4b2c2;
  --line-color: #3b4859;
  --navbar-bg-color: #151c26;
  --navbar-text-color: #dfe7ef;
  --subtitle-color: #fff;
  --scrollbar-color: #536578;
  --scrollbar-hover-color: #7d91a6;
  --button-hover-bg-color: #2d3b4d;
  --link-hover-bg-color: #2d3b4d;
  --site-nav-surface: rgba(21,28,38,.94);
  --site-accent: var(--site-accent-dark, #96bce5);
  --site-accent-hover: var(--site-accent-hover-dark, #bdd5f0);
  --site-accent-soft: var(--site-accent-soft-dark, #2b3b50);
  --site-on-accent: #151c26;
  --site-tool-accent: #96bce5;
  --site-tool-hover: #bdd5f0;
  --site-tool-soft: #2b3b50;
  --site-warning: #f0bc77;
  --site-warning-bg: #40372b;
  --site-error: #ff98a3;
  --site-success: #8ed7ae;
  --site-shadow: 0 12px 45px rgba(0,0,0,.14);
}
/* A tool keeps the same action language regardless of its decorative banner. */
html[data-site-page=tool] {
  --site-accent: var(--site-tool-accent);
  --site-accent-hover: var(--site-tool-hover);
  --site-accent-soft: var(--site-tool-soft);
}
#board { box-shadow: var(--site-shadow); }
#navbar.navbar {
  background-color: transparent;
  box-shadow: none;
  border-bottom: 1px solid transparent;
}
#navbar.navbar::before {
  content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(to bottom, rgba(10,20,32,.58), rgba(10,20,32,.06));
  opacity: 1;
}
#navbar.top-nav-collapse::before,
#navbar.navbar-col-show::before,
html[data-site-page=tool] #navbar::before { opacity: 0; }
#navbar .navbar-toggler .animated-icon span { background-color: currentColor; }
#navbar.navbar .navbar-brand,
#navbar.navbar .nav-link { color: #fff; }
#navbar.navbar.top-nav-collapse,
#navbar.navbar.navbar-col-show,
html[data-site-page=tool] #navbar.navbar {
  background-color: var(--site-nav-surface);
  border-bottom-color: var(--line-color);
  box-shadow: 0 2px 16px rgba(15,30,45,.04);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
#navbar.top-nav-collapse .navbar-brand,
#navbar.top-nav-collapse .nav-link,
#navbar.navbar-col-show .navbar-brand,
#navbar.navbar-col-show .nav-link,
html[data-site-page=tool] #navbar .navbar-brand,
html[data-site-page=tool] #navbar .nav-link { color: var(--navbar-text-color); }
#navbar .navbar-toggler { color: #fff; }
#navbar.top-nav-collapse .navbar-toggler,
#navbar.navbar-col-show .navbar-toggler,
html[data-site-page=tool] #navbar .navbar-toggler { color: var(--navbar-text-color); }
#navbar .dropdown-menu,
#mobile-grid-menu,
#local-search .modal-content {
  background: var(--board-bg-color);
  color: var(--text-color);
  border-color: var(--line-color);
}
#navbar.navbar .nav-link:hover { color: #dceaf6; }
#navbar.top-nav-collapse .nav-link:hover,
#navbar.navbar-col-show .nav-link:hover,
html[data-site-page=tool] #navbar .nav-link:hover { color: var(--site-accent); }
#navbar .dropdown-item { color: var(--text-color); }
#navbar .dropdown-item:hover,
#navbar .dropdown-item:focus { background: var(--site-accent-soft); color: var(--site-accent); }
#mobile-grid-menu .mobile-grid-item { color: var(--text-color); background-color: var(--body-bg-color); }
#mobile-grid-menu .mobile-grid-item:hover { background-color: var(--site-accent-soft); }
#mobile-grid-menu .mobile-grid-group-header { color: var(--sec-text-color); }
#nprogress .bar { background: var(--site-accent) !important; }
#nprogress .peg { box-shadow: 0 0 10px var(--site-accent), 0 0 5px var(--site-accent) !important; }
::selection { background: var(--site-accent-soft); color: var(--text-color); }
.site-appearance-trigger {
  appearance: none; background: transparent; border: 0; color: inherit;
  font: inherit; cursor: pointer;
}
#navbar .site-appearance-trigger { display: inline-flex; align-items: center; justify-content: center; padding: .5rem; }
.site-appearance-icon { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; }
#mobile-grid-menu .site-appearance-trigger { width: 100%; }
#mobile-grid-menu .site-appearance-icon { width: 24px; height: 24px; margin-bottom: .35rem; }
.site-appearance-panel {
  position: fixed; top: 4.4rem; right: max(1rem, env(safe-area-inset-right));
  width: min(20rem, calc(100vw - 2rem)); z-index: 1100;
  padding: 1rem; border: 1px solid var(--line-color); border-radius: 16px;
  background: var(--board-bg-color); color: var(--text-color);
  box-shadow: 0 16px 48px rgba(10,20,32,.18);
}
.site-appearance-panel[hidden] { display: none; }
.site-appearance-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: .8rem; }
.site-appearance-close { border: 0; background: transparent; color: var(--sec-text-color); cursor: pointer; font-size: 1.4rem; padding: 0 .4rem; }
.site-appearance-options { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: .4rem; }
.site-appearance-option {
  display: flex; flex-direction: column; align-items: center; gap: .55rem;
  padding: .85rem .25rem; min-height: 76px; font: inherit; font-size: .8rem;
  background: var(--body-bg-color); color: var(--sec-text-color);
  border: 1px solid transparent; border-radius: 10px; cursor: pointer;
}
.site-appearance-option[aria-pressed=true] { color: var(--site-accent); border-color: var(--site-accent); background: var(--site-accent-soft); }
.site-appearance-option:hover { color: var(--site-accent); }
.site-appearance-trigger:focus-visible,
.site-appearance-panel button:focus-visible { outline: 2px solid var(--site-accent); outline-offset: 3px; }
.site-appearance-note { margin: .8rem 0 0; color: var(--sec-text-color); font-size: .75rem; }
html[data-user-color-scheme=dark] .markdown-body table tr { background: var(--board-bg-color); }
html[data-user-color-scheme=dark] .markdown-body table tr:nth-child(2n) { background: var(--body-bg-color); }
html[data-user-color-scheme=dark] .markdown-body blockquote { color: var(--sec-text-color); border-color: var(--line-color); }
@media (max-width: 991.98px) {
  .site-appearance-panel { top: 4.5rem; left: 50%; right: auto; transform: translateX(-50%); }
}
@media (prefers-reduced-motion: no-preference) {
  html.site-theme-ready body,
  html.site-theme-ready #board,
  html.site-theme-ready #navbar,
  html.site-theme-ready #mobile-grid-menu,
  html.site-theme-ready .markdown-body,
  html.site-theme-ready .markdown-body :is(h1,h2,h3,h4,h5,h6,a,blockquote,td,th,tr),
  html.site-theme-ready :is(.site-appearance-panel,.site-appearance-option,.clipboard-tool,.markdown-viewer,.transfer-tool) {
    transition: background-color .3s ease, color .3s ease, border-color .3s ease, box-shadow .3s ease;
  }
  #navbar::before { transition: opacity .3s ease; }
  .site-appearance-panel { animation: appearance-enter .16s ease-out; }
  @keyframes appearance-enter { from { opacity: 0; margin-top: -.3rem; } to { opacity: 1; margin-top: 0; } }
}
@media (prefers-reduced-motion: reduce) {
  #navbar, #navbar::before, #navbar *, #mobile-grid-menu, #mobile-grid-menu *, .site-appearance-panel, .site-appearance-option { animation: none !important; transition: none !important; }
}

/* Local monochrome navigation icons; inherit light/dark and hover colors. */
.site-nav-icon {
  display: inline-block;
  width: 1.1em;
  height: 1.1em;
  vertical-align: -0.15em;
  background-color: currentColor;
  -webkit-mask: var(--site-nav-icon) center / contain no-repeat;
  mask: var(--site-nav-icon) center / contain no-repeat;
}
#mobile-grid-menu .mobile-grid-item .site-nav-icon { font-size: 1.5rem; }
.site-nav-daily { --site-nav-icon: url("/img/icons/nav-daily.svg"); }
.site-nav-tools { --site-nav-icon: url("/img/icons/nav-tools.svg"); }
.site-nav-transfer { --site-nav-icon: url("/img/icons/nav-transfer.svg"); }
.site-nav-clipboard { --site-nav-icon: url("/img/icons/nav-clipboard.svg"); }
.site-nav-experiments { --site-nav-icon: url("/img/icons/nav-experiments.svg"); }
.site-nav-markdown { --site-nav-icon: url("/img/icons/nav-markdown.svg"); }
@media (min-width: 992px) {
  #navbar .dropdown-menu { left: auto; right: 0; }
}