@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+Gujarati:wght@400;500;600;700&display=swap');
:root{--bg-main:#f5f6f8;--bg-card:#fff;--text-primary:#202e29;--text-secondary:#63716d;--text-muted:#76837e;--border-color:#e5eae7;--accent-emerald-light:#1d7954;--accent-rose:#ba3f40;--accent-amber:#ad7929;--radius-md:12px;--font-mono:ui-monospace,SFMono-Regular,Consolas,monospace;--green:#24634c;--green-dark:#163d32;--font-main:'DM Sans','Noto Sans Gujarati',sans-serif}
*{box-sizing:border-box}body{margin:0;font-family:var(--font-main);font-size:14px;color:var(--text-primary);background:var(--bg-main);line-height:1.55}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}a{color:var(--green)}button,input,select,textarea{outline-offset:3px}button:focus-visible,a:focus-visible{outline:3px solid #77b59b}h1,h2,h3,p{margin:0}h1{font-size:27px;letter-spacing:-.8px;font-weight:600}h2{font-size:19px;letter-spacing:-.4px;font-weight:600}h3{font-size:15px;font-weight:600}small,.muted{color:var(--text-muted)}.icon{width:20px;height:20px;display:inline-block;flex-shrink:0;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}.app-container{display:flex;min-height:100vh}.app-sidebar{width:246px;flex-shrink:0;background:#fff;border-right:1px solid var(--border-color);position:sticky;top:0;height:100vh;display:flex;flex-direction:column;padding:29px 18px 18px;z-index:25}.brand{display:flex;align-items:center;gap:11px;padding:0 7px 31px}.brand-mark{height:42px;width:42px;display:grid;place-items:center;background:var(--green-dark);color:#fff;border-radius:11px;font-size:17px;font-weight:700;flex-shrink:0}.brand-name{font-size:16px;font-weight:700;line-height:1.35}.brand-sub{font-size:9px;letter-spacing:1.6px;color:var(--text-muted);margin-top:5px}.nav-label{font-size:10px;font-weight:700;color:#98a29e;letter-spacing:1.7px;margin:25px 12px 12px}.sidebar-nav{display:flex;flex-direction:column;gap:6px}.nav-link{display:flex;align-items:center;gap:12px;width:100%;background:none;border:0;border-radius:8px;color:#74817b;text-align:left;padding:12px 13px;font-size:13px;font-weight:500;text-decoration:none}.nav-link:hover{background:#f5f8f6;color:var(--green)}.nav-link.active{color:var(--green);background:#eaf3ed;font-weight:600}.nav-badge{margin-left:auto;font-size:10px;min-width:23px;text-align:center;border-radius:5px;padding:1px 6px;background:#eaf0ec;color:#658071}.sidebar-bottom{margin-top:auto;padding-top:25px}.local-card{padding:14px;border:1px solid var(--border-color);background:#fafcfb;border-radius:10px;font-size:11px;color:var(--text-muted)}.local-card strong{display:block;color:#4c675b;font-size:12px;margin-bottom:4px}.status-dot{width:7px;height:7px;background:#539a72;border-radius:50%;display:inline-block;margin-right:6px}.lang-toggle{margin-top:14px;display:flex;gap:9px;align-items:center;width:100%;padding:9px;border:0;background:none;color:#5b6c62;font-size:12px}.app-main{min-width:0;flex:1}.app-header{height:79px;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:0 35px;border-bottom:1px solid var(--border-color);background:#fff}.breadcrumb{font-size:12px;color:#8b9590;display:flex;gap:13px;align-items:center}.breadcrumb strong{color:#4d6055;font-weight:500}.header-end{display:flex;gap:20px;align-items:center}.header-date{font-size:11px;color:#76847c}.avatar{width:33px;height:33px;background:#edf1e7;color:#648041;border:1px solid #dfe7d4;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:700}.page-container{padding:30px 35px;max-width:1700px;margin:auto;min-height:calc(100vh - 134px)}.page-title-row{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:25px}.page-title-row p{font-size:12px;color:var(--text-muted);margin-top:5px}.actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.btn{display:inline-flex;justify-content:center;align-items:center;gap:8px;padding:10px 16px;border-radius:7px;border:1px solid var(--border-color);font-size:12px;font-weight:600;line-height:1.5;background:#fff;color:#45574c;text-decoration:none;white-space:nowrap}.btn:hover{filter:brightness(.97);border-color:#bdcbc3}.btn .icon{width:16px;height:16px}.btn-primary{background:var(--green);color:#fff;border-color:var(--green);box-shadow:0 2px 3px #1a473215}.btn-danger{color:#b83b3b;background:#fff5f5;border-color:#f1d9d9}.btn-sm{padding:7px 10px;font-size:11px}.text-btn{background:none;border:0;color:var(--green);font-size:12px;font-weight:600;padding:4px}.icon-button{border:1px solid var(--border-color);background:#fff;color:#68776e;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;font-size:22px}.icon-button .icon{width:15px;height:15px}.welcome-card{position:relative;display:flex;justify-content:space-between;gap:20px;background:#ecf3ec;border:1px solid #dce8da;border-radius:12px;padding:25px 27px;margin-bottom:25px;overflow:hidden}.welcome-card h2{color:#284d39;font-size:20px;margin:7px 0}.eyebrow{color:#60806c;font-size:9px;font-weight:700;letter-spacing:1.9px}.welcome-card p{font-size:12px;color:#768674;max-width:490px}.welcome-card .btn{margin-top:17px;background:#fff;border-color:#d1ddcc;color:#365d43}.welcome-steps{display:flex;align-items:center;gap:12px;flex-shrink:0}.step-circle{height:49px;width:49px;border:1px solid #cbdcc7;border-radius:50%;display:grid;place-items:center;background:#f6faf3;color:#628257;margin:0 auto 8px}.step-circle .icon{width:21px;height:21px}.welcome-step{text-align:center;font-size:10px;color:#6a806b}.step-line{width:25px;height:1px;background:#cadac5;margin-bottom:24px}.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:17px;margin-bottom:24px}.stat-card{background:#fff;border:1px solid var(--border-color);border-radius:10px;padding:19px 20px}.stat-top{display:flex;justify-content:space-between;gap:8px;color:#76837a;font-size:11px;font-weight:500}.stat-icon{height:29px;width:29px;border-radius:7px;background:#f0f5ef;display:grid;place-items:center;color:#6b8b62}.stat-icon .icon{width:16px;height:16px}.stat-card:nth-child(2) .stat-icon{background:#fdf4e5;color:#bc944f}.stat-card:nth-child(3) .stat-icon{background:#eef1fa;color:#7d8ec0}.stat-card:nth-child(4) .stat-icon{background:#edf5f0;color:#4f9970}.stat-value{font-size:26px;line-height:1.4;font-weight:600;letter-spacing:-1px;margin:10px 0 6px;font-variant-numeric:tabular-nums}.stat-sub{font-size:10px;color:#8d9890}.positive{color:#327b55}.negative{color:#ba4545}.overview-grid{display:grid;grid-template-columns:1.75fr 1fr;gap:22px;margin-bottom:25px}.card{background:#fff;border:1px solid var(--border-color);border-radius:11px;overflow:hidden}.card-header{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:20px 22px}.card-header p{font-size:11px;color:var(--text-muted);margin-top:3px}.card-body{padding:0 22px 20px}.chart{height:155px;display:flex;gap:14px;align-items:end;border-bottom:1px solid #edf0ec;padding:0 8px;margin:3px 0 9px;background:repeating-linear-gradient(to top,transparent 0,transparent 37px,#f3f5f2 38px,#f3f5f2 39px)}.chart-column{display:flex;flex:1;flex-direction:column;justify-content:end;height:100%;gap:5px;align-items:center}.chart-bar{width:55%;min-height:3px;background:#c9dccb;border-radius:4px 4px 0 0;max-width:43px}.chart-column:last-child .chart-bar{background:#427955}.chart-labels{display:flex;gap:14px;padding:0 8px;color:#8c968d;font-size:10px}.chart-labels span{flex:1;text-align:center}.legend{font-size:10px;color:#81907f;display:flex;gap:5px;align-items:center}.legend i{width:8px;height:8px;border-radius:2px;background:#aac7ad}.summary-item{display:flex;justify-content:space-between;gap:15px;padding:13px 0;border-bottom:1px solid #f0f3ef;font-size:12px}.summary-item:last-child{border:0}.summary-item small{display:block;font-size:10px;margin-top:3px}.summary-item strong{font-weight:600;font-variant-numeric:tabular-nums}.summary-icon{display:flex;gap:12px;align-items:center}.summary-icon .icon{color:#849c78}.pill{display:inline-block;font-size:10px;font-weight:500;line-height:1.5;padding:4px 9px;border-radius:5px;background:#f2f5ef;color:#768363;white-space:nowrap}.pill.kapachi{color:#836e4c;background:#f6f0e5}.pill.reti{color:#7082a3;background:#edf2f8}.pill.paid{background:#eaf5ee;color:#458062}.pill.unpaid,.pill.partial{background:#fff4df;color:#b48b42}.pill.overdue,.pill.void{background:#fbecec;color:#b96868}.table-responsive{overflow:auto}.data-table{border-collapse:collapse;width:100%;text-align:left;white-space:nowrap;font-size:11px}.data-table th{font-weight:500;color:#8b968e;padding:12px 18px;background:#fafbf9;border-top:1px solid #edf0eb;border-bottom:1px solid #edf0eb;font-size:10px}.data-table td{padding:15px 18px;border-bottom:1px solid #f0f2ef;color:#58685e}.data-table tbody tr:last-child td{border-bottom:0}.data-table tbody tr:hover{background:#fbfcfa}.data-table td strong{font-weight:500;color:#3d5145}.data-table td small{display:block;font-size:10px;max-width:210px;overflow:hidden;text-overflow:ellipsis}.data-table .num{text-align:right;font-variant-numeric:tabular-nums}.data-table .row-actions{display:flex;gap:5px}.table-footer{display:flex;justify-content:space-between;gap:12px;padding:14px 22px;border-top:1px solid #f0f2ed;font-size:10px;color:#8b978d;align-items:center}.empty-state{padding:38px 20px;text-align:center;color:var(--text-muted)}.empty-state>.icon{width:35px;height:35px;color:#9cad99;margin-bottom:12px}.empty-state h3{color:#61715f;margin-bottom:6px}.empty-state p{font-size:12px;margin:0 auto 15px;max-width:420px}.filter-bar{display:flex;gap:10px;flex-wrap:wrap;padding:16px 21px;border-top:1px solid #eef1ec}.search-wrap{position:relative;flex:1;min-width:180px}.search-wrap .icon{position:absolute;left:11px;top:11px;width:16px;height:16px;color:#a1ab9f}.search-wrap input{padding-left:35px}.filter-bar select,.filter-bar input{font-size:11px}.filter-bar input[type=date]{width:134px}.filter-field{display:flex;flex-direction:column;gap:3px}.filter-field label{font-size:9px;color:#869580}.filter-bar:has(.filter-field){align-items:end}.material-tabs{display:flex;gap:5px}.material-tabs button{background:none;border:0;padding:7px 12px;color:#8b958a;font-size:11px;border-radius:6px}.material-tabs button.active{color:#4c744f;background:#eef4e9}.app-footer{padding:13px 35px;border-top:1px solid var(--border-color);font-size:10px;color:#939c95;display:flex;justify-content:space-between}.notice{background:#fff8e8;border:1px solid #f0e5c8;padding:12px 16px;border-radius:8px;margin-bottom:20px;color:#927b4c;font-size:12px;display:flex;justify-content:space-between;gap:12px;align-items:center}.notice.error{background:#fff0ef;color:#a84444;border-color:#f0cdcb}.settings-grid{display:grid;grid-template-columns:2fr 1fr;gap:23px;align-items:start}.settings-stack{display:grid;gap:22px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}.form-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.form-field{display:flex;flex-direction:column;gap:6px;min-width:0}.form-field label{font-size:11px;font-weight:500;color:#6a796d}.form-field.full{grid-column:1/-1}.form-control,input,select,textarea{width:100%;padding:10px 11px;background:#fff;border:1px solid #dfe6dd;border-radius:6px;color:#465948;min-height:38px}input:focus,select:focus,textarea:focus{outline:2px solid #c3d8bd;border-color:#8eaf84}input[readonly]{background:#f5f8f3;color:#6d8565}input::placeholder,textarea::placeholder{color:#a6afa2}input[type=checkbox],input[type=radio]{width:15px;min-height:15px;accent-color:var(--green)}textarea{resize:vertical;min-height:80px}.form-help{font-size:10px;color:#8a9882}.form-section{margin-bottom:24px}.form-section h3{display:flex;gap:10px;align-items:center;padding-bottom:12px;margin-bottom:16px;border-bottom:1px solid #edf0e9;font-size:13px}.section-number{display:inline-grid;place-items:center;background:#edf4e8;color:#6c8c58;font-size:10px;width:23px;height:23px;border-radius:6px}.live-totals{background:#eff5ea;border:1px solid #dce8d3;border-radius:8px;display:grid;grid-template-columns:repeat(4,1fr);gap:15px;padding:15px;margin:18px 0}.live-totals small{display:block;font-size:10px;color:#849878;margin-bottom:4px}.live-totals strong{font-size:16px;font-weight:600}.modal-backdrop{position:fixed;inset:0;background:#132f244d;backdrop-filter:blur(3px);z-index:100;display:flex;justify-content:center;align-items:center;padding:25px}.modal-backdrop[hidden]{display:none}.modal-window{background:#fff;border-radius:13px;box-shadow:0 20px 80px #17372630;width:100%;max-width:880px;max-height:92vh;display:flex;flex-direction:column;overflow:hidden}.modal-window.small{max-width:500px}.modal-window form{display:flex;flex-direction:column;min-height:0}.modal-header{padding:20px 25px;border-bottom:1px solid var(--border-color);display:flex;align-items:center;justify-content:space-between;gap:16px}.modal-header h2{font-size:18px}.modal-header p{font-size:11px;color:var(--text-muted);margin-top:4px}.modal-body{padding:23px 25px;overflow:auto;min-height:0}.modal-footer{padding:17px 25px;border-top:1px solid var(--border-color);display:flex;justify-content:flex-end;align-items:center;gap:10px;background:#fcfdfb}.modal-footer>span{margin-right:auto;font-size:11px;color:#8b9884}.invoice-window{max-width:1020px}.invoice-modal-body{background:#e7ebe7}.invoice-preview-container{box-shadow:0 2px 12px #253d2512!important;border-radius:2px!important}.toast{position:fixed;bottom:24px;right:25px;z-index:300;background:#244c37;color:#fff;border:1px solid #40654c;box-shadow:0 6px 30px #163f2520;padding:14px 22px;max-width:450px;border-radius:9px;font-size:13px}.toast.error{background:#a54747}.toast[hidden]{display:none}.mobile-menu{display:none}.skip-link{position:fixed;left:10px;top:-100px;z-index:500;background:#fff;padding:10px}.skip-link:focus{top:10px}.text-right{text-align:right}.text-center{text-align:center}.font-mono{font-family:var(--font-mono)}.font-bold{font-weight:700}.text-muted{color:var(--text-muted)}.text-amber{color:#9d7535}.help-list{padding-left:21px;color:#7f8e77;font-size:12px;display:grid;gap:14px}.help-list strong{color:#586d4e;display:block}.selected-summary{display:flex;justify-content:space-between;align-items:center;background:#f1f6ed;border:1px solid #e0ead9;border-radius:7px;padding:12px 15px;margin-top:15px;font-size:12px}.ledger-head{padding:20px 22px;background:#f6f9f2;border-bottom:1px solid #e6edde}.ledger-head small{display:block;margin-top:4px}.error-inline{color:#ad4444;font-size:12px;margin-bottom:12px}.draft-stamp{padding:7px 10px;background:#fff2d8;color:#99772e;font-weight:700;letter-spacing:1px;text-align:center;font-size:11px;margin-bottom:10px}
[hidden],.app-container[hidden],.auth-screen[hidden]{display:none!important}
.auth-screen{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;background:#fff}.auth-brand{background:#163d32;color:white;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:70px 13%;position:relative}.auth-brand .brand-mark{background:#d9e7ca;color:#264b33;margin-bottom:30px}.auth-brand .eyebrow{color:#a3bb9c}.auth-brand h1{font-size:clamp(35px,4vw,60px);line-height:1.2;font-weight:500;letter-spacing:-2px;margin:20px 0}.auth-brand p{color:#aec2b4;max-width:280px;font-size:14px}.auth-tag{border-top:1px solid #3c5f51;padding-top:25px;margin-top:65px;color:#bdd0b9;font-size:12px}.auth-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:50px 25px}.auth-card{width:100%;max-width:390px;display:grid;gap:20px}.auth-card h2{font-size:27px;margin-top:5px}.auth-card>p{font-size:12px;color:#7d8b80;line-height:1.8}.auth-card .form-field{gap:8px}.auth-card input{min-height:46px}.auth-submit{width:100%;padding:13px}.auth-help{text-align:center}.auth-footer{margin-top:50px;font-size:10px;color:#9ba69c}.password-field{position:relative}.password-field input{padding-right:65px}.password-field button{position:absolute;right:7px;top:9px;background:none;border:0;font-size:11px;padding:5px;color:#557560}.password-page{grid-column:1/-1;min-height:100vh;display:grid;place-items:center;background:#f3f6f1;padding:25px}.password-page .auth-card{padding:30px;background:white;border:1px solid var(--border-color);border-radius:12px;max-width:430px}.user-session{padding:12px 5px 0;border-top:1px solid var(--border-color);margin-top:12px}.user-session strong{display:block;font-size:12px}.user-session small{font-size:10px}.permission-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.permission-option{display:flex;align-items:flex-start;gap:10px;padding:12px;border:1px solid #e1e8dd;border-radius:7px;font-size:12px;cursor:pointer}.permission-option input{margin-top:3px;flex-shrink:0}.permission-option:has(input:checked){background:#f0f6eb;border-color:#aec9a3}.permission-option span{line-height:1.5}.account-status{display:inline-flex;align-items:center;gap:5px}.read-only-note{font-size:11px;color:#86937e}.migration-note{margin-bottom:20px}.app-sidebar{overflow-y:auto}.access-error{padding:60px 25px;text-align:center}.access-error h2{margin-bottom:10px}.btn:disabled{opacity:.5;cursor:wait}@media(max-width:720px){.auth-screen{grid-template-columns:1fr}.auth-brand{display:none}.auth-panel{min-height:100vh}.permission-grid{grid-template-columns:1fr}.auth-card h2{font-size:25px}.auth-footer{margin-top:35px}}@media print{#authScreen{display:none!important}}
@media(min-width:1600px){.page-container{padding-top:38px}.welcome-card{padding:32px}.stat-card{padding:25px}.chart{height:190px}}
@media(max-width:1180px){.app-sidebar{width:217px;padding-left:12px;padding-right:12px}.page-container{padding:25px}.app-header{padding:0 25px}.welcome-steps{gap:8px}.step-line{width:12px}.stats-grid{gap:12px}.stat-card{padding:16px}.stat-value{font-size:22px}.overview-grid{grid-template-columns:1.4fr 1fr}}
@media(max-width:960px){.welcome-steps{display:none}.page-title-row{align-items:flex-start}.page-title-row .actions{justify-content:flex-end}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.overview-grid,.settings-grid{grid-template-columns:1fr}.app-sidebar{width:205px}.header-date{display:none}.form-grid.three{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
@media print{.draft-stamp{display:none}.invoice-preview-container{min-width:0!important}.invoice-sheet thead{display:table-header-group}.invoice-sheet tfoot{display:table-row-group}.invoice-sheet tr{break-inside:avoid}.invoice-sheet .inv-footer-grid,.invoice-sheet .inv-signatures{break-inside:avoid}#modalInvoiceViewer[hidden]{display:none!important}}

/* Keep wide business tables inside their cards, including tablet grid layouts. */
.account-period { margin-bottom: 20px; }
.account-period .filter-bar { align-items: center; border-top: 0; }
.account-period .form-help { flex: 1 1 240px; }
.account-tabs { display: flex; gap: 8px; padding: 16px; flex-wrap: wrap; border-bottom: 1px solid var(--border-color); }
.account-table td { font-variant-numeric: tabular-nums; }
.account-print h2 { margin-top: 12px; }
.account-print > p { margin: 8px 0 18px; }
.account-print .inv-table td { white-space: normal; overflow-wrap: anywhere; }
@media screen {
  html { -webkit-text-size-adjust: 100%; }
  .page-container:focus { outline: none; }
  .card, .settings-stack, .overview-grid > *, .settings-grid > *, .stat-card { min-width: 0; }
  .brand > div:last-child, .page-title-row > div, .card-header > div, .summary-item > div { min-width: 0; }
  .brand-name, .user-session, .page-title-row, .stat-value, .summary-item,
  .modal-header, .selected-summary, .notice, .app-footer { overflow-wrap: anywhere; }
  .stat-icon, .icon-button, .avatar { flex-shrink: 0; }
  .table-responsive { max-width: 100%; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
  .modal-header, .modal-footer { flex-shrink: 0; }
  .modal-window { max-height: calc(100dvh - 50px); }
  .modal-window form { overflow: hidden; }
  .modal-body { overscroll-behavior: contain; }
  .modal-header > div { min-width: 0; }
  .invoice-preview-container { min-width: 760px; }
  .nav-backdrop { display: none; }
  .auth-panel, .auth-card { min-width: 0; }
}

/* Phones and tablets share a drawer so the workspace uses the full screen. */
@media screen and (max-width: 960px) {
  body.navigation-open { overflow: hidden; }
  .app-container { min-height: 100dvh; }
  .app-sidebar {
    position: fixed; inset: 0 auto 0 0; width: min(300px, calc(100% - 48px));
    height: 100vh; height: 100dvh; padding: max(24px, env(safe-area-inset-top)) 18px max(20px, env(safe-area-inset-bottom));
    transform: translateX(-100%); visibility: hidden;
    transition: transform .2s ease, visibility .2s; z-index: 80;
    overscroll-behavior-y: contain; box-shadow: 8px 0 30px #132f2426;
  }
  .app-sidebar.mobile-open { left: 0; transform: translateX(0); visibility: visible; }
  .app-sidebar .brand { padding: 4px 40px 24px 0; align-items: flex-start; }
  .brand-name { font-size: 15px; }
  .brand-sub { letter-spacing: 1px; }
  .sidebar-close { position: absolute; top: max(16px, env(safe-area-inset-top)); right: 10px; }
  .nav-backdrop { display: block; position: fixed; inset: 0; z-index: 75; border: 0; border-radius: 0; background: #132f2473; }
  .mobile-menu { display: inline-flex; }
  .nav-link { min-height: 46px; font-size: 14px; }
  .sidebar-bottom { padding-top: 20px; }
  .local-card > div { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
  .lang-toggle { min-height: 44px; }
  .app-header {
    height: auto; min-height: 68px; padding: max(10px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) 10px max(16px, env(safe-area-inset-left));
    gap: 10px;
  }
  .breadcrumb { min-width: 0; gap: 10px; font-size: 13px; }
  .breadcrumb > span { display: none; }
  .breadcrumb strong { min-width: 0; overflow-wrap: anywhere; }
  .header-end { gap: 6px; flex-shrink: 0; }
  .header-end .text-btn { width: 44px; }
  .page-container { padding: 24px max(22px, env(safe-area-inset-right)) 28px max(22px, env(safe-area-inset-left)); }
  .page-title-row { flex-direction: column; gap: 16px; }
  .page-title-row .actions { justify-content: flex-start; width: 100%; }
  .btn, .text-btn, .icon-button { min-height: 44px; }
  .icon-button { width: 44px; height: 44px; }
  .btn { max-width: 100%; white-space: normal; }
  input:not([type=checkbox]):not([type=radio]), select, textarea,
  .filter-bar input, .filter-bar select { font-size: 16px; min-height: 46px; min-width: 0; }
  input[type=checkbox], input[type=radio] { width: 22px; height: 22px; min-height: 22px; }
  .form-field label { font-size: 12px; }
  .filter-bar { align-items: end; }
  .filter-bar > select { width: auto; flex: 1 1 170px; min-width: 0; }
  .filter-field { min-width: 0; flex: 1 1 140px; }
  .filter-field input[type=date] { width: 100%; }
  .search-wrap { flex: 1 1 100%; min-width: 0; }
  .search-wrap .icon { top: 15px; }
  .material-tabs { flex-wrap: wrap; }
  .material-tabs button { min-height: 44px; }
  .table-footer { flex-wrap: wrap; }
  .data-table { font-size: 12px; }
  .data-table th, .data-table td { padding: 13px 16px; }
  .data-table th { font-size: 11px; }
  .modal-backdrop { padding: max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)); }
  .modal-window { max-height: calc(100dvh - max(12px, env(safe-area-inset-top)) - max(12px, env(safe-area-inset-bottom))); }
  .modal-header, .modal-footer { padding: 14px 18px; }
  .modal-footer { flex-wrap: wrap; gap: 8px; }
  .modal-footer > span { flex: 1 1 100%; }
  .modal-body { padding: 18px; }
  .selected-summary { gap: 12px; flex-wrap: wrap; }
  .live-totals { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .live-totals strong { overflow-wrap: anywhere; }
  .app-footer { padding-bottom: max(16px, env(safe-area-inset-bottom)); }
  .toast { bottom: max(12px, env(safe-area-inset-bottom)); overflow-wrap: anywhere; }
}

@media screen and (max-width: 720px) {
  .page-container { padding: 20px max(16px, env(safe-area-inset-right)) 24px max(16px, env(safe-area-inset-left)); }
  .page-title-row h1 { font-size: 25px; line-height: 1.35; }
  .page-title-row .actions > .btn { flex: 1 1 140px; }
  .welcome-card { padding: 20px; }
  .welcome-card h2 { line-height: 1.5; }
  .stats-grid { gap: 10px; }
  .stat-card { padding: 14px 12px; }
  .stat-top { font-size: 11px; align-items: flex-start; }
  .stat-value { font-size: clamp(19px, 5.3vw, 25px); letter-spacing: -.5px; }
  .stat-sub { font-size: 10px; }
  .overview-grid, .settings-grid { gap: 18px; }
  .card-header { padding: 17px; flex-wrap: wrap; }
  .card-body { padding: 0 17px 18px; }
  .filter-bar { padding: 13px; }
  .notice { align-items: flex-start; flex-direction: column; }
  .app-footer { padding-inline: 16px; gap: 10px; }
  .app-footer span:last-child { display: none; }
  .toast { right: 12px; left: 12px; max-width: none; }
  .chart, .chart-labels { gap: 6px; padding-inline: 0; }
  .chart-labels span { min-width: 0; }
  .chart-labels { font-size: 9px; }
  .form-grid, .form-grid.three, .permission-grid { grid-template-columns: minmax(0, 1fr); }
  .filter-bar > .btn { flex: 1 1 100%; }
  .filter-field { flex-basis: 120px; }
  .modal-header { align-items: flex-start; }
  .modal-header h2 { font-size: 17px; }
  .auth-screen, .auth-panel, .password-page { min-height: 100dvh; }
  .auth-panel { padding: max(32px, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left)); }
  .auth-card { gap: 18px; }
  .password-field button { top: 1px; right: 2px; min-height: 44px; min-width: 54px; }
  .password-page { padding: 16px; }
  .password-page .auth-card { padding: 22px; }
  .auth-footer { text-align: center; overflow-wrap: anywhere; }
}

@media screen and (max-width: 480px) {
  .modal-backdrop { padding: 0; }
  .modal-window, .modal-window.small {
    width: 100%; max-width: none; height: 100vh; height: 100dvh; max-height: 100dvh; border-radius: 0;
  }
  .modal-window form { flex: 1; }
  .modal-body { flex: 1; padding: 18px max(16px, env(safe-area-inset-right)) 18px max(16px, env(safe-area-inset-left)); }
  .modal-header { padding-top: max(14px, env(safe-area-inset-top)); }
  .modal-footer { padding: 12px max(16px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left)); }
  .modal-footer > .btn { flex: 1 1 120px; }
  .modal-footer > .btn-primary { flex-basis: 100%; }
  .live-totals { gap: 12px; padding: 12px; }
  .live-totals strong { font-size: 15px; }
}

/* Leave space for editing when a phone is rotated or its keyboard is open. */
@media screen and (max-width: 960px) and (max-height: 520px) {
  .modal-header { padding-block: 8px; align-items: center; }
  .modal-header p, .modal-footer > span { display: none; }
  .modal-footer { padding-block: 8px; }
  .modal-footer > .btn, .modal-footer > .btn-primary { flex: 1 1 0; }
  .modal-body { padding-block: 12px; }
}