:root{color-scheme:light;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}html{scroll-padding-top:env(safe-area-inset-top,0px)}body{margin:0;padding:0;font:14px -apple-system,BlinkMacSystemFont,sans-serif;background:#fff;color:#000}img{max-width:100%}[hidden]:not([hidden=until-found i]){display:none!important}
@media(max-width:760px){#main:has(.x-hero)>section:has(.mac),#main:has(.x-hero)>#costs{display:none}}

/* Layout: Apple-style premium. Light #f5f5f7 ground, white content cards, floating glass chrome; black feature sections carry gradient headlines. */
:root{
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Text","Inter",system-ui,"Helvetica Neue",Arial,sans-serif;
  --font-head:-apple-system,BlinkMacSystemFont,"SF Pro Display","Inter",system-ui,"Helvetica Neue",Arial,sans-serif;
  --font-brand:var(--font-head);
  --bg:#F6F7F9; --surface:#FFFFFF; --surface-2:#F1F3F6; --surface-3:#E6E9EE; --soft-a:#F2F8FA; --soft-b:#EEF2FA;
  --fg:#1D1D1F; --fg-2:#56565E; --fg-3:#6B6B73; --line:rgba(0,0,0,.08); --line-2:rgba(0,0,0,.15);
  --brand:#0B4D4F; --tint:#1F7A91; --tint-press:#196A7F; --on-tint:#FFFFFF; --tint-soft:#E4F5FA;
  --info:#00708F; --info-soft:#E4F5FA;
  --cal-new:#00708F; --cal-todo:#1F7F96; --cal-doing:#7FA800; --cal-done:#9AA5AC;
  --slate:#000000; --slate-2:#000000; --slate-fg:#F5F5F7; --slate-fg-2:#A1A1A6; --slate-accent:#9FE3F2; --slate-card:#1D1D1F;
  --volt:#D4F27A; --volt-ink:#3E5208; --volt-soft:#F4FBE3; --volt-line:#A3C94A;
  --ok:#1C7444; --ok-soft:#E3F5EA; --warn:#9A5300; --warn-soft:#FFF1DF; --bad:#BF3418; --bad-soft:#FDE9E4;
  --violet:#4B5BD6; --violet-soft:#ECEEFD; --muted:#66666E; --muted-soft:#F0F0F3;
  --glass:rgba(255,255,255,.62); --glass-strong:rgba(255,255,255,.9); --glass-edge:rgba(255,255,255,.75);
  --scrim:rgba(0,0,0,.32);
  --logo-ink:#0B4D4F; --logo-glass:#CBEDEA; --logo-key:#0B4D4F;
  --glow-1:#A9E4F1; --glow-2:#C4F2E2; --glow-3:#CBD2F7; --glow-op:.5;
  --grad-sky:linear-gradient(90deg,#6FD3EA 0%,#7FA6F5 55%,#A98BF5 100%);
  --grad-fresh:linear-gradient(90deg,#5ED6E6 0%,#9FF0D4 45%,#C8FF3D 100%);
  --grad-ink:linear-gradient(90deg,#2A8AA2 0%,#4F8FCF 55%,#7E78D2 100%);
  --shadow:0 18px 50px rgba(0,0,0,.12); --shadow-sm:0 1px 2px rgba(0,0,0,.04),0 4px 14px rgba(0,0,0,.04);
  --r-lg:22px; --r-md:14px; --r-sm:10px;
  --ease:cubic-bezier(.28,.11,.32,1);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#000000; --surface:#1C1C1E; --surface-2:#2C2C2E; --surface-3:#3A3A3C;
  --fg:#F5F5F7; --fg-2:#AEAEB2; --fg-3:#8E8E93; --line:rgba(255,255,255,.09); --line-2:rgba(255,255,255,.17);
  --brand:#7DD3D1; --tint:#4FC3E0; --tint-press:#6FD3EA; --on-tint:#00222B; --tint-soft:rgba(79,195,224,.16);
  --info:#6FD3EA; --info-soft:rgba(111,211,234,.15);
  --cal-new:#56C7DA; --cal-todo:#6FD3EA; --cal-doing:#C8FF3D; --cal-done:#7B868E;
  --slate-card:#1C1C1E;
  --volt:#C8FF3D; --volt-ink:#C8FF3D; --volt-soft:rgba(200,255,61,.13); --volt-line:#C8FF3D;
  --ok:#5BD08F; --ok-soft:rgba(91,208,143,.15); --warn:#F0B35A; --warn-soft:rgba(240,179,90,.15); --bad:#FF7A5E; --bad-soft:rgba(255,122,94,.15);
  --violet:#A6AEF8; --violet-soft:rgba(166,174,248,.15); --muted:#A1A1A6; --muted-soft:rgba(255,255,255,.08);
  --glass:rgba(28,28,30,.62); --glass-strong:rgba(28,28,30,.92); --glass-edge:rgba(255,255,255,.08);
  --scrim:rgba(0,0,0,.55);
  --logo-ink:#F5F5F7; --logo-glass:#2E7A80; --logo-key:#0A0D0E;
  --glow-op:.14; --soft-a:#0B1114; --soft-b:#0D0F16;
  --grad-ink:linear-gradient(90deg,#6FD3EA 0%,#7FA6F5 55%,#A98BF5 100%);
  --shadow:0 18px 50px rgba(0,0,0,.5); --shadow-sm:0 0 0 .5px rgba(255,255,255,.06);
  color-scheme:dark;
}}
:root[data-theme="dark"]{
  --bg:#000000; --surface:#1C1C1E; --surface-2:#2C2C2E; --surface-3:#3A3A3C;
  --fg:#F5F5F7; --fg-2:#AEAEB2; --fg-3:#8E8E93; --line:rgba(255,255,255,.09); --line-2:rgba(255,255,255,.17);
  --brand:#7DD3D1; --tint:#4FC3E0; --tint-press:#6FD3EA; --on-tint:#00222B; --tint-soft:rgba(79,195,224,.16);
  --info:#6FD3EA; --info-soft:rgba(111,211,234,.15);
  --cal-new:#56C7DA; --cal-todo:#6FD3EA; --cal-doing:#C8FF3D; --cal-done:#7B868E;
  --slate-card:#1C1C1E;
  --volt:#C8FF3D; --volt-ink:#C8FF3D; --volt-soft:rgba(200,255,61,.13); --volt-line:#C8FF3D;
  --ok:#5BD08F; --ok-soft:rgba(91,208,143,.15); --warn:#F0B35A; --warn-soft:rgba(240,179,90,.15); --bad:#FF7A5E; --bad-soft:rgba(255,122,94,.15);
  --violet:#A6AEF8; --violet-soft:rgba(166,174,248,.15); --muted:#A1A1A6; --muted-soft:rgba(255,255,255,.08);
  --glass:rgba(28,28,30,.62); --glass-strong:rgba(28,28,30,.92); --glass-edge:rgba(255,255,255,.08);
  --scrim:rgba(0,0,0,.55);
  --logo-ink:#F5F5F7; --logo-glass:#2E7A80; --logo-key:#0A0D0E;
  --glow-op:.14; --soft-a:#0B1114; --soft-b:#0D0F16;
  --grad-ink:linear-gradient(90deg,#6FD3EA 0%,#7FA6F5 55%,#A98BF5 100%);
  --shadow:0 18px 50px rgba(0,0,0,.5); --shadow-sm:0 0 0 .5px rgba(255,255,255,.06);
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{height:100%}
body{background:var(--bg);color:var(--fg);font-family:var(--font);font-size:15px;line-height:1.45;-webkit-font-smoothing:antialiased}
a{color:var(--tint);text-decoration:none}
a:hover{text-decoration:underline}
button{font:inherit;color:inherit}
:focus-visible{outline:3px solid color-mix(in srgb,var(--tint) 55%,transparent);outline-offset:2px;border-radius:8px}
h1,h2,h3{text-wrap:balance;margin:0}
p{margin:0}
.num,td,.kpi b{font-variant-numeric:tabular-nums}
td.num{white-space:nowrap}
.logo-wrap{display:inline-flex;color:var(--logo-ink)}
.logo-wrap svg{display:block;height:100%;width:auto}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.ic{flex:0 0 auto}

/* glass chrome */
.glass{background:var(--glass);-webkit-backdrop-filter:blur(26px) saturate(170%);backdrop-filter:blur(26px) saturate(170%);box-shadow:inset 0 1px 0 var(--glass-edge),inset 0 0 0 .5px var(--line),var(--shadow-sm)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:0 20px;border-radius:999px;border:0;font-size:15px;font-weight:600;cursor:pointer;text-decoration:none;white-space:nowrap;transition:transform .2s var(--ease),opacity .2s var(--ease),background .2s var(--ease)}
.btn:hover{text-decoration:none}
.btn:active{transform:scale(.97);opacity:.85}
.btn-primary{background:var(--tint);color:var(--on-tint)}
.btn-primary:hover{background:var(--tint-press)}
.btn-gray{background:var(--surface-2);color:var(--tint)}
.btn-gray:hover{background:var(--surface-3)}
.btn-plain{background:transparent;color:var(--tint);padding:0 10px}
.btn-danger{background:var(--bad-soft);color:var(--bad)}
.btn-sm{min-height:36px;padding:0 14px;font-size:14px}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.icon-btn{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:999px;border:0;background:transparent;cursor:pointer;color:var(--fg-2)}
.icon-btn:hover{background:var(--surface-2)}

/* fields */
.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 16px}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field.wide,.form .wide{grid-column:1/-1}
.lbl{font-size:13px;font-weight:600;color:var(--fg-2)}
.hint{font-size:12.5px;color:var(--fg-3)}
.hint.bad{color:var(--bad)} .hint.ok{color:var(--ok)}
input,select,textarea{font:inherit;color:var(--fg);background:var(--surface-2);border:1px solid transparent;border-radius:12px;min-height:44px;padding:10px 12px;width:100%;transition:border .2s var(--ease),background .2s var(--ease)}
textarea{min-height:88px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--tint);background:var(--surface)}
input[type=checkbox]{width:20px;height:20px;min-height:0;accent-color:var(--tint)}
.check{display:flex;align-items:center;gap:10px;font-weight:500}
.inline{display:flex;gap:8px;align-items:stretch}
.inline>input{flex:1;min-width:0}
.seg{display:inline-flex;flex-wrap:wrap;gap:2px;padding:3px;border-radius:12px;background:var(--surface-2)}
.seg button{border:0;background:transparent;border-radius:9px;min-height:34px;padding:0 13px;font-size:13.5px;font-weight:600;color:var(--fg-2);cursor:pointer}
.seg button[aria-pressed="true"]{background:var(--surface);color:var(--fg);box-shadow:var(--shadow-sm)}

/* chips */
.chip{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;padding:3px 10px;border-radius:999px;white-space:nowrap;line-height:1.5}
.tone-info{background:var(--info-soft);color:var(--info)}
.tone-violet{background:var(--violet-soft);color:var(--violet)}
.tone-volt{background:var(--volt-soft);color:var(--volt-ink);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--volt) 70%,transparent)}
.tone-warn{background:var(--warn-soft);color:var(--warn)}
.tone-ok{background:var(--ok-soft);color:var(--ok)}
.tone-bad{background:var(--bad-soft);color:var(--bad)}
.tone-muted{background:var(--muted-soft);color:var(--muted)}
.dot{width:7px;height:7px;border-radius:50%;background:currentColor}

/* ---------- public site ---------- */
.site-nav-wrap{position:fixed;top:calc(env(safe-area-inset-top,0px) + 12px);left:0;right:0;z-index:30;padding:0 16px;pointer-events:none}
.site-nav{pointer-events:auto;max-width:1100px;margin:0 auto;border-radius:999px;display:flex;align-items:center;gap:12px;padding:8px 8px 8px 20px;min-height:60px}
.site-nav .brand{display:flex;align-items:center;height:40px}
.site-nav .logo-wrap{height:40px}
.site-links{display:flex;gap:4px;margin-left:auto;align-items:center}
.site-links a{color:var(--fg);opacity:.82;font-size:14px;padding:8px 12px;border-radius:999px}
.site-links a:hover{opacity:1;text-decoration:none;background:var(--surface-2)}
.site-links a.on{opacity:1;font-weight:600}
.menu-btn{display:none}
.site main{min-height:60vh}
.wrap{max-width:1100px;margin:0 auto;padding-inline:20px}
.hero{position:relative;min-height:760px;display:flex;align-items:flex-end;overflow:hidden;background:#dfe7ea}
.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:68% 35%}
.hero .wrap{position:relative;width:100%;padding-block:150px 64px}
.hero-card{max-width:580px;border-radius:32px;padding:36px 38px 32px;display:flex;flex-direction:column;gap:16px}
.hero-card .logo-wrap{height:86px}
.eyebrow{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--brand)}
.brand-sub{font-family:var(--font-brand);font-weight:500;letter-spacing:.18em;font-size:12px;color:var(--fg-2)}
h1.display{font-size:clamp(44px,6.4vw,84px);font-weight:700;letter-spacing:-.028em;line-height:1.02}
.lead{font-size:clamp(17px,1.6vw,20px);line-height:1.45;color:var(--fg-2);max-width:56ch}
.actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.section{padding-block:110px}
.section.alt{background:var(--surface)}
.section.dark{background:radial-gradient(900px 520px at 85% 0%,rgba(223,231,234,.10),transparent 60%),linear-gradient(165deg,var(--slate) 0%,var(--slate-2) 100%);color:var(--slate-fg)}
.section.dark .lead{color:var(--slate-fg-2)}
.section.dark .eyebrow{color:var(--slate-accent)}
.btn-light{background:#F5F8F9;color:#0B4D4F}
.btn-light:hover{background:#FFFFFF}
.sec-head{display:flex;flex-direction:column;gap:14px;max-width:760px;margin-bottom:48px}
h2.big{font-size:clamp(34px,4.6vw,58px);font-weight:700;letter-spacing:-.022em;line-height:1.05}
.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.tile{background:var(--surface);border-radius:var(--r-lg);padding:22px;display:flex;flex-direction:column;gap:10px;min-height:150px;box-shadow:var(--shadow-sm)}
.section.alt .tile{background:var(--bg)}
.tile .ic{color:var(--brand)}
.tile h3{font-size:18px;letter-spacing:-.01em}
.tile p{color:var(--fg-2);font-size:14px}
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;counter-reset:step}
.step{padding:22px;border-radius:var(--r-lg);background:var(--surface);display:flex;flex-direction:column;gap:8px;box-shadow:var(--shadow-sm)}
.step .n{font-family:var(--font-brand);font-weight:600;font-size:15px;color:var(--brand)}
.step h3{font-size:19px}
.step p{color:var(--fg-2);font-size:14px}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:center}
.photo-card{position:relative;border-radius:28px;overflow:hidden;min-height:420px;background:var(--slate)}
.photo-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.photo-card .cap{position:absolute;left:0;right:0;bottom:0;padding:28px;background:linear-gradient(0deg,rgba(17,26,31,.84),rgba(17,26,31,0));color:var(--slate-fg);font-size:clamp(22px,2.6vw,30px);font-weight:700;letter-spacing:-.015em;line-height:1.15}
.mock{border-radius:24px;background:rgba(255,255,255,.06);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.10);padding:18px;display:flex;flex-direction:column;gap:10px;box-shadow:0 30px 80px rgba(0,0,0,.35)}
.mock-row{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.06);color:var(--slate-fg);font-size:14px}
.mock-row .ic{color:var(--slate-accent)}
.mock-row small{display:block;color:var(--slate-fg-2);font-size:12.5px}
.mock .chip{background:rgba(255,255,255,.10);color:var(--slate-fg)}
.mock .chip.mk-doing{background:rgba(200,255,61,.16);color:#D9F78A}
.mock .chip.mk-done{background:rgba(255,255,255,.10);color:#DCE6EA}
.mock .chip.mk-todo{background:rgba(169,201,209,.16);color:#BFD9DF}
.mock .chip.mk-warn{background:rgba(242,196,109,.16);color:#F2C46D}
.mock-row .chip{margin-left:auto}
.seg-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.seg-card{border-radius:var(--r-lg);padding:24px;background:var(--surface);display:flex;flex-direction:column;gap:8px;box-shadow:var(--shadow-sm)}
.seg-card h3{font-size:20px}
.seg-card p{color:var(--fg-2)}
.seg-card ul{margin:6px 0 0;padding-left:18px;color:var(--fg-2);font-size:14px;display:flex;flex-direction:column;gap:4px}
.cta{border-radius:32px;padding:56px clamp(24px,5vw,64px);background:linear-gradient(90deg,rgba(246,249,250,.94) 0%,rgba(246,249,250,.80) 42%,rgba(246,249,250,.10) 100%),url(hero.jpg) 70% 38%/cover,#DFE7EA;color:#0E1A1F;box-shadow:var(--shadow-sm);display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between}
.cta h2{font-size:clamp(28px,3.6vw,44px);letter-spacing:-.02em}
.cta{flex-direction:column;align-items:flex-start}
.cta h2{max-width:20ch}
.cta .btn-primary{background:#0B4D4F;color:#fff}
.cta .btn-primary:hover{background:#083B3D}
.page-hero{padding-block:150px 40px}
.panel-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:24px;align-items:start}
.card{background:var(--surface);border-radius:var(--r-lg);padding:24px;box-shadow:var(--shadow-sm);min-width:0}
.card h2{font-size:20px;letter-spacing:-.01em}
.card-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.kv{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 18px;font-size:14px}
.kv dt{color:var(--fg-3)} .kv dd{margin:0;min-width:0;overflow-wrap:anywhere}
.site-foot{padding-block:56px 40px;border-top:1px solid var(--line);background:var(--surface)}
.foot-grid{display:flex;flex-wrap:wrap;gap:32px;justify-content:space-between;align-items:flex-start}
.foot-grid .logo-wrap{height:64px}
.foot-links{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:14px}
.foot-links a{color:var(--fg-2)}
.foot-meta{font-size:13px;color:var(--fg-3);margin-top:24px}
.success{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.success .big-no{font-family:var(--font-brand);font-size:40px;font-weight:600;color:var(--brand)}
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:140px 16px 60px}
.login-card{width:min(440px,100%);border-radius:28px;padding:32px;display:flex;flex-direction:column;gap:18px;background:var(--surface);box-shadow:var(--shadow)}
.login-card .logo-wrap{height:64px;align-self:flex-start}
.demo-box{border-radius:14px;background:var(--surface-2);padding:14px;font-size:13.5px;color:var(--fg-2);display:flex;flex-direction:column;gap:8px}
.demo-box button{border:0;background:none;color:var(--tint);padding:0;cursor:pointer;text-align:left;font-weight:600}

/* ---------- app shell ---------- */
.app{display:flex;min-height:100%;background:var(--bg)}
.sidebar{position:sticky;top:12px;margin:12px 0 12px 12px;align-self:flex-start;width:244px;flex:0 0 244px;height:calc(100vh - 24px);border-radius:24px;padding:18px 12px;display:flex;flex-direction:column;gap:14px;z-index:20}
.side-head{display:flex;align-items:center;justify-content:space-between;padding:4px 10px 6px}
.side-head .logo-wrap{height:46px}
.admin-pill{font-size:11px;font-weight:700;background:var(--volt);color:#1A2400;padding:3px 8px;border-radius:999px}
.side-search{display:flex;align-items:center;gap:10px;min-height:40px;border:0;border-radius:12px;background:var(--surface-2);color:var(--fg-3);padding:0 12px;cursor:pointer;font-size:14px}
.side-search span{flex:1;text-align:left}
kbd{font-family:var(--font);font-size:11.5px;color:var(--fg-3);background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:1px 6px}
.side-nav{display:flex;flex-direction:column;gap:2px;overflow:auto}
.side-nav a{display:flex;align-items:center;gap:11px;min-height:40px;padding:0 12px;border-radius:11px;color:var(--fg);font-size:14.5px;text-decoration:none}
.side-nav a .ic{color:var(--fg-2)}
.side-nav a:hover{background:var(--surface-2)}
.side-nav a.on{background:var(--surface-3);font-weight:600}
.side-nav a.on .ic{color:var(--tint)}
.count{margin-left:auto;font-size:12px;font-weight:600;color:var(--fg-3);font-variant-numeric:tabular-nums}
.side-foot{margin-top:auto;border-top:1px solid var(--line);padding:14px 6px 0;display:flex;flex-direction:column;gap:10px}
.who{display:flex;align-items:center;gap:10px;min-width:0}
.who strong{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.who small{display:block;color:var(--fg-3);font-size:12.5px}
.avatar{flex:0 0 34px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:700;color:#0B4D4F;background:linear-gradient(135deg,#E3ECEF,#C8D9DF)}
.topbar{display:none}
.main{flex:1;min-width:0;padding:28px clamp(16px,3vw,40px) 60px}
.banner{background:var(--warn-soft);color:var(--warn);border-radius:12px;padding:10px 14px;font-size:13.5px;margin-bottom:18px}
.page-head{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-end;justify-content:space-between;margin-bottom:22px}
.page-head h1{font-size:32px;letter-spacing:-.02em;line-height:1.1}
.page-head p{color:var(--fg-2);margin-top:4px}
.crumb{display:inline-flex;align-items:center;gap:4px;font-size:14px;margin-bottom:6px}
.toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:14px}
.search-in{position:relative;flex:1 1 260px;max-width:420px}
.search-in .ic{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--fg-3)}
.search-in input{padding-left:38px;background:var(--surface)}
.toolbar select{width:auto;background:var(--surface)}
.table-wrap{background:var(--surface);border-radius:var(--r-lg);overflow-x:auto;box-shadow:var(--shadow-sm)}
table{width:100%;border-collapse:collapse;font-size:14px;min-width:760px}
th{text-align:left;font-weight:600;color:var(--fg-3);font-size:12.5px;padding:0;border-bottom:1px solid var(--line);white-space:nowrap}
th .th{border:0;background:none;padding:12px 14px;font:inherit;font-weight:600;color:inherit;cursor:pointer;display:flex;gap:4px;align-items:center;width:100%}
th .th:hover{color:var(--fg)}
th .sort{color:var(--tint);width:10px}
td{padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:middle}
tbody tr{cursor:pointer;transition:background .15s var(--ease)}
tbody tr:hover{background:var(--surface-2)}
tbody tr:last-child td{border-bottom:0}
td .sub{display:block;color:var(--fg-3);font-size:12.5px}
td.strong{font-weight:600}
.empty{padding:40px 24px;text-align:center;color:var(--fg-2);display:flex;flex-direction:column;gap:12px;align-items:center}
.kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-bottom:20px}
.kpi{background:var(--surface);border-radius:var(--r-lg);padding:18px;border:0;text-align:left;cursor:pointer;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:6px;transition:transform .2s var(--ease)}
.kpi:hover{transform:translateY(-1px)}
.kpi span{font-size:13px;font-weight:600;color:var(--fg-2);display:flex;gap:6px;align-items:center}
.kpi b{font-size:34px;letter-spacing:-.02em;line-height:1}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.list{display:flex;flex-direction:column}
.li{display:flex;align-items:center;gap:12px;padding:12px 2px;border-bottom:1px solid var(--line);cursor:pointer;min-width:0;background:none;border-left:0;border-right:0;border-top:0;width:100%;text-align:left}
.li:last-child{border-bottom:0}
.li:hover .li-main strong{color:var(--tint)}
.li-main{flex:1;min-width:0}
.li-main strong{display:block;font-size:14.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.li-main small{display:block;color:var(--fg-3);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.li-time{font-size:13px;color:var(--fg-2);white-space:nowrap;font-variant-numeric:tabular-nums}
.timeline{display:flex;flex-direction:column;gap:0}
.tl{display:grid;grid-template-columns:14px minmax(0,1fr);gap:12px;padding-bottom:16px;position:relative}
.tl:before{content:"";position:absolute;left:6px;top:14px;bottom:0;width:2px;background:var(--line)}
.tl:last-child:before{display:none}
.tl i{width:14px;height:14px;border-radius:50%;background:var(--surface);border:3px solid var(--tint);margin-top:3px}
.tl small{color:var(--fg-3);display:block;font-size:12.5px}
.detail-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);gap:16px;margin-bottom:16px}
.meter{height:8px;border-radius:99px;background:var(--surface-2);overflow:hidden}
.meter i{display:block;height:100%;background:var(--ok);border-radius:99px}
.meter.warn i{background:var(--warn)} .meter.muted i{background:var(--fg-3)}
.stepper{display:flex;align-items:center;margin-top:16px}
.stepper .s{width:12px;height:12px;border-radius:50%;background:var(--fg);flex:0 0 auto}
.stepper .s.cur{width:18px;height:18px;background:var(--volt);box-shadow:0 0 0 5px var(--volt-soft)}
.stepper .s.off{background:transparent;border:2px solid var(--line-2)}
.stepper .l{flex:1;height:2px;background:var(--fg)}
.stepper .l.off{background:var(--line-2)}
.step-labels{display:flex;justify-content:space-between;font-size:12px;color:var(--fg-3);margin-top:8px}
.step-labels .on{color:var(--fg);font-weight:600}
.agenda-day{margin-bottom:18px}
.agenda-day h3{font-size:14px;color:var(--fg-2);margin-bottom:8px;font-weight:600}
.tech-dot{width:9px;height:9px;border-radius:50%;flex:0 0 auto}
.tags{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.tag-x{display:inline-flex;align-items:center;gap:6px;background:var(--surface-2);border-radius:999px;padding:5px 6px 5px 12px;font-size:14px}
.tag-x button{border:0;background:var(--surface-3);width:22px;height:22px;border-radius:50%;cursor:pointer;display:grid;place-items:center}
.parts{display:flex;flex-direction:column;gap:8px}
.part{display:grid;grid-template-columns:minmax(0,1fr) 80px 40px;gap:8px}

/* overlays */
.overlay{position:fixed;inset:0;z-index:60;background:var(--scrim);display:flex;align-items:flex-start;justify-content:center;padding:calc(env(safe-area-inset-top,0px) + 8vh) 16px 16px;animation:fade .2s var(--ease)}
.overlay.right{justify-content:flex-end;align-items:stretch;padding:12px}
.palette{width:min(640px,100%);border-radius:22px;overflow:hidden;background:var(--glass-strong);-webkit-backdrop-filter:blur(30px) saturate(170%);backdrop-filter:blur(30px) saturate(170%);box-shadow:var(--shadow),inset 0 0 0 .5px var(--line)}
.pal-input{display:flex;align-items:center;gap:10px;padding:8px 14px;border-bottom:1px solid var(--line);color:var(--fg-3)}
.pal-input input{background:transparent;border:0;font-size:18px;min-height:52px;padding:0}
.pal-input input:focus{background:transparent}
.pal-list{max-height:min(460px,60vh);overflow:auto;padding:8px}
.pal-group{font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--fg-3);padding:10px 10px 4px}
.pal-item{display:flex;align-items:center;gap:12px;width:100%;border:0;background:transparent;text-align:left;padding:9px 10px;border-radius:12px;cursor:pointer;color:var(--fg)}
.pal-item .ic{color:var(--fg-2)}
.pal-item.on{background:var(--tint);color:var(--on-tint)}
.pal-item.on .ic,.pal-item.on small,.pal-item.on .pal-hint{color:var(--on-tint)}
.pal-main{flex:1;min-width:0;font-size:14.5px;font-weight:500}
.pal-main small{display:block;color:var(--fg-3);font-size:12.5px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pal-hint{font-size:12px;color:var(--fg-3)}
.pal-empty{padding:28px;text-align:center;color:var(--fg-2)}
.sheet{width:min(680px,100%);max-height:calc(100vh - 10vh - 16px);display:flex;flex-direction:column;border-radius:24px;background:var(--surface);box-shadow:var(--shadow);overflow:hidden;animation:rise .3s var(--ease)}
.drawer{width:min(600px,100%);height:100%;display:flex;flex-direction:column;border-radius:24px;background:var(--surface);box-shadow:var(--shadow);overflow:hidden;animation:slide .3s var(--ease)}
.sheet-head{display:flex;align-items:center;gap:10px;padding:16px 18px 12px 22px;border-bottom:1px solid var(--line)}
.sheet-head h2{flex:1;font-size:19px;letter-spacing:-.01em;min-width:0}
.sheet-body{padding:20px 22px;overflow:auto;display:flex;flex-direction:column;gap:18px}
.sheet-foot{display:flex;gap:10px;justify-content:flex-end;align-items:center;padding:12px 18px 16px;border-top:1px solid var(--line);flex-wrap:wrap}
.sheet-foot .spacer{flex:1}
.section-title{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--fg-3)}
.picked{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:var(--tint-soft)}
.picked strong{flex:1}
.pick-list{display:flex;flex-direction:column;border-radius:12px;background:var(--surface-2);overflow:hidden;max-height:220px;overflow-y:auto}
.pick-list button{border:0;background:transparent;text-align:left;padding:10px 12px;cursor:pointer;border-bottom:1px solid var(--line)}
.pick-list button:hover{background:var(--surface-3)}
.pick-list small{display:block;color:var(--fg-3)}
.reg-result{border-radius:12px;padding:12px 14px;font-size:14px;display:flex;flex-direction:column;gap:4px}
.confirm{width:min(420px,100%);border-radius:22px;background:var(--surface);box-shadow:var(--shadow);padding:22px;display:flex;flex-direction:column;gap:16px;animation:rise .25s var(--ease)}
.toasts{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(env(safe-area-inset-bottom,0px) + 20px);z-index:80;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}
.toast{background:var(--glass-strong);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:var(--shadow),inset 0 0 0 .5px var(--line);border-radius:999px;padding:10px 18px;font-size:14px;font-weight:600;display:flex;gap:8px;align-items:center;animation:rise .25s var(--ease)}
.toast.bad{color:var(--bad)}
.scrim{position:fixed;inset:0;background:var(--scrim);z-index:15}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes rise{from{transform:translateY(12px);opacity:0}to{transform:none;opacity:1}}
@keyframes slide{from{transform:translateX(30px);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* calendar */
.cal-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px;align-items:start}
.cal-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:12px}
.cal-title{display:flex;align-items:center;gap:2px;margin-right:auto;min-width:0}
.cal-title h2{font-size:22px;letter-spacing:-.015em;margin-left:6px;white-space:nowrap}
.cal-bar select{width:auto;background:var(--surface)}
.legend{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.lg{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 14px;border-radius:999px;border:0;background:var(--surface);box-shadow:var(--shadow-sm);font-size:13.5px;font-weight:600;color:var(--fg);cursor:pointer}
.lg[aria-pressed="false"]{background:transparent;box-shadow:inset 0 0 0 1px var(--line-2);color:var(--fg-3)}
.lg[aria-pressed="false"] .sw{background:transparent;box-shadow:inset 0 0 0 2px var(--ev)}
.lg b{font-weight:600;color:var(--fg-3);font-variant-numeric:tabular-nums}
.sw{width:10px;height:10px;border-radius:3px;flex:0 0 auto;background:var(--ev)}
.g-reported{--ev:var(--cal-new);--ev-soft:color-mix(in srgb,var(--cal-new) 13%,var(--surface))}
.g-todo{--ev:var(--cal-todo);--ev-soft:color-mix(in srgb,var(--cal-todo) 13%,var(--surface))}
.g-doing{--ev:var(--cal-doing);--ev-soft:color-mix(in srgb,var(--cal-doing) 15%,var(--surface))}
.g-done{--ev:var(--cal-done);--ev-soft:var(--surface-2)}
.ev.g-done .n,.blk.g-done strong{color:var(--fg-2)}
.month{background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);overflow:hidden}
.mhead,.mgrid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.mhead{border-bottom:1px solid var(--line)}
.mhead span{padding:10px 10px 8px;font-size:11.5px;font-weight:700;color:var(--fg-3);text-transform:uppercase;letter-spacing:.06em}
.mcell{position:relative;min-height:122px;min-width:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:6px;display:flex;flex-direction:column;gap:3px;cursor:pointer;transition:background .15s var(--ease)}
.mcell:nth-child(7n){border-right:0}
.mcell.out{background:color-mix(in srgb,var(--surface-2) 50%,var(--surface))}
.mcell.out .dn{color:var(--fg-3)}
.mcell.sel{box-shadow:inset 0 0 0 2px var(--tint)}
.mcell.drop{background:var(--tint-soft)}
.dn{display:inline-grid;place-items:center;min-width:26px;height:26px;padding:0 6px;border-radius:999px;font-size:13px;font-weight:600;align-self:flex-start;font-variant-numeric:tabular-nums}
.mcell.today .dn{background:var(--tint);color:var(--on-tint)}
.add-day{position:absolute;top:6px;right:6px;width:28px;height:28px;border-radius:50%;border:0;background:var(--surface-2);color:var(--tint);display:grid;place-items:center;cursor:pointer;opacity:0;transition:opacity .15s var(--ease)}
.mcell:hover .add-day,.mcell.sel .add-day,.add-day:focus-visible{opacity:1}
.ev{display:flex;align-items:center;gap:5px;width:100%;min-width:0;border:0;text-align:left;font-size:12px;line-height:1.25;padding:3px 6px 3px 8px;border-radius:7px;background:var(--ev-soft);color:var(--fg);cursor:pointer;box-shadow:inset 3px 0 0 var(--ev)}
.ev[draggable="true"],.blk[draggable="true"],.drag-li{cursor:grab}
.ev .t{color:var(--fg-2);font-variant-numeric:tabular-nums;flex:0 0 auto}
.ev .n{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.u{color:var(--bad);font-weight:800;flex:0 0 auto}
.more{border:0;background:none;text-align:left;font-size:12px;font-weight:600;color:var(--fg-2);padding:1px 6px;cursor:pointer}
.mdots{display:none;flex-wrap:wrap;gap:3px;padding:0 4px}
.mdots i{width:6px;height:6px;border-radius:50%;background:var(--ev)}
.tg-wrap{background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);overflow-x:auto}
.tg{display:grid;grid-template-columns:54px repeat(var(--cols),minmax(92px,1fr));min-width:calc(54px + var(--cols) * 92px)}
.tg-corner{border-bottom:1px solid var(--line)}
.tg-dh{display:flex;align-items:baseline;gap:6px;border:0;border-left:1px solid var(--line);border-bottom:1px solid var(--line);background:none;padding:10px 10px 8px;font-size:12.5px;font-weight:600;color:var(--fg-2);cursor:pointer;text-align:left}
.tg-dh b{font-size:20px;color:var(--fg);font-weight:600;font-variant-numeric:tabular-nums}
.tg-dh.today b{color:var(--tint)}
.tg-dh[aria-pressed="true"]{background:var(--tint-soft)}
.tg-dh:hover{background:var(--surface-2)}
.tg-gut{position:relative}
.tg-gut span{position:absolute;right:8px;transform:translateY(-50%);font-size:11px;color:var(--fg-3);font-variant-numeric:tabular-nums}
.tg-col{position:relative;border-left:1px solid var(--line);background-image:repeating-linear-gradient(to bottom,var(--line) 0 1px,transparent 1px var(--hh))}
.tg-col.today{background-color:color-mix(in srgb,var(--tint-soft) 40%,transparent)}
.tg-col.drop{background-color:var(--tint-soft)}
.blk{position:absolute;border:0;border-radius:8px;background:var(--ev-soft);box-shadow:inset 3px 0 0 var(--ev);padding:4px 6px 4px 9px;text-align:left;font-size:12px;line-height:1.3;overflow:hidden;cursor:pointer;color:var(--fg);display:flex;flex-direction:column}
.blk strong,.blk small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.blk strong{font-size:12px}
.blk small{color:var(--fg-2);font-size:11.5px}
.now-line{position:absolute;left:0;right:0;height:2px;background:var(--bad);z-index:2;pointer-events:none}
.now-line:before{content:"";position:absolute;left:-4px;top:-3px;width:8px;height:8px;border-radius:50%;background:var(--bad)}
.cal-side{display:flex;flex-direction:column;gap:16px;position:sticky;top:16px}
.cal-side .card{padding:18px}
.cal-side .card h2{font-size:17px}
/* time tracking */
.rec{width:9px;height:9px;border-radius:50%;background:var(--bad);flex:0 0 auto;animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{50%{opacity:.3}}
.btn-stop{background:var(--bad-soft);color:var(--bad)}
.btn-stop:hover{background:color-mix(in srgb,var(--bad-soft) 70%,var(--bad) 12%)}
.live{display:flex;align-items:center;gap:8px;padding:12px;border-radius:16px;background:var(--surface);box-shadow:var(--shadow-sm)}
.live-main{flex:1;min-width:0;border:0;background:none;text-align:left;padding:0;cursor:pointer;color:var(--fg)}
.live-main .clock{display:block;font-size:22px;font-weight:700;letter-spacing:-.01em;font-variant-numeric:tabular-nums;line-height:1.2}
.live-main small{display:block;font-size:12.5px;color:var(--fg-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.live-mini{display:inline-flex;align-items:center;gap:6px;border:0;border-radius:999px;background:var(--bad-soft);color:var(--bad);font-weight:700;font-size:13px;min-height:36px;padding:0 12px;cursor:pointer;font-variant-numeric:tabular-nums}
.time-box{background:var(--surface-2);border-radius:16px;padding:14px 16px;display:flex;flex-direction:column;gap:10px}
.time-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.time-total{display:block;font-size:28px;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1.15;margin-top:2px}
.entry{display:grid;grid-template-columns:minmax(0,1fr) auto 40px;gap:10px;align-items:center;padding:6px 0;border-top:1px solid var(--line);font-size:14px}
.entry small{display:block;color:var(--fg-3);font-size:12.5px}
.entry b{font-variant-numeric:tabular-nums;font-weight:600;white-space:nowrap}
.add-time{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.add-time input,.add-time select{background:var(--surface)}
/* hours */
.kpis.k4{grid-template-columns:repeat(4,minmax(0,1fr))}
.kpi.static{cursor:default}
.kpi.static:hover{transform:none}
.kpi small{font-size:12.5px;color:var(--fg-3);font-weight:500}
.bar-row{display:grid;grid-template-columns:minmax(0,150px) minmax(0,1fr) 64px 56px;gap:12px;align-items:center;width:100%;padding:8px 8px;border:0;border-radius:10px;background:none;text-align:left;cursor:pointer;font-size:14px;color:var(--fg)}
.bar-row:hover{background:var(--surface-2)}
.bar-row[aria-pressed="true"]{background:var(--tint-soft)}
.bar-row .lab{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:500}
.bar-row .fill{display:block;height:12px;border-radius:0 4px 4px 0;background:var(--tint);min-width:3px}
.bar-row .v{text-align:right;font-weight:600;font-variant-numeric:tabular-nums}
.bar-row .c{text-align:right;color:var(--fg-3);font-size:13px;font-variant-numeric:tabular-nums}
tr.grp td{background:var(--surface-2);cursor:default;padding-block:10px}
tr.grp:hover{background:none}
tr.on td{background:var(--tint-soft)}
th.chk,td.chk{width:48px;padding-left:16px;padding-right:0}
th.chk{padding-block:12px}
.action-bar{position:sticky;bottom:calc(env(safe-area-inset-bottom,0px) + 16px);z-index:30;margin-top:14px;display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:8px 8px 8px 20px;border-radius:999px}
.action-bar .sum{margin-right:auto;display:flex;flex-direction:column;line-height:1.25}
.action-bar .sum small{color:var(--fg-2);font-size:12.5px;font-variant-numeric:tabular-nums}
.action-bar input{width:190px;min-height:40px;background:var(--surface)}
.section-h{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:30px 0 12px}
.section-h h2{font-size:22px;letter-spacing:-.015em}
.section-h p{color:var(--fg-2);margin-top:4px;font-size:14px}

/* language & appearance */
.seg-sm{padding:2px;border-radius:10px}
.seg-sm button{min-height:30px;padding:0 10px;font-size:12.5px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;gap:5px}
.seg-fill{display:flex;width:100%;flex-wrap:nowrap}
.seg-fill button{flex:1;min-width:0;padding:0 6px}
.lang{position:relative;display:inline-flex}
.lang-btn{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 12px;border:0;border-radius:999px;background:var(--surface-2);color:var(--fg);font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}
.lang-btn:hover{background:var(--surface-3)}
.lang-btn .ic{color:var(--fg-2)}
.lang-name{display:none;font-weight:500}
.lang-menu{position:absolute;top:calc(100% + 6px);right:0;min-width:180px;z-index:70;display:flex;flex-direction:column;gap:2px;padding:6px;border-radius:16px;background:var(--glass-strong);-webkit-backdrop-filter:blur(26px) saturate(170%);backdrop-filter:blur(26px) saturate(170%);box-shadow:var(--shadow),inset 0 0 0 .5px var(--line);animation:rise .18s var(--ease)}
.lang.up .lang-menu{top:auto;bottom:calc(100% + 6px)}
.lang-menu button{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:42px;padding:0 12px;border:0;border-radius:11px;background:none;color:var(--fg);font-size:14.5px;text-align:left;cursor:pointer}
.lang-menu button:hover{background:var(--surface-2)}
.lang-menu button[aria-checked="true"]{font-weight:600}
.lang-menu .ic{color:var(--tint)}
.lang.full{display:flex;width:100%}
.lang.full .lang-btn{width:100%;justify-content:flex-start}
.lang.full .lang-name{display:inline}
.lang.full .lang-btn>span:not(.lang-name){display:none}
.lang.full .lang-btn>.ic:last-child{margin-left:auto}
.lang.full .lang-menu{left:0;right:0}
.nav-lang .lang-btn{background:color-mix(in srgb,var(--surface-2) 80%,transparent)}
.btn-volt{background:var(--volt);color:#1A2400}
.btn-volt:hover{background:#B9F22A}
.side-prefs{display:flex;flex-direction:column;gap:8px;padding:0 4px}
.side-prefs .lbl{font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--fg-3)}

/* footer, contact, legal, notices */
.section.alt .step{background:var(--bg)}
.site-foot{padding-block:64px 32px;border-top:1px solid var(--line);background:var(--surface)}
.foot-top{display:grid;grid-template-columns:minmax(0,1.6fr) repeat(3,minmax(0,1fr));gap:32px}
.foot-brand{display:flex;flex-direction:column;gap:12px;min-width:0}
.foot-brand .logo-wrap{height:64px}
.foot-tag{color:var(--fg-2);font-size:14px;max-width:34ch}
.foot-contact{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.foot-line{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--fg-2)}
.foot-col{display:flex;flex-direction:column;gap:10px;font-size:14px;min-width:0}
.foot-col h3{font-size:12px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--fg-3);margin-bottom:2px}
.foot-col a{color:var(--fg-2)}
.foot-col a:hover{color:var(--tint)}
.foot-bottom{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;justify-content:space-between;margin-top:40px;padding-top:20px;border-top:1px solid var(--line);font-size:13px;color:var(--fg-3)}
.copy-line{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:var(--fg);min-width:0;flex-wrap:wrap}
.copy-line .ic{color:var(--brand)}
.copy-line .v{user-select:all;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.copy-line.big{font-size:clamp(20px,2.4vw,26px);font-weight:600;letter-spacing:-.01em}
.copy-btn{border:0;background:var(--surface-2);color:var(--tint);border-radius:999px;font-size:12px;font-weight:600;padding:4px 10px;cursor:pointer;min-height:28px}
.copy-btn:hover{background:var(--surface-3)}
.contact-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:24px}
.contact-tile{background:var(--surface);border-radius:var(--r-lg);padding:20px 22px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:6px;min-width:0}
.contact-tile .lbl{font-size:12px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--fg-3)}
.contact-tile p{color:var(--fg-2);font-size:14px}
.privacy-note{display:flex;flex-direction:column;gap:6px;padding:14px 16px;border-radius:14px;background:var(--surface-2)}
.privacy-note .check{align-items:flex-start;font-weight:500;font-size:14px}
.privacy-note .check input{margin-top:1px;flex:0 0 auto}
.legal-grid{display:grid;grid-template-columns:240px minmax(0,1fr);gap:24px;align-items:start}
.legal-nav{position:sticky;top:96px;display:flex;flex-direction:column;gap:2px}
.legal-nav a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;color:var(--fg);font-size:14.5px}
.legal-nav a .ic{color:var(--fg-2)}
.legal-nav a:hover{background:var(--surface-2);text-decoration:none}
.legal-nav a.on{background:var(--surface);box-shadow:var(--shadow-sm);font-weight:600}
.legal-nav a.on .ic{color:var(--brand)}
.legal-body{padding:clamp(22px,3vw,40px);display:flex;flex-direction:column;gap:26px;max-width:820px}
.legal-body h2{font-size:19px;letter-spacing:-.01em;margin-bottom:8px}
.legal-body h2 .num{color:var(--brand);font-variant-numeric:tabular-nums}
.legal-body p,.legal-body li{color:var(--fg-2);line-height:1.6;max-width:68ch}
.legal-body p+p{margin-top:8px}
.legal-body ul{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:6px}
.legal .banner{margin-bottom:20px}
.notice p{font-size:13.5px;color:var(--fg-2);line-height:1.4}
.legal-links{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:13px}

/* client switching */
.client-switch{display:flex;align-items:center;gap:6px;margin-bottom:10px;flex-wrap:wrap}
.client-switch select{width:auto;max-width:100%;background:var(--surface);min-height:40px}
.preview-bar{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:8px 12px 0;padding:8px 8px 8px 16px;border-radius:999px;font-size:13.5px;font-weight:600}
.preview-bar select{width:auto;min-height:36px;background:var(--surface);flex:1 1 160px;max-width:280px}

.row-actions{display:flex;gap:6px;justify-content:flex-end;align-items:center;flex-wrap:nowrap}

.type-ic{display:inline-grid;place-items:center;color:var(--fg-3);vertical-align:-2px}
.appl-table .toolbar select{width:auto;background:var(--surface-2)}
.appl-table .search-in input{background:var(--surface-2)}
tr.detail-row{cursor:default}
tr.detail-row:hover{background:none}
tr.detail-row td{background:var(--surface-2)}
.detail-in{display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:20px;padding:6px 2px}
@media (max-width:600px){.detail-in{grid-template-columns:minmax(0,1fr)}}

.dup-q{display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:12px;background:var(--warn-soft)}
.dup-q .check{align-items:flex-start;font-weight:400}
.dup-q input[type=radio]{width:18px;height:18px;min-height:0;margin-top:2px;accent-color:var(--tint)}
.dup-list{margin:0;padding-left:18px;font-size:13px;color:var(--fg-2)}
input[type=file]{background:var(--surface-2);padding:10px}

/* responsive */
@media (max-width:1100px){.kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.kpis.k4{grid-template-columns:repeat(2,minmax(0,1fr))}.detail-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.cal-layout{grid-template-columns:minmax(0,1fr)}.cal-side{position:static;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){
  .site-links{display:none;position:absolute;top:70px;left:0;right:0;flex-direction:column;align-items:stretch;padding:10px;border-radius:22px;background:var(--glass-strong);-webkit-backdrop-filter:blur(26px);backdrop-filter:blur(26px);box-shadow:var(--shadow)}
  .site-links.open{display:flex}
  .site-links a{padding:12px 14px;font-size:16px}
  .site-nav{position:relative}
  .menu-btn{display:inline-grid;margin-left:auto}
  .nav-cta{display:none}
  .nav-lang{margin-left:auto}
  .tiles,.steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .seg-cards,.split,.panel-grid,.grid-2,.detail-grid,.legal-grid{grid-template-columns:minmax(0,1fr)}
  .foot-top{grid-template-columns:repeat(2,minmax(0,1fr))}
  .foot-brand{grid-column:1/-1}
  .contact-strip{grid-template-columns:minmax(0,1fr)}
  .legal-nav{position:static;flex-direction:row;flex-wrap:wrap}
  .sidebar{position:fixed;top:0;left:0;bottom:0;margin:8px;height:auto;transform:translateX(-110%);transition:transform .3s var(--ease)}
  .sidebar.open{transform:none}
  .topbar{display:flex;align-items:center;gap:8px;position:sticky;top:env(safe-area-inset-top,0px);z-index:10;margin:8px;border-radius:999px;padding:4px}
  .topbar .logo-wrap{height:22px;margin-right:auto}
  .app{flex-direction:column}
  .main{padding-top:12px}
}
@media (max-width:600px){
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .form{grid-template-columns:minmax(0,1fr)}
  .cal-side{grid-template-columns:minmax(0,1fr)}
  .mcell{min-height:58px;padding:4px 2px;align-items:center}
  .mcell .ev,.mcell .more,.add-day{display:none}
  .mdots{display:flex;justify-content:center}
  .dn{align-self:center}
  .mhead span{padding:8px 0;text-align:center}
  .cal-title h2{font-size:19px}
  .bar-row{grid-template-columns:minmax(0,110px) minmax(0,1fr) 56px;}
  .bar-row .c{display:none}
  .action-bar{border-radius:22px}
  .action-bar input{width:100%}
  .hide-sm{display:none}
  .notice{flex-direction:column;align-items:stretch}
  .tiles,.steps{grid-template-columns:minmax(0,1fr)}
  .hero{min-height:680px}
  .hero-card{padding:26px 22px;border-radius:26px}
  .hero-card .logo-wrap{height:64px}
  .section{padding-block:72px}
  .site-nav .logo-wrap{height:34px}
}

/* v12: brand type */
.bar-row.rep-row{grid-template-columns:minmax(0,130px) minmax(0,1fr) 96px 28px}
.bar-row.rep-row .v{white-space:nowrap}
@media (max-width:600px){.bar-row.rep-row{grid-template-columns:minmax(0,96px) minmax(0,1fr) 88px}}
/* v12b, quotes, monthly report, audit fixes */
.site{font-family:var(--font-head)}
h1,h2,h3,.display,.big{font-family:var(--font-head)}
.display,h1.display{letter-spacing:-.034em}
.tiles.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.notice{display:flex;align-items:center;gap:14px;padding:12px 12px 12px 18px;border-radius:20px;margin-block:20px}
.main>.notice{margin-top:0}
.quote-box{display:flex;flex-direction:column;gap:10px;padding:14px 16px;border-radius:var(--r-md);background:var(--surface-2)}
.quote-head{display:flex;gap:12px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap}
.quote-head>div{display:flex;flex-direction:column;gap:2px;min-width:0}
.quote-amt{font-size:22px;font-weight:600;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.card .quote-box{margin-top:12px}
.month-card{margin-bottom:14px}
.mini-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.mini-kpis div{display:flex;flex-direction:column;gap:4px;padding:12px 14px;border-radius:var(--r-md);background:var(--surface-2);min-width:0}
.mini-kpis span{font-size:12.5px;color:var(--fg-2)}
.mini-kpis b{font-size:20px;font-weight:600;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.more-fields{border-top:1px solid var(--line);padding-top:6px}
.more-fields summary{cursor:pointer;font-weight:600;color:var(--tint);min-height:44px;display:flex;align-items:center}
.more-fields>.form{margin-top:8px}
.copy-line a.v{color:inherit}
.me-sel{display:flex;flex-direction:column;gap:6px}
.me-sel .lbl{font-size:12px;color:var(--fg-2);font-weight:600}
.team{display:grid;gap:14px;align-content:start}
.team-card{display:flex;gap:16px;align-items:center;background:var(--surface);border-radius:var(--r-lg);padding:20px;box-shadow:var(--shadow-sm)}
.team-card h3{font-size:19px;letter-spacing:-.01em}
.team-card p{color:var(--fg-2);margin-top:2px}
.avatar.lg{flex:0 0 56px;width:56px;height:56px;font-size:18px}
.side-foot .live+.live{margin-top:8px}
@media (max-width:900px){.tiles.cols-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){
  .tiles,.tiles.cols-3{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .tile{padding:16px;min-height:0;gap:8px}
  .tile h3{font-size:15px;overflow-wrap:anywhere;hyphens:auto}
  .tile p{font-size:13px}
  .mini-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.kind-pick{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.kind{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:96px;padding:14px 10px;border-radius:var(--r-md);border:1.5px solid var(--line-2);background:var(--surface);color:var(--fg);font:inherit;font-weight:600;cursor:pointer;text-align:center}
.kind:hover{background:var(--surface-2)}
.kind.on{border-color:var(--tint);background:var(--tint-soft);color:var(--tint)}
.kind:focus-visible{outline:2px solid var(--tint);outline-offset:2px}
.inv-table th.exp-td,.inv-table td.exp-td{width:48px;padding:0 0 0 8px}
.exp-btn svg{transition:transform .2s var(--ease)}
.exp-btn[aria-expanded="true"] svg{transform:rotate(180deg)}
.inv-table tr.inv-row{cursor:pointer}
.inv-table tr.inv-open td{background:var(--tint-soft)}
.inv-table tr.inv-sub td{background:var(--surface-2);font-size:14px}
.inv-table tr.inv-sub{cursor:pointer}
.inv-table th{white-space:nowrap}
.st-pick{position:relative;cursor:pointer;padding-right:8px}
.st-pick{white-space:nowrap;flex:none}
.st-pick select{width:auto;min-width:0;max-width:none;field-sizing:content;appearance:none;-webkit-appearance:none;border:0;background:none;color:inherit;font:inherit;font-weight:600;padding:0 14px 0 0;margin-right:-14px;min-height:0;height:auto;cursor:pointer;position:relative;z-index:1}
.st-pick select:focus{outline:none;background:none}
.st-pick:focus-within{outline:2px solid var(--tint);outline-offset:2px}
.st-pick svg{pointer-events:none}
.st-row{display:flex;flex-wrap:wrap;gap:8px}
.st-top{display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:var(--r-md);background:var(--surface-2)}
.st-btn{border:1.5px solid transparent;cursor:pointer;font:inherit;font-size:13px;font-weight:600;padding:6px 12px;min-height:36px;opacity:.72}
.st-btn:hover{opacity:1}
.st-btn.on{opacity:1;border-color:currentColor}
.year-card{margin-top:16px}
.year-card .mini-kpis small{font-size:12px}
.ybars{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:6px;align-items:end;margin-top:18px}
.ybar{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0}
.ycol{position:relative;width:100%;max-width:34px;height:140px;display:flex;align-items:flex-end;justify-content:center;gap:2px}
.ycol i{display:block;width:45%;border-radius:4px 4px 0 0;min-height:0}
.yi{background:var(--tint)}
.yp{background:var(--volt-line)}
.ybar span{font-size:12px;color:var(--fg-2)}
.ybar small{font-size:11px;color:var(--fg-3);font-variant-numeric:tabular-nums;min-height:14px}
.ylegend{display:flex;gap:16px;margin-top:10px;font-size:12.5px;color:var(--fg-2)}
.ylegend span{display:inline-flex;gap:6px;align-items:center}
.ylegend i{display:inline-block;width:10px;height:10px;border-radius:3px}
@media (max-width:600px){.ybars{gap:3px}.ycol{height:110px}.ybar span{font-size:10.5px}.ybar small{display:none}}
.w-block{padding:14px;border-radius:var(--r-md);background:var(--surface-2)}
.w-block h3{font-size:16px}
.w-block .form input,.w-block .form select{background:var(--surface)}
.w-edit .form input{background:var(--surface)}
/* ===== v13 premium: Apple-style refresh ===== */
body{font-size:16px;line-height:1.47;font-feature-settings:"cv05","cv11";letter-spacing:-.003em}
.site,h1,h2,h3,.display,.big{font-family:var(--font-head)}
h1,h2,h3{letter-spacing:-.015em}
.eyebrow{font-size:14px;letter-spacing:0;text-transform:none;font-weight:600;color:var(--fg-3)}
.brand-sub{font-family:var(--font);letter-spacing:.14em;font-size:11px}
.btn{font-size:16px;min-height:46px;padding:0 22px}
.btn-sm{min-height:38px;padding:0 16px;font-size:14.5px}
.btn-primary{background:var(--tint);color:var(--on-tint)}
.btn-gray{background:var(--surface-2);color:var(--tint)}
.btn-link{display:inline-flex;align-items:center;gap:4px;color:var(--tint);font-size:17px;font-weight:500;min-height:44px}
.btn-link:hover{text-decoration:underline}
.btn-link .ic{width:16px;height:16px}
.on-dark .btn-link{color:#6FD3EA}
.grad-sky,.grad-fresh,.grad-ink{-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;padding-bottom:.06em}
.grad-sky{background-image:var(--grad-sky)}
.grad-fresh{background-image:var(--grad-fresh)}
.grad-ink{background-image:var(--grad-ink)}
.muted-line{color:var(--fg-3)}

/* nav: floating glass pill */
.site-nav{max-width:980px;min-height:52px;padding:6px 6px 6px 18px;gap:8px}
.site-nav .brand,.site-nav .logo-wrap{height:22px}
.site-links a{font-size:13.5px;padding:8px 12px;opacity:.85}
.nav-cta.btn-sm{min-height:38px;font-size:13.5px;padding:0 16px}
.nav-lang .lang-btn{min-height:34px;font-size:12.5px}

/* landing sections */
.x-wrap{max-width:1080px;margin:0 auto;padding-inline:22px}
.x-sec{position:relative;padding-block:clamp(84px,11vw,140px);overflow:hidden;background:var(--bg)}
.x-sec.white{background:var(--surface)}
.x-sec.black{background:#000;color:#F5F5F7}
.x-center{text-align:center;display:flex;flex-direction:column;align-items:center;gap:14px}
.x-eyebrow{font-size:clamp(17px,1.8vw,21px);font-weight:600;color:var(--fg-3);letter-spacing:-.01em}
.black .x-eyebrow{color:#A1A1A6}
.x-h1{font-size:clamp(48px,7.4vw,96px);font-weight:700;letter-spacing:-.035em;line-height:1.02;text-wrap:balance}
.x-h2{font-size:clamp(38px,5.6vw,72px);font-weight:700;letter-spacing:-.03em;line-height:1.04;text-wrap:balance;max-width:16ch}
.x-h2.wide{max-width:20ch}
.x-sub{font-size:clamp(18px,1.7vw,21px);line-height:1.42;color:var(--fg-2);max-width:40ch;text-wrap:pretty}
.black .x-sub{color:#A1A1A6}
.x-links{display:flex;flex-wrap:wrap;gap:10px 24px;align-items:center;justify-content:center;margin-top:6px}
.x-glow{position:absolute;border-radius:50%;filter:blur(110px);opacity:var(--glow-op);pointer-events:none}
.x-sec>.x-wrap{position:relative}

/* hero */
.x-hero{position:relative;min-height:min(820px,100svh);display:flex;align-items:flex-end;overflow:hidden;background:#dfe7ea}
.x-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:68% 35%}
.x-hero .x-wrap{position:relative;width:100%;padding-block:140px 56px}
.x-hero-card{max-width:560px;border-radius:30px;padding:34px 36px 30px;display:flex;flex-direction:column;gap:14px;background:rgba(255,255,255,.66);color:#1D1D1F;-webkit-backdrop-filter:blur(28px) saturate(180%);backdrop-filter:blur(28px) saturate(180%);box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 20px 60px rgba(0,0,0,.12)}
.x-hero-card .x-eyebrow{font-size:14px;color:#3F4A50}
.x-hero-card .x-h1{font-size:clamp(46px,6.2vw,80px)}
.x-hero-card .x-sub{color:#3F4A50;font-size:clamp(17px,1.5vw,19px)}
.x-hero-card .btn-primary{background:#00708F;color:#fff}
.x-hero-card .btn-link{color:#00708F}

/* device frames */
.phone{width:min(300px,78vw);aspect-ratio:300/610;border-radius:52px;background:#0b0b0c;padding:11px;box-shadow:0 40px 90px rgba(0,40,60,.22),inset 0 0 0 2px #2a2a2c;position:relative;margin-top:40px}
.phone-screen{width:100%;height:100%;border-radius:42px;background:#F5F5F7;overflow:hidden;display:flex;flex-direction:column;color:#1D1D1F;font-family:var(--font)}
.phone-island{position:absolute;top:22px;left:50%;transform:translateX(-50%);width:92px;height:26px;border-radius:20px;background:#0b0b0c;z-index:2}
.ps-top{padding:52px 18px 6px}
.ps-top small{font-size:11px;color:#6E6E73}
.ps-top b{display:block;font-size:26px;letter-spacing:-.02em}
.ps-list{display:flex;flex-direction:column;gap:8px;padding:8px 12px}
.ps-item{background:#fff;border-radius:14px;padding:10px 12px;display:flex;align-items:center;gap:10px;font-size:12.5px}
.ps-item .ic{color:#00708F}
.ps-item div{flex:1;min-width:0}
.ps-item small{display:block;color:#6E6E73;font-size:11px}
.ps-pill{font-size:10.5px;font-weight:600;padding:3px 8px;border-radius:999px;white-space:nowrap}
.ps-approve{margin:4px 12px 0;border-radius:16px;padding:12px;background:linear-gradient(135deg,#E4F5FA,#F1FFD6);font-size:12px;display:flex;flex-direction:column;gap:8px}
.ps-approve b{font-size:20px;letter-spacing:-.02em}
.ps-approve .row{display:flex;gap:6px}
.ps-approve span.bt{flex:1;text-align:center;border-radius:999px;padding:7px;font-weight:600;font-size:11.5px}
.ps-tab{margin-top:auto;display:flex;justify-content:space-around;padding:10px 10px 18px;font-size:10px;color:#6E6E73;background:rgba(255,255,255,.8)}
.ps-tab span{display:flex;flex-direction:column;align-items:center;gap:2px}
.ps-tab span.on{color:#00708F}
.mac{width:100%;max-width:960px;margin-top:56px;border-radius:16px;background:#1C1C1E;box-shadow:0 0 0 1px rgba(255,255,255,.08),0 40px 100px rgba(0,0,0,.6);overflow:hidden;text-align:left;font-family:var(--font)}
.mac-bar{display:flex;align-items:center;gap:7px;padding:11px 14px;background:#2A2A2C;color:#8E8E93;font-size:12px}
.mac-bar i{width:11px;height:11px;border-radius:50%;display:block}
.mac-bar span{margin:0 auto;padding-right:50px}
.mac-body{display:grid;grid-template-columns:170px minmax(0,1fr);min-height:320px}
.mac-side{background:#232325;padding:14px 10px;display:flex;flex-direction:column;gap:3px;font-size:13px;color:#C7C7CC}
.mac-side span{padding:7px 10px;border-radius:8px}
.mac-side span.on{background:rgba(255,255,255,.1);color:#fff;font-weight:600}
.mac-main{padding:20px 22px;color:#F5F5F7;min-width:0;overflow-x:auto}
.mac-main h4{margin:0 0 14px;font-size:22px;letter-spacing:-.02em}
.mac-t{width:100%;min-width:520px;border-collapse:collapse;font-size:13px}
.mac-t th{color:#8E8E93;font-weight:500;text-align:left;padding:8px 10px;border-bottom:1px solid rgba(255,255,255,.08);font-size:12px}
.mac-t td{padding:11px 10px;border-bottom:1px solid rgba(255,255,255,.06);color:#D1D1D6}
.mac-t td:first-child{color:#fff;font-weight:600}
.mac-t tr:last-child td{border-bottom:0}
.mp{font-size:11.5px;font-weight:600;padding:3px 9px;border-radius:999px;white-space:nowrap}
.mp.go{background:rgba(200,255,61,.16);color:#D9F78A}
.mp.sch{background:rgba(111,211,234,.16);color:#9FE3F2}
.mp.ap{background:rgba(255,179,90,.18);color:#FFC57A}
.mp.rep{background:rgba(169,180,245,.18);color:#C3CAFA}
.mp.dn{background:rgba(255,255,255,.1);color:#C7C7CC}

/* cost approval showcase */
.x-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center}
.x-split .x-left{display:flex;flex-direction:column;gap:16px}
.x-split .x-h2{font-size:clamp(36px,4.6vw,60px)}
.approve-card{background:var(--surface);border-radius:28px;padding:26px;box-shadow:0 30px 80px rgba(0,60,80,.12);display:flex;flex-direction:column;gap:16px;position:relative}
.approve-card .ac-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.approve-card .ac-head small{display:block;color:var(--fg-3);font-size:13px}
.approve-card .ac-head b{font-size:20px;letter-spacing:-.015em}
.ac-lines{display:flex;flex-direction:column;border-radius:16px;background:var(--surface-2);padding:4px 16px}
.ac-lines div{display:flex;justify-content:space-between;gap:12px;padding:11px 0;font-size:15px;border-bottom:1px solid var(--line)}
.ac-lines div:last-child{border-bottom:0}
.ac-lines span:last-child{font-variant-numeric:tabular-nums;color:var(--fg-2)}
.ac-total{display:flex;justify-content:space-between;align-items:baseline}
.ac-total b{font-size:34px;letter-spacing:-.025em;font-variant-numeric:tabular-nums}
.ac-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ac-btns span{display:flex;align-items:center;justify-content:center;min-height:46px;border-radius:999px;font-weight:600;font-size:15px}
.ac-btns .y{background:var(--tint);color:var(--on-tint)}
.ac-btns .n{background:var(--surface-2);color:var(--tint)}
.ac-steps{display:flex;flex-direction:column;gap:14px;margin-top:10px}
.ac-steps div{display:flex;gap:14px;align-items:flex-start}
.ac-steps i{flex:0 0 30px;height:30px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-weight:700;font-size:14px;color:#00222B;background:var(--grad-fresh)}
.ac-steps p{color:var(--fg-2);font-size:16px}
.ac-steps strong{color:var(--fg);display:block;font-size:17px}

/* bento */
.bento{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:56px;text-align:left}
.bx{background:var(--surface);border-radius:26px;padding:26px;display:flex;flex-direction:column;gap:6px;min-height:230px;position:relative;overflow:hidden}
.bx.s2{grid-column:span 2}
.bx small{font-size:14px;font-weight:600;color:var(--fg-3)}
.bx h3{font-size:clamp(22px,2.2vw,28px);font-weight:700;letter-spacing:-.022em;line-height:1.12;max-width:20ch}
.bx.dark{background:#000;color:#F5F5F7}
.bx.dark small{color:#A1A1A6}
.bx.tint{background:linear-gradient(140deg,#E4F5FA 0%,#E3FBF2 55%,#F1FFD6 100%);color:#1D1D1F}
.bx.tint small{color:#4D5D65}
.bx.photo{color:#fff;justify-content:flex-end;min-height:320px}
.bx.photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bx.photo:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.72),rgba(0,0,0,0) 62%)}
.bx.photo>*:not(img){position:relative;z-index:1}
.bx.photo small{color:rgba(255,255,255,.8)}
.bx .push{margin-top:auto}
.track{display:flex;align-items:center;margin-top:auto;padding-top:26px}
.track i{width:12px;height:12px;border-radius:50%;background:var(--fg);flex:0 0 auto}
.track i.cur{width:20px;height:20px;background:var(--volt);box-shadow:0 0 0 6px color-mix(in srgb,var(--volt) 35%,transparent)}
.track i.off{background:transparent;border:2px solid var(--line-2)}
.track b{flex:1;height:2px;background:var(--fg)}
.track b.off{background:var(--line-2)}
.track-l{display:flex;justify-content:space-between;font-size:12.5px;color:var(--fg-3);margin-top:10px}
.track-l .on{color:var(--fg);font-weight:600}
.big-stat{font-size:clamp(44px,5vw,64px);font-weight:700;letter-spacing:-.035em;line-height:1}

/* rails */
.rail{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:8px 22px 28px;margin-top:44px;scrollbar-width:thin;max-width:1180px;margin-inline:auto}
.rail>*{scroll-snap-align:start;flex:0 0 clamp(220px,24vw,260px)}
.rc{border-radius:24px;padding:22px;min-height:300px;display:flex;flex-direction:column;gap:6px;background:var(--surface);text-align:left;position:relative;overflow:hidden}
.rc h3{font-size:22px;letter-spacing:-.02em;margin-top:auto}
.rc p{font-size:14.5px;color:var(--fg-2)}
.rc .ic{color:var(--fg)}
.rc.g1{background:linear-gradient(170deg,#E3F7FB 0%,var(--surface) 70%)}
.rc.g2{background:linear-gradient(170deg,#E9EEFE 0%,var(--surface) 70%)}
.rc.g3{background:linear-gradient(170deg,#E7FBF2 0%,var(--surface) 70%)}
.rc.g4{background:linear-gradient(170deg,#F3FCDD 0%,var(--surface) 70%)}
.rc.g5{background:linear-gradient(170deg,#F0EBFD 0%,var(--surface) 70%)}
.rc.g6{background:linear-gradient(170deg,#E6F2F8 0%,var(--surface) 70%)}
:root[data-theme="dark"] .rc[class*=" g"],:root[data-theme="dark"] .bx.tint{background:var(--surface);color:var(--fg)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .rc[class*=" g"],:root:not([data-theme="light"]) .bx.tint{background:var(--surface);color:var(--fg)}}
.fix-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:48px;text-align:left}
.fix{background:var(--surface);border-radius:20px;padding:20px;display:flex;flex-direction:column;gap:8px}
.fix .ic{color:var(--tint)}
.fix h3{font-size:17px;letter-spacing:-.01em}
.fix p{font-size:14px;color:var(--fg-2)}
.x-final{background:#000;color:#F5F5F7;text-align:center;padding-block:clamp(110px,14vw,170px)}
.x-final .x-glow{opacity:.35}
.x-final .btn-primary{background:#00708F;color:#fff}

/* inner pages */
.page-hero{padding-block:140px 40px}
.page-hero .sec-head .display{font-size:clamp(44px,6vw,76px)!important;letter-spacing:-.035em}
.tile,.step,.seg-card,.card,.contact-tile,.team-card,.kpi,.table-wrap,.month,.tg-wrap,.live{box-shadow:var(--shadow-sm)}
.tile .ic,.seg-card .ic{color:var(--tint)}
.cta{background:#000;color:#F5F5F7;border-radius:32px;align-items:center;text-align:center}
.cta h2{font-size:clamp(32px,4.4vw,52px);letter-spacing:-.03em;max-width:22ch;background:var(--grad-fresh);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.cta .btn-primary{background:#00708F;color:#fff}
.section.dark{background:#000}
.section.alt{background:var(--surface)}
.section.alt .tile,.section.alt .step{background:var(--bg)}

/* ===== panels: readable ===== */
.app{position:relative;isolation:isolate}
.app:before,.app:after{content:"";position:fixed;z-index:-1;border-radius:50%;filter:blur(120px);opacity:var(--glow-op);pointer-events:none}
.app:before{left:-140px;top:-180px;width:560px;height:560px;background:var(--glow-1)}
.app:after{left:120px;top:440px;width:460px;height:460px;background:var(--glow-2)}
.sidebar{width:256px;flex-basis:256px;border-radius:26px}
.side-head .logo-wrap{height:24px}
.side-nav a{min-height:44px;font-size:15.5px;border-radius:12px;gap:12px}
.side-nav a.on{background:var(--surface);box-shadow:var(--shadow-sm);font-weight:600}
.side-nav a .count{font-size:12.5px}
.count.hot{min-width:22px;height:22px;padding:0 7px;border-radius:999px;background:#FF9F0A;color:#2A1800;display:inline-grid;place-items:center;font-weight:700}
.side-search{min-height:42px;font-size:15px;background:var(--surface)}
.main{padding:30px clamp(16px,3.4vw,48px) 72px;max-width:1360px}
.page-head{margin-bottom:26px}
.page-head h1{font-size:clamp(30px,3vw,38px);font-weight:700;letter-spacing:-.025em}
.page-head p{font-size:16.5px}
.card{padding:26px;border-radius:24px}
.card h2{font-size:21px;font-weight:700}
.kpis{gap:14px}
.kpi{padding:20px;border-radius:22px;gap:10px}
.kpi span{font-size:14px}
.kpi b{font-size:38px;font-weight:700;letter-spacing:-.03em}
table{font-size:15px}
th{font-size:13px}
th .th{padding:14px 16px}
td{padding:14px 16px}
td .sub{font-size:13px}
.chip{font-size:13px;padding:4px 11px}
.li{padding:14px 2px}
.li-main strong{font-size:16px}
.li-main small{font-size:14px}
.lbl{font-size:14px}
.hint{font-size:13.5px}
input,select,textarea{min-height:46px;font-size:16px;border-radius:12px}
.seg button{min-height:36px;font-size:14px}
.sheet-head h2{font-size:21px}
.section-title{font-size:12.5px}
.banner{font-size:14.5px;border-radius:14px}
.topbar .logo-wrap{height:20px}

/* ===== cost approval ===== */
.appr{display:flex;flex-direction:column;gap:14px;padding:20px;border-radius:20px;background:var(--surface-2);position:relative}
.appr.pending{background:linear-gradient(135deg,color-mix(in srgb,#6FD3EA 18%,var(--surface)) 0%,color-mix(in srgb,#C8FF3D 16%,var(--surface)) 100%);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--tint) 22%,transparent)}
.appr-head{display:flex;gap:12px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap}
.appr-head .t{display:flex;flex-direction:column;gap:2px;min-width:0}
.appr-head .t small{font-size:13.5px;color:var(--fg-2);font-weight:600}
.appr-head .t strong{font-size:19px;letter-spacing:-.015em}
.appr-lines{display:flex;flex-direction:column;background:var(--surface);border-radius:14px;padding:2px 16px}
.appr-lines div{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-bottom:1px solid var(--line);font-size:15.5px}
.appr-lines div:last-child{border-bottom:0}
.appr-lines span:last-child{font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--fg-2)}
.appr-lines .prev span{color:var(--fg-3)}
.appr-total{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.appr-total span{font-size:15px;color:var(--fg-2)}
.appr-total b{font-size:32px;letter-spacing:-.025em;font-variant-numeric:tabular-nums}
.appr-actions{display:flex;flex-wrap:wrap;gap:10px}
.appr-actions .btn{flex:1 1 150px}
.appr-q{display:flex;flex-direction:column;gap:8px}
.appr-msg{background:var(--surface);border-radius:14px;padding:12px 14px;font-size:15px}
.appr-msg small{display:block;color:var(--fg-3);font-size:12.5px;margin-bottom:2px}
.appr-hero{margin-bottom:18px}
.appr-hero>h2{font-size:22px;letter-spacing:-.02em;margin:0 0 12px;display:flex;align-items:center;gap:10px}
.appr-hero .appr{margin-bottom:12px}
.pulse-dot{width:10px;height:10px;border-radius:50%;background:#FF9F0A;box-shadow:0 0 0 5px rgba(255,159,10,.22)}
.est-lines{display:flex;flex-direction:column;gap:8px}
.est-line{display:grid;grid-template-columns:minmax(0,1fr) 130px 44px;gap:8px}
.est-sum{display:flex;justify-content:space-between;align-items:center;font-weight:600;padding:4px 2px}
.est-sum b{font-size:20px;font-variant-numeric:tabular-nums}
.limit-box{display:flex;flex-direction:column;gap:8px}

@media (max-width:900px){
  .x-split,.bento{grid-template-columns:minmax(0,1fr)}
  .bx.s2{grid-column:auto}
  .fix-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mac-body{grid-template-columns:minmax(0,1fr)}
  .mac-side{display:none}
  .site-nav{padding-left:16px}
}
@media (max-width:600px){
  .x-hero{min-height:640px}
  .x-hero-card{padding:24px 20px;border-radius:24px}
  .x-wrap{padding-inline:16px}
  .bx{min-height:0;padding:22px}
  .fix-grid{grid-template-columns:minmax(0,1fr)}
  .est-line{grid-template-columns:minmax(0,1fr) 104px 44px}
  .rail{padding-inline:16px}
}
.kpis{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
@media (max-width:600px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
.w-block input,.w-block textarea,.w-block select{background:var(--surface)}
.kpis.k4{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}

/* v13.1 softer */
.x-sec.soft{background:linear-gradient(180deg,var(--soft-a) 0%,var(--soft-b) 100%)}
.x-final.soft{color:var(--fg)}
.x-final .btn-primary,.x-hero-card .btn-primary,.cta .btn-primary{background:var(--tint);color:var(--on-tint)}
.x-hero-card .btn-link{color:#1F7A91}
.x-glow{filter:blur(130px)}
.mac{background:#FFFFFF;box-shadow:0 0 0 1px rgba(20,60,80,.08),0 40px 90px rgba(30,80,110,.14)}
.mac-bar{background:#F3F5F8;color:#8A9096}
.mac-side{background:#F8F9FB;color:#4A5157}
.mac-side span.on{background:#E9F4F7;color:#1F6C80}
.mac-main{color:#1D1D1F}
.mac-t th{color:#7A8086;border-bottom-color:rgba(0,0,0,.07)}
.mac-t td{color:#4A5157;border-bottom-color:rgba(0,0,0,.05)}
.mac-t td:first-child{color:#1D1D1F}
.mp.go{background:#F2FADF;color:#4A6012}
.mp.sch{background:#E8F5F9;color:#1F6C80}
.mp.ap{background:#FFF3E3;color:#94591A}
.mp.rep{background:#EEF0FC;color:#4B56B8}
.mp.dn{background:#F1F2F4;color:#6B7076}
:root[data-theme="dark"] .mac,:root[data-theme="dark"] .mac-side,:root[data-theme="dark"] .mac-bar{background:#1C1C1E;color:#AEAEB2}
:root[data-theme="dark"] .mac-main,:root[data-theme="dark"] .mac-t td:first-child{color:#F5F5F7}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .mac,:root:not([data-theme="light"]) .mac-side,:root:not([data-theme="light"]) .mac-bar{background:#1C1C1E;color:#AEAEB2}:root:not([data-theme="light"]) .mac-main,:root:not([data-theme="light"]) .mac-t td:first-child{color:#F5F5F7}}
.appr.pending{background:linear-gradient(135deg,color-mix(in srgb,#A9E4F1 22%,var(--surface)) 0%,color-mix(in srgb,#D4F27A 18%,var(--surface)) 100%)}
.ac-steps i{background:linear-gradient(135deg,#BDEBF4,#D9F4C2)}
.count.hot{background:#FFC46B;color:#3D2600}
.pulse-dot{background:#FFB547;box-shadow:0 0 0 5px rgba(255,181,71,.2)}
.ps-approve{background:linear-gradient(135deg,#EDF8FB,#F6FBE8)}

/* v13.2 one look across every page */
.page-hero{position:relative;padding-block:150px 64px;background:linear-gradient(180deg,var(--soft-a) 0%,var(--bg) 420px)}
.page-hero .sec-head{margin:0 auto 56px;align-items:center;text-align:center;max-width:860px}
.page-hero .sec-head .eyebrow,.sec-head .eyebrow{font-size:clamp(17px,1.8vw,21px);font-weight:600;color:var(--fg-3)}
.page-hero .sec-head .display{font-size:clamp(46px,6.4vw,84px)!important;font-weight:700;letter-spacing:-.035em;line-height:1.03}
.page-hero .sec-head .lead{font-size:clamp(18px,1.7vw,21px);color:var(--fg-2);max-width:44ch}
.page-hero .sec-head .actions{justify-content:center}
.tile,.step,.seg-card,.contact-tile,.team-card{border-radius:22px;box-shadow:none;background:var(--surface)}
.page-hero .card,.section .card{box-shadow:none}
.tile .ic,.seg-card .ic,.step .n{color:var(--tint)}
.seg-card ul{gap:6px}
.section{padding-block:clamp(72px,9vw,120px)}
.section.alt{background:var(--surface)}
.section.alt .tile,.section.alt .step,.section.alt .card,.section.alt .team-card{background:var(--bg)}
.sec-head h2.big{font-size:clamp(36px,4.6vw,60px);letter-spacing:-.03em}
.cta{position:relative;overflow:hidden;background:linear-gradient(135deg,var(--soft-a) 0%,var(--soft-b) 100%);color:var(--fg);box-shadow:none;padding:72px clamp(24px,5vw,64px)}
.cta:before{content:"";position:absolute;left:50%;bottom:-240px;transform:translateX(-50%);width:720px;height:420px;border-radius:50%;background:var(--glow-2);filter:blur(130px);opacity:var(--glow-op);pointer-events:none}
.cta>*{position:relative}
.cta h2{background:var(--grad-ink);-webkit-background-clip:text;background-clip:text}
.login-wrap{background:linear-gradient(180deg,var(--soft-a) 0%,var(--bg) 70%)}
.login-card{box-shadow:0 30px 80px rgba(30,80,110,.12);border-radius:30px}
.legal-body{border-radius:24px}
.site-foot{background:var(--surface)}
.success .big-no{font-family:var(--font-head);font-weight:700;letter-spacing:-.02em}
.kpi b{margin-top:auto}

/* customer register */
.reg-sum{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:6px}
.reg-sum div{background:var(--surface-2);border-radius:14px;padding:12px 14px;display:flex;flex-direction:column;gap:2px;min-width:0}
.reg-sum span{font-size:13px;color:var(--fg-2)}
.reg-sum b{font-size:22px;letter-spacing:-.02em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.reg-list{display:flex;flex-direction:column;margin-top:12px}
.reg-row{border-top:1px solid var(--line)}
.reg-row.on{background:linear-gradient(180deg,color-mix(in srgb,var(--tint-soft) 55%,transparent),transparent 120px);border-radius:16px;border-top-color:transparent}
.reg-row.on+.reg-row{border-top-color:transparent}
.reg-head{display:flex;align-items:center;gap:14px;width:100%;border:0;background:none;text-align:left;padding:14px 10px;cursor:pointer;color:var(--fg);border-radius:14px}
.reg-head:hover{background:var(--surface-2)}
.reg-head>.ic{color:var(--fg-3);transition:transform .2s var(--ease)}
.reg-head[aria-expanded="true"]>.ic{transform:rotate(180deg)}
.reg-main{flex:1;min-width:0}
.reg-main strong{display:block;font-size:16.5px}
.reg-main small{display:block;color:var(--fg-3);font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.reg-stats{display:flex;gap:14px;align-items:baseline;font-size:14px;color:var(--fg-2);white-space:nowrap}
.reg-stats strong{color:var(--fg);font-variant-numeric:tabular-nums;min-width:96px;text-align:right}
.reg-chips{min-width:150px;display:flex;justify-content:flex-end}
.reg-body{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.5fr) minmax(0,1fr);gap:16px;padding:4px 10px 20px}
.reg-body section{background:var(--surface);border-radius:16px;padding:16px;box-shadow:inset 0 0 0 1px var(--line);min-width:0}
.reg-body h3{font-size:13px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--fg-3);margin-bottom:10px}
.share-tag{font-size:11.5px;font-weight:600;padding:1px 7px;border-radius:999px;margin-left:4px;white-space:nowrap}
.share-tag.yes{background:var(--ok-soft);color:var(--ok)}
.share-tag.no{background:var(--muted-soft);color:var(--muted)}
.reg-jobs{display:flex;flex-direction:column}
.reg-job{display:grid;grid-template-columns:92px minmax(0,1fr) auto;gap:12px;padding:11px 4px;border:0;border-top:1px solid var(--line);background:none;text-align:left;color:var(--fg);font:inherit;align-items:start;border-radius:8px}
.reg-job:first-child{border-top:0}
button.reg-job{cursor:pointer}
button.reg-job:hover{background:var(--surface-2)}
.reg-job .d{font-size:13.5px;color:var(--fg-2);font-variant-numeric:tabular-nums;padding-top:2px}
.reg-job .m strong{display:block;font-size:15px}
.reg-job .m small{display:block;font-size:13px;color:var(--fg-3);margin-top:2px}
.reg-job .r{display:flex;flex-direction:column;align-items:flex-end;gap:6px;font-variant-numeric:tabular-nums;white-space:nowrap}
.reg-ag{display:flex;flex-direction:column;gap:8px}
.reg-ag>div{position:relative;background:var(--surface-2);border-radius:12px;padding:10px 40px 10px 12px}
.reg-ag small{font-size:12.5px;color:var(--fg-3)}
.reg-ag p{font-size:14.5px;margin-top:2px}
.reg-ag .icon-btn{position:absolute;top:2px;right:2px;width:36px;height:36px}
@media (max-width:1200px){.reg-body{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.reg-body section:nth-child(2){grid-column:1/-1;order:3}}
@media (max-width:760px){.reg-body{grid-template-columns:minmax(0,1fr)}.reg-stats span{display:none}.reg-chips{min-width:0}.reg-sum{grid-template-columns:repeat(2,minmax(0,1fr))}.reg-job{grid-template-columns:minmax(0,1fr) auto}.reg-job .d{grid-column:1/-1}}

/* v13.3 softer panels (about 30% lighter tints) and a clearer logo */
.app:before,.app:after{opacity:calc(var(--glow-op) * .68)}
.app .tone-info{background:color-mix(in srgb,var(--info-soft) 70%,var(--surface))}
.app .tone-violet{background:color-mix(in srgb,var(--violet-soft) 70%,var(--surface))}
.app .tone-volt{background:color-mix(in srgb,var(--volt-soft) 70%,var(--surface));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--volt-line) 45%,transparent)}
.app .tone-warn{background:color-mix(in srgb,var(--warn-soft) 70%,var(--surface))}
.app .tone-ok{background:color-mix(in srgb,var(--ok-soft) 70%,var(--surface))}
.app .tone-bad{background:color-mix(in srgb,var(--bad-soft) 70%,var(--surface))}
.app .tone-muted{background:color-mix(in srgb,var(--muted-soft) 70%,var(--surface))}
.app .card,.app .kpi,.app .table-wrap{box-shadow:0 1px 2px rgba(0,0,0,.03)}
.app .sidebar.glass{background:color-mix(in srgb,var(--surface) 78%,transparent)}
.appr.pending{background:linear-gradient(135deg,color-mix(in srgb,#A9E4F1 14%,var(--surface)) 0%,color-mix(in srgb,#D4F27A 11%,var(--surface)) 100%);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--tint) 15%,transparent)}
.banner{background:color-mix(in srgb,var(--warn-soft) 65%,var(--surface))}
.reg-row.on{background:linear-gradient(180deg,color-mix(in srgb,var(--tint-soft) 35%,transparent),transparent 120px)}
.side-nav a.on{box-shadow:0 1px 2px rgba(0,0,0,.05)}
.count.hot{background:#FFD08A}
/* logo */
:root{--logo-ink:#063A3C}
.site-nav .brand,.site-nav .logo-wrap{height:28px}
.site-nav{min-height:58px}
.side-head .logo-wrap{height:30px}
.topbar .logo-wrap{height:24px}
.foot-brand .logo-wrap,.foot-grid .logo-wrap{height:78px}
.login-card .logo-wrap{height:76px}
.logo-wrap svg path,.logo-wrap svg circle[fill="none"]{stroke-width:21}
@media (max-width:600px){.site-nav .logo-wrap,.site-nav .brand{height:24px}}

/* v13.4 panels another 10% softer */
.app:before,.app:after{opacity:calc(var(--glow-op) * .6)}
.app .tone-info{background:color-mix(in srgb,var(--info-soft) 62%,var(--surface))}
.app .tone-violet{background:color-mix(in srgb,var(--violet-soft) 62%,var(--surface))}
.app .tone-volt{background:color-mix(in srgb,var(--volt-soft) 62%,var(--surface));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--volt-line) 38%,transparent)}
.app .tone-warn{background:color-mix(in srgb,var(--warn-soft) 62%,var(--surface))}
.app .tone-ok{background:color-mix(in srgb,var(--ok-soft) 62%,var(--surface))}
.app .tone-bad{background:color-mix(in srgb,var(--bad-soft) 62%,var(--surface))}
.app .tone-muted{background:color-mix(in srgb,var(--muted-soft) 62%,var(--surface))}
.appr.pending{background:linear-gradient(135deg,color-mix(in srgb,#A9E4F1 12%,var(--surface)) 0%,color-mix(in srgb,#D4F27A 10%,var(--surface)) 100%)}
.banner{background:color-mix(in srgb,var(--warn-soft) 58%,var(--surface))}
.app .card,.app .kpi,.app .table-wrap{box-shadow:0 1px 2px rgba(0,0,0,.025)}
.app .sidebar.glass{background:color-mix(in srgb,var(--surface) 84%,transparent)}
.reg-row.on{background:linear-gradient(180deg,color-mix(in srgb,var(--tint-soft) 30%,transparent),transparent 120px)}
.reg-sum div,.mini-kpis div,.w-block,.st-top,.time-box,.quote-box{background:color-mix(in srgb,var(--surface-2) 80%,var(--surface))}
.count.hot{background:#FFDA9E}
.reg-book{grid-column:1/-1;display:flex;justify-content:flex-end;margin-bottom:-4px}
.book-for{display:flex;flex-direction:column}

/* ===== tablet and phone ===== */
.tabbar{display:none}
@media (min-width:1024px) and (max-width:1240px){
  .sidebar{width:224px;flex-basis:224px}
  .main{padding-inline:24px}
  .reg-body{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}
@media (max-width:1023px){
  .app{flex-direction:column}
  .sidebar{position:fixed;top:0;left:0;bottom:0;margin:8px;height:auto;width:290px;transform:translateX(-110%);transition:transform .3s var(--ease);z-index:50;align-self:auto}
  .sidebar.open{transform:none}
  .scrim{z-index:45}
  .topbar{display:flex;align-items:center;gap:8px;position:sticky;top:calc(env(safe-area-inset-top,0px) + 8px);z-index:30;margin:8px 12px 0;border-radius:999px;padding:4px 6px}
  .topbar .logo-wrap{height:24px;margin-right:auto;margin-left:4px}
  .main{padding:18px clamp(16px,3vw,28px) calc(env(safe-area-inset-bottom,0px) + 112px)}
  .tabbar{display:flex;position:fixed;left:50%;transform:translateX(-50%);bottom:calc(env(safe-area-inset-bottom,0px) + 12px);z-index:40;gap:2px;padding:6px;border-radius:999px;width:min(560px,calc(100% - 24px));justify-content:space-between}
  .tabbar a,.tabbar button{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:2px;min-height:52px;justify-content:center;border:0;background:none;border-radius:999px;color:var(--fg-2);font:inherit;cursor:pointer;text-decoration:none;padding:4px 2px}
  .tabbar a:hover{text-decoration:none}
  .tabbar a.on{color:var(--tint);background:color-mix(in srgb,var(--tint-soft) 70%,transparent)}
  .tb-ic{position:relative;display:grid;place-items:center}
  .tb-badge{position:absolute;top:-6px;right:-12px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:#FFC46B;color:#3D2600;font-size:11px;font-weight:700;display:grid;place-items:center}
  .tb-l{font-size:11px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  .toasts{bottom:calc(env(safe-area-inset-bottom,0px) + 92px)}
  .action-bar{bottom:calc(env(safe-area-inset-bottom,0px) + 90px)}
  .preview-bar{margin:8px 12px 0}
  .page-head{align-items:flex-start}
  .page-head .actions{width:100%}
  .detail-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .overlay.right{padding:8px}
  .drawer{width:min(680px,100%)}
}
@media (max-width:760px){
  .page-head h1{font-size:30px}
  .page-head .actions .btn{flex:1 1 auto}
  .detail-grid,.grid-2{grid-template-columns:minmax(0,1fr)}
  .card{padding:20px;border-radius:22px}
  .kpis,.kpis.k4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kpi b{font-size:30px}
  .overlay.right{padding:0;align-items:flex-end}
  .drawer{width:100%;height:94vh;border-radius:22px 22px 0 0;animation:rise .3s var(--ease)}
  .overlay{padding-top:calc(env(safe-area-inset-top,0px) + 4vh)}
  .sheet{border-radius:22px}
  .appr-actions .btn{flex:1 1 100%}
  .appr-total b{font-size:28px}
  .reg-head{padding:12px 6px;gap:10px}
  .reg-head .avatar{display:none}
  .reg-stats strong{min-width:0}
  .client-switch select{flex:1 1 100%}
  .tabbar{width:calc(100% - 20px)}
  .main{padding-inline:14px}
}
@media (min-width:761px) and (max-width:1023px){.kpis{grid-template-columns:repeat(auto-fit,minmax(128px,1fr))}.kpi{padding:16px}.kpi span{font-size:13px}.kpi b{font-size:30px}}

/* v13.5 panels another 20% softer */
.app:before,.app:after{opacity:calc(var(--glow-op) * .48)}
.app .tone-info{background:color-mix(in srgb,var(--info-soft) 50%,var(--surface))}
.app .tone-violet{background:color-mix(in srgb,var(--violet-soft) 50%,var(--surface))}
.app .tone-volt{background:color-mix(in srgb,var(--volt-soft) 50%,var(--surface));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--volt-line) 30%,transparent)}
.app .tone-warn{background:color-mix(in srgb,var(--warn-soft) 50%,var(--surface))}
.app .tone-ok{background:color-mix(in srgb,var(--ok-soft) 50%,var(--surface))}
.app .tone-bad{background:color-mix(in srgb,var(--bad-soft) 50%,var(--surface))}
.app .tone-muted{background:color-mix(in srgb,var(--muted-soft) 50%,var(--surface))}
.app .dot{opacity:.8}
.appr.pending{background:linear-gradient(135deg,color-mix(in srgb,#A9E4F1 10%,var(--surface)) 0%,color-mix(in srgb,#D4F27A 8%,var(--surface)) 100%);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--tint) 12%,transparent)}
.banner{background:color-mix(in srgb,var(--warn-soft) 46%,var(--surface))}
.app a.banner[style]{background:color-mix(in srgb,var(--bad-soft) 46%,var(--surface))!important}
.app .sidebar.glass{background:color-mix(in srgb,var(--surface) 88%,transparent)}
.reg-row.on{background:linear-gradient(180deg,color-mix(in srgb,var(--tint-soft) 24%,transparent),transparent 120px)}
.reg-sum div,.mini-kpis div,.w-block,.st-top,.time-box,.quote-box,.appr:not(.pending){background:color-mix(in srgb,var(--surface-2) 64%,var(--surface))}
.app input,.app select,.app textarea{background:color-mix(in srgb,var(--surface-2) 70%,var(--surface))}
.app .w-block input,.app .w-block textarea,.app .w-block select{background:var(--surface)}
.count.hot,.tb-badge{background:#FFE3B5;color:#4A3000}
.pulse-dot{background:#FFC870;box-shadow:0 0 0 5px rgba(255,200,112,.18)}
.tabbar a.on{background:color-mix(in srgb,var(--tint-soft) 55%,transparent)}
.ycol .yi{opacity:.8}.ycol .yp{opacity:.8}

/* ===== calendar v2: readable day / week / month ===== */
.cal-bar2{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:14px}
.cal-nav{display:flex;align-items:center;gap:6px;min-width:0}
.cal-nav h2{font-size:24px;letter-spacing:-.02em;margin:0 6px;white-space:nowrap}
.day-strip{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;margin-bottom:14px}
.ds{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 4px;border:0;border-radius:16px;background:var(--surface);color:var(--fg);cursor:pointer;font:inherit;box-shadow:0 1px 2px rgba(0,0,0,.03)}
.ds span{font-size:12.5px;font-weight:600;color:var(--fg-3);text-transform:uppercase;letter-spacing:.05em}
.ds b{font-size:22px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.ds i{font-style:normal;font-size:12.5px;color:var(--fg-3)}
.ds.today b{color:var(--tint)}
.ds.on{background:var(--tint);color:var(--on-tint)}
.ds.on span,.ds.on i,.ds.on b{color:var(--on-tint)}
.ds:hover:not(.on){background:color-mix(in srgb,var(--tint-soft) 45%,var(--surface))}
.cal-layout2{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px;align-items:start}
.cal-side2{position:sticky;top:16px}
.count-pill{min-width:26px;height:26px;padding:0 9px;border-radius:999px;background:var(--surface-2);font-size:13px;font-weight:700;display:inline-grid;place-items:center}
.wait-list{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.wait{display:flex;align-items:flex-start;gap:10px;width:100%;text-align:left;border:0;border-radius:14px;padding:12px;background:color-mix(in srgb,var(--surface-2) 64%,var(--surface));color:var(--fg);font:inherit;cursor:grab}
.wait:hover{background:var(--surface-2)}
.wait.urgent{box-shadow:inset 3px 0 0 var(--bad)}
.wait .grip{color:var(--fg-3);letter-spacing:-2px;font-size:13px;padding-top:2px}
.wait .li-main strong{white-space:normal;font-size:15.5px}
.wait .li-main small{white-space:normal}
.legend2{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:12px}
.legend2 .lg{min-height:34px;font-size:13px}
/* event card */
.cc{display:flex;flex-direction:column;gap:2px;width:100%;height:100%;text-align:left;border:0;border-radius:14px;padding:10px 12px;background:var(--surface);color:var(--fg);font:inherit;cursor:pointer;box-shadow:inset 4px 0 0 var(--ev),0 1px 3px rgba(0,0,0,.06);overflow:hidden;min-width:0}
.cc:hover{box-shadow:inset 4px 0 0 var(--ev),0 4px 14px rgba(0,0,0,.08)}
.cc.g-todo{background:color-mix(in srgb,var(--cal-todo) 7%,var(--surface))}
.cc.g-doing{background:color-mix(in srgb,var(--cal-doing) 9%,var(--surface))}
.cc.g-done{background:var(--surface);opacity:.72}
.cc.urgent{box-shadow:inset 4px 0 0 var(--bad),0 1px 3px rgba(0,0,0,.06)}
.cc-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.cc-time{font-size:14px;font-variant-numeric:tabular-nums}
.cc-st{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;color:var(--fg-2);white-space:nowrap}
.cc-who{font-size:15px;line-height:1.25;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.cc-who .u{color:var(--bad)}
.cc-what{font-size:13px;color:var(--fg-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-where{display:flex;align-items:center;gap:4px;font-size:12.5px;color:var(--fg-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-run{font-size:13px;font-weight:700;color:var(--bad);font-variant-numeric:tabular-nums}
.cc.compact{padding:7px 10px}
.cc.compact .cc-who{-webkit-line-clamp:1;font-size:14px}
/* day view */
.dv-wrap{background:var(--surface);border-radius:var(--r-lg);overflow-x:auto;box-shadow:0 1px 2px rgba(0,0,0,.03)}
.dv{display:grid;grid-template-columns:64px repeat(var(--cols),minmax(200px,1fr));min-width:calc(64px + var(--cols) * 200px)}
.dv-corner{border-bottom:1px solid var(--line)}
.dv-head{display:flex;align-items:center;gap:8px;padding:14px 14px 12px;border-left:1px solid var(--line);border-bottom:1px solid var(--line);font-size:16px}
.dv-head span:last-child{margin-left:auto;font-size:13px;color:var(--fg-3)}
.dv-head .tech-dot{width:10px;height:10px}
.dv-gut{position:relative}
.dv-gut span{position:absolute;right:10px;transform:translateY(6px);font-size:12.5px;color:var(--fg-3);font-variant-numeric:tabular-nums}
.dv-col{position:relative;border-left:1px solid var(--line);background-image:repeating-linear-gradient(to bottom,var(--line) 0 1px,transparent 1px var(--hh))}
.dv-col.none{background-color:color-mix(in srgb,var(--surface-2) 35%,transparent)}
.dv-col.drop{background-color:color-mix(in srgb,var(--tint-soft) 60%,transparent)}
.dv-ev{position:absolute;padding:2px 0}
/* week view */
.wk{display:grid;grid-template-columns:repeat(var(--cols),minmax(150px,1fr));gap:10px;overflow-x:auto;padding-bottom:4px}
.wk-day{display:flex;flex-direction:column;gap:8px;background:var(--surface);border-radius:20px;padding:10px;min-height:420px;box-shadow:0 1px 2px rgba(0,0,0,.03)}
.wk-day.today{box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--tint) 55%,transparent)}
.wk-day.drop{background:color-mix(in srgb,var(--tint-soft) 60%,var(--surface))}
.wk-head{display:flex;align-items:baseline;gap:8px;border:0;background:none;font:inherit;color:var(--fg);cursor:pointer;padding:4px 6px 6px;text-align:left}
.wk-head span{font-size:13px;font-weight:600;color:var(--fg-3);text-transform:uppercase;letter-spacing:.05em}
.wk-head b{font-size:22px;letter-spacing:-.02em}
.wk-day.today .wk-head b{color:var(--tint)}
.wk-head em{margin-left:auto;font-style:normal;font-size:12.5px;font-weight:700;background:var(--surface-2);border-radius:999px;padding:2px 9px}
.wk-list{display:flex;flex-direction:column;gap:8px;flex:1}
.wk-list .cc{height:auto}
.wk-empty{color:var(--fg-3);font-size:14px;padding:14px 6px}
.wk-add{display:flex;align-items:center;justify-content:center;gap:6px;min-height:40px;border:1.5px dashed var(--line-2);background:none;border-radius:12px;color:var(--fg-3);font:inherit;font-size:13.5px;cursor:pointer}
.wk-add:hover{color:var(--tint);border-color:var(--tint)}
/* month view */
.mv .mcell{min-height:118px;gap:4px}
.mv-ev{display:block;font-size:12.5px;padding:3px 7px;border-radius:7px;background:color-mix(in srgb,var(--ev) 10%,var(--surface));white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:inset 3px 0 0 var(--ev)}
.mv-ev b{font-variant-numeric:tabular-nums}
.mv-more{font-size:12px;font-weight:600;color:var(--fg-3);padding-left:4px}
.g-todo{--ev:var(--cal-todo)} .g-doing{--ev:var(--cal-doing)} .g-done{--ev:var(--cal-done)}
@media (max-width:1180px){.cal-layout2{grid-template-columns:minmax(0,1fr)}.cal-side2{position:static}}
@media (max-width:760px){
  .cal-nav h2{font-size:19px;white-space:normal}
  .day-strip{gap:4px}.ds{padding:8px 2px;border-radius:12px}.ds b{font-size:18px}.ds i{display:none}
  .dv{grid-template-columns:52px repeat(var(--cols),minmax(170px,1fr));min-width:calc(52px + var(--cols) * 170px)}
  .wk{grid-template-columns:minmax(0,1fr);overflow:visible}
  .wk-day{min-height:0}
  .mv .mcell{min-height:58px}.mv-ev,.mv-more{display:none}
}
.cal-layout2.wide{grid-template-columns:minmax(0,1fr)}
.cal-layout2.wide .cal-side2{position:static}
.cal-layout2.wide .wait-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.cc-top{flex-wrap:wrap;row-gap:0}
.dv-ev .cc{justify-content:flex-start}

/* grouped sidebar */
.side-nav{gap:1px}
.side-group{font-size:13px;font-weight:600;color:var(--fg-3);padding:16px 12px 5px;letter-spacing:.01em}
.side-nav .side-group:first-child{padding-top:4px}
.side-nav a{min-height:46px;font-size:16px;gap:13px}
.side-nav a .ic{color:var(--tint);width:20px;height:20px}
.side-nav a.on{background:color-mix(in srgb,var(--surface-2) 90%,var(--fg) 4%);box-shadow:none}
.side-nav a .count{min-width:26px;height:24px;padding:0 8px;border-radius:999px;background:var(--surface-2);display:inline-grid;place-items:center;color:var(--fg-2)}
.side-nav a .count.hot{background:#FFE3B5;color:#4A3000}
.sidebar{overflow-y:auto;scrollbar-width:thin}
.side-nav{overflow:visible;flex:0 0 auto}
.side-foot{gap:8px}
.me-sel .lbl{display:none}
.me-sel select{min-height:40px;font-size:14.5px}
@media (max-height:1080px){
  .side-nav a{min-height:40px;font-size:15.5px}
  .side-group{padding:10px 12px 3px}
  .side-head{padding-bottom:2px}
  .sidebar{gap:10px;padding-block:14px}
}

/* users & access */
.users-grid{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:16px;align-items:start}
.users-grid>form .form{grid-template-columns:minmax(0,1fr)}
.ua-row{display:flex;align-items:center;gap:12px;padding:12px 2px;border-bottom:1px solid var(--line)}
.ua-row:last-child{border-bottom:0}
.ua-row.off{opacity:.55}
.ua-row .li-main strong{font-size:15.5px}
.ua-act{display:flex;gap:2px;min-width:88px;justify-content:flex-end}
.switch{position:relative;display:inline-block;width:51px;height:31px;flex:0 0 auto;cursor:pointer}
.switch input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer;z-index:1;min-height:0}
.switch span{position:absolute;inset:0;border-radius:999px;background:var(--surface-3);transition:background .2s var(--ease)}
.switch span:after{content:"";position:absolute;top:2px;left:2px;width:27px;height:27px;border-radius:50%;background:#fff;box-shadow:0 3px 8px rgba(0,0,0,.15);transition:transform .2s var(--ease)}
.switch input:checked+span{background:#34C759}
.switch input:checked+span:after{transform:translateX(20px)}
.switch input:focus-visible+span{outline:3px solid color-mix(in srgb,var(--tint) 55%,transparent);outline-offset:2px}
@media (max-width:1100px){.users-grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:600px){.ua-row{flex-wrap:wrap}.ua-row .li-main{flex:1 1 calc(100% - 60px)}.ua-act{min-width:0;margin-left:auto}}

/* dashboard scope */
.dash-scope{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:18px}
.scope-pick{display:flex;align-items:center;gap:10px;background:var(--surface);border-radius:999px;padding:5px 6px 5px 5px;box-shadow:0 1px 2px rgba(0,0,0,.04);flex:0 1 460px;min-width:0}
.scope-ic{flex:0 0 38px;height:38px;border-radius:50%;background:color-mix(in srgb,var(--tint-soft) 70%,var(--surface));color:var(--tint);display:grid;place-items:center}
.scope-pick select{border:0;background:transparent!important;font-weight:600;font-size:16px;min-height:40px;padding:0 8px;flex:1;min-width:0}
.dash-hi{color:var(--tint)!important;font-weight:600;font-size:15px!important}
.dash-client-head h1{font-size:clamp(32px,4vw,48px)!important;letter-spacing:-.03em}
.client-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:20px}
.ck{background:var(--surface);border-radius:22px;padding:20px;display:flex;flex-direction:column;gap:6px;box-shadow:0 1px 2px rgba(0,0,0,.03);min-width:0}
.ck span{font-size:14px;font-weight:600;color:var(--fg-2)}
.ck b{font-size:34px;letter-spacing:-.03em;font-variant-numeric:tabular-nums;line-height:1.05}
.ck small{font-size:13px;color:var(--fg-3)}
.ck.ck-hero{background:linear-gradient(135deg,#3E8EA6,#5FA9C8);color:#fff}
.ck.ck-hero span{color:rgba(255,255,255,.85)}.ck.ck-hero small{color:#E4F7B8}
.ck.warn b{color:var(--bad)}
.ck.warn{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--bad) 22%,transparent)}
@media (max-width:760px){.client-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.ck b{font-size:26px}.scope-pick{flex:1 1 100%}}

/* inbox */
.inbox{display:grid;grid-template-columns:minmax(0,360px) minmax(0,1fr);gap:16px;align-items:start}
.ib-list{padding:16px;display:flex;flex-direction:column;gap:6px}
.ib-threads{display:flex;flex-direction:column;margin-top:10px;max-height:62vh;overflow:auto}
.ib-t{display:flex;align-items:center;gap:11px;width:100%;text-align:left;border:0;background:none;border-radius:14px;padding:11px 8px;font:inherit;color:var(--fg);cursor:pointer}
.ib-t:hover{background:var(--surface-2)}
.ib-t.on{background:color-mix(in srgb,var(--tint-soft) 60%,var(--surface))}
.ib-t .li-main small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ib-t.unread strong{font-weight:700}
.ib-t.unread .li-main small{color:var(--fg);font-weight:500}
.ib-meta{display:flex;flex-direction:column;align-items:flex-end;gap:4px;white-space:nowrap}
.ib-meta small{font-size:12px;color:var(--fg-3)}
.ib-dot{min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--tint);color:var(--on-tint);font-size:11.5px;display:grid;place-items:center}
.ib-cur{padding:0;display:flex;flex-direction:column;min-height:560px;overflow:hidden}
.ib-head{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line)}
.ib-back{display:none}
.ib-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:var(--fg-3)}
.thread{flex:1;overflow:auto;padding:18px;display:flex;flex-direction:column;gap:10px;max-height:58vh;min-height:300px}
.th-day{align-self:center;font-size:12px;font-weight:600;color:var(--fg-3);background:var(--surface-2);border-radius:999px;padding:3px 10px;margin:6px 0}
.msg{display:flex;flex-direction:column;align-items:flex-start;gap:3px;max-width:76%}
.msg.mine{align-self:flex-end;align-items:flex-end}
.bubble{background:var(--surface-2);border-radius:18px 18px 18px 6px;padding:10px 14px;font-size:15.5px;line-height:1.4;white-space:pre-line}
.msg.mine .bubble{background:var(--tint);color:var(--on-tint);border-radius:18px 18px 6px 18px}
.msg small{font-size:12px;color:var(--fg-3);padding:0 6px}
.msg-job{display:block;font-size:12px;font-weight:700;opacity:.8;margin-bottom:2px}
.composer{border-top:1px solid var(--line);padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.composer select{min-height:38px;font-size:14px;width:auto;max-width:100%;align-self:flex-start}
.cmp-row{display:flex;gap:10px;align-items:flex-end}
.cmp-row textarea{min-height:48px;flex:1;resize:none;border-radius:16px}
.cm-card{padding:0;display:flex;flex-direction:column;max-width:820px}
.cm-card .thread{max-height:62vh}
/* website requests */
.wr-list{display:flex;flex-direction:column;gap:14px}
.wr.fresh{box-shadow:inset 4px 0 0 var(--tint),0 1px 2px rgba(0,0,0,.03)}
.wr-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap}
.wr-top h3{font-size:21px;letter-spacing:-.015em;margin-top:2px}
.wr-chips{display:flex;gap:6px}
.wr-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:14px 0 10px}
.wr-grid>div{display:flex;flex-direction:column;gap:4px;min-width:0}
.wr-grid p{font-size:15px}
.wr-issue{background:color-mix(in srgb,var(--surface-2) 64%,var(--surface));border-radius:14px;padding:12px 14px;font-size:15.5px;margin-bottom:14px;white-space:pre-line}
@media (max-width:1100px){.wr-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:860px){.inbox{grid-template-columns:minmax(0,1fr)}.inbox.has-cur .ib-list{display:none}.inbox:not(.has-cur) .ib-cur{display:none}.ib-back{display:inline-grid}.ib-head .btn{display:none}.msg{max-width:88%}.thread{max-height:none;min-height:50vh}}
@media (max-width:600px){.wr-grid{grid-template-columns:minmax(0,1fr)}}
.ib-list .search-in{flex:0 0 auto}

/* parts */
.part-ed{padding:6px 4px}
.part-ed .form.f4{grid-template-columns:repeat(4,minmax(0,1fr))}
.part-ed input,.part-ed select{background:var(--surface)!important}
.parts-t tr.on td{background:color-mix(in srgb,var(--tint-soft) 45%,var(--surface))}
.part{grid-template-columns:minmax(0,1fr) 80px 44px}
.part-st{grid-column:1/-1;font-size:13px;color:var(--fg-3);margin-top:-2px;display:flex;align-items:center;gap:4px;flex-wrap:wrap}
@media (max-width:900px){.part-ed .form.f4{grid-template-columns:repeat(2,minmax(0,1fr))}}
.parts-t th{padding:12px 16px}
tr.ap-grp td{background:color-mix(in srgb,var(--surface-2) 70%,var(--surface));padding:10px 16px}
.ap-grp-h{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ap-grp-h .ic{color:var(--tint)}
.ap-grp-h strong{font-size:15.5px}
.ap-grp-h .btn{margin-left:auto;min-height:32px}

/* status control */
.stc{display:flex;flex-direction:column;gap:12px;padding:16px;border-radius:18px;background:color-mix(in srgb,var(--surface-2) 64%,var(--surface))}
.stc-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.stc-flow{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}
.stc-step{display:flex;flex-direction:column;align-items:center;gap:5px;padding:10px 4px;border:0;border-radius:14px;background:var(--surface);color:var(--fg-2);font:inherit;font-size:13px;font-weight:600;cursor:pointer;min-height:64px;box-shadow:inset 0 0 0 1px var(--line)}
.stc-step:hover{color:var(--fg);box-shadow:inset 0 0 0 1px var(--line-2)}
.stc-dot{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700;background:var(--surface-2);color:var(--fg-3)}
.stc-step.past{color:var(--fg)}
.stc-step.past .stc-dot{background:color-mix(in srgb,var(--tint) 18%,var(--surface));color:var(--tint)}
.stc-step.on{background:var(--tint);color:var(--on-tint);box-shadow:none}
.stc-step.on .stc-dot{background:rgba(255,255,255,.25);color:var(--on-tint)}
.stc-other{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.stc-sel{display:flex;align-items:center;gap:8px}
.stc-sel select{min-height:38px;width:auto;font-size:14px;background:var(--surface)!important}
@media (max-width:600px){.stc-flow{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* job filters */
.job-filters{flex-wrap:nowrap}
.seg-scroll{overflow-x:auto;scrollbar-width:none;min-width:0;flex:0 1 auto}
.seg-scroll::-webkit-scrollbar{display:none}
.seg-scroll .seg{flex-wrap:nowrap;white-space:nowrap}
.more-sel{width:auto!important;min-height:40px;border-radius:12px;font-size:14px;font-weight:600;flex:0 0 auto}
.more-sel.on{background:var(--tint)!important;color:var(--on-tint)}

/* v13.6 calmer headers, compact numbers, focused tables */
.kdot{display:inline-block;width:9px;height:9px;border-radius:50%;background:currentColor!important;flex:0 0 auto;box-shadow:none!important}
.kpi span{gap:8px}
.kpi{padding:16px 18px;gap:6px}
.kpi b{font-size:32px}
.job-no{font-weight:600;font-variant-numeric:tabular-nums}
.jobs-t td,.cl-t td,.parts-t td{white-space:nowrap}
.jobs-t td:first-child,.cl-t td:first-child,.parts-t td:first-child{white-space:normal;min-width:150px}
.parts-t td:nth-child(3){white-space:normal;min-width:180px}
@media (max-width:760px){
  /* page header: title left, small actions right */
  .page-head{flex-wrap:nowrap;align-items:center;gap:10px;margin-bottom:16px}
  .page-head>div:first-child{min-width:0;flex:1}
  .page-head h1{font-size:28px}
  .page-head p{display:none}
  .page-head .actions{width:auto;flex-wrap:nowrap;gap:6px;flex:0 0 auto}
  .page-head .actions .btn{flex:0 0 auto;min-height:40px;padding:0 14px;font-size:14.5px}
  .page-head .actions .btn-gray,.page-head .actions .btn-plain{font-size:0;width:40px;padding:0;gap:0}
  .page-head .actions .btn-gray .ic,.page-head .actions .btn-plain .ic{width:18px;height:18px}
  .page-head:has(.actions>:nth-child(4)){flex-wrap:wrap}
  .page-head:has(.actions>:nth-child(4)) .actions{flex-wrap:wrap;width:100%}
  .dash-client-head{flex-wrap:wrap}
  .dash-client-head h1{font-size:30px!important}
  /* numbers: one compact swipeable row */
  .kpis,.kpis.k4{display:flex;overflow-x:auto;gap:8px;margin-inline:-14px;padding:2px 14px 4px;scrollbar-width:none;grid-template-columns:none}
  .kpis::-webkit-scrollbar{display:none}
  .kpi{flex:0 0 auto;flex-direction:row;align-items:center;gap:10px;padding:10px 14px;border-radius:16px;min-height:0}
  .kpi b{order:-1;font-size:24px;margin:0}
  .kpi span{font-size:13px;line-height:1.2;max-width:120px}
  .kpi small{display:none}
  .client-kpis{gap:8px}
  .ck{padding:12px 14px;border-radius:16px;gap:2px}
  .ck b{font-size:22px}
  .ck small{font-size:12px}
  /* tables: only what you need first */
  .jobs-t th:nth-child(3),.jobs-t td:nth-child(3),.jobs-t th:nth-child(n+5),.jobs-t td:nth-child(n+5){display:none}
  .cl-t th:nth-child(2),.cl-t td:nth-child(2),.cl-t th:nth-child(n+6),.cl-t td:nth-child(n+6){display:none}
  .cl-t th:nth-child(3),.cl-t td:nth-child(3){display:none}
  .parts-t th:nth-child(2),.parts-t td:nth-child(2),.parts-t th:nth-child(n+5),.parts-t td:nth-child(n+5){display:none}
  .jobs-t,.cl-t,.parts-t{min-width:0}
  .jobs-t td:first-child,.cl-t td:first-child,.parts-t td:first-child{min-width:0}
  .parts-t td:nth-child(3){min-width:0}
  .jobs-t td,.cl-t td,.parts-t td{padding:12px 10px;white-space:normal}
  .table-wrap{overflow-x:visible}
  .detail-row td{display:table-cell!important}
}
@media (max-width:760px){
  .page-head:has(.actions>:nth-child(3)){flex-wrap:wrap}
  .page-head:has(.actions>:nth-child(3)) .actions{width:100%;justify-content:flex-start}
  .page-head:has(.actions>:nth-child(3)) .actions .btn-primary{margin-left:auto}
  .main>.banner{font-size:12.5px;padding:7px 12px;margin-bottom:12px;border-radius:12px}
}

/* v13.7 quieter sidebar */
.side-nav a{font-weight:400;font-size:15.5px}
.side-nav a.on{font-weight:500;background:color-mix(in srgb,var(--surface-2) 85%,var(--fg) 3%)}
.side-group{font-weight:500;font-size:12.5px;color:var(--fg-3);opacity:.85}
.side-nav a .count{background:none;color:var(--fg-3);font-weight:400;font-size:13px;min-width:0;padding:0 2px}
.side-nav a .count.hot{background:color-mix(in srgb,#C8FF3D 50%,transparent);color:#33450A;font-weight:600;min-width:22px;padding:0 7px;height:21px;border-radius:999px}
.tb-badge{background:color-mix(in srgb,#C8FF3D 55%,transparent);color:#33450A}
.count-pill{background:none;color:var(--fg-3);font-weight:500}
.cnt{font-size:14px;font-weight:500;color:var(--fg-3);font-variant-numeric:tabular-nums}

/* dashboard: today first, rest quieter */
.today-card{margin-bottom:16px}
.today-list{display:flex;flex-direction:column}
.today-row{display:flex;align-items:center;gap:14px;width:100%;text-align:left;border:0;border-top:1px solid var(--line);background:none;color:var(--fg);font:inherit;padding:14px 4px;cursor:pointer}
.today-row:first-child{border-top:0}
.today-row:hover{background:var(--surface-2);border-radius:12px}
.t-time{font-size:17px;font-weight:600;font-variant-numeric:tabular-nums;min-width:58px}
.t-main{flex:1;min-width:0}
.t-main strong{display:block;font-size:16.5px}
.t-main small{display:block;color:var(--fg-3);font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.side-notes{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.snote{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;color:var(--fg-2);background:color-mix(in srgb,var(--surface-2) 55%,var(--surface));border-radius:999px;padding:7px 14px;text-decoration:none}
.snote:hover{color:var(--fg);text-decoration:none;background:var(--surface-2)}
.snote b{font-size:15px;color:var(--fg);font-variant-numeric:tabular-nums}
/* activity, folded, on Jobs */
.act-fold{margin-bottom:14px;border-radius:16px;background:color-mix(in srgb,var(--surface-2) 50%,var(--surface))}
.act-fold>summary{display:flex;align-items:center;gap:9px;min-height:46px;padding:0 16px;cursor:pointer;list-style:none;font-size:14.5px;font-weight:600;color:var(--fg-2)}
.act-fold>summary::-webkit-details-marker{display:none}
.act-fold>summary .ic{color:var(--fg-3)}
.act-fold>summary .hint{margin-left:auto;font-weight:400}
.act-list{display:flex;flex-direction:column;padding:0 10px 10px}
.act{display:grid;grid-template-columns:150px minmax(0,1fr) 170px;gap:12px;align-items:baseline;border:0;background:none;text-align:left;font:inherit;font-size:13.5px;color:var(--fg-2);padding:7px 6px;border-radius:10px;cursor:pointer}
.act:hover{background:var(--surface-2)}
.act .a-t{color:var(--fg-3);font-variant-numeric:tabular-nums}
.act .a-m strong{color:var(--fg)}
.act .a-c{color:var(--fg-3);text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:760px){.act{grid-template-columns:minmax(0,1fr)}.act .a-c{text-align:left}.act .a-t{font-size:12.5px}}

/* inbox like mail */
.ib-t{align-items:flex-start;gap:10px;padding:12px 10px;border-radius:12px}
.ib-flag{flex:0 0 10px;padding-top:7px}
.ib-flag i{display:block;width:9px;height:9px;border-radius:50%;background:var(--tint)}
.ib-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ib-r1{display:flex;align-items:baseline;gap:10px}
.ib-r1 strong{font-size:15.5px;font-weight:500;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ib-r1 small{font-size:12.5px;color:var(--fg-3);white-space:nowrap}
.ib-subj{font-size:14px;color:var(--fg-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ib-prev{font-size:13.5px;color:var(--fg-3);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.35}
.ib-t.unread .ib-r1 strong{font-weight:700}
.ib-t.unread .ib-subj{color:var(--fg);font-weight:500}
.ib-threads{gap:2px}
.ib-htxt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ib-htxt strong{font-size:17px;letter-spacing:-.01em}
.ib-htxt small{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--fg-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ib-htxt .avatar{width:24px;height:24px;flex:0 0 24px;font-size:10px}

/* work bar in a job */
.workbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:14px 16px;border-radius:18px;background:color-mix(in srgb,var(--tint-soft) 45%,var(--surface));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--tint) 12%,transparent)}
.workbar.running{background:color-mix(in srgb,var(--bad-soft) 55%,var(--surface));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--bad) 20%,transparent)}
.wb-t{display:flex;flex-direction:column;gap:1px;flex:1 1 180px;min-width:0}
.wb-t b{font-size:26px;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1.15}
.workbar .btn{flex:0 0 auto}
/* warranty, folded away */
.w-fold{border-radius:16px;background:color-mix(in srgb,var(--surface-2) 60%,var(--surface));overflow:hidden}
.w-fold>summary{display:flex;align-items:center;gap:10px;min-height:52px;padding:0 16px;cursor:pointer;list-style:none;font-size:15.5px;font-weight:600}
.w-fold>summary::-webkit-details-marker{display:none}
.w-fold>summary:after{content:"";margin-left:auto;width:9px;height:9px;border-right:2px solid var(--fg-3);border-bottom:2px solid var(--fg-3);transform:rotate(45deg) translate(-2px,-2px);transition:transform .2s var(--ease)}
.w-fold[open]>summary:after{transform:rotate(225deg) translate(-1px,-1px)}
.wf-t{display:flex;align-items:center;gap:8px}
.wf-t .ic{color:var(--fg-3)}
.wf-h{font-weight:400}
.wf-body{padding:4px 16px 16px;display:flex;flex-direction:column;gap:12px}
.wf-body .w-block{background:none;padding:0}
.wf-chk{font-weight:500}
.wf-body .form input,.wf-body .form select{background:var(--surface)}
.rate-note{background:color-mix(in srgb,var(--surface-2) 55%,var(--surface));border-radius:10px;padding:8px 12px}

/* start work, always in reach */
.work-btn{flex:0 0 auto;white-space:nowrap}
.work-btn .num{font-variant-numeric:tabular-nums}
.sheet-head{gap:8px;flex-wrap:wrap}
.sheet-head h2{flex:1 1 160px}
@media (max-width:600px){.sheet-head{padding:12px 12px 10px 16px}.work-btn{order:3}}

/* v13.8 softer sidebar, month strip, parts picking */
.sidebar{background:color-mix(in srgb,var(--surface) 92%,transparent)!important;box-shadow:0 1px 2px rgba(0,0,0,.03)}
.side-nav a{color:var(--fg-2);font-weight:400}
.side-nav a .ic{color:var(--fg-3);opacity:.9}
.side-nav a:hover{background:color-mix(in srgb,var(--surface-2) 55%,transparent);color:var(--fg)}
.side-nav a.on{background:color-mix(in srgb,var(--surface-2) 70%,transparent);color:var(--fg);font-weight:500}
.side-nav a.on .ic{color:var(--tint);opacity:1}
.side-group{color:var(--fg-3);opacity:.6;font-weight:500;letter-spacing:.02em}
.side-nav a .count{color:var(--fg-3);opacity:.75}
.side-nav a .count.hot{background:color-mix(in srgb,#C8FF3D 28%,transparent);color:#4A5D1E;font-weight:500}
.tb-badge{background:color-mix(in srgb,#C8FF3D 34%,transparent);color:#4A5D1E}
.side-head .admin-pill{background:color-mix(in srgb,#C8FF3D 32%,transparent);color:#4A5D1E;font-weight:600}
.side-search{background:color-mix(in srgb,var(--surface-2) 55%,transparent);color:var(--fg-3)}
.side-foot{border-top-color:color-mix(in srgb,var(--line) 60%,transparent)}
/* month strip */
.month-strip{display:flex;gap:10px;margin:0 0 16px;flex-wrap:wrap}
.mstrip{flex:1 1 150px;display:flex;flex-direction:column;gap:1px;background:var(--surface);border-radius:16px;padding:12px 16px;text-decoration:none;color:var(--fg);box-shadow:0 1px 2px rgba(0,0,0,.03);min-width:0}
.mstrip:hover{text-decoration:none;background:color-mix(in srgb,var(--tint-soft) 30%,var(--surface))}
.mstrip span{font-size:13px;color:var(--fg-2);font-weight:500}
.mstrip b{font-size:22px;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.mstrip small{font-size:12px;color:var(--fg-3)}
/* parts picking in a job */
.part{grid-template-columns:28px minmax(0,1fr) 72px 128px 40px;align-items:center;gap:8px}
.part.picked{background:color-mix(in srgb,var(--tint-soft) 40%,transparent);border-radius:12px;padding:4px 6px;margin:0 -6px}
.part-tick{display:grid;place-items:center}
.part-tick input{width:20px;height:20px;min-height:0;accent-color:var(--tint)}
.part-sel{min-height:40px;font-size:13.5px}
.part-st{grid-column:2/-1;font-size:12.5px;color:var(--fg-3);margin-top:-4px}
.part-order{grid-column:1/-1;display:flex;flex-direction:column;gap:6px;background:color-mix(in srgb,var(--surface-2) 60%,var(--surface));border-radius:14px;padding:12px 14px;margin-top:4px}
.po-row{display:flex;gap:8px;flex-wrap:wrap}
.po-row input{flex:1 1 150px;min-height:42px;background:var(--surface)!important}
.st-inline{min-height:36px;padding:0 26px 0 10px;border-radius:999px;font-weight:600;font-size:13px;background:var(--surface-2)!important;width:auto}
@media (max-width:600px){.part{grid-template-columns:28px minmax(0,1fr) 60px 40px}.part .part-sel{grid-column:2/-1}}

/* request triage */
.wr-stage{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 12px}
.stg{display:inline-flex;align-items:center;gap:6px;min-height:38px;padding:0 16px;border-radius:999px;border:0;background:color-mix(in srgb,var(--surface-2) 65%,var(--surface));color:var(--fg-2);font:inherit;font-size:14px;font-weight:600;cursor:pointer}
.stg:hover{background:var(--surface-2);color:var(--fg)}
.stg.on{background:var(--tint);color:var(--on-tint)}
.book-box{background:color-mix(in srgb,var(--tint-soft) 35%,var(--surface));border-radius:16px;padding:16px;margin-bottom:12px}
.book-box input,.book-box select{background:var(--surface)!important}

/* v13.9 dashboard numbers: icon says what, colour says who waits */
.kpi{position:relative;flex-direction:row;align-items:center;gap:12px;padding:16px 18px}
.kpi .kic{flex:0 0 36px;width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:var(--surface-2);color:var(--fg-2)}
.kpi .klab{flex:1;min-width:0;font-size:13.5px;font-weight:600;color:var(--fg-2);line-height:1.25}
.kpi b{order:3;font-size:30px;margin-left:auto}
.kpi.k-info .kic{background:color-mix(in srgb,var(--info) 14%,var(--surface));color:var(--info)}
.kpi.k-ok .kic{background:color-mix(in srgb,#8CC400 18%,var(--surface));color:#5E8400}
.kpi.k-warn .kic{background:color-mix(in srgb,var(--warn) 15%,var(--surface));color:var(--warn)}
.kpi.k-warn b{color:var(--warn)}
@media (max-width:760px){
  .kpi{padding:10px 12px;gap:8px}
  .kpi .kic{flex:0 0 28px;width:28px;height:28px;border-radius:9px}
  .kpi .klab{font-size:12.5px;max-width:110px}
  .kpi b{font-size:22px}
}

/* v14.0 stage-based job drawer + calmer client dashboard */
.next-step{border:1px solid color-mix(in srgb,var(--info) 24%,var(--line));background:color-mix(in srgb,var(--info) 6%,var(--surface));border-radius:16px;padding:16px}
.ns-head{display:flex;flex-direction:column;gap:2px;margin-bottom:12px}
.ns-head strong{font-size:17px;letter-spacing:-.01em}
.next-step .hint{margin-top:10px;display:block}

.ck-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0 0 14px}
.ck-row .ck{min-height:0}
.ck-row .ck b{font-size:clamp(22px,2.4vw,30px)}
@media (max-width:900px){.ck-row{grid-template-columns:repeat(2,minmax(0,1fr))}}

.more-stats{border:1px solid var(--line);border-radius:14px;background:var(--surface);margin:0 0 16px}
.more-stats>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:9px;padding:12px 16px;font-size:14px;font-weight:600;color:var(--fg-2)}
.more-stats>summary::-webkit-details-marker{display:none}
.more-stats>summary .hint{margin-left:auto;font-weight:400}
.more-stats>summary svg{color:var(--fg-3)}
.more-stats[open]>summary{border-bottom:1px solid var(--line)}
.ms-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:2px;padding:2px;background:var(--line)}
.msv{background:var(--surface);padding:12px 16px;display:flex;flex-direction:column;gap:3px}
.msv span{font-size:12px;color:var(--fg-3);letter-spacing:.01em}
.msv b{font-size:19px;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.dash-client-head .actions{gap:8px;flex-wrap:wrap}

/* v14.1 client scope, inbox bar, request read state */
.scope-bar{display:flex;align-items:center;gap:10px;padding:9px 14px;margin:0 0 14px;border:1px solid color-mix(in srgb,var(--info) 22%,var(--line));background:color-mix(in srgb,var(--info) 6%,var(--surface));border-radius:12px;font-size:14px;color:var(--fg-2)}
.scope-bar svg{color:var(--fg-3)}
.scope-bar strong{color:var(--fg)}
.scope-bar .btn{margin-left:auto}
.ck-row button.ck{text-align:left;border:0;font:inherit;cursor:pointer;transition:transform .14s ease,box-shadow .14s ease}
.ck-row button.ck:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(16,32,48,.08)}
.ck-row button.ck:focus-visible{outline:2px solid var(--tint);outline-offset:2px}
.ib-bar{display:flex;align-items:center;gap:10px}
.ib-bar .ib-new{margin-left:auto;flex:none}
.tone-lime{background:color-mix(in srgb,#C8FF3D 30%,transparent);color:#4A5D1E}
.wr.unread{border-color:color-mix(in srgb,#C8FF3D 45%,var(--line))}
.wr-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:color-mix(in srgb,#C8FF3D 75%,#8AA82A);margin-right:7px;vertical-align:middle}
.wr-booked{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:10px 0 0;padding:10px 12px;border-radius:11px;background:color-mix(in srgb,var(--ok) 7%,var(--surface-2));color:var(--fg-2);font-size:14px}
.wr-booked svg{color:var(--ok)}
.wr-booked a{margin-left:auto}

/* v14.2 back link, job drawer header, new appliance inline */
.crumb.back-link{background:none;border:0;cursor:pointer;font:inherit;padding:0;display:inline-flex;align-items:center;gap:4px;color:var(--fg-3);font-size:13px;font-weight:500;margin-bottom:6px}
.crumb.back-link:hover{color:var(--tint)}
.jd-who{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.jdw-c{background:var(--surface-2);border-radius:14px;padding:13px 15px;display:flex;flex-direction:column;gap:3px;min-width:0}
.jdw-c strong{font-size:16px;letter-spacing:-.01em}
.jdw-c a{text-decoration:none}
.jdw-contact{display:flex;flex-direction:column;gap:2px;margin-top:5px}
.jdw-c .hint{margin:2px 0 0}
@media (max-width:720px){.jd-who{grid-template-columns:1fr}}
.new-appl{border:1px dashed color-mix(in srgb,var(--tint) 35%,var(--line));border-radius:14px;padding:14px;background:color-mix(in srgb,var(--tint) 4%,var(--surface))}
.new-appl .section-title{display:block;margin-bottom:10px}

/* v14.3 jobs grouped by what they wait for */
.jobs-groups{display:flex;flex-direction:column;gap:20px}
.jg-h{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--fg-3);margin:0 0 8px 2px}
.jg-h .cnt{background:var(--surface-2);color:var(--fg-2);border-radius:999px;padding:1px 8px;font-size:12px;letter-spacing:0;text-transform:none}
.jg-rows{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.jrow{display:grid;grid-template-columns:minmax(0,2.1fr) 92px minmax(0,1fr) 72px minmax(0,auto);align-items:center;gap:14px;padding:12px 16px;background:none;border:0;border-top:1px solid var(--line);font:inherit;text-align:left;cursor:pointer;width:100%}
.jrow:first-child{border-top:0}
.jrow:hover{background:var(--surface-2)}
.jrow.urgent{box-shadow:inset 3px 0 0 var(--bad)}
.jr-main{display:flex;flex-direction:column;gap:2px;min-width:0}
.jr-main strong{font-size:15px;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jr-main small,.jr-when small{color:var(--fg-3);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jr-when{display:flex;flex-direction:column;gap:1px;font-variant-numeric:tabular-nums}
.jr-when b{font-size:13.5px;font-weight:600}
.jr-tech{display:flex;align-items:center;gap:7px;font-size:13.5px;color:var(--fg-2);min-width:0}
.jr-time{font-size:13px;color:var(--fg-3);font-variant-numeric:tabular-nums;display:flex;align-items:center;gap:6px}
.jr-st{display:flex;align-items:center;gap:6px;justify-content:flex-end;flex-wrap:wrap}
.view-sw{margin-left:auto}
@media (max-width:860px){
  .jrow{grid-template-columns:minmax(0,1fr) auto;gap:6px 12px}
  .jr-when{grid-row:2;grid-column:1}
  .jr-tech{grid-row:2;grid-column:2;justify-content:flex-end}
  .jr-time{display:none}
  .jr-st{grid-row:1;grid-column:2}
}
.jr-when{align-items:flex-start;text-align:left}
.jr-tech,.jr-time{justify-content:flex-start}
.jrow{grid-template-columns:minmax(0,2.1fr) 112px minmax(0,1fr) 68px minmax(0,auto)}
.jr-when b,.jr-when small{white-space:nowrap}

/* v14.4 appliances as cards, grouped by client */
.appl-groups{display:flex;flex-direction:column;gap:20px}
.jg-h .jg-note{font-size:12px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--warn)}
.jg-h .btn-plain{margin-left:auto;letter-spacing:0;text-transform:none}
.aprow{display:grid;grid-template-columns:40px minmax(0,1.8fr) minmax(0,1.3fr) 128px auto;align-items:center;gap:14px;padding:12px 16px;background:none;border:0;border-top:1px solid var(--line);font:inherit;text-align:left;cursor:pointer;width:100%}
.aprow:first-child{border-top:0}
.aprow:hover{background:var(--surface-2)}
.ap-ic{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:var(--surface-2);color:var(--fg-3)}
.ap-main,.ap-who{display:flex;flex-direction:column;gap:2px;min-width:0}
.ap-main strong{font-size:15px;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ap-main small,.ap-who small{font-size:12.5px;color:var(--fg-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ap-who span{font-size:13.5px;color:var(--fg-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ap-jobs{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap;font-size:13px;color:var(--fg-3)}
.ap-jobs b{font-size:15px;color:var(--fg);font-variant-numeric:tabular-nums}
.ap-jobs em{font-style:normal;color:var(--info);font-weight:600}
.ap-jobs small{width:100%;font-size:12px}
.ap-w{justify-self:end}
@media (max-width:860px){
  .aprow{grid-template-columns:36px minmax(0,1fr) auto;gap:6px 12px}
  .ap-who{grid-column:2;grid-row:2}
  .ap-jobs{display:none}
  .ap-w{grid-column:3;grid-row:1/3}
}
.ap-jobs{justify-content:flex-start;align-content:center}
.ap-jobs{display:flex;flex-direction:column;align-items:flex-start;gap:1px}
.ap-jobs b{font-size:13.5px;font-weight:500;color:var(--fg-2)}
.ap-jobs b.hint{color:var(--fg-3)}
.aprow{grid-template-columns:40px minmax(0,1.8fr) minmax(0,1.3fr) 118px 152px}
@media (max-width:860px){.aprow{grid-template-columns:36px minmax(0,1fr) auto}}

/* v14.5 monthly report that scales to many machines */
.rep-search{max-width:none;margin:0 0 10px}
.mrows{display:flex;flex-direction:column}
.mrow{display:grid;grid-template-columns:32px minmax(0,1.5fr) minmax(0,1fr) 72px;align-items:center;gap:12px;padding:9px 0;border-top:1px solid var(--line)}
.mrow:first-child{border-top:0}
.m-ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:var(--surface-2);color:var(--fg-3)}
.m-main{display:flex;flex-direction:column;gap:1px;min-width:0}
.m-main strong{font-size:14px;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.m-main small{font-size:12px;color:var(--fg-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.m-bar{height:7px;border-radius:999px;background:var(--surface-2);overflow:hidden}
.m-bar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,color-mix(in srgb,var(--tint) 70%,transparent),color-mix(in srgb,#C8FF3D 55%,var(--tint)))}
.m-v{font-size:13px;font-variant-numeric:tabular-nums;color:var(--fg-2);text-align:right}
.aprow.rep-r{cursor:default}
.aprow.rep-r:hover{background:none}
@media (max-width:720px){.mrow{grid-template-columns:30px minmax(0,1fr) 68px}.m-bar{display:none}}
.rep-kpis .kpi.static{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:16px 18px}
.rep-kpis .kpi.static span{font-size:12.5px;color:var(--fg-3);order:0}
.rep-kpis .kpi.static b{order:1;font-size:28px;line-height:1.1;letter-spacing:-.02em}
.rep-kpis .kpi.static small{order:2;font-size:12px;color:var(--fg-3)}

/* v14.6 client picker: the search box must not stretch to 260px tall */
.pick-wrap{display:flex;flex-direction:column;gap:8px}
.pick-wrap .search-in,.field .search-in,.sheet .search-in{flex:0 0 auto;max-width:none}
.pick-wrap .pick-list{max-height:260px;overflow:auto}

/* v14.7 compact status control */
.stc2{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 2px}
.stc2-flow{display:flex;gap:4px;flex-wrap:wrap;background:var(--surface-2);padding:4px;border-radius:12px}
.stc2 .s2{display:inline-flex;align-items:center;gap:5px;border:0;background:none;font:inherit;font-size:13px;font-weight:500;color:var(--fg-3);padding:6px 11px;border-radius:9px;cursor:pointer;white-space:nowrap}
.stc2 .s2:hover{color:var(--fg);background:var(--surface)}
.stc2 .s2.past{color:var(--ok)}
.stc2 .s2.past svg{opacity:.8}
.stc2 .s2.on{background:var(--tint);color:#fff;font-weight:600;box-shadow:0 1px 3px rgba(16,32,48,.14)}
.stc2 .s2.on:hover{background:var(--tint)}
.stc2-other{flex:0 0 auto;width:auto;min-width:120px;font-size:13px;padding:7px 30px 7px 12px;min-height:0;height:auto}
.stc2-other.on{border-color:var(--warn);color:var(--warn);font-weight:600}
@media (max-width:620px){.stc2-flow{width:100%;overflow:auto;flex-wrap:nowrap}.stc2-other{width:100%}}

/* v14.8 phone mockup moved from the landing page to the Portal page */
.portal-pocket{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:clamp(24px,5vw,64px);margin-top:clamp(40px,6vw,72px)}
.portal-pocket .pp-txt h2{font-size:clamp(28px,3.6vw,44px);line-height:1.08;letter-spacing:-.02em;margin:10px 0 12px}
.portal-pocket .pp-txt p{font-size:17px;color:var(--fg-2);max-width:42ch;margin:0 0 20px}
.portal-pocket .phone{margin:0}
@media (max-width:860px){.portal-pocket{grid-template-columns:1fr;justify-items:center;text-align:center}.portal-pocket .pp-txt p{margin-inline:auto}.portal-pocket .actions{justify-content:center}}

/* v14.9 yearly money chart — quiet by design */
.ychart{padding:18px 20px 16px}
.ychart .card-head{margin-bottom:2px}
.yc-top{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:2px 0 10px}
.yc-top b{font-size:clamp(26px,3vw,34px);letter-spacing:-.025em;font-variant-numeric:tabular-nums}
.yc-sub{font-size:13px;color:var(--fg-3)}
.yc-sub strong{color:var(--fg-2);font-variant-numeric:tabular-nums}
.yc-plot{position:relative}
.yc-plot svg{display:block;width:100%;height:132px;overflow:visible}
.yc-g0{stop-color:var(--tint);stop-opacity:.20}
.yc-g1{stop-color:var(--tint);stop-opacity:.015}
.yc-line{stroke:var(--tint);opacity:.75}
.yc-dot{fill:var(--surface);stroke:var(--tint);stroke-width:2}
.yc-cross{stroke:var(--fg-3);stroke-width:1;stroke-dasharray:3 3;opacity:.45}
.yc-axis{display:grid;grid-template-columns:repeat(12,1fr);margin-top:6px}
.yc-axis span{font-size:11px;color:var(--fg-3);text-align:center;letter-spacing:.02em}
.yc-axis span.on{color:var(--fg-2);font-weight:600}
.yc-foot{display:flex;gap:26px;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.yc-foot span{display:flex;flex-direction:column;gap:2px;font-size:12px;color:var(--fg-3)}
.yc-foot b{font-size:14px;font-weight:600;color:var(--fg-2);font-variant-numeric:tabular-nums}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .yc-g0{stop-opacity:.26}:root:not([data-theme="light"]) .yc-line{opacity:.9}}
:root[data-theme="dark"] .yc-g0{stop-opacity:.26}
:root[data-theme="dark"] .yc-line{opacity:.9}

/* v15.0 website requests: name first, issue second, steps numbered */
.wr-top{align-items:flex-start}
.wr-id{display:flex;flex-direction:column;gap:2px;min-width:0}
.wr-id h3{margin:0;font-size:19px;letter-spacing:-.015em}
.wr-id .wr-dot{margin:0 0 2px}
.wr-id .hint{font-size:12.5px;letter-spacing:.01em}
.wr .wr-issue{font-size:15.5px;color:var(--fg);background:var(--surface-2);border-radius:12px;padding:12px 14px;margin:12px 0 14px}
.wr-grid .lbl{font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--fg-3)}
.wr-grid p{margin:3px 0 0;font-size:14px}
.wr-grid .hint{font-size:12px}
.wr-stage{align-items:center;gap:8px}
.wr-sl{font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--fg-3);margin-right:2px}
.wr-stage .stg{display:inline-flex;align-items:center;gap:7px}
.wr-stage .stg-n{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:600;background:var(--surface-2);color:var(--fg-3)}
.wr-stage .stg.past{color:var(--ok)}
.wr-stage .stg.past .stg-n{background:color-mix(in srgb,var(--ok) 16%,transparent);color:var(--ok)}
.wr-stage .stg.on .stg-n{background:rgba(255,255,255,.22);color:#fff}
.ib-who{font-style:normal;font-weight:600;color:var(--fg-2)}

/* v15.1 appliances fold per client */
.jg-fold .jg-h{margin:0;gap:0}
.jg-tog{display:flex;align-items:center;gap:9px;flex:1;min-width:0;background:none;border:0;font:inherit;font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--fg-3);padding:10px 2px;cursor:pointer;text-align:left}
.jg-tog:hover{color:var(--fg-2)}
.jg-tog .jg-nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jg-caret{display:grid;place-items:center;color:var(--fg-3);transition:transform .16s ease}
.jg-fold.on .jg-caret{transform:rotate(90deg)}
.jg-fold.on .jg-tog{color:var(--fg)}
.jg-fold+.jg-fold{margin-top:-10px}
.jg-fold .jg-rows{margin-top:2px}
.fold-all{margin-left:auto}
.view-sw{margin-left:8px}

/* v15.2 Excel import: one line per sheet */
.im-sheets{display:flex;flex-direction:column;gap:8px}
.im-sh{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:11px;background:var(--surface);font-size:13.5px;color:var(--fg-2)}
.im-sh.bad{background:color-mix(in srgb,var(--warn) 8%,var(--surface))}
.im-shn{display:flex;align-items:center;gap:7px;font-weight:600;color:var(--fg)}
.im-sh svg{color:var(--ok)}
.im-sh.bad svg{color:var(--warn)}
.im-sh .hint{font-size:12px}

/* v15.3 invoice baskets */
.inv-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin-bottom:8px}
.inv-card{display:flex;flex-direction:column;gap:4px;text-align:left;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:var(--surface);font:inherit;cursor:pointer}
.inv-card:hover{border-color:color-mix(in srgb,var(--tint) 40%,var(--line))}
.inv-card.sent{background:color-mix(in srgb,var(--info) 4%,var(--surface))}
.ic-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.ic-top strong{font-size:15px;font-variant-numeric:tabular-nums}
.ic-cl{font-size:14px;color:var(--fg-2)}
.ic-n{font-size:12.5px;color:var(--fg-3)}
.ic-amt{font-size:20px;font-weight:600;letter-spacing:-.02em;font-variant-numeric:tabular-nums;margin-top:4px}
.inv-lines{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:13px;overflow:hidden;margin-top:8px}
.inv-line{display:flex;align-items:center;gap:10px;padding:10px 12px;border-top:1px solid var(--line)}
.inv-line:first-child{border-top:0}
.inv-line.extra{background:var(--surface-2)}
.il-main{display:flex;flex-direction:column;gap:1px;flex:1;min-width:0}
.il-main strong{font-size:14.5px}
.il-main small{font-size:12px;color:var(--fg-3)}
.il-amt{font-variant-numeric:tabular-nums;font-weight:600}
.io-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.io-row input{flex:1 1 160px;min-width:0}
.io-row input[type=number]{flex:0 0 120px}
.inv-total{display:flex;align-items:baseline;justify-content:space-between;padding:14px 16px;border-radius:13px;background:var(--surface-2);margin-top:12px}
.inv-total b{font-size:26px;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.jrow.pickable{grid-template-columns:28px minmax(0,2.1fr) 112px minmax(0,1fr) 68px minmax(0,auto)}
.jr-chk{display:grid;place-items:center}
.jrow.picked{background:color-mix(in srgb,var(--tint) 7%,var(--surface))}

/* v15.4 cost approvals: sent / approved / declined */
.kpi.on{box-shadow:inset 0 0 0 2px var(--tint)}
.via-sum{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}
.via-chip{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--fg-2);background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:5px 12px}
.via-chip svg{color:var(--fg-3)}
.appr-rows{display:flex;flex-direction:column}
.appr-row{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) 120px auto;align-items:center;gap:14px;padding:13px 16px;background:none;border:0;border-top:1px solid var(--line);font:inherit;text-align:left;cursor:pointer;width:100%}
.appr-row:first-child{border-top:0}
.appr-row:hover{background:var(--surface-2)}
.ar-main,.ar-via{display:flex;flex-direction:column;gap:2px;min-width:0}
.ar-main strong{font-size:15px;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ar-main small,.ar-via small{font-size:12.5px;color:var(--fg-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ar-via{font-size:13.5px;color:var(--fg-2)}
.ar-via svg{color:var(--fg-3);vertical-align:-3px;margin-right:6px}
.ar-amt{font-weight:600;font-variant-numeric:tabular-nums}
.ar-st{justify-self:end}
@media (max-width:820px){.appr-row{grid-template-columns:minmax(0,1fr) auto}.ar-via{grid-row:2;grid-column:1}.ar-amt{grid-row:2;grid-column:2;justify-self:end}}
.rep-kpis .kpi{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:16px 18px;text-align:left}
.rep-kpis .kpi span{font-size:12.5px;color:var(--fg-3);order:0}
.rep-kpis .kpi b{order:1;font-size:28px;line-height:1.1;letter-spacing:-.02em}
.rep-kpis .kpi small{order:2;font-size:12px;color:var(--fg-3)}

/* v15.5 website request flow boxes */
.wr.off{opacity:.62}
.wr-note{display:flex;align-items:center;gap:8px;margin:10px 0 0;padding:10px 12px;border-radius:11px;background:var(--surface-2);font-size:14px;color:var(--fg-2)}
.wr-note svg{color:var(--fg-3);flex:none}
.wr-stage .stg svg{opacity:.8}
.wr-stage .stg.stg-off{color:var(--fg-3)}
.wr-stage .stg.stg-off.on{background:var(--fg-3);color:#fff}
.wait-pick{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.wr.unread .wr-id h3{font-weight:800}
.wr.unread .wr-issue{color:var(--fg);font-weight:500}
.wr:not(.unread) .wr-id h3{font-weight:600;color:var(--fg-2)}

/* v15.6 dashboard: month, started jobs, paid vs unpaid */
.dash-month{margin-bottom:12px}
.month-strip.m4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:900px){.month-strip.m4{grid-template-columns:repeat(2,minmax(0,1fr))}}
.started-card{padding:18px 20px}
.st-rows{display:flex;flex-direction:column;margin-top:4px}
.st-row{display:grid;grid-template-columns:34px minmax(0,1fr) 44px 110px;align-items:center;gap:12px;padding:11px 2px;background:none;border:0;border-top:1px solid var(--line);font:inherit;text-align:left;cursor:pointer;width:100%}
.st-row:first-child{border-top:0}
.st-row:hover .st-l{color:var(--tint)}
.st-ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:var(--surface-2);color:var(--fg-3)}
.st-row.stt-warn .st-ic{background:var(--warn-soft);color:var(--warn)}
.st-row.stt-ok .st-ic{background:var(--ok-soft);color:var(--ok)}
.st-row.stt-info .st-ic{background:var(--info-soft);color:var(--info)}
.st-row.stt-violet .st-ic{background:color-mix(in srgb,var(--info) 12%,var(--surface-2));color:var(--info)}
.st-l{font-size:14.5px;color:var(--fg-2)}
.st-row b{font-size:19px;font-variant-numeric:tabular-nums;text-align:right}
.st-v{font-size:13px;color:var(--fg-3);font-variant-numeric:tabular-nums;text-align:right}
.today-new{padding:18px 20px}
.yc-legend{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--fg-3);flex-wrap:wrap}
.yc-legend .lg{width:10px;height:10px;border-radius:3px;display:inline-block;margin-left:8px}
.yc-legend .lg:first-child{margin-left:0}
.yc-legend .lg.paid{background:var(--ok)}
.yc-legend .lg.open{background:color-mix(in srgb,var(--warn) 70%,var(--surface))}
.yc-bars{display:grid;grid-template-columns:repeat(12,1fr);align-items:end;gap:6px;height:150px;margin-top:6px}
.ycb{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;background:none;border:0;font:inherit;cursor:pointer;height:150px;padding:0}
.ycb-stack{width:100%;max-width:38px;display:flex;flex-direction:column;justify-content:flex-end;border-radius:5px;overflow:hidden;background:var(--surface-2);flex:none}
.ycb-stack .seg{display:block;width:100%}
.ycb-stack .seg.open{background:color-mix(in srgb,var(--warn) 70%,var(--surface));border-bottom:2px solid var(--surface)}
.ycb-stack .seg.paid{background:var(--ok)}
.ycb-l{font-size:11px;color:var(--fg-3)}
.ycb.on .ycb-l{color:var(--fg-2);font-weight:600}
.ycb:hover .ycb-stack{filter:brightness(1.06)}
.ychart .yc-foot span{flex-direction:row;align-items:baseline;gap:6px}

/* v15.7 new job: two kinds, fewer fields */
.kind-pick{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:4px}
.kp{display:flex;align-items:center;gap:11px;padding:13px 14px;border:1px solid var(--line);border-radius:14px;background:var(--surface);font:inherit;text-align:left;cursor:pointer}
.kp span{display:flex;flex-direction:column;gap:1px;min-width:0}
.kp strong{font-size:14.5px}
.kp small{font-size:12px;color:var(--fg-3)}
.kp svg{color:var(--fg-3);flex:none}
.kp.on{border-color:var(--tint);background:color-mix(in srgb,var(--tint) 7%,var(--surface))}
.kp.on svg{color:var(--tint)}
@media (max-width:520px){.kind-pick{grid-template-columns:1fr}}

/* v15.8 sending an estimate */
.est-send{margin-top:12px}
.send-ways{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.chase{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:12px;background:var(--warn-soft);color:var(--warn);font-size:14px;margin:0 0 14px}
.chase svg{flex:none;margin-top:1px}
.chase strong{color:inherit}
.part{grid-template-columns:28px minmax(0,1fr) 62px 86px 112px 36px}
@media (max-width:620px){.part{grid-template-columns:28px minmax(0,1fr) 36px}.part input[type=number]{grid-column:2/4}}

/* v15.9 earnings */
.earn-t td:first-child{font-size:14.5px}
.earn-t .sub{display:block;font-size:12px;color:var(--fg-3);margin-top:2px}
.earn-t .num{font-variant-numeric:tabular-nums}
.earn-mid td{background:var(--surface-2)}
.earn-tot td{border-top:2px solid var(--line);font-weight:600}
.paid-bar{height:12px;border-radius:999px;background:color-mix(in srgb,var(--warn) 55%,var(--surface));overflow:hidden}
.paid-bar .pb-fill{display:block;height:100%;background:var(--ok);border-radius:999px}
.paid-legend{display:flex;gap:18px;margin-top:8px;font-size:13px;color:var(--fg-2)}
.paid-legend .lg{width:10px;height:10px;border-radius:3px;display:inline-block;margin-right:7px}
.paid-legend .lg.paid{background:var(--ok)}
.paid-legend .lg.open{background:color-mix(in srgb,var(--warn) 55%,var(--surface))}
.hint.warn{color:var(--warn)}
.earn-t th{padding:12px 14px}
.earn-t td{padding:12px 14px}

/* v16.0 portal: the report you just sent, on top */
.fresh-hero{border:1px solid color-mix(in srgb,var(--ok) 28%,var(--line));background:color-mix(in srgb,var(--ok) 6%,var(--surface));border-radius:18px;padding:18px 20px;margin-bottom:16px}
.fresh-hero h2{display:flex;align-items:center;gap:9px;font-size:18px;margin:0 0 12px}
.fresh-hero h2 svg{color:var(--ok)}
.fh-row{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:11px 0;border-top:1px solid color-mix(in srgb,var(--ok) 16%,var(--line))}
.fh-row:first-of-type{border-top:0}
.fh-main{display:flex;flex-direction:column;gap:2px;min-width:0}
.fh-main strong{font-size:16px}
.fh-main small,.fh-st small{font-size:12.5px;color:var(--fg-3)}
.fh-st{display:flex;flex-direction:column;align-items:flex-end;gap:3px}
.fresh-hero .hint{margin:12px 0 0}
.pick-h{font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--fg-3);padding:10px 12px 4px;margin:0}
.picked svg{color:var(--fg-3)}

/* v16.1 time by hand, ordering a part, office answer */
.mins-row{display:flex;align-items:center;gap:8px}
.mins-row input{flex:1;min-width:0}
.quick-mins{display:flex;gap:6px;flex-wrap:wrap}
.qm{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:6px 12px;font:inherit;font-size:13px;color:var(--fg-2);cursor:pointer}
.qm:hover{border-color:var(--tint);color:var(--tint)}
.qm.on{background:var(--tint);border-color:var(--tint);color:#fff;font-weight:600}
.appr-actions.office{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.appr-actions.office .hint{margin-right:2px}

/* v16.2 website request: one clean step bar */
.wr-steps{margin-top:14px}
.wr-steps .wr-sl{display:block;margin-bottom:7px}
.wr-seg{display:grid;grid-template-columns:repeat(6,1fr);gap:3px;padding:3px;background:var(--surface-2);border-radius:13px}
.ws{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:9px 4px;border:0;border-radius:10px;background:none;font:inherit;font-size:12.5px;font-weight:500;color:var(--fg-3);cursor:pointer;min-width:0}
.ws span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.ws svg{opacity:.75}
.ws:hover{background:var(--surface);color:var(--fg)}
.ws.on{background:var(--tint);color:#fff;font-weight:600;box-shadow:0 1px 3px rgba(16,32,48,.16)}
.ws.on svg{opacity:1}
.ws.ws-off.on{background:var(--fg-3)}
@media (max-width:760px){.wr-seg{grid-template-columns:repeat(3,1fr)}}

/* v16.3 calendar: quieter grid, clearer hours */
.dv-col{background-image:repeating-linear-gradient(to bottom,color-mix(in srgb,var(--line) 70%,transparent) 0 1px,transparent 1px calc(var(--hh) / 2),color-mix(in srgb,var(--line) 35%,transparent) calc(var(--hh) / 2) calc(var(--hh) / 2 + 1px),transparent calc(var(--hh) / 2 + 1px) var(--hh))}
.dv-gut span{transform:translateY(-7px);font-size:11.5px;letter-spacing:.02em;background:var(--surface);padding:0 2px}
.now-line{height:0;border-top:2px solid color-mix(in srgb,var(--bad) 70%,transparent);opacity:.8}
.now-line::before{content:'';position:absolute;left:-4px;top:-4px;width:7px;height:7px;border-radius:50%;background:var(--bad)}
.dv-head{padding:10px 12px;font-size:13.5px}
.dv-head b{font-size:14px}
.dv-ev .cc{border-radius:10px;padding:7px 9px}
.cc-time{font-size:12.5px}
.cc-who{font-size:13.5px;line-height:1.25}
.cc-what,.cc-where{font-size:12px}
.cc.compact .cc-what,.cc.compact .cc-where{display:none}
.wk-card,.mv-day{border-radius:12px}

/* v16.4 invoice drafts + chart on brand colours */
.draft-tag{display:inline-block;font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--warn);background:var(--warn-soft);border-radius:5px;padding:2px 6px;margin-right:8px;vertical-align:2px}
.inv-card.is-draft{border-style:dashed;border-color:color-mix(in srgb,var(--warn) 45%,var(--line));background:color-mix(in srgb,var(--warn) 4%,var(--surface))}
.yc-legend .lg.paid{background:var(--tint)}
.yc-legend .lg.open{background:color-mix(in srgb,var(--tint) 26%,var(--surface))}
.ycb-stack .seg.paid{background:var(--tint)}
.ycb-stack .seg.open{background:color-mix(in srgb,var(--tint) 26%,var(--surface));border-bottom:2px solid var(--surface)}
.yc-foot b{color:var(--fg)}

/* v16.6 calendar in Arctia colours */
.cc{border-radius:12px;box-shadow:inset 3px 0 0 var(--ev),0 1px 2px rgba(16,32,48,.06)}
.cc:hover{box-shadow:inset 3px 0 0 var(--ev),0 6px 16px rgba(16,32,48,.10)}
.cc.g-todo{background:color-mix(in srgb,var(--cal-todo) 9%,var(--surface))}
.cc.g-doing{background:color-mix(in srgb,var(--cal-doing) 16%,var(--surface))}
.cc.g-done{background:var(--surface-2);opacity:.78}
.cc.urgent{box-shadow:inset 3px 0 0 var(--bad),0 1px 2px rgba(16,32,48,.06)}
.cc-st{color:var(--fg-3);font-weight:500}
.cc.g-doing .cc-st{color:color-mix(in srgb,var(--cal-doing) 60%,var(--fg-2));font-weight:600}
.mv-ev{box-shadow:inset 3px 0 0 var(--ev);background:color-mix(in srgb,var(--ev) 12%,var(--surface))}
.dv-head{background:var(--surface);border-bottom:1px solid var(--line)}
.wk-card{box-shadow:none;border:1px solid var(--line)}

/* v16.7 dark mode: lime badges were dark-on-dark and unreadable */
@media (prefers-color-scheme:dark){
:root:not([data-theme="light"]) .side-nav a .count.hot{background:color-mix(in srgb,#C8FF3D 22%,transparent);color:#D8F58A;font-weight:600}
:root:not([data-theme="light"]) .tb-badge{background:color-mix(in srgb,#C8FF3D 22%,transparent);color:#D8F58A}
:root:not([data-theme="light"]) .side-head .admin-pill{background:color-mix(in srgb,#C8FF3D 20%,transparent);color:#D8F58A}
:root:not([data-theme="light"]) .tone-lime{background:color-mix(in srgb,#C8FF3D 20%,transparent);color:#D8F58A}
:root:not([data-theme="light"]) .draft-tag{background:color-mix(in srgb,var(--warn) 22%,transparent);color:var(--warn)}
}
:root[data-theme="dark"] .side-nav a .count.hot{background:color-mix(in srgb,#C8FF3D 22%,transparent);color:#D8F58A;font-weight:600}
:root[data-theme="dark"] .tb-badge{background:color-mix(in srgb,#C8FF3D 22%,transparent);color:#D8F58A}
:root[data-theme="dark"] .side-head .admin-pill{background:color-mix(in srgb,#C8FF3D 20%,transparent);color:#D8F58A}
:root[data-theme="dark"] .tone-lime{background:color-mix(in srgb,#C8FF3D 20%,transparent);color:#D8F58A}
:root[data-theme="dark"] .draft-tag{background:color-mix(in srgb,var(--warn) 22%,transparent);color:var(--warn)}

/* v16.8 finishing a job */
.finish{border:1px solid color-mix(in srgb,var(--ok) 26%,var(--line));background:color-mix(in srgb,var(--ok) 5%,var(--surface));border-radius:16px;padding:16px 18px;display:flex;flex-direction:column;gap:12px}
.finish.blocked{border-color:color-mix(in srgb,var(--warn) 30%,var(--line));background:color-mix(in srgb,var(--warn) 5%,var(--surface))}
.fin-lines{display:flex;flex-direction:column;gap:5px;margin-top:8px}
.fin-lines div{display:flex;justify-content:space-between;gap:12px;font-size:14px;color:var(--fg-2)}
.fin-lines b{font-variant-numeric:tabular-nums;color:var(--fg);font-weight:600}
.fin-total{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line);font-size:14px;color:var(--fg-2)}
.fin-total b{font-size:26px;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--fg)}
.fin-miss{display:flex;align-items:center;gap:8px;margin:0;font-size:14px;color:var(--warn)}
.btn-done{width:100%;justify-content:center;gap:10px;min-height:54px;font-size:17px;font-weight:650;letter-spacing:-.01em;border-radius:14px;background:var(--ok);color:#fff;border:0;cursor:pointer;box-shadow:0 2px 10px color-mix(in srgb,var(--ok) 35%,transparent)}
.btn-done:hover{filter:brightness(1.06)}
.btn-done:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}
.finish .hint{margin:0}
.est-fold>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;font-size:15px;font-weight:600}
.est-fold>summary::-webkit-details-marker{display:none}
.est-fold>summary .ef-t{display:flex;align-items:center;gap:8px}
.est-fold>summary .ef-t svg{color:var(--fg-3)}
.est-fold>summary .hint,.est-fold>summary .chip{margin-left:auto;font-weight:400}
.est-fold[open]>summary{margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--line)}

/* v16.9 look-around mode */
.guest-bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:10px 16px;margin:0 0 14px;border-radius:12px;background:color-mix(in srgb,var(--info) 10%,var(--surface));border:1px solid color-mix(in srgb,var(--info) 26%,var(--line));font-size:14px;color:var(--fg-2)}
.guest-bar span{display:flex;align-items:center;gap:8px}
.guest-bar svg{color:var(--info)}
.guest-bar strong{color:var(--fg)}
.gb-a{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}
.tour-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px;margin-top:28px}
.tour-card{display:flex;flex-direction:column;gap:7px;text-align:left;padding:22px;border:1px solid var(--line);border-radius:20px;background:var(--surface);font:inherit;cursor:pointer;transition:transform .14s ease,box-shadow .14s ease}
.tour-card:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(16,32,48,.10);border-color:color-mix(in srgb,var(--tint) 35%,var(--line))}
.tc-ic{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:var(--tint-soft);color:var(--tint);margin-bottom:4px}
.tour-card strong{font-size:18px;letter-spacing:-.01em}
.tour-card small{font-size:14px;color:var(--fg-2);line-height:1.45}
.tc-go{margin-top:8px;display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--tint)}

/* v17.0 who can open the admin panel */
.access-card.open{border:1px solid color-mix(in srgb,var(--warn) 32%,var(--line))}
.acc-rows{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}
.acc-opt{display:flex;gap:12px;align-items:flex-start;text-align:left;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--surface);font:inherit;cursor:pointer}
.acc-opt>span:last-child{display:flex;flex-direction:column;gap:3px;min-width:0}
.acc-opt strong{font-size:14.5px}
.acc-opt small{font-size:13px;color:var(--fg-2);line-height:1.45}
.acc-opt .ao-ic{width:34px;height:34px;flex:none;border-radius:10px;display:grid;place-items:center;background:var(--surface-2);color:var(--fg-3)}
.acc-opt.on{border-color:var(--tint);background:color-mix(in srgb,var(--tint) 6%,var(--surface))}
.acc-opt.on .ao-ic{background:var(--tint-soft);color:var(--tint)}
@media (max-width:760px){.acc-rows{grid-template-columns:1fr}}

/* ===== v18.0 deeper green lettering, firmer lime, darker left panel ===== */
/* the letters inside the green and lime marks */
.tone-ok,.chip.tone-ok,.stt-ok,.fin-total b,.finish .section-title,.wc-l{color:#0E4E2D}
.tone-lime{background:color-mix(in srgb,#C8FF3D 62%,transparent);color:#2A3A04}
.side-nav a .count.hot{background:color-mix(in srgb,#C8FF3D 62%,transparent);color:#263505;font-weight:600}
.admin-pill{color:#101700}
.btn-volt{color:#121A00}
.tone-volt{color:#2A3A04;background:color-mix(in srgb,var(--volt) 46%,transparent)}
.stepper .s.cur{box-shadow:0 0 0 5px color-mix(in srgb,var(--volt) 34%,transparent)}
.cc.g-doing{background:color-mix(in srgb,var(--cal-doing) 24%,var(--surface))}
.cc.g-doing .cc-st{color:color-mix(in srgb,var(--cal-doing) 72%,var(--fg))}

/* the left panel, a touch deeper */

@media (prefers-color-scheme:dark){
:root:not([data-theme="light"]) .tone-ok,:root:not([data-theme="light"]) .chip.tone-ok,:root:not([data-theme="light"]) .stt-ok,:root:not([data-theme="light"]) .fin-total b,:root:not([data-theme="light"]) .finish .section-title,:root:not([data-theme="light"]) .wc-l{color:#5BD08F}
:root:not([data-theme="light"]) .tone-lime,:root:not([data-theme="light"]) .side-nav a .count.hot{background:color-mix(in srgb,#C8FF3D 30%,transparent);color:#E6FBAE}
:root:not([data-theme="light"]) .tone-volt{color:#E6FBAE;background:color-mix(in srgb,#C8FF3D 24%,transparent)}
:root:not([data-theme="light"]) .cc.g-doing{background:color-mix(in srgb,var(--cal-doing) 20%,var(--surface))}
}
:root[data-theme="dark"] .tone-ok,:root[data-theme="dark"] .chip.tone-ok,:root[data-theme="dark"] .stt-ok,:root[data-theme="dark"] .fin-total b,:root[data-theme="dark"] .finish .section-title,:root[data-theme="dark"] .wc-l{color:#5BD08F}
:root[data-theme="dark"] .tone-lime,:root[data-theme="dark"] .side-nav a .count.hot{background:color-mix(in srgb,#C8FF3D 30%,transparent);color:#E6FBAE}
:root[data-theme="dark"] .tone-volt{color:#E6FBAE;background:color-mix(in srgb,#C8FF3D 24%,transparent)}
:root[data-theme="dark"] .cc.g-doing{background:color-mix(in srgb,var(--cal-doing) 20%,var(--surface))}
.ac-lines.no-amt div{justify-content:flex-start}
.ac-lines.no-amt div span{color:var(--fg)}
.ac-total{justify-content:center;text-align:center}

/* v18.1 left panel: darker, firmer lettering for contrast */
.side-nav a{color:var(--fg);font-weight:500}
.side-nav a .ic{color:var(--fg-2);opacity:1}
.side-nav a.on{color:var(--fg);font-weight:600}
.side-group{color:var(--fg-2);opacity:1;font-weight:600}
.side-nav a .count{color:var(--fg-2);opacity:1;font-weight:500}
.side-head .admin-pill{color:#2A3A04;background:color-mix(in srgb,#C8FF3D 58%,transparent)}
.side-foot .who strong,.side-foot strong{color:var(--fg)}
@media (prefers-color-scheme:dark){
:root:not([data-theme="light"]) .side-nav a{color:#F0F0F2}
:root:not([data-theme="light"]) .side-nav a .ic{color:var(--fg-2)}
:root:not([data-theme="light"]) .side-group{color:var(--fg-2)}
:root:not([data-theme="light"]) .side-head .admin-pill{color:#E6FBAE;background:color-mix(in srgb,#C8FF3D 26%,transparent)}
}
:root[data-theme="dark"] .side-nav a{color:#F0F0F2}
:root[data-theme="dark"] .side-nav a .ic{color:var(--fg-2)}
:root[data-theme="dark"] .side-group{color:var(--fg-2)}
:root[data-theme="dark"] .side-head .admin-pill{color:#E6FBAE;background:color-mix(in srgb,#C8FF3D 26%,transparent)}

/* ===== v19.0 admin lists in the website-request style ===== */
.jc-tools{gap:10px}
.jc-tools .view-sw{margin-left:auto}
.jc-h{display:flex;align-items:center;gap:8px;margin:14px 2px 0;font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--fg-2)}
.jc-h:first-child{margin-top:0}
.jc-h .cnt{font-size:12px;font-weight:600;color:var(--fg-3);letter-spacing:0}
.wr.jc{padding:18px 20px 16px}
.wr.jc.urgent{box-shadow:inset 4px 0 0 var(--bad),var(--shadow-sm)}
.wr.jc.closed{opacity:.86}
.wr.jc.picked{border-color:var(--tint);box-shadow:0 0 0 2px color-mix(in srgb,var(--tint) 30%,transparent)}
.jc-name{all:unset;cursor:pointer;display:block}
.jc-name:hover h3{color:var(--tint)}
.jc-name:focus-visible{outline:2px solid var(--tint);outline-offset:3px;border-radius:6px}
.wr.jc .wr-id h3{font-weight:700;color:var(--fg)}
/* the next step: the first thing to read */
.jc-next{display:flex;align-items:center;gap:12px;margin:12px 0 0;padding:12px 14px;border-radius:14px;background:var(--surface-2);border:1px solid transparent}
.jn-ic{width:36px;height:36px;flex:none;border-radius:11px;display:grid;place-items:center;background:var(--surface);color:var(--fg-2)}
.jn-t{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.jn-t strong{font-size:16px;font-weight:650;color:var(--fg);letter-spacing:-.005em}
.jn-t small{font-size:13px;color:var(--fg-2)}
.jn-a{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.jn-pick{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 14px;border-radius:999px;background:var(--surface);border:1px solid var(--line-2);font-size:14px;font-weight:600;color:var(--tint);cursor:pointer}
.jn-pick input{width:17px;height:17px;accent-color:var(--tint);margin:0}
.jn-pick.on{background:var(--tint);color:#fff;border-color:var(--tint)}
.jc-next.t-warn{background:color-mix(in srgb,var(--warn) 9%,var(--surface));border-color:color-mix(in srgb,var(--warn) 22%,transparent)}
.jc-next.t-warn .jn-ic{background:color-mix(in srgb,var(--warn) 16%,var(--surface));color:var(--warn)}
.jc-next.t-bad{background:color-mix(in srgb,var(--bad) 8%,var(--surface));border-color:color-mix(in srgb,var(--bad) 22%,transparent)}
.jc-next.t-bad .jn-ic{background:color-mix(in srgb,var(--bad) 15%,var(--surface));color:var(--bad)}
.jc-next.t-info{background:color-mix(in srgb,var(--info) 8%,var(--surface));border-color:color-mix(in srgb,var(--info) 20%,transparent)}
.jc-next.t-info .jn-ic{background:color-mix(in srgb,var(--info) 15%,var(--surface));color:var(--info)}
.jc-next.t-ok{background:color-mix(in srgb,var(--ok) 8%,var(--surface));border-color:color-mix(in srgb,var(--ok) 22%,transparent)}
.jc-next.t-ok .jn-ic{background:color-mix(in srgb,var(--ok) 15%,var(--surface));color:var(--ok)}
.jc-next.t-tint{background:color-mix(in srgb,var(--tint) 7%,var(--surface));border-color:color-mix(in srgb,var(--tint) 18%,transparent)}
.jc-next.t-tint .jn-ic{background:color-mix(in srgb,var(--tint) 14%,var(--surface));color:var(--tint)}
.wr.jc .wr-issue{margin:12px 0 4px;font-size:15px}
.wr.jc .wr-grid{margin:14px 0 4px}
.wr-grid .hint .tech-dot{display:inline-block;margin-right:6px;vertical-align:middle}
.jc-run{display:inline-flex;align-items:center;gap:6px;color:var(--bad);font-weight:600;font-variant-numeric:tabular-nums}
.jc-foot{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.jc-foot .actions{margin:0}
.jc-prog{display:flex;gap:4px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.jc-prog li{font-size:12px;font-weight:500;color:var(--fg-3);padding:4px 10px;border-radius:999px;background:var(--surface-2);white-space:nowrap}
.jc-prog li.past{color:var(--fg-2);background:color-mix(in srgb,var(--tint) 8%,var(--surface-2))}
.jc-prog li.on{color:#fff;background:var(--tint);font-weight:600}
@media (max-width:760px){
  .jc-next{flex-wrap:wrap}
  .jn-a{width:100%;justify-content:flex-start}
  .jc-prog li{padding:3px 8px;font-size:11.5px}
  .jc-tools .view-sw{margin-left:0}
}
/* card footers: the timer button stays quiet next to the main step */
.jc-foot .work-btn.btn-primary{background:var(--surface-2);color:var(--tint);box-shadow:none}
.jc-foot .work-btn.btn-primary:hover{background:var(--surface-3)}
.list-sum{margin:-2px 2px 14px;font-size:14px;color:var(--fg-2)}
.list-sum strong{color:var(--fg)}
.list-sum .warn-t{color:var(--warn)}
.list-sum .bad-t{color:var(--bad)}
/* estimate lines inside an approval card */
.ap-lines{margin:12px 0 4px;border-radius:12px;background:var(--surface-2);padding:6px 14px}
.ap-lines>div{display:flex;justify-content:space-between;gap:12px;padding:8px 0;font-size:14.5px;border-bottom:1px solid var(--line)}
.ap-lines>div:last-child{border-bottom:0}
.ap-lines b{font-weight:500;font-variant-numeric:tabular-nums;white-space:nowrap}
.ap-lines .muted{color:var(--fg-3)}
.ap-lines .tot{font-weight:650}
.ap-lines .tot b{font-weight:700;font-size:16px}
.wr-seg.ps5{grid-template-columns:repeat(5,1fr)}
@media (max-width:760px){.wr-seg.ps5{grid-template-columns:repeat(3,1fr)}}
/* ready to invoice: one card per client, one row per repair */
.ri-rows{display:flex;flex-direction:column;margin-top:12px;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.ri-row{display:grid;grid-template-columns:22px minmax(0,1fr) 110px 130px auto;gap:14px;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line);cursor:pointer;background:var(--surface)}
.ri-row:last-child{border-bottom:0}
.ri-row:hover{background:color-mix(in srgb,var(--surface-2) 55%,var(--surface))}
.ri-row.on{background:color-mix(in srgb,var(--tint) 6%,var(--surface))}
.ri-row input{width:18px;height:18px;accent-color:var(--tint);margin:0}
.ri-m{display:flex;flex-direction:column;gap:2px;min-width:0}
.ri-m strong{font-size:15px;font-weight:600}
.ri-m small{font-size:12.5px;color:var(--fg-3)}
.ri-m .ri-w{color:var(--fg-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ri-t,.ri-a{display:flex;flex-direction:column;align-items:flex-end;font-variant-numeric:tabular-nums;font-size:15px;font-weight:600}
.ri-t small,.ri-a small{font-size:12px;font-weight:400;color:var(--fg-3)}
@media (max-width:760px){.ri-row{grid-template-columns:22px minmax(0,1fr) auto}.ri-t,.ri-row .btn{display:none}}
.jc-prog li.on,.ws.on{color:var(--on-tint)}
.jn-pick.on{color:var(--on-tint)}

/* ===== v19.1 expenses ===== */
.bad-t{color:var(--bad)}
.exp-cats{display:flex;flex-wrap:wrap;gap:6px}
.exp-where{margin-bottom:16px}
.ew-top{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin:4px 0 14px}
.ew-top b{font-size:34px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.ew-top span{font-size:14px;color:var(--fg-2)}
.ew-bars{display:flex;flex-direction:column;gap:2px}
.ew-row{display:grid;grid-template-columns:minmax(150px,230px) minmax(0,1fr) 110px 44px;align-items:center;gap:14px;padding:8px 10px;margin:0 -10px;border:0;border-radius:10px;background:none;font:inherit;color:var(--fg);text-align:left;cursor:pointer}
.ew-row:hover,.ew-row:focus-visible{background:var(--surface-2)}
.ew-row.on{background:color-mix(in srgb,var(--tint) 8%,var(--surface))}
.ew-l{display:flex;align-items:center;gap:9px;font-size:14.5px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ew-l svg{color:var(--fg-3);flex:none}
.ew-track{height:12px;border-radius:4px;background:color-mix(in srgb,var(--surface-2) 70%,transparent);overflow:hidden}
.ew-track i{display:block;height:100%;border-radius:4px;background:var(--tint)}
.ew-row.auto .ew-track i{background:color-mix(in srgb,var(--tint) 45%,var(--surface))}
.ew-row:hover .ew-track i{filter:brightness(1.08)}
.ew-v{font-size:14.5px;font-weight:600;text-align:right;font-variant-numeric:tabular-nums}
.ew-p{font-size:12.5px;color:var(--fg-3);text-align:right;font-variant-numeric:tabular-nums}
.exp-list{padding:4px 0;overflow:hidden}
.exp-row{display:grid;grid-template-columns:36px minmax(0,1fr) auto 120px 130px;align-items:center;gap:14px;width:100%;padding:12px 18px;border:0;border-bottom:1px solid var(--line);background:none;font:inherit;color:var(--fg);text-align:left;cursor:pointer}
.exp-row:last-child{border-bottom:0}
.exp-row:hover{background:color-mix(in srgb,var(--surface-2) 55%,transparent)}
.er-ic{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:var(--surface-2);color:var(--fg-2)}
.er-m{display:flex;flex-direction:column;gap:2px;min-width:0}
.er-m strong{font-size:15px;font-weight:600}
.er-m small{font-size:12.5px;color:var(--fg-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.er-tags{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.er-tags .tech-dot{display:inline-block;margin-right:6px}
.er-d{font-size:13px;color:var(--fg-2);text-align:right;font-variant-numeric:tabular-nums}
.er-a{display:flex;flex-direction:column;align-items:flex-end;font-size:15px;font-weight:600;font-variant-numeric:tabular-nums}
.er-a small{font-size:12px;font-weight:400;color:var(--fg-3)}
@media (max-width:760px){
  .ew-row{grid-template-columns:minmax(0,1fr) 96px;row-gap:6px}
  .ew-track{grid-column:1 / -1;grid-row:2}
  .ew-p{display:none}
  .exp-row{grid-template-columns:36px minmax(0,1fr) auto;padding:12px 14px}
  .er-tags,.er-d{display:none}
}

/* ===== v19.2 the invoice opens as a small panel, not a full-height wall ===== */
.overlay.inv-ov{background:rgba(16,24,32,.16);-webkit-backdrop-filter:none;backdrop-filter:none;align-items:flex-start;padding:16px}
.drawer.inv-dr{width:min(460px,100%);height:auto;max-height:calc(100vh - 32px);border-radius:20px;box-shadow:0 18px 50px rgba(16,32,48,.22),0 0 0 .5px var(--line)}
.inv-dr .sheet-head{padding:14px 14px 10px 18px}
.inv-dr .sheet-head h2{font-size:17px;display:flex;flex-direction:column;gap:1px;line-height:1.25}
.inv-dr .sheet-head h2 .draft-tag{align-self:flex-start;margin-bottom:3px}
.inv-dr .iv-cl{font-size:13px;font-weight:500;color:var(--fg-3);letter-spacing:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.inv-dr .sheet-body{padding:14px 18px;gap:14px}
.inv-dr .iv-head{grid-template-columns:140px minmax(0,1fr);gap:10px}
.inv-dr .iv-head .field{grid-column:auto}
.inv-dr .inv-line{padding:10px 12px}
.inv-dr .w-block{padding:12px}
.inv-dr .io-row{display:grid;grid-template-columns:minmax(0,1fr) 90px auto;gap:6px}
.inv-dr .io-row input{min-width:0}
.inv-dr .inv-total{padding:12px 14px;align-items:center}
.inv-dr .inv-total span{display:flex;flex-direction:column;gap:2px}
.inv-dr .inv-total small{font-size:12px;color:var(--fg-3);font-weight:400}
.inv-dr .inv-total b{font-size:22px}
.inv-dr .sheet-foot{padding:10px 14px 14px}
@media (max-width:760px){
  .overlay.inv-ov{padding:0;align-items:flex-end}
  .drawer.inv-dr{width:100%;max-height:88vh;border-radius:20px 20px 0 0}
  .inv-dr .iv-head{grid-template-columns:110px minmax(0,1fr)}
}

/* ===== v19.3 estimate or time at the finish ===== */
.fin-pick{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.fp{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-radius:14px;border:1.5px solid var(--line-2);background:var(--surface);font:inherit;color:var(--fg);text-align:left;cursor:pointer}
.fp:hover{border-color:color-mix(in srgb,var(--tint) 45%,var(--line-2))}
.fp.on{border-color:var(--tint);background:color-mix(in srgb,var(--tint) 7%,var(--surface));box-shadow:0 0 0 3px color-mix(in srgb,var(--tint) 14%,transparent)}
.fp-t{display:flex;flex-direction:column;gap:2px;font-size:14.5px;font-weight:600;min-width:0}
.fp-t small{font-size:12px;font-weight:400;color:var(--fg-3)}
.fp b{font-size:17px;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.fin-note{font-size:13.5px;color:var(--fg-2);margin:0;padding:9px 12px;border-radius:10px;background:var(--surface-2)}
.fin-note.warn{color:var(--warn);background:color-mix(in srgb,var(--warn) 9%,var(--surface))}
@media (max-width:600px){.fin-pick{grid-template-columns:1fr}}

/* ===== v19.4 one price, with VAT first and without VAT underneath ===== */
.wb-money{font-size:15px;color:var(--fg-2)}
.wb-money strong{font-size:17px;color:var(--fg);font-weight:700;font-variant-numeric:tabular-nums}
.wb-net{font-size:12.5px;color:var(--fg-3);font-variant-numeric:tabular-nums}
.workbar .wb-t{display:flex;flex-direction:column;gap:2px}
.fin-lines>div b{display:flex;flex-direction:column;align-items:flex-end}
.fin-lines>div b small,.fin-total b small{font-size:12px;font-weight:400;color:var(--fg-3);font-variant-numeric:tabular-nums}
.fin-total b{display:flex;flex-direction:column;align-items:flex-end;line-height:1.15}
.fin-est{font-size:13.5px;color:var(--fg-2);margin:0;display:flex;flex-wrap:wrap;gap:4px 8px;align-items:baseline}
.link-btn{all:unset;cursor:pointer;color:var(--tint);font-weight:600}
.link-btn:hover{text-decoration:underline}
.link-btn:focus-visible{outline:2px solid var(--tint);outline-offset:2px;border-radius:4px}
.ef-state{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:10px 12px;border-radius:12px;margin-bottom:12px;background:var(--surface-2)}
.ef-state span:first-child{display:flex;flex-direction:column;gap:2px}
.ef-state small{font-size:12.5px;color:var(--fg-3)}
.ef-state.t-warn{background:color-mix(in srgb,var(--warn) 9%,var(--surface))}
.ef-state.t-ok{background:color-mix(in srgb,var(--ok) 9%,var(--surface))}
.ef-state.t-bad{background:color-mix(in srgb,var(--bad) 8%,var(--surface))}
.ef-state.t-info{background:color-mix(in srgb,var(--info) 9%,var(--surface))}
.ef-ans{display:flex;gap:6px;flex-wrap:wrap}

/* ===== v19.5 one estimate, built from the job's time and parts ===== */
.est-time{margin-bottom:10px}
.est-time .lbl{display:block;font-size:13px;font-weight:600;color:var(--fg-2);margin-bottom:6px}
.est-time .quick-mins{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.est-h{display:inline-flex;align-items:center;gap:6px}
.est-h input{width:82px;min-height:36px}
.est-h span{font-size:13px;color:var(--fg-3)}
.est-calc{border-radius:12px;background:var(--surface);border:1px solid var(--line);padding:4px 14px}
.ec-row{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:14.5px}
.ec-row:last-child{border-bottom:0}
.ec-row b{display:flex;flex-direction:column;align-items:flex-end;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.ec-row b small{font-size:12px;font-weight:400;color:var(--fg-3)}
.ec-row.tot{font-weight:650}
.ec-row.tot b{font-size:18px;font-weight:700}
.fin-est.same{color:var(--ok);font-weight:600;align-items:center}
.fin-est.same svg{flex:none}
.part-order.must{border-color:color-mix(in srgb,var(--warn) 35%,var(--line));background:color-mix(in srgb,var(--warn) 6%,var(--surface))}
.po-row.po-2{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
.po-row.po-2 label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--fg-3);min-width:0}
.po-row.po-2 input{min-width:0}
@media (max-width:600px){.po-row.po-2{grid-template-columns:1fr}}
.part{grid-template-columns:28px minmax(0,1fr) 54px 100px 112px 36px}
.part input[type=number]{padding-left:10px;padding-right:8px}

/* ===== v19.6 the job in six steps, with a step bar on top ===== */
.jd-body{gap:14px}
.jd-nav{position:sticky;top:-20px;z-index:3;display:flex;gap:4px;margin:0 -22px;padding:10px 22px;background:color-mix(in srgb,var(--surface) 94%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.jd-nav::-webkit-scrollbar{display:none}
.jn-s{display:inline-flex;align-items:center;gap:6px;flex:1 0 auto;justify-content:center;min-height:34px;padding:0 10px;border:0;border-radius:999px;background:var(--surface-2);font:inherit;font-size:13px;font-weight:500;color:var(--fg-2);cursor:pointer;white-space:nowrap}
.jn-s i{font-style:normal;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:700;background:var(--surface);color:var(--fg-3)}
.jn-s:hover:not(:disabled){background:var(--surface-3);color:var(--fg)}
.jn-s.done{color:var(--fg-2)}
.jn-s.done i{background:color-mix(in srgb,var(--ok) 18%,var(--surface));color:var(--ok)}
.jn-s.now{background:var(--tint);color:var(--on-tint);font-weight:650}
.jn-s.now i{background:color-mix(in srgb,#fff 25%,transparent);color:inherit}
.jn-s.later{opacity:.45;cursor:default}
.jd-sec{display:flex;flex-direction:column;gap:12px;padding-top:16px;border-top:1px solid var(--line);scroll-margin-top:60px}
.jd-h{display:flex;align-items:baseline;gap:10px;margin:0;font-size:17px;font-weight:700;letter-spacing:-.01em}
.jd-h i{font-style:normal;width:24px;height:24px;flex:none;border-radius:50%;display:inline-grid;place-items:center;align-self:center;font-size:12.5px;font-weight:700;background:var(--surface-2);color:var(--fg-2)}
.jd-h small{margin-left:auto;font-size:13px;font-weight:500;color:var(--fg-3);letter-spacing:0;text-align:right}
.jd-sec .stc2{margin:0}
.jd-sec .est-fold{margin:0}
@media (max-width:760px){.jd-nav{top:-16px;margin:0 -16px;padding:8px 16px}.jn-s{flex:0 0 auto}}
.wr-seg.rs4{grid-template-columns:repeat(4,1fr)}
@media (max-width:760px){.wr-seg.rs4{grid-template-columns:repeat(2,1fr)}}
.sa-sum{display:inline-flex;align-items:center;gap:6px;margin-right:14px}
.sa-sum::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--info)}
.sa-sum.sa-parts::before,.sa-sum.sa-cost::before{background:var(--warn)}

/* ===== v19.7 a calmer job window ===== */
.jd-who2{display:flex;flex-direction:column;gap:2px;padding:10px 14px;border-radius:14px;background:var(--surface-2)}
.jw-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-height:34px;font-size:14.5px}
.jw-row>svg{color:var(--fg-3);flex:none}
.jw-row a{color:var(--fg);text-decoration:none}
.jw-row a:hover strong{color:var(--tint)}
.jw-row strong{font-weight:650}
.jw-sub{font-size:13px;color:var(--fg-3);flex:1 1 140px;min-width:0}
.jw-row .copyline,.jw-row .chip{flex:none}
details.jd-sec{padding-top:0;border-top:1px solid var(--line);gap:0}
details.jd-sec>summary{list-style:none;cursor:pointer;padding:14px 0;user-select:none}
details.jd-sec>summary::-webkit-details-marker{display:none}
details.jd-sec>summary::after{content:"";width:8px;height:8px;margin-left:10px;border-right:2px solid var(--fg-3);border-bottom:2px solid var(--fg-3);transform:rotate(45deg) translateY(-3px);transition:transform .2s;flex:none;align-self:center}
details.jd-sec[open]>summary::after{transform:rotate(-135deg) translateY(-2px)}
details.jd-sec>summary:hover{color:var(--tint)}
details.jd-sec:not([open])>summary{color:var(--fg-2);font-weight:600}
details.jd-sec:not([open])>summary small{color:var(--fg-2)}
.jd-in{display:flex;flex-direction:column;gap:12px;padding-bottom:16px}
details.jd-sec .jd-h i svg{color:var(--ok)}
.jd-other{min-height:36px;padding:0 30px 0 12px;font-size:13.5px;border-radius:999px;background-color:var(--surface-2);border:0;color:var(--fg-2)}
.jd-body .more-fields>summary{font-size:13.5px;color:var(--fg-2)}
/* new since you last looked */
.wr.is-new{border-color:color-mix(in srgb,#C8FF3D 70%,var(--line));box-shadow:inset 4px 0 0 #B5E61D,var(--shadow-sm)}
.wr.jc.urgent.is-new{box-shadow:inset 4px 0 0 var(--bad),0 0 0 2px color-mix(in srgb,#C8FF3D 55%,transparent)}
.jc-h-new{color:#3E5208}
.jc-h-new .cnt{color:#3E5208}
.side-nav a.has-new span{font-weight:600;color:var(--fg)}
.side-nav a .count.hot{white-space:nowrap}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .jc-h-new,:root:not([data-theme="light"]) .jc-h-new .cnt{color:#D8F58A}}
:root[data-theme="dark"] .jc-h-new,:root[data-theme="dark"] .jc-h-new .cnt{color:#D8F58A}
/* the job window: tidier client lines and footer */
.jw-row{display:grid;grid-template-columns:20px minmax(0,1fr) auto;align-items:center;column-gap:10px;row-gap:0;padding:4px 0}
.jw-row>a,.jw-row>strong{grid-column:2;grid-row:1}
.jw-row .jw-sub{grid-column:2;grid-row:2;flex:none}
.jw-row>svg{grid-row:1 / span 2}
.jw-row>:last-child:not(.jw-sub):not(a):not(strong){grid-column:3;grid-row:1 / span 2}
.jd-other{width:auto;flex:0 1 170px}

/* ===== v19.8 jobs as short rows; the details live in the job window ===== */
.jl-wrap{display:flex;flex-direction:column;gap:16px}
.jl-group .jc-h{margin:0 2px 8px}
.card.jl{padding:4px 0;overflow:hidden}
.jl-row{display:grid;grid-template-columns:22px minmax(150px,1.1fr) minmax(180px,1.5fr) 128px 96px minmax(0,auto) 16px;align-items:center;gap:14px;padding:11px 18px;border-bottom:1px solid var(--line);cursor:pointer;position:relative}
.jl-row:last-child{border-bottom:0}
.jl-row:hover{background:color-mix(in srgb,var(--surface-2) 60%,transparent)}
.jl-row:focus-visible{outline:2px solid var(--tint);outline-offset:-2px}
.jl-row>svg:last-child{color:var(--fg-3)}
.jl-dot{width:9px;height:9px;border-radius:50%;justify-self:center;background:var(--fg-3);opacity:.5}
.jl-row.t-warn .jl-dot{background:var(--warn);opacity:1}
.jl-row.t-bad .jl-dot{background:var(--bad);opacity:1}
.jl-row.t-info .jl-dot{background:var(--info);opacity:1}
.jl-row.t-ok .jl-dot{background:var(--ok);opacity:1}
.jl-row.t-tint .jl-dot{background:var(--tint);opacity:1}
.jl-pick{display:grid;place-items:center}
.jl-pick input{width:18px;height:18px;accent-color:var(--tint);margin:0}
.jl-who{display:flex;flex-direction:column;gap:1px;min-width:0}
.jl-who strong{font-size:15px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jl-who small{font-size:12.5px;color:var(--fg-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jl-next{display:flex;align-items:center;gap:8px;min-width:0;font-size:14px;color:var(--fg)}
.jl-next svg{flex:none;color:var(--fg-3)}
.jl-row.t-warn .jl-next svg{color:var(--warn)}
.jl-row.t-bad .jl-next svg{color:var(--bad)}
.jl-row.t-info .jl-next svg{color:var(--info)}
.jl-row.t-ok .jl-next svg{color:var(--ok)}
.jl-row.t-tint .jl-next svg{color:var(--tint)}
.jl-next span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jl-when{display:flex;flex-direction:column;gap:1px;font-variant-numeric:tabular-nums}
.jl-when b{font-size:14px;font-weight:600}
.jl-when small{font-size:12px;color:var(--fg-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jl-amt{font-size:14px;font-weight:600;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.jl-tags{display:flex;gap:5px;justify-content:flex-end;flex-wrap:nowrap}
.jl-row.is-new{background:color-mix(in srgb,#C8FF3D 9%,var(--surface));box-shadow:inset 4px 0 0 #B5E61D}
.jl-row.urgent{box-shadow:inset 4px 0 0 var(--bad)}
.jl-row.urgent.is-new{box-shadow:inset 4px 0 0 var(--bad),inset 8px 0 0 #B5E61D}
.jl-row.picked{background:color-mix(in srgb,var(--tint) 7%,var(--surface))}
@media (max-width:1100px){.jl-row{grid-template-columns:22px minmax(0,1fr) 118px 86px 16px}.jl-next,.jl-tags{display:none}}
@media (max-width:760px){
  .jl-row{grid-template-columns:18px minmax(0,1fr) auto;row-gap:4px;padding:11px 14px}
  .jl-next{display:flex;grid-column:2 / 4;grid-row:2;font-size:13px}
  .jl-when{grid-column:3;grid-row:1;text-align:right;align-items:flex-end}
  .jl-amt,.jl-tags,.jl-row>svg:last-child{display:none}
}
.jl-row{grid-template-columns:22px minmax(0,1.1fr) minmax(0,1.5fr) 128px 96px 120px 16px}
.jl-next strong{font-weight:650}
@media (max-width:1100px){.jl-row{grid-template-columns:22px minmax(0,1fr) 118px 86px 16px}}
@media (max-width:760px){.jl-row{grid-template-columns:18px minmax(0,1fr) auto}}

/* ===== v19.9 the running timer: red, blinking, always on screen ===== */
@keyframes blink-red{0%,100%{box-shadow:0 0 0 0 rgba(214,48,24,.55),0 10px 30px rgba(120,20,10,.28)}50%{box-shadow:0 0 0 7px rgba(214,48,24,0),0 10px 30px rgba(120,20,10,.28)}}
@keyframes rec-blink{0%,100%{opacity:1}50%{opacity:.15}}
.float-timer{position:fixed;right:18px;bottom:18px;z-index:80;display:flex;flex-direction:column;gap:8px;align-items:flex-end}
.ft-one{display:flex;align-items:center;gap:4px;padding:5px;border-radius:999px;background:#C9301A;color:#fff;animation:blink-red 1.6s ease-in-out infinite}
.ft-main{all:unset;cursor:pointer;display:flex;align-items:center;gap:10px;padding:4px 10px 4px 12px;border-radius:999px}
.ft-main:focus-visible{outline:2px solid #fff;outline-offset:2px}
.ft-rec{width:12px;height:12px;border-radius:50%;background:#fff;animation:rec-blink 1s steps(1,end) infinite}
.ft-t{display:flex;flex-direction:column;line-height:1.15}
.ft-t b{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:.01em}
.ft-t small{font-size:12px;opacity:.9;max-width:230px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ft-stop{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 16px;border:0;border-radius:999px;background:#fff;color:#C9301A;font:inherit;font-weight:700;font-size:14px;cursor:pointer}
.ft-stop:hover{background:#FFE9E4}
.ft-sq{width:10px;height:10px;border-radius:2px;background:#C9301A}
.ft-more{font-size:12px;padding:4px 10px;border-radius:999px;background:var(--surface);color:var(--bad);box-shadow:var(--shadow-sm)}
@media (max-width:760px){.float-timer{right:12px;left:12px;bottom:calc(env(safe-area-inset-bottom,0px) + 86px);align-items:stretch}.ft-one{justify-content:space-between}}
/* the work box while the clock runs */
.workbar.running{background:#FFF0EC;box-shadow:inset 0 0 0 2px #E2563E;animation:blink-red 1.6s ease-in-out infinite}
.workbar.running .wb-t b{color:#C9301A}
:root[data-theme="dark"] .workbar.running{background:rgba(255,90,60,.12)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .workbar.running{background:rgba(255,90,60,.12)}}
.jl-row.running{background:color-mix(in srgb,var(--bad) 7%,var(--surface))}
.jl-row.running .jl-dot{background:var(--bad);opacity:1;animation:rec-blink 1s steps(1,end) infinite;width:11px;height:11px}
.jl-row.running .jl-amt{color:var(--bad)}
/* keep the floating timer clear of the toasts and action bars */
body:has(.float-timer) .action-bar{right:auto}
.jl-issue{color:var(--fg-2)}

/* ===== v20.0 the job is a page of its own ===== */
.job-page{display:flex;flex-direction:column;max-width:880px;border-radius:24px;background:var(--surface);box-shadow:var(--shadow-sm);margin-bottom:24px}
.jp-back{margin:14px 0 0 18px;align-self:flex-start}
.job-page .sheet-head{padding:10px 22px 14px}
.job-page .sheet-head h2{font-size:24px}
.job-page .sheet-body{overflow:visible;padding:18px 22px}
.job-page .jd-nav{top:0;margin:0 -22px;border-radius:0}
.job-page .sheet-foot{position:sticky;bottom:0;z-index:4;background:color-mix(in srgb,var(--surface) 94%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:0 0 24px 24px}
.job-page details.jd-sec{scroll-margin-top:70px}
@media (max-width:760px){.job-page{border-radius:18px}.job-page .sheet-foot{bottom:calc(env(safe-area-inset-bottom,0px) + 72px)}}
.jl-go{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;border:0;background:var(--tint);color:var(--on-tint);cursor:pointer;flex:none}
.jl-go:hover{filter:brightness(1.08)}
.jl-go.stop{background:#C9301A;color:#fff;animation:blink-red 1.6s ease-in-out infinite}
.jl-go.stop .ft-sq{background:#fff}
.jl-row{grid-template-columns:22px minmax(0,1.1fr) minmax(0,1.5fr) 128px 96px 150px 16px}
@media (max-width:1100px){.jl-row{grid-template-columns:22px minmax(0,1fr) 118px 86px auto 16px}.jl-tags{display:flex}.jl-tags .chip{display:none}}
@media (max-width:760px){.jl-row{grid-template-columns:18px minmax(0,1fr) auto}.jl-tags{display:flex;grid-column:3;grid-row:2;justify-content:flex-end}.jl-tags .chip{display:none}}
body:has(.job-page) .float-timer{bottom:92px}
@media (max-width:760px){body:has(.job-page) .float-timer{bottom:calc(env(safe-area-inset-bottom,0px) + 150px)}}
.cancel-box{border:1px solid color-mix(in srgb,var(--bad) 25%,var(--line));background:color-mix(in srgb,var(--bad) 5%,var(--surface))}
.cx-info{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.cx-info strong{flex:1 1 240px}
.cx-info small{color:var(--fg-3)}
/* parts on a job: what we paid and what the client pays, side by side */
.part{grid-template-columns:24px minmax(0,1fr) 52px 92px 100px 128px 32px}
.part-head{font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--fg-3);min-height:0;padding-bottom:0;background:none;border:0}
.part-head span{padding-left:2px}
.part .part-st{grid-column:2 / -1}
.po-row{display:flex;gap:8px;flex-wrap:wrap}
.po-row input{flex:1 1 130px;min-width:0}
@media (max-width:760px){.part{grid-template-columns:24px minmax(0,1fr) 52px 32px}.part-head{display:none}.part input[aria-label^="We paid"],.part input[aria-label^="Client pays"],.part .part-sel{grid-column:2 / -1}}
.seg-new{font-style:normal;display:inline-flex;align-items:center;margin-left:6px;padding:1px 7px;border-radius:999px;font-size:11.5px;font-weight:700;background:color-mix(in srgb,#C8FF3D 70%,transparent);color:#263505;line-height:1.5}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .seg-new{background:color-mix(in srgb,#C8FF3D 30%,transparent);color:#E6FBAE}}
:root[data-theme="dark"] .seg-new{background:color-mix(in srgb,#C8FF3D 30%,transparent);color:#E6FBAE}
/* new since you last looked, everywhere */
.is-new-row{background:color-mix(in srgb,#C8FF3D 12%,var(--surface)) !important;box-shadow:inset 4px 0 0 #B5E61D}
tr.is-new-row td:first-child{box-shadow:inset 4px 0 0 #B5E61D}
tr.is-new-row{box-shadow:none}
.new-tag{display:inline-block;margin-right:6px;padding:1px 7px;border-radius:999px;font-size:11px;font-weight:700;background:color-mix(in srgb,#C8FF3D 70%,transparent);color:#263505;vertical-align:1px}
.cc.is-new-ev{box-shadow:inset 3px 0 0 var(--ev),0 0 0 2px #B5E61D}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .is-new-row{background:color-mix(in srgb,#C8FF3D 9%,var(--surface)) !important}:root:not([data-theme="light"]) .new-tag{background:color-mix(in srgb,#C8FF3D 30%,transparent);color:#E6FBAE}}
:root[data-theme="dark"] .is-new-row{background:color-mix(in srgb,#C8FF3D 9%,var(--surface)) !important}
:root[data-theme="dark"] .new-tag{background:color-mix(in srgb,#C8FF3D 30%,transparent);color:#E6FBAE}

/* ===== v20.1 the lime, 30% calmer ===== */
.side-nav a .count.hot{background:color-mix(in srgb,#C8FF3D 42%,#EEF2E4);color:#2E3D0A}
.tone-lime{background:color-mix(in srgb,#C8FF3D 42%,#EEF2E4);color:#2E3D0A}
.seg-new,.new-tag{background:color-mix(in srgb,#C8FF3D 45%,#EEF2E4);color:#2E3D0A}
.side-head .admin-pill{background:color-mix(in srgb,#C8FF3D 40%,#EEF2E4)}
.wr.is-new{border-color:color-mix(in srgb,#A9C95A 55%,var(--line));box-shadow:inset 4px 0 0 #A9C95A,var(--shadow-sm)}
.jl-row.is-new{background:color-mix(in srgb,#C8FF3D 6%,var(--surface));box-shadow:inset 4px 0 0 #A9C95A}
.jl-row.urgent.is-new{box-shadow:inset 4px 0 0 var(--bad),inset 8px 0 0 #A9C95A}
.is-new-row{background:color-mix(in srgb,#C8FF3D 8%,var(--surface)) !important;box-shadow:inset 4px 0 0 #A9C95A}
tr.is-new-row td:first-child{box-shadow:inset 4px 0 0 #A9C95A}
.cc.is-new-ev{box-shadow:inset 3px 0 0 var(--ev),0 0 0 2px #A9C95A}
.wr.unread{border-color:color-mix(in srgb,#A9C95A 40%,var(--line))}
.wr-dot{background:#9DBB4C}
@media (prefers-color-scheme:dark){
:root:not([data-theme="light"]) .side-nav a .count.hot,:root:not([data-theme="light"]) .tone-lime,:root:not([data-theme="light"]) .seg-new,:root:not([data-theme="light"]) .new-tag{background:color-mix(in srgb,#C8FF3D 20%,transparent);color:#DDEFB4}
:root:not([data-theme="light"]) .side-head .admin-pill{background:color-mix(in srgb,#C8FF3D 16%,transparent);color:#DDEFB4}
}
:root[data-theme="dark"] .side-nav a .count.hot,:root[data-theme="dark"] .tone-lime,:root[data-theme="dark"] .seg-new,:root[data-theme="dark"] .new-tag{background:color-mix(in srgb,#C8FF3D 20%,transparent);color:#DDEFB4}
:root[data-theme="dark"] .side-head .admin-pill{background:color-mix(in srgb,#C8FF3D 16%,transparent);color:#DDEFB4}
/* "new" is cleared by you, not by visiting */
button.new-tag{border:0;cursor:pointer;font:inherit;font-size:11px;font-weight:700;display:inline-flex;align-items:center;gap:5px;padding:2px 8px;border-radius:999px;margin-right:6px;vertical-align:1px}
button.new-tag .nt-x{display:inline-grid;place-items:center;width:14px;height:14px;border-radius:50%;background:rgba(255,255,255,.75);color:#3E5208;font-size:9px}
button.new-tag:hover{filter:brightness(.95)}
button.new-tag:hover .nt-x{background:#fff}
.new-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:-6px 0 16px;padding:10px 14px;border-radius:14px;background:color-mix(in srgb,#C8FF3D 14%,var(--surface));border:1px solid color-mix(in srgb,#A9C95A 45%,var(--line));font-size:14px}
.new-bar>span:nth-child(2){flex:1 1 260px}
.nb-dot{width:9px;height:9px;border-radius:50%;background:#9DBB4C;flex:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .new-bar{background:color-mix(in srgb,#C8FF3D 8%,var(--surface))}:root:not([data-theme="light"]) button.new-tag .nt-x{background:rgba(255,255,255,.15);color:#DDEFB4}}
:root[data-theme="dark"] .new-bar{background:color-mix(in srgb,#C8FF3D 8%,var(--surface))}
:root[data-theme="dark"] button.new-tag .nt-x{background:rgba(255,255,255,.15);color:#DDEFB4}
.jl-row{grid-template-columns:22px minmax(0,1.1fr) minmax(0,1.4fr) 118px 92px 196px 16px}
.jl-tags{gap:4px;align-items:center}
.jl-tags button.new-tag{margin-right:0}
@media (max-width:1100px){.jl-row{grid-template-columns:22px minmax(0,1fr) 112px 84px auto 16px}}
@media (max-width:760px){.jl-row{grid-template-columns:18px minmax(0,1fr) auto}}

/* ===== v20.2 started jobs: three clear colours ===== */
:root{--sa-cost:#6A4FD8;--sa-cost-bg:#EEEBFD;--sa-parts:#1F63C9;--sa-parts-bg:#E6EEFC;--sa-work:#137086;--sa-work-bg:#E2F3F7}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--sa-cost:#B4A6FF;--sa-cost-bg:rgba(150,130,255,.16);--sa-parts:#8DB6FF;--sa-parts-bg:rgba(110,160,255,.15);--sa-work:#7FD6E8;--sa-work-bg:rgba(100,200,225,.14)}}
:root[data-theme="dark"]{--sa-cost:#B4A6FF;--sa-cost-bg:rgba(150,130,255,.16);--sa-parts:#8DB6FF;--sa-parts-bg:rgba(110,160,255,.15);--sa-work:#7FD6E8;--sa-work-bg:rgba(100,200,225,.14)}
.sa-pill{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;font-size:12.5px;font-weight:650;white-space:nowrap}
.sa-pill strong{font-weight:800}
.sa-pill.sa-cost{background:var(--sa-cost-bg);color:var(--sa-cost)}
.sa-pill.sa-parts{background:var(--sa-parts-bg);color:var(--sa-parts)}
.sa-pill.sa-work{background:var(--sa-work-bg);color:var(--sa-work)}
.list-sum .sa-pill{margin-right:8px}
.sa-more{margin-left:8px;font-size:13px;color:var(--fg-2)}
.jl-next .sa-pill+.sa-more:empty{display:none}
.jl-row.sa-cost .jl-dot{background:var(--sa-cost);opacity:1}
.jl-row.sa-parts .jl-dot{background:var(--sa-parts);opacity:1}
.jl-row.sa-work .jl-dot{background:var(--sa-work);opacity:1}
.jl-row.sa-cost .jl-next>svg{color:var(--sa-cost)}
.jl-row.sa-parts .jl-next>svg{color:var(--sa-parts)}
.jl-row.sa-work .jl-next>svg{color:var(--sa-work)}
.jc-h.sa-h{display:flex;align-items:center;gap:8px;text-transform:none;letter-spacing:0;font-size:15px;font-weight:700}
.sa-dot{width:10px;height:10px;border-radius:50%}
.jc-h.sa-cost{color:var(--sa-cost)}.jc-h.sa-cost .sa-dot{background:var(--sa-cost)}
.jc-h.sa-parts{color:var(--sa-parts)}.jc-h.sa-parts .sa-dot{background:var(--sa-parts)}
.jc-h.sa-work{color:var(--sa-work)}.jc-h.sa-work .sa-dot{background:var(--sa-work)}
.jl-group:has(.sa-h.sa-cost) .card.jl{box-shadow:inset 4px 0 0 var(--sa-cost),var(--shadow-sm)}
.jl-group:has(.sa-h.sa-parts) .card.jl{box-shadow:inset 4px 0 0 var(--sa-parts),var(--shadow-sm)}
.jl-group:has(.sa-h.sa-work) .card.jl{box-shadow:inset 4px 0 0 var(--sa-work),var(--shadow-sm)}
.est-what{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.est-what .lbl{font-size:13px;font-weight:600;color:var(--fg-2);margin-right:4px}
.ew-opt{display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:0 14px;border-radius:999px;border:1px solid var(--line-2);background:var(--surface);font-size:14px;font-weight:600;color:var(--fg-2);cursor:pointer}
.ew-opt input{width:16px;height:16px;accent-color:var(--tint);margin:0}
.ew-opt.on{border-color:var(--tint);color:var(--tint);background:color-mix(in srgb,var(--tint) 7%,var(--surface))}
.est-parts{display:flex;flex-direction:column;gap:4px;margin:0 0 12px}
.est-parts .lbl{font-size:13px;font-weight:600;color:var(--fg-2)}
.ep-row{display:flex;align-items:center;gap:8px;font-size:14px;padding:4px 0}
.ep-row input{width:16px;height:16px;accent-color:var(--tint);margin:0}
.ep-row span{margin-left:auto;font-variant-numeric:tabular-nums;color:var(--fg-2)}

/* ===== v20.3 calmer job list: one soft label per job ===== */
.jl-row{grid-template-columns:8px minmax(0,1.1fr) minmax(0,1.5fr) 118px 92px 196px 16px}
.jl-sp{width:8px}
.jl-row.is-new,.jl-row.urgent,.jl-row.urgent.is-new,.jl-row.running,.jl-row.picked{box-shadow:none}
.jl-row.is-new{background:color-mix(in srgb,#C8FF3D 5%,var(--surface))}
.jl-row.running{background:color-mix(in srgb,#E2563E 4%,var(--surface))}
.jl-group .card.jl,.jl-group:has(.sa-h) .card.jl{box-shadow:var(--shadow-sm)}
.jc-h.sa-h{color:var(--fg-2)}
.jl-next{gap:10px}
.jp{display:inline-flex;align-items:center;gap:6px;flex:none;padding:3px 10px;border-radius:999px;font-size:12.5px;font-weight:600;white-space:nowrap;background:#F0F1F4;color:#4D5560}
.jp-d{font-size:13.5px;color:var(--fg-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.jp.live{background:#FDECEA;color:#B3261E}
.jp-rec{width:7px;height:7px;border-radius:50%;background:#D93A26;animation:rec-blink 1s steps(1,end) infinite}
.jp.paused{background:#FFF3DA;color:#8A5B00}
.jp.sa-cost{background:#F0EDFC;color:#5B48C2}
.jp.sa-parts{background:#E8F0FC;color:#2357A8}
.jp.sa-work{background:#E3F2F5;color:#1D6B7A}
.jp.scheduled{background:#EAF0F7;color:#3B5875}
.jp.unbooked{background:#F3F3F5;color:#5C5C66}
.jp.to_invoice{background:#E7F4EA;color:#2C6B3F}
.jp.invoiced{background:#EEF1F4;color:#4A5560}
.jp.overdue{background:#FDECEA;color:#B3261E}
.jp.paid{background:#EDF6EF;color:#3D6B4A}
.jp.cancelled,.jp.closed{background:#F3F3F3;color:#777}
.jl-urg{font-size:12px;font-weight:650;color:#B3261E;padding:2px 8px;border-radius:999px;background:#FDF0EE}
.jc-run{color:#B3261E;font-weight:650;font-variant-numeric:tabular-nums}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .jp{background:rgba(255,255,255,.08);color:#C9CDD3}
:root:not([data-theme="light"]) .jp.live,:root:not([data-theme="light"]) .jp.overdue{background:rgba(255,100,80,.16);color:#FF9C8C}
:root:not([data-theme="light"]) .jp.paused{background:rgba(255,190,80,.14);color:#F3C877}
:root:not([data-theme="light"]) .jp.sa-cost{background:rgba(150,130,255,.16);color:#BDB2FF}
:root:not([data-theme="light"]) .jp.sa-parts{background:rgba(110,160,255,.15);color:#9DBFFF}
:root:not([data-theme="light"]) .jp.sa-work,:root:not([data-theme="light"]) .jp.scheduled{background:rgba(100,200,225,.13);color:#93D9E8}
:root:not([data-theme="light"]) .jp.to_invoice,:root:not([data-theme="light"]) .jp.paid{background:rgba(110,210,150,.14);color:#9EDDB5}}
/* start / pause / stop */
.wk-btns{display:inline-flex;gap:4px}
.wkb{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:30px;height:30px;padding:0 9px;border:0;border-radius:999px;font:inherit;font-size:13.5px;font-weight:650;cursor:pointer}
.wkb.go{background:var(--tint-soft);color:var(--tint)}
.wkb.go:hover{background:var(--tint);color:var(--on-tint)}
.wkb.pause{background:#FFF3DA;color:#8A5B00}
.wkb.pause:hover{background:#FFE7B3}
.wkb.stop{background:#FDECEA;color:#B3261E}
.wkb.stop:hover{background:#FAD7D2}
.workbar .wkb{height:44px;padding:0 18px;font-size:15px}
.workbar.paused{background:#FFF8EA;box-shadow:inset 0 0 0 1px #F1D9A6;animation:none}
/* the floating timer: pause and resume too */
.ft-btn{display:inline-grid;place-items:center;width:40px;height:40px;border:0;border-radius:50%;background:rgba(255,255,255,.22);color:#fff;cursor:pointer}
.ft-btn:hover{background:rgba(255,255,255,.34)}
.ft-stop svg{color:#C9301A}
.ft-one.ft-paused{background:#8A5B00;animation:none;box-shadow:0 10px 30px rgba(90,60,0,.25)}
.ft-one.ft-paused .ft-stop svg{color:#8A5B00}
.ft-one.ft-paused .ft-stop{color:#8A5B00}
/* after Stop */
.overlay.center{display:flex;align-items:center;justify-content:center;padding:20px}
.stop-ov{background:rgba(16,24,32,.22)}
.stop-box{width:min(360px,100%);padding:24px 22px 18px;border-radius:22px;background:var(--surface);box-shadow:var(--shadow);text-align:center;animation:rise .25s var(--ease)}
.sb-ic{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#FDECEA;color:#B3261E;margin-bottom:8px}
.stop-box h3{margin:0 0 4px;font-size:19px}
.stop-box p{margin:0;color:var(--fg-2);font-size:14px}
.stop-box .sb-t{margin:6px 0 16px;font-size:15px;font-weight:600;color:var(--fg)}
.stop-box .actions{justify-content:center}
/* paused is calm slate, not brown */
.jp.paused{background:#ECEFF3;color:#46505C}
.wkb.pause{background:#ECEFF3;color:#46505C}
.wkb.pause:hover{background:#DDE2E8}
.workbar.paused{background:#F4F6F8;box-shadow:inset 0 0 0 1px #D9DEE5}
.ft-one.ft-paused{background:#56626F;box-shadow:0 10px 30px rgba(30,40,50,.22)}
.ft-one.ft-paused .ft-stop,.ft-one.ft-paused .ft-stop svg{color:#B3261E}
/* v21.0 all invoices */
.ia-jump{display:flex;justify-content:flex-end;margin:4px 0 -4px}
.ia-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;margin-bottom:10px}
.ia-tabs{display:flex;flex-wrap:wrap;gap:6px}
.ia-tab{display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:0 13px;border-radius:999px;border:1px solid var(--line,#e3e5e8);background:var(--card,#fff);color:var(--fg-2,#4a525c);font:inherit;font-size:14px;font-weight:600;cursor:pointer}
.ia-tab b{font-size:12px;font-weight:700;background:#EEF0F3;color:#46505C;border-radius:999px;padding:1px 7px}
.ia-tab.on{background:var(--fg,#1d1f22);color:#fff;border-color:transparent}
.ia-tab.on b{background:rgba(255,255,255,.18);color:#fff}
.ia-tab.bad b{background:#FBE7E6;color:#B3261E}
.ia-tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.ia-tools .search-in{min-width:220px}
.ia-tools select{min-height:38px}
.ia-list{background:var(--card,#fff);border:1px solid var(--line,#e3e5e8);border-radius:16px;overflow:hidden}
.ia-row{display:grid;grid-template-columns:150px 1.1fr 1.3fr 1fr 120px 190px;gap:12px;align-items:center;padding:11px 16px;cursor:pointer}
.ia-item+.ia-item,.ia-h+.ia-item{border-top:1px solid var(--line,#eceef1)}
.ia-item .ia-row:hover{background:rgba(0,0,0,.025)}
.ia-h{cursor:default;font-size:12px;font-weight:600;color:var(--fg-3,#7a828c);text-transform:uppercase;letter-spacing:.03em;padding-top:9px;padding-bottom:9px;background:rgba(0,0,0,.02)}
.ia-row .r,.ia-amt{text-align:right}
.ia-no strong{display:flex;align-items:center;gap:6px;font-size:15px}
.ia-no small,.ia-d small{display:block;font-size:12.5px;color:var(--fg-3,#7a828c);margin-top:1px}
.ia-d small.late{color:#B3261E;font-weight:600}
.ia-cl{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ia-d{font-size:14px}
.ia-amt{font-weight:700;font-size:15px;font-variant-numeric:tabular-nums}
.ia-act{display:flex;justify-content:flex-end}
.ia-ok{display:inline-flex;align-items:center;gap:4px;color:#2E7D4F;font-size:13px;font-weight:600}
.ia-pill{display:inline-block;font-size:12px;font-weight:600;padding:3px 10px;border-radius:999px;white-space:nowrap}
.ia-draft{background:#FFF4DE;color:#8A5A00}
.ia-wait{background:#E8F0FB;color:#2556A0}
.ia-late{background:#FBE7E6;color:#B3261E}
.ia-paid{background:#E6F4EA;color:#2E7D4F}
.ia-sub{padding:4px 16px 12px 178px;display:grid;gap:4px}
.ia-sj{display:grid;grid-template-columns:90px 1fr 90px 110px;gap:10px;text-align:left;font:inherit;font-size:13.5px;background:rgba(0,0,0,.025);border:0;border-radius:10px;padding:8px 12px;cursor:pointer}
.ia-sub .btn{justify-self:start}
.ia-foot{display:flex;justify-content:space-between;padding:12px 16px;border-top:1px solid var(--line,#eceef1);background:rgba(0,0,0,.02);font-size:14px}
@media (max-width:900px){
 .ia-h{display:none}
 .ia-row{grid-template-columns:1fr auto;gap:4px 12px}
 .ia-row>span:nth-child(1){grid-column:1/-1}
 .ia-cl{grid-column:1}.ia-amt{grid-row:2;grid-column:2}
 .ia-act{grid-column:1/-1;justify-content:flex-start}
 .ia-sub{padding-left:16px}
 .ia-tools .search-in{min-width:0;flex:1}
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .ia-tab b{background:#2a2e33;color:#cfd4da}:root:not([data-theme="light"]) .ia-tab.on{background:#f2f3f5;color:#111}}
/* v21.1 invoice year summary */
.iy{padding:16px 18px;margin-bottom:14px}
.iy-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 12px;margin-bottom:12px}
.iy-head h3{margin:0;font-size:17px;display:flex;align-items:center;gap:6px}
.iy-clear{font:inherit;font-size:14px;font-weight:600;border:0;background:#E8F0FB;color:#2556A0;border-radius:999px;padding:2px 10px;cursor:pointer}
.iy-k{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}
.iy-k>div{background:rgba(0,0,0,.025);border-radius:12px;padding:10px 12px}
.iy-k span{display:block;font-size:12.5px;color:var(--fg-3,#7a828c);font-weight:600}
.iy-k b{display:block;font-size:19px;margin:2px 0;font-variant-numeric:tabular-nums}
.iy-k small{font-size:12.5px;color:var(--fg-3,#7a828c)}
.iy-k .ok b{color:#2E7D4F}.iy-k .wait b{color:#2556A0}
.iy-m{display:grid;grid-template-columns:repeat(12,1fr);gap:6px}
.iy-mo{display:flex;flex-direction:column;align-items:center;gap:3px;font:inherit;background:none;border:1px solid transparent;border-radius:10px;padding:6px 2px;cursor:pointer}
.iy-mo:hover{background:rgba(0,0,0,.03)}
.iy-mo.on{border-color:#2556A0;background:#F2F6FC}
.iy-mo.none{opacity:.55}
.iy-bar{height:70px;width:22px;display:flex;align-items:flex-end;background:rgba(0,0,0,.04);border-radius:6px;overflow:hidden}
.iy-bar i.s{display:flex;align-items:flex-end;width:100%;background:#BFD3F0;border-radius:6px 6px 0 0;min-height:0}
.iy-bar i.p{display:block;width:100%;background:#6FB58A}
.iy-l{font-size:12px;font-weight:600}
.iy-v{font-size:11.5px;color:var(--fg-3,#7a828c);font-variant-numeric:tabular-nums}
.iy-leg{display:flex;gap:16px;margin-top:8px;font-size:12.5px;color:var(--fg-3,#7a828c)}
.iy-leg i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.iy-leg i.p{background:#6FB58A}.iy-leg i.s{background:#BFD3F0}
@media (max-width:700px){.iy-k{grid-template-columns:1fr 1fr}.iy-m{gap:2px}.iy-bar{width:14px;height:56px}.iy-v{display:none}}
.iy-k .iy-ok b{color:#2E7D4F}.iy-k .iy-wt b{color:#2556A0}
.ia-tools{flex-wrap:nowrap}.ia-tools .search-in{min-width:240px;flex:0 1 280px}.ia-tools select{width:auto;flex:none;min-width:120px}
@media (max-width:700px){.ia-tools{flex-wrap:wrap;width:100%}.ia-tools .search-in{flex:1 1 100%}}
.iy-mo{min-width:0}
@media (max-width:700px){.iy-l{font-size:10.5px}.iy-k b{font-size:17px}}
/* v21.2 job: client request box + machines picker */
.jd-rep{border:1px solid var(--line,#e3e5e8);border-radius:14px;background:var(--card,#fff);padding:10px 14px;margin:0 0 12px}
.jd-rep>summary{display:grid;grid-template-columns:auto auto 1fr;gap:4px 10px;align-items:center;cursor:pointer;list-style:none}
.jd-rep>summary::-webkit-details-marker{display:none}
.jd-rep .jr-l{font-size:12.5px;font-weight:700;color:var(--fg-3,#7a828c);text-transform:uppercase;letter-spacing:.03em}
.jd-rep .jr-t{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.jd-rep small{grid-column:2/-1;color:var(--fg-3,#7a828c);font-size:12.5px}
.mp{border:1px solid var(--line,#e3e5e8);border-radius:14px;padding:12px 14px;margin-bottom:14px;background:rgba(0,0,0,.015)}
.mp-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.mp-head strong{display:block;font-size:16px;margin-top:2px}
.mp-head small{display:block;color:var(--fg-3,#7a828c);font-size:13px;margin-top:2px}
.mp-add{margin-top:12px;padding:12px;border-radius:12px;background:var(--card,#fff);border:1px dashed var(--line,#d5d8dc)}
.mp-add .btn{margin-top:4px}
.mp-tools{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:12px 0 8px}
.mp-tools .search-in{flex:1 1 220px;min-width:0}
.mp-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:6px;max-height:340px;overflow:auto;padding:2px}
.mp-it{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:10px;background:var(--card,#fff);border:1px solid var(--line,#e6e8eb);cursor:pointer}
.mp-it input{width:18px;height:18px;flex:none;margin:0}
.mp-it span{min-width:0}
.mp-it strong{display:block;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mp-it small{display:block;font-size:12px;color:var(--fg-3,#7a828c);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mp-it.on{border-color:#2556A0;background:#F2F6FC}
.jc.ri .ri-sum{margin-top:10px;margin-bottom:0}
.jl-ago{margin-left:8px;font-size:12px;font-weight:600;color:#2556A0;background:#E8F0FB;border-radius:999px;padding:1px 8px;vertical-align:1px}
.wr.jc.ri.ri-picked{border-color:#9DB8E0;box-shadow:0 0 0 2px rgba(37,86,160,.12)}
.ri-row.on{background:#F2F6FC}
/* v21.3 client report */
.rep-box{background:var(--card,#fff);border-radius:20px;width:min(760px,calc(100vw - 32px));max-height:calc(100vh - 48px);display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.25);overflow:hidden}
.rb-head{display:flex;justify-content:space-between;gap:10px;padding:18px 20px 6px}
.rb-head h3{margin:0;font-size:19px}.rb-head p{margin:2px 0 0;color:var(--fg-3,#7a828c);font-size:14px}
.rb-bar{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:4px 20px}
.rb-mo{display:flex;align-items:center;gap:6px}.rb-mo strong{min-width:130px;text-align:center}
.rb-pr{display:flex;align-items:center;gap:6px;font-size:14px;cursor:pointer}
.rb-note{padding:0 20px;margin:4px 0 8px}
.rb-list{overflow:auto;padding:0 20px;flex:1}
.rb-job{border:1px solid var(--line,#e6e8eb);border-radius:14px;padding:12px 14px;margin-bottom:10px}
.rb-jh{display:flex;gap:10px;align-items:baseline;margin-bottom:4px}.rb-jh span{color:var(--fg-3,#7a828c);font-size:13.5px}
.rb-m{font-size:14px}.rb-w{color:#2E7D4F}
.rb-job dl{display:grid;grid-template-columns:130px 1fr;gap:3px 12px;margin:8px 0 0;font-size:14px}
.rb-job dt{color:var(--fg-3,#7a828c)}.rb-job dd{margin:0;white-space:pre-wrap}
.rb-miss{color:#B3261E}
.rb-tot{padding:6px 20px 0;margin:0;font-weight:600}
.rb-act{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;padding:14px 20px 18px;border-top:1px solid var(--line,#eceef1);margin-top:8px}
.ia-act{gap:6px;align-items:center}.ia-rep{color:var(--fg-3,#7a828c)}
@media (max-width:600px){.rb-job dl{grid-template-columns:1fr}.rb-bar{flex-wrap:wrap}}
/* v21.4 dashboard ongoing */
.dash-live{margin-bottom:16px;border:1px solid #F3C9C5}
.dash-live h2{display:flex;align-items:center;gap:8px}
.dl-rows{display:grid;gap:6px}
.dl-row{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;padding:10px 12px;border-radius:12px;background:#FDF3F2;cursor:pointer}
.dl-row.paused{background:#F1F3F6}
.dl-who strong{display:block}.dl-who small{color:var(--fg-3,#7a828c);font-size:13px}
.dl-clock{font-variant-numeric:tabular-nums;font-weight:700;color:#B3261E;font-size:16px}
.dl-row.paused .dl-clock{color:#56626F;font-size:14px;font-weight:600}
@media (max-width:600px){.dl-row{grid-template-columns:1fr auto}.dl-btn{grid-column:1/-1}}
.ia-row{grid-template-columns:150px 1.1fr 1.3fr 1fr 120px 236px}
@media (max-width:900px){.ia-row{grid-template-columns:1fr auto}}
.mp-list{max-height:none;overflow:visible}
.mp-more{margin:8px 2px 0}
/* v21.5 portal tags */
.pt-tag{display:inline-block;font-size:12px;font-weight:650;padding:2px 9px;border-radius:999px;white-space:nowrap;vertical-align:middle;letter-spacing:0}
.pt-on{background:#E6F4EA;color:#2E7D4F}
.pt-none{background:#EEF0F3;color:#5F6874}
.pt-off{background:#FBE7E6;color:#B3261E}
h1 .pt-tag{font-size:13px;margin-left:8px;vertical-align:6px}
.jw-row .pt-tag{margin-left:2px}
.pt-seg{display:inline-flex;gap:4px;background:rgba(0,0,0,.04);border-radius:999px;padding:3px}
.pt-b{border:0;background:none;font:inherit;font-size:13.5px;font-weight:600;color:var(--fg-2,#4a525c);padding:6px 12px;border-radius:999px;cursor:pointer}
.pt-b b{font-size:12px;color:var(--fg-3,#7a828c);margin-left:3px}
.pt-b.on{background:var(--card,#fff);color:var(--fg,#1d1f22);box-shadow:0 1px 2px rgba(0,0,0,.08)}
/* v21.6 client jobs sort/group */
.cj-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:14px}
.cj-bar .search-in{flex:1 1 240px;min-width:0}
.cj-sel{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;color:var(--fg-3,#7a828c);font-weight:600}
.cj-sel select{min-height:38px;width:auto}
.cj-g{margin-bottom:14px}
.cj-h{font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--fg-2,#4a525c);margin:16px 4px 8px;display:flex;gap:8px;align-items:baseline}
.cj-h span{font-size:12px;color:var(--fg-3,#7a828c)}
@media (max-width:600px){.cj-sel{flex:1 1 45%}.cj-sel select{flex:1}}
/* v21.7 needs attention */
.attn-box{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;border-radius:16px;border:1px dashed var(--line,#d5d8dc);background:var(--card,#fff);margin-bottom:16px}
.attn-box.on{border:1px solid #F2D49B;background:#FFF8EA}
.attn-box.edit{display:block;border:1px solid #F2D49B;background:#FFFCF5}
.ab-t{display:flex;gap:12px;align-items:flex-start}
.ab-t strong{display:block}.ab-t small{display:block;color:var(--fg-3,#7a828c);font-size:13px;margin-top:2px}
.ab-ic{flex:none;width:26px;height:26px;border-radius:50%;background:#F5B841;color:#fff;font-weight:800;display:inline-flex;align-items:center;justify-content:center;font-size:15px}
.ab-a{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.attn-box.edit .ab-a{margin-top:10px}
.ab-chips{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 12px}
.ab-chip{font:inherit;font-size:13.5px;border:1px solid var(--line,#e3e5e8);background:var(--card,#fff);border-radius:999px;padding:6px 12px;cursor:pointer}
.ab-chip.on{background:#8A5B00;border-color:#8A5B00;color:#fff}
.attn-sub{color:#8A5B00 !important;max-width:240px;white-space:normal}
.attn-cl{margin-top:6px;color:#8A5B00;font-weight:600}
.attn-hero{border:1px solid #F2D49B;background:#FFF8EA;margin-bottom:16px}
.ah-row{display:flex;gap:12px;align-items:center;padding:10px 0;border-top:1px solid #F3E3C0}
.ah-row:first-of-type{border-top:0}
.ah-row>div{flex:1;min-width:0}.ah-row strong{display:block}.ah-row small{color:#8A5B00;font-size:13.5px}
.attn-card{display:flex;gap:10px;align-items:center;background:#FFF8EA;border:1px solid #F2D49B;border-radius:12px;padding:10px 12px;margin:4px 0 12px}
.attn-card>div{flex:1;min-width:0}.attn-card strong{display:block;font-size:14px}.attn-card small{color:#8A5B00;font-size:13px}
/* v21.8 inbox flags */
.bubble{position:relative}
.msg-flag{position:absolute;top:-10px;right:-10px;width:26px;height:26px;border-radius:50%;border:1px solid var(--line,#e3e5e8);background:var(--card,#fff);color:var(--fg-3,#7a828c);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transition:opacity .15s}
.msg:hover .msg-flag,.msg-flag:focus-visible,.msg-flag.on{opacity:1}
.msg-flag.on{background:#E8590C;border-color:#E8590C;color:#fff}
.msg.mine .msg-flag{right:auto;left:-10px}
.bubble.flagged{box-shadow:0 0 0 2px #F7B27A}
.ib-fl{display:inline-flex;color:#E8590C;margin-right:5px;vertical-align:-1px}
.ib-flagbtn.on{background:#FFF0E6;color:#C2410C;border:0}
@media (hover:none){.msg-flag{opacity:.7}}
/* v21.9 report files */
.rep-file{display:flex;align-items:center;gap:10px;width:100%;text-align:left;font:inherit;color:var(--fg,#1d1f22);background:var(--card,#fff);border:1px solid var(--line,#e3e5e8);border-radius:12px;padding:9px 12px;margin-top:8px;cursor:pointer}
.rep-file:hover{border-color:#9DB8E0}
.rf-ic{flex:none;width:34px;height:34px;border-radius:9px;background:#E8F0FB;color:#2556A0;display:inline-flex;align-items:center;justify-content:center}
.rf-t{flex:1;min-width:0}.rf-t strong{display:block;font-size:14px}.rf-t small{display:block;font-size:12.5px;color:var(--fg-3,#7a828c)}
.rf-dl{display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:650;color:#2556A0}
.msg.mine .rep-file{color:var(--fg,#1d1f22)}
.rep-list{margin-bottom:16px}.rl-rows .rep-file:first-child{margin-top:0}
/* v22.0 client jobs like admin */
.cj-list .cj-item{border-bottom:1px solid var(--line)}
.cj-list .cj-item:last-child{border-bottom:0}
.cj-list .cj-row{border-bottom:0}
.cj-row>svg:last-child{transition:transform .15s}
.cj-item.open .cj-row>svg:last-child{transform:rotate(180deg)}
.cj-item.open .cj-row{background:color-mix(in srgb,var(--surface-2) 60%,transparent)}
.cj-item>div:not(.cj-row){padding:4px 22px 18px !important}
.cj-row .jp-d{color:var(--fg-3);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cj-bar+.toolbar{margin-top:-4px}
@media (max-width:760px){
 .cj-row{grid-template-columns:minmax(0,1fr) auto !important;gap:6px 10px;padding:12px 14px}
 .cj-row .jl-sp,.cj-row .jl-tags,.cj-row .jp-d,.cj-row>svg:last-child{display:none}
 .cj-row .jl-who{grid-column:1;grid-row:1}
 .cj-row .jl-when{grid-column:2;grid-row:1;text-align:right;align-items:flex-end}
 .cj-row .jl-next{grid-column:1;grid-row:2}
 .cj-row .jl-amt{grid-column:2;grid-row:2;display:block}
 .cj-item>div:not(.cj-row){padding:4px 14px 16px !important}
 .cj-bar .cj-sel{flex:1 1 100%}
}
/* v22.1 calendar new + recently booked */
.cc.is-new-ev{box-shadow:inset 3px 0 0 var(--ev),0 0 0 2px #A9C95A,0 0 0 5px color-mix(in srgb,#C8FF3D 30%,transparent)}
.cc-new{display:inline-block;align-self:flex-start;font-size:11px;font-weight:700;background:#E4F2B8;color:#3E5208;border-radius:999px;padding:1px 8px;margin-bottom:3px;cursor:pointer}
.mv-ev.is-new-ev{background:#E4F2B8 !important;color:#3E5208 !important;font-weight:600}
.cc.flash{animation:cc-flash 1.6s ease}
@keyframes cc-flash{0%,100%{transform:none}20%,60%{transform:scale(1.04);box-shadow:0 0 0 3px #2556A0}}
.cal-recent{margin-top:14px}
.wait.rb{grid-template-columns:1fr auto}
.rb-when{display:flex !important;align-items:center;gap:4px;color:var(--fg-2) !important;font-weight:600}
.rb-ago{font-size:12px;color:var(--fg-3);white-space:nowrap;align-self:flex-start}
.new-tag.sm{font-size:11px;padding:1px 7px;margin-right:6px;vertical-align:1px}
/* v22.2 client-visible fields */
.field.cv input,.field.cv textarea,.field.cv select,.cmp-row.cv textarea{background:#F3F7FD;box-shadow:inset 0 0 0 1px #DCE7F7}
.field.cv input:focus,.field.cv textarea:focus,.field.cv select:focus,.cmp-row.cv textarea:focus{background:#fff}
.cv-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#7FA3D8;margin-left:6px;vertical-align:2px}
.cv-legend{font-size:12.5px;color:var(--fg-3,#7a828c);margin:2px 2px 10px;display:flex;align-items:center;gap:2px}
.cv-legend .cv-dot{margin:0 6px 0 0}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .field.cv input,:root:not([data-theme="light"]) .field.cv textarea,:root:not([data-theme="light"]) .field.cv select,:root:not([data-theme="light"]) .cmp-row.cv textarea{background:#1E2633;box-shadow:inset 0 0 0 1px #2C3A50}}
.part input.cv-in{background:#F3F7FD;box-shadow:inset 0 0 0 1px #DCE7F7}
.part input.cv-in:focus{background:#fff}
/* v22.3 notes per machine */
.mn{border:1px solid var(--line,#e3e5e8);border-radius:14px;padding:12px 14px;margin:6px 0 14px;background:rgba(0,0,0,.015)}
.mn-head strong{display:block;font-size:16px;margin-top:2px}.mn-head small{display:block;color:var(--fg-3,#7a828c);font-size:13px;margin-top:2px}
.mn-only{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;color:var(--fg-2,#4a525c);cursor:pointer}
.mn-list{display:grid;gap:6px}
.mn-it{background:var(--card,#fff);border:1px solid var(--line,#e6e8eb);border-radius:12px}
.mn-it.has{border-color:#C9DAF2}
.mn-row{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1.2fr) auto;gap:10px;align-items:center;width:100%;text-align:left;font:inherit;color:inherit;background:none;border:0;padding:9px 12px;cursor:pointer}
.mn-row>svg:last-child{color:var(--fg-3);transition:transform .15s}.mn-it.open .mn-row>svg:last-child{transform:rotate(180deg)}
.mn-t strong{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mn-t small{display:block;font-size:12px;color:var(--fg-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mn-prev{font-size:13px;color:var(--fg-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mn-it.has .mn-prev{color:#2556A0}
.mn-f{padding:0 12px 12px;margin:0}
.mn-quick{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.mn-h{color:#2556A0 !important}
.rb-mn{font-size:13px;color:#3c4650;margin:1px 0 4px 10px}
@media (max-width:600px){.mn-row{grid-template-columns:auto minmax(0,1fr) auto}.mn-prev{display:none}}
.form>.mn{grid-column:1/-1}


/* Static controls and approved team accent. */
summary.lang-btn{list-style:none}summary.lang-btn::-webkit-details-marker{display:none}.lang-menu a{display:flex;align-items:center;min-height:42px;padding:0 12px;border-radius:11px;color:var(--fg);font-size:14.5px;text-decoration:none}.lang-menu a:hover{background:var(--surface-2)}.lang-menu a[aria-current=page]{font-weight:600}#about .team-card{background:linear-gradient(90deg,rgba(42,138,162,.10) 0%,rgba(79,143,207,.10) 55%,rgba(126,120,210,.10) 100%)}#about .team-card .avatar{display:flex;align-items:center;justify-content:center;box-sizing:border-box;padding:0;gap:0;line-height:1;text-align:center;border-radius:50%;background:linear-gradient(135deg,#dce9ed 0%,#dce3ef 60%,#e5e2ef 100%);color:#345b6d;box-shadow:inset 0 0 0 1px rgba(52,91,109,.06)}#how-it-works img{opacity:.8}.page-hero .seg-card:nth-child(1){background:linear-gradient(170deg,#E3F7FB 0%,var(--surface) 70%)}.page-hero .seg-card:nth-child(2){background:linear-gradient(170deg,#E9EEFE 0%,var(--surface) 70%)}.page-hero .seg-card:nth-child(3){background:linear-gradient(170deg,#E7FBF2 0%,var(--surface) 70%)}.page-hero .seg-card:nth-child(4){background:linear-gradient(170deg,#F3FCDD 0%,var(--surface) 70%)}.page-hero .seg-card:nth-child(5){background:linear-gradient(170deg,#F0EBFD 0%,var(--surface) 70%)}.page-hero .seg-card:nth-child(6){background:linear-gradient(170deg,#E6F2F8 0%,var(--surface) 70%)}.page-hero .seg-card>.ic{color:var(--fg)}.planned-notice{max-width:900px;margin:20px auto;padding:12px 18px;border:1px solid var(--line);border-radius:14px;background:var(--surface-2);font-size:13px;color:var(--fg-2)}.contact-strip{grid-template-columns:repeat(2,minmax(0,1fr))}@media(max-width:600px){.contact-strip{grid-template-columns:1fr}}