/* vault.css — Formula Vault layer over the reference console design.
 * Load order (index.html): fonts → rac-console.css (the reference Admin/Agent design layer,
 * vendored verbatim; identical copy in web/ui-contract/ and web-platform/) → alembic-tokens.css
 * (the ALEMBIC contract, wins on shared custom properties) → this file. The shell is the
 * reference's, 1:1. Allowed differences are SECURITY CONTEXT only (P0_UI_PARITY_PUBLIC_GREEN_
 * ADDENDUM.md §7): the .secure-banner and .reveal-panel rules below have no reference
 * equivalent because the reference has no secure-zone concept. No dark mode. */

/* ── reference corrections (same as web/ui-contract/shell.css) ─────────────────────────────── */
.rs,.ri .ct,.rme .who small,.brandmark.on-ink .bt small{color:#BDBDB6}
.bar-brand i{color:var(--ink-3);opacity:1}
.rail{position:relative}
@media (max-width:1023px){
  .qdock .qb:not(.hot){display:none !important}
  .qdock .dk-navtoggle{display:flex !important}
  body.rail-open .rail{display:flex !important;position:fixed;z-index:560;top:0;bottom:0;left:0;
    width:min(86vw,var(--ch-rail-width));margin:0;border-radius:0 26px 26px 0;visibility:visible;pointer-events:auto;
    box-shadow:26px 0 64px -16px rgba(10,10,10,.36)}
  body.rail-open .rail-scrim{display:block}
  body.rail-off .qdock .qb .kb .kc,body .qdock .qb .kb .kc{display:none !important}
}
.rail-scrim{display:none;position:fixed;inset:0;z-index:555;background:rgba(20,20,19,.34)}
.qdock .qd-brand{background:none;border:0;padding:0 10px 0 4px;cursor:pointer}
@media (pointer:coarse){ .btn,.ri,.pg button,.xp,.gbtn,.qdock .qb{min-height:var(--ch-touch-floor-coarse-pointer)} .xp{min-width:var(--ch-touch-floor-coarse-pointer)} input,select,textarea{font-size:16px !important} }
@media (max-width:900px){ .btn.p{min-height:var(--ch-touch-floor-coarse-pointer)} }
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;animation-delay:0s !important;transition:none !important;scroll-behavior:auto !important}
}

/* ── cards: the reference .card is an unpadded glass panel whose .card-hd and table cells carry
 *    the 30px gutter; everything else a screen puts in a card sits on that same gutter. ───── */
.card{margin-bottom:var(--gr-gap);padding-bottom:var(--pad-card-btm)}
.card > :not(.card-hd):not(table):not(.empty){margin-left:var(--pad-card);margin-right:var(--pad-card)}
.card > table{min-width:0}
.card-hd{align-items:center}
.card-hd .spacer{flex:1}
th.r,td.r{text-align:right}
td.mono,.mono{font-family:var(--mono);font-size:var(--t-cap)}
.card-note{color:var(--ink-3);margin:0 var(--pad-card) var(--s-snug)}
.err{color:var(--red);font:var(--w-reg) var(--t-cap)/var(--lh-cap) var(--ui)}
.skl{display:block;height:14px;width:120px;margin:var(--pad-card-top) var(--pad-card) 0}
.notbuilt{padding:var(--pad-card-top) var(--pad-card) var(--pad-card-btm);max-width:640px}
.notbuilt > *{margin-left:0 !important;margin-right:0 !important}
.notbuilt h2{font:var(--w-med) var(--t-h2)/var(--lh-h2) var(--ui);margin:0 0 var(--s-tight)}
.notbuilt p{font:var(--w-reg) var(--t-body)/var(--lh-body) var(--ui);color:var(--ink-2);margin:0}
.notbuilt .needs{margin-top:var(--s-tight);padding:var(--s-tight) var(--s-snug);background:var(--panel-2);border-radius:var(--r-sm);font:var(--w-reg) var(--t-cap)/1.4 var(--mono);color:var(--ink-2)}

