/* ==========================================================================
   Build2Income — foundation stylesheet ("The Operator's Ledger")
   Order: tokens + @font-face + base type (from design/tokens.css) → reset →
   utilities → buttons → badges/stamps → shell (utility row, header, nav,
   footer) → notes → property cards → app pages (catalog, detail, calculator,
   compare) → modal/toast → forms → tables/panels/tiles → workspace shell
   (sidebar, portal, operations) → transitional legacy aliases → breakpoints
   (1200 / 1024 / 720 / 480 only) → print.
   Rules: pure white page, --ledger only for documents inside the page,
   hairlines horizontal only, radius 0 (2px on UI), no box-shadow anywhere,
   red only as --red fill/mark or --red-dark small text. Never red on navy.
   ========================================================================== */

/* ---- Fonts (self-hosted, OFL) ---- */
@font-face{font-family:"Source Serif 4";src:url('./assets/fonts/source-serif-4-latin-variable.woff2') format('woff2');font-style:normal;font-weight:200 900;font-display:swap}
@font-face{font-family:"Source Serif 4";src:url('./assets/fonts/source-serif-4-latin-variable-italic.woff2') format('woff2');font-style:italic;font-weight:200 900;font-display:swap}
@font-face{font-family:Inter;src:url('./assets/fonts/inter-latin-400-normal.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Inter;src:url('./assets/fonts/inter-latin-500-normal.woff2') format('woff2');font-style:normal;font-weight:500;font-display:swap}
@font-face{font-family:Inter;src:url('./assets/fonts/inter-latin-700-normal.woff2') format('woff2');font-style:normal;font-weight:600 700;font-display:swap}
@font-face{font-family:Inter;src:url('./assets/fonts/inter-latin-800-normal.woff2') format('woff2');font-style:normal;font-weight:800 900;font-display:swap}
/* Note: "Inter 600" resolves to the 700 file. That is intended; nothing uses 800. */

:root{
  /* ---- Brand ---- */
  --navy:#0B2A50;            /* headings, display figures, rules that matter, bands, active states */
  --navy-dark:#071E3B;       /* hover on navy fills; highlighted chart bar */
  --red:#D22630;             /* the "2", one italic word (home H1), primary button, the curve, current-stage marker */
  --red-dark:#B91F28;        /* any red text < 24px (errors "Error:", alert badges), primary hover */

  /* ---- Text ---- */
  --ink:#172B43;             /* body text. 14.35:1 on white, 12.7:1 on --ledger */
  --muted:#4B5A6E;           /* captions, labels, footnotes, meta. 7.03:1 on white (AAA at 13px), 6.3:1 on --ledger */

  /* ---- Surfaces ---- */
  --white:#FFFFFF;           /* THE page. Header, footer, sidebar, cards, panels, inputs on focus. The logo PNG only ever sits on this. */
  --ledger:#F4F2EC;          /* the "document inside the page": statement blocks, filter row, utility row, inner-hero aside, portal canvas, kanban wells */
  --rule:#DAD5CA;            /* 1px hairlines, horizontal only; card and panel borders; input borders */

  /* ---- On navy ---- */
  --on-navy:#FFFFFF;
  --on-navy-muted:#C6D5E8;   /* 9.5:1 on navy. Equals rgb(198,213,232), the value knowledge-contrast.cjs pins. */
  --on-navy-rule:rgba(255,255,255,.22);

  /* ---- States ---- */
  --navy-06:rgba(11,42,80,.06);   /* hover fill: secondary buttons, table rows, sidebar links, FAQ summary */
  --backdrop:rgba(7,30,59,.6);    /* modal backdrop */
  --focus:#0B2A50;                /* focus ring color on light surfaces; white on navy/red */

  /* ---- Shape ---- */
  --radius-ui:2px;           /* buttons, inputs, stamps, badges, segmented control */
  --radius:2px;              /* LEGACY name, remapped (was 8px). Panels/cards/images/modals use 0, written literally. */
  --shadow:none;             /* LEGACY name, remapped. There is no shadow anywhere. */
  --rule-double:3px double var(--navy);        /* the accountant's double rule (1px / 1px gap / 1px) */
  --rule-double-on-navy:3px double #FFFFFF;
  --rule-dashed:1px dashed var(--rule);        /* "not yet": upcoming tracker status, Coming-later panels, pending badges */

  /* ---- Spacing scale (px) ---- */
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:64px;--s9:96px;--s10:128px;--s11:160px;
  --section-pad:var(--s8);   /* 64 above and below the 1px rule = 128 between section contents */
  --band-pad:var(--s9);      /* navy bands */
  --gutter:32px;

  /* ---- Layout ---- */
  --container:1200px;        /* text and most sections (was 1240) */
  --container-wide:1360px;   /* catalog grid, project detail, portal/ops content */
  --measure:68ch;            /* running text */
  --measure-lead:58ch;
  --header-h:88px;
  --utility-h:36px;
  --sidebar-w:272px;

  /* ---- Type families ---- */
  --font-display:"Source Serif 4",Georgia,"Times New Roman",serif;
  --font-text:Inter,system-ui,Arial,sans-serif;

  /* ---- Type scale (desktop; mobile overrides below) ---- */
  --fs-h1:64px;              /* home H1, Source Serif 4 400 */
  --fs-h1-inner:56px;        /* inner-page H1 */
  --fs-h2:40px;              /* Source Serif 4 400 */
  --fs-h3:26px;              /* Source Serif 4 500 */
  --fs-h4:20px;              /* Source Serif 4 500, document heads inside ledgers/panels */
  --fs-lead:19px;            /* Inter 400 */
  --fs-body:17px;            /* Inter 400 / 1.6 */
  --fs-small:15px;           /* Inter 400 / 1.55 */
  --fs-ui:15px;              /* Inter 500: buttons, nav, inputs, table cells */
  --fs-caption:13px;         /* Inter 400: captions, footnotes, running-head labels, datelines */
  --fs-label:12px;           /* Inter 600: stamps and badges. The 12px floor; nothing is smaller. */
  --fs-fig-xl:56px;          /* Source Serif 4 400 tnum: key-figures band */
  --fs-fig-l:32px;           /* Source Serif 4 400 tnum: total lines (statement, calculator, detail aside, portal statement) */
  --fs-fig-m:24px;           /* Source Serif 4 400 tnum: total line on project cards */
  --fs-fig-tile:28px;        /* Inter 600 tnum: portal stat tiles (compared figures) */

  /* ---- Legacy compatibility aliases (delete in the final sweep after all six QA scripts pass) ---- */
  --line:var(--rule);        /* color, used as border-color in 56 places */
  --surface:var(--ledger);
  --blue-soft:var(--ledger); /* knowledge.css light tint; the pinned rgb(198,213,232) on navy is --on-navy-muted, not this */
}

@media (max-width:1023px){
  :root{--gutter:24px;--header-h:80px}
}
@media (max-width:719px){
  :root{
    --gutter:20px;
    --section-pad:36px;      /* 72 between section contents */
    --band-pad:56px;
    --fs-h1:38px;--fs-h1-inner:34px;--fs-h2:30px;--fs-h3:22px;--fs-h4:18px;
    --fs-lead:17px;--fs-body:16px;
    --fs-fig-xl:36px;--fs-fig-l:28px;--fs-fig-m:22px;--fs-fig-tile:24px;
  }
}

/* ---- Base type ---- */
html{font-optical-sizing:auto;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 16px)}
body{margin:0;font:400 var(--fs-body)/1.6 var(--font-text);color:var(--ink);background:var(--white);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{margin:0 0 var(--s4);font-family:var(--font-display);font-weight:400;color:var(--navy);letter-spacing:-0.01em}
h1{font-size:var(--fs-h1);line-height:1.05;letter-spacing:-0.015em;max-width:18ch}
h2{font-size:var(--fs-h2);line-height:1.12;max-width:28ch}
h3{font-size:var(--fs-h3);line-height:1.25;font-weight:500;letter-spacing:0;max-width:40ch}
h4{font-size:var(--fs-h4);line-height:1.3;font-weight:500;letter-spacing:0}
h1 em,h2 em{font-style:italic;font-weight:inherit;color:inherit}      /* the one italic word; red only via .hero--title h1 em */
.hero--title h1 em{color:var(--red)}
.band h1 em,.band h2 em{color:var(--on-navy)}                          /* never red text on navy */
p{margin:0 0 var(--s4);max-width:var(--measure)}
small,.small-text{font-size:var(--fs-caption);line-height:1.5}       /* was 12px; floor is 12, default 13 */
.muted{color:var(--muted)}
::selection{background:#DCE6F3;color:var(--navy)}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.band :focus-visible,.button.primary:focus-visible,.button.navy:focus-visible{outline-color:#FFFFFF}
.tnum{font-variant-numeric:tabular-nums lining-nums;font-feature-settings:"tnum" 1,"lnum" 1}
.container{width:calc(100% - 2*var(--gutter));max-width:var(--container);margin-inline:auto;min-width:0}
.container--wide{max-width:var(--container-wide)}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* ==========================================================================
   Reset and utilities
   ========================================================================== */
*,*::before,*::after{box-sizing:border-box}
button,input,select,textarea{font:inherit;color:inherit}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
button{cursor:pointer;background:none;border:0;padding:0;text-align:inherit;border-radius:0}
button:disabled,input:disabled,select:disabled{cursor:not-allowed;opacity:.55}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
svg{display:inline-block;vertical-align:middle;flex-shrink:0}
figure{margin:0}
hr{border:0;border-top:1px solid var(--rule);margin:0}
ul,ol{padding-left:22px}
dl,dd{margin:0}
table{border-collapse:collapse}
[hidden]{display:none!important}
body.modal-open,body.menu-open{overflow:hidden}
.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}
.skip-link{position:fixed;left:16px;top:-100px;background:var(--navy);color:#fff;padding:12px 20px;z-index:3000;border-radius:var(--radius-ui);font:500 var(--fs-ui)/1.2 var(--font-text)}
.skip-link:focus{top:12px;outline-color:#fff}
.block{display:block;width:100%}
.small{font-size:var(--fs-small);line-height:1.55}
.spacer{height:var(--s5)}
.is-positive{color:var(--navy)}
.is-negative{color:var(--red-dark)}

/* ==========================================================================
   Buttons — .button kinds: primary (red fill), navy (navy fill), secondary
   (1px navy outline; alias .outline), tertiary (underlined navy text; alias
   .text-link), light (white outline, on navy only). Sizes: small, block/full.
   No icons inside text buttons; no arrows; no transform; 120ms color.
   ========================================================================== */
.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;border:1px solid transparent;border-radius:var(--radius-ui);background:none;font:500 var(--fs-ui)/1.2 var(--font-text);color:var(--navy);text-align:center;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color .12s,border-color .12s,color .12s,text-decoration-thickness .12s;-webkit-appearance:none;appearance:none}
.button>svg{display:none}
.button.primary{background:var(--red);border-color:var(--red);color:#fff}
.button.primary:hover{background:var(--red-dark);border-color:var(--red-dark)}
.button.navy,.button.secondary.filled{background:var(--navy);border-color:var(--navy);color:#fff}
.button.navy:hover{background:var(--navy-dark);border-color:var(--navy-dark)}
.button.secondary,.button.outline{background:transparent;border-color:var(--navy);color:var(--navy)}
.button.secondary:hover,.button.outline:hover{background:var(--navy-06)}
.button.tertiary,.text-link{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0;border:0;border-radius:0;background:none;font:500 var(--fs-ui)/1.2 var(--font-text);color:var(--navy);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;white-space:normal;text-align:left;transition:text-decoration-thickness .12s,color .12s}
.button.tertiary:hover,.text-link:hover{text-decoration-thickness:2px}
.text-link>svg{display:none}
.text-link small{color:var(--muted);font-weight:400}
.button.light{background:transparent;border-color:#fff;color:#fff}
.button.light:hover{background:rgba(255,255,255,.1)}
.button.small{min-height:36px;padding:0 14px}
.button.tertiary.small,.text-link.small{min-height:36px}
.button.block,.button.full{display:flex;width:100%}
.button.danger{background:transparent;border-color:var(--red-dark);color:var(--red-dark)}
.icon-button{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--rule);border-radius:var(--radius-ui);background:var(--white);color:var(--navy);flex-shrink:0;cursor:pointer;transition:background-color .12s,border-color .12s}
.icon-button svg{width:20px;height:20px}
.icon-button:hover{background:var(--navy-06);border-color:var(--navy)}
.save-button{color:var(--navy)}
.save-button svg{width:18px;height:18px}
.save-button[aria-pressed="true"],.save-button.saved{background:var(--navy);border-color:var(--navy);color:#fff}
.save-button[aria-pressed="true"] svg,.save-button.saved svg{fill:currentColor}
.actions,.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s5);margin-top:var(--s6)}

/* ==========================================================================
   Badges, status words, stamps, pills
   ========================================================================== */
.badge{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 8px;border:1px solid transparent;border-radius:var(--radius-ui);background:var(--ledger);color:var(--muted);font:500 var(--fs-label)/1 var(--font-text);white-space:nowrap;text-transform:none;letter-spacing:0}
.badge.green{background:var(--navy);border-color:var(--navy);color:#fff}
.badge.blue{background:transparent;border-color:var(--navy);color:var(--navy)}
.badge.amber{background:transparent;border-style:dashed;border-color:var(--muted);color:var(--muted)}
.badge.red{background:transparent;border-color:var(--red-dark);color:var(--red-dark)}
.badge.gray{background:var(--ledger);border-color:transparent;color:var(--muted)}
.badge svg{width:12px;height:12px}
.statusword{font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted)}
.stamp,.portal-demo{display:inline-flex;align-items:center;padding:3px 8px;border:1px solid var(--navy);border-radius:var(--radius-ui);font:600 var(--fs-label)/1 var(--font-text);color:var(--navy);text-transform:uppercase;letter-spacing:.06em;white-space:nowrap;background:transparent}
.stamp--dashed{border-style:dashed}
.stamp--on-navy{color:#fff;border-color:#fff}
.pill-tabs{display:inline-flex;flex-wrap:wrap;align-items:center;gap:0;padding:2px;border:1px solid var(--navy);border-radius:var(--radius-ui);margin:0 0 var(--s5)}
.pill{display:inline-flex;align-items:center;height:34px;padding:0 14px;border:0;border-radius:1px;background:transparent;font:500 14px/1 var(--font-text);color:var(--navy);transition:background-color .16s,color .16s;white-space:nowrap}
.pill:hover{background:var(--navy-06)}
.pill.active,.pill[aria-pressed="true"]{background:var(--navy);color:#fff}

/* ==========================================================================
   Shell — utility row, header, nav, mobile menu
   ========================================================================== */
.utility{background:var(--ledger);border-bottom:1px solid var(--rule);font:400 var(--fs-caption)/var(--utility-h) var(--font-text);color:var(--muted);height:var(--utility-h);overflow:hidden}
.utility__inner{display:flex;align-items:center;justify-content:space-between;gap:var(--s5);height:var(--utility-h)}
.utility__descriptor{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.utility__links{display:flex;align-items:center;gap:var(--s5);flex-shrink:0}
.utility__links a{color:var(--ink);text-underline-offset:4px;display:inline-flex;align-items:center;gap:6px}
.utility__links a:hover{text-decoration:underline}
.utility svg{width:14px;height:14px;color:var(--muted)}
.header{position:sticky;top:0;z-index:100;background:var(--white);border-bottom:1px solid var(--rule)}
.header__inner,.header-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--s6);height:var(--header-h);max-width:var(--container-wide)}
.brand{display:inline-block;flex-shrink:0;line-height:0;background:var(--white)}
.brand img{display:block;width:240px;height:80px;max-width:none;object-fit:contain;object-position:left center;mix-blend-mode:multiply}  /* multiply hides the PNG's near-white matte on white surfaces; the logo only ever sits on white */
.logo-text{font:800 25px/1 var(--font-text);color:var(--navy);letter-spacing:-.02em}
.logo-text span{color:var(--red)}
.nav{display:flex;align-items:center;gap:28px;min-width:0}
.nav-link{position:relative;display:inline-flex;align-items:center;padding:8px 0;font:500 var(--fs-ui)/1.2 var(--font-text);color:var(--ink);white-space:nowrap;transition:color .12s}
.nav-link::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:transparent}
.nav-link:hover{color:var(--navy)}
.nav-link.active,.nav-link[aria-current="page"]{color:var(--navy)}
.nav-link.active::after,.nav-link[aria-current="page"]::after{background:var(--navy)}
.nav-actions{display:flex;align-items:center;gap:var(--s3);flex-shrink:0}
.header__inner>.nav-actions{order:1}  /* DOM: brand, actions, nav (visible CTA first for QA); visual: brand, nav, actions */
.mobile-menu,.mobile-portal-toggle{display:none}
/* Open-state panel (<1024, see breakpoint block): serif rows, utility links, block buttons */
.nav__extra{display:none}  /* the mobile panel extras; shown only inside .nav.open (<1024) */
.nav__descriptor{font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);margin:0 0 var(--s3)}
.nav__rule{border:0;border-top:1px solid var(--rule);margin:var(--s4) 0}

/* ==========================================================================
   Footer — light colophon: double rule on top, demo note first, logo on
   white, role buttons, three link columns, 13px legal row.
   ========================================================================== */
.footer{background:var(--white);border-top:3px double var(--navy);padding:var(--s8) 0 var(--s7);margin-top:0}
.footer>.container>.note--demo,.footer .demo-note{border-top:0;padding-top:0;margin:0 0 var(--s7)}
.footer__grid,.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:var(--s7);padding-bottom:var(--s7)}
.footer__grid>div,.footer-grid>div{min-width:0}
.footer .brand{margin-bottom:var(--s4)}
.footer__brand p,.footer-grid>div:first-child p{font-size:var(--fs-small);line-height:1.55;color:var(--ink);max-width:36ch;margin-bottom:var(--s3)}
.footer__brand .small-text,.footer-grid>div:first-child .small-text{display:block;color:var(--muted);max-width:36ch}
.footer__roles{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s5)}
.footer h3,.footer h4{font:500 var(--fs-ui)/1.4 var(--font-text);color:var(--navy);margin:0 0 var(--s2);letter-spacing:0}
.footer__grid>div>a,.footer-grid>div>a,.footer__grid>div>button,.footer-grid>div>button.text-link{display:flex;align-items:center;min-height:36px;font:400 var(--fs-ui)/1.3 var(--font-text);color:var(--ink);text-decoration:none;margin:0}
.footer__grid>div>a:hover,.footer-grid>div>a:hover{color:var(--navy);text-decoration:underline;text-underline-offset:4px}
.footer ul{list-style:none;margin:0;padding:0}
.footer__legal,.footer-bottom{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s5);border-top:1px solid var(--rule);padding-top:var(--s5);font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted)}
.footer__legal span,.footer-bottom span,.footer-bottom p{max-width:70ch;margin:0}
.footer__legal .button.tertiary,.footer-bottom .text-link{min-height:0;font-size:var(--fs-caption);flex-shrink:0;color:var(--muted)}
.footer__legal>p{margin:0;max-width:70ch}
.footer__utility{display:flex;align-items:center;gap:var(--s4);flex-shrink:0;white-space:nowrap}

