/* ============================================================
   Chainsure design system
   Trustworthy, government-adjacent proptech. Navy + clear status colour.
   ============================================================ */
:root{
  --bg:#f4f7fc;
  --panel:#ffffff;
  --ink:#0f1b2d;
  --ink-2:#394a61;
  --muted:#6b7a90;
  --line:#e4e9f2;
  --line-2:#eef2f8;

  --navy:#14306b;
  --navy-2:#1d47a0;
  --accent:#3b6df0;
  --accent-ink:#1d47a0;

  --ready:#0ea371;      /* sale ready / committed */
  --ready-bg:#e7f7f0;
  --amber:#e08a16;
  --amber-bg:#fdf3e2;
  --red:#dc2f4b;
  --red-bg:#fdeaee;
  --purple:#7a54c4;

  /* role colours */
  --seller:#3b6df0; --buyer:#0ea371; --solicitor:#7a54c4; --estate_agent:#e08a16;

  --radius:14px; --radius-sm:9px;
  --shadow:0 1px 2px rgba(16,30,54,.06), 0 8px 24px rgba(16,30,54,.05);
  --shadow-sm:0 1px 2px rgba(16,30,54,.07);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,
  Helvetica,Arial,sans-serif;background:var(--bg);color:var(--ink);line-height:1.55;
  -webkit-font-smoothing:antialiased}
a{color:var(--accent-ink);text-decoration:none}
a:hover{text-decoration:underline}
h1{font-size:1.7rem;letter-spacing:-.02em;margin:.2rem 0}
h2{font-size:1.2rem;letter-spacing:-.01em;margin:0 0 .3rem}
h3{font-size:1.05rem;margin:.1rem 0}
p{margin:.4rem 0}
.muted{color:var(--muted)}
.small{font-size:.82rem}
/* admin form helpers */
.stack{display:flex;flex-direction:column;gap:.7rem;margin:.6rem 0}
.field-row{display:flex;flex-wrap:wrap;gap:.7rem}
.field-row label{flex:1;min-width:150px;display:flex;flex-direction:column;
  gap:.25rem;font-size:.85rem;color:var(--muted)}
.field-row input,.field-row select{padding:.45rem .55rem;border:1px solid var(--line);
  border-radius:8px;font:inherit}
