/* Bow Tie Plumbing portal — OfficeDesk OS */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Oswald:wght@400;500;600;700&display=swap');
:root {
  --navy: #1e3a5f;       /* Phase 1: Bow Tie brand navy */
  --navy-deep: #152a45;  /* Phase 1: darkened gradient shade */
  --red: #c0272d;        /* Phase 1: Bow Tie brand red */
  --blue: #1e5aa8;
  --accent: #1e3a5f;  /* Bow Tie Classic Light: navy accent */
  --teal: #1e3a5f;
  --slate: #5b6b84;
  --bg: #edf1f7;
  --card: #ffffff;
  --ink: #12233f;
  --muted: #5d6b82;
  --line: #d5dde9;
  --warn: #c2410c;
  --ok: #157347;
  --radius: 18px;
  --radius-sm: 12px;
  color-scheme: light;
  box-sizing: border-box;
  padding-bottom: env(safe-area-inset-bottom, 0px);
}
*, *::before, *::after { box-sizing: inherit; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font: 16px/1.5 -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  overflow-x: hidden;
}
a { color: var(--blue); }
h1, h2 { line-height: 1.15; margin: 0 0 .5rem; letter-spacing: -0.02em; }
h1 { font-size: clamp(1.6rem, 5vw, 2.2rem); font-weight: 800; }
h2 { font-size: 1.2rem; font-weight: 750; }
p { margin: 0 0 .75rem; }
.muted { color: var(--muted); }
.small { font-size: .875rem; }
.center { text-align: center; }
.warn, .warn-text { color: var(--warn); }
.ic { width: 1.25em; height: 1.25em; flex: none; }
:focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; border-radius: 6px; }

