@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Noto+Sans+SC:wght@400;500;600;700&display=swap');

:root {
    --bg: #f3f3ef;
    --surface: #ffffff;
    --surface-2: #f8f8f5;
    --surface-dark: #191c19;
    --ink: #20231f;
    --muted: #72776f;
    --muted-2: #a2a79f;
    --line: #ddded8;
    --line-strong: #c8cac2;
    --accent: #39705a;
    --accent-hover: #2e5e4b;
    --accent-soft: #e6f0eb;
    --danger: #b9473f;
    --warning: #a56a20;
    --success: #39705a;
    --info: #416d80;
    --font-sans: 'Noto Sans SC', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    --font-mono: 'DM Mono', ui-monospace, monospace;
    --text-xs: .72rem;
    --text-sm: .82rem;
    --text-md: .94rem;
    --text-lg: 1.08rem;
    --text-xl: 1.38rem;
    --text-2xl: clamp(1.75rem, 3vw, 2.4rem);
    --lh-tight: 1.2;
    --lh-body: 1.65;
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 16px;
    --shadow-sm: 0 1px 2px rgba(25, 28, 25, .04), 0 8px 24px rgba(25, 28, 25, .04);
    --shadow-lg: 0 24px 70px rgba(25, 28, 25, .13);
    --dur-1: 140ms;
    --dur-2: 240ms;
    --ease-out: cubic-bezier(.2, .8, .2, 1);
}

