/* ============================================================
   The Moore Group Home Portal — Apple-inspired system palette
   Familiar split map + results, top filter bar, left rail.
   Rebrand via the :root variables.
   ============================================================ */
:root{
  --brand:#0071e3;            /* restrained system blue */
  --brand-700:#0058b0;
  --brand-50:#f0f7ff;
  --accent:#bf8b4b;           /* small Moore Group warmth only */
  --ink:#1d1d1f;
  --muted:#6e6e73;
  --line:#d2d2d7;
  --bg:#f5f5f7;
  --love:#ff375f;
  --maybe:#ff9f0a;
  --no:#8e8e93;
  --ok:#248a3d;
  --shadow:0 1px 2px rgba(0,0,0,.04),0 8px 24px rgba(0,0,0,.06);
  --shadow-lg:0 18px 50px rgba(0,0,0,.18);
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --rail:64px;
  color-scheme:light;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;height:100%}
body{font-family:var(--font);color:var(--ink);background:#fff;line-height:1.45}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font-family:inherit;cursor:pointer}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(0,113,227,.32);outline-offset:2px}
.hidden{display:none !important}

/* ---------- App shell ---------- */
.layout{display:flex;height:100vh;overflow:hidden}

/* Left icon rail */
.rail{width:var(--rail);min-width:var(--rail);background:#fff;border-right:1px solid var(--line);
  display:flex;flex-direction:column;align-items:center;padding:10px 0 58px;gap:4px;z-index:30;overflow-y:auto}
.rail .mark{width:40px;height:40px;border-radius:10px;background:var(--brand);color:#fff;
  display:grid;place-items:center;font-weight:800;font-size:20px;margin-bottom:10px;letter-spacing:-1px}
.rail .mark.logo-mark{background:#fff;border:1px solid var(--line);padding:4px;overflow:hidden}
.rail .mark.logo-mark img{width:100%;height:100%;object-fit:contain}
.rail button.nav{width:52px;background:0;border:0;border-radius:10px;padding:8px 0 6px;color:var(--muted);
  display:flex;flex-direction:column;align-items:center;gap:3px;font-size:10px;font-weight:600;flex:0 0 auto;min-height:52px}
.rail button.nav svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8}

/* The rail's brand mark is a <div class="mark portal-mark">, not a
   button.nav, so the rule above never matched its SVG. With no fill:none the
   <rect> defaulted to a solid black fill and the logo rendered as a black
   square. currentColor is #fff here, giving a white outline on the brand blue. */
.rail .mark svg, .rail .portal-mark svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8}
.rail button.nav:hover{background:var(--bg);color:var(--ink)}
.rail button.nav.active{color:var(--brand)}
.rail .badge-count{position:absolute;transform:translate(14px,-6px);background:var(--accent);color:#fff;
  font-size:9px;font-weight:800;border-radius:10px;padding:1px 5px}
