:root {
  color-scheme: dark;
  font-family: Manrope, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --midnight: #020a13;
  --navy: #06192b;
  --panel: #0a2540;
  --panel-deep: #071b2e;
  --line: #1b425f;
  --line-soft: #12334c;
  --gold: #d6ac48;
  --gold-light: #f4dea0;
  --ink: #f8f3e8;
  --muted: #aab8c5;
  --success: #73b9a0;
  --danger: #d66b6b;
  --sidebar: 268px;
}

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--midnight); }
body { margin: 0; min-height: 100vh; background: var(--midnight); color: var(--ink); }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.material-symbols-rounded { font-family: "Material Symbols Rounded"; font-weight: normal; font-style: normal; font-size: 21px; line-height: 1; letter-spacing: normal; text-transform: none; display: inline-block; white-space: nowrap; word-wrap: normal; direction: ltr; -webkit-font-feature-settings: "liga"; -webkit-font-smoothing: antialiased; font-feature-settings: "liga"; }
a { color: inherit; }
[hidden] { display: none !important; }
.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; }
.muted { color: var(--muted); }

.auth-loading { min-height: 100vh; display: grid; place-content: center; justify-items: center; gap: 11px; background: radial-gradient(circle at 50% 38%, rgba(23, 71, 105, .55), transparent 25%), var(--midnight); }
.auth-loading img { width: 116px; height: 116px; object-fit: contain; }
.auth-loading strong { color: var(--ink); font-size: 16px; letter-spacing: 5px; }
.auth-loading > span { width: 92px; height: 2px; margin: 12px 0 4px; overflow: hidden; background: var(--line-soft); }
.auth-loading > span::after { content: ""; width: 42%; height: 100%; display: block; background: linear-gradient(90deg, transparent, var(--gold), transparent); animation: auth-loading-progress 1.05s ease-in-out infinite; }
.auth-loading small { color: var(--gold); font-size: 8px; font-weight: 800; letter-spacing: 2px; }
@keyframes auth-loading-progress { from { transform: translateX(-110%); } to { transform: translateX(240%); } }

