/* BoA Crew 58 — readable operational workspaces.
 * Additive layer, loaded after the existing tool styles. Navigation chrome is
 * deliberately outside this scope. No remote fonts or runtime dependencies.
 */
:root {
  --crew-copy: 1rem;
  --crew-label: .875rem;
  --crew-meta: .8125rem;
  --crew-radius: 18px;
  --crew-space: clamp(16px, 2vw, 24px);
}
.tool-usage-guide { margin:24px 0 12px; border:1px solid var(--border); border-radius:18px; background:var(--surface); color:var(--text); }
.tool-usage-guide > summary { display:flex; align-items:center; gap:13px; padding:18px; cursor:pointer; list-style:none; }
.tool-usage-guide > summary::-webkit-details-marker { display:none; }
.tool-guide-symbol { display:grid; place-items:center; width:36px; height:36px; flex:0 0 36px; border-radius:12px; background:var(--surface-2); color:var(--brand); font-weight:800; }
.tool-usage-guide summary strong { display:block; font-size:1rem; line-height:1.35; }
.tool-usage-guide summary small { display:block; color:var(--muted); font-size:.875rem; line-height:1.5; margin-top:4px; }
.tool-guide-chevron { margin-left:auto; font-size:1.4rem; transition:transform .2s; }
.tool-usage-guide[open] .tool-guide-chevron { transform:rotate(180deg); }
.tool-guide-body { padding:0 20px 20px; }
.tool-guide-body ol { margin:0; padding-left:26px; }
.tool-guide-body li { padding:8px 0 8px 7px; font-size:1rem; line-height:1.6; }
.tool-guide-body li::marker { color:var(--brand); font-weight:750; }
.tool-guide-offline { margin-top:16px; padding:16px; border-radius:12px; background:var(--surface-2); }
.tool-guide-offline strong { font-size:.875rem; }
.tool-guide-offline p { margin:5px 0 0; font-size:.9375rem; line-height:1.6; }

.page,
.modal {
  max-width: 100vw;
  box-sizing: border-box;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: var(--crew-copy);
  line-height: 1.5;
  font-variant-numeric: lining-nums;
  --crew-divider: color-mix(in srgb, var(--border) 86%, transparent);
  --crew-shadow: 0 2px 3px rgba(9, 24, 47, .025), 0 10px 28px rgba(9, 24, 47, .045);
}

.page :is(.page-header-copy, .panel-header > div, .panel-body, .list-card-main > div,
  .tool-hub-card > div, .module-card, .field, .stat-card, .summary-chip) { min-width: 0; }

.page .page-header { align-items: center; gap: 18px; margin-bottom: 22px; padding-bottom: 18px; }
.page .page-header h1 { font-size: clamp(1.7rem, 3vw, 2.5rem); line-height: 1.16; letter-spacing: -.035em; text-wrap: balance; }
.page .page-header p { max-width: 65ch; font-size: .9375rem; line-height: 1.55; }
.page :is(.breadcrumb, .panel-eyebrow) { font-size: .75rem; line-height: 1.4; letter-spacing: .075em; }
.page .page-actions { gap: 8px; }
.page .page-actions > * { min-width: 0; }

.page .panel { border: 1px solid var(--crew-divider); border-radius: var(--crew-radius); box-shadow: var(--crew-shadow); }
.page .panel-header { min-height: 72px; padding: 17px var(--crew-space); gap: 14px; background: var(--surface); }
.page .panel-header :is(h2, h3) { font-size: 1.0625rem; line-height: 1.35; letter-spacing: -.015em; text-wrap: balance; }
.page .panel-header p { margin-top: 5px; font-size: var(--crew-meta); line-height: 1.45; }
.page .panel-body { padding: var(--crew-space); }
.page :is(.panel-header-tools, .catalog-actions, .contact-actions) { flex-shrink: 0; }

.page :is(.primary-button, .secondary-button, .danger-button),
.modal :is(.primary-button, .secondary-button, .danger-button) {
  min-height: 46px; padding: 11px 15px; border-radius: 12px;
  font-size: var(--crew-label); font-weight: 700; line-height: 1.3;
  letter-spacing: -.01em; white-space: normal; text-align: center;
  touch-action: manipulation;
}
.page .primary-button, .modal .primary-button { box-shadow: 0 3px 9px color-mix(in srgb, var(--navy) 18%, transparent); }
.page :is(.action-button, .round-button), .modal :is(.action-button, .round-button) { width: 44px; height: 44px; min-width: 44px; min-height: 44px; border-radius: 12px; }
.page :is(button, a, input, select, textarea):focus-visible,
.modal :is(button, a, input, select, textarea):focus-visible { outline: 3px solid var(--brand); outline-offset: 3px; }
.page :is(button, input, select, textarea):disabled,
.modal :is(button, input, select, textarea):disabled { cursor: not-allowed; }

.page .field, .modal .field { gap: 7px; font-size: var(--crew-label); font-weight: 650; line-height: 1.4; }
.page .field small, .modal .field small { font-size: var(--crew-meta); font-weight: 400; line-height: 1.5; }
.page :is(.input-control, .select-control, .textarea-control),
.modal :is(.input-control, .select-control, .textarea-control) {
  width: 100%; min-width: 0; min-height: 48px; max-width: 100%; padding: 11px 13px;
  border-radius: 12px; font-size: 16px; font-weight: 450; line-height: 1.4;
  background: var(--surface-2); color: var(--text);
}
.page .textarea-control, .modal .textarea-control { min-height: 104px; }
.page .search-box { min-width: 0; min-height: 48px; border-radius: 12px; }
.page .search-box input { min-height: 44px; font-size: 16px; }
.page .form-grid, .modal .form-grid { gap: 16px; }
.page :is(.field-error, .form-error), .modal :is(.field-error, .form-error) { font-size: var(--crew-meta); line-height: 1.45; }
.modal-header h2 { font-size: 1.1875rem; line-height: 1.3; text-wrap: balance; }
.modal-body { line-height: 1.5; }
.modal-footer { flex-wrap: wrap; }

/* One density scale for statistics, content cards and activity rows. */
.page :is(.stat-card, .suite-metric) { padding: 16px; border-radius: 15px; box-shadow: none; }
.page :is(.stat-card, .suite-metric) > small { font-size: var(--crew-meta); line-height: 1.4; }
.page :is(.stat-card, .suite-metric) > strong { margin-block: 5px; font-size: 1.625rem; line-height: 1.12; font-variant-numeric: tabular-nums; }
.page :is(.stat-card .trend, .suite-metric > span) { font-size: .75rem; line-height: 1.4; }
.page :is(.list-card, .contact-row, .suite-record) { padding: 16px; border-radius: 15px; border-color: var(--crew-divider); box-shadow: none; }
.page :is(.list-card strong, .contact-main strong, .suite-record > header strong) { font-size: .9375rem; line-height: 1.45; overflow-wrap: break-word; }
.page :is(.list-card small, .contact-main small, .contact-meta small, .suite-record > header small) { font-size: var(--crew-meta); line-height: 1.5; }
.page .contact-meta { font-size: var(--crew-label); }
.page :is(.tool-hub-card, .module-card) { border-radius: 18px; box-shadow: var(--crew-shadow); }
.page .tool-hub-card { min-height: 180px; padding: 22px; gap: 16px; }
.page .tool-hub-card h2, .page .module-card h3 { font-size: 1.125rem; line-height: 1.3; margin-block: 5px 8px; }
.page :is(.tool-hub-card p, .module-card p, .empty-state p, .suite-empty p) { font-size: .875rem; line-height: 1.55; }
.page :is(.info-banner, .warning-banner, .suite-safety-banner, .suite-privacy-note) { font-size: var(--crew-label); line-height: 1.55; border-radius: 14px; }
.page :is(.info-banner, .warning-banner) > .icon { flex: 0 0 20px; width: 20px; height: 20px; margin-top: 1px; }
.page :is(.role-badge, .priority-badge, .suite-badge) { min-height: 27px; padding: 5px 8px; font-size: .6875rem; line-height: 1.35; letter-spacing: .025em; text-align: center; }
.page :is(.support-contact-copy p, .support-contact-details a, .feedback-preview) { font-size: var(--crew-meta); line-height: 1.5; }
.page .directory-sync-meta { font-size: .75rem !important; white-space: normal; line-height: 1.4 !important; }
.page .directory-filter-button { min-height: 50px; }
.page .directory-filter-button strong { font-size: var(--crew-label); }
.page .directory-filter-button small { font-size: .75rem; }
.page .empty-state { padding: 32px 18px; }
.page .empty-state h3 { font-size: 1.0625rem; line-height: 1.4; }