/* ==========================================================================
   Note / disclosure — .note (+ --demo, --figure, --calc, --sources, --on-navy)
   Default text carries "Local demo". One note per block. Hairline above.
   ========================================================================== */
.note,.notice{display:block;font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);border-top:1px solid var(--rule);padding:var(--s3) 0 0;margin:0;max-width:72ch;background:none;border-radius:0}
.note svg,.notice svg{width:16px;height:16px;color:var(--muted);vertical-align:-3px;margin-right:6px}
.note a,.notice a{color:var(--navy);text-decoration:underline;text-underline-offset:3px}
.note strong,.notice strong{color:var(--navy);font-weight:500}
.note--figure{margin-top:var(--s3)}
figure>.note--figure{max-width:none}
.note--demo{margin-bottom:var(--s5)}
.note--on-navy{color:var(--on-navy-muted);border-color:var(--on-navy-rule)}
.note--on-navy svg{color:var(--on-navy-muted)}
.note--sources,.sources{max-width:none}
.notice{display:flex;align-items:flex-start;gap:8px;padding:var(--s3) 0 0;margin:var(--s5) 0 0}
.notice svg{flex-shrink:0;margin:2px 0 0}
.notice p{font-size:var(--fs-caption);line-height:1.5;margin:0;max-width:none}

