@font-face {
    font-family: "Noto Sans Myanmar";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("/fonts/NotoSansMyanmar-Myanmar.woff2") format("woff2");
    unicode-range: U+1000-109F, U+200C-200D, U+25CC, U+A92E, U+A9E0-A9FE, U+AA60-AA7F, U+116D0-116E3;
}

@font-face {
    font-family: "Noto Sans Myanmar";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("/fonts/NotoSansMyanmar-Latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
    --mtg-red: #b91c1c;
    --mtg-red-dark: #7f1d1d;
    --mtg-dark-red: var(--mtg-red-dark);
    --mtg-black: #111111;
    --mtg-bg: #f5f5f5;
    --mtg-surface: #ffffff;
    --mtg-text: #171717;
    --mtg-muted: #6b7280;
    --mtg-border: #e5e7eb;
    --mtg-success: #15803d;
    --mtg-warning: #b45309;
    --mtg-radius: 12px;
    --mtg-shadow: 0 10px 28px rgba(17, 17, 17, .08);
    --mtg-sidebar: 264px;
    --mtg-topbar: 72px;
    --mtg-control-height: 46px;
    --mtg-focus-ring: 0 0 0 3px rgba(185, 28, 28, .18);
    --mtg-space-1: 4px;
    --mtg-space-2: 8px;
    --mtg-space-3: 12px;
    --mtg-space-4: 16px;
    --mtg-space-5: 24px;
    --mtg-space-6: 32px;
    --mtg-success-surface: #f0fdf4;
    --mtg-warning-surface: #fff7ed;
    --mtg-error-surface: #fef2f2;
}

* { box-sizing: border-box; }
html, body { min-height: 100%; background: var(--mtg-bg); color: var(--mtg-text); }
body { margin: 0; font-family: "Noto Sans Myanmar", "Myanmar Text", "Pyidaungsu", Inter, system-ui, -apple-system, sans-serif; }
button, input, select, textarea { font: inherit; }
button { touch-action: manipulation; }
body.drawer-scroll-locked { overflow: hidden; }
:where(button, a, input, select, textarea, [tabindex]):focus-visible { outline: 3px solid rgba(185,28,28,.28); outline-offset: 2px; }
:where(button, input, select, textarea):disabled { cursor: not-allowed; }
::selection { color: #fff; background: var(--mtg-red); }
.app-icon { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 auto; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: var(--mtg-sidebar) minmax(0, 1fr); background: var(--mtg-bg); }
.desktop-sidebar, .mobile-drawer { background: var(--mtg-black); color: white; }
.desktop-sidebar { position: sticky; top: 0; height: 100vh; overflow: hidden; z-index: 30; }
.app-stage { min-width: 0; }
.app-topbar { height: var(--mtg-topbar); position: sticky; top: 0; z-index: 20; display: flex; align-items: center; justify-content: space-between; padding: 0 26px; background: var(--mtg-black); color: white; border-left: 1px solid #2b2b2b; }
.topbar-leading, .topbar-user { display: flex; align-items: center; gap: 13px; min-width: 0; }
.topbar-context, .user-copy { display: flex; flex-direction: column; min-width: 0; }
.topbar-context span, .user-copy strong { font-size: 14px; font-weight: 700; white-space: nowrap; }
.topbar-context small, .user-copy small { color: #a3a3a3; font-size: 11px; white-space: nowrap; }
.mobile-logo { display: none; width: 38px; height: 38px; border-radius: 8px; object-fit: contain; background: white; }
.user-avatar { width: 37px; height: 37px; display: grid; place-items: center; border-radius: 50%; background: var(--mtg-red); font-weight: 800; }
.icon-button, .logout-button { min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 0; border-radius: 9px; color: inherit; background: transparent; cursor: pointer; }
.icon-button:hover, .logout-button:hover { background: rgba(255,255,255,.1); }
.logout-button { color: #f5f5f5; padding: 0 10px; }
.app-content { min-height: calc(100vh - var(--mtg-topbar)); padding: 28px; }
.page-loading-mask { position: fixed; inset: var(--mtg-topbar) 0 0 var(--mtg-sidebar); z-index: 18; display: grid; place-items: start center; padding: 42px 28px; background: var(--mtg-bg); }
.page-loading-mask .state-panel { width: min(100%, 720px); min-height: 104px; justify-content: center; font-size: 16px; }

.nav-brand { height: var(--mtg-topbar); display: flex; align-items: center; gap: 12px; padding: 0 18px; border-bottom: 1px solid #2b2b2b; }
.nav-brand img { width: 44px; height: 44px; object-fit: contain; border: 1px solid #525252; border-radius: 9px; background: white; }
.nav-brand div { display: flex; flex-direction: column; min-width: 0; }
.nav-brand strong { font-size: 14px; white-space: nowrap; }
.nav-brand small { color: #a3a3a3; font-size: 10px; }
.nav-groups { height: calc(100vh - var(--mtg-topbar) - 78px); overflow-y: auto; padding: 14px 0; scrollbar-width: thin; }
.nav-group { border-bottom: 1px solid #252525; padding-bottom: 8px; margin-bottom: 8px; }
.nav-group-title { width: 100%; min-height: 48px; display: flex; align-items: center; gap: 12px; padding: 0 18px; color: #f5f5f5; border: 0; background: transparent; text-align: left; cursor: pointer; }
.nav-group-title > span { flex: 1; font-size: 13px; font-weight: 700; }
.nav-chevron { width: 16px; transition: transform .18s ease; }
.nav-chevron.open { transform: rotate(90deg); }
.nav-links { display: grid; gap: 2px; }
.nav-links .nav-link { min-height: 44px; display: flex; align-items: center; gap: 12px; padding: 0 18px 0 51px; border-left: 3px solid transparent; color: #d4d4d4; font-size: 12.5px; text-decoration: none; }
.nav-links .nav-link:hover { color: white; background: #202020; }
.nav-links .nav-link.active { color: white; background: var(--mtg-red); border-left-color: #fecaca; }
.nav-link-mark { width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .55; }
.nav-footer { height: 78px; display: flex; align-items: center; gap: 10px; padding: 0 18px; border-top: 1px solid #2b2b2b; color: #a3a3a3; }
.nav-footer span { display: flex; flex-direction: column; font-size: 11px; }
.nav-footer small { color: #737373; font-size: 9px; }
.sidebar-collapsed { --mtg-sidebar: 80px; }
.sidebar-collapsed .nav-brand { justify-content: center; padding: 0; }
.sidebar-collapsed .nav-group-title, .sidebar-collapsed .nav-footer { justify-content: center; padding: 0; }

.page-header { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 22px; }
.page-header h1 { margin: 0; font-size: clamp(24px, 2.3vw, 34px); line-height: 1.2; font-weight: 800; letter-spacing: -.02em; }
.page-header p { margin: 7px 0 0; color: var(--mtg-muted); font-size: 13px; }
.app-primary { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 18px; border-color: var(--mtg-red); background: var(--mtg-red); font-weight: 700; }
.app-primary:hover, .app-primary:focus { border-color: var(--mtg-red-dark); background: var(--mtg-red-dark); }
.app-secondary { min-height: 44px; border: 1px solid #d4d4d4; background: white; color: var(--mtg-text); font-weight: 650; }
.app-danger-outline { min-height: 44px; border: 1px solid #fecaca; background: white; color: var(--mtg-red); }
.app-input, .app-select { min-height: 46px; border-color: #d4d4d4; border-radius: 9px; font-size: 13px; }
.app-input:focus, .app-select:focus { border-color: var(--mtg-red); box-shadow: 0 0 0 3px rgba(185,28,28,.12); }
.form-label { margin-bottom: 7px; color: #3f3f46; font-size: 12px; font-weight: 700; }

.toolbar-panel { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 14px; padding: 14px; border: 1px solid var(--mtg-border); border-radius: var(--mtg-radius); background: white; }
.filter-toolbar { display:flex; align-items:flex-end; gap:12px; margin-bottom:14px; padding:14px; border:1px solid var(--mtg-border); border-radius:var(--mtg-radius); background:#fff; box-shadow:0 2px 12px rgba(17,17,17,.025); }
.filter-toolbar-fields { min-width:0; flex:1 1 auto; display:flex; align-items:flex-end; flex-wrap:wrap; gap:10px; }
.filter-toolbar-actions { flex:0 0 auto; display:flex; align-items:center; flex-wrap:nowrap; gap:8px; margin-left:auto; }
.filter-toolbar-actions .btn { display:inline-flex; align-items:center; justify-content:center; gap:7px; white-space:nowrap; }
.filter-toolbar-actions .app-icon { width:17px; }
.filter-field { min-width:145px; flex:1 1 165px; display:flex; flex-direction:column; gap:6px; margin:0; }
.filter-field > span:first-child { color:#525252; font-size:10px; font-weight:800; letter-spacing:.04em; }
.filter-search-field { min-width:min(100%,260px); flex:2 1 320px; }
.filter-check { min-height:46px; display:inline-flex; align-items:center; gap:8px; padding:0 8px; color:#404040; font-size:11px; font-weight:750; white-space:nowrap; }
.filter-check input { width:17px; height:17px; accent-color:var(--mtg-red); }
.app-input:disabled,.app-select:disabled { color:#a3a3a3; background:#f5f5f5; cursor:not-allowed; }
.search-box { position: relative; flex: 1 1 280px; }
.filter-field .search-box { display:block; width:100%; flex:0 0 auto; }
.search-box .app-icon { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); width: 18px; color: #71717a; }
.search-box input { width: 100%; padding-left: 42px; }
.content-panel { overflow: hidden; border: 1px solid var(--mtg-border); border-radius: var(--mtg-radius); background: white; box-shadow: 0 2px 12px rgba(17,17,17,.03); }
.data-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.data-table th { padding: 14px 16px; color: #3f3f46; background: #fafafa; border-bottom: 1px solid var(--mtg-border); font-size: 11px; text-align: left; text-transform: uppercase; letter-spacing: .03em; }
.data-table td { padding: 15px 16px; border-bottom: 1px solid var(--mtg-border); vertical-align: middle; }
.data-table tr:last-child td { border-bottom: 0; }
.data-table tbody tr:hover { background: #fefafa; }
.row-title { font-weight: 750; }
.row-muted { color: var(--mtg-muted); font-size: 12px; }
.row-actions { display: flex; justify-content: flex-end; gap: 7px; }
.edit-button { width: 42px; height: 42px; display: inline-grid; place-items: center; border: 1px solid #d4d4d4; border-radius: 8px; color: var(--mtg-text); background: white; cursor: pointer; }
.edit-button:hover { color: var(--mtg-red); border-color: #fca5a5; background: #fff7f7; }
.edit-button .app-icon { width: 18px; }
.panel-footer { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 16px; border-top: 1px solid var(--mtg-border); color: var(--mtg-muted); font-size: 12px; }

.dialog-backdrop { position: fixed; inset: 0; z-index: 49; border: 0; background: rgba(0,0,0,.35); }
.app-dialog { position: fixed; z-index: 50; top: 0; right: 0; width: min(420px, 100%); height: 100dvh; display: grid; grid-template-rows: auto 1fr auto; background: white; box-shadow: -16px 0 34px rgba(0,0,0,.16); }
.app-dialog.fullscreen-report-dialog{inset:0;width:100vw;max-width:none;height:100dvh}
.app-dialog.fullscreen-report-dialog .dialog-body{padding:20px 24px;overflow:auto}
.notice-alert-dialog{position:fixed;z-index:90;left:50%;top:50%;width:min(440px,calc(100% - 32px));padding:28px;border:1px solid #fecaca;border-radius:18px;background:#fff;box-shadow:0 28px 80px rgba(17,17,17,.3);text-align:center;transform:translate(-50%,-50%);animation:quantity-dialog-in .16s ease-out}
.notice-dialog-backdrop{z-index:89}.notice-alert-icon{width:52px;height:52px;display:grid;place-items:center;margin:0 auto 14px;border-radius:50%;color:#fff;background:var(--mtg-red);font-size:28px;font-weight:900}.notice-alert-dialog h2{margin:0 0 9px;font-size:20px}.notice-alert-dialog p{margin:0 0 20px;color:var(--mtg-muted);line-height:1.7;white-space:pre-wrap}.notice-alert-dialog .btn{min-width:150px}
.app-dialog > header { min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 24px; border-bottom: 1px solid var(--mtg-border); }
.app-dialog h2 { margin: 0; font-size: 20px; font-weight: 800; }
.dialog-body { overflow-y: auto; padding: 24px; }
.dialog-footer { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 18px 24px; border-top: 1px solid var(--mtg-border); background: white; }
.form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.form-field { display: flex; flex-direction: column; }
.form-field.full { grid-column: 1/-1; }
.page-notice { margin: -8px 0 16px; padding: 11px 14px; border-radius: 9px; font-size: 12px; font-weight: 650; }
.security-warning { display:flex; align-items:center; gap:8px; margin-bottom:14px; padding:10px 13px; color:#92400e; border:1px solid #fde68a; border-radius:9px; background:#fffbeb; font-size:11px; }
.notice-success { color: #166534; border: 1px solid #bbf7d0; background: #f0fdf4; }
.notice-error { color: #991b1b; border: 1px solid #fecaca; background: #fef2f2; }
.master-detail-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.split-panels { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(0,.8fr); gap: 14px; }
.section-heading { min-height: 58px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding: 10px 16px; border-bottom:1px solid var(--mtg-border); }
.section-heading h2,.subheading { margin:0; font-size:15px; font-weight:800; }
.selected-row { background:#fff1f2 !important; }
.check-row { min-height:44px; display:flex; align-items:center; gap:9px; }
.summary-card { display:flex; flex-direction:column; gap:4px; margin-bottom:18px; padding:14px; border-left:4px solid var(--mtg-red); background:#fafafa; }
.mini-record { display:flex; justify-content:space-between; gap:12px; padding:12px 0; border-bottom:1px solid var(--mtg-border); font-size:12px; }
.repayment-entry { display:flex; flex-direction:column; gap:20px; }
.repayment-summary { margin:0; gap:5px; padding:16px; }
.repayment-summary > span,.repayment-summary > small { color:var(--mtg-muted); font-size:11px; }
.repayment-summary > strong { font-size:18px; }
.repayment-income-note { display:flex; align-items:center; gap:10px; padding:12px 14px; color:#166534; border:1px solid #bbf7d0; border-radius:9px; background:#f0fdf4; font-size:12px; font-weight:650; }
.repayment-amount-field { gap:7px; }
.repayment-amount-field > small { color:var(--mtg-muted); font-size:10px; }
.amount-input-wrap { position:relative; }
.amount-input-wrap .app-input { padding-right:58px; font-size:18px; font-weight:750; }
.amount-input-wrap > span { position:absolute; top:50%; right:14px; color:var(--mtg-muted); font-size:11px; font-weight:750; transform:translateY(-50%); pointer-events:none; }
.repayment-history { margin-top:2px; }
.repayment-history > header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding-bottom:8px; border-bottom:1px solid var(--mtg-border); }
.repayment-history h3 { margin:0; font-size:14px; }
.repayment-history header span { color:var(--mtg-muted); font-size:10px; }
.repayment-history .mini-record strong { color:#166534; }
.repayment-empty { padding:22px 12px; color:var(--mtg-muted); background:#fafafa; text-align:center; font-size:11px; }
.account-cards-section { display:flex; flex-direction:column; gap:16px; }
.account-card-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:18px; }
.bank-account-card { position:relative; isolation:isolate; min-height:210px; overflow:hidden; display:flex; flex-direction:column; align-items:stretch; padding:20px; color:white; border:0; border-radius:20px; background:linear-gradient(135deg,#0a0a0a 0%,#242424 58%,#7f1d1d 140%); box-shadow:0 16px 34px rgba(17,17,17,.16); font:inherit; text-align:left; cursor:pointer; transition:transform .18s ease,box-shadow .18s ease; }
.bank-account-card.tone-1 { background:linear-gradient(135deg,#7f1d1d 0%,#b91c1c 58%,#111 145%); }
.bank-account-card.tone-2 { background:linear-gradient(135deg,#18181b 0%,#3f3f46 52%,#b91c1c 135%); }
.bank-account-card:hover { transform:translateY(-3px); box-shadow:0 20px 42px rgba(17,17,17,.24); }
.bank-account-card:focus-visible { outline:3px solid #fca5a5; outline-offset:3px; }
.bank-card-glow { position:absolute; z-index:-1; width:220px; height:220px; top:-115px; right:-65px; border-radius:50%; background:rgba(255,255,255,.12); box-shadow:-145px 225px 0 24px rgba(185,28,28,.17); }
.bank-card-top,.bank-card-bottom { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; }
.bank-card-brand { display:flex; flex-direction:column; font-size:18px; font-weight:900; letter-spacing:.08em; }
.bank-card-brand small { margin-top:1px; color:rgba(255,255,255,.66); font-size:8px; letter-spacing:.16em; }
.bank-card-network { font-size:21px; font-style:italic; font-weight:950; letter-spacing:-.06em; }
.bank-card-chip { width:42px; height:31px; display:grid; grid-template-columns:1fr 1fr; gap:0; margin:18px 0 10px; overflow:hidden; border:1px solid rgba(80,55,10,.42); border-radius:7px; background:linear-gradient(135deg,#f8e7a5,#c9a34e); }
.bank-card-chip i { border-right:1px solid rgba(80,55,10,.25); border-bottom:1px solid rgba(80,55,10,.25); }
.bank-card-balance { display:flex; flex-direction:column; gap:2px; }
.bank-card-balance small,.bank-card-bottom small { color:rgba(255,255,255,.58); font-size:8px; font-weight:750; letter-spacing:.12em; }
.bank-card-balance strong { overflow-wrap:anywhere; font-size:24px; font-weight:850; letter-spacing:-.02em; }
.bank-card-balance strong.negative { color:#fecaca; }
.bank-card-balance em { font-size:10px; font-style:normal; letter-spacing:.08em; }
.bank-card-number { margin:12px 0 14px; color:rgba(255,255,255,.84); font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:13px; letter-spacing:.08em; }
.bank-card-bottom { margin-top:auto; padding-right:58px; }
.bank-card-bottom > span { min-width:0; display:flex; flex-direction:column; gap:2px; }
.bank-card-bottom strong { overflow:hidden; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.bank-card-remark { overflow:hidden; margin-top:8px; color:rgba(255,255,255,.62); font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.bank-card-edit { position:absolute; right:18px; bottom:17px; display:flex; align-items:center; gap:4px; color:rgba(255,255,255,.7); font-size:9px; font-weight:750; }
.bank-card-edit .app-icon { width:13px; }
.account-card-summary { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 18px; border:1px solid var(--mtg-border); border-radius:var(--mtg-radius); background:white; color:var(--mtg-muted); font-size:12px; }
.account-card-summary strong { color:var(--mtg-text); }
.account-card-summary strong.negative { color:var(--mtg-red); }
.account-summary-card { min-height:176px; display:flex; flex-direction:column; gap:16px; padding:20px; border:1px solid #e5e5e5; border-top:4px solid var(--mtg-red); border-radius:15px; color:var(--mtg-text); background:linear-gradient(145deg,#fff,#fafafa); box-shadow:0 10px 25px rgba(17,17,17,.08); font:inherit; text-align:left; cursor:pointer; transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease; }
.account-summary-card:hover { transform:translateY(-3px); border-color:#fecaca; box-shadow:0 15px 32px rgba(17,17,17,.13); }
.account-summary-card:focus-visible { outline:3px solid #fca5a5; outline-offset:3px; }
.account-summary-primary { display:flex; min-width:0; flex-direction:column; align-items:flex-start; gap:8px; }
.account-summary-primary > strong { overflow-wrap:anywhere; font-size:19px; font-weight:900; line-height:1.25; }
.account-summary-primary > b { max-width:100%; color:var(--mtg-red); font-size:22px; font-weight:900; line-height:1.15; text-align:left; white-space:nowrap; }
.account-summary-primary > b.negative { color:#991b1b; }.account-summary-primary em { color:#737373; font-size:9px; font-style:normal; letter-spacing:.06em; }
.account-summary-reference { color:#737373; font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:11px; letter-spacing:.08em; }
.account-summary-footer { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-top:auto; padding-top:14px; border-top:1px solid #ededed; }
.account-summary-footer > span:first-child { min-width:0; display:flex; flex-direction:column; gap:3px; }.account-summary-footer small { color:#a3a3a3; font-size:8px; font-weight:800; letter-spacing:.1em; }.account-summary-footer strong { overflow:hidden; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.account-summary-edit { display:inline-flex; align-items:center; gap:5px; color:var(--mtg-red); font-size:10px; font-weight:800; }.account-summary-edit .app-icon { width:14px; }
.goods-title { display:flex; align-items:center; gap:10px; }
.goods-title img { width:42px; height:42px; object-fit:cover; border-radius:8px; border:1px solid var(--mtg-border); }
.inline-field { display:flex; gap:8px; }
.compact-price { width:130px; min-height:38px; padding:6px 9px; border:1px solid #d4d4d4; border-radius:7px; }
.invoice-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(340px,390px); gap:16px; align-items:start; }
.padded { padding:18px; }
.invoice-form { position:relative; z-index:2; overflow:visible; }
.invoice-workspace { min-height:560px; }
.invoice-workspace-header { min-height:74px; display:flex; align-items:center; justify-content:space-between; gap:18px; padding:14px 18px; border-bottom:1px solid var(--mtg-border); }
.invoice-workspace-header h2 { margin:0; font-size:17px; font-weight:850; }.invoice-workspace-header p { margin:5px 0 0; color:var(--mtg-muted); font-size:10px; }
.invoice-running-total { display:flex; flex-direction:column; align-items:flex-end; gap:3px; white-space:nowrap; }.invoice-running-total span { color:var(--mtg-muted); font-size:9px; font-weight:700; }.invoice-running-total strong { color:var(--mtg-red); font-size:16px; }
.invoice-selector-bar { position:relative; z-index:4; display:grid; grid-template-columns:150px minmax(240px,1fr); align-items:start; gap:14px; padding:16px 18px 18px; background:#fafafa; border-bottom:1px solid var(--mtg-border); }
.invoice-item-type-group { display:grid; gap:7px; min-width:0; margin:0; padding:0; border:0; }
.invoice-item-type-group legend { margin-bottom:7px; color:#3f3f46; font-size:12px; font-weight:700; }
.invoice-type-radio { min-height:52px; display:flex; align-items:center; gap:10px; padding:8px 11px; border:1px solid #d4d4d4; border-radius:9px; background:#fff; cursor:pointer; transition:border-color .15s ease,background .15s ease,box-shadow .15s ease; }
.invoice-type-radio:hover { border-color:#fca5a5; background:#fffafa; }
.invoice-type-radio.selected { border-color:var(--mtg-red); background:#fff7f7; box-shadow:0 0 0 2px rgba(185,28,28,.08); }
.invoice-type-radio input { width:17px; height:17px; margin:0; accent-color:var(--mtg-red); }
.invoice-type-radio span,.invoice-type-radio strong,.invoice-type-radio small { display:block; }
.invoice-type-radio strong { font-size:12px; }.invoice-type-radio small { margin-top:1px; color:var(--mtg-muted); font-size:9px; }
.invoice-item-picker { min-width:0; }.invoice-picker-hint { display:block; margin-top:7px; color:var(--mtg-muted); font-size:9px; line-height:1.5; }
.item-autocomplete { position:relative; min-width:0; }
.item-autocomplete-input { position:relative; }
.item-autocomplete.is-open > .item-autocomplete-input { z-index:74; }
.item-autocomplete-input > .app-icon { position:absolute; left:13px; top:50%; z-index:1; width:18px; transform:translateY(-50%); color:#71717a; }
.item-autocomplete-input input { width:100%; padding-left:41px; padding-right:44px; }
.item-autocomplete-clear { position:absolute; right:3px; top:3px; width:40px; height:40px; display:grid; place-items:center; border:0; border-radius:7px; color:#71717a; background:white; cursor:pointer; }
.item-autocomplete-clear:hover { color:var(--mtg-red); background:#fff7f7; }.item-autocomplete-clear .app-icon { width:17px; }
.item-autocomplete-dismiss-layer { position:fixed; z-index:72; inset:0; width:100%; height:100%; padding:0; border:0; background:transparent; cursor:default; }
.item-autocomplete-menu { position:absolute; z-index:75; inset:calc(100% + 6px) 0 auto; max-height:260px; overflow-y:auto; overscroll-behavior:contain; padding:5px; border:1px solid var(--mtg-border); border-radius:10px; background:#fff; box-shadow:0 18px 38px rgba(17,17,17,.16); }
.item-autocomplete-option { width:100%; min-height:58px; display:grid; grid-template-columns:minmax(64px,auto) minmax(0,1fr); align-items:center; gap:11px; padding:9px 10px; border:0; border-radius:7px; color:var(--mtg-text); background:white; text-align:left; cursor:pointer; }
.item-autocomplete-option:hover,.item-autocomplete-option.highlighted { background:#fff1f1; }
.item-autocomplete-code { overflow:hidden; padding:5px 7px; border-radius:5px; color:#991b1b; background:#fee2e2; font-size:9px; font-weight:800; text-overflow:ellipsis; white-space:nowrap; }
.item-autocomplete-copy { min-width:0; }.item-autocomplete-copy strong,.item-autocomplete-copy small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.item-autocomplete-copy strong { font-size:12px; }.item-autocomplete-copy small { margin-top:3px; color:var(--mtg-muted); font-size:9px; }
.item-autocomplete-empty { padding:18px 12px; color:var(--mtg-muted); font-size:11px; text-align:center; }
.goods-image-preview { display:grid; grid-template-columns:112px minmax(0,1fr); align-items:center; gap:14px; margin:12px 0 0; padding:12px; border:1px solid var(--mtg-border); border-radius:11px; background:#fafafa; }
.goods-image-preview img { width:112px; height:92px; object-fit:cover; border-radius:8px; border:1px solid #d4d4d4; background:#fff; }
.goods-image-preview figcaption { min-width:0; }.goods-image-preview strong,.goods-image-preview span { display:block; }.goods-image-preview strong { overflow:hidden; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }.goods-image-preview span { margin-top:5px; color:var(--mtg-muted); font-size:10px; line-height:1.55; }
.invoice-lines-shell { min-height:365px; }
.invoice-empty-lines { min-height:340px; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:7px; padding:32px; color:var(--mtg-muted); text-align:center; }.invoice-empty-lines .app-icon { width:34px; height:34px; margin-bottom:4px; color:#b91c1c; }.invoice-empty-lines strong { color:#404040; font-size:13px; }.invoice-empty-lines span { max-width:330px; font-size:10px; line-height:1.6; }
.invoice-summary { position:sticky; top:calc(var(--mtg-topbar) + 20px); padding-bottom:0; }
.invoice-panel-heading { background:#fafafa; }
.invoice-side-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; padding:16px; }.invoice-side-form .full { grid-column:1/-1; }
.invoice-summary-block { border-top:8px solid var(--mtg-bg); }
.invoice-summary dl { margin:0; padding:10px 16px; }
.invoice-summary dl div { display:flex; justify-content:space-between; gap:14px; padding:9px 0; border-bottom:1px solid var(--mtg-border); }
.invoice-summary .summary-total { padding-top:16px; font-size:15px; font-weight:850; }
.invoice-summary>.form-field { margin:8px 16px 16px; }
.invoice-remark { padding-top:2px; }
.invoice-side-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; padding:14px 16px 16px; border-top:1px solid var(--mtg-border); background:#fafafa; }.invoice-side-actions .btn { min-width:0; }
.full-button { width:calc(100% - 32px); margin:8px 16px 0; }
.line-input { width:110px; min-height:38px; padding:6px 8px; border:1px solid #d4d4d4; border-radius:7px; }
.invoice-lines small { display:block; color:var(--mtg-muted); }
.app-dialog.quantity-dialog { top:50%; right:auto; left:50%; width:min(430px,calc(100% - 32px)); height:auto; max-height:calc(100dvh - 32px); grid-template-rows:auto auto; overflow:hidden; border:1px solid var(--mtg-border); border-radius:16px; box-shadow:0 28px 70px rgba(17,17,17,.26); transform:translate(-50%,-50%); animation:quantity-dialog-in .16s ease-out; }
.quantity-dialog > header { min-height:62px; padding:0 20px; }.quantity-dialog > header h2 { font-size:17px; }.quantity-dialog .dialog-body { padding:20px; overflow-y:auto; }
.quantity-dialog-form { display:grid; gap:15px; }.quantity-item-summary { display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:12px; padding:13px; border:1px solid #fecaca; border-radius:11px; background:#fff7f7; }.quantity-item-summary>span { min-width:54px; padding:6px 8px; border-radius:6px; color:#991b1b; background:#fee2e2; font-size:10px; font-weight:850; text-align:center; }.quantity-item-summary div { min-width:0; }.quantity-item-summary strong,.quantity-item-summary small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.quantity-item-summary strong { font-size:13px; }.quantity-item-summary small { margin-top:4px; color:var(--mtg-muted); font-size:9px; }
.quantity-stepper { display:grid; grid-template-columns:54px minmax(0,1fr) 54px; overflow:hidden; border:1px solid #d4d4d4; border-radius:11px; background:white; }.quantity-stepper button { min-height:54px; border:0; color:var(--mtg-red); background:#fafafa; font-size:24px; cursor:pointer; }.quantity-stepper button:hover { background:#fee2e2; }.quantity-stepper input { min-width:0; border:0; border-inline:1px solid #e5e7eb; color:#171717; background:white; font-size:22px; font-weight:850; text-align:center; outline:0; }.quantity-stepper input:focus { box-shadow:inset 0 0 0 2px var(--mtg-red); }
.quantity-total-preview { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:12px 0; border-top:1px solid var(--mtg-border); border-bottom:1px solid var(--mtg-border); }.quantity-total-preview span { color:var(--mtg-muted); font-size:10px; }.quantity-total-preview strong { color:var(--mtg-red); font-size:16px; }.quantity-enter-hint { margin:-5px 0 0; color:var(--mtg-muted); font-size:9px; text-align:center; }.quantity-error { margin:-7px 0 0; color:#b91c1c; font-size:10px; font-weight:700; }.quantity-dialog-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:2px; }.quantity-dialog-actions .btn { min-width:0; }
@keyframes quantity-dialog-in { from { opacity:0; transform:translate(-50%,-47%) scale(.97); } to { opacity:1; transform:translate(-50%,-50%) scale(1); } }
.invoice-list-actions { display:flex; align-items:center; justify-content:flex-end; gap:6px; }
.invoice-detail-shell { width:min(820px,100%); }
.invoice-detail-shell .dialog-body { padding:20px; background:#f3f4f6; }
.invoice-detail-actions { grid-column:1/-1; display:flex; justify-content:flex-end; gap:10px; }
.invoice-detail-actions .btn { min-width:110px; }
.invoice-print-sheet { max-width:760px; margin:0 auto; padding:30px; color:#171717; border:1px solid #e5e7eb; border-radius:8px; background:#fff; font-size:12px; }
.invoice-print-heading { display:flex; justify-content:space-between; gap:28px; padding-bottom:22px; border-bottom:2px solid #111; }
.invoice-print-brand { color:var(--mtg-red); font-size:10px; font-weight:900; letter-spacing:.13em; }
.invoice-print-heading h1 { margin:4px 0; font-size:31px; letter-spacing:.08em; }
.invoice-print-heading p { margin:0; color:var(--mtg-muted); }
.invoice-print-heading dl { min-width:235px; margin:0; }
.invoice-print-heading dl div { display:flex; justify-content:space-between; gap:16px; padding:4px 0; border-bottom:1px solid #eee; }
.invoice-print-heading dt { color:var(--mtg-muted); }
.invoice-print-heading dd { margin:0; font-weight:750; text-align:right; }
.invoice-print-sheet h2 { margin:0 0 10px; font-size:13px; text-transform:uppercase; letter-spacing:.04em; }
.invoice-customer-block,.invoice-detail-lines,.invoice-receipt-history { margin-top:22px; }
.invoice-customer-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px 24px; }
.invoice-customer-grid p { display:grid; grid-template-columns:70px 1fr; gap:8px; margin:0; }
.invoice-customer-grid span,.invoice-remark span { color:var(--mtg-muted); }
.invoice-detail-lines { overflow-x:auto; }
.invoice-detail-lines table { width:100%; border-collapse:collapse; }
.invoice-detail-lines th { padding:9px 7px; color:#fff; background:#111; font-size:10px; text-align:right; }
.invoice-detail-lines th:nth-child(1),.invoice-detail-lines th:nth-child(2),.invoice-detail-lines th:nth-child(3) { text-align:left; }
.invoice-detail-lines td { padding:9px 7px; border-bottom:1px solid #e5e7eb; text-align:right; vertical-align:top; }
.invoice-detail-lines td:nth-child(1),.invoice-detail-lines td:nth-child(2),.invoice-detail-lines td:nth-child(3) { text-align:left; }
.invoice-detail-lines small { display:block; margin-top:3px; color:var(--mtg-muted); }
.invoice-print-summary { display:grid; grid-template-columns:1fr 285px; gap:24px; margin-top:22px; }
.invoice-remark { padding:13px; background:#f5f5f5; }
.invoice-remark p { margin:5px 0 0; }
.invoice-print-summary dl { margin:0; }
.invoice-print-summary dl div { display:flex; justify-content:space-between; gap:18px; padding:7px 0; border-bottom:1px solid #e5e7eb; }
.invoice-print-summary dd { margin:0; font-weight:750; text-align:right; }
.invoice-print-summary .invoice-grand-total { padding:11px 9px; color:#fff; border:0; background:#111; }
.invoice-print-summary .invoice-balance { color:var(--mtg-red); font-size:14px; }
.invoice-receipt-history > div { display:flex; justify-content:space-between; gap:15px; padding:7px 0; border-bottom:1px solid #e5e7eb; }
.invoice-print-footer { display:flex; justify-content:space-between; margin-top:34px; padding-top:12px; color:var(--mtg-muted); border-top:1px solid #d4d4d4; font-size:10px; }
.permission-layout { display:grid; grid-template-columns:240px minmax(0,1fr); gap:14px; }
.role-button { width:100%; min-height:48px; padding:10px 16px; border:0; border-bottom:1px solid var(--mtg-border); background:white; text-align:left; }
.role-button.active { color:white; background:var(--mtg-red); }
.permission-actions { display:flex; flex-wrap:wrap; gap:10px 16px; }
.permission-actions label { min-height:40px; display:inline-flex; align-items:center; gap:7px; font-size:12px; }
.pagination-bar { display:flex; align-items:center; justify-content:flex-end; gap:10px; padding:12px 16px; border-top:1px solid var(--mtg-border); font-size:12px; }
.responsive-list { display:grid; gap:10px; }
.error-state { color:#991b1b; }
.toast-host { position:fixed; z-index:90; right:20px; bottom:20px; max-width:min(390px,calc(100vw - 28px)); display:flex; align-items:center; gap:14px; padding:13px 15px; border-radius:10px; color:white; box-shadow:var(--mtg-shadow); font-size:12px; font-weight:700; }
.toast-success { background:#166534; }.toast-error { background:#991b1b; }.toast-host button { margin-left:auto; border:0; color:inherit; background:transparent; font-size:20px; }

.state-panel { min-height: 220px; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 30px; color: var(--mtg-muted); border: 1px solid var(--mtg-border); border-radius: var(--mtg-radius); background: white; text-align: center; }
.state-panel.empty { flex-direction: column; }
.state-panel.empty .app-icon { width: 34px; height: 34px; color: var(--mtg-red); }
.state-panel.empty strong { color: var(--mtg-text); }
.status-badge { display: inline-flex; align-items: center; min-height: 26px; padding: 4px 9px; border-radius: 999px; background: #e5e7eb; color: #3f3f46; font-size: 10px; font-weight: 800; }
.status-accepted, .status-posted, .status-in, .status-unlocked, .status-connected { color: #166534; background: #dcfce7; }
.status-canceled, .status-out, .status-locked, .status-disconnected { color: #991b1b; background: #fee2e2; }
.status-requested, .status-transferring, .status-drafted, .status-reconnecting { color: #92400e; background: #fef3c7; }

.auth-stage { min-height: 100vh; background: white; }
.db-setup-page { position: relative; min-height: 100dvh; overflow: hidden; padding: 28px clamp(28px,5vw,76px) 36px; color: #fafafa; background: #0b0b0c; }
.db-setup-glow { position: absolute; z-index: 0; top: 28%; left: 50%; width: min(720px,72vw); height: 360px; transform: translateX(-50%); border-radius: 50%; background: radial-gradient(circle,rgba(185,28,28,.24) 0,rgba(127,29,29,.08) 36%,transparent 72%); filter: blur(28px); pointer-events: none; }
.db-setup-brand { position: relative; z-index: 1; display: flex; align-items: center; gap: 12px; width: fit-content; }
.db-setup-brand img { width: 48px; height: 48px; object-fit: contain; border: 1px solid #3f3f46; border-radius: 11px; background: white; }
.db-setup-brand span { display: flex; flex-direction: column; line-height: 1; }
.db-setup-brand strong { color: #ef3038; font-size: 24px; font-weight: 900; letter-spacing: .02em; }
.db-setup-brand small { margin-top: 5px; color: #e5e5e5; font-size: 8px; font-weight: 800; letter-spacing: .22em; }
.db-setup-content { position: relative; z-index: 1; width: min(960px,100%); margin: clamp(64px,8vh,104px) auto 0; }
.db-setup-heading h1 { max-width: 960px; margin: 0; color: #fff; font-size: clamp(42px,4.25vw,58px); font-weight: 780; line-height: 1.3; letter-spacing: -.035em; }
.db-setup-heading p { max-width: 720px; margin: 22px 0 0; color: #a3a3a3; font-size: clamp(14px,1.25vw,17px); line-height: 1.8; }
.db-progress-block { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px; margin: clamp(42px,6vh,64px) 0 34px; }
.db-progress-track { position: relative; height: 4px; overflow: visible; border-radius: 999px; background: #303033; }
.db-progress-fill { position: absolute; inset: 0 auto 0 0; max-width: 100%; border-radius: inherit; background: #ef3038; transition: width .5s cubic-bezier(.22,1,.36,1); }
.db-progress-pulse { position: absolute; top: -5px; width: 14px; height: 14px; border: 3px solid #fff; border-radius: 50%; background: #ef3038; box-shadow: 0 0 0 7px rgba(239,48,56,.12),0 0 28px rgba(239,48,56,.8); animation: db-pulse 1.7s ease-in-out infinite; transition: left .5s cubic-bezier(.22,1,.36,1); }
.db-progress-value { min-width: 44px; color: #d4d4d4; font-size: 12px; font-variant-numeric: tabular-nums; text-align: right; }
.db-setup-steps { margin: 0; padding: 0; list-style: none; border-bottom: 1px solid #262628; }
.db-setup-steps li { min-height: 76px; display: grid; grid-template-columns: 48px minmax(0,1fr) 24px; align-items: center; gap: 18px; padding: 10px 0; color: #66666b; transition: color .25s ease; }
.db-step-number { width: 43px; height: 43px; display: grid; place-items: center; border: 2px solid #4b4b50; border-radius: 50%; color: #a3a3a3; font-size: 14px; font-weight: 750; transition: all .25s ease; }
.db-setup-steps strong { display: block; color: #a3a3a3; font-size: 16px; font-weight: 720; line-height: 1.55; transition: color .25s ease; }
.db-setup-steps small { display: block; margin-top: 3px; color: #7a7a80; font-size: 11px; line-height: 1.6; }
.db-step-state { width: 18px; height: 18px; justify-self: end; border: 2px solid #55555a; border-radius: 50%; }
.db-setup-steps li.is-active strong { color: #fff; }
.db-setup-steps li.is-active .db-step-number { color: #fff; border-color: #ef3038; box-shadow: 0 0 22px rgba(239,48,56,.2); }
.db-setup-steps li.is-active .db-step-state { border: 3px dotted #ef3038; animation: db-spin 1.2s linear infinite; }
.db-setup-steps li.is-complete strong { color: #e5e5e5; }
.db-setup-steps li.is-complete .db-step-number { color: #4ade80; border-color: #22c55e; }
.db-setup-steps li.is-complete .db-step-state { border-color: #22c55e; background: #22c55e; box-shadow: inset 0 0 0 4px #0b0b0c; }
.db-live-log { margin-top: 28px; overflow: hidden; border: 1px solid #303036; border-radius: 14px; background: rgba(17,17,19,.92); box-shadow: 0 18px 55px rgba(0,0,0,.24); }
.db-live-log > header { min-height: 54px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 14px 10px 18px; border-bottom: 1px solid #29292e; background: rgba(30,30,33,.82); }
.db-live-log > header > div { min-width: 0; display: flex; align-items: center; gap: 9px; }
.db-live-log > header strong { color: #f5f5f5; font-size: 12px; letter-spacing: .02em; }
.db-live-log > header small { color: #71717a; font-size: 10px; font-variant-numeric: tabular-nums; }
.db-live-indicator { width: 8px; height: 8px; flex: 0 0 auto; border-radius: 50%; background: #ef3038; box-shadow: 0 0 0 5px rgba(239,48,56,.1),0 0 16px rgba(239,48,56,.5); animation: db-log-pulse 1.8s ease-in-out infinite; }
.db-copy-button { min-height: 34px; display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; gap: 7px; padding: 7px 11px; border: 1px solid #45454d; border-radius: 8px; color: #d4d4d8; background: #242428; font-size: 10px; font-weight: 750; cursor: pointer; }
.db-copy-button:hover { color: #fff; border-color: #ef3038; background: rgba(185,28,28,.16); }
.db-copy-button:disabled { opacity: .45; cursor: default; }
.db-copy-button svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.db-live-log-body { height: clamp(180px,24vh,260px); overflow: auto; padding: 10px 0; color: #c8c8cf; background: linear-gradient(180deg,rgba(8,8,9,.98),rgba(15,15,17,.98)); scrollbar-color: #4a4a50 #151517; }
.db-live-log-empty { margin: 0; padding: 16px 18px; color: #66666e; font: 11px/1.7 Consolas,"Cascadia Mono",monospace; }
.db-log-row { display: grid; grid-template-columns: 66px 58px minmax(0,1fr); gap: 10px; padding: 5px 18px; border-left: 2px solid transparent; font: 10.5px/1.55 Consolas,"Cascadia Mono",monospace; }
.db-log-row:hover { background: rgba(255,255,255,.025); }
.db-log-row time { color: #62626a; font-variant-numeric: tabular-nums; }
.db-log-level { color: #8d8d96; font-weight: 800; }
.db-log-message { min-width: 0; color: #bdbdc5; overflow-wrap: anywhere; }
.db-log-row.is-success { border-left-color: #22c55e; }
.db-log-row.is-success .db-log-level { color: #4ade80; }
.db-log-row.is-warning { border-left-color: #f59e0b; }
.db-log-row.is-warning .db-log-level { color: #fbbf24; }
.db-log-row.is-error { border-left-color: #ef3038; background: rgba(127,29,29,.08); }
.db-log-row.is-error .db-log-level,.db-log-row.is-error .db-log-message { color: #ff686e; }
.db-setup-error { display: grid; grid-template-columns: 34px minmax(0,1fr) auto; align-items: start; gap: 14px; margin-top: 28px; padding: 20px; border: 1px solid rgba(239,48,56,.7); border-radius: 12px; background: rgba(127,29,29,.08); }
.db-error-mark { width: 28px; height: 28px; display: grid; place-items: center; border: 2px solid #ef3038; border-radius: 50%; color: #ef3038; font-weight: 850; }
.db-setup-error strong { display: block; color: #ff4d54; font-size: 14px; }
.db-setup-error p { margin: 7px 0 0; color: #a3a3a3; font-size: 11px; line-height: 1.7; overflow-wrap: anywhere; }
.db-retry-button { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 9px 15px; border: 1px solid #ef3038; border-radius: 8px; color: #fff; background: transparent; font-size: 12px; font-weight: 750; cursor: pointer; }
.db-retry-button:hover { background: rgba(239,48,56,.12); }
.db-retry-button:disabled { opacity: .6; cursor: wait; }
.db-retry-button svg { width: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.db-setup-complete { min-height: 64px; display: flex; align-items: center; gap: 14px; color: #4ade80; }
.db-setup-complete span { width: 38px; height: 38px; display: grid; place-items: center; border: 2px solid #22c55e; border-radius: 50%; font-size: 20px; }
.db-setup-complete strong { font-size: 17px; }
.db-setup-footnote { margin: 34px 0 0; color: #5d5d62; font-size: 10px; text-align: center; }
.db-setup-redirect { min-height: 100dvh; display: grid; place-items: center; color: #a3a3a3; background: #0b0b0c; }
@keyframes db-spin { to { transform: rotate(360deg); } }
@keyframes db-pulse { 50% { box-shadow: 0 0 0 12px rgba(239,48,56,0),0 0 34px rgba(239,48,56,.95); } }
@keyframes db-log-pulse { 50% { opacity:.5; box-shadow:0 0 0 8px rgba(239,48,56,0),0 0 20px rgba(239,48,56,.75); } }
.login-page { min-height: 100vh; display: grid; grid-template-columns: minmax(320px, .9fr) minmax(430px, 1.1fr); }
.login-brand-panel { display: grid; place-items: center; padding: 48px; color: white; background: var(--mtg-black); }
.login-brand-inner { max-width: 420px; }
.login-brand-inner img { width: 104px; height: 104px; object-fit: contain; border: 1px solid #525252; border-radius: 18px; background: white; }
.login-brand-inner h1 { margin: 26px 0 9px; font-size: clamp(32px,4vw,54px); font-weight: 850; }
.login-brand-inner p { margin: 0; color: #a3a3a3; font-size: 15px; }
.login-form-panel { display: grid; place-items: center; padding: 34px; background: var(--mtg-bg); }
.login-card { width: min(430px,100%); padding: 36px; border: 1px solid var(--mtg-border); border-radius: 16px; background: white; box-shadow: var(--mtg-shadow); }
.login-card header { margin-bottom: 26px; }
.login-card h2 { margin: 0 0 8px; font-size: 27px; font-weight: 800; }
.login-card header p { margin: 0; color: var(--mtg-muted); font-size: 12px; line-height: 1.7; }
.login-card .form-label:not(:first-of-type) { margin-top: 18px; }
.login-submit { width: 100%; margin-top: 24px; }
.login-card > small { display: block; margin-top: 18px; color: #a1a1aa; text-align: center; font-size: 10px; }
.field-error { display:block; margin-top:5px; color:var(--mtg-red); font-size:11px; }
.report-toolbar .app-select { min-width:200px; }
.daily-report-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:18px; align-items:start; }
.report-column .section-heading { padding:16px 18px; }
.report-column .section-heading h2 { margin:0; font-size:20px; }
.report-panel-total { justify-content:flex-end; text-align:right; }
.report-panel-total span { color:var(--mtg-muted); }
.report-panel-total strong { min-width:140px; color:var(--mtg-text); font-size:15px; }
.daily-difference-summary { display:flex; justify-content:flex-end; align-items:center; gap:28px; width:fit-content; min-width:360px; margin:18px 0 0 auto; padding:16px 20px; border:1px solid var(--mtg-border); border-radius:var(--mtg-radius); background:white; box-shadow:var(--mtg-shadow); text-align:right; }
.daily-difference-summary > div { display:flex; flex-direction:column; gap:3px; }
.daily-difference-summary span { color:var(--mtg-muted); font-size:12px; font-weight:700; }
.daily-difference-summary small { color:var(--mtg-muted); font-size:10px; }
.daily-difference-summary strong { color:var(--mtg-red); font-size:22px; }
.daily-difference-summary.negative strong { color:#991b1b; }
.preset-chips { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 12px; }
.filter-chip { min-height:44px; padding:0 17px; border:1px solid var(--mtg-border); border-radius:999px; color:var(--mtg-text); background:white; font-weight:700; }
.filter-chip.active { color:white; border-color:var(--mtg-red); background:var(--mtg-red); }
.cashbook-groups { display:grid; gap:18px; }
.cashbook-category { overflow:hidden; border:1px solid var(--mtg-border); border-radius:var(--mtg-radius); background:#ededed; }
.cashbook-category > header { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:15px 18px; color:white; background:var(--mtg-black); }
.cashbook-category > header h2 { margin:0; font-size:20px; }
.cashbook-category > header span { color:#fca5a5; font-weight:800; }
.cashbook-subcategory { margin:12px; }
.cashbook-subcategory .section-heading { padding:13px 16px; }
.cashbook-subcategory h3 { margin:0; font-size:16px; }
.report-totals { display:flex; flex-wrap:wrap; gap:12px; font-size:12px; }
.report-totals strong { color:var(--mtg-red); }
.grand-total-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:18px; }
.grand-total-grid > div { display:flex; flex-direction:column; gap:6px; padding:18px; border:1px solid var(--mtg-border); border-radius:var(--mtg-radius); background:white; }
.grand-total-grid span { color:var(--mtg-muted); font-size:12px; }
.grand-total-grid strong { font-size:20px; }
.grand-total-grid .net { color:white; border-color:var(--mtg-red); background:var(--mtg-red); }
.grand-total-grid .net span { color:#fee2e2; }
.development-reset-panel { overflow:hidden; border:1px solid #fecaca; border-radius:18px; background:#fff; box-shadow:var(--mtg-shadow); }
.development-reset-hero { display:flex; align-items:flex-start; gap:18px; padding:26px; color:#fff; background:linear-gradient(135deg,#111 0%,#171717 58%,#7f1d1d 100%); }
.development-danger-mark { flex:0 0 auto; width:48px; height:48px; display:grid; place-items:center; border:2px solid #ef4444; border-radius:50%; color:#fff; background:#b91c1c; font-size:28px; font-weight:900; box-shadow:0 0 0 7px rgba(185,28,28,.24); }
.development-label { display:inline-block; margin-bottom:8px; color:#fca5a5; font-size:10px; font-weight:850; letter-spacing:.14em; }
.development-reset-hero h2 { margin:0; font-size:clamp(21px,2.2vw,30px); line-height:1.45; }
.development-reset-hero p { max-width:720px; margin:8px 0 0; color:#d4d4d4; font-size:12px; line-height:1.8; }
.development-reset-boundaries { display:grid; grid-template-columns:1fr 1fr; gap:16px; padding:22px; background:#fafafa; }
.development-reset-boundaries article { padding:20px; border:1px solid #fecaca; border-radius:13px; background:#fff7f7; }
.development-reset-boundaries .preserved-data-card { border-color:#bbf7d0; background:#f0fdf4; }
.development-reset-boundaries h3 { margin:0 0 12px; color:#991b1b; font-size:15px; }
.development-reset-boundaries .preserved-data-card h3 { color:#166534; }
.development-reset-boundaries ul { margin:0; padding-left:20px; color:#525252; font-size:12px; line-height:1.9; }
.development-confirmation { display:grid; gap:18px; padding:24px; border-top:1px solid var(--mtg-border); }
.development-acknowledgement { display:flex; align-items:flex-start; gap:11px; color:var(--mtg-text); font-size:12px; line-height:1.75; cursor:pointer; }
.development-acknowledgement input { flex:0 0 auto; width:19px; height:19px; margin-top:2px; accent-color:var(--mtg-red); }
.development-confirmation code { display:block; width:fit-content; margin:0 0 8px; padding:6px 9px; border-radius:6px; color:#991b1b; background:#fee2e2; font-size:12px; font-weight:800; }
.development-confirm-input { max-width:460px; font-family:ui-monospace,SFMono-Regular,Consolas,monospace; letter-spacing:.03em; }
.development-clear-button { min-height:48px; width:fit-content; padding:0 22px; border:1px solid #991b1b; color:#fff; background:#b91c1c; font-weight:800; }
.development-clear-button:hover:not(:disabled) { background:#7f1d1d; }
.development-clear-button:disabled { opacity:.42; cursor:not-allowed; }
.development-reset-result { margin-top:18px; padding:20px; border:1px solid #bbf7d0; border-radius:14px; background:#f0fdf4; }
.development-reset-result > div { display:flex; align-items:flex-start; gap:13px; }
.development-success-mark { width:34px; height:34px; display:grid; flex:0 0 auto; place-items:center; border-radius:50%; color:#fff; background:#15803d; font-size:18px; font-weight:900; }
.development-reset-result strong { color:#14532d; }
.development-reset-result p { margin:4px 0 0; color:#3f6212; font-size:12px; }
.development-reset-result details { margin-top:16px; color:#166534; font-size:12px; }
.development-reset-result summary { cursor:pointer; font-weight:750; }
.development-reset-result dl { display:grid; gap:7px; margin:12px 0 0 47px; }
.development-reset-result dl div { display:flex; justify-content:space-between; gap:20px; max-width:520px; padding-bottom:6px; border-bottom:1px solid #dcfce7; }
.development-reset-result dt,.development-reset-result dd { margin:0; }
.signalr-summary-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:16px; }
.signalr-summary-grid article { position:relative; overflow:hidden; display:flex; flex-direction:column; gap:6px; padding:20px; border:1px solid var(--mtg-border); border-radius:var(--mtg-radius); background:#fff; box-shadow:var(--mtg-shadow); }
.signalr-summary-grid article::before { content:""; position:absolute; inset:0 auto 0 0; width:4px; background:var(--mtg-red); }
.signalr-summary-grid article.warning::before { background:#d97706; }
.signalr-summary-grid span { color:var(--mtg-muted); font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.signalr-summary-grid strong { color:var(--mtg-black); font-size:30px; line-height:1; }
.signalr-summary-grid small { color:#737373; font-size:10px; }
.signalr-filters .filter-toolbar-fields { display:grid; grid-template-columns:minmax(210px,1.6fr) repeat(3,minmax(140px,1fr)); align-items:end; }
.signalr-filters .filter-field { margin:0; }
.signalr-refresh { white-space:nowrap; }
.signalr-live-note { display:flex; align-items:center; gap:8px; margin:14px 2px; color:var(--mtg-muted); font-size:11px; }
.signalr-live-note strong { color:#15803d; text-transform:uppercase; letter-spacing:.08em; }
.signalr-live-note time { margin-left:auto; }
.signalr-live-dot { width:9px; height:9px; border-radius:50%; background:#22c55e; box-shadow:0 0 0 5px rgba(34,197,94,.13); }
.signalr-account-list { display:grid; gap:16px; }
.signalr-account-card { overflow:hidden; border:1px solid var(--mtg-border); border-radius:var(--mtg-radius); background:#fff; box-shadow:var(--mtg-shadow); }
.signalr-account-card > header { display:grid; grid-template-columns:48px minmax(0,1fr) auto; align-items:center; gap:14px; padding:18px 20px; color:#fff; background:linear-gradient(115deg,#111 0%,#171717 68%,#7f1d1d 100%); }
.signalr-avatar { width:48px; height:48px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.22); border-radius:14px; color:#fff; background:rgba(185,28,28,.72); font-size:20px; font-weight:850; }
.signalr-account-identity > div { display:flex; align-items:center; flex-wrap:wrap; gap:9px; }
.signalr-account-identity h2 { margin:0; font-size:17px; }
.signalr-account-identity p { margin:4px 0 0; color:#bdbdbd; font-size:11px; }
.signalr-anonymous-badge { padding:3px 7px; border:1px solid #525252; border-radius:999px; color:#d4d4d4; font-size:9px; font-weight:800; text-transform:uppercase; }
.signalr-account-meta { display:flex; align-items:flex-end; flex-direction:column; gap:3px; color:#d4d4d4; font-size:10px; }
.signalr-account-meta strong { margin-top:3px; color:#fca5a5; }
.signalr-device-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr)); gap:12px; padding:14px; background:#f5f5f5; }
.signalr-device-card { position:relative; padding:16px; border:1px solid var(--mtg-border); border-radius:13px; background:#fff; }
.signalr-device-card.current { border-color:#ef4444; box-shadow:inset 0 0 0 1px #ef4444; }
.signalr-device-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding-bottom:13px; border-bottom:1px solid #ededed; }
.signalr-device-heading > div { display:flex; flex-direction:column; gap:3px; min-width:0; }
.signalr-device-heading strong { color:var(--mtg-black); font-size:14px; }
.signalr-device-heading span { overflow:hidden; color:var(--mtg-muted); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.signalr-device-card dl { display:grid; grid-template-columns:1fr 1fr; gap:12px 18px; margin:14px 0 0; }
.signalr-device-card dl div { min-width:0; padding:10px; border:1px solid #ededed; border-radius:9px; background:#fafafa; }
.signalr-device-card dt { margin-bottom:3px; color:var(--mtg-muted); font-size:9px; font-weight:750; text-transform:uppercase; }
.signalr-device-card dd { overflow:hidden; margin:0; color:var(--mtg-text); font-size:11px; font-weight:650; text-overflow:ellipsis; white-space:nowrap; }
.signalr-device-badges { display:flex; align-items:center; flex-wrap:wrap; justify-content:flex-end; gap:6px; }
.signalr-current-device { padding:5px 8px; border-radius:999px; color:#991b1b; background:#fee2e2; font-size:9px; font-weight:800; white-space:nowrap; }
.receivable-summary-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.receivable-summary-grid article { position:relative; overflow:hidden; min-height:116px; display:flex; flex-direction:column; justify-content:center; gap:8px; padding:18px 20px; border:1px solid var(--mtg-border); border-radius:13px; background:#fff; box-shadow:var(--mtg-shadow); }
.receivable-summary-grid article::before { content:""; position:absolute; inset:0 auto 0 0; width:4px; background:var(--mtg-red); }.receivable-summary-grid article:nth-child(2)::before,.receivable-summary-grid article:nth-child(3)::before { background:#262626; }
.receivable-summary-grid span { color:var(--mtg-muted); font-size:10px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }.receivable-summary-grid strong { color:var(--mtg-black); font-size:clamp(20px,2vw,28px); line-height:1.1; }.receivable-summary-grid strong small { color:var(--mtg-muted); font-size:9px; }.receivable-summary-grid article>small { color:var(--mtg-muted); font-size:9px; }
.receivable-customer-list { display:grid; gap:12px; }
.receivable-customer-card { overflow:hidden; border:1px solid var(--mtg-border); border-radius:13px; background:#fff; box-shadow:0 3px 14px rgba(17,17,17,.04); }
.receivable-customer-header { width:100%; min-height:86px; display:grid; grid-template-columns:minmax(220px,1.4fr) repeat(3,minmax(120px,.65fr)) 22px; align-items:center; gap:16px; padding:15px 18px; border:0; color:var(--mtg-text); background:#fff; font:inherit; text-align:left; cursor:pointer; }
.receivable-customer-header:hover { background:#fffafa; }.receivable-customer-header>span { min-width:0; display:flex; flex-direction:column; gap:4px; }.receivable-customer-header small { color:var(--mtg-muted); font-size:9px; font-weight:750; text-transform:uppercase; }.receivable-customer-header strong { overflow:hidden; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.receivable-customer-identity>strong { font-size:16px; font-weight:850; }.receivable-customer-identity>small { font-size:11px; text-transform:none; }
.receivable-customer-identity>.receivable-customer-phone { color:var(--mtg-text-secondary); font-size:12px; font-weight:650; letter-spacing:.01em; }
.receivable-balance { color:var(--mtg-red); font-weight:850; }.receivable-chevron { width:17px; transition:transform .16s ease; }.receivable-chevron.open { transform:rotate(90deg); }
.receivable-invoice-table { border-top:1px solid var(--mtg-border); background:#fafafa; }.receivable-invoice-table .data-table { background:#fff; }.receivable-invoice-table footer { display:flex; justify-content:flex-end; gap:18px; padding:13px 18px; color:var(--mtg-muted); font-size:11px; }.receivable-invoice-table footer strong { color:var(--mtg-red); }
.nav-links .nav-link > .app-icon { flex:0 0 auto; width:16px; height:16px; opacity:.72; }.nav-links .nav-link.active > .app-icon { opacity:1; }
.dashboard-command-bar { display:grid; grid-template-columns:minmax(180px,1fr) auto auto auto; align-items:end; gap:12px; margin-bottom:16px; padding:12px; border:1px solid var(--mtg-border); border-radius:var(--mtg-radius); background:#fff; box-shadow:var(--mtg-shadow); }
.dashboard-command-bar .form-field { margin:0; }
.dashboard-command-bar .form-field > span { display:block; margin-bottom:5px; color:var(--mtg-muted); font-size:9px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.dashboard-command-bar select,.dashboard-command-bar input { min-height:42px; width:100%; border:1px solid var(--mtg-border); border-radius:9px; color:var(--mtg-text); background:#fff; font:inherit; font-size:11px; padding:0 11px; }
.dashboard-date-range { display:grid; grid-template-columns:135px 16px 135px; align-items:end; gap:6px; }
.dashboard-date-arrow { padding-bottom:13px; color:var(--mtg-muted); font-size:14px; text-align:center; }
.dashboard-presets { display:flex; overflow:hidden; min-height:42px; border:1px solid var(--mtg-border); border-radius:9px; }
.dashboard-presets button { min-height:42px; padding:0 13px; border:0; border-right:1px solid var(--mtg-border); color:#525252; background:#fff; font:inherit; font-size:10px; font-weight:750; white-space:nowrap; cursor:pointer; }
.dashboard-presets button:last-child { border-right:0; }
.dashboard-presets button.active { color:#fff; background:var(--mtg-red); }
.dashboard-refresh { min-height:42px; }
.dashboard-kpi-grid { display:grid; grid-template-columns:repeat(5,minmax(165px,1fr)); gap:12px; margin-bottom:16px; }
.dashboard-kpi { position:relative; overflow:hidden; display:grid; grid-template-columns:42px minmax(0,1fr); gap:12px; min-height:126px; padding:17px; border:1px solid var(--mtg-border); border-radius:13px; background:#fff; box-shadow:var(--mtg-shadow); }
.dashboard-kpi::after { content:""; position:absolute; inset:auto 0 0; height:3px; background:#262626; }
.dashboard-kpi.income::after,.dashboard-kpi.positive::after { background:#15803d; }
.dashboard-kpi.expense::after,.dashboard-kpi.negative::after,.dashboard-kpi.outstanding::after { background:var(--mtg-red); }
.dashboard-kpi-icon { width:42px; height:42px; display:grid; place-items:center; border-radius:50%; color:#fff; background:#171717; }
.dashboard-kpi.income .dashboard-kpi-icon,.dashboard-kpi.positive .dashboard-kpi-icon { background:#15803d; }
.dashboard-kpi.expense .dashboard-kpi-icon,.dashboard-kpi.negative .dashboard-kpi-icon,.dashboard-kpi.outstanding .dashboard-kpi-icon { background:var(--mtg-red); }
.dashboard-kpi-icon .app-icon { width:21px; height:21px; }
.dashboard-kpi > div { min-width:0; }
.dashboard-kpi > div > span { display:block; overflow:hidden; color:#525252; font-size:10px; font-weight:750; text-overflow:ellipsis; white-space:nowrap; }
.dashboard-kpi strong { display:block; overflow:hidden; margin-top:8px; color:var(--mtg-black); font-size:clamp(16px,1.45vw,22px); line-height:1.1; text-overflow:ellipsis; white-space:nowrap; }
.dashboard-kpi.income strong,.dashboard-kpi.positive strong { color:#15803d; }
.dashboard-kpi.expense strong,.dashboard-kpi.negative strong,.dashboard-kpi.outstanding strong { color:var(--mtg-red); }
.dashboard-kpi small { display:block; overflow:hidden; margin-top:7px; color:var(--mtg-muted); font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.dashboard-kpi > em { position:absolute; right:15px; bottom:10px; color:#a3a3a3; font-size:8px; font-style:normal; font-weight:800; }
.dashboard-chart-grid { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(330px,1fr); gap:14px; margin-bottom:18px; }
.dashboard-panel { overflow:hidden; border:1px solid var(--mtg-border); border-radius:var(--mtg-radius); background:#fff; box-shadow:var(--mtg-shadow); }
.dashboard-panel > header { min-height:66px; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px 16px; border-bottom:1px solid var(--mtg-border); }
.dashboard-panel > header h2,.dashboard-section-heading h2 { margin:0; color:var(--mtg-black); font-size:15px; }
.dashboard-panel > header p,.dashboard-section-heading p { margin:4px 0 0; color:var(--mtg-muted); font-size:9px; }
.dashboard-panel > header > span { color:var(--mtg-red); font-size:10px; font-weight:800; }
.dashboard-panel > header a,.dashboard-section-heading a { display:inline-flex; align-items:center; gap:5px; color:var(--mtg-red); font-size:10px; font-weight:800; text-decoration:none; white-space:nowrap; }
.dashboard-panel > header a .app-icon,.dashboard-section-heading a .app-icon { width:13px; height:13px; }
.dashboard-chart-shell { min-height:310px; display:grid; align-items:center; padding:10px 14px 5px; }
.dashboard-chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#525252; font-size:9px; }
.dashboard-chart-legend span { display:inline-flex; align-items:center; gap:5px; }
.dashboard-chart-legend i { width:17px; height:3px; border-radius:4px; background:#2563eb; }
.dashboard-chart-legend .income i { background:#15803d; }.dashboard-chart-legend .expense i { background:#dc2626; }
.dashboard-line-chart { width:100%; height:auto; overflow:visible; }
.chart-grid-line { stroke:#e5e5e5; stroke-width:1; stroke-dasharray:3 4; }.chart-zero-line { stroke:#a3a3a3; stroke-width:1; }
.chart-axis-label { fill:#737373; font-size:9px; font-family:inherit; }
.chart-series { fill:none; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }.chart-income { stroke:#15803d; }.chart-expense { stroke:#dc2626; }.chart-net { stroke:#2563eb; }
.chart-point { stroke:#fff; stroke-width:1.5; }.chart-income-point { fill:#15803d; }.chart-expense-point { fill:#dc2626; }.chart-net-point { fill:#2563eb; }
.dashboard-chart-empty { min-height:230px; display:grid; place-content:center; gap:6px; padding:25px; color:var(--mtg-muted); text-align:center; }
.dashboard-chart-empty strong { color:var(--mtg-text); font-size:13px; }.dashboard-chart-empty span { font-size:10px; }
.dashboard-donut-layout { min-height:310px; display:grid; grid-template-columns:minmax(170px,.85fr) minmax(170px,1fr); align-items:center; gap:8px; padding:14px; }
.dashboard-donut-wrap { min-width:0; }.dashboard-donut { display:block; width:100%; max-width:230px; margin:auto; }
.donut-track { fill:none; stroke:#ededed; stroke-width:28; }.donut-center-label { fill:#737373; font-size:9px; }.donut-center-value { fill:#171717; font-size:17px; font-weight:850; }.donut-center-unit { fill:#a3a3a3; font-size:8px; font-weight:700; }
.dashboard-donut-legend { display:grid; gap:9px; }.dashboard-donut-legend > div { display:grid; grid-template-columns:8px minmax(0,1fr) auto; align-items:center; gap:8px; }
.dashboard-donut-legend i { width:8px; height:8px; border-radius:50%; }.dashboard-donut-legend span { min-width:0; }.dashboard-donut-legend strong,.dashboard-donut-legend small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dashboard-donut-legend strong { color:#404040; font-size:10px; }.dashboard-donut-legend small { margin-top:2px; color:#a3a3a3; font-size:8px; }.dashboard-donut-legend b { color:#525252; font-size:9px; }
.dashboard-account-section { margin-bottom:18px; }.dashboard-section-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:9px; padding:0 2px; }
.dashboard-account-rail { display:grid; grid-auto-columns:minmax(225px,1fr); grid-auto-flow:column; gap:11px; overflow-x:auto; padding:1px 1px 9px; scrollbar-width:thin; }
.dashboard-account-card { position:relative; overflow:hidden; display:grid; grid-template-columns:34px minmax(0,1fr); gap:10px; min-height:128px; padding:16px; border:0; border-radius:13px; color:#fff; background:linear-gradient(135deg,#111 0%,#262626 72%,#7f1d1d 150%); box-shadow:0 8px 18px rgba(0,0,0,.14); text-align:left; cursor:pointer; transition:transform .16s ease,box-shadow .16s ease; }
.dashboard-account-card:nth-child(3n+1) { background:linear-gradient(135deg,#b91c1c,#7f1d1d 72%,#111); }.dashboard-account-card:nth-child(3n+2) { background:linear-gradient(135deg,#111,#262626); }
.dashboard-account-card:hover { transform:translateY(-2px); box-shadow:0 11px 24px rgba(0,0,0,.2); }.dashboard-account-card:focus-visible { outline:3px solid #fca5a5; outline-offset:2px; }
.dashboard-account-icon { width:34px; height:34px; display:grid; place-items:center; border-radius:50%; color:#111; background:#fff; }.dashboard-account-icon .app-icon { width:18px; }
.dashboard-account-copy { min-width:0; }.dashboard-account-copy strong,.dashboard-account-copy small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.dashboard-account-copy strong { font-size:11px; }.dashboard-account-copy small { margin-top:3px; color:#d4d4d4; font-size:8px; }
.dashboard-account-card b { grid-column:1/-1; align-self:end; font-size:19px; }.dashboard-account-card em { position:absolute; right:14px; bottom:18px; color:#e5e5e5; font-size:8px; font-style:normal; }
.dashboard-lower-grid { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(290px,1fr) minmax(245px,.72fr); gap:14px; }
.dashboard-table-wrap { overflow:auto; }.dashboard-table { width:100%; border-collapse:collapse; font-size:9px; }.dashboard-table th { padding:9px 12px; color:#737373; background:#fafafa; font-size:8px; text-align:left; text-transform:uppercase; }.dashboard-table td { padding:10px 12px; border-top:1px solid #ededed; color:#525252; white-space:nowrap; }.dashboard-table td:nth-child(2) { white-space:normal; min-width:140px; }.dashboard-table strong,.dashboard-table small { display:block; }.dashboard-table strong { color:#262626; font-size:10px; }.dashboard-table small { margin-top:3px; color:#a3a3a3; font-size:8px; }.dashboard-amount { font-weight:850; text-align:right; }.dashboard-amount.in { color:#15803d; }.dashboard-amount.out { color:#dc2626; }
.dashboard-invoice-list { display:grid; }.dashboard-invoice-row { display:grid; grid-template-columns:34px minmax(0,1fr) auto; align-items:center; gap:10px; min-height:62px; padding:10px 13px; border-bottom:1px solid #ededed; color:inherit; text-decoration:none; }.dashboard-invoice-row:last-child { border-bottom:0; }.dashboard-invoice-row:hover { background:#fafafa; }
.dashboard-invoice-icon { width:32px; height:32px; display:grid; place-items:center; border-radius:9px; color:#991b1b; background:#fee2e2; }.dashboard-invoice-icon .app-icon { width:17px; }.dashboard-invoice-row > span { min-width:0; }.dashboard-invoice-row > span:last-child { text-align:right; }.dashboard-invoice-row strong,.dashboard-invoice-row small,.dashboard-invoice-row b { display:block; }.dashboard-invoice-row strong { overflow:hidden; color:#262626; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }.dashboard-invoice-row small { overflow:hidden; max-width:180px; margin-top:3px; color:#a3a3a3; font-size:8px; text-overflow:ellipsis; white-space:nowrap; }.dashboard-invoice-row b { color:var(--mtg-red); font-size:10px; }
.dashboard-attention-panel nav { display:grid; }.dashboard-attention-link { display:grid; grid-template-columns:34px minmax(0,1fr) auto 14px; align-items:center; gap:9px; min-height:68px; padding:10px 13px; border-bottom:1px solid #ededed; color:inherit; text-decoration:none; }.dashboard-attention-link:hover { background:#fff7f7; }.dashboard-attention-link > span:first-child { width:32px; height:32px; display:grid; place-items:center; border-radius:9px; color:var(--mtg-red); background:#fee2e2; }.dashboard-attention-link .app-icon { width:16px; }.dashboard-attention-link > span:nth-child(2) { min-width:0; }.dashboard-attention-link strong,.dashboard-attention-link small { display:block; }.dashboard-attention-link strong { color:#262626; font-size:10px; }.dashboard-attention-link small { margin-top:3px; color:#a3a3a3; font-size:8px; }.dashboard-attention-link b { color:var(--mtg-red); font-size:20px; }.dashboard-attention-link > .app-icon { color:#a3a3a3; width:13px; }
.dashboard-attention-panel footer { display:flex; justify-content:space-between; gap:8px; padding:10px 13px; color:#a3a3a3; background:#fafafa; font-size:8px; }.dashboard-attention-panel footer strong { color:#525252; }

@media (max-width: 1180px) and (min-width: 768px) {
    .dashboard-command-bar { grid-template-columns:1fr auto; }.dashboard-date-range { justify-self:end; }.dashboard-presets { grid-column:1/-1; }.dashboard-refresh { grid-column:2; grid-row:2; }
    .dashboard-kpi-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.dashboard-chart-grid { grid-template-columns:1fr; }.dashboard-lower-grid { grid-template-columns:1.3fr 1fr; }.dashboard-attention-panel { grid-column:1/-1; }
}

.mobile-only, .mobile-drawer, .drawer-backdrop { display: none; }
@media (max-width: 767px) {
    :root { --mtg-topbar: 60px; }
    .desktop-only, .desktop-sidebar { display: none !important; }
    .mobile-only, .mobile-logo { display: inline-flex; }
    .app-shell { display: block; }
    .app-topbar { padding: 0 10px; border-left: 0; }
    .topbar-leading { gap: 8px; }
    .topbar-context span { font-size: 13px; }
    .topbar-context small { display: none; }
    .mobile-logo { width: 34px; height: 34px; }
    .topbar-user { gap: 5px; }
    .logout-button { padding: 0; }
    .app-content { padding: 18px 14px 86px; }
    .page-loading-mask { left: 0; padding: 28px 14px; }
    .mobile-drawer { display: block; position: fixed; inset: 0 auto 0 0; z-index: 60; width: min(86vw, 330px); box-shadow: 18px 0 40px rgba(0,0,0,.32); animation: drawer-in .18s ease-out; }
    .drawer-backdrop { display: block; position: fixed; inset: 0; z-index: 59; width: 100%; height: 100%; border: 0; background: rgba(0,0,0,.52); }
    .nav-groups { height: calc(100dvh - var(--mtg-topbar) - 70px); }
    .nav-footer { height: 70px; }
    .page-header { align-items: stretch; flex-direction: column; margin-bottom: 16px; }
    .page-header h1 { font-size: 25px; }
    .page-header .app-primary { width: 100%; }
    .toolbar-panel { align-items: stretch; padding: 10px; }
    .toolbar-panel > * { flex: 1 1 100%; }
    .filter-toolbar { align-items:stretch; flex-direction:column; padding:10px; }
    .filter-toolbar-fields { width:100%; align-items:flex-end; }
    .filter-field { min-width:min(100%,140px); flex:1 1 calc(50% - 5px); }
    .filter-search-field { flex-basis:100%; }
    .filter-toolbar-actions { align-self:flex-end; max-width:100%; overflow-x:auto; margin-left:auto; }
    .daily-report-grid { grid-template-columns:1fr; }
    .account-card-grid { grid-template-columns:1fr; gap:14px; }
    .account-summary-card { width:100%; min-height:164px; padding:17px; }
    .account-summary-primary { gap:8px; }
    .account-card-summary { align-items:flex-start; flex-direction:column; }
    .report-panel-total { justify-content:flex-end; }
    .daily-difference-summary { width:100%; min-width:0; justify-content:space-between; gap:16px; padding:16px; }
    .cashbook-category > header { align-items:flex-start; flex-direction:column; }
    .cashbook-subcategory { margin:8px; }
    .cashbook-subcategory .section-heading { align-items:flex-start; flex-direction:column; }
    .report-totals { margin-top:8px; }
    .grand-total-grid { grid-template-columns:1fr; }
    .development-reset-hero { padding:22px 18px; }
    .development-danger-mark { width:40px; height:40px; font-size:22px; }
    .development-reset-boundaries { grid-template-columns:1fr; padding:14px; }
    .development-confirmation { padding:18px 14px; }
    .development-clear-button { width:100%; }
    .development-reset-result dl { margin-left:0; }
    .signalr-summary-grid { grid-template-columns:1fr 1fr; gap:9px; }
    .signalr-summary-grid article { padding:15px; }
    .signalr-summary-grid strong { font-size:25px; }
    .signalr-search { flex-basis:100%; }
    .signalr-live-note span:not(.signalr-live-dot) { display:none; }
    .signalr-account-card > header { grid-template-columns:42px minmax(0,1fr); padding:15px; }
    .signalr-avatar { width:42px; height:42px; border-radius:12px; }
    .signalr-account-meta { grid-column:1/-1; align-items:flex-start; padding-top:10px; border-top:1px solid rgba(255,255,255,.1); }
    .signalr-device-grid { grid-template-columns:1fr; padding:9px; }
    .signalr-device-card dl { grid-template-columns:1fr; gap:9px; }
    .receivable-summary-grid { grid-template-columns:1fr 1fr; gap:9px; }.receivable-summary-grid article { min-height:104px; padding:14px; }.receivable-summary-grid strong { font-size:18px; }
    .receivable-customer-header { grid-template-columns:minmax(0,1fr) 18px; gap:10px; padding:14px; }.receivable-customer-header>span:not(.receivable-customer-identity) { display:none; }.receivable-chevron { grid-column:2; grid-row:1; }
    .receivable-invoice-table { padding:9px; }.receivable-invoice-table footer { padding:12px 4px 4px; }
    .dashboard-command-bar { display:grid; grid-template-columns:1fr; padding:10px; }
    .dashboard-date-range { grid-template-columns:1fr 12px 1fr; }
    .dashboard-presets { display:grid; grid-template-columns:1fr 1fr; }
    .dashboard-presets button { border-bottom:1px solid var(--mtg-border); }
    .dashboard-refresh { width:100%; }
    .dashboard-kpi-grid { grid-template-columns:1fr 1fr; gap:9px; }
    .dashboard-kpi { min-height:112px; grid-template-columns:36px minmax(0,1fr); gap:9px; padding:14px 12px; }
    .dashboard-kpi:last-child { grid-column:1/-1; }
    .dashboard-kpi-icon { width:36px; height:36px; }.dashboard-kpi strong { font-size:16px; }
    .dashboard-chart-grid { grid-template-columns:1fr; }.dashboard-panel > header { align-items:flex-start; flex-direction:column; }
    .dashboard-chart-shell { min-height:250px; overflow-x:auto; padding:8px; }.dashboard-line-chart { min-width:620px; }
    .dashboard-chart-legend { position:sticky; left:0; justify-content:flex-start; }
    .dashboard-donut-layout { grid-template-columns:1fr; }.dashboard-donut { max-width:220px; }.dashboard-donut-legend { padding:0 8px 8px; }
    .dashboard-section-heading { align-items:flex-start; }.dashboard-account-rail { grid-auto-columns:235px; }
    .dashboard-lower-grid { grid-template-columns:1fr; }
    .dashboard-table,.dashboard-table tbody { display:block; }.dashboard-table thead { display:none; }.dashboard-table tr { display:grid; grid-template-columns:1fr auto; gap:8px 12px; padding:13px; border-bottom:1px solid #ededed; }.dashboard-table td { padding:0; border:0; white-space:normal; }.dashboard-table td:nth-child(2),.dashboard-table td:nth-child(3) { grid-column:1; }.dashboard-table td:nth-child(4),.dashboard-table td:nth-child(5) { grid-column:2; text-align:right; }.dashboard-table td:nth-child(4) { grid-row:1; }.dashboard-table td:nth-child(5) { grid-row:2 / span 2; align-self:center; }
    .content-panel { overflow: visible; border: 0; background: transparent; box-shadow: none; }
    .data-table, .data-table tbody { display: block; }
    .data-table thead { display: none; }
    .data-table tr { display: grid; grid-template-columns: 1fr auto; gap: 8px 12px; margin-bottom: 10px; padding: 14px; border: 1px solid var(--mtg-border); border-radius: var(--mtg-radius); background: white; }
    .data-table td { display: block; padding: 0; border: 0; grid-column: 1; }
    .data-table td::before { content: attr(data-label); display: block; margin-bottom: 2px; color: var(--mtg-muted); font-size: 9px; font-weight: 700; text-transform: uppercase; }
    .data-table td.row-actions { grid-column: 2; grid-row: 1 / span 5; align-self: center; }
    .panel-footer { background: white; border: 1px solid var(--mtg-border); border-radius: var(--mtg-radius); }
    .app-dialog { width: 100%; }
    .app-dialog > header { min-height: var(--mtg-topbar); padding: 0 16px; color: white; background: var(--mtg-black); border: 0; }
    .app-dialog h2 { font-size: 17px; }
    .dialog-body { padding: 18px 16px 96px; }
    .dialog-footer { position: fixed; inset: auto 0 0; padding: 12px 16px max(12px, env(safe-area-inset-bottom)); box-shadow: 0 -8px 24px rgba(0,0,0,.08); }
    .form-grid { grid-template-columns: 1fr; }
    .master-detail-grid,.split-panels { grid-template-columns: 1fr; }
    .invoice-layout { grid-template-columns:1fr; }
    .invoice-summary { position:static; }
    .invoice-workspace { min-height:0; }
    .invoice-workspace,.invoice-details-panel { border:1px solid var(--mtg-border); border-radius:var(--mtg-radius); background:white; box-shadow:0 2px 12px rgba(17,17,17,.03); }
    .invoice-workspace-header { align-items:flex-start; }.invoice-running-total { align-items:flex-end; }
    .invoice-selector-bar { grid-template-columns:1fr; padding:14px; }
    .invoice-item-type-group { grid-template-columns:1fr; }
    .invoice-item-type-group legend { grid-column:1/-1; }
    .item-autocomplete-menu { max-height:min(42vh,260px); }
    .invoice-lines-shell { min-height:0; }.invoice-empty-lines { min-height:240px; }
    .invoice-side-form { grid-template-columns:1fr; }.invoice-side-form .full { grid-column:auto; }
    .app-dialog.quantity-dialog { width:min(430px,calc(100% - 24px)); border-radius:14px; }
    .app-dialog.quantity-dialog > header { min-height:58px; padding:0 16px; color:var(--mtg-text); background:white; border-bottom:1px solid var(--mtg-border); }
    .quantity-dialog .dialog-body { padding:16px; }
    .goods-image-preview { grid-template-columns:88px minmax(0,1fr); }
    .goods-image-preview img { width:88px; height:78px; }
    .invoice-list-actions { align-items:flex-end; flex-direction:column; }
    .invoice-detail-shell .dialog-body { padding:14px 12px 96px; }
    .invoice-detail-actions { display:grid; grid-template-columns:1fr 1fr; }
    .invoice-detail-actions .btn { min-width:0; }
    .invoice-print-sheet { padding:20px 15px; }
    .invoice-print-heading { flex-direction:column; gap:16px; }
    .invoice-print-heading dl { min-width:0; }
    .invoice-customer-grid,.invoice-print-summary { grid-template-columns:1fr; }
    .permission-layout { grid-template-columns:1fr; }
    .toast-host { right:14px; bottom:76px; }
    .form-field.full { grid-column: auto; }
    .login-page { display: block; min-height: 100dvh; background: var(--mtg-bg); }
    .login-brand-panel { min-height: 245px; padding: 32px 24px 48px; place-items: end start; }
    .login-brand-inner img { width: 70px; height: 70px; border-radius: 13px; }
    .login-brand-inner h1 { margin: 17px 0 5px; font-size: 30px; }
    .login-brand-inner p { font-size: 12px; }
    .login-form-panel { display: block; padding: 0 14px 24px; }
    .login-card { position: relative; margin: -22px auto 0; padding: 24px 20px; border-radius: 14px; }
    .login-card h2 { font-size: 22px; }
    .db-setup-page { padding: 24px 20px max(28px,env(safe-area-inset-bottom)); }
    .db-setup-brand { margin: 0 auto; }
    .db-setup-brand img { width: 42px; height: 42px; border-radius: 9px; }
    .db-setup-brand strong { font-size: 21px; }
    .db-setup-content { margin-top: clamp(56px,9vh,84px); }
    .db-setup-heading { text-align: center; }
    .db-setup-heading h1 { font-size: clamp(34px,10vw,42px); line-height: 1.36; }
    .db-setup-heading p { margin-top: 18px; font-size: 13px; }
    .db-progress-block { margin: 40px 0 25px; }
    .db-setup-steps li { min-height: 82px; grid-template-columns: 42px minmax(0,1fr) 18px; gap: 13px; }
    .db-step-number { width: 37px; height: 37px; font-size: 12px; }
    .db-setup-steps strong { font-size: 14px; }
    .db-setup-steps small { font-size: 10px; }
    .db-step-state { width: 16px; height: 16px; }
    .db-live-log > header { padding-left: 13px; }
    .db-live-log > header small { display:none; }
    .db-live-log-body { height:220px; }
    .db-log-row { grid-template-columns:58px 50px minmax(0,1fr); gap:7px; padding:5px 12px; font-size:9px; }
    .db-setup-error { grid-template-columns: 30px 1fr; padding: 16px; }
    .db-retry-button { grid-column: 1/-1; width: 100%; margin-top: 4px; }
    @keyframes drawer-in { from { transform: translateX(-100%); } to { transform: translateX(0); } }
}

@media (min-width: 768px) { .desktop-only { display: inline-flex; } }
@media print {
    @page { size:A4; margin:12mm; }
    body * { visibility:hidden !important; }
    .invoice-print-sheet,.invoice-print-sheet * { visibility:visible !important; }
    .dialog-backdrop,.app-dialog > header,.dialog-footer { display:none !important; }
    .app-dialog.invoice-detail-shell { position:static; display:block; width:auto; height:auto; box-shadow:none; }
    .invoice-detail-shell .dialog-body { overflow:visible; padding:0; background:#fff; }
    .invoice-print-sheet { position:absolute; inset:0 auto auto 0; width:100%; max-width:none; margin:0; padding:0; border:0; border-radius:0; box-shadow:none; print-color-adjust:exact; -webkit-print-color-adjust:exact; }
    .invoice-detail-lines { overflow:visible; }
    .invoice-detail-lines tr { break-inside:avoid; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; } }
/* Major-version report and administration surfaces */
.daily-cashbook{display:grid;gap:18px}.cashbook-day{break-inside:avoid}.two-column-report{display:grid;grid-template-columns:1fr 1fr;gap:18px}.two-column-report>div{border:1px solid #e5e7eb;border-radius:14px;overflow:hidden}.two-column-report h3,.two-column-report footer{margin:0;padding:12px 16px;background:#f8fafc}.two-column-report h3{border-bottom:3px solid #b91c1c}.two-column-report footer{display:flex;justify-content:space-between;border-top:1px solid #e5e7eb}.report-line{display:flex;justify-content:space-between;gap:16px;padding:11px 16px;border-bottom:1px solid #f0f0f0}.account-assignment-grid,.weekday-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;padding:12px;border:1px solid #e5e7eb;border-radius:12px}.account-assignment-grid label,.weekday-grid label{display:flex;align-items:center;gap:8px}.cashbook-day .empty-state{min-height:140px}
@media(max-width:767px){.two-column-report{grid-template-columns:1fr}.cashbook-day{padding:14px}.account-assignment-grid,.weekday-grid{grid-template-columns:1fr}}
@media print{.no-print,.app-sidebar,.app-topbar{display:none!important}.app-content{margin:0!important;padding:0!important}.print-page{break-after:page;box-shadow:none;border:0}.print-page:last-child{break-after:auto}.two-column-report{grid-template-columns:1fr 1fr}.print-area{box-shadow:none;border:0}}

/* Branch/customer masters and invoice customer quick selection */
.customer-picker-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:start}.customer-quick-add{min-width:64px;height:46px;display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:0 12px;border:1px solid var(--mtg-red);border-radius:8px;color:var(--mtg-red);background:#fff;font-weight:800;cursor:pointer;white-space:nowrap}.customer-quick-add:hover{color:#fff;background:var(--mtg-red)}.customer-quick-add .app-icon{width:17px}.customer-autocomplete .item-autocomplete-menu{min-width:min(430px,calc(100vw - 48px))}.dialog-backdrop.customer-quick-dialog-backdrop{z-index:79}.app-dialog.customer-quick-dialog{z-index:80;max-width:620px}.form-error{margin:0;padding:10px 12px;border-radius:8px;color:#991b1b;background:#fee2e2;font-size:12px}
.searchable-select .item-autocomplete-menu{min-width:100%;max-height:300px}.searchable-select .item-autocomplete-option{grid-template-columns:minmax(0,1fr) auto}.searchable-select .item-autocomplete-option>.app-icon{width:17px;color:var(--mtg-red)}
.cashbook-category-detail{margin:0 0 20px;background:transparent}.cashbook-category-detail>header{padding:0 0 5px;color:#1d4ed8;background:transparent;font-size:13px}.cashbook-category-detail>header strong{font-weight:700}.cashbook-detail-row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:6px 0;font-size:13px}.cashbook-detail-row>span{min-width:0}.cashbook-detail-name,.cashbook-detail-row span small{display:block}.cashbook-detail-name{font-weight:400;color:var(--mtg-text)}.cashbook-detail-row span small{margin-top:3px;color:var(--mtg-muted);font-size:9px;font-weight:400}.cashbook-detail-amount{flex:0 0 auto;font-size:13px;font-variant-numeric:tabular-nums;text-align:right}.cashbook-detail-columns .cashbook-category-total{display:flex;justify-content:flex-end;align-items:baseline;gap:16px;margin:2px 0 0 auto;padding:6px 0 0;border-top:1px solid #9ca3af;color:var(--mtg-text);background:transparent;font-size:13px}.cashbook-category-total span{font-size:10px;color:var(--mtg-muted)}.cashbook-category-total strong{min-width:118px;text-align:right;font-variant-numeric:tabular-nums}.cashbook-side>footer{display:flex;justify-content:space-between;margin-top:8px;padding:10px 0 0;border-top:2px solid var(--mtg-text);background:transparent;font-size:13px}

/* Main Cash Book uses a quiet paper-ledger treatment instead of stacked cards. */
.cashbook-day.content-panel{padding:18px 20px;border:0;border-radius:0;box-shadow:none;background:#fff}.cashbook-day>.section-heading{margin:0 0 16px;padding:0 0 9px;border-bottom:1px solid #cbd5e1}.cashbook-day>.section-heading h2{font-size:16px}.cashbook-day>.section-heading>strong{font-size:13px}.cashbook-detail-columns{gap:0}.cashbook-detail-columns>div{padding:0 20px;border:0;border-radius:0;box-shadow:none;background:transparent;overflow:visible}.cashbook-detail-columns>div:first-child{padding-left:0;border-right:1px solid #dbe1e8}.cashbook-detail-columns>div:last-child{padding-right:0}.cashbook-detail-columns h3{margin:0 0 16px;padding:0 0 7px;border:0;background:transparent;color:var(--mtg-text);font-size:15px;font-weight:600}.daily-cashbook{width:100%;max-width:960px;margin-inline:auto;gap:24px;background:#fff}

@media(max-width:767px){.daily-cashbook{max-width:none}.cashbook-day.content-panel{padding:14px 12px}.cashbook-day>.section-heading h2{font-size:15px}.cashbook-detail-columns>div{padding:0}.cashbook-detail-columns>div:first-child{padding-bottom:18px;border-right:0;border-bottom:1px solid #cbd5e1}.cashbook-detail-columns>div:last-child{padding-top:18px}.cashbook-detail-row{gap:12px}.cashbook-category-total strong{min-width:108px}}
.cash-balance-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:14px 0}.cash-balance-summary>div{padding:16px;border:1px solid var(--mtg-border);border-radius:12px;background:#fff}.cash-balance-summary span,.cash-balance-summary strong{display:block}.cash-balance-summary span{color:var(--mtg-muted);font-size:11px}.cash-balance-summary strong{margin-top:6px;font-size:18px}.cash-balance-summary .closing{color:#fff;background:var(--mtg-black);border-color:var(--mtg-black)}.cash-balance-summary .closing span{color:#d4d4d4}.positive-text{color:#15803d}.negative-text{color:var(--mtg-red)}
.lock-selection-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px;padding:13px 16px;border:1px solid var(--mtg-border);border-radius:12px;background:#fff}.lock-selection-toolbar>div:last-child{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.lock-selection-toolbar strong,.lock-selection-toolbar span{display:block}.lock-selection-toolbar span{color:var(--mtg-muted);font-size:10px}.select-column{width:42px;text-align:center}.selected-row{background:#fff7f7}
@media(max-width:767px){.customer-picker-row{grid-template-columns:minmax(0,1fr) 48px}.customer-quick-add{min-width:48px;width:48px;padding:0}.customer-quick-add span{display:none}.customer-autocomplete .item-autocomplete-menu{min-width:0}}
@media(max-width:767px){.cash-balance-summary{grid-template-columns:1fr}.lock-selection-toolbar{align-items:stretch;flex-direction:column}.lock-selection-toolbar>div:last-child{justify-content:stretch}.lock-selection-toolbar .btn{flex:1}.app-dialog.fullscreen-report-dialog{width:100%;border-radius:0}}

/* Office hours, audit maintenance and transfer password confirmation */
.office-time-banner{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:16px;margin-bottom:18px;padding:18px 20px;border:1px solid #fecaca;border-radius:14px;background:linear-gradient(135deg,#fff 0%,#fff7f7 100%);box-shadow:0 8px 24px rgba(17,17,17,.04)}.office-time-banner-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:12px;color:#fff;background:var(--mtg-red)}.office-time-banner-icon .app-icon{width:23px}.office-time-banner strong,.office-time-banner span,.office-time-banner small{display:block}.office-time-banner strong{font-size:14px}.office-time-banner span{margin-top:3px;color:#7f1d1d;font-weight:700}.office-time-banner small{margin-top:4px;color:var(--mtg-muted)}.office-time-banner .btn{display:inline-flex;align-items:center;gap:7px}.office-time-banner .btn .app-icon{width:16px}
.office-hours-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(420px,1fr));gap:16px}.office-hours-card{overflow:hidden;border:1px solid var(--mtg-border);border-top:4px solid #a3a3a3;border-radius:15px;background:#fff;box-shadow:0 8px 24px rgba(17,17,17,.05)}.office-hours-card.restricted{border-top-color:var(--mtg-red)}.office-hours-card>header{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:18px 20px;border-bottom:1px solid #f0f0f0}.office-hours-card h2{margin:0;font-size:17px}.office-hours-card header span{display:block;margin-top:4px;color:var(--mtg-muted);font-size:11px}.app-switch{position:relative;width:46px;height:26px;flex:0 0 auto}.app-switch input{position:absolute;opacity:0}.app-switch span{width:46px;height:26px;margin:0!important;border-radius:999px;background:#d4d4d4;cursor:pointer;transition:.2s}.app-switch span:after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.2);transition:.2s}.app-switch input:checked+span{background:var(--mtg-red)}.app-switch input:checked+span:after{transform:translateX(20px)}.app-switch input:focus-visible+span{outline:3px solid rgba(185,28,28,.2)}
.office-time-inputs{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:10px;padding:18px 20px 10px}.office-time-arrow{height:46px;display:grid;place-items:center;color:var(--mtg-red)}.office-time-arrow .app-icon{width:20px}.office-days{padding:10px 20px}.office-days>span{display:block;margin-bottom:9px;font-size:11px;font-weight:800}.office-day-chips{display:flex;flex-wrap:wrap;gap:7px}.office-day-chips label{position:relative}.office-day-chips input{position:absolute;opacity:0;pointer-events:none}.office-day-chips label span{min-width:50px;height:34px;display:grid;place-items:center;padding:0 10px;border:1px solid #d4d4d4;border-radius:999px;color:#737373;background:#fafafa;font-size:11px;font-weight:800;cursor:pointer}.office-day-chips input:checked+span{border-color:var(--mtg-black);color:#fff;background:var(--mtg-black)}.office-day-chips input:focus-visible+span{outline:3px solid rgba(185,28,28,.2)}.office-remark{padding:10px 20px}.office-hours-card>footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px;background:#fafafa}.office-hours-card>footer small{color:var(--mtg-muted)}.office-hours-card>footer .btn{display:inline-flex;align-items:center;gap:7px}.office-hours-card>footer .app-icon{width:15px}
.audit-year-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:16px;padding:16px 18px;border:1px solid var(--mtg-border);border-radius:14px;background:#fff}.audit-year-toolbar label{min-width:220px}.audit-year-toolbar label>span{display:block;margin-bottom:6px;font-size:10px;font-weight:800;text-transform:uppercase}.audit-year-toolbar>div{text-align:right}.audit-year-toolbar strong,.audit-year-toolbar div span{display:block}.audit-year-toolbar strong{color:var(--mtg-red);font-size:27px}.audit-year-toolbar div span{color:var(--mtg-muted);font-size:10px}.audit-month-section{padding:20px;border:1px solid var(--mtg-border);border-radius:14px;background:#fff}.audit-month-section>header{display:flex;align-items:start;justify-content:space-between;gap:14px;margin-bottom:16px}.audit-month-section h2{margin:0;font-size:18px}.audit-month-section p{margin:4px 0 0;color:var(--mtg-muted);font-size:11px}.text-action{border:0;color:var(--mtg-red);background:transparent;font-weight:800;cursor:pointer}.audit-month-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.audit-month-card{position:relative;min-height:158px;padding:15px;border:1px solid #e5e5e5;border-radius:13px;color:var(--mtg-text);background:#fafafa;text-align:left;cursor:pointer;transition:.18s}.audit-month-card:hover:not(:disabled){border-color:#fca5a5;transform:translateY(-2px);box-shadow:0 8px 18px rgba(17,17,17,.06)}.audit-month-card.selected{border:2px solid var(--mtg-red);background:#fff7f7}.audit-month-card:disabled{opacity:.5;cursor:not-allowed}.audit-month-title{display:flex;justify-content:space-between}.audit-month-title strong{font-size:13px}.audit-month-title span{color:#a3a3a3;font-weight:800}.audit-month-total{margin-top:15px;font-size:25px;font-weight:900}.audit-month-card>small{color:var(--mtg-muted)}.audit-month-breakdown{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;padding-top:10px;border-top:1px solid #e5e5e5}.audit-month-breakdown span{display:inline-flex;align-items:center;gap:4px;color:#525252;font-size:9px}.audit-month-breakdown .app-icon{width:12px}.audit-selected-mark{position:absolute;right:10px;bottom:10px;width:24px;height:24px;display:grid;place-items:center;border-radius:50%;color:#fff;background:var(--mtg-red)}.audit-selected-mark .app-icon{width:14px}.audit-clean-selection-bar{position:sticky;bottom:12px;display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:16px;padding:14px 18px;border:1px solid #fecaca;border-radius:14px;background:rgba(255,255,255,.96);box-shadow:0 12px 30px rgba(17,17,17,.12);backdrop-filter:blur(8px)}.audit-clean-selection-bar strong,.audit-clean-selection-bar span{display:block}.audit-clean-selection-bar span{margin-top:3px;color:var(--mtg-muted);font-size:10px}.audit-clean-selection-bar .btn,.app-danger{display:inline-flex;align-items:center;gap:7px}.audit-clean-selection-bar .app-icon,.app-danger .app-icon{width:16px}.app-danger{min-height:44px;border:1px solid var(--mtg-red);color:#fff;background:var(--mtg-red)}.app-danger:hover{background:var(--mtg-dark-red)}.app-danger:disabled{opacity:.55;cursor:not-allowed}.audit-clean-dialog{max-width:620px}.audit-clean-summary{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:12px;border-radius:10px;background:#f5f5f5}.audit-clean-summary span{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:7px;background:#fff}.audit-clean-summary .app-icon{width:14px}.audit-clean-summary strong{margin-left:auto;color:var(--mtg-red)}.audit-target-options{display:grid;gap:10px;margin:16px 0}.audit-target-options>button{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:14px;border:1px solid var(--mtg-border);border-radius:11px;color:var(--mtg-text);background:#fff;text-align:left;cursor:pointer}.audit-target-options>button.selected{border-color:var(--mtg-red);background:#fff7f7}.audit-target-options .app-icon{width:21px;color:var(--mtg-red)}.audit-target-options button>.app-icon:last-child{opacity:0}.audit-target-options button.selected>.app-icon:last-child{opacity:1}.audit-target-options strong,.audit-target-options small{display:block}.audit-target-options small{margin-top:3px;color:var(--mtg-muted)}.audit-clean-warning{display:flex;gap:10px;padding:12px;border:1px solid #fed7aa;border-radius:10px;color:#9a3412;background:#fff7ed}.audit-clean-warning .app-icon{width:20px;flex:0 0 auto}.audit-cleaning-state{text-align:center;padding:24px 8px}.audit-cleaning-icon{width:68px;height:68px;display:grid;place-items:center;margin:0 auto 15px;border-radius:50%;color:#fff;background:var(--mtg-red);animation:audit-pulse 1.2s infinite}.audit-cleaning-icon .app-icon{width:31px}.audit-cleaning-state h3{margin:0}.audit-cleaning-state p{color:var(--mtg-muted)}.audit-clean-progress{overflow:hidden;height:6px;margin:18px 0;border-radius:99px;background:#fee2e2}.audit-clean-progress span{display:block;width:40%;height:100%;border-radius:99px;background:var(--mtg-red);animation:audit-progress 1.1s infinite ease-in-out}.transfer-password-dialog{max-width:500px}.password-confirm-form{display:grid;gap:15px}.password-confirm-form>p{margin:0;color:var(--mtg-muted);line-height:1.7}.transfer-confirm-summary{display:flex;align-items:center;gap:12px;padding:14px;border-left:4px solid var(--mtg-red);border-radius:9px;background:#fff7f7}.transfer-confirm-summary>.app-icon{width:25px;color:var(--mtg-red)}.transfer-confirm-summary span,.transfer-confirm-summary strong{display:block}.transfer-confirm-summary strong{margin-top:4px;font-size:18px}
@keyframes audit-pulse{50%{transform:scale(1.06);box-shadow:0 0 0 10px rgba(185,28,28,.1)}}@keyframes audit-progress{0%{transform:translateX(-110%)}100%{transform:translateX(360%)}}
@media (max-width: 1100px){.audit-month-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width: 767px){.office-time-banner{grid-template-columns:auto 1fr;padding:15px}.office-time-banner .btn{grid-column:1/-1;width:100%;justify-content:center}.office-hours-grid{grid-template-columns:1fr}.office-time-inputs{grid-template-columns:1fr}.office-time-arrow{display:none}.office-hours-card>footer{align-items:flex-end}.audit-month-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.audit-month-section{padding:14px}.audit-clean-selection-bar{align-items:stretch;flex-direction:column}.audit-clean-selection-bar .btn{width:100%;justify-content:center}.audit-year-toolbar{align-items:stretch;flex-direction:column}.audit-year-toolbar label{min-width:0}.audit-year-toolbar>div{text-align:left}.audit-clean-summary strong{width:100%;margin-left:0}}
@media (max-width: 420px){.audit-month-grid{grid-template-columns:1fr}.office-day-chips label span{min-width:46px}}

/* Production polish: shared interaction, density and accessibility rules. */
.app-content > :first-child { scroll-margin-top: calc(var(--mtg-topbar) + 16px); }
.page-header > div { min-width: 0; }
.page-header p { max-width: 780px; line-height: 1.7; }
.page-header .btn { flex: 0 0 auto; white-space: nowrap; }
.btn { min-height: 44px; border-radius: 9px; font-size: 12px; font-weight: 750; transition: border-color .16s ease, background-color .16s ease, color .16s ease, box-shadow .16s ease, transform .16s ease; }
.btn:not(:disabled):active { transform: translateY(1px); }
.btn:disabled { opacity: .58; }
.app-input, .app-select, .form-control, .form-select { min-height: var(--mtg-control-height); border-color: #d4d4d4; border-radius: 9px; background-color: #fff; font-size: 12px; }
textarea.app-input, textarea.form-control { min-height: 96px; resize: vertical; }
.app-input:focus, .app-select:focus, .form-control:focus, .form-select:focus { border-color: var(--mtg-red); box-shadow: var(--mtg-focus-ring); }
.form-label, .form-field > label, .filter-field > span { color: #404040; font-size: 10px; font-weight: 800; line-height: 1.4; }
.field-help { display: block; margin-top: 5px; color: var(--mtg-muted); font-size: 10px; line-height: 1.55; }
.field-error { padding-left: 1px; line-height: 1.55; }
.amount-field, input[inputmode="decimal"], input[inputmode="numeric"] { font-variant-numeric: tabular-nums; text-align: right; }
.filter-toolbar { position: relative; gap: 14px; padding: 16px; }
.filter-toolbar-fields { gap: 12px; }
.filter-toolbar-actions { align-self: flex-end; }
.filter-toolbar-actions .btn { min-width: 44px; }
.content-panel { isolation: isolate; }
.data-table { font-variant-numeric: tabular-nums; }
.data-table th { white-space: nowrap; }
.data-table td { line-height: 1.55; }
.data-table tbody tr { transition: background-color .14s ease; }
.data-table td.number, .data-table th.number, .money-value { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.status-badge { min-height: 25px; display: inline-flex; align-items: center; justify-content: center; padding: 4px 9px; white-space: nowrap; }
.state-panel { min-height: 150px; gap: 10px; border: 1px dashed #d4d4d4; border-radius: var(--mtg-radius); color: var(--mtg-muted); background: rgba(255,255,255,.72); }
.empty-state, .error-state { border-radius: var(--mtg-radius); }
.page-notice.notice-success { border: 1px solid #bbf7d0; color: #166534; background: var(--mtg-success-surface); }
.dialog-backdrop { backdrop-filter: blur(2px); }
.app-dialog[aria-busy="true"] { cursor: wait; }
.app-dialog[aria-busy="true"] .dialog-body { opacity: .82; }
.app-dialog .dialog-footer .btn { min-width: 0; }
.action-button-content { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.action-button-spinner { width: 16px; height: 16px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: action-button-spin .7s linear infinite; }
.table-skeleton { display: grid; gap: 9px; padding: 16px; }
.table-skeleton span { height: 42px; border-radius: 8px; background: linear-gradient(90deg,#f3f4f6 25%,#fff 45%,#f3f4f6 65%); background-size: 220% 100%; animation: skeleton-shimmer 1.35s ease-in-out infinite; }
@keyframes action-button-spin { to { transform: rotate(360deg); } }
@keyframes skeleton-shimmer { to { background-position: -220% 0; } }

@media (min-width: 768px) {
    .content-panel.table-scroll { max-height: calc(100dvh - 230px); overflow: auto; }
    .content-panel.table-scroll .data-table thead { position: sticky; top: 0; z-index: 2; box-shadow: 0 1px 0 var(--mtg-border); }
}

@media (max-width: 767px) {
    .app-content { padding: 18px 14px 92px; }
    .page-header { align-items: stretch; flex-direction: column; margin-bottom: 18px; }
    .page-header h1 { font-size: 26px; }
    .page-header .btn { width: 100%; }
    .filter-toolbar { align-items: stretch; flex-direction: column; padding: 13px; }
    .filter-toolbar-fields { width: 100%; }
    .filter-toolbar-fields > * { min-width: min(100%, 210px); flex: 1 1 210px; }
    .filter-toolbar-actions { width: 100%; justify-content: flex-end; margin-left: 0; overflow-x: auto; padding-bottom: 1px; scrollbar-width: thin; }
    .filter-toolbar-actions .btn { flex: 0 0 auto; }
    .data-table tr { box-shadow: 0 4px 14px rgba(17,17,17,.035); }
    .data-table td::before { line-height: 1.4; }
    .panel-footer { align-items: flex-start; flex-direction: column; }
    .state-panel { min-height: 130px; }
}