/* ============================================================
   RP-DTARI — Real Property Digital Twin & Audit Readiness Integrator
   Shared design system. Dark-navy professional theme.
   PRIDE holds the data. We do the work.
   ============================================================ */
:root{
  --navy:#0A1226; --navy2:#14203D; --navy3:#1E2C4F; --navy-line:#2C3B63;
  --gold:#D4AF37; --gold-soft:#F3E3A7; --gold-dim:#8C7A3A;
  --red:#C0392B; --red-soft:#FDECEA;
  --black:#151515;
  --amber:#E6A700; --amber-soft:#FFF8E1;
  --green:#1E8E3E; --green-soft:#E8F5E9;
  --blue:#1A4F8B; --blue-soft:#EAF1F8;
  --ink:#1C1C1C; --muted:#6B6B6B; --faint:#9A9A9A;
  --line:#E2E2E2; --bg:#F4F2EA; --card:#FFFFFF;
  --shadow:0 1px 3px rgba(10,18,38,.08), 0 6px 18px rgba(10,18,38,.05);
  --radius:12px;
  --sidebar-w:232px;
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:var(--font);background:var(--bg);color:var(--ink);line-height:1.5;-webkit-text-size-adjust:100%}
a{color:var(--blue)}
button{font-family:var(--font)}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

/* ============ APP SHELL ============ */
.shell{display:flex;min-height:100vh}

.sidebar{background:var(--navy);color:#E9E6DA;width:var(--sidebar-w);flex:none;
  display:flex;flex-direction:column;position:sticky;top:0;height:100vh;z-index:60}