/* ==========================================================================
   Project card — .property-card (contract §14) + .property-grid
   ========================================================================== */
.property-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s5)}
.property-card{position:relative;display:flex;flex-direction:column;min-width:0;background:var(--white);border:1px solid var(--rule);border-radius:0;overflow:visible;transition:border-color .12s}
.property-card--fractional,.property-card--dashed,.property-card[data-stage="structuring"]{border-style:dashed}
.property-card__media,.property-image{position:relative;display:block;width:100%;aspect-ratio:3/2;overflow:hidden;background:var(--ledger)}
.property-card__media img,.property-image img{width:100%;height:100%;aspect-ratio:3/2;object-fit:cover;object-position:50% 60%;transition:none;transform:none}
.property-image>a{display:block;width:100%;height:100%}
.property-card__body,.property-body{display:flex;flex-direction:column;gap:var(--s3);padding:20px;min-width:0}
.property-card__labels{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s3)}
.property-card h3,.property-body h3{font-size:24px;line-height:1.2;margin:0;max-width:none}
.property-card h3 a:hover,.property-body h3 a:hover{text-decoration:underline;text-underline-offset:4px}
.property-card__meta,.property-meta{display:flex;flex-wrap:wrap;gap:4px var(--s4);margin:0;font:400 var(--fs-small)/1.4 var(--font-text);color:var(--muted);max-width:none}
.property-meta svg{width:14px;height:14px}
.property-meta>span{display:inline-flex;align-items:center;gap:4px}
.property-card .ledger--card{margin-top:var(--s1)}
.property-card .tracker--compact{margin-top:var(--s1)}
.property-card .tracker--compact .t-current{background:var(--navy-dark)}  /* red current tick only in detail and portal */
.property-card__foot,.property-footer{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s3);margin-top:var(--s1)}
.property-card__date{flex:1 1 100%;font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);margin:0}
.property-card .tracker--compact__label{flex-basis:100%;margin:2px 0 0}
.property-card__foot .button.tertiary{min-height:44px}
.property-card .small-text{color:var(--muted)}
/* legacy card internals (stage-1 card() rewrite removes these) */
.property-image>.badge{position:absolute;left:12px;bottom:12px;background:var(--white);border-color:var(--white);color:var(--navy)}
.property-image>.save-button{position:absolute;right:12px;top:12px}
.property-numbers{display:flex;flex-wrap:wrap;gap:var(--s4);padding:var(--s3) 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);font:400 var(--fs-small)/1.4 var(--font-text);color:var(--muted)}
.property-numbers svg{width:14px;height:14px;color:var(--muted)}
.property-numbers span{display:inline-flex;align-items:center;gap:5px}
.property-numbers strong{color:var(--navy);font-weight:500}
.property-price{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s3);margin:0;padding-bottom:var(--s3);border-bottom:3px double var(--navy)}
.property-price>div{min-width:0}
.property-price>div:last-child{text-align:right}
.property-price small,.property-price span{display:block;font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);margin-bottom:2px}
.property-price strong{display:block;font:400 var(--fs-fig-m)/1 var(--font-display);color:var(--navy);font-variant-numeric:tabular-nums lining-nums}
.property-price b{display:block;font:500 var(--fs-small)/1.4 var(--font-text);color:var(--navy);font-variant-numeric:tabular-nums lining-nums}
.property-footer{justify-content:space-between;font-size:var(--fs-caption);color:var(--muted)}
.property-footer .text-link{min-height:36px}

/* ==========================================================================
   App pages — page heading, running head, breadcrumbs, catalog filters,
   detail, tabs, calculator, compare, empty state
   ========================================================================== */