/* Calendar: recognisable cells plus readable event detail, not tiny paragraphs. */
.page .calendar-toolbar { align-items: flex-start; flex-wrap: wrap; gap: 14px; }
.page .month-nav { min-width: 0; width: 100%; justify-content: space-between; gap: 10px; }
.page .month-nav h2 { min-width: 0; font-size: 1.125rem; line-height: 1.3; white-space: nowrap; }
.page .shift-palette { display: flex; max-width: 100%; flex-wrap: wrap; gap: 8px; }
.page .shift-chip { min-height: 44px; padding: 8px 11px; border-radius: 11px; font-size: .8125rem; line-height: 1.25; white-space: nowrap; }
.page .shift-chip > span { min-width: 24px; font-size: .8125rem; }
.page .calendar-grid { gap: 4px; }
.page .calendar-grid .weekday { padding: 6px 0 10px; font-size: .8125rem; line-height: 1.3; font-weight: 650; }
.page .calendar-day { min-width: 0; min-height: 118px; padding: 7px 5px; gap: 5px; border-radius: 10px; }
.page .calendar-day .day-number { font-size: .875rem; line-height: 1.2; padding: 0 3px; font-variant-numeric: tabular-nums; }
.page .calendar-day.today .day-number { padding: 3px 6px; border-radius: 7px; background: var(--brand); color: #fff; }
.page .calendar-events { gap: 4px; margin-top: 3px; }
.page .calendar-event { min-height: 26px; padding: 4px 5px; font-size: .75rem; line-height: 1.25; border-radius: 5px; }
.page .calendar-event b { font-size: .75rem; line-height: 1.25; }
.page .calendar-more { font-size: .75rem; line-height: 1.4; }
.page .calendar-range-hint { font-size: .875rem; line-height: 1.5; }
.page .calendar-summary { gap: 8px; }
.page .summary-chip { padding: 12px; border-radius: 12px; }
.page .summary-chip strong { font-size: 1.375rem; line-height: 1.2; }
.page .summary-chip small { font-size: .8125rem; line-height: 1.45; opacity: 1; }
.page .flight-plan-card { padding: 16px; gap: 14px; border-radius: 14px; align-items: flex-start; }
.page .flight-plan-card strong { font-size: .9375rem; line-height: 1.4; }
.page .flight-plan-card small { font-size: .8125rem; line-height: 1.5; }
.page .flight-plan-card-side { flex-wrap: wrap; }
.page .calendar-connections { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-bottom: 20px; }
.page .calendar-connection-card { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 12px; padding: 20px; border: 1px solid var(--border); border-radius: 18px; background: var(--surface); box-shadow: var(--crew-shadow); }
.calendar-connection-card > div { min-width: 0; }
.calendar-connection-card h2 { font-size: 1.0625rem; margin: 2px 0 7px; line-height: 1.35; }
.calendar-connection-card p { font-size: .875rem; margin: 0; line-height: 1.5; color: var(--muted); }
.calendar-connection-card small { font-size: .6875rem; font-weight: 700; letter-spacing: .07em; color: var(--muted); }
.calendar-connection-logo { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--navy-soft); color: var(--brand); font-size: .9375rem; font-weight: 800; }
.calendar-connection-logo.google-logo { background: #e9f1ff; color: #245bbd; border-top: 5px solid #4385ef; }
.calendar-connection-actions { grid-column: 1 / -1; display: flex; gap: 8px; flex-wrap: wrap; margin-top: 2px; }
.calendar-connection-actions > button { flex: 1 1 140px; }
.calendar-connection-card .connection-status { display: inline-flex; margin-top: 11px; padding: 5px 8px; border-radius: 7px; background: var(--surface-2); color: var(--muted); font-size: .75rem; line-height: 1.4; }
.calendar-connection-card .connection-status.connected { background: color-mix(in srgb, #138560 12%, var(--surface)); color: var(--text); }
.calendar-source-dialog { display: grid; gap: 18px; }
.calendar-integrations { margin-bottom:18px; border:1px solid var(--border); border-radius:14px; background:var(--surface); }
.calendar-integrations > summary { display:flex; align-items:center; gap:10px; padding:15px; cursor:pointer; font-weight:650; font-size:.9375rem; flex-wrap:wrap; }
.calendar-integrations > summary span { margin-left:auto; font-size:.8125rem; color:var(--muted); font-weight:400; }
.calendar-integrations[open] > summary { border-bottom:1px solid var(--border); }
.page .calendar-integrations .calendar-connections { margin:14px; }
.calendar-view-toggle { display:flex; gap:6px; flex-wrap:wrap; }
.calendar-day-agenda, .calendar-item-detail { display:grid; gap:16px; }
.calendar-agenda-row { display:flex; width:100%; align-items:center; justify-content:space-between; gap:14px; padding:16px; border:1px solid var(--border); border-left:4px solid var(--event-color,var(--brand)); border-radius:14px; background:var(--surface-2); color:var(--text); text-align:left; }
.calendar-agenda-row > span, .calendar-agenda-row > div { min-width:0; }
.calendar-agenda-row strong { display:block; font-size:1rem; line-height:1.45; overflow-wrap:anywhere; }
.calendar-agenda-time { display:block; font-size:1.15rem; font-weight:700; line-height:1.5; margin:6px 0; font-variant-numeric:tabular-nums; }
.calendar-agenda-meta { display:block; font-size:.875rem; color:var(--muted); line-height:1.5; }
.calendar-import-list { display:grid; gap:10px; max-height:45vh; overflow:auto; margin:16px 0; }
.calendar-import-preview p, .calendar-item-detail p { overflow-wrap:anywhere; }

/* Cabin: a name remains content. The seat map may pan locally on narrow screens. */
.page .cabin-map-panel > .panel-body { overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: thin; }
.page .cabin-aircraft { min-width: 560px; }
.page :is(.cabin-row, .cabin-column-labels) { grid-template-columns: minmax(105px, 1fr) 14px minmax(105px, 1fr) 26px minmax(105px, 1fr) 14px minmax(105px, 1fr); gap: 6px; }
.page .business-seat.seat-button { min-height: 144px; height: auto; padding: 10px; gap: 6px 5px; border-radius: 17px 8px 17px 8px; }
.page .business-seat.seat-button:nth-of-type(2), .page .business-seat.seat-button:nth-of-type(4) { border-radius: 8px 17px 8px 17px; }
.page .business-seat-number { font-size: 1.0625rem !important; line-height: 1.1; }
.page .business-seat-passenger { display: block; max-width: 100%; overflow: visible; text-overflow: clip; white-space: normal; overflow-wrap: break-word; word-break: normal; font-size: .8125rem; font-weight: 700; line-height: 1.4; }
.page .business-seat-status { overflow: visible; text-overflow: clip; white-space: normal; font-size: .75rem; line-height: 1.35; }
.page .business-seat-services { flex-wrap: wrap; overflow: visible; gap: 4px; }
.page .seat-service-chip { min-height: 24px; height: auto; padding: 4px; font-size: .6875rem; line-height: 1; }
.page .cabin-column-labels { font-size: .875rem; }
.page :is(.cabin-legend, .cabin-aft, .cabin-nose small) { font-size: .75rem; line-height: 1.4; }
.page .cabin-seat-guide { position: sticky; left: 0; min-width: 0; width: 100%; }
.page .flight-strip { border-radius: 16px; padding: 17px; }
.page .flight-strip strong { font-size: 1.0625rem; line-height: 1.4; }
.page .flight-strip small { font-size: .8125rem; line-height: 1.5; color: #d9e8fa; }
.page :is(.service-queue-item strong, .summary-order-row strong, .ssr-live-item strong) { font-size: .875rem; line-height: 1.4; }
.page :is(.service-queue-item small, .summary-order-row small, .ssr-live-item small, .cabin-summary-top small) { font-size: .8125rem; line-height: 1.45; }
.modal :is(input[name="passenger"], input[name="passengerName"], #seat-passenger) { font-size: 16px; min-height: 48px; font-weight: 550; }

/* Operational suite: metadata readable at arm's length, actions stay tappable. */
.page :is(.suite-command-bar strong, .suite-form-step strong, .suite-check span,
  .suite-record > p, .suite-live-head strong, .suite-briefing-live strong,
  .suite-link-row a, .suite-link-row button, .suite-symptoms span,
  .suite-factor-list, .suite-actions-list span) { font-size: .875rem; line-height: 1.5; }
.page :is(.suite-command-bar small, .suite-record-meta span, .suite-date-line > span small,
  .suite-live-head small, .suite-source-note, .suite-weather-slots > p) { font-size: .8125rem; line-height: 1.5; }
.page .suite-command-bar small { white-space: normal; max-width: none; }
.page .suite-record > header { flex-wrap: wrap; }
.page .suite-record > footer { flex-wrap: wrap; gap: 8px; }
.page .suite-record > footer .select-control.compact { min-height: 44px; font-size: .875rem; flex: 1 1 140px; }
.page .suite-date-line > span strong { font-size: .9375rem; line-height: 1.4; font-variant-numeric: tabular-nums; }
.page .suite-weather-slots p { font-size: .8125rem; line-height: 1.6; grid-template-columns: 48px minmax(0, 1fr); overflow-wrap: anywhere; }
.page .suite-check span, .page .suite-symptoms span { min-height: 48px; }
.page .suite-offline-chip { width: auto; min-height: 32px; padding: 6px 9px; font-size: .75rem; }
.page .suite-offline-chip svg { flex-shrink: 0; }
.page .suite-progress strong { font-size: .8125rem; }
.page .crew-room-open { min-height: 76px; padding: 12px 10px; }
.page .crew-room-open strong, .page .crew-chat-header strong { font-size: .9375rem; line-height: 1.35; }
.page :is(.crew-room-open small, .crew-room-open em, .crew-chat-header small, .crew-room-members summary) { font-size: .8125rem; line-height: 1.45; }
.page .crew-message p { font-size: 1rem; line-height: 1.55; }
.page .crew-message :is(strong, time) { font-size: .75rem; line-height: 1.4; }
.page .crew-message { padding: 11px 13px; }
.page .crew-member-list > span { font-size: .8125rem; }
.page .crew-room-create > summary { font-size: .875rem; }
.page .crew-chat-empty p { font-size: .9375rem; line-height: 1.5; }

/* Weather, flight data, rest and money share units and tabular number styling. */
.page :is(.weather-metric small, .weather-quick-metrics small, .weather-hour small,
  .weather-day-wind, .weather-disclaimer, .weather-source-pill,
  .aviation-metrics small, .aviation-data-note, .aviation-source-state,
  .aviation-raw-report > small, .aviation-map-legend span) { font-size: .8125rem; line-height: 1.45; }
.page :is(.weather-hour strong, .weather-day-temp, .aviation-metrics strong) { font-variant-numeric: tabular-nums; }
.page .aviation-metrics strong { overflow: visible; text-overflow: clip; font-size: 1rem; line-height: 1.35; overflow-wrap: anywhere; }
.page .aviation-raw-report summary { min-height: 44px; font-size: .875rem; }
.page .aviation-raw-report code { font-size: .875rem; line-height: 1.65; }
.page .aviation-tabs button { min-height: 46px; font-size: .875rem; }
.page .aviation-select-field { font-size: .875rem; }
.page .aviation-command-states span { min-height: 40px; font-size: .8125rem; }
.page .aviation-airport-hero p { font-size: .875rem; }
.page :is(.operations-reference-grid span, .route-stats small, .route-clock-grid small,
  .route-clock-grid span, .checklist-signoff, .rest-turn-zone) { font-size: .8125rem; line-height: 1.5; }
.page .rest-turn-card { border-radius: 18px; padding: 18px 16px; }
.page .rest-turn-label { font-size: .9375rem; line-height: 1.4; }
.page .rest-turn-time strong { font-size: clamp(1.65rem, 5vw, 2.25rem) !important; line-height: 1.15; white-space: nowrap; font-variant-numeric: tabular-nums; }
.page .rest-turn-time small { font-size: .8125rem !important; line-height: 1.4; }
.page .rest-timeline-labels { font-size: .75rem; line-height: 1.4; }
.page .rest-members-heading span { font-size: .75rem; }
.page .rest-feature-pills span { font-size: .75rem; line-height: 1.4; white-space: normal; }
.page .world-clock-copy :is(p, span) { font-size: .875rem; line-height: 1.5; }
.page :is(.alarm-clock-card p, .alarm-clock-card small) { font-size: .875rem; line-height: 1.5; }
.modal :is(.alarm-native-note, .alarm-schedule-summary, .alarm-repeat-heading small) { font-size: .875rem; line-height: 1.5; }
.page :is(.currency-world-name small, .currency-world-rate small, .currency-source-strip small,
  .currency-converter-result small, .currency-converter-result > span,
  .table6-rate small, .table6-region-guide small, .table6-swipe-hint) { font-size: .8125rem; line-height: 1.45; }
.page .currency-world-name strong { font-size: .9375rem; line-height: 1.4; }
.page .currency-world-rate strong { font-size: 1rem; line-height: 1.35; font-variant-numeric: tabular-nums; }
.page .currency-world-row { gap: 12px; padding-block: 14px; }
.page .currency-flag { width: 30px; height: 21px; flex: 0 0 30px; object-fit: cover; border-radius: 4px; box-shadow: 0 0 0 1px var(--border); }
.page .table6-table :is(th, td) { font-size: .875rem; line-height: 1.5; padding: 14px 12px; }
.page .table6-table small { font-size: .75rem; line-height: 1.4; }
.page .table6-table { min-width: 720px; }
.page .table6-region-guide strong { font-size: .9375rem; line-height: 1.4; }
.page .table6-region-guide span { font-size: .8125rem; line-height: 1.5; }
.page :is(.invoice-history-card small, .per-diem-breakdown small, .per-diem-breakdown em) { font-size: .8125rem; line-height: 1.5; }

@media (max-width: 980px) {
  .page .calendar-connections { grid-template-columns: 1fr; }
  .page .cabin-workspace { grid-template-columns: minmax(0, 1fr); }
  .page .cabin-summary-column { position: static; }
}

@media (max-width: 700px) {
  .page { --crew-space: 16px; }
  .page .page-header { align-items: stretch; gap: 14px; margin-bottom: 18px; }
  .page .page-header h1 { font-size: clamp(1.65rem, 6.3vw, 2rem); line-height: 1.18; }
  .page .page-header p { font-size: .9375rem; }
  .page .page-actions { display: flex; width: 100%; justify-content: flex-start; }
  .page .page-actions > button { flex: 1 1 136px; }
  .page .panel-header { align-items: flex-start; flex-wrap: wrap; }
  .page .panel-header > div:first-child { flex: 1 1 180px; }
  .page .panel-header-tools { max-width: 100%; flex-wrap: wrap; }
  .page .panel-header :is(h2, h3) { font-size: 1.0625rem; }
  .page :is(.stat-grid, .suite-metrics) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .page .suite-metric:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .page :is(.list-card, .contact-row) { padding: 14px; }
  .page :is(.tool-hub-grid, .expanded-tool-hub) { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .page .tool-hub-card { min-height: 136px; grid-template-columns: 52px minmax(0, 1fr) 18px; padding: 18px; gap: 14px; }
  .page .tool-hub-icon { width: 52px; height: 52px; border-radius: 15px; }
  .page .tool-hub-icon .icon { width: 28px; height: 28px; }
  .page .flight-strip { align-items: flex-start; flex-wrap: wrap; gap: 12px; }
  .page .flight-strip > div { min-width: 0; flex: 1 1 200px; }
  .page .flight-strip > button { flex: 1 1 150px; }
  .page .calendar-connection-card { padding: 16px; }
  .page .calendar-toolbar { flex-direction: column; }
  .page .calendar-grid { gap: 3px; }
  .page .calendar-grid .weekday { font-size: .75rem; }
  .page .calendar-day { min-height: 100px; padding: 7px 2px 4px; border-radius: 7px; }
  .page .calendar-day .day-number { font-size: .8125rem; padding-inline: 3px; }
  .page .calendar-event { display: flex; justify-content: center; padding: 4px 2px; min-height: 26px; border-left-width: 2px; font-size: .8125rem; }
  .page .calendar-event b { display: block; font-size: .8125rem; font-weight: 750; }
  .page .calendar-event > span { display: none; }
  .page .calendar-more { text-align: center; padding: 0; font-size: .75rem; }
  .page .calendar-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page .flight-plan-card { display: grid; grid-template-columns: minmax(0, 1fr); }
  .page .flight-plan-card-side { width: 100%; max-width: none; justify-content: flex-start; text-align: left; border-top: 1px solid var(--border); padding-top: 10px; }
  .page .flight-plan-card-side > .icon { margin-left: auto; }
  .page .cabin-map-panel > .panel-body { padding: 14px; }
  .page .cabin-map-panel .cabin-seat-guide { font-size: .8125rem; }
  .page .cabin-aircraft { padding-inline: 16px; }
  .page .cabin-nose { margin-inline: -18px; }
  .page .suite-command-bar { align-items: flex-start; flex-wrap: wrap; }
  .page .suite-command-bar > div { flex: 1 1 180px; }
  .page .suite-live-head .secondary-button { width: auto; height: auto; font-size: .8125rem; padding: 9px 11px; }
  .page .suite-live-head { flex-wrap: wrap; }
  .page .suite-workspace { min-width: 0; }
  .page .crew-message { max-width: 92%; }
  .page .currency-world-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px 14px; padding-block: 13px; }
  .page .currency-world-name { grid-column: 1 / -1; display: flex; align-items: center; gap: 10px; }
  .page .currency-world-name > span { display: flex; align-items: baseline; gap: 8px; min-width: 0; flex-wrap: wrap; }
  .page .currency-world-name strong { font-size: .9375rem; }
  .page .currency-world-rate { text-align: left; padding-left: 40px; }
  .page .currency-world-rate:last-child { padding-left: 0; text-align: right; }
  .page .currency-world-rate small { display: block; font-size: .75rem; }
  .page .currency-world-rate strong { font-size: .9375rem; }
  .page .table6-region-guide article { min-height: 114px; padding: 14px; }
  .page .table6-expand { min-height: 44px; }
  .page .table6-expand span { font-size: .8125rem; }
  .page .table6-rate-controls { min-width: 0; }
  .modal .alarm-title-row { grid-template-columns: 28px minmax(0, 1fr); }
  .modal .alarm-title-row input { grid-column: 1 / -1; max-width: none; width: 100%; font-size: 16px; min-height: 44px; padding-inline: 10px; text-align: left; border: 1px solid var(--border); border-radius: 10px; }
}

@media (max-width: 430px) {
  .page :is(.form-grid, .form-grid.two, .form-grid.four),
  .modal :is(.form-grid, .form-grid.two, .form-grid.four) { grid-template-columns: minmax(0, 1fr); }
  .page .form-grid > :is(.span-2, .span-all),
  .modal .form-grid > :is(.span-2, .span-all) { grid-column: 1 / -1; }
  .page .search-box { width: 100%; flex-basis: 100%; }
  .page .calendar-connection-card { grid-template-columns: 36px minmax(0, 1fr); gap: 10px; }
  .calendar-connection-logo { width: 36px; height: 36px; border-radius: 10px; }
  .page .shift-palette { display: flex; flex-wrap: nowrap; width: 100%; overflow-x: auto; padding: 2px 1px 9px; overscroll-behavior-inline: contain; scroll-snap-type: x proximity; }
  .page .shift-chip { flex: 0 0 auto; scroll-snap-align: start; }
  .page .rest-turn-card { grid-template-columns: 32px minmax(0, 1fr); gap: 10px; padding: 16px 12px; }
  .page .rest-turn-number { width: 32px; height: 32px; }
  .page .rest-turn-time { gap: 6px; }
  .page .rest-turn-time strong { font-size: 1.65rem !important; }
  .page .rest-turn-time small { font-size: .75rem !important; }
  .page .aviation-metrics > div { padding: 13px 11px; }
  .page .currency-world-rate { padding-left: 0; }
  .modal-footer > :is(.primary-button, .secondary-button, .danger-button) { flex: 1 1 110px; }
}

@media (prefers-reduced-motion: reduce) {
  .page :is(.tool-hub-card, .module-card, .list-card, .primary-button, .secondary-button),
  .modal :is(.primary-button, .secondary-button) { transition: none; }
}

@media (prefers-contrast: more) {
  .page :is(.panel, .list-card, .contact-row, .calendar-day, .stat-card, .suite-record) { border-color: var(--text); box-shadow: none; }
  .page :is(.panel-header p, .field small, .list-card small, .suite-record > p),
  .modal .field small { color: var(--text); }
}

/* Samsung One UI 9.0 Alarm System */
.alarm-clock-card {
  border-radius: 28px !important;
  border: 1px solid var(--crew-divider) !important;
  background: color-mix(in srgb, var(--surface) 92%, var(--surface-2)) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04) !important;
  transition: transform 0.28s cubic-bezier(0.2, 0.9, 0.3, 1.2), box-shadow 0.24s ease, border-color 0.24s ease !important;
}
.alarm-clock-card.is-enabled {
  border-color: color-mix(in srgb, #2563eb 45%, var(--crew-divider)) !important;
  box-shadow: 0 8px 24px rgba(37, 99, 235, 0.08) !important;
}
.alarm-clock-time strong {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(3rem, 7vw, 4.2rem) !important;
  letter-spacing: -0.05em !important;
}
.alarm-repeat-days {
  display: flex !important;
  justify-content: space-between !important;
  gap: 6px !important;
  padding: 8px 4px !important;
  border: none !important;
}
.alarm-repeat-days label {
  cursor: pointer !important;
}
.alarm-repeat-days label input {
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.alarm-repeat-days label span {
  display: grid !important;
  place-items: center !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  font-weight: 750 !important;
  font-size: 0.95rem !important;
  color: var(--muted) !important;
  background: var(--surface-2) !important;
  border: 1px solid transparent !important;
  transition: all 0.24s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}
.alarm-repeat-days label input:checked + span {
  background: #2563eb !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.35) !important;
  transform: scale(1.08) !important;
}
.alarm-oneui-countdown {
  display: block;
  text-align: center;
  font-size: 0.88rem;
  font-weight: 700;
  color: #2563eb;
  background: color-mix(in srgb, #2563eb 12%, transparent);
  padding: 8px 14px;
  border-radius: 999px;
  margin: 10px 0 16px;
  letter-spacing: -0.01em;
}

/* ==========================================================================
   SAMSUNG GALAXY CLOCK ONE UI 9.0 SUITE PARA BOA CREW
   ========================================================================== */
.roster-oneui-page {
  --oneui-bg-card: color-mix(in srgb, var(--surface) 92%, var(--surface-2));
  --oneui-accent: #2563eb;
  --oneui-accent-light: #38bdf8;
  --oneui-accent-bg: rgba(37, 99, 235, 0.12);
  --oneui-radius: 28px;
}

[data-theme="dark"] .roster-oneui-page {
  --oneui-bg-card: #161920;
  --oneui-accent-bg: rgba(56, 189, 248, 0.14);
}

/* One UI Clock Hero Banner */
.oneui-clock-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 24px 28px;
  margin-bottom: 20px;
  border-radius: var(--oneui-radius);
  background: radial-gradient(circle at 80% 20%, var(--oneui-accent-bg), transparent 60%), var(--oneui-bg-card);
  border: 1px solid var(--crew-divider);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 10px 30px rgba(0, 0, 0, 0.06);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.oneui-clock-hero-leading {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.oneui-live-clock-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
}

.oneui-digital-time strong {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: clamp(2.4rem, 6vw, 3.6rem);
  font-weight: 850;
  line-height: 1;
  letter-spacing: -0.04em;
  color: var(--text);
  font-variant-numeric: tabular-nums;
}

.oneui-clock-hero-countdown {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 20px;
  border-radius: 22px;
  background: var(--surface);
  border: 1px solid var(--crew-divider);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04);
}

.oneui-clock-hero-countdown.is-active {
  border-color: color-mix(in srgb, var(--oneui-accent) 40%, var(--crew-divider));
  background: color-mix(in srgb, var(--oneui-accent) 8%, var(--surface));
}

.oneui-bell-icon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--oneui-accent-bg);
  color: var(--oneui-accent);
  flex-shrink: 0;
}

.oneui-clock-hero-countdown.is-active .oneui-bell-icon {
  animation: oneuiBellSwing 3s ease-in-out infinite;
}

@keyframes oneuiBellSwing {
  0%, 100% { transform: rotate(0deg); }
  10%, 30% { transform: rotate(12deg); }
  20%, 40% { transform: rotate(-12deg); }
  50% { transform: rotate(0deg); }
}

.oneui-countdown-headline {
  display: block;
  font-size: 1rem;
  font-weight: 750;
  line-height: 1.3;
  color: var(--text);
}

.oneui-clock-hero-countdown.is-active .oneui-countdown-headline {
  color: var(--oneui-accent);
}

.oneui-countdown-subtitle {
  display: block;
  font-size: 0.8125rem;
  color: var(--muted);
  margin-top: 2px;
}

/* Presets Rápidos de Tripulación (Fast Preset Chips) */
.oneui-presets-strip {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  padding-bottom: 8px;
  margin-bottom: 20px;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.oneui-presets-strip::-webkit-scrollbar { display: none; }

.oneui-preset-chip {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 999px;
  background: var(--surface);
  border: 1px solid var(--crew-divider);
  color: var(--text);
  font-size: 0.875rem;
  cursor: pointer;
  white-space: nowrap;
  scroll-snap-align: start;
  transition: all 0.22s cubic-bezier(0.34, 1.56, 0.64, 1);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
}

.oneui-preset-chip:hover {
  transform: translateY(-2px);
  border-color: var(--oneui-accent);
  box-shadow: 0 4px 14px rgba(37, 99, 235, 0.15);
}

.oneui-preset-chip:active {
  transform: scale(0.96);
}

.oneui-preset-chip span { font-size: 1.15rem; }
.oneui-preset-chip strong { font-weight: 700; }
.oneui-preset-chip small { color: var(--muted); font-size: 0.75rem; margin-left: 2px; }

/* Tarjetas de Alarma One UI 9.0 */
.oneui-alarm-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 22px 24px !important;
  border-radius: var(--oneui-radius) !important;
  border: 1px solid var(--crew-divider) !important;
  background: var(--oneui-bg-card) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 8px 24px rgba(0, 0, 0, 0.05) !important;
  transition: transform 0.28s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.24s ease, border-color 0.24s ease !important;
}

.oneui-alarm-card:hover {
  transform: translateY(-2px);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 12px 32px rgba(0, 0, 0, 0.09) !important;
}

.oneui-alarm-card.is-enabled {
  border-color: color-mix(in srgb, var(--oneui-accent) 45%, var(--crew-divider)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 8px 28px rgba(37, 99, 235, 0.12) !important;
}

.oneui-time-block {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}

.oneui-time-block strong {
  font-size: clamp(2.4rem, 6vw, 3.5rem) !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  letter-spacing: -0.05em !important;
  color: var(--text) !important;
}

.oneui-period-tag {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
}

.oneui-remaining-badge {
  font-size: 0.78rem;
  font-weight: 750;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--oneui-accent-bg);
  color: var(--oneui-accent);
  margin-left: 6px;
}

/* Switch Nativo Samsung One UI */
.oneui-switch {
  width: 54px !important;
  height: 32px !important;
  border-radius: 999px !important;
  background: var(--muted) !important;
  opacity: 0.45;
  border: none !important;
  padding: 3px !important;
  cursor: pointer !important;
  position: relative !important;
  transition: all 0.28s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}

.oneui-switch.on {
  background: var(--oneui-accent) !important;
  opacity: 1 !important;
  box-shadow: 0 4px 14px rgba(37, 99, 235, 0.4) !important;
}

.oneui-switch .oneui-switch-thumb {
  display: block;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);
  transform: translateX(0);
  transition: transform 0.28s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.oneui-switch.on .oneui-switch-thumb {
  transform: translateX(22px);
}

/* Círculos de Días One UI dentro de la tarjeta */
.oneui-days-row {
  display: flex;
  gap: 6px;
  margin: 6px 0 10px;
}

.oneui-day-dot {
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  font-size: 0.75rem;
  font-weight: 750;
  background: var(--surface-2);
  color: var(--muted);
  border: 1px solid transparent;
  transition: all 0.2s ease;
}

.oneui-day-dot.is-active {
  background: var(--oneui-accent);
  color: #ffffff;
  box-shadow: 0 2px 6px rgba(37, 99, 235, 0.3);
}

.oneui-alarm-quick-buttons {
  display: flex;
  gap: 8px;
  margin-top: 10px;
  flex-wrap: wrap;
}

.oneui-alarm-quick-buttons > button {
  min-height: 38px !important;
  padding: 6px 12px !important;
  font-size: 0.8125rem !important;
  border-radius: 10px !important;
}

/* ==========================================================================
   DOUBLE-BEZEL & HARDWARE ARCHITECTURE (TODAS LAS HERRAMIENTAS)
   ========================================================================== */
.page .panel,
.page .stat-card,
.page .list-card,
.page .tool-hub-card,
.page .module-card,
.page .flight-plan-card,
.page .summary-chip {
  border-radius: 22px !important;
  border: 1px solid var(--crew-divider) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 8px 24px rgba(0, 0, 0, 0.05) !important;
  transition: transform 0.24s cubic-bezier(0.32, 0.72, 0, 1), box-shadow 0.24s ease, border-color 0.24s ease !important;
}

.page .panel:hover,
.page .stat-card:hover,
.page .list-card:hover,
.page .tool-hub-card:hover {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--crew-divider)) !important;
}

/* Botones Button-in-Button táctiles */
.page :is(.primary-button, .secondary-button),
.modal :is(.primary-button, .secondary-button) {
  border-radius: 14px !important;
  transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.2s ease !important;
}

.page :is(.primary-button, .secondary-button):active,
.modal :is(.primary-button, .secondary-button):active {
  transform: scale(0.97) !important;
}

/* ==========================================================================
   MOBILE BOTTOM SHEET SYSTEM (VISTA MÓVIL SUPERIOR)
   ========================================================================== */
@media (max-width: 768px) {
  .modal-backdrop {
    align-items: flex-end !important;
    padding: 0 !important;
  }

  .modal {
    width: 100% !important;
    max-width: 100% !important;
    max-height: 90vh !important;
    border-radius: 28px 28px 0 0 !important;
    padding: 12px 18px max(24px, env(safe-area-inset-bottom)) !important;
    margin: 0 !important;
    box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.28) !important;
    animation: oneuiSheetSlideUp 0.34s cubic-bezier(0.32, 0.72, 0, 1) !important;
  }

  .modal-drag-handle {
    display: block !important;
    width: 42px !important;
    height: 5px !important;
    border-radius: 999px !important;
    background: rgba(150, 150, 150, 0.35) !important;
    margin: 4px auto 14px !important;
  }

  @keyframes oneuiSheetSlideUp {
    from {
      transform: translate3d(0, 100%, 0);
      opacity: 0.6;
    }
    to {
      transform: translate3d(0, 0, 0);
      opacity: 1;
    }
  }

  .oneui-clock-hero {
    flex-direction: column;
    align-items: flex-start;
    padding: 18px 20px;
    gap: 14px;
  }

  .oneui-clock-hero-countdown {
    width: 100%;
  }

  /* Padding inferior para proteger contra la barra inferior flotante */
  .page-container {
    padding-bottom: calc(90px + env(safe-area-inset-bottom)) !important;
  }
}

/* ==========================================================================
   BoA Crew · Registro One UI 9 & Sincronización Google Personal
   ========================================================================== */

.google-sync-card {
  border-radius: 18px;
  padding: 14px 16px;
  margin-bottom: 12px;
  background: var(--surface-card, rgba(255, 255, 255, 0.04));
  border: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.08));
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  transition: all 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}