/* ── forms inside the reference sheet ─────────────────────────────────────────────────────── */
.xp-sheet .xp-sheet-hd h2{flex:1;min-width:0}
.xp-sheet-bd .sub{font:var(--w-med) var(--t-cap)/1.3 var(--ui);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
label.field{display:flex;flex-direction:column;gap:5px;margin-bottom:var(--s-snug)}
label.field > span.lbl{font:var(--w-med) var(--t-cap)/1 var(--ui);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
label.field textarea{min-height:64px;padding:var(--s-tight) 10px;border-radius:6px;border:1px solid var(--line-2);resize:vertical;font:inherit;background:var(--panel)}
.fld::placeholder{color:var(--ink-3)}
@media (max-width:767px){ .xp-sheet{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0;padding:var(--s-base)} }

/* ── toast tones on the reference's dark pill ─────────────────────────────────────────────── */
.toast.bad .d{background:#9A6A5C}

/* ── phone tables: rows become label/value stacks ─────────────────────────────────────────── */
@media (max-width:767px){
  .card table,.card thead,.card tbody,.card tr{display:block;width:100%}
  body .card > table{min-width:0 !important}
  .card thead{display:none}
  .card tbody tr{border-bottom:1px solid var(--line);padding:var(--s-tight) var(--pad-card)}
  .card tbody td{display:flex;justify-content:space-between;gap:var(--s-tight);border-bottom:none;padding:2px 0}
  .card tbody td::before{content:attr(data-label);font-weight:var(--w-med);color:var(--ink-3)}
}

/* ── sign-in (UX-C): the one sign-in card of all three RawProd consoles ──────────────────── */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--rail);padding:var(--s-base)}
.login-card{width:min(380px,100%);background:var(--panel);border-radius:var(--r-xl);padding:var(--pad-region) var(--pad-card)}
.login-card .mark{font:var(--w-med) var(--t-fig-sm)/var(--lh-fig-sm) var(--ui);letter-spacing:var(--ls-tight);color:var(--ink);margin:0 0 var(--s-tight)}
.login-card .sub{font:var(--w-reg) var(--t-body)/var(--lh-body) var(--ui);color:var(--ink-3);margin:0 0 var(--s-base)}
.login-card .btn{width:100%;justify-content:center;min-height:var(--ch-touch-floor-coarse-pointer);font-size:var(--t-body);text-decoration:none}
.login-card .btn[aria-disabled="true"]{opacity:.5;pointer-events:none}
.login-card .err{margin-top:var(--s-snug)}
.login-card .err:empty{display:none}

/* ── command palette (dock ⌘K) ────────────────────────────────────────────────────────────── */
.cmdk{position:fixed;z-index:620;left:50%;top:14vh;transform:translateX(-50%);width:min(560px,calc(100vw - 32px));display:flex;flex-direction:column;padding:var(--s-snug)}
.cmdk input{height:44px;border:0;outline:none;border-radius:var(--r-md);padding:0 var(--s-snug);background:rgba(255,255,255,.8);box-shadow:0 0 0 .5px var(--gl-hair);font:var(--w-reg) var(--t-h3)/1 var(--ui);color:var(--ink)}
.cmdk ul{list-style:none;margin:var(--s-tight) 0 0;padding:0;max-height:50vh;overflow-y:auto}
.cmdk li button{width:100%;display:flex;align-items:center;gap:var(--s-snug);padding:10px 12px;border-radius:10px;font:var(--w-reg) var(--t-body)/1.2 var(--ui);color:var(--ink);text-align:left}
.cmdk li button svg{width:15px;height:15px;color:var(--ink-3)}
.cmdk li button.on,.cmdk li button:hover{background:var(--accent-soft)}
.cmdk li button .sc{margin-left:auto;font:var(--w-reg) var(--t-micro)/1 var(--mono);color:var(--ink-3)}

/* ── secure zone (§109.4 — the one allowed departure from the reference) ─────────────────── */
.secure-banner{display:flex;align-items:center;gap:var(--s-tight);flex-wrap:wrap;background:var(--rail);color:#EDEDEA;padding:var(--s-tight) var(--s-base);margin:12px 12px 0;border-radius:var(--r-lg);font:var(--w-med) var(--t-cap)/1.3 var(--ui);letter-spacing:.02em}
.secure-banner .dot{width:7px;height:7px;border-radius:var(--r-pill);background:var(--accent);flex:none}
.secure-banner .who-when{margin-left:auto;color:#BDBDB6;font:var(--w-reg) var(--t-cap)/1.3 var(--mono)}
.reveal-panel{border:2px solid var(--red);border-radius:var(--r-md);padding:var(--s-snug);background:rgba(138,90,76,.06);margin-top:var(--s-snug)}
.reveal-panel .hd{display:flex;align-items:center;gap:var(--s-tight);margin-bottom:var(--s-tight);font:var(--w-med) var(--t-cap)/1 var(--ui);color:var(--red)}
.reveal-panel table{min-width:0}
tbody tr[tabindex],tbody tr.go{cursor:pointer}