.rail .acct{margin-top:auto}
/* client login (top-right) + agent login (bottom-center) */
.top-acct{position:fixed;top:9px;right:14px;z-index:1800;display:flex;align-items:center;gap:9px}
.top-acct .hi{font-size:13px;font-weight:700;color:var(--ink);background:rgba(255,255,255,.9);padding:6px 10px;border-radius:16px;border:1px solid var(--line)}
.top-acct .btn-login{background:var(--brand);color:#fff;border:0;border-radius:8px;padding:9px 18px;font-weight:800;font-size:13.5px;cursor:pointer;box-shadow:var(--shadow)}
.top-acct .btn-login:hover{background:var(--brand-700)}
.top-acct .avatar{width:38px;height:38px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;font-weight:800;font-size:14px;cursor:pointer;box-shadow:var(--shadow)}
.agent-login{position:fixed;bottom:12px;left:12px;z-index:1700}
.agent-badge{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--brand),var(--brand-700));color:#fff;font-weight:800;font-size:14px;letter-spacing:.5px;text-decoration:none;box-shadow:var(--shadow);border:2px solid #fff;transition:transform .12s}
.agent-badge-logo{background:#fff;padding:4px;overflow:hidden}
.agent-badge-logo img{width:100%;height:100%;object-fit:contain}
.agent-badge:hover{transform:scale(1.07)}
.rail .avatar{width:38px;height:38px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;font-weight:800;font-size:14px;cursor:pointer}
.rail .signin{font-size:10px;font-weight:700;color:var(--brand);background:0;border:0;width:54px;text-align:center}

/* Main column */
.main{flex:1;min-width:0;display:flex;flex-direction:column;height:100vh}
#app{flex:1;min-height:0;display:flex;flex-direction:column}

/* ---------- Filter bar (browse) ---------- */
.filterbar{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid var(--line);
  background:#fff;flex-wrap:nowrap;overflow-x:auto;z-index:20}
.fsearch{display:flex;align-items:center;background:#fff;border:1.5px solid var(--line);border-radius:8px;
  padding:0 8px;min-width:220px;max-width:300px;flex:1}
.fsearch input{border:0;outline:0;padding:9px 6px;font-size:14px;width:100%;background:transparent}
.fsearch .ic{color:var(--muted);font-size:15px}
.fbtn{position:relative;background:#fff;border:1.5px solid var(--line);border-radius:8px;padding:9px 13px;
  font-size:13.5px;font-weight:600;color:var(--ink);white-space:nowrap;display:flex;align-items:center;gap:6px}
.fbtn:hover{border-color:#c2c8cf}
.fbtn.on{border-color:var(--brand);color:var(--brand);box-shadow:0 0 0 1px var(--brand) inset}
.fbtn .car{font-size:10px;color:var(--muted)}
.fsave{background:var(--brand);color:#fff;border:0;border-radius:8px;padding:10px 16px;font-weight:700;font-size:13.5px;white-space:nowrap}
.fsave:hover{background:var(--brand-700)}
.fcount{margin-left:auto;color:var(--brand);font-weight:700;font-size:13.5px;white-space:nowrap;padding-left:8px}

/* Popover */
.popover{position:absolute;top:46px;left:0;background:#fff;border:1px solid var(--line);border-radius:12px;
  box-shadow:var(--shadow-lg);padding:16px;z-index:50;min-width:260px}
.popover h5{margin:0 0 10px;font-size:13px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted)}
.seg{display:flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;margin-bottom:8px}
.seg button{flex:1;background:#fff;border:0;border-right:1px solid var(--line);padding:9px 6px;font-size:13px;font-weight:600;color:var(--ink)}
.seg button:last-child{border-right:0}
.seg button.on{background:var(--brand-50);color:var(--brand)}
.minmax{display:flex;align-items:center;gap:8px;margin:6px 0 12px}
.minmax input{flex:1;border:1.5px solid var(--line);border-radius:8px;padding:9px;font-size:14px;outline:0}
.chkrow{display:flex;align-items:center;gap:9px;padding:7px 0;font-size:14px;font-weight:600;cursor:pointer}
.chkrow input{width:17px;height:17px;accent-color:var(--brand)}
.pop-apply{width:100%;background:var(--brand);color:#fff;border:0;border-radius:8px;padding:11px;font-weight:700;margin-top:8px}
.radio{display:flex;align-items:center;gap:9px;padding:8px 0;font-size:14px;cursor:pointer}

/* ---------- Split: map + results ---------- */
.split{flex:1;display:flex;min-height:0}
.mapwrap{width:54%;min-width:300px;position:relative;background:#dfe6ea;isolation:isolate}
#map{position:absolute;inset:0}
.map-pill{position:absolute;top:12px;left:12px;background:rgba(0,0,0,.72);color:#fff;font-size:12.5px;
  font-weight:600;padding:6px 12px;border-radius:18px;z-index:500}
.map-cta{position:absolute;top:10px;right:12px;display:flex;gap:8px;z-index:500}
.map-cta button{background:#fff;border:1px solid var(--line);border-radius:18px;padding:7px 13px;font-size:12.5px;font-weight:600;box-shadow:var(--shadow)}
.mapfallback{position:absolute;inset:0;display:grid;place-items:center;color:var(--muted);text-align:center;padding:20px;font-size:13px}

/* price markers */
.price-pin{background:var(--brand);color:#fff;font-weight:700;font-size:12px;padding:4px 8px;border-radius:14px;
  white-space:nowrap;box-shadow:0 1px 4px rgba(0,0,0,.35);border:2px solid #fff;transform:translate(-50%,-50%)}
.price-pin.saved{background:var(--love)}
.price-pin.hl{background:#111;transform:scale(1.12);z-index:1000}

/* Results panel */
.results{width:46%;overflow-y:auto;background:#fff;position:relative}
/* right-side listing panel (opened from a map pin or card) */
.detail-panel{position:absolute;inset:0;background:#fff;overflow-y:auto;z-index:16;animation:pop .16s ease}
.panel-head{position:sticky;top:0;z-index:6;display:flex;justify-content:flex-end;padding:10px 12px;background:rgba(255,255,255,.96);backdrop-filter:blur(4px);border-bottom:1px solid var(--line)}
.panel-x{border:1.5px solid var(--line);background:#fff;border-radius:22px;padding:8px 15px;font-size:13.5px;font-weight:800;color:var(--ink);cursor:pointer;box-shadow:var(--shadow)}
.panel-x:hover{border-color:var(--brand);color:var(--brand)}
.detail-panel .detail{max-width:none;margin:0;padding:14px 18px 60px;min-height:0}
.detail-panel .gallery{grid-auto-rows:120px}
.detail-panel .detail-cols{grid-template-columns:1fr;gap:20px}
.detail-panel .action-card{position:static}
.action-card .agent .avatar.logo-avatar{background:#fff;border:1px solid var(--line);padding:4px;overflow:hidden}
.action-card .agent .avatar.logo-avatar img{width:100%;height:100%;object-fit:contain}
.results-head{padding:14px 18px 6px}
.results-head h1{font-size:19px;margin:0 0 2px}
.results-head .sub{color:var(--muted);font-size:13px}
.results-head .sort{float:right;color:var(--brand);font-weight:700;font-size:13px}
.src-note{background:#fff8e8;border:1px solid #f2d58a;color:#735c0f;border-radius:9px;padding:9px 12px;font-size:12.5px;margin:8px 0 2px}
.zgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;padding:8px 18px 28px}
@media(max-width:1180px){.zgrid{grid-template-columns:1fr}.mapwrap{width:48%}.results{width:52%}}
@media(max-width:920px){.split{flex-direction:column}.mapwrap{width:100%;height:240px}.results{width:100%}}

/* Zillow-style card */
.zcard{background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;cursor:pointer;
  transition:box-shadow .15s,transform .15s;display:flex;flex-direction:column}
.zcard:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
.zcard.hl{box-shadow:0 0 0 2px var(--brand),var(--shadow)}
.zphoto{position:relative;aspect-ratio:4/3;background:linear-gradient(135deg,#cdd8e1,#a9bccd)}
.zphoto img{width:100%;height:100%;object-fit:cover}
.zphoto.noimg::after{content:"No photo";position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-weight:600;font-size:13px}
.zbadge{position:absolute;top:10px;left:10px;background:rgba(255,255,255,.95);color:var(--ink);
  font-size:11px;font-weight:700;padding:4px 8px;border-radius:5px;box-shadow:var(--shadow)}
.zbadge.new{background:var(--ok);color:#fff}
.zheart{position:absolute;top:8px;right:8px;width:34px;height:34px;border:0;background:transparent;
  display:grid;place-items:center;font-size:22px;line-height:1;color:#fff;
  text-shadow:0 0 3px rgba(0,0,0,.5);filter:drop-shadow(0 1px 1px rgba(0,0,0,.4))}
.zheart.saved{color:var(--love);text-shadow:none}
.zbody{padding:11px 12px 13px}
.zprice{font-size:21px;font-weight:800;letter-spacing:-.5px}
.zspecs{font-size:13.5px;margin:3px 0 4px;color:var(--ink)}
.zspecs b{font-weight:700}
.zspecs .dim{color:var(--muted)}
.zaddr{color:var(--muted);font-size:13.5px}
.zbroker{color:var(--muted);font-size:11.5px;margin-top:5px;text-transform:uppercase;letter-spacing:.3px}

/* ---------- Detail view ---------- */
.scroll{flex:1;overflow-y:auto;background:var(--bg)}
.detail{max-width:1080px;margin:0 auto;padding:16px 22px 70px;background:#fff;min-height:100%}
.back{display:inline-flex;align-items:center;gap:7px;color:var(--brand);font-weight:700;font-size:14px;margin:6px 0 14px}
.gallery{display:grid;grid-template-columns:2fr 1fr 1fr;grid-auto-rows:150px;gap:7px;border-radius:12px;overflow:hidden}
.gallery .main-img{grid-row:span 2;grid-column:1}
.gallery img{width:100%;height:100%;object-fit:cover;cursor:pointer;background:#cdd8e1}
.gallery .more{position:relative}
.gallery .more .overlay{position:absolute;inset:0;background:rgba(0,0,0,.5);color:#fff;display:grid;place-items:center;font-weight:700}
.detail-cols{display:grid;grid-template-columns:1fr 330px;gap:32px;margin-top:22px}
@media(max-width:880px){.detail-cols{grid-template-columns:1fr}.gallery{grid-template-columns:1fr 1fr}.gallery .main-img{grid-column:span 2}}
.dh-price{font-size:30px;font-weight:800;letter-spacing:-.5px}
.dh-sub{color:var(--muted);font-size:15px;margin-top:2px}
.factgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border-radius:12px;overflow:hidden;margin:18px 0}
.factgrid div{background:#fff;padding:14px;text-align:center}
.factgrid b{display:block;font-size:18px}
.factgrid small{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.4px}
.block{margin:24px 0}
.block h3{font-size:18px;margin:0 0 12px}
.feat{display:flex;flex-wrap:wrap;gap:8px}
.feat span{background:#fff;border:1px solid var(--line);border-radius:8px;padding:7px 12px;font-size:13.5px}
.hist{width:100%;border-collapse:collapse;background:#fff;border-radius:12px;overflow:hidden;box-shadow:var(--shadow)}
.hist th,.hist td{text-align:left;padding:12px 14px;font-size:14px;border-bottom:1px solid var(--line)}
.hist th{background:#f3f5f7;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.4px}
.hist tr:last-child td{border-bottom:0}
.hist td.amt{font-weight:700;text-align:right}
/* Google area explorer */
.gm-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.gm-chip{background:#fff;border:1.5px solid var(--line);border-radius:20px;padding:8px 14px;font-size:13px;font-weight:600;color:var(--ink)}
.gm-chip:hover{border-color:var(--brand);color:var(--brand)}
.gm-chip.on{background:var(--brand);border-color:var(--brand);color:#fff}
.gm-chip.disabled{opacity:.5;cursor:not-allowed}
.gm-frame{width:100%;height:380px;border:0;border-radius:12px;box-shadow:var(--shadow)}
.gm-placeholder{background:#fff;border:1px dashed var(--line);border-radius:12px;padding:26px;text-align:center;color:var(--muted)}
.gm-placeholder b{color:var(--ink);font-size:15px}
.gm-placeholder p{max-width:520px;margin:8px auto 0;font-size:13.5px}
.gm-placeholder code{background:var(--bg);padding:2px 6px;border-radius:5px;font-size:12.5px}

.area-scores{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:18px}
.score{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px;text-align:center}
.score .ring{--v:0;width:64px;height:64px;border-radius:50%;margin:0 auto 8px;
  background:conic-gradient(var(--brand) calc(var(--v)*1%),var(--line) 0);display:grid;place-items:center}
.score .ring i{width:48px;height:48px;border-radius:50%;background:#fff;display:grid;place-items:center;font-style:normal;font-weight:800;font-size:16px}
.score small{display:block;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.4px;margin-top:2px}
.schools,.nearby{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.schools .row,.nearby .row{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid var(--line)}
.schools .row:last-child,.nearby .row:last-child{border-bottom:0}
.school-rating{width:34px;height:34px;border-radius:8px;background:var(--brand-50);color:var(--brand);display:grid;place-items:center;font-weight:800}
.school-rating.high{background:#d8f0e3;color:var(--ok)}
.school-rating.low{background:#fde4e4;color:var(--love)}
.row .meta{flex:1}.row .meta b{display:block;font-size:14.5px}.row .meta small{color:var(--muted);font-size:12.5px}
.row .dist{color:var(--muted);font-size:13px;font-weight:600}
.action-card{position:sticky;top:10px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:20px;box-shadow:var(--shadow);align-self:start}
.action-card .agent{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.action-card .agent .avatar{width:46px;height:46px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;font-weight:800}
.action-card .agent b{font-size:15px}.action-card .agent small{color:var(--muted);font-size:12.5px}
.btn{border:0;border-radius:8px;padding:12px 16px;font-weight:700;font-size:14px}
.btn:disabled{opacity:.65;cursor:not-allowed}
.btn-block{width:100%;display:block;text-align:center;margin-top:9px}
.btn-accent{background:var(--brand);color:#fff}.btn-accent:hover{background:var(--brand-700)}
.btn-outline{background:#fff;color:var(--brand);border:1.5px solid var(--line)}.btn-outline:hover{border-color:var(--brand)}
.btn-solid{background:var(--brand);color:#fff}
.senti{display:flex;gap:8px;margin:14px 0 4px}
.senti button{flex:1;border:1.5px solid var(--line);background:#fff;border-radius:9px;padding:10px 4px;font-size:13px;font-weight:700;color:var(--muted)}
.senti button.on[data-s="love"]{background:var(--love);border-color:var(--love);color:#fff}
.senti button.on[data-s="maybe"]{background:var(--maybe);border-color:var(--maybe);color:#fff}
.senti button.on[data-s="not_for_me"]{background:var(--no);border-color:var(--no);color:#fff}
.note{font-size:12.5px;color:var(--muted);margin-top:10px;text-align:center}

/* ---------- Board (saved) ---------- */
.board{max-width:1080px;margin:0 auto;padding:20px 22px 70px}
.board h2{margin:0 0 2px}.board .lead{color:var(--muted);margin:0 0 20px}
.tabs{display:flex;gap:6px;border-bottom:2px solid var(--line);margin-bottom:20px}
.tabs button{background:0;border:0;padding:12px 14px;font-weight:700;color:var(--muted);font-size:14.5px;border-bottom:3px solid transparent;margin-bottom:-2px}
.tabs button.active{color:var(--brand);border-color:var(--brand)}
.empty{text-align:center;padding:54px 20px;color:var(--muted)}.empty .big{font-size:40px;margin-bottom:10px}
.profile-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px;max-width:640px;box-shadow:var(--shadow)}
.profile-card h3{margin:0 0 12px;font-size:15px}
.profile-card .frow{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:560px){.profile-card .frow{grid-template-columns:1fr}}
.profile-card .field input:disabled{background:#f1f4f7;color:var(--muted)}
.profile-card .prow{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}
.tour-list{display:flex;flex-direction:column;gap:12px}
.tour{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px;display:flex;align-items:center;gap:14px}
.tour .thumb{width:84px;height:62px;border-radius:8px;object-fit:cover;background:#cdd8e1}
.tour .info{flex:1}.tour .info b{display:block}.tour .info small{color:var(--muted)}
.status-pill{font-size:12px;font-weight:700;padding:5px 11px;border-radius:20px;background:#fff7e6;color:#8a5a00;text-transform:uppercase;letter-spacing:.3px}
.compare-section{margin-top:38px;padding-top:30px;border-top:1px solid var(--line)}
.compare-section .section-heading{margin-bottom:14px}.compare-section .section-heading h2{margin-bottom:3px}
.compare-section .lead{font-size:13.5px!important;margin:0!important}
.compare-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:13px}
.compare-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:17px;box-shadow:var(--shadow)}
.compare-card h3{font-size:16px;line-height:1.25;margin:11px 0 3px}.compare-card p{color:var(--muted);font-size:12.5px;margin:0}
.compare-specs{background:var(--bg);border-radius:8px;padding:9px 10px;margin:13px 0;color:var(--ink);font-size:12.5px;font-weight:700}
.compare-card label{display:block;color:var(--muted);font-size:12px;font-weight:800;margin-bottom:5px}
.compare-card textarea{width:100%;resize:vertical;border:1.5px solid var(--line);border-radius:9px;padding:10px;font:inherit;font-size:13.5px;outline:0}
.compare-card textarea:focus{border-color:var(--brand)}

/* ---------- Client Portal buyer dashboard + resource center ---------- */
.client-shell{width:100%;max-width:1180px;margin:0 auto;padding:18px 24px 72px}
.client-shell.narrow{max-width:900px}
.client-mode{display:flex;align-items:center;gap:8px;min-height:44px;margin:0 160px 16px 0;flex-wrap:wrap}
.client-mode-label{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-right:4px}
.mode-pill{border:1.5px solid var(--line);border-radius:22px;background:#fff;color:var(--ink);min-height:38px;padding:7px 15px;font-weight:800;display:inline-flex;align-items:center;justify-content:center}
.mode-pill.active{background:var(--brand);border-color:var(--brand);color:#fff}
.mode-pill.future{color:var(--muted);cursor:not-allowed;opacity:.8}
.mode-pill small{font-size:9px;text-transform:uppercase;letter-spacing:.04em;margin-left:3px}
.mode-help{color:var(--muted);font-size:12px;margin-left:auto;max-width:390px}
.client-hero{background:linear-gradient(135deg,#1d1d1f,#343438);color:#fff;border-radius:22px;padding:34px;display:flex;align-items:flex-end;justify-content:space-between;gap:30px;box-shadow:var(--shadow)}
.client-hero.compact{padding:28px 30px;align-items:center}
.client-hero>div:first-child{max-width:720px}
.client-hero h1{font-size:34px;line-height:1.1;letter-spacing:-.8px;margin:5px 0 10px}
.client-hero p{margin:0;color:rgba(255,255,255,.86);max-width:720px}
.client-hero .eyebrow{color:#8fc7ff}
.client-hero .btn-outline{background:rgba(255,255,255,.96);border-color:#fff}
.hero-actions{display:flex;gap:10px;flex-wrap:wrap;min-width:max-content}
.eyebrow{display:block;color:var(--brand);font-size:11px;font-weight:900;letter-spacing:.11em;text-transform:uppercase}
.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:16px 0 34px}
.metric-grid a,.metric-action{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px;box-shadow:var(--shadow);text-align:left}
.metric-grid b,.metric-action b{display:block;font-size:27px;line-height:1;color:var(--brand)}
.metric-grid span,.metric-action span{display:block;color:var(--muted);font-size:12px;font-weight:700;margin-top:7px}
.metric-action{font:inherit;cursor:pointer}
.client-section{margin:34px 0}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:16px}
.section-heading h2,.update-card h2{margin:3px 0 0;font-size:24px}
.text-action{border:0;background:transparent;color:var(--brand);font-weight:800;padding:10px 0;min-height:44px;text-align:left}
.journey-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.journey-card{background:#fff;border:1px solid var(--line);border-radius:15px;padding:18px;min-width:0;position:relative}
.journey-num{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--brand-50);color:var(--brand);font-weight:900;margin-bottom:14px}
.journey-card h3{font-size:17px;margin:0 0 7px}.journey-card p{font-size:13px;color:var(--muted);margin:0 0 12px}
.journey-card ul{margin:0 0 16px;padding-left:17px;color:var(--ink);font-size:12.5px}.journey-card li{margin:5px 0}
.journey-card a{color:var(--brand);font-size:12.5px;font-weight:800}
.update-card{display:grid;grid-template-columns:52px 1fr;gap:18px;background:var(--brand-50);border:1px solid #cfe5fb;border-radius:16px;padding:24px;margin:34px 0}
.update-icon{width:48px;height:48px;border-radius:14px;background:var(--brand);color:#fff;display:grid;place-items:center;font-size:23px;font-weight:900}
.update-card p{margin:11px 0 0;color:#3a3a3c}
.portal-disclaimer{color:var(--muted);font-size:11.5px;border-top:1px solid var(--line);padding-top:16px;margin-top:30px}
.resource-tabs{display:flex;gap:5px;margin:22px 0 18px;border-bottom:2px solid var(--line)}
.resource-tabs button{border:0;background:transparent;color:var(--muted);font-size:14px;font-weight:800;padding:12px 16px;border-bottom:3px solid transparent;margin-bottom:-2px;min-height:44px}
.resource-tabs button.active{color:var(--brand);border-color:var(--brand)}
.resource-tools{display:flex;gap:10px;margin-bottom:12px}.resource-search{display:flex;align-items:center;flex:1;max-width:580px;border:1.5px solid var(--line);border-radius:10px;background:#fff;padding:0 11px}
.resource-search input{border:0;outline:0;background:transparent;width:100%;padding:12px 8px;font-size:14px}
.resource-tools select{border:1.5px solid var(--line);border-radius:10px;background:#fff;padding:0 12px;min-height:44px;font-weight:700;color:var(--ink)}
.chip-row{display:flex;gap:7px;overflow-x:auto;padding:4px 0 16px}.filter-chip{border:1px solid var(--line);border-radius:20px;background:#fff;color:var(--muted);white-space:nowrap;padding:8px 13px;font-size:12px;font-weight:700;min-height:38px}
.filter-chip.active{background:var(--brand);border-color:var(--brand);color:#fff}
.resource-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.resource-card{background:#fff;border:1px solid var(--line);border-radius:15px;padding:19px;display:flex;flex-direction:column;min-height:235px;transition:box-shadow .15s,transform .15s}
.resource-card:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
.resource-meta{display:flex;justify-content:space-between;gap:10px;color:var(--muted);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.resource-card h3{font-size:18px;line-height:1.2;margin:13px 0 8px}.resource-card p{font-size:13.5px;color:var(--muted);margin:0 0 13px}
.tag-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:auto}.tag-row span{background:var(--brand-50);color:var(--brand);border-radius:16px;padding:5px 9px;font-size:10.5px;font-weight:700}
.tag-row.large{margin:18px 0}.tag-row.large span{font-size:12px;padding:7px 11px}
.card-link{display:block;color:var(--brand);font-size:13px;font-weight:900;margin-top:16px}
.owner-line{font-size:11.5px;color:var(--muted);margin-top:auto}.owner-line b{color:var(--ink)}
.boundary-note{background:#fff9e8;border:1px solid #f1d995;border-radius:12px;padding:14px 16px;color:#6b570f;font-size:13px;margin:0 0 18px}
.home-type-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.home-type-grid article{background:#fff;border:1px solid var(--line);border-radius:15px;padding:20px}
.home-type-grid h3{margin:10px 0 7px}.home-type-grid p{color:var(--muted);font-size:13.5px;margin:0}.home-type-icon{width:38px;height:38px;border-radius:11px;background:var(--brand-50);color:var(--brand);display:grid;place-items:center;font-size:21px}
.resource-detail{background:#fff;border:1px solid var(--line);border-radius:18px;padding:30px;box-shadow:var(--shadow)}
.resource-detail h1{font-size:34px;line-height:1.12;margin:7px 0 12px}.detail-lead{font-size:18px;color:#4e555c;max-width:760px;margin:0 0 22px}
.detail-two{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:22px 0}.detail-two section{background:var(--bg);border-radius:13px;padding:18px}.detail-two h2{font-size:16px;margin:0 0 10px}
.check-list,.question-list{margin:0;padding-left:20px;font-size:14px}.check-list li,.question-list li{margin:8px 0}.check-list li::marker{color:var(--ok)}.question-list li::marker{color:var(--brand)}
.script-card{background:var(--brand-50);border-left:4px solid var(--brand);border-radius:0 12px 12px 0;padding:20px;margin:22px 0}.script-card p{font-size:17px;line-height:1.6;margin:8px 0}.script-card small{color:var(--muted)}
.detail-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}.detail-actions .btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px}
.in-app-guide{margin-top:28px}.guide-intro{max-width:780px;margin-bottom:18px}.guide-intro h2,.guide-question-box h2{font-size:23px;margin:5px 0 8px}.guide-intro p{color:var(--muted);font-size:15px;line-height:1.55;margin:0}
.guide-section-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.guide-section{background:var(--bg);border:1px solid var(--line);border-radius:15px;padding:19px}.guide-section h3{font-size:16px;line-height:1.25;margin:0 0 11px}.guide-section ul{margin:0;padding-left:19px;color:#3a3a3c;font-size:13.5px;line-height:1.5}.guide-section li{margin:8px 0}.guide-section li::marker{color:var(--brand)}
.guide-question-box{margin-top:14px;background:var(--brand-50);border:1px solid #cfe5fb;border-radius:15px;padding:21px}.guide-question-box ol{display:grid;grid-template-columns:1fr 1fr;gap:14px 24px;margin:13px 0 0;padding-left:22px;font-size:14px;line-height:1.5}.guide-question-box li{padding-left:3px}.guide-question-box li::marker{color:var(--brand);font-weight:900}.guided-question-list b{display:block;color:var(--ink);font-size:14px;line-height:1.35}.guided-question-list p{margin:6px 0 0;color:#4e555c;font-size:12.5px;line-height:1.48}.guide-unavailable{background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:20px}.guide-unavailable h2{margin:0 0 7px}.guide-unavailable p{margin:0;color:var(--muted)}
.seller-hero{background:linear-gradient(135deg,#1d1d1f,#0a4d8c)}
.seller-journey{grid-template-columns:repeat(5,1fr)}
.seller-panel-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:14px;align-items:stretch}
.seller-card{margin:0}
.compact-list{margin:12px 0 16px;padding-left:18px;color:#3a3a3c;font-size:13.5px}
.compact-list li{margin:7px 0}
.prep-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:24px;box-shadow:var(--shadow)}
.prep-card h2{font-size:24px;margin:3px 0 14px}
.prep-list{display:grid;gap:10px}
.prep-list label{display:flex;gap:10px;align-items:flex-start;color:var(--ink);font-size:13.5px;line-height:1.35}
.prep-list input{margin-top:2px;accent-color:var(--brand)}
.script-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.script-library-card{margin:0;background:#fff;border:1px solid var(--line);border-left:4px solid var(--brand)}
.script-library-card h3{font-size:17px;margin:8px 0}
.script-library-card p{font-size:15px;line-height:1.55;color:#3a3a3c}
.modal-frow{display:grid;grid-template-columns:1fr 1fr;gap:10px}

/* ---------- Transaction workspace ---------- */
.transaction-side-tabs{display:flex;gap:8px;margin:0 0 16px}
.transaction-side-tabs button{border:1px solid var(--line);background:#fff;color:var(--muted);border-radius:22px;padding:9px 15px;font-weight:800;min-height:40px}
.transaction-side-tabs button.active{background:var(--ink);border-color:var(--ink);color:#fff}
.transaction-hero{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:22px;padding:30px;box-shadow:var(--shadow)}
.transaction-kicker{display:flex;align-items:center;gap:9px;color:var(--brand);font-size:12px;font-weight:900;letter-spacing:.06em;text-transform:uppercase}
.demo-chip{background:var(--brand-50);border:1px solid #cfe5fb;border-radius:16px;padding:5px 9px;color:var(--brand)}
.transaction-hero h1{font-size:32px;line-height:1.12;letter-spacing:-.7px;margin:12px 0 9px}.transaction-hero>div>p{margin:0;color:var(--muted);max-width:680px}
.next-action-card{background:var(--ink);color:#fff;border-radius:17px;padding:21px}.next-action-card>span{display:inline-block;background:#ff9f0a;color:#1d1d1f;border-radius:14px;padding:4px 9px;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.05em}
.next-action-card h2{font-size:19px;line-height:1.25;margin:12px 0 7px}.next-action-card p{color:#fff;margin:0 0 10px;font-size:13.5px}.next-action-card small{color:#bcbcc1}
.transaction-progress-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px;margin:16px 0;box-shadow:var(--shadow)}
.transaction-progress-head{display:flex;align-items:end;justify-content:space-between;gap:20px}.transaction-progress-head h2{margin:3px 0 0;font-size:24px}.transaction-progress-head strong{font-size:24px;color:var(--brand)}
.transaction-progress{height:8px;border-radius:8px;background:#e8e8ed;overflow:hidden;margin:15px 0 22px}.transaction-progress i{display:block;height:100%;border-radius:inherit;background:var(--brand)}
.milestone-row{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.milestone{position:relative;border-top:2px solid var(--line);padding:14px 8px 4px 0}.milestone-dot{position:absolute;width:11px;height:11px;border-radius:50%;background:var(--line);top:-6px;left:0;border:2px solid #fff;box-shadow:0 0 0 1px var(--line)}
.milestone.complete{border-color:var(--ok)}.milestone.complete .milestone-dot{background:var(--ok);box-shadow:0 0 0 1px var(--ok)}.milestone.current{border-color:var(--brand)}.milestone.current .milestone-dot{background:var(--brand);box-shadow:0 0 0 3px rgba(0,113,227,.16)}
.milestone small{color:var(--muted);font-size:10.5px;font-weight:800;text-transform:uppercase}.milestone h3{font-size:14px;margin:5px 0 3px}.milestone p{font-size:11.5px;line-height:1.35;color:var(--muted);margin:0}
.transaction-layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(300px,.6fr);gap:16px;align-items:start}.transaction-sidebar{display:grid;gap:16px}.transaction-panel{background:#fff;border:1px solid var(--line);border-radius:18px;padding:23px;box-shadow:var(--shadow)}
.transaction-panel h2{font-size:22px;margin:3px 0 0}.panel-title{display:flex;justify-content:space-between;align-items:start;gap:15px}.panel-title.compact-title{align-items:center;margin-bottom:4px}.panel-title.compact-title .panel-intro{margin:0;max-width:620px}.panel-intro{color:var(--muted);font-size:13px;margin:11px 0 4px}
.transaction-collapse{background:#fff;border:1px solid var(--line);border-radius:18px;margin:16px 0;box-shadow:var(--shadow);overflow:hidden}.transaction-collapse summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:18px;cursor:pointer;padding:20px 24px;min-height:74px}.transaction-collapse summary::-webkit-details-marker{display:none}.transaction-collapse summary b{display:block;font-size:22px;line-height:1.15;margin-top:3px}.transaction-collapse summary em{font-style:normal;background:var(--brand-50);color:var(--brand);border-radius:18px;padding:6px 10px;font-size:11px;font-weight:900;white-space:nowrap}.transaction-collapse summary:after{content:"+";width:30px;height:30px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;color:var(--muted);font-size:20px;font-weight:600;flex:0 0 auto}.transaction-collapse[open] summary{border-bottom:1px solid var(--line)}.transaction-collapse[open] summary:after{content:"-";background:var(--brand-50);color:var(--brand);border-color:#cfe5fb}.transaction-collapse-body{padding:20px 24px 24px}.transaction-collapse-body>.panel-intro:first-child{margin-top:0}
.agent-note-list{display:grid}.agent-note{display:grid;grid-template-columns:42px 1fr;gap:13px;padding:20px 0;border-bottom:1px solid var(--line)}.agent-note:last-child{border-bottom:0;padding-bottom:0}.agent-note-avatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--brand-50);color:var(--brand);font-size:12px;font-weight:900}
.agent-note-meta{display:flex;justify-content:space-between;gap:12px;align-items:baseline}.agent-note-meta b{font-size:14px}.agent-note-meta time{color:var(--muted);font-size:10.5px;white-space:nowrap}.agent-note p{font-size:13.5px;line-height:1.55;color:#3a3a3c;margin:7px 0 0}
.transaction-task-list{display:grid;margin-top:13px}.transaction-task{display:flex;gap:10px;padding:12px 0;border-bottom:1px solid var(--line);align-items:flex-start}.transaction-task:last-child{border-bottom:0}.transaction-task input{margin-top:2px;accent-color:var(--brand)}.transaction-task span{display:block}.transaction-task b{display:block;font-size:13.5px}.transaction-task small{display:block;color:var(--muted);font-size:11.5px;margin-top:2px}.transaction-task.complete b{text-decoration:line-through;color:var(--muted)}
.transaction-doc-list{display:grid;margin-top:12px}.transaction-doc-list article{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.transaction-doc-list article:last-child{border-bottom:0}.transaction-doc-list b{display:block;font-size:13.5px}.transaction-doc-list small{display:block;color:var(--muted);font-size:11px;margin-top:2px}.transaction-doc-list span{background:var(--brand-50);color:var(--brand);border-radius:15px;padding:5px 8px;font-size:10px;font-weight:900}
.transaction-team-section{background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px;margin:16px 0;box-shadow:var(--shadow)}.transaction-team-section h2{font-size:24px;margin:3px 0 0}.team-status{background:var(--brand-50);color:var(--brand);border-radius:18px;padding:6px 10px;font-size:11px;font-weight:900;white-space:nowrap}
.transaction-contact-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:18px}.transaction-contact-card{border:1px solid var(--line);border-radius:15px;padding:17px;min-width:0;background:#fff}.transaction-contact-card.hoa-contact-card{background:#f6fbf7;border-color:#b9dfc1}.transaction-contact-head{display:grid;grid-template-columns:42px minmax(0,1fr);gap:11px;align-items:start}.transaction-contact-avatar{width:42px;height:42px;border-radius:12px;background:var(--brand-50);color:var(--brand);display:grid;place-items:center;font-size:12px;font-weight:900}.hoa-contact-card .transaction-contact-avatar{background:#e5f6e8;color:#248a3d}.transaction-contact-role{display:block;color:var(--muted);font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.04em}.transaction-contact-card h3{font-size:15px;line-height:1.25;margin:4px 0 2px}.transaction-contact-card p{color:var(--muted);font-size:11.5px;line-height:1.35;margin:0}.transaction-contact-actions{display:grid;gap:6px;margin:14px 0 0}.transaction-contact-actions a{color:var(--brand);font-size:12.5px;font-weight:800;overflow-wrap:anywhere}.transaction-contact-card ul{margin:12px 0 0;padding:11px 0 0 18px;border-top:1px solid var(--line);color:var(--muted);font-size:11.5px;line-height:1.4}.transaction-contact-card li{margin:5px 0}
.participant-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px}.participant-card{border:1px solid var(--line);border-radius:15px;padding:16px;background:#fff}.participant-card>div:first-child{display:grid;grid-template-columns:42px minmax(0,1fr);gap:11px;align-items:start}.participant-card h3{font-size:15px;line-height:1.25;margin:4px 0 2px}.participant-card p{color:var(--muted);font-size:11.5px;margin:0;overflow-wrap:anywhere}.participant-card strong{display:inline-flex;margin-top:12px;background:#f5f5f7;border-radius:14px;padding:5px 9px;color:var(--ink);font-size:10px;text-transform:uppercase;letter-spacing:.04em}.participant-card.buyer strong{background:var(--brand-50);color:var(--brand)}.participant-card.seller strong{background:#fff3e0;color:#a35b00}.participant-card.team strong{background:#eef7ee;color:#248a3d}.participant-card ul{margin:12px 0 0;padding:11px 0 0 18px;border-top:1px solid var(--line);color:var(--muted);font-size:11.5px;line-height:1.4}.participant-card li{margin:5px 0}.access-note{background:#f5f5f7;border:1px solid var(--line);border-radius:13px;padding:13px 15px;color:#3a3a3c;font-size:12px;line-height:1.45;margin-top:14px}
.demo-help{font-size:10.5px;color:var(--muted);line-height:1.4;margin:14px 0 0}.transaction-empty{max-width:760px;margin:28px auto;background:#fff;border:1px solid var(--line);border-radius:22px;padding:48px;text-align:center;box-shadow:var(--shadow)}.transaction-empty-icon{width:56px;height:56px;border-radius:18px;background:var(--brand-50);color:var(--brand);display:grid;place-items:center;font-size:28px;font-weight:900;margin:0 auto 18px}.transaction-empty h1{font-size:30px;line-height:1.18;margin:8px 0 11px}.transaction-empty p{color:var(--muted);max-width:590px;margin:0 auto 22px}

/* ---------- Seller closed-sale lookup ---------- */
.comp-search-card,.comp-results-section,.notification-settings-card,.notification-matrix{background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px;margin:16px 0;box-shadow:var(--shadow)}
.comp-search-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr .7fr;gap:12px}.comp-search-card .field{margin-bottom:14px}.comp-search-card select,.notification-settings-card select,.modal select{width:100%;border:1.5px solid var(--line);border-radius:9px;padding:12px;background:#fff;color:var(--ink);font:inherit;outline:0}.comp-search-card select:focus,.notification-settings-card select:focus,.modal select:focus{border-color:var(--brand)}
.comp-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:4px 0 16px}.comp-summary>div{background:var(--brand-50);border:1px solid #cfe5fb;border-radius:14px;padding:16px}.comp-summary b{display:block;font-size:22px;color:var(--brand)}.comp-summary span{display:block;color:var(--muted);font-size:11.5px;margin-top:3px}
.comp-table-wrap{max-width:100%;overflow-x:auto;border:1px solid var(--line);border-radius:14px}.comp-table{width:100%;min-width:760px;border-collapse:collapse;font-size:12.5px}.comp-table th{background:#f5f5f7;color:var(--muted);text-align:left;padding:11px 13px;font-size:10.5px;text-transform:uppercase;letter-spacing:.04em}.comp-table td{padding:13px;border-top:1px solid var(--line);vertical-align:top}.comp-table td b{display:block}.comp-table td small{display:block;color:var(--muted);margin-top:3px}.comp-empty{min-height:170px;display:grid;place-content:center;text-align:center;color:var(--muted)}

/* ---------- Notification center ---------- */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.notification-channel-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:16px 0}.notification-channel-card{background:#fff;border:1px solid var(--line);border-radius:17px;padding:19px;display:grid;grid-template-columns:44px 1fr;gap:13px;box-shadow:var(--shadow)}.notification-channel-icon{width:44px;height:44px;border-radius:13px;background:var(--brand-50);color:var(--brand);font-size:19px;font-weight:900;display:grid;place-items:center}.notification-channel-card h2{font-size:16px;margin:4px 0;overflow-wrap:anywhere}.notification-channel-card p{font-size:12px;line-height:1.4;color:var(--muted);margin:0}.production-pending{margin-top:16px}
.notification-matrix-title,.notification-group-head{display:flex;justify-content:space-between;gap:18px;align-items:end}.notification-matrix-title h2,.notification-group-head h2,.notification-settings-card h2{font-size:22px;margin:4px 0 0}.notification-matrix-title>p{color:var(--muted);font-size:12px;margin:0}.notification-event-group{margin-top:20px;border:1px solid var(--line);border-radius:15px;overflow:hidden}.notification-group-head{padding:15px 17px;background:#f5f5f7}.notification-group-head h2{font-size:16px}.notification-channel-head,.notification-channels{display:grid;grid-template-columns:54px 54px;text-align:center;align-items:center}.notification-channel-head span{font-size:10px;color:var(--muted);font-weight:900;text-transform:uppercase}.notification-row{display:grid;grid-template-columns:minmax(0,1fr) 108px;gap:18px;padding:15px 17px;border-top:1px solid var(--line);align-items:center}.notification-row b{display:block;font-size:13.5px}.notification-row p{color:var(--muted);font-size:11.5px;line-height:1.4;margin:4px 0 0}.notification-channels label{min-height:34px;display:grid;place-items:center}.notification-channels input,.consent-card input,.alert-choice input{width:19px;height:19px;accent-color:var(--brand)}
.notification-settings-grid{display:grid;grid-template-columns:1.2fr 1fr .8fr .8fr;gap:12px;margin-top:18px}.consent-card{display:flex;align-items:flex-start;gap:11px;background:#f5f5f7;border:1px solid var(--line);border-radius:13px;padding:14px;margin:4px 0 17px;color:#3a3a3c;font-size:12px;line-height:1.45}.consent-card input{flex:0 0 auto;margin-top:1px}.alert-choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:14px}.alert-choice{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:12px;padding:13px}.alert-choice input{flex:0 0 auto}.alert-choice b,.alert-choice small{display:block}.alert-choice small{color:var(--muted);font-size:11px;line-height:1.35;margin-top:3px}

@media(max-width:1050px){.journey-grid,.seller-journey{grid-template-columns:repeat(2,1fr)}.resource-grid,.home-type-grid{grid-template-columns:repeat(2,1fr)}.guide-section-grid{grid-template-columns:1fr}.seller-panel-grid,.script-grid{grid-template-columns:1fr}.transaction-hero,.transaction-layout{grid-template-columns:1fr}.transaction-contact-grid,.participant-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.comp-search-grid,.notification-settings-grid{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.client-shell{padding:12px 14px 70px}.client-mode{margin-right:0;padding-top:44px}.mode-help{width:100%;max-width:none;margin-left:0}.client-hero,.client-hero.compact{padding:24px;display:block}.client-hero h1{font-size:28px}.hero-actions{margin-top:20px;min-width:0}.metric-grid{grid-template-columns:1fr 1fr}.journey-grid,.seller-journey,.resource-grid,.home-type-grid,.detail-two,.modal-frow,.guide-question-box ol,.transaction-contact-grid,.participant-grid,.comp-search-grid,.comp-summary,.notification-channel-grid,.notification-settings-grid,.alert-choice-grid{grid-template-columns:1fr}.resource-tools{display:block}.resource-tools select{width:100%;margin-top:8px}.resource-search{max-width:none}.section-heading{display:block}.resource-detail{padding:22px}.resource-detail h1{font-size:28px}.transaction-side-tabs{overflow-x:auto}.transaction-side-tabs button{white-space:nowrap}.transaction-hero,.transaction-progress-card,.transaction-panel,.transaction-team-section,.comp-search-card,.comp-results-section,.notification-settings-card,.notification-matrix{padding:20px}.transaction-collapse summary{padding:17px 18px}.transaction-collapse summary b{font-size:19px}.transaction-collapse-body{padding:17px 18px 20px}.panel-title.compact-title{display:block}.transaction-hero h1{font-size:26px}.milestone-row{grid-template-columns:1fr}.milestone{border-top:0;border-left:2px solid var(--line);padding:4px 0 16px 18px}.milestone-dot{top:4px;left:-7px}.agent-note-meta{display:block}.agent-note-meta time{display:block;margin-top:2px;white-space:normal}.transaction-empty{padding:34px 22px}.transaction-empty h1{font-size:25px}.notification-matrix-title{display:block}.notification-matrix-title>p{margin-top:6px}.notification-row{grid-template-columns:minmax(0,1fr) 88px;padding:14px}.notification-channel-head,.notification-channels{grid-template-columns:44px 44px}}

/* ---------- Modal ---------- */
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.5);backdrop-filter:blur(2px);z-index:2000;display:grid;place-items:center;padding:20px}
.modal{background:#fff;border-radius:16px;width:100%;max-width:430px;box-shadow:var(--shadow-lg);overflow:hidden;animation:pop .16s ease}
@keyframes pop{from{transform:translateY(8px);opacity:0}to{transform:none;opacity:1}}
.modal-wrap{position:relative}
.modal .head{padding:22px 24px 0}
.modal .head .mark{width:42px;height:42px;border-radius:10px;background:var(--brand);color:#fff;display:grid;place-items:center;font-weight:800;margin-bottom:12px}
.modal .head .mark.logo-mark{background:#fff;border:1px solid var(--line);padding:4px;overflow:hidden}
.modal .head .mark.logo-mark img{width:100%;height:100%;object-fit:contain}
.modal-brand{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.modal-brand img{width:54px;height:38px;object-fit:contain;border:1px solid var(--line);border-radius:10px;background:#fff;padding:4px}
.modal-brand span{font-weight:800;color:var(--brand);font-size:14px}
.modal h3{margin:0 0 4px;font-size:21px}.modal p.sub{margin:0;color:var(--muted);font-size:14px}
.modal .body{padding:18px 24px 24px}
.auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 14px}
.auth-tab{border:1.5px solid var(--line);background:#fff;color:var(--ink);border-radius:10px;padding:11px 8px;font-weight:800;font-size:14px}
.auth-tab.active{background:var(--brand);border-color:var(--brand);color:#fff}
.auth-help{font-size:12.5px;color:var(--muted);margin:-2px 0 12px}
.field{margin-bottom:12px}.field label{display:block;font-size:13px;font-weight:600;color:var(--muted);margin-bottom:5px}
.field input,.field textarea{width:100%;border:1.5px solid var(--line);border-radius:9px;padding:12px;font-size:15px;font-family:inherit;outline:0}
.field input:focus,.field textarea:focus{border-color:var(--brand)}
.modal .x{position:absolute;top:14px;right:16px;background:0;border:0;font-size:22px;color:var(--muted);z-index:2}
.tour-windows{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tour-windows button{border:1.5px solid var(--line);background:#fff;border-radius:8px;padding:10px;font-size:13px;font-weight:600}
.tour-windows button.on{border-color:var(--brand);background:var(--brand-50);color:var(--brand)}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#111;color:#fff;padding:13px 20px;border-radius:10px;font-weight:600;font-size:14px;box-shadow:var(--shadow-lg);z-index:2200;animation:pop .2s}

/* Profile photo on the My Information screen. Client-uploaded avatars are
   256px squares stored as data URIs, so a fixed round frame is enough. */
.pf-photo{display:flex;align-items:center;gap:16px;margin:0 0 20px;flex-wrap:wrap}
.pf-photo img,.pf-initials{width:88px;height:88px;border-radius:50%;object-fit:cover;
  display:grid;place-items:center;border:1px solid var(--line,#e2e8f0);background:#f1f5f9}
.pf-initials{font-size:30px;font-weight:800;color:var(--brand,#0071e3);
  background:var(--brand-50,#f0f7ff);border-color:#cfe6ff}
.pf-photo-actions{display:flex;gap:8px;flex-wrap:wrap}
@media (max-width:560px){
  .pf-photo{justify-content:center;text-align:center}
  .pf-photo-actions{width:100%;justify-content:center}
}

/* Subject-property row above the comp search. The client's own address drives
   the tool, so it sits above the filters rather than beside them. */
.subject-row{padding:16px 18px;border-bottom:1px solid var(--line,#e2e8f0)}
.subject-row .field{margin:0}
.subject-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
@media (max-width:560px){ .subject-actions .btn{width:100%} }

/* ---------- The signed-in account control on small screens ----------
   .top-acct is position:fixed in the top-right corner, so it floats over
   whatever the main column happens to put there. On a phone that meant it
   covered the search box and the "For sale" filter on the browse screen, and
   sat across the Notification Center hero. Only screens that render
   .client-mode reserved room for it (padding-top:44px), so every screen
   without that bar was exposed.

   Phones: it becomes a real header bar across the main column and .main is
   offset once, so no individual screen has to reserve space for it. */
@media (max-width:700px){
  .top-acct{top:0;right:0;left:var(--rail);height:48px;padding:0 12px;gap:8px;
    background:#fff;border-bottom:1px solid var(--line);justify-content:flex-end}
  .top-acct .hi{background:0;border:0;padding:0;font-size:13.5px;min-width:0;
    max-width:calc(100% - 52px);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
  .top-acct .avatar{width:34px;height:34px;font-size:13px;flex:0 0 34px}
  .top-acct .btn-login{padding:8px 15px}
  .main{padding-top:48px}
  /* .main now carries the offset; this per-screen reservation would double it */
  .client-mode{padding-top:0}
}

/* Landscape phones, tablets and narrow windows keep the floating chip, but
   the browse filter bar is wider than the viewport there, so its right end
   scrolled underneath it. End the filter bar's scroll viewport short of the
   chip and move the hairline to .split so it still spans the full width.
   .client-mode already reserves 160px for the chip at these widths. */
@media (min-width:701px) and (max-width:1000px){
  .filterbar{margin-right:150px;border-bottom:0}
  .split{border-top:1px solid var(--line)}
}

/* Tags are now buttons that filter the list, so they need to look pressable
   and inherit none of the browser's default button chrome. */
.tag-row .tag-chip{background:var(--brand-50);color:var(--brand);border:1px solid transparent;
  border-radius:16px;padding:5px 9px;font:700 10.5px/1.3 inherit;cursor:pointer;
  transition:background .15s,border-color .15s}
.tag-row .tag-chip:hover{background:var(--brand);color:#fff}
.tag-row .tag-chip:focus-visible{outline:none;border-color:var(--brand);
  box-shadow:0 0 0 3px rgba(0,113,227,.18)}

/* Seller net sheet, embedded in the guide. Results sit beside the inputs on a
   desktop and stack underneath on a phone, so the net figure is never more
   than a glance away from the number being changed. */
.ns-calc{margin:22px 0 0;padding:20px;border:1px solid var(--line,#e2e8f0);border-radius:14px;background:#fff}
.ns-calc h2{margin:0 0 4px;font-size:19px;letter-spacing:-.01em}
.ns-lead{margin:0 0 16px;color:var(--muted,#64748b);font-size:14px}
.ns-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.ns-field{display:flex;flex-direction:column;gap:4px;font-size:12.5px;font-weight:700;color:var(--muted,#64748b)}
.ns-field input{padding:10px 11px;border:1px solid #cdd6dd;border-radius:9px;
  font:15px/1.2 inherit;color:var(--ink,#0f172a);background:#fff;width:100%}
.ns-field input:focus{outline:none;border-color:var(--brand,#0071e3);
  box-shadow:0 0 0 4px rgba(0,113,227,.12)}
.ns-field small{font-weight:500;color:var(--muted,#94a3b8);font-size:11px}

.ns-out{margin-top:18px}
.ns-table{width:100%;border-collapse:collapse;font-size:14px}
.ns-table td{padding:9px 2px;border-bottom:1px solid var(--line,#eef2f4)}
.ns-table td:last-child{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.ns-table .ns-top td{font-weight:700}
.ns-table .ns-sub td{font-weight:700;color:var(--muted,#64748b)}
.ns-table .ns-net td{font-size:18px;font-weight:800;border-bottom:0;
  border-top:2px solid var(--ink,#0f172a);padding-top:12px}
.ns-note{margin:14px 0 0;color:var(--muted,#94a3b8);font-size:12.5px;line-height:1.55}

@media (max-width:560px){
  .ns-grid{grid-template-columns:minmax(0,1fr)}
  .ns-calc{padding:16px}
}

.ns-table .ns-loan{color:var(--muted,#94a3b8);font-size:12.5px;padding-top:10px;border-bottom:0}