/* SPN V8.5.28. Original responsive presentation; no external UI dependencies.
   This file is loaded last. Screen rules do not change the PDF/print layout. */
@media screen {
  html { --spn-sidebar:248px; --spn-gap:20px; font-size:16px; scroll-padding-top:24px; }
  html:not([data-theme="dark"]) {
    --bg:#f3f6fb; --panel:#fff; --text:#172b43; --muted:#586d83; --line:#dce5ef;
    --blue:#1766bd; --green:#147b46; --red:#bb3447; --orange:#aa6512; --purple:#6851b5;
    --shadow:0 4px 20px #152e4b06; --soft:#f5f8fc;
  }
  html[data-theme="dark"] {
    --bg:#0e1825; --panel:#162435; --text:#eef4fc; --muted:#afbed0; --line:#314358;
    --blue:#87bfff; --green:#6ce5ab; --red:#ff9298; --soft:#1c2e43;
    --shadow:0 4px 20px #0002;
  }
  html body { background:var(--bg); color:var(--text); font-size:14px; line-height:1.5; }
  html body .app-shell { grid-template-columns:var(--spn-sidebar) minmax(0,1fr); }
  html body .main { width:100%; max-width:2400px; min-width:0; margin-inline:auto; padding:0 clamp(16px,2vw,40px) 36px; }
  html body .sidebar { width:var(--spn-sidebar); padding:24px 16px; background:var(--panel); box-shadow:none; border-color:var(--line); }
  html body .brand { padding-inline:4px; gap:10px; }
  html body .brand strong { font-size:15px; }
  html body .brand small, html body .integration-card :is(p,small) { font-size:12px; }
  html body .nav-item { min-height:46px; font-size:14px; line-height:1.4; padding:11px 12px; text-decoration:none; }
  html body .nav-item.active { color:var(--blue); background:var(--soft); box-shadow:inset 3px 0 var(--blue); }
  html body .nav-item:hover { background:var(--soft); }
  html body .integration-card { margin-top:24px; background:var(--soft); }
  html body .admin-nav-group { margin-inline:0; }
  html body .admin-nav-group>summary { font-size:12px; min-height:44px; }
  html body .topbar { height:auto; min-height:100px; padding:20px 0; gap:16px; flex-wrap:wrap; background:transparent; box-shadow:none; }
  html body .title-wrap { min-width:220px; }
  html body .topbar h1 { font-size:22px; line-height:1.3; white-space:normal; overflow:visible; }
  html body .topbar p { color:var(--muted); font-size:13px; white-space:normal; }
  html body .v3-badge { color:var(--blue)!important; background:var(--soft)!important; border-color:var(--line)!important; font-size:11px; vertical-align:middle; }
  html body .top-actions { display:flex; flex-wrap:wrap; gap:8px; max-width:100%; padding:0; overflow:visible; }
  html body .top-actions select { width:auto; min-width:180px; max-width:100%; margin:0; flex:1 1 180px; }
  html body .top-actions .btn { white-space:normal; }
  html body .current-user { min-width:0; max-width:160px; overflow-wrap:anywhere; }
  html body .current-user strong { font-size:13px; }
  html body .current-user small { font-size:11px; }
  html body :is(.btn,.mini-btn,.link-btn,.export-card,.nav-item,.pro-month-nav,.pro-month-today) { touch-action:manipulation; }
  html body :is(.btn,.mini-btn,.link-btn) { min-height:40px; max-width:100%; font-size:13px; line-height:1.4; white-space:normal; overflow-wrap:anywhere; }
  html body .btn { padding:10px 14px; border-radius:10px; }
  html body .btn.primary { background:#1766bd; color:#fff; box-shadow:none; }
  html body .btn.primary:hover { background:#11559f; }
  html body :is(.btn.secondary,.icon-btn,.mini-btn) { background:var(--panel); border:1px solid var(--line); color:var(--text); }
  html body .mini-btn { padding:7px 10px; display:inline-flex; align-items:center; justify-content:center; text-decoration:none; }
  html body .mini-btn.delete, html body .danger-lite { color:var(--red); }
  html body :is(.icon-btn,.close) { width:44px; height:44px; min-width:44px; min-height:44px; flex:0 0 44px; font-size:20px; }
  html body :is(input,select,textarea) { min-width:0; max-width:100%; font-size:16px; line-height:1.4; color:var(--text); background:var(--panel); border-color:var(--line); }
  html body :is(input,select):not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="hidden"]) { min-height:44px; }
  html body textarea { resize:vertical; }
  html body input:is([type="checkbox"],[type="radio"]) { min-width:18px; min-height:18px; accent-color:#1766bd; }
  html body label { min-width:0; font-size:13px; color:var(--text); }
  html body :is(.panel,.metric-card,.simple-card,.account-card,.export-card,.insight) { border:1px solid var(--line)!important; border-radius:16px!important; background:var(--panel); box-shadow:var(--shadow); min-width:0; }
  html body .panel { overflow:visible; padding:20px; }
  html body .panel-head { flex-wrap:wrap; gap:12px; }
  html body :is(.panel-head,.section-toolbar)>* { min-width:0; max-width:100%; }
  html body :is(.panel h2,.panel h3) { font-size:17px; line-height:1.4; }
  html body :is(.panel p,.panel-head p,.section-toolbar p,.notice span,.empty) { font-size:13px; line-height:1.6; overflow-wrap:anywhere; }
  html body :is(.section-toolbar,.backup-actions,.demo-banner,.url-item,.account-actions) { flex-wrap:wrap; }
  html body .section-toolbar h2 { font-size:23px; }
  html body :is(.filters,.toolbar-actions,.button-row,.row-actions) { min-width:0; max-width:100%; flex-wrap:wrap; gap:8px; }
  html body .filters>* { min-width:0; max-width:100%; }
  html body .filters input { flex:1 1 150px; width:auto; }
  html body .filters select { flex:1 1 180px; width:auto; }
  html body .toolbar-actions { width:auto; display:flex; }
  html body .toolbar-actions .btn { width:auto; }
  html body :is(.form-grid,.report-form,.settings-columns,.history-grid,.export-grid,.accounts-grid,.indicator-grid,.business-config-grid,.backup-status-grid,.backup-options-grid,.backup-path-grid) { min-width:0; gap:16px; }
  html body :is(.form-grid,.report-form,.settings-columns,.history-grid,.export-grid,.accounts-grid,.indicator-grid,.business-config-grid,.backup-status-grid,.backup-options-grid,.backup-path-grid)>* { min-width:0; max-width:100%; }
  html body .form-grid.three { grid-template-columns:repeat(3,minmax(0,1fr)); }
  html body .form-grid.two { grid-template-columns:repeat(2,minmax(0,1fr)); }
  html body .report-form { grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr)); }
  html body :is(.cards.four,.cards.three,.efi-cards,.boleto-cards) { grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))!important; }
  html body :is(.metric-card,.simple-card) { grid-column:auto!important; padding:18px; min-height:104px; }
  html body :is(.metric-card span,.simple-card span,.account-info,.account-top small) { font-size:13px; }
  html body :is(.metric-card strong,.simple-card strong) { font-size:25px; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
  html body :is(.metric-card small,.export-card small,.insight p,.insight small,.legend-row small,.bar-head) { font-size:12px; line-height:1.5; }
  html body :is(.export-card strong,.insight h4,.legend-row strong) { font-size:14px; }
  html body :is(.table-scroll,.chart-scroll) { min-width:0; max-width:100%; overflow:auto; overscroll-behavior-inline:contain; -webkit-overflow-scrolling:touch; }
  html body .table-scroll { scrollbar-width:thin; }
  html body .table-panel table { width:100%; display:table; }
  html body .table-panel thead { display:table-header-group; }
  html body .table-panel tbody { display:table-row-group; }
  html body .table-panel tr { display:table-row; }
  html body .table-panel td { display:table-cell!important; }
  html body .table-panel td::before { display:none; }
  html body .table-panel :is(th,td) { font-size:13px; padding:13px 12px; line-height:1.5; }
  html body .table-panel th { font-size:11px; color:var(--muted); }
  html body .table-panel td { border-color:var(--line)!important; }
  html body :is(.status,.status-chip,.expense-scope-badge) { font-size:11px; white-space:normal; }
  html body .desc-cell { overflow-wrap:anywhere; }
  html body .row-actions { min-width:0!important; }
  html body .table-panel tbody tr:hover { background:var(--soft); }
  html body .chart-scroll { margin-inline:0; width:100%; }
  html body .chart-scroll svg { min-width:0; }
  html body :is(.attachment-chip a,.receipt-gallery-card small) { font-size:12px; }
  html body .receipt-gallery-grid { grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr)); gap:16px; }
  html body .receipt-gallery-card { padding:14px; background:var(--panel); }
  html body .receipt-gallery-card img { height:220px; }
  html body .receipt-gallery-card .button-row { align-items:stretch; }
  html body .receipt-gallery-card .button-row>* { flex:1 1 100px; }
  html body .attachment-chip { min-width:0; }
  html body :is(.attachment-chip a,.pc-recovery-path,.url-item code,.status-row code) { overflow-wrap:anywhere; }
  html body .pc-recovery-path { font-size:14px; }
  html body :is(.pro-recent-main,.pro-recent-side,.pro-month-card,.pro-donut-legend) { min-width:0; overflow-wrap:anywhere; }
  html body #section-dashboard { --bank-accent:var(--blue); --bank-surface:var(--panel); --bank-ink:var(--text); --bank-line:var(--line); --bank-muted:var(--muted); }
  html body #section-dashboard .pro-dashboard-head { flex-wrap:wrap; gap:20px; margin:12px 0 24px; }
  html body #section-dashboard .pro-dashboard-head h2 { font-size:clamp(26px,2.4vw,36px); letter-spacing:-.025em; }
  html body #section-dashboard .pro-dashboard-head p { font-size:14px; }
  html body #section-dashboard .pro-live-line { font-size:12px; }
  html body #section-dashboard .pro-dashboard-controls { display:flex; flex-wrap:wrap; min-width:0; max-width:100%; gap:10px; }
  html body #section-dashboard .pro-month-control { min-width:0; max-width:100%; grid-template-columns:44px minmax(0,1fr) auto 44px!important; }
  html body #section-dashboard .pro-month-control input { width:100%!important; min-width:0; min-height:44px; }
  html body #section-dashboard :is(.pro-month-nav,.pro-month-today) { min-height:44px; font-size:12px; }
  html body #section-dashboard .pro-month-nav { min-width:44px; font-size:22px; }
  html body #section-dashboard .pro-kpi-grid { grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:16px!important; }
  html body #section-dashboard .pro-kpi { min-height:150px; padding:22px; border-radius:16px; grid-column:auto; }
  html body #section-dashboard .pro-kpi:first-child { background:#143d69!important; border-color:#143d69; }
  html body #section-dashboard .pro-kpi strong { font-size:clamp(24px,2vw,34px); line-height:1.3; overflow-wrap:anywhere; }
  html body #section-dashboard .pro-kpi small { font-size:12px; }
  html body #section-dashboard .pro-kpi-top { font-size:13px; }
  html body #section-dashboard .pro-panel { padding:22px!important; }
  html body #section-dashboard .panel-head h2 { font-size:18px; }
  html body #section-dashboard .panel-head p { font-size:13px; }
  html body #section-dashboard .pro-action-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  html body #section-dashboard .pro-action { flex-direction:row; text-align:left; align-items:center; justify-content:flex-start; min-height:88px; padding:16px; gap:12px; }
  html body #section-dashboard .pro-action>span { flex:0 0 40px; color:var(--blue); background:var(--soft); }
  html body #section-dashboard .pro-action strong { font-size:14px; }
  html body #section-dashboard .pro-action small { display:block; margin-top:4px; font-size:12px; color:var(--muted); }
  html body #section-dashboard .pro-dashboard-grid-top { grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)!important; }
  html body #section-dashboard .pro-recent-list { max-height:400px; }
  html body #section-dashboard .pro-recent-main strong { font-size:14px; white-space:normal; }
  html body #section-dashboard :is(.pro-recent-main small,.pro-recent-side small) { font-size:12px; }
  html body #section-dashboard .pro-recent-side strong { font-size:15px; white-space:normal; }
  html body #section-dashboard .pro-monthly-grid { grid-template-columns:repeat(auto-fit,minmax(min(100%,170px),1fr)); }
  html body #section-dashboard .pro-month-card { display:flex; flex-direction:column; align-items:stretch; }
  html body #section-dashboard .pro-month-card>span { font-size:12px; }
  html body #section-dashboard .pro-month-card small { display:flex; flex-wrap:wrap; font-size:12px; }
  html body #section-dashboard .pro-month-card small b { font-size:12px; white-space:normal; }
  html body #section-dashboard .pro-month-card>strong { font-size:19px; }
  html body #section-dashboard :is(.pro-chart-foot,.pro-dashboard-status,.pro-monthly-year-total,.pro-card-note) { font-size:12px; flex-wrap:wrap; gap:10px; }
  html body #section-dashboard .pro-donut-layout { flex-wrap:wrap; min-width:0; }
  html body #section-dashboard .pro-donut-legend { min-width:0; }
  html body dialog.modal { inset:0 0 auto!important; top:calc(var(--spn-visible-top,0px) + var(--spn-visible-height,100dvh) / 2)!important; transform:translateY(-50%); margin:0 auto!important; width:min(760px,calc(100% - 32px))!important; max-width:calc(100% - 32px)!important; max-height:calc(100vh - 32px)!important; max-height:calc(var(--spn-visible-height,100dvh) - 32px)!important; border:1px solid var(--line); border-radius:18px!important; background:var(--panel)!important; color:var(--text); overflow:auto!important; overscroll-behavior:contain; padding:0; }
  html body dialog.modal.wide { width:min(1180px,calc(100% - 32px))!important; }
  html body dialog.modal.spn-dialog-padded { padding:24px!important; }
  html body dialog.modal form { max-height:none!important; overflow:visible!important; width:100%; padding:24px; border-radius:0!important; background:var(--panel); }
  html body dialog.modal .modal-head { position:static; min-width:0; gap:16px; background:var(--panel); }
  html body dialog.modal .modal-head h2 { font-size:23px; overflow-wrap:anywhere; }
  html body dialog.modal .modal-head p { font-size:13px; }
  html body dialog.modal .close { flex:0 0 44px!important; }
  html body dialog.modal .modal-actions { position:static; background:var(--panel); padding:16px 0 0; flex-wrap:wrap; }
  html body #expenseFocusDialog .expense-focus-table { max-width:100%; overflow:auto; }
  html body #expenseFocusDialog .expense-focus-summary { grid-template-columns:repeat(3,minmax(0,1fr))!important; }
  html body #expenseFocusDialog .expense-focus-actions { display:flex; flex-wrap:wrap; }
  html body #expenseFocusDialog .expense-focus-actions .btn { font-size:13px; min-height:44px; }
  html body .login-overlay { padding:20px; overflow:auto; align-items:safe center; }
  html body .login-card { width:min(440px,100%); max-height:none; padding:28px; flex-shrink:0; }
  html body .login-card :is(p,small) { font-size:13px; }
  html body .spn-display-options { display:grid; gap:16px; margin-block:20px; }
  html body .spn-display-options label { display:flex; align-items:flex-start; gap:12px; padding:16px; background:var(--soft); border:1px solid var(--line); border-radius:12px; }
  html body .spn-display-options input { width:auto; margin-top:4px; }
  html body .spn-display-options strong,html body .spn-display-options small { display:block; }
  html body .spn-display-options small { color:var(--muted); font-size:13px; font-weight:400; }
  html body #appearanceOpenV26 { margin-top:8px; width:100%; }
  html body .spn-skip-link { position:fixed; top:-100px; left:12px; z-index:200; padding:12px 18px; background:var(--panel); color:var(--blue); border:2px solid var(--blue); border-radius:10px; }
  html body .spn-skip-link:focus { top:12px; }
  html body :is(button,a,input,select,textarea,summary,[tabindex]):focus-visible { outline:3px solid var(--blue)!important; outline-offset:3px; box-shadow:0 0 0 5px var(--panel); }
  html body .mobile-bottom-nav { grid-template-columns:repeat(var(--spn-nav-count,6),minmax(0,1fr))!important; }
  html body .mobile-bottom-nav :is(button,a) { min-height:52px; font-size:12px; color:var(--muted); text-decoration:none; }
  html body .mobile-bottom-nav :is(button,a) small { font-size:11px!important; white-space:normal; line-height:1.2; }
  html body .mobile-bottom-nav :is(button,a).active { color:var(--blue); background:var(--soft); }
  html body :is(.toast,.loading) { max-width:min(600px,calc(100vw - 24px)); font-size:14px; overflow-wrap:anywhere; }
  html body #expenseManualRows td[data-label="Ações"] { position:static; }
  /* Hidden states belong to permissions and application flow at every size. */
  html body .hidden,html body [hidden],html body .page-section:not(.active) { display:none!important; }
}

