﻿/* App is dark-mode only (no light theme). */
:root,
html,
html[data-theme="night"],
html[data-theme="day"] {
  --shell-header-sticky: calc(190px + env(safe-area-inset-top));
  --resources-jump-sticky: 52px;
  --resources-jump-top-gap: 8px;
  /* Equal space between every chip (login + Resources) */
  --ops-chip-gap: 14px;
  --bg: #0f1218;
  --surface: #1a1f2a;
  --surface-2: #222836;
  --ink: #e8edf5;
  --muted: #9aa6b8;
  --line: #2c3444;
  --brand: #1c1f24;
  --brand-2: #12141a;
  --accent: #b8ad86;
  --accent-soft: #3a372c;
  --ok: #3ecf8e;
  --warn: #e0a04a;
  --bad: #f07167;
  --info: #6cb6e0;
  --shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
  --radius: 10px;
  --font: "Segoe UI", system-ui, -apple-system, sans-serif;
  --card: #1a1f2a;
  color-scheme: dark;
}

html body {
  color-scheme: dark;
}

/* ---- Night mode: surfaces, forms, controls (site-wide) ---- */
html[data-theme="night"] .metric,
html[data-theme="night"] .card,
html[data-theme="night"] .auth-card,
html[data-theme="night"] .live-status-board,
html[data-theme="night"] .unit-calls-graph-card,
html[data-theme="night"] .unit-leaderboard,
html[data-theme="night"] .unit-call-card {
  background: var(--surface);
  color: var(--ink);
  border-color: var(--line);
}

html[data-theme="night"] .bottom-nav {
  background: var(--surface);
  border-color: var(--line);
}

html[data-theme="night"] .bottom-nav button {
  color: var(--muted);
}

html[data-theme="night"] .bottom-nav button.active {
  color: var(--accent);
}

html[data-theme="night"] input:not([type="checkbox"]):not([type="radio"]),
html[data-theme="night"] select,
html[data-theme="night"] textarea {
  background: var(--surface-2);
  color: var(--ink);
  border-color: var(--line);
  color-scheme: dark;
}

html[data-theme="night"] input::placeholder,
html[data-theme="night"] textarea::placeholder {
  color: var(--muted);
  opacity: 0.85;
}

html[data-theme="night"] select option,
html[data-theme="night"] select optgroup {
  background: #1a1f2a;
  color: #e8edf5;
}


html[data-theme="night"] .btn-secondary,
html[data-theme="night"] .btn-compact.btn-secondary {
  background: var(--surface-2);
  border-color: var(--line);
  color: var(--ink);
}

html[data-theme="night"] .btn-primary {
  background: var(--accent);
  color: #14161c;
}

html[data-theme="night"] .btn-danger {
  background: rgba(240, 113, 103, 0.15);
  border-color: rgba(240, 113, 103, 0.45);
  color: var(--bad);
}

html[data-theme="night"] .text-btn {
  color: var(--accent);
}

html[data-theme="night"] .pilot-notif-title,
html[data-theme="night"] .pilot-notif-item strong,
html[data-theme="night"] .pilot-menu-notifs-head strong {
  color: #f2f5fa !important;
}

html[data-theme="night"] .pilot-notif-body {
  color: #b8c2d1 !important;
}

html[data-theme="night"] .pilot-notif-type {
  color: var(--accent) !important;
}

html[data-theme="night"] .pilot-notif-time {
  color: #9aa6b8 !important;
}

html[data-theme="night"] .pilot-notif-item {
  background: var(--surface);
  border-color: var(--line);
  color: #e8edf5;
}

html[data-theme="night"] .pilot-notif-item.is-unread {
  background: rgba(184, 173, 134, 0.14);
}

html[data-theme="night"] .pilot-menu-notifs-block,
html[data-theme="night"] .pilot-menu-notifs-head {
  background: var(--surface-2);
  border-color: var(--line);
  color: #e8edf5;
}

html[data-theme="night"] .pilot-menu-user {
  color: #f2f5fa;
}

/* Metric bubbles (Part 107 / Training / Calls) â€” light text on dark tiles */
html[data-theme="night"] .metric,
html[data-theme="night"] a.metric--home-jump,
html[data-theme="night"] button.metric--home-jump {
  background: var(--surface-2) !important;
  border-color: var(--line) !important;
  color: #e8edf5 !important;
}

html[data-theme="night"] .metric .label,
html[data-theme="night"] a.metric--home-jump .label,
html[data-theme="night"] button.metric--home-jump .label {
  color: #b8c2d1 !important;
}

html[data-theme="night"] .metric strong,
html[data-theme="night"] a.metric--home-jump strong,
html[data-theme="night"] button.metric--home-jump strong {
  color: #f5f7fb !important;
}

html[data-theme="night"] .metric span:last-child,
html[data-theme="night"] a.metric--home-jump span:last-child,
html[data-theme="night"] button.metric--home-jump span:last-child {
  color: #b8c2d1 !important;
}

html[data-theme="night"] .unit-calls-graph-canvas,
html[data-theme="night"] canvas {
  background: var(--surface-2) !important;
  border-radius: 6px;
}

html[data-theme="night"] .section-hint,
html[data-theme="night"] .card-sub,
html[data-theme="night"] label {
  color: var(--muted);
}

html[data-theme="night"] .readout dt {
  color: var(--muted);
}

html[data-theme="night"] .readout dd {
  color: var(--ink);
}

html[data-theme="night"] .unit-calls-range-btn {
  background: var(--surface-2);
  color: var(--ink);
  border-color: var(--line);
}

html[data-theme="night"] .unit-calls-range-btn.is-active {
  background: var(--accent-soft);
  color: var(--accent);
  border-color: var(--accent);
}

html[data-theme="night"] .unit-calls-sort select,
html[data-theme="night"] .unit-calls-pilot-filter select {
  background: var(--surface-2);
  color: var(--ink);
  border-color: var(--line);
}

/* Resources / checklists / custody — theme hierarchy (outer card vs inner rows) */
html[data-theme="night"] .resources-section-card,
html[data-theme="night"] .resources-documents-card,
html[data-theme="night"] .resources-jump-card,
html[data-theme="night"] .embed-card {
  background: var(--surface) !important;
  border-color: var(--line) !important;
  color: var(--ink) !important;
}

html[data-theme="night"] .checklist li,
html[data-theme="night"] .custody-check,
html[data-theme="night"] .custody-attest,
html[data-theme="night"] .custody-equip-block,
html[data-theme="night"] .custody-item-review,
html[data-theme="night"] .checklist-banner,
html[data-theme="night"] .resources-jump-link,
html[data-theme="night"] .ref-card,
html[data-theme="night"] .doc-item,
html[data-theme="night"] .table-wrap,
html[data-theme="night"] .flow-step {
  background: var(--surface-2) !important;
  border-color: var(--line) !important;
  color: var(--ink) !important;
}

html[data-theme="night"] .checklist li.done {
  background: color-mix(in srgb, var(--ok) 14%, var(--surface-2)) !important;
  border-color: color-mix(in srgb, var(--ok) 40%, var(--line)) !important;
}

html[data-theme="night"] .checklist label,
html[data-theme="night"] .custody-check,
html[data-theme="night"] .custody-attest,
html[data-theme="night"] .checklist-banner-text,
html[data-theme="night"] .checklist-banner-text strong,
html[data-theme="night"] .resources-jump-link,
html[data-theme="night"] .resources-section-title,
html[data-theme="night"] .resources-section-sub {
  color: var(--ink) !important;
}

html[data-theme="night"] .checklist-banner {
  background: color-mix(in srgb, var(--accent) 8%, var(--surface-2)) !important;
  border-color: var(--line) !important;
}

html[data-theme="night"] .checklist.is-complete .checklist-banner {
  background: color-mix(in srgb, var(--ok) 12%, var(--surface-2)) !important;
}

html[data-theme="night"] .custody-attest {
  background: color-mix(in srgb, var(--accent) 18%, var(--surface-2)) !important;
  border-left-color: var(--accent) !important;
}

html[data-theme="night"] .checklist-section strong {
  color: var(--accent) !important;
}

html[data-theme="night"] .ref-card--emergency {
  background: color-mix(in srgb, var(--bad) 12%, var(--surface-2)) !important;
  border-color: color-mix(in srgb, var(--bad) 55%, var(--line)) !important;
  color: var(--ink) !important;
}

html[data-theme="night"] .ref-card--emergency h3 {
  color: var(--bad) !important;
}

html[data-theme="night"] .ref-card--emergency ul,
html[data-theme="night"] .ref-card--emergency li {
  color: var(--ink) !important;
  font-weight: 500;
}

html[data-theme="night"] .doc-item a,
html[data-theme="night"] .checklist-source a {
  color: var(--accent) !important;
}

* {
  box-sizing: border-box;
}

[hidden] {
  display: none !important;
}

html {
  scroll-behavior: smooth;
  /* -webkit-text-size-adjust and text-size-adjust removed.
     They were triggering "declaration dropped" warnings in Firefox
     (and are legacy anyway â€” viewport meta handles this now). */
}

body {
  margin: 0;
  min-height: 100vh;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font);
  font-size: 15px;
  line-height: 1.5;
}

button,
input,
select,
textarea {
  font: inherit;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

a {
  color: var(--info);
}

.storage-mode-banner {
  margin: 0;
  padding: 10px 18px;
  border-radius: 0;
  border-bottom: 1px solid var(--line);
  font-size: 0.9rem;
}

.storage-mode-banner a {
  color: inherit;
  text-decoration: underline;
}

/* Bottom toast â€” replaces old full-width top strip */
.app-message {
  position: fixed;
  left: 50%;
  bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  z-index: 120;
  box-sizing: border-box;
  width: min(28rem, calc(100vw - 24px));
  margin: 0;
  padding: 12px 14px 12px 16px;
  border-radius: 12px;
  border: 1px solid var(--line);
  border-left-width: 4px;
  font-size: 0.9rem;
  font-weight: 650;
  line-height: 1.35;
  background: var(--surface);
  color: var(--ink);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.28);
  transform: translate(-50%, 120%);
  opacity: 0;
  pointer-events: none;
  transition: transform 0.22s ease, opacity 0.22s ease;
}

/* Pilot bottom nav sits above this toast */
body.pilot-app.pilot-signed-in .app-message {
  bottom: calc(72px + env(safe-area-inset-bottom, 0px));
}

.app-message:not([hidden]) {
  pointer-events: auto;
}

.app-message.app-message--visible {
  transform: translate(-50%, 0);
  opacity: 1;
}

.app-message.app-message--ok {
  border-left-color: var(--ok, #0d7a4d);
  background: color-mix(in srgb, var(--ok, #0d7a4d) 12%, var(--surface));
  color: var(--ink);
}

.app-message.app-message--warn {
  border-left-color: var(--warn, #b45309);
  background: color-mix(in srgb, var(--warn, #b45309) 14%, var(--surface));
  color: var(--ink);
}

.app-message.app-message--bad {
  border-left-color: var(--bad, #b42318);
  background: color-mix(in srgb, var(--bad, #b42318) 14%, var(--surface));
  color: var(--ink);
}

html[data-theme="night"] .app-message {
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.5);
}

.shell-header {
  position: sticky;
  top: 0;
  z-index: 40;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  padding-top: calc(10px + env(safe-area-inset-top));
  padding-right: clamp(10px, 3vw, 16px);
  padding-bottom: 20px;
  padding-left: clamp(10px, 3vw, 16px);
  background: linear-gradient(120deg, var(--brand), var(--brand-2));
  color: #fff;
  border-bottom: 2px solid var(--accent);
  text-align: center;
}

.shell-header-util {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  width: 100%;
  min-height: 26px;
}

.shell-header-util:has(#logoutBtn[hidden]) {
  display: none;
}

.shell-logout {
  min-height: 30px;
  padding: 5px 12px;
  font-size: 0.76rem;
}

.pilot-app .shell-logout {
  border-color: rgba(255, 255, 255, 0.55);
  background: rgba(0, 0, 0, 0.2);
  color: #fff;
}

.pilot-app .shell-logout:hover {
  background: rgba(0, 0, 0, 0.35);
}

.shell-header-top {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 8px;
  width: 100%;
  position: relative;
}

/* Brand stays centered; account menu is absolute on the right */
.shell-header-top .shell-brand {
  flex: 0 1 auto;
  width: auto;
  max-width: min(100%, 36rem);
  min-width: 0;
  margin: 0 auto;
  justify-content: center;
}

body.pilot-app.pilot-signed-in .shell-header-top .shell-brand {
  max-width: min(100%, calc(100% - 3.5rem));
  box-sizing: border-box;
}

/* ---- Pilot account hamburger menu (top right) ---- */
.pilot-menu-host {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 50;
  overflow: visible;
}

body.pilot-app.pilot-signed-out .pilot-menu-host {
  display: none !important;
}

.pilot-menu-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.45);
  background: rgba(0, 0, 0, 0.22);
  color: #fff;
  cursor: pointer;
  padding: 0;
  overflow: visible;
}

.pilot-menu-btn:hover {
  background: rgba(0, 0, 0, 0.36);
}

.pilot-menu-icon {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 18px;
}

.pilot-menu-icon span {
  display: block;
  height: 2px;
  width: 100%;
  border-radius: 2px;
  background: #fff;
}

.pilot-menu-panel {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: min(340px, calc(100vw - 24px));
  height: min(88vh, 680px);
  max-height: min(88vh, 680px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: 10px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--ink);
  box-shadow: var(--shadow);
  gap: 12px;
}

/* Log Out — right-justified in the notification / account menu */
.pilot-menu-top-actions {
  flex: 0 0 auto;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 6px;
  margin: 0 0 2px;
  padding: 0;
  border-bottom: 0;
}

.pilot-menu-top-actions .pilot-menu-item--top {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: 6.5rem;
  flex: 0 0 auto;
  box-sizing: border-box;
  margin: 0;
  padding: 10px 14px;
  min-height: 40px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: var(--surface-2);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-align: center;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pilot-menu-top-actions .pilot-menu-item--top > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pilot-menu-top-actions .pilot-menu-item--top:hover {
  background: color-mix(in srgb, var(--surface-2) 70%, var(--accent) 10%);
  border-color: color-mix(in srgb, var(--accent) 35%, var(--line));
}

.pilot-menu-top-actions .pilot-menu-item--danger {
  color: var(--bad);
  border-color: color-mix(in srgb, var(--bad) 35%, var(--line));
}

.pilot-menu-top-actions .pilot-menu-item--danger:hover {
  background: color-mix(in srgb, var(--surface-2) 75%, var(--bad) 12%);
  border-color: color-mix(in srgb, var(--bad) 50%, var(--line));
  color: var(--bad);
}

/* Account stack: profile chip + Part 107 license chip */
.pilot-menu-account {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 0;
  margin: 0 0 2px;
  border-bottom: 0;
  word-break: break-word;
}

/* Larger chip: name, role, status badges, metric chips (matches Part 107 chip style) */
.pilot-menu-profile-chip {
  margin: 0;
  padding: 10px 10px 10px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: var(--surface-2);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  text-align: center;
}

.pilot-menu-profile-chip .pilot-menu-metrics {
  margin-bottom: 0;
}

.pilot-menu-profile-chip .pilot-menu-part107-link,
.pilot-menu-profile-chip .pilot-menu-part107-missing {
  margin-top: 0;
}

.pilot-menu-identity {
  text-align: center;
}

.pilot-menu-user-name {
  font-weight: 700;
  font-size: 0.95rem;
  color: var(--ink);
  line-height: 1.25;
}

.pilot-menu-user-role {
  margin-top: 2px;
  font-weight: 600;
  font-size: 0.8rem;
  color: var(--muted);
  line-height: 1.25;
}

.pilot-menu-user-status {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: center;
  align-items: center;
}

.pilot-menu-user-detail {
  margin: 0;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--muted);
  line-height: 1.3;
  text-align: center;
}

.pilot-menu-metrics {
  margin: 0;
  gap: 6px;
}

.pilot-menu-metrics .metric {
  min-height: 0;
  padding: 8px 4px;
  background: var(--surface);
  box-shadow: none;
}

.pilot-menu-metrics .metric .label {
  font-size: 0.58rem;
}

.pilot-menu-metrics .metric strong {
  font-size: 1.05rem;
  margin: 2px 0 0;
}

.pilot-menu-metrics .metric span:last-child {
  font-size: 0.55rem;
}

html[data-theme="night"] .pilot-menu-profile-chip {
  background: color-mix(in srgb, var(--surface-2) 92%, #000);
}

html[data-theme="night"] .pilot-menu-metrics .metric,
html[data-theme="night"] .pilot-menu-metrics button.metric--home-jump {
  background: var(--surface) !important;
}

/* View Your License â€” plain full-width button under metric chips (no nested chip) */
.pilot-menu-part107-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  width: 100%;
  box-sizing: border-box;
  padding: 8px 12px;
  border-radius: 8px;
  border: 1px solid color-mix(in srgb, var(--accent) 45%, var(--line));
  background: var(--surface);
  color: var(--accent);
  font-size: 0.78rem;
  font-weight: 700;
  text-decoration: none;
  line-height: 1.25;
}

.pilot-menu-part107-link:hover {
  border-color: var(--accent);
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.08);
}

.pilot-menu-part107-missing {
  display: block;
  margin: 0;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--muted);
  line-height: 1.3;
  text-align: center;
}

.pilot-menu-notifs-block {
  flex: 1 1 auto;
  min-height: 0;
  /* Extra space after Part 107 / account block (panel gap + this) */
  margin: 4px 0 0;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2);
  overflow: hidden;
}

.pilot-menu-notifs-head {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 10px 8px;
  border-bottom: 1px solid var(--line);
  background: var(--surface-2);
  z-index: 1;
}

.pilot-menu-notifs-head strong {
  flex: 1 1 auto;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
}

.pilot-menu-notifs-actions {
  flex: 0 0 auto;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  align-items: stretch;
}

/* Swipe-to-remove notification rows */
.pilot-notif-swipe {
  position: relative;
  overflow: hidden;
  list-style: none;
  border-bottom: 1px solid var(--line);
}

/* Admin important messages: no swipe / remove for pilots */
.pilot-notif-swipe--locked {
  overflow: visible;
}

.pilot-notif-swipe--locked .pilot-notif-item {
  transform: none !important;
}

.pilot-notif-swipe-actions {
  position: absolute;
  inset: 0 0 0 auto;
  width: 96px;
  display: flex;
  align-items: stretch;
  justify-content: stretch;
  z-index: 0;
}

.pilot-notif-dismiss-btn {
  width: 100%;
  border: 0;
  margin: 0;
  padding: 0;
  background: var(--bad);
  color: #fff;
  font-weight: 800;
  font-size: 0.78rem;
  letter-spacing: 0.02em;
  cursor: pointer;
}

.pilot-notif-swipe .pilot-notif-item {
  position: relative;
  z-index: 1;
  background: var(--surface);
  border-bottom: 0;
  touch-action: pan-y;
  will-change: transform;
}

.pilot-notif-swipe.is-revealed .pilot-notif-item {
  box-shadow: -4px 0 12px rgba(0, 0, 0, 0.12);
}

html[data-theme="night"] .pilot-notif-swipe .pilot-notif-item {
  background: var(--surface);
}

.pilot-menu-notif-action,
.pilot-menu-enable-alerts {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: 38px;
  padding: 6px 4px;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.15;
  white-space: normal;
  color: var(--ink);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
}

.pilot-menu-notif-action:hover,
.pilot-menu-enable-alerts:hover {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--line));
  color: var(--accent);
}

.pilot-menu-notif-action--danger {
  color: var(--bad);
  border-color: color-mix(in srgb, var(--bad) 40%, var(--line));
}

.pilot-menu-notif-action--danger:hover {
  color: var(--bad);
  border-color: var(--bad);
}

.pilot-menu-notifs-list {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

.pilot-menu-notifs-list .pilot-notif-list {
  margin: 0;
  padding: 0;
}

.pilot-menu-notifs-list .pilot-notif-item {
  border-radius: 0;
  border-left: 0;
  border-right: 0;
}

.pilot-notif-panel-foot--inline {
  position: static;
  border-top: 1px solid var(--line);
  background: transparent;
  padding: 8px 10px 10px;
}

/* Back-compat if older markup still references this class */
.pilot-menu-user {
  flex: 0 0 auto;
  padding: 0;
  margin: 0;
  border-bottom: 0;
  word-break: break-word;
}

html[data-theme="night"] .pilot-menu-part107-link {
  color: #9ec5ff;
  border-color: color-mix(in srgb, #5b8fd9 50%, var(--line));
  background: var(--surface);
}

.kit-picker--no-label {
  gap: 0;
}

.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;
}

.pilot-menu-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  margin: 0;
  padding: 11px 12px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.pilot-menu-item:hover {
  background: var(--surface-2);
}

.pilot-menu-item--danger {
  color: var(--bad);
  font-weight: 600;
}

.pilot-menu-item-badge {
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  background: #e53935;
  color: #fff;
  font-size: 0.7rem;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* notif panel still under menu host (top-right) */

/* Unread count bubble on the hamburger button */
.pilot-menu-btn .pilot-notif-badge {
  position: absolute;
  top: -5px;
  right: -5px;
  z-index: 2;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: #e53935;
  color: #fff;
  font-size: 0.65rem;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  border: 2px solid rgba(255, 255, 255, 0.95);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
  pointer-events: none;
}

.pilot-menu-btn .pilot-notif-badge[hidden] {
  display: none !important;
}

.pilot-notif-panel {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  width: min(360px, calc(100vw - 24px));
  max-height: min(70vh, 480px);
  overflow: auto;
  background: var(--surface);
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: var(--shadow);
  text-align: left;
}

.pilot-notif-panel-head,
.pilot-notif-panel-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  position: sticky;
  top: 0;
  background: var(--surface);
  z-index: 1;
}

.pilot-notif-panel-foot {
  border-bottom: 0;
  border-top: 1px solid var(--line);
  bottom: 0;
  top: auto;
}

.pilot-notif-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}

.pilot-notif-item {
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
}

.pilot-notif-item.is-unread {
  background: #fff8e6;
}

/* Sticky important messages â€” pinned red, stay until admin clears / expires */
.pilot-notif-item.pilot-notif-item--important {
  order: -1;
  background: rgba(200, 40, 40, 0.12);
  border-left: 4px solid #c62828;
  border-bottom-color: rgba(200, 40, 40, 0.35);
}

.pilot-notif-item.pilot-notif-item--important.is-unread {
  background: rgba(200, 40, 40, 0.16);
}

.pilot-notif-type--important {
  color: #c62828 !important;
}

.pilot-notif-item--important .pilot-notif-title {
  color: #b71c1c;
}

.pilot-notif-item--important .pilot-notif-body {
  white-space: pre-wrap;
  color: var(--ink);
}

html[data-theme="night"] .pilot-notif-item.pilot-notif-item--important {
  background: rgba(240, 113, 103, 0.14);
  border-left-color: #f07167;
  border-bottom-color: rgba(240, 113, 103, 0.35);
}

/* Part 107 critical sticky â€” same treatment as important (cannot pilot-clear) */
.pilot-notif-item.pilot-notif-item--part107 {
  order: -1;
}

html[data-theme="night"] .pilot-notif-item--important .pilot-notif-title {
  color: #ffb4a8;
}

html[data-theme="night"] .pilot-notif-type--important {
  color: #f07167 !important;
}

.pilot-notif-item-top {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 2px;
}

.pilot-notif-type {
  font-size: 0.68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--brand);
}

.pilot-notif-time {
  font-size: 0.68rem;
  color: var(--muted);
  font-weight: 600;
  white-space: nowrap;
}

.pilot-notif-title {
  display: block;
  font-size: 0.9rem;
  margin: 0 0 2px;
  color: var(--ink);
  font-weight: 700;
}

.pilot-notif-body {
  margin: 0;
  font-size: 0.82rem;
  color: var(--muted);
  line-height: 1.35;
  overflow-wrap: anywhere;
  white-space: pre-line;
}

.pilot-notif-stream-link {
  color: var(--accent, #c4a574);
  font-weight: 600;
  text-decoration: underline;
  cursor: pointer;
}

.pilot-notif-stream-link:hover {
  color: var(--text, #f5f0e6);
}

.pilot-notif-empty {
  padding: 16px 12px;
  color: var(--muted);
  font-size: 0.9rem;
  text-align: center;
}


.shell-brand {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  gap: 12px;
  padding: 0;
  text-align: left;
}

@media (max-width: 480px) {
  .shell-brand {
    flex-direction: column;
    text-align: center;
    gap: 4px;
  }
  .shell-logo {
    height: 72px;
  }
}

.shell-brand-dept {
  margin: 0;
  max-width: 100%;
  color: #cbd5e1;
  font-size: clamp(0.78rem, 2.6vw, 1rem);
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: 0.01em;
}

.shell-brand-title {
  margin: 0;
  max-width: 100%;
  font-size: clamp(1.22rem, 5vw, 1.72rem);
  line-height: 1.12;
  letter-spacing: 0.01em;
}

.shell-logo {
  height: 96px;
  width: auto;
  flex-shrink: 0;
  border-radius: 4px;
}

.kicker {
  margin: 0 0 4px;
  color: var(--accent);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

/* All action buttons: Title Case (first letter of each word) */
button,
.btn-ghost,
.btn-primary,
.btn-secondary,
.btn-danger,
.btn-compact,
.text-btn,
.live-status-custody-btn,
.live-status-stream-btn,
.live-status-share-btn,
.unit-calls-range-btn,
.pilot-menu-item,
.pilot-menu-notif-action,
.pilot-menu-enable-alerts,
.side-nav button,
.bottom-nav button,
a.btn-primary,
a.btn-secondary,
a.btn-compact,
a.btn-ghost,
a.live-status-stream-btn {
  text-transform: capitalize;
}

.chip,
.btn-ghost,
.btn-primary,
.btn-secondary,
.btn-danger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 38px;
  padding: 8px 14px;
  border-radius: 10px;
  border: 1px solid transparent;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
}

.chip {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.2);
  color: #fff;
}

.resources-jump-card {
  position: sticky;
  top: calc(var(--shell-header-sticky) + var(--resources-jump-top-gap));
  z-index: 39;
  margin: 0;
  padding-bottom: 14px;
}

.resources-jump-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: stretch;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.resources-jump-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 36px;
  padding: 8px 14px;
  border: 1px solid color-mix(in srgb, var(--accent) 40%, var(--line));
  border-radius: 8px;
  background: var(--surface);
  color: var(--ink);
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 0.03em;
  text-align: center;
  text-decoration: none;
  box-shadow: var(--shadow);
  transition:
    color 0.15s ease,
    border-color 0.15s ease,
    background 0.15s ease,
    box-shadow 0.15s ease;
}

.resources-jump-link:hover {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 14%, var(--surface));
  color: var(--ink);
  box-shadow: var(--shadow);
}

.resources-jump-link:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.resources-section {
  scroll-margin-top: calc(
    var(--shell-header-sticky) + var(--resources-jump-sticky) + var(--resources-jump-top-gap) + 12px
  );
  margin-top: 18px;
}

.resources-section:first-of-type {
  margin-top: 0;
}

.resources-section-title {
  margin: 0 0 12px;
}

.resources-section-sub {
  margin: -6px 0 12px;
  color: var(--muted);
  font-size: 0.86rem;
  font-weight: 600;
}

.resources-documents-card {
  margin-top: 0;
}

.resources-stack {
  margin-top: 0;
}

.resources-section-card {
  scroll-margin-top: calc(
    var(--shell-header-sticky) + var(--resources-jump-sticky) + var(--resources-jump-top-gap) + 12px
  );
}

/* Resources tab: equal gap between every chip (Weather↔TFR is the reference) */
.home-stack.resources-stack {
  gap: var(--ops-chip-gap);
  row-gap: var(--ops-chip-gap);
}

/*
  Flatten hosts so Weather / TFR / NOTAM / SMH are direct stack children.
  Parent gap alone sets spacing — no per-card margin (matches Weather→TFR).
*/
.home-stack.resources-stack > .home-base-weather-host,
.home-stack.resources-stack > .home-smh-helipad-host {
  display: contents;
}

.home-stack.resources-stack > .home-base-weather-host,
.home-stack.resources-stack > .home-smh-helipad-host,
.home-stack.resources-stack > .card,
.home-stack.resources-stack > .resources-section-card,
.home-stack.resources-stack > .auth-airspace-card {
  margin: 0;
}

/* Kill leftover margins on chips painted inside flattened hosts */
.home-stack.resources-stack .smh-helipad-status-card,
.home-stack.resources-stack .base-weather-card,
.home-stack.resources-stack .wx-notice-card,
.home-stack.resources-stack .auth-airspace-card,
.home-stack.resources-stack > .resources-section-card,
.home-stack.resources-stack .card {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.resources-stack > .resources-section-card.card {
  padding: 0;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  box-shadow: none;
}

/* Dropdown titles — match flight accordion (gold uppercase + chevron) */
.resources-stack .resources-section-card .home-kit-kicker {
  display: none; /* titles already carry the section name */
}

.resources-stack .resources-section-card .card-head,
.resources-stack .resources-section-card .home-kit-card-head {
  margin: 0;
  gap: 0.45rem;
  align-items: center;
  min-height: 2.6rem;
  padding: 0.55rem 0.75rem;
  background: color-mix(in srgb, var(--surface-2) 70%, transparent);
  border-bottom: 1px solid transparent;
}

.resources-stack .resources-section-card:not(.collapsed) .card-head,
.resources-stack .resources-section-card:not(.collapsed) .home-kit-card-head {
  margin-bottom: 0;
  border-bottom-color: var(--line);
  background: color-mix(in srgb, var(--accent) 8%, var(--surface-2));
}

.resources-stack .resources-section-card .card-head:hover,
.resources-stack .resources-section-card .home-kit-card-head:hover {
  background: color-mix(in srgb, var(--accent) 12%, var(--surface-2));
}

.resources-stack .resources-section-card .card-head h3,
.resources-stack .resources-section-card .home-kit-card-head h3 {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 0.45rem;
  flex: 1;
  min-width: 0;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  line-height: 1.3;
  color: var(--accent);
}

.resources-card-body {
  display: grid;
  gap: 12px;
  padding: 0.7rem 0.75rem 0.85rem;
  background: var(--surface);
  min-width: 0;
}

.resources-section-card.collapsible .card-head {
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}

.resources-section-card.collapsible .collapse-toggle {
  margin: 0;
  width: 1rem;
  flex-shrink: 0;
  text-align: center;
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--muted);
  opacity: 1;
  pointer-events: none;
  line-height: 1;
}

.resources-section-card.collapsible:not(.collapsed) .collapse-toggle {
  color: var(--accent);
}

.flight-checklist-bubble {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  margin-left: 0.35rem;
  vertical-align: middle;
  background: color-mix(in srgb, var(--muted) 45%, var(--surface));
  border: 1px solid color-mix(in srgb, var(--muted) 55%, var(--line));
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.15);
}

.flight-checklist-bubble.green {
  background: var(--ok);
  border-color: color-mix(in srgb, var(--ok) 70%, #000);
}

.flight-checklist-bubble.red {
  background: var(--bad);
  border-color: color-mix(in srgb, var(--bad) 70%, #000);
}

.resources-section-card.collapsible.collapsed .resources-card-body {
  display: none;
}

.resources-stack .home-kit-card .card-head h3 {
  display: flex;
  align-items: center;
}

.embed-card.collapsible {
  overflow: hidden;
}

.embed-card.collapsible.collapsed .embed-frame,
.embed-card.collapsible.collapsed iframe {
  display: none;
}

.embed-card.collapsible .embed-head {
  cursor: pointer;
  user-select: none;
}

.resources-stack .home-kit-card .embed-head h3 {
  display: flex;
  align-items: center;
}

.embed-card.collapsible .collapse-toggle {
  margin-right: 6px;
  font-size: 0.8em;
  opacity: 0.7;
  pointer-events: none;
  flex-shrink: 0;
}

.resources-stack .home-kit-card .embed-card,
.resources-stack .home-kit-card .ref-card {
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: none;
  background: var(--surface-2);
  color: var(--ink);
}

.resources-stack .home-kit-card .embed-card--full {
  margin-bottom: 0;
}

.resources-stack .home-kit-card .embed-head {
  padding: 10px 12px 0;
  background: transparent;
}

.resources-stack .home-kit-card .embed-head--link-only {
  justify-content: flex-end;
  padding: 0 12px 8px;
}

.resources-stack .home-kit-card .embed-head h3 {
  margin: 0 0 4px;
  font-size: 1rem;
}

.resources-stack .home-kit-card .skyvector-chart-wrap {
  padding: 0 12px 12px;
}

.resources-stack .home-kit-card .embed-grid {
  gap: 12px;
}

.resources-stack .home-kit-card .ref-grid {
  gap: 12px;
}

.resources-stack .home-kit-card .doc-item {
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 0.7rem 0.8rem;
  gap: 6px;
}

.resources-stack .home-kit-card .doc-item strong {
  color: var(--ink);
  font-size: 0.92rem;
  font-weight: 650;
  letter-spacing: 0.01em;
}

.resources-stack .home-kit-card .doc-item a {
  color: var(--accent);
  font-size: 0.82rem;
  font-weight: 700;
  text-decoration: none;
  width: fit-content;
  padding: 0.28rem 0.55rem;
  border-radius: 6px;
  border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--line));
  background: color-mix(in srgb, var(--accent) 12%, transparent);
}

