:root {
  --navy: #15202d;
  --navy-raised: #1c2a3a;
  --burgundy: #552631;
  --burgundy-hover: #6c3341;
  --ink: #202b38;
  --muted: #5e6977;
  --line: #dfe3e8;
  --line-strong: #b3bdc8;
  --paper: #f5f6f8;
  --white: #fff;
  --danger: #a32c38;
  --success: #246746;
  --warning: #80561d;
  --radius: 12px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 15px;
  line-height: 1.5;
  color: var(--ink);
  background: var(--paper);
  color-scheme: light;
}
* { box-sizing: border-box; }
body { margin: 0; }
[hidden] { display: none !important; }
a { color: var(--burgundy); text-decoration: none; text-underline-offset: 4px; }
a:hover { text-decoration: underline; }
button, input, select, textarea { font: inherit; }
button, input[type="submit"] { cursor: pointer; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button:disabled, input:disabled { opacity: .55; cursor: not-allowed; }
:focus-visible { outline: 3px solid #8c4b60; outline-offset: 3px; }
:where(button, a, input, select, textarea) { transition: background-color 160ms ease-out, border-color 160ms ease-out, color 160ms ease-out; }
::selection { background: #e7cdd5; color: var(--navy); }
input, textarea { caret-color: var(--burgundy); }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { color: var(--navy); text-wrap: balance; }
h1 { margin-bottom: 8px; font-size: 2rem; line-height: 1.2; font-weight: 650; letter-spacing: -.03em; }
h2 { margin-bottom: 0; font-size: 1.15rem; line-height: 1.35; font-weight: 650; letter-spacing: -.015em; }
h3 { margin-bottom: 8px; font-size: 1.1rem; line-height: 1.35; letter-spacing: -.015em; }
small { display: block; font-size: .8rem; color: var(--muted); }
strong { font-weight: 600; }
p { max-width: 72ch; }
.ui-icon { width: 20px; height: 20px; flex-shrink: 0; vertical-align: middle; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: -80px; left: 16px; background: white; padding: 12px 20px; z-index: 100; border-radius: 6px; }
.skip-link:focus { top: 12px; }
.brand { display: inline-flex; align-items: center; flex-shrink: 0; }
.brand img { display: block; max-width: 100%; height: auto; }
.sidebar { position: fixed; inset: 0 auto 0 0; width: 236px; padding: 32px 20px 18px; display: flex; flex-direction: column; background: var(--navy); color: #e8edf3; z-index: 10; overflow-y: auto; }
.sidebar > .brand { margin: 0 12px 42px; }
.workspace-identity { display: flex; gap: 10px; align-items: center; margin: 0 8px 28px; min-width: 0; }
.workspace-identity small { color: #b0becf; font-size: .7rem; margin-bottom: 4px; }
.workspace-identity strong { display: block; font-size: .8rem; line-height: 1.5; overflow-wrap: anywhere; }
.company-mark { display: grid; place-items: center; width: 36px; height: 40px; background: var(--navy-raised); border-radius: 6px; flex-shrink: 0; color: #c6d2e0; }
.sidebar nav { display: grid; gap: 5px; }
.sidebar nav a { display: flex; gap: 12px; align-items: center; min-height: 46px; padding: 10px 12px; border-radius: 6px; color: #b9c7d7; font-size: .875rem; }
.sidebar nav a:hover { background: var(--navy-raised); color: white; text-decoration: none; }
.sidebar nav a.active { background: #334356; color: white; font-weight: 600; }
.operator-shortcut { display: flex; align-items: center; gap: 10px; color: #d4dfe9; padding: 18px 10px; margin-top: 22px; border-top: 1px solid #364251; font-size: .8rem; }
.operator-shortcut .ui-icon:last-child { margin-left: auto; width: 16px; }
.operator-shortcut:hover { color: white; }
.sidebar-bottom { margin-top: auto; padding-top: 38px; }
.profile { display: flex; align-items: center; gap: 10px; padding: 18px 6px 10px; border-top: 1px solid #364251; }
.profile strong { font-size: .8rem; }
.profile small { color: #adbdcf; font-size: .7rem; margin-top: 2px; }
.avatar { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #354557; color: #edf2f7; font-size: .7rem; flex-shrink: 0; }
.sign-out { display: flex; align-items: center; gap: 10px; padding: 10px 8px; min-height: 44px; background: none; border: 0; color: #b9c7d7; font-size: .8rem; }
.sign-out:hover { color: white; }
.sign-out .ui-icon { width: 17px; }
.tenant-switch { padding: 0 6px 16px; font-size: .8rem; }
.tenant-switch summary { color: #e3ebf4; }
.tenant-switch .link-button { color: #d4dfe9; text-align: left; }
.workspace-content { margin-left: 236px; min-height: 100vh; display: flex; flex-direction: column; }
.topbar { min-height: 72px; padding: 16px 36px; display: flex; align-items: center; justify-content: space-between; gap: 16px; background: white; border-bottom: 1px solid var(--line); font-size: .8rem; color: var(--muted); }
.topbar > span:first-child { min-width: 0; overflow-wrap: anywhere; }
.topbar strong { color: #354456; font-weight: 500; }
.slash { margin: 0 12px; color: #8d98a5; }
.pilot-tag { font-size: .7rem; padding: 4px 9px; border: 1px solid var(--line); border-radius: 4px; color: var(--muted); }
.main { width: 100%; max-width: 1680px; margin: 0 auto; padding: 0 36px 32px; }
.page-heading { display: flex; justify-content: space-between; align-items: center; gap: 24px; margin: 36px 0 28px; }
.page-heading > div { min-width: 0; }
.page-heading h1 { overflow-wrap: anywhere; }
.page-heading p, .lede { margin-bottom: 0; color: var(--muted); font-size: .9rem; line-height: 1.6; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 10px 17px; border: 1px solid var(--burgundy); border-radius: 6px; background: var(--burgundy); color: white; font-size: .85rem; font-weight: 600; text-decoration: none; text-align: center; }
.button .ui-icon { width: 17px; height: 17px; }
.button:hover { background: var(--burgundy-hover); color: white; text-decoration: none; }
.button:active { background: #42202a; }
.button.secondary { background: white; color: var(--ink); border-color: var(--line-strong); }
.button.secondary:hover { background: #edf0f3; border-color: #8996a5; }
.button.full { width: 100%; }
.text-button, .link-button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 44px; padding: 6px 4px; border: 0; background: transparent; color: var(--burgundy); font-size: .8rem; font-weight: 550; }
.text-button:hover, .link-button:hover { text-decoration: underline; text-underline-offset: 4px; }
.stats-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); padding: 22px 0; border-block: 1px solid var(--line); margin-bottom: 6px; }
.stat { padding: 0 24px; border-right: 1px solid var(--line); }
.stat:first-child { padding-left: 0; }
.stat:last-child { border: 0; }
.stat > span { display: block; font-size: .8rem; color: #475668; }
.stat > strong { font-size: 1.8rem; font-weight: 600; line-height: 1.2; display: block; margin: 9px 0 5px; font-variant-numeric: tabular-nums; }
.stat small { font-size: .72rem; }
.stat.attention > strong { color: var(--burgundy); }
.overview-grid { display: grid; grid-template-columns: minmax(0, 1fr) 258px; gap: 28px; align-items: start; }
.overview-grid > * { min-width: 0; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin: 28px 0 16px; }
.section-heading .muted { margin: 4px 0 0; }
.section-heading > a { font-size: .8rem; min-height: 44px; display: inline-flex; align-items: center; }
.count { display: inline-grid; place-items: center; margin-left: 6px; padding: 1px 7px; background: #e6eaf0; color: #4c5a6b; font-size: .75rem; border-radius: 5px; vertical-align: middle; font-variant-numeric: tabular-nums; }
.project-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.project-list { display: grid; gap: 14px; }
.project-card { display: block; padding: 20px; color: var(--ink); background: white; border: 1px solid var(--line); border-radius: var(--radius); }
.project-card:hover { border-color: #8896a6; text-decoration: none; }
.project-card h3 { font-size: 1rem; overflow-wrap: anywhere; }
.project-card p { font-size: .8rem; margin-bottom: 0; color: var(--muted); }
.card-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 10px 0 12px; color: #65758a; }
.card-top > .ui-icon { width: 17px; }
.project-type { display: flex; gap: 7px; align-items: center; font-size: .75rem; }
.project-type .ui-icon { width: 17px; height: 17px; }
.card-bottom { display: flex; justify-content: space-between; gap: 12px; border-top: 1px solid var(--line); padding-top: 14px; margin-top: 22px; font-size: .72rem; color: #536174; }
.card-bottom span:last-child { color: var(--burgundy); }
.panel { background: white; border: 1px solid var(--line); border-radius: var(--radius); }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; text-align: left; }
th { padding: 14px 18px; font-size: .7rem; color: #5b6878; font-weight: 600; background: #eef1f5; white-space: nowrap; }
td { border-top: 1px solid var(--line); padding: 16px 18px; font-size: .8rem; vertical-align: middle; }
tbody tr:hover { background: #fafbfc; }
td small { font-size: .72rem; margin-top: 4px; }
td strong { display: block; }
td a:not(.row-action) { display: inline-flex; align-items: center; min-height: 44px; }
.tabular, time { font-variant-numeric: tabular-nums; }
.activity-table th { padding: 13px 14px; }
.activity-table td { padding: 13px 14px; }
.activity-table td:first-child { min-width: 190px; }
.activity-table td:nth-child(3) { white-space: nowrap; }
.row-action { display: grid; place-items: center; min-width: 44px; min-height: 44px; border-radius: 6px; }
.row-action:hover { background: #efe7e9; }
.table-note { font-size: .72rem; color: var(--muted); margin: 12px 0; }
.empty-cell { padding: 44px 24px; color: var(--muted); text-align: center; }
.badge { display: inline-flex; align-items: center; min-height: 26px; padding: 3px 8px; border-radius: 4px; font-size: .7rem; line-height: 1.4; color: #4f5c6d; background: #eef1f5; white-space: nowrap; }
.badge-completed, .badge-approved, .badge-ready, .badge-resolved, .badge-active { color: #246044; background: #e9f2ec; }
.badge-due, .badge-pending, .badge-processing { color: #72501f; background: #fbf0d9; }
.badge-late, .badge-awaiting_evidence, .badge-correction_requested, .badge-missed, .badge-failed, .badge-critical, .badge-high { color: #7b2d3f; background: #f6e7eb; }
.page-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: auto 36px 0; padding: 24px 0; border-top: 1px solid var(--line); color: var(--muted); font-size: .73rem; }
.page-footer img { height: auto; opacity: .65; }
.muted { color: var(--muted); font-size: .85rem; }
.flash { margin: 20px 0; padding: 14px 18px; border: 1px solid #b9d4c3; border-radius: 8px; background: #edf5ef; color: #24563b; font-size: .85rem; overflow-wrap: anywhere; }
.flash.alert { border-color: #deb9c2; background: #f9edf0; color: #7a3043; }
.form-panel { max-width: 920px; padding: 28px; }
.form-panel h2 { margin: 30px 0 18px; }
.form-panel h2:first-child { margin-top: 0; }
.form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; }
.span-2 { grid-column: span 2; }
label { display: block; margin-bottom: 8px; color: #39485a; font-size: .85rem; font-weight: 550; }
input:not([type=checkbox]):not([type=submit]):not([type=hidden]), select, textarea { display: block; width: 100%; min-height: 46px; padding: 11px 12px; border: 1px solid #aeb9c5; border-radius: 6px; color: var(--ink); background: white; font-size: .95rem; }
input::placeholder, textarea::placeholder { color: #667382; opacity: 1; }
textarea { resize: vertical; }
input[type=checkbox] { width: 18px; height: 18px; accent-color: var(--burgundy); flex-shrink: 0; }
.form-stack { display: grid; gap: 22px; }
.form-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.check-row { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 10px 0; margin: 0; }
.hint, .fineprint { color: var(--muted); font-size: .8rem; line-height: 1.6; margin: 8px 0; }
.project-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 22px; color: var(--muted); font-size: .875rem; }
.project-toolbar > div { display: flex; gap: 10px; flex-shrink: 0; }
.phase-strip { display: flex; flex-wrap: wrap; gap: 18px; padding: 20px 0; margin-top: 24px; border-block: 1px solid var(--line); }
.phase-strip span { display: flex; align-items: center; gap: 8px; font-size: .8rem; color: #485a6e; }
.phase-strip b { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #e5eaf0; color: #35485d; font-size: .7rem; }
.empty-state { padding: 40px 24px; text-align: center; border: 1px dashed #adb8c5; border-radius: var(--radius); margin: 24px 0; color: var(--muted); background: white; }
.empty-state h1, .empty-state h2 { margin-bottom: 12px; }
.empty-state p { margin-inline: auto; }
.empty-state .button { margin-top: 16px; }
.empty-state.compact { padding: 24px; }
.list-row { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 22px; border-bottom: 1px solid var(--line); }
.list-row:last-child { border-bottom: 0; }
.danger { color: var(--danger); }
.details-panel { padding: 20px 24px; margin-top: 20px; }
summary { min-height: 28px; cursor: pointer; font-weight: 550; color: var(--burgundy); }
details[open] > summary { margin-bottom: 18px; }
.checklist-row { display: grid; grid-template-columns: 2fr 1fr 1fr 44px; gap: 10px; margin: 12px 0; align-items: center; }
.checklist-options { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items: start; padding: 2px 0 10px; }
.checklist-options label { margin: 0; }
.checklist-options label > span { display: block; font-size: .8rem; margin-bottom: 6px; }
.checklist-options small { margin-top: 6px; }
.credentials dt { font-size: .8rem; color: var(--muted); }
.credentials dd { margin: 6px 0 24px; font-size: 1.1rem; overflow-wrap: anywhere; }
.evidence-card { padding: 24px; margin-bottom: 22px; }
.evidence-card > .section-heading { margin-top: 0; }
.evidence-meta { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; padding: 18px; margin-bottom: 20px; background: var(--paper); border-radius: 6px; }
.evidence-meta strong { display: block; margin-top: 5px; font-size: .8rem; }
.evidence-meta small { font-size: .7rem; }
.photo-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(200px,1fr)); gap: 16px; margin: 20px 0; }
.photo-grid figure { margin: 0; }
.photo-grid img { width: 100%; max-height: 350px; object-fit: contain; background: #e9edf2; border-radius: 6px; }
.photo-grid figcaption { padding: 10px 0; color: var(--muted); font-size: .75rem; }
.review-box { border-top: 1px solid var(--line); padding-top: 22px; margin-top: 20px; }
.back-link { display: inline-flex; align-items: center; min-height: 44px; margin-top: 20px; font-size: .85rem; }
.incident-list { display: grid; gap: 0; }
.incident-summary { display: block; padding: 18px 0; border-top: 1px solid var(--line); }
.incident-summary strong { display: block; color: var(--ink); margin: 10px 0 4px; font-size: .875rem; }
.incident-video { width: 100%; max-height: 360px; background: var(--navy); border-radius: var(--radius); margin: 16px 0; }
/* Authentication */
.authentication { min-height: 100vh; display: grid; grid-template-columns: minmax(380px, 1fr) minmax(420px, 1fr); background: white; }
.auth-brand-panel { display: flex; flex-direction: column; align-items: flex-start; padding: 50px 56px 32px; background: var(--navy); color: #dce5ef; }
.auth-brand-panel > img { height: auto; }
.auth-introduction { margin: auto 0; padding: 64px 0; }
.auth-introduction h2 { font-size: 2.7rem; line-height: 1.15; letter-spacing: -.03em; font-weight: 550; color: white; margin-bottom: 20px; }
.auth-introduction > p { color: #b9c7d7; line-height: 1.75; font-size: .95rem; }
.auth-flow { list-style: none; padding: 0; margin: 40px 0 0; display: grid; gap: 24px; }
.auth-flow li { display: flex; gap: 20px; align-items: flex-start; }
.auth-flow li > span { color: #a5b6cb; font-variant-numeric: tabular-nums; font-size: .85rem; padding-top: 2px; }
.auth-flow strong { color: #edf2f7; font-size: .9rem; }
.auth-flow p { color: #b9c7d7; font-size: .8rem; margin: 5px 0 0; }
.auth-brand-footer { color: #b9c7d7; font-size: .75rem; margin: 0; }
.auth-shell { width: min(420px, calc(100% - 64px)); margin: auto; padding: 64px 0; }
.auth-shell-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 52px; }
.auth-shell .lede { margin-bottom: 30px; }
.auth-shell h1 { font-size: 1.85rem; }
.auth-help { display: inline-flex; min-height: 44px; align-items: center; margin-top: 14px; font-size: .85rem; }
.auth-shell .fineprint { margin: 28px 0 0; padding-top: 20px; border-top: 1px solid var(--line); }
/* Operator: one area at a time. */
.operator-body { background: var(--paper); }
.operator-topbar { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px max(24px, calc((100vw - 740px) / 2)); background: var(--navy); }
.operator-project-link { color: #e2eaf3; display: inline-flex; gap: 8px; align-items: center; min-height: 44px; font-size: .8rem; }
.operator-project-link .ui-icon { width: 16px; }
.operator-shell { max-width: 740px; margin: 0 auto; padding: 0 24px 60px; }
.operator-welcome { margin: 28px 0 18px; }
.operator-welcome h1 { font-size: 1.7rem; }
.operator-welcome p { margin-bottom: 0; }
.connection-row { display: flex; align-items: center; gap: 8px; color: #2b6248; font-size: .8rem; }
.live-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex-shrink: 0; }
.connection-row.offline { color: #7b4e17; }
.operator-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin: 10px 0 8px; }
.progress-label { font-size: .72rem; color: var(--muted); }
.operator-toolbar .text-button { text-align: right; flex-shrink: 0; font-size: .75rem; }
.operator-tabs { display: flex; border-bottom: 1px solid #c3cbd5; margin: 0 0 24px; gap: 22px; }
.operator-tabs button { border: 0; border-bottom: 2px solid transparent; background: transparent; min-height: 48px; padding: 12px 2px; color: var(--muted); font-size: .85rem; }
.operator-tabs button.active { color: var(--burgundy); border-bottom-color: var(--burgundy); font-weight: 650; }
.assignment-filters { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 14px; margin: 0 0 20px; }
.assignment-filters label { font-size: .8rem; margin-bottom: 6px; }
.assignment-filters select { font-size: .875rem; }
.assignment-summary { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin: 20px 0 12px; color: var(--muted); font-size: .8rem; }
.operator-check { padding: 19px 20px; margin: 12px 0; background: white; border: 1px solid var(--line); border-radius: var(--radius); }
.operator-check h2 { font-size: 1.1rem; margin: 0 0 10px; }
.operator-check .check-top { margin-bottom: 10px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.check-project { color: #5a6878; font-size: .75rem; min-width: 0; overflow-wrap: anywhere; }
.operator-check p { font-size: .8rem; color: var(--muted); margin-bottom: 10px; }
.check-window { display: flex; align-items: flex-start; gap: 8px; margin: 14px 0; color: #536174; font-size: .8rem; }
.check-window .ui-icon { width: 16px; height: 16px; margin-top: 2px; }
.check-window small { margin-top: 2px; font-size: .72rem; }
.check-action-row { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin-top: 16px; }
.check-action-row > span { font-size: .75rem; color: var(--muted); }
.capture-heading { margin-top: 12px; }
.capture-heading h1 { margin-bottom: 6px; }
.capture-context { color: var(--muted); font-size: .8rem; margin-bottom: 12px; }
.capture-steps { display: flex; align-items: center; gap: 12px; padding: 18px 0; margin-bottom: 12px; border-block: 1px solid var(--line); font-size: .8rem; color: #57677a; }
.capture-steps span { display: flex; align-items: center; gap: 7px; }
.capture-steps b { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: var(--navy); color: white; font-size: .75rem; }
.capture-steps .step-done b { background: var(--success); }
.capture-steps .step-rule { flex: 1; height: 1px; background: #c6ced8; }
.capture-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 22px 0 14px; }
.capture-section-heading > span { color: var(--muted); font-size: .8rem; }
.camera-stage { display: grid; place-items: center; min-height: 180px; background: #e7ebf0; border: 1px dashed #8f9dae; border-radius: var(--radius); color: #4b5d73; text-align: center; overflow: hidden; }
.camera-placeholder { padding: 24px; }
.camera-placeholder .ui-icon { width: 32px; height: 32px; margin-bottom: 10px; }
.camera-placeholder p { font-size: .8rem; margin-bottom: 0; }
.camera-screen { display: block; width: 100%; max-height: 480px; aspect-ratio: 4/3; background: var(--navy); object-fit: contain; }
.camera-stage:has(video:not([hidden])) { border: 0; background: var(--navy); }
.camera-stage:has(video:not([hidden])) .camera-placeholder { display: none; }
.capture-toolbar { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 14px 0; }
.capture-toolbar .button { min-height: 48px; }
.capture-photos { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; margin: 20px 0; }
.capture-photos img { width: 100%; border-radius: 6px; background: #e7ebf0; display: block; }
.capture-photos figure { margin: 0; }
.capture-photos figcaption { font-size: .75rem; color: var(--muted); margin-top: 7px; }
.capture-photos button { min-height: 44px; background: transparent; border: 0; padding: 6px 0; color: var(--danger); font-size: .8rem; }
.operator-form { margin-top: 28px; padding-top: 26px; border-top: 1px solid #cbd3de; }
.operator-form h2 { margin-bottom: 22px; }
.operator-form label { margin-top: 20px; }
.operator-form .form-actions { position: static; background: var(--paper); padding: 12px 0 calc(12px + env(safe-area-inset-bottom)); z-index: 2; }
.operator-form .form-actions .button { min-height: 50px; }
.saved-label { color: #46596e; font-size: .8rem; margin: 22px 0 0; }
.queue-card { background: white; border: 1px solid var(--line); border-radius: var(--radius); padding: 20px; margin: 16px 0; }
.queue-card > p { color: var(--muted); font-size: .8rem; }
.queue-actions { display: flex; align-items: center; gap: 12px; margin-top: 14px; flex-wrap: wrap; }
.loading-state { padding: 20px 0; font-size: .85rem; color: var(--muted); }
/* Loading bars: the width marks the stage that has been reached, the shimmer shows the stage is still running. */
.load-progress { height: 6px; border-radius: 999px; background: #dfe4eb; overflow: hidden; margin-bottom: 12px; }
.load-progress span { position: relative; display: block; height: 100%; width: 0; background: var(--burgundy); border-radius: inherit; transition: width .35s ease-out; }
.load-progress span::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(255,255,255,.5), transparent); animation: load-shimmer 1.3s linear infinite; }
.load-progress.is-done span::after { animation: none; }
.load-progress-dark { background: rgba(255,255,255,.22); }
.load-progress-dark span { background: #fff; }
.camera-progress { padding: 0 8px; }
.camera-progress .load-progress { margin-bottom: 0; }
@keyframes load-shimmer { from { transform: translateX(-100%); } to { transform: translateX(100%); } }
@media (prefers-reduced-motion: reduce) { .load-progress span::after { animation: none; } }
/* Location picker */
.location-map { position: relative; z-index: 0; height: 340px; margin: 14px 0 4px; border: 1px solid var(--line-strong); border-radius: var(--radius); overflow: hidden; background: #e7ebf0; }
.location-map .leaflet-container { font: inherit; }
.map-pin { width: 22px; height: 22px; border-radius: 50%; background: var(--burgundy); border: 3px solid #fff; box-shadow: 0 1px 6px rgba(0,0,0,.45); cursor: grab; }
/* Reports */
.report-filters { display: flex; gap: 16px; align-items: flex-end; padding: 18px 0 24px; flex-wrap: wrap; }
.report-filters > div { flex: 1; min-width: 160px; }
.report-filters label { font-size: .8rem; }
.report-filter-search { flex: 2 1 240px; }
.report-filter-actions { display: flex; align-items: center; gap: 14px; flex: 0 0 auto; }
.report-workspace { display: grid; grid-template-columns: minmax(340px,.9fr) minmax(320px,1.1fr); gap: 24px; align-items: start; }
.report-list { border-top: 1px solid #c8d0da; }
.report-entry { display: block; padding: 20px; border-bottom: 1px solid var(--line); color: var(--ink); background: white; }
.report-entry:hover { background: #eef1f5; text-decoration: none; }
.report-entry.selected { background: #e8edf3; outline: 1px solid #8a99ac; outline-offset: -1px; }
.report-entry-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.report-entry strong { font-size: .9rem; }
.report-entry p { margin: 8px 0 0; font-size: .8rem; color: var(--muted); }
.report-preview { background: #e9edf2; padding: 20px; border-radius: var(--radius); min-width: 0; }
.report-preview-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.report-preview-heading h2 { font-size: .95rem; }
.report-preview iframe { display: block; width: 100%; height: 640px; border: 0; background: white; }
.report-preview .empty-state { margin: 0; min-height: 420px; display: grid; align-content: center; }
.report-preview .empty-state .ui-icon { width: 36px; height: 36px; margin: 0 auto 18px; }
@media (min-width: 1500px) { .overview-grid { grid-template-columns: minmax(0,1fr) 300px; } }
@media (max-width: 1220px) {
  .sidebar { width: 214px; padding-inline: 16px; }
  .workspace-content { margin-left: 214px; }
  .main { padding-inline: 26px; }
  .topbar { padding-inline: 26px; }
  .overview-grid { grid-template-columns: minmax(0,1fr); }
  .project-list { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .project-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .report-workspace { grid-template-columns: minmax(0,1fr); }
  .auth-brand-panel { padding-inline: 36px; }
}
@media (max-width: 760px) {
  :root { font-size: 15px; }
  .sidebar { position: static; width: 100%; padding: 18px 20px 12px; display: grid; grid-template-columns: 1fr auto; overflow: visible; }
  .sidebar > .brand { margin: 0; width: 132px; }
  .workspace-identity { display: none; }
  .sidebar nav { grid-column: 1 / -1; display: flex; gap: 5px; overflow-x: auto; margin-top: 16px; padding-bottom: 2px; }
  .sidebar nav a { min-height: 44px; white-space: nowrap; gap: 7px; padding: 9px 11px; font-size: .78rem; }
  .sidebar nav .ui-icon { width: 16px; height: 16px; }
  .operator-shortcut { grid-row: 1; grid-column: 2; margin: 0; padding: 0; border: 0; min-height: 44px; font-size: .75rem; }
  .operator-shortcut > .ui-icon:first-child { display: none; }
  .sidebar-bottom { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 6px 0 0; margin-top: 0; }
  .profile { padding: 0; border: 0; }
  .profile .avatar, .profile small { display: none; }
  .profile strong { font-size: .7rem; color: #b9c7d7; }
  .sidebar-bottom > form { margin-left: auto; }
  .sign-out { font-size: .75rem; padding: 6px 0; }
  .sign-out .ui-icon { width: 15px; }
  .tenant-switch { padding: 0; font-size: .75rem; }
  .workspace-content { margin-left: 0; min-height: calc(100vh - 168px); }
  .main { padding: 0 20px 28px; }
  .topbar { min-height: 54px; padding: 12px 20px; font-size: .75rem; }
  .slash { margin-inline: 7px; }
  .page-heading { margin: 26px 0 22px; gap: 18px; align-items: flex-start; flex-wrap: wrap; }
  h1 { font-size: 1.65rem; }
  .page-heading p { font-size: .85rem; }
  .page-heading .button { min-height: 44px; font-size: .8rem; }
  .stats-strip { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px 0; padding-block: 20px; }
  .stat { padding: 0 16px; }
  .stat:nth-child(odd) { padding-left: 0; }
  .stat:nth-child(even) { border: 0; }
  .stat > strong { font-size: 1.7rem; }
  .stat small { font-size: .7rem; }
  .project-list, .project-grid { grid-template-columns: minmax(0,1fr); }
  .section-heading { margin-top: 26px; }
  .overview-grid { gap: 8px; }
  .activity-table th:nth-child(2), .activity-table td:nth-child(2) { display: none; }
  .activity-table th:nth-child(3), .activity-table td:nth-child(3) { display: none; }
  .activity-table th:last-child, .activity-table td:last-child { display: none; }
  .activity-table td:first-child { min-width: 0; }
  .activity-table td { padding: 16px 12px; }
  .activity-table td:first-child strong { font-size: .8rem; }
  .activity-table .badge { white-space: normal; font-size: .68rem; }
  .activity-table td:first-child small { overflow-wrap: anywhere; }
  .mobile-evidence-link { display: inline-flex; }
  .form-panel { padding: 22px 18px; }
  .form-grid { grid-template-columns: minmax(0,1fr); }
  .span-2 { grid-column: auto; }
  .project-toolbar { flex-direction: column; align-items: flex-start; }
  .project-toolbar > div { flex-wrap: wrap; flex-shrink: 1; }
  .evidence-meta { grid-template-columns: repeat(2,minmax(0,1fr)); padding: 14px; }
  .evidence-card { padding: 18px; }
  .checklist-row { grid-template-columns: 1fr 1fr; }
  .checklist-options { grid-template-columns: 1fr; }
  .checklist-row > input:not([type=hidden]) { grid-column: span 2; }
  .list-row { padding: 16px; flex-wrap: wrap; }
  .photo-grid { grid-template-columns: minmax(0,1fr); }
  .page-footer { margin-inline: 20px; padding: 22px 0; }
  .authentication { display: block; min-height: 100vh; padding-top: 6px; background: white; border-top: 6px solid var(--navy); }
  .auth-brand-panel { display: none; }
  .auth-shell { width: min(420px,calc(100% - 48px)); padding: 52px 0; }
  .auth-shell > .brand { margin-bottom: 46px; width: 168px; }
  .auth-shell h1 { font-size: 1.8rem; }
  input:not([type=checkbox]):not([type=submit]):not([type=hidden]), select, textarea { font-size: 16px; }
  .operator-topbar { padding: 14px 20px; min-height: 72px; }
  .operator-shell { padding: 0 20px 40px; }
  .operator-welcome h1 { font-size: 1.6rem; }
  .operator-check { padding: 18px; }
  .operator-check .check-top { gap: 8px; align-items: flex-start; }
  .check-action-row .button { min-width: 140px; }
  .assignment-filters { gap: 12px; }
  .report-filters { gap: 12px; }
  .location-map { height: 280px; }
  .report-workspace { gap: 20px; }
  .report-preview { padding: 14px; }
  .report-preview iframe { height: 500px; }
  .report-preview-heading { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }
.area-link { color: var(--burgundy); min-height: 0 !important; text-decoration: underline; text-decoration-color: #bfabb1; }
.area-link:hover { color: var(--burgundy); }
.queue-thumbnails { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin-top: 16px; }
.queue-thumbnails img { width: 100%; aspect-ratio: 4/3; object-fit: contain; border-radius: 5px; background: #e6ebf0; }

.is-capturing .operator-toolbar, .is-capturing .operator-tabs { display: none; }
.is-capturing .connection-row { margin: 18px 0 10px; }
.report-mobile-summary { display: none; }
.sidebar :focus-visible, .operator-topbar :focus-visible { outline-color: #f0c9d4; }
@media (max-width: 760px) {
  .report-desktop-document { display: none; }
  .report-mobile-summary { display: block; background: white; padding: 20px; border-radius: 6px; }
  .report-area-summary { padding: 18px 0; border-top: 1px solid var(--line); }
  .report-area-summary > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
  .report-area-summary strong { font-size: .85rem; }
  .report-area-summary small { margin-top: 8px; }
  .report-area-summary p { font-size: .8rem; color: var(--muted); margin: 6px 0 0; }
}

/* Assignment choices */
.assignment-modes { display: grid; gap: 2px; margin: 8px 0 14px; border: 0; padding: 0; }
.assignment-modes legend, .operator-picker legend { font-size: .85rem; color: #39485a; font-weight: 550; padding: 0 6px 0 0; margin-bottom: 4px; }
.operator-picker { border: 1px solid var(--line); border-radius: 6px; padding: 8px 16px 10px; margin: 0; min-width: 0; }
.operator-picker legend { padding: 0 6px; }
.operator-picker:disabled { opacity: .55; }
.operator-picker .check-row { min-height: 40px; padding: 6px 0; }
.badge-open, .badge-shared { color: #2e4a6b; background: #e6eef7; }
.check-assignees { display: block; margin: -4px 0 12px; font-size: .78rem; color: #536174; }
.check-assignees small { margin-top: 6px; }
.heading-actions { margin-top: 0; flex-shrink: 0; }
.report-row { padding: 14px 0; margin-top: 8px; border-top: 1px solid var(--line); border-bottom: 0; font-size: .85rem; }
.report-row small { margin-top: 4px; }
.compact-actions { margin-top: 0; gap: 4px; }

/* Full-screen camera: live preview, shutter, strip of photos taken, and the current place. */
body.camera-open { overflow: hidden; }
.camera-launch { width: 100%; min-height: 56px; font-size: .95rem; margin: 4px 0 6px; }
.camera-overlay { position: fixed; inset: 0; z-index: 60; background: #000; color: #fff; }
.camera-live { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #000; }
.camera-top { position: absolute; top: 0; left: 0; right: 0; display: flex; align-items: flex-start; gap: 12px; padding: calc(10px + env(safe-area-inset-top)) 12px 18px; background: linear-gradient(rgba(0,0,0,.7), rgba(0,0,0,0)); }
.camera-title { flex: 1; min-width: 0; padding-top: 4px; }
.camera-title strong { display: block; font-size: .95rem; overflow-wrap: anywhere; }
.camera-title span { display: block; margin-top: 2px; font-size: .75rem; color: #d6dde6; overflow-wrap: anywhere; }
.camera-icon-button { width: 44px; height: 44px; flex-shrink: 0; border-radius: 50%; border: 0; padding: 0; background: rgba(255,255,255,.16); color: #fff; display: grid; place-items: center; }
.camera-icon-button.active { background: #f0c9d4; color: var(--navy); }
.camera-bottom { position: absolute; left: 0; right: 0; bottom: 0; display: grid; gap: 12px; padding: 24px 16px calc(16px + env(safe-area-inset-bottom)); background: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,.75) 35%); }
.camera-strip { display: flex; gap: 8px; overflow-x: auto; min-height: 56px; scrollbar-width: none; }
.camera-strip img, .camera-strip canvas { width: 74px; height: 56px; object-fit: cover; flex-shrink: 0; border-radius: 6px; background: var(--navy-raised); border: 1px solid rgba(255,255,255,.3); }
.camera-controls { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; }
.camera-count { font-size: .8rem; color: #e8edf3; font-variant-numeric: tabular-nums; }
.shutter { position: relative; width: 78px; height: 78px; justify-self: center; padding: 0; border-radius: 50%; border: 5px solid #fff; background: rgba(255,255,255,.18); }
.shutter::after { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: #fff; transition: transform 110ms ease-out; }
.shutter:active::after { transform: scale(.82); }
.shutter:disabled { opacity: .4; }
.shutter:focus-visible { outline-color: #f0c9d4; }
.camera-done { justify-self: end; min-height: 44px; background: rgba(255,255,255,.16); color: #fff; border-color: transparent; }
.camera-done:hover { background: rgba(255,255,255,.28); color: #fff; }
.camera-status { margin: 0; min-height: 1.3em; text-align: center; font-size: .8rem; color: #e8edf3; max-width: none; }
.camera-status.alert { color: #ffd0d8; }
.camera-flash { position: absolute; inset: 0; background: #fff; opacity: 0; pointer-events: none; }
.camera-flash.is-flashing { animation: camera-flash 150ms ease-out; }
@keyframes camera-flash { from { opacity: .9; } to { opacity: 0; } }
.camera-overlay :focus-visible { outline-color: #f0c9d4; }

/* Shared checks: one section per contributing operator */
.contribution-summary { font-size: .85rem; color: #39485a; margin: -6px 0 16px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.contribution { padding-top: 18px; margin-top: 18px; border-top: 1px solid var(--line); }
.contribution:first-of-type { padding-top: 0; margin-top: 0; border-top: 0; }
.contribution-heading { color: var(--burgundy); font-size: 1rem; margin-bottom: 14px; }

/* Series and rounds: filters, series details, and the preview of rounds a schedule will create */
.round-filters { padding-top: 0; }
.badge-open_now { color: #72501f; background: #fbf0d9; }
.badge-voided { color: #7b2d3f; background: #f6e7eb; }
.badge-archived { color: #4f5c6d; background: #e3e7ec; }
.detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 28px; margin: 0; }
.detail-grid dt { font-size: .7rem; font-weight: 600; color: #5b6878; text-transform: uppercase; letter-spacing: .03em; }
.detail-grid dd { margin: 6px 0 0; font-size: .875rem; line-height: 1.55; overflow-wrap: anywhere; }
.occurrence-list { margin: 0; padding: 0; list-style: none; border: 1px solid var(--line); border-radius: 6px; }
.occurrence-list li { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 12px 16px; border-top: 1px solid var(--line); font-size: .85rem; }
.occurrence-list li:first-child { border-top: 0; }
.occurrence-list li > span { display: flex; align-items: center; min-width: 0; overflow-wrap: anywhere; }
.occurrence-list time { color: #39485a; text-align: right; }
.preview-note { margin-top: 12px; }
@media (max-width: 760px) {
  .detail-grid { grid-template-columns: minmax(0, 1fr); }
  .occurrence-list li { flex-wrap: wrap; }
  .occurrence-list time { text-align: left; }
}

/* Profiles, people and teams */
.sidebar .profile { color: inherit; }
.sidebar a.profile:hover { text-decoration: none; }
.sidebar a.profile:hover strong { text-decoration: underline; text-underline-offset: 4px; }
.operator-links { display: flex; align-items: center; gap: 22px; }
.profile-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 28px; align-items: start; }
.profile-grid > * { min-width: 0; }
.profile-grid > div > .section-heading:first-child, .profile-grid > aside > .section-heading:first-child { margin-top: 0; }
.profile-grid .form-panel + .form-panel { margin-top: 20px; }
.badge-editable { color: #2e4a6b; background: #e6eef7; }
.list-row.sub-division { padding-left: 44px; }
.row-actions { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.inline-edit summary { display: inline-flex; align-items: center; min-height: 44px; font-size: .8rem; }
.inline-edit[open] > summary { margin-bottom: 8px; }
.inline-form { display: flex; align-items: center; gap: 8px; }
.inline-form input { min-width: 180px; }
@media (max-width: 1220px) { .profile-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 760px) { .list-row.sub-division { padding-left: 28px; } .row-actions { flex-wrap: wrap; } }

/* Language switch: sidebar, sign-in shell and operator top bar */
.locale-switch { display: inline-flex; border: 1px solid rgba(255,255,255,.28); border-radius: 6px; overflow: hidden; }
.locale-switch button { min-width: 44px; min-height: 36px; padding: 6px 10px; border: 0; background: transparent; color: #b9c7d7; font-size: .72rem; font-weight: 600; letter-spacing: .04em; cursor: pointer; }
.locale-switch button:hover { color: white; }
.locale-switch button.active { background: rgba(255,255,255,.16); color: white; }
.sidebar .locale-switch { margin: 0 6px 14px; }
.auth-shell .locale-switch { border-color: var(--line); }
.auth-shell .locale-switch button { color: var(--muted); }
.auth-shell .locale-switch button:hover { color: #15202d; }
.auth-shell .locale-switch button.active { background: #e8edf3; color: #15202d; }
@media (max-width: 900px) { .sidebar .locale-switch { margin: 0; } }