.sidebar .brand{padding:18px 18px 4px;font-weight:800;letter-spacing:2.5px;font-size:1.3rem;color:#fff}
.sidebar .brand em{font-style:normal;color:var(--gold)}
.sidebar .brand-sub{padding:0 18px;font-size:.68rem;letter-spacing:1.4px;color:#A99E78;text-transform:uppercase}
.sidebar .mode-pill{margin:12px 18px 4px;font-size:.7rem;font-weight:800;letter-spacing:1px;
  padding:5px 9px;border-radius:20px;text-align:center;text-transform:uppercase}
.mode-pill.example{background:#3A2E08;color:var(--gold-soft);border:1px solid var(--gold-dim)}
.mode-pill.live{background:#0E2B17;color:#9FE6B1;border:1px solid var(--green)}
.sidebar nav{margin-top:14px;display:flex;flex-direction:column;gap:2px;padding:0 10px;overflow-y:auto}
.sidebar nav a{color:#CFC9B4;text-decoration:none;font-size:.9rem;font-weight:600;
  padding:9px 12px;border-radius:8px;display:flex;gap:10px;align-items:center;border-left:3px solid transparent}
.sidebar nav a .ico{width:20px;text-align:center;font-size:1rem}
.sidebar nav a:hover{background:var(--navy2);color:#fff}
.sidebar nav a.active{background:var(--navy2);color:var(--gold);border-left-color:var(--gold)}
.sidebar .side-foot{margin-top:auto;padding:14px 18px;border-top:1px solid var(--navy-line);font-size:.78rem;color:#A99E78}
.sidebar .side-foot .user{color:#fff;font-weight:700;font-size:.86rem}
.sidebar .side-foot button{margin-top:8px;background:none;border:1px solid var(--navy-line);color:#CFC9B4;
  border-radius:6px;padding:5px 10px;font-size:.78rem;cursor:pointer}
.sidebar .side-foot button:hover{border-color:var(--gold);color:var(--gold)}

.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{background:var(--card);border-bottom:1px solid var(--line);padding:12px 24px;
  display:flex;align-items:center;gap:16px;position:sticky;top:0;z-index:40}
.topbar h1{font-size:1.25rem;margin:0;color:var(--navy);letter-spacing:.2px}
.topbar .crumb{font-size:.8rem;color:var(--muted)}
.topbar .spacer{flex:1}
.content{padding:22px 24px 60px;max-width:1180px;width:100%;margin:0 auto}
.footer{margin-top:auto;text-align:center;color:var(--faint);font-size:.8rem;padding:22px 16px 30px}
.footer .sig{color:var(--gold-dim);font-style:italic}

/* ============ TYPE ============ */
h2.sec{font-size:1.08rem;color:var(--navy);border-bottom:2px solid var(--gold);padding-bottom:5px;margin:26px 0 12px}
h2.sec:first-child{margin-top:4px}
h3.sub{font-size:.98rem;color:var(--navy);margin:18px 0 8px}
p{margin:.5em 0}
.hint{font-size:.82rem;color:var(--muted)}
.small{font-size:.85rem}
.mono{font-family:var(--mono)}
.kicker{font-size:.72rem;letter-spacing:2px;text-transform:uppercase;color:var(--gold-dim);font-weight:800}

/* ============ CARDS / KPI ============ */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:16px 18px;margin:12px 0;box-shadow:var(--shadow)}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:14px 0}
.kpi{background:var(--card);border:1px solid var(--line);border-top:4px solid var(--navy);
  border-radius:var(--radius);padding:14px 16px;box-shadow:var(--shadow)}
.kpi.gold{border-top-color:var(--gold)} .kpi.red{border-top-color:var(--red)}
.kpi.green{border-top-color:var(--green)} .kpi.blue{border-top-color:var(--blue)}
.kpi .num{font-size:1.7rem;font-weight:800;color:var(--navy);line-height:1.15}
.kpi .num.red{color:var(--red)} .kpi .num.green{color:var(--green)} .kpi .num.gold{color:var(--gold-dim)}
.kpi .lbl{font-size:.78rem;color:var(--muted);text-transform:uppercase;letter-spacing:.6px;margin-top:2px}
.kpi .delta{font-size:.82rem;margin-top:4px;font-weight:700}
.kpi .delta.up{color:var(--green)} .kpi .delta.down{color:var(--red)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.chart-box{position:relative;height:260px}
.chart-box.tall{height:320px}

/* ============ TABLES ============ */
table.data{width:100%;border-collapse:collapse;font-size:.9rem}
table.data th{background:var(--navy);color:#fff;padding:9px 10px;text-align:left;font-size:.82rem;letter-spacing:.4px}
table.data td{padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:top}
table.data tr:hover td{background:#FBFAF4}
table.data tr.total td{font-weight:800;border-top:2px solid var(--navy)}
table.data tr.clickable{cursor:pointer}
.table-wrap{overflow-x:auto}

/* ============ BADGES / RAG ============ */
.badge{display:inline-block;font-size:.72rem;font-weight:800;letter-spacing:.5px;padding:3px 9px;border-radius:20px;text-transform:uppercase;white-space:nowrap}
.badge.navy{background:var(--navy);color:#fff}
.badge.gold{background:var(--gold-soft);color:#6B5300;border:1px solid var(--gold)}
.badge.green{background:var(--green-soft);color:#14532D;border:1px solid #9FE6B1}
.badge.red{background:var(--red-soft);color:#7B1D13;border:1px solid #F0B5AE}
.badge.amber{background:var(--amber-soft);color:#7A5C00;border:1px solid var(--amber)}
.badge.grey{background:#EFEFEF;color:#555;border:1px solid #D5D5D5}
.badge.blue{background:var(--blue-soft);color:#123A63;border:1px solid #9FC0E4}
.dot{display:inline-block;width:11px;height:11px;border-radius:50%;margin-right:6px;vertical-align:baseline;flex:none}
.dot.red{background:var(--red)} .dot.black{background:var(--black)}
.dot.amber{background:var(--amber)} .dot.green{background:var(--green)} .dot.grey{background:#B9B9B9}
.rag-legend{display:flex;gap:16px;flex-wrap:wrap;font-size:.84rem;color:var(--muted);padding:8px 2px}

/* ============ BUTTONS ============ */
.btn{display:inline-flex;align-items:center;gap:8px;border:none;border-radius:9px;padding:11px 18px;
  font-size:.95rem;font-weight:700;cursor:pointer;text-decoration:none;text-align:center;justify-content:center}
.btn-gold{background:var(--gold);color:var(--navy)}
.btn-gold:hover{background:#C69F2E}
.btn-navy{background:var(--navy);color:#fff}
.btn-navy:hover{background:var(--navy3)}
.btn-ghost{background:#fff;border:2px solid var(--navy);color:var(--navy)}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold-dim)}
.btn-green{background:var(--green);color:#fff}
.btn-red{background:var(--red);color:#fff}
.btn-sm{padding:7px 12px;font-size:.85rem;border-radius:7px}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.btn-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.btn-row .btn{flex:1;min-width:150px}

/* ============ FORMS ============ */
label{display:block;font-weight:700;margin:12px 0 4px;color:var(--navy);font-size:.9rem}
label:first-child{margin-top:2px}
input[type=text],input[type=number],input[type=date],input[type=email],input[type=password],
select,textarea{width:100%;padding:10px 11px;border:2px solid #C9C9C9;border-radius:8px;
  font-size:1rem;background:#fff;color:var(--ink);font-family:var(--font)}
input:focus,select:focus,textarea:focus{border-color:var(--gold);outline:none}
input[readonly].auto{background:#F0F0EC;color:#555}
textarea{min-height:74px;resize:vertical}
.field-error{border-color:var(--red) !important;background:#FFF7F6}
.err-msg{color:var(--red);font-size:.84rem;font-weight:700;margin-top:4px}
.ok-box{background:var(--green-soft);border:1px solid #9FE6B1;border-radius:8px;padding:10px 12px;font-size:.9rem}
.warn-box{background:var(--amber-soft);border:1px solid var(--amber);border-radius:8px;padding:10px 12px;font-size:.9rem;margin-top:10px}
.hard-box{background:var(--red-soft);border:2px solid var(--red);border-radius:8px;padding:12px 14px;font-size:.92rem;margin-top:10px}
.hard-box .t{font-weight:800;color:var(--red);letter-spacing:.5px}
.grid-form{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
.grid-form .full{grid-column:1/-1}

/* toggle choice cards */
.cats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:8px 0}
.cats.c2{grid-template-columns:1fr 1fr}
.cat{border:3px solid #BBB;border-radius:10px;background:#fff;padding:12px 6px;text-align:center;
  font-weight:800;font-size:.9rem;cursor:pointer;user-select:none}
.cat .sub{display:block;font-weight:400;font-size:.72rem;color:var(--muted);margin-top:2px}
.cat.sel-found{border-color:var(--green);background:var(--green-soft)}
.cat.sel-gone{border-color:var(--red);background:var(--red-soft)}
.cat.sel-admin{border-color:var(--amber);background:var(--amber-soft)}
.cat.sel-clean{border-color:#999;background:#F2F2F2}
.cat.sel-navy{border-color:var(--navy);background:var(--blue-soft)}

/* ============ TASKS / LISTS ============ */
.task{display:flex;gap:10px;align-items:flex-start;padding:10px 4px;border-bottom:1px solid var(--line)}
.task:last-child{border-bottom:none}
.task .t-dot{width:13px;height:13px;border-radius:50%;flex:none;margin-top:4px}
.task .t-body{flex:1;min-width:0}
.task .t-title{font-weight:700}
.task .t-sub{font-size:.84rem;color:var(--muted)}
.finding{border:2px solid var(--line);border-radius:var(--radius);padding:14px;margin:12px 0;background:#FFFDF7}
.finding .f-head{display:flex;gap:8px;align-items:center;flex-wrap:wrap}

/* ============ BANNERS ============ */
.example-banner{background:#FFF8E1;border:2px dashed var(--amber);border-radius:10px;
  padding:10px 14px;font-weight:700;margin:0 0 14px;color:#7A5C00;font-size:.92rem}
.limits{background:#F0EDE2;border:1px solid #D8D2BD;border-radius:10px;padding:10px 14px;
  font-size:.82rem;color:#5C573F;margin:22px 0 6px;line-height:1.45}

/* ============ TIMELINE (born/died) ============ */
.timeline{position:relative;margin:8px 0 8px 8px;padding-left:26px}
.timeline::before{content:"";position:absolute;left:7px;top:6px;bottom:6px;width:3px;background:linear-gradient(var(--green),var(--gold) 55%,var(--red));border-radius:2px}
.tl-ev{position:relative;padding:8px 0 8px 4px}
.tl-ev::before{content:"";position:absolute;left:-25px;top:15px;width:13px;height:13px;border-radius:50%;
  background:#fff;border:3px solid var(--navy)}
.tl-ev.born::before{border-color:var(--green)}
.tl-ev.died::before{border-color:var(--red)}
.tl-ev .tl-date{font-family:var(--mono);font-size:.8rem;color:var(--muted)}
.tl-ev .tl-title{font-weight:800;color:var(--navy)}
.tl-clock{background:var(--navy);color:#E9E6DA;border-radius:10px;padding:12px 14px;margin:12px 0;font-size:.9rem}
.tl-clock b{color:var(--gold)}
.tl-clock .remain{color:#9FE6B1;font-weight:800}

/* ============ EFIF TREE (filing) ============ */
.tree{font-family:var(--mono);font-size:.86rem;line-height:1.7}
.tree .lvl1{font-weight:800;color:var(--navy)}
.tree .lvl2{margin-left:22px}
.tree .lvl3{margin-left:44px;color:#444}
.tree .doc-file{color:var(--blue)}
.dropzone{border:3px dashed var(--gold-dim);border-radius:14px;padding:26px;text-align:center;
  background:#FFFDF2;color:#6B5300;font-weight:700}
.dropzone.drag{border-color:var(--gold);background:var(--amber-soft)}

/* ============ MAP ============ */
#map{height:560px;border-radius:var(--radius);border:1px solid var(--line);box-shadow:var(--shadow);z-index:1}
.leaflet-popup-content{font-family:var(--font)}

/* ============ MEMO ============ */
.memo{background:#fff;border:1px solid #999;max-width:816px;margin:0 auto;padding:54px 72px;
  font-family:"Times New Roman",Times,serif;font-size:12pt;color:#000;box-shadow:0 2px 10px rgba(0,0,0,.14)}
.memo .lh{border-bottom:3px double #000;padding-bottom:8px;margin-bottom:14px;text-align:center}
.memo .lh .d1{font-weight:bold;font-size:13.5pt;letter-spacing:.5px}
.memo .lh .d2{font-size:10.5pt}
.memo .sym{display:flex;justify-content:space-between;margin:14px 0;font-size:11pt}
.memo p.body{margin:10px 0;text-align:justify;line-height:1.55}
.memo .subj{font-weight:bold}
.memo .sig{margin-top:56px;line-height:1.4;margin-left:50%}
.memo .sig .name{font-weight:bold;text-transform:uppercase}
.memo .encl-row{display:flex;gap:24px;margin-top:56px}
.memo .encl-row .encl{flex:0 0 42%}
.memo .encl-row .sig2{flex:1;line-height:1.4}
.memo .encl-row .sig2 .name{font-weight:bold;text-transform:uppercase}
.memo .closings{margin-top:18px;line-height:1.5;white-space:pre-line}
.memo p.mfr{font-weight:bold;letter-spacing:.4px}

/* ============ PRINTABLE FORM DOCUMENTS ============ */
.doc{background:#fff;border:1px solid #333;margin:0 auto;padding:26px;color:#000;
  font-family:Arial,Helvetica,sans-serif;font-size:10pt;box-shadow:0 2px 10px rgba(0,0,0,.14)}
.doc h2.doc-title{text-align:center;border:none;margin:0 0 2px;color:#000;font-size:13pt}
.doc .doc-sub{text-align:center;font-size:9pt;color:#333;margin-bottom:4px}
.doc .doc-note{background:#FFF8E1;border:1px dashed var(--amber);border-radius:6px;
  padding:8px 10px;font-size:8.5pt;margin:10px 0;color:#6B5300}
.doc table.blocks{width:100%;border-collapse:collapse;margin:10px 0;font-size:9.5pt}
.doc table.blocks td,.doc table.blocks th{border:1px solid #333;padding:5px 7px;vertical-align:top}
.doc table.blocks th{background:#EEE;text-align:left;font-size:9pt}
.doc .blk-num{font-weight:800;white-space:nowrap}
.doc .sig-line{margin-top:22px;border-top:1px solid #000;padding-top:4px;font-size:9pt}
.doc .check{font-weight:800}
.doc.landscape{max-width:1050px}
.doc.portrait{max-width:800px}

/* ============ TOAST ============ */
.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%) translateY(24px);
  background:var(--navy);color:#fff;font-weight:700;padding:11px 24px;border-radius:24px;
  border:2px solid var(--gold);opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;z-index:300;font-size:.95rem}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.draft-status{font-size:.82rem;color:var(--muted);margin-top:6px}

/* ============ LOGIN ============ */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(1200px 600px at 50% -10%,var(--navy3),var(--navy));padding:20px}
.login-card{background:#fff;border-radius:16px;max-width:420px;width:100%;padding:32px 30px;box-shadow:0 18px 50px rgba(0,0,0,.45)}
.login-card .brand{font-weight:800;letter-spacing:2.5px;font-size:1.6rem;color:var(--navy);text-align:center}
.login-card .brand em{font-style:normal;color:var(--gold-dim)}
.login-card .tag{text-align:center;color:var(--muted);font-size:.85rem;margin:4px 0 18px}
.login-card .motto{text-align:center;font-style:italic;color:var(--gold-dim);font-size:.9rem;margin-top:16px}

/* ============ MODAL ============ */
.modal-bg{position:fixed;inset:0;background:rgba(10,18,38,.62);z-index:200;display:none;align-items:flex-start;justify-content:center;padding:30px 14px;overflow-y:auto}
.modal-bg.open{display:flex}
.modal{background:#fff;border-radius:14px;max-width:760px;width:100%;padding:24px;box-shadow:0 20px 60px rgba(0,0,0,.4)}
.modal h2{margin-top:0;color:var(--navy);border-bottom:2px solid var(--gold);padding-bottom:6px}

/* ============ UTIL ============ */
.flex{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.right{margin-left:auto}
.mt0{margin-top:0}.mb0{margin-bottom:0}
.nowrap{white-space:nowrap}
.hidden{display:none !important}

/* ============ PRINT ============ */
/* ---- Capacity Self-Watch (tank gauge) ---- */
.cap-card{margin-bottom:18px}
.cap-row{margin:12px 0 14px}
.cap-top{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:5px}
.cap-lbl{font-weight:800;font-size:.92rem}
.cap-val{font-size:.8rem;color:var(--muted)}
.cap-bar{height:12px;background:#EFEFE9;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.cap-fill{height:100%;border-radius:8px;transition:width .6s ease}
.cap-fill.green{background:linear-gradient(90deg,#1E8E3E,#43B35C)}
.cap-fill.amber{background:linear-gradient(90deg,#C98A00,#F0BE3E)}
.cap-fill.red{background:linear-gradient(90deg,#A5271B,#E4574C)}
.cap-voice{border-radius:10px;padding:10px 14px;margin:4px 0 12px;font-size:.9rem;line-height:1.45}
.cap-voice.green{background:var(--green-soft);border:1px solid #9FE6B1;color:#14532D}
.cap-voice.amber{background:var(--amber-soft);border:1px solid var(--amber);color:#6B5200}
.cap-voice.red{background:var(--red-soft);border:1px solid #E4574C;color:#7B1D13}

@media print{
  .sidebar,.topbar,.no-print,.toast,.footer,.example-banner{display:none !important}
  body{background:#fff}
  .shell{display:block}
  .content{max-width:none;padding:0}
  .card{box-shadow:none;border:none;padding:0;margin:0}
  .memo{box-shadow:none;border:none;max-width:none;padding:0}
  .doc{box-shadow:none;border:none;max-width:none;padding:0}
  a{color:#000;text-decoration:none}
}
@page landscape1354{size:11in 8.5in;margin:.4in}
@page portrait337{size:8.5in 11in;margin:.5in}
@page memoPage{size:8.5in 11in;margin:1in}

/* ============ FORM FIDELITY (v8) ============ */
.doc .form-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px}
.doc .form-head .ph{font-weight:700;text-align:right;white-space:nowrap}
.doc .hdr-flex{display:flex;gap:0;border:1px solid #333;margin:10px 0}
.doc .hdr-flex>.hdr-main{flex:1.9}
.doc .hdr-flex>.hdr-side{flex:1;border-left:1px solid #333}
.doc .hdr-flex table.blocks{margin:0}
.doc .hdr-flex table.blocks td,.doc .hdr-flex table.blocks th{border:none;border-bottom:1px solid #bbb}
.doc .hdr-flex table.blocks tr:last-child td{border-bottom:none}
.doc .instr{column-count:2;column-gap:26px;font-size:7.6pt;line-height:1.45;text-align:justify;margin-top:8px}
.doc .instr p{margin:0 0 5px}
.doc .form-foot{display:flex;justify-content:space-between;font-size:8pt;margin-top:10px;color:#000}
.doc .annex-note{border:1.5px dashed #555;padding:8px 10px;margin-top:14px;font-size:8.5pt;background:#fff}
.doc table.blocks td.rp-side{width:26%;background:#fafafa}
.snapshot-sec{margin-bottom:14px}
#printRoot{display:none}
@media print{
  body.pkg-printing .shell{display:none !important}
  body.pkg-printing #printRoot{display:block !important}
  #printRoot .doc{box-shadow:none;border:none;max-width:none;padding:0}
  #printRoot .pkg-section{page-break-after:always}
  #printRoot .pkg-section:last-child{page-break-after:auto}
}

/* ============ RESPONSIVE ============ */
@media (max-width:900px){
  .kpis{grid-template-columns:repeat(2,1fr)}
  .grid2,.grid3{grid-template-columns:1fr}
  .grid-form{grid-template-columns:1fr}
  #map{height:420px}
}
@media (max-width:680px){
  .shell{flex-direction:column}
  .sidebar{width:100%;height:auto;position:static}
  .sidebar nav{flex-direction:row;flex-wrap:wrap}
  .sidebar nav a{border-left:none;border-bottom:3px solid transparent}
  .sidebar nav a.active{border-bottom-color:var(--gold)}
  .sidebar .side-foot{margin-top:8px}
  .cats{grid-template-columns:repeat(2,1fr)}
  .content{padding:16px 14px 50px}
}

/* ============ SIGNATURE ENGINE ============ */
#sigpad{width:100%;height:170px;background:#fff;border:2px solid var(--navy);border-radius:10px;touch-action:none;cursor:crosshair;display:block}
.doc .sig-img{max-width:260px;max-height:80px;display:block;margin:4px 0;background:#fff;print-color-adjust:exact;-webkit-print-color-adjust:exact}
.doc .sig-method{font-size:8.5pt;margin-top:6px}
.doc .sig-disclaimer{font-size:8pt;color:#333;margin-top:4px;font-style:italic}
.doc .sig-seal{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:7.5pt;word-break:break-all;color:#333;margin-top:3px}
.sig-modal-pad{width:100%;height:170px;background:#fff;border:2px solid var(--navy);border-radius:10px;touch-action:none;cursor:crosshair;display:block}

/* ============ PRINT FIXES (signatures + export) ============ */
@media print{
  .modal-bg{display:none !important}
  .doc{print-color-adjust:exact;-webkit-print-color-adjust:exact}
  .doc .sig-img{print-color-adjust:exact;-webkit-print-color-adjust:exact}
  .doc .doc-note{display:block}
}

/* ============================================================
   VISUAL IDENTITY v4 — REAL PROPERTY
   Blueprint drafting grid · measuring-tape accents · armory
   skyline silhouettes. All CSS/SVG — no external images, so
   nothing can 404 in the field. Decorative only: print rules
   below keep forms (1354 landscape / 337 portrait) untouched.
   ============================================================ */
:root{
  --bp:#2E6DA4; --bp-deep:#0E2A47;
  --bp-fine:rgba(126,184,232,.07); --bp-coarse:rgba(126,184,232,.16);
  --tape-hi:#F6C93C; --tape-lo:#E3AC1C; --tape-ink:rgba(58,46,8,.75); --tape-edge:#8A6D14;
}

/* --- Blueprint drafting-grid background (layered gradients) --- */
.blueprint-bg{
  background:
    linear-gradient(var(--bp-coarse) 1px, transparent 1px),
    linear-gradient(90deg, var(--bp-coarse) 1px, transparent 1px),
    linear-gradient(var(--bp-fine) 1px, transparent 1px),
    linear-gradient(90deg, var(--bp-fine) 1px, transparent 1px),
    radial-gradient(1100px 540px at 50% -10%, var(--navy3), var(--navy));
  background-size:120px 120px, 120px 120px, 24px 24px, 24px 24px, cover;
}

/* --- Measuring-tape strip: yellow band, minor ticks every 12px,
       major ticks every 60px hanging from the bottom edge --- */
.tape-strip{height:14px;flex:none;border-top:1px solid var(--tape-edge);border-bottom:1px solid var(--tape-edge);
  background-image:
    repeating-linear-gradient(90deg, var(--tape-ink) 0 1px, transparent 1px 12px),
    repeating-linear-gradient(90deg, var(--tape-ink) 0 2px, transparent 2px 60px),
    linear-gradient(var(--tape-hi), var(--tape-lo));
  background-size:100% 5px, 100% 9px, 100% 100%;
  background-position:bottom left, bottom left, center;
  background-repeat:repeat-x}
.tape-div{margin:22px 0 4px;border-radius:3px}

/* --- Sidebar: faint blueprint grid over the navy --- */
.sidebar{background:
  linear-gradient(rgba(126,184,232,.05) 1px, transparent 1px),
  linear-gradient(90deg, rgba(126,184,232,.05) 1px, transparent 1px),
  var(--navy);
  background-size:26px 26px, 26px 26px, cover}

/* --- Topbar: thin tape edge along its bottom --- */
.topbar::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;pointer-events:none;
  background-image:
    repeating-linear-gradient(90deg, rgba(58,46,8,.5) 0 1px, transparent 1px 12px),
    linear-gradient(var(--tape-hi), var(--tape-lo));
  background-size:100% 3px, 100% 100%;
  background-position:bottom left, center;
  background-repeat:repeat-x}

/* --- Skyline silhouette (inline SVG, colored via currentColor) --- */
.skyline{display:block;width:100%;pointer-events:none}

/* --- Dashboard hero band --- */
.hero-band{position:relative;overflow:hidden;border-radius:14px;margin:0 0 16px;
  padding:22px 24px 0;color:#EDEAE0;box-shadow:var(--shadow);
  background:
    linear-gradient(var(--bp-coarse) 1px, transparent 1px),
    linear-gradient(90deg, var(--bp-coarse) 1px, transparent 1px),
    linear-gradient(var(--bp-fine) 1px, transparent 1px),
    linear-gradient(90deg, var(--bp-fine) 1px, transparent 1px),
    linear-gradient(135deg, var(--navy2), var(--navy) 70%);
  background-size:120px 120px, 120px 120px, 24px 24px, 24px 24px, cover}
.hero-band .h-kicker{font-size:.7rem;letter-spacing:2.4px;text-transform:uppercase;color:var(--gold);font-weight:800}
.hero-band .h-title{font-size:1.55rem;font-weight:800;color:#fff;margin:3px 0 4px;line-height:1.2}
.hero-band .h-sub{color:#CFC9B4;font-size:.92rem;max-width:660px;margin:0}
.hero-band .skyline{height:92px;margin-top:8px;color:rgba(3,6,14,.55)}
.hero-band .tape-strip{margin:0 -24px}

/* --- Login hero --- */
.login-wrap{position:relative;overflow:hidden;flex-direction:column;gap:20px;
  background:
    linear-gradient(var(--bp-coarse) 1px, transparent 1px),
    linear-gradient(90deg, var(--bp-coarse) 1px, transparent 1px),
    linear-gradient(var(--bp-fine) 1px, transparent 1px),
    linear-gradient(90deg, var(--bp-fine) 1px, transparent 1px),
    radial-gradient(1100px 540px at 50% -10%, var(--navy3), var(--navy));
  background-size:120px 120px, 120px 120px, 24px 24px, 24px 24px, cover}
.login-headline{position:relative;z-index:2;text-align:center;color:#fff;padding:0 10px}
.login-headline .lh-kicker{font-size:.72rem;letter-spacing:3px;text-transform:uppercase;color:var(--gold);font-weight:800}
.login-headline .lh-title{font-size:1.9rem;font-weight:800;letter-spacing:.4px;margin:4px 0 2px;line-height:1.15}
.login-headline .lh-sub{color:#CFC9B4;font-size:.95rem}
.login-skyline{position:absolute;left:0;right:0;bottom:0;height:168px;z-index:1;color:#04070F}
.login-card{position:relative;z-index:2}
.login-card .card-tape{margin:-32px -30px 22px;border-radius:16px 16px 0 0;height:13px;border-top:none}

/* --- v4 responsive: heroes shrink gracefully on phones --- */
@media (max-width:680px){
  .hero-band{padding:16px 16px 0}
  .hero-band .h-title{font-size:1.22rem}
  .hero-band .h-sub{font-size:.86rem}
  .hero-band .skyline{height:58px}
  .hero-band .tape-strip{margin:0 -16px}
  .login-headline .lh-title{font-size:1.45rem}
  .login-skyline{height:118px}
}

/* --- v4 print: decoration never reaches paper --- */
@media print{
  .hero-band,.tape-strip,.login-skyline,.login-headline{display:none !important}
  .topbar::after{display:none !important}
  .sidebar{background:#fff}
}