@media screen and (max-width:1199px) {
  html body .app-shell { display:block; }
  html body .main { grid-column:auto; max-width:100%; }
  html body .sidebar { width:min(340px,calc(100vw - 40px)); transform:translateX(-110%); visibility:hidden; z-index:80; padding-top:max(20px,env(safe-area-inset-top)); padding-bottom:max(20px,env(safe-area-inset-bottom)); transition:transform .18s ease; box-shadow:12px 0 36px #10233d22; }
  html body .sidebar.open { transform:none; visibility:visible; }
  html body .sidebar-close,html body .mobile-menu { display:grid!important; }
  html body .sidebar-close { margin-left:auto; }
  html body .sidebar-backdrop { position:fixed; inset:0; z-index:70; background:#07192a80; border:0; padding:0; }
  html body .sidebar.open + .sidebar-backdrop { display:block; }
  html body.menu-open { overflow:hidden; }
  html body .topbar { position:static; display:flex; margin:0 0 16px; padding:18px 0; border-bottom:1px solid var(--line); border-radius:0; color:var(--text); }
  html body .title-wrap { min-width:0; flex:1; }
  html body .topbar :is(h1,.title-wrap p) { color:var(--text); }
  html body .top-actions { width:100%; }
  html body .top-actions :is(.quick-receipt,.pwa-install-action,.theme-toggle,#logoutButton,.mobile-menu) { background:var(--panel)!important; color:var(--text)!important; border:1px solid var(--line)!important; }
  html body .top-actions #newTransactionTop { width:auto; height:auto; }
  html body .top-actions #shutdownButton:not(.hidden) { display:grid!important; }
  html body .current-user { display:none!important; }
  html body :is(.business-layout,.pix-conference-layout,.settings-columns,.history-grid) { grid-template-columns:minmax(0,1fr); }
  html body .indicator-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media screen and (max-width:800px) {
  html body .main { padding-inline:16px; }
  html body :is(.grid-main,.grid-bottom,.settings-columns,.history-grid,.export-grid,.wa-web-grid,.business-config-grid,.backup-path-grid,.backup-options-grid,.backup-status-grid) { grid-template-columns:minmax(0,1fr)!important; }
  html body .section-toolbar { align-items:stretch; flex-direction:column; }
  html body .filters { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); width:100%; }
  html body .filters :is(input,select) { width:100%; }
  html body .filters .btn { width:100%; }
  html body .form-grid.three { grid-template-columns:repeat(2,minmax(0,1fr)); }
  html body #section-dashboard :is(.pro-dashboard-grid-top,.pro-dashboard-grid-bottom) { grid-template-columns:minmax(0,1fr)!important; }
  html body #section-dashboard .pro-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  html body #section-dashboard .pro-kpi:first-child { grid-column:1/-1; }
  html body #section-dashboard .pro-kpi:last-child { grid-column:1/-1; }
  html body #section-dashboard .pro-action-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  html body #section-dashboard .pro-history-panel { order:0; }
  html body #section-dashboard .pro-dashboard-controls { width:100%; }
  html body #section-dashboard .pro-month-control { width:100%; }
  html body #section-dashboard .pro-export { width:100%; }
  html body #section-dashboard .pro-kpi .pro-spark { display:none; }
  /* One labeled cell per row: nested descriptions/buttons keep their DOM grouping. */
  html body :is(.table-panel,.expense-focus-table) table { display:block; min-width:0!important; width:100%; }
  html body :is(.table-panel,.expense-focus-table) thead { position:absolute; width:1px; height:1px; clip:rect(0,0,0,0); clip-path:inset(50%); overflow:hidden; display:block; white-space:nowrap; }
  html body :is(.table-panel,.expense-focus-table) tbody { display:grid!important; gap:14px; width:100%; }
  html body :is(.table-panel,.expense-focus-table) tr { display:block; width:100%; min-width:0; border:1px solid var(--line)!important; border-radius:12px!important; padding:4px 14px!important; background:var(--panel)!important; box-shadow:none!important; }
  html body :is(.table-panel,.expense-focus-table) td,html body #expenseFocusDialog .expense-focus-table td { display:block!important; width:100%; min-width:0; max-width:none; padding:10px 0!important; white-space:normal!important; border-bottom:1px solid var(--line)!important; font-size:14px!important; text-align:left; overflow-wrap:anywhere; }
  html body :is(.table-panel,.expense-focus-table) td::before { content:attr(data-label); display:block; margin-bottom:5px; font-size:11px!important; line-height:1.3; color:var(--muted); text-transform:uppercase; font-weight:700; }
  html body :is(.table-panel,.expense-focus-table) td[colspan]::before { display:none; }
  html body :is(.table-panel,.expense-focus-table) td:last-child { border-bottom:0!important; }
  html body .table-panel td .row-actions { display:flex; }
  html body .table-panel td .row-actions .mini-btn { min-height:44px; }
  html body #expenseFocusDialog .expense-focus-table { overflow:visible; }
}

@media screen and (max-width:720px) {
  html body { padding-bottom:calc(88px + env(safe-area-inset-bottom)); }
  html body .topbar { gap:12px; }
  html body .topbar h1 { font-size:19px; }
  html body .topbar .mobile-menu { background:var(--panel)!important; color:var(--text)!important; border-color:var(--line)!important; }
  html body .top-actions { display:flex!important; gap:8px; }
  html body .top-actions select { flex-basis:100%; }
  html body .top-actions :is(.quick-receipt,.pwa-install-action,#newTransactionTop) { flex:1 1 130px; }
  html body .top-actions :is(.theme-toggle,#logoutButton,#shutdownButton) { width:44px; height:44px; }
  html body .panel,html body #section-dashboard .pro-panel { padding:16px!important; }
  html body .btn,html body .mini-btn { min-height:44px; }
  html body .mobile-bottom-nav { left:0; right:0; bottom:0; border-radius:0; padding:6px max(4px,env(safe-area-inset-right)) calc(6px + env(safe-area-inset-bottom)) max(4px,env(safe-area-inset-left)); background:var(--panel)!important; border-top:1px solid var(--line)!important; box-shadow:0 -4px 20px #172b4310; overflow:visible; }
  html body .mobile-bottom-nav :is(button,a) { display:grid; place-items:center; gap:4px; padding:6px 2px; min-width:0; }
  html body .mobile-bottom-nav :is(button,a) span { font-size:21px!important; }
  html body .mobile-bottom-nav :is(button,a).hidden { display:none!important; }
  html body #section-dashboard .pro-kpi { padding:18px; min-height:138px; }
  html body #section-dashboard .pro-kpi strong { font-size:25px; }
  html body #section-dashboard .pro-kpi:first-child strong { font-size:34px; }
  html body #section-dashboard .pro-action { padding:12px; min-height:88px; }
  html body #section-dashboard .pro-action strong { font-size:13px; }
  html body #section-dashboard .pro-action small { display:none; }
  html body #section-dashboard .pro-recent-item { display:grid; grid-template-columns:minmax(0,1fr); gap:8px; }
  html body #section-dashboard .pro-recent-side { text-align:left; display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; }
  html body #section-dashboard .pro-monthly-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  html body .chart { max-width:100%; }
  html body :is(.form-grid.two,.form-grid.three,.permission-grid) { grid-template-columns:minmax(0,1fr); }
  html body .form-grid [style*="grid-column"] { grid-column:1/-1!important; }
  html body .modal .modal-actions { display:flex; }
  html body .modal .modal-actions>* { flex:1 1 160px; }
  html body dialog.modal { width:calc(100% - 16px)!important; max-width:calc(100% - 16px)!important; max-height:calc(100vh - 16px)!important; max-height:calc(var(--spn-visible-height,100dvh) - 16px)!important; border-radius:14px!important; }
  html body dialog.modal.spn-dialog-padded,html body dialog.modal form { padding:16px!important; }
  html body dialog.modal .modal-head h2 { font-size:21px; }
  html body #expenseFocusDialog .expense-focus-summary { grid-template-columns:minmax(0,1fr)!important; }
  html body #expenseFocusDialog .expense-focus-actions .btn { flex:1 1 140px; }
  html body .login-card { padding:22px; }
  html body :is(.toast,.loading) { left:12px!important; right:12px!important; bottom:calc(90px + env(safe-area-inset-bottom))!important; max-width:none!important; }
  html body.spn-keyboard-open .mobile-bottom-nav { display:none!important; }
}

@media screen and (max-width:420px) {
  html body .main { padding-inline:12px; }
  html body :is(.filters,.accounts-grid,.indicator-grid) { grid-template-columns:minmax(0,1fr)!important; }
  html body #section-dashboard .pro-kpi-grid { grid-template-columns:minmax(0,1fr)!important; }
  html body #section-dashboard .pro-kpi { min-height:125px; }
  html body #section-dashboard .pro-action { flex-direction:column; align-items:flex-start; }
  html body #section-dashboard .pro-monthly-grid { grid-template-columns:minmax(0,1fr); }
  html body #section-dashboard .pro-month-control { grid-template-columns:44px minmax(0,1fr) 44px!important; }
  html body #section-dashboard .pro-month-today { grid-column:1/-1; grid-row:2; }
  html body #section-dashboard #dashboardNextMonth { grid-column:3; grid-row:1; }
}

@media screen and (min-width:1800px) {
  html { --spn-sidebar:276px; }
  html body #section-dashboard .pro-action-grid { grid-template-columns:repeat(6,minmax(0,1fr)); }
  html body #section-dashboard .pro-action { flex-direction:column; align-items:flex-start; }
  html body #section-dashboard .pro-monthly-grid { grid-template-columns:repeat(6,minmax(0,1fr)); }
}

/* Explicit TV mode also works at 1280px: physical TV size is not detectable. */
@media screen and (min-width:1000px) {
  html[data-display="tv"] { --spn-sidebar:300px; }
  html[data-display="tv"] body { font-size:20px; }
  html[data-display="tv"] body .main { max-width:2800px; padding-inline:32px; }
  html[data-display="tv"] body :is(.nav-item,.btn,.mini-btn,.link-btn,label,input,select,textarea,.panel p,.notice span,.status-chip,.table-panel td,.table-panel th,.pro-action strong) { font-size:20px!important; }
  html[data-display="tv"] body :is(.btn,.icon-btn,.mini-btn,.nav-item,input,select,.pro-month-nav,.pro-month-today) { min-height:56px; }
  html[data-display="tv"] body :is(.panel h2,.section-toolbar h2,.topbar h1,dialog.modal .modal-head h2) { font-size:28px!important; }
  html[data-display="tv"] body :is(.panel small,.panel-head p,.pro-kpi-top,.pro-kpi small,.pro-live-line,.pro-recent-main strong,.pro-recent-side strong,.pro-recent-main small,.pro-recent-side small,.pro-month-card small,.pro-month-card small b) { font-size:18px!important; }
  html[data-display="tv"] body #section-dashboard .pro-kpi strong { font-size:40px; }
  html[data-display="tv"] body #section-dashboard .pro-action-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  html[data-display="tv"] body #section-dashboard .pro-kpi-grid { grid-template-columns:repeat(3,minmax(0,1fr))!important; }
  html[data-display="tv"] body #section-dashboard .pro-dashboard-grid-top { grid-template-columns:minmax(0,1fr)!important; }
  html[data-display="tv"] body #section-dashboard .pro-monthly-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  html[data-display="tv"] body dialog.modal { width:min(1100px,calc(100% - 64px))!important; }
  html[data-display="tv"] body dialog.modal.wide { width:min(1500px,calc(100% - 64px))!important; }
}
@media screen and (min-width:2200px) {
  html[data-display="tv"] body #section-dashboard .pro-dashboard-grid-top { grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)!important; }
  html[data-display="tv"] body #section-dashboard .pro-monthly-grid { grid-template-columns:repeat(6,minmax(0,1fr)); }
}
@media screen and (max-height:520px) {
  html body .topbar { position:static; }
  html body dialog.modal .modal-head,html body dialog.modal .modal-actions { position:static; }
  html body .login-overlay { align-items:flex-start; }
}
@media (prefers-reduced-motion:reduce) {
  html body *,html body *::before,html body *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
}
@media print { .spn-skip-link,#appearanceOpenV26,#displayExitTVV26 { display:none!important; } }
