:root {
  color-scheme: light;
  --ink: #162438;
  --muted: #6f7c8f;
  --muted-2: #93a0b1;
  --line: #e5eaf0;
  --surface: #ffffff;
  --canvas: #f5f7fa;
  --blue: #2869c7;
  --blue-dark: #1d55a4;
  --blue-pale: #eaf2fd;
  --green: #13865d;
  --red: #bf4751;
  --shadow: 0 6px 24px rgba(19, 41, 74, .055);
  font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: var(--ink);
  background: var(--canvas);
  font-synthesis: none;
}

* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; min-height: 100vh; background: var(--canvas); }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .48; }
[hidden] { display: none !important; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: Manrope, 'DM Sans', sans-serif; letter-spacing: -.035em; }

.brand { display: inline-flex; align-items: center; gap: 11px; color: #182c49; font-size: 13px; letter-spacing: .095em; font-weight: 800; white-space: nowrap; }
.brand-mark { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 8px; color: #fff; background: linear-gradient(145deg, #4285e7, #235eb6); font: 800 18px Manrope, sans-serif; letter-spacing: -.08em; box-shadow: 0 4px 12px #215ca43d; }
.brand-light { color: #fff; }
.eyebrow { display: block; margin-bottom: 10px; color: #8090a3; font-size: 10px; font-weight: 700; letter-spacing: .15em; }
.muted { color: var(--muted); }
.tiny { font-size: 11px; }

.auth-layout { display: grid; min-height: 100vh; grid-template-columns: minmax(400px, .92fr) 1.08fr; background: #fff; }
.auth-intro { position: relative; display: flex; min-height: 100vh; flex-direction: column; justify-content: space-between; overflow: hidden; padding: 39px 8.5%; color: #fff; background: radial-gradient(ellipse at 80% 25%, #264d77 0, transparent 42%), linear-gradient(150deg, #111f34 2%, #172d49 62%, #193a5a); }
.auth-intro::before { position: absolute; right: -190px; bottom: 12%; width: 460px; height: 460px; border: 1px solid #ffffff12; border-radius: 50%; content: ''; }
.auth-intro::after { position: absolute; right: -78px; bottom: 4%; width: 390px; height: 390px; border: 1px solid #ffffff10; border-radius: 50%; content: ''; }
.auth-message { position: relative; z-index: 1; max-width: 550px; margin: auto 0; padding: 48px 0 75px; }
.auth-message .eyebrow { color: #8fbaf3; }
.auth-message h1 { margin: 0 0 23px; font-size: clamp(42px, 5vw, 65px); line-height: 1.08; letter-spacing: -.055em; }
.auth-message p { max-width: 420px; color: #c0cbd9; font-size: 15px; line-height: 1.75; }
.auth-foot { z-index: 1; color: #97a8bc; font-size: 11px; letter-spacing: .04em; }
.auth-panel { display: grid; place-items: center; padding: 48px; }
.auth-box { width: min(410px, 100%); }
.auth-box h2 { margin: 0 0 28px; font-size: 25px; }
.auth-box .eyebrow { margin-bottom: 9px; color: var(--blue); }
.stack-form { display: grid; gap: 18px; }
label { display: grid; gap: 7px; color: #34435a; font-size: 12px; font-weight: 600; }
label small { color: #8a97a8; font-size: 11px; font-weight: 400; line-height: 1.5; }
input, select, textarea { width: 100%; min-width: 0; border: 1px solid #dbe2ea; border-radius: 7px; outline: none; padding: 11px 12px; color: #20324b; background: #fff; font-size: 13px; font-weight: 400; transition: border-color .15s, box-shadow .15s; }
input:focus, select:focus, textarea:focus { border-color: #74a0dd; box-shadow: 0 0 0 3px #3e80d51a; }
textarea { resize: vertical; }
.auth-switch { margin: 23px 0 0; color: var(--muted); font-size: 12px; text-align: center; }
.text-button { border: 0; padding: 0; color: var(--blue); background: transparent; font-size: inherit; font-weight: 600; }
.text-button:hover { text-decoration: underline; }
.full { width: 100%; justify-content: space-between; margin-top: 4px; padding: 13px 16px !important; }

.button { display: inline-flex; min-height: 38px; align-items: center; justify-content: center; gap: 9px; border: 1px solid transparent; border-radius: 7px; padding: 9px 14px; font-size: 12px; font-weight: 600; transition: background .15s, border .15s, transform .15s; }
.button:hover:not(:disabled) { transform: translateY(-1px); }
.button.primary { color: #fff; background: var(--blue); box-shadow: 0 3px 8px #2869c727; }
.button.primary:hover:not(:disabled) { background: var(--blue-dark); }
.button.secondary { border-color: #dbe3eb; color: #405169; background: #fff; }
.button.secondary:hover:not(:disabled) { border-color: #b9c8da; background: #f9fbfd; }
.white-button { color: #183556; background: #fff; }
.white-button:hover { background: #f4f8fe; }
.compact-button { min-height: 34px; padding: 7px 11px; font-size: 11px; }
.mini-button { min-height: 29px; padding: 6px 9px; font-size: 10px; }
.icon-button { display: inline-grid; width: 32px; height: 32px; flex: 0 0 auto; place-items: center; border: 0; border-radius: 7px; color: #748399; background: transparent; font-size: 17px; }
.icon-button:hover { color: var(--blue); background: #edf3fa; }

.app-shell { min-height: 100vh; }
.sidebar { position: fixed; z-index: 10; inset: 0 auto 0 0; display: flex; width: 238px; flex-direction: column; border-right: 1px solid #e9edf2; padding: 25px 15px 14px; background: #fff; }
.sidebar .brand { margin: 0 8px 39px; font-size: 11px; }
.sidebar-caption { margin: 0 10px 10px; color: #9aa5b4; font-size: 9px; font-weight: 700; letter-spacing: .13em; }
.side-nav { display: grid; gap: 3px; }
.nav-item { display: flex; width: 100%; align-items: center; gap: 11px; border: 0; border-radius: 6px; padding: 10px 11px; color: #667489; background: transparent; font-size: 12px; text-align: left; }
.nav-item:hover { color: #233a58; background: #f5f7fa; }
.nav-item.active { color: #225cad; background: #edf4fd; font-weight: 600; }
.nav-icon { display: inline-grid; width: 17px; place-items: center; color: #8795a8; font-size: 16px; }
.nav-item.active .nav-icon { color: #2869c7; }
.side-nav .sidebar-caption { margin-top: 29px; }
.sidebar-bottom { margin-top: auto; }
.help-card { margin: 0 0 17px; border: 1px solid #e4ebf4; border-radius: 8px; padding: 13px; background: linear-gradient(135deg, #f9fbfe, #f3f7fc); }
.help-icon { display: grid; width: 24px; height: 24px; place-items: center; margin-bottom: 11px; border-radius: 6px; color: var(--blue); background: #e6effb; }
.help-card b { font-size: 11px; }
.help-card p { margin: 5px 0 0; color: #7a8798; font-size: 10px; line-height: 1.5; }
.user-chip { display: flex; align-items: center; gap: 9px; border-top: 1px solid #edf0f4; padding: 14px 3px 0; }
.avatar, .top-avatar { display: grid; width: 32px; height: 32px; flex: 0 0 auto; place-items: center; border-radius: 50%; color: #3369b1; background: #e8f0fb; font-size: 10px; font-weight: 700; }
.avatar.small { width: 28px; height: 28px; }
.user-chip-copy { display: grid; min-width: 0; flex: 1; gap: 3px; }
.user-chip-copy b { overflow: hidden; color: #35445a; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.user-chip-copy small { color: #8a97a8; font-size: 9px; }
.main-area { min-height: 100vh; margin-left: 238px; }
.topbar { position: sticky; z-index: 5; top: 0; display: flex; height: 61px; align-items: center; justify-content: space-between; border-bottom: 1px solid #e7ebf0; padding: 0 32px; background: #fff; }
.breadcrumb { display: flex; align-items: center; gap: 12px; color: #8996a7; font-size: 11px; }
.breadcrumb b { color: #34435a; font-weight: 600; }
.crumb-divider { color: #cad1da; }
.topbar-right { display: flex; align-items: center; gap: 17px; }
.cloud-status { display: flex; align-items: center; gap: 6px; color: #758398; font-size: 10px; }
.cloud-status i { width: 6px; height: 6px; border-radius: 50%; background: #27a675; box-shadow: 0 0 0 3px #27a6751b; }
.top-avatar { width: 29px; height: 29px; }
.mobile-menu { display: none; }
.page-content { max-width: 1500px; margin: 0 auto; padding: 31px 34px 55px; }
.page-content.wide-takeoff { max-width: 2000px; padding-right: 24px; padding-left: 24px; }
.welcome-banner { position: relative; display: flex; min-height: 237px; align-items: center; overflow: hidden; border-radius: 12px; padding: 34px 39px; color: #fff; background: linear-gradient(108deg, #18375c, #22548a 72%, #306ca2); box-shadow: 0 9px 24px #14395721; }
.welcome-banner > div:first-child { position: relative; z-index: 1; }
.welcome-banner .eyebrow { margin-bottom: 13px; color: #a7c8f3; }
.welcome-banner h1 { max-width: 490px; margin: 0 0 9px; font-size: 27px; letter-spacing: -.045em; }
.welcome-banner p { margin: 0 0 20px; color: #c0d0e2; font-size: 12px; }
.banner-art { position: absolute; top: 0; right: 3%; width: 39%; height: 100%; opacity: .82; }
.art-sheet { position: absolute; top: 32px; left: 32%; width: 157px; height: 179px; transform: rotate(9deg); border: 1px solid #d6e6f037; border-radius: 4px; background: #c9e2fa0d; }
.sheet-two { top: 48px; left: 42%; transform: rotate(16deg); }
.art-cross { position: absolute; top: 36px; left: 64%; color: #add1f7; font-size: 32px; font-weight: 200; }
.art-line { position: absolute; left: 46%; height: 1px; background: #b6d2ef48; }
.art-line-one { top: 92px; width: 122px; transform: rotate(27deg); }
.art-line-two { top: 130px; width: 185px; transform: rotate(-22deg); }
.art-line-three { top: 162px; left: 29%; width: 220px; transform: rotate(5deg); }
.metric-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; margin: 19px 0 33px; }
.metric-card { position: relative; display: flex; min-height: 112px; flex-direction: column; justify-content: center; overflow: hidden; border: 1px solid #e7ebf0; border-radius: 9px; padding: 17px 18px; background: #fff; box-shadow: 0 3px 12px #18395e07; }
.metric-label { margin-bottom: 7px; color: #7c899b; font-size: 10px; font-weight: 600; }
.metric-card > b { font-family: Manrope, sans-serif; color: #1d2e46; font-size: 24px; letter-spacing: -.04em; }
.metric-note { margin-top: 5px; color: #9aa5b3; font-size: 9px; }
.metric-icon { position: absolute; top: 17px; right: 17px; display: grid; width: 29px; height: 29px; place-items: center; border-radius: 7px; font-size: 15px; }
.metric-icon.blue { color: #3980d4; background: #eaf3fd; }
.metric-icon.violet { color: #7964be; background: #f0edfa; }
.metric-icon.orange { color: #d28a45; background: #fff3e8; }
.section-heading, .page-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.section-heading h2, .page-heading h1 { margin: 0 0 4px; font-size: 18px; }
.section-heading p, .page-heading p { margin: 0; color: var(--muted); font-size: 11px; }
.project-list { display: grid; gap: 8px; }
.project-card { display: flex; width: 100%; align-items: center; gap: 12px; border: 1px solid #e7ebf0; border-radius: 8px; padding: 13px 14px; background: #fff; color: var(--ink); text-align: left; transition: box-shadow .15s, border-color .15s, transform .15s; }
.project-card:hover { transform: translateY(-1px); border-color: #cbd9ea; box-shadow: var(--shadow); }
.project-icon { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; border-radius: 8px; color: #3678c8; background: #edf4fd; font-size: 18px; }
.project-icon.large { width: 43px; height: 43px; }
.project-card-main { display: grid; min-width: 0; flex: 1; gap: 5px; }
.project-card-main b { overflow: hidden; color: #263750; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.project-card-main small, .project-card-right small { color: #8b98a8; font-size: 10px; }
.project-card-right { display: grid; justify-items: end; gap: 6px; }
.pill { border-radius: 20px; padding: 3px 8px; color: #1b8a63; background: #e9f7f1; font-size: 9px; text-transform: capitalize; }
.project-arrow { margin-left: 6px; color: #a4afbd; }
.privacy-note { margin: 15px 0 0; color: #8794a5; font-size: 10px; }
.privacy-note span { margin-right: 5px; color: #25936d; font-weight: 700; }
.page-heading { margin-bottom: 22px; }
.page-heading .eyebrow { margin-bottom: 6px; }
.panel { border: 1px solid #e7ebf0; border-radius: 9px; padding: 19px; background: #fff; box-shadow: 0 3px 12px #18395e06; }
.panel-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 15px; }
.panel-header h2 { margin: 0 0 4px; font-size: 14px; }
.panel-header p { margin: 0; color: #8794a5; font-size: 10px; }
.panel-count { display: grid; min-width: 24px; height: 24px; place-items: center; border-radius: 14px; padding: 0 7px; color: #5c6c81; background: #f1f4f8; font-size: 10px; }
.compact { gap: 0; }
.compact .project-card { border: 0; border-top: 1px solid #eef1f5; border-radius: 0; padding-right: 3px; padding-left: 3px; box-shadow: none; }
.compact .project-card:hover { background: #fafbfd; transform: none; }
.empty-state { display: flex; min-height: 180px; flex-direction: column; align-items: center; justify-content: center; padding: 24px; text-align: center; }
.empty-icon { display: grid; width: 42px; height: 42px; place-items: center; margin-bottom: 13px; border-radius: 10px; color: #4280ca; background: #edf4fd; font-size: 21px; }
.empty-state h3 { margin: 0 0 6px; font-size: 14px; }
.empty-state p { max-width: 390px; margin: 0 0 14px; color: #8390a2; font-size: 11px; line-height: 1.6; }
.notice { border: 1px solid; border-radius: 7px; padding: 12px 14px; font-size: 11px; line-height: 1.55; }
.notice.info { border-color: #d9e6f7; color: #536d91; background: #f2f7fe; }
.notice.success { border-color: #cde9dd; color: #286b51; background: #f1faf6; }
.notice.warning { border-color: #f2e4bd; color: #795f21; background: #fffaf0; }
.notice.error { border-color: #f0d4d5; color: #9b3d44; background: #fff5f5; }

.project-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 23px; }
.back-link { margin-bottom: 18px; border: 0; padding: 0; color: #6f8094; background: transparent; font-size: 10px; }
.back-link:hover { color: var(--blue); }
.project-title-row { display: flex; align-items: center; gap: 13px; }
.project-title-row .eyebrow { margin-bottom: 4px; }
.project-title-row h1 { margin: 0 0 4px; font-size: 21px; }
.project-title-row p { margin: 0; color: #8491a1; font-size: 10px; }
.project-title-row p span { padding: 0 4px; color: #c3cbd4; }
.project-tabs { display: flex; gap: 23px; overflow-x: auto; border-bottom: 1px solid #e3e8ef; margin-bottom: 19px; }
.project-tab { position: relative; display: flex; flex: 0 0 auto; align-items: center; gap: 7px; border: 0; padding: 0 1px 12px; color: #7c899a; background: transparent; font-size: 13px; }
.project-tab.selected { color: #245ea8; font-weight: 600; }
.project-tab.selected::after { position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; border-radius: 2px; background: #3476c9; content: ''; }
.project-tab > span { border-radius: 8px; padding: 2px 5px; background: #edf1f5; color: #76859a; font-size: 10px; }
.estimate-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 15px; margin-bottom: 14px; }
.estimate-toolbar .eyebrow { margin-bottom: 5px; }
.estimate-select-row, .toolbar-actions { display: flex; align-items: center; gap: 8px; }
.estimate-select-row select { width: auto; min-width: 230px; border: 0; padding: 4px 23px 4px 0; color: #23364f; font-size: 14px; font-weight: 700; }
.status-pill { border-radius: 20px; padding: 4px 9px; color: #617187; background: #f0f3f7; font-size: 9px; text-transform: capitalize; }
.status-draft { color: #677992; background: #eff2f6; }
.status-submitted { color: #96690f; background: #fff5db; }
.status-approved { color: #17845c; background: #e9f7f1; }
.status-rejected { color: #b94d53; background: #fff0f0; }
.estimate-metrics { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin: 0 0 17px; }
.estimate-metrics .metric-card { min-height: 90px; padding: 13px 15px; }
.estimate-metrics .metric-card > b { font-size: 18px; }
.estimate-metrics .metric-note { font-size: 9px; }
.estimate-metrics .total-metric { border-color: #d4e4f8; background: #f4f8fe; }
.estimate-metrics .total-metric > b { color: #205fae; }
.estimate-panel { padding: 17px 0 0; }
.estimate-panel .panel-header { padding: 0 17px; }
.table-scroll { overflow: auto; width: 100%; }
.data-table { width: 100%; border-collapse: collapse; text-align: left; }
.data-table th { border-top: 1px solid #edf0f4; border-bottom: 1px solid #edf0f4; padding: 10px 11px; color: #8a97a7; background: #fbfcfd; font-size: 9px; font-weight: 600; white-space: nowrap; }
.data-table td { border-bottom: 1px solid #eff2f5; padding: 11px; color: #4f5e72; font-size: 10px; white-space: nowrap; }
.data-table tr:last-child td { border-bottom: 0; }
.data-table td b { color: #34435a; font-size: 10px; }
.data-table td small { display: block; margin-top: 4px; color: #939eac; font-size: 9px; }
.estimate-table td:first-child { min-width: 180px; white-space: normal; }
.amount-cell { color: #2c3d54 !important; }
.row-edit { width: 26px; height: 26px; }
.estimate-panel > .empty-state { min-height: 190px; }
.approval-note { display: flex; align-items: center; gap: 8px; border-top: 1px solid #edf0f4; padding: 12px 17px; color: #7d8b9b; font-size: 10px; }
.approval-note span { color: #25875f; }
.version-delta { margin: 0 0 17px; padding: 16px 0 0; }
.version-delta .panel-header { padding: 0 17px; }
.version-delta-summary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; padding: 0 17px 15px; }
.version-delta-summary > div { display: grid; gap: 5px; }
.version-delta-summary small { color: #8a97a7; font-size: 9px; }
.version-delta-summary b { color: #34435a; font-size: 13px; }
.delta-up { color: #b94d53 !important; }
.delta-down { color: #17845c !important; }
.change-tag { border-radius: 10px; padding: 3px 7px; background: #f0f3f7; color: #617187; font-size: 9px; }
.change-added { background: #e9f7f1; color: #17845c; }
.change-removed { background: #fff0f0; color: #b94d53; }
.change-changed { background: #fff5db; color: #96690f; }
.version-delta-empty { margin: 0; border-top: 1px solid #edf0f4; padding: 13px 17px; color: #7d8b9b; font-size: 10px; }
.snapshot-warning { margin: 0; border-top: 1px solid #f0e2bd; padding: 12px 17px; color: #856a2a; background: #fffaf0; font-size: 10px; }
.table-footnote { margin: 0; border-top: 1px solid #eff2f5; padding: 11px 14px; color: #8c98a8; font-size: 9px; }
.bid-page-heading { display: flex; align-items: end; justify-content: space-between; gap: 14px; margin: 2px 0 18px; }
.bid-page-heading h2 { margin: 0 0 7px; color: #263850; font-size: 22px; }
.bid-page-heading p { max-width: 720px; margin: 0; color: #7e8b9c; font-size: 11px; line-height: 1.6; }
.bid-package-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(235px,1fr)); gap: 12px; }
.bid-package-card { display: grid; gap: 9px; border: 1px solid #e3e9ef; border-radius: 9px; padding: 15px; color: #35455c; background: #fff; text-align: left; box-shadow: var(--shadow); }
.bid-package-card:hover { border-color: #bed0e5; transform: translateY(-1px); }
.bid-package-card > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.bid-package-card > div > b { font-size: 12px; }
.bid-package-card p { margin: 0; color: #5d6c80; font-size: 10px; }
.bid-package-card > small { color: #8491a1; font-size: 9px; }
.bid-page-heading .eyebrow { margin: 12px 0 6px; }
.bid-page-heading .back-link { margin-bottom: 9px; }
.bid-actions { display: flex; flex-wrap: wrap; gap: 7px; }
.bid-summary-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin: 0 0 14px; }
.bid-summary-grid .metric-card { min-height: 82px; padding: 12px 14px; }
.bid-summary-grid .metric-card > b { font-size: 17px; }
.bid-panel { margin: 0 0 13px; padding: 0; }
.bid-panel > .panel-header { padding: 16px 17px 10px; }
.bid-panel > .panel-header h3 { margin: 0 0 5px; color: #34435a; font-size: 14px; }
.bid-panel > .panel-header p { margin: 0; color: #8793a2; font-size: 10px; line-height: 1.55; }
.bid-panel > .panel-header .button { margin-left: auto; }
.bid-document-list { display: grid; gap: 7px; border-top: 1px solid #edf0f4; padding: 12px 17px; color: #58677c; font-size: 10px; }
.bid-document-list > b { color: #46566d; }
.bid-document-list small { color: #8491a2; }
.bid-submission-list { padding: 0 14px 14px; }
.bid-submission { border-top: 1px solid #edf0f4; padding: 13px 3px; }
.bid-submission.superseded { opacity: .76; }
.bid-submission-heading { display: flex; align-items: start; justify-content: space-between; gap: 10px; }
.bid-submission-heading b { display: block; color: #34435a; font-size: 11px; }
.bid-submission-heading small { display: block; margin-top: 4px; color: #8996a7; font-size: 9px; }
.bid-submission-heading > div:last-child { display: flex; align-items: center; gap: 8px; }
.bid-stale-label { border-radius: 4px; padding: 4px 6px; color: #8c5b14; background: #fff4dc; font-size: 8px; font-weight: 600; text-transform: uppercase; }
.bid-submission-heading strong { color: #2b3d55; font-size: 13px; }
.bid-submission details { margin-top: 10px; color: #65748a; font-size: 10px; }
.bid-submission summary { cursor: pointer; }
.bid-submission details > p { margin: 9px 0; color: #58677c; font-size: 10px; line-height: 1.5; white-space: pre-wrap; }
.bid-file-link { display: inline-flex; flex-direction: column; gap: 3px; margin: 8px 10px 0 0; color: #2869c7; font-size: 10px; }
.bid-file-link small { color: #a4474b; font-size: 8px; }
.bid-question, .bid-history { display: grid; gap: 9px; border-top: 1px solid #edf0f4; padding: 13px 17px; }
.bid-question b, .bid-history b { color: #42536b; font-size: 10px; }
.bid-question p, .bid-history p { margin: 6px 0 0; color: #596980; font-size: 10px; line-height: 1.6; white-space: pre-wrap; }
.bid-question small, .bid-history small { color: #8a97a7; font-size: 9px; }
.bid-answer { border-left: 2px solid #8ab0e3; padding: 5px 0 5px 11px; }
.bid-choice-set { display: grid; gap: 8px; border: 1px solid #e1e7ee; border-radius: 7px; padding: 12px; }
.bid-choice-set legend { padding: 0 5px; color: #405169; font-size: 11px; font-weight: 600; }
.check-row { display: flex; align-items: center; gap: 8px; color: #5d6c80; font-size: 10px; font-weight: 400; }
.check-row input { width: 15px; height: 15px; flex: 0 0 auto; }
.modal-content #bid-invite-url { font-size: 10px; }
.notice.success { margin: 0 14px 14px; border: 1px solid #cdeadd; border-radius: 7px; padding: 13px; color: #197653; background: #f0faf5; font-size: 10px; }
.notice.success p { margin: 5px 0; white-space: pre-wrap; }
.drawing-actions { white-space: nowrap; }
.drawing-actions .button + .button { margin-left: 5px; }
.danger-button { color: #a63f49 !important; }
.inline-upload { display: flex; align-items: end; gap: 15px; }
.inline-upload label { flex: 1; }
.upload-progress { display: grid; min-width: 180px; gap: 6px; color: #5d6c80; font-size: 11px; }
.upload-progress progress { width: 100%; height: 10px; accent-color: var(--blue); }
.upload-progress[hidden] { display: none; }
.stack-form .upload-progress { grid-column: 1 / -1; }
.approval-request-list { display: grid; }
.approval-request { display: flex; align-items: center; justify-content: space-between; gap: 18px; border-top: 1px solid #edf0f4; padding: 14px 2px; }
.approval-request > div:first-child { display: grid; gap: 7px; }
.approval-request p { margin: 0; color: #778598; font-size: 11px; }
.approval-request small { color: #8a97a8; font-size: 10px; }
.approval-actions { display: flex; flex-wrap: wrap; gap: 7px; }
.company-document-upload { margin-bottom: 14px; }
.file-name, .person-cell { display: flex; align-items: center; gap: 9px; }
.file-icon { display: grid; width: 33px; height: 35px; place-items: center; border-radius: 6px; font-size: 8px; font-weight: 700; }
.file-icon.pdf { color: #bd4e53; background: #fff0ef; }
.file-icon.dwg { color: #3972b7; background: #edf4fd; }
.revision-tag { border: 1px solid #e6ebf1; border-radius: 4px; padding: 4px 6px; color: #66778f; background: #fafbfd; font-size: 9px; }
.danger-text { color: #bc4d56; }
.inline-add { display: flex; align-items: center; gap: 12px; border-top: 1px solid #edf0f4; margin-top: 8px; padding-top: 14px; }
.inline-add > span { color: #939eac; font-size: 10px; }
.active-dot, .inactive-dot { display: inline-flex; align-items: center; gap: 6px; font-size: 10px; }
.active-dot::before, .inactive-dot::before { width: 6px; height: 6px; border-radius: 50%; background: #22966e; content: ''; }
.inactive-dot { color: #929eae; }
.inactive-dot::before { background: #abb4bf; }
.role-select { width: 165px; border: 0; padding: 5px 20px 5px 0; background: transparent; font-size: 10px; }
.notice + .panel { margin-top: 17px; }

.takeoff-layout { display: grid; grid-template-columns: minmax(0,1fr) 320px; align-items: start; gap: 14px; }
.takeoff-board-card { min-width: 0; padding: 0; overflow: hidden; }
.takeoff-header { align-items: center; padding: 17px 17px 0; }
.takeoff-header h2 { margin: 0 0 4px; font-size: 14px; }
.takeoff-header .eyebrow { margin-bottom: 4px; color: var(--blue); }
.scale-input { width: 142px; flex: 0 0 auto; }
.scale-input label { gap: 5px; color: #7e8b9b; font-size: 9px; }
.scale-input input { padding: 7px 8px; font-size: 10px; }
.pdf-scale-control { display: grid; justify-items: end; gap: 5px; flex: 0 0 auto; }
.pdf-scale-control span { color: #7e8b9b; font-size: 9px; }
.takeoff-controls { display: flex; align-items: center; gap: 7px; border-top: 1px solid #edf0f4; border-bottom: 1px solid #edf0f4; margin-top: 16px; padding: 9px 13px; }
.tool-group { display: flex; gap: 4px; margin-right: auto; }
.tool-button { border: 1px solid transparent; border-radius: 5px; padding: 7px 9px; color: #69788d; background: transparent; font-size: 10px; }
.tool-button.active { border-color: #d5e3f6; color: #2864b4; background: #eef5fe; font-weight: 600; }
.plan-canvas-wrap { position: relative; margin: 11px; overflow: hidden; border: 1px solid #e6ebf1; border-radius: 5px; background: #f8fafc; }
.plan-canvas { display: block; width: 100%; height: auto; aspect-ratio: 1000 / 560; touch-action: none; cursor: crosshair; }
.pdf-stage { height: min(82vh, 1000px); min-height: 420px; margin: 11px; overflow: auto; border: 1px solid #e6ebf1; border-radius: 5px; background: #e8edf3; }
.pdf-loading, .pdf-message { display: grid; min-height: 160px; place-items: center; padding: 24px; color: #6c7a8e; font-size: 12px; text-align: center; }
.pdf-page-wrap { position: relative; width: max-content; margin: 0 auto; box-shadow: 0 2px 14px #17253a22; }
.pdf-page-canvas { display: block; max-width: none; background: #fff; }
.pdf-markup-overlay { position: absolute; inset: 0; width: 100%; height: 100%; cursor: crosshair; touch-action: none; }
.drawing-workspace { display: flex; min-width: 0; }
.drawing-workspace-main { position: relative; flex: 1 1 auto; min-width: 0; }
.markup-toolbar { display: flex; width: 62px; flex: 0 0 62px; flex-direction: column; align-items: center; gap: 3px; border-right: 1px solid #e7ebf1; padding: 10px 5px; background: #fbfcfe; }
.markup-tool-button, .tool-chest-trigger { display: grid; width: 50px; min-height: 48px; place-items: center; gap: 2px; border: 1px solid transparent; border-radius: 6px; color: #56657a; background: transparent; cursor: pointer; }
.markup-tool-button > span { font-size: 19px; line-height: 1; }
.markup-tool-button small, .tool-chest-trigger small { font-size: 8px; line-height: 1; }
.markup-tool-button:hover, .tool-chest-trigger:hover { border-color: #d5e3f6; background: #f2f6fc; }
.markup-tool-button.active { border-color: #b9d1f3; color: #205eb3; background: #eaf2fd; }
.markup-delete { margin-top: auto; color: #b2443c; }
.markup-tool-button:disabled { opacity: .38; cursor: not-allowed; }
.tool-chest-trigger { margin-bottom: 7px; border-color: #e5e9ef; background: white; }
.tool-chest-drawer { position: absolute; z-index: 8; top: 115px; left: 10px; width: min(300px, calc(100% - 20px)); border: 1px solid #dce3ed; border-radius: 9px; padding: 14px; background: white; box-shadow: 0 12px 35px #1e2f491f; }
.tool-chest-heading { display: flex; align-items: center; justify-content: space-between; }
.tool-chest-heading h3 { margin: 3px 0 0; color: #26374d; font-size: 13px; }
.tool-chest-drawer > p { margin: 9px 0; color: #788699; font-size: 10px; }
.tool-chest-presets { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.tool-chest-presets button { display: flex; align-items: center; gap: 7px; min-height: 38px; border: 1px solid #e7ebf1; border-radius: 6px; padding: 6px; color: #4c5b70; background: #fff; text-align: left; cursor: pointer; }
.tool-chest-presets button:hover { border-color: #b9d1f3; background: #f5f8fd; }
.tool-chest-presets button span { color: #2768c5; font-size: 16px; }
.tool-chest-presets button b { font-size: 9px; font-weight: 600; }
.drawing-markup { cursor: pointer; }
.drawing-markup.selected { filter: drop-shadow(0 1px 2px #155cbd66); }
.image-resize-handle { cursor: nwse-resize; pointer-events: all; }
.pdf-page-navigation { display: flex; justify-content: flex-end; padding: 0 12px 10px; }
.pdf-thumbnail-drawer { position: absolute; z-index: 7; right: 14px; bottom: 54px; width: min(760px, calc(100% - 28px)); border: 1px solid #d9e1eb; border-radius: 8px; padding: 9px; background: #fff; box-shadow: 0 8px 30px #17253a2b; }
.pdf-thumbnail-list { display: flex; max-height: 175px; gap: 9px; overflow: auto; }
.pdf-thumbnail { display: flex; min-width: 94px; flex-direction: column; align-items: center; gap: 5px; border: 1px solid #e4e9f0; border-radius: 5px; padding: 5px; color: #627187; background: #f8fafc; cursor: pointer; }
.pdf-thumbnail.active { border-color: #3275c8; box-shadow: 0 0 0 1px #3275c8; }
.pdf-thumbnail canvas { max-width: 100%; object-fit: contain; background: #fff; }
.pdf-thumbnail span { font-size: 9px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
.pdf-toolbar { display: flex; align-items: center; gap: 8px; border-bottom: 1px solid #edf0f4; padding: 8px 13px; color: #69788d; font-size: 10px; }
.pdf-toolbar[hidden] { display: none; }
.pdf-toolbar-spacer { flex: 1; }
.pdf-toolbar button { min-width: 32px; }
.pdf-toolbar .mini-button { padding: 6px 8px; }
.pdf-load-status { padding: 6px 14px 0; color: #6c7a8e; font-size: 9px; }
.board-room { opacity: .8; }
.canvas-watermark { fill: #9aa6b5; font-size: 12px; }
.canvas-help { position: absolute; top: 9px; right: 10px; border: 1px solid #e6ebf1; border-radius: 4px; padding: 5px 7px; color: #8592a2; background: #ffffffdf; font-size: 9px; pointer-events: none; }
.drawing-reference-row { display: flex; align-items: end; justify-content: space-between; gap: 12px; border-top: 1px solid #edf0f4; padding: 12px 14px; }
.drawing-reference-row label { width: min(330px, 67%); color: #788699; font-size: 9px; }
.drawing-reference-row select { padding: 7px 9px; font-size: 10px; }
.takeoff-side { min-width: 0; padding: 16px 13px; }
.takeoff-side .panel-header { margin-bottom: 7px; }
.takeoff-list { display: grid; }
.takeoff-item { position: relative; display: grid; grid-template-columns: 8px minmax(0,1fr) auto; align-items: start; gap: 8px; border-top: 1px solid #eff2f5; padding: 12px 0; }
.takeoff-dot { width: 7px; height: 7px; margin-top: 4px; border-radius: 2px; background: #3174c6; }
.takeoff-dot.area { background: #8867c6; }
.takeoff-dot.length { background: #269470; }
.takeoff-item-main { display: grid; gap: 4px; min-width: 0; }
.takeoff-item-main b { overflow: hidden; color: #394a60; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.takeoff-item-main small { overflow: hidden; color: #909baa; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.takeoff-item > strong { color: #2d4058; font-size: 10px; white-space: nowrap; }
.takeoff-item > strong small { color: #8391a2; font-size: 8px; }
.takeoff-item .tiny-link { grid-column: 2 / 4; justify-self: start; font-size: 9px; }
.empty-mini { padding: 25px 7px; color: #929eac; font-size: 10px; text-align: center; }
.takeoff-layout + .notice { margin-top: 14px; }

.activity-list { display: grid; }
.activity-row { display: flex; align-items: center; gap: 10px; border-top: 1px solid #eff2f5; padding: 12px 0; }
.activity-dot { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: #4984cb; }
.activity-row > div { display: grid; flex: 1; gap: 4px; }
.activity-row b { color: #43536a; font-size: 10px; font-weight: 600; text-transform: capitalize; }
.activity-row small { color: #8996a5; font-size: 9px; }
.activity-entity { color: #8794a5; font-size: 9px; }

.modal-backdrop { position: fixed; z-index: 50; inset: 0; display: grid; place-items: center; overflow-y: auto; padding: 20px; background: #17253879; backdrop-filter: blur(2px); }
.modal { width: min(560px, 100%); max-height: min(88vh, 900px); overflow: auto; border: 1px solid #e6eaf0; border-radius: 11px; background: #fff; box-shadow: 0 20px 80px #0b1c3033; }
.modal > header { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #edf0f4; padding: 15px 18px; }
.modal > header h2 { margin: 0; font-size: 16px; }
.modal-content { padding: 18px; }
.modal > footer { display: flex; justify-content: end; gap: 8px; border-top: 1px solid #edf0f4; padding: 13px 18px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; }
.form-grid.three { grid-template-columns: 1fr .65fr 1.5fr; }
.form-grid .span-2 { grid-column: 1 / -1; }
.form-hint { margin: 0; color: #8995a5; font-size: 10px; line-height: 1.6; }
.cost-input-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.cost-input-grid input { padding: 9px; }
.cost-input-grid label { font-size: 10px; }
.temporary-password { overflow-wrap: anywhere; border: 1px solid #dce4ef; border-radius: 7px; margin: 14px 0; padding: 13px; color: #193b63; background: #f5f8fc; font-family: ui-monospace, SFMono-Regular, monospace; font-size: 13px; }
.narrow-panel { max-width: 520px; }
.setup-page { display: grid; min-height: 100vh; place-items: start center; padding: 38px 18px; background: #f3f6fa; }
.setup-card { width: min(720px, 100%); border: 1px solid #e3e8ef; border-radius: 11px; padding: 28px; background: white; box-shadow: var(--shadow); }
.setup-card > .brand { margin-bottom: 31px; }
.setup-card h1 { margin: 0 0 8px; font-size: 25px; }
.setup-card > p { color: var(--muted); font-size: 12px; line-height: 1.6; }
.setup-card h2 { margin: 23px 0 12px; border-bottom: 1px solid #edf0f4; padding-bottom: 8px; font-size: 14px; }
.setup-card form > .button { margin-top: 22px; }
.setup-card .notice { margin-bottom: 16px; }
.setup-card .notice h1 { margin-bottom: 9px; }
.setup-card .notice p { margin-bottom: 17px; }
.setup-card code { border-radius: 3px; padding: 2px 4px; background: #eef2f7; font-size: 10px; }

.loading-block { display: flex; min-height: 260px; align-items: center; justify-content: center; gap: 10px; color: #8794a4; font-size: 11px; }
.spinner { width: 17px; height: 17px; border: 2px solid #dce5f0; border-top-color: #3877c3; border-radius: 50%; animation: spin .7s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.toast-region { position: fixed; z-index: 100; top: 15px; right: 16px; display: grid; width: min(360px, calc(100% - 32px)); gap: 8px; }
.toast { border: 1px solid #cde9dd; border-radius: 7px; padding: 12px 14px; color: #246b50; background: #f2faf6; box-shadow: 0 8px 24px #152c471c; font-size: 11px; animation: toast-in .18s ease-out; }
.toast.error { border-color: #efcfd0; color: #963e45; background: #fff5f5; }
@keyframes toast-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 1100px) {
  .sidebar { width: 211px; }
  .main-area { margin-left: 211px; }
  .page-content { padding-right: 23px; padding-left: 23px; }
  .topbar { padding: 0 23px; }
  .toolbar-actions { gap: 5px; }
  .estimate-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .takeoff-layout { grid-template-columns: minmax(0,1fr) 270px; }
}
@media (max-width: 800px) {
  .auth-layout { grid-template-columns: minmax(0, .8fr) 1.2fr; }
  .auth-intro { padding: 31px 8%; }
  .auth-panel { padding: 32px; }
  .auth-message h1 { font-size: 47px; }
  .sidebar { transform: translateX(-100%); transition: transform .18s; box-shadow: 4px 0 20px #0c1c3020; }
  .sidebar.open { transform: translateX(0); }
  .main-area { margin-left: 0; }
  .mobile-menu { display: inline-grid; margin-left: -9px; }
  .topbar { justify-content: start; gap: 10px; }
  .topbar-right { margin-left: auto; }
  .breadcrumb { gap: 8px; }
  .takeoff-layout { grid-template-columns: 1fr; }
  .markup-toolbar { width: 51px; flex-basis: 51px; padding-right: 2px; padding-left: 2px; }
  .markup-tool-button, .tool-chest-trigger { width: 45px; }
  .markup-tool-button small, .tool-chest-trigger small { font-size: 7px; }
  .takeoff-side { max-height: 310px; overflow: auto; }
  .project-heading { align-items: start; flex-direction: column; }
  .estimate-toolbar { align-items: start; flex-direction: column; }
}
@media (max-width: 600px) {
  .auth-layout { display: flex; min-height: 100vh; flex-direction: column; }
  .auth-intro { min-height: 220px; padding: 23px 24px; }
  .auth-intro .brand { font-size: 11px; }
  .auth-message { margin: 30px 0 0; padding: 0 0 10px; }
  .auth-message .eyebrow { margin-bottom: 7px; font-size: 8px; }
  .auth-message h1 { margin-bottom: 7px; font-size: 31px; }
  .auth-message p { max-width: 460px; margin: 0; font-size: 11px; line-height: 1.55; }
  .auth-foot { display: none; }
  .auth-panel { flex: 1; align-items: start; padding: 33px 23px 42px; }
  .auth-box h2 { margin-bottom: 20px; font-size: 21px; }
  .stack-form { gap: 15px; }
  .topbar { height: 54px; padding: 0 14px; }
  .cloud-status { display: none; }
  .page-content { padding: 20px 14px 38px; }
  .page-content.wide-takeoff { padding-right: 14px; padding-left: 14px; }
  .welcome-banner { min-height: 213px; padding: 25px 21px; }
  .welcome-banner h1 { max-width: 290px; font-size: 23px; }
  .welcome-banner p { max-width: 290px; font-size: 10px; line-height: 1.55; }
  .banner-art { right: -15%; width: 46%; opacity: .5; }
  .metric-grid { gap: 7px; margin: 12px 0 25px; }
  .metric-card { min-height: 91px; padding: 11px 10px; }
  .metric-card > b { font-size: 19px; }
  .metric-label { max-width: 85px; font-size: 9px; }
  .metric-note { font-size: 8px; }
  .metric-icon { top: 9px; right: 8px; width: 23px; height: 23px; font-size: 12px; }
  .section-heading, .page-heading { align-items: start; }
  .section-heading h2, .page-heading h1 { font-size: 17px; }
  .section-heading .button { min-height: 32px; padding: 7px 8px; font-size: 9px; }
  .project-card { gap: 8px; padding: 11px 9px; }
  .project-card-right small { display: none; }
  .project-card-main small { overflow: hidden; max-width: 200px; text-overflow: ellipsis; white-space: nowrap; }
  .project-card-right { align-self: center; }
  .panel { padding: 14px; }
  .panel-header { align-items: start; }
  .page-heading { flex-direction: column; }
  .page-heading .button { align-self: start; }
  .project-title-row h1 { font-size: 18px; }
  .project-heading > .button { align-self: start; }
  .project-tabs { gap: 19px; margin-right: -14px; }
  .project-tab { font-size: 12px; }
  .pdf-stage { height: 68vh; min-height: 300px; }
  .estimate-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .estimate-select-row { flex-wrap: wrap; }
  .estimate-select-row select { min-width: 190px; font-size: 12px; }
  .toolbar-actions { width: 100%; flex-wrap: wrap; }
  .toolbar-actions .button { flex: 1; }
  .estimate-panel .panel-header { align-items: center; padding: 0 13px; }
  .estimate-panel { margin-right: -5px; margin-left: -5px; }
  .takeoff-header { align-items: start; flex-direction: column; }
  .scale-input { width: 100%; }
  .scale-input input { max-width: 180px; }
  .pdf-scale-control { justify-items: start; }
  .takeoff-controls { flex-wrap: wrap; padding: 8px; }
  .tool-group { width: 100%; }
  .takeoff-controls .button { flex: 1; }
  .canvas-help { max-width: 125px; font-size: 8px; }
  .drawing-reference-row { align-items: start; flex-direction: column; }
  .drawing-reference-row label { width: 100%; }
  .form-grid, .form-grid.three { grid-template-columns: 1fr; }
  .form-grid .span-2 { grid-column: auto; }
  .cost-input-grid { grid-template-columns: 1fr 1fr; }
  .modal-backdrop { align-items: end; padding: 0; }
  .modal { width: 100%; max-height: 92vh; border-radius: 12px 12px 0 0; }
  .setup-card { padding: 21px 17px; }
  .setup-page { padding: 15px 10px; }
  .inline-add { align-items: start; flex-direction: column; }
  .inline-upload { align-items: stretch; flex-direction: column; }
  .approval-request { align-items: start; flex-direction: column; }
  .notice { font-size: 10px; }
  .bid-page-heading { align-items: start; flex-direction: column; }
  .bid-page-heading > .bid-actions { width: 100%; }
  .bid-page-heading > .bid-actions .button { flex: 1; }
  .bid-summary-grid { grid-template-columns: 1fr; }
  .bid-panel > .panel-header { align-items: start; flex-direction: column; }
  .bid-panel > .panel-header .button { margin-left: 0; }
  .bid-submission-heading { flex-direction: column; }
  .bid-submission-heading > div:last-child { align-self: start; }
}