/* ── Reset & base ─────────────────────────────────────────── */
/*
SurveyFlow CSS organization
1. Base legacy component styles
2. Work queue and table modules
3. Dark operational theme overrides
4. Request detail/intake/map surfaces
5. Admin, insights, and settings modules

Preserve selector order unless intentionally changing cascade behavior.
Prefer adding page-specific styles near the matching module section.
*/

/* SECTION 1: Base legacy component styles */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --navy:   #1a2f4e;
  --teal:   #2a9d8f;
  --bg:     #f5f6fa;
  --surface:#ffffff;
  --border: rgba(0,0,0,0.12);
  --text:   #1a1a2e;
  --muted:  #6b7280;
  --red:    #e24b4a;
  --font:   -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

html, body { height: 100%; }
body { font-family: var(--font); font-size: 14px; color: var(--text); background: var(--bg); line-height: 1.5; }
a { color: var(--teal); text-decoration: none; }
a:hover { text-decoration: underline; }

/* ── App shell ────────────────────────────────────────────── */
.app-shell { display: flex; height: 100vh; overflow: hidden; }

body {
  --navy: #0a0c10;
  --bg: #090b11;
  --surface: #101319;
  --border: rgba(255,255,255,.09);
  --border-strong: rgba(255,255,255,.16);
  --text: #f4f7fb;
  --muted: #8b95a5;
  --teal: #5aa7ff;
  background: var(--bg);
}

/* ── Sidebar ──────────────────────────────────────────────── */
.sidebar {
  width: 244px; min-width: 244px;
  background: #050608; color: #fff;
  display: flex; flex-direction: column;
  overflow-y: auto;
  border-right: 1px solid rgba(255,255,255,.08);
}

