/* Progressive enhancements: content remains readable without JavaScript. */
:root {
  --accent: #3266c7;
  --accent-soft: #edf2ff;
  --canvas: #f5f7fc;
  --card: #f8faff;
  --glow: rgba(69, 117, 255, .13);
}
html[data-theme="dark"] {
  color-scheme: dark;
  --ink: #e7edf9;
  --muted-ink: #adbcd2;
  --accent: #92bbff;
  --accent-soft: #202f49;
  --paper: #131d2e;
  --canvas: #0b1220;
  --card: #182438;
  --line: #304159;
  --glow: rgba(67, 128, 249, .18);
  --shadow: 0 16px 40px rgba(0, 0, 0, .2);
}
body {
  background: radial-gradient(ellipse at 5% 5%, var(--glow), transparent 45%),
    radial-gradient(ellipse at 95% 55%, var(--glow), transparent 40%), var(--canvas);
  background-attachment: fixed;
}
.masthead, .greedy-nav, .greedy-nav .hidden-links {
  background: var(--paper);
  color: var(--ink);
}
.greedy-nav a, .greedy-nav .hidden-links a { color: var(--muted-ink); }
.greedy-nav a[aria-current="location"] { color: var(--accent); }
.greedy-nav a[aria-current="location"]::before { width: 100%; background: var(--accent); }
.page__content, .page__content .paper-box .paper-box-text { color: var(--ink); }
.page__content .paper-box { background: var(--card); }
.sidebar { border-top: 3px solid var(--accent); }
.sidebar .author__avatar img { display: block; margin-inline: auto; }
.page__content h1 { scroll-margin-top: 100px; }
.page__content .paper-box {
  position: relative;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.page__content .paper-box:hover, .page__content .paper-box:focus-within {
  border-color: var(--accent);
  box-shadow: 0 15px 35px var(--glow);
}
.page__content .paper-box-text > p:first-child { font-weight: 650; font-size: 1.06em; }
.reading-progress {
  position: fixed; inset: 0 0 auto; height: 3px; z-index: 100;
  background: linear-gradient(90deg, #3977e8, #47d6c5, #9479e9);
  transform: scaleX(0); transform-origin: left; pointer-events: none;
}
.page-tools {
  position: fixed; right: 18px; bottom: 20px; z-index: 30;
  display: flex; flex-direction: column; gap: 10px;
}
.page-tools button, .figure-preview {
  cursor: pointer; color: var(--ink); background: var(--paper);
  border: 1px solid var(--line); border-radius: 14px;
}
.page-tools button {
  width: 46px; height: 46px; font-size: 21px; box-shadow: var(--shadow);
}
.page-tools button:hover { color: var(--accent); border-color: var(--accent); }
.page-tools button:focus-visible, .figure-preview:focus-visible, .figure-dialog button:focus-visible {
  outline: 3px solid var(--accent); outline-offset: 4px;
}
.figure-preview { display: block; padding: 0; width: 100%; overflow: hidden; }
.figure-preview img { display: block; width: 100%; transition: transform .3s ease; }
.figure-preview:hover img { transform: scale(1.04); }
.figure-dialog {
  width: min(1000px, 92vw); max-height: 90vh; padding: 20px;
  border: 1px solid var(--line); border-radius: 18px;
  background: var(--paper); color: var(--ink); box-shadow: var(--shadow);
}
.figure-dialog::backdrop { background: rgba(4, 10, 23, .8); backdrop-filter: blur(8px); }
.figure-dialog img { display: block; max-width: 100%; max-height: 70vh; margin: auto; object-fit: contain; }
.figure-dialog button { display: block; margin: 0 0 16px auto; padding: 8px 16px; cursor: pointer; }
.figure-dialog p { font-size: .9rem; margin-top: 16px; }
@media (min-width: 925px) {
  .sidebar .author__avatar { width: 100%; }
}
@media (max-width: 600px) {
  .page-tools { right: 8px; bottom: 12px; }
  .page-tools button { width: 40px; height: 40px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .page__content .paper-box:hover, .figure-preview:hover img { transform: none; }
}
@media print {
  .page-tools, .reading-progress, .figure-dialog { display: none !important; }
  html[data-theme], body { --ink: #17263d; --paper: #fff; --card: #fff; --muted-ink: #40506a; --accent: #285a99; background: white; color: #17263d; }
}