:root {
  --paper: #f7f3ea;
  --paper-deep: #ece5d7;
  --paper-soft: #fbf9f4;
  --ink: #162323;
  --ink-soft: #4d5b58;
  --green: #1c4d46;
  --green-dark: #123631;
  --gold: #ad8c45;
  --red: #ad4a3f;
  --blue: #426e9f;
  --violet: #66558d;
  --line: #cfc6b7;
  --line-dark: #9e9689;
  --shadow: 0 15px 45px rgba(31, 39, 34, .08);
  --serif: Iowan Old Style, Baskerville, "Times New Roman", Times, serif;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  color: var(--ink);
  background:
    linear-gradient(90deg, transparent 0 4.2%, rgba(28, 77, 70, .025) 4.2% 4.35%, transparent 4.35% 95.65%, rgba(28, 77, 70, .025) 95.65% 95.8%, transparent 95.8%),
    var(--paper);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.55;
}

a { color: inherit; text-decoration-color: rgba(28, 77, 70, .46); text-underline-offset: .16em; }
a:hover { color: var(--green); text-decoration-color: var(--green); }
img { display: block; max-width: 100%; }
button, input { font: inherit; }

.skip {
  position: fixed;
  z-index: 100;
  top: .75rem;
  left: .75rem;
  padding: .5rem .7rem;
  color: white;
  background: var(--green-dark);
  transform: translateY(-180%);
}
.skip:focus { transform: translateY(0); }

.site-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  width: min(1420px, calc(100% - 3rem));
  margin: 0 auto;
  min-height: 5.2rem;
  border-bottom: 1px solid var(--line);
}

.site-name {
  flex: 0 0 auto;
  color: var(--ink);
  font: 600 clamp(1rem, 1.25vw, 1.2rem)/1.1 var(--serif);
  letter-spacing: .005em;
  text-decoration: none;
}

.site-nav { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .18rem 1.15rem; }
.site-nav a {
  color: var(--ink-soft);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .09em;
  text-decoration: none;
  text-transform: uppercase;
}
.site-nav a[aria-current="page"] { color: var(--green); }

.page { width: min(1270px, calc(100% - 3rem)); margin: 0 auto; }
.page-section { padding: clamp(3.5rem, 7vw, 7rem) 0; border-top: 1px solid var(--line); }
.page-section:first-child { border-top: 0; }

.kicker, .eyebrow {
  margin: 0 0 .85rem;
  color: var(--green);
  font-size: .69rem;
  font-weight: 800;
  letter-spacing: .13em;
  line-height: 1.25;
  text-transform: uppercase;
}
.eyebrow { color: var(--gold); }

h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { color: var(--ink); }
h1, h2 { font-family: var(--serif); font-weight: 400; letter-spacing: -.025em; }
h1 { max-width: 17ch; margin-bottom: 1rem; font-size: clamp(3rem, 7.2vw, 7.1rem); line-height: .94; }
h2 { margin-bottom: 1rem; font-size: clamp(2rem, 3.65vw, 4.1rem); line-height: .99; }
h3 { font-family: var(--serif); font-size: 1.48rem; font-weight: 500; line-height: 1.08; }
p { color: var(--ink-soft); }
.lead { max-width: 60rem; margin-bottom: 0; color: var(--ink); font-family: var(--serif); font-size: clamp(1.28rem, 2.2vw, 2.05rem); line-height: 1.23; }
.root-line { max-width: 54rem; margin: 1.75rem 0 0; color: var(--green-dark); font-family: var(--serif); font-size: 1.15rem; }
.root-line b { font-weight: 600; }

.home-hero { padding: clamp(4.5rem, 12vw, 10.5rem) 0 clamp(3.5rem, 8vw, 7rem); }
.form-fit-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin-top: clamp(2.5rem, 5vw, 4rem); border: 1px solid var(--line); background: var(--line); }
.form-fit-grid article { min-height: 12rem; padding: 1.45rem; background: var(--paper-soft); }
.form-fit-grid h2, .form-fit-grid h3 { margin-bottom: .85rem; color: var(--green); font-family: var(--sans); font-size: .72rem; font-weight: 800; letter-spacing: .1em; line-height: 1.2; text-transform: uppercase; }
.form-fit-grid p { max-width: 15ch; margin: 0; color: var(--ink); font: 1.4rem/1.1 var(--serif); }