.resources-stack .home-kit-card .doc-item a:hover,
.resources-stack .home-kit-card .doc-item a:focus-visible {
  background: color-mix(in srgb, var(--accent) 22%, transparent);
  border-color: var(--accent);
  outline: none;
}

.policy-ref-picker {
  display: grid;
  gap: 12px;
}

.policy-ref-picker-label {
  margin: 0;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 750;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.policy-ref-picker-label select {
  margin-top: 6px;
  width: 100%;
  background: var(--surface-2);
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0.55rem 0.7rem;
  font-weight: 600;
}

.policy-ref-picker-label select:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--accent) 65%, transparent);
  outline-offset: 1px;
  border-color: var(--accent);
}

.policy-ref-panel .ref-card {
  margin: 0;
}

.policy-ref-panel .ref-card--emergency {
  grid-column: auto;
}

.policy-ref-list {
  margin: 0;
  padding-left: 1.1rem;
  color: var(--ink);
  font-size: 0.9rem;
  line-height: 1.45;
  font-weight: 500;
}

.policy-ref-list li + li {
  margin-top: 0.55rem;
}

.policy-ref-list li::marker {
  color: var(--accent);
}

.btn-ghost {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.22);
  color: #fff;
}

.btn-primary {
  background: var(--accent);
  color: var(--brand);
}

.btn-secondary {
  background: var(--surface);
  border-color: var(--line);
  color: var(--ink);
}

.btn-compact {
  min-height: 32px;
  padding: 4px 10px;
  font-size: 0.82rem;
}

.btn-danger {
  background: #fff1f0;
  border-color: #f3c1bd;
  color: var(--bad);
}

.app-layout {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  min-height: calc(100vh - 82px);
}

.side-nav {
  position: sticky;
  top: 82px;
  align-self: start;
  display: grid;
  gap: 4px;
  padding: 12px 10px;
  background: var(--surface);
  border-right: 1px solid var(--line);
  max-height: calc(100vh - 82px);
  overflow-y: auto;
}

.side-nav button {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 36px;
  padding: 6px 10px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
  font-weight: 700;
}

.bottom-nav button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  width: 100%;
  min-width: 0;
  min-height: 40px;
  padding: 4px 2px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: var(--ink);
  text-align: center;
  cursor: pointer;
  font-weight: 700;
  font-size: 0.65rem;
  line-height: 1.1;
  white-space: normal;
}

.side-nav button:hover,
.bottom-nav button:hover {
  background: var(--surface-2);
}

.side-nav button.active,
.bottom-nav button.active {
  background: var(--brand);
  color: #fff;
}

/* Admin nav active state is accent-tinted (set under body.admin-app) */

.side-nav button span,
.bottom-nav button span {
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 8px;
  background: var(--accent-soft);
  color: var(--brand);
  font-size: 0.72rem;
}

/* Red attention bubble on Post-Flight / Training bottom-nav tabs */
.bottom-nav button.has-nav-badge,
.bottom-nav button[data-panel="reports"],
.bottom-nav button[data-panel="training"] {
  position: relative;
}
.bottom-nav .pilot-postflight-nav-badge,
.bottom-nav .pilot-training-nav-badge {
  position: absolute;
  top: 2px;
  right: 2px;
  z-index: 2;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 999px;
  background: #e53935;
  color: #fff;
  font-size: 0.6rem;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  border: 1.5px solid rgba(255, 255, 255, 0.95);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
  pointer-events: none;
}
.bottom-nav .pilot-postflight-nav-badge[hidden],
.bottom-nav .pilot-training-nav-badge[hidden] {
  display: none !important;
}
.bottom-nav button.active .pilot-postflight-nav-badge,
.bottom-nav button.active .pilot-training-nav-badge {
  border-color: color-mix(in srgb, var(--brand) 40%, #fff);
}

.side-nav button.active span,
.bottom-nav button.active span {
  background: var(--accent);
}

.side-nav-logout {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
  color: #c33;
  font-weight: 600;
}

.side-nav-logout:hover {
  background: #fee;
  color: #900;
}

.side-nav-logout span {
  background: #fcc;
  color: #900;
}

.main-panel {
  padding: 16px clamp(12px, 3vw, 20px) 28px;
}

.panel {
  display: none;
}

.panel.active {
  display: block;
}

.panel-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.panel-head h2 {
  margin: 0;
  font-size: 1.45rem;
}

.panel-head p {
  margin: 0;
  max-width: 640px;
  color: var(--muted);
}

.panel-head-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  flex-shrink: 0;
}

.metric-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}

.metric-row--home {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.metric-full {
  width: 100%;
  box-sizing: border-box;
  padding: 12px 8px;
}

.metric-row--home .metric,
.metric-full {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

a.metric--home-jump,
button.metric--home-jump {
  display: block;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  font: inherit;
  border: 1px solid var(--line);
  background: var(--card, #fff);
  width: 100%;
  box-sizing: border-box;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    transform 0.15s ease;
}

a.metric--home-jump:hover,
button.metric--home-jump:hover {
  border-color: color-mix(in srgb, var(--accent) 55%, var(--line));
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.1);
}

a.metric--home-jump:focus-visible,
button.metric--home-jump:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.home-stack [id^="home-section-"] {
  scroll-margin-top: calc(var(--shell-header-sticky, 190px) + 16px);
}

.metric {
  padding: 12px;
  min-width: 0;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  text-align: center;
}

.metric-row--home .metric {
  padding: 10px 6px;
}

.metric .label {
  color: var(--muted);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.metric strong {
  display: block;
  margin: 3px 0 1px;
  font-size: 1.5rem;
  line-height: 1;
  color: var(--ink);
}

.metric span:last-child {
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 600;
  margin-top: 1px;
}

/* Pilot home metric bubbles â€” force readable contrast in both themes */
a.metric--home-jump,
button.metric--home-jump {
  color: var(--ink);
  background: var(--surface);
}

a.metric--home-jump .label,
button.metric--home-jump .label,
a.metric--home-jump span,
button.metric--home-jump span {
  color: var(--muted);
}

a.metric--home-jump strong,
button.metric--home-jump strong {
  color: var(--ink);
}

.card-grid {
  display: grid;
  gap: 10px;
}

.card-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 14px;
}

.card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.card-head h3 {
  margin: 0 0 4px;
  font-size: 1.2rem;
}

.card-sub {
  color: var(--muted);
  font-weight: 600;
}

.badge-row {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.badge {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #fff;
}

.badge-ok {
  background: var(--ok);
}

.badge-review,
.badge-warn {
  background: var(--warn);
}

.badge-bad,
.badge-nogo {
  background: var(--bad);
}

.badge-neutral {
  background: var(--brand-2);
}

.readout {
  display: grid;
  gap: 0;
  margin: 0;
}

.readout div {
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: 10px;
  padding: 10px 0;
  border-top: 1px solid var(--line);
}

.readout div:first-child {
  border-top: 0;
}

.readout dt {
  margin: 0;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
}

.readout dd {
  margin: 0;
  font-weight: 700;
}

.form-grid {
  display: grid;
  gap: 10px;
}

.form-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.form-grid.three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* Span full row inside form grids (Name, Roles, actions, etc.) */
.form-grid > .full,
.form-grid > label.full,
.form-grid > div.full {
  grid-column: 1 / -1;
}

/* Part 107 # + Expiration sit as a pair on one row */
.form-grid > .pilot-p107-pair {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  min-width: 0;
}
/* Roster status (narrow) + Roles (flex) on one row */
.form-grid > .pilot-roster-roles-pair {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(10rem, 13rem) minmax(0, 1fr);
  gap: 10px 14px;
  min-width: 0;
  align-items: start;
}
@media (max-width: 900px) {
  .form-grid > .pilot-p107-pair {
    grid-template-columns: 1fr;
  }
  .form-grid > .pilot-roster-roles-pair {
    grid-template-columns: 1fr;
  }
}

label {
  display: grid;
  gap: 4px;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 700;
}

input:not([type="checkbox"]):not([type="radio"]),
select,
textarea {
  width: 100%;
  min-height: 36px;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  color: var(--ink);
  /* 16px prevents iOS Safari from auto-zooming focused fields (zoom often sticks after login) */
  font-size: 16px;
}

textarea {
  min-height: 88px;
  resize: vertical;
}

input:not([type="checkbox"]):not([type="radio"]):focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(201, 162, 39, 0.2);
}

/* Checkboxes / radios — never inherit full-width text field styles.
   Unchecked: light face + clear border. Checked: bright fill + white mark. */
input[type="checkbox"],
input[type="radio"] {
  -webkit-appearance: none;
  appearance: none;
  width: 1.2rem !important;
  height: 1.2rem !important;
  min-width: 1.2rem !important;
  min-height: 1.2rem !important;
  max-width: 1.2rem !important;
  max-height: 1.2rem !important;
  margin: 0;
  padding: 0 !important;
  flex-shrink: 0;
  vertical-align: middle;
  box-sizing: border-box;
  border: 2px solid #94a3b8;
  border-radius: 4px;
  background: #f8fafc;
  color: var(--ink);
  accent-color: #d4a017;
  cursor: pointer;
  display: inline-grid;
  place-content: center;
  box-shadow: none;
}

input[type="radio"] {
  border-radius: 50%;
}

input[type="checkbox"]::before,
input[type="radio"]::before {
  content: "";
  width: 0.55rem;
  height: 0.55rem;
  transform: scale(0);
  transition: transform 0.08s ease-in-out;
  box-shadow: none;
  background-color: #ffffff;
  transform-origin: center;
}

input[type="checkbox"]::before {
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
  box-shadow: none;
  background: #ffffff;
  width: 0.68rem;
  height: 0.68rem;
}

input[type="radio"]::before {
  border-radius: 50%;
  background: #ffffff;
  box-shadow: none;
  width: 0.5rem;
  height: 0.5rem;
}

input[type="checkbox"]:checked,
input[type="radio"]:checked {
  background: #d4a017;
  border-color: #b8860b;
}

input[type="checkbox"]:checked::before,
input[type="radio"]:checked::before {
  transform: scale(1);
  background: #ffffff;
}

input[type="checkbox"]:disabled,
input[type="radio"]:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

input[type="checkbox"]:focus-visible,
input[type="radio"]:focus-visible {
  outline: 2px solid #d4a017;
  outline-offset: 2px;
}

html[data-theme="night"] input[type="checkbox"],
html[data-theme="night"] input[type="radio"] {
  background: #eef2f7;
  border-color: #a8b3c4;
  color-scheme: light;
}

html[data-theme="night"] input[type="checkbox"]:checked,
html[data-theme="night"] input[type="radio"]:checked {
  background: #e0b84a;
  border-color: #f0c85c;
}

html[data-theme="night"] input[type="checkbox"]:checked::before,
html[data-theme="night"] input[type="radio"]:checked::before {
  background: #ffffff;
}

html[data-theme="night"] .checklist input[type="checkbox"] {
  background: var(--surface);
  border-color: color-mix(in srgb, var(--muted) 55%, var(--line));
  accent-color: var(--accent);
}
html[data-theme="night"] .checklist input[type="checkbox"]:checked {
  background: var(--accent);
  border-color: color-mix(in srgb, var(--accent) 80%, #fff);
}
html[data-theme="night"] .checklist input[type="checkbox"]:checked::before {
  background: #14161c;
}

html[data-theme="night"] .checklist li.done label span {
  color: var(--muted);
}

button:disabled {
  opacity: 0.42;
  cursor: not-allowed;
}

.field-section {
  margin-top: 10px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.field-section h4 {
  margin: 0 0 4px;
  font-size: 0.95rem;
}

.field-section .section-hint {
  margin: 0 0 12px;
  color: var(--muted);
  font-size: 0.84rem;
  font-weight: 600;
}

.field-section--override {
  border-left: 4px solid var(--info);
  background: color-mix(in srgb, var(--info) 10%, var(--surface-2));
  color: var(--ink);
}

.field-section--grounding {
  border-left: 4px solid var(--line);
  background: var(--surface-2);
  color: var(--ink);
}

.field-section--grounding.is-active {
  border-left-color: var(--bad);
  background: color-mix(in srgb, var(--bad) 12%, var(--surface-2));
  color: var(--ink);
}

.field-section--grounding.is-disabled label {
  opacity: 0.72;
}

.field-section--grounding.is-disabled input,
.field-section--grounding.is-disabled textarea,
.field-section--grounding.is-disabled select {
  background: var(--surface);
  color: var(--muted);
  border-color: var(--line);
}

.grounding-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.field-section--grounding.is-active .grounding-actions {
  border-top-color: color-mix(in srgb, var(--bad) 35%, var(--line));
}

.grounding-signin-report {
  margin-bottom: 16px;
  color: var(--ink);
}

.grounding-signin-meta {
  margin-bottom: 12px;
}

.grounding-signin-title {
  margin: 0 0 4px;
  color: var(--ink);
}

.grounding-summary,
.grounding-pilot-notes {
  margin: 8px 0 0;
  font-size: 0.9rem;
  color: var(--ink);
}

.grounding-pilot-notes {
  color: var(--muted);
  font-style: italic;
}

.grounding-items-wrap {
  margin-top: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  overflow: auto;
}

.grounding-items-table {
  width: 100%;
  border-collapse: collapse;
  color: var(--ink);
}

.grounding-items-table th,
.grounding-items-table td {
  font-size: 0.88rem;
  color: var(--ink);
  border-bottom: 1px solid var(--line);
  padding: 8px 10px;
  background: transparent;
}

.grounding-items-table th {
  color: var(--muted);
  font-weight: 700;
  text-align: left;
  background: color-mix(in srgb, var(--surface-2) 80%, #000);
}

.grounding-items-table tr:last-child td {
  border-bottom: none;
}

.grounding-items-table select,
.grounding-items-table input[type="text"] {
  width: 100%;
  min-width: 140px;
  background: var(--surface-2);
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 6px 8px;
  color-scheme: dark;
}

.grounding-reported {
  font-weight: 700;
}

.grounding-reported.tone-ok {
  color: var(--ok);
}

.grounding-reported.tone-warn {
  color: var(--warn);
}

.grounding-reported.tone-bad {
  color: var(--bad);
}

.grounding-resolve-hint {
  margin: 10px 0 0;
  color: var(--warn);
  font-size: 0.86rem;
  font-weight: 600;
}

.grounding-review-fields {
  margin-top: 4px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
  color: var(--ink);
}

.grounding-review-fields select {
  width: 100%;
  background: var(--surface-2);
  color: var(--ink);
  border: 1px solid var(--line);
  color-scheme: dark;
}

.admin-access-flag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.86rem;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
}

.admin-access-flag input {
  width: auto;
  margin: 0;
}

/* Role multi-select — used on pilots roster cards + add form */
.role-checkboxes {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  font-size: 0.88rem;
  line-height: 1.3;
  margin-top: 0.25rem;
}
.role-checkboxes--row {
  flex-direction: row;
  flex-wrap: wrap;
  gap: 0.55rem 1rem;
}
.role-checkboxes label {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  white-space: nowrap;
  cursor: pointer;
  font-size: inherit;
}
.role-checkboxes input[type="checkbox"] {
  width: 1.1rem !important;
  height: 1.1rem !important;
  min-width: 1.1rem !important;
  min-height: 1.1rem !important;
  max-width: 1.1rem !important;
  max-height: 1.1rem !important;
  margin: 0;
  flex-shrink: 0;
  vertical-align: middle;
}

/* Skydio pending-user pool on Pilots page */
.skydio-users-pool-list {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}
.skydio-user-pool-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  flex-wrap: wrap;
  padding: 0.7rem 0.85rem;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2, var(--surface));
}
.skydio-user-pool-main {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
  flex: 1;
}
.skydio-user-pool-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.skydio-user-enroll-roles {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.85rem;
  margin: 0;
}
.skydio-user-enroll-roles select {
  min-width: 8rem;
}

/* Admin Pilots page — card roster (matches All flights / Training list chrome) */
.pilots-add-form-card {
  margin: 0 0 0.85rem;
}
.pilots-add-form-card[hidden] {
  display: none !important;
}
.pilots-roster-card {
  margin-top: 0;
}
.pilots-roster-list {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}
.pilot-admin-card {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-2, var(--surface));
  padding: 0;
  overflow: hidden;
}
html[data-theme="night"] .pilot-admin-card {
  background: rgba(255, 255, 255, 0.03);
}
.pilot-admin-card.is-editing {
  border-color: rgba(212, 160, 23, 0.55);
  box-shadow: 0 0 0 1px rgba(212, 160, 23, 0.2);
}
.pilot-admin-card-head {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 0.5rem;
}
.pilot-admin-card-toggle {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  margin: 0;
  padding: 0.9rem 0.75rem 0.9rem 1rem;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
  font: inherit;
}
.pilot-admin-card-toggle:hover {
  background: rgba(0, 0, 0, 0.04);
}
html[data-theme="night"] .pilot-admin-card-toggle:hover {
  background: rgba(255, 255, 255, 0.04);
}
.pilot-admin-chevron {
  flex-shrink: 0;
  width: 1.1rem;
  margin-top: 0.15rem;
  font-size: 0.95rem;
  color: var(--muted);
  line-height: 1.2;
}
.pilot-admin-card-identity {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}
.pilot-admin-display-name {
  font-size: 1.05rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  line-height: 1.25;
}
.pilot-admin-roles-summary {
  font-size: 0.85rem;
}
.pilot-admin-badges {
  gap: 0.4rem;
}
.pilot-admin-pin-note {
  margin: 0;
}
.pilot-admin-card-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.35rem 0.5rem;
  flex-shrink: 0;
  padding: 0.75rem 1rem 0.75rem 0.25rem;
}
.pilot-admin-card-body {
  padding: 0 1.1rem 1rem;
  border-top: 1px solid var(--line);
}
.pilot-admin-fields {
  margin: 0.85rem 0 0.65rem;
}
.pilot-admin-fields label {
  gap: 0.3rem;
}
.pilot-admin-alert-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}
.pilot-admin-creds {
  margin-top: 0.35rem;
}
.pilot-admin-creds summary {
  font-size: 0.9rem;
}
@media (max-width: 720px) {
  .pilot-admin-card-head {
    flex-direction: column;
  }
  .pilot-admin-card-actions {
    justify-content: flex-start;
    padding: 0 1rem 0.85rem;
  }
}

.table-wrap {
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
}

table {
  width: 100%;
  border-collapse: collapse;
}

th,
td {
  padding: 6px 8px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}

th {
  background: var(--surface-2);
  color: var(--muted);
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.text-btn {
  border: 0;
  background: transparent;
  color: var(--info);
  cursor: pointer;
  font-weight: 800;
}

.alert {
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid;
  font-weight: 700;
}

.alert-warn {
  background: #fffbeb;
  border-color: #fde68a;
  color: #92400e;
}

.alert-bad {
  background: #fff1f0;
  border-color: #fecaca;
  color: #991b1b;
}

.important-message-banner {
  border-width: 3px !important;
  padding: 12px !important;
  margin-bottom: 12px;
  font-weight: 600;
}
.important-message-banner strong {
  font-size: 1.05em;
}
.important-message-banner p {
  margin: 6px 0 0;
  font-size: 0.95rem;
  white-space: pre-wrap;
}

/* Overview / admin compliance — night theme */
.issues-section {
  margin-top: 0;
  color: var(--ink);
}

.overview-panel.admin-issues,
.overview-panel.issues-section {
  background: var(--surface);
  border: 1px solid var(--line);
  color: var(--ink);
}

.issue-category {
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 12px;
  box-shadow: none;
  margin-bottom: 10px;
  color: var(--ink);
}

.issue-category:last-child {
  margin-bottom: 0;
}

.issue-category-title {
  font-weight: 700;
  font-size: 0.88rem;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  color: var(--ink);
}

.issue-icon {
  font-size: 0.95em;
  line-height: 1;
  opacity: 0.9;
}

.issue-count {
  margin-left: auto;
  background: color-mix(in srgb, var(--bad) 22%, var(--surface));
  color: var(--bad);
  border: 1px solid color-mix(in srgb, var(--bad) 40%, var(--line));
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.02em;
}

.issue-count[data-count="0"],
.issue-category:has(.issue-good) .issue-count {
  background: color-mix(in srgb, var(--ok) 16%, var(--surface));
  color: var(--ok);
  border-color: color-mix(in srgb, var(--ok) 35%, var(--line));
}

.issue-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  margin-bottom: 6px;
  font-size: 0.88rem;
  color: var(--ink);
  transition: background-color 0.12s ease, border-color 0.12s ease;
}

.issue-item:last-child {
  margin-bottom: 0;
}

.issue-item:hover {
  background: color-mix(in srgb, var(--accent) 10%, var(--surface));
  border-color: color-mix(in srgb, var(--accent) 30%, var(--line));
}

.issue-text {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--ink);
}

.issue-manage {
  font-size: 0.78rem;
  padding: 4px 10px;
  margin-left: 4px;
  flex-shrink: 0;
}

.issue-good {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  background: color-mix(in srgb, var(--ok) 12%, var(--surface));
  color: var(--ok);
  border: 1px solid color-mix(in srgb, var(--ok) 30%, var(--line));
  border-radius: 8px;
  font-size: 0.88rem;
  font-weight: 600;
}

.alert-success {
  background: #ecfdf5;
  border-color: #a7f3d0;
  color: #065f46;
}

.alert-success p {
  margin: 8px 0 0;
  font-weight: 500;
}

.custody-success-banner {
  margin-bottom: 16px;
  animation: custodySuccessIn 0.35s ease-out;
}

@keyframes custodySuccessIn {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.alert-info {
  background: #eff6ff;
  border-color: #bfdbfe;
  color: #1e3a8a;
}

.auth-screen {
  width: min(560px, calc(100% - 32px));
  margin: 32px auto 48px;
  display: grid;
  grid-auto-flow: row;
  gap: var(--ops-chip-gap);
  row-gap: var(--ops-chip-gap);
}

.auth-screen > * {
  margin: 0;
  min-width: 0;
}

/* Flatten weather / SMH / airspace hosts so every chip shares auth-screen gap */
.auth-screen .login-base-weather-host,
.auth-screen .home-base-weather-host,
.auth-screen .login-smh-helipad-host,
.auth-screen .home-smh-helipad-host,
.auth-screen #login-airspace-ref,
.auth-screen .login-airspace-host {
  display: contents;
}

/* Login SMH sits above Weather/TFR/NOTAM; no history button */
.auth-screen .smh-helipad-status-card--no-history {
  margin: 0;
}

.auth-card {
  margin: 0;
  padding: 20px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

/* Weather glance on login â€” weather + TFR + NOTAM chips under the form */
.login-base-weather-host {
  margin: 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--ops-chip-gap);
}

.login-base-weather-host > .card {
  margin: 0;
}

/* Compact patrol zone reminders under weather on login */
.auth-airspace-card {
  margin: 0;
  padding: 0.55rem 0.7rem 0.6rem;
}

/* SMH helipad status (pilot Resources) — large H left, brown title, pill/detail right */
.smh-helipad-status-card {
  margin: 0;
  padding: 0.55rem 0.7rem 0.65rem;
  border-radius: var(--radius, 10px);
  border: 1px solid rgba(94, 234, 212, 0.28);
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.95), rgba(15, 118, 110, 0.12));
  color: #e8edf5;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12px;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
