/* REDeAn responsive UI layer. Mobile-first, Bootstrap-inspired design tokens and components. */
* { box-sizing: border-box; }
:root {
  --ink:#172033; --muted:#667085; --line:#e4e7ec; --bg:#f5f7fb; --card:#fff;
  --primary:#315efb; --primary-dark:#2448c9; --success:#087443; --danger:#b42318;
  --shadow:0 2px 8px rgba(16,24,40,.06); --radius:14px;
}
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--ink); font:15px/1.5 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.topbar { min-height:64px; background:#101828; color:#d0d5dd; display:flex; align-items:center; gap:24px; padding:10px max(18px,calc((100% - 1200px)/2)); position:sticky; top:0; z-index:20; box-shadow:0 1px 8px rgba(0,0,0,.18); }
.topbar nav { display:flex; gap:6px; align-items:center; justify-content:flex-end; flex:1; flex-wrap:wrap; }
.topbar nav a { color:#d0d5dd; text-decoration:none; padding:8px 10px; border-radius:8px; font-size:14px; }
.topbar nav a:hover,.topbar nav a:focus { color:#fff; background:rgba(255,255,255,.1); }
.brand { color:#fff; font-weight:800; font-size:21px; text-decoration:none; letter-spacing:-.03em; white-space:nowrap; }
.nav-toggle { display:none; margin-left:auto; border:1px solid #475467; border-radius:8px; background:transparent; color:#fff; padding:8px 10px; font:inherit; cursor:pointer; }
.container { max-width:1200px; margin:0 auto; padding:clamp(22px,4vw,38px) clamp(14px,3vw,24px) 70px; }
h1,h2,h3,p { margin-top:0; } h1 { font-size:clamp(25px,4vw,34px); line-height:1.15; margin-bottom:6px; letter-spacing:-.03em; } h2 { font-size:19px; margin-bottom:18px; } h3 { font-size:15px; margin-top:25px; }
.muted,small { color:var(--muted); } .eyebrow { color:var(--primary); text-transform:uppercase; letter-spacing:.08em; font-size:11px; font-weight:800; margin-bottom:6px; }
.page-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin-bottom:25px; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:42px; border:1px solid #d0d5dd; border-radius:9px; background:#fff; color:var(--ink); cursor:pointer; font:inherit; padding:9px 14px; text-decoration:none; transition:background .15s,border-color .15s,transform .15s,box-shadow .15s; }
.button:hover,.button:focus { border-color:#98a2b3; box-shadow:0 2px 5px rgba(16,24,40,.08); transform:translateY(-1px); }.button.primary { background:var(--primary); border-color:var(--primary); color:#fff; }.button.primary:hover { background:var(--primary-dark); }.button.secondary { background:transparent; }.button.danger { background:var(--danger); border-color:var(--danger); color:#fff; }
.filters { display:flex; gap:10px; margin-bottom:18px; align-items:center; }.filters input { flex:1; min-width:180px; }
input,select,textarea { border:1px solid #d0d5dd; border-radius:9px; background:#fff; color:var(--ink); font:inherit; padding:10px 11px; width:100%; min-height:42px; transition:border-color .15s,box-shadow .15s; }
input:focus,select:focus,textarea:focus { outline:0; border-color:var(--primary); box-shadow:0 0 0 3px rgba(49,94,251,.14); } textarea { resize:vertical; min-height:80px; }
label { display:flex; flex-direction:column; gap:6px; font-size:13px; font-weight:650; } input[type=checkbox] { width:auto; min-height:auto; accent-color:var(--primary); }
.table-card,.form-card,.card { background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:clamp(16px,3vw,23px); margin-bottom:22px; box-shadow:var(--shadow); }
.section-title { display:flex; align-items:center; gap:10px; justify-content:space-between; }.section-title h2 { margin-bottom:0; }.count { background:#eef2ff; color:#293b91; border-radius:999px; padding:3px 10px; font-size:12px; font-weight:700; }
.table-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; border-radius:10px; } table { border-collapse:collapse; width:100%; min-width:720px; } th,td { text-align:left; border-bottom:1px solid var(--line); padding:13px 10px; vertical-align:top; } tr:last-child td { border-bottom:0; } th { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.06em; white-space:nowrap; } td small { display:block; margin-top:2px; }.property-link { font-weight:750; color:var(--primary); text-decoration:none; }.property-link:hover { text-decoration:underline; }
.status { border-radius:999px; display:inline-block; padding:4px 9px; font-size:12px; font-weight:750; background:#eef2f6; color:#475467; white-space:nowrap; }.status-purchased,.status-sold { background:#dcfae6; color:#087443; }.status-passed,.status-lost { background:#fee4e2; color:#b42318; }.status-offersent,.status-negotiating,.status-undercontract { background:#fff3d6; color:#93370d; }.status-analyzing { background:#e0f2fe; color:#075985; }
.form-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }.form-grid.two { grid-template-columns:repeat(2,minmax(0,1fr)); }.wide { grid-column:1/-1; }
.alert { padding:12px 15px; border-radius:10px; margin-bottom:18px; }.alert ul { margin:0; }.alert.success { background:#dcfae6; color:var(--success); }.alert.error { background:#fee4e2; color:var(--danger); }
.empty { color:var(--muted); border:1px dashed var(--line); padding:20px; text-align:center; border-radius:10px; }.summary-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:22px; }.metric { background:#fff; border:1px solid var(--line); border-radius:12px; padding:17px; box-shadow:var(--shadow); }.metric span { display:block; color:var(--muted); font-size:13px; }.metric strong { display:block; font-size:clamp(19px,3vw,24px); margin-top:5px; }
.detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; }.details { display:grid; grid-template-columns:1fr 1fr; gap:10px 20px; }.details dt { color:var(--muted); }.details dd { margin:0; font-weight:650; }.compact-form { display:grid; gap:13px; }.timeline { border-left:2px solid #dbe3ff; padding-left:17px; }.timeline-item { position:relative; padding-bottom:17px; }.timeline-item:before { content:""; position:absolute; left:-24px; top:5px; width:8px; height:8px; border:2px solid var(--primary); border-radius:50%; background:#fff; }.timeline-item strong { display:inline-block; margin-right:10px; }.timeline-item time { color:var(--muted); font-size:12px; }.timeline-item p { margin:5px 0; }.top-gap { margin-top:20px; border-top:1px solid var(--line); padding-top:18px; }.inline-form { display:flex; gap:10px; align-items:center; }.inline-form select { width:auto; }.grow { flex:1; }.notes-list { margin-top:18px; border-top:1px solid var(--line); }.notes-list div { padding:14px 0; border-bottom:1px solid var(--line); }.notes-list time { color:var(--muted); font-size:12px; margin-left:10px; }.notes-list p { margin:5px 0 0; }.back-link { color:var(--primary); text-decoration:none; }.button-row { display:flex; gap:10px; margin-top:18px; flex-wrap:wrap; }.auth-shell { min-height:100vh; display:grid; place-items:center; padding:20px; background:linear-gradient(135deg,#eef2ff,#f8fafc); }.auth-card { width:min(420px,100%); background:#fff; border:1px solid var(--line); border-radius:16px; box-shadow:0 8px 30px rgba(16,24,40,.1); padding:28px; }.auth-form { display:grid; gap:14px; }.small { font-size:12px; }.bar-list { display:grid; gap:10px; }.bar-row { display:grid; grid-template-columns:100px 1fr 34px; gap:10px; align-items:center; }.bar { background:#eef2f6; border-radius:999px; height:10px; overflow:hidden; }.bar i { display:block; height:100%; background:linear-gradient(90deg,#315efb,#7ea2ff); border-radius:999px; }.rank-list { display:grid; gap:8px; }.rank-list div { display:flex; justify-content:space-between; align-items:center; padding:10px 12px; background:#f9fafb; border:1px solid var(--line); border-radius:8px; }.danger-zone { border-color:rgba(180,35,24,.35); }
@media (max-width:900px) { .form-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.summary-grid { grid-template-columns:repeat(2,1fr); }.detail-grid { grid-template-columns:1fr; } }
@media (max-width:640px) { .topbar { align-items:center; flex-wrap:wrap; gap:8px; padding:12px 14px; }.nav-toggle { display:block; }.topbar nav { display:none; width:100%; flex-direction:column; align-items:stretch; gap:2px; padding-top:6px; }.topbar.nav-open nav { display:flex; }.topbar nav a { padding:10px 8px; font-size:14px; }.container { padding:22px 12px 50px; }.page-heading { flex-direction:column; margin-bottom:20px; }.page-heading > .button,.page-heading > a.button { width:100%; }.form-grid,.form-grid.two,.summary-grid { grid-template-columns:1fr; }.form-grid .wide { grid-column:auto; }.filters,.inline-form { flex-wrap:wrap; }.filters > *, .inline-form > * { width:100%; }.inline-form .grow { min-width:100%; order:-1; }.details { grid-template-columns:1fr; }.table-card,.form-card,.card { padding:15px; border-radius:11px; } }
@media (max-width:380px) { h1 { font-size:25px; }.button { width:100%; }.button-row .button { flex:1; }.bar-row { grid-template-columns:82px 1fr 25px; font-size:13px; } }