.metric-equation { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(16rem, .8fr); gap: 2rem; align-items: center; margin-top: 1rem; padding: 1.35rem 1.45rem; border: 1px solid var(--line); background: var(--paper-deep); }
.metric-equation__math { margin: 0; color: var(--green-dark); font: clamp(1.25rem, 2.3vw, 2.25rem)/1.15 var(--serif); letter-spacing: -.025em; }
.metric-equation p:last-child { max-width: 34rem; margin: 0; font-size: .9rem; line-height: 1.45; }

.actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.3rem; margin-top: 2rem; }
.button-link, .text-link {
  display: inline-flex;
  align-items: center;
  min-height: 2.75rem;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .075em;
  text-decoration: none;
  text-transform: uppercase;
}
.button-link { padding: .5rem 1rem; color: var(--paper); background: var(--green); }
.button-link:hover { color: white; background: var(--green-dark); }
.text-link { color: var(--green); }

.section-top { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 2.4rem; }
.section-top h2 { margin-bottom: 0; }
.section-top > p { max-width: 24rem; margin-bottom: .3rem; font-size: .95rem; }

.start-grid, .category-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.start-card, .category-card { min-height: 15rem; padding: 1.35rem; border: 1px solid var(--line); background: rgba(251, 249, 244, .62); }
.start-card { display: flex; flex-direction: column; align-items: flex-start; }
.start-card h3 { margin: .1rem 0 .75rem; }
.start-card p:not(.eyebrow) { flex: 1; }
.start-card a, .category-card { font-size: .86rem; }
.category-card { position: relative; overflow: hidden; color: var(--ink); text-decoration: none; transition: background .18s ease, transform .18s ease; }
.category-card:hover { color: var(--ink); background: white; transform: translateY(-2px); }
.category-card > span { display: block; margin-bottom: 2.5rem; color: var(--gold); font: 1rem/1 var(--serif); }
.category-card h3 { margin: 0 0 .45rem; }
.category-card p { margin: 0; font-size: .88rem; }

