/* Low-glare slate foundation with distinct, restrained section accents. */
:root{--ink:#293548;--muted:#6d788a;--border:#e3e7ee;--paper:#f4f5f7;--nav:#eef1f5;--accent:#5b6b98;--accent-hover:#46577d;--accent-soft:#edf0f8;--accent-border:#cbd3e6;--green:#4c7a66;--purple:var(--accent);--blue:#527ca3;--amber:#9a7949}
body[data-section="quotations"],body[data-section="quotation"]{--accent:#8e7146;--accent-hover:#745b37;--accent-soft:#f8f1e7;--accent-border:#e5d8c1}
body[data-section="in_progress"]{--accent:#4b7399;--accent-hover:#365e82;--accent-soft:#eaf1f8;--accent-border:#c9d9e9}
body[data-section="completed"]{--accent:#4d7b68;--accent-hover:#37634f;--accent-soft:#ebf3ee;--accent-border:#cbdfd2}
body[data-section="expenses"]{--accent:#926c5d;--accent-hover:#775347;--accent-soft:#f7eeea;--accent-border:#e5d3ca}
body[data-section="petty_cash"]{--accent:#487b80;--accent-hover:#356166;--accent-soft:#eaf3f3;--accent-border:#c9dfe0}
body[data-section="stocks"]{--accent:#567d92;--accent-hover:#3f6378;--accent-soft:#ebf2f6;--accent-border:#cbdde7}
body[data-section="purchasing"]{--accent:#81794e;--accent-hover:#66603a;--accent-soft:#f4f2e8;--accent-border:#e2ddc7}
body[data-section="accounts"]{--accent:#77658e;--accent-hover:#5f4f75;--accent-soft:#f1edf6;--accent-border:#d9cfe5}
body[data-section="clients"]{--accent:#6d7d60;--accent-hover:#526247;--accent-soft:#eff3e9;--accent-border:#d5dfc9}
body[data-section="vendors"]{--accent:#957653;--accent-hover:#785a39;--accent-soft:#f7f0e6;--accent-border:#e4d7c4}
body[data-section="team"]{--accent:#64758b;--accent-hover:#4c5e74;--accent-soft:#edf1f7;--accent-border:#d1dbe7}
body { background: var(--paper); color: var(--ink); }
.sidebar { background: var(--nav); border-color: #e4e8ee; }
.topbar { background: #fafbfc; }
.logo-mark { background: var(--accent); }
.logo-mark span { color: var(--accent-border); }
.workspace { background: #fff; border-color: #e4e8ee; }
.workspace-icon { background: var(--accent-soft); color: var(--accent); }
.workspace-dot { background: var(--accent); border-color: var(--accent-soft); }
.nav-label, .eyebrow { color: #566274; }
.nav-item, .project-nav-heading { color: #566274; }
.nav-item:hover { background: var(--accent-soft); }
.nav-item.active, .project-nav-heading.active { background: var(--accent-soft); color: var(--accent); }
.nav-item b { background: var(--accent-border); color: var(--accent); }
.projects-toggle:hover { background: var(--accent-soft); }
.projects-subnav { border-color: var(--accent-soft); }
.profile small, .profile > span:last-child, .workspace small { color: #566274; }
.trading-soon { color: #566274; }
.trading-soon small { color: #566274; background: #e4e8ee; border-color: #e4e8ee; }
.avatar, .avatar-stack .avatar { background: var(--accent-soft); color: var(--accent); }
.avatar-stack .avatar:nth-child(2) { background: var(--accent-border); color: var(--accent); }
.avatar-stack .avatar:nth-child(3) { background: var(--accent-soft); color: var(--accent); }
.breadcrumbs, .topbar-right { color: #566274; }
.breadcrumbs strong { color: var(--accent); }
.crumb-slash, .dot-separator { color: #7d8796; }
.page-heading p, .panel-header p, .section-heading p { color: #566274; }
.button { background: #fff; color: var(--accent); border-color: var(--accent-border); }
.button:hover { background: var(--accent-soft); border-color: var(--accent); }
.button.primary { background: var(--accent); border-color: var(--accent); color: #fff; box-shadow: 0 2px 4px #113d2210; }
.button.primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); }
.button.subtle { background: transparent; color: var(--accent); }
.button.subtle:hover { background: var(--accent-soft); }
.stat-card { background: #fff; border-color: #e4e8ee; box-shadow: none; }
.stat-card > div { color: var(--accent); }
.stat-card strong small, .stat-card p { color: #566274; }
.stat-icon.lilac, .stat-icon.amber, .stat-icon.blue, .stat-icon.green { color: var(--accent); background: var(--accent-soft); }
.stats > .stat-card:first-child { background: var(--accent-soft); border-color: var(--accent); color: #fff; }
.stats > .stat-card:first-child > div,
.stats > .stat-card:first-child > strong,
.stats > .stat-card:first-child > strong small,
.stats > .stat-card:first-child p { color: #fff; }
.stats > .stat-card:first-child .stat-icon { background: #ffffff26; color: #fff; }
.mini-dot.amber-bg { background: var(--accent-border); }
.mini-dot.blue-bg { background: var(--accent); }
.mini-dot.green-bg { background: var(--accent); }
.workflow-banner, .info-card { background: var(--accent-soft); border-color: var(--accent-soft); }
.workflow-banner h2, .info-card strong { color: var(--accent); }
.workflow-banner .eyebrow, .workflow-banner p, .info-card li, .info-card p { color: var(--accent); }
.workflow-steps > span { color: var(--accent); }
.workflow-steps b { border-color: var(--accent-border); color: var(--accent); }
.workflow-steps i { color: var(--accent); }
.panel { background: #fff; border-color: var(--accent-soft); }
.count { color: var(--accent); background: var(--accent-soft); }
.search-label { background: #fff; }
.search-label > span { color: #566274; }
.filter-tabs a, .detail-tabs a { color: #566274; }
.filter-tabs a.selected, .detail-tabs .selected { color: var(--accent); border-color: var(--accent); }
.filter-tabs span { color: #566274; background: var(--accent-soft); }
.filter-tabs a.selected span { color: var(--accent); background: var(--accent-soft); }
th { color: #566274; background: var(--accent-soft); }
td { color: #566274; border-color: var(--accent-soft); }
tbody tr:hover { background: var(--accent-soft); }
.project-cell strong { color: var(--accent); }
.project-cell small, .under-badge, .table-footer { color: #566274; }
.table-footer span { color: #566274; }
.tone-0 { background: var(--accent-soft); color: var(--accent); }
.tone-1 { background: var(--accent-soft); color: var(--accent); }
.tone-2 { background: var(--accent-soft); color: var(--accent); }
.tone-3 { background: var(--accent-border); color: var(--accent); }
.badge.quotation, .badge.sent { color: var(--accent); background: var(--accent-soft); border-color: var(--accent-soft); }
.badge.in_progress { color: var(--accent); background: var(--accent-soft); border-color: var(--accent-soft); }
.badge.completed, .badge.approved { color: var(--accent); background: var(--accent-soft); border-color: var(--accent-border); }
.badge.draft { color: #566274; background: #fafbfc; border-color: var(--accent-soft); }
.amount { color: var(--accent); }
.row-arrow { color: var(--accent); border-color: var(--accent-soft); }
.empty-icon { color: var(--accent); background: var(--accent-soft); }
.quick-links a { color: var(--accent); }
.quick-links a > svg { color: var(--accent); }
.quick-links small { color: #566274; }
.note-card { background: var(--accent-soft); border-color: var(--accent-soft); }
.note-card .eyebrow, .note-card p { color: var(--accent); }
.note-card h3 { color: var(--accent); }
.note-spark { color: var(--accent-border); }
.alert.success { background: var(--accent-soft); color: var(--accent); border-color: var(--accent-border); }
.back-link, summary { color: var(--accent); }
summary:hover { color: var(--accent); }
.form-panel h2 { color: var(--accent); }
label { color: var(--accent); }
input, select, textarea { color: var(--accent); border-color: var(--accent-soft); background: #fff; }
input::placeholder, textarea::placeholder { color: #566274; }
input:focus, select:focus, textarea:focus { outline-color: var(--accent-border); border-color: var(--accent); }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 2px solid var(--accent); }
.check-option input { accent-color: var(--accent); }
.optional, .check-option small { color: #566274; }
.project-progress > span { color: #566274; }
.project-progress > span.current { color: var(--accent); }
.project-progress .current b { color: var(--accent); background: var(--accent-soft); border-color: var(--accent-border); }
.project-progress .done { color: var(--accent); }
.project-progress .done b { color: var(--accent); background: var(--accent-soft); border-color: var(--accent-border); }
.financial small, .person-row small { color: #566274; }
.positive { color: var(--accent); }
.details dt { color: #566274; }
.details dd { color: var(--accent); }
.section-heading > strong, .quote-status > strong { color: var(--accent); }
.quote-status small, .quote-reference { color: #566274; }
.icon-button { color: var(--accent); background: var(--accent-soft); }
.totals { color: var(--accent); }
.totals strong, .totals .grand-total { color: var(--accent); }
.inline-action p, .document-card small { color: #566274; }
.document-card > svg, .document-card > span { color: var(--accent); }
.activity-dot { background: var(--accent); }
.activity-row p, .activity-row small { color: #566274; }
.auth-page { background: var(--accent-soft); }
.auth-card { border-color: var(--accent-soft); box-shadow: 0 12px 60px #204c2c09; }
.auth-card .fine { color: #566274; }
.menu-toggle { color: var(--accent); }
.media-card img, .media-card video { background: var(--accent-soft); }
.media-info p { color: #566274; }
.scanner-summary { background: var(--accent-soft); border-color: var(--accent-border); }
.scanner-summary strong { color: var(--accent); }
.barcode-tags code { background: var(--accent-soft); }
.credential-details { background: var(--accent-soft); border-color: var(--accent-soft); }
.footer { color: #566274; }

.stats > .stat-card:first-child p { color: var(--accent); }
.stats > .stat-card:first-child small { color: #fff; }

/* Keep semantic status colours consistent across all section palettes. */
.sidebar{background:var(--nav)}.topbar{background:#f8f9fb}.panel,.stat-card{background:#fefefe}.page-heading h1{color:var(--ink)}
.stats>.stat-card:first-child{background:var(--accent-soft);border-color:var(--accent-border);color:var(--ink)}
.stats>.stat-card:first-child>div,.stats>.stat-card:first-child>strong,.stats>.stat-card:first-child>strong small,.stats>.stat-card:first-child small{color:var(--ink)}
.stats>.stat-card:first-child p{color:var(--muted)}.stats>.stat-card:first-child .stat-icon{color:var(--accent);background:#ffffff80}
.badge.quotation,.badge.sent{color:#876b3f;background:#f9f2e6;border-color:#eadfc9}
.badge.in_progress{color:#466f97;background:#ecf2f9;border-color:#d3e0ed}
.badge.completed,.badge.approved{color:#487662;background:#eaf3ee;border-color:#cfdfd5}
.badge.draft{color:#697487;background:#eff1f5;border-color:#dfe4ec}
.stat-icon.amber{color:#9b7b49;background:#f9f3e9}.stat-icon.blue{color:#527ba0;background:#edf2f8}.stat-icon.green{color:#55836a;background:#edf4ee}
.positive{color:#4f7e64}.negative,.overdue{color:#ac6969}.alert.error{color:#985958;background:#fbefed;border-color:#ecd3ce}.alert.success{color:#4d735d;background:#edf5ef;border-color:#d5e6da}
.project-progress .done{color:#5e8470}.project-progress .done b{color:#52765f;background:#eaf3ed;border-color:#d5e3da}
.under-badge,.project-cell small,.panel-header p,.table-footer,.fine,.optional{font-size:11px}th{font-size:10px}.eyebrow{font-size:10px}.nav-label{font-size:10px}
input,select,textarea{font-size:14px}.button{min-height:41px}.nav-item{min-height:43px}
nav a[href*="page=expenses"] svg{color:#a17c69}nav a[href*="page=stocks"] svg{color:#688ba2}nav a[href*="page=accounts"] svg{color:#8b79a1}nav a[href*="page=purchasing"] svg{color:#94875d}nav a[href*="page=petty_cash"] svg{color:#5d9393}
.finance-tabs{display:flex;gap:22px;overflow:auto;border-bottom:1px solid var(--border);margin-bottom:24px;white-space:nowrap}.finance-tabs a{padding:12px 0;font-size:12px;color:var(--muted);border-bottom:2px solid transparent}.finance-tabs .selected{color:var(--accent);border-color:var(--accent);font-weight:600}
.finance-line{border:1px solid var(--border);background:#fafbfc;border-radius:10px;padding:20px;margin-bottom:18px}.finance-line-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;font-size:12px;color:var(--accent)}
.allocation-box{padding:15px 18px;background:var(--accent-soft);border-radius:8px;margin:8px 0 18px}.line-fin-total{display:flex;justify-content:space-between;border-top:1px solid var(--border);padding-top:12px;font-size:12px}.finance-review-totals{display:flex;justify-content:space-between;gap:20px;background:var(--accent-soft);border-radius:10px;margin:22px 0;padding:20px;flex-wrap:wrap}.finance-review-totals span{display:block;font-size:11px;color:var(--muted)}.finance-review-totals strong{display:block;font-size:20px;font-weight:600;margin-top:6px;color:var(--ink)}
.reader-actions{display:flex;gap:12px;flex-wrap:wrap}.reader-status{font-size:12px;color:var(--accent);margin:15px 0 0}.source-text{font:12px/1.7 ui-monospace,monospace;background:#f4f6f9;border:1px solid var(--border);padding:18px;max-height:340px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere}.source-image{display:block;max-width:100%;max-height:520px;object-fit:contain;margin-top:20px}
.expense-month{display:grid;grid-template-columns:35px minmax(60px,1fr) 125px;align-items:center;gap:14px;margin:13px 0;font-size:11px}.expense-month strong{text-align:right;font-weight:500}.expense-month meter{height:14px;width:100%;accent-color:var(--accent)}meter::-webkit-meter-bar{border:0;background:#e9eaf0;border-radius:6px}meter::-webkit-meter-optimum-value{background:#a398b6;border-radius:6px}
@media(max-width:700px){.finance-review-totals{display:grid;grid-template-columns:1fr 1fr;gap:20px}.finance-line{padding:16px}.expense-month{grid-template-columns:28px minmax(40px,1fr) 110px;gap:8px}.finance-tabs{gap:20px}.source-text{font-size:11px}}
@media print{.print-body,.print-sheet{background:#fff}.print-toolbar{display:none}}

/* CRM layout: a quiet workspace, grouped navigation and focused record pages. */
:root{--ink:#243244;--muted:#657387;--paper:#f5f7fa;--nav:#ffffff;--border:#e4e9f0}
.sidebar{width:224px;padding:24px 14px 12px;background:#fff;border-right:1px solid var(--border)}
.brand{font-size:20px;padding:0 10px}.logo-mark{width:32px;height:32px;border-radius:9px;background:#334c68}
.workspace{margin:26px 4px 22px;padding:10px;background:#f7f9fc;border:0}.workspace-dot{display:none}.workspace strong{font-size:12px}.workspace small{font-size:11px}
.nav-label{display:block;text-transform:uppercase;font-size:10px;letter-spacing:1.3px;color:#7a8797;padding:0 12px;margin:0 0 8px}.nav-group{margin-top:21px}
.nav-item{font-size:13px;min-height:40px;padding:9px 12px;margin-bottom:3px;border-radius:8px;gap:11px}.nav-item.active,.project-nav-heading.active{font-weight:650}.projects-subnav .nav-item{font-size:12px;min-height:34px;padding-top:7px;padding-bottom:7px}.projects-subnav{margin-bottom:0}
.sidebar-bottom{padding-top:18px}.profile{margin-top:12px;padding:14px 7px 0}.profile strong{font-size:12px}.profile small{font-size:11px}
.app-main{margin-left:224px}.topbar{height:64px;background:#ffffffd9;padding:0 32px}.breadcrumbs{font-size:12px}.content{padding:30px 32px;max-width:1540px}.footer{padding:0 32px 22px;font-size:11px}.footer span{font-size:10px}
.page-heading{margin-bottom:26px}.page-heading h1{font-size:28px;letter-spacing:-.8px;margin-bottom:7px}.eyebrow{font-size:10px;letter-spacing:1.3px;margin-bottom:8px}.page-heading p{font-size:13px;max-width:680px;color:var(--muted)}
.panel{border:1px solid var(--border);border-radius:12px;box-shadow:0 3px 14px #263b5603}.panel-header{padding:21px 24px}.panel-header p{font-size:12px}.panel-header h2{font-size:17px}.button{font-size:12px;min-height:40px;border-radius:8px}.button.primary{box-shadow:none}.form-panel{padding:24px}.form-panel h2{color:var(--ink)}
label{font-size:12px;color:#46576b}input,select,textarea{color:var(--ink);border-color:#dce3ec;min-height:42px}input::placeholder,textarea::placeholder{color:#8490a0;font-size:12px}.check-option input{min-height:0}.optional{font-size:11px}
th{background:#f8fafc;color:#6a788b;font-size:10px;padding:13px 20px}td{padding:18px 20px;font-size:12px;border-color:#edf0f5;color:#536278}.project-cell strong{font-size:13px;color:var(--ink)}.project-cell small,.under-badge{font-size:11px}.date-cell{font-size:12px}.badge{font-size:10px;border-radius:6px;padding:4px 9px}.project-initial{background:#eef2f7;color:#60748b}.table-footer{font-size:11px}.search-label input{font-size:12px}
.project-summary{gap:0;background:#fff;border:1px solid var(--border);border-radius:12px;overflow:hidden;margin-bottom:24px}.project-summary .stat-card,.project-summary .stat-card:first-child{border:0;border-radius:0;border-right:1px solid var(--border);background:#fff;padding:18px 22px}.project-summary .stat-card:last-child{border-right:0}.project-summary .stat-card:hover{background:#f8fafc}.project-summary .stat-card>div{font-size:12px;color:#536278}.project-summary .stat-card strong{font-size:28px;margin-top:6px}.project-summary .stat-card strong small{display:none}.project-summary .stat-card p{font-size:11px;margin-top:4px;color:var(--muted)}.project-summary .stat-card:nth-child(2){border-top:3px solid #d9b779}.project-summary .stat-card:nth-child(3){border-top:3px solid #8caed0}.project-summary .stat-card:nth-child(4){border-top:3px solid #8cb49d}.project-summary .stat-card:first-child{border-top:3px solid #91a0b6}
.record-layout{display:grid;grid-template-columns:178px minmax(0,1fr);gap:26px;align-items:start}.record-content{min-width:0}.record-nav{display:flex;flex-direction:column;gap:3px;white-space:normal;overflow:visible;border:0;margin:0;padding:10px 0;position:sticky;top:20px}.record-nav a{font-size:12px;padding:10px 12px;border:0;border-radius:7px;color:#657387;line-height:1.4}.record-nav a:hover{background:#eaf0f6}.record-nav a.selected{background:var(--accent-soft);color:var(--accent);font-weight:650;border:0;box-shadow:inset 3px 0 var(--accent)}
.project-progress{padding:15px 20px;margin-bottom:24px}.financial .stat-card>strong{font-size:23px;letter-spacing:-.6px}.financial .stat-card>div{font-size:12px}.financial .stat-card p{font-size:11px;line-height:1.6}.financial{gap:14px}.stat-card{padding:19px;border-radius:11px}.stats.financial+.stats.financial .stat-card{background:transparent;border-color:var(--border);padding:15px}.stats.financial+.stats.financial .stat-card strong{font-size:21px}
.upload-panel summary{font-size:14px;font-weight:600;margin-bottom:0}.upload-panel[open] summary{margin-bottom:18px}.summary-heading{font-size:13px}.expense-month{font-size:12px}.details dt,.details dd{font-size:12px}.finance-tabs:not(.record-nav){gap:12px;padding:5px;background:#edf1f6;border:0;border-radius:9px}.finance-tabs:not(.record-nav) a{padding:9px 14px;border:0;border-radius:6px;font-size:12px}.finance-tabs:not(.record-nav) .selected{background:#fff;box-shadow:0 1px 4px #2034510b;color:var(--ink)}
@media(min-width:701px) and (max-height:850px){.sidebar{padding-top:18px}.workspace{margin:20px 4px 17px}.nav-group{margin-top:15px}.nav-item{min-height:36px;padding:7px 12px}.sidebar-bottom{padding-top:5px}.profile{margin-top:5px}}
@media(max-width:1200px){.record-layout{grid-template-columns:155px minmax(0,1fr);gap:18px}.record-content .financial{grid-template-columns:repeat(2,minmax(0,1fr))}.record-content .two-column{grid-template-columns:1fr}.content{padding:26px 24px}.project-summary .stat-card{padding:17px}.record-content .section-heading{flex-wrap:wrap}}
@media(max-width:900px){.record-layout{display:block}.record-nav{position:static;flex-direction:row;flex-wrap:wrap;background:#fff;border:1px solid var(--border);padding:6px;margin-bottom:22px;gap:3px;border-radius:10px}.record-nav a{font-size:12px;padding:9px 11px}.record-nav a.selected{box-shadow:none}.project-summary{grid-template-columns:1fr 1fr}.project-summary .stat-card{border-bottom:1px solid var(--border)}}
@media(max-width:700px){.sidebar{width:235px}.app-main{margin-left:0}.topbar{height:58px;padding:0 18px}.content{padding:24px 16px}.page-heading h1{font-size:25px}.page-heading p{font-size:12px}.eyebrow{font-size:9px}.project-summary .stat-card{padding:15px}.project-summary .stat-card>div{font-size:11px}.project-summary .stat-card strong{font-size:25px}.project-summary .stat-card p{font-size:10px}.project-summary .stat-icon{width:25px;height:25px}.panel-header{padding:18px}.record-content .financial .stat-card>strong{font-size:19px}.financial .stat-card{padding:14px}.form-panel{padding:19px}.finance-tabs:not(.record-nav){flex-wrap:wrap;white-space:normal}.record-nav{gap:2px}.record-nav a{font-size:11px;padding:8px}.footer{padding:0 18px 18px}.expense-month{grid-template-columns:28px minmax(40px,1fr) 103px;font-size:11px}}
@media print{.record-nav,.sidebar,.topbar,.footer{display:none}.record-layout{display:block}.app-main{margin:0}.content{padding:0}}
