/* THE ONE Review-before-calling modal — shared skin.
   ------------------------------------------------
   RESOLVE-AUTHZ-PHONE-COUNTS 2026-08-18 (P1-4) reported the cost of having two of these:
   "the phone gate had to be written twice, the 403 wording had to be written twice, and the
   disabled-button treatment had to be fixed twice. They can drift and have."

   This file is the CSS half of the collapse. lib/resolve-review.js owns the markup; the board
   (pages/10-resolve.html), the customer sheet (components/lifecycle-panel.js) and the operator
   dock (via lib/resolve-governor.js) all mount THAT component, so there is one anatomy and one
   skin whichever door the operator came through.

   design-token-layout-consolidation 2026-08-26: the token names are now the CANONICAL ones
   (four phantom tokens — --overlay-bg, --border-strong, --accent-contrast and page-local
   --accent-bg misuse — always rendered their literals because the token never existed), and
   every fallback is the dark-theme token TRUTH from tokens/tokens.css, not an approximation.
   Fallbacks only render on a surface that loads this without tokens.css; on every shipped
   page the token wins, so this correction changes nothing rendered. */
.orr-veil{position:fixed;inset:0;background:var(--surface-modal-overlay,rgba(10,11,15,.75));display:none;
  align-items:center;justify-content:center;z-index:2147483100;padding:var(--space-lg,24px)}
.orr-veil.orr-open{display:flex}
.orr-modal{background:var(--surface-modal-bg,#1A1D24);
  color:var(--text,#F1F5F9);border:1px solid var(--color-border-strong,rgba(255,255,255,.18));
  border-radius:var(--radius-lg,12px);box-shadow:var(--shadow-lg,0 10px 30px rgba(0,0,0,.6));
  width:min(460px,94vw);max-height:90vh;overflow-y:auto;padding:var(--space-lg,24px);
  font-family:inherit;box-sizing:border-box}
.orr-modal h2{margin:0 0 var(--space-xs,8px);font-size:var(--text-lg,20px);font-weight:var(--fw-semibold,600)}
.orr-modal .orr-sub{margin:0 0 var(--space-md,16px);font-size:var(--text-sm,13px);
  color:var(--text-secondary,#94A3B8)}
/* THE PRE-FLIGHT SENTENCE (2026-08-26). Body-size and full-contrast, not the muted sub-line it
   replaced: this is the one line stating that a real person is about to be phoned, and the
   operator must not be able to skim past it on the way to the button. */
.orr-modal .orr-preflight{margin:0 0 var(--space-md,16px);font-size:var(--text-base,14px);
  line-height:1.5;color:var(--text,#F1F5F9)}
.orr-modal .orr-preflight b{font-family:var(--font-mono,ui-monospace,monospace);font-weight:600}
/* the opener, quoted verbatim from the composer */
.orr-kv .orr-v.orr-quote{font-style:italic;color:var(--text-secondary,#94A3B8);line-height:1.5}
.orr-kv .orr-v.orr-quote .orr-meta{font-style:normal}
/* the explicit acknowledgement that unlocks the primary */
.orr-ack{display:flex;gap:var(--space-sm,12px);align-items:flex-start;
  margin:var(--space-md,16px) 0 0;font-size:var(--text-sm,13px);line-height:1.5;
  color:var(--text,#F1F5F9);cursor:pointer}
.orr-ack input{margin:2px 0 0;flex-shrink:0;width:16px;height:16px;
  accent-color:var(--accent,#98E2C7);cursor:pointer}
.orr-ack input:focus-visible{outline:2px solid var(--accent,#98E2C7);outline-offset:2px}
.orr-kv{display:grid;grid-template-columns:130px 1fr;gap:6px var(--space-md,16px);
  font-size:var(--text-sm,13px);margin:var(--space-sm,12px) 0}
.orr-kv .orr-k{font-family:var(--font-mono,ui-monospace,monospace);font-size:var(--text-2xs,11px);
  letter-spacing:var(--ls-wider,.08em);text-transform:uppercase;color:var(--text-tertiary,#64748B);padding-top:3px}
.orr-kv .orr-v{color:var(--text,#F1F5F9);overflow-wrap:anywhere}
.orr-kv .orr-v .orr-meta{display:block;color:var(--text-tertiary,#64748B);font-size:var(--text-xs,11px);margin-top:2px}
.orr-kv .orr-v .orr-meta-inline{color:var(--text-tertiary,#64748B)}
.orr-tag{display:inline-block;font-family:var(--font-mono,ui-monospace,monospace);
  font-size:var(--text-2xs,11px);letter-spacing:.06em;text-transform:uppercase;border-radius:var(--radius-pill,999px);
  padding:0 6px;color:var(--warn,#E6FF9A);margin-left:4px}
.orr-lbl{display:block;font-family:var(--font-mono,ui-monospace,monospace);font-size:var(--text-2xs,11px);
  letter-spacing:var(--ls-wider,.08em);text-transform:uppercase;color:var(--text-tertiary,#64748B);
  margin:var(--space-md,16px) 0 var(--space-xs,8px)}
.orr-note{width:100%;min-height:64px;resize:vertical;font:inherit;font-size:var(--text-sm,13px);
  color:var(--text,#F1F5F9);background:var(--glass-bg,rgba(255,255,255,.03));
  border:1px solid var(--border,rgba(255,255,255,.1));border-radius:var(--radius-md,8px);
  padding:var(--space-sm,12px) var(--space-md,16px);box-sizing:border-box}
.orr-note::placeholder{color:var(--text-tertiary,#64748B)}
.orr-err{display:none;color:var(--danger,#F588FD);font-size:var(--text-xs,11px);margin-top:var(--space-xs,8px)}
.orr-actions{display:flex;justify-content:flex-end;gap:var(--space-sm,12px);margin-top:var(--space-md,16px)}
/* Primary: accent-soft fill + accent border, PAGE text ink (the live appearance —
   the retired --accent-contrast phantom always rendered its #fff literal, which on
   the dark theme is what var(--text) resolves to; light theme now gets legible ink
   instead of white-on-white). */
.orr-btn{font:inherit;cursor:pointer;padding:6px 14px;border-radius:var(--radius-pill,999px);
  border:1px solid var(--accent,#98E2C7);background:var(--accent-bg,rgba(152,226,199,.08));
  color:var(--text,#F1F5F9);font-weight:var(--fw-semibold,600)}
.orr-btn-secondary{border:1px solid var(--border,rgba(255,255,255,.1));
  background:var(--glass-bg,transparent);color:var(--text,#F1F5F9);font-weight:var(--fw-medium,500)}
/* P1-4: a DISABLED primary must stop looking like the primary. At .5/.55 opacity the accent
   fill still read as the live CTA, so the modal appeared to offer two usable buttons and the
   eye went to the one that does nothing. Neutralised, exactly one control is actionable. */
.orr-btn[disabled]{opacity:1;background:transparent;border-color:var(--border,rgba(255,255,255,.1));
  color:var(--text-tertiary,#64748B);font-weight:var(--fw-medium,500);cursor:default}