.page-heading{padding:var(--s7) 0 var(--s6)}
.page-heading h1{font-size:var(--fs-h1-inner);line-height:1.06;max-width:20ch;margin-bottom:var(--s4)}
.page-heading>.record-head{margin-bottom:0}
.record--404{padding-top:calc(var(--s9) + var(--s5))}  /* shared S12: 120px top */
.page-heading .section-intro,.page-heading>div>p{font:400 var(--fs-lead)/1.5 var(--font-text);color:var(--ink);max-width:var(--measure-lead);margin:0}
.record-head{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:var(--s5);margin:0 0 var(--s7)}
.record-head>*{grid-column:1;min-width:0}
.record-head__label,.eyebrow{display:block;font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);letter-spacing:0;text-transform:none;margin:0 0 var(--s3)}
.record-head h1,.record-head h2{margin-bottom:0}
.record-head h1{font-size:var(--fs-h1-inner);line-height:1.06;max-width:20ch}
.record-head .lead,.record-head>p:not(.record-head__label):not(.record-head__date){margin:var(--s4) 0 0}
.record-head__date{grid-column:2;grid-row:1;align-self:center;justify-self:end;font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);margin:0;text-align:right;white-space:nowrap}
.crumbs,.breadcrumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);margin:var(--s6) 0 var(--s5)}
.crumbs a:hover,.breadcrumbs a:hover{color:var(--navy);text-decoration:underline;text-underline-offset:3px}
.crumbs>:last-child,.breadcrumbs>span:last-child{color:var(--ink)}
.crumbs a+a::before,.crumbs a+span::before{content:'/';margin-right:8px;color:var(--muted)}
.breadcrumbs svg{width:12px;height:12px}
.filters{display:grid;grid-template-columns:minmax(0,2fr) repeat(3,minmax(0,1fr));gap:var(--s4);align-items:end;padding:var(--s5) 28px;background:var(--ledger);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);border-radius:0;margin:0 0 var(--s5)}
.filters .button{align-self:end}
.filter-control{min-width:0;display:block}
.filter-control label,.filter-control>span{display:block;font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);margin-bottom:6px}
.filter-control.search>div{position:relative}
.filter-control.search>div>svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--muted);pointer-events:none}
.filter-control.search input{padding-left:42px}
.filter-control input,.filter-control select{width:100%;height:48px;background:var(--white);border:1px solid var(--rule);border-radius:var(--radius-ui);padding:0 14px;font:400 16px/1.2 var(--font-text);color:var(--ink)}
.filter-control input:focus,.filter-control select:focus{border-color:var(--navy);outline:2px solid var(--navy);outline-offset:2px}
.results-count{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);margin:0 0 var(--s5);font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);max-width:none}
.results-count strong{color:var(--navy);font-weight:500}
.empty-state{grid-column:1/-1;text-align:center;padding:var(--s8) var(--s5);background:var(--ledger);border:0;border-radius:0;font:400 var(--fs-small)/1.55 var(--font-text);color:var(--muted)}
.empty-state>svg{display:none}
.empty-state h2,.empty-state h3{font-size:var(--fs-h3);font-weight:500;margin:0 auto var(--s2);max-width:none}
.empty-state p{margin:0 auto var(--s4);max-width:48ch}
.empty-state .button{margin:0 auto}
.detail-hero,.detail-title{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s5);padding:0 0 var(--s5);margin:0}
.detail-hero>div{min-width:0}
.detail-hero h1,.detail-title h1{font-size:var(--fs-h1-inner);line-height:1.06;margin:var(--s2) 0;max-width:none}
.detail-hero p,.detail-title p{font:400 var(--fs-small)/1.5 var(--font-text);color:var(--muted);margin:0}
.detail-hero .property-meta{margin-bottom:0;align-items:center}
.detail-hero .badge{position:static}
.detail-photo{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;object-position:50% 60%;border-radius:0}
.detail-grid{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:var(--s7);align-items:start;margin-bottom:var(--s8)}
.detail-main,.detail-aside{min-width:0}
.detail-main>h2{margin-top:var(--s6)}
.detail-main>p{color:var(--ink);font-size:var(--fs-small)}
.detail-main>.tabs{margin-top:var(--s5)}
.detail-aside>.ledger,.detail-aside .sticky-card{position:sticky;top:calc(var(--header-h) + var(--s5));background:var(--white);border:1px solid var(--rule);border-radius:0;padding:var(--s5)}
.detail-aside.is-dashed>.ledger,.detail-aside--fractional>.ledger,.detail-aside[data-stage="structuring"]>.ledger,.detail-aside.is-dashed .sticky-card{border-style:dashed}
.detail-aside .actions{margin-top:var(--s5);flex-direction:column;align-items:stretch;gap:var(--s3)}
.detail-aside .actions .button.tertiary{align-self:flex-start}
.detail-aside .note{margin-top:var(--s4)}
.sticky-card>h2{font:400 var(--fs-fig-l)/1 var(--font-display);color:var(--navy);font-variant-numeric:tabular-nums lining-nums;margin:var(--s2) 0 var(--s4);padding-bottom:var(--s4);border-bottom:3px double var(--navy);max-width:none}
.sticky-card>span.muted,.sticky-card>.muted{display:block;font-size:var(--fs-caption)}
.sticky-card .button+.button{margin-top:var(--s2)}
.sticky-card>.calc-breakdown{margin:0 0 var(--s5)}
.sticky-card h3{font-size:var(--fs-h4);margin-bottom:var(--s4)}
.sticky-card .small-text{margin:var(--s4) 0 0;color:var(--muted);display:block}
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s5);padding:var(--s5) 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);margin:var(--s5) 0 var(--s6)}
.facts:has(>.fact:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
.fact{min-width:0}
.fact svg{display:none}
.fact span,.fact small{display:block;font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);margin-bottom:4px}
.fact strong,.fact b{display:block;font:500 var(--fs-body)/1.4 var(--font-text);color:var(--navy);font-variant-numeric:tabular-nums lining-nums}
.tabs{display:flex;gap:var(--s6);align-items:flex-end;border-bottom:1px solid var(--rule);overflow-x:auto;margin:0 0 var(--s6);scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs button,.tab{position:relative;display:inline-flex;align-items:center;height:48px;padding:0;margin-bottom:-1px;border:0;border-bottom:2px solid transparent;background:none;font:500 var(--fs-ui)/1.2 var(--font-text);color:var(--muted);white-space:nowrap;flex-shrink:0;transition:color .16s,border-color .16s}
.tabs button:hover,.tab:hover{color:var(--navy)}
.tabs button.active,.tabs button[aria-selected="true"],.tab.active,.tab[aria-selected="true"]{color:var(--navy);border-bottom-color:var(--navy)}
.calculator{background:var(--ledger);border:0;border-radius:0;padding:var(--s5) 28px;margin:0 0 var(--s6)}
.calculator .panel-header{padding:0 0 var(--s4);border:0;min-height:0;align-items:flex-start}
.calculator .panel-header h2{font-size:var(--fs-h3);font-weight:500}
.calculator .panel-header p{font-size:var(--fs-small);color:var(--ink);margin:var(--s2) 0 0}
.calculator .panel-header>svg{display:none}
#calculator-form .field input{background:var(--white)}
#calc-output{margin-top:var(--s5)}
.calc-result{display:flex;flex-wrap:wrap;gap:var(--s5) var(--s7);padding-top:var(--s4);margin-top:var(--s5);border-top:3px double var(--navy)}
.calc-result>div{min-width:0}
.calc-result span,.calc-result small{display:block;font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);margin-bottom:6px}
.calc-result strong{display:block;font:400 var(--fs-fig-l)/1 var(--font-display);color:var(--navy);letter-spacing:0;font-variant-numeric:tabular-nums lining-nums;margin-bottom:6px}
.calc-breakdown{display:flex;flex-direction:column;gap:0;margin-top:var(--s4);font-variant-numeric:tabular-nums lining-nums}
.calc-breakdown>div{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s5);padding:10px 0;border-bottom:1px solid var(--rule);font:400 var(--fs-small)/1.4 var(--font-text);color:var(--ink)}
.calc-breakdown>div b,.calc-breakdown>div strong{font:500 var(--fs-small)/1.4 var(--font-text);color:var(--navy);text-align:right;white-space:nowrap}
.calc-breakdown>div:has(>strong){border-bottom:3px double var(--navy);padding:14px 0}
.calc-breakdown>div:has(>strong) strong:last-child{font:400 var(--fs-fig-l)/1 var(--font-display)}
.check-list{list-style:none;padding:0;margin:var(--s4) 0 var(--s5);display:block}
.check-list li{display:block;padding:10px 0;border-bottom:1px solid var(--rule);font:400 var(--fs-small)/1.55 var(--font-text);color:var(--ink)}
.check-list li::before{content:none}
.check-list svg{display:none}
.compare-bar{position:fixed;left:0;right:0;bottom:0;z-index:140;display:flex;align-items:center;justify-content:space-between;gap:var(--s4);padding:var(--s3) var(--gutter);background:var(--white);border-top:1px solid var(--rule);font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);transform:none;max-width:none;min-width:0;border-radius:0}
.compare-bar>span{display:inline-flex;align-items:center;gap:6px}
.compare-bar>.compare-bar__count{flex:1 1 auto}  /* count left, Compare + Clear grouped right */
.compare-bar>span svg{display:none}
.compare-bar b{color:var(--navy);font-weight:500}
.compare-bar>div{display:flex;align-items:center;gap:var(--s3)}
.compare-bar .button.small{min-height:36px}
body:has(.compare-bar){padding-bottom:64px}
.compare-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s5)}
.compare-grid:has(>.compare-card:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
.compare-card{border:1px solid var(--rule);border-radius:0;min-width:0;background:var(--white)}
.compare-card>img{width:100%;aspect-ratio:3/2;object-fit:cover}
.compare-card>div,.compare-card>h3,.compare-card>p,.compare-card>.calc-breakdown,.compare-card>.button{margin-left:20px;margin-right:20px}
.compare-card>h3{font-size:var(--fs-h4);margin:20px 20px var(--s1)}
.compare-card>p{font-size:var(--fs-caption);margin-bottom:var(--s3)}
.compare-card>.button{width:calc(100% - 40px);margin-top:var(--s4);margin-bottom:20px}
.compare-card>img+h3{margin-top:20px}
.compare-card dl{font-size:var(--fs-small);margin:0}
.compare-card dt{color:var(--muted);margin-top:var(--s3)}
.compare-card dd{margin:2px 0 0;color:var(--navy);font-weight:500}

/* ==========================================================================
   Modal and toast
   ========================================================================== */
.modal-backdrop{position:fixed;inset:0;z-index:1500;background:var(--backdrop);display:flex;align-items:center;justify-content:center;padding:var(--s5);overflow-y:auto;animation:fade-in .15s ease-out}
.modal{position:relative;width:100%;max-width:560px;max-height:calc(100dvh - 48px);display:flex;flex-direction:column;background:var(--white);border:1px solid var(--navy);border-radius:0;box-shadow:none;overflow:hidden;animation:fade-in .15s ease-out}
.modal.wide{max-width:1040px}
.modal-header{padding:var(--s6) 84px var(--s3) var(--s6)}
.modal-header h2,.modal-header h3,#modal-title{font-size:var(--fs-h3);font-weight:500;line-height:1.25;margin:0 0 var(--s2);max-width:none}
.modal-header p{font-size:var(--fs-small);line-height:1.55;color:var(--muted);margin:0}
.modal-close{position:absolute;right:var(--s4);top:var(--s4);z-index:1;width:44px;height:44px}
.modal-body{padding:var(--s3) var(--s6) var(--s6);overflow-y:auto;min-height:0;overscroll-behavior:contain}
.modal-body>p,.modal-body>div>p{font-size:var(--fs-small);line-height:1.55;color:var(--ink)}
.modal-body h3{font-size:var(--fs-h4);margin:var(--s5) 0 var(--s3)}
.modal-body h3:first-child{margin-top:0}
.modal-body ul,.modal-body ol{font-size:var(--fs-small);line-height:1.6}
.modal-body .small-text{font-size:var(--fs-caption);color:var(--muted)}
.modal-body .note{margin-bottom:var(--s5)}
.modal__intro{font:400 var(--fs-small)/1.55 var(--font-text);color:var(--ink);margin:0 0 var(--s5);max-width:none}
.modal-footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--s3);padding:var(--s4) var(--s6) var(--s5);border-top:1px solid var(--rule);background:var(--white)}
.form-success{padding:var(--s2) 0 0}
.form-success>svg,.form-success__mark{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;padding:12px;border:1px solid var(--rule);border-radius:50%;color:var(--navy);margin-bottom:var(--s4)}
.form-success__mark svg{width:24px;height:24px}
.form-success h3{font-size:var(--fs-h3);margin-bottom:var(--s3)}
.form-success p{font-size:var(--fs-small);line-height:1.55;color:var(--ink);margin:0 0 var(--s5)}
.form-success .actions{margin-top:0}
.toast{position:fixed;left:var(--s5);bottom:var(--s5);z-index:2500;display:flex;align-items:center;gap:10px;max-width:min(430px,calc(100% - 48px));padding:14px 18px;background:var(--navy);color:#fff;border-radius:var(--radius-ui);box-shadow:none;font:400 var(--fs-ui)/1.4 var(--font-text);animation:toast-enter .2s ease-out}
.toast svg{width:18px;height:18px;color:#fff;flex-shrink:0}
@keyframes toast-enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes fade-in{from{opacity:0}to{opacity:1}}

/* ==========================================================================
   Forms — .field, .form-grid, inputs 16px (no iOS zoom), 48px tall
   ========================================================================== */
.input-grid,.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s5) var(--s4)}
.field{min-width:0;display:flex;flex-direction:column;gap:6px}
.field.full,.form-grid .full,.form-grid>.field--full{grid-column:1/-1}
.field label,.field>span{font:500 14px/1.4 var(--font-text);color:var(--navy)}
.field__req{font-weight:400;color:var(--muted);font-size:var(--fs-caption)}
.field input,.field select,.field textarea,.small-select{width:100%;height:48px;border:1px solid var(--rule);border-radius:var(--radius-ui);background:var(--white);color:var(--ink);font:400 16px/1.3 var(--font-text);padding:0 14px;transition:border-color .12s;font-variant-numeric:tabular-nums lining-nums}
.field textarea{height:auto;min-height:120px;padding:12px 14px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus,.small-select:focus{border-color:var(--navy);outline:2px solid var(--navy);outline-offset:2px}
.field input[type=checkbox],.field input[type=radio]{width:18px;height:18px;accent-color:var(--navy);padding:0}
.field input[type=range]{padding:0;border:0;height:auto;accent-color:var(--navy)}
.field__select{position:relative}
.field__select select{-webkit-appearance:none;appearance:none;padding-right:44px}
.field__select>svg{position:absolute;right:14px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--muted);pointer-events:none}
.field__help,.field small{font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);margin:0}
.field__error{display:flex;align-items:flex-start;gap:6px;font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--red-dark);margin:0}
.field__error svg{width:16px;height:16px;color:var(--red-dark);flex-shrink:0;margin-top:1px}
.field__success{color:var(--navy)}
.workspace .field input,.workspace .field select,.workspace .field textarea{background:var(--white)}
.workspace .button.primary{background:var(--navy);border-color:var(--navy)}  /* red in the workspace is the tracker's current mark only */
.workspace .button.primary:hover{background:var(--navy-dark);border-color:var(--navy-dark)}
.checkbox-field{display:flex;align-items:flex-start;gap:10px;font:400 var(--fs-small)/1.55 var(--font-text);color:var(--ink);margin-top:var(--s4)}
.checkbox-field input{width:18px;height:18px;flex-shrink:0;margin:3px 0 0;accent-color:var(--navy)}
.form-section{padding:var(--s5);border:1px solid var(--rule);border-radius:0;background:var(--white);margin-bottom:var(--s5)}
.form-section h3{margin-bottom:var(--s5)}