.check-inline{display:flex;align-items:center;gap:.5rem;font-size:.9rem}
.check-inline input{width:auto}
.order-list{display:flex;flex-direction:column;gap:.3rem;margin:.6rem 0}
.order-row{display:flex;gap:.7rem;align-items:center;padding:.45rem .7rem;
  border:1px solid var(--line);border-radius:8px;background:#fbfcfe;font-size:.9rem}
.order-row.cur{border-color:var(--accent);background:#eef3ff;font-weight:700}
.btn[disabled]{opacity:.45;cursor:not-allowed}
/* password reveal + caps-lock warning */
.pw-wrap{position:relative;display:block}
.pw-wrap .pw-input{padding-right:2.8rem}
.pw-eye{position:absolute;right:.35rem;top:50%;transform:translateY(-50%);
  background:none;border:0;cursor:pointer;color:var(--muted);padding:.35rem;
  display:inline-flex;align-items:center;border-radius:6px}
.pw-eye:hover{color:var(--navy)}
.pw-eye:focus-visible{outline:2px solid var(--accent)}
.pw-eye .eye-off{display:none}
.pw-eye.on .eye-open{display:none}
.pw-eye.on .eye-off{display:inline}
.caps-warn{margin:.45rem 0 .2rem;font-size:.8rem;font-weight:700;color:var(--amber);
  display:flex;align-items:center;gap:.35rem}
/* count badge on link-page tabs (Queries, Documents) */
.tab-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;
  height:18px;padding:0 .35rem;margin-left:.35rem;border-radius:10px;background:var(--accent);
  color:#fff;font-size:.72rem;font-weight:800;vertical-align:middle}
/* back-to-top floating button */
.to-top{position:fixed;right:1.1rem;bottom:1.1rem;z-index:60;width:44px;height:44px;
  border-radius:50%;border:0;background:var(--navy);color:#fff;font-size:1.35rem;line-height:1;
  cursor:pointer;box-shadow:0 3px 12px rgba(16,30,54,.28);display:flex;align-items:center;
  justify-content:center;transition:background .15s,transform .15s}
.to-top:hover{background:var(--accent);transform:translateY(-2px)}
.to-top[hidden]{display:none}
/* operator-only reviewer-presence marker (bottom-right, above the to-top btn) */
.presence{position:fixed;right:1.1rem;bottom:4.4rem;z-index:61;display:flex;
  align-items:center;gap:.5rem;padding:.45rem .8rem;border-radius:999px;
  font-size:.8rem;font-weight:700;color:#fff;background:#475569;
  box-shadow:0 4px 14px rgba(16,30,54,.28);max-width:72vw}
.presence[hidden]{display:none}
.presence .pr-dot{width:9px;height:9px;border-radius:50%;background:#cbd5e1;flex:0 0 auto}
.presence.idle{background:#475569}
.presence.seen{background:#1f6feb}
.presence.online{background:#15803d}
.presence.online .pr-dot{background:#4ade80;
  box-shadow:0 0 0 0 rgba(74,222,128,.7);animation:pr-pulse 1.6s infinite}
@keyframes pr-pulse{0%{box-shadow:0 0 0 0 rgba(74,222,128,.7)}
  70%{box-shadow:0 0 0 9px rgba(74,222,128,0)}
  100%{box-shadow:0 0 0 0 rgba(74,222,128,0)}}
@media(max-width:640px){.presence{font-size:.72rem;right:.6rem;bottom:4rem}}
/* guest-access "ticking clock" banner (under the top bar) */
.access-clock{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;
  padding:.5rem 1.5rem;font-size:.9rem;font-weight:600;
  background:var(--amber-bg);color:#7a4e06;border-bottom:1px solid #f2d9a8}
.access-clock .ac-dot{width:9px;height:9px;border-radius:50%;background:var(--amber);
  box-shadow:0 0 0 0 rgba(224,138,22,.5);animation:ac-pulse 2s infinite}
.access-clock .ac-time{font-variant-numeric:tabular-nums;font-weight:800}
.access-clock .ac-note{color:#9a7636;font-weight:600}
.access-clock.warn{background:#fdeede;border-bottom-color:#f0c589}
.access-clock.urgent{background:var(--red-bg);color:#8d1024;border-bottom-color:#f3b6c1}
.access-clock.urgent .ac-dot{background:var(--red)}
.access-clock.ended{background:var(--red-bg);color:#8d1024;border-bottom-color:#f3b6c1}
.access-clock.ended .ac-dot{animation:none}
@keyframes ac-pulse{0%{box-shadow:0 0 0 0 rgba(224,138,22,.5)}
  70%{box-shadow:0 0 0 7px rgba(224,138,22,0)}100%{box-shadow:0 0 0 0 rgba(224,138,22,0)}}
/* admin accounts: name + expandable dropdown of detail/actions */
.acct-list{display:flex;flex-direction:column;gap:.5rem}
.acct{border:1px solid var(--line);border-radius:10px;background:#fff;overflow:hidden}
.acct[open]{border-color:var(--accent);box-shadow:0 1px 6px rgba(16,30,54,.06)}
.acct>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:.6rem;
  padding:.7rem .85rem}
.acct>summary::-webkit-details-marker{display:none}
.acct>summary:hover{background:var(--line-2)}
.acct-id{display:flex;flex-direction:column;min-width:0;flex:1}
.acct-name{font-weight:700;color:var(--ink);line-height:1.2}
.acct-role{font-size:.8rem;color:var(--muted);white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis}
.acct-chev{color:var(--muted);font-size:.85rem;transition:transform .18s;flex:none}
.acct[open] .acct-chev{transform:rotate(180deg)}
.acct-body{padding:.2rem .85rem .85rem;border-top:1px solid var(--line-2)}
.acct-meta{display:flex;flex-wrap:wrap;gap:.3rem 1.6rem;margin:.6rem 0 0}
.acct-meta div{display:flex;flex-direction:column}
.acct-meta dt{font-size:.72rem;text-transform:uppercase;letter-spacing:.03em;
  color:var(--muted);font-weight:700}
.acct-meta dd{margin:0;font-size:.9rem;color:var(--ink-2)}
.acct-actions{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.85rem}
.acct-actions form{margin:0}

/* ---------- top bar ---------- */
.topbar{display:flex;align-items:center;justify-content:space-between;
  background:var(--panel);padding:.75rem 1.5rem;border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:20;box-shadow:var(--shadow-sm)}
.brand{font-weight:800;font-size:1.25rem;color:var(--navy);display:flex;gap:.45rem;
  align-items:center;letter-spacing:-.02em}
.brand:hover{text-decoration:none}
.brand-mark{display:inline-flex;width:30px;height:30px;border-radius:8px;
  background:linear-gradient(135deg,var(--navy),var(--accent));color:#fff;
  align-items:center;justify-content:center;font-size:1rem}
.topbar nav{display:flex;align-items:center;gap:1.1rem}
.topbar nav a{color:var(--ink-2);font-weight:600;font-size:.92rem}
.topbar nav a:hover{color:var(--navy);text-decoration:none}
.navlinks{display:flex;align-items:center;gap:1.1rem}
.nav-admin{color:var(--danger)!important;font-weight:700}
.nav-toggle{display:none;background:none;border:0;color:var(--navy);
  font-size:1.5rem;line-height:1;cursor:pointer;padding:.1rem .35rem}
.bell-form{margin:0}
.who{color:var(--muted);font-size:.86rem}
.bell{position:relative;font-size:1.1rem;background:none;border:0;cursor:pointer}
.badge{position:absolute;top:-7px;right:-10px;background:var(--red);color:#fff;
  border-radius:20px;padding:.02rem .4rem;font-size:.68rem;font-weight:800}
.chip{font-size:.68rem;font-weight:800;color:#fff;padding:.18rem .6rem;border-radius:20px;
  text-transform:uppercase;letter-spacing:.04em}
.chip-seller{background:var(--seller)} .chip-buyer{background:var(--buyer)}
.chip-solicitor{background:var(--solicitor)} .chip-estate_agent{background:var(--estate_agent)}
.btn-link{color:var(--accent-ink);font-weight:700;font-size:.9rem}

.wrap{max-width:1000px;margin:1.6rem auto;padding:0 1.3rem}
.wrap-narrow{max-width:760px}
.page-head{margin-bottom:1.3rem}
.back{font-size:.88rem;color:var(--muted);font-weight:600}
.back:hover{color:var(--navy)}
.eyebrow{text-transform:uppercase;letter-spacing:.08em;font-size:.72rem;
  font-weight:800;color:var(--accent-ink)}

/* ---------- flashes ---------- */
.flash{padding:.75rem 1rem;border-radius:var(--radius-sm);margin-bottom:.7rem;
  font-weight:600;font-size:.92rem;border:1px solid transparent}
.flash-success{background:var(--ready-bg);color:#0a6b4b;border-color:#bfe8d6}
.flash-danger{background:var(--red-bg);color:#a01834;border-color:#f3c6d0}
.flash-warning{background:var(--amber-bg);color:#8a5a12;border-color:#f3dcb4}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:.4rem;background:var(--navy);color:#fff;
  border:0;padding:.6rem 1.1rem;border-radius:var(--radius-sm);font-size:.95rem;
  font-weight:700;cursor:pointer;transition:.12s}
.btn:hover{background:var(--navy-2);text-decoration:none}
.btn-accent{background:var(--accent)} .btn-accent:hover{background:var(--accent-ink)}
.btn-ghost{background:#fff;color:var(--navy);border:1.5px solid var(--line)}
.btn-ghost:hover{border-color:var(--navy);background:#fff}
.btn-danger{background:#fff;color:var(--red);border:1.5px solid #f3c6d0}
.btn-danger:hover{background:var(--red);color:#fff}
.btn-sm{padding:.4rem .75rem;font-size:.85rem}
.btn[disabled]{opacity:.5;cursor:not-allowed}

/* ---------- forms ---------- */
label{display:block;margin:.65rem 0;font-weight:700;font-size:.86rem;color:var(--ink-2)}
input,select,textarea{width:100%;padding:.55rem .7rem;border:1.5px solid var(--line);
  border-radius:var(--radius-sm);font-size:.96rem;margin-top:.3rem;font-family:inherit;
  background:#fff;color:var(--ink)}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(59,109,240,.12)}

/* ---------- auth ---------- */
.auth-card{max-width:420px;margin:2.5rem auto;background:var(--panel);padding:2rem;
  border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid var(--line)}
.auth-card.center{text-align:center}
.auth-split{display:grid;grid-template-columns:1.1fr .9fr;gap:1.5rem;max-width:880px;
  margin:2.5rem auto}
@media(max-width:760px){.auth-split{grid-template-columns:1fr}}
.auth-hero{padding:2rem;background:linear-gradient(150deg,var(--navy),#20306e);
  color:#fff;border-radius:var(--radius);box-shadow:var(--shadow)}
.auth-hero h1{color:#fff}
.auth-hero .lead{color:#c9d6f3;font-size:1rem}
.auth-hero ul{list-style:none;padding:0;margin:1rem 0 0}
.auth-hero li{padding:.35rem 0 .35rem 1.5rem;position:relative;color:#e4ebfb;font-size:.92rem}
.auth-hero li:before{content:"\2713";position:absolute;left:0;color:#7fe3bb;font-weight:800}
.demo-logins{margin-top:1rem;border-top:1px solid var(--line);padding-top:.8rem}
.demo-logins table{width:100%;border-collapse:collapse;font-size:.82rem}
.demo-logins td{padding:.25rem .3rem;border-bottom:1px solid var(--line-2)}
.demo-logins .role{color:var(--muted)}

/* ---------- panels / cards ---------- */
.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:1.3rem;margin-bottom:1.1rem;box-shadow:var(--shadow)}
.panel h2{display:flex;align-items:center;gap:.5rem}
.panel-note{color:var(--muted);font-size:.85rem;margin-top:-.1rem;margin-bottom:.8rem}

/* ---------- stage + status badges ---------- */
.stage{display:inline-flex;align-items:center;gap:.4rem;font-size:.74rem;font-weight:800;
  padding:.22rem .65rem;border-radius:20px;text-transform:uppercase;letter-spacing:.03em}
.stage:before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}
.stage-preparing{background:#eef2f8;color:#5a6b84}
.stage-sale_ready{background:#e9f0ff;color:var(--accent-ink)}
.stage-committed{background:var(--ready-bg);color:#0a6b4b}
.stage-completing{background:var(--ready-bg);color:#0a6b4b}
.stage-complete{background:#e3f0ea;color:#0a6b4b}
.stage-withdrawn{background:var(--red-bg);color:#a01834}
.pill{font-size:.68rem;font-weight:800;padding:.14rem .55rem;border-radius:20px;
  vertical-align:middle;white-space:nowrap}
.pill-mine{background:#e9f0ff;color:var(--accent-ink)}
.pill-lease{background:#f3edfb;color:var(--purple)}
.pill-home{background:var(--ready-bg);color:#0a6b4b}
.pill-purchase{background:#e9f0ff;color:var(--accent-ink)}
.pill-acting{background:#f3edfb;color:var(--purple)}
.pill-listing{background:var(--amber-bg);color:#8a5a12}
.my-role-desc{font-size:.8rem;font-weight:700;margin:.1rem 0}
.mine-home{color:#0a6b4b}.mine-purchase{color:var(--accent-ink)}
.mine-acting{color:var(--purple)}.mine-listing{color:#8a5a12}
.mine-tag.mine-home{background:var(--ready-bg);color:#0a6b4b}
.mine-tag.mine-purchase{background:#e9f0ff;color:var(--accent-ink)}
.mine-tag.mine-acting{background:#f3edfb;color:var(--purple)}
.mine-tag.mine-listing{background:var(--amber-bg);color:#8a5a12}

/* ---------- health strip ---------- */
.health{display:flex;flex-wrap:wrap;gap:.8rem;margin-bottom:1.2rem}
.health .stat{flex:1;min-width:132px;background:var(--panel);border:1px solid var(--line);
  border-radius:var(--radius);padding:.9rem 1rem;box-shadow:var(--shadow-sm)}
.health .stat .l{white-space:nowrap}
.mkt-status,.rag,.stage,.pill{white-space:nowrap}
.health .stat .n{font-size:1.5rem;font-weight:800;color:var(--navy)}
.health .stat .l{font-size:.78rem;color:var(--muted);text-transform:uppercase;
  letter-spacing:.04em;font-weight:700}
.health .stat.good .n{color:var(--ready)}
.health .stat.warn .n{color:var(--amber)}
.health .stat.bad .n{color:var(--red)}
.banner{border-radius:var(--radius);padding:.8rem 1.1rem;margin-bottom:1.1rem;
  font-weight:600;font-size:.92rem;display:flex;align-items:center;gap:.6rem}
.banner-good{background:var(--ready-bg);color:#0a6b4b;border:1px solid #bfe8d6}
.banner-warn{background:var(--amber-bg);color:#8a5a12;border:1px solid #f3dcb4}
.banner-bad{background:var(--red-bg);color:#a01834;border:1px solid #f3c6d0}

/* ---------- tasks ---------- */
.task-list{list-style:none;margin:0;padding:0}
.task-list li{display:flex;justify-content:space-between;align-items:center;gap:1rem;
  padding:.7rem 0;border-bottom:1px solid var(--line-2)}
.task-list li:last-child{border-bottom:0}
.task-what{font-weight:700}
.task-where{color:var(--muted);font-size:.84rem}
.task-kind{font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;
  padding:.12rem .5rem;border-radius:20px;background:#eef2f8;color:#5a6b84}
.task-kind.contract{background:#e9f0ff;color:var(--accent-ink)}

/* ---------- dashboard cards ---------- */
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem}
.chain-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:1.15rem;box-shadow:var(--shadow);color:var(--ink);display:block}
.chain-card:hover{text-decoration:none;border-color:var(--accent);transform:translateY(-2px);
  transition:.12s;box-shadow:0 6px 24px rgba(16,30,54,.1)}
.chain-card .top{display:flex;justify-content:space-between;align-items:baseline}
.ref{font-size:.74rem;color:var(--muted);font-weight:600}
.minibar{height:7px;background:var(--line);border-radius:20px;overflow:hidden;margin:.7rem 0 .5rem}
.minibar>span{display:block;height:100%;background:var(--ready);border-radius:20px}
.chain-card .meta{display:flex;gap:1rem;font-size:.82rem;color:var(--muted)}
.mine-tag{font-size:.8rem;background:#e9f0ff;color:var(--accent-ink);padding:.3rem .55rem;
  border-radius:var(--radius-sm);margin-top:.6rem;font-weight:600}
.empty{padding:2.2rem;text-align:center;color:var(--muted);background:var(--panel);
  border-radius:var(--radius);border:1px dashed var(--line)}

/* ---------- notifications ---------- */
.notif-head{display:flex;justify-content:space-between;align-items:center}
.notif-list{list-style:none;margin:.3rem 0 0;padding:0}
.notif-list li{padding:.5rem 0;border-bottom:1px solid var(--line-2);font-size:.9rem}
.notif-list li:last-child{border-bottom:0}
.notif-list li.unread{font-weight:700}
.notif-list li.unread:before{content:"";display:inline-block;width:7px;height:7px;
  background:var(--accent);border-radius:50%;margin-right:.45rem;vertical-align:middle}

/* ---------- chain overview rail ---------- */
.chain-rail{margin-top:.3rem}
.link-row{display:flex;gap:1rem}
.rail{display:flex;flex-direction:column;align-items:center;width:40px;flex-shrink:0}
.node{width:34px;height:34px;border-radius:50%;background:#fff;border:2.5px solid var(--accent);
  color:var(--accent-ink);display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:.9rem}
.node.done{background:var(--ready);border-color:var(--ready);color:#fff}
.node.wd{background:var(--red-bg);border-color:var(--red);color:var(--red)}
.rail-line{flex:1;width:40px;margin:0;min-height:52px;
  background:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='40'%20height='42'%20viewBox='0%200%2040%2042'%3E%3Cg%20fill='none'%3E%3Cg%20stroke='%236f7fa6'%20stroke-width='4'%3E%3Crect%20x='14'%20y='-8'%20width='12'%20height='38'%20rx='6'/%3E%3Crect%20x='5'%20y='22'%20width='30'%20height='12'%20rx='6'/%3E%3C/g%3E%3Cg%20stroke='%23c6d0e6'%20stroke-width='1.3'%3E%3Crect%20x='14'%20y='-8'%20width='12'%20height='38'%20rx='6'/%3E%3Crect%20x='5'%20y='22'%20width='30'%20height='12'%20rx='6'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") repeat-y center top;
  background-size:40px 42px}
.rail-line.done{background:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='40'%20height='42'%20viewBox='0%200%2040%2042'%3E%3Cg%20fill='none'%3E%3Cg%20stroke='%230ea371'%20stroke-width='4'%3E%3Crect%20x='14'%20y='-8'%20width='12'%20height='38'%20rx='6'/%3E%3Crect%20x='5'%20y='22'%20width='30'%20height='12'%20rx='6'/%3E%3C/g%3E%3Cg%20stroke='%23b3ead1'%20stroke-width='1.3'%3E%3Crect%20x='14'%20y='-8'%20width='12'%20height='38'%20rx='6'/%3E%3Crect%20x='5'%20y='22'%20width='30'%20height='12'%20rx='6'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") repeat-y center top;background-size:40px 42px}
.link-row.wd .rail-line{opacity:.4;filter:grayscale(1)}
.link-body{flex:1;background:var(--panel);border:1px solid var(--line);
  border-radius:var(--radius);padding:1.1rem;margin-bottom:1rem;box-shadow:var(--shadow)}
.link-row.mine .link-body{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),var(--shadow)}
.link-row.wd .link-body{opacity:.75}
.link-top{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;
  flex-wrap:wrap}
.link-top h3 a{color:var(--ink)}
.headline{font-size:.9rem;font-weight:600;color:var(--amber);margin-top:.15rem}
.headline.ok{color:var(--ready)}
.badges{display:flex;gap:.4rem;flex-wrap:wrap;align-items:center;margin:.2rem 0 .4rem}
.mini-stages{display:flex;gap:.3rem;margin:.6rem 0 .2rem}
.mini-stages .ms{flex:1;height:6px;border-radius:20px;background:var(--line)}
.mini-stages .ms.on{background:var(--ready)}
.detail-grid{display:flex;flex-wrap:wrap;gap:.5rem 1.6rem;margin-top:.7rem;font-size:.9rem}
.detail-grid.cols{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.detail-grid .k{display:block;font-size:.7rem;color:var(--muted);text-transform:uppercase;
  letter-spacing:.04em;font-weight:700;margin-bottom:.05rem}
.contacts{margin-top:.7rem;font-size:.85rem;color:var(--ink-2);border-top:1px dashed var(--line);
  padding-top:.6rem}
.contacts .lbl{font-weight:800;color:var(--ink)}
.contact{display:inline-block;margin-right:.9rem}
.level-tag{margin-top:.6rem;font-size:.72rem;color:var(--muted)}

/* ---------- link detail: stage stepper ---------- */
.stepper{display:flex;gap:0;margin:1rem 0 .4rem;overflow:hidden;border-radius:var(--radius-sm);
  border:1px solid var(--line)}
.stepper .step{flex:1;text-align:center;padding:.55rem .3rem;font-size:.76rem;font-weight:700;
  background:#fff;color:var(--muted);position:relative}
.stepper .step.on{background:var(--ready);color:#fff}
.stepper .step.cur{background:var(--navy);color:#fff}
.stepper .step+.step{border-left:1px solid var(--line)}

/* ---------- tabs ---------- */
.tabs{display:flex;gap:.3rem;flex-wrap:wrap;margin:1rem 0;border-bottom:2px solid var(--line)}
.tabs a{padding:.5rem .9rem;font-weight:700;font-size:.9rem;color:var(--muted);
  border-bottom:2px solid transparent;margin-bottom:-2px}
.tabs a:hover{color:var(--navy);text-decoration:none}

/* ---------- progress ---------- */
.progress{height:10px;background:var(--line);border-radius:20px;overflow:hidden}
.progress>span{display:block;height:100%;background:var(--accent);border-radius:20px}
.progress.green>span{background:var(--ready)}

/* ---------- milestones / pack lists ---------- */
.rowlist{list-style:none;margin:.6rem 0 0;padding:0}
.rowlist li{display:flex;justify-content:space-between;align-items:center;gap:1rem;
  padding:.6rem .2rem;border-bottom:1px solid var(--line-2)}
.rowlist li:last-child{border-bottom:0}
.item-name{display:flex;align-items:center;gap:.6rem;font-weight:600}
.dot{width:16px;height:16px;border-radius:50%;border:2px solid var(--line);flex-shrink:0}
.dot.complete,.dot.provided{background:var(--ready);border-color:var(--ready)}
.dot.in_progress{background:var(--amber);border-color:var(--amber)}
.dot.not_applicable{background:var(--line);border-color:var(--muted)}
.item-note{font-size:.8rem;color:var(--muted);margin-left:2.2rem}
.state-badge{font-size:.76rem;font-weight:700;color:var(--muted)}
.inline-form{display:flex;gap:.4rem;align-items:center;flex-wrap:wrap}
.inline-form select{width:auto;margin:0}
.pack-edit{margin-left:2.2rem;margin-top:.3rem;display:flex;gap:.5rem;flex-wrap:wrap}
.pack-edit input[type=text]{flex:1;min-width:160px;margin:0}

/* ---------- contract ---------- */
.contract-head{display:flex;justify-content:space-between;align-items:center;gap:1rem;
  flex-wrap:wrap;margin-bottom:.6rem}
.sign-row{display:flex;gap:1rem;flex-wrap:wrap;margin:.8rem 0}
.sign-box{flex:1;min-width:200px;border:1.5px solid var(--line);border-radius:var(--radius-sm);
  padding:.8rem 1rem}
.sign-box.signed{border-color:var(--ready);background:var(--ready-bg)}
.sign-box .who{font-weight:700;color:var(--ink)}
.sign-box .st{font-size:.82rem;color:var(--muted)}
.sign-box.signed .st{color:#0a6b4b;font-weight:700}
.commitment{font-size:1.4rem;font-weight:800;color:var(--navy)}
.cond-list{list-style:none;margin:.5rem 0 0;padding:0}
.cond-list li{display:flex;justify-content:space-between;align-items:center;
  padding:.45rem .2rem;border-bottom:1px solid var(--line-2);font-size:.9rem}
.cond-list .ok{color:var(--ready);font-weight:700}
.cond-list .pending{color:var(--muted)}
.withdraw-box{border:1.5px solid #f3c6d0;border-radius:var(--radius-sm);padding:1rem;
  margin-top:1rem;background:#fff}
.withdraw-box summary{cursor:pointer;font-weight:700;color:var(--red)}
.disclaimer{font-size:.78rem;color:var(--muted);background:var(--line-2);
  border-radius:var(--radius-sm);padding:.6rem .8rem;margin-top:.7rem}

/* ---------- readiness / RAG ---------- */
.rag{display:inline-flex;align-items:center;gap:.35rem;font-size:.72rem;font-weight:800;
  padding:.16rem .55rem;border-radius:20px;text-transform:uppercase;letter-spacing:.03em}
.rag:before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}
.rag-green{background:var(--ready-bg);color:#0a6b4b}
.rag-amber{background:var(--amber-bg);color:#8a5a12}
.rag-red{background:var(--red-bg);color:#a01834}
.ready-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:.7rem}
@media(max-width:620px){.ready-grid{grid-template-columns:1fr}}
.ready-card{border:1px solid var(--line);border-radius:var(--radius-sm);padding:1rem}
.ready-card h3{display:flex;justify-content:space-between;align-items:center;gap:.5rem;margin:0}
.check-list{list-style:none;margin:.5rem 0 0;padding:0}
.check-list li{display:flex;align-items:center;gap:.55rem;padding:.3rem 0;font-size:.9rem}
.check{width:16px;height:16px;border-radius:50%;flex-shrink:0;border:2px solid var(--muted);
  position:relative}
.check.ok{background:var(--ready);border-color:var(--ready)}
.check.partial{background:var(--amber);border-color:var(--amber)}
.check.missing{background:#fff;border-color:#c7cedb}
.task-kind.readiness{background:var(--ready-bg);color:#0a6b4b}

/* ---------- marketing / listing ---------- */
.listing-head{display:flex;justify-content:space-between;align-items:center;gap:1rem;
  flex-wrap:wrap;margin-bottom:.5rem}
.portal-badge{display:inline-flex;align-items:center;gap:.4rem;font-weight:800;
  font-size:.78rem;color:#fff;background:#8324b3;padding:.22rem .6rem;border-radius:20px}
.mkt-status{font-size:.74rem;font-weight:800;padding:.18rem .6rem;border-radius:20px;
  text-transform:uppercase;letter-spacing:.03em}
.mkt-for_sale{background:#e9f0ff;color:var(--accent-ink)}
.mkt-under_offer{background:var(--amber-bg);color:#8a5a12}
.mkt-sold_stc{background:var(--ready-bg);color:#0a6b4b}
.listing-facts{display:flex;gap:1.4rem;flex-wrap:wrap;margin:.5rem 0}
.listing-facts .f{font-size:.95rem}
.listing-facts .f .k{display:block;font-size:.7rem;color:var(--muted);
  text-transform:uppercase;letter-spacing:.04em;font-weight:700}
.asking{font-size:1.5rem;font-weight:800;color:var(--navy)}
.listing-desc{color:var(--ink-2);font-size:.92rem;margin:.6rem 0}
.portal-link{display:inline-flex;align-items:center;gap:.4rem;font-weight:700;
  background:#8324b3;color:#fff;padding:.5rem .9rem;border-radius:var(--radius-sm);margin-top:.3rem}
.portal-link:hover{background:#6b1d93;text-decoration:none}
.masked-hint{font-size:.74rem;color:var(--muted);font-style:italic;margin-left:.3rem}
.listing-mini{font-size:.82rem;color:var(--ink-2);margin-top:.35rem}
.listing-mini .dotsep{color:var(--line)}

/* ---------- documents ---------- */
.doc-list{list-style:none;padding:0;margin:0}
.doc-list li{padding:.55rem 0;border-bottom:1px solid var(--line-2);font-size:.9rem;
  display:flex;justify-content:space-between;gap:1rem}
.upload-form{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1rem;align-items:center}
.upload-form input[type=text]{flex:1;min-width:160px;margin:0}
.upload-form input[type=file]{margin:0}

/* ---------- messages / queries ---------- */
.thread{display:flex;flex-direction:column;gap:.7rem;margin:.6rem 0}
.msg{max-width:85%;background:#f3f6fc;border:1px solid var(--line);border-radius:12px;
  padding:.6rem .85rem}
.msg.mine{align-self:flex-end;background:#e9f0ff;border-color:#cfe0ff}
.msg-meta{font-size:.78rem;color:var(--ink-2);margin-bottom:.25rem;display:flex;
  align-items:center;gap:.4rem;flex-wrap:wrap}
.msg-meta .chip{font-size:.6rem;padding:.08rem .4rem}
.msg-body{white-space:pre-wrap;font-size:.92rem}

/* ---------- pagination ---------- */
.pager{display:flex;justify-content:space-between;align-items:center;gap:1rem;
  margin-top:.9rem;flex-wrap:wrap}
.pager select{width:auto;margin:0;padding:.35rem .5rem;font-size:.85rem}
.pager-pages{display:flex;align-items:center;gap:.25rem;flex-wrap:wrap}
.pager-info{color:var(--muted);font-size:.8rem;margin-right:.4rem}
.pager-btn{border:1px solid var(--line);background:#fff;color:var(--ink-2);
  border-radius:7px;padding:.3rem .62rem;cursor:pointer;font-weight:700;font-size:.82rem}
.pager-btn.cur{background:var(--navy);color:#fff;border-color:var(--navy)}
.pager-btn[disabled]{opacity:.4;cursor:not-allowed}
.pager-ell{color:var(--muted);padding:0 .15rem}

/* ---------- breadcrumbs ---------- */
.crumbs{font-size:.82rem;color:var(--muted);margin-bottom:.5rem}
.crumbs a{color:var(--muted)} .crumbs a:hover{color:var(--navy);text-decoration:none}
.crumbs .sep{margin:0 .4rem;color:var(--line)}

/* ---------- activity log ---------- */
.log-list{list-style:none;margin:.5rem 0 0;padding:0}
.log-list li{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;
  border-bottom:1px solid var(--line-2);font-size:.9rem}
.log-list li:last-child{border-bottom:0}
.log-when{color:var(--muted);font-size:.8rem;white-space:nowrap}
.log-kind{display:inline-block;width:1.4rem}

/* ---------- help / about prose ---------- */
.prose h2{margin-top:1.4rem}
.prose ul{padding-left:1.2rem}
.prose li{margin:.3rem 0}
.role-card{border:1px solid var(--line);border-radius:var(--radius-sm);padding:1rem 1.1rem;
  margin:.7rem 0;background:#fff}
.role-card h3{display:flex;align-items:center;gap:.5rem}
.matrix{width:100%;border-collapse:collapse;margin-top:.6rem;font-size:.86rem}
.matrix th,.matrix td{border:1px solid var(--line);padding:.5rem .6rem;text-align:left}
.matrix th{background:var(--line-2);font-size:.78rem;text-transform:uppercase;
  letter-spacing:.03em;color:var(--ink-2)}
.matrix td .yes{color:var(--ready);font-weight:700}
.matrix td .no{color:var(--red);font-weight:700}
.callout{border-left:4px solid var(--accent);background:#f3f7ff;padding:.9rem 1.1rem;
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;margin:1rem 0}

.foot{text-align:center;color:var(--muted);font-size:.8rem;padding:2.2rem 1rem;
  border-top:1px solid var(--line);margin-top:2rem}
.foot a{color:var(--muted);text-decoration:underline}

@media(max-width:620px){
  .detail-grid.cols,.auth-split{grid-template-columns:1fr}
  .link-top{flex-direction:column}
  .stepper .step{font-size:.64rem}
  .topbar nav{gap:.5rem;justify-content:flex-end}
  .hide-sm,.who.hide-sm{display:none}
  .nav-toggle{display:inline-flex;align-items:center}
  .navlinks{display:none;position:absolute;top:100%;right:.6rem;
    flex-direction:column;align-items:stretch;gap:.1rem;min-width:210px;
    background:var(--panel);border:1px solid var(--line);border-radius:12px;
    box-shadow:0 12px 30px rgba(16,30,54,.18);padding:.45rem;z-index:30}
  .navlinks.open{display:flex}
  .navlinks a,.navlinks .who{display:block;width:100%;padding:.6rem .7rem;
    border-radius:8px;font-size:1rem}
  .navlinks a:hover{background:var(--bg)}
  /* company shown as a full-width banner across the TOP of the popup */
  .navlinks .chip{order:-1;display:block;text-align:center;align-self:auto;
    margin:-.45rem -.45rem .4rem;padding:.6rem .7rem;
    border-radius:12px 12px 0 0;font-size:.66rem;letter-spacing:.08em}
  .navlinks .who{color:var(--ink-2);font-weight:600}
  .wrap{padding:0 .8rem;margin-top:1rem}
  .matrix{display:block;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch}
  .health .stat{min-width:calc(50% - .5rem)}
  h1{font-size:1.4rem}
}
