/* Shared components build on the existing phase 1/2 controls and design tokens. */
:root{--ink:var(--color-text-primary);--muted:var(--color-text-secondary);--line:var(--color-border);--paper:var(--color-surface);--soft:var(--color-surface-muted);--gold:var(--color-accent);font-family:var(--font-ui);color:var(--ink);background:var(--color-background);color-scheme:light}
[data-mode=dark]{color-scheme:dark}
body{background:var(--color-background)}
button,.button,input,select,textarea{border-radius:var(--component-radius);min-height:var(--control-height);border-width:var(--border-width);transition:background var(--duration-fast) var(--ease-standard),box-shadow var(--duration-fast) var(--ease-standard)}
button,.button,input,select,textarea,dialog,.panel,.stat{background:var(--color-surface);color:var(--ink)}
button:hover,.button:hover{background:var(--soft)}
.primary,nav button.active,.stat.featured{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-on-primary)}
.primary:hover{background:var(--color-primary-hover);color:var(--color-on-primary-hover)}
.stat.featured .label,.stat.featured small{color:inherit}
.danger{color:var(--color-danger)}
.panel,.stat,.proposal-card,.upload-zone,dialog{border-radius:var(--component-radius);border-width:var(--border-width)}
.panel,.stat{box-shadow:var(--shadow-1)}
.stat,.panel-body{padding:var(--card-padding)}
.panel-head{padding:var(--space-4) var(--card-padding)}
.panel-head h2{font-weight:650;font-size:var(--text-lg)}
.panel{margin-bottom:var(--section-gap)}
.stats,.grid-two,.settings-grid{gap:var(--section-gap)}
.stat strong{font-size:var(--text-kpi);font-weight:650;letter-spacing:-.04em;overflow-wrap:anywhere}
.heading h1,.dialog-head h2,.auth-form h2,.auth-story h1{font-family:var(--font-ui);font-weight:650;letter-spacing:-.04em}
.heading h1{font-size:clamp(1.9rem,3vw,2.5rem)}
.heading .eyebrow{color:var(--muted)}
.badge{display:inline-flex;align-items:center;gap:var(--space-2);background:var(--color-success-soft);color:var(--color-success)}
.badge::before{content:'●';font-size:.65em}
.badge.draft{background:var(--color-warning-soft);color:var(--color-warning)}
.badge.reversed,.badge.rejected,.error{background:var(--color-danger-soft);color:var(--color-danger)}
.badge.muted{background:var(--soft);color:var(--muted)}
.note,.line-card,.proposal-card,.balance{background:var(--soft);color:var(--ink);border-color:var(--line)}
.balance.bad{background:var(--color-warning-soft);color:var(--color-warning)}
.note strong,.text-link{color:var(--ink)}
label{color:var(--ink)}
th{background:var(--soft)}td{border-color:var(--line)}
input:disabled,select:disabled{background:var(--soft)}
:focus-visible,input:focus,select:focus,textarea:focus{outline:var(--focus-width) solid var(--color-focus);outline-offset:3px;border-color:var(--color-focus)}
[data-focus=true]{--focus-width:5px}
.shell{grid-template-columns:248px minmax(0,1fr)}
.sidebar{background:var(--color-surface);padding:var(--space-8) var(--space-4);z-index:var(--z-sidebar);overflow-y:auto}
.brand{margin-bottom:var(--space-8)}.brand strong{font-family:var(--font-ui);font-size:1.3rem;font-weight:650;letter-spacing:-.04em}
.brand small{font-size:.6rem}.brand img{width:40px;height:40px}
.sidebar nav button{font-size:.9rem;border-radius:var(--component-radius);min-height:44px}
.sidebar nav button>span{min-width:0}.nav-count{margin-left:auto;background:var(--soft);color:var(--ink);border-radius:var(--radius-pill);padding:2px 7px;font-size:.75rem}
.topbar{background:var(--color-surface);height:auto;min-height:80px;padding:var(--space-4) var(--space-8)}
.top-actions{gap:var(--space-2)}.top-actions button svg{width:18px;height:18px}.topbar .crumb{min-width:0;overflow-wrap:anywhere}
main{padding:var(--space-8);max-width:1600px}
.avatar{background:var(--soft)}
.bottom-nav{display:none}
.skip-link{position:fixed;top:-100px;left:var(--space-4);z-index:200;background:var(--paper);padding:var(--space-4)}.skip-link:focus-visible{top:var(--space-4)}
.mobile-menu{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3)}.mobile-menu button{justify-content:flex-start}.mobile-menu svg{width:20px;height:20px}
.quick-actions{display:grid;gap:var(--space-4)}
.financial-stats{grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:var(--space-2)}
.financial-caption{margin-bottom:var(--section-gap)}
.workflow-stats .stat strong{font-size:1.8rem}.availability-grid{grid-template-columns:1fr 1fr}.attention-list{display:grid;gap:var(--space-4)}.attention-list>div{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--space-3)}
.theme-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--space-4)}
.theme-tile{position:relative;cursor:pointer;border:2px solid var(--line);padding:var(--space-3);border-radius:var(--component-radius);font-size:.875rem;min-width:0;background:var(--paper)}
.theme-tile:has(input:checked){border-color:var(--color-focus);box-shadow:0 0 0 1px var(--color-focus)}
.theme-tile:focus-within{outline:var(--focus-width) solid var(--color-focus);outline-offset:3px}
.theme-tile input{width:18px;min-height:18px;height:18px;position:absolute;right:var(--space-3);bottom:var(--space-3);margin:0;accent-color:var(--color-primary)}
.theme-tile>span:last-child{padding-right:24px;display:block}
.theme-swatch{display:flex;height:65px;border-radius:var(--radius-sm);margin-bottom:var(--space-3);overflow:hidden;background:var(--swatch-base)}
.theme-swatch i:first-child{width:20%;background:var(--swatch-primary)}.theme-swatch i:nth-child(2){width:40%;height:32px;margin:var(--space-3);border-radius:var(--radius-sm);background:var(--swatch-accent)}
.check-control{display:flex;align-items:center;gap:var(--space-3);min-height:44px}.check-control input{width:20px;height:20px;min-height:20px;margin:0;accent-color:var(--color-primary);flex-shrink:0}
.appearance-footer{position:sticky;bottom:var(--space-4);z-index:var(--z-floating);padding:var(--space-4);border:var(--border-width) solid var(--line);background:var(--paper);border-radius:var(--component-radius);box-shadow:var(--shadow-2)}
.appearance-footer .error{margin-top:0}.appearance-footer [hidden],[hidden]{display:none!important}
#custom-colors{margin-top:var(--space-6)}input[type=color]{padding:var(--space-1);min-height:48px}
.settings-links{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-bottom:var(--section-gap)}
.document-library{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(250px,1fr);gap:var(--section-gap)}
.document-preview{position:sticky;top:var(--space-4);align-self:start;min-width:0}.document-preview h3,.document-preview p{overflow-wrap:anywhere}.document-preview img{max-width:100%;max-height:350px;object-fit:contain;background:var(--paper);border-radius:var(--radius-sm)}
.document-preview dl{display:grid;gap:var(--space-2)}.document-preview dd{margin:0 0 var(--space-3);overflow-wrap:anywhere}.document-preview dt{color:var(--muted);font-size:.875rem}
#toast{background:var(--color-text-primary);color:var(--color-surface);z-index:120;box-shadow:var(--shadow-2)}
.auth-story{background:var(--color-primary);color:var(--color-on-primary)}.auth-story p,.auth-story .caption,.auth-story .brand small{color:inherit}.auth-form{background:var(--paper)}
.update-banner{padding:var(--space-3) var(--space-6);background:var(--soft);border-bottom:var(--border-width) solid var(--line);display:flex;gap:var(--space-4);align-items:center;font-size:.875rem}.update-banner p{margin:0}
[data-card-style=flat] .panel,[data-card-style=flat] .stat{box-shadow:none}
[data-card-style=elevated] .panel,[data-card-style=elevated] .stat{box-shadow:var(--shadow-2)}
[data-visual-style=soft] .topbar{background:var(--gradient-soft),var(--paper)}
@supports(backdrop-filter:blur(12px)){
 [data-visual-style=liquid-glass]:not([data-contrast=high]) :is(.sidebar,.topbar,.bottom-nav,.appearance-footer){background:var(--glass-surface);backdrop-filter:blur(var(--blur-glass));border-color:var(--glass-border)}
 [data-card-style=glass]:not([data-contrast=high]) .stat:not(.featured){background:var(--glass-surface);backdrop-filter:blur(var(--blur-soft))}
}
[data-contrast=high] :is(.sidebar,.topbar,.panel,.bottom-nav,dialog,.appearance-footer){background:var(--paper);backdrop-filter:none;border-color:var(--ink)}
[data-animations=full] dialog[open]{animation:appear var(--duration-normal) var(--ease-standard)}
@keyframes appear{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
[data-animations=off] *,[data-animations=reduced] *{animation:none!important}
@media(min-width:768px){
 [data-sidebar=compact] .shell{grid-template-columns:80px minmax(0,1fr)}
 [data-sidebar=compact] .sidebar{padding:var(--space-6) var(--space-3)}
 [data-sidebar=compact] .sidebar :is(.brand>div,.nav-label,.sidebar-foot,nav button>span){display:none}
 [data-sidebar=compact] .sidebar nav button{justify-content:center;padding:var(--space-3)}
}
@media(min-width:768px) and (max-width:1100px){
 [data-sidebar=auto] .shell{grid-template-columns:80px minmax(0,1fr)}
 [data-sidebar=auto] .sidebar{padding:var(--space-6) var(--space-3)}
 [data-sidebar=auto] .sidebar :is(.brand>div,.nav-label,.sidebar-foot,nav button>span){display:none}
 [data-sidebar=auto] .sidebar nav button{justify-content:center;padding:var(--space-3)}
 .topbar{padding:var(--space-4)}main{padding:var(--space-6)}.document-library{grid-template-columns:minmax(0,1fr) minmax(230px,.8fr)}
 .document-library .table-wrap{max-height:70vh}.document-grid{gap:var(--space-4)}
}
@media(max-width:767px){
 .shell{display:block}.sidebar{display:none}.topbar{min-height:70px;padding:var(--space-3) var(--space-4);gap:var(--space-2)}.topbar .crumb{font-size:.8rem;max-width:130px}.topbar .tag,.sidebar-toggle{display:none}
 .topbar button{min-height:44px}.language-picker select{min-height:44px;max-width:110px}.top-actions{gap:var(--space-1)}
 main{padding:var(--space-6) var(--space-4) calc(110px + env(safe-area-inset-bottom))}
 .bottom-nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:fixed;bottom:0;left:0;right:0;z-index:var(--z-floating);padding:var(--space-2) var(--space-1) calc(var(--space-2) + env(safe-area-inset-bottom));background:var(--paper);border-top:var(--border-width) solid var(--line);overflow:visible}
 .bottom-nav button{display:flex;flex-direction:column;justify-content:center;gap:var(--space-1);min-height:56px;min-width:0;padding:var(--space-1);font-size:.65rem;border:0;background:transparent;white-space:normal}
 .bottom-nav button.active{background:var(--soft);color:var(--ink)}.bottom-nav svg{width:21px;height:21px}
 .bottom-nav .quick-add{border-radius:var(--radius-pill);width:46px;min-height:46px;height:46px;margin:auto;background:var(--color-primary);color:var(--color-on-primary);font-size:1.6rem}
 button,.button,input,select,textarea{min-height:44px}.text-link{min-height:44px}.heading h1{font-size:1.9rem}
 .stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3)}.financial-stats>.stat:last-child{grid-column:1/-1}.stat{padding:var(--space-4)}
 .stat strong{font-size:1.9rem}.stat .label{font-size:.8rem}.stat small{font-size:.75rem}.availability-grid,.settings-grid,.document-library{grid-template-columns:minmax(0,1fr)}
 .document-preview{position:static}.theme-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3)}.theme-tile{font-size:.8rem}.theme-swatch{height:52px}
 .appearance-footer{bottom:calc(84px + env(safe-area-inset-bottom));padding:var(--space-3)}.appearance-footer .actions{gap:var(--space-2)}.appearance-footer button{font-size:.8rem;flex:1}
 .form-grid,.document-grid{grid-template-columns:minmax(0,1fr)}.document-grid>section+section{border-left:0;padding-left:0}.panel-head,.panel-body{padding:var(--space-4)}
 #toast{bottom:calc(90px + env(safe-area-inset-bottom))}.update-banner{align-items:flex-start;padding:var(--space-3)}
 dialog{max-height:calc(100dvh - 24px - env(safe-area-inset-bottom));width:calc(100vw - 16px)}
}
@media(forced-colors:active){.theme-tile:has(input:checked){outline:3px solid Highlight}.primary,.badge{border:1px solid ButtonText}.theme-swatch{forced-color-adjust:none}}