.sidebar-logo {
  display: flex; align-items: center; gap: 10px;
  padding: 18px 14px 14px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.logo-mark {
  width: 24px; height: 24px; border-radius: 50%;
  background: linear-gradient(145deg, #2788ff, #0f5ec7); color: #fff;
  font-weight: 700; font-size: 13px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.logo-mark.sm { width: 24px; height: 24px; font-size: 11px; border-radius: 6px; }
.logo-text { display: flex; flex-direction: column; }
.logo-title { font-weight: 600; font-size: 14px; line-height: 1.2; }
.logo-project { font-size: 11px; color: rgba(255,255,255,0.55); line-height: 1.2; }

.nav-list { list-style: none; padding: 10px; flex: 1; }
.nav-item a {
  display: flex; align-items: center; gap: 10px;
  padding: 7px 10px; color: #a0a6b0;
  border-radius: 7px;
  font-size: 13px; transition: background 0.15s, color 0.15s;
  text-decoration: none;
}
.nav-item a:hover { background: rgba(255,255,255,0.06); color: #fff; }
.nav-item.active a {
  border-left: 0;
  background: #1f2024;
  color: #fff; padding-left: 10px;
}

.sidebar-footer {
  display: flex; align-items: center; gap: 10px;
  padding: 14px 16px;
  border-top: 0.5px solid rgba(255,255,255,0.1);
}
.user-avatar {
  width: 30px; height: 30px; border-radius: 50%;
  background: var(--teal); color: #fff;
  font-size: 11px; font-weight: 600;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.user-name { font-size: 12px; font-weight: 500; color: #fff; display: block; }
.user-role { font-size: 11px; color: rgba(255,255,255,0.5); display: block; }

/* ── Main content ─────────────────────────────────────────── */
.main-content { flex: 1; display: flex; flex-direction: column; overflow: hidden; }

.topbar {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 28px; height: 56px;
  background: var(--surface);
  border-bottom: 0.5px solid var(--border);
  flex-shrink: 0;
}
.page-title { font-size: 17px; font-weight: 600; color: var(--navy); }
.topbar-actions { display: flex; align-items: center; gap: 12px; }

.content-area { flex: 1; overflow-y: auto; padding: 16px 18px; }

/* ── Stat cards ───────────────────────────────────────────── */
.stats-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 24px; }
.stat-card {
  background: var(--surface); border-radius: 10px;
  border: 0.5px solid var(--border);
  padding: 20px; display: flex; flex-direction: column; gap: 6px;
}
.stat-value { font-size: 32px; font-weight: 700; line-height: 1; }
.stat-label { font-size: 12px; color: var(--muted); font-weight: 500; }
.stat-teal .stat-value { color: var(--teal); }
.stat-blue .stat-value { color: #185fa5; }
.stat-red  .stat-value { color: var(--red); }
.stat-green .stat-value { color: #3b6d11; }

/* ── Card ─────────────────────────────────────────────────── */
.card {
  background: var(--surface); border-radius: 10px;
  border: 0.5px solid var(--border);
  overflow: hidden; margin-bottom: 20px;
}
.card-header {
  padding: 14px 20px;
  border-bottom: 0.5px solid var(--border);
}
.card-section-header {
  background: var(--navy); color: #fff;
  font-size: 10px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase;
  padding: 8px 20px;
}

/* ── Request table ────────────────────────────────────────── */
.request-table { width: 100%; border-collapse: collapse; }
.request-table th {
  text-align: left; padding: 10px 16px;
  font-size: 11px; font-weight: 600; color: var(--muted); letter-spacing: 0.04em; text-transform: uppercase;
  border-bottom: 0.5px solid var(--border);
}
.request-table td { padding: 12px 16px; border-bottom: 0.5px solid var(--border); font-size: 13px; vertical-align: middle; }
.request-row:last-child td { border-bottom: none; }
.request-row:hover td { background: #f9fafc; }
.request-number a { font-weight: 600; color: var(--navy); }
.requester-email { font-size: 11px; color: var(--muted); margin-top: 2px; }
.sub-label { font-size: 11px; color: var(--muted); margin-top: 2px; }
.unassigned { color: var(--muted); }
.empty-state { text-align: center; color: var(--muted); padding: 40px; }

/* ── Filter pills ─────────────────────────────────────────── */
.filter-pills { display: flex; gap: 6px; }
.pill {
  padding: 5px 14px; border-radius: 20px; font-size: 12px; font-weight: 500;
  color: var(--muted); background: var(--bg); border: 0.5px solid var(--border);
  text-decoration: none; transition: all 0.15s;
}
.pill:hover { border-color: var(--teal); color: var(--teal); text-decoration: none; }
.pill.active { background: var(--navy); color: #fff; border-color: var(--navy); }

/* ── Status badges ────────────────────────────────────────── */
.badge {
  display: inline-block; padding: 3px 10px; border-radius: 12px;
  font-size: 11px; font-weight: 600; white-space: nowrap;
}
.badge-requested   { background: #faeeda; color: #854f0b; }
.badge-assigned    { background: #e6f1fb; color: #185fa5; }
.badge-in_progress { background: #e1f5ee; color: #0f6e56; }
.badge-completed   { background: #eaf3de; color: #3b6d11; }
.badge-on_hold     { background: #f1efe8; color: #5f5e5a; }

/* ── Overdue ──────────────────────────────────────────────── */
.overdue-dot {
  display: inline-block; width: 6px; height: 6px;
  border-radius: 50%; background: var(--red); margin-right: 5px; vertical-align: middle;
}
.overdue { color: var(--red); }

/* ── Buttons ──────────────────────────────────────────────── */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 8px 18px; border-radius: 7px; font-size: 13px; font-weight: 500;
  cursor: pointer; border: none; text-decoration: none; transition: opacity 0.15s, background 0.15s;
  white-space: nowrap;
}
.btn:hover { text-decoration: none; opacity: 0.88; }
.btn-primary { background: var(--navy); color: #fff; }
.btn-secondary { background: var(--bg); color: var(--navy); border: 0.5px solid var(--border); }
.btn-ghost { background: transparent; color: var(--muted); }
.btn-ghost:hover { color: var(--navy); }
.btn-sm { padding: 5px 12px; font-size: 12px; }
.btn-block { width: 100%; margin-bottom: 10px; }
.btn-icon {
  width: 36px; height: 36px; border-radius: 8px; border: 0.5px solid var(--border);
  background: var(--surface); cursor: pointer; display: flex; align-items: center; justify-content: center;
  color: var(--muted);
}
.btn-icon:hover { border-color: var(--teal); color: var(--teal); }

/* ── Form page shell ──────────────────────────────────────── */
.form-page { background: var(--bg); }
.form-shell { max-width: 860px; margin: 0 auto; padding: 0 0 60px; }
.form-shell-narrow { max-width: 620px; }

.form-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 0; margin-bottom: 8px;
  flex-wrap: wrap; gap: 10px;
}
.form-back { color: var(--muted); font-size: 13px; }
.form-back:hover { color: var(--navy); }
.form-header-title {
  display: flex; align-items: center; gap: 10px;
  font-size: 16px; font-weight: 600; color: var(--navy);
}
.form-steps { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); }
.form-steps .step { padding: 4px 10px; border-radius: 12px; }
.form-steps .step.active { background: var(--navy); color: #fff; }
.form-steps .step-sep { color: var(--border); }

.request-form { display: flex; flex-direction: column; gap: 0; }

.form-section {
  background: var(--surface); border-radius: 10px;
  border: 0.5px solid var(--border);
  overflow: hidden; margin-bottom: 16px;
}
.section-header {
  background: var(--navy); color: #fff;
  font-size: 10px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase;
  padding: 8px 20px;
}
.section-hint { font-size: 12px; color: var(--muted); padding: 10px 20px 0; }

.form-group { padding: 14px 20px 0; display: flex; flex-direction: column; gap: 5px; }
.form-group:last-child { padding-bottom: 20px; }
.form-group label { font-size: 12px; font-weight: 500; color: var(--navy); }
.form-group input[type="text"],
.form-group input[type="email"],
.form-group input[type="tel"],
.form-group input[type="date"],
.form-group input[type="url"],
.form-group input[type="number"],
.form-group select,
.form-group textarea {
  padding: 8px 12px; border-radius: 7px;
  border: 0.5px solid var(--border);
  font-family: var(--font); font-size: 13px; color: var(--text);
  background: var(--surface); outline: none; transition: border-color 0.15s;
  width: 100%;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus { border-color: var(--teal); }
.form-group textarea { resize: vertical; }
.field-hint { font-size: 11px; color: var(--muted); }
.required { color: var(--red); }

.form-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 12px; padding: 0 20px; padding-top: 14px; }
.form-grid-3 .form-group { padding: 0; }
.form-grid-3 .form-group:last-child { padding-bottom: 0; }
.form-grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 12px; padding: 0 20px; padding-top: 14px; }
.form-grid-2 .form-group { padding: 0; }

.radio-group { display: flex; flex-wrap: wrap; gap: 10px; padding: 14px 20px; }
.radio-option { display: flex; align-items: center; gap: 7px; cursor: pointer; }
.radio-option input { accent-color: var(--teal); }
.radio-option span { font-size: 13px; }

.toggle-pills { display: flex; gap: 0; border: 0.5px solid var(--border); border-radius: 7px; overflow: hidden; width: fit-content; }
.toggle-pill { display: flex; cursor: pointer; }
.toggle-pill input { display: none; }
.toggle-pill span {
  padding: 7px 16px; font-size: 13px; color: var(--muted);
  border-right: 0.5px solid var(--border); transition: background 0.15s, color 0.15s;
}
.toggle-pill:last-child span { border-right: none; }
.toggle-pill input:checked + span { background: var(--navy); color: #fff; }

/* ── Leaflet map ──────────────────────────────────────────── */
.map-toolbar-row { display: flex; align-items: center; gap: 16px; padding: 10px 20px; }
.basemap-toggle { display: flex; align-items: center; gap: 7px; font-size: 12px; color: var(--muted); cursor: pointer; }
.basemap-toggle input { accent-color: var(--teal); }

.leaflet-map { height: 380px; margin: 0 20px 20px; border-radius: 8px; overflow: hidden; border: 0.5px solid var(--border); }
.leaflet-map-sm { height: 240px; }

/* ── Detail view ──────────────────────────────────────────── */
.detail-layout { display: grid; grid-template-columns: 1fr 200px; gap: 20px; align-items: start; }
.detail-main { display: flex; flex-direction: column; }
.detail-sidebar { display: flex; flex-direction: column; }

.detail-grid { padding: 4px 0; }
.detail-row {
  display: flex; align-items: baseline; gap: 12px;
  padding: 9px 20px; border-bottom: 0.5px solid var(--border);
}
.detail-row:last-child { border-bottom: none; }
.detail-label { font-size: 12px; font-weight: 500; color: var(--muted); min-width: 140px; flex-shrink: 0; }
.detail-value { font-size: 13px; color: var(--text); }
.detail-section { padding: 14px 20px; border-top: 0.5px solid var(--border); }
.detail-section .detail-label { font-size: 12px; font-weight: 500; color: var(--muted); margin-bottom: 6px; }
.detail-text { font-size: 13px; color: var(--text); white-space: pre-wrap; }

/* ── Panel body ───────────────────────────────────────────── */
.panel-body { display: flex; flex-direction: column; gap: 0; }

/* ── Form footer ──────────────────────────────────────────── */
.form-footer {
  display: flex; align-items: center; justify-content: flex-end; gap: 12px;
  padding: 20px 0 0;
}

/* ── Cancelled badge (palette: bg #fbe6e6 / text #852424) ── */
.badge-cancelled { background: #fbe6e6; color: #852424; }

/* ── Danger button ────────────────────────────────────────── */
.btn-danger { background: #fef2f2; color: #991b1b; border: 0.5px solid #fecaca; }
.btn-danger:hover { background: #fee2e2; opacity: 1; }

/* ── Status note (sidebar) ────────────────────────────────── */
.status-note {
  font-size: 12px; color: var(--muted); text-align: center;
  padding: 10px; margin-bottom: 6px;
  background: var(--bg); border-radius: 7px; border: 0.5px solid var(--border);
}
.status-note-cancelled { color: #852424; background: #fbe6e6; border-color: #f5b6b6; }

/* ── URL / N-A row ────────────────────────────────────────── */
.url-or-na { display: flex; flex-direction: column; gap: 8px; }
.na-checkbox { display: flex; align-items: center; gap: 7px; cursor: pointer; font-size: 12px; color: var(--muted); }
.na-checkbox input { accent-color: var(--teal); }

/* ── Dashboard view toggle (Table | Map) ──────────────────── */
.card-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.view-toggle { display: flex; gap: 4px; }

/* ── Dashboard map (full width inside card) ───────────────── */
#dashboard-map.leaflet-map { height: 540px; margin: 0; border-radius: 0 0 8px 8px; border: 0; border-top: 0.5px solid var(--border); }

/* ── My Jobs (surveyor queue) ─────────────────────────────── */
/* SECTION 2: Work queue and table modules */
.myjobs-workspace-links {
  display: flex; align-items: center; gap: 8px; margin: 0 0 12px;
  font-size: 13px; color: var(--muted);
}
.myjobs-workspace-links a { color: var(--teal); text-decoration: none; font-weight: 500; }
.myjobs-workspace-links a:hover { text-decoration: underline; }
.myjobs-filters { margin-bottom: 16px; }
.myjobs-card.myjobs-filter-hidden { display: none !important; }
.myjobs-filter-empty {
  margin: 24px 0 0; text-align: center; color: var(--muted); font-size: 13px;
}
.myjobs-header {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; flex-wrap: wrap; margin: 0 0 16px;
}
.myjobs-header-main { display: flex; align-items: baseline; gap: 10px; }
.myjobs-title { font-size: 18px; font-weight: 600; color: var(--text); margin: 0; }
.myjobs-count { font-size: 12px; color: var(--muted); }
.myjobs-view-toggle {
  display: flex; gap: 2px; padding: 2px;
  border: 0.5px solid var(--border); border-radius: 8px;
  background: var(--surface);
}
.myjobs-view-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; padding: 0;
  border: 0; border-radius: 6px; background: transparent;
  color: var(--muted); cursor: pointer;
}
.myjobs-view-btn:hover { color: var(--text); background: var(--bg); }
.myjobs-view-btn.is-active {
  color: #fff; background: var(--navy);
}
.myjobs-queue-body { min-height: 0; }
.myjobs-queue-panel.myjobs-view-hidden { display: none !important; }
.myjobs-table-wrap { overflow-x: auto; margin-bottom: 0; }
.myjobs-table .myjobs-table-actions { white-space: nowrap; }
.myjobs-table .myjobs-table-actions form { display: inline; }
@media (max-width: 900px) {
  .myjobs-table .admin-actions .btn-ghost { display: none; }
}
.job-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 16px; }
.job-card {
  background: #15161a; border: 1px solid rgba(255,255,255,.08); border-radius: 8px;
  padding: 12px; display: flex; flex-direction: column; gap: 7px;
}
.job-card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; }
.job-card-num { font-weight: 600; color: var(--navy); text-decoration: none; }
.job-card-num:hover { text-decoration: underline; }
.job-card-row { display: flex; gap: 8px; font-size: 12px; line-height: 1.5; }
.job-label { width: 90px; flex-shrink: 0; color: var(--muted); }
.job-value { color: var(--text); flex: 1; }
.job-sub { color: var(--muted); font-size: 11px; }
.job-card-comments {
  font-size: 12px; color: var(--text); padding: 7px 9px;
  background: #101114; border-radius: 6px; border: 1px solid var(--border);
  margin-top: 4px; white-space: pre-wrap;
}
.job-card-actions { display: flex; gap: 8px; margin-top: 6px; padding-top: 9px; border-top: 1px solid rgba(255,255,255,.07); }
.job-card-actions .btn { flex: 1; }
.card-preview-trigger { cursor: pointer; }
.card-preview-trigger:focus-visible { outline: 2px solid rgba(255,255,255,.38); outline-offset: 2px; }
.card-preview-trigger.card-preview-source-active {
  border-color: var(--border-strong);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.05);
}

/* ── Card preview (Teams-style peek) ───────────────────────── */
body.card-preview-open { overflow: hidden; }
.card-preview-overlay {
  position: fixed; inset: 0; z-index: 1200;
  display: flex; align-items: center; justify-content: center;
  padding: 24px 16px;
}
.card-preview-overlay[hidden] { display: none !important; }
.card-preview-backdrop {
  position: absolute; inset: 0;
  background: rgba(4, 8, 14, 0.72);
  backdrop-filter: blur(2px);
}
.card-preview-panel {
  position: relative; z-index: 1;
  width: min(560px, 100%);
  max-height: min(86vh, 760px);
  display: flex; flex-direction: column;
  border: 1px solid var(--border-strong);
  border-radius: 12px;
  background: linear-gradient(160deg, #1a2636 0%, #121a26 100%);
  box-shadow: 0 24px 64px rgba(0,0,0,.45);
  overflow: hidden;
}
.card-preview-header {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 12px; padding: 16px 18px;
  border-bottom: 1px solid var(--border);
  background: rgba(255,255,255,.02);
}
.card-preview-header-main { min-width: 0; }
.card-preview-title {
  margin: 0; font-size: 20px; font-weight: 700; color: #e8eef7;
  letter-spacing: .01em;
}
.card-preview-badge { display: inline-flex; margin-top: 6px; }
.card-preview-header-actions {
  display: flex; align-items: center; gap: 4px; flex-shrink: 0;
}
.card-preview-content {
  overflow: auto; padding: 16px 18px 18px;
}
.card-preview-facts {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px;
  margin: 0;
}
.card-preview-fact { margin: 0; min-width: 0; }
.card-preview-fact dt {
  margin: 0 0 3px; font-size: 10px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .06em; color: var(--muted);
}
.card-preview-fact dd {
  margin: 0; font-size: 13px; line-height: 1.45; color: var(--text);
}
.card-preview-block {
  margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--border);
}
.card-preview-block-title {
  margin: 0 0 6px; font-size: 11px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .06em; color: var(--muted);
}
.card-preview-block-body {
  margin: 0; font-size: 13px; line-height: 1.55; color: var(--text);
  white-space: pre-wrap;
}
.card-preview-actions {
  margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--border);
}
.card-preview-actions .job-card-actions,
.card-preview-actions .request-card-footer {
  margin: 0; padding: 0; border: 0;
}
.card-preview-actions .request-card-footer {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
}
@media (max-width: 640px) {
  .card-preview-facts { grid-template-columns: 1fr; }
  .card-preview-panel { max-height: 92vh; }
}

/* ── Job board ─────────────────────────────────────────────── */
.jobboard-filters { margin-bottom: 14px; }
.jobboard-header {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
  gap: 12px; margin-bottom: 14px;
}
.jobboard-header-main { display: flex; align-items: baseline; gap: 10px; }
.jobboard-title { font-size: 20px; font-weight: 600; color: var(--text); margin: 0; }
.jobboard-count { font-size: 12px; color: var(--muted); }
.jobboard-toolbar {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.jobboard-zone-filter { margin: 0; }
.jobboard-select {
  min-width: 180px; padding: 7px 10px; font-size: 12px; color: var(--text);
  background: #101823; border: 1px solid var(--border-strong); border-radius: 6px;
}
.jobboard-select:focus { outline: none; border-color: #4a93ff; box-shadow: 0 0 0 3px rgba(61,134,247,.12); }
.jobboard-view-toggle {
  display: inline-flex; border: 1px solid var(--border); border-radius: 6px; overflow: hidden;
}
.jobboard-view-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; padding: 0; border: 0; background: transparent;
  color: var(--muted); cursor: pointer;
}
.jobboard-view-btn:hover { color: var(--text); background: var(--bg); }
.jobboard-view-btn.is-active {
  color: #dce9ff; background: rgba(61,134,247,.15);
  box-shadow: inset 0 0 0 1px rgba(61,134,247,.35);
}
.jobboard-body { min-height: 0; }
.jobboard-panel.jobboard-view-hidden,
.jobboard-filter-empty.jobboard-view-hidden,
.inbox-jobs-list.jobboard-view-hidden,
.inbox-jobs-board.jobboard-view-hidden { display: none !important; }
.jobboard-card.jobboard-filter-hidden,
.jobboard-row.jobboard-filter-hidden { display: none !important; }
.jobboard-card-actions form { display: flex; flex: 1; }
.jobboard-claim-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; width: 100%;
}
.jobboard-detail-btn {
  flex: 0 0 auto; width: 36px; min-width: 36px; padding: 0;
  display: inline-flex; align-items: center; justify-content: center;
}
.jobboard-table-card { padding: 0; overflow: hidden; }
.jobboard-table-card .admin-table-wrap { margin: 0; }
.jobboard-table-actions { white-space: nowrap; }
.jobboard-table-actions form { display: inline; }
.jobboard-claim-icon { color: #91bfff; }
.jobboard-filter-empty {
  margin: 24px 0 0; text-align: center; color: var(--muted); font-size: 13px;
}
.jobboard-empty-card { margin-top: 8px; }
.jobboard-empty {
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  padding: 48px 24px; text-align: center; color: var(--muted);
}
.jobboard-empty svg { color: #5a6a7d; margin-bottom: 4px; }
.jobboard-empty strong { color: var(--text); font-size: 16px; }
.jobboard-empty p { max-width: 360px; margin: 0; font-size: 13px; line-height: 1.5; }
.is-hidden { display: none !important; }
.visually-hidden {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* ── Shared data table (My Jobs, etc.) ─────────────────────── */
.sf-data-table { table-layout: fixed; width: 100%; }
.sf-table-wrap { overflow-x: auto; }
.sf-table-filters {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px; flex: 1; min-width: 0;
}
.sf-table-filter-search input[type="search"] {
  min-width: 180px; padding: 7px 10px; font-size: 12px; color: var(--text);
  background: #101823; border: 1px solid var(--border-strong); border-radius: 6px;
}
.sf-table-filter-field select,
.myjobs-table-toolbar .sf-table-filters select {
  min-width: 130px; padding: 7px 10px; font-size: 12px; color: var(--text);
  background: #101823; border: 1px solid var(--border-strong); border-radius: 6px;
}
.sf-table-filter-toggle {
  display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted);
  white-space: nowrap;
}
.sf-table-filter-toggle input { accent-color: #4a93ff; }
.myjobs-table-toolbar {
  display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between;
  gap: 10px;
}
.myjobs-table-section { padding: 0; overflow: hidden; }
.myjobs-table-section .sf-table-wrap { margin: 0; }
.sf-data-table th { position: relative; overflow: hidden; }
.sf-col-resize {
  position: absolute; right: 0; top: 0; bottom: 0; width: 6px; cursor: col-resize;
  user-select: none; touch-action: none;
}
.sf-col-resize:hover,
.sf-table-resizing .sf-col-resize { background: rgba(74,147,255,.35); }
.sf-table-reset-widths { width: 100%; margin-top: 8px; }
.sf-table-settings .insights-table-settings-menu { min-width: 220px; }

/* ── Capacity calendar ─────────────────────────────────────── */
.capacity-shell { display: flex; flex-direction: column; gap: 12px; min-height: 100%; }
.capacity-page-header {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap;
}
.capacity-title { margin: 0; font-size: 22px; letter-spacing: 0; }
.capacity-window-label { margin: 4px 0 0; color: var(--muted); font-size: 13px; font-weight: 600; }
.capacity-date-nav { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.capacity-date-input {
  min-height: 32px; padding: 6px 8px; border: 1px solid var(--border-strong);
  border-radius: 6px; background: var(--surface); color: var(--text);
}
.capacity-controls {
  display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
  padding: 10px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface);
}
.capacity-view-tabs { display: flex; gap: 4px; flex-wrap: wrap; }
.capacity-view-btn {
  border: 1px solid var(--border); background: transparent; color: var(--muted);
  border-radius: 6px; padding: 7px 10px; font-size: 12px; font-weight: 650; cursor: pointer;
}
.capacity-view-btn.is-active { color: var(--text); background: #20252e; border-color: var(--border-strong); }
.capacity-filter-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.capacity-filter-row input,
.capacity-filter-row select {
  min-height: 32px; padding: 6px 8px; border: 1px solid var(--border-strong);
  border-radius: 6px; background: #101823; color: var(--text); font-size: 12px;
}
.capacity-search input { width: min(280px, 48vw); }
.capacity-toggle { display: inline-flex; align-items: center; gap: 6px; color: var(--text); font-size: 12px; font-weight: 600; }
.capacity-toggle input,
.capacity-surveyor-option input { accent-color: #4a93ff; }
.capacity-summary {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px;
}
.capacity-summary div {
  padding: 10px 12px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface);
}
.capacity-summary span { display: block; color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .06em; }
.capacity-summary strong { display: block; margin-top: 3px; color: var(--text); font-size: 20px; }
.capacity-workspace {
  display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 12px; min-height: 0;
}
.capacity-sidebar {
  border: 1px solid var(--border); border-radius: 8px; background: var(--surface); overflow: hidden;
  align-self: start;
}
.capacity-sidebar-head {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 10px 12px; border-bottom: 1px solid var(--border); font-size: 12px; font-weight: 700;
}
.capacity-surveyor-list { display: flex; flex-direction: column; max-height: 52vh; overflow: auto; padding: 6px; }
.capacity-surveyor-option {
  display: grid; grid-template-columns: 18px 12px minmax(0, 1fr); align-items: center; gap: 8px;
  padding: 7px 6px; border-radius: 6px; color: var(--text); font-size: 12px; cursor: pointer;
}
.capacity-surveyor-option:hover { background: #171d27; }
.capacity-swatch { width: 10px; height: 10px; border-radius: 50%; background: #4a93ff; }
.capacity-board-wrap { min-width: 0; overflow: auto; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); }
.capacity-board { min-width: 780px; overflow: hidden; }
.capacity-row {
  display: grid;
  grid-template-columns: 180px repeat(var(--capacity-days, 5), minmax(110px, 1fr)) 104px;
  border-bottom: 0.5px solid var(--border);
  align-items: stretch;
  min-height: 56px;
}
.capacity-row:last-child { border-bottom: 0; }
.capacity-head {
  background: #101823;
  font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text);
  min-height: 44px;
}
.capacity-name-col { padding: 12px; align-self: center; font-size: 13px; font-weight: 500; color: var(--text); }
.capacity-day-col { padding: 8px 4px; text-align: center; align-self: center; border-left: 0.5px solid var(--border); color: var(--text); font-weight: 700; }
.capacity-day-num { display: block; margin-top: 2px; color: #9fb0c7; font-weight: 600; font-size: 12px; }
.capacity-hours-col {
  padding: 12px; text-align: right; align-self: center;
  border-left: 0.5px solid var(--border); font-size: 12px; color: var(--text); font-variant-numeric: tabular-nums;
}
.capacity-over { color: #ff9ba0; font-weight: 700; }

.capacity-week-cells {
  grid-column: 2 / calc(var(--capacity-days, 5) + 2);
  display: grid;
  grid-template-columns: repeat(var(--capacity-days, 5), minmax(110px, 1fr));
  gap: 4px;
  padding: 6px;
  border-left: 0.5px solid var(--border);
  align-items: start;
}
.capacity-bar {
  display: inline-flex; align-items: center; justify-content: space-between; gap: 6px;
  font-size: 11px; font-weight: 600;
  padding: 6px 8px; border-radius: 5px;
  text-decoration: none; line-height: 1; white-space: nowrap; overflow: hidden;
  cursor: pointer; border: 1px solid rgba(255,255,255,.12);
}
.capacity-bar:hover { opacity: 0.95; transform: translateY(-1px); }
.capacity-bar[draggable="true"] { cursor: grab; }
.capacity-bar.is-readonly { opacity: .68; cursor: default; }
.capacity-bar-hours { margin-left: auto; opacity: .8; font-variant-numeric: tabular-nums; }
.capacity-resize {
  width: 6px; align-self: stretch; flex: 0 0 6px; border-radius: 4px; opacity: .65;
  background: rgba(255,255,255,.22); cursor: ew-resize;
}
.capacity-empty { padding: 24px; color: var(--muted); text-align: center; font-size: 13px; }
.capacity-month-grid {
  display: grid; grid-template-columns: repeat(7, minmax(130px, 1fr)); min-width: 940px;
}
.capacity-month-cell {
  min-height: 112px; padding: 8px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border);
}
.capacity-month-date { color: var(--muted); font-size: 11px; font-weight: 700; margin-bottom: 6px; }
.capacity-month-chip {
  display: block; margin: 4px 0; padding: 4px 6px; border-radius: 5px; background: #173136;
  color: var(--text); font-size: 11px; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.capacity-drawer {
  position: fixed; right: 18px; top: 72px; z-index: 1200; width: min(360px, calc(100vw - 32px));
  border: 1px solid var(--border-strong); border-radius: 8px; background: #111821;
  box-shadow: 0 18px 50px rgba(0,0,0,.35); color: var(--text); overflow: hidden;
}
.capacity-drawer-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  padding: 14px; border-bottom: 1px solid var(--border);
}
.capacity-drawer-kicker { color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }
.capacity-drawer h2 { margin: 2px 0 0; font-size: 17px; }
.capacity-edit-form { display: flex; flex-direction: column; gap: 10px; padding: 14px; }
.capacity-edit-form label { display: flex; flex-direction: column; gap: 5px; color: var(--muted); font-size: 11px; font-weight: 700; }
.capacity-edit-form input,
.capacity-edit-form select {
  width: 100%; padding: 8px; border: 1px solid var(--border-strong); border-radius: 6px;
  background: #0d121a; color: var(--text); font-size: 13px;
}
.capacity-edit-dates { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.capacity-drawer-meta { color: var(--muted); font-size: 12px; line-height: 1.45; }
.capacity-drawer-error { min-height: 18px; color: #ff9ba0; font-size: 12px; }
.capacity-drawer-actions { display: flex; justify-content: space-between; gap: 8px; }

/* ── Cancel disclosure (request detail sidebar) ───────────── */
.cancel-disclosure { margin-top: 4px; }
.cancel-disclosure > summary {
  list-style: none; cursor: pointer; user-select: none;
}
.cancel-disclosure > summary::-webkit-details-marker { display: none; }
.cancel-disclosure[open] > summary { border-radius: 7px 7px 0 0; }
.cancel-form {
  display: flex; flex-direction: column; gap: 8px;
  padding: 10px; background: #fbe6e6; border: 0.5px solid #f5b6b6;
  border-top: 0; border-radius: 0 0 7px 7px;
}
.cancel-label { font-size: 11px; color: #852424; font-weight: 600; }
.cancel-form textarea {
  width: 100%; resize: vertical; padding: 6px 8px;
  font-size: 12px; font-family: inherit; line-height: 1.4;
  border: 0.5px solid #f5b6b6; border-radius: 5px; background: var(--surface); color: var(--text);
}
.cancel-form textarea:focus { outline: 2px solid #852424; outline-offset: -2px; }
.cancel-form-footer { display: flex; justify-content: flex-end; }

/* ── Comments thread (request detail) ─────────────────────── */
.comments-list { list-style: none; padding: 0; margin: 0 0 16px; display: flex; flex-direction: column; gap: 10px; }
.comment {
  background: var(--bg); border: 0.5px solid var(--border); border-radius: 7px;
  padding: 10px 12px; font-size: 13px; line-height: 1.5;
}
.comment-meta { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 4px; font-size: 11px; }
.comment-author { font-weight: 600; color: var(--text); }
.comment-when { color: var(--muted); font-variant-numeric: tabular-nums; }
.comment-body { white-space: pre-wrap; word-wrap: break-word; color: var(--text); }
.comments-empty { color: var(--muted); font-size: 12px; font-style: italic; padding: 8px 0 16px; }
.comment-form { display: flex; flex-direction: column; gap: 8px; }
.comment-form textarea {
  width: 100%; min-height: 64px; resize: vertical;
  padding: 8px 10px; font-size: 13px; font-family: inherit;
  border: 0.5px solid var(--border); border-radius: 7px; background: var(--surface); color: var(--text);
}
.comment-form textarea:focus { outline: 2px solid var(--teal); outline-offset: -2px; }
.comment-form-footer { display: flex; justify-content: flex-end; }

/* ── Audit timeline (request detail) ──────────────────────── */
.audit-timeline { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.audit-item {
  font-size: 12px; color: var(--text); line-height: 1.5;
  padding: 10px 12px; background: var(--bg); border-radius: 7px;
  border: 0.5px solid var(--border); border-left: 3px solid var(--teal);
}
.audit-when { color: var(--muted); margin-right: 8px; font-variant-numeric: tabular-nums; }
.audit-actor { font-weight: 600; margin-right: 4px; }
.audit-note { margin-top: 6px; color: var(--muted); font-style: italic; }

/* SECTION 3: Dark operational theme overrides */
/* WebGIS-inspired operational theme */
:root {
  --navy: #0b0c0f;
  --navy-2: #141518;
  --teal: #5aa7ff;
  --blue: #5aa7ff;
  --bg: #08090d;
  --surface: #101114;
  --surface-raised: #17181c;
  --surface-soft: #0d0f13;
  --border: rgba(255, 255, 255, 0.08);
  --border-strong: rgba(255, 255, 255, 0.16);
  --text: #eef3fa;
  --muted: #99a7b9;
  --red: #f16d73;
  --font: "Aptos", "Segoe UI Variable Text", "Segoe UI", sans-serif;
  --shadow: 0 14px 34px rgba(0, 0, 0, 0.28);
}

.access-state { max-width: 620px; margin: 12vh auto; padding: 2rem; background: var(--surface, #fff); border-radius: 12px; }
.people-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 1rem; }
.surface-card { background: #fff; border: 1px solid rgba(0,0,0,.12); border-radius: 10px; padding: 1rem; }
.surface-card form { display: grid; gap: .55rem; padding: .75rem 0; border-top: 1px solid rgba(0,0,0,.08); }

body {
  color: var(--text);
  background: var(--bg);
  color-scheme: dark;
}

a { color: #72aaff; }
a:hover { color: #a7c8ff; text-decoration: none; }
button, input, select, textarea { font: inherit; }
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid #79aefd;
  outline-offset: 2px;
}

.app-shell { background: var(--bg); }
.sidebar {
  width: 244px;
  min-width: 244px;
  background: #050608;
  border-right: 1px solid var(--border);
}
.sidebar-logo { padding: 15px 14px; border-bottom-color: var(--border); }
.logo-mark {
  background: linear-gradient(180deg, #4795ff, #2d6fe2);
  border: 1px solid rgba(255,255,255,.2);
  box-shadow: inset 0 1px rgba(255,255,255,.18), 0 6px 18px rgba(40,109,225,.25);
}
.logo-title { font-size: 15px; letter-spacing: -.01em; }
.logo-project { color: var(--muted); overflow: hidden; text-overflow: ellipsis; max-width: 150px; white-space: nowrap; }
.nav-label { padding: 16px 20px 6px; color: #717783; font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.nav-list { padding: 0 10px; }
.nav-item a { margin: 2px 0; padding: 8px 10px; border: 1px solid transparent; border-radius: 7px; color: #a1a6af; }
.nav-item a:hover { background: rgba(255,255,255,.045); color: #f3f6fb; }
.nav-item.active a { padding-left: 10px; border: 1px solid rgba(255,255,255,.08); background: #202124; color: #fff; box-shadow: none; }
.sidebar-footer { margin: 8px 10px; padding: 10px; border: 1px solid var(--border); border-radius: 8px; background: rgba(255,255,255,.025); }
.user-menu { position: relative; display: flex; justify-content: center; }
.user-avatar-btn {
  display: flex; align-items: center; justify-content: center;
  padding: 0; border: none; background: transparent; cursor: pointer;
  border-radius: 50%;
}
.user-avatar-btn:focus-visible { outline: 2px solid #4a93ff; outline-offset: 2px; }
.user-avatar { background: #202c3c; border: 1px solid var(--border-strong); }
.user-popover {
  position: absolute; left: 8px; right: 8px; bottom: calc(100% + 8px); z-index: 1200;
  padding: 12px 14px; border: 1px solid var(--border-strong); border-radius: 10px;
  background: rgba(14,21,31,.98); box-shadow: 0 16px 40px rgba(0,0,0,.45);
  backdrop-filter: blur(12px);
}
.user-popover-header { display: flex; flex-direction: column; gap: 2px; margin-bottom: 8px; }
.user-popover-name { font-size: 13px; font-weight: 650; color: var(--text); }
.user-popover-role { font-size: 11px; color: var(--muted); }
.user-popover-email { font-size: 12px; color: #b9c4d3; margin-bottom: 10px; word-break: break-word; }
.user-popover-actions { margin-bottom: 8px; }
.user-popover-footnote { margin: 0; font-size: 10px; color: var(--muted); font-style: italic; }
.user-role { color: var(--muted); }

.main-content { min-width: 0; background: var(--bg); }
.topbar { height: 58px; padding: 0 18px; background: #101114; border-bottom: 1px solid var(--border); }
.topbar-context { min-width: 0; }
.page-title { color: var(--text); font-size: 16px; }
.topbar-project { display: block; color: var(--muted); font-size: 10px; margin-top: 1px; }
.content-area { padding: 16px 18px 20px; }

.btn { min-height: 34px; border-radius: 6px; font-weight: 650; transition: background .15s, border-color .15s, transform .15s; }
.btn:hover { opacity: 1; transform: translateY(-1px); }
.btn-primary { color: #fff; background: #202226; border: 1px solid var(--border-strong); box-shadow: none; }
.btn-secondary { color: #dce3ee; background: #15171b; border: 1px solid var(--border-strong); }
.btn-ghost { color: #aab6c6; border: 1px solid transparent; }
.btn-ghost:hover { color: #fff; background: rgba(255,255,255,.05); }
.btn-danger { color: #ffc8ca; background: #3a2027; border: 1px solid rgba(241,109,115,.35); }
.btn-danger:hover { background: #4a252d; }
.btn-icon { background: #141d29; border: 1px solid var(--border); color: #9ba9ba; }
.btn-icon:hover { color: #fff; border-color: #4a93ff; }

.card, .form-section, .capacity-grid, .job-card {
  color: var(--text);
  background: linear-gradient(180deg, var(--surface-raised), var(--surface));
  border: 1px solid var(--border);
  border-radius: 9px;
  box-shadow: 0 8px 22px rgba(0,0,0,.12);
}
.card-section-header, .section-header {
  color: #aebacd;
  background: #111a26;
  border-bottom: 1px solid var(--border);
  padding: 10px 18px;
  letter-spacing: .1em;
}
.detail-row, .detail-section, .request-table td, .request-table th { border-color: var(--border); }
.detail-value, .detail-text, .form-group label, .job-value { color: var(--text); }
.detail-label, .field-hint, .section-hint, .job-label, .job-sub, .empty-state { color: var(--muted); }
.comment, .audit-item, .job-card-comments, .status-note { color: var(--text); background: var(--surface-soft); border-color: var(--border); }

.badge { padding: 3px 8px; border: 1px solid transparent; font-size: 10px; letter-spacing: .01em; }
.badge-requested { color: #ffd47a; background: rgba(224,158,39,.14); border-color: rgba(224,158,39,.24); }
.badge-assigned { color: #82b6ff; background: rgba(61,134,247,.14); border-color: rgba(61,134,247,.24); }
.badge-in_progress { color: #73dcc8; background: rgba(39,179,159,.14); border-color: rgba(39,179,159,.24); }
.badge-completed { color: #8bd69a; background: rgba(98,189,117,.14); border-color: rgba(98,189,117,.24); }
.badge-on_hold { color: #c0c7d2; background: rgba(167,175,189,.12); border-color: rgba(167,175,189,.2); }
.badge-cancelled { color: #ff9ba0; background: rgba(229,104,112,.13); border-color: rgba(229,104,112,.24); }
.badge-accepted { color:#c6a7ff; background:rgba(137,90,229,.14); border-color:rgba(162,119,245,.28); }
.badge-scheduled { color:#82b6ff; background:rgba(61,134,247,.14); border-color:rgba(61,134,247,.24); }
.badge-qa_review { color:#f3c873; background:rgba(221,157,40,.14); border-color:rgba(221,157,40,.25); }
.badge-delivered { color:#73dcc8; background:rgba(39,179,159,.14); border-color:rgba(39,179,159,.24); }
.badge-closed { color:#8bd69a; background:rgba(98,189,117,.14); border-color:rgba(98,189,117,.24); }
.status-indicator { width: 7px; height: 7px; display: inline-block; border-radius: 50%; background: #8792a2; box-shadow: 0 0 0 3px rgba(135,146,162,.1); }
.status-requested { background: #f5b84b; }.status-assigned { background: #4290ff; }.status-in_progress { background: #23b48c; }.status-on_hold { background: #a7afbd; }.status-completed { background: #62bd75; }.status-cancelled { background: #e56870; }

.operations-mode-tabs {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 10px;
}
.operations-mode-tab,
.operations-mode-link {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 11px;
  color: #b9c4d3;
  border: 1px solid var(--border);
  border-radius: 7px;
  background: rgba(20, 29, 41, .82);
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
}
.operations-mode-tab:hover,
.operations-mode-link:hover {
  color: #fff;
  border-color: var(--border-strong);
  background: #1a2636;
}
.operations-mode-tab.is-active {
  color: #f4f7fb;
  border-color: rgba(74,147,255,.58);
  background: #1c3048;
  box-shadow: inset 0 0 0 1px rgba(74,147,255,.18);
}
.operations-mode-icon {
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  border-radius: 5px;
  background: rgba(255,255,255,.06);
  font-size: 10px;
}
.operations-mode-link {
  margin-left: auto;
}
.spotlight-panel-topline {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.operations-mode-tabs-compact {
  flex: 1;
  min-width: 0;
  margin-bottom: 0;
  gap: 4px;
}
.operations-mode-tabs-compact .operations-mode-tab,
.operations-mode-tabs-compact .operations-mode-link {
  min-height: 26px;
  padding: 0 8px;
  font-size: 11px;
  background: rgba(255,255,255,.035);
}
.operations-mode-tabs-compact .operations-mode-icon {
  width: 16px;
  height: 16px;
}
.spotlight-insights-link {
  min-height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 8px;
  color: #aebacc;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: rgba(255,255,255,.03);
  font-size: 11px;
  font-weight: 700;
  text-decoration: none;
}
.spotlight-insights-link:hover {
  color: #fff;
  border-color: var(--border-strong);
  background: rgba(61,134,247,.12);
}

.dashboard-summary { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.filter-segments {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  width: max-content;
  max-width: 100%;
  padding: 2px;
  margin-bottom: 12px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 9px;
  background: #111216;
}
.filter-segment {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 11px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #a8adb6;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
}
.filter-segment:hover { color: var(--text); background: rgba(255,255,255,.055); }
.filter-segment.is-active {
  color: #f4f7fb;
  background: #202226;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.07);
}
.filter-segment-label { font-weight: 650; }
.filter-segment-count {
  min-width: 19px;
  display: inline-flex;
  justify-content: center;
  padding: 3px 6px;
  border-radius: 999px;
  background: #343842;
  color: #d8e0ea;
  font-size: 11px;
  font-weight: 700;
}
.filter-segment.is-active .filter-segment-count { background: #4a4f5c; color: #fff; }
.metric-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}
.metric-tile {
  min-height: 62px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 5px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(255,255,255,.025);
  color: var(--text);
  cursor: pointer;
  font: inherit;
  text-align: left;
}
.metric-tile:hover { border-color: var(--border-strong); background: rgba(255,255,255,.04); }
.metric-tile.is-active { border-color: rgba(74,147,255,.55); background: rgba(74,147,255,.11); }
.metric-label {
  color: #aeb9c8;
  font-size: 11px;
  font-weight: 650;
}
.metric-value {
  color: #f4f7fb;
  font-size: 22px;
  font-weight: 750;
  line-height: 1;
}
.metric-tile-teal { border-top: 2px solid var(--teal); }
.metric-tile-blue { border-top: 2px solid #4290ff; }
.metric-tile-red { border-top: 2px solid var(--red); }
.metric-tile-green { border-top: 2px solid #62bd75; }
.metric-tile-grey { border-top: 2px solid #a7afbd; }
.spotlight-quick-filters {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 4px;
  margin-bottom: 8px;
}
.spotlight-chip {
  min-width: 0;
  min-height: 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
  padding: 4px 7px;
  color: var(--text);
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 5px;
  cursor: pointer;
  font: inherit;
}
.spotlight-chip:hover,
.spotlight-chip.is-active {
  border-color: rgba(74,147,255,.62);
  background: rgba(61,134,247,.13);
}
.spotlight-chip span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #b9c4d3;
  font-size: 10px;
  font-weight: 650;
}
.spotlight-chip strong {
  flex: 0 0 auto;
  color: #f4f7fb;
  font-size: 13px;
  line-height: 1;
}

.stat-card { min-height: 96px; padding: 13px 15px; gap: 4px; border-radius: 8px; background: linear-gradient(150deg,#192433,#131c28); border: 1px solid var(--border); position: relative; overflow: hidden; }
.stat-card::before { content:""; position:absolute; inset:0 auto 0 0; width:3px; background:var(--teal); }
.stat-blue::before { background:#4290ff; }.stat-red::before { background:var(--red); }.stat-green::before { background:#62bd75; }
.stat-value { order: 2; font-size: 27px; color: var(--text) !important; }
.stat-label { order: 1; color: #b9c4d3; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; }
.stat-note { order: 3; color: var(--muted); font-size: 10px; }

.dashboard-summary { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }

/* ── Spotlight search (dashboard + map) ───────────────────── */
.spotlight-shell { position: relative; margin-bottom: 10px; }
.spotlight-bar {
  display: flex; align-items: center; gap: 6px;
  padding: 5px 6px 5px 10px;
  background: rgba(12, 18, 27, .94);
  border: 1px solid var(--border-strong, rgba(188, 205, 229, .24));
  border-radius: 999px;
  backdrop-filter: blur(14px);
  box-shadow: 0 8px 24px rgba(0,0,0,.28);
}
.spotlight-search {
  display: flex; align-items: center; gap: 8px;
  flex: 1; min-width: 0; color: #8492a5;
}
.spotlight-search svg { flex-shrink: 0; }
.spotlight-search input {
  width: 100%; border: 0; outline: 0; background: transparent;
  color: var(--text, #eef3fa); font-size: 13px; padding: 6px 0;
}
.spotlight-search input::placeholder { color: #748195; }
.spotlight-search input::-webkit-search-cancel-button { filter: invert(.7); }
.spotlight-filter-toggle {
  position: relative; width: 32px; height: 32px;
  display: grid; place-items: center;
  border: 1px solid var(--border, rgba(188, 205, 229, .14));
  border-radius: 50%; background: rgba(255,255,255,.04);
  color: #9eabba; cursor: pointer; flex-shrink: 0;
  transition: color .15s, border-color .15s, background .15s;
}
.spotlight-filter-toggle:hover,
.spotlight-filter-toggle[aria-expanded="true"] {
  color: #fff; border-color: #4a93ff; background: rgba(61,134,247,.14);
}
.spotlight-filter-dot {
  position: absolute; top: 6px; right: 6px;
  width: 6px; height: 6px; border-radius: 50%;
  background: #4a93ff; box-shadow: 0 0 0 2px rgba(12,18,27,.9);
}
.spotlight-filter-dot[hidden] { display: none; }
.spotlight-panel {
  margin-top: 6px; padding: 10px;
  background: rgba(12, 18, 27, .96);
  border: 1px solid var(--border-strong, rgba(188, 205, 229, .24));
  border-radius: 10px; backdrop-filter: blur(14px);
  box-shadow: 0 12px 28px rgba(0,0,0,.3);
}
.spotlight-panel[hidden] { display: none; }
.spotlight-panel-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px;
}
.spotlight-panel-primary {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px;
}
.spotlight-panel-secondary {
  display: grid; grid-template-columns: minmax(130px, .46fr) minmax(0, 1fr);
  gap: 10px; align-items: end; margin-top: 10px;
}
.spotlight-panel-fields {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(112px, .72fr);
  gap: 8px;
}
.spotlight-field { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.spotlight-field > span {
  color: #79879a; font-size: 9px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .06em;
}
.spotlight-field select {
  width: 100%; padding: 6px 8px;
  color: var(--text, #eef3fa); background: #101823;
  border: 1px solid var(--border-strong, rgba(188, 205, 229, .24));
  border-radius: 6px; font-size: 12px; cursor: pointer;
}
.spotlight-field select:focus {
  outline: none; border-color: #4a93ff;
  box-shadow: 0 0 0 3px rgba(61,134,247,.12);
}
.spotlight-filter-summary {
  min-height: 28px; display: flex; align-items: center; min-width: 0;
  padding: 5px 8px; color: #9daabd; background: rgba(255,255,255,.035);
  border: 1px solid var(--border, rgba(188, 205, 229, .14));
  border-radius: 6px; font-size: 10px; line-height: 1.35;
}
.spotlight-panel-actions {
  display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 8px;
}
.toolbar-clear {
  flex: 0 0 auto; min-height: 28px; padding: 0 10px; border-radius: 6px;
  color: #91a0b3; background: transparent; border: 1px solid var(--border);
  cursor: pointer; font-size: 11px; font-weight: 600;
}
.toolbar-clear:hover { color: #fff; border-color: #4a93ff; }
.spotlight-float {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 650;
  margin-bottom: 0;
  width: min(330px, calc(100% - 24px));
  transition: width .2s ease, box-shadow .2s ease;
}
#map-controls.spotlight-float {
  width: min(340px, calc(100vw - 240px));
}
.spotlight-float.is-expanded {
  width: min(420px, calc(100% - 24px));
  box-shadow: 0 14px 34px rgba(0,0,0,.38);
}
#map-controls.spotlight-float.is-expanded {
  width: min(360px, calc(100vw - 240px));
}
.spotlight-shell.is-expanded .spotlight-bar {
  border-color: rgba(61,134,247,.35);
  box-shadow: 0 8px 24px rgba(33,102,220,.15);
}
#dashboard-spotlight .spotlight-panel {
  max-height: min(50vh, 320px);
  overflow: auto;
}

@media (max-width: 820px) {
  .spotlight-panel-grid,
  .spotlight-panel-primary,
  .spotlight-panel-secondary,
  .spotlight-panel-fields { grid-template-columns: 1fr; }
}

.app-shell-immersive .main-content { min-height: 0; }
.app-shell-immersive .content-area { padding: 0; overflow: hidden; height: 100%; }

.map-glass-pill {
  background: rgba(18, 26, 38, 0.52);
  backdrop-filter: blur(18px) saturate(1.35);
  -webkit-backdrop-filter: blur(18px) saturate(1.35);
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.28);
}
.map-glass-panel {
  background: rgba(14, 21, 31, 0.78);
  backdrop-filter: blur(18px) saturate(1.25);
  -webkit-backdrop-filter: blur(18px) saturate(1.25);
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.34);
}

.operations-board { position:relative; height:100%; min-height:0; border:none; border-radius:0; overflow:hidden; background:#0e151f; box-shadow:none; }
.request-browser-panel { position:absolute; z-index:600; inset:12px auto 12px 12px; width:clamp(350px,28vw,440px); display:flex; min-width:0; min-height:0; flex-direction:column; border:1px solid rgba(255,255,255,.1); border-radius:8px; overflow:hidden; background:rgba(13,15,19,.82); box-shadow:0 18px 42px rgba(0,0,0,.36); backdrop-filter:blur(18px) saturate(1.1); transition:transform .22s ease,opacity .18s ease; }
.operations-board.request-drawer-collapsed .request-browser-panel { opacity:0; pointer-events:none; transform:translateX(calc(-100% - 18px)); }
.panel-heading { min-height:49px; display:flex; align-items:center; justify-content:space-between; padding:0 10px 0 15px; border-bottom:1px solid var(--border); }
.panel-heading > div { display:flex; align-items:center; gap:8px; }.panel-heading strong { font-size:14px; }.panel-heading span { color:var(--muted); font-size:10px; }.panel-link { font-size:11px; }.panel-heading-actions { display:flex; align-items:center; gap:6px; }
.drawer-control { width:28px; height:28px; display:grid; place-items:center; border-radius:50%; color:#93a1b4; background:rgba(255,255,255,.035); border:1px solid var(--border); cursor:pointer; box-shadow:none; }
.drawer-control:hover { color:#fff; border-color:var(--border-strong); background:#24252a; }
.drawer-reopen { position:absolute; z-index:590; top:12px; left:12px; display:flex; align-items:center; gap:8px; min-height:38px; padding:0 14px 0 12px; border-radius:999px; color:#e4ebf5; cursor:pointer; opacity:0; pointer-events:none; transform:translateX(-16px); transition:transform .2s ease,opacity .18s ease,color .15s,border-color .15s; font-size:12px; font-weight:600; }
.drawer-reopen:hover { color:#fff; border-color:rgba(145,191,255,.35); }
.drawer-reopen span { font-size:12px; font-weight:600; }
.operations-board.request-drawer-collapsed .drawer-reopen { opacity:1; pointer-events:auto; transform:translateX(0); }
.dashboard-request-list { min-height:0; padding:8px; overflow:auto; display:flex; flex-direction:column; gap:7px; }
.dashboard-request-card { padding:11px; border:1px solid rgba(255,255,255,.08); border-radius:8px; background:#15161a; transition:border-color .15s,background .15s,box-shadow .15s; cursor:pointer; }
.dashboard-request-card:hover, .dashboard-request-card.active { border-color:var(--border-strong); background:#1a1b20; box-shadow:inset 0 0 0 1px rgba(255,255,255,.04); }
.dashboard-request-card.is-overdue { border-left:3px solid var(--red); }
.request-card-topline, .request-card-footer { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.request-card-topline-end { display:flex; align-items:center; gap:6px; flex-shrink:0; }
.request-card-preview-btn { width:26px; height:26px; border-radius:6px; opacity:.82; }
.request-card-preview-btn:hover, .request-card-preview-btn:focus-visible { opacity:1; }
.request-card-status { display:flex; align-items:center; gap:7px; }.request-card-number { color:#c5cbd6; font-size:12px; font-weight:700; }
.request-card-title { margin-top:8px; color:#f4f7fb; font-size:14px; font-weight:700; }.request-card-subtitle { margin-top:1px; color:var(--muted); font-size:11px; }
.request-card-metrics { display:grid; grid-template-columns:1fr 1fr; margin:10px 0 9px; border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.request-card-metrics div { padding:7px 8px 7px 0; }.request-card-metrics div+div { padding-left:10px; border-left:1px solid var(--border); }.request-card-metrics span { display:block; color:#7f8da0; font-size:9px; text-transform:uppercase; letter-spacing:.05em; }.request-card-metrics strong { display:block; margin-top:2px; color:#dbe3ee; font-size:11px; }
.request-card-footer { min-height:29px; color:var(--muted); font-size:10px; }.request-card-footer .btn { margin-left:auto; min-height:27px; padding:4px 10px; }.spatial-state { white-space:nowrap; }.has-boundary { color:#78cabb; }.no-boundary { color:#e4b764; }
.dashboard-empty { margin:auto; }
.dashboard-map-panel { position:absolute; inset:0; min-width:0; min-height:0; background:#22303e; }
#dashboard-map { position:absolute; inset:0; }
.map-context-chip { position:absolute; z-index:500; bottom:16px; left:16px; display:flex; align-items:center; gap:8px; padding:8px 14px; color:#dce6f4; border-radius:999px; font-size:11px; font-weight:600; }
.map-corner-actions {
  position:absolute; z-index:860;
  display:flex; align-items:flex-end;
  pointer-events:none;
  visibility:hidden;
}
.map-corner-actions.is-positioned { visibility:visible; }
.map-float-action {
  min-height:38px; padding:0 16px; border-radius:999px;
  box-shadow:0 10px 28px rgba(33,102,220,.35); pointer-events:auto;
}
.intake-draw-hint { position:absolute; z-index:610; bottom:16px; left:50%; transform:translateX(-50%); padding:8px 14px; border-radius:999px; font-size:12px; font-weight:600; color:#fff; white-space:nowrap; max-width:calc(100% - 32px); overflow:hidden; text-overflow:ellipsis; }
.dashboard-map-panel .spotlight-bar { border-radius:999px; border:1px solid rgba(255,255,255,.14); min-height:38px; }
.dashboard-map-panel .leaflet-control-zoom { border: 1px solid rgba(255,255,255,.14) !important; box-shadow: 0 8px 24px rgba(0,0,0,.28); border-radius:10px !important; overflow:hidden; backdrop-filter:blur(12px); }
.dashboard-map-panel .leaflet-control-zoom a { color: #dce6f4 !important; background: rgba(18,26,38,.72) !important; border-color: rgba(255,255,255,.1) !important; }
.dashboard-map-panel .leaflet-bottom.leaflet-right { bottom: 16px; right: 16px; }
.dashboard-map-panel .leaflet-control-attribution { background:rgba(18,26,38,.65)!important; backdrop-filter:blur(10px); border-radius:6px; color:#aab6c6!important; }
.operations-board.operations-intake-active .dashboard-spotlight,
.operations-board.operations-intake-active .drawer-reopen,
.operations-board.operations-intake-active .map-context-chip { opacity:.35; pointer-events:none; }
.operations-board.operations-intake-active .map-float-action { opacity:.45; pointer-events:none; }
#intake-panel.intake-panel-embedded { position:absolute; z-index:1100; top:12px; right:12px; bottom:12px; width:clamp(340px,30vw,400px); display:flex; flex-direction:column; border:1px solid rgba(255,255,255,.14); border-radius:14px; overflow:hidden; background:rgba(14,21,31,.88); box-shadow:0 22px 48px rgba(0,0,0,.45); backdrop-filter:blur(20px) saturate(1.2); transition:transform .24s ease,opacity .18s ease; }
#intake-panel.intake-panel-embedded.intake-panel-collapsed { opacity:0; pointer-events:none; transform:translateX(calc(100% + 20px)); }
.intake-panel-head { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:14px 16px; border-bottom:1px solid var(--border); flex-shrink:0; }
.intake-panel-head-copy { min-width:0; }
.intake-panel-head strong { display:block; font-size:14px; font-weight:700; letter-spacing:-.01em; }
.intake-panel-body { flex:1; overflow-y:auto; padding:4px 16px 16px; display:flex; flex-direction:column; gap:0; }
.intake-section { display:flex; flex-direction:column; gap:10px; padding:14px 0; }
.intake-section + .intake-section { border-top:1px solid rgba(188,205,229,.1); }
.intake-section-title { margin:0; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
.intake-field { display:flex; flex-direction:column; gap:5px; }
.intake-field label { font-size:12px; font-weight:600; color:var(--text); margin:0; }
.intake-field input, .intake-field select, .intake-field textarea { width:100%; padding:8px 10px; border-radius:7px; font-size:13px; border:1px solid var(--border-strong); background:#101823; color:var(--text); }
.intake-field textarea { resize:vertical; min-height:72px; line-height:1.45; }
.intake-field-hint { margin:0; font-size:11px; color:var(--muted); line-height:1.4; }
.intake-check-grid { display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.intake-check-option { display:flex; align-items:center; gap:7px; padding:8px 10px; border-radius:7px; border:1px solid var(--border); background:#101823; cursor:pointer; font-size:12px; line-height:1.25; transition:border-color .15s,background-color .15s; }
.intake-check-option:last-child:nth-child(odd) { grid-column:1 / -1; }
.intake-check-option:hover { border-color:rgba(42,157,143,.45); }
.intake-check-option:has(input:checked) { border-color:#2a9d8f; background:rgba(42,157,143,.12); }
.intake-check-option input { margin:0; accent-color:#2a9d8f; flex-shrink:0; }
.intake-check-hint { margin:-4px 0 2px; font-size:11px; color:var(--muted); }
.intake-panel-foot { padding:12px 16px; border-top:1px solid var(--border); display:flex; gap:8px; justify-content:flex-end; background:rgba(10,16,24,.55); flex-shrink:0; }
.intake-form-error { margin:0; padding:10px 16px; border-bottom:1px solid rgba(229,104,112,.25); font-size:12px; background:rgba(229,104,112,.1); color:#ffc8ca; }
.operations-board.operations-intake-active .leaflet-bar { border:none; box-shadow:none; background:transparent; }
.operations-board.operations-intake-active .leaflet-draw { margin-left:0; display:flex; flex-direction:column; align-items:center; padding:5px; border-radius:999px; background:rgba(8,12,18,.88); border:1px solid rgba(255,255,255,.1); box-shadow:0 10px 28px rgba(0,0,0,.38); backdrop-filter:blur(14px); }
.operations-board.operations-intake-active .leaflet-draw-toolbar { margin:0!important; border:none; background:transparent; }
.operations-board.operations-intake-active .leaflet-draw-toolbar a { position:relative; width:32px; height:32px; line-height:1; background:transparent!important; border:none!important; border-radius:50%!important; margin:2px 0; background-image:none!important; }
.operations-board.operations-intake-active .leaflet-draw-toolbar a.leaflet-draw-toolbar-button-enabled { background:#367be8!important; box-shadow:0 2px 10px rgba(54,123,232,.45); }
.operations-board.operations-intake-active .leaflet-draw-draw-polygon::after { content:''; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:20px; height:20px; background:center/contain no-repeat; opacity:.95; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.35'%3E%3Crect x='6.5' y='7' width='11' height='10'/%3E%3Ccircle cx='6.5' cy='7' r='1.55' stroke-width='1.2'/%3E%3Ccircle cx='17.5' cy='7' r='1.55' stroke-width='1.2'/%3E%3Ccircle cx='17.5' cy='17' r='1.55' stroke-width='1.2'/%3E%3Ccircle cx='6.5' cy='17' r='1.55' stroke-width='1.2'/%3E%3C/svg%3E"); }
.operations-board.operations-intake-active .leaflet-draw-actions { top:-1px; left:46px; display:flex; align-items:center; gap:6px; padding:4px; border-radius:999px; background:rgba(8,12,18,.96); border:1px solid rgba(255,255,255,.08); box-shadow:0 10px 24px rgba(0,0,0,.28); backdrop-filter:blur(14px); }
.operations-board.operations-intake-active .leaflet-draw-actions li { display:block; }
.operations-board.operations-intake-active .leaflet-draw-actions a { display:grid; place-items:center; width:32px; min-width:32px; height:32px; line-height:1; padding:0; background:rgba(255,255,255,.04)!important; border:1px solid rgba(188,205,229,.18)!important; color:#dce6f4!important; border-radius:999px!important; margin:0!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.04); }
.operations-board.operations-intake-active .leaflet-draw-actions a:hover { background:rgba(39,63,97,.92)!important; border-color:rgba(98,173,255,.55)!important; }
.operations-board.operations-intake-active .leaflet-draw-actions a[data-action="finish"] { color:#9ef0bf!important; border-color:rgba(76,191,125,.35)!important; }
.operations-board.operations-intake-active .leaflet-draw-actions a[data-action="finish"]:hover { background:rgba(28,66,45,.96)!important; border-color:rgba(92,213,143,.62)!important; }
.operations-board.operations-intake-active .leaflet-draw-tooltip { background:rgba(14,21,31,.94); border:1px solid rgba(188,205,229,.24); color:#dce6f4; font-size:11px; line-height:1.25; border-radius:999px; box-shadow:0 6px 18px rgba(0,0,0,.35); padding:5px 10px; }
.operations-board.operations-intake-active .leaflet-draw-tooltip:before { border-right-color:rgba(14,21,31,.94); }
.operations-board.operations-intake-active .leaflet-div-icon.leaflet-editing-icon { width:12px!important; height:12px!important; margin-left:-6px!important; margin-top:-6px!important; border-radius:50%; border:2px solid rgba(223,247,242,.96)!important; background:linear-gradient(180deg,#37cdb4 0%,#239a88 100%)!important; box-shadow:0 0 0 3px rgba(8,12,18,.32),0 8px 18px rgba(0,0,0,.28); }
.operations-board.operations-intake-active .leaflet-div-icon.leaflet-editing-icon.leaflet-touch-icon { width:14px!important; height:14px!important; margin-left:-7px!important; margin-top:-7px!important; }
.operations-board.operations-intake-active .leaflet-edit-marker-selected { border:none!important; background:transparent!important; }
.leaflet-overlay-pane path.boundary-pulse { animation:boundary-flash .42s ease-in-out 4; transform-box:fill-box; transform-origin:center; }
@keyframes boundary-flash { 0%,100% { stroke:#fff; filter:drop-shadow(0 0 2px rgba(255,255,255,.75)); } 50% { stroke:#ffd45b; stroke-width:9; fill-opacity:.72; filter:drop-shadow(0 0 9px #ffd45b); } }

/* SECTION 4: Request detail, intake, and map surfaces */
.page-eyebrow { display:block; margin-bottom:4px; color:#72aaff; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.1em; }
.request-mission-banner { display:flex; justify-content:space-between; gap:24px; margin-bottom:14px; padding:18px 20px; border:1px solid var(--border); border-radius:10px; background:linear-gradient(120deg,#1a2739,#121b27 62%); box-shadow:var(--shadow); }
.mission-title-row { display:flex; align-items:center; gap:10px; }.mission-title-row h2 { font-size:23px; letter-spacing:-.02em; }.mission-copy p { color:var(--muted); font-size:12px; margin-top:3px; }
.mission-facts { display:grid; grid-template-columns:repeat(3,minmax(110px,1fr)); align-items:center; }.mission-facts div { padding:3px 18px; border-left:1px solid var(--border); }.mission-facts span { display:block; color:var(--muted); font-size:9px; text-transform:uppercase; letter-spacing:.06em; }.mission-facts strong { display:block; margin-top:4px; color:var(--text); font-size:12px; }
.detail-layout { grid-template-columns:minmax(0,1fr) 240px; gap:14px; }.detail-main .card { margin-bottom:14px; }.action-dock { position:sticky; top:0; padding:12px; border:1px solid var(--border); border-radius:9px; background:linear-gradient(180deg,#192433,#131c27); box-shadow:var(--shadow); }.action-dock-heading { margin:-12px -12px 12px; padding:11px 12px; border-bottom:1px solid var(--border); }.action-dock-heading strong,.action-dock-heading span { display:block; }.action-dock-heading strong { font-size:13px; }.action-dock-heading span { color:var(--muted); font-size:10px; margin-top:2px; }
.detail-alert { margin-bottom:12px; padding:10px 13px; border:1px solid; border-radius:8px; font-size:12px; }
.detail-alert-error { color:#ffb4b8; background:rgba(229,104,112,.1); border-color:rgba(229,104,112,.28); }
.detail-alert-success { color:#8bd69a; background:rgba(98,189,117,.1); border-color:rgba(98,189,117,.25); }
.workflow-strip { display:grid; grid-template-columns:repeat(7,1fr); margin:-2px 0 14px; border:1px solid var(--border); border-radius:8px; overflow:hidden; background:#111a25; }
.workflow-strip span { position:relative; padding:8px 5px; color:var(--muted); font-size:9px; font-weight:600; text-align:center; text-transform:uppercase; letter-spacing:.04em; border-right:1px solid var(--border); }
.workflow-strip span:last-child { border-right:0; }
.detail-grid-two { display:grid; grid-template-columns:1fr 1fr; }
.detail-grid-two .detail-row:nth-last-child(-n+2) { border-bottom:0; }
.priority { text-transform:capitalize; font-weight:650; }
.priority-high { color:#f3c873; }.priority-urgent { color:#ff8f95; }.priority-low { color:#9eabba; }.priority-medium { color:#d8e0eb; }
.detail-empty { padding:22px 20px; color:var(--muted); font-size:12px; }
.detail-empty.compact { padding:10px 0; }
.detail-map-error { min-height:80px; }
.attachment-list { list-style:none; margin:0; padding:4px 0; }
.attachment-list li { display:flex; justify-content:space-between; gap:16px; padding:11px 20px; border-bottom:1px solid var(--border); }
.attachment-list li:last-child { border-bottom:0; }.attachment-list a { color:#91bfff; overflow-wrap:anywhere; }.attachment-list span { flex:0 0 auto; color:var(--muted); font-size:10px; }
.detail-action-form { margin-bottom:10px; }.detail-action-form label { display:block; margin-bottom:5px; color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.05em; }
.detail-action-form select { width:100%; margin-bottom:7px; padding:8px; color:var(--text); background:#101823; border:1px solid var(--border-strong); border-radius:6px; }
.action-loading { display:none; }.detail-action-form.is-loading .action-label { display:none; }.detail-action-form.is-loading .action-loading { display:inline; }
.detail-action-form button:disabled { cursor:wait; opacity:.72; }

.form-page { min-height:100%; color:var(--text); background:radial-gradient(circle at 50% -20%,rgba(61,134,247,.16),transparent 35%),#0b1119; overflow:auto; }
.form-shell { padding:18px 16px 60px; }.form-header { padding:10px 0 17px; }.form-back { color:#91a0b3; }.form-header-title { color:var(--text); }.form-steps .step { color:var(--muted); border:1px solid transparent; }.form-steps .step.active { color:#dce9ff; background:rgba(61,134,247,.15); border-color:rgba(61,134,247,.35); }
.form-group input[type="text"],.form-group input[type="email"],.form-group input[type="tel"],.form-group input[type="date"],.form-group input[type="url"],.form-group input[type="number"],.form-group select,.form-group textarea,.comment-form textarea,.cancel-form textarea,#request-browser-search,#map-year-select { color:var(--text); background:#101823; border:1px solid var(--border-strong); }
.form-group input::placeholder,.form-group textarea::placeholder,.comment-form textarea::placeholder { color:#657287; }.form-group input:focus,.form-group select:focus,.form-group textarea:focus { border-color:#4a93ff; box-shadow:0 0 0 3px rgba(61,134,247,.12); }
.radio-option span { color:#d6dfeb; }.toggle-pills { border-color:var(--border-strong); }.toggle-pill span { color:var(--muted); border-color:var(--border); }.toggle-pill input:checked+span { color:#fff; background:#3278df; }
.leaflet-map { border:1px solid var(--border-strong); }.leaflet-popup-content-wrapper,.leaflet-popup-tip { color:#e8eef7; background:#172231; }.leaflet-container a { color:#75acff; }

.myjobs-header { align-items:flex-end; }.myjobs-title { color:var(--text); font-size:20px; }.queue-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:14px; }.queue-summary>div { padding:12px 14px; border:1px solid var(--border); border-radius:8px; background:#15161a; }.queue-summary span { display:block; color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.06em; }.queue-summary strong { display:block; margin-top:3px; font-size:22px; }.queue-summary .has-alert strong { color:var(--red); }.job-card { padding:12px; border-top:0; }.job-card.is-overdue { border-color:rgba(241,109,115,.45); }.job-card-num { color:#c5cbd6; }.job-card-actions { border-color:var(--border); }.job-card-actions form { display:flex !important; flex:1; }.job-card-actions form .btn { width:100%; }

.capacity-head { background:#101823; }.capacity-row,.capacity-day-col,.capacity-hours-col,.capacity-week-cells { border-color:var(--border); }.capacity-day-num,.capacity-week-label,.capacity-name-col,.capacity-hours-col { color:var(--text); }
.cancel-form { background:#26191e; border-color:rgba(241,109,115,.3); }.cancel-label { color:#ff9ba0; }

#map-controls .spotlight-panel {
  max-height: min(58vh, 420px);
  overflow: auto;
}
#map-controls { padding: 0 !important; overflow: visible !important; background: transparent !important; border: 0 !important; box-shadow: none !important; }
#map-controls.is-expanded { box-shadow: none !important; }
#draw-banner { background:rgba(15,23,35,.95)!important; border:1px solid var(--border-strong); }

@media (max-width: 1100px) {
  .dashboard-summary { gap: 6px; }
  .mission-facts { grid-template-columns:1fr; }.mission-facts div { padding:3px 14px; }
}

@media (max-width: 820px) {
  .app-shell { height:auto; min-height:100%; flex-direction:column; overflow:visible; }.sidebar { width:100%; min-width:0; height:auto; overflow:visible; border-right:0; border-bottom:1px solid var(--border); }.sidebar-logo { padding:9px 12px; }.nav-label,.sidebar-footer,.logo-project { display:none; }.nav-list { display:flex; overflow-x:auto; padding:6px 8px; }.nav-item { flex:0 0 auto; }.nav-item a { padding:7px 9px; }.nav-item.active a { padding-left:9px; box-shadow:inset 0 -2px #4d96ff; }.main-content { overflow:visible; }.topbar { position:sticky; top:0; z-index:1100; }.content-area { overflow:visible; padding:12px; }
  .operations-board { height:min(70vh,650px); min-height:480px; overflow:hidden; }.request-browser-panel { inset:10px auto 10px 10px; width:min(420px,calc(100% - 20px)); max-height:58%; }.dashboard-map-panel { min-height:0; }.drawer-reopen { top:10px; left:10px; }
  .spotlight-quick-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .request-mission-banner { flex-direction:column; }.mission-facts { grid-template-columns:repeat(3,1fr); }.mission-facts div:first-child { border-left:0; }.detail-layout { grid-template-columns:1fr; }.action-dock { position:static; order:-1; }.job-grid { grid-template-columns:1fr; }
  #map-controls.spotlight-float,
  #map-controls.spotlight-float.is-expanded,
  #dashboard-spotlight.spotlight-float,
  #dashboard-spotlight.spotlight-float.is-expanded {
    width: min(340px, calc(100% - 24px)) !important;
  }
}

@media (max-width: 560px) {
  .topbar { padding:0 10px; }.topbar-project,.btn-icon { display:none; }.topbar-actions { gap:6px; }.topbar-actions .btn { padding:7px 10px; }
  .filter-segments { width: 100%; overflow-x: auto; }
  .metric-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .metric-value { font-size: 18px; }
  .request-browser-panel { max-height:62%; }.request-card-metrics { grid-template-columns:1fr; }.request-card-metrics div+div { padding-left:0; border-left:0; border-top:1px solid var(--border); }
  .mission-facts { grid-template-columns:1fr; }.mission-facts div { padding:7px 0; border-left:0; border-top:1px solid var(--border); }.form-grid-2,.form-grid-3 { grid-template-columns:1fr; padding:12px 14px 0; }.form-grid-2 .form-group,.form-grid-3 .form-group { padding-bottom:12px; }.form-group { padding-left:14px; padding-right:14px; }.form-header { align-items:flex-start; }.form-steps { width:100%; justify-content:center; }.queue-summary { grid-template-columns:1fr 1fr 1fr; gap:6px; }.queue-summary>div { padding:9px; }.queue-summary strong { font-size:18px; }.job-card-actions { flex-direction:column; }.capacity-grid { overflow-x:auto; }.capacity-row { min-width:760px; }
}

@media (max-width: 680px) {
  .workflow-strip { grid-template-columns:repeat(4,1fr); }.workflow-strip span { border-bottom:1px solid var(--border); }
  .detail-grid-two { grid-template-columns:1fr; }.detail-grid-two .detail-row { border-bottom:1px solid var(--border); }
  .attachment-list li { flex-direction:column; gap:3px; }
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior:auto!important; transition-duration:.01ms!important; animation-duration:.01ms!important; animation-iteration-count:1!important; }
}

/* ── Standalone login page ─────────────────────────────────── */
.login-body {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: radial-gradient(circle at 50% -20%, rgba(61, 134, 247, .16), transparent 35%), #0b1119;
  color: var(--text);
}
.login-shell { width: min(420px, 100%); display: flex; flex-direction: column; gap: 20px; }
.login-brand { display: flex; align-items: center; gap: 12px; }
.login-title { display: block; font-size: 20px; color: var(--text); }
.login-subtitle { display: block; color: var(--muted); font-size: 12px; margin-top: 2px; }
.login-card {
  padding: 24px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: linear-gradient(180deg, var(--surface-raised), var(--surface));
  box-shadow: var(--shadow);
}
.login-heading { font-size: 22px; margin-bottom: 8px; color: var(--text); }
.login-lead { color: var(--muted); font-size: 13px; margin-bottom: 16px; }
.login-hint { color: var(--muted); font-size: 12px; margin-top: 8px; }
.login-form { display: flex; flex-direction: column; gap: 8px; }
.login-label { color: var(--muted); font-size: 11px; text-transform: uppercase; letter-spacing: .06em; }
.login-input {
  width: 100%;
  padding: 10px 12px;
  color: var(--text);
  background: #101823;
  border: 1px solid var(--border-strong);
  border-radius: 6px;
}
.login-input:focus { border-color: #4a93ff; outline: none; box-shadow: 0 0 0 3px rgba(61,134,247,.12); }
.login-submit { margin-top: 8px; }
.login-error {
  margin-bottom: 14px; padding: 10px 12px;
  color: #ffc8ca; font-size: 13px; line-height: 1.45;
  background: rgba(229,104,112,.12); border: 1px solid rgba(229,104,112,.28);
  border-radius: 6px;
}
.sidebar-signout { margin-left: auto; white-space: nowrap; }

/* ── Collapsible sidebar ───────────────────────────────────── */
.sidebar-logo { position: relative; }
.sidebar-toggle {
  margin-left: auto;
  width: 28px; height: 28px;
  display: grid; place-items: center;
  border: 1px solid var(--border, rgba(255,255,255,.12));
  border-radius: 6px;
  background: rgba(255,255,255,.04);
  color: #9eabba;
  cursor: pointer;
  flex-shrink: 0;
  transition: color .15s, border-color .15s, background .15s;
}
.sidebar-toggle:hover { color: #fff; border-color: #4a93ff; background: rgba(61,134,247,.12); }
.sidebar-toggle-icon { transition: transform .2s ease; }
.nav-item a svg { flex-shrink: 0; }
.nav-text { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.app-shell.sidebar-collapsed .sidebar { width: 58px; min-width: 58px; }
.app-shell.sidebar-collapsed .sidebar-logo { padding: 12px 8px; justify-content: center; flex-wrap: wrap; gap: 8px; }
.app-shell.sidebar-collapsed .logo-text,
.app-shell.sidebar-collapsed .nav-label,
.app-shell.sidebar-collapsed .nav-text,
.app-shell.sidebar-collapsed .user-info,
.app-shell.sidebar-collapsed .sidebar-signout,
.app-shell.sidebar-collapsed .user-popover-footnote { display: none; }
.app-shell.sidebar-collapsed .sidebar-toggle { margin-left: 0; order: 2; }
.app-shell.sidebar-collapsed .sidebar-toggle-icon { transform: rotate(180deg); }
.app-shell.sidebar-collapsed .nav-list { padding: 0 6px; }
.app-shell.sidebar-collapsed .nav-item a { justify-content: center; padding: 9px; gap: 0; }
.app-shell.sidebar-collapsed .nav-item.active a { padding-left: 9px; box-shadow: inset 0 0 0 1px rgba(61,134,247,.45); }
.app-shell.sidebar-collapsed .sidebar-footer { margin: 8px 6px; padding: 8px; justify-content: center; }
.app-shell.sidebar-collapsed .user-avatar { margin: 0; }
.app-shell.sidebar-collapsed .user-popover { left: 6px; right: auto; min-width: 220px; }

.boundary-coords-bar {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 10px 18px; border-bottom: 1px solid var(--border);
}
.coords-row {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin-top: 6px; font-size: 11px;
}
.coords-label { color: var(--muted); font-weight: 600; }
.coords-value {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11px; color: #dce6f4; background: #101823;
  padding: 3px 6px; border-radius: 4px; border: 1px solid var(--border);
}
.coords-copy-btn { min-height: 26px; padding: 2px 8px; font-size: 11px; }

/* ── People / team admin ───────────────────────────────────── */
/* SECTION 5: Admin, insights, and settings modules */
.admin-page-intro { margin-bottom: 14px; max-width: 720px; }
.admin-page-lead { color: var(--muted); font-size: 13px; line-height: 1.55; }
.admin-card { overflow: hidden; }
.admin-table-wrap { overflow-x: auto; }
.admin-table { width: 100%; border-collapse: collapse; }
.admin-table th,
.admin-table td { padding: 12px 14px; border-bottom: 1px solid var(--border); vertical-align: middle; }
.admin-table th { color: #aebacd; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; text-align: left; background: #111a26; }
.admin-table tbody tr:hover { background: rgba(255,255,255,.02); }
.admin-name { font-weight: 600; color: var(--text); }
.admin-email { color: var(--muted); font-size: 12px; }
.admin-select {
  min-width: 140px;
  padding: 8px 10px;
  color: var(--text);
  background: #101823;
  border: 1px solid var(--border-strong);
  border-radius: 6px;
}
.admin-select:focus { border-color: #4a93ff; outline: none; }
.admin-actions { text-align: right; white-space: nowrap; }
.admin-flash { margin-bottom: 12px; padding: 10px 12px; border-radius: 6px; font-size: 13px; }
.admin-flash-success { color: #8bd69a; background: rgba(98,189,117,.12); border: 1px solid rgba(98,189,117,.24); }
.admin-flash-error { color: #ffc8ca; background: rgba(229,104,112,.12); border: 1px solid rgba(229,104,112,.28); }
.admin-create-form {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px; align-items: end; padding: 16px 18px;
}
.admin-create-field { display: flex; flex-direction: column; gap: 4px; }
.admin-create-field > span { color: var(--muted); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.admin-create-form .btn { justify-self: start; }

/* ── Insights / metrics ────────────────────────────────────── */
.insights-toolbar {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
  gap: 12px; margin-bottom: 12px;
}
.insights-filters { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px; }
.insights-filter-field { display: flex; flex-direction: column; gap: 4px; }
.insights-filter-field > span {
  color: #79879a; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
}
.insights-filter-field select,
.insights-filter-field input {
  min-width: 140px; padding: 7px 9px; color: var(--text); background: #101823;
  border: 1px solid var(--border-strong); border-radius: 6px; font-size: 12px;
}
.insights-filter-search input { min-width: 180px; }
.insights-advanced,
.insights-layout-control { position: relative; }
.insights-advanced summary,
.insights-layout-control summary {
  list-style: none;
}
.insights-advanced summary::-webkit-details-marker,
.insights-layout-control summary::-webkit-details-marker { display: none; }
.insights-icon-trigger {
  display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; padding: 0; border: 1px solid var(--border); border-radius: 8px;
  color: #aab6c6; background: #101823; cursor: pointer; flex-shrink: 0;
}
.insights-icon-trigger:hover,
.insights-icon-trigger:focus-visible {
  color: #fff; background: rgba(255,255,255,.06); border-color: rgba(145,191,255,.24); outline: none;
}
.insights-icon-trigger-btn { border: 1px solid transparent; background: transparent; }
.insights-icon-trigger-btn:hover { background: rgba(255,255,255,.05); border-color: var(--border); }
.insights-icon-trigger[aria-pressed="true"] {
  color: #91bfff; background: rgba(74,147,255,.12); border-color: rgba(74,147,255,.28);
}
.insights-advanced[open] { flex-basis: 100%; }
.insights-advanced-grid {
  margin-top: 8px; padding: 10px; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px; border: 1px solid var(--border); border-radius: 8px; background: #101823;
}
.insights-layout-menu {
  position: absolute; right: 0; top: calc(100% + 6px); z-index: 12; min-width: 260px; max-width: 320px;
  padding: 10px; border: 1px solid var(--border); border-radius: 8px; background: #101823;
  box-shadow: 0 12px 28px rgba(0,0,0,.34);
}
.insights-layout-control:not([open]) .insights-layout-menu { display: none; }
.insights-layout-hint {
  margin: 0 0 10px; color: #79879a; font-size: 11px; line-height: 1.45;
}
.insights-layout-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.insights-layout-picker { display: grid; gap: 4px; max-height: 280px; overflow: auto; }
.insights-layout-option {
  display: grid; grid-template-columns: auto 1fr; gap: 6px; align-items: center;
  padding: 4px 6px; border-radius: 6px;
}
.insights-layout-option:hover { background: rgba(255,255,255,.04); }
.insights-layout-option.is-dragging { opacity: .55; }
.insights-layout-drag,
.insights-panel-drag {
  display: none; color: #667385; font-size: 12px; line-height: 1; cursor: grab; padding: 4px 6px;
  user-select: none; flex-shrink: 0; border: 0; background: transparent;
}
.insights-layout-drag:active,
.insights-panel-drag:active { cursor: grabbing; }
.insights-panels.is-editing .insights-panel-drag,
.insights-layout-control.is-editing .insights-layout-drag { display: inline-block; }
.insights-layout-option-label {
  display: flex; align-items: center; gap: 8px; color: #c2cbd8; font-size: 12px; min-width: 0;
}
.insights-layout-option-label input { accent-color: #4a93ff; }
.insights-toolbar-links { display: flex; gap: 12px; align-items: center; }
.insights-view-switch {
  display: flex; align-items: center; gap: 4px; padding: 3px;
  border: 1px solid var(--border); border-radius: 8px; background: #101823;
}
.insights-view-label {
  padding: 0 8px; color: #79879a; font-size: 9px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .06em;
}
.insights-view-option {
  display: inline-flex; align-items: center; min-height: 28px; padding: 0 10px;
  border-radius: 6px; color: #91bfff; font-size: 11px; font-weight: 700;
  text-decoration: none; white-space: nowrap;
}
.insights-view-option:hover { color: #fff; background: rgba(74,147,255,.12); }
.insights-view-option.is-active {
  color: var(--text); background: #1a2635; box-shadow: inset 0 0 0 1px rgba(145,191,255,.14);
}
.insights-panels {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 12px; margin-bottom: 12px;
}
.insights-panel-wide { grid-column: span 2; }
.insights-panel-full { grid-column: 1 / -1; }
.insights-panel-head {
  display: flex; align-items: flex-start; gap: 8px;
}
.insights-panel-title { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.insights-panels.is-editing .insights-panel {
  outline: 1px dashed rgba(145,191,255,.28); outline-offset: -1px;
}
.insights-panel.is-dragging { opacity: .55; }
.insights-chart-card { overflow: hidden; }
.insights-chart-card.is-loading,
.insights-kpis.is-loading { opacity: .55; pointer-events: none; transition: opacity .15s; }
.insights-selection-bar {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  margin: 0 0 12px; padding: 8px 12px; border: 1px solid rgba(74,147,255,.22);
  border-radius: 8px; background: rgba(74,147,255,.06);
}
.insights-selection-label { color: #c2cbd8; font-size: 12px; }
.insights-kpi.is-active { box-shadow: inset 0 0 0 1px rgba(145,191,255,.36); }
.insights-chart-wrap { height: 200px; padding: 12px 14px 16px; }
.insights-chart-wrap-donut { height: 220px; }
.insights-chart-wrap-tall { height: 240px; }
.insights-chart-hint {
  color: #79879a; font-size: 9px; font-weight: 500; letter-spacing: .02em; text-transform: none;
}
.attention-list { list-style: none; margin: 0; padding: 8px; }
.attention-item {
  width: 100%; display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center;
  padding: 10px 12px; margin-bottom: 6px; text-align: left;
  border: 1px solid var(--border); border-radius: 8px; background: linear-gradient(145deg, #192331, #141d29);
  color: var(--text); cursor: pointer; transition: border-color .15s, background .15s;
}
.attention-item:hover { border-color: #4a93ff; background: linear-gradient(145deg, #1c2a3d, #172438); }
.attention-count {
  min-width: 28px; height: 28px; display: grid; place-items: center; border-radius: 999px;
  background: rgba(241,109,115,.15); color: #ff9ba0; font-size: 12px; font-weight: 700;
}
.attention-body strong { display: block; font-size: 12px; }
.attention-body span { display: block; color: var(--muted); font-size: 10px; margin-top: 2px; }
.attention-action { font-size: 10px; color: #91bfff; white-space: nowrap; }
.attention-empty { padding: 16px 12px; color: var(--muted); font-size: 12px; }
.insights-detail { margin-top: 0; }
.insights-detail-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
}
.insights-detail-title { flex: 1; min-width: 0; }
.insights-detail-context { display: block; color: var(--muted); font-size: 10px; margin-top: 2px; font-weight: 400; }
.insights-table-settings { position: relative; flex-shrink: 0; }
.insights-table-settings summary { list-style: none; }
.insights-table-settings summary::-webkit-details-marker { display: none; }
.insights-table-settings-menu {
  position: absolute; right: 0; top: calc(100% + 6px); z-index: 12; min-width: 220px;
  padding: 10px; border: 1px solid var(--border); border-radius: 8px; background: #101823;
  box-shadow: 0 12px 28px rgba(0,0,0,.34);
}
.insights-table-settings:not([open]) .insights-table-settings-menu { display: none; }
.insights-table-settings-label {
  margin: 0 0 6px; color: #79879a; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
}
.insights-table-settings-cols { display: grid; gap: 2px; margin-bottom: 10px; }
.insights-table-settings-cols label {
  display: flex; align-items: center; gap: 8px; padding: 5px 6px; color: #c2cbd8; font-size: 12px; border-radius: 6px;
}
.insights-table-settings-cols label:hover { background: rgba(255,255,255,.05); }
.insights-table-settings-page {
  display: flex; flex-direction: column; gap: 4px; color: #79879a; font-size: 9px; font-weight: 700; text-transform: uppercase;
}
.insights-table-settings-page select {
  padding: 7px 9px; color: var(--text); background: #101823; border: 1px solid var(--border-strong);
  border-radius: 6px; font-size: 12px; text-transform: none; font-weight: 400;
}
.insights-sort {
  display: inline-flex; align-items: center; gap: 4px; padding: 0; border: 0; background: transparent;
  color: inherit; font: inherit; font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase;
  cursor: pointer;
}
.insights-sort:hover { color: #91bfff; }
.insights-sort::after { content: '↕'; opacity: .35; font-size: 10px; }
.insights-sort.is-sorted-asc::after { content: '↑'; opacity: 1; color: #91bfff; }
.insights-sort.is-sorted-desc::after { content: '↓'; opacity: 1; color: #91bfff; }
.insights-table-footer {
  padding: 8px 14px 12px; color: var(--muted); font-size: 11px; border-top: 1px solid var(--border);
}
.insights-table .insights-sub { color: var(--muted); font-size: 10px; margin-top: 2px; }
.insights-link { color: #91bfff; font-weight: 600; }
.insights-table tr.is-overdue-row { border-left: 3px solid var(--red); }
.myjobs-progress-link { margin-bottom: 12px; }
.myjobs-progress-link a { color: #91bfff; font-size: 12px; }

@media (max-width: 900px) {
  .insights-panels { grid-template-columns: 1fr; }
  .insights-panel-wide { grid-column: span 1; }
}

/* ── Scrollbars — thin, hidden until needed ────────────────── */
@supports (scrollbar-width: thin) {
  html, body, .sidebar, .content-area, .dashboard-request-list,
  .spotlight-panel, .admin-table-wrap, #request-browser-list,
  .request-browser-panel, .operations-board {
    scrollbar-width: thin;
    scrollbar-color: rgba(130, 140, 155, 0.45) transparent;
  }
}

::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-corner { background: transparent; }
::-webkit-scrollbar-thumb {
  background-color: rgba(130, 140, 155, 0.38);
  border-radius: 999px;
  border: 1px solid transparent;
  background-clip: padding-box;
}
::-webkit-scrollbar-thumb:hover { background-color: rgba(150, 162, 178, 0.62); }

@media (hover: hover) {
  ::-webkit-scrollbar-thumb { background-color: transparent; }
  *:hover::-webkit-scrollbar-thumb { background-color: rgba(130, 140, 155, 0.42); }
  *:focus-within::-webkit-scrollbar-thumb { background-color: rgba(130, 140, 155, 0.42); }
}

/* Settings module */
.settings-page-intro { margin-bottom: 14px; }
.settings-kicker {
  margin-bottom: 3px;
  color: #8fb8ff;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.settings-form { display: block; }
.settings-workspace {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  min-height: 620px;
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
  background: #0f1722;
  box-shadow: var(--shadow);
}
.settings-subnav {
  padding: 18px 14px;
  border-right: 1px solid var(--border);
  background: #111a25;
}
.settings-subnav-title {
  margin: 0 8px 14px;
  color: #dbe6f4;
  font-size: 13px;
  font-weight: 800;
}
.settings-subnav-item {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 38px;
  padding: 8px 10px;
  border-radius: 8px;
  color: #8f9caf;
  font-size: 13px;
  text-decoration: none;
}
.settings-subnav-item:hover {
  color: #dce6f3;
  background: rgba(255,255,255,.04);
  text-decoration: none;
}
.settings-subnav-item.is-active {
  color: #fff;
  background: #1d65e8;
}
.settings-subnav-icon {
  display: inline-grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 6px;
  color: #c8d4e3;
  background: rgba(255,255,255,.08);
  font-size: 10px;
  font-weight: 800;
}
.settings-subnav-item.is-active .settings-subnav-icon {
  color: #1d65e8;
  background: #fff;
}
.settings-main {
  min-width: 0;
  padding: 22px 28px 28px;
  background: #0b1119;
}
.settings-commandbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
}
.settings-commandbar h2 {
  margin: 0;
  color: #f5f8fc;
  font-size: 20px;
  line-height: 1.25;
}
.settings-commandbar p {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
}
.settings-commandbar-actions {
  display: flex;
  align-items: center;
  gap: 9px;
}
.settings-section {
  margin-bottom: 18px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #121c29;
  overflow: hidden;
}
.settings-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 18px 12px;
  border-bottom: 1px solid var(--border);
}
.settings-section-head h3 {
  margin: 2px 0 0;
  color: #f3f7fc;
  font-size: 16px;
  line-height: 1.25;
}
.settings-section-label {
  color: #8fb8ff;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.settings-section-lead {
  margin: 0;
  padding: 14px 18px 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}
.settings-status-pill {
  flex-shrink: 0;
  padding: 4px 8px;
  color: #9ee5be;
  background: rgba(98,189,117,.12);
  border: 1px solid rgba(98,189,117,.24);
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
.settings-tile-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 16px 18px 18px;
}
.settings-tile {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  min-height: 92px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #0f1722;
}
.settings-tile-wide { grid-column: span 2; }
.settings-tile-icon {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  color: #fff;
  font-size: 13px;
  font-weight: 850;
}
.settings-tile-icon-blue { background: #1d65e8; }
.settings-tile-icon-green { background: #14966f; }
.settings-tile-icon-amber { background: #b86f13; }
.settings-tile-body { min-width: 0; }
.settings-tile-body strong,
.settings-field-label {
  display: block;
  color: #f3f7fc;
  font-size: 13px;
  font-weight: 750;
}
.settings-tile-body p,
.settings-tile-body > span {
  display: block;
  margin-top: 4px;
  color: #8f9caf;
  font-size: 12px;
  line-height: 1.45;
}
.settings-number-control {
  display: flex;
  align-items: center;
  gap: 8px;
}
.settings-number-control input {
  width: 76px;
  min-height: 42px;
  text-align: center;
  font-size: 20px;
  font-weight: 800;
}
.settings-number-control span {
  color: #8f9caf;
  font-size: 12px;
  white-space: nowrap;
}
.settings-toggle-tile {
  grid-template-columns: 34px minmax(0, 1fr) 42px;
  cursor: pointer;
}
.settings-toggle-tile input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.settings-switch {
  position: relative;
  width: 42px;
  height: 24px;
  border: 1px solid var(--border-strong);
  border-radius: 999px;
  background: #0b1119;
  transition: border-color .15s, background .15s;
}
.settings-switch::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #77859a;
  transition: transform .15s, background .15s;
}
.settings-toggle-tile input:checked + .settings-switch {
  border-color: rgba(74,147,255,.7);
  background: rgba(74,147,255,.25);
}
.settings-toggle-tile input:checked + .settings-switch::after {
  transform: translateX(18px);
  background: #76aaff;
}
.settings-toggle-tile:focus-within,
.settings-zone-tile:focus-within,
.settings-date-card:focus-within {
  border-color: #4a93ff;
  box-shadow: 0 0 0 3px rgba(61,134,247,.12);
}
.settings-zone-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 16px 18px 18px;
}
.settings-zone-tile,
.settings-date-card {
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-height: 76px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #0f1722;
}
.settings-zone-tile-empty {
  background: rgba(15,23,34,.62);
  border-style: dashed;
}
.settings-zone-mark {
  width: 10px;
  height: 10px;
  border-radius: 4px;
  background: #4a93ff;
}
.settings-zone-tile:nth-child(2n) .settings-zone-mark { background: #32b48f; }
.settings-zone-tile:nth-child(3n) .settings-zone-mark { background: #d48b2b; }
.settings-zone-copy {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}
.settings-zone-copy > span {
  color: #94a4b8;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.settings-calendar-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, .55fr);
  gap: 12px;
  padding: 16px 18px 18px;
}
.settings-holiday-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-content: flex-start;
  min-height: 76px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #0f1722;
}
.settings-holiday-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  padding: 6px 10px;
  color: #dbe6f4;
  background: #121c29;
  border: 1px solid var(--border);
  border-radius: 999px;
  font-size: 12px;
  cursor: pointer;
}
.settings-holiday-chip input { accent-color: #4a93ff; }
.settings-empty-state {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  align-self: center;
}
.settings-date-card {
  grid-template-columns: 34px minmax(0, 1fr);
}

@media (max-width: 1050px) {
  .settings-workspace { grid-template-columns: 1fr; }
  .settings-subnav {
    display: flex;
    align-items: center;
    gap: 6px;
    overflow-x: auto;
    border-right: 0;
    border-bottom: 1px solid var(--border);
  }
  .settings-subnav-title { margin: 0 8px 0 0; }
  .settings-subnav-item { flex: 0 0 auto; }
}

@media (max-width: 720px) {
  .settings-main { padding: 16px; }
  .settings-commandbar { flex-direction: column; }
  .settings-commandbar-actions { width: 100%; }
  .settings-commandbar-actions .btn { flex: 1; }
  .settings-tile-grid,
  .settings-zone-grid,
  .settings-calendar-grid {
    grid-template-columns: 1fr;
  }
  .settings-tile-wide { grid-column: span 1; }
  .settings-tile,
  .settings-toggle-tile {
    grid-template-columns: 34px minmax(0, 1fr);
  }
  .settings-switch,
  .settings-number-control {
    grid-column: 2;
    justify-self: start;
  }
}

@media (max-width: 560px) {
  .settings-subnav { padding: 10px; }
  .settings-subnav-title { display: none; }
  .settings-section-head { flex-direction: column; }
  .settings-tile-grid,
  .settings-zone-grid,
  .settings-calendar-grid {
    padding: 12px;
  }
  .settings-number-control {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* Inbox */
.nav-inbox-link { position: relative; }
.nav-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  margin-left: auto;
  padding: 0 5px;
  border-radius: 999px;
  background: #2f80ed;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
}
.inbox-page { max-width: none; width: min(100%, 1660px); }
.inbox-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
  max-width: none;
}
.inbox-title { margin: 0; font-size: 18px; font-weight: 650; color: var(--text); letter-spacing: 0; }
.inbox-subtitle { margin: 4px 0 0; font-size: 13px; color: var(--muted); }
.inbox-tabs,
.inbox-activity-toolbar {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  width: max-content;
  margin-bottom: 14px;
  padding: 3px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 8px;
  background: rgba(255,255,255,.035);
}
.inbox-activity-toolbar { margin-bottom: 16px; }
.inbox-tab,
.inbox-filter-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 28px;
  padding: 5px 10px;
  border: 1px solid transparent;
  border-radius: 6px;
  color: #c7cfda;
  font-size: 12px;
  font-weight: 650;
  line-height: 1;
  text-decoration: none;
}
.inbox-tab:hover,
.inbox-filter-tab:hover { color: #fff; background: rgba(255,255,255,.045); }
.inbox-tab.is-active,
.inbox-filter-tab.is-active {
  color: #fff;
  border-color: rgba(255,255,255,.14);
  background: rgba(255,255,255,.08);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035);
}
.inbox-tab-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: rgba(152,164,180,.25);
  color: #e6edf7;
  font-size: 10px;
  font-weight: 700;
}
.inbox-filters { margin-bottom: 16px; }
.inbox-group { margin-bottom: 10px; }
.inbox-group-label {
  margin: 0 0 7px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--muted);
}
.inbox-list {
  list-style: none;
  margin: 0;
  padding: 0;
  max-width: 1660px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 8px;
  overflow: hidden;
  background: rgba(255,255,255,.015);
}
.inbox-item {
  position: relative;
  border: 0;
  border-bottom: 1px solid rgba(255,255,255,.055);
  border-radius: 0;
  background: transparent;
  margin-bottom: 0;
}
.inbox-item:last-child { border-bottom: 0; }
.inbox-item.is-unread {
  border-color: rgba(255,255,255,.055);
  background: rgba(255,255,255,.025);
}
.inbox-item-link {
  display: flex;
  gap: 11px;
  align-items: flex-start;
  min-height: 52px;
  padding: 8px 56px 8px 13px;
  color: inherit;
  text-decoration: none;
}
.inbox-item-link:hover { color: #fff; background: rgba(255,255,255,.035); }
.inbox-item-icon {
  flex: 0 0 8px;
  width: 8px;
  height: 8px;
  margin-top: 6px;
  border-radius: 50%;
  background: var(--muted);
}
.inbox-item-icon-request_submitted,
.inbox-item-icon-accepted { background: var(--teal); }
.inbox-item-icon-on_hold { background: #f0ad4e; }
.inbox-item-icon-resumed { background: #4d96ff; }
.inbox-item-icon-cancelled { background: #e06c75; }
.inbox-item-icon-completed { background: #5cb85c; }
.inbox-item-icon-overdue { background: #ff6b6b; }
.inbox-item-body { min-width: 0; flex: 1; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1px 12px; }
.inbox-item-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
  font-size: 11px;
  color: var(--muted);
  grid-column: 1 / 2;
}
.inbox-item-type { font-weight: 650; color: #c4cad4; }
.inbox-item-request { font-family: ui-monospace, monospace; }
.inbox-item-time { grid-column: 2; grid-row: 1; margin-left: auto; font-size: 12px; color: #9aa2af; }
.inbox-item-title { grid-column: 1; font-size: 13px; font-weight: 650; color: var(--text); line-height: 1.25; }
.inbox-item-summary {
  grid-column: 1 / -1;
  font-size: 12px;
  color: #a7afbd;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.inbox-unread-dot {
  position: absolute;
  top: 18px;
  right: 42px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #4d96ff;
}
.inbox-mark-read-form {
  position: absolute;
  top: 10px;
  right: 12px;
}
.inbox-mark-read-btn {
  width: 24px;
  height: 24px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
}
.inbox-mark-read-btn:hover { color: #fff; border-color: rgba(255,255,255,.28); background: rgba(255,255,255,.05); }
.inbox-empty {
  padding: 32px 20px;
  border: 1px dashed var(--border);
  border-radius: 12px;
  text-align: center;
  background: rgba(255,255,255,.02);
}
.inbox-empty-title { margin: 0 0 6px; font-size: 16px; font-weight: 600; color: var(--text); }
.inbox-empty-body { margin: 0; font-size: 13px; color: var(--muted); }
.inbox-work { max-width: 1660px; }
.inbox-work-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.inbox-work-filter-group,
.inbox-work-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.inbox-work-filter-group { flex-wrap: wrap; }
.inbox-work-control {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #8995a5;
  font-size: 11px;
  font-weight: 650;
}
.inbox-work-control span {
  text-transform: uppercase;
  letter-spacing: .05em;
}
.inbox-work-control select,
.inbox-work-search input {
  min-height: 32px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 7px;
  background: #101722;
  color: var(--text);
  font-size: 12px;
}
.inbox-work-control select {
  min-width: 150px;
  padding: 6px 28px 6px 10px;
}
.inbox-work-search input {
  min-width: 220px;
  padding: 7px 10px;
}
.inbox-work-list {
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 8px;
  overflow: hidden;
  background: rgba(255,255,255,.015);
}
.inbox-work-row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(280px, 1fr) minmax(110px, auto) minmax(130px, auto) auto;
  gap: 12px;
  align-items: center;
  min-height: 72px;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(255,255,255,.055);
  background: transparent;
}
.inbox-work-row:last-child { border-bottom: 0; }
.inbox-work-row:hover { background: rgba(255,255,255,.035); }
.inbox-work-row.is-overdue { box-shadow: inset 2px 0 rgba(241,109,115,.75); }
.inbox-work-main { min-width: 0; }
.inbox-work-main h3 {
  margin: 4px 0 3px;
  color: var(--text);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.25;
}
.inbox-work-main p {
  margin: 0;
  color: #a7afbd;
  font-size: 12px;
  line-height: 1.35;
}
.inbox-work-board { margin-top: 0; }
.inbox-work-card { min-height: 0; }
.inbox-work-empty { margin: 12px 0 0; color: var(--muted); font-size: 13px; }
.inbox-jobs { max-width: 1660px; }
.inbox-open-requests { max-width: 1660px; }
.inbox-jobs .myjobs-filters { margin: 0 0 10px; }
.inbox-open-requests .jobboard-filters { margin: 0 0 10px; }
.inbox-board-toolbar {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  margin: -4px 0 10px;
}
.inbox-jobs-list {
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 8px;
  overflow: hidden;
  background: rgba(255,255,255,.015);
}
.inbox-jobs-board { margin-top: 0; }
.inbox-job-card { min-height: 0; }
.inbox-open-list {
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 8px;
  overflow: hidden;
  background: rgba(255,255,255,.015);
}
.inbox-job-row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(280px, 1fr) minmax(110px, auto) minmax(130px, auto) auto;
  gap: 12px;
  align-items: center;
  min-height: 72px;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(255,255,255,.055);
  background: transparent;
}
.inbox-open-row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(280px, 1fr) minmax(110px, auto) minmax(130px, auto) auto;
  gap: 12px;
  align-items: center;
  min-height: 72px;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(255,255,255,.055);
  background: transparent;
}
.inbox-open-row:last-child { border-bottom: 0; }
.inbox-open-row:hover { background: rgba(255,255,255,.035); }
.inbox-open-row.is-overdue { box-shadow: inset 2px 0 rgba(241,109,115,.75); }
.inbox-job-row:last-child { border-bottom: 0; }
.inbox-job-row:hover { background: rgba(255,255,255,.035); }
.inbox-job-row.is-overdue { box-shadow: inset 2px 0 rgba(241,109,115,.75); }
.inbox-job-main { min-width: 0; }
.inbox-open-main { min-width: 0; }
.inbox-job-meta {
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--muted);
  font-size: 11px;
}
.inbox-job-meta span:last-child { font-family: ui-monospace, monospace; color: #c5cbd6; }
.inbox-job-main h3,
.inbox-open-main h3 {
  margin: 4px 0 3px;
  color: var(--text);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.25;
}
.inbox-job-main p,
.inbox-open-main p,
.inbox-job-note {
  margin: 0;
  color: #a7afbd;
  font-size: 12px;
  line-height: 1.35;
}
.inbox-job-detail {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.inbox-job-detail span {
  color: #7f8da0;
  font-size: 9px;
  font-weight: 650;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.inbox-job-detail strong {
  color: #dbe3ee;
  font-size: 12px;
  font-weight: 650;
  white-space: nowrap;
}
.inbox-job-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
}
.inbox-job-actions form { display: flex; }
.inbox-job-note {
  grid-column: 1 / -1;
  padding-top: 8px;
  border-top: 1px solid rgba(255,255,255,.055);
}
.inbox-jobs-empty { margin: 12px 0 0; color: var(--muted); font-size: 13px; }
.myjobs-filter-hidden { display: none !important; }
@media (max-width: 1100px) {
  .inbox-work-toolbar { align-items: stretch; flex-direction: column; }
  .inbox-work-filter-group { width: 100%; }
  .inbox-work-control,
  .inbox-work-search { width: 100%; }
  .inbox-work-control select,
  .inbox-work-search input { width: 100%; }
  .inbox-work-row { grid-template-columns: 1fr; align-items: flex-start; }
  .inbox-job-row { grid-template-columns: 1fr; align-items: flex-start; }
  .inbox-open-row { grid-template-columns: 1fr; align-items: flex-start; }
  .inbox-job-actions { justify-content: flex-start; }
  .inbox-board-toolbar { justify-content: flex-start; flex-wrap: wrap; }
}