/* ==========================================================================
   Tables, panels, tiles
   ========================================================================== */
.table-wrap{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.data-table{width:100%;border-collapse:collapse;text-align:left;font:400 14px/1.5 var(--font-text);color:var(--ink);font-variant-numeric:tabular-nums lining-nums}
.data-table th{padding:12px 16px;background:transparent;border-bottom:1px solid var(--rule);font:500 var(--fs-caption)/1.4 var(--font-text);color:var(--muted);white-space:nowrap;text-transform:none;letter-spacing:0}
.data-table td{padding:14px 16px;border-bottom:1px solid var(--rule);vertical-align:middle;color:var(--ink);min-height:48px}
.data-table th:first-child,.data-table td:first-child{padding-left:0}
.data-table th:last-child,.data-table td:last-child{padding-right:0}
.data-table td b,.data-table td strong{display:block;font-weight:500;color:var(--navy);font-size:14px}
.data-table td small{display:block;font-size:var(--fs-caption);color:var(--muted);margin-top:2px;line-height:1.5}
.data-table tbody tr:hover{background:var(--navy-06)}
.data-table td .text-link{font-size:14px;min-height:0;white-space:nowrap}
.data-table td img{width:56px;height:38px;object-fit:cover;border-radius:0}
.data-table .property-cell{display:flex;align-items:center;gap:12px;min-width:190px}
.data-table .progress-track{width:100px;margin-top:6px}
.data-table td:has(>.small-select){padding-top:8px;padding-bottom:8px}
.panel .table-wrap{padding:0 var(--s5)}
.progress-track{width:100%;height:4px;background:var(--rule);border-radius:0;overflow:hidden}
.progress-fill{height:100%;width:0;background:var(--navy);border-radius:0;transition:width .35s}
.progress-fill.red{background:var(--navy)}
.panel{background:var(--white);border:1px solid var(--rule);border-radius:0;min-width:0;overflow:hidden;margin-bottom:var(--s5)}
.panel-header{display:flex;align-items:center;justify-content:space-between;gap:var(--s4);padding:20px var(--s5);border-bottom:1px solid var(--rule);min-height:64px}
.panel-header>div{min-width:0}
.panel-header h2,.panel-header h3,.panel-header h4{font:500 var(--fs-h4)/1.3 var(--font-display);color:var(--navy);margin:0;max-width:none}
.panel-header p{font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);margin:4px 0 0}
.panel-header>svg{display:none}
.panel-header .text-link{min-height:0;white-space:nowrap}
.panel-body{padding:var(--s5);min-width:0}
.panel-body>p{font-size:var(--fs-small);line-height:1.55;color:var(--ink)}
.panel-body>.property-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.panel>img{width:100%;aspect-ratio:21/9;object-fit:cover;border-radius:0!important;height:auto!important}
.panel .panel-header[style]{min-height:0}
.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:var(--s5);margin-bottom:var(--s5);align-items:start}
.dashboard-grid.equal{grid-template-columns:repeat(2,minmax(0,1fr))}
.dashboard-grid>.panel{margin-bottom:0;height:100%}
.tiles,.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s5);border-top:1px solid var(--rule);padding-top:var(--s4);margin-bottom:var(--s6)}
.tiles__cell,.metric-card{display:flex;flex-direction:column;gap:6px;min-width:0;background:transparent;border:0;border-radius:0;padding:0;position:static}
.tiles__label,.metric-label{display:block;font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);margin:0}
.metric-label svg{display:none}
.tiles__value,.metric-value{display:block;font:600 var(--fs-fig-tile)/1.1 var(--font-text);color:var(--navy);letter-spacing:-.01em;font-variant-numeric:tabular-nums lining-nums;margin:0;white-space:nowrap}
.tiles__sub,.metric-note{display:block;font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);margin:0}
.tiles__cell .tracker--compact{margin-top:6px}
.tiles--serif .tiles__value{font:400 40px/1 var(--font-display);letter-spacing:-.01em}
.mini-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4);padding:var(--s4) 0;margin-bottom:var(--s5);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.mini-stats>div{min-width:0;display:flex;flex-direction:column;gap:4px}
.mini-stats span,.mini-stats small{font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted)}
.mini-stats b,.mini-stats strong{font:600 var(--fs-fig-tile)/1.1 var(--font-text);color:var(--navy);font-variant-numeric:tabular-nums lining-nums}

/* ==========================================================================
   Workspace shell — sidebar (272, white, 1px rule right), ledger canvas,
   64px white header, note strip, content at the wide container.
   ========================================================================== */