.google-sync-card.is-connected {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.08) 0%, rgba(56, 189, 248, 0.05) 100%);
  border-color: rgba(16, 185, 129, 0.35);
  box-shadow: 0 4px 20px rgba(16, 185, 129, 0.08);
}

.google-sync-card.is-disconnected {
  border-left: 3px solid #4285F4;
}

.google-sync-card-header {
  display: flex;
  align-items: center;
  gap: 12px;
}

.google-sync-logo-badge {
  width: 38px;
  height: 38px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.06);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.google-sync-header-text strong {
  display: block;
  font-size: 14px;
  font-weight: 700;
  color: var(--text-primary, #f8fafc);
}

.google-sync-header-text p {
  margin: 2px 0 0 0;
  font-size: 12px;
  color: var(--text-secondary, #94a3b8);
  line-height: 1.35;
}

.google-sync-card-body {
  margin-top: 10px;
}

.google-sync-action-row {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.google-sync-trigger-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 16px !important;
  border-radius: 999px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  background: #ffffff !important;
  color: #1e293b !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;
  cursor: pointer;
  border: none !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.google-sync-trigger-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25) !important;
}

.google-sync-tip {
  font-size: 11.5px;
  color: var(--text-muted, #94a3b8);
}

.google-connected-pill {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 12px;
  background: rgba(16, 185, 129, 0.12);
  border: 1px solid rgba(16, 185, 129, 0.25);
}

.google-avatar-small {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  object-fit: cover;
  border: 1.5px solid #10b981;
}

.google-connected-info {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.google-user-name {
  font-size: 13px;
  font-weight: 600;
  color: #10b981;
}

.google-user-email {
  font-size: 11.5px;
  color: var(--text-secondary, #94a3b8);
}

.compact-btn {
  padding: 5px 10px !important;
  font-size: 11.5px !important;
  border-radius: 8px !important;
}

/* ==========================================================================
   Correo Institucional BoA (@boa.bo) Destacado
   ========================================================================== */

.boa-email-container {
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(2, 132, 199, 0.06);
  border: 1px solid rgba(56, 189, 248, 0.28);
}

.boa-email-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6px;
  font-size: 13px;
  font-weight: 700;
  color: var(--text-primary, #f8fafc);
}

.boa-req-tag {
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(239, 68, 68, 0.18);
  color: #f87171;
  font-weight: 700;
  letter-spacing: 0.2px;
}

.boa-email-shell {
  position: relative;
  display: flex;
  align-items: center;
}

.boa-email-input {
  padding-right: 74px !important;
  font-weight: 600 !important;
  letter-spacing: 0.2px;
}

.boa-domain-suffix {
  position: absolute;
  right: 8px;
  padding: 3px 8px;
  border-radius: 8px;
  font-size: 11.5px;
  font-weight: 700;
  color: #38bdf8;
  background: rgba(56, 189, 248, 0.15);
  pointer-events: none;
}

.boa-email-help-text {
  display: block;
  margin-top: 6px;
  font-size: 11.5px;
  color: var(--text-secondary, #94a3b8);
  line-height: 1.35;
  transition: color 0.2s ease;
}

.boa-email-help-text.valid {
  color: #10b981 !important;
  font-weight: 600;
}

.boa-email-help-text.invalid {
  color: #ef4444 !important;
  font-weight: 600;
}

/* ==========================================================================
   Medidor Visual Dinámico de Contraseña One UI 9
   ========================================================================== */

.reg-password-wrapper {
  margin-top: 4px;
}

.password-meter-panel {
  margin-top: 8px;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.06));
}

.password-meter-bar-track {
  width: 100%;
  height: 6px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  overflow: hidden;
  margin-bottom: 8px;
}

.password-meter-bar-fill {
  height: 100%;
  width: 0%;
  border-radius: 999px;
  background: var(--danger, #ef4444);
  transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.3s ease;
}

.password-meter-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
  font-size: 12px;
}

.password-meter-status-text {
  font-weight: 600;
  color: var(--text-secondary, #94a3b8);
  transition: color 0.2s ease;
}

.password-meter-pct {
  font-weight: 700;
  font-size: 11px;
  color: var(--text-muted, #64748b);
}

.password-meter-reqs-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 6px;
}

.req-chip {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  color: var(--text-muted, #64748b);
  padding: 4px 8px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid transparent;
  transition: all 0.2s ease;
}

.req-chip svg {
  width: 13px;
  height: 13px;
  stroke: currentColor;
  opacity: 0.3;
  transition: opacity 0.2s ease;
}

.req-chip.met {
  color: #10b981;
  background: rgba(16, 185, 129, 0.1);
  border-color: rgba(16, 185, 129, 0.25);
  font-weight: 600;
}

.req-chip.met svg {
  opacity: 1;
}

/* ==========================================================================
   BOTÓN RÁPIDO DE GENERAR CONTRASEÑA Y SELECTORES ONE UI
   ========================================================================== */
.reg-password-header-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}

.generate-pwd-btn {
  background: rgba(56, 189, 248, 0.12) !important;
  color: var(--text-accent, #38bdf8) !important;
  border: 1px solid rgba(56, 189, 248, 0.35) !important;
  font-size: 12px;
  font-weight: 600;
  border-radius: 10px;
  padding: 5px 12px;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

.generate-pwd-btn:hover {
  background: rgba(56, 189, 248, 0.22) !important;
  border-color: rgba(56, 189, 248, 0.6) !important;
  transform: translateY(-1px);
}

.generate-pwd-btn:active {
  transform: translateY(0);
}

.reg-base-select,
.reg-position-select {
  cursor: pointer;
  background-position: right 14px center;
  font-weight: 500;
}

/* ==========================================================================
   WIDGET FLOTA BoA EN TIEMPO REAL (DASHBOARD)
   ========================================================================== */
.radar-fleet-widget,
.radar-fleet-side-card {
  position: relative;
  overflow: hidden;
  background: linear-gradient(145deg, rgba(13, 43, 96, 0.35), rgba(15, 23, 42, 0.55));
  border: 1px solid rgba(56, 189, 248, 0.2);
  border-radius: 18px;
}

.radar-fleet-preview {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 4px 0;
}

.radar-fleet-status-line {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.fleet-live-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #10b981;
  box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7);
  animation: fleet-pulse 2s infinite;
  display: inline-block;
  flex-shrink: 0;
}

@keyframes fleet-pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7);
  }
  70% {
    box-shadow: 0 0 0 7px rgba(16, 185, 129, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(16, 185, 129, 0);
  }
}

.radar-fleet-status-line strong {
  font-size: 13.5px;
  font-weight: 700;
  color: var(--text-primary, #f8fafc);
}

.radar-fleet-status-line small {
  font-size: 11.5px;
  color: var(--text-muted, #94a3b8);
  width: 100%;
}

.radar-fleet-stats-row {
  display: flex;
  gap: 8px;
  margin-top: 2px;
}

.fleet-stat-badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.3px;
  border: 1px solid transparent;
}

.fleet-stat-badge.boeing {
  background: rgba(56, 189, 248, 0.12);
  color: #38bdf8;
  border-color: rgba(56, 189, 248, 0.28);
}

.fleet-stat-badge.airbus {
  background: rgba(245, 158, 11, 0.12);
  color: #fbbf24;
  border-color: rgba(245, 158, 11, 0.28);
}

.fleet-stat-badge.crj {
  background: rgba(168, 85, 247, 0.12);
  color: #c084fc;
  border-color: rgba(168, 85, 247, 0.28);
}

.boa-fleet-toggle-btn {
  font-weight: 600;
  transition: all 0.2s ease;
}

.boa-fleet-toggle-btn.active-toggle {
  background: rgba(13, 43, 96, 0.8) !important;
  color: #38bdf8 !important;
  border-color: #38bdf8 !important;
  box-shadow: 0 0 10px rgba(56, 189, 248, 0.25);
}

/* ==========================================================================
   MODO CABINA OSCURA OLED (NIGHT FLIGHT DECK)
   ========================================================================== */
[data-theme="night-deck"] {
  /* Legacy design tokens are still consumed by the operational modules. */
  --bg: #000000;
  --surface: #06090e;
  --surface-2: #0a0f18;
  --text: #eef4fc;
  --muted: #a4b0c2;
  --border: rgba(255, 255, 255, 0.12);
  --navy-soft: #0d1726;
  --brand: #38bdf8;
  --shadow: 0 18px 48px rgba(0, 0, 0, .58);
  --shadow-sm: 0 8px 22px rgba(0, 0, 0, .46);
  --bg-app: #000000;
  --bg-surface: #06090e;
  --bg-surface-elevated: #0a0f18;
  --bg-card: #080d16;
  --bg-card-hover: #0d1524;
  --border-subtle: rgba(255, 255, 255, 0.05);
  --border-card: rgba(255, 255, 255, 0.07);
  --text-primary: #e2e8f0;
  --text-secondary: #8896aa;
  --text-muted: #526075;
  --text-accent: #38bdf8;
  --accent: #0284c7;
  --primary: #0284c7;
  --primary-hover: #0369a1;
  --danger: #ef4444;
  --warning: #f59e0b;
  --success: #10b981;
}

[data-theme="night-deck"] body {
  background-color: #000000;
  color: #e2e8f0;
}

[data-theme="night-deck"] .topbar,
[data-theme="night-deck"] .sidebar,
[data-theme="night-deck"] .mobile-nav,
[data-theme="night-deck"] .feed-card,
[data-theme="night-deck"] .panel,
[data-theme="night-deck"] .dashboard-side-card {
  background: #06090e !important;
  border-color: rgba(255, 255, 255, 0.06) !important;
}

[data-theme="night-deck"] .input-control,
[data-theme="night-deck"] .select-control {
  background: #030509 !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: #f1f5f9 !important;
}

[data-theme="night-deck"] :is(.panel-header h1,.panel-header h2,.panel-header h3,.page-header h1,.field,.per-diem-result-panel h2,.per-diem-input-panel h2) {
  color: #eef4fc;
}

[data-theme="night-deck"] :is(.panel-header p,.page-header p,.field small) {
  color: #a4b0c2;
}

[data-theme="night-deck"] #brand-name { color: #eef4fc; }
[data-theme="night-deck"] #brand-subtitle { color: #a4b0c2; }

[data-theme="night-deck"] .leaflet-tile-pane {
  filter: brightness(0.65) contrast(1.15) !important;
}

/* Reloj Aeronáutico Dual (UTC Zulú + Local BOB) */
.aviation-clock-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(15, 23, 42, 0.65);
  border: 1px solid rgba(56, 189, 248, 0.25);
  border-radius: 9999px;
  padding: 4px 10px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 11.5px;
  color: var(--text-primary, #e2e8f0);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  white-space: nowrap;
}

.aviation-clock-pill .clock-utc {
  color: #38bdf8;
  font-weight: 700;
  letter-spacing: 0.03em;
}

.aviation-clock-pill .clock-sep {
  color: var(--text-muted, #64748b);
  opacity: 0.6;
}

.aviation-clock-pill .clock-local {
  color: #94a3b8;
  font-weight: 500;
}

@media (max-width: 520px) {
  .aviation-clock-pill {
    display: none !important;
  }
}

@media (max-width: 768px) {
  .aviation-clock-pill .clock-local,
  .aviation-clock-pill .clock-sep {
    display: none;
  }
}

/* Radar Aeronáutico: Botones de Bases & Telemetría */
.radar-quick-bases {
  display: flex;
  align-items: center;
  gap: 5px;
}

.compact-base-btn {
  background: rgba(15, 23, 42, 0.7);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: var(--text-secondary, #cbd5e1);
  border-radius: 6px;
  padding: 3px 7px;
  font-size: 10.5px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.15s ease;
}

.compact-base-btn:hover {
  background: rgba(56, 189, 248, 0.2);
  border-color: rgba(56, 189, 248, 0.4);
  color: #38bdf8;
}

.fr24-body-badge {
  font-size: 9.5px;
  padding: 2px 5px;
  border-radius: 4px;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.fr24-body-badge.widebody {
  background: rgba(168, 85, 247, 0.18);
  color: #c084fc;
  border: 1px solid rgba(168, 85, 247, 0.35);
}

.fr24-body-badge.narrowbody {
  background: rgba(14, 165, 233, 0.18);
  color: #38bdf8;
  border: 1px solid rgba(14, 165, 233, 0.35);
}

.fr24-body-badge.regional {
  background: rgba(16, 185, 129, 0.18);
  color: #34d399;
  border: 1px solid rgba(16, 185, 129, 0.35);
}

/* Botón Hero de Registro y Acceso Directo con Google */
.google-auth-hero-card {
  margin: 18px 0 10px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.google-hero-button {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 13px 18px;
  background: #ffffff;
  color: #1f2937;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 14px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Google Sans", sans-serif;
  font-size: 14.5px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.06);
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  user-select: none;
}

.google-hero-button:hover:not(:disabled) {
  background: #f8fafc;
  box-shadow: 0 4px 14px rgba(66, 133, 244, 0.25), 0 2px 4px rgba(0, 0, 0, 0.08);
  transform: translateY(-1px);
}

.google-hero-button:active:not(:disabled) {
  transform: scale(0.985);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}

.google-hero-button:disabled {
  opacity: 0.75;
  cursor: not-allowed;
  transform: none;
}

.google-hero-subrow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 4px;
  font-size: 11.5px;
}

.google-hero-badge {
  color: var(--accent, #38bdf8);
  font-weight: 600;
}

.google-alt-link {
  background: none;
  border: none;
  color: var(--text-secondary, #94a3b8);
  font-size: 11.5px;
  cursor: pointer;
  text-decoration: underline;
  padding: 2px 4px;
  transition: color 0.15s ease;
}

.google-alt-link:hover {
  color: var(--text-primary, #f1f5f9);
}

.google-direct-reg-btn {
  background: #ffffff !important;
  color: #1f2937 !important;
  border: 1px solid rgba(0, 0, 0, 0.15) !important;
  font-weight: 600 !important;
  font-size: 13.5px !important;
  padding: 10px 16px !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1) !important;
  transition: all 0.2s ease !important;
}

.google-direct-reg-btn:hover:not(:disabled) {
  background: #f8fafc !important;
  box-shadow: 0 4px 12px rgba(66, 133, 244, 0.22) !important;
  transform: translateY(-1px);
}

.google-spinner-sm {
  width: 18px;
  height: 18px;
  border: 2.5px solid rgba(66, 133, 244, 0.25);
  border-top-color: #4285F4;
  border-right-color: #34A853;
  border-bottom-color: #FBBC05;
  border-left-color: #EA4335;
  border-radius: 50%;
  animation: googleSpin 0.8s linear infinite;
  display: inline-block;
  vertical-align: middle;
}

/* Google Identity Services & Selector Oficial de Cuentas Google */
.google-id-window {
  display: flex;
  flex-direction: column;
  gap: 14px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  text-align: left;
}

.google-dialog-header {
  text-align: center;
  padding: 4px 0 10px;
  border-bottom: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.08));
}

.google-logo-wrapper {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 6px;
}

.google-dialog-title {
  font-size: 19px;
  font-weight: 500;
  margin: 0 0 4px;
  color: var(--text-primary, #f1f5f9);
}

.google-dialog-subtitle {
  font-size: 13px;
  color: var(--text-secondary, #94a3b8);
  margin: 0;
}

.google-accounts-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 4px 0;
}

.google-account-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 12px;
  background: var(--bg-surface-elevated, rgba(255, 255, 255, 0.03));
  border: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.08));
  cursor: pointer;
  transition: all 0.15s ease;
  user-select: none;
}

.google-account-card:hover,
.google-account-card:focus-visible {
  background: rgba(66, 133, 244, 0.08);
  border-color: rgba(66, 133, 244, 0.35);
  transform: translateY(-1px);
}

.google-avatar-badge {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 700;
  flex-shrink: 0;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}

.google-add-badge {
  background: rgba(255, 255, 255, 0.06);
  color: #38bdf8;
  font-size: 20px;
  border: 1px dashed rgba(255, 255, 255, 0.2);
}

.google-account-text {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
  overflow: hidden;
}

.google-account-name {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--text-primary, #f1f5f9);
}

.google-account-email {
  font-size: 12px;
  color: var(--text-secondary, #94a3b8);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.google-connected-tag {
  display: inline-block;
  font-size: 10px;
  font-weight: 600;
  color: #34d399;
  margin-top: 2px;
}

.google-connected-tag.google-ws-tag {
  color: #60a5fa;
}

.google-action-arrow {
  font-size: 18px;
  color: var(--text-muted, #64748b);
  opacity: 0.6;
  transition: transform 0.15s ease;
}

.google-account-card:hover .google-action-arrow {
  transform: translateX(3px);
  color: #38bdf8;
  opacity: 1;
}

.google-consent-view {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.google-selected-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  background: rgba(66, 133, 244, 0.08);
  border: 1px solid rgba(66, 133, 244, 0.25);
  border-radius: 10px;
}

.google-scope-card {
  background: var(--bg-surface-elevated, rgba(255, 255, 255, 0.03));
  border: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.06));
  border-radius: 12px;
  padding: 12px 14px;
}

.google-scope-card h4 {
  margin: 0 0 10px 0;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--text-muted, #94a3b8);
}

.google-scope-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.google-scope-list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 12px;
  line-height: 1.35;
}

.google-scope-list li strong {
  display: block;
  color: var(--text-primary, #f1f5f9);
}

.google-scope-list li small {
  color: var(--text-secondary, #94a3b8);
}

.google-privacy-note {
  font-size: 11px;
  color: var(--text-muted, #94a3b8);
  line-height: 1.4;
  margin: 0;
  text-align: center;
}

.google-consent-buttons {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 6px;
}

.google-btn-cancel {
  background: transparent;
  border: 1px solid var(--border-card, rgba(255, 255, 255, 0.12));
  color: var(--text-secondary, #cbd5e1);
  padding: 8px 16px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s ease;
}

.google-btn-cancel:hover {
  background: rgba(255, 255, 255, 0.05);
}

.google-btn-primary {
  background: #1a73e8;
  color: #ffffff;
  border: none;
  padding: 9px 20px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  transition: all 0.15s ease;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.google-btn-primary:hover {
  background: #1557b0;
  box-shadow: 0 2px 6px rgba(26, 115, 232, 0.4);
}

.google-loading-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
  text-align: center;
  gap: 10px;
}

.google-spinner {
  width: 34px;
  height: 34px;
  border: 3px solid rgba(66, 133, 244, 0.15);
  border-top-color: #4285f4;
  border-right-color: #34a853;
  border-bottom-color: #fbbc05;
  border-left-color: #ea4335;
  border-radius: 50%;
  animation: google-spin 0.85s linear infinite;
}

@keyframes google-spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* ==========================================================================
   BLINDAJE DE SILUETAS DE AERONAVES FLIGHTRADAR24 (TRANSPARENCIA TOTAL)
   ========================================================================== */
.leaflet-div-icon,
.leaflet-div-icon.aircraft-map-marker-shell,
.aircraft-map-marker-shell,
.aircraft-map-marker-shell *,
.fr24-clean-marker-shell,
.fr24-clean-marker-shell * {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}

.fr24-aircraft-marker {
  width: 38px !important;
  height: 38px !important;
  display: grid !important;
  place-items: center !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  padding: 0 !important;
}

.fr24-aircraft-marker .fr24-marker-label {
  display: none !important;
}