/* Deep olive for finding a path; luminous limestone for following a story. */
:root {
  --paper: #f2f0e7;
  --surface: #fffdf6;
  --ink: #293b31;
  --olive: #314b3e;
  --muted: #656b5d;
  --clay: #875c40;
  --bronze: #a59066;
  --line: #d1cbbb;
  --night: #253c32;
  --nav-ink: #f2ecd9;
}
body {background: #e9e8df; color: var(--ink)}
.site-body {background: var(--paper); box-shadow: 0 0 80px #263c3210}
.archive-header {background: var(--night); color: var(--nav-ink); border-top: 3px solid #a99368; border-bottom: 1px solid #a99368}
.masthead {min-height: 111px; padding-block: 20px}
.brand {color: #f7efdc; font-size: 1.45rem; letter-spacing: 2.5px}
.brand small {color: #c5c8b2; font-weight: 400; letter-spacing: 2px}
.brand-emblem {width: 66px; height: 66px; filter: saturate(.72)}
.main-nav {gap: 28px}
.main-nav a {color: #d8dece; border-bottom-color: transparent; transition: color .18s, border-color .18s}
.main-nav a:hover, .main-nav a.active {color: #fff2cd; border-bottom-color: #c9ad74}
.main-nav a.active {font-weight: 600}
.header-about {color: #c8cfbd; text-decoration-color: #84917a}
.header-about::before {opacity: .85; filter: brightness(1.35); width: 96px; height: 24px; background-size: 48px 24px}
.collection-bar {border-top-color: #62725b70; padding-block: 9px}
.nav-label {color: #c6af7f; font-weight: 400}
.tradition-nav a {color: #d7dccb; font-size: .9375rem}
.tradition-nav a span {color: #aebaa0}
.tradition-nav a:hover, .tradition-nav a.active {color: #ffe8b7; border-color: #beaa7c}
.archive-header a:focus-visible {outline-color: #e4c78d}
.topbar {min-height: 76px; padding-top: 17px}
.breadcrumb {font-size: .9375rem; color: #626b59}
.search-form {border: 1px solid #c7cbb9; padding: 7px 14px; background: #faf9f1}
.search-form:focus-within {border-color: #7c8e73; box-shadow: 0 0 0 3px #62785b15}
.search-form input::placeholder {color: #657059; opacity: 1}
main {padding-top: 38px}
.eyebrow {letter-spacing: 1.9px}
.text-link {text-decoration-color: #adb18f; text-underline-offset: 7px}
.text-link:hover {text-decoration-color: var(--clay)}
.gold-button, .painted-button {background: var(--olive); border-color: var(--olive); box-shadow: inset 0 0 0 4px var(--olive), inset 0 0 0 5px #94a281; padding: 15px 27px; letter-spacing: .01em; transition: background .18s, box-shadow .18s}
.gold-button:hover, .painted-button:hover {background: #223b2e; box-shadow: inset 0 0 0 4px #223b2e, inset 0 0 0 5px #b1bc94}
.secondary-button {background: transparent; color: var(--olive); border-color: #aaa788; box-shadow: inset 0 0 0 4px var(--paper), inset 0 0 0 5px #d1c8af}
.secondary-button:hover {background: #e7e8d9; color: var(--olive); box-shadow: inset 0 0 0 4px #e7e8d9, inset 0 0 0 5px #aaa788}
.intro-copy h1 {line-height: 1.16; letter-spacing: -1.8px}
.intro-copy>p {color: #606a58; line-height: 1.85}
.archive-statistics {border-top-color: #c9ceba}
.archive-statistics dt {color: var(--olive)}
.archive-statistics dd {color: #6b715f}
.grove-frame, .nature-picture {background: #e5e0cd; border-color: #aaa185; outline-color: #d0c6aa; box-shadow: 0 16px 38px #263c3212}
.grove-frame::before, .nature-picture::before {border-color: #c0b28e}
.grove-figure figcaption {color: #646c57; font-size: .75rem}
.collection-olive {opacity: .72}
.heading-olive {opacity: .68}
.section-heading h2 {font-size: 2.1rem; line-height: 1.3}
.tradition-card {background: #faf9f1; border-color: #d4d1bf; box-shadow: none; padding-block: 27px}
.tradition-card .roman {color: #8b926e; font-size: 1.7rem}
.tradition-card .count {color: #626b56}
.tradition-card h3 {color: #314a3b}
.tradition-card:hover {background: #fffdf5; border-color: #a49c79; box-shadow: 0 7px 22px #253c3208}
.tradition-card::after {width: 23px; height: 23px; border-color: #c5b68d; border-width: 1px}
.archive-divider {width: 128px; height: 24px; background-size: 48px 24px; margin: 60px auto; opacity: .72}
.path-card {background: #e7e9dc; border-color: #cbd0bb; border-top: 1px solid #b5bb9d}
.path-card:hover {background: #eef0e5; border-color: #9ba98b}
.path-number, .index-initial {color: #778567}
.path-card::after, .source-card::before, .source-card::after, .connection-card::after, .browse-entry::after {display: none}
.benedek-feature {background: var(--night); outline-color: #b3a27b; border: 1px solid #51684f; box-shadow: 0 16px 42px #233a3010}
.benedek-feature .eyebrow {color: #d5bd87}
.benedek-feature p {color: #e1e4d5}
.collection-bookmark {background: #2c4437; border-color: #96a078}
.benedek-feature .gold-button {color: #253c32; background: #e9e1c7; border-color: #b8ad8c; box-shadow: inset 0 0 0 4px #e9e1c7, inset 0 0 0 5px #b6a77b}
.benedek-feature .gold-button:hover {background: #faf0d2; box-shadow: inset 0 0 0 4px #faf0d2, inset 0 0 0 5px #b6a77b}
.benedek-feature a:focus-visible {outline-color: #e4c78d}
.entry-card, .browse-entry, .source-card, .trail-step {background: var(--surface); border-color: #d5d3c4; box-shadow: 0 5px 20px #233a3005}
.entry-card:hover, .browse-entry:has(.entry-card:hover), .source-card:hover, .trail-step:hover {background: #fffef9; border-color: #a7b094}
.browse-entry {border-top: 2px solid #bcc5a5}
.entry-card h3 {font-size: 1.85rem; line-height: 1.35}
.entry-card p {color: #5d6656; line-height: 1.85}
.entry-top {align-items: start}
.entry-type {color: #656d58}
.name-gloss {color: #73705b}
.entry-bottom {border-color: #e0ddcf; color: #677b54}
.browse-entry-foot {padding-top: 2px}
.connection-link {color: #526742; border-color: #d7dccb}
.connection-link:hover {color: #805e3f}
.theme-links a {color: #5b704b; border-color: #bdc5aa}
.page-heading h1 {font-size: 3rem; line-height: 1.23; margin-bottom: 16px}
.page-heading p {color: #66705f; max-width: 740px}
body:not([data-page=encyclopedia]):not([data-page=figures]) .page-heading::after {width: 96px; height: 24px; background-size: 48px 24px; opacity: .65}
body:is([data-page=encyclopedia],[data-page=figures]) main {padding-top: 26px}
body:is([data-page=encyclopedia],[data-page=figures]) .page-heading {margin-bottom: 22px; padding-bottom: 26px}
.browse-desk {background: var(--night); color: #f2eddd; border: 1px solid #455b44; border-top: 2px solid #b4a477; padding: 25px 28px 14px; box-shadow: 0 10px 25px #253c3210}
.browse-search label, .browse-field {color: #eef0df; font-weight: 500; font-size: .9375rem}
.browse-search>div {background: #faf8ee; border-color: #b4bb9e; color: #314b3e}
.browse-search input {color: #293b31}
.browse-search input::placeholder {color: #657059; opacity: 1}
.browse-search small {color: #bac6ad; line-height: 1.6}
.browse-field select {background: #eff0e4; color: #2c4233; border-color: #b6c0a7}
.theme-directory {border-color: #7d8a6866}
.theme-directory summary {color: #e7d4a0}
.theme-directory summary span {color: #bec7b0}
.theme-directory-grid button {background: #344e3e; color: #edf1e0; border-color: #738267}
.theme-directory-grid button:hover {background: #405b48}
.theme-directory-grid button[aria-pressed=true] {background: #e8e0c7; border-color: #d2c08c; color: #293f30}
.browse-desk :focus-visible {outline-color: #e1c689}
.browse-desk input:focus-visible {outline-color: #667f51}
.alphabet {border-color: #cfd3c0; padding-block: 14px}
.alphabet button {color: #526b42}
.alphabet button[aria-pressed=true] {background: var(--olive); color: #fff8e3; border-color: #74885f}
.view-switch button {border-color: #c5cdb5; background: #faf9ef}
.view-switch button[aria-pressed=true] {background: var(--olive); border-color: var(--olive)}
.active-filters button {background: #e5e9d8; border-color: #b5c09e; color: #3e5633}
.index-row {background: #fcfbf4; border-color: #dadbce}
.index-row:nth-child(even) {background: #f4f5eb}
.index-row:hover {background: #fffdf5}
.index-row>.connection-link {background: transparent}
.collection-note {background: #e5e9d9; border-color: #c0c9ac; border-left-color: #738864}
.source-banner {border-top: 1px solid #b9bea5; padding-top: 40px}
.prose {max-width: 920px; padding: 18px 60px 38px; background: var(--surface); border: 1px solid #d9d5c5; box-shadow: 0 12px 35px #263c3208}
.prose p {color: #43513f; line-height: 1.95}
footer {margin-top: 0; padding-top: 62px; border-color: #cbd0b9; color: #626b56}
footer::before {left: 50%; right: auto; top: 16px; width: 96px; height: 20px; transform: translateX(-50%); background-size: 40px 20px; opacity: .7}

/* The controls form a dark rail; the entry itself is an uninterrupted page. */
dialog {width: min(960px, calc(100% - 56px)); max-height: 94dvh; padding: 0; background: #fffdf5; background-image: none; border: 1px solid #819077; border-radius: 3px; box-shadow: 0 32px 120px #08170fcc; scrollbar-color: #a7b096 #f4f2e8; scroll-padding-top: 80px}
dialog::backdrop {background: #10261ce8; backdrop-filter: blur(10px) saturate(.6)}
.reader-toolbar {position: sticky; top: 0; z-index: 10; min-height: 67px; display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 11px 24px; background: #253c32; color: #f4eedc; border-bottom: 1px solid #baa677}
#reader-history {flex: 1; min-width: 0}
.reader-nav {position: static; margin: 0; padding: 0; border: 0; gap: 9px; flex-wrap: wrap}
.reader-nav::after {display: none}
.reader-nav button {color: #e7eddd; border-color: #718365; background: transparent; min-height: 42px; padding: 8px 15px; border-radius: 1px}
.reader-nav button:disabled {opacity: .38}
.reader-nav button:hover:not(:disabled) {background: #3c5642; border-color: #bdc6a7}
.reader-nav>span {color: #c5cfb7; font-size: .8125rem; margin: 0 0 0 14px; width: auto}
.close-dialog {position: static; float: none; flex-shrink: 0; top: auto; margin: 0; width: auto; height: auto; min-height: 42px; padding: 7px 11px 7px 15px; display: flex; gap: 14px; border: 1px solid #718365; background: transparent; color: #f7efdc; font-size: .9375rem; line-height: 1.4}
.close-dialog>span:last-child {font-size: 1.5rem; line-height: 1}
.close-dialog:hover {background: #3c5642; border-color: #c5caa9}
.reader-toolbar :focus-visible {outline-color: #e2c487; outline-offset: 3px}
#entry-content {padding: 43px 72px 60px; border: 0; background: #fffdf5}
#entry-content::after {width: 96px; height: 20px; background-size: 40px 20px; opacity: .7; margin: 45px auto 0}
.reading-heading, .reading-text, .reader-views {max-width: 680px; margin-inline: auto}
.reading-heading {text-align: center}
.reading-heading>.eyebrow {font-size: .75rem; color: #716b4f; letter-spacing: 2px}
.article-title {font-size: 3.15rem; color: #293e30; margin: 17px 0 13px; line-height: 1.24; letter-spacing: -.65px; overflow-wrap: break-word}
.article-title .name-gloss {display: block; font-size: 1.0625rem; line-height: 1.6; color: #77735f; margin-top: 10px; letter-spacing: 0}
.article-subtitle {font-size: 1.25rem; color: #836749; line-height: 1.6}
.article-facts {justify-content: center; border: 0; margin: 17px 0 0; padding: 0; gap: 6px 22px; color: #686f59; font-size: .8125rem}
.article-facts>span+span {position: relative}
.article-facts>span+span::before {content: '·'; position: absolute; left: -13px; color: #a89d7e}
.reader-views {justify-content: center; gap: 24px; border-bottom: 1px solid #d8d4c0; margin-block: 24px 32px}
.reader-views button {min-width: 0; padding: 10px 4px 13px; min-height: 46px; font-size: .9375rem; background: transparent; border: 0; border-bottom: 2px solid transparent; color: #666f58}
.reader-views button+button {border: 0; border-bottom: 2px solid transparent}
.reader-views button[aria-pressed=true] {background: transparent; color: #314f36; border-bottom-color: #9f8957; font-weight: 600}
.reader-views button:hover {color: #293e30; border-bottom-color: #b6b89a}
.article-intro {font: 1.375rem/1.8 Georgia, serif; color: #354b34; margin: 0 0 26px}
.ancient-initial {font-size: 4.9rem; line-height: 1; padding: 4px 14px 0 0; color: #8d8057}
.article-body {font: 1.1875rem/1.95 Georgia, serif; color: #404d3c; margin-bottom: 25px}
.inline-gloss {color: #77714f}
.inline-entry {color: #3f6440; border-color: #b5c1a1; text-decoration: none}
.inline-entry:hover {color: #795d3d; border-color: #a89360}
.reading-notes {margin-top: 42px; padding-top: 5px; border-top: 1px solid #cccdb8}
.reading-notes .article-section {font-size: 1.6rem; color: #5c6c48; margin-top: 28px}
.source-note {border-left: 2px solid #b6b996; color: #687157; padding-left: 22px; font-size: 1rem; line-height: 1.85}
.article-source {background: #f2f3e7; border: 1px solid #d1d8c0; border-left: 2px solid #9eaf86; padding: 17px 21px; color: #3f5536; font-size: 1rem}
.article-source small {color: #656e54}
.article-source:hover {background: #e8eddb; border-color: #a7b790}
.related button {background: #f5f5ea; border-color: #cdd6bb; color: #4a6040; min-height: 44px}
.related button:hover {background: #e9eedb}
.connection-card {background: #f2f4e8; border-color: #ced7bb}
.connection-card:hover {background: #e8efdb; border-color: #a6b58f}
.connection-card h4 {font-size: 1.7rem}
.connection-card .eyebrow {color: #586b41}
.entry-trails a {border-color: #d3d9c3; color: #4c643e}
.entry-trails a>span {color: #8b946c}
.trail-reader {background: #eef1e3; border-color: #c9d3b7}
.trail-reader button, .trail-reader>div>a {background: #fbfcf3; border-color: #b9c8a6; color: #48613d}
.article-painting {background: #f1ebdc; border-color: #cec3a9; padding: 8px; margin-top: 38px}
.article-painting figcaption {color: #6b715f}

@media (max-width: 1150px) {
  .main-nav {gap: 22px}
  .masthead {padding-inline: 32px}
  .prose {padding-inline: 42px}
}
@media (max-width: 860px) {
  .masthead {padding: 18px 24px 0; min-height: 0}
  .main-nav {gap: 28px}
  .brand-emblem {width: 62px; height: 62px}
  .browse-desk {padding: 24px 25px 13px}
  .page-heading h1 {font-size: 2.65rem}
  .prose {padding: 12px 32px 28px}
  dialog {width: calc(100% - 32px)}
  #entry-content {padding: 36px 44px 45px}
  .reader-nav>span {margin-left: 8px}
  .article-title {font-size: 2.8rem}
}
@media (max-width: 600px) {
  .masthead {padding: 20px 18px 0}
  .brand {font-size: 1.35rem; gap: 12px}
  .brand small {font-size: .75rem; letter-spacing: 1.5px}
  .brand-emblem {width: 64px; height: 64px}
  .main-nav {gap: 0}
  .main-nav a {font-size: .875rem; padding-inline: 4px}
  .main-nav a.active {font-weight: 500}
  .collection-bar {padding: 8px 18px 10px}
  .tradition-nav a {font-size: .875rem; min-height: 36px}
  .topbar {padding: 19px 22px 0; min-height: 68px}
  .search-form {padding: 7px 12px}
  main {padding-top: 30px}
  .intro-copy h1 {font-size: clamp(2.35rem,10.5vw,2.7rem); line-height: 1.17}
  .intro-copy>p {font-size: 1.125rem; line-height: 1.8}
  .section-heading h2 {font-size: 1.9rem}
  .tradition-card {padding: 22px 17px}
  .archive-divider {margin-block: 45px; width: 96px}
  .page-heading h1 {font-size: 2.4rem}
  body:is([data-page=encyclopedia],[data-page=figures]) .page-heading {padding-bottom: 24px}
  .browse-desk {padding: 21px 19px 13px}
  .browse-search>div {padding-left: 12px}
  .browse-facets {gap: 16px}
  .theme-directory summary span {margin-left: 17px}
  .entry-card h3 {font-size: 1.85rem}
  .prose {padding: 3px 22px 22px; margin-inline: -7px}
  .prose p {font-size: 1.0625rem; line-height: 1.95}
  footer {padding-top: 60px}
  dialog {width: calc(100% - 16px); max-width: calc(100% - 16px); max-height: 96dvh; border-color: #728366; border-radius: 2px; scroll-padding-top: 100px}
  .reader-toolbar {padding: 9px 12px; gap: 10px; align-items: start; min-height: 64px}
  .reader-nav {gap: 7px; margin: 0; padding: 0}
  .reader-nav button {font-size: .8125rem; padding: 8px 12px; min-height: 40px}
  .reader-nav>span {width: 100%; margin: 0; font-size: .75rem; line-height: 1.5}
  .close-dialog {min-height: 40px; padding: 7px 9px; gap: 8px; font-size: .875rem}
  #entry-content {padding: 29px 24px 38px}
  .reading-heading>.eyebrow {font-size: .75rem; letter-spacing: 1.6px}
  .article-title {font-size: 2.3rem; line-height: 1.28; margin-top: 14px; letter-spacing: -.4px}
  .article-title .name-gloss {font-size: .9375rem; margin-top: 10px}
  .article-subtitle {font-size: 1.125rem; line-height: 1.6}
  .article-facts {font-size: .75rem; gap: 7px 20px; line-height: 1.7; margin-top: 13px}
  .article-facts>span+span::before {display: none}
  .reader-views {gap: 25px; margin-top: 19px; margin-bottom: 26px}
  .reader-views button {flex: none; font-size: .9375rem; padding: 9px 2px 12px}
  .article-intro {font-size: 1.25rem; line-height: 1.8; margin-bottom: 25px}
  .ancient-initial {font-size: 4.5rem; padding-right: 11px}
  .article-body {font-size: 1.125rem; line-height: 1.9; margin-bottom: 24px}
  .reading-notes {margin-top: 32px}
  .reading-notes .article-section {font-size: 1.6rem}
  .source-note {padding-left: 17px}
  .article-source {padding: 16px 17px; font-size: 1rem}
  .article-painting {padding: 6px}
  .reader-browse {font-size: .9375rem; padding: 14px 20px}
}
@media (prefers-reduced-motion: reduce) {
  .main-nav a, .gold-button, .painted-button {transition: none}
}

/* The figure directory shares the archive's existing reading and browsing language. */
.figure-introduction {display:flex; align-items:center; justify-content:space-between; gap:30px; margin:-10px 0 30px; color:var(--muted)}
.figure-introduction p {max-width:720px; font-size:1rem; line-height:1.7}
.figure-introduction a {flex-shrink:0; font-size:.9375rem}
.figure-shelf {margin-block:60px}
.figure-doorways {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.figure-doorways>a {padding:27px 23px;background:var(--surface);border:1px solid var(--line);border-top:2px solid #b5bb9d;text-decoration:none}
.figure-doorways h3 {font-size:1.55rem;line-height:1.35;margin:14px 0 12px}
.figure-doorways p {font-size:1rem;line-height:1.7;color:var(--muted);margin:0}
.figure-doorways>a:hover {background:#fffef9;border-color:#9ba98b}
@media(min-width:861px) {.main-nav {gap:22px}.header-about {display:none}.collection-bar {align-items:flex-start}.tradition-nav {justify-content:flex-start;gap:12px 24px}.nav-label {padding-top:9px}}
@media(max-width:1000px) {.figure-doorways {grid-template-columns:repeat(2,minmax(0,1fr))}.figure-introduction {display:block}.figure-introduction a {display:inline-block;margin-bottom:5px}}
@media(max-width:600px) {.main-nav {display:flex;justify-content:center;gap:0 22px}.main-nav a,.main-nav a:nth-child(3) {max-width:none;min-height:46px;padding:10px 0}.figure-doorways {grid-template-columns:1fr}.figure-shelf {margin-block:45px}.figure-doorways>a {padding:23px}.figure-doorways h3 {font-size:1.65rem}.figure-introduction {margin-top:0}}