/* ANOPEDIA 1.7.4 · Green atmosphere refresh
   Light theme becomes pale green / deep green.
   Dark theme becomes deep green / pale green. */
:root {
  --paper: #edf5ee;
  --paper2: #dce9df;
  --card: #f8fcf8;
  --ink: #142b1d;
  --text: #304839;
  --muted: #596f5f;
  --line: #cadbcf;
  --line2: #b3c9b9;
  --accent: #386a4c;
  --gold: #83a18b;
  --gold-light: #dfeadf;
  --surface-top: #e6f0e8;
  --page-wash: radial-gradient(ellipse 105% 75% at 92% 35%, rgba(110,151,115,.08) 0%, transparent 62%), linear-gradient(155deg,#e2eee5 0%,#edf5ef 36%,#f6faf6 70%,#fbfdfb 100%);
  --page-bottom: #fbfdfb;
  --drawer-wash: linear-gradient(152deg,#e2eee5 0%,#eef6ef 46%,#f8fcf9 100%);
  --header-wash: linear-gradient(110deg,rgba(233,244,235,.97),rgba(248,252,249,.95));
  --footer-wash: linear-gradient(140deg,rgba(237,245,238,.82),rgba(251,253,251,.92));
  --header-line: linear-gradient(90deg, transparent 0%, rgba(142,181,149,0) 6%, rgba(142,181,149,.28) 18%, rgba(171,210,177,.52) 50%, rgba(142,181,149,.28) 82%, rgba(142,181,149,0) 94%, transparent 100%);
  --header-line-glow: rgba(167,208,174,.14);
}
html[data-theme="dark"] {
  color-scheme: dark;
  --paper: #0a1710;
  --paper2: #11251a;
  --card: #172c20;
  --ink: #eff8f0;
  --text: #dce9df;
  --muted: #abc1b0;
  --line: #355440;
  --line2: #64846c;
  --accent: #b8ddc1;
  --gold: #9fc0a4;
  --gold-light: #294032;
  --surface-top: #061009;
  --page-wash: radial-gradient(ellipse 105% 68% at 96% 41%,rgba(84,139,101,.23) 0%,transparent 64%), linear-gradient(150deg,#09150e 0%,#0c1b13 47%,#173023 100%);
  --page-bottom: #11251a;
  --drawer-wash: linear-gradient(152deg,#071009 0%,#0d1811 52%,#173123 100%);
  --header-wash: linear-gradient(110deg,rgba(8,20,12,.97),rgba(16,40,27,.95));
  --footer-wash: linear-gradient(145deg,rgba(8,18,11,.90),rgba(20,47,31,.95));
  --header-line: linear-gradient(90deg, transparent 0%, rgba(117,164,127,0) 6%, rgba(117,164,127,.26) 20%, rgba(178,222,184,.5) 50%, rgba(117,164,127,.26) 80%, rgba(117,164,127,0) 94%, transparent 100%);
  --header-line-glow: rgba(182,227,188,.12);
}
/* The light-to-white / black-to-green fade appears within the opening viewport,
   rather than being stretched across the entire article length. */
html { background-color: var(--page-bottom); }
body {
  min-height: 100vh;
  background-color: var(--page-bottom);
  background-image: var(--page-wash);
  background-size: 100% 980px;
  background-position: top center;
  background-repeat: no-repeat;
}
#main-content, .ed-home { background: transparent; }
.site-header {
  position: sticky;
  background: var(--header-wash);
  border-bottom-color: color-mix(in srgb,var(--line) 66%, transparent);
  box-shadow: 0 8px 24px -23px rgba(14,25,17,.32);
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
  isolation: isolate;
}
.site-header::after {
  content: "";
  position: absolute;
  left: clamp(14px, 4vw, 34px);
  right: clamp(14px, 4vw, 34px);
  bottom: -1px;
  height: 1px;
  background: var(--header-line);
  box-shadow: 0 0 4px color-mix(in srgb,var(--header-line-glow) 38%, transparent);
  pointer-events: none;
  opacity: .72;
}

html[data-theme="dark"] .site-header {box-shadow: 0 8px 30px -22px rgba(0,0,0,.75)}
/* Navigation: separate anchored background, never a flat opaque sheet. */
.mobile-nav.ed-drawer:not([hidden]) {
  background: var(--drawer-wash);
  isolation: isolate;
  overflow: hidden;
  border-right-color: var(--line);
}
.mobile-nav.ed-drawer::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 16% -45% auto auto;
  width: min(92%,460px);
  aspect-ratio: 1;
  background: url("assets/anopedia-mark-dark.png") center/contain no-repeat;
  opacity: .024;
  pointer-events: none;
}
html[data-theme="dark"] .mobile-nav.ed-drawer::before {
  background-image: url("assets/anopedia-mark-light.png");
  opacity: .048;
}
.mobile-nav.ed-drawer :where(.drawer-heading,.drawer-scroll,.drawer-foot) {position: relative; z-index: 1;}
.ed-drawer .drawer-heading { border-color:var(--line); background:transparent; }
.ed-drawer .drawer-foot {background:color-mix(in srgb,var(--paper) 16%,transparent);border-color:var(--line)}
.ed-drawer .drawer-item-link.is-active,
.ed-drawer .drawer-accordion[open]>summary {background:color-mix(in srgb,var(--accent) 9%,transparent)}
html[data-theme="dark"] .ed-drawer .drawer-item-link.is-active,
html[data-theme="dark"] .ed-drawer .drawer-accordion[open]>summary {background:color-mix(in srgb,var(--accent) 12%,transparent)}
/* Make the hero's real raccoon watermark a quiet silhouette without the old orbit art. */
.ed-home .ed-intro { background:transparent; }
.ed-home .ed-watermark-logo { opacity:.055; }
html[data-theme="dark"] .ed-home .ed-watermark-logo {opacity:.095;filter:invert(1)}
/* Material layers: warm paper in light, dark forest ink in night mode. */
.ed-home .ed-academy-section {
  background: linear-gradient(125deg,var(--paper2),color-mix(in srgb,var(--paper2) 88%,var(--gold-light)));
}
.ed-home .ed-lead-story { background:linear-gradient(148deg,var(--card),color-mix(in srgb,var(--paper2) 25%,var(--card))); }
.ed-footer { background:var(--footer-wash); }
/* The Aliopisto dark panel retains its own green field and pale insignia. */
.academy-hero .academy-hero-seal img { opacity:.98; }
/* Keep the transitions restrained and respect accessibility settings. */
body,.site-header,.mobile-nav.ed-drawer,.ed-footer {
  transition: background-color 260ms ease,color 260ms ease,border-color 260ms ease;
}
@media(prefers-reduced-motion:reduce) {
  body,.site-header,.mobile-nav.ed-drawer,.ed-footer {transition:none!important;}
}
@media(max-width:700px) {
  /* On narrow screens retain the mobile crop of the hero emblem. */
  .ed-home .ed-ornament.ed-watermark {pointer-events:none;}
  .mobile-nav.ed-drawer::before {width:min(105%,380px);inset:14% -42% auto auto;}
  body {background-size:100% 900px;}
}


/* ANOPEDIA 1.7.5 · unified green components */
.site-header .brand-text strong,
.drawer-brand span,
.ed-footer-logo,
.ed-eyebrow,.ed-label,
.ed-intro h1 em,
.reading-back,
.reading-masthead .reading-label,
.media-format,
.ed-text-link,.ed-section-top>a,
.ed-home .ed-lead-story .ed-arrow,
.ed-home .ed-article-row .ed-arrow,
.ed-home .ed-concept > span,
.media-category-link,
.media-piece-arrow,
.media-category-symbol,
.ed-home .ed-end-links a,
.journal-card .article-status,
.search-result-icon {
  color: var(--accent);
}

.site-header .icon-button,
.search-panel-header button,
.btn.outline {
  background: color-mix(in srgb,var(--paper2) 74%, transparent);
  border: 1px solid color-mix(in srgb,var(--line2) 82%, transparent);
  color: var(--ink);
}
.site-header .icon-button:hover,
.search-panel-header button:hover,
.btn.outline:hover {
  background: color-mix(in srgb,var(--paper2) 78%, var(--accent) 7%);
  border-color: color-mix(in srgb,var(--accent) 24%, var(--line2));
  color: var(--ink);
}
#theme-button,
#search-button,
#menu-button {
  border-radius: 10px;
}

.btn {
  background: color-mix(in srgb,var(--ink) 94%, var(--accent) 6%);
  border-color: color-mix(in srgb,var(--ink) 82%, var(--accent) 18%);
  color: var(--paper);
  box-shadow: 0 14px 28px -22px rgba(19,39,26,.34);
}
.btn:hover {
  background: color-mix(in srgb,var(--accent) 86%, var(--ink));
  border-color: color-mix(in srgb,var(--accent) 72%, var(--ink));
  color: var(--paper);
}

:where(.dictionary-item,.journal-card,.media-category,.media-piece,.concept-card,.ed-home .ed-lead-story,.ed-home .ed-concept,.lv-hub-card,.lv-index-card,.lv-essay,.lv-law-card,.lv-editor-work,.source-excerpt,.public-editorial-note,.search-panel,.academy-card,.academy-faculty-card,.academy-course-card,.unit-card,.study-card,.rectory,.pk-pane,.pk-help,.pk-stat,.pk-card,.pk-sidecard) {
  background: linear-gradient(180deg, color-mix(in srgb,var(--card) 92%, var(--paper2)) 0%, color-mix(in srgb,var(--card) 98%, var(--paper)) 100%);
  border-color: color-mix(in srgb,var(--line) 86%, var(--accent) 14%);
  box-shadow: 0 18px 38px -30px rgba(18,35,24,.22);
}

:where(.dictionary-item,.journal-card,.media-category,.media-piece,.concept-card,.ed-home .ed-concept,.academy-card,.academy-faculty-card,.academy-course-card):hover {
  border-color: color-mix(in srgb,var(--accent) 28%, var(--line));
}

.search-dim {
  background: rgba(7,17,11,.42);
  backdrop-filter: blur(7px);
}
.search-panel {
  border-radius: 16px;
  overflow: hidden;
}
.search-panel-header {
  background: color-mix(in srgb,var(--paper2) 62%, transparent);
  border-bottom-color: color-mix(in srgb,var(--line) 88%, transparent);
}
.search-panel-header input {
  color: var(--ink);
}
.search-results {
  background: color-mix(in srgb,var(--card) 96%, var(--paper));
}
.search-result {
  border-bottom-color: color-mix(in srgb,var(--line) 86%, transparent);
}
.search-result:hover {
  background: color-mix(in srgb,var(--accent) 7%, var(--paper2));
}
.search-panel-foot {
  background: color-mix(in srgb,var(--paper2) 82%, var(--card));
  border-top: 1px solid color-mix(in srgb,var(--line) 86%, transparent);
}

html[data-theme="dark"] .search-dim {
  background: rgba(2,8,4,.56);
}
html[data-theme="dark"] :where(.dictionary-item,.journal-card,.media-category,.media-piece,.concept-card,.ed-home .ed-lead-story,.ed-home .ed-concept,.lv-hub-card,.lv-index-card,.lv-essay,.lv-law-card,.lv-editor-work,.source-excerpt,.public-editorial-note,.search-panel,.academy-card,.academy-faculty-card,.academy-course-card,.unit-card,.study-card,.rectory,.pk-pane,.pk-help,.pk-stat,.pk-card,.pk-sidecard) {
  background: linear-gradient(180deg, color-mix(in srgb,var(--card) 96%, var(--paper2)) 0%, color-mix(in srgb,var(--card) 100%, var(--paper)) 100%);
  box-shadow: 0 18px 42px -30px rgba(0,0,0,.44);
}
html[data-theme="dark"] .site-header .icon-button,
html[data-theme="dark"] .search-panel-header button,
html[data-theme="dark"] .btn.outline {
  background: color-mix(in srgb,var(--paper2) 72%, transparent);
  border-color: color-mix(in srgb,var(--line2) 82%, transparent);
}
html[data-theme="dark"] .site-header .icon-button:hover,
html[data-theme="dark"] .search-panel-header button:hover,
html[data-theme="dark"] .btn.outline:hover {
  background: color-mix(in srgb,var(--paper2) 70%, var(--accent) 10%);
  border-color: color-mix(in srgb,var(--accent) 25%, var(--line2));
}