.mobile-fold-toggle,.mobile-row-toggle-cell,.mobile-quick{display:none!important}
.mobile-fold{display:contents}
.mobile-filter-chips{display:contents}
.billing-cycle.period-bar{display:grid;grid-template-columns:minmax(240px,1fr) minmax(240px,1fr);gap:20px 28px;align-items:center;padding:22px 24px;background:#fff;border:1px solid #e5eaf3;box-shadow:0 3px 12px #20345403}
.cycle-heading{display:flex;align-items:center;gap:12px}
.cycle-heading strong{display:block;font-size:15px;color:#243651}
.cycle-heading small{display:block;font-size:12px;color:#8793a7;margin-top:3px}
.cycle-icon{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:#eef3ff;color:#3263ed;font-size:21px}
.billing-cycle .period-selects{justify-content:flex-end;gap:10px}
.billing-cycle .period-selects .field{min-width:0;width:140px}
.billing-cycle .period-selects label{font-size:11px;margin-bottom:5px}
.billing-cycle .period-selects select{height:44px;min-height:44px;padding:8px 12px;background:#f8faff;font-size:14px;border-color:#e2e8f2}
.billing-cycle .period-summary{min-width:0;max-width:none;width:100%;align-self:center;border-top:1px solid #edf0f6;padding-top:18px}
.billing-cycle .period-summary span{font-size:13px}.billing-cycle .period-summary b{font-size:21px}
.billing-cycle .period-summary .progress{height:5px;margin:10px 0 7px;background:#eef2f9}
.billing-cycle .period-summary small{font-size:11px;color:#8390a4}
.billing-cycle .method-sum{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid #edf0f6;padding-top:18px;width:100%}
.billing-cycle .method-sum>div{min-width:0;background:none;border-radius:0;padding:0 0 0 20px;border-left:1px solid #edf0f6}
.billing-cycle .method-sum strong{font-size:20px;letter-spacing:-.5px;margin:5px 0 2px;color:#253854}
.billing-cycle .method-sum small{font-size:11px;color:#8995a7}
@media(max-width:700px){
 .billing-cycle.period-bar{grid-template-columns:1fr;gap:16px;padding:18px}
 .billing-cycle .period-selects{justify-content:stretch;width:100%}
 .billing-cycle .period-selects .field{width:auto;flex:1}
 .billing-cycle .period-summary{padding-top:16px}
 .billing-cycle .method-sum{padding-top:16px}
 .billing-cycle .method-sum>div{padding:0 12px}
 .billing-cycle .method-sum>div:first-child{padding-left:0;border-left:0}
 .billing-cycle .method-sum strong{font-size:19px}
}
@media(max-width:600px){
  body{background:#f5f7fb}
  .shell header{height:58px;padding:0 16px;background:#fff;border-bottom:1px solid #edf0f5}
  .breadcrumb{font-size:12px}.breadcrumb span,.breadcrumb b{display:none}
  .header-right{gap:8px}.header-right .icon-btn{width:36px;height:36px}
  .header-avatar{width:34px;height:34px}
  main{padding:22px 16px calc(92px + env(safe-area-inset-bottom));overflow:clip}
  .page-heading{gap:14px;margin-bottom:20px}
  .page-heading h1{font-size:24px;line-height:1.35;letter-spacing:-.5px}
  .page-heading p{display:none}
  .page-heading .actions{gap:8px;flex-wrap:wrap}
  .head-period{width:100%;display:flex;gap:8px}
  .head-period select{flex:1;min-width:0;background:white}
  .stats.stats-5{gap:10px;margin-bottom:16px}
  .stat{padding:14px;border-radius:14px;box-shadow:none;min-width:0}
  .stat-top{font-size:12px;line-height:1.5}.stat-icon{display:none}
  .stat-value{font-size:24px;line-height:1.3;margin:8px 0 0;letter-spacing:-.6px}
  .stat-value em{font-size:11px;margin-left:3px}.stat-bottom{font-size:11px;margin-top:7px;line-height:1.5}
  .stats-5 .stat:nth-child(1){order:0;background:#edf3ff;border-color:#dce7ff}
  .stats-5 .stat:nth-child(3){order:1}.stats-5 .stat:nth-child(2){order:2}.stats-5 .stat:nth-child(4){order:3}
  .stats-5 .profit-stat{order:4;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 14px}
  .profit-stat .stat-value{font-size:22px;margin:0}.profit-stat .stat-bottom{display:none}
  .card{border-radius:14px;box-shadow:none}.card-head{padding:16px;gap:10px}.card-head h2{font-size:16px}
  .mobile-quick{display:block!important;margin-bottom:16px}.mobile-tasks:not(.mobile-quick){display:none!important}
  .mobile-quick .card-head{padding-bottom:10px}.mobile-quick .todo{padding:13px 16px;gap:12px;cursor:pointer}
  .mobile-quick .todo p{display:none}.mobile-quick .todo strong{font-size:13px}.mobile-quick .todo-icon{width:32px;height:32px;font-size:18px}
  .mobile-quick .todo b{font-size:15px}.mobile-quick .todo:focus-visible{outline:2px solid #3263ed;outline-offset:-3px}
  .mobile-fold{display:block;margin:0 0 10px;border:1px solid #e4e9f1;border-radius:14px;background:white;overflow:hidden}
  .mobile-fold-toggle{display:flex!important;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:54px;padding:14px 16px;border:0;background:white;color:#28364b;font:600 14px inherit;text-align:left;font-family:inherit}
  .mobile-fold-toggle::after{content:'＋';font-size:20px;font-weight:400;color:#738198}
  .mobile-fold.is-open>.mobile-fold-toggle::after{content:'−'}
  .mobile-fold:not(.is-open)>.mobile-fold-body{display:none}
  .mobile-fold-body>.card{border:0;border-radius:0;margin:0!important}
  [data-view=dashboard]>.split{display:block;margin:0}
  .mobile-fold .date-filters{padding:0 14px 14px!important;margin:0!important}
  .filters{margin-bottom:14px;gap:8px}.filters .btn{font-size:13px;padding:8px 14px;min-height:40px}
  .mobile-filter-chips{display:flex;width:100%;gap:8px;overflow-x:auto;scrollbar-width:none;padding:2px 0 6px}
  .mobile-filter-chips .btn{white-space:nowrap;flex:none}
  .mobile-fold-toggle{font-size:14px;font-weight:600}
  .mobile-row-toggle{font-size:12px}
  .tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:0}
  .tab{white-space:nowrap;flex-shrink:0;font-size:14px;padding:12px 14px}
  .period-inline{display:flex;gap:8px;margin-bottom:16px}.period-inline .field{flex:1;margin:0;min-width:0}
  .period-inline .period-label{display:none}.period-inline .field label{font-size:12px}
  table.stack tbody{display:grid;gap:12px;padding:12px}
  table.stack tbody tr{background:#fff;border:1px solid #e6ebf2;border-radius:12px;padding:14px;gap:10px 12px;box-shadow:none}
  table.stack td{font-size:13px;overflow-wrap:anywhere}
  table.stack td:first-child{grid-column:auto;font-size:18px;font-weight:600}
  table.stack td:first-child::before{display:none}
  table.stack td:nth-child(2):has(.badge){text-align:right;align-self:center}
  table.stack td:nth-child(2):has(.badge)::before{display:none}
  table.stack td[data-label]::before{font-size:10px;letter-spacing:.1px;margin-bottom:3px}
  table.stack tr:not(.mobile-expanded)>.mobile-secondary{display:none!important}
  table.stack td.mobile-row-toggle-cell{display:block!important;grid-column:1/-1;padding:0!important}
  .mobile-row-toggle{width:100%;min-height:38px;background:#f6f8fc;border:0;border-radius:8px;color:#52709c;font:12px inherit;font-family:inherit}
  table.stack td.no-label{grid-column:1/-1}
  table.stack .btn,table.stack .text-btn{font-size:13px;min-height:40px;padding:8px 12px}
  table.stack .badge{font-size:11px;white-space:normal}
  aside{background:#fff;border-top:1px solid #e4e9f1;box-shadow:0 -4px 20px #21385806}
  .mnav{height:64px;padding:4px 8px;gap:4px}.mnav button{color:#8490a4;font-size:10px;border-radius:12px;gap:5px}
  .mnav button.active{color:#3263ed;background:#edf3ff;font-weight:700}.mnav button span{font-size:22px}
  dialog{width:100%!important;max-width:100%!important;max-height:92dvh!important;margin:auto 0 0;padding:20px 18px calc(22px + env(safe-area-inset-bottom));border-radius:22px 22px 0 0;box-sizing:border-box}
  .form-grid,.bm-grid{grid-template-columns:1fr!important;gap:14px}
  .field{min-width:0}.field label{font-size:13px}input,select,textarea{max-width:100%}
  .padded{padding:16px}.billing-section-head{flex-wrap:wrap;gap:12px}
  .menu-grid{grid-template-columns:repeat(2,1fr)}
  .shell footer{display:none}
}

/* Billing filters: status navigation above payment channel and search. */
.bill-filters{margin:0 0 20px;background:#fff;border:1px solid #e4eaf3;border-radius:14px;overflow:hidden}
.bill-status-tabs{display:flex;overflow-x:auto;gap:4px;padding:0 16px;border-bottom:1px solid #edf0f6;scrollbar-width:thin}
.bill-status{display:flex;align-items:center;justify-content:center;gap:7px;flex:1;white-space:nowrap;min-height:54px;padding:12px 9px;border:0;border-bottom:3px solid transparent;background:none;color:#768298;font-family:inherit;font-size:13px;cursor:pointer}
.bill-status b{font-size:11px;font-weight:600;background:#f1f4f8;color:#8390a4;padding:2px 7px;border-radius:6px;line-height:1.5}
.bill-status.selected{color:#3263ed;border-bottom-color:#3263ed;font-weight:600}
.bill-status.selected b{background:#eaf0ff;color:#3263ed}
.bill-status:hover{background:#f8faff}.bill-status:focus-visible,.bill-method:focus-visible{outline:2px solid #3263ed;outline-offset:-3px}
.bill-filter-tools{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px}
.bill-methods{display:flex;align-items:center;gap:8px;white-space:nowrap}
.bill-filter-label{font-size:11px;color:#929caf;margin-right:4px}
.bill-method{display:flex;align-items:center;gap:8px;min-height:36px;padding:6px 11px;border:1px solid #e6ebf3;background:white;border-radius:8px;color:#64738a;font-family:inherit;font-size:12px;cursor:pointer}
.bill-method span{font-size:11px;color:#96a0b0}.bill-method.selected{border-color:#aac0ff;background:#edf3ff;color:#3263ed}.bill-method.selected span{color:#3263ed}
.bill-search{display:flex;align-items:center;gap:8px;background:#f7f9fc;border:1px solid #e7edf4;border-radius:9px;padding:0 12px;min-width:180px;width:260px;color:#8c9ab0}
.bill-search>span{font-size:24px;line-height:1}.bill-search input{border:0;background:none;min-width:0;width:100%;min-height:40px;padding:8px 0;font-size:12px;box-shadow:none}
.bill-search:focus-within{border-color:#3263ed;box-shadow:0 0 0 2px #3263ed12}
@media(max-width:700px){.bill-filter-tools{flex-wrap:wrap;gap:12px}.bill-search{width:100%}.bill-status-tabs{padding:0 10px}.bill-status{flex:none;padding:12px 10px}.bill-methods{width:100%}.bill-method{flex:1;justify-content:center;min-height:40px}.bill-search input{min-height:44px}.bill-filter-label{font-size:11px}}

.building-overview{margin-bottom:24px;overflow:hidden}
.building-overview .card-head{align-items:center;border-bottom:0;padding-bottom:18px}
.building-period{font-size:11px;color:#8491a4;white-space:nowrap;background:#f5f7fb;padding:6px 10px;border-radius:7px}
.building-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:0 20px}
.building-card{padding:18px;border:1px solid #e6ebf3;border-radius:13px;min-width:0;background:#fff}
.building-card.building-total{background:#f7f9ff;border-color:#dce5ff}
.building-title{display:flex;align-items:center;gap:8px;margin-bottom:20px}
.building-title h3{font-size:14px;margin:0;color:#2a3c58;white-space:nowrap}
.building-mark{display:grid;place-items:center;width:29px;height:29px;border-radius:8px;color:#3263ed;background:#edf2ff;font-size:13px;font-weight:700}
.building-vacant{margin-left:auto;font-size:10px;color:#8996a9;white-space:nowrap}
.building-occupancy{display:flex;align-items:center;justify-content:space-between;gap:8px}
.building-occupancy>strong{font-size:25px;color:#243650;line-height:1.3}
.building-occupancy small{display:inline;font-size:11px;font-weight:400;color:#8b96a8}
.building-occupancy>span{font-size:11px;color:#3263ed}
.building-card>.progress{height:4px;margin:10px 0 22px;background:#ecf0f7}
.building-income>span,.building-profit>span{font-size:11px;color:#7d8a9e;display:block}
.building-income>strong{display:block;font-size:23px;color:#159f89;letter-spacing:-.6px;margin:5px 0}
.building-income>small{font-size:10px;color:#92a0b2}
.building-due{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:16px 0;margin:15px 0;border-top:1px solid #e8edf5;border-bottom:1px solid #e8edf5}
.building-due>span:first-child{font-size:11px;color:#8a96a9}
.building-due strong{display:block;font-size:16px;color:#34455e;margin-top:4px}
.building-late{font-size:10px;color:#cd836d;background:#fff3ee;padding:4px 6px;border-radius:6px;white-space:nowrap}
.building-profit>strong{display:block;font-size:19px;letter-spacing:-.4px;margin:5px 0}
.building-profit>small{font-size:10px;color:#9aa4b3}
.building-details{margin-top:18px;border-top:1px solid #e5ebf5;padding-top:12px}
.building-details summary{font-size:11px;color:#577099;cursor:pointer;min-height:32px;align-content:center}
.building-detail{display:flex;justify-content:space-between;gap:10px;font-size:11px;padding:10px 0;border-bottom:1px solid #edf0f5;color:#66778f}
.building-detail small{display:block;font-size:10px;color:#97a2b3;margin-top:3px}.building-detail strong{font-size:11px;font-weight:600;white-space:nowrap}
.building-note{font-size:11px;color:#919daf;margin:16px 20px 20px;line-height:1.6}
@media(min-width:701px) and (max-width:1050px){.building-cards{gap:10px;padding:0 16px}.building-card{padding:14px}.building-income>strong{font-size:20px}.building-title{gap:6px}.building-title h3{font-size:13px}}
@media(max-width:700px){.building-cards{grid-template-columns:1fr;padding:0 16px;gap:12px}.building-overview .card-head{flex-wrap:wrap;gap:8px}.building-card{padding:18px}.building-title{margin-bottom:14px}.building-income>strong{font-size:26px}.building-card>.progress{margin-bottom:18px}.building-note{margin:14px 16px 18px}}

.staff-overview{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:24px 0 20px}
.staff-eyebrow{font-size:10px;letter-spacing:1.2px;color:#8c9bb0}.staff-overview h2{font-size:19px;margin-top:5px}.staff-overview h2>span{font-size:12px;font-weight:400;color:#8796ab;margin-left:8px}
.staff-counts{display:flex;gap:20px;font-size:11px;color:#8593a8}.staff-counts b{font-size:18px;color:#435873;margin-right:4px}
.employee-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.employee-card{border:1px solid #e4eaf3;border-radius:16px;background:white;padding:20px;min-width:0}.employee-off{opacity:.7}
.employee-head{display:flex;align-items:center;gap:12px}.employee-avatar{width:44px;height:44px;display:grid;place-items:center;border-radius:13px;background:#edf2ff;color:#5378d5;font-size:18px;flex-shrink:0}.employee-avatar.tone-1{background:#eaf7f3;color:#409b85}.employee-avatar.tone-2{background:#fff4e5;color:#bc955b}
.employee-head h3{font-size:14px;margin:0 0 5px;color:#283b58}.employee-state{font-size:10px;color:#50a58d}.employee-state.inactive{color:#c27c77}
.employee-edit{margin-left:auto;border:1px solid #e4eaf4;background:white;color:#5675a6;font-family:inherit;font-size:11px;min-height:36px;padding:6px 12px;border-radius:8px;cursor:pointer}.employee-edit:hover{background:#f3f7ff}
.employee-wage{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#f7f9fc;padding:14px 16px;border-radius:11px;margin:18px 0}
.employee-wage div>span{display:block;font-size:10px;color:#8e9aab;margin-bottom:5px}.employee-wage strong{font-size:22px;letter-spacing:-.5px;color:#2a405e}.employee-wage strong small{display:inline;font-size:11px;font-weight:400;letter-spacing:0;color:#8a98ac}
.employee-meta{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding-bottom:16px}.employee-meta>span{font-size:10px;color:#8a98ac}.employee-meta strong{display:block;font-size:12px;font-weight:500;color:#566b86;margin-top:5px}
.employee-account,.employee-sso{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid #edf1f6;padding:12px 0;font-size:11px;color:#8b98ab}
.employee-account>div{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.employee-account code{font-size:11px;color:#657b9b}.employee-account .badge{font-size:10px}.employee-sso{padding-bottom:0;cursor:pointer;min-height:40px}.employee-sso input{width:18px!important;height:18px!important;min-height:18px;accent-color:#3263ed}
@media(min-width:1450px){.employee-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.staff-overview{align-items:flex-start;flex-direction:column;gap:12px}.staff-counts{gap:18px}.employee-grid{grid-template-columns:1fr;gap:12px}.employee-card{padding:18px}.employee-edit{min-height:40px}.employee-sso{min-height:44px}}

/* One employee per row, with a compact horizontal desktop layout. */
.employee-grid{grid-template-columns:minmax(0,1fr)}
@media(min-width:701px){
 .employee-card{display:grid;grid-template-columns:minmax(190px,1.3fr) minmax(170px,1fr) minmax(150px,1fr);gap:12px 20px;padding:18px 20px;align-items:center}
 .employee-head{grid-column:1;grid-row:1 / 3;position:relative;padding-bottom:42px}
 .employee-edit{position:absolute;bottom:0;left:56px;margin:0}
 .employee-wage{grid-column:2;grid-row:1 / 3;margin:0;padding:14px;flex-wrap:wrap}
 .employee-meta{grid-column:3;grid-row:1;padding:0;gap:8px}
 .employee-account{grid-column:2;grid-row:3;padding:10px 0 0}
 .employee-sso{grid-column:3;grid-row:2 / 4;padding:10px 0 0;margin:0}
}
@media(min-width:1350px){
 .employee-card{grid-template-columns:minmax(220px,1.3fr) minmax(190px,1fr) minmax(190px,1fr) minmax(170px,1fr);gap:18px}
 .employee-head{grid-row:1 / 3}.employee-wage{grid-row:1 / 3}.employee-meta{grid-row:1 / 3}
 .employee-account{grid-column:4;grid-row:1;border-top:0;padding:0}.employee-sso{grid-column:4;grid-row:2}
}

/* Compact employee rows. */
@media(min-width:701px){
 .employee-grid{gap:8px}
 .employee-card{grid-template-columns:minmax(180px,1.3fr) minmax(145px,1fr) minmax(145px,1fr) minmax(130px,.9fr);gap:6px 16px;padding:12px 16px;border-radius:10px}
 .employee-head{grid-column:1;grid-row:1 / 3;padding-bottom:0;gap:9px;flex-wrap:wrap}
 .employee-avatar{width:32px;height:32px;border-radius:9px;font-size:14px}
 .employee-head h3{font-size:12px;margin-bottom:3px}.employee-state{font-size:9px}
 .employee-edit{position:static;min-height:28px;padding:3px 8px;font-size:10px;margin-left:41px;margin-top:-3px}
 .employee-wage{grid-column:2;grid-row:1 / 3;background:none;padding:0;gap:5px;display:block}
 .employee-wage div>span{display:none}.employee-wage strong{font-size:16px;letter-spacing:0}.employee-wage strong small{font-size:10px}
 .employee-wage>.badge{display:inline-block;margin-top:4px;font-size:9px;padding:2px 6px}
 .employee-meta{grid-column:3;grid-row:1 / 3;gap:5px;display:block}.employee-meta>span{display:flex;justify-content:space-between;gap:6px;font-size:9px;margin:4px 0}.employee-meta strong{font-size:10px;margin:0}
 .employee-account{grid-column:4;grid-row:1;padding:0;border:0;font-size:9px;gap:5px}.employee-account>span{display:none}.employee-account>div{justify-content:flex-start;gap:5px}.employee-account code{font-size:10px}.employee-account .badge{font-size:9px;padding:2px 5px}
 .employee-sso{grid-column:4;grid-row:2;border:0;min-height:24px;padding:0;font-size:9px;justify-content:flex-start;gap:10px}.employee-sso input{width:15px!important;height:15px!important;min-height:15px}
 .staff-overview{margin:16px 0 12px}.staff-overview h2{font-size:16px}.staff-eyebrow{display:none}
}
@media(min-width:701px) and (max-width:1000px){.employee-card{grid-template-columns:minmax(160px,1.2fr) minmax(120px,1fr) minmax(135px,1fr);gap:6px 14px}.employee-head{grid-row:1 / 3}.employee-wage{grid-row:1}.employee-meta{grid-column:3;grid-row:1 / 3}.employee-account{grid-column:2;grid-row:2}.employee-sso{grid-column:3;grid-row:3}.employee-edit{margin-top:0}}
@media(max-width:700px){
 .employee-grid{gap:8px}.employee-card{padding:12px 14px;border-radius:11px}.employee-head{gap:9px}.employee-avatar{width:32px;height:32px;font-size:14px}.employee-head h3{font-size:13px}.employee-edit{min-height:36px;padding:5px 9px}
 .employee-wage{padding:8px 10px;margin:10px 0}.employee-wage strong{font-size:18px}.employee-wage div>span{display:none}.employee-meta{padding-bottom:8px;gap:8px}.employee-meta strong{margin-top:2px}.employee-account{padding:8px 0}.employee-sso{min-height:36px;padding-top:5px}.staff-overview{margin:14px 0 12px;gap:6px}
}