.mobile-quick{display:none}@media(max-width:767px){.mobile-quick{display:grid;place-items:center;position:fixed;right:16px;bottom:calc(90px + env(safe-area-inset-bottom));width:52px;height:52px;border-radius:50%;font-size:28px;z-index:59;box-shadow:var(--shadow-2)}}

.sidebar-toggle svg{width:18px;height:18px;flex-shrink:0}.sidebar-toggle{width:44px;min-width:44px}

.ocr-text { white-space: pre-wrap; overflow-wrap: anywhere; max-height: 24rem; overflow: auto; font-size: .85rem; }


/* Banking uses the shared theme tokens on desktop, tablet and phone. */
.bank-account { display:flex; justify-content:space-between; gap:var(--space-4,1rem); flex-wrap:wrap; padding:var(--space-4,1rem) 0; border-bottom:1px solid var(--color-border); }
.bank-account .actions { flex-wrap:wrap; align-items:center; }
[data-allocation] { min-width:7rem; width:8rem; }

@media(max-width:600px){
 .bank-table,.bank-table tbody,.bank-table tr,.bank-table td{display:block;width:100%;white-space:normal}
 .bank-table thead{display:none}
 .bank-table tr{padding:var(--space-4);border-bottom:1px solid var(--color-border)}
 .bank-table td,.bank-table td.wrap{padding:var(--space-2) 0;border:0;min-width:0;text-align:left;overflow-wrap:anywhere}
 .bank-table td[data-label]::before{content:attr(data-label) ": ";font-weight:600}
 .bank-table input{width:100%;margin-top:var(--space-2)}
}
.file-row {border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4);margin-block:var(--space-3);min-width:0;}
.file-row .hint {overflow-wrap:anywhere;}
.file-source {max-height:18rem;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;}
.file-row input,.file-row select {min-width:0;width:100%;}
#file-work {margin-top:var(--space-4);}
@media print {
 body.printing-invoice {background:var(--print-paper);color:var(--print-ink);}
 body.printing-invoice #modal::backdrop {display:none;}
 body.printing-invoice #app,body.printing-invoice #toast,body.printing-invoice .dialog-head {display:none!important;}
 body.printing-invoice #modal {position:static!important;max-height:none!important;width:100%!important;max-width:none!important;overflow:visible!important;border:0;box-shadow:none;}
 body.printing-invoice .dialog-body {overflow:visible!important;}
 body.printing-invoice .dialog-body > :not(#invoice-print) {display:none!important;}
 body.printing-invoice #modal,body.printing-invoice #invoice-print {color:var(--print-ink);background:var(--print-paper);margin:0;border-radius:0;}
 body.printing-invoice .table-wrap {overflow:visible;}
}

@media screen and (max-width:600px){
 .invoice-table,.invoice-table tbody,.invoice-table tr,.invoice-table td{display:block;width:100%;white-space:normal}
 .invoice-table thead{display:none}
 .invoice-table tr{padding:var(--space-3);border-bottom:1px solid var(--color-border)}
 .invoice-table td,.invoice-table td.wrap{padding:var(--space-1) 0;min-width:0;border:0;overflow-wrap:anywhere}
 .invoice-table td[data-label]::before{content:attr(data-label) ": ";font-weight:600}
}

/* Banking reports reuse the active theme and remain scrollable on small screens. */
.report-launch { margin-block: var(--space-3); }
#report-dialog .table-wrap, #bank-report .table-wrap { max-height: 65vh; overflow: auto; }
#report-dialog td.wrap, #bank-report td.wrap { min-width: 130px; max-width: 360px; overflow-wrap: anywhere; }
#bank-report input[type="checkbox"], #report-dialog input[type="checkbox"] { width: auto; }
#bank-report details input { min-width: 150px; }

.invoice-document {padding:var(--space-4);background:var(--color-surface);color:var(--color-text-primary);}.invoice-totals {text-align:right;border-top:1px solid var(--color-border);padding-block:var(--space-4);}.invoice-document p {overflow-wrap:anywhere;}

/* Branded invoice document: stable paper presentation, independent of app theme. */
.invoice-document {background:var(--print-paper);color:var(--print-ink);padding:clamp(16px,3vw,32px);font-size:14px;line-height:1.5;}
.invoice-brand-header {display:flex;align-items:flex-start;justify-content:space-between;gap:20px;border-bottom:2px solid var(--invoice-gold);padding-bottom:20px;margin-bottom:24px;}
.invoice-brand-header > div {min-width:0;flex:1;}
.invoice-brand-header h2 {margin:8px 0;font-size:26px;letter-spacing:-.6px;}
.invoice-brand-header .eyebrow {color:var(--invoice-muted);font-size:11px;letter-spacing:2px;}
.invoice-brand-logo {width:104px;height:104px;object-fit:contain;flex:none;}
.invoice-document h3 {font-size:14px;}
.invoice-parties {gap:24px;margin-bottom:24px;}
.invoice-document .invoice-table th {background:var(--invoice-tint);color:var(--print-ink);font-size:11px;}
.invoice-document .invoice-table td {border-color:var(--invoice-rule);}
.invoice-document .invoice-table td:not(:first-child),.invoice-document .invoice-table th:not(:first-child) {text-align:right;}
.invoice-document .invoice-totals {background:var(--invoice-tint);padding:16px 20px;margin:20px 0;border:0;border-left:3px solid var(--invoice-gold);}
.invoice-document .invoice-totals h3 {font-size:20px;margin-bottom:0;}
.invoice-payment {margin-top:24px;border-top:1px solid var(--invoice-rule);padding-top:12px;}
.invoice-payment-method {display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:20px 0 8px;font-size:12px;color:var(--invoice-muted);}
.invoice-payment-method img {width:140px;height:auto;}
@media(max-width:600px){.invoice-brand-logo {width:76px;height:76px;}.invoice-brand-header {gap:10px;}.invoice-brand-header h2 {font-size:22px;}.invoice-document .invoice-table td:not(:first-child) {text-align:left;}}
@media print {.invoice-brand-logo{width:90px;height:90px;}.invoice-brand-header,.invoice-payment,.invoice-totals{break-inside:avoid;}.invoice-document{font-size:10pt;}.invoice-document .invoice-table td:not(:first-child){text-align:right;}}

/* Invoice refinement v0.8.4 */
.invoice-document .table-wrap {margin-bottom:32px;}
.invoice-document .invoice-table td {padding-block:14px;}
.invoice-document .invoice-table th {padding-block:10px;}
.invoice-document .invoice-totals {margin-top:32px;margin-bottom:32px;padding:22px 24px;border-left-width:4px;}
.invoice-document .invoice-totals p {margin:0 0 18px;}
.invoice-document .invoice-totals h3 {padding-top:8px;}
.invoice-document .invoice-brand-header {border-bottom-width:3px;}
.invoice-closing {margin-top:28px;padding-top:16px;border-top:1px solid var(--invoice-gold);break-inside:avoid;}
.invoice-closing p {margin:0 0 12px;}
.invoice-closing p:last-child {color:var(--invoice-gold);font-weight:600;}

/* Gold serif invoice identity and framed payment details. */
.invoice-brand-header .invoice-gold-title {font-family:Georgia,'Times New Roman',serif;font-style:italic;font-weight:700;font-size:32px;color:var(--invoice-title-gold);text-shadow:-1px 0 2px var(--invoice-soft-shadow),1px 0 2px var(--invoice-soft-shadow),0 -1px 2px var(--invoice-soft-shadow),1px 2px 3px var(--invoice-shadow);border-bottom:1px solid var(--invoice-gold);padding-bottom:10px;margin-bottom:12px;}
.invoice-contact-lines {font-family:Georgia,'Times New Roman',serif;font-size:14px;}
.invoice-contact-lines > div {border-bottom:1px solid var(--invoice-gold);padding:5px 0 6px;overflow-wrap:anywhere;}
.invoice-payment {border:1.5px solid var(--invoice-gold);border-radius:6px;padding:18px 20px;font-family:Georgia,'Times New Roman',serif;break-inside:avoid;}
.invoice-closing {font-family:Georgia,'Times New Roman',serif;font-style:italic;font-weight:700;font-size:18px;color:var(--invoice-deep-gold);text-shadow:-1px 0 2px var(--invoice-soft-shadow),1px 0 2px var(--invoice-soft-shadow),0 -1px 2px var(--invoice-soft-shadow),0 1px 2px var(--invoice-soft-shadow),2px 3px 4px var(--invoice-shadow);}
.invoice-closing p:last-child {color:var(--invoice-deep-gold);font-size:20px;font-weight:700;}
@media(max-width:600px){.invoice-brand-header .invoice-gold-title{font-size:26px;}.invoice-contact-lines{font-size:12px;}.invoice-payment{padding:14px;}}

/* Clear black identity, rose closing and compact right-aligned payment panel. */
.invoice-brand-header .invoice-gold-title {font-family:Arial,Helvetica,sans-serif;font-style:normal;font-size:28px;color:var(--print-ink);text-shadow:none;border:0;padding-bottom:0;margin-bottom:12px;}
.invoice-contact-lines {font-family:Arial,Helvetica,sans-serif;font-size:12px;font-weight:600;line-height:1.4;}
.invoice-contact-lines > div {border:0;padding:1px 0;}
.invoice-payment {width:min(100%,340px);box-sizing:border-box;margin-left:auto;padding:14px;}
.invoice-payment p {margin:8px 0;}
.invoice-closing,.invoice-closing p:last-child {font-family:Georgia,'Times New Roman',serif;font-style:italic;font-weight:400;color:var(--invoice-rose);text-shadow:none;}
.invoice-closing {border-top:0;font-size:18px;}
.invoice-closing p:last-child {font-size:20px;}

.invoice-closing {text-align:center;width:100%;box-sizing:border-box;}

/* Variant 2: payment details on the left. */
.invoice-payment {margin-left:0;margin-right:auto;}

/* Unified two-column invoice summary. */
.invoice-summary {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;border-top:1px solid var(--invoice-gold);padding-top:20px;margin:24px 0;align-items:start;break-inside:avoid;}
.invoice-summary .invoice-payment {grid-column:1;grid-row:1;width:100%;margin:0;padding:0;border:0;border-radius:0;background:transparent;font-family:Arial,Helvetica,sans-serif;font-size:12px;}
.invoice-summary .invoice-payment h3 {margin:0 0 14px;font-size:14px;}
.invoice-summary .invoice-payment p {margin:0 0 10px;}
.invoice-summary .invoice-payment-method {margin:14px 0 0;}
.invoice-summary .invoice-payment-method img {width:104px;}
.invoice-summary .invoice-totals {grid-column:2;grid-row:1;border:0;background:transparent;padding:0;margin:0;font-size:13px;}
.invoice-summary .invoice-totals p {margin:0 0 18px;}
.invoice-summary .invoice-totals h3 {font-size:18px;padding-top:8px;}
@media(max-width:600px){.invoice-summary {grid-template-columns:minmax(0,1fr);gap:24px;}.invoice-summary .invoice-totals {grid-column:1;grid-row:2;}}
@media print{.invoice-summary {grid-template-columns:minmax(0,1fr) minmax(0,1fr);}.invoice-summary .invoice-totals {grid-column:2;grid-row:1;}}

.invoice-summary .invoice-payment {border:1px solid var(--invoice-gold);border-radius:4px;padding:14px;background:var(--invoice-tint);}
.invoice-summary .invoice-totals {padding-top:14px;}

/* One full-width frame around payment details and all totals. */
.invoice-summary {border:1px solid var(--invoice-gold);border-radius:4px;background:var(--invoice-tint);padding:16px;box-sizing:border-box;}
.invoice-summary .invoice-payment {border:0;border-radius:0;background:transparent;padding:0;}
.invoice-summary .invoice-totals {padding:0;}
.invoice-closing,.invoice-closing p:last-child {font-weight:700;color:var(--invoice-rose);text-shadow:none;}

.capture-preview {display:block;max-width:100%;max-height:220px;object-fit:contain;margin:16px auto;}
.capture-text {white-space:pre-wrap;overflow-wrap:anywhere;max-height:180px;overflow:auto;font-size:12px;}
#capture-flow label {display:block;margin-block:12px;}

/* Account-specific mobile navigation appearance; opaque fallback without blur. */
@media(max-width:767px){
 :root[data-mobile-bar-style] .bottom-nav{--bar-bg:var(--paper);--bar-ink:var(--ink);--bar-blue:var(--mobile-blue);--bar-green:var(--mobile-green);--bar-purple:var(--mobile-purple);--bar-orange:var(--mobile-orange);background:var(--bar-bg);color:var(--bar-ink)}
 .bottom-nav button,.bottom-nav button.active{color:var(--bar-ink)}
 .bottom-nav button.active{background:color-mix(in srgb,var(--bar-ink) 10%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--bar-ink) 12%,transparent)}
 :root[data-mobile-bar-mode=light] .bottom-nav{--bar-bg:var(--mobile-light-bg);--bar-ink:var(--mobile-light-ink)}
 :root[data-mobile-bar-mode=dark] .bottom-nav,:root[data-mode=dark][data-mobile-bar-mode=app] .bottom-nav{--bar-bg:var(--mobile-dark-bg);--bar-ink:var(--mobile-dark-ink);--bar-blue:var(--mobile-blue-dark);--bar-green:var(--mobile-green-dark);--bar-purple:var(--mobile-purple-dark);--bar-orange:var(--mobile-orange-dark)}
 [data-mobile-icon-size=small] .bottom-nav svg{width:18px;height:18px}
 [data-mobile-icon-size=medium] .bottom-nav svg{width:23px;height:23px}
 [data-mobile-icon-size=large] .bottom-nav svg{width:29px;height:29px}
 [data-mobile-icon-color=theme] .bottom-nav svg{color:var(--color-primary)}
 [data-mobile-icon-color=colour] .bottom-nav svg{color:var(--bar-blue)}
 [data-mobile-icon-color=colour] .bottom-nav :is([data-view=inventory],[data-view=banking],[data-view=money],[data-view=sales]) svg{color:var(--bar-green)}
 [data-mobile-icon-color=colour] .bottom-nav :is([data-view=documents],[data-view=insights],[data-action=assistant]) svg{color:var(--bar-purple)}
 [data-mobile-icon-color=colour] .bottom-nav :is([data-view=gold],[data-view=finance],[data-view=bizreports]) svg{color:var(--bar-orange)}
 :root[data-mobile-bar-style=glass] .bottom-nav{left:8px;right:8px;bottom:env(safe-area-inset-bottom);border-radius:24px;padding:8px;border:1px solid color-mix(in srgb,var(--bar-ink) 18%,transparent);box-shadow:var(--shadow-2)}
 @supports(backdrop-filter:blur(20px)){
  :root[data-mobile-bar-style=glass] .bottom-nav{background:color-mix(in srgb,var(--bar-bg) 86%,transparent);backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%)}
 }
 :root[data-contrast=high] .bottom-nav{background:var(--paper);color:var(--ink);backdrop-filter:none;-webkit-backdrop-filter:none;border-color:var(--ink)}
 :root[data-contrast=high] .bottom-nav button,:root[data-contrast=high] .bottom-nav svg{color:var(--ink)}
}
@media(max-width:767px){
 [data-mobile-icon-size=small] .bottom-nav .rounded-app-icon{width:28px;height:28px}
 [data-mobile-icon-size=medium] .bottom-nav .rounded-app-icon{width:34px;height:34px}
 [data-mobile-icon-size=large] .bottom-nav .rounded-app-icon{width:40px;height:40px}
 .bottom-nav button{gap:5px;border-radius:18px;min-height:64px}
 .bottom-nav button.active .icon-tile{opacity:.23}
 .bottom-nav .rounded-app-icon{flex-shrink:0}
}
.mobile-menu .rounded-app-icon{width:32px;height:32px;flex-shrink:0}

.security-preview{white-space:pre-wrap;overflow-wrap:anywhere;max-height:20rem;overflow:auto}.security-hash{overflow-wrap:anywhere}#data-security input{max-width:100%;min-width:0}#data-security .actions{flex-wrap:wrap}.security-lock-screen{position:fixed;inset:0;width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border:0;margin:0;background:var(--color-background);color:var(--color-text-primary);z-index:99999}.security-lock-screen[open]{display:grid;place-items:center}.security-lock-screen form{width:min(28rem,90vw)}

#security-list-result{overflow-wrap:anywhere}#data-security form{display:grid;gap:var(--space-3);margin-block:var(--space-4)}#data-security details{margin-block:var(--space-4)}#data-security select{width:100%;min-width:0}#data-security label{display:grid;gap:var(--space-2)}