.workspace-shell{min-height:100vh;background:var(--ledger)}
.sidebar{position:fixed;left:0;top:0;bottom:0;z-index:130;width:var(--sidebar-w);display:flex;flex-direction:column;background:var(--white);color:var(--ink);border-right:1px solid var(--rule);padding:var(--s4) 0 var(--s4);overflow-y:auto;transform:none;transition:transform .2s}
.sidebar-brand{display:flex;flex-direction:column;align-items:flex-start;gap:0;padding:0 var(--s4) var(--s4);margin:0 0 var(--s2);background:var(--white);border:0;border-radius:0;min-height:0;overflow:visible}
.sidebar-brand .brand{margin-left:0}
.sidebar-brand .brand img{width:240px;height:80px}
.sidebar-brand>img{width:240px;height:80px;max-width:none}
.sidebar-brand>span{display:block;font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);letter-spacing:0;text-transform:none;white-space:normal;padding-left:var(--s4);margin-top:-4px}
.sidebar-nav{display:flex;flex-direction:column;gap:0;min-width:0}
.sidebar-link{display:flex;align-items:center;gap:12px;min-height:44px;padding:0 var(--s4) 0 calc(var(--s4) + 16px);border:0;border-left:3px solid transparent;border-radius:0;background:transparent;font:500 var(--fs-ui)/1.3 var(--font-text);color:var(--ink);transition:background-color .12s,color .12s}
.sidebar-link svg{width:18px;height:18px;color:var(--muted)}
.sidebar-link:hover{background:var(--navy-06);color:var(--navy)}
.sidebar-link.active,.sidebar-link[aria-current="page"]{background:var(--ledger);border-left-color:var(--navy);color:var(--navy)}
.sidebar-link.active svg,.sidebar-link[aria-current="page"] svg{color:var(--navy)}
.sidebar-bottom{margin-top:auto;padding-top:var(--s5);display:flex;flex-direction:column;gap:0;border-top:1px solid var(--rule)}
.sidebar-bottom p{font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);margin:var(--s3) var(--s4) 0 calc(var(--s4) + 19px)}
.sidebar-bottom .sidebar-link{font-size:var(--fs-ui);color:var(--ink)}
.workspace{margin-left:var(--sidebar-w);min-height:100vh;min-width:0;width:calc(100% - var(--sidebar-w));background:var(--ledger)}
.workspace-header{position:sticky;top:0;z-index:25;display:flex;align-items:center;justify-content:space-between;gap:var(--s5);height:64px;padding:0 var(--s6);background:var(--white);border-bottom:1px solid var(--rule)}
.workspace-header h2{font:600 var(--fs-ui)/1.3 var(--font-text);color:var(--navy);margin:0}
.workspace-header p{font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);margin:0}
.workspace-header .workspace-title{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:var(--s3);margin:0;font:600 var(--fs-ui)/1.3 var(--font-text);color:var(--navy)}
.workspace-tools{display:flex;align-items:center;gap:var(--s3);flex-shrink:0}
.avatar{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;background:var(--ledger);border:1px solid var(--rule);border-radius:50%;font:600 var(--fs-label)/1 var(--font-text);color:var(--navy);flex-shrink:0}
.workspace>.note--demo,.workspace>.note{max-width:none;border-top:0;border-bottom:1px solid var(--rule);background:var(--white);padding:var(--s3) var(--s6);margin:0}
.workspace-content{max-width:calc(var(--container-wide) + 2*var(--s6));margin:0 auto;padding:var(--s6) var(--s6) var(--s8);min-width:0}
.workspace-content.container--wide{width:auto}
.workspace-title:not(.workspace-header .workspace-title),.workspace-heading{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:var(--s5);align-items:end;margin-bottom:var(--s6)}
.workspace-heading>div{min-width:0}
.workspace-title h1,.workspace-heading h1,.workspace-content .record-head h1,.workspace-content .record-head h2{font:400 32px/1.15 var(--font-display);color:var(--navy);letter-spacing:-.01em;margin:0 0 var(--s2);max-width:28ch}
.workspace-title p,.workspace-heading .muted,.workspace-heading p{font:400 var(--fs-small)/1.55 var(--font-text);color:var(--muted);margin:0;max-width:var(--measure-lead)}
.workspace-heading .eyebrow{margin-bottom:var(--s2)}
.workspace-title .button,.workspace-heading>.button,.workspace-heading>a.button{flex-shrink:0;align-self:end}
.workspace-content .record-head{margin-bottom:var(--s6)}
.workspace .panel-body>h2{font-size:var(--fs-h3);margin-top:var(--s4)}
.portfolio-row{display:flex;gap:var(--s4);align-items:center;min-width:0;padding:var(--s4) 0;border-bottom:1px solid var(--rule)}
.portfolio-row:first-child{padding-top:0}
.portfolio-row:last-child{padding-bottom:0;border-bottom:0}
.portfolio-row>img{width:88px;height:59px;object-fit:cover;border-radius:0;flex-shrink:0}
.portfolio-info{min-width:0;flex:1;display:flex;flex-direction:column;gap:2px}
.portfolio-info a{font:500 var(--fs-ui)/1.4 var(--font-text);color:var(--navy)}
.portfolio-info a:hover{text-decoration:underline;text-underline-offset:3px}
.portfolio-info span,.portfolio-info small{font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted)}
.portfolio-value{text-align:right;min-width:96px;display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.portfolio-value>b{font:500 var(--fs-ui)/1.4 var(--font-text);color:var(--navy);white-space:nowrap;font-variant-numeric:tabular-nums lining-nums}
.portfolio-value .progress-track{width:88px}
.portfolio-value small{font:400 var(--fs-caption)/1.4 var(--font-text);color:var(--muted)}
.portfolio-row>.icon-button{width:36px;height:36px}
.timeline{position:relative;display:flex;flex-direction:column;padding:0;margin:0;list-style:none}
.timeline-item{position:relative;display:grid;grid-template-columns:20px minmax(0,1fr) auto;gap:var(--s3);align-items:center;min-height:0;padding:var(--s3) 0;border-bottom:1px solid var(--rule);font-size:var(--fs-small)}
.timeline-item::before{content:none}
.timeline-item:last-child{border-bottom:0}
.timeline-dot{position:relative;z-index:1;flex-shrink:0;width:14px;height:14px;border:1px solid var(--rule);border-radius:50%;margin:0;background:var(--white);display:flex;align-items:center;justify-content:center;font:500 9px/1 var(--font-text);color:transparent;box-shadow:none}
.timeline-item.complete .timeline-dot{background:var(--navy);border-color:var(--navy);color:#fff}
.timeline-dot svg{width:9px;height:9px}
.timeline-item.current .timeline-dot{border:2px solid var(--navy);background:var(--white);box-shadow:none}
.timeline-item.pending .timeline-content{color:var(--muted)}
.timeline-content{min-width:0;color:var(--navy)}
.timeline-content strong,.timeline-content b,.timeline-content h4{display:block;font:500 var(--fs-ui)/1.4 var(--font-text);color:var(--navy);margin:0}
.timeline-content small,.timeline-content p{display:block;color:var(--muted);font:400 var(--fs-caption)/1.5 var(--font-text);margin:2px 0 0;max-width:none}
.timeline-content .badge{margin-top:6px}
.timeline-item>.badge{align-self:center}
.chart{width:100%;position:relative;margin:var(--s3) 0 var(--s2);min-height:210px}
.chart>svg{display:block;width:100%;height:auto;max-height:260px;overflow:visible}
.chart svg text{font-family:var(--font-text);font-size:13px;fill:var(--muted);font-variant-numeric:tabular-nums}
.chart svg line{stroke:var(--rule);stroke-width:1}
.chart-line{fill:none;stroke:var(--navy);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.chart-labels{display:flex;justify-content:space-between;gap:var(--s3);font:400 var(--fs-caption)/1.4 var(--font-text);color:var(--muted);margin-top:var(--s2);font-variant-numeric:tabular-nums}
.chart-legend{display:flex;flex-wrap:wrap;gap:var(--s4);font:400 var(--fs-caption)/1.4 var(--font-text);color:var(--muted);align-items:center}
.chart-legend>span{display:inline-flex;align-items:center;gap:6px}
.chart-legend i{display:inline-block;width:8px;height:8px;background:var(--navy);border-radius:0}
.chart-legend>span:nth-child(2) i{background:var(--navy-dark)}
.bar-chart{height:220px;display:flex;gap:var(--s4);align-items:flex-end;border-bottom:1px solid var(--rule);padding:var(--s5) 0 0;margin-bottom:var(--s6)}
.bar-column{display:flex;align-items:center;justify-content:flex-end;flex-direction:column;flex:1;min-width:0;height:100%;position:relative;padding:0 4px}
.bar-fill{display:block;width:100%;max-width:40px;min-height:2px;background:var(--navy)!important;border-radius:0}  /* !important overrides the legacy inline red on the current month until stage 2b removes it */
.bar-column:last-child .bar-fill,.bar-column.is-current .bar-fill{background:var(--navy-dark)!important}
.bar-column>span{font:500 var(--fs-caption)/1.3 var(--font-text);color:var(--navy);margin-bottom:8px;white-space:nowrap;font-variant-numeric:tabular-nums}
.bar-column small,.bar-column>small{position:absolute;top:100%;padding-top:8px;font:400 var(--fs-caption)/1.3 var(--font-text);color:var(--muted);white-space:nowrap}
.bar-column strong{font:400 var(--fs-caption)/1.3 var(--font-text);color:var(--muted);margin-bottom:6px}
.activity-list{display:flex;flex-direction:column;gap:0}
.activity-row{display:flex;gap:var(--s3);padding:var(--s4) 0;border-bottom:1px solid var(--rule);align-items:flex-start;min-width:0}
.activity-row:first-child{padding-top:0}
.activity-row:last-child{padding-bottom:0;border-bottom:0}
.activity-row>div:not(.activity-dot){min-width:0;flex-grow:1}
.activity-row strong,.activity-row b{display:block;font:500 var(--fs-ui)/1.4 var(--font-text);color:var(--navy)}
.activity-row>b{flex-shrink:0;font-variant-numeric:tabular-nums}
.activity-row p{font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);margin:2px 0 0;max-width:none}
.activity-row time,.activity-row>small{font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);white-space:nowrap;margin-left:auto;flex-shrink:0}
.activity-row .text-link{min-height:0;white-space:nowrap;flex-shrink:0}
.feature-icon{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;flex-shrink:0;border-radius:0;background:none;color:var(--muted);margin-top:1px}
.feature-icon svg{width:20px;height:20px}
.activity-dot{width:8px;height:8px;background:var(--navy);border-radius:0;display:block;flex-shrink:0;margin:8px 8px 0 0}
.activity-dot svg{display:none}
.activity-dot:empty{width:8px;height:8px;background:var(--navy);margin:8px 8px 0 0}
.document-row{display:grid;grid-template-columns:24px minmax(0,1fr) auto auto;align-items:center;gap:var(--s4);padding:var(--s4) 0;border-bottom:1px solid var(--rule);min-width:0}
.document-row:first-child{padding-top:0}
.document-row:last-child{padding-bottom:0;border-bottom:0}
.document-row>svg{width:20px;height:20px;color:var(--muted)}
.document-row>div{min-width:0}
.document-row strong,.document-row b{display:block;font:500 var(--fs-ui)/1.4 var(--font-text);color:var(--navy)}
.document-row p,.document-row small{display:block;font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);margin:2px 0 0;max-width:none}
.document-row>.feature-icon{width:24px;height:24px}
.document-row>.icon-button{width:40px;height:40px}
.document-row .button,.document-row .text-link{flex-shrink:0;min-height:0}
.document-row .button.small{min-height:36px}
.maintenance-item{border:1px solid var(--rule);border-radius:0;padding:var(--s5);margin-bottom:var(--s4);display:block;background:var(--white)}
.maintenance-item:last-child{margin-bottom:0}
.maintenance-item>.feature-row{align-items:center;gap:var(--s3)}
.maintenance-item .feature-row h3{font:500 var(--fs-ui)/1.4 var(--font-text);margin-bottom:2px}
.maintenance-item .feature-row p{margin:0;font-size:var(--fs-caption);color:var(--muted)}
.maintenance-item .feature-row>.badge{margin-left:auto;flex-shrink:0}
.maintenance-item .facts{padding:var(--s4) 0;margin:var(--s4) 0}
.maintenance-item h4{font:500 var(--fs-ui)/1.4 var(--font-text);margin-bottom:6px}
.maintenance-item p{font-size:var(--fs-small);line-height:1.55;color:var(--ink);margin-bottom:var(--s3)}
.status-dot{display:inline-block;width:8px;height:8px;border-radius:0;background:var(--rule);vertical-align:middle;margin-right:6px}
.status-dot.green{background:var(--navy)}
.status-dot.amber{background:var(--muted)}
.status-dot.red{background:var(--red-dark)}
/* Operations */
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:var(--s4);flex-wrap:wrap;margin-bottom:var(--s5)}
.toolbar>div{display:flex;align-items:center;gap:var(--s3);flex-wrap:wrap}
.toolbar .pill-tabs{margin:0}
.small-select{width:auto;height:36px;padding:0 32px 0 10px;font-size:14px;max-width:100%}
.crm-board,.kanban{display:flex;gap:var(--s4);max-width:100%;min-width:0;overflow-x:auto;padding:0 0 var(--s4);align-items:flex-start;scrollbar-width:thin}
.crm-column,.kanban__well{flex:1 0 240px;min-width:240px;min-height:280px;padding:var(--s4);background:var(--ledger);border:0;border-radius:0}
.crm-column>.panel-header,.crm-column>header,.kanban__head{display:flex;justify-content:space-between;align-items:center;gap:var(--s3);padding:0 0 var(--s3);margin-bottom:var(--s3);border-bottom:1px solid var(--rule);min-height:0}
.crm-column h2,.crm-column h3,.kanban__head h3{font:500 var(--fs-ui)/1.4 var(--font-text);color:var(--navy);margin:0}
.crm-stage-count{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 6px;border-radius:var(--radius-ui);background:var(--white);color:var(--muted);font:500 var(--fs-label)/1 var(--font-text);font-variant-numeric:tabular-nums}
.crm-lead,.lead-card{display:block;width:100%;text-align:left;background:var(--white);border:1px solid var(--rule);border-radius:0;padding:var(--s4);margin-top:var(--s3);box-shadow:none;min-width:0;transition:border-color .12s}
.crm-lead:hover,.lead-card:hover{border-color:var(--navy)}
.crm-lead h3,.lead-card h3{font:500 var(--fs-ui)/1.4 var(--font-text);color:var(--navy);margin:6px 0 4px;max-width:none}
.crm-lead b,.crm-lead strong,.crm-lead h4{font:500 var(--fs-ui)/1.4 var(--font-text);color:var(--navy);margin:0 0 4px;display:block;overflow-wrap:anywhere}
.crm-lead p,.lead-card p{font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);margin:0 0 6px;overflow-wrap:anywhere;max-width:none}
.crm-lead small,.lead-card small{display:block;font-size:var(--fs-caption);color:var(--muted);margin:4px 0 0}
.crm-lead .small-text{display:block;color:var(--muted)}
.crm-lead .button{margin-top:var(--s2)}
.table-actions{display:flex;gap:8px;align-items:center;flex-wrap:nowrap}
.table-actions .button{min-height:36px;padding:0 12px}
.table-actions .icon-button{width:36px;height:36px}
.document-preview{padding:var(--s5) 28px;background:var(--ledger);border:0;border-radius:0;font:400 var(--fs-small)/1.6 var(--font-text);color:var(--ink)}
.document-preview h2{font-size:var(--fs-h3);font-weight:500;margin:0 0 var(--s4)}
.document-preview h3{font-size:var(--fs-h4);margin:var(--s5) 0 var(--s3)}
.document-preview p,.document-preview li{font-size:var(--fs-small);line-height:1.6}
.document-preview .facts{margin:var(--s4) 0;padding:var(--s4) 0}

