/* X-stats 2. Deliberately independent from the previous stylesheet. */
:root {
  color-scheme:dark;
  --bg:#101316;
  --card:#171b20;
  --card2:#1d2228;
  --stroke:#2b323a;
  --text:#edf1f4;
  --muted:#a6b0bc;
  --accent:#df5666;
  --blue:#df5666;
  --blue2:#df566620;
  --danger:#f1838e;
  --positive:#83c9af;
  --sidebar:232px;
  --body-font:'Onest',system-ui,sans-serif;
  --data-font:'IBM Plex Mono',ui-monospace,monospace
}
*{
  box-sizing:border-box
}
html{
  background:var(--bg);
  scroll-padding-block:86px
}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font:400 14px/1.55 var(--body-font);
  min-width:0;
  -webkit-font-smoothing:antialiased
}
button,input,select,textarea{
  font:inherit
}
button,a,input,select,textarea,summary{
  touch-action:manipulation;
  scroll-margin-block:90px;
  -webkit-tap-highlight-color:transparent
}
a{
  color:inherit;
  text-decoration:none
}
button{
  cursor:pointer
}
button:disabled,input:disabled,select:disabled{
  opacity:.45;
  cursor:not-allowed
}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{
  outline:2px solid #ee8f99;
  outline-offset:3px
}
svg{
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.65;
  stroke-linecap:round;
  stroke-linejoin:round;
  flex-shrink:0
}
img{
  max-width:100%
}
[hidden],.hidden{
  display:none!important
}
.app-topbar,.mobile-tabbar,.page-loader,.xs-help,.xs-quiet,.xs-modern-hide{
  display:none!important
}
.xs-visually-hidden,.xs-table thead.xs-mobile-head{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap
}
.xs-sidebar{
  position:fixed;
  inset:0 auto 0 0;
  width:var(--sidebar);
  padding:28px 16px 16px;
  background:#13171b;
  border-right:1px solid var(--stroke);
  display:flex;
  flex-direction:column;
  z-index:100;
  overflow-y:auto
}
.xs-brand{
  display:flex;
  align-items:center;
  gap:11px;
  padding:0 12px 30px;
  font-size:23px;
  font-weight:700;
  letter-spacing:-1.2px
}
.xs-brand-light{
  font-weight:400;
  color:#b5bdc7;
  letter-spacing:-1px
}
.xs-brand-mark{
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  background:var(--accent);
  border-radius:7px;
  color:white;
  font-weight:700;
  font-size:20px;
  letter-spacing:-1px
}
.xs-navigation{
  display:grid;
  gap:22px
}
.xs-nav-group{
  display:grid;
  gap:4px
}
.xs-nav-label{
  color:#7f8c9b;
  font-size:10px;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  padding:0 12px 7px
}
.xs-nav-link{
  display:flex;
  gap:11px;
  align-items:center;
  min-height:42px;
  padding:9px 12px;
  border-radius:7px;
  color:#aeb8c4;
  font-size:13px;
  font-weight:500;
  border:1px solid transparent
}
.xs-nav-link:hover{
  color:#fff;
  background:#22282e
}
.xs-nav-link[aria-current]{
  background:#322126;
  border-color:#59303a;
  color:#f39ba5
}
.xs-sidebar-foot{
  display:grid;
  gap:5px;
  margin-top:auto;
  padding:24px 7px 0
}
.xs-design-toggle,.xs-logout{
  display:flex;
  align-items:center;
  gap:11px;
  color:#a6b0bc;
  background:transparent;
  border:0;
  padding:10px 5px;
  text-align:left;
  font-size:12px;
  min-height:42px
}
.xs-design-toggle:hover,.xs-logout:hover{
  color:#fff
}
.xs-design-toggle span{
  font-size:22px;
  width:20px;
  text-align:center
}
.xs-topbar{
  height:78px;
  position:sticky;
  top:0;
  z-index:90;
  margin-left:var(--sidebar);
  padding:0 36px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  background:#101316f5;
  border-bottom:1px solid var(--stroke)
}
.xs-team-form{
  margin:0
}
.xs-team-form select{
  max-width:360px!important;
  width:auto!important;
  min-height:40px!important;
  background-color:transparent!important;
  border:1px solid transparent!important;
  padding:7px 28px 7px 0!important;
  font-size:14px!important;
  color:var(--text)
}
.xs-team-form select:hover{
  color:#fff
}
.xs-team-slot{
  min-width:0
}
.xs-team-name{
  font-weight:500
}
.xs-account{
  display:flex;
  align-items:center;
  gap:12px
}
.xs-account-name{
  text-align:right;
  font-size:12px;
  font-weight:500
}
.xs-account-name small{
  display:block;
  color:var(--muted);
  font-size:10px;
  font-weight:400
}
.xs-avatar{
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border:1px solid #414b57;
  border-radius:50%;
  font-size:13px;
  color:#e1e5e9;
  background:#22282f
}
.xs-mobile-brand{
  display:none
}
.xs-bottomnav{
  display:none
}
.xs-skip{
  position:fixed;
  left:250px;
  top:-70px;
  z-index:10000;
  padding:12px;
  background:#fff;
  color:#111;
  border-radius:8px
}
.xs-skip:focus{
  top:10px
}
body.is-authenticated .container{
  width:auto;
  max-width:1600px;
  margin:0 0 0 var(--sidebar);
  padding:30px 36px 70px
}
main,main>*{
  min-width:0
}
main>.card,main>.reports-page{
  width:100%;
  min-width:0;
  background:transparent;
  border:0;
  box-shadow:none;
  padding:0;
  border-radius:0;
  margin:0
}
h1,h2,h3,p{
  margin-top:0
}
h1{
  font-size:28px!important;
  line-height:1.25!important;
  font-weight:600!important;
  letter-spacing:-.8px;
  margin:0 0 24px!important;
  text-wrap:balance
}
h2{
  font-size:18px!important;
  font-weight:600!important;
  line-height:1.35;
  letter-spacing:-.3px;
  margin:26px 0 16px
}
h3{
  font-size:14px;
  font-weight:500;
  margin:0 0 12px
}
.muted{
  color:var(--muted);
  font-size:12px;
  overflow-wrap:anywhere
}
.link{
  color:#b7c2ce;
  min-height:36px;
  display:inline-flex;
  align-items:center;
  font-size:12px;
  font-weight:500
}
.link:hover{
  color:#fff
}
.divider,.sep{
  height:1px;
  border:0;
  background:var(--stroke);
  margin:26px 0
}
.divider.tight{
  margin:14px 0
}
.banner,.reports-alert{
  padding:12px 16px;
  background:#3c252a;
  border:1px solid #70424a;
  border-radius:8px;
  margin:12px 0 20px;
  color:#f9bec5
}
.backup-ok{
  background:#1d312a;
  border-color:#355b49;
  color:#b3dfcd
}
label{
  display:block;
  font-size:12px;
  font-weight:500;
  color:#b4bdc8;
  margin:0 0 8px
}
input:not([type=hidden]):not([type=checkbox]):not([type=radio]),select,textarea{
  width:100%;
  min-width:0;
  max-width:100%;
  min-height:44px;
  border:1px solid #343d47;
  border-radius:8px;
  background:#171b20;
  color:var(--text);
  padding:10px 12px;
  box-shadow:none;
  transition:border-color .12s;
  font-size:14px
}
input::placeholder,textarea::placeholder{
  color:#6e7a88;
  opacity:1
}
input:hover,select:hover,textarea:hover{
  border-color:#4d5968
}
input:focus,select:focus,textarea:focus{
  border-color:#b75e69
}
input[type=checkbox],input[type=radio]{
  accent-color:var(--accent);
  width:18px;
  height:18px;
  flex-shrink:0
}
input[readonly]{
  cursor:pointer
}
option{
  background:#171b20;
  color:var(--text)
}
.btn,.pillbtn{
  min-height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  background:var(--accent);
  color:#fff;
  padding:10px 18px;
  border:1px solid transparent;
  border-radius:8px;
  font-size:13px;
  font-weight:500;
  line-height:1.3;
  white-space:normal;
  transition:background .12s
}
.btn:hover{
  background:#eb6675
}
.btn.danger,.btn-danger{
  background:transparent;
  color:#ee929d;
  border-color:#603840
}
.btn.danger:hover,.btn-danger:hover{
  background:#3b242a
}
.btn.ghost,.pillbtn{
  background:#1d2228;
  border-color:#343d47;
  color:#c2cbd5
}
.btn.ghost:hover,.pillbtn:hover{
  background:#2a313a
}
.btn.sm,.pillbtn{
  font-size:12px;
  padding:8px 12px;
  min-height:38px
}
.inline{
  display:inline-block;
  margin:0
}
.grid3{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  align-items:end
}
.grid3>*,.rowgrid>*{
  min-width:0
}
.grid3>[style*="grid-column"]{
  grid-column:1/-1!important
}
.grid3>div>.btn{
  width:100%
}
.rowgrid{
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(100px,1fr);
  gap:16px
}
.rowbox{
  padding:16px;
  background:#171b20;
  border:1px solid var(--stroke);
  border-radius:8px
}
.filters-bar{
  display:grid;
  grid-template-columns:minmax(220px,1.3fr) minmax(180px,1fr) minmax(180px,1fr) auto;
  gap:12px;
  align-items:end
}
.filters-actions{
  display:flex;
  align-items:center;
  gap:14px
}
.filters-summary{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin:18px 0
}
.badge,.chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:#20272f;
  border:1px solid #303a45;
  color:#bdc7d2;
  border-radius:5px;
  padding:4px 8px;
  font-size:11px;
  font-weight:500;
  line-height:1.5
}
.chip-income{
  background:#1a2d26;
  color:#9ad7bd;
  border-color:#2a453a
}
.chip-expense{
  background:#342229;
  color:#eca0ac;
  border-color:#51313a
}
.badge-dot{
  display:none
}
.table,.xs-table{
  width:100%;
  border-collapse:collapse;
  text-align:left;
  margin:20px 0;
  font-size:12px
}
.table th{
  color:#8f9cab;
  font-size:10px;
  font-weight:500;
  padding:12px 14px;
  text-align:left;
  background:#171b20;
  border-bottom:1px solid #38424e;
  white-space:nowrap
}
.table td{
  padding:15px 14px;
  border-bottom:1px solid #282f37;
  vertical-align:middle;
  overflow-wrap:anywhere
}
.table tbody tr:hover{
  background:#161b20
}
.table .btn{
  min-height:34px;
  padding:7px 12px;
  font-size:11px
}
.table td b,.table td strong{
  font-weight:600
}
.xs-table-scroll{
  width:100%;
  max-width:100%;
  overflow-x:auto;
  overscroll-behavior-inline:contain
}
.xs-table-scroll .table{
  margin:0
}
.money,.histAmt,.managerMetric strong,.managerStat strong,.weekBalVal,.kpiValue,.dashboard-kpi .pill{
  font-family:var(--data-font);
  font-variant-numeric:tabular-nums;
  font-weight:500!important;
  letter-spacing:-.5px
}
.show-more-wrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding-top:18px
}
.show-more-btn{
  background:#20272f;
  color:#cbd3dd;
  border:1px solid #3b4652
}
.segTabs{
  display:flex;
  flex-wrap:wrap;
  gap:4px;
  align-items:center;
  margin:20px 0;
  padding:4px;
  background:#171b20;
  border:1px solid var(--stroke);
  border-radius:9px;
  width:fit-content;
  max-width:100%
}
.segTab{
  padding:9px 15px;
  border-radius:6px;
  color:#9eabba;
  font-size:12px;
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-align:center
}
.segTab:hover{
  background:#232a32;
  color:#fff
}
.segTab.active{
  color:#f3f5f7;
  background:#333c48
}
.statsSummary{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:18px 0
}
.statsChip{
  padding:8px 11px;
  font-size:12px;
  background:#1b2229;
  border:1px solid #323d49;
  border-radius:6px;
  color:#b3bfcc
}
.statsChipWeek{
  cursor:pointer
}
.kpiGrid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin:20px 0
}
.kpiCard{
  background:var(--card);
  border:1px solid var(--stroke);
  padding:18px;
  border-radius:9px
}
.kpiLabel{
  font-size:11px;
  color:var(--muted);
  margin-bottom:10px
}
.kpiValue{
  font-size:24px;
  line-height:1.3;
  overflow-wrap:anywhere
}
.kpiSub,.kpiDelta{
  font-size:11px;
  color:#8f9cab;
  margin-top:8px
}
.kpiUp{
  color:var(--positive)
}
.kpiDown{
  color:#ef9aa5
}
.dashboard-hero{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:22px
}
.dashboard-hero h1{
  margin-bottom:0!important
}
.dashboard-kicker{
  color:#8996a6;
  font-size:11px;
  margin-bottom:8px
}
.dashboard-kpis{
  gap:0;
  background:var(--card);
  border:1px solid #343d47;
  border-radius:10px;
  overflow:hidden
}
.dashboard-kpi{
  padding:22px 24px!important;
  min-width:0
}
.dashboard-kpi+ .dashboard-kpi{
  border-left:1px solid var(--stroke)
}
.dashboard-kpi h3{
  font-size:11px;
  color:#a6b0bc;
  margin-bottom:12px
}
.dashboard-kpi .pill{
  font-size:clamp(20px,2vw,30px);
  line-height:1.4;
  overflow-wrap:anywhere
}
.dashboard-kpi.stat-balance{
  border-top:2px solid var(--accent);
  padding-top:20px!important
}
.dashboard-kpi .muted{
  font-size:10px
}
.dashboard-quick-actions{
  display:flex;
  gap:8px;
  margin:18px 0
}
.dashboard-command{
  display:flex;
  align-items:center;
  gap:8px;
  padding:9px 14px;
  border:1px solid #38424e;
  border-radius:7px;
  background:#1a2026
}
.dashboard-command h3{
  margin:0;
  font-size:12px
}
.dashboard-command::before{
  content:'+';
  color:#e39da6;
  font-size:18px
}
.dashboard-command.nav-salaries::before{
  content:'='
}
.dashboard-command:hover{
  background:#252c34
}
.dashboard-section-head h2{
  margin:0 0 16px
}
.dashboard-history-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px
}
.histCard{
  min-width:0;
  border:1px solid var(--stroke);
  border-radius:9px;
  background:var(--card);
  padding:18px
}
.histHead{
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-weight:500;
  font-size:13px;
  margin-bottom:12px
}
.histList{
  display:grid;
  gap:0
}
.histItem{
  margin:0
}
.histBtn{
  background:transparent;
  color:var(--text);
  width:100%;
  padding:12px 0;
  border:0;
  border-bottom:1px solid #2c343e;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  text-align:left;
  font:inherit;
  border-radius:0;
  box-shadow:none
}
.histBtn:hover{
  background:#20262d
}
.histLeft{
  flex:1;
  min-width:0
}
.histTitle{
  font-size:11px;
  color:#a4afbd
}
.histSub{
  font-size:12px;
  color:#d5dce4;
  margin-top:4px;
  overflow-wrap:anywhere
}
.histRight{
  flex-shrink:0;
  text-align:right
}
.histAmt{
  font-size:17px
}
.histMeta{
  font-size:10px;
  color:#8390a1;
  margin-top:4px
}
.dashboard-balance-card{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:1fr 2fr;
  gap:20px
}
.weekBalRow{
  display:flex;
  justify-content:space-between;
  gap:14px;
  font-size:12px;
  padding:6px 0
}
.weekBalGrid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px
}
.chartCard{
  background:var(--card)!important;
  border:1px solid var(--stroke)!important;
  border-radius:9px!important;
  padding:22px!important;
  margin-top:20px;
  min-width:0
}
.chartHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:14px;
  margin-bottom:20px
}
.chartHead h2{
  margin:0!important
}
.chartTotals{
  display:flex;
  flex-wrap:wrap;
  gap:8px
}
.chartBox{
  position:relative;
  height:290px;
  min-width:0;
  max-width:100%
}
.chartBox canvas{
  max-width:100%
}
.weekPickerRow{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:12px
}
.weekPickerRow input{
  max-width:170px!important;
  min-height:36px!important;
  font-size:12px!important
}
.weekCompareTitle{
  font-size:18px!important;
  font-weight:600!important
}
.weekCompareGrid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px!important
}
.weekCompareSide{
  background:#12171c!important;
  border:1px solid #2b343f!important;
  border-radius:8px!important;
  padding:16px!important
}
.weekCompareSideTitle{
  font-size:14px!important
}
.weekCompareValue{
  font-size:16px!important
}
.weekCompareBar{
  height:5px!important;
  background:#303946!important;
  border-radius:3px!important
}
.weekCompareFill{
  height:100%;
  border-radius:3px
}
.weekComparePills{
  display:flex;
  gap:8px;
  flex-wrap:wrap
}
.topSalaryRowInner{
  display:flex!important;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:10px;
  padding:16px!important;
  background:#161c22!important;
  border:1px solid #2f3944!important;
  border-radius:8px!important
}
.topSalaryRowLink{
  margin-top:8px;
  border-radius:8px!important
}
.topSalaryName{
  font-size:14px!important;
  font-weight:500!important
}
.donutLayout{
  display:flex;
  gap:24px;
  height:100%;
  align-items:center
}
.donutCanvas{
  position:relative;
  flex:1;
  min-width:0;
  height:100%
}
.donutLegend{
  flex:0 0 260px;
  max-height:100%;
  overflow-y:auto
}
.donutLegendRow{
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 0;
  font-size:12px
}
.donutLegendRow .sw{
  width:7px;
  height:7px;
  border-radius:2px
}
.donutLegendRow .lbl{
  flex:1
}
.donutLegendRow .pct{
  color:#8695a6;
  font-size:10px
}
.salaryHistFiltersPro{
  margin:20px 0!important;
  padding:0!important;
  border:0!important;
  box-shadow:none!important;
  background:transparent!important
}
.salaryHistFiltersProGrid{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:14px!important
}
.salaryHistPanel{
  border:1px solid #303943!important;
  background:#171b20!important;
  padding:18px!important;
  border-radius:8px!important;
  box-shadow:none!important;
  min-width:0
}
.salaryHistPanelHead{
  margin-bottom:12px!important
}
.salaryHistPanelTitle{
  font-size:12px!important;
  font-weight:500!important
}
.salaryHistControls{
  display:grid!important;
  grid-template-columns:1.2fr 1fr!important;
  gap:8px!important
}
.salaryHistButtons{
  display:flex!important;
  gap:12px!important;
  margin-top:12px!important
}
.salaryHistRangeControls{
  display:flex!important;
  gap:10px!important;
  flex-wrap:wrap;
  align-items:center
}
.salaryHistRangeControls>input{
  flex:1;
  min-width:170px
}
.salaryHistHintPro{
  display:none
}
.histBtn.js-batch{
  display:flex;
  flex-wrap:wrap;
  cursor:pointer;
  padding:18px!important;
  background:#171b20!important;
  border:1px solid #303943!important;
  border-radius:8px!important;
  margin-bottom:10px
}
.histBtn.js-batch:hover{
  border-color:#596a7d!important
}
.histBtn.js-batch .histRight{
  margin-left:auto
}
.histBtn.js-batch .histLeft>.muted{
  font-size:12px
}
.histDetails{
  display:none;
  width:100%;
  flex-basis:100%;
  margin-top:12px;
  border-top:1px solid #303943;
  padding-top:14px
}
.histBtn.open .histDetails{
  display:block
}
.histDetailsHead{
  display:flex;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px
}
.histDetailsBody{
  min-width:0
}
.histDetails .table{
  margin:0
}
.teamCards{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px
}
.teamCard{
  min-width:0;
  padding:22px;
  background:var(--card);
  border:1px solid var(--stroke);
  border-radius:10px
}
.teamCardActive{
  border-color:#75404c
}
.teamCardTop{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:flex-start
}
.teamName{
  font-size:18px;
  font-weight:500;
  overflow-wrap:anywhere
}
.teamCardTop>.muted,.teamBadges{
  font-size:10px
}
.teamKpiRows{
  display:grid;
  gap:6px;
  padding:18px 0
}
.teamCardFooter{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  border-top:1px solid var(--stroke);
  padding-top:14px
}
.teamCurrency,.teamRename,.teamCardActions{
  display:flex;
  gap:7px;
  align-items:center;
  min-width:0
}
.teamCurrency{
  flex:1
}
.teamRename{
  flex:1 1 100%
}
.teamCardActions{
  margin-left:auto
}
.teamCurrency select{
  min-width:100px
}
.teamRenameInput{
  min-width:0
}
.teamBadges{
  margin-top:8px
}
.teamsFiltersRow,.teamsFiltersForm{
  display:flex;
  gap:10px;
  align-items:end;
  flex-wrap:wrap;
  margin-bottom:20px
}
.teamsFiltersActions{
  display:flex;
  align-items:center;
  gap:12px
}
.filters-label{
  font-size:12px;
  color:var(--muted);
  margin-bottom:7px
}
.managersHero h1,.managerName{
  font-weight:600!important
}
.managersSearch{
  min-width:0!important;
  max-width:350px!important
}
.managersSearch input{
  height:44px!important;
  border-radius:8px!important
}
.managerRow{
  grid-template-columns:minmax(160px,1.4fr) repeat(4,minmax(80px,1fr)) 24px!important;
  gap:14px!important;
  padding:18px!important;
  background:#171b20!important;
  border-color:#303943!important;
  border-radius:8px!important
}
.managerRowLink{
  border-radius:8px!important
}
.managerName{
  font-size:17px!important;
  line-height:1.4!important;
  overflow-wrap:anywhere
}
.managerHero .managerName{
  font-size:28px!important
}
.managerRole{
  font-size:11px!important;
  font-weight:400!important;
  color:#a6b0bc!important
}
.managerMetric strong{
  font-size:16px!important;
  white-space:normal!important;
  overflow-wrap:anywhere
}
.managerOpen{
  font-size:18px!important
}
.managerStatsGrid{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:12px!important
}
.managerStat,.managerPanel,.managerItem{
  background:#171b20!important;
  border:1px solid #303943!important;
  border-radius:8px!important;
  padding:18px!important;
  min-width:0
}
.managerStat strong{
  font-size:22px!important;
  overflow-wrap:anywhere
}
.managerTwoCols{
  gap:16px!important
}
.managerItem{
  padding:12px!important
}
.managerItemTitle{
  font-size:11px;
  font-weight:500!important
}
.managerItemAmount{
  font-family:var(--data-font);
  font-size:13px!important;
  white-space:normal!important;
  overflow-wrap:anywhere
}
.managerBack{
  padding:8px 12px!important;
  min-height:36px!important;
  font-size:12px!important;
  font-weight:500!important
}
.backup-head{
  display:flex;
  justify-content:space-between;
  gap:16px;
  margin-bottom:24px
}
.backup-subline{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  font-size:11px;
  color:#8d9aaa
}
.backup-subline b{
  font-weight:400
}
.backup-form{
  display:grid;
  gap:16px
}
.backup-section{
  padding:22px;
  border:1px solid var(--stroke);
  background:var(--card);
  border-radius:9px;
  display:grid;
  grid-template-columns:180px minmax(0,1fr);
  gap:24px
}
.backup-section-head h2{
  margin:0
}
.backup-fields{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px
}
.backup-field:first-child,.backup-inline{
  grid-column:1/-1
}
.backup-inline{
  display:flex;
  flex-wrap:wrap;
  gap:10px
}
.backup-inline p{
  font-size:11px;
  color:var(--muted);
  margin:0
}
.backup-check{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:44px;
  margin:0;
  position:relative;
  cursor:pointer
}
.backup-check input{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0
}
.backup-check:focus-within{
  outline:2px solid #ee8f99;
  outline-offset:3px;
  border-radius:5px
}
.backup-check span{
  display:block;
  width:34px;
  height:20px;
  background:#404955;
  border-radius:20px;
  position:relative
}
.backup-check span:after{
  content:'';
  position:absolute;
  top:3px;
  left:3px;
  width:14px;
  height:14px;
  background:#d7dde4;
  border-radius:50%;
  transition:transform .12s
}
.backup-check input:checked+span{
  background:#a84250
}
.backup-check input:checked+span:after{
  transform:translateX(14px)
}
.backup-check b{
  font-size:12px;
  font-weight:500
}
.backup-schedule{
  display:grid;
  grid-template-columns:1fr 1fr auto;
  gap:18px;
  align-items:end
}
.backup-actions{
  margin:20px 0
}
.backup-status{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  border-top:1px solid var(--stroke);
  padding-top:20px
}
.backup-status span{
  display:block;
  color:#8b99aa;
  font-size:10px;
  margin-bottom:8px
}
.backup-status b{
  font-size:11px;
  font-weight:400;
  overflow-wrap:anywhere
}
.reports-page{
  max-width:950px!important
}
.reports-head{
  margin-bottom:24px
}
.section-kicker{
  display:none
}
.reports-filter{
  padding:24px;
  border:1px solid var(--stroke);
  border-radius:10px;
  background:var(--card);
  display:grid;
  grid-template-columns:1fr auto;
  gap:18px;
  align-items:end
}
.reports-range-field{
  margin:0
}
.reports-range-field>span{
  display:block;
  margin-bottom:8px
}
.reports-export{
  min-height:44px
}
.xs-report-mark{
  width:50px;
  height:56px;
  display:grid;
  place-items:center;
  background:#35242b;
  border:1px solid #6a3844;
  border-radius:8px;
  color:#ec9da8;
  font-size:12px;
  font-family:var(--data-font);
  margin-bottom:22px
}
.drp-popover,.sdp-popover{
  position:fixed;
  display:none;
  z-index:9999;
  width:340px;
  padding:14px;
  background:#1c2229;
  border:1px solid #46515f;
  border-radius:12px;
  box-shadow:0 16px 50px #0007
}
.drp-head{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:12px
}
.drp-title{
  flex:1;
  text-align:center;
  font-size:13px;
  font-weight:500
}
.drp-nav{
  width:40px;
  height:40px;
  background:#29323d;
  color:#d9e1ea;
  border:1px solid #3d4958;
  border-radius:7px
}
.drp-week,.drp-grid{
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:3px
}
.drp-week{
  font-size:10px;
  text-align:center;
  color:#9cabbc;
  margin-bottom:6px
}
.drp-day,.drp-empty{
  height:40px
}
.drp-day{
  padding:0;
  background:transparent;
  color:var(--text);
  border:1px solid transparent;
  border-radius:6px;
  font-size:12px
}
.drp-day:hover{
  background:#354353
}
.drp-day.in-range{
  background:#48303b
}
.drp-day.start,.drp-day.end{
  background:#c74b5c;
  color:#fff
}
.drp-hint{
  font-size:10px;
  color:#9cabbc;
  text-align:center;
  margin-top:10px
}
.crm-modal{
  position:fixed;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:10000;
  opacity:0;
  pointer-events:none;
  padding:20px
}
.crm-modal.is-open{
  opacity:1;
  pointer-events:auto
}
.crm-modal-backdrop{
  position:absolute;
  inset:0;
  background:#05070ac4
}
.crm-modal-card{
  position:relative;
  width:min(440px,100%);
  max-height:calc(100dvh - 60px);
  overflow:auto;
  background:#1b2128;
  border:1px solid #445160;
  border-radius:12px;
  padding:24px;
  box-shadow:0 20px 70px #0007
}
.crm-modal-wide{
  width:min(900px,100%)
}
.crm-modal-title{
  font-size:17px;
  font-weight:500;
  margin-bottom:12px
}
.crm-modal-text{
  color:#b7c2cf;
  font-size:13px
}
.crm-modal-actions{
  display:flex;
  gap:10px;
  justify-content:flex-end;
  margin-top:22px
}
.modal-open{
  overflow:hidden
}
.weekbal-editbar,.weekbal-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center
}
.weekBalFormModal{
  margin-bottom:20px
}
#xs-nav-dialog{
  position:fixed;
  inset:0 auto 0 0;
  margin:0;
  width:min(330px,90vw);
  max-width:none;
  height:100dvh;
  max-height:100dvh;
  border:0;
  border-right:1px solid #414c59;
  border-radius:0;
  background:#151a1f;
  color:var(--text);
  padding:max(20px,env(safe-area-inset-top)) 18px max(24px,env(safe-area-inset-bottom));
  overflow-y:auto;
  overscroll-behavior:contain
}
#xs-nav-dialog:not([open]){
  display:none
}
#xs-nav-dialog::backdrop{
  background:#0009
}
.xs-drawer-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:22px
}
.xs-drawer-head .xs-brand{
  padding:0
}
.xs-drawer-close{
  width:40px;
  height:40px;
  background:#262e38;
  border:1px solid #404c5a;
  border-radius:8px;
  color:#d8e1ec;
  font-size:24px
}
.xs-drawer .xs-nav-link{
  min-height:44px
}
.xs-drawer .xs-sidebar-foot{
  margin-top:26px;
  border-top:1px solid var(--stroke);
  padding-top:12px
}
.xs-drawer .xs-navigation{
  gap:18px
}
.mobile-saved-toast,.mobile-expense-notice{
  position:fixed!important;
  inset:18px 18px auto auto!important;
  left:auto!important;
  transform:none!important;
  background:#243129!important;
  border:1px solid #49745a!important;
  color:#d5efdf!important;
  padding:12px 18px!important;
  font:500 13px var(--body-font)!important;
  border-radius:8px!important;
  box-shadow:0 10px 35px #0006!important;
  max-width:calc(100vw - 36px);
  text-align:left;
  z-index:11000!important;
  pointer-events:none
}
body:has(.login-shell){
  min-height:100dvh;
  display:grid;
  place-items:center
}
.login-shell{
  width:min(400px,100%);
  margin:auto;
  padding:36px;
  background:#171b20;
  border:1px solid #343e49;
  border-radius:12px
}
.login-brand-panel{
  padding:0;
  background:none;
  border:0
}
.login-logo-lockup{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:32px
}
.login-logo{
  width:38px;
  height:38px;
  border-radius:8px
}
.login-brand-name{
  font-size:23px;
  font-weight:600;
  letter-spacing:-.8px
}
.login-kicker,.login-status-row,.login-panel-label,.login-dot,.login-panel-head,.login-copy p{
  display:none
}
.login-copy h1{
  font-size:23px!important;
  margin-bottom:26px!important
}
.login-field{
  margin-bottom:18px
}
.login-submit{
  width:100%;
  margin-top:4px
}
.login-panel{
  padding:0
}
.login-error{
  font-size:12px
}
.container:has(.login-shell){
  width:100%;
  padding:24px
}
@media(min-width:1600px){
  body.is-authenticated .container{
    margin-right:auto;
    margin-left:calc(var(--sidebar) + (100vw - var(--sidebar) - 1368px)/2);
    max-width:1368px
  }
}
@media(max-width:1190px){
  :root{
    --sidebar:208px
  }
  .xs-topbar{
    padding-inline:24px
  }
  body.is-authenticated .container{
    padding:26px 24px 70px
  }
  .xs-sidebar{
    padding-inline:12px
  }
  .xs-nav-link{
    font-size:12px;
    padding-inline:10px
  }
  .filters-bar{
    grid-template-columns:1fr 1fr
  }
  .kpiGrid{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .managerRow{
    grid-template-columns:minmax(150px,1.5fr) repeat(2,minmax(90px,1fr))!important
  }
  .managerOpen{
    display:none
  }
  .managerStatsGrid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important
  }
  .backup-section{
    grid-template-columns:1fr;
    gap:18px
  }
  .backup-schedule{
    grid-template-columns:1fr 1fr auto
  }
  .teamCards{
    grid-template-columns:1fr
  }
  .donutLegend{
    flex-basis:200px
  }
}
@media(max-width:900px),(max-width:1100px) and (max-height:500px){
  :root{
    --sidebar:0px
  }
  .xs-sidebar{
    display:none
  }
  .xs-topbar{
    height:auto;
    min-height:62px;
    gap:10px;
    padding:max(10px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) 10px max(16px,env(safe-area-inset-left));
    margin:0
  }
  .xs-mobile-brand{
    display:block
  }
  .xs-brand-mark{
    width:28px;
    height:28px;
    font-size:19px
  }
  .xs-team-slot{
    flex:1;
    min-width:0
  }
  .xs-team-form select{
    width:100%!important;
    max-width:100%!important;
    min-height:40px!important;
    font-size:13px!important;
    padding:8px 20px 8px 8px!important;
    text-overflow:ellipsis
  }
  .xs-account-name{
    display:none
  }
  .xs-avatar{
    width:30px;
    height:30px;
    font-size:11px
  }
  .xs-account{
    gap:0
  }
  .xs-team-name{
    font-size:12px
  }
  .xs-bottomnav{
    position:fixed;
    inset:auto 0 0;
    display:grid;
    grid-auto-flow:column;
    grid-auto-columns:minmax(0,1fr);
    gap:5px;
    padding:6px max(12px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));
    border-top:1px solid #303943;
    background:#151a1ff7;
    z-index:200
  }
  .xs-bottomnav>a,.xs-bottomnav>button{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:4px;
    min-height:49px;
    min-width:0;
    padding:5px;
    border:0;
    border-radius:7px;
    background:transparent;
    color:#91a0b1;
    font-size:10px;
    line-height:1.2
  }
  .xs-bottomnav>[aria-current],.xs-bottomnav>[aria-expanded=true]{
    color:#f0a0aa;
    background:#30242b
  }
  .xs-bottomnav svg{
    width:20px;
    height:20px
  }
  .xs-skip{
    left:12px
  }
  body.is-authenticated .container{
    padding:24px max(16px,env(safe-area-inset-right)) calc(100px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));
    margin:0;
    width:100%;
    max-width:none
  }
  h1{
    font-size:25px!important;
    margin-bottom:22px!important
  }
  h2{
    font-size:17px!important
  }
  input:not([type=hidden]):not([type=checkbox]):not([type=radio]),select,textarea{
    font-size:16px!important;
    min-height:46px;
    padding:11px 12px
  }
  .btn,.btn.sm,.pillbtn,.segTab,.link,summary{
    min-height:44px
  }
  .grid3{
    gap:16px
  }
  .filters-bar{
    grid-template-columns:1fr 1fr
  }
  .histGrid{
    grid-template-columns:1fr
  }
  .dashboard-kpis{
    display:grid;
    grid-template-columns:1fr 1fr
  }
  .dashboard-kpi{
    padding:18px!important
  }
  .dashboard-kpi.stat-balance{
    grid-column:1/-1;
    grid-row:1;
    border-top:0;
    border-left:3px solid var(--accent);
    border-bottom:1px solid #303943;
    padding:20px 18px!important
  }
  .dashboard-kpi.stat-balance .pill{
    font-size:31px
  }
  .dashboard-kpi.stat-balance h3{
    margin-bottom:5px
  }
  .dashboard-kpi .pill{
    font-size:21px
  }
  .dashboard-kpi.stat-income{
    border:0
  }
  .dashboard-kpi.stat-expense{
    border-left:1px solid var(--stroke)
  }
  .dashboard-kpi .muted{
    margin-top:8px!important
  }
  .dashboard-quick-actions{
    gap:8px
  }
  .dashboard-command{
    flex:1;
    justify-content:center;
    padding:10px 8px;
    min-height:44px
  }
  .dashboard-command h3{
    font-size:11px
  }
  .dashboard-section-head h2{
    margin-top:28px
  }
  .dashboard-balance-card{
    grid-column:auto;
    display:block
  }
  .dashboard-history-grid{
    grid-template-columns:1fr
  }
  .histCard{
    padding:16px
  }
  .histBtn{
    min-height:68px
  }
  .histAmt{
    font-size:16px
  }
  .chartCard{
    padding:18px!important
  }
  .chartBox{
    height:240px
  }
  .chartHead{
    gap:12px
  }
  .chartTotals{
    width:100%;
    gap:5px
  }
  .weekPickerRow{
    width:100%;
    margin-top:10px
  }
  .weekPickerRow .muted{
    font-size:10px
  }
  .weekPickerRow input{
    font-size:14px!important;
    min-height:42px!important
  }
  .managerRow{
    grid-template-columns:1fr 1fr!important;
    padding:16px!important;
    gap:15px!important
  }
  .managerRow>div:first-child{
    grid-column:1/-1
  }
  .managerMetric strong{
    font-size:16px!important
  }
  .managerTwoCols{
    grid-template-columns:1fr!important
  }
  .managerStatsGrid{
    grid-template-columns:1fr 1fr!important
  }
  .managerStat{
    padding:14px!important
  }
  .managerStat strong{
    font-size:18px!important
  }
  .managersHero{
    display:block!important
  }
  .managersSearch{
    max-width:none!important;
    width:100%;
    margin-top:16px
  }
  .managerName{
    font-size:18px!important
  }
  .managerHero .managerName{
    font-size:25px!important
  }
  .salaryHistFiltersProGrid{
    grid-template-columns:1fr!important
  }
  .histBtn.js-batch{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    gap:14px!important
  }
  .histBtn.js-batch .histRight{
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    gap:12px;
    margin-left:0;
    width:100%;
    text-align:left
  }
  .histBtn.js-batch .histRight>div:last-child{
    margin:0!important;
    gap:8px!important;
    justify-content:flex-start!important
  }
  .histBtn.js-batch .histRight .btn{
    font-size:11px!important;
    padding:8px 10px!important
  }
  .histDetails{
    grid-column:1/-1
  }
  .backup-fields{
    gap:16px
  }
  .backup-schedule{
    grid-template-columns:1fr 1fr
  }
  .backup-schedule .btn{
    grid-column:1/-1
  }
  .backup-section{
    padding:18px
  }
  .backup-status{
    grid-template-columns:1fr
  }
  .backup-head h1{
    margin-bottom:10px!important
  }
  .backup-subline{
    display:grid;
    gap:4px
  }
  .backup-subline span:nth-child(2){
    display:none
  }
  .reports-filter{
    grid-template-columns:1fr;
    padding:20px;
    gap:18px
  }
  .reports-export{
    width:100%
  }
  .reports-head h1{
    margin-bottom:14px!important
  }
  .donutLayout{
    flex-direction:column;
    height:auto
  }
  .donutCanvas{
    flex:none;
    width:100%;
    height:240px
  }
  .donutLegend{
    width:100%;
    flex:none;
    max-height:none
  }
  .chartBox.donutBox{
    height:auto
  }
  .crm-modal{
    padding:16px 16px 90px
  }
  .crm-modal-card{
    max-height:calc(100dvh - 120px);
    padding:20px
  }
  .crm-modal-actions{
    display:grid;
    grid-template-columns:1fr 1fr
  }
  .drp-popover,.sdp-popover{
    inset:auto 12px calc(80px + env(safe-area-inset-bottom))!important;
    width:auto!important;
    max-width:400px;
    margin:auto;
    max-height:calc(100dvh - 110px);
    overflow-y:auto;
    padding:12px
  }
  .drp-day,.drp-empty,.drp-nav{
    height:44px;
    min-height:44px
  }
  .drp-week{
    font-size:11px
  }
  .drp-day{
    font-size:14px
  }
  .table .btn{
    min-height:44px
  }
  .xs-report-mark{
    margin-top:8px
  }
  .login-shell{
    padding:28px
  }
  .container:has(.login-shell){
    padding:20px
  }
  .weekCompareGrid{
    grid-template-columns:1fr!important
  }
}
@media(max-width:640px){
  .grid3,.rowgrid,.filters-bar{
    grid-template-columns:minmax(0,1fr)!important
  }
  .grid3>*{
    grid-column:auto!important
  }
  .grid3>[style*="grid-column"]{
    grid-column:1!important
  }
  .grid3 div[style*="display:flex"]{
    flex-wrap:wrap
  }
  .grid3>div[style*="grid-column"]{
    grid-column:1!important
  }
  .rowgrid{
    grid-template-columns:minmax(0,1fr) minmax(76px,.4fr)!important
  }
  .rowgrid>div{
    min-width:0
  }
  .rowgrid label{
    font-size:10px
  }
  .rowbox{
    padding:12px
  }
  .filters-actions .btn{
    flex:1
  }
  .filters-actions{
    width:100%
  }
  .kpiGrid{
    gap:8px
  }
  .kpiCard{
    padding:14px
  }
  .kpiValue{
    font-size:19px
  }
  .table.xs-table{
    display:block;
    margin-top:16px
  }
  .xs-table thead{
    position:absolute;
    width:1px;
    height:1px;
    clip-path:inset(50%);
    overflow:hidden;
    white-space:nowrap
  }
  .xs-table tbody{
    display:grid;
    gap:10px;
    width:100%
  }
  .xs-table tr{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px 14px;
    width:100%;
    background:#171b20;
    border:1px solid #303943;
    border-radius:9px;
    padding:14px
  }
  .xs-table tr:hover{
    background:#171b20
  }
  .xs-table td{
    display:block;
    border:0;
    padding:0!important;
    min-width:0;
    width:auto!important;
    max-width:100%;
    font-size:12px!important;
    white-space:normal!important;
    text-align:left!important;
    overflow-wrap:anywhere
  }
  .xs-table td::before{
    content:attr(data-label);
    display:block;
    font-size:9px;
    color:#8e9cad;
    margin-bottom:4px;
    font-family:var(--body-font);
    font-weight:400
  }
  .xs-table td.xs-cell-wide{
    grid-column:1/-1
  }
  .xs-table td.xs-cell-wide:before{
    display:none
  }
  .xs-table td.xs-cell-actions{
    grid-column:1/-1;
    display:flex;
    justify-content:flex-end;
    gap:8px;
    border-top:1px solid #2b343e;
    padding-top:10px!important;
    margin-top:2px
  }
  .xs-table td.xs-cell-actions:before{
    display:none
  }
  .xs-table td.xs-cell-actions form{
    margin:0
  }
  .xs-table .btn{
    width:auto;
    font-size:11px
  }
  .xs-table-scroll{
    overflow:visible
  }
  .histDetails .xs-table-scroll{
    overflow:visible
  }
  .histDetails .table{
    margin-top:0
  }
  .teamCard{
    padding:18px
  }
  .teamCardTop{
    flex-wrap:wrap
  }
  .teamCurrency{
    flex-basis:100%
  }
  .teamRename{
    flex-basis:100%
  }
  .teamCardActions{
    margin-left:0
  }
  .teamName{
    font-size:17px
  }
  .teamsFiltersForm{
    width:100%
  }
  .teamsFiltersForm>*{
    min-width:0!important;
    max-width:100%
  }
  .teamsFiltersActions{
    width:100%
  }
  .teamsFiltersActions .btn{
    flex:1
  }
  .backup-fields{
    grid-template-columns:minmax(0,1fr)
  }
  .backup-field{
    grid-column:1/-1
  }
  .backup-head>.link{
    align-self:flex-start
  }
  .salaryHistRangeControls>input{
    min-width:0;
    flex-basis:100%
  }
  .histDetailsHead>div:last-child{
    display:none
  }
  .histTitle{
    overflow-wrap:anywhere
  }
  .managerItem{
    grid-template-columns:minmax(0,1fr) minmax(70px,.5fr)!important
  }
  .histBtn.js-batch .histRight{
    display:block
  }
  .histBtn.js-batch .histRight>.histAmt{
    margin-bottom:12px
  }
  .histBtn.js-batch .histRight>div:last-child{
    display:flex!important
  }
  .xs-table td:only-child{
    grid-column:1/-1
  }
  .weekBalGrid{
    grid-template-columns:1fr 1fr
  }
  .weekBalForm .btn{
    width:100%
  }
  .dashboard-command.nav-salaries{
    display:none
  }
  .dashboard-kpi .pill{
    font-size:19px
  }
  .dashboard-kpi.stat-balance .pill{
    font-size:29px
  }
  .dashboard-kpi{
    padding:16px!important
  }
  .dashboard-hero{
    margin-bottom:20px
  }
  .chartHead h2{
    font-size:16px!important
  }
  .weekPickerRow{
    flex-wrap:wrap
  }
  .weekPickerRow input{
    max-width:none!important;
    width:100%
  }
  .weekPickerRow .muted{
    display:none
  }
  .managerHero .managerName{
    font-size:23px!important
  }
  .show-more-wrap{
    flex-wrap:wrap
  }
  .show-more-btn{
    flex:1
  }
  .histBtn .histRight{
    max-width:45%
  }
  .histBtn.js-batch .histRight{
    max-width:none
  }
  .histDetails .histRight{
    max-width:none
  }
  .xs-table .xs-money-cell{
    font-family:var(--data-font);
    font-size:16px!important
  }
  .xs-table .xs-money-cell:before{
    font-family:var(--body-font)
  }
}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{
    animation:none!important;
    transition:none!important;
    scroll-behavior:auto!important
  }
}
.xs-page-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  flex-wrap:wrap;
  gap:12px!important;
  margin-bottom:22px
}
.xs-page-head h1{
  margin-bottom:0!important
}
.xs-page-head>.xs-help{
  display:none!important
}
.xs-table td.xs-cell-wide-content{
  grid-column:1/-1
}
.xs-fallback-open{
  display:flex!important;
  z-index:1000;
  width:280px;
  box-shadow:0 0 0 100vmax #0009
}
.xs-fallback-open~*{
  pointer-events:none
}
@media(min-width:901px) and (min-height:501px){
  .xs-sidebar .xs-navigation{
    flex:1;
    min-height:0;
    overflow-y:auto;
    padding-right:3px
  }
  .xs-sidebar-foot{
    margin-top:0;
    padding-top:12px;
    flex-shrink:0
  }
  .xs-sidebar .xs-brand{
    padding-bottom:24px
  }
}
.xs-brand-image{
  width:34px;
  height:34px;
  object-fit:cover;
  border-radius:8px;
  flex-shrink:0
}
.xs-mobile-brand .xs-brand-image{
  width:32px;
  height:32px
}
.xs-history-totals{
  grid-template-columns:repeat(3,minmax(0,1fr))!important
}
.xs-history-totals>div{
  min-width:0;
  background:#171b20!important;
  border:1px solid #303943!important;
  border-radius:8px!important;
  padding:18px!important
}
.xs-history-totals>div>div:last-child{
  font-family:var(--data-font);
  font-size:22px!important;
  font-weight:500!important;
  overflow-wrap:anywhere
}
.statsChipWeek{
  min-height:44px
}
@media(max-width:900px),(max-width:1100px) and (max-height:500px){
  .xs-team-form select{
    font-size:16px!important;
    min-height:44px!important
  }
  .xs-history-totals{
    grid-template-columns:1fr 1fr!important
  }
  .xs-history-totals>div:first-child{
    grid-column:1/-1
  }
  .xs-history-totals>div{
    padding:14px!important
  }
  .xs-history-totals .muted{
    font-size:10px!important
  }
  .xs-history-totals>div>div:last-child{
    font-size:19px!important
  }
}
#xs-nav-dialog[open]{
  display:flex;
  flex-direction:column
}
.xs-drawer-head{
  flex-shrink:0
}
.xs-drawer .xs-navigation{
  flex:1;
  min-height:0;
  overflow-y:auto;
  overscroll-behavior:contain;
  padding-right:3px
}
.xs-drawer .xs-sidebar-foot{
  margin-top:14px;
  padding-top:12px;
  flex-shrink:0
}
.xs-drawer .xs-nav-label{
  padding-top:2px
}
@media(max-width:900px),(max-width:1100px) and (max-height:500px){
  .grid3.dashboard-kpis{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    align-items:stretch
  }
  .grid3.dashboard-kpis .dashboard-kpi.stat-balance{
    grid-column:1/-1!important;
    grid-row:1
  }
  .grid3.dashboard-kpis .dashboard-kpi:not(.stat-balance){
    grid-column:auto!important
  }
  .dashboard-kpi:not(.stat-balance) .pill{
    font-size:clamp(14px,4.2vw,21px)
  }
}
body:not(.is-authenticated) .xs-login-switch{
  display:block;
  position:fixed;
  bottom:max(18px,env(safe-area-inset-bottom));
  left:50%;
  transform:translateX(-50%);
  min-height:44px;
  padding:10px 16px;
  color:#a6b0bc;
  background:transparent;
  border:0;
  font-size:12px
}
body:not(.is-authenticated) .container{
  padding-bottom:80px
}
.xs-account-name{
  max-width:180px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap
}
.xs-drawer .xs-navigation{
  gap:12px
}
.xs-drawer .xs-nav-label{
  padding-bottom:5px
}
.xs-drawer-head{
  margin-bottom:16px
}
.xs-drawer .xs-nav-group{
  gap:2px
}
.xs-preview-idle{display:none!important}