/* Occupied — teal glow */
.smh-helipad-status-card--occ {
  border-color: rgba(94, 234, 212, 0.65);
  background:
    linear-gradient(135deg, rgba(15, 118, 110, 0.42), rgba(15, 18, 24, 0.94));
  box-shadow:
    0 0 0 1px rgba(94, 234, 212, 0.18),
    0 6px 18px rgba(13, 148, 136, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
/* Approaching — amber */
.smh-helipad-status-card--appr {
  border-color: rgba(251, 191, 36, 0.55);
  background:
    linear-gradient(135deg, rgba(120, 53, 15, 0.35), rgba(15, 18, 24, 0.94));
  box-shadow:
    0 0 0 1px rgba(251, 191, 36, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
/* Clear — slightly dimmed */
.smh-helipad-status-card:not(.smh-helipad-status-card--occ):not(.smh-helipad-status-card--appr) {
  opacity: 0.96;
  border-color: rgba(148, 163, 184, 0.28);
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.92), rgba(30, 41, 59, 0.35));
}
.smh-helipad-status-card:not(.smh-helipad-status-card--occ):not(.smh-helipad-status-card--appr) .smh-pad-glyph {
  opacity: 0.7;
  filter: grayscale(0.25);
  border-color: rgba(148, 163, 184, 0.4);
  color: #94a3b8;
}
/* Large H disc — left of all text */
.smh-status-visual {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: center;
}
.smh-pad-glyph {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font: 900 22px/1 system-ui, sans-serif;
  letter-spacing: 0.02em;
  color: #5eead4;
  background: rgba(15, 23, 42, 0.9);
  border: 2px dashed rgba(94, 234, 212, 0.5);
  box-shadow: inset 0 0 0 3px rgba(15, 23, 42, 0.85);
  flex: 0 0 auto;
  box-sizing: border-box;
}
.smh-pad-glyph.is-occupied {
  color: #ecfeff;
  border-style: solid;
  border-color: rgba(94, 234, 212, 0.9);
  background: rgba(13, 148, 136, 0.35);
  box-shadow:
    inset 0 0 0 3px rgba(15, 23, 42, 0.45),
    0 0 12px rgba(45, 212, 191, 0.4);
}
.smh-helipad-status-card--appr .smh-pad-glyph.is-occupied {
  color: #fef3c7;
  border-color: rgba(251, 191, 36, 0.85);
  background: rgba(120, 53, 15, 0.45);
  box-shadow:
    inset 0 0 0 3px rgba(15, 23, 42, 0.45),
    0 0 10px rgba(251, 191, 36, 0.25);
}
/* Text column: brown title + pill + detail + history */
.smh-status-main {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  justify-content: center;
}
.smh-status-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
  margin: 0;
  width: 100%;
}
/* Brown tan title (not white sidebar label) */
.smh-status-kicker {
  margin: 0;
  flex: 1 1 auto;
  min-width: 0;
  color: var(--accent, #b8ad86);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-shadow: none;
}
/* Pills */
.smh-status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  flex: 0 0 auto;
  padding: 3px 8px;
  border-radius: 999px;
  font: 750 10px/1.15 system-ui, -apple-system, Segoe UI, sans-serif;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  border: 1px solid rgba(255, 255, 255, 0.12);
  white-space: nowrap;
  min-height: 20px;
  min-width: 5.25rem;
  box-sizing: border-box;
  color: #e8edf5;
  background: rgba(44, 52, 68, 0.85);
}
.smh-status-pill::before {
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.95;
  flex: 0 0 auto;
}
.smh-status-pill--clear {
  color: #86efac;
  background: rgba(22, 101, 52, 0.5);
  border-color: rgba(74, 222, 128, 0.5);
}
.smh-status-pill--occ {
  color: #5eead4;
  background: rgba(15, 118, 110, 0.55);
  border-color: rgba(94, 234, 212, 0.55);
  animation: smh-resources-pill-pulse 1.8s ease-in-out infinite;
}
.smh-status-pill--appr {
  color: #fde68a;
  background: rgba(120, 53, 15, 0.5);
  border-color: rgba(251, 191, 36, 0.5);
}
@keyframes smh-resources-pill-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.82; }
}
.smh-status-detail {
  margin: 0;
  font: 500 0.8rem/1.35 system-ui, sans-serif;
  color: #cbd5e1;
  padding-top: 2px;
}
.smh-status-detail[hidden] {
  display: none !important;
}
.smh-helipad-status-card--occ .smh-status-detail {
  color: #ccfbf1;
}
.smh-helipad-status-card--appr .smh-status-detail {
  color: #fde68a;
}
/* History rows (popup) — keep approach tint */
.smh-history-row.is-approaching {
  border-color: color-mix(in srgb, var(--warn, #e0a04a) 40%, var(--line));
  background: color-mix(in srgb, var(--warn, #e0a04a) 10%, var(--surface-2));
}
.home-smh-helipad-host {
  margin: 0;
}
.smh-status-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 4px;
}
.smh-history-btn {
  font-size: 0.72rem !important;
  padding: 5px 10px !important;
  min-height: 28px;
}

/* SMH helipad history pop-out — traditional card chrome */
.smh-history-popup-host {
  position: fixed;
  inset: 0;
  z-index: 420;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  height: 100dvh;
  max-height: 100dvh;
  padding: 0;
  background: rgba(0, 0, 0, 0.55);
  -webkit-overflow-scrolling: touch;
}
.smh-history-popup-host[hidden] {
  display: none !important;
}
.smh-history-popup-panel {
  flex: 0 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  width: 100%;
  max-width: 520px;
  max-height: min(88dvh, 720px);
  margin: 0;
  border-radius: var(--radius, 10px) var(--radius, 10px) 0 0;
  border: 1px solid var(--line);
  border-bottom: 0;
  background: var(--surface);
  box-shadow: var(--shadow);
  overflow: hidden;
  padding-bottom: env(safe-area-inset-bottom, 0);
  box-sizing: border-box;
}
@media (min-width: 640px) {
  .smh-history-popup-host {
    align-items: center;
    padding: 24px;
  }
  .smh-history-popup-panel {
    border-radius: var(--radius, 10px);
    border-bottom: 1px solid var(--line);
    max-height: min(80vh, 640px);
  }
}
.smh-history-popup-toolbar {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px 12px;
  border-bottom: 1px solid var(--line);
  background: var(--surface);
}
.smh-history-popup-toolbar-main {
  min-width: 0;
  flex: 1 1 auto;
}
.smh-history-popup-kicker,
.smh-history-popup-title-kicker {
  margin: 0;
  font: 800 0.78rem/1.25 var(--font, system-ui, sans-serif);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--accent, #b8ad86);
}
/* Large white "Helipad History" title removed — tan kicker is the only heading */
.smh-history-popup-subtitle {
  margin: 2px 0 0;
  font: 600 0.82rem/1.3 var(--font, system-ui, sans-serif);
  color: var(--muted);
}
.smh-history-popup-toolbar-actions {
  flex: 0 0 auto;
}
.smh-history-popup-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: 12px 14px 20px;
  outline: none;
  background: var(--surface);
}
html.smh-history-popup-open,
html.smh-history-popup-open body {
  overflow: hidden !important;
}
.smh-history-stats {
  margin: 0 0 10px;
  font: 650 0.75rem/1.35 var(--font, system-ui, sans-serif);
  color: var(--muted);
}
.smh-history-empty {
  margin: 8px 0 6px;
  font: 700 0.88rem/1.35 var(--font, system-ui, sans-serif);
  color: var(--ink);
}
.smh-history-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.smh-history-row {
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: var(--surface-2);
}
.smh-history-row.is-on-pad {
  border-color: color-mix(in srgb, var(--ok, #3ecf8e) 40%, var(--line));
  background: color-mix(in srgb, var(--ok, #3ecf8e) 10%, var(--surface-2));
}
.smh-history-row-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.smh-history-id {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.smh-history-cs {
  font: 800 0.88rem/1.2 var(--font, system-ui, sans-serif);
  color: var(--ink);
  letter-spacing: 0.02em;
}
.smh-history-op {
  font: 650 0.75rem/1.25 var(--font, system-ui, sans-serif);
  color: var(--muted);
  letter-spacing: 0.01em;
}
.smh-history-pill {
  flex: 0 0 auto;
  padding: 2px 8px;
  border-radius: 999px;
  font: 750 10px/1.2 var(--font, system-ui, sans-serif);
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--muted);
  background: var(--surface);
  border: 1px solid var(--line);
}
.smh-history-pill--occ {
  color: color-mix(in srgb, var(--ok, #3ecf8e) 95%, #fff);
  background: color-mix(in srgb, var(--ok, #3ecf8e) 14%, var(--surface));
  border-color: color-mix(in srgb, var(--ok, #3ecf8e) 40%, var(--line));
}
.smh-history-times {
  margin-top: 6px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  font: 550 0.75rem/1.35 var(--font, system-ui, sans-serif);
  color: var(--ink);
}
.smh-history-meta {
  margin-top: 4px;
  font: 600 0.7rem/1.3 var(--font, system-ui, sans-serif);
  color: var(--muted);
}
/* Share Map — temporary VO QR (Home + Resources), fixed 2h TTL */
.map-share-card {
  margin: 0;
  padding: 0.55rem 0.7rem 0.75rem;
}

/* Nested action chip: hint + Generate QR (and result) inside outer Share Map card */
.map-share-inner-chip {
  margin: 0.45rem 0 0;
  padding: 0.7rem 0.75rem 0.8rem;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: var(--surface-2, #f4f6fa);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.55rem;
  box-sizing: border-box;
}

html[data-theme="night"] .map-share-inner-chip {
  background: var(--surface-2, #222836);
  border-color: var(--line);
}

.map-share-hint {
  margin: 0;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--muted);
  line-height: 1.35;
  text-align: center;
  max-width: 22rem;
}

.map-share-controls {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.55rem;
  width: 100%;
}

/* Match Live Ops Sign Out / Sign In button text size */
.map-share-gen-btn,
.map-share-copy-btn {
  min-width: 12rem;
  justify-content: center;
  min-height: 38px;
  padding: 6px 10px;
  font-size: 0.8rem;
  font-weight: 700;
  box-sizing: border-box;
}

.map-share-result {
  margin-top: 0.15rem;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}

.map-share-qr-wrap {
  padding: 10px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: #fff;
  line-height: 0;
}

.map-share-qr-img {
  display: block;
  width: 220px;
  height: 220px;
}

.map-share-qr-fallback {
  margin: 0;
  padding: 1rem;
  max-width: 14rem;
  text-align: center;
  font-size: 0.8rem;
  color: #334155;
}

.map-share-exp {
  margin: 0;
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--ink);
  text-align: center;
}

.map-share-url {
  width: min(100%, 22rem);
  box-sizing: border-box;
  padding: 0.45rem 0.55rem;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: var(--surface-2);
  color: var(--ink);
  font: 600 0.72rem/1.3 ui-monospace, Consolas, monospace;
}

.map-share-copy-btn {
  min-width: 8rem;
}

.map-share-status {
  margin: 0;
  text-align: center;
  font-size: 0.78rem;
  font-weight: 650;
  color: var(--muted);
}

.map-share-inner-chip .map-share-status {
  width: 100%;
}

.map-share-status.is-error {
  color: var(--bad, #b42318);
}

.auth-airspace-card > .kicker {
  margin: 0 0 0.35rem;
  font-size: 0.7rem;
}

.auth-airspace-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 6px;
}

.auth-airspace-list li {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 8px;
  padding: 7px 10px;
  border-radius: 7px;
  border: 1px solid var(--line);
  background: var(--surface-2, #f4f6fa);
  line-height: 1.25;
}

.auth-airspace-zone {
  flex: 0 0 auto;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  color: var(--ink);
  line-height: 1.25;
  min-width: 4.75rem;
}

.auth-airspace-detail {
  flex: 1 1 10rem;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--muted);
  line-height: 1.25;
}

.auth-airspace-detail a {
  color: var(--accent);
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
}

.auth-airspace-detail a:hover,
.auth-airspace-detail a:focus-visible {
  text-decoration: underline;
}

.auth-airspace-aloft-link {
  text-decoration: underline;
  text-underline-offset: 2px;
}

html[data-theme="night"] .auth-airspace-list li {
  background: color-mix(in srgb, var(--surface-2) 90%, #000);
}

html[data-theme="night"] .auth-airspace-detail a {
  color: #9ec5ff;
}

.auth-card h2 {
  margin-bottom: 4px;
}

.auth-subtitle {
  margin: 0 0 20px;
  color: var(--muted);
}

.auth-card p {
  color: var(--muted);
}

.auth-error {
  margin: 0;
  color: var(--bad);
  font-weight: 800;
}

.auth-hint {
  margin: 0;
}

.auth-hint.alert {
  padding: 10px 12px;
  border-radius: 10px;
}

.custody-bulk-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 12px;
}

.custody-form--signout {
  display: grid;
  gap: 14px;
}

/* Sign-out list — card rows (match preflight checklist language) */
.custody-signout-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
  border: 0;
  background: transparent;
  overflow: visible;
}

.custody-signout-row {
  padding: 0.7rem 0.85rem;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2);
  color: var(--ink);
  transition: border-color 0.12s ease, background 0.12s ease;
}

.custody-signout-row--missing {
  background: color-mix(in srgb, var(--warn) 12%, var(--surface-2));
  border-color: color-mix(in srgb, var(--warn) 45%, var(--line));
  box-shadow: inset 3px 0 0 var(--warn);
}

.custody-signout-row-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 8px;
  margin-bottom: 0.55rem;
}

.custody-signout-row-head strong {
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--accent);
}

.custody-signout-row-head .card-sub {
  font-size: 0.8rem;
  color: var(--muted);
  font-weight: 500;
}

.custody-signout-status {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0;
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
  background: var(--surface);
}

.custody-status-option {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 38px;
  padding: 6px 14px;
  margin: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  color: var(--ink);
  font-size: 0.88rem;
  font-weight: 700;
  cursor: pointer;
  text-transform: capitalize;
}

.custody-status-option + .custody-status-option {
  border-left: 1px solid var(--line);
}

.custody-status-option input {
  width: 1rem;
  min-height: 1rem;
  margin: 0;
  accent-color: var(--accent);
}

.custody-status-option:has(input:checked) {
  background: color-mix(in srgb, var(--accent) 18%, var(--surface));
  color: var(--accent);
}

.custody-checklist--kit {
  display: grid;
  gap: 12px;
  margin-top: 10px;
}

.custody-checklist--kit .custody-equip-block {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2);
}

.custody-last-signin {
  margin: 0 0 10px;
  font-size: 0.82rem;
  color: var(--muted);
  line-height: 1.4;
}

.custody-missing-flag {
  margin: 0 0 10px;
  font-size: 0.82rem;
  color: var(--warn);
  line-height: 1.4;
}

tr.row-missing td {
  background: rgba(220, 80, 70, 0.08);
}

.equipment-picker {
  display: grid;
  gap: 8px;
  margin: 12px 0;
  max-height: 280px;
  overflow-y: auto;
  padding-right: 4px;
}

.equip-option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2);
  font-weight: 700;
  color: var(--ink);
}

.equip-option input {
  width: auto;
  min-height: auto;
}

.equip-option.disabled {
  opacity: 0.55;
}

.custody-checklist {
  display: grid;
  gap: 8px;
}

.custody-check,
.custody-attest {
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 10px;
  align-items: start;
  padding: 0.7rem 0.85rem;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2);
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.35;
}

.custody-check input,
.custody-attest input {
  width: 1.1rem;
  min-height: 1.1rem;
  margin: 0.15rem 0 0;
  accent-color: var(--accent);
}

.custody-attest {
  margin-top: 14px;
  border: 1px solid color-mix(in srgb, var(--accent) 40%, var(--line));
  border-left: 4px solid var(--accent);
  background: color-mix(in srgb, var(--accent) 12%, var(--surface-2));
}

.custody-equip-block {
  margin-top: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2);
}

.custody-equip-block h5 {
  margin: 0 0 8px;
}

.custody-item-review {
  margin-bottom: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
}

.custody-item-review h5 {
  margin: 0 0 8px;
}

.custody-status-group {
  display: grid;
  gap: 6px;
  margin-bottom: 8px;
}

.custody-status-group label {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 600;
}

.custody-status-group input {
  width: auto;
  min-height: auto;
}

.custody-issue-explain {
  display: grid;
  gap: 6px;
  color: var(--bad);
  font-weight: 800;
}

.custody-issue-explain textarea {
  border-color: rgba(180, 35, 24, 0.45);
}

.flow-steps {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}

.flow-step {
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--surface);
  font-size: 0.82rem;
  font-weight: 800;
  color: var(--muted);
}

.flow-step.active {
  border-color: var(--brand);
  background: var(--brand);
  color: #fff;
}

.flow-step.done {
  border-color: var(--ok);
  color: var(--ok);
}

.mission-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(280px, 0.9fr);
  gap: 14px;
}

.checklist ul {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.checklist li {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 0.65rem 0.75rem;
  background: var(--surface-2);
  transition: border-color 0.12s ease, background 0.12s ease;
}

.checklist li.done {
  border-color: color-mix(in srgb, var(--ok) 40%, var(--line));
  background: color-mix(in srgb, var(--ok) 12%, var(--surface-2));
}

.checklist label {
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 10px;
  align-items: start;
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.35;
}

.checklist li.done label span {
  color: var(--muted);
  font-weight: 550;
}

.checklist input[type="checkbox"] {
  width: 1.15rem !important;
  height: 1.15rem !important;
  min-width: 1.15rem !important;
  min-height: 1.15rem !important;
  max-width: 1.15rem !important;
  max-height: 1.15rem !important;
  margin: 0.1rem 0 0;
  padding: 0 !important;
  accent-color: var(--accent);
}

.checklist-banner {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
  padding: 0.7rem 0.8rem;
  border-radius: 10px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--warn);
  background: color-mix(in srgb, var(--accent) 8%, var(--surface-2));
}

.checklist-banner-text {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.checklist-banner-text strong {
  color: var(--ink);
  font-size: 0.88rem;
  font-weight: 750;
  letter-spacing: 0.02em;
}

.checklist-banner-text span {
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 500;
}

.checklist-banner-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  flex-shrink: 0;
}

.checklist-mark-all {
  flex-shrink: 0;
}

.checklist.is-complete .checklist-banner {
  border-left-color: var(--ok);
  background: color-mix(in srgb, var(--ok) 12%, var(--surface-2));
}

.checklist-source {
  margin: 0 0 12px;
  font-size: 0.82rem;
  color: var(--muted);
  font-weight: 500;
}

.checklist-source a {
  font-weight: 750;
  color: var(--accent);
  text-decoration: none;
}

.checklist-source a:hover,
.checklist-source a:focus-visible {
  text-decoration: underline;
  outline: none;
}

.checklist-section {
  border: 0 !important;
  background: transparent !important;
  padding: 0.55rem 0.15rem 0.15rem !important;
  margin-top: 0.25rem;
}

.checklist-section strong {
  display: block;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--accent);
}

.checklist-section label,
.checklist-section input {
  display: none;
}

.embed-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.embed-card {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}

.embed-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  background: var(--surface-2);
}

.embed-head p {
  margin: 0;
  color: var(--muted);
  font-size: 0.86rem;
}

.embed-card iframe,
.embed-card .embed-frame {
  display: block;
  width: 100%;
  height: min(48vh, 380px);
  min-height: 260px;
  border: 0;
  background: #111;
}

.embed-card--detail iframe,
.embed-card--detail .embed-frame--detail {
  height: min(58vh, 520px);
  min-height: 360px;
}

.embed-card--full {
  margin-bottom: 14px;
}

.embed-card--full .embed-frame--full {
  height: min(72vh, 820px);
  min-height: 480px;
}

.embed-grid .embed-card--full {
  grid-column: 1 / -1;
  width: 100%;
}

.skyvector-chart-wrap {
  padding: 0 12px 12px;
}

.skyvector-chart {
  width: 100%;
  height: min(72vh, 820px);
  min-height: 480px;
  box-sizing: border-box;
}

.subhead {
  margin: 0 0 10px;
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--muted);
}

.muted {
  color: var(--muted);
  font-size: 0.92rem;
}

.ref-card--emergency {
  grid-column: 1 / -1;
  padding: 16px 18px;
  border: 1px solid color-mix(in srgb, var(--bad) 55%, var(--line));
  background: color-mix(in srgb, var(--bad) 12%, var(--surface-2));
  box-shadow: none;
}

.ref-card--emergency h3 {
  color: var(--bad);
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 0 0 0.55rem;
}

.ref-card--emergency ul {
  color: var(--ink);
  font-weight: 550;
  line-height: 1.45;
}

.ref-card--emergency li + li {
  margin-top: 10px;
}

.resource-image-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
}

.resource-image-card {
  margin: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
  text-align: center;
  min-width: 0;
}

.resource-image-open {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: zoom-in;
  text-align: center;
}

.resource-image-open img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 140px;
  margin: 0 auto;
  object-fit: contain;
  border-radius: 8px;
}

.resource-image-hint {
  display: block;
  margin-top: 6px;
  font-size: 0.72rem;
  color: var(--muted);
  line-height: 1.2;
}

.resource-image-open:hover .resource-image-hint,
.resource-image-open:focus-visible .resource-image-hint {
  color: var(--accent, #1d4ed8);
}

.image-lightbox {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  place-items: center;
  padding: 20px;
}

.image-lightbox[hidden] {
  display: none;
}

.image-lightbox-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(15, 23, 42, 0.82);
  cursor: zoom-out;
}

.image-lightbox-dialog {
  position: relative;
  z-index: 1;
  max-width: min(96vw, 1200px);
  max-height: 92vh;
}

.image-lightbox-dialog img {
  display: block;
  max-width: 100%;
  max-height: 92vh;
  width: auto;
  height: auto;
  margin: 0 auto;
  border-radius: 10px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
}

.image-lightbox-close {
  position: absolute;
  top: -12px;
  right: -12px;
  z-index: 2;
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 999px;
  background: #fff;
  color: #0f172a;
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
}

body.lightbox-open {
  overflow: hidden;
}

