.site-settings-section-title { margin-top: 19px; }
.site-settings-switch:disabled { cursor: default; }
.site-settings-switch:disabled small { color: #77777e; }
.spotlight-toggle {
  display: inline-flex; align-items: center; gap: 8px; min-height: 38px;
  padding: 8px 14px; border: 1px solid #dcdce2; border-radius: 999px;
  background: #f5f5f7; color: #5f5f66; cursor: pointer; font: inherit;
  font-size: 12px; font-weight: 550; box-shadow: inset 0 1px #fff, 0 3px 12px #1e1e2d06;
  transition: color .25s ease, border-color .25s ease, background .25s ease, box-shadow .25s ease;
}
.spotlight-toggle svg { width: 18px; height: 22px; flex: none; transition: filter .25s ease, color .25s ease; }
.spotlight-toggle:hover { border-color: #bcbcc5; color: #1d1d1f; }
.spotlight-toggle:focus-visible { outline: 2px solid var(--orange); outline-offset: 4px; }
body.spotlight-mode {
  --ink: #f0efeb; --muted: #aaaab3;
  color: #f0efeb; background-color: #101114;
  background-image: radial-gradient(ellipse 80% 65svh at 50% 260px, #ffedc413, transparent 80%);
  background-attachment: fixed;
}
.spotlight-mode .gallery-main { background: transparent; }
.spotlight-mode .back-link { color: #aaaab3; }
.spotlight-mode .back-link:hover { color: #f4c783; }
.spotlight-mode .photo-list img {
  background: #18191d; border-radius: 9px;
  box-shadow: 0 0 65px #ffedc412, 0 18px 45px #0006;
}
.spotlight-mode .photo-list figcaption { color: #aaaab3; }
.spotlight-mode .photo-list[data-view="list"],
.spotlight-mode .photo-list[data-view="list"] figure { border-color: #ffffff1c; }
.spotlight-mode .focus-stage {
  background: radial-gradient(ellipse at 50% 40%, #ffedc40f, transparent 70%);
}
.spotlight-mode .focus-photo { background: #17181b; border-color: #ffffff1b; box-shadow: 0 0 65px #ffedc40f, 0 18px 45px #0006; }
.spotlight-mode .focus-photo img { background: #17181b; }
.spotlight-mode .theme-switcher,
.spotlight-mode .focus-controls,
.spotlight-mode .view-options,
.spotlight-mode .spotlight-toggle { background: #25262ae8; border-color: #ffffff1f; color: #d2d2d8; box-shadow: inset 0 1px #ffffff08, 0 5px 18px #0003; }
.spotlight-mode .theme-switcher button,
.spotlight-mode .focus-controls button { background: #37383d; border-color: #ffffff1f; color: #efefef; box-shadow: inset 0 1px #ffffff12, 0 3px 12px #0003; }
.spotlight-mode .theme-switcher button:hover,
.spotlight-mode .focus-controls button:hover { color: #f4d79c; border-color: #f4d79c66; }
.spotlight-mode .view-option { color: #bcbcc3; }
.spotlight-mode .view-option[aria-pressed="true"] { color: #fff; }
.spotlight-mode .view-options::before { background: #48494f; border-color: #ffffff20; box-shadow: 0 2px 8px #0003; }
.spotlight-mode .spotlight-toggle[aria-pressed="true"] { color: #f1deaf; border-color: #edd8a344; }
.spotlight-toggle[aria-pressed="true"] svg { color: #ffe6a6; filter: drop-shadow(0 0 4px #ffd76eaa) drop-shadow(0 0 10px #ffd76e55); }
.spotlight-mode .gallery-footer { border-color: #ffffff1c; }
html.calm-motion { scroll-behavior: auto !important; }
html.calm-motion *, html.calm-motion *::before, html.calm-motion *::after {
  animation: none !important; transition: none !important; scroll-behavior: auto !important;
}
html.calm-motion .category-panel, html.calm-motion .category-links { transform: none !important; opacity: 1 !important; }
html.calm-motion::view-transition-group(*),
html.calm-motion::view-transition-old(*),
html.calm-motion::view-transition-new(*) { animation: none !important; }
@media (prefers-reduced-transparency: reduce) {
  .spotlight-mode .theme-switcher, .spotlight-mode .focus-controls,
  .spotlight-mode .view-options, .spotlight-mode .spotlight-toggle { background: #25262a; backdrop-filter: none; -webkit-backdrop-filter: none; }
}