.scope-panel { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(260px, .55fr); gap: clamp(1.8rem, 5vw, 6rem); align-items: center; padding: clamp(1.5rem, 4vw, 4rem); color: var(--paper); background: var(--green-dark); }
.scope-panel h2, .scope-panel p { color: inherit; }
.scope-panel .kicker { color: #e3ca82; }
.scope-panel h2 { font-size: clamp(2.25rem, 4.4vw, 4.5rem); }
.scope-panel > div > p:not(.kicker) { max-width: 58rem; font-size: 1.02rem; }
.scope-panel .text-link { color: #ecd996; }
.scope-panel .button-link { color: var(--green-dark); background: var(--paper); }
.scope-panel .button-link:hover { color: var(--green-dark); background: white; }
.scope-cover { width: min(100%, 340px); justify-self: center; border: 1px solid rgba(255,255,255,.2); box-shadow: 0 18px 40px rgba(0,0,0,.23); transition: transform .2s ease; }
.scope-cover:hover { transform: translateY(-3px); }
.scope-cover img { width: 100%; }
.scope-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin-top: 2rem; border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.22); }
.scope-stats > div { min-height: 5.5rem; padding: .8rem .9rem; background: rgba(0,0,0,.11); }
.scope-stats b { display: block; color: #f0dfaa; font: 1.15rem/1.15 var(--serif); }
.scope-stats span { display: block; margin-top: .35rem; color: rgba(255,255,255,.8); font-size: .76rem; line-height: 1.35; }

.records-summary { display: grid; grid-template-columns: 1.1fr .75fr; gap: 5rem; align-items: start; }
.records-summary h2 { margin-bottom: .8rem; }
.records-summary ul { margin: 0; padding: 0; border-top: 1px solid var(--line); list-style: none; }
.records-summary li { padding: .85rem 0; border-bottom: 1px solid var(--line); color: var(--ink); font-family: var(--serif); }
.root-summary { display: grid; grid-template-columns: 1.1fr .75fr; gap: 5rem; align-items: start; }
.root-summary h2 { margin-bottom: .8rem; }
.root-summary .lead { max-width: 43rem; }
.root-note { margin: 0; padding: 1.2rem; border-top: 3px solid var(--gold); color: var(--ink); background: var(--paper-deep); font-family: var(--serif); font-size: 1.1rem; line-height: 1.4; }

.site-footer { display: flex; align-items: flex-start; justify-content: space-between; gap: 2rem; width: min(1420px, calc(100% - 3rem)); margin: 0 auto; padding: 1.5rem 0 3rem; border-top: 1px solid var(--line); }
.site-footer p { margin: 0; font-size: .7rem; line-height: 1.5; }
.site-footer p:last-child { text-align: right; }

/* Library */
.library-hero, .architecture-hero { padding: clamp(4rem, 10vw, 9rem) 0 clamp(3rem, 6vw, 5.5rem); }
.library-hero h1, .architecture-hero h1 { max-width: 20ch; }
.edition-count { max-width: 55rem; margin: 1.25rem 0 0; color: var(--green); font-size: .9rem; }
.library-tools { display: grid; grid-template-columns: minmax(15rem, .8fr) 1.7fr; gap: 2rem; padding-bottom: 2rem; border-bottom: 1px solid var(--line); }
.library-search { display: grid; gap: .4rem; }
.library-search label { color: var(--green); font-size: .67rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.library-search input { width: 100%; padding: .72rem .85rem; border: 1px solid var(--line-dark); color: var(--ink); background: var(--paper-soft); border-radius: 0; outline: 0; }
.library-search input:focus { border-color: var(--green); box-shadow: 0 0 0 2px rgba(28,77,70,.12); }
.shelf-controls { display: flex; flex-wrap: wrap; gap: .4rem; align-content: start; }
.shelf-controls button { padding: .55rem .7rem; border: 1px solid var(--line); color: var(--ink-soft); background: transparent; cursor: pointer; font-size: .71rem; font-weight: 800; letter-spacing: .04em; }
.shelf-controls button:hover, .shelf-controls button[aria-pressed="true"] { color: var(--paper); border-color: var(--green); background: var(--green); }
.catalog-status { margin: 1.25rem 0 0; color: var(--green); font-size: .78rem; font-weight: 700; }
.catalog-section { padding-top: 3.5rem; }
.catalog-section:first-child { padding-top: 2.2rem; }
.catalog-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin: 0 0 1.25rem; padding-bottom: .7rem; border-bottom: 1px solid var(--line); }
.catalog-heading h2 { margin: 0; font-size: clamp(1.65rem, 2.6vw, 2.5rem); }
.catalog-heading span { color: var(--green); font-size: .72rem; font-weight: 800; letter-spacing: .1em; }
.paper-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.paper-card { display: grid; grid-template-columns: 6.75rem minmax(0, 1fr); gap: 1rem; min-height: 11.5rem; padding: .8rem; border: 1px solid var(--line); background: rgba(251, 249, 244, .5); }
.paper-cover { display: flex; align-items: center; justify-content: center; min-height: 9.5rem; overflow: hidden; border: 1px solid var(--line); color: var(--green); background: var(--paper-deep); }
.paper-cover img { width: 100%; height: 100%; object-fit: cover; }
.paper-cover.placeholder { padding: .7rem; text-align: center; font: 1rem/1.05 var(--serif); }
.paper-card__body { display: flex; flex-direction: column; min-width: 0; }
.paper-card__code { margin: 0 0 .35rem; color: var(--green); font-size: .62rem; font-weight: 800; letter-spacing: .1em; }
.paper-card h3 { margin: 0; font-size: 1.28rem; }
.paper-card h3 a { text-decoration: none; }
.paper-card__status { margin: .25rem 0 .6rem; color: var(--gold); font-size: .67rem; font-weight: 700; line-height: 1.35; }
.paper-card__summary { margin: 0 0 .8rem; color: var(--ink-soft); font-size: .78rem; line-height: 1.4; }
.paper-links { display: flex; flex-wrap: wrap; gap: .4rem .75rem; margin-top: auto; }
.paper-links a { color: var(--green); font-size: .66rem; font-weight: 800; letter-spacing: .04em; text-decoration: none; text-transform: uppercase; }
.empty-state { padding: 3rem; border: 1px dashed var(--line-dark); text-align: center; }
.records-layout { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.record-group { border-top: 3px solid var(--green); padding-top: .9rem; }
.record-group h3 { margin-bottom: .8rem; font-size: 1.3rem; }
.record-card { padding: .85rem 0; border-top: 1px solid var(--line); }
.record-card:first-of-type { border-top: 0; }
.record-card__num { display: block; margin-bottom: .2rem; color: var(--gold); font-size: .66rem; font-weight: 800; letter-spacing: .1em; }
.record-card h4 { margin: 0 0 .2rem; color: var(--ink); font: 1.05rem/1.15 var(--serif); }
.record-card p { margin: 0; color: var(--ink-soft); font-size: .76rem; line-height: 1.35; }
.record-card__meta { margin-top: .28rem !important; color: var(--green) !important; font-size: .65rem !important; font-weight: 700; }
.open-record { grid-column: 1 / -1; margin-top: 2rem; padding: 1.35rem; border-left: 3px solid var(--gold); background: #f1ebe0; }
.open-record h3 { margin-bottom: .35rem; }
.open-record p:last-child { margin-bottom: 0; }
.notation-list { max-width: 65rem; margin: 0; padding-left: 1.1rem; color: var(--ink-soft); }
.notation-list li { margin: .55rem 0; padding-left: .35rem; }

/* Architecture */
.architecture-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(17rem, .48fr); gap: 4rem; align-items: end; }
.architecture-hero .lead { max-width: 35rem; }
.closure-definition { margin: 0; padding: 1.2rem; border-top: 3px solid var(--gold); color: var(--ink); background: var(--paper-deep); font-family: var(--serif); font-size: 1.1rem; line-height: 1.35; }
.closure-definition b { color: var(--green); font-family: var(--sans); font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; }
.architecture-jump { display: flex; flex-wrap: wrap; gap: .5rem 1.2rem; grid-column: 1 / -1; }
.architecture-jump a { color: var(--green); font-size: .72rem; font-weight: 800; letter-spacing: .06em; text-decoration: none; text-transform: uppercase; }
.register-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.equation-card { display: flex; flex-direction: column; min-height: 17rem; padding: 1.25rem; border: 1px solid var(--line); background: rgba(251,249,244,.58); }
.equation-card__label { margin: 0 0 1.6rem; color: var(--green); font-size: .66rem; font-weight: 800; letter-spacing: .115em; }
.equation-card__math { margin: 0 0 1.25rem; color: var(--ink); font: clamp(1.3rem, 2.1vw, 2rem)/1.1 var(--serif); word-break: break-word; }
.equation-card__math.tight { font-size: clamp(1.05rem, 1.6vw, 1.45rem); }
.equation-card p:last-child { margin: auto 0 0; font-size: .85rem; line-height: 1.42; }
.field-section-title { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin: 4rem 0 1.25rem; padding-bottom: .7rem; border-bottom: 1px solid var(--line); }
.field-section-title h3 { margin: 0; font-size: clamp(1.45rem, 2.5vw, 2.3rem); }
.field-section-title p { margin: 0; color: var(--gold); font-size: .68rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.appendix-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.appendix-grid .equation-card { min-height: 13.5rem; }

.standard-model { padding: clamp(1.5rem, 4vw, 4rem); color: var(--paper); background: var(--green-dark); }
.standard-model h2, .standard-model p { color: inherit; }
.standard-model .kicker { color: #e1c776; }
.standard-model .lead { max-width: 55rem; font-size: clamp(1.1rem, 1.85vw, 1.65rem); }
.standard-model .model-equation { margin: 2rem 0; padding: 1rem; border: 1px solid rgba(255,255,255,.27); color: #f0dfaa; font: clamp(1.25rem, 2.8vw, 2.6rem)/1.15 var(--serif); text-align: center; }
.lagrangian-table { width: 100%; border-collapse: collapse; color: rgba(255,255,255,.9); }
.lagrangian-table th, .lagrangian-table td { padding: .8rem; border-top: 1px solid rgba(255,255,255,.2); vertical-align: top; text-align: left; }
.lagrangian-table th { width: 24%; color: #f0dfaa; font-size: .69rem; letter-spacing: .08em; text-transform: uppercase; }
.lagrangian-table td { font-family: var(--serif); font-size: 1.05rem; }
.lagrangian-table td:last-child { color: rgba(255,255,255,.75); font-family: var(--sans); font-size: .83rem; }
.model-types { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin-top: 2rem; border: 1px solid rgba(255,255,255,.21); background: rgba(255,255,255,.21); }
.model-types div { min-height: 8rem; padding: .9rem; background: rgba(0,0,0,.13); }
.model-types b { display: block; margin-bottom: .55rem; color: #f0dfaa; font-size: .66rem; letter-spacing: .1em; }
.model-types span { color: rgba(255,255,255,.8); font: 1rem/1.2 var(--serif); }
.standard-model .text-link { color: #e3cc80; }

.lineage-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; background: var(--line); border: 1px solid var(--line); }
.lineage-card { display: flex; flex-direction: column; min-height: 19rem; padding: 1rem; background: var(--paper-soft); }
.lineage-card img { width: 100%; height: 6.5rem; margin: 0 0 .75rem; object-fit: contain; object-position: left center; }
.lineage-card__date { margin: 0 0 .45rem; color: var(--gold); font-size: .64rem; font-weight: 800; letter-spacing: .1em; }
.lineage-card h3 { margin: 0 0 .35rem; font-size: 1.23rem; }
.lineage-card__operation { margin: 0 0 .5rem; color: var(--green); font-size: .68rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.lineage-card__sentence { margin: 0; font-size: .78rem; line-height: 1.35; }
.lineage-card a { display: inline-block; margin-top: auto; padding-top: 1rem; color: var(--green); font-size: .65rem; font-weight: 800; letter-spacing: .045em; text-decoration: none; text-transform: uppercase; }
.legend { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; margin: 1.5rem 0 0; padding: 1rem 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.legend span { display: inline-flex; align-items: center; gap: .4rem; color: var(--ink-soft); font-size: .72rem; }
.legend i { width: .7rem; height: .7rem; border-radius: 50%; background: var(--green); }
.legend .red { background: var(--red); }.legend .orange { background: #d67b39; }.legend .yellow { background: #d0aa42; }.legend .green { background: #4d8252; }.legend .blue { background: var(--blue); }.legend .indigo { background: #4d548c; }.legend .violet { background: var(--violet); }
.architecture-notes { max-width: 62rem; margin: 0; padding-left: 1.1rem; color: var(--ink-soft); }
.architecture-notes li { margin: .55rem 0; padding-left: .25rem; }

@media (max-width: 980px) {
  .site-header { align-items: flex-start; flex-direction: column; gap: .75rem; padding: 1rem 0; }
  .site-nav { justify-content: flex-start; }
  .paper-grid, .register-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lineage-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .library-tools, .architecture-hero { grid-template-columns: 1fr; gap: 1.5rem; }
  .architecture-jump { grid-column: auto; }
  .scope-panel { grid-template-columns: minmax(0, 1fr) minmax(200px, .5fr); gap: 1.5rem; }
  .records-layout { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  body { font-size: 15px; }
  .site-header, .page, .site-footer { width: min(100% - 2rem, 1270px); }
  .site-nav { gap: .35rem .85rem; }
  .site-nav a { font-size: .64rem; }
  .form-fit-grid, .start-grid, .category-grid, .register-grid, .appendix-grid, .records-layout { grid-template-columns: 1fr; }
  .form-fit-grid article { min-height: auto; }
  .section-top, .records-summary, .root-summary, .scope-panel, .metric-equation { grid-template-columns: 1fr; display: grid; gap: 1.2rem; }
  .section-top { align-items: start; }
  .scope-panel { padding: 1.25rem; }
  .scope-cover { order: -1; width: min(60vw, 260px); justify-self: start; }
  .scope-stats { grid-template-columns: 1fr 1fr; }
  .paper-grid, .lineage-grid { grid-template-columns: 1fr; }
  .paper-card { grid-template-columns: 5.4rem minmax(0, 1fr); }
  .paper-cover { min-height: 7.5rem; }
  .records-layout { gap: 2rem; }
  .open-record { margin-top: 0; }
  .lagrangian-table { display: block; overflow-x: auto; white-space: nowrap; }
  .model-types { grid-template-columns: 1fr 1fr; }
  .site-footer { flex-direction: column; gap: .5rem; }
  .site-footer p:last-child { text-align: left; }
}

@media (max-width: 430px) {
  h1 { font-size: 3rem; }
  .scope-stats, .model-types { grid-template-columns: 1fr; }
  .actions { align-items: flex-start; flex-direction: column; }
}