/* Header */
.top {
  background: linear-gradient(180deg, var(--navy) 0%, var(--navy-deep) 100%);
  color: #fff;
  position: sticky;
  top: 0;
  z-index: 10;
  padding-top: env(safe-area-inset-top, 0px);
  box-shadow: 0 1px 0 rgba(255,255,255,.06) inset, 0 6px 18px rgba(11,29,56,.18);
}
.top-inner { max-width: 1040px; margin: 0 auto; padding: .75rem 1rem; display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.25rem; }
.brand { display: flex; align-items: center; gap: .75rem; color: #fff; text-decoration: none; margin-right: auto; }
.brand img { border-radius: 12px; box-shadow: 0 0 0 1px rgba(255,255,255,.14); }
.brand-text strong { display: block; font-size: 1.05rem; letter-spacing: .04em; text-transform: uppercase; font-weight: 800; }
.brand-text small { display: block; color: #a9b8d1; font-weight: 600; font-size: .8rem; }
/* Bow Tie brand header — matches Command Center header style */
.brand.od-product-brand{margin-left:0;margin-right:0;order:3;gap:12px;flex-shrink:0}
@media (max-width:480px){.top{padding-top:calc(env(safe-area-inset-top,0px) + 16px)}}
.brand-logo{width:48px;height:48px;flex-shrink:0;display:grid;place-items:center;background:var(--red);border-radius:10px}
.brand-logo img{width:38px;height:38px;object-fit:contain}
.brand-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;font:600 20px/1.1 'Oswald','Arial Narrow',sans-serif;letter-spacing:.025em;color:#fff}
.brand-name em{color:#b8860b;font-style:normal}
@media (max-width:480px){
.brand-logo{width:44px;height:44px;border-radius:9px}
.brand-logo img{width:34px;height:34px}
.brand-name{font-size:17px}
.brand.od-product-brand{gap:8px}
}
@media (max-width:600px){
.top-inner{display:flex!important;flex-wrap:nowrap!important;justify-content:flex-start!important;align-items:center!important}
.brand.od-product-brand{order:3;margin-left:0;margin-right:0;flex-shrink:0}
}

.nav { display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: .5rem; flex: 1 1 100%; }
.nav a, .nav button {
  display: block; width: 100%; text-align: center; padding: .6rem .5rem; border-radius: var(--radius-sm);
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.18); color: #fff;
  font: inherit; font-weight: 700; font-size: .95rem; text-decoration: none; cursor: pointer; white-space: nowrap;
}
.nav a.on { background: rgba(255,255,255,.18); border-color: rgba(255,255,255,.35); }
.nav form { margin: 0; }
@media (min-width: 760px) {
  .nav { flex: 0 1 auto; display: flex; }
  .nav a, .nav button { padding: .5rem 1rem; }
}

/* Layout */
.wrap { max-width: 1040px; margin: 0 auto; padding: 1.25rem 1rem 2.5rem; }
.foot { text-align: center; color: var(--muted); font-size: .8rem; padding: 0 1rem 2rem; }
.panel { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.25rem; margin-bottom: 1rem; }
.panel-head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; margin-bottom: .75rem; }
.panel-head h1, .panel-head h2 { margin: 0; }
.hello { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; flex-wrap: wrap; margin: .5rem 0 1.25rem; }
.hello h1 { font-size: clamp(2.2rem, 9vw, 3.2rem); letter-spacing: -0.035em; margin-bottom: .25rem; }
.chip { display: inline-flex; align-items: center; gap: .5rem; background: #fff; border: 1px solid var(--line); border-radius: 999px; padding: .5rem 1rem; color: var(--muted); font-weight: 600; white-space: nowrap; }
.backlink { display: inline-flex; align-items: center; gap: .25rem; font-weight: 700; text-decoration: none; margin-bottom: .75rem; color: var(--navy); }

/* Buttons */
.btn, .btn-ghost {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: 46px; padding: .65rem 1.25rem; border-radius: var(--radius-sm);
  font: inherit; font-weight: 750; text-decoration: none; cursor: pointer; border: 1px solid transparent;
}
.btn { background: var(--navy); color: #fff; }
.btn:hover { background: var(--navy-deep); }
.btn-ghost { background: #f3f6fb; color: var(--navy); border-color: var(--line); }
.btn-ghost:hover { background: #e7edf6; }
.btn.small, .btn-ghost.small { min-height: 44px; padding: .4rem .9rem; font-size: .9rem; }
.btn-block { width: 100%; }

/* Tools */
.tools { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
@media (min-width: 760px) { .tools { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.tool {
  display: flex; flex-direction: column; gap: .35rem; padding: 1rem; min-height: 132px;
  border: 1px solid var(--line); border-radius: var(--radius); text-decoration: none; color: var(--ink); background: #fbfcfe;
}
.tool:hover { border-color: #b7c4d8; background: #fff; }
.tool:active { transform: scale(.985); }
.tool-ic { display: inline-grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; font-size: 1.2rem; flex: none; }
.tool-ic.big { width: 72px; height: 72px; border-radius: 20px; font-size: 1.9rem; margin-bottom: .75rem; }
.tool-name { font-weight: 800; line-height: 1.2; margin-top: .35rem; }
.tool-desc { font-size: .85rem; color: var(--muted); line-height: 1.35; }
.tone-red { background: #fde8ea; color: var(--red); }
.tone-navy { background: #e4eaf4; color: var(--navy); }
.tone-blue { background: #e3ecfb; color: var(--blue); }
.tone-teal { background: #dff3ef; color: var(--teal); }
.tone-slate { background: #e8ecf2; color: var(--slate); }
.tool-hero { text-align: center; padding: 2rem 1.25rem; }
.tool-hero p { max-width: 46ch; margin-left: auto; margin-right: auto; }

/* Stats */
.stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin-bottom: 1rem; }
@media (min-width: 760px) { .stats-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.stat { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 1rem; }
.panel .stat { background: #fbfcfe; }
.stat-label { display: block; color: var(--muted); font-size: .85rem; font-weight: 600; }
.stat-num { display: block; font-size: 2rem; font-weight: 800; letter-spacing: -0.03em; line-height: 1.1; margin-top: .25rem; }

/* Grouped admin links */
.group { padding: 0; overflow: hidden; }
.group-head { display: flex; align-items: center; gap: .85rem; padding: 1rem 1.25rem; border-bottom: 1px solid var(--line); }
.group-head h2 { margin: 0; }
.tone-blue-soft { background: #f0f5fd; }
.tone-red-soft { background: #fdf2f3; }
.tone-slate-soft { background: #f4f6f9; }
.row-link, .row-static { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.25rem; border-top: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.row-link:first-of-type, .row-static:first-of-type { border-top: 0; }
.row-link:hover { background: #f8fafd; }
.row-link strong, .row-static strong { display: block; }
.row-link small, .row-static small { display: block; color: var(--muted); }
.chev { color: var(--muted); font-size: 1.5rem; line-height: 1; }

/* Forms */
.form { display: grid; gap: 1rem; }
.form h2 { margin: .5rem 0 0; }
label { display: grid; gap: .35rem; font-weight: 700; font-size: .95rem; }
.hint { font-weight: 500; color: var(--muted); font-size: .85rem; }
input[type=text], input[type=email], input[type=password], input[type=tel], input[type=search], select {
  width: 100%; min-height: 48px; padding: .65rem .85rem; border: 1px solid var(--line); border-radius: var(--radius-sm);
  font: inherit; font-size: 16px; color: var(--ink); background: #fff;
}
input:disabled { background: #f1f4f8; color: var(--muted); }
input:focus, select:focus { border-color: var(--blue); outline: 3px solid rgba(42,100,201,.18); outline-offset: 0; }
.two { display: grid; gap: 1rem; }
@media (min-width: 560px) { .two { grid-template-columns: 1fr 1fr; } }
.suffix { display: flex; align-items: stretch; }
.suffix input { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.suffix span { display: grid; place-items: center; padding: 0 .9rem; border: 1px solid var(--line); border-left: 0; border-radius: 0 var(--radius-sm) var(--radius-sm) 0; background: #f3f6fb; font-weight: 700; color: var(--muted); }
.check { display: flex; align-items: flex-start; gap: .65rem; font-weight: 700; }
.check input { width: 22px; height: 22px; margin-top: 2px; accent-color: var(--navy); }
.check .hint { display: block; }
.filters { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.filters input { flex: 1 1 220px; }
.filters select { flex: 0 1 180px; width: auto; }

/* Auth */
.auth { max-width: 440px; margin: 1.5rem auto; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.5rem; }
.auth.wide { max-width: 620px; }
.auth-logo { display: block; margin: 0 auto 1rem; border-radius: 18px; }
.auth h1 { text-align: center; font-size: 1.6rem; }
.auth.wide h1 { text-align: left; }

/* Messages */
.flash { padding: .8rem 1rem; border-radius: var(--radius-sm); margin-bottom: 1rem; font-weight: 600; border: 1px solid; }
.flash-success { background: #e8f6ee; border-color: #b6e0c7; color: var(--ok); }
.flash-error { background: #fdecec; border-color: #f3c0c3; color: #c0272d; }
.notice h1 { font-size: 1.5rem; }
.empty { text-align: center; padding: 2rem 1rem; color: var(--muted); }
.temp-pw { border: 2px solid var(--navy); background: #f4f7fc; }
.temp-row { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; margin: .5rem 0 .75rem; }
.temp-row code { font: 700 1.35rem/1.2 ui-monospace, "SF Mono", Menlo, Consolas, monospace; background: #fff; border: 1px dashed var(--navy); border-radius: 10px; padding: .55rem .85rem; letter-spacing: .02em; user-select: all; }

/* Badges & people */
.badge { display: inline-block; padding: .2rem .65rem; border-radius: 999px; font-size: .78rem; font-weight: 800; background: #e8ecf2; color: var(--slate); }
.role-owner { background: #fde8ea; color: #c0272d; }
.role-admin { background: #e4eaf4; color: var(--navy); }
.role-office { background: #dff3ef; color: #0d6b5f; }
.role-technician { background: #e3ecfb; color: #1d4f9f; }
.badge-off { background: #eef0f3; color: #7a8698; }
.people { list-style: none; margin: 0; padding: 0; }
.people li + li { border-top: 1px solid var(--line); }
.person { display: flex; align-items: center; gap: .85rem; padding: .85rem .25rem; color: var(--ink); text-decoration: none; }
.person:hover { background: #f8fafd; }
.avatar { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--navy); color: #fff; font-weight: 800; font-size: .9rem; flex: none; }
.person-main { flex: 1; min-width: 0; }
.person-main strong, .person-main small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.person-main small { color: var(--muted); }
.person-meta { display: flex; flex-direction: column; align-items: flex-end; gap: .2rem; text-align: right; }
.person-meta small { color: var(--muted); font-size: .78rem; }
.facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: .75rem; margin: 0 0 .75rem; }
.facts dt { color: var(--muted); font-size: .85rem; font-weight: 600; }
.facts dd { margin: 0; font-weight: 700; overflow-wrap: anywhere; }

/* Timeline */
.timeline { list-style: none; margin: 0; padding: 0; }
.timeline li { display: grid; gap: .1rem; padding: .75rem 0 .75rem 1rem; border-left: 3px solid var(--line); margin-left: .25rem; }
.timeline li + li { border-top: 1px solid #f0f3f7; }
.timeline small { color: var(--muted); }
.timeline .changes { font-size: .88rem; color: var(--ink); overflow-wrap: anywhere; }

/* Add-to-home sheet */
.sheet { position: fixed; inset: 0; background: rgba(11,29,56,.45); display: grid; align-items: end; z-index: 50; padding: 1rem; padding-bottom: calc(1rem + env(safe-area-inset-bottom, 0px)); }
.sheet[hidden] { display: none; }
.sheet-card { background: #fff; border-radius: var(--radius); padding: 1.25rem; max-width: 480px; width: 100%; margin: 0 auto; }

@media (prefers-reduced-motion: reduce) { * { transition: none !important; } .tool:active { transform: none; } }

/* ===== Modules (v2) ===== */
.stat-sub { display: block; color: var(--muted); font-size: .8rem; margin-top: .2rem; }
.stats-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.stats-3 .stat:last-child { grid-column: 1 / -1; }
@media (min-width: 760px) { .stats-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .stats-3 .stat:last-child { grid-column: auto; } }
.muted-light { color: #a9b8d1; display: block; }
.h-sub { display: block; font-size: .95rem; font-weight: 600; letter-spacing: 0; margin-top: .2rem; }
.pre { white-space: normal; }
.note { background: #fff8e6; border: 1px solid #f1dfae; border-radius: var(--radius-sm); padding: .65rem .85rem; color: #5a4a1a; }
.or { text-align: center; color: var(--muted); font-size: .85rem; margin: .25rem 0; }
.center-row { justify-content: center; }
.warn { color: var(--warn) !important; }

/* Callouts on home */
.callouts { display: grid; gap: .6rem; margin-bottom: 1rem; }
@media (min-width: 760px) { .callouts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.callout { display: flex; align-items: center; gap: .85rem; padding: .9rem 1rem; background: #fff; border: 1px solid var(--line); border-left: 5px solid var(--navy); border-radius: var(--radius-sm); color: var(--ink); text-decoration: none; }
.callout .ic { font-size: 1.4rem; color: var(--navy); }
.callout strong { display: block; }
.callout small { color: var(--muted); }
.callout.alert { border-left-color: var(--red); }
.callout.alert .ic { color: var(--red); }

/* Buttons extra */
.btn-row { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.btn-row form { margin: 0; }
.btn-text { min-height:44px; min-width:44px; background: none; border: 0; padding: .4rem .2rem; font: inherit; font-weight: 700; color: var(--blue); cursor: pointer; display: inline-flex; align-items: center; gap: .3rem; text-decoration: none; }
.btn-text.danger, .danger { color: #b4232b; }
.btn-danger { display: inline-flex; align-items: center; gap: .5rem; min-height: 46px; padding: .65rem 1.25rem; border-radius: var(--radius-sm); background: #fdecec; color: #c0272d; border: 1px solid #f3c0c3; font: inherit; font-weight: 750; cursor: pointer; }
.btn-big { min-height: 58px; font-size: 1.1rem; }
button[disabled], .btn[disabled] { opacity: .5; cursor: not-allowed; }

/* Tabs, chips, segmented */
.tabs { display: flex; gap: .35rem; overflow-x: auto; margin: 0 0 1rem; padding-bottom: 2px; scrollbar-width: none; }
.tabs::-webkit-scrollbar { display: none; }
.tabs a { min-height:44px;min-width:44px;display:inline-flex;align-items:center; white-space: nowrap; padding: .5rem .9rem; border-radius: 999px; background: #f0f3f8; color: var(--navy); font-weight: 700; text-decoration: none; font-size: .92rem; border: 1px solid var(--line); }
.tabs a.on { background: var(--navy); color: #fff; border-color: var(--navy); }
.count { display: inline-grid; place-items: center; min-width: 1.4em; height: 1.4em; padding: 0 .35em; border-radius: 999px; background: var(--red); color: #fff; font-size: .75rem; font-weight: 800; margin-left: .25rem; }
.muted-count { background: #cfd8e5; color: var(--navy); }
.tabs a.on .muted-count { background: rgba(255,255,255,.25); color: #fff; }
.chips { display: flex; gap: .4rem; overflow-x: auto; padding: .75rem 0 .25rem; scrollbar-width: none; }
.chips::-webkit-scrollbar { display: none; }
.chip-btn { white-space: nowrap; padding: .5rem .95rem; border-radius: 999px; border: 1px solid var(--line); background: #fff; color: var(--ink); font: inherit; font-weight: 650; font-size: .9rem; cursor: pointer; }
.chip-btn.on { background: var(--navy); border-color: var(--navy); color: #fff; }
.seg { display: grid; grid-template-columns: 1fr 1fr; background: #e9eef5; border-radius: 14px; padding: 4px; margin-bottom: 1rem; }
.seg button { border: 0; background: none; padding: .7rem; border-radius: 11px; font: inherit; font-weight: 750; color: var(--muted); cursor: pointer; }
.seg button.on { background: #fff; color: var(--navy); box-shadow: 0 1px 3px rgba(17,40,74,.15); }

/* Badges by status */
.badge-new { background: #e7f6ee; color: var(--ok); }
.est-draft, .cj-draft, .st-unscheduled { background: #eef0f3; color: #5d6b82; }
.est-presented, .st-scheduled, .cj-submitted { background: #e3ecfb; color: #1d4f9f; }
.est-sold, .st-completed, .cj-approved { background: #e5f5ec; color: var(--ok); }
.est-declined, .st-cancelled { background: #f3f3f3; color: #8a8a8a; }
.st-en_route, .st-in_progress { background: #fff2dc; color: #9a5b00; }
.cj-returned { background: #fde8ea; color: #c0272d; }

/* Lists */
.list-group { padding: .9rem .25rem .3rem; font-weight: 800; color: var(--muted); font-size: .85rem; border-top: 0 !important; }
.avatar.alt { background: #e3ecfb; color: var(--navy); }
.boxed { background: #f7f9fc; border: 1px solid var(--line); border-radius: var(--radius); padding: 1rem; margin-bottom: 1rem; }
.inline-add { display: flex; gap: .5rem; margin: .75rem 0; }
.inline-add input { flex: 1; }
.cat-row { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.cat-row input[type=text] { flex: 1 1 200px; }
input.narrow, .narrow { width: 90px; flex: none; }
input[type=number], input[type=date], textarea { width: 100%; min-height: 48px; padding: .65rem .85rem; border: 1px solid var(--line); border-radius: var(--radius-sm); font: inherit; font-size: 16px; color: var(--ink); background: #fff; }
textarea { min-height: 0; resize: vertical; }
input[type=file] { font: inherit; }
.prefix { display: flex; align-items: stretch; }
.prefix input { border-top-left-radius: 0; border-bottom-left-radius: 0; }
.prefix span { display: grid; place-items: center; padding: 0 .8rem; border: 1px solid var(--line); border-right: 0; border-radius: var(--radius-sm) 0 0 var(--radius-sm); background: #f3f6fb; font-weight: 700; color: var(--muted); }
.three { display: grid; gap: 1rem; }
@media (min-width: 640px) { .three { grid-template-columns: repeat(3, 1fr); } }
fieldset.plain { border: 0; padding: 0; margin: 0; min-width: 0; display: grid; gap: 1rem; }
fieldset.pick { border: 1px solid var(--line); border-radius: var(--radius); padding: .75rem 1rem 1rem; margin: 0; min-width: 0; }
fieldset.pick legend { font-weight: 800; padding: 0 .35rem; }
.pick-list { max-height: 320px; overflow-y: auto; margin-top: .5rem; display: grid; gap: .25rem; }
.pick-row { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .3rem 0; border-bottom: 1px solid #f0f3f7; }
.pick-row[hidden] { display: none; }
.label-like { display: block; font-weight: 700; font-size: .95rem; margin-bottom: .35rem; }
.summary-h2 { font-size: 1.2rem; font-weight: 750; cursor: pointer; }
details.mini summary { min-height:44px; display:flex; align-items:center; cursor: pointer; color: var(--blue); font-weight: 700; font-size: .9rem; padding: .25rem 0; }
.facts.tight { grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: .4rem; margin: .5rem 0 0; font-size: .9rem; }

/* Price book browse */
.pb-list, .pick-items { list-style: none; margin: .5rem 0 0; padding: 0; }
.pb-row[hidden] { display: none; }
.pb-row details { border: 1px solid var(--line); border-radius: var(--radius-sm); margin-bottom: .5rem; background: #fbfcfe; }
.pb-row summary { display: flex; justify-content: space-between; gap: 1rem; align-items: center; padding: .85rem 1rem; cursor: pointer; list-style: none; }
.pb-row summary::-webkit-details-marker { display: none; }
.pb-name { font-weight: 750; }
.pb-price { font-weight: 800; color: var(--red); white-space: nowrap; }
.pb-detail { padding: 0 1rem 1rem; }
.suggest { display: grid; gap: .5rem; margin-top: .5rem; }
.pick-items li { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: .75rem; padding: .85rem 1rem; border: 1px solid var(--line); border-radius: var(--radius); margin-bottom: .5rem; background: #fff; }
.pi-name { font-weight: 750; line-height: 1.25; }
.pi-price { text-align: right; font-weight: 800; color: var(--navy); line-height: 1.1; }
.pi-price small { display: block; font-weight: 600; color: var(--muted); font-size: .75rem; }
.add-btn { border: 0; background: #e8eef8; color: var(--red); font: inherit; font-weight: 800; padding: .7rem 1rem; border-radius: 12px; cursor: pointer; min-width: 64px; }
.add-btn:active { background: #d9e3f2; }

/* Estimate lines */
.cust-card { display: grid; gap: .2rem; padding: .85rem 1rem; border: 1px solid var(--line); border-radius: var(--radius-sm); background: #fbfcfe; }
.lines { list-style: none; margin: 0; padding: 0; }
.line { padding: .85rem 0; border-top: 1px solid var(--line); }
.line:first-child { border-top: 0; }
.line-top { display: flex; justify-content: space-between; gap: 1rem; align-items: baseline; }
.line-name { font-weight: 750; }
.line-total { font-weight: 800; white-space: nowrap; }
.line-desc { color: var(--muted); font-size: .9rem; margin: .25rem 0 0; }
.line-meta { color: var(--muted); font-size: .8rem; margin: .2rem 0 0; }
.line-actions { display: flex; justify-content: space-between; align-items: center; gap: .75rem; margin-top: .4rem; flex-wrap: wrap; }
.line-actions form { margin: 0; }
.qty-label { display: inline-flex; align-items: center; gap: .5rem; font-size: .9rem; }
.qty-label input { width: 80px; min-height: 40px; }
.suggest-box { background: #f0f5fd; border: 1px solid #cfdcf3; border-radius: var(--radius-sm); padding: .8rem 1rem; margin-bottom: 1rem; }
.suggest-list { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .5rem; }
.calc-box { display: grid; gap: .2rem; background: var(--navy); color: #fff; border-radius: var(--radius); padding: 1rem 1.1rem; }
.calc-box span { color: #a9b8d1; font-size: .85rem; font-weight: 600; }
.calc-box strong { font-size: 1.8rem; letter-spacing: -0.02em; }
.calc-box small { color: #a9b8d1; }
.calc-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: .6rem; padding-bottom: .75rem; margin-bottom: .5rem; border-bottom: 1px solid rgba(255,255,255,.15); }
.calc-grid strong { font-size: 1.05rem; display: block; }
.calc-main { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; }
.sticky-total { position: sticky; bottom: 0; z-index: 5; display: flex; align-items: center; justify-content: space-between; gap: 1rem; background: var(--navy-deep); color: #fff; border-radius: var(--radius); padding: .75rem .9rem .75rem 1.1rem; margin-top: 1rem; padding-bottom: calc(.75rem + env(safe-area-inset-bottom, 0px)); box-shadow: 0 -6px 20px rgba(11,29,56,.2); }
.sticky-total small { display: block; color: #a9b8d1; font-size: .78rem; }
.sticky-total strong { font-size: 1.45rem; }
.sticky-total .btn { background: var(--red); }
.sticky-save { position: sticky; bottom: 0; padding: .75rem 0 calc(.75rem + env(safe-area-inset-bottom, 0px)); background: linear-gradient(transparent, var(--bg) 30%); }

/* Presentation */
.present-mode { background: #e9edf3; }
.present { max-width: 760px; margin: 0 auto; }
.present-card { background: #fff; border-radius: 22px; padding: 1.5rem; margin-bottom: 1rem; border: 1px solid var(--line); }
.present-head { display: flex; align-items: center; gap: .85rem; padding-bottom: 1rem; border-bottom: 3px solid var(--red); margin-bottom: 1rem; }
.present-head img { border-radius: 14px; }
.present-brand { display: block; font-size: 1.3rem; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; color: var(--navy); }
.present-meta { display: flex; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.present-meta div { display: grid; gap: .1rem; }
.present-meta .right { text-align: right; }
.present-title { font-size: 1.5rem; margin: .5rem 0 1rem; }
.present-lines { list-style: none; margin: 0; padding: 0; }
.present-lines li { padding: .9rem 0; border-bottom: 1px solid var(--line); }
.present-total { display: flex; justify-content: space-between; align-items: baseline; padding: 1rem 0; font-size: 1.15rem; font-weight: 700; }
.present-total strong { font-size: 2rem; color: var(--navy); }
.sig-head { display: flex; justify-content: space-between; align-items: center; }
.sig-pad { width: 100%; height: 190px; border: 2px dashed #9fb0c9; border-radius: var(--radius-sm); background: #fbfcfe; touch-action: none; display: block; }
.sign-area { border-top: 1px solid var(--line); padding-top: 1rem; margin-top: .5rem; }
.signed { display: grid; gap: .4rem; border-top: 1px solid var(--line); padding-top: 1rem; }
.signed img { max-width: 320px; width: 100%; border-bottom: 2px solid var(--ink); }
.thanks { text-align: center; }
.present-tools { display: flex; justify-content: space-between; gap: .5rem; flex-wrap: wrap; }
@media print {
  .top, .foot, .no-print, .sticky-total, .flash { display: none !important; }
  body, .present-mode { background: #fff; }
  .present-card { border: 0; padding: 0; }
  .wrap { padding: 0; }
}

/* Schedule */
.day-nav { align-items: center; }
.day-nav input[type=date] { flex: 1 1 160px; width: auto; }
.window { margin-top: 1rem; }
.window-h { display: flex; justify-content: space-between; align-items: baseline; font-size: 1.05rem; margin: 0 0 .5rem; padding-bottom: .35rem; border-bottom: 2px solid var(--navy); }
.window-h .muted { font-size: .85rem; font-weight: 600; }
.window-empty { margin: .25rem 0 .5rem; }
.job-card { display: flex; justify-content: space-between; gap: .75rem; padding: .8rem .9rem; border: 1px solid var(--line); border-left: 4px solid var(--blue); border-radius: var(--radius-sm); margin-bottom: .5rem; color: var(--ink); text-decoration: none; background: #fff; }
.job-main, .job-side { display: grid; gap: .1rem; }
.job-side { justify-items: end; text-align: right; }
.job-main small, .job-side small { color: var(--muted); }
.attention-panel { border-left: 5px solid var(--red); }
.window-pick { display: flex; flex-wrap: wrap; gap: .5rem; }
.radio-pill { display: inline-flex; font-weight: 700; }
.radio-pill input { position: absolute; opacity: 0; pointer-events: none; }
.radio-pill span { padding: .7rem 1.1rem; border: 1px solid var(--line); border-radius: 999px; background: #fff; cursor: pointer; min-height: 46px; display: inline-flex; align-items: center; }
.radio-pill input:checked + span { background: var(--navy); color: #fff; border-color: var(--navy); }
.radio-pill input:focus-visible + span { outline: 3px solid var(--blue); outline-offset: 2px; }
.status-steps { display: grid; gap: .5rem; }
.status-steps form { margin: 0; }

/* My Day */
.day-pick input { width: auto; }
.stop { border-left: 5px solid var(--line); }
.stop-next { border-left-color: var(--red); }
.stop-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: .4rem; }
.stop-window { font-weight: 800; color: var(--red); font-size: 1.05rem; }
.stop h2 { margin-bottom: .1rem; }
.stop-title { font-weight: 650; margin-bottom: .3rem; }

/* Commission */
.profile-band { display: flex; justify-content: space-between; align-items: center; gap: 1rem; background: var(--navy); color: #fff; border-radius: var(--radius); padding: 1.1rem 1.25rem; margin-bottom: 1rem; }
.profile-band strong { display: block; font-size: 1.35rem; }
.rate-box { background: #fff; color: var(--navy); border-left: 5px solid var(--red); border-radius: 10px; padding: .55rem 1rem; display: flex; align-items: baseline; gap: .6rem; }
.rate-box span { font-size: .75rem; font-weight: 800; color: var(--muted); }
.rate-box strong { font-size: 1.7rem; }
.admin-jump { margin-bottom: 1rem; }
.week-nav { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: 1rem; }
.week-nav .center { display: grid; text-align: center; }
.week-nav .btn-ghost { min-width: 48px; font-size: 1.3rem; }
.sub-row { display: grid; grid-template-columns: 1fr 140px auto; gap: .5rem; align-items: center; margin-bottom: .5rem; }
@media (max-width: 420px) { .sub-row { grid-template-columns: 1fr 110px auto; } }
.flash-info { background: #eef4fd; border-color: #cfdcf3; color: #1d4f9f; display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.files { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .6rem; }
.files li { display: flex; align-items: center; gap: .75rem; }
.file-thumb { width: 64px; height: 64px; border-radius: 12px; overflow: hidden; border: 1px solid var(--line); display: grid; place-items: center; background: #f3f6fb; flex: none; text-decoration: none; }
.file-thumb img { width: 100%; height: 100%; object-fit: cover; }
.file-ext { font-weight: 800; color: var(--navy); font-size: .8rem; }
.file-meta { flex: 1; display: grid; }
.file-meta small { color: var(--muted); }
.upload-form { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.upload-form select { flex: 1 1 180px; width: auto; }
.file-btn { position: relative; overflow: hidden; }
.file-btn input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.dark-panel { background: var(--navy); color: #fff; border: 0; border-bottom: 5px solid var(--red); }
.dark-panel p { color: #c4cfe1; margin: 0; }
.eyebrow-light { display: inline-flex; align-items: center; gap: .4rem; color: #ff8a90; font-weight: 800; font-size: .85rem; margin-bottom: .4rem; }
.checklist { padding: 0; overflow: hidden; }
.checklist-head { display: flex; gap: .85rem; align-items: center; padding: 1rem 1.25rem; background: var(--navy); color: #fff; border-bottom: 4px solid var(--red); }
.checklist-head.good { border-bottom-color: var(--teal); }
.checklist-head strong { display: block; font-size: 1.15rem; }
.checklist-head small { color: #c4cfe1; }
.check-group { padding: .9rem 1.25rem; border-top: 1px solid var(--line); }
.check-top { display: flex; justify-content: space-between; align-items: center; gap: .75rem; font-weight: 700; }
.count-box { min-width: 30px; height: 30px; display: grid; place-items: center; border-radius: 6px; font-weight: 800; color: #fff; }
.count-box.bad { background: var(--red); }
.count-box.good { background: #cfd8e5; color: var(--navy); }
.check-group p { margin: .3rem 0 0; }
.check-item { display: grid; padding: .6rem .8rem; margin-top: .5rem; background: #f7f9fc; border-radius: 10px; color: var(--ink); text-decoration: none; }
.check-item small { color: var(--muted); }

/* Performance */
.date-range { display: inline-flex; gap: .4rem; flex: 1 1 260px; }
.date-range[hidden] { display: none; }
.mini-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem .75rem; }
.mini-stats div { display: grid; }
.mini-stats span { color: var(--muted); font-size: .78rem; font-weight: 600; }
.mini-stats strong { font-size: 1.05rem; overflow-wrap: anywhere; }
.bar { height: 8px; background: #e6ebf3; border-radius: 99px; overflow: hidden; margin-top: 1rem; }
.bar span { display: block; height: 100%; background: linear-gradient(90deg, var(--navy), var(--blue)); }

/* Tunnel */
.sticky-quote { border: 2px solid var(--navy); border-radius: var(--radius); padding: 1rem; display: grid; gap: .75rem; background: #f7f9fc; }
.sticky-quote .calc-main strong { font-size: 2rem; color: var(--navy); }
.sticky-quote select { flex: 1 1 200px; width: auto; }
.breakdown-list { list-style: none; margin: 0; padding: 0; }
.breakdown-list li { display: flex; justify-content: space-between; gap: 1rem; padding: .45rem 0; border-bottom: 1px solid var(--line); }
.breakdown-list small { display: block; color: var(--muted); font-size: .8rem; }

/* Truck */
.truck-list { list-style: none; margin: 0 0 1.25rem; padding: 0; }
.truck-row { display: flex; align-items: center; gap: .75rem; padding: .6rem 0; border-bottom: 1px solid var(--line); }
.truck-row form { margin: 0; }
.tick { width: 40px; height: 40px; border-radius: 50%; border: 2px solid #b7c4d8; background: #fff; color: transparent; display: grid; place-items: center; cursor: pointer; }
.tick.on { background: var(--ok); border-color: var(--ok); color: #fff; }

/* ===== Phase 1 fixes ===== */
/* In-page confirmation sheet (replaces browser popups) */
.confirm-sheet { align-items: center; z-index:5000; overflow-y:auto; }
.confirm-sheet .sheet-card { max-width: 420px; max-height:calc(100vh - 2rem); max-height:calc(100dvh - 2rem - env(safe-area-inset-bottom, 0px)); overflow-y:auto; overscroll-behavior:contain; }
.confirm-msg { font-size: 1.05rem; font-weight: 650; margin-bottom: 1.1rem; }
.confirm-actions { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.confirm-actions .btn, .confirm-actions .btn-ghost { min-height: 52px; }
.btn-danger-solid { background: #b4232b !important; }

/* Forgiving date field + built-in calendar */
.date-field { position: relative; display: flex; align-items: stretch; width: 100%; }
.date-field .date-text { border-top-right-radius: 0; border-bottom-right-radius: 0; flex: 1; min-width: 0; letter-spacing: .02em; }
.date-btn { display: grid; place-items: center; width: 54px; min-height: 48px; flex: none; border: 1px solid var(--line); border-left: 0; border-radius: 0 var(--radius-sm) var(--radius-sm) 0; background: #f3f6fb; color: var(--navy); font-size: 1.25rem; cursor: pointer; padding: 0; }
.date-btn[aria-expanded="true"] { background: var(--navy); color: #fff; border-color: var(--navy); }
.date-field.bad .date-text, .date-field.bad .date-btn { border-color: #d0453f; }
.date-err { color: #c0272d; font-weight: 600; }
.cal-pop { margin-top: .5rem; padding: .75rem; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; box-shadow: 0 10px 28px rgba(17,40,74,.16); max-width: 380px; font-weight: 400; }
.cal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: .4rem; }
.cal-head strong { font-size: 1.05rem; }
.cal-nav { width: 48px; height: 48px; border: 1px solid var(--line); border-radius: 12px; background: #f3f6fb; font-size: 1.4rem; color: var(--navy); cursor: pointer; }
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; }
.cal-dow { text-align: center; font-size: .78rem; font-weight: 700; color: var(--muted); padding: .2rem 0; }
.cal-day { min-height: 44px; border: 0; border-radius: 10px; background: none; font: inherit; font-weight: 650; color: var(--ink); cursor: pointer; }
.cal-day:hover, .cal-day:focus-visible { background: #e8eef8; }
.cal-day.today { box-shadow: inset 0 0 0 2px var(--blue); }
.cal-day.sel { background: var(--navy); color: #fff; }
.cal-foot { display: flex; justify-content: space-between; align-items: center; margin-top: .5rem; }
.day-nav .date-field { flex: 1 1 200px; width: auto; }
.day-pick .date-field { width: 230px; }
.date-range { flex-wrap: wrap; }
.date-range .date-field { flex: 1 1 160px; }

/* Customer picker */
.cust-picker { display: grid; gap: .75rem; }
.cust-results { list-style: none; margin: -.4rem 0 0; padding: .3rem; border: 1px solid var(--line); border-radius: var(--radius-sm); background: #fff; box-shadow: 0 8px 20px rgba(17,40,74,.12); max-height: 340px; overflow-y: auto; }
.cust-results[hidden] { display: none; }
.cust-hit { display: grid; width: 100%; text-align: left; background: none; border: 0; padding: .75rem .8rem; min-height: 52px; border-radius: 10px; font: inherit; color: var(--ink); cursor: pointer; }
.cust-hit:hover, .cust-hit:focus-visible { background: #eef3fb; }
.cust-hit small { color: var(--muted); }
.cust-none { padding: .75rem .8rem; color: var(--muted); }
.cust-chosen { display: flex; justify-content: space-between; align-items: center; gap: .75rem; padding: .85rem 1rem; border: 2px solid var(--navy); border-radius: var(--radius-sm); background: #f4f7fc; font-weight: 750; }
.cust-chosen[hidden], .cust-new[hidden], .cust-dupe[hidden] { display: none; }
.cust-new { display: grid; gap: 1rem; }

/* Duplicate invoice hint, note log, misc */
.field-warn { color: #9a3412; background: #fff4e5; border: 1px solid #f6d3a8; border-radius: 8px; padding: .45rem .65rem; font-weight: 650; font-size: .88rem; }
.field-warn[hidden] { display: none; }
.note-log { list-style: none; margin: 0 0 .75rem; padding: 0; }
.note-log li { display: grid; gap: .15rem; padding: .65rem .85rem; background: #f7f9fc; border: 1px solid var(--line); border-radius: 10px; margin-bottom: .5rem; }
.note-log small { color: var(--muted); }
.clear-row { display: flex; justify-content: flex-end; margin: -.5rem 0 .25rem; }
.scope-tabs { margin-top: -.25rem; }

/* Category chips: ONE compact swipe row (audit 14.1). A fade on the right edge shows there's more. */
.chips { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity; padding: .6rem 0 .4rem; gap: .4rem;
  mask-image: linear-gradient(90deg, #000 88%, transparent); -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); }
.chips .chip-btn { flex: none; padding: .45rem .8rem; font-size: .85rem; min-height: 40px; scroll-snap-align: start; }
.inline-form { display: inline; margin: 0; }
input.warn-input { border-color: #e08a2b; background: #fffaf2; }
.listing-list { max-height: none; }
.small-check { font-weight: 600; font-size: .85rem; color: var(--muted); }
.cleanup-h { font-size: 1rem; margin: 1.1rem 0 .4rem; }
.cleanup-row { padding: .55rem .2rem; border-bottom: 1px solid var(--line); font-weight: 600; }
.tracker-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .4rem; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: .4rem; margin-bottom: 1rem; }
@media (min-width: 640px) { .tracker-tabs { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.tracker-tabs a, .tracker-tabs button { display: flex; align-items: center; justify-content: center; gap: .4rem; min-height: 48px; border-radius: 12px; color: var(--navy); font: inherit; font-weight: 700; text-decoration: none; background: none; border: 0; cursor: pointer; width: 100%; }
.tracker-tabs a.on { background: var(--navy); color: #fff; }
.tracker-tabs .inline-form { display: block; }
.eyebrow-dark { display: block; font-size: .8rem; font-weight: 800; color: var(--muted); letter-spacing: .04em; text-transform: uppercase; margin-bottom: .2rem; }
.stmt-card { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem .75rem; padding: 1rem 0; border-top: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.stmt-week { grid-column: 1 / -1; display: grid; }
.stmt-week small, .stmt-fig small { color: var(--muted); }
.stmt-fig { display: grid; }
.stmt-approved { grid-column: 1 / -1; color: var(--muted); font-size: .85rem; }
@media (min-width: 760px) { .stmt-card { grid-template-columns: 2fr 1fr 1fr 1fr 1.6fr; align-items: center; } .stmt-week, .stmt-approved { grid-column: auto; } .stmt-approved { text-align: right; } }
.stmt-totals { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; margin: .5rem 0; padding: .75rem; background: #f4f7fc; border-radius: 12px; }
.stmt-totals div { display: grid; }
.stmt-totals span { color: var(--muted); font-size: .8rem; font-weight: 600; }
.stmt-totals strong { font-size: 1.2rem; }

/* ===== Tunnel Estimator (production design) ===== */
.te-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; }
.eyebrow-red { display: block; color: var(--red); font-weight: 800; font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; margin-bottom: .35rem; }
.te-title { font-size: clamp(2.2rem, 9vw, 3.3rem); letter-spacing: -0.04em; margin-bottom: .4rem; }
.te-grid { display: grid; gap: 1rem; }
@media (min-width: 900px) { .te-grid { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); align-items: start; } .te-right { position: sticky; top: 140px; } }
.te-left { display: grid; gap: 1rem; }
.te-left h2 { margin: 0; }
.te-rule { border: 0; border-top: 1px solid var(--line); margin: .25rem 0; }
.te-included { display: flex; align-items: center; gap: .85rem; padding: .9rem 1rem; border: 1px solid #b9e2d3; border-left: 4px solid var(--teal); border-radius: var(--radius-sm); background: #eef8f4; }
.te-included strong, .te-included small { display: block; }
.te-included small { color: var(--muted); }
.te-included em { margin-left: auto; font-style: normal; font-weight: 800; color: var(--teal); font-size: .85rem; }
.te-check { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: var(--teal); color: #fff; flex: none; }
.stepper { display: grid; grid-template-columns: 52px 1fr 52px; }
.stepper input { text-align: center; border-radius: 0; font-weight: 700; }
.stepper button { border: 1px solid var(--line); background: #f3f6fb; font-size: 1.4rem; font-weight: 700; color: var(--navy); cursor: pointer; min-height: 48px; }
.stepper button:first-child { border-radius: var(--radius-sm) 0 0 var(--radius-sm); border-right: 0; }
.stepper button:last-child { border-radius: 0 var(--radius-sm) var(--radius-sm) 0; border-left: 0; }
.te-option { display: flex; gap: .75rem; align-items: flex-start; padding: .8rem .9rem; border: 1px solid var(--line); border-radius: var(--radius-sm); background: #fff; cursor: pointer; font-weight: 400; }
.te-option input { width: 24px; height: 24px; margin-top: 2px; accent-color: var(--teal); flex: none; }
.te-option strong, .te-option small { display: block; }
.te-option small { color: var(--muted); }
.te-price { font-size: clamp(2.2rem, 10vw, 2.9rem); font-weight: 900; letter-spacing: -0.04em; color: var(--navy); margin: .1rem 0 .6rem; font-variant-numeric: tabular-nums; }
.te-right h3 { font-size: 1.15rem; margin: .8rem 0 .3rem; }
.te-rows { margin: 0; }
.te-rows div { display: flex; justify-content: space-between; gap: 1rem; padding: .45rem 0; border-bottom: 1px solid #eef2f7; font-size: .92rem; }
.te-rows dt { color: var(--muted); }
.te-rows dd { margin: 0; font-weight: 750; font-variant-numeric: tabular-nums; }
.te-adjust { margin: .5rem 0 0; padding: .55rem .75rem; border-radius: 10px; background: #fff4e5; color: #9a3412; font-size: .88rem; font-weight: 650; }
.te-actions { margin-top: 1rem; }
.te-sticky { display: none; }
@media (max-width: 899px) {
  .te-sticky { display: flex; position: sticky; bottom: 0; z-index: 5; align-items: center; justify-content: space-between; gap: 1rem; background: var(--navy-deep); color: #fff; border-radius: var(--radius); padding: .7rem .8rem .7rem 1.1rem; padding-bottom: calc(.7rem + env(safe-area-inset-bottom, 0px)); box-shadow: 0 -6px 20px rgba(11,29,56,.2); }
  .te-sticky small { display: block; color: #a9b8d1; font-size: .78rem; }
  .te-sticky strong { font-size: 1.4rem; font-variant-numeric: tabular-nums; }
  .te-sticky .btn { background: var(--red); }
}

/* Payroll reminders */
.pay-alert { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; padding: .8rem 1rem; border-radius: var(--radius-sm); margin-bottom: 1rem; font-weight: 650; border: 1px solid; }
.pay-alert span { display: flex; gap: .55rem; align-items: flex-start; flex: 1 1 220px; }
.pay-alert .ic { flex: none; margin-top: .15rem; }
.pay-reminder { background: #eef4fd; border-color: #cfdcf3; color: #17407e; }
.pay-urgent { background: #fff4e5; border-color: #f6d3a8; color: #9a3412; }
.pay-urgent .btn { background: #c2410c; }
.pay-overdue { background: #fdecec; border-color: #f3c0c3; color: #c0272d; }
.pay-overdue .btn { background: var(--red); }
.deadline-card h2 { margin-bottom: .4rem; }
.pay-urgent-soft { border-left: 5px solid #c2410c; }
.pay-overdue-soft { border-left: 5px solid var(--red); }
.pay-reminder-soft { border-left: 5px solid var(--blue); }

/* ===== Estimate builder v3 (phone-first, audit 14.1) ===== */
body:has(.eb) .top { position: static; }
body:has(.eb) .foot { padding-bottom: 7rem; }
.eb-head { position: sticky; top: 0; z-index: 8; background: var(--bg); margin: -1.25rem -1rem .75rem; padding: calc(.6rem + env(safe-area-inset-top, 0px)) 1rem .3rem; box-shadow: 0 6px 14px rgba(17,40,74,.08); }
.eb-context { display: flex; align-items: center; gap: .5rem; margin-bottom: .5rem; }
.eb-back { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: #fff; border: 1px solid var(--line); color: var(--navy); flex: none; }
.eb-cust { flex: 1; min-width: 0; text-align: left; display: grid; background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: .4rem .8rem; font: inherit; color: var(--ink); cursor: pointer; min-height: 44px; }
.eb-cust small { color: var(--muted); font-size: .75rem; font-weight: 700; }
.eb-cust strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: .95rem; }
.eb-seg { margin-bottom: .5rem; }
.eb-search input[type=search] { min-height: 50px; font-size: 16px; border-width: 2px; border-color: var(--navy); }
.eb-search[hidden] { display: none; }
.eb-section { font-size: .85rem; font-weight: 750; color: var(--muted); margin: .4rem 0 .5rem; }
.eb-list { list-style: none; margin: 0; padding: 0; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.eb-row { display: grid; grid-template-columns: minmax(0, 1fr) auto 52px; align-items: center; column-gap: .5rem; padding: .35rem .5rem .35rem .85rem; border-top: 1px solid #eef2f7; }
.eb-row:first-child { border-top: 0; }
.eb-row[hidden] { display: none; }
.eb-row.open { background: #f7f9fc; }
.eb-main { display: grid; text-align: left; background: none; border: 0; padding: .45rem 0; font: inherit; color: var(--ink); cursor: pointer; min-width: 0; min-height: 48px; }
.eb-name { font-weight: 750; line-height: 1.25; }
.eb-desc { font-size: .8rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.eb-price { font-weight: 800; color: var(--navy); font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
/* Reserve a real price column: no overlapping price labels at narrow widths. */
.eb-row { grid-template-columns: minmax(0, 1fr) minmax(5.5rem, max-content) 52px; }
.eb-row > * { min-width: 0; }
.eb-price { min-width: 5.5rem; overflow: hidden; text-overflow: ellipsis; }
.eb-add { width: 48px; height: 48px; border-radius: 14px; border: 0; background: var(--navy); color: #fff; font-size: 1.3rem; display: grid; place-items: center; cursor: pointer; }
.eb-add.quote-btn { background: #e8eef8; color: var(--navy); }
.eb-add.pop { animation: ebpop .45s ease; background: var(--teal); }
@keyframes ebpop { 30% { transform: scale(.88); } 70% { transform: scale(1.08); } }
.eb-detail { grid-column: 1 / -1; padding: .2rem 0 .7rem; font-size: .9rem; color: var(--ink); display: grid; gap: .3rem; }
.eb-detail small { color: var(--muted); }
#eb-more { margin-top: .75rem; }
.eb-none { text-align: center; padding: 1.5rem 1rem; background: #fff; border: 1px dashed var(--line); border-radius: var(--radius); margin-top: .5rem; }
.eb-cust-panel { margin-bottom: .75rem; }
.eb-dock { position: sticky; bottom: 0; z-index: 9; margin-top: 1rem; padding-bottom: env(safe-area-inset-bottom, 0px); }
.eb-suggest { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; background: #f0f5fd; border: 1px solid #cfdcf3; border-radius: var(--radius-sm); padding: .6rem .7rem; margin-bottom: .4rem; font-size: .9rem; }
.eb-suggest strong { width: 100%; }
.eb-tray { background: #fff; border: 1px solid var(--line); border-radius: var(--radius) var(--radius) 0 0; box-shadow: 0 -8px 24px rgba(17,40,74,.14); padding: .7rem .8rem; max-height: 45vh; overflow-y: auto; }
.eb-tray-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: .3rem; }
.eb-tray-list { list-style: none; margin: 0; padding: 0; }
.eb-line { display: grid; grid-template-columns: minmax(0, 1fr) auto auto 40px; gap: .4rem; align-items: center; padding: .45rem 0; border-top: 1px solid #eef2f7; }
.eb-line:first-child { border-top: 0; }
.eb-line-name { font-weight: 650; font-size: .92rem; line-height: 1.25; }
.eb-qty { display: inline-flex; align-items: center; gap: .45rem; }
.eb-qty button { width: 44px; height: 44px; border-radius: 10px; border: 1px solid var(--line); background: #f3f6fb; font-size: 1.15rem; font-weight: 800; color: var(--navy); cursor: pointer; }
.eb-qty b { min-width: 2.2em; text-align: center; font-variant-numeric: tabular-nums; }
.eb-line-total { font-weight: 800; font-variant-numeric: tabular-nums; text-align: right; }
.eb-x { width: 40px; height: 40px; border: 0; background: none; color: #b4232b; font-size: 1.05rem; cursor: pointer; border-radius: 10px; }
.eb-bar { display: flex; align-items: center; gap: .6rem; background: var(--navy-deep); color: #fff; border-radius: var(--radius); padding: .55rem .55rem .55rem .9rem; box-shadow: 0 -6px 20px rgba(11,29,56,.22); }
.eb-tray:not([hidden]) + .eb-bar { border-top-left-radius: 0; border-top-right-radius: 0; }
.eb-bar-info { flex: 1; min-width: 0; display: grid; grid-template-columns: auto 1fr; column-gap: .6rem; align-items: baseline; text-align: left; background: none; border: 0; color: #fff; font: inherit; cursor: pointer; padding: .2rem 0; }
.eb-bar-info span { color: #c4cfe1; font-weight: 700; font-size: .9rem; }
.eb-bar-info strong { font-size: 1.35rem; font-variant-numeric: tabular-nums; }
.eb-bar-info small { grid-column: 1 / -1; color: #a9b8d1; font-size: .78rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.eb-review { background: var(--red); min-height: 52px; padding: .6rem 1.1rem; white-space: nowrap; }

/* ===== Estimate builder: category tiles (simple categories with small images) ===== */
.eb-cats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; margin: .25rem 0 1rem; }
@media (min-width: 560px) { .eb-cats { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 900px) { .eb-cats { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.eb-cats[hidden] { display: none; }
.eb-cat { display: grid; grid-template-rows: auto 1fr auto; justify-items: start; gap: .35rem; text-align: left; padding: .8rem .8rem .7rem; min-height: 118px;
  background: #fff; border: 1px solid var(--line); border-radius: 16px; font: inherit; color: var(--ink); cursor: pointer; }
.eb-cat:active { transform: scale(.98); }
.eb-cat:focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; }
.eb-cat-ic { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: var(--tone-bg, #e8eef8); color: var(--tone-fg, var(--navy)); flex: none; }
.cat-ic { width: 26px; height: 26px; }
.eb-cat-name { font-weight: 750; font-size: .95rem; line-height: 1.2; }
.eb-cat small { color: var(--muted); font-size: .78rem; font-weight: 600; }
.eb-cat-costs { border-style: dashed; }
.tone-1 { --tone-bg: #fff3d6; --tone-fg: #a16207; }
.tone-2 { --tone-bg: #e5f5ec; --tone-fg: #157347; }
.tone-3 { --tone-bg: #e3ecfb; --tone-fg: #1d4f9f; }
.tone-4 { --tone-bg: #fde8ea; --tone-fg: #b4232b; }
.tone-5 { --tone-bg: #dff3ef; --tone-fg: #0d6b5f; }
.tone-6 { --tone-bg: #ece8fb; --tone-fg: #5b3fb3; }
.eb-cat.tone-1, .eb-cat.tone-2, .eb-cat.tone-3, .eb-cat.tone-4, .eb-cat.tone-5, .eb-cat.tone-6 { background: #fff; color: var(--ink); }
.eb-cat-costs .eb-cat-ic { --tone-bg: #eef1f5; --tone-fg: var(--navy); }
.eb-cat-head { display: grid; gap: .5rem; margin: .25rem 0 .5rem; }
.eb-cat-head[hidden] { display: none; }
.eb-cat-back { justify-self: start; display: inline-flex; align-items: center; gap: .3rem; min-height: 44px; padding: .4rem .8rem .4rem .5rem; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--navy); font: inherit; font-weight: 750; cursor: pointer; }
.eb-cat-title { display: flex; align-items: center; gap: .65rem; }
.eb-cat-title strong { font-size: 1.25rem; letter-spacing: -0.01em; line-height: 1.2; }
.eb-cat-head.tone-1, .eb-cat-head.tone-2, .eb-cat-head.tone-3, .eb-cat-head.tone-4, .eb-cat-head.tone-5, .eb-cat-head.tone-6 { background: none; }
.eb-suggest[hidden], .eb-tray[hidden], .eb-section[hidden], .eb-none[hidden] { display: none; }
.eb-cat { grid-template-rows: auto auto auto; align-content: start; min-height: 0; padding: .75rem .8rem; }
.eb-cat small { margin-top: auto; }
.eb-detail[hidden] { display: none; }
.cj-receipts { border-top: 1px solid var(--line); padding-top: 1rem; display: grid; gap: .6rem; }
.cj-receipts h2 { margin: 0; }
.cj-receipts .files { margin: 0; }
.people li:has(.invite-form) { display: flex; align-items: center; gap: .5rem; }
.people li:has(.invite-form) .person { flex: 1; min-width: 0; }
.invite-form { flex: none; margin: 0; }

/* 14.2 step bar + confirm step */
.stepper-bar { margin: 0 0 .75rem; }
.stepper-bar ol { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: .3rem; }
.stepper-bar a { display: grid; justify-items: center; gap: .2rem; padding: .45rem .2rem; border-radius: 12px; text-decoration: none; color: var(--muted); font-size: .74rem; font-weight: 700; text-align: center; line-height: 1.15; min-height: 52px; }
.stepper-bar b { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; border: 2px solid var(--line); background: #fff; font-size: .8rem; }
.stepper-bar li.done b { background: var(--teal); border-color: var(--teal); color: #fff; }
.stepper-bar li.on a { color: var(--navy); background: #fff; box-shadow: 0 1px 3px rgba(17,40,74,.12); }
.stepper-bar li.on b { background: var(--navy); border-color: var(--navy); color: #fff; }
.step-actions { position: sticky; bottom: 0; z-index: 5; display: grid; grid-template-columns: auto 1fr; gap: .5rem; padding: .7rem 0 calc(.7rem + env(safe-area-inset-bottom, 0px)); background: linear-gradient(transparent, var(--bg) 25%); }
.smart-entry h1 { font-size: 1.5rem; }
.job-card.static { border-left-color: var(--red); margin: .75rem 0 1rem; }

.rec-list { list-style: none; margin: .5rem 0 0; padding: 0; }
.rec-list li { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .65rem 0; border-top: 1px solid var(--line); }
.rec-list form { margin: 0; flex: none; }
.rec-name { font-weight: 700; display: grid; }
.rec-name small { color: var(--teal); font-weight: 650; font-size: .78rem; }
.action-errors ul { margin: .35rem 0 0; padding-left: 1.1rem; font-weight: 600; }

/* 15.5 commission status chips: Needs review (amber) -> Submitted (blue) -> Approved (green) */
.cj-needs_review, .cj-draft, .cj-returned { background: #fff4e0; color: #9a6b00; }
.cj-submitted { background: #e3ecfb; color: #1d4f9f; }
.cj-approved { background: #e5f5ec; color: var(--ok); }

/* Payment (15.2 / 15.3) */
.chip-row { display: inline-flex; gap: .4rem; flex-wrap: wrap; align-items: center; }
.paid-chip { background: #e5f5ec; color: var(--ok); }
.await-chip { background: #eef0f3; color: #5d6b82; }
.cj-payment { border-top: 1px solid var(--line); padding-top: 1rem; display: grid; gap: .6rem; }
.cj-payment h2 { margin: 0; }
.gate-box { background: #fff4e0; border: 1px solid #f0d9a8; border-left: 4px solid #c2410c; border-radius: var(--radius-sm); padding: .8rem 1rem; margin: 1rem 0; }
.gate-box strong { display: block; margin-bottom: .3rem; color: #7a4a00; }
.gate-box ul { margin: 0; padding-left: 1.1rem; font-weight: 600; color: #7a4a00; }

/* Partial payment (verification fix) */
.partial-chip { background: #fff4e0; color: #9a6b00; }

/* Payroll lock (15.3): names the exact amount holding payroll */
.payroll-lock-line { margin: .25rem 0 .75rem; }
.payroll-lock { display: inline-block; padding: .3rem .8rem; border-radius: 999px; background: #fde8ea; color: #c0272d; font-weight: 800; font-size: .9rem; }
.btn-locked, .btn-locked[disabled] { background: #eef0f3; color: #5d6b82; border-color: #d5dbe5; opacity: 1; }

/* Sign-up (14.3a) */
.code-big { font-size: 1.5rem; letter-spacing: .08em; font-weight: 800; }
.hp-field { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Chips must read as chips on the statement and in attention lists */
.stmt-lines .badge, .present-head .badge, .check-item .badge { border: 1px solid currentColor; }
.present-head .badge { display: table; margin-top: .3rem; }
.check-item .badge { margin: .15rem 0; }

/* Payment history (several payments on one job) */
.pay-history { list-style: none; margin: .5rem 0 .75rem; padding: 0; border-top: 1px solid var(--line, #dfe4ec); }
.pay-history li { display: flex; justify-content: space-between; gap: 1rem; padding: .4rem 0; border-bottom: 1px solid var(--line, #dfe4ec); font-size: .95rem; }

/* Customer invoice (15.7) */
.inv-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.inv-actions .btn, .inv-actions .btn-ghost { flex: 1 1 auto; text-align: center; }
.inv { position: relative; overflow: hidden; }
.inv-head { display: flex; align-items: center; gap: .85rem; flex-wrap: wrap; padding-bottom: 1rem; border-bottom: 3px solid var(--red); margin-bottom: 1rem; }
.inv-head img { border-radius: 14px; }
.inv-co { display: grid; flex: 1 1 10rem; gap: .1rem; }
.inv-co strong { font-size: 1.3rem; font-weight: 900; letter-spacing: .03em; color: var(--navy); }
.inv-co span { color: var(--muted); font-size: .9rem; }
.inv-title { display: grid; text-align: right; }
.inv-title strong { font-size: 1.7rem; font-weight: 900; color: var(--navy); letter-spacing: .04em; }
.inv-title span { font-weight: 700; }
.inv-cols { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); margin-bottom: 1rem; }
.inv-label { display: block; font-size: .75rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin-bottom: .25rem; }
.inv-cols p { margin: 0 0 .1rem; }
.inv-name { font-weight: 800; }
.inv-meta { margin: 0; display: grid; gap: .25rem; align-content: start; }
.inv-meta div { display: flex; justify-content: space-between; gap: 1rem; }
.inv-meta dt { color: var(--muted); }
.inv-meta dd { margin: 0; font-weight: 700; }
.inv-lines { list-style: none; margin: 0 0 1rem; padding: 0; border-top: 2px solid var(--navy); }
.inv-lines li { padding: .75rem 0; border-bottom: 1px solid var(--line); }
.inv-line-name { display: grid; gap: .2rem; }
.inv-line-name span { color: var(--muted); font-size: .9rem; }
.inv-line-calc { display: flex; justify-content: space-between; gap: 1rem; margin-top: .3rem; color: var(--muted); }
.inv-line-calc strong { color: var(--ink); }
.inv-totals { margin-left: auto; max-width: 22rem; }
.inv-totals .row { display: flex; justify-content: space-between; gap: 1rem; padding: .3rem 0; }
.inv-totals .strong { font-weight: 800; }
.inv-pay-title { margin-top: .4rem; padding-top: .5rem; border-top: 1px solid var(--line); font-size: .75rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.inv-totals .due { margin-top: .5rem; padding: .7rem .8rem; background: var(--navy); color: #fff; border-radius: 10px; font-weight: 800; font-size: 1.15rem; }
.inv-stamp { position: absolute; left: 6%; bottom: 34%; transform: rotate(-12deg); font-size: 3.4rem; font-weight: 900; letter-spacing: .1em; color: rgba(28, 128, 66, .28); border: .35rem solid rgba(28, 128, 66, .28); border-radius: 1rem; padding: .1rem 1rem; pointer-events: none; }
.inv-text { margin-top: 1.25rem; }
.inv-text h3 { margin: 0 0 .25rem; font-size: 1rem; }
.inv-text p { margin: 0; }
.inv-fine p { font-size: .78rem; color: var(--muted); }
@media print { .inv-stamp { color: rgba(28, 128, 66, .35); border-color: rgba(28, 128, 66, .35); } }

/* Plumbing Test form (Section 19) */
.form-bar { margin: 0 0 .75rem; padding: .55rem .8rem; background: var(--navy); color: #fff; border-radius: 8px; font-size: .95rem; letter-spacing: .04em; text-transform: uppercase; }
.pf-pick { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; margin-top: .35rem; }
.pf { display: block; position: relative; }
.pf input { position: absolute; opacity: 0; inset: 0; }
.pf span { display: flex; align-items: center; justify-content: center; min-height: 3.6rem; border-radius: 14px; border: 2px solid var(--line); background: #fff; font-size: 1.25rem; font-weight: 800; color: #43506a; }
.pf-pass input:checked + span { background: #1c8042; border-color: #1c8042; color: #fff; }
.pf-fail input:checked + span { background: #c4232b; border-color: #c4232b; color: #fff; }
.pf input:focus-visible + span { outline: 3px solid #1e5aa8; outline-offset: 2px; }
.pt-summary { font-size: 1.15rem; font-weight: 800; margin: 0 0 .35rem; }
.form-badge { background: #e8f0fe; color: #17479e; border: 1px solid #b9cdf5; }

.photo-grid { list-style: none; margin: 0 0 .75rem; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(8.5rem, 1fr)); gap: .6rem; }
.photo-grid img { width: 100%; height: 8.5rem; object-fit: cover; border-radius: 10px; border: 1px solid var(--line); display: block; }
.photo-add { display: inline-flex; align-items: center; gap: .4rem; cursor: pointer; }

/* Plumbing Test launcher (19.5): stacked cards, no sideways scrolling */
.pt-list { list-style: none; margin: 0; padding: 0; }
.pt-item { padding: .9rem 0; border-bottom: 1px solid var(--line); display: grid; gap: .3rem; }
.pt-item:last-child { border-bottom: 0; }
.pt-top { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; }
.pt-top strong { font-size: 1.1rem; overflow-wrap: anywhere; }
.pt-meta { margin: 0; overflow-wrap: anywhere; }
.pt-item .btn-row .btn, .pt-item .btn-row .btn-ghost { flex: 1 1 9rem; text-align: center; }

/* ===== Round 4: address entry (10.6) ===== */
.addr { display: grid; gap: .75rem; }
.addr-suggest { list-style: none; margin: -.25rem 0 0; padding: .25rem; background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 6px 18px rgba(15, 35, 70, .12); }
.addr-hit { display: grid; width: 100%; text-align: left; gap: .1rem; padding: .7rem .8rem; min-height: 48px; background: none; border: 0; border-radius: 8px; font: inherit; color: var(--ink); cursor: pointer; }
.addr-hit small { color: var(--muted); font-size: .85rem; }
.addr-suggest li.on .addr-hit, .addr-hit:hover { background: #eef4fd; }
.addr-row { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1.2fr); gap: .6rem; }
.addr-row label { min-width: 0; }
.addr-row input { min-width: 0; width: 100%; }
.win-custom { margin-top: .6rem; }

/* ===== Round 4: team picker + team display (10.7) ===== */
.tech-picker { display: grid; gap: .55rem; }
.tp-head { display: flex; justify-content: space-between; align-items: center; gap: .5rem; flex-wrap: wrap; }
.tp-actions { display: flex; gap: .25rem; }
.tp-chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.tp-chip { display: inline-flex; align-items: stretch; max-width: 100%; border: 2px solid var(--line); border-radius: 999px; background: #fff; overflow: hidden; min-height: 46px; }
.tp-chip .tp-main { display: flex; align-items: center; gap: .45rem; min-height: 46px; padding: .5rem .95rem; background: none; border: 0; font: inherit; font-weight: 700; color: var(--ink); text-align: left; }
.tp-chip .tp-tag { display: none; font-size: .68rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; background: rgba(255, 255, 255, .28); border-radius: 999px; padding: .08rem .45rem; }
.tp-chip .tp-x { display: none; min-height: 46px; padding: 0 .85rem; background: none; border: 0; border-left: 1px solid rgba(255, 255, 255, .35); font-size: 1.35rem; line-height: 1; color: inherit; }
.tp-chip.is-on { background: var(--navy); border-color: var(--navy); color: #fff; }
.tp-chip.is-on .tp-main { color: #fff; }
.tp-chip.is-on .tp-x { display: block; }
.tp-chip.is-primary { background: var(--red); border-color: var(--red); }
.tp-chip.is-primary .tp-tag { display: inline-block; }
.tp-workin { margin-top: .25rem; }
.team-line { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.team-line .team-primary { font-weight: 700; }
.team-more { display: inline-block; }
.team-more > summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; min-height: 28px; padding: .05rem .6rem; border-radius: 999px; background: #e8ecf2; color: #43506a; font-weight: 800; font-size: .85rem; }
.team-more > summary::-webkit-details-marker { display: none; }
.team-more[open] > summary { background: var(--navy); color: #fff; }
.team-more ul { list-style: none; margin: .4rem 0 0; padding: .5rem .8rem; background: #fff; border: 1px solid var(--line); border-radius: 10px; }
.team-more li { padding: .15rem 0; }
.wi-badge { background: #fff4d6; color: #8a5a00; border: 1px solid #f0d58a; }
.wi-claimed { background: #e8f6ee; color: #1c6b3e; border: 1px solid #b6e0c7; }
.job-card-wrap { border-bottom: 1px solid var(--line); }

/* Round 4 polish: compact badges on tall cards, tidy team list under a card */
.job-side { align-content: start; }
.job-team { padding: .45rem .9rem .75rem; }
.team-line { align-items: flex-start; }
.team-more[open] { flex-basis: 100%; }
.job-card-wrap + .job-card-wrap { margin-top: .5rem; }

.wi-badge, .wi-claimed, .job-side .badge { white-space: nowrap; }

/* ===== Round 5: company meetings (10.8) and cancelled items (10.10) ===== */
.meeting-card { display: flex; justify-content: space-between; gap: .75rem; padding: .8rem .9rem; border: 1px solid #d9cdee; border-left: 5px solid #1e3a5f; border-radius: var(--radius-sm); background: #f6f1fc; color: var(--ink); text-decoration: none; margin-bottom: .5rem; }
.meeting-card .job-main, .meeting-card .job-side { display: grid; gap: .1rem; align-content: start; }
.meeting-card .job-side { justify-items: end; text-align: right; }
.meeting-card strong svg { width: 1.05em; height: 1.05em; vertical-align: -.15em; margin-right: .2rem; color: #1e3a5f; }
.meeting-card small { color: var(--muted); }
.meeting-badge { background: #1e3a5f; color: #fff; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.cx-badge { background: #fde8e8; color: #c0272d; border: 1px solid #f3b9b5; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.is-cancelled { opacity: .6; }
.job-card.is-cancelled, .meeting-card.is-cancelled { background: #f4f4f4; border-left-color: #c4c4c4; }
.cx-line { color: #c0272d !important; font-weight: 600; }
.cx-toggle { display: flex; justify-content: flex-end; margin: .25rem 0 .5rem; }
.cancelled-panel { border: 2px solid #f3b9b5; background: #fff7f7; }
.tp-noprimary .tp-tag { display: none !important; }
.tp-noprimary .tp-chip.is-primary { background: var(--navy); border-color: var(--navy); }
.meeting-form textarea { min-height: 5.5rem; }

/* ===== Round 6: one bottom tab bar, compact top bar, and the Today (Home) page ===== */
:root { --tabbar-h: 0px; } /* v3.66.2 (P4): bottom tab bar retired; kept at 0 because .issue-fab and .ns-dock still read it. */
.top-inner { padding: .45rem 1rem; }
.brand img { width: 34px; height: 34px; }
.brand-text strong { font-size: .95rem; }
.brand-text small { display: none; }
.more-card { max-height: min(82vh, 680px); overflow-y: auto; overscroll-behavior: contain; }
.more-head { display: flex; justify-content: space-between; align-items: center; font-size: 1.15rem; }
.more-h { margin: .85rem 0 .35rem; font-size: .76rem; text-transform: uppercase; letter-spacing: .07em; color: var(--muted); font-weight: 800; }
.more-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.more-link { display: flex; align-items: center; gap: .6rem; width: 100%; min-height: 52px; padding: .5rem .8rem; background: #f6f8fb; border: 1px solid var(--line); border-radius: 12px; color: var(--ink); font: inherit; font-weight: 700; text-align: left; text-decoration: none; cursor: pointer; }
.more-link .ic { width: 22px; height: 22px; flex: none; color: var(--navy); }
.more-form { margin: 0; }
.a2hs-help { margin-top: .75rem; font-size: .9rem; }

.hm-head { display: flex; align-items: center; gap: .75rem; margin: 0 0 .75rem; }
.hm-logo img { display: block; border-radius: 10px; }
.hm-id { min-width: 0; }
.hm-id h1 { margin: 0; font-size: 1.3rem; letter-spacing: -.01em; line-height: 1.15; }
.hm-id p { margin: .1rem 0 0; color: var(--muted); font-size: .92rem; }
.hm-role { display: inline-block; margin-left: .35rem; padding: 0 .5rem; border-radius: 999px; background: #e8ecf2; color: #43506a; font-size: .75rem; font-weight: 800; letter-spacing: .03em; }
.hm-sec { margin: 0 0 .85rem; }
.hm-sec-h { display: flex; justify-content: space-between; align-items: baseline; gap: .5rem; margin-bottom: .45rem; }
.hm-sec-h h2 { margin: 0; font-size: 1.05rem; }
.hm-sec-h a, .hm-sub { font-size: .85rem; color: var(--muted); font-weight: 600; }
.hm-sec-h a { color: var(--blue); text-decoration: none; min-height: 32px; display: inline-flex; align-items: center; }
.hm-count { display: inline-block; min-width: 1.5rem; padding: 0 .45rem; border-radius: 999px; background: var(--red); color: #fff; font-size: .8rem; text-align: center; vertical-align: .08em; }
.hm-count.wi { background: #8a5a00; }
.hm-win { font-weight: 800; font-variant-numeric: tabular-nums; min-width: 3.4rem; color: var(--navy); }
.hm-win.big { font-size: 1.35rem; min-width: 0; }
.hm-tag { padding: .05rem .5rem; border-radius: 6px; background: var(--navy); color: #fff; font-size: .72rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.hm-tag.soft { background: #e8ecf2; color: #43506a; margin-left: .3rem; vertical-align: .1em; }
.hm-next { background: #fff; border: 1px solid var(--line); border-left: 6px solid var(--navy); border-radius: var(--radius); padding: .8rem .9rem .9rem; box-shadow: 0 2px 10px rgba(15, 35, 70, .08); }
.hm-next.is-active { border-left-color: var(--red); }
.hm-next-top { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.hm-next-top .badge { margin-left: auto; }
.hm-next-main { display: block; margin-top: .3rem; color: var(--ink); text-decoration: none; }
.hm-next-main strong { display: block; font-size: 1.2rem; line-height: 1.2; overflow-wrap: anywhere; }
.hm-next-main span { color: #43506a; font-size: .98rem; }
.hm-addr { display: flex; align-items: center; gap: .45rem; min-height: 44px; margin-top: .15rem; color: var(--blue); font-weight: 600; text-decoration: underline; overflow-wrap: anywhere; }
.hm-addr .ic { width: 20px; height: 20px; flex: none; }
.hm-help { margin: .2rem 0 0; }
.hm-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; margin-top: .45rem; }
.hm-actions form { margin: 0; grid-column: 1 / -1; }
.hm-actions .btn { min-height: 52px; font-size: 1.08rem; }
.hm-nav { min-height: 46px; display: inline-flex; align-items: center; justify-content: center; gap: .35rem; text-align: center; }
.hm-nav .ic { width: 18px; height: 18px; }
.hm-rows { list-style: none; margin: .5rem 0 0; padding: 0; }
.hm-row { display: flex; align-items: center; gap: .65rem; min-height: 56px; padding: .5rem .2rem; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.hm-row-main { flex: 1; min-width: 0; display: grid; }
.hm-row-main strong { overflow-wrap: anywhere; }
.hm-row-main small { color: var(--muted); overflow-wrap: anywhere; }
.hm-row .badge { flex: none; white-space: nowrap; }
.hm-row.hm-meeting { background: #f6f1fc; border-left: 5px solid #1e3a5f; padding-left: .55rem; border-radius: 8px; margin-bottom: .35rem; border-bottom: 0; }
.hm-row.hm-meeting .ic { width: 1em; height: 1em; vertical-align: -.12em; color: #1e3a5f; }
.hm-row.is-cancelled { opacity: .6; }
.hm-more-row { color: var(--blue); font-weight: 700; justify-content: flex-start; min-height: 46px; }
.hm-cx-toggle { display: inline-flex; align-items: center; min-height: 40px; margin-top: .25rem; color: var(--blue); font-size: .88rem; font-weight: 700; text-decoration: none; }
.hm-upnext { display: flex; justify-content: space-between; align-items: center; gap: .5rem; min-height: 44px; margin-top: .3rem; padding: .35rem .75rem; background: #eef3fa; border-radius: 10px; color: #274064; font-size: .92rem; font-weight: 600; text-decoration: none; }
.hm-empty { padding: .9rem 1rem; background: #fff; border: 1px dashed #c8d2e0; border-radius: var(--radius); }
.hm-empty strong { display: block; font-size: 1.05rem; }
.hm-empty p { margin: .25rem 0 0; color: var(--muted); font-size: .92rem; }
.hm-empty.hm-done { border-style: solid; border-color: #b6e0c7; background: #f1faf4; }
.hm-attn { border: 1px solid var(--line); border-left: 6px solid #c98a00; border-radius: var(--radius); background: #fff; padding: .7rem .8rem; }
.hm-attn.is-pay { border: 2px solid var(--red); border-left-width: 8px; background: #fff7f6; }
.hm-deadline { display: flex; gap: .5rem; align-items: flex-start; margin: 0 0 .5rem; padding: .5rem .65rem; border-radius: 8px; background: #fff2dc; color: #6b4200; font-size: .92rem; font-weight: 600; }
.hm-deadline.pay-overdue, .hm-deadline.pay-urgent { background: #fde0dd; color: #8e1f15; }
.hm-deadline .ic { width: 20px; height: 20px; flex: none; margin-top: .1rem; }
.hm-attn-list { list-style: none; margin: 0; padding: 0; }
.hm-attn-item { display: flex; align-items: center; gap: .65rem; padding: .55rem 0; border-top: 1px solid rgba(0, 0, 0, .08); }
.hm-attn-item:first-child { border-top: 0; }
.hm-attn-info { flex: 1; min-width: 0; display: grid; gap: .1rem; }
.hm-attn-info strong { overflow-wrap: anywhere; }
.hm-attn-info small { color: #43506a; overflow-wrap: anywhere; }
.pay-tag { justify-self: start; padding: 0 .45rem; border-radius: 5px; background: var(--red); color: #fff; font-size: .68rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.hm-attn-btn { flex: none; min-height: 46px; min-width: 5.2rem; display: inline-flex; align-items: center; justify-content: center; text-align: center; }
.hm-more summary { min-height: 40px; display: flex; align-items: center; color: var(--blue); font-weight: 700; cursor: pointer; }
.hm-clear { display: flex; align-items: center; gap: .4rem; margin: 0 0 .75rem; padding: .35rem .2rem; color: #1c6b3e; font-weight: 700; font-size: .92rem; }
.hm-clear .ic { width: 18px; height: 18px; }
.hm-wi { border-left: 6px solid #c98a00; background: #fff; border-radius: var(--radius); border: 1px solid var(--line); border-left-width: 6px; padding: .6rem .8rem; }
.hm-wi-item { display: flex; align-items: center; gap: .65rem; padding: .5rem 0; border-top: 1px solid var(--line); }
.hm-wi-item:first-child { border-top: 0; }
.hm-wi-info { flex: 1; min-width: 0; display: grid; color: var(--ink); text-decoration: none; }
.hm-wi-info small { color: var(--muted); overflow-wrap: anywhere; }
.hm-wi-item form { margin: 0; }
.hm-week { display: block; margin: 0 0 .85rem; padding: .65rem .8rem; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); color: var(--ink); text-decoration: none; }
.hm-week-h { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: .35rem; }
.hm-week-h small { color: var(--muted); }
.hm-week-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .4rem; }
.hm-stat { display: grid; gap: .1rem; min-width: 0; }
.hm-stat em { font-style: normal; font-size: .68rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); font-weight: 700; line-height: 1.15; }
.hm-stat b { font-size: 1.1rem; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.hm-stat.pay b { color: #1c6b3e; }
.hm-tools { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .45rem; margin: 0 0 .85rem; }
.hm-tool { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .25rem; min-height: 72px; padding: .45rem .2rem; background: #fff; border: 1px solid var(--line); border-radius: 12px; color: var(--ink); font-size: .74rem; font-weight: 800; line-height: 1.15; text-align: center; text-decoration: none; }
.hm-tool .tool-ic { width: 34px; height: 34px; border-radius: 10px; }
.hm-badge { display: inline-block; min-width: 1.2rem; padding: 0 .3rem; border-radius: 999px; background: var(--red); color: #fff; font-size: .7rem; }
.hm-office { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 .85rem; }
.hm-chip { display: inline-flex; align-items: center; gap: .3rem; min-height: 40px; padding: .35rem .8rem; background: #fff; border: 1px solid var(--line); border-radius: 999px; color: var(--ink); font-size: .88rem; font-weight: 700; text-decoration: none; }
@media (min-width: 760px) { .hm-next, .hm-attn, .hm-week { max-width: 760px; } .hm-actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } .hm-actions form { grid-column: auto; } }

/* Round 6 polish: a lone second button spans the card, money never wraps, tighter rhythm */
.hm-actions > a:nth-child(2):last-child { grid-column: 1 / -1; }
.hm-week-grid { grid-template-columns: .7fr 1.25fr 1.25fr .8fr; }
.hm-stat b { font-size: 1rem; white-space: nowrap; }
.hm-row { min-height: 52px; }
.hm-sec { margin-bottom: .7rem; }
.hm-week { margin-bottom: .7rem; }

/* Round 6: keep the first screen to one phone screen (the week snapshot must clear the tab bar) */
.hm-clear { padding: .2rem .2rem; margin-bottom: .6rem; }
.hm-upnext { min-height: 40px; }
.hm-sec-h { margin-bottom: .35rem; }
.hm-next { padding-bottom: .75rem; }

/* Round 6 follow-up: one Action needed list; the badge carries the urgency, not the whole card */
.hm-attn, .hm-attn.is-pay { border: 1px solid var(--line); border-left: 4px solid #d8b4af; background: #fff; border-radius: var(--radius); padding: .7rem .8rem; }
.hm-count, .hm-count.wi { background: var(--navy); color: #fff; }
.hm-count.wi { background: #8a5a00; }
.hm-deadline { background: #fff6e6; color: #6b4200; }
.hm-deadline.pay-urgent, .hm-deadline.pay-overdue { background: #fdeceb; color: #7a2a22; }
.tier-tag { justify-self: start; padding: 0 .45rem; border-radius: 5px; font-size: .68rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.tier-tag.pay { background: var(--red); color: #fff; }
.tier-tag.payroll { background: #fff0cf; color: #7a4d00; border: 1px solid #ecc977; }
.tier-tag.todo { background: #e8ecf2; color: #43506a; }
.hm-attn-btn { max-width: 9.6rem; padding: .45rem .7rem; white-space: normal; line-height: 1.15; }
.hm-week-note { display: block; margin-top: .4rem; color: #5a4a1a; font-size: .82rem; font-weight: 600; }
.hm-tool { font-size: .72rem; min-height: 78px; }

/* due soon is amber; only a passed deadline is tinted red */
.hm-deadline.pay-urgent { background: #fff6e6; color: #6b4200; }
.hm-deadline.pay-overdue { background: #fdeceb; color: #7a2a22; }

/* Round 6 mobile polish: Home has no navy top bar, so give it the same navy status zone the other screens have (the system clock and
   battery are white on iPhone), and start the whole page below it. The inset is 0 in normal Safari, so nothing changes there. */
body.home-top::before { content: ''; position: fixed; top: 0; left: 0; right: 0; height: 0; height: env(safe-area-inset-top, 0px); background: linear-gradient(180deg, var(--navy) 0%, var(--navy-deep) 100%); z-index: 45; pointer-events: none; }
body.home-top .wrap { padding-top: 1.25rem; }

/* ===== Round 7: category icon grid, usage line, invoice-description sheet ===== */
.eb-section { margin: .35rem 0 .4rem; color: var(--muted); font-size: .9rem; font-weight: 600; }
.eb-usage { display: block; margin-top: .3rem; color: #6b4200; }
.idesc-card { max-height: min(88vh, 720px); overflow-y: auto; overscroll-behavior: contain; }
.idesc-text { width: 100%; box-sizing: border-box; margin: .4rem 0 .6rem; padding: .6rem .7rem; border: 1px solid var(--line); border-radius: 12px; background: #f7f9fc; color: var(--ink); font: inherit; font-size: .9rem; line-height: 1.4; resize: vertical; }
.idesc-card .btn, .idesc-card .btn-ghost { margin-top: .4rem; text-align: center; text-decoration: none; display: block; }
.idesc-msg { min-height: 1.3em; margin: .5rem 0 .2rem; color: #1c4f9f; font-size: .9rem; font-weight: 600; }

/* Round 7 correction: ONE clean icon grid for categories. Equal-size tiles, icon in the same spot on every tile, names wrap to two lines. */
.eb-cats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; margin: .35rem 0 1rem; }
.eb-cats[hidden] { display: none; }
.eb-cat { position: relative; display: block; min-width: 0; min-height: 96px; padding: .65rem .7rem; text-align: left; background: #fff; border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 1px 2px rgba(17, 40, 74, .05); color: var(--ink); font: inherit; cursor: pointer; }
.eb-cat:active { transform: scale(.98); }
.eb-cat:focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; }
.eb-cat-ic { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: var(--tone-bg, #e8eef8); color: var(--tone-fg, var(--navy)); }
.eb-cat-ic .cat-ic, .eb-cat-ic svg { width: 24px; height: 24px; }
.eb-cat-name { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-top: .4rem; font-size: .9rem; font-weight: 750; line-height: 1.2; min-height: 2.4em; overflow-wrap: anywhere; }
.eb-cat-n { position: absolute; top: .65rem; right: .7rem; min-width: 1.5rem; padding: .05rem .45rem; border-radius: 999px; background: #eef1f6; color: #5d6b82; font-size: .75rem; font-weight: 800; text-align: center; }
.eb-cat-top { grid-column: 1 / -1; display: flex; align-items: center; gap: .8rem; min-height: 68px; padding: .6rem .85rem; background: linear-gradient(180deg, #fffaf0, #fff4d9); border: 2px solid #f0d58a; --tone-bg: #ffe9ad; --tone-fg: #8a5a00; }
.eb-cat-top .eb-cat-text { display: grid; gap: .1rem; min-width: 0; }
.eb-cat-top .eb-cat-name { margin: 0; min-height: 0; font-size: 1.05rem; -webkit-line-clamp: 1; }
.eb-cat-top small { color: #7a5a1a; font-size: .8rem; font-weight: 600; }
.eb-cat-costs { border-style: dashed; background: #f6f8fb; box-shadow: none; --tone-bg: #eef1f5; --tone-fg: var(--navy); }
.eb-cat-head { display: grid; gap: .5rem; margin: .35rem 0 .5rem; }
.eb-cat-back { justify-self: start; display: inline-flex; align-items: center; gap: .3rem; min-height: 44px; padding: .3rem .8rem .3rem .5rem; background: #fff; border: 1px solid var(--line); border-radius: 999px; color: var(--blue); font: inherit; font-weight: 700; cursor: pointer; }
.eb-cat-back .ic { width: 18px; height: 18px; }
.eb-cat-title { display: flex; align-items: center; gap: .6rem; min-width: 0; }
.eb-cat-title strong { font-size: 1.1rem; line-height: 1.2; overflow-wrap: anywhere; }
@media (min-width: 600px) { .eb-cats { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); } .eb-cat-top { grid-column: 1 / -1; } }
/* keep the last tile / service clear of the Current Estimate bar and the tab bar */
.eb-list, .eb-cats { scroll-margin-bottom: 8rem; }
.eb { padding-bottom: .5rem; }

/* hidden means hidden, even for elements whose own style sets a display (the empty list / Show more box under the category grid) */
.eb-list[hidden], #eb-more[hidden], .eb-none[hidden], .eb-cat-head[hidden], .eb-section[hidden] { display: none !important; }

/* ===== Round 7 correction: after an estimate is sold (Do Job Now / Schedule for Another Day) ===== */
.sold-panel { border-left: 5px solid var(--navy); }
.sold-opt { display: block; width: 100%; min-height: 72px; padding: .8rem 1rem; margin-top: .6rem; text-align: left; list-style: none; cursor: pointer; font: inherit; }
.sold-opt strong { display: block; font-size: 1.15rem; line-height: 1.2; }
.sold-opt small { display: block; margin-top: .15rem; font-size: .9rem; font-weight: 500; opacity: .85; }
.sold-later > summary::-webkit-details-marker, .sold-resched > summary::-webkit-details-marker { display: none; }
.sold-later[open] > summary { border-color: var(--navy); }
.sold-form { margin-top: .75rem; padding: .85rem; background: #f6f8fb; border: 1px solid var(--line); border-radius: 14px; display: grid; gap: .75rem; }
.sold-who { display: grid; gap: .2rem; }
.sold-team { margin: 0; }
.appt-summary { display: grid; gap: .15rem; margin-bottom: .6rem; }
.appt-state { font-size: .8rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--navy); }
.appt-when { font-size: 1.2rem; line-height: 1.25; }
.appt-tech { color: #43506a; }
.sold-resched > summary { display: inline-flex; align-items: center; min-height: 46px; padding: .4rem 1.1rem; list-style: none; cursor: pointer; border: 1px solid var(--line); border-radius: 999px; background: #fff; font-weight: 700; }
.sold-ask { margin-top: .4rem; }

/* Everything inside a <details> inherits box-sizing through the browser's built-in slot, which is content-box, so full-width inputs and
   buttons with padding grew past their card. State it outright for all collapsible sections. */
details, details * { box-sizing: border-box; }
.sold-form { grid-template-columns: minmax(0, 1fr); }
.sold-form > * { min-width: 0; }

/* Round 7 (14.2): sticky Back + Continue on the Review step: the total on top, Back and Present to customer side by side underneath */
.sticky-total.has-back { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "sum sum" "back go"; gap: .55rem .6rem; align-items: center; }
.sticky-total.has-back .sticky-sum { grid-area: sum; display: flex; align-items: baseline; justify-content: space-between; gap: .75rem; min-width: 0; }
.sticky-total.has-back .sticky-sum small { margin: 0; }
.sticky-total.has-back .sticky-sum strong { font-size: 1.3rem; white-space: nowrap; }
.sticky-back { grid-area: back; display: inline-flex; align-items: center; gap: .25rem; min-height: 48px; padding: .3rem 1rem .3rem .65rem; text-decoration: none; background: rgba(255, 255, 255, .12); color: #fff; border-color: rgba(255, 255, 255, .25); }
.sticky-back .ic { width: 18px; height: 18px; }
.sticky-total.has-back > .btn { grid-area: go; min-height: 48px; text-align: center; }

/* Round 7 (14.1b): the Recommended add-ons editor */
.rec-editor { border: 1px solid var(--line); border-radius: 14px; padding: .8rem .9rem 1rem; margin: 1rem 0; min-width: 0; }
.rec-editor legend { padding: 0 .4rem; font-weight: 800; }
.rec-selected { list-style: none; margin: .5rem 0; padding: 0; display: grid; gap: .45rem; }
.rec-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .6rem; padding: .55rem .65rem; background: #f6f8fb; border: 1px solid var(--line); border-radius: 12px; }
.rec-row.is-off { background: #fff7e6; border-color: #f0d58a; }
.rec-info { display: grid; gap: .1rem; min-width: 0; }
.rec-info strong { overflow-wrap: anywhere; }
.rec-info small { color: var(--muted); overflow-wrap: anywhere; }
.rec-ctrl { display: inline-flex; gap: .3rem; }
.rec-ctrl button { width: 44px; height: 44px; display: grid; place-items: center; background: #fff; border: 1px solid var(--line); border-radius: 10px; color: var(--navy); font: inherit; font-size: 1.1rem; font-weight: 800; cursor: pointer; }
.rec-ctrl button:disabled { opacity: .35; cursor: default; }
.rec-ctrl .rec-del { color: #c0272d; }
.rec-find { display: grid; gap: .3rem; margin-top: .6rem; }
.rec-results { list-style: none; margin: .4rem 0 0; padding: .25rem; border: 1px solid var(--line); border-radius: 12px; background: #fff; display: grid; gap: .15rem; }
.rec-hit { display: grid; width: 100%; gap: .1rem; min-height: 48px; padding: .5rem .7rem; text-align: left; background: none; border: 0; border-radius: 8px; font: inherit; color: var(--ink); cursor: pointer; }
.rec-hit:hover, .rec-hit:focus-visible { background: #eef4fd; }
.rec-hit small, .rec-none { color: var(--muted); }
.rec-none { padding: .6rem .7rem; }
.rec-results[hidden], .rec-empty[hidden] { display: none; }

/* the "Often added with..." recommendations are the most-tapped add-on control: full-size tap targets that wrap, never run off the screen */
.eb-suggest { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; }
.eb-suggest strong { flex: 1 1 100%; }
.eb-suggest .btn-ghost { min-height: 44px; max-width: 100%; text-align: left; white-space: normal; line-height: 1.2; }

/* ===== Round 7A: desktop Administrator / Dispatcher Operations Home =====
   Shown ONLY on a real desktop (wide + mouse/trackpad). Phones, iPads and touch screens keep the technician Home untouched. */
.tech-home { display: contents; }
.ops-home { display: none; }
.ops-switch { display: none; }
@media (min-width: 1100px) and (hover: hover) and (pointer: fine) {
  body.has-ops:not(.ops-mine) .ops-home { display: block; }
  body.has-ops:not(.ops-mine) .tech-home { display: none; }
  body.has-ops .wrap { max-width: 1600px; }
  body.has-ops.ops-mine .ops-switch { display: inline; font-weight: 800; margin-left: .5rem; }
}
.ops-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.ops-head h1 { margin: 0; font-size: 1.7rem; color: var(--navy); }
.ops-head p { margin: .1rem 0 0; color: var(--muted); font-weight: 600; }
.ops-head-act { display: flex; gap: .5rem; flex-wrap: wrap; }
.ops-head-act .btn { min-height: 48px; font-size: 1.05rem; }
.ops-grid { display: grid; grid-template-columns: minmax(0, 1fr) clamp(330px, 27vw, 420px); gap: 1.1rem; align-items: start; }
.ops-main, .ops-rail { min-width: 0; }
.ops-main { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: .9rem 1rem 1rem; }
.ops-main-h { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin-bottom: .5rem; }
.ops-main-h h2, .ops-rail-h h2 { margin: 0; font-size: 1.15rem; }
.ops-board { list-style: none; margin: 0; padding: 0; display: grid; gap: .4rem; }
.ops-row { display: grid; grid-template-columns: 9.5rem minmax(0, 1.6fr) minmax(0, 1fr) auto auto; align-items: center; gap: .75rem; padding: .6rem .75rem; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.ops-row > * { min-width: 0; }
.ops-time { font-weight: 800; color: var(--navy); }
.ops-what { display: grid; gap: .1rem; }
.ops-what strong, .ops-what small, .ops-who { overflow-wrap: anywhere; }
.ops-what small { color: var(--muted); }
.ops-state { display: flex; gap: .3rem; flex-wrap: wrap; }
.ops-act { display: flex; gap: .35rem; justify-content: flex-end; flex-wrap: wrap; }
.ops-row.is-meeting { background: #f2f6fd; border-left: 4px solid var(--blue); }
.ops-row.is-late { border-left: 4px solid #c27a00; background: #fffaf0; }
.ops-row.is-cancelled { opacity: .6; background: #f4f5f7; }
.ops-row.is-cancelled .ops-what strong { text-decoration: line-through; }
.late-badge { background: #fff2dc; color: #9a5b00; }
@media (max-width: 1400px) {
  .ops-row { grid-template-columns: 7rem minmax(0, 1fr) auto; grid-template-areas: "t w s" "t o a"; }
  .ops-time { grid-area: t; } .ops-what { grid-area: w; } .ops-state { grid-area: s; } .ops-who { grid-area: o; } .ops-act { grid-area: a; }
}
.ops-rail { display: grid; gap: .75rem; }
.ops-rail-h { padding: 0 .1rem; }
.ops-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .45rem; }
.ops-kpi { display: grid; gap: .1rem; padding: .55rem .5rem; border: 1px solid var(--line); border-radius: 12px; background: #fff; text-decoration: none; color: var(--navy); text-align: center; }
.ops-kpi b { font-size: 1.5rem; line-height: 1; }
.ops-kpi span { font-size: .78rem; font-weight: 700; color: var(--muted); }
.ops-kpi.warn { border-color: #e6c36a; background: #fffaf0; }
.ops-kpi.crit { border-color: #e7b4b7; background: #fff5f5; }
.ops-mod, .ops-card { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: .75rem .85rem; min-width: 0; }
.ops-mod.crit { border-color: #e7b4b7; }
.ops-mod h3, .ops-card h3 { margin: 0 0 .45rem; font-size: 1rem; }
.ops-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .4rem; }
.ops-list li { display: flex; justify-content: space-between; align-items: center; gap: .6rem; min-width: 0; }
.ops-list li > span { display: grid; gap: .05rem; min-width: 0; overflow-wrap: anywhere; }
.ops-list small { color: var(--muted); }
.ops-more { color: var(--muted); font-size: .9rem; }
.ops-line { margin: 0; }
.ops-techlist li { justify-content: flex-start; }
.ops-dot { flex: 0 0 auto; width: 12px; height: 12px; border-radius: 50%; background: #9aa7ba; }
.ops-dot.s-on_site { background: #1c8042; } .ops-dot.s-en_route { background: #c27a00; } .ops-dot.s-meeting { background: var(--blue); }
.ops-dot.s-late { background: #c0392b; } .ops-dot.s-next { background: #5d6b82; } .ops-dot.s-free { background: #cdd6e3; } .ops-dot.s-done { background: #1c8042; opacity: .5; }
.ops-lower { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.1rem; margin-top: 1.1rem; }
.ops-attn-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: .3rem; }
.ops-attn-grid li { display: flex; justify-content: space-between; align-items: center; gap: .6rem; }
.ops-n { min-width: 2rem; text-align: center; padding: .15rem .5rem; border-radius: 999px; background: #eef1f6; color: var(--navy); font-weight: 800; text-decoration: none; }
.ops-n.on { background: #fff2dc; color: #9a5b00; }
.ops-stats { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.ops-stats span { display: grid; gap: .1rem; padding: .5rem .6rem; background: #f6f8fb; border-radius: 10px; }
.ops-stats em { font-style: normal; font-size: .78rem; color: var(--muted); font-weight: 700; }
.ops-stats b { font-size: 1.2rem; color: var(--navy); }
.ops-activity { list-style: none; margin: 0; padding: 0; display: grid; gap: .35rem; }
.ops-activity li { display: grid; gap: .05rem; overflow-wrap: anywhere; }
.ops-activity small { color: var(--muted); }
.ops-tools { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-top: 1.1rem; padding: .6rem .8rem; background: #fff; border: 1px solid var(--line); border-radius: 14px; }
.ops-tools strong { margin-right: .25rem; }

/* ===== Round 8: special pay labels and the pay-type control ===== */
.pay-note { display: inline-block; margin-top: .15rem; font-weight: 800; color: #1e3a5f; }
.pay-rule { display: grid; gap: .35rem; margin: .5rem 0; }
.pay-rule-line { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.paytype-panel { padding: .55rem .9rem; }
.paytype-panel summary { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; min-height: 40px; cursor: pointer; }
.paytype-panel summary span { color: var(--muted); font-weight: 700; }

/* ===== Round 8: Guided Next Step ===== */
.ns-panel { padding: .75rem .9rem .8rem; border-left: 5px solid var(--navy); display: grid; gap: .55rem; }
.ns-panel.ns-waiting { border-left-color: #5d6b82; background: #f6f8fb; }
.ns-panel.ns-done { border-left-color: #1c8042; background: #f2faf5; }
.ns-head { display: grid; gap: .1rem; }
.ns-tag { font-size: .72rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.ns-here { font-size: 1.02rem; color: var(--ink); overflow-wrap: anywhere; }
.ns-here b { font-weight: 800; }
.ns-main { display: grid; }
.ns-main .btn, .ns-main form, .ns-main .inline-form { width: 100%; }
.ns-primary { min-height: 56px; font-size: 1.12rem; justify-content: center; text-align: center; }
.ns-warn.btn { background: #b36b00; color: #fff; }
.ns-warn.btn:hover { background: #8f5500; }
.ns-note { margin: 0; color: var(--muted); font-size: .9rem; }
.ns-wait { margin: 0; display: flex; gap: .4rem; align-items: center; font-weight: 700; color: var(--ink); }
.ns-wait .ic { width: 20px; height: 20px; color: #1c8042; flex: 0 0 auto; }
.ns-alts { display: flex; flex-wrap: wrap; gap: .4rem; }
.ns-alts form, .ns-alts .inline-form { margin: 0; }
.ns-alts .btn-ghost { min-height: 44px; }
.ns-strip { list-style: none; margin: .1rem 0 0; padding: 0; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 3px; }
.ns-strip li { height: 6px; border-radius: 3px; background: #d5dde9; overflow: hidden; }
.ns-strip li span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ns-strip li.done { background: #1c8042; }
.ns-strip li.now { background: var(--blue); }
.ns-count { margin: 0; font-size: .78rem; font-weight: 700; color: var(--muted); }
.hm-here { margin: .15rem 0 .35rem; font-size: .9rem; font-weight: 700; color: var(--muted); }
.hm-nextline { color: var(--navy); font-weight: 800; }
.hm-actions .inline-form, .hm-actions form { margin: 0; }
.stop .hm-here { margin: 0 0 .3rem; }

/* ---- Guided Job Flow (v2.20.1): blue = next action, amber = required, green = done, grey = optional, red = real errors only ---- */
.ns-primary { text-transform: uppercase; letter-spacing: .02em; font-weight: 800; }
.ns-main a.ns-primary::after, .ns-main button.ns-primary::after { content: " \2192"; }
.ns-flow { list-style: none; margin: .1rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: .15rem .35rem; font-size: .84rem; color: var(--muted); font-weight: 700; }
.ns-flow li + li::before { content: "\2192"; margin-right: .35rem; color: #9aa7bc; font-weight: 400; }
.ns-flow li.done { color: #1c8042; }
.ns-flow li.now { color: var(--blue); }
.ns-badge { display: inline-block; font-size: .68rem; font-weight: 800; letter-spacing: .06em; padding: .08rem .4rem; border-radius: 999px; background: #b36b00; color: #fff; vertical-align: .08em; }
.ns-req-card { border: 2px solid #e0a84a; background: #fff8ea; border-radius: var(--radius-sm); padding: .7rem .8rem; margin: .2rem 0 .9rem; display: grid; gap: .5rem; }
.ns-req-card.ns-req-ok { border-color: #8fcba6; background: #f2faf5; }
.ns-req-title { margin: 0; font-weight: 800; color: var(--ink); }
.ns-req-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.ns-req-list li { display: grid; gap: .35rem; }
.ns-req-list li.now .ns-req-what { font-size: 1.05rem; }
.ns-req-list li.later { opacity: .85; }
.ns-req-go { min-height: 48px; justify-content: center; text-align: center; text-transform: uppercase; letter-spacing: .02em; font-weight: 800; }
.ns-req-list li.now .ns-req-go { background: var(--navy); color: #fff; min-height: 52px; }
.ns-req-done { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .25rem .75rem; color: #1c6b3a; font-size: .88rem; font-weight: 700; }
.ns-req-ok .ns-req-title { color: #1c6b3a; }
.ns-target-req { outline: 3px solid #e0a84a; outline-offset: 4px; border-radius: 8px; background: #fffaf0; }
.ns-target-now { outline-width: 4px; background: #fff3d6; }
.ns-flash { animation: nsflash 1.8s ease-out 1; }
@keyframes nsflash { 0% { box-shadow: 0 0 0 0 rgba(224,168,74,.9); } 100% { box-shadow: 0 0 0 14px rgba(224,168,74,0); } }
.ns-target-req > .ns-badge, .ns-target-req .ns-badge-slot { margin-left: .35rem; }
.ns-dock { display: none; }
@media (max-width: 1024px) {
  .ns-dock { display: grid; gap: .25rem; position: fixed; left: 0; right: 0; z-index: 39; bottom: calc(var(--tabbar-h) + env(safe-area-inset-bottom, 0px)); background: #fff; border-top: 1px solid var(--line); box-shadow: 0 -4px 14px rgba(15,35,70,.1); padding: .5rem .9rem .55rem; }
  .ns-dock-note { font-size: .8rem; font-weight: 800; color: #8f5500; text-align: center; }
  .ns-dock .btn { min-height: 52px; }
  .ns-dock form { margin: 0; }
  .ns-panel.has-dock .ns-main { position: fixed; left: 0; right: 0; z-index: 39; bottom: calc(var(--tabbar-h) + env(safe-area-inset-bottom, 0px)); background: #fff; border-top: 1px solid var(--line); box-shadow: 0 -4px 14px rgba(15,35,70,.1); padding: .5rem .9rem .55rem; }
  body.has-ns-dock .wrap { padding-bottom: calc(var(--tabbar-h) + 6.5rem + env(safe-area-inset-bottom, 0px)); }
  body.ns-kb .ns-dock, body.ns-kb .ns-panel.has-dock .ns-main { position: static; box-shadow: none; border: 0; padding: 0; }
  body.ns-kb .ns-dock-note { display: none; }
}

/* ---- Monthly bonus (v2.21.0): validation view + one compact Home card, below everything the technician must do ---- */
.hm-bonus { display: grid; gap: .4rem; padding: .75rem .9rem; margin: .9rem 0 0; background: #fff; border: 1px solid var(--line); border-left: 5px solid #1c8042; border-radius: var(--radius-sm); color: var(--ink); text-decoration: none; }
.hm-bonus-h { display: flex; justify-content: space-between; gap: .5rem; align-items: baseline; }
.hm-bonus-h small, .hm-bonus-f { color: var(--muted); font-weight: 700; font-size: .85rem; font-variant-numeric: tabular-nums; }
.bn-bar { display: block; height: 10px; border-radius: 5px; background: #d5dde9; overflow: hidden; }
.bn-bar i { display: block; height: 100%; background: #1c8042; border-radius: 5px; }
.bn-big { margin: .2rem 0; font-size: 1.1rem; font-variant-numeric: tabular-nums; } .bn-big b { font-size: 1.8rem; } .bn-big span { color: var(--muted); }
.bn-line { margin: .3rem 0; font-weight: 700; color: var(--muted); }
.bn-status { margin: .4rem 0 0; font-weight: 700; } .bn-status.ok { color: #1c6b3a; } .bn-status.warn { color: #8f5500; }
.bn-table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; } .bn-table th { text-align: left; font-weight: 700; padding: .45rem .3rem; border-bottom: 1px solid var(--line); } .bn-table th small { display: block; font-weight: 400; color: var(--muted); }
.bn-table td { text-align: right; padding: .45rem .3rem; border-bottom: 1px solid var(--line); white-space: nowrap; } .bn-table tr.sub th { font-weight: 400; padding-left: 1rem; } .bn-table tr.tot th, .bn-table tr.tot td { font-weight: 800; background: #f6f8fb; }
.bn-checks, .bn-jobs { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.bn-checks li { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: .5rem; } .bn-checks small { display: block; color: var(--muted); }
.bn-mark { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; font-weight: 800; background: #e8edf5; color: #5d6b82; }
.bn-checks li.ok .bn-mark { background: #1c8042; color: #fff; } .bn-checks li.fail .bn-mark { background: #b36b00; color: #fff; }
.bn-job { display: block; margin-top: .25rem; font-size: .9rem; min-height: 44px; line-height: 44px; }
.bn-jobs a { display: flex; justify-content: space-between; gap: .75rem; min-height: 48px; align-items: center; padding: .5rem .2rem; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; } .bn-jobs small { display: block; color: var(--muted); } .bn-jobs li.in small { color: #1c6b3a; } .bn-amt { font-weight: 800; font-variant-numeric: tabular-nums; }
body.bt-shell .hm-bonus { margin-bottom: .5rem; }

/* ---- Bonus administration (v2.22.0) ---- */
.bn-nudge { margin: .35rem 0 0; font-weight: 700; color: var(--blue); }
.bn-sum { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; margin: .5rem 0; } .bn-sum div { background: #f6f8fb; border-radius: var(--radius-sm); padding: .5rem .6rem; } .bn-sum span { display: block; color: var(--muted); font-size: .78rem; font-weight: 700; } .bn-sum b { font-variant-numeric: tabular-nums; font-size: 1.02rem; }
.bn-rep, .bn-events, .bn-log { list-style: none; margin: 0; padding: 0; }
.bn-rep-link { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: .75rem; align-items: center; min-height: 56px; padding: .55rem .2rem; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.bn-rep-name small, .bn-rep-num small { display: block; color: var(--muted); font-size: .8rem; } .bn-rep-num { text-align: right; font-variant-numeric: tabular-nums; }
.bn-events li { display: flex; justify-content: space-between; gap: .75rem; align-items: center; padding: .5rem 0; border-bottom: 1px solid var(--line); } .bn-events small { display: block; color: var(--muted); } .bn-events li.void { opacity: .55; text-decoration: line-through; }
.bn-void { margin: 0; } .bn-void .btn-text { min-height: 44px; }
@media (max-width: 520px) { .bn-rep-link { grid-template-columns: minmax(0, 1fr) auto; } .bn-rep-num:nth-of-type(3) { grid-column: 2; } }

.hm-bonus { display: block; } .hm-bonus-link { display: grid; gap: .4rem; color: var(--ink); text-decoration: none; min-height: 44px; }
.hm-bonus .bn-nudge { margin: .5rem 0 0; font-size: .92rem; }
.hm-bonus-checks { list-style: none; margin: .5rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: .3rem .6rem; }
.hm-bonus-checks a { display: inline-flex; align-items: center; gap: .3rem; min-height: 44px; color: var(--ink); text-decoration: none; font-size: .8rem; font-weight: 700; }
.hm-bonus-checks li.ok .bn-mark { background: #1c8042; color: #fff; } .hm-bonus-checks li.fail .bn-mark { background: #b36b00; color: #fff; } .hm-bonus-checks li.fail a { color: #8f5500; }
.hm-bonus-math summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; font-weight: 700; color: var(--blue); }

/* ---- Form builder and custom forms (v2.23.0) ---- */
.fb-list, .fb-fields { list-style: none; margin: 0; padding: 0; display: grid; gap: .1rem; }
.fb-row { display: flex; justify-content: space-between; gap: .75rem; align-items: center; min-height: 56px; padding: .5rem .2rem; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.fb-row small, .fb-field small, .jf-row small { display: block; color: var(--muted); font-weight: 400; } .fb-meta { text-align: right; }
.fb-field { padding: .5rem 0; border-bottom: 1px solid var(--line); } .fb-field-h { display: flex; justify-content: space-between; gap: .75rem; align-items: center; }
.fb-move form { display: flex; gap: .25rem; margin: 0; } .fb-move .btn-ghost { min-width: 44px; min-height: 44px; padding: 0; justify-content: center; }
.fb-field-form { padding: .5rem 0; } .fb-field-form label { display: block; }
.jf-row { display: flex; justify-content: space-between; gap: .75rem; align-items: center; min-height: 56px; border-bottom: 1px solid var(--line); } .jf-row .btn, .jf-row .btn-ghost { min-height: 48px; min-width: 88px; justify-content: center; }
.cf-pad { width: 100%; max-width: 100%; height: 160px; border: 2px dashed #9aa7bc; border-radius: var(--radius-sm); background: #fff; touch-action: none; display: block; margin: .25rem 0; }
.cf-sig-img { max-width: 100%; height: auto; border: 1px solid var(--line); border-radius: 6px; }
.cf-fixed { padding: .5rem .7rem; background: #f6f8fb; border-radius: var(--radius-sm); }
@media print { .sticky-save, .backlink, .btn-row, header.top, .no-print { display: none !important; } }

/* Round 13: tour and practice job */
.tour{text-align:center}.tour h1{margin:.25rem 0}.tour-text{font-size:1.1rem;margin:.5rem 0 1rem}
.tour-dots{display:flex;gap:8px;justify-content:center;margin-bottom:.5rem}
.tour-dots span{width:10px;height:10px;border-radius:50%;background:#cfd6e0}.tour-dots span.on{background:#1d4ed8;transform:scale(1.2)}.tour-dots span.done{background:#16a34a}
.tour .btn-text,.tour-skip .btn-text{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;margin-top:.5rem}
.eyebrow{font-size:.8rem;text-transform:uppercase;letter-spacing:.04em;color:#64748b;margin:0}
.train-card{background:#f1f5f9;border-radius:10px;padding:.75rem;margin:.5rem 0 1rem;overflow-wrap:anywhere}
.train-row{display:flex;justify-content:space-between;align-items:center;gap:.5rem;padding:.35rem 0;border-bottom:1px solid #e5e9f0}
.train-row .btn,.train-row .btn-text{min-height:44px;min-width:44px}
.train-more summary{min-height:44px;display:flex;align-items:center;cursor:pointer}
.train-report{list-style:none;padding:0;margin:1rem 0}.train-report li{padding:.6rem .75rem;border-radius:8px;margin-bottom:.4rem;overflow-wrap:anywhere}
.train-report li.ok{background:#dcfce7}.train-report li.bad{background:#fee2e2}

/* ===== v2.25.0: desktop polish (wide screen + mouse only; phones and tablets are untouched) =====
   Nav moves up into the navy header, the Operations home becomes one compact three-column screen, and colour carries meaning. */
@media (min-width: 1100px) and (hover: hover) and (pointer: fine) {
  body { background: linear-gradient(180deg, #dfe8f6 0, #edf1f7 360px); }
  .top-inner { max-width: 1440px; padding: .4rem 1.25rem; min-height: 56px; }
  body.has-ops .wrap, .wrap { max-width: 1440px; }
  /* nav in the header */
  body.has-ns-dock .wrap { padding-bottom: 2rem; }

  /* Operations home: header row, then board | snapshot | attention+numbers+activity */
  body.has-ops:not(.ops-mine) .ops-home { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(280px, .8fr); gap: .9rem 1rem; align-items: start; }
  .ops-home > .ops-head, .ops-home > .ops-tools { grid-column: 1 / -1; }
  .ops-head { margin-bottom: 0; padding: .7rem 1rem; border-radius: 14px; color: #fff; background: linear-gradient(100deg, var(--navy) 0%, #1c4a94 100%); box-shadow: 0 6px 18px rgba(17,40,74,.18); }
  .ops-head h1 { color: #fff; font-size: 1.45rem; }
  .ops-head p { color: #c4d4ee; }
  .ops-head .btn { background: #c0272d; color: #fff; border-color: #c0272d; min-height: 44px; }
  .ops-head .btn-ghost { background: rgba(255,255,255,.12); color: #fff; border-color: rgba(255,255,255,.35); min-height: 44px; }
  .ops-grid { display: contents; }
  .ops-main { grid-column: 1; grid-row: 2; border-top: 4px solid var(--navy); box-shadow: 0 2px 10px rgba(17,40,74,.07); }
  .ops-rail { grid-column: 2; grid-row: 2 / span 2; gap: .6rem; }
  .ops-lower { grid-column: 1; grid-row: 3; margin-top: 0; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .9rem; align-items: start; }
  .ops-rail-h { display: none; }

  /* colour with meaning */
  .ops-kpis { gap: .5rem; }
  .ops-kpi { padding: .6rem .4rem; border-width: 0; border-top: 4px solid var(--blue); background: #eaf2ff; box-shadow: 0 1px 4px rgba(17,40,74,.08); }
  .ops-kpi b { font-size: 1.9rem; color: var(--blue); }
  .ops-kpi:nth-child(1) { border-top-color: #e08a00; background: #fff4de; } .ops-kpi:nth-child(1) b { color: #b36b00; }
  .ops-kpi:nth-child(3) { border-top-color: var(--teal); background: #e3f6f2; } .ops-kpi:nth-child(3) b { color: var(--teal); }
  .ops-kpi:nth-child(4) { border-top-color: #1c8042; background: #e5f5ea; } .ops-kpi:nth-child(4) b { color: #1c8042; }
  .ops-kpi.warn { border-top-color: #e08a00; background: #fff0cc; }
  .ops-kpi.crit { border-top-color: var(--red); background: #ffe6e7; } .ops-kpi.crit b { color: var(--red); }
  .ops-mod, .ops-card { border-top: 4px solid #8aa0c4; box-shadow: 0 2px 8px rgba(17,40,74,.06); padding: .6rem .8rem .7rem; }
  .ops-mod.crit { border-top-color: var(--red); background: #fff8f8; }
  #ops-unassigned { border-top-color: #e08a00; }
  #ops-workins { border-top-color: var(--blue); }
  #ops-techs { border-top-color: var(--teal); background: #f4fbf9; }
  #ops-tomorrow { border-top-color: var(--blue); background: #f3f7ff; }
  #ops-capacity { border-top-color: #7c4dbd; background: #f8f5fd; }
  #ops-mgmt { border-top-color: #e08a00; background: #fffaf0; }
  #ops-numbers { border-top-color: #1c8042; background: #f3faf5; }
  #ops-activity { border-top-color: var(--navy); }
  .ops-mod h3, .ops-card h3 { color: var(--navy); }
  .ops-stats span { background: #e5f5ea; } .ops-stats span:nth-child(-n+2) { background: #e6efff; }
  .ops-stats b { font-size: 1.35rem; } .ops-stats span:nth-child(-n+2) b { color: var(--blue); } .ops-stats span:nth-child(n+3) b { color: #1c8042; }
  .ops-n { background: #e0e8f5; } .ops-n.on { background: #ffd8a8; color: #7a4300; }
  .ops-activity { max-height: 15rem; overflow-y: auto; padding-right: .25rem; }
  .ops-row { border-left: 5px solid #8aa0c4; }
  .ops-row.is-meeting { border-left-color: var(--blue); }
  .ops-tools { background: #fff; border-top: 4px solid #8aa0c4; box-shadow: 0 2px 8px rgba(17,40,74,.06); }
  .ops-tools .btn-ghost { background: #eaf2ff; border-color: #bcd0f2; color: var(--navy); }
  .ops-tools .btn-ghost:hover { background: var(--blue); color: #fff; }
}
@media (min-width: 1100px) and (max-width: 1299px) and (hover: hover) and (pointer: fine) {
  .ops-lower { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Other pages on desktop: coloured panel accents and a little more life */
@media (min-width: 1100px) and (hover: hover) and (pointer: fine) {
  .panel { border-top: 3px solid #b9cbea; box-shadow: 0 2px 10px rgba(17,40,74,.06); }
  .wrap h1 { color: var(--navy); }
}

.addr-none { padding: .7rem .8rem; color: var(--muted); font-size: .9rem; }
@media (min-width: 1100px) and (hover: hover) and (pointer: fine) {
  body.has-ops:not(.ops-mine) .ops-home { align-content: start; grid-template-rows: auto min-content 1fr; }
  .ops-home .ops-head h1 { color: #fff; }
  /* pages without the navy header (the Home screens): the nav gets its own navy bar */
  body.home-top .wrap { padding-top: 4.4rem; }
}

/* ===== v2.26.0: apprentice home and hours ===== */
.ap-head h1 { margin: 0 0 .1rem; } .ap-head p { margin: 0 0 .75rem; }
.ap-clock { border-left: 6px solid #9aa7ba; } .ap-clock.on { border-left-color: #1c8042; background: #f3faf5; }
.ap-go { background: #1c8042; color: #fff; min-height: 64px; font-size: 1.25rem; }
.ap-out { background: #fff; color: #c0272d; border: 2px solid #c0272d; min-height: 52px; font-weight: 800; }
.ap-pick { display: grid; gap: .5rem; margin-top: .6rem; } .ap-pick .btn, .ap-pick .btn-ghost { min-height: 54px; }
.ap-change summary { display: inline-flex; align-items: center; min-height: 44px; cursor: pointer; }
.ap-job { display: grid; gap: .5rem; padding: .7rem 0; border-top: 1px solid var(--line); }
.ap-job .job-main { display: grid; gap: .1rem; overflow-wrap: anywhere; }
.ap-job-act { display: flex; gap: .5rem; flex-wrap: wrap; } .ap-job-act form { margin: 0; } .ap-job-act .btn, .ap-job-act .btn-ghost { min-height: 44px; }
.ap-tools { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; } .ap-tools .btn-ghost { min-height: 48px; justify-content: center; text-align: center; }
.ap-month { border-left: 6px solid var(--blue); }
.ap-weeknav { display: flex; justify-content: space-between; align-items: center; gap: .5rem; margin-bottom: .6rem; }
.ap-total { font-size: 1.5rem; font-weight: 800; color: var(--navy); margin: .2rem 0 .6rem; } .ap-total.small { font-size: 1rem; }
.ap-days { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .5rem; }
.ap-days li { display: grid; gap: .1rem; padding: .6rem .7rem; background: #f6f8fb; border-radius: 10px; overflow-wrap: anywhere; }
.ap-entry { display: grid; gap: .4rem; padding: .7rem 0; border-top: 1px solid var(--line); }
.ap-entry-top { display: grid; gap: .1rem; overflow-wrap: anywhere; }
.ap-add summary { min-height: 44px; display: inline-flex; align-items: center; cursor: pointer; }
.ap-rate { display: flex; align-items: end; gap: .6rem; flex-wrap: wrap; margin-top: .6rem; }

/* v2.27.0 dispatch board (desktop only) */
.sch-desk{display:none}
@media (min-width:1100px) and (hover:hover) and (pointer:fine){
  .sch-mobile{display:none}
  .sch-desk{display:block}
  .sd-head{display:flex;justify-content:space-between;align-items:center;background:linear-gradient(135deg,#12305a,#1e5aa8);color:#fff;border-radius:14px;padding:1rem 1.4rem;margin-bottom:.9rem}
  .sd-head h1,.wrap .sd-head h1{color:#fff;margin:0;font-size:1.6rem}
  .sd-sub{color:#cfe0f7;font-size:.9rem}
  .sd-head .btn-ghost{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.4)}
  .sd-kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:.7rem;margin-bottom:.9rem}
  .sd-k{background:#fff;border:1px solid var(--line);border-top:4px solid #999;border-radius:10px;padding:.55rem .9rem;display:flex;align-items:baseline;gap:.5rem}
  .sd-k b{font-size:1.6rem;line-height:1}.sd-k span{color:#5b6677;font-size:.82rem}
  .k-blue{border-top-color:#1e5aa8}.k-amber{border-top-color:#b8860b}.k-green{border-top-color:#2e9e5b}.k-red{border-top-color:#d9534f}.k-navy{border-top-color:#12305a}.k-grey{border-top-color:#8a94a6}
  .sd-week{display:flex;align-items:stretch;gap:.4rem;background:#fff;border:1px solid var(--line);border-radius:12px;padding:.5rem;margin-bottom:.9rem;flex-wrap:wrap}
  .sd-wnav{display:flex;align-items:center;padding:0 .7rem;font-size:1.4rem;border-radius:8px;color:#12305a;text-decoration:none}
  .sd-wnav:hover{background:#eef3fb}
  .sd-day{flex:1;min-width:92px;text-align:center;padding:.4rem .3rem;border-radius:10px;text-decoration:none;color:#223;border:1px solid transparent;display:flex;flex-direction:column;gap:.05rem}
  .sd-day small{text-transform:uppercase;color:#6b7788;font-size:.7rem;letter-spacing:.05em}
  .sd-day b{font-size:1.25rem}.sd-day span{font-size:.72rem;color:#5b6677}
  .sd-day:hover{background:#f1f5fc}
  .sd-day.is-today{border-color:#1e5aa8}
  .sd-day.is-sel{background:#12305a;color:#fff}.sd-day.is-sel small,.sd-day.is-sel span{color:#cfe0f7}
  .sd-tools{display:flex;align-items:center;gap:.5rem;margin-left:auto;padding-left:.6rem}
  .sd-tools input,.sd-tools select{width:auto;min-width:0;margin:0}
  .sd-meet{background:#f3effb;border:1px solid #ddd3f3;border-left:4px solid #7a55c9;border-radius:10px;padding:.5rem .8rem;margin-bottom:.9rem}
  .sd-meet h3{margin:0 0 .3rem;font-size:.85rem;color:#5a3ea0}
  .sd-main{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:1rem;align-items:start}
  .sd-board-wrap{overflow-x:auto;background:#fff;border:1px solid var(--line);border-radius:12px}
  .sd-board{display:grid;grid-template-columns:96px repeat(var(--cols),minmax(210px,1fr))}
  .sd-corner,.sd-colh{background:#f4f7fb;border-bottom:2px solid #d5dde9;position:sticky;top:0}
  .sd-colh{display:flex;flex-direction:column;align-items:center;gap:.1rem;padding:.6rem .4rem;border-left:1px solid var(--line)}
  .sd-colh small{color:#6b7788;font-size:.75rem}
  .sd-av{width:34px;height:34px;border-radius:50%;background:#1e5aa8;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.8rem}
  .sd-colh.is-un .sd-av{background:#d9534f}
  .sd-rowh{background:#f4f7fb;border-top:1px solid var(--line);padding:.7rem .5rem;font-size:.82rem;color:#12305a}
  .sd-cell{border-top:1px solid var(--line);border-left:1px solid var(--line);padding:.4rem;min-height:84px;display:flex;flex-direction:column;gap:.4rem}
  .sd-job{display:flex;flex-direction:column;gap:.15rem;background:#eef4fd;border:1px solid #cfe0f7;border-left:5px solid #1e5aa8;border-radius:9px;padding:.45rem .6rem;text-decoration:none;color:#1b2433;font-size:.84rem}
  .sd-job:hover{box-shadow:0 3px 10px rgba(18,48,90,.18);transform:translateY(-1px)}
  .sd-job .sd-t{color:#34415a}.sd-job .sd-a{color:#7b8698;font-size:.76rem}
  .sd-f{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.15rem;align-items:center}
  .sd-team{font-size:.72rem;background:#e3e8f1;border-radius:99px;padding:.05rem .5rem;color:#34415a}
  .st-b-en_route,.st-b-in_progress{background:#fff6e0;border-color:#f1dba0;border-left-color:#b8860b}
  .st-b-completed{background:#e9f7ee;border-color:#bfe3cd;border-left-color:#2e9e5b}
  .st-b-cancelled,.st-b-unscheduled{background:#f1f2f5;border-color:#dcdfe6;border-left-color:#8a94a6}
  .sd-job.is-cancelled{opacity:.65;text-decoration:line-through}
  .sd-rail{display:flex;flex-direction:column;gap:.8rem;position:sticky;top:5rem}
  .sd-box{background:#fff;border:1px solid var(--line);border-top:4px solid #1e5aa8;border-radius:12px;padding:.7rem .8rem}
  .sd-box h3{margin:0 0 .5rem;font-size:.95rem;display:flex;justify-content:space-between;align-items:center}
  .sd-queue{border-top-color:#b8860b}
  .sd-q,.sd-n{display:flex;flex-direction:column;padding:.45rem .5rem;border-radius:8px;text-decoration:none;color:#1b2433;font-size:.85rem}
  .sd-q:hover,.sd-n:hover{background:#f3f6fb}
  .sd-q small,.sd-n small{color:#6b7788}.sd-q span{color:#1e5aa8;font-size:.78rem;font-weight:600}
  .sd-legend span{display:flex;align-items:center;gap:.5rem;font-size:.82rem;padding:.12rem 0}
  .sd-legend i{width:12px;height:12px;border-radius:3px;display:inline-block}
  .lg-blue{background:#1e5aa8}.lg-amber{background:#b8860b}.lg-green{background:#2e9e5b}.lg-grey{background:#8a94a6}
  .sd-empty{padding:2rem;text-align:center}
}
@media (min-width:1100px) and (hover:hover) and (pointer:fine){
  .sd-tools{flex-basis:100%;margin:.2rem 0 0;padding:.5rem .3rem 0;border-top:1px solid var(--line);justify-content:flex-end}
  .sd-tools .date-input,.sd-tools .dateinput{max-width:190px}
  .sd-tools select{min-width:150px}
  .sd-tools .btn-ghost{white-space:nowrap}
  .sd-meet .meeting-card{margin:0}
  .sd-kpis{margin-bottom:.7rem}.sd-head{padding:.8rem 1.3rem}
}
@media (min-width:1100px) and (hover:hover) and (pointer:fine){
  .sd-tools>*{flex:0 0 auto}
  .sd-tools .date-field,.sd-tools .date-wrap,.sd-tools>div,.sd-tools>span{width:200px;max-width:200px}
  .sd-meet{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
  .sd-meet h3{margin:0 .5rem 0 0}
  .sd-meet .meeting-card{flex:1;min-width:260px}
}

/* v2.27.0 flow fixes */
.ns-flow { gap: .2rem .45rem; font-size: .8rem; }
.ns-flow li.now { background: #e8f1fd; border-radius: 999px; padding: 0 .5rem; }
.ns-alts { gap: .5rem; }
.ns-alts .ns-nav { flex-basis: 100%; margin-top: .6rem; justify-content: center; text-align: center; opacity: .9; }

/* estimate builder: nothing hides under the sticky Review bar on a phone (v2.27.0) */
@media (max-width: 899px) {
  #pb-pane, #custom { padding-bottom: 6.5rem; }
  .eb-list li { scroll-margin-bottom: 7rem; }
  .eb-list { margin-bottom: .5rem; }
}
.sold-alt summary { font-weight: 700; color: var(--muted); cursor: pointer; }

/* v2.29.0 Action needed (one list) */
.ops-actions li { align-items: center; gap: .6rem; border-left: 4px solid #b9cbea; padding-left: .6rem; }
.ops-actions .btn { white-space: nowrap; flex: 0 0 auto; }
.ops-actions li.tier-urgent { border-left-color: #d9534f; }
.ops-actions li.tier-pay { border-left-color: #b8860b; }
.ops-actions li.tier-payroll { border-left-color: #1e5aa8; }
.hm-attn-item.tier-urgent { border-left: 4px solid #d9534f; }
.tier-tag.urgent { background: #fde7e6; color: #a32a26; }
.hm-tool-edit { opacity: .8; }

/* Materials budget (15.9) */
.mb-line{margin:.2rem 0;padding:.55rem .75rem;border-radius:10px;background:var(--surface-2,#eef3f9);font-size:.95rem}
.mb-line.mb-over{background:#fff3d6;color:#7a4b00;border:1px solid #b8860b}
.mb-panel{padding:.6rem .9rem}
.mb-box{display:flex;flex-direction:column;gap:.15rem;margin:.75rem 0;padding:.7rem .85rem;border-radius:10px;background:var(--surface-2,#eef3f9)}

/* Materials & receipts: unmissable (job page) */
.mb-hero{border:3px solid var(--navy,#1e3a5f);background:#fff;padding:1rem}
.mb-hero.is-over{border-color:#b8860b;background:#fff8e6}
.mb-hero-head{display:flex;justify-content:space-between;align-items:center;gap:.5rem}
.mb-hero-head h2{margin:0;font-size:1.3rem}
.mb-badge-over{background:#b8860b;color:#4a2c00}
.mb-nums{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin:.75rem 0 .5rem;text-align:center}
.mb-nums small{display:block;text-transform:uppercase;letter-spacing:.04em;font-size:.72rem;color:var(--muted,#5b6b82)}
.mb-nums strong{display:block;font-size:1.7rem;line-height:1.15}
.mb-nums div:last-child strong{color:#0a7a3b}
.is-over .mb-nums div:last-child strong{color:#a35a00}
.mb-bar{height:14px;border-radius:99px;background:#dfe6ef;overflow:hidden}
.mb-bar span{display:block;height:100%;background:#0a7a3b}
.is-over .mb-bar span{background:#b8860b}
.mb-receipts{margin:.75rem 0}
.mb-amt{font-size:1rem}
.mb-add{margin-top:.5rem}
.mb-vendors{margin:.5rem 0;padding:.6rem .75rem;border-radius:10px;background:var(--surface-2,#eef3f9)}
.mb-vendors ul:not(.files){list-style:none;margin:.3rem 0;padding:0}
.mb-vendors li{display:flex;justify-content:space-between;gap:.5rem}
#mb-cj .mb-line{font-size:1.1rem;font-weight:600;border:2px solid var(--navy,#1e3a5f)}
#mb-cj .mb-line.mb-over{border-color:#b8860b}

.cb-badge{background:#fde8e8;color:#8a1c1c}
.decline-box{margin:.5rem 0}
/* Owner dashboard */
.an-periods{display:flex;gap:.4rem;flex-wrap:wrap;margin:.5rem 0}
.an-periods a{padding:.5rem .9rem;border-radius:99px;border:2px solid var(--line,#cfd8e6);font-weight:600;text-decoration:none;color:inherit}
.an-periods a.on{background:var(--navy,#1e3a5f);border-color:var(--navy,#1e3a5f);color:#fff}
.an-tiles{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin:.6rem 0}
.an-tile{display:block;padding:.8rem;border-radius:12px;border:2px solid var(--line,#cfd8e6);background:#fff;text-decoration:none;color:inherit}
.an-tile small{display:block;text-transform:uppercase;letter-spacing:.04em;font-size:.72rem;color:var(--muted,#5b6b82)}
.an-tile strong{display:block;font-size:1.6rem;line-height:1.2}
.an-tile em{font-style:normal;font-size:.8rem;color:var(--muted,#5b6b82)}
.an-card{padding:.8rem;border:1px solid var(--line,#cfd8e6);border-radius:12px;margin:.6rem 0;background:#fff}
.an-card h3{margin:.1rem 0 .4rem}
.an-grid{display:grid;grid-template-columns:1fr 1fr;gap:.35rem .8rem;margin:0}
.an-grid dt{font-size:.78rem;color:var(--muted,#5b6b82)} .an-grid dd{margin:0 0 .3rem;font-weight:700}
.an-custom{display:flex;gap:.4rem;flex-wrap:wrap;align-items:end}
@media (min-width:1100px){.an-tiles{grid-template-columns:repeat(4,1fr)}}

/* Admin scorecards table: scrolls inside its own box, never the page */
.sc-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:.6rem 0;border:1px solid var(--line,#cfd8e6);border-radius:12px}
.sc-table{border-collapse:collapse;width:100%;min-width:640px;font-size:.92rem}
.sc-table th,.sc-table td{padding:.55rem .6rem;text-align:right;border-bottom:1px solid var(--line,#e3e9f2);white-space:nowrap}
.sc-table thead th{font-size:.74rem;text-transform:uppercase;letter-spacing:.03em;position:sticky;top:0;background:#f4f7fb}
.sc-table th:first-child,.sc-table td:first-child{text-align:left;position:sticky;left:0;background:#fff}
.sc-table thead th a.on{color:var(--navy,#1e3a5f);font-weight:800}
.sc-table td small{display:block;font-size:.7rem;color:var(--muted,#5b6b82)}
.sc-table tfoot th,.sc-table tfoot td{font-weight:800;background:#f4f7fb}
.act-post{display:flex;gap:.5rem;align-items:center}.act-open{font-size:.85rem}

/* Update 4: customer presentation mode, templates, cold badge */
.present-big { font-size: 1.1rem; }
.present-big .present-card { padding: 1.4rem 1.25rem; }
.present-big .present-h { font-size: 1.15rem; margin: 1.1rem 0 .4rem; }
.btn-huge { min-height: 64px; font-size: 1.3rem; font-weight: 800; border-radius: 18px; }
.btn-approve { background: #17803d; border-color: #17803d; color: #fff; }
.btn-block { display: flex; width: 100%; justify-content: center; align-items: center; margin-top: .65rem; }
.reason-grid { display: grid; grid-template-columns: 1fr; gap: .6rem; margin: .6rem 0; }
.radio-pill.big { display: flex; }
.radio-pill.big span { width: 100%; justify-content: center; min-height: 58px; font-size: 1.15rem; }
.tpl-list { display: grid; gap: .5rem; }
.tpl-btn { display: flex; justify-content: space-between; align-items: center; width: 100%; min-height: 52px; padding: .6rem .9rem; border: 1px solid var(--line); border-radius: 14px; background: #f3f6fb; font-weight: 700; color: var(--navy); }
.cold-badge { display: inline-block; padding: .15rem .6rem; border-radius: 999px; background: #dbe9ff; color: #16407a; font-weight: 800; font-size: .8rem; }
@media (min-width: 700px) { .reason-grid { grid-template-columns: repeat(3, 1fr); } }

/* Update 5: dispatch board moves, week view, schedule history */
.view-tabs { display: flex; gap: .4rem; margin: .4rem 0 .6rem; }
.view-tabs a { min-height:44px; padding: .5rem 1.1rem; border-radius: 999px; border: 1px solid var(--line); background: #f3f6fb; font-weight: 700; color: var(--navy); min-height: 44px; display: inline-flex; align-items: center; }
.view-tabs a.on { background: var(--navy); color: #fff; border-color: var(--navy); }
.mv { margin-top: .3rem; }
.mv > summary { cursor: pointer; font-size: .85rem; font-weight: 700; color: var(--blue, #1a5fb4); min-height: 36px; display: flex; align-items: center; list-style: none; }
.mv > summary::-webkit-details-marker { display: none; }
.mv-form { display: grid; gap: .5rem; padding: .6rem; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.mv-form label { display: grid; gap: .2rem; font-size: .8rem; font-weight: 700; }
.mv-form input, .mv-form select { min-height: 44px; width: 100%; box-sizing: border-box; }
.dnd-card { cursor: grab; }
.dnd-card.dragging { opacity: .45; }
.drop-on { outline: 3px dashed var(--blue, #1a5fb4); outline-offset: -3px; background: rgba(26, 95, 180, .06); }
.sd-qwrap { margin-bottom: .5rem; }
.wk-grid { display: grid; grid-template-columns: 1fr; gap: .6rem; }
.wk-day { border: 1px solid var(--line); border-radius: 14px; padding: .6rem; background: #fff; min-width: 0; }
.wk-day.is-today { border-color: var(--navy); box-shadow: 0 0 0 2px rgba(17, 40, 74, .12); }
.wk-day h3 { display: flex; justify-content: space-between; align-items: baseline; margin: 0 0 .4rem; font-size: 1rem; }
.wk-day h3 small { color: #5b6b82; font-weight: 600; }
.wk-job { display: grid; gap: .1rem; padding: .5rem .6rem; border-radius: 10px; border-left: 5px solid #8aa3c7; background: #f3f6fb; color: inherit; text-decoration: none; margin-top: .4rem; overflow-wrap: anywhere; }
.wk-job small { color: #4a5a72; }
.wk-job.st-b-en_route, .wk-job.st-b-in_progress { border-left-color: #d98a00; }
.wk-job.st-b-completed { border-left-color: #17803d; }
.wk-job.st-b-cancelled, .wk-job.is-cancelled { border-left-color: #9aa5b5; opacity: .7; }
.wk-job.st-b-unscheduled { border-left-color: #d7262f; }
@media (min-width: 1100px) and (hover: hover) and (pointer: fine) { .wk-grid { grid-template-columns: repeat(7, minmax(0, 1fr)); } }
.mv-badge { background: #fff0cf; color: #7a4b00; font-weight: 800; }
.sh-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.sh-list li { display: grid; gap: .1rem; padding: .5rem .6rem; border-radius: 10px; background: #f3f6fb; overflow-wrap: anywhere; }
.sh-list li small { color: #5b6b82; }
.sh-list li.sh-override { background: #fff0cf; }
.conflict-box .flash { margin-bottom: .5rem; }
.rt-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.rt-stop { display: grid; gap: .25rem; padding: .8rem; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.rt-n { display: inline-grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; background: var(--navy); color: #fff; font-weight: 800; }
.rt-addr { font-size: 1.05rem; font-weight: 700; color: var(--blue, #1a5fb4); overflow-wrap: anywhere; }
.to-note { background: #fff0cf; color: #7a4b00; padding: .5rem .7rem; border-radius: 10px; margin: .4rem 0; }

/* v2.35.0: estimate options (Good / Better / Best), labor, live commission */
.tier-bar { display: grid; gap: .4rem; margin: .4rem 0 .6rem; }
.tier-tabs { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: .4rem; }
.tier-tab { display: grid; gap: .1rem; min-height: 52px; padding: .4rem .3rem; border: 2px solid var(--line); border-radius: 12px; background: #fff; font-weight: 800; color: var(--navy); text-align: center; }
.tier-tab small { font-weight: 700; color: #5b6b82; }
.tier-tab.on { border-color: var(--navy); background: var(--navy); color: #fff; }
.tier-tab.on small { color: #d6e0f0; }
.tier-tools { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .9rem; }
.tier-tools select { min-height: 40px; }
.eb-comm { display: block; color: #17803d; font-weight: 700; font-size: .78rem; overflow-wrap: anywhere; }
.eb-dock { padding-bottom: max(.4rem, env(safe-area-inset-bottom)); }
.eb { padding-bottom: 8.5rem; }
.eb-review { min-width: 7.5rem; }
.tier-h { display: flex; justify-content: space-between; align-items: baseline; margin: 1rem 0 .3rem; padding-bottom: .2rem; border-bottom: 2px solid var(--line); font-size: 1.05rem; }
.tier-h span { color: #5b6b82; }
.tier-cards { display: grid; grid-template-columns: 1fr; gap: .8rem; margin: .6rem 0; }
.tier-card { border: 2px solid var(--line); border-radius: 16px; padding: .8rem; background: #fff; min-width: 0; }
.tier-card.picked { border-color: #17803d; box-shadow: 0 0 0 3px rgba(23, 128, 61, .18); }
.tier-name { margin: 0 0 .4rem; font-size: 1.15rem; text-align: center; }
@media (min-width: 720px) { .tier-cards.tier-count-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .tier-cards.tier-count-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* v2.38 dispatch work type + Reschedule on existing jobs */
.work-type, .mat-budget { border: 1px solid #dbe3ef; border-radius: 12px; padding: .7rem .9rem; margin: .4rem 0; min-width: 0; }
.work-type legend, .mat-budget legend { font-weight: 800; padding: 0 .35rem; }
.work-pick { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.work-pick .radio-pill { position: relative; }
.wt-test { margin-top: .5rem; }
.wt-test[hidden] { display: none; }
.job-resched { margin-top: .6rem; }
.job-resched > summary { display: inline-flex; align-items: center; gap: .4rem; min-height: 46px; padding: .4rem 1.1rem; list-style: none; cursor: pointer; border: 1px solid var(--line); border-radius: 999px; background: #fff; font-weight: 700; }
.job-resched > summary::-webkit-details-marker { display: none; }

/* v2.38 Report an issue */
.issue-fab { position: fixed; left: .6rem; bottom: calc(var(--tabbar-h) + env(safe-area-inset-bottom, 0px) + .5rem); z-index: 38; display: inline-flex; align-items: center; gap: .35rem; min-height: 36px; padding: .2rem .7rem; border: 1px solid var(--line); border-radius: 999px; background: rgba(255,255,255,.94); color: #43506a; font: inherit; font-size: .78rem; font-weight: 700; box-shadow: 0 2px 8px rgba(15,35,70,.12); cursor: pointer; }
.issue-fab svg { width: 16px; height: 16px; }
.issue-fab.is-away { display: none; }
.issue-q { font-size: .7rem; background: #b45309; color: #fff; border-radius: 999px; padding: .05rem .4rem; }
.issue-sheet .sheet-card { max-height: 90vh; overflow: auto; }
.issue-form label.issue-label { display: block; margin: .6rem 0; font-weight: 700; }
.issue-form textarea { width: 100%; box-sizing: border-box; }
.issue-form .window-pick { margin-top: .5rem; }
.issue-done-msg { font-weight: 800; font-size: 1.05rem; }
body.issue-open { overflow: hidden; }
@media (min-width: 900px) { .issue-fab { left: auto; right: 1rem; } }

/* ============================================================
   DEVICE PRESENTATION ARCHITECTURE — v2.40.0
   Three intentional experiences, not just responsive widths.

   Phone  (<768 px)   : body.dev-phone   — Companion Mode
   Tablet (768-1099)  : body.dev-tablet  — Field Workstation (PRIMARY)
   Desktop (≥1100+fine): body.dev-desktop — Full Operations Center

   These CSS custom properties are layered on top of the base
   :root tokens. They do NOT replace any existing styles — they
   extend the token vocabulary so new device-specific rules can
   reference them cleanly.

   Actual layout changes (side rails, split panes, command center,
   workflow rail, etc.) are in device-tablet.css and applied here
   via the body class. This file only defines tokens + the
   structural hooks that the layout sheets need.
   ============================================================ */

/* — Shared device-layer tokens (defaults = phone, overridden below) — */
:root {
  --dt-sidebar-w: 0px;          /* width of persistent side rail (tablet/desktop) */
  --dt-rail-w: 0px;             /* width of workflow rail */
  --dt-header-h: 52px;          /* sticky top bar height */
  --dt-tap-min: 44px;           /* minimum tap target — mandatory everywhere */
  --dt-content-pad: .875rem;    /* horizontal page gutter */
  --dt-card-radius: var(--radius-sm);
  --dt-font-ui: .875rem;        /* standard UI label size */
  --dt-font-meta: .75rem;       /* small meta / secondary text */
  --dt-panel-gap: .75rem;       /* gap between stacked panels */
  --dt-split-left: 1fr;         /* left column in a split pane */
  --dt-split-right: 0fr;        /* right column — 0 = no split (phone/portrait tablet) */
}

/* — Phone overrides — */
body.dev-phone {
  --dt-content-pad: .75rem;
  --dt-header-h: 52px;
  --dt-panel-gap: .625rem;
}

/* — Tablet overrides —
   Three ways the tablet class can be active:
   1. html.dev-tablet-pre  — pre-paint head script (fires before CSS renders)
   2. body.dev-tablet      — app.js applyMode() (authoritative runtime)
   3. @media (min-width:768px) width-based fallback — activates regardless of
      device detection, so an iPad-sized viewport ALWAYS gets tablet layout
      even if JS hasn't run yet or device detection fails entirely.           */
html.dev-tablet-pre body,
body.dev-tablet {
  --dt-sidebar-w: 220px;
  --dt-header-h: 56px;
  --dt-content-pad: 1.125rem;
  --dt-card-radius: var(--radius);
  --dt-panel-gap: 1rem;
  --dt-font-ui: .9375rem;
  --dt-font-meta: .8125rem;
}

/* Width-based fallback: viewport ≥ 768px gets tablet tokens by default.
   body.dev-phone overrides this back for phone-sized-but-wide views (rare).
   body.dev-desktop also overrides below.
   This ensures an iPad always gets tablet CSS even if JS device detection
   fails or hasn't run yet — viewport width is truth for layout purposes. */
@media (min-width: 768px) {
  body:not(.dev-phone):not(.dev-desktop) {
    --dt-sidebar-w: 220px;
    --dt-header-h: 56px;
    --dt-content-pad: 1.125rem;
    --dt-card-radius: var(--radius);
    --dt-panel-gap: 1rem;
    --dt-font-ui: .9375rem;
    --dt-font-meta: .8125rem;
  }
}

/* — Desktop overrides — */
html.dev-desktop-pre body,
body.dev-desktop {
  --dt-sidebar-w: 240px;
  --dt-header-h: 56px;
  --dt-content-pad: 1.5rem;
  --dt-card-radius: var(--radius);
  --dt-panel-gap: 1.125rem;
  --dt-font-ui: .9375rem;
  --dt-font-meta: .8125rem;
}

/* ── Universal touch-target floor ─────────────────────────────
   Every interactive element must hit 44 × 44 px. Applied via
   padding / min-height rather than size overrides so layout
   is unaffected. Button-shaped elements are handled in component
   styles; inline-text buttons need explicit min height.        */
body.dev-phone button, body.dev-tablet button,
body.dev-phone [role="button"], body.dev-tablet [role="button"],
body.dev-phone input[type="submit"], body.dev-tablet input[type="submit"],
body.dev-phone a.btn, body.dev-tablet a.btn,
body.dev-phone .btn, body.dev-tablet .btn {
  min-height: var(--dt-tap-min);
}

/* ── Horizontal overflow guard ─────────────────────────────────
   No full-width overflow-x:hidden on body (which would silently
   clip real content/controls). Instead, constrain known overflow
   sources at their own level.

   html gets a soft clip only — it never clips at all because
   html/body share a scroll container. The actual fix is:
   - Flex/grid rows that can exceed viewport are limited with
     min-width:0 on their children (standard flex shrink fix)
   - The .sidenav + .wrap layout is bounded by the sidebar width
   - Tables and wide elements get overflow-x:auto so they scroll
     in their own box, not the page
   The rule below prevents the VIEWPORT from scrolling while
   still allowing inner elements to scroll normally.            */
html { overflow-x: clip; }   /* modern browsers: clips without creating a new BFC */
body { max-width: 100%; }

/* ── Wrap container respects sidebar ──────────────────────────
   When a sidebar rail is present (tablet/desktop) the main
   content shifts right. The sidebar itself is rendered by
   the tablet layout sheet; .wrap just needs margin-inline-start.
   Zero on phone since no sidebar exists.                       */
/* Legacy device offsets do not apply to the unified bt-shell frame. */
body.dev-tablet:not(.bt-shell) .wrap,
body.dev-desktop:not(.bt-shell) .wrap {
  margin-inline-start: var(--dt-sidebar-w);
}

/* ── Device visibility helpers ────────────────────────────────
   .phone-only   : shown only on phone
   .tablet-only  : shown only on tablet
   .desktop-only : shown only on desktop
   .touch-only   : shown on phone + tablet (touch devices)
   .no-phone     : hidden on phone
   .no-desktop   : hidden on desktop                           */
.phone-only   { display: none !important; }
.tablet-only  { display: none !important; }
.desktop-only { display: none !important; }
.no-phone     {}   /* visible by default */
.no-desktop   {}
.touch-only   { display: none !important; }

body.dev-phone   .phone-only   { display: revert !important; }
body.dev-phone   .no-phone     { display: none !important; }
body.dev-phone   .tablet-only  { display: none !important; }
body.dev-phone   .desktop-only { display: none !important; }

body.dev-tablet  .tablet-only  { display: revert !important; }
body.dev-tablet  .touch-only   { display: revert !important; }
body.dev-tablet  .phone-only   { display: none !important; }
body.dev-tablet  .desktop-only { display: none !important; }

body.dev-desktop .desktop-only { display: revert !important; }
body.dev-desktop .no-desktop   { display: none !important; }
body.dev-desktop .phone-only   { display: none !important; }
body.dev-desktop .tablet-only  { display: none !important; }

body.dev-phone   .touch-only,
body.dev-tablet  .touch-only   { display: revert !important; }

/* ── Landscape vs portrait helpers (tablet only) ──────────────
   Used by split-pane layouts that only activate in landscape.  */
@media (orientation: landscape) {
  body.dev-tablet { --dt-split-left: 1.4fr; --dt-split-right: 1fr; }
}
@media (orientation: portrait) {
  body.dev-tablet { --dt-split-left: 1fr; --dt-split-right: 0fr; }
}

/* v2.41.7: persistent, explicit secondary-page return path. */
.page-return{display:flex;align-items:center;gap:12px;margin:8px 0 16px;min-height:44px}
.page-return a{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:9px 16px;background:#fff;border:1px solid #cbd5e1;border-radius:12px;color:#132b4c;font-weight:700;text-decoration:none}
.commission-admin-entry .btn{margin-top:12px}

/* v2.42.0: guided payroll actions; readable touch targets without horizontal navigation. */
.commission-flow-nav{display:flex;flex-wrap:wrap;gap:8px;overflow:visible!important;white-space:normal!important}
.commission-flow-nav a{min-height:44px;display:inline-flex;align-items:center;justify-content:center;white-space:normal;flex:1 1 120px;text-align:center}
.commission-guidance{border-left:4px solid #235b98}
.commission-guidance .btn{min-height:44px;display:inline-flex;align-items:center}
.page-return a{min-height:44px}
@media(max-width:600px){.commission-flow-nav a{flex:1 1 30%;font-size:.9rem}}

/* v2.42.2: technician flow affordances; no changes to job state or business logic. */
.job-quick-next {display:grid;gap:.35rem;margin:.75rem 0 1rem}
.job-quick-next .btn {min-height:48px;justify-content:center}
.job-quick-next .muted {text-align:center}
#next {scroll-margin-top:1.5rem}
.myday-next-action strong {font-weight:750}
@media(max-width:700px){.myday-cj-actions .btn,.myday-cj-actions .btn-ghost {min-height:44px}}

/* Guided job actions: make anchored next step visible above mobile fixed navigation. */
#next { scroll-margin-top: 1.5rem; }
.job-quick-next .btn { white-space: normal; text-align: center; line-height: 1.35; }
.job-quick-next .muted { overflow-wrap: anywhere; }
.ns-panel .ns-primary { min-height: 52px; white-space: normal; }
@media (max-width: 640px) {
  .job-quick-next { margin: .65rem 0 .85rem; }
  .ns-panel { scroll-margin-bottom: 6rem; }
}

/* v2.42.6: completed-job closeout guidance */
.closeout-guide{display:grid;gap:1rem;padding-left:1.5rem;margin:1rem 0}.closeout-guide li{padding:.4rem 0}.closeout-guide li p{margin:.3rem 0 .65rem}.closeout-guide a{min-height:44px;display:inline-flex;align-items:center;justify-content:center;max-width:100%}@media(max-width:640px){.closeout-guide a{width:100%}}

/* v2.44.5 desktop command center: workspace shortcuts and board search. */
.ops-command-nav{display:none}
@media (min-width:1100px) and (hover:hover) and (pointer:fine){
  .ops-command-nav{display:flex;grid-column:1/-1;align-items:center;gap:.5rem;flex-wrap:wrap;background:#fff;border:1px solid var(--line);border-radius:12px;padding:.65rem .8rem;box-shadow:0 2px 8px rgba(20,43,73,.04)}
  .ops-command-label{font-size:.7rem;font-weight:800;letter-spacing:.11em;color:#667b93;margin-right:.3rem}
  .ops-command-nav a{display:inline-flex;align-items:center;gap:.4rem;min-height:42px;padding:.55rem .8rem;color:#193b63;text-decoration:none;border:1px solid #e0e8f1;border-radius:8px;font-weight:650;font-size:.88rem;background:#f8fafd}
  .ops-command-nav a:hover,.ops-command-nav a:focus-visible{background:#eaf2ff;border-color:#95b9ed;outline-offset:2px}
  .ops-command-nav svg{width:17px;height:17px}
  .ops-board-search{display:flex;align-items:center;gap:.7rem;padding:.7rem 1rem;background:#f8fafd;border-bottom:1px solid #e0e8f1}
  .ops-board-search label{font-size:.83rem;font-weight:700;color:#44566e;white-space:nowrap}
  .ops-board-search input{min-width:0;max-width:340px;flex:1;min-height:42px;border:1px solid #c9d6e5;border-radius:8px;padding:.5rem .7rem;background:#fff;color:#172d48}
  #ops-filter-count{font-size:.8rem;color:#536780}
  .ops-board>li[hidden]{display:none!important}
}
@media (min-width:1100px) and (hover:hover) and (pointer:fine){
  body.has-ops:not(.ops-mine) .ops-home{grid-template-rows:auto auto min-content 1fr}
  .ops-home .ops-main{grid-row:3}
  .ops-home .ops-rail{grid-row:3 / span 2}
  .ops-home .ops-lower{grid-row:4}
}

/* v2.45.2 — field closeout: make the existing authorized next action obvious. */
.job-ready-closeout { border:2px solid #1e3a5f; background:linear-gradient(180deg,#eff6ff 0%,#fff 100%); }
.job-ready-closeout .ns-tag {font-weight:800;color:#174a9b;letter-spacing:.02em}
.job-ready-closeout .ns-main .btn {min-height:60px;font-size:1.08rem;font-weight:800;box-shadow:0 4px 14px rgba(37,99,235,.18)}
.job-closeout-explainer {margin:.25rem 0 .5rem;line-height:1.5;color:#28415f}
@media (max-width:850px) {.job-ready-closeout {position:relative;scroll-margin-top:1rem}.job-ready-closeout .ns-main .btn{min-height:64px}}

/* v2.45.3 — field closeout guidance; no change to workflow logic */
.field-closeout{border:1px solid #cbdcf4;background:linear-gradient(180deg,#f5f9ff,#fff 45%)}
.field-closeout-eyebrow{display:block;color:#2459a2;font-size:.75rem;font-weight:800;letter-spacing:.065em;margin-bottom:.35rem}
.field-closeout .closeout-guide{list-style:none;counter-reset:closeout;padding:0;gap:.7rem}
.field-closeout .closeout-guide li{padding:1rem 1.1rem;background:#fff;border:1px solid #dce5f1;border-radius:12px;min-width:0}
.field-closeout .closeout-guide li strong{display:block;font-size:1rem;color:#1e3a5f}
.field-closeout .closeout-guide li a{min-height:48px}
.field-closeout-back{display:inline-flex;align-items:center;min-height:48px;font-weight:700;margin-top:.5rem}
@media(min-width:960px){.field-closeout .closeout-guide{grid-template-columns:repeat(3,minmax(0,1fr))}.field-closeout .closeout-guide li{display:flex;flex-direction:column}.field-closeout .closeout-guide li a{margin-top:auto}}

/* Today: acknowledgement and compact attention controls. */
.hm-attn-item[hidden], #hm-action-body[hidden], #hm-action-note[hidden] { display:none !important; }
.hm-attn .hm-sec-h { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.hm-collapse-btn,.hm-ack-btn { background:transparent; border:1px solid var(--line); border-radius:8px; padding:8px 10px; color:var(--blue); font:inherit; font-size:.82rem; cursor:pointer; min-height:40px; }
.hm-ack-btn { flex:none; }
.hm-action-note { font-size:.8rem; color:#43506a; margin:.5rem 0 0; }
.hm-action-note .hm-ack-btn { margin-left:8px; }
@media(max-width:480px) { .hm-attn-item { flex-wrap:wrap; } .hm-attn-item .hm-ack-btn { margin-left:auto; } }

/* Per-alert minimize: retain title and severity; hide description and action only. */
.hm-alert-controls { display:flex; gap:6px; flex-wrap:wrap; }
.hm-alert-action { display:flex; }
.hm-attn-item.hm-alert-minimized .hm-alert-detail,
.hm-attn-item.hm-alert-minimized .hm-alert-action { display:none !important; }
@media(max-width:600px) {
  .hm-attn-item { flex-wrap:wrap; }
  .hm-alert-controls { margin-left:auto; }
  .hm-alert-action { width:100%; justify-content:flex-start; }
}

/* Workflow Round 2: explicit outcome routing without changing job records. */
.job-outcome-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:.65rem}
.job-outcome-options>a{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;white-space:normal;text-align:left;min-height:70px;padding:.85rem 1rem;gap:.3rem}
.job-outcome-options>a small{font-size:.8rem;line-height:1.4;font-weight:400;opacity:.85}
@media(max-width:600px){.job-outcome-options{grid-template-columns:minmax(0,1fr)}.job-outcome-options>a{min-height:64px}}

/* Technician job page R1: progressive orientation, no business-logic changes. */
.job-stage-nav{padding:1rem;scroll-margin-top:5rem}
.job-stage-nav-title{display:flex;justify-content:space-between;align-items:center;gap:.75rem;flex-wrap:wrap}
.job-stage-subtitle{margin:.35rem 0 .8rem}
.job-stage-links{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.45rem}
.job-stage-links a{display:flex;align-items:center;gap:.4rem;min-height:44px;padding:.55rem .65rem;border:1px solid var(--border,#d3dbe2);border-radius:.6rem;text-decoration:none;font-weight:600;white-space:normal;overflow-wrap:anywhere}
.job-stage-links a span{display:inline-grid;place-items:center;flex:none;width:1.5rem;height:1.5rem;border-radius:50%;background:var(--surface-2,#e9eef4);font-size:.8rem}
.job-stage-more{margin-top:.7rem}.job-stage-more summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-weight:600}
.job-stage-extra{display:flex;gap:.5rem;flex-wrap:wrap}.job-stage-extra a{padding:.6rem;min-height:44px;display:inline-flex;align-items:center}
.job-stage-links a:focus-visible,.job-stage-more summary:focus-visible,.job-stage-extra a:focus-visible{outline:3px solid #3175bb;outline-offset:2px}
@media(max-width:700px){.job-stage-links{grid-template-columns:repeat(2,minmax(0,1fr))}.job-stage-links a:first-child{grid-column:1/-1}.job-stage-nav{padding:.8rem}}
@media(max-width:360px){.job-stage-links{grid-template-columns:minmax(0,1fr)}.job-stage-links a:first-child{grid-column:auto}}

/* Job Page Redesign R1/U3: one prominent stage and compact, accessible readiness. */
.job-stage-current{display:flex;flex-direction:column;gap:.3rem;padding:.85rem 1rem;margin:.65rem 0 .35rem;border:1px solid #bfd8ea;border-left:5px solid #1e5aa8;border-radius:12px;background:#f2f8fc;overflow-wrap:anywhere}
.job-stage-current-kicker{font-size:.7rem;font-weight:800;letter-spacing:.08em;color:#245a79}
.job-stage-current strong{font-size:1.1rem;line-height:1.35;color:#143f59}
.job-readiness-details{display:block}
.job-readiness-summary{display:flex;align-items:center;justify-content:space-between;gap:1rem;cursor:pointer;min-height:44px;list-style-position:inside}
.job-readiness-summary>span:first-child{display:flex;flex-direction:column;gap:.2rem;min-width:0}
.job-readiness-expand{font-size:.85rem;font-weight:700;white-space:nowrap}
.job-readiness-details[open]>.job-readiness-summary{margin-bottom:.75rem}
.job-readiness-summary:focus-visible{outline:3px solid #1e5aa8;outline-offset:4px;border-radius:5px}
@media(max-width:600px){.job-stage-current{padding:.75rem}.job-readiness-summary{gap:.5rem}}

/* Job Page Redesign R1/U4: preserve content, reduce initial vertical clutter. */
.job-compact-fold{margin:0 0 .8rem;border:1px solid var(--line,var(--line));border-radius:12px;background:var(--surface,#fff);overflow:visible}
.job-compact-fold>summary{cursor:pointer;min-height:48px;padding:12px 16px;font-weight:700;display:flex;justify-content:space-between;align-items:center;gap:12px}
.job-compact-fold>summary:focus-visible{outline:3px solid #1e5aa8;outline-offset:2px}
.job-compact-fold>summary .small{font-weight:400;text-align:right}
.job-compact-fold>.panel{margin:0;border:0;border-top:1px solid var(--line,var(--line));border-radius:0}
.job-progress-fold>.wf-rail{margin:8px 12px 14px}
@media(max-width:540px){.job-compact-fold>summary{flex-wrap:wrap}.job-progress-fold>.wf-rail{display:flex;flex-wrap:wrap}}
@media print{.job-compact-fold>.panel,.job-compact-fold>.wf-rail{display:block}}

/* R2 U1 — primary recommended action visually leads the job workflow. */
.job-quick-next { border: 2px solid var(--navy); border-left-width: 5px; padding: 1rem; display: grid; gap: .7rem; scroll-margin-top: 5rem; }
.job-quick-next .ns-head { gap: .3rem; }
.job-quick-next .ns-here { font-size: 1.12rem; font-weight: 750; line-height: 1.4; }
.job-quick-next .ns-main .ns-primary { min-height: 56px; white-space: normal; overflow-wrap: anywhere; }
.job-quick-next:focus-within { outline: 2px solid var(--navy); outline-offset: 2px; }
@media (max-width: 640px) { .job-quick-next { padding: .85rem; } }

/* R2 U2: state cues use existing next_step() result only. */
.job-quick-next .ns-state-cue {margin:0;font-size:.875rem;font-weight:750;line-height:1.4;color:var(--navy)}

/* R2 U3: visually separate the resolver's recommended action from other options. */
.job-quick-next .job-action-primary-label { margin: .2rem 0 -.25rem; font-size: .8rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--navy); }
.job-quick-next .job-action-secondary { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem .6rem; margin-top: .4rem; padding-top: .75rem; border-top: 1px solid var(--line); font-size: .88rem; }
.job-quick-next .job-action-secondary > span { color: var(--muted, #526070); }
.job-quick-next .job-action-secondary .btn-text { min-height: 44px; display: inline-flex; align-items: center; }
@media (max-width: 600px) { .job-quick-next .job-action-secondary { flex-direction: column; align-items: stretch; } }

/* R2 U4 — visual state differentiation only; authoritative next_step() unchanged. */
.job-quick-next.job-next-state-action {border-left-color:#1e5aa8;background:var(--surface,#fff)}
.job-quick-next.job-next-state-waiting {border-color:#d2dae4;border-left-color:#a16c21;background:#fffbf3}
.job-quick-next.job-next-state-done {border-color:#d1e3d9;border-left-color:#317554;background:#f5fbf7}
.job-quick-next.job-next-state-waiting .ns-state-cue {color:#80530f}
.job-quick-next.job-next-state-done .ns-state-cue {color:#256343}
.job-quick-next.job-next-state-action .ns-state-cue {color:#14557c}
@media (prefers-contrast:more) {
 .job-quick-next.job-next-state-waiting,.job-quick-next.job-next-state-done,.job-quick-next.job-next-state-action {border-left-width:7px}
}

/* R2 U5: responsive, readable primary action and secondary controls. */
.job-quick-next{min-width:0;overflow-wrap:anywhere}
.job-quick-next .ns-head{min-width:0;flex-wrap:wrap}
.job-quick-next .ns-main,.job-quick-next .ns-main form{min-width:0;max-width:100%}
.job-quick-next .ns-main .ns-primary{width:100%;max-width:100%;line-height:1.35;text-align:center}
.job-quick-next .job-action-secondary .btn-text:focus-visible,.job-quick-next .ns-main .ns-primary:focus-visible{outline:3px solid #1e5aa8;outline-offset:3px}
@media(max-width:600px){.job-quick-next .ns-main .ns-primary{min-height:52px;padding:.8rem 1rem}.job-quick-next .job-action-secondary .btn-text{align-items:center;justify-content:center;text-align:center}}
@media(prefers-reduced-motion:reduce){.job-quick-next *{scroll-behavior:auto}}

/* Technician Job Page Redesign R3 U1 — presentation-only arrival shortcuts. */
.job-arrival-essentials { padding: 1rem 1.15rem; }
.job-arrival-heading { display:flex; align-items:baseline; flex-wrap:wrap; gap:.4rem .75rem; }
.job-arrival-actions { display:flex; flex-wrap:wrap; gap:.55rem; margin:.75rem 0 .4rem; }
.job-arrival-actions a { min-height:44px; display:inline-flex; align-items:center; justify-content:center; text-align:center; }
.job-arrival-essentials > p:last-child { margin-bottom:0; }
@media(max-width:600px) { .job-arrival-actions { flex-direction:column; } .job-arrival-actions a { width:100%; min-height:48px; } }

/* R3 U2: accessible arrival shortcuts and focused diagnosis note entry. */
.job-arrival-actions { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); align-items:stretch; }
.job-arrival-actions a { white-space:normal; line-height:1.35; padding:.7rem .85rem; }
#notes, #add-field-note { scroll-margin-top:110px; }
.job-diagnosis-note-form textarea { min-height:96px; width:100%; }
.job-diagnosis-note-form :is(textarea,button):focus-visible, .job-arrival-actions a:focus-visible { outline:3px solid #1e5aa8; outline-offset:3px; }
@media(max-width:600px){ .job-arrival-actions { grid-template-columns:1fr; } .job-diagnosis-note-form button { min-height:48px; } }

/* R3 U3: compact arrival context links to the existing source sections. */
.job-arrival-context { display:flex; flex-wrap:wrap; gap:.45rem .8rem; margin:.7rem 0 .25rem; }
.job-arrival-context a { display:inline-flex; align-items:center; min-height:44px; font-size:.9rem; font-weight:650; text-decoration:underline; text-underline-offset:3px; }
.job-arrival-context a:focus-visible { outline:3px solid #1e5aa8; outline-offset:3px; border-radius:3px; }
#job-approved-scope, #job-instructions, #job-property-access, #notes { scroll-margin-top:5rem; }
@media(max-width:600px) { .job-arrival-context { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.25rem .6rem; } .job-arrival-context a { min-height:48px; } }

/* R3 U4: compact arrival hierarchy; no change to links or form behavior. */
.job-arrival-essentials { padding: .8rem 1rem; }
.job-arrival-heading { align-items:center; gap:.25rem .65rem; }
.job-arrival-heading strong { font-size:1rem; }
.job-arrival-heading .muted { font-size:.8rem; }
.job-arrival-context { margin:.35rem 0 .4rem; gap:.2rem .75rem; }
.job-arrival-context a { min-height:44px; }
.job-arrival-actions { margin:.3rem 0 0; gap:.4rem; grid-template-columns:repeat(3,minmax(0,1fr)); }
.job-arrival-actions a { min-width:0; min-height:46px; padding:.5rem .6rem; }
@media (max-width:700px) {
  .job-arrival-actions { grid-template-columns:1fr; }
  .job-arrival-actions a { min-height:48px; }
  .job-arrival-context { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* R3 U5: final arrival/diagnosis responsive polish, presentation only. */
.job-arrival-essentials { min-width:0; }
.job-arrival-context a, .job-arrival-actions a { overflow-wrap:anywhere; min-width:0; }
.job-arrival-context a:focus-visible, .job-arrival-actions a:focus-visible { outline-offset:2px; }
.job-arrival-actions a { min-height:48px; }
@media (min-width:421px) and (max-width:700px) {
  .job-arrival-actions { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .job-arrival-actions a:last-child:nth-child(odd) { grid-column:1/-1; }
}
@media (max-width:420px) {
  .job-arrival-actions { grid-template-columns:minmax(0,1fr); }
  .job-arrival-context { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .job-arrival-heading { align-items:flex-start; }
}
@media (prefers-reduced-motion:reduce) {
  .job-arrival-essentials *, .job-diagnosis-note-form * { scroll-behavior:auto; transition:none; }
}

/* Technician Job Page Redesign R4 U1: presentation-only estimate decision hierarchy. */
.job-outcome-guide .job-outcome-group-label{font-size:.8rem;font-weight:750;letter-spacing:.025em;margin:.8rem 0 .4rem;color:var(--navy,#16324d)}
.job-outcome-guide .job-outcome-other-options{border-top:1px solid var(--border,#dce4eb);padding-top:.7rem}
.job-outcome-guide .job-outcome-options>a:focus-visible{outline:3px solid #1e5aa8;outline-offset:3px}
@media(max-width:600px){.job-outcome-guide .job-outcome-options>a{min-height:48px;overflow-wrap:anywhere}.job-outcome-guide .job-outcome-group-label{margin-top:.7rem}}

/* R4 U2: customer-decision shortcuts remain links to existing handlers. */
.job-outcome-guide .job-outcome-estimate-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:.6rem}
.job-outcome-guide .job-outcome-estimate-options>a{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:.3rem;min-width:0;min-height:88px;padding:.85rem 1rem;text-align:left;white-space:normal}
.job-outcome-guide .job-outcome-estimate-options>a strong{font-size:1rem;line-height:1.3}
.job-outcome-guide .job-outcome-estimate-options>a small{display:block;line-height:1.45;overflow-wrap:anywhere}
.job-outcome-guide .job-outcome-other-options>a{white-space:normal;overflow-wrap:anywhere}
@media(max-width:600px){.job-outcome-guide .job-outcome-estimate-options{grid-template-columns:minmax(0,1fr)}.job-outcome-guide .job-outcome-estimate-options>a{min-height:76px}}
@media(prefers-reduced-motion:reduce){.job-outcome-guide *{transition:none}}

/* R4 U3: visible latest-estimate status and return-to-workflow navigation; no status mutations. */
.job-estimate-status-strip{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .7rem;padding:.7rem .8rem;border:1px solid var(--border,#dce4eb);border-radius:10px;min-width:0}
.job-estimate-status-label{font-size:.83rem;font-weight:650;color:var(--muted,#52657a)}
.job-estimate-status-strip strong,.job-estimate-status-strip .badge{overflow-wrap:anywhere}
.job-estimate-review-link{margin-left:auto;text-underline-offset:3px;font-weight:650;min-height:44px;display:inline-flex;align-items:center}
.job-estimate-status-hint{margin:.4rem 0 .8rem}
.job-outcome-return{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.4rem .8rem;margin-top:.75rem}
.job-outcome-return p{margin:0;flex:1 1 250px}
.job-outcome-return a{min-height:48px;white-space:normal;overflow-wrap:anywhere}
.job-estimate-status-strip a:focus-visible,.job-outcome-return a:focus-visible{outline:3px solid #1e5aa8;outline-offset:3px}
@media(max-width:600px){.job-estimate-review-link{margin-left:0}.job-estimate-status-strip{gap:.35rem .55rem}.job-outcome-return a{width:100%;text-align:center;justify-content:center}}

/* R4 U4: informational homeowner handoff, no new status or submission controls. */
.job-customer-handoff{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem .8rem;margin:.7rem 0;padding:.65rem .8rem;border:1px solid var(--border,#dce4eb);border-radius:10px;font-size:.86rem;line-height:1.45}
.job-customer-handoff strong{flex:0 0 100%}
.job-customer-handoff span{flex:1 1 165px;min-width:0;overflow-wrap:anywhere}
.job-outcome-return strong{font-weight:700}
@media(max-width:600px){.job-customer-handoff{gap:.4rem}.job-customer-handoff span{flex-basis:100%}}

/* R4 U5: final estimate/customer-decision mobile layout audit; CSS only. */
.job-outcome-guide{min-width:0;overflow-wrap:break-word}
.job-outcome-guide .panel-head,.job-outcome-guide .panel-head>div{min-width:0}
.job-outcome-guide .job-outcome-options>a{box-sizing:border-box;min-width:0;max-width:100%;overflow-wrap:anywhere}
.job-outcome-guide .job-outcome-estimate-options{min-width:0}
.job-outcome-guide .job-estimate-status-strip>*{min-width:0}
.job-outcome-guide .job-estimate-status-strip .badge{max-width:100%;white-space:normal}
.job-outcome-guide .job-customer-handoff span{line-height:1.5}
.job-outcome-guide .job-outcome-return{min-width:0}
.job-outcome-guide .job-outcome-return a{box-sizing:border-box;max-width:100%;min-height:48px}
#job-outcome,#job-estimates,#job-primary-action{scroll-margin-top:5rem}
@media (min-width:601px) and (max-width:900px){
 .job-outcome-guide .job-outcome-estimate-options{grid-template-columns:repeat(2,minmax(0,1fr))}
 .job-outcome-guide .job-outcome-estimate-options>a:last-child:nth-child(odd){grid-column:1/-1}
}
@media (max-width:600px){
 .job-outcome-guide .job-outcome-estimate-options{grid-template-columns:minmax(0,1fr)}
 .job-outcome-guide .job-outcome-other-options{display:grid;grid-template-columns:minmax(0,1fr);gap:.5rem}
 .job-outcome-guide .job-outcome-other-options>a{box-sizing:border-box;min-height:48px;width:100%}
 .job-outcome-guide .job-estimate-review-link{min-height:48px}
 .job-outcome-guide .job-outcome-return a{width:100%}
}

/* Job redesign R5/U1 — presentation-only completion orientation */
.job-completion-orientation{padding:.75rem 1rem;margin:.65rem 0;border:1px solid var(--border,var(--line));border-radius:12px;background:var(--surface,#fff)}
.job-completion-orientation p{margin:.35rem 0 0}
.job-closeout-jumps{display:flex;flex-wrap:wrap;gap:.55rem;margin:.65rem 0 1rem}
.job-closeout-jumps a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:.6rem .8rem;border:1px solid var(--border,var(--line));border-radius:10px;text-align:center;overflow-wrap:anywhere}
.job-closeout-jumps a:focus-visible{outline:3px solid currentColor;outline-offset:3px}
@media(max-width:640px){.job-closeout-jumps{display:grid;grid-template-columns:1fr}.job-closeout-jumps a{min-height:48px}}

/* R5/U2: read-only closeout billing overview; no invoice/payment handler changes. */
.job-billing-snapshot{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem;margin:.85rem 0}
.job-billing-snapshot>div{min-width:0;padding:.75rem;border:1px solid var(--border,#d9e1e8);border-radius:.7rem;background:var(--surface,#fff)}
.job-billing-label{display:block;font-size:.78rem;opacity:.8;margin-bottom:.25rem}
.job-billing-snapshot strong{display:block;overflow-wrap:anywhere;line-height:1.3}
.job-billing-explain,.job-invoice-state{overflow-wrap:anywhere}
@media(max-width:700px){.job-billing-snapshot{grid-template-columns:repeat(2,minmax(0,1fr))}.job-billing-snapshot>div:last-child{grid-column:1/-1}}
@media(max-width:420px){.job-billing-snapshot{grid-template-columns:1fr}.job-billing-snapshot>div:last-child{grid-column:auto}}

/* Job redesign R5/U3: completed-job paperwork navigation, display only. */
.job-closeout-index{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem}
.job-closeout-index a{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-width:0;min-height:64px;gap:.2rem;padding:.7rem .85rem;text-align:left;text-decoration:none;overflow-wrap:anywhere}
.job-closeout-index-label{font-weight:700;line-height:1.3}
.job-closeout-index small{font-size:.8rem;line-height:1.35;opacity:.85}
#closeout,#invoice,#payment,#materials-budget{scroll-margin-top:5rem}
@media(max-width:850px){.job-closeout-index{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.job-closeout-index{grid-template-columns:minmax(0,1fr)}.job-closeout-index a{min-height:56px}}

/* Round 5 / Update 4: read-only closeout attention, using existing validation. */
.field-closeout .job-closeout-attention{margin:1rem 0;padding:1rem;border:1px solid var(--border,var(--line));border-radius:12px;min-width:0}
.field-closeout .job-closeout-attention h3{margin:0 0 .5rem;font-size:1.05rem}
.field-closeout .job-closeout-attention p{overflow-wrap:anywhere}
.field-closeout .job-closeout-attention a{display:inline-flex;align-items:center;min-height:44px;max-width:100%;white-space:normal;overflow-wrap:anywhere}
@media(max-width:600px){.field-closeout .job-closeout-attention{padding:.85rem}.field-closeout .job-closeout-attention a{display:flex;width:100%;justify-content:center;min-height:48px}}

/* R5/U5: final responsive closeout audit — CSS-only, no action or status changes. */
.field-closeout,.field-closeout .job-billing-snapshot,.field-closeout .job-closeout-index,.field-closeout .job-closeout-attention{min-width:0;max-width:100%}
.field-closeout .job-billing-snapshot>div,.field-closeout .job-closeout-index>a{box-sizing:border-box;min-width:0;overflow-wrap:anywhere}
.field-closeout .job-closeout-index a:focus-visible,.field-closeout .job-closeout-attention a:focus-visible{outline:3px solid currentColor;outline-offset:3px}
.field-closeout .job-closeout-attention .job-readiness-issues{padding-inline-start:1.4rem;overflow-wrap:anywhere}
.field-closeout .job-closeout-attention .job-readiness-issues li{margin-block:.35rem;line-height:1.45}
@media (min-width:601px) and (max-width:850px){.field-closeout .job-closeout-index>a:last-child:nth-child(odd){grid-column:1/-1}}
@media(max-width:600px){.field-closeout .job-closeout-index{gap:.5rem}.field-closeout .job-closeout-index a{min-height:56px}.field-closeout .job-closeout-attention a{box-sizing:border-box}.field-closeout .job-billing-snapshot{gap:.5rem}}
@media(max-width:380px){.field-closeout .job-billing-snapshot{grid-template-columns:minmax(0,1fr)}.field-closeout .job-billing-snapshot>div:last-child{grid-column:auto}}
@media(prefers-reduced-motion:reduce){.field-closeout .job-closeout-index a{transition:none}}

/* Technician Job Redesign R6/U1: commission readiness guidance; no workflow changes. */
.job-commission-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:.5rem 1rem}
.job-commission-head h3{margin:0}
.job-commission-readiness-link{font-weight:650;text-underline-offset:3px;overflow-wrap:anywhere}
.job-commission-help{max-width:75ch;margin:.65rem 0 1rem}
#job-readiness{scroll-margin-top:6rem}
@media(max-width:640px){.job-commission-head{align-items:stretch;flex-direction:column}.job-commission-readiness-link{display:inline-flex;align-items:center;min-height:44px}.job-closeout-attention .btn,.job-closeout-attention .btn-ghost{max-width:100%;white-space:normal;overflow-wrap:anywhere}}
@media(prefers-reduced-motion:reduce){#job-readiness{scroll-behavior:auto}}

/* R6/U3: commission readiness navigation; no workflow or validation changes. */
.job-commission-next-links{display:flex;flex-wrap:wrap;align-items:stretch;gap:.65rem;margin-top:.75rem}
.job-commission-next-links>a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;max-width:100%;white-space:normal;overflow-wrap:anywhere;text-align:center}
@media(max-width:650px){.job-commission-next-links{flex-direction:column}.job-commission-next-links>a{width:100%;min-height:48px}}

/* R6 U4: commission status and office feedback visibility; no behavior changes. */
.job-commission-statusline{margin:.65rem 0;padding:.7rem .85rem;border:1px solid var(--border,#d7e0ea);border-radius:.65rem;overflow-wrap:anywhere;line-height:1.45}
.job-closeout-attention .job-correction-note{overflow-wrap:anywhere;white-space:normal}
@media(max-width:600px){.job-commission-statusline{padding:.75rem}.job-closeout-attention .btn,.job-closeout-attention .btn-ghost{min-height:48px;white-space:normal}}

/* Technician Job Redesign R6/U5: final responsive commission closeout polish.
   Presentation only; existing status, permissions and validation remain authoritative. */
.field-closeout .job-closeout-attention,.field-closeout .job-commission-statusline,.field-closeout .job-correction-note,.field-closeout .job-commission-next-links{box-sizing:border-box;min-width:0;max-width:100%;overflow-wrap:anywhere}
.field-closeout .job-commission-head{align-items:flex-start}
.field-closeout .job-commission-head h3{min-width:0;flex:1 1 16rem;line-height:1.35}
.field-closeout .job-commission-readiness-link{flex:0 1 auto;max-width:100%;white-space:normal}
.field-closeout .job-commission-next-links>a{box-sizing:border-box;min-width:0}
.field-closeout .job-correction-note{padding:.65rem .8rem;border-inline-start:3px solid currentColor;line-height:1.5}
.field-closeout .closeout-guide,.field-closeout .job-readiness-issues{max-width:100%;overflow-wrap:anywhere}
.field-closeout .closeout-guide li{min-width:0}
.field-closeout .job-closeout-attention a:focus-visible,.field-closeout .job-commission-readiness-link:focus-visible{outline:3px solid currentColor;outline-offset:3px}
@media(max-width:650px){.field-closeout .job-commission-head{display:flex;flex-direction:column;gap:.5rem}.field-closeout .job-commission-head h3{flex:auto}.field-closeout .job-commission-readiness-link{display:inline-flex;min-height:48px;align-items:center}.field-closeout .job-commission-next-links>a{width:100%;min-height:48px}.field-closeout .job-closeout-attention{padding:.8rem}.field-closeout .job-commission-statusline{margin:.6rem 0}}
@media(prefers-reduced-motion:reduce){.field-closeout .job-commission-next-links>a{transition:none}}

/* Technician job redesign R7/U1: compact secondary navigation; existing tools remain authoritative. */
.job-secondary-tools .job-stage-extra{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;margin-top:.65rem}
.job-secondary-tools .job-stage-extra a{display:flex;align-items:center;min-height:44px;min-width:0;padding:.55rem .7rem;overflow-wrap:anywhere;white-space:normal}
.job-secondary-tools .job-stage-extra a[hidden]{display:none!important}
.job-secondary-tools .job-secondary-hint{margin:.6rem 0 0;line-height:1.45}
.job-secondary-tools a:focus-visible,.job-secondary-tools summary:focus-visible{outline:3px solid currentColor;outline-offset:3px}
@media(max-width:900px){.job-secondary-tools .job-stage-extra{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:540px){.job-secondary-tools .job-stage-extra{grid-template-columns:1fr}.job-secondary-tools .job-stage-extra a{min-height:48px}}

/* R7 U2: secondary tools and hash destinations on compact devices */
.job-stage-more>summary,.job-compact-fold>summary,.job-secondary-fold>summary{min-height:48px;overflow-wrap:anywhere;cursor:pointer}
.job-stage-extra a{min-height:44px;overflow-wrap:anywhere}
#job-photos,#job-forms,#job-property-access,#notes,#payment,#materials-budget,#job-primary-action{scroll-margin-top:5.5rem}
@media(max-width:640px){.job-stage-extra{grid-template-columns:minmax(0,1fr)}.job-stage-more,.job-compact-fold,.job-secondary-fold{max-width:100%}}
@media(prefers-reduced-motion:reduce){.job-stage-extra a{transition:none}}

/* R7 U3: accessible return navigation from optional job sections. */
.job-secondary-return{display:flex;justify-content:flex-end;padding:0 14px 14px}
.job-secondary-return-link{display:inline-flex;align-items:center;justify-content:center;min-height:44px;max-width:100%;overflow-wrap:anywhere;text-align:center}
.job-photos-return{margin:12px 0 0 12px}
.job-secondary-return-link:focus-visible{outline:3px solid currentColor;outline-offset:3px}
#job-primary-action{scroll-margin-top:84px}
@media(max-width:600px){.job-secondary-return{padding:0 12px 12px}.job-secondary-return-link{width:100%;min-height:48px}.job-photos-return{display:flex;margin:12px 0 0}}
@media(prefers-reduced-motion:reduce){#job-primary-action{scroll-behavior:auto}}

/* R7/U4: mobile navigation, focus and anchor positioning only. */
.job-secondary-tools>summary,.job-secondary-fold>summary,.job-compact-fold>summary{box-sizing:border-box;line-height:1.5;touch-action:manipulation}
.job-secondary-tools>summary:focus-visible,.job-secondary-fold>summary:focus-visible,.job-compact-fold>summary:focus-visible,.job-secondary-return-link:focus-visible{outline:3px solid currentColor;outline-offset:3px}
.job-secondary-tools,.job-secondary-fold,.job-compact-fold{min-width:0;max-width:100%}
.job-secondary-tools .job-stage-extra a,.job-secondary-return-link{box-sizing:border-box;overflow-wrap:anywhere}
#job-primary-action,#job-photos,#job-forms,#job-property-access,#notes,#payment,#materials-budget,#callback-corrections,#sched-history{scroll-margin-top:6rem}
@media(max-width:640px){.job-secondary-tools>summary,.job-secondary-fold>summary,.job-compact-fold>summary{min-height:48px;padding-block:.7rem}.job-secondary-return-link{min-height:48px}.job-secondary-tools .job-stage-extra{grid-template-columns:minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){.job-secondary-tools *, .job-secondary-fold *, .job-compact-fold *{scroll-behavior:auto}}

/* Technician job redesign R7/U5: final secondary navigation and anchor consistency. */
.job-secondary-tools .job-stage-extra a:focus-visible,.job-secondary-return-link:focus-visible,.job-compact-fold>summary:focus-visible,.job-secondary-fold>summary:focus-visible{outline:3px solid currentColor;outline-offset:2px}
.job-secondary-tools .job-stage-extra a,.job-secondary-return-link{touch-action:manipulation;max-width:100%}
.job-secondary-fold>.panel,.job-compact-fold>.panel{min-width:0;overflow-wrap:anywhere}
#job-photos,#job-forms,#job-property-access,#notes,#payment,#materials-budget,#job-primary-action,#callback-corrections,#sched-history{scroll-margin-top:6rem}
@media(max-width:640px){.job-secondary-fold>summary,.job-compact-fold>summary{min-height:48px}.job-secondary-tools .job-stage-extra{grid-template-columns:minmax(0,1fr)}.job-secondary-tools .job-stage-extra a{min-height:48px}}
@media(prefers-reduced-motion:reduce){html:has(.job-secondary-tools){scroll-behavior:auto}}

/* Customer estimate proposal — Phase 2; presentation-only, no approval behavior changes. */
.present-customer{max-width:790px;padding:16px 0 30px}
.present-customer .customer-proposal{padding:0;overflow:hidden;border:1px solid #d9e3ee;box-shadow:0 16px 46px rgba(16,39,71,.10);border-radius:24px}
.present-customer .present-head{background:#102747;color:#fff;border:0;margin:0;padding:26px 30px;gap:16px}
.present-customer .present-head img{width:66px;height:66px;object-fit:contain;background:#fff;border-radius:16px;padding:5px}
.present-customer .present-brand{color:#fff;letter-spacing:.055em;font-size:1.25rem}
.present-customer .present-head .muted{color:#d7e5f4}
.proposal-eyebrow{display:block;color:#d7e5f4;font-size:.8rem;letter-spacing:.03em;margin-top:3px}
.proposal-intro{padding:28px 30px 12px}
.proposal-intro h1{font-size:clamp(1.65rem,4.5vw,2.35rem);line-height:1.15;color:#102747;margin:8px 0}
.proposal-intro p{color:#536579;margin:0;line-height:1.6;max-width:60ch}
.proposal-kicker{font-size:.76rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#1c6a83}
.present-customer .present-meta{margin:16px 30px 22px;padding:18px 20px;border:1px solid #e1e9f2;background:#f6f9fc;border-radius:15px}
.present-customer .present-title,.present-customer .tier-lead,.present-customer .present-lines,.present-customer .present-total,.present-customer .present-h,.present-customer .present-warranty,.present-customer .note,.present-customer .customer-proposal>.muted,.present-customer .customer-proposal>.present-choice,.present-customer .customer-proposal>.present-decline,.present-customer .customer-proposal>.sign-area,.present-customer .customer-proposal>.signed,.present-customer .customer-proposal>.flash,.present-customer .customer-proposal>.tier-cards{margin-left:30px;margin-right:30px}
.present-customer .present-lines li{padding:18px 0;border-bottom:1px solid #e4ebf3}
.present-customer .line-name{color:#122c4c;font-weight:750}
.present-customer .line-desc{color:#536579;line-height:1.55}
.present-customer .present-total{background:#eff5fa;padding:20px;border-radius:15px;margin-top:16px;margin-bottom:22px;align-items:center}
.present-customer .present-total strong{font-size:clamp(1.7rem,5vw,2.35rem)}
.present-customer .present-choice{margin:20px 30px 28px;padding-top:14px;border-top:1px solid #e1e9f2}
.present-customer .btn-approve{background:#167c42;border-color:#167c42;box-shadow:0 6px 18px rgba(22,124,66,.16)}
.present-customer .btn-approve:focus-visible,.present-customer button:focus-visible{outline:3px solid #347ed4;outline-offset:3px}
.proposal-assurance{margin:0 30px 22px;color:#52667a;font-size:.86rem;line-height:1.5}
.present-customer .customer-proposal>.small,.present-customer .customer-proposal>p.muted{margin-left:30px;margin-right:30px}
.present-customer .customer-proposal{padding-bottom:24px}
@media(max-width:600px){.present-customer{padding:0 0 20px}.present-customer .customer-proposal{border-radius:16px}.present-customer .present-head{padding:22px 18px}.proposal-intro{padding:24px 18px 10px}.present-customer .present-meta{margin:14px 18px 20px;padding:14px;gap:12px}.present-customer .present-title,.present-customer .tier-lead,.present-customer .present-lines,.present-customer .present-total,.present-customer .present-h,.present-customer .present-warranty,.present-customer .note,.present-customer .customer-proposal>.muted,.present-customer .customer-proposal>.present-choice,.present-customer .customer-proposal>.present-decline,.present-customer .customer-proposal>.sign-area,.present-customer .customer-proposal>.signed,.present-customer .customer-proposal>.flash,.present-customer .customer-proposal>.tier-cards{margin-left:18px;margin-right:18px}.present-customer .present-choice{margin:18px 18px 24px}.proposal-assurance{margin:0 18px 20px}.present-customer .present-head img{width:56px;height:56px}}
@media print{.present-customer .customer-proposal{box-shadow:none;border:0}.present-customer .present-head{-webkit-print-color-adjust:exact;print-color-adjust:exact}}

/* Customer handoff: consistent customer-first presentation on shared links and staff iPads. */
.present-customer .btn-huge,.present-customer .btn-big{min-height:48px;touch-action:manipulation}
.present-customer input:not([type=hidden]),.present-customer textarea{font-size:max(16px,1rem)}
.present-customer .sign-area canvas{max-width:100%;touch-action:none}
@media(max-width:600px){.present-customer .btn-row{flex-wrap:wrap}.present-customer .btn-row>.btn,.present-customer .btn-row>.btn-ghost{max-width:100%}.present-customer .present-card{overflow-wrap:anywhere}}

/* Customer handoff: touch-sized controls. */
.present-customer .btn-ghost{min-height:44px;display:inline-flex;align-items:center}

/* Customer handoff: accessible iPad and phone controls. */
.present-customer .btn-text,.present .sig-head .btn-text,.present-tools a,.present-tools button{min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center}
.present .sig-pad:focus-visible,.present .btn-text:focus-visible,.present-customer a:focus-visible{outline:3px solid #1e5aa8;outline-offset:3px}
@media (max-width:600px){.present .sig-pad{height:220px}.present-tools>*{flex:1 1 100%;text-align:center}}

/* Technician closeout: prominent, permission-derived completion milestone. */
.job-finish-callout { border: 2px solid #1d6d49; border-left: 7px solid #1d6d49; background: #f0faf4; padding: 1rem; display: grid; gap: .65rem; }
.job-finish-heading h2 { margin: .1rem 0 0; font-size: 1.3rem; color: #164d36; }
.job-finish-step { color: #1b6648; font-weight: 800; font-size: .78rem; text-transform: uppercase; letter-spacing: .055em; }
.job-finish-callout p { margin: 0; max-width: 65ch; }
.job-finish-button { min-height: 62px; font-size: 1.15rem; font-weight: 800; width: 100%; }
.job-finish-callout form { margin: 0; }

/* Technician completed-visit status: distinguish closeout from payment collection. */
.job-closeout-state{border-left:5px solid var(--navy);display:grid;gap:.65rem;scroll-margin-top:5rem}
.job-closeout-state-eyebrow{font-size:.78rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;margin:0}
.job-closeout-state h2{margin:0;line-height:1.25}
.job-closeout-state .btn{min-height:52px;white-space:normal;text-align:center}

/* Completed visit: field-friendly paperwork checklist */
.job-closeout-guide{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--border,#d8dfe6)}
.job-closeout-guide h3{margin:0 0 .4rem;font-size:1.05rem}
.job-closeout-guide-list{list-style:none;padding:0;margin:.75rem 0 0;display:grid;gap:.65rem}
.job-closeout-guide-list li a{display:flex;flex-direction:column;justify-content:center;gap:.2rem;min-height:56px;padding:.85rem 1rem;border:1px solid var(--border,#d8dfe6);border-radius:12px;text-decoration:none;background:var(--card,#fff);color:inherit}
.job-closeout-guide-list li a span{font-size:.87rem;opacity:.8}
.job-closeout-guide-list li a:focus-visible{outline:3px solid #2366bd;outline-offset:2px}

/* Estimate lists: reserve a single, non-overlapping price column on narrow screens. */
.people .person { min-width: 0; }
.people .person-meta { flex: 0 0 auto; max-width: 42%; min-width: 0; }
.people .person-meta small { white-space: nowrap; font-variant-numeric: tabular-nums; }
.lines .line-top { align-items: flex-start; min-width: 0; }
.lines .line-name { min-width: 0; flex: 1 1 auto; overflow-wrap: anywhere; }
.lines .line-total { flex: 0 0 auto; text-align: right; font-variant-numeric: tabular-nums; }
@media (max-width: 430px) {
  .people .person { gap: .5rem; }
  .people .person-meta { max-width: 38%; }
  .lines .line-top { gap: .5rem; }
}
/* Item 28: the technician's single next action stays visible while scrolling. */
.job-quick-next{position:sticky;top:0;z-index:18;box-shadow:0 4px 16px rgba(0,0,0,.09)}
.job-progress-upcoming{opacity:.5}.job-progress-done{opacity:.75}
@media(max-width:600px){.job-quick-next .ns-main .btn{min-height:48px}}

/* R4 A1: desktop-only keyboard guidance and 390px week-card wrapping. */
@media (max-width: 899px), (hover: none), (pointer: coarse) {
  #od-shortcuts-hint.od-shortcut-hint { display: none !important; }
}
@media (max-width: 390px) {
  .wk, .wk-grid, .wk-day, .wk-job { min-width: 0; max-width: 100%; }
  .wk-day h3 { flex-wrap: wrap; gap: .25rem; }
  .wk-job, .wk-job strong, .wk-job small { overflow-wrap: anywhere; }
}


/* R4 A2: customer decision screen and explicit decline follow-up consent. */
.present-customer .present-result-brand {
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  background:#122d4f;color:#fff;padding:16px 22px
}
.present-customer .present-result-brand img{background:#fff;border-radius:12px;padding:5px;flex-shrink:0}
.present-customer .present-result-brand div{display:grid;gap:2px;min-width:0}
.present-customer .present-result-brand strong{font-size:1.15rem}
.present-customer .present-result-brand span{color:#d6e5f5;font-size:.86rem}
.present-customer .present-result-brand a{margin-left:auto;color:#fff;border:1px solid #afc8e0;border-radius:9px;padding:12px 14px;min-height:48px;text-decoration:none;font-weight:700}
.present-customer .present-card.thanks{padding:clamp(20px,4vw,35px)}
.present-customer .present-card.thanks h1{font-size:clamp(1.7rem,6vw,2.4rem)}
.present-customer .present-followup-offer{background:#f0f6fb;border:1px solid #cedfea;border-radius:16px;padding:22px;margin:20px auto;max-width:580px}
.present-customer .present-followup-offer h2{font-size:1.2rem}
.present-customer .present-followup-offer .btn{min-height:52px;min-width:0;width:100%}
.present-customer .present-followup-skip{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px;margin-top:10px}
.present-customer .present-followup-done{padding:15px;border-radius:10px;background:#eaf6ed;color:#155c35;font-weight:750}
.present-customer .tier-card{padding:16px;border-radius:16px;display:flex;flex-direction:column;min-width:0}
.present-customer .tier-name{font-size:1.25rem;color:#102747;overflow-wrap:anywhere}
.present-customer .present-tier-includes{font-size:.82rem;color:#52677c;font-weight:750;margin:8px 0}
.present-customer .tier-card .present-lines{margin:0 0 10px;flex:1}
.present-customer .tier-card .present-total{margin:10px 0 16px;padding:14px;display:grid;gap:4px}
.present-customer .tier-card .present-total strong{font-size:clamp(1.6rem,6vw,2.25rem)}
.present-customer .tier-pick{min-height:52px;width:100%}
.present-customer .tier-pick[aria-pressed="true"]{background:#175b35;border-color:#175b35}
@media(max-width:390px){
 .present-customer .present-result-brand{padding:12px}
 .present-customer .present-result-brand a{margin-left:0;width:100%;justify-content:center;display:flex}
 .present-customer .present-followup-offer{padding:15px;margin:16px auto}
 .present-customer .tier-card{padding:12px}
}

/* R4 A3 — keyboard accessible global search and full-screen phone search. */
.od-global-search{position:relative;flex:1 1 260px;max-width:450px;min-width:0;margin-left:12px;z-index:30;color:#172c42}
.od-global-search-entry{display:flex;gap:8px;align-items:center;min-width:0;width:100%}
.od-global-search #od-global-query{flex:1 1 0;width:100%;min-width:0;min-height:48px;box-sizing:border-box;border-radius:10px;border:1px solid #b7c8dd;background:#fff;color:#12233f;padding:10px 13px;font-size:16px}
.od-global-search .od-global-close{min-height:48px;min-width:48px;border:1px solid #c3d0df;border-radius:10px;background:#eff4fb;color:#193e63;padding:10px;font-weight:750;cursor:pointer}
.od-global-search .od-global-close[hidden]{display:none!important}
.od-global-search #od-global-results{position:absolute;top:calc(100% + 5px);left:0;right:0;z-index:100;background:#fff;border:1px solid #c6d5e6;border-radius:13px;box-shadow:0 14px 34px #0003;max-height:60vh;overflow-y:auto;overscroll-behavior:contain}
.od-global-search #od-global-results[hidden]{display:none!important}
.od-global-hit{border-bottom:1px solid #e4ebf3}
.od-global-hit:last-child{border-bottom:0}
.od-global-hit a,.od-global-hit button{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center;width:100%;min-height:48px;padding:11px 15px;text-decoration:none;color:#163455;background:#fff;border:0;font:inherit;font-size:15px;cursor:pointer;text-align:left;overflow-wrap:anywhere}
.od-global-hit[aria-selected="true"] a,.od-global-hit[aria-selected="true"] button,.od-global-hit:hover a,.od-global-hit:hover button{background:#e9f2ff}
.od-search-kind{font-size:12px;font-weight:850;text-transform:uppercase;letter-spacing:.04em;color:#206d9f;flex:0 0 96px;min-width:max-content;white-space:nowrap;overflow-wrap:normal;word-break:normal}
.od-search-title{flex:1 1 170px;min-width:0;overflow-wrap:anywhere}
.od-global-empty{padding:18px;margin:0;color:#566b80;overflow-wrap:anywhere}
@media(max-width:600px){
 .top-inner{flex-wrap:wrap}
 .od-global-search{flex:0 0 100%;max-width:100%;width:100%;margin:6px 0 0;min-width:0}
 .od-global-search.is-open{position:fixed!important;inset:0!important;z-index:3000!important;width:100vw!important;height:100dvh!important;max-width:none!important;max-height:none!important;padding:calc(14px + env(safe-area-inset-top,0px)) 14px calc(12px + env(safe-area-inset-bottom,0px));margin:0!important;background:#f2f6fa;display:flex;flex-direction:column;gap:12px}
 .od-global-search.is-open .od-global-search-entry{flex-shrink:0}
 .od-global-search.is-open #od-global-results{display:block;position:static;top:auto;left:auto;right:auto;max-height:none!important;flex:1 1 auto;min-height:0;overflow-y:auto;box-shadow:none;border-radius:12px}
 body.od-search-open{overflow:hidden!important}
}

/* R4 A4: saved-state checklist; fast closeout replaces rather than duplicates primary action. */
.job-fast-checks{padding:14px 16px;margin:14px 0;border:1px solid #ccdae7;border-radius:14px;background:#f7fbff}
.job-fast-checks>strong{display:block;margin-bottom:4px;color:#17375a}
.job-fast-checks .muted{margin:4px 0 10px}
.job-fast-check{display:flex;align-items:center;gap:10px;min-width:0;min-height:40px;padding:5px 0;color:#243b55;font-size:.92rem}
.job-fast-check input{flex:0 0 auto;min-width:20px;min-height:20px;accent-color:#16784a;opacity:1!important}
.job-fast-check.done{color:#165b3a}
.job-fast-check.missing{color:#a34a1c}
.job-fast-check span{min-width:0;overflow-wrap:anywhere}
.job-fast-closeout-form{margin:14px 0 8px}
.job-fast-closeout-form button{min-height:54px}
@media(max-width:390px){
 .job-fast-checks{padding:11px;margin:12px 0}
 .job-fast-check{align-items:flex-start;gap:9px}
 .job-fast-closeout-form{min-width:0}
 .job-fast-closeout-form button{width:100%;white-space:normal;overflow-wrap:anywhere}
}

/* R4 A5 digest details: readable, thumb-accessible, no sideways scrolling. */
.notification-digest-details{margin:10px 0 14px;border:1px solid #bfcde0;background:#fff;border-radius:12px;padding:10px 12px;max-width:100%;min-width:0}
.notification-digest-details>summary{font-weight:750;cursor:pointer;min-height:48px;display:flex;align-items:center;color:#1f4e84;overflow-wrap:anywhere}
.notification-digest-items{list-style:none;padding:0;margin:6px 0 0;min-width:0}
.notification-digest-items li{padding:10px 0;border-top:1px solid #dfe6f1;display:grid;gap:3px;min-width:0}
.notification-digest-items button{min-height:48px;display:inline-flex;align-items:center;text-align:left;padding:6px 0;width:100%;overflow-wrap:anywhere;white-space:normal}
.notification-digest-items small{color:#586d82}
@media(max-width:390px){.notification-digest-details{padding:8px}.notification-digest-details>summary{font-size:.93rem}}

/* P5 – preserve category-first grid; clarify Add/Remove and keep touch targets large. */
.eb-row{grid-template-columns:minmax(0,1fr) minmax(5.5rem,max-content) 70px;position:relative}
.eb-add{width:70px;height:48px;display:flex;align-items:center;justify-content:center;gap:4px;box-sizing:border-box}
.eb-add-word{font-size:.77rem;font-weight:750}
.eb-picked{grid-column:1/-1;justify-self:start;padding:2px 8px;border-radius:99px;font-size:.75rem;font-weight:750;background:#e6f6ef;color:#175b45}
.eb-selected .eb-add{background:#225f75}
.eb-line .eb-x{min-width:60px;min-height:48px;width:auto;padding:8px;font-size:.83rem;white-space:normal}
.eb-review{min-height:56px;display:inline-flex;align-items:center;justify-content:center;white-space:normal}
@media(max-width:390px){.eb-row{grid-template-columns:minmax(0,1fr) minmax(4.5rem,max-content) 66px}.eb-price{min-width:4.5rem}.eb-add{width:66px}.eb-line .eb-x{min-width:56px}}

/* P6: small optional, accessible help adjacent to the authoritative Next Action. */
.ns-context-help{margin:.5rem 0 1rem;max-width:100%;min-width:0}
.ns-context-help>summary{cursor:pointer;display:flex;align-items:center;min-height:48px;font-weight:700;color:var(--navy);padding:.5rem .7rem;border:1px solid var(--line,#d6dce5);border-radius:10px}
.ns-context-help>p{line-height:1.5;margin:.65rem 0;overflow-wrap:anywhere}
.ns-context-help .ns-office-call{min-height:48px;display:inline-flex;align-items:center}

/* P8: derived My Day queue; no pay or commission detail on employee cards. */
.myday-queue-counts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem;margin:.75rem 0}
.myday-queue-counts a{display:flex;align-items:center;justify-content:space-between;gap:.3rem;padding:.75rem;min-height:48px;border:1px solid #d5dfeb;border-radius:11px;font-weight:650;font-size:.83rem;box-sizing:border-box;overflow-wrap:anywhere}
.myday-queue-counts strong{font-size:1rem;flex-shrink:0}
.myday-evening-check{border-left:4px solid #b45309;padding:.8rem 1rem;background:#fff6e4;border-radius:8px}
.myday-checkout-card{display:grid;gap:.5rem;margin:.75rem 0;padding:.9rem;border:1px solid #d3e1ed;border-radius:11px;min-width:0}
.myday-checkout-card .btn{min-height:56px}
.myday-checkout-card .myday-more-options{margin-top:0}
@media(max-width:390px){.myday-queue-counts{grid-template-columns:minmax(0,1fr)}.myday-checkout-card{padding:.75rem}}

/* Suggestions occupy their own row instead of covering form actions. */
[data-address-ac]>.addr-suggest {max-height:200px;overflow:auto;overscroll-behavior:contain}

/* Phase 1 — #24: Technician quick-action 3x2 red grid on phone */
.od-tech-quick .hm-tools { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .55rem; }
.od-tech-quick .hm-tool { min-height: 80px; background: var(--red); border-color: var(--red); color: #fff; border-radius: 14px; font-size: .76rem; }
.od-tech-quick .hm-tool .tool-ic { background: rgba(255,255,255,.18); color: #fff; width: 36px; height: 36px; border-radius: 10px; }
.od-tech-quick .hm-tool:hover, .od-tech-quick .hm-tool:focus-visible { background: #c42b32; border-color: #c42b32; outline-offset: 3px; }
.od-tech-quick .hm-tool-edit { background: #fff; border-color: var(--line); color: var(--ink); }
.od-tech-quick .hm-tool-edit .tool-ic { background: #f0f3f8; color: var(--navy); }

/* Public forms retain their existing submit and validation paths. */
.public-booking-form{display:grid;gap:1rem}
.public-booking-form>label>input,.public-booking-form>label>select,.public-booking-form>label>textarea{display:block;box-sizing:border-box;width:100%;min-height:48px;font-size:16px}
.auth a{display:inline-flex;align-items:center;min-height:44px;min-width:44px}
html.bt-confirm-open{overflow:hidden}

/* v3.69.1 — Bold Navy Brand Bar: only shared header and tenant sidebar branding. */
body.bt-shell:not(.present-mode) .top.bt-universal-header {
  background:linear-gradient(180deg,#1a3a66,#0b1d38);
  border-bottom:4px solid #e0353d;
  box-sizing:border-box;
}
.top.bt-universal-header .top-inner {
  min-height:76px;
  box-sizing:border-box;
  padding-top:8px;
  padding-bottom:8px;
}
body.bt-shell:not(.present-mode) .top.bt-universal-header .brand.od-product-brand {gap:11px;min-width:0;order:3;margin:0}
.top.bt-universal-header .brand-logo {
  width:56px;height:56px;flex:0 0 56px;
  border-radius:0;background:transparent;
}
.top.bt-universal-header .brand-logo img {
  display:block;width:56px;height:56px;max-width:none;object-fit:contain;
  border-radius:12px;
}
.top.bt-universal-header .brand-name {
  display:flex;flex-direction:column;align-items:flex-start;justify-content:center;
  gap:2px;min-width:0;overflow:visible;text-overflow:clip;white-space:nowrap;
  font-family:'Oswald','Arial Narrow',sans-serif;
}
.top.bt-universal-header .brand-name strong {
  color:#fff;font-size:21px;line-height:1.08;font-weight:800;letter-spacing:.03em;
}
.top.bt-universal-header .brand-name small {
  display:block;color:#ff5a60;font-size:13px;line-height:1.2;
  font-weight:750;letter-spacing:2.2px;
}
.sidenav-brand.p1-sidebar-brand {
  background:linear-gradient(180deg,#1a3a66,#0b1d38);
  border-bottom:4px solid #e0353d;
  display:flex;align-items:center;gap:10px;
  min-width:0;box-sizing:border-box;text-decoration:none;
}
.sidenav-brand.p1-sidebar-brand .bt-side-logo {
  width:40px;height:40px;flex:0 0 40px;object-fit:contain;
}
.sidenav-brand.p1-sidebar-brand .bt-side-lockup {
  display:flex;flex-direction:column;align-items:flex-start;min-width:0;gap:1px;
}
.sidenav-brand.p1-sidebar-brand .bt-side-name {
  color:#fff;font:800 19px/1.08 'Oswald','Arial Narrow',sans-serif;
}
.sidenav-brand.p1-sidebar-brand .bt-side-plumbing {
  color:#ff5a60;font:750 11px/1.2 'Oswald','Arial Narrow',sans-serif;letter-spacing:1.9px;
}
.sidenav-brand.p1-sidebar-brand .bt-side-lockup small {
  display:block;color:#c1d1e9;font-size:10px;line-height:1.25;
}
@media(max-width:480px) {
  .top.bt-universal-header .top-inner {min-height:64px;padding-top:6px;padding-bottom:6px;gap:6px}
  .top.bt-universal-header .brand.od-product-brand {gap:6px}
  .top.bt-universal-header .brand-logo {width:44px;height:44px;flex-basis:44px}
  .top.bt-universal-header .brand-logo img {width:44px;height:44px;border-radius:10px}
  .top.bt-universal-header .brand-name strong {font-size:16px}
  .top.bt-universal-header .brand-name small {font-size:10.5px;letter-spacing:1.5px}
}
@media(min-width:1024px) and (orientation:landscape) {
  html:not(.bt-sidebar-open) body.bt-shell:not(.present-mode) .sidenav-brand.p1-sidebar-brand {
    justify-content:center;gap:0;
  }
  html:not(.bt-sidebar-open) body.bt-shell:not(.present-mode) .p1-sidebar-brand .bt-side-lockup {display:none!important}
}

/* v3.69.3: shell brand bar baseline; other stylesheet overrides reconciled in place. */
body.bt-shell:not(.present-mode) .top.bt-universal-header .bt-menu-toggle{order:1}
body.bt-shell:not(.present-mode) .top.bt-universal-header .bt-back{order:2}
body.bt-shell:not(.present-mode) .top.bt-universal-header .bt-top-notifications{order:4;color:#fff}
body.bt-shell:not(.present-mode) .top.bt-universal-header .bt-header-search{order:5}
body.bt-shell:not(.present-mode) .top.bt-universal-header .acct-cluster{order:6;margin-left:auto}
body.bt-shell:not(.present-mode) .top.bt-universal-header .brand-name strong{color:#fff}
body.bt-shell:not(.present-mode) .top.bt-universal-header .brand-name small{color:#ff5a60}

/* v3.69.6: common controls, text and accessible components; brand bar remains untouched. */
body,body input,body select,body textarea,body button{font-family:var(--bt-font);color:var(--bt-text)}
body input::placeholder,body textarea::placeholder{color:var(--bt-text-secondary);opacity:1}
body .muted,body .form-help,body .help-text{color:var(--bt-text-secondary)}
body .btn,body .btn-ghost,body .btn-danger{font-family:var(--bt-font);font-weight:600;border-radius:var(--bt-radius-sm);min-height:38px}
body .btn{background:var(--bt-blue);color:#fff}
body .btn-ghost{background:#fff;border:1px solid var(--bt-line);color:var(--bt-text)}
body .btn-danger{background:var(--bt-red);color:#fff}
body .panel{border-color:var(--bt-line);border-radius:var(--bt-radius)}
body th{color:var(--bt-text);font-weight:700}
body .flash-info{border-color:var(--bt-blue-100);background:var(--bt-blue-50);color:var(--bt-text)}
body .flash-error{background:var(--bt-red-50);color:var(--bt-red)}
body .flash-success{background:var(--bt-ok-50);color:var(--bt-ok)}
.cc-crew-summary-row{display:flex;align-items:center;justify-content:space-between;padding:9px 12px;border-bottom:1px solid var(--bt-line-2);gap:12px}

/* SHELL 3.69.7 — unified sidebar + brand bar across device modes. */
body.bt-shell .sidenav-brand.p1-sidebar-brand{height:56px!important;min-height:0!important;max-height:56px!important;padding:8px 12px!important;display:flex!important;flex-direction:row!important;justify-content:flex-start!important;align-items:center!important;gap:9px!important;background:transparent;border-bottom:1px solid rgba(255,255,255,.1)!important;white-space:nowrap}
body.bt-shell .sidenav-brand.p1-sidebar-brand .bt-side-logo{width:32px;height:32px;flex:0 0 32px}
body.bt-shell .sidenav-brand.p1-sidebar-brand .bt-side-lockup{display:flex;min-width:0;flex-direction:row;align-items:center}
body.bt-shell .sidenav-brand.p1-sidebar-brand .bt-side-name{font:700 13px/1.25 var(--bt-font);color:#fff;white-space:nowrap;letter-spacing:-.2px}
body.bt-shell .bt-side-user{display:flex;align-items:center;gap:7px;padding:8px 12px;min-height:40px;box-sizing:border-box;color:var(--bt-text-on-dark-secondary);font-size:12px}
body.bt-shell .bt-side-avatar{height:25px;width:25px;flex:0 0 25px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.15);color:#fff;font-weight:700;font-size:10px}
body.bt-shell .bt-side-first{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.bt-shell .bt-side-role{margin-left:auto;border:1px solid rgba(255,255,255,.2);border-radius:10px;padding:2px 6px;font-size:10px;color:var(--bt-text-on-dark-secondary)}
body.bt-shell .bt-side-stats{padding:4px 12px 10px;display:flex;gap:8px;flex-wrap:wrap;font-size:11px;color:var(--bt-text-on-dark-secondary)}
body.bt-shell .sidenav .r02-finder-link{height:34px;min-height:34px;display:flex;align-items:center;gap:8px;margin:4px 12px 9px;padding:0 10px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:var(--bt-radius-sm);color:var(--bt-text-on-dark-secondary);font-size:12px;box-sizing:border-box;text-decoration:none}
body.bt-shell .sidenav .sidenav-link{padding:12px 16px!important;min-height:50px;font-size:15px;box-sizing:border-box;color:var(--bt-text-on-dark-secondary)!important}
body.bt-shell .sidenav .sidenav-link.on{background:var(--bt-blue)!important;color:#fff!important;box-shadow:none}
body.bt-shell .sidenav .sidenav-link .ic{width:18px;height:18px;opacity:.85;color:inherit}
body.bt-shell .sidenav .sidenav-link:hover .ic,body.bt-shell .sidenav .sidenav-link.on .ic{opacity:1}
body.bt-shell .sidenav .snav-badge,body.bt-shell .sidenav .p1-nav-badge{background:var(--bt-red)!important;color:#fff!important;min-width:20px;height:20px;box-sizing:border-box;border-radius:10px;font-size:11px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;padding:0 5px}
body.bt-shell .sidenav .p1-connection-card{color:var(--bt-text-on-dark-secondary)}
body.bt-shell .sidenav .p1-connection-card :is(p,small){color:var(--bt-text-on-dark-secondary)}
body.bt-shell .sidenav .p1-connection-card a{color:var(--bt-blue-100)!important}
body.bt-shell .sidenav .od-powered{font-size:11px;color:rgba(255,255,255,.4)!important}
body.bt-shell:not(.present-mode) .top.bt-universal-header .top-inner{min-height:60px!important;height:60px;box-sizing:border-box;flex-wrap:nowrap;align-items:center;padding-top:0!important;padding-bottom:0!important;gap:4px}
body.bt-shell:not(.present-mode) .top.bt-universal-header :is(.bt-menu-toggle,.bt-back,.bt-top-notifications,.bt-header-search>summary,.acct-more){width:44px!important;min-width:44px!important;height:44px!important;min-height:44px!important;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;padding:0!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;color:rgba(255,255,255,.9)!important;opacity:1}
body.bt-shell:not(.present-mode) .top.bt-universal-header :is(.bt-menu-toggle,.bt-back,.bt-top-notifications,.bt-header-search>summary,.acct-more) .ic{width:20px;height:20px;color:inherit;opacity:.9}
body.bt-shell:not(.present-mode) .top.bt-universal-header :is(.bt-menu-toggle,.bt-back,.bt-top-notifications,.bt-header-search>summary,.acct-more):hover .ic{opacity:1}
body.bt-shell:not(.present-mode) .top.bt-universal-header .bt-back{background:none!important}
@media(max-width:767px){body.bt-shell:not(.present-mode) .top.bt-universal-header .top-inner{height:58px!important;min-height:58px!important;padding-left:5px;padding-right:5px;gap:0!important}body.bt-shell:not(.present-mode) .top.bt-universal-header .brand.od-product-brand{gap:4px!important;min-width:0;flex:0 1 auto}body.bt-shell:not(.present-mode) .top.bt-universal-header .brand-logo,body.bt-shell:not(.present-mode) .top.bt-universal-header .brand-logo img{width:34px;height:34px;flex-basis:34px}body.bt-shell:not(.present-mode) .top.bt-universal-header .brand-name strong{font-size:13px!important}body.bt-shell:not(.present-mode) .top.bt-universal-header .brand-name small{font-size:9px!important;letter-spacing:1px}body.bt-shell:not(.present-mode) .top.bt-universal-header .acct-cluster{margin-left:auto}}
@media(min-width:1024px) and (orientation:landscape){html:not(.bt-sidebar-open) body.bt-shell .sidenav-brand.p1-sidebar-brand .bt-side-lockup,html:not(.bt-sidebar-open) body.bt-shell .bt-side-user :is(.bt-side-first,.bt-side-role),html:not(.bt-sidebar-open) body.bt-shell .bt-side-stats{display:none!important}html:not(.bt-sidebar-open) body.bt-shell .bt-side-user{justify-content:center;padding:8px 2px}}

/* Job page layout release v3.69.8 */
.bt-job-page-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 14px;padding:15px 18px;background:var(--bt-bg-card);border:1px solid var(--bt-line);border-radius:var(--bt-radius)}
.bt-job-page-heading h1{font-size:clamp(1.25rem,3vw,1.75rem);line-height:1.2;margin:2px 0 0;color:var(--bt-ink);overflow-wrap:anywhere}.bt-job-eyebrow{font-size:.8rem;color:var(--bt-text-secondary)}.bt-job-status{font-size:.85rem;white-space:normal}
.bt-compact-progress{border:1px solid var(--bt-line);background:var(--bt-bg-card);border-radius:var(--bt-radius-sm);margin:0 0 12px}.bt-compact-progress>summary{cursor:pointer;display:flex;flex-direction:column;gap:9px;padding:12px 14px;color:var(--bt-ink);font-size:.92rem;list-style:none}.bt-compact-progress>summary::-webkit-details-marker{display:none}.bt-compact-progress>summary:focus-visible{outline:3px solid var(--bt-blue);outline-offset:2px}.bt-progress-segments{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:4px;width:100%}.bt-progress-segments i{height:5px;background:var(--bt-line);border-radius:3px}.bt-progress-segments i.is-done{background:var(--bt-ok)}.bt-progress-segments i.is-current{background:var(--bt-blue)}.bt-expanded-stages{padding:4px 12px 12px;border-top:1px solid var(--bt-line-2)}
.bt-main-instructions{margin:10px 0 14px!important;padding:12px 14px!important}.bt-main-instructions>summary{cursor:pointer;font-weight:700;color:var(--bt-ink)}.bt-main-instructions .pre{overflow-wrap:anywhere;white-space:pre-wrap;margin:.75rem 0 0}
.bt-session-pay-alert{position:relative}.bt-session-pay-alert .pay-alert{padding:.35rem 2.5rem .35rem .65rem}.bt-pay-dismiss{position:absolute;top:5px;right:6px;min-width:34px;min-height:34px;background:transparent;border:0;color:var(--bt-ink);font-size:1.5rem;cursor:pointer}.bt-session-pay-alert[hidden]{display:none!important}
@media(max-width:480px){.bt-job-page-heading{padding:11px 12px}.bt-job-status{max-width:100%}.bt-compact-progress>summary{padding:12px}.bt-expanded-stages{overflow-x:auto}}
/* Compact in-flow unmatched Podium state; no empty desktop activity rail. */
.p1-job-detail-layout.bt-podium-no-aside{grid-template-columns:minmax(0,1fr)}
.p1-activity-unmatched{padding:11px 14px!important;margin:10px 0 14px}
.p1-activity-unmatched-row{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.p1-activity-unmatched-row p{margin:3px 0 0}
.p1-activity-unmatched-row .btn-ghost{white-space:normal}
@media(max-width:480px){.p1-activity-unmatched-row{align-items:stretch;flex-direction:column}.p1-activity-unmatched-row .btn-ghost{width:100%;text-align:center}}

/* SHELL 3.69.9 ZONES (Moose) — header is a 3-column grid: LEFT controls · CENTER brand · RIGHT actions.
   Zone wrappers live in layout.php (.bt-zone-l/.bt-zone-c/.bt-zone-r); no margin or order games. */
html body.bt-shell:not(.present-mode) .top.bt-universal-header .top-inner{display:grid!important;grid-template-columns:1fr auto 1fr;align-items:center;column-gap:6px}
body.bt-shell:not(.present-mode) .top.bt-universal-header .bt-zone{display:flex;align-items:center;gap:4px;min-width:0}
body.bt-shell:not(.present-mode) .top.bt-universal-header .bt-zone-l{justify-self:start}
body.bt-shell:not(.present-mode) .top.bt-universal-header .bt-zone-c{justify-self:center}
body.bt-shell:not(.present-mode) .top.bt-universal-header .bt-zone-r{justify-self:end;justify-content:flex-end}
body.bt-shell:not(.present-mode) .top.bt-universal-header .bt-zone .brand.od-product-brand{position:static;transform:none;margin:0!important}
body.bt-shell:not(.present-mode) .top.bt-universal-header .bt-zone .bt-top-notifications,body.bt-shell:not(.present-mode) .top.bt-universal-header .bt-zone .acct-cluster{margin-left:0!important}
@media(max-width:360px){body.bt-shell:not(.present-mode) .top.bt-universal-header .brand-logo,body.bt-shell:not(.present-mode) .top.bt-universal-header .brand-logo img{width:28px;height:28px;flex-basis:28px}body.bt-shell:not(.present-mode) .top.bt-universal-header .brand-name small{display:none}}
/* User pill: first name + initials must render wherever the sidebar/drawer is open. */
body.bt-shell .bt-side-user .bt-side-first{display:inline-block;color:#fff!important;font-weight:600}
body.bt-shell .bt-side-user .bt-side-role{display:inline-block}
body.bt-shell .bt-side-avatar{color:#fff!important;background:rgba(255,255,255,.22)!important}

/* v3.69.11: job-page section-jump bar directly under the heading (44px touch targets, scrolls on phones). */
body.bt-shell .r1-section-chips{display:flex;gap:8px;flex-wrap:nowrap;overflow-x:auto;padding:10px 2px 4px;scrollbar-width:none}
body.bt-shell .r1-section-chips::-webkit-scrollbar{display:none}
body.bt-shell .r1-section-chips a{flex:none;min-height:44px;display:inline-flex;align-items:center;padding:0 16px;border:1px solid var(--bt-line);border-radius:999px;background:var(--bt-bg-card);color:var(--bt-ink);text-decoration:none;font-weight:600;font-size:14px}
body.bt-shell .r1-section-chips a:active{background:var(--bt-blue-50)}

body, input, select, textarea, button {
  font-family: var(--bt-font);
  color: var(--bt-text);
}
body.bt-shell .sidenav .bt-podium-row{display:flex;align-items:center;gap:9px;padding:10px 16px;color:var(--bt-text-on-dark-secondary);font-size:13px;border-top:1px solid rgba(255,255,255,.1)}