/* Eris Intel: the page's look, moved out of the engine's static/intel.html <style> block at
   0de516d9 (pass E2) because Eris's CSP allows no inline style. Phone first; new rules use
   min-width queries only (.claude/rules/ui.md). The Eris additions are at the end. */
/* ReGenesis Intel — the standalone site keeps the legacy intel palette:
   near-black canvas, steel-blue accents, dense grids. Self-contained —
   never loads the game's style.css. */
* { box-sizing: border-box; }
body {
  margin: 0; background: #0a0a0a; color: #cfd8e3;
  font: 13px/1.5 Roboto, "Segoe UI", Helvetica, Arial, sans-serif;
}
a { color: #6da9d2; text-decoration: none; }
a:hover { color: #8fc3f0; }
.intel-topbar {
  display: flex; align-items: center; gap: 1rem; flex-wrap: wrap;
  padding: 0.55rem 1.1rem; background: #161b22;
  border-bottom: 2px solid #266798;
}
.intel-brand { font-size: 1.15rem; letter-spacing: 0.05em; color: #B0BECF; }
.intel-brand b { color: #6da9d2; }
.intel-server {
  display: inline-block; margin-left: 8px; padding: 2px 8px; border: 1px solid #266798;
  border-radius: 999px; font-size: 0.72rem; letter-spacing: 0.04em; color: #B0BECF;
  vertical-align: middle; white-space: nowrap;
}
.intel-topbar form { display: flex; gap: 6px; align-items: center; }
.intel-topbar input {
  width: 5.5em; background: #0d1117; color: #cfd8e3;
  border: 1px solid #266798; border-radius: 3px; padding: 4px 8px; font: inherit;
  font-size: 16px;   /* phone-first rule: below 16px iOS zooms the page on focus */
}
.intel-topbar button {
  background: #1b2733; color: #6da9d2; border: 1px solid #266798;
  border-radius: 3px; padding: 4px 12px; font: inherit; cursor: pointer;
}
.intel-topbar button:hover { background: #266798; color: #fff; }
.intel-back { margin-left: auto; }
main { max-width: 1200px; margin: 1rem auto 3rem; padding: 0 1rem; }
.intel-panel {
  background: #121212; border: 1px solid #266798; border-radius: 4px;
  padding: 0.9rem 1.1rem; margin-bottom: 1rem;
}
.intel-panel h2 { margin: 0 0 0.4rem; font-size: 1.05rem; color: #B0BECF; }
.intel-meta { color: #7d8896; font-size: 0.9em; margin: 4px 0; }
.intel-error {
  background: #4a1414; color: #ffcdd2; border-radius: 4px;
  padding: 0.5rem 0.9rem; margin-bottom: 0.8rem;
}
.intel-scroll { overflow-x: auto; }
table.intel-grid {
  width: 100%; border-collapse: collapse; font-size: 12px; white-space: nowrap;
}
table.intel-grid th {
  position: sticky; top: 0; cursor: pointer; text-align: right;
  padding: 3px 7px; color: #B0BECF; background: #121212;
  border-bottom: 1px solid #266798;
}
table.intel-grid th:nth-child(2), table.intel-grid td:nth-child(2) { text-align: left; }
table.intel-grid td {
  text-align: right; padding: 2px 7px; border-bottom: 1px solid #1c1c1c;
}
table.intel-grid tr:hover td { background: #1e2a33; }
table.intel-grid th.sorted-asc::after { content: " \25B4"; }
table.intel-grid th.sorted-desc::after { content: " \25BE"; }
table.intel-grid td.dim, .dim { color: rgba(255, 255, 255, 0.35); }
.ig-slot { color: #7d8896; font-size: 0.85em; }
.intel-tabs { display: flex; gap: 2px; flex-wrap: wrap; margin: 4px 0 8px; }
.intel-tabs a {
  padding: 3px 10px; font-size: 12px; text-transform: uppercase;
  letter-spacing: 0.05em; color: #7d8896; border-bottom: 2px solid transparent;
}
.intel-tabs a.active { color: #6da9d2; border-bottom-color: #266798; }
.intel-age {
  display: inline-block; min-width: 30px; text-align: center; font-size: 11px;
  border-radius: 9px; padding: 0 6px;
}
.intel-age.fresh { background: #1b5e20; color: #c8e6c9; }
.intel-age.ok { background: #7a5c00; color: #ffe082; }
.intel-age.stale { background: #7f1d1d; color: #ffcdd2; }
.intel-age.none { background: #2c2c2c; color: rgba(255, 255, 255, 0.35); }
/* the province page's kv cards + banner */
.intel-cards { display: flex; flex-wrap: wrap; gap: 0.8rem; }
.intel-card {
  flex: 1 1 260px; background: #0f1319; border: 1px solid #1f2b38;
  border-radius: 4px; padding: 0.5rem 0.8rem;
}
.intel-card h4 { margin: 0 0 0.3rem; color: #B0BECF; font-size: 0.9rem; }
table.intel-kv { width: 100%; border-collapse: collapse; font-size: 12px; }
table.intel-kv th {
  text-align: left; color: #7d8896; font-weight: normal; padding: 1px 8px 1px 0;
  white-space: nowrap;
}
table.intel-kv td { text-align: right; padding: 1px 0; }
.active-spells-banner {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  border: 1px solid #4caf50; background: rgba(76, 175, 80, 0.08);
  border-radius: 8px; padding: 0.5rem 0.9rem; margin-bottom: 0.8rem;
  color: #c8e6c9;
}
.active-spells-banner .asb-label { font-weight: 600; }
.spell-chip {
  display: inline-flex; align-items: center; gap: 6px;
  background: rgba(76, 175, 80, 0.14); border: 1px solid #4caf50;
  border-radius: 12px; padding: 1px 10px; font-size: 12px; color: #c8e6c9;
}
.spell-chip::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: #4caf50; display: inline-block; flex: none;
}
.spell-chip .rem { color: #FDE89A; }
.spell-chip .by { color: rgba(255, 255, 255, 0.55); }
/* province header: a prominent name over a muted stat strip */
.intel-phead { margin: 0 0 4px; }
.intel-phead .name {
  font-size: 1.25rem; font-weight: 600; color: #cfd8e3;
  letter-spacing: 0.02em;
}
.intel-statstrip { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 4px; }
.intel-stat {
  font-size: 11px; color: #B0BECF; background: #161b22;
  border: 1px solid #23303d; border-radius: 4px; padding: 1px 8px;
}
.intel-stat b { color: #cfd8e3; font-weight: 600; }
/* the "gathered N ago" line — the age pill sits inline with the copy */
.intel-gathered .intel-age { margin: 0 2px; }
/* a freshness pill rides each snapshot tab label */
.intel-tabs a .intel-age { margin-left: 6px; vertical-align: middle; }
/* confidence badge — banded on the same green/amber/red scale as freshness */
.intel-conf {
  display: inline-block; min-width: 30px; text-align: center; font-size: 11px;
  border-radius: 9px; padding: 0 6px; margin-left: 4px; vertical-align: middle;
}
.intel-conf.hi  { background: #1b5e20; color: #c8e6c9; }
.intel-conf.mid { background: #7a5c00; color: #ffe082; }
.intel-conf.lo  { background: #7f1d1d; color: #ffcdd2; }
/* 2026-10-29: the grid's view switch, the intel-age filter, the Total / Avg footer, the
   Spells & Ops text cells, and the Home / Enemy / bookmark and previous / next buttons;
   every button thumb-sized (2.75rem) for a phone */
.ig-switch, .ig-within, .intel-nav {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 4px 0 8px;
}
.ig-chip, .intel-nav a {
  display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0 12px;
  background: #1b2733; color: #6da9d2; border: 1px solid #266798; border-radius: 3px;
  font: inherit; cursor: pointer;
}
.ig-chip.active, .intel-nav a.active { background: #266798; color: #fff; }
table.intel-grid tfoot td { border-top: 1px solid #266798; color: #B0BECF; font-weight: 600; }
table.intel-grid td.ig-text { text-align: left; white-space: normal; min-width: 12rem; }
table.intel-grid th.ig-left { text-align: left; }
.ig-of { color: #7d8896; font-weight: normal; }

/* --- Eris (pass E2) --- */
[hidden] { display: none !important; }
.intel-topbar a { min-height: 2.75rem; display: inline-flex; align-items: center; }
.intel-notice {
  background: #2a2410; color: #ffe082; border: 1px solid #7a5c00; border-radius: 4px;
  padding: 0.6rem 0.9rem; margin-bottom: 0.8rem;
}
.intel-notice a { color: #ffe082; text-decoration: underline; }
.intel-heard { color: #7d8896; font-size: 0.9em; margin: 0 0 0.6rem; }
.ig-asof { display: block; color: #ffe082; font-size: 0.8em; }
.intel-asof { color: #ffe082; }
.intel-go { margin: 0.6rem 0 0; }
.intel-go button {
  min-height: 2.75rem; padding: 0 14px; font: inherit; cursor: pointer;
  background: #1b2733; color: #6da9d2; border: 1px solid #266798; border-radius: 3px;
}
.intel-go button:hover { background: #266798; color: #fff; }
ul.intel-games { list-style: none; padding: 0; margin: 0.6rem 0 0; display: flex; flex-wrap: wrap; gap: 8px; }
ul.intel-games a {
  display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0 14px;
  background: #1b2733; color: #6da9d2; border: 1px solid #266798; border-radius: 3px;
}

/* --- Eris (pass E8): the K:I loader at thumb size, the empty state of a kingdom not gathered on --- */
.intel-topbar form input, .intel-topbar form button { min-height: 2.75rem; }
.intel-empty { margin: 0.6rem 0; }

/* --- Eris (pass E9): the bar's bookmarks wrap inside a phone's width; the star and a message's
   close control at thumb size --- */
.intel-nav a { max-width: 100%; overflow-wrap: anywhere; }
.intel-starline { margin: 0.2rem 0 0.4rem; }
.intel-star, .intel-close {
  min-height: 2.75rem; min-width: 2.75rem; padding: 0 12px; font: inherit; cursor: pointer;
  background: #1b2733; color: #6da9d2; border: 1px solid #266798; border-radius: 3px;
}
.intel-star.on { background: #266798; color: #fff; }
.intel-msg { display: flex; align-items: center; gap: 8px; }
.intel-msg span { flex: 1; }
.intel-close { background: transparent; color: #ffcdd2; border-color: #7f1d1d; }