/* Native selects need an explicit appearance reset to match text fields on macOS. */
select{
  -webkit-appearance:none;
  appearance:none;
  height:44px;
  line-height:1.4;
  padding-right:36px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%239ca8b6' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 12px center;
  background-size:16px;
}
select[multiple]{height:auto;min-height:88px;background-image:none}
.xs-salary-card{max-width:1160px;margin-inline:auto}
.xs-salary-heading{margin-bottom:24px}
.xs-salary-card>.sep:first-of-type,.xs-salary-calculation-title,.xs-salary-form-divider{display:none}
.xs-salary-form{
  display:grid;
  grid-template-columns:280px minmax(0,1fr);
  gap:20px;
  align-items:start;
}
.xs-salary-settings.grid3{
  grid-template-columns:minmax(0,1fr);
  align-items:start;
  gap:20px;
  padding:20px;
  border:1px solid var(--stroke);
  border-radius:12px;
  background:var(--card);
}
.xs-salary-settings select{width:100%;min-width:0}
.xs-salary-settings .xs-salary-period{display:grid!important;grid-template-columns:minmax(0,1fr) 90px;gap:8px!important}
.xs-salary-settings label{margin-bottom:8px}
.xs-salary-people{
  min-width:0;
  padding:20px;
  border:1px solid var(--stroke);
  border-radius:12px;
  background:var(--card);
}
.xs-salary-section-title{font-size:14px;color:var(--text);font-weight:500!important;margin-bottom:14px!important}
.xs-salary-columns{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 96px;
  gap:12px;
  font-size:11px;
  color:var(--muted);
  margin-bottom:2px;
}
.xs-salary-columns>span:last-child{text-align:right;padding-right:12px}
.xs-salary-people .rowbox{
  padding:8px 0;
  margin:0!important;
  border:0;
  border-radius:0;
  background:transparent;
}
.xs-salary-people .rowgrid{
  display:grid;
  grid-template-columns:minmax(0,1fr) 96px;
  align-items:center;
  gap:12px;
}
.xs-salary-people .rowgrid label{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
}
.xs-salary-people .sep{margin:14px 0 20px}
.xs-salary-percent{position:relative;min-width:0}
.xs-salary-percent:after{
  content:'%';
  position:absolute;
  right:12px;
  top:50%;
  transform:translateY(-50%);
  pointer-events:none;
  color:var(--muted);
  font-size:12px;
}
.xs-salary-percent input{
  height:44px;
  text-align:right;
  padding-right:30px!important;
  font-family:var(--data-font);
  -moz-appearance:textfield;
  appearance:textfield;
}
.xs-salary-percent input::-webkit-inner-spin-button,.xs-salary-percent input::-webkit-outer-spin-button{
  -webkit-appearance:none;
  margin:0;
}
.xs-salary-actions{grid-column:1/-1;display:flex;justify-content:flex-end;margin-top:-4px}
.xs-salary-actions .btn{min-width:164px}
.xs-salary-summary{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  border:1px solid var(--stroke);
  border-radius:12px;
  padding:18px 20px;
  background:var(--card);
}
.xs-salary-summary strong,.xs-salary-summary b{font-family:var(--data-font);color:var(--text);font-weight:500}
.xs-salary-summary b{font-size:24px;margin-left:8px;color:var(--positive)}
.xs-salary-summary-separator{display:none}
@media(max-width:1100px){
  .xs-salary-form{grid-template-columns:240px minmax(0,1fr);gap:16px}
  .xs-salary-settings.grid3,.xs-salary-people{padding:16px}
}
@media(max-width:700px){
  .xs-salary-form{grid-template-columns:minmax(0,1fr);gap:16px}
  .xs-salary-settings.grid3{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .xs-salary-settings>div:last-child{grid-column:1/-1}
  .xs-salary-heading{margin-bottom:20px}
  .xs-salary-actions .btn{width:100%}
}
@media(max-width:480px){
  .xs-salary-settings.grid3{grid-template-columns:minmax(0,1fr)}
  .xs-salary-settings>div:last-child{grid-column:auto}
  .xs-salary-people .rowgrid,.xs-salary-columns{grid-template-columns:minmax(0,1fr) 80px;gap:10px}
  .xs-salary-people select{padding-left:10px;padding-right:28px;background-position:right 8px center}
  .xs-salary-summary{display:block;padding:16px}
  .xs-salary-summary>span{display:block}
  .xs-salary-summary>span:last-child{margin-top:12px}
  .xs-salary-summary .xs-salary-summary-separator{display:none}
}