/* ATHEX registry chrome.
   Loaded after style.css. Overrides the palette and adds the archival
   furniture (masthead, stamps, file headers); all layout and component
   rules still come from style.css, so the two stay in one system rather
   than competing. */

:root {
  --bg: #0e0f12;
  --fg: #d8d4c8;
  --muted: #8a8578;
  --border: #2a2b31;
  --accent: #c8a24a;
  --code-bg: #15161b;
  --bubble-user: #1a1d25;
  --bubble-user-fg: #d8d4c8;
  --bubble-assistant: #15161b;
  --bubble-assistant-fg: #cdc9bd;

  --paper: #16171c;
  --rule: #2a2b31;
  --stamp: #9e3b30;
  --stamp-dim: rgba(158, 59, 48, 0.5);
  --mono: ui-monospace, "SFMono-Regular", "Cascadia Mono", Consolas, "Liberation Mono", monospace;
}

/* The archive commits to one look in both themes -- a reading room does not
   have a light mode. Redeclared here so a light-preference browser does not
   inherit style.css's light values. */
@media (prefers-color-scheme: light) {
  :root {
    --bg: #0e0f12; --fg: #d8d4c8; --muted: #8a8578; --border: #2a2b31;
    --accent: #c8a24a; --code-bg: #15161b;
    --bubble-user: #1a1d25; --bubble-user-fg: #d8d4c8;
    --bubble-assistant: #15161b; --bubble-assistant-fg: #cdc9bd;
  }
}

body {
  background:
    repeating-linear-gradient(0deg, rgba(255,255,255,0.012) 0 1px, transparent 1px 3px),
    var(--bg);
  color: var(--fg);
}

/* ---------- masthead ---------- */

.atx-masthead {
  border-bottom: 2px solid var(--rule);
  padding-bottom: 10px;
  margin-bottom: 4px;
}
.atx-masthead-row { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.atx-sigil { color: var(--accent); font-size: 18px; line-height: 1; }
.atx-abbr {
  font-family: var(--mono);
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 0.32em;
  color: var(--fg);
  text-decoration: none;
}
.atx-abbr:hover { color: var(--accent); }
.atx-name {
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted);
}
.atx-motto {
  margin-left: auto;
  font-size: 10.5px;
  font-style: italic;
  color: var(--muted);
  letter-spacing: 0.06em;
}
.atx-registry-line {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.2em;
  color: var(--muted);
  margin-top: 6px;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

/* ---------- nav ---------- */

.site-nav {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--rule);
}
.site-nav a { color: var(--muted); border-radius: 0; }
.site-nav a:hover { background: rgba(200,162,74,0.08); color: var(--fg); }
.site-nav a.active {
  color: var(--accent);
  background: transparent;
  box-shadow: inset 0 -2px 0 var(--accent);
  font-weight: 700;
}

/* ---------- headings ---------- */

.page-list h1, .conv-header h1 {
  font-family: var(--mono);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-size: 19px;
}
.list-header h1 .muted { letter-spacing: 0.1em; font-size: 12px; }

/* ---------- collection sigla (replaces the provider badges) ---------- */

