*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,sans-serif;background:#f3eee8;color:#241f1b}
button,input{font:inherit}.shell{min-height:100vh;display:grid;grid-template-columns:230px 1fr}.sidebar{padding:28px 20px;background:#eee7df;border-right:1px solid #ded4ca}
.brand{font-family:Georgia,serif;font-size:30px;margin-bottom:36px}.nav{display:grid;gap:8px}.nav button{border:0;background:transparent;text-align:left;padding:13px 14px;border-radius:12px;color:#62584f}.nav button.active{background:#fff}
.main{padding:30px}.top{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{background:#fff;border-radius:18px;padding:22px;box-shadow:0 12px 40px #6f62551c}.muted{color:#84786e}.metric{font-size:30px;margin:8px 0}
.login{min-height:100vh;display:grid;place-items:center;padding:24px}.login-card{width:min(420px,100%);background:#fff;padding:32px;border-radius:24px;box-shadow:0 18px 60px #7b6c5e22}
.login-card h1{margin:0 0 8px;font-family:Georgia,serif}.field{display:grid;gap:7px;margin:18px 0}.field input{padding:14px;border:1px solid #d8cec4;border-radius:12px;background:#fcfaf8}
.primary{width:100%;padding:14px;border:0;border-radius:12px;background:#8d725d;color:white}.error{color:#9f3f37;margin-top:12px}
.bottom-nav{display:none}
@media(max-width:760px){
  .shell{display:block;padding-bottom:74px}.sidebar{display:none}.main{padding:20px 16px}.top{margin-bottom:18px}
  .cards{grid-template-columns:1fr}.bottom-nav{display:grid;position:fixed;bottom:0;left:0;right:0;grid-template-columns:repeat(4,1fr);background:#fff;border-top:1px solid #e4dbd2;padding:8px 6px calc(8px + env(safe-area-inset-bottom))}
  .bottom-nav button{border:0;background:transparent;padding:8px 4px;font-size:12px;color:#685d53}.bottom-nav button.active{font-weight:700;color:#2d2722}
  .metric{font-size:26px}.brand-mobile{font-family:Georgia,serif;font-size:24px}
}

.section-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px}
.section-head h1{margin-bottom:4px}.compact{width:auto;padding:11px 16px}.form-card{max-width:620px}
.row{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:15px 0;border-bottom:1px solid #eee6de}
.row:last-child{border-bottom:0}.small{font-size:13px;margin-top:4px}.secondary{border:1px solid #d7ccc1;background:#fff;padding:9px 12px;border-radius:10px}
.wide{width:100%;margin-top:10px}.status{display:inline-block;padding:6px 9px;border-radius:999px;background:#eee7df;font-size:12px}
.status.ok{background:#e6f2e8}.status.off{background:#f4e7e5}.check{display:flex;gap:9px;align-items:center;padding:5px 0}
.linklike{border:0;background:transparent;padding:0;color:#715d4d;margin-bottom:8px}.top-actions{display:flex;gap:8px}
@media(max-width:760px){.section-head{align-items:flex-start;flex-direction:column}.section-head .primary{width:100%}.row{align-items:flex-start;flex-direction:column}.top-actions{gap:5px}.top-actions button{font-size:12px}}

.shift-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:20px 0}
.summary-grid>div{background:#f7f3ef;border-radius:14px;padding:14px;display:grid;gap:5px}.summary-grid strong{font-size:20px}
.actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}
@media(max-width:760px){.shift-grid,.summary-grid{grid-template-columns:1fr}.actions{flex-direction:column}.actions button{width:100%}}

.clickable{cursor:pointer;transition:background .15s ease}.clickable:hover{background:#faf7f3}.shift-owner-values{display:flex;gap:18px;flex-wrap:wrap;text-align:right}
.shift-owner-values span,.correction-values span{display:grid;gap:3px}.correction-values{display:flex;gap:14px;flex-wrap:wrap;text-align:right}
.timeline-item{padding:14px 0 14px 18px;border-left:2px solid #ded4ca;position:relative}.timeline-item:before{content:'';position:absolute;left:-6px;top:19px;width:10px;height:10px;border-radius:50%;background:#9a816d}
textarea{font:inherit;padding:14px;border:1px solid #d8cec4;border-radius:12px;background:#fcfaf8;resize:vertical}
@media(max-width:760px){.shift-owner-values,.correction-values{text-align:left;display:grid;grid-template-columns:1fr 1fr;gap:8px 14px}.clickable{padding:16px 0}}

select{font:inherit;padding:14px;border:1px solid #d8cec4;border-radius:12px;background:#fcfaf8}
.kpi-owner-values{display:flex;gap:18px;flex-wrap:wrap;text-align:right}
.kpi-owner-values span{display:grid;gap:3px}
@media(max-width:760px){.kpi-owner-values{text-align:left;display:grid;grid-template-columns:1fr 1fr;gap:8px 14px}.owner-kpi-row .set-plan{width:100%}}

.actions-inline{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.row-actions{margin-top:8px;display:flex;gap:8px;flex-wrap:wrap}
@media(max-width:760px){.actions-inline{width:100%;display:grid;grid-template-columns:1fr}.actions-inline button{width:100%}.row-actions{display:grid;grid-template-columns:1fr}.row-actions button{width:100%}}

.search-results{display:grid;gap:8px;margin:-8px 0 14px}.search-result{display:flex;justify-content:space-between;gap:12px;text-align:left;border:1px solid #ddd2c7;background:#fff;border-radius:12px;padding:12px;cursor:pointer}
.search-result span{color:#84786e;font-size:13px}.context-card{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:12px 0}.context-card>div{background:#f7f3ef;border-radius:12px;padding:12px;display:grid;gap:4px}
@media(max-width:760px){.search-result{flex-direction:column}.context-card{grid-template-columns:1fr}}

.payroll-card{padding:18px 0;border-bottom:1px solid #eee6de}.payroll-card:last-child{border-bottom:0}

@media(max-width:760px){.bottom-nav.owner-nav{grid-template-columns:repeat(5,1fr)}.bottom-nav.owner-nav button{font-size:11px}}

.payroll-filter{display:flex;gap:16px;align-items:end;flex-wrap:wrap}.payroll-filter .field{min-width:180px;margin:0}
.period-switch{display:flex;gap:8px;flex-wrap:wrap}.period-switch button.active{background:#2d2722;color:#fff;border-color:#2d2722}
@media(max-width:760px){.payroll-filter{display:grid;grid-template-columns:1fr}.period-switch{display:grid;grid-template-columns:1fr 1fr}.period-switch button{width:100%}}

.payroll-section{margin:18px 0}.payroll-section h2{margin:0 0 10px}
.payroll-table-wrap{overflow-x:auto;background:#fff;border:1px solid #ece4dc;border-radius:16px}
.payroll-table{width:100%;border-collapse:collapse;min-width:1180px}
.payroll-table th,.payroll-table td{padding:14px 16px;border-bottom:1px solid #eee6de;text-align:left;vertical-align:middle;white-space:nowrap}
.payroll-table th{font-size:13px;color:#6f655d;background:#faf7f3}
.payroll-table tbody tr:hover{background:#fcfaf8}
@media(max-width:760px){
  .payroll-table{min-width:980px}
  .payroll-table th,.payroll-table td{padding:12px 14px}
  .payroll-section{margin:14px 0}
}

.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.35);display:flex;align-items:center;justify-content:center;padding:18px;z-index:1000}
.modal-card{width:min(560px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:18px;padding:20px;box-shadow:0 20px 60px rgba(0,0,0,.2)}
.modal-card .actions{margin-top:10px}
@media(max-width:760px){.modal-backdrop{align-items:flex-end;padding:0}.modal-card{width:100%;max-height:88vh;border-radius:18px 18px 0 0;padding:18px 16px calc(18px + env(safe-area-inset-bottom))}}

#refreshData{display:inline-flex;align-items:center;justify-content:center}
@media(max-width:760px){
  .top-actions{gap:8px}
  #refreshData{font-weight:700}
  #changePassword{display:none}
}

.payroll-shift-note{margin-bottom:10px}
.payroll-shift-table{min-width:1120px}
.shift-pay-extra td{background:#faf7f3;white-space:normal}
.shift-breakdown{display:grid;gap:12px;padding:6px 2px}
.shift-breakdown-grid{display:grid;grid-template-columns:repeat(3,minmax(150px,1fr));gap:10px}
.shift-breakdown-grid>div{display:flex;flex-direction:column;gap:3px}
.shift-corrections{display:grid;gap:5px;padding-top:6px;border-top:1px solid #e7ddd4}
.muted-row{opacity:.65}
@media(max-width:760px){.shift-breakdown-grid{grid-template-columns:1fr 1fr}.payroll-shift-table{min-width:1040px}}

.payroll-flow-card,.payroll-final-card{position:relative;display:grid;grid-template-columns:38px 1fr;column-gap:12px;row-gap:14px}
.payroll-flow-card>div:not(.payroll-step),.payroll-final-card>div:not(.payroll-step),.payroll-flow-card>#payrollShiftDetail,.payroll-flow-card>#payrollAdjustmentDetail,.payroll-flow-card>#payrollPayoutDetail,.payroll-final-card>.summary-grid,.payroll-final-card>.final-status,.payroll-final-card>.final-actions{grid-column:2}
.payroll-step{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#2d2722;color:#fff;font-weight:700}
.payroll-flow-card h2,.payroll-final-card h2{margin:0 0 4px}
.compact-summary{margin-bottom:10px}
.payroll-final-card{border:1px solid #d9cec3}
.payroll-final-total{padding:12px;border-radius:12px;background:#f7f2ec}
.payroll-final-total strong{font-size:1.2rem}
.final-actions{margin-top:4px}
@media(max-width:760px){.payroll-flow-card,.payroll-final-card{grid-template-columns:32px 1fr;column-gap:10px}.payroll-step{width:28px;height:28px}}

.compact-head{margin-bottom:10px}
.compact-head h1{margin-bottom:2px}
.compact-card{padding:14px 16px;margin-bottom:12px}
.compact-title{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.compact-title h2{margin:0;font-size:18px}
.compact-card .payroll-step{width:24px;height:24px;font-size:12px;flex:0 0 24px}
.compact-actions{margin-top:10px}
.compact-summary-grid{gap:8px}
.compact-summary-grid>div{padding:8px 10px}
.payroll-adjustments-inline{margin-top:12px;padding-top:10px;border-top:1px solid #e7ddd4}
.compact-subhead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
@media(max-width:760px){.compact-card{padding:12px}.compact-summary-grid{grid-template-columns:1fr 1fr}.compact-subhead{align-items:flex-start;flex-direction:column}}

.payroll-payments-inline{margin-top:12px;padding-top:10px;border-top:1px solid #e7ddd4}
.payroll-period-note{margin-top:10px}
.payroll-final-actions{justify-content:flex-end;margin-top:12px}

.payroll-auto-details{margin-top:10px;padding-top:10px;border-top:1px solid #e7ddd4}
.payroll-auto-details summary{cursor:pointer;font-weight:700}
.payroll-auto-details[open] summary{margin-bottom:10px}
.auto-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.auto-detail-grid>div{min-width:0}
.auto-source-list{margin-top:8px;display:grid;gap:5px}
.compact-row{padding:7px 0}
@media(max-width:760px){.auto-detail-grid{grid-template-columns:1fr}}

.compact-card.payroll-final-card{display:block;position:static}
.status.warn{background:#fff0d8;color:#8a5a16}
.payroll-warning{margin:0 0 12px;padding:12px 14px;border-radius:12px;background:#fff4e5;border:1px solid #ead0a8;display:grid;gap:4px}
.payroll-line,.auto-row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:9px 0;border-bottom:1px solid #eee6de}
.payroll-line:last-child,.auto-row:last-child{border-bottom:0}
.payroll-line-actions,.auto-values{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.auto-panel{min-width:0}
.auto-panel>.muted{line-height:1.45}
.auto-source-list{min-width:0}
.payroll-auto-details{clear:both}
@media(max-width:980px){.auto-detail-grid{grid-template-columns:1fr}}
@media(max-width:760px){
  .payroll-line,.auto-row{align-items:flex-start;flex-direction:column}
  .payroll-line-actions,.auto-values{justify-content:flex-start;width:100%}
  .compact-summary-grid{grid-template-columns:1fr 1fr}
}

:root{
  --bg:#f5f0ea;--panel:#fffdf9;--panel2:#f7f1eb;--line:#e8ddd2;--ink:#251f1a;--muted:#8a7d72;
  --accent:#9b826d;--accent-dark:#6f5948;--green:#dfeee1;--green-ink:#3e6b49;--warn:#fff0d8;
}
body{background:linear-gradient(180deg,#f7f2ec 0%,#f2ebe4 100%);color:var(--ink)}
.shell{grid-template-columns:244px 1fr}
.sidebar{background:rgba(239,232,224,.92);backdrop-filter:blur(16px);padding:30px 20px 22px;display:flex;flex-direction:column;min-height:100vh}
.brand-wrap{padding:0 10px 28px}.brand{font-size:34px;letter-spacing:-.7px;margin:0}.brand-sub{font-size:10px;letter-spacing:.28em;color:#8b7f74;margin-top:3px}
.nav{gap:6px}.nav button{display:flex;align-items:center;gap:11px;padding:12px 13px;font-weight:600;color:#685d54}
.nav button.active{background:rgba(255,255,255,.88);box-shadow:0 8px 24px rgba(92,72,54,.08);color:#2a241f}
.nav-ico{width:24px;text-align:center;font-size:16px}
.sidebar-note{margin-top:auto;background:rgba(255,255,255,.58);border:1px solid rgba(255,255,255,.7);padding:16px;border-radius:18px;line-height:1.35}
.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:10px;color:#9a8b7e;font-weight:800}
.main{padding:24px 30px 40px;max-width:1600px;width:100%;margin:0 auto}
.top{padding:4px 0 20px;margin-bottom:12px;border-bottom:1px solid rgba(221,209,197,.8)}
.top-user{display:flex;align-items:center;gap:14px}.top-user>div:last-child{display:grid;gap:1px}.brand-mobile{display:none}
.top-actions button{border:1px solid #ded3c9;background:rgba(255,255,255,.72);border-radius:12px;padding:9px 11px;color:#5f544b}.top-actions button:hover{background:#fff}
.top-guide{font-weight:700}
.card{background:rgba(255,253,249,.96);border:1px solid rgba(232,221,210,.9);box-shadow:0 12px 35px rgba(84,64,46,.07);border-radius:20px}
.dash-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;padding:14px 2px 22px}.dash-hero h1{font-family:Georgia,serif;font-size:34px;font-weight:500;margin:4px 0 6px}.soft-heart{color:#a9907b;font-weight:400}
.hero-guide{background:rgba(255,255,255,.72)}
.dash-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:16px}
.metric-card{display:flex;align-items:flex-start;gap:12px;padding:18px}.metric-card .metric{font-size:26px;margin:5px 0 2px;font-weight:700;letter-spacing:-.03em}
.metric-icon,.quick-icon{width:34px;height:34px;border-radius:12px;background:#efe7df;display:grid;place-items:center;color:#745f4d;flex:0 0 auto}
.dashboard-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:16px;margin-bottom:16px}.dash-card{padding:18px}
.card-title{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:10px}.card-title h2,.quick-actions h2,.guide-banner h2,.admin-day-card h2{margin:3px 0 0;font-size:20px}
.notice-row,.quick-action{width:100%;border:0;background:transparent;display:flex;align-items:center;gap:11px;text-align:left;padding:11px 4px;border-bottom:1px solid #eee5dc;color:inherit}.notice-row:last-child{border-bottom:0}.notice-row small,.quick-action small{display:block;color:var(--muted);margin-top:3px}.notice-row b,.quick-action b{margin-left:auto;color:#9f9185;font-size:20px}
.notice-dot{width:9px;height:9px;border-radius:50%;background:#d9cec3}.notice-dot.attention{background:#d49b4f}.notice-dot.ok{background:#79a67e}
.dash-person{display:flex;align-items:center;gap:11px;padding:10px 0;border-bottom:1px solid #eee5dc}.dash-person:last-child{border-bottom:0}.avatar-mini{width:34px;height:34px;border-radius:50%;background:#eee5dd;display:grid;place-items:center;font-family:Georgia,serif}.dash-person-main{display:grid;flex:1}.dash-kpi{display:grid;text-align:right}
.quick-actions{padding:18px}.quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:12px}.quick-action{background:#faf6f2;border:1px solid #ece2d9;border-radius:14px;padding:12px;border-bottom:1px solid #ece2d9}
.admin-day-card{padding:20px;display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}.admin-day-main{display:flex;align-items:center;justify-content:space-between;gap:18px;flex:1}.admin-main-action{width:auto}
.admin-metrics{grid-template-columns:repeat(3,1fr)}
.checklist-item{display:flex;align-items:center;gap:11px;padding:10px 0;border-bottom:1px solid #eee5dc}.checklist-item:last-child{border-bottom:0}.checklist-item>div{display:grid}.check-circle{width:28px;height:28px;border-radius:50%;border:1px solid #d8ccc1;display:grid;place-items:center;font-size:12px}.check-circle.done{background:#e5f0e6;border-color:#d0e4d3;color:#4f7656}
.personal-kpi{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.personal-kpi span{background:#faf6f2;padding:13px;border-radius:14px;display:grid;gap:4px}.personal-kpi small{color:var(--muted)}.personal-kpi strong{font-size:22px}
.guide-banner{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 20px}
.guide-card{padding:24px}.guide-head{display:flex;justify-content:space-between;gap:16px}.guide-head h2{margin:4px 0 0}.guide-close{border:0;background:#f1ebe5;width:32px;height:32px;border-radius:50%;font-size:22px}.guide-steps{display:grid;gap:6px;margin:18px 0}.guide-step{display:grid;grid-template-columns:34px 1fr;gap:11px;padding:10px 0}.guide-num{width:28px;height:28px;border-radius:50%;background:#efe5dc;display:grid;place-items:center;font-size:12px;font-weight:700}.guide-step p{margin:4px 0 0;color:var(--muted);line-height:1.45}
.primary{background:linear-gradient(135deg,#9a7f68,#7e6653);box-shadow:0 8px 18px rgba(126,102,83,.16)}
.secondary{background:#fffdf9}
.status{font-weight:700}

@media(max-width:980px){
  .dash-metrics{grid-template-columns:repeat(2,1fr)}
  .dashboard-grid{grid-template-columns:1fr}
  .quick-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
  .shell{padding-bottom:82px}
  .main{padding:16px 14px 24px}
  .top{align-items:center;gap:8px;padding:0 0 14px;margin-bottom:8px}
  .top-user{gap:9px}.brand-mobile{display:block;font-size:21px;margin-right:3px}.top-user>div:last-child strong{font-size:13px}
  .top-user>div:last-child .small{font-size:11px;margin:0}
  .top-actions button{padding:8px 9px;font-size:12px}.top-actions button span{display:none}
  #changePassword{display:none}
  .dash-hero{align-items:flex-start;padding:10px 1px 16px}.dash-hero h1{font-size:28px}.hero-guide{display:none}
  .dash-metrics{grid-template-columns:1fr 1fr;gap:9px}
  .metric-card{padding:14px;gap:9px}.metric-icon{width:30px;height:30px}.metric-card .metric{font-size:21px}
  .dashboard-grid{gap:10px}.dash-card{padding:14px}.card-title h2,.quick-actions h2,.guide-banner h2,.admin-day-card h2{font-size:18px}
  .quick-actions{padding:14px}.quick-grid{grid-template-columns:1fr 1fr;gap:8px}.quick-action{padding:10px}
  .admin-day-card{display:block;padding:16px}.admin-day-main{align-items:flex-start}.admin-main-action{width:100%;margin-top:12px}
  .admin-metrics{grid-template-columns:1fr 1fr}.admin-metrics .metric-card:last-child{grid-column:1/-1}
  .guide-banner{align-items:flex-start;flex-direction:column}
  .bottom-nav{padding:7px 4px calc(7px + env(safe-area-inset-bottom));box-shadow:0 -8px 28px rgba(80,60,43,.08)}
  .bottom-nav button{display:grid;gap:3px;place-items:center}.bottom-ico{font-size:17px}
  .bottom-nav.owner-nav{grid-template-columns:repeat(5,1fr)}
  .bottom-nav.owner-nav button{font-size:10px}
  .guide-card{padding:20px 16px calc(18px + env(safe-area-inset-bottom))}
}

.shift-premium{padding:20px}.shift-premium-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:16px}.shift-premium-head h2{margin:3px 0 0}
.empty-state{text-align:center;padding:30px 18px}.empty-icon{width:48px;height:48px;border-radius:16px;background:#efe7df;display:grid;place-items:center;margin:0 auto 12px;font-size:22px;color:#745f4d}.empty-state h2{margin:0 0 6px}
.shift-money-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.money-field{display:grid;gap:7px}.money-field>span{font-size:13px;color:var(--muted);font-weight:700}.money-field>div{display:flex;align-items:center;background:#faf7f3;border:1px solid #e6dbd0;border-radius:14px;padding:0 12px}.money-field input{width:100%;border:0;background:transparent;padding:14px 0;outline:0;font-size:18px;font-weight:700;color:var(--ink)}.money-field b{color:#9a8a7c}
.shift-result-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:14px}.shift-result-grid>div{background:#f8f3ee;padding:12px;border-radius:14px;display:grid;gap:4px}.shift-result-grid strong{font-size:18px}.shift-result-grid .shift-total{background:#eee4da}.shift-actions{margin-top:14px}
.shift-owner-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.owner-shift-card{padding:16px}.owner-shift-top{display:flex;justify-content:space-between;gap:10px}.owner-shift-top>div{display:grid}.owner-shift-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0}.owner-shift-stats span{display:grid;gap:3px}.owner-shift-stats small{color:var(--muted)}.owner-shift-open{font-size:13px;color:#7d6755;font-weight:700}
.owner-kpi-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.kpi-person-card{padding:16px}.kpi-card-head{display:flex;justify-content:space-between;gap:10px}.kpi-card-head>div{display:grid}.kpi-band{font-size:11px;font-weight:800;padding:6px 8px;border-radius:999px;background:#eee7df;height:max-content}.kpi-band.great{background:#dfeee1;color:#477054}.kpi-band.good{background:#e8eedf;color:#607144}.kpi-band.mid{background:#fff0d8;color:#8a611e}.kpi-band.low{background:#f4e3e1;color:#9a5049}
.kpi-conversion{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin:14px 0 9px}.kpi-conversion>strong{font-size:34px;letter-spacing:-.03em}.progress-track{height:8px;background:#eee5dc;border-radius:999px;overflow:hidden}.progress-track i{display:block;height:100%;background:linear-gradient(90deg,#a88d76,#7d6754);border-radius:999px}.progress-track.large{height:10px}.kpi-card-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px}.kpi-card-grid span{background:#faf6f2;border-radius:12px;padding:9px;display:grid;gap:3px}.kpi-card-grid small{color:var(--muted)}.kpi-card-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:12px}
.kpi-hero-grid{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:12px;margin-bottom:14px}.kpi-focus-card,.kpi-progress-card,.kpi-bonus-card{padding:18px}.kpi-focus-card{display:flex;justify-content:space-between;align-items:center;gap:16px}.kpi-big{font-size:42px;font-weight:800;letter-spacing:-.04em;margin:4px 0}.kpi-ring{width:92px;height:92px;border-radius:50%;background:radial-gradient(circle at center,#fffdf9 58%,transparent 59%),conic-gradient(#9b826d 0 72%,#eee5dc 72%);display:grid;place-items:center;font-size:24px;font-weight:800}.kpi-ring small{display:block;font-size:11px;color:var(--muted);font-weight:500}.bonus-split{display:grid;grid-template-columns:1fr 1fr;gap:8px}.bonus-split span{background:#faf6f2;padding:10px;border-radius:12px;display:grid;gap:3px}.bonus-split small{color:var(--muted)}
.lead-card{padding:16px}.lead-row{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:11px 0;border-bottom:1px solid #eee5dc}.lead-row:last-child{border-bottom:0}.lead-main{display:flex;align-items:center;gap:10px}.lead-actions{display:flex;gap:8px;align-items:center}.compact-empty{padding:16px}
@media(max-width:980px){.shift-owner-grid,.owner-kpi-grid{grid-template-columns:1fr}.kpi-hero-grid{grid-template-columns:1fr 1fr}.kpi-bonus-card{grid-column:1/-1}}
@media(max-width:760px){.shift-money-grid,.shift-result-grid{grid-template-columns:1fr 1fr}.shift-result-grid .shift-total{grid-column:1/-1}.owner-shift-stats{grid-template-columns:1fr 1fr}.kpi-card-grid{grid-template-columns:1fr 1fr}.kpi-hero-grid{grid-template-columns:1fr}.kpi-bonus-card{grid-column:auto}.lead-row{align-items:flex-start;flex-direction:column}.lead-actions{width:100%;justify-content:space-between}.kpi-focus-card{align-items:flex-start}.kpi-ring{width:78px;height:78px}}

.payroll-toolbar{display:flex;gap:16px;align-items:end;flex-wrap:wrap;padding:16px;margin-bottom:16px}.payroll-toolbar .field{margin:0;min-width:180px}
.payroll-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.payroll-person-card{padding:16px}.payroll-person-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.payroll-person-head>div{display:grid}.payroll-inline-warning{margin:10px 0;padding:9px 10px;border-radius:10px;background:#fff3e1;color:#865b22;font-size:12px}
.payroll-person-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:14px 0}.payroll-person-grid span,.payroll-person-total span{display:grid;gap:3px}.payroll-person-grid small,.payroll-person-total small{color:var(--muted)}.payroll-person-total{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding-top:12px;border-top:1px solid #eee5dc;margin-bottom:12px}.payroll-person-total .due{background:#f2e8df;border-radius:12px;padding:8px 10px}.payroll-person-card>.payroll-detail{width:100%}
.employee-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:16px}.employee-card{padding:16px}.employee-card-head{display:flex;align-items:center;gap:10px}.employee-avatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#eee4db;font-family:Georgia,serif;font-size:20px;color:#6d5848;flex:0 0 auto}.employee-avatar.large{width:58px;height:58px;font-size:26px}.employee-main{display:grid;flex:1}.employee-email{margin:14px 0;color:#776b61;font-size:13px;overflow-wrap:anywhere}.employee-card-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;padding-top:12px;border-top:1px solid #eee5dc}
.invite-panel{padding:16px}.employee-profile-hero{padding:18px;display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:14px}.employee-profile-left{display:flex;align-items:center;gap:14px}.employee-profile-left h1{margin:2px 0 4px}.employee-profile-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.employee-profile-grid>article{padding:16px}.employee-shifts-wide{grid-column:1/-1}.employee-pay-values{display:flex;gap:12px;flex-wrap:wrap;text-align:right}.employee-pay-values span{display:grid;gap:2px}.employee-pay-values small{color:var(--muted);font-size:11px}
#payrollDetail>.section-head{background:rgba(255,253,249,.72);border:1px solid var(--line);border-radius:18px;padding:14px 16px}.compact-card.payroll-final-card{box-shadow:0 16px 42px rgba(84,64,46,.08)}.payroll-final-total{background:linear-gradient(135deg,#eee4da,#f5eee8)}
@media(max-width:1100px){.employee-card-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.payroll-card-grid{grid-template-columns:1fr}.employee-profile-grid{grid-template-columns:1fr}.employee-shifts-wide{grid-column:auto}}
@media(max-width:760px){.payroll-toolbar{display:grid;grid-template-columns:1fr}.payroll-person-grid{grid-template-columns:1fr 1fr}.employee-card-grid{grid-template-columns:1fr}.employee-card-foot{align-items:flex-start}.employee-profile-hero{align-items:flex-start}.employee-profile-left{align-items:flex-start}.employee-pay-values{text-align:left}.payroll-person-total{grid-template-columns:1fr 1fr}.payroll-person-total .due{grid-column:1/-1}}

button{color:var(--ink);-webkit-appearance:none;appearance:none}
.primary{color:#fff!important}
.secondary,.linklike,.actions-inline .secondary{color:var(--accent-dark)!important}
.actions-inline .secondary{background:#f5eee8;border-color:#d9cbbf}
.actions-inline .primary{background:linear-gradient(135deg,#9a7f68,#7e6653);border:0}

.mobile-brand-block{display:none}
.checklist-toggle{width:100%;border:0;background:transparent;text-align:left;color:inherit}
.checklist-toggle.is-done{opacity:.72}
.checklist-toggle.is-done strong{text-decoration:line-through;text-decoration-thickness:1px}
.checklist-title{align-items:center}
.check-progress{height:8px;background:#eee5dc;border-radius:999px;overflow:hidden;margin:0 0 10px}
.check-progress i{display:block;height:100%;background:linear-gradient(90deg,#a88d76,#7d6754);border-radius:999px;transition:width .45s cubic-bezier(.2,.8,.2,1)}
.owner-note-card{padding:16px 18px;margin-bottom:12px;border-left:3px solid #a58b74}
.owner-note-card p{margin:7px 0 0;line-height:1.45}
.owner-task-btn{margin-left:4px}
.owner-checklist-modal textarea{width:100%}

@media(max-width:760px){
  .sidebar{display:none!important}
  .shell{display:block!important;padding-bottom:86px}
  .main{padding:12px 14px 24px}
  .top.compact-mobile-top{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:8px 0 14px;margin-bottom:12px}
  .mobile-brand-block{display:grid;min-width:112px}
  .brand-mobile{display:block;font-family:Georgia,serif;font-size:25px;line-height:1}
  .mobile-brand-sub{font-size:8px;letter-spacing:.22em;color:#9a8b7e;margin-top:5px}
  .top-user{min-width:0}
  .top-user strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
  .top-user .small{font-size:11px}
  .top-actions{gap:6px}
  .top-actions button{min-width:40px;height:40px;padding:0 10px;border-radius:12px}
  #logout{min-width:auto;padding:0 12px}
  .dash-hero{padding-top:4px}
  .bottom-nav{grid-template-columns:repeat(3,1fr);justify-items:stretch}
  .bottom-nav button{width:100%;text-align:center}
  .bottom-nav.owner-nav{grid-template-columns:repeat(5,1fr)}
  .checklist-item{padding:12px 0}
  .owner-task-btn{margin-left:auto}
  .dash-person{flex-wrap:wrap}
}

.mobile-identity{display:flex;align-items:center;gap:14px;min-width:0}
.admin-checklist-priority{margin:0 0 12px;padding:16px}
@media(max-width:760px){
  .top.compact-mobile-top{grid-template-columns:1fr auto}
  .mobile-identity{gap:12px}
  .mobile-brand-block{min-width:118px}
  .top-user{display:grid;gap:1px;min-width:0}
  .top-user strong{font-size:15px}
  .top-user .small{font-size:11px}
  .admin-checklist-priority{margin-top:0}
}

.task-notice{display:flex;align-items:center;gap:12px;margin:0 0 12px;padding:13px 14px;border-radius:16px;background:#f1e8df;border:1px solid #dfd1c4;box-shadow:0 10px 28px rgba(83,64,48,.06);transition:opacity .2s ease,transform .2s ease}
.task-notice.hide{opacity:0;transform:translateY(-6px)}
.task-notice-icon{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#dfeee1;color:#4c7655;font-weight:800;flex:0 0 auto}
.task-notice>div:nth-child(2){display:grid;gap:2px;flex:1}
.task-notice span{font-size:12px;color:var(--muted)}
.task-notice-close{border:0;background:transparent;color:var(--accent-dark);font-weight:700;padding:8px}
@media(max-width:760px){.task-notice{align-items:flex-start}.task-notice-close{padding:7px 2px}}

@media(max-width:760px){
  .top.compact-mobile-top{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
    padding:8px 0 12px;
  }
  .mobile-identity{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
  }
  .mobile-brand-block{min-width:0;flex:0 1 auto}
  .brand-mobile{font-size:26px}
  .top-user{
    min-width:0;
    text-align:right;
    align-items:end;
    flex:0 1 46%;
  }
  .top-user strong{font-size:15px;max-width:150px}
  .top-user .small{font-size:11px}
  .top-actions{
    width:100%;
    display:flex;
    justify-content:flex-end;
    gap:8px;
    padding-top:2px;
  }
  .top-actions button{height:38px;min-width:38px;border-radius:12px}
  #logout{padding:0 14px}
}
@media(max-width:390px){
  .mobile-identity{align-items:flex-start}
  .brand-mobile{font-size:24px}
  .top-user strong{max-width:130px;font-size:14px}
  .top-actions{justify-content:space-between}
  .top-actions button{flex:0 0 auto}
  #logout{margin-left:auto}
}

@media(max-width:760px){
  .top.compact-mobile-top{
    display:grid;
    grid-template-columns:1fr;
    gap:8px;
    padding:12px 14px;
    margin:0 0 12px;
    background:rgba(255,253,250,.72);
    border:1px solid rgba(184,164,146,.28);
    border-radius:20px;
    box-shadow:0 8px 24px rgba(80,62,47,.045);
  }
  .mobile-identity{
    width:100%;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:16px;
  }
  .mobile-brand-block{min-width:0}
  .brand-mobile{font-size:24px;line-height:.95}
  .mobile-brand-sub{margin-top:6px;font-size:8px;letter-spacing:.24em}
  .top-user{
    min-width:0;
    display:grid;
    gap:1px;
    text-align:right;
    justify-items:end;
  }
  .top-user strong{font-size:14px;line-height:1.15;max-width:145px}
  .top-user .small{font-size:10px;line-height:1.2}
  .top-actions{
    width:auto;
    margin-left:auto;
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:6px;
    padding:0;
  }
  .top-actions button{
    height:34px;
    min-width:34px;
    padding:0 9px;
    border-radius:11px;
    background:rgba(255,255,255,.7);
    border:1px solid #ded2c7;
    box-shadow:none;
    font-size:14px;
  }
  #logout{min-width:64px;padding:0 12px;font-size:13px}
  #changePassword{display:none!important}
}
@media(max-width:390px){
  .top.compact-mobile-top{padding:11px 12px;border-radius:18px}
  .mobile-identity{gap:10px}
  .brand-mobile{font-size:22px}
  .top-user strong{font-size:13px;max-width:125px}
  .top-actions button{height:32px;min-width:32px}
  #logout{min-width:60px}
}

.quick-grid>*{min-width:0}
.quick-action{min-width:0;overflow:hidden}
.quick-action strong,.quick-action span{overflow-wrap:anywhere}
.owner-shift-list{padding:0;overflow:hidden}
.owner-shift-row{width:100%;display:grid;grid-template-columns:minmax(150px,1.3fr) repeat(3,minmax(90px,.8fr)) auto 18px;gap:12px;align-items:center;padding:12px 14px;border:0;border-bottom:1px solid #eee5dc;background:transparent;text-align:left}
.owner-shift-row:last-child{border-bottom:0}
.owner-shift-row>span{display:grid;gap:2px;min-width:0}
.owner-shift-row small{color:var(--muted);font-size:11px}
.owner-shift-row b{font-size:20px;color:#8b7766}
.payroll-card-grid{display:block}
.payroll-compact-list{border:1px solid #eadfd5;border-radius:16px;overflow:hidden;background:#fffdfa}
.payroll-compact-row{position:relative;width:100%;display:grid;grid-template-columns:minmax(150px,1.25fr) repeat(3,minmax(95px,.85fr)) auto 18px;gap:12px;align-items:center;padding:12px 14px;border:0;border-bottom:1px solid #eee5dc;background:transparent;text-align:left}
.payroll-compact-row:last-child{border-bottom:0}
.payroll-compact-row>span{display:grid;gap:2px;min-width:0}
.payroll-compact-row small{font-size:11px;color:var(--muted)}
.payroll-compact-row em{grid-column:1/-1;color:#865b22;font-size:11px;font-style:normal}
.period-switch button.active{background:#b79c84!important;color:#fff!important;border-color:#b79c84!important}
@media(max-width:760px){
  .quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .quick-action{padding:10px 9px!important}
  .quick-action strong{font-size:14px}
  .quick-action span{font-size:11px}
  .owner-shift-row{grid-template-columns:minmax(0,1.3fr) minmax(82px,.8fr) auto 14px;gap:8px;padding:11px 12px}
  .owner-shift-row>span:nth-child(3),.owner-shift-row>span:nth-child(4){display:none}
  .owner-shift-row .status{font-size:10px;padding:5px 7px}
  .payroll-compact-row{grid-template-columns:minmax(0,1.25fr) minmax(88px,.8fr) auto 14px;gap:8px;padding:11px 12px}
  .payroll-compact-row>span:nth-child(3),.payroll-compact-row>span:nth-child(4){display:none}
  .payroll-compact-row .status{font-size:10px;padding:5px 7px}
  .payroll-toolbar{padding:12px}
  .period-switch button{min-height:40px}
}

@media(max-width:760px){
  .top.compact-mobile-top{
    position:relative;
    display:grid;
    grid-template-columns:1fr;
    gap:7px;
    padding:10px 12px 11px;
  }
  .mobile-head-row{
    position:relative;
    min-height:42px;
    display:flex;
    align-items:center;
    justify-content:flex-end;
  }
  .mobile-brand-block{
    position:absolute;
    left:50%;
    transform:translateX(-50%);
    min-width:0;
    text-align:left;
  }
  .brand-mobile{font-size:22px}
  .mobile-brand-sub{font-size:7px;letter-spacing:.22em;margin-top:4px}
  .top-user{
    display:block;
    max-width:42%;
    text-align:right;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .top-user strong{display:block;max-width:none;font-size:12px;line-height:1.2;overflow:hidden;text-overflow:ellipsis}
  .role-inline{font-weight:500;color:var(--muted)}
  .top-actions{gap:5px}
  .top-actions button{height:31px;min-width:31px;padding:0 8px;font-size:13px}
  #logout{min-width:58px}
  .quick-action{display:grid;grid-template-columns:28px minmax(0,1fr) 10px;gap:8px;align-items:center}
  .quick-action .quick-icon{width:28px;height:28px;border-radius:10px}
  .quick-action strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}
  .quick-action small{display:none}
  .dash-metrics{gap:8px}
  .metric-card{padding:11px!important;gap:8px!important}
  .metric-icon{width:28px!important;height:28px!important;border-radius:10px!important}
  .metric-card .metric{font-size:18px!important;margin:3px 0 0!important}
  .metric-card .muted.small{font-size:10px}
  .employee-card{padding:12px!important}
  .employee-avatar{width:36px;height:36px;font-size:17px}
  .employee-email{margin:9px 0;font-size:12px}
  .employee-card-foot{padding-top:9px}
  .employee-card-foot .muted{font-size:11px}
  .owner-shift-row{grid-template-columns:minmax(0,1.25fr) minmax(92px,.9fr) auto 12px}
  .owner-shift-row>span:nth-child(3),.owner-shift-row>span:nth-child(4){display:none}
  .payroll-compact-row{
    grid-template-columns:minmax(0,1fr) auto;
    gap:5px 10px;
    padding:12px;
    align-items:start;
  }
  .payroll-row-main{grid-column:1;grid-row:1}
  .payroll-compact-row>.status{grid-column:2;grid-row:1;justify-self:end;max-width:170px;text-align:center}
  .payroll-accrued{grid-column:1;grid-row:2}
  .payroll-paid{display:none!important}
  .payroll-due{grid-column:2;grid-row:2;text-align:right}
  .payroll-compact-row>b{display:none}
  .payroll-compact-row>em{grid-column:1/-1;grid-row:3;margin-top:2px}
  .payroll-compact-row strong{line-height:1.15}
}
@media(max-width:390px){
  .top-user{max-width:45%}
  .top-user strong{font-size:11px}
  .brand-mobile{font-size:21px}
  .quick-grid{gap:7px!important}
}

@media(max-width:760px){
  .mobile-head-row{
    min-height:46px;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:14px;
  }
  .mobile-brand-block{
    position:static!important;
    transform:none!important;
    justify-self:start;
    align-self:center;
    text-align:left;
    min-width:0;
  }
  .top-user{
    justify-self:end;
    align-self:center;
    max-width:46%;
    text-align:right;
  }
  .brand-mobile{line-height:1}
  .mobile-brand-sub{margin-top:5px}
}

@media(max-width:760px){
  .top.compact-mobile-top{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:14px;
    min-height:150px;
    padding:16px 16px;
  }
  .mobile-brand-block{
    position:static!important;
    transform:none!important;
    align-self:center;
    justify-self:start;
    text-align:left;
    margin:0;
  }
  .brand-mobile{font-size:23px;line-height:1}
  .mobile-brand-sub{margin-top:5px;font-size:7px;letter-spacing:.22em}
  .mobile-right-stack{
    min-width:0;
    display:grid;
    justify-items:end;
    align-content:center;
    gap:12px;
  }
  .top-user{
    display:block;
    max-width:none!important;
    width:auto;
    overflow:visible!important;
    white-space:normal!important;
    text-align:right;
  }
  .top-user strong{
    display:block;
    max-width:none!important;
    overflow:visible!important;
    text-overflow:clip!important;
    white-space:nowrap!important;
    font-size:12px;
    line-height:1.2;
  }
  .role-inline{font-weight:500;color:var(--muted)}
  .top-actions{
    width:auto;
    display:flex;
    justify-content:flex-end;
    gap:6px;
    padding:0;
  }
  .top-actions button{height:32px;min-width:32px;padding:0 8px;font-size:13px}
  #logout{min-width:58px}
}
@media(max-width:390px){
  .top.compact-mobile-top{gap:10px;padding:14px 12px;min-height:142px}
  .brand-mobile{font-size:21px}
  .top-user strong{font-size:11px}
}

@media(max-width:760px){
  .top.compact-mobile-top{
    min-height:108px!important;
    padding:10px 12px!important;
    gap:10px!important;
    border-radius:18px!important;
  }
  .mobile-brand-block{
    align-self:center!important;
  }
  .brand-mobile{
    font-size:21px!important;
    line-height:1!important;
  }
  .mobile-brand-sub{
    margin-top:4px!important;
    font-size:6.5px!important;
    letter-spacing:.2em!important;
  }
  .mobile-right-stack{
    gap:8px!important;
    align-content:center!important;
  }
  .top-user strong{
    font-size:11.5px!important;
    line-height:1.15!important;
  }
  .top-actions{
    gap:5px!important;
  }
  .top-actions button{
    height:30px!important;
    min-width:30px!important;
    padding:0 7px!important;
    border-radius:10px!important;
    font-size:12px!important;
  }
  #logout{
    min-width:54px!important;
    padding:0 10px!important;
  }
}
@media(max-width:390px){
  .top.compact-mobile-top{
    min-height:102px!important;
    padding:9px 10px!important;
  }
  .brand-mobile{font-size:20px!important}
  .top-user strong{font-size:11px!important}
}

@media(max-width:760px){
  .brand-mobile{
    font-size:24px!important;
    line-height:1!important;
  }
  .mobile-brand-sub{
    margin-top:5px!important;
    font-size:7.5px!important;
    letter-spacing:.21em!important;
  }
}
@media(max-width:390px){
  .brand-mobile{font-size:22.5px!important}
  .mobile-brand-sub{font-size:7px!important}
}

@media(max-width:760px){
  .owner-kpi-grid{gap:8px!important}
  .kpi-person-card{padding:11px!important;border-radius:14px!important}
  .kpi-card-head{gap:8px!important;align-items:flex-start}
  .kpi-card-head strong{font-size:14px}
  .kpi-card-head .small{font-size:10px}
  .kpi-band{font-size:9px!important;padding:4px 6px!important}
  .kpi-conversion{margin:9px 0 6px!important;align-items:center!important}
  .kpi-conversion>strong{font-size:26px!important}
  .kpi-conversion .small{font-size:10px!important;text-align:right;max-width:48%}
  .kpi-card-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important;margin-top:8px!important}
  .kpi-card-grid span{padding:6px!important;border-radius:9px!important}
  .kpi-card-grid small{font-size:9px!important}
  .kpi-card-grid strong{font-size:11px!important}
  .kpi-card-foot{margin-top:8px!important}
  .kpi-card-foot .small{font-size:10px!important}
}
@media(max-width:390px){
  .kpi-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

.date-picker-card{max-width:420px}
.date-picker-card input[type="date"]{
  width:100%;
  min-height:48px;
  font-size:16px;
  border-radius:12px;
  padding:10px 12px;
}
@media(max-width:760px){
  .date-picker-card{width:min(92vw,420px)}
  input[type="date"]{font-size:16px}
}

.app-toast{position:fixed;left:50%;bottom:92px;z-index:9999;transform:translate(-50%,12px);opacity:0;background:#4f6e57;color:#fff;padding:11px 14px;border-radius:13px;box-shadow:0 12px 32px rgba(0,0,0,.16);font-size:13px;font-weight:700;transition:.2s ease}
.app-toast.error{background:#8d4e48}.app-toast.show{opacity:1;transform:translate(-50%,0)}
.retry-state{display:grid;gap:8px;justify-items:start;padding:18px}.retry-state span{color:var(--muted);font-size:12px}
.nav-attention-badge{position:absolute;top:4px;right:22%;min-width:17px;height:17px;padding:0 4px;border-radius:999px;background:#9a6b52;color:#fff;font-size:9px;font-weight:800;display:grid;place-items:center}
.bottom-nav button{position:relative}
.mobile-filter-bar{display:flex;gap:10px;align-items:end;justify-content:space-between;margin:0 0 10px;padding:10px 12px;background:#f8f3ee;border:1px solid #eadfd5;border-radius:14px}
.mobile-filter-bar label{display:grid;gap:4px;font-size:10px;color:var(--muted)}
.mobile-filter-bar input{min-height:36px;border-radius:10px;border:1px solid #ddd0c5;background:#fff;padding:6px 8px}
.filter-pills{display:flex;gap:5px;overflow:auto;-webkit-overflow-scrolling:touch}
.filter-pills button{white-space:nowrap;border:1px solid #ded2c7;background:#fff;padding:8px 10px;border-radius:999px;font-size:11px;color:var(--accent-dark)}
.filter-pills button.active{background:#b79c84;color:#fff;border-color:#b79c84}
.sleep-return-row{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid #eee5dc}.sleep-return-row:last-child{border-bottom:0}
.sleep-return-side{text-align:right}.sleep-return-side .row-actions{margin-top:7px}

@media(max-width:760px){
  .generic-form-modal .modal-card{width:min(92vw,440px);max-height:88vh;overflow:auto}
  .mobile-filter-bar{display:grid;grid-template-columns:1fr;align-items:stretch}
  .mobile-filter-bar input{width:100%}
  .filter-pills{width:100%}
  .sleep-return-row{display:grid;grid-template-columns:1fr;gap:8px}
  .sleep-return-side{text-align:left}
  .sleep-return-side .row-actions{display:flex;flex-wrap:wrap;gap:6px}
  .nav-attention-badge{right:16%;top:3px}
}

.owner-task-progress{margin:0 0 12px;padding:10px 12px;background:#f8f3ee;border:1px solid #eadfd5;border-radius:12px}
.owner-task-progress strong{display:block;margin-bottom:7px;font-size:12px}

.kpi-split-compact{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.kpi-split-compact span{display:flex;justify-content:space-between;gap:6px;align-items:center;background:#faf6f2;border-radius:10px;padding:6px 8px;font-size:10px}
.kpi-owner-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px;align-items:center}
.kpi-visits-card{max-width:560px;width:min(94vw,560px);max-height:88vh;overflow:auto}
.kpi-visit-list{display:grid;gap:8px;margin-top:12px}
.kpi-visit-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 10px;padding:10px 0;border-bottom:1px solid #eee5dc}
.kpi-visit-row:last-child{border-bottom:0}
.kpi-visit-side{display:grid;justify-items:end;gap:5px}
.kpi-visit-actions{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:5px}
@media(max-width:760px){
  .kpi-split-compact{display:grid;grid-template-columns:1fr 1fr}
  .kpi-split-compact span:last-child{grid-column:1/-1}
  .kpi-owner-actions .secondary{min-height:34px}
  .kpi-visit-row{grid-template-columns:minmax(0,1fr) auto}
  .kpi-visit-actions .secondary{flex:1;min-width:86px}
}

.more-grid{display:grid;gap:10px}
.more-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;text-align:left;width:100%;border:1px solid #eadfd5}
.more-card div{display:grid;gap:3px}.more-card small{color:var(--muted)}.more-ico{font-size:22px}
.rule-summary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}
.rule-summary-grid span{display:grid;gap:3px;padding:9px 10px;background:#faf6f2;border-radius:10px}
.rule-summary-grid small,.rule-version-row small{color:var(--muted)}
.rule-version-list{display:grid;gap:8px}.rule-version-row{display:grid;gap:4px;padding:10px 0;border-bottom:1px solid #eee5dc}
.rule-version-row:last-child{border-bottom:0}.rule-version-row div{display:flex;justify-content:space-between;gap:10px}
.rule-form{display:grid;gap:10px}.rule-edit-grid{display:grid;gap:8px}
.rule-edit-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.rule-save-bar{position:sticky;bottom:74px;display:flex;gap:8px;justify-content:flex-end;padding:10px;background:rgba(252,249,246,.96);backdrop-filter:blur(8px);border-radius:14px}
.audit-list{display:grid;gap:8px}.audit-row{padding:12px}.audit-row-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.audit-row-head>div{display:grid;gap:3px}.audit-row-head small{color:var(--muted)}.audit-diff{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
.audit-json{white-space:pre-wrap;word-break:break-word;font-size:10px;background:#f8f3ee;padding:8px;border-radius:8px;max-height:220px;overflow:auto}
@media(max-width:760px){
  .rule-edit-row,.audit-diff{grid-template-columns:1fr}
  .rule-save-bar{bottom:82px}
  .rule-summary-grid{grid-template-columns:1fr 1fr}
}

.rule-entry-card{display:block;width:100%;text-align:left;border:1px solid #eadfd5}
.rule-entry-card .card-title{align-items:center}.rule-entry-card b{font-size:24px;font-weight:400}
.rule-scheduled{display:grid;gap:4px;margin-top:12px;padding:10px;border-radius:10px;background:#faf3e8}
.rule-scheduled .status{justify-self:start}.rule-history{margin-top:10px}.rule-history summary{cursor:pointer;font-weight:700}
.rule-effective-card{border:1px solid #dfcdbf}.mobile-finance-back{display:none;margin-bottom:8px}
@media(max-width:760px){
  .mobile-finance-back{display:inline-flex}
}

.profile-link{border:0;background:transparent;padding:0;text-align:right;cursor:pointer}
.profile-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.profile-wide{grid-column:1/-1}.profile-sensitive summary{display:flex;justify-content:space-between;gap:12px;cursor:pointer}
.profile-sensitive-note{margin:12px 0;padding:10px;border-radius:10px;background:#f8f3ee;color:var(--muted);font-size:12px}
.profile-save-bar{display:flex;justify-content:flex-end;position:sticky;bottom:82px;padding:10px;background:rgba(252,249,246,.96);backdrop-filter:blur(8px);border-radius:14px}
@media(max-width:760px){.profile-grid{grid-template-columns:1fr}.profile-wide{grid-column:auto}}

.finance-summary{display:grid;gap:10px;margin-bottom:10px}.finance-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.finance-kpi{display:grid;gap:3px}.finance-kpi small,.finance-kpi span{color:var(--muted)}.finance-kpi strong{font-size:20px}
.finance-rule-note{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:12px;background:#f8f3ee}
.alert-center{margin-top:10px}.alert-list{display:grid;gap:8px}.alert-item{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;width:100%;text-align:left;border:0;border-radius:12px;padding:10px;background:#faf7f4}
.alert-item div{display:grid;gap:3px}.alert-item small{color:var(--muted)}.alert-dot{width:8px;height:8px;border-radius:50%;background:#aa8c77}.alert-item.high .alert-dot{background:#8e4b3a}.alert-item.medium .alert-dot{background:#b88742}.alert-item.low .alert-dot{background:#8a8a7a}
.sim-total{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:12px}.sim-total span{display:grid;gap:4px;padding:9px;background:#f8f3ee;border-radius:10px}.sim-total small{color:var(--muted)}
.sim-list{display:grid;gap:6px}.sim-row{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid #eee5dc}.sim-row div{display:grid;gap:2px}.sim-row small{color:var(--muted)}
@media(max-width:760px){.finance-kpis,.sim-total{grid-template-columns:1fr}.rule-save-bar{flex-wrap:wrap}.rule-save-bar .primary{flex:1}}

.profile-owner-summary{display:grid;grid-template-columns:2fr 1fr 1fr;gap:8px;margin-bottom:10px}
.profile-owner-summary span{display:grid;gap:4px;min-width:0;padding:10px 11px;background:#faf6f2;border-radius:10px}
.profile-owner-summary small{color:var(--muted);font-size:11px;line-height:1.2}
.profile-owner-summary strong{font-size:14px;line-height:1.35;overflow-wrap:anywhere}
.profile-owner-wide{grid-column:auto}
.employee-shift-list{display:grid}
.employee-shift-row{display:grid;grid-template-columns:minmax(132px,.85fr) 2fr;gap:14px;align-items:center;padding:10px 0;border-bottom:1px solid #eee5dc}
.employee-shift-row:last-child{border-bottom:0}
.employee-shift-date{display:flex;align-items:center;gap:8px;min-width:0}
.employee-shift-date .status{font-size:10px;padding:3px 6px}
.employee-shift-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.employee-shift-metrics span{display:grid;gap:2px}
.employee-shift-metrics small{color:var(--muted);font-size:10px}
.employee-shift-metrics strong{font-size:14px;white-space:nowrap}
.employee-shifts-toggle{margin-top:10px}
.compact-history-empty{margin:4px 0}
@media(max-width:760px){
  .profile-owner-summary{grid-template-columns:1fr 1fr}
  .profile-owner-wide{grid-column:1/-1}
  .employee-profile-grid>article{padding:14px}
  .employee-profile-hero{padding:14px}
  .employee-profile-left{min-width:0}
  .employee-profile-left h1{font-size:24px;line-height:1.05}
  .employee-profile-left .muted{font-size:13px}
  .employee-shift-row{grid-template-columns:1fr;gap:7px;padding:10px 0}
  .employee-shift-date{justify-content:space-between}
  .employee-shift-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}
  .employee-shift-metrics strong{font-size:13px}
}

.profile-readiness{display:flex;flex-direction:column;gap:4px;margin:12px 0;padding:14px 16px;border:1px solid var(--line);border-radius:14px}
.profile-readiness.ready{background:rgba(72,140,90,.08)}
.profile-readiness.pending{background:rgba(191,139,47,.08)}
.profile-readiness span{font-size:13px;color:var(--muted)}

.job-title-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:6px}
.job-title-check{display:flex;align-items:center;gap:8px;padding:9px 10px;border:1px solid var(--line);border-radius:10px;background:#faf7f4;cursor:pointer}
.job-title-check input{width:18px;height:18px;margin:0;flex:0 0 auto}
.job-title-check span{font-size:13px;line-height:1.25}
@media(max-width:760px){.job-title-grid{grid-template-columns:1fr}}

.booking-head{align-items:flex-end}
.booking-toolbar{display:flex;align-items:end;gap:8px;padding:10px 12px;margin-bottom:12px}
.booking-date-field{margin:0;min-width:170px}
.booking-date-field input{padding:9px 11px}
.booking-list{display:grid;gap:8px}
.booking-row{display:grid;grid-template-columns:72px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 14px}
.booking-row.is-cancelled{opacity:.62}
.booking-time{display:grid;gap:2px}.booking-time strong{font-size:20px}.booking-time small{color:var(--muted)}
.booking-main{min-width:0}.booking-client-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.booking-service{margin:4px 0;font-weight:650}
.booking-actions{display:flex;gap:6px;align-items:center;justify-content:flex-end;flex-wrap:wrap}.booking-actions .linklike{padding:6px}
.booking-empty{padding:28px}
.appointment-history{display:grid;gap:4px}
@media(max-width:760px){
  .bottom-nav.owner-nav{grid-template-columns:repeat(6,1fr)}
  .bottom-nav:not(.owner-nav){grid-template-columns:repeat(4,1fr)}
  .bottom-nav.owner-nav button{font-size:9px}
  .booking-head{align-items:flex-start}
  .booking-toolbar{display:grid;grid-template-columns:auto 1fr auto auto;align-items:end;gap:6px}
  .booking-date-field{min-width:0;margin:0}.booking-date-field input{min-width:0}
  .booking-row{grid-template-columns:58px minmax(0,1fr);gap:8px;padding:11px 12px}
  .booking-time strong{font-size:18px}
  .booking-actions{grid-column:1/-1;justify-content:flex-start;border-top:1px solid #eee5dc;padding-top:8px}
  .booking-actions .secondary,.booking-actions .linklike{font-size:11px;padding:7px 8px}
}

.schedule-shell{overflow:auto;border:1px solid var(--line);border-radius:16px;background:#fff}
.schedule-head{display:grid;grid-template-columns:70px repeat(var(--staff-count,12),150px);position:sticky;top:0;z-index:5;background:#fff;border-bottom:1px solid var(--line);min-width:max-content}
.schedule-corner{position:sticky;left:0;z-index:6;background:#fff;padding:12px;color:var(--muted);font-size:12px}
.schedule-person{width:150px;padding:10px;display:flex;align-items:center;gap:8px;justify-content:center}
.schedule-person .employee-avatar{width:34px;height:34px;font-size:15px}.schedule-person strong{font-size:13px}
.schedule-body{display:flex;position:relative;min-width:max-content;height:var(--schedule-height)}
.schedule-times{width:70px;flex:0 0 70px;position:sticky;left:0;z-index:3;background:#fff;height:var(--schedule-height)}
.schedule-times span{position:absolute;right:9px;transform:translateY(-8px);font-size:12px;color:var(--muted)}
.schedule-column{width:150px;flex:0 0 150px;position:relative;border-left:1px solid #eee7e0;background:linear-gradient(to bottom,transparent 0)}
.schedule-column>i{position:absolute;left:0;right:0;border-top:1px solid #eee7e0}
.schedule-appt{position:absolute;left:4px;right:4px;width:calc(100% - 8px);border:0;border-radius:9px;background:#efe6de;padding:6px 7px;text-align:left;overflow:hidden;z-index:2}
.schedule-appt.done{background:#e2eee5}.schedule-appt strong,.schedule-appt span,.schedule-appt small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.schedule-appt strong{font-size:12px}.schedule-appt span,.schedule-appt small{font-size:10px}
.cancelled-bookings{margin-top:10px}.cancelled-row{position:static;width:100%;display:block;padding:8px;border:0;background:transparent;text-align:left}
.appointment-card-modal{align-items:flex-end}.appointment-card{width:min(620px,100%);max-height:94vh;border-radius:22px 22px 0 0}
.appointment-card-head{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;margin-bottom:12px}.appointment-card-head>strong{text-align:center}
.visit-status-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;background:#f0f2f5;border-radius:14px;padding:4px;margin-bottom:18px}.visit-status-tabs button{border:0;background:transparent;border-radius:11px;padding:10px 5px;font-size:12px}.visit-status-tabs button.active{background:#2f3437;color:#fff}
.visit-client{padding:4px 0 14px}.visit-client h2{margin:0 0 3px}.client-actions{display:flex;gap:8px;margin:12px 0}.visit-note{padding:12px;border:1px solid var(--line);border-radius:12px;white-space:pre-wrap}
.visit-service-card{padding:14px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.visit-master-line,.visit-service-line,.visit-item,.visit-pay-panel>div:first-child{display:flex;justify-content:space-between;gap:12px}.visit-service-line{margin-top:14px}.resource-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}.resource-tags span{padding:5px 8px;border-radius:8px;background:#f0f2f5;font-size:12px}
.visit-items{padding:14px 0}.visit-item{padding:8px 0}.visit-items .linklike{margin-right:12px}
.visit-pay-panel{position:sticky;bottom:calc(-18px - env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--line);padding:16px 0 calc(18px + env(safe-area-inset-bottom));margin-top:12px}.visit-pay-panel>div:first-child{font-size:20px;margin-bottom:14px}.pay-buttons{display:grid;grid-template-columns:1fr 1fr;gap:8px}.pay-buttons .secondary{grid-column:1/-1}
@media(max-width:760px){
  .schedule-shell{margin:0 -4px;border-radius:12px}
  .schedule-person{width:138px}.schedule-column{width:138px;flex-basis:138px}
  .appointment-card{padding-top:12px}
  .visit-status-tabs button{font-size:10px;padding:9px 3px}
}

.workflow-nav{grid-template-columns:repeat(5,1fr)!important}
.mobile-section-title{display:flex;justify-content:space-between;align-items:end;margin-bottom:14px}
.mobile-section-title h1{margin:2px 0 0}
.client-search-card{margin-bottom:12px}
.client-search-line{display:grid;grid-template-columns:1fr auto;gap:8px}
.client-search-line input{border:1px solid var(--line);border-radius:12px;padding:12px 13px;background:#fff}
.mobile-list,.notification-feed,.more-clean-list{display:grid;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden}
.mobile-list-row,.notification-row,.more-clean-list>button,.more-profile-card button{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;width:100%;border:0;border-bottom:1px solid #eee6df;background:#fff;padding:13px 14px;text-align:left}
.mobile-list-row:last-child,.notification-row:last-child,.more-clean-list>button:last-child{border-bottom:0}
.mobile-list-row div:nth-child(2),.notification-row div,.more-clean-list>button div{display:grid;gap:3px;min-width:0}
.mobile-list-row small,.notification-row small,.more-clean-list small,.more-profile-card small{color:var(--muted)}
.list-avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#f0ece8;font-weight:700}.list-avatar.large{width:48px;height:48px}
.client-context-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0}.client-context-grid>div{display:grid;gap:4px;padding:10px;background:#faf7f4;border-radius:10px}.client-context-grid small{color:var(--muted)}
.notification-row{grid-template-columns:auto 1fr auto auto}.notification-dot{width:9px;height:9px;border-radius:50%;background:#bbb}.notification-dot.medium{background:#d99b16}.notification-dot.high{background:#c95b4b}.notification-row em{font-style:normal;background:#f0ece8;padding:3px 7px;border-radius:999px}
.more-profile-card{padding:0}.more-profile-card button{border-bottom:0;border-radius:16px}.more-clean-list>button>span{width:32px;text-align:center;font-size:20px}
@media(max-width:760px){
  .workflow-nav{grid-template-columns:repeat(5,1fr)!important}
  .workflow-nav button{font-size:10px!important}
  .workflow-nav .bottom-ico{font-size:19px}
  .redesigned-top{min-height:0!important;padding:8px 10px!important;margin-bottom:10px!important}
  .redesigned-top .mobile-brand-block{display:none!important}
  .redesigned-top .mobile-right-stack{width:100%;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important}
  .redesigned-top .top-user{max-width:70%;overflow:hidden}
  .redesigned-top .top-user strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .redesigned-top .top-actions #logout{font-size:11px;padding:7px 8px}
  .client-context-grid{grid-template-columns:1fr}
}

.work-schedule-shell{overflow:auto;border:1px solid var(--line);border-radius:16px;background:#fff}
.work-schedule-head,.work-schedule-row{display:grid;grid-template-columns:180px repeat(7,120px);min-width:1020px}
.work-schedule-head{position:sticky;top:0;z-index:4;background:#faf7f4;border-bottom:1px solid var(--line)}
.work-schedule-head>div{padding:10px;text-align:center;font-size:12px;color:var(--muted);font-weight:700}
.work-schedule-name{position:sticky;left:0;z-index:5;background:#faf7f4!important;text-align:left!important}
.work-schedule-row{border-bottom:1px solid #eee6df}.work-schedule-row:last-child{border-bottom:0}
.work-schedule-employee{position:sticky;left:0;z-index:3;background:#fff;display:flex;align-items:center;gap:8px;padding:9px 10px;border-right:1px solid #eee6df}
.work-schedule-cell{border:0;border-right:1px solid #eee6df;background:#fff;padding:10px 6px;font-size:12px;min-height:58px}.work-schedule-cell.working{background:#eef1f4;font-weight:700}.work-schedule-cell:disabled{color:inherit}
.schedule-nav{display:flex;gap:6px}
.compact-actions{display:flex;gap:6px;flex-wrap:wrap}
.service-category-card,.service-catalog-category{margin-bottom:10px}
.service-assignment-list,.service-catalog-list{display:grid}
.service-assignment-row{display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid #eee6df}.service-assignment-row:last-child{border-bottom:0}
.service-toggle{display:flex;align-items:center;gap:9px}.service-toggle input{width:18px;height:18px}.service-toggle span{display:grid;gap:3px}.service-toggle small{color:var(--muted)}
.service-custom-fields{display:grid;grid-template-columns:1fr 1fr;gap:6px}.service-custom-fields input{width:100%;border:1px solid var(--line);border-radius:9px;padding:8px}
.service-catalog-list>div{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid #eee6df}.service-catalog-list>div:last-child{border-bottom:0}.service-catalog-list span{color:var(--muted);white-space:nowrap}
@media(max-width:760px){
  .schedule-title{align-items:flex-start}.schedule-nav{width:100%}
  .work-schedule-head,.work-schedule-row{grid-template-columns:120px repeat(7,94px);min-width:778px}
  .work-schedule-employee{padding:7px}.work-schedule-employee strong{font-size:11px}
  .work-schedule-cell{font-size:11px;padding:8px 4px;min-height:54px}
  .service-assignment-row{grid-template-columns:1fr}.service-custom-fields{padding-left:27px}
}

.sheet-grabber{width:46px;height:5px;border-radius:999px;background:#d9dde3;margin:-2px auto 12px}
.service-picker-card{width:min(620px,100%);max-height:92vh;border-radius:22px 22px 0 0;display:flex;flex-direction:column}.service-picker-modal{align-items:flex-end}
.service-picker-search{border:1px solid var(--line);border-radius:12px;padding:11px 13px;margin-bottom:10px}
.service-picker-groups{overflow:auto;flex:1}.service-picker-group{border-bottom:1px solid var(--line)}.service-picker-group summary{display:flex;justify-content:space-between;padding:14px 4px;font-size:17px;cursor:pointer}.service-picker-group summary::-webkit-details-marker{display:none}
.service-picker-row{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center;padding:12px 4px}.service-picker-row input{width:22px;height:22px}.service-picker-row span{display:grid;gap:4px}.service-picker-row small{color:var(--muted)}
.service-picker-footer{position:sticky;bottom:0;background:#fff;padding-top:12px;border-top:1px solid var(--line);display:grid;gap:8px}
.tag-strip{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}.crm-tag{display:inline-flex;align-items:center;padding:5px 9px;border-radius:7px;background:var(--tag-color);font-size:12px;font-weight:700;color:#2b2d2f}
.compact-tag-edit{margin-top:7px}.tag-picker-list{display:grid;gap:8px;margin:12px 0 18px}.tag-picker-list label{display:flex;gap:10px;align-items:center}.tag-picker-list input{width:20px;height:20px}
.tag-manager-section{margin-bottom:10px}.tag-manager-tags{display:flex;gap:8px;flex-wrap:wrap}
.visit-service-line small{display:block;margin-top:3px}
@media(max-width:760px){.service-picker-card{padding-bottom:calc(14px + env(safe-area-inset-bottom))}.service-picker-row strong{font-size:15px}}

.booking-workspace-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.booking-date-title{display:flex;align-items:center;gap:7px;border:0;background:transparent;padding:5px 2px;text-align:left}.booking-date-title span{display:grid;line-height:1.05}.booking-date-title strong{font-size:20px}.booking-date-title small{font-size:11px;color:var(--muted);margin-top:3px;text-transform:capitalize}.booking-date-title b{font-size:13px;color:var(--muted)}
.booking-head-actions{display:flex;align-items:center;gap:6px}.booking-add{width:38px;height:38px;border-radius:11px;padding:0;font-size:24px;line-height:1}.booking-native-date{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.booking-date-dock{position:sticky;bottom:calc(62px + env(safe-area-inset-bottom));z-index:18;margin:8px -2px -2px;display:grid;grid-template-columns:34px repeat(5,1fr) 34px;gap:3px;padding:6px;background:rgba(255,255,255,.96);backdrop-filter:blur(16px);border:1px solid var(--line);border-radius:14px;box-shadow:0 8px 26px rgba(36,32,28,.08)}
.booking-dock-arrow,.booking-dock-day{border:0;background:transparent;border-radius:10px;min-height:43px}.booking-dock-arrow{font-size:24px;color:var(--muted)}.booking-dock-day{display:grid;place-items:center;align-content:center;gap:1px}.booking-dock-day small{font-size:9px;text-transform:uppercase;color:var(--muted)}.booking-dock-day strong{font-size:15px}.booking-dock-day.active{background:var(--accent);color:#2d3032}.booking-dock-day.active small{color:#2d3032}
.booking-loading{padding:20px;text-align:center;color:var(--muted)}
.compact-journal{max-height:calc(100dvh - 220px);overscroll-behavior:contain}
.compact-journal .schedule-head{grid-template-columns:52px repeat(var(--staff-count,12),126px)}
.compact-journal .schedule-corner{width:52px;min-width:52px;padding:0}
.compact-journal .schedule-person{width:126px;padding:6px 5px;gap:5px;justify-content:flex-start}.compact-journal .schedule-person .employee-avatar{width:27px;height:27px;font-size:12px}.compact-journal .schedule-person strong{font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.compact-journal .schedule-times{width:52px;flex:0 0 52px}.compact-journal .schedule-times span{right:6px;font-size:10px;transform:translateY(-6px)}
.compact-journal .schedule-column{width:126px;flex:0 0 126px}.compact-journal .schedule-column>i.hour-line{border-top:1px solid #e7e9ec}.compact-journal .schedule-column>i.half-line{border-top:1px solid #f2f3f5}
.compact-journal .schedule-appt{left:3px;right:3px;width:calc(100% - 6px);border-radius:7px;padding:3px 5px}.compact-journal .schedule-appt-top{display:flex;justify-content:space-between;align-items:center;gap:3px}.compact-journal .schedule-appt-top strong{font-size:10px}.compact-journal .schedule-appt-top small{font-size:8px}.compact-journal .schedule-appt>span{font-size:9px}.compact-journal .schedule-price{font-size:8px!important;margin-top:1px}
.compact-cancelled{padding:9px 11px;margin-top:6px}.compact-cancelled summary{font-size:12px}
@media(max-width:760px){
  .booking-workspace-head{margin-top:-2px}
  .booking-today{padding:7px 9px;font-size:11px}
  .booking-date-dock{bottom:calc(67px + env(safe-area-inset-bottom));margin-left:-6px;margin-right:-6px}
  .compact-journal{margin:0 -8px;border-radius:10px;max-height:calc(100dvh - 205px)}
  .compact-journal .schedule-person{width:112px}.compact-journal .schedule-column{width:112px;flex-basis:112px}
}

.comp-scheme-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px}.comp-scheme-card{display:grid;gap:10px}
.comp-assignment-row{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;margin-bottom:8px}.comp-assignment-row>div{display:grid;gap:4px}
.team-pay-preview{display:grid;gap:9px}.team-pay-metrics{display:flex;gap:16px;flex-wrap:wrap}.team-pay-metrics span{color:var(--muted)}.team-pay-metrics strong{color:var(--text)}
@media(max-width:760px){.comp-scheme-grid{grid-template-columns:1fr}.comp-assignment-row{grid-template-columns:1fr}.comp-assignment-row button{width:100%}}

.settings-list{padding:0;overflow:hidden}.settings-row{width:100%;display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;border:0;border-bottom:1px solid var(--line);background:#fff;text-align:left;padding:13px 14px}.settings-row:last-child{border-bottom:0}.settings-row>div{display:grid;gap:3px}.settings-row small{color:var(--muted)}
.access-note{margin-bottom:16px}.access-note p{margin:6px 0 0}.access-card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:10px;margin-bottom:18px}.access-card{display:grid;gap:10px}.permission-grid{display:grid;gap:7px}.permission-check{display:flex;align-items:center;gap:9px;padding:7px 0}.permission-check input{width:19px;height:19px}
@media(max-width:760px){.settings-row{grid-template-columns:1fr auto auto}.access-card-grid{grid-template-columns:1fr}}

.finance-ops-toolbar{max-width:360px;margin-bottom:10px}
.finance-ops-kpis{margin-bottom:10px}
.finance-category-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0;margin-bottom:10px}
.finance-category-summary>div{display:flex;justify-content:space-between;gap:10px;padding:10px 12px;border-bottom:1px solid var(--line)}
.finance-category-summary>div:last-child{border-bottom:0}
.finance-tx-list{display:grid}
.finance-tx-row{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:11px 0;border-bottom:1px solid var(--line)}
.finance-tx-row:last-child{border-bottom:0}
.finance-tx-row>div{display:grid;gap:3px}
.finance-tx-row small{color:var(--muted)}
.income-text{color:#2f7a52}.expense-text{color:#b55a4a}
.finance-category-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.static-row{cursor:default}
@media(max-width:760px){
  .finance-category-grid{grid-template-columns:1fr}
  .finance-ops-toolbar{max-width:none}
  .finance-category-summary{grid-template-columns:1fr}
  .finance-tx-row{align-items:flex-start}
  .finance-tx-row>strong{white-space:nowrap}
}

/* Desktop/tablet workspace: wide layouts use the screen instead of stretching mobile cards. */
@media(min-width:761px){
  .redesign-shell{grid-template-columns:260px minmax(0,1fr)}
  .sidebar{position:sticky;top:0;height:100vh;overflow:auto}
  .main{max-width:none;padding:24px 32px 40px}
  .top{position:sticky;top:0;z-index:30;background:rgba(252,249,246,.92);backdrop-filter:blur(14px);padding:10px 0 14px;margin-bottom:16px}
  #content{max-width:1500px;width:100%;margin:0 auto}
  .section-head{align-items:flex-end}
  .section-head>div:first-child{max-width:820px}
  .cards{grid-template-columns:repeat(3,minmax(0,1fr))}
  .more-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .finance-actions{grid-template-columns:repeat(3,minmax(0,1fr))}
  .more-clean-list{grid-template-columns:repeat(3,minmax(0,1fr));background:transparent;border:0;gap:10px;overflow:visible}
  .more-clean-list>button{border:1px solid var(--line)!important;border-radius:14px;background:#fff;min-height:86px}
  .more-profile-card{max-width:560px}
  #clientsList .mobile-list{grid-template-columns:repeat(2,minmax(0,1fr));background:transparent;border:0;gap:10px;overflow:visible}
  #clientsList .mobile-list-row{border:1px solid var(--line);border-radius:14px;background:#fff;min-height:72px}
  .notification-feed{grid-template-columns:repeat(2,minmax(0,1fr));background:transparent;border:0;gap:10px;overflow:visible}
  .notification-row{border:1px solid var(--line);border-radius:14px;background:#fff;min-height:72px}
  .client-search-card{max-width:760px}
  .client-context-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .booking-workspace-head{margin-bottom:10px}
  .booking-date-title strong{font-size:24px}
  .compact-journal{max-height:calc(100vh - 210px);border-radius:16px}
  .compact-journal .schedule-head{grid-template-columns:58px repeat(var(--staff-count,12),160px)!important}
  .compact-journal .schedule-corner{width:58px;min-width:58px}
  .compact-journal .schedule-times{width:58px;flex-basis:58px}
  .compact-journal .schedule-person{width:160px;padding:8px}
  .compact-journal .schedule-person strong{font-size:12px}
  .compact-journal .schedule-column{width:160px;flex-basis:160px}
  .compact-journal .schedule-appt{padding:4px 7px}
  .compact-journal .schedule-appt-top strong{font-size:11px}
  .compact-journal .schedule-appt>span{font-size:10px}
  .booking-date-dock{position:static;max-width:620px;margin:10px 0 0;box-shadow:none;background:#fff}
  .work-schedule-shell{overflow:auto}
  .work-schedule-head,.work-schedule-row{grid-template-columns:220px repeat(7,minmax(120px,1fr));min-width:1060px}
  .work-schedule-employee{padding:12px}
  .work-schedule-cell{min-height:68px;font-size:12px}
  .employee-card-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .employee-profile-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
  .payroll-toolbar{display:flex;align-items:end;justify-content:space-between;gap:18px}
  .payroll-toolbar .field{min-width:240px}
  .payroll-compact-row{grid-template-columns:minmax(220px,1.4fr) repeat(3,minmax(120px,.7fr)) auto 24px}
  .comp-scheme-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .comp-assignment-row{grid-template-columns:minmax(0,1fr) auto}
  .finance-summary{grid-template-columns:1fr}
  .finance-category-grid{grid-template-columns:1fr 1fr}
  .finance-ops-toolbar{max-width:420px}
  .finance-category-summary{grid-template-columns:repeat(3,minmax(0,1fr))}
  .finance-tx-row{padding:13px 2px}
  .access-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .profile-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .service-category-card,.service-catalog-category{max-width:none}
  .service-assignment-row{grid-template-columns:minmax(0,1fr) 320px}
  .modal-card{max-width:680px}
  .appointment-card{width:min(760px,92vw);border-radius:20px;max-height:88vh}
  .service-picker-card{width:min(700px,92vw);border-radius:20px;max-height:88vh}
  .appointment-card-modal,.service-picker-modal{align-items:center}
}
@media(min-width:1180px){
  .employee-card-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  #clientsList .mobile-list{grid-template-columns:repeat(3,minmax(0,1fr))}
  .access-card-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}

.service-payroll-list{display:grid}
.service-payroll-row{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.service-payroll-row:last-child{border-bottom:0}
.service-payroll-row>div{display:grid;gap:3px}
.service-payroll-row small{color:var(--muted)}
.generic-pay-formula{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px}
.generic-pay-formula span{display:grid;gap:3px;padding:9px 10px;border-radius:10px;background:#faf6f2}
.generic-pay-formula small{color:var(--muted)}
@media(max-width:760px){.generic-pay-formula{grid-template-columns:1fr}}

.service-catalog-row{display:grid!important;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center}
.service-catalog-row>div:first-child{display:grid;gap:3px}
.service-online-side{display:flex;align-items:center;gap:7px}
.public-booking{min-height:100vh;background:#f6f2ed;padding:28px 16px;display:grid;place-items:start center}
.public-booking-card{width:min(760px,100%);background:#fff;border:1px solid #e9e1d9;border-radius:24px;box-shadow:0 24px 70px rgba(74,57,43,.10);overflow:hidden}
.public-booking-brand{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid #eee7e0}
.public-booking-brand>div{display:grid;gap:2px}.public-booking-brand strong{font-family:Georgia,serif;font-size:20px}.public-booking-brand span{font-size:10px;letter-spacing:.13em;color:var(--muted)}
.public-booking-staff{font-size:11px;color:var(--muted);text-decoration:none}
#publicBookingBody{padding:24px}
.public-step-head{margin-bottom:20px}.public-step-head>span{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}.public-step-head h1{margin:5px 0 5px;font-size:28px}.public-step-head p{margin:0;color:var(--muted)}
.public-service-groups{display:grid;gap:18px}.public-service-groups section{display:grid;gap:7px}.public-service-groups h2{font-size:14px;margin:0;color:#6f645b}
.public-choice-list{display:grid;gap:8px}
.public-choice{width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:14px;border:1px solid var(--line);border-radius:14px;background:#fff;text-align:left}
.public-choice>div{display:grid;gap:3px}.public-choice small{color:var(--muted)}.public-choice>b{font-size:20px;font-weight:400;color:var(--muted)}
.employee-public-choice{grid-template-columns:auto minmax(0,1fr) auto auto}.public-master-avatar{width:42px;height:42px;border-radius:50%;background:#eee7df;display:grid;place-items:center;font-family:Georgia,serif}
.public-back{border:0;background:transparent;color:var(--muted);padding:0;margin-bottom:14px}
.public-date-strip{display:flex;gap:6px;overflow:auto;padding-bottom:8px;margin-bottom:12px;scrollbar-width:none}.public-date-strip button{flex:0 0 auto;border:1px solid var(--line);background:#fff;border-radius:10px;padding:8px 10px;font-size:11px}.public-date-strip button.active{background:#2f3437;color:#fff;border-color:#2f3437}
.public-slots{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.public-slot{border:1px solid var(--line);border-radius:10px;background:#fff;padding:11px 5px;font-weight:700}
.public-booking-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0 20px}.public-booking-summary>div{display:grid;gap:4px;background:#faf7f4;padding:11px;border-radius:11px}.public-booking-summary small{color:var(--muted)}
.public-booking-form{display:grid;gap:12px}.public-booking-form label{display:grid;gap:5px;font-size:12px;font-weight:700}.public-booking-form label small{font-weight:400;color:var(--muted)}.public-booking-form input,.public-booking-form textarea{border:1px solid var(--line);border-radius:11px;padding:11px 12px;font:inherit}
.public-success{text-align:center;padding:20px 0}.public-success-mark{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#e3f0e7;color:#2f7a52;font-size:28px;margin:0 auto 14px}.public-success h1{margin:5px 0}.public-success p{color:var(--muted)}
.public-empty{text-align:center;padding:28px 14px;background:#faf7f4;border-radius:14px}.public-loading{text-align:center;color:var(--muted);padding:20px}
@media(max-width:760px){
  .service-catalog-row{grid-template-columns:1fr}.service-online-side{justify-content:space-between}
  .public-booking{padding:0;background:#fff;display:block}.public-booking-card{border:0;border-radius:0;box-shadow:none;min-height:100vh}.public-booking-brand{padding:16px}.public-booking-staff{display:none}#publicBookingBody{padding:18px 16px calc(24px + env(safe-area-inset-bottom))}
  .public-step-head h1{font-size:24px}.public-choice{padding:13px 11px}.public-slots{grid-template-columns:repeat(4,1fr)}.public-booking-summary{grid-template-columns:1fr}.public-booking-form .primary{min-height:48px}
}

.ylike-online .public-booking-card{max-width:820px}
.public-home{min-height:650px;padding:16px 0 40px}.public-home-logo{width:120px;height:72px;border-radius:50%;display:grid;place-items:center;font-family:Georgia,serif;font-style:italic;color:#b88948;background:#fff8ec;margin-bottom:8px}.public-home h1{font-size:34px;margin:0 0 6px}.public-address{color:var(--muted);margin:0 0 26px}
.public-promo{width:100%;display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;border:0;border-radius:999px;padding:18px 22px;background:#ecebea;text-align:left;margin-bottom:28px}.public-promo span{font-size:28px}.public-promo strong{font-size:16px}.public-promo b{font-size:26px;color:var(--muted)}
.public-menu-list{display:grid;gap:10px}.public-menu-list>button{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;border:0;background:#fff;padding:10px 0;text-align:left}.public-menu-icon{width:52px;height:52px;border-radius:50%;background:#f1f1f1;display:grid;place-items:center;font-size:24px}.public-menu-list strong{font-size:18px;font-weight:500}.public-menu-list small{display:block;color:var(--muted);margin-top:4px}.public-menu-list b{font-size:28px;color:var(--muted);font-weight:300}
.public-screen-title h1{font-size:30px;margin:4px 0 18px}.public-search-wrap{display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:11px 13px;margin-bottom:12px}.public-search-wrap span{font-size:24px;color:var(--muted)}.public-search-wrap input{border:0;outline:0;font-size:16px;width:100%}
.public-category-tabs{display:flex;gap:8px;overflow:auto;margin:0 -2px 16px;padding:0 2px 4px;scrollbar-width:none}.public-category-tabs button{border:0;background:#f0f0f0;border-radius:10px;padding:11px 14px;white-space:nowrap}.public-category-tabs button.active{background:#06130c;color:#fff}
.public-service-list{display:grid}.public-service-row{display:grid;grid-template-columns:1fr auto;gap:12px;padding:15px 0;border-bottom:1px solid #f0eeeb;align-items:start}.public-service-row>div{display:grid;gap:4px}.public-service-row strong{font-size:17px}.public-service-row small{color:var(--muted)}.public-service-row span{font-size:17px;margin-top:3px}.public-service-row input{width:23px;height:23px}
.public-sticky-summary{position:sticky;bottom:0;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);margin:14px -24px -24px;padding:12px 24px 18px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center}.public-sticky-summary>div{display:grid}.public-sticky-summary small{color:var(--muted)}.public-sticky-summary button,.public-primary-bottom{border:0;background:#06130c;color:#fff;border-radius:14px;padding:14px 18px;font-size:16px}
.public-selected-chip{background:#ededed;border-radius:999px;padding:13px 17px;margin-bottom:18px}
.public-master-list{display:grid;gap:22px}.public-master-card{padding:4px 0 18px;border-bottom:1px solid #eee}.public-master-main{width:100%;border:0;background:#fff;display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:start;text-align:left;padding:0}.public-master-main>div:nth-child(2){display:grid;gap:3px}.public-master-main strong{font-size:18px}.public-master-main small{color:var(--muted)}.public-master-main span{font-size:18px;margin-top:5px}.public-master-main b{font-size:26px;font-weight:300}
.public-nearest{margin-left:54px;margin-top:12px}.public-nearest>strong{font-size:13px;color:var(--muted)}.public-nearest>div{display:flex;gap:7px;overflow:auto;margin-top:8px;scrollbar-width:none}.public-nearest button{border:0;background:#f1f1f1;border-radius:10px;padding:10px 12px;white-space:nowrap}
.public-calendar-head{display:flex;justify-content:space-between;align-items:center;margin:8px 0 18px}.public-calendar-head strong{font-size:18px;text-transform:capitalize}.public-calendar-head button{border:0;background:#fff;font-size:25px;padding:5px 10px}.public-weekdays,.public-calendar{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}.public-weekdays{margin-bottom:6px}.public-weekdays span{text-align:center;color:var(--muted);font-size:12px}.public-calendar button{aspect-ratio:1;border:0;background:#fff;border-radius:10px;font-size:16px}.public-calendar button.other{color:#c8c8c8}.public-calendar button.disabled{color:#d2d2d2}.public-calendar button.active{background:#06130c;color:#fff}
.public-day-slots{margin-top:26px;display:grid;gap:20px}.public-day-slots section h2{font-size:19px;margin:0 0 10px}.public-day-slots section>div{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.public-day-slots button{border:0;background:#f0f0f0;border-radius:10px;padding:12px;font-size:16px}
.public-primary-bottom{width:100%;margin-top:22px}.public-primary-bottom:disabled{opacity:.45}
.public-booking-summary{grid-template-columns:repeat(2,1fr)}
@media(max-width:760px){
  .public-home{min-height:calc(100dvh - 120px)}.public-home h1{font-size:31px}.public-home-logo{width:105px;height:65px}
  .public-screen-title h1{font-size:28px}.public-sticky-summary{margin-left:-16px;margin-right:-16px;margin-bottom:calc(-18px - env(safe-area-inset-bottom));padding-left:16px;padding-right:16px;padding-bottom:calc(16px + env(safe-area-inset-bottom))}
  .public-sticky-summary{grid-template-columns:1fr}.public-sticky-summary button{width:100%}
  .public-day-slots section>div{grid-template-columns:repeat(3,1fr)}
  .public-booking-summary{grid-template-columns:1fr}
}

.service-edit-row{width:100%;border:0;background:#fff;text-align:left}
.service-resource-requirements{display:grid;gap:8px}
.service-resource-req{display:grid;grid-template-columns:auto 1fr 90px;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.service-resource-req:last-child{border-bottom:0}.service-resource-req>input[type="checkbox"]{width:20px;height:20px}.service-resource-req>input[type="number"]{width:90px}
.public-service-row.has-image{grid-template-columns:110px 1fr auto;align-items:center}.public-service-row>img{width:110px;height:78px;object-fit:cover;border-radius:12px}
@media(max-width:760px){
  .public-service-row.has-image{grid-template-columns:1fr auto}.public-service-row>img{grid-column:1/-1;width:100%;height:190px}
}

.public-brand-actions{display:flex;gap:10px;align-items:center}.public-account-btn{border:0;background:#f1efed;border-radius:999px;padding:8px 12px;font-size:12px}
.client-account-auth{max-width:520px;margin:0 auto}.client-auth-switch,.client-auth-guest{width:100%;border:0;background:transparent;padding:12px;color:#625b55}.client-auth-guest{color:var(--muted)}
.client-account-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:20px}.client-account-head h1{margin:4px 0}.client-account-head p{margin:0;color:var(--muted)}
.client-account-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:24px}.client-account-actions button{border:1px solid var(--line);background:#fff;border-radius:14px;padding:14px 10px;display:grid;gap:5px;text-align:center}.client-account-actions span{font-size:22px}
.client-account-section{margin-top:22px}.client-appointment-list{display:grid;gap:10px}.client-appointment-card{border:1px solid var(--line);border-radius:15px;padding:14px;background:#fff;display:grid;gap:11px}.client-appointment-date{display:flex;justify-content:space-between;gap:10px}.client-appointment-main{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.client-appointment-main>div{display:grid;gap:4px}.client-appointment-main small{color:var(--muted)}.client-appointment-actions{display:flex;gap:7px;flex-wrap:wrap}.client-review-saved{font-size:12px;color:#8b692f;background:#fff7df;padding:7px 9px;border-radius:8px}
.client-notify-list{display:grid;gap:0}.client-notify-row{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}.client-notify-row>div{display:grid;gap:3px}.client-notify-row small{color:var(--muted)}.client-notify-row input{width:22px;height:22px}.client-push-note{padding:14px;margin-top:12px;background:#faf7f4;border-radius:12px}.client-push-note p{margin:5px 0 0}.client-account-loading{text-align:center;padding:30px;color:var(--muted)}
@media(max-width:760px){.public-brand-actions .public-booking-staff{display:none}.client-account-head{align-items:center}.client-account-actions{grid-template-columns:repeat(3,1fr)}.client-account-actions strong{font-size:11px}.client-appointment-date,.client-appointment-main{align-items:flex-start}.client-appointment-main{display:grid}.client-appointment-actions .secondary,.client-appointment-actions .primary{flex:1}}

.complex-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:10px}
.complex-card{text-align:left;width:100%;border:1px solid var(--line);background:#fff}
.complex-card p{min-height:38px}
.complex-service-list{display:grid;gap:0}
.complex-service-list label{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;padding:11px 0;border-bottom:1px solid var(--line)}
.complex-service-list label:last-child{border-bottom:0}
.complex-service-list input{width:20px;height:20px}
.complex-service-list span{display:grid;gap:3px}.complex-service-list small{color:var(--muted)}
.public-complex-list{display:grid;gap:8px;margin-bottom:18px}
.public-complex-card{display:grid;gap:5px;text-align:left;border:1px solid #d9d2ca;background:#f7f3ee;border-radius:16px;padding:15px}
.public-complex-card strong{font-size:18px}.public-complex-card small{color:var(--muted)}.public-complex-card b{font-size:15px}
@media(max-width:760px){.complex-grid{grid-template-columns:1fr}}

.comp-scheme-editor{max-width:620px}
.comp-scheme-editor form{display:grid;gap:14px}
.comp-type-info,.comp-formula-preview{padding:14px;border-radius:12px;background:#f7f3ee;border:1px solid var(--line)}
.comp-type-info p{margin:6px 0 0}.comp-formula-preview{font-weight:600}

.booking-desktop-layout{display:block}
.booking-month-panel{display:none}
@media(min-width:761px){
  .booking-desktop-layout{display:grid;grid-template-columns:292px minmax(0,1fr);gap:14px;align-items:start}
  .booking-month-panel{display:block;position:sticky;top:10px}
  .booking-journal-main{min-width:0}
  .booking-month-panel>div{background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px}
  .booking-month-head{display:grid;grid-template-columns:34px 1fr 34px;gap:6px;align-items:center;margin-bottom:12px}
  .booking-month-head strong{text-align:center;font-size:15px;text-transform:capitalize}
  .booking-month-head button{border:0;background:transparent;border-radius:9px;font-size:23px;min-height:34px}
  .booking-month-head button:hover{background:#f4f0ec}
  .booking-month-weekdays,.booking-month-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
  .booking-month-weekdays{margin-bottom:5px}
  .booking-month-weekdays span{text-align:center;font-size:10px;color:var(--muted);font-weight:700}
  .booking-month-day{position:relative;min-height:52px;border:1px solid transparent;background:#faf8f6;border-radius:9px;padding:5px 3px 6px;display:grid;grid-template-rows:auto 4px auto;gap:3px;place-items:center}
  .booking-month-day span{font-size:13px;font-weight:700}
  .booking-month-day small{font-size:9px;color:var(--muted)}
  .booking-month-day i{display:block;width:86%;height:4px;border-radius:999px;background:#e5e1dc;overflow:hidden;position:relative}
  .booking-month-day i:after{content:"";position:absolute;left:0;top:0;bottom:0;width:var(--load);background:currentColor;border-radius:999px}
  .booking-month-day.light{color:#73917a}.booking-month-day.medium{color:#b39a5d}.booking-month-day.busy{color:#b87958}.booking-month-day.very-busy{color:#9c5b53}
  .booking-month-day.no-schedule{background:#f7f7f7;color:#b8b8b8}
  .booking-month-day.other{opacity:.35}
  .booking-month-day.active{border-color:#2d3032;background:#f1ece7;box-shadow:0 0 0 1px #2d3032 inset}
  .booking-month-day:hover{border-color:#c9c0b8}
  .booking-load-legend{display:grid;grid-template-columns:1fr 1fr;gap:7px 10px;margin-top:12px;padding-top:10px;border-top:1px solid var(--line)}
  .booking-load-legend span{display:flex;gap:6px;align-items:center;font-size:9px;color:var(--muted)}
  .booking-load-legend i{width:9px;height:9px;border-radius:50%;display:block}
  .booking-load-legend i.light{background:#73917a}.booking-load-legend i.medium{background:#b39a5d}.booking-load-legend i.busy{background:#b87958}.booking-load-legend i.very-busy{background:#9c5b53}
  .booking-calendar-loading{padding:30px 10px;text-align:center;color:var(--muted)}
}
@media(max-width:760px){
  .compact-journal .schedule-head{grid-template-columns:52px repeat(var(--staff-count,12),112px)}
}

.work-schedule-employee>div:last-child{display:grid;gap:2px;min-width:0}
.work-schedule-employee small{font-size:10px;color:var(--muted)}
.compact-journal .schedule-person>div:last-child{display:grid;gap:1px;min-width:0}
.compact-journal .schedule-person small{font-size:8px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.compact-journal .schedule-person.admin-staff{background:#f6f7f8}
.compact-journal .schedule-column.admin-column{background:#f6f7f8;cursor:default}
.compact-journal .schedule-column.admin-column:after{content:"Администратор";position:absolute;top:10px;left:8px;right:8px;text-align:center;font-size:9px;color:#9aa0a6;pointer-events:none}

.booking-calendar-card{width:min(520px,94vw)}
.booking-date-picker-host .booking-month-head{display:grid;grid-template-columns:38px 1fr 38px;gap:6px;align-items:center;margin-bottom:12px}
.booking-date-picker-host .booking-month-head strong{text-align:center;font-size:16px;text-transform:capitalize}
.booking-date-picker-host .booking-month-head button{border:0;background:transparent;border-radius:10px;min-height:38px;font-size:24px}
.booking-date-picker-host .booking-month-weekdays,.booking-date-picker-host .booking-month-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}
.booking-date-picker-host .booking-month-weekdays{margin-bottom:6px}
.booking-date-picker-host .booking-month-weekdays span{text-align:center;font-size:10px;color:var(--muted);font-weight:700}
.booking-date-picker-host .booking-month-day{position:relative;min-height:56px;border:1px solid transparent;background:#faf8f6;border-radius:10px;padding:5px 3px 6px;display:grid;grid-template-rows:auto 4px auto;gap:3px;place-items:center}
.booking-date-picker-host .booking-month-day span{font-size:14px;font-weight:700}
.booking-date-picker-host .booking-month-day small{font-size:9px;color:var(--muted)}
.booking-date-picker-host .booking-month-day i{display:block;width:86%;height:4px;border-radius:999px;background:#e5e1dc;overflow:hidden;position:relative}
.booking-date-picker-host .booking-month-day i:after{content:"";position:absolute;left:0;top:0;bottom:0;width:var(--load);background:currentColor;border-radius:999px}
.booking-date-picker-host .booking-month-day.light{color:#73917a}.booking-date-picker-host .booking-month-day.medium{color:#b39a5d}.booking-date-picker-host .booking-month-day.busy{color:#b87958}.booking-date-picker-host .booking-month-day.very-busy{color:#9c5b53}
.booking-date-picker-host .booking-month-day.no-schedule{background:#f7f7f7;color:#b8b8b8}
.booking-date-picker-host .booking-month-day.other{opacity:.35}
.booking-date-picker-host .booking-month-day.active{border-color:#2d3032;background:#f1ece7;box-shadow:0 0 0 1px #2d3032 inset}
@media(max-width:760px){
  .booking-calendar-modal{align-items:flex-end}
  .booking-calendar-card{width:100%;max-width:none;border-radius:22px 22px 0 0;padding-bottom:calc(18px + env(safe-area-inset-bottom))}
  .booking-date-picker-host .booking-month-day{min-height:52px}
}

.service-cover-editor{display:grid;grid-template-columns:minmax(180px,320px) 1fr;gap:14px;align-items:center}
.service-cover-preview{aspect-ratio:16/10;border:1px dashed var(--line);border-radius:14px;background:#faf8f6;display:grid;place-items:center;overflow:hidden}
.service-cover-preview>div{text-align:center;display:grid;gap:4px;padding:16px}
.service-cover-preview small{color:var(--muted)}
.service-cover-preview img{width:100%;height:100%;object-fit:cover;display:block}
.service-cover-preview.has-image{border-style:solid}
.service-cover-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.hidden{display:none!important}
@media(max-width:760px){.service-cover-editor{grid-template-columns:1fr}.service-cover-actions{justify-content:flex-start}}

.client-note-card{margin-top:12px;padding:12px 14px;border-radius:12px;background:#faf8f6;border:1px solid var(--line)}
.client-note-card p{margin:4px 0 0}
.client-history-section{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.client-appointment-list{display:grid;gap:8px}
.client-appointment-row{width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;text-align:left;padding:11px 12px;border:1px solid var(--line);border-radius:12px;background:#fff}
.client-appointment-row>div:first-child{display:grid;gap:3px;min-width:0}
.client-appointment-row>div:last-child{display:grid;justify-items:end;gap:4px}
.client-appointment-row small{color:var(--muted)}
.client-appointment-row:hover{background:#faf8f6}
.danger-text{color:#9c5b53!important}
@media(max-width:760px){.client-appointment-row{grid-template-columns:1fr}.client-appointment-row>div:last-child{display:flex;justify-content:space-between;align-items:center}}

.appointment-manage-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding-top:12px;border-top:1px solid var(--line)}
.danger-button{border:1px solid #d8b8b5;background:#fff;color:#8f514b;border-radius:10px;padding:10px 14px;font-weight:600}
.danger-button:hover{background:#fbf2f1}
@media(max-width:520px){.appointment-manage-actions{grid-template-columns:1fr}}

.schedule-month-template{font-size:10px;padding:0;margin-left:auto;white-space:nowrap}
.schedule-day-card{max-width:520px}.schedule-work-toggle{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:12px 0}.schedule-work-toggle button{border:1px solid var(--line);background:#fff;border-radius:10px;padding:11px;font-weight:600}.schedule-work-toggle button.active{background:#2d3032;color:#fff;border-color:#2d3032}.schedule-time-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.schedule-template-card{max-width:700px}.schedule-template-days{display:grid;gap:8px;margin:14px 0}.schedule-template-day{display:grid;grid-template-columns:minmax(180px,1fr) auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}.schedule-template-day>div:first-child{display:flex;gap:10px;align-items:center;justify-content:space-between}.schedule-inline-toggle{border:1px solid var(--line);border-radius:999px;padding:6px 10px;font-size:11px;font-weight:600}.schedule-inline-toggle.working{background:#eef5ef;color:#57745d}.schedule-inline-toggle.off{background:#f3f3f3;color:#777}.schedule-template-times{display:flex;gap:6px;align-items:center}.schedule-template-times input{min-width:105px}.schedule-template-warning{padding:10px 12px;border-radius:10px;background:#faf5ec;color:#7d6841;font-size:12px;margin-bottom:12px}
@media(max-width:760px){.schedule-month-template{margin-left:0}.schedule-time-fields{grid-template-columns:1fr}.schedule-template-day{grid-template-columns:1fr}.schedule-template-day>div:first-child{justify-content:space-between}.schedule-template-times{justify-content:flex-start}}

.comp-scheme-editor.advanced{max-width:820px}.comp-rule-section{padding:14px 0;border-top:1px solid var(--line)}.comp-rule-section h3{margin:2px 0}.comp-rule-row{display:grid;grid-template-columns:minmax(180px,1fr) 110px 120px auto;gap:8px;align-items:center;margin:8px 0}.comp-rule-row select,.comp-rule-row input,.comp-tier-row input{width:100%}.comp-tier-row{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;align-items:end;margin:8px 0}.comp-tier-row label{display:grid;gap:4px;font-size:12px}.comp-scheme-card .comp-extra-rules{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}.comp-scheme-card .comp-extra-rules span{font-size:11px;padding:4px 7px;border-radius:999px;background:#f4f1ed}
@media(max-width:760px){.comp-rule-row{grid-template-columns:1fr 90px 100px}.comp-rule-row .cs-remove-rule{grid-column:1/-1;justify-self:start}.comp-tier-row{grid-template-columns:1fr 1fr}.comp-tier-row .cs-remove-tier{grid-column:1/-1;justify-self:start}}

.comp-rule-results{display:grid;gap:6px;margin-top:10px}.comp-rule-result{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:8px 10px;border-radius:9px;background:#faf8f6}.comp-rule-result>div{display:grid;gap:2px}.comp-rule-result small{color:var(--muted)}

.comp-preview-section{margin:16px 0;padding:14px;border:1px solid var(--line);border-radius:14px;background:#fcfbf9}.comp-preview-controls{display:grid;grid-template-columns:minmax(180px,1.3fr) 150px 130px auto;gap:10px;align-items:end}.comp-preview-result{margin-top:12px}.comp-preview-hero{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}.comp-preview-hero>div{display:grid;gap:3px;padding:12px;border-radius:12px;background:#fff;border:1px solid var(--line)}.comp-preview-hero small,.comp-preview-hero span{color:var(--muted)}.comp-preview-hero strong{font-size:22px}.positive-text{color:#57745d!important}.comp-preview-tier{margin:8px 0;padding:8px 10px;border-radius:9px;background:#eef5ef;color:#57745d;font-size:12px;font-weight:600}
@media(max-width:760px){.comp-preview-controls{grid-template-columns:1fr 1fr}.comp-preview-controls .field:first-child{grid-column:1/-1}.comp-preview-controls button{grid-column:1/-1}.comp-preview-hero{grid-template-columns:1fr}}

.comp-scheme-card.archived{opacity:.72;background:#fafafa}.comp-scheme-meta{margin-top:8px}.comp-scheme-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:12px;padding-top:10px;border-top:1px solid var(--line)}

.complex-service-config{display:grid!important;grid-template-columns:auto minmax(0,1fr) 120px;gap:10px;align-items:center}.complex-surcharge{display:grid;gap:3px}.complex-surcharge input{width:100%}.multi-complex-card{max-width:760px}.multi-complex-segments{display:grid;gap:8px;margin:12px 0}.multi-complex-segment{display:grid;grid-template-columns:minmax(180px,1fr) minmax(220px,1fr);gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}.multi-complex-segment>div{display:grid;gap:3px}.multi-complex-segment small{color:var(--muted)}.multi-complex-total{display:flex;gap:12px;align-items:baseline;justify-content:flex-end;padding:12px 0}.multi-complex-total strong{font-size:22px}.multi-complex-total small{color:var(--muted)}
@media(max-width:760px){.complex-service-config,.multi-complex-segment{grid-template-columns:auto 1fr}.complex-surcharge{grid-column:2}.multi-complex-segment select{grid-column:1/-1}}

.appointment-edit-card{max-width:760px}.appointment-edit-section{display:grid;gap:8px;padding:12px 0;border-top:1px solid var(--line)}.selected-client-card{display:grid;gap:3px;padding:10px 12px;border-radius:10px;background:#faf8f6}.selected-client-card small{color:var(--muted)}.appointment-edit-service-list,.appointment-resource-list{display:grid;gap:6px}.appointment-edit-service-list label,.appointment-resource-list label{display:flex;gap:10px;align-items:center;padding:8px 10px;border:1px solid var(--line);border-radius:10px}.appointment-edit-service-list label span{display:grid;gap:2px}.appointment-edit-service-list small{color:var(--muted)}.appointment-edit-summary{display:flex;gap:12px;justify-content:flex-end;align-items:baseline;padding:10px 0}.appointment-edit-summary small{color:var(--muted)}

.visit-item>span{display:grid;gap:2px}.visit-item>div{display:flex;gap:10px;align-items:center}

.visit-payment-summary{display:grid!important;grid-template-columns:repeat(3,1fr);gap:8px}.visit-payment-summary>div{display:grid;gap:3px;padding:10px;border-radius:10px;background:#faf8f6}.visit-payment-history,.visit-refund-history{display:grid;gap:6px;margin-top:12px}.visit-payment-history h3,.visit-refund-history h3{margin:0}.visit-payment-row,.visit-refund-row{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:8px 0;border-top:1px solid var(--line)}.visit-payment-row>div,.visit-refund-row>div{display:grid;gap:2px}.visit-payment-row small,.visit-refund-row small{color:var(--muted)}
@media(max-width:520px){.visit-payment-summary{grid-template-columns:1fr}}

.resource-group-list{display:grid;gap:12px}.resource-group-card.archived{opacity:.72}.resource-instance-list{display:grid;gap:6px}.resource-instance-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;align-items:center;width:100%;text-align:left;padding:10px 0;border:0;border-top:1px solid var(--line);background:transparent}.resource-instance-row>div{display:grid;gap:2px}.resource-instance-row small{color:var(--muted)}

.client-finance-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0}.client-finance-summary>div{display:grid;gap:3px;padding:10px;border-radius:10px;background:#faf8f6}.client-finance-summary small{color:var(--muted)}
@media(max-width:520px){.client-finance-summary{grid-template-columns:1fr}}

.client-filter-tabs{display:flex;gap:6px;margin-top:10px}.client-filter-tabs button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:7px 11px}.client-filter-tabs button.active{background:#222;color:#fff;border-color:#222}.client-filter-summary{padding:8px 2px;color:var(--muted);font-size:13px}

.client-duplicate-list{display:grid;gap:12px}.client-duplicate-card{display:grid;gap:12px}.client-duplicate-reason{font-size:13px;color:var(--muted)}.client-duplicate-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.client-duplicate-side{display:grid;gap:4px;padding:10px;border-radius:10px;background:#faf8f6}.client-duplicate-side small,.client-duplicate-side span{color:var(--muted);font-size:12px}
@media(max-width:600px){.client-duplicate-grid{grid-template-columns:1fr}}

.finance-analytics-toolbar{display:flex;justify-content:flex-end;margin-bottom:12px}.finance-analytics-toolbar .field{min-width:180px}.finance-management-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.finance-management-meta{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:12px 0}.finance-management-meta>div{display:grid;gap:3px;padding:10px;border-radius:10px;background:#faf8f6}.finance-management-meta small{color:var(--muted)}.finance-management-breakdowns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.finance-ranking{display:grid;gap:8px}.finance-ranking>div{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:8px 0;border-top:1px solid var(--line)}.finance-ranking>div:first-child{border-top:0}.finance-ranking span{display:flex;gap:7px;align-items:center;min-width:0}.finance-ranking span b{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:999px;background:#f2efeb;font-size:11px}.finance-ranking small{color:var(--muted)}.finance-analytics-note{margin:8px 0;color:var(--muted);font-size:12px}
@media(max-width:900px){.finance-management-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.finance-management-meta{grid-template-columns:repeat(2,minmax(0,1fr))}.finance-management-breakdowns{grid-template-columns:1fr}}
@media(max-width:520px){.finance-management-kpis,.finance-management-meta{grid-template-columns:1fr}.finance-analytics-toolbar{justify-content:stretch}.finance-analytics-toolbar .field{width:100%}}

.finance-tx-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
@media(max-width:600px){.finance-tx-actions{justify-content:flex-start}}

.schedule-employee-actions{display:grid;gap:2px;margin-left:auto}.work-schedule-cell{display:grid;gap:2px}.work-schedule-cell small{font-size:10px;opacity:.72}.work-schedule-cell.absence.vacation{background:#f6f1e7}.work-schedule-cell.absence.sick{background:#f7ecec}.work-schedule-cell.absence.other{background:#f1eef6}.schedule-kind-toggle{display:flex;flex-wrap:wrap}.schedule-kind-toggle button{flex:1 1 110px}

.notification-head{align-items:flex-start}.notification-filters{margin:0 0 12px}.notification-summary{padding:6px 2px 10px;color:var(--muted);font-size:13px}.notification-feed{display:grid;gap:8px}.notification-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:10px;align-items:center;width:100%;text-align:left;border:1px solid var(--line);border-radius:12px;background:#fff;padding:12px}.notification-row.unread{background:#faf7f2;border-color:#dfd5c9}.notification-row>div{display:grid;gap:3px}.notification-row small,.notification-row time{color:var(--muted);font-size:12px}.notification-row em{font-style:normal;font-size:11px;font-weight:700;padding:4px 7px;border-radius:999px;background:#222;color:#fff}.notification-dot{width:9px;height:9px;border-radius:50%;background:#aaa}.notification-dot.medium{background:#b48642}.notification-dot.high{background:#a04b4b}.notification-dot.low{background:#8b9a88}
@media(max-width:600px){.notification-row{grid-template-columns:auto minmax(0,1fr) auto}.notification-row em{display:none}}
/* =========================================================
   UI POLISH SYSTEM · v1
   Global visual language for desktop + mobile
   ========================================================= */
:root{
  --bg:#f6f3ef;
  --bg-soft:#fbf9f6;
  --surface:#ffffff;
  --surface-soft:#faf7f3;
  --surface-tint:#f1ebe5;
  --ink:#211d1a;
  --ink-soft:#4f4842;
  --muted:#847a72;
  --line:#e7e0d9;
  --line-strong:#d8cec5;
  --accent:#846c59;
  --accent-hover:#6f5948;
  --accent-soft:#efe7df;
  --success-bg:#edf5ee;
  --success-ink:#3f6c49;
  --warning-bg:#fff5e7;
  --warning-ink:#8a5d1d;
  --danger-bg:#f9ecea;
  --danger-ink:#9b4741;
  --shadow-xs:0 1px 2px rgba(55,43,32,.04);
  --shadow-sm:0 8px 24px rgba(55,43,32,.055);
  --shadow-md:0 18px 46px rgba(55,43,32,.09);
  --radius-sm:10px;
  --radius-md:14px;
  --radius-lg:18px;
  --radius-xl:24px;
  --control-h:44px;
  --content-max:1440px;
}

/* Base */
html{background:var(--bg)}
body{
  background:
    radial-gradient(circle at 80% -20%,rgba(168,142,120,.08),transparent 34%),
    linear-gradient(180deg,#faf8f5 0%,var(--bg) 42%,#f3eee9 100%);
  color:var(--ink);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:14px;
  line-height:1.45;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
h1,h2,h3,p{margin-top:0}
h1{letter-spacing:-.035em}
h2{letter-spacing:-.02em}
.muted{color:var(--muted)}
.small{font-size:12px}

/* Shell / content width */
.shell{grid-template-columns:252px minmax(0,1fr)}
.main{
  width:100%;
  max-width:var(--content-max);
  margin:0 auto;
  padding:28px 34px 48px;
}
.sidebar{
  border-right:1px solid rgba(216,206,197,.78);
  background:rgba(242,237,232,.9);
  box-shadow:inset -1px 0 0 rgba(255,255,255,.55);
}
.nav button{
  min-height:44px;
  border-radius:12px;
  transition:background .16s ease,color .16s ease,transform .16s ease;
}
.nav button:hover{background:rgba(255,255,255,.64);color:var(--ink)}
.nav button.active{
  background:#fff;
  box-shadow:var(--shadow-xs),0 8px 22px rgba(72,56,42,.055);
}

/* Headings */
.section-head{
  align-items:flex-end;
  gap:18px;
  margin:0 0 20px;
}
.section-head h1{
  margin:4px 0 3px;
  font-size:clamp(26px,2.3vw,34px);
  line-height:1.08;
  font-weight:650;
}
.section-head p{margin:0;max-width:760px;line-height:1.55}
.eyebrow{
  letter-spacing:.14em;
  font-size:10px;
  color:#9a8e84;
}

/* Cards */
.card{
  background:rgba(255,255,255,.94);
  border:1px solid rgba(225,217,209,.96);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-sm);
}
.card-title{margin-bottom:14px}
.card-title h2{
  font-size:18px;
  line-height:1.2;
  font-weight:650;
}
.clickable,.mobile-list-row,.settings-row,.notification-row,.more-clean-list>button{
  transition:background .15s ease,border-color .15s ease,box-shadow .15s ease,transform .15s ease;
}
.clickable:hover,.mobile-list-row:hover,.settings-row:hover,.notification-row:hover,.more-clean-list>button:hover{
  background:#fdfbf9;
  border-color:var(--line-strong);
}

/* Form system */
.field{gap:7px;margin:14px 0}
.field,
.public-booking-form label{
  color:var(--ink-soft);
  font-size:13px;
  font-weight:600;
}
input,select,textarea,
.field input,.field select,.field textarea,
.public-booking-form input,.public-booking-form select,.public-booking-form textarea{
  width:100%;
  min-height:var(--control-h);
  border:1px solid var(--line-strong);
  border-radius:12px;
  background:#fff;
  color:var(--ink);
  padding:10px 12px;
  outline:none;
  box-shadow:0 1px 0 rgba(255,255,255,.7) inset;
  transition:border-color .15s ease,box-shadow .15s ease,background .15s ease;
}
textarea,
.field textarea,
.public-booking-form textarea{min-height:96px;line-height:1.5}
input::placeholder,textarea::placeholder{color:#aaa098}
input:hover,select:hover,textarea:hover{border-color:#cbbeb3}
input:focus,select:focus,textarea:focus{
  border-color:#9f8874;
  background:#fff;
  box-shadow:0 0 0 3px rgba(132,108,89,.11);
}
input:disabled,select:disabled,textarea:disabled,
input[readonly],textarea[readonly]{
  background:#f6f3ef;
  color:#70675f;
}
.field small,label small{font-weight:400;color:var(--muted);line-height:1.35}
.form-card{max-width:720px}
.generic-form-modal .modal-card{width:min(92vw,520px)}
.generic-form-modal .field{margin:12px 0}

/* Buttons */
button{font-weight:600}
.primary,.secondary,.compact{
  min-height:40px;
  border-radius:11px;
}
.primary{
  padding:11px 16px;
  border:1px solid transparent;
  background:var(--accent);
  box-shadow:0 6px 14px rgba(111,89,72,.13);
  transition:background .15s ease,transform .15s ease,box-shadow .15s ease;
}
.primary:hover{
  background:var(--accent-hover);
  box-shadow:0 8px 18px rgba(111,89,72,.18);
}
.primary:active,.secondary:active{transform:translateY(1px)}
.secondary{
  padding:10px 14px;
  border:1px solid var(--line-strong);
  background:#fff;
  color:var(--accent-hover)!important;
  box-shadow:var(--shadow-xs);
  transition:background .15s ease,border-color .15s ease,transform .15s ease;
}
.secondary:hover{background:var(--surface-soft);border-color:#cdbfb4}
.linklike{
  color:var(--accent-hover)!important;
  text-decoration:none;
  font-weight:650;
}
button:disabled{
  opacity:.48;
  cursor:not-allowed;
  box-shadow:none!important;
}

/* Statuses */
.status{
  padding:5px 9px;
  border-radius:999px;
  background:var(--surface-tint);
  color:#695c52;
  font-size:11px;
  line-height:1.2;
  font-weight:700;
  letter-spacing:.01em;
}
.status.ok{background:var(--success-bg);color:var(--success-ink)}
.status.warn{background:var(--warning-bg);color:var(--warning-ink)}
.status.off{background:var(--danger-bg);color:var(--danger-ink)}

/* Lists */
.mobile-list{display:grid;gap:8px}
.mobile-list-row,
.settings-row{
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
  min-height:64px;
  padding:12px 14px;
  box-shadow:var(--shadow-xs);
}
.mobile-list-row:last-child,.settings-row:last-child{border-bottom:1px solid var(--line)}
.list-avatar,.employee-avatar,.avatar-mini{
  background:linear-gradient(145deg,#f1e9e1,#e7ddd4);
  color:#675547;
}

/* Tables */
.payroll-table-wrap{
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  background:#fff;
  box-shadow:var(--shadow-xs);
}
.payroll-table th{
  background:#faf8f5;
  color:#71685f;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.055em;
  font-weight:750;
}
.payroll-table th,.payroll-table td{
  padding:12px 14px;
  border-bottom:1px solid #eee9e4;
}
.payroll-table tbody tr:hover{background:#fdfbf9}

/* Modals */
.modal-backdrop{
  background:rgba(32,26,22,.36);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
}
.modal-card{
  width:min(640px,100%);
  border:1px solid rgba(255,255,255,.72);
  border-radius:22px;
  padding:22px;
  background:#fff;
  box-shadow:0 24px 70px rgba(37,29,23,.2);
}
.guide-close{
  background:#f5f1ed;
  color:#6d6259;
  transition:background .15s ease,transform .15s ease;
}
.guide-close:hover{background:#ebe4dd;transform:rotate(2deg)}

/* Empty / warning / informational blocks */
.empty-state{
  border:1px dashed #ddd3ca;
  background:rgba(255,255,255,.7);
}
.payroll-warning,.schedule-template-warning,.finance-rule-note{
  border-radius:12px;
}

/* Desktop density */
@media(min-width:761px){
  .main>.card,
  .main>section.card{margin-bottom:14px}
  .section-head .actions-inline{width:auto}
  .section-head .actions-inline button{width:auto}
  .context-card{grid-template-columns:repeat(4,minmax(0,1fr))}
  .modal-card .field input,
  .modal-card .field select{min-height:42px}
}

/* Mobile polish */
@media(max-width:760px){
  body{font-size:14px}
  .shell{padding-bottom:92px}
  .main{padding:14px 12px 28px}
  .top.compact-mobile-top{
    position:sticky;
    top:0;
    z-index:30;
    margin:0 -12px 12px;
    padding:10px 12px 12px;
    background:rgba(250,248,245,.92);
    border-bottom:1px solid rgba(225,217,209,.8);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
  }
  .section-head{
    gap:10px;
    margin-bottom:14px;
  }
  .section-head h1{font-size:26px}
  .section-head p{font-size:13px}
  .card{border-radius:16px;box-shadow:0 7px 20px rgba(55,43,32,.045)}
  .compact-card,.dash-card,.quick-actions,.employee-card,.invite-panel{padding:14px}
  .field{margin:11px 0}
  input,select,textarea,
  .field input,.field select,.field textarea{
    font-size:16px; /* prevents iOS zoom */
    min-height:46px;
    border-radius:12px;
  }
  .primary,.secondary{min-height:44px}
  .actions-inline{gap:8px}
  .actions-inline button{min-height:42px}
  .modal-backdrop{align-items:flex-end;padding:0}
  .modal-card{
    max-height:91dvh;
    border-radius:22px 22px 0 0;
    padding:18px 16px calc(18px + env(safe-area-inset-bottom));
    box-shadow:0 -18px 55px rgba(37,29,23,.18);
  }
  .bottom-nav{
    border-top:1px solid rgba(221,213,205,.9);
    background:rgba(255,255,255,.96);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    box-shadow:0 -10px 30px rgba(55,43,32,.08);
    padding:7px 5px calc(8px + env(safe-area-inset-bottom));
  }
  .bottom-nav button{
    min-height:48px;
    border-radius:11px;
    color:#746960;
  }
  .bottom-nav button.active{
    background:#f5f0eb;
    color:#3b332d;
  }
  .mobile-list-row,.settings-row{
    min-height:62px;
    padding:12px;
    border-radius:13px;
  }
  .payroll-table-wrap{
    margin-left:-2px;
    margin-right:-2px;
    border-radius:14px;
  }
}

/* Narrow mobile */
@media(max-width:390px){
  .main{padding-left:10px;padding-right:10px}
  .top.compact-mobile-top{margin-left:-10px;margin-right:-10px;padding-left:10px;padding-right:10px}
  .section-head h1{font-size:24px}
  .summary-grid,.dash-metrics,.kpi-card-grid,.owner-shift-stats{gap:7px}
}

/* =========================================================
   JOURNAL POLISH · v1
   ========================================================= */
.booking-workspace-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:12px;
}
.booking-date-title{
  display:flex;
  align-items:center;
  gap:10px;
  border:1px solid var(--line);
  background:#fff;
  border-radius:14px;
  min-height:48px;
  padding:8px 13px;
  box-shadow:var(--shadow-xs);
}
.booking-date-title span{display:grid;text-align:left;gap:1px}
.booking-date-title strong{
  font-size:16px;
  line-height:1.1;
  letter-spacing:-.015em;
}
.booking-date-title small{font-size:11px;color:var(--muted);font-weight:600}
.booking-date-title b{font-size:14px;color:#8f8176}
.booking-date-title:hover{border-color:var(--line-strong);background:#fdfbf9}
.booking-head-actions{display:flex;align-items:center;gap:8px}
.booking-add{
  width:44px!important;
  min-width:44px;
  height:44px;
  min-height:44px;
  padding:0!important;
  border-radius:13px;
  font-size:22px;
  line-height:1;
}

.schedule-shell.compact-journal{
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  box-shadow:var(--shadow-sm);
  overflow:auto;
  scrollbar-color:#cfc4bb transparent;
  scrollbar-width:thin;
}
.compact-journal .schedule-head{
  position:sticky;
  top:0;
  z-index:10;
  background:rgba(252,250,248,.97);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.compact-journal .schedule-corner{
  background:#faf8f5;
  border-right:1px solid var(--line);
}
.compact-journal .schedule-person{
  min-height:54px;
  border-left:1px solid #eee9e4;
  background:#fcfaf8;
  align-items:center;
}
.compact-journal .schedule-person .employee-avatar{
  box-shadow:0 0 0 2px #fff;
}
.compact-journal .schedule-person strong{
  color:var(--ink);
  font-weight:700;
  letter-spacing:-.01em;
}
.compact-journal .schedule-person small{
  color:#8d8279;
  font-weight:500;
}
.compact-journal .schedule-times{
  position:sticky;
  left:0;
  z-index:8;
  background:#faf8f5;
  border-right:1px solid var(--line);
}
.compact-journal .schedule-times span{
  color:#9a8f86;
  font-weight:600;
  letter-spacing:.01em;
}
.compact-journal .schedule-column{
  background:#fff;
  border-left:1px solid #f0ece8;
}
.compact-journal .schedule-column:hover{
  background:linear-gradient(180deg,rgba(250,247,243,.5),rgba(255,255,255,.45));
}
.compact-journal .schedule-column>i.hour-line{border-top:1px solid #e9e4df}
.compact-journal .schedule-column>i.half-line{border-top:1px dashed #f1ede9}

.compact-journal .schedule-appt{
  border:1px solid #ded3ca;
  background:linear-gradient(145deg,#fbf5ef,#f4ebe3);
  color:#3d332c;
  box-shadow:0 4px 10px rgba(77,59,44,.08);
  border-radius:9px;
  padding:5px 7px;
  overflow:hidden;
  transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease;
}
.compact-journal .schedule-appt:hover{
  z-index:5;
  transform:translateY(-1px);
  border-color:#cdbcae;
  box-shadow:0 8px 16px rgba(77,59,44,.13);
}
.compact-journal .schedule-appt.done{
  background:linear-gradient(145deg,#f1f6f1,#e8f0e8);
  border-color:#d2dfd2;
  color:#3f5c44;
}
.compact-journal .schedule-appt-top strong{
  font-weight:750;
  letter-spacing:-.012em;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.compact-journal .schedule-appt-top small{
  color:#786d64;
  font-weight:700;
}
.compact-journal .schedule-appt>span{
  display:block;
  margin-top:2px;
  color:#75685e;
  line-height:1.18;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.compact-journal .schedule-appt.done>span{color:#58705d}
.compact-journal .schedule-price{
  color:#7c6a5c;
  font-weight:700;
}

.cancelled-bookings{
  margin-top:12px;
  box-shadow:none;
  background:rgba(255,255,255,.68);
}
.cancelled-bookings summary{
  cursor:pointer;
  color:var(--muted);
  font-weight:650;
}
.cancelled-row{
  border:0;
  background:transparent;
  color:#8a7f76;
  padding:8px 0;
  text-align:left;
}

/* desktop journal proportions */
@media(min-width:761px){
  .booking-desktop-layout{
    display:grid;
    grid-template-columns:254px minmax(0,1fr);
    gap:16px;
    align-items:start;
  }
  .booking-month-panel{
    position:sticky;
    top:18px;
  }
  .compact-journal{
    max-height:calc(100vh - 188px)!important;
  }
  .compact-journal .schedule-head{
    grid-template-columns:62px repeat(var(--staff-count,12),176px)!important;
  }
  .compact-journal .schedule-corner{
    width:62px!important;
    min-width:62px!important;
  }
  .compact-journal .schedule-times{
    width:62px!important;
    flex-basis:62px!important;
  }
  .compact-journal .schedule-person{
    width:176px!important;
    padding:8px 9px!important;
    gap:7px!important;
  }
  .compact-journal .schedule-person .employee-avatar{
    width:30px!important;
    height:30px!important;
    font-size:13px!important;
  }
  .compact-journal .schedule-person strong{font-size:12px!important}
  .compact-journal .schedule-person small{font-size:9px!important}
  .compact-journal .schedule-column{
    width:176px!important;
    flex-basis:176px!important;
  }
  .compact-journal .schedule-appt{
    left:4px!important;
    right:4px!important;
    width:calc(100% - 8px)!important;
    padding:5px 7px!important;
  }
  .compact-journal .schedule-appt-top strong{font-size:11px!important}
  .compact-journal .schedule-appt-top small{font-size:9px!important}
  .compact-journal .schedule-appt>span{font-size:10px!important}
  .compact-journal .schedule-price{font-size:9px!important}
}

/* mobile journal */
@media(max-width:760px){
  .booking-workspace-head{
    position:sticky;
    top:73px;
    z-index:20;
    margin:0 -12px 10px;
    padding:8px 12px;
    background:rgba(246,243,239,.94);
    border-bottom:1px solid rgba(225,217,209,.78);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
  }
  .booking-date-title{
    min-height:44px;
    padding:7px 10px;
    border-radius:12px;
  }
  .booking-date-title strong{font-size:15px}
  .booking-date-title small{font-size:10px}
  .booking-head-actions{gap:6px}
  .booking-today{display:none}
  #newComplexAppointment{padding-left:10px;padding-right:10px;font-size:11px}
  .booking-add{
    width:42px!important;
    min-width:42px;
    height:42px;
    min-height:42px;
  }

  .schedule-shell.compact-journal{
    margin:0 -4px;
    border-radius:14px;
    max-height:calc(100dvh - 210px)!important;
  }
  .compact-journal .schedule-head{
    grid-template-columns:54px repeat(var(--staff-count,12),126px)!important;
  }
  .compact-journal .schedule-corner{
    width:54px!important;
    min-width:54px!important;
  }
  .compact-journal .schedule-times{
    width:54px!important;
    flex-basis:54px!important;
  }
  .compact-journal .schedule-person{
    width:126px!important;
    min-height:50px;
    padding:6px!important;
  }
  .compact-journal .schedule-person .employee-avatar{
    width:28px!important;
    height:28px!important;
    font-size:12px!important;
  }
  .compact-journal .schedule-person strong{font-size:11px!important}
  .compact-journal .schedule-person small{font-size:8px!important}
  .compact-journal .schedule-column{
    width:126px!important;
    flex-basis:126px!important;
  }
  .compact-journal .schedule-appt{
    left:3px!important;
    right:3px!important;
    width:calc(100% - 6px)!important;
    padding:4px 5px!important;
    border-radius:8px;
  }
  .compact-journal .schedule-appt-top strong{font-size:10px!important}
  .compact-journal .schedule-appt-top small{font-size:8px!important}
  .compact-journal .schedule-appt>span{font-size:9px!important}
  .compact-journal .schedule-price{font-size:8px!important}
  .booking-date-dock{
    margin-top:10px;
    border-radius:14px;
    background:#fff;
    border:1px solid var(--line);
    padding:6px;
    box-shadow:var(--shadow-xs);
  }
}

/* =========================================================
   CLIENTS POLISH · v1
   ========================================================= */
.client-search-card{
  max-width:860px;
  padding:14px;
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(255,255,255,.86);
  box-shadow:var(--shadow-xs);
}
.client-search-line{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
  align-items:center;
}
.client-search-line input{
  margin:0;
  min-height:44px;
}
.client-filter-tabs{
  display:flex;
  gap:6px;
  margin-top:10px;
  flex-wrap:wrap;
}
.client-filter-tabs button{
  min-height:34px;
  padding:6px 11px;
  border:1px solid var(--line);
  border-radius:999px;
  background:#fff;
  color:#71665e;
  font-size:12px;
  transition:all .15s ease;
}
.client-filter-tabs button:hover{border-color:#cdbfb4;background:#fbf8f5}
.client-filter-tabs button.active{
  background:#342d28;
  color:#fff;
  border-color:#342d28;
  box-shadow:0 4px 10px rgba(52,45,40,.13);
}
.client-filter-summary{
  padding:2px 2px 10px;
  color:var(--muted);
  font-size:12px;
}

/* client quick card */
.client-card-modal{align-items:center}
.client-quick-card{
  width:min(780px,94vw);
  max-height:90vh;
  padding:24px;
}
.client-quick-card .guide-head{
  align-items:flex-start;
  padding-bottom:16px;
  border-bottom:1px solid var(--line);
}
.client-quick-card .guide-head h2{
  font-size:27px;
  line-height:1.1;
  letter-spacing:-.03em;
}
.client-quick-card .guide-head p{
  margin:6px 0 0;
  font-size:13px;
  line-height:1.45;
}
.client-quick-card .guide-head .actions-inline{
  width:auto;
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
}
.client-tags{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:14px;
}
.crm-tag{
  display:inline-flex;
  align-items:center;
  min-height:27px;
  padding:4px 9px;
  border-radius:999px;
  background:var(--tag-color,#eee8e3);
  border:1px solid rgba(80,65,52,.06);
  font-size:11px;
  font-weight:700;
  color:#62574f;
}
.compact-tag-edit{
  margin:7px 0 0;
  font-size:12px;
}

.client-context-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
  margin:16px 0 10px;
}
.client-context-grid>div{
  position:relative;
  display:grid;
  gap:5px;
  min-height:76px;
  padding:12px;
  border:1px solid #eee7e0;
  border-radius:13px;
  background:#fbf9f6;
}
.client-context-grid small{
  color:var(--muted);
  font-size:11px;
}
.client-context-grid strong{
  align-self:end;
  font-size:14px;
  line-height:1.25;
  overflow-wrap:anywhere;
}

.client-finance-summary{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin:10px 0;
}
.client-finance-summary>div{
  display:grid;
  gap:4px;
  min-height:72px;
  padding:12px 13px;
  border:1px solid #e8e0d8;
  border-radius:13px;
  background:#fff;
}
.client-finance-summary>div:last-child{
  background:linear-gradient(145deg,#f3eee8,#faf7f4);
  border-color:#ded2c7;
}
.client-finance-summary small{
  color:var(--muted);
  font-size:11px;
}
.client-finance-summary strong{
  align-self:end;
  font-size:18px;
  letter-spacing:-.025em;
}

.client-note-card{
  margin:10px 0 0;
  padding:13px 14px;
  border:1px solid var(--line);
  border-radius:13px;
  background:#faf8f5;
}
.client-note-card p{
  margin:5px 0 0;
  line-height:1.5;
  color:#4f4740;
}

.client-history-section{
  margin-top:20px;
  padding-top:18px;
  border-top:1px solid var(--line);
}
.client-history-section .card-title{
  align-items:center;
  margin-bottom:10px;
}
.client-history-section h3{
  margin:2px 0 0;
  font-size:17px;
  letter-spacing:-.015em;
}
.client-appointment-list{
  display:grid;
  gap:7px;
}
.client-appointment-row{
  min-height:70px;
  padding:11px 13px;
  border:1px solid var(--line);
  border-radius:13px;
  background:#fff;
  box-shadow:var(--shadow-xs);
  transition:background .15s ease,border-color .15s ease,transform .15s ease;
}
.client-appointment-row:hover{
  background:#fdfbf9;
  border-color:#d6cbc2;
  transform:translateY(-1px);
}
.client-appointment-row>div:first-child strong{
  font-size:14px;
  color:var(--ink);
}
.client-appointment-row>div:first-child small{
  font-size:11px;
  line-height:1.35;
}
.client-appointment-row>div:last-child>strong{
  font-size:14px;
  letter-spacing:-.02em;
}

/* duplicate cards */
.client-duplicate-card{
  padding:16px;
  border:1px solid var(--line);
  box-shadow:var(--shadow-xs);
}
.client-duplicate-side{
  padding:12px;
  border:1px solid #eee7e0;
  border-radius:13px;
  background:#fbf9f6;
}
.client-duplicate-side strong{font-size:14px}

/* desktop client list */
@media(min-width:761px){
  #clientsList{max-width:980px}
  #clientsList .mobile-list{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
  }
  #clientsList .mobile-list-row{
    min-height:72px;
  }
}

/* mobile client UX */
@media(max-width:760px){
  .client-search-card{
    max-width:none;
    margin:0 0 10px;
    padding:10px;
    border-radius:14px;
  }
  .client-search-line{
    grid-template-columns:minmax(0,1fr) auto;
    gap:6px;
  }
  .client-search-line .secondary{
    width:auto!important;
    min-width:70px;
    padding-left:10px;
    padding-right:10px;
  }
  .client-filter-tabs{
    overflow-x:auto;
    flex-wrap:nowrap;
    padding-bottom:1px;
    scrollbar-width:none;
  }
  .client-filter-tabs::-webkit-scrollbar{display:none}
  .client-filter-tabs button{white-space:nowrap}

  .client-card-modal{
    align-items:flex-end;
    padding:0;
  }
  .client-quick-card{
    width:100%;
    max-width:none;
    max-height:93dvh;
    padding:18px 14px calc(20px + env(safe-area-inset-bottom));
    border-radius:22px 22px 0 0;
  }
  .client-quick-card .guide-head{
    gap:8px;
    padding-bottom:13px;
  }
  .client-quick-card .guide-head h2{font-size:23px}
  .client-quick-card .guide-head p{
    max-width:245px;
    font-size:12px;
    overflow-wrap:anywhere;
  }
  .client-quick-card .guide-head .actions-inline{
    display:flex!important;
    width:auto!important;
    gap:6px;
  }
  .client-quick-card .guide-head .actions-inline button{
    width:auto!important;
    min-height:38px;
  }
  .client-quick-card #editClientData{
    padding-left:10px;
    padding-right:10px;
    font-size:11px;
  }
  .client-context-grid{
    grid-template-columns:1fr 1fr!important;
    gap:7px;
    margin-top:13px;
  }
  .client-context-grid>div{
    min-height:68px;
    padding:10px;
  }
  .client-context-grid strong{font-size:13px}
  .client-finance-summary{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:6px;
  }
  .client-finance-summary>div{
    min-width:0;
    min-height:68px;
    padding:9px;
  }
  .client-finance-summary small{
    font-size:9px;
    line-height:1.15;
  }
  .client-finance-summary strong{
    font-size:14px;
    overflow-wrap:anywhere;
  }
  .client-note-card{padding:11px 12px}
  .client-history-section{margin-top:16px;padding-top:15px}
  .client-appointment-row{
    grid-template-columns:1fr!important;
    min-height:0;
    padding:11px;
  }
  .client-appointment-row>div:last-child{
    display:flex!important;
    justify-content:space-between;
    align-items:center;
    width:100%;
  }
}

@media(max-width:390px){
  .client-quick-card .guide-head p{max-width:205px}
  .client-finance-summary strong{font-size:13px}
}

/* =========================================================
   FINANCE + EMPLOYEES POLISH · v1
   ========================================================= */

/* Finance */
.finance-analytics-toolbar{
  display:flex;
  justify-content:flex-end;
  margin-bottom:12px;
}
.finance-analytics-toolbar .field{
  margin:0;
  min-width:190px;
}
.finance-management-kpis{
  gap:10px;
}
.finance-management-kpis .finance-kpi{
  min-height:116px;
  padding:16px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  box-shadow:var(--shadow-xs);
}
.finance-management-kpis .finance-kpi small{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-weight:750;
}
.finance-management-kpis .finance-kpi strong{
  margin-top:6px;
  font-size:25px;
  line-height:1.05;
  letter-spacing:-.035em;
}
.finance-management-kpis .finance-kpi span{
  margin-top:auto;
  font-size:11px;
}
.finance-management-kpis .finance-kpi:last-child{
  background:linear-gradient(145deg,#f2ece6,#faf7f3);
  border-color:#ddd1c6;
}
.finance-management-meta{
  gap:8px;
  margin:12px 0 14px;
}
.finance-management-meta>div{
  min-height:68px;
  padding:11px 12px;
  border:1px solid #eee7e0;
  border-radius:13px;
  background:#fbf9f6;
}
.finance-management-meta strong{
  margin-top:3px;
  font-size:15px;
}
.finance-management-breakdowns{
  gap:12px;
}
.finance-management-breakdowns>.card{
  padding:16px;
  box-shadow:var(--shadow-xs);
}
.finance-ranking{gap:0}
.finance-ranking>div{
  padding:10px 0;
  border-top:1px solid #eee8e2;
}
.finance-ranking span{
  min-width:0;
}
.finance-ranking span b{
  flex:0 0 22px;
  width:22px;
  height:22px;
  background:#f2ece6;
  color:#66584c;
  font-size:10px;
}
.finance-ranking span small{
  display:block;
  margin-left:3px;
  font-size:10px;
}
.finance-ranking>div>strong{
  white-space:nowrap;
  font-size:13px;
}
.finance-tx-row{
  padding:12px 2px;
}
.finance-tx-row>div:first-child strong{
  font-size:13px;
}
.finance-tx-row small{
  font-size:11px;
}
.finance-category-grid>.card{
  padding:16px;
  box-shadow:var(--shadow-xs);
}
.finance-category-grid .settings-row{
  border-left:0;
  border-right:0;
  border-radius:0;
  box-shadow:none;
}

/* Employees */
.employee-card-grid{
  gap:12px;
}
.employee-card{
  position:relative;
  min-height:190px;
  padding:17px;
  border:1px solid var(--line);
  border-radius:17px;
  background:#fff;
  box-shadow:var(--shadow-xs);
  transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;
}
.employee-card:hover{
  transform:translateY(-2px);
  border-color:#d7ccc2;
  box-shadow:var(--shadow-sm);
}
.employee-card-head{
  gap:12px;
  align-items:center;
}
.employee-card .employee-avatar{
  width:46px;
  height:46px;
  font-size:19px;
  box-shadow:0 0 0 3px #faf7f4;
}
.employee-main{
  gap:2px;
  min-width:0;
}
.employee-main strong{
  font-size:15px;
  line-height:1.2;
  letter-spacing:-.015em;
}
.employee-main small{
  color:var(--muted);
  font-size:11px;
}
.employee-email{
  margin:16px 0 12px;
  padding:9px 10px;
  border-radius:10px;
  background:#faf8f5;
  color:#766b62;
  font-size:11px;
  line-height:1.35;
}
.employee-card-foot{
  margin-top:auto;
  padding-top:11px;
  border-top:1px solid #eee8e2;
}
.employee-card-foot .secondary{
  min-height:36px;
  padding:8px 11px;
  font-size:11px;
}
.invite-panel{
  border:1px solid var(--line);
  border-radius:17px;
  background:linear-gradient(145deg,#fbf8f5,#f4eee8);
  box-shadow:none;
}
.employee-profile-hero{
  padding:20px;
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  box-shadow:var(--shadow-sm);
}
.employee-profile-left{
  gap:15px;
}
.employee-avatar.large{
  width:64px;
  height:64px;
  font-size:27px;
  box-shadow:0 0 0 4px #f7f2ed;
}
.employee-profile-left h1{
  font-size:29px;
  line-height:1.08;
  letter-spacing:-.035em;
}
.employee-profile-grid{
  gap:12px;
}
.employee-profile-grid>article{
  padding:17px;
  border:1px solid var(--line);
  border-radius:17px;
  background:#fff;
  box-shadow:var(--shadow-xs);
}
.employee-profile-grid .card-title{
  margin-bottom:12px;
}
.employee-pay-values{
  gap:10px;
}
.employee-pay-values span{
  min-width:90px;
  padding:8px 10px;
  border-radius:10px;
  background:#faf8f5;
  text-align:left;
}
.employee-shift-row{
  padding:11px 0;
  border-bottom:1px solid #eee8e2;
}
.employee-shift-metrics span{
  padding:7px 8px;
  border-radius:9px;
  background:#faf8f5;
}
.employee-shift-metrics strong{
  font-size:13px;
}

@media(min-width:1180px){
  .employee-card-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
}

@media(max-width:900px){
  .finance-management-breakdowns{
    grid-template-columns:1fr;
  }
}

@media(max-width:760px){
  .finance-analytics-toolbar{
    justify-content:stretch;
  }
  .finance-analytics-toolbar .field{
    width:100%;
    min-width:0;
  }
  .finance-management-kpis{
    grid-template-columns:1fr 1fr!important;
    gap:7px;
  }
  .finance-management-kpis .finance-kpi{
    min-height:104px;
    padding:12px;
  }
  .finance-management-kpis .finance-kpi strong{
    font-size:20px;
  }
  .finance-management-kpis .finance-kpi small{
    font-size:9px;
    line-height:1.2;
  }
  .finance-management-kpis .finance-kpi span{
    font-size:9px;
    line-height:1.2;
  }
  .finance-management-meta{
    grid-template-columns:1fr 1fr!important;
    gap:7px;
  }
  .finance-management-meta>div{
    min-height:62px;
    padding:9px 10px;
  }
  .finance-management-meta small{font-size:9px}
  .finance-management-meta strong{font-size:13px}
  .finance-management-breakdowns>.card{padding:14px}
  .finance-ranking>div{
    align-items:flex-start;
    gap:8px;
  }
  .finance-ranking span{
    align-items:flex-start;
    flex-wrap:wrap;
  }

  .employee-card{
    min-height:0;
    padding:14px!important;
  }
  .employee-card:hover{transform:none}
  .employee-card .employee-avatar{
    width:42px;
    height:42px;
  }
  .employee-email{
    margin:12px 0 10px;
    padding:8px 9px;
  }
  .employee-profile-hero{
    padding:15px;
    align-items:flex-start;
  }
  .employee-avatar.large{
    width:54px;
    height:54px;
    font-size:23px;
  }
  .employee-profile-left h1{
    font-size:23px;
  }
  .employee-profile-grid>article{
    padding:14px;
    border-radius:15px;
  }
  .employee-pay-values{
    text-align:left;
    display:grid;
    grid-template-columns:1fr 1fr;
    width:100%;
  }
  .employee-pay-values span{
    min-width:0;
  }
  .employee-shift-metrics{
    gap:6px;
  }
  .employee-shift-metrics span{
    padding:6px;
  }
}

/* =========================================================
   PAYROLL + SCHEDULE POLISH · v1
   ========================================================= */

/* Payroll */
.payroll-toolbar{
  padding:14px 16px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  box-shadow:var(--shadow-xs);
}
.payroll-toolbar .field{
  margin:0;
}
.period-switch{
  display:flex;
  gap:6px;
}
.period-switch button{
  min-height:38px;
  border-radius:10px;
  font-size:11px;
}
.payroll-compact-list{
  border:1px solid var(--line);
  border-radius:17px;
  background:#fff;
  box-shadow:var(--shadow-xs);
}
.payroll-compact-row{
  min-height:66px;
  padding:12px 14px;
  border-bottom:1px solid #eee8e2;
  transition:background .15s ease;
}
.payroll-compact-row:hover{background:#fdfbf9}
.payroll-row-main strong{
  font-size:14px;
  letter-spacing:-.012em;
}
.payroll-compact-row small{
  color:var(--muted);
  font-size:10px;
}
.payroll-compact-row>span strong{
  font-size:13px;
}
.payroll-due strong{
  color:#665345;
}
.payroll-person-card{
  padding:16px;
  border:1px solid var(--line);
  border-radius:17px;
  background:#fff;
  box-shadow:var(--shadow-xs);
}
.payroll-person-head strong{
  font-size:15px;
}
.payroll-person-grid{
  gap:7px;
}
.payroll-person-grid span,
.payroll-person-total span{
  padding:8px 9px;
  border-radius:10px;
  background:#faf8f5;
}
.payroll-person-total{
  gap:7px;
  border-top:0;
  padding-top:0;
}
.payroll-person-total .due{
  background:linear-gradient(145deg,#eee4da,#f5eee8);
}
.payroll-inline-warning{
  border:1px solid #efdbbc;
  border-radius:10px;
}
#payrollDetail>.section-head{
  background:#fff;
  border:1px solid var(--line);
  border-radius:17px;
  padding:14px 16px;
  box-shadow:var(--shadow-xs);
}
.compact-card.payroll-final-card{
  border:1px solid #d9cec3;
  box-shadow:var(--shadow-sm);
}
.payroll-final-total{
  padding:14px;
  border-radius:13px;
  background:linear-gradient(145deg,#eee4da,#f8f4f0);
}
.payroll-final-total strong{
  font-size:21px;
  letter-spacing:-.03em;
}
.payroll-line,.auto-row{
  padding:10px 0;
  border-bottom:1px solid #eee8e2;
}
.payroll-auto-details summary{
  color:#5f5248;
}

/* Schedule */
.work-schedule-shell{
  border:1px solid var(--line);
  border-radius:17px;
  background:#fff;
  box-shadow:var(--shadow-xs);
  scrollbar-color:#cfc4bb transparent;
  scrollbar-width:thin;
}
.work-schedule-head{
  background:#faf8f5;
  border-bottom:1px solid var(--line);
}
.work-schedule-head>div{
  padding:11px 9px;
  color:#81766e;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.work-schedule-name{
  background:#faf8f5!important;
  border-right:1px solid var(--line);
}
.work-schedule-row{
  border-bottom:1px solid #eee8e2;
}
.work-schedule-employee{
  min-height:68px;
  padding:10px 11px;
  border-right:1px solid #eee8e2;
  background:#fff;
}
.work-schedule-employee .employee-avatar{
  width:36px;
  height:36px;
  font-size:15px;
}
.work-schedule-employee strong{
  font-size:12px;
  line-height:1.2;
}
.work-schedule-employee small{
  font-size:9px;
  color:var(--muted);
}
.schedule-employee-actions{
  margin-left:auto;
  gap:1px;
}
.schedule-employee-actions .linklike{
  margin:0;
  font-size:10px;
}
.work-schedule-cell{
  position:relative;
  min-height:68px;
  padding:9px 6px;
  border-right:1px solid #eee8e2;
  background:#fff;
  color:#756a61;
  font-size:11px;
  transition:background .12s ease,box-shadow .12s ease;
}
.work-schedule-cell:hover{
  background:#faf8f5;
  box-shadow:inset 0 0 0 1px #dcd2ca;
}
.work-schedule-cell.working{
  background:#f1f5f2;
  color:#49604e;
  font-weight:700;
}
.work-schedule-cell.absence{
  font-weight:650;
}
.work-schedule-cell.absence.vacation{
  background:#f7f1e6;
  color:#86662d;
}
.work-schedule-cell.absence.sick{
  background:#f8ecea;
  color:#8e514c;
}
.work-schedule-cell.absence.other{
  background:#f2eef5;
  color:#6e5c77;
}
.work-schedule-cell small{
  color:inherit;
  opacity:.68;
}
.schedule-work-toggle{
  gap:6px;
}
.schedule-work-toggle button{
  min-height:40px;
  padding:9px 10px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#fff;
  font-size:11px;
}
.schedule-work-toggle button.active{
  background:#342d28;
  color:#fff;
  border-color:#342d28;
}
.schedule-template-warning{
  padding:11px 12px;
  border:1px solid #eadbc7;
  background:#fff8ed;
  color:#755b36;
  line-height:1.45;
}

@media(min-width:761px){
  .work-schedule-head,.work-schedule-row{
    grid-template-columns:220px repeat(7,minmax(122px,1fr));
    min-width:1080px;
  }
  .payroll-toolbar{
    align-items:end;
  }
}

@media(max-width:760px){
  .payroll-toolbar{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
    padding:12px;
  }
  .period-switch{
    display:grid;
    grid-template-columns:1fr 1fr;
  }
  .payroll-compact-list{
    border-radius:14px;
  }
  .payroll-compact-row{
    min-height:72px;
    padding:11px 12px;
  }
  .payroll-person-grid{
    grid-template-columns:1fr 1fr;
  }
  .payroll-person-total{
    grid-template-columns:1fr 1fr;
  }
  .payroll-person-total .due{
    grid-column:1/-1;
  }
  #payrollDetail>.section-head{
    padding:12px;
    border-radius:14px;
  }

  .work-schedule-shell{
    border-radius:14px;
  }
  .work-schedule-head,.work-schedule-row{
    grid-template-columns:128px repeat(7,98px);
    min-width:814px;
  }
  .work-schedule-employee{
    min-height:62px;
    padding:7px;
  }
  .work-schedule-employee .employee-avatar{
    width:30px;
    height:30px;
    font-size:12px;
  }
  .work-schedule-employee strong{
    font-size:10px;
  }
  .work-schedule-cell{
    min-height:62px;
    padding:7px 4px;
    font-size:10px;
  }
  .schedule-employee-actions{
    display:none;
  }
  .schedule-kind-toggle{
    display:grid;
    grid-template-columns:1fr 1fr;
  }
  .schedule-kind-toggle button{
    width:100%;
  }
}

/* =========================================================
   NOTIFICATIONS + MORE + LOGIN POLISH · v1
   ========================================================= */
.notification-summary{
  padding:4px 2px 10px;
  font-size:11px;
  color:var(--muted);
}
.notification-feed{
  display:grid;
  gap:7px;
}
.notification-row{
  min-height:72px;
  padding:11px 13px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
  box-shadow:var(--shadow-xs);
}
.notification-row.unread{
  background:linear-gradient(145deg,#fbf6f0,#f7efe7);
  border-color:#decec0;
}
.notification-row>div strong{
  font-size:13px;
  letter-spacing:-.01em;
}
.notification-row small{
  margin-top:1px;
  font-size:11px;
  line-height:1.38;
}
.notification-row time{
  margin-top:3px;
  font-size:10px;
}
.notification-row em{
  padding:4px 7px;
  border-radius:999px;
  background:#3b332d;
  font-size:9px;
  letter-spacing:.02em;
}
.notification-dot{
  width:8px;
  height:8px;
  box-shadow:0 0 0 4px rgba(132,108,89,.07);
}

.more-clean-list,.settings-list{
  border:1px solid var(--line);
  border-radius:16px;
  overflow:hidden;
  background:#fff;
  box-shadow:var(--shadow-xs);
}
.more-clean-list>button,.settings-row{
  min-height:64px;
  border:0;
  border-bottom:1px solid #eee8e2;
  border-radius:0;
  box-shadow:none;
  background:#fff;
}
.more-clean-list>button:last-child,.settings-row:last-child{
  border-bottom:0;
}
.more-clean-list>button strong,.settings-row strong{
  font-size:13px;
}
.more-clean-list small,.settings-row small{
  font-size:10px;
  line-height:1.35;
}
.more-profile-card{
  border:1px solid var(--line);
  border-radius:17px;
  background:linear-gradient(145deg,#fff,#f8f3ee);
  box-shadow:var(--shadow-xs);
}
.access-card-grid>.card,.comp-scheme-grid>.card{
  border:1px solid var(--line);
  box-shadow:var(--shadow-xs);
}

/* Login */
.login{
  background:
    radial-gradient(circle at 20% 10%,rgba(162,134,111,.11),transparent 32%),
    linear-gradient(160deg,#f9f6f2,#f1ebe5);
}
.login-card{
  width:min(430px,100%);
  padding:30px;
  border:1px solid rgba(225,216,207,.9);
  border-radius:24px;
  background:rgba(255,255,255,.94);
  box-shadow:0 24px 70px rgba(65,49,37,.12);
}
.login-card h1{
  margin:0 0 7px;
  font-family:Georgia,serif;
  font-size:30px;
  font-weight:500;
  letter-spacing:-.025em;
}
.login-card .field{
  margin:14px 0;
}
.login-card .primary{
  margin-top:6px;
  min-height:46px;
}

/* Toasts / error readability */
.error{
  color:#93483f;
  font-size:12px;
  line-height:1.4;
}
.danger-text{color:#9b4741!important}
.income-text{color:#477052!important}
.expense-text{color:#9b4741!important}

/* Scrollbars on desktop */
@media(min-width:761px){
  *{
    scrollbar-width:thin;
    scrollbar-color:#cfc5bc transparent;
  }
}

/* final mobile consistency */
@media(max-width:760px){
  .notification-head{
    gap:10px;
  }
  .notification-head .secondary{
    width:auto!important;
  }
  .notification-row{
    min-height:68px;
    padding:10px 11px;
    grid-template-columns:auto minmax(0,1fr) auto!important;
  }
  .notification-row em{display:none}
  .more-clean-list,.settings-list{
    border-radius:14px;
  }
  .more-clean-list>button,.settings-row{
    min-height:60px;
    padding:11px 12px;
  }
  .login{
    padding:16px;
  }
  .login-card{
    padding:24px 18px;
    border-radius:20px;
  }
  .login-card h1{
    font-size:27px;
  }
}

/* =========================================================
   ICONS + EMPLOYEE AVATARS · v1
   ========================================================= */
.ui-icon{
  width:20px;
  height:20px;
  display:block;
  flex:0 0 auto;
}
.nav-ico,.bottom-ico,.metric-icon,.quick-icon,.more-icon{
  display:grid;
  place-items:center;
}
.nav-ico .ui-icon{width:20px;height:20px}
.bottom-ico .ui-icon{width:21px;height:21px}
.metric-icon{
  width:38px;
  height:38px;
  border-radius:12px;
  background:linear-gradient(145deg,#f0e8e0,#e8ddd3);
  color:#6e5a4a;
  box-shadow:inset 0 0 0 1px rgba(112,89,71,.06);
}
.metric-icon .ui-icon{width:19px;height:19px}
.quick-icon,.more-icon{
  width:38px;
  height:38px;
  border-radius:12px;
  background:linear-gradient(145deg,#f2ebe4,#e9dfd6);
  color:#6d5949;
  box-shadow:inset 0 0 0 1px rgba(112,89,71,.055);
}
.quick-icon .ui-icon,.more-icon .ui-icon{width:19px;height:19px}
.quick-chevron{
  width:16px;
  height:16px;
  color:#a09287;
}
.more-clean-list>button>.more-icon{
  margin-right:2px;
}
.client-account-actions .ui-icon{
  width:22px;
  height:22px;
}

.avatar{
  position:relative;
  display:inline-grid;
  place-items:center;
  overflow:hidden;
  border-radius:50%;
  background:linear-gradient(145deg,#f1e9e1,#e7ddd4);
  color:#675547;
  flex:0 0 auto;
}
.avatar>img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
}
.avatar>span{
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  font-weight:700;
}
.avatar.employee-avatar{
  width:36px;
  height:36px;
}
.avatar.employee-avatar.large{
  width:72px;
  height:72px;
}
.avatar.list-avatar.large{
  width:48px;
  height:48px;
}
.employee-avatar-wrap{
  position:relative;
  width:max-content;
  flex:0 0 auto;
}
.avatar-edit-button{
  position:absolute;
  right:-3px;
  bottom:-3px;
  width:30px;
  height:30px;
  min-height:30px;
  display:grid;
  place-items:center;
  padding:0;
  border:2px solid #fff;
  border-radius:50%;
  background:#3e352f;
  color:#fff;
  box-shadow:0 5px 14px rgba(54,43,34,.2);
}
.avatar-edit-button:hover{background:#2e2824}
.avatar-edit-button .ui-icon{width:14px;height:14px}
.employee-avatar-actions{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:6px;
}
.employee-avatar-actions .linklike{
  margin:0;
  padding:0;
  font-size:11px;
}

.public-master-avatar{
  width:58px;
  height:58px;
  font-size:18px;
  box-shadow:0 0 0 3px #f7f2ed;
}
.public-master-main{
  align-items:center;
}
.public-master-main>.ui-icon{
  width:18px;
  height:18px;
  color:#a09185;
}
.public-master-card:has(.public-master-avatar.has-photo){
  border-color:#e0d6cd;
}
.public-master-avatar.has-photo{
  box-shadow:0 0 0 3px #fff,0 6px 16px rgba(75,57,44,.12);
}
.client-master-avatar{
  width:38px;
  height:38px;
  margin-right:10px;
}
.client-appointment-main{
  display:flex;
  align-items:center;
}
.client-appointment-main>div{
  min-width:0;
  flex:1;
}
.public-success-master{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  margin:14px auto 4px;
}
.public-success-avatar{
  width:52px;
  height:52px;
  box-shadow:0 0 0 3px #f5eee8;
}
.public-success-master p{
  display:grid;
  gap:2px;
  margin:0;
  text-align:left;
  font-weight:700;
}
.public-success-master p small{
  color:var(--muted);
  font-size:12px;
  font-weight:500;
}

.more-profile-card .avatar.list-avatar.large{
  font-size:18px;
}
.schedule-person .avatar.employee-avatar,
.work-schedule-employee .avatar.employee-avatar{
  box-shadow:0 0 0 2px #fff;
}

@media(max-width:760px){
  .avatar.employee-avatar.large{
    width:60px;
    height:60px;
  }
  .public-master-avatar{
    width:54px;
    height:54px;
  }
  .quick-icon,.more-icon{
    width:36px;
    height:36px;
    border-radius:11px;
  }
}

/* =========================================================
   MOBILE PROFILE + JOB TITLE FIX
   ========================================================= */
.more-profile-card button{
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
}
.more-profile-card button>div{
  min-width:0;
  display:grid;
  grid-template-columns:1fr;
  gap:3px;
  align-content:center;
}
.more-profile-card button>div>strong{
  display:block;
  min-width:0;
  font-size:15px;
  line-height:1.2;
  letter-spacing:-.015em;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.more-profile-card button>div>small{
  display:block;
  margin:0;
  color:var(--muted);
  font-size:11px;
  line-height:1.25;
  font-weight:600;
  white-space:normal;
}
.more-profile-card button>b{
  align-self:center;
  color:#8e8177;
}

/* checkbox rows must not inherit full-width text-input styling */
.job-title-grid{
  width:100%;
  min-width:0;
}
.job-title-check{
  width:100%;
  min-width:0;
  display:grid;
  grid-template-columns:24px minmax(0,1fr);
  align-items:center;
  gap:11px;
  box-sizing:border-box;
}
.job-title-check input[type="checkbox"]{
  appearance:auto;
  -webkit-appearance:checkbox;
  width:22px!important;
  min-width:22px!important;
  max-width:22px!important;
  height:22px!important;
  min-height:22px!important;
  margin:0!important;
  padding:0!important;
  border-radius:6px;
  box-shadow:none!important;
  accent-color:#8b725e;
  justify-self:start;
}
.job-title-check span{
  min-width:0;
  display:block;
  font-size:13px;
  line-height:1.3;
  color:var(--ink);
  font-weight:600;
  overflow-wrap:anywhere;
}

@media(max-width:760px){
  .more-profile-card button{
    min-height:78px;
    padding:12px 14px;
    gap:12px;
  }
  .more-profile-card .avatar.list-avatar.large{
    width:50px;
    height:50px;
  }
  .more-profile-card button>div>strong{
    font-size:15px;
  }
  .more-profile-card button>div>small{
    font-size:11px;
  }

  .job-title-grid{
    display:grid;
    grid-template-columns:minmax(0,1fr)!important;
    gap:7px;
  }
  .job-title-check{
    min-height:54px;
    padding:11px 13px;
    border-radius:13px;
    background:#fbf9f6;
  }
  .job-title-check span{
    font-size:14px;
    line-height:1.25;
  }
}

/* =========================================================
   VISUAL QA SAFETY LAYER · systemic layout guards
   ========================================================= */

/* Native compact controls must never inherit text-field geometry. */
input[type="checkbox"],
input[type="radio"]{
  width:auto!important;
  min-width:0!important;
  max-width:none!important;
  min-height:0!important;
  height:auto!important;
  padding:0!important;
  margin:0;
  border-radius:initial;
  background:initial;
  box-shadow:none!important;
  flex:0 0 auto;
  accent-color:#8b725e;
}
input[type="file"]{
  width:auto;
  min-height:0;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
}

/* Explicit interactive checkbox rows */
.service-picker-row input[type="checkbox"],
.appointment-edit-service-list input[type="checkbox"],
.appointment-resource-list input[type="checkbox"],
.tag-picker-list input[type="checkbox"],
.service-toggle input[type="checkbox"],
.complex-service-list input[type="checkbox"],
.service-resource-req input[type="checkbox"],
.permission-check input[type="checkbox"],
.client-notify-row input[type="checkbox"],
.check input[type="checkbox"]{
  width:20px!important;
  height:20px!important;
  min-width:20px!important;
  min-height:20px!important;
}

/* Long content must shrink inside grids/flex instead of pushing siblings away. */
:is(
  .mobile-list-row,.settings-row,.notification-row,.more-clean-list>button,
  .more-profile-card button,.employee-card-head,.employee-profile-left,
  .client-appointment-main,.public-master-main,.quick-action,.payroll-compact-row,
  .owner-shift-row,.resource-instance-row,.finance-ranking>div,
  .appointment-edit-service-list label,.appointment-resource-list label,
  .service-toggle,.permission-check,.client-notify-row,.service-picker-row
)>*{
  min-width:0;
}
:is(
  .mobile-list-row,.settings-row,.notification-row,.more-clean-list>button,
  .more-profile-card button,.employee-card,.employee-profile-hero,
  .client-appointment-card,.public-master-card,.quick-action,.payroll-person-card
){
  max-width:100%;
  box-sizing:border-box;
}
img,svg{max-width:100%}

/* Text that may legitimately be long. */
.employee-main strong,
.employee-main small,
.employee-email,
.settings-row strong,
.settings-row small,
.mobile-list-row strong,
.mobile-list-row small,
.notification-row strong,
.notification-row small,
.public-master-main strong,
.public-master-main small,
.client-appointment-main strong,
.client-appointment-main small,
.permission-check span,
.service-toggle span,
.service-picker-row span,
.appointment-edit-service-list span,
.appointment-resource-list span{
  overflow-wrap:anywhere;
}

/* Prevent modal content from creating horizontal page overflow. */
.modal-card,
.guide-modal .modal-card,
.generic-form-modal .modal-card{
  max-width:calc(100vw - 24px);
  box-sizing:border-box;
}
.modal-card>*{min-width:0}

/* Compact controls inside forms should stay compact on iOS. */
@media(max-width:760px){
  input[type="checkbox"],
  input[type="radio"]{
    font-size:initial;
  }
  .check{
    display:grid;
    grid-template-columns:24px minmax(0,1fr);
    align-items:center;
    gap:10px;
    min-height:46px;
  }
  .check input[type="checkbox"]{
    width:22px!important;
    height:22px!important;
    min-width:22px!important;
    min-height:22px!important;
  }

  /* These editor rows were still too rigid below ~390 px. */
  .comp-rule-row{
    grid-template-columns:minmax(0,1fr) 84px!important;
  }
  .comp-rule-row .cs-rule-value{
    grid-column:1/-1;
  }
  .comp-rule-row .cs-remove-rule{
    grid-column:1/-1!important;
  }
  .comp-tier-row{
    grid-template-columns:minmax(0,1fr)!important;
  }
  .comp-tier-row .cs-remove-tier{
    grid-column:1!important;
  }

  .complex-service-config{
    grid-template-columns:24px minmax(0,1fr)!important;
  }
  .complex-service-config>.complex-surcharge{
    grid-column:2!important;
  }
  .multi-complex-segment{
    grid-template-columns:minmax(0,1fr)!important;
  }
  .multi-complex-segment select{
    grid-column:1!important;
    width:100%;
  }

  .resource-instance-row{
    grid-template-columns:minmax(0,1fr) auto!important;
  }
  .resource-instance-row>:last-child{
    grid-column:1/-1;
    justify-self:start;
  }
}

@media(max-width:390px){
  .client-account-actions{
    grid-template-columns:1fr!important;
  }
  .client-account-actions button{
    grid-template-columns:auto minmax(0,1fr);
    align-items:center;
    text-align:left;
  }
  .client-account-actions button>span{
    display:grid;
    place-items:center;
  }
  .public-day-slots section>div{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .finance-management-kpis,
  .finance-management-meta{
    grid-template-columns:1fr!important;
  }
}

/* Final visual QA fixes */
@media(max-width:760px){
  .employee-profile-hero{
    flex-wrap:wrap;
  }
  .employee-profile-hero>.status{
    margin-left:69px;
  }
  .employee-profile-left{
    width:100%;
  }
  .employee-profile-left>div:last-child{
    min-width:0;
    flex:1;
  }
  .employee-profile-left h1{
    overflow-wrap:anywhere;
  }

  .schedule-template-times{
    flex-wrap:wrap;
  }
  .schedule-template-times input[type="time"]{
    min-width:0;
    flex:1 1 120px;
  }

  .finance-tx-row,
  .visit-payment-row,
  .visit-refund-row{
    flex-wrap:wrap;
  }
  .finance-tx-row>strong,
  .employee-shift-metrics strong{
    white-space:normal;
  }
}

@media(max-width:390px){
  .employee-profile-hero>.status{
    margin-left:0;
  }
  .employee-avatar-actions{
    flex-wrap:wrap;
  }
}

/* Visual QA: accessible header profile target */
.top-user.profile-link{
  min-height:36px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  padding:6px 8px;
  border-radius:10px;
}
@media(max-width:760px){
  .top-user.profile-link{
    min-height:40px;
    padding:7px 8px;
  }
}

/* =========================================================
   HEADLESS VISUAL QA FIX PASS · 2026-09-21
   ========================================================= */

/* Audit: long JSON/event payloads must never define card width. */
.audit-list{
  min-width:0;
  max-width:100%;
}
.audit-row{
  width:100%;
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
}
.audit-row-head,
.audit-row-head>div,
.audit-diff,
.audit-diff>*{
  min-width:0;
  max-width:100%;
}
.audit-diff{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
}
.audit-row pre,
.audit-diff pre{
  max-width:100%;
  overflow:auto;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  word-break:break-word;
}

/* Small text actions still need a real touch target. */
.schedule-month-template,
.schedule-absence,
.dash-link,
.mobile-finance-back{
  min-height:32px!important;
  display:inline-flex!important;
  align-items:center;
  padding:6px 4px!important;
}

/* 768px tablets have desktop navigation but not enough content width
   for the two-column journal/KPI compositions. */
@media(min-width:761px) and (max-width:900px){
  .booking-desktop-layout{
    grid-template-columns:minmax(0,1fr)!important;
    gap:10px!important;
  }
  .booking-month-panel{
    display:none!important;
  }
  .booking-journal-main{
    min-width:0!important;
    max-width:100%!important;
  }
  .booking-workspace-head{
    width:100%;
    min-width:0;
    flex-wrap:wrap;
    align-items:center;
  }
  .booking-date-title{
    flex:1 1 170px;
    min-width:0;
  }
  .booking-head-actions{
    flex:0 1 auto;
    min-width:0;
    flex-wrap:wrap;
  }
  .booking-date-dock{
    width:100%;
    max-width:100%!important;
    box-sizing:border-box;
  }
  .schedule-shell.compact-journal{
    width:100%;
    max-width:100%;
  }

  .kpi-hero-grid{
    grid-template-columns:minmax(0,1fr)!important;
  }
  .kpi-bonus-card{
    grid-column:auto!important;
  }
  .kpi-focus-card,
  .kpi-progress-card,
  .kpi-bonus-card{
    min-width:0;
    max-width:100%;
    box-sizing:border-box;
  }
}

@media(max-width:760px){
  .audit-diff{
    grid-template-columns:minmax(0,1fr)!important;
  }
  .audit-row{
    padding:11px!important;
  }
  .audit-row-head{
    flex-wrap:wrap;
  }
}

/* QA density pass — mobile KPI. Isolated from production. */
@media(max-width:760px){
  #content:has(#kpiHero) > .section-head{
    gap:8px!important;
    margin-bottom:10px!important;
  }
  #content:has(#kpiHero) > .section-head h1{
    margin:1px 0 1px!important;
    font-size:23px!important;
    line-height:1.02!important;
  }
  #content:has(#kpiHero) > .section-head p{
    font-size:12px!important;
    line-height:1.3!important;
  }
  #content:has(#kpiHero) > .section-head .actions-inline{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:7px!important;
    width:100%!important;
  }
  #content:has(#kpiHero) > .section-head .actions-inline button{
    width:100%!important;
    min-height:40px!important;
    padding:8px 10px!important;
    font-size:12px!important;
  }

  #kpiHero .kpi-hero-grid{
    gap:8px!important;
    margin-bottom:9px!important;
  }
  #kpiHero .kpi-focus-card,
  #kpiHero .kpi-progress-card,
  #kpiHero .kpi-bonus-card{
    padding:12px!important;
    border-radius:15px!important;
  }
  #kpiHero .kpi-focus-card{
    align-items:center!important;
    gap:10px!important;
  }
  #kpiHero .kpi-big{
    font-size:34px!important;
    line-height:1!important;
    margin:3px 0 5px!important;
  }
  #kpiHero .kpi-focus-card p{
    font-size:11px!important;
    line-height:1.3!important;
    margin:5px 0 0!important;
  }
  #kpiHero .kpi-ring{
    width:66px!important;
    height:66px!important;
    font-size:20px!important;
    flex:0 0 66px!important;
  }
  #kpiHero .kpi-ring small{font-size:9px!important}

  #kpiHero .card-title{
    margin-bottom:5px!important;
    align-items:start!important;
  }
  #kpiHero .card-title h2{
    font-size:15px!important;
    margin:1px 0 0!important;
  }
  #kpiHero .kpi-progress-card>.muted.small{
    font-size:10px!important;
    line-height:1.35!important;
  }
  #kpiHero .kpi-bonus-card .metric{
    font-size:24px!important;
    margin:4px 0 7px!important;
  }
  #kpiHero .bonus-split{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:5px!important;
  }
  #kpiHero .bonus-split span{
    padding:7px 6px!important;
    border-radius:9px!important;
    gap:2px!important;
  }
  #kpiHero .bonus-split small{
    font-size:8px!important;
    line-height:1.15!important;
  }
  #kpiHero .bonus-split strong{
    font-size:11px!important;
    line-height:1.15!important;
  }

  #content:has(#kpiHero) .lead-card{
    padding:11px 12px!important;
    border-radius:15px!important;
  }
  #content:has(#kpiHero) .lead-card>.card-title{
    margin-bottom:4px!important;
  }
  #content:has(#kpiHero) .lead-card>.card-title h2{
    font-size:16px!important;
    margin:1px 0 0!important;
  }
  #content:has(#kpiHero) .lead-row{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:6px 8px!important;
    align-items:center!important;
    padding:8px 0!important;
  }
  #content:has(#kpiHero) .lead-main{
    min-width:0!important;
    gap:7px!important;
  }
  #content:has(#kpiHero) .lead-main .avatar-mini{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    font-size:10px!important;
  }
  #content:has(#kpiHero) .lead-main strong{
    display:block;
    font-size:12px!important;
    line-height:1.2!important;
  }
  #content:has(#kpiHero) .lead-main .small{
    font-size:9px!important;
    line-height:1.25!important;
    white-space:normal;
  }
  #content:has(#kpiHero) .lead-actions{
    width:auto!important;
    gap:5px!important;
    justify-content:flex-end!important;
  }
  #content:has(#kpiHero) .lead-actions .status{
    font-size:8px!important;
    padding:4px 6px!important;
  }
  #content:has(#kpiHero) .lead-actions .edit-lead{
    min-height:38px!important;
    padding:7px 9px!important;
    font-size:10px!important;
  }
}

/* QA density pass v2 — keep compact layout, restore comfortable mobile targets. */
@media(max-width:760px){
  #content:has(#kpiHero) > .section-head .actions-inline button{
    min-height:44px!important;
    padding:9px 10px!important;
    font-size:12px!important;
  }
  #kpiHero .bonus-split{
    grid-template-columns:1fr 1fr!important;
    gap:6px!important;
  }
  #kpiHero .bonus-split span:last-child{
    grid-column:1/-1!important;
  }
  #kpiHero .bonus-split small{
    font-size:10px!important;
    line-height:1.2!important;
  }
  #kpiHero .bonus-split strong{
    font-size:12px!important;
  }
  #content:has(#kpiHero) .lead-row{
    padding:9px 0!important;
  }
  #content:has(#kpiHero) .lead-main .avatar-mini{
    width:32px!important;
    height:32px!important;
    min-width:32px!important;
    font-size:11px!important;
  }
  #content:has(#kpiHero) .lead-main strong{
    font-size:13px!important;
  }
  #content:has(#kpiHero) .lead-main .small{
    font-size:10px!important;
    line-height:1.3!important;
  }
  #content:has(#kpiHero) .lead-actions .status{
    font-size:9px!important;
    padding:4px 6px!important;
  }
  #content:has(#kpiHero) .lead-actions .edit-lead{
    min-height:44px!important;
    padding:8px 10px!important;
    font-size:11px!important;
  }
}

/* =========================================================
   QA MOBILE DENSITY v3 — all mobile screens, balanced
   Isolated QA only. Keep tap targets, remove vertical waste.
   ========================================================= */
@media(max-width:760px){
  /* Global mobile rhythm */
  .main{padding-top:10px!important;padding-bottom:22px!important}
  .top.compact-mobile-top{
    margin-bottom:9px!important;
    padding-top:8px!important;
    padding-bottom:9px!important;
  }
  .section-head{
    gap:7px!important;
    margin-bottom:10px!important;
  }
  .section-head h1{
    margin:1px 0 2px!important;
    font-size:23px!important;
    line-height:1.04!important;
  }
  .section-head p{
    font-size:12px!important;
    line-height:1.32!important;
  }
  .card-title{margin-bottom:8px!important}
  .card-title h2{font-size:16px!important;margin-bottom:0!important}
  .eyebrow{font-size:9px!important;line-height:1.2!important}
  .main>.card,
  .main>section.card{margin-bottom:9px}
  .actions-inline{gap:6px!important}
  .actions-inline button{min-height:44px!important}

  /* Clients: dense but still finger-friendly */
  .mobile-section-title{margin-bottom:7px!important}
  .mobile-section-title h1{
    font-size:23px!important;
    line-height:1.05!important;
    margin:1px 0 0!important;
  }
  .client-search-card{
    margin-bottom:7px!important;
    padding:8px!important;
  }
  .client-search-line{gap:5px!important}
  .client-filter-tabs{gap:5px!important;margin-top:6px!important}
  .client-filter-tabs button{
    min-height:38px!important;
    padding:6px 10px!important;
    font-size:11px!important;
  }
  #clientsList .mobile-list{gap:6px!important}
  #clientsList .mobile-list-row{
    min-height:54px!important;
    padding:8px 10px!important;
    gap:8px!important;
    border-radius:12px!important;
  }
  #clientsList .list-avatar{
    width:32px!important;
    height:32px!important;
    min-width:32px!important;
    font-size:12px!important;
  }
  #clientsList .mobile-list-row strong{
    font-size:12px!important;
    line-height:1.2!important;
  }
  #clientsList .mobile-list-row small{
    font-size:10px!important;
    line-height:1.25!important;
  }
  .client-filter-summary{
    margin-bottom:7px!important;
    padding:8px 10px!important;
    font-size:11px!important;
  }

  /* Employees list */
  #content:has(#employeeList)>.section-head .primary{
    min-height:44px!important;
    padding:8px 12px!important;
  }
  .employee-card-grid{gap:7px!important}
  .employee-card{
    padding:10px 11px!important;
    border-radius:14px!important;
  }
  .employee-card-head{gap:9px!important}
  .employee-card .employee-avatar{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    font-size:16px!important;
  }
  .employee-main strong{font-size:13px!important}
  .employee-main small{font-size:10px!important}
  .employee-email{
    margin:8px 0 7px!important;
    padding:6px 8px!important;
    font-size:10px!important;
  }
  .employee-card-foot{
    padding-top:7px!important;
    gap:7px!important;
  }
  .employee-card-foot .small{font-size:9px!important}
  .employee-card-foot .secondary{
    min-height:40px!important;
    padding:7px 9px!important;
    font-size:10px!important;
  }
  .invite-panel{padding:11px!important;border-radius:14px!important}
  .invite-panel .payroll-line{padding:8px 0!important}

  /* Employee detail */
  .employee-profile-hero{
    padding:11px!important;
    margin-bottom:8px!important;
    gap:9px!important;
    border-radius:14px!important;
  }
  .employee-profile-left{gap:10px!important}
  .employee-avatar.large{
    width:48px!important;
    height:48px!important;
    min-width:48px!important;
    font-size:20px!important;
  }
  .employee-profile-left h1{
    font-size:20px!important;
    margin:1px 0 2px!important;
  }
  .employee-profile-left .muted{font-size:11px!important}
  .employee-avatar-actions{gap:5px!important}
  .employee-avatar-actions .linklike{
    min-height:32px!important;
    padding:4px 3px!important;
    font-size:10px!important;
  }
  .employee-profile-hero>.status{
    font-size:9px!important;
    padding:5px 7px!important;
  }
  .employee-profile-grid{gap:8px!important}
  .employee-profile-grid>article{
    padding:11px!important;
    border-radius:14px!important;
  }
  .profile-owner-summary{
    gap:6px!important;
    margin-bottom:7px!important;
  }
  .profile-owner-summary span{
    padding:7px 8px!important;
    gap:2px!important;
  }
  .profile-owner-summary small{font-size:9px!important}
  .profile-owner-summary strong{font-size:11px!important;line-height:1.25!important}
  .employee-shift-row{padding:8px 0!important}
  .payroll-line,.auto-row{padding:8px 0!important}

  /* Personal profile: 2-column mobile where practical */
  #content:has(#profileBody)>.section-head{margin-bottom:8px!important}
  #profileForm{gap:8px!important}
  #profileForm>section.card{
    padding:11px!important;
    border-radius:14px!important;
  }
  #profileForm>section.card>h2{
    font-size:16px!important;
    margin-bottom:6px!important;
  }
  #profileForm .profile-grid{
    grid-template-columns:1fr 1fr!important;
    gap:6px 8px!important;
  }
  #profileForm .profile-wide{grid-column:1/-1!important}
  #profileForm .field{
    margin:6px 0!important;
    gap:5px!important;
    font-size:11px!important;
  }
  #profileForm .field input,
  #profileForm .field select,
  #profileForm .field textarea{
    min-height:44px!important;
    padding-top:8px!important;
    padding-bottom:8px!important;
  }
  #profileForm .field textarea{min-height:74px!important}
  .profile-readiness{
    margin:8px 0!important;
    padding:10px 11px!important;
    gap:2px!important;
  }
  .profile-readiness strong{font-size:12px!important}
  .profile-readiness span{font-size:10px!important;line-height:1.3!important}
  .profile-sensitive{padding:0!important}
  .profile-sensitive summary{
    min-height:48px!important;
    padding:10px 11px!important;
    align-items:center!important;
  }
  .profile-sensitive-note{
    margin:8px 10px!important;
    padding:8px!important;
    font-size:10px!important;
  }
  .profile-sensitive[open] .profile-grid{padding:0 10px 10px!important}
  .profile-save-bar{
    bottom:72px!important;
    padding:7px!important;
    border-radius:12px!important;
  }
  .profile-save-bar .primary{min-height:44px!important}

  /* Owner shifts */
  #content:has(#ownerShiftCards)>.section-head{margin-bottom:7px!important}
  #content:has(#ownerShiftCards) .mobile-filter-bar{
    padding:8px!important;
    margin-bottom:7px!important;
    gap:6px!important;
  }
  #content:has(#ownerShiftCards) .filter-pills{gap:5px!important}
  #content:has(#ownerShiftCards) .filter-pills button{
    min-height:38px!important;
    padding:6px 9px!important;
    font-size:10px!important;
  }
  .owner-shift-row{
    padding:8px 9px!important;
    gap:6px!important;
    min-height:58px!important;
  }
  .owner-shift-row strong{font-size:11px!important}
  .owner-shift-row small{font-size:9px!important;line-height:1.25!important}
  .owner-shift-row .status{
    font-size:9px!important;
    padding:4px 6px!important;
  }

  /* Finance */
  #content:has(#financeAnalytics)>.section-head{margin-bottom:7px!important}
  .finance-analytics-toolbar{
    margin-bottom:7px!important;
    padding:8px!important;
  }
  .finance-analytics-toolbar .field{margin:0!important}
  .finance-management-kpis{gap:6px!important}
  .finance-management-kpis .finance-kpi{
    min-height:86px!important;
    padding:9px!important;
    border-radius:13px!important;
  }
  .finance-management-kpis .finance-kpi strong{
    margin-top:3px!important;
    font-size:18px!important;
  }
  .finance-management-kpis .finance-kpi small{
    font-size:8px!important;
  }
  .finance-management-kpis .finance-kpi span{
    font-size:8px!important;
  }
  .finance-management-meta{
    gap:5px!important;
    margin:7px 0 8px!important;
  }
  .finance-management-meta>div{
    min-height:52px!important;
    padding:7px 8px!important;
    border-radius:10px!important;
  }
  .finance-management-meta small{font-size:8px!important}
  .finance-management-meta strong{font-size:11px!important}
  .finance-management-breakdowns{gap:7px!important}
  .finance-management-breakdowns>.card{
    padding:10px!important;
    border-radius:14px!important;
  }
  .finance-ranking>div{padding:7px 0!important}
  .finance-ranking span small{font-size:9px!important}
  .finance-ranking>div>strong{font-size:11px!important}
  .finance-category-grid>.card{padding:11px!important}
  .finance-tx-row{padding:9px 1px!important}
  .finance-tx-row>div:first-child strong{font-size:12px!important}
  .finance-tx-row small{font-size:10px!important}
  #content:has(#financeSummary)>section.card{
    padding:11px!important;
    border-radius:14px!important;
  }
  #content:has(#financeSummary) .more-card{
    min-height:60px!important;
    padding:9px 11px!important;
  }

  /* Audit log */
  #content:has(#auditList)>.section-head .secondary{
    min-height:44px!important;
    padding:8px 11px!important;
  }
  .audit-list{gap:6px!important}
  .audit-row{
    padding:8px 9px!important;
    border-radius:13px!important;
  }
  .audit-row-head{gap:7px!important}
  .audit-row-head strong{
    font-size:12px!important;
    line-height:1.2!important;
  }
  .audit-row-head small{
    font-size:9px!important;
    line-height:1.25!important;
  }
  .audit-row-head .status{
    font-size:8px!important;
    padding:4px 6px!important;
  }
  .audit-row p{
    margin:6px 0!important;
    font-size:10px!important;
    line-height:1.3!important;
  }
  .audit-row details{margin-top:4px!important}
  .audit-row summary{
    min-height:34px!important;
    display:inline-flex!important;
    align-items:center!important;
    font-size:10px!important;
  }

  /* Owner dashboard/cards */
  #content:has(.dash-metrics) .dash-card,
  #content:has(.quick-actions) .quick-actions{
    padding:10px!important;
  }
  .dash-metrics{gap:6px!important}
  .quick-actions{gap:6px!important}
  .quick-action{min-height:54px!important;padding:8px 9px!important}
}

@media(max-width:390px){
  /* Preserve readable finance on narrow phones: 2 cols instead of one. */
  .finance-management-kpis,
  .finance-management-meta{
    grid-template-columns:1fr 1fr!important;
  }
  #profileForm .profile-grid{
    grid-template-columns:1fr 1fr!important;
  }
}

/* QA MOBILE DENSITY v3.1 — owner KPI cards */
@media(max-width:760px){
  #content:has(#ownerKpiGrid)>.section-head{
    margin-bottom:7px!important;
  }
  #content:has(#ownerKpiGrid)>.section-head .secondary{
    min-height:44px!important;
    padding:8px 11px!important;
  }
  #content:has(#ownerKpiGrid) .mobile-filter-bar{
    padding:8px!important;
    margin-bottom:7px!important;
  }
  .owner-kpi-grid{gap:6px!important}
  .kpi-person-card{
    padding:9px!important;
    border-radius:13px!important;
  }
  .kpi-card-head{gap:6px!important}
  .kpi-card-head strong{font-size:12px!important}
  .kpi-card-head .small{font-size:9px!important;line-height:1.2!important}
  .kpi-band{font-size:8px!important;padding:4px 5px!important}
  .kpi-conversion{
    margin:6px 0 4px!important;
    align-items:center!important;
  }
  .kpi-conversion>strong{font-size:22px!important}
  .kpi-conversion .small{font-size:9px!important;line-height:1.2!important}
  .kpi-card-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:4px!important;
    margin-top:5px!important;
  }
  .kpi-card-grid span{
    padding:5px 4px!important;
    border-radius:8px!important;
    gap:1px!important;
  }
  .kpi-card-grid small{font-size:8px!important;line-height:1.1!important}
  .kpi-card-grid strong{font-size:10px!important;line-height:1.1!important}
  .kpi-split-compact{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:4px!important;
    margin-top:5px!important;
  }
  .kpi-split-compact span{
    padding:5px!important;
    font-size:8px!important;
    line-height:1.15!important;
    display:grid!important;
    gap:2px!important;
    justify-content:initial!important;
  }
  .kpi-split-compact span:last-child{grid-column:auto!important}
  .kpi-split-compact strong{font-size:9px!important}
  .kpi-owner-actions{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:5px!important;
    margin-top:6px!important;
  }
  .kpi-owner-actions .secondary{
    min-height:42px!important;
    padding:7px 7px!important;
    font-size:9px!important;
  }
  .kpi-owner-actions .linklike{
    grid-column:1/-1!important;
    min-height:32px!important;
    padding:4px!important;
    font-size:9px!important;
  }
}

/* =========================================================
   QA MOBILE READABILITY v4 — fix over-compressed text
   ========================================================= */
@media(max-width:760px){
  /* Owner KPI */
  #content:has(#ownerKpiGrid) .kpi-band{font-size:9px!important}
  #content:has(#ownerKpiGrid) .kpi-card-head .small{font-size:10px!important}
  #content:has(#ownerKpiGrid) .kpi-conversion .small{font-size:10px!important}
  #content:has(#ownerKpiGrid) .kpi-card-grid small{font-size:9.5px!important}
  #content:has(#ownerKpiGrid) .kpi-card-grid strong{font-size:11px!important}
  #content:has(#ownerKpiGrid) .kpi-split-compact span{font-size:9.5px!important}
  #content:has(#ownerKpiGrid) .kpi-split-compact strong{font-size:10px!important}
  #content:has(#ownerKpiGrid) .kpi-owner-actions .secondary{font-size:10.5px!important}
  #content:has(#ownerKpiGrid) .kpi-owner-actions .linklike{font-size:10px!important}

  /* Admin KPI */
  #content:has(#kpiHero) .bonus-split small{font-size:10px!important}
  #content:has(#kpiHero) .lead-main .small{font-size:10.5px!important}
  #content:has(#kpiHero) .lead-actions .status{font-size:9.5px!important}
  #content:has(#kpiHero) .lead-actions .edit-lead{font-size:11px!important}

  /* Finance */
  .finance-management-kpis .finance-kpi small{font-size:9.5px!important}
  .finance-management-kpis .finance-kpi span{font-size:9.5px!important}
  .finance-management-meta small{font-size:9.5px!important}
  .finance-management-meta strong{font-size:12px!important}
  .finance-ranking span small{font-size:10px!important}
  .finance-ranking>div>strong{font-size:12px!important}

  /* Owner shifts */
  .owner-shift-row strong{font-size:12px!important}
  .owner-shift-row small{font-size:10px!important}
  .owner-shift-row .status{font-size:10px!important}

  /* Audit */
  .audit-row-head strong{font-size:12.5px!important}
  .audit-row-head small{font-size:10px!important}
  .audit-row-head .status{font-size:9.5px!important}
  .audit-row p{font-size:10.5px!important}
  .audit-row summary{font-size:10.5px!important}
  .audit-row pre,.audit-json{font-size:10px!important}

  /* Employees */
  .employee-card-foot .small{font-size:10px!important}
  .employee-card-foot .secondary{font-size:11px!important}
  .employee-email{font-size:10.5px!important}

  /* Profiles */
  .employee-profile-left .muted{font-size:11px!important}
  #profileForm .field{font-size:11.5px!important}
  .profile-readiness span{font-size:10.5px!important}
  .profile-sensitive-note{font-size:10.5px!important}

  /* Journal prices are actual work information, not decorative text. */
  .schedule-price{font-size:9.5px!important}
}

/* QA MOBILE READABILITY v4.1 — journal + admin KPI */
@media(max-width:760px){
  .compact-journal .schedule-appt-top small{font-size:9.5px!important}
  .compact-journal .schedule-price{font-size:9.5px!important}
  .compact-journal .schedule-appt>span{font-size:10px!important}
  #content:has(#kpiHero) .kpi-band{font-size:9px!important}
}

/* QA VISUAL AUDIT v5 — profile bottom clearance */
@media(max-width:760px){
  #profileForm{
    padding-bottom:84px!important;
  }
}

/* QA VISUAL AUDIT v5.1 — compact finance rule badge */
@media(max-width:760px){
  .finance-rule-note .status{
    white-space:nowrap!important;
    width:max-content!important;
    flex:0 0 auto!important;
  }
}

/* QA VISUAL AUDIT v5.2 — compact notifications header */
@media(max-width:760px){
  .notification-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:4px 8px!important;
    align-items:start!important;
  }
  .notification-head>div:first-child{
    display:contents!important;
  }
  .notification-head .eyebrow{
    grid-column:1;
    grid-row:1;
  }
  .notification-head h1{
    grid-column:1;
    grid-row:2;
  }
  .notification-head p{
    grid-column:1/-1;
    grid-row:3;
  }
  .notification-head .secondary{
    grid-column:2;
    grid-row:1/3;
    align-self:center;
    min-height:40px!important;
    padding:7px 10px!important;
  }
}
@media(max-width:760px){
  .notification-head .secondary{min-height:44px!important;}
}

/* QA VISUAL AUDIT v5.3 — compact employees header */
@media(max-width:760px){
  #content:has(#employeeList)>.section-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:4px 8px!important;
    align-items:start!important;
  }
  #content:has(#employeeList)>.section-head>div:first-child{
    display:contents!important;
  }
  #content:has(#employeeList)>.section-head .eyebrow{
    grid-column:1;
    grid-row:1;
  }
  #content:has(#employeeList)>.section-head h1{
    grid-column:1;
    grid-row:2;
  }
  #content:has(#employeeList)>.section-head p{
    grid-column:1/-1;
    grid-row:3;
  }
  #content:has(#employeeList)>.section-head #newInvite{
    grid-column:2;
    grid-row:1/3;
    align-self:center;
    width:auto!important;
    min-height:44px!important;
    padding:8px 10px!important;
  }
}

/* QA VISUAL AUDIT v5.4 — compact owner KPI + audit headers */
@media(max-width:760px){
  #content:has(#ownerKpiGrid)>.section-head,
  #content:has(#auditList)>.section-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:4px 8px!important;
    align-items:start!important;
  }
  #content:has(#ownerKpiGrid)>.section-head>div:first-child,
  #content:has(#auditList)>.section-head>div:first-child{
    display:contents!important;
  }
  #content:has(#ownerKpiGrid)>.section-head .eyebrow,
  #content:has(#auditList)>.section-head .eyebrow{
    grid-column:1;
    grid-row:1;
  }
  #content:has(#ownerKpiGrid)>.section-head h1,
  #content:has(#auditList)>.section-head h1{
    grid-column:1;
    grid-row:2;
  }
  #content:has(#ownerKpiGrid)>.section-head p,
  #content:has(#auditList)>.section-head p{
    grid-column:1/-1;
    grid-row:3;
  }
  #content:has(#ownerKpiGrid)>.section-head>button,
  #content:has(#auditList)>.section-head>button{
    grid-column:2;
    grid-row:1/3;
    align-self:center;
    width:auto!important;
    min-height:44px!important;
    padding:8px 10px!important;
  }
}

/* QA VISUAL AUDIT v5.5 — readable journal employee captions */
@media(max-width:760px){
  .compact-journal .schedule-person small{
    font-size:9.5px!important;
    line-height:1.2!important;
  }
}

/* QA VISUAL AUDIT v5.6 — normalize legacy card padding */
@media(max-width:760px){
  .finance-management-meta.card{
    padding:10px!important;
    border-radius:14px!important;
  }
  .rule-entry-card,
  .rule-history{
    padding:11px!important;
    border-radius:14px!important;
  }
}

/* QA VISUAL AUDIT v5.7 — compact rules summary */
@media(max-width:760px){
  .rule-summary-grid{
    gap:6px!important;
    margin-top:8px!important;
  }
  .rule-summary-grid span{
    min-height:44px!important;
    padding:6px 8px!important;
    gap:1px!important;
    align-content:center!important;
  }
  .rule-summary-grid small{
    font-size:9.5px!important;
    line-height:1.15!important;
  }
  .rule-summary-grid strong{
    font-size:12px!important;
    line-height:1.15!important;
  }
}

/* QA VISUAL AUDIT v5.8 — compact employee cards */
@media(max-width:760px){
  .employee-card-foot{
    justify-content:flex-end!important;
    padding-top:4px!important;
    min-height:44px!important;
  }
  .employee-card-foot>.muted.small{
    display:none!important;
  }
  .employee-card-foot .secondary{
    min-height:44px!important;
  }
}
@media(max-width:760px){
  .employee-card .employee-email{
    margin:5px 0!important;
  }
  .employee-card-foot{
    padding-top:0!important;
    min-height:44px!important;
  }
}

/* QA VISUAL AUDIT v5.9 — compact multi-position picker */
@media(max-width:760px){
  #profileForm .job-title-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:6px!important;
  }
  #profileForm .job-title-check{
    min-height:44px!important;
    padding:7px 8px!important;
    gap:7px!important;
    border-radius:11px!important;
    grid-template-columns:22px minmax(0,1fr)!important;
  }
  #profileForm .job-title-check span{
    font-size:11.5px!important;
    line-height:1.15!important;
  }
}

/* QA VISUAL AUDIT v6.0 — employee edit parity with own profile */
@media(max-width:760px){
  #ownerEmployeeProfileForm{
    padding-bottom:84px!important;
  }
  #ownerEmployeeProfileForm .job-title-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:6px!important;
  }
  #ownerEmployeeProfileForm .job-title-check{
    min-height:44px!important;
    padding:7px 8px!important;
    gap:7px!important;
    border-radius:11px!important;
    grid-template-columns:22px minmax(0,1fr)!important;
  }
  #ownerEmployeeProfileForm .job-title-check span{
    font-size:11.5px!important;
    line-height:1.15!important;
  }
}

/* QA VISUAL AUDIT v6.1 — compact employee service assignment rows */
@media(max-width:760px){
  .service-assignment-row{
    padding:6px 0!important;
    gap:6px!important;
  }
  .service-custom-fields{
    padding-left:27px!important;
  }
}

/* QA VISUAL AUDIT v6.2 — compact service catalog actions */
@media(max-width:760px){
  #content:has(#serviceCatalogList)>.section-head .actions-inline{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:6px!important;
    width:100%!important;
  }
  #content:has(#serviceCatalogList)>.section-head .actions-inline button{
    width:100%!important;
    min-width:0!important;
    min-height:44px!important;
    padding:8px 6px!important;
    font-size:11px!important;
  }
}

/* QA VISUAL AUDIT v6.3 — service categories/complexes */
@media(max-width:760px){
  #content:has(#svcCatList)>.section-head,
  #content:has(#complexList)>.section-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:4px 8px!important;
    align-items:start!important;
  }
  #content:has(#svcCatList)>.section-head>div:first-child,
  #content:has(#complexList)>.section-head>div:first-child{
    display:contents!important;
  }
  #content:has(#svcCatList)>.section-head .eyebrow,
  #content:has(#complexList)>.section-head .eyebrow{
    grid-column:1;grid-row:1;
  }
  #content:has(#svcCatList)>.section-head h1,
  #content:has(#complexList)>.section-head h1{
    grid-column:1;grid-row:2;
  }
  #content:has(#svcCatList)>.section-head p,
  #content:has(#complexList)>.section-head p{
    grid-column:1/-1;grid-row:3;
  }
  #content:has(#svcCatList)>.section-head>button,
  #content:has(#complexList)>.section-head>button{
    grid-column:2;grid-row:1/3;
    align-self:center;
    width:auto!important;
    min-height:44px!important;
    padding:8px 10px!important;
  }

  .complex-card{
    padding:11px!important;
    border-radius:14px!important;
  }
  .complex-card .summary-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:6px!important;
    margin:8px 0 0!important;
  }
  .complex-card .summary-grid>div{
    padding:8px 9px!important;
    gap:2px!important;
    border-radius:10px!important;
  }
  .complex-card .summary-grid strong{
    font-size:16px!important;
  }
  .complex-card .summary-grid small{
    font-size:9.5px!important;
    line-height:1.2!important;
  }
}

/* QA VISUAL AUDIT v6.4 — compact service editor */
@media(max-width:760px){
  #serviceEditorForm{
    padding-bottom:84px!important;
  }
  #serviceEditorForm>section.card{
    padding:11px!important;
    border-radius:14px!important;
  }
  #serviceEditorForm .profile-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px 8px!important;
  }
  #serviceEditorForm .profile-wide{
    grid-column:1/-1!important;
  }
  #serviceEditorForm .field{
    margin:6px 0!important;
    gap:5px!important;
    font-size:11.5px!important;
  }
  #serviceEditorForm .field input,
  #serviceEditorForm .field select{
    min-height:44px!important;
  }
  #serviceEditorForm .service-cover-editor{
    gap:9px!important;
  }
}
@media(max-width:760px){
  #serviceEditorForm{padding-bottom:100px!important;}
}

/* QA VISUAL AUDIT v6.5 — compact complex editor */
@media(max-width:760px){
  #complexForm{
    padding-bottom:100px!important;
  }
  #complexForm>section.card{
    padding:11px!important;
    border-radius:14px!important;
  }
  #complexForm .profile-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px 8px!important;
  }
  #complexForm .profile-wide{
    grid-column:1/-1!important;
  }
  #complexForm .field{
    margin:6px 0!important;
    gap:5px!important;
    font-size:11.5px!important;
  }
  #complexForm .complex-service-config{
    padding:6px 0!important;
    gap:6px!important;
  }
  #complexForm .complex-surcharge{
    gap:2px!important;
  }
  #complexForm .complex-surcharge input{
    min-height:44px!important;
  }
}

/* QA VISUAL AUDIT v6.6 — accessible modal close target */
@media(max-width:760px){
  .guide-close{
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    flex:0 0 44px!important;
  }
}

/* QA VISUAL AUDIT v6.7 — More nested headers + access cards */
@media(max-width:760px){
  #content:has(#tagManagerList)>.section-head,
  #content:has(#paymentMethodsList)>.section-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:4px 8px!important;
    align-items:start!important;
  }
  #content:has(#tagManagerList)>.section-head>div:first-child,
  #content:has(#paymentMethodsList)>.section-head>div:first-child{
    display:contents!important;
  }
  #content:has(#tagManagerList)>.section-head .eyebrow,
  #content:has(#paymentMethodsList)>.section-head .eyebrow{grid-column:1;grid-row:1}
  #content:has(#tagManagerList)>.section-head h1,
  #content:has(#paymentMethodsList)>.section-head h1{grid-column:1;grid-row:2}
  #content:has(#tagManagerList)>.section-head p,
  #content:has(#paymentMethodsList)>.section-head p{grid-column:1/-1;grid-row:3}
  #content:has(#tagManagerList)>.section-head>button,
  #content:has(#paymentMethodsList)>.section-head>button{
    grid-column:2;grid-row:1/3;
    align-self:center;
    width:auto!important;
    min-height:44px!important;
    padding:8px 10px!important;
  }

  #content:has(#resourceList)>.section-head .actions-inline{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:6px!important;
    width:100%!important;
  }
  #content:has(#resourceList)>.section-head .actions-inline button{
    width:100%!important;
    min-height:44px!important;
    padding:8px 8px!important;
  }

  .access-note,
  .access-card{
    padding:11px!important;
    border-radius:14px!important;
  }
  .access-card-grid{gap:8px!important;margin-bottom:10px!important}
  .access-card{gap:7px!important}
  .access-card .card-title{margin-bottom:4px!important}
  .permission-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:5px!important;
  }
  .permission-check{
    min-height:44px!important;
    padding:6px 7px!important;
    gap:7px!important;
    border:1px solid var(--line)!important;
    border-radius:10px!important;
    background:#fbf9f6!important;
  }
  .permission-check span{
    font-size:11px!important;
    line-height:1.15!important;
  }
}

/* QA VISUAL AUDIT v6.8 — compact resources header */
@media(max-width:760px){
  #content:has(#resourceList)>.section-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:4px 8px!important;
    align-items:start!important;
  }
  #content:has(#resourceList)>.section-head>div:first-child{
    display:contents!important;
  }
  #content:has(#resourceList)>.section-head .eyebrow{grid-column:1;grid-row:1}
  #content:has(#resourceList)>.section-head h1{grid-column:1;grid-row:2}
  #content:has(#resourceList)>.section-head p{grid-column:1/-1;grid-row:3}
  #content:has(#resourceList)>.section-head .actions-inline{
    grid-column:2;
    grid-row:1/3;
    align-self:center;
    display:grid!important;
    grid-template-columns:auto auto!important;
    gap:5px!important;
    width:auto!important;
  }
  #content:has(#resourceList)>.section-head .actions-inline button{
    width:auto!important;
    min-width:0!important;
    min-height:44px!important;
    padding:8px 8px!important;
    font-size:10px!important;
  }
}

/* QA VISUAL AUDIT v6.9 — compensation schemes */
@media(max-width:760px){
  #content:has(#compSchemesList)>.section-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:4px 8px!important;
    align-items:start!important;
  }
  #content:has(#compSchemesList)>.section-head>div:first-child{
    display:contents!important;
  }
  #content:has(#compSchemesList)>.section-head .eyebrow{grid-column:1;grid-row:1}
  #content:has(#compSchemesList)>.section-head h1{grid-column:1;grid-row:2}
  #content:has(#compSchemesList)>.section-head p{grid-column:1/-1;grid-row:3}
  #content:has(#compSchemesList)>.section-head>button{
    grid-column:2;grid-row:1/3;
    align-self:center;
    width:auto!important;
    min-height:44px!important;
    padding:8px 10px!important;
  }

  .comp-scheme-card{
    padding:11px!important;
    border-radius:14px!important;
    gap:7px!important;
  }
  .comp-scheme-card .comp-scheme-meta{margin-top:4px!important}
  .comp-scheme-card .comp-scheme-actions{
    margin-top:5px!important;
    padding-top:6px!important;
    gap:6px!important;
  }
  .comp-scheme-card .comp-scheme-actions button{
    min-height:44px!important;
  }

  .comp-assignment-row{
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:8px!important;
    padding:10px 11px!important;
    border-radius:14px!important;
  }
  .comp-assignment-row button{
    width:auto!important;
    min-height:44px!important;
    padding:8px 10px!important;
  }
  .comp-assignment-row>div{
    min-width:0!important;
  }
  .comp-assignment-row small{
    line-height:1.25!important;
    overflow-wrap:anywhere;
  }
}

/* QA VISUAL AUDIT v7.0 — compensation modal mobile gutters */
@media(max-width:760px){
  .comp-scheme-modal .comp-scheme-editor.advanced{
    width:100%!important;
    max-width:calc(100vw - 24px)!important;
  }
}

/* QA VISUAL AUDIT v7.1 — appointment card mobile actions */
@media(max-width:760px){
  .appointment-card .visit-status-tabs button{
    min-height:44px!important;
    padding:8px 3px!important;
  }
  .appointment-card .appointment-manage-actions{
    grid-template-columns:1fr 1fr!important;
    gap:7px!important;
  }
  .appointment-card .appointment-manage-actions button{
    min-height:44px!important;
  }
  .appointment-card .appointment-manage-actions .danger-button{
    grid-column:1/-1!important;
    min-height:44px!important;
  }
}

/* QA VISUAL AUDIT v7.2 — compact appointment editor sections */
@media(max-width:760px){
  .appointment-edit-card{
    padding:14px 12px calc(16px + env(safe-area-inset-bottom))!important;
  }
  .appointment-edit-section{
    gap:6px!important;
    padding:8px 0!important;
  }
  .appointment-edit-section .field{
    margin:4px 0!important;
  }
  .appointment-edit-summary{
    padding:7px 0!important;
    gap:8px!important;
  }
}

/* QA VISUAL AUDIT v7.3 — client quick card */
@media(max-width:760px){
  .client-quick-card .compact-tag-edit{
    min-height:44px!important;
    display:inline-flex!important;
    align-items:center!important;
    padding:8px 0!important;
  }
  .client-quick-card .client-appointment-row{
    padding:8px 10px!important;
    gap:6px!important;
  }
  .client-quick-card .client-appointment-row>div:first-child{
    gap:2px!important;
  }
  .client-quick-card .client-appointment-row>div:last-child{
    gap:3px!important;
  }
}

/* QA VISUAL AUDIT v7.4 — compact multi-master appointment create */
@media(max-width:760px){
  .multi-complex-card{
    padding:12px!important;
  }
  .multi-complex-card .profile-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px 8px!important;
  }
  .multi-complex-card .profile-wide{
    grid-column:1/-1!important;
  }
  .multi-complex-card .field{
    margin:5px 0!important;
    gap:5px!important;
  }
  .multi-complex-card .multi-complex-segments{
    gap:4px!important;
    margin:8px 0!important;
  }
  .multi-complex-card .multi-complex-segment{
    padding:6px 0!important;
    gap:6px!important;
  }
  .multi-complex-card .multi-complex-segment select{
    min-height:44px!important;
  }
  .multi-complex-card .multi-complex-total{
    padding:8px 0!important;
    gap:8px!important;
  }
}

/* QA VISUAL AUDIT v7.5 — mobile booking calendar targets */
@media(max-width:760px){
  .booking-calendar-card{
    padding-left:12px!important;
    padding-right:12px!important;
  }
  .booking-date-picker-host .booking-month-head{
    grid-template-columns:44px minmax(0,1fr) 44px!important;
    gap:6px!important;
  }
  .booking-date-picker-host .booking-month-head button{
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
  }
  .booking-date-picker-host .booking-month-weekdays,
  .booking-date-picker-host .booking-month-grid{
    gap:3px!important;
  }
}
@media(max-width:760px){
  .booking-date-picker-host .booking-month-weekdays,
  .booking-date-picker-host .booking-month-grid{
    gap:2px!important;
  }
}

/* QA VISUAL AUDIT v7.6 — employee invite navigation */
@media(max-width:760px){
  #backEmployees{
    min-height:44px!important;
    display:inline-flex!important;
    align-items:center!important;
    padding:8px 0!important;
  }
}

/* QA VISUAL AUDIT v7.7 — employee profile avatar targets */
@media(max-width:760px){
  .employee-profile-hero .avatar-edit-button{
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
  }
  .employee-profile-hero .employee-avatar-actions .linklike{
    min-height:44px!important;
    display:inline-flex!important;
    align-items:center!important;
    padding:8px 4px!important;
  }
}

/* QA VISUAL AUDIT v7.8 — employee edit back target */
@media(max-width:760px){
  #backEmployeeProfile{
    min-height:44px!important;
    display:inline-flex!important;
    align-items:center!important;
    padding:8px 0!important;
  }
}

/* QA VISUAL AUDIT v7.9 — compact employee edit form */
@media(max-width:760px){
  #ownerEmployeeProfileForm .profile-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px 8px!important;
  }
  #ownerEmployeeProfileForm .profile-wide{
    grid-column:1/-1!important;
  }
  #ownerEmployeeProfileForm .field{
    margin:6px 0!important;
    gap:5px!important;
    font-size:11.5px!important;
  }
  #ownerEmployeeProfileForm .field input,
  #ownerEmployeeProfileForm .field select{
    min-height:44px!important;
  }
  #ownerEmployeeProfileForm .field textarea{
    min-height:74px!important;
  }
}

/* QA VISUAL AUDIT v8.0 — WebKit/iPhone tap-target parity */
@media(max-width:760px){
  .top-user.profile-link{
    min-height:44px!important;
  }
  .top-actions button{
    min-height:44px!important;
    min-width:44px!important;
    padding:8px 10px!important;
  }
  .schedule-nav button{
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    padding:0!important;
  }
  .appointment-card .card-history-btn,
  .appointment-card .compact-tag-edit{
    min-height:44px!important;
    display:inline-flex!important;
    align-items:center!important;
    padding:8px 0!important;
  }
  .booking-add{
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
  }
  .booking-dock-arrow,
  .booking-dock-day{
    min-height:44px!important;
  }
  .booking-dock-arrow{
    min-width:44px!important;
    width:44px!important;
  }
  .cancelled-row.schedule-appt-open{
    min-height:44px!important;
  }
}

/* QA VISUAL AUDIT v8.1 — long-content resilience in client quick card */
@media(max-width:760px){
  .client-quick-card .guide-head>div:first-child{
    min-width:0!important;
    max-width:calc(100% - 132px)!important;
  }
  .client-quick-card .guide-head h2,
  .client-quick-card .guide-head p{
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
  }
  .client-quick-card .guide-head .actions-inline{
    flex:0 0 auto!important;
    margin-left:auto!important;
  }
  .client-quick-card .guide-head .actions-inline button{
    min-height:44px!important;
  }
}
/* TABLET QA v1 — compact rail for 761–1024px */
@media(min-width:761px) and (max-width:1024px){
  .redesign-shell{
    grid-template-columns:88px minmax(0,1fr)!important;
  }
  .sidebar{
    width:88px!important;
    padding:20px 10px 16px!important;
    align-items:center;
  }
  .brand-wrap{
    padding:0 0 18px!important;
    text-align:center;
  }
  .brand{
    font-size:22px!important;
    letter-spacing:-.4px!important;
  }
  .brand-sub{
    display:none!important;
  }
  .nav{
    width:100%;
    gap:7px!important;
  }
  .nav button{
    width:100%;
    min-height:48px;
    padding:10px 8px!important;
    justify-content:center;
    border-radius:13px!important;
  }
  .nav button>span:last-child{
    display:none!important;
  }
  .nav-ico{
    width:28px!important;
    font-size:18px!important;
  }
  .sidebar-note{
    display:none!important;
  }
  .main{
    padding:18px 22px 30px!important;
  }
  .top{
    padding-top:6px!important;
    margin-bottom:12px!important;
  }
}/* TABLET QA v2 — KPI/profile density for 761–1024px */
@media(min-width:761px) and (max-width:1024px){
  .owner-kpi-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }
  .kpi-person-card{
    padding:14px!important;
  }

  #profileForm>section.card,
  #ownerEmployeeProfileForm>section.card{
    padding:16px!important;
    border-radius:16px!important;
  }
  #profileForm .profile-grid,
  #ownerEmployeeProfileForm .profile-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px 10px!important;
  }
  #profileForm .field,
  #ownerEmployeeProfileForm .field{
    margin:8px 0!important;
    gap:5px!important;
  }
  #profileForm .profile-wide,
  #ownerEmployeeProfileForm .profile-wide{
    grid-column:1/-1!important;
  }
  #profileForm .job-title-grid,
  #ownerEmployeeProfileForm .job-title-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:7px!important;
  }
  #profileForm .job-title-check,
  #ownerEmployeeProfileForm .job-title-check{
    min-height:44px!important;
    padding:8px 9px!important;
  }
  .profile-readiness{
    margin:8px 0!important;
    padding:11px 13px!important;
  }
}/* TABLET QA v3 — touch targets for 761–1024px */
@media(min-width:761px) and (max-width:1024px){
  .top-user.profile-link{
    min-height:44px!important;
    padding:7px 8px!important;
  }
  .top-actions button{
    min-height:44px!important;
    min-width:44px!important;
    padding:8px 10px!important;
  }

  .secondary.compact,
  .primary.compact,
  .employee-card-foot .secondary,
  .toggle-user,
  .edit-lead,
  .kpi-visits-btn,
  .kpi-partial-btn{
    min-height:44px!important;
  }

  .client-filter-tabs button,
  .filter-pills button,
  .mobile-filter-bar button{
    min-height:44px!important;
    padding-top:8px!important;
    padding-bottom:8px!important;
  }
  .mobile-filter-bar input,
  .mobile-filter-bar select{
    min-height:44px!important;
  }

  .schedule-nav button{
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    padding:0!important;
  }
  .schedule-month-template,
  .schedule-absence{
    min-height:44px!important;
    display:inline-flex!important;
    align-items:center!important;
    padding-top:7px!important;
    padding-bottom:7px!important;
  }

  details>summary{
    min-height:44px!important;
    display:flex!important;
    align-items:center!important;
  }
  .mobile-finance-back{
    min-height:44px!important;
    display:inline-flex!important;
    align-items:center!important;
    padding:8px 0!important;
  }

  .booking-today,
  #newComplexAppointment{
    min-height:44px!important;
  }
  .cancelled-bookings>summary,
  .cancelled-row.schedule-appt-open{
    min-height:44px!important;
  }
  .booking-dock-arrow,
  .booking-dock-day{
    min-height:44px!important;
  }
  .booking-dock-arrow{
    width:44px!important;
    min-width:44px!important;
  }

  .hero-guide{
    min-height:44px!important;
  }
}/* TABLET QA v3.1 — remaining touch-target exceptions */
@media(min-width:761px) and (max-width:1024px){
  .period-switch button,
  #refreshAudit,
  #ownerSleepingBtn,
  #sleepingBtn{
    min-height:44px!important;
  }
  .filter-pills button{
    min-width:44px!important;
  }
}/* TABLET QA v4 — employee cards: 2-column tablet layout */
@media(min-width:761px) and (max-width:1024px){
  .employee-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }
  .employee-card{
    min-height:0!important;
    padding:14px!important;
  }
  .employee-card-head{
    gap:10px!important;
  }
  .employee-card .employee-avatar{
    width:44px!important;
    height:44px!important;
    flex:0 0 44px!important;
  }
  .employee-email{
    margin:9px 0!important;
  }
  .employee-card-foot{
    padding-top:8px!important;
    gap:8px!important;
  }
}/* TABLET QA v5 — finance tablet composition */
@media(min-width:761px) and (max-width:1024px){
  .finance-analytics-toolbar{
    padding:16px!important;
  }
  .finance-management-meta.card{
    padding:14px!important;
    gap:7px!important;
  }
  .finance-management-meta>div{
    min-height:60px!important;
    padding:9px 10px!important;
  }
  .finance-management-breakdowns{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }
  .finance-management-breakdowns>.card{
    padding:14px!important;
  }
  .finance-management-breakdowns>.card:nth-child(3){
    grid-column:1/-1;
  }
}/* TABLET QA v5.1 — labeled compact navigation rail */
@media(min-width:761px) and (max-width:1024px){
  .redesign-shell{
    grid-template-columns:94px minmax(0,1fr)!important;
  }
  .sidebar{
    width:94px!important;
    padding-left:9px!important;
    padding-right:9px!important;
  }
  .nav button{
    min-height:58px!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    justify-items:center!important;
    align-content:center!important;
    gap:4px!important;
    padding:7px 5px!important;
    text-align:center!important;
  }
  .nav button>span:last-child{
    display:block!important;
    max-width:74px;
    font-size:9.5px!important;
    line-height:1.08!important;
    font-weight:650;
    white-space:normal;
    overflow-wrap:anywhere;
  }
  .nav-ico{
    width:auto!important;
    line-height:1!important;
  }
}/* TABLET QA v6 — client grid candidate */
@media(min-width:761px) and (max-width:1024px){
  #clientsList .mobile-list{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
  }
  #clientsList .mobile-list-row{
    min-height:72px!important;
    padding:10px 11px!important;
    gap:9px!important;
  }
}/* TABLET QA v7 — nested cards and modal touch targets */
@media(min-width:761px) and (max-width:1024px){
  .guide-close{
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    flex:0 0 44px!important;
  }

  .appointment-card .card-history-btn,
  .appointment-card .compact-tag-edit,
  .client-quick-card .compact-tag-edit,
  .appointment-card .remove-visit-item,
  .appointment-card .visit-add-service{
    min-height:44px!important;
    display:inline-flex!important;
    align-items:center!important;
    padding:8px 0!important;
  }

  .appointment-card .visit-status-tabs button{
    min-height:44px!important;
    padding:8px 6px!important;
  }

  .appointment-card .appointment-manage-actions button,
  .appointment-card .pay-buttons button,
  .appointment-card #completeVisit{
    min-height:44px!important;
  }

  .booking-calendar-card .booking-month-head button{
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
  }

  .client-quick-card .guide-head>div:first-child{
    min-width:0!important;
  }
}/* TABLET QA v7.1 — final visit action target */
@media(min-width:761px) and (max-width:1024px){
  #addVisitService{
    min-height:44px!important;
    display:inline-flex!important;
    align-items:center!important;
    padding:8px 0!important;
  }
}/* TABLET QA v8 — settings/service density */
@media(min-width:761px) and (max-width:1024px){
  .service-catalog-category,
  .complex-card,
  .access-note,
  .access-card,
  .comp-scheme-card,
  .comp-assignment-row{
    padding:14px!important;
    border-radius:15px!important;
  }

  .service-catalog-category{
    gap:8px!important;
  }

  .complex-card{
    gap:8px!important;
  }
  .complex-card p{
    min-height:0!important;
  }
  .complex-card .summary-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    margin-top:10px!important;
  }
  .complex-card .summary-grid>div{
    padding:10px!important;
  }

  .access-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }
  .access-card{
    gap:8px!important;
  }
  .permission-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:6px!important;
  }
  .permission-check{
    min-height:44px!important;
    padding:7px 8px!important;
    border:1px solid var(--line)!important;
    border-radius:10px!important;
    background:#fbf9f6!important;
  }

  .comp-scheme-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }
  .comp-scheme-card{
    gap:8px!important;
  }
  .comp-scheme-actions{
    gap:6px!important;
    margin-top:7px!important;
    padding-top:7px!important;
  }
  .comp-scheme-actions button{
    min-height:44px!important;
  }
  .comp-assignment-row{
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:10px!important;
    align-items:center!important;
  }
  .comp-assignment-row button{
    min-height:44px!important;
    width:auto!important;
  }
}/* TABLET QA v9 — service/complex editor tablet layout */
@media(min-width:761px) and (max-width:1024px){
  #serviceEditorForm>section.card,
  #complexForm>section.card{
    padding:14px!important;
    border-radius:15px!important;
  }

  #serviceEditorForm .profile-grid,
  #complexForm .profile-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px 10px!important;
  }
  #serviceEditorForm .profile-wide,
  #complexForm .profile-wide{
    grid-column:1/-1!important;
  }

  #complexForm .complex-service-config{
    grid-template-columns:22px minmax(0,1fr) 145px!important;
    gap:9px!important;
    align-items:center!important;
    padding:7px 0!important;
  }
  #complexForm .complex-surcharge{
    grid-column:auto!important;
    gap:3px!important;
  }
  #complexForm .complex-surcharge input{
    min-height:44px!important;
    width:100%!important;
  }

  #serviceEditorForm .service-resource-req{
    grid-template-columns:22px minmax(0,1fr) 96px!important;
    gap:9px!important;
    padding:8px 0!important;
  }
}/* TABLET QA v10 — nested form controls and onboarding targets */
@media(min-width:761px) and (max-width:1024px){
  .generic-form-modal input:not([type="checkbox"]):not([type="radio"]),
  .generic-form-modal select,
  .generic-form-modal textarea,
  .generic-form-modal button,
  .multi-complex-card input:not([type="checkbox"]):not([type="radio"]),
  .multi-complex-card select,
  .multi-complex-card textarea,
  .multi-complex-card button,
  .comp-scheme-modal input:not([type="checkbox"]):not([type="radio"]),
  .comp-scheme-modal select,
  .comp-scheme-modal textarea,
  .comp-scheme-modal button{
    min-height:44px!important;
  }

  #backEmployees,
  #backEmployeeProfile,
  #backServicesFromEditor,
  #backComplexEdit,
  #backSvcCats,
  #backComplexes{
    min-height:44px!important;
    display:inline-flex!important;
    align-items:center!important;
    padding-top:8px!important;
    padding-bottom:8px!important;
  }
}/* TABLET QA v10.1 — employee avatar actions */
@media(min-width:761px) and (max-width:1024px){
  .employee-profile-hero .avatar-edit-button{
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
  }
  .employee-profile-hero .employee-avatar-actions .linklike{
    min-height:44px!important;
    display:inline-flex!important;
    align-items:center!important;
    padding:8px 4px!important;
  }
}/* TABLET QA v10.2 — final nested back/photo targets */
@media(min-width:761px) and (max-width:1024px){
  #backTagManager,
  #backPayrollSchemes,
  #backServiceCatalog,
  #backPaymentMethods,
  #backAccessControl,
  #backMore{
    min-height:44px!important;
    display:inline-flex!important;
    align-items:center!important;
    padding-top:8px!important;
    padding-bottom:8px!important;
  }
  #svcCoverChoose{
    min-height:44px!important;
  }
}/* DESKTOP QA v1 — use available client list width */
@media(min-width:1025px){
  #clientsList{
    max-width:none!important;
  }
  #clientsList .mobile-list{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:10px!important;
  }
  #clientsList .mobile-list-row{
    min-height:72px!important;
    padding:11px 12px!important;
  }
}
@media(min-width:1360px){
  #clientsList .mobile-list{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
}/* DESKTOP QA v2 — profile/job-title density */
@media(min-width:1025px){
  #profileForm>section.card,
  #ownerEmployeeProfileForm>section.card{
    padding:18px!important;
  }
  #profileForm .job-title-grid,
  #ownerEmployeeProfileForm .job-title-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:8px!important;
  }
  #profileForm .job-title-check,
  #ownerEmployeeProfileForm .job-title-check{
    min-height:44px!important;
    padding:8px 10px!important;
  }
}/* DESKTOP QA v3 — employee grid by desktop width */
@media(min-width:1025px) and (max-width:1359px){
  .employee-card-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:12px!important;
  }
}
@media(min-width:1360px){
  .employee-card-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
}/* DESKTOP QA v4 — owner KPI uses desktop width */
@media(min-width:1025px){
  .owner-kpi-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:12px!important;
  }
}/* DESKTOP QA v5 — schedule fits desktop workspace */
@media(min-width:1025px){
  .work-schedule-head,
  .work-schedule-row{
    grid-template-columns:180px repeat(7,minmax(108px,1fr))!important;
    min-width:0!important;
    width:100%!important;
  }
  .work-schedule-employee{
    min-width:0!important;
  }
}/* DESKTOP QA v6 — nested text-action hit areas */
@media(min-width:1025px){
  .appointment-card .card-history-btn,
  .appointment-card .compact-tag-edit,
  .appointment-card .remove-visit-item,
  .appointment-card #addVisitService,
  .client-quick-card .compact-tag-edit{
    min-height:32px!important;
    display:inline-flex!important;
    align-items:center!important;
    padding:5px 0!important;
  }
}/* DESKTOP QA v7 — access and complex editor composition */
@media(min-width:1025px){
  .permission-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
  }
  .permission-check{
    min-height:36px!important;
    padding:6px 8px!important;
    border:1px solid var(--line)!important;
    border-radius:9px!important;
    background:#fbf9f6!important;
  }
  #complexForm .complex-service-config{
    grid-template-columns:22px minmax(0,1fr) 170px!important;
    gap:10px!important;
    align-items:center!important;
    padding:8px 0!important;
  }
  #complexForm .complex-surcharge{
    grid-column:auto!important;
  }
}
#backYclients{
  min-height:44px;
  display:inline-flex;
  align-items:center;
  padding:8px 4px;
}

/* Visible upload controls need a usable touch target; hidden avatar/cover inputs stay hidden. */
input[type="file"]:not([hidden]){
  min-height:36px;
  padding:6px 0;
}

/* CRM v4 navigation shell: role dashboard first, journal calendar in desktop rail. */
@media(min-width:1025px){
  .redesign-shell{grid-template-columns:292px minmax(0,1fr)!important}
  .sidebar{width:292px!important;padding:26px 18px 20px!important}
  .sidebar-calendar{margin:18px 0 16px;padding-top:16px;border-top:1px solid rgba(203,191,180,.72)}
  .sidebar-calendar[hidden]{display:none!important}
  .sidebar-calendar>div{background:rgba(255,255,255,.64);border:1px solid rgba(222,211,201,.92);border-radius:16px;padding:12px}
  .sidebar-calendar .booking-month-day{min-height:45px!important;padding:4px 2px 5px!important}
  .sidebar-calendar .booking-month-head{margin-bottom:9px!important}
  .sidebar-calendar .booking-load-legend{margin-top:9px!important;padding-top:8px!important}
  .booking-desktop-layout{display:block!important}
  .booking-month-panel{display:none!important}
  .top{display:flex!important;justify-content:flex-end!important}
  .mobile-right-stack{margin-left:auto!important;width:auto!important;display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:12px!important}
  .top-user.profile-link{margin-left:auto!important;text-align:right!important;justify-content:flex-end!important}
}
@media(min-width:761px) and (max-width:1024px){
  .top{display:flex!important;justify-content:flex-end!important}
  .mobile-right-stack{margin-left:auto!important;width:auto!important;display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:8px!important}
  .top-user.profile-link{margin-left:auto!important;text-align:right!important;justify-content:flex-end!important;max-width:52vw!important}
}

/* CRM v4 owner dashboard */
.owner-today-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:14px}
.owner-today-card{border:1px solid var(--line);background:rgba(255,255,255,.82);border-radius:16px;padding:15px 16px;text-align:left;display:grid;gap:5px;color:inherit;box-shadow:0 10px 28px rgba(63,49,38,.05)}
.owner-today-card small,.owner-today-card span{color:var(--muted)}
.owner-today-card strong{font-size:26px;line-height:1}
.owner-today-card span{font-size:11px}
.owner-dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:14px}
.owner-priority-grid{grid-template-columns:1.05fr .95fr}
.owner-count-badge{min-width:28px;height:28px;padding:0 8px;border-radius:999px;background:#f0e7df;display:grid;place-items:center;font-weight:800;font-size:12px}
.owner-salon-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:8px 0 12px}
.owner-salon-stats>div{background:#faf6f2;border-radius:12px;padding:11px;display:grid;gap:3px}
.owner-salon-stats strong{font-size:21px}
.owner-salon-stats small{color:var(--muted);font-size:10px}
.owner-staff-chips{display:flex;gap:8px;overflow:auto;padding-bottom:2px}
.owner-staff-chips>span{min-width:104px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px;display:grid;grid-template-columns:26px 1fr;gap:1px 7px;align-items:center}
.owner-staff-chips b{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.owner-staff-chips small{grid-column:2;color:var(--muted);font-size:9px}
.owner-chip-avatar{width:26px;height:26px;font-size:10px;grid-row:1/3}
.owner-month-head{display:flex;justify-content:space-between;align-items:end;margin:18px 2px 10px}
.owner-month-head h2{margin:3px 0 0;font-size:22px}
.owner-month-metrics{margin-bottom:14px}
.owner-team-row{width:100%;border:0;border-bottom:1px solid #eee5dc;background:transparent;display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 0;text-align:left;color:inherit}
.owner-team-row:last-child{border-bottom:0}
.owner-team-main,.owner-team-kpi{display:grid;gap:2px}
.owner-team-main small,.owner-team-kpi small{color:var(--muted);font-size:10px}
.owner-team-kpi{text-align:right}
.owner-rank-row,.owner-service-row,.owner-finance-lines>div{display:grid;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid #eee5dc}
.owner-rank-row{grid-template-columns:22px minmax(0,1fr) auto}
.owner-service-row,.owner-finance-lines>div{grid-template-columns:minmax(0,1fr) auto}
.owner-rank-row:last-child,.owner-service-row:last-child,.owner-finance-lines>div:last-child{border-bottom:0}
.owner-rank-row>span,.owner-service-row>span{display:grid;gap:2px}
.owner-rank-row small,.owner-service-row small,.owner-finance-lines span{color:var(--muted);font-size:10px}
.owner-my-day{margin-bottom:14px}
.owner-my-day-grid{display:grid;grid-template-columns:150px 180px minmax(0,1fr);gap:10px}
.owner-my-day-grid>div{background:#faf6f2;border-radius:12px;padding:12px;display:grid;gap:4px}
.owner-my-day-grid small,.owner-my-day-grid span{color:var(--muted)}
.owner-my-day-grid strong{font-size:18px}
.owner-my-next strong{font-size:15px}
@media(max-width:1100px){
  .owner-today-strip{grid-template-columns:repeat(2,1fr)}
  .owner-dashboard-grid,.owner-priority-grid{grid-template-columns:1fr}
  .owner-my-day-grid{grid-template-columns:1fr 1fr}
  .owner-my-next{grid-column:1/-1}
}
@media(max-width:760px){
  .owner-today-strip{grid-template-columns:repeat(2,1fr);gap:8px}
  .owner-today-card{padding:12px}
  .owner-today-card strong{font-size:22px}
  .owner-salon-stats{grid-template-columns:repeat(3,1fr)}
  .owner-month-head h2{font-size:19px}
  .owner-my-day-grid{grid-template-columns:1fr}
  .owner-my-next{grid-column:auto}
}

/* CRM v4 admin dashboard and master day */
.admin-shift-hero{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:12px;padding:17px 18px}
.admin-shift-hero h2{margin:3px 0 4px;font-size:22px}
.admin-shift-hero p{margin:0}
.admin-today-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-bottom:12px}
.admin-today-strip>button{border:1px solid var(--line);background:#fff;border-radius:14px;padding:12px 13px;text-align:left;color:inherit;display:grid;gap:3px}
.admin-today-strip small,.admin-today-strip span{color:var(--muted)}
.admin-today-strip strong{font-size:22px}
.admin-today-strip span{font-size:10px}
.admin-dashboard-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.admin-action-row{width:100%;border:0;border-bottom:1px solid #eee5dc;background:transparent;display:grid;grid-template-columns:34px minmax(0,1fr) 14px;gap:10px;align-items:center;text-align:left;padding:10px 0;color:inherit}
.admin-action-row:last-child{border-bottom:0}
.admin-action-row>b{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;font-size:12px;background:#f3e7dd;color:#845e45}
.admin-action-row>b.high{background:#f4dfdc;color:#9c4b43}
.admin-action-row>b.medium{background:#f5ead8;color:#8b672b}
.admin-action-row>span{display:grid;gap:2px}
.admin-action-row small{color:var(--muted);font-size:10px}
.admin-action-row em{font-style:normal;font-size:20px;color:var(--muted)}
.admin-all-clear{display:flex;align-items:center;gap:10px;padding:14px 4px}
.admin-all-clear>span{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#e5f0e6;color:#4f7656}
.admin-all-clear>div{display:grid;gap:3px}.admin-all-clear small{color:var(--muted)}
.admin-appointment-row{width:100%;border:0;border-bottom:1px solid #eee5dc;background:transparent;display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:10px;align-items:center;text-align:left;padding:9px 0;color:inherit}
.admin-appointment-row:last-child{border-bottom:0}
.admin-appointment-row time{font-weight:750}
.admin-appointment-row>span{display:grid;gap:2px}
.admin-appointment-row small{color:var(--muted);font-size:10px}
.admin-appointment-row em{font-style:normal;font-size:9px;padding:5px 7px;border-radius:999px;background:#f0ece8}
.admin-appointment-row em.completed{background:#e5f0e6;color:#4f7656}.admin-appointment-row em.arrived{background:#e8edf3;color:#526a82}
.admin-kpi-note{margin-top:10px;padding:10px 11px;border-radius:10px;background:#faf6f2;color:var(--muted);font-size:11px;line-height:1.4}
.master-focus-card{margin-bottom:12px}
.master-focus-main{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}
.master-focus-main h2{margin:3px 0 4px;font-size:24px}
.master-focus-main p{margin:0}
.master-next-client{margin:13px 0;padding:13px 14px;border-radius:13px;background:#faf6f2;display:grid;gap:3px}
.master-next-client small,.master-next-client span{color:var(--muted)}
.master-next-client strong{font-size:19px}
.master-timeline-card{margin-bottom:12px}
.master-day-timeline{display:grid}
.master-day-row{display:grid;grid-template-columns:58px minmax(0,1fr) auto;gap:10px;align-items:center;padding:11px 0;border-bottom:1px solid #eee5dc}
.master-day-row:last-child{border-bottom:0}
.master-day-row time{font-weight:750}
.master-day-row>div{display:grid;gap:2px}.master-day-row span,.master-day-row small{color:var(--muted)}
.master-day-row.done{opacity:.62}.master-day-row.current{background:#faf8f5;margin:0 -8px;padding-left:8px;padding-right:8px;border-radius:10px}
@media(max-width:980px){
  .admin-dashboard-grid{grid-template-columns:1fr}
}
@media(max-width:760px){
  .admin-shift-hero{align-items:flex-start;flex-direction:column}
  .admin-shift-hero .primary{width:100%}
  .admin-today-strip{grid-template-columns:repeat(2,1fr)}
  .admin-dashboard-grid{gap:9px}
  .admin-appointment-row{grid-template-columns:46px minmax(0,1fr) auto}
  .master-focus-main{display:grid}
  .master-day-row{grid-template-columns:48px minmax(0,1fr) auto}
}

/* CRM v4 visual polish: dashboard text links need a real click target. */
#dashboardBody .linklike{
  min-height:32px;
  padding:5px 3px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
@media(max-width:760px){
  #dashboardBody .linklike{min-height:36px;padding:7px 4px}
}

/* CRM v4 journal polish: match the 10px narrow-mobile main gutter exactly. */
@media(max-width:390px){
  .booking-workspace-head{
    margin-left:-10px!important;
    margin-right:-10px!important;
    padding-left:10px!important;
    padding-right:10px!important;
  }
}

/* CRM v4 journal/schedule UX pass. */
.compact-journal .journal-now-line{
  position:absolute;
  left:0;
  right:0;
  z-index:3;
  border-top:2px solid #a98d76!important;
  pointer-events:none;
  opacity:.9;
}
.compact-journal .journal-now-line:before{
  content:"";
  position:absolute;
  left:-4px;
  top:-4px;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#a98d76;
}

.work-schedule-head>div.today{
  background:#eee7df;
  color:#5c4e43;
}
.work-schedule-cell.today{
  box-shadow:inset 2px 0 0 #c9b5a4,inset -2px 0 0 #c9b5a4;
}
.work-schedule-cell.today.working{
  background:#e8ece8;
}

@media(min-width:761px) and (max-width:1024px){
  .work-schedule-head,.work-schedule-row{
    grid-template-columns:156px repeat(7,112px);
    min-width:940px;
  }
  .work-schedule-employee{padding:8px}
}
@media(max-width:760px){
  .work-schedule-head,.work-schedule-row{
    grid-template-columns:142px repeat(7,108px);
    min-width:898px;
  }
  .work-schedule-employee{padding:8px}
  .work-schedule-cell{padding:9px 5px}
}

/* CRM v4 journal: compact duty-admin presence without consuming a booking column. */
.journal-duty-admins{
  display:flex;
  align-items:center;
  gap:12px;
  min-height:46px;
  margin:0 0 9px;
  padding:7px 10px;
  border:1px solid var(--line);
  border-radius:13px;
  background:rgba(250,248,245,.92);
}
.journal-duty-label{
  flex:0 0 auto;
  font-size:10px;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--muted);
}
.journal-duty-list{
  display:flex;
  gap:8px;
  min-width:0;
  overflow:auto;
}
.journal-duty-person{
  display:grid;
  grid-template-columns:28px minmax(0,1fr) auto;
  align-items:center;
  gap:7px;
  min-width:220px;
  padding:4px 7px;
  border-radius:10px;
  background:#fff;
  border:1px solid #eee5dd;
}
.journal-duty-person>span{
  display:grid;
  gap:1px;
  min-width:0;
}
.journal-duty-person strong{
  font-size:11px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.journal-duty-person small{
  font-size:9px;
  color:var(--muted);
  white-space:nowrap;
}
.journal-duty-person em{
  display:flex;
  align-items:center;
  gap:4px;
  font-size:9px;
  font-style:normal;
  color:#6f7f70;
  white-space:nowrap;
}
.journal-duty-person em i{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#8ea18f;
}
.journal-duty-avatar{
  width:28px;
  height:28px;
  font-size:10px;
}
.journal-duty-empty{
  font-size:11px;
  color:var(--muted);
}
@media(max-width:760px){
  .journal-duty-admins{
    align-items:flex-start;
    flex-direction:column;
    gap:6px;
    padding:8px;
  }
  .journal-duty-list{
    width:100%;
  }
  .journal-duty-person{
    min-width:205px;
  }
}

/* CRM v4 journal duty admin: compact one-line presence. */
.journal-duty-admins{
  min-height:40px;
  padding:5px 8px;
}
.journal-duty-person{
  grid-template-columns:26px minmax(0,1fr);
  min-width:175px;
  padding:4px 6px;
}
.journal-duty-avatar{
  width:26px;
  height:26px;
}
.journal-duty-label,
.journal-duty-person>em{
  display:none!important;
}
@media(max-width:760px){
  .journal-duty-admins{
    display:block;
    padding:5px 6px;
  }
  .journal-duty-person{
    min-width:170px;
  }
}

/* CRM v4 appointment card: common actions belong next to appointment details. */
.appointment-card .appointment-manage-primary{
  margin:0;
  padding:12px 0 4px;
  border-top:0;
  border-bottom:1px solid var(--line);
  grid-template-columns:1fr 1fr auto;
}
.appointment-card .appointment-manage-primary .danger-button{
  min-width:92px;
  background:transparent;
  color:#9b4e48;
  border:1px solid #e3c8c4;
}
.visit-status-tabs{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
@media(max-width:520px){
  .appointment-card .appointment-manage-primary{
    grid-template-columns:1fr 1fr;
  }
  .appointment-card .appointment-manage-primary .danger-button{
    grid-column:1/-1;
    min-height:38px;
  }
  .visit-status-tabs button{
    min-width:0;
    white-space:nowrap;
  }
}

/* CRM v4 appointment creation: existing-client first. */
.appointment-client-picker-card{
  width:min(520px,100%);
}
.client-picker-search{
  width:100%;
  border:1px solid var(--line);
  border-radius:12px;
  padding:12px 13px;
  margin:8px 0 10px;
}
.appointment-client-results{
  max-height:300px;
  overflow:auto;
  display:grid;
  gap:6px;
  margin-bottom:10px;
}
.appointment-client-result{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  width:100%;
  padding:10px 11px;
  border:1px solid var(--line);
  border-radius:11px;
  background:#fff;
  text-align:left;
}
.appointment-client-result>span{
  display:grid;
  gap:3px;
  min-width:0;
}
.appointment-client-result small{
  color:var(--muted);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.appointment-client-result em{
  font-size:10px;
  font-style:normal;
  color:var(--muted);
}
.appointment-client-empty{
  display:grid;
  gap:3px;
  padding:16px 8px;
  text-align:center;
  color:var(--muted);
}
.appointment-client-empty small{font-size:10px}
.appointment-selected-client{
  margin:10px 0 12px;
  padding:11px 12px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#faf7f4;
}
.appointment-selected-client>span{
  display:grid;
  gap:2px;
}
.appointment-selected-client small,
.appointment-selected-client em{
  color:var(--muted);
  font-style:normal;
}
.appointment-selected-client strong{font-size:15px}
.appointment-new-client-fields{margin-top:8px}
@media(max-width:760px){
  .appointment-client-picker-card{
    width:100%;
    border-radius:20px 20px 0 0;
  }
  .appointment-client-result{
    min-height:52px;
  }
}

/* CRM v4: clearer multi-master booking flow. */
.multi-complex-picker-card{width:min(620px,100%)}
.multi-complex-picker-list{display:grid;gap:8px;margin-top:12px}
.multi-complex-picker-item{
  width:100%;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:14px;
  align-items:center;
  padding:13px 14px;
  border:1px solid var(--line);
  border-radius:13px;
  background:#fff;
  text-align:left;
  color:inherit;
}
.multi-complex-picker-item:hover{background:#faf7f4;border-color:#d7c9bd}
.multi-complex-picker-item>span{display:grid;gap:4px;min-width:0}
.multi-complex-picker-item small{color:var(--muted);line-height:1.3}
.multi-complex-picker-item em{font-style:normal;font-weight:800;white-space:nowrap}
.multi-complex-service-name,.multi-complex-master-control{display:grid;gap:4px;min-width:0}
.multi-complex-master-control select{width:100%}
.multi-complex-master-control small{color:var(--muted);font-size:10px}
.multi-complex-assignment-note{
  margin:8px 0 2px;
  padding:8px 10px;
  border-radius:9px;
  background:#faf7f4;
  color:var(--muted);
  font-size:10px;
}
.multi-complex-assignment-note.error{
  background:#fbefed;
  color:#9b4e48;
}
@media(max-width:760px){
  .multi-complex-picker-card{width:100%;border-radius:20px 20px 0 0}
  .multi-complex-picker-item{padding:12px}
  .multi-complex-segment{
    grid-template-columns:1fr!important;
    gap:7px!important;
  }
}

/* CRM v4 client card: actions first, booking directly from client context. */
.client-quick-actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin:2px 0 12px;
}
.client-sleeping-badge{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:6px 10px;
  border-radius:10px;
  background:#fbefed;
  color:#98534b;
  font-size:11px;
  font-weight:750;
}
.client-quick-card .client-context-grid{
  margin-top:10px;
}
@media(max-width:520px){
  .client-quick-actions .primary,
  .client-quick-actions .secondary{
    flex:1 1 auto;
    justify-content:center;
  }
  .client-sleeping-badge{
    width:100%;
    justify-content:center;
  }
}

/* CRM v4 client context: future appointment and history are separate workflows. */
.client-next-section{
  margin:12px 0;
  padding:12px;
  border:1px solid #ddd2c8;
  border-radius:14px;
  background:#faf7f4;
}
.client-next-section .card-title{margin-bottom:7px}
.client-next-row{
  background:#fff!important;
  border-radius:11px;
}
.client-future-row{
  margin-top:6px;
  background:rgba(255,255,255,.72)!important;
}
.client-history-section{
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid var(--line);
}
.sleeping-return-quick{
  border-color:#d7b8a7!important;
}
@media(max-width:520px){
  .client-next-section{
    margin-left:-4px;
    margin-right:-4px;
    padding:10px;
  }
}

/* CRM v4 KPI: distinguish lead conversion from confirmed 80% visit outcome. */
.lead-filter-tabs{
  display:flex;
  gap:5px;
  overflow:auto;
  margin:0 0 10px;
  padding-bottom:2px;
}
.lead-filter-tabs button{
  border:1px solid var(--line);
  background:#fff;
  border-radius:999px;
  padding:7px 10px;
  font-size:10px;
  white-space:nowrap;
  color:var(--muted);
}
.lead-filter-tabs button.active{
  background:#2f3437;
  border-color:#2f3437;
  color:#fff;
}
.lead-visit-state{
  display:inline-flex;
  width:max-content;
  max-width:100%;
  margin-top:4px;
  padding:3px 7px;
  border-radius:7px;
  font-size:9px;
  font-weight:700;
}
.lead-visit-state.pending{background:#f5ead8;color:#826228}
.lead-visit-state.done{background:#e5f0e6;color:#4f7656}
.lead-visit-state.off{background:#f4e5e2;color:#98534b}
.lead-create-booking{margin:4px 0 8px}
@media(max-width:760px){
  .lead-filter-tabs{margin-left:-2px;margin-right:-2px}
  .lead-filter-tabs button{min-height:34px}
}

/* CRM v4 owner KPI control center */
.owner-kpi-overview{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
  margin:0 0 12px;
}
.owner-kpi-overview>div,
.kpi-visit-summary>span{
  display:grid;
  gap:3px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#fff;
}
.owner-kpi-overview small,
.kpi-visit-summary small{color:var(--muted);font-size:10px}
.owner-kpi-overview strong,
.kpi-visit-summary strong{font-size:18px}
.owner-kpi-overview .needs-attention,
.kpi-visit-summary .needs-attention{
  background:#fbf2df;
  border-color:#e7cf9d;
}
.kpi-visit-summary{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:7px;
  margin:0 0 10px;
}
.kpi-visit-row.due{
  background:#fff9ef;
  border-color:#ead5aa;
}
@media(max-width:760px){
  .owner-kpi-overview,
  .kpi-visit-summary{grid-template-columns:repeat(2,1fr)}
}

/* CRM v4 shift close -> payroll workflow */
.shift-close-preview{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin:12px 0 4px;
  padding:11px 12px;
  border:1px solid #e2d8cf;
  border-radius:12px;
  background:#faf7f4;
}
.shift-close-preview>div{display:grid;gap:2px}
.shift-close-preview small,.shift-close-preview>span{color:var(--muted);font-size:10px}
.shift-close-preview strong{font-size:15px}
.shift-close-preview>span{max-width:460px;line-height:1.4}

.payroll-control-strip{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr)) minmax(170px,1.25fr);
  gap:8px;
  margin:0 0 10px;
}
.payroll-control-strip>div,
.owner-shift-overview>div{
  display:grid;
  gap:3px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#fff;
}
.payroll-control-strip small,.owner-shift-overview small{color:var(--muted);font-size:10px}
.payroll-control-strip strong,.owner-shift-overview strong{font-size:17px}
.payroll-control-strip .warn,.owner-shift-overview .warn{
  background:#fff6e6;
  border-color:#ead2a3;
}
.payroll-control-due{background:#faf7f4!important}
.payroll-shift-warning,.owner-shift-warning{
  margin:0 0 12px;
  padding:9px 11px;
  border-radius:10px;
  background:#fff6e6;
  color:#80622d;
  font-size:11px;
}
.owner-shift-overview{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin:0 0 10px;
}
@media(max-width:900px){
  .payroll-control-strip{grid-template-columns:repeat(2,1fr)}
  .payroll-control-due{grid-column:1/-1}
}
@media(max-width:760px){
  .shift-close-preview{align-items:flex-start;flex-direction:column}
  .owner-shift-overview{grid-template-columns:1fr 1fr}
  .owner-shift-overview>div:last-child{grid-column:1/-1}
}

/* CRM v4 payroll: explicit carryover and partial-payment workflow. */
.payroll-carryover{
  background:#fff7e8!important;
  border:1px solid #e8d1a5!important;
}
.payroll-carryover small{
  display:block;
  margin-top:3px;
  color:#8a6c35;
  font-size:9px;
}
.payout-balance-box{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:4px 0 12px;
  padding:11px 12px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#faf7f4;
}
.payout-balance-box>span{display:grid;gap:2px}
.payout-balance-box small{color:var(--muted);font-size:10px}
.payout-balance-box strong{font-size:18px}
@media(max-width:520px){
  .payout-balance-box{align-items:stretch;flex-direction:column}
  .payout-balance-box .secondary{width:100%;justify-content:center}
}

/* CRM v4 finance: management waterfall and cash-vs-accrual clarity. */
.finance-waterfall{
  margin-bottom:12px;
  padding:16px;
}
.finance-waterfall-grid{
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:7px;
}
.finance-waterfall-grid>div{
  min-height:84px;
  padding:11px;
  border:1px solid #eee7e0;
  border-radius:12px;
  background:#fbf9f6;
  display:grid;
  align-content:space-between;
  gap:8px;
}
.finance-waterfall-grid small{
  color:var(--muted);
  font-size:9px;
  line-height:1.25;
}
.finance-waterfall-grid strong{font-size:16px}
.finance-waterfall-grid .minus{background:#fff8f6}
.finance-waterfall-grid .result{
  background:#f2ece6;
  border-color:#d9cabe;
}
.finance-waterfall-grid .result strong{font-size:20px}
.finance-cash-note{
  display:grid;
  grid-template-columns:180px 210px minmax(0,1fr);
  gap:8px;
  align-items:center;
  margin-top:9px;
  padding-top:9px;
  border-top:1px solid var(--line);
}
.finance-cash-note>span{
  display:grid;
  gap:2px;
}
.finance-cash-note small,.finance-cash-note em{
  color:var(--muted);
  font-size:9px;
  font-style:normal;
  line-height:1.35;
}
.finance-cash-note strong{font-size:13px}
@media(max-width:1180px){
  .finance-waterfall-grid{grid-template-columns:repeat(4,1fr)}
  .finance-waterfall-grid .result{grid-column:span 2}
}
@media(max-width:760px){
  .finance-waterfall-grid{grid-template-columns:repeat(2,1fr)}
  .finance-waterfall-grid .result{grid-column:1/-1}
  .finance-cash-note{grid-template-columns:1fr 1fr}
  .finance-cash-note em{grid-column:1/-1}
}

/* CRM v4 employee profile: document readiness without fake download actions. */
.employee-profile-missing{
  display:flex;
  align-items:center;
  gap:5px;
  flex-wrap:wrap;
  margin:10px 0 4px;
  padding:8px 9px;
  border-radius:10px;
  background:#fff7e8;
}
.employee-profile-missing small{color:#80622d;font-weight:750}
.employee-profile-missing span,.employee-profile-missing em{
  padding:3px 6px;
  border-radius:7px;
  background:#fff;
  color:#7a6650;
  font-size:9px;
  font-style:normal;
}
.employee-documents-card{width:min(560px,100%)}
.employee-doc-missing{
  display:grid;
  gap:9px;
  margin:8px 0 14px;
}
.employee-doc-missing>div{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.employee-doc-missing span{
  padding:5px 8px;
  border-radius:8px;
  background:#fff4e4;
  color:#80622d;
  font-size:10px;
}
.employee-doc-ready{
  margin:8px 0 14px;
  padding:12px;
  border-radius:11px;
  background:#edf5ee;
  color:#4f7656;
  font-weight:750;
}
.employee-doc-actions{
  display:flex;
  justify-content:flex-end;
  gap:8px;
}
.profile-sensitive>summary{
  cursor:pointer;
}
@media(max-width:560px){
  .employee-doc-actions{display:grid;grid-template-columns:1fr}
  .employee-doc-actions button{width:100%;justify-content:center}
}

/* Final visual QA: finance inline action needs a real touch target. */
#financeOpsInline{
  min-height:32px;
  padding:5px 4px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

/* Public multi-master booking */
.public-auto-pair,.public-master-filter{margin:0 0 12px}
.public-multi-preferences{display:grid;gap:14px}
.public-multi-service{display:grid;gap:8px}
.public-multi-service h2{font-size:16px;margin:0}
.public-multi-service>div{display:grid;gap:7px}
.public-multi-master{display:grid;grid-template-columns:42px minmax(0,1fr);gap:10px;align-items:center;text-align:left;padding:10px 11px;border:1px solid var(--line);border-radius:13px;background:#fff;color:inherit}
.public-multi-master.active{border-color:#a98d76;background:#faf6f2}
.public-multi-master>span{display:grid;gap:2px}
.public-multi-master small{color:var(--muted)}
.public-multi-slot-list{display:grid;gap:7px}
.public-multi-slot{display:grid;grid-template-columns:58px minmax(0,1fr) auto;gap:10px;align-items:center;width:100%;padding:10px 11px;border:1px solid var(--line);border-radius:12px;background:#fff;color:inherit;text-align:left}
.public-multi-slot time{font-weight:800;font-size:16px}
.public-multi-slot>span{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 10px}
.public-multi-slot>span strong,.public-multi-slot>span small{display:block}
.public-multi-slot>span small{color:var(--muted);font-size:9px}
.public-multi-slot>b{white-space:nowrap}
.public-success-multi{display:grid;gap:8px;margin:12px 0}
.public-success-multi>div{display:flex;align-items:center;gap:10px;padding:9px;border:1px solid var(--line);border-radius:12px;background:#fff}
.public-success-multi p{display:grid;gap:2px;margin:0}.public-success-multi small{color:var(--muted)}
@media(max-width:520px){
  .public-multi-slot{grid-template-columns:48px minmax(0,1fr)}
  .public-multi-slot>b{grid-column:2}
  .public-multi-slot>span{grid-template-columns:1fr}
}


/* CRM pilot mode and same-day rebooking analytics */
.pilot-badge{
  display:inline-flex;
  width:max-content;
  margin-top:7px;
  padding:4px 8px;
  border-radius:999px;
  background:#fff1cc;
  color:#7a5a18;
  font-size:9px;
  font-weight:850;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.owner-rebooking-card{margin-bottom:14px}
.owner-rebooking-rate{font-size:26px}
.owner-rebooking-grid{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:8px;
}
.owner-rebooking-grid>div{
  display:grid;
  gap:4px;
  padding:11px;
  border-radius:12px;
  background:#faf7f4;
}
.owner-rebooking-grid small{color:var(--muted);font-size:9px}
.owner-rebooking-grid strong{font-size:19px}
.owner-rebooking-note{margin:10px 0 0;font-size:10px}
@media(max-width:980px){
  .owner-rebooking-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:560px){
  .owner-rebooking-grid{grid-template-columns:repeat(2,1fr)}
}

/* Client account email verification */
.client-verify-pending{text-align:center}
.client-verify-pending .public-success-mark{margin:8px auto 16px}
.client-verify-pending .public-screen-title{margin-bottom:16px}
.client-account-auth .notice{margin-bottom:14px;text-align:left}
