/* The apex holds the canonical token set and declares it inline; this is the
   catalogue's copy of the same values, measured contrast and all. Two files
   because they are two deployables (REQ-0040) — a shared stylesheet would tie
   the splash's deploy to this one, which is the coupling that decision refuses. */
:root{
  --ink:#0E1014;
  --ink-raised:#161A20;
  --rhodium:#DDE2E7;      /* 14.60 on ink · 13.39 on raised */
  --rhodium-dim:#A8B1B9;  /*  8.75          ·  8.03 */
  --patina:#7B858E;       /*  5.07          ·  4.65 */
  --intent:#E8A33D;       /*  8.83          ·  8.10 */
  --hairline:#242A32;
  --edge:#5E6773;
  --panel-shadow:rgba(0,0,0,.55);

  --display:'Archivo',system-ui,sans-serif;
  --body:'Source Serif 4',Georgia,serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;

  --gutter:clamp(1.25rem,5vw,4rem);
  color-scheme:dark;
}

:root[data-theme="light"]{
  --ink:#F2F4F7;
  --ink-raised:#FFFFFF;
  --rhodium:#11151A;      /* 16.63 on ink · 18.32 on raised */
  --rhodium-dim:#39424C;  /*  9.26        · 10.21 */
  --patina:#5B646E;       /*  5.46        ·  6.01 */
  --intent:#8A5A00;       /*  5.38        ·  5.93 */
  --hairline:#DFE3E8;
  --edge:#7C858E;
  --panel-shadow:rgba(15,23,32,.16);
  color-scheme:light;
}

:root.theme-switching *,
:root.theme-switching *::before,
:root.theme-switching *::after{ transition:none !important; }

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}

body{
  background:var(--ink);
  color:var(--rhodium);
  font-family:var(--body);
  font-weight:300;
  font-size:clamp(1rem,.95rem + .25vw,1.125rem);
  line-height:1.6;
  padding:0 var(--gutter) 5rem;
}

.visually-hidden{
  position:absolute;width:1px;height:1px;overflow:hidden;
  clip-path:inset(50%);white-space:nowrap;
}

a{color:inherit}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{
  outline:2px solid var(--intent);outline-offset:3px;
}

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

.masthead{
  display:flex;align-items:baseline;gap:.75rem;
  max-width:62rem;margin:0 auto;
  padding:1.75rem 0 2.5rem;
}
.wordmark{
  font-family:var(--display);font-weight:600;font-size:1.25rem;
  letter-spacing:.02em;text-decoration:none;
}
.wordmark sup{font-size:.6em}
.here{
  font-family:var(--mono);font-size:.8rem;color:var(--patina);
  text-transform:lowercase;letter-spacing:.06em;
}
#theme{
  margin-left:auto;background:none;border:1px solid var(--edge);
  color:var(--rhodium-dim);border-radius:999px;
  width:2.25rem;height:2.25rem;font-size:1rem;cursor:pointer;
  transition:color .15s,border-color .15s;
}
#theme:hover{color:var(--rhodium);border-color:var(--rhodium-dim)}

/* ---- page furniture ---- */

main{max-width:62rem;margin:0 auto}

h1{
  font-family:var(--display);font-weight:600;
  font-size:clamp(1.75rem,1.3rem + 2vw,2.75rem);
  line-height:1.15;letter-spacing:-.01em;
}
.lede{
  color:var(--rhodium-dim);max-width:44rem;margin-top:1rem;
}
.lede code{font-family:var(--mono);font-size:.85em;color:var(--intent)}

.notice{
  margin-top:2rem;padding:1rem 1.25rem;max-width:52rem;
  background:var(--ink-raised);border-left:3px solid var(--intent);
  border-radius:0 6px 6px 0;
  font-size:.95rem;color:var(--rhodium-dim);
}
.notice strong{color:var(--rhodium);font-weight:400}

.controls{
  display:flex;align-items:baseline;gap:1rem;flex-wrap:wrap;
  margin:2.5rem 0 1.25rem;
}
#q{
  flex:1 1 22rem;
  background:var(--ink-raised);color:var(--rhodium);
  border:1px solid var(--edge);border-radius:6px;
  padding:.6rem .85rem;font:inherit;font-size:.95rem;
}
#q::placeholder{color:var(--patina)}
.count{font-family:var(--mono);font-size:.75rem;color:var(--patina)}

.empty,.failed{
  margin-top:2rem;color:var(--rhodium-dim);max-width:44rem;
}

/* ---- entries ---- */

.entries{list-style:none;display:grid;gap:1rem}

.entry{
  background:var(--ink-raised);
  border:1px solid var(--hairline);border-radius:10px;
  padding:1.25rem 1.4rem;
  box-shadow:0 1px 2px var(--panel-shadow);
}

.entry-head{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}
.entry h2{
  font-family:var(--display);font-weight:500;font-size:1.05rem;
  letter-spacing:-.005em;
}
.entry h2 a{text-decoration-color:var(--patina);text-underline-offset:3px}

.badge{
  font-family:var(--mono);font-size:.65rem;letter-spacing:.08em;
  text-transform:uppercase;padding:.15rem .5rem;border-radius:999px;
  border:1px solid var(--intent);color:var(--intent);
}

.summary{color:var(--rhodium-dim);font-size:.95rem;margin-top:.5rem;max-width:48rem}

.facts{
  display:flex;flex-wrap:wrap;gap:.35rem 1.75rem;margin-top:.9rem;
  font-family:var(--mono);font-size:.75rem;
}
.facts dt{color:var(--patina);display:inline}
.facts dt::after{content:' '}
.facts dd{display:inline;color:var(--rhodium-dim)}
.facts > div{display:inline}

.registers{
  margin-top:.6rem;font-family:var(--mono);font-size:.72rem;color:var(--patina);
}

details{margin-top:.9rem}
summary{
  font-family:var(--mono);font-size:.72rem;color:var(--patina);
  cursor:pointer;letter-spacing:.04em;
}
summary:hover{color:var(--rhodium-dim)}
.compose{
  margin-top:.6rem;padding:.85rem 1rem;overflow-x:auto;
  background:var(--ink);border:1px solid var(--hairline);border-radius:6px;
  font-family:var(--mono);font-size:.75rem;line-height:1.7;color:var(--rhodium-dim);
}
.editions{
  margin-top:.5rem;font-family:var(--mono);font-size:.7rem;color:var(--patina);
}

footer{
  max-width:62rem;margin:4rem auto 0;padding-top:1.5rem;
  border-top:1px solid var(--hairline);
  font-size:.8rem;color:var(--patina);
}