/* ==========================================================================
   Transitional legacy sections (stage-2 markup for catalog/detail/portal/
   ops and the dead app.js pages). Token-level restyle only; remove in the
   final sweep once the page builders have rewritten the markup.
   ========================================================================== */
.section{padding:var(--section-pad) 0}
.section-compact{padding:var(--s7) 0}
.section.alt,.section.soft,.section.gray{background:var(--ledger)}
.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s6);margin-bottom:var(--s7)}
.section-heading>div:first-child{max-width:none;min-width:0}
.section-heading .text-link{flex-shrink:0}
.section-title{font-size:var(--fs-h2);line-height:1.12;margin-bottom:var(--s4)}
.section-intro{font:400 var(--fs-lead)/1.5 var(--font-text);color:var(--ink);max-width:var(--measure-lead);margin-bottom:0}
.split>div{min-width:0}
.split>img,.split>div>img{width:100%;max-height:none;aspect-ratio:3/2;object-fit:cover;border-radius:0}
.feature-list{display:flex;flex-direction:column;gap:var(--s4);margin-top:var(--s5)}
.feature-row{display:flex;align-items:flex-start;gap:var(--s3);padding:var(--s3) 0;border-bottom:1px solid var(--rule)}
.feature-row:last-child{border-bottom:0}
.feature-row>div{min-width:0;flex:1}
.feature-row h3,.feature-row h4{font:500 var(--fs-body)/1.4 var(--font-text);margin:0 0 4px}
.feature-row p{font-size:var(--fs-small);line-height:1.55;color:var(--muted);margin:0}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--s6);margin-top:var(--s6)}
.step{min-width:0;border-top:1px solid var(--rule);padding-top:var(--s4)}
.step h3{font-size:var(--fs-h4);margin-bottom:var(--s2)}
.step p{font-size:var(--fs-small);line-height:1.55;color:var(--ink);margin:0}
.article-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s5)}
.article-card{min-width:0;display:flex;flex-direction:column;align-items:flex-start;padding:var(--s5);background:var(--white);border:1px solid var(--rule);border-radius:0;box-shadow:none;transition:border-color .12s}
.article-card:hover{border-color:var(--navy);box-shadow:none}
.article-icon{display:none}
.article-card h3{font-size:var(--fs-h4);line-height:1.3;margin-bottom:var(--s2)}
.article-card p{font-size:var(--fs-small);line-height:1.55;color:var(--ink);flex-grow:1;margin-bottom:var(--s3)}
.article-card .text-link{min-height:36px}
.cta-band{background:var(--navy);color:#fff;padding:var(--band-pad) 0}
.cta-band .container{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s6)}
.cta-band h2{color:#fff;font-size:48px;line-height:1.1;max-width:24ch;margin-bottom:var(--s3)}
.cta-band p{color:var(--on-navy-muted);font-size:var(--fs-small);max-width:var(--measure-lead);margin:0}
.cta-band .button{flex-shrink:0}
.two-column{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s5)}
.three-column{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s5)}
.contact-info{display:flex;flex-direction:column;gap:var(--s4);color:var(--ink);font-size:var(--fs-small);margin-top:var(--s6)}
.contact-info>div,.contact-info>a{display:flex;align-items:center;gap:12px}
.contact-info svg{width:18px;height:18px;color:var(--muted)}
.team-placeholder,.video-placeholder{min-height:320px;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;text-align:left;border:0;border-radius:0;background:var(--ledger);color:var(--navy);padding:var(--s6);overflow:hidden;position:relative;gap:var(--s3)}
.video-placeholder{background:var(--navy);color:#fff}
.video-placeholder>span:first-child{width:56px;height:56px;border:1px solid var(--on-navy-rule);border-radius:50%;display:flex;align-items:center;justify-content:center}
.video-placeholder>span:first-child svg{width:22px;height:22px}
.video-placeholder img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.3}
.video-placeholder>div,.video-placeholder>p,.video-placeholder>small{position:relative;z-index:1}
.video-placeholder .icon-button{width:56px;height:56px;border-radius:50%;color:#fff;background:transparent;border-color:#fff}
.team-placeholder h3,.video-placeholder h3{color:inherit;margin:0 0 var(--s3)}
.team-placeholder p,.video-placeholder p{color:inherit;font-size:var(--fs-small);max-width:40ch;margin:0}
.video-placeholder small{color:var(--on-navy-muted)}
.course-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s5)}
.course-card{border:1px solid var(--rule);border-radius:0;background:var(--white);overflow:hidden;padding:var(--s5)}
.course-card h3{margin:var(--s2) 0 var(--s3)}
.course-card p{font-size:var(--fs-small);line-height:1.55;color:var(--ink)}
.course-meta{display:flex;align-items:center;flex-wrap:wrap;gap:var(--s4);color:var(--muted);font-size:var(--fs-caption);margin:var(--s4) 0 0}
.course-meta span{display:flex;align-items:center;gap:6px}
.course-meta svg{width:14px;height:14px}
.market-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s5)}
.market-card{min-width:0;background:var(--white);border:1px solid var(--rule);border-radius:0;overflow:hidden}
.market-image{position:relative;width:100%;aspect-ratio:3/2;overflow:hidden;background:var(--ledger)}
.market-image img{width:100%;height:100%;object-fit:cover}
.market-image>.badge{position:absolute;left:12px;bottom:12px;background:var(--white);border-color:var(--white);color:var(--navy)}
.market-card h2{font-size:var(--fs-h3);font-weight:500}
.market-card>div:not(.market-image){padding:var(--s5)}
.market-card>h3,.market-card>p,.market-card>.eyebrow,.market-card>.text-link,.market-card>.check-list{margin-left:var(--s5);margin-right:var(--s5)}
.market-card>h3{margin-top:var(--s5)}
.market-card>.text-link{margin-bottom:var(--s5)}
.market-card p{font-size:var(--fs-small);line-height:1.55;color:var(--ink)}
.faq-item{border-bottom:1px solid var(--rule)}
.faq-item summary,.faq-item>button{display:flex;align-items:center;justify-content:space-between;width:100%;gap:var(--s5);list-style:none;min-height:64px;padding:12px 0;font:500 var(--fs-body)/1.4 var(--font-text);color:var(--navy);background:transparent;border:0;text-align:left;cursor:pointer}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:'+';font:400 24px/1 var(--font-text);color:var(--navy);flex-shrink:0}
.faq-item[open] summary::after{content:'−'}
.faq-item p,.faq-item>div{color:var(--ink);font-size:var(--fs-small);line-height:1.55;max-width:60ch;padding-bottom:var(--s5);margin-bottom:0}
.owner-preview{border:1px solid var(--rule);border-radius:0;overflow:hidden;background:var(--white);box-shadow:none}
.preview-header{display:flex;align-items:center;padding:10px var(--s4);background:var(--ledger);border-bottom:1px solid var(--rule);font:400 var(--fs-caption)/1.4 var(--font-text);color:var(--muted)}
.preview-header>span:not(:last-child){display:none}
.preview-header>span:last-child{margin:0;text-align:left}
.owner-preview>img{width:100%;aspect-ratio:16/9;object-fit:cover}
.owner-preview>div:not(.preview-header){padding:var(--s5)}
.stepper{display:flex;gap:0;align-items:flex-start;margin:var(--s5) 0 var(--s6)}
.stepper>div{position:relative;flex:1;padding-right:var(--s3);font:400 var(--fs-caption)/1.5 var(--font-text);color:var(--muted)}
.stepper>div::after{content:'';position:absolute;left:32px;right:12px;top:10px;height:1px;background:var(--rule)}
.stepper>div:last-child::after{display:none}
.stepper span:first-child{display:block;width:auto;height:auto;border:0;border-radius:0;background:none;margin-bottom:6px;font:500 var(--fs-caption)/1.5 var(--font-text);color:var(--muted);font-variant-numeric:tabular-nums}
.stepper .active span:first-child{color:var(--navy)}
.stepper .active{color:var(--navy)}

