/* ============================================================
   ARCHIVE — a calm, text-forward reading page.
   The instrument at rest: light marble, carved title, mono labels,
   rationed gilt. No scanlines, grain, vignette, or motion.
   Depends on tokens.css, base.css, chrome.css.
   ============================================================ */

/* —— CALM MARBLE WASH (the look of base.css .world-ground, at rest) —— */
.arc-ground{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(140% 120% at 50% 18%, #F6F1E7 0%, #E3DBCB 46%, #C9BEA8 100%);
}

.arc-main{ position:relative; z-index:1; }

/* —— READING COLUMN —— */
.arc-column{
  width:100%; max-width:760px; margin:0 auto;
  padding-inline:var(--s-5);
  padding-top:calc(72px + var(--s-7));
  padding-bottom:var(--s-8);
}

/* —— HEADER BLOCK —— */
.arc-head{ margin-bottom:var(--s-7); }
.arc-title{ margin-top:var(--flow-tight); }
.arc-framing{ margin-top:var(--flow-default); max-width:var(--measure-lead); }

/* —— INDEX —— */
.arc-index{
  margin-bottom:var(--s-8);
  border-top:1px solid var(--edge);
}
.arc-index-list{ list-style:none; margin:0; padding:0; }
.arc-index-row{ border-bottom:1px solid var(--edge); }
.arc-index-link{
  display:grid; grid-template-columns:3.5ch 1fr; align-items:baseline; gap:var(--s-3);
  padding:var(--s-2) var(--s-1);
  transition:background var(--t-act) var(--ease-act);
}
.arc-index-link:hover{ background:color-mix(in srgb, var(--travertine-hi) 70%, transparent); }
.arc-index-link:hover .arc-name{ color:var(--ink); }
.arc-index-link:hover .arc-num{ color:var(--gilt); }
.arc-num{
  font-family:var(--f-mono); font-feature-settings:var(--feat-mono);
  font-size:var(--t-telemetry); letter-spacing:.04em; color:var(--gilt-deep);
  text-align:right;
}
.arc-name{
  font-family:var(--f-hud); font-variation-settings:var(--vf-hud-mid); font-weight:650;
  font-size:var(--t-ui); letter-spacing:var(--track-ui); text-transform:uppercase;
  color:var(--ink-soft); transition:color var(--t-act) var(--ease-act);
}

/* —— ENTRIES —— */
.arc-entry{ margin-top:var(--s-8); }
.arc-entry:first-child{ margin-top:0; }

.arc-entry-head{
  scroll-margin-top:80px;
  display:flex; align-items:baseline; gap:var(--s-3);
  padding-left:var(--s-3);
  border-left:1px solid var(--gilt-deep);
  margin-bottom:var(--flow-default);
}
.arc-entry-num{
  font-family:var(--f-mono); font-feature-settings:var(--feat-mono);
  font-size:var(--t-eyebrow); letter-spacing:.1em; color:var(--gilt-deep);
  flex:none;
}
.arc-entry-title{
  font-family:var(--f-display); font-weight:500;
  font-size:var(--t-title); line-height:var(--lh-title);
  letter-spacing:var(--track-title); color:var(--ink); text-wrap:balance;
}

.arc-entry .prose{ max-width:66ch; line-height:1.7; }

/* —— FOOT —— */
.arc-foot{
  margin-top:var(--s-8);
  padding-top:var(--s-5);
  border-top:1px solid var(--edge);
  display:flex; flex-direction:column; gap:var(--s-5);
}
.arc-return{
  align-self:flex-start;
  font-family:var(--f-civic); font-weight:600; font-size:var(--t-ui);
  letter-spacing:var(--track-ui); text-transform:uppercase; color:var(--ink-soft);
  border-bottom:1px solid var(--gilt-deep); padding-bottom:2px;
  transition:color var(--t-act), border-color var(--t-act);
}
.arc-return:hover{ color:var(--gilt-deep); border-color:var(--gilt); }
.arc-powerdown{
  font-family:var(--f-mono); font-feature-settings:var(--feat-mono);
  font-size:var(--t-telemetry); letter-spacing:.08em; text-transform:uppercase;
  color:var(--gilt-deep); opacity:.72;
}

/* —— RESPONSIVE —— */
@media (max-width:760px){
  .arc-column{
    padding-inline:var(--s-3);
    padding-top:calc(64px + var(--s-5));
    padding-bottom:var(--s-7);
  }
  .arc-head{ margin-bottom:var(--s-6); }
  .arc-index{ margin-bottom:var(--s-7); }
  .arc-entry{ margin-top:var(--s-7); }
  .arc-index-link{ gap:var(--s-2); }
}