/* STYLE-1 (lane A3): the broker screens on MortgageComplete's green base --
   the tokens of onboard.css and sheet.css (portal/test/style1_props.py keeps
   the three :root blocks equal). Look only: no wording, field or order here. */
:root{--ground:#0B0F17;--accent:#2E7BF6;--accent-d:#1D5FD6;--accent-dd:#174CB0;--ink:#1A2130;--muted:#5A6375;
  --line:#E3E7EE;--soft:#EAF1FE;--err:#B3261E;--card:#fff;--page:#F4F6FA;--ok:#216030;--ok-soft:#EAF4EC;--warn:#8A5A00}
*{box-sizing:border-box}
html{background:var(--page)}
body{margin:0;min-height:100vh;background:var(--page);color:var(--ink);line-height:1.5;font-size:16px;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;accent-color:var(--accent)}
[hidden]{display:none!important}
a{color:var(--accent-d)}
.bar{background:var(--ground);color:#fff;padding:12px 16px}
.brand{color:#fff;font-weight:700;font-size:19px;letter-spacing:.2px}
.brand span{color:#2E7BF6}
.wrap{max-width:520px;margin:0 auto;padding:18px 16px 48px}
h1{font-size:24px;line-height:1.25;margin:8px 0 10px}
h2{font-size:17px;margin:0 0 10px}
h3{font-size:15px;margin-top:20px}
.wrap>section{background:var(--card);border-radius:16px;padding:20px 18px;margin:16px 0;
  box-shadow:0 1px 4px rgba(11,15,23,.10);border:1px solid var(--line)}
label{display:block;margin:14px 0 6px;font-size:14px;font-weight:600}
input{display:block;width:100%;padding:12px 13px;font:inherit;font-size:16px;color:var(--ink);background:#fff;
  border:1px solid var(--line);border-radius:10px;margin-top:6px;outline:none}
input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(46,123,246,.15)}
button{font:inherit;font-size:16px;font-weight:600;padding:12px 16px;border:0;border-radius:10px;background:var(--accent-d);
  color:#fff;margin:8px 8px 8px 0;cursor:pointer}
button:hover{background:var(--accent-dd)}
button:disabled{opacity:.6;cursor:default}
button.alt{background:#fff;color:var(--accent-d);border:1px solid var(--line);font-weight:500}
button.alt:hover{border-color:var(--accent);background:var(--soft)}
.msg{min-height:1.5em;color:var(--err)}
.progress{display:flex;gap:8px;padding:0;list-style:none;font-size:.85rem;color:var(--muted)}
.progress .on{color:var(--accent-d);font-weight:600}
.key{font-family:ui-monospace,Menlo,monospace;font-size:1.1rem;letter-spacing:.08em;word-break:break-all}
.codes{font-family:ui-monospace,Menlo,monospace}
.sugg{padding:0;list-style:none}
.sugg button{background:var(--soft);color:var(--accent-d);border:1px solid var(--line);font-weight:500}
.nav{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 16px;align-items:center}
.nav a{background:#fff;color:var(--accent-d);border:1px solid var(--line);border-radius:999px;padding:7px 13px;
  font-size:14px;font-weight:600;text-decoration:none}
.nav a:hover{border-color:var(--accent);background:var(--soft)}
.nav button{margin:0;padding:7px 13px;font-size:14px;border-radius:999px}
.soon{color:var(--muted);font-size:.9rem;padding:8px;border:1px dashed var(--line);border-radius:10px}
#payment-element{margin:12px 0}
.rec{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;background:#fff;border:1px solid var(--line);
  border-radius:10px;padding:12px}
.rec dt{color:var(--muted)}
.rec dd{margin:0}
details{margin:8px 0}
summary{cursor:pointer;color:var(--accent-d);font-weight:600}
.tog{display:flex;gap:8px;align-items:center;font-weight:500}
.tog input{width:auto;display:inline;margin:0}
.o-result{min-height:1.5em;font-weight:600}
.note{color:var(--muted);font-size:.9rem}
fieldset{border:1px solid var(--line);border-radius:10px;margin:12px 0}
legend{font-size:14px;font-weight:600;padding:0 4px}
.plain{list-style:none;padding:0}
.plain li{background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px;margin:8px 0}
.face-row{display:flex;gap:12px;align-items:center}
#ph-face,#ph-preview{border-radius:50%;object-fit:cover}
#ph-video{width:100%;max-width:320px;border-radius:12px}
section{margin:24px 0}
.tog input[type=checkbox]{width:auto}
/* CUSTOM-2 (lane A8): the "Your domain" section, on STYLE-1's tokens. */
.now{background:#fff;border:1px solid var(--line);border-radius:10px;padding:4px 12px}
.now h3{margin-top:8px}
.org-card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:4px 12px 12px;margin:16px 0}
.badge{display:inline-block;font-size:.8rem;font-weight:600;padding:1px 8px;border-radius:999px;background:var(--soft);
  color:var(--accent-d);margin-left:6px}
.rlist{list-style:none;padding:0;margin:0}
.rlist li{border-top:1px solid var(--line);padding:8px 0}
.rlist .rec{border:0;padding:4px 0;background:none}
.rlist .val{font-family:ui-monospace,Menlo,monospace;word-break:break-all}
.st{font-weight:600}
.st-found{color:var(--accent-d)}
.st-missing,.st-unchecked{color:#7a5b00}
.st-wrong{color:var(--err)}
.st-unavailable{color:var(--muted)}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
.brand{display:inline-flex;align-items:center;color:#fff;font-weight:600;font-size:20px;letter-spacing:0;line-height:1}
.brand .knot{width:30px;height:30px;margin-right:6px;flex:0 0 auto}
.brand span{color:var(--accent);font-weight:300;margin-left:.25em}
.st-found,.badge.ok{color:var(--ok)}
.badge.ok{background:var(--ok-soft)}