/* Flight card popup (Calls / Training / PFR View flight) — must stack above PFR editor (420) */
.flight-card-popup-host {
  position: fixed;
  inset: 0;
  z-index: 440;
  display: flex;
  align-items: stretch;
  justify-content: center;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  height: 100dvh;
  max-height: 100dvh;
  padding: 0;
  background: rgba(2, 6, 14, 0.88);
  backdrop-filter: blur(4px);
  -webkit-overflow-scrolling: touch;
}
.flight-card-popup-host[hidden] {
  display: none !important;
}
.flight-card-popup-panel {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100dvh;
  margin: 0;
  border-radius: 0;
  border: 0;
  background: var(--surface, #0f172a);
  box-shadow: none;
  overflow: hidden;
  padding-top: env(safe-area-inset-top, 0);
  padding-bottom: env(safe-area-inset-bottom, 0);
  padding-left: env(safe-area-inset-left, 0);
  padding-right: env(safe-area-inset-right, 0);
  box-sizing: border-box;
}
.flight-card-popup-toolbar {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px 10px;
  border-bottom: 1px solid color-mix(in srgb, var(--line) 85%, transparent);
  background: color-mix(in srgb, var(--surface-2, #1a1f2a) 92%, #000);
}
.flight-card-popup-toolbar-main {
  min-width: 0;
  flex: 1 1 auto;
}
.flight-card-popup-kicker {
  margin: 0 0 2px;
  font: 800 10px/1.2 var(--font, system-ui, sans-serif);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--accent, #b8ad86);
}
.flight-card-popup-title {
  margin: 0;
  font: 800 1.05rem/1.25 var(--font, system-ui, sans-serif);
  color: var(--ink, #e8edf5);
  word-break: break-word;
}
.flight-card-popup-subtitle {
  margin: 2px 0 0;
  font: 600 0.82rem/1.3 var(--font, system-ui, sans-serif);
  color: var(--muted, #9aa6b8);
}
.flight-card-popup-toolbar-actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 8px;
}
.flight-card-popup-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: 12px 14px 20px;
  outline: none;
}
html.flight-card-popup-open,
html.flight-card-popup-open body {
  overflow: hidden !important;
}

/* Watch Flight overlay — above View flight card (440) and PFR editor (420) */
.watch-flight-host {
  position: fixed;
  inset: 0;
  z-index: 450;
  display: flex;
  align-items: stretch;
  justify-content: center;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  height: 100dvh;
  max-height: 100dvh;
  padding: 0;
  background: rgba(2, 6, 14, 0.88);
  backdrop-filter: blur(4px);
  -webkit-overflow-scrolling: touch;
}
.watch-flight-host[hidden] {
  display: none !important;
}
.watch-flight-panel {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100dvh;
  margin: 0;
  border-radius: 0;
  border: 0;
  background: var(--surface, #0f172a);
  box-shadow: none;
  overflow: hidden;
  padding-top: env(safe-area-inset-top, 0);
  padding-bottom: env(safe-area-inset-bottom, 0);
  padding-left: env(safe-area-inset-left, 0);
  padding-right: env(safe-area-inset-right, 0);
  box-sizing: border-box;
}
.watch-flight-toolbar {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.7rem 0.9rem;
  border-bottom: 1px solid var(--line, #334);
  background: var(--surface-2, #111827);
}
.watch-flight-kicker {
  margin: 0;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--accent, #c4a574);
}
.watch-flight-title {
  margin: 0.15rem 0 0;
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--ink, #e2e8f0);
  line-height: 1.25;
}
.watch-flight-subtitle {
  margin: 0.2rem 0 0;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--muted, #94a3b8);
  line-height: 1.3;
}
.watch-flight-profiles {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: 0.4rem 0.55rem 0.15rem;
  border-top: 1px solid var(--line, #334);
  background: var(--surface-2, #111827);
  min-width: 0;
  overflow: hidden;
  box-sizing: border-box;
}
.watch-flight-profile {
  display: grid;
  grid-template-columns: 3.5rem minmax(0, 1fr);
  gap: 0.35rem;
  align-items: center;
  min-width: 0;
  overflow: hidden;
}
.watch-flight-profile-label {
  font-size: 0.65rem;
  font-weight: 750;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted, #94a3b8);
}
.watch-flight-chart {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  height: 48px;
  border-radius: 4px;
  background: color-mix(in srgb, var(--surface, #0b1220) 80%, #000);
  box-sizing: border-box;
}
.watch-flight-telem--meta {
  margin-bottom: 0.15rem;
}
.watch-flight-telem-wide {
  grid-column: 1 / -1;
}
.watch-flight-wx {
  margin: 0;
  font-size: 0.82rem;
  line-height: 1.4;
  color: var(--ink, #e2e8f0);
  font-weight: 600;
}
.wf-home-marker {
  background: transparent !important;
  border: 0 !important;
}
.wf-home-dot {
  width: 12px;
  height: 12px;
  border-radius: 2px;
  background: #fbbf24;
  border: 2px solid #fef3c7;
  box-shadow: 0 0 0 2px rgba(251, 191, 36, 0.35);
  transform: rotate(45deg);
}
.watch-flight-toolbar-actions {
  flex: 0 0 auto;
  display: flex;
  gap: 0.4rem;
}
.watch-flight-body {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.watch-flight-map-col {
  flex: 1 1 55%;
  min-width: 0;
  min-height: 12rem;
  display: flex;
  flex-direction: column;
  border-right: 0;
  border-bottom: 1px solid var(--line, #334);
}
.watch-flight-map-wrap {
  position: relative;
  flex: 1 1 auto;
  min-height: 12rem;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.watch-flight-map {
  flex: 1 1 auto;
  min-height: 12rem;
  height: 100%;
  width: 100%;
  background: #0b1220;
  touch-action: pan-x pan-y;
}
.watch-flight-map .leaflet-container {
  width: 100% !important;
  height: 100% !important;
  min-height: 12rem;
  background: #0b1220;
  font: inherit;
}
.watch-flight-map.is-satellite .leaflet-tile-pane {
  filter: none;
}
.wf-basemap-btn {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 1000;
  min-height: 32px;
  padding: 6px 12px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(12, 18, 28, 0.88);
  color: #e8edf5;
  font: 700 0.78rem/1.2 system-ui, -apple-system, sans-serif;
  letter-spacing: 0.03em;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.wf-basemap-btn:hover {
  border-color: rgba(56, 189, 248, 0.55);
  color: #fff;
}
.wf-basemap-btn.is-active {
  background: rgba(14, 90, 140, 0.9);
  border-color: rgba(56, 189, 248, 0.65);
}
.wf-basemap-btn:focus {
  outline: none;
}
.wf-basemap-btn:focus-visible {
  outline: 2px solid #38bdf8;
  outline-offset: 2px;
}
/* No OSM/CARTO copyright chrome on Watch Flight playback */
.watch-flight-map .leaflet-control-attribution,
.watch-flight-host .leaflet-control-attribution {
  display: none !important;
}
.watch-flight-scrubber {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.45rem 0.55rem;
  padding: 0.55rem 0.75rem;
  border-top: 1px solid var(--line, #334);
  background: var(--surface-2, #111827);
}
.watch-flight-play {
  flex: 0 0 auto;
  min-width: 2.75rem;
  min-height: 2.5rem;
  font-variant-numeric: tabular-nums;
}
.watch-flight-slider {
  flex: 1 1 8rem;
  min-width: 0;
  height: 2rem;
  accent-color: var(--accent, #38bdf8);
  cursor: pointer;
  touch-action: none;
}
.watch-flight-time {
  flex: 0 0 auto;
  min-width: 5.5rem;
  text-align: right;
  font-size: 0.82rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--muted, #94a3b8);
}
.watch-flight-side {
  flex: 0 1 42%;
  min-width: 0;
  min-height: 0;
  max-height: 42dvh;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  padding: 0.65rem;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  background: var(--surface, #0f172a);
}
.watch-flight-card {
  flex: 0 0 auto;
  padding: 0.6rem 0.7rem;
  border-radius: 10px;
  border: 1px solid var(--line, #334);
  background: var(--surface-2, #111827);
}
.watch-flight-card--closes {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.watch-flight-card-head {
  margin: 0 0 0.45rem;
}
.watch-flight-telem {
  margin: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.4rem 0.65rem;
}
.watch-flight-telem div {
  min-width: 0;
}
.watch-flight-telem dt {
  margin: 0;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted, #94a3b8);
}
.watch-flight-telem dd {
  margin: 0.1rem 0 0;
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--ink, #e2e8f0);
  word-break: break-word;
}
.watch-flight-close-list {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.watch-flight-close-item {
  cursor: pointer;
  border-radius: 6px;
  padding: 0.35rem 0.35rem;
  margin: 0 -0.25rem;
  min-height: 2.4rem;
}
.watch-flight-close-item:hover,
.watch-flight-close-item:focus {
  outline: none;
  background: color-mix(in srgb, var(--accent, #38bdf8) 12%, transparent);
}
.watch-flight-status {
  flex: 0 0 auto;
  margin: 0;
  padding: 0.45rem 0.9rem 0.65rem;
  font-size: 0.88rem;
  color: var(--muted, #94a3b8);
}
.watch-flight-status.is-error {
  color: #fca5a5;
}
.wf-kit-marker,
.wf-close-marker {
  background: transparent !important;
  border: 0 !important;
}
.wf-kit-dot {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #38bdf8;
  border: 2px solid #e0f2fe;
  box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.35), 0 2px 8px rgba(0, 0, 0, 0.45);
}
.wf-close-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #f97316;
  border: 2px solid #ffedd5;
  box-shadow: 0 0 0 2px rgba(249, 115, 22, 0.35);
}
.flight-audit-head-actions {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 0.4rem;
  margin-left: auto;
  align-self: flex-start;
}
/* Pilot expanded flight card: full-width Watch flight bar above accordions */
.pilot-flight-card-toolbar {
  display: flex;
  justify-content: stretch;
  align-items: stretch;
  width: 100%;
  margin: 0 0 0.55rem;
  min-height: 0;
  box-sizing: border-box;
}
.pilot-flight-watch-slot {
  display: flex;
  align-items: stretch;
  justify-content: stretch;
  width: 100%;
  min-height: 0;
}
.pilot-flight-watch-slot:empty {
  display: none;
}
.watch-flight-btn {
  white-space: nowrap;
}
/* Full-width Watch flight CTA on flight cards */
.watch-flight-btn--full,
button.watch-flight-btn--full {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 2.35rem;
  padding: 0.45rem 0.75rem;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  border-radius: 8px;
  box-sizing: border-box;
}
.pilot-flight-card-toolbar .watch-flight-btn--full,
.pilot-flight-watch-slot .watch-flight-btn--full {
  width: 100%;
}
/* Admin flight audit: full-width Watch under head */
.flight-audit-head-actions:has(.watch-flight-btn--full) {
  flex: 1 1 100%;
  width: 100%;
  margin-left: 0;
  margin-top: 0.35rem;
}
.flight-audit-head-actions .watch-flight-btn--full {
  width: 100%;
}
.flight-audit-panel .flight-audit-head {
  flex-wrap: wrap;
}
html.watch-flight-open,
body.watch-flight-open {
  overflow: hidden !important;
  height: 100%;
  height: 100dvh;
  overscroll-behavior: none;
}
body.watch-flight-open .bottom-nav,
body.watch-flight-open .shell-header {
  visibility: hidden !important;
  pointer-events: none !important;
}
/* Desktop: floating panel with side telem column */
@media (min-width: 801px) {
  .watch-flight-host {
    padding: 0.5rem;
    background: rgba(2, 6, 14, 0.72);
  }
  .watch-flight-panel {
    width: min(1200px, 100%);
    max-width: 100%;
    height: min(920px, calc(100dvh - 1rem));
    max-height: calc(100dvh - 1rem);
    margin: auto;
    border-radius: 12px;
    border: 1px solid color-mix(in srgb, var(--accent, #c4a574) 35%, var(--line, #334));
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.45);
    padding: 0;
  }
  .watch-flight-body {
    flex-direction: row;
  }
  .watch-flight-map-col {
    flex: 1 1 auto;
    border-right: 1px solid var(--line, #334);
    border-bottom: 0;
    min-height: 0;
  }
  .watch-flight-map {
    min-height: 16rem;
  }
  .watch-flight-side {
    flex: 0 0 18rem;
    max-height: none;
    width: 18rem;
  }
}
/* Expand-card section accordion (Flights / Calls / Training) */
.uas-acc-stack {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  min-width: 0;
}
.uas-acc-section {
  border: 1px solid var(--line, #334);
  border-radius: 10px;
  background: var(--surface-2, #111827);
  overflow: hidden;
}
.uas-acc-toggle {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  width: 100%;
  margin: 0;
  padding: 0.55rem 0.7rem;
  border: 0;
  background: color-mix(in srgb, var(--surface, #0f172a) 55%, transparent);
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  min-height: 2.6rem;
}
.uas-acc-toggle:hover,
.uas-acc-toggle:focus-visible {
  outline: none;
  background: color-mix(in srgb, var(--accent, #c4a574) 12%, var(--surface-2, #111827));
}
.uas-acc-chevron {
  flex: 0 0 auto;
  width: 1rem;
  text-align: center;
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--muted, #94a3b8);
}
.uas-acc-title {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--accent, #c4a574);
}
.uas-acc-count {
  flex: 0 0 auto;
}
.uas-acc-body {
  padding: 0.55rem 0.7rem 0.7rem;
  border-top: 1px solid var(--line, #334);
  background: var(--surface, #0f172a);
  min-width: 0;
}
.uas-acc-body[hidden] {
  display: none !important;
}
.uas-acc-body .uas-acc-inner {
  min-width: 0;
}
/* Nested audit accordion inside Flight Audit section */
.uas-acc-body > .uas-acc-stack {
  gap: 0.35rem;
}
.uas-acc-body .fa-card,
.uas-acc-body .fa-weather-wrap,
.uas-acc-body .calls-cfs-detail-card,
.uas-acc-body .pilot-calls-cfs-detail,
.uas-acc-body .pilot-flight-details-card {
  margin: 0;
}
.uas-acc-body .data-table {
  margin: 0;
}
.uas-acc-body .unit-record-sublist {
  margin: 0;
}
.flight-audit-panel .uas-acc-stack,
.calls-cr-detail .uas-acc-stack,
.training-event-detail .uas-acc-stack,
.unit-record-card-expand .uas-acc-stack {
  margin-top: 0.15rem;
}

/* Linked flight actions — small secondary buttons (not primary CTAs) */
.unit-record-flight-row {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.35rem;
  padding: 0.4rem 0.5rem;
}
.unit-record-flight-actions {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.3rem;
  margin-top: 0.05rem;
}
.unit-record-flight-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  margin: 0;
  min-height: 1.65rem;
  padding: 0.15rem 0.55rem;
  border: 1px solid var(--line, #334);
  border-radius: 6px;
  background: var(--surface, #0f172a);
  color: var(--ink, #e2e8f0);
  font: inherit;
  font-size: 0.7rem;
  font-weight: 650;
  letter-spacing: 0.01em;
  line-height: 1.2;
  text-align: center;
  cursor: pointer;
  white-space: nowrap;
  box-shadow: none;
  -webkit-tap-highlight-color: transparent;
}
.unit-record-flight-action:hover,
.unit-record-flight-action:focus-visible {
  outline: none;
  border-color: color-mix(in srgb, var(--accent, #c4a574) 45%, var(--line, #334));
  background: color-mix(in srgb, var(--surface-2, #111827) 80%, var(--accent, #c4a574) 8%);
  color: var(--ink, #e2e8f0);
  text-decoration: none;
}
.unit-record-flight-action:active {
  transform: translateY(0.5px);
  opacity: 0.92;
}
.unit-record-flight-action--watch {
  border-color: color-mix(in srgb, var(--accent, #c4a574) 35%, var(--line, #334));
  color: color-mix(in srgb, var(--accent, #c4a574) 70%, var(--ink, #e2e8f0));
}
@media (min-width: 560px) {
  .unit-record-flight-row {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem 0.75rem;
  }
  .unit-record-flight-actions {
    flex: 0 0 auto;
    margin-top: 0;
    justify-content: flex-end;
  }
}
.calls-cr-linked-flights {
  margin: 0;
  padding: 0;
  list-style: none;
}
.calls-cr-linked-flights .unit-record-subitem {
  margin: 0 0 0.35rem;
  border: 1px solid color-mix(in srgb, var(--line, #334) 80%, transparent);
  border-radius: 8px;
  background: color-mix(in srgb, var(--surface-2, #111827) 70%, transparent);
}
/* Quiet Watch chip on flight-audit / flight-details heads */
.watch-flight-btn--quiet,
button.watch-flight-btn--quiet {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.65rem;
  padding: 0.15rem 0.55rem;
  border: 1px solid color-mix(in srgb, var(--accent, #c4a574) 35%, var(--line, #334));
  border-radius: 6px;
  background: var(--surface, #0f172a);
  box-shadow: none;
  font-size: 0.7rem;
  font-weight: 650;
  letter-spacing: 0.01em;
  color: color-mix(in srgb, var(--accent, #c4a574) 70%, var(--ink, #e2e8f0));
  white-space: nowrap;
  cursor: pointer;
}
.watch-flight-btn--quiet:hover,
.watch-flight-btn--quiet:focus-visible {
  outline: none;
  border-color: color-mix(in srgb, var(--accent, #c4a574) 55%, var(--line, #334));
  background: color-mix(in srgb, var(--surface-2, #111827) 80%, var(--accent, #c4a574) 8%);
  text-decoration: none;
}
.flight-audit-head-actions .watch-flight-btn--quiet,
.pilot-flight-card-toolbar .watch-flight-btn--quiet {
  margin-top: 0;
}
.pilot-flight-card-toolbar .watch-flight-btn--full,
.flight-audit-head-actions .watch-flight-btn--full {
  /* Keep quiet palette but read as a full bar */
  min-height: 2.35rem;
  opacity: 0.95;
}

/* In-app PDF viewer â€” full viewport, PDF area fills remaining height under toolbar */
.pdf-viewer-host {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  height: 100dvh;
  max-height: 100dvh;
  z-index: 200;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  background: #0f172a;
  padding: env(safe-area-inset-top, 0) env(safe-area-inset-right, 0) env(safe-area-inset-bottom, 0)
    env(safe-area-inset-left, 0);
}

.pdf-viewer-host[hidden] {
  display: none !important;
}

.pdf-viewer-panel {
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
  max-height: 100%;
  display: flex;
  flex-direction: column;
  margin: 0;
  background: var(--surface, #fff);
  overflow: hidden;
}

.pdf-viewer-toolbar {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  background: var(--surface-2, #f4f6fa);
  z-index: 2;
}

.pdf-viewer-title {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 0.9rem;
  font-weight: 800;
  color: var(--ink);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pdf-viewer-actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 8px;
}

.pdf-viewer-actions .btn-primary {
  min-width: 5.5rem;
  font-weight: 800;
}

/* Scrollable page stack â€” each page canvas is scaled to fit width */
.pdf-viewer-frame-wrap {
  flex: 1 1 auto;
  min-height: 0;
  position: relative;
  width: 100%;
  overflow: auto;
  overflow-x: hidden;
  background: #3c4043;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

.pdf-viewer-pages {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 8px 0 16px;
  box-sizing: border-box;
}

.pdf-viewer-page {
  width: 100%;
  display: flex;
  justify-content: center;
  line-height: 0;
}

.pdf-viewer-page-canvas {
  display: block;
  max-width: 100%;
  height: auto;
  background: #fff;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
}

.pdf-viewer-frame {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  background: #525659;
}

.pdf-viewer-frame[hidden] {
  display: none !important;
}

.pdf-viewer-status {
  position: absolute;
  left: 50%;
  top: 40%;
  transform: translate(-50%, -50%);
  margin: 0;
  padding: 10px 14px;
  border-radius: 8px;
  background: rgba(15, 23, 42, 0.82);
  color: #fff;
  font-size: 0.85rem;
  font-weight: 600;
  z-index: 3;
  pointer-events: none;
}

.pdf-viewer-status[hidden] {
  display: none !important;
}

.pdf-viewer-status.is-error {
  background: rgba(127, 29, 29, 0.9);
}

html.pdf-viewer-open,
body.pdf-viewer-open {
  overflow: hidden !important;
  height: 100%;
  height: 100dvh;
  max-height: 100dvh;
  overscroll-behavior: none;
}

/* Keep shell chrome under the viewer */
body.pdf-viewer-open .bottom-nav,
body.pdf-viewer-open .shell-header {
  visibility: hidden;
  pointer-events: none;
}

html[data-theme="night"] .pdf-viewer-panel {
  background: var(--surface);
}

html[data-theme="night"] .pdf-viewer-toolbar {
  background: var(--surface-2);
  border-color: var(--line);
}

.ref-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.ref-card {
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2);
  color: var(--ink);
}

.ref-card h3 {
  margin: 0 0 0.55rem;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--accent);
}

.ref-card ul {
  margin: 0;
  padding-left: 1.1rem;
  color: var(--ink);
  font-size: 0.9rem;
  line-height: 1.45;
}

.ref-card ul li::marker {
  color: var(--accent);
}

.phone-grid,
.doc-grid {
  display: grid;
  gap: 10px;
}

.phone-item,
.doc-item {
  display: grid;
  gap: 4px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2);
  color: var(--ink);
}

.log-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  max-height: 280px;
  overflow: auto;
}

.log-list li {
  padding: 10px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--accent);
  border-radius: 10px;
  background: var(--surface-2);
}

.training-session-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.training-session-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  flex-shrink: 0;
}

.training-session-item--edit .training-session-edit-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  grid-column: 1 / -1;
}

.training-log-form-in-detail,
.training-log-form-standalone {
  margin-top: 14px;
}

.training-session-item .training-session-title {
  line-height: 1.35;
}

.training-session-item .training-session-meta {
  margin-top: 4px;
  font-size: 0.8125rem;
  color: var(--muted);
  line-height: 1.35;
}

.training-session-item .ops-note-body {
  margin-top: 8px;
}

.log-entry-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}

.log-entry-head > span {
  color: var(--muted);
  font-size: 0.8rem;
}

.log-kit-label {
  display: block;
  margin-top: 2px;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--muted);
}

.log-entry--ok {
  border-left-color: var(--ok);
}

.log-entry--warn {
  border-left-color: var(--warn);
}

.log-entry--neutral {
  border-left-color: var(--accent);
}

.log-entry--empty {
  border-left-color: var(--line);
  color: var(--muted);
}

.field-section--log {
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.field-section--log .log-list {
  max-height: 360px;
}

.log-list .ops-note-body {
  margin-top: 8px;
}

.training-sessions-panel {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.training-sessions-pilot {
  margin: 0;
  font-weight: 700;
}

.training-sessions-block h4 {
  margin: 0 0 6px;
  font-size: 0.95rem;
}

.training-month-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin-bottom: 6px;
}

.home-welcome-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
}

.home-logout-btn {
  flex-shrink: 0;
}

.home-kit-action-hint {
  margin: 10px 0 0;
}

.custody-inline-confirm {
  margin: 12px 0 0;
}

.custody-inline-confirm-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.custody-signout-row-head .btn-compact {
  margin-top: 6px;
}

.btn-primary:focus-visible,
.btn-secondary:focus-visible,
.bottom-nav button:focus-visible,
.kit-picker select:focus-visible {
  outline: 2px solid var(--accent, #3b82f6);
  outline-offset: 2px;
}

.home-welcome-block {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  min-width: 0;
}

.home-welcome-title {
  margin: 0;
  font-size: 1.45rem;
  line-height: 1.2;
}

.home-welcome-status {
  margin: 0;
}

.home-welcome-fly-detail {
  margin: 0;
  max-width: 640px;
}

details.collapsible-log {
  margin-bottom: 16px;
}

details.collapsible-log summary {
  cursor: pointer;
  font-weight: 700;
  padding: 10px 12px;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: 4px;
  list-style: none;
  user-select: none;
}

details.collapsible-log summary::marker,
details.collapsible-log summary::-webkit-details-marker {
  display: none;
}

details.collapsible-log[open] summary {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom: none;
  margin-bottom: 0;
}

details.collapsible-log > div {
  padding: 12px;
  border: 1px solid var(--line);
  border-top: none;
  border-radius: 0 0 4px 4px;
}

details.kit-subsection {
  margin-bottom: 8px;
}

details.kit-subsection summary {
  cursor: pointer;
  font-weight: 700;
  padding: 6px 10px;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: 4px;
  list-style: none;
  user-select: none;
  font-size: 0.9em;
}

details.kit-subsection summary::marker,
details.kit-subsection summary::-webkit-details-marker {
  display: none;
}

details.kit-subsection[open] summary {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom: none;
  margin-bottom: 0;
}

details.kit-subsection > div.kit-subsection-body {
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-top: none;
  border-radius: 0 0 4px 4px;
  background: var(--surface);
}

.home-welcome-roles {
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--muted);
  margin-top: 2px;
  margin-bottom: 4px;
  white-space: normal;
  opacity: 0.9;
}

.pilot-docs-section-title {
  margin: 14px 0 8px;
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.pilot-credential-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 16px;
  margin-bottom: 10px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.pilot-credential-facts {
  display: flex;
  flex: 1 1 auto;
  flex-wrap: wrap;
  gap: 12px 28px;
  min-width: min(100%, 220px);
}

.pilot-credential-fact {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 110px;
}

.pilot-credential-fact-label {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.pilot-credential-fact-value {
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1.25;
}

.pilot-credential-fact-value--missing {
  color: var(--muted);
  font-weight: 600;
}

.pilot-credential-strip-status {
  flex: 0 0 auto;
}

.pilot-credential-pdf-hint {
  margin: 0 0 4px;
}

.pilot-doc-grid--inline {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.pilot-doc-grid--inline .doc-item--chip {
  display: inline-flex;
  flex: 1 1 160px;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  max-width: 100%;
  padding: 8px 12px;
}

.pilot-doc-grid--inline .doc-item--chip strong {
  font-size: 0.86rem;
  font-weight: 700;
}

.pilot-doc-grid--inline .doc-item--chip a {
  flex: 0 0 auto;
  font-size: 0.82rem;
  font-weight: 700;
  white-space: nowrap;
}

.pilot-docs-section-title:first-of-type {
  margin-top: 0;
}

.pilot-credential-group {
  margin-bottom: 4px;
}

.pilot-credential-block + .pilot-credential-block {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.pilot-credential-subtitle {
  margin: 0 0 8px;
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.pilot-credential-block .pilot-credential-strip {
  margin-bottom: 0;
}

/* ---- Pilot current status (combined welcome + metrics) ---- */
.pilot-status-board {
  margin: 0 0 0.85rem;
}

.pilot-status-roles {
  margin: 0 0 0.45rem;
  font-size: 0.88rem;
  color: var(--muted, #666);
  font-weight: 600;
}

.pilot-status-badges {
  margin: 0 0 0.55rem;
}

.pilot-status-fly-detail {
  margin: 0 0 0.65rem;
}

.pilot-status-metrics {
  margin: 0.35rem 0 0;
}

.pilot-status-board .home-logout-btn {
  flex-shrink: 0;
}

/* ---- Live ops status board ---- */
/* Live Air Picture embed (Tailscale Funnel map) */
.home-air-picture {
  overflow: visible;
  padding: 0;
}
.home-air-picture-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px 8px;
}
.home-air-picture-head .kicker {
  margin: 0;
}
.home-air-picture-open {
  flex-shrink: 0;
  font: 700 12px/1.2 var(--font, system-ui, sans-serif);
  color: var(--accent, #b8ad86);
  text-decoration: none;
  padding: 6px 10px;
  border: 1px solid var(--line, #2c3444);
  border-radius: 8px;
  background: var(--surface-2, #222836);
}
.home-air-picture-open:hover {
  border-color: var(--accent, #b8ad86);
  color: var(--ink, #e8edf5);
}
.home-air-picture-frame-wrap {
  position: relative;
  width: 100%;
  height: min(28vh, 280px);
  min-height: 160px;
  max-height: 320px;
  background: #0f1218;
  border-top: 1px solid var(--line);
  overflow: hidden; /* clip iframe only; button lives inside iframe top-right */
  border-radius: 0;
}
.home-air-picture-frame {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: #0f1218;
}

/* Open Full Map cover: pilot chrome must never appear above the map */
html.map-fullscreen-open,
body.map-fullscreen-open {
  overflow: hidden !important;
  height: 100% !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  overscroll-behavior: none !important;
  background: #0a0c10 !important;
}
body.map-fullscreen-open .bottom-nav,
body.map-fullscreen-open .shell-header,
body.map-fullscreen-open #bottomNav,
html.map-fullscreen-open .bottom-nav,
html.map-fullscreen-open .shell-header,
body.map-fullscreen-open #appLayout,
html.map-fullscreen-open #appLayout {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  opacity: 0 !important;
  height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  z-index: 0 !important;
}
/* Full-viewport map cover iframe (created by shared.js) */
#uasFullMapCover {
  position: fixed !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  height: 100dvh !important;
  border: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 2147483646 !important;
  background: #0a0c10 !important;
  display: block !important;
}

/* TFR status under embed map — same banner as Resources TFR card footer */
.home-air-picture-tfr {
  flex: 0 0 auto;
  width: 100%;
  box-sizing: border-box;
  border-top: 1px solid var(--line);
  border-radius: 0 0 var(--radius, 10px) var(--radius, 10px);
  overflow: hidden;
}
.home-air-picture-tfr .base-weather-flight-banner.wx-tfr-banner {
  width: 100%;
  box-sizing: border-box;
  border-radius: 0;
  margin: 0;
}
@media (max-width: 640px) {
  .home-air-picture-tfr .base-weather-flight-banner-title,
  .home-air-picture-tfr .base-weather-flight-banner-sub {
    white-space: normal;
  }
}
@media (max-width: 800px) {
  .home-air-picture-frame-wrap {
    height: min(24vh, 220px);
    min-height: 140px;
    max-height: 250px;
  }
}

.home-live-status-host {
  margin: 0;
}

.home-base-weather-host {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--ops-chip-gap);
}

.home-base-weather-host > .card {
  margin: 0;
}

/* Free base weather card â€” compact grid (match TFR/NOTAM chip padding) */
.base-weather-card,
.wx-notice-card,
.auth-airspace-card {
  padding: 0.55rem 0.7rem 0.6rem;
  margin: 0;
  box-sizing: border-box;
}

/* Loading: centered thinking spinner in place of weather chips */
.base-weather-card--loading {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 5.5rem;
}

.base-weather-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 4.5rem;
  padding: 0.75rem 0;
}

.base-weather-think {
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 50%;
  border: 2.5px solid color-mix(in srgb, var(--line) 70%, transparent);
  border-top-color: var(--accent, #b8ad86);
  border-right-color: color-mix(in srgb, var(--accent, #b8ad86) 45%, var(--line));
  animation: base-weather-think-spin 0.75s linear infinite;
  box-sizing: border-box;
}

@keyframes base-weather-think-spin {
  to {
    transform: rotate(360deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .base-weather-think {
    animation: base-weather-think-pulse 1.2s ease-in-out infinite;
    border-top-color: var(--accent, #b8ad86);
    border-right-color: var(--line);
  }
  @keyframes base-weather-think-pulse {
    0%,
    100% {
      opacity: 0.4;
    }
    50% {
      opacity: 1;
    }
  }
}

.base-weather-card > .kicker {
  margin: 0 0 0.3rem;
  white-space: normal;
  overflow: visible;
  text-overflow: unset;
}

.base-weather-meta {
  margin: -0.1rem 0 0.35rem;
  font-size: 0.58rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--muted, #6b7280);
  line-height: 1.25;
}

.base-weather-meta--stale {
  color: #b45309;
  font-weight: 700;
}

html[data-theme="night"] .base-weather-meta--stale {
  color: #fcd34d;
}

.base-weather-card--stale {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #e0a04a 45%, transparent);
}

.base-weather-head {
  margin-bottom: 0.4rem;
}

.base-weather-title {
  margin: 0.1rem 0 0;
  font-size: 0.95rem;
  font-weight: 800;
  color: var(--ink);
  line-height: 1.2;
}

.base-weather-sub {
  margin: 0.2rem 0 0;
}

.base-weather-flt {
  font-weight: 800;
  letter-spacing: 0.04em;
}

.base-weather-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
}

@media (min-width: 560px) {
  .base-weather-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 5px;
  }
}

.base-weather-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 5px 5px 5px;
  border-radius: 7px;
  border: 1px solid var(--line);
  background: var(--surface-2, #f4f6fa);
  min-width: 0;
  min-height: 0;
  box-sizing: border-box;
}
.base-weather-cell--metar {
  grid-column: 1 / -1;
  align-items: stretch;
  text-align: left;
  padding: 8px 10px;
}
.base-weather-cell--metar .base-weather-label {
  align-self: flex-start;
  margin-bottom: 0.25rem;
}
.base-weather-value--metar {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.78rem !important;
  font-weight: 550 !important;
  line-height: 1.35;
  word-break: break-word;
  white-space: pre-wrap;
}

/* Flight limits exceeded â€” red outline only; text/icons stay normal */
.base-weather-cell--alert {
  border-color: var(--bad, #f07167);
  border-width: 1.5px;
  background: var(--surface-2, #f4f6fa);
  box-shadow: none;
}

html[data-theme="night"] .base-weather-cell--alert {
  border-color: color-mix(in srgb, var(--bad, #f07167) 90%, #fff);
  background: color-mix(in srgb, var(--surface-2) 90%, #000);
}

/* Caution cells (incl. humidity ≥80%) — yellow outline only */
.base-weather-cell--caution {
  border-color: #e0a04a;
  border-width: 1.5px;
  background: var(--surface-2, #f4f6fa);
  box-shadow: none;
}

html[data-theme="night"] .base-weather-cell--caution {
  border-color: color-mix(in srgb, #e0a04a 85%, #fff);
  background: color-mix(in srgb, var(--surface-2) 90%, #000);
}

/* Bottom flight recommendation banner */
.base-weather-flight-banner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.12rem;
  margin: 0.55rem 0 0;
  padding: 0.45rem 0.6rem;
  border-radius: 8px;
  text-align: center;
  text-transform: uppercase;
  line-height: 1.2;
}

.base-weather-flight-banner-title {
  display: block;
  white-space: nowrap;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  line-height: 1.15;
}

.base-weather-flight-banner-sub {
  display: block;
  white-space: nowrap;
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.2;
  opacity: 0.88;
}

.base-weather-flight-banner--ok {
  background: color-mix(in srgb, var(--ok, #3ecf8e) 18%, var(--surface-2, #f4f6fa));
  border: 1px solid color-mix(in srgb, var(--ok, #3ecf8e) 55%, var(--line));
  color: color-mix(in srgb, var(--ok, #15803d) 85%, #052e16);
}

html[data-theme="night"] .base-weather-flight-banner--ok {
  background: color-mix(in srgb, var(--ok, #3ecf8e) 16%, var(--surface-2, #222836));
  border-color: color-mix(in srgb, var(--ok, #3ecf8e) 50%, var(--line));
  color: #86efac;
}

.base-weather-flight-banner--bad {
  background: color-mix(in srgb, var(--bad, #f07167) 20%, var(--surface-2, #f4f6fa));
  border: 1px solid color-mix(in srgb, var(--bad, #f07167) 60%, var(--line));
  color: var(--bad, #b42318);
}

html[data-theme="night"] .base-weather-flight-banner--bad {
  background: color-mix(in srgb, var(--bad, #f07167) 18%, var(--surface-2, #222836));
  border-color: color-mix(in srgb, var(--bad, #f07167) 55%, var(--line));
  color: #fca5a5;
}

.base-weather-flight-banner--caution {
  background: color-mix(in srgb, #e0a04a 20%, var(--surface-2, #f4f6fa));
  border: 1px solid color-mix(in srgb, #e0a04a 55%, var(--line));
  color: #92400e;
}

html[data-theme="night"] .base-weather-flight-banner--caution {
  background: color-mix(in srgb, #e0a04a 16%, var(--surface-2, #222836));
  border-color: color-mix(in srgb, #e0a04a 50%, var(--line));
  color: #fcd34d;
}

.base-weather-icon-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 0 2px;
  line-height: 0;
}

.base-weather-icon {
  width: 18px;
  height: 18px;
  display: block;
  opacity: 0.9;
  color: var(--accent, #2563eb);
}

.base-weather-label {
  display: block;
  width: 100%;
  font-size: 0.52rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0 0 1px;
  line-height: 1.1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.base-weather-value {
  display: block;
  width: 100%;
  font-size: 0.74rem;
  font-weight: 700;
  color: var(--ink);
  line-height: 1.15;
  overflow-wrap: anywhere;
}

html[data-theme="night"] .base-weather-icon {
  color: #9ec5ff;
  opacity: 0.95;
}

.base-weather-source {
  margin: 0.45rem 0 0;
  font-size: 0.7rem;
  line-height: 1.25;
}

/* TFR + NOTAM cards â€” separate chips under weather (padding matches weather chip) */
.wx-notice-card {
  min-width: 0;
}

/* TFR status banner — reuses .base-weather-flight-banner (same title/sub typography + tones) */
.wx-tfr-card {
  display: flex;
  flex-direction: column;
  gap: 0;
  overflow: visible;
}

.wx-notice-card.wx-tfr-card .base-weather-flight-banner.wx-tfr-banner {
  /* Identical layout to weather card footer banner */
  flex: 0 0 auto;
  width: 100%;
  box-sizing: border-box;
}

@media (max-width: 640px) {
  .wx-notice-card.wx-tfr-card .wx-notice-list {
    max-height: 12rem;
  }
  /* Weather titles use nowrap; allow wrap on very narrow so TFR lines stay readable */
  .wx-notice-card.wx-tfr-card .base-weather-flight-banner-title,
  .wx-notice-card.wx-tfr-card .base-weather-flight-banner-sub {
    white-space: normal;
  }
}

.wx-notice-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin: 0 0 0.4rem;
}

.wx-notice-card-head > .kicker {
  margin: 0;
  flex: 1 1 auto;
  min-width: 0;
  white-space: normal;
  overflow: visible;
  text-overflow: unset;
  line-height: 1.25;
}

.wx-notice-count {
  flex: 0 0 auto;
  min-width: 1.4rem;
  height: 1.25rem;
  padding: 0 0.45rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--surface-2, #f4f6fa);
  font-size: 0.65rem;
  font-weight: 800;
  color: var(--ink);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

.wx-notice-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 6px;
  max-height: 16rem;
  overflow: auto;
}

.wx-notice-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 6px 8px;
  padding: 7px 10px;
  border-radius: 7px;
  border: 1px solid var(--line);
  background: var(--surface-2, #f4f6fa);
  min-width: 0;
  line-height: 1.25;
}

.wx-notice-row.sev-alert {
  border-color: color-mix(in srgb, #ef4444 35%, var(--line));
}

.wx-notice-row.sev-caution {
  border-color: color-mix(in srgb, #64748b 40%, var(--line));
}

.wx-notice-tag {
  flex: 0 1 auto;
  margin-top: 0;
  max-width: 100%;
  padding: 2px 7px;
  border-radius: 4px;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  line-height: 1.2;
  white-space: normal;
  overflow: visible;
  text-overflow: unset;
  word-break: break-word;
  color: var(--ink);
  background: color-mix(in srgb, var(--line) 55%, transparent);
  border: 1px solid transparent;
}

/* Cool neutrals only â€” no yellow/gold on notice chips */
.wx-notice-tag.sev-info {
  color: #1d4ed8;
  background: color-mix(in srgb, #3b82f6 16%, transparent);
  border-color: color-mix(in srgb, #3b82f6 28%, transparent);
}

.wx-notice-tag.sev-caution {
  color: #334155;
  background: color-mix(in srgb, #64748b 18%, transparent);
  border-color: color-mix(in srgb, #64748b 32%, transparent);
}

.wx-notice-tag.sev-alert {
  color: #b91c1c;
  background: color-mix(in srgb, #ef4444 16%, transparent);
  border-color: color-mix(in srgb, #ef4444 30%, transparent);
}

.wx-notice-body {
  flex: 1 1 12rem;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.wx-notice-text {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--ink);
  line-height: 1.3;
  overflow-wrap: anywhere;
  white-space: normal;
}

.wx-notice-line {
  display: block;
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--muted);
  line-height: 1.35;
  overflow-wrap: anywhere;
  white-space: normal;
  margin-top: 2px;
}

.wx-notice-k {
  display: inline;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  font-size: 0.58rem;
  color: var(--ink);
  opacity: 0.72;
  margin-right: 0.35rem;
}

.wx-notice-detail {
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--muted);
  line-height: 1.3;
  overflow-wrap: anywhere;
  white-space: normal;
}

.wx-notice-meta {
  font-size: 0.62rem;
  font-weight: 600;
  color: var(--muted);
  line-height: 1.25;
  font-variant-numeric: tabular-nums;
  white-space: normal;
  overflow-wrap: anywhere;
}

.wx-notice-empty {
  margin: 0;
  padding: 4px 0;
  font-size: 0.74rem;
  font-weight: 600;
  color: var(--muted);
}

.wx-notice-more {
  margin: 6px 0 0;
  font-size: 0.62rem;
  font-weight: 600;
  color: var(--muted);
}

html[data-theme="night"] .base-weather-cell {
  background: color-mix(in srgb, var(--surface-2) 90%, #000);
}

html[data-theme="night"] .wx-notice-row,
html[data-theme="night"] .wx-notice-count {
  background: color-mix(in srgb, var(--surface-2) 90%, #000);
}

html[data-theme="night"] .wx-notice-tag.sev-info {
  color: #93c5fd;
  background: color-mix(in srgb, #3b82f6 22%, transparent);
}

html[data-theme="night"] .wx-notice-tag.sev-caution {
  color: #cbd5e1;
  background: color-mix(in srgb, #64748b 28%, transparent);
  border-color: color-mix(in srgb, #94a3b8 35%, transparent);
}

html[data-theme="night"] .wx-notice-tag.sev-alert {
  color: #fca5a5;
  background: color-mix(in srgb, #ef4444 22%, transparent);
}

.live-status-board {
  padding: 0.85rem 1rem 1rem;
}

.live-status-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.65rem;
}

/* Title uses same .kicker.home-kit-kicker as Equipment Status */
.live-status-title.kicker {
  margin: 0;
}

.live-status-badge-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.3rem;
}

/* Flight / stream chips between header divider and action divider */
.live-status-kit-body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.7rem 0;
  min-height: 2.4rem;
}

.live-status-badge-row--activity {
  margin-top: 0;
}

/* Full-width custody line under kit name (keeps SIGNED OUT - NAME - TIME on one line) */
.live-status-badge-row--custody {
  display: flex;
  width: 100%;
  max-width: 100%;
  margin: 0 0 0.45rem;
  padding: 0;
  min-width: 0;
  box-sizing: border-box;
}

.live-status-badge--out {
  display: block;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 0.62rem;
  letter-spacing: 0.02em;
  line-height: 1.25;
  padding: 0.28rem 0.45rem;
}

@media (max-width: 640px) {
  .live-status-badge--out {
    font-size: 0.58rem;
    letter-spacing: 0.015em;
    padding: 0.26rem 0.4rem;
  }
}

/* Match Current Weather chip gap (5px / 6px) for uniform Home look */
.live-status-summary {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 5px;
  margin-bottom: 0.75rem;
}

@media (min-width: 560px) {
  .live-status-summary {
    gap: 6px;
  }
}

/* Summary metric chips â€” equal width; label always one line */
.live-status-chip {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.15rem;
  min-height: 2.65rem;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: 7px 6px 8px;
  border-radius: 7px;
  font-size: 0.62rem;
  font-weight: 650;
  letter-spacing: 0.01em;
  text-align: center;
  line-height: 1.1;
  background: #fff;
  border: 1px solid var(--line, #dbe3ef);
  color: var(--ink, #0f172a);
  box-shadow: none;
}

.live-status-chip strong {
  display: block;
  font-weight: 800;
  font-size: 1.05rem;
  line-height: 1;
  min-width: 0;
  text-align: center;
  color: inherit;
}

.live-status-chip-label {
  display: block;
  width: 100%;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: inherit;
  font-weight: 650;
  line-height: 1.15;
  text-align: center;
}

@media (max-width: 420px) {
  .live-status-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 5px;
  }
  .live-status-chip {
    min-height: 2.65rem;
    font-size: 0.58rem;
    padding: 7px 5px 8px;
  }
  .live-status-chip strong {
    font-size: 0.95rem;
  }
}

/* Night: default neutral summary chips */
html[data-theme="night"] .live-status-chip,
html[data-theme="night"] .live-status-chip--available,
html[data-theme="night"] .live-status-chip--out,
html[data-theme="night"] .live-status-chip--grounded,
html[data-theme="night"] .live-status-chip--flight,
html[data-theme="night"] .live-status-chip--stream {
  background: var(--surface-2);
  border-color: var(--line);
  color: var(--ink);
  box-shadow: none;
}

html[data-theme="night"] .live-status-chip strong {
  color: var(--ink);
}

/* Kit row mini-badges â€” default neutral; only ops status chips are colored */
.live-status-badge {
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  padding: 0.18rem 0.45rem;
  border-radius: 6px;
  background: #fff;
  border: 1px solid var(--line, #dbe3ef);
  color: var(--ink, #0f172a);
  line-height: 1.2;
}

/* Custody / unknown â€” neutral */
.live-status-badge--out,
.live-status-badge--in,
.live-status-badge--unknown {
  background: #fff;
  border-color: var(--line, #dbe3ef);
  color: var(--ink, #0f172a);
}

/* Aircraft GO â€” green */
.live-status-badge--equip-go {
  background: rgba(22, 163, 74, 0.14);
  border-color: rgba(22, 163, 74, 0.4);
  color: #15803d;
}

/* Aircraft GROUNDED â€” red */
.live-status-badge--bad {
  background: rgba(220, 38, 38, 0.12);
  border-color: rgba(220, 38, 38, 0.42);
  color: #b91c1c;
}

/* In flight â€” blue */
.live-status-badge--flight {
  background: rgba(37, 99, 235, 0.12);
  border-color: rgba(37, 99, 235, 0.42);
  color: #1d4ed8;
}

/* On the ground â€” slate */
.live-status-badge--ground {
  background: rgba(100, 116, 139, 0.12);
  border-color: rgba(100, 116, 139, 0.35);
  color: #475569;
}

/* Live stream active â€” orange */
.live-status-badge--stream {
  background: rgba(234, 88, 12, 0.12);
  border-color: rgba(234, 88, 12, 0.42);
  color: #c2410c;
}

/* Live stream unavailable â€” muted slate */
.live-status-badge--stream-off {
  background: rgba(100, 116, 139, 0.1);
  border-color: rgba(100, 116, 139, 0.3);
  color: #64748b;
}

/* Night kit badges */
html[data-theme="night"] .live-status-badge,
html[data-theme="night"] .live-status-badge--out,
html[data-theme="night"] .live-status-badge--in,
html[data-theme="night"] .live-status-badge--unknown {
  background: var(--surface-2);
  border-color: var(--line);
  color: var(--ink);
}

html[data-theme="night"] .live-status-badge--equip-go {
  background: rgba(62, 207, 142, 0.16);
  border-color: rgba(62, 207, 142, 0.5);
  color: #3ecf8e;
}
html[data-theme="night"] .live-status-badge--bad {
  background: rgba(240, 113, 103, 0.16);
  border-color: rgba(240, 113, 103, 0.5);
  color: #f07167;
}
html[data-theme="night"] .live-status-badge--flight {
  background: rgba(108, 182, 224, 0.16);
  border-color: rgba(108, 182, 224, 0.5);
  color: #6cb6e0;
}
html[data-theme="night"] .live-status-badge--ground {
  background: rgba(154, 166, 184, 0.12);
  border-color: rgba(154, 166, 184, 0.35);
  color: #9aa6b8;
}
html[data-theme="night"] .live-status-badge--stream {
  background: rgba(251, 146, 60, 0.16);
  border-color: rgba(251, 146, 60, 0.5);
  color: #fb923c;
}
html[data-theme="night"] .live-status-badge--stream-off {
  background: rgba(154, 166, 184, 0.1);
  border-color: rgba(154, 166, 184, 0.3);
  color: #9aa6b8;
}

.live-status-kits {
  display: grid;
  gap: 0.75rem;
}

/* Desktop: roomy cards (was 240px min â†’ scrunched telem chips) */
@media (min-width: 720px) {
  .live-status-kits {
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 380px), 1fr));
  }
}

.live-status-kit {
  border: 1px solid var(--line, rgba(0, 0, 0, 0.12));
  border-radius: 10px;
  padding: 0.85rem 1rem;
  background: var(--surface, #fff);
  min-width: 0;
}

.live-status-kit--info,
.live-status-kit--warn,
.live-status-kit--bad,
.live-status-kit--ok {
  border-color: var(--line, rgba(0, 0, 0, 0.12));
  background: var(--surface, #fff);
}

html[data-theme="night"] .live-status-kit,
html[data-theme="night"] .live-status-kit--info,
html[data-theme="night"] .live-status-kit--warn,
html[data-theme="night"] .live-status-kit--bad,
html[data-theme="night"] .live-status-kit--ok {
  background: var(--surface-2);
  border-color: var(--line);
}

.live-status-kit-top {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0;
  /* Extra room between header content and the header divider */
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--line, #dbe3ef);
}

html[data-theme="night"] .live-status-kit-top {
  border-bottom-color: var(--line);
}

.live-status-kit-heading {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
  flex: 1 1 auto;
}

/* Kit id/name as a chip (larger than status badges) */
.live-status-badge--kit-name {
  font-size: 1.22rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: none;
  padding: 0.35rem 0.65rem;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  background: var(--surface-2, #f4f6fa);
  border-color: var(--line, #dbe3ef);
  color: var(--ink, #0f172a);
}

html[data-theme="night"] .live-status-badge--kit-name {
  background: color-mix(in srgb, var(--surface-2) 80%, #000);
  border-color: var(--line);
  color: var(--ink);
}

.live-status-kit-top > .live-status-badge {
  flex: 0 0 auto;
  margin-top: 0.15rem;
}

.live-status-kit-meta {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  margin-top: 0.35rem;
  font-size: 0.82rem;
  line-height: 1.35;
  color: var(--muted, #666);
  /* Never clip flight data on narrow screens */
  overflow: visible;
  max-width: 100%;
}

.live-status-kit-meta--telem {
  width: 100%;
}

/* Always 2Ã—2 â€” 4 columns on desktop was scrunching labels inside kit cards */
.live-status-telem-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  width: 100%;
}

.live-status-telem-chip {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 0.2rem;
  min-width: 0;
  padding: 0.55rem 0.65rem;
  border-radius: 8px;
  border: 1px solid var(--line, #dbe3ef);
  background: var(--surface-2, #f4f6fa);
  box-sizing: border-box;
}

.live-status-telem-label {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--muted, #64748b);
  line-height: 1.2;
}

.live-status-telem-value {
  font-size: 1.05rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: var(--ink, #0f172a);
  line-height: 1.15;
  word-break: break-word;
}

/* Wide single-kit desktop: slightly larger chips, still 2Ã—2 */
@media (min-width: 720px) {
  .live-status-telem-chip {
    padding: 0.65rem 0.75rem;
    min-height: 3.25rem;
  }
  .live-status-telem-label {
    font-size: 0.7rem;
  }
  .live-status-telem-value {
    font-size: 1.12rem;
  }
  .live-status-action-row {
    flex-wrap: wrap;
    gap: 10px;
  }
  .live-status-badge-row--activity {
    gap: 0.4rem;
  }
}

.live-status-kit-meta-row {
  font-variant-numeric: tabular-nums;
}

.live-status-kit-meta-row--pos {
  font-size: 0.78rem;
  word-break: break-all;
}

html[data-theme="night"] .live-status-kit-meta {
  color: var(--muted);
}

html[data-theme="night"] .live-status-telem-chip {
  background: color-mix(in srgb, var(--surface-2) 85%, #000);
  border-color: var(--line);
}

html[data-theme="night"] .live-status-telem-value {
  color: var(--ink);
}

/* Mobile home: keep activity chips + telem fully visible (2Ã—2 already default) */
@media (max-width: 640px) {
  .live-status-kit-body {
    min-height: 0;
    overflow: visible;
  }
  .live-status-badge-row--activity {
    flex-wrap: wrap;
    row-gap: 0.35rem;
  }
  .live-status-kit-meta--telem {
    margin-top: 0.45rem;
  }
  .live-status-telem-value {
    font-size: 1rem;
  }
}

.live-status-stream-link {
  display: inline-block;
  margin-top: 0.45rem;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--accent, #1a5fb4);
  text-decoration: underline;
}

/* Sign out / Sign in + View live stream + Share â€” one row */
.live-status-action-row {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 8px;
  margin-top: 0;
  padding-top: 0.65rem;
  border-top: 1px solid var(--line, #dbe3ef);
}

html[data-theme="night"] .live-status-action-row {
  border-top-color: var(--line);
}

.live-status-custody-btn,
.live-status-stream-btn,
.live-status-map-btn {
  flex: 1 1 0;
  min-width: 0;
  min-height: 38px;
  padding: 6px 10px;
  font-size: 0.8rem;
  text-decoration: none;
  text-align: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  white-space: nowrap;
}

/* Stream + Map share secondary style (not Sign out/in primary) */
.live-status-stream-btn,
a.live-status-stream-btn,
button.live-status-stream-btn,
.live-status-map-btn,
a.live-status-map-btn {
  background: var(--surface-2, #f4f6fa) !important;
  border: 1px solid var(--line) !important;
  color: var(--ink) !important;
  box-shadow: none !important;
  font-weight: 700;
  border-radius: 10px !important;
}

.live-status-stream-btn:hover:not(:disabled),
a.live-status-stream-btn:hover,
.live-status-stream-btn:focus-visible:not(:disabled),
.live-status-map-btn:hover,
a.live-status-map-btn:hover,
.live-status-map-btn:focus-visible {
  border-color: var(--accent) !important;
  color: var(--accent) !important;
  outline: none;
}

html[data-theme="night"] .live-status-stream-btn,
html[data-theme="night"] a.live-status-stream-btn,
html[data-theme="night"] button.live-status-stream-btn,
html[data-theme="night"] .live-status-map-btn,
html[data-theme="night"] a.live-status-map-btn {
  background: color-mix(in srgb, var(--surface-2) 90%, #000) !important;
  border-color: var(--line) !important;
  color: var(--ink) !important;
}

html[data-theme="night"] .live-status-stream-btn:hover:not(:disabled),
html[data-theme="night"] a.live-status-stream-btn:hover,
html[data-theme="night"] .live-status-stream-btn:focus-visible:not(:disabled),
html[data-theme="night"] .live-status-map-btn:hover,
html[data-theme="night"] a.live-status-map-btn:hover,
html[data-theme="night"] .live-status-map-btn:focus-visible {
  border-color: var(--accent) !important;
  color: #9ec5ff !important;
}

.live-status-custody-btn:disabled,
.live-status-stream-btn:disabled,
a.live-status-stream-btn[aria-disabled="true"] {
  opacity: 0.45;
  cursor: not-allowed;
  pointer-events: none;
}

.live-status-custody-hint {
  margin: 0.4rem 0 0;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--muted);
  line-height: 1.3;
}

.live-status-custody-hint--bad {
  color: var(--bad, #c62828);
}

html[data-theme="night"] .live-status-custody-hint--bad {
  color: #f07167;
}

.live-status-share-btn {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  min-width: 38px;
  padding: 0;
  border-radius: 9px;
  border: 1px solid var(--line);
  background: var(--surface-2, #f4f6fa);
  color: var(--ink);
  cursor: pointer;
  box-shadow: none;
}

.live-status-share-btn:hover:not(:disabled),
.live-status-share-btn:focus-visible:not(:disabled) {
  border-color: var(--accent);
  color: var(--accent);
  outline: none;
}

.live-status-share-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.live-status-share-btn.is-copied {
  border-color: var(--ok, #0d7a4d);
  color: var(--ok, #0d7a4d);
}

.live-status-share-icon {
  display: block;
}

html[data-theme="night"] .live-status-share-btn {
  background: color-mix(in srgb, var(--surface-2) 90%, #000);
  border-color: var(--line);
  color: var(--ink);
}

html[data-theme="night"] .live-status-share-btn:hover:not(:disabled),
html[data-theme="night"] .live-status-share-btn:focus-visible:not(:disabled) {
  border-color: var(--accent);
  color: #9ec5ff;
}

@media (max-width: 380px) {
  .live-status-action-row {
    flex-wrap: wrap;
  }
  .live-status-custody-btn,
  .live-status-stream-btn {
    flex: 1 1 calc(50% - 8px);
  }
  .live-status-share-btn {
    flex: 0 0 38px;
  }
}

.live-status-alerts {
  list-style: none;
  margin: 0.75rem 0 0;
  padding: 0;
  display: grid;
  gap: 0.35rem;
}

.live-status-alert {
  font-size: 0.82rem;
  padding: 0.4rem 0.55rem;
  border-radius: 8px;
  border: 1px solid var(--line, rgba(0, 0, 0, 0.1));
}

.live-status-alert--bad {
  background: rgba(200, 60, 60, 0.1);
  border-color: rgba(200, 60, 60, 0.35);
}

.live-status-alert--warn {
  background: rgba(220, 160, 40, 0.12);
  border-color: rgba(220, 160, 40, 0.35);
}

/* ---- Pilot Calls tab (mobile-first) ---- */
.unit-calls-pilot-filter {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  margin: 0 0 0.85rem;
  width: 100%;
}

.unit-calls-pilot-filter-label {
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted, #8a857a);
}

.unit-calls-pilot-filter select {
  width: 100%;
  max-width: 100%;
  min-height: 2.65rem;
  padding: 0.55rem 0.75rem;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(0, 0, 0, 0.25);
  color: inherit;
  font: inherit;
  font-size: 1rem;
}

.unit-calls-head {
  margin-bottom: 12px;
}

.unit-calls-graph-card {
  margin: 0 0 14px;
  padding: 10px;
}

.unit-calls-graph-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
  flex-wrap: wrap;
}

.unit-calls-graph-titles {
  display: flex;
  align-items: baseline;
  gap: 6px;
  flex-wrap: wrap;
  min-width: 0;
}

.unit-calls-graph-title {
  font-size: 0.9rem;
}

.unit-calls-graph-subtitle {
  font-size: 0.72rem;
  color: #666;
  font-weight: 600;
}

.unit-calls-graph-period {
  display: flex;
  gap: 4px;
  flex: 0 0 auto;
}

.unit-calls-graph-canvas {
  display: block;
  width: 100%;
  height: 280px;
  max-width: 100%;
  background: #fafafa;
  border-radius: 4px;
}

@media (min-width: 700px) {
  .unit-calls-graph-canvas {
    height: 360px;
  }
}

@media (max-width: 480px) {
  /* Taller canvas so day labels + legend have room on phones */
  .unit-calls-graph-canvas {
    height: 300px;
  }

  .unit-calls-graph-card {
    padding: 8px 6px 10px;
  }

  .unit-calls-graph-title {
    font-size: 0.85rem;
  }

  .unit-calls-range-btn {
    font-size: 0.68rem;
    min-height: 44px;
    padding: 0 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
  }
}

.unit-calls-range-toggle {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin: 0 0 14px;
  padding: 4px;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: 12px;
  align-items: stretch;
  /* Equal-height cells so labels can true-center in each chip */
  grid-auto-rows: 1fr;
}

.unit-calls-range-toggle--three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* Maintenance ticket status: Open / In progress / Closed / All — one row */
.maint-status-tabs.unit-calls-range-toggle {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 4px;
  margin: 0 0 0.65rem;
  width: 100%;
}
.maint-status-tabs .unit-calls-range-btn {
  min-width: 0;
  white-space: nowrap;
  font-size: 0.78rem;
  padding: 0 4px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.unit-calls-range-btn {
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  color: var(--muted);
  font-weight: 800;
  font-size: 0.78rem;
  min-height: 42px;
  height: 100%;
  /* No block padding — flex handles true vertical center (UA padding skews text) */
  padding: 0 8px;
  margin: 0;
  border-radius: 10px;
  cursor: pointer;
  line-height: 1;
  overflow-wrap: anywhere;
  white-space: nowrap;
  /* Vertically + horizontally center label in chip */
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  text-align: center;
  box-sizing: border-box;
  vertical-align: middle;
}

.unit-calls-range-btn.is-active {
  background: var(--brand);
  color: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
}

.unit-calls-range-btn:not(.is-active):hover {
  background: color-mix(in srgb, var(--surface) 70%, var(--surface-2));
  color: var(--ink);
}

.unit-calls-head h2 {
  margin: 0 0 4px;
  font-size: 1.25rem;
  line-height: 1.25;
}

.unit-calls-head .card-sub {
  margin: 0;
  font-size: 0.85rem;
}

.unit-leaderboard {
  margin-bottom: 16px;
  padding: 12px;
}

/* Month / Year / All Time tabs at bottom of leaderboard card */
.unit-leaderboard-range {
  margin: 0.85rem 0 0;
  padding-top: 0.75rem;
  border-top: 1px solid color-mix(in srgb, var(--line, #334) 80%, transparent);
  width: 100%;
  align-items: stretch;
  grid-auto-rows: 1fr;
}
.unit-leaderboard .unit-leaderboard-range.unit-calls-range-toggle {
  margin-bottom: 0;
}
.unit-leaderboard-range .unit-calls-range-btn {
  min-height: 42px;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  line-height: 1;
  padding: 0 6px;
  margin: 0;
  white-space: nowrap;
}

.unit-leaderboard > .kicker {
  margin: 0 0 10px;
}

.unit-leaderboard-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

@media (min-width: 640px) {
  .unit-leaderboard-grid {
    grid-template-columns: 1fr 1fr;
    gap: 16px;
  }
}

.unit-leaderboard-title {
  margin: 0 0 8px;
  font-size: 0.95rem;
}

.unit-leaderboard-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 6px;
}

.unit-leaderboard-item {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 8px 10px;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: 10px;
  min-width: 0;
}

.unit-leaderboard-rank {
  flex: 0 0 auto;
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: var(--accent-soft);
  /* White on dark brown badge — brand black was unreadable on accent-soft */
  color: #fff;
  font-size: 0.72rem;
  font-weight: 800;
}
html[data-theme="night"] .unit-leaderboard-rank,
body.pilot-app .unit-leaderboard-rank {
  color: #fff;
}

.unit-leaderboard-main {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.unit-leaderboard-name {
  font-size: 0.9rem;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.unit-leaderboard-stats {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 600;
}

.unit-leaderboard-empty {
  margin: 0;
}

.unit-calls-section {
  margin-bottom: 12px;
}

/* Pilot Flights / Calls / Training list wrappers (same shell as leaderboard card) */
.unit-list-card {
  margin-bottom: 16px;
  padding: 12px;
}
.unit-list-card > .kicker {
  margin: 0 0 10px;
}
.unit-list-card .unit-calls-toolbar {
  margin-bottom: 10px;
}
.unit-list-card .unit-record-cards {
  margin-top: 0.35rem;
}
html[data-theme="night"] .unit-list-card {
  background: var(--surface);
  color: var(--ink);
  border-color: var(--line);
}

.unit-calls-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
  margin-bottom: 10px;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.unit-calls-list-title {
  margin: 0;
  font-size: 1rem;
}

.unit-calls-list-sub {
  margin: 2px 0 0;
  font-size: 0.78rem;
}

.unit-calls-sort {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--muted);
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.unit-calls-sort select {
  font-size: 0.85rem;
  height: 32px;
  padding: 0 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.unit-calls-list {
  display: grid;
  gap: 10px;
}

.unit-call-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 12px;
  min-width: 0;
}

.unit-call-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
}

.unit-call-desc {
  font-size: 0.95rem;
  line-height: 1.3;
  overflow-wrap: anywhere;
  min-width: 0;
}

.unit-call-hours {
  flex: 0 0 auto;
  font-size: 0.85rem;
  font-weight: 800;
  color: var(--brand);
  white-space: nowrap;
}

.unit-call-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 10px;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.35;
}

.unit-call-meta span {
  overflow-wrap: anywhere;
}

.unit-call-meta .unit-call-flight-time,
.unit-call-meta .unit-call-training-hours {
  color: var(--ink);
  font-weight: 700;
}

.unit-call-meta .unit-call-flight-time strong,
.unit-call-meta .unit-call-training-hours strong {
  font-weight: 800;
  color: var(--muted);
  letter-spacing: 0.02em;
}

.unit-call-notes {
  margin: 8px 0 0;
  font-size: 0.85rem;
  line-height: 1.4;
  color: var(--ink);
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.unit-call-attach-row {
  margin-top: 8px;
}

.unit-call-attach {
  font-size: 0.85rem;
  word-break: break-word;
}

@media (max-width: 640px) {
  .unit-calls-head h2 {
    font-size: 1.1rem;
  }

  .unit-call-card {
    padding: 10px;
  }

  /* Filter dropdowns fit full page width on mobile */
  .unit-calls-toolbar,
  .pilot-flights-toolbar {
    flex-direction: column;
    align-items: stretch;
    gap: 0.55rem;
  }

  .pilot-flights-toolbar-filters {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    gap: 0.45rem;
  }

  .unit-calls-sort {
    width: 100%;
    max-width: 100%;
    justify-content: space-between;
    display: flex;
  }

  .unit-calls-sort > span {
    flex: 0 0 auto;
  }

  .unit-calls-sort select {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  .unit-calls-pilot-filter,
  .unit-calls-pilot-filter select {
    width: 100%;
    max-width: 100%;
  }

  /* Admin All-flights / record list filters — single column on phones */
  .flights-list-filters,
  .record-list-card .flights-list-filters,
  form.flights-list-filters,
  #flightsListFilterForm,
  .record-list-filters {
    grid-template-columns: 1fr !important;
    width: 100%;
    max-width: 100%;
  }

  .flights-list-filters label,
  .record-list-filters label {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .flights-list-filters select,
  .flights-list-filters input,
  .record-list-filters select,
  .record-list-filters input {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }
}

.home-stack {
  display: grid;
  gap: var(--ops-chip-gap);
  margin-bottom: var(--ops-chip-gap);
}

.home-stack > .metric-row {
  margin-bottom: 0;
}

/* Avoid card margins stacking on top of home-stack gap */
.home-stack > .card,
.home-stack > .home-live-status-host,
.home-stack > .home-base-weather-host,
.home-stack > .home-air-picture,
.home-stack > .home-kit-card,
.home-stack > .pilot-credential-section {
  margin-bottom: 0;
}

.pilot-credentials-stack {
  display: contents;
}

.pilot-credential-kicker {
  margin: 0 0 8px;
}

.pilot-credential-section-head {
  margin-bottom: 10px;
}

.pilot-credential-section-head h3 {
  margin: 0;
}

.pilot-cred-upload-form {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.pilot-cred-training-section {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}

.pilot-cred-training-section h4 {
  margin: 0 0 6px;
}

.pilot-doc-rename-form {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--line, rgba(255, 255, 255, 0.08));
}

.pilot-doc-rename-form label {
  margin-bottom: 8px;
}

.pilot-doc-rename-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.doc-item-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-top: 8px;
}

.pilot-doc-grid--admin .doc-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.doc-grid--manage {
  margin-top: 12px;
}

.doc-item--manage {
  gap: 6px;
}

.doc-item--edit {
  margin: 0;
}

.doc-add-heading {
  margin: 20px 0 10px;
  font-size: 1rem;
}

.home-credentials-card {
  margin-top: 18px;
  margin-bottom: 0;
}

.home-kit-kicker {
  margin: 0 0 8px;
}

.home-kit-card-head {
  margin-bottom: 10px;
}

.home-kit-card-head h3 {
  margin: 0;
}

.home-kit-custody-banner {
  margin: 0 0 12px;
}

.home-kit-status-badges {
  margin-bottom: 12px;
}

.home-kit-selected-name {
  margin: 0 0 10px;
  font-size: 1.05rem;
  line-height: 1.25;
  font-weight: 700;
  color: var(--ink);
}

.home-kit-readout {
  margin-top: 0;
}

.resources-admin-doc-hint {
  margin: 0 0 14px;
}

.resources-stack .doc-add-heading {
  margin: 18px 0 10px;
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.home-kit-action {
  display: block;
  width: 100%;
  margin-top: 14px;
  margin-bottom: 0;
}

.home-custody-flow {
  margin-top: 18px;
}

.home-custody-flow-head {
  align-items: flex-start;
  gap: 12px;
}

.home-custody-inventory-title {
  margin: 16px 0 8px;
  font-size: 1rem;
}

.home-gear-equipment-list {
  display: grid;
  gap: 0;
}

.home-gear-equipment-list .equipment-inventory-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 10px 0;
  border-top: 1px solid var(--line);
}

.home-gear-equipment-list .equipment-inventory-row:first-child {
  border-top: 0;
  padding-top: 0;
}

.home-assigned-equipment {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.home-assigned-equipment-title {
  margin: 0 0 10px;
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.home-equipment-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 8px;
}

.home-equipment-item {
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2);
}

.home-equipment-item--missing {
  border-color: var(--warn, #e6a23c);
  background: rgba(230, 162, 60, 0.06);
}

.home-equipment-missing-note {
  color: var(--warn, #e6a23c);
}

.home-kit-readonly {
  margin: 12px 0 0;
}

.training-month-head h4 {
  margin: 0;
}

.training-sessions-block--history > h4 {
  margin-bottom: 10px;
}

.training-month-details {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px 8px;
  margin-bottom: 8px;
  background: rgba(0, 0, 0, 0.02);
}

.training-month-details summary {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px 12px;
  padding: 10px 0;
  cursor: pointer;
  font-weight: 600;
  list-style: none;
}

.training-month-details summary::-webkit-details-marker {
  display: none;
}

.training-month-summary-meta {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--muted);
}

.training-sessions-panel--compact .training-sessions-prior {
  margin-top: 12px;
}

.training-month-details--compact {
  margin-bottom: 6px;
  padding-bottom: 4px;
}

.training-pilot-detail {
  margin-top: 14px;
}

.training-pilot-detail-card .card-head {
  align-items: flex-start;
}

.training-row-selected {
  background: rgba(59, 130, 246, 0.06);
}

.training-pilot-link {
  font-weight: 700;
  text-align: left;
}

/* Training / CFS summary tables — pilot names bold + tan (not links) */
.admin-summary-pilot-name {
  font-weight: 700;
  color: var(--accent, #9c916c);
}
html[data-theme="night"] .admin-summary-pilot-name {
  color: var(--accent, #b8ad86);
}

.training-current-month-cell {
  min-width: 12rem;
  max-width: 22rem;
  vertical-align: top;
}

.training-month-inline-list {
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 0.8125rem;
}

.training-month-inline-list li + li {
  margin-top: 6px;
}

.training-month-tag {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.ops-note-actor {
  margin: 0 0 6px;
  font-weight: 600;
}

.ops-note-kicker {
  margin: 0 0 6px;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
}

.ops-note-block + .ops-note-block,
.ops-note-line + .ops-note-block {
  margin-top: 10px;
}

.ops-custody-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 4px;
}

.ops-custody-list li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: baseline;
  padding: 6px 8px;
  border-radius: 8px;
  background: var(--surface);
  border: 1px solid var(--line);
}

.ops-custody-label {
  font-size: 0.88rem;
  line-height: 1.35;
}

.ops-custody-status {
  font-size: 0.78rem;
  font-weight: 700;
  white-space: nowrap;
}

.ops-custody-status.tone-ok {
  color: var(--ok);
}

.ops-custody-status.tone-warn {
  color: var(--warn);
}

.ops-custody-status.tone-bad {
  color: var(--bad);
}

.ops-custody-status.tone-neutral {
  color: var(--muted);
}

.ops-note-callout {
  margin: 8px 0 0;
  padding: 8px 10px;
  border-radius: 8px;
  font-size: 0.88rem;
  border: 1px solid var(--line);
}

.ops-note-callout.tone-bad {
  border-color: color-mix(in srgb, var(--bad) 40%, var(--line));
  background: color-mix(in srgb, var(--bad) 8%, var(--surface-2));
}

.ops-note-callout.tone-warn {
  border-color: color-mix(in srgb, var(--warn) 40%, var(--line));
  background: color-mix(in srgb, var(--warn) 8%, var(--surface-2));
}

.ops-note-line {
  margin: 6px 0 0;
  font-size: 0.88rem;
  line-height: 1.45;
  white-space: normal;
  word-break: break-word;
  overflow-wrap: break-word;
}

.ops-note-muted {
  color: var(--muted);
  font-size: 0.8rem;
}

.ops-note-empty {
  margin: 0;
  color: var(--muted);
  font-size: 0.88rem;
}

.activity-table {
  table-layout: auto;
  width: 100%;
}

.activity-table th,
.activity-table td {
  vertical-align: top;
}

.activity-table .activity-meta-cell {
  white-space: nowrap;
  vertical-align: top;
}

.activity-detail-cell {
  min-width: 220px;
  max-width: 520px;
  vertical-align: top;
  word-break: break-word;
  overflow-wrap: break-word;
}

.activity-detail-cell .ops-note-asset {
  margin: 0 0 6px;
  word-break: break-word;
  overflow-wrap: break-word;
}

.ops-note-line,
.ops-note-asset {
  white-space: normal;
  word-break: break-word;
  overflow-wrap: break-word;
}

.bottom-nav {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 35;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
  padding: 8px max(8px, env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom))
    max(8px, env(safe-area-inset-left));
  background: rgba(255, 255, 255, 0.96);
  border-top: 1px solid var(--line);
  backdrop-filter: blur(8px);
}

body.pilot-app {
  overflow-x: hidden;
}

/* Pilot login is a dedicated screen; main app only after sign-in. */
body.pilot-app.pilot-signed-out #appLayout {
  display: none !important;
}

/* Keep grid so gap between login / weather / airspace cards works */
body.pilot-app.pilot-signed-out #authScreen {
  display: grid;
}

body.pilot-app.pilot-signed-in #authScreen {
  display: none !important;
}

body.pilot-app.pilot-signed-in #appLayout {
  display: grid;
}

body.pilot-app.pilot-signed-in {
  scroll-padding-top: calc(var(--shell-header-sticky, 190px) + 8px);
}

body.pilot-app.pilot-signed-in .home-welcome-head {
  scroll-margin-top: calc(var(--shell-header-sticky, 190px) + 8px);
}

body.pilot-app.pilot-signed-out .bottom-nav,
body.pilot-app.pilot-signed-out .main-panel {
  display: none !important;
}

body.pilot-app .bottom-nav {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

body.pilot-app .bottom-nav.has-three-buttons {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.pilot-app .bottom-nav.has-four-buttons {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.pilot-app .bottom-nav.has-five-buttons {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

body.pilot-app .bottom-nav.has-six-buttons {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

body.pilot-app .bottom-nav.has-three-buttons button,
body.pilot-app .bottom-nav.has-four-buttons button,
body.pilot-app .bottom-nav.has-five-buttons button,
body.pilot-app .bottom-nav.has-six-buttons button,
body.pilot-app .bottom-nav button {
  padding: 6px 2px;
  font-size: 0.62rem;
  min-height: 46px;
  gap: 2px;
}
body.pilot-app .bottom-nav.has-six-buttons button span {
  font-size: 0.58rem;
}
.pilot-flights-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem 1rem;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 0.75rem;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}
.pilot-flights-toolbar-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem 0.85rem;
  align-items: center;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}
.pilot-flights-toolbar-filters .unit-calls-sort {
  min-width: 0;
}
.pilot-flights-toolbar-filters .unit-calls-sort select {
  max-width: 100%;
}
.pilot-flight-audit-stack {
  margin-top: 0.65rem;
}
.pilot-flight-mission {
  margin-bottom: 0.55rem;
  padding-bottom: 0.45rem;
  border-bottom: 1px solid var(--line);
}
.unit-record-desc .flight-type-chip,
.unit-record-desc .flight-status-chip {
  display: inline-block;
  margin-right: 0.35rem;
  vertical-align: middle;
}
.unit-record-title-trailing {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  flex-shrink: 0;
  margin-left: auto;
}
.unit-record-title-trailing .flight-type-chip {
  margin: 0;
}
.unit-record-title-trailing .unit-record-hours {
  min-width: 3.25rem;
  text-align: right;
  font-variant-numeric: tabular-nums;
}
/* Pilot Flights / Calls / Training cards — shared hierarchy + full-width expand */
#panel-flights .unit-record-card,
#panel-calls .unit-record-card,
#panel-training .unit-record-card {
  max-width: 100%;
  overflow: hidden;
}
#panel-flights .unit-record-card-body,
#panel-calls .unit-record-card-body,
#panel-training .unit-record-card-body {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}
#panel-flights .unit-record-card-title-row,
#panel-calls .unit-record-card-title-row,
#panel-training .unit-record-card-title-row {
  align-items: center;
  min-width: 0;
  width: 100%;
  gap: 0.4rem;
}
#panel-flights .unit-record-cr,
#panel-calls .unit-record-cr,
#panel-training .unit-record-cr {
  font-size: 1rem;
  font-weight: 750;
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#panel-flights .unit-record-title-trailing,
#panel-calls .unit-record-title-trailing,
#panel-training .unit-record-title-trailing {
  flex: 0 1 auto;
  min-width: 0;
  max-width: 58%;
  flex-wrap: wrap;
  justify-content: flex-end;
}
/* Line 2 under bold title: not bold (description / pilot name) */
#panel-flights .unit-record-desc,
#panel-calls .unit-record-desc,
#panel-training .unit-record-desc {
  display: block;
  margin-top: 0.2rem;
  font-size: 0.9rem;
  font-weight: 400;
  color: var(--ink);
  opacity: 0.88;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.3;
}
#panel-flights .unit-record-cr,
#panel-calls .unit-record-cr,
#panel-training .unit-record-cr {
  font-weight: 750;
}

/* Expand block: full card width (no hanging indent that squeezes content) */
#panel-flights .unit-record-card-expand,
#panel-calls .unit-record-card-expand,
#panel-training .unit-record-card-expand {
  padding: 0.65rem 0.75rem 0.8rem;
  max-width: 100%;
  box-sizing: border-box;
  overflow-x: hidden;
  min-width: 0;
}
#panel-flights .pilot-flight-audit-host,
#panel-flights .pilot-flight-audit-stack,
#panel-flights .pilot-flight-mission,
#panel-flights .fa-layout,
#panel-flights .fa-layout--stack,
#panel-flights .fa-row,
#panel-flights .fa-card,
#panel-flights .fa-weather-wrap,
#panel-flights .base-weather-card {
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}
/* Pilot Calls / Flights / Training expand: event cards (CFS + training) */
#panel-calls .pilot-calls-cfs-detail,
#panel-flights .pilot-calls-cfs-detail,
#panel-flights .pilot-flight-details-card,
#panel-training .pilot-calls-cfs-detail,
#panel-training .pilot-training-event-detail {
  margin: 0 0 0.75rem;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}
#panel-calls .pilot-calls-cfs-detail .fa-fact-grid,
#panel-flights .pilot-calls-cfs-detail .fa-fact-grid,
#panel-training .pilot-calls-cfs-detail .fa-fact-grid,
#panel-training .pilot-training-event-detail .fa-fact-grid {
  margin-top: 0.35rem;
}
#panel-calls .pilot-calls-cfs-pdf,
#panel-flights .pilot-calls-cfs-pdf {
  margin-top: 0.5rem;
}
#panel-calls .pilot-calls-cfs-detail .fa-card-head--row,
#panel-flights .pilot-calls-cfs-detail .fa-card-head--row,
#panel-training .pilot-calls-cfs-detail .fa-card-head--row,
#panel-training .pilot-training-event-detail .fa-card-head--row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.35rem 0.75rem;
}
#panel-flights .fa-fact-grid,
#panel-training .fa-fact-grid {
  max-width: 100%;
}
#panel-flights .pilot-flight-audit-stack {
  gap: 0.5rem;
  width: 100%;
}
#panel-flights .fa-weather-wrap .base-weather-card {
  margin: 0;
  width: 100%;
}
/* Weather chips: 2-col on phone so they stay in card */
#panel-flights .base-weather-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  width: 100%;
  max-width: 100%;
}
@media (min-width: 480px) {
  #panel-flights .base-weather-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
#panel-flights .base-weather-cell {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}
#panel-flights .base-weather-value {
  overflow-wrap: anywhere;
  word-break: break-word;
  max-width: 100%;
}
/* Fact grids inside expand: fill width, no overflow */
#panel-flights .fa-fact-grid,
#panel-flights .pilot-flight-facts {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: 100%;
  max-width: 100%;
}
#panel-flights .fa-fact {
  min-width: 0;
  max-width: 100%;
}
#panel-flights .fa-fact-v {
  overflow-wrap: anywhere;
  word-break: break-word;
}
#panel-flights .fa-list {
  max-width: 100%;
  overflow-wrap: anywhere;
}
#panel-flights .fa-li-main,
#panel-flights .fa-li-meta {
  overflow-wrap: anywhere;
  word-break: break-word;
}

body.pilot-app .bottom-nav.has-three-buttons button span,
body.pilot-app .bottom-nav.has-four-buttons button span,
body.pilot-app .bottom-nav.has-five-buttons button span,
body.pilot-app .bottom-nav.has-six-buttons button span {
  width: 18px;
  height: 18px;
  font-size: 0.55rem;
}

body.pilot-app .main-panel {
  padding-bottom: calc(88px + env(safe-area-inset-bottom));
}

body.pilot-app .app-layout {
  grid-template-columns: 1fr;
}

body.pilot-app.pilot-equipment-flow .bottom-nav {
  display: none;
}

body.pilot-app.pilot-equipment-flow .main-panel {
  padding-bottom: calc(20px + env(safe-area-inset-bottom));
}

.equipment-panel-head {
  align-items: flex-start;
  gap: 12px;
}

.equipment-locked-kit {
  margin-bottom: 10px;
  padding: 10px 14px;
}

.equipment-locked-kit .kicker {
  margin: 0 0 2px;
}

.equipment-locked-kit h3 {
  margin: 0;
  font-size: 1.05rem;
  line-height: 1.2;
}

.equipment-locked-kit-meta {
  margin: 4px 0 0;
  font-size: 0.84rem;
  color: var(--muted, #8b9cb3);
  font-weight: 600;
  line-height: 1.35;
}

.equipment-locked-kit-hint {
  margin: 6px 0 0;
}

.equipment-custody-card {
  margin-top: 14px;
  padding: 0;
  overflow: hidden;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
}

/* Extra top space on mobile sign-out/sign-in card to account for tall header + logo */
@media (max-width: 640px) {
  .equipment-custody-card {
    padding-top: 12px;
  }
}

.equipment-custody-card .custody-form--signout,
.equipment-custody-card .custody-form--signin {
  padding: 16px 18px 18px;
}

/* Prevent tall header from clipping the top of the sign-out/sign-in form on mobile */
@media (max-width: 640px) {
  .equipment-custody-card .custody-form--signout,
  .equipment-custody-card .custody-form--signin {
    padding-top: 24px;
  }
}

.custody-form--signin {
  display: grid;
  gap: 14px;
}

/* Sign-in list — same card rows as sign-out */
.custody-signin-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
  border: 0;
  background: transparent;
  overflow: visible;
}

.custody-signin-row {
  padding: 0.7rem 0.85rem;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2);
  color: var(--ink);
  transition: border-color 0.12s ease, background 0.12s ease;
}

.custody-signin-row-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 8px;
  margin-bottom: 0.55rem;
}

.custody-signin-row-head strong {
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--accent);
}

.custody-signin-row-head .card-sub {
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 500;
}

/* Mirror sign-out status segmented control */
.custody-signin-status {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
  background: var(--surface);
}

.custody-signin-option {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 38px;
  padding: 6px 8px;
  margin: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  color: var(--ink);
  font-size: 0.82rem;
  font-weight: 700;
  cursor: pointer;
  text-align: center;
  text-transform: capitalize;
}

.custody-signin-option + .custody-signin-option {
  border-left: 1px solid var(--line);
}

.custody-signin-option input {
  width: 1rem !important;
  min-width: 1rem !important;
  height: 1rem !important;
  min-height: 1rem !important;
  max-width: 1rem !important;
  max-height: 1rem !important;
  margin: 0;
  flex-shrink: 0;
  accent-color: var(--accent);
}

.custody-signin-option:has(input:checked) {
  background: color-mix(in srgb, var(--accent) 18%, var(--surface));
  color: var(--accent);
}

/* Theme overrides for pilot + night */
html[data-theme="night"] .custody-signin-list,
html[data-theme="night"] .custody-signout-list,
body.pilot-app .custody-signin-list,
body.pilot-app .custody-signout-list {
  background: transparent !important;
  border: 0 !important;
}

html[data-theme="night"] .custody-signin-row,
html[data-theme="night"] .custody-signout-row,
body.pilot-app .custody-signin-row,
body.pilot-app .custody-signout-row {
  background: var(--surface-2) !important;
  border-color: var(--line) !important;
  color: var(--ink) !important;
}

html[data-theme="night"] .custody-signin-row-head strong,
html[data-theme="night"] .custody-signout-row-head strong,
body.pilot-app .custody-signin-row-head strong,
body.pilot-app .custody-signout-row-head strong {
  color: var(--accent) !important;
}

html[data-theme="night"] .custody-signin-status,
html[data-theme="night"] .custody-signout-status,
body.pilot-app .custody-signin-status,
body.pilot-app .custody-signout-status {
  background: var(--surface) !important;
  border-color: var(--line) !important;
}

html[data-theme="night"] .custody-signin-option,
html[data-theme="night"] .custody-status-option,
body.pilot-app .custody-signin-option,
body.pilot-app .custody-status-option {
  color: var(--ink);
  background: transparent;
}

html[data-theme="night"] .custody-signin-option:has(input:checked),
html[data-theme="night"] .custody-status-option:has(input:checked),
body.pilot-app .custody-signin-option:has(input:checked),
body.pilot-app .custody-status-option:has(input:checked) {
  background: color-mix(in srgb, var(--accent) 20%, var(--surface)) !important;
  color: var(--accent) !important;
}

html[data-theme="night"] .custody-signin-option input,
html[data-theme="night"] .custody-status-option input,
html[data-theme="night"] .custody-check input,
html[data-theme="night"] .custody-attest input,
body.pilot-app .custody-signin-option input,
body.pilot-app .custody-status-option input,
body.pilot-app .custody-check input,
body.pilot-app .custody-attest input {
  accent-color: var(--accent);
  color-scheme: dark;
}

html[data-theme="night"] .custody-signin-option input:checked,
html[data-theme="night"] .custody-status-option input:checked,
body.pilot-app .custody-signin-option input:checked,
body.pilot-app .custody-status-option input:checked {
  accent-color: var(--accent);
}

html[data-theme="night"] .custody-attest,
body.pilot-app .custody-attest {
  background: color-mix(in srgb, var(--accent) 14%, var(--surface-2)) !important;
  border-color: color-mix(in srgb, var(--accent) 40%, var(--line)) !important;
  border-left-color: var(--accent) !important;
  color: var(--ink) !important;
}

html[data-theme="night"] .equipment-custody-card,
body.pilot-app .equipment-custody-card {
  background: var(--surface) !important;
  border-color: var(--line) !important;
}

.custody-return-status {
  margin: 0;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 750;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.custody-return-status select {
  margin-top: 6px;
  width: 100%;
  background: var(--surface-2);
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 8px;
  font-weight: 600;
  text-transform: none;
  letter-spacing: normal;
  font-size: 0.9rem;
}

.equipment-custody-card .custody-form-notes {
  margin: 0;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 750;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.equipment-custody-card .custody-form-notes textarea {
  margin-top: 6px;
  background: var(--surface-2);
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 8px;
  font-weight: 500;
  text-transform: none;
  letter-spacing: normal;
  font-size: 0.9rem;
}

.equipment-custody-card .custody-attest {
  margin-top: 0;
}

.custody-inline-confirm {
  margin: 12px 0 0;
  border-radius: 10px;
}

.custody-bulk-actions .btn-secondary,
.custody-bulk-actions .btn-primary {
  font-weight: 700;
}

.equipment-inventory-card {
  margin-top: 14px;
}

.equipment-inventory-card h3 {
  margin: 0 0 12px;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 980px) {
  .app-layout {
    grid-template-columns: 1fr;
  }

  .side-nav {
    position: static;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    max-height: none;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .side-nav-logout {
    grid-column: 1 / -1;
    margin-top: 8px;
  }

  .card-grid.two,
  .mission-layout,
  .embed-grid,
  .ref-grid,
  .form-grid.three,
  .form-grid.two {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .shell-header {
    padding-top: calc(14px + env(safe-area-inset-top));
    padding-right: 10px;
    padding-bottom: 20px;
    padding-left: 10px;
  }

  .shell-brand {
    gap: 5px;
  }

  .shell-brand-dept {
    font-size: clamp(0.7rem, 3.1vw, 0.84rem);
  }

  .shell-brand-title {
    font-size: clamp(1.12rem, 5.2vw, 1.36rem);
  }

  .shell-logout {
    min-height: 28px;
    padding: 4px 10px;
    font-size: 0.7rem;
  }

  :root {
    --shell-header-sticky: calc(190px + env(safe-area-inset-top));
    --resources-jump-sticky: 68px;
    --resources-jump-top-gap: 6px;
  }

  .resources-jump-card {
    padding-bottom: 12px;
  }

  .resources-jump-links {
    gap: 6px;
    padding: 10px;
  }

  .resources-jump-link {
    flex: 1 1 calc(50% - 6px);
    min-height: 34px;
    padding: 7px 10px;
    font-size: 0.72rem;
  }

  .readout div {
    grid-template-columns: 1fr;
  }

  .metric-row--home {
    gap: 6px;
    margin-bottom: 12px;
  }

  .metric-row--home .metric {
    padding: 6px 4px;
  }

  .metric-row--home .metric .label {
    font-size: 0.5rem;
    letter-spacing: 0.03em;
    line-height: 1.1;
    overflow-wrap: anywhere;
  }

  .metric-row--home .metric strong {
    margin: 1px 0 0;
    font-size: 1rem;
  }

  .metric-row--home .metric span:last-child {
    display: block;
    margin-top: 0;
    font-size: 0.5rem;
    line-height: 1.1;
    overflow-wrap: anywhere;
  }

  .metric-full {
    padding: 8px 6px;
  }

  .metric-full .label {
    font-size: 0.48rem;
  }

  .metric-full strong {
    font-size: 1.1rem;
  }

  .metric-full span:last-child {
    font-size: 0.55rem;
  }

  .home-welcome-status {
    flex-wrap: wrap;
    gap: 6px;
  }

  .home-kit-status-badges {
    flex-wrap: wrap;
    gap: 6px;
  }

  .resource-image-row {
    max-width: 100%;
    gap: 8px;
  }

  .resource-image-open img {
    max-height: 110px;
  }

  .resource-image-hint {
    font-size: 0.65rem;
    margin-top: 4px;
  }

  .bottom-nav {
    gap: 3px;
    padding-left: max(4px, env(safe-area-inset-left));
    padding-right: max(4px, env(safe-area-inset-right));
  }

  .bottom-nav button {
    min-height: 52px;
    padding: 6px 2px;
    font-size: 0.62rem;
  }

  .bottom-nav button span {
    width: 18px;
    height: 18px;
    font-size: 0.6rem;
    flex-shrink: 0;
  }
}

@media (max-width: 360px) {
  .bottom-nav button {
    font-size: 0.58rem;
    letter-spacing: 0;
  }
}
/* ==========================================================================
   Admin app ï¿½ theme parity with pilot + cleaner layout
   ========================================================================== */

body.admin-app {
  background: var(--bg);
  color: var(--ink);
}

/* Match pilot header: brand centered, Sign Out absolute top-right */
body.admin-app .shell-header-top {
  align-items: flex-start;
  justify-content: center;
}

body.admin-app .shell-header-top .shell-brand {
  margin: 0 auto;
  justify-content: center;
  max-width: min(100%, calc(100% - 6.5rem));
  box-sizing: border-box;
}

.admin-header-actions {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex: 0 0 auto;
}

.admin-header-btn {
  min-height: 32px;
  font-size: 0.78rem;
  border-color: rgba(255, 255, 255, 0.35) !important;
  background: rgba(0, 0, 0, 0.22) !important;
  color: #fff !important;
}

.admin-header-btn:hover {
  background: rgba(0, 0, 0, 0.36) !important;
  border-color: rgba(255, 255, 255, 0.55) !important;
}

.admin-layout {
  min-height: calc(100vh - 100px);
  gap: 0;
}

.admin-side-nav {
  background: var(--surface);
  border-right: 1px solid var(--line);
  padding: 14px 12px 20px;
  gap: 4px;
}

.admin-nav-label {
  margin: 12px 8px 4px;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
}

.admin-nav-label:first-child {
  margin-top: 2px;
}

.admin-side-nav button[data-panel] {
  min-height: 40px;
  border-radius: 10px;
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--ink);
  border: 1px solid transparent;
}

.admin-side-nav button[data-panel]:hover {
  background: var(--surface-2);
  border-color: var(--line);
}

.admin-side-nav button[data-panel].active {
  background: color-mix(in srgb, var(--accent) 18%, var(--surface-2));
  border-color: color-mix(in srgb, var(--accent) 45%, var(--line));
  color: var(--ink);
  box-shadow: none;
}

html[data-theme="night"] .admin-side-nav button[data-panel].active {
  background: color-mix(in srgb, var(--accent) 16%, var(--surface-2));
  color: var(--ink);
}

.admin-side-nav .admin-nav-pilot {
  margin-top: 14px;
  border-top: 1px solid var(--line);
  border-radius: 10px;
  color: var(--accent);
  font-weight: 700;
}

.admin-side-nav .admin-nav-pilot:hover {
  background: color-mix(in srgb, var(--accent) 12%, var(--surface-2));
  color: var(--accent);
}

.admin-main {
  padding: 18px clamp(14px, 3vw, 24px) 36px;
  background: var(--bg);
}

body.admin-app .panel-head {
  align-items: flex-start;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}

body.admin-app .panel-head h2 {
  font-size: 1.35rem;
  font-weight: 800;
  letter-spacing: -0.01em;
}

.panel-head-sub {
  margin: 4px 0 0 !important;
  font-size: 0.88rem;
  color: var(--muted);
  max-width: 48rem;
}

body.admin-app .metric {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: var(--shadow);
}

body.admin-app .metric .label {
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.admin-metric-row {
  gap: 10px;
  margin-bottom: 16px;
}

/* —— Admin Command Overview (ops-v865+) —— */
.overview-hero {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px 16px;
  margin-bottom: 14px;
}
.overview-hero-title {
  margin: 2px 0 4px;
  font-size: 1.45rem;
  letter-spacing: -0.02em;
}
.overview-hero-when {
  margin: 0;
}
.overview-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.overview-kpi-row {
  display: grid;
  /* Stretch all KPI cards evenly across the full content width */
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
  width: 100%;
}
.overview-kpi {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  padding: 12px 10px 10px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: var(--surface);
  box-shadow: var(--shadow);
}
.overview-kpi-label {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  opacity: 0.78;
}
.overview-kpi-value {
  font-size: 1.55rem;
  line-height: 1.1;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.overview-kpi-sub {
  font-size: 0.75rem;
  color: var(--muted);
}
.overview-kpi.tone-ok .overview-kpi-value { color: #4ade80; }
.overview-kpi.tone-warn .overview-kpi-value { color: #fbbf24; }
.overview-kpi.tone-bad .overview-kpi-value { color: #f87171; }
.overview-kpi.tone-info .overview-kpi-value { color: #7dd3fc; }

.overview-live {
  margin-bottom: 14px;
}

.overview-main-grid,
.overview-bottom-grid {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 12px;
  margin-bottom: 14px;
}
.overview-panel {
  margin: 0;
  padding: 14px;
  min-width: 0;
}
.overview-panel h3 {
  margin: 2px 0 0;
  font-size: 1.05rem;
}
.overview-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}
.overview-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.75rem;
  height: 1.75rem;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 0.8rem;
  font-weight: 800;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid var(--line);
}
.overview-badge.is-warn {
  color: #fbbf24;
  border-color: rgba(251, 191, 36, 0.4);
  background: rgba(251, 191, 36, 0.12);
}

.overview-train-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.overview-train-card {
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: var(--surface-2);
}
.overview-train-card-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}
.overview-empty {
  margin: 0;
}

.overview-action-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 420px;
  overflow: auto;
}
.overview-action-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: var(--surface-2);
  border-left-width: 3px;
}
.overview-action-item.tone-ok { border-left-color: #4ade80; }
.overview-action-item.tone-warn { border-left-color: #fbbf24; }
.overview-action-item.tone-bad { border-left-color: #f87171; }
.overview-action-item.tone-info { border-left-color: #7dd3fc; }
.overview-action-item strong {
  font-size: 0.9rem;
}

.overview-quick-nav {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}
.overview-quick-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  text-align: left;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: var(--surface);
  color: inherit;
  cursor: pointer;
  font: inherit;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.overview-quick-card:hover {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--line));
  background: color-mix(in srgb, var(--accent) 8%, var(--surface));
}
.overview-quick-card strong {
  font-size: 0.95rem;
}
.overview-quick-card span {
  font-size: 0.78rem;
  color: var(--muted);
  line-height: 1.35;
}

.overview-analytics {
  margin-bottom: 14px;
}

.overview-activity-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 360px;
  overflow: auto;
}
.overview-activity-item {
  display: grid;
  grid-template-columns: minmax(5.5rem, 7rem) 1fr;
  gap: 8px 10px;
  padding: 8px 0;
  border-bottom: 1px solid var(--line);
  font-size: 0.86rem;
}
.overview-activity-item:last-child {
  border-bottom: none;
}
.overview-activity-when {
  font-size: 0.75rem;
  color: var(--muted);
  white-space: nowrap;
}
.overview-activity-text {
  min-width: 0;
}

@media (max-width: 1200px) {
  .overview-kpi-row {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media (max-width: 1100px) {
  .overview-main-grid,
  .overview-bottom-grid {
    grid-template-columns: 1fr;
  }
  .overview-quick-nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 800px) {
  .overview-kpi-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .overview-kpi-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .overview-quick-nav {
    grid-template-columns: 1fr;
  }
  .overview-activity-item {
    grid-template-columns: 1fr;
    gap: 2px;
  }
}

.admin-analytics {
  margin-top: 4px;
  margin-bottom: 18px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  overflow: hidden;
}

.admin-analytics > summary {
  cursor: pointer;
  list-style: none;
  font-weight: 800;
  font-size: 0.92rem;
  letter-spacing: 0.02em;
  padding: 12px 14px;
  background: var(--surface-2);
  border-bottom: 1px solid transparent;
  user-select: none;
}

.admin-analytics > summary::-webkit-details-marker {
  display: none;
}

.admin-analytics[open] > summary {
  border-bottom-color: var(--line);
}

.admin-analytics-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 12px;
}

.admin-analytics-card {
  min-width: 0;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px;
}

.admin-analytics-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}

.admin-analytics-card-title {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.admin-analytics-card-title strong {
  font-size: 0.92rem;
}

.admin-analytics-sub {
  font-size: 0.72rem;
  color: var(--muted);
}

.admin-analytics-toggles {
  display: flex;
  gap: 4px;
  flex-shrink: 0;
}

.admin-analytics-toggles .btn-compact.is-active-period {
  border-color: var(--accent) !important;
  color: var(--accent) !important;
  background: color-mix(in srgb, var(--accent) 14%, var(--surface)) !important;
}

.admin-analytics-canvas {
  display: block;
  width: 100%;
  height: 320px;
  border-radius: 8px;
  background: var(--surface);
}

.admin-issues-kicker {
  margin: 0 0 10px;
  color: var(--muted);
}

/* Flight audit — CFS card (read-only + optional edit form) */
.fa-card--cfs-edit {
  border-color: color-mix(in srgb, var(--info) 35%, var(--line));
}
.fa-cfs-head-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.fa-cfs-edit-form {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}
.fa-cfs-edit-form label {
  color: var(--ink);
  font-size: 0.82rem;
}
.fa-cfs-edit-form input,
.fa-cfs-edit-form textarea {
  width: 100%;
  margin-top: 4px;
  background: var(--surface-2);
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 8px;
  color-scheme: dark;
}
.fa-cfs-edit-form .full {
  grid-column: 1 / -1;
}

/* Calls page — CFS detail mirrors flight-audit card */
.calls-cr-detail .calls-cfs-detail-card {
  margin: 0 0 4px;
}
.calls-cr-detail .fa-card {
  background: var(--surface-2);
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px 14px;
}
.calls-cr-detail .fa-card-kicker {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.calls-cr-detail .fa-fact-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
  gap: 8px 12px;
  margin-top: 10px;
}
.calls-cr-detail .fa-fact-k {
  display: block;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--muted);
}
.calls-cr-detail .fa-fact-v {
  color: var(--ink);
  font-size: 0.9rem;
}
.calls-cr-detail .fa-notes {
  margin-top: 10px;
}
.calls-cr-detail .fa-notes p {
  margin: 4px 0 0;
  color: var(--ink);
}
.issue-category.has-issues {
  border-left: 3px solid var(--warn);
}
.issue-category.is-clear {
  border-left: 3px solid color-mix(in srgb, var(--ok) 55%, var(--line));
}

/* Equipment V2 — ground assessment (night theme) */
.equip-v2-ground-banner {
  margin-bottom: 14px;
  border: 1px solid color-mix(in srgb, var(--bad) 40%, var(--line));
  background: color-mix(in srgb, var(--bad) 14%, var(--surface));
  color: var(--ink);
}
.equip-v2-ground-banner h3,
.equip-v2-ground-banner .kicker,
.equip-v2-ground-banner .card-sub {
  color: inherit;
}
.equip-v2-ground-banner .card-sub {
  color: var(--muted);
}
.equip-v2-ground-banner-list {
  margin: 0;
  padding-left: 1.15rem;
  color: var(--ink);
}
.equip-v2-ground-banner-list li {
  margin: 4px 0;
}
.equip-v2-ground-block {
  margin-bottom: 12px;
  padding: 12px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: var(--surface-2);
  color: var(--ink);
}
.equip-v2-ground-block--active {
  border-color: color-mix(in srgb, var(--bad) 45%, var(--line));
  background: color-mix(in srgb, var(--bad) 12%, var(--surface-2));
  color: var(--ink);
}
.equip-v2-ground-block--ok {
  background: var(--surface-2);
  color: var(--ink);
}
.equip-v2-ground-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: var(--ink);
}
.equip-v2-custody-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.equip-v2-custody-line {
  color: var(--muted);
}
.equip-v2-assign-row {
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.55rem 0.65rem;
}
.equip-v2-assign-label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--ink);
  flex: 1 1 12rem;
  max-width: 28rem;
  min-width: 0;
}
.equip-v2-assign-label select {
  width: 100%;
  min-height: 38px;
  background: var(--surface);
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 8px;
  color-scheme: dark;
}
.equip-v2-assign-save {
  flex: 0 0 auto;
  min-height: 38px;
  align-self: flex-end;
}
.skydio-kit-card--grounded {
  border-color: color-mix(in srgb, var(--bad) 42%, var(--line));
  background: var(--surface);
  color: var(--ink);
}
.skydio-kit-card--grounded > summary {
  background: color-mix(in srgb, var(--bad) 10%, var(--surface));
  color: var(--ink);
}
.skydio-kit-card--grounded .skydio-kit-body {
  background: var(--surface);
  color: var(--ink);
}
.skydio-kit-summary-main {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

/* Equipment kit cards — Live Ops language */
.admin-kit-grid {
  display: grid;
  gap: 14px;
  margin-top: 14px;
}

.admin-kit-card {
  border-radius: 12px;
  padding: 0.85rem 0.95rem 1rem;
  border: 1px solid var(--line);
  background: var(--surface);
  box-shadow: var(--shadow);
}

.admin-kit-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.6rem;
  padding-bottom: 0.7rem;
  margin-bottom: 0.65rem;
  border-bottom: 1px solid var(--line);
}

.admin-kit-card-heading {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.3rem;
  min-width: 0;
  flex: 1 1 auto;
}

.admin-kit-serial {
  margin: 0;
  font-size: 0.78rem;
  color: var(--muted);
  font-weight: 600;
}

.admin-kit-readout {
  margin: 0 0 0.65rem;
}

.admin-kit-photo-wrap {
  margin: 0 0 0.75rem;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2);
  overflow: hidden;
}

.admin-kit-photo {
  display: block;
  width: 100%;
  max-height: 150px;
  object-fit: contain;
  margin: 0;
}

.admin-kit-add-form,
.admin-kit-edit-form {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px dashed var(--line);
  font-size: 0.88rem;
}

.admin-kit-edit-form {
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2);
  border-style: solid;
}

.admin-kit-edit-form-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}

.admin-equip-table {
  font-size: 0.82rem;
  width: 100%;
}

.admin-equip-table th {
  font-size: 0.7rem;
}

.equip-actions-cell {
  white-space: nowrap;
}

.equip-meta-line {
  display: block;
  margin-top: 2px;
  font-size: 0.7em;
}

.admin-empty-row {
  color: var(--muted);
  font-style: italic;
  text-align: center;
  padding: 12px 8px !important;
}

.admin-add-kit {
  margin-bottom: 4px;
}

.admin-add-kit-card {
  margin: 0;
  border-radius: 0 0 10px 10px;
}

body.admin-app details.kit-subsection summary {
  border-radius: 10px;
  padding: 9px 12px;
  font-size: 0.88rem;
}

body.admin-app details.kit-subsection[open] summary {
  border-radius: 10px 10px 0 0;
}

body.admin-app details.kit-subsection > div.kit-subsection-body {
  border-radius: 0 0 10px 10px;
  padding: 12px;
}

body.admin-app details.collapsible-log {
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--surface);
}

body.admin-app details.collapsible-log summary {
  padding: 11px 14px;
  font-weight: 800;
  background: var(--surface-2);
  border: 0;
  border-radius: 0;
}

body.admin-app details.collapsible-log > .card,
body.admin-app details.collapsible-log > article {
  border: 0;
  border-top: 1px solid var(--line);
  border-radius: 0;
  box-shadow: none;
}

body.admin-app .table-wrap {
  border-radius: 10px;
  border: 1px solid var(--line);
  overflow: auto;
  background: var(--surface);
}

body.admin-app table {
  background: transparent;
}

body.admin-app th {
  background: var(--surface-2);
}

html[data-theme="night"] body.admin-app .side-nav-logout,
html[data-theme="night"] body.admin-app .admin-nav-pilot {
  color: var(--accent);
}

html[data-theme="night"] body.admin-app .side-nav-logout:hover,
html[data-theme="night"] body.admin-app .admin-nav-pilot:hover {
  background: color-mix(in srgb, var(--accent) 14%, var(--surface-2));
  color: #d4c9a0;
}

@media (max-width: 980px) {
  .admin-analytics-grid {
    grid-template-columns: 1fr;
  }

  body.admin-app .shell-header-top {
    justify-content: center;
    align-items: flex-start;
  }

  body.admin-app .shell-header-top .shell-brand {
    margin: 0 auto;
    justify-content: center;
  }

  .admin-header-actions {
    position: absolute;
    top: 0;
    right: 0;
    justify-content: flex-end;
  }

  .admin-side-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 10px;
  }

  .admin-nav-label {
    width: 100%;
    margin: 6px 4px 0;
  }

  .admin-side-nav button[data-panel] {
    flex: 1 1 auto;
    min-width: calc(50% - 6px);
    justify-content: center;
  }

  .admin-side-nav .admin-nav-pilot {
    width: 100%;
    margin-top: 4px;
  }
}

@media (max-width: 640px) {
  .admin-analytics-canvas {
    height: 260px;
  }

  .admin-header-actions {
    width: auto;
  }

  .admin-header-btn {
    flex: 0 0 auto;
  }
}

/* ==========================================================================
   Admin form fields + pilot / training / calls panel surfaces
   ========================================================================== */

/* Inputs on admin always use surface-2 so they read clearly on surface cards */
body.admin-app input:not([type=\"checkbox\"]):not([type=\"radio\"]),
body.admin-app select,
body.admin-app textarea {
  background: var(--surface-2) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
  color-scheme: inherit;
}

body.admin-app input[type=\"file\"] {
  background: var(--surface-2) !important;
  color: var(--ink) !important;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 6px 8px;
}

body.admin-app input:not([type=\"checkbox\"]):not([type=\"radio\"]):focus,
body.admin-app select:focus,
body.admin-app textarea:focus {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent);
}

body.admin-app .card,
body.admin-app .training-log-form-card,
body.admin-app .training-session-item,
body.admin-app .training-session-item--edit {
  background: var(--surface);
  color: var(--ink);
  border-color: var(--line);
}

body.admin-app .table-wrap,
body.admin-app table,
body.admin-app tbody tr {
  background: var(--surface);
  color: var(--ink);
}

body.admin-app tbody tr:nth-child(even) {
  background: color-mix(in srgb, var(--surface-2) 65%, var(--surface));
}

.admin-row-muted,
body.admin-app tr.pilot-cred-row,
body.admin-app tr.admin-row-muted {
  background: var(--surface-2) !important;
}

.admin-nested-cell {
  padding: 6px 10px 10px !important;
  border-top: 1px solid var(--line) !important;
}

.admin-cred-body {
  font-size: 0.95em;
  padding: 8px 10px;
}

.admin-totals-row {
  font-weight: 700;
  background: var(--surface-2) !important;
  color: var(--ink);
}

.admin-stat-chip {
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 0.9em;
  border: 1px solid var(--line);
  background: var(--surface-2);
  color: var(--ink);
}

.admin-stat-chip--info {
  background: color-mix(in srgb, var(--info) 14%, var(--surface-2));
  border-color: color-mix(in srgb, var(--info) 35%, var(--line));
}

.admin-stat-chip--ok {
  background: color-mix(in srgb, var(--ok) 14%, var(--surface-2));
  border-color: color-mix(in srgb, var(--ok) 35%, var(--line));
}

.admin-stat-chip--warn {
  background: color-mix(in srgb, var(--warn) 14%, var(--surface-2));
  border-color: color-mix(in srgb, var(--warn) 35%, var(--line));
}

#trainingOverviewStats,
#callsOverviewStats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.admin-pilot-locked {
  grid-column: 1 / -1;
  font-size: 0.9em;
  background: var(--surface-2);
  color: var(--ink);
  border: 1px solid var(--line);
  padding: 8px 10px;
  border-radius: 8px;
}

.admin-edit-row,
body.admin-app tr.calls-edit-row,
body.admin-app tr.admin-edit-row {
  background: color-mix(in srgb, var(--warn) 12%, var(--surface-2)) !important;
}

.admin-inline-edit-form {
  padding: 10px 6px;
  margin: 4px 0;
}

.admin-inline-edit-actions {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 4px;
}

.admin-inline-edit-hint {
  font-size: 0.8em;
  color: var(--muted);
  margin-left: 2px;
}

.admin-flight-fields {
  grid-column: 1 / -1;
  border: 1px solid var(--line);
  background: var(--surface-2);
  padding: 10px;
  margin: 4px 0;
  border-radius: 10px;
}

.admin-session-flight-meta {
  margin-top: 2px;
  font-size: 0.9em;
  color: var(--muted);
}

body.admin-app .training-session-item--edit {
  background: color-mix(in srgb, var(--warn) 10%, var(--surface));
  border: 1px solid color-mix(in srgb, var(--warn) 30%, var(--line));
  border-radius: 10px;
  padding: 10px;
}

body.admin-app .training-session-meta {
  color: var(--muted);
}

/* Date inputs (WebKit) ï¿½ avoid white native chrome in night */
html[data-theme=\"night\"] body.admin-app input[type=\"date\"],
html[data-theme=\"night\"] body.admin-app input[type=\"time\"],
html[data-theme=\"night\"] body.admin-app input[type=\"datetime-local\"],
html[data-theme=\"night\"] body.admin-app input[type=\"number\"] {
  color-scheme: dark;
}

/* --- Admin Equipment V2 (Skydio pool) --- */
.skydio-equip-metrics {
  margin-bottom: 0.75rem;
}
.skydio-pool-card {
  margin-bottom: 1rem;
}
.skydio-equip-table select.skydio-equip-assign {
  min-width: 9rem;
  max-width: 100%;
  font-size: 0.85rem;
}
.skydio-equip-row--orphan {
  opacity: 0.85;
}
.skydio-kit-grid {
  margin-top: 0.5rem;
}
.panel-head-actions {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  flex-wrap: wrap;
}

.skydio-kit-edit-form {
  margin: 0.35rem 0 0.65rem;
  padding: 0.5rem 0.6rem;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: var(--surface-2, #f4f6fa);
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.45rem 0.6rem;
  align-items: end;
}
.skydio-kit-edit-form label.full {
  grid-column: 1 / -1;
}
.skydio-kit-edit-form .btn-compact {
  justify-self: start;
}
@media (min-width: 520px) {
  .skydio-kit-edit-form label.full {
    grid-column: 1;
  }
  .skydio-kit-edit-form .btn-compact {
    justify-self: end;
  }
}

.skydio-add-kit-panel {
  margin: 0 0 0.85rem;
}
.skydio-add-kit-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  margin-top: 0.15rem;
}
.skydio-add-kit-actions.full {
  grid-column: 1 / -1;
}

.skydio-kit-label-locked {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 0.75rem;
  margin: 0.35rem 0 0.65rem;
  padding: 0.5rem 0.65rem;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: var(--surface-2, #f4f6fa);
}
.skydio-kit-label-text {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  min-width: 0;
}
.skydio-kit-label-caption {
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
}
.skydio-kit-label-locked .skydio-kit-title {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--ink);
}
.skydio-kit-edit-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  align-items: center;
}
.skydio-kit-edit-actions.full {
  grid-column: 1 / -1;
}

details.skydio-kit-card {
  padding: 0;
  overflow: hidden;
}
details.skydio-kit-card > summary.skydio-kit-summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.35rem 0.75rem;
  padding: 0.7rem 0.85rem;
  user-select: none;
}
details.skydio-kit-card > summary.skydio-kit-summary::-webkit-details-marker {
  display: none;
}
details.skydio-kit-card > summary.skydio-kit-summary::after {
  content: "";
  flex: 0 0 auto;
  width: 0.45rem;
  height: 0.45rem;
  margin-left: 0.45rem;
  border-right: 2px solid var(--muted, #64748b);
  border-bottom: 2px solid var(--muted, #64748b);
  transform: rotate(-45deg); /* points right when collapsed */
  transition: transform 0.15s ease;
}
details.skydio-kit-card[open] > summary.skydio-kit-summary::after {
  transform: rotate(45deg); /* points down when open */
}
.skydio-kit-summary-main {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.25rem 0.55rem;
  min-width: 0;
}
.skydio-kit-summary-id {
  font-size: 0.95rem;
  font-weight: 800;
  letter-spacing: 0.02em;
}
.skydio-kit-summary-model {
  font-size: 0.85rem;
  color: var(--muted);
  font-weight: 600;
}
.skydio-kit-summary-meta {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--muted);
  margin-right: auto;
}
.skydio-kit-body {
  padding: 0 0.85rem 0.85rem;
  border-top: 1px solid var(--line);
}

.flight-pilot-fieldset {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0.55rem 0.7rem 0.65rem;
  margin: 0;
}
.flight-pilot-fieldset legend {
  padding: 0 0.35rem;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--muted);
}
.flight-pilot-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.85rem;
}
.flight-pilot-check {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.85rem;
  font-weight: 600;
}
/* Flights list â€” stacked MM-DD-YYYY + time range */
.flights-data-table .flight-when {
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
  min-width: 9.5rem;
  line-height: 1.25;
}
.flights-data-table .flight-when-date {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.01em;
  white-space: nowrap;
}
.flights-data-table .flight-when-time {
  display: block;
  white-space: nowrap;
  font-size: 0.85em;
}
.flights-data-table .flight-col-check {
  width: 2.25rem;
  vertical-align: middle;
  text-align: center;
}
.flights-data-table .flight-col-check input[type="checkbox"] {
  width: 1.25rem !important;
  height: 1.25rem !important;
  min-width: 1.25rem !important;
  min-height: 1.25rem !important;
  max-width: 1.25rem !important;
  max-height: 1.25rem !important;
}
.flights-data-table .flight-col-kit {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.flights-data-table .flight-col-pilot {
  white-space: nowrap;
}
.flights-data-table .flight-col-dur {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.flight-event-form-card {
  margin-bottom: 0.85rem;
}

/* Combined all-flights list (under pools) + shared record list cards */
.flights-list-filters {
  grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr));
  gap: 0.55rem 0.75rem;
  align-items: end;
}
.flights-list-filters label {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  font-size: 0.82rem;
}
.flights-list-filters .full {
  grid-column: 1 / -1;
}
/* Training / CFS / Maintenance list cards — same chrome as All flights */
.record-list-card.flights-all-list-card {
  margin-top: 0.85rem;
}
.record-list-card .record-list-body {
  min-width: 0;
}
.record-list-card .unit-record-cards {
  margin-top: 0;
  gap: 0.55rem;
}
.record-list-card .unit-record-card {
  /* chips inside the outer card — not a second full page card */
  margin: 0;
  box-shadow: none;
}
/* Expandable all-flights audit row */
.flight-col-toggle {
  width: 2.25rem;
  vertical-align: middle;
}
.flight-list-toggle {
  min-width: 1.75rem;
  font-size: 1rem;
  line-height: 1;
  padding: 0.15rem 0.25rem;
}
.flight-list-row.is-expanded td {
  border-bottom-color: transparent;
}
.flight-list-detail-row > td {
  padding: 0 0.65rem 0.5rem;
  background: color-mix(in srgb, var(--surface-2) 88%, var(--accent) 6%);
  border-bottom: 1px solid var(--line);
  vertical-align: top;
}
.flight-audit-panel {
  width: 100%;
  box-sizing: border-box;
  /* Fill remaining viewport so expanded audit uses the screen, less page scroll */
  min-height: calc(100dvh - 7.5rem);
  display: flex;
  flex-direction: column;
  border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--line));
  border-radius: var(--radius, 10px);
  background: var(--surface);
  padding: 0.75rem 0.9rem 0.85rem;
  box-shadow: var(--shadow);
}
.flight-audit-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem 1rem;
  margin-bottom: 0.55rem;
  padding-bottom: 0.5rem;
  flex-shrink: 0;
  border-bottom: 1px solid var(--line);
}
.flight-audit-head-main {
  min-width: 0;
  flex: 1 1 16rem;
}
.flight-audit-title {
  margin: 0.1rem 0 0.4rem;
  font-size: 1.08rem;
  font-weight: 800;
  color: var(--ink);
}
.flight-audit-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin: 0 0 0.45rem;
}
.flight-audit-chip {
  display: inline-flex;
  align-items: center;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 700;
  background: var(--surface-2);
  border: 1px solid var(--line);
  color: var(--ink);
}
.flight-audit-meta-line {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.9rem;
  font-size: 0.82rem;
  color: var(--muted);
}
.flight-audit-meta-line strong {
  color: var(--ink);
  font-weight: 700;
  margin-right: 0.2rem;
}
.flight-audit-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.3rem;
  min-width: 10rem;
}
.flight-audit-map-hint {
  margin: 0;
  text-align: right;
  max-width: 14rem;
  font-size: 0.75rem;
}
.flight-audit-body {
  width: 100%;
  min-width: 0;
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.fa-layout {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  flex: 1 1 auto;
  min-height: 0;
}
.fa-layout--stack {
  width: 100%;
  max-width: none;
  justify-content: flex-start;
  gap: 0.55rem;
}
.fa-layout--stack > .fa-row,
.fa-layout--stack .fa-card,
.fa-layout--stack .fa-weather-wrap,
.fa-layout--stack .base-weather-card {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
}
.fa-layout--stack > .fa-row {
  flex: 0 0 auto;
}
.flight-audit-panel .fa-card {
  padding: 0.6rem 0.75rem;
}
.flight-audit-panel .fa-card-head {
  margin: 0 0 0.4rem;
}
.flight-audit-panel .base-weather-card {
  padding: 0.65rem 0.75rem 0.75rem;
}
.flight-audit-panel .base-weather-grid {
  gap: 4px;
}
.flight-audit-meta-line--in-card {
  margin: 0 0 0.65rem;
  padding: 0.45rem 0.55rem;
  border-radius: 8px;
  background: var(--surface);
  border: 1px solid color-mix(in srgb, var(--line) 85%, transparent);
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 1rem;
  font-size: 0.86rem;
  color: var(--muted);
}
.flight-audit-meta-line--in-card strong {
  color: var(--ink);
  font-weight: 700;
  margin-right: 0.25rem;
}
.flight-audit-body {
  width: 100%;
}
/* Unified flight card: audit blocks stacked under details (one dropdown) */
.flight-audit-unified .fa-sub-block,
.pilot-flight-audit-stack.flight-audit-unified .fa-sub-block {
  margin-top: 0.85rem;
  padding-top: 0.75rem;
  border-top: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
}
.flight-audit-unified .fa-sub-block:first-of-type,
.pilot-flight-unified .fa-sub-block:first-of-type {
  margin-top: 0.65rem;
}
.fa-subhead {
  margin: 0 0 0.5rem;
  font: 800 0.72rem/1.25 var(--font, system-ui, sans-serif);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--accent, #b8ad86);
  display: flex;
  align-items: center;
  gap: 0.4rem;
  flex-wrap: wrap;
}
.fa-subhead .fa-count-pill {
  font-size: 0.68rem;
  letter-spacing: 0.02em;
  text-transform: none;
}
.pilot-flight-unified {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}
.fa-row {
  display: grid;
  gap: 0.75rem;
  min-width: 0;
  grid-template-columns: 1fr;
}
.fa-row--mission {
  grid-template-columns: 1fr;
}
.fa-weather-wrap {
  min-width: 0;
}
.fa-weather-wrap .base-weather-card {
  margin: 0;
}
.fa-weather-updated {
  margin: 0.55rem 0 0;
  padding: 0 0.5rem;
  text-align: center;
  font-size: 0.8rem;
  line-height: 1.4;
  color: var(--muted);
  font-style: italic;
}
.base-weather-card .fa-weather-updated {
  margin-top: 0.55rem;
}
.fa-weather-wrap .fa-metar {
  margin-top: 0.5rem;
}
.fa-card--meta {
  background: var(--surface-2);
}
.fa-card--metar {
  background: var(--surface-2);
}
.fa-metar-body {
  margin: 0;
  padding: 0.55rem 0.65rem;
  border-radius: 8px;
  background: var(--surface);
  border: 1px solid var(--line);
  font-size: 0.82rem !important;
  line-height: 1.4;
  word-break: break-word;
  white-space: pre-wrap;
  color: var(--ink);
}
.fa-card {
  min-width: 0;
  padding: 0.75rem 0.85rem;
  border-radius: 10px;
  background: var(--surface-2);
  border: 1px solid var(--line);
}
.fa-card--mission {
  background: color-mix(in srgb, var(--surface-2) 88%, var(--accent) 8%);
  border-color: color-mix(in srgb, var(--accent) 30%, var(--line));
}
.fa-card--empty {
  opacity: 0.92;
}
.fa-card-head {
  margin: 0 0 0.55rem;
}
.fa-card-head--row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.6rem;
}
.fa-card-kicker {
  display: block;
  margin: 0;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--accent, #c4a574);
}
.fa-card-title {
  /* kept for compatibility; audit cards use kicker-only labels */
  display: none;
}
.fa-card-desc {
  margin: 0.15rem 0 0.55rem;
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--ink);
  line-height: 1.35;
}
.fa-fact-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr));
  gap: 0.4rem 0.75rem;
}
.fa-fact {
  min-width: 0;
}
.fa-fact-k,
.fa-tile-k,
.fa-mini-head {
  display: block;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: none; /* Title Case in markup */
  color: var(--muted);
}
/* Flight audit: kickers stay ALL CAPS; weather chip labels stay as written */
.flight-audit-panel .kicker,
.flight-audit-panel .home-kit-kicker {
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.flight-audit-panel .base-weather-label {
  text-transform: none;
  letter-spacing: 0.02em;
}
.flight-audit-panel .base-weather-flight-banner-title,
.flight-audit-panel .base-weather-flight-banner-sub {
  text-transform: none;
  letter-spacing: 0.02em;
}
.fa-fact-v,
.fa-tile-v {
  display: block;
  margin-top: 0.1rem;
  font-size: 0.9rem;
  font-weight: 650;
  color: var(--ink);
  word-break: break-word;
}
.fa-notes {
  margin-top: 0.65rem;
  padding-top: 0.55rem;
  border-top: 1px solid color-mix(in srgb, var(--line) 85%, transparent);
}
.fa-notes p {
  margin: 0.25rem 0 0;
  font-size: 0.88rem;
  line-height: 1.45;
  color: var(--ink);
  white-space: pre-wrap;
}
/* Training topics: clean list (no duplicated · walls of text) */
.training-topics-notes .training-topic-list {
  list-style: none;
  margin: 0.35rem 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.28rem;
}
.training-topics-notes .training-topic-item {
  margin: 0;
  padding: 0.35rem 0.5rem;
  border-radius: 8px;
  font-size: 0.88rem;
  font-weight: 500;
  line-height: 1.35;
  color: var(--ink);
  background: color-mix(in srgb, var(--surface-2, var(--surface)) 90%, var(--line));
  border: 1px solid color-mix(in srgb, var(--line) 65%, transparent);
  overflow-wrap: anywhere;
  word-break: break-word;
}
.fa-tile-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.4rem;
}
@media (max-width: 520px) {
  .fa-tile-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.fa-tile {
  padding: 0.4rem 0.45rem;
  border-radius: 8px;
  background: var(--surface);
  border: 1px solid color-mix(in srgb, var(--line) 90%, transparent);
}
.fa-tile-v {
  font-size: 0.92rem;
}
.fa-metar {
  margin: 0.5rem 0 0;
  padding: 0.4rem 0.5rem;
  border-radius: 6px;
  background: var(--surface);
  border: 1px solid var(--line);
  font-size: 0.74rem !important;
  line-height: 1.35;
  color: var(--muted) !important;
  word-break: break-word;
}
.fa-footnote {
  margin: 0.45rem 0 0;
  font-size: 0.75rem;
  color: var(--muted);
  line-height: 1.35;
}
.fa-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.65rem 0.85rem;
}
@media (max-width: 640px) {
  .fa-split {
    grid-template-columns: 1fr;
  }
}
.fa-mini-head {
  margin: 0 0 0.3rem;
}
.fa-list {
  list-style: none;
  margin: 0.25rem 0 0;
  padding: 0;
}
.fa-list li {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  padding: 0.35rem 0;
  border-bottom: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
}
.fa-list li:last-child {
  border-bottom: none;
}
.fa-li-main {
  font-size: 0.88rem;
  font-weight: 650;
  color: var(--ink);
}
.fa-li-meta {
  font-size: 0.78rem;
  color: var(--muted);
}
.fa-count-pill {
  flex-shrink: 0;
  min-width: 1.6rem;
  height: 1.6rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 800;
  background: var(--surface);
  border: 1px solid var(--line);
  color: var(--ink);
}
.flight-audit-mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.78rem !important;
  font-weight: 500 !important;
}
.flight-audit-reasons {
  margin: 0.4rem 0 0;
  font-size: 0.82rem;
  color: #f0a0a0;
  font-weight: 600;
}
.flight-audit-badge {
  display: inline-block;
  margin: 0;
  padding: 0.15rem 0.55rem;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  white-space: nowrap;
}
.flight-audit-badge--ok {
  background: color-mix(in srgb, #3d9a6a 22%, var(--surface-2));
  color: #7ddea8;
  border: 1px solid color-mix(in srgb, #3d9a6a 45%, transparent);
}
.flight-audit-badge--bad {
  background: color-mix(in srgb, #c45c5c 22%, var(--surface-2));
  color: #f0a0a0;
  border: 1px solid color-mix(in srgb, #c45c5c 45%, transparent);
}
.flight-audit-tag {
  display: inline-block;
  margin-left: 0.25rem;
  padding: 0.05rem 0.35rem;
  border-radius: 4px;
  font-size: 0.68rem;
  font-weight: 600;
  background: var(--surface);
  border: 1px solid var(--line);
  color: var(--muted);
  vertical-align: middle;
}
.flight-audit-loading {
  font-style: italic;
}
.flight-type-chip,
.flight-status-chip,
.flights-all-list-table .flight-type-chip,
.flights-all-list-table .flight-status-chip {
  display: inline-flex;
  align-items: center;
  padding: 0.14rem 0.5rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  white-space: nowrap;
  line-height: 1.2;
  border: 1px solid transparent;
  vertical-align: middle;
}
/* Shared type palette — chips + left rails use the same tokens */
:root,
html[data-theme="night"] {
  --type-open: #cbd5e1;
  --type-open-bg: rgba(148, 163, 184, 0.18);
  --type-open-line: rgba(148, 163, 184, 0.45);
  --type-training: #7dd3fc;
  --type-training-bg: rgba(56, 189, 248, 0.16);
  --type-training-line: rgba(56, 189, 248, 0.5);
  --type-cfs: #fcd34d;
  --type-cfs-bg: rgba(251, 191, 36, 0.16);
  --type-cfs-line: rgba(251, 191, 36, 0.5);
  --type-maint: #c4b5fd;
  --type-maint-bg: rgba(167, 139, 250, 0.16);
  --type-maint-line: rgba(167, 139, 250, 0.5);
}
.flight-type-unassigned {
  background: var(--type-open-bg);
  color: var(--type-open);
  border-color: var(--type-open-line);
}
.flight-type-training {
  background: var(--type-training-bg);
  color: var(--type-training);
  border-color: var(--type-training-line);
}
.flight-type-cfs {
  background: var(--type-cfs-bg);
  color: var(--type-cfs);
  border-color: var(--type-cfs-line);
}
.flight-type-maint {
  background: var(--type-maint-bg);
  color: var(--type-maint);
  border-color: var(--type-maint-line);
}
.flight-status-open {
  background: rgba(74, 222, 128, 0.12);
  color: #86efac;
  border-color: rgba(74, 222, 128, 0.3);
}
.flight-status-linked {
  background: rgba(148, 163, 184, 0.12);
  color: #94a3b8;
  border-color: rgba(148, 163, 184, 0.28);
}
html[data-theme="day"] .flight-type-unassigned {
  background: #e2e8f0;
  color: #334155;
  border-color: #cbd5e1;
}
html[data-theme="day"] .flight-type-training {
  background: #e0f2fe;
  color: #0369a1;
  border-color: #bae6fd;
}
html[data-theme="day"] .flight-type-cfs {
  background: #fef3c7;
  color: #b45309;
  border-color: #fde68a;
}
html[data-theme="day"] .flight-type-maint {
  background: #ede9fe;
  color: #6d28d9;
  border-color: #ddd6fe;
}
html[data-theme="day"] .flight-status-open {
  background: #dcfce7;
  color: #166534;
  border-color: #bbf7d0;
}
html[data-theme="day"] .flight-status-linked {
  background: #f1f5f9;
  color: #475569;
  border-color: #e2e8f0;
}

/* Calls for Service — attachment column */
.calls-all-table .calls-col-attach,
.calls-detail-attach {
  white-space: nowrap;
  min-width: 8rem;
}
.calls-attach-link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-weight: 600;
  text-decoration: none;
}
.calls-attach-link:hover {
  text-decoration: underline;
}
.calls-col-cr {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.calls-cr-table .calls-cr-row td {
  vertical-align: middle;
}
.calls-cr-table .calls-cr-row.is-expanded {
  background: rgba(255, 255, 255, 0.04);
}
.calls-cr-table .calls-cr-toggle {
  font-weight: 600;
  padding: 0.1rem 0.2rem;
}
.calls-cr-detail {
  padding: 0.55rem 0.35rem 0.75rem 1.5rem;
  border-left: 3px solid rgba(91, 157, 255, 0.45);
  margin: 0.15rem 0 0.35rem;
}
.training-event-meta-line {
  margin: 0 0 0.25rem;
  line-height: 1.35;
}
.training-event-topics-line {
  margin-bottom: 0.5rem;
  white-space: normal;
  overflow-wrap: anywhere;
}
.calls-cr-detail-meta {
  margin: 0 0 0.5rem;
}
.calls-cr-pilots-table {
  width: 100%;
  margin: 0;
}
.calls-cr-pilots-table th {
  font-size: 0.8em;
  opacity: 0.85;
}
.calls-cr-detail-row > td {
  padding-top: 0;
  border-top: none;
}

.training-events-table .training-event-row.is-expanded,
.maint-events-table .maint-event-row.is-expanded {
  background: rgba(255, 255, 255, 0.04);
}
.training-event-summary-line {
  margin-top: 0.2rem;
  line-height: 1.35;
  white-space: normal;
}
.training-event-detail,
.maint-event-detail {
  padding: 0.55rem 0.35rem 0.75rem 1.5rem;
}
.training-event-pilots-table,
.training-event-flight-actions {
  white-space: nowrap;
  vertical-align: middle;
}
.training-event-flight-actions .unit-record-flight-actions {
  margin-top: 0;
  justify-content: flex-end;
}
.training-event-flights-table,
.maint-event-flights-table {
  width: 100%;
  margin-bottom: 0.5rem;
}
.maint-events-table .maint-event-row td {
  vertical-align: middle;
}
.maint-event-detail-row > td {
  padding-top: 0;
  border-top: none;
}

/* Maintenance ticket running work log */
.maint-work-log-list {
  list-style: none;
  margin: 0 0 0.75rem;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}
.maint-work-log-item {
  border: 1px solid var(--line, rgba(255, 255, 255, 0.1));
  border-radius: 8px;
  padding: 0.5rem 0.65rem;
  background: rgba(0, 0, 0, 0.18);
}
.maint-work-log-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem 0.65rem;
  font-size: 0.78rem;
  opacity: 0.9;
  margin-bottom: 0.3rem;
}
.maint-work-log-when {
  font-weight: 600;
}
.maint-work-log-by {
  opacity: 0.85;
}
.maint-work-log-edited {
  opacity: 0.7;
  font-size: 0.72rem;
}
.maint-work-log-text {
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 0.9rem;
  line-height: 1.35;
}
.maint-work-log-empty {
  margin: 0;
  padding: 0.25rem 0;
}
.maint-work-log-add textarea {
  width: 100%;
  min-height: 3.2rem;
  resize: vertical;
}

/* ── Scheduled training cards (admin + pilot) ── */
.training-sched-section {
  padding: 14px 16px 16px;
}
.training-sched-section-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px 12px;
  margin-bottom: 12px;
}
.training-sched-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.training-sched-card {
  margin: 0;
  padding: 14px 16px 16px;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--line, #334) 90%, transparent);
  background:
    linear-gradient(
      165deg,
      color-mix(in srgb, var(--brand, #3d6b4f) 10%, transparent) 0%,
      transparent 42%
    ),
    color-mix(in srgb, var(--surface-2, #151b26) 88%, #0b1018);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.03) inset;
}
.training-sched-card--pilot {
  /* unit-record-card already borders; keep our spacing */
  padding: 14px 16px 16px;
}
.training-sched-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px 14px;
  margin-bottom: 10px;
}
.training-sched-head-main {
  min-width: 0;
  flex: 1 1 12rem;
}
.training-sched-title {
  margin: 0 0 8px;
  font-size: 1.05rem;
  font-weight: 750;
  letter-spacing: -0.01em;
  line-height: 1.25;
  color: var(--ink, #e8edf5);
}
.training-sched-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.training-sched-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--line, #445) 85%, transparent);
  background: rgba(0, 0, 0, 0.22);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.3;
  color: color-mix(in srgb, var(--ink, #e8edf5) 92%, transparent);
  white-space: nowrap;
}
.training-sched-chip--ok {
  border-color: color-mix(in srgb, var(--brand, #3d6b4f) 55%, var(--line, #445));
  background: color-mix(in srgb, var(--brand, #3d6b4f) 22%, transparent);
  color: #c8e6d0;
}
.training-sched-chip--warn {
  border-color: color-mix(in srgb, #c9a227 50%, var(--line, #445));
  background: color-mix(in srgb, #c9a227 18%, transparent);
  color: #f0e0a8;
}
.training-sched-chip--muted {
  border-color: color-mix(in srgb, var(--line, #445) 90%, transparent);
  background: rgba(0, 0, 0, 0.28);
  color: color-mix(in srgb, var(--ink, #e8edf5) 70%, transparent);
  opacity: 0.95;
}
.training-sched-chip--required {
  border-color: #f87171;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, #ef4444 42%, transparent),
    color-mix(in srgb, #b91c1c 38%, transparent)
  );
  color: #fff5f5;
  font-weight: 850;
  font-size: 0.76rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  box-shadow: 0 0 0 1px rgba(248, 113, 113, 0.35), 0 2px 8px rgba(185, 28, 28, 0.35);
}
.training-sched-chip--optional {
  border-color: color-mix(in srgb, #38bdf8 45%, var(--line, #445));
  background: linear-gradient(
    180deg,
    color-mix(in srgb, #0ea5e9 28%, transparent),
    color-mix(in srgb, #0369a1 32%, transparent)
  );
  color: #e0f2fe;
  font-weight: 800;
  font-size: 0.76rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  box-shadow: 0 0 0 1px rgba(56, 189, 248, 0.25), 0 2px 6px rgba(3, 105, 161, 0.28);
}
.training-sched-card--ineligible {
  opacity: 0.92;
  background:
    linear-gradient(
      165deg,
      rgba(255, 255, 255, 0.02) 0%,
      transparent 40%
    ),
    color-mix(in srgb, var(--surface-2, #151b26) 92%, #0b1018);
}
.training-sched-card.is-cal-flash {
  outline: 2px solid color-mix(in srgb, var(--brand, #3d6b4f) 70%, #fff);
  outline-offset: 2px;
  transition: outline-color 0.3s ease;
}
.training-sched-footer-hint {
  font-size: 0.84rem;
  opacity: 0.78;
  line-height: 1.35;
}
.training-sched-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 12px;
}
.training-sched-filter-btn {
  min-height: 34px;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--line, #445) 90%, transparent);
  background: rgba(0, 0, 0, 0.22);
  color: color-mix(in srgb, var(--ink, #e8edf5) 88%, transparent);
  font: 700 0.8rem/1.2 system-ui, -apple-system, sans-serif;
  letter-spacing: 0.02em;
  cursor: pointer;
}
.training-sched-filter-btn:hover {
  border-color: color-mix(in srgb, var(--brand, #3d6b4f) 50%, var(--line, #445));
}
.training-sched-filter-btn.is-active {
  border-color: color-mix(in srgb, var(--brand, #3d6b4f) 60%, var(--line, #445));
  background: color-mix(in srgb, var(--brand, #3d6b4f) 28%, transparent);
  color: #e8f5ec;
}
.training-sched-filter-btn:focus {
  outline: none;
}
.training-sched-filter-btn:focus-visible {
  outline: 2px solid #38bdf8;
  outline-offset: 2px;
}
.training-sched-actions {
  flex: 0 0 auto;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}
.training-sched-meta {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(10.5rem, 1fr));
  gap: 8px 14px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--line, #334) 75%, transparent);
  background: rgba(0, 0, 0, 0.18);
  margin-bottom: 10px;
}
.training-sched-fact {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.training-sched-fact-k {
  font-size: 0.68rem;
  font-weight: 750;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  opacity: 0.72;
}
.training-sched-fact-v {
  font-size: 0.88rem;
  font-weight: 600;
  line-height: 1.3;
  color: var(--ink, #e8edf5);
  word-break: break-word;
}
.training-sched-elig {
  margin: 0 0 8px;
  font-size: 0.84rem;
  line-height: 1.35;
  opacity: 0.9;
}
.training-sched-elig .training-sched-fact-k {
  margin-right: 6px;
}
.training-sched-notes {
  margin: 0 0 10px;
  padding: 8px 10px;
  border-radius: 8px;
  border-left: 3px solid color-mix(in srgb, var(--brand, #3d6b4f) 65%, transparent);
  background: rgba(0, 0, 0, 0.14);
  font-size: 0.88rem;
  line-height: 1.4;
  white-space: pre-wrap;
  word-break: break-word;
}
.training-sched-roster.training-rsvp-groups {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  margin-top: 2px;
}
@media (min-width: 640px) {
  .training-sched-roster.training-rsvp-groups {
    grid-template-columns: 1fr 1fr;
    gap: 12px 16px;
  }
}
.training-sched-roster .training-rsvp-group {
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--line, #334) 70%, transparent);
  background: rgba(0, 0, 0, 0.12);
  min-width: 0;
}
.training-sched-roster .training-rsvp-group.is-empty {
  opacity: 0.72;
}
.training-sched-footer {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid color-mix(in srgb, var(--line, #334) 75%, transparent);
}

/* RSVP chip groups (shared) */
.training-rsvp-groups {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 10px;
}
.training-rsvp-group {
  min-width: 0;
}
.training-rsvp-title {
  margin: 0 0 8px;
  font-size: 0.72rem;
  font-weight: 750;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  opacity: 0.82;
  color: var(--text, inherit);
}
.training-rsvp-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.training-rsvp-chip {
  font-size: 0.8rem;
  font-weight: 600;
}
.training-rsvp-chip-wrap {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 8px;
  margin: 0;
  padding: 3px 8px 3px 3px;
  border: 1px solid var(--line, rgba(255, 255, 255, 0.12));
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.03);
}
.training-rsvp-action {
  font-size: 0.76rem;
  font-weight: 700;
  padding: 2px 6px;
  min-height: 0;
  opacity: 0.9;
}
.training-rsvp-action:hover {
  opacity: 1;
  text-decoration: underline;
}
.training-rsvp-empty {
  margin: 0;
  font-size: 0.84rem;
  opacity: 0.65;
  font-style: italic;
}
.training-admin-add-pilot {
  margin-top: 4px;
  padding-top: 8px;
  border-top: 1px solid var(--line, rgba(255, 255, 255, 0.1));
}
.training-admin-add-pilot-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.training-admin-add-pilot-controls select {
  min-width: 10rem;
  max-width: 100%;
  min-height: 36px;
  padding: 6px 10px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: var(--surface-2, rgba(0, 0, 0, 0.2));
  color: inherit;
  font: inherit;
}

/* Schedule training — eligible pilot multi-select */
.training-eligible-block {
  padding: 12px;
  border: 1px solid var(--line, rgba(255, 255, 255, 0.12));
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.02);
}
.training-eligible-block-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.training-eligible-pilot-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(11.5rem, 1fr));
  gap: 6px 10px;
  max-height: 220px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: 4px 2px 2px;
}
.training-eligible-pilot {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 6px 8px;
  border-radius: 8px;
  border: 1px solid transparent;
  cursor: pointer;
  font-size: 0.9rem;
  line-height: 1.25;
  user-select: none;
}
.training-eligible-pilot:hover {
  background: rgba(255, 255, 255, 0.04);
  border-color: var(--line, rgba(255, 255, 255, 0.1));
}
.training-eligible-pilot input {
  flex: 0 0 auto;
  width: 1rem;
  height: 1rem;
  margin: 0;
  accent-color: var(--accent, #3b82f6);
}
.training-eligible-pilot span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.training-preassign-check {
  font-size: 0.9rem;
}

/* Pilot unit records tables (mirror admin CFS / training events) */
.unit-records-table-wrap {
  max-height: 520px;
  overflow: auto;
  margin-top: 0.5rem;
}
.unit-records-table {
  width: 100%;
}
.unit-records-table .unit-records-row.is-expanded {
  background: rgba(255, 255, 255, 0.04);
}
.unit-records-detail {
  padding: 0.5rem 0.35rem 0.75rem 1.25rem;
  border-left: 3px solid rgba(91, 157, 255, 0.45);
  margin: 0.1rem 0 0.35rem;
}
.unit-records-nested {
  width: 100%;
  margin: 0.35rem 0 0.5rem;
}
.unit-records-detail-row > td {
  padding-top: 0;
  border-top: none;
}

/* Expandable unit record cards — mobile-first (pilot CFS + Training) */
.unit-record-cards {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  margin-top: 0.5rem;
}
.unit-record-card {
  border: 1px solid color-mix(in srgb, var(--border, #334) 85%, transparent);
  border-radius: 12px;
  background: color-mix(in srgb, var(--surface, #1a1f2a) 92%, transparent);
  overflow: hidden;
}
html[data-theme="day"] .unit-record-card {
  background: #fff;
  border-color: #d8dee8;
}
.unit-record-card.is-expanded {
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent, #5b9dff) 35%, transparent);
}
.unit-record-card-toggle {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  width: 100%;
  margin: 0;
  padding: 0.75rem 0.8rem;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
  font: inherit;
  -webkit-tap-highlight-color: transparent;
}
.unit-record-card-toggle:active {
  background: color-mix(in srgb, var(--accent, #5b9dff) 10%, transparent);
}
.unit-record-chevron {
  flex: 0 0 auto;
  width: 1.25rem;
  line-height: 1.35;
  font-size: 0.95rem;
  opacity: 0.85;
}
.unit-record-card-body {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
  flex: 1;
}
.unit-record-card-title-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem;
}
.unit-record-cr {
  font-variant-numeric: tabular-nums;
  font-size: 0.98rem;
  letter-spacing: 0.01em;
  word-break: break-word;
}
.unit-record-hours {
  flex: 0 0 auto;
  font-size: 0.85rem;
  font-weight: 600;
  opacity: 0.9;
  white-space: nowrap;
}
.unit-record-desc {
  font-size: 0.92rem;
  font-weight: 400;
  line-height: 1.3;
}
.unit-record-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.65rem;
  font-size: 0.8rem;
  opacity: 0.78;
  line-height: 1.35;
}
.unit-record-card-expand {
  padding: 0 0.8rem 0.8rem 2.1rem;
  border-top: 1px solid color-mix(in srgb, var(--border, #334) 70%, transparent);
}
.unit-record-card-expand[hidden] {
  display: none !important;
}
.unit-record-expand-label {
  margin: 0.65rem 0 0.3rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  opacity: 0.7;
}
.unit-record-sublist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.unit-record-subitem {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.45rem 0.55rem;
  border-radius: 8px;
  background: color-mix(in srgb, var(--surface-2, rgba(255,255,255,0.04)) 100%, transparent);
}
html[data-theme="day"] .unit-record-subitem {
  background: #f4f6fa;
}
.unit-record-subitem-main {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  min-width: 0;
}
.unit-record-subitem-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.55rem;
  font-size: 0.78rem;
  opacity: 0.8;
}
/* Linked flight → open Flights tab / Watch Flight */
.unit-record-subitem--nav {
  padding: 0;
  overflow: hidden;
}
.unit-record-flight-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  width: 100%;
  margin: 0;
  padding: 0.45rem 0.55rem;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.unit-record-flight-link:active {
  background: color-mix(in srgb, var(--accent, #5b9dff) 12%, transparent);
}
.unit-record-flight-link-cue {
  flex: 0 0 auto;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  opacity: 0.65;
  white-space: nowrap;
  color: var(--accent, #5b9dff);
}
.unit-record-card--flash {
  outline: 2px solid color-mix(in srgb, var(--accent, #5b9dff) 70%, transparent);
  outline-offset: 2px;
  transition: outline-color 0.3s ease;
}
.unit-record-subitem-actions {
  flex: 0 0 auto;
  align-self: center;
}
.unit-record-extra {
  margin: 0.45rem 0 0;
  font-size: 0.82rem;
}
@media (min-width: 720px) {
  .unit-record-card-toggle {
    padding: 0.85rem 1rem;
  }
  .unit-record-card-expand {
    padding-left: 2.4rem;
    padding-right: 1rem;
  }
}
/* ---- Admin Settings (ops-v1035 redesign) ---- */
.settings-panel-head .panel-head-sub {
  max-width: 36rem;
}
.settings-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin: 0.35rem 0 1rem;
  padding: 0.3rem;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-2, var(--surface));
}
.settings-nav-btn {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--muted);
  font-weight: 800;
  font-size: 0.82rem;
  min-height: 38px;
  padding: 0 0.9rem;
  border-radius: 9px;
  cursor: pointer;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.settings-nav-btn.is-active {
  background: var(--accent);
  color: #0b0f14;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}
.settings-nav-btn:not(.is-active):hover {
  color: var(--ink);
  background: color-mix(in srgb, var(--surface) 70%, transparent);
}
.settings-body {
  display: block;
}
.settings-tab {
  animation: settingsFade 0.15s ease;
}
@keyframes settingsFade {
  from {
    opacity: 0.55;
  }
  to {
    opacity: 1;
  }
}
.settings-section-title {
  margin: 0 0 0.65rem;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--accent);
  line-height: 1.3;
}
.settings-tight-hint {
  margin: 0.35rem 0 0.65rem;
  font-size: 0.82rem;
}
.settings-stat-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.55rem;
  margin-bottom: 1rem;
}
@media (min-width: 720px) {
  .settings-stat-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
.settings-stat-tile {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  padding: 0.75rem 0.85rem;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  min-height: 4.5rem;
}
.settings-stat-label {
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted);
}
.settings-stat-value {
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--ink);
  line-height: 1.2;
}
.settings-stat-sub {
  font-size: 0.78rem;
  color: var(--muted);
}
.settings-issues {
  margin: 0 0 0.85rem;
  padding: 0.75rem 0.9rem;
  border: 1px solid color-mix(in srgb, var(--warn, #d4a017) 45%, var(--line));
  border-radius: 12px;
  background: color-mix(in srgb, var(--warn, #d4a017) 10%, var(--surface));
}
.settings-issue-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: 0.88rem;
  line-height: 1.45;
}
.settings-all-clear {
  margin: 0 0 0.75rem;
  padding: 0.65rem 0.85rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--ok, #3d9a5f) 35%, var(--line));
  background: color-mix(in srgb, var(--ok, #3d9a5f) 10%, var(--surface));
  font-weight: 650;
  font-size: 0.9rem;
}
.settings-card {
  padding: 1rem 1.05rem 1.1rem;
}
.settings-card-compact {
  margin: 0;
}
.settings-card-head {
  margin-bottom: 0.75rem;
}
.settings-card-head h3 {
  margin: 0.15rem 0 0.35rem;
  font-size: 1.1rem;
  font-weight: 800;
}
.settings-push-status-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem 1rem;
  align-items: center;
  margin: 0 0 0.75rem;
  font-size: 0.88rem;
}
.settings-push-enroll-count {
  color: var(--muted);
}
.settings-master-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.85rem;
  padding: 0.85rem 1rem;
  margin: 0 0 1rem;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  cursor: pointer;
}
.settings-master-row.is-on {
  border-color: color-mix(in srgb, var(--accent) 40%, var(--line));
  background: color-mix(in srgb, var(--accent) 10%, var(--surface));
}
.settings-master-row.is-locked {
  opacity: 0.88;
  cursor: default;
}
.settings-master-text {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
}
.settings-master-title {
  font-weight: 800;
  font-size: 1rem;
}
.settings-master-desc {
  font-size: 0.82rem;
  color: var(--muted);
  line-height: 1.35;
}
.settings-master-ctrl {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  flex: 0 0 auto;
}
.settings-master-ctrl input[type="checkbox"] {
  width: 1.2rem;
  height: 1.2rem;
  accent-color: var(--accent);
  cursor: pointer;
}
.settings-toggle-note {
  font-size: 0.78rem;
  color: var(--warn, #d4a017);
  font-weight: 600;
}
.settings-push-split {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.85rem;
}
@media (min-width: 960px) {
  .settings-push-split {
    grid-template-columns: 1fr 1fr;
    align-items: start;
  }
}
.settings-push-by-user,
.settings-push-delivery {
  display: grid;
  gap: 0.55rem;
}
.settings-push-user-pick {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0.55rem 0.85rem;
}
.settings-push-user-select-label {
  display: grid;
  gap: 0.28rem;
  min-width: min(100%, 240px);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted);
}
.settings-push-user-select-label select {
  min-height: 40px;
  font-size: 0.95rem;
  font-weight: 650;
  text-transform: none;
  letter-spacing: normal;
}
.settings-push-user-pick-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}
.settings-inline-status {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}
.settings-chip {
  display: inline-flex;
  align-items: center;
  min-height: 1.55rem;
  padding: 0 0.55rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--surface-2, var(--surface));
  font-size: 0.72rem;
  font-weight: 750;
  color: var(--muted);
}
.settings-chip.is-ok {
  border-color: color-mix(in srgb, var(--ok, #3d9a5f) 40%, var(--line));
  color: var(--ok, #3d9a5f);
}
.settings-push-pref-list,
.settings-push-delivery-list {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  max-height: min(52vh, 28rem);
  overflow: auto;
  padding-right: 0.15rem;
}
.settings-push-pref-row,
.settings-push-delivery-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
  padding: 0.55rem 0.7rem;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2, var(--surface));
}
.settings-push-pref-row {
  cursor: pointer;
}
.settings-push-pref-row.is-on {
  border-color: color-mix(in srgb, var(--accent) 35%, var(--line));
  background: color-mix(in srgb, var(--accent) 8%, var(--surface-2, var(--surface)));
}
.settings-push-pref-main,
.settings-push-delivery-main {
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
  min-width: 0;
  flex: 1;
}
.settings-push-pref-label {
  font-weight: 800;
  font-size: 0.9rem;
  color: var(--ink);
}
.settings-push-pref-desc {
  font-size: 0.76rem;
  color: var(--muted);
  line-height: 1.3;
}
.settings-push-pref-row input[type="checkbox"] {
  width: 1.1rem;
  height: 1.1rem;
  accent-color: var(--accent);
  flex-shrink: 0;
  cursor: pointer;
}
.settings-push-delivery-select {
  display: grid;
  gap: 0.22rem;
  min-width: min(100%, 11.5rem);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
}
.settings-push-delivery-select select {
  min-height: 36px;
  font-size: 0.84rem;
  font-weight: 650;
  text-transform: none;
  letter-spacing: normal;
}
.settings-push-delivery-help {
  margin: 0;
}
@media (max-width: 640px) {
  .settings-push-delivery-row {
    flex-direction: column;
    align-items: stretch;
  }
  .settings-push-delivery-select {
    width: 100%;
  }
}
.settings-details {
  margin-top: 0.75rem;
  font-size: 0.88rem;
}
.settings-details summary {
  cursor: pointer;
  font-weight: 700;
}
.settings-sub-list {
  margin: 0.45rem 0 0;
  padding-left: 1.15rem;
}
.settings-svc-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.45rem;
}
@media (min-width: 720px) {
  .settings-svc-grid {
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 1100px) {
  .settings-svc-grid {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
.settings-svc-card {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  min-height: 4.25rem;
}
.settings-svc-card.is-ok {
  border-color: color-mix(in srgb, var(--ok, #3d9a5f) 30%, var(--line));
}
.settings-svc-card.is-bad {
  border-color: color-mix(in srgb, var(--bad, #c45) 40%, var(--line));
  background: color-mix(in srgb, var(--bad, #c45) 7%, var(--surface));
}
.settings-svc-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}
.settings-svc-top strong {
  font-size: 0.9rem;
}
.settings-svc-detail {
  font-size: 0.76rem;
  color: var(--muted);
  line-height: 1.35;
  word-break: break-word;
}
.settings-health-list {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}
.settings-health-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
  padding: 0.5rem 0.6rem;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
}
.settings-health-main {
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
  min-width: 0;
}
.settings-health-main strong {
  font-size: 0.88rem;
}
.settings-health-detail,
.settings-health-meta {
  font-size: 0.76rem;
  color: var(--muted);
  line-height: 1.3;
  word-break: break-word;
}
.settings-cache-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.5rem;
  margin-top: 0.85rem;
}
@media (min-width: 640px) {
  .settings-cache-row {
    grid-template-columns: 1fr 1fr;
  }
}
.settings-cache-row > div {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  padding: 0.55rem 0.65rem;
  border: 1px solid var(--line);
  border-radius: 10px;
  font-size: 0.84rem;
}
.settings-cache-row strong {
  font-size: 0.9rem;
}
.settings-system-split {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.85rem;
}
@media (min-width: 900px) {
  .settings-system-split {
    grid-template-columns: minmax(14rem, 0.9fr) 1.3fr;
    align-items: start;
  }
}
.settings-kv-list {
  display: grid;
  gap: 0.28rem;
}
.settings-kv {
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.35rem 0;
  border-bottom: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
  font-size: 0.84rem;
}
.settings-kv:last-child {
  border-bottom: 0;
}
.settings-kv-k {
  color: var(--muted);
  font-weight: 700;
}
.settings-kv-v {
  font-weight: 750;
  text-align: right;
  color: var(--ink);
}

/* ==========================================================================
   Record UI v2 — Flights / Calls / Training hierarchy (ops-v1010+)
   Enabled via body.record-ui-v2 (set on admin + pilot HTML).

   REVERT OPTIONS:
   1) Soft: remove class "record-ui-v2" from <body> in index.html + pilot-view.html
      (and from any JS that adds it) — most visual hierarchy reverts.
   2) Full: restore files from backups/record-ui-pre-v1010/
      /home/josh/uas-ops/backups/record-ui-pre-v1010/RESTORE.sh
   ========================================================================== */

/* --- L2 module titles: gold uppercase (same language as .kicker / accordion) --- */
body.record-ui-v2 .unit-module-title,
body.pilot-app .unit-module-title {
  margin: 0 0 0.55rem;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--accent);
  line-height: 1.3;
}
body.record-ui-v2 .unit-list-card > .unit-module-title,
body.record-ui-v2 .unit-leaderboard > .unit-module-title,
body.pilot-app .unit-list-card > .unit-module-title,
body.pilot-app .unit-leaderboard > .unit-module-title {
  margin: 0 0 0.6rem;
}
/* Demote leftover kickers inside list/leaderboard shells when v2 titles present */
body.record-ui-v2 .unit-list-card > .kicker:not(.unit-module-title),
body.record-ui-v2 .unit-leaderboard > .kicker:not(.unit-module-title) {
  display: none;
}

/* Pilot: page-level panel titles removed — bottom nav shows the section */
body.pilot-app #panel-flights > .panel-head,
body.pilot-app #panel-calls > .panel-head,
body.pilot-app #panel-training > .panel-head,
body.pilot-app #panel-preflight > .panel-head,
body.pilot-app #panel-postflight > .panel-head,
body.pilot-app #panel-ops > .panel-head {
  display: none !important;
}

/* Compact action strip (custody cancel) — no page title */
body.pilot-app .pilot-panel-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.5rem;
  margin: 0 0 0.75rem;
}
body.pilot-app .pilot-panel-loading {
  margin: 0.5rem 0 1rem;
}
body.pilot-app .pilot-checklist-sub {
  margin: 0 0 0.65rem;
  font-size: 0.82rem;
}

/* Title Case chrome across pilot UI (not body copy / data fields) */
body.pilot-app .unit-calls-sort > span,
body.pilot-app .unit-calls-toolbar label > span,
body.pilot-app .pilot-menu-item,
body.pilot-app .home-welcome-roles,
body.pilot-app .settings-toggle-label {
  text-transform: capitalize;
}

/* --- Collapsed row: stronger primary, quieter meta --- */
body.record-ui-v2 #panel-flights .unit-record-cr,
body.record-ui-v2 #panel-calls .unit-record-cr,
body.record-ui-v2 #panel-training .unit-record-cr {
  font-size: 1.05rem;
  font-weight: 750;
  color: var(--ink);
  letter-spacing: 0.01em;
}
body.record-ui-v2 #panel-flights .unit-record-desc,
body.record-ui-v2 #panel-calls .unit-record-desc,
body.record-ui-v2 #panel-training .unit-record-desc {
  margin-top: 0.28rem;
  font-size: 0.82rem;
  font-weight: 500;
  color: var(--muted);
  opacity: 1;
  line-height: 1.35;
}
body.record-ui-v2 #panel-flights .unit-record-hours,
body.record-ui-v2 #panel-calls .unit-record-hours,
body.record-ui-v2 #panel-training .unit-record-hours {
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}

/* --- Type rails — same colors as .flight-type-* chips --- */
body.record-ui-v2 .unit-record-card {
  border-left-width: 3px;
  border-left-style: solid;
  border-left-color: var(--type-open-line, rgba(148, 163, 184, 0.45));
}
body.record-ui-v2 .unit-record-card--type-cfs {
  border-left-color: var(--type-cfs, #fcd34d);
}
body.record-ui-v2 .unit-record-card--type-training {
  border-left-color: var(--type-training, #7dd3fc);
}
body.record-ui-v2 .unit-record-card--type-maint {
  border-left-color: var(--type-maint, #c4b5fd);
}
body.record-ui-v2 .unit-record-card--type-open {
  border-left-color: var(--type-open, #cbd5e1);
}
/* Subtle matching wash so rail + chip read as one system */
body.record-ui-v2 .unit-record-card--type-cfs {
  background: color-mix(in srgb, var(--type-cfs-bg, rgba(251, 191, 36, 0.16)) 55%, var(--surface));
}
body.record-ui-v2 .unit-record-card--type-training {
  background: color-mix(in srgb, var(--type-training-bg, rgba(56, 189, 248, 0.16)) 55%, var(--surface));
}
body.record-ui-v2 .unit-record-card--type-maint {
  background: color-mix(in srgb, var(--type-maint-bg, rgba(167, 139, 250, 0.16)) 55%, var(--surface));
}
body.record-ui-v2 .unit-record-card--type-open {
  background: color-mix(in srgb, var(--type-open-bg, rgba(148, 163, 184, 0.18)) 40%, var(--surface));
}
body.record-ui-v2 .unit-record-card--type-cfs.is-expanded,
body.record-ui-v2 .unit-record-card--type-training.is-expanded,
body.record-ui-v2 .unit-record-card--type-maint.is-expanded,
body.record-ui-v2 .unit-record-card--type-open.is-expanded {
  background: color-mix(in srgb, var(--surface) 70%, var(--surface-2));
}
body.record-ui-v2 .unit-record-card.is-expanded {
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 28%, transparent);
  background: color-mix(in srgb, var(--surface) 88%, var(--surface-2));
}

/* Type chips — slightly quieter so title wins */
body.record-ui-v2 #panel-flights .flight-type-chip,
body.record-ui-v2 #panel-calls .flight-type-chip,
body.record-ui-v2 #panel-training .flight-type-chip {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  padding: 0.12rem 0.42rem;
  opacity: 0.92;
}

/* --- Expand panel: one surface step, less nested chrome --- */
body.record-ui-v2 #panel-flights .unit-record-card-expand,
body.record-ui-v2 #panel-calls .unit-record-card-expand,
body.record-ui-v2 #panel-training .unit-record-card-expand {
  background: color-mix(in srgb, var(--surface-2) 55%, transparent);
  border-top: 1px solid var(--line);
  padding: 0.7rem 0.75rem 0.85rem;
}
body.record-ui-v2 .uas-acc-section {
  background: var(--surface);
  border-color: color-mix(in srgb, var(--line) 90%, transparent);
}
body.record-ui-v2 .uas-acc-toggle {
  background: color-mix(in srgb, var(--surface-2) 70%, transparent);
  min-height: 2.45rem;
  padding: 0.5rem 0.65rem;
}
body.record-ui-v2 .uas-acc-title {
  font-size: 0.72rem;
  letter-spacing: 0.06em;
}
body.record-ui-v2 .uas-acc-body {
  background: var(--surface);
  padding: 0.55rem 0.65rem 0.7rem;
}

/* Pass 3: flatten nested fa-cards inside accordion (avoid card-in-card) */
body.record-ui-v2 .uas-acc-body > .fa-card,
body.record-ui-v2 .uas-acc-body .pilot-flight-details-card,
body.record-ui-v2 .uas-acc-body .pilot-calls-cfs-detail,
body.record-ui-v2 .uas-acc-body .pilot-training-event-detail,
body.record-ui-v2 .uas-acc-body .calls-cfs-detail-card,
body.record-ui-v2 .uas-acc-body .fa-card--mission,
body.record-ui-v2 .flight-audit-panel .uas-acc-body .fa-card {
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0.1rem 0 0.25rem;
  margin: 0;
  border-radius: 0;
}
/* Hide duplicate section kickers inside accordion (title already on toggle) */
body.record-ui-v2 .uas-acc-body .fa-card-kicker,
body.record-ui-v2 .uas-acc-body .fa-card-head .fa-card-kicker {
  display: none;
}
/* Keep action row (e.g. Watch) when kicker is hidden */
body.record-ui-v2 .uas-acc-body .fa-card-head--row {
  margin: 0 0 0.35rem;
  min-height: 0;
  justify-content: flex-end;
}
body.record-ui-v2 .uas-acc-body .fa-card-head:not(.fa-card-head--row) {
  display: none;
}
body.record-ui-v2 .uas-acc-body .fa-fact-grid {
  margin-top: 0.15rem;
  gap: 0.35rem 0.75rem;
}
body.record-ui-v2 .uas-acc-body .fa-fact-k {
  color: var(--muted);
  font-size: 0.68rem;
}
body.record-ui-v2 .uas-acc-body .fa-fact-v,
body.record-ui-v2 .uas-acc-body .fa-fact strong {
  font-weight: 650;
  color: var(--ink);
}
/* Weather wrap inside accordion: keep slight card but less heavy */
body.record-ui-v2 .uas-acc-body .fa-weather-wrap .base-weather-card,
body.record-ui-v2 .uas-acc-body .base-weather-card {
  border-radius: 8px;
  border: 1px solid color-mix(in srgb, var(--line) 85%, transparent);
  background: color-mix(in srgb, var(--surface-2) 80%, transparent);
}
/* Linked flight rows quieter inside expand */
body.record-ui-v2 .uas-acc-body .unit-record-subitem,
body.record-ui-v2 .unit-record-card-expand .unit-record-subitem {
  border-color: color-mix(in srgb, var(--line) 75%, transparent);
  background: color-mix(in srgb, var(--surface) 70%, transparent);
}
body.record-ui-v2 .unit-record-expand-label {
  font-size: 0.72rem;
  font-weight: 750;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0.55rem 0 0.3rem;
}

/* Module toolbar / subtitle */
body.record-ui-v2 .unit-calls-list-sub {
  font-size: 0.8rem;
  color: var(--muted);
  font-weight: 500;
}
body.record-ui-v2 .unit-leaderboard-title {
  font-size: 0.88rem;
  font-weight: 650;
  color: var(--muted);
  margin: 0 0 0.55rem;
}

/* Admin expanded detail shells under same hierarchy */
body.record-ui-v2 .calls-cr-detail,
body.record-ui-v2 .training-event-detail,
body.record-ui-v2 .flight-audit-panel {
  /* no layout change; accordion flatten rules apply */
}

/* ── Post-flight mission reports ─────────────────────────────────────────── */
.pfr-editor-host {
  position: fixed;
  inset: 0;
  z-index: 420;
  display: flex;
  align-items: stretch;
  justify-content: center;
  background: rgba(2, 6, 14, 0.88);
  backdrop-filter: blur(4px);
}
.pfr-editor-host[hidden] {
  display: none !important;
}
.pfr-editor-panel {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  width: 100%;
  max-width: 720px;
  margin: 0 auto;
  background: var(--surface, #0f172a);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--line) 70%, transparent);
  padding-top: env(safe-area-inset-top, 0);
  padding-bottom: env(safe-area-inset-bottom, 0);
}
.pfr-editor-toolbar {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px 10px;
  border-bottom: 1px solid color-mix(in srgb, var(--line) 85%, transparent);
  background: color-mix(in srgb, var(--surface-2, #1a1f2a) 92%, #000);
}
.pfr-editor-kicker {
  margin: 0 0 2px;
  font: 800 10px/1.2 var(--font, system-ui, sans-serif);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--accent, #b8ad86);
}
.pfr-editor-title {
  margin: 0;
  font: 800 1.05rem/1.25 var(--font, system-ui, sans-serif);
  color: var(--ink, #e8edf5);
}
.pfr-editor-subtitle {
  margin: 2px 0 0;
  font: 600 0.82rem/1.3 var(--font, system-ui, sans-serif);
  color: var(--muted, #9aa6b8);
}
.pfr-editor-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: 12px 14px 16px;
}
.pfr-editor-footer {
  flex: 0 0 auto;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 10px 14px calc(10px + env(safe-area-inset-bottom, 0));
  border-top: 1px solid color-mix(in srgb, var(--line) 85%, transparent);
  background: color-mix(in srgb, var(--surface-2, #1a1f2a) 88%, #000);
}
html.pfr-editor-open,
html.pfr-editor-open body {
  overflow: hidden !important;
}
.pfr-form-status-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
.pfr-chip {
  display: inline-flex;
  align-items: center;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  font: 750 0.72rem/1.2 var(--font, system-ui, sans-serif);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: color-mix(in srgb, var(--muted) 22%, transparent);
  color: var(--muted);
  border: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
}
.pfr-chip--ok {
  background: color-mix(in srgb, #22c55e 22%, transparent);
  color: #86efac;
  border-color: color-mix(in srgb, #22c55e 45%, transparent);
}
.pfr-chip--info {
  background: color-mix(in srgb, #38bdf8 22%, transparent);
  color: #7dd3fc;
  border-color: color-mix(in srgb, #38bdf8 45%, transparent);
}
.pfr-chip--warn {
  background: color-mix(in srgb, #f59e0b 22%, transparent);
  color: #fcd34d;
  border-color: color-mix(in srgb, #f59e0b 45%, transparent);
}
.pfr-chip--bad {
  background: color-mix(in srgb, #ef4444 22%, transparent);
  color: #fca5a5;
  border-color: color-mix(in srgb, #ef4444 45%, transparent);
}
.pfr-home-card .pfr-flight-list {
  max-height: min(40vh, 280px);
  margin: 8px 0 0;
}
/* Post-flight home: unreported flight rows (reuse unit-record flight row layout) */
.pfr-need-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  max-height: min(48vh, 360px);
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.pfr-need-row {
  margin: 0;
  border: 1px solid color-mix(in srgb, var(--line, #334) 80%, transparent);
  border-radius: 8px;
  background: color-mix(in srgb, var(--surface-2, #111827) 70%, transparent);
  list-style: none;
}
.pfr-need-row.is-selected {
  border-color: color-mix(in srgb, var(--accent, #c4a574) 50%, var(--line, #334));
  background: color-mix(in srgb, var(--accent, #c4a574) 12%, var(--surface-2, #111827));
}
.pfr-need-flight-row {
  width: 100%;
  box-sizing: border-box;
}
.pfr-need-select-hit {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
  font: inherit;
  -webkit-tap-highlight-color: transparent;
}
.pfr-need-select-hit:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--accent, #c4a574) 60%, transparent);
  outline-offset: 2px;
  border-radius: 6px;
}
.pfr-need-select {
  flex: 0 0 auto;
  width: 1rem;
  height: 1rem;
  margin-top: 0.15rem;
  border-radius: 999px;
  border: 2px solid color-mix(in srgb, var(--muted, #9aa6b8) 65%, transparent);
  background: transparent;
  box-sizing: border-box;
}
.pfr-need-row.is-selected .pfr-need-select {
  border-color: var(--accent, #c4a574);
  background: var(--accent, #c4a574);
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--surface, #0f172a) 88%, #000);
}
.pfr-need-select-hit .unit-record-subitem-main {
  flex: 1 1 auto;
  min-width: 0;
}
.pfr-need-row .unit-record-flight-actions {
  /* keep actions on their own row under meta on narrow phones */
  width: 100%;
}
@media (min-width: 560px) {
  .pfr-need-row .unit-record-flight-actions {
    width: auto;
  }
}
.pfr-home-card .pfr-home-block + .pfr-home-block {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
}
.pfr-home-card .pfr-home-block-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}
.pfr-home-card .pfr-home-block-head .kicker {
  margin: 0;
}
.pfr-home-card .pfr-home-block--history .pfr-queue {
  max-height: min(52vh, 420px);
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding-right: 2px;
}
.pfr-home-card .pfr-history-help {
  font-size: 0.9em;
}
.pfr-type-block {
  margin: 0 0 12px;
}
.pfr-type-block[hidden] {
  display: none !important;
}
.pfr-type-block > .section-hint {
  margin: 0 0 10px;
}
/* Type-choose popup after Designate */
.pfr-type-choose-host {
  position: fixed;
  inset: 0;
  z-index: 430;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(2, 6, 14, 0.72);
  backdrop-filter: blur(3px);
  padding: 16px;
  padding-top: max(16px, env(safe-area-inset-top, 0));
  padding-bottom: max(16px, env(safe-area-inset-bottom, 0));
  box-sizing: border-box;
}
.pfr-type-choose-host[hidden] {
  display: none !important;
}
.pfr-type-choose-panel {
  width: 100%;
  max-width: 420px;
  background: var(--surface, #0f172a);
  border: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
}
.pfr-type-choose-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 14px 10px;
  border-bottom: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
}
.pfr-type-choose-title {
  margin: 2px 0 0;
  font: 800 1.05rem/1.25 var(--font, system-ui, sans-serif);
  color: var(--ink);
}
.pfr-type-choose-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px 14px 16px;
}
.pfr-type-choose-opt {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  width: 100%;
  text-align: left;
  appearance: none;
  border: 1px solid color-mix(in srgb, var(--line) 85%, transparent);
  background: color-mix(in srgb, var(--surface-2, #1a1f2a) 85%, transparent);
  color: var(--ink);
  border-radius: 10px;
  padding: 12px 14px;
  cursor: pointer;
  font: inherit;
}
.pfr-type-choose-opt strong {
  font: 800 0.95rem/1.2 var(--font, system-ui, sans-serif);
}
.pfr-type-choose-opt span {
  font: 500 0.8rem/1.35 var(--font, system-ui, sans-serif);
  color: var(--muted);
}
.pfr-type-choose-opt:hover,
.pfr-type-choose-opt:focus-visible {
  border-color: color-mix(in srgb, var(--accent, #b8ad86) 50%, transparent);
  background: color-mix(in srgb, var(--accent, #b8ad86) 12%, var(--surface-2, #1a1f2a));
  outline: none;
}
html.pfr-type-choose-open,
html.pfr-type-choose-open body {
  overflow: hidden !important;
}
.pfr-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 0 0 10px;
  font: 600 0.82rem/1.3 var(--font, system-ui, sans-serif);
  color: var(--muted);
}
.pfr-field input,
.pfr-field select,
.pfr-field textarea {
  font: 600 0.95rem/1.35 var(--font, system-ui, sans-serif);
  color: var(--ink);
  background: var(--surface-2, #1a1f2a);
  border: 1px solid color-mix(in srgb, var(--line) 90%, transparent);
  border-radius: 8px;
  padding: 0.5rem 0.65rem;
}
.pfr-field.full {
  grid-column: 1 / -1;
}
.pfr-req {
  color: #f87171;
}
.pfr-fieldset {
  border: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
  border-radius: 10px;
  padding: 10px 12px 12px;
  margin: 0 0 14px;
}
.pfr-fieldset legend {
  padding: 0 6px;
  font: 750 0.8rem/1.2 var(--font, system-ui, sans-serif);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--accent, #b8ad86);
}
.pfr-check-grid,
.pfr-flight-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-height: 220px;
  overflow: auto;
}
.pfr-check,
.pfr-flight-opt {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font: 600 0.9rem/1.35 var(--font, system-ui, sans-serif);
  color: var(--ink);
  cursor: pointer;
  min-width: 0;
  flex: 1 1 auto;
}
.pfr-flight-opt-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  justify-content: space-between;
}
/* Admin review: only the flights locked on this report */
.pfr-flight-list--locked {
  max-height: none;
  gap: 8px;
}
.pfr-flight-locked {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid color-mix(in srgb, var(--brand, #3d6b4f) 35%, var(--border, #333));
  background: color-mix(in srgb, var(--brand, #3d6b4f) 12%, var(--surface-2, #1a1f2a));
  font: 600 0.9rem/1.35 var(--font, system-ui, sans-serif);
  color: var(--ink);
}
.pfr-flight-locked-label {
  flex: 1 1 auto;
  min-width: 0;
}
.pfr-flight-locked-mark {
  flex: 0 0 auto;
  width: 1.1rem;
  height: 1.1rem;
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  font-size: 0.7rem;
  font-weight: 800;
  color: #fff;
  background: var(--brand, #3d6b4f);
  line-height: 1;
}
.pfr-view-flight {
  flex: 0 0 auto;
  font-size: 0.82rem;
  font-weight: 700;
  white-space: nowrap;
}
.pfr-cert {
  margin: 12px 0 8px;
  padding: 10px;
  border-radius: 8px;
  background: color-mix(in srgb, var(--surface-2, #1a1f2a) 80%, transparent);
}
.pfr-yn-block {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0 0 14px;
}
.pfr-yn-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font: 600 0.88rem/1.3 var(--font, system-ui, sans-serif);
  color: var(--ink);
}
.pfr-seg {
  display: inline-flex;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--line) 90%, transparent);
}
.pfr-seg-btn {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--muted);
  font: 750 0.78rem/1 var(--font, system-ui, sans-serif);
  padding: 0.45rem 0.7rem;
  cursor: pointer;
}
.pfr-seg-btn + .pfr-seg-btn {
  border-left: 1px solid color-mix(in srgb, var(--line) 90%, transparent);
}
.pfr-seg-btn.is-active {
  background: color-mix(in srgb, var(--accent, #b8ad86) 28%, transparent);
  color: var(--ink);
}
/* Post-flight designation title on admin Flights unassigned */
.flight-col-designation {
  min-width: 7.5rem;
  max-width: 14rem;
  vertical-align: top;
}
.flight-designation-title {
  display: inline;
  font: 700 0.82rem/1.3 var(--font, system-ui, sans-serif);
  color: var(--ink);
}
.flight-row-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 4px;
}
.flight-pfr-chip {
  display: inline-flex;
  align-items: center;
  padding: 1px 7px;
  border-radius: 999px;
  font: 700 0.62rem/1.2 var(--font, system-ui, sans-serif);
  letter-spacing: 0.02em;
  text-transform: uppercase;
  background: color-mix(in srgb, var(--brand, #3d6b4f) 22%, var(--surface-2, #1a1f2a));
  color: color-mix(in srgb, var(--brand, #3d6b4f) 75%, #fff);
  border: 1px solid color-mix(in srgb, var(--brand, #3d6b4f) 40%, transparent);
}
.flight-pfr-chip--demo {
  background: color-mix(in srgb, #6b7a9a 30%, var(--surface-2, #1a1f2a));
  color: #c5d0e6;
  border-color: color-mix(in srgb, #6b7a9a 50%, transparent);
}
.flight-row-meta {
  display: block;
  margin-top: 2px;
}
.flight-row-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}
.flight-col-actions {
  white-space: nowrap;
  width: 1%;
}

.pfr-queue-card-chips {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.pfr-assign-chip {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  font: 700 0.65rem/1.2 var(--font, system-ui, sans-serif);
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.pfr-assign-chip--wait {
  background: color-mix(in srgb, #e6a23c 28%, var(--surface-2, #1a1f2a));
  color: #f0c674;
  border: 1px solid color-mix(in srgb, #e6a23c 55%, transparent);
}
.pfr-assign-chip--ok {
  background: color-mix(in srgb, var(--brand, #3d6b4f) 22%, var(--surface-2, #1a1f2a));
  color: color-mix(in srgb, var(--brand, #3d6b4f) 70%, #fff);
  border: 1px solid color-mix(in srgb, var(--brand, #3d6b4f) 45%, transparent);
}
.pfr-queue-card--await-assign {
  border-color: color-mix(in srgb, #e6a23c 45%, var(--border, #333));
}
.pfr-queue-card-hint {
  display: block;
  margin-top: 4px;
  font: 600 0.78rem/1.3 var(--font, system-ui, sans-serif);
  color: color-mix(in srgb, #e6a23c 80%, var(--muted, #999));
}
.pfr-queue-goto-flights {
  margin: 0 10px 10px;
  align-self: flex-start;
}
.pfr-queue {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.pfr-queue-card {
  display: flex;
  flex-direction: column;
  border: 1px solid color-mix(in srgb, var(--line) 85%, transparent);
  border-radius: 10px;
  background: color-mix(in srgb, var(--surface-2, #1a1f2a) 70%, transparent);
  overflow: hidden;
}
.pfr-queue-card-btn {
  width: 100%;
  text-align: left;
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  padding: 10px 12px;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.pfr-queue-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.pfr-queue-card-sub {
  font: 500 0.8rem/1.3 var(--font, system-ui, sans-serif);
  color: var(--muted);
}
.pfr-home-card {
  margin-bottom: 12px;
}
.pfr-home-card .pfr-home-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}
.pfr-btn-danger {
  color: #fca5a5 !important;
  border-color: color-mix(in srgb, #ef4444 50%, transparent) !important;
}
.pfr-demo-banner {
  margin-bottom: 10px;
}
.pfr-related-banner {
  margin-bottom: 12px;
}
.pfr-related-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.pfr-related-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font: 600 0.88rem/1.3 var(--font, system-ui, sans-serif);
}
.pfr-picker-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}
.pfr-picker-list {
  max-height: min(50vh, 360px);
}
.pfr-picker-line {
  font-weight: 650;
}
.pfr-inline-picker {
  border-top: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
  margin-top: 12px;
  padding-top: 4px;
}
.alert-info {
  background: color-mix(in srgb, #38bdf8 14%, transparent);
  border: 1px solid color-mix(in srgb, #38bdf8 40%, transparent);
  color: var(--ink, #e8edf5);
  border-radius: 10px;
  padding: 10px 12px;
}
.pfr-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.pfr-section-head h2,
.pfr-section-head h3 {
  margin: 0;
}

/* Soft off without full file restore: body.record-ui-v2 removed → base styles only */