.badge {
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.16em;
  border-radius: 0;
  padding: 2px 6px;
  background: transparent !important;
  border: 1px solid currentColor;
}
.badge-claude { color: #d97757; }
.badge-deepseek { color: #6d86ff; }
.badge-grok { color: #9aa0ad; }
.badge-chatgpt { color: #2bb98f; }

/* ---------- registry rows ---------- */

.conv-row { border-bottom: 1px solid var(--rule); padding: 10px 0; }
.conv-row:hover { background: rgba(200,162,74,0.035); }

.atx-desig {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  color: var(--muted);
  text-decoration: none;
  white-space: nowrap;
}
.conv-row:hover .atx-desig { color: var(--accent); }

.conv-title { font-weight: 600; }
.conv-meta { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.05em; }

.atx-class {
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.14em;
  padding: 1px 5px;
  border: 1px solid var(--rule);
  color: var(--muted);
  white-space: nowrap;
}
.atx-class-FRAGMENT  { color: #7b8794; }
.atx-class-STABLE    { color: #6f9c72; }
.atx-class-EXTENDED  { color: #c8a24a; }
.atx-class-RECURSIVE { color: #cf7a3c; border-color: rgba(207,122,60,0.45); }
.atx-class-UNBOUNDED { color: #d0483c; border-color: rgba(208,72,60,0.5); }

/* ---------- the file header (conversation page) ---------- */

.atx-filehead {
  border: 1px solid var(--rule);
  border-left: 3px solid var(--accent);
  background: var(--paper);
  padding: 12px 14px;
  margin: 10px 0 4px;
}
.atx-filehead-desig {
  font-family: var(--mono);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: var(--accent);
}
.atx-fields {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
  gap: 8px 18px;
  margin-top: 10px;
}
.atx-field { min-width: 0; }
.atx-field-label {
  font-family: var(--mono);
  font-size: 8.5px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--muted);
  display: block;
}
.atx-field-value {
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.04em;
  color: var(--fg);
  overflow-wrap: anywhere;
}

.atx-stamp {
  display: inline-block;
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.22em;
  color: var(--stamp);
  border: 2px solid var(--stamp-dim);
  padding: 3px 8px;
  transform: rotate(-2.5deg);
  opacity: 0.9;
}

/* The condensed sticky header drops the whole file block -- the designation
   is already restated in the header line, and a 5-field grid pinned to the
   top of a long transcript eats a third of the viewport. */
.conv-header.condensed .atx-filehead { display: none; }

/* ---------- transcript ---------- */

.msg-label {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--muted);
}
.bubble { border-radius: 2px; border: 1px solid var(--rule); }
.msg-row.user .bubble { border-left: 2px solid var(--accent); }
.msg-row.assistant .bubble { border-left: 2px solid var(--rule); }

/* ---------- controls ---------- */

.filters input[type=text], .filters select, .filters button,
.orig-link, .pager-num, .pager-arrow, .pager-current,
.pager-goto input, .pager-goto button, .settings-form button {
  border-radius: 0;
  font-family: var(--mono);
  letter-spacing: 0.06em;
}
.filters button, .settings-form button, .pager-goto button {
  text-transform: uppercase;
  font-size: 11px;
  background: transparent;
  border: 1px solid var(--accent);
  color: var(--accent);
  padding: 7px 14px;
}
.filters button:hover, .settings-form button:hover, .pager-goto button:hover {
  background: var(--accent);
  color: var(--bg);
}
.orig-link { font-size: 11px; text-transform: uppercase; }
.pager-current { background: var(--accent); color: var(--bg); border-color: var(--accent); }

.search-context-banner {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  border-left: 3px solid var(--accent);
  background: var(--paper);
}

.toc { font-family: var(--mono); font-size: 11px; }

/* ---------- charter page ---------- */

/* The standing-orders page keeps a readable measure for its prose without
   narrowing the page itself. Shrinking the container moved the masthead,
   nav and classification banner every time you opened the document, which
   read as the page collapsing. */
.atx-doc p,
.atx-doc .lede,
.atx-doc h2 { max-width: 78ch; }
.atx-doc .atx-table { max-width: 980px; }
.atx-doc h2 {
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--accent);
  border-bottom: 1px solid var(--rule);
  padding-bottom: 6px;
  margin-top: 34px;
}
.atx-doc p { line-height: 1.65; }
.atx-doc .lede { font-size: 16px; line-height: 1.7; color: var(--fg); }

.atx-table { width: 100%; border-collapse: collapse; font-size: 13px; margin: 14px 0; }
.atx-table th, .atx-table td {
  border-bottom: 1px solid var(--rule);
  padding: 7px 10px;
  text-align: left;
  vertical-align: top;
}
.atx-table th {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: 700;
}
.atx-table td.num, .atx-table th.num { text-align: right; font-family: var(--mono); }
.atx-table code { font-family: var(--mono); font-size: 11.5px; color: var(--accent); }

.atx-stats { display: flex; gap: 28px; flex-wrap: wrap; margin: 18px 0 6px; }
.atx-stat-value {
  font-family: var(--mono);
  font-size: 26px;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 0.02em;
  display: block;
}
.atx-stat-label {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--muted);
}

.atx-note {
  border-left: 2px solid var(--rule);
  padding: 4px 0 4px 14px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.6;
}

.atx-foot {
  margin-top: 46px;
  padding-top: 12px;
  border-top: 1px solid var(--rule);
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.14em;
  color: var(--muted);
  display: flex;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

/* ================= front desk, subject index, dossiers ================= */

.atx-wide { max-width: 1180px; }

.atx-desk-lede { margin: 18px 0 4px; }
.atx-desk-lede .lede { font-size: 15.5px; line-height: 1.7; max-width: 78ch; }

.atx-counters {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 12px;
  margin: 20px 0 26px;
}
.atx-counter {
  border: 1px solid var(--rule);
  border-top: 2px solid var(--accent);
  background: var(--paper);
  padding: 14px 14px 12px;
  text-decoration: none;
  display: block;
}
.atx-counter:hover { background: #1b1c22; border-top-color: #e0bb63; }
.atx-counter-value {
  display: block;
  font-family: var(--mono);
  font-size: 27px;
  font-weight: 700;
  color: var(--accent);
  line-height: 1.1;
}
.atx-counter-label {
  display: block;
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--fg);
  margin-top: 7px;
}
.atx-counter-sub {
  display: block;
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.06em;
  color: var(--muted);
  margin-top: 5px;
}

.atx-desk-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 16px;
  align-items: start;
}
.atx-panel {
  border: 1px solid var(--rule);
  background: var(--paper);
  padding: 14px 16px 16px;
}
.atx-panel-wide { grid-column: 1 / -1; }
.atx-panel-head {
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--accent);
  margin: 0 0 10px;
  padding-bottom: 7px;
  border-bottom: 1px solid var(--rule);
}
.atx-panel-note { font-size: 12px; color: var(--muted); line-height: 1.6; margin: 10px 0 0; }
.atx-panel-body { font-size: 13.5px; line-height: 1.7; margin: 0; max-width: 82ch; }
.atx-panel-more {
  display: inline-block;
  margin-top: 12px;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.atx-table-tight th, .atx-table-tight td { padding: 4px 8px; font-size: 12.5px; }
.atx-bar-cell { width: 45%; }
.atx-bar {
  display: block;
  height: 8px;
  background: var(--accent);
  min-width: 1px;
}
.atx-bar-FRAGMENT  { background: #7b8794; }
.atx-bar-STABLE    { background: #6f9c72; }
.atx-bar-EXTENDED  { background: #c8a24a; }
.atx-bar-RECURSIVE { background: #cf7a3c; }
.atx-bar-UNBOUNDED { background: #d0483c; }

/* ---------- cryptonyms + subject rows ---------- */

.atx-crypt {
  font-family: var(--mono);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--accent);
  text-decoration: none;
  white-space: nowrap;
}
.atx-crypt:hover { text-decoration: underline; }

.atx-subject-list { list-style: none; margin: 0; padding: 0; }
.atx-subject-list li {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 6px 0;
  border-bottom: 1px solid var(--rule);
  flex-wrap: wrap;
}
.atx-subject-list li:last-child { border-bottom: none; }
.atx-subject-name { flex: 1; min-width: 120px; font-weight: 600; font-size: 13px; }
.atx-subject-meta {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  color: var(--muted);
  white-space: nowrap;
}

.atx-dense .conv-row { padding: 6px 4px; }
.atx-dense .conv-title { font-size: 13.5px; }

/* Persistence bands reuse the disposition chip, with their own colours --
   the class names come from subject_store._persistence_band(), spaces
   replaced with hyphens in the template. */
.atx-class-SINGLE-CONTACT { color: #7b8794; }
.atx-class-BURST          { color: #d0483c; border-color: rgba(208,72,60,0.5); }
.atx-class-SHORT-SERIES   { color: #c8a24a; }
.atx-class-SUSTAINED      { color: #cf7a3c; border-color: rgba(207,122,60,0.45); }
.atx-class-LONGITUDINAL   { color: #6f9c72; border-color: rgba(111,156,114,0.5); }
.atx-class-INDETERMINATE  { color: #7b8794; }

/* ---------- dossier header ---------- */

.atx-dossier-head {
  border: 1px solid var(--rule);
  border-left: 3px solid var(--accent);
  background: var(--paper);
  padding: 16px 18px;
  margin: 16px 0 12px;
  display: flex;
  align-items: baseline;
  gap: 16px;
  flex-wrap: wrap;
}
.atx-dossier-crypt {
  font-family: var(--mono);
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: var(--accent);
}
.atx-dossier-name {
  font-size: 17px;
  font-weight: 600;
  color: var(--fg);
  flex: 1;
  min-width: 160px;
}
.atx-dossier-stamps { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }

.atx-fields-boxed {
  border: 1px solid var(--rule);
  background: var(--paper);
  padding: 14px 18px;
  margin-bottom: 16px;
}

/* ---------- diurnal histogram ---------- */

.atx-hours {
  display: flex;
  align-items: flex-end;
  gap: 2px;
  height: 96px;
  border-bottom: 1px solid var(--rule);
  margin-top: 12px;
}
.atx-hour-col { flex: 1; display: flex; align-items: flex-end; min-width: 4px; }
.atx-hour-bar { width: 100%; background: var(--accent); min-height: 1px; }
.atx-hours-axis {
  display: flex;
  justify-content: space-between;
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.1em;
  color: var(--muted);
  margin-top: 4px;
}

/* ---------- recurring vocabulary ---------- */

.atx-terms { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.atx-term {
  font-family: var(--mono);
  font-size: 11.5px;
  border: 1px solid var(--rule);
  padding: 2px 6px;
  color: var(--fg);
  white-space: nowrap;
}
.atx-term-n {
  color: var(--muted);
  font-size: 9px;
  margin-left: 5px;
}

/* ---------- subject block on a case file ---------- */

.atx-subject-link {
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-decoration: none;
  border: 1px solid var(--rule);
  border-left: 2px solid var(--accent);
  padding: 3px 8px;
}
.atx-subject-link:hover { background: rgba(200,162,74,0.08); }
.atx-subject-link .muted { font-size: 10px; }

/* ===================== institutional page chrome ===================== */

/* Classification banner. Marked at head and foot of every page: material
   marked only at the head reads as a graphic, not a marking. */
.atx-clsbar {
  background: var(--stamp);
  color: #f4ece4;
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.24em;
  text-align: center;
  padding: 4px 10px;
  margin: 0 -16px 14px;
  /* Wraps rather than scrolls: a nowrap banner on a narrow viewport put a
     horizontal scrollbar across the top of every page. */
  white-space: normal;
  overflow-wrap: anywhere;
}
.atx-clsbar-foot { margin: 14px -16px 0; }

.atx-seal {
  color: var(--accent);
  font-size: 22px;
  line-height: 1;
  border: 1px solid var(--accent);
  padding: 4px 7px;
}
.atx-subtitle {
  font-size: 9.5px;
  letter-spacing: 0.16em;
  color: var(--muted);
}
.atx-name { line-height: 1.5; }

.atx-session {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
  align-items: baseline;
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.16em;
  color: var(--muted);
  margin-top: 9px;
  padding-top: 7px;
  border-top: 1px solid var(--rule);
}
.atx-session-spacer { flex: 1; }

/* Sectioned navigation. The archive has four functions and the nav should
   say so; ten equal links in a row said nothing about how the place is
   organised. */
.atx-nav {
  display: flex;
  gap: 26px;
  flex-wrap: wrap;
  align-items: flex-end;
  padding-bottom: 6px;
}
.atx-navgroup { display: flex; align-items: baseline; gap: 2px; flex-wrap: wrap; }
.atx-navgroup-label {
  font-family: var(--mono);
  font-size: 8px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #5d5a52;
  margin-right: 8px;
  border-right: 1px solid var(--rule);
  padding-right: 10px;
  align-self: stretch;
  display: flex;
  align-items: center;
}

/* ---------- handling caveats on a file header ---------- */

.atx-caveats {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--rule);
}
.atx-caveat-label {
  font-family: var(--mono);
  font-size: 8.5px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--muted);
}
.atx-caveat {
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: var(--stamp);
  border: 1px solid var(--stamp-dim);
  padding: 2px 6px;
}
.atx-caveat-note {
  font-family: var(--mono);
  font-size: 9.5px;
  color: var(--muted);
  letter-spacing: 0.04em;
}

/* ---------- document control block ---------- */

.atx-docctl {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 8px 18px;
  border: 1px solid var(--rule);
  background: var(--paper);
  padding: 10px 14px;
  margin: 14px 0 18px;
}

/* ---------- retrieval scope blocks ---------- */

/* Each retrieval facility states its own method, scope, cost and access
   condition before the query box. Two facilities that look identical but
   behave differently is the confusion this is meant to remove. */
.atx-scope {
  border: 1px solid var(--rule);
  border-left: 3px solid var(--accent);
  background: var(--paper);
  padding: 10px 14px;
  margin: 14px 0 16px;
}
.atx-scope-elevated { border-left-color: var(--stamp); }

.atx-scope-row {
  display: flex;
  gap: 14px;
  padding: 5px 0;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.atx-scope-row:last-child { border-bottom: none; }
.atx-scope-row-alt { padding-top: 8px; }

.atx-scope-key {
  font-family: var(--mono);
  font-size: 8.5px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--muted);
  flex: 0 0 82px;
  padding-top: 3px;
}
.atx-scope-val { font-size: 12.5px; line-height: 1.6; flex: 1; min-width: 0; }
.atx-scope-val code {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--accent);
}
.atx-elevated { color: var(--stamp); letter-spacing: 0.08em; }

/* ---------- access tier chip on a result row ---------- */

.atx-tier {
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.12em;
  border: 1px solid var(--rule);
  color: var(--muted);
  padding: 1px 5px;
  white-space: nowrap;
}

/* ===================== selector graph / workspace ===================== */

.atx-lookup {
  display: flex;
  gap: 10px;
  align-items: center;
  margin: 18px 0 6px;
  flex-wrap: wrap;
}
.atx-lookup-label {
  font-family: var(--mono);
  font-size: 8.5px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--muted);
}
.atx-lookup input {
  flex: 1;
  min-width: 260px;
  padding: 11px 13px;
  border: 1px solid var(--accent);
  border-radius: 0;
  background: var(--paper);
  color: var(--fg);
  font-family: var(--mono);
  font-size: 14px;
  letter-spacing: 0.04em;
}
.atx-lookup button {
  border-radius: 0;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  background: var(--accent);
  color: var(--bg);
  border: 1px solid var(--accent);
  padding: 11px 20px;
  font-weight: 700;
}
.atx-lookup-note { font-size: 12px; color: var(--muted); margin: 0 0 16px; line-height: 1.6; }

.atx-resultbar {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  color: var(--fg);
  border-left: 3px solid var(--accent);
  background: var(--paper);
  padding: 8px 12px;
  margin-bottom: 14px;
}
.atx-resultbar code { color: var(--accent); }

/* ---------- dense result grid ---------- */

.atx-grid { font-size: 12.5px; }
.atx-grid tbody tr:hover { background: rgba(200,162,74,0.05); }
.atx-grid td { vertical-align: middle; }
.atx-grid .conv-title { font-size: 12.5px; }

/* ---------- selector chips and types ---------- */

.atx-kind {
  font-family: var(--mono);
  font-size: 8.5px;
  font-weight: 700;
  letter-spacing: 0.14em;
  border: 1px solid var(--rule);
  padding: 1px 5px;
  color: var(--muted);
  white-space: nowrap;
}
.atx-kind-EMAIL      { color: #d0483c; border-color: rgba(208,72,60,0.45); }
.atx-kind-PHONE      { color: #cf7a3c; border-color: rgba(207,122,60,0.45); }
.atx-kind-CREDENTIAL { color: #d0483c; border-color: rgba(208,72,60,0.6); }
.atx-kind-WALLET     { color: #b06fd0; border-color: rgba(176,111,208,0.45); }
.atx-kind-DOMAIN     { color: #6f9c72; }
.atx-kind-HANDLE     { color: #c8a24a; }
.atx-kind-IPV4       { color: #6d86ff; border-color: rgba(109,134,255,0.4); }

.atx-selector {
  font-family: var(--mono);
  font-size: 12px;
  color: var(--fg);
  text-decoration: none;
  overflow-wrap: anywhere;
}
.atx-selector:hover { color: var(--accent); text-decoration: underline; }
.atx-selector-head { font-size: 19px; overflow-wrap: anywhere; }

.atx-selector-chip {
  display: inline-block;
  font-family: var(--mono);
  font-size: 10px;
  border: 1px solid var(--rule);
  padding: 1px 5px;
  margin: 1px 3px 1px 0;
  color: var(--muted);
  text-decoration: none;
  overflow-wrap: anywhere;
}
.atx-selector-chip:hover { border-color: var(--accent); color: var(--accent); }

.atx-linkflag {
  font-family: var(--mono);
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.16em;
  color: var(--accent);
  border: 1px solid rgba(200,162,74,0.4);
  padding: 1px 4px;
  white-space: nowrap;
}
.atx-pivot {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/* ---------- facet bar ---------- */

.atx-facets {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  align-items: flex-end;
  border: 1px solid var(--rule);
  background: var(--paper);
  padding: 12px 14px;
  margin: 14px 0 8px;
}
.atx-facet { display: flex; flex-direction: column; gap: 4px; min-width: 132px; }
.atx-facet input, .atx-facet select {
  border: 1px solid var(--border);
  border-radius: 0;
  background: var(--bg);
  color: var(--fg);
  font-family: var(--mono);
  font-size: 12px;
  padding: 6px 8px;
}
.atx-facet-actions { flex-direction: row; align-items: center; gap: 10px; }
.atx-facets button {
  border-radius: 0;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  background: var(--accent);
  color: var(--bg);
  border: 1px solid var(--accent);
  padding: 8px 18px;
  font-weight: 700;
}

/* ---------- link graph ---------- */

.atx-graphwrap {
  border: 1px solid var(--rule);
  background: var(--paper);
  margin: 14px 0 16px;
  overflow-x: auto;
}
.atx-graph { display: block; min-width: 640px; }
.atx-edge { stroke: #3b3d46; }
.atx-edge-label {
  fill: #6f6b62;
  font-family: var(--mono);
  font-size: 9px;
  text-anchor: middle;
  letter-spacing: 0.08em;
}
.atx-node {
  fill: #1c1e26;
  stroke: var(--accent);
  stroke-width: 1.5;
}
.atx-node:hover { fill: #2a2c36; }
.atx-node-focus { fill: #3a2f18; stroke-width: 2.5; }
.atx-node-label {
  fill: var(--accent);
  font-family: var(--mono);
  font-size: 10.5px;
  font-weight: 700;
  text-anchor: middle;
  letter-spacing: 0.08em;
}
.atx-node-sub {
  fill: var(--muted);
  font-family: var(--mono);
  font-size: 9px;
  text-anchor: middle;
}

.atx-selectors-row { align-items: flex-start; }
.atx-chip-n {
  color: var(--accent);
  font-weight: 700;
  margin-left: 5px;
  font-size: 9px;
}

/* Transcript column keeps a readable measure while the page chrome stays
   the same width as every other page. */
.page-conv .chat { max-width: 860px; }
.page-conv .atx-filehead,
.page-conv .conv-header-top,
.page-conv .conv-sub { max-width: none; }

/* ========================= access control ========================= */

/* The sign-in page is the one page with no content to push the closing
   banner down, so it is laid out as a full-height column: the form takes
   the slack and the banner sits on the bottom edge rather than floating
   mid-viewport. */
.atx-loginpage {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
.atx-loginwrap {
  flex: 1;
  width: 100%;
  max-width: 560px;
  margin: 0 auto;
  padding: 0 16px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.atx-loginbox {
  border: 1px solid var(--rule);
  border-top: 2px solid var(--accent);
  background: var(--paper);
  padding: 26px 28px 22px;
}
.atx-login-masthead {
  display: flex;
  gap: 14px;
  align-items: center;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--rule);
  margin-bottom: 20px;
}
.atx-login-masthead .atx-abbr { font-size: 20px; display: block; }
.atx-loginform { display: flex; flex-direction: column; gap: 6px; }
.atx-loginform input {
  border: 1px solid var(--border);
  border-radius: 0;
  background: var(--bg);
  color: var(--fg);
  font-family: var(--mono);
  font-size: 14px;
  letter-spacing: 0.08em;
  padding: 10px 12px;
  margin-bottom: 10px;
}
.atx-loginform input:focus { outline: none; border-color: var(--accent); }
.atx-loginform button {
  margin-top: 8px;
  border-radius: 0;
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  background: var(--accent);
  color: var(--bg);
  border: 1px solid var(--accent);
  padding: 11px 18px;
}
.atx-login-error {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  color: var(--stamp);
  border-left: 2px solid var(--stamp);
  padding: 6px 10px;
  margin: 4px 0 6px;
}
.atx-login-foot {
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid var(--rule);
  font-size: 11.5px;
  color: var(--muted);
  line-height: 1.6;
}
.atx-tiertable { border: 1px solid var(--rule); background: var(--paper); padding: 14px; }

/* ---------- tiers, denials, redaction ---------- */

.atx-tier-req { color: var(--stamp); border-color: var(--stamp-dim); }

.atx-denied {
  border: 1px solid var(--stamp-dim);
  border-left: 3px solid var(--stamp);
  background: var(--paper);
  padding: 22px 24px;
  margin: 20px 0;
}
.atx-denied-mark {
  font-family: var(--mono);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.28em;
  color: var(--stamp);
  margin-bottom: 18px;
}
.atx-denied-table { max-width: 620px; }
.atx-denied-table th {
  text-align: left;
  width: 120px;
  font-family: var(--mono);
  font-size: 8.5px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--muted);
}
.atx-denied-actions { display: flex; gap: 10px; margin-top: 18px; flex-wrap: wrap; }

.atx-redacted { margin-top: 18px; opacity: 0.75; }
.atx-withheld {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.18em;
  color: var(--stamp);
}
.atx-withheld-snippet {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--muted);
  border-left-color: var(--stamp) !important;
  letter-spacing: 0.04em;
}
.atx-masked {
  font-family: var(--mono);
  font-size: 12px;
  color: var(--muted);
  letter-spacing: 0.04em;
}
.atx-row-locked td { opacity: 0.62; }
.atx-row-locked:hover td { opacity: 0.85; }

.atx-ok { font-family: var(--mono); font-size: 9px; letter-spacing: 0.14em; color: #6f9c72; }
.atx-deny { font-family: var(--mono); font-size: 9px; letter-spacing: 0.14em; color: var(--stamp); }
.atx-logtarget { font-size: 10.5px; color: var(--muted); overflow-wrap: anywhere; }

@media (max-width: 720px) {
  .atx-loginwrap { grid-template-columns: 1fr; }
}

.atx-signout {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.16em;
  color: var(--muted);
  text-decoration: none;
  border: 1px solid var(--rule);
  padding: 2px 7px;
}
.atx-signout:hover { color: var(--stamp); border-color: var(--stamp-dim); }

/* Sign-in banners span the viewport: this page has no padded container for
   the negative margins to cancel against. */
.atx-loginpage > .atx-clsbar { margin: 0; }
.atx-loginpage > .atx-clsbar-foot { margin: 0; }

/* ---------- closing banner pins to the bottom of the viewport ----------
   Short pages (an empty search, the terminal, a denial) do not fill the
   window, so the closing classification banner used to sit wherever the
   content happened to stop, halfway up the screen. The page column is
   full-height and the footer takes the slack, so the banner is on the
   bottom edge on short pages and directly after the content on long ones.
   Children are held at their natural height: without flex-shrink:0 a flex
   column compresses tall tables to fit. */
body { min-height: 100vh; display: flex; flex-direction: column; }
body > .page-list,
body > .page-conv {
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
  width: 100%;
}
body > .page-list > *,
body > .page-conv > * { flex-shrink: 0; }
.page-list > .atx-foot,
.page-conv > .atx-foot { margin-top: auto; }

/* The transcript column is centred inside the now-flex page container. */
.page-conv > .chat { align-self: center; width: 100%; }

/* ===================== terminal: operators and issue ===================== */

/* Notices sit above the fold and reuse the stamp/accent palette rather than
   introducing a third signal colour. */
.atx-notice {
  font-family: var(--mono);
  font-size: 11.5px;
  letter-spacing: 0.06em;
  padding: 9px 12px;
  border: 1px solid var(--rule);
  background: var(--paper);
  margin: 0 0 16px;
}
.atx-notice-ok { border-left: 2px solid var(--accent); color: var(--fg); }
.atx-notice-bad { border-left: 2px solid var(--stamp); color: var(--fg); }

/* The one screen where a passcode is ever visible. Deliberately loud. */
.atx-issued { border-color: var(--accent); }
.atx-issued-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 22px 40px;
  align-items: baseline;
}
.atx-issued-value {
  display: block;
  font-family: var(--mono);
  font-size: 16px;
  letter-spacing: 0.08em;
  color: var(--accent);
  background: var(--code-bg);
  border: 1px solid var(--rule);
  padding: 7px 11px;
  margin-top: 4px;
  user-select: all;
}

.atx-warn { color: var(--stamp); }
.atx-self { font-family: var(--mono); font-size: 10px; letter-spacing: 0.12em; }

/* A revoke button lives inside a table cell, so its form must not add
   block layout of its own. */
.atx-inline-form { display: inline; margin: 0; }
.settings-form button.atx-danger {
  border-color: var(--stamp-dim);
  color: var(--stamp);
  padding: 4px 10px;
}
.settings-form button.atx-danger:hover {
  background: var(--stamp);
  border-color: var(--stamp);
  color: var(--fg);
}

.atx-issue-form { display: flex; flex-direction: column; gap: 12px; max-width: 620px; }
.atx-issue-row { display: flex; align-items: center; gap: 14px; }
.atx-issue-row .atx-field-label { flex: 0 0 92px; }
.atx-issue-control { display: flex; gap: 8px; flex: 1; align-items: center; }
.atx-issue-control input[type=text], .atx-issue-control select {
  flex: 1;
  min-width: 0;
  border: 1px solid var(--border);
  border-radius: 0;
  background: var(--bg);
  color: var(--fg);
  font-family: var(--mono);
  font-size: 13px;
  letter-spacing: 0.06em;
  padding: 8px 10px;
}
.atx-issue-control input[type=text]:focus,
.atx-issue-control select:focus { outline: none; border-color: var(--accent); }
.atx-issue-control input::placeholder { color: var(--muted); letter-spacing: 0.04em; }

/* Generate reads as secondary to Issue: muted until hovered. */
.settings-form button.atx-gen {
  flex: 0 0 auto;
  border-color: var(--rule);
  color: var(--muted);
  padding: 8px 12px;
}
.settings-form button.atx-gen:hover {
  background: transparent;
  border-color: var(--accent);
  color: var(--accent);
}
.settings-form button.atx-gen:disabled { opacity: 0.5; cursor: default; }

.atx-issue-actions {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 4px;
  padding-top: 14px;
  border-top: 1px solid var(--rule);
}
.atx-issue-actions .atx-panel-note { margin: 0; }

@media (max-width: 620px) {
  .atx-issue-row { flex-direction: column; align-items: stretch; gap: 5px; }
  .atx-issue-row .atx-field-label { flex: none; }
}

/* ---------- sign in: derived-credential states ---------- */

/* The error box is present but empty until there is something to say, so
   the layout does not jump when a message appears. */
.atx-login-error[hidden] { display: none; }
.atx-loginform input:disabled,
.atx-loginform button:disabled { opacity: 0.55; cursor: default; }

/* Shown only while the derivation script has not run yet. */
.atx-nojs {
  color: var(--muted);
  border-color: var(--rule);
}

.atx-issued-tier { font-family: var(--mono); font-size: 11px; letter-spacing: 0.08em; }

/* ===================== the reading room ===================== */

.atx-reading { margin-top: 22px; }
.atx-reading-head {
  display: flex;
  align-items: baseline;
  gap: 14px;
  flex-wrap: wrap;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--rule);
  margin-bottom: 18px;
}
.atx-reading-label {
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--accent);
}
.atx-reading-note {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  color: var(--muted);
}

/* States reuse the withheld stamp so a sealed record and a denied one read
   as the same kind of object, which they are. */
.atx-transcript-state {
  border: 1px solid var(--rule);
  border-left: 2px solid var(--rule);
  background: var(--paper);
  padding: 20px 22px;
}
.atx-transcript-state .atx-denied-mark { margin: 0; }
.atx-transcript-state .atx-panel-note { max-width: 68ch; }
.atx-state-sealed { border-left-color: var(--accent); }
.atx-state-error { border-left-color: var(--stamp); }
.atx-state-working { border-left-color: var(--rule); color: var(--muted); }

/* ---------- the transcript itself ---------- */

.atx-transcript {
  display: flex;
  flex-direction: column;
  gap: 2px;
  counter-reset: exchange;
}

/* A file, not a chat app: flat rows separated by rules, the speaker in the
   margin, no bubbles and no avatars. */
.atx-msg {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr);
  gap: 0 22px;
  padding: 16px 0;
  border-bottom: 1px solid var(--rule);
}
.atx-msg:last-child { border-bottom: none; }
.atx-msg-user { background: linear-gradient(90deg, rgba(200,162,74,0.035), transparent 42%); }

.atx-msg-head {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding-top: 2px;
}
.atx-msg-who {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--accent);
}
.atx-msg-assistant .atx-msg-who { color: var(--muted); }
.atx-msg-n, .atx-msg-at {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.1em;
  color: var(--muted);
}
.atx-msg-n::before { content: "№ "; }

.atx-msg-body { min-width: 0; }
.atx-msg-text {
  font-size: 14px;
  line-height: 1.72;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  margin-bottom: 10px;
}
.atx-msg-text:last-child { margin-bottom: 0; }

.atx-msg-tool {
  border: 1px solid var(--rule);
  background: var(--code-bg);
  padding: 9px 11px;
  margin: 10px 0;
}
.atx-tool-error { border-color: var(--stamp-dim); }
.atx-tool-label {
  display: block;
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.14em;
  color: var(--muted);
  margin-bottom: 6px;
}
.atx-tool-error .atx-tool-label { color: var(--stamp); }
.atx-tool-body {
  margin: 0;
  font-family: var(--mono);
  font-size: 11.5px;
  line-height: 1.6;
  color: var(--fg);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  max-height: 320px;
  overflow-y: auto;
}
.atx-msg-notice {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  color: var(--stamp);
  margin: 8px 0;
}

@media (max-width: 720px) {
  .atx-msg { grid-template-columns: 1fr; gap: 8px; }
  .atx-msg-head { flex-direction: row; align-items: baseline; gap: 10px; }
}