.login-view {
  min-height: 100vh;
  padding: clamp(28px, 5vw, 72px);
  background:
    radial-gradient(circle at 78% 12%, rgba(23, 71, 105, .56), transparent 32%),
    linear-gradient(135deg, #020a13 0%, #04111e 58%, #071c2f 100%);
}
.login-brand, .sidebar-brand { display: inline-flex; align-items: center; gap: 14px; text-decoration: none; }
.login-brand strong, .sidebar-brand strong { display: block; color: var(--ink); font-size: 13px; letter-spacing: 4px; }
.login-brand small, .sidebar-brand small { display: block; margin-top: 5px; color: var(--gold); font-size: 8px; letter-spacing: 2px; }
.login-brand img { width: 190px; max-height: 68px; object-fit: contain; object-position: left center; }
.login-layout { width: min(1180px, 100%); min-height: calc(100vh - 200px); margin: 48px auto 0; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(380px, .72fr); align-items: center; gap: clamp(48px, 8vw, 120px); }
.login-intro h1 { max-width: 700px; margin: 0 0 24px; font-size: clamp(56px, 7vw, 98px); line-height: .92; font-weight: 300; letter-spacing: -5px; }
.login-intro p:last-child { max-width: 620px; color: var(--muted); font-size: 18px; line-height: 1.65; }
.login-card { padding: clamp(28px, 4vw, 44px); box-shadow: 0 36px 90px #0009; }
.login-card h2 { margin-bottom: 12px; font-size: 34px; font-weight: 500; }
.login-card > p:not(.eyebrow):not(.message) { margin-bottom: 28px; color: var(--muted); line-height: 1.55; }
.login-help { width: 100%; margin-top: 8px; }
.field-help { display: block; margin-top: 6px; color: var(--muted); font-size: 11px; line-height: 1.5; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: var(--sidebar) minmax(0, 1fr); }
.sidebar { position: fixed; inset: 0 auto 0 0; z-index: 20; width: var(--sidebar); display: flex; flex-direction: column; padding: 24px 18px 18px; overflow-y: auto; border-right: 1px solid var(--line-soft); background: linear-gradient(180deg, #020a13 0%, #041424 100%); }
.sidebar-brand { min-height: 64px; padding: 0 10px 20px; border-bottom: 1px solid var(--line-soft); }
.sidebar-brand img { width: 178px; height: 52px; object-fit: contain; object-position: left center; }
.role-context { padding: 22px 10px 12px; }
.role-context > span { display: block; margin-bottom: 8px; color: var(--gold); font-size: 9px; font-weight: 800; letter-spacing: 1.5px; }
.role-context label { margin: 0 0 8px; }
.role-context select { min-height: 43px; }
.portal-nav { flex: 1; padding: 12px 0 24px; }
.portal-nav p { margin: 22px 12px 8px; color: #69839a; font-size: 9px; font-weight: 800; letter-spacing: 2px; text-transform: uppercase; }
.portal-nav button { position: relative; width: 100%; min-height: 46px; display: grid; grid-template-columns: 27px minmax(0, 1fr) auto; align-items: center; gap: 9px; padding: 0 13px; border: 0; border-left: 2px solid transparent; background: transparent; color: var(--muted); text-align: left; transition: .16s ease; }
.portal-nav button > em { font-style: normal; font-size: 13px; font-weight: 650; }
.portal-nav button:hover { color: var(--ink); background: #0c294233; }
.portal-nav button.active { border-left-color: var(--gold); background: linear-gradient(90deg, #d6ac4821, transparent); color: var(--gold-light); }
.portal-nav button b { min-width: 24px; height: 24px; display: inline-grid; place-items: center; padding: 0 7px; border: 1px solid var(--line); color: var(--gold-light); font-size: 10px; }
.sidebar-footer { padding: 18px 10px 0; border-top: 1px solid var(--line-soft); }
.signed-in { margin-bottom: 12px; display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 10px; }
.signed-in > span { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--gold); color: var(--gold-light); font-size: 10px; font-weight: 800; }
.signed-in strong, .signed-in small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.signed-in strong { margin-bottom: 4px; font-size: 13px; }
.signed-in small { color: var(--muted); font-size: 11px; }
.sidebar-footer .text-button { padding-left: 0; }

.workspace { grid-column: 2; min-width: 0; }
.workspace-header { position: sticky; top: 0; z-index: 15; min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 14px clamp(24px, 4vw, 54px); border-bottom: 1px solid var(--line-soft); background: rgba(2, 10, 19, .88); backdrop-filter: blur(22px); }
.workspace-header h1 { margin: 2px 0 0; font-size: 24px; font-weight: 500; letter-spacing: -.6px; }
.header-actions { display: flex; align-items: center; gap: 15px; }
.header-date { color: var(--muted); font-size: 12px; }
.menu-toggle { display: none !important; }
.page { width: min(1440px, 100%); margin: 0 auto; padding: clamp(28px, 4vw, 56px); }

.eyebrow { margin: 0 0 10px; color: var(--gold); font-size: 10px; font-weight: 800; letter-spacing: 2.4px; text-transform: uppercase; }
h1, h2, h3, p { margin-top: 0; }
h2 { margin-bottom: 6px; font-size: 25px; font-weight: 550; letter-spacing: -.5px; }
h3 { margin-bottom: 6px; }
.hero { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; margin-bottom: 32px; }
.hero h1 { margin: 0; max-width: 820px; font-size: clamp(42px, 5vw, 72px); line-height: .98; font-weight: 300; letter-spacing: -3px; }
.hero-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
.page-description { max-width: 720px; margin: 0; color: var(--muted); line-height: 1.55; }
.page-tools { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; margin-bottom: 24px; }
.page-tools .page-description { flex: 1; }
.range-chip { padding: 11px 14px; border: 1px solid var(--line); color: var(--gold-light); font-size: 12px; }

.panel { border: 1px solid var(--line); background: linear-gradient(145deg, rgba(11, 41, 70, .98), rgba(6, 25, 43, .98)); box-shadow: 0 22px 55px rgba(0, 0, 0, .2); }
.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 24px; }
.metric-grid.compact { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.metric { min-height: 134px; padding: 21px; display: flex; flex-direction: column; justify-content: space-between; }
.metric span { color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase; }
.metric strong { font-size: clamp(29px, 3vw, 42px); font-weight: 400; letter-spacing: -1.5px; }
.two-column { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(310px, .65fr); gap: 20px; }
.two-column > .panel, .settings-grid > .panel { padding: 25px; }
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 18px; }
.section-heading p:last-child { margin-bottom: 0; }

.trip-row, .action-item { display: grid; align-items: center; gap: 14px; padding: 16px 0; border-top: 1px solid var(--line-soft); }
.trip-row, .action-item { width: 100%; border-right: 0; border-bottom: 0; border-left: 0; background: transparent; color: var(--ink); text-align: left; }
.trip-row { grid-template-columns: 5px minmax(0, 1fr) auto; }
.trip-row > span:first-child { width: 5px; height: 38px; background: var(--trip-color, var(--gold)); }
.trip-row:first-of-type, .action-item:first-of-type { border-top: 0; }
.trip-row strong, .action-item strong { display: block; margin-bottom: 4px; }
.trip-row small, .action-item small { color: var(--muted); }
.action-item { grid-template-columns: 32px minmax(0, 1fr); }

.primary, .secondary, .quiet, .icon-button, .text-button, .row-button { border-radius: 0; transition: .16s ease; }
.primary { min-height: 46px; padding: 0 20px; border: 1px solid var(--gold-light); background: linear-gradient(105deg, #ead080, var(--gold), #a97922); color: var(--midnight); font-weight: 800; letter-spacing: .3px; }
.primary:hover { filter: brightness(1.07); box-shadow: 0 8px 26px #d6ac4830; }
.secondary, .quiet { min-height: 44px; padding: 0 17px; border: 1px solid var(--line); background: transparent; color: var(--gold-light); font-weight: 700; }
.secondary:hover, .quiet:hover { border-color: var(--gold); background: #d6ac480e; }
.wide { width: 100%; }
.text-button { min-height: 38px; padding: 0 10px; border: 0; background: transparent; color: var(--gold-light); font-weight: 700; }
.text-button:hover { color: var(--ink); }
.icon-button { width: 42px; height: 42px; display: inline-grid; place-items: center; border: 1px solid var(--line); background: var(--midnight); color: var(--gold-light); font-size: 20px; }
.icon-button:hover { border-color: var(--gold); }
.row-button { min-height: 32px; padding: 0 11px; border: 1px solid var(--line); background: transparent; color: var(--gold-light); font-size: 11px; font-weight: 700; }
.row-button { white-space: nowrap; }
.row-button:hover { border-color: var(--gold); }

.segmented { display: inline-flex; flex-wrap: wrap; border: 1px solid var(--line); }
.segmented button { min-height: 43px; padding: 0 18px; border: 0; border-right: 1px solid var(--line); background: transparent; color: var(--muted); font-weight: 700; }
.segmented button:last-child { border-right: 0; }
.segmented button.active { background: var(--gold); color: var(--midnight); }

.table-panel { overflow: hidden; }
.table-scroll { overflow: auto; }
table { width: 100%; min-width: 760px; border-collapse: collapse; }
th, td { padding: 15px 17px; border-bottom: 1px solid var(--line-soft); text-align: left; }
th { position: sticky; top: 0; z-index: 1; background: #041321; color: var(--gold); font-size: 9px; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase; }
td { color: var(--muted); font-size: 13px; }
td strong { color: var(--ink); }
td strong, td small { display: block; }
td small { margin-top: 4px; color: var(--muted); }
tr:last-child td { border-bottom: 0; }
tr.clickable { cursor: pointer; }
tr.clickable:hover td { background: rgba(214, 172, 72, .055); }
.trip-table-row { cursor: pointer; outline: 0; }
.trip-table-row td { transition: background-color .16s ease, color .16s ease; }
.trip-table-row:hover td { background: rgba(214, 172, 72, .075); color: var(--ink); }
.trip-table-row:active td { background: rgba(214, 172, 72, .12); }
.trip-table-row:focus-visible td { background: rgba(214, 172, 72, .075); box-shadow: inset 0 2px var(--gold), inset 0 -2px var(--gold); }
.trip-table-row:focus-visible td:first-child { box-shadow: inset 2px 0 var(--gold), inset 0 2px var(--gold), inset 0 -2px var(--gold); }
.trip-table-row:focus-visible td:last-child { box-shadow: inset -2px 0 var(--gold), inset 0 2px var(--gold), inset 0 -2px var(--gold); }
.number { text-align: right; }
.status { display: inline-flex; align-items: center; min-height: 26px; padding: 0 9px; border: 1px solid var(--line); color: var(--gold-light); font-size: 9px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; white-space: nowrap; }
.status-scheduled, .status-accepted, .status-matched, .status-complete, .status-completed { border-color: #437d6d; color: #91d3bc; }
.status-canceled, .status-cancelled, .status-disputed { border-color: #77434c; color: #ec929c; }
.status-pending, .status-planning, .status-review { border-color: #8b6d2d; color: var(--gold-light); }

.calendar-toolbar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.calendar-toolbar > div { display: flex; gap: 8px; }
.calendar-toolbar h2 { margin: 0; font-size: 30px; }
.calendar-key { min-height: 48px; display: flex; align-items: center; gap: 18px; margin: -8px 0 12px; padding: 10px 14px; border: 1px solid var(--line-soft); background: rgba(2, 10, 19, .36); }
.calendar-key > strong { flex: none; color: var(--gold); font-size: 8px; font-weight: 800; letter-spacing: 1.4px; text-transform: uppercase; }
.calendar-key > div { display: flex; align-items: center; flex-wrap: wrap; gap: 9px 18px; }
.calendar-key span { display: grid; grid-template-columns: 11px auto auto; align-items: center; gap: 6px; white-space: nowrap; }
.calendar-key i { width: 10px; height: 10px; display: block; border: 1px solid rgba(255,255,255,.3); background: var(--aircraft-key-color, var(--gold)); }
.calendar-key b { color: var(--ink); font-size: 10px; }
.calendar-key small { color: var(--muted); font-size: 9px; }
.calendar { padding: 20px; overflow-x: auto; }
.weekdays, .calendar-week-days, .calendar-week-trips { min-width: 800px; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.weekdays span { padding: 10px; color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase; }
.calendar-weeks { min-width: 800px; }
.calendar-week { position: relative; min-height: calc(70px + var(--trip-lanes) * 32px); }
.calendar-week-days { position: absolute; inset: 0; }
.calendar-week-trips { position: absolute; z-index: 2; top: 43px; left: 0; right: 0; grid-auto-rows: 28px; row-gap: 4px; padding: 0 3px; pointer-events: none; }
.calendar-day { min-height: 100%; padding: 10px; border-top: 1px solid var(--line-soft); border-left: 1px solid var(--line-soft); }
.calendar-day.bookable { cursor: pointer; transition: background .16s ease, box-shadow .16s ease; }
.calendar-day.bookable:hover { background: rgba(214, 172, 72, .07); box-shadow: inset 0 0 0 1px rgba(214, 172, 72, .42); }
.calendar-day.bookable:focus-visible { position: relative; z-index: 1; outline: 2px solid var(--gold-light); outline-offset: -2px; }
.calendar-day:last-child { border-right: 1px solid var(--line-soft); }
.calendar-week.last-week .calendar-day { border-bottom: 1px solid var(--line-soft); }
.calendar-day.outside { opacity: .35; }
.calendar-day.today > span { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: var(--gold); color: var(--midnight); font-weight: 800; }
.calendar-day > span { display: block; margin-bottom: 8px; font-size: 12px; }
.calendar-trip-bar { min-width: 0; height: 28px; grid-column: var(--trip-column) / var(--trip-column-end); grid-row: var(--trip-lane); display: flex; align-items: center; gap: 7px; margin: 0 2px; padding: 0 12px; overflow: hidden; border: 0; border-radius: 999px; background: var(--trip-color, var(--gold)); color: var(--trip-ink, var(--midnight)); box-shadow: inset 0 0 0 1px rgba(255,255,255,.3), 0 3px 9px rgba(0,0,0,.28); pointer-events: auto; text-align: left; white-space: nowrap; transition: filter .16s ease, transform .16s ease; }
.calendar-trip-bar:hover { filter: brightness(1.12) saturate(1.08); transform: translateY(-1px); }
.calendar-trip-bar:focus-visible { z-index: 2; outline: 2px solid var(--ink); outline-offset: 1px; }
.calendar-trip-bar strong, .calendar-trip-bar small { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.calendar-trip-bar strong { font-size: 10px; }
.calendar-trip-bar small { flex: none; margin-left: auto; color: currentColor; font-size: 8px; font-weight: 800; opacity: .82; }
.calendar-add-button { position: fixed; right: 38px; bottom: 38px; z-index: 12; width: 62px; height: 62px; display: grid; place-items: center; border: 1px solid var(--gold-light); border-radius: 50%; background: linear-gradient(145deg, #f4dea0, var(--gold) 58%, #a97922); color: var(--midnight); box-shadow: 0 14px 38px rgba(0, 0, 0, .45), 0 0 24px rgba(214, 172, 72, .24); transition: transform .16s ease, filter .16s ease, box-shadow .16s ease; }
.calendar-add-button:hover { filter: brightness(1.08); transform: translateY(-2px); box-shadow: 0 18px 44px rgba(0, 0, 0, .5), 0 0 30px rgba(214, 172, 72, .34); }
.calendar-add-button:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.calendar-add-button .material-symbols-rounded { font-size: 30px; font-weight: 400; }

.import-layout { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.import-layout > .panel { padding: 25px; }
.drop-zone { min-height: 210px; padding: 28px; border: 1px dashed #55718a; background: rgba(2, 10, 19, .65); display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; cursor: pointer; transition: .18s ease; }
.drop-zone:hover { border-color: var(--gold); background: #0d2b45; }
.drop-zone input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.drop-zone strong { margin: 9px 0 5px; font-size: 17px; }
.drop-zone small { color: var(--muted); }
.file-summary { margin-top: 16px; padding: 14px; border-left: 3px solid var(--gold); background: rgba(2, 10, 19, .65); color: var(--muted); line-height: 1.6; }
.file-summary strong { color: var(--ink); }
.mapping-list { display: grid; gap: 10px; margin: 18px 0; }
.mapping-list > div { display: grid; grid-template-columns: 88px minmax(0, 1fr); align-items: center; gap: 12px; padding: 12px; border: 1px solid var(--line-soft); }
.mapping-list strong { color: var(--gold-light); }
.empty-panel, .empty-state { padding: 34px; color: var(--muted); text-align: center; }
.history-list { display: grid; gap: 8px; }
.history-list > div { min-height: 64px; padding: 13px 15px; display: grid; grid-template-columns: 10px minmax(0, 1fr) auto; align-items: center; gap: 13px; border: 1px solid var(--line-soft); background: var(--panel-deep); }
.history-list small { display: block; margin-top: 3px; color: var(--muted); }
.status-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--success); }

.people-grid, .aircraft-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.person-card, .aircraft-card { padding: 22px; }
.aircraft-card { display: flex; flex-direction: column; }
.aircraft-card > button:last-child { margin-top: auto; }
.person-card { width: 100%; display: grid; grid-template-columns: 48px minmax(0, 1fr); align-items: center; gap: 14px; color: var(--ink); text-align: left; }
.person-card > span { width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid var(--gold); color: var(--gold-light); font-weight: 800; }
.person-card small, .person-card em { display: block; color: var(--muted); font-size: 11px; font-style: normal; }
.person-card em { margin-top: 10px; color: var(--success); }
.person-card em.pending { color: #f0c86e; }
.welcome-note { padding: 16px; display: grid; grid-template-columns: 38px minmax(0,1fr); gap: 13px; border: 1px solid var(--line); background: rgba(214,172,72,.06); }
.welcome-note > span { color: var(--gold-light); font-size: 29px; }
.welcome-note strong { color: var(--ink); }
.welcome-note p { margin: 5px 0 0; color: var(--muted); font-size: 12px; line-height: 1.55; }
.account-summary { padding: 15px; border: 1px solid var(--line); background: var(--midnight); }
.account-summary span, .account-summary strong, .account-summary small { display: block; }
.account-summary span { color: var(--gold); font-size: 9px; font-weight: 800; letter-spacing: 1.4px; }
.account-summary strong { margin-top: 6px; color: var(--ink); }
.account-summary small { margin-top: 4px; color: var(--muted); }
.person-card h3, .aircraft-card h3 { margin: 0 0 5px; font-size: 21px; }
.person-card > p, .aircraft-card > p { color: var(--muted); }
.person-card .secondary { margin-top: 12px; }
.aircraft-card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.aircraft-card-top > span { color: var(--gold-light); font-size: 11px; font-weight: 800; white-space: nowrap; }
.aircraft-card dl { margin: 18px 0 0; }
.aircraft-card dl > div { display: flex; justify-content: space-between; gap: 16px; padding: 9px 0; border-top: 1px solid var(--line-soft); color: var(--muted); font-size: 12px; }
.aircraft-card dt, .aircraft-card dd { margin: 0; }
.aircraft-card dd { color: var(--ink); }
.rate-list { display: grid; gap: 8px; margin: 19px 0; }
.rate-list > div { display: flex; justify-content: space-between; gap: 15px; padding-top: 8px; border-top: 1px solid var(--line-soft); color: var(--muted); font-size: 12px; }
.rate-list strong { color: var(--ink); }
.settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.detail-list, .permission-list { display: grid; gap: 0; margin-top: 18px; }
.detail-list > div, .permission-list > div { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 12px 0; border-top: 1px solid var(--line-soft); color: var(--muted); font-size: 13px; }
.detail-list strong { color: var(--ink); text-align: right; }
.permission-list span:last-child { color: var(--success); }
.permission-list > span { padding: 10px 0; border-top: 1px solid var(--line-soft); color: var(--success); font-size: 13px; }

label:not(.drop-zone):not(.check) { display: block; margin: 0 0 8px; color: var(--gold); font-size: 9px; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase; }
input, select, textarea { width: 100%; min-height: 48px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 2px; background-color: var(--midnight); color: var(--ink); font-size: 17px; font-weight: 600; }
select { appearance: none; -webkit-appearance: none; padding-right: 42px; background-image: linear-gradient(45deg, transparent 50%, var(--gold-light) 50%), linear-gradient(135deg, var(--gold-light) 50%, transparent 50%), linear-gradient(to left, var(--line), var(--line)); background-position: calc(100% - 18px) 21px, calc(100% - 13px) 21px, calc(100% - 40px) 0; background-size: 5px 5px, 5px 5px, 1px 100%; background-repeat: no-repeat; }
select:hover { border-color: #38647f; }
select option { background: #071727; color: var(--ink); }
.portal-select { position: relative; width: 100%; min-width: 0; color: var(--ink); font-size: 13px; font-weight: 600; letter-spacing: normal; text-transform: none; }
.portal-select.open { z-index: 30; }
.portal-native-select { position: absolute !important; top: 0; left: 0; width: 1px !important; height: 1px !important; min-height: 1px !important; padding: 0 !important; overflow: hidden; border: 0 !important; opacity: 0; pointer-events: none; }
.portal-select-trigger { width: 100%; min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 13px; border: 1px solid var(--line); border-radius: 2px; background: var(--midnight); color: var(--ink); text-align: left; font-size: 16px; font-weight: 650; }
.portal-select-trigger:hover, .portal-select.open .portal-select-trigger { border-color: var(--gold); }
.portal-select-trigger:focus-visible { outline: 1px solid var(--gold); outline-offset: 1px; }
.portal-select-value { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portal-select-trigger > .material-symbols-rounded { flex: none; color: var(--gold-light); font-size: 19px; transition: transform .16s ease; }
.portal-select.open .portal-select-trigger > .material-symbols-rounded { transform: rotate(180deg); }
.portal-select-menu { position: absolute; z-index: 31; top: calc(100% + 6px); left: 0; right: 0; max-height: 260px; padding: 6px; overflow: auto; border: 1px solid var(--gold); background: #06192b; box-shadow: 0 18px 50px #000b; }
.portal-select-menu button { width: 100%; min-height: 42px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 10px; border: 0; border-bottom: 1px solid var(--line-soft); background: transparent; color: var(--ink); text-align: left; font-size: 13px; }
.portal-select-menu button:last-child { border-bottom: 0; }
.portal-select-menu button:hover:not(:disabled), .portal-select-menu button[aria-selected="true"] { background: rgba(214, 172, 72, .11); color: var(--gold-light); }
.portal-select-menu button:disabled { color: #50677a; cursor: not-allowed; }
.portal-select-menu .material-symbols-rounded { flex: none; color: var(--gold); font-size: 18px; }
.role-context .portal-select-trigger { min-height: 43px; font-size: 13px; }
textarea { min-height: 100px; resize: vertical; }
input:focus, select:focus, textarea:focus { outline: 1px solid var(--gold); border-color: var(--gold); }
input::placeholder, textarea::placeholder { color: #71899d; font-weight: 500; }
#preferences-form input::placeholder, #preferences-form textarea::placeholder { color: #60768a; font-weight: 400; }
fieldset { margin: 0; padding: 0; border: 0; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.form-grid > div, .form-grid > fieldset { min-width: 0; }
.form-grid .full, .full { grid-column: 1 / -1; }
.check { min-height: 42px; display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: 13px; }
.check input { width: 18px; min-height: 18px; accent-color: var(--gold); }
.inline-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: end; }
.message { min-height: 20px; margin: 13px 0 0; color: var(--gold-light); line-height: 1.45; }
.message.error { color: var(--danger); }
.message.success { color: var(--success); }

.modal-backdrop { position: fixed; inset: 0; z-index: 50; display: grid; place-items: center; padding: 22px; background: rgba(0, 5, 10, .48); backdrop-filter: blur(2px); }
.modal { width: min(760px, 100%); max-height: min(88vh, 920px); overflow: auto; border: 1px solid var(--line); background: rgba(6, 25, 43, .98); box-shadow: 0 28px 90px #000a; }
.modal > header { position: sticky; top: 0; z-index: 2; min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 18px 22px; border-bottom: 1px solid var(--line); background: rgba(6, 25, 43, .96); backdrop-filter: blur(16px); }
.modal > header h2 { margin: 0; }
.modal-body { padding: 24px; }
.modal-summary { margin-bottom: 22px; padding: 18px; border: 1px solid var(--line-soft); background: var(--midnight); }
.modal-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.modal-summary span, .modal-summary strong { display: block; }
.modal-summary span { margin-bottom: 6px; color: var(--gold); font-size: 9px; font-weight: 800; letter-spacing: 1.2px; }
.modal-summary strong { font-size: 13px; }
.modal-section { padding: 20px 0; border-top: 1px solid var(--line-soft); }
.modal-section:first-child { padding-top: 0; border-top: 0; }
.modal-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.booking-modal-open .modal { width: min(1040px, 100%); max-height: min(92vh, 960px); }
.booking-modal-open .modal > header { min-height: 68px; padding-block: 14px; }
.booking-modal-open .modal-body { padding: 18px; }
.booking-form { display: grid; gap: 12px; }
.booking-form label:not(.check) { margin-bottom: 0; }
.booking-form legend { margin-bottom: 6px; }
.booking-form label:not(.check) > input, .booking-form label:not(.check) > textarea { display: block; margin-top: 6px; }
.booking-primary-grid { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(260px, .8fr); gap: 12px; }
.booking-section { padding: 13px 15px 15px; border: 1px solid var(--line-soft); background: rgba(2, 10, 19, .28); }
.booking-section-heading { display: flex; align-items: center; gap: 10px; margin-bottom: 11px; }
.booking-section-heading > .material-symbols-rounded { color: var(--gold); font-size: 21px; }
.booking-section-heading strong, .booking-section-heading small { display: block; }
.booking-section-heading strong { color: var(--ink); font-size: 13px; }
.booking-section-heading small { margin-top: 2px; color: var(--muted); font-size: 10px; }
.booking-schedule-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.booking-picker-field > label, .booking-select > label, .airport-search-field > label { display: block; margin-bottom: 6px !important; color: var(--gold); font-size: 8px; font-weight: 800; letter-spacing: 1.25px; }
.booking-picker-trigger, .booking-select-trigger { width: 100%; min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 13px; border: 1px solid var(--line); background: var(--midnight); color: var(--ink); text-align: left; font-size: 16px; font-weight: 650; }
.booking-picker-trigger:hover, .booking-select-trigger:hover { border-color: var(--gold); }
.booking-picker-trigger .material-symbols-rounded, .booking-select-trigger .material-symbols-rounded { flex: none; color: var(--gold-light); font-size: 19px; }
.booking-select { position: relative; min-width: 0; }
.booking-options { position: absolute; z-index: 9; top: calc(100% + 6px); left: 0; right: 0; max-height: 245px; padding: 6px; overflow: auto; border: 1px solid var(--gold); background: #06192b; box-shadow: 0 18px 50px #000b; }
.booking-options button { width: 100%; min-height: 42px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 10px; border: 0; border-bottom: 1px solid var(--line-soft); background: transparent; color: var(--ink); text-align: left; font-size: 13px; }
.booking-options button:last-child { border-bottom: 0; }
.booking-options button:hover, .booking-options button[aria-selected="true"] { background: rgba(214, 172, 72, .11); color: var(--gold-light); }
.booking-options .material-symbols-rounded { color: var(--gold); font-size: 18px; }
.booking-route-grid { display: grid; grid-template-columns: minmax(0, 1fr) 34px minmax(0, 1fr); align-items: end; gap: 8px; }
.route-arrow { height: 48px; display: grid; place-items: center; color: var(--gold); }
.airport-search-field { position: relative; min-width: 0; }
.airport-input-shell { min-height: 48px; display: grid; grid-template-columns: 26px minmax(0, 1fr) 24px; align-items: center; padding: 0 10px; border: 1px solid var(--line); background: var(--midnight); }
.airport-input-shell:focus-within { border-color: var(--gold); outline: 1px solid var(--gold); }
.airport-input-shell > .material-symbols-rounded { color: var(--gold-light); font-size: 19px; }
.airport-input-shell input { min-height: 46px; padding: 9px 6px; border: 0; outline: 0; background: transparent; }
.airport-search-status { color: #577188 !important; }
.airport-results { position: absolute; z-index: 10; top: calc(100% + 6px); left: 0; right: 0; max-height: 260px; padding: 5px; overflow: auto; border: 1px solid var(--gold); background: #06192b; box-shadow: 0 20px 55px #000c; }
.airport-results button { width: 100%; min-height: 56px; display: grid; grid-template-columns: 55px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 8px 10px; border: 0; border-bottom: 1px solid var(--line-soft); background: transparent; color: var(--ink); text-align: left; }
.airport-results button:last-child { border-bottom: 0; }
.airport-results button:hover { background: rgba(214, 172, 72, .1); }
.airport-results button > strong { color: var(--gold-light); font-size: 15px; }
.airport-results button b, .airport-results button small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.airport-results button b { font-size: 12px; }
.airport-results button small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.airport-results button em { color: var(--muted); font-size: 10px; font-style: normal; white-space: nowrap; }
.airport-result-status { padding: 16px; display: flex; align-items: center; justify-content: center; gap: 8px; color: var(--muted); font-size: 12px; }
.airport-result-status.error { color: var(--danger); }
.booking-traveler-grid { display: grid; grid-template-columns: 135px minmax(0, 1fr); align-items: end; gap: 12px; }
.partner-choice-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; }
.compact-choice { min-height: 48px; padding: 0 10px; border: 1px solid var(--line); background: var(--midnight); color: var(--ink); }
.compact-choice:has(input:checked) { border-color: var(--gold); background: rgba(214, 172, 72, .08); }
.compact-choice span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.booking-more { border: 1px solid var(--line-soft); background: rgba(2, 10, 19, .22); }
.booking-more summary { min-height: 54px; display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 10px 15px; cursor: pointer; list-style: none; }
.booking-more summary::-webkit-details-marker { display: none; }
.booking-more summary strong, .booking-more summary small { display: block; }
.booking-more summary strong { color: var(--ink); font-size: 12px; }
.booking-more summary small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.booking-more summary > .material-symbols-rounded { color: var(--gold-light); transition: transform .16s ease; }
.booking-more[open] summary > .material-symbols-rounded { transform: rotate(180deg); }
.booking-more-content { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 15px; border-top: 1px solid var(--line-soft); }
.booking-more textarea { min-height: 72px; }
.booking-arrangements { display: grid; grid-template-columns: minmax(230px, .8fr) minmax(0, 1.2fr); gap: 10px; }
.compact-choice-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; align-items: end; }
.booking-footer { min-height: 54px; display: flex; align-items: center; justify-content: flex-end; gap: 15px; }
.booking-footer .message { flex: 1; min-height: 0; margin: 0; }
.booking-footer .primary { min-width: 190px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; }
.booking-footer .primary[aria-busy="true"] { cursor: wait; filter: none; opacity: .92; }
.booking-submit-spinner { animation: booking-submit-spin .8s linear infinite; }
@keyframes booking-submit-spin { to { transform: rotate(360deg); } }
.booking-picker-layer { position: fixed; inset: 0; z-index: 80; }
.booking-picker-scrim { position: absolute; inset: 0; width: 100%; border: 0; background: rgba(0, 5, 10, .14); }
.booking-picker-panel { position: fixed; z-index: 1; padding: 15px; border: 1px solid var(--gold); background: #06192b; box-shadow: 0 24px 70px #000d; }
.booking-picker-header { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px solid var(--line-soft); }
.booking-picker-header small, .booking-picker-header strong { display: block; }
.booking-picker-header small { margin-bottom: 4px; color: var(--gold); font-size: 8px; font-weight: 800; letter-spacing: 1.4px; }
.booking-picker-header strong { font-size: 17px; }
.booking-picker-header .icon-button { width: 36px; height: 36px; }
.booking-range-summary { display: grid; grid-template-columns: minmax(0, 1fr) 20px minmax(0, 1fr); align-items: center; gap: 7px; margin-bottom: 12px; }
.booking-range-summary > .material-symbols-rounded { color: var(--gold); font-size: 16px; text-align: center; }
.booking-range-date { min-width: 0; padding: 8px 9px; border: 1px solid var(--line); background: rgba(2, 10, 19, .45); }
.booking-range-date.active { border-color: var(--gold); background: rgba(214, 172, 72, .1); }
.booking-range-date small, .booking-range-date strong { display: block; }
.booking-range-date small { margin-bottom: 3px; color: var(--gold); font-size: 7px; font-weight: 800; letter-spacing: 1.2px; }
.booking-range-date strong { overflow: hidden; color: var(--ink); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.booking-range-summary em { grid-column: 1 / -1; color: var(--gold-light); font-size: 8px; font-style: normal; font-weight: 800; letter-spacing: 1.2px; text-align: center; }
.booking-month-nav { display: grid; grid-template-columns: 36px minmax(0, 1fr) 36px; align-items: center; gap: 8px; margin-bottom: 8px; text-align: center; }
.booking-month-nav .icon-button { width: 36px; height: 36px; }
.booking-picker-weekdays, .booking-picker-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 3px; }
.booking-picker-weekdays span { padding: 5px 0; color: var(--muted); font-size: 9px; font-weight: 800; text-align: center; }
.booking-picker-days button { aspect-ratio: 1; border: 1px solid transparent; background: transparent; color: var(--ink); font-size: 12px; }
.booking-picker-days button:hover:not(:disabled) { border-color: var(--gold); background: rgba(214, 172, 72, .08); }
.booking-picker-days button.outside { color: #587186; }
.booking-picker-days button.today { border-color: var(--line); }
.booking-picker-days button.in-range { border-color: rgba(214, 172, 72, .16); background: rgba(214, 172, 72, .12); color: var(--gold-light); }
.booking-picker-days button.range-start, .booking-picker-days button.range-end { border-color: var(--gold-light); background: var(--gold); color: var(--midnight); font-weight: 800; }
.booking-picker-days button.selected { box-shadow: inset 0 0 0 2px rgba(255, 242, 197, .72); }
.booking-picker-days button.range-start.outside, .booking-picker-days button.range-end.outside { color: var(--midnight); }
.booking-picker-days button:disabled { color: #405267; cursor: not-allowed; }
.booking-time-grid { max-height: 330px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; overflow: auto; }
.booking-time-grid button { min-height: 40px; border: 1px solid var(--line-soft); background: var(--midnight); color: var(--muted); font-size: 12px; }
.booking-time-grid button:hover, .booking-time-grid button.selected { border-color: var(--gold); color: var(--ink); }
.booking-time-grid button.selected { background: rgba(214, 172, 72, .13); color: var(--gold-light); }
.leg-row { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: 13px; padding: 13px 0; border-top: 1px solid var(--line-soft); }
.leg-row > span:first-child { width: 34px; height: 34px; display: grid; place-items: center; background: var(--gold); color: var(--midnight); font-weight: 800; }
.expense-amount { font-size: 28px; font-weight: 500; }
.invoice-summary { display: grid; grid-template-columns: minmax(180px, .7fr) minmax(0, 1.3fr); align-items: end; gap: 24px; padding-bottom: 22px; border-bottom: 1px solid var(--line-soft); }
.invoice-total { margin-bottom: 0; font-size: 44px; font-weight: 300; letter-spacing: -2px; }
.invoice-meta { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; align-items: center; }
.invoice-meta > span:not(.status) { color: var(--ink); font-size: 12px; font-weight: 700; }
.invoice-meta small { display: block; margin-bottom: 5px; color: var(--muted); font-size: 8px; letter-spacing: 1.1px; }
.invoice-lines { margin-bottom: 20px; }
.invoice-lines > div { display: flex; justify-content: space-between; gap: 20px; padding: 12px 0; border-bottom: 1px solid var(--line-soft); color: var(--muted); }
.invoice-lines span small { display: block; margin-top: 4px; font-size: 10px; }
.rate-editor-heading { min-height: 46px; display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 10px; }
.rate-editor-heading p { margin: 0; }
.rate-editor-heading .secondary { min-height: 38px; padding: 0 13px; }
#aircraft-rate-list { display: grid; gap: 10px; }
.rate-editor { display: grid; grid-template-columns: minmax(0, 1fr) 140px 46px; align-items: center; gap: 10px; }
.rate-editor .rate-remove { width: 46px; height: 46px; border-color: #81454c; color: #ef8c96; }
.rate-editor .rate-remove:hover { border-color: var(--danger); background: rgba(129,69,76,.2); }
.rate-empty { margin: 0; padding: 16px; border: 1px dashed var(--line); color: var(--muted); text-align: center; }

.toast { position: fixed; right: 24px; bottom: 24px; z-index: 80; max-width: 380px; padding: 14px 18px; border: 1px solid var(--gold); background: #071b2e; color: var(--ink); box-shadow: 0 18px 48px #0009; }
.loading-state { min-height: 420px; display: grid; place-items: center; color: var(--muted); }

.tool-actions, .icon-label { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.tool-actions { flex-wrap: wrap; }
.icon-label b { min-width: 21px; height: 21px; padding: 0 5px; display: inline-grid; place-items: center; background: var(--gold); color: var(--midnight); font-size: 9px; }
.filter-panel { margin: -8px 0 22px; padding: 18px; }
.filter-toggle.active { border-color: var(--gold-light); background: var(--gold); color: var(--midnight); }
.filter-toggle.active b { background: var(--midnight); color: var(--gold-light); }
.filter-panel-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 17px; }
.filter-panel-header p { margin-bottom: 4px; }
.filter-panel-header span { color: var(--muted); font-size: 11px; }
.filter-choice-groups { display: grid; gap: 16px; }
.filter-choice-group { min-width: 0; }
.filter-choice-group h3 { margin: 0 0 8px; color: var(--gold); font-size: 9px; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase; }
.filter-choices { display: flex; flex-wrap: wrap; gap: 8px; }
.filter-choice { min-height: 36px; padding: 0 13px; border: 1px solid var(--line); background: var(--midnight); color: var(--muted); font-size: 11px; font-weight: 650; transition: border-color .16s ease, background-color .16s ease, color .16s ease; }
.filter-choice:hover { border-color: var(--gold); color: var(--ink); }
.filter-choice.active { border-color: var(--gold); background: var(--panel); color: var(--gold-light); box-shadow: inset 0 0 0 1px rgba(214, 172, 72, .08); }
.filter-choice:focus-visible { outline: 2px solid var(--gold-light); outline-offset: 2px; }
.result-summary { min-height: 32px; display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; color: var(--muted); font-size: 12px; }
.calendar-tools { align-items: center; }
.calendar-tools .calendar-toolbar { flex: 1; margin: 0; justify-content: flex-start; gap: 15px; }
.calendar-tools .calendar-toolbar h2 { min-width: 210px; text-align: center; }
.more-link { margin: -4px auto 0; min-height: 40px; display: flex; align-items: center; gap: 4px; border: 0; background: transparent; color: var(--gold-light); font-weight: 750; }

.trip-hero { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin: -4px 0 20px; }
.trip-hero h3 { margin: 0 0 7px; font-size: 34px; font-weight: 400; letter-spacing: -1.5px; }
.trip-hero p:last-child { margin: 0; color: var(--muted); }
.modal-tabs { position: sticky; top: 76px; z-index: 2; display: grid; grid-template-columns: repeat(3, 1fr); margin: 0 -24px 24px; border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line); background: #06192b; }
.modal-tabs button { min-height: 50px; border: 0; border-bottom: 3px solid transparent; background: transparent; color: var(--muted); font-weight: 750; }
.modal-tabs button.active { border-bottom-color: var(--gold); color: var(--gold-light); }
.detail-sections > div { padding: 19px 0; border-top: 1px solid var(--line-soft); }
.detail-sections > div:first-child { padding-top: 0; border-top: 0; }
.detail-sections > div > span { display: block; margin-top: 5px; line-height: 1.55; }
.workflow-list { margin-bottom: 22px; }
.workflow-step { position: relative; min-height: 70px; display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 14px; }
.workflow-step::after { content: ""; position: absolute; left: 20px; top: 42px; bottom: 0; width: 1px; background: var(--line); }
.workflow-step:last-child::after { display: none; }
.workflow-step > span { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid var(--gold); color: var(--gold-light); font-weight: 800; }
.workflow-step.complete > span { background: var(--gold); color: var(--midnight); }
.workflow-step strong, .workflow-step small { display: block; }
.workflow-step small { margin-top: 4px; color: var(--muted); }
.workflow-actions { display: grid; gap: 10px; }
.plan-legs { display: grid; gap: 4px; }
.plan-leg { padding: 22px; border: 1px solid var(--line); background: rgba(2,10,19,.42); }
#trip-plan-form > button { margin-top: 12px; }
.danger-button { min-height: 44px; padding: 0 17px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; border: 1px solid #81454c; background: rgba(129,69,76,.12); color: #ef8c96; font-weight: 750; }
.danger-button:hover { background: rgba(129,69,76,.28); }
.danger-icon { border-color: #81454c; color: #ef8c96; }
.form-note { margin: -2px 0 0; padding: 12px; border-left: 2px solid var(--gold); background: rgba(214,172,72,.06); color: var(--muted); font-size: 12px; line-height: 1.6; }
.warning-panel { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 13px; margin-bottom: 20px; padding: 17px; border: 1px solid #81454c; background: rgba(129,69,76,.12); }
.warning-panel > span { color: #ef8c96; font-size: 28px; }
.warning-panel p { margin: 5px 0 0; color: var(--muted); line-height: 1.5; }

.expense-list, .review-list { display: grid; gap: 9px; margin-bottom: 20px; }
.expense-line { min-height: 68px; display: grid; grid-template-columns: 32px minmax(0,1fr) auto 24px; align-items: center; gap: 11px; padding: 11px 14px; border: 1px solid var(--line); background: var(--panel-deep); color: var(--ink); text-align: left; }
.expense-line strong, .expense-line small { display: block; }
.expense-line small { margin-top: 4px; color: var(--muted); }
.expense-line em { color: var(--gold-light); font-style: normal; font-weight: 700; }
.review-row { min-height: 70px; display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 13px 0; border-bottom: 1px solid var(--line-soft); }
.review-row strong, .review-row small { display: block; }
.review-row small { margin-top: 4px; color: var(--muted); }
.expense-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 16px; border: 1px solid var(--line); background: var(--midnight); }
.expense-head > div:last-child { text-align: right; }
.expense-head span, .expense-head strong { display: block; }
.expense-head span { color: var(--muted); font-size: 11px; }
.expense-head strong { margin-top: 4px; }
.receipt-upload { position: relative; min-height: 122px; display: flex !important; flex-direction: column; justify-content: center; align-items: center; border: 1px dashed #55718a; background: var(--midnight); cursor: pointer; text-align: center; }
.receipt-upload > span { position: absolute; left: 12px; top: 10px; color: var(--gold); font-size: 9px; letter-spacing: 1.3px; }
.receipt-upload input { position: absolute; width: 1px; min-height: 1px; opacity: 0; }
.receipt-upload i { color: var(--gold-light); font-size: 28px; }
.receipt-upload strong { margin: 7px 0 3px; color: var(--ink); }
.receipt-upload small { color: var(--muted); }
.receipt-link { min-height: 43px; display: flex; align-items: center; gap: 8px; color: var(--gold-light); text-decoration: none; }

.notification-list { display: grid; gap: 10px; }
.notification-item { width: 100%; min-height: 88px; display: grid; grid-template-columns: 48px minmax(0,1fr) 25px; align-items: center; gap: 16px; padding: 16px 18px; color: var(--ink); text-align: left; }
.notification-item.unread { border-left: 3px solid var(--gold); }
.notification-item p { margin: 5px 0; color: var(--muted); line-height: 1.45; }
.notification-item small { color: #6f879a; }
.notification-icon { width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid var(--line); color: var(--gold-light); }

.card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; }
.credit-card { position: relative; min-height: 190px; padding: 22px; display: flex; flex-direction: column; justify-content: space-between; color: var(--ink); text-align: left; overflow: hidden; }
.credit-card > .material-symbols-rounded { color: var(--gold-light); font-size: 30px; }
.credit-card strong, .credit-card small { display: block; }
.credit-card strong { font-size: 20px; }
.credit-card small { margin-top: 5px; color: var(--muted); }
.credit-card em { color: var(--gold-light); font-style: normal; font-size: 12px; letter-spacing: 1px; }

.settings-card { padding: 25px; }
.settings-card > label:not(.switch-row), .settings-card > .form-grid, .settings-card > .preference-subsection, .settings-card > button { margin-top: 16px; }
.section-icon { color: var(--gold-light); font-size: 30px; }
.full-settings { grid-column: 1 / -1; }
.preference-subsection { padding: 17px; border: 1px solid var(--line-soft); background: rgba(2, 10, 19, .24); }
.preference-subsection-heading { margin-bottom: 14px; }
.preference-subsection-heading p { margin-bottom: 4px; }
.preference-subsection-heading span { color: var(--muted); font-size: 11px; }
.preference-subsection > label:not(.switch-row) { display: block; margin-bottom: 12px; }
.settings-card label.switch-row { min-height: 52px; margin: 0; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--line-soft); color: var(--ink); font-size: 13px; font-weight: 650; letter-spacing: 0; text-transform: none; cursor: pointer; }
.settings-card label.switch-row input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.settings-card label.switch-row i { position: relative; width: 46px; height: 25px; flex: 0 0 46px; border: 1px solid #4e687c; border-radius: 20px; background: var(--midnight); box-shadow: inset 0 0 0 1px rgba(255,255,255,.02); transition: .18s ease; }
.settings-card label.switch-row i::after { content: ""; position: absolute; width: 17px; height: 17px; left: 3px; top: 3px; border-radius: 50%; background: var(--muted); box-shadow: 0 2px 5px rgba(0,0,0,.4); transition: .18s ease; }
.settings-card label.switch-row input:checked + i { border-color: var(--gold); background: rgba(214,172,72,.2); }
.settings-card label.switch-row input:checked + i::after { transform: translateX(21px); background: var(--gold); }
.settings-card label.switch-row input:focus-visible + i { outline: 2px solid var(--gold-light); outline-offset: 3px; }
.settings-card label.switch-row:hover i { border-color: var(--gold); }
.color-settings { display: grid; gap: 0; margin-top: 18px; }
.color-row { min-height: 70px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-top: 1px solid var(--line-soft); }
.color-row strong, .color-row small { display: block; }
.color-row small { margin-top: 3px; color: var(--muted); }
.color-swatches { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.color-swatches button { width: 29px; height: 29px; border: 2px solid transparent; border-radius: 50%; background: var(--swatch); box-shadow: inset 0 0 0 1px rgba(255,255,255,.18); }
.color-swatches button.selected { border-color: var(--ink); box-shadow: 0 0 0 2px var(--gold); }
.choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.choice-card { min-height: 46px; padding: 10px 12px; border: 1px solid var(--line); background: var(--midnight); }
.choice-card:has(input:checked) { border-color: var(--gold); background: rgba(214,172,72,.08); color: var(--ink); }
.choice-card span small { display: block; margin-top: 2px; color: var(--gold); font-size: 8px; text-transform: uppercase; }
legend { margin-bottom: 10px; color: var(--gold); font-size: 9px; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase; }

.survey-questions { display: grid; gap: 13px; margin-bottom: 18px; }
.survey-questions fieldset { padding: 14px; border: 1px solid var(--line-soft); }
.survey-questions legend { margin: 0; padding: 0 7px; color: var(--ink); font-size: 12px; letter-spacing: 0; text-transform: none; }
.star-rating { display: inline-flex; flex-direction: row-reverse; gap: 4px; }
.star-rating input { position: absolute; opacity: 0; pointer-events: none; }
.star-rating label { margin: 0 !important; color: #486073 !important; font-size: 30px !important; line-height: 1; cursor: pointer; }
.star-rating label:hover, .star-rating label:hover ~ label, .star-rating input:checked ~ label { color: var(--gold) !important; }

@media (max-width: 1120px) {
  .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .people-grid, .aircraft-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .two-column { grid-template-columns: 1fr; }
  .card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 860px) {
  .login-layout { grid-template-columns: 1fr; align-content: center; }
  .login-intro { display: none; }
  .login-card { width: min(500px, 100%); margin: 0 auto; }
  .app-shell { display: block; }
  .sidebar { transform: translateX(-100%); transition: transform .2s ease; box-shadow: 20px 0 60px #000b; }
  .sidebar.open { transform: translateX(0); }
  .workspace { min-width: 0; }
  .menu-toggle { display: inline-grid !important; }
  .header-date { display: none; }
  .workspace-header { padding-inline: 18px; }
  .page { padding: 30px 18px 48px; }
  .hero { align-items: flex-start; flex-direction: column; }
  .hero-actions { justify-content: flex-start; }
  .import-layout, .settings-grid { grid-template-columns: 1fr; }
  .full-settings { grid-column: auto; }
  .booking-primary-grid { grid-template-columns: minmax(0, 1.4fr) minmax(230px, .8fr); }
  .booking-schedule-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .partner-choice-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .booking-arrangements { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .login-view { padding: 22px; }
  .login-brand img { width: 160px; }
  .login-layout { min-height: calc(100vh - 130px); margin-top: 20px; }
  .login-card { padding: 24px; }
  .workspace-header { min-height: 70px; }
  .workspace-header h1 { font-size: 20px; }
  .header-actions > .icon-button:not(.menu-toggle) { display: none; }
  .hero h1 { font-size: 44px; letter-spacing: -2px; }
  .metric-grid, .metric-grid.compact, .people-grid, .aircraft-grid { grid-template-columns: 1fr; }
  .metric { min-height: 112px; }
  .page-tools { align-items: stretch; flex-direction: column; }
  .filter-panel-header { align-items: flex-start; }
  .filter-panel-header span { display: none; }
  .segmented { width: 100%; display: grid; grid-template-columns: repeat(auto-fit, minmax(95px, 1fr)); }
  .segmented button { padding: 0 10px; border-bottom: 1px solid var(--line); }
  .form-grid { grid-template-columns: 1fr; }
  .form-grid .full, .full { grid-column: auto; }
  .rate-editor { grid-template-columns: minmax(0, 1fr) 100px 42px; gap: 7px; }
  .rate-editor .rate-remove { width: 42px; }
  .trip-row { grid-template-columns: 5px minmax(0, 1fr) auto; }
  .modal-backdrop { padding: 0; place-items: end center; }
  .modal { width: 100%; max-height: 94vh; border-width: 1px 0 0; }
  .modal-body { padding: 20px 18px 28px; }
  .booking-modal-open .modal { max-height: 96vh; }
  .booking-modal-open .modal-body { padding: 14px; }
  .booking-primary-grid, .booking-traveler-grid, .booking-more-content { grid-template-columns: 1fr; }
  .booking-route-grid { grid-template-columns: 1fr; }
  .route-arrow { height: 22px; transform: rotate(90deg); }
  .compact-choice-grid { grid-template-columns: 1fr; }
  .booking-footer { align-items: stretch; flex-direction: column; }
  .booking-footer .primary { width: 100%; }
  .booking-picker-panel { top: auto !important; right: 0; bottom: 0; left: 0 !important; width: 100% !important; max-height: 78vh; overflow: auto; border-width: 1px 0 0; }
  .inline-form { grid-template-columns: 1fr; }
  .modal-summary { grid-template-columns: 1fr; }
  .invoice-summary { grid-template-columns: 1fr; }
  .invoice-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mapping-list > div { grid-template-columns: 1fr; }
  .toast { left: 14px; right: 14px; bottom: 14px; max-width: none; }
  .card-grid, .choice-grid { grid-template-columns: 1fr; }
  .calendar-tools { align-items: stretch; }
  .calendar-tools .calendar-toolbar { justify-content: space-between; }
  .calendar-tools .calendar-toolbar h2 { min-width: 0; font-size: 24px; }
  .calendar-key { align-items: flex-start; flex-direction: column; gap: 8px; }
  .calendar-key span { grid-template-columns: 11px auto; }
  .calendar-key small { display: none; }
  .calendar-add-button { right: 20px; bottom: 22px; width: 58px; height: 58px; }
  .trip-hero { align-items: flex-start; flex-direction: column; }
  .modal-tabs { margin-inline: -18px; }
  .color-row { align-items: flex-start; flex-direction: column; padding: 14px 0; }
  .color-swatches { justify-content: flex-start; }
}