:root {
  --ink: #1f1a1a;
  --muted: #766f68;
  --cream: #f7f4f0;
  --sand: #ded8cd;
  --line: #ded8cd;
  --walnut: #715620;
  --clay: #cf571c;
  --orange: #f49f00;
  --meadow: #545f27;
  --red: #9d3d36;
  --white: #fffdf9;
  --serif: larken, Georgia, serif;
  --sans: Inter, Arial, sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; color: var(--ink); background: var(--cream); font-family: var(--sans); font-size: 14px; }
button, input, select { font: inherit; }
button { cursor: pointer; }

.login { min-height: 100svh; display: grid; grid-template-columns: minmax(300px, .9fr) minmax(440px, 1.1fr); background: var(--cream); overflow: hidden; }
.login-copy { padding: 6.5vw 7vw; display: flex; flex-direction: column; justify-content: space-between; animation: rise .7s ease both; }
.brand-logo { width: 235px; height: auto; }
.eyebrow { color: var(--clay); text-transform: uppercase; letter-spacing: .16em; font-size: 11px; font-weight: 700; margin: 0 0 16px; }
.login-copy h1 { max-width: 620px; font: 400 clamp(44px, 5.1vw, 76px)/.98 var(--serif); letter-spacing: -.055em; margin: 0; }
.login-copy h1 em { color: var(--meadow); font-style: italic; }
.login-copy p:not(.eyebrow) { color: #5d554c; max-width: 400px; font-size: 16px; line-height: 1.6; margin: 24px 0 0; }
.login-credit { color: var(--muted); font-size: 12px; }
.login-visual { position: relative; min-height: 650px; padding: 8vh 9vw; display: flex; align-items: center; background: linear-gradient(rgba(45, 54, 28, .08), rgba(45, 54, 28, .08)), url("https://www.meadowlarkbuilders.com/hubfs/Jones/MEADOWLARK_HOME_REMODEL_23037_8.webp") center/cover; }
.login-visual::after { content: ""; position: absolute; inset: 0; background: linear-gradient(115deg, rgba(31, 26, 26, .54), rgba(31, 26, 26, .04)); }
.login-panel { width: min(410px, 100%); position: relative; z-index: 1; padding: 38px; background: rgba(255, 253, 249, .94); backdrop-filter: blur(12px); box-shadow: 0 20px 60px rgba(30, 24, 18, .22); animation: rise .7s .12s ease both; }
.login-panel h2 { margin: 0 0 7px; font: 400 34px/1 var(--serif); letter-spacing: -.04em; }
.login-panel p { color: var(--muted); margin: 0 0 26px; }
.field { display: grid; gap: 8px; margin: 16px 0; color: #5c534a; font-size: 12px; font-weight: 600; }
.field input, .search, .mini-input, .select { width: 100%; border: 1px solid #cbc3b8; background: var(--white); padding: 12px 13px; outline-color: var(--clay); }
.password-row { display:flex; align-items: center; justify-content: space-between; margin-top: 12px; }
.remember { display:flex; gap: 8px; align-items:center; color: var(--muted); font-size: 12px; }
.text-btn { padding: 0; border:0; background:none; color: var(--walnut); text-decoration: underline; font-size: 12px; }
.primary { border: 0; padding: 13px 18px; color: #fff; background: var(--walnut); font-weight: 650; transition: transform .18s, background .18s; }
.primary:hover { background: var(--clay); transform: translateY(-1px); }
.login-panel .primary { width: 100%; margin-top: 28px; }
.primary:disabled { cursor:wait; opacity:.62; transform:none; }
.form-alert { margin:0 0 18px; padding:11px 13px; border-left:3px solid var(--red); background:#f7e8e2; color:#7d3024; font-size:11px; line-height:1.45; }
.form-notice { display:flex; flex-direction:column; gap:4px; margin:20px 0 4px; padding:14px 16px; border-left:3px solid var(--meadow); background:#eef0e6; }.form-notice strong { font-size:11px; }.form-notice span { color:var(--muted); font-size:10px; line-height:1.45; }
.auth-loading { min-height:100svh; display:grid; place-items:center; background:var(--cream); }.auth-loading div { display:flex; align-items:center; gap:13px; color:var(--muted); font-size:11px; letter-spacing:.04em; }.auth-loading span { width:18px; height:18px; border:2px solid #d3ccbf; border-top-color:var(--meadow); border-radius:50%; animation:spin .7s linear infinite; }@keyframes spin{to{transform:rotate(360deg)}}
.demo-note { margin: 20px 0 0 !important; font-size: 11px; text-align: center; }

.app-shell { min-height: 100svh; display: grid; grid-template-columns: 236px 1fr; }
.sidebar { position: sticky; top: 0; height: 100svh; display: flex; flex-direction: column; background: #28251f; color: #f7f4f0; padding: 28px 16px 20px; }
.sidebar .brand-logo { width: 166px; filter: brightness(0) invert(1); margin: 0 10px 38px; }
.nav { display: grid; gap: 3px; }
.nav button { border: 0; background: transparent; color: #ccc4b8; display: flex; align-items: center; gap: 12px; padding: 12px 11px; text-align: left; border-left: 2px solid transparent; transition: background .18s, color .18s; }
.nav button:hover, .nav button.active { color: #fffdf9; background: rgba(247, 244, 240, .09); border-left-color: var(--orange); }
.nav-project-group { display:grid; gap:2px; }.nav-project-row { display:grid; grid-template-columns:minmax(0,1fr) 34px; }.nav-project-row .nav-project-parent { min-width:0; }.nav-project-row .nav-project-toggle { justify-content:center; padding:0; border-left:0; }.nav-project-row .nav-project-toggle:hover,.nav-project-row .nav-project-toggle.active { border-left-color:transparent; }.project-subnav { display:grid; gap:1px; padding:2px 0 5px; animation:submenu-in .18s ease both; }.project-subnav button { display:grid; grid-template-columns:8px 1fr auto; gap:9px; padding:7px 11px 7px 40px; font-size:10px; }.project-subnav small { color:#908a81; font-size:9px; }.project-status-dot { width:7px; height:7px; border-radius:50%; background:#aaa39a; }.status-cda { background:#c3a256; }.status-construction { background:#849143; }.status-cr { background:#cf6b3e; }.status-warranty { background:#78829a; }.status-archived { background:#8d8881; }
.nav .icon { width: 18px; color: #dbc783; }
.sidebar-spacer { flex: 1; }
.sidebar-footer { border-top: 1px solid rgba(247,244,240,.15); padding: 18px 10px 0; }
.person { display: flex; gap: 10px; align-items:center; }
.avatar { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: var(--orange); color: var(--ink); font-weight: 700; font-size: 12px; }
.person strong, .person small { display:block; } .person strong { font-size: 12px; } .person small { color:#aaa399; font-size: 11px; margin-top:2px; }
.signout { color:#cfc5b8; margin-top: 14px; }

.workspace { min-width:0; background: var(--cream); }
.topbar { height: 80px; display:flex; align-items:center; justify-content:space-between; padding: 0 42px; border-bottom: 1px solid var(--line); background: rgba(247,244,240,.88); backdrop-filter: blur(10px); position: sticky; top:0; z-index: 4; }
.crumb { display:flex; align-items:baseline; gap:10px; } .crumb h1 { font: 400 31px/1 var(--serif); letter-spacing: -.04em; margin:0; } .crumb span { color:var(--muted); }
.top-actions { display:flex; gap: 12px; align-items:center; }
.avatar-photo { display:block; object-fit:cover; border-radius:50%; background:#d8d2c8; }.sidebar-avatar { width:34px; height:34px; border:2px solid rgba(255,255,255,.18); }.account-control { position:relative; }.account-trigger { width:42px; height:42px; padding:2px; border:1px solid #c9c1b5; border-radius:50%; background:transparent; transition:border-color .16s,transform .16s; }.account-trigger:hover,.account-trigger[aria-expanded="true"] { border-color:var(--clay); transform:translateY(-1px); }.topbar-avatar { width:36px; height:36px; }.account-menu { position:absolute; top:52px; right:0; width:285px; padding:12px; background:var(--white); border:1px solid var(--line); box-shadow:0 18px 50px rgba(31,26,26,.18); animation:rise .18s ease both; }.account-identity { display:grid; grid-template-columns:48px 1fr; gap:12px; align-items:center; padding:7px 5px 14px; border-bottom:1px solid var(--line); }.account-menu-photo { width:48px; height:48px; }.account-identity strong,.account-identity span,.account-identity small { display:block; }.account-identity strong { font-size:12px; }.account-identity span { margin-top:2px; color:#554e47; font-size:10px; }.account-identity small { margin-top:4px; color:var(--muted); font-size:9px; }.account-menu > button { width:100%; display:flex; flex-direction:column; align-items:flex-start; gap:3px; padding:11px 5px; border:0; border-bottom:1px solid var(--line); background:transparent; text-align:left; }.account-menu > button:hover { background:#f3efe8; padding-left:10px; }.account-menu > button span { color:var(--ink); font-weight:700; font-size:11px; }.account-menu > button small { color:var(--muted); font-size:9px; }.account-menu > .account-signout { border-bottom:0; }.account-menu > .account-signout span { color:var(--red); }
.search-wrap { position:relative; } .search { width: 245px; padding: 10px 12px 10px 34px; background:transparent; } .search-icon { position:absolute; left:12px; top:10px; color:var(--muted); }
.round-btn { width: 38px; height:38px; background:transparent; border:1px solid var(--line); color:var(--ink); }
.content { padding: 36px 42px 54px; max-width: 1500px; margin: 0 auto; animation: fade .35s ease both; }
.page-head { display: flex; align-items:flex-end; justify-content:space-between; gap: 20px; margin-bottom: 30px; }
.page-head p { color:var(--muted); margin: 7px 0 0; }
.page-head h2 { margin:0; font: 400 42px/1 var(--serif); letter-spacing:-.045em; }
.action-row { display:flex; gap: 9px; }
.secondary { background:transparent; color:var(--ink); border:1px solid #bdb4a9; padding: 12px 16px; }
.dashboard-grid { display:grid; grid-template-columns: 1.3fr .7fr; gap: 42px; align-items:start; }
.section-label { color:var(--muted); text-transform:uppercase; letter-spacing:.14em; font-size:10px; font-weight:700; margin:0 0 13px; }
.metrics { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--ink); border-bottom:1px solid var(--line); }
.metric { padding: 20px 15px 18px 0; border-right:1px solid var(--line); margin-right:17px; } .metric:last-child { border:0; }
.metric .number { font: 400 40px/1 var(--serif); letter-spacing:-.04em; }.metric p { margin:7px 0 0; color:var(--muted); font-size:12px; }.delta { color:var(--meadow); font-weight:700; }
.schedule { margin-top:43px; }.schedule-line { display:grid; grid-template-columns:100px 1fr auto; gap: 16px; align-items:center; padding: 15px 0; border-top:1px solid var(--line); }.schedule-line:last-child { border-bottom:1px solid var(--line); }.schedule-time { font-weight:700; font-size:12px; }.schedule-line strong { display:block; font-size:13px; }.schedule-line span { display:block; color:var(--muted); font-size:12px; margin-top:3px; }.tag { border-radius:20px; padding:6px 9px; font-size:10px; font-weight:700; background:#e5ead7; color:#364315; }.tag.clay { color:#87401f; background:#fae1d5; }.tag.sand { color:#59491c; background:#ece3be; }
.side-section { padding-bottom:30px; margin-bottom:29px; border-bottom:1px solid var(--line); }.side-section:last-child { border:0; }.project-brief { display:flex; gap:13px; padding:11px 0; }.project-dot { width:10px; height:10px; margin-top:5px; background:var(--meadow); }.project-dot.clay { background:var(--clay); }.project-dot.orange { background:var(--orange); }.project-brief strong { font-size:13px; }.project-brief p { margin:3px 0 0; color:var(--muted); font-size:12px; }.amount { margin-left:auto; font-weight:700; font-size:12px; white-space:nowrap; }
.table-toolbar { display:flex; justify-content:space-between; margin-bottom:16px; align-items:center; }.table-toolbar .search { width:220px; }.filter { color:var(--muted); font-size:12px; }
.data-table { width:100%; border-collapse:collapse; background:rgba(255,253,249,.55); }.data-table th { text-align:left; padding:0 12px 11px; color:var(--muted); text-transform:uppercase; letter-spacing:.1em; font-size:10px; font-weight:700; }.data-table td { padding:15px 12px; border-top:1px solid var(--line); font-size:13px; }.data-table tr { transition:background .16s; }.data-table tbody tr:hover { background:#fffdf9; }.data-table td:first-child, .data-table th:first-child { padding-left:0; }.project-name { font-weight:700; }.sub { color:var(--muted); font-size:12px; margin-top:3px; }.status { display:inline-flex; align-items:center; gap:6px; font-size:11px; }.status::before { content:""; width:7px; height:7px; background:var(--meadow); border-radius:50%; }.status.plan::before { background:var(--orange); }.status.review::before { background:var(--clay); }.status.paid::before { background:var(--meadow); }
.project-layout { display:grid; grid-template-columns:1.35fr .65fr; gap:42px; }.project-hero { padding:30px 0; border-top:1px solid var(--ink); border-bottom:1px solid var(--line); display:flex; justify-content:space-between; gap:20px; }.project-hero h3 { font:400 33px/1 var(--serif); letter-spacing:-.04em; margin:0; }.project-hero p { color:var(--muted); margin:8px 0 0; }.stage { align-self:flex-start; background:#e4e9d5; color:#364315; padding:7px 11px; font-size:11px; font-weight:700; }.progress { margin-top:34px; }.progress-line { height:5px; background:var(--sand); }.progress-line i { display:block; width:68%; height:100%; background:var(--meadow); }.progress-meta { display:flex; justify-content:space-between; color:var(--muted); font-size:12px; margin-top:9px; }.work-list { margin-top:34px; }.work-item { display:grid; grid-template-columns:28px 1fr auto; gap:12px; padding:14px 0; border-top:1px solid var(--line); align-items:center; }.check { width:19px; height:19px; border:1px solid #b8afa2; display:grid; place-items:center; color:#fff; font-size:12px; }.done .check { background:var(--meadow); border-color:var(--meadow); }.work-item strong { font-size:13px; }.work-item p { margin:3px 0 0; color:var(--muted); font-size:12px; }.due { color:var(--clay); font-size:11px; white-space:nowrap; }.summary-block { border-top:1px solid var(--ink); padding:18px 0; }.summary-block h4 { margin:0 0 9px; font-size:12px; text-transform:uppercase; letter-spacing:.1em; }.summary-block p { color:var(--muted); line-height:1.55; margin:0; }.key-value { display:flex; justify-content:space-between; padding:9px 0; border-top:1px solid var(--line); }.key-value span { color:var(--muted); }.key-value strong { font-size:13px; }
.project-record-head { margin-bottom:22px; }
.project-record-head .action-row { align-items:center; }
.project-status-control { min-width:155px; }.project-status-control span { display:block; margin-bottom:5px; color:var(--muted); text-transform:uppercase; letter-spacing:.1em; font-size:9px; font-weight:700; }.project-status-control select { width:100%; padding:10px 34px 10px 12px; border:1px solid #c8c0b4; background:var(--white); color:var(--ink); font-size:12px; font-weight:700; }.project-status-label { display:inline-flex; align-items:center; gap:7px; font-size:11px; font-weight:700; }.project-status-label::before { content:""; width:7px; height:7px; border-radius:50%; background:#aaa39a; }.project-status-label.status-cda::before { background:#c3a256; }.project-status-label.status-construction::before { background:#849143; }.project-status-label.status-cr::before { background:#cf6b3e; }.project-status-label.status-warranty::before { background:#78829a; }.project-status-label.status-archived::before { background:#8d8881; }
.project-actions-control { position:relative; }.project-actions-trigger { display:flex; align-items:center; justify-content:space-between; gap:16px; min-width:145px; white-space:nowrap; }.project-actions-menu { position:absolute; z-index:8; top:48px; right:0; width:315px; max-height:calc(100svh - 190px); overflow-y:auto; padding:12px; background:var(--white); border:1px solid var(--line); box-shadow:0 18px 55px rgba(31,26,26,.2); animation:rise .18s ease both; }.project-actions-menu section { padding:5px 0 10px; border-bottom:1px solid var(--line); }.project-actions-menu section:last-child { border-bottom:0; padding-bottom:2px; }.project-actions-menu p { margin:0 6px 5px; color:var(--clay); text-transform:uppercase; letter-spacing:.12em; font-size:9px; font-weight:700; }.project-actions-menu button { width:100%; display:flex; align-items:center; justify-content:space-between; gap:18px; padding:9px 7px; border:0; background:transparent; color:var(--ink); text-align:left; font-size:11px; }.project-actions-menu button:hover { background:#f0ece5; padding-left:12px; }.project-actions-menu em { color:var(--muted); font-style:normal; }
.project-tabs { display:flex; gap:0; overflow-x:auto; scrollbar-width:thin; border-bottom:1px solid var(--line); margin:0 -42px 30px; padding:0 42px; }
.project-tab { flex:0 0 auto; border:0; border-bottom:2px solid transparent; background:transparent; color:var(--muted); padding:13px 12px 12px; font-size:11px; font-weight:650; transition:color .16s, border-color .16s, background .16s; }
.project-tab:hover { color:var(--ink); background:rgba(113,86,32,.05); }
.project-tab.active { color:var(--ink); border-bottom-color:var(--clay); }
.project-tab-panel { min-height:470px; animation:fade .25s ease both; }
.project-kpis { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--ink); border-bottom:1px solid var(--line); margin-bottom:40px; }
.project-kpis.three { grid-template-columns:repeat(3,1fr); }
.project-kpis > div { padding:20px 20px 18px 0; margin-right:20px; border-right:1px solid var(--line); }
.project-kpis > div:last-child { border:0; margin:0; }
.project-kpis strong { display:block; font:400 34px/1 var(--serif); letter-spacing:-.04em; }
.project-kpis span { display:block; color:var(--muted); font-size:11px; margin-top:7px; }
.section-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:22px; margin-bottom:25px; }
.section-heading h3 { margin:0; font:400 30px/1.05 var(--serif); letter-spacing:-.04em; }
.section-heading p:not(.section-label) { margin:7px 0 0; color:var(--muted); }
.phase-track { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--ink); margin-bottom:40px; }
.phase { position:relative; padding:18px 12px 16px 0; border-bottom:1px solid var(--line); color:var(--muted); }
.phase::after { content:""; position:absolute; left:0; right:0; top:-2px; height:3px; background:transparent; }
.phase.done::after, .phase.current::after { background:var(--meadow); }
.phase.current::after { background:var(--orange); }
.phase i { width:23px; height:23px; border:1px solid #b8afa2; border-radius:50%; display:grid; place-items:center; font-style:normal; font-size:10px; margin-bottom:10px; }
.phase.done i { color:white; background:var(--meadow); border-color:var(--meadow); }
.phase.current i { color:var(--ink); background:var(--orange); border-color:var(--orange); }
.phase strong, .phase span { display:block; }.phase strong { color:var(--ink); font-size:12px; }.phase span { font-size:10px; margin-top:4px; }
.compact-item { display:flex; gap:12px; align-items:flex-start; padding:12px 0; border-top:1px solid var(--line); }
.compact-item .project-dot { flex:0 0 auto; }
.compact-item strong { font-size:12px; }.compact-item p { margin:3px 0 0; font-size:11px; }
.done-check { background:var(--meadow); border-color:var(--meadow); flex:0 0 auto; }
.muted-stage { background:#eee6da; color:var(--walnut); }
.record-list { border-top:1px solid var(--ink); }
.record-row { display:grid; grid-template-columns:38px 1fr auto; gap:16px; align-items:start; padding:18px 0; border-bottom:1px solid var(--line); }
.record-row > span { color:var(--clay); font:400 21px/1 var(--serif); }
.record-row strong { font-size:13px; }.record-row p { margin:5px 0 0; color:var(--muted); line-height:1.5; }
.record-row em { font-style:normal; font-size:10px; color:var(--walnut); background:#ece3d4; padding:5px 8px; }
.timeline { border-top:1px solid var(--ink); }
.timeline-item { display:grid; grid-template-columns:145px 1fr; gap:24px; padding:20px 0; border-bottom:1px solid var(--line); }
.timeline-item time { color:var(--muted); font-size:11px; }
.timeline-item strong { font-size:13px; }.timeline-item p { color:#554e47; line-height:1.5; margin:6px 0; }.timeline-item span { color:var(--muted); font-size:10px; }
.sidebar { overflow-y:auto; }
.record-tabs { display:flex; gap:3px; overflow-x:auto; border-bottom:1px solid var(--line); margin:0 -42px 30px; padding:0 42px; scrollbar-width:thin; }
.record-tab { flex:0 0 auto; padding:12px 14px; border:0; border-bottom:2px solid transparent; background:transparent; color:var(--muted); font-size:11px; font-weight:650; }
.record-tab:hover { color:var(--ink); background:rgba(113,86,32,.05); }.record-tab.active { color:var(--ink); border-bottom-color:var(--clay); }
.record-detail-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; margin-top:40px; }
.compact-actions { display:flex; flex-wrap:wrap; gap:16px; margin-top:15px; }.compact-actions.centered { justify-content:center; }
.audit-stamp { margin-top:18px !important; padding-top:12px; border-top:1px solid var(--line); font-size:10px !important; }
.photo-section { margin-top:40px; padding-top:22px; border-top:1px solid var(--ink); }.photo-section h3 { margin:0; font:400 30px/1 var(--serif); letter-spacing:-.04em; }
.photo-pair { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:20px; }.photo-pair figure { margin:0; }.photo-pair img,.project-photo { width:100%; height:230px; object-fit:cover; display:block; background:#d8d0c3; }.project-photo.before { background:linear-gradient(135deg,rgba(84,95,39,.5),rgba(113,86,32,.35)),url("https://www.meadowlarkbuilders.com/hubfs/How%20to%20Know%20You%20Can%20Trust%20a%20Home%20Builder.jpg") center/cover; }.photo-pair figcaption { color:var(--muted); font-size:10px; margin-top:7px; }
.type-chip { display:inline-block; background:#eee5d8; color:var(--walnut); padding:5px 8px; font-size:10px; font-weight:700; }
[data-open-project],[data-open-contact],[data-open-invoice],[data-nav] { cursor:pointer; }
.quick-filters { display:flex; flex-wrap:wrap; gap:7px; margin:0 0 20px; }.quick-filters button { border:1px solid var(--line); background:transparent; padding:7px 11px; color:var(--muted); font-size:10px; }.quick-filters button:hover,.quick-filters button.active { color:var(--ink); background:#ece5da; border-color:#cbbfae; }
.invoice-record-grid { display:grid; grid-template-columns:minmax(0,1fr) 220px; gap:38px; }.toggle-line { display:flex; gap:9px; align-items:center; padding:8px 0; border-top:1px solid var(--line); color:var(--muted); font-size:12px; }.toggle-line input { accent-color:var(--meadow); }
.payment-grid { display:grid; grid-template-columns:1fr 280px; gap:40px; margin-top:36px; }.invoice-totals > div { display:flex; justify-content:space-between; padding:8px 0; border-top:1px solid var(--line); }.invoice-totals span { color:var(--muted); }.invoice-totals .balance { border-top-color:var(--ink); font-size:15px; }
.action-stack { display:grid; gap:8px; margin-bottom:28px; }.action-stack button { width:100%; }.full-width { width:100%; }
.time-record-head { display:grid; grid-template-columns:1.5fr 1fr 1fr .7fr; gap:25px; padding:0 0 20px; border-bottom:1px solid var(--ink); }.time-record-head span,.time-record-head strong { display:block; }.time-record-head span { color:var(--muted); text-transform:uppercase; letter-spacing:.1em; font-size:9px; margin-bottom:5px; }.time-record-head strong { font-size:12px; }
.mismatch-alert { display:flex; align-items:center; gap:15px; padding:12px 0; color:#8d302b; border-bottom:1px solid #e1c3bb; }.mismatch-alert span { color:var(--muted); font-size:11px; }.mismatch-alert button { margin-left:auto; color:#8d302b; }
.time-workspace { display:grid; grid-template-columns:minmax(0,1fr) 190px; gap:30px; margin-top:24px; }.dense-table { min-width:1050px; }.dense-table th,.dense-table td { padding:10px 8px; font-size:11px; }.warning-text { display:block; color:#a33d31; font-size:9px; font-weight:700; margin-top:3px; }.icon-btn { border:0; background:transparent; color:var(--walnut); }
.daily-totals { display:flex; gap:8px; margin-top:14px; }.daily-totals div { min-width:64px; padding:8px; border-top:1px solid var(--ink); }.daily-totals strong,.daily-totals span { display:block; text-align:center; }.daily-totals span { color:var(--muted); font-size:9px; margin-top:3px; }.verification-row { display:flex; justify-content:flex-end; gap:20px; margin-top:18px; color:var(--muted); font-size:11px; }.verification-row input { accent-color:var(--meadow); }
.report-link { display:block; width:100%; text-align:left; padding:8px 0; border-bottom:1px solid var(--line); text-decoration:none; }.billable-panel { margin-top:25px; padding:18px 22px; background:#e6eadb; color:var(--meadow); }.billable-panel strong { font:400 30px var(--serif); margin-right:9px; }
.operations-grid { display:grid; grid-template-columns:1fr 1fr; gap:40px; }.report-row { width:100%; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:14px 0; border:0; border-top:1px solid var(--line); background:transparent; text-align:left; }.report-row strong { font-size:12px; }.report-row span { color:var(--muted); font-size:11px; }
.settings-list { border-top:1px solid var(--ink); }.settings-list > div { display:grid; grid-template-columns:1fr 240px; align-items:center; gap:20px; padding:16px 0; border-bottom:1px solid var(--line); }.settings-list strong { font-size:12px; }
.settings-panel { animation:fade .2s ease both; }.settings-toolbar { display:flex; justify-content:space-between; align-items:flex-end; gap:28px; padding-bottom:22px; }.settings-toolbar h3 { margin:0; font:400 32px/1 var(--serif); letter-spacing:-.04em; }.settings-toolbar p:not(.section-label) { margin:8px 0 0; color:var(--muted); font-size:12px; }.settings-summary { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--ink); border-bottom:1px solid var(--line); margin-bottom:30px; }.settings-summary div { padding:18px 20px 17px 0; margin-right:20px; border-right:1px solid var(--line); }.settings-summary div:last-child { border:0; }.settings-summary strong { display:block; font:400 30px/1 var(--serif); }.settings-summary span { display:block; margin-top:5px; color:var(--muted); font-size:10px; }.settings-table { min-width:760px; }.user-cell { display:flex; align-items:center; gap:11px; }.user-cell strong,.user-cell small { display:block; }.user-cell small { margin-top:3px; color:var(--muted); font-size:10px; }.muted-avatar { background:#d7d1c6; color:var(--muted); }.table-avatar { width:32px; height:32px; }.role-badge { display:inline-flex; padding:4px 8px; border-radius:999px; background:#e8e4dc; color:#514a42; font-size:9px; font-weight:700; }.role-super_admin { background:#e5ead9; color:#4c5d2f; }.role-admin { background:#eee4d6; color:#73532b; }.permission-note { display:grid; grid-template-columns:160px 1fr; gap:18px; margin-top:24px; padding-top:18px; border-top:1px solid var(--line); font-size:11px; }.permission-note span { color:var(--muted); }
.role-layout { display:grid; grid-template-columns:minmax(0,1fr) 255px; gap:40px; align-items:start; border-top:1px solid var(--ink); padding-top:1px; }.role-layout > section { min-width:0; }.role-inspector { border-top:1px solid var(--ink); padding-top:18px; }.role-inspector h4 { margin:0 0 18px; font:400 26px var(--serif); }.role-inspector .primary { margin-top:18px; }.role-table { min-width:670px; }
.settings-module-nav { display:flex; gap:4px; padding:0 0 24px; border-bottom:1px solid var(--ink); }.settings-module-nav button { border:1px solid var(--line); background:transparent; padding:10px 14px; color:var(--muted); font-size:11px; font-weight:700; transition:background .16s,color .16s,border-color .16s; }.settings-module-nav button:hover,.settings-module-nav button.active { color:#fff; background:var(--meadow); border-color:var(--meadow); }.settings-module-panel { padding-top:26px; animation:rise .2s ease both; }.module-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:30px; margin-bottom:23px; }.module-heading h4 { margin:0; font:400 28px/1 var(--serif); letter-spacing:-.04em; }.module-heading p:not(.section-label) { max-width:670px; margin:8px 0 0; color:var(--muted); font-size:12px; line-height:1.5; }.module-footer { display:flex; justify-content:space-between; gap:22px; align-items:center; margin-top:18px; padding-top:14px; border-top:1px solid var(--line); color:var(--muted); font-size:10px; }
.language-set { border-top:1px solid var(--line); }.language-set > div { display:grid; grid-template-columns:38px minmax(0,1fr) auto; gap:18px; align-items:start; padding:20px 0; border-bottom:1px solid var(--line); }.language-index { display:grid; place-items:center; width:30px; height:30px; background:#e7e9dc; color:var(--meadow); font-size:10px; font-weight:700; }.language-set strong { font-size:13px; }.language-set p { margin:6px 0; color:#554e47; line-height:1.5; font-size:11px; }.language-set small { color:var(--muted); }.language-set > div > div:last-child { display:flex; align-items:center; gap:18px; }
.integration-list { border-top:1px solid var(--ink); }.integration-row { display:grid; grid-template-columns:48px minmax(0,1fr) auto 100px; gap:18px; align-items:center; padding:22px 0; border-bottom:1px solid var(--line); }.integration-mark { width:42px; height:42px; display:grid; place-items:center; background:#e8e2d8; color:var(--walnut); font:700 11px var(--sans); }.integration-row strong,.integration-row p,.integration-row small { display:block; }.integration-row p { margin:5px 0; color:#554e47; font-size:11px; }.integration-row small { color:var(--muted); font-size:10px; }.integration-state { color:var(--muted); font-size:10px; white-space:nowrap; }.integration-state::before { content:""; display:inline-block; width:7px; height:7px; margin-right:7px; border-radius:50%; background:#aaa39a; }.integration-state.connected { color:var(--meadow); }.integration-state.connected::before { background:var(--meadow); }.integration-row button { width:100%; }.integration-note { display:grid; grid-template-columns:auto 1fr auto; gap:18px; align-items:center; margin-top:25px; padding:16px 0; border-top:1px solid var(--ink); border-bottom:1px solid var(--line); }.integration-note span { color:var(--muted); font-size:11px; }
.toast { position:fixed; z-index:30; right:24px; bottom:24px; min-width:280px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:14px 16px; background:#28251f; color:#fff; box-shadow:0 14px 45px rgba(31,26,26,.25); animation:rise .22s ease both; pointer-events:none; }.toast button { border:0; background:transparent; color:#fff; font-size:18px; pointer-events:auto; }
.estimate-topline { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; padding-bottom:20px; }.estimate-topline h3 { margin:0; font:400 31px/1.08 var(--serif); letter-spacing:-.04em; }.estimate-actions { display:flex; gap:8px; }
.estimate-metrics { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--ink); border-bottom:1px solid var(--line); margin-bottom:38px; }.estimate-metrics > div { padding:19px 20px 18px 0; margin-right:20px; border-right:1px solid var(--line); }.estimate-metrics > div:last-child { border-right:0; margin-right:0; }.estimate-metrics span,.estimate-metrics small { display:block; color:var(--muted); }.estimate-metrics span { font-size:10px; text-transform:uppercase; letter-spacing:.08em; }.estimate-metrics strong { display:block; margin:7px 0 4px; font:400 31px/1 var(--serif); letter-spacing:-.04em; }.estimate-metrics small { font-size:10px; }
.estimate-workspace { display:grid; grid-template-columns:minmax(0,1fr) 255px; gap:40px; align-items:start; }.estimate-workspace > main { min-width:0; }.estimate-section { margin-bottom:42px; border-top:1px solid var(--ink); padding-top:17px; }.estimate-section .table-scroll { max-width:100%; overflow-x:auto; }.estimate-section-head { display:flex; justify-content:space-between; gap:25px; align-items:flex-start; margin-bottom:15px; }.estimate-section-head h4 { margin:0; font:400 25px/1.1 var(--serif); letter-spacing:-.035em; }.estimate-section-head p:not(.section-label) { max-width:560px; margin:7px 0 0; color:var(--muted); font-size:11px; line-height:1.5; }.selected-estimate { flex:0 0 auto; padding:7px 10px; background:#e8eadf; color:var(--meadow); font-size:10px; font-weight:700; }
.estimate-table { min-width:800px; }.estimate-table th { padding-top:4px; }.estimate-table td { padding-top:12px; padding-bottom:12px; }.estimate-table tfoot td { border-top:1px solid var(--ink); background:rgba(238,232,220,.5); }.estimate-version-row { cursor:pointer; }.estimate-version-row.selected td { background:#ece9df; }.estimate-name { display:flex; align-items:center; gap:10px; }.estimate-name i { width:6px; height:34px; background:var(--sand); transition:background .16s, transform .16s; }.estimate-version-row.selected .estimate-name i { background:var(--clay); transform:scaleY(1.12); }.estimate-name span { display:block; margin-top:3px; color:var(--muted); font-size:10px; }.estimate-table-footer { display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px; align-items:center; padding:12px 0; color:var(--muted); font-size:11px; }.estimate-table-footer label { display:flex; align-items:center; gap:7px; }.estimate-table-footer input,.estimate-reconciliation input,.estimate-table input { accent-color:var(--meadow); }
.estimate-compare { display:grid; grid-template-columns:repeat(3,1fr) auto; gap:22px; align-items:end; margin:-18px 0 40px; padding:19px 21px; background:var(--meadow); color:#fff; animation:rise .2s ease both; }.estimate-compare span,.estimate-compare small,.estimate-compare strong { display:block; }.estimate-compare span { color:#dfe5c8; font-size:9px; text-transform:uppercase; letter-spacing:.1em; }.estimate-compare strong { margin:5px 0 2px; font-size:13px; }.estimate-compare small { color:#dfe5c8; font-size:10px; }.estimate-compare .secondary { border-color:#dfe5c8; color:#fff; }
.estimate-notes { display:block; margin-top:18px; color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.08em; }.estimate-notes textarea { display:block; width:100%; min-height:68px; resize:vertical; margin-top:8px; padding:12px; border:1px solid var(--line); background:rgba(255,253,249,.55); color:var(--ink); font:12px/1.5 var(--sans); }
.estimate-reconciliation { display:grid; grid-template-columns:1.5fr repeat(5,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.estimate-reconciliation > div,.estimate-reconciliation > label { min-height:69px; padding:13px 12px; border-right:1px solid var(--line); }.estimate-reconciliation > :last-child { border-right:0; }.estimate-reconciliation span,.estimate-reconciliation strong { display:block; }.estimate-reconciliation span { color:var(--muted); font-size:9px; text-transform:uppercase; letter-spacing:.07em; margin-bottom:8px; }.estimate-reconciliation strong { font-size:12px; }.negative { color:var(--red); }.internal-awa td { background:#f0eee8; }
.estimate-inspector { position:sticky; top:20px; }.estimate-inspector section { padding:17px 0 25px; border-top:1px solid var(--ink); }.estimate-inspector .key-value { display:grid; grid-template-columns:1fr auto; gap:15px; }.estimate-inspector .key-value span,.estimate-inspector .key-value strong { font-size:11px; }.margin-meter { height:6px; margin:12px 0 9px; background:var(--sand); }.margin-meter i { display:block; width:42%; height:100%; background:var(--meadow); animation:meter-in .65s ease both; }.margin-label { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:15px; }.margin-label strong { font:400 28px var(--serif); }.margin-label span { color:var(--muted); font-size:10px; }.outstanding { display:flex; justify-content:space-between; align-items:baseline; margin:10px 0 15px; }.outstanding span { color:var(--muted); font-size:11px; }.outstanding strong { color:var(--red); font:400 24px var(--serif); }
.invoices-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-bottom:35px; }.amount-block { border-top:1px solid var(--ink); padding-top:12px; }.amount-block strong { display:block; font:400 37px/1 var(--serif); letter-spacing:-.04em; }.amount-block span { color:var(--muted); font-size:12px; display:block; margin-top:6px; }
.time-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:42px; }.time-total { padding:28px 0; border-top:1px solid var(--ink); border-bottom:1px solid var(--line); }.time-total strong { font:400 67px/1 var(--serif); letter-spacing:-.06em; }.time-total span { color:var(--muted); margin-left:8px; }.bar-row { display:grid; grid-template-columns:66px 1fr 35px; gap:12px; align-items:center; margin:15px 0; font-size:12px; }.bar { height:8px; background:var(--sand); }.bar i { display:block; height:100%; background:var(--walnut); }.doc-list { border-top:1px solid var(--ink); }.doc-row { padding:15px 0; border-bottom:1px solid var(--line); display:flex; align-items:center; gap:12px; }.file-icon { width:35px; height:40px; background:#e7ddcf; display:grid; place-items:center; color:var(--walnut); font-size:11px; font-weight:700; }.doc-row strong { font-size:13px; }.doc-row span { display:block; color:var(--muted); font-size:11px; margin-top:3px; }.doc-row button { margin-left:auto; }
.empty { padding:68px 0; border-top:1px solid var(--ink); color:var(--muted); text-align:center; }.empty strong { display:block; color:var(--ink); font:400 28px var(--serif); margin-bottom:8px; }
.modal-bg { position:fixed; inset:0; background:rgba(31,26,26,.48); display:grid; place-items:center; z-index:10; padding:20px; }.modal { width:min(540px,100%); background:var(--cream); padding:30px; box-shadow:0 24px 80px rgba(0,0,0,.25); animation:rise .22s ease both; }.modal-head { display:flex; justify-content:space-between; align-items:flex-start; }.modal h3 { margin:0; font:400 30px var(--serif); letter-spacing:-.04em; }.close { border:0; background:transparent; font-size:21px; }.form-grid { display:grid; grid-template-columns:1fr 1fr; gap: 0 16px; margin-top:18px; }.modal-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:24px; }
.account-dialog { width:min(620px,100%); }.profile-photo-editor { display:grid; grid-template-columns:100px 1fr; gap:22px; align-items:center; margin-top:22px; padding:20px 0; border-top:1px solid var(--ink); border-bottom:1px solid var(--line); }.profile-photo { width:96px; height:96px; }.profile-photo-editor strong { font-size:12px; }.profile-photo-editor p,.account-dialog-copy,.password-fields > p { color:var(--muted); font-size:11px; line-height:1.5; }.profile-photo-editor p { margin:5px 0 12px; }.photo-upload { display:inline-flex; position:relative; overflow:hidden; }.photo-upload input { position:absolute; width:1px; height:1px; opacity:0; }.account-dialog-copy { margin:20px 0 0; padding-top:18px; border-top:1px solid var(--ink); }.password-fields { margin-top:18px; }.password-fields .field { max-width:420px; }.password-fields > p { margin:0; }.user-admin-dialog { width:min(620px,100%); }.form-grid-wide { grid-column:1/-1; }.field-help { margin:0; color:var(--muted); font-size:10px; line-height:1.45; }.account-active { align-self:end; min-height:44px; }.user-security-actions { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-top:22px; padding:18px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.user-security-actions strong,.user-security-actions span { display:block; }.user-security-actions strong { font-size:11px; }.user-security-actions span { margin-top:4px; color:var(--muted); font-size:10px; }
.report-dialog { width:min(680px,100%); }.report-context { display:grid; grid-template-columns:1.2fr .8fr; gap:22px; margin-top:22px; padding:14px 0; border-top:1px solid var(--ink); border-bottom:1px solid var(--line); }.report-context span,.report-context strong { display:block; }.report-context span { color:var(--muted); text-transform:uppercase; letter-spacing:.09em; font-size:9px; }.report-context strong { margin-top:5px; font-size:11px; }.report-preview-metrics { display:grid; grid-template-columns:repeat(3,1fr); border-bottom:1px solid var(--line); }.report-preview-metrics div { padding:22px 18px 20px 0; margin-right:18px; border-right:1px solid var(--line); }.report-preview-metrics div:last-child { border-right:0; }.report-preview-metrics span,.report-preview-metrics strong { display:block; }.report-preview-metrics span { color:var(--muted); font-size:9px; text-transform:uppercase; letter-spacing:.08em; }.report-preview-metrics strong { margin-top:7px; font:400 28px var(--serif); }.report-preview-table { margin-top:20px; border-top:1px solid var(--ink); }.report-preview-table div { display:flex; justify-content:space-between; gap:20px; padding:11px 0; border-bottom:1px solid var(--line); }.report-preview-table span { color:var(--muted); font-size:11px; }.report-preview-table strong { font-size:11px; }
.mobile-menu { display:none; }
@keyframes rise { from { opacity:0; transform:translateY(15px); } to { opacity:1; transform:translateY(0); } }
@keyframes fade { from{opacity:0} to{opacity:1} }
@keyframes meter-in { from { width:0; } }
@keyframes submenu-in { from { opacity:0; transform:translateY(-5px); } }
@media (max-width: 900px) { .login { grid-template-columns:1fr; }.login-copy { min-height:45svh; padding:40px 28px; }.login-visual { min-height:55svh; padding:40px 28px; }.app-shell { grid-template-columns:1fr; }.sidebar { position:fixed; z-index:8; width:236px; transform:translateX(-100%); transition:transform .25s; }.sidebar.open { transform:translateX(0); }.mobile-menu { display:block; }.topbar { height:66px; padding:0 20px; }.topbar .crumb span, .search-wrap { display:none; }.content { padding:28px 20px; }.dashboard-grid,.project-layout,.time-grid,.invoice-record-grid,.time-workspace,.operations-grid,.estimate-workspace,.role-layout { grid-template-columns:1fr; gap:32px; }.metrics { grid-template-columns:1fr; }.metric { border-right:0; border-bottom:1px solid var(--line); margin:0; }.metric:last-child { border:0; }.invoices-summary { grid-template-columns:1fr; gap:18px; }.page-head { align-items:flex-start; flex-direction:column; }.project-tabs,.record-tabs { margin-left:-20px; margin-right:-20px; padding:0 20px; }.project-kpis { grid-template-columns:repeat(2,1fr); }.project-kpis.three { grid-template-columns:repeat(3,1fr); }.record-detail-grid { grid-template-columns:1fr 1fr; }.phase-track { grid-template-columns:repeat(2,1fr); }.time-record-head { grid-template-columns:1fr 1fr; }.estimate-inspector { position:static; display:grid; grid-template-columns:repeat(3,1fr); gap:25px; }.estimate-compare { grid-template-columns:repeat(3,1fr); }.estimate-compare button { grid-column:1/-1; }.data-table { min-width:700px; }.table-scroll { overflow:auto; } }
@media (max-width: 520px) { .login-panel { padding:28px 22px; }.brand-logo { width:190px; }.login-copy h1 { font-size:45px; }.action-row { width:100%; }.action-row button { flex:1; }.top-actions .primary { display:none; }.page-head h2 { font-size:35px; }.project-kpis,.project-kpis.three,.estimate-metrics,.settings-summary { grid-template-columns:1fr 1fr; }.project-kpis > div,.estimate-metrics > div { margin-right:10px; }.estimate-metrics > div:nth-child(2) { border-right:0; }.estimate-topline,.estimate-section-head,.settings-toolbar,.module-heading { align-items:flex-start; flex-direction:column; }.estimate-actions { width:100%; }.estimate-actions button { flex:1; }.estimate-inspector,.estimate-compare { grid-template-columns:1fr; }.estimate-reconciliation { grid-template-columns:1fr 1fr; }.estimate-reconciliation > div,.estimate-reconciliation > label { border-bottom:1px solid var(--line); }.record-detail-grid,.photo-pair,.payment-grid,.report-context { grid-template-columns:1fr; }.report-preview-metrics { grid-template-columns:1fr; }.report-preview-metrics div { border-right:0; border-bottom:1px solid var(--line); }.project-actions-menu { position:fixed; top:76px; left:16px; right:16px; width:auto; max-height:calc(100svh - 92px); }.time-record-head { grid-template-columns:1fr; }.mismatch-alert { align-items:flex-start; flex-direction:column; }.mismatch-alert button { margin-left:0; }.daily-totals { overflow-x:auto; }.verification-row { align-items:flex-start; flex-direction:column; }.timeline-item { grid-template-columns:1fr; gap:7px; }.record-row { grid-template-columns:28px 1fr; }.record-row em { display:none; }.settings-list > div { grid-template-columns:1fr; }.settings-module-nav { overflow-x:auto; }.language-set > div { grid-template-columns:34px 1fr; }.language-set > div > div:last-child { grid-column:2; justify-content:space-between; }.integration-row { grid-template-columns:42px 1fr; }.integration-row .integration-state,.integration-row button { grid-column:2; }.integration-note { grid-template-columns:1fr; }.toast { left:16px; right:16px; min-width:0; }.form-grid { grid-template-columns:1fr; } }