/* Један визуелни језик за сцене и истраживачке странице. */
:root {
  --paper: #dbe9d4;
  --light: #f2f7e9;
  --ink: #173a34;
  --muted: #4d6a60;
  --line: #acc5ae;
  --red: #a54a29;
  --green: #32705b;
  --serif: 'Manrope', Arial, sans-serif;
}

body {
  background: #102a2c;
  color: var(--ink);
  font-size: 14px;
}

/* Архивске странице остају читљиве као светла радна табла у истој сцени. */
html:not(.scene-mode) #main.wrap {
  background: var(--paper);
  border: 1px solid #789786;
  border-radius: 10px;
  box-shadow: 0 14px 40px #061b1a66;
  margin-top: 20px;
  padding-top: 1px;
  padding-bottom: 36px;
}

#app > header.wrap, #app > footer.wrap {
  color: #eaf5e5;
  --muted: #b4cbb9;
  --line: #52736a;
  --ink: #eaf5e5;
  --red: #f6bf6e;
}
#app > header.wrap {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  gap: 24px;
  min-height: 72px;
}
#app > header.wrap .masthead { display: block; min-height: 0; flex: none; }
#app > header.wrap .masthead-note { display: none; }
#app > header.wrap .brand, .footer-brand {
  color: #fff;
  font-family: 'Source Serif 4', Georgia, serif;
}
#app > header.wrap .brand { display: block; font-size: 35px; letter-spacing: -2.5px; padding: 0; }
#app > header.wrap .brand span, .footer-brand span { color: #bd322d; letter-spacing: inherit; }
.topbar { border: 0; flex: 1; justify-content: flex-end; }
.topbar > span { display: none; }
.nav-shell {
  background: #173a37;
  border-color: #628777;
  color: #eaf5e5;
  box-shadow: 0 6px 20px #071b1b55;
}
.nav-link, .nav-more-link, .search-trigger { color: #eaf5e5; }
.nav-link, .nav-more-link { font-size: 11px; letter-spacing: .03em; }
.nav-link.active, .nav-more[open] summary, .nav-more-link.active { color: #ffd38b; }
.nav-link.active:after { background: #ffd38b; }
.nav-more-menu { background: #173a37; border-color: #789786; }
.nav-more-link:hover { background: #28574b; color: #fff; }
.nav-actions .add-button { color: #ffdc9d; }
.nav-actions .kbd { border-color: #789786; }

.page-header { border-bottom: 2px solid #759681; }
.page-header h1, .section-heading h2, .prose h2 { letter-spacing: -.035em; }
.page-header .eyebrow, .eyebrow, .section-no { color: #8a3f24; }
.button, .scene-home-title button, .scene-evidence button {
  border-radius: 6px;
  font-weight: 800;
}
.button { background: #235f4d; color: #fff; border-color: #235f4d; }
.button:hover { background: #174c3e; color: #fff; }
.button.secondary { background: #edf5e6; border-color: #729781; color: #173a34; }
.button.secondary:hover { background: #c8dfc2; }
.button:focus-visible, a:focus-visible, button:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid #e59c39;
  outline-offset: 3px;
}
input, select, textarea { accent-color: #276a53; }
html:not(.scene-mode) #main input,
html:not(.scene-mode) #main select,
html:not(.scene-mode) #main textarea {
  background-color: #f6faef;
  color: #173a34;
  border-color: #86a990;
}
.filter.active, .contribute-kind.active { background: #bcd9bc; color: #173a34; }
.person-card, .entity-card, .source-card, .case-row, .frontier-card {
  border-color: #a4bea7;
}
.entity-card, .frontier-card { background: #eef6e8; border-radius: 8px; }
.entity-card:hover, .person-card:hover, .case-row:hover { border-color: #388363; }
.doprinesi-card, .audit-record, .comparison-card, .entity-card {
  border-radius: 8px;
  box-shadow: 0 3px 0 #a9c5a8;
}
.field-search, .hero-search { border-radius: 7px; }
.filter, .contribute-kind, .findings-filters select { border-radius: 5px; }
.filter, .contribute-kind { min-height: 38px; }
.text-link { color: #1b604a; border-color: #428363; }
.text-link:hover { color: #8a3f24; }
.local-note, .principle-strip, .audit-scope, .comparison-source-note {
  background: #c7dec5;
  color: #24493e;
  border-radius: 6px;
}
.site-footer { border-color: #52736a; }
.footer-top p, .footer-bottom { color: #b4cbb9; }
.footer-links { flex-wrap: wrap; }

/* Исти нагласци, повратна информација и фокус у интерактивним сценама. */
.scene { border-radius: 10px; border-color: #628777; box-shadow: 0 14px 40px #061b1a66; }
.scene-archive { background: var(--paper); color: var(--ink); padding: .4rem 1rem 1rem; border-radius: 8px; }
.scene-hud { background: #173a37; }
.scene-hud > a { color: #fff; }
.scene-hud > a.scene-brand { white-space: nowrap; }
.scene-entry, .scene-relation, .scene-case-link, .scene-measure, .scene-event {
  transition: border-color .15s, background-color .15s, transform .15s;
}
.scene-entry:hover, .scene-case-link:hover, .scene-measure:hover, .scene-event:hover {
  border-color: #ffd38b;
}
.scene-relation.selected, .scene-event.selected, .scene-measure.selected {
  border-color: #ffd38b;
  box-shadow: 0 0 0 2px #ffd38b;
}
.scene-filters button[aria-pressed=true] { background: #bfe9bd; color: #173a34; }
.scene-drawer { background: #dbe9d4; color: #173a34; }
.scene-drawer h2, .scene-drawer h3 { color: #173a34; }
.scene-sources a { background: #f2f7e9; border-color: #a4bea7; }
.scene-stage, .scene-home-stage, .scene-intro, .scene-nav, .scene-filters { min-width: 0; }
.scene-intro h1, .scene-intro p, .scene-object strong { overflow-wrap: anywhere; }

@media (max-width: 850px) {
  html:not(.scene-mode) #main.wrap { margin-top: 12px; border-radius: 7px; }
  #app > header.wrap .topbar-right { gap: 12px; }
}
@media (max-width: 800px) {
  .scene-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 570px) {
  html:not(.scene-mode) #main.wrap { margin-top: 8px; border-left: 0; border-right: 0; border-radius: 0; }
  #app > header.wrap { min-height: 62px; gap: 12px; }
  #app > header.wrap .brand { font-size: 30px; }
  #app > header.wrap .topbar-right { gap: 10px; }
  #app > header.wrap .local-indicator { display: none; }
  .footer-top { align-items: flex-start; flex-direction: column; }
  .footer-links { gap: 10px 16px; line-height: 1.5; }
  .scene { border-radius: 6px; }
  .scene-hud > a.scene-brand { flex: 1 0 auto; }
  .scene-focus > div { min-width: 0; }
  .scene-report { max-width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .scene-entry, .scene-relation, .scene-case-link, .scene-measure, .scene-event { transition: none; }
}