/* ============================================================
   Open Property Tax · base styles
   Token aliases + global resets + shared brand components.
   ============================================================ */

:root {
  /* Mirror canonical --opt-* tokens to short names (matches design refs). */
  --ink:     var(--opt-ink);
  --ink-2:   var(--opt-ink-2);
  --ink-3:   var(--opt-ink-3);
  --paper:   var(--opt-paper);
  --paper-2: var(--opt-paper-2);
  --brand:   var(--opt-brand);
  --brand-2: var(--opt-brand-2);
  --accent:  var(--opt-accent);
  --hi:      var(--opt-highlight);
  --rule:    var(--opt-rule);
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--paper-2);
  color: var(--ink);
  font-family: var(--opt-font-body);
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; }
button { font-family: inherit; }

/* ---------- brand lockup (shared, every page) ---------- */
.lockup {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  color: inherit;
  min-width: 0;
}
.lockup__mark {
  width: 34px;
  height: 34px;
  border: 1.5px solid var(--ink);
  border-radius: 8px;
  background: var(--paper);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.lockup__mark svg { width: 22px; height: 22px; display: block; }
.lockup__text { display: inline-flex; flex-direction: column; min-width: 0; }
.lockup__wm {
  font-family: var(--opt-font-display);
  font-weight: 600;
  font-size: 19px;
  letter-spacing: -0.01em;
  line-height: 1;
  white-space: nowrap;
  font-variation-settings: "opsz" 144, "SOFT" 30;
}
.lockup__by {
  font-family: var(--opt-font-mono);
  font-size: 10px;
  color: var(--ink-2);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-top: 5px;
}
.lockup__by b { color: var(--ink); font-weight: 500; }

.lockup__pill {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 7px;
  border-radius: 4px;
  background: var(--brand);
  color: var(--paper);
  font-family: var(--opt-font-mono);
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  vertical-align: 2px;
}
.lockup__pill--live {
  background: var(--ink);
}

.lockup--compact .lockup__mark { width: 28px; height: 28px; border-width: 1.4px; border-radius: 7px; }
.lockup--compact .lockup__mark svg { width: 18px; height: 18px; }
.lockup--compact .lockup__wm { font-size: 15px; font-weight: 600; }

/* ---------- beta help banner (shared, top-of-page) ---------- */
.beta-help-banner {
  background: var(--paper);
  border-bottom: 1px solid var(--rule);
  padding: 10px 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
  font-size: 13px;
  line-height: 1.4;
  color: var(--ink-2);
}
.beta-help-banner__pill {
  font-family: var(--opt-font-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  background: var(--brand);
  color: var(--paper);
  padding: 3px 9px;
  border-radius: 999px;
  font-weight: 600;
  flex-shrink: 0;
}
.beta-help-banner__msg { text-align: center; }
.beta-help-banner__msg a {
  color: var(--brand);
  text-decoration: none;
  font-weight: 600;
  white-space: nowrap;
}
.beta-help-banner__msg a:hover { text-decoration: underline; }
.beta-help-banner__msg a:active { opacity: 0.7; }

/* ---------- footstrip (shared) ---------- */
.footstrip {
  margin-top: 64px;
  padding-top: 20px;
  border-top: 1px solid var(--rule);
  display: flex;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
  font-family: var(--opt-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-3);
}
.footstrip b { color: var(--ink-2); font-weight: 500; }
.footstrip__soft { color: var(--ink-3); }
.footstrip__sig {
  flex-basis: 100%;
  margin: 14px 0 0 0;
  text-align: right;
  color: var(--ink-3);
}
.footstrip__sig em {
  font-style: italic;
  color: var(--brand);
  font-weight: 600;
}

/* ---------- mono label / kicker ---------- */
.kicker {
  font-family: var(--opt-font-mono);
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-2);
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.kicker .dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--brand);
  display: inline-block;
}

/* utility */
.visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0);
  white-space: nowrap; border: 0;
}

/* Operator-override indicator. Surfaced inline next to any AI value
   that an operator has manually corrected — cache.js stamps the AI
   response with `_overridden:true` + `_override_reason` when an
   ai_overrides row exists. Hover for the reason. */
.ai-reviewed {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 8px;
  padding: 2px 8px 2px 7px;
  border-radius: 999px;
  background: rgba(10, 92, 74, 0.08);
  color: var(--brand);
  border: 1px solid rgba(10, 92, 74, 0.28);
  font-family: 'IBM Plex Mono', monospace;
  font-style: normal;          /* chip may sit inside <em> on /intent/evidence */
  font-size: 9.5px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  line-height: 1.4;
  cursor: help;
  vertical-align: middle;
  white-space: nowrap;
}
.ai-reviewed::before {
  content: '\2713';
  font-size: 11px;
  line-height: 1;
}