* { box-sizing: border-box; }
html { min-height: 100%; scroll-behavior: smooth; }
body { min-height: 100vh; margin: 0; background: var(--bg); color: var(--ink); font-family: var(--font-sans); font-size: var(--text-md); line-height: var(--lh-body); -webkit-font-smoothing: antialiased; }
a { color: var(--accent); }
a:hover { color: var(--accent-hover); }
.skip-link { position: fixed; left: 1rem; top: -4rem; z-index: 9999; padding: .65rem 1rem; background: var(--surface-dark); color: #fff; border-radius: var(--radius-sm); transition: top var(--dur-1); }
.skip-link:focus { top: 1rem; }
.app-width { width: min(100% - 40px, 1240px); margin-inline: auto; }

/* Header */
.app-header { position: sticky; top: 0; z-index: 1020; background: rgba(243, 243, 239, .92); border-bottom: 1px solid var(--line); backdrop-filter: blur(14px); }
.app-header .navbar { min-height: 74px; padding: 0; }
.navbar-brand { display: flex; align-items: center; gap: .72rem; margin-right: 2.4rem; color: var(--ink); }
.navbar-brand:hover { color: var(--ink); }
.brand-mark { position: relative; display: inline-grid; place-items: center; width: 35px; height: 35px; flex: 0 0 35px; background: var(--surface-dark); border-radius: 9px; overflow: hidden; }
.brand-mark::before, .brand-mark::after, .brand-mark span { content: ''; position: absolute; width: 3px; background: #d8e4dc; border-radius: 4px; transform: rotate(32deg); }
.brand-mark::before { height: 14px; left: 10px; top: 5px; }
.brand-mark span { height: 22px; left: 16px; top: 7px; }
.brand-mark::after { height: 14px; right: 8px; bottom: 4px; }
.brand-copy { display: grid; line-height: 1.05; }
.brand-copy strong { font-family: var(--font-mono); font-size: .83rem; letter-spacing: .12em; }
.brand-copy small { margin-top: .28rem; color: var(--muted); font-size: .69rem; }
.app-nav { gap: .25rem; }
.app-nav .nav-link { position: relative; display: flex; align-items: center; gap: .45rem; min-height: 42px; padding: .55rem .72rem !important; color: var(--muted); border-radius: var(--radius-sm); font-size: var(--text-sm); font-weight: 500; transition: color var(--dur-1), background var(--dur-1); }
.app-nav .nav-link i { font-size: .96rem; }
.app-nav .nav-link:hover { color: var(--ink); background: rgba(255,255,255,.6); }
.app-nav .nav-link.active { color: var(--ink); background: var(--surface); box-shadow: inset 0 0 0 1px var(--line); }
.app-nav .nav-link.active::after { content: ''; position: absolute; left: .75rem; right: .75rem; bottom: -17px; height: 2px; background: var(--accent); }
.user-menu { margin-left: .8rem; }
.user-trigger { display: flex; align-items: center; gap: .6rem; padding: .35rem .45rem; min-height: 46px; color: var(--ink); background: transparent; border: 0; border-radius: var(--radius-md); text-align: left; }
.user-trigger:hover { background: rgba(255,255,255,.7); }
.user-avatar { display: grid; place-items: center; width: 34px; height: 34px; color: #d9e9df; background: var(--accent); border-radius: 50%; font-size: var(--text-sm); font-weight: 600; }
.user-meta { display: grid; min-width: 68px; line-height: 1.15; }
.user-meta strong { font-size: var(--text-sm); font-weight: 600; }
.user-meta small { margin-top: .25rem; color: var(--muted); font-size: .68rem; }
.user-trigger > i { color: var(--muted); font-size: .72rem; }
.navbar-toggler { width: 42px; height: 42px; padding: 0; color: var(--ink); border-color: var(--line-strong); }
.navbar-toggler:focus { box-shadow: 0 0 0 3px rgba(57,112,90,.2); }

/* Main structure */
.app-main { min-height: calc(100vh - 146px); padding-block: 38px 50px; animation: page-in var(--dur-2) var(--ease-out) both; }
.app-main > .d-flex:first-child, .app-main > h2:first-child, .app-main > h5:first-child { position: relative; padding-top: 14px; }
.app-main > .d-flex:first-child::before, .app-main > h2:first-child::before, .app-main > h5:first-child::before { content: ''; position: absolute; top: 0; left: 0; width: 38px; height: 2px; background: var(--accent); box-shadow: 8px 0 0 -0.5px var(--bg), 16px 0 0 -0.5px var(--accent); }
h1, h2, h3, h4, h5, h6 { color: var(--ink); letter-spacing: -.02em; }
h2 { font-size: var(--text-2xl); font-weight: 650; }
h3 { font-size: 1.55rem; font-weight: 650; }
h5 { font-size: var(--text-lg); font-weight: 650; }
.text-muted { color: var(--muted) !important; }
.small, small { font-size: var(--text-sm); }
.app-footer { display: flex; justify-content: space-between; padding-block: 20px 30px; color: var(--muted-2); border-top: 1px solid var(--line); font-family: var(--font-mono); font-size: .68rem; letter-spacing: .03em; }
.page-heading { position: relative; display: flex; justify-content: space-between; margin-bottom: 1.5rem; padding-top: 16px; }
.page-heading::before { content: ''; position: absolute; top: 0; left: 0; width: 38px; height: 2px; background: var(--accent); box-shadow: 8px 0 0 -.5px var(--bg), 16px 0 0 -.5px var(--accent); }
.page-heading h2 { margin: .55rem 0 .35rem; }
.page-heading p { margin: 0; color: var(--muted); }
.back-link { display: inline-flex; align-items: center; gap: .4rem; color: var(--muted); font-size: var(--text-sm); text-decoration: none; }
.back-link:hover { color: var(--accent); }
.system-online { display: flex; align-items: center; gap: .45rem; }
.system-online i, .story-status i { width: 6px; height: 6px; background: #68a786; border-radius: 50%; box-shadow: 0 0 0 4px rgba(104,167,134,.12); }

/* Cards, tables and data */
.card { overflow: hidden; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }
.card.shadow, .card.shadow-sm { box-shadow: var(--shadow-sm) !important; }
.card-header { padding: 1.05rem 1.25rem; background: var(--surface-2); border-bottom: 1px solid var(--line); border-radius: 0 !important; font-weight: 600; }
.card-body { padding: 1.35rem; }
.stat-card { position: relative; min-height: 124px; text-align: left !important; transition: transform var(--dur-2) var(--ease-out), border-color var(--dur-2); }
.stat-card::before { content: ''; position: absolute; top: 18px; right: 18px; width: 7px; height: 7px; border: 1px solid var(--line-strong); border-radius: 50%; }
.stat-card:hover { transform: translateY(-2px); border-color: var(--line-strong); }
.stat-card .card-body { display: flex; flex-direction: column; justify-content: space-between; }
.stat-number { margin-bottom: .55rem; color: var(--ink) !important; font-family: var(--font-mono); font-size: clamp(1.45rem, 3vw, 2rem); font-weight: 500; letter-spacing: -.05em; line-height: 1.1; }
.table-responsive { scrollbar-width: thin; }
.table { --bs-table-bg: transparent; --bs-table-hover-bg: #f7f8f4; margin: 0; color: var(--ink); }
.table > :not(caption) > * > * { padding: .9rem 1rem; border-bottom-color: var(--line); vertical-align: middle; }
.table thead.table-light, .table-light { --bs-table-bg: var(--surface-2); }
.table th { color: var(--muted); font-family: var(--font-mono); font-size: .68rem; font-weight: 500; letter-spacing: .055em; text-transform: uppercase; white-space: nowrap; }
.table td { font-size: var(--text-sm); }
.table tbody tr:last-child td { border-bottom: 0; }
.progress { height: 7px; overflow: visible; background: #e8e9e4; border-radius: 2px; }
.progress-bar { position: relative; border-radius: 2px; background-color: var(--accent); }
.progress-bar::after { content: ''; position: absolute; right: -1px; top: -2px; width: 2px; height: 11px; background: currentColor; }

/* Controls */
.btn { min-height: 40px; padding: .55rem .9rem; border-radius: var(--radius-sm); font-size: var(--text-sm); font-weight: 600; box-shadow: none !important; transition: transform var(--dur-1), background var(--dur-1), border-color var(--dur-1); }
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn-sm { min-height: 34px; padding: .38rem .65rem; }
.btn-primary { --bs-btn-bg: var(--surface-dark); --bs-btn-border-color: var(--surface-dark); --bs-btn-hover-bg: #2b302b; --bs-btn-hover-border-color: #2b302b; --bs-btn-active-bg: #101210; --bs-btn-active-border-color: #101210; }
.btn-outline-primary { --bs-btn-color: var(--accent); --bs-btn-border-color: #a9beb3; --bs-btn-hover-bg: var(--accent-soft); --bs-btn-hover-color: var(--accent-hover); --bs-btn-hover-border-color: var(--accent); }
.btn-success { --bs-btn-bg: var(--success); --bs-btn-border-color: var(--success); }
.btn-warning { --bs-btn-bg: #efe1ca; --bs-btn-border-color: #e1c69f; --bs-btn-color: #744817; --bs-btn-hover-bg: #e7d4b6; --bs-btn-hover-border-color: #d8b783; --bs-btn-hover-color: #603a12; }
.btn-danger { --bs-btn-bg: var(--danger); --bs-btn-border-color: var(--danger); }
.btn-outline-secondary { --bs-btn-color: #60655e; --bs-btn-border-color: var(--line-strong); --bs-btn-hover-bg: var(--surface-2); --bs-btn-hover-color: var(--ink); --bs-btn-hover-border-color: #aeb1a9; }
.form-label { margin-bottom: .45rem; color: #484d47; font-size: var(--text-sm); font-weight: 600; }
.form-control, .form-select { min-height: 44px; padding: .62rem .78rem; color: var(--ink); background-color: var(--surface); border: 1px solid var(--line-strong); border-radius: var(--radius-sm); font-size: var(--text-sm); }
textarea.form-control { min-height: auto; }
.form-control::placeholder { color: #a6aaa3; }
.form-control:focus, .form-select:focus { color: var(--ink); border-color: var(--accent); box-shadow: 0 0 0 3px rgba(57,112,90,.14); }
.form-text { margin-top: .42rem; color: var(--muted); font-size: var(--text-xs); }
.input-group .form-select:first-child { border-radius: var(--radius-sm) 0 0 var(--radius-sm); }
.input-group .form-control:last-child { border-radius: 0 var(--radius-sm) var(--radius-sm) 0; }
.form-field { margin-bottom: 1.2rem; }
.badge { padding: .42em .68em; border-radius: 99px; font-size: .69rem; font-weight: 600; letter-spacing: .01em; }
.bg-primary { background-color: var(--accent) !important; }
.bg-success { background-color: var(--success) !important; }
.bg-warning { background-color: #d69b45 !important; color: #34210b !important; }
.bg-danger { background-color: var(--danger) !important; }
.bg-info { background-color: var(--info) !important; }
.bg-secondary { background-color: #737970 !important; }
.text-primary { color: var(--accent) !important; }
.text-success { color: var(--success) !important; }
.text-warning { color: var(--warning) !important; }
.text-danger { color: var(--danger) !important; }
.text-info { color: var(--info) !important; }
.alert { display: flex; align-items: flex-start; gap: .65rem; padding: .8rem 1rem; border: 1px solid; border-radius: var(--radius-sm); font-size: var(--text-sm); }
.alert .btn-close { margin-left: auto; }
.alert-info { color: #345b6b; background: #edf4f6; border-color: #cadde3; }
.alert-success { color: #2f604c; background: #ebf4ef; border-color: #c8ddd2; }
.alert-warning { color: #7a501d; background: #faf2e5; border-color: #ead4b1; }
.alert-danger { color: #85352f; background: #f9eceb; border-color: #e8c4c1; }
.flash-stack { display: grid; gap: .6rem; margin-bottom: 1rem; }
.dropdown-menu { padding: .45rem; border: 1px solid var(--line); border-radius: var(--radius-md); box-shadow: var(--shadow-lg); }
.dropdown-item { display: flex; align-items: center; gap: .65rem; padding: .6rem .7rem; border-radius: var(--radius-sm); font-size: var(--text-sm); }
.dropdown-item:active { background: var(--accent); }
.modal-content { border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); }
.modal-header, .modal-footer { border-color: var(--line); }
.modal-backdrop.show { opacity: .35; }
.form-card .card-header { display: flex; justify-content: space-between; align-items: center; }
.form-card .card-header small { color: var(--muted); font-family: var(--font-mono); font-size: .65rem; font-weight: 400; }
.form-actions { display: flex; gap: .6rem; margin-top: 1.6rem; padding-top: 1.25rem; border-top: 1px solid var(--line); }
.role-guide { padding: 1.35rem; background: var(--surface-dark); border-radius: var(--radius-md); color: #edf0ea; }
.role-guide .eyebrow { color: #859087; }
.role-guide dl { margin: 0; }
.role-guide dl > div { padding: .75rem 0; border-top: 1px solid rgba(255,255,255,.09); }
.role-guide dt { margin-bottom: .18rem; font-size: var(--text-sm); font-weight: 600; }
.role-guide dd { margin: 0; color: #959e96; font-size: var(--text-xs); }
.budget-card { height: 100%; }
.budget-card-head, .budget-progress-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.budget-card-head { margin-bottom: 1.35rem; }
.budget-card-head h5 { margin: .2rem 0 0; }
.budget-label { color: var(--muted-2); font-family: var(--font-mono); font-size: .62rem; letter-spacing: .07em; }
.budget-progress-head { margin-bottom: .45rem; color: var(--muted); font-size: var(--text-xs); }
.budget-progress-head strong { color: var(--ink); font-family: var(--font-mono); }
.budget-progress { height: 8px; margin-bottom: 1.35rem; }
.budget-metrics { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--line); border-radius: var(--radius-sm); }
.budget-metrics > div { min-width: 0; padding: .85rem; border-right: 1px solid var(--line); }
.budget-metrics > div:last-child { border-right: 0; }
.budget-metrics span, .budget-metrics strong { display: block; }
.budget-metrics span { margin-bottom: .35rem; color: var(--muted); font-size: var(--text-xs); }
.budget-metrics strong { overflow: hidden; color: var(--ink); font-family: var(--font-mono); font-size: var(--text-sm); text-overflow: ellipsis; }
.budget-notice { display: flex; gap: .5rem; align-items: center; margin-top: .9rem; padding: .55rem .7rem; border-radius: var(--radius-sm); font-size: var(--text-xs); }
.budget-notice.warning { color: #7a501d; background: #faf2e5; }
.budget-notice.danger { color: #85352f; background: #f9eceb; }
.approval-action-head { display: flex; align-items: center; justify-content: space-between; margin: 1.1rem 0 .9rem; }
.approval-action-head .eyebrow { margin-bottom: .2rem; }
.approval-action-head h6 { margin: 0; }
.approval-waiting { display: flex; align-items: center; gap: .75rem; margin-top: 1.25rem; padding: .85rem 1rem; color: #6d552f; background: #faf4e9; border: 1px solid #e9d8ba; border-radius: var(--radius-sm); }
.approval-waiting > i { font-size: 1.15rem; }
.approval-waiting > div { display: grid; margin-right: auto; }
.approval-waiting strong { font-size: var(--text-sm); }
.approval-waiting span { color: #8c7959; font-size: var(--text-xs); }
.list-group-item { padding: .9rem 1rem; border-color: var(--line); }
hr { border-color: var(--line); opacity: 1; }

/* Category picker */
.cat-picker { position: relative; }
.cat-picker-trigger { padding-right: 2.25rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23656a63' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M3 6l5 5 5-5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right .75rem center; background-size: 14px 10px; }
.cat-picker-trigger .cat-picker-label { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cat-picker-panel { position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 1055; max-height: 420px; padding: .8rem 1rem; overflow-y: auto; background: var(--surface); border: 1px solid var(--line-strong); border-radius: var(--radius-md); box-shadow: var(--shadow-lg); }
.cat-picker-search { position: sticky; top: -.8rem; z-index: 2; margin: -.1rem 0 .5rem; padding: .6rem 0 .55rem; background: var(--surface); border-bottom: 1px solid var(--accent); }
.cat-picker-search .bi-search { position: absolute; right: .25rem; top: .95rem; color: var(--muted); }
.cat-picker-search input { padding-left: 0; border: 0; box-shadow: none !important; }
.cat-picker-section { padding: .65rem 0; border-bottom: 1px solid var(--line); }
.cat-picker-section:last-of-type { border-bottom: 0; }
.cat-picker-group-title { margin-bottom: .45rem; color: var(--ink); font-size: var(--text-sm); font-weight: 700; }
.cat-picker-items { display: flex; flex-wrap: wrap; gap: .28rem .5rem; }
.cat-picker-item { padding: .34rem .55rem; color: #4d524b; background: var(--surface-2); border: 1px solid transparent; border-radius: 99px; font-size: var(--text-sm); cursor: pointer; }
.cat-picker-item:hover, .cat-picker-item.is-selected { color: var(--accent-hover); background: var(--accent-soft); border-color: #c6d9cf; }
.cat-picker-trigger.is-invalid { border-color: var(--danger); }
.cat-picker-empty { padding: 1rem; color: var(--muted); text-align: center; }

/* Authentication */
.auth-page { overflow-x: hidden; background: #e7e7e0; }
.auth-main { min-height: 100vh; padding: 18px; }
.auth-shell { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(420px, .95fr); min-height: calc(100vh - 36px); overflow: hidden; background: var(--surface); border: 1px solid #d3d4cd; border-radius: 18px; box-shadow: var(--shadow-lg); animation: auth-in 500ms var(--ease-out) both; }
.auth-story { position: relative; display: flex; flex-direction: column; justify-content: space-between; min-height: 620px; padding: clamp(30px, 5vw, 68px); overflow: hidden; color: #f0f1eb; background-color: var(--surface-dark); background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px), radial-gradient(circle at 75% 25%, rgba(80,134,109,.24), transparent 38%); background-size: 36px 36px, 36px 36px, 100% 100%; }
.auth-story::after { content: ''; position: absolute; right: -110px; bottom: -140px; width: 360px; height: 360px; border: 1px solid rgba(216,228,220,.17); border-radius: 50%; box-shadow: 0 0 0 54px rgba(216,228,220,.025), 0 0 0 108px rgba(216,228,220,.02); }
.story-top, .story-status { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; }
.story-top { justify-content: flex-start; gap: .8rem; }
.brand-mark-light { background: #eff2ec; }
.brand-mark-light::before, .brand-mark-light::after, .brand-mark-light span { background: var(--accent); }
.story-brand { font-family: var(--font-mono); font-size: .75rem; letter-spacing: .16em; }
.story-copy { position: relative; z-index: 1; max-width: 660px; }
.eyebrow { display: block; margin-bottom: 1rem; color: #809087; font-family: var(--font-mono); font-size: .67rem; letter-spacing: .11em; }
.story-copy h1 { margin: 0 0 1.5rem; color: #f5f6f1; font-size: clamp(2.45rem, 5.2vw, 5.4rem); font-weight: 500; letter-spacing: -.065em; line-height: 1.08; }
.story-copy p { max-width: 34rem; margin: 0; color: #aeb6ae; font-size: clamp(.95rem, 1.5vw, 1.08rem); line-height: 1.8; }
.story-status { color: #808a82; font-family: var(--font-mono); font-size: .65rem; }
.story-status span:first-child { display: flex; align-items: center; gap: .6rem; }
.auth-panel { display: grid; place-items: center; padding: clamp(32px, 6vw, 84px); background: #fbfbf8; }
.auth-form-wrap { width: min(100%, 390px); }
.auth-heading { margin-bottom: 2rem; }
.auth-heading h2 { margin: 0 0 .45rem; font-size: clamp(1.8rem, 3vw, 2.35rem); font-weight: 650; letter-spacing: -.045em; }
.auth-heading p { margin: 0; color: var(--muted); }
.mobile-brand { display: none; }
.input-icon { position: relative; }
.input-icon > i { position: absolute; z-index: 1; left: .85rem; top: 50%; color: var(--muted); transform: translateY(-50%); }
.input-icon .form-control { height: 49px; padding-left: 2.65rem; background: #fff; }
.auth-submit { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 50px; margin-top: .4rem; padding-inline: 1.1rem; }
.auth-submit i { transition: transform var(--dur-1); }
.auth-submit:hover i { transform: translateX(4px); }
.auth-help { display: flex; align-items: center; gap: .45rem; margin: 1.4rem 0 0; color: var(--muted-2); font-size: var(--text-xs); }

@keyframes page-in { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }
@keyframes auth-in { from { opacity: 0; transform: scale(.99); } to { opacity: 1; transform: none; } }

@media (max-width: 991.98px) {
    .app-header .navbar { min-height: 64px; }
    .navbar-collapse { margin-top: .75rem; padding: .65rem 0 1rem; border-top: 1px solid var(--line); }
    .app-nav .nav-link { padding-inline: .6rem !important; }
    .app-nav .nav-link.active::after { top: 10px; bottom: 10px; left: -1px; right: auto; width: 2px; height: auto; }
    .user-menu { margin: .5rem 0 0; padding-top: .65rem; border-top: 1px solid var(--line); }
    .user-trigger { width: 100%; }
    .auth-shell { grid-template-columns: 1fr 420px; }
    .auth-story { padding: 40px; }
    .story-copy h1 { font-size: 3.25rem; }
}

@media (max-width: 767.98px) {
    .app-width { width: min(100% - 24px, 1240px); }
    .app-main { padding-block: 26px 38px; }
    .app-footer { gap: 1rem; }
    .auth-main { padding: 0; }
    .auth-shell { display: block; min-height: 100vh; border: 0; border-radius: 0; }
    .auth-story { display: none; }
    .auth-panel { min-height: 100vh; padding: 32px 24px; }
    .mobile-brand { display: block; margin-bottom: 3.6rem; color: var(--ink); font-family: var(--font-mono); font-size: .72rem; letter-spacing: .08em; }
    .card-body { padding: 1.1rem; }
    .table > :not(caption) > * > * { padding: .75rem .8rem; }
    .d-flex.justify-content-between.align-items-center { align-items: flex-start !important; gap: .75rem; }
    .page-heading { display: grid; gap: 1rem; }
    .budget-metrics { grid-template-columns: 1fr; }
    .budget-metrics > div { border-right: 0; border-bottom: 1px solid var(--line); }
    .budget-metrics > div:last-child { border-bottom: 0; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}