/* Reset html background immediately after CSS loads — WKWebView uses the html
   attribute color (#007AFF) for the very first frame to prevent white flash */
html{background:transparent!important}
:root {
  --bg: #0f1117;
  --surface: #1c2028;
  --surface2: #22262e;
  --border: #2a2f3a;
  --border-md: #363c4a;
  --accent: #007AFF;
  --accent-strong: #0055cc;
  --accent-light: rgba(0,122,255,.14);
  --green: #4ade80;
  --green-light: rgba(74,222,128,.14);
  --amber: #f59e0b;
  --amber-light: rgba(245,158,11,.14);
  --red: #f87171;
  --red-light: rgba(248,113,113,.14);
  --purple: #a78bfa;
  --purple-light: rgba(167,139,250,.14);
  --text: #f1f5f9;
  --muted: #8b95a8;
  --shadow-sm: 0 1px 2px rgba(0,0,0,.35), 0 1px 1px rgba(0,0,0,.2);
  --shadow-md: 0 4px 16px rgba(0,0,0,.5), 0 2px 6px rgba(0,0,0,.3);
  --font-mono: 'Roboto Mono','SF Mono',monospace;
  --r: 12px;
  /* Mobile glass chrome */
  --mob-glass-bg: rgba(11,17,32,0.92);
  --mob-glass-border: rgba(255,255,255,0.06);
}
/* Two-tone gradient background — position:fixed means it's composited once, zero scroll repaint cost */
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(155deg,#13161d 0%,#0f1117 40%,#0f1117 75%,#12151c 100%)}
[data-theme="light"] body::before{
  background:linear-gradient(155deg,#f5f8fc 0%,#edf1f7 45%,#f0f4f8 100%)}
[data-theme="light"] {
  --bg: #f0f4f8;
  --surface: #ffffff;
  --surface2: #e8edf3;
  --border: #d1d9e0;
  --border-md: #b0bcc8;
  --accent: #007AFF;
  --accent-strong: #0055cc;
  --accent-light: rgba(0,122,255,.12);
  --green: #16a34a;
  --green-light: rgba(22,163,74,.12);
  --amber: #d97706;
  --amber-light: rgba(217,119,6,.12);
  --red: #dc2626;
  --red-light: rgba(220,38,38,.12);
  --purple: #7c3aed;
  --purple-light: rgba(124,58,237,.12);
  --text: #0f172a;
  --muted: #64748b;
  --shadow-sm: 0 1px 2px rgba(0,0,0,.08), 0 1px 1px rgba(0,0,0,.05);
  --shadow-md: 0 4px 16px rgba(0,0,0,.12), 0 2px 6px rgba(0,0,0,.08);
  /* Mobile glass chrome */
  --mob-glass-bg: rgba(236,240,246,0.90);
  --mob-glass-border: rgba(0,0,0,0.07);
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:transparent;color:var(--text);font-family:'Inter','Segoe UI',system-ui,sans-serif;font-size:14px;min-height:100vh;-webkit-font-smoothing:antialiased}
html{background:var(--bg)} /* fallback so no white flash before body paints */
.desk-summary-bar{display:none}

/* NAV */
nav{background:var(--accent);border-bottom:none;box-shadow:0 2px 8px rgba(0,0,0,.18);position:sticky;top:0;z-index:100}
.nav-inner{max-width:1320px;margin:0 auto;padding:0 28px;display:flex;align-items:center;gap:0}
.nav-brand{font-weight:700;font-size:15px;padding:15px 0;margin-right:32px;white-space:nowrap;color:#fff}
.brand-my{font-weight:400;font-size:1em;letter-spacing:.01em}
.nav-tab{padding:15px 18px;cursor:pointer;color:rgba(255,255,255,.7);font-size:13px;font-weight:500;border-bottom:2px solid transparent;transition:all .15s;white-space:nowrap}
.nav-tab:hover{color:#fff}
.nav-tab.active{color:#fff;border-bottom-color:rgba(255,255,255,.9)}
.nav-spacer{flex:1}
.nav-menu-wrap{position:relative}
.nav-menu-btn{display:flex;flex-direction:column;justify-content:center;gap:4px;width:34px;height:34px;padding:6px;border:1.5px solid rgba(255,255,255,.4);border-radius:8px;background:transparent;cursor:pointer;transition:border-color .15s,background .15s}
.nav-menu-btn:hover{border-color:#fff;background:rgba(255,255,255,.15)}
.nav-menu-btn span{display:block;width:14px;height:1.5px;background:rgba(255,255,255,.8);border-radius:1px;transition:background .15s;align-self:center}
.nav-menu-btn:hover span{background:#fff}
.nav-dropdown{position:absolute;right:0;top:calc(100% + 8px);background:var(--surface);border:1px solid var(--border);border-radius:var(--r);box-shadow:0 4px 16px rgba(0,0,0,.35);min-width:180px;z-index:200;display:none;overflow:hidden}
.nav-dropdown.open{display:block}
.nav-dropdown-item{padding:10px 16px;font-size:13px;font-weight:500;color:var(--text);cursor:pointer;transition:background .1s}
.nav-dropdown-item:hover{background:var(--surface2)}
.nav-dropdown-sep{height:1px;background:var(--border);margin:4px 0}
.mob-only{display:none}
/* Settings modal */
.settings-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:300;display:none;align-items:center;justify-content:center}
.settings-overlay.open{display:flex}
.settings-modal{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:24px;width:340px;box-shadow:var(--shadow-md)}
.settings-modal h4{font-size:15px;font-weight:700;color:var(--text);margin-bottom:18px}
.settings-section-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);margin-bottom:10px}
.settings-acct-row{display:flex;align-items:center;gap:12px;background:var(--surface2);border-radius:10px;padding:10px 12px}
.settings-acct-info{flex:1;min-width:0}
.settings-acct-email{font-size:13px;font-weight:600;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.settings-acct-status{font-size:11px;color:var(--muted);margin-top:2px}
.settings-acct-btn{flex-shrink:0;padding:7px 14px;border-radius:8px;border:none;background:var(--accent);color:#000;font-size:12px;font-weight:700;cursor:pointer}
.settings-acct-signout{background:var(--surface);border:1px solid var(--border);color:var(--muted)}
.theme-options{display:flex;gap:10px;margin-bottom:20px}
.theme-card{flex:1;border:2px solid var(--border);border-radius:10px;padding:12px;cursor:pointer;transition:border-color .15s,background .15s;text-align:center}
.theme-card:hover{border-color:var(--accent)}
.theme-card.active{border-color:var(--accent);background:var(--accent-light)}
.theme-card-preview{width:100%;height:42px;border-radius:6px;margin-bottom:8px;display:flex;gap:4px;padding:6px;align-items:flex-end}
.theme-card-preview.dark-prev{background:#0a0e16;border:1px solid #232c3d}
.theme-card-preview.light-prev{background:#f0f4f8;border:1px solid #d1d9e0}
.theme-card-preview.auto-prev{background:linear-gradient(to right,#0a0e16 50%,#f0f4f8 50%);border:1px solid #888}
.theme-card-preview span{display:block;border-radius:2px;flex:1}
.theme-card-label{font-size:12px;font-weight:600;color:var(--text)}
.settings-close-row{display:flex;justify-content:flex-end;margin-top:6px}
.settings-close-btn{background:var(--accent-strong);color:#fff;border:none;border-radius:8px;padding:8px 20px;font-size:13px;font-weight:600;cursor:pointer}
.settings-close-btn:hover{opacity:.88}
.nav-user{font-size:13px;font-weight:600;color:var(--muted);padding-right:14px;white-space:nowrap}
.profile-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:300;display:none;align-items:center;justify-content:center}
.profile-overlay.open{display:flex}
.profile-modal{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:28px;width:420px;box-shadow:var(--shadow-md);max-height:90vh;overflow-y:auto}
.profile-modal h4{font-size:15px;font-weight:700;color:var(--text);margin-bottom:22px}
.profile-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}
.profile-field{display:flex;flex-direction:column;gap:5px}
.profile-field.full{grid-column:1/-1}
.profile-field label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}
.profile-field input,.profile-field select{background:var(--surface2);border:1px solid var(--border);border-radius:8px;padding:8px 12px;color:var(--text);font-size:13px;font-family:inherit;outline:none;transition:border-color .15s;width:100%}
.profile-field input:focus,.profile-field select:focus{border-color:var(--accent)}
.profile-pw-wrap{position:relative}
.profile-pw-wrap input{padding-right:36px}
.profile-pw-toggle{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--muted);cursor:pointer;font-size:13px;padding:0;line-height:1}
.profile-pw-toggle:hover{color:var(--accent)}
.profile-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px;padding-top:16px;border-top:1px solid var(--border)}
.profile-cancel-btn{background:transparent;border:1.5px solid var(--border);border-radius:8px;padding:8px 18px;font-size:13px;font-weight:600;color:var(--muted);cursor:pointer;font-family:inherit}
.profile-cancel-btn:hover{border-color:var(--muted);color:var(--text)}
.profile-save-btn{background:var(--accent-strong);color:#fff;border:none;border-radius:8px;padding:8px 22px;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit}
.profile-save-btn:hover{opacity:.88}

/* PAGES */
.page{display:none;padding:28px;max-width:1320px;margin:0 auto;contain:layout style paint}
.page.active{display:block}

/* HOME PAGE */
.home-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.home-greeting{font-size:20px;font-weight:800;color:var(--text);letter-spacing:-.3px}
.home-sub{font-size:12px;color:var(--muted);font-weight:500;margin-top:2px}
.home-header-actions{display:flex;gap:8px;align-items:center}
.home-nav-btn{padding:7px 14px;border-radius:8px;border:1.5px solid var(--border);background:var(--surface);color:var(--text);font-size:12px;font-weight:600;cursor:pointer;transition:all .15s}
.home-nav-btn:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-light)}
/* ── Hero banner ── */
.home-hero{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:24px 32px;margin-bottom:18px;box-shadow:var(--shadow-md);position:relative;overflow:hidden;display:block}
.home-hero::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--accent) 0%,var(--green) 55%,transparent 100%)}
/* band: eyebrow label + year progress bar */
.home-hero-band{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.home-hero-eyebrow{font-size:10px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);font-weight:700}
/* trio: 3 equal stat columns */
.home-hero-trio{display:flex;border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:18px 0;margin-bottom:14px}
.home-hero-tstat{flex:1;padding:0 28px;border-right:1px solid var(--border)}
.home-hero-tstat:first-child{padding-left:0}
.home-hero-tstat:last-child{border-right:none}
.home-hero-value{font-size:44px;font-weight:800;letter-spacing:-1.5px;line-height:1;margin-bottom:2px}
.home-hero-value.hs-green{color:var(--green)}
.home-hero-value.hs-accent{color:var(--accent)}
/* footer info row */
.home-hero-footer{display:flex;align-items:center;justify-content:space-between;gap:16px}
.home-hero-desc{font-size:11px;color:var(--muted)}
.home-hero-info{display:flex;gap:20px;font-size:11px;color:var(--muted)}
.home-hero-info strong{font-weight:700;color:var(--text)}
/* year progress */
.home-year-wrap{display:flex;align-items:center;gap:10px}
.home-year-track{width:110px;height:3px;background:var(--border);border-radius:2px;overflow:hidden}
.home-year-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--green));border-radius:2px;transition:width .6s ease}
.home-year-label{font-size:10px;color:var(--muted);font-weight:600;white-space:nowrap}
/* legacy right-panel classes kept so any other references don't break */
.home-hero-left{flex:1;min-width:0}
.home-hero-right{display:flex;flex-shrink:0}
.home-hero-stat{padding:0 28px;text-align:center;border-right:1px solid var(--border)}
.home-hero-stat:last-child{border-right:none;padding-right:0}
.hhs-label{font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);font-weight:700;margin-bottom:6px;white-space:nowrap}
.hhs-value{font-size:22px;font-weight:800;letter-spacing:-.5px;color:var(--text)}
.hhs-value.hs-accent{color:var(--accent)}
.hhs-sub{font-size:10px;color:var(--muted);margin-top:3px}
/* ── Charts ── */
.home-charts-row{display:grid;grid-template-columns:1fr 1.7fr;gap:16px;margin-bottom:16px}
.home-charts-bottom{display:grid;grid-template-columns:1fr;gap:16px;margin-bottom:16px}
.home-chart-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:18px 20px 16px;box-shadow:var(--shadow-sm)}
.home-chart-card.hcc-blue{border-top:2px solid #60a5fa}
.home-chart-card.hcc-accent{border-top:2px solid var(--accent)}
.home-chart-card.hcc-purple{border-top:2px solid #a78bfa}
.home-chart-card.hcc-amber{border-top:2px solid #fbbf24}
.home-chart-title{font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.6px;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--border)}
/* ── YTD Deductions Breakdown card ── */
.home-deduct-card{background:var(--surface);border:1px solid var(--border);border-top:2px solid #fbbf24;border-radius:var(--r);padding:18px 20px;margin-bottom:16px;box-shadow:var(--shadow-sm)}
.hdb-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--border)}
.hdb-title{font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.6px}
.hdb-grand{font-size:14px;font-weight:800;color:var(--text);letter-spacing:-.3px}
.hdb-cols{display:grid;grid-template-columns:1fr 1fr;gap:0 40px}
.hdb-section{margin-bottom:4px}
.hdb-section-hdr{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px;padding-bottom:5px;border-bottom:1px solid var(--border)}
.hdb-section-title{font-size:9px;text-transform:uppercase;letter-spacing:.6px;font-weight:700;color:var(--muted)}
.hdb-section-sub{font-size:12px;font-weight:800;color:var(--text)}
.hdb-row{display:flex;align-items:center;gap:8px;padding:4px 0}
.hdb-dot{width:7px;height:7px;border-radius:2px;flex-shrink:0}
.hdb-label{font-size:11px;color:var(--muted);min-width:108px;font-weight:500}
.hdb-bar-wrap{flex:1;height:4px;background:var(--border);border-radius:2px;overflow:hidden;min-width:40px}
.hdb-bar{height:100%;border-radius:2px;transition:width .4s ease}
.hdb-amt{font-size:12px;font-weight:700;color:var(--text);min-width:64px;text-align:right}
.hdb-pct{font-size:10px;color:var(--muted);min-width:36px;text-align:right;font-weight:600}
.hdb-empty{color:var(--muted);font-size:12px;padding:8px 0}
/* keep old donut refs to avoid errors if any survive */
.home-deduct-body,.home-deduct-donut-wrap,.home-deduct-legend{display:none}
/* ── Section divider ── */
.home-section-header{display:flex;justify-content:space-between;align-items:center;margin:22px 0 12px;padding-top:20px;border-top:1px solid var(--border)}
.home-section-header.has-toggle{cursor:pointer;-webkit-tap-highlight-color:transparent;user-select:none}
.home-expand-chevron{font-size:20px;color:var(--muted);line-height:1;transition:transform .22s;flex-shrink:0;margin-left:6px}
.home-section-header.section-collapsed .home-expand-chevron{transform:rotate(-90deg)}
.home-expandable{display:block}
.home-expandable.collapsed{display:none}
/* ── Blog inline slots ── */
.blog-slot{padding:0 16px;margin-bottom:4px}
.blog-slot:empty{display:none;margin:0}
.blog-slot-card{display:flex;align-items:center;gap:12px;background:var(--surface);border:0.5px solid var(--border);border-radius:14px;padding:12px 14px;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:opacity .15s}
.blog-slot-card:active{opacity:.7}
.blog-slot-img{width:62px;height:62px;border-radius:10px;object-fit:cover;flex-shrink:0;background:var(--surface2)}
.blog-slot-body{flex:1;min-width:0}
.blog-slot-tag{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}
.blog-slot-title{font-size:14px;font-weight:700;color:var(--text);line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.blog-slot-read{font-size:11px;color:var(--accent);margin-top:5px;font-weight:600}
.home-section-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--muted)}
.home-section-actions{display:flex;gap:8px}
/* ── Company cards ── */
.home-pc-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.home-pc-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:15px 18px 13px 20px;box-shadow:var(--shadow-sm);cursor:pointer;transition:all .2s;position:relative;overflow:hidden}
.home-pc-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;border-radius:var(--r) 0 0 var(--r);background:var(--pc-color,var(--accent))}
.home-pc-card:hover{border-color:var(--accent);transform:translateY(-1px);box-shadow:var(--shadow-md)}
.home-pc-card .hpcc-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:2px}
.home-pc-card .hpcc-company{font-size:14px;font-weight:700;color:var(--text)}
.home-pc-card .hpcc-edit{font-size:13px;color:var(--muted);cursor:pointer;padding:2px 4px;border-radius:4px;transition:all .15s;flex-shrink:0}
.home-pc-card .hpcc-edit:hover{color:var(--accent);background:var(--accent-light)}
.home-pc-card .hpcc-loc{font-size:11px;color:var(--muted);margin-bottom:10px}
.home-pc-card .hpcc-stats{display:flex;gap:18px;margin-bottom:9px}
.home-pc-card .hpcc-stat label{display:block;font-size:9px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);font-weight:700;margin-bottom:2px}
.home-pc-card .hpcc-stat .hpcc-val{font-size:16px;font-weight:800;color:var(--text)}
.home-pc-card .hpcc-stat .hpcc-val.net{color:var(--green)}
.hpcc-ratio-bar{height:3px;background:var(--border);border-radius:2px;overflow:hidden}
.hpcc-ratio-fill{height:100%;border-radius:2px}
.hpcc-ratio-label{font-size:9px;color:var(--muted);margin-top:4px;text-align:right;font-weight:600;letter-spacing:.2px}

/* ── CALCULATOR ── */
.calc-layout{display:grid;grid-template-columns:1fr 390px;gap:20px;align-items:start}
.calc-left{display:flex;flex-direction:column}
/* full-width day detail below calc-layout */
.day-detail-full{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:16px 20px 18px;margin-bottom:16px;box-shadow:var(--shadow-sm)}

.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:22px;margin-bottom:16px;box-shadow:var(--shadow-sm)}
.card h2{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.7px;color:var(--muted);margin-bottom:16px}

/* inputs */
.field-grid{display:grid;gap:10px}
.field-grid.cols2{grid-template-columns:1fr 1fr}
.field-grid.cols3{grid-template-columns:1fr 1fr 1fr}
.field{display:flex;flex-direction:column;gap:5px}
.field label{font-size:11px;color:var(--muted);font-weight:500;letter-spacing:.2px}
.field input,.field select{background:var(--surface);border:1.5px solid var(--border);border-radius:8px;color:var(--text);padding:8px 11px;font-size:13px;font-family:inherit;width:100%;outline:none;transition:border-color .15s,box-shadow .15s}
.field input:focus,.field select:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(0,122,255,.15)}
.field input[type=number]{-moz-appearance:textfield}
.field input[type=number]::-webkit-outer-spin-button,.field input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none}