/* ==========================================================================
   Breakpoints — 1200 / 1024 / 720 / 480 only
   ========================================================================== */
@media (max-width:1199px){
  .property-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .nav{gap:18px}
  .nav-link{font-size:14px}
  .nav-actions .button{padding:0 16px}
  .filters{grid-template-columns:repeat(2,minmax(0,1fr))}
  .filters .button{grid-column:1/-1;justify-self:start}
  .tiles,.metric-grid{gap:var(--s4)}
  .market-grid,.article-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:1023px){
  .utility{display:none}
  .mobile-menu{display:inline-flex}
  .nav{display:none}
  .nav.open{display:flex;flex-direction:column;align-items:stretch;gap:0;position:fixed;left:0;right:0;top:var(--header-h);bottom:0;z-index:99;background:var(--white);overflow-y:auto;padding:var(--s4) var(--gutter) var(--s8)}
  .nav.open>.nav-link{display:flex;align-items:center;min-height:56px;padding:0;border-bottom:1px solid var(--rule);font:400 28px/1.2 var(--font-display);color:var(--navy)}
  .nav.open>.nav-link::after{display:none}
  .nav.open>.nav-link.active{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:2px}
  .nav.open>a:not(.nav-link):not(.button),.nav.open .utility__links a,.nav.open .nav__more a{display:flex;align-items:center;min-height:44px;font:400 17px/1.3 var(--font-text);color:var(--ink)}
  .nav.open .utility__links,.nav.open .nav__more{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--rule);margin-top:var(--s4);padding-top:var(--s2)}
  .nav.open>.button,.nav.open .nav__actions .button{display:flex;width:100%;margin-top:var(--s3)}
  .nav.open>.button:first-of-type,.nav.open .nav__actions{margin-top:var(--s6)}
  .nav.open .nav__extra{display:contents}  /* its children join the panel's flex column */
  .nav.open .nav__descriptor{order:-1;margin:0 0 var(--s4)}
  .nav.open .nav__audience{display:flex;flex-direction:column;gap:0;margin-top:var(--s5)}
  .nav.open .nav__audience .record-head__label{margin:0 0 var(--s1)}
  .nav.open .nav__audience a{display:flex;align-items:center;min-height:44px;border-bottom:1px solid var(--rule);font:400 17px/1.3 var(--font-text);color:var(--ink)}
  .nav.open .nav__actions{display:flex;flex-direction:column;gap:var(--s3);margin-top:var(--s6)}
  .nav.open .nav__actions .button{margin-top:0}
  .nav.open .note{margin-top:var(--s6)}
  .footer__grid,.footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s6) var(--s7)}
  .footer__grid>.footer__brand,.footer-grid>div:first-child{grid-column:1/-1}
  .record-head{grid-template-columns:minmax(0,1fr)}
  .record-head__date{grid-column:1;grid-row:auto;justify-self:start;text-align:left;white-space:normal;margin-top:var(--s2)}
  .detail-grid{grid-template-columns:minmax(0,1fr);gap:var(--s6)}
  .detail-aside{order:-1}
  .detail-aside>.ledger,.detail-aside .sticky-card{position:static}
  .detail-main{display:contents}
  .detail-main>.detail-photo,.detail-main>figure:first-child{order:-2}
  .detail-main>:not(.detail-photo):not(figure:first-child){order:1}
  .dashboard-grid,.dashboard-grid.equal{grid-template-columns:minmax(0,1fr)}
  .dashboard-grid>.panel{height:auto}
  .tiles,.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sidebar{top:0;transform:translateX(-100%);box-shadow:none}
  .sidebar.open{transform:translateX(0)}
  .workspace{margin-left:0;width:100%}
  .mobile-portal-toggle{display:inline-flex}
  .workspace-header{padding:0 var(--s5)}
  .workspace>.note--demo,.workspace>.note{padding-left:var(--s5);padding-right:var(--s5)}
  .workspace-content{padding:var(--s5) var(--s5) var(--s7)}
  .three-column{grid-template-columns:repeat(2,minmax(0,1fr))}
  .market-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:719px){
  .header__inner,.header-inner{gap:var(--s3)}
  .nav-actions>.button{display:none}
  .property-grid,.panel-body>.property-grid{grid-template-columns:minmax(0,1fr)}
  .footer{padding:var(--s7) 0 var(--s6)}
  .footer__grid,.footer-grid{grid-template-columns:minmax(0,1fr);gap:var(--s5)}
  .footer__legal,.footer-bottom{flex-direction:column;gap:var(--s3)}
  .page-heading{padding:var(--s6) 0 var(--s5)}
  .filters{grid-template-columns:minmax(0,1fr);padding:var(--s4) var(--s4)}
  .detail-hero,.detail-title{flex-direction:column;align-items:flex-start;gap:var(--s4)}
  .facts,.facts:has(>.fact:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s4)}
  .tabs{gap:var(--s5)}
  .calculator{padding:var(--s4)}
  .calc-result{flex-direction:column;gap:var(--s4)}
  .data-table{min-width:560px}
  .panel .table-wrap{padding:0 var(--s4)}
  .panel-header,.panel-body{padding:var(--s4)}
  .modal-backdrop{padding:var(--s4)}
  .modal{max-width:calc(100% - 0px);max-height:calc(100dvh - 32px)}
  .modal-header{padding:var(--s5) 72px var(--s3) var(--s5)}
  .modal-body{padding:var(--s3) var(--s5) var(--s5)}
  .modal-footer{padding:var(--s4) var(--s5) var(--s5)}
  .toast{left:var(--s4);bottom:var(--s4);max-width:calc(100% - 32px)}
  .compare-grid,.compare-grid:has(>.compare-card:nth-child(2):last-child){grid-template-columns:minmax(0,1fr)}
  .compare-bar{flex-wrap:wrap}
  .section-heading{flex-direction:column;align-items:flex-start;gap:var(--s4);margin-bottom:var(--s6)}
  .two-column,.three-column,.course-grid,.article-grid,.market-grid{grid-template-columns:minmax(0,1fr)}
  .workspace-header{padding:0 var(--gutter);gap:var(--s3)}
  .workspace>.note--demo,.workspace>.note{padding-left:var(--gutter);padding-right:var(--gutter)}
  .workspace-content{padding:var(--s5) var(--gutter) var(--s7)}
  .workspace-title:not(.workspace-header .workspace-title),.workspace-heading{grid-template-columns:minmax(0,1fr);row-gap:var(--s4)}
  .workspace-title .button,.workspace-heading>.button,.workspace-heading>a.button{justify-self:start}
  .portfolio-row{display:grid;grid-template-columns:64px minmax(0,1fr) 36px;column-gap:var(--s3);row-gap:6px}
  .portfolio-row>img{width:64px;height:64px;grid-column:1;grid-row:1/span 2}
  .portfolio-info{grid-column:2;grid-row:1}
  .portfolio-value{grid-column:2;grid-row:2;min-width:0;text-align:left;align-items:center;flex-direction:row;gap:var(--s2);flex-wrap:wrap}
  .portfolio-row>.icon-button{grid-column:3;grid-row:1/span 2}
  .document-row{grid-template-columns:24px minmax(0,1fr) 40px;gap:6px var(--s3)}
  .document-row>.feature-icon,.document-row>svg{grid-column:1;grid-row:1/span 2}
  .document-row>div{grid-column:2;grid-row:1}
  .document-row>.badge{grid-column:2;grid-row:2;justify-self:start}
  .document-row>.icon-button,.document-row>.button,.document-row>.text-link{grid-column:3;grid-row:1/span 2}
  .maintenance-item>.feature-row{flex-wrap:wrap}
  .maintenance-item .feature-row>.badge{margin-left:36px}
  .crm-column,.kanban__well{flex-basis:220px;min-width:220px}
  .bar-chart{gap:var(--s2)}
  .cta-band h2{font-size:30px}
  .steps{grid-template-columns:minmax(0,1fr)}
  .stepper{flex-wrap:wrap;gap:var(--s3)}
  .stepper>div::after{display:none}
}
@media (max-width:479px){
  .brand img{width:204px;height:68px}
  .sidebar-brand .brand img,.footer .brand img{width:240px;height:80px}
  .button{white-space:normal}
  .actions,.hero-actions{flex-direction:column;align-items:stretch}
  .actions .button.primary,.hero-actions .button.primary,.actions .button.navy,.actions .button.secondary{width:100%}
  .actions .button.tertiary{align-self:flex-start}
  .input-grid,.form-grid{grid-template-columns:minmax(0,1fr)}
  .tiles,.metric-grid,.mini-stats{grid-template-columns:minmax(0,1fr)}
  .facts,.facts:has(>.fact:nth-child(2):last-child){grid-template-columns:minmax(0,1fr)}
  .workspace-tools{gap:var(--s2)}
  .workspace-header .stamp{display:none}
  .pill-tabs{display:flex}
  .pill{flex:1 1 auto;justify-content:center}
}

/* ==========================================================================
   Print
   ========================================================================== */
@media print{
  .utility,.header,.sidebar,.footer,.modal-backdrop,.toast,.compare-bar,.skip-link,.nav,.mobile-menu{display:none!important}
  .workspace{margin-left:0;width:100%}
  .workspace-header{position:static;border:0}
  .workspace-shell,.workspace{background:#fff}
  .record,.section{padding:24px 0}
  .panel,.property-card{break-inside:avoid}
  .container{width:100%;max-width:none}
  body:has(.compare-bar){padding-bottom:0}
}
