:root {
  color-scheme: light;
  --ink: #0B1220;
  --muted: #0F172A;
  --line: #E3F0FF;
  --panel: #FFFFFF;
  --panel-soft: #E3F0FF;
  --bg: #F5F8FF;
  --navy: #1976F3;
  --navy-2: #1976F3;
  --teal: #1976F3;
  --teal-soft: #E3F0FF;
  --amber: #c87b13;
  --red: #b63b45;
  --shadow: 0 16px 45px rgba(19, 48, 79, .10);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
/* `overflow-x:hidden` on the root can silently become the scrolling container and break
   position:sticky in Safari/PWA mode. Clip horizontal paint without creating that container. */
html, body { max-width: 100%; overflow-x: clip; overflow-y: visible; }
body { margin: 0; min-height: 100vh; color: var(--ink); background: var(--bg); }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.shell { min-height: 100vh; }
.topbar { position: -webkit-sticky; position: sticky; top: 0; z-index: 40; min-height: 62px; display: flex; align-items: center; gap: 10px; padding: calc(7px + env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) 7px max(18px, env(safe-area-inset-left)); color: #FFFFFF; background: #1976F3; box-shadow: 0 5px 20px rgba(15, 23, 42, .18); transform: translateZ(0); backface-visibility: hidden; }
.brand { display: flex; align-items: center; gap: 9px; min-width: 205px; color:#fff; }
.brand-home { border:0; background:transparent; padding:0; text-align:left; border-radius:10px; }
.brand-home:hover, .brand-home:focus-visible { background:rgba(255,255,255,.12); outline:none; }
.brand img { width: 38px; height: 38px; object-fit: contain; }
.brand strong { display: block; font-size: 17px; white-space:nowrap; }
.brand small { display: block; color: #FFFFFF; opacity: .86; }
.nav { display: flex; flex: 1; gap: 3px; overflow-x: auto; align-items:center; }
.nav button { color: #FFFFFF; border: 0; border-radius: 12px; background: transparent; padding: 7px 9px; white-space: nowrap; display:flex; align-items:center; justify-content:center; gap:7px; }
.nav button:hover, .nav button.active { color: #FFFFFF; background: rgba(255,255,255,.20); box-shadow: inset 0 -3px 0 #FFFFFF; }
.user-menu { display: flex; align-items: center; gap: 3px; white-space: nowrap; }
.account-stack { display:flex; flex-direction:column; align-items:center; gap:2px; }
.account-stack .user-label { font-size:11px; line-height:1.1; opacity:.9; }
.user-menu .notification-button { padding:7px 6px; align-self:center; }
.user-menu button { color: #fff; border: 1px solid rgba(255,255,255,.28); border-radius: 9px; background: transparent; padding: 7px 10px; }
.content { padding: 22px; max-width: 1680px; margin: 0 auto; }
.page-head { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: 4px; font-size: clamp(26px, 3vw, 38px); letter-spacing: -.035em; }
.eyebrow { color: var(--teal); font-weight: 800; text-transform: uppercase; letter-spacing: .09em; font-size: 12px; }
.muted { color: var(--muted); }
.panel { background: var(--panel); border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow); }
.panel-pad { padding: 20px; }
.scheduler-grid { display: grid; grid-template-columns: minmax(480px, 1.35fr) 152px minmax(420px, 1fr); gap: 16px; align-items: start; }
.record-panel { min-height: 700px; }
.mode-row, .tab-row, .filter-row { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.seg { border: 1px solid var(--line); background: #f8fafc; color: var(--ink); border-radius: 999px; padding: 9px 14px; }
.seg.active { border-color: var(--navy); background: var(--navy); color: #fff; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.time-zone-format-grid { align-items: start; }
.time-zone-format-grid > .field > label { min-height: 18px; display: flex; align-items: center; }
.time-zone-format-grid > .field > select { min-height: 44px; margin: 0; }
.workweek-overtime-grid { align-items: start; }
.workweek-overtime-grid > .field > label { min-height: 18px; display: flex; align-items: center; }
.workweek-overtime-grid > .field > select,
.workweek-overtime-grid > .field > input { min-height: 44px; height: 44px; margin: 0; box-sizing: border-box; }
.field { display: grid; gap: 6px; }
.field.full { grid-column: 1 / -1; }
.field label { color: #0B1220; font-size: 13px; font-weight: 750; }
.field input, .field select, .field textarea { width: 100%; border: 1px solid #E3F0FF; border-radius: 9px; padding: 11px 12px; color: var(--ink); background: #FFFFFF; }
.field textarea { min-height: 88px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { outline: 3px solid rgba(25, 118, 243, .18); border-color: #1976F3; }
/* Keeps a checkbox and its label text aligned on one row instead of the browser default, which can
   visually separate them on narrow screens -- e.g. the Commercial Account / Billing same-as-service
   checkboxes. */
.checkbox { display: flex; align-items: center; gap: 8px; cursor: pointer; font-size: 14px; color: var(--ink); font-weight: 600; }
.checkbox input[type="checkbox"] { width: 19px; height: 19px; flex-shrink: 0; margin: 0; accent-color: var(--navy); }
.checkbox { display: flex; align-items: center; gap: 8px; margin: 5px 0 12px; }
.workbook { grid-column: 1 / -1; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.workbook-head, .work-line { display: grid; grid-template-columns: 65px 120px 1fr 100px 105px 40px; gap: 8px; padding: 9px; align-items: center; }
.workbook-head { color: #fff; background: var(--navy); font-size: 12px; font-weight: 800; }
.work-line { border-top: 1px solid var(--line); }
.work-line input { min-width: 0; width: 100%; border: 0; border-bottom: 1px solid #bac6d3; padding: 7px 4px; background: transparent; }
.work-line button { border: 0; color: var(--red); background: transparent; font-size: 20px; }
.actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 16px; }
.btn { border: 0; border-radius: 10px; padding: 11px 16px; font-weight: 750; }
.btn-primary { color: #fff; background: var(--navy); }
.btn-primary:hover { background: var(--navy-2); }
.btn-secondary { color: #0F172A; background: #E3F0FF; }
.btn-success { color: #fff; background: var(--teal); }
.btn-danger { color: #fff; background: var(--red); }
.rail { display: grid; gap: 9px; position: -webkit-sticky; position: sticky; top: calc(108px + env(safe-area-inset-top)); }
.rail button { min-height: 64px; border: 1px solid #E3F0FF; border-radius: 13px; background: #FFFFFF; color: #1976F3; font-weight: 800; box-shadow: 0 8px 24px rgba(15, 23, 42, .07); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; text-align:center; }
.rail button:hover { transform: translateY(-1px); border-color: #9db4ca; }
.rail .alert { color: #fff; border: 0; background: linear-gradient(135deg, #cc6f08, #e29b28); animation: glow 1.6s ease-in-out infinite alternate; }
@keyframes glow { to { box-shadow: 0 0 0 7px rgba(226,155,40,.16), 0 10px 28px rgba(200,123,19,.2); } }
.calendar { overflow: hidden; }
.calendar-head { display: flex; align-items: center; justify-content: space-between; padding: 17px; border-bottom: 1px solid var(--line); }
.calendar-list { max-height: 780px; overflow: auto; }
.day-group { padding: 13px 15px 6px; color: var(--navy); font-weight: 850; background: #f7f9fc; border-bottom: 1px solid var(--line); }
.job-card { margin: 10px; border: 1px solid var(--line); border-left: 5px solid var(--navy-2); border-radius: 10px; padding: 12px; background: #fff; }
.job-card.completed { border-left-color: var(--theme-accent); opacity: .72; }
.job-card.unassigned { border-left-color: var(--amber); }
.job-card.unread { border-left-color: var(--amber); background: #fffaf0; }
.job-card strong { display: block; }
.job-meta { display: flex; gap: 8px; flex-wrap: wrap; color: var(--muted); font-size: 12px; margin-top: 6px; }
.mini-action { border: 1px solid var(--line); border-radius: 7px; padding: 6px 10px; color: var(--navy); background: #fff; font-size: 12px; font-weight: 750; display: inline-flex; align-items: center; min-height: 30px; }
.mini-action.danger { color: var(--red); }
.badge { display: inline-flex; align-items: center; border-radius: 999px; padding: 4px 8px; font-size: 11px; font-weight: 800; text-transform: capitalize; background: #e8eef5; color: var(--navy); }
.badge.green { color: #0c675a; background: var(--teal-soft); }
.badge.amber { color: #855006; background: #fff0d8; }
.stats { display: grid; grid-template-columns: repeat(4, minmax(130px, 1fr)); gap: 12px; margin-bottom: 18px; }
.stat { padding: 17px; background: #fff; border: 1px solid var(--line); border-radius: 13px; }
.stat b { display: block; font-size: 25px; color: var(--navy); }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; border-bottom: 1px solid var(--line); padding: 12px 10px; vertical-align: top; }
th { color: #526177; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; background: #f7f9fc; }
.table-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.table-actions button { border: 1px solid var(--line); background: #fff; border-radius: 7px; padding: 7px 9px; }
.mobile-list { display: grid; gap: 14px; max-width: 860px; margin: 0 auto; }
.mobile-job { overflow: hidden; }
.mobile-job summary { list-style: none; padding: 18px; cursor: pointer; }
.mobile-job summary::-webkit-details-marker { display: none; }
.mobile-job[open] summary { border-bottom: 1px solid var(--line); }
.mobile-job-body { padding: 18px; }
.mobile-actions { display: grid; grid-template-columns: repeat(2, 1fr); gap: 9px; margin-top: 14px; }
.vehicle-check { padding: 17px; border: 2px solid #d6e2ee; background: #f7fbff; border-radius: 14px; }
.login-page { min-height: 100vh; display: grid; place-items: center; padding: 24px; background: radial-gradient(circle at 20% 20%, #d8edf0 0, transparent 34%), linear-gradient(135deg, #eff5fa, #dfe9f3); }
.login-card { width: min(460px, 100%); padding: 32px; background: rgba(255,255,255,.94); border: 1px solid rgba(255,255,255,.8); border-radius: 22px; box-shadow: 0 24px 70px rgba(16,45,73,.18); }
.login-brand { display: flex; align-items: center; gap: 13px; margin-bottom: 25px; }
.login-brand img { width: 52px; }
.login-card .field { margin-bottom: 14px; }
.login-card .btn { width: 100%; margin-top: 8px; }
.notice { padding: 12px 14px; border-radius: 10px; color: #0c675a; background: var(--teal-soft); border: 1px solid #b9e1da; }
.error { color: #8e2831; background: #fcebed; border-color: #efc2c7; }
.empty { padding: 38px 20px; text-align: center; color: var(--muted); }
.toast { position: fixed; right: 20px; bottom: 20px; z-index: 100; max-width: 380px; transform: translateY(120px); opacity: 0; transition: .25s ease; color: #fff; background: #163b5e; border-radius: 11px; padding: 13px 16px; box-shadow: var(--shadow); }
.toast.show { transform: translateY(0); opacity: 1; }
.toast.error { background: #8e2831; }
.modal-backdrop { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 20px; background: rgba(8,25,42,.58); }
.modal { width: min(620px, 100%); max-height: 90vh; overflow: auto; background: #fff; border-radius: 18px; box-shadow: 0 30px 90px rgba(0,0,0,.28); padding: 22px; }
@media (max-width: 1150px) {
  .scheduler-grid { grid-template-columns: minmax(430px, 1.25fr) 125px minmax(340px, .9fr); }
  .content { padding: 14px; }
}
@media (max-width: 900px) {
  .topbar { flex-wrap: wrap; padding: 10px 14px; }
  .brand { min-width: 0; flex: 1; }
  .nav { order: 3; flex-basis: 100%; }
  .account-stack .user-label { display: none; }
  .scheduler-grid { grid-template-columns: 1fr; }
  .rail { position: static; grid-template-columns: repeat(3, 1fr); }
  .record-panel { min-height: 0; }
  .calendar-list { max-height: none; }
  .stats { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .content { padding: 10px; }
  .page-head { align-items: start; flex-direction: column; }
  .form-grid { grid-template-columns: 1fr; }
  .field.full { grid-column: auto; }
  .workbook { overflow-x: auto; }
  .workbook-head, .work-line { min-width: 680px; }
  .rail { display: flex; overflow-x: auto; }
  .rail button { min-width: 120px; }
  .stats { grid-template-columns: 1fr 1fr; }
  th, td { padding: 10px 7px; }
}

.clickable-row { cursor: pointer; }
.clickable-row:hover { background: rgba(15, 23, 42, 0.04); }
.job-card[role="button"] { cursor: pointer; }

/* v0.1.32 workflow consolidation: clearer field progression without changing the visual identity. */
.workflow-section { padding: 16px 0; border-top: 1px solid var(--line); }
.workflow-section:first-child { border-top: 0; padding-top: 0; }
.section-kicker { margin-bottom: 4px; color: var(--muted); font-size: 11px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.workflow-section h3 { margin-bottom: 8px; }
.workflow-section-request { background: #f8fafc; border: 1px solid var(--line); border-radius: 12px; padding: 14px; }
.workflow-section-actual { background: #fbfefd; border: 1px solid #cde8e2; border-radius: 12px; padding: 14px; }
.workflow-section-complete { background: var(--teal-soft); border: 1px solid #b8ded6; border-radius: 12px; padding: 14px; }
.work-summary { padding: 10px 12px; border-radius: 10px; margin: 8px 0; background: #fff; border: 1px solid var(--line); }
.requested-work { color: #4f6074; }
.performed-work { border-color: #cde8e2; }
.work-edit-card { border: 1px solid #cde8e2; border-radius: 12px; padding: 13px; margin: 10px 0; background: #fff; }
.field-help { margin: 2px 0 0; font-size: 12px; }
.primary-field-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.primary-field-actions .btn { min-height: 44px; }
.inline-expander { margin-top: 10px; }
.inline-expander > summary { list-style: none; display: inline-block; cursor: pointer; }
.inline-expander > summary::-webkit-details-marker { display: none; }
.expander-form { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.collection-rule { padding: 10px 12px; border-radius: 10px; margin: 10px 0; }
.collection-rule.collect { background: #fff7e6; color: #7d520d; border: 1px solid #f0d39e; }
.collection-rule.account { background: #eef4fa; color: var(--navy); border: 1px solid #cadbea; }
.btn-danger-soft { color: var(--red); background: #fbecef; border: 1px solid #f1c8cf; }
.btn-danger-soft:hover { background: #f8dde2; }
.action-groups { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 10px 16px; }
.action-group { display: flex; flex-wrap: wrap; gap: 8px; }
.charge-type-badge { display: inline-flex; margin: 4px 0 2px; padding: 3px 8px; border-radius: 999px; font-size: 11px; font-weight: 800; background: #eef3f8; color: #46566a; }
.charge-cancellation_fee, .charge-no_show_fee, .charge-class_no_show { background: #fff0e8; color: #935019; }
.charge-service_call { background: #edf3fb; color: var(--navy); }
.charge-tuition, .charge-class_tuition { background: var(--teal-soft); color: #116c60; }
.admin-wide { grid-column: 1 / -1; }
.policy-service-call { max-width: 320px; margin-bottom: 18px; }
.policy-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-bottom: 20px; }
.policy-rule { display: grid; grid-template-columns: minmax(180px, 1fr) 190px 130px; gap: 10px; align-items: center; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: #fafbfd; }
.policy-rule select, .policy-rule input { width: 100%; border: 1px solid #cbd5e1; border-radius: 9px; padding: 10px 11px; background: #fff; }
.policy-summary { margin: 3px 0 0; font-size: 12px; }
.cancellation-modal { max-width: 600px; }
@media (max-width: 700px) {
  .policy-grid { grid-template-columns: 1fr; }
  .policy-rule { grid-template-columns: 1fr; }
  .primary-field-actions { align-items: stretch; }
  .primary-field-actions .btn, .primary-field-actions .nav-control { width: 100%; }
  .action-groups { width: 100%; justify-content: flex-start; }
}

/* v0.1.33 tablet-first scheduler + notebook work surface. */
.scheduler-workspace { padding: 0; overflow: hidden; }
.scheduler-workspace > .eyebrow,
.scheduler-workspace > h2,
.scheduler-workspace > #record-actions,
.scheduler-workspace > .mode-row,
.scheduler-workspace > .tab-row { margin-left: 20px; margin-right: 20px; }
.scheduler-workspace > .eyebrow { margin-top: 20px; }
.scheduler-section { margin: 0; padding: 22px 20px 24px; border-top: 1px solid var(--line); scroll-margin-top: 86px; }
.scheduler-section:first-of-type { border-top: 0; }
.scheduler-section-customer { background: #fff; }
.scheduler-section-work { background: #f7fafc; }
.scheduler-section-assignment { background: #fff; }
.scheduler-section-heading { display: flex; justify-content: space-between; gap: 16px; align-items: end; margin-bottom: 16px; }
.scheduler-section-heading h3 { margin: 0 0 4px; font-size: 20px; color: var(--navy); }
.scheduler-section-heading p { margin: 0; color: var(--muted); font-size: 13px; }
.scheduler-heading-line { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.scheduler-commercial-toggle { margin: 0; white-space: nowrap; }
.notebook-workbook { grid-column: 1 / -1; border: 1px solid #bdcad7; border-radius: 12px; overflow: hidden; background: #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.7); }
.notebook-workbook .workbook-head { background:
  linear-gradient(180deg, rgba(255,255,255,.20), rgba(255,255,255,.02) 46%),
  linear-gradient(135deg, var(--theme-deep), var(--theme-accent) 62%, var(--theme-accent-2)); }
.notebook-workbook .work-line { min-height: 45px; padding-top: 6px; padding-bottom: 6px; background: #fff; }
.notebook-workbook .work-line.is-blank { background: linear-gradient(to bottom, #fff, #fcfdff); }
.notebook-workbook .work-line:focus-within { background: #f1f7fc; box-shadow: inset 4px 0 0 var(--navy-2); }
.notebook-workbook .work-line input { font-size: 15px; }
.notebook-workbook .work-line.is-blank .remove-work-row { opacity: .18; }
.notebook-hint { padding: 9px 12px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; background: #f4f7fa; }
.scheduler-finish-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; margin-top: 18px; }
.scheduler-finish-actions .btn { min-height: 46px; }
.scheduler-reset-note { margin: 10px 0 0; text-align: right; font-size: 12px; }

/* Technician Actual Work uses the same open-notebook idea without exposing admin tools. */
.tech-notebook { overflow-x: auto; border: 1px solid #bfded7; border-radius: 12px; background: #fff; }
.tech-notebook-head,
.notebook-work-row { display: grid; grid-template-columns: 155px 64px 90px minmax(190px,1fr) 90px 90px 58px 34px; gap: 6px; align-items: center; min-width: 810px; padding: 7px; }
.tech-notebook-head { background: #1976F3; color: #fff; font-size: 11px; font-weight: 800; }
.notebook-work-row { margin: 0; border-top: 1px solid #d9e8e4; }
.notebook-work-row:first-of-type { border-top: 0; }
.notebook-work-row:focus-within { background: #f1fbf8; box-shadow: inset 4px 0 0 var(--teal); }
.notebook-work-row input,
.notebook-work-row select { min-width: 0; width: 100%; border: 0; border-bottom: 1px solid #b9c9c5; border-radius: 0; padding: 8px 4px; background: transparent; color: var(--ink); }
.notebook-work-row .notebook-save { justify-content: center; }
.notebook-row-spacer { width: 24px; }

/* Touch devices should invoke the browser/OS keyboard, not a custom ServeIn keyboard. */
@media (pointer: coarse) {
  .field input, .field select, .field textarea,
  .work-line input, .notebook-work-row input, .notebook-work-row select { font-size: 16px; min-height: 44px; }
  .btn, .seg, .mini-action, .rail button { min-height: 44px; }
}

/* Tablet landscape: prioritize the scheduler work surface; calendar becomes a full-width context row. */
@media (max-width: 1180px) and (min-width: 901px) {
  .scheduler-grid { grid-template-columns: minmax(0, 1fr) 145px; }
  .scheduler-grid > .calendar { grid-column: 1 / -1; }
  .record-panel { min-width: 0; }
  .rail { top: 82px; }
}

@media (max-width: 700px) {
  .scheduler-section { padding: 18px 14px 20px; }
  .scheduler-workspace > .eyebrow,
  .scheduler-workspace > h2,
  .scheduler-workspace > #record-actions,
  .scheduler-workspace > .mode-row,
  .scheduler-workspace > .tab-row { margin-left: 14px; margin-right: 14px; }
  .scheduler-section-heading { align-items: start; }
  .scheduler-finish-actions { display: grid; grid-template-columns: 1fr; }
  .scheduler-finish-actions .btn { width: 100%; }
  .scheduler-reset-note { text-align: left; }
  .notebook-workbook { overflow: visible; }
  .notebook-workbook .workbook-head,
  .notebook-workbook .work-line { min-width: 0; }

  .tech-notebook { overflow: visible; border: 0; background: transparent; }
  .tech-notebook-head { display: none; }
  .notebook-work-row { min-width: 0; grid-template-columns: 90px minmax(0,1fr) minmax(0,1fr); padding: 10px 8px; border: 1px solid #d9e8e4; border-radius: 10px; margin: 8px 0; background: #fff; }
  .notebook-work-row .notebook-catalog { grid-column: 1 / -1; }
  .notebook-work-row input[name="quantity"] { grid-column: 1; }
  .notebook-work-row input[name="itemCode"] { grid-column: 2 / -1; }
  .notebook-work-row input[name="description"] { grid-column: 1 / -1; }
  .notebook-work-row input[name="variant"] { grid-column: 1 / 3; }
  .notebook-work-row input[name="unitPrice"] { grid-column: 3; }
  .notebook-work-row .notebook-save { grid-column: 1 / 3; }
  .notebook-work-row .notebook-remove,
  .notebook-work-row .notebook-row-spacer { grid-column: 3; justify-self: stretch; }
}

/* v0.1.35 technician stabilization: job-first field workspace + server-backed time/workforce. */
.tech-head-actions { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.tech-head-actions .badge { border:1px solid var(--line); cursor:pointer; min-height:34px; }
.tech-job-order { position:relative; }
.tech-order-label { display:inline-block; margin:0 0 -3px 12px; padding:4px 8px; border-radius:8px 8px 0 0; background:var(--navy); color:#fff; font-size:10px; font-weight:900; letter-spacing:.08em; }
.tech-job-order:first-child .mobile-job { box-shadow:0 12px 34px rgba(19,48,79,.11); border-color:#aebfd0; }
.tech-job-summary-grid { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:14px; align-items:start; }
.tech-job-summary-left { min-width:0; }
.tech-job-summary-left h2 { margin:6px 0 0; }
.tech-job-heading { white-space:normal; }
.tech-job-status-row { display:flex; align-items:center; gap:7px; flex-wrap:wrap; margin-top:8px; }
.tech-job-summary-right { min-width:max-content; display:flex; flex-direction:column; align-items:flex-end; text-align:right; padding-left:8px; }
.tech-job-time { color:var(--theme-accent); font-size:clamp(20px,5.6vw,28px); line-height:1.05; font-weight:900; white-space:nowrap; }
.tech-job-city { margin-top:10px; color:var(--navy); font-size:clamp(15px,4.2vw,18px); line-height:1.1; font-weight:800; max-width:42vw; text-align:right; overflow-wrap:anywhere; }
@media (max-width:420px) {
  .tech-job-summary-grid { gap:9px; }
  .tech-job-time { font-size:clamp(18px,5.4vw,23px); }
  .tech-job-city { font-size:clamp(14px,4vw,17px); max-width:40vw; }
}
.calendar-toolbar { display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:14px; }
.calendar-toolbar > div { display:flex; gap:7px; flex-wrap:wrap; }
.time-card-panel { display:grid; grid-template-columns:minmax(220px,1fr) auto; align-items:center; gap:18px; margin-bottom:16px; }
.time-status { display:grid; gap:4px; }
.time-status span { color:var(--muted); font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.07em; }
.time-status strong { font-size:28px; color:var(--navy); }
.time-status.clocked_in strong { color:#0c675a; }
.time-status.on_break strong { color:#855006; }
.time-status small { color:var(--muted); }
.time-actions { display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.time-primary { min-width:150px; min-height:52px; font-size:16px; }
.time-event { display:flex; justify-content:space-between; gap:12px; padding:11px 0; border-top:1px solid var(--line); }
.time-event:first-of-type { border-top:0; }
.workforce-person { display:flex; justify-content:space-between; gap:18px; align-items:center; padding:13px 0; border-top:1px solid var(--line); }
.workforce-person:first-of-type { border-top:0; }
.workforce-person > div:first-child { display:grid; gap:3px; }
.workforce-person > div:first-child span { color:var(--muted); font-size:12px; }
.workforce-state { display:flex; align-items:center; gap:9px; flex-wrap:wrap; justify-content:flex-end; }
@media (max-width:600px) {
  .time-card-panel { grid-template-columns:1fr; }
  .time-actions { justify-content:stretch; }
  .time-actions .btn { flex:1; }
  .workforce-person { align-items:flex-start; flex-direction:column; }
  .workforce-state { justify-content:flex-start; }
}

/* v0.1.40 UI cleanup: permission-led visibility, service modes, and focused field work. */
.capability-box { padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: #f8fafc; }
.capability-box > strong { color: var(--navy); }
.permission-explainer { margin: 12px 0 16px; }
.permission-groups { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.permission-group { border: 1px solid var(--line); border-radius: 12px; padding: 12px 13px 6px; background: #fbfcfe; }
.permission-group h3 { margin-bottom: 8px; color: var(--navy); font-size: 14px; }
.permission-choice { align-items: flex-start; padding: 5px 0; margin: 0 0 4px; }
.permissions-modal { width: min(780px, 100%); }
.sticky-modal-actions { position: sticky; bottom: -22px; padding: 14px 0 2px; background: linear-gradient(to top, #fff 78%, rgba(255,255,255,0)); }
.tech-job-brief { display: grid; grid-template-columns: 1fr 1.5fr .65fr; gap: 10px; margin-bottom: 12px; }
.tech-brief-item { display: grid; gap: 4px; min-width: 0; padding: 12px; border: 1px solid var(--line); border-radius: 11px; background: #f8fafc; }
.tech-brief-item span { color: var(--muted); font-size: 11px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.tech-brief-item strong { overflow-wrap: anywhere; }
.technician-focus-card[open] { border-color: #9fb9cf; box-shadow: 0 18px 42px rgba(19,48,79,.12); }
.compact-expander { margin: 8px 0 12px; }
@media (max-width: 1180px) { .nav { overflow-x: visible; flex-wrap: wrap; } .nav button { padding: 9px 11px; } }
@media (max-width: 760px) { .topbar { gap: 9px; } .brand small { display: none; } .nav { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); width: 100%; gap: 5px; } .nav button { width: 100%; white-space: normal; text-align: center; min-height: 42px; } .user-menu { margin-left: auto; } .permission-groups { grid-template-columns: 1fr; } .tech-job-brief { grid-template-columns: 1fr; } .mobile-job summary { padding: 15px; } .mobile-job-body { padding: 14px; } }

/* v0.1.41 — job photos and attachments */
.attachment-modal{max-width:980px;width:min(980px,94vw);max-height:90vh;overflow:auto}
.attachment-uploader{border:1px dashed var(--line,#d7dee8);border-radius:14px;padding:14px;margin:14px 0;background:rgba(255,255,255,.65)}
.attachment-uploader.compact{margin-top:12px}
.attachment-input-label{cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.attachment-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px;margin-top:10px}
.attachment-card{border:1px solid var(--line,#d7dee8);border-radius:14px;overflow:hidden;background:#fff;min-width:0}
.attachment-preview{display:block;aspect-ratio:4/3;background:#eef2f6;overflow:hidden}
.attachment-preview img{display:block;width:100%;height:100%;object-fit:cover}
.attachment-file-icon{display:flex;aspect-ratio:4/3;align-items:center;justify-content:center;text-decoration:none;font-weight:800;letter-spacing:.08em;background:#eef2f6;color:inherit}
.attachment-info{padding:12px;display:flex;flex-direction:column;align-items:flex-start;gap:7px;min-width:0}
.attachment-info strong{max-width:100%;overflow-wrap:anywhere}
.attachment-info p{margin:0;overflow-wrap:anywhere}
.attachment-info small{color:var(--muted,#667085);line-height:1.4}
.intake-attachment{padding:12px 0;border-bottom:1px solid var(--line,#d7dee8)}
.assign-attachment-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;margin-top:10px}
.technician-attachments .attachment-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
@media(max-width:640px){.attachment-grid,.technician-attachments .attachment-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.assign-attachment-row{grid-template-columns:1fr}.attachment-info{padding:9px}.attachment-uploader .actions{display:grid;grid-template-columns:1fr}.attachment-uploader .btn{width:100%}}

/* v0.1.44 signed updater */
.update-status-card{border:1px solid var(--line);border-radius:14px;padding:14px;margin:12px 0;background:var(--panel-soft,#f7f9fc)}
.update-status-card .job-meta{margin-bottom:8px}.update-review{margin:14px 0}.update-error{font-weight:700;color:#9b1c1c}

/* v0.1.46 — approved ServeIn blue identity and separate business/employee workspaces. */
.ui-icon,.nav-icon{width:24px;height:24px;display:block;flex:0 0 auto}
.nav-icon{width:20px;height:20px}
.notification-button{position:relative;padding:8px!important}
.notification-button .ui-icon{width:21px;height:21px}
.notification-button #notif-count{display:none;position:absolute;top:-7px;right:-7px;border-radius:10px;padding:0 5px}
.notification-button #notif-count:not([hidden]){display:inline-flex}
.shell,.content{min-width:0;max-width:100%}
.muted{color:#0F172A;opacity:.72}
.eyebrow{color:#1976F3}
.panel,.job-card,.stat,.attachment-card{background:#FFFFFF;border-color:#E3F0FF}
.seg{background:#E3F0FF;border-color:#E3F0FF;color:#0B1220}
.seg.active{background:#1976F3;border-color:#1976F3;color:#FFFFFF}
.day-group,.scheduler-section-work,.workflow-section-request,.capability-box,.permission-group,.tech-brief-item,.update-status-card{background:#F5F8FF;border-color:#E3F0FF}
.calendar-head,.time-event,.workforce-person,th,td{border-color:#E3F0FF}
th{background:#E3F0FF;color:#0B1220}
.badge{background:#E3F0FF;color:#0F172A}
.toast{background:#0F172A}

.employee-workspace .topbar{flex-wrap:wrap;gap:10px 16px}
.employee-workspace .brand{flex:1}
.employee-workspace .nav{order:3;flex:0 0 100%;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;overflow:visible;background:#FFFFFF;border-radius:16px 16px 0 0;padding:8px 10px 0}
.employee-workspace .nav button{min-width:0;min-height:74px;display:flex;flex-direction:column;gap:5px;color:#0F172A;border-radius:12px 12px 0 0;padding:8px 4px;white-space:normal;text-align:center;font-size:13px}
.employee-workspace .nav button:hover,.employee-workspace .nav button.active{color:#1976F3;background:#F5F8FF;box-shadow:inset 0 -4px 0 #1976F3}
.employee-workspace .nav-icon{width:28px;height:28px}
.business-workspace .topbar{min-height:96px}
.business-workspace .nav{display:grid;grid-template-columns:repeat(7,minmax(68px,1fr));gap:2px;overflow:visible;align-self:stretch}
.business-workspace .nav button{min-width:0;min-height:72px;display:grid;grid-template-rows:25px minmax(2.24em,auto);align-content:center;justify-items:center;gap:6px;padding:7px 2px;white-space:normal;text-align:center;line-height:1.12}
.business-workspace .nav-icon{width:25px;height:25px}
.technician-page-head{margin-bottom:14px}
.tech-quick-actions{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0 0 22px}
.tech-quick-card{height:104px;min-width:0;border:1px solid #E3F0FF;border-radius:16px;background:#E3F0FF;color:#1976F3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;font-weight:800;font-size:16px;box-shadow:0 9px 24px rgba(15,23,42,.07)}
.tech-quick-card .ui-icon{width:31px;height:31px}
.tech-quick-card.green,.tech-quick-card.amber{border-radius:16px}

.lookup-modal{width:min(1180px,96vw);max-height:92vh;padding:22px;overflow:auto;overscroll-behavior:contain}
.lookup-heading{position:sticky;top:-22px;z-index:3;padding:18px 0 12px;background:#FFFFFF}
.lookup-grid{display:grid;grid-template-columns:minmax(270px,360px) minmax(0,1fr);gap:16px;align-items:start}
.lookup-search-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin-bottom:12px}
.lookup-search-row input{width:100%;min-height:44px;border:1px solid #E3F0FF;border-radius:10px;padding:10px 12px;color:#0B1220}
.lookup-list>#new-customer{width:100%;margin-bottom:12px}
.workforce-modal,.fleet-modal{width:min(820px,96vw)}

@media(max-width:900px){
  .business-workspace .nav{order:3;flex:0 0 100%;grid-template-columns:repeat(3,minmax(0,1fr));width:100%}
  .business-workspace .nav button{min-height:66px}
  .lookup-grid{grid-template-columns:1fr}
}
@media(max-width:760px){
  .employee-workspace .topbar{padding-left:max(10px,env(safe-area-inset-left));padding-right:max(10px,env(safe-area-inset-right))}
  .employee-workspace .brand strong{font-size:22px}
  .employee-workspace .user-menu .user-label{display:none}
  .employee-workspace .nav{grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;padding-left:2px;padding-right:2px}
  .employee-workspace .nav button{font-size:11.5px;line-height:1.15;padding:7px 1px;min-height:68px}
  .employee-workspace .nav-icon{width:25px;height:25px}
  .tech-quick-actions{gap:9px}
  .tech-quick-card{height:94px;padding:8px;font-size:13px;border-radius:14px}
  .tech-quick-card.green,.tech-quick-card.amber{border-radius:14px}
  .lookup-modal{width:100%;height:100%;max-height:100%;border-radius:0;padding:16px}
  .lookup-heading{top:-16px;padding-top:10px}
}
@media(max-width:430px){
  .employee-workspace .brand small{display:none}
  .employee-workspace .brand img{width:36px;height:36px}
  .employee-workspace .brand strong{font-size:19px}
  .employee-workspace .user-menu{gap:5px}
  .employee-workspace .user-menu button{padding:7px 8px}
  .employee-workspace .nav button{font-size:10.5px}
  .employee-workspace .nav-icon{width:23px;height:23px}
  .tech-quick-actions{gap:7px}
  .tech-quick-card{height:86px;font-size:12px}
  .tech-quick-card .ui-icon{width:27px;height:27px}
}
@media(orientation:landscape) and (max-height:520px){
  .employee-workspace .topbar{position:sticky;padding-top:max(6px,env(safe-area-inset-top));padding-bottom:5px}
  .employee-workspace .nav button{min-height:56px;flex-direction:row}
  .employee-workspace .nav-icon{width:22px;height:22px}
  .tech-quick-card{height:76px;flex-direction:row}
}
.hours-grid{display:grid;gap:8px;margin-top:10px}.hours-row{display:grid;grid-template-columns:minmax(130px,1fr) 110px auto 110px;gap:8px;align-items:center}.hours-row input[type=time]{width:100%}@media(max-width:620px){.hours-row{grid-template-columns:1fr 1fr}.hours-row span{display:none}}

/* v0.1.56: simplified Parts/Services entry and compact duration controls */
.work-entry-stack { display:grid; gap:16px; width:100%; grid-column:1 / -1; min-width:0; }
.notebook-workbook h4 { margin:0; padding:10px 12px; font-size:16px; }
.simple-workbook-head, .simple-work-line { grid-template-columns: 90px minmax(220px, 1fr) 140px 40px !important; min-width:0 !important; }
.duration-pair { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.completed-jobs-section { margin-top:24px; padding-top:18px; border-top:2px solid var(--line); }
.completed-job-order { opacity:.78; }
.completed-job-order .technician-focus-card { background:#f4f6f8; }
@media (max-width: 700px) { .simple-workbook-head, .simple-work-line { grid-template-columns: 64px minmax(0, 1fr) 96px 34px !important; } }

.completed-office-section{border-top:1px solid var(--line);margin-top:14px;padding-top:14px}.completed-office-section .job-card{opacity:.72}.service-charge-field{border:1px solid #cbd8e5;border-radius:10px;padding:12px;background:#fff}

/* v0.1.61 technician settings + mobile navigation layout */
.navigation-provider-downloads { display:grid; gap:12px; }
.navigation-provider-downloads h3 { margin:0; }
.navigation-provider-row { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:14px; border:1px solid var(--line, #d8e0ea); border-radius:14px; background:var(--panel, #fff); }
.navigation-provider-row > div { min-width:0; display:grid; gap:3px; }
.navigation-provider-row strong { display:block; }
.navigation-provider-row small { display:block; color:var(--muted, #667085); }
.navigation-provider-row .btn { flex:0 0 auto; white-space:nowrap; }
.settings-launch-card { width:100%; text-align:left; cursor:pointer; }
.settings-launch-card > div { display:grid; grid-template-columns:auto 1fr; column-gap:12px; row-gap:4px; align-items:center; }
.settings-launch-card .ui-icon { grid-row:1 / span 2; }
.settings-launch-card strong { font-size:1.05rem; }
.settings-launch-card span { color:var(--muted, #667085); }
@media (max-width: 640px) {
  .navigation-provider-row { align-items:stretch; flex-direction:column; }
  .navigation-provider-row .btn { width:100%; }
}

/* v0.1.64 — compact final invoice review surface */
.invoice-preview-modal{max-width:920px;width:min(96vw,920px)}
.invoice-preview-sheet{background:#fff;color:#171717;border-radius:14px;padding:18px;border:1px solid rgba(0,0,0,.12)}
.invoice-preview-heading{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;border-bottom:1px solid #ddd;padding-bottom:10px;margin-bottom:12px}
.invoice-preview-columns,.invoice-preview-line{display:grid;grid-template-columns:110px 80px minmax(180px,1fr) 120px auto;gap:8px;align-items:center}
.invoice-preview-columns{font-size:12px;font-weight:700;padding:8px 0;color:#555}
.invoice-preview-line{padding:6px 0;border-top:1px solid #eee}
.invoice-preview-line input,.invoice-preview-line select{width:100%}
.invoice-preview-totals{margin:18px 0 0 auto;max-width:390px;border-top:1px solid #ddd;padding-top:10px}
.invoice-preview-totals>div{display:flex;justify-content:space-between;gap:18px;padding:5px 0}
.invoice-preview-grand{font-size:1.12rem;border-top:1px solid #bbb;margin-top:6px;padding-top:10px!important}
@media(max-width:720px){.invoice-preview-columns{display:none}.invoice-preview-line{grid-template-columns:1fr 90px}.invoice-preview-line [data-preview-key="description"]{grid-column:1/-1}.invoice-preview-line [data-preview-key="unitPrice"]{grid-column:1/2}.invoice-preview-line [data-preview-remove]{grid-column:2/3}.invoice-preview-heading{flex-direction:column}}

/* v0.1.66 operational scaffolding */
.dashboard-context { position: relative; overflow: visible; }
.edge-tabs { position: fixed; right: 0; top: calc(76px + env(safe-area-inset-top)); display: grid; gap: 8px; z-index: 35; }
.edge-tabs button { width: 76px; min-height: 50px; padding: 6px 8px; border: 1px solid #d7e7fb; border-right: 0; border-left: 4px solid #1976f3; border-radius: 12px 0 0 12px; background: #fff; color: #1976f3; box-shadow: 0 6px 16px rgba(15,23,42,.12); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; font-weight:800; cursor:pointer; }
.edge-tabs button:hover { transform: translateX(-2px); }
.edge-tabs .ui-icon { width: 18px; height: 18px; }
.edge-tabs span { font-size: 11px; }
.rail .incoming-tile.has-pending { color:#9a5700; border-color:#efc56c; background:#fffaf0; animation: incomingSoftGlow 1.8s ease-in-out infinite alternate; }
.incoming-count { display:inline-flex; min-width:24px; height:24px; align-items:center; justify-content:center; border-radius:999px; background:#d77a11; color:#fff; font-size:12px; padding:0 6px; }
@keyframes incomingSoftGlow { from { box-shadow:0 6px 20px rgba(214,122,17,.12); } to { box-shadow:0 6px 28px rgba(214,122,17,.38), 0 0 0 3px rgba(239,197,108,.22); } }
.technician-work-order { border: 1px solid #dbe8f7; border-radius: 14px; padding: 14px; background:#fbfdff; }
.work-order-sheet { display:grid; gap:0; border:1px solid #dbe8f7; border-radius:10px; overflow:hidden; background:#fff; }
.work-order-line { display:grid; grid-template-columns:minmax(42px,auto) minmax(0,1fr) minmax(70px,auto); gap:10px; align-items:center; min-height:42px; padding:8px 10px; border-bottom:1px solid #e8f0f8; }
.work-order-line:last-child { border-bottom:0; }
.work-order-qty { font-weight:900; color:#174a7c; white-space:nowrap; }
.work-order-description { font-weight:700; min-width:0; overflow-wrap:anywhere; }
.work-order-finish { font-weight:700; color:#53677b; text-align:right; }
@media (max-width: 1100px) { .edge-tabs { right: 0; top: calc(76px + env(safe-area-inset-top)); } .edge-tabs button { width:68px; opacity:.96; } .calendar-head { padding-right:72px; } }
@media (max-width: 720px) { .work-order-line { grid-template-columns:42px minmax(0,1fr); } .work-order-finish { grid-column:2; text-align:left; font-size:12px; } }
.workforce-person-action { cursor:pointer; }
.workforce-person-action:hover { border-color:#9db4ca; transform:translateY(-1px); }
.month-calendar-shell { display:grid; grid-template-columns:minmax(132px,165px) minmax(0,1fr); border:1px solid var(--theme-line,#d9e0e8); border-radius:12px; overflow:hidden; min-height:520px; background:#fff; }
.month-staff-roster { min-width:0; background:color-mix(in srgb,var(--theme-pale,#eef6ff) 42%,#fff 58%); border-right:1px solid var(--theme-line,#d9e0e8); }
.month-staff-title { position:sticky; top:0; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:42px; padding:9px 10px; font-weight:900; border-bottom:1px solid var(--theme-line,#d9e0e8); background:var(--theme-surface-strong,#f7fbff); }
.month-staff-title span { min-width:24px; padding:2px 6px; border-radius:999px; text-align:center; font-size:11px; color:var(--theme-deep,#174a7c); background:#fff; border:1px solid var(--theme-line,#d9e0e8); }
.month-staff-list { padding:6px; display:grid; gap:4px; }
.month-staff-name { padding:7px 8px; border-radius:8px; font-size:12px; font-weight:800; line-height:1.2; overflow-wrap:anywhere; }
.month-staff-name.selected { background:var(--theme-pale,#eef6ff); box-shadow:inset 3px 0 0 var(--theme-accent,#1976f3); color:var(--theme-deep,#174a7c); }
.month-calendar-scroll { min-width:0; overflow-x:auto; overflow-y:visible; }
.month-calendar-grid { display:grid; grid-template-columns:repeat(7,minmax(94px,1fr)); min-width:658px; align-content:start; }
.month-weekday { min-height:42px; padding:9px 6px; display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:900; text-align:center; background:var(--theme-surface-strong,#f7fbff); border-right:1px solid var(--theme-line,#d9e0e8); border-bottom:1px solid var(--theme-line,#d9e0e8); }
.month-weekday:nth-child(7) { border-right:0; }
.month-date-cell { position:relative; min-height:118px; padding:27px 5px 6px; background:#fff; border-right:1px solid var(--theme-line,#d9e0e8); border-bottom:1px solid var(--theme-line,#d9e0e8); overflow:hidden; cursor:pointer; }
.month-date-cell:nth-child(7n) { border-right:0; }
.month-date-cell.outside-month { background:color-mix(in srgb,var(--theme-pale,#eef6ff) 18%,#fff 82%); cursor:default; }
.month-date-cell.has-work:hover { background:color-mix(in srgb,var(--theme-pale,#eef6ff) 28%,#fff 72%); }
.month-date-number { position:absolute; top:6px; left:8px; font-size:12px; font-weight:900; color:var(--theme-deep,#174a7c); }
.month-appointments { display:grid; gap:4px; }
.month-appointment { width:100%; min-width:0; border:1px solid var(--theme-line,#d9e0e8); border-left:3px solid var(--theme-accent,#1976f3); border-radius:7px; padding:4px 5px; background:var(--theme-surface,#fff); color:inherit; text-align:left; cursor:pointer; overflow:hidden; }
.month-appointment:hover { background:var(--theme-pale,#eef6ff); }
.month-customer,.month-work { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.month-customer { font-size:11px; font-weight:900; }
.month-work { margin-top:1px; font-size:9px; color:#667789; }
/* Kept for backward-compatible theme/tests; Month view now uses named appointment cards instead of color-only dots. */
.month-dot { width:9px; height:9px; border-radius:50%; background:var(--theme-accent,#1976f3); box-shadow:0 0 0 3px rgba(var(--theme-rgb,25,118,243),.12); }
@media (max-width: 820px) { .month-calendar-shell { grid-template-columns:118px minmax(0,1fr); } .month-calendar-grid { grid-template-columns:repeat(7,minmax(86px,1fr)); min-width:602px; } .month-date-cell { min-height:104px; } .month-work { display:none; } }

/* v0.1.69: finish business-header alignment + keep Scheduler date clear of edge rail */
.business-workspace .topbar { min-height: 62px; padding-top: calc(6px + env(safe-area-inset-top)); padding-bottom: 6px; }
.business-workspace .nav { min-width: 0; }
.business-workspace .user-menu { align-items: flex-start; gap: 10px; }
.business-workspace .user-menu .notification-button { align-self: flex-start; margin-top: 0; }
.business-workspace .header-icon-button,
.business-workspace #logout { min-height: 38px; height: 38px; display:flex; align-items:center; justify-content:center; }
.business-workspace .header-icon-button { width: 42px; padding: 7px; }
.business-workspace .header-icon-button .ui-icon { width: 22px; height: 22px; }
.business-workspace .header-icon-button.active { background: rgba(255,255,255,.20); box-shadow: inset 0 -3px 0 #fff; }
.business-workspace .account-stack { align-items:center; }
.page-head-actions { display:flex; align-items:center; justify-content:flex-end; gap:10px; flex-wrap:wrap; }

/* Reserve physical room for the edge tabs so they never cover the compact calendar. */
.business-workspace .dashboard-context { position: relative; margin-right: 62px; overflow: visible; }
.business-workspace .scheduler-page-head { margin-right: 62px; }
.edge-tabs { right: 3px; top: calc(70px + env(safe-area-inset-top)); gap: 8px; }
.edge-tabs button { width: 62px; min-height: 50px; }
.calendar-head { padding-right: 17px; }

@media (max-width: 1100px) {
  .business-workspace .dashboard-context { margin-right: 58px; }
  .business-workspace .scheduler-page-head { margin-right: 58px; }
  .edge-tabs { right: 2px; top: calc(70px + env(safe-area-inset-top)); }
  .edge-tabs button { width: 58px; }
  .calendar-head { padding-right: 17px; }
}
@media (max-width: 900px) {
  .business-workspace .dashboard-context { margin-right: 0; }
  .business-workspace .scheduler-page-head { margin-right: 0; }
  .edge-tabs { position: static; grid-template-columns: repeat(3,minmax(0,1fr)); margin-top: 12px; }
  .edge-tabs button { width: 100%; border-right: 1px solid #d7e7fb; border-radius: 12px; }
}

/* v0.1.73 — desktop Scheduler shell + four intake faces */
.scheduler-workspace { position: relative; overflow: visible; }
.record-header-row { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:8px; }
.record-header-row h2 { margin:2px 0 0; }
.intake-mode-switch { margin:0 !important; padding:4px; border:1px solid #d9e7f6; border-radius:12px; background:#f5f9ff; flex-wrap:nowrap; }
.intake-mode-switch .seg { min-width:92px; margin:0; }
.customer-face-tabs { pointer-events:none; }
.customer-face-tab { pointer-events:auto; position:absolute; top:190px; z-index:8; width:34px; min-height:154px; border:1px solid #c9d9eb; background:#f7fbff; color:#52667b; font-weight:900; letter-spacing:.02em; box-shadow:0 6px 18px rgba(15,23,42,.10); writing-mode:vertical-rl; text-orientation:mixed; cursor:pointer; }
.customer-face-tab.face-left { left:-34px; border-radius:12px 0 0 12px; transform:rotate(180deg); }
.customer-face-tab.face-right { right:-34px; border-radius:0 12px 12px 0; }
.customer-face-tab.active { background:#1976f3; color:#fff; border-color:#1976f3; box-shadow:0 8px 22px rgba(25,118,243,.26); }
.customer-face-tab:not(.active):hover { background:#eef6ff; color:#1976f3; }
.existing-commercial-toggle { margin:0; white-space:nowrap; }
.proposal-list-modal { max-width:900px; }
.rail [data-rail="proposals"] { border-color:#E3F0FF; background:#FFFFFF; }
.rail { gap:7px; }
.rail button { min-height:58px; }
.business-workspace .account-stack { justify-content:center; }
.business-workspace .user-menu { align-items:center; }

@media (min-width: 1181px) {
  .scheduler-grid { column-gap:34px; }
}
@media (max-width:1180px) {
  .customer-face-tab { top:185px; width:30px; min-height:140px; }
  .customer-face-tab.face-left { left:-30px; }
  .customer-face-tab.face-right { right:-30px; }
  .record-header-row { flex-direction:column; }
}
@media (max-width:900px) {
  .customer-face-tab { position:absolute; top:180px; width:28px; min-height:126px; font-size:11px; }
  .customer-face-tab.face-left { left:-14px; }
  .customer-face-tab.face-right { right:-14px; }
  .scheduler-workspace { margin-left:14px; margin-right:14px; }
}

/* v0.1.74 cleanup: hidden reveal layers must always collapse even when component display rules exist. */
[hidden] { display: none !important; }

/* Keep the left customer-face tab attached to the card without crowding the viewport edge. */
.customer-face-tab.face-left { left: -24px; border-radius: 0 12px 12px 0; transform: rotate(180deg); }
@media (max-width: 1100px) {
  .customer-face-tab.face-left { left: -20px; }
}
@media (max-width: 760px) {
  .customer-face-tab.face-left { left: -10px; }
}

.meetup-modal { max-width: 760px; }
.meetup-attendee-head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:8px; }
.meetup-attendee-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; max-height:260px; overflow:auto; padding:4px; }
.meetup-person { border:1px solid #e3f0ff; border-radius:10px; padding:10px; background:#fff; align-items:flex-start; }
.meetup-person span { display:grid; gap:2px; }
.meetup-person small { color:var(--muted); font-weight:600; }
@media (max-width: 640px) { .meetup-attendee-grid { grid-template-columns:1fr; } }


/* v0.1.75 — Scheduler parity + compact lookup + cosmetic alignment */
.lookup-backdrop { place-items: stretch end; padding: 0; background: rgba(8,25,42,.18); }
.lookup-modal { width: min(50vw, 760px); max-height: 100%; height: 100%; border-radius: 18px 0 0 18px; padding: 18px; }
.lookup-modal.lookup-expanded { width: min(88vw, 1120px); }
.lookup-grid { grid-template-columns: minmax(250px, 320px) minmax(0,1fr); }
.lookup-detail-placeholder { min-height: 220px; }
@media (max-width: 900px) {
  .lookup-modal, .lookup-modal.lookup-expanded { width: 100%; height: 100%; border-radius: 0; }
  .lookup-grid { grid-template-columns: 1fr; }
}

.calendar-assignment-bar { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; flex-wrap:wrap; padding:12px; margin-bottom:14px; border:1px solid var(--line); border-radius:10px; background:#f7fbff; }
.calendar-assignment-bar > div:first-child { display:grid; gap:2px; }
.calendar-assignment-bar span { color:var(--muted); font-size:12px; }
.calendar-drop-targets { display:flex; gap:8px; flex-wrap:wrap; }
.calendar-drop-target { min-height:40px; border:1px dashed #8fb4de; border-radius:8px; background:#fff; color:var(--navy); padding:8px 12px; font-weight:800; }
.calendar-drop-target.drag-over { background:#e8f3ff; border-style:solid; box-shadow:inset 0 0 0 2px #1976f3; }
.calendar-drop-target.unassigned { color:#855006; border-color:#d6a44c; }
.calendar-draggable-job { cursor:grab; }
.calendar-draggable-job.is-dragging { opacity:.45; }
.calendar-assign-select { min-width:145px; max-width:220px; width:100%; }
@media (pointer:coarse) {
  .calendar-draggable-job { cursor:default; }
}

.intake-mode-switch { margin-right:14px !important; border-radius:8px; }
.intake-mode-switch .seg { border-radius:7px; min-width:98px; }
.customer-face-tab { top:184px; border-radius:8px 0 0 8px; box-shadow:none; }
.customer-face-tab.face-left { left:8px; border-radius:0 8px 8px 0; }
.customer-face-tab.face-right { right:8px; border-radius:0 8px 8px 0; }
.scheduler-workspace { padding-left:30px; padding-right:30px; }
.scheduler-section { padding-left:18px; padding-right:18px; }

@media (min-width:1181px) {
  .scheduler-grid { grid-template-columns:minmax(540px,1.45fr) 138px minmax(440px,1.08fr); column-gap:12px; }
  .business-workspace .dashboard-context { margin-right:56px; }
  .business-workspace .scheduler-page-head { margin-right:56px; }
}

/* v0.1.76 — compact Week → Day → Punch Time Card history */
.time-history { display:grid; gap:10px; }
.time-history-week,
.time-history-day { border:1px solid var(--line); border-radius:12px; background:#fff; overflow:hidden; }
.time-history-week > summary,
.time-history-day > summary { list-style:none; display:flex; align-items:center; justify-content:space-between; gap:14px; padding:14px 16px; cursor:pointer; }
.time-history-week > summary::-webkit-details-marker,
.time-history-day > summary::-webkit-details-marker { display:none; }
.time-history-week > summary > div { display:grid; gap:2px; }
.time-history-week > summary::after,
.time-history-day > summary::after { content:'›'; font-size:24px; line-height:1; transform:rotate(90deg); transition:transform .15s ease; color:var(--muted); }
.time-history-week[open] > summary::after,
.time-history-day[open] > summary::after { transform:rotate(-90deg); }
.time-history-days { display:grid; gap:8px; padding:0 10px 10px; }
.time-history-day { background:#f9fcff; }
.time-history-detail { padding:0 14px 14px; }
.time-entry-group { border-top:1px solid var(--line); padding-top:10px; margin-top:4px; }
.time-entry-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:0 0 8px; }
.timekeeping-person-row { cursor:pointer; }
.timekeeping-person-row:hover { background:#f7fbff; }
.timekeeping-person-row:focus-visible { outline:2px solid var(--accent); outline-offset:-2px; }
@media (max-width:640px) {
  .time-history-week > summary,
  .time-history-day > summary,
  .time-entry-head { align-items:flex-start; }
}

/* v0.1.77 — technician workflow clarity + dashboard completed-section spacing */
.tech-workflow .primary-field-actions { gap: 14px; }
.tech-workflow .nav-go {
  background: #d9eaff;
  border-color: #8dbbf5;
  color: #0d57a7;
  font-weight: 800;
}
.tech-workflow .nav-go:hover { background: #c9e0ff; border-color: #6fa8ed; }
.tech-workflow .primary-field-actions [data-tech-cancel] { flex-basis: 100%; margin-top: 10px; }
.technician-add-invoice { margin-top: 14px; }
.add-invoice-trigger { font-weight: 800; }
.technician-invoice-notebook { margin-top: 12px; }
.completed-office-section { margin-top: 18px; padding-top: 26px; }
.completed-office-section > .section-kicker,
.completed-office-section > h3 { margin-left:17px; margin-right:17px; }


/* v0.1.78 — operational queue emphasis + final dashboard/tab alignment */
.rail .attention-yellow {
  color:#8a6100;
  border-color:#e6c862;
  background:#fff9dd;
  box-shadow:0 8px 24px rgba(160,118,0,.10), 0 0 0 2px rgba(232,194,57,.08);
  animation:queueYellowGlow 1.8s ease-in-out infinite alternate;
}
.rail .attention-red {
  color:#a83838;
  border-color:#e7a6a6;
  background:#fff0f0;
  box-shadow:0 8px 24px rgba(176,48,48,.10), 0 0 0 2px rgba(211,72,72,.08);
  animation:queueRedGlow 1.6s ease-in-out infinite alternate;
}
@keyframes queueYellowGlow {
  from { box-shadow:0 8px 24px rgba(160,118,0,.08), 0 0 0 1px rgba(232,194,57,.08); }
  to { box-shadow:0 9px 26px rgba(160,118,0,.14), 0 0 0 3px rgba(232,194,57,.13); }
}
@keyframes queueRedGlow {
  from { box-shadow:0 8px 24px rgba(176,48,48,.08), 0 0 0 1px rgba(211,72,72,.08); }
  to { box-shadow:0 9px 26px rgba(176,48,48,.15), 0 0 0 3px rgba(211,72,72,.13); }
}

/* v0.1.82 — company-wide Blue Glass / Red Glass presentation layer.
   Installed PWA/native app icons remain the fixed blue ServeIn brand assets. Operational queue
   colors (.attention-yellow/.attention-red and semantic alert states) are intentionally independent
   from these theme variables and keep their existing meaning. */
:root {
  --theme-accent: #1976F3;
  --theme-accent-2: #3C9BFF;
  --theme-deep: #0B4FC7;
  --theme-pale: #EAF4FF;
  --theme-line: #CFE4FF;
  --theme-rgb: 25, 118, 243;
}
html[data-ui-theme="blue"] {
  --navy: #1976F3;
  --navy-2: #2E8CF6;
  --theme-accent: #1976F3;
  --theme-accent-2: #55AEFF;
  --theme-deep: #0B4FC7;
  --theme-pale: #EAF4FF;
  --theme-line: #CFE4FF;
  --theme-rgb: 25, 118, 243;
  --line: #E3F0FF;
  --panel-soft: #EAF4FF;
  --bg: #F5F8FF;
}
html[data-ui-theme="red"] {
  --navy: #C62828;
  --navy-2: #E04545;
  --theme-accent: #C62828;
  --theme-accent-2: #F05A5A;
  --theme-deep: #8E1515;
  --theme-pale: #FFF0F0;
  --theme-line: #F2CECE;
  --theme-rgb: 198, 40, 40;
  --line: #F2DEDE;
  --panel-soft: #FFF1F1;
  --bg: #FFF8F8;
}

body {
  background:
    radial-gradient(circle at 16% 0%, rgba(var(--theme-rgb), .075), transparent 31rem),
    linear-gradient(180deg, rgba(var(--theme-rgb), .025), transparent 22rem),
    var(--bg);
}
.topbar {
  background:
    linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.025) 38%, rgba(0,0,0,.08)),
    linear-gradient(115deg, var(--theme-deep), var(--theme-accent) 48%, var(--theme-accent-2));
  border-bottom: 1px solid rgba(255,255,255,.35);
  box-shadow: 0 5px 20px rgba(var(--theme-rgb), .28), inset 0 1px 0 rgba(255,255,255,.35);
  backdrop-filter: blur(18px) saturate(125%);
  -webkit-backdrop-filter: blur(18px) saturate(125%);
}
.brand-mark-themed {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  flex: 0 0 40px;
  border-radius: 12px;
  background: linear-gradient(145deg, rgba(255,255,255,.27), rgba(255,255,255,.08));
  border: 1px solid rgba(255,255,255,.34);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.36), 0 7px 18px rgba(0,0,0,.12);
}
.brand-mark-themed img { width: 34px; height: 34px; object-fit: contain; }
.nav button:hover, .nav button.active,
.header-icon-button.active {
  background: linear-gradient(180deg, rgba(255,255,255,.28), rgba(255,255,255,.12));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.33), inset 0 -3px 0 rgba(255,255,255,.92);
}
.panel {
  background: rgba(255,255,255,.92);
  border-color: var(--theme-line);
  box-shadow: 0 16px 45px rgba(19,48,79,.09), inset 0 1px 0 rgba(255,255,255,.9);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.eyebrow { color: var(--theme-accent); }
.btn-primary,
.seg.active,
.workbook-head {
  background:
    linear-gradient(180deg, rgba(255,255,255,.20), rgba(255,255,255,.02) 46%),
    linear-gradient(135deg, var(--theme-deep), var(--theme-accent) 62%, var(--theme-accent-2));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.32), 0 6px 16px rgba(var(--theme-rgb), .19);
}
.btn-primary:hover { background: linear-gradient(135deg, var(--theme-accent), var(--theme-accent-2)); }
.btn-secondary {
  color: var(--theme-deep);
  background: linear-gradient(180deg, rgba(255,255,255,.96), var(--theme-pale));
  border: 1px solid var(--theme-line);
  box-shadow: inset 0 1px 0 #fff;
}
.seg.active { border-color: var(--theme-accent); }
.checkbox input[type="checkbox"] { accent-color: var(--theme-accent); }
.field input:focus, .field select:focus, .field textarea:focus {
  outline: 3px solid rgba(var(--theme-rgb), .18);
  border-color: var(--theme-accent);
}
.rail button:not(.attention-yellow):not(.attention-red):not(.alert) {
  border-color: var(--theme-line);
  color: var(--theme-accent);
  background:
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.77)),
    var(--theme-pale);
  box-shadow: inset 0 1px 0 #fff, 0 8px 24px rgba(var(--theme-rgb), .08);
}
.rail button:not(.attention-yellow):not(.attention-red):not(.alert):hover {
  border-color: var(--theme-accent-2);
  box-shadow: inset 0 1px 0 #fff, 0 10px 26px rgba(var(--theme-rgb), .14);
}
.edge-tabs button {
  border-color: var(--theme-line);
  border-left-color: var(--theme-accent);
  color: var(--theme-accent);
  background: linear-gradient(180deg, rgba(255,255,255,.98), var(--theme-pale));
  box-shadow: inset 0 1px 0 #fff, 0 6px 16px rgba(var(--theme-rgb), .12);
}
.customer-face-tab.active {
  background:
    linear-gradient(180deg, rgba(255,255,255,.19), transparent 44%),
    linear-gradient(135deg, var(--theme-deep), var(--theme-accent));
  border-color: var(--theme-accent);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 8px 22px rgba(var(--theme-rgb), .25);
}
.customer-face-tab:not(.active):hover { background: var(--theme-pale); color: var(--theme-accent); }
.day-group, .stat b, .mini-action { color: var(--theme-accent); }
.job-card:not(.completed):not(.unassigned):not(.unread) { border-left-color: var(--theme-accent); }

/* Theme chooser is deliberately visual-only. It writes one company setting; it does not alter
   workflow buttons, queue states, records, permissions, or installed icon assets. */
.theme-choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:14px; }
.theme-choice { position:relative; display:grid; grid-template-columns:54px 1fr; grid-template-rows:auto auto; column-gap:12px; align-items:center; padding:14px; border:1px solid var(--line); border-radius:14px; background:#fff; cursor:pointer; }
.theme-choice input { position:absolute; top:10px; right:10px; accent-color:var(--theme-accent); }
.theme-choice .theme-preview { grid-row:1 / span 2; width:54px; height:54px; border-radius:14px; border:1px solid rgba(255,255,255,.65); box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 7px 18px rgba(15,23,42,.12); }
.theme-choice.blue-choice .theme-preview { background:linear-gradient(145deg,#0b4fc7,#1976f3 58%,#55aeff); }
.theme-choice.red-choice .theme-preview { background:linear-gradient(145deg,#8e1515,#c62828 58%,#f05a5a); }
.theme-choice strong { font-size:15px; }
.theme-choice small { color:var(--muted); }
.theme-choice:has(input:checked) { border-color:var(--theme-accent); box-shadow:0 0 0 3px rgba(var(--theme-rgb),.10); }
@media (max-width:600px) { .theme-choice-grid { grid-template-columns:1fr; } }

/* Operational attention states remain protected from theme recoloring. */
.rail .attention-yellow {
  color:#8a6100;
  border-color:#e6c862;
  background:#fff9dd;
}
.rail .attention-red {
  color:#a83838;
  border-color:#e7a6a6;
  background:#fff0f0;
}

/* v0.1.84 — global theme cleanup.
   Decorative blue presentation surfaces now inherit the company Blue Glass / Red Glass palette.
   Operational attention/status colors remain intentionally semantic and are not recolored here. */
.field input, .field select, .field textarea,
.lookup-search-row input {
  border-color: var(--theme-line);
}
.seg,
.intake-mode-switch {
  background: var(--theme-pale);
  border-color: var(--theme-line);
}
.seg:not(.active) {
  color: var(--theme-deep);
}
.day-group,
.scheduler-section-work,
.workflow-section-request,
.capability-box,
.permission-group,
.tech-brief-item,
.update-status-card,
.vehicle-check,
.calendar-assignment-bar,
.month-person-head,
.month-day-head,
.time-history-day,
.timekeeping-person-row:hover {
  background: color-mix(in srgb, var(--theme-pale) 58%, #fff 42%);
  border-color: var(--theme-line);
}
th {
  background: var(--theme-pale);
  border-color: var(--theme-line);
}
.badge:not(.green):not(.amber):not(.red) {
  background: var(--theme-pale);
  color: var(--theme-deep);
}
.employee-workspace .nav button:hover,
.employee-workspace .nav button.active {
  color: var(--theme-accent);
  background: color-mix(in srgb, var(--theme-pale) 72%, #fff 28%);
  box-shadow: inset 0 -4px 0 var(--theme-accent);
}
.tech-quick-card {
  border-color: var(--theme-line);
  background: var(--theme-pale);
  color: var(--theme-accent);
}
.notebook-workbook .work-line:focus-within {
  background: color-mix(in srgb, var(--theme-pale) 64%, #fff 36%);
  box-shadow: inset 4px 0 0 var(--theme-accent);
}
.notebook-hint,
.attachment-preview,
.attachment-file-icon {
  background: color-mix(in srgb, var(--theme-pale) 52%, #fff 48%);
}
.tech-notebook-head {
  background: linear-gradient(135deg, var(--theme-deep), var(--theme-accent) 62%, var(--theme-accent-2));
}
.collection-rule.account,
.charge-service_call {
  background: color-mix(in srgb, var(--theme-pale) 72%, #fff 28%);
  color: var(--theme-deep);
  border-color: var(--theme-line);
}
.edge-tabs button {
  border-color: var(--theme-line);
  border-left-color: var(--theme-accent);
  color: var(--theme-accent);
}
.customer-face-tab:not(.active) {
  border-color: var(--theme-line);
  background: color-mix(in srgb, var(--theme-pale) 66%, #fff 34%);
  color: var(--theme-deep);
}
.customer-face-tab:not(.active):hover {
  background: var(--theme-pale);
  color: var(--theme-accent);
}
.calendar-drop-target {
  border-color: color-mix(in srgb, var(--theme-accent) 55%, #fff 45%);
  color: var(--theme-accent);
}
.calendar-drop-target.drag-over {
  background: var(--theme-pale);
  border-color: var(--theme-accent);
  box-shadow: inset 0 0 0 2px var(--theme-accent);
}
.month-person-head,
.month-day-head,
.month-person,
.month-cell {
  border-color: var(--theme-line);
}
.month-cell.has-work:hover {
  background: var(--theme-pale);
}
.month-dot {
  background: var(--theme-accent);
  box-shadow: 0 0 0 3px rgba(var(--theme-rgb), .12);
}
/* Assignment is a neutral workflow state, not an alert; it follows the chosen theme. */
.badge.assigned,
.badge[data-status="assigned"] {
  background: var(--theme-pale);
  color: var(--theme-deep);
}
/* Keep semantically meaningful attention states protected from company theme changes. */
.badge.green { color:#0c675a; background:var(--teal-soft); }
.badge.amber { color:#855006; background:#fff0d8; }
.rail .attention-yellow { color:#8a6100; border-color:#e6c862; background:#fff9dd; }
.rail .attention-red { color:#a83838; border-color:#e7a6a6; background:#fff0f0; }

/* v0.1.85 — lock the desktop management rail to the viewport edge.
   Keep this geometry independent from themed/glass panels: backdrop-filter on a panel can
   establish a containing block for fixed descendants, so the rail is rendered as a sibling
   of the calendar panel and explicitly fixed here on desktop. */
@media (min-width: 901px) {
  .edge-tabs {
    position: fixed;
    right: 3px;
    top: calc(70px + env(safe-area-inset-top));
    z-index: 35;
  }
}

/* v0.1.86 bounded company document branding editor */
.branding-settings{grid-column:1/-1}.branding-editor{display:grid;gap:18px}.branding-logo-box{display:grid;grid-template-columns:minmax(180px,260px) 1fr;gap:18px;align-items:center;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--panel-soft)}.branding-logo-preview{min-height:120px;display:flex;align-items:center;justify-content:center;padding:14px;background:#fff;border:1px dashed var(--line);border-radius:12px;overflow:hidden}.branding-logo-preview img{display:block;max-width:100%;max-height:120px;object-fit:contain}.branding-logo-actions{justify-content:flex-start;margin-top:10px}.branding-check-grid{display:flex;flex-wrap:wrap;gap:8px 18px}.branding-check-grid .checkbox{margin:0}@media(max-width:700px){.branding-logo-box{grid-template-columns:1fr}.branding-logo-preview{min-height:100px}}

/* v0.1.87 — shared-component theme correction.
   Decorative surfaces now follow the selected company theme across desktop and mobile.
   Semantic warning/success/urgent states remain protected. */
:root {
  --theme-surface: color-mix(in srgb, var(--theme-pale) 16%, #fff 84%);
  --theme-surface-strong: color-mix(in srgb, var(--theme-pale) 34%, #fff 66%);
  --theme-surface-soft: color-mix(in srgb, var(--theme-pale) 52%, #fff 48%);
}

/* General glass/card chrome: very light tint, never a hard-coded blue cast. */
.panel,
.stat,
.attachment-card,
.backup-card,
.policy-rule,
.service-charge-field,
.work-edit-card,
.technician-work-order,
.work-order-sheet,
.settings-launch-card,
.branding-logo-box {
  border-color: var(--theme-line);
  background: var(--theme-surface);
}

/* Shared informational / neutral surfaces. Errors and semantic queue colors are excluded. */
.notice:not(.error),
.capability-box,
.permission-group,
.update-status-card,
.tech-brief-item,
.vehicle-check,
.scheduler-section-work,
.workflow-section-request,
.notebook-hint,
.attachment-preview,
.attachment-file-icon,
.branding-logo-preview,
.empty {
  border-color: var(--theme-line);
  background: var(--theme-surface-strong);
}
.notice:not(.error) {
  color: var(--theme-deep);
}

/* Ordinary inactive controls/chips inherit theme. */
.btn-secondary,
.seg:not(.active),
.customer-face-tab:not(.active),
.tech-quick-card,
.mini-action:not(.danger),
.badge:not(.green):not(.amber):not(.red),
.charge-service_call,
.collection-rule.account {
  border-color: var(--theme-line);
  background: var(--theme-surface-soft);
  color: var(--theme-deep);
}

/* Inputs and table chrome keep a subtle themed edge/fill without reducing readability. */
.field input,
.field select,
.field textarea,
.lookup-search-row input,
.policy-rule input,
.policy-rule select {
  border-color: var(--theme-line);
  background: color-mix(in srgb, var(--theme-pale) 7%, #fff 93%);
}
th,
.calendar-assignment-bar,
.month-person-head,
.month-day-head,
.time-history-day {
  border-color: var(--theme-line);
  background: var(--theme-surface-strong);
}

/* Desktop and mobile navigation chrome uses the same company theme. */
.employee-workspace .nav {
  border-color: var(--theme-line);
  background: var(--theme-surface);
}
.employee-workspace .nav button:hover,
.employee-workspace .nav button.active {
  color: var(--theme-accent);
  background: var(--theme-surface-soft);
  box-shadow: inset 0 -4px 0 var(--theme-accent);
}
.edge-tabs button {
  border-color: var(--theme-line);
  border-left-color: var(--theme-accent);
  color: var(--theme-accent);
  background: var(--theme-surface);
}
@media (max-width: 760px) {
  .edge-tabs button { border-right-color: var(--theme-line); }
  .mobile-job,
  .technician-focus-card,
  .mobile-job-body,
  .tech-workflow {
    border-color: var(--theme-line);
  }
}

/* Preserve semantic status colors after the shared-component rules above. */
.notice.error { color:#8e2831; background:#fcebed; border-color:#efc2c7; }
.badge.green { color:#0c675a; background:#e8f7f3; border-color:#b9e1da; }
.badge.amber { color:#855006; background:#fff0d8; border-color:#e6c862; }
.badge.red { color:#a83838; background:#fff0f0; border-color:#e7a6a6; }
.job-card.unassigned { border-left-color: var(--amber); }
.job-card.unread { border-left-color: var(--amber); background:#fffaf0; }
.rail .attention-yellow { color:#8a6100; border-color:#e6c862; background:#fff9dd; }
.rail .attention-red { color:#a83838; border-color:#e7a6a6; background:#fff0f0; }


/* v0.1.88 — final red/blue theme inheritance cleanup for shared form internals and technician actions.
   Presentation only: semantic success/warning/error colors remain protected. */
.notebook-workbook {
  border-color: var(--theme-line);
  background: var(--theme-surface);
}
.notebook-workbook .work-line,
.notebook-workbook .work-line.is-blank {
  background: var(--theme-surface);
  border-color: var(--theme-line);
}
.notebook-workbook .work-line input {
  border-color: var(--theme-line);
  background: color-mix(in srgb, var(--theme-pale) 6%, #fff 94%);
}
.notebook-workbook .work-line:focus-within {
  background: var(--theme-surface-soft);
  box-shadow: inset 4px 0 0 var(--theme-accent);
}
.settings-launch-card strong,
.settings-launch-card .ui-icon {
  color: var(--theme-accent);
}
.time-primary.btn-success {
  background: linear-gradient(180deg, rgba(255,255,255,.20), rgba(255,255,255,.02) 46%),
              linear-gradient(135deg, var(--theme-deep), var(--theme-accent) 62%, var(--theme-accent-2));
  border-color: var(--theme-accent);
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.32), 0 6px 16px rgba(var(--theme-rgb), .19);
}
.scheduler-page-head > .badge.green {
  background: var(--theme-surface-soft);
  color: var(--theme-deep);
  border-color: var(--theme-line);
}

/* v0.1.89 — hard-coded decorative-blue audit and header control cleanup.
   Company theme owns neutral UI surfaces. Semantic status colors remain independent. */
.user-menu .header-icon-button,
.user-menu .notification-button {
  color: #fff !important;
  background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.07)) !important;
  border-color: rgba(255,255,255,.32) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22) !important;
}
.user-menu .header-icon-button .ui-icon,
.user-menu .notification-button .ui-icon {
  color: #fff !important;
}
.user-menu .header-icon-button:hover,
.user-menu .notification-button:hover,
.user-menu .header-icon-button.active {
  color: #fff !important;
  background: linear-gradient(180deg, rgba(255,255,255,.28), rgba(255,255,255,.12)) !important;
  border-color: rgba(255,255,255,.42) !important;
}

/* Neutral cards, rows, lookup results and management surfaces. */
.panel,
.job-card:not(.unread),
.stat,
.attachment-card,
.backup-card,
.policy-rule,
.service-charge-field,
.work-edit-card,
.technician-work-order,
.work-order-sheet,
.settings-launch-card,
.branding-logo-box,
.vehicle-check,
.workforce-person,
.time-event,
.calendar-head,
.meetup-attendee-grid > label,
.customer-result,
.customer-result-card,
.lookup-result,
.lookup-result-card {
  border-color: var(--theme-line) !important;
  background-color: var(--theme-surface) !important;
}

/* Remove remaining cool-blue separators and table chrome. */
th,
td,
.calendar-head,
.time-event,
.workforce-person,
.month-person,
.month-cell,
.time-history-day,
.branding-logo-preview,
.field input,
.field select,
.field textarea,
.lookup-search-row input,
.notebook-workbook .work-line,
.notebook-workbook .work-line input {
  border-color: var(--theme-line) !important;
}
th {
  background: var(--theme-surface-strong) !important;
}
td,
.time-event,
.workforce-person {
  background: var(--theme-surface) !important;
}

/* Non-semantic inactive controls use theme tint instead of legacy ServeIn blue. */
.seg:not(.active),
.btn-secondary,
.customer-face-tab:not(.active),
.tech-quick-card,
.mini-action:not(.danger):not(.header-icon-button),
.edge-tabs button,
.rail button:not(.attention-yellow):not(.attention-red):not(.alert),
.meetup-attendee-grid > label {
  border-color: var(--theme-line) !important;
  background: var(--theme-surface-soft) !important;
  color: var(--theme-deep) !important;
}

/* Inputs stay predominantly white but inherit the selected theme at their edge/focus. */
.field input,
.field select,
.field textarea,
.lookup-search-row input,
.notebook-workbook .work-line input,
.policy-rule input,
.policy-rule select {
  background: color-mix(in srgb, var(--theme-pale) 5%, #fff 95%) !important;
}
.field input:focus,
.field select:focus,
.field textarea:focus,
.lookup-search-row input:focus {
  border-color: var(--theme-accent) !important;
  outline-color: rgba(var(--theme-rgb), .18) !important;
}

/* Preserve status/attention meaning after broad neutral overrides. */
.badge.green { color:#0c675a !important; background:#e8f7f3 !important; border-color:#b9e1da !important; }
.badge.amber { color:#855006 !important; background:#fff0d8 !important; border-color:#e6c862 !important; }
.badge.red { color:#a83838 !important; background:#fff0f0 !important; border-color:#e7a6a6 !important; }
.job-card.unassigned { border-left-color: var(--amber) !important; }
.job-card.unread { border-left-color: var(--amber) !important; background:#fffaf0 !important; }
.rail .attention-yellow { color:#8a6100 !important; border-color:#e6c862 !important; background:#fff9dd !important; }
.rail .attention-red { color:#a83838 !important; border-color:#e7a6a6 !important; background:#fff0f0 !important; }

/* v0.1.90: job video playback stays bounded inside the existing attachment card. */
.attachment-video-preview video{display:block;width:100%;max-height:240px;object-fit:contain;background:#000;border-radius:inherit}


/* v0.1.92: keep job-media review inside the originating completed-job context. */
.attachment-preview-button{appearance:none;-webkit-appearance:none;border:0;padding:0;background:transparent;width:100%;text-align:inherit;cursor:pointer}
.attachment-media-backdrop{z-index:1200}
.attachment-media-modal{max-width:900px}
.attachment-media-stage{display:flex;align-items:center;justify-content:center;min-height:240px;background:#111;border-radius:12px;overflow:hidden}
.attachment-media-full{display:block;max-width:100%;max-height:72vh;object-fit:contain}
@media (max-width:700px){.attachment-media-modal{width:calc(100vw - 20px);max-height:calc(100vh - 20px)}.attachment-media-full{max-height:68vh}}

/* v0.1.98: active Time Card state is intentionally semantic and stronger than theme tint. */
.employee-workspace .nav button.time-active,
.tech-quick-card.time-active {
  background: #fff0cf !important;
  border-color: #f2a900 !important;
  color: #8a4b00 !important;
  box-shadow: 0 0 0 3px rgba(242,169,0,.18), 0 0 18px rgba(242,169,0,.28) !important;
}
.employee-workspace .nav button.time-break,
.tech-quick-card.time-break {
  background: #fff7df !important;
  border-color: #e6b94e !important;
  color: #7b5a00 !important;
}
.timekeeping-tabs { margin: 0 0 14px; }
.shift-person-card { display:grid; gap:10px; }
.shift-summary { margin-top:6px; font-size:13px; line-height:1.5; }
.auto-clockout-choice { margin-top:8px; font-weight:800; }


/* v0.1.106 — keep the active Scheduler queue stack below the sticky business header.
   Deleted Records is no longer part of this stack; it lives on the right management rail. */
@media (min-width: 901px) {
  .business-workspace .rail {
    position: -webkit-sticky;
    position: sticky;
    top: calc(70px + env(safe-area-inset-top));
    align-self: start;
    max-height: calc(100vh - 82px - env(safe-area-inset-top));
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
  }
}

/* v0.1.109 compact Backup & Recovery history */
.backup-history-toggle { margin-top: 10px; }
.backup-previous-list { margin-top: 8px; border-top: 1px solid var(--line, rgba(127,127,127,.2)); }
.backup-compact-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 2px; border-bottom:1px solid var(--line, rgba(127,127,127,.18)); }
.backup-compact-main { min-width:0; display:flex; flex-direction:column; gap:2px; }
.backup-compact-main strong, .backup-compact-main span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.backup-compact-actions { display:flex; align-items:center; gap:6px; flex-wrap:wrap; justify-content:flex-end; }
@media (max-width: 760px) {
  .backup-compact-row { align-items:flex-start; flex-direction:column; }
  .backup-compact-main strong, .backup-compact-main span { white-space:normal; }
  .backup-compact-actions { justify-content:flex-start; }
}

/* v0.1.112 compact Files archive */
.archive-month,.archive-day{border:1px solid var(--line,#d9e0e8);border-radius:10px;margin:8px 0;background:var(--panel,#fff)}
.archive-month>summary,.archive-day>summary{cursor:pointer;padding:10px 12px;list-style-position:inside}
.archive-month-body{padding:0 10px 10px}
.archive-file-list{border-top:1px solid var(--line,#d9e0e8)}
.archive-file-line{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:9px 10px;border-bottom:1px solid var(--line,#e5e9ef)}
.archive-file-line:last-child{border-bottom:0}
@media(max-width:720px){.archive-file-line{align-items:flex-start;flex-direction:column}.archive-file-line .job-meta{width:100%;justify-content:space-between}}

/* v0.1.117 — maintenance cleanup: readable mobile Parts/Service entry + tablet-safe scheduler rails. */
.workbook-label-narrow { display:none; }
.catalog-edit-modal { max-width:680px; }

@media (max-width: 700px) {
  .simple-workbook-head,
  .simple-work-line {
    grid-template-columns: 52px minmax(112px, 1fr) 82px 30px !important;
    gap: 6px;
    padding-left: 6px;
    padding-right: 6px;
  }
  .simple-workbook-head { font-size:11px; }
  .workbook-label-wide { display:none; }
  .workbook-label-narrow { display:inline; }
  .simple-work-line input { padding-left:3px; padding-right:3px; }
  .scheduler-section-work { padding-left:10px; padding-right:10px; }
}

/* True tablet landscape keeps the management rail on the physical edge and reserves
   a matching gutter; phone-width landscape is allowed to fall back to the stacked layout. */
@media (min-width: 901px) and (max-width: 1180px) {
  .business-workspace .dashboard-context,
  .business-workspace .scheduler-page-head { margin-right:64px; }
  .edge-tabs {
    position:fixed;
    right:3px;
    top:calc(70px + env(safe-area-inset-top));
    width:58px;
    gap:6px;
  }
  .edge-tabs button { width:58px; min-height:46px; padding:5px 4px; }
  .edge-tabs span { font-size:10px; }
  .scheduler-grid { grid-template-columns:minmax(0,1fr) 132px; gap:12px; }
  .scheduler-grid > .calendar { grid-column:1 / -1; }
  .scheduler-workspace { min-width:0; }
  .record-panel { min-width:0; }
}

/* Do not promote a wide-but-short phone to the fixed desktop management rail. */
@media (min-width: 761px) and (max-width: 900px) {
  .edge-tabs {
    position:static;
    width:auto;
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:12px;
  }
  .edge-tabs button {
    width:100%;
    border-right:1px solid var(--theme-line,#d7e7fb);
    border-radius:12px;
  }
  .business-workspace .dashboard-context,
  .business-workspace .scheduler-page-head { margin-right:0; }
}

/* v0.1.118 — catalog workflow refinements + management phone launcher. */
.work-description-cell { min-width:0; display:grid; gap:4px; }
.work-description-cell > input { width:100%; min-width:0; }
.quick-catalog-add {
  display:none;
  justify-self:start;
  border:0;
  background:transparent;
  color:var(--theme-accent,#b22025);
  font:inherit;
  font-size:11px;
  font-weight:800;
  padding:1px 0;
  cursor:pointer;
}
.simple-work-line.has-content .quick-catalog-add { display:inline-flex; }
.quick-catalog-add.is-added { color:#0c675a; cursor:default; }
.quick-catalog-add:disabled { opacity:.72; }

.catalog-compact-list { display:grid; gap:7px; }
.catalog-compact-row {
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--panel,#fff);
  overflow:hidden;
}
.catalog-compact-row > summary {
  list-style:none;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto 18px;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  cursor:pointer;
}
.catalog-compact-row > summary::-webkit-details-marker { display:none; }
.catalog-compact-row > summary::after {
  content:'›';
  font-size:20px;
  line-height:1;
  color:var(--muted);
  transform:rotate(90deg);
  grid-column:3;
  grid-row:1;
  margin:0;
}
.catalog-compact-row[open] > summary::after { transform:rotate(-90deg); }
.catalog-compact-main { min-width:0; display:grid; gap:2px; }
.catalog-compact-main strong,
.catalog-compact-main span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.catalog-compact-main span { color:var(--muted); font-size:12px; }
.catalog-compact-details { display:flex; justify-content:space-between; gap:12px; align-items:center; padding:0 12px 11px; border-top:1px solid var(--line); padding-top:10px; }
.catalog-compact-row.is-retired { opacity:.68; }

.management-mobile-launcher { display:none; }
.mobile-scheduler-close { display:none; }

@media (max-width:760px) {
  .business-workspace .management-mobile-launcher { display:block; }
  .business-workspace .management-mobile-launcher.is-hidden { display:none; }
  .business-workspace .scheduler-page-head[data-mobile-launcher-mode="1"],
  .business-workspace .scheduler-grid[data-mobile-launcher-hidden="1"] { display:none; }
  .business-workspace .mobile-scheduler-close { display:inline-flex; }

  .management-mobile-launcher { padding:4px 0 18px; }
  .management-launcher-heading { padding:4px 2px 12px; }
  .management-launcher-heading h1 { margin:3px 0 4px; font-size:30px; }
  .management-launcher-heading p { margin:0; }
  .management-primary-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px; }
  .management-primary-tile {
    min-height:126px;
    border:1px solid var(--line);
    border-radius:16px;
    background:var(--panel,#fff);
    color:var(--navy);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:9px;
    padding:14px 8px;
    font:inherit;
    font-weight:800;
    cursor:pointer;
    box-shadow:0 4px 14px rgba(19,48,79,.04);
  }
  .management-primary-tile .management-tile-icon { width:34px; height:34px; }
  .management-primary-tile > span { font-size:16px; text-align:center; }
  .management-primary-tile > small { font-size:10px; color:var(--muted); font-weight:700; }
  .management-primary-tile.is-coming-soon { border-style:dashed; }
  .management-primary-tile.attention-yellow { color:#8a6100 !important; border-color:#e6c862 !important; background:#fff9dd !important; box-shadow:inset 0 0 0 2px rgba(242,169,0,.24), 0 4px 14px rgba(19,48,79,.04); }
  .management-primary-tile.attention-red { box-shadow:inset 0 0 0 2px rgba(198,40,40,.16); }

  .management-secondary-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
    padding-top:14px;
    border-top:1px solid var(--line);
  }
  .management-secondary-grid button {
    min-width:0;
    min-height:72px;
    border:1px solid var(--line);
    border-radius:12px;
    background:var(--panel,#fff);
    color:var(--theme-accent,#9f1d24);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:8px 4px;
    font:inherit;
    font-weight:800;
    cursor:pointer;
  }
  .management-secondary-grid .ui-icon { width:22px; height:22px; }
  .management-secondary-grid span { font-size:12px; }

  .catalog-compact-row > summary::after { display:none; }
  .catalog-compact-details { align-items:flex-start; flex-direction:column; }
  .catalog-compact-details .job-meta { width:100%; }
}

/* v0.1.119 — tablet/iPad management launcher refinement.
   Phone portrait remains the supported phone management layout. Wide-but-short
   phone landscape is intentionally NOT promoted into the tablet launcher. */
@media (min-width:761px) and (max-width:1180px) and (min-height:600px) {
  .business-workspace .management-mobile-launcher { display:block; }
  .business-workspace .management-mobile-launcher.is-hidden { display:none; }
  .business-workspace .scheduler-page-head[data-mobile-launcher-mode="1"],
  .business-workspace .scheduler-grid[data-mobile-launcher-hidden="1"] { display:none; }
  .business-workspace .mobile-scheduler-close { display:inline-flex; }

  .management-mobile-launcher {
    position:relative;
    padding:6px 82px 22px 0;
    min-height:calc(100vh - 92px);
  }
  .management-launcher-heading { padding:4px 4px 14px; }
  .management-launcher-heading h1 { margin:3px 0 4px; font-size:32px; }
  .management-launcher-heading p { margin:0; }

  /* Tablet/iPad portrait: same calm two-across launcher language as phone. */
  .management-primary-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
    align-content:start;
  }
  .management-primary-tile {
    min-height:132px;
    border:1px solid var(--line);
    border-radius:16px;
    background:var(--panel,#fff);
    color:var(--navy);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:9px;
    padding:16px 10px;
    font:inherit;
    font-weight:800;
    cursor:pointer;
    box-shadow:0 4px 14px rgba(19,48,79,.04);
  }
  .management-primary-tile .management-tile-icon { width:36px; height:36px; }
  .management-primary-tile > span { font-size:16px; text-align:center; }
  .management-primary-tile > small { font-size:10px; color:var(--muted); font-weight:700; }
  .management-primary-tile.is-coming-soon { border-style:dashed; }
  .management-primary-tile.attention-yellow { color:#8a6100 !important; border-color:#e6c862 !important; background:#fff9dd !important; box-shadow:inset 0 0 0 2px rgba(242,169,0,.24), 0 4px 14px rgba(19,48,79,.04); }
  .management-primary-tile.attention-red { box-shadow:inset 0 0 0 2px rgba(198,40,40,.16); }

  /* The smaller management destinations stay anchored beneath the header on
     the physical right edge in either tablet orientation. */
  .management-secondary-grid {
    position:fixed;
    z-index:32;
    top:calc(84px + env(safe-area-inset-top));
    right:max(6px, env(safe-area-inset-right));
    width:68px;
    display:grid;
    grid-template-columns:1fr;
    gap:7px;
    margin:0;
    padding:0;
    border:0;
    max-height:calc(100vh - 98px - env(safe-area-inset-top));
    overflow-y:auto;
    overscroll-behavior:contain;
  }
  .management-secondary-grid button {
    min-width:0;
    min-height:58px;
    border:1px solid var(--line);
    border-radius:12px;
    background:var(--panel,#fff);
    color:var(--theme-accent,#9f1d24);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:4px;
    padding:6px 3px;
    font:inherit;
    font-weight:800;
    cursor:pointer;
    box-shadow:0 3px 10px rgba(19,48,79,.06);
  }
  .management-secondary-grid .ui-icon { width:21px; height:21px; }
  .management-secondary-grid span { font-size:11px; }
}

/* Tablet/iPad landscape: use the width deliberately — two centered rows of
   five primary workspaces while the right-side management rail stays anchored. */
@media (min-width:761px) and (max-width:1180px) and (min-height:600px) and (orientation:landscape) {
  .management-mobile-launcher { padding-right:84px; }
  .management-primary-grid {
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:12px;
    max-width:1040px;
    margin:0 auto;
  }
  .management-primary-tile {
    min-height:138px;
    padding:14px 8px;
  }
}

/* v0.1.120 Proposal e-signature capture */
.signature-modal{max-width:820px}
.signature-rotate-hint{margin:.5rem 0 1rem;padding:.7rem .85rem;border:1px solid var(--border);border-radius:12px;background:var(--surface-soft);font-size:.92rem}
.signature-pad-wrap{position:relative;margin:1rem 0;border:2px solid var(--border-strong,#9ca3af);border-radius:14px;background:#fff;overflow:hidden}
.signature-pad{display:block;width:100%;height:260px;background:#fff;cursor:crosshair}
.signature-pad-label{position:absolute;left:14px;bottom:10px;color:#9ca3af;font-size:.78rem;pointer-events:none}
.doc-signature{margin-top:28px;padding-top:18px;border-top:1px solid #cbd5e1;break-inside:avoid}
.doc-signature-image{width:min(420px,100%);height:120px;margin:10px 0;border-bottom:1px solid #64748b;display:flex;align-items:flex-end}
.doc-signature-image img{max-width:100%;max-height:110px;object-fit:contain}
@media (max-width: 700px){.signature-modal{width:min(96vw,820px);max-height:94vh;overflow:auto}.signature-pad{height:220px}}
@media (max-height: 500px) and (orientation: landscape){.signature-modal{max-height:96vh;overflow:auto}.signature-pad{height:180px}.signature-modal .page-head{margin-bottom:.35rem}.signature-rotate-hint{margin:.25rem 0 .5rem;padding:.45rem .65rem}}

/* v0.1.124 — close-in-place receipt/document viewing and purchase-request phone cleanup */
.technician-requests-modal{max-height:90vh;overflow:auto;overscroll-behavior:contain}
.attachment-document-modal{width:min(980px,96vw);height:min(92vh,980px);max-width:980px;display:flex;flex-direction:column;overflow:hidden}
.attachment-document-stage{flex:1;min-height:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
.attachment-document-frame{display:block;width:100%;height:100%;border:0;background:#fff}
@media(max-width:640px){
  .technician-requests-modal{width:100%;max-width:100%;max-height:100vh;height:100vh;border-radius:0;padding:18px}
  .technician-requests-modal .reimbursement-actions{display:grid;grid-template-columns:1fr;justify-content:stretch}
  .technician-requests-modal .reimbursement-actions .btn{width:100%;min-width:0;white-space:normal}
  .attachment-document-modal{width:100%;height:100vh;max-height:100vh;border-radius:0;padding:14px}
  .attachment-document-modal .page-head{flex:0 0 auto}
}

/* v0.1.131 — compact split Catalog management. */
.catalog-add-actions { align-items:flex-start; gap:10px; flex-wrap:wrap; }
.catalog-add-entry { display:inline-block; }
.catalog-add-entry[open] { display:block; width:100%; }
.catalog-lane { border:1px solid var(--line); border-radius:14px; padding:0 12px; margin-top:10px; background:rgba(255,255,255,.34); }
.catalog-lane > summary { cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 0; }
.catalog-lane > .catalog-compact-list { padding:0 0 12px; }