/* day tabs */
.day-tab-strip{display:flex;overflow-x:auto;gap:6px;padding-bottom:14px;scrollbar-width:thin;scrollbar-color:var(--border) transparent}
.day-tab-strip::-webkit-scrollbar{height:3px}
.day-tab-strip::-webkit-scrollbar-track{background:transparent}
.day-tab-strip::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}
.day-tab{flex:0 0 auto;width:56px;padding:9px 4px 8px;border-radius:10px;text-align:center;cursor:pointer;border:1.5px solid var(--border);background:var(--surface2);transition:all .15s;position:relative}
.day-tab:hover{border-color:var(--border-md);background:var(--surface);box-shadow:var(--shadow-sm)}
.day-tab.active{background:var(--accent-strong);border-color:var(--accent-strong);box-shadow:0 4px 12px rgba(0,122,255,.25)}
.day-tab.active .dt-name{color:rgba(255,255,255,.75)}
.day-tab.active .dt-date{color:#fff}
.day-tab.active .dt-hrs{color:rgba(255,255,255,.9)}
.day-tab.active .dt-dot{background:rgba(255,255,255,.8)}
.day-tab.has-hrs.c-reg{border-color:var(--accent);background:var(--accent-light)}
.day-tab.has-hrs.c-ot15{border-color:var(--amber);background:var(--amber-light)}
.day-tab.has-hrs.c-ot2x{border-color:var(--red);background:var(--red-light)}
.day-tab.has-hrs.c-hol{border-color:var(--green);background:var(--green-light)}
.day-tab.has-hrs.c-sun{border-color:var(--purple);background:var(--purple-light)}
.day-tab .dt-name{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}
.day-tab .dt-date{font-size:13px;font-weight:600;color:var(--text);margin:3px 0 2px}
.day-tab .dt-hrs{font-size:10px;font-weight:700;min-height:14px}
.day-tab .dt-dollars{font-size:9px;font-weight:600;color:var(--green);min-height:12px}
.day-tab.active .dt-dollars{color:rgba(255,255,255,.85)}
.day-tab .dt-hrs.c-reg{color:var(--accent)}
.day-tab .dt-hrs.c-ot15{color:var(--amber)}
.day-tab .dt-hrs.c-ot2x{color:var(--red)}
.day-tab .dt-hrs.c-hol{color:var(--green)}
.day-tab .dt-hrs.c-sun{color:var(--purple)}
.day-tab .dt-dot{display:none}
/* multi-select checkbox */
.dt-check{display:none}
.dt-check:hover{border-color:var(--accent);color:rgba(0,122,255,.3)}
.day-tab.multi-sel .dt-check{background:var(--green);border-color:var(--green);color:#fff}
.day-tab.active .dt-check{border-color:rgba(255,255,255,.5);background:rgba(255,255,255,.15);color:rgba(255,255,255,.8)}
.day-tab.active.multi-sel .dt-check{background:#fff;border-color:#fff;color:var(--green)}
/* sync banner */
.sync-banner{display:flex;align-items:center;justify-content:space-between;background:var(--green-light);border:1px solid rgba(22,163,74,.25);border-radius:8px;padding:7px 12px;margin-bottom:10px;font-size:12px;color:var(--green);gap:12px}
.sync-banner strong{font-weight:600}
.sync-banner button{background:transparent;border:1px solid rgba(22,163,74,.3);border-radius:5px;color:var(--green);font-size:11px;font-weight:600;font-family:inherit;padding:2px 8px;cursor:pointer;white-space:nowrap;transition:all .12s}
.sync-banner button:hover{background:var(--green);color:#fff;border-color:var(--green)}

/* detail panel */
.day-detail-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.day-detail-title{font-size:14px;font-weight:700;color:var(--text)}
.day-detail-title .ddt-sub{font-size:11px;color:var(--muted);font-weight:400;margin-left:8px}
.day-nav{display:flex;gap:6px}
.day-nav button{background:var(--surface2);border:1.5px solid var(--border);color:var(--muted);border-radius:8px;padding:4px 12px;font-size:12px;font-family:inherit;font-weight:500;cursor:pointer;transition:all .15s}
.day-nav button:hover{color:var(--accent);border-color:var(--accent)}
.day-nav button:disabled{opacity:.35;cursor:default}

/* totals row */
.day-totals-row{display:flex;gap:6px;font-size:12px;padding:10px 0 0;border-top:1px solid var(--border);margin-top:12px;flex-wrap:wrap}
.day-total-chip{display:flex;align-items:center;gap:5px;background:var(--surface);border:1px solid var(--border);border-radius:20px;padding:3px 10px;font-size:11px}
.day-total-chip .chip-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
.day-total-chip span{color:var(--muted)}
.day-total-chip strong{color:var(--text);font-weight:600}

/* day detail pay sections */
.dd-section-lbl{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.7px;color:var(--muted);margin:10px 0 6px;padding-top:10px;border-top:1px solid var(--border)}
.dd-section-lbl:first-child{margin-top:0;padding-top:0;border-top:none}
.dd-sun-note{font-size:10px;color:var(--purple);font-weight:600;margin-left:6px}

/* pay type grid */
.pay-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}
.pay-grid-full{display:grid;gap:5px;grid-template-columns:repeat(5,1fr)}
/* compact horizontal cell */
.pay-cell{background:var(--surface2);border:1px solid var(--border);border-radius:7px;padding:5px 8px;display:flex;align-items:center;gap:7px;transition:border-color .15s}
.pay-cell:focus-within{border-color:var(--accent);background:var(--surface)}
.pay-cell .pc-info{flex:1;min-width:0}
.pay-cell .pc-name{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}
.pay-cell .pc-rate{font-size:8px;color:var(--muted);line-height:1.2}
.pay-cell .pc-total{font-size:10px;font-weight:600;color:var(--accent);white-space:nowrap;min-width:52px;text-align:right;flex-shrink:0}
.pc-quick{flex-shrink:0;background:var(--accent-light);border:1px solid rgba(0,122,255,.25);color:var(--accent);border-radius:5px;padding:2px 6px;font-size:9px;font-weight:700;font-family:inherit;cursor:pointer;white-space:nowrap;transition:all .12s}
.pc-quick:hover{background:var(--accent-strong);color:#fff}
.pc-stepper{display:flex;align-items:center;flex-shrink:0}
.pc-stepper button{background:var(--surface2);border:1px solid var(--border);color:var(--muted);font-size:12px;font-weight:700;font-family:inherit;width:20px;height:26px;cursor:pointer;transition:all .12s;line-height:1}
.pc-stepper button:first-child{border-radius:5px 0 0 5px;border-right:none}
.pc-stepper button:last-child{border-radius:0 5px 5px 0;border-left:none}
.pc-stepper button:hover{background:var(--accent-strong);border-color:var(--accent-strong);color:#fff}
.pc-stepper input{width:40px;background:var(--surface);border:1px solid var(--border);border-radius:0;color:var(--text);font-size:13px;font-weight:700;font-family:inherit;text-align:center;padding:3px 2px;outline:none;height:26px;-moz-appearance:textfield}
.pc-stepper input::-webkit-outer-spin-button,.pc-stepper input::-webkit-inner-spin-button{-webkit-appearance:none}
.pc-stepper input:focus{border-color:var(--accent);z-index:1;position:relative}

/* results panel */
.results-panel{position:sticky;top:20px}
.result-section{margin-bottom:2px}
.result-section h3{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);padding:12px 0 7px;border-top:1px solid var(--border)}
.result-row{display:flex;justify-content:space-between;align-items:center;padding:6px 0;font-size:13px;border-bottom:1px solid var(--border)}
.result-row:last-child{border-bottom:none}
.result-row .rl{color:var(--muted)}
.result-row .rl-units{font-size:11px;opacity:.7;margin-left:5px}
.result-row .rv{font-weight:600}
.result-row .rv.neg{color:var(--red)}
.result-row .rv.pos{color:var(--green)}
.result-row .rv.accent{color:var(--accent)}

.result-big{background:linear-gradient(135deg,#1e3a8a,#2563eb);border-radius:var(--r);padding:24px 20px;text-align:center;margin-bottom:16px;box-shadow:0 8px 24px rgba(37,99,235,.25)}
.result-big .label{font-size:11px;color:rgba(255,255,255,.65);text-transform:uppercase;letter-spacing:.6px;margin-bottom:8px;font-weight:500}
.result-big .amount{font-size:42px;font-weight:800;color:#fff;line-height:1;letter-spacing:-1px}
.result-big .sub{font-size:11px;color:rgba(255,255,255,.55);margin-top:8px}

.kpi-mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:16px}
.kpi-mini{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:14px;border-left-width:3px}
.kpi-mini .kl{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;margin-bottom:5px;font-weight:500}
.kpi-mini .kv{font-size:19px;font-weight:700}
.kpi-mini.blue{border-left-color:var(--accent)} .kpi-mini.blue .kv{color:var(--accent)}
.kpi-mini.green{border-left-color:var(--green)} .kpi-mini.green .kv{color:var(--green)}
.kpi-mini.amber{border-left-color:var(--amber)} .kpi-mini.amber .kv{color:var(--amber)}
.kpi-mini.red{border-left-color:var(--red)} .kpi-mini.red .kv{color:var(--red)}

/* ── DASHBOARD ── */
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin-bottom:22px}
.kpi-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:20px;box-shadow:var(--shadow-sm)}
.kpi-card .kl{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px;font-weight:500}
.kpi-card .kv{font-size:26px;font-weight:700;line-height:1;letter-spacing:-.5px}
.kpi-card .ks{color:var(--muted);font-size:11px;margin-top:6px}
.kpi-card.blue .kv{color:var(--accent)} .kpi-card.green .kv{color:var(--green)}
.kpi-card.amber .kv{color:var(--amber)} .kpi-card.red .kv{color:var(--red)}
.charts-row{display:grid;grid-template-columns:2fr 1fr;gap:14px;margin-bottom:22px}
.charts-row2{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:22px}
.chart-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:20px;box-shadow:var(--shadow-sm)}
.chart-card h2{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin-bottom:14px}
.table-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:20px;margin-bottom:20px;box-shadow:var(--shadow-sm)}
.table-card .th{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.table-card .th h2{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:12px}
thead th{background:var(--surface2);color:var(--muted);font-weight:600;font-size:10px;text-transform:uppercase;letter-spacing:.4px;padding:10px 12px;text-align:right;white-space:nowrap;border-bottom:1px solid var(--border)}
thead th:first-child{text-align:left}
tbody tr{border-bottom:1px solid var(--border);cursor:pointer;transition:background .1s}
tbody tr:hover{background:var(--accent-light)}
tbody tr.selected{background:var(--accent-light);outline:1px solid rgba(0,122,255,.3)}
tbody tr.projected{opacity:.5}
tbody td{padding:10px 12px;text-align:right;white-space:nowrap}
tbody td:first-child{text-align:left}
.period-label{font-weight:600;font-size:13px}
.period-dates{color:var(--muted);font-size:10px}
.tag{display:inline-block;border-radius:20px;padding:2px 8px;font-size:9px;font-weight:700;text-transform:uppercase;margin-left:6px}
.tag-future{background:var(--amber-light);color:var(--amber)}
.tag-curr{background:var(--accent-light);color:var(--accent)}
.pos{color:var(--green)} .neg{color:var(--red)}
.detail-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:22px;margin-bottom:20px;display:none;box-shadow:var(--shadow-md)}
.detail-panel.open{display:block}
.detail-panel h2{font-size:15px;font-weight:700;margin-bottom:18px;letter-spacing:-.3px}
.detail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.detail-section h3{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin-bottom:10px;padding-bottom:6px;border-bottom:1px solid var(--border)}
.detail-row{display:flex;justify-content:space-between;padding:5px 0;font-size:12px;border-bottom:1px solid var(--border)}
.detail-row:last-child{border-bottom:none}
.detail-row .dl{color:var(--muted)}
.detail-total{display:flex;justify-content:space-between;padding:8px 0 0;font-size:13px;font-weight:700;margin-top:4px}

footer{text-align:center;color:var(--muted);font-size:11px;padding:18px;border-top:1px solid var(--border)}

/* pay period strip */
.calc-layout{display:flex;gap:12px;align-items:flex-start}
.calc-main{flex:1;min-width:0}
.period-sidebar{flex:0 0 132px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:10px 8px;box-shadow:var(--shadow-sm);overflow:visible}
.period-strip{display:flex;flex-direction:column;gap:10px;padding-top:10px}
.tax-sidebar{flex:0 0 188px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:12px 10px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:9px;align-self:flex-start}
.tax-sidebar-hdr{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);margin-bottom:2px}
.tax-sidebar-section{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text);padding:8px 0 2px;margin-top:2px;display:flex;align-items:center;justify-content:space-between}
.tax-sidebar-add{font-size:10px;font-weight:600;color:var(--accent);cursor:pointer;padding:1px 5px;border-radius:4px;text-transform:none;letter-spacing:0;border:1px solid transparent}
.tax-sidebar-add:hover{background:var(--accent-light);border-color:var(--accent)}
.tax-sub-hdr{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:var(--accent);padding:6px 0 1px;margin-top:2px;border-top:1px solid var(--border)}
/* Social Security toggle */
.ss-toggle-btn{padding:3px 10px;border-radius:12px;font-size:11px;font-weight:700;cursor:pointer;border:1.5px solid var(--accent);background:rgba(0,122,255,.12);color:var(--accent);letter-spacing:.4px;transition:all .15s}
.ss-toggle-btn.ss-off{border-color:var(--muted);background:var(--surface2);color:var(--muted)}
.ss-toggle-btn:active{opacity:.75}
.tax-sidebar-div{height:1px;background:#64748b;margin:6px 0}
.editable-label{cursor:text;border-bottom:1px dashed transparent;outline:none;display:inline-block}
.editable-label:hover{border-bottom-color:var(--border-md)}
.editable-label:focus{border-bottom-color:var(--accent);background:var(--accent-light)}
.tax-sidebar-addbtn{font-size:11px;font-weight:700;color:var(--accent);background:var(--accent-light);border:1px dashed rgba(0,122,255,.35);border-radius:8px;padding:7px;text-align:center;cursor:pointer;margin-top:2px}
.tax-sidebar-addbtn:hover{background:var(--accent-strong);color:#fff;border-color:var(--accent-strong)}
.cust-ded-field label{display:flex;align-items:center;justify-content:space-between}
.cust-ded-field .ts-lbl-actions{opacity:0;transition:opacity .15s}
.cust-ded-field:hover .ts-lbl-actions{opacity:1}
.tax-sidebar .field input,.tax-sidebar .field select{width:100%;height:34px;padding:0 10px;box-sizing:border-box}
.date-field-wrap{display:flex;align-items:center;gap:6px}
.date-field-wrap input{flex:1;min-width:0}
.date-cal-btn{flex-shrink:0;background:var(--surface);border:1.5px solid var(--border);border-radius:8px;padding:7px 8px;cursor:pointer;color:var(--muted);display:flex;align-items:center;transition:border-color .15s,color .15s,box-shadow .15s}
.date-cal-btn:hover{border-color:var(--accent);color:var(--accent)}
.date-cal-btn:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(0,122,255,.15)}
.pt{flex:0 0 auto;padding:7px 11px 8px;border-radius:8px;cursor:pointer;border:1.5px solid var(--border);background:var(--surface2);text-align:center;transition:all .15s;position:relative;min-width:86px}
.pt:hover{background:var(--surface);border-color:var(--border-md);box-shadow:var(--shadow-sm)}
.pt.future{opacity:.5}
.pt .pt-num{font-size:9px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;margin-bottom:2px}
.pt .pt-dates{font-size:11px;color:var(--text);white-space:nowrap;margin-bottom:2px;font-weight:600}
.pt .pt-net{font-size:10px;font-weight:600;color:var(--text)}
.pt.done .pt-net{color:var(--green)}
/* Active period (whatever is currently shown) always gets the teal highlight.
   The CURRENT badge (::after on .pt.curr) separately marks today's period. */
.pt.active{background:var(--accent-light);border-color:var(--accent);border-width:2px;box-shadow:0 0 0 3px rgba(0,122,255,.22);transform:translateY(-1px)}
.pt.active .pt-num{color:var(--accent)}
.pt.active .pt-dates{color:var(--accent);font-weight:800}
.pt.active .pt-net{color:var(--accent)}
.pt.curr::after{content:'CURRENT';position:absolute;top:-9px;left:50%;transform:translateX(-50%);background:var(--accent-strong);color:#fff;font-size:7px;font-weight:800;letter-spacing:.5px;padding:1px 5px;border-radius:4px;white-space:nowrap;box-shadow:0 1px 3px rgba(0,0,0,.4)}
.pt.future .pt-net{color:var(--muted)}
.pt-net.pt-net-neg{color:#e53935!important}
.pt-divider{height:1px;width:100%;background:var(--border);margin:2px 0;flex-shrink:0}
.pt-del{position:absolute;top:2px;right:3px;font-size:9px;color:var(--muted);opacity:0;cursor:pointer;padding:2px 3px;border-radius:3px;line-height:1}
.pt:hover .pt-del{opacity:1}
.pt-del:hover{color:#fff;background:var(--red)}
.pt-add-past{flex:0 0 auto;font-size:10px;font-weight:600;color:var(--accent);text-align:center;padding:7px 6px;border:1.5px dashed var(--border-md);border-radius:8px;cursor:pointer;transition:all .15s}
.pt-add-past:hover{border-color:var(--accent);background:var(--accent-light)}

/* ── Paycheck (company) switcher tabs ── */
.paycheck-tabs{display:flex;gap:6px;flex-wrap:wrap;padding:10px 28px 0;align-items:flex-end;max-width:1320px;margin:0 auto}
.pc-tab{padding:7px 24px 8px 14px;border-radius:8px 8px 0 0;border:1.5px solid var(--border);border-bottom:none;background:var(--surface2);font-size:12px;font-weight:600;color:var(--muted);cursor:pointer;transition:all .15s;text-align:center;line-height:1.3;position:relative}
.pc-tab:hover{background:var(--surface);color:var(--text)}
.pc-tab.active{background:var(--surface);color:var(--accent);border-color:var(--accent)}
.pc-tab-sub{display:block;font-size:9px;font-weight:500;color:var(--muted)}
.pc-tab.active .pc-tab-sub{color:var(--accent)}
.pc-tab-sub-placeholder{opacity:.4;font-style:italic}
.pc-tab.active .pc-tab-sub-placeholder{opacity:.55}
.pc-tab-edit{position:absolute;top:4px;right:4px;font-size:9px;color:var(--muted);opacity:0;cursor:pointer;padding:2px 3px;border-radius:3px;line-height:1}
.pc-tab:hover .pc-tab-edit{opacity:1}
.pc-tab-edit:hover{color:#fff;background:var(--accent-strong)}
.calc-co-header{font-size:22px;font-weight:700;color:var(--text);margin:0 0 10px 2px}
.cch-mob-arrow{display:none;font-size:14px;color:var(--text);margin-left:6px;cursor:pointer;vertical-align:4px}
.calc-co-header .cch-loc{font-weight:500;color:var(--muted)}
.pc-tab-archived-link{padding:7px 12px 8px;font-size:11px;font-weight:600;color:var(--muted);cursor:pointer;align-self:flex-end;text-decoration:underline}
.pc-tab-archived-link:hover{color:var(--text)}
.apt-btn-archive{background:var(--surface);color:var(--amber);border:1.5px solid var(--amber) !important}
.apt-btn-archive:hover{background:var(--amber);color:#fff}
.pc-archived-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 0;border-bottom:1px solid var(--border)}
.pc-archived-row:last-child{border-bottom:none}
.pc-archived-name{font-size:12px;font-weight:600;color:var(--text)}
.pc-archived-sub{font-size:10px;color:var(--muted)}
.pc-archived-actions{display:flex;gap:6px;flex-shrink:0}
.pc-archived-actions button{font-size:11px;font-weight:600;padding:6px 14px;border-radius:6px;cursor:pointer;transition:background .15s,color .15s,box-shadow .15s;letter-spacing:.2px}
.pc-archived-restore{background:var(--accent-strong);color:#fff;border:none;box-shadow:0 2px 6px rgba(0,122,255,.25)}
.pc-archived-restore:hover{background:var(--accent);box-shadow:0 3px 10px rgba(0,122,255,.35)}
.pc-archived-delete{background:transparent;color:var(--red);border:1.5px solid var(--red)}
.pc-archived-delete:hover{background:var(--red);color:#fff;box-shadow:0 2px 8px rgba(239,68,68,.3)}
.pc-archived-empty{font-size:12px;color:var(--muted);padding:8px 0}
.pc-tab-new{padding:3px 8px;border-radius:5px;border:1px solid var(--accent);background:transparent;font-size:11px;font-weight:600;color:var(--accent);cursor:pointer;align-self:center;line-height:1.4}
.pc-tab-new:hover{background:var(--accent-light)}

/* schedule view toggle */
.sched-view-toggle{display:flex;border:1.5px solid var(--border);border-radius:8px;overflow:hidden}
.sview{background:transparent;border:none;padding:4px 12px;font-size:12px;font-weight:500;font-family:inherit;color:var(--muted);cursor:pointer;transition:all .12s}
.sview.active{background:var(--accent-strong);color:#fff}
/* vertical schedule table */
.vs-table{width:100%;border-collapse:collapse;font-size:11px}
.vs-table thead th{background:var(--surface2);color:var(--muted);font-weight:600;font-size:9px;text-transform:uppercase;letter-spacing:.4px;padding:7px 8px;text-align:center;border-bottom:1px solid var(--border);white-space:nowrap}
.vs-table thead th:first-child{text-align:left}
.vs-table thead th:last-child{text-align:right}
.vs-row{border-bottom:1px solid var(--border);cursor:pointer;transition:background .1s}
.vs-row:hover{background:var(--accent-light)}
.vs-row td{padding:7px 8px;text-align:center;vertical-align:middle}
.vs-row td:first-child{text-align:left}
.vs-row td:last-child{text-align:right}
.vs-active{background:var(--accent-light) !important;outline:1.5px solid rgba(0,122,255,.35)}
.vs-sel{background:var(--green-light)}
.vs-day{font-size:11px;font-weight:600;color:var(--text);white-space:nowrap}
.vs-chk{display:none}
.vs-chk:hover{border-color:var(--accent)}
.vs-chk.vs-chk-on{background:var(--green);border-color:var(--green);color:#fff}
/* ── TIMESHEET LAYOUT ── */
.ts-topbar{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:10px 20px;margin-bottom:8px;display:flex;gap:12px;align-items:center;flex-wrap:wrap;box-shadow:var(--shadow-sm)}
.ts-topbar.sticky{position:sticky;top:0;z-index:49;box-shadow:0 2px 8px rgba(0,0,0,.4)}
.ts-stat{display:flex;flex-direction:column;gap:1px;padding:0 14px;border-left:1px solid var(--border)}
.ts-stat .sl{font-size:9px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);font-weight:600;white-space:nowrap}
.ts-stat .sv{font-size:17px;font-weight:800;letter-spacing:-.4px;line-height:1.2}
.ts-stat .ss{font-size:9px;font-weight:600;color:var(--muted);letter-spacing:.1px;white-space:nowrap}
.ts-stat.s-net .sv{color:var(--accent)}
.ts-stat.s-gross .sv{color:var(--text)}
.ts-stat.s-tax .sv{color:var(--red)}
.ts-stat.s-401k .sv{color:var(--amber)}
.ts-stat.s-eff .sv{color:var(--green)}
.ts-topbar .field label{font-size:10px}
.hero-stats{display:flex;gap:12px;margin-bottom:10px}
.hero-stat{flex:1;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:14px 20px;box-shadow:var(--shadow-sm)}
.hero-stat .hs-label{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);font-weight:700;margin-bottom:4px}
.hero-stat .hs-value{font-size:34px;font-weight:800;letter-spacing:-.7px;line-height:1.1}
.hero-stat .hs-sub{font-size:11px;font-weight:600;color:var(--muted);margin-top:3px}
.hero-stat.hs-gross .hs-value{color:var(--text)}
.hero-stat.hs-tax .hs-value{color:var(--red)}
.hero-stat.hs-net .hs-value{color:var(--accent)}
.hero-stat.hs-net .hs-value.neg{color:var(--red)}
.hero-stat.hs-net .hs-value.pos{color:var(--green)}
/* YTD / overview row — slightly more compact */
.hero-stats-ytd{margin-top:-4px}
.hero-stats-ytd .hero-stat{padding:10px 16px}
.hero-stats-ytd .hs-value{font-size:22px;letter-spacing:-.4px}
.ot-total-wrap{display:flex;align-items:center;gap:8px;margin-top:2px}
.ot-adj-btn{width:24px;height:24px;border-radius:6px;border:1px solid var(--border);
  background:var(--surface2);color:var(--text);font-size:15px;font-weight:700;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  line-height:1;transition:border-color .15s,background .15s;flex-shrink:0}
.ot-adj-btn:hover{border-color:var(--accent);background:var(--accent-light);color:var(--accent)}
.ot-adj-note{font-size:10px;color:var(--muted);margin-top:3px;}
.ot-period-row{display:flex;align-items:center;justify-content:space-between;
  margin-top:8px;padding-top:8px;border-top:1px solid var(--border);}
.ot-period-label{font-size:11px;color:var(--muted);}
.ot-period-val{font-size:13px;font-weight:700;color:var(--amber);}
.hero-stat.hs-co .hs-value{color:var(--accent)}
.ts-topbar .field input,.ts-topbar .field select{padding:5px 8px;font-size:12px}
.ts-topbar-div{width:1px;background:var(--border);align-self:stretch;margin:0 4px}
.new-period-btn{background:var(--accent-strong);color:#fff;border:none;border-radius:6px;padding:7px 11px;font-size:11px;font-weight:600;cursor:pointer;align-self:center;white-space:nowrap}
.new-period-btn:hover{background:#0c7d72}
.pt-new-btn{flex:0 0 auto;font-size:11px;font-weight:700;color:var(--accent);border:1px solid var(--accent);border-radius:5px;padding:3px 8px;cursor:pointer;align-self:center;white-space:nowrap;background:transparent;transition:all .15s}
.pt-new-btn:hover{background:var(--accent-light)}
.clear-period-btn{background:var(--surface2);color:var(--muted);border:1px solid var(--border)}
.clear-period-btn:hover{background:var(--surface);color:var(--red);border-color:var(--red)}
.ts-wrap{display:grid;grid-template-columns:155px 1fr;border:1px solid var(--border);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow-sm)}
/* left labels */
--ts-hdr:46px; /* declared below in :root */
.ts-left{background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;flex-shrink:0}
.ts-lbl-corner{height:52px;display:flex;align-items:center;padding:0 10px;border-bottom:2px solid var(--border);font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);background:var(--surface);flex-shrink:0}
.ts-lbl-sec{height:14px;display:flex;align-items:center;padding:0 10px;background:var(--surface);font-size:7px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);border-bottom:1px solid var(--border);flex-shrink:0}
.ts-lbl-sec-401k{font-weight:800;color:var(--accent);background:var(--accent-light)}
.ts-lbl-sec-non401k{color:var(--amber);background:var(--amber-light)}
.ts-lbl-row{height:38px;display:flex;align-items:center;padding:0 10px;border-bottom:1px solid var(--border);flex-shrink:0;background:var(--surface)}
.tl-info{display:flex;flex-direction:column;justify-content:center;flex:1;min-width:0}
.tl-name{font-size:10px;font-weight:600;color:var(--text);line-height:1}
.tl-bottom-row{display:flex;align-items:center;justify-content:space-between;width:100%;padding-right:6px;margin-top:2px}
.tl-rate{font-size:8px;color:var(--muted);font-weight:500}
.tl-units{font-size:8px;font-weight:600;color:var(--muted)}
.ts-lbl-tot{height:24px;display:flex;align-items:center;padding:0 10px;font-size:9px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;background:var(--surface);border-top:2px solid var(--border);flex-shrink:0;margin-top:auto}
/* middle grid */
.ts-mid{overflow:hidden;display:flex;flex-direction:column;border-right:1px solid var(--border)}
.ts-grid-scroll{display:flex;overflow-x:auto;overflow-y:hidden;flex:1;width:100%;scrollbar-width:thin;scrollbar-color:var(--border-md) transparent}
.ts-grid-scroll::-webkit-scrollbar{height:5px}
.ts-grid-scroll::-webkit-scrollbar-thumb{background:var(--border-md);border-radius:3px}
.ts-col{flex:1 1 0;min-width:48px;border-right:1px solid var(--border);display:flex;flex-direction:column;transition:background .1s}
.ts-col:last-child{border-right:none}
.ts-col:first-child{border-left:1px solid var(--border)}
.ts-col.ts-week-end{border-right:1px solid #64748b}
.ts-col.ts-week-sat{border-left:.5px solid #64748b}
.ts-cell-hdr{height:52px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-bottom:2px solid var(--border);background:var(--surface);flex-shrink:0;cursor:pointer;gap:1px;position:relative;transition:background .15s}
/* .ts-cell-hdr:hover{background:var(--accent-light)} -- removed per user request: no shading except weekend */
/* .ts-col.ts-active .ts-cell-hdr -- removed: active day header now identical to default (white/surface2), no blue accent */
/* .ts-col.ts-sel .ts-cell-hdr{background:var(--green-light)} -- removed per user request: no shading except weekend */
.th-day{font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}
.th-holiday{font-size:6.5px;letter-spacing:.1px;font-weight:700;color:var(--muted)}
/* .ts-col.ts-active .th-day,.ts-col.ts-active .th-date,.ts-col.ts-active .th-total{color:#fff} -- removed: active header no longer fills blue, default text colors apply */
.th-date{font-size:13px;font-weight:700;color:var(--text)}
.th-total{font-size:9px;font-weight:700;color:var(--green);letter-spacing:-.2px;line-height:1}
.ts-cell-sec{height:14px;border-bottom:1px solid var(--border);background:var(--surface);flex-shrink:0}
.ts-cell-sec-401k{background:var(--accent-light)}
.ts-cell-sec-non401k{background:var(--amber-light)}
.ts-cell-row{height:38px;display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--border);flex-shrink:0;position:relative;background:var(--surface)}
.ts-cell-row input{width:100%;height:100%;border:none;background:transparent;color:var(--text);font-size:11px;font-weight:700;font-family:inherit;text-align:center;outline:none;padding:0 2px;-moz-appearance:textfield;cursor:pointer}
.ts-cell-row input::-webkit-outer-spin-button,.ts-cell-row input::-webkit-inner-spin-button{-webkit-appearance:none}
.ts-cell-row input:focus{background:rgba(0,122,255,.1);color:var(--accent)}
.ts-cell-note{position:relative;align-items:stretch}
.ts-cell-note textarea{width:100%;height:100%;border:none;background:transparent;color:var(--muted);font-size:10px;font-weight:500;font-family:inherit;padding:4px 4px 4px 5px;resize:none;outline:none;line-height:1.35;overflow:hidden;word-break:break-word;white-space:pre-wrap}
.ts-cell-note textarea:focus{background:rgba(0,122,255,.07);color:var(--text)}
.ts-cell-note textarea:not(:placeholder-shown):not(:focus){color:var(--text)}
.ts-note-clock{position:absolute;right:3px;top:50%;transform:translateY(-50%);font-size:11px;cursor:pointer;opacity:0;transition:opacity .15s;user-select:none}
.ts-cell-note:hover .ts-note-clock{opacity:.6}
.ts-note-clock:hover{opacity:1 !important}
.ts-lbl-note-row .tl-name{font-size:11px;color:var(--text);font-style:normal;font-weight:700}
.ts-cell-row input:not(:placeholder-shown):not(:focus){color:var(--text)}
.ts-qa{font-size:6.5px;font-weight:700;color:var(--accent);background:var(--accent-light);border:1px solid rgba(0,122,255,.25);border-radius:3px;padding:0 2px;cursor:pointer;line-height:1.3;user-select:none;white-space:nowrap;opacity:0;transition:opacity .15s}
.ts-cell-row:hover .ts-qa{opacity:1}
.ts-qa:hover{background:var(--accent-strong);color:#fff}
.ts-qa-left{position:absolute;top:1px;left:1px;display:flex;flex-direction:column;gap:1px}
.ts-qa-right{position:absolute;top:1px;right:1px;display:flex;flex-direction:column;gap:1px}
.ts-qa-br{position:absolute;bottom:1px;right:2px}
.ts-qa.ts-qa-minus:hover{background:var(--red);color:#fff;border-color:rgba(248,113,113,.3)}
.ts-cell-x{position:absolute;bottom:1px;left:2px;font-size:9px;line-height:1;color:var(--muted);cursor:pointer;opacity:0;transition:opacity .15s;padding:1px 2px;border-radius:3px}
.ts-cell-row:hover .ts-cell-x{opacity:1}
.ts-cell-x:hover{color:var(--red);background:var(--red-light)}
.ts-col.ts-active .ts-cell-row{background:var(--surface)}
/* Cell-range drag-to-clear highlight — needs to beat the section-tint and
   active-day-column rules above, since it's a deliberate "about to delete"
   state that should always be visible regardless of section/active styling. */
.ts-cell-row.ts-cell-dragsel{background:rgba(248,113,113,.28) !important;box-shadow:inset 0 0 0 1px var(--red)}
/* Today column: amber left+right border lines on every cell, no background fill */
.ts-col.ts-today .ts-cell-hdr,
.ts-col.ts-today .ts-cell-row,
.ts-col.ts-today .ts-cell-sec,
.ts-col.ts-today .ts-cell-addbtn{background:rgba(96,165,250,.07);box-shadow:inset 1.5px 0 0 rgba(96,165,250,.7),inset -1.5px 0 0 rgba(96,165,250,.7)}
.ts-col.ts-today .ts-cell-hdr{border-bottom-color:rgba(96,165,250,.65);background:rgba(96,165,250,.12)}
.ts-col.ts-today .th-day{color:#60a5fa;font-weight:900}
.ts-col.ts-today .th-date{color:rgba(96,165,250,.9);font-weight:700}
.ts-col.ts-weekend .ts-cell-hdr,
.ts-col.ts-weekend .ts-cell-row,
.ts-col.ts-weekend .ts-cell-sec,
.ts-col.ts-weekend .ts-cell-tot,
.ts-col.ts-weekend .ts-cell-addbtn{background:var(--surface2)}
.ts-col.ts-weekend .th-day{color:var(--accent)}
/* .ts-col.ts-weekend.ts-today{background:rgba(234,179,8,.07);box-shadow:inset 2px 0 0 var(--amber),inset -1px 0 0 var(--amber)} -- removed per user request: weekend+today now just stays weekend-blue */
/* .ts-col.ts-weekend.ts-today .ts-cell-hdr{background:rgba(234,179,8,.16);border-bottom-color:var(--amber)} -- removed per user request */
/* .ts-col.ts-weekend.ts-today .th-day{color:var(--amber)} -- removed per user request: falls back to weekend's accent-blue th-day color */
.today-dot{display:inline-block;width:5px;height:5px;background:#60a5fa;border-radius:50%;vertical-align:middle;margin-left:2px;margin-bottom:1px}
.ts-cell-tot{height:24px;display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;color:var(--green);border-top:2px solid var(--border);background:var(--surface);flex-shrink:0;margin-top:auto}
/* multi-select checkbox in column header */
.ts-chk{display:none}
.ts-chk:hover{border-color:var(--accent);color:rgba(0,122,255,.3)}
.ts-chk.ts-chk-on{background:var(--green);border-color:var(--green);color:#fff}
.ts-col.ts-active .ts-chk{border-color:rgba(255,255,255,.5);background:rgba(255,255,255,.2);color:rgba(255,255,255,.7)}
.ts-col.ts-active .ts-chk.ts-chk-on{background:#fff;border-color:#fff;color:var(--green)}
/* Mobile detail page — hidden on desktop */
.mob-detail-page{display:none}
/* ── Mobile (≤768px) ─────────────────────────────────────────────────────────── */
@media(max-width:768px){
  /* Native app feel — no bounce, no zoom, no tap flash */
  html,body{
    overscroll-behavior:none;
    -webkit-tap-highlight-color:transparent;
    -webkit-user-select:none;user-select:none;
  }
  /* Re-enable selection inside text inputs and textareas */
  input,textarea,select{-webkit-user-select:text;user-select:text}
  /* Contain scroll bounce inside each scrollable panel */
  .mob-ts,.mob-dd-body,.mob-nts-body,.mob-nts-scroll,.mob-pp-list,
  .re-modal,.mob-co-sheet,.mob-copy-sheet,
  .mob-edit-period-body{
    overscroll-behavior:contain;
  }
  /* Nav — centered brand, hamburger right */
  .nav-inner{padding:0 14px;position:relative}
  .nav-tab{display:none}
  .nav-user{display:none}
  #navAuthStatus{display:none}
  .nav-brand{position:absolute;left:50%;transform:translateX(-50%);font-size:14px;margin:0;pointer-events:none;white-space:nowrap}
  /* Hide desktop company tabs row */
  #paycheckTabs{display:none!important}
  /* Company label under the hamburger button */
  .mob-co-label-row{display:flex;align-items:center;justify-content:flex-end;gap:2px;cursor:pointer;padding:0 1px;margin-top:3px;-webkit-tap-highlight-color:transparent}
  .mob-co-label-name{font-size:10px;font-weight:700;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:80px}
  .mob-co-label-arrow{font-size:14px;font-weight:900;color:var(--text);line-height:1;flex-shrink:0}
  /* Show bold arrow on the company header on mobile */
  .cch-mob-arrow{display:inline}
  .mob-only{display:block}
  /* Company switcher bottom sheet */
  .mob-co-sheet-backdrop{display:none;position:fixed;inset:0;z-index:250;background:rgba(0,0,0,.45)}
  .mob-co-sheet-backdrop.open{display:block}
  .mob-co-sheet{position:fixed;bottom:0;left:0;right:0;z-index:251;background:var(--surface);border-radius:16px 16px 0 0;padding:0 0 80px;transform:translateY(100%);transition:transform .28s cubic-bezier(.4,0,.2,1);box-shadow:0 -8px 40px rgba(0,0,0,.35)}
  .mob-co-sheet.open{transform:translateY(0)}
  .mob-co-sheet-handle{width:36px;height:4px;background:var(--border);border-radius:2px;margin:10px auto 0}
  .mob-co-sheet-title{font-size:13px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;padding:14px 20px 10px}
  .mob-co-sheet-toprow{display:flex;align-items:center;justify-content:space-between;padding:8px 16px 4px}
  .mob-sheet-close{width:28px;height:28px;border-radius:50%;border:none;background:var(--surface2);color:var(--muted);font-size:16px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;flex-shrink:0}
  .mob-sheet-close:active{background:var(--border);color:var(--text)}
  /* Period picker close lives inside the header row */
  .mob-pp-sheet .mob-sheet-close{position:static}
  .mob-co-sheet-list{display:flex;flex-direction:column;gap:0;max-height:55vh;overflow-y:auto;overscroll-behavior:contain}
  .mob-co-item{display:flex;align-items:center;gap:12px;padding:14px 20px;cursor:pointer}
  .mob-co-item:active{background:var(--surface2)}
  .mob-co-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
  .mob-co-item-info{flex:1;min-width:0}
  .mob-co-name{font-size:15px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mob-co-sub{font-size:11px;color:var(--muted);margin-top:1px}
  .mob-co-check{font-size:16px;color:var(--accent);flex-shrink:0}
  .mob-co-edit{flex-shrink:0;background:none;border:1px solid var(--border);border-radius:6px;color:var(--muted);font-size:14px;width:32px;height:32px;cursor:pointer;display:flex;align-items:center;justify-content:center;margin-left:6px}
  .mob-co-edit:active{background:var(--surface2);color:var(--accent)}
  .mob-co-sheet-add{display:inline-flex;align-items:center;padding:6px 14px;background:var(--accent-light);border:1px solid var(--accent);border-radius:50px;color:var(--accent);font-size:12px;font-weight:700;cursor:pointer;-webkit-tap-highlight-color:transparent;white-space:nowrap}
  .mob-co-sheet-add:active{background:rgba(0,122,255,.25)}

  /* Bottom navigation bar */
  .mob-nav{display:flex;position:fixed;bottom:28px;left:50%;transform:translateX(-50%);z-index:150;background:var(--surface);border:1px solid var(--border-md);border-radius:50px;padding:10px 24px;gap:28px;align-items:center;box-shadow:0 8px 32px rgba(0,0,0,.45)}
  .mob-nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;cursor:pointer;color:var(--muted);opacity:.65;-webkit-tap-highlight-color:transparent;transition:opacity .15s,color .15s}
  .mob-nav-item.active{color:var(--accent);opacity:1}
  .mob-nav-item:active{opacity:.75}
  .mob-nav-icon{width:24px;height:24px;display:block;flex-shrink:0}
  .mob-nav-label{font-size:10px;font-weight:600;letter-spacing:.1px;line-height:1}

  /* Page padding — top clears fixed topbar (50px + safe area) */
  .page{padding:calc(66px + env(safe-area-inset-top,0px)) 12px 140px}

  /* Hide desktop layout elements */
  .calc-layout{flex-direction:column}
  .period-sidebar{display:none}
  .tax-sidebar{display:none}
  .ts-wrap{display:none}
  .earn-drawer{display:none}
  .calc-main{padding-bottom:0}
  .calc-co-header{display:none}

  /* calc-main becomes a flex column so we can reorder sections */
  .calc-main{display:flex;flex-direction:column;align-items:stretch;width:100%;min-width:0}

  /* Gross + Net — side by side row, sits above the date strip */
  .hero-stats:not(.hero-stats-ytd){order:1;display:flex;flex-direction:row;gap:8px;margin-bottom:0;width:100%;box-sizing:border-box}
  .hero-stat{padding:10px 12px;flex:1;min-width:0}
  .hero-stat .hs-value{font-size:22px}
  .hero-stat .hs-label{font-size:9px}
  .hero-stat .hs-sub{font-size:10px}

  /* Header row: company pill | period nav (center) | + New */
  .mob-header-row{display:flex;align-items:center;gap:6px;padding:8px 0 6px}
  .mob-co-pill{display:flex;align-items:center;gap:5px;padding:6px 10px;background:var(--surface2);border:1px solid var(--border);border-radius:20px;color:var(--text);font-size:12px;font-weight:700;cursor:pointer;-webkit-tap-highlight-color:transparent;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex-shrink:1;min-width:0;max-width:38%}
  .mob-co-pill::after{content:'▾';font-size:10px;color:var(--muted);flex-shrink:0}
  .mob-co-pill:active{background:var(--surface)}
  .mob-period-nav-center{display:flex;align-items:center;justify-content:center;gap:2px;flex:1}
  .mob-edit-period-btn{display:flex;align-items:center;padding:6px 12px;background:var(--surface2);border:1px solid var(--border);border-radius:20px;color:var(--text);font-size:12px;font-weight:700;cursor:pointer;-webkit-tap-highlight-color:transparent;white-space:nowrap;flex-shrink:0}
  .mob-edit-period-btn:active{background:var(--surface)}
  /* Hero card scrolls away — no longer sticky */
  .mob-sticky-header{position:static;background:transparent;display:flex;flex-direction:column;width:100%;box-sizing:border-box;padding:0 0 4px}
  /* Seal gap between nav and sticky header */
  .mob-sticky-header::before{display:none}
  /* Day list */
  .mob-ts{order:3;width:100%;min-width:0}

  /* YTD + Weighted OT + OT Dollars — hidden on mobile, lives on home page */
  .hero-stats-ytd{display:none!important}

  /* Push hidden/desktop elements out of the visual flow */
  .ts-wrap{order:10}
  .earn-drawer{display:none!important}

  /* Period nav buttons (now inside mob-header-row) */
  .mob-period-nav-btn{background:none;border:none;color:var(--muted);width:28px;height:32px;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1;-webkit-tap-highlight-color:transparent}
  .mob-period-nav-btn:active{color:var(--accent)}
  .mob-period-date-btn{display:flex;align-items:center;justify-content:center;gap:4px;padding:6px 12px;background:var(--surface2);border:1px solid var(--border);border-radius:20px;color:var(--text);font-size:12px;font-weight:700;cursor:pointer;-webkit-tap-highlight-color:transparent;white-space:nowrap;flex-shrink:1;min-width:0}
  .mob-period-date-btn::after{content:'▾';font-size:10px;color:var(--muted);flex-shrink:0}
  .mob-period-date-btn:active{background:var(--surface)}
  /* Period picker sheet */
  .mob-pp-backdrop{display:none;position:fixed;inset:0;z-index:250;background:rgba(0,0,0,.45)}
  .mob-pp-backdrop.open{display:block}
  .mob-pp-sheet{position:fixed;bottom:0;left:0;right:0;z-index:251;background:var(--surface);border-radius:16px 16px 0 0;padding-bottom:80px;transform:translateY(100%);transition:transform .28s cubic-bezier(.4,0,.2,1);box-shadow:0 -8px 40px rgba(0,0,0,.35);max-height:75vh;display:flex;flex-direction:column}
  .mob-pp-sheet.open{transform:translateY(0)}
  .mob-pp-header{display:flex;align-items:center;justify-content:space-between;padding:0 20px;margin-top:-6px;flex-shrink:0}
  .mob-pp-new-btn{background:rgba(0,122,255,.12);border:1px solid var(--accent);border-radius:16px;color:var(--accent);font-size:12px;font-weight:700;padding:6px 14px;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .mob-pp-new-btn:active{background:rgba(0,122,255,.25)}
  .mob-pp-list{flex:1;overflow-y:auto;display:flex;flex-direction:column;overscroll-behavior:contain}
  .mob-pp-item{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;cursor:pointer;gap:10px}
  .mob-pp-item:active{background:var(--surface2)}
  .mob-pp-item.is-active .mob-pp-item-label{color:var(--accent);font-weight:700}
  .mob-pp-item-label{font-size:14px;color:var(--text);flex:1}
  .mob-pp-item-tag{font-size:11px;color:var(--muted);margin-left:6px}
  .mob-pp-item-current{color:var(--accent);font-weight:700}
  .mob-pp-item-past{color:var(--muted);opacity:.7}
  .mob-pp-item-check{font-size:16px;color:var(--accent);flex-shrink:0}
  .mob-pp-del-btn{flex-shrink:0;width:28px;height:28px;border-radius:50%;border:none;background:transparent;color:var(--muted);font-size:15px;cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;opacity:.45}
  .mob-pp-del-btn:active{background:rgba(239,68,68,.15);color:#ef4444;opacity:1}
  .mob-pp-confirm{display:flex;align-items:center;padding:10px 20px;gap:10px;background:rgba(239,68,68,.06);border-top:0.5px solid rgba(239,68,68,.2)}
  .mob-pp-confirm-msg{flex:1;font-size:13px;color:#ef4444;font-weight:600}
  .mob-pp-confirm-cancel{padding:6px 14px;border-radius:20px;border:1px solid var(--border);background:transparent;color:var(--muted);font-size:12px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .mob-pp-confirm-del{padding:6px 14px;border-radius:20px;border:none;background:#ef4444;color:#fff;font-size:12px;font-weight:700;cursor:pointer;-webkit-tap-highlight-color:transparent}

  /* Summary bar sits above bottom nav */
  .mob-summary{bottom:56px}

  /* Modals — full screen on mobile, offset below the nav bar */
  .re-overlay{padding:0;top:var(--mob-nav-h,58px)}
  .re-modal{max-width:100%;height:100%;border-radius:0}
  .pte-topbar{border-radius:0}
  .settings-modal{width:100%;border-radius:0;min-height:100vh;padding:20px 16px}
  .settings-overlay{align-items:flex-start}
  /* New Timesheet page */
  /* New Timesheet modal */
  .mob-nts-topbar{display:flex;align-items:center;justify-content:space-between;padding:calc(14px + env(safe-area-inset-top,0px)) 4px 14px;background:#007AFF;border-bottom:none;flex-shrink:0}
  .mob-nts-topbar-title{font-size:16px;font-weight:600;color:#fff}
  .mob-nts-topbar-btn{background:none;border:none;font-size:16px;font-weight:500;color:#fff;cursor:pointer;padding:0 12px;-webkit-tap-highlight-color:transparent;opacity:.9}
  .mob-nts-topbar-btn:active{opacity:.5}
  .mob-nts-topbar-btn.create{font-weight:700;opacity:1}
  .mob-nts-scroll{flex:1;overflow-y:auto;padding:16px 16px 48px;background:var(--bg);overscroll-behavior:none}
  .mob-nts-group{background:var(--surface);border-radius:13px;margin-bottom:14px;overflow:hidden;border:0.5px solid var(--border)}
  .mob-nts-group-hdr{font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;padding:10px 14px 4px}
  .mob-nts-add-btn{background:none;border:none;font-size:14px;font-weight:600;color:var(--accent);cursor:pointer;padding:4px 8px;border-radius:8px;-webkit-tap-highlight-color:transparent;line-height:1}
  .mob-nts-add-btn:active{opacity:.5}
  .mob-nts-row.stacked{flex-direction:column;align-items:stretch;gap:6px;padding-bottom:12px}
  .mob-nts-row.stacked .mob-nts-inp{width:100%;text-align:left;box-sizing:border-box}
  .mob-nts-row{display:flex;align-items:center;justify-content:space-between;padding:11px 14px;border-top:0.5px solid var(--border)}
  .mob-nts-row-lbl{font-size:15px;color:var(--text)}
  .mob-nts-inp{background:var(--surface);border:0.5px solid var(--border);border-radius:8px;color:var(--text);font-size:15px;font-weight:600;padding:6px 10px;text-align:right;width:120px;-webkit-appearance:none}
  .mob-nts-sel{width:130px}
  .mob-nts-ded-row{display:flex;align-items:center;gap:8px}
  .mob-nts-ded-actions{display:flex;gap:6px;flex-shrink:0}
  .mob-nts-ded-edit,.mob-nts-ded-del{background:none;border:none;font-size:15px;cursor:pointer;padding:2px 4px;color:var(--muted);-webkit-tap-highlight-color:transparent}
  .mob-nts-ded-del{color:var(--red,#ef4444)}
  /* Date boxes */
  .mob-nts-dates-row{display:flex;align-items:flex-start;gap:8px;padding:12px 14px 16px}
  .mob-nts-date-col{flex:1;display:flex;flex-direction:column;gap:6px;min-width:0}
  .mob-nts-date-sublbl{font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}
  .mob-nts-date-boxes{display:flex;align-items:center;gap:3px}
  .mob-nts-date-box{flex:1;min-width:0;background:var(--surface);border:0.5px solid var(--border);border-radius:9px;color:var(--text);font-size:15px;font-weight:600;padding:9px 2px;text-align:center;-webkit-appearance:none;box-sizing:border-box}
  .mob-nts-date-box:focus{outline:none;border-color:var(--accent);background:rgba(0,122,255,.06)}
  .mob-nts-date-box-yr{flex:1.7}
  .mob-nts-date-slash{color:var(--muted);font-size:16px;font-weight:300;flex-shrink:0}
  .mob-nts-date-to{color:var(--muted);font-size:16px;padding-top:26px;flex-shrink:0}
  .mob-nts-create-btn{width:100%;padding:16px;background:var(--accent);color:#fff;border:none;border-radius:14px;font-size:17px;font-weight:700;cursor:pointer;margin-top:4px;-webkit-tap-highlight-color:transparent}
  .mob-nts-create-btn:active{opacity:.82}
  .mob-nts-page.nts-edit-mode #ntsPeriodGroup{display:none!important}
  /* New Timesheet + Tax Settings — proper standalone full-screen pages */
  .mob-nts-page{display:none;position:fixed;inset:0;z-index:300;background:var(--bg);flex-direction:column;contain:layout style paint}
  .mob-nts-page .mob-nts-body{width:100%;height:100%;display:flex;flex-direction:column;overflow:hidden}
  .mob-nts-page.open{display:flex;animation:_taxPageIn .3s cubic-bezier(.32,1,.23,1) both}
  .mob-nts-page.closing{animation:_taxPageOut .25s cubic-bezier(.4,0,1,1) both}
  @keyframes _taxPageIn{from{transform:translateX(100%)}to{transform:translateX(0)}}
  @keyframes _taxPageOut{from{transform:translateX(0)}to{transform:translateX(100%)}}
  .mob-nts-after-lbl{flex:1;background:var(--surface);border:0.5px solid var(--border);border-radius:8px;color:var(--text);font-size:15px;padding:6px 10px;min-width:0;-webkit-appearance:none}
  .mob-nts-after-lbl:focus{outline:none;border-color:var(--accent)}
  /* Inline-editable deduction card rows — inherits .mob-nts-row layout */
  .mob-nts-ded-lbl-inp{flex:1;min-width:0;background:transparent;border:none;color:var(--text);font-size:15px;padding:0;outline:none;-webkit-appearance:none}
  .mob-nts-ded-lbl-inp::placeholder{color:var(--muted)}
  .mob-nts-ded-del-btn{background:none;border:none;color:var(--muted);font-size:18px;line-height:1;padding:0 2px;cursor:pointer;flex-shrink:0;-webkit-tap-highlight-color:transparent}
  .mob-nts-ded-del-btn:active{color:var(--red,#ef4444)}
  /* ── Mobile Detail Page ── */
  .mob-detail-page{display:none;position:fixed;inset:0;z-index:300;background:var(--bg);flex-direction:column;contain:layout style paint}
  .mob-detail-page.open{display:flex}
  .mob-detail-scroll{flex:1;overflow-y:auto;padding:0 0 calc(env(safe-area-inset-bottom,0px) + 32px);overscroll-behavior:none;-webkit-overflow-scrolling:touch}
  /* ── Breakdown row styles (used inside the detail page) ── */
  .mob-bd-group{background:var(--surface);border-radius:13px;margin:12px 12px 0;border:0.5px solid var(--border);overflow:hidden}
  .mob-bd-section-hdr{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);padding:10px 14px 4px;background:var(--bg)}
  .mob-bd-row{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;border-top:0.5px solid var(--border);font-size:14px}
  .mob-bd-lbl{color:var(--text);flex:1;min-width:0}
  .mob-bd-units{font-size:12px;color:var(--muted)}
  .mob-bd-val{font-weight:600;font-size:14px;color:var(--text);flex-shrink:0;margin-left:8px}
  .mob-bd-val.neg{color:var(--red,#ef4444)}
  .mob-bd-val.pos{color:var(--green,#22c55e)}
  .mob-bd-val.accent{color:var(--accent)}
  .mob-bd-total{font-weight:700;font-size:15px;padding:12px 14px}
  .mob-bd-net{font-weight:700;font-size:15px;padding:12px 14px;border-top:1px solid var(--border)}
  /* Legacy body class kept for overscroll rule */
  .mob-nts-body{padding:0}

  /* Mobile timesheet — day-tab strip + panel */
  .mob-ts{display:flex;flex-direction:column;padding:0}
  /* Horizontal scrolling day tab strip (default / long periods) */
  .mob-day-tabs{display:flex;gap:6px;overflow-x:auto;padding:12px 14px 10px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .mob-day-tabs::-webkit-scrollbar{display:none}
  /* Grid strip for 7-day (1 row) and 14-day (2 rows) periods */
  .mob-day-tabs.grid-7,.mob-day-tabs.grid-14{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;padding:10px 12px;overflow:visible;width:100%;box-sizing:border-box}
  /* Column day-name headers */
  .mob-col-hdr{font-size:9px;font-weight:700;color:var(--muted);text-align:center;padding:4px 0 2px;text-transform:uppercase;letter-spacing:.2px}
  .mob-col-hdr-wknd{color:var(--amber)}
  /* Day tabs */
  .mob-day-tab{flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:2px;padding:5px 2px;border-radius:8px;border:1px solid var(--border);background:var(--surface2);cursor:pointer;-webkit-tap-highlight-color:transparent;min-width:44px}
  .mob-day-tabs.grid-7 .mob-day-tab,.mob-day-tabs.grid-14 .mob-day-tab{min-width:0}
  /* Row divider between week 1 and week 2 in bi-weekly grid */
  .mob-day-tabs.grid-14{row-gap:4px;position:relative}
  .mob-week-sep{grid-column:1/-1;height:1px;background:var(--border);margin:2px 0}
  .mob-day-tab:active{opacity:.7}
  .mob-day-tab.active{background:var(--accent);border-color:var(--accent)}
  .mob-day-tab.today-tab:not(.active){border-color:var(--accent)}
  /* Soft weekend tint */
  .mob-day-tab.weekend-tab:not(.active){background:rgba(251,191,36,.12);border-color:rgba(251,191,36,.3)}
  /* Date number */
  .mob-day-tab-date{font-size:13px;font-weight:700;color:var(--text);line-height:1}
  .mob-day-tab.active .mob-day-tab-date{color:#fff}
  .mob-day-tab.today-tab:not(.active) .mob-day-tab-date{color:var(--accent)}
  .mob-day-tab.weekend-tab:not(.active) .mob-day-tab-date{color:var(--amber)}
  /* Dollar amount */
  .mob-day-tab-amt{font-size:8px;font-weight:700;color:var(--accent);line-height:1;min-height:9px;text-align:center;white-space:nowrap}
  .mob-day-tab.active .mob-day-tab-amt{color:rgba(255,255,255,.9)}
  .mob-day-tab.weekend-tab:not(.active) .mob-day-tab-amt{color:var(--amber)}
  /* Single day panel */
  .mob-day-panel{margin:0 12px 12px;background:var(--surface);border:1px solid var(--border);border-radius:10px;overflow:hidden}
  .mob-panel-hdr{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid var(--border);background:var(--surface2)}
  .mob-panel-title{font-size:14px;font-weight:700;color:var(--text)}
  .mob-panel-title.today-title{color:var(--accent)}
  .mob-panel-sub{font-size:11px;color:var(--muted)}
  .mob-panel-badge{background:var(--accent-light);color:var(--accent);font-size:11px;font-weight:700;padding:3px 10px;border-radius:20px}
  .mob-panel-badge.zero{background:var(--surface);color:var(--muted)}
  .mob-panel-body{padding:4px 14px 14px}
  .mob-row{display:flex;align-items:center;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--border)}
  .mob-row:last-child{border-bottom:none}
  .mob-row-lbl{font-size:13px;color:var(--text);flex:1}
  .mob-row-sub{font-size:10px;color:var(--muted);display:block;margin-top:1px}
  .mob-stepper{display:flex;align-items:center;gap:6px;flex-shrink:0}
  .mob-step-btn{width:40px;height:40px;border:1px solid var(--border);background:var(--surface2);border-radius:8px;font-size:22px;line-height:1;cursor:pointer;color:var(--text);display:flex;align-items:center;justify-content:center;flex-shrink:0;-webkit-tap-highlight-color:transparent;user-select:none}
  .mob-step-btn:active{background:var(--accent);color:#fff;border-color:var(--accent)}
  .mob-row-input{width:54px;padding:8px 4px;background:var(--surface2);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:16px;text-align:center;-moz-appearance:textfield}
  .mob-row-input::-webkit-inner-spin-button,.mob-row-input::-webkit-outer-spin-button{-webkit-appearance:none}
  .mob-row-input:focus{border-color:var(--accent);outline:none;background:var(--surface)}
  .mob-sec-hdr{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);padding:12px 0 4px}
  .mob-day-total{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;margin-top:4px;background:var(--surface2);border-top:1px solid var(--border)}
  .mob-day-total-lbl{font-size:11px;font-weight:600;color:var(--muted)}
  .mob-day-total-val{font-size:14px;font-weight:700;color:var(--accent)}

  /* ── Day card list ──────────────────────────────────────────── */
  .mob-day-list{display:flex;flex-direction:column;gap:8px;padding:4px 12px 100px}
  .mob-day-card{display:flex;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:14px 12px 14px 16px;cursor:pointer;position:relative;overflow:hidden;-webkit-tap-highlight-color:transparent}
  .mob-day-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--border);border-radius:10px 0 0 10px}
  .mob-day-card.is-today::before{background:var(--accent)}
  .mob-day-card.is-weekend{background:rgba(251,191,36,.07)}
  .mob-day-card.is-weekend::before{background:var(--amber)}
  .mob-day-card:active{opacity:.7}
  .mob-dc-left{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
  .mob-dc-dayname{font-size:15px;font-weight:700;color:var(--text)}
  .mob-day-card.is-today .mob-dc-dayname{color:var(--accent)}
  .mob-day-card.is-weekend .mob-dc-dayname{color:var(--accent)}
  .mob-dc-right{display:flex;flex-direction:column;align-items:flex-end;gap:2px;flex-shrink:0}
  .mob-dc-hrs{font-size:11px;color:var(--muted)}
  .mob-dc-amt{font-size:17px;font-weight:700;color:var(--text)}
  .mob-dc-empty{font-size:22px;color:var(--border)}
  .mob-dc-chevron{font-size:22px;color:var(--accent);flex-shrink:0;margin-left:4px}
  .mob-week-divider{display:flex;align-items:center;gap:10px;padding:4px 4px;margin-top:4px}
  .mob-week-divider::before,.mob-week-divider::after{content:'';flex:1;height:1px;background:var(--border)}
  .mob-week-divider span{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);white-space:nowrap}
  /* Day card name row — dot inline left of day name */
  .mob-dc-name-row{display:flex;align-items:baseline;gap:6px}
  .mob-dc-note-dot{width:7px;height:7px;border-radius:50%;background:#f59e0b;flex-shrink:0;align-self:center}
  /* Day card chips row (date moved to name row) */
  .mob-dc-date-row{display:flex;align-items:center;flex-wrap:wrap;gap:4px;margin-top:2px;min-height:0}
  .mob-dc-date{font-size:13px;color:var(--muted);font-weight:400;white-space:nowrap;flex-shrink:0}
  .mob-dc-tag-chip{font-size:9px;font-weight:700;padding:2px 7px;border-radius:10px;background:rgba(0,122,255,.1);color:var(--accent);white-space:nowrap;flex-shrink:0;line-height:1.4}
  .mob-dc-shift-chip{font-size:9px;font-weight:600;padding:2px 6px;border-radius:10px;background:rgba(52,199,89,.13);color:#28a745;white-space:nowrap;flex-shrink:0;line-height:1.4}
  .mob-dc-combo-chip{font-size:9px;font-weight:700;padding:2px 7px;border-radius:10px;background:rgba(175,82,222,.13);color:#9b59b6;white-space:nowrap;flex-shrink:0;line-height:1.4}
  .mob-dc-sched-chip{font-size:9px;font-weight:600;padding:2px 6px;border-radius:10px;background:rgba(255,149,0,.13);color:#c97a00;white-space:nowrap;flex-shrink:0;line-height:1.4}
  .mob-dc-sched-chip.is-off{background:rgba(142,142,147,.13);color:var(--muted)}
  .mob-dc-time-label{font-size:10px;font-weight:700;color:var(--accent);margin-left:4px;white-space:nowrap}
  /* Notes sheet chip grid */
  .mob-ns-chip-row{display:flex;flex-wrap:wrap;gap:8px;padding:4px 0 8px;min-height:20px}
  .mob-ns-preset-chip{padding:8px 18px;border-radius:20px;border:1.5px solid var(--accent);background:none;color:var(--accent);font-size:14px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .12s,color .12s}
  .mob-ns-preset-chip.on{background:var(--accent);color:#fff}
  .mob-ns-preset-chip.editing{border-color:var(--muted);color:var(--muted)}
  .mob-ns-preset-chip.editing.sel{border-color:var(--accent);color:var(--accent);background:rgba(0,122,255,.08)}
  .mob-ns-chip-x{font-size:11px;opacity:.8}
  .mob-ns-preset-chip:active{opacity:.7}
  /* Note textarea */
  .mob-ns-note-area{width:100%;box-sizing:border-box;min-height:110px;font-size:15px;line-height:1.5;border:1.5px solid var(--border);border-radius:12px;padding:12px 14px;background:var(--surface2);color:var(--text);outline:none;resize:none;font-family:inherit}
  .mob-ns-note-area:focus{border-color:var(--accent)}
  /* Day detail note preview card */
  .mob-dd-note-preview{display:none;margin-top:12px;padding-top:10px;border-top:0.5px solid var(--border);cursor:pointer;-webkit-tap-highlight-color:transparent}
  .mob-dd-note-preview.visible{display:block}
  .mob-dd-note-preview-label{font-size:10px;font-weight:700;color:#d97706;text-transform:uppercase;letter-spacing:.4px;margin-bottom:3px}
  .mob-dd-note-preview-text{font-size:13px;color:var(--text);line-height:1.4;white-space:pre-wrap;word-break:break-word}
  .mob-dd-preview-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
  .mob-dd-preview-tag{font-size:13px;font-weight:600;padding:4px 11px;border-radius:20px;background:rgba(0,122,255,.12);color:var(--accent)}
  .mob-dd-preview-shift{font-size:13px;font-weight:600;padding:4px 11px;border-radius:20px;background:rgba(52,199,89,.13);color:#28a745}
  .mob-dd-preview-combo{font-size:13px;font-weight:600;padding:4px 11px;border-radius:20px;background:rgba(175,82,222,.13);color:#9b59b6}
  /* Day detail tags */
  .mob-dd-tags-section{display:flex;gap:6px;flex-wrap:wrap;align-items:center;padding:10px 12px 0}
  /* Notes bar — fixed lower section in day detail body */
  .mob-dd-notes-bar{display:flex;flex-direction:column;gap:5px;padding:10px 0 2px;margin-top:10px;border-top:0.5px solid var(--border)}
  .mob-dd-notes-bar-header{display:flex;align-items:center;justify-content:space-between}
  .mob-dd-notes-bar-label{font-size:11px;font-weight:700;color:#d97706;text-transform:uppercase;letter-spacing:.5px}
  .mob-dd-notes-bar-text{font-size:13px;color:var(--text);line-height:1.4;white-space:pre-wrap;word-break:break-word}
  .mob-dd-notes-bar-chips{display:flex;flex-wrap:wrap;gap:5px;align-items:center}
  .mob-dd-notes-bar-plus{background:none;border:none;color:var(--accent);font-size:16px;font-weight:400;cursor:pointer;-webkit-tap-highlight-color:transparent;flex-shrink:0;padding:0;line-height:1}
  .mob-dd-notes-bar-plus:active{opacity:.5}
  /* Notes full-page sheet */
  .mob-notes-sheet{position:fixed;inset:0;z-index:4000;background:var(--surface);transform:translateX(100%);transition:transform .28s cubic-bezier(.32,1,.32,1);display:flex;flex-direction:column}
  .mob-notes-sheet.open{transform:translateX(0)}
  .mob-ns-header{display:flex;align-items:center;gap:12px;padding:56px 16px 14px;border-bottom:0.5px solid var(--border);flex-shrink:0;background:var(--surface)}
  .mob-ns-back{background:none;border:none;font-size:24px;color:var(--accent);padding:4px 8px 4px 0;cursor:pointer;-webkit-tap-highlight-color:transparent;line-height:1}
  .mob-ns-title{font-size:18px;font-weight:700;color:var(--text);flex:1}
  .mob-ns-edit-toggle{background:none;border:none;font-size:15px;font-weight:600;color:var(--accent);cursor:pointer;-webkit-tap-highlight-color:transparent;padding:4px 0}
  .mob-ns-body{flex:1;overflow-y:auto;padding:0 0 40px}
  .mob-ns-section{padding:20px 16px 8px}
  .mob-ns-section+.mob-ns-section{border-top:0.5px solid var(--border)}
  .mob-ns-section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
  .mob-ns-section-label{font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.6px}
  .mob-ns-add-mini{background:none;border:none;color:var(--accent);font-size:22px;font-weight:300;line-height:1;cursor:pointer;-webkit-tap-highlight-color:transparent;padding:0}
  .mob-ns-add-mini:active{opacity:.5}
  .mob-ns-item{display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:0.5px solid var(--border)}
  .mob-ns-item-text{font-size:13px;color:var(--accent);font-weight:600}
  .mob-ns-item-time{font-weight:600;color:var(--accent)}
  .mob-ns-del{background:none;border:none;color:var(--muted);font-size:16px;padding:4px 8px;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .mob-ns-empty{font-size:14px;color:var(--muted);padding:4px 0 8px}
  /* Notes sheet forms */
  .mob-ns-form{margin:10px 0 4px;border-radius:14px;border:1.5px solid var(--border);background:var(--surface,#fff);padding:14px 16px;display:flex;flex-direction:column;gap:14px}
  .mob-ns-form.editing{border-color:var(--accent)}
  .mob-ns-form-label{font-size:12px;color:var(--muted);font-weight:500}
  .mob-ns-form-label strong{color:var(--text);font-weight:700}
  .mob-ns-form-input{width:100%;box-sizing:border-box;font-size:16px;font-family:inherit;border:none;border-bottom:1.5px solid var(--accent);padding:6px 0 8px;background:transparent;color:var(--text);outline:none}
  .mob-ns-form-input::placeholder{color:var(--muted)}
  .mob-ns-form-row{display:flex;gap:8px;align-items:center;justify-content:flex-end}
  .mob-ns-form-btn{padding:9px 20px;border-radius:22px;font-size:14px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent;font-family:inherit;white-space:nowrap}
  .mob-ns-form-btn.cancel{border:1.5px solid var(--border);background:none;color:var(--muted)}
  .mob-ns-form-btn.save{border:none;background:var(--accent);color:#fff;font-weight:700;padding:9px 24px}
  .mob-ns-form-btn.delete{border:1.5px solid var(--red,#ff3b30);background:none;color:var(--red,#ff3b30)}
  .mob-dd-tag-pill{padding:5px 11px;border-radius:20px;border:1.5px solid var(--border);background:transparent;color:var(--muted);font-size:11px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-appearance:none;appearance:none;font-family:inherit}
  .mob-dd-tag-pill.on{background:rgba(0,122,255,.1);border-color:var(--accent);border-width:2px;color:var(--accent)}
  .mob-dd-tag-pill.on:active,.mob-dd-tag-pill:active{opacity:.7}
  .mob-dd-tag-add-btn{padding:5px 11px;border-radius:20px;border:1.5px dashed var(--border);background:transparent;color:var(--muted);font-size:11px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-appearance:none;appearance:none;font-family:inherit}

  /* ── Day detail overlay ──────────────────────────────────────── */
  .mob-dd-overlay{display:none;position:fixed;inset:0;top:calc(50px + env(safe-area-inset-top,0px));z-index:150;background:var(--bg);flex-direction:column;contain:layout style paint}
  .mob-dd-overlay.open{display:flex}
  .mob-dd-sheet{display:block;height:100%;overflow-y:auto;overscroll-behavior:contain}
  /* Sticky wrapper: hero + action row, always full size */
  .mob-dd-hdr-wrap{position:sticky;top:0;z-index:10;background:var(--bg)}
  .mob-dd-topbar{padding:10px 16px 0;background:var(--bg)}
  .mob-dd-sticky{position:static;background:transparent}
  .mob-dd-back{background:none;border:none;font-size:16px;font-weight:600;color:var(--accent);cursor:pointer;padding:4px 0;white-space:nowrap;-webkit-tap-highlight-color:transparent}
  .mob-dd-hero{background:var(--surface);border:0.5px solid var(--border);border-radius:18px;padding:16px 16px 14px;display:flex;flex-direction:column;gap:0}
  .mob-dd-hero-main{display:flex;align-items:center;gap:0}
  .mob-dd-nav{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;min-width:0;gap:6px}
  .mob-dd-nav-btn{background:none;border:none;font-size:26px;line-height:1;font-weight:600;color:var(--accent);cursor:pointer;padding:4px 10px;border-radius:10px;-webkit-tap-highlight-color:transparent;transition:background .12s;flex-shrink:0}
  .mob-dd-nav-btn:active{background:rgba(0,122,255,.12)}
  .mob-dd-nav-btn:disabled{color:var(--muted);opacity:.25;pointer-events:none}
  .mob-dd-co-name{font-size:11px;font-weight:600;color:var(--muted);text-align:center;letter-spacing:.3px;text-transform:uppercase}
  .mob-dd-title{font-size:18px;font-weight:700;color:var(--text);text-align:center;line-height:1.1}
  .mob-dd-title.is-today{color:var(--accent)}
  .mob-dd-sched-sub{font-size:12px;font-weight:600;color:var(--muted);text-align:center;margin-top:1px;letter-spacing:.1px}
  .mob-dd-total{font-size:26px;font-weight:700;color:var(--accent);text-align:center;line-height:1;margin-top:2px}
  .mob-dd-body{padding:0 0 120px}
  .mob-dd-body .mob-dd-notes-bar{margin:0 16px;border-top:none;border-bottom:0.5px solid var(--border);padding-bottom:10px}
  .mob-dd-sec-hdr{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);padding:18px 16px 6px}
  .mob-dd-row{border-bottom:1px solid var(--border);display:flex;flex-direction:column;transition:background .15s}
  .mob-dd-row.is-active{background:rgba(0,122,255,.04)}
  .mob-dd-row-main{display:flex;align-items:center;gap:10px;padding:13px 16px;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .mob-dd-lbl-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
  .mob-dd-lbl{font-size:15px;font-weight:600;color:var(--text)}
  .mob-dd-rate{font-size:11px;color:var(--muted);display:flex;align-items:center;gap:5px}
  .mob-dd-sec-tag{font-size:9px;font-weight:700;padding:1px 5px;border-radius:4px;letter-spacing:.3px;flex-shrink:0}
  .mob-dd-sec-tag-401k{background:rgba(0,122,255,.15);color:var(--accent)}
  .mob-dd-sec-tag-non{background:rgba(251,191,36,.15);color:var(--amber)}
  .mob-dd-row-right{display:flex;align-items:center;gap:8px;flex-shrink:0}
  .mob-dd-chevron{font-size:14px;color:var(--muted);transition:transform .2s;flex-shrink:0;line-height:1;pointer-events:none;margin-left:2px}
  .mob-dd-row.is-expanded .mob-dd-chevron{transform:rotate(180deg);color:var(--accent)}
  .mob-dd-cur-hrs{font-size:13px;font-weight:600;color:var(--accent)}
  .mob-dd-cur-empty{color:var(--border);font-size:18px;font-weight:400}
  .mob-dd-pin{min-width:46px;height:44px;border:1px solid var(--border);background:var(--surface2);border-radius:10px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;padding:4px 8px;-webkit-tap-highlight-color:transparent;flex-shrink:0}
  .mob-dd-pin .mob-pt-card-hrs{font-size:13px;font-weight:700;color:var(--muted);line-height:1}
  .mob-dd-pin .mob-pt-card-hrs.empty{font-size:13px;font-weight:300;color:var(--border)}
  .mob-dd-pin-label{font-size:10px;font-weight:600;color:var(--muted);opacity:.7;line-height:1}
  .mob-dd-pin.is-set{background:var(--surface2);border-color:var(--accent);border-width:1.5px}
  .mob-dd-pin.is-set .mob-pt-card-hrs,.mob-dd-pin.is-set .mob-dd-pin-label{color:var(--text);opacity:1}
  .mob-dd-pin.is-double{background:var(--accent);border-color:var(--accent);border-width:1.5px}
  .mob-dd-pin.is-double .mob-pt-card-hrs,.mob-dd-pin.is-double .mob-dd-pin-label{color:#fff;opacity:1}
  .mob-dd-pin:active{background:rgba(0,122,255,.1);border-color:var(--accent);border-width:1.5px}
  .mob-dd-pin:active .mob-pt-card-hrs,.mob-dd-pin:active .mob-dd-pin-label{color:var(--text);opacity:1}
  .mob-dd-action-row{display:flex;align-items:center;justify-content:center;gap:8px;padding:16px 16px 8px}
  .mob-dd-add-btn,.mob-dd-copy-btn,.mob-dd-clear-btn,.mob-dd-done-btn,.mob-dd-note-btn{flex:1;padding:9px 4px;display:flex;align-items:center;justify-content:center;gap:5px;background:transparent;border:1.5px solid rgba(0,122,255,.4);border-radius:20px;color:var(--accent);font-size:12px;font-weight:600;line-height:1;cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-appearance:none;appearance:none;white-space:nowrap;box-sizing:border-box}
  .mob-dd-add-btn:active,.mob-dd-copy-btn:active,.mob-dd-clear-btn:active,.mob-dd-done-btn:active,.mob-dd-note-btn:active{background:rgba(0,122,255,.08);border-color:var(--accent);border-width:2px}
  .mob-dd-done-btn.active-fill{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:700}
  .mob-dd-note-btn.has-note{border-color:rgba(251,191,36,.6);color:#d97706}
  /* Copy-to-days sheet */
  .mob-copy-backdrop{display:none;position:fixed;inset:0;z-index:300;background:rgba(0,0,0,.45)}
  .mob-copy-backdrop.open{display:block}
  /* Note sheet */
  .mob-note-backdrop{display:none;position:fixed;inset:0;z-index:400;background:rgba(0,0,0,.5)}
  .mob-note-backdrop.open{display:block}
  @keyframes _noteIn{from{opacity:0;transform:translate(-50%,-50%) scale(.93)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
  .mob-note-sheet{position:fixed;top:50%;left:50%;width:calc(100% - 36px);max-width:360px;z-index:401;background:var(--surface);border-radius:20px;padding:18px 18px 18px;display:none;flex-direction:column;gap:12px;max-height:85vh;overflow-y:auto;-webkit-overflow-scrolling:touch}
  .mob-note-sheet.open{display:flex;animation:_noteIn .22s cubic-bezier(.32,1,.23,1) both}
  .mob-note-header{display:flex;align-items:center;justify-content:space-between}
  .mob-note-title{font-size:15px;font-weight:700;color:var(--text)}
  .mob-note-close{background:none;border:none;color:var(--muted);font-size:22px;line-height:1;cursor:pointer;padding:0 2px;-webkit-tap-highlight-color:transparent}
  .mob-note-tags-wrap{display:none;flex-direction:column;gap:8px;background:var(--surface2);border-radius:14px;padding:11px 12px}
  .mob-note-tags-wrap.visible{display:flex}
  .mob-note-tags-label{font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
  .mob-note-tags-pills{display:flex;flex-wrap:wrap;gap:7px;align-items:center}
  .mob-note-tag-pill{padding:8px 15px;border-radius:20px;border:1.5px solid var(--border-md);background:transparent;color:var(--text);font-size:14px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-appearance:none;appearance:none;font-family:inherit}
  .mob-note-tag-pill.on{background:rgba(0,122,255,.12);border-color:var(--accent);border-width:2px;color:var(--accent)}
  .mob-note-tag-pill:active,.mob-note-tag-pill.on:active{opacity:.7}
  .mob-note-tag-add{padding:8px 15px;border-radius:20px;border:1.5px dashed var(--border-md);background:transparent;color:var(--muted);font-size:14px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-appearance:none;appearance:none;font-family:inherit}
  .mob-note-custom-row{display:inline-flex;align-items:center;gap:2px}
  .mob-note-tag-del{background:none;border:none;color:var(--muted);font-size:13px;cursor:pointer;padding:3px 5px;-webkit-tap-highlight-color:transparent;border-radius:10px;line-height:1;font-family:inherit;opacity:.6}
  .mob-note-tag-del:active{opacity:1;color:var(--red)}
  .mob-note-textarea{width:100%;min-height:90px;resize:none;background:var(--surface2);border:1px solid var(--border);border-radius:12px;padding:11px 12px;font-size:14px;color:var(--text);outline:none;font-family:inherit;box-sizing:border-box;-webkit-appearance:none}
  .mob-note-textarea::placeholder{color:var(--muted)}
  .mob-note-textarea:focus{border-color:var(--accent)}
  .mob-note-actions{display:flex;gap:10px}
  .mob-note-cancel{flex:1;height:44px;border-radius:14px;border:1.5px solid var(--border);background:transparent;color:var(--muted);font-size:14px;font-weight:600;cursor:pointer}
  .mob-note-save{flex:1;height:44px;border-radius:14px;border:none;background:var(--accent);color:#fff;font-size:14px;font-weight:700;cursor:pointer}
  .mob-note-save:active{opacity:.8}
  .mob-note-cancel:active{opacity:.7}
  /* Day detail More sheet (reuses mob-more styles) */
  .mob-dd-more-backdrop{display:none;position:fixed;inset:0;z-index:300;background:rgba(0,0,0,.45)}
  .mob-dd-more-backdrop.open{display:block}
  .mob-dd-more-sheet{position:fixed;left:16px;right:16px;bottom:calc(80px + env(safe-area-inset-bottom,0px));z-index:301;background:var(--surface);border-radius:16px;padding:6px 0;display:none;flex-direction:column;box-shadow:0 8px 32px rgba(0,0,0,.25);transform:translateY(8px) scale(.97);opacity:0;transition:transform .2s cubic-bezier(.32,1,.23,1),opacity .2s}
  .mob-dd-more-sheet.open{display:flex;transform:translateY(0) scale(1);opacity:1}
  .mob-copy-sheet{display:none;position:fixed;bottom:0;left:0;right:0;z-index:301;background:var(--surface);border-radius:18px 18px 0 0;padding:0 0 32px;box-shadow:0 -4px 24px rgba(0,0,0,.3);transform:translateY(100%);transition:transform .25s cubic-bezier(.32,1,.23,1)}
  .mob-copy-sheet.open{display:block;transform:translateY(0)}
  .mob-copy-handle{width:36px;height:4px;background:var(--border);border-radius:2px;margin:12px auto 4px}
  .mob-copy-title{font-size:15px;font-weight:700;color:var(--text);padding:8px 20px 14px;border-bottom:1px solid var(--border)}
  /* Multi-select mode */
  .mob-multi-bar{display:flex;align-items:center;justify-content:center;gap:8px;padding:8px 16px 8px;position:sticky;top:calc(50px + env(safe-area-inset-top,0px));z-index:91;background:var(--bg)}
  .mob-multi-btn{flex:1;height:36px;display:flex;align-items:center;justify-content:center;border-radius:20px;border:1.5px solid rgba(0,122,255,.4);background:transparent;color:var(--accent);font-size:12px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent;line-height:1;padding:0;-webkit-appearance:none;appearance:none;box-sizing:border-box}
  .mob-multi-btn:active{background:rgba(0,122,255,.08);border-color:var(--accent);border-width:2px}
  .mob-multi-btn.active{background:rgba(0,122,255,.1);border-color:var(--accent);border-width:2px;color:var(--accent);font-weight:700}
  .mob-multi-btn.active-fill{background:#0055cc;border-color:#0055cc;border-width:2px;color:#fff;font-weight:700}
  /* More sheet (bottom sheet — Tax Settings, Period Note, etc.) */
  .mob-more-backdrop{display:none;position:fixed;inset:0;z-index:300;background:rgba(0,0,0,.45)}
  .mob-more-backdrop.open{display:block}
  .mob-more-sheet{position:fixed;bottom:0;left:0;right:0;z-index:301;background:var(--surface);border-radius:18px 18px 0 0;padding:0 0 max(32px,env(safe-area-inset-bottom,32px));box-shadow:0 -4px 24px rgba(0,0,0,.3);transform:translateY(100%);transition:transform .25s cubic-bezier(.32,1,.23,1)}
  .mob-more-sheet.open{transform:translateY(0)}
  .mob-more-title{font-size:13px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;padding:14px 20px 8px}
  .mob-more-item{display:flex;align-items:center;gap:14px;width:100%;padding:16px 20px;background:none;border:none;border-top:0.5px solid var(--border);color:var(--text);font-size:15px;font-weight:500;cursor:pointer;-webkit-tap-highlight-color:transparent;text-align:left;font-family:inherit}
  .mob-more-item:active{background:var(--surface2)}
  .mob-more-item-icon{font-size:18px;width:24px;text-align:center;flex-shrink:0}
  .mob-more-item-note{margin-left:auto;width:7px;height:7px;border-radius:50%;background:#f59e0b;display:none}
  .mob-more-item-note.has-note{display:block}

  /* Side-drawer menu */
  .mob-drawer-backdrop{display:none;position:fixed;inset:0;z-index:300;background:rgba(0,0,0,.5);-webkit-tap-highlight-color:transparent}
  .mob-drawer-backdrop.open{display:block}
  .mob-drawer{position:fixed;top:0;right:0;bottom:0;width:min(300px,85vw);z-index:301;background:var(--bg);display:flex;flex-direction:column;transform:translateX(105%);transition:transform .28s cubic-bezier(.32,1,.23,1);box-shadow:-8px 0 32px rgba(0,0,0,.35);overflow:hidden}
  .mob-drawer.open{transform:translateX(0)}
  /* Header — matches blue topbar */
  .mob-drawer-header{background:#007AFF;padding:calc(env(safe-area-inset-top,0px) + 20px) 20px 20px;flex-shrink:0}
  .mob-drawer-avatar{width:50px;height:50px;border-radius:50%;background:rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700;color:#fff;margin-bottom:10px;border:1.5px solid rgba(255,255,255,.35)}
  .mob-drawer-name{font-size:16px;font-weight:700;color:#fff;line-height:1.2}
  .mob-drawer-email{font-size:12px;color:rgba(255,255,255,.72);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .mob-drawer-synced{display:flex;align-items:center;gap:4px;margin-top:7px;font-size:11px;color:rgba(255,255,255,.85);font-weight:600}
  /* Nav — matches mob-more-item style */
  .mob-drawer-nav{flex:1;overflow-y:auto;background:var(--surface);padding:0}
  .mob-drawer-section-label{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;padding:14px 20px 6px}
  .mob-drawer-item{display:flex;align-items:center;gap:14px;width:100%;padding:15px 20px;background:none;border:none;border-top:0.5px solid var(--border);color:var(--text);font-size:15px;font-weight:500;cursor:pointer;-webkit-tap-highlight-color:transparent;text-align:left;font-family:inherit}
  .mob-drawer-item:first-child{border-top:none}
  .mob-drawer-item:active{background:var(--surface2)}
  .mob-drawer-icon{font-size:17px;width:26px;text-align:center;flex-shrink:0;line-height:1}
  .mob-drawer-chevron{margin-left:auto;color:var(--muted);font-size:16px;line-height:1;opacity:.6}
  /* Settings rows */
  .mob-drawer-theme-row{padding:13px 20px;border-top:0.5px solid var(--border);display:flex;align-items:center;gap:12px;background:var(--surface)}
  .mob-drawer-theme-label{font-size:15px;font-weight:500;color:var(--text);flex-shrink:0}
  .mob-drawer-theme-seg{display:flex;flex:1;background:var(--surface2);border-radius:8px;padding:3px;gap:2px}
  .mob-drawer-theme-btn{flex:1;padding:6px 0;border:none;border-radius:6px;background:transparent;color:var(--muted);font-size:12px;font-weight:600;cursor:pointer;font-family:inherit;-webkit-tap-highlight-color:transparent;transition:background .15s,color .15s}
  .mob-drawer-theme-btn.active{background:var(--surface);color:var(--text);box-shadow:0 1px 4px rgba(0,0,0,.2)}
  /* Footer */
  .mob-drawer-footer{padding:12px 16px calc(max(20px,env(safe-area-inset-bottom,20px)) + 12px);border-top:0.5px solid var(--border);background:var(--surface);flex-shrink:0}
  .mob-drawer-signout{width:100%;padding:13px;border-radius:12px;border:1.5px solid rgba(255,59,48,.35);background:rgba(255,59,48,.07);color:#ff3b30;font-size:15px;font-weight:600;cursor:pointer;font-family:inherit;-webkit-tap-highlight-color:transparent}
  .mob-drawer-signout:active{background:rgba(255,59,48,.14)}
  .mob-drawer-signin{width:100%;padding:13px;border-radius:12px;border:none;background:#007AFF;color:#fff;font-size:15px;font-weight:600;cursor:pointer;font-family:inherit;-webkit-tap-highlight-color:transparent}
  .mob-drawer-signin:active{opacity:.85}

  /* Mobile profile overlay */
  .mob-prof-overlay{position:fixed;inset:0;z-index:400;background:var(--bg);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .3s cubic-bezier(.32,1,.23,1)}
  .mob-prof-overlay.open{transform:translateX(0)}
  .mob-prof-topbar{display:flex;align-items:center;justify-content:space-between;padding:calc(env(safe-area-inset-top,0px) + 12px) 16px 12px;background:var(--surface);border-bottom:0.5px solid var(--border);flex-shrink:0}
  .mob-prof-back{background:none;border:none;color:#007AFF;font-size:17px;cursor:pointer;font-family:inherit;padding:4px 0;-webkit-tap-highlight-color:transparent}
  .mob-prof-title{font-size:17px;font-weight:700;color:var(--text)}
  .mob-prof-save{background:none;border:none;color:#007AFF;font-size:17px;font-weight:600;cursor:pointer;font-family:inherit;padding:4px 0;-webkit-tap-highlight-color:transparent}
  .mob-prof-body{flex:1;overflow-y:auto;padding:28px 20px calc(max(32px,env(safe-area-inset-bottom,32px)) + 16px)}
  .mob-prof-avatar-wrap{display:flex;justify-content:center;margin-bottom:8px}
  .mob-prof-avatar{width:80px;height:80px;border-radius:50%;background:#007AFF;display:flex;align-items:center;justify-content:center;font-size:34px;font-weight:700;color:#fff}
  .mob-prof-email-row{text-align:center;color:var(--muted);font-size:13px;margin-bottom:28px;margin-top:4px}
  .mob-prof-section{margin-bottom:16px}
  .mob-prof-label{display:block;font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;margin-bottom:6px}
  .mob-prof-input{width:100%;padding:13px 14px;border-radius:12px;border:1.5px solid var(--border-md);background:var(--surface);color:var(--text);font-size:15px;font-family:inherit;outline:none;box-sizing:border-box;-webkit-appearance:none;appearance:none}
  .mob-prof-input:focus{border-color:#007AFF}
  select.mob-prof-input{cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23888' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:36px}

  /* Subscription overlay */
  .mob-sub-billing-toggle{display:flex;background:var(--surface2);border-radius:10px;padding:3px;gap:2px;margin:0 0 24px}
  .mob-sub-billing-btn{flex:1;padding:8px;border:none;border-radius:8px;background:transparent;color:var(--muted);font-size:13px;font-weight:600;cursor:pointer;font-family:inherit;-webkit-tap-highlight-color:transparent;transition:background .15s,color .15s;position:relative}
  .mob-sub-billing-btn.active{background:var(--surface);color:var(--text);box-shadow:0 1px 4px rgba(0,0,0,.2)}
  .mob-sub-save-badge{position:absolute;top:-8px;right:-4px;background:#34c759;color:#fff;font-size:9px;font-weight:700;padding:2px 5px;border-radius:6px;letter-spacing:.2px}
  .mob-sub-card{border-radius:18px;padding:20px;margin-bottom:14px;border:2px solid var(--border);background:var(--surface);position:relative}
  .mob-sub-card.current{border-color:#007AFF;background:rgba(0,122,255,.06)}
  .mob-sub-card-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin-bottom:6px}
  .mob-sub-card-name{font-size:22px;font-weight:800;color:var(--text);margin-bottom:2px}
  .mob-sub-card-price{font-size:32px;font-weight:800;color:var(--text);letter-spacing:-1px;line-height:1}
  .mob-sub-card-per{font-size:13px;color:var(--muted);font-weight:500;margin-left:2px}
  .mob-sub-card-sub{font-size:12px;color:var(--muted);margin-top:4px;margin-bottom:16px}
  .mob-sub-feature{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--text);padding:5px 0}
  .mob-sub-check{color:#34c759;font-size:15px;flex-shrink:0;font-weight:700}
  .mob-sub-cta{width:100%;padding:15px;border-radius:13px;border:none;font-size:16px;font-weight:700;cursor:pointer;font-family:inherit;margin-top:18px;-webkit-tap-highlight-color:transparent}
  .mob-sub-cta.upgrade{background:#007AFF;color:#fff}
  .mob-sub-cta.manage{background:var(--surface2);color:var(--text);border:1.5px solid var(--border-md)}
  .mob-sub-current-badge{position:absolute;top:16px;right:16px;background:#007AFF;color:#fff;font-size:11px;font-weight:700;padding:3px 9px;border-radius:8px}

  /* Contact page */
  .mob-contact-card{display:flex;align-items:center;gap:16px;background:var(--surface);border-radius:16px;padding:18px;margin-bottom:12px;border:1.5px solid var(--border);cursor:pointer;-webkit-tap-highlight-color:transparent;width:100%;text-align:left;font-family:inherit}
  .mob-contact-card:active{background:var(--surface2)}
  .mob-contact-icon{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0}
  .mob-contact-text-title{font-size:15px;font-weight:600;color:var(--text)}
  .mob-contact-text-sub{font-size:12px;color:var(--muted);margin-top:2px}
  .mob-contact-chevron{margin-left:auto;color:var(--muted);font-size:18px;flex-shrink:0}
  .mob-contact-textarea{width:100%;min-height:120px;padding:13px 14px;border-radius:12px;border:1.5px solid var(--border-md);background:var(--surface);color:var(--text);font-size:15px;font-family:inherit;outline:none;box-sizing:border-box;resize:none;-webkit-appearance:none}
  .mob-contact-textarea:focus{border-color:#007AFF}

  /* ── Topbar menu button — initials circle ── */
  .mob-topbar-menu{position:absolute;right:14px;background:none;border:none;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .mob-topbar-avatar{width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.22);display:flex;align-items:center;justify-content:center}
  .mob-topbar-avatar:active{opacity:.6}
  #mobNavInitials{font-size:13px;font-weight:700;color:#fff;letter-spacing:.5px;line-height:1;pointer-events:none}
  .mob-topbar-menu.has-user{background:rgba(255,255,255,.28)}

  /* ── Calendar overlay ── */
  .mob-cal-overlay{display:none;position:fixed;inset:0;z-index:310;background:var(--bg);flex-direction:column}
  .mob-cal-overlay.open{display:flex;animation:_calFadeIn .2s ease-out both}
  @keyframes _calFadeIn{from{opacity:0}to{opacity:1}}
  .mob-cal-topbar{background:var(--surface2);padding:calc(14px + env(safe-area-inset-top,0px)) 4px 12px;flex-shrink:0;display:flex;align-items:center;justify-content:center;position:relative;border-bottom:0.5px solid var(--border)}
  .mob-cal-topbar-back{background:none;border:none;color:#007AFF;font-size:16px;font-weight:500;padding:0 12px;min-width:60px;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;opacity:.9;position:absolute;left:4px}
  .mob-cal-topbar-back:active{opacity:.5}
  .mob-cal-topbar-today{background:none;border:none;color:#007AFF;font-size:16px;font-weight:500;padding:0 12px;min-width:60px;text-align:right;cursor:pointer;-webkit-tap-highlight-color:transparent;opacity:.9;position:absolute;right:4px}
  .mob-cal-topbar-today:active{opacity:.5}
  /* Company divider in day panel */
  .mob-cal-co-hdr{display:flex;align-items:center;justify-content:space-between;padding:10px 16px 6px;border-bottom:0.5px solid var(--border);background:var(--surface2)}
  .mob-cal-co-hdr-name{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
  .mob-cal-co-hdr-total{font-size:13px;font-weight:700;color:var(--green)}
  .mob-cal-co-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:6px 16px 8px;background:var(--bg);border-bottom:0.5px solid var(--border)}
  .mob-cal-topbar-spacer{flex:1}
  /* Mode toggle (Calendar | Schedule) */
  .mob-cal-mode-seg{display:flex;background:rgba(128,128,128,.13);border-radius:9px;padding:2px;gap:0;width:190px;flex:none}
  .mob-cal-mode-btn{flex:1;background:none;border:none;font-family:inherit;font-size:13px;font-weight:500;color:var(--muted);padding:5px 0;border-radius:7px;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .15s,color .15s}
  .mob-cal-mode-btn.active{background:var(--surface);color:var(--text);font-weight:600;box-shadow:0 1px 4px rgba(0,0,0,.14)}
  .mob-cal-mode-btn:active:not(.active){opacity:.6}
  /* Schedule chips bar — slides up in schedule mode */
  .mob-cal-sched-bar{position:absolute;bottom:0;left:0;right:0;z-index:20;background:var(--bg);border-top:0.5px solid var(--border);border-radius:20px 20px 0 0;box-shadow:0 -6px 32px rgba(0,0,0,.18);transform:translateY(100%);transition:transform .3s cubic-bezier(.25,.46,.45,.94);padding-bottom:calc(24px + env(safe-area-inset-bottom,0px));min-height:40vh;display:flex;flex-direction:column}
  .mob-cal-sched-bar.open{transform:translateY(0)}
  .mob-cal-month-total{min-width:60px;text-align:right;padding-right:14px;font-size:14px;font-weight:700;color:var(--green);letter-spacing:-.2px}
  .mob-cal-cal-month-lbl{flex:1;text-align:center;font-size:16px;font-weight:700;color:var(--text);letter-spacing:-.3px}
  .mob-cal-nav-btn{background:none;border:none;color:#007AFF;font-size:22px;font-weight:600;padding:2px 8px;cursor:pointer;-webkit-tap-highlight-color:transparent;opacity:.9;line-height:1}
  .mob-cal-nav-btn:active{opacity:.5}
  .mob-cal-month-nav-row{display:flex;justify-content:flex-end;align-items:center;padding:2px 6px 0;flex-shrink:0;gap:4px}
  .mob-cal-grid-arr{background:none;border:none;color:#007AFF;font-size:28px;font-weight:400;padding:0 8px;cursor:pointer;-webkit-tap-highlight-color:transparent;line-height:1;opacity:.9}
  .mob-cal-grid-arr:active{opacity:.45}

  /* Active filter chips strip (inside Calendar tab) */
  .mob-cal-active-strip{flex-shrink:0;display:flex;align-items:center;gap:6px;padding:6px 14px 2px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .mob-cal-active-strip::-webkit-scrollbar{display:none}
  .mob-cal-active-chip{display:inline-flex;align-items:center;gap:4px;padding:5px 10px;border-radius:20px;font-size:11px;font-weight:600;white-space:nowrap;flex-shrink:0;-webkit-tap-highlight-color:transparent;cursor:pointer;border:1.5px solid}
  .mob-cal-active-chip:active{opacity:.6}
  .mob-cal-active-chip-x{font-size:13px;line-height:1;opacity:.65}
  /* Tab content area */
  .mob-cal-tab-content{flex:1;overflow:hidden;display:flex;flex-direction:column;min-height:0}
  .mob-cal-tab-panel{display:none;flex:1;overflow:hidden;flex-direction:column;min-height:0}
  .mob-cal-tab-panel.active{display:flex}
  /* Round filter FAB — bottom right */
  .mob-cal-filter-fab{position:absolute;bottom:calc(28px + env(safe-area-inset-bottom,0px));right:24px;z-index:12;width:52px;height:52px;border-radius:50%;background:var(--surface);border:1px solid var(--border-md);box-shadow:0 8px 32px rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;color:var(--muted);cursor:pointer;-webkit-tap-highlight-color:transparent;transition:color .15s,background .15s}
  .mob-cal-filter-fab:active{opacity:.7}
  .mob-cal-filter-fab.active{color:#007AFF;background:rgba(0,122,255,.08);border-color:rgba(0,122,255,.35)}
  .mob-cal-fab-badge{position:absolute;top:6px;right:6px;min-width:14px;height:14px;padding:0 3px;border-radius:7px;background:#FF3B30;color:#fff;font-size:9px;font-weight:800;display:none;align-items:center;justify-content:center;box-sizing:border-box}
  .mob-cal-fab-badge.show{display:flex}
  .mob-cal-nav-badge.show{display:flex}
  /* Badge / filter chip buttons (used in filter tab) */
  .mob-cal-badge-btn{display:inline-flex;align-items:center;gap:5px;padding:5px 11px;border-radius:20px;border:1.5px solid;background:none;font-size:11px;font-weight:700;font-family:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .mob-cal-badge-btn.selected{color:#fff!important}
  .mob-cal-badge-btn.maxed{opacity:.35;pointer-events:none}
  .mob-cal-badge-btn:active{opacity:.6}
  /* Filter tab panel */
  .mob-cal-filter-inner{flex:1;overflow-y:auto;padding:14px 14px calc(80px + env(safe-area-inset-bottom,0px));background:var(--bg)}
  .mob-cal-filter-section{margin-bottom:18px}
  .mob-cal-filter-section-title{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px}
  .mob-cal-badge-grid{display:flex;flex-wrap:wrap;gap:6px}
  /* View tab panel */
  .mob-cal-view-inner{padding:16px 14px 12px;border-bottom:0.5px solid var(--border);flex-shrink:0}
  .mob-cal-view-label{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px}
  .mob-cal-view-seg{display:flex;border:0.5px solid var(--border-md);border-radius:10px;overflow:hidden;margin-bottom:12px}
  .mob-cal-view-seg button{flex:1;padding:9px 0;font-size:13px;font-weight:500;border:none;background:transparent;color:var(--muted);cursor:pointer;font-family:inherit;-webkit-tap-highlight-color:transparent}
  .mob-cal-view-seg button.active{background:#007AFF;color:#fff}
  .mob-cal-view-seg button:active:not(.active){opacity:.6}
  .mob-cal-view-hint{font-size:13px;color:var(--muted)}
  /* Multi-view area (3-month / year) */
  #mobCalMultiView{flex:1;overflow-y:auto}
  .mob-cal-mini-month{margin-bottom:14px;padding:0 6px}
  .mob-cal-mini-month-title{font-size:12px;font-weight:700;color:var(--text);padding:8px 6px 4px;letter-spacing:-.1px}
  .mob-cal-mini-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:1px}
  .mob-cal-mini-cell{aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:11px;color:var(--text);border-radius:50%;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .mob-cal-mini-cell.today{background:#007AFF;color:#fff;font-weight:700}
  .mob-cal-mini-cell.has-hours{background:rgba(0,122,255,0.12);font-weight:500}
  .mob-cal-mini-cell.empty{cursor:default}
  .mob-cal-mini-cell:active:not(.empty){opacity:.5}
  /* Year view */
  .mob-cal-year-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;padding:14px}
  .mob-cal-year-month{background:var(--surface2);border:0.5px solid var(--border);border-radius:10px;padding:8px;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .mob-cal-year-month:active{opacity:.6}
  .mob-cal-year-month-title{font-size:12px;font-weight:700;color:var(--text);margin-bottom:5px;text-align:center}
  .mob-cal-year-dot-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
  .mob-cal-year-dot{width:6px;height:6px;border-radius:50%;background:transparent;margin:auto}
  .mob-cal-year-dot.has-hours{background:#007AFF;opacity:.7}
  .mob-cal-year-dot.today{background:#007AFF}
  /* Schedule tab panel */
  .mob-cal-sched-tab-inner{flex:1;display:flex;flex-direction:column;overflow:hidden;background:var(--bg)}
  .mob-cal-sched-scroll-track{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain}
  .mob-cal-sched-month-block{display:block}
  .mob-cal-sched-month-hdr-sticky{position:sticky;top:0;z-index:5;background:var(--bg);font-size:14px;font-weight:700;color:var(--text);letter-spacing:-.2px;padding:10px 12px 4px;border-bottom:0.5px solid var(--border)}
  .mob-cal-sched-bottom{flex-shrink:0;padding-bottom:calc(80px + env(safe-area-inset-bottom,0px))}
  /* Schedule tab: month nav */
  .mob-cal-sched-month-nav{display:flex;align-items:center;justify-content:space-between;padding:10px 14px 6px;flex-shrink:0}
  .mob-cal-sched-month-lbl{font-size:15px;font-weight:700;color:var(--text)}
  .mob-cal-sched-month-btn{background:none;border:none;color:#007AFF;font-size:32px;font-weight:400;padding:0 12px;cursor:pointer;font-family:inherit;-webkit-tap-highlight-color:transparent;line-height:1}
  /* Schedule tab: mini grid for multi-select */
  .mob-cal-sched-dow{display:grid;grid-template-columns:repeat(7,1fr);padding:4px 6px 2px;flex-shrink:0}
  .mob-cal-sched-dow span{text-align:center;font-size:10px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.3px}
  .mob-cal-sched-grid{display:grid;grid-template-columns:repeat(7,1fr);padding:0 6px;flex-shrink:0}
  .mob-cal-sched-cell{display:flex;flex-direction:column;align-items:center;padding:2px 1px 3px;cursor:pointer;border-radius:10px;-webkit-tap-highlight-color:transparent;transition:opacity .15s}
  .mob-cal-sched-cell:active{background:var(--surface2) !important}
  .mob-cal-sched-cell.empty{cursor:default;pointer-events:none;background:none !important}
  .mob-cal-sched-num{width:36px;height:36px;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:400;color:var(--text);border-radius:50%;flex-shrink:0}
  .mob-cal-sched-num.today{background:#007AFF;color:#fff;font-weight:700}
  .mob-cal-sched-num.selected{background:rgba(0,122,255,0.13);color:#007AFF;font-weight:700;box-shadow:0 0 0 1.5px #007AFF}
  .mob-cal-sched-num.today.selected{background:#007AFF;color:#fff;font-weight:700;box-shadow:none}
  .mob-cal-sched-cell-lbl{font-size:9px;font-weight:700;color:#007AFF;line-height:1;margin-top:2px;height:9px;max-width:36px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center}
  .mob-cal-sched-cell-lbl.off{color:var(--muted)}
  /* Schedule bar — drag handle */
  .mob-cal-sched-handle{display:flex;align-items:center;justify-content:center;padding:14px 0 8px}
  .mob-cal-sched-handle-pill{width:40px;height:5px;border-radius:3px;background:var(--border-md)}
  /* State row — hint or selection badge + clear */
  .mob-cal-sched-state{display:flex;align-items:center;justify-content:space-between;padding:6px 18px 14px;min-height:40px}
  .mob-cal-sched-state-hint{font-size:14px;color:var(--muted);flex:1;text-align:center}
  .mob-cal-sched-state-badge{font-size:14px;font-weight:700;color:#007AFF}
  .mob-cal-sched-clear-btn{background:rgba(255,59,48,.1);border:none;color:#FF3B30;font-size:13px;font-weight:600;padding:7px 16px;border-radius:14px;cursor:pointer;font-family:inherit;-webkit-tap-highlight-color:transparent}
  .mob-cal-sched-clear-btn:active{opacity:.6}
  /* Section header */
  .mob-cal-sched-section-hdr{display:flex;align-items:center;justify-content:space-between;padding:0 18px 10px}
  .mob-cal-sched-section-title{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.6px}
  /* Chips — wrapping grid so all pills are visible */
  .mob-cal-sched-chips-scroll{padding:0 18px 18px;flex-shrink:0}
  .mob-cal-sched-chips-inner{display:flex;flex-wrap:wrap;gap:12px}
  .mob-cal-sched-chip{height:36px;display:inline-flex;align-items:center;padding:0 16px;border-radius:18px;border:1.5px solid var(--border-md);background:var(--surface2);font-size:13px;font-weight:600;color:var(--text);white-space:nowrap;cursor:pointer;font-family:inherit;-webkit-tap-highlight-color:transparent;flex-shrink:0;box-shadow:0 1px 4px rgba(0,0,0,.08)}
  .mob-cal-sched-chip:active{opacity:.6}
  .mob-cal-sched-chip.off-chip{border-color:var(--muted);color:var(--muted);box-shadow:none}
  /* Edit mode chip styles */
  .mob-cal-sched-chip-wrap{position:relative;display:inline-flex;flex-shrink:0;margin-top:8px}
  .mob-cal-sched-chip.edit-chip{opacity:.85}
  .mob-cal-sched-chip-del{position:absolute;top:-8px;right:-8px;width:22px;height:22px;border-radius:50%;background:#FF3B30;color:#fff;border:none;font-size:15px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;font-family:inherit;font-weight:700;-webkit-tap-highlight-color:transparent;padding:0}
  .mob-cal-sched-chip-del:active{opacity:.6}
  .mob-cal-sched-chip.add-chip{border-style:dashed;border-color:#007AFF;color:#007AFF;background:transparent;box-shadow:none}
  /* Edit/Done button */
  .mob-cal-sched-edit-btn{background:none;border:none;color:#007AFF;font-size:14px;font-weight:600;cursor:pointer;padding:0;font-family:inherit;-webkit-tap-highlight-color:transparent}
  .mob-cal-sched-edit-btn.done{font-weight:700}
  /* Day detail card */
  .mob-cal-sched-detail-card{margin:6px 16px 14px;background:var(--surface2);border-radius:16px;padding:16px 18px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 1px 6px rgba(0,0,0,.07)}
  .mob-cal-sched-detail-card-left{display:flex;flex-direction:column;gap:4px}
  .mob-cal-sched-detail-card-day{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
  .mob-cal-sched-detail-card-shift{font-size:16px;font-weight:700;color:#007AFF}
  .mob-cal-sched-detail-card-shift.off{color:var(--muted);font-style:italic}
  .mob-cal-sched-detail-card-remove{background:rgba(255,59,48,.1);border:none;color:#FF3B30;font-size:13px;font-weight:600;padding:7px 15px;border-radius:14px;cursor:pointer;font-family:inherit;-webkit-tap-highlight-color:transparent}
  .mob-cal-sched-detail-card-remove:active{opacity:.6}
  /* Chip editor bottom sheet */
  .mob-cal-sched-editor-overlay{position:absolute;inset:0;background:rgba(0,0,0,.45);z-index:100;display:flex;align-items:flex-end}
  .mob-cal-sched-editor-sheet{width:100%;background:var(--surface);border-radius:16px 16px 0 0;padding-bottom:calc(24px + env(safe-area-inset-bottom,0px))}
  .mob-cal-sched-editor-hdr{display:flex;align-items:center;justify-content:space-between;padding:14px 16px 10px;border-bottom:0.5px solid var(--border)}
  .mob-cal-sched-editor-title{font-size:16px;font-weight:700;color:var(--text)}
  .mob-cal-sched-editor-cancel{background:none;border:none;color:var(--muted);font-size:15px;font-weight:500;cursor:pointer;font-family:inherit;padding:0;-webkit-tap-highlight-color:transparent}
  .mob-cal-sched-editor-save{background:none;border:none;color:#007AFF;font-size:15px;font-weight:700;cursor:pointer;font-family:inherit;padding:0;-webkit-tap-highlight-color:transparent}
  .mob-cal-sched-editor-body{padding:6px 0}
  .mob-cal-sched-editor-row{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;border-bottom:0.5px solid var(--border)}
  .mob-cal-sched-editor-lbl{font-size:15px;color:var(--text);font-weight:400}
  .mob-cal-sched-editor-input{background:none;border:none;text-align:right;font-size:15px;color:#007AFF;font-family:inherit;font-weight:500;outline:none;max-width:140px}
  .mob-cal-sched-editor-input.time-input{color:var(--text)}
  /* iOS-style toggle */
  .mob-cal-sched-editor-toggle-wrap{position:relative;display:inline-block;cursor:pointer}
  .mob-cal-sched-editor-toggle-wrap input{opacity:0;width:0;height:0;position:absolute}
  .mob-cal-sched-editor-toggle{display:block;width:51px;height:31px;background:var(--border-md);border-radius:16px;transition:background .2s}
  .mob-cal-sched-editor-toggle-wrap input:checked + .mob-cal-sched-editor-toggle{background:#34C759}
  .mob-cal-sched-editor-toggle::after{content:'';position:absolute;top:2px;left:2px;width:27px;height:27px;border-radius:50%;background:#fff;box-shadow:0 2px 4px rgba(0,0,0,.25);transition:transform .2s}
  .mob-cal-sched-editor-toggle-wrap input:checked + .mob-cal-sched-editor-toggle::after{transform:translateX(20px)}
  /* Applied schedule list */
  .mob-cal-sched-applied{padding:4px 14px 0}
  .mob-cal-sched-applied-title{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px}
  .mob-cal-sched-applied-row{display:flex;align-items:center;justify-content:space-between;padding:9px 0;border-bottom:0.5px solid var(--border)}
  .mob-cal-sched-applied-date{font-size:14px;font-weight:500;color:var(--text)}
  .mob-cal-sched-applied-lbl{font-size:13px;font-weight:600;color:#007AFF}
  .mob-cal-sched-applied-lbl.off{color:var(--muted)}
  .mob-cal-sched-applied-del{background:none;border:none;color:var(--muted);font-size:16px;cursor:pointer;padding:0 4px;-webkit-tap-highlight-color:transparent}
  .mob-cal-sched-empty{padding:20px 16px;text-align:center;font-size:13px;color:var(--muted)}

  /* Calendar tab panel scrollable area */
  #mobCalTabCal{overflow:hidden}
  /* Day-of-week header (fixed, single row) */
  .mob-cal-dow-row{display:grid;grid-template-columns:repeat(7,1fr);padding:4px 6px 2px;flex-shrink:0}
  .mob-cal-dow-row span{text-align:center;font-size:10px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.3px}
  /* Scroll track — continuous vertical scroll through all months */
  .mob-cal-scroll-track{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;}
  /* Month block — one per month stacked vertically */
  .mob-cal-month-block{display:block}
  /* Sticky month name header inside the scroll track */
  .mob-cal-month-hdr-sticky{position:sticky;top:0;z-index:5;background:var(--bg);display:flex;align-items:baseline;justify-content:space-between;padding:10px 12px 4px;border-bottom:0.5px solid var(--border)}
  .mob-cal-mhs-name{font-size:14px;font-weight:700;color:var(--text);letter-spacing:-.2px}
  .mob-cal-mhs-total{font-size:12px;font-weight:700;color:var(--green);letter-spacing:-.1px}
  /* Month panel: 7 cols, rows sized to fit */
  .mob-cal-month-panel{width:100%;display:grid;grid-template-columns:repeat(7,1fr);grid-auto-rows:minmax(28px,1fr);padding:0 6px 8px;box-sizing:border-box}
  .mob-cal-cell{display:flex;flex-direction:column;align-items:center;padding:2px 1px 3px;cursor:pointer;border-radius:10px;-webkit-tap-highlight-color:transparent;transition:opacity .15s}
  .mob-cal-cell:active{background:var(--surface2) !important}
  .mob-cal-cell.dimmed{opacity:.18}
  .mob-cal-empty{cursor:default}
  .mob-cal-empty:active{background:none}
  .mob-cal-day-num{width:36px;height:36px;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:400;color:var(--text);border-radius:50%;flex-shrink:0}
  .mob-cal-day-num.has-hours{font-weight:500}
  .mob-cal-day-num.has-note{font-weight:700}
  .mob-cal-day-num.today{background:#007AFF;color:#fff;font-weight:700}
  .mob-cal-day-num.selected{background:rgba(0,122,255,0.13);color:#007AFF;font-weight:700;box-shadow:0 0 0 1.5px #007AFF}
  .mob-cal-day-num.today.selected{background:#007AFF;color:#fff;font-weight:700;box-shadow:none}
  .mob-cal-gross{font-size:9px;font-weight:700;color:var(--green);margin-top:1px;letter-spacing:-.2px}
  .mob-cal-dots{display:flex;gap:3px;margin-top:3px;flex-wrap:wrap;justify-content:center;max-width:36px}
  .mob-cal-tag-dot{width:5px;height:5px;border-radius:2px;flex-shrink:0}
  /* Day detail bottom sheet — slides up from bottom of the overlay */
  .mob-cal-day-panel{position:absolute;bottom:0;left:0;right:0;z-index:20;max-height:55vh;overflow-y:auto;-webkit-overflow-scrolling:touch;background:var(--bg);border-radius:16px 16px 0 0;box-shadow:0 -4px 28px rgba(0,0,0,.18);transform:translateY(100%);transition:transform .3s cubic-bezier(.25,.46,.45,.94);padding-bottom:calc(20px + env(safe-area-inset-bottom,0px))}
  .mob-cal-day-panel.open{transform:translateY(0)}
  /* Drag handle at top of sheet */
  .mob-cal-day-handle{display:flex;align-items:center;justify-content:center;padding:10px 0 6px;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .mob-cal-day-handle-pill{width:36px;height:4px;border-radius:2px;background:var(--border-md)}
  .mob-cal-day-hdr{padding:14px 16px 10px;position:sticky;top:0;background:var(--bg);z-index:2;border-bottom:0.5px solid var(--border)}
  .mob-cal-day-hdr-dateline{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}
  .mob-cal-day-hdr-date{font-size:18px;font-weight:800;color:var(--text);letter-spacing:-0.3px}
  .mob-cal-day-hdr-period{font-size:11px;font-weight:500;color:var(--muted);margin-bottom:6px}
  .mob-cal-day-hdr-open{font-size:12px;font-weight:600;color:#007AFF;background:rgba(0,122,255,.1);border:none;padding:5px 11px;border-radius:10px;cursor:pointer;font-family:inherit;-webkit-tap-highlight-color:transparent;flex-shrink:0}
  .mob-cal-day-hdr-open:active{opacity:.7}
  .mob-cal-day-hdr-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-height:0}
  .mob-cal-day-hdr-tag{font-size:11px;font-weight:700;color:#007AFF;background:rgba(0,122,255,.1);border:1px solid rgba(0,122,255,.25);padding:3px 10px 3px 8px;border-radius:4px 12px 12px 4px;letter-spacing:.1px;display:inline-block}
  .mob-cal-day-hdr-time{font-size:11px;font-weight:700;color:#d97706;background:rgba(217,119,6,.1);border:1px solid rgba(217,119,6,.25);padding:3px 10px 3px 8px;border-radius:4px 12px 12px 4px;letter-spacing:.1px;display:inline-block}
  .mob-cal-day-hdr-note{font-size:12px;color:var(--muted);font-style:italic;line-height:1.35}
  .mob-cal-day-row{display:flex;align-items:center;gap:10px;padding:13px 16px;border-bottom:0.5px solid var(--border);background:var(--bg)}
  .mob-cal-day-row-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
  .mob-cal-day-row-name{font-size:15px;font-weight:500;color:var(--text);flex:1}
  .mob-cal-day-row-hrs{font-size:13px;color:var(--muted);font-weight:500;margin-right:4px}
  .mob-cal-day-row-gross{font-size:15px;font-weight:700;color:var(--green);min-width:52px;text-align:right}
  .mob-cal-day-total-row{display:flex;align-items:center;gap:10px;padding:11px 16px;background:var(--surface2)}
  .mob-cal-day-total-label{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;flex:1}
  .mob-cal-day-total-hrs{font-size:13px;color:var(--muted);font-weight:500;margin-right:4px}
  .mob-cal-day-total-gross{font-size:15px;font-weight:700;color:var(--green);min-width:52px;text-align:right}
  .mob-cal-day-empty{padding:24px 16px;font-size:14px;color:var(--muted);text-align:center;background:var(--bg)}
  .mob-cal-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
  /* Schedule label on calendar cell */
  .mob-cal-sched{font-size:8px;font-weight:700;color:#007AFF;margin-top:1px;max-width:36px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center;letter-spacing:-.1px}
  .mob-cal-sched.off{color:var(--muted)}
  /* Schedule input row in day panel */
  .mob-cal-sched-row{display:flex;align-items:center;gap:10px;padding:10px 16px;border-bottom:0.5px solid var(--border);background:var(--bg)}
  .mob-cal-sched-icon{font-size:14px;flex-shrink:0;color:var(--muted)}
  .mob-cal-sched-inp{flex:1;font-size:15px;font-weight:400;color:var(--text);font-family:inherit;background:transparent;border:none;outline:none;min-width:0}
  .mob-cal-sched-inp::placeholder{color:var(--muted)}
  .mob-multi-count-row:empty,.mob-multi-count-row:not(:has(.mob-multi-count:not(:empty))){display:none}
  .mob-multi-count-row{text-align:center;padding:0}
  .mob-day-card.day-cleared .mob-day-sel-circle{background:var(--accent);border-color:var(--accent)}
  .mob-day-card.day-cleared .mob-day-sel-circle::after{content:'✓';font-size:11px;font-weight:800;color:#fff}
  .mob-multi-count{font-size:12px;font-weight:600;color:var(--muted)}
  .mob-day-sel-circle{width:28px;height:28px;border-radius:50%;border:2px solid var(--border);background:transparent;flex-shrink:0;display:none;align-items:center;justify-content:center;margin-left:2px;transition:border-color .15s,background .15s;-webkit-tap-highlight-color:transparent}
  .multi-mode .mob-day-sel-circle{display:flex}
  .multi-mode .mob-dc-chevron{display:none}
  .mob-day-card.multi-selected{border-color:var(--accent);background:rgba(0,122,255,.06)}
  .mob-day-card.multi-selected .mob-day-sel-circle{background:var(--accent);border-color:var(--accent)}
  .mob-day-card.multi-selected .mob-day-sel-circle::after{content:'✓';font-size:11px;font-weight:800;color:#fff}
  /* Multi set-hours sheet */
  .mob-multi-backdrop{display:none;position:fixed;inset:0;z-index:300;background:rgba(0,0,0,.45)}
  .mob-multi-backdrop.open{display:block}
  .mob-multi-sheet{display:none;position:fixed;bottom:0;left:0;right:0;z-index:301;background:var(--surface);border-radius:20px 20px 0 0;padding:0 0 32px;box-shadow:0 -4px 24px rgba(0,0,0,.3);transform:translateY(100%);transition:transform .25s cubic-bezier(.32,1,.23,1)}
  .mob-multi-sheet.open{display:block;transform:translateY(0)}
  .mob-multi-sheet-title{font-size:15px;font-weight:700;color:var(--text);padding:8px 20px 12px;border-bottom:0.5px solid var(--border)}
  .mob-multi-pt-list{max-height:55vh;overflow-y:auto;overscroll-behavior:contain}
  .mob-multi-pt-row{display:flex;align-items:center;gap:10px;padding:10px 16px;border-bottom:0.5px solid var(--border)}
  .mob-multi-pt-row:last-child{border-bottom:none}
  .mob-multi-pt-name{font-size:13px;font-weight:600;color:var(--text);min-width:80px;flex-shrink:0}
  .mob-multi-pt-btns{display:flex;gap:5px;flex:1}
  .mob-multi-pt-btn{flex:1;padding:9px 2px;border:none;border-radius:8px;background:rgba(255,255,255,.08);color:var(--text);font-size:13px;font-weight:700;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .12s,color .12s;line-height:1}
  .mob-multi-pt-btn:active{transform:scale(.92)}
  .mob-multi-pt-btn.is-active{background:var(--accent);color:#fff}
  .mob-multi-pt-btn.clr{color:var(--muted)}
  .mob-multi-pt-btn.clr.is-active{background:rgba(255,59,48,.15);color:#ff3b30}

  /* Copy bubble grid */
  .mob-copy-bubble-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;padding:16px 14px 8px}
  .mob-copy-bubble{display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 2px;border-radius:10px;border:1px solid var(--border);background:var(--surface2);cursor:pointer;-webkit-tap-highlight-color:transparent;transition:border-color .12s,background .12s}
  .mob-copy-bubble:active{opacity:.7}
  .mob-copy-bubble.selected{background:var(--accent);border-color:var(--accent)}
  .mob-copy-bubble.is-source{opacity:.35;pointer-events:none;border-style:dashed}
  .mob-copy-bubble.is-weekend:not(.selected){background:rgba(251,191,36,.12);border-color:rgba(251,191,36,.3)}
  .mob-copy-bubble-day{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.2px;color:var(--muted);line-height:1}
  .mob-copy-bubble.selected .mob-copy-bubble-day{color:rgba(255,255,255,.8)}
  .mob-copy-bubble.is-weekend:not(.selected) .mob-copy-bubble-day{color:var(--amber)}
  .mob-copy-bubble-date{font-size:14px;font-weight:700;color:var(--text);line-height:1}
  .mob-copy-bubble.selected .mob-copy-bubble-date{color:#fff}
  .mob-copy-bubble.is-weekend:not(.selected) .mob-copy-bubble-date{color:var(--amber)}
  .mob-copy-select-all{display:flex;justify-content:flex-end;padding:0 14px 12px;gap:10px}
  .mob-copy-sel-btn{font-size:12px;font-weight:600;color:var(--accent);background:none;border:none;cursor:pointer;padding:2px 0}
  .mob-copy-actions{display:flex;gap:10px;padding:16px 20px 0}
  .mob-copy-cancel{flex:1;padding:12px;border-radius:10px;border:1px solid var(--border);background:transparent;color:var(--muted);font-size:14px;font-weight:600;cursor:pointer}
  .mob-copy-confirm{flex:2;padding:12px;border-radius:10px;border:none;background:var(--accent);color:#fff;font-size:14px;font-weight:700;cursor:pointer}
  .mob-copy-confirm:disabled{opacity:.4;pointer-events:none}
  .mob-dd-expand{display:none;padding:0 16px 14px;flex-direction:column;gap:10px}
  .mob-dd-expand.is-open{display:flex}
  .mob-dd-qf-hint{display:flex;align-items:center;justify-content:space-between;padding:11px 14px;background:var(--surface2);border:1px solid var(--border);border-radius:9px}
  .mob-dd-qf-hint span{font-size:14px;color:var(--text);font-weight:500}
  .mob-dd-qf-hint strong{color:var(--accent);font-weight:700}
  .mob-dd-qf-edit{background:var(--surface);border:1px solid var(--border);border-radius:6px;font-size:12px;font-weight:600;color:var(--accent);cursor:pointer;padding:5px 11px;-webkit-tap-highlight-color:transparent}
  .mob-dd-custom-row{display:flex;align-items:center;gap:8px}
  .mob-dd-custom-lbl{font-size:12px;color:var(--muted);white-space:nowrap}
  .mob-dd-expand-input{width:90px;padding:7px 10px;font-size:15px;font-weight:600;color:var(--text);background:var(--surface2);border:1px solid var(--border);border-radius:8px;text-align:center;box-sizing:border-box;-webkit-appearance:none}
  .mob-dd-qf-inp{color:var(--accent)!important;border-color:rgba(0,122,255,.35)!important}

  /* Sticky bottom summary bar */
  .mob-summary{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:100;background:var(--surface);border-top:1px solid var(--border);box-shadow:0 -4px 16px rgba(0,0,0,.2)}
  .mob-summary-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:10px 4px}
  .mob-summary-item+.mob-summary-item{border-left:1px solid var(--border)}
  .mob-summary-lbl{font-size:9px;font-weight:600;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);margin-bottom:2px}
  .mob-summary-val{font-size:15px;font-weight:700;color:var(--text);white-space:nowrap;transition:font-size .15s}
  .mob-summary-val.accent{color:var(--accent)}
  /* ── Edit Period (Taxes & Deductions) — blue topbar + safe area ── */
  #mobEditPeriodOverlay.re-overlay{background:var(--bg);padding:0;top:0}
  #mobEditPeriodOverlay .re-modal{border:none;box-shadow:none;background:var(--bg)}
  #mobEditPeriodOverlay .pte-topbar{
    background:#007AFF!important;border-bottom:none!important;border-radius:0!important;
    padding:calc(14px + env(safe-area-inset-top,0px)) 16px 14px!important;
    height:auto!important
  }
  #mobEditPeriodOverlay .pte-topbar-title{color:#fff!important;font-size:16px;font-weight:600}
  #mobEditPeriodOverlay .pte-topbar-close{color:#fff!important;font-size:22px;opacity:.9}

  /* Archived Pay Types — full-screen on mobile */
  #archivedPayTypesOverlay.re-overlay{background:var(--bg);padding:0;top:0;z-index:350}
  #archivedPayTypesOverlay .re-modal{border:none;box-shadow:none;background:var(--bg)}
  #archivedPayTypesOverlay .pte-topbar{
    background:#007AFF!important;border-bottom:none!important;border-radius:0!important;
    padding:calc(14px + env(safe-area-inset-top,0px)) 4px 14px!important;
    height:auto!important
  }
  #archivedPayTypesOverlay .pte-topbar-inner{display:flex;align-items:center;width:100%;gap:0;position:relative}
  #archivedPayTypesOverlay .pte-topbar-title{position:absolute;left:0;right:0;text-align:center;color:#fff!important;font-size:16px;font-weight:600;pointer-events:none}
  #archivedPayTypesOverlay .pte-topbar-back{color:#fff!important;font-size:16px;font-weight:500;opacity:.9;z-index:1}

  /* ── Pay Setup (PTE) — standalone full-screen page ── */
  .mob-pte-page{display:none;position:fixed;inset:0;z-index:300;background:var(--bg);contain:layout style paint}
  .mob-pte-page.open{display:block;animation:_taxPageIn .3s cubic-bezier(.32,1,.23,1) both}
  .mob-pte-page .mob-pte-inner{position:relative;width:100%;height:100%;overflow:hidden;background:var(--bg)}
  /* Base rate warning — pull up from center so it clears the bottom nav */
  .pte-base-warn-overlay{align-items:flex-start!important;padding-top:18vh!important}
  #pteOverlay .pte-topbar{
    position:absolute!important;top:0!important;left:0!important;right:0!important;
    background:#007AFF;
    border-bottom:none;
    height:calc(52px + env(safe-area-inset-top,0px))!important;
    padding:env(safe-area-inset-top,0px) 4px 0!important;
    display:flex!important;align-items:center;z-index:10
  }
  #pteOverlay .pte-body{
    position:absolute!important;
    top:calc(52px + env(safe-area-inset-top,0px))!important;
    left:0!important;right:0!important;bottom:0!important;
    overflow-y:auto!important;-webkit-overflow-scrolling:touch;
    padding:16px 16px 60px!important;
    background:var(--bg)!important
  }
  /* Topbar inner — back + absolutely-centered title + right */
  #pteOverlay .pte-topbar-inner{display:flex;align-items:center;width:100%;gap:0;position:relative}
  #pteOverlay .pte-topbar-title{display:block!important;font-size:16px;font-weight:600;color:#fff;position:absolute;left:0;right:0;text-align:center;pointer-events:none}
  #pteOverlay .pte-topbar-back{font-size:16px;font-weight:500;padding:8px 12px;color:#fff;background:none;border:none;cursor:pointer;white-space:nowrap;-webkit-tap-highlight-color:transparent;opacity:.9;z-index:1}
  #pteOverlay .pte-topbar-back:active{opacity:.5}
  #pteOverlay .pte-topbar-right{display:flex;align-items:center;gap:6px;flex-shrink:0;z-index:1}
  /* +Pay topbar button */
  .pte-topbar-add{background:none;border:none;font-size:16px;font-weight:700;color:#fff;cursor:pointer;padding:8px 12px;-webkit-tap-highlight-color:transparent;white-space:nowrap}
  .pte-topbar-add:active{opacity:.5}
  /* ••• more menu */
  .pte-more-wrap{position:relative}
  .pte-more-btn{background:none;border:none;color:rgba(255,255,255,.8);font-size:16px;font-weight:700;cursor:pointer;padding:8px 10px;-webkit-tap-highlight-color:transparent;letter-spacing:1px}
  .pte-more-btn:active{opacity:.5}
  .pte-more-menu{display:none;position:absolute;top:calc(100% + 4px);right:0;background:var(--surface);border:0.5px solid var(--border);border-radius:12px;min-width:140px;z-index:50;overflow:hidden;box-shadow:0 4px 20px rgba(0,0,0,.2)}
  .pte-more-menu.open{display:block}
  .pte-more-item{display:block;width:100%;background:none;border:none;text-align:left;padding:13px 16px;font-size:15px;color:var(--text);cursor:pointer;-webkit-tap-highlight-color:transparent}
  .pte-more-item:active{background:var(--surface2)}
  /* Hide Done (legacy), desktop-only elements */
  .pte-topbar-done{display:none!important}
  .pte-desktop-done{display:none!important}
  #pteOverlay .pte-saved-ind{display:none!important}
  /* Period selector — hidden on mobile (select stays in DOM for save logic) */
  .pte-period-bar{display:none!important}
  .mob-multi-btn.has-selection{background:#ef4444!important;color:#fff!important;border-color:#ef4444!important}
  /* Card list */
  .pte-cards{display:flex;flex-direction:column;gap:8px}
  /* Compact one-liner */
  .pte-card-compact{display:flex;align-items:center;justify-content:space-between;background:var(--surface);border:0.5px solid var(--border);border-radius:12px;padding:12px 16px;gap:12px}
  .pte-card-compact.pte-row-hidden{opacity:.4}
  .pte-card-name{font-size:15px;font-weight:600;color:var(--text);flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .pte-card-info{display:flex;align-items:center;gap:8px;flex-shrink:0}
  .pte-info-badge{font-size:11px;font-weight:600;color:var(--accent);background:rgba(0,122,255,.1);border:0.5px solid rgba(0,122,255,.2);border-radius:7px;padding:3px 8px;white-space:nowrap;text-align:center;display:inline-block}
  .pte-info-badge-muted{color:var(--muted)!important;background:var(--surface2)!important;border-color:var(--border)!important}
  .pte-info-rate{font-size:15px;font-weight:700;color:var(--text);min-width:48px;text-align:right}
  /* Section & tax chips */
  .pte-chip{font-size:10px;font-weight:700;border-radius:6px;padding:2px 6px;white-space:nowrap;display:inline-block}
  .pte-chip-401k{color:var(--accent);background:rgba(0,122,255,.08);border:0.5px solid rgba(0,122,255,.2)}
  .pte-chip-non401k{color:var(--muted);background:var(--surface2);border:0.5px solid var(--border)}
  .pte-chip-taxed{color:#34C759;background:rgba(52,199,89,.1);border:0.5px solid rgba(52,199,89,.25)}
  .pte-chip-nontax{color:#FF9500;background:rgba(255,149,0,.1);border:0.5px solid rgba(255,149,0,.25)}
  /* Edit-mode card: slide-in knob */
  .pte-card-editable{cursor:pointer;-webkit-tap-highlight-color:transparent}
  .pte-card-editable:active{opacity:.75}
  .pte-card-chevron{color:var(--muted);font-size:18px;font-weight:300;flex-shrink:0;margin-left:2px}
  /* Base row card highlight */
  .pte-card-compact.pte-row-base{background:rgba(0,122,255,.07);border-color:var(--accent)!important}
  .pte-card-editing.pte-row-base{background:rgba(0,122,255,.07)}
  .pte-card-compact.pte-row-base .pte-card-name{color:var(--accent)}
  /* Edit mode expanded card */
  .pte-card-editing{background:var(--surface);border:0.5px solid var(--accent);border-radius:12px;padding:12px 14px}
  .pte-card-top{display:flex;align-items:center;gap:10px;margin-bottom:10px}
  .pte-lbl-input{flex:1;min-width:0;font-size:15px!important;font-weight:600!important;color:var(--text)!important;background:var(--bg)!important;border:0.5px solid var(--border)!important;border-radius:10px!important;padding:8px 12px!important;font-family:inherit;box-sizing:border-box!important}
  .pte-lbl-input:focus{border-color:var(--accent)!important;outline:none!important}
  .pte-card-math{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
  .pte-math-prefix{font-size:14px;color:var(--muted);font-weight:500;flex-shrink:0}
  .pte-math-base{font-size:13px;font-weight:500;color:var(--muted);white-space:nowrap;background:var(--surface2);border-radius:8px;padding:6px 10px}
  .pte-math-op{font-size:14px;color:var(--muted);font-weight:600;flex-shrink:0}
  .pte-math-result{font-size:16px;font-weight:700;color:var(--green)}
  .pte-rate-input{font-family:inherit}
  .pte-rate-field{font-size:16px!important;font-weight:700!important;width:88px!important;padding:7px 10px!important;text-align:center!important;background:var(--surface2)!important;border:0.5px solid var(--border)!important;border-radius:10px!important;color:var(--accent)!important;box-sizing:border-box!important;font-family:inherit!important}
  .pte-rate-field:focus{border-color:var(--accent)!important;outline:none!important}
  .pte-mult-sel{font-size:13px!important;padding:7px 24px 7px 10px!important;border-radius:10px!important;border:0.5px solid var(--border)!important;background:var(--surface2)!important;color:var(--muted)!important;font-family:inherit;-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5'%3E%3Cpath d='M0 0l4 5 4-5z' fill='%238b95a8'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:right 8px center!important;cursor:pointer}
  .pte-mult-active{color:var(--accent)!important;border-color:rgba(0,122,255,.4)!important;background-color:rgba(0,122,255,.06)!important}
  .pte-section-hdr{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);padding:8px 4px 2px}
  /* Rate history list */
  .re-schedule-list{background:var(--surface);border-radius:13px;border:0.5px solid var(--border);padding:0 14px!important;margin-top:14px!important}
  .re-schedule-list .rsl-title{padding-top:10px}
  .rsl-entry{padding:10px 0!important;border-bottom:0.5px solid var(--border)!important;font-size:13px!important}
  /* Add Pay Type — iOS full-screen sheet */
  #aptOverlay{background:var(--bg)!important;align-items:flex-start}
  #aptOverlay .apt-modal{
    position:absolute!important;inset:0;width:auto!important;height:auto!important;
    border-radius:0;margin:0;box-shadow:none;padding:0;background:var(--bg);
    display:flex;flex-direction:column;box-sizing:border-box;overflow-y:auto
  }
  #aptOverlay .apt-modal h4,
  #aptOverlay .apt-modal-btns{display:none!important}
  /* Mobile topbar — ID selector beats global display:none */
  #aptOverlay .apt-mob-topbar{
    display:flex!important;align-items:center;
    background:#007AFF;
    padding:calc(14px + env(safe-area-inset-top,0px)) 4px 14px;
    flex-shrink:0;z-index:10
  }
  #aptOverlay .apt-mob-cancel{
    color:#fff;font-size:16px;font-weight:500;background:none;border:none;
    padding:0 12px;min-width:80px;text-align:left;
    cursor:pointer;-webkit-tap-highlight-color:transparent;opacity:.9
  }
  #aptOverlay .apt-mob-title{
    flex:1;text-align:center;
    font-size:16px;font-weight:600;color:#fff
  }
  #aptOverlay .apt-mob-add{
    color:#fff;font-size:16px;font-weight:700;background:none;border:none;
    padding:0 12px;min-width:80px;text-align:right;
    cursor:pointer;-webkit-tap-highlight-color:transparent
  }
  /* Section labels → iOS section headers */
  #aptOverlay .apt-modal .field > label{
    display:block;font-size:12px!important;font-weight:600;color:var(--muted);
    text-transform:uppercase;letter-spacing:.5px;
    padding:20px 20px 6px!important;margin:0
  }
  /* Name field → standalone rounded card */
  #aptOverlay #apt_name{
    display:block;width:calc(100% - 32px)!important;box-sizing:border-box;
    background:var(--surface);border:0.5px solid var(--border)!important;
    border-radius:13px!important;margin:0 16px;
    padding:13px 16px!important;font-size:16px!important;color:var(--text)
  }
  /* Rate → single-line equation card */
  #aptOverlay .apt-rate-row{
    display:flex;flex-direction:row!important;align-items:center;
    gap:6px;background:var(--surface);border:0.5px solid var(--border);
    border-radius:13px;margin:0 16px;padding:13px 14px;overflow:visible
  }
  /* Mobile-only equation label spans: hidden by default, shown by mode class */
  .apt-rl-base,.apt-rl-eq-suffix,.apt-rl-dollar,.apt-rl-hr{display:none}
  /* MULT MODE: Base × [select] = $XX.XX/hr */
  #aptRateRow.mult-mode .apt-rl-base{
    display:flex;align-items:center;
    font-size:17px;font-weight:700;color:var(--text);white-space:nowrap
  }
  #aptRateRow.mult-mode .apt-rl-eq-suffix{
    display:flex;align-items:center;flex:1;
    font-size:14px;color:var(--muted);white-space:nowrap;gap:3px
  }
  #aptRateRow.mult-mode #aptEqResult{
    font-size:17px;font-weight:700;color:var(--text);
    background:var(--surface2);border:0.5px solid var(--border);
    border-radius:10px;padding:8px 12px;display:inline-block
  }
  #aptRateRow.mult-mode #apt_rate{display:none!important}
  #aptRateRow.mult-mode #apt_mult{
    padding:6px 10px!important;border-radius:8px!important;
    background:rgba(0,122,255,.12)!important;color:var(--accent)!important;
    border:none!important;font-size:15px!important;font-weight:700!important;
    width:auto!important;-webkit-appearance:auto;appearance:auto;outline:none
  }
  /* FIXED MODE: $ [input] /hr */
  #aptRateRow.fixed-mode .apt-rl-dollar{
    display:flex;align-items:center;
    font-size:17px;font-weight:700;color:var(--muted)
  }
  #aptRateRow.fixed-mode .apt-rl-hr{
    display:flex;align-items:center;
    font-size:14px;color:var(--muted)
  }
  #aptRateRow.fixed-mode #apt_rate{
    display:block!important;flex:1;min-width:0;
    font-size:17px!important;font-weight:700!important;color:var(--text);
    border:0.5px solid var(--border)!important;
    background:var(--surface2)!important;
    border-radius:10px!important;
    padding:8px 12px!important;margin:0;width:auto!important;
    box-sizing:border-box
  }
  #aptRateRow.fixed-mode #apt_mult{
    padding:5px 8px!important;border-radius:7px!important;
    background:var(--surface2)!important;color:var(--muted)!important;
    border:none!important;font-size:12px!important;font-weight:600!important;
    width:auto!important;-webkit-appearance:auto;appearance:auto;outline:none
  }
  /* Segmented slider controls */
  #aptOverlay .apt-seg-ctrl{
    display:flex;background:rgba(118,118,128,.12);
    border-radius:10px;padding:2px;margin:0 16px
  }
  #aptOverlay .apt-seg-opt{
    flex:1;text-align:center;padding:9px 4px;border:none;border-radius:8px;
    font-size:15px;font-weight:500;background:none;color:var(--text);
    cursor:pointer;transition:background .15s,box-shadow .15s;
    -webkit-tap-highlight-color:transparent
  }
  #aptOverlay .apt-seg-opt.active{
    background:var(--surface);
    box-shadow:0 1px 4px rgba(0,0,0,.18);font-weight:600
  }
  /* Archive bar — below nav bar, always visible on mobile */
  #aptOverlay .apt-archive-bar{display:flex;justify-content:flex-end;padding:10px 20px 0}
  #aptOverlay .apt-archive-link{
    background:none;border:none;
    color:var(--accent);font-size:14px;font-weight:600;
    cursor:pointer;padding:4px 0;
    -webkit-tap-highlight-color:transparent
  }
  #aptOverlay .apt-archive-link:active{opacity:.5}
  /* Base rate hint → iOS info banner */
  #aptOverlay #aptBaseRateHint{
    margin:16px 16px 0;border-radius:12px;
    background:rgba(0,122,255,.08);border:0.5px solid rgba(0,122,255,.2)!important;
    padding:12px 14px
  }
  #aptOverlay .apt-base-hint-val{font-size:17px;font-weight:700}
  #aptOverlay .apt-base-hint-mult{font-size:13px}
}
/* ── iOS Native Feel — visual refinements ─────────────────────────────── */
@media(max-width:768px){
  /* System font — instantly reads as iOS */
  body{font-family:-apple-system,BlinkMacSystemFont,'Helvetica Neue',sans-serif}

  /* Glass chrome: persistent UI surfaces use blur + translucency */
  nav{display:none}
  /* floating pill nav override — bottom adjusted for safe area */
  .mob-nav{bottom:calc(28px + env(safe-area-inset-bottom,0px))}

  /* Mobile top bar — in-flow, scrolls away naturally */
  .mob-topbar{display:flex;height:calc(50px + env(safe-area-inset-top,0px));padding-top:env(safe-area-inset-top,0px);align-items:center;justify-content:center;position:fixed;top:0;left:0;right:0;z-index:200;background:#007AFF;margin-bottom:0}
  .mob-topbar-brand-wrap{display:flex;align-items:center}
  .mob-topbar-brand{font-size:17px;font-weight:700;color:#fff;letter-spacing:-.2px}
  .mob-topbar-back{position:absolute;left:14px;background:none;border:none;color:#fff;font-size:15px;font-weight:600;line-height:1;padding:4px 8px;cursor:pointer;-webkit-tap-highlight-color:transparent;opacity:.9}

  /* ── Splash screen ── */
  @keyframes splashBrandIn{
    0%  {opacity:0;transform:translate(-50%,-50%) scale(.88)}
    60% {opacity:1;transform:translate(-50%,-50%) scale(1.03)}
    80% {transform:translate(-50%,-50%) scale(.98)}
    100%{opacity:1;transform:translate(-50%,-50%) scale(1)}
  }
  @keyframes splashOut{0%{opacity:1}100%{opacity:0;pointer-events:none}}
  .mob-splash{position:fixed;inset:0;z-index:1000;background:#007AFF;overflow:hidden}
  .mob-splash.hiding{animation:splashOut .45s ease forwards}
  .mob-splash.gone{display:none}
  .mob-splash-brand{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:38px;font-weight:800;color:#fff;letter-spacing:-.5px;white-space:nowrap}
  .mob-splash-cursive{font-weight:400;font-size:1em;letter-spacing:.01em}
  .mob-summary{display:none!important}
  /* Sticky header is transparent — hero card handles its own glass */
  .mob-sticky-header{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
  .mob-dd-topbar{background:var(--bg);border-bottom:none}

  /* Tab bar: remove uppercase, drop letter-spacing, bigger icon */
  .mob-nav-item{font-size:10px;font-weight:500;text-transform:none;letter-spacing:0;gap:3px}
  .mob-nav-icon{font-size:22px}

  /* Hero stat cards: thin border, no shadow */
  .hero-stat{border:0.5px solid var(--border);border-radius:14px;box-shadow:none}
  .hero-stat .hs-label{font-size:10px;text-transform:none;letter-spacing:0;font-weight:500}
  .hero-stat .hs-value{font-size:23px;letter-spacing:-.4px}

  /* Day list cards: remove left stripe, stretch to hero card width */
  .mob-day-list{gap:8px;padding:0 0 110px}
  .mob-day-card{
    border:0.5px solid var(--border);
    border-radius:14px;
    padding:10px 16px;
    gap:14px;
    box-shadow:none;
  }
  .mob-pp-add-btn{width:100%;background:none;border:none;border-top:0.5px solid var(--border);padding:14px 20px;font-size:14px;font-weight:600;color:var(--accent);cursor:pointer;text-align:left;-webkit-tap-highlight-color:transparent}
  .mob-pp-add-btn:first-child{border-top:none;border-bottom:0.5px solid var(--border)}
  .mob-pp-add-btn:active{opacity:.5}
  .mob-day-card::before{display:none}
  /* Today/Weekend bg — handled by dark mode block at end of file */
  .mob-dc-dayname{font-size:16px;font-weight:600}
  .mob-dc-date{font-size:12px}
  .mob-dc-amt{font-size:17px;font-weight:700}
  .mob-dc-chevron{font-size:22px;opacity:1}

  /* Week divider: drop uppercase */
  .mob-week-divider span{text-transform:none;font-size:11px;letter-spacing:0;font-weight:500}

  /* Extra income cards (Bonus / Commission / Tips) */
  #mobExtraCards{display:flex;flex-direction:column;gap:8px}
  #mobExtraCards:empty{display:none}
  .mob-extras-divider{font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;padding:4px 4px 2px}
  .mob-extra-card{border-color:rgba(52,199,89,.35);background:rgba(52,199,89,.05)}
  .mob-extra-card .mob-dc-dayname{color:#34c759}
  .mob-extra-card .mob-dc-amt{color:#34c759}

  /* Day panel (tab mode): thin border, no shadow */
  .mob-day-panel{border:0.5px solid var(--border);border-radius:14px;box-shadow:none;margin:0 0 12px}
  .mob-panel-hdr{border-bottom:0.5px solid var(--border)}

  /* Day detail rows */
  .mob-dd-row-main{padding:14px 16px}
  .mob-dd-lbl{font-size:16px;font-weight:500}

  /* Section headers: iOS secondary-label style (no uppercase) */
  .mob-sec-hdr{font-size:12px;font-weight:500;text-transform:none;letter-spacing:0;padding:14px 0 5px}
  .mob-dd-sec-hdr{font-size:12px;font-weight:500;text-transform:none;letter-spacing:0;padding:14px 16px 5px}
  .mob-nts-section-hdr{font-size:12px;font-weight:500;text-transform:none;letter-spacing:0}
  .mob-co-sheet-title{text-transform:none;letter-spacing:0;font-size:14px}

  /* Stepper buttons: circular, borderless */
  .mob-step-btn{border-radius:50%;width:36px;height:36px;border:none;background:rgba(255,255,255,.08);font-size:20px}
  .mob-step-btn:active{transform:scale(.92);background:var(--accent);color:#fff;border:none}

  /* Input fields: filled, no explicit border */
  .mob-row-input{border:none;background:rgba(255,255,255,.07);border-radius:9px}
  .mob-row-input:focus{background:rgba(0,122,255,.1);border:none;outline:none}

  /* Bottom sheets: tighter iOS corner radius */
  .mob-co-sheet{border-radius:20px 20px 0 0}
  .mob-pp-sheet{border-radius:20px 20px 0 0}
  .mob-copy-sheet{border-radius:20px 20px 0 0}


  /* Summary bar labels */
  .mob-summary-lbl{font-size:10px;text-transform:none;letter-spacing:0;font-weight:500}
  .mob-summary-val{font-size:16px}

  /* New timesheet form inputs — dark mode keeps surface color */
  .mob-nts-inp{background:var(--surface);border-color:var(--border)}
  .mob-nts-date-box{background:var(--surface);border-color:var(--border)}
  .mob-nts-date-box:focus{background:rgba(0,122,255,.15)}

  /* ── Mobile hero card ─────────────────────────────────────────── */
  .mob-hero-card{background:var(--surface);border-radius:18px;padding:12px 16px 6px;box-shadow:none;border:0.5px solid var(--border);display:flex;flex-direction:column;gap:10px;margin:0 0 2px}
  /* Top row: company centered, Edit oval pinned right */
  .mob-hero-top{display:flex;align-items:center;justify-content:center;gap:4px;cursor:pointer;-webkit-tap-highlight-color:transparent;min-width:0}
  .mob-hero-co-name{font-size:19px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
  .mob-hero-co-caret{font-size:11px;color:var(--accent);font-weight:700;flex-shrink:0;line-height:1;margin-top:1px}
  .mob-hero-top:active .mob-hero-co-name,.mob-hero-top:active .mob-hero-co-caret{opacity:.7}
  .mob-hero-edit-oval{position:absolute;right:0;top:50%;transform:translateY(-50%);padding:4px 10px;border:1px solid rgba(0,122,255,.4);border-radius:20px;background:rgba(0,122,255,.06);color:var(--accent);font-size:11px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent;white-space:nowrap}
  .mob-hero-edit-oval:active{border-color:var(--accent);color:var(--accent);background:rgba(0,122,255,.15)}
  .mob-hero-plus-btn{position:absolute;left:0;top:50%;transform:translateY(-50%);padding:4px 10px;border:1px solid rgba(0,122,255,.4);border-radius:20px;background:rgba(0,122,255,.06);color:var(--accent);font-size:14px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent;line-height:1}
  .mob-hero-plus-btn:active{border-color:var(--accent);color:var(--accent);background:rgba(0,122,255,.15)}
  .mob-hero-plus-btn.has-extras{border-color:rgba(0,122,255,.4);color:var(--accent)}
  /* Extra income sheet */
  .mob-ei-backdrop{display:none;position:fixed;inset:0;z-index:250;background:rgba(0,0,0,.45)}
  .mob-ei-backdrop.open{display:block}
  .mob-ei-sheet{position:fixed;bottom:0;left:0;right:0;z-index:251;background:var(--surface);border-radius:18px 18px 0 0;padding-bottom:env(safe-area-inset-bottom,16px);transform:translateY(100%);transition:transform .28s cubic-bezier(.4,0,.2,1);box-shadow:0 -8px 40px rgba(0,0,0,.3);max-height:92vh;display:flex;flex-direction:column}
  .mob-ei-sheet.open{transform:translateY(0)}
  .mob-ei-handle{width:36px;height:4px;background:var(--border);border-radius:2px;margin:10px auto 0;flex-shrink:0}
  .mob-ei-header{display:flex;align-items:center;justify-content:space-between;padding:14px 20px 12px;flex-shrink:0}
  .mob-ei-title{font-size:16px;font-weight:700;color:var(--text)}
  .mob-ei-done-btn{background:none;border:none;color:#007AFF;font-size:16px;font-weight:600;cursor:pointer;padding:0 4px;-webkit-tap-highlight-color:transparent}
  .mob-ei-done-btn:active{opacity:.5}
  /* Section label row with inline + button */
  .mob-ei-sec-row{display:flex;align-items:center;justify-content:space-between;padding:18px 16px 6px}
  .mob-ei-sec-plus{background:none;border:none;color:#007AFF;font-size:22px;font-weight:400;line-height:1;cursor:pointer;padding:0 2px;-webkit-tap-highlight-color:transparent}
  .mob-ei-sec-plus:active{opacity:.5}
  /* Inline custom label input */
  .mob-ei-custom-row{display:flex;align-items:center;gap:8px;padding:10px 16px;border-bottom:0.5px solid var(--border)}
  .mob-ei-custom-input{flex:1;background:none;border:none;border-bottom:1.5px solid #007AFF;font-size:15px;color:var(--text);padding:2px 0;outline:none}
  .mob-ei-custom-add{background:none;border:none;color:#007AFF;font-size:14px;font-weight:600;cursor:pointer;white-space:nowrap;-webkit-tap-highlight-color:transparent}
  .mob-ei-body{overflow-y:auto;flex:1;padding-bottom:16px;overscroll-behavior:contain}
  /* Item cards (legacy) */
  .mob-ei-item-card{background:var(--surface2);border:0.5px solid var(--border);border-radius:14px;margin:0 16px 10px;overflow:hidden}
  .mob-ei-item-header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px 10px}
  /* Detail view — separate card per field */
  .mob-ei-detail-card{background:var(--surface2);border-radius:14px;margin:12px 16px 0;padding:12px 14px;display:flex;align-items:center;gap:12px}
  .mob-ei-detail-note{align-items:flex-start;flex-direction:column;gap:8px}
  .mob-ei-detail-lbl{font-size:13px;font-weight:600;color:var(--muted);min-width:52px;flex-shrink:0}
  .mob-ei-item-name{font-size:15px;font-weight:700;color:var(--text)}
  .mob-ei-item-remove{background:none;border:none;font-size:22px;line-height:1;color:var(--muted);cursor:pointer;padding:0 2px;-webkit-tap-highlight-color:transparent}
  .mob-ei-field-row{display:flex;align-items:center;gap:8px;padding:9px 14px;border-top:0.5px solid var(--border)}
  .mob-ei-field-lbl{font-size:13px;color:var(--muted);min-width:56px}
  .mob-ei-amount-wrap{display:flex;align-items:center;gap:4px;background:var(--surface);border:0.5px solid var(--border);border-radius:10px;padding:6px 10px;flex:1}
  .mob-ei-amount-dollar{font-size:15px;font-weight:600;color:var(--muted)}
  .mob-ei-amount-input{flex:1;border:none;background:transparent;font-size:15px;font-weight:700;color:var(--text);outline:none;-webkit-appearance:none;min-width:0}
  /* Tax segmented control */
  .mob-ei-seg{display:flex;background:var(--surface);border:0.5px solid var(--border);border-radius:9px;overflow:hidden;flex:1}
  .mob-ei-seg-btn{flex:1;padding:6px 8px;font-size:12px;font-weight:600;border:none;background:transparent;color:var(--muted);cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .15s,color .15s}
  .mob-ei-seg-btn.active{background:var(--accent);color:#fff}
  /* Notes */
  .mob-ei-note-input{width:100%;border:none;background:transparent;font-size:14px;color:var(--text);outline:none;resize:none;font-family:inherit;line-height:1.4;padding:0;box-sizing:border-box}
  /* Add section */
  .mob-ei-add-hdr{font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;padding:14px 20px 8px}
  /* Section label */
  .mob-ei-add-sec-lbl{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;padding:18px 16px 6px}
  /* Grouped card */
  .mob-ei-rows-card{background:var(--surface2);border-radius:14px;margin:0 16px;overflow:hidden}
  /* Pay item rows */
  .mob-ei-pay-row{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;cursor:pointer;-webkit-tap-highlight-color:transparent;border-bottom:0.5px solid var(--border)}
  .mob-ei-pay-row:last-child{border-bottom:none}
  .mob-ei-pay-row:active{background:var(--surface)}
  .mob-ei-pay-info{display:flex;flex-direction:column;gap:2px}
  .mob-ei-pay-name{font-size:15px;font-weight:500;color:var(--text)}
  .mob-ei-pay-rate{font-size:12px;color:var(--muted)}
  .mob-ei-pay-earn{font-size:14px;font-weight:600;color:var(--green)}
  .mob-ei-row-arrow{font-size:18px;color:var(--muted);opacity:.5}
  /* Extra / logged rows */
  .mob-ei-extra-row{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;cursor:pointer;-webkit-tap-highlight-color:transparent;border-bottom:0.5px solid var(--border)}
  .mob-ei-extra-row:last-child{border-bottom:none}
  .mob-ei-extra-row:active{background:var(--surface)}
  .mob-ei-extra-name{font-size:15px;font-weight:500;color:var(--text)}
  /* Legacy pill grid (keep for backwards compat) */
  .mob-ei-label-grid{display:flex;flex-wrap:wrap;gap:8px;padding:0 16px 8px}
  .mob-ei-label-pill{background:var(--surface2);border:0.5px solid var(--border);border-radius:20px;padding:8px 16px;font-size:14px;font-weight:600;color:var(--text);cursor:pointer;-webkit-tap-highlight-color:transparent;white-space:nowrap}
  .mob-ei-label-pill:active{opacity:.7}
  /* Logged items list in picker */
  .mob-ei-logged-row{display:flex;align-items:center;padding:12px 20px;border-top:0.5px solid var(--border);cursor:pointer;-webkit-tap-highlight-color:transparent;gap:10px}
  .mob-ei-logged-name{flex:1;font-size:15px;font-weight:600;color:var(--text)}
  .mob-ei-logged-amt{font-size:15px;font-weight:700;color:#34c759}
  /* SS wage base tracker block */
  .mob-nts-ss-cap-block{background:var(--surface2);border-radius:12px;margin:10px 0 4px;padding:12px 14px}
  .mob-nts-ss-cap-hdr{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
  .mob-nts-ss-cap-title{font-size:12px;font-weight:700;color:var(--text)}
  .mob-nts-ss-cap-limit{font-size:11px;color:var(--muted)}
  .mob-nts-ss-cap-track{margin-bottom:6px}
  .mob-nts-ss-cap-bar-bg{height:6px;border-radius:3px;background:var(--surface);overflow:hidden}
  .mob-nts-ss-cap-bar{height:100%;border-radius:3px;background:var(--accent);transition:width .3s,background .3s}
  .mob-nts-ss-cap-status{font-size:11px;color:var(--muted);margin-bottom:2px}
  /* Tax breakdown card */
  .mob-ei-detail-tax-breakdown{flex-direction:column;align-items:flex-start;gap:6px;padding:10px 14px}
  .mob-ei-tax-method-lbl{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:2px}
  .mob-ei-tax-info{font-size:13px;color:var(--muted);font-style:italic}
  .mob-ei-tax-rows{width:100%;display:flex;flex-direction:column;gap:4px}
  .mob-ei-tax-row{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--text)}
  .mob-ei-tax-row span:first-child{color:var(--muted)}
  .mob-ei-tax-row span:last-child{font-variant-numeric:tabular-nums;font-weight:500}
  .mob-ei-tax-total{border-top:0.5px solid var(--border);margin-top:4px;padding-top:6px}
  .mob-ei-tax-total span{font-weight:700!important;color:var(--text)!important}
  /* Remove button in detail view */
  .mob-ei-remove-btn{display:block;margin:16px 16px 0;background:none;border:0.5px solid rgba(255,59,48,.4);border-radius:12px;padding:12px;font-size:14px;font-weight:600;color:#ff3b30;cursor:pointer;width:calc(100% - 32px);-webkit-tap-highlight-color:transparent}
  /* Back button in detail header */
  .mob-ei-back{background:none;border:none;font-size:15px;font-weight:600;color:var(--accent);cursor:pointer;padding:0;-webkit-tap-highlight-color:transparent}
  /* GROSS | NET — side by side */
  .mob-hero-amounts{display:flex;align-items:center;padding:4px 0 6px;gap:0}
  .mob-hero-amt-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px}
  .mob-hero-amt-lbl{font-size:10px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.6px}
  .mob-hero-amt-val{font-size:26px;font-weight:800;letter-spacing:-.6px;line-height:1;white-space:nowrap;transition:font-size .15s}
  .mob-hero-amt-val.gross{color:var(--text)}
  .mob-hero-amt-val.net{color:#34c759}
  .mob-hero-amt-val.neg{color:var(--red)}
  .mob-hero-amt-sep{width:1px;height:44px;background:var(--border);flex-shrink:0}
  /* OT row below amounts */
  .mob-hero-ot-row{display:flex;align-items:center;justify-content:center;border-top:0.5px solid var(--border);padding-top:8px;gap:0;position:relative;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .mob-hero-ot-item{width:120px;display:flex;flex-direction:column;align-items:center;gap:2px}
  .mob-hero-ot-lbl{font-size:9px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
  .mob-hero-ot-val{font-size:15px;font-weight:700;color:var(--text);letter-spacing:-.3px}
  .mob-hero-ot-val.has-ot{color:var(--text)}
  .mob-hero-ot-sep{width:1px;height:24px;background:var(--border);flex-shrink:0}
  .mob-hero-ot-edit-btn{position:absolute;top:6px;right:2px;background:none;border:none;padding:4px 6px;color:var(--accent);cursor:pointer;-webkit-tap-highlight-color:transparent;opacity:.8}
  /* Bottom nav: ‹ | period date | › */
  .mob-hero-nav-row{display:flex;align-items:center;justify-content:space-between;gap:8px;border-top:0.5px solid var(--border);padding-top:5px}
  .mob-hero-nav-row .mob-period-nav-btn{width:42px;height:42px;border-radius:50%;background:none;border:none;font-size:26px;font-weight:700;color:var(--accent);cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;flex-shrink:0}
  .mob-hero-nav-row .mob-period-nav-btn:active{background:rgba(0,122,255,.2);color:var(--accent)}
  .mob-hero-period-btn{flex:1;padding:0;border:none;background:none;color:var(--text);font-size:16px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent;text-align:center;display:flex;flex-direction:column;align-items:center;gap:2px}
  .mob-hero-period-btn .period-date-line::after{content:' ▼';font-size:9px;color:var(--accent);font-weight:700;vertical-align:middle}
  .mob-hero-period-btn:active{color:var(--text)}
  .mob-hero-current-tag{font-size:10px;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:.5px;line-height:1}

  /* ── Pay type filter row ──────────────────────────────────────── */
  .mob-dd-filter-row{display:flex;gap:8px;padding:10px 16px 0}
  .mob-dd-filter-pill{padding:5px 14px;border-radius:50px;border:1px solid var(--border);background:none;color:var(--muted);font-size:12px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:border-color .15s,background .15s,color .15s}
  .mob-dd-filter-pill.active{background:var(--accent);border-color:var(--accent);color:#fff}
  .mob-dd-filter-pill:active{opacity:.7}
  /* When filter-active class is on the cards container, hide inactive cards */
  .mob-pt-cards.filter-active .mob-pt-card:not(.is-active){display:none}

  /* ── Pay type cards in day detail ─────────────────────────────── */
  .mob-pt-cards{display:flex;flex-direction:column;gap:8px;padding:10px 12px 24px}
  .mob-pt-card{display:flex;align-items:center;gap:10px;background:var(--surface);border-radius:10px;padding:7px 12px 7px 16px;cursor:pointer;-webkit-tap-highlight-color:transparent;border:1px solid var(--border);position:relative;overflow:hidden}
  .mob-pt-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--border);border-radius:10px 0 0 10px}
  .mob-pt-card.is-active::before{background:var(--accent)}
  .mob-pt-card:active{opacity:.7}
  .mob-pt-card-left{flex:1;min-width:0}
  .mob-pt-card-name{font-size:13px;font-weight:600;color:var(--text)}
  .mob-pt-base-badge{display:inline-block;font-size:9px;font-weight:700;color:var(--accent);background:rgba(0,122,255,.1);border:1px solid rgba(0,122,255,.25);border-radius:4px;padding:1px 5px;letter-spacing:.4px;text-transform:uppercase;margin-left:6px;vertical-align:middle;flex-shrink:0}
  .mob-pt-base-notice{display:flex;align-items:flex-start;gap:10px;margin:14px 20px 0;padding:12px 14px;background:rgba(0,122,255,.07);border:1px solid rgba(0,122,255,.2);border-radius:12px}
  .mob-pt-base-notice-icon{font-size:18px;line-height:1;flex-shrink:0;margin-top:1px}
  .mob-pt-base-notice-text{font-size:13px;color:var(--text);line-height:1.45}
  .mob-pt-base-notice-text strong{display:block;font-weight:700;margin-bottom:2px;color:var(--accent)}
  .mob-pt-card-meta{font-size:10px;color:var(--muted);margin-top:1px;display:flex;align-items:center;gap:6px}
  .mob-pt-card-right{display:flex;align-items:center;gap:6px;flex-shrink:0}
  .mob-pt-card-hrs{font-size:13px;font-weight:700;color:var(--accent)}
  .mob-pt-card-hrs.empty{font-size:16px;font-weight:300;color:var(--border)}
  .mob-pt-card-chevron{font-size:14px;color:var(--muted);opacity:.4;line-height:1}

  /* ── Pay type detail full-screen overlay ──────────────────────── */
  .mob-pt-overlay{display:none;position:fixed;inset:0;z-index:200;background:var(--bg);flex-direction:column;contain:layout style paint}
  .mob-pt-overlay.open{display:flex}
  .mob-pt-sheet{display:flex;flex-direction:column;height:100%}
  .mob-pt-topbar{display:flex;align-items:center;gap:10px;padding:calc(14px + env(safe-area-inset-top,0px)) 16px 14px;background:var(--surface);border-bottom:0.5px solid var(--border);flex-shrink:0}
  .mob-pt-back{background:none;border:none;font-size:16px;font-weight:600;color:var(--accent);cursor:pointer;padding:4px 0;white-space:nowrap;-webkit-tap-highlight-color:transparent}
  .mob-pt-earn-top{font-size:16px;font-weight:700;color:var(--accent);white-space:nowrap;min-width:50px;text-align:right}
  /* ── Pay type detail — iOS grouped list ── */
  .mob-pt-flow{flex:1;overflow-y:auto;overscroll-behavior:contain;padding-bottom:calc(40px + env(safe-area-inset-bottom,0px))}
  /* Section header (uppercase gray label above card) */
  .mob-pt-section-hdr{font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;padding:20px 20px 6px}
  /* Grouped card */
  .mob-pt-section-card{background:var(--surface);border-radius:13px;margin:0 16px;overflow:hidden;border:0.5px solid var(--border)}
  /* Row inside card */
  .mob-pt-row{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;min-height:48px;gap:12px}
  .mob-pt-row+.mob-pt-row{border-top:0.5px solid var(--border)}
  .mob-pt-row-lbl{font-size:15px;font-weight:500;color:var(--text);flex-shrink:0}
  .mob-pt-row-sub{font-size:12px;color:var(--muted);margin-top:2px}
  .mob-pt-row-val{font-size:15px;color:var(--muted)}
  .mob-pt-row-val.accent{color:var(--accent);font-weight:500}
  .mob-pt-row-input{background:none;border:none;outline:none;font-size:15px;color:var(--text);text-align:right;font-family:inherit;padding:0;flex:1;min-width:0;-webkit-appearance:none;-moz-appearance:textfield}
  .mob-pt-row-input::-webkit-inner-spin-button,.mob-pt-row-input::-webkit-outer-spin-button{-webkit-appearance:none}
  .mob-pt-row-input:disabled{opacity:.4}
  /* Hours card */
  .mob-pt-hrs-card{background:var(--surface);border-radius:13px;margin:0 16px;border:0.5px solid var(--border);padding:10px}
  .mob-pt-hrs-grid{display:flex;gap:8px}
  .mob-pt-hrs-btn{flex:1;padding:13px 2px;border:none;border-radius:10px;background:var(--surface2,rgba(0,0,0,.06));color:var(--text);font-size:14px;font-weight:700;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .12s,color .12s;line-height:1}
  .mob-pt-hrs-btn:active{transform:scale(.92)}
  .mob-pt-hrs-btn.is-active{background:var(--accent);color:#fff}
  .mob-pt-hrs-btn.clr{font-size:18px;color:var(--muted)}
  .mob-pt-hrs-btn.clr.is-active{background:rgba(255,59,48,.15);color:#ff3b30}
  /* Pay type section header with Edit button */
  .mob-pt-section-hdr-row{display:flex;align-items:center;justify-content:space-between;padding:20px 20px 6px}
  .mob-pt-section-hdr-row .mob-pt-section-hdr{padding:0}
  .mob-pt-section-edit-btn{background:none;border:none;font-size:14px;font-weight:600;color:var(--accent);cursor:pointer;padding:4px 0;-webkit-tap-highlight-color:transparent}
  .mob-pt-section-edit-btn:active{opacity:.5}
  /* Quick default hours card */
  .mob-pt-qh-default-card{display:flex;align-items:center;justify-content:space-between;margin:0 16px 12px;padding:12px 16px;background:var(--surface);border:0.5px solid var(--border);border-radius:13px;gap:12px}
  .mob-pt-qh-default-lbl{font-size:14px;font-weight:500;color:var(--muted);flex-shrink:0}
  .mob-pt-qh-default-inp{flex:1;min-width:0;font-size:22px;font-weight:700;color:var(--accent);text-align:right;background:transparent;border:none;outline:none;-webkit-appearance:none;font-family:inherit;padding:0}
  .mob-pt-qh-default-inp:focus{color:var(--accent)}
  /* Quick hours bar */
  .mob-pt-qh-bar{display:flex;align-items:stretch;background:var(--surface);border-radius:13px;margin:16px 16px 16px;border:0.5px solid var(--border);overflow:hidden;min-height:64px}
  .mob-pt-qh-btn{flex:0 0 64px;border:none;border-right:0.5px solid var(--border);background:var(--surface2);color:var(--text);font-size:28px;font-weight:300;cursor:pointer;-webkit-tap-highlight-color:transparent;display:flex;align-items:center;justify-content:center;transition:background .12s,color .12s}
  .mob-pt-qh-btn:last-child{border-right:none;border-left:0.5px solid var(--border)}
  .mob-pt-qh-btn:active{background:var(--accent);color:#fff}
  .mob-pt-qh-center{flex:1;display:flex;align-items:center;justify-content:center}
  .mob-pt-qh-val-wrap{display:flex;align-items:center;gap:1px;padding:6px 16px;border-radius:10px;border:1.5px solid var(--border);background:var(--surface2);transition:background .15s,border-color .15s}
  .mob-pt-qh-val-wrap.is-double{background:var(--accent);border-color:var(--accent)}
  .mob-pt-qh-display{width:80px;font-size:26px;font-weight:700;color:var(--accent);background:transparent;border:none;outline:none;text-align:center;-webkit-appearance:none;padding:0;font-family:inherit;cursor:text}
  .mob-pt-qh-val-wrap.is-double .mob-pt-qh-display{color:#fff}
  /* 401k toggle */
  .mob-pt-401k-sw{position:relative;width:44px;height:26px;flex-shrink:0}
  .mob-pt-401k-sw input{opacity:0;width:0;height:0;position:absolute}
  .mob-pt-401k-tr{position:absolute;inset:0;background:var(--border);border-radius:13px;cursor:pointer;transition:background .2s}
  .mob-pt-401k-sw input:checked + .mob-pt-401k-tr{background:var(--accent)}
  .mob-pt-401k-tr::after{content:'';position:absolute;width:20px;height:20px;border-radius:50%;background:#fff;top:3px;left:3px;transition:transform .2s;box-shadow:0 1px 3px rgba(0,0,0,.3)}
  .mob-pt-401k-sw input:checked + .mob-pt-401k-tr::after{transform:translateX(18px)}
  /* OT toggle */
  .mob-pt-ot-switch{position:relative;width:44px;height:26px;flex-shrink:0}
  .mob-pt-ot-switch input{opacity:0;width:0;height:0;position:absolute}
  .mob-pt-ot-track{position:absolute;inset:0;background:var(--border);border-radius:13px;cursor:pointer;transition:background .2s}
  .mob-pt-ot-switch input:checked + .mob-pt-ot-track{background:var(--accent)}
  .mob-pt-ot-track::after{content:'';position:absolute;width:20px;height:20px;border-radius:50%;background:#fff;top:3px;left:3px;transition:transform .2s;box-shadow:0 1px 3px rgba(0,0,0,.3)}
  .mob-pt-ot-switch input:checked + .mob-pt-ot-track::after{transform:translateX(18px)}
  /* OT multiplier row — hidden until .ot-on */
  .mob-pt-ot-mult-row{display:none;border-top:0.5px solid var(--border)}
  .mob-pt-ot-section.ot-on .mob-pt-ot-mult-row{display:flex}
  .mob-pt-ot-mult-btn{padding:6px 18px;border-radius:20px;border:1px solid var(--border);background:transparent;color:var(--text);font-size:13px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .mob-pt-ot-mult-btn.active{background:var(--accent);border-color:var(--accent);color:#fff}
  /* Note card */
  .mob-pt-note-card{background:var(--surface);border-radius:13px;margin:0 16px;overflow:hidden;border:0.5px solid var(--border)}
  .mob-pt-note-input{width:100%;background:none;border:none;outline:none;padding:13px 16px;font-size:15px;color:var(--text);resize:none;box-sizing:border-box;font-family:inherit;min-height:88px;-webkit-appearance:none;display:block}
  .mob-pt-note-input::placeholder{color:var(--muted)}
  /* Base notice */
  .mob-pt-base-notice{margin:16px 16px 0;background:rgba(0,122,255,.08);border:0.5px solid rgba(0,122,255,.2);border-radius:12px;padding:12px 14px;display:flex;gap:10px;align-items:flex-start}
  .mob-pt-base-notice-icon{font-size:18px;flex-shrink:0;margin-top:1px}
  .mob-pt-base-notice-text{font-size:13px;color:var(--text);line-height:1.4}
  /* Pin row */
  .mob-pt-pin-mini{display:flex;align-items:center;gap:8px}
  .mob-pt-pin-btn{width:34px;height:34px;border-radius:50%;border:none;background:rgba(255,255,255,.08);font-size:13px;font-weight:600;color:var(--text);cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;flex-shrink:0}
  .mob-pt-pin-btn:active{background:var(--accent);color:#fff;transform:scale(.92)}
  .mob-pt-pin-input{width:48px;padding:6px 4px;font-size:16px;font-weight:700;color:var(--accent);background:rgba(255,255,255,.07);border:none;border-radius:8px;text-align:center;-moz-appearance:textfield;outline:none}
  .mob-pt-pin-input::-webkit-inner-spin-button,.mob-pt-pin-input::-webkit-outer-spin-button{-webkit-appearance:none}
}
@media(min-width:769px){
  .mob-ts,.mob-summary,.mob-nav,.mob-co-label-row,.mob-co-sheet,.mob-co-sheet-backdrop,.mob-dd-overlay,.mob-pt-overlay,.mob-pp-sheet,.mob-pp-backdrop,.mob-topbar,.mob-splash,#mobSaveNudge,.mob-note-sheet,.mob-note-backdrop,.mob-copy-sheet,.mob-copy-backdrop,.mob-ei-sheet,.mob-ei-backdrop,.mob-sticky-header,.mob-hero-card,.mob-topbar,.mob-more-sheet,.mob-more-backdrop,.mob-nts-page,.mob-pte-page,.mob-cal-overlay,#mobMenuSheet,#mobMenuBackdrop,.mob-drawer-backdrop,.mob-prof-overlay,#mobAccountOverlay,#mobSubscriptionOverlay,#mobContactOverlay{display:none!important}
  /* Ensure blog overlays are hidden on desktop when not open */
  .blog-reader-overlay:not(.open){display:none!important}
  .blog-editor-overlay:not(.open){display:none!important}
  /* Desktop summary bar */
  .desk-summary-bar{display:flex;gap:12px;margin-bottom:16px}

  .desk-sum-card{flex:1;background:var(--surface);border-radius:12px;border:1px solid var(--border);padding:16px 20px}
  .desk-sum-label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin-bottom:8px}
  .desk-sum-primary{font-size:26px;font-weight:700;color:var(--text);line-height:1;margin-bottom:5px}
  .desk-sum-card.net .desk-sum-primary{color:var(--accent)}
  .desk-sum-card.ot .desk-sum-primary{color:var(--text)}
  .desk-sum-secondary{font-size:12px;color:var(--muted);font-weight:500}
  .desk-sum-secondary span{color:var(--text);font-weight:600}
}

/* ── Desktop Home Page ───────────────────────────────────────────────────── */
@media(min-width:769px){
  #page-home{max-width:680px;margin:0 auto;padding:32px 0 60px}
  #page-home .hero-stats-ytd{display:none!important}
  #page-home .home-pc-row{display:none!important}
  #page-home .home-hero{border-radius:16px;border:1px solid var(--border);box-shadow:none;margin-bottom:16px}
  #page-home .home-hero::before{display:none}
  #page-home .home-hero-trio{padding:20px 0;margin-bottom:0}
  #page-home .home-hero-value{font-size:36px}
  #page-home .mob-home-ot-card{margin-bottom:16px;border-radius:16px;border:1px solid var(--border);background:var(--surface);overflow:hidden}
  #page-home .home-deduct-card{margin-bottom:16px;border-radius:16px;border:1px solid var(--border);border-top:2px solid #fbbf24}
  #page-home .blog-section{margin:0 0 16px}

  /* OT card internals — these classes are only styled in mobile, add desktop equivalents */
  .mob-home-ot-header{padding:14px 18px 0;font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.7px}
  .mob-home-ot-co-row{padding:10px 18px 14px}
  .mob-home-ot-co-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
  .mob-home-ot-co-name{font-size:13px;font-weight:700;color:var(--text)}
  .mob-home-ot-edit-btn{font-size:11px;font-weight:600;color:var(--accent);background:none;border:none;padding:2px 6px;cursor:pointer}
  .mob-home-ot-stats{display:flex;align-items:stretch}
  .mob-home-ot-stat{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 8px 16px}
  .mob-home-ot-lbl{font-size:11px;font-weight:600;color:var(--muted);text-align:center}
  .mob-home-ot-val{font-size:20px;font-weight:800;color:var(--accent);letter-spacing:-.5px;line-height:1}
  .mob-home-ot-sep{width:1px;background:var(--border);flex-shrink:0;margin:10px 0}
  .mob-home-ot-co-divider{height:1px;background:var(--border);margin:0 18px}
  .mob-home-ot-adj-row{display:flex;align-items:center;gap:8px;padding:10px 18px 14px;border-top:1px solid var(--border)}
  .mob-home-ot-adj-inp{flex:1;background:var(--card);border:1px solid var(--border);border-radius:7px;padding:7px 10px;font-size:14px;color:var(--text);min-width:0}
  .mob-home-ot-adj-save{font-size:12px;font-weight:700;background:var(--accent);color:#fff;border:none;border-radius:7px;padding:7px 12px;cursor:pointer}
  .mob-home-ot-adj-cancel{font-size:14px;font-weight:500;background:none;border:none;color:var(--muted);padding:4px 6px;cursor:pointer}

  /* Hide mobile-only sheets and overlays that render as raw HTML on desktop */
  .mob-multi-sheet,.mob-multi-backdrop,
  .mob-copy-sheet,.mob-copy-backdrop,
  .mob-note-sheet,.mob-note-backdrop,
  .mob-dd-more-sheet,.mob-dd-more-backdrop,
  .mob-drawer,.mob-drawer-backdrop{display:none!important}
}

/* ── Mobile Home Page ────────────────────────────────────────────────────── */
@media(max-width:768px){
  #page-home{padding:calc(50px + env(safe-area-inset-top,0px)) 0 120px;background:var(--bg)}

  /* Header — hide desktop nav buttons, keep greeting */
  #page-home .home-header{padding:16px 16px 10px;margin:0;background:transparent}
  #page-home .home-header-actions{display:none}
  #page-home .home-greeting{font-size:20px;font-weight:800}
  #page-home .home-sub{font-size:12px;color:var(--muted);margin-top:1px}

  /* ── Hero card ── */
  #page-home .home-hero{
    margin:0 16px 14px;border-radius:18px;padding:0;
    border:0.5px solid var(--border);box-shadow:none;overflow:hidden
  }
  #page-home .home-hero::before{display:none}

  /* Eyebrow band */
  #page-home .home-hero-band{
    padding:14px 18px 10px;margin:0;
    border-bottom:0.5px solid var(--border)
  }
  #page-home .home-hero-eyebrow{font-size:11px;font-weight:700;letter-spacing:.5px}
  #page-home .home-year-wrap{gap:8px}
  #page-home .home-year-track{width:80px}
  #page-home .home-year-label{font-size:10px}

  /* Net Pay focal point — large centered block */
  #page-home .home-hero-trio{
    flex-direction:column;border:none;padding:18px 18px 0;margin:0;gap:0
  }
  #page-home .home-hero-tstat{
    flex:none;padding:0;border:none;
    display:flex;align-items:center;justify-content:space-between;
    padding:9px 0;border-bottom:0.5px solid var(--border)
  }
  #page-home .home-hero-tstat:last-child{border-bottom:none}
  #page-home .hhs-label{font-size:13px;color:var(--muted);font-weight:500}
  #page-home .home-hero-value{font-size:18px;font-weight:800;letter-spacing:-.3px;line-height:1;margin:0}
  /* Net Pay — make it stand out */
  #page-home .home-hero-tstat:nth-child(2) .home-hero-value{font-size:28px;letter-spacing:-.5px}

  /* Footer */
  #page-home .home-hero-footer{
    padding:12px 18px;margin:0;border-top:0.5px solid var(--border)
  }
  #page-home .home-hero-desc{font-size:11px}
  #page-home .home-hero-info{font-size:11px;gap:12px}

  /* ── OT Summary card ── */
  .mob-home-ot-card{
    margin:0 16px 14px;
    background:var(--surface);
    border-radius:18px;
    border:0.5px solid var(--border);
    padding:0;
    overflow:hidden;
    position:relative;
  }
  .mob-home-ot-card::before{display:none}
  .mob-home-ot-header{
    padding:16px 18px 0;
    font-size:10px;font-weight:700;color:var(--muted);
    text-transform:uppercase;letter-spacing:.7px;
  }
  .mob-home-ot-stats{display:flex;align-items:stretch}
  .mob-home-ot-stat{
    flex:1;display:flex;flex-direction:column;
    align-items:center;gap:4px;
    padding:14px 8px 18px;
  }
  .mob-home-ot-lbl{
    font-size:11px;font-weight:600;color:var(--muted);
    text-align:center;line-height:1.2;letter-spacing:.1px;
  }
  .mob-home-ot-val{
    font-size:22px;font-weight:800;color:var(--accent);
    letter-spacing:-.5px;line-height:1;
  }
  .mob-home-ot-sep{width:0.5px;background:var(--border);flex-shrink:0;margin:10px 0}
  [data-theme="light"] .mob-home-ot-val{color:var(--accent)!important}
  .mob-home-ot-co-row{padding:12px 18px 14px}
  .mob-home-ot-co-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
  .mob-home-ot-co-name{font-size:12px;font-weight:700;color:var(--text);letter-spacing:.1px}
  .mob-home-ot-edit-btn{font-size:11px;font-weight:600;color:var(--accent);background:none;border:none;padding:2px 6px;cursor:pointer}
  .mob-home-ot-co-divider{height:0.5px;background:var(--border);margin:0 18px}
  .mob-home-ot-adj-note{font-size:10px;color:var(--muted);padding:2px 4px;align-self:center}
  .mob-home-ot-adj-row{display:flex;align-items:center;gap:8px;padding:10px 18px 14px;border-top:0.5px solid var(--border)}
  .mob-home-ot-adj-inp{flex:1;background:var(--card);border:0.5px solid var(--border);border-radius:7px;padding:7px 10px;font-size:14px;color:var(--text);min-width:0}
  .mob-home-ot-adj-save{font-size:12px;font-weight:700;background:var(--accent);color:#fff;border:none;border-radius:7px;padding:7px 12px;cursor:pointer}
  .mob-home-ot-adj-cancel{font-size:14px;font-weight:500;background:none;border:none;color:var(--muted);padding:4px 6px;cursor:pointer}

  /* ── OT hero row tap → bottom sheet ── */
  .mob-ot-adj-sheet{position:fixed;inset:0;z-index:9000;display:none;align-items:center;justify-content:center;padding:24px}
  .mob-ot-adj-sheet.open{display:flex}
  .mob-ot-adj-sheet-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.5)}
  .mob-ot-adj-sheet-inner{position:relative;z-index:1;background:var(--surface);border-radius:16px;padding:24px 20px 20px;width:100%;max-width:320px;box-shadow:0 8px 40px rgba(0,0,0,.3)}
  .mob-ot-adj-sheet-title{font-size:17px;font-weight:700;color:var(--text);margin-bottom:4px;text-align:center}
  .mob-ot-adj-sheet-sub{font-size:13px;color:var(--muted);margin-bottom:18px;text-align:center}
  .mob-ot-adj-sheet-inp{width:100%;background:var(--card);border:0.5px solid var(--border);border-radius:11px;padding:13px 14px;font-size:17px;color:var(--text);margin-bottom:16px;box-sizing:border-box;text-align:center}
  .mob-ot-adj-sheet-btns{display:flex;gap:10px}
  .mob-ot-adj-sheet-cancel{flex:1;padding:13px;background:var(--card);border:0.5px solid var(--border);border-radius:11px;font-size:15px;font-weight:600;color:var(--muted);cursor:pointer}
  .mob-ot-adj-sheet-save{flex:1;padding:13px;background:var(--accent);border:none;border-radius:11px;font-size:15px;font-weight:700;color:#fff;cursor:pointer}

  /* ── Deductions card → NTS group style ── */
  #page-home .home-deduct-card{
    margin:0 16px 14px;border-radius:13px;padding:0;overflow:hidden;
    border:0.5px solid var(--border);border-top:none;box-shadow:none
  }
  #page-home .hdb-header{
    padding:10px 14px 8px;margin:0;
    border-bottom:0.5px solid var(--border)
  }
  #page-home .hdb-title{font-size:11px;letter-spacing:.4px}
  #page-home .hdb-grand{font-size:15px}
  /* Deduction rows — override 2-col grid to single column */
  #page-home .hdb-cols{display:flex;flex-direction:column;gap:0;padding:0 14px}
  #page-home .hdb-section{margin:0}
  #page-home .hdb-section-hdr{padding:10px 0 6px}
  #page-home .hdb-section-title{font-size:10px}
  #page-home .hdb-section-sub{font-size:13px}
  #page-home .hdb-row{padding:8px 0;border-bottom:0.5px solid var(--border)}
  #page-home .hdb-row:last-child{border-bottom:none}
  #page-home .hdb-label{font-size:13px;color:var(--text);min-width:0;flex:1}
  #page-home .hdb-bar-wrap{display:none}
  #page-home .hdb-pct{display:none}
  #page-home .hdb-amt{font-size:14px;font-weight:700;min-width:0}
  #page-home .hdb-dot{display:none}

  /* ── Charts — hidden on mobile ── */
  #page-home .home-charts-row{display:none}

  /* ── Paychecks section ── */
  #page-home .home-section-header{
    padding:0 16px 8px;margin:0;border:none
  }
  #page-home .home-section-header.has-toggle{padding-top:16px;padding-bottom:12px}
  #page-home .home-section-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}
  #page-home .home-section-actions .home-nav-btn{
    font-size:13px;font-weight:600;color:var(--accent);
    background:none;border:none;padding:4px 0;cursor:pointer
  }

  /* ── Company cards → full-width NTS-style ── */
  /* Uniform 14px gap between all home containers */
  #page-home .mob-home-ot-card,
  #page-home .home-deduct-card,
  #page-home .hero-stats-ytd,
  #page-home .home-pc-row { margin-bottom:14px }
  #page-home .hero-stats-ytd { margin-left:16px;margin-right:16px }
  #page-home .home-pc-row{
    display:flex;flex-direction:column;gap:10px;padding:0 16px
  }
  /* Blog bar (admin write btn) */
  .home-blog-bar{
    display:flex;justify-content:flex-end;
    padding:0 16px 6px;
    font-size:13px;font-weight:600;color:var(--accent);
    cursor:pointer;-webkit-tap-highlight-color:transparent
  }
  #page-home .home-pc-card{
    border-radius:13px;padding:16px 16px 12px;
    border:0.5px solid var(--border);
    border-left:3px solid var(--pc-color,var(--accent));
    box-shadow:none;cursor:pointer;
    -webkit-tap-highlight-color:transparent
  }
  #page-home .home-pc-card:active{opacity:.8}
  #page-home .hpcc-header{margin-bottom:4px}
  #page-home .hpcc-company{font-size:16px;font-weight:700}
  #page-home .hpcc-loc{font-size:12px;margin-bottom:12px}
  #page-home .hpcc-stats{display:flex;gap:0;justify-content:space-between;margin-bottom:10px}
  #page-home .hpcc-stat label{font-size:10px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);font-weight:700;margin-bottom:3px}
  #page-home .hpcc-stat .hpcc-val{font-size:20px;font-weight:800;letter-spacing:-.3px}
  #page-home .hpcc-ratio-bar{height:4px;border-radius:3px}
  #page-home .hpcc-ratio-label{font-size:10px;margin-top:5px}

  /* ── Mobile account card ── */
  #mobHomeAccount{padding:0 16px 8px}
  .mob-home-acct-card{
    background:var(--surface);border-radius:13px;
    border:0.5px solid var(--border);overflow:hidden;margin-top:10px
  }
  .mob-home-acct-signed-out{padding:20px 18px;text-align:center}
  .mob-home-acct-title{font-size:14px;font-weight:700;color:var(--text);margin-bottom:4px}
  .mob-home-acct-desc{font-size:12px;color:var(--muted);line-height:1.4;margin-bottom:16px}
  .mob-home-acct-btn{
    width:100%;padding:14px;border:none;border-radius:10px;
    background:var(--accent);color:#fff;font-size:15px;font-weight:700;
    cursor:pointer;-webkit-tap-highlight-color:transparent
  }
  .mob-home-acct-btn:active{opacity:.82}
  .mob-home-acct-signed-in{display:flex;align-items:center;gap:12px;padding:16px 18px}
  .mob-home-acct-avatar{
    width:40px;height:40px;border-radius:50%;background:var(--accent);
    display:flex;align-items:center;justify-content:center;
    font-size:16px;font-weight:700;color:#fff;flex-shrink:0
  }
  .mob-home-acct-info{flex:1;min-width:0}
  .mob-home-acct-email{font-size:13px;font-weight:600;color:var(--text);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mob-home-acct-status{font-size:11px;color:var(--accent);font-weight:600;margin-top:1px}
  .mob-home-acct-signout{
    background:none;border:none;font-size:13px;color:var(--muted);
    cursor:pointer;padding:4px 8px;-webkit-tap-highlight-color:transparent;flex-shrink:0
  }
  .mob-home-acct-signout:active{opacity:.5}
  .mob-home-acct-footer{
    font-size:11px;color:var(--muted);text-align:center;
    padding:10px 18px;border-top:0.5px solid var(--border)
  }
}

/* add pay type modal */
.apt-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:400;align-items:center;justify-content:center}
.apt-overlay.open{display:flex}
.apt-modal{background:var(--surface);border-radius:var(--r);padding:20px 24px;width:340px;box-shadow:0 8px 32px rgba(0,0,0,.55)}
.apt-modal h4{font-size:13px;font-weight:700;margin:0 0 14px}
.apt-mob-topbar{display:none} /* shown only on mobile via #aptOverlay override */
/* rate editor modal */
/* ── Pay Type Editor — large centered modal ─────────────────────────────────── */
.re-overlay{display:none;position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.6);align-items:center;justify-content:center;padding:12px;contain:layout style paint}
.re-overlay.open{display:flex}
.re-modal{width:100%;max-width:860px;height:calc(100vh - 24px);display:flex;flex-direction:column;overflow:hidden;background:var(--surface);border-radius:12px;box-shadow:0 24px 64px rgba(0,0,0,.5);border:1px solid var(--border)}

/* Modal header */
.pte-topbar{display:flex;align-items:center;height:52px;background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0;padding:0 20px;border-radius:12px 12px 0 0}
.pte-topbar-inner{display:flex;align-items:center;justify-content:space-between;width:100%}
.pte-topbar-title{font-size:14px;font-weight:700;color:var(--text)}
.pte-topbar-right{display:flex;align-items:center;gap:6px}
.pte-topbar-done{display:none} /* desktop: Done is in the action bar */
.pte-topbar-actions{display:flex;align-items:center;gap:6px}
.pte-topbar-close{background:none;border:none;color:var(--muted);font-size:20px;line-height:1;cursor:pointer;padding:2px 6px;border-radius:4px}
.pte-topbar-close:hover{color:var(--text);background:var(--surface2)}
.pte-topbar-back{background:none;border:none;font-size:16px;font-weight:600;color:var(--accent);cursor:pointer;padding:4px 0;-webkit-tap-highlight-color:transparent}
.pte-topbar-back:hover{opacity:.75}
.pte-saved-ind{font-size:11px;font-weight:600;color:var(--accent);opacity:0;transition:opacity .4s ease;margin-right:auto;padding-left:10px;pointer-events:none}

/* Scrollable body */
.pte-body{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:20px 24px}
.pte-col-main{max-width:none}

/* Period selector bar */
.pte-period-bar{display:flex;align-items:center;gap:12px;margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid var(--border)}
.pte-period-bar label{font-size:12px;font-weight:600;color:var(--muted);white-space:nowrap}
.pte-period-bar select{width:300px;padding:6px 10px;background:var(--surface2);border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:13px}
.re-modal h4{font-size:14px;font-weight:700;margin:0 0 6px}
.re-modal .re-sub{font-size:11px;color:var(--muted);margin-bottom:18px}
.re-modal .field{margin-bottom:16px}
.re-table{width:100%;border-collapse:collapse;margin-top:2px}
.re-table th{font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);font-weight:700;padding:3px 6px;border-bottom:1px solid var(--border)}
.re-table th:last-child{text-align:right}
.re-table td{padding:8px 6px;border-bottom:1px solid var(--border)}
.re-table tr:last-child td{border-bottom:none}
.re-table tr.re-row-active td{background:rgba(0,122,255,.05)}
.re-input{width:86px;padding:5px 8px;background:var(--surface2);border:1px solid var(--border);border-radius:5px;color:var(--text);font-size:13px;text-align:right}
.re-input:disabled{opacity:.3;cursor:not-allowed}
.re-input:not(:disabled){border-color:var(--accent);background:var(--surface)}
.re-chk{width:15px;height:15px;cursor:pointer;accent-color:var(--accent);vertical-align:middle}
.re-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:20px;padding-top:16px;border-top:1px solid var(--border)}
.re-btn-cancel{background:transparent;border:1px solid var(--border);color:var(--muted);border-radius:6px;padding:7px 16px;font-size:12px;font-weight:600;cursor:pointer}
.re-btn-save{background:var(--accent-strong);color:#fff;border:none;border-radius:6px;padding:7px 18px;font-size:12px;font-weight:600;cursor:pointer}
/* Pay Setup action bar — 2×2 grid */
.pte-action-bar{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:14px}
/* Quick-fill hours row */
.pte-qf-row{display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--surface2);border:1px solid var(--border);border-radius:8px;margin-bottom:14px}
.pte-qf-lbl-group{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.pte-qf-lbl{font-size:13px;font-weight:600;color:var(--text)}
.pte-qf-hint{font-size:11px;color:var(--muted)}
.pte-qf-inp{width:72px;padding:7px 8px;font-size:16px;font-weight:700;color:var(--accent);background:var(--surface);border:1px solid var(--border);border-radius:7px;text-align:center;flex-shrink:0;-webkit-appearance:none}
.pte-qf-inp:focus{border-color:var(--accent);outline:none}
.pte-new-btn{color:var(--accent)!important;border-color:var(--accent)!important}
.pte-row2-btn{padding:7px 10px;border-radius:6px;font-size:12px;font-weight:600;cursor:pointer;background:var(--surface2);border:1px solid var(--border);color:var(--muted);transition:background .15s,color .15s,border-color .15s}
.pte-row2-btn:hover{border-color:var(--accent);color:var(--accent)}
.pte-cancel-btn.has-changes{background:var(--accent)!important;border-color:var(--accent)!important;color:#fff!important}
.pte-row2-del{background:none;border-color:#ef4444!important;color:#ef4444!important;transition:background .15s,color .15s}
.pte-row2-del:hover{background:rgba(239,68,68,.08)}
.pte-row2-del.has-selection{background:#ef4444!important;color:#fff!important;border-color:#ef4444!important}
.pte-del-chk{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;border:1.5px solid rgba(239,68,68,.4);background:transparent;cursor:pointer;vertical-align:middle;outline:none;transition:background .15s,border-color .15s;flex-shrink:0}
.pte-del-chk:checked{background:#ef4444;border-color:#ef4444}
.re-schedule-list{margin-top:14px;padding-top:10px;border-top:1px solid var(--border)}
.re-schedule-list .rsl-title{font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);font-weight:700;margin-bottom:8px}
.rsl-entry{display:flex;align-items:center;gap:10px;font-size:12px;padding:5px 0;border-bottom:1px solid var(--border)}
.rsl-entry:last-child{border-bottom:none}
.rsl-from{font-weight:700;color:var(--text);min-width:160px}
.rsl-rates{flex:1;color:var(--muted)}
.rsl-del{color:var(--red);cursor:pointer;font-size:11px;font-weight:600;padding:2px 6px;border:1px solid var(--red);border-radius:4px;background:transparent}
.rate-change-btn{background:transparent;color:var(--muted);border:1px solid var(--border);border-radius:6px;padding:4px 10px;font-size:11px;font-weight:600;cursor:pointer;white-space:nowrap;margin-left:6px}
.rate-change-btn:hover{color:var(--accent);border-color:var(--accent)}
.pte-lbl-input{width:130px;padding:4px 7px;background:var(--surface2);border:1px solid var(--border);border-radius:5px;color:var(--text);font-size:13px}
.pte-lbl-input:focus{border-color:var(--accent);outline:none;background:var(--surface)}
.pte-rate-input{width:72px;padding:4px 7px;background:var(--surface2);border:1px solid var(--border);border-radius:5px;color:var(--text);font-size:13px;text-align:center}
.pte-qf-type-inp{width:52px;padding:4px 6px;background:var(--surface2);border:1px solid var(--border);border-radius:5px;color:var(--accent);font-size:13px;font-weight:600;text-align:center;-webkit-appearance:none}
.pte-qf-type-inp:focus{border-color:var(--accent);outline:none;background:var(--surface)}
.pte-rate-input:focus{border-color:var(--accent);outline:none;background:var(--surface)}
.pte-lbl-row{display:flex;align-items:center;gap:5px}
.pte-lbl-row .pte-lbl-input{flex:1;min-width:0}
.pte-mult-sel{flex-shrink:0;font-size:10px;color:var(--muted);background:var(--surface2);border:1px solid var(--border);border-radius:5px;padding:3px 5px 3px 6px;cursor:pointer;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7' height='4'%3E%3Cpath d='M0 0l3.5 4L7 0z' fill='%238b95a8'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 5px center;padding-right:16px;width:62px}
.pte-mult-active{color:var(--accent)!important;border-color:rgba(0,122,255,.4)!important;background-color:rgba(0,122,255,.06)!important}
.pte-stepper{display:flex;align-items:center;gap:4px}
.pte-step-btn{width:28px;height:28px;border:1px solid var(--border);background:var(--surface2);border-radius:5px;font-size:16px;line-height:1;cursor:pointer;color:var(--muted);flex-shrink:0;display:flex;align-items:center;justify-content:center}
.pte-step-btn:active{background:var(--accent);color:#fff;border-color:var(--accent)}
.pte-row-changed td{background:rgba(0,122,255,.06)}
.pte-row-hidden td{opacity:.45}
.pte-row-base td{background:rgba(245,158,11,.06)}
.pte-row-base{border-left:3px solid #f59e0b!important;position:relative}
.pte-base-tag{display:inline-block;font-size:9px;font-weight:700;color:#b45309;background:rgba(245,158,11,.18);border:1px solid rgba(245,158,11,.4);border-radius:4px;padding:1px 5px;letter-spacing:.4px;text-transform:uppercase;margin-left:6px;vertical-align:middle}
.pte-row-base{position:relative}
.pte-base-warn-overlay{display:none;position:fixed;inset:0;z-index:500;background:rgba(0,0,0,.55);align-items:center;justify-content:center;padding:24px}
.pte-base-warn-overlay.open{display:flex}
.pte-base-warn-modal{background:var(--surface);border-radius:16px;padding:24px 22px 20px;max-width:340px;width:100%;box-shadow:0 12px 48px rgba(0,0,0,.4)}
.pte-base-warn-icon{font-size:36px;text-align:center;margin-bottom:10px}
.pte-base-warn-title{font-size:17px;font-weight:700;color:var(--text);text-align:center;margin-bottom:8px}
.pte-base-warn-body{font-size:13px;color:var(--muted);line-height:1.55;text-align:center;margin-bottom:20px}
.pte-base-warn-body strong{color:#b45309}
.pte-base-warn-btns{display:flex;flex-direction:column;gap:8px}
.pte-base-warn-edit{background:var(--accent);color:#fff;border:none;border-radius:10px;padding:12px;font-size:15px;font-weight:600;cursor:pointer;width:100%;-webkit-tap-highlight-color:transparent}
.pte-base-warn-cancel{background:var(--surface2);color:var(--text);border:none;border-radius:10px;padding:12px;font-size:15px;font-weight:600;cursor:pointer;width:100%;-webkit-tap-highlight-color:transparent}
.pte-move-btn{background:none;border:1px solid var(--border);border-radius:3px;color:var(--muted);font-size:10px;padding:1px 4px;cursor:pointer;line-height:1.4;display:block;width:20px;text-align:center}
.pte-move-btn:hover{border-color:var(--accent);color:var(--accent)}
.pte-move-btn:disabled{opacity:.25;cursor:default}
.pte-vis-chk{width:15px;height:15px;cursor:pointer;accent-color:var(--accent)}
.ts-lbl-hidden,.ts-cell-hidden{display:none!important}
.pte-section-divider td{padding:8px 0 2px!important;border-bottom:none!important}
.apt-modal .field{margin-bottom:10px}
.apt-modal .field label{font-size:10px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;display:block;margin-bottom:4px}
.apt-modal .field input,.apt-modal .field select{width:100%;padding:6px 8px;font-size:12px;border:1px solid var(--border-md);border-radius:6px;outline:none;font-family:inherit}
.apt-modal .field input:focus,.apt-modal .field select:focus{border-color:var(--accent)}
.apt-rate-row{display:flex;gap:6px;align-items:center}
.apt-rate-row #apt_rate{flex:1;min-width:0}
.apt-mult-drp{flex-shrink:0;padding:6px 4px;font-size:11px;border:1px solid var(--border-md);border-radius:6px;background:var(--surface);color:var(--text);outline:none;cursor:pointer;width:110px}
.apt-mult-drp:focus{border-color:var(--accent)}
.apt-mult-drp.active{color:var(--accent);border-color:rgba(0,122,255,.4)}
.apt-section-pills{display:flex;gap:8px;margin-top:2px}
.apt-pill{display:flex;align-items:center;justify-content:center;gap:5px;padding:7px 12px;border-radius:20px;border:1px solid var(--border-md);font-size:12px;cursor:pointer;transition:background .15s,border-color .15s,color .15s;user-select:none;flex:1;font-weight:500;color:var(--text)}
.apt-pill.active{background:rgba(0,122,255,.15);border-color:var(--accent);color:var(--accent);font-weight:700}
.apt-pill input[type=radio]{display:none}
.apt-base-hint{background:var(--surface2);border:1px solid var(--border);border-radius:8px;padding:10px 12px;margin-bottom:14px}
.apt-base-hint-row{display:flex;align-items:baseline;gap:6px;margin-bottom:4px}
.apt-base-hint-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}
.apt-base-hint-val{font-size:15px;font-weight:700;color:var(--text)}
.apt-base-hint-mults{display:flex;gap:10px;margin-top:6px;flex-wrap:wrap}
.apt-base-hint-mult{font-size:11px;color:var(--muted);background:var(--surface);border:1px solid var(--border);border-radius:5px;padding:3px 8px;white-space:nowrap}
.apt-base-hint-mult span{color:var(--accent);font-weight:700}
.apt-modal-btns{display:flex;gap:8px;margin-top:16px}
.apt-modal-btns button{flex:1;padding:7px;border-radius:6px;font-size:12px;font-weight:600;cursor:pointer;border:none}
.apt-btn-cancel{background:var(--surface2);color:var(--muted)}
.apt-btn-add{background:var(--accent-strong);color:#fff}
.apt-delete-zone{margin-top:12px}
.apt-btn-delete{width:100%;padding:7px;border-radius:6px;font-size:12px;font-weight:600;cursor:pointer;border:none;background:rgba(255,59,48,.1);color:#FF3B30}
.apt-btn-delete:hover{background:rgba(255,59,48,.2)}
/* Segmented control (desktop) */
.apt-seg-ctrl{display:flex;background:rgba(118,118,128,.1);border-radius:8px;padding:2px;margin-top:4px}
.apt-seg-opt{flex:1;text-align:center;padding:6px 4px;border:none;border-radius:6px;font-size:12px;font-weight:500;background:none;color:var(--text);cursor:pointer;transition:background .12s,box-shadow .12s}
.apt-seg-opt.active{background:var(--surface);box-shadow:0 1px 3px rgba(0,0,0,.15);font-weight:600}
.pc-date-field{border-top:1px solid var(--border);margin-top:14px;padding-top:12px}
.pc-date-note{font-size:8px;font-weight:500;color:var(--muted);text-transform:none;letter-spacing:0}
.pc-date-hint{font-size:10px;color:var(--amber,#f59e0b);margin-top:6px;line-height:1.4;background:rgba(245,158,11,.08);border-radius:5px;padding:6px 8px;border:1px solid rgba(245,158,11,.25)}
/* ── New-paycheck modal mini-calendar ── */
.pc-cal-wrap{margin-top:14px;border-top:1px solid var(--border);padding-top:12px}
.pc-cal-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.pc-cal-nav span{font-size:12px;font-weight:700;color:var(--text)}
.pc-cal-nav button{background:none;border:none;color:var(--muted);cursor:pointer;font-size:16px;padding:2px 7px;line-height:1;border-radius:4px;transition:color .15s,background .15s}
.pc-cal-nav button:hover{color:var(--accent);background:rgba(0,122,255,.1)}
/* CSS grid — avoids all <table> layout quirks and the global tbody tr:hover bleed */
.pc-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);width:100%}
.pc-cal-th{text-align:center;font-size:9.5px;font-weight:600;color:var(--muted);padding:3px 0 6px;text-transform:uppercase;letter-spacing:.3px}
.pc-cal-day{text-align:center;padding:6px 0;font-size:11px;color:var(--text);line-height:1;cursor:pointer;border-radius:3px;transition:background .12s}
.pc-cal-day.pcd-other{opacity:0;pointer-events:none;cursor:default}
.pc-cal-day:not(.pcd-other):not(.pcd-period):not(.pcd-start):not(.pcd-end):hover{background:rgba(0,122,255,.13)}
/* today: teal ring */
.pc-cal-day.pcd-today{font-weight:700;color:var(--accent);box-shadow:inset 0 0 0 1.5px var(--accent)}
.pc-cal-day.pcd-today.pcd-start,.pc-cal-day.pcd-today.pcd-end{box-shadow:none}
/* period band: light fill in middle, solid caps at start/end */
.pc-cal-day.pcd-period{background:rgba(0,122,255,.16)}
.pc-cal-day.pcd-period:not(.pcd-start):not(.pcd-end):hover{background:rgba(0,122,255,.28)}
.pc-cal-day.pcd-start{background:var(--accent);color:#000;font-weight:700;border-radius:4px 0 0 4px}
.pc-cal-day.pcd-end{background:var(--accent);color:#000;font-weight:700;border-radius:0 4px 4px 0}
.pc-cal-day.pcd-start.pcd-end{border-radius:4px}
.pc-cal-day.pcd-used{background:var(--surface2);color:var(--text);opacity:1;cursor:default}
.pc-cal-day.pcd-used:hover{background:var(--surface2)}
.pc-period-label{text-align:center;font-size:10.5px;font-weight:600;color:var(--accent);margin-top:10px;letter-spacing:.2px}
.pc-period-label.pc-period-empty{color:var(--muted);font-weight:400;font-style:italic}
.ts-lbl-corner-wrap{display:flex;align-items:center;justify-content:space-between;padding-right:8px}
.ts-add-btn{font-size:14px;line-height:1;color:var(--accent);cursor:pointer;padding:2px 4px;border-radius:4px;font-weight:700}
.ts-add-btn:hover{background:var(--accent-light)}
.ts-lbl-addbtn{height:26px;display:flex;align-items:center;gap:3px;padding:0 8px;font-size:10px;font-weight:600;color:var(--accent);cursor:pointer;border-bottom:1px solid var(--border);background:var(--surface);flex-shrink:0}
.ts-lbl-addbtn:hover{background:var(--accent-light)}
.ts-lbl-archive-btn{font-size:8px;font-weight:600;color:var(--muted);cursor:pointer;padding:2px 6px;border-radius:4px;border:1px solid var(--border);background:var(--surface);transition:all .15s;white-space:nowrap}
.ts-lbl-archive-btn:hover{color:var(--accent);border-color:var(--accent);background:var(--accent-light)}
.ts-lbl-drag{font-size:11px;color:var(--border-md);cursor:grab;padding:0 3px 0 0;flex-shrink:0;opacity:0;transition:opacity .15s;user-select:none;line-height:1}
.ts-lbl-row:hover .ts-lbl-drag{opacity:1}
.ts-lbl-drag:active{cursor:grabbing}
.ts-lbl-row.lbl-drag-over-above{box-shadow:inset 0 2px 0 var(--accent)}
.ts-lbl-row.lbl-drag-over-below{box-shadow:inset 0 -2px 0 var(--accent)}
.ts-lbl-row.lbl-dragging{opacity:.4}
.ts-lbl-addbtn .ts-add-btn{padding:0 2px}
.ts-cell-addbtn{height:26px;border-bottom:1px solid var(--border);background:var(--surface);flex-shrink:0}
.ts-lbl-row-custom{display:flex;align-items:center;justify-content:space-between;width:100%}
.ts-lbl-actions{display:flex;align-items:center;gap:1px;flex-shrink:0}
.ts-lbl-del,.ts-lbl-edit{font-size:10px;color:var(--muted);cursor:pointer;opacity:0;padding:1px 3px;border-radius:3px}
.ts-lbl-row:hover .ts-lbl-del,.ts-lbl-row:hover .ts-lbl-edit,
.cust-ded-field:hover .ts-lbl-del,.cust-ded-field:hover .ts-lbl-edit{opacity:1}
.ts-lbl-del:hover{color:var(--red);background:var(--red-light)}
.ts-lbl-edit:hover{color:var(--accent);background:var(--accent-light)}
/* earnings drawer */
.earn-drawer{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);margin-top:10px;box-shadow:var(--shadow-sm);overflow:hidden}
.earn-drawer-toggle{display:flex;justify-content:space-between;align-items:center;padding:10px 18px;cursor:pointer;font-size:12px;font-weight:600;color:var(--muted);user-select:none}
.earn-drawer-toggle:hover{background:var(--surface2)}
.earn-chevron{font-size:10px;transition:transform .2s}
.earn-drawer.collapsed .earn-chevron{transform:rotate(180deg)}
.earn-drawer-body{display:flex;gap:0;border-top:1px solid var(--border)}
.earn-drawer.collapsed .earn-drawer-body{display:none}
.earn-section{flex:1;padding:12px 18px}
.earn-section+.earn-section{border-left:1px solid var(--border)}
.earn-hdr{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin-bottom:8px}
/* toggle */
.toggle-row{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.toggle-row label{font-size:12px;color:var(--muted)}
.toggle{width:36px;height:20px;background:var(--border-md);border-radius:10px;cursor:pointer;position:relative;transition:background .2s}
.toggle.on{background:var(--accent)}
.toggle::after{content:'';position:absolute;width:14px;height:14px;background:#fff;border-radius:50%;top:3px;left:3px;transition:left .2s;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.toggle.on::after{left:19px}

/* tabular monospace for currency / numeric figures */
.hs-value,.kpi-mini .kv,.kpi-card .kv,.result-row .rv,.ts-stat .sv,.pt-net,
.dt-dollars,.pc-total,.th-total,.ts-cell-tot,.detail-total,.day-total-chip strong,
tbody td:not(:first-child),.vs-row td:not(:first-child) {
  font-family:var(--font-mono);
  font-variant-numeric:tabular-nums;
}

/* ── Signup nudge banner ─────────────────────────────────────────── */
#signupNudge {
  background:linear-gradient(90deg,var(--surface2),var(--surface));
  border-bottom:1px solid var(--border);
  padding:10px 24px; display:flex; align-items:center; justify-content:space-between;
  gap:12px; font-size:13px;
}
#signupNudge.hidden { display:none; }
.nudge-text { color:var(--muted); }
.nudge-text strong { color:var(--text); }
.nudge-actions { display:flex; align-items:center; gap:10px; flex-shrink:0; }
.nudge-cta {
  background:var(--accent); color:#000; border:none;
  padding:7px 16px; border-radius:7px; font-size:12px; font-weight:700;
  cursor:pointer; transition:opacity .15s;
}
.nudge-cta:hover { opacity:.85; }
.nudge-dismiss {
  color:var(--muted); font-size:12px; cursor:pointer;
  background:none; border:none; padding:4px 8px; border-radius:6px;
  transition:color .15s;
}
.nudge-dismiss:hover { color:var(--text); }
/* ── Mobile save nudge bottom sheet ──────────────────────────────── */
@media(max-width:768px){
  #signupNudge{display:none!important} /* desktop-only banner */
  #mobSaveNudge{
    position:fixed;inset:0;z-index:9990;
    display:flex;flex-direction:column;justify-content:flex-end;
    background:rgba(0,0,0,0);pointer-events:none;
    transition:background .25s;
  }
  #mobSaveNudge.open{background:rgba(0,0,0,.5);pointer-events:auto}
  .mob-save-nudge-bg{position:absolute;inset:0;pointer-events:none}
  #mobSaveNudge.open .mob-save-nudge-bg{pointer-events:auto}
  .mob-save-nudge-sheet{
    position:relative;background:var(--surface);
    border-radius:24px 24px 0 0;padding:12px 24px 52px;
    transform:translateY(100%);transition:transform .32s cubic-bezier(.32,.72,0,1);
  }
  #mobSaveNudge.open .mob-save-nudge-sheet{transform:translateY(0)}
  .mob-save-nudge-handle{
    width:36px;height:4px;border-radius:2px;background:var(--border);
    margin:0 auto 22px;
  }
  .mob-save-nudge-body{text-align:center}
  .mob-save-nudge-icon{font-size:38px;margin-bottom:10px;line-height:1}
  .mob-save-nudge-title{font-size:20px;font-weight:700;color:var(--text);margin-bottom:8px}
  .mob-save-nudge-sub{font-size:14px;color:var(--muted);margin-bottom:28px;line-height:1.55}
  .mob-save-nudge-cta{
    display:block;width:100%;padding:16px;border-radius:14px;border:none;
    background:var(--accent);color:#000;font-size:16px;font-weight:700;
    cursor:pointer;margin-bottom:10px;-webkit-tap-highlight-color:transparent;
  }
  .mob-save-nudge-trial{
    display:block;width:100%;padding:14px;border-radius:14px;
    border:1px solid var(--border);background:var(--surface2);
    color:var(--text);font-size:15px;cursor:pointer;
    -webkit-tap-highlight-color:transparent;
  }
  /* ── Welcome / sign-in gate ──────────────────────────────────────── */
  /* Forced mode — no escape */
  #mobSaveNudge.forced .mob-save-nudge-bg{pointer-events:none}
  #mobSaveNudge.forced #mobNudgeHandle{display:none}
  #mobSaveNudge.forced #mobNudgeTrial{display:none}
}
/* ── Welcome toast ───────────────────────────────────────────────── */
#welcomeToast {
  position:fixed; bottom:28px; right:28px; z-index:9998;
  background:var(--surface); border:1px solid var(--accent);
  border-radius:12px; padding:14px 20px;
  box-shadow:0 4px 24px rgba(0,0,0,.4);
  display:flex; align-items:center; gap:12px;
  font-size:14px; font-weight:600; color:var(--text);
  opacity:0; transform:translateY(12px);
  transition:opacity .35s ease, transform .35s ease;
  pointer-events:none;
}
#welcomeToast.show { opacity:1; transform:translateY(0); }
.toast-dot { width:8px; height:8px; border-radius:50%; background:var(--accent); flex-shrink:0; }
/* ── Login overlay ──────────────────────────────────────────────── */
#loginOverlay {
  position:fixed; inset:0; z-index:9999;
  background:var(--bg);
  display:flex; align-items:center; justify-content:center;
  flex-direction:column; gap:32px;
}
#loginOverlay.hidden { display:none; }
.login-card {
  background:var(--surface); border:1px solid var(--border);
  border-radius:20px; padding:44px 40px 36px; width:400px; text-align:center;
  box-shadow:0 8px 40px rgba(0,0,0,.45);
}
.login-brand {
  display:flex; align-items:center; justify-content:center; gap:10px;
  margin-bottom:6px;
}
.login-brand-dot {
  width:10px; height:10px; border-radius:50%;
  background:var(--accent); display:inline-block;
}
.login-logo {
  font-size:20px; font-weight:800; color:var(--text); letter-spacing:-.3px;
}
.login-tagline {
  font-size:13px; color:var(--muted); margin-bottom:8px;
}
.login-welcome {
  font-size:24px; font-weight:700; color:var(--text);
  margin-bottom:6px; letter-spacing:-.4px;
}
.login-desc {
  font-size:13px; color:var(--muted); margin-bottom:28px; line-height:1.5;
}
.login-divider { color:var(--muted); font-size:12px; margin:18px 0; position:relative; }
.login-divider::before,.login-divider::after {
  content:''; position:absolute; top:50%; width:42%; height:1px;
  background:var(--border);
}
.login-divider::before { left:0; }
.login-divider::after  { right:0; }
.login-email-wrap { display:flex; flex-direction:column; gap:10px; }
.login-email-wrap input {
  width:100%; padding:12px 14px; border-radius:10px; border:1px solid var(--border);
  background:var(--surface2); color:var(--text); font-size:14px; box-sizing:border-box;
  transition:border-color .15s;
}
.login-email-wrap input:focus { outline:none; border-color:var(--accent); }
.login-email-wrap input::placeholder { color:var(--muted); }
.login-email-wrap button {
  width:100%; padding:13px; border-radius:10px; border:none;
  background:var(--accent); color:#000; font-size:14px; font-weight:700;
  cursor:pointer; transition:opacity .15s;
}
.login-email-wrap button:hover { opacity:.85; }
.login-msg { font-size:13px; margin-top:14px; color:var(--accent); min-height:20px; }
.login-forgot {
  font-size:12px; color:var(--muted); margin-top:10px; cursor:pointer;
  text-align:right; transition:color .15s;
}
.login-forgot:hover { color:var(--text); }
.login-toggle {
  font-size:13px; color:var(--muted); margin-top:18px;
}
.login-toggle span { color:var(--accent); cursor:pointer; font-weight:600; }
.login-toggle span:hover { text-decoration:underline; }
.login-skip {
  font-size:12px; color:var(--muted); margin-top:16px; cursor:pointer;
  text-decoration:underline; opacity:.7; transition:opacity .15s;
}
.login-skip:hover { opacity:1; }
.login-footer {
  font-size:11px; color:var(--muted); opacity:.5; text-align:center;
}
/* ── Login overlay — mobile ── */
@media(max-width:768px){
  #loginOverlay{
    align-items:stretch;justify-content:flex-end;
    background:var(--bg)
  }
  .login-card{
    width:100%;border-radius:24px 24px 0 0;
    padding:28px 24px 48px;box-sizing:border-box;
    border-bottom:none;
  }
  .login-brand{margin-bottom:4px}
  .login-logo{font-size:18px}
  .login-tagline{font-size:12px;margin-bottom:0}
  .login-welcome{font-size:22px;margin-top:22px;margin-bottom:4px}
  .login-desc{font-size:13px;margin-bottom:22px}
  .login-email-wrap input{padding:14px;font-size:16px!important;border-radius:12px}
  .login-email-wrap button{padding:15px;font-size:15px;border-radius:12px}
  .login-skip{font-size:13px;margin-top:18px}
  #loginOverlay .login-footer{display:none}
}
/* Nav auth button */
.nav-auth-btn {
  background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.4); color:#fff;
  padding:5px 12px; border-radius:6px; font-size:12px; cursor:pointer;
  transition:all .15s;
}
.nav-auth-btn:hover { background:rgba(255,255,255,.25); border-color:#fff; color:#fff; }

/* ════════════════════════════════════════════════════════════
   DARK MODE UNIFORM STYLE — must be last to win cascade
   Rule: bold text → white | tags/badges → light grey |
         oval buttons → white text + blue border | arrows stay blue
   ════════════════════════════════════════════════════════════ */

/* ── Tags & chips → white ── */
.mob-dc-tag-chip{background:rgba(255,255,255,.12)!important;color:#fff!important;border:none!important}
.mob-dc-time-label{background:rgba(255,255,255,.1)!important;color:#fff!important;border-radius:6px;padding:1px 5px;margin-left:2px}
.mob-dc-shift-chip{background:rgba(255,255,255,.12)!important;color:#fff!important}
.mob-dc-combo-chip{background:rgba(255,255,255,.12)!important;color:#fff!important}
.mob-dc-sched-chip{background:rgba(255,255,255,.12)!important;color:rgba(255,255,255,.7)!important}
.mob-cal-sched{color:rgba(255,255,255,.55)!important}
.mob-dd-preview-tag{background:rgba(255,255,255,.12)!important;color:#fff!important}
.mob-dd-preview-shift{background:rgba(255,255,255,.12)!important;color:#fff!important}
.mob-dd-preview-combo{background:rgba(255,255,255,.12)!important;color:#fff!important}
.mob-panel-badge{background:rgba(255,255,255,.12)!important;color:#fff!important}
.mob-day-tab-amt{color:#fff!important}
.pte-info-badge{background:rgba(255,255,255,.08)!important;border-color:rgba(255,255,255,.1)!important;color:#fff!important}

/* ── Bold values/totals → white ── */
.mob-dd-total{color:#fff!important}
.mob-dd-title{color:#fff!important}
.mob-dd-title.is-today{color:#fff!important}
.mob-dd-cur-hrs{color:rgba(255,255,255,.8)!important}
.mob-day-total-val{color:#fff!important}
.mob-dc-amt{color:#fff!important}
.mob-dc-dayname{color:#fff!important}
.mob-dd-lbl{color:#fff!important}
.mob-dd-qf-hint strong{color:#fff!important}
.mob-pp-item.is-active .mob-pp-item-label{color:#fff!important}
.mob-pp-item-current{color:#fff!important}
.mob-dc-hrs{color:rgba(255,255,255,.45)!important}

/* ── Today/weekend card backgrounds ── */
.mob-day-card.is-today{background:var(--surface)!important;border:1.5px solid rgba(255,255,255,.3)!important}
.mob-day-card.is-weekend{background:#252830!important}

/* ── Oval/pill buttons → white text, blue border ── */
.mob-multi-btn{color:#fff!important}
.mob-dd-add-btn,.mob-dd-copy-btn,.mob-dd-clear-btn,.mob-dd-done-btn,.mob-dd-note-btn{color:#fff!important}
.mob-co-pill{color:#fff!important}
.mob-edit-period-btn{color:#fff!important}
.mob-period-date-btn{color:#fff!important}
.mob-co-sheet-add{color:#fff!important}
.mob-pp-new-btn{color:#fff!important}
.mob-hero-edit-oval{color:#fff!important}
.mob-hero-plus-btn{color:#fff!important}
.ss-toggle-btn{color:#fff!important}
.mob-ns-form-btn.save{color:#fff!important}

/* ── Day detail row states ── */
.mob-dd-row.is-active{background:rgba(255,255,255,.04)!important}
.mob-dd-row.is-expanded .mob-dd-chevron{color:rgba(255,255,255,.55)!important}

/* ── Light theme: undo all of the above ── */
[data-theme="light"] .mob-dc-tag-chip{background:rgba(0,0,0,.07)!important;color:var(--text)!important;border:unset!important}
[data-theme="light"] .mob-dc-time-label{background:rgba(0,0,0,.06)!important;padding:1px 5px!important;border-radius:6px!important;color:var(--text)!important;margin-left:2px}
[data-theme="light"] .mob-dc-shift-chip{background:rgba(0,0,0,.07)!important;color:var(--text)!important}
[data-theme="light"] .mob-dc-combo-chip{background:rgba(0,0,0,.07)!important;color:var(--text)!important}
[data-theme="light"] .mob-dd-preview-tag{background:rgba(0,0,0,.07)!important;color:var(--text)!important}
[data-theme="light"] .mob-dd-preview-shift{background:rgba(0,0,0,.07)!important;color:var(--text)!important}
[data-theme="light"] .mob-dd-preview-combo{background:rgba(0,0,0,.07)!important;color:var(--text)!important}
[data-theme="light"] .mob-panel-badge{background:rgba(0,0,0,.07)!important;color:var(--text)!important}
[data-theme="light"] .mob-day-tab-amt{color:var(--text)!important}
[data-theme="light"] .pte-info-badge{background:rgba(0,0,0,.06)!important;border-color:rgba(0,0,0,.1)!important;color:var(--text)!important}
[data-theme="light"] .mob-dd-total{color:var(--text)!important}
[data-theme="light"] .mob-home-ot-val{color:var(--accent)!important}
[data-theme="light"] .mob-dd-title{color:var(--text)!important}
[data-theme="light"] .mob-dd-title.is-today{color:var(--text)!important}
[data-theme="light"] .mob-dd-cur-hrs{color:var(--accent)!important}
[data-theme="light"] .mob-day-total-val{color:var(--accent)!important}
[data-theme="light"] .mob-dc-amt{color:var(--text)!important}
[data-theme="light"] .mob-dc-dayname{color:var(--text)!important}
[data-theme="light"] .mob-dd-lbl{color:var(--text)!important}
[data-theme="light"] .mob-dd-qf-hint strong{color:var(--accent)!important}
[data-theme="light"] .mob-pp-item.is-active .mob-pp-item-label{color:var(--accent)!important}
[data-theme="light"] .mob-pp-item-current{color:var(--accent)!important}
[data-theme="light"] .mob-dc-hrs{color:var(--muted)!important}
[data-theme="light"] .mob-day-card.is-today{background:var(--surface)!important;border:1.5px solid var(--accent)!important}
[data-theme="light"] .mob-day-card.is-weekend{background:rgba(251,191,36,.06)!important}
[data-theme="light"] .mob-day-card.is-today .mob-dc-dayname{color:var(--accent)!important}
[data-theme="light"] .mob-day-card.is-weekend .mob-dc-dayname{color:var(--text)!important}
[data-theme="light"] .mob-multi-btn{color:var(--text)!important}
[data-theme="light"] .mob-dd-add-btn,[data-theme="light"] .mob-dd-copy-btn,[data-theme="light"] .mob-dd-clear-btn,[data-theme="light"] .mob-dd-done-btn,[data-theme="light"] .mob-dd-note-btn{color:var(--text)!important}
[data-theme="light"] .mob-multi-btn.active-fill{color:#fff!important}
[data-theme="light"] .mob-dd-done-btn.active-fill{color:#fff!important}
[data-theme="light"] .mob-co-pill{color:var(--text)!important}
[data-theme="light"] .mob-edit-period-btn{color:var(--text)!important}
[data-theme="light"] .mob-period-date-btn{color:var(--text)!important}
[data-theme="light"] .mob-co-sheet-add{color:var(--accent)!important}
[data-theme="light"] .mob-pp-new-btn{color:var(--accent)!important}
[data-theme="light"] .mob-hero-edit-oval{color:var(--accent)!important}
[data-theme="light"] .mob-hero-plus-btn{color:var(--accent)!important}
[data-theme="light"] .ss-toggle-btn{color:var(--accent)!important}
[data-theme="light"] .mob-dd-row.is-active{background:rgba(0,122,255,.04)!important}
[data-theme="light"] .mob-dd-row.is-expanded .mob-dd-chevron{color:var(--accent)!important}
[data-theme="light"] .mob-dc-sched-chip{background:rgba(255,149,0,.13)!important;color:#c97a00!important}
[data-theme="light"] .mob-dc-sched-chip.is-off{background:rgba(142,142,147,.13)!important;color:var(--muted)!important}
[data-theme="light"] .mob-cal-sched{color:#007AFF!important}

/* ══════════════════════════════════════════════════════
   BLOG / LEARN SECTION
══════════════════════════════════════════════════════ */

/* ── Blog section container (home page) ── */
.blog-section{
  display:flex;flex-direction:row;
  overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  padding:0 16px 0;gap:12px;
  scrollbar-width:none;
  margin:14px 0 14px;
}
.blog-section::-webkit-scrollbar{display:none}
.blog-loading{flex-shrink:0;text-align:center;color:var(--muted);font-size:13px;padding:24px 16px;width:100%}
.blog-empty{flex-shrink:0;text-align:center;color:var(--muted);font-size:13px;padding:24px 16px;font-style:italic;width:100%}

/* ── Blog card ── */
.blog-card{
  flex-shrink:0;width:120px;height:120px;
  scroll-snap-align:start;
  background:var(--surface);border:0.5px solid var(--border);
  border-radius:14px;overflow:hidden;
  cursor:pointer;-webkit-tap-highlight-color:transparent;
  transition:opacity .15s;display:flex;flex-direction:column;
}
.blog-card:active{opacity:.72}
.blog-card-img{width:100%;height:66px;object-fit:cover;display:block;background:var(--surface2);flex-shrink:0}
.blog-card-body{padding:6px 9px 8px;display:flex;flex-direction:column;flex:1;overflow:hidden;justify-content:space-between}
.blog-card-tag{display:inline-block;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:2px 7px;border-radius:20px;margin-bottom:6px}
.blog-tag-paycheck101{background:rgba(74,222,128,.15);color:#4ade80}
.blog-tag-taxtips{background:rgba(251,191,36,.15);color:#d97706}
.blog-tag-otrules{background:rgba(0,122,255,.15);color:#007AFF}
.blog-tag-benefits{background:rgba(167,139,250,.15);color:#a78bfa}
.blog-tag-news{background:rgba(249,115,22,.15);color:#f97316}
.blog-tag-general{background:rgba(100,116,139,.15);color:var(--muted)}
.blog-tag-college{background:rgba(16,185,129,.15);color:#10b981}
.blog-tag-401k{background:rgba(99,102,241,.15);color:#6366f1}
.blog-tag-realestatetax{background:rgba(244,63,94,.15);color:#f43f5e}
.blog-card-title{font-size:11px;font-weight:700;color:var(--text);line-height:1.3;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;flex:1}
.blog-card-snippet{display:none}
.blog-card-footer{margin-top:8px}
.blog-card-date{display:none}
.blog-card-read{font-size:11px;font-weight:600;color:var(--accent)}

/* light mode card */
[data-theme="light"] .blog-tag-paycheck101{background:rgba(22,163,74,.12);color:#16a34a}
[data-theme="light"] .blog-tag-taxtips{background:rgba(217,119,6,.12);color:#d97706}
[data-theme="light"] .blog-tag-otrules{background:rgba(0,122,255,.12);color:#007AFF}
[data-theme="light"] .blog-tag-benefits{background:rgba(124,58,237,.12);color:#7c3aed}
[data-theme="light"] .blog-tag-news{background:rgba(234,88,12,.12);color:#ea580c}
[data-theme="light"] .blog-tag-college{background:rgba(16,185,129,.12);color:#059669}
[data-theme="light"] .blog-tag-401k{background:rgba(99,102,241,.12);color:#4f46e5}
[data-theme="light"] .blog-tag-realestatetax{background:rgba(244,63,94,.12);color:#e11d48}

/* ── Blog reader overlay (full-screen) ── */
.blog-reader-overlay{position:fixed;inset:0;z-index:500;background:var(--bg);visibility:hidden;pointer-events:none;transform:translateX(100%);transition:transform .28s cubic-bezier(.4,0,.2,1),visibility 0s .28s;overflow-y:auto;-webkit-overflow-scrolling:touch}
.blog-reader-overlay.open{visibility:visible;pointer-events:auto;transform:translateX(0);transition:transform .28s cubic-bezier(.4,0,.2,1),visibility 0s 0s}
.blog-reader-topbar{position:sticky;top:0;z-index:10;background:var(--bg);border-bottom:0.5px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:calc(env(safe-area-inset-top,0px) + 12px) 16px 12px}
.blog-reader-back{background:none;border:none;font-size:16px;font-weight:600;color:var(--accent);cursor:pointer;padding:4px 0;-webkit-tap-highlight-color:transparent}
.blog-reader-edit-btn{font-size:14px;font-weight:600;color:var(--accent);cursor:pointer;-webkit-tap-highlight-color:transparent}
.blog-reader-body{padding:0 0 env(safe-area-inset-bottom,24px)}
.blog-reader-cover{width:100%;max-height:240px;object-fit:cover;display:block}
.blog-reader-content{padding:20px 20px 40px}
.blog-reader-tag{display:inline-block;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:3px 8px;border-radius:20px;margin-bottom:12px}
.blog-reader-title{font-size:24px;font-weight:800;color:var(--text);line-height:1.25;margin-bottom:6px;letter-spacing:-.3px}
.blog-reader-meta{font-size:12px;color:var(--muted);margin-bottom:20px;padding-bottom:16px;border-bottom:0.5px solid var(--border)}
.blog-reader-text{font-size:16px;line-height:1.7;color:var(--text)}
.blog-reader-text p{margin-bottom:1.1em}
.blog-reader-text p:last-child{margin-bottom:0}

/* ── Blog editor overlay (admin, slide up) ── */
.blog-editor-overlay{position:fixed;inset:0;z-index:600;background:rgba(0,0,0,.55);display:none;align-items:flex-end}
.blog-editor-overlay.open{display:flex}
.blog-editor-inner{background:var(--bg);border-radius:20px 20px 0 0;width:100%;max-height:92vh;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-bottom:env(safe-area-inset-bottom,24px)}
.blog-editor-topbar{display:flex;align-items:center;justify-content:space-between;padding:16px 16px 10px;border-bottom:0.5px solid var(--border)}
.blog-editor-cancel{background:none;border:none;font-size:15px;color:var(--muted);cursor:pointer;padding:4px 0;-webkit-tap-highlight-color:transparent}
.blog-editor-title{font-size:16px;font-weight:700;color:var(--text)}
.blog-editor-save{background:none;border:none;font-size:15px;font-weight:700;color:var(--accent);cursor:pointer;padding:4px 0;-webkit-tap-highlight-color:transparent}
.blog-editor-form{padding:16px}
.blog-editor-field{margin-bottom:16px}
.blog-editor-lbl{display:block;font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;margin-bottom:6px}
.blog-editor-inp{width:100%;background:var(--surface);border:0.5px solid var(--border);border-radius:10px;padding:11px 13px;font-size:15px;color:var(--text);-webkit-appearance:none;appearance:none;outline:none;box-sizing:border-box}
.blog-editor-inp:focus{border-color:var(--accent)}
.blog-editor-textarea{width:100%;background:var(--surface);border:0.5px solid var(--border);border-radius:10px;padding:11px 13px;font-size:15px;color:var(--text);-webkit-appearance:none;appearance:none;outline:none;box-sizing:border-box;min-height:240px;resize:none;line-height:1.6;font-family:inherit}
.blog-editor-textarea:focus{border-color:var(--accent)}
.blog-editor-pub-row{display:flex;align-items:center;justify-content:space-between;flex-direction:row}
.blog-editor-pub-row .blog-editor-lbl{margin-bottom:0}
/* Published toggle */
.blog-pub-switch{position:relative;display:inline-block;width:44px;height:26px;flex-shrink:0}
.blog-pub-switch input{opacity:0;width:0;height:0}
.blog-pub-track{position:absolute;cursor:pointer;inset:0;background:var(--border-md);border-radius:13px;transition:.2s}
.blog-pub-track::before{content:'';position:absolute;height:20px;width:20px;left:3px;bottom:3px;background:#fff;border-radius:50%;transition:.2s}
.blog-pub-switch input:checked + .blog-pub-track{background:var(--accent)}
.blog-pub-switch input:checked + .blog-pub-track::before{transform:translateX(18px)}
.blog-editor-delete{width:100%;margin-top:8px;padding:12px;border:none;border-radius:10px;background:rgba(255,59,48,.12);color:#ff3b30;font-size:15px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent}