/*!*****************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[3]!./src/styles/base.css ***!
  \*****************************************************************************************************************************************************************************************************************************************************************/
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600;700&family=IBM+Plex+Sans:wght@400;500;600&display=swap');

/* Base layer */

:where(a, button, input, select, textarea, [role="button"], [tabindex]):focus-visible {
  outline: 3px solid var(--color-input-focus);
  outline-offset: 2px;
}

:where(button, input, select, textarea):disabled {
  cursor: not-allowed;
  color: var(--color-button-disabled-text);
}

/*!*******************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[3]!./src/styles/tokens.css ***!
  \*******************************************************************************************************************************************************************************************************************************************************************/
/* Tokens layer (v1): centralized semantic state tokens */

:root {
  --color-bg: var(--bg);
  --color-app-shell: var(--bg);
  --color-surface: var(--surface);
  --color-surface-elevated: var(--surface-2);
  --color-surface-muted: color-mix(in srgb, var(--surface) 80%, var(--surface-2));
  --color-card: var(--panel-bg);
  --color-card-hover: color-mix(in srgb, var(--surface) 88%, var(--surface-2));
  --color-border: var(--border);
  --color-border-strong: var(--border-default);

  --color-text-primary: var(--ink);
  --color-text-secondary: var(--ink-muted);
  --color-text-muted: var(--ink-muted);
  --color-text-disabled: color-mix(in srgb, var(--ink-muted) 72%, transparent);
  --color-text-inverse: var(--accent-ink);

  --color-accent: var(--accent);
  --color-accent-hover: color-mix(in srgb, var(--accent) 88%, #ffffff 12%);
  --color-accent-pressed: color-mix(in srgb, var(--accent) 80%, #000000 20%);
  --color-accent-text: var(--accent-ink);

  --color-chip-bg: color-mix(in srgb, var(--surface) 90%, var(--surface-2));
  --color-chip-text: var(--ink);
  --color-chip-border: color-mix(in srgb, var(--border) 84%, transparent);

  --color-input-bg: var(--input-bg);
  --color-input-text: var(--color-text-primary);
  --color-input-placeholder: var(--placeholder);
  --color-input-border: var(--qs-input-border);
  --color-input-focus: var(--border-focus);

  --color-button-primary-bg: var(--accent);
  --color-button-primary: var(--accent);
  --color-button-primary-text: var(--accent-ink);
  --color-button-secondary: var(--surface-2);
  --color-button-secondary-text: var(--ink);
  --color-button-secondary-border: var(--border-default);
  --color-button-disabled-bg: color-mix(in srgb, var(--surface) 82%, var(--surface-2));
  --color-button-disabled-text: var(--color-text-disabled);

  --color-badge-bg: color-mix(in srgb, var(--color-chip-bg) 86%, var(--color-surface));
  --color-badge-text: var(--color-text-primary);
  --color-badge-border: color-mix(in srgb, var(--color-border) 84%, transparent);

  --color-footer-bg: color-mix(in srgb, var(--bg) 92%, var(--surface) 8%);
  --color-footer-border: color-mix(in srgb, var(--border) 74%, transparent);
  --color-footer-title: var(--ink);
  --color-footer-text: var(--ink-muted);
  --color-footer-muted: color-mix(in srgb, var(--ink-muted) 94%, var(--ink) 6%);
  --color-footer-link: var(--accent);
  --color-footer-link-hover: color-mix(in srgb, var(--accent) 82%, var(--ink) 18%);
  --color-footer-icon: var(--accent-2);
  --color-overlay: var(--overlay);
  --color-dropdown-bg: color-mix(in srgb, var(--surface) 94%, var(--surface-2));
  --color-dropdown-border: var(--color-border);
  --color-dropdown-hover: color-mix(in srgb, var(--surface) 72%, var(--surface-2));

  --space-section-sm: 0.5rem;
  --space-section-md: 1rem;
  --space-section-lg: 1.5rem;
  --space-panel-padding: 1rem;
  --space-panel-header-gap: 0.75rem;
  --text-meta-size: 0.88rem;

  --dashboard-section-gap: 2.1rem;
  --dashboard-block-gap: 1.15rem;
  --dashboard-muted-size: 0.88rem;
  --dashboard-muted-tone: var(--ink-muted);

  --state-success-bg: rgba(46, 110, 98, 0.12);
  --state-success-border: rgba(46, 110, 98, 0.4);
  --state-success-text: var(--ink);
  --state-success-icon: var(--accent-2);

  --state-warning-bg: rgba(205, 154, 86, 0.12);
  --state-warning-border: rgba(205, 154, 86, 0.42);
  --state-warning-text: var(--ink);
  --state-warning-icon: #b67722;

  --state-error-bg: rgba(217, 93, 57, 0.12);
  --state-error-border: rgba(217, 93, 57, 0.4);
  --state-error-text: var(--ink);
  --state-error-icon: var(--accent);

  --state-info-bg: rgba(79, 127, 166, 0.1);
  --state-info-border: rgba(79, 127, 166, 0.36);
  --state-info-text: var(--ink);
  --state-info-icon: #4f7fa6;

  --landing-glow-warm: rgba(217, 93, 57, 0.14);
  --landing-route-line: color-mix(in srgb, var(--accent-2) 46%, var(--border));
  --landing-runway-light: color-mix(in srgb, var(--accent) 34%, #ffd6a8);
  --landing-terminal-glass: color-mix(in srgb, var(--surface) 84%, transparent);
  --landing-signal-active: color-mix(in srgb, var(--state-success-border) 86%, var(--accent-2));
  --landing-flight-strip-border: color-mix(in srgb, var(--border) 84%, var(--accent) 16%);

  /* Shell header morph tokens (sticky nav with container-type: scroll-state morph) */
  --shell-header-top: 0px;
  --shell-header-z: 50;
  --shell-header-resting-padding-block: 0.5rem;
  --shell-header-resting-padding-inline: 1.1rem;
  --shell-header-resting-radius: 14px;
  --shell-header-resting-bg: color-mix(in srgb, var(--bg) 92%, transparent);
  --shell-header-resting-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
  --shell-header-resting-border: 1px solid color-mix(in srgb, var(--border) 76%, transparent);
  --shell-header-stuck-padding-block: 0.4rem;
  --shell-header-stuck-padding-inline: 0.85rem;
  --shell-header-stuck-radius: 18px;
  --shell-header-stuck-bg: color-mix(in srgb, var(--surface) 86%, transparent);
  --shell-header-stuck-shadow: 0 12px 26px color-mix(in srgb, var(--shadow-strong) 18%, transparent);
  --shell-header-stuck-border: 1px solid color-mix(in srgb, var(--border) 88%, var(--accent) 12%);
  --shell-header-stuck-backdrop-blur: 14px;
  --shell-header-stuck-max-width: 1080px;
  --shell-header-transition-duration: 220ms;
  --shell-header-transition-ease: cubic-bezier(0.2, 0, 0, 1);
}

:root[data-theme="dark"] {
  --color-card-hover: color-mix(in srgb, var(--surface) 84%, var(--surface-2));
  --color-surface-muted: color-mix(in srgb, var(--surface) 70%, var(--surface-2));
  --color-text-disabled: color-mix(in srgb, var(--ink-muted) 70%, transparent);
  --color-accent-hover: color-mix(in srgb, var(--accent) 86%, #ffffff 14%);
  --color-accent-pressed: color-mix(in srgb, var(--accent) 78%, #000000 22%);
  --color-chip-bg: color-mix(in srgb, var(--surface) 78%, #ffffff 5%);
  --color-chip-border: color-mix(in srgb, var(--border) 92%, var(--accent-2) 8%);
  --color-footer-bg: color-mix(in srgb, var(--bg) 96%, var(--surface) 4%);
  --color-footer-border: color-mix(in srgb, var(--border) 88%, transparent);
  --color-footer-title: var(--ink);
  --color-footer-text: var(--ink-muted);
  --color-footer-muted: color-mix(in srgb, var(--ink-muted) 92%, var(--ink) 8%);
  --color-footer-link: var(--accent);
  --color-footer-link-hover: color-mix(in srgb, var(--accent) 84%, var(--ink) 16%);
  --color-footer-icon: var(--accent-2);
  --color-dropdown-bg: color-mix(in srgb, var(--surface) 84%, #101513 16%);

  --state-success-bg: color-mix(in srgb, #2e6e62 28%, transparent);
  --state-success-border: color-mix(in srgb, #2e6e62 55%, #d7e5df 18%);
  --state-success-text: var(--ink);

  --state-warning-bg: color-mix(in srgb, #cd9a56 24%, transparent);
  --state-warning-border: color-mix(in srgb, #cd9a56 55%, #f1dfc3 16%);
  --state-warning-text: var(--ink);

  --state-error-bg: color-mix(in srgb, #d95d39 25%, transparent);
  --state-error-border: color-mix(in srgb, #d95d39 56%, #f3d0c5 16%);
  --state-error-text: var(--ink);

  --state-info-bg: color-mix(in srgb, #4f7fa6 22%, transparent);
  --state-info-border: color-mix(in srgb, #4f7fa6 52%, #cfdceb 16%);
  --state-info-text: var(--ink);

  --landing-glow-warm: rgba(217, 93, 57, 0.18);
  --landing-route-line: color-mix(in srgb, var(--accent-2) 54%, #8ab8d4);
  --landing-runway-light: color-mix(in srgb, var(--accent) 46%, #ffd9b2);
  --landing-terminal-glass: color-mix(in srgb, var(--surface) 74%, #ffffff 6%);
  --landing-signal-active: color-mix(in srgb, var(--state-success-border) 84%, #b0d8c7);
  --landing-flight-strip-border: color-mix(in srgb, var(--border) 78%, var(--accent-2) 22%);

  /* Dark theme shell header morph */
  --shell-header-resting-bg: color-mix(in srgb, var(--bg) 96%, transparent);
  --shell-header-resting-shadow: 0 6px 16px rgba(0, 0, 0, 0.4);
  --shell-header-stuck-bg: color-mix(in srgb, var(--surface) 78%, transparent);
  --shell-header-stuck-shadow: 0 14px 28px rgba(0, 0, 0, 0.5);
}

/*!***********************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[3]!./src/styles/components.css ***!
  \***********************************************************************************************************************************************************************************************************************************************************************/
/* Components layer (v1): shared component primitives are progressively centralized here. */

/* ============================================================
   SHELL HEADER (sticky morph) — progressive enhancement.
   Resting state always works. Morph uses container-type: scroll-state
   when the browser supports it. No JS observer required.
   ============================================================ */
.shell-header {
  position: -webkit-sticky;
  position: sticky;
  top: var(--shell-header-top);
  z-index: var(--shell-header-z);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.9rem;
  width: 100%;
  box-sizing: border-box;
  padding: var(--shell-header-resting-padding-block) var(--shell-header-resting-padding-inline);
  border-radius: 0;
  border-bottom: var(--shell-header-resting-border);
  background: var(--shell-header-resting-bg);
  box-shadow: var(--shell-header-resting-shadow);
  transition:
    padding var(--shell-header-transition-duration) var(--shell-header-transition-ease),
    background-color var(--shell-header-transition-duration) var(--shell-header-transition-ease),
    box-shadow var(--shell-header-transition-duration) var(--shell-header-transition-ease),
    border-radius var(--shell-header-transition-duration) var(--shell-header-transition-ease);
}

@supports (container-type: scroll-state) {
  .shell-header {
    container-type: scroll-state;
  }
}

@container scroll-state(stuck: top) {
  .shell-header {
    padding: var(--shell-header-stuck-padding-block) var(--shell-header-stuck-padding-inline);
    border-radius: var(--shell-header-stuck-radius);
    border-bottom: none;
    border: var(--shell-header-stuck-border);
    background: var(--shell-header-stuck-bg);
    box-shadow: var(--shell-header-stuck-shadow);
    -webkit-backdrop-filter: blur(var(--shell-header-stuck-backdrop-blur)) saturate(140%);
    backdrop-filter: blur(var(--shell-header-stuck-backdrop-blur)) saturate(140%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .shell-header {
    transition: none;
  }
}

/* ============================================================
   PUBLIC SHELL HEADER — sister of .shell-header.
   Same sticky/morph base; different content slot.
   Used by (public)/layout.tsx for all public routes.
   ============================================================ */
.public-shell-header {
  gap: 0.9rem;
}

.public-shell-brand {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  color: var(--ink);
  text-decoration: none;
  font-weight: 700;
  font-size: 0.98rem;
  letter-spacing: -0.005em;
  white-space: nowrap;
  min-width: 0;
}

.public-shell-brand:hover,
.public-shell-brand:focus-visible {
  color: var(--ink);
  text-decoration: none;
}

.public-shell-brand-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #f6cdb6, var(--accent));
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--accent) 12%, transparent);
  flex: none;
}

.public-shell-brand-label {
  font-family: "Playfair Display", serif;
  font-size: 1.05rem;
}

.public-shell-nav {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin: 0 auto;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: none;
}

.public-shell-nav::-webkit-scrollbar {
  display: none;
}

.public-shell-nav-link {
  display: inline-flex;
  align-items: center;
  padding: 0.4rem 0.7rem;
  border-radius: 999px;
  color: var(--ink);
  text-decoration: none;
  font-weight: 600;
  font-size: 0.86rem;
  white-space: nowrap;
  border: 1px solid transparent;
  transition:
    color 180ms var(--shell-header-transition-ease),
    background-color 180ms var(--shell-header-transition-ease),
    border-color 180ms var(--shell-header-transition-ease);
}

.public-shell-nav-link:hover,
.public-shell-nav-link:focus-visible {
  color: var(--ink);
  background: color-mix(in srgb, var(--surface-2) 78%, transparent);
  border-color: color-mix(in srgb, var(--border) 70%, transparent);
  outline: none;
}

.public-shell-nav-link.is-active {
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  border-color: color-mix(in srgb, var(--accent) 38%, transparent);
  color: var(--ink);
}

.public-shell-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  flex: none;
}

@media (max-width: 720px) {
  .public-shell-header {
    gap: 0.55rem;
  }

  .public-shell-nav {
    margin: 0;
    gap: 0.2rem;
  }

  .public-shell-nav-link {
    font-size: 0.8rem;
    padding: 0.32rem 0.55rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .public-shell-nav-link {
    transition: none;
  }
}



.panel {
  background: var(--panel-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: var(--space-panel-padding);
  box-shadow: 0 18px 36px var(--shadow);
}

.panel-soft {
  background: var(--surface);
  border-color: rgba(217, 205, 187, 0.7);
  box-shadow: none;
}

.panel-title {
  margin: 0;
  font-family: "IBM Plex Sans", sans-serif;
  font-size: 1.28rem;
  line-height: 1.18;
  letter-spacing: -0.01em;
}

.panel-subtitle {
  margin: 0.25rem 0 0;
  color: var(--ink-muted);
  font-size: 0.9rem;
}

.panel-note {
  color: var(--ink-muted);
  font-size: var(--text-meta-size);
}

.page-header {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  grid-gap: 1rem;
  gap: 1rem;
  align-items: center;
  margin-bottom: 1.1rem;
  padding-bottom: 0.65rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
}

.row-between {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  min-width: 0;
}

.panel-header h2 {
  margin: 0;
  font-family: "IBM Plex Sans", sans-serif;
}

.panel-actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.list-row {
  display: flex;
  justify-content: space-between;
  margin-bottom: 0.5rem;
  gap: 1rem;
  align-items: center;
  padding: 0.35rem 0;
  border-bottom: 1px dashed var(--border);
}

.list-row:last-child {
  border-bottom: none;
}

.section-gap {
  margin-top: var(--space-section-md);
}

.section-gap-lg {
  margin-top: var(--space-section-lg);
}

.section-gap-sm {
  margin-top: var(--space-section-sm);
}

.notice-compact {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding-block: 0.62rem;
}

.notice-compact p {
  margin: 0.22rem 0 0;
  font-size: var(--text-meta-size);
}

.notice-actions {
  display: inline-flex;
  gap: 0.45rem;
  flex-wrap: wrap;
}

.card {
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface);
  box-shadow: 0 8px 20px var(--shadow);
}

.panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding-bottom: 0.45rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
}

.action-row,
.row-actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  align-items: center;
  min-width: 0;
}

.row-actions > * {
  min-width: 0;
}

.state-success,
.state-warning,
.state-error,
.state-info {
  border-width: 1px;
  border-style: solid;
  font-weight: 600;
}

.state-success {
  background: var(--state-success-bg);
  border-color: var(--state-success-border);
  color: var(--state-success-text);
}

.state-warning {
  background: var(--state-warning-bg);
  border-color: var(--state-warning-border);
  color: var(--state-warning-text);
}

.state-error {
  background: var(--state-error-bg);
  border-color: var(--state-error-border);
  color: var(--state-error-text);
}

.state-info {
  background: var(--state-info-bg);
  border-color: var(--state-info-border);
  color: var(--state-info-text);
}

.status-pill {
  display: inline-flex;
  align-items: center;
  padding: 0.18rem 0.55rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--surface);
  font-size: 0.74rem;
  font-weight: 700;
}

.status-pill.success {
  background: var(--state-success-bg);
  border-color: var(--state-success-border);
  color: var(--state-success-text);
}

.status-pill.warning {
  background: var(--state-warning-bg);
  border-color: var(--state-warning-border);
  color: var(--state-warning-text);
}

.status-pill.error {
  background: var(--state-error-bg);
  border-color: var(--state-error-border);
  color: var(--state-error-text);
}

.status-pill.info {
  background: var(--state-info-bg);
  border-color: var(--state-info-border);
  color: var(--state-info-text);
}

.notification-center {
  position: fixed;
  top: 1.2rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 110;
  width: min(360px, calc(100vw - 1.4rem));
  display: grid;
  grid-gap: 0.6rem;
  gap: 0.6rem;
  pointer-events: none;
}

.notification-card {
  pointer-events: auto;
  border: 1px solid color-mix(in srgb, var(--border) 72%, white 28%);
  border-radius: 12px;
  background: color-mix(in srgb, var(--surface) 71%, transparent);
  -webkit-backdrop-filter: blur(15px) saturate(150%);
  backdrop-filter: blur(15px) saturate(150%);
  box-shadow:
    0 14px 30px var(--shadow-strong),
    inset 0 1px 0 rgba(255, 255, 255, 0.3);
  padding: 0.68rem 0.78rem;
  isolation: isolate;
}

.notification-card.notice-success {
  border-color: color-mix(in srgb, var(--state-success-border) 84%, var(--border));
  background: color-mix(in srgb, var(--surface) 82%, var(--state-success-bg));
  color: var(--state-success-text);
}

.notification-card.notice-warning {
  border-color: color-mix(in srgb, var(--state-warning-border) 84%, var(--border));
  background: color-mix(in srgb, var(--surface) 82%, var(--state-warning-bg));
  color: var(--state-warning-text);
}

.notification-card.notice-error {
  border-color: color-mix(in srgb, var(--state-error-border) 84%, var(--border));
  background: color-mix(in srgb, var(--surface) 82%, var(--state-error-bg));
  color: var(--state-error-text);
}

.notification-card.notice-info {
  border-color: color-mix(in srgb, var(--state-info-border) 84%, var(--border));
  background: color-mix(in srgb, var(--surface) 82%, var(--state-info-bg));
  color: var(--state-info-text);
}

.notification-card-head {
  display: grid;
  grid-template-columns: auto 1fr auto;
  grid-gap: 0.58rem;
  gap: 0.58rem;
  align-items: start;
}

.notification-card-icon {
  width: 24px;
  height: 24px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  margin-top: 0.08rem;
  background: color-mix(in srgb, var(--surface) 70%, transparent);
}

.notification-card-copy {
  display: grid;
  grid-gap: 0.16rem;
  gap: 0.16rem;
}

.notification-card-copy strong {
  line-height: 1.2;
  font-size: 0.9rem;
}

.notification-card-copy p {
  margin: 0;
  color: var(--ink-muted);
  font-size: 0.82rem;
  line-height: 1.38;
}

.notification-card-dismiss {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  border: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
  background: transparent;
  color: var(--ink-muted);
  display: grid;
  place-items: center;
  cursor: pointer;
}

.notification-card-dismiss:hover,
.notification-card-dismiss:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 40%, var(--border));
  color: var(--ink);
  outline: none;
}

.notification-card-actions {
  margin-top: 0.5rem;
  display: flex;
  justify-content: flex-end;
}

@media (max-width: 640px) {
  .notification-center {
    top: 0.72rem;
    width: min(360px, calc(100vw - 1rem));
  }
}

.viru-footer-block {
  position: relative;
  overflow: hidden;
  width: 100%;
  margin-top: 2.15rem;
  padding: 2.35rem 0 1.55rem;
  border-top: 1px solid var(--color-footer-border);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--color-footer-bg) 90%, var(--surface) 10%),
    var(--color-footer-bg)
  );
}

.viru-footer-block::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--color-footer-bg) 86%, var(--surface) 14%),
    color-mix(in srgb, var(--color-footer-bg) 96%, var(--surface) 4%)
  );
}

.viru-footer-shell {
  position: relative;
  z-index: 1;
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 2rem;
}

.viru-footer-glow {
  display: none;
}

.viru-footer-glow-primary {
  background: none;
}

.viru-footer-glow-secondary {
  background: none;
}

.viru-footer-top {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(280px, 0.82fr);
  grid-gap: 0.9rem 1.15rem;
  gap: 0.9rem 1.15rem;
  align-items: end;
  padding-bottom: 0.95rem;
  border-bottom: 1px solid var(--color-footer-border);
}

.viru-footer-brand {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-gap: 0.95rem;
  gap: 0.95rem;
  align-items: start;
}

.viru-footer-brand-mark {
  width: 56px;
  height: 56px;
  display: grid;
  place-items: center;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--color-footer-border) 84%, var(--surface) 16%);
  background: color-mix(in srgb, var(--surface) 86%, transparent);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--surface) 82%, transparent);
}

.viru-footer-brand-copy {
  display: grid;
  grid-gap: 0.28rem;
  gap: 0.28rem;
  min-width: 0;
}

.viru-footer-kicker {
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--color-footer-muted);
}

.viru-footer-brand-copy h2 {
  margin: 0;
  font-family: "Playfair Display", serif;
  font-size: clamp(1.45rem, 2.6vw, 2.3rem);
  line-height: 0.98;
  color: var(--color-footer-title);
}

.viru-footer-brand-copy p {
  margin: 0;
  max-width: 42rem;
  color: var(--color-footer-text);
  line-height: 1.62;
  overflow-wrap: anywhere;
}

.viru-footer-utility {
  display: grid;
  grid-gap: 0.9rem;
  gap: 0.9rem;
  justify-items: end;
  min-width: 0;
}

.viru-footer-status {
  display: grid;
  grid-gap: 0.15rem;
  gap: 0.15rem;
  justify-items: end;
  text-align: right;
}

.viru-footer-status-label {
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--color-footer-muted);
}

.viru-footer-status strong {
  font-size: 1rem;
  color: var(--color-footer-title);
}

.viru-footer-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  justify-content: flex-end;
  min-width: 0;
  width: 100%;
}

.viru-footer-actions > * {
  min-width: 0;
}

.viru-footer-chip,
.viru-footer-scroll {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-height: 40px;
  border-radius: 999px;
  border: 1px solid var(--color-chip-border);
  background: color-mix(in srgb, var(--color-chip-bg) 90%, transparent);
  color: var(--color-footer-title);
  text-decoration: none;
  padding: 0.62rem 0.9rem;
  font-size: 0.86rem;
  font-weight: 700;
  box-shadow: 0 12px 24px color-mix(in srgb, var(--shadow-strong) 20%, transparent);
  min-width: 0;
  max-width: 100%;
}

.viru-footer-chip span,
.viru-footer-scroll span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.viru-footer-chip:hover,
.viru-footer-scroll:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--color-footer-link) 34%, var(--color-footer-border));
}

.viru-footer-chip-ghost {
  cursor: pointer;
}

.viru-footer-scroll {
  cursor: pointer;
}

.viru-footer-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  grid-gap: 0.75rem 1rem;
  gap: 0.75rem 1rem;
  padding-top: 0.95rem;
}

.viru-footer-column {
  display: grid;
  grid-gap: 0.7rem;
  gap: 0.7rem;
  padding: 0.18rem 0.2rem 0.18rem 0;
}

.viru-footer-column-head h3 {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-footer-title);
}

.viru-footer-column ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-gap: 0.42rem;
  gap: 0.42rem;
}

.viru-footer-link {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  width: 100%;
  padding: 0.55rem 0.2rem;
  color: var(--color-footer-link);
  text-decoration: none;
  border-radius: 12px;
  min-width: 0;
}

.viru-footer-link span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.viru-footer-link i {
  width: 16px;
  text-align: center;
  color: var(--color-footer-icon);
}

.viru-footer-link:hover,
.viru-footer-link:focus-visible {
  color: var(--color-footer-link-hover);
  background: color-mix(in srgb, var(--color-dropdown-hover) 84%, transparent);
  outline: none;
}

.viru-footer-bottom {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.8rem 1.2rem;
  padding-top: 0.85rem;
  margin-top: 0.85rem;
  border-top: 1px solid var(--color-footer-border);
}

.viru-footer-bottom p {
  margin: 0;
  color: var(--color-footer-muted);
  font-size: 0.84rem;
  line-height: 1.5;
}

.viru-footer-bottom p:first-child {
  color: var(--color-footer-text);
}

@media (max-width: 920px) {
  .viru-footer-shell {
    padding: 0 1.25rem;
  }

  .viru-footer-top {
    grid-template-columns: 1fr;
  }

  .viru-footer-utility,
  .viru-footer-status {
    justify-items: start;
    text-align: left;
  }

  .viru-footer-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 640px) {
  .viru-footer-shell {
    padding: 0 1rem;
  }

  .viru-footer-grid {
    grid-template-columns: 1fr;
  }

  .viru-footer-chip,
  .viru-footer-scroll {
    width: 100%;
    justify-content: center;
  }

  .viru-footer-bottom {
    flex-direction: column;
  }
}

:root[data-theme="dark"] .viru-footer-brand-mark,
:root[data-theme="dark"] .viru-footer-chip,
:root[data-theme="dark"] .viru-footer-scroll {
  border-color: color-mix(in srgb, var(--color-footer-border) 92%, var(--accent-2) 8%);
  background: color-mix(in srgb, var(--surface) 76%, transparent);
  box-shadow:
    0 14px 28px color-mix(in srgb, var(--shadow-strong) 28%, transparent),
    inset 0 1px 0 color-mix(in srgb, var(--surface) 18%, transparent);
}

.viru-footer-landing .viru-footer-shell {
  max-width: 1600px;
  padding: 0 clamp(1rem, 2.8vw, 2.5rem);
}

.viru-footer-landing::before {
  background:
    radial-gradient(circle at 14% 26%, color-mix(in srgb, var(--landing-glow-warm) 56%, transparent), transparent 42%),
    linear-gradient(180deg, color-mix(in srgb, var(--color-footer-bg) 90%, var(--surface) 10%), color-mix(in srgb, var(--color-footer-bg) 97%, var(--surface) 3%));
}

.viru-footer-landing .viru-footer-top,
.viru-footer-landing .viru-footer-bottom {
  border-color: color-mix(in srgb, var(--color-footer-border) 78%, var(--landing-route-line) 22%);
}

.viru-footer-landing .viru-footer-brand-mark,
.viru-footer-landing .viru-footer-chip,
.viru-footer-landing .viru-footer-scroll {
  background: color-mix(in srgb, var(--landing-terminal-glass) 88%, transparent);
  border-color: color-mix(in srgb, var(--landing-flight-strip-border) 86%, transparent);
}

.viru-footer-landing .viru-footer-chip:hover,
.viru-footer-landing .viru-footer-scroll:hover {
  border-color: color-mix(in srgb, var(--landing-runway-light) 44%, var(--color-footer-border));
}

@media (max-width: 640px) {
  .viru-footer-landing .viru-footer-shell {
    padding: 0 1rem;
  }
}

/*!********************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[3]!./src/styles/screens.css ***!
  \********************************************************************************************************************************************************************************************************************************************************************/
:root {
  --bg: #f6f0e7;
  --surface: #fffaf4;
  --surface-2: #f4ede2;
  --surface-3: #fff3e2;
  --ink: #1f1d1a;
  --ink-muted: #5b5349;
  --accent: #d95d39;
  --accent-2: #2e6e62;
  --accent-ink: #fdf7ef;
  --border: #d9cdbb;
  --shadow: rgba(47, 40, 24, 0.08);
  --shadow-strong: rgba(32, 28, 21, 0.16);
  --overlay: rgba(31, 29, 26, 0.45);
  --bg-spot-1: #f9e5c5;
  --bg-spot-2: #cfe8df;
  --input-bg: #ffffff;
  --panel-bg: #fffaf4;
  --radius-lg: 18px;
  --radius-xl: 26px;
  --history-wash-1: #f7ebda;
  --history-wash-2: #f3efe8;
  --history-wash-3: #fff6ea;
  --history-glass: rgba(255, 250, 244, 0.93);
  --history-grid: rgba(155, 132, 105, 0.12);
  --history-ghost: rgba(71, 82, 95, 0.12);
  --history-scrollbar: rgba(121, 106, 88, 0.45);
  --app-scrollbar-thumb: rgba(111, 97, 80, 0.56);
  --app-scrollbar-thumb-hover: rgba(98, 85, 70, 0.72);
  --history-accent-origin: #4f7fa6;
  --history-accent-destination: #3b8e80;
  --history-accent-date: #c79a3a;
  --history-accent-point: #6b7280;
  --qs-route-line: rgba(94, 114, 132, 0.45);
  --qs-route-glow: rgba(94, 114, 132, 0.2);
  --qs-map: rgba(96, 110, 122, 0.08);
  --qs-ready: rgba(46, 110, 98, 0.25);
  --qs-accent: #d95d39;
  --qs-accent-2: #e5805c;
  --qs-text-secondary: #5f574c;
  --qs-placeholder: #7a7165;
  --qs-placeholder-focus: #9a8f82;
  --qs-input-border: #8c7558;
  --qs-input-border-strong: #735c42;
  --qs-input-elevation: 0 10px 20px rgba(31, 29, 26, 0.08);
  --qs-panel-shadow: 0 22px 44px rgba(32, 28, 21, 0.14);
  --qs-panel-shadow-strong: 0 26px 56px rgba(32, 28, 21, 0.2);
  --qs-button-shadow: 0 12px 24px rgba(217, 93, 57, 0.25);
  --qs-button-shadow-hover: 0 18px 30px rgba(217, 93, 57, 0.3);
  --qs-check-shadow: 0 10px 22px rgba(46, 110, 98, 0.22);
  --qs-focus-ring: 0 0 0 3px rgba(217, 93, 57, 0.3);
  --qs-focus-outline: rgba(217, 93, 57, 0.72);
  --qs-control-height: 48px;
  --qs-route-card-min-height: 190px;
  --text-primary: #1f1d1a;
  --text-secondary: #5b5349;
  --placeholder: #7a7165;
  --border-default: #9f8769;
  --border-focus: rgba(217, 93, 57, 0.62);
  --shadow-elevation: 0 16px 28px rgba(47, 40, 24, 0.12);
  --btn-shadow: 0 10px 20px rgba(47, 40, 24, 0.16);
  --btn-shadow-strong: 0 14px 30px rgba(32, 28, 21, 0.22);
  --ui-root-font-size: 16px;
  --ui-shell-max-width: 1060px;
  --ui-dashboard-max-width: 1160px;
  --ui-shell-padding-top: 1.6rem;
  --ui-shell-padding-inline: 0.95rem;
  --ui-shell-padding-bottom: 2.45rem;
  --ui-policies-aside-width: 252px;
  --ui-hero-density-padding: 2rem;
}

:root[data-theme="dark"] {
  --bg: #0f1211;
  --surface: #191f1d;
  --surface-2: #141a18;
  --surface-3: #1f2623;
  --ink: #f2ebe0;
  --ink-muted: #b7b0a6;
  --accent: #e07b56;
  --accent-2: #6fb2a1;
  --accent-ink: #15110d;
  --border: #2d3532;
  --shadow: rgba(5, 6, 6, 0.55);
  --shadow-strong: rgba(0, 0, 0, 0.7);
  --overlay: rgba(3, 4, 4, 0.65);
  --bg-spot-1: #1e2a24;
  --bg-spot-2: #1b2420;
  --input-bg: #121614;
  --panel-bg: #161c19;
  --history-wash-1: #16221f;
  --history-wash-2: #121a18;
  --history-wash-3: #1a2420;
  --history-glass: rgba(22, 28, 25, 0.94);
  --history-grid: rgba(185, 204, 196, 0.12);
  --history-ghost: rgba(158, 182, 193, 0.16);
  --history-scrollbar: rgba(162, 184, 175, 0.5);
  --app-scrollbar-thumb: rgba(164, 184, 176, 0.58);
  --app-scrollbar-thumb-hover: rgba(187, 207, 200, 0.76);
  --history-accent-origin: #6aa0c5;
  --history-accent-destination: #53a99a;
  --history-accent-date: #d1a94d;
  --history-accent-point: #8b97a8;
  --qs-route-line: rgba(169, 187, 204, 0.45);
  --qs-route-glow: rgba(169, 187, 204, 0.24);
  --qs-map: rgba(180, 196, 210, 0.1);
  --qs-ready: rgba(92, 176, 156, 0.28);
  --qs-accent: #e07b56;
  --qs-accent-2: #f08f6a;
  --qs-text-secondary: #cfc7bb;
  --qs-placeholder: #b5ac9f;
  --qs-placeholder-focus: #ddd4c8;
  --qs-input-border: #62736b;
  --qs-input-border-strong: #7f958a;
  --qs-input-elevation: 0 10px 24px rgba(0, 0, 0, 0.35);
  --qs-panel-shadow: 0 24px 48px rgba(0, 0, 0, 0.6);
  --qs-panel-shadow-strong: 0 30px 62px rgba(0, 0, 0, 0.72);
  --qs-button-shadow: 0 12px 26px rgba(232, 150, 120, 0.24);
  --qs-button-shadow-hover: 0 18px 32px rgba(232, 150, 120, 0.34);
  --qs-check-shadow: 0 12px 24px rgba(111, 178, 161, 0.3);
  --qs-focus-ring: 0 0 0 3px rgba(232, 150, 120, 0.36);
  --qs-focus-outline: rgba(232, 150, 120, 0.86);
  --text-primary: #f2ebe0;
  --text-secondary: #cfc7bb;
  --placeholder: #b5ac9f;
  --border-default: #5f6f68;
  --border-focus: rgba(232, 150, 120, 0.78);
  --shadow-elevation: 0 20px 34px rgba(0, 0, 0, 0.55);
  --btn-shadow: 0 12px 24px rgba(0, 0, 0, 0.45);
  --btn-shadow-strong: 0 18px 34px rgba(0, 0, 0, 0.62);
}

* {
  box-sizing: border-box;
}

html {
  font-size: var(--ui-root-font-size);
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
  transition: scrollbar-color 2s ease;
}

html::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

html::-webkit-scrollbar-thumb {
  background: transparent;
  border-radius: 999px;
  -webkit-transition: background-color 2s ease;
  transition: background-color 2s ease;
}

html::-webkit-scrollbar-thumb:hover {
  background: var(--app-scrollbar-thumb-hover);
}

html::-webkit-scrollbar-track {
  background: transparent;
}

html.is-scrolling {
  scrollbar-color: var(--app-scrollbar-thumb) transparent;
}

html.is-scrolling::-webkit-scrollbar-thumb {
  background: var(--app-scrollbar-thumb);
}

html.is-scrolling.is-wheel-scrolling::-webkit-scrollbar-thumb {
  transition-duration: 0.2s;
}

html.is-scrollbar-proximity {
  scrollbar-color: var(--app-scrollbar-thumb) transparent;
  transition-duration: 0.5s;
}

html.is-scrollbar-proximity::-webkit-scrollbar-thumb {
  background: var(--app-scrollbar-thumb);
  transition-duration: 0.5s;
}

/* Force desktop rendering density equivalent to browser zoom-out 75% */
@media (min-width: 1024px) {
  html {
    zoom: 75%;
  }
}

body {
  margin: 0;
  font-family: "IBM Plex Sans", sans-serif;
  color: var(--text-primary);
  background:
    radial-gradient(circle at 15% 15%, var(--bg-spot-1) 0%, transparent 40%),
    radial-gradient(circle at 88% 12%, var(--bg-spot-2) 0%, transparent 36%),
    var(--bg);
  min-height: 100vh;
  transition: background-color 0.2s ease, color 0.2s ease;
}

.app-root {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.app-content {
  flex: 1 0 auto;
}

.skip-link {
  position: absolute;
  left: 0.75rem;
  top: 0.75rem;
  transform: translateY(-200%);
  background: var(--surface);
  color: var(--ink);
  border: 1px solid var(--border);
  padding: 0.5rem 0.75rem;
  border-radius: 10px;
  z-index: 2000;
  text-decoration: none;
  font-weight: 600;
}

.skip-link:focus {
  transform: translateY(0);
  outline: 2px solid var(--border-focus);
  outline-offset: 2px;
}

.policies-shell section[id] {
  scroll-margin-top: 96px;
}

h1 {
  font-family: "Playfair Display", serif;
  font-size: clamp(1.8rem, 3.3vw, 3rem);
  margin: 0 0 0.5rem;
}

.shell {
  max-width: var(--ui-shell-max-width);
  margin: 0 auto;
  padding: var(--ui-shell-padding-top) var(--ui-shell-padding-inline) var(--ui-shell-padding-bottom);
}

@media (max-width: 1440px) and (min-width: 1280px) {
  :root {
    --ui-root-font-size: 14.5px;
    --ui-shell-max-width: 1020px;
    --ui-dashboard-max-width: 1110px;
    --ui-policies-aside-width: 238px;
    --ui-hero-density-padding: 1.75rem;
  }
}

@media (max-width: 1366px) and (min-width: 1024px) {
  :root {
    --ui-root-font-size: 14px;
    --ui-shell-max-width: 980px;
    --ui-dashboard-max-width: 1060px;
    --ui-shell-padding-top: 1.35rem;
    --ui-shell-padding-inline: 0.85rem;
    --ui-shell-padding-bottom: 2rem;
    --ui-policies-aside-width: 220px;
    --ui-hero-density-padding: 1.55rem;
  }

  .qs-workspace-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .dashboard-top-stage {
    grid-template-columns: minmax(0, 1fr);
  }

  .private-account-anchor {
    gap: 0.65rem;
    min-height: 48px;
    padding-block: 7px;
    padding-inline: 12px;
  }
}

.landing-shell {
  display: grid;
  grid-gap: 2rem;
  gap: 2rem;
}

.landing-dot {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #f6cdb6, var(--accent));
  box-shadow: 0 0 0 6px rgba(217, 93, 57, 0.12);
}

.linkInline {
  color: var(--ink);
  text-decoration: none;
  font-weight: 600;
  font-size: 0.9rem;
  padding: 0.2rem 0.1rem;
}

.linkInline:hover {
  text-decoration: underline;
}

.linkInline:focus-visible {
  outline: 2px solid var(--border-focus);
  outline-offset: 2px;
  border-radius: 4px;
}

.landing-hero {
  display: grid;
  grid-gap: 1.6rem;
  gap: 1.6rem;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  padding: 2rem;
  border-radius: var(--radius-xl);
  border: 1px solid var(--border);
  background:
    linear-gradient(135deg, rgba(255, 250, 244, 0.92), rgba(255, 244, 230, 0.82)),
    var(--panel-bg);
  box-shadow: 0 26px 60px var(--shadow);
}

.landing-hero-copy p {
  font-size: 1.05rem;
  line-height: 1.7;
  color: var(--ink-muted);
  max-width: 34rem;
}

.landing-claim {
  margin: 0.4rem 0 0.2rem;
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--ink);
}

.landing-cta {
  flex-wrap: wrap;
  margin-top: 1.2rem;
}

.landing-cta-note {
  margin: 0.6rem 0 0;
  color: var(--ink-muted);
  font-size: 0.9rem;
}

.landing-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  grid-gap: 0.8rem;
  gap: 0.8rem;
  margin-top: 0.2rem;
}

.landing-metric {
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 0.7rem 0.9rem;
  background: var(--surface);
  box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.6);
}

.landing-metric strong {
  display: block;
  font-size: 1.15rem;
}

.landing-metric span {
  font-size: 0.85rem;
  color: var(--ink-muted);
}

.landing-hero-panel {
  border-radius: 18px;
  border: 1px solid rgba(217, 205, 187, 0.8);
  background:
    linear-gradient(160deg, rgba(255, 246, 234, 0.9), rgba(243, 239, 232, 0.72)),
    var(--panel-bg);
  padding: 1.4rem;
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
  box-shadow: 0 20px 42px var(--shadow);
}

.landing-demo {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
}

.demo-chart {
  border-radius: 14px;
  border: 1px solid var(--border);
  padding: 0.85rem;
  background: var(--surface);
  box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.6);
  display: grid;
  grid-gap: 0.7rem;
  gap: 0.7rem;
}

.demo-chart-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.85rem;
  color: var(--ink-muted);
}

.demo-chart-header strong {
  color: var(--ink);
  font-weight: 600;
}

.demo-chart-bars {
  display: grid;
  grid-template-columns: repeat(10, minmax(0, 1fr));
  align-items: flex-end;
  grid-gap: 0.35rem;
  gap: 0.35rem;
  height: 110px;
}

.demo-chart-bars span {
  display: block;
  width: 100%;
  border-radius: 10px;
  background: linear-gradient(180deg, rgba(217, 93, 57, 0.9), rgba(217, 93, 57, 0.2));
  box-shadow: inset 0 -1px 2px rgba(0, 0, 0, 0.08);
}

.demo-trend {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.85rem;
  color: var(--accent);
  font-weight: 600;
}

.demo-trend i {
  font-size: 0.9rem;
}

.demo-calendar {
  border-radius: 14px;
  border: 1px solid var(--border);
  padding: 0.85rem;
  background: var(--surface);
  display: grid;
  grid-gap: 0.7rem;
  gap: 0.7rem;
}

.demo-calendar-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.85rem;
  color: var(--ink-muted);
}

.demo-calendar-header i {
  color: var(--accent-2);
}

.demo-calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  grid-gap: 0.35rem;
  gap: 0.35rem;
}

.demo-day {
  text-align: center;
  font-size: 0.7rem;
  color: var(--ink-muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.demo-date {
  text-align: center;
  padding: 0.35rem 0;
  border-radius: 8px;
  font-size: 0.78rem;
  border: 1px solid transparent;
  background: rgba(46, 110, 98, 0.08);
}

.demo-date-2 {
  background: rgba(217, 93, 57, 0.1);
}

.demo-date-3 {
  background: rgba(121, 106, 88, 0.12);
}

.demo-footnote {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.demo-chip {
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 0.2rem 0.6rem;
  font-size: 0.75rem;
  font-weight: 600;
  background: var(--surface);
}

.demo-chip-muted {
  color: var(--ink-muted);
}

.landing-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.landing-panel-header h2 {
  margin: 0;
  font-size: 1.2rem;
  font-family: "Playfair Display", serif;
}

.landing-panel-header p {
  margin: 0.2rem 0 0;
  color: var(--ink-muted);
  font-size: 0.88rem;
}

.landing-pill {
  border: 1px solid rgba(46, 110, 98, 0.4);
  background: rgba(46, 110, 98, 0.12);
  color: var(--ink);
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
}

.landing-pulse {
  display: grid;
  grid-gap: 0.65rem;
  gap: 0.65rem;
}

.pulse-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 0.65rem 0.75rem;
  border-radius: 12px;
  background: var(--surface);
  border: 1px solid var(--border);
}

.pulse-label {
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--ink-muted);
}

.pulse-value {
  font-weight: 600;
}

.pulse-chip {
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  background: rgba(217, 93, 57, 0.14);
  border: 1px solid rgba(217, 93, 57, 0.32);
  font-weight: 600;
  font-size: 0.78rem;
}

.pulse-chip-muted {
  background: rgba(121, 106, 88, 0.12);
  border-color: rgba(121, 106, 88, 0.3);
}

.landing-pulse-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 0.8rem;
  gap: 0.8rem;
}

.landing-pulse-section {
  border-radius: 18px;
  border: 1px solid var(--border);
  padding: 1.4rem;
  background: var(--surface);
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
  box-shadow: 0 20px 40px var(--shadow);
}

.pulse-card {
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--surface);
  padding: 0.9rem;
}

.pulse-card h3 {
  margin: 0 0 0.4rem;
  font-size: 0.95rem;
}

.pulse-card p {
  margin: 0;
  color: var(--ink-muted);
  font-size: 0.86rem;
}

.landing-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-gap: 1rem;
  gap: 1rem;
}

.landing-card {
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 1.1rem;
  background: var(--panel-bg);
  box-shadow: 0 18px 32px var(--shadow);
  display: grid;
  grid-gap: 0.6rem;
  gap: 0.6rem;
}

.landing-card i {
  font-size: 1.4rem;
  color: var(--accent);
}

.landing-card h3 {
  margin: 0 0 0.4rem;
  font-size: 1.05rem;
}

.landing-card p {
  margin: 0;
  color: var(--ink-muted);
}

.landing-steps {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 1.4rem;
  background: var(--surface);
}

.landing-steps-header h2 {
  margin: 0 0 0.4rem;
  font-family: "Playfair Display", serif;
}

.landing-steps-header p {
  margin: 0;
  color: var(--ink-muted);
}

.landing-steps-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-gap: 1rem;
  gap: 1rem;
}

.landing-step {
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 1rem;
  background: var(--panel-bg);
  box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.65);
  display: grid;
  grid-gap: 0.5rem;
  gap: 0.5rem;
}

.landing-step i {
  font-size: 1.3rem;
  color: var(--accent-2);
}

.landing-step h3 {
  margin: 0.2rem 0 0.35rem;
}

.landing-step p {
  margin: 0;
  color: var(--ink-muted);
  font-size: 0.9rem;
}

.landing-access {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: center;
  padding: 1.4rem;
  border-radius: 18px;
  border: 1px solid var(--border);
  background:
    linear-gradient(120deg, rgba(46, 110, 98, 0.08), transparent 40%),
    var(--panel-bg);
  box-shadow: 0 20px 40px var(--shadow);
}

.landing-access-actions {
  display: grid;
  grid-gap: 0.5rem;
  gap: 0.5rem;
}

.landing-access h2 {
  margin: 0 0 0.4rem;
}

.landing-access p {
  margin: 0;
  color: var(--ink-muted);
}

.landing-section-title {
  display: grid;
  grid-gap: 0.25rem;
  gap: 0.25rem;
}

.landing-section-title h2 {
  margin: 0;
  font-family: "Playfair Display", serif;
  font-size: 1.5rem;
}

.landing-section-title p {
  margin: 0;
  color: var(--ink-muted);
}

.landing-why {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
}

.landing-why-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 1rem;
  gap: 1rem;
}

.landing-why-card {
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 1rem;
  background:
    linear-gradient(120deg, rgba(217, 93, 57, 0.08), transparent 55%),
    var(--panel-bg);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-gap: 0.85rem;
  gap: 0.85rem;
  align-items: center;
  box-shadow: 0 16px 32px var(--shadow);
}

.landing-why-card i {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: rgba(217, 93, 57, 0.14);
  color: var(--accent);
  font-size: 1.1rem;
}

.landing-why-card h3 {
  margin: 0 0 0.2rem;
}

.landing-why-card p {
  margin: 0;
  color: var(--ink-muted);
  font-size: 0.9rem;
}

.landing-footer {
  display: flex;
  justify-content: space-between;
  gap: 1.5rem;
  align-items: flex-start;
  padding: 1.6rem;
  border-radius: 18px;
  border: 1px solid var(--border);
  background: var(--surface);
  box-shadow: 0 18px 36px var(--shadow);
}

.landing-footer-brand {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}

.landing-footer-brand strong {
  display: block;
  font-size: 1.05rem;
}

.landing-footer-brand p {
  margin: 0.2rem 0 0;
  color: var(--ink-muted);
  font-size: 0.9rem;
}

.landing-footer-links {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 1.5rem;
  gap: 1.5rem;
}

.landing-footer-links h4 {
  margin: 0 0 0.6rem;
  font-size: 0.9rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--ink-muted);
}

.landing-footer-links a {
  display: block;
  text-decoration: none;
  color: var(--ink);
  margin-bottom: 0.4rem;
}

/* /prueba landing variant: same copy, higher editorial hierarchy. */
.landing-prueba-shell {
  display: grid;
  grid-gap: 1.4rem;
  gap: 1.4rem;
}

.landing-prueba-header {
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 0.9rem 1rem;
  background:
    linear-gradient(120deg, color-mix(in srgb, var(--surface) 88%, transparent), color-mix(in srgb, var(--surface-2) 84%, transparent)),
    var(--panel-bg);
  box-shadow: 0 14px 26px var(--shadow);
}

.landing-prueba-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.94fr);
  grid-gap: 1rem;
  gap: 1rem;
}

.landing-prueba-editorial {
  border: 1px solid var(--border);
  border-radius: var(--radius-xl);
  padding: clamp(1.4rem, 2vw, 2rem);
  background:
    radial-gradient(circle at 10% 8%, rgba(217, 93, 57, 0.11), transparent 35%),
    radial-gradient(circle at 88% 10%, rgba(46, 110, 98, 0.1), transparent 30%),
    linear-gradient(145deg, color-mix(in srgb, var(--surface) 92%, white 8%), color-mix(in srgb, var(--surface-2) 86%, #fff6ea 14%));
  box-shadow: 0 26px 56px var(--shadow);
}

.landing-prueba-kicker {
  margin: 0 0 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  font-weight: 700;
  font-size: 0.7rem;
  color: var(--ink-muted);
}

.landing-prueba-editorial h1 {
  margin-bottom: 0.35rem;
}

.landing-prueba-body {
  max-width: 42ch;
  font-size: 1.05rem;
  line-height: 1.7;
  color: var(--ink-muted);
}

.landing-prueba-signal {
  border-radius: var(--radius-xl);
  border: 1px solid var(--border);
  padding: 1.1rem;
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--surface) 90%, #fff4e6 10%), color-mix(in srgb, var(--surface-2) 88%, #f6eee4 12%));
  box-shadow: 0 22px 50px var(--shadow);
  display: grid;
  grid-gap: 0.9rem;
  gap: 0.9rem;
}

.landing-prueba-band {
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 0.72rem;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--surface) 92%, transparent), color-mix(in srgb, var(--surface-2) 84%, transparent));
  box-shadow: 0 14px 30px var(--shadow);
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-gap: 0.65rem;
  gap: 0.65rem;
}

.landing-prueba-band .landing-metric {
  background: color-mix(in srgb, var(--surface) 92%, white 8%);
}

.landing-prueba-proof {
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 1.1rem;
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  box-shadow: 0 18px 34px var(--shadow);
}

.landing-prueba-proof .landing-why-grid {
  margin-top: 0.95rem;
}

.landing-prueba-flow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-gap: 0.95rem;
  gap: 0.95rem;
}

.landing-prueba-flow .landing-pulse-section,
.landing-prueba-flow .landing-steps {
  height: 100%;
}

.landing-prueba-flow .landing-steps-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.landing-prueba-grid .landing-card {
  background:
    linear-gradient(155deg, color-mix(in srgb, var(--surface) 90%, white 10%), color-mix(in srgb, var(--surface-2) 86%, #f8eee0 14%));
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.landing-prueba-grid .landing-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 24px 34px var(--shadow-strong);
  border-color: color-mix(in srgb, var(--accent) 36%, var(--border));
}

.landing-prueba-grid .landing-card:focus-within {
  border-color: var(--border-focus);
}

:root[data-theme="dark"] .landing-prueba-header {
  border-color: color-mix(in srgb, var(--color-border) 82%, var(--color-border-strong) 18%);
  background:
    linear-gradient(120deg, rgba(255, 255, 255, 0.04), rgba(0, 0, 0, 0.16)),
    color-mix(in srgb, var(--color-surface) 90%, var(--color-surface-elevated) 10%);
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.45);
}

:root[data-theme="dark"] .landing-prueba-editorial,
:root[data-theme="dark"] .landing-prueba-signal {
  border-color: color-mix(in srgb, var(--color-border) 82%, var(--color-border-strong) 18%);
  box-shadow: 0 24px 54px rgba(0, 0, 0, 0.52);
}

:root[data-theme="dark"] .landing-prueba-editorial {
  background:
    radial-gradient(circle at 12% 10%, rgba(224, 123, 86, 0.16), transparent 32%),
    radial-gradient(circle at 84% 12%, rgba(111, 178, 161, 0.14), transparent 28%),
    linear-gradient(145deg, color-mix(in srgb, var(--color-surface) 88%, var(--color-surface-elevated) 12%), color-mix(in srgb, var(--color-surface-elevated) 84%, var(--color-surface-muted) 16%));
}

:root[data-theme="dark"] .landing-prueba-signal {
  background:
    linear-gradient(165deg, color-mix(in srgb, var(--color-surface-elevated) 90%, var(--color-surface) 10%), color-mix(in srgb, var(--color-surface) 90%, var(--color-surface-muted) 10%));
}

:root[data-theme="dark"] .landing-prueba-band,
:root[data-theme="dark"] .landing-prueba-proof {
  border-color: color-mix(in srgb, var(--color-border) 82%, var(--color-border-strong) 18%);
  background: color-mix(in srgb, var(--color-surface) 88%, var(--color-surface-elevated) 12%);
}

:root[data-theme="dark"] .landing-prueba-band .landing-metric {
  background: color-mix(in srgb, var(--color-surface-elevated) 86%, var(--color-surface) 14%);
  border-color: color-mix(in srgb, var(--color-border) 76%, var(--color-border-strong) 24%);
}

:root[data-theme="dark"] .landing-prueba-kicker,
:root[data-theme="dark"] .landing-prueba-body {
  color: var(--color-text-secondary);
}

:root[data-theme="dark"] .landing-prueba-grid .landing-card {
  border-color: color-mix(in srgb, var(--color-border) 82%, var(--color-border-strong) 18%);
  background:
    linear-gradient(155deg, color-mix(in srgb, var(--color-surface-elevated) 92%, var(--color-surface) 8%), color-mix(in srgb, var(--color-surface) 90%, var(--color-surface-muted) 10%));
}

@media (max-width: 980px) {
  .landing-prueba-hero,
  .landing-prueba-flow {
    grid-template-columns: minmax(0, 1fr);
  }

  .landing-prueba-band {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .landing-prueba-band,
  .landing-prueba-flow .landing-steps-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

.landing-prueba-cinema {
  position: relative;
  min-height: 100vh;
  overflow: hidden;
  isolation: isolate;
  display: grid;
  grid-template-rows: auto 1fr;
  padding: 1rem;
  color: #f5ead6;
}

.landing-prueba-cinema .absolute {
  position: absolute;
}

.landing-prueba-cinema .inset-0 {
  inset: 0;
}

.landing-prueba-cinema .w-full {
  width: 100%;
}

.landing-prueba-cinema .h-full {
  height: 100%;
}

.landing-prueba-cinema .object-cover {
  object-fit: cover;
}

.landing-prueba-cinema .z-0 {
  z-index: 0;
}

.landing-prueba-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(circle at 82% 16%, rgba(255, 176, 0, 0.18), transparent 32%),
    radial-gradient(circle at 14% 84%, rgba(16, 185, 129, 0.14), transparent 30%),
    linear-gradient(160deg, rgba(8, 10, 11, 0.36), rgba(8, 10, 11, 0.84) 62%);
}

.landing-prueba-cinema .landing-dot {
  box-shadow: 0 0 0 6px rgba(255, 176, 0, 0.2);
}

.landing-prueba-cinema-body {
  align-self: end;
  max-width: min(740px, 92vw);
  margin: 0 0 clamp(2rem, 7vh, 4.6rem);
}

.landing-prueba-cinema-body h1 {
  font-size: clamp(2.15rem, 5.6vw, 5.2rem);
  margin: 0.4rem 0;
  line-height: 0.98;
  color: #f5ead6;
  text-wrap: balance;
}

.landing-prueba-cinema-body .landing-claim {
  color: #ffb000;
  font-size: clamp(1rem, 2vw, 1.36rem);
}

.landing-prueba-cinema .landing-prueba-body {
  font-size: clamp(1rem, 1.6vw, 1.24rem);
  max-width: 50ch;
  line-height: 1.65;
  opacity: 0.95;
}

.landing-prueba-cinema .landing-cta {
  margin-top: 1.2rem;
}

.landing-prueba-cinema .landing-cta-note {
  margin-top: 0.75rem;
  opacity: 0.9;
}

@media (max-width: 760px) {
  .landing-prueba-cinema {
    padding: 0.75rem;
  }

  .landing-prueba-cinema-body {
    margin-bottom: 1.35rem;
  }
}

/* =========================
   POLICIES PAGE
   ========================= */
.policies-shell {
  display: grid;
  grid-gap: 2rem;
  gap: 2rem;
}

.policies-hero {
  border-radius: var(--radius-xl);
  padding: 2rem;
  border: 1px solid var(--border);
  background:
    radial-gradient(circle at 18% 12%, rgba(217, 93, 57, 0.12), transparent 40%),
    radial-gradient(circle at 88% 18%, rgba(46, 110, 98, 0.12), transparent 36%),
    var(--panel-bg);
  box-shadow: 0 24px 52px var(--shadow);
  display: grid;
  grid-gap: 1.5rem;
  gap: 1.5rem;
}

.policies-hero-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
}

.policies-hero-copy h1 {
  margin-bottom: 0.4rem;
}

.policies-hero-copy p {
  margin: 0;
  max-width: 46rem;
  color: var(--ink-muted);
  font-size: 1.05rem;
  line-height: 1.7;
}

.policies-meta {
  margin-top: 1.2rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem 1.5rem;
  font-size: 0.88rem;
  color: var(--ink);
}

.policies-tldr {
  border-radius: 18px;
  border: 1px solid var(--border);
  background: var(--surface);
  padding: 1.6rem;
  box-shadow: 0 18px 36px var(--shadow);
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
}

.policies-tldr-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.policies-tldr ul {
  margin: 0;
  padding-left: 1.1rem;
  display: grid;
  grid-gap: 0.4rem;
  gap: 0.4rem;
  color: var(--ink-muted);
}

.policies-index {
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 1.2rem 1.4rem;
  background: var(--surface);
  box-shadow: 0 16px 34px var(--shadow);
  display: grid;
  grid-gap: 0.8rem;
  gap: 0.8rem;
}

.policies-index-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.policies-toc {
  display: grid;
  grid-gap: 0.4rem;
  gap: 0.4rem;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.policies-toc-item {
  text-decoration: none;
  color: var(--ink);
  font-size: 0.9rem;
  padding: 0.4rem 0.6rem;
  border-radius: 10px;
  border: 1px solid transparent;
  transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}

.policies-toc-item:hover,
.policies-toc-item:focus-visible {
  border-color: var(--border);
  background: var(--surface-2);
  outline: none;
}

.policies-toc-item.active {
  border-color: rgba(217, 93, 57, 0.4);
  background: rgba(217, 93, 57, 0.12);
  color: var(--ink);
}

.policies-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--ui-policies-aside-width);
  grid-gap: 1.8rem;
  gap: 1.8rem;
  align-items: flex-start;
}

.policies-content {
  display: grid;
  grid-gap: 1.6rem;
  gap: 1.6rem;
}

.policies-section {
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 1.4rem;
  background: var(--surface);
  box-shadow: 0 16px 34px var(--shadow);
  display: grid;
  grid-gap: 0.8rem;
  gap: 0.8rem;
}

.policies-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.policies-section p {
  margin: 0;
  color: var(--ink-muted);
  line-height: 1.7;
}

.policies-list {
  margin: 0;
  padding-left: 1.1rem;
  display: grid;
  grid-gap: 0.35rem;
  gap: 0.35rem;
  color: var(--ink-muted);
}

.badge {
  border-radius: 999px;
  padding: 0.2rem 0.6rem;
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  border: 1px solid var(--color-badge-border);
  background: var(--color-badge-bg);
  color: var(--color-badge-text);
}

.badge-important {
  background: rgba(217, 93, 57, 0.16);
  border-color: rgba(217, 93, 57, 0.35);
}

.badge-transparency {
  background: rgba(79, 127, 166, 0.14);
  border-color: rgba(79, 127, 166, 0.35);
}

.badge-limitation {
  background: rgba(121, 106, 88, 0.16);
  border-color: rgba(121, 106, 88, 0.35);
}

.badge-control {
  background: rgba(46, 110, 98, 0.14);
  border-color: rgba(46, 110, 98, 0.35);
}

.policies-table {
  display: grid;
  grid-gap: 0.4rem;
  gap: 0.4rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  padding: 0.8rem;
  background: var(--surface-2);
  font-size: 0.88rem;
  color: var(--ink);
}

.policies-table-row {
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr) 120px;
  grid-gap: 0.8rem;
  gap: 0.8rem;
  padding: 0.4rem 0.2rem;
  border-bottom: 1px dashed var(--border);
}

.policies-table-row.header {
  font-weight: 700;
  border-bottom: 1px solid var(--border);
}

.policies-table-row:last-child {
  border-bottom: none;
}

.policies-rights,
.policies-faq {
  display: grid;
  grid-gap: 0.6rem;
  gap: 0.6rem;
}

.policies-rights details,
.policies-faq details {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 0.7rem 0.9rem;
  background: var(--surface);
}

.policies-rights summary,
.policies-faq summary {
  cursor: pointer;
  font-weight: 600;
  list-style: none;
}

.policies-rights summary::-webkit-details-marker,
.policies-faq summary::-webkit-details-marker {
  display: none;
}

.policies-rights summary::after,
.policies-faq summary::after {
  content: "+";
  float: right;
  color: var(--accent);
}

.policies-rights details[open] summary::after,
.policies-faq details[open] summary::after {
  content: "–";
}

.policies-rights p,
.policies-faq p {
  margin: 0.6rem 0 0;
  color: var(--ink-muted);
}

.policies-cta {
  background: linear-gradient(120deg, rgba(217, 93, 57, 0.12), transparent 60%), var(--panel-bg);
}

.policies-cta-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}

.policies-quick {
  position: -webkit-sticky;
  position: sticky;
  top: 1.5rem;
}

.policies-quick-card {
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 1rem;
  background: var(--surface);
  box-shadow: 0 16px 34px var(--shadow);
  display: grid;
  grid-gap: 0.6rem;
  gap: 0.6rem;
}

.policies-quick-card ul {
  margin: 0;
  padding-left: 1.1rem;
  color: var(--ink-muted);
  display: grid;
  grid-gap: 0.3rem;
  gap: 0.3rem;
}

.policies-floating {
  position: fixed;
  right: 1.2rem;
  bottom: 1.2rem;
  display: none;
  gap: 0.5rem;
  z-index: 60;
}

@media (max-width: 980px) {
  .policies-layout {
    grid-template-columns: 1fr;
  }

  .policies-quick {
    position: static;
  }

  .policies-toc {
    display: none;
  }

  .policies-toc.open {
    display: grid;
  }

  .policies-floating {
    display: grid;
  }

  .policies-table-row {
    grid-template-columns: 1fr;
  }
}

@media print {
  .policies-floating,
  .policies-index-toggle,
  .policies-hero-actions {
    display: none !important;
  }
}

.landing-stage {
  animation: landingFade 0.5s ease both;
}

.landing-stage-delay {
  animation-delay: 0.08s;
}

.landing-stage-delay-2 {
  animation-delay: 0.16s;
}

.landing-stage-delay-3 {
  animation-delay: 0.24s;
}

.auth-guard {
  min-height: 70vh;
  display: grid;
  place-items: center;
}

.auth-guard-card {
  max-width: 420px;
  text-align: center;
}

.auth-guard-title {
  font-weight: 700;
  font-size: 1.1rem;
  margin-bottom: 0.35rem;
}

.landing-check {
  text-align: center;
}

.air-loader-screen {
  min-height: 70vh;
  display: grid;
  place-items: center;
}

.air-loader-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.25rem;
  text-align: center;
}

.air-loader-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  text-align: center;
}

.navigation-pending-overlay {
  position: fixed;
  inset: 0;
  z-index: 1400;
  display: grid;
  place-items: center;
  background: color-mix(in srgb, var(--overlay) 72%, transparent);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  pointer-events: none;
}

.navigation-pending-overlay__card {
  min-width: min(420px, calc(100vw - 2rem));
  min-height: 250px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-color: color-mix(in srgb, var(--border) 70%, transparent);
  box-shadow: 0 20px 52px var(--shadow-strong);
}

@keyframes landingFade {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.hero {
  background: var(--panel-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-xl);
  padding: 2rem;
  box-shadow: 0 20px 50px var(--shadow);
}


.qs-disclaimer {
  margin: 0 0 0.8rem;
}

.qs-filters-grid {
  margin-top: 0.5rem;
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
}

.qs-page-header {
  align-items: center;
}

.qs-command-stage {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
  margin-bottom: 1rem;
}

.qs-command-stage__top {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, 0.92fr);
  grid-gap: 1rem;
  gap: 1rem;
  align-items: stretch;
}

.qs-command-stage__intro {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
  padding: 1.2rem 1.25rem;
  border-radius: 28px;
  background:
    radial-gradient(circle at top right, rgba(217, 93, 57, 0.12), transparent 30%),
    radial-gradient(circle at left center, rgba(46, 110, 98, 0.08), transparent 26%),
    linear-gradient(180deg, rgba(255, 250, 244, 0.96), rgba(255, 248, 240, 0.9));
  box-shadow: var(--qs-panel-shadow);
}

.qs-command-stage__status {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
  align-content: start;
  padding: 1.2rem 1.2rem 1.1rem;
  border-radius: 28px;
  border: 1px solid rgba(205, 191, 170, 0.65);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 248, 241, 0.92)),
    var(--panel-bg);
  box-shadow: var(--qs-panel-shadow);
}

.qs-command-stage__status-head,
.qs-command-stage__signals {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  flex-wrap: wrap;
}

.qs-command-stage__eyebrow {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #7c6757;
}

.qs-command-stage__status-badge {
  display: inline-flex;
  align-items: center;
  min-height: 1.9rem;
  padding: 0.32rem 0.68rem;
  border-radius: 999px;
  font-size: 0.76rem;
  font-weight: 700;
  border: 1px solid rgba(148, 163, 184, 0.3);
  background: rgba(248, 250, 252, 0.92);
  color: var(--color-text-primary);
}

.qs-command-stage__status-badge-ready,
.qs-command-stage__status-ready .qs-command-stage__metric strong {
  color: #14532d;
}

.qs-command-stage__status-badge-active {
  border-color: rgba(46, 110, 98, 0.2);
  background: rgba(236, 253, 245, 0.95);
  color: #115e59;
}

.qs-command-stage__status-badge-warning {
  border-color: rgba(245, 158, 11, 0.25);
  background: rgba(255, 251, 235, 0.96);
  color: #92400e;
}

.qs-command-stage__status-badge-alert {
  border-color: rgba(248, 113, 113, 0.3);
  background: rgba(254, 242, 242, 0.96);
  color: #991b1b;
}

.qs-command-stage__status-copy {
  display: grid;
  grid-gap: 0.35rem;
  gap: 0.35rem;
}

.qs-command-stage__status-copy strong {
  font-size: clamp(1.35rem, 2vw, 1.9rem);
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: #1f1d1a;
}

.qs-command-stage__status-copy p {
  margin: 0;
  color: #5f574c;
  line-height: 1.5;
}

.qs-command-stage__status-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-gap: 0.75rem;
  gap: 0.75rem;
}

.qs-command-stage__metric {
  display: grid;
  grid-gap: 0.2rem;
  gap: 0.2rem;
  padding: 0.78rem 0.85rem;
  border-radius: 18px;
  border: 1px solid rgba(226, 232, 240, 0.9);
  background: rgba(255, 255, 255, 0.88);
}

.qs-command-stage__metric span {
  font-size: 0.73rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #7c6757;
}

.qs-command-stage__metric strong {
  font-size: 1.18rem;
  color: #1f2937;
}

.qs-command-stage__snapshot {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.55rem;
  padding-top: 0.1rem;
  color: var(--color-text-secondary);
  font-size: 0.84rem;
}

.qs-command-stage__snapshot > span {
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  padding: 0.28rem 0.6rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(226, 232, 240, 0.86);
}

.qs-command-stage__signal {
  background: var(--color-surface);
}

.qs-command-stage__signal-pending {
  border-color: rgba(217, 93, 57, 0.24);
  background: rgba(255, 237, 213, 0.9);
  color: #9a3412;
}

.qs-command-stage__signal-critical {
  border-color: rgba(248, 113, 113, 0.24);
  background: rgba(254, 242, 242, 0.96);
  color: #991b1b;
}

.qs-hero-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.qs-hero-chip {
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  padding: 0.38rem 0.72rem;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  background: rgba(255, 255, 255, 0.72);
  color: var(--color-text-primary);
  font-size: 0.8rem;
  font-weight: 600;
}

.qs-hero-chip-accent {
  background: rgba(217, 93, 57, 0.12);
  border-color: rgba(217, 93, 57, 0.22);
  color: #9a3412;
}

.qs-hero-chip-warning {
  background: #FEF3C7;
  border-color: #FDE68A;
  color: #92400E;
}

.qs-hero-hint {
  margin: 0;
}

.qs-header-actions {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

.qs-workspace-hint {
  margin: 1rem 0;
  font-size: 0.85rem;
  color: var(--color-text-secondary);
}

.quick-search-shell {
  --qs-sticky-top: 0px;
  --qs-toolbar-height: 52px;
  --qs-summary-height: 48px;
}

.qs-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-gap: 1.2rem;
  gap: 1.2rem;
  align-items: flex-start;
  color: var(--color-text-primary);
}

.qs-workspace-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(260px, 0.7fr);
  grid-gap: 1rem;
  gap: 1rem;
  align-items: start;
}

.qs-context-rail {
  display: grid;
  grid-gap: 0.9rem;
  gap: 0.9rem;
  position: -webkit-sticky;
  position: sticky;
  top: calc(var(--qs-sticky-top) + 0.75rem);
}

.qs-context-rail > * {
  min-width: 0;
}

.qs-route-card,
.qs-results-panel,
.qs-filters-panel,
.qs-filter-group,
.qs-filter-accordion,
.qs-result-row,
.qs-state {
  background: var(--color-surface);
  border-color: var(--color-border);
  color: var(--color-text-primary);
}

.qs-route-card small,
.qs-result-meta,
.qs-result-price,
.qs-explain-grid p,
.qs-flex-helper,
.qs-empty-causes,
.qs-warning,
.qs-warning-warm {
  color: var(--color-text-secondary);
}

.qs-filters-panel {
  position: fixed;
  top: 0;
  right: 0;
  width: min(420px, 92vw);
  height: 100dvh;
  max-height: 100dvh;
  border-radius: 0;
  border-left: 1px solid var(--border);
  border-right: none;
  border-top: none;
  border-bottom: none;
  z-index: 1201;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  padding-top: env(safe-area-inset-top, 0px);
  padding-bottom: env(safe-area-inset-bottom, 0px);
  transform: translateX(106%);
  transition: transform 0.24s ease;
}

@keyframes qs-drawer-slide-in {
  from { transform: translateX(100%); }
  to { transform: translateX(0); }
}

@keyframes qs-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

.qs-filters-panel.open {
  transform: translateX(0);
  animation: qs-drawer-slide-in 0.35s cubic-bezier(0.2, 0, 0, 1) forwards;
}

.qs-filters-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1200;
  border: none;
  background: color-mix(in srgb, var(--ink) 42%, transparent);
  touch-action: none;
  animation: qs-fade-in 0.3s ease forwards;
}

.qs-results-panel {
  min-height: 420px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.98)),
    var(--color-surface);
  padding: 1rem;
  border-radius: 28px;
  box-shadow: 0 22px 44px rgba(15, 23, 42, 0.09);
}

.qs-results-stagehead {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(220px, 0.75fr);
  grid-gap: 1rem;
  gap: 1rem;
  align-items: start;
  padding: 0.35rem 0 1rem;
  border-bottom: 1px solid rgba(226, 232, 240, 0.9);
}

.qs-results-stagehead__copy {
  display: grid;
  grid-gap: 0.35rem;
  gap: 0.35rem;
}

.qs-results-stagehead__eyebrow {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #7c6757;
}

.qs-results-stagehead__copy h2 {
  margin: 0;
  font-size: clamp(1.45rem, 2vw, 2.1rem);
  line-height: 1.02;
  letter-spacing: -0.035em;
  color: #1f1d1a;
}

.qs-results-stagehead__copy p {
  margin: 0;
  color: #5f574c;
  line-height: 1.5;
}

.qs-results-stagehead__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  justify-content: flex-end;
  align-content: flex-start;
}

.qs-results-stagehead__chip-warning {
  border-color: rgba(217, 93, 57, 0.26);
  background: rgba(255, 237, 213, 0.94);
  color: #9a3412;
}

.qs-filters-header {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding-top: 0.35rem;
  background: color-mix(in srgb, var(--surface) 90%, var(--panel));
}

.qs-filters-close {
  display: inline-flex;
}

.qs-flex-control {
  display: grid;
  grid-gap: 0.8rem;
  gap: 0.8rem;
  padding: 1rem 1.05rem 1.1rem;
  border: 1px solid color-mix(in srgb, var(--qs-accent) 18%, var(--border));
  border-radius: 22px;
  background:
    radial-gradient(circle at top right, rgba(217, 93, 57, 0.1), transparent 28%),
    linear-gradient(180deg, rgba(255, 252, 248, 0.98), rgba(255, 247, 239, 0.92));
  box-shadow: 0 16px 34px rgba(34, 28, 22, 0.08);
}

.qs-flex-panel {
  display: grid;
  grid-gap: 0.85rem;
  gap: 0.85rem;
  padding: 0.95rem;
  border-radius: 18px;
  border: 1px solid rgba(205, 191, 170, 0.45);
  background: rgba(255, 252, 248, 0.92);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.qs-flex-helper {
  margin: 0;
  font-size: 0.9rem;
  color: var(--ink-muted);
}

.qs-date-grid {
  display: grid;
  grid-gap: 0.8rem;
  gap: 0.8rem;
  grid-template-columns: 1fr auto;
  align-items: center;
}

.qs-date-grid.has-return {
  grid-template-columns: 1fr auto 1fr;
}

.qs-date-grid .date-field {
  min-width: 0;
}

.qs-chip-input {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
}

.qs-chip {
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 0.24rem 0.62rem;
  background: var(--surface);
  font-size: 0.78rem;
  font-weight: 600;
  cursor: pointer;
  transition: border-color 0.14s ease, background 0.14s ease;
}

.qs-chip:hover {
  border-color: color-mix(in srgb, var(--accent) 38%, var(--border));
  background: color-mix(in srgb, var(--surface-2) 82%, var(--surface));
}

.qs-country-row {
  margin-top: 0.4rem;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-wrap: wrap;
}

.qs-chip:focus-visible {
  outline: 3px solid var(--qs-focus-outline);
}

.qs-results-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  position: -webkit-sticky;
  position: sticky;
  top: var(--qs-sticky-top);
  z-index: 20;
  background: rgba(255, 255, 255, 0.98);
  border-bottom: 1px solid var(--color-border);
  padding: 0.85rem 0 0.7rem;
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
}

.qs-results-summary {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: wrap;
  color: var(--color-text-primary);
}

.qs-search-summary-compact {
  display: grid;
  grid-gap: 0.75rem;
  gap: 0.75rem;
  border-radius: 22px;
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.06);
}

.qs-context-applied {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.6rem;
  font-size: 0.84rem;
  color: var(--color-text-secondary);
}

.qs-context-applied strong {
  color: var(--color-text-primary);
}

.qs-results-controls {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-wrap: wrap;
}

.qs-results-controls .qs-input,
.qs-results-controls .btn-ghost,
.qs-results-controls .qs-results-explain-chip {
  min-height: 2.25rem;
}

.qs-active-chips {
  margin: 0.9rem 0 0.75rem;
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  padding: 0.15rem 0 0.25rem;
}

.qs-results-list {
  display: grid;
  grid-gap: 0.8rem;
  gap: 0.8rem;
}

.qs-results-list.compact {
  gap: 0.5rem;
}

/* Pagination Controls */
.qs-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  margin-top: 1.8rem;
  padding: 1.2rem 0 0.5rem;
  flex-wrap: wrap;
  border-top: 1px dashed var(--border);
  animation: fadeIn 0.3s ease-out;
}

.qs-pagination-stats {
  font-family: var(--font-body), "IBM Plex Sans", sans-serif;
  font-size: 0.88rem;
  color: var(--ink-muted);
  font-weight: 500;
}

.qs-pagination-nav {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.qs-pagination-pages {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.qs-pagination-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  min-width: 2.25rem;
  height: 2.25rem;
  padding: 0 0.75rem;
  font-family: var(--font-body), "IBM Plex Sans", sans-serif;
  font-size: 0.88rem;
  font-weight: 600;
  text-align: center;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--ink);
  cursor: pointer;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.qs-pagination-btn:hover:not(:disabled) {
  border-color: var(--qs-accent);
  background: color-mix(in srgb, var(--qs-accent) 8%, var(--surface));
  color: var(--ink);
  box-shadow: 0 0 12px color-mix(in srgb, var(--qs-accent) 25%, transparent);
  transform: translateY(-1px);
}

.qs-pagination-btn:active:not(:disabled) {
  transform: scale(0.96) translateY(0);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
}

.qs-pagination-ellipsis {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 32px;
  font-size: 0.85rem;
  color: var(--color-text-muted, rgba(128,128,128,0.4));
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  pointer-events: none;
}

.qs-pagination-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
  border-color: var(--border);
  background: var(--surface);
  color: var(--ink-muted);
  transform: none;
  box-shadow: none;
}

.qs-pagination-btn.active {
  border-color: var(--qs-accent);
  background: var(--qs-accent);
  color: #FFFFFF !important;
  font-weight: 700;
  box-shadow: 0 0 14px color-mix(in srgb, var(--qs-accent) 55%, transparent);
}

.qs-pagination-ellipsis {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2rem;
  height: 2.25rem;
  font-family: var(--font-body), "IBM Plex Sans", sans-serif;
  font-size: 0.88rem;
  color: var(--ink-muted);
  font-weight: 600;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.qs-pagination-arrow {
  display: inline-block;
  transition: transform 0.2s ease;
}

.qs-pagination-btn-arrow:hover:not(:disabled) .qs-pagination-arrow:first-child {
  transform: translateX(-2px);
}

.qs-pagination-btn-arrow:hover:not(:disabled) .qs-pagination-arrow:last-child {
  transform: translateX(2px);
}

@media (max-width: 640px) {
  .qs-pagination {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 1rem;
    padding-top: 1rem;
  }
  
  .qs-pagination-btn-text {
    display: none;
  }
  
  .qs-pagination-btn-arrow {
    min-width: 2.25rem;
    width: 2.25rem;
    padding: 0;
  }
}

.qs-results-head-row {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr 1fr 1fr;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ink-muted);
}

.qs-result-row {
  padding: 1rem;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: var(--surface);
}

.qs-result-row.expanded {
  box-shadow: var(--qs-panel-shadow);
}

.qs-result-details {
  margin-top: 0.8rem;
  display: grid;
  grid-gap: 0.6rem;
  gap: 0.6rem;
  border-top: 1px dashed var(--border);
  padding-top: 0.8rem;
  font-size: 0.85rem;
  color: var(--ink-muted);
}

.qs-legs {
  display: grid;
  grid-gap: 0.4rem;
  gap: 0.4rem;
}

.qs-leg-row {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  grid-gap: 0.4rem;
  gap: 0.4rem;
  font-size: 0.82rem;
}

.qs-state {
  border: 1px solid rgba(226, 232, 240, 0.94);
  border-radius: 22px;
  padding: 1.1rem 1.15rem;
  display: grid;
  grid-gap: 0.55rem;
  gap: 0.55rem;
  margin: 0.95rem 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.96));
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.06);
}

.qs-state h3,
.qs-state p {
  margin: 0;
}

.qs-state-idle {
  border-color: rgba(148, 163, 184, 0.34);
}

.qs-state-rate,
.qs-state-empty {
  border-color: rgba(245, 158, 11, 0.24);
  background: linear-gradient(180deg, rgba(255, 251, 235, 0.98), rgba(255, 255, 255, 0.96));
}

.qs-state-error {
  border-color: rgba(248, 113, 113, 0.28);
  background: linear-gradient(180deg, rgba(254, 242, 242, 0.98), rgba(255, 255, 255, 0.96));
}

.qs-state-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 1rem;
}

.qs-state-loading .air-loader {
  margin-bottom: 0.25rem;
}

.qs-skeleton {
  display: grid;
  grid-gap: 0.5rem;
  gap: 0.5rem;
}

.qs-skeleton-cards {
  width: 100%;
  display: grid;
  grid-gap: 0.8rem;
  gap: 0.8rem;
}

.qs-skeleton-card {
  border: 1px solid var(--color-border);
  border-radius: 14px;
  background: var(--color-surface);
  padding: 0.85rem;
  display: grid;
  grid-gap: 0.5rem;
  gap: 0.5rem;
}

.qs-skeleton-row {
  height: 14px;
  border-radius: 10px;
  background: linear-gradient(90deg, rgba(148, 163, 184, 0.2), rgba(226, 232, 240, 0.75), rgba(148, 163, 184, 0.2));
  animation: qsSkeleton 1.2s ease-in-out infinite;
}

.qs-skeleton-route {
  width: 72%;
  height: 16px;
}

.qs-skeleton-meta {
  width: 92%;
}

.qs-skeleton-meta.short {
  width: 58%;
}

.qs-skeleton-price {
  width: 36%;
  justify-self: end;
}

@keyframes qsSkeleton {
  0% { opacity: 0.5; }
  50% { opacity: 0.9; }
  100% { opacity: 0.5; }
}


.qs-pending-changes {
  margin: 0;
  display: grid;
  grid-gap: 0.6rem;
  gap: 0.6rem;
  border-radius: 20px;
}

.qs-filters-toggle {
  display: inline-flex;
}

.qs-reset-all-inline {
  margin-right: 0.1rem;
}

.qs-reset-all:disabled,
.qs-reset-all-inline:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

@media (max-width: 1100px) {
  .qs-command-stage__top {
    grid-template-columns: minmax(0, 1fr);
  }

  .qs-workspace {
    grid-template-columns: 1fr;
  }

  .qs-workspace-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .qs-context-rail {
    position: static;
  }

  .qs-results-stagehead {
    grid-template-columns: minmax(0, 1fr);
  }

  .qs-results-stagehead__meta {
    justify-content: flex-start;
  }

  .qs-results-toolbar,
  .qs-summary {
    position: static;
    top: auto;
  }

  .qs-filters-panel {
    width: 100vw;
    height: 100dvh;
    max-width: none;
  }

  .qs-command-stage__status-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .qs-filter-actions {
    position: -webkit-sticky;
    position: sticky;
    bottom: 0;
    padding-top: 0.8rem;
    background: color-mix(in srgb, var(--surface) 84%, var(--panel));
  }

  .qs-results-head-row {
    display: none;
  }
}

.qs-flex-row {
  margin-top: 0.5rem;
}

.qs-flex-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.qs-flex-summary {
  padding: 0.35rem 0.7rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(205, 191, 170, 0.5);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--qs-accent);
}

.qs-flex-presets {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(116px, 1fr));
  grid-gap: 0.65rem;
  gap: 0.65rem;
}

.qs-flex-preset {
  min-height: 48px;
  padding: 0.75rem 0.9rem;
  border-radius: 16px;
  border: 1px solid rgba(205, 191, 170, 0.7);
  background: rgba(255, 255, 255, 0.74);
  color: var(--ink);
  font-weight: 700;
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
}

.qs-flex-preset:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--qs-accent) 55%, var(--border));
}

.qs-flex-preset.is-active {
  border-color: color-mix(in srgb, var(--qs-accent) 65%, var(--border));
  background: color-mix(in srgb, rgba(217, 93, 57, 0.14) 80%, white);
  box-shadow: 0 12px 24px rgba(217, 93, 57, 0.12);
  color: var(--qs-accent);
}

.qs-flex-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  grid-gap: 0.75rem;
  gap: 0.75rem;
  align-items: flex-end;
}

.qs-flex-field {
  display: grid;
  grid-gap: 0.55rem;
  gap: 0.55rem;
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--ink-muted);
}

.qs-flex-stepper {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 44px;
  align-items: center;
  border-radius: 16px;
  border: 1px solid rgba(205, 191, 170, 0.5);
  background: rgba(255, 255, 255, 0.84);
  overflow: hidden;
}

.qs-flex-stepper-btn {
  min-height: 56px;
  border: none;
  background: rgba(248, 239, 230, 0.92);
  color: var(--ink);
  font-size: 1.35rem;
  font-weight: 700;
}

.qs-flex-stepper-btn:disabled {
  opacity: 0.45;
}

.qs-flex-stepper-value {
  display: grid;
  justify-items: center;
  grid-gap: 0.1rem;
  gap: 0.1rem;
  padding: 0.55rem 0.75rem;
}

.qs-flex-stepper-value strong {
  font-size: 1.18rem;
  line-height: 1;
  color: var(--ink);
}

.qs-flex-stepper-value span {
  font-size: 0.8rem;
  color: var(--ink-muted);
}

.qs-filter-group {
  padding: 1rem;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: var(--surface);
  box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.6);
  display: grid;
  grid-gap: 0.8rem;
  gap: 0.8rem;
}

.qs-filter-core .qs-filter-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.qs-filter-accordion {
  border: 1px solid var(--border);
  border-radius: 18px;
  background: color-mix(in srgb, var(--surface) 88%, var(--panel));
}

.qs-filter-summary {
  list-style: none;
  cursor: pointer;
  padding: 0.85rem 1rem;
}

.qs-filter-summary::-webkit-details-marker {
  display: none;
}

.qs-filter-accordion .qs-filter-group {
  border: none;
  border-top: 1px solid var(--border);
  border-radius: 0 0 18px 18px;
  box-shadow: none;
}

.qs-filter-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
}

.qs-filter-head h3 {
  margin: 0;
  font-size: 1rem;
}

.qs-filter-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  grid-gap: 0.8rem;
  gap: 0.8rem;
  align-items: center;
}

.qs-filter-actions {
  margin-top: 0.8rem;
  display: flex;
  justify-content: flex-end;
}

.qs-warning {
  padding: 0.65rem 0.8rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--border) 70%, #d9a441);
  background: color-mix(in srgb, var(--surface) 80%, #f7e9c0);
  font-size: 0.85rem;
  color: #7a5a12;
}

.qs-warning-warm {
  border-color: color-mix(in srgb, var(--border) 70%, var(--qs-accent));
  background: color-mix(in srgb, var(--surface) 80%, #f7dccf);
  color: #8a3d28;
}

.qs-warning-grouped {
  display: grid;
  grid-gap: 0.55rem;
  gap: 0.55rem;
  border-color: var(--color-border);
  background: var(--color-surface);
  color: var(--color-text-primary);
}

.qs-warning-grouped-neutral {
  border-color: var(--color-border);
  background: var(--color-surface);
  color: var(--color-text-primary);
}

.qs-warning-grouped-critical {
  border-color: #FCA5A5;
  background: #FEF2F2;
  color: #7F1D1D;
}

.qs-warning-grouped-head {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.qs-warning-grouped-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.6rem;
  height: 1.6rem;
  border-radius: 999px;
  background: var(--color-border);
  border: 1px solid var(--color-border-strong);
  color: var(--color-text-primary);
  font-size: 0.78rem;
  font-weight: 700;
}

.qs-warning-grouped-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.qs-warning-group-chip {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 0.18rem 0.56rem;
  border: 1px solid var(--color-border-strong);
  background: #FFFFFF;
  color: var(--color-text-secondary);
  font-size: 0.75rem;
}

.qs-warning-grouped-details {
  border-top: 1px solid var(--color-border);
  padding-top: 0.5rem;
}

.qs-warning-grouped-details ul {
  margin: 0;
  padding-left: 1.1rem;
  display: grid;
  grid-gap: 0.28rem;
  gap: 0.28rem;
}

.qs-info-stack {
  margin-top: 0;
  border: 1px solid var(--color-border);
  border-radius: 22px;
  background: #FFFFFF;
  overflow: hidden;
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.06);
}

.qs-info-stack[open] {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.98));
}

.qs-info-summary {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  padding: 0.68rem 0.85rem;
  list-style: none;
}

.qs-info-summary::-webkit-details-marker {
  display: none;
}

.qs-info-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.6rem;
  height: 1.6rem;
  border-radius: 999px;
  border: 1px solid var(--color-border-strong);
  background: var(--color-surface);
  color: var(--color-text-primary);
  font-size: 0.78rem;
  font-weight: 700;
}

.qs-info-body {
  border-top: 1px solid var(--color-border);
  padding: 0.75rem 0.85rem 0.85rem;
  display: grid;
  grid-gap: 0.58rem;
  gap: 0.58rem;
}

.qs-info-tier {
  display: grid;
  grid-gap: 0.3rem;
  gap: 0.3rem;
  padding: 0.58rem 0.64rem;
  border: 1px solid var(--color-border);
  border-radius: 14px;
  background: #FFFFFF;
}

.qs-info-tier-kicker {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #64748B;
  font-weight: 600;
}

.qs-info-tier strong {
  font-size: 0.92rem;
  color: #1E293B;
  font-weight: 700;
}

.qs-info-tier p {
  margin: 0;
  font-size: 0.82rem;
  color: var(--color-text-secondary);
}

.qs-info-impact-row {
  display: grid;
  grid-gap: 0.15rem;
  gap: 0.15rem;
  padding: 0.42rem 0.46rem;
  border-radius: 10px;
  border: 1px solid var(--color-border);
  background: var(--color-surface);
}

.qs-info-impact-row strong {
  font-size: 0.78rem;
}

.qs-info-impact-row span {
  font-size: 0.8rem;
  color: var(--color-text-primary);
}

.qs-info-impact-row-critical {
  border-color: #FECACA;
  background: #FEF2F2;
}

.qs-info-tech {
  border: 1px solid var(--color-border);
  border-radius: 12px;
  background: #FFFFFF;
}

.qs-info-tech-summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.4rem;
  padding: 0.42rem 0.58rem;
}

.qs-info-tech-summary::-webkit-details-marker {
  display: none;
}

.qs-info-tech-summary span {
  min-width: 1.5rem;
  height: 1.5rem;
  border-radius: 999px;
  border: 1px solid var(--color-border-strong);
  background: var(--color-surface);
  color: var(--color-text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.74rem;
  font-weight: 700;
}

.qs-info-tech-body {
  border-top: 1px solid var(--color-border);
  padding: 0.52rem 0.58rem 0.62rem;
  display: grid;
  grid-gap: 0.52rem;
  gap: 0.52rem;
}

.qs-explain-grid {
  margin-top: 0.8rem;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  grid-gap: 1rem;
  gap: 1rem;
}

.qs-explain-grid p {
  margin: 0.35rem 0 0;
  color: var(--ink-muted);
  font-size: 0.88rem;
}

.qs-explain-popover {
  margin: 0.9rem 0 0.6rem;
}

.qs-explain-trigger {
  cursor: pointer;
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.45rem 0.85rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 82%, var(--panel));
  color: var(--ink);
  font-weight: 600;
  font-size: 0.86rem;
}

.qs-explain-trigger::-webkit-details-marker {
  display: none;
}

.qs-explain-trigger:focus-visible {
  outline: 3px solid var(--qs-focus-outline);
}

.qs-explain-popover .qs-explain-panel {
  position: static;
  margin-top: 0.7rem;
}

.qs-results-controls .qs-explain-popover {
  margin: 0;
}

.qs-results-controls .qs-explain-popover[open] {
  width: min(520px, 100%);
}

.qs-results-explain-chip {
  min-height: 38px;
  margin: 0;
  padding: 0.38rem 0.72rem;
}

.qs-degraded-chip {
  border-color: #FDE68A;
  background: #FEF3C7;
  color: #854D0E;
}

.qs-results-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 0.8rem;
}

.qs-sources-popover {
  margin-top: 0.35rem;
}

.qs-freshness-global {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-left: 0.45rem;
  font-size: 0.82rem;
  color: var(--color-text-primary);
}

.qs-freshness-global-unknown {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}

.qs-sources-trigger {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  cursor: pointer;
  color: var(--color-text-primary);
  font-size: 0.83rem;
  list-style: none;
}

.qs-sources-trigger::-webkit-details-marker {
  display: none;
}

.qs-sources-detail-link {
  color: #1E40AF;
  text-decoration: underline;
}

.qs-sources-panel {
  margin-top: 0.4rem;
  padding: 0.6rem 0.7rem;
  min-width: min(340px, 92vw);
}

.qs-sources-panel ul {
  margin: 0.45rem 0 0;
  padding-left: 1.05rem;
  display: grid;
  grid-gap: 0.3rem;
  gap: 0.3rem;
}

.qs-sources-panel li {
  display: flex;
  justify-content: space-between;
  gap: 0.7rem;
  color: var(--color-text-primary);
}

.qs-result-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-gap: 1.2rem;
  gap: 1.2rem;
  padding: 1rem;
  border-bottom: 1px dashed var(--border);
}

.qs-result-row:last-child {
  border-bottom: none;
}

.qs-result-row-ai {
  position: relative;
  box-shadow:
    inset 3px 0 0 color-mix(in srgb, var(--color-accent) 58%, transparent),
    0 0 0 1px color-mix(in srgb, var(--color-accent) 10%, transparent);
}

.qs-result-main {
  display: grid;
  grid-gap: 0.35rem;
  gap: 0.35rem;
}

.qs-result-kicker {
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #64748B;
}

.qs-result-route {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.qs-result-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  color: var(--ink-muted);
  font-size: 0.88rem;
}

.qs-result-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 0.8rem;
  font-size: 0.8rem;
  color: var(--color-text-secondary);
}

.qs-result-stats strong {
  color: var(--color-text-primary);
  font-weight: 600;
}

.qs-result-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.qs-tag {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  border: 1px solid transparent;
  padding: 0.2rem 0.55rem;
  font-size: 0.76rem;
  font-weight: 600;
  line-height: 1.25;
}

.qs-tag-low {
  background: #DCFCE7;
  color: #166534;
  border-color: #86EFAC;
}

.qs-tag-med {
  background: #FEF9C3;
  color: #854D0E;
  border-color: #FDE047;
}

.qs-tag-high {
  background: #FEE2E2;
  color: #991B1B;
  border-color: #FCA5A5;
}

.qs-tag-fresh {
  background: #DBEAFE;
  color: #1E40AF;
  border-color: #93C5FD;
}

.qs-tag-stale {
  background: var(--color-border);
  color: var(--color-text-primary);
  border-color: var(--color-border-strong);
}

.qs-tag-ai {
  background: color-mix(in srgb, var(--color-accent) 16%, transparent);
  color: var(--color-accent-strong);
  border-color: color-mix(in srgb, var(--color-accent) 42%, transparent);
}

.qs-result-ai-reason {
  margin: 0.35rem 0 0;
  font-size: 0.82rem;
  line-height: 1.45;
  color: var(--color-text-secondary);
}

.qs-result-ai-reason strong {
  color: var(--color-text-primary);
}

.qs-result-detail-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.qs-result-actions {
  display: grid;
  grid-gap: 0.6rem;
  gap: 0.6rem;
  justify-items: end;
}

.qs-result-price {
  display: grid;
  grid-gap: 0.2rem;
  gap: 0.2rem;
  text-align: right;
  font-size: 0.88rem;
  color: var(--ink-muted);
}

.qs-result-price strong {
  color: var(--ink);
  font-size: 1.05rem;
}

.qs-result-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  justify-content: flex-end;
  align-items: center;
}

.qs-result-row-compact {
  gap: 0.85rem;
  padding: 0.75rem;
}

.qs-result-row-compact.qs-result-row-ai {
  box-shadow:
    inset 3px 0 0 color-mix(in srgb, var(--color-accent) 58%, transparent),
    0 0 0 1px color-mix(in srgb, var(--color-accent) 12%, transparent);
}

.qs-result-meta-compact {
  font-size: 0.82rem;
}

.qs-result-row-compact .qs-result-main {
  gap: 0.22rem;
}

.qs-result-row-compact .qs-result-actions {
  align-items: center;
  justify-items: end;
  align-content: center;
  gap: 0.45rem;
}

.qs-result-row-compact .qs-result-price {
  gap: 0;
}

.qs-result-row-compact .qs-result-price strong {
  font-size: 1rem;
}

.qs-result-row-compact .qs-result-buttons {
  gap: 0.3rem;
  align-items: center;
}

.qs-result-row-compact .qs-row-save {
  min-height: 32px;
}

.qs-row-save {
  min-height: 36px;
}

.qs-result-details-link {
  border: none;
  background: none;
  color: inherit;
  text-decoration: none;
  font-size: inherit;
  padding: 0;
}

.qs-result-details-link:focus-visible {
  outline: 2px solid #93C5FD;
  outline-offset: 2px;
  border-radius: 6px;
}

.qs-row-menu-wrap {
  position: relative;
}

.qs-row-menu-trigger {
  min-width: 36px;
  min-height: 36px;
  padding: 0.2rem 0.4rem;
  font-size: 1.15rem;
  line-height: 1;
}

.qs-row-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 0.35rem);
  z-index: 16;
  min-width: 190px;
  border: 1px solid var(--color-border-strong);
  border-radius: 10px;
  background: #FFFFFF;
  box-shadow: 0 14px 24px rgba(15, 23, 42, 0.14);
  padding: 0.3rem;
  display: grid;
  grid-gap: 0.2rem;
  gap: 0.2rem;
}

.qs-row-menu-item {
  display: block;
  width: 100%;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: var(--color-text-primary);
  text-align: left;
  padding: 0.45rem 0.5rem;
  font-size: 0.84rem;
  text-decoration: none;
  cursor: pointer;
}

.qs-row-menu-item:hover {
  background: var(--color-surface);
}

.qs-row-menu-item:focus-visible {
  outline: 2px solid #93C5FD;
  outline-offset: 1px;
}

.qs-empty {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  flex-wrap: wrap;
}

.qs-empty-title {
  margin: 0;
  font-size: 1.2rem;
  line-height: 1.25;
  font-weight: 600;
  color: var(--color-text-primary);
}

.qs-empty-cause-block {
  display: grid;
  grid-gap: 0.45rem;
  gap: 0.45rem;
}

.qs-empty-causes {
  margin: 0;
  padding-left: 1.1rem;
  display: grid;
  grid-gap: 0.25rem;
  gap: 0.25rem;
  color: var(--ink-muted);
}

.qs-empty-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
}

.qs-empty-primary-cta {
  min-height: 44px;
  align-self: flex-start;
}


.chip-low {
  border-color: color-mix(in srgb, var(--qs-accent) 20%, var(--border));
  color: #2f6e62;
}

.chip-medium {
  border-color: color-mix(in srgb, var(--qs-accent) 40%, var(--border));
  color: #b97848;
}

.chip-high {
  border-color: color-mix(in srgb, var(--qs-accent) 60%, var(--border));
  color: #9b3b2b;
}

.chip-warn {
  border-color: color-mix(in srgb, var(--border) 60%, #d9a441);
  color: #7a5a12;
}

.stack {
  display: grid;
  grid-gap: 0.75rem;
  gap: 0.75rem;
}

.stack-lg {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
}


.form-spaced {
  margin-top: 1.5rem;
}

.panel-center {
  display: grid;
  place-items: center;
}

.panel-meta {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  color: var(--ink-muted);
  font-size: 0.88rem;
}

.result-row {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: center;
  padding: 0.4rem 0;
  border-bottom: 1px dashed var(--border);
}

.result-row:last-child {
  border-bottom: none;
}

.result-meta {
  opacity: 0.8;
}

.result-source {
  font-size: 0.85rem;
  opacity: 0.75;
}

.result-actions {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  flex-wrap: wrap;
}

.weather-days {
  display: grid;
  grid-gap: 0.8rem;
  gap: 0.8rem;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.history-multi {
  min-height: 7rem;
}

.history-range {
  margin-top: 1rem;
  padding: 0.9rem;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: var(--surface);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.6);
}

.history-range-control {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
}

.history-range-left {
  display: grid;
  grid-gap: 0.2rem;
  gap: 0.2rem;
}

.history-range-field {
  display: grid;
  grid-gap: 0.25rem;
  gap: 0.25rem;
}

.history-range-label {
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-muted);
}

.history-range-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.history-range-actions .btn-ghost.is-active {
  border-color: rgba(217, 93, 57, 0.5);
  box-shadow: var(--btn-shadow);
}

.history-chart-panel {
  margin-top: 1rem;
}

.history-chart--compact {
  padding-top: 0.7rem;
  padding-bottom: 0.9rem;
}

.history-detail {
  margin-bottom: 0.75rem;
}

.history-detail-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.7rem 0.85rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 93%, transparent);
  box-shadow: none;
}

.history-detail-label {
  display: block;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--ink-muted);
  margin-bottom: 0.2rem;
}

.history-detail-meta {
  display: grid;
  grid-gap: 0.2rem;
  gap: 0.2rem;
  font-size: 0.82rem;
  color: var(--ink-muted);
  text-align: right;
}

.history-detail-empty {
  padding: 0.7rem 0.85rem;
  border-radius: 14px;
  border: 1px dashed color-mix(in srgb, var(--border) 74%, transparent);
  background: color-mix(in srgb, var(--surface) 90%, transparent);
  font-size: 0.85rem;
  color: var(--ink-muted);
}

.history-calendar-panel {
  margin-top: 1rem;
}

.history-tooltip {
  position: absolute;
  transform: translate(-50%, calc(-100% - 12px));
  min-width: 180px;
  padding: 0.65rem 0.8rem;
  border-radius: 12px;
  background: var(--surface);
  border: 1px solid var(--border);
  box-shadow: 0 18px 30px var(--shadow);
  display: grid;
  grid-gap: 0.2rem;
  gap: 0.2rem;
  font-size: 0.82rem;
  pointer-events: none;
  z-index: 2;
}

.history-tooltip-tag {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.68rem;
  color: var(--ink-muted);
  font-weight: 700;
}

.history-heat-legend {
  margin-top: 0.9rem;
  display: grid;
  grid-gap: 0.55rem;
  gap: 0.55rem;
  font-size: 0.82rem;
  color: var(--ink-muted);
}
.history-compact-note {
  margin-top: 0.7rem;
  padding: 0.72rem 0.85rem;
  border-radius: 12px;
  border: 1px dashed color-mix(in srgb, var(--border) 74%, transparent);
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  color: var(--ink-muted);
}
.history-compact-note strong {
  display: block;
  margin-bottom: 0.2rem;
  color: var(--ink);
}
.history-compact-note p {
  margin: 0;
}
.history-compact-note--calendar {
  margin-top: 0;
}

.history-heat-bar {
  width: 100%;
  height: 10px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(46, 110, 98, 0.4), rgba(217, 93, 57, 0.32));
  border: 1px solid rgba(46, 110, 98, 0.35);
}

.history-heat-scale {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-gap: 0.5rem;
  gap: 0.5rem;
}

.history-heat-scale-item {
  display: grid;
  grid-gap: 0.08rem;
  gap: 0.08rem;
}

.history-heat-scale-item strong {
  font-size: 0.74rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.history-heat-explainer {
  margin: 0;
}

.legend-chip {
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 0.1rem 0.55rem;
  font-size: 0.78rem;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  background: transparent;
  line-height: 1.6;
}

.legend-dot {
  display: inline-block;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
}

.month-title {
  text-transform: capitalize;
}

.watchlist-decision-grid {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(320px, 2fr);
  grid-gap: 1.05rem;
  gap: 1.05rem;
  align-items: start;
}

.watch-map-panel {
  min-height: 100%;
  display: grid;
  grid-gap: 0.8rem;
  gap: 0.8rem;
  align-content: start;
  background: linear-gradient(160deg, rgba(255, 247, 235, 0.92), rgba(243, 239, 232, 0.84));
}

.watch-map-header {
  align-items: start;
}

.watch-map-copy {
  display: grid;
  grid-gap: 0.35rem;
  gap: 0.35rem;
  max-width: 64ch;
}

.watch-map-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 0.42rem;
  gap: 0.42rem;
  word-break: break-word;
  overflow-wrap: break-word;
}

.watch-map-meta-item {
  display: grid;
  grid-gap: 0.18rem;
  gap: 0.18rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--border) 74%, transparent);
  background: color-mix(in srgb, var(--surface) 92%, transparent);
  padding: 0.5rem 0.62rem;
}

.watch-map-meta-item span {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ink-muted);
}

.watch-map-meta-item strong {
  font-size: 0.86rem;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

.watch-map-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem 1rem;
  margin-top: 0.4rem;
}

.watch-map-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.78rem;
  color: var(--ink-muted);
}

.watch-map-legend-swatch {
  width: 0.9rem;
  height: 0.9rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--border) 80%, var(--ink-muted) 20%);
}

.watch-map-legend-swatch-primary { background: #d95d39; }
.watch-map-legend-swatch-compared { background: #2e6e62; }
.watch-map-legend-swatch-other { background: #8f7a65; }

.watch-map-insight {
  border-radius: 11px;
  border: 1px solid rgba(217, 93, 57, 0.28);
  background: rgba(217, 93, 57, 0.1);
  padding: 0.48rem 0.6rem;
  font-size: 0.84rem;
  color: var(--ink);
}

.watch-map-insight-stability {
  border-color: rgba(46, 110, 98, 0.34);
  background: rgba(46, 110, 98, 0.12);
}

.watch-map-limit {
  font-size: 0.77rem;
  color: var(--ink-muted);
  text-wrap: pretty;
}

.watch-map-stage {
  border: 1px solid var(--border);
  border-radius: 16px;
  overflow: hidden;
  background: color-mix(in srgb, var(--surface) 92%, #f8f4ed);
  min-height: 320px;
}

.watch-map-canvas {
  height: 410px;
}

.mapcn-marker-host {
  pointer-events: auto;
}

.watch-map-chip {
  display: grid;
  grid-gap: 0.08rem;
  gap: 0.08rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: rgba(255, 250, 244, 0.95);
  padding: 0.25rem 0.45rem;
  font-size: 0.7rem;
  line-height: 1.12;
  box-shadow: 0 8px 20px rgba(31, 29, 26, 0.18);
}

.watch-map-chip strong {
  font-size: 0.74rem;
}

.watch-map-chip.is-primary {
  border-color: rgba(217, 93, 57, 0.55);
  box-shadow: 0 10px 24px rgba(217, 93, 57, 0.22);
}

.watch-map-chip-destination.is-primary {
  border-color: rgba(46, 110, 98, 0.5);
}

.watch-map-popup {
  display: grid;
  grid-gap: 0.35rem;
  gap: 0.35rem;
  min-width: 180px;
}

.watch-map-popup header {
  display: grid;
  grid-gap: 0.2rem;
  gap: 0.2rem;
}

.watch-map-popup header span {
  font-size: 0.75rem;
  color: var(--ink-muted);
}

.watch-map-popup p {
  margin: 0;
  font-size: 0.82rem;
}

.maplibregl-popup-content {
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--border) 74%, transparent);
  background: color-mix(in srgb, var(--surface) 96%, transparent);
  color: var(--ink);
  box-shadow: 0 16px 30px color-mix(in srgb, var(--shadow-strong) 22%, transparent);
}

.maplibregl-popup-tip {
  border-top-color: color-mix(in srgb, var(--surface) 96%, transparent) !important;
}

.watch-map-empty-state {
  border: 1px dashed color-mix(in srgb, var(--border) 74%, transparent);
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface) 90%, transparent);
  padding: 0.85rem;
  display: grid;
  grid-gap: 0.65rem;
  gap: 0.65rem;
}

.watch-map-empty-visual {
  display: grid;
  grid-template-columns: auto minmax(40px, 1fr) auto;
  align-items: center;
  grid-gap: 0.55rem;
  gap: 0.55rem;
}

.watch-map-empty-node {
  min-width: 54px;
  min-height: 32px;
  padding: 0.32rem 0.5rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--border) 74%, transparent);
  background: color-mix(in srgb, var(--surface) 95%, transparent);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.06em;
}

.watch-map-empty-node-origin {
  color: #b45309;
}

.watch-map-empty-node-destination {
  color: #0f766e;
}

.watch-map-empty-line {
  display: block;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(180, 83, 9, 0.38), rgba(15, 118, 110, 0.48));
}

.watch-map-empty-copy {
  display: grid;
  grid-gap: 0.25rem;
  gap: 0.25rem;
  word-break: break-word;
  overflow-wrap: break-word;
}

@media (max-width: 1120px) {
  .watchlist-decision-grid {
    grid-template-columns: minmax(0, 1fr);
  }


  .watch-map-canvas {
    height: 320px;
  }
}

@media (max-width: 768px) {
  .watch-map-stage {
    min-height: 260px;
  }

  .watch-map-canvas {
    height: 286px;
  }

  .watch-map-meta {
    grid-template-columns: minmax(0, 1fr);
  }
}


.row-start {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.field {
  display: grid;
  grid-gap: 0.3rem;
  gap: 0.3rem;
  font-weight: 600;
}

.field .hint {
  font-weight: 400;
  font-size: 0.85rem;
  color: var(--ink-muted);
}

.suggestion-form {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
}

.suggestion-form textarea,
.suggestion-form select {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 0.7rem 0.8rem;
  font: inherit;
  background: var(--input-bg);
  color: var(--ink);
  box-shadow: inset 0 1px 2px rgba(31, 29, 26, 0.08);
}

.suggestion-form textarea:focus,
.suggestion-form select:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(217, 93, 57, 0.2);
}

.char-counter {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 0.4rem;
  font-size: 0.82rem;
  color: var(--ink-muted);
}

.counter-chip {
  border: 1px solid rgba(46, 110, 98, 0.4);
  background: rgba(46, 110, 98, 0.12);
  color: var(--accent-2);
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  font-weight: 600;
}

.counter-chip.warning {
  border-color: rgba(199, 154, 58, 0.5);
  background: rgba(199, 154, 58, 0.16);
  color: #7c5b18;
}

.counter-chip.danger {
  border-color: rgba(217, 93, 57, 0.5);
  background: rgba(217, 93, 57, 0.16);
  color: var(--accent);
}

/* =========================
   C7.4 VISUAL POLISH
   ========================= */
.cycle4-page {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
}

.suggestions-page .panel,
.admin-page .panel {
  padding: clamp(1rem, 0.8rem + 0.8vw, 1.4rem);
}

.suggestions-page .suggestion-form {
  gap: 1.1rem;
}

.suggestions-actions {
  align-items: center;
}

.state-pill {
  margin-left: auto;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--surface);
  padding: 0.28rem 0.7rem;
  font-size: 0.78rem;
  font-weight: 600;
}

.state-pill.state-loading {
  border-color: var(--state-warning-border);
  background: var(--state-warning-bg);
  color: var(--state-warning-text);
}

.state-pill.state-success {
  border-color: var(--state-success-border);
  background: var(--state-success-bg);
  color: var(--state-success-text);
}

.state-pill.state-error {
  border-color: var(--state-error-border);
  background: var(--state-error-bg);
  color: var(--state-error-text);
}

.admin-page .list-row {
  padding-block: 0.2rem;
}

.policies-context-note {
  margin-top: 0.25rem;
}

.policies-page .policies-section,
.policies-page .policies-tldr,
.policies-page .policies-index,
.policies-page .policies-quick-card {
  border-radius: 16px;
}

.policies-page .policies-section p,
.policies-page .policies-quick-card p {
  line-height: 1.58;
}

.alert-form {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
}

.alerts-hero {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 20%, color-mix(in srgb, var(--accent) 15%, transparent), transparent 45%),
    radial-gradient(circle at 86% 24%, color-mix(in srgb, var(--accent-2) 17%, transparent), transparent 48%),
    linear-gradient(145deg, color-mix(in srgb, var(--surface) 92%, var(--panel-bg) 8%), color-mix(in srgb, var(--surface-2) 82%, var(--surface) 18%));
}

.alerts-kicker {
  display: inline-flex;
  align-items: center;
  border: 1px solid color-mix(in srgb, var(--border) 76%, var(--accent) 24%);
  border-radius: 999px;
  padding: 0.18rem 0.52rem;
  font-family: "IBM Plex Mono", "IBM Plex Sans", monospace;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-muted);
}

.alerts-hero-top {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  justify-content: space-between;
}

.alerts-hero-actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.alerts-hero-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-gap: 0.7rem;
  gap: 0.7rem;
}

.alerts-metric-card {
  border: 1px solid color-mix(in srgb, var(--color-border-strong) 78%, transparent);
  border-radius: 14px;
  padding: 0.72rem 0.8rem;
  display: grid;
  grid-gap: 0.2rem;
  gap: 0.2rem;
  background: color-mix(in srgb, var(--color-surface) 92%, var(--color-surface-elevated) 8%);
}

.alerts-metric-card span {
  font-size: 0.76rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-muted);
  font-weight: 700;
}

.alerts-metric-card strong {
  font-family: "Playfair Display", serif;
  font-size: clamp(1.05rem, 1.8vw, 1.35rem);
  line-height: 1.02;
}

.alerts-metric-card small {
  color: var(--ink-muted);
  font-size: 0.78rem;
}

.alerts-flow-links {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.alert-form input,
.alert-form select {
  border: 1px solid var(--color-input-border);
  border-radius: 12px;
  padding: 0.7rem 0.8rem;
  font: inherit;
  background: var(--color-input-bg);
  color: var(--color-text-primary);
  box-shadow: inset 0 1px 2px rgba(31, 29, 26, 0.08);
}

.alert-form input:focus,
.alert-form select:focus {
  outline: none;
  border-color: var(--color-input-focus);
  box-shadow: var(--qs-focus-ring);
}

.alert-check {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-weight: 600;
  cursor: pointer;
}

.alert-check input {
  display: none;
}

.alert-check-ui {
  width: 22px;
  height: 22px;
  border-radius: 6px;
  border: 1px solid var(--color-border-strong);
  background: var(--color-surface-elevated);
  display: grid;
  place-items: center;
  color: transparent;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.alert-check input:checked + .alert-check-ui {
  background: rgba(46, 110, 98, 0.16);
  border-color: rgba(46, 110, 98, 0.4);
  color: var(--accent-2);
}

.alert-preview {
  border: 1px dashed var(--color-border-strong);
  background: color-mix(in srgb, var(--color-surface) 88%, var(--color-surface-elevated));
  padding: 0.7rem 0.9rem;
  border-radius: 12px;
  font-size: 0.88rem;
  color: var(--ink-muted);
}

.alert-chip {
  border: 1px solid color-mix(in srgb, #4f7fa6 48%, var(--color-border));
  background: color-mix(in srgb, #4f7fa6 16%, var(--color-surface));
  border-radius: 999px;
  padding: 0.25rem 0.6rem;
  font-size: 0.8rem;
  font-weight: 600;
}

.alert-row {
  align-items: center;
}

.alerts-rule-meta {
  display: flex;
  gap: 0.4rem;
  flex-wrap: wrap;
  margin-top: 0.22rem;
}

.alerts-rule-meta span {
  border: 1px solid color-mix(in srgb, var(--color-border-strong) 72%, transparent);
  border-radius: 999px;
  padding: 0.14rem 0.46rem;
  background: color-mix(in srgb, var(--color-surface) 94%, transparent);
}

.alert-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.alert-event {
  align-items: flex-start;
  gap: 1rem;
}

.alert-event-main {
  display: grid;
  grid-gap: 0.25rem;
  gap: 0.25rem;
}

.alert-event-side {
  display: grid;
  justify-items: end;
  grid-gap: 0.35rem;
  gap: 0.35rem;
  min-width: 148px;
}

.alert-timestamp {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--ink-muted);
}

.alert-message {
  margin-top: 0.35rem;
  font-size: 0.9rem;
  color: var(--ink);
}

.alert-channel {
  border: 1px solid color-mix(in srgb, var(--accent-2) 44%, var(--color-border));
  background: color-mix(in srgb, var(--accent-2) 16%, var(--color-surface));
  color: var(--accent-2);
  padding: 0.15rem 0.55rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.alerts-segment-toolbar {
  display: flex;
  gap: 0.45rem;
  flex-wrap: wrap;
}

.alerts-segment-btn {
  border-color: color-mix(in srgb, var(--border) 74%, transparent);
}

.alerts-segment-btn.is-active {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  color: var(--ink);
  transform: translateY(-1px);
}

.alert-row:hover {
  background: color-mix(in srgb, var(--accent-2) 8%, transparent);
}

@media (max-width: 740px) {
  .alerts-hero-top {
    flex-direction: column;
  }

  .alerts-hero-actions {
    justify-content: flex-start;
  }

  .alerts-hero-grid {
    grid-template-columns: 1fr;
  }

  .alert-event-side {
    width: 100%;
    justify-items: start;
  }
}

.history-summary--compact {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  grid-gap: 0.8rem;
  gap: 0.8rem;
  margin: 0.5rem 0 0.8rem;
}

.auth-grid {
  display: grid;
  grid-gap: 1.2rem;
  gap: 1.2rem;
  grid-template-columns: 1fr 1fr;
}


.watchlist-header {
  align-items: baseline;
  padding-right: 0.4rem;
}

.watchlist-header-right {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.watchlist-header-controls {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
}

.watchlist-theme-toggle {
  border-radius: 14px;
  border: 1px solid var(--border-default);
  background: color-mix(in srgb, var(--panel-bg) 90%, var(--surface));
  padding: 0.32rem 0.44rem;
  box-shadow: var(--shadow-elevation);
}

.watchlist-header .account-menu {
  min-width: 220px;
}

.watchlist-header .account-trigger {
  padding: 0.4rem 0.6rem;
}

.watchlist-page .history-chart .history-svg {
  display: block;
  width: 100%;
  height: auto;
}

.watchlist-page .history-chart--compact .history-svg {
  display: block;
  width: 100%;
  height: auto;
}

.page-title h1 {
  margin: 0;
}

.page-title p {
  margin: 0.25rem 0 0;
  opacity: 0.9;
  max-width: 72ch;
  line-height: 1.45;
}

.page-message {
  margin: 0 0 1rem;
  font-weight: 600;
}



.watch-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(178px, auto);
  align-items: center;
  grid-gap: 0.72rem 0.84rem;
  gap: 0.72rem 0.84rem;
  min-height: 110px;
}

.watch-details {
  display: grid;
  grid-gap: 0.45rem;
  gap: 0.45rem;
}

.watch-route {
  display: flex;
  gap: 0.44rem;
  flex-wrap: wrap;
  align-items: center;
}

.watch-route strong {
  white-space: nowrap;
}

.watch-date {
  font-size: 0.8rem;
  color: var(--ink-muted);
}

.watch-inline-price {
  margin-left: auto;
  font-size: 1.04rem;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
  letter-spacing: 0.01em;
}

.watch-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  font-size: 0.8rem;
  color: var(--ink-muted);
}

.watch-meta-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.16rem 0.5rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 86%, var(--surface-2));
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

.watch-meta-chip--freshness {
  white-space: nowrap;
}

.watch-note {
  color: var(--ink-muted);
  width: 100%;
  font-size: 0.74rem;
}

.watch-price {
  display: grid;
  grid-gap: 0.28rem;
  gap: 0.28rem;
  text-align: right;
}

.watch-price-area {
  display: grid;
  grid-gap: 0.38rem;
  gap: 0.38rem;
  justify-items: end;
  align-content: center;
}

.watch-price-caption {
  font-size: 0.78rem;
  color: var(--ink-muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.watch-price-main {
  font-size: 1.4rem;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

.watch-smart-header-copy {
  display: grid;
  grid-gap: 0.2rem;
  gap: 0.2rem;
}

.watch-smart-counts {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.5rem;
  margin-top: 0.15rem;
}

.watch-smart-count-pill {
  display: inline-flex;
  align-items: center;
  padding: 0.12rem 0.42rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 80%, var(--surface-2));
  font-size: 0.74rem;
  letter-spacing: 0.01em;
}

.watch-smart-tools {
  display: flex;
  gap: 0.52rem;
  align-items: flex-end;
  flex-wrap: wrap;
}

.watch-bulk-toolbar {
  margin-left: auto;
  row-gap: 0.45rem;
}

.watch-smart-meta {
  display: block;
  margin-top: 0.3rem;
  font-size: 0.8rem;
  color: var(--ink-muted);
}

.watch-smart-search,
.watch-smart-sort {
  display: grid;
  grid-gap: 0.22rem;
  gap: 0.22rem;
  font-size: 0.75rem;
  color: var(--ink-muted);
}

.watch-smart-search input,
.watch-smart-sort select {
  min-width: 145px;
  padding: 0.4rem 0.55rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
  color: var(--ink);
}

.watch-smart-reset[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
}

.watch-row {
  cursor: pointer;
  border-radius: 14px;
  padding: 0.7rem;
  border: 1px solid transparent;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.watch-row:hover {
  border-color: color-mix(in srgb, var(--accent-2) 30%, var(--border));
  background: color-mix(in srgb, var(--surface) 86%, var(--surface-2));
  transform: translateX(2px);
  box-shadow: 0 12px 20px color-mix(in srgb, var(--shadow-strong) 14%, transparent);
}

.watch-row:active {
  transform: translateX(1px) scale(0.995);
}

.watch-row:focus-visible {
  outline: 2px solid var(--border-focus);
  outline-offset: 1px;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent-2) 24%, transparent);
}

.watch-row.watch-row-skeleton:hover,
.watch-row.watch-row-skeleton:active {
  transform: none;
  box-shadow: none;
}

.watch-selected {
  border-bottom-color: transparent;
  background: color-mix(in srgb, var(--surface) 68%, var(--accent-soft));
  box-shadow: 0 0 0 1px rgba(46, 110, 98, 0.22) inset;
}

.watch-spark {
  width: 96px;
  height: 28px;
  color: color-mix(in srgb, var(--accent-2) 80%, var(--ink-muted));
  display: grid;
  align-items: center;
  justify-items: end;
}

.watch-spark svg {
  width: 96px;
  height: 28px;
  overflow: visible;
}

.watch-spark-baseline {
  stroke: color-mix(in srgb, var(--border) 70%, transparent);
  stroke-width: 1;
}

.watch-spark-point {
  fill: var(--surface);
  stroke: currentColor;
}

.watch-spark-point-end {
  stroke-width: 1.3;
}

.watch-spark-meta {
  font-size: 0.72rem;
  text-align: right;
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

.watch-row-actions {
  display: grid;
  grid-template-columns: auto;
  align-items: center;
  justify-items: end;
  grid-gap: 0.32rem;
  gap: 0.32rem;
}

.watch-row-actions > .btn-secondary {
  min-width: 108px;
}

@media (prefers-reduced-motion: reduce) {
  .watch-row,
  .compare-option,
  .history-filter {
    transition: none;
    transform: none;
  }
}

.trend-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: rgba(121, 106, 88, 0.1);
  font-size: 0.78rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

.trend-icon {
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: rgba(121, 106, 88, 0.16);
}

.trend-icon svg {
  width: 14px;
  height: 14px;
}

.trend-up {
  border-color: rgba(217, 93, 57, 0.4);
  background: rgba(217, 93, 57, 0.12);
  color: var(--accent);
}

.trend-up .trend-icon {
  background: rgba(217, 93, 57, 0.2);
}

.trend-up .trend-icon svg {
  transform: rotate(0deg);
}

.trend-down {
  border-color: rgba(46, 110, 98, 0.4);
  background: rgba(46, 110, 98, 0.12);
  color: var(--accent-2);
}

.trend-down .trend-icon {
  background: rgba(46, 110, 98, 0.18);
}

.trend-down .trend-icon svg {
  transform: rotate(180deg);
}

/* Price drop & best-price inline badges */
.watch-price-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-top: 0.1rem;
}

.price-drop-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.15rem 0.5rem;
  border-radius: 6px;
  font-size: 0.725rem;
  font-weight: 600;
  line-height: 1.3;
  border: 1px solid rgba(46, 110, 98, 0.4);
  background: rgba(46, 110, 98, 0.12);
  color: var(--accent-2);
}

.price-drop-icon {
  width: 12px;
  height: 12px;
  flex-shrink: 0;
}

.best-price-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.15rem 0.5rem;
  border-radius: 6px;
  font-size: 0.725rem;
  font-weight: 600;
  line-height: 1.3;
  border: 1px solid rgba(204, 158, 66, 0.45);
  background: rgba(204, 158, 66, 0.12);
  color: #8b6914;
}

.trend-flat {
  color: var(--ink-muted);
}

.trend-flat .trend-icon svg {
  transform: rotate(90deg);
}

.history-note {
  margin-top: 0.6rem;
  font-size: 0.82rem;
  color: var(--ink-muted);
}

.empty-guide {
  display: grid;
  grid-gap: 0.8rem;
  gap: 0.8rem;
  padding: 0.8rem;
  border-radius: 14px;
  border: 1px dashed color-mix(in srgb, var(--border) 78%, transparent);
  background: color-mix(in srgb, var(--surface) 90%, transparent);
}

.watch-empty-search {
  margin-top: 0.7rem;
  display: flex;
  gap: 0.7rem;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 0.7rem 0.8rem;
  border-radius: 12px;
  border: 1px dashed color-mix(in srgb, var(--border) 72%, transparent);
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  color: var(--ink-muted);
}

.watch-empty-search p {
  margin: 0;
}

.empty-steps {
  display: grid;
  grid-gap: 0.4rem;
  gap: 0.4rem;
  font-size: 0.85rem;
  color: var(--ink-muted);
}

.empty-steps strong {
  color: var(--ink);
}

.empty-steps span {
  display: block;
  font-size: 0.82rem;
}

.compare-panel {
  background:
    linear-gradient(
      150deg,
      color-mix(in srgb, var(--surface) 92%, transparent),
      color-mix(in srgb, var(--surface-2) 82%, transparent)
    );
  box-shadow: 0 12px 24px color-mix(in srgb, var(--shadow-strong) 10%, transparent);
}

.compare-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  grid-gap: 0.8rem;
  gap: 0.8rem;
}

.compare-card {
  border-top: 1px solid var(--border);
  border-inline: 0;
  border-bottom: 0;
  border-radius: 16px;
  padding: 0.9rem;
  background: color-mix(in srgb, var(--surface) 94%, transparent);
  display: grid;
  grid-gap: 0.6rem;
  gap: 0.6rem;
  box-shadow: none;
}

.compare-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0.6rem;
}

.compare-card strong,
.compare-count {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

.compare-body {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-gap: 0.6rem;
  gap: 0.6rem;
}

.compare-label {
  display: block;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--ink-muted);
}

.compare-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  font-size: 0.78rem;
  color: var(--ink-muted);
}

.compare-multi-panel {
  position: relative;
}

.compare-panel-body {
  border-top: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
  padding-top: 0.7rem;
}

.compare-selector {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  grid-gap: 0.6rem;
  gap: 0.6rem;
  margin-bottom: 1rem;
}

.compare-option {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  grid-gap: 0.6rem;
  gap: 0.6rem;
  padding: 0.6rem 0.8rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--surface);
  cursor: pointer;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.compare-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.compare-option.active {
  border-color: rgba(46, 110, 98, 0.5);
  background: rgba(46, 110, 98, 0.08);
  box-shadow: none;
  transform: translateY(-2px);
}

.compare-option:focus-within {
  outline: 2px solid var(--border-focus);
  outline-offset: 2px;
}

.compare-check {
  width: 22px;
  height: 22px;
  border-radius: 7px;
  border: 1px solid var(--border);
  display: grid;
  place-items: center;
  color: transparent;
  background: var(--surface-2);
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.compare-check svg {
  width: 14px;
  height: 14px;
}

.compare-option.active .compare-check {
  border-color: rgba(46, 110, 98, 0.5);
  background: rgba(46, 110, 98, 0.18);
  color: var(--accent-2);
}

.compare-route {
  font-weight: 600;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.compare-date {
  font-size: 0.82rem;
  color: var(--ink-muted);
  justify-self: end;
  white-space: nowrap;
}

.compare-count {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.2rem 0.65rem;
  border-radius: 999px;
  border: 1px solid rgba(46, 110, 98, 0.35);
  background: rgba(46, 110, 98, 0.12);
  color: var(--ink);
  font-weight: 600;
}

.compare-grid--multi {
  margin-top: 0.6rem;
}

.compare-card--multi {
  display: grid;
  grid-gap: 0.6rem;
  gap: 0.6rem;
}

.compare-chart {
  display: grid;
  grid-gap: 0.48rem;
  gap: 0.48rem;
  border: 1px solid color-mix(in srgb, var(--border) 74%, transparent);
  border-radius: 12px;
  background:
    linear-gradient(150deg, color-mix(in srgb, var(--history-wash-1) 62%, transparent), transparent),
    color-mix(in srgb, var(--surface) 94%, transparent);
  padding: 0.5rem 0.56rem 0.54rem;
}

.compare-chart-frame {
  width: 100%;
  overflow: hidden;
}

.compare-chart-svg {
  width: 100%;
  height: auto;
  display: block;
}

.compare-chart-grid {
  stroke: color-mix(in srgb, var(--history-grid) 84%, transparent);
  stroke-width: 1;
}

.compare-chart-line {
  stroke-width: 2;
  opacity: 0.36;
  transition: opacity 0.2s ease, stroke-width 0.2s ease;
}

.compare-chart-line.is-current {
  stroke-width: 2.7;
  opacity: 0.98;
}

.compare-chart-endpoint {
  opacity: 0.72;
  stroke: color-mix(in srgb, var(--surface) 86%, var(--panel-bg));
  stroke-width: 1.25;
}

.compare-chart-endpoint--last {
  opacity: 1;
}

.compare-chart-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.32rem 0.45rem;
  align-items: center;
}

.compare-chart-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 0.33rem;
  padding: 0.14rem 0.45rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
  background: color-mix(in srgb, var(--surface-2) 70%, transparent);
  color: var(--ink-muted);
  font-size: 0.68rem;
  line-height: 1.2;
}

.compare-chart-legend-item i {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  flex: 0 0 8px;
}

.compare-chart-legend-item.is-current {
  color: var(--ink);
  border-color: color-mix(in srgb, var(--accent-2) 38%, var(--border));
  background: color-mix(in srgb, var(--accent-2) 13%, var(--surface));
}

.compare-chart-empty {
  margin: 0;
  padding: 0.25rem 0.12rem;
}

/* Nuevo bloque para el Chart Global y Hover */
.compare-chart--global {
  margin-bottom: 1.25rem;
  padding: 1.2rem;
  border-radius: 16px;
  box-shadow: 0 16px 32px var(--shadow);
}

.compare-chart--global .compare-chart-svg {
  min-height: 200px;
}

.compare-chart--global .compare-chart-legend-item {
  font-size: 0.82rem;
  padding: 0.35rem 0.75rem;
  cursor: default;
  transition: transform 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}

/* Modificamos el estado base para que destaque si no hay hover */
.compare-chart-line {
  stroke-width: 2.2;
  opacity: 0.85;
  flex: none;
  transition: opacity 0.25s ease, stroke-width 0.25s ease;
}

/* Estados de Hover para las lineas */
.compare-chart-line.is-focused {
  stroke-width: 3.2;
  opacity: 1;
}

.compare-chart-line.is-muted,
.compare-chart-endpoint.is-muted {
  opacity: 0.15;
}

/* Interaccion con las tarjetas */
.compare-card--multi.is-hovered {
  border-color: rgba(46, 110, 98, 0.45);
  box-shadow: 0 16px 28px var(--shadow);
  transform: translateY(-2px);
}

@media (max-width: 680px) {
  .compare-chart {
    padding: 0.46rem 0.48rem 0.5rem;
  }

  .compare-chart-line {
    stroke-width: 1.75;
  }

  .compare-chart-line.is-current {
    stroke-width: 2.45;
  }

  .compare-chart-legend-item {
    font-size: 0.65rem;
  }
}

.compare-badges {
  display: flex;
  gap: 0.4rem;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.compare-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.18rem 0.5rem;
  border-radius: 999px;
  border: 1px solid rgba(46, 110, 98, 0.35);
  background: rgba(46, 110, 98, 0.1);
  color: var(--text-primary);
  font-size: 0.74rem;
  font-weight: 600;
}

.compare-badge {
  border: 1px solid rgba(46, 110, 98, 0.35);
  background: rgba(46, 110, 98, 0.12);
  border-radius: 999px;
  padding: 0.15rem 0.55rem;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  white-space: nowrap;
}

.compare-subtitle {
  font-size: 0.85rem;
  color: var(--ink-muted);
}

.compare-fresh {
  border: 1px solid rgba(199, 154, 58, 0.45);
  background: rgba(199, 154, 58, 0.12);
  color: #7a5b1c;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  font-weight: 600;
}

.compare-updated {
  font-weight: 600;
}

.muted {
  opacity: 0.8;
  font-size: 0.9rem;
}

.chip {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  border-radius: 999px;
  border: 1px solid var(--color-chip-border);
  background: var(--color-chip-bg);
  color: var(--color-chip-text);
  font-size: 0.72rem;
  font-weight: 700;
  padding: 0.08rem 0.5rem;
  margin-right: 0.4rem;
}

.filter-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  grid-gap: 0.75rem;
  gap: 0.75rem;
}

.history-panel {
  position: relative;
  background:
    linear-gradient(145deg, var(--history-wash-1), transparent 58%),
    linear-gradient(230deg, var(--history-wash-2), transparent 64%),
    var(--panel-bg);
  box-shadow: 0 22px 44px var(--shadow);
}

.history-refresh-indicator {
  margin-top: 0.55rem;
}

.history-loading {
  display: grid;
  grid-gap: 0.7rem;
  gap: 0.7rem;
  margin-top: 0.75rem;
}

.history-skeleton-toolbar {
  width: 36%;
  min-height: 2rem;
}

.history-skeleton-chart {
  width: 100%;
  min-height: 260px;
}

.history-skeleton-line {
  width: 100%;
  min-height: 1rem;
}

.history-layout {
  display: block;
  position: relative;
}

.history-primary {
  min-width: 0;
}

.history-support {
  position: absolute;
  top: 0.6rem;
  right: 0.75rem;
  z-index: 2;
  min-width: 0;
  max-width: 280px;
  pointer-events: auto;
}

.history-heading {
  display: grid;
  grid-gap: 0.25rem;
  gap: 0.25rem;
}

.history-context {
  display: grid;
  grid-gap: 0.35rem;
  gap: 0.35rem;
}

.history-route-line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

.history-route-line-text {
  font-size: 0.86rem;
  color: var(--ink-muted);
}

.history-title {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  margin: 0;
  font-weight: 600;
  letter-spacing: -0.02em;
  font-size: clamp(1.35rem, 2.3vw, 2rem);
}

.history-title-icon {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: var(--surface-2);
  border: 1px solid var(--border);
  color: var(--accent);
  box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.7);
}

.history-title-icon svg {
  width: 18px;
  height: 18px;
}

.history-filterbar {
  margin-top: 0.9rem;
  padding: 0.8rem 0.9rem;
  border: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
  border-radius: 14px;
  background: linear-gradient(160deg, color-mix(in srgb, var(--surface) 84%, transparent), color-mix(in srgb, var(--surface-2) 78%, transparent));
}

.history-filterbar--compact {
  margin-top: 0.75rem;
}

.history-filterbar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0;
}

.history-filterbar-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  flex-wrap: wrap;
  justify-content: flex-start;
}

.history-input {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  border: 1px solid rgba(217, 203, 187, 0.7);
  border-radius: 12px;
  padding: 0.62rem 0.7rem;
  min-height: 42px;
  font: inherit;
  background: var(--input-bg);
  color: var(--ink);
  box-shadow: inset 0 1px 2px rgba(31, 29, 26, 0.08), 0 6px 14px rgba(31, 29, 26, 0.08);
  transition: border-color 0.16s ease, box-shadow 0.16s ease, background 0.16s ease;
}

.history-input:focus {
  outline: none;
  border-color: var(--history-accent);
  box-shadow:
    0 0 0 3px var(--history-halo),
    inset 0 1px 2px rgba(31, 29, 26, 0.12);
}

.history-input:focus-visible {
  outline: 2px solid var(--history-accent);
  outline-offset: 2px;
}

.history-helper {
  font-size: 0.78rem;
  color: var(--ink-muted);
}

.history-scroll {
  scrollbar-width: thin;
  scrollbar-color: var(--history-scrollbar) transparent;
}

.history-scroll::-webkit-scrollbar {
  width: 8px;
}

.history-scroll::-webkit-scrollbar-thumb {
  background: var(--history-scrollbar);
  border-radius: 999px;
}

.history-scroll::-webkit-scrollbar-track {
  background: transparent;
}

.history-stage {
  position: relative;
  animation: historyFade 0.14s ease;
}

.history-chart {
  position: relative;
  background:
    repeating-linear-gradient(
      to right,
      transparent 0 38px,
      var(--history-grid) 38px 39px
    ),
    repeating-linear-gradient(
      to bottom,
      transparent 0 34px,
      var(--history-grid) 34px 35px
    ),
    var(--panel-bg);
  box-shadow: 0 20px 38px var(--shadow);
  border: 1px solid rgba(217, 203, 187, 0.7);
  border-radius: 16px;
  padding: 1rem 1.1rem 1.15rem;
}

.history-svg {
  display: block;
  touch-action: none;
  cursor: crosshair;
}

.history-svg.is-zoomed {
  cursor: -webkit-grab;
  cursor: grab;
}

.history-svg.is-dragging {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

.history-zoom-toolbar {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 0.45rem;
}

.history-zoom-reset {
  border-radius: 999px;
}

.history-chart-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.8rem;
  margin-bottom: 0.6rem;
}

.history-chart-header strong {
  display: block;
  font-size: 0.95rem;
}

.history-chart-controls {
  display: inline-flex;
  gap: 0.4rem;
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid rgba(217, 203, 187, 0.6);
  border-radius: 999px;
  padding: 0.2rem;
}

.history-chart-controls .btn-ghost {
  border-radius: 999px;
  font-size: 0.85rem;
  padding: 0.2rem 0.6rem;
}

.history-chart-controls .btn-ghost.is-active {
  background: var(--accent);
  color: var(--accent-ink);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.3);
}

.history-chart svg {
  width: 100%;
  min-height: 260px;
}

.history-grid {
  fill: none;
  stroke: var(--history-grid);
  stroke-width: 0.6;
}

.history-line {
  fill: none;
  stroke: var(--accent-2);
  stroke-width: 1.6;
}

.history-dot {
  fill: var(--accent);
  opacity: 0.65;
  transition: r 0.12s ease, opacity 0.12s ease;
}

.history-dot.active {
  opacity: 1;
}

.history-tooltip {
  position: absolute;
  top: 78px;
  transform: translateX(-50%);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 0.4rem 0.6rem;
  box-shadow: 0 10px 18px rgba(31, 29, 26, 0.18);
  font-size: 0.78rem;
  display: grid;
  grid-gap: 0.15rem;
  gap: 0.15rem;
  pointer-events: none;
}

.history-heatmap {
  margin-top: 1rem;
  border: 1px solid rgba(217, 203, 187, 0.6);
  border-radius: 14px;
  padding: 0.8rem;
  background: rgba(255, 255, 255, 0.5);
}

.history-heatmap-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.6rem;
  margin-bottom: 0.6rem;
}

.heatmap-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(68px, 1fr));
  grid-gap: 0.35rem;
  gap: 0.35rem;
}

.heatmap-cell {
  border-radius: 10px;
  padding: 0.35rem;
  border: 1px solid rgba(217, 203, 187, 0.4);
  background: linear-gradient(135deg, rgba(217, 93, 57, calc(0.12 + var(--heat) * 0.45)), rgba(46, 110, 98, calc(0.08 + var(--heat) * 0.22)));
  color: var(--ink);
  font-size: 0.72rem;
  text-align: center;
  font-weight: 600;
}

.history-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: 0.5rem;
}

.history-summary {
  margin-top: 0.8rem;
}

.history-summary--kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(158px, 1fr));
  grid-gap: 0.6rem;
  gap: 0.6rem;
}

.history-summary--hero {
  margin-top: 0.82rem;
}

.history-summary--kpis .history-confidence-notice {
  grid-column: 1 / -1;
}

.history-confidence-notice strong,
.history-confidence-notice p {
  word-break: normal;
  overflow-wrap: normal;
}

.history-kpi {
  display: grid;
  grid-gap: 0.2rem;
  gap: 0.2rem;
  padding: 0.5rem 0.7rem;
  align-content: start;
  min-height: 72px;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
  background: color-mix(in srgb, var(--surface) 93%, transparent);
  font-size: 0.82rem;
  box-shadow: none;
}

.history-kpi > span {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.7rem;
  color: var(--ink-muted);
  line-height: 1.2;
}

.history-kpi-icon {
  width: 1rem;
  height: 1rem;
  color: color-mix(in srgb, var(--ink-muted) 76%, var(--accent) 24%);
}

.history-kpi-icon svg {
  width: 100%;
  height: 100%;
}

.history-kpi strong {
  color: var(--ink);
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

.history-microcopy {
  margin-top: 0.72rem;
  font-size: 0.82rem;
}

.watchlist-page > .section-gap {
  margin-top: 0.88rem;
}

.watchlist-page {
  --watchlist-shell-max-width: 1240px;
  max-width: var(--watchlist-shell-max-width);
}

.watchlist-cockpit-grid {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
  align-items: start;
  grid-template-columns: minmax(0, 1.42fr) minmax(320px, 1fr);
  grid-template-areas:
    "history routes"
    "detail map"
    "compare compare";
}

.watchlist-area {
  min-width: 0;
}

.watchlist-area-history { grid-area: history; }
.watchlist-area-routes { grid-area: routes; }
.watchlist-area-detail { grid-area: detail; }
.watchlist-area-map { grid-area: map; }
.watchlist-area-compare { grid-area: compare; }

.watchlist-page .panel-title,
.watchlist-page .panel-subtitle,
.watchlist-page .panel-note,
.watchlist-page .muted {
  text-wrap: pretty;
  word-break: normal;
}

.watchlist-area-routes .panel {
  padding: 0.9rem;
}

.watch-detail-panel .panel-header {
  align-items: flex-start;
}

.watch-detail-panel {
  padding: 0.9rem;
  display: grid;
  grid-gap: 0.72rem;
  gap: 0.72rem;
  align-content: start;
}

.watch-detail-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.7rem;
}

.watch-detail-hero {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.55rem;
  padding: 0.65rem 0.75rem;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--border) 74%, transparent);
  background: color-mix(in srgb, var(--surface) 94%, transparent);
}

.watch-detail-route {
  display: grid;
  grid-gap: 0.12rem;
  gap: 0.12rem;
}

.watch-detail-route strong {
  font-size: 1rem;
  letter-spacing: -0.01em;
}

.watch-detail-block {
  display: grid;
  grid-gap: 0.46rem;
  gap: 0.46rem;
}

.watch-detail-block-title {
  margin: 0;
  font-size: 0.82rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ink-muted);
}

.watch-detail-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 0.48rem;
  gap: 0.48rem;
  word-break: break-word;
  overflow-wrap: break-word;
}

.watch-detail-price-status {
  display: block;
  font-size: 0.72rem;
  font-weight: 500;
  color: var(--ink-muted);
  margin-top: 0.12rem;
  line-height: 1.2;
  font-style: italic;
}

.watch-detail-metric {
  display: grid;
  grid-gap: 0.22rem;
  gap: 0.22rem;
  padding: 0.55rem 0.65rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
  background: color-mix(in srgb, var(--surface) 95%, transparent);
  min-height: 58px;
}

.watch-detail-metric > span {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--ink-muted);
}

.watch-detail-metric > strong {
  font-size: 0.95rem;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

.watch-detail-operational {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 0.38rem 0.52rem;
  gap: 0.38rem 0.52rem;
  font-size: 0.85rem;
  color: var(--ink-muted);
  padding: 0.45rem 0.2rem 0.1rem;
  word-break: break-word;
  overflow-wrap: break-word;
}

.watch-detail-actions {
  margin-top: 0.1rem;
}

.watch-detail-empty-state {
  border: 1px dashed color-mix(in srgb, var(--border) 74%, transparent);
  border-radius: 14px;
  padding: 0.75rem;
  background: color-mix(in srgb, var(--surface-2) 72%, transparent);
  display: grid;
  grid-gap: 0.34rem;
  gap: 0.34rem;
}

.watch-detail-interpretation {
  margin-top: 0.12rem;
}

.watch-detail-interpretation p {
  margin: 0.2rem 0 0;
}

@media (min-width: 1121px) {
  .watch-detail-panel {
    position: -webkit-sticky;
    position: sticky;
    top: 1rem;
  }
}

@media (max-width: 1120px) {
  .watchlist-cockpit-grid {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "history"
      "routes"
      "detail"
      "map"
      "compare";
  }
}

@media (max-width: 768px) {
  .watchlist-cockpit-grid {
    grid-template-areas:
      "routes"
      "detail"
      "history"
      "map"
      "compare";
  }

  .history-filterbar-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .history-route-line {
    align-items: flex-start;
  }

  .history-chart svg {
    min-height: 220px;
  }

  .watch-detail-metrics,
  .watch-detail-operational {
    grid-template-columns: minmax(0, 1fr);
  }

  .watch-detail-actions {
    flex-wrap: wrap;
  }

  .watch-detail-actions > .btn-compact {
    min-height: 40px;
  }
}

.history-disclaimer {
  margin-top: 0.75rem;
  border: 1px dashed color-mix(in srgb, var(--border) 72%, transparent);
  border-radius: 12px;
  padding: 0.5rem 0.7rem;
  background: color-mix(in srgb, var(--surface) 86%, transparent);
  font-size: 0.82rem;
  color: var(--ink-muted);
}

.history-disclaimer summary {
  cursor: pointer;
  font-weight: 600;
  color: var(--ink);
  list-style: none;
}

.history-disclaimer summary::-webkit-details-marker {
  display: none;
}

.history-disclaimer summary::after {
  content: "+";
  float: right;
  color: var(--accent);
}

.history-disclaimer[open] summary::after {
  content: "-";
}

.history-disclaimer p {
  margin: 0.4rem 0 0;
}

.history-calendar {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--surface) 80%, transparent), transparent),
    var(--panel-bg);
  box-shadow: 0 18px 36px var(--shadow);
}

.history-calendar-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.7rem;
  margin-bottom: 0.7rem;
}

.history-calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  grid-gap: 0.4rem;
  gap: 0.4rem;
}

.history-weekday {
  font-weight: 600;
  font-size: 0.86rem;
  color: var(--ink-muted);
}

.history-day {
  min-height: 4.4rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  padding: 0.38rem;
  background: transparent;
  transition: background 0.16s ease, transform 0.16s ease, box-shadow 0.16s ease;
}

.history-day.has-day:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 20px var(--shadow);
}

.history-day.has-event {
  background: rgba(217, 93, 57, 0.1);
  border-color: rgba(217, 93, 57, 0.35);
}

.history-day-number {
  font-size: 0.82rem;
  font-weight: 600;
}

.history-day-meta {
  font-size: 0.76rem;
  margin-top: 0.22rem;
}

.history-ghost {
  position: relative;
  min-height: 220px;
  border-radius: 16px;
  border: 1px dashed rgba(141, 152, 160, 0.4);
  background:
    repeating-linear-gradient(
      90deg,
      transparent 0 38px,
      var(--history-ghost) 38px 39px
    ),
    repeating-linear-gradient(
      180deg,
      transparent 0 34px,
      var(--history-ghost) 34px 35px
    );
  display: grid;
  place-items: center;
  text-align: center;
  color: var(--ink-muted);
  padding: 1rem;
}

.history-ghost--calendar {
  min-height: 160px;
}

/* ── Watchlist — visual hierarchy ── */

/* Level 2: detail panel — softer border */
.watch-detail-panel {
  border-color: color-mix(in srgb, var(--border) 60%, transparent);
}

/* Level 3: map — lighter still */
.watch-map-panel {
  border-color: color-mix(in srgb, var(--border) 44%, transparent);
  background: color-mix(in srgb, var(--surface) 90%, transparent);
}

.watch-map-panel .panel-title {
  font-size: 0.95rem;
}

/* Level 3: compare — discreet when empty */
.compare-panel {
  border-color: color-mix(in srgb, var(--border) 44%, transparent);
}

.compare-panel.compare-empty {
  opacity: 0.72;
}

.compare-panel.compare-empty .panel-title {
  font-size: 0.95rem;
}

.compare-panel.compare-empty .panel-subtitle {
  font-size: 0.82rem;
}

/* Footer — reduce weight */
.viru-footer-block {
  border-top: 1px solid color-mix(in srgb, var(--border) 40%, transparent);
}

.viru-footer-link {
  font-size: 0.85rem;
}

.viru-footer-glow {
  display: none;
}
.history-ghost-line {
  position: absolute;
  width: min(70%, 360px);
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgba(217, 93, 57, 0.4), transparent);
  opacity: 0.6;
}

.btn-layered {
  position: relative;
  isolation: isolate;
}

.btn-layered::before {
  content: "";
  position: absolute;
  inset: -6px;
  border-radius: 18px;
  background: radial-gradient(circle, rgba(217, 93, 57, 0.25), transparent 70%);
  filter: blur(10px);
  opacity: 0;
  transition: opacity 0.18s ease;
  z-index: -1;
}

.btn-layered:hover::before {
  opacity: 0.7;
}

.btn-layered:active {
  transform: translateY(1px);
}

@keyframes historyFade {
  from {
    opacity: 0;
    transform: translateY(6px);
    filter: blur(2px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
  }
}

.modal-overlay {
  position: fixed;
  inset: 0;
  background: var(--overlay);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem 1rem;
  z-index: 60;
}

.modal-card {
  width: min(720px, 92vw);
  background: var(--panel-bg);
  border-radius: var(--radius-lg);
  border: 1px solid var(--border);
  padding: 1.5rem;
  box-shadow: 0 30px 60px var(--shadow);
  max-height: 90vh;
  overflow-y: auto;
}

.modal-header {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: flex-start;
  margin-bottom: 1rem;
}

.modal-header h2 {
  margin: 0;
  font-family: "IBM Plex Sans", sans-serif;
}

.modal-close {
  border: 1px solid var(--border);
  background: transparent;
  border-radius: 10px;
  width: 2.2rem;
  height: 2.2rem;
  padding: 0;
  font-weight: 600;
  cursor: pointer;
  color: var(--ink);
  display: inline-grid;
  place-items: center;
}

.modal-close svg {
  width: 1rem;
  height: 1rem;
}

.cta-row {
  display: flex;
  gap: 0.75rem;
}

.btn-primary,
.btn-search,
.btn-ghost,
.btn-secondary,
.btn-critical,
.btn-danger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  min-height: 52px;
  padding: 0.72rem 1.4rem;
  border-radius: 14px;
  text-decoration: none;
  font-weight: 600;
  letter-spacing: 0.01em;
  transition:
    transform 0.22s cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 0.22s cubic-bezier(0.16, 1, 0.3, 1),
    border-color 0.22s cubic-bezier(0.16, 1, 0.3, 1),
    background-color 0.22s cubic-bezier(0.16, 1, 0.3, 1),
    color 0.22s cubic-bezier(0.16, 1, 0.3, 1);
  cursor: pointer;
}

.btn-primary {
  background: linear-gradient(135deg, var(--color-accent-hover), var(--color-button-primary));
  color: var(--color-button-primary-text);
  border: 1px solid color-mix(in srgb, var(--color-button-primary) 52%, transparent);
  box-shadow:
    0 14px 28px color-mix(in srgb, var(--color-button-primary) 24%, transparent),
    var(--btn-shadow);
}

.btn-secondary {
  background: color-mix(in srgb, var(--color-button-secondary) 86%, var(--color-surface) 14%);
  color: var(--color-button-secondary-text);
  border: 1px solid color-mix(in srgb, var(--color-button-secondary-border) 88%, transparent);
  box-shadow: 0 8px 18px color-mix(in srgb, var(--shadow) 72%, transparent);
}

.btn-ghost {
  background: color-mix(in srgb, var(--color-surface) 40%, transparent);
  color: var(--color-text-primary);
  border: 1px solid color-mix(in srgb, var(--color-border-strong) 78%, transparent);
}

.btn-critical {
  background: linear-gradient(135deg, color-mix(in srgb, var(--color-accent-pressed) 70%, var(--color-surface) 30%), color-mix(in srgb, var(--color-accent-pressed) 86%, var(--color-surface) 14%));
  color: var(--color-text-inverse);
  border: 1px solid rgba(217, 93, 57, 0.4);
  box-shadow: var(--btn-shadow-strong);
}

.btn-danger {
  background: linear-gradient(135deg, color-mix(in srgb, var(--color-accent-pressed) 62%, var(--color-surface) 38%), color-mix(in srgb, var(--color-accent-pressed) 82%, var(--color-surface) 18%));
  color: var(--color-text-inverse);
  border: 1px solid rgba(217, 93, 57, 0.45);
  box-shadow: var(--btn-shadow-strong);
}

.btn-primary:hover,
.btn-search:hover,
.btn-critical:hover,
.btn-danger:hover {
  transform: translateY(-1px);
  box-shadow: var(--btn-shadow-strong);
  border-color: rgba(217, 93, 57, 0.5);
}

.btn-secondary:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--accent) 36%, var(--color-button-secondary-border));
  box-shadow: 0 12px 24px color-mix(in srgb, var(--shadow) 88%, transparent);
  background: color-mix(in srgb, var(--color-button-secondary) 90%, var(--color-surface) 10%);
}

.btn-ghost:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--accent) 32%, var(--color-border-strong));
  background: color-mix(in srgb, var(--color-surface) 72%, transparent);
  box-shadow: 0 8px 18px color-mix(in srgb, var(--shadow) 48%, transparent);
}

.btn-primary:active,
.btn-search:active,
.btn-secondary:active,
.btn-ghost:active,
.btn-critical:active,
.btn-danger:active {
  transform: scale(0.98);
}

.btn-primary:focus-visible,
.btn-search:focus-visible,
.btn-secondary:focus-visible,
.btn-ghost:focus-visible,
.btn-critical:focus-visible,
.btn-danger:focus-visible {
  outline: 3px solid var(--border-focus);
  outline-offset: 2px;
}

.btn-primary:disabled,
.btn-search:disabled,
.btn-secondary:disabled,
.btn-ghost:disabled,
.btn-critical:disabled,
.btn-danger:disabled {
  background: var(--color-button-disabled-bg);
  color: var(--color-button-disabled-text);
  border-color: color-mix(in srgb, var(--color-border) 82%, transparent);
  opacity: 1;
  cursor: not-allowed;
  box-shadow: none;
  transform: none;
}

.btn-primary:disabled:hover,
.btn-search:disabled:hover,
.btn-secondary:disabled:hover,
.btn-ghost:disabled:hover,
.btn-critical:disabled:hover,
.btn-danger:disabled:hover,
.btn-primary:disabled:active,
.btn-search:disabled:active,
.btn-secondary:disabled:active,
.btn-ghost:disabled:active,
.btn-critical:disabled:active,
.btn-danger:disabled:active {
  transform: none;
  box-shadow: none;
  border-color: color-mix(in srgb, var(--color-border) 82%, transparent);
}

.skeleton,
.vt-skeleton {
  display: inline-block;
  border-radius: 10px;
  background: linear-gradient(
    100deg,
    color-mix(in srgb, var(--surface-2) 88%, transparent) 10%,
    color-mix(in srgb, var(--surface) 95%, white 5%) 45%,
    color-mix(in srgb, var(--surface-2) 88%, transparent) 90%
  );
  background-size: 220% 100%;
  animation: vt-skeleton-shimmer 1.6s linear infinite;
}

.vt-skeleton {
  width: 100%;
  min-height: 0.88rem;
}

.vt-skeleton--line {
  min-height: 0.82rem;
}

.vt-skeleton--pill {
  min-height: 1.1rem;
  border-radius: 999px;
}

.vt-skeleton--block {
  min-height: 2rem;
  display: block;
}

.vt-skeleton--circle {
  border-radius: 999px;
}

.vt-skeleton--card {
  min-height: 5.2rem;
  border-radius: 14px;
  display: block;
}

.loading-skeleton-panel,
.loading-skeleton-form,
.loading-skeleton-list {
  display: grid;
  grid-gap: 0.75rem;
  gap: 0.75rem;
}

.loading-skeleton-row {
  display: grid;
  grid-gap: 0.7rem;
  gap: 0.7rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 0.2rem;
}

.loading-skeleton-card {
  min-height: 5.4rem;
}

.loading-skeleton-form .loading-skeleton-field {
  display: grid;
  grid-gap: 0.48rem;
  gap: 0.48rem;
}

.loading-skeleton-cta {
  margin-top: 0.3rem;
}

.loading-skeleton-list-rows {
  display: grid;
  grid-gap: 0.6rem;
  gap: 0.6rem;
}

.loading-skeleton-list-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-gap: 0.65rem;
  gap: 0.65rem;
  align-items: center;
  border: 1px solid color-mix(in srgb, var(--color-border) 84%, transparent);
  border-radius: 12px;
  padding: 0.7rem 0.8rem;
}

.loading-skeleton-list-main {
  display: grid;
  grid-gap: 0.42rem;
  gap: 0.42rem;
}

.loading-skeleton-overlay {
  position: fixed;
  inset: 0;
  z-index: 1400;
  display: grid;
  place-items: center;
  background: color-mix(in srgb, var(--overlay) 72%, transparent);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  pointer-events: none;
}

.loading-skeleton-overlay__card {
  min-width: min(420px, calc(100vw - 2rem));
  min-height: 250px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-color: color-mix(in srgb, var(--border) 70%, transparent);
  box-shadow: 0 20px 52px var(--shadow-strong);
}

.loading-skeleton-overlay__stack {
  display: grid;
  place-items: center;
  grid-gap: 0.72rem;
  gap: 0.72rem;
}

.skeleton-line {
  min-height: 0.8rem;
}

.skeleton-pill {
  min-height: 1.1rem;
  border-radius: 999px;
}

.skeleton-block {
  display: block;
}

.watchlist-skeleton-list {
  display: grid;
  grid-gap: 0.6rem;
  gap: 0.6rem;
  margin-top: 0.7rem;
}

.watch-skeleton-checkbox { width: 1.1rem; }
.watch-skeleton-route { width: 9.5rem; }
.watch-skeleton-date { width: 5.7rem; }
.watch-skeleton-pill { width: 4.2rem; }
.watch-skeleton-meta { width: 11rem; }
.watch-skeleton-note { width: 14rem; }
.watch-skeleton-caption { width: 5.4rem; }
.watch-skeleton-price { width: 7.2rem; min-height: 1.6rem; }
.watch-skeleton-delta { width: 6rem; }
.watch-skeleton-spark { width: 96px; height: 28px; }
.watch-skeleton-button { width: 7.6rem; min-height: 2rem; }

@keyframes vt-skeleton-shimmer {
  0% { background-position: 100% 0; }
  100% { background-position: -120% 0; }
}

@media (prefers-reduced-motion: reduce) {
  .skeleton,
  .vt-skeleton {
    animation: none;
    background-position: 0 0;
  }
}

.split {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  grid-gap: 1rem;
  gap: 1rem;
}

.form {
  display: grid;
  grid-gap: 0.75rem;
  gap: 0.75rem;
}

.form label {
  display: grid;
  grid-gap: 0.25rem;
  gap: 0.25rem;
}

.form input {
  border: 1px solid var(--color-input-border);
  border-radius: 8px;
  padding: 0.65rem;
  font: inherit;
  background: var(--color-input-bg);
  color: var(--color-input-text);
}

.form select {
  border: 1px solid var(--color-input-border);
  border-radius: 8px;
  padding: 0.65rem;
  font: inherit;
  background: var(--color-input-bg);
  color: var(--color-input-text);
}

.form textarea {
  border: 1px solid var(--color-input-border);
  border-radius: 8px;
  padding: 0.65rem;
  font: inherit;
  background: var(--color-input-bg);
  color: var(--color-input-text);
  resize: vertical;
}

/* =========================
   PREFERENCES
   ========================= */
.prefs-shell {
  display: grid;
  grid-gap: 1.4rem;
  gap: 1.4rem;
}

.prefs-header {
  margin-bottom: 0;
}

.prefs-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  grid-gap: 1.2rem;
  gap: 1.2rem;
  padding: 1.35rem;
  border-radius: var(--radius-lg);
  background:
    radial-gradient(circle at 12% 0%, rgba(217, 93, 57, 0.2), transparent 45%),
    radial-gradient(circle at 90% 85%, rgba(46, 110, 98, 0.17), transparent 48%),
    var(--panel-bg);
  border: 1px solid color-mix(in srgb, var(--border) 72%, var(--accent) 28%);
  box-shadow:
    0 20px 36px rgba(31, 29, 26, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.48);
}

.prefs-kicker {
  margin: 0 0 0.2rem;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  font-weight: 800;
  color: color-mix(in srgb, var(--accent) 46%, var(--ink-muted));
}

.prefs-hero-copy h2 {
  margin: 0;
  font-family: "Playfair Display", serif;
  font-size: clamp(1.34rem, 2.2vw, 1.92rem);
  line-height: 1.15;
}

.prefs-hero-copy p {
  margin: 0.42rem 0 0;
  color: var(--ink-muted);
  max-width: 52ch;
  line-height: 1.5;
  min-width: 0;
  overflow-wrap: anywhere;
}

.prefs-hero-summary {
  color: color-mix(in srgb, var(--ink-muted) 82%, var(--accent) 18%);
}

.prefs-hero-chips {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  justify-content: flex-end;
  gap: 0.55rem;
  min-width: 0;
}

.prefs-hero-chips .status-pill {
  padding: 0.25rem 0.62rem;
  font-size: 0.76rem;
  border-color: color-mix(in srgb, var(--state-info-border) 78%, var(--accent) 22%);
  background: color-mix(in srgb, var(--state-info-bg) 82%, var(--surface) 18%);
}

.prefs-layout {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  grid-gap: 1rem;
  gap: 1rem;
  align-items: start;
}

.prefs-nav {
  position: -webkit-sticky;
  position: sticky;
  top: 1rem;
  display: grid;
  grid-gap: 0.5rem;
  gap: 0.5rem;
  padding: 0.8rem;
}

.prefs-nav a {
  text-decoration: none;
  color: var(--ink);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 0.55rem 0.7rem;
  font-weight: 600;
  background: var(--surface);
  box-shadow: 0 8px 14px rgba(31, 29, 26, 0.04);
  transition: transform 0.16s ease, background 0.16s ease, border-color 0.16s ease;
}

.prefs-nav a:hover,
.prefs-nav a:focus-visible {
  background: var(--surface-2);
  border-color: rgba(217, 93, 57, 0.35);
  transform: translateX(2px);
  outline: none;
}

.prefs-nav-mobile {
  display: none;
}

.prefs-form {
  display: grid;
  grid-gap: 1.25rem;
  gap: 1.25rem;
  padding-bottom: calc(7rem + env(safe-area-inset-bottom, 0px));
}

.prefs-priority-block {
  border-color: color-mix(in srgb, var(--accent) 38%, var(--border) 62%);
  box-shadow: 0 16px 30px rgba(31, 29, 26, 0.08);
}

.prefs-secondary-block {
  border-style: dashed;
}

.prefs-advanced {
  display: grid;
  grid-gap: 0.8rem;
  gap: 0.8rem;
}

.prefs-advanced summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.8rem;
  font-weight: 700;
}

.prefs-advanced summary span {
  min-width: 0;
}

.prefs-advanced summary .panel-note {
  overflow-wrap: anywhere;
  text-align: right;
}

.prefs-advanced summary::-webkit-details-marker {
  display: none;
}

.prefs-advanced summary::after {
  content: "+";
  font-size: 1.1rem;
  color: var(--accent);
}

.prefs-advanced[open] summary::after {
  content: "–";
}

.prefs-advanced-content {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
}

.prefs-card {
  display: grid;
  grid-gap: 1.05rem;
  gap: 1.05rem;
  padding: 1.2rem;
  position: relative;
  overflow: hidden;
}

.prefs-card::before {
  content: "";
  position: absolute;
  inset: auto 1.2rem 0 1.2rem;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(217, 93, 57, 0.35), transparent);
  pointer-events: none;
}

.prefs-card:hover {
  box-shadow: 0 22px 42px var(--shadow);
}

.prefs-card[id] {
  scroll-margin-top: 88px;
}

.prefs-card-head {
  display: flex;
  align-items: flex-start;
  gap: 0.82rem;
}

.prefs-card-head > div {
  min-width: 0;
}

.prefs-card-head h2 {
  color: color-mix(in srgb, var(--ink) 92%, var(--accent) 8%);
}

.prefs-card-head .panel-note {
  color: color-mix(in srgb, var(--ink-muted) 88%, var(--ink) 12%);
}

.prefs-icon {
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  border: 1px solid rgba(217, 93, 57, 0.3);
  background: rgba(217, 93, 57, 0.12);
  color: var(--accent);
  flex-shrink: 0;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

.prefs-control {
  min-height: 48px;
}

.prefs-guideline-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 0.75rem;
  gap: 0.75rem;
  align-items: start;
}

.prefs-radius-row {
  display: grid;
  grid-gap: 0.75rem;
  gap: 0.75rem;
  grid-template-columns: minmax(0, 1fr) 112px;
  align-items: center;
}

.prefs-radius-row input[type="range"] {
  accent-color: var(--accent);
  width: 100%;
  min-height: 44px;
}

.prefs-toggle {
  min-height: 48px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface);
  color: var(--ink);
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.7rem;
  padding: 0.5rem 0.72rem;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  width: 100%;
  text-align: left;
  transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease;
}

.prefs-toggle:hover {
  transform: translateY(-1px);
  border-color: rgba(46, 110, 98, 0.42);
  box-shadow: 0 10px 20px rgba(31, 29, 26, 0.09);
}

.prefs-toggle:focus-visible {
  outline: 3px solid var(--border-focus);
  outline-offset: 2px;
}

.prefs-toggle-track {
  width: 48px;
  height: 28px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface-2) 76%, var(--surface));
  padding: 3px;
  display: inline-flex;
  align-items: center;
}

.prefs-toggle-knob {
  width: 20px;
  height: 20px;
  border-radius: 999px;
  background: var(--surface);
  border: 1px solid var(--border);
  transition: transform 0.2s ease;
}

.prefs-toggle.is-on .prefs-toggle-track {
  background: rgba(46, 110, 98, 0.25);
  border-color: rgba(46, 110, 98, 0.45);
}

.prefs-toggle.is-on .prefs-toggle-knob {
  transform: translateX(18px);
}

.prefs-toggle.is-on {
  border-color: rgba(46, 110, 98, 0.5);
  background: color-mix(in srgb, var(--surface) 82%, rgba(46, 110, 98, 0.12));
}

.prefs-inline-callout {
  margin-top: 0.2rem;
}

.prefs-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  min-width: 0;
}

.prefs-chip-row .btn-ghost {
  min-height: 44px;
  border-color: color-mix(in srgb, var(--border-default) 72%, var(--accent) 28%);
  max-width: 100%;
  overflow-wrap: anywhere;
}

.prefs-chip-row .btn-ghost.is-active {
  border-color: rgba(46, 110, 98, 0.62);
  background: rgba(46, 110, 98, 0.16);
  box-shadow: 0 10px 20px rgba(46, 110, 98, 0.2);
}

.prefs-error {
  color: #a33d23;
  font-size: 0.84rem;
}

:root[data-theme="dark"] .prefs-error {
  color: #f4ab8e;
}

.prefs-savebar {
  position: -webkit-sticky;
  position: sticky;
  bottom: 0.75rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.8rem 1rem;
  border-color: rgba(217, 93, 57, 0.32);
  z-index: 55;
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
  background: color-mix(in srgb, var(--panel-bg) 82%, transparent);
  box-shadow: 0 18px 34px rgba(31, 29, 26, 0.15);
}

.prefs-pending-badge {
  border-color: color-mix(in srgb, var(--state-warning-border) 82%, var(--accent) 18%);
  box-shadow: 0 10px 18px rgba(217, 93, 57, 0.16);
}

.prefs-savebar-copy {
  display: grid;
  grid-gap: 0.18rem;
  gap: 0.18rem;
  min-width: 0;
}

.prefs-savebar-copy span {
  color: var(--ink-muted);
  font-size: 0.88rem;
}

.prefs-restore-modal {
  width: min(560px, 92vw);
}

:root[data-theme="dark"] .alert-preview,
:root[data-theme="dark"] .alert-chip,
:root[data-theme="dark"] .alert-channel {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

:root[data-theme="dark"] .alerts-metric-card,
:root[data-theme="dark"] .alerts-rule-meta span {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

@media (prefers-reduced-motion: reduce) {
  .alert-row:hover,
  .alerts-segment-btn.is-active {
    transform: none;
  }
}

.prefs-search-hero {
  grid-template-columns: minmax(0, 1.2fr) minmax(260px, 0.8fr);
}

.prefs-search-form {
  gap: 1.3rem;
}

.prefs-search-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  grid-gap: 1.05rem;
  gap: 1.05rem;
  align-items: start;
}

.prefs-search-grid-essential {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.prefs-search-card {
  min-height: 100%;
}

.prefs-search-card-essential {
  border-color: color-mix(in srgb, var(--accent) 38%, var(--border) 62%);
}

.prefs-search-card h2 {
  margin: 0;
  font-family: "Playfair Display", serif;
  font-size: 1.18rem;
}

.prefs-search-card p {
  margin: 0.25rem 0 0;
}

.prefs-search-card-coverage {
  background:
    radial-gradient(circle at 14% 0%, rgba(46, 110, 98, 0.1), transparent 34%),
    linear-gradient(180deg, color-mix(in srgb, var(--surface) 94%, white 6%), color-mix(in srgb, var(--surface-2) 46%, var(--surface) 54%));
}

.prefs-search-card-timing {
  background:
    radial-gradient(circle at 88% 0%, rgba(217, 93, 57, 0.12), transparent 30%),
    linear-gradient(180deg, color-mix(in srgb, var(--surface) 94%, white 6%), color-mix(in srgb, var(--surface-3) 34%, var(--surface) 66%));
}

.prefs-search-card-connectivity {
  background:
    radial-gradient(circle at 10% 10%, rgba(217, 93, 57, 0.08), transparent 28%),
    radial-gradient(circle at 92% 18%, rgba(46, 110, 98, 0.08), transparent 30%),
    linear-gradient(180deg, color-mix(in srgb, var(--surface) 96%, white 4%), color-mix(in srgb, var(--surface-2) 42%, var(--surface) 58%));
}

.prefs-search-toggle-grid,
.prefs-search-time-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 0.92rem;
  gap: 0.92rem;
}

.prefs-search-inline-callout {
  display: grid;
  grid-gap: 0.2rem;
  gap: 0.2rem;
  border-style: dashed;
}

.prefs-search-inline-callout strong {
  font-size: 0.88rem;
}

.prefs-hub-stack {
  gap: 1.2rem;
}

.prefs-hub-primary {
  border-color: color-mix(in srgb, var(--accent) 42%, var(--border) 58%);
}

.prefs-hub-secondary-grid {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.prefs-hub-secondary .panel-header h2 {
  font-size: 1.02rem;
}

.prefs-region-group {
  border-color: color-mix(in srgb, var(--border) 82%, var(--accent) 18%);
}

.prefs-region-group legend {
  padding: 0 0.3rem;
  font-weight: 700;
  color: color-mix(in srgb, var(--ink) 88%, var(--accent) 12%);
}

.d2d-danger-zone .panel-header {
  align-items: center;
}

.d2d-location-coords {
  min-width: 0;
}

.d2d-location-coords label {
  min-width: 0;
}

:root[data-theme="dark"] .prefs-search-card-coverage,
:root[data-theme="dark"] .prefs-search-card-timing,
:root[data-theme="dark"] .prefs-search-card-connectivity {
  border-color: rgba(95, 114, 104, 0.66);
  box-shadow:
    0 18px 34px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

:root[data-theme="dark"] .prefs-hero {
  box-shadow:
    0 24px 44px rgba(0, 0, 0, 0.44),
    inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

:root[data-theme="dark"] .prefs-hero-chips .status-pill {
  border-color: color-mix(in srgb, var(--state-info-border) 68%, var(--accent-2) 32%);
}

:root[data-theme="dark"] .prefs-toggle {
  background: color-mix(in srgb, var(--surface) 84%, #101513 16%);
}

:root[data-theme="dark"] .prefs-pending-badge {
  box-shadow: 0 12px 20px rgba(0, 0, 0, 0.34);
}

:root[data-theme="dark"] .prefs-search-card-coverage {
  background:
    radial-gradient(circle at 14% 0%, rgba(111, 178, 161, 0.12), transparent 34%),
    linear-gradient(180deg, rgba(25, 31, 29, 0.94), rgba(20, 26, 24, 0.94));
}

:root[data-theme="dark"] .prefs-search-card-timing {
  background:
    radial-gradient(circle at 88% 0%, rgba(224, 123, 86, 0.14), transparent 30%),
    linear-gradient(180deg, rgba(25, 31, 29, 0.94), rgba(18, 22, 20, 0.98));
}

:root[data-theme="dark"] .prefs-search-card-connectivity {
  background:
    radial-gradient(circle at 10% 10%, rgba(224, 123, 86, 0.1), transparent 28%),
    radial-gradient(circle at 92% 18%, rgba(111, 178, 161, 0.1), transparent 30%),
    linear-gradient(180deg, rgba(25, 31, 29, 0.94), rgba(20, 26, 24, 0.96));
}

select {
  border: 1px solid var(--color-input-border);
  border-radius: 8px;
  padding: 0.6rem;
  font: inherit;
  background: var(--color-input-bg);
  color: var(--color-input-text);
}

input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--border-focus);
  outline-offset: 2px;
}

input[type="date"],
input[type="number"],
input[type="email"],
input[type="password"],
input[type="text"],
select,
textarea {
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

input[type="date"] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-image: linear-gradient(135deg, rgba(217, 93, 57, 0.1), transparent 55%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23654b38' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'/%3E%3Cline x1='16' y1='2' x2='16' y2='6'/%3E%3Cline x1='8' y1='2' x2='8' y2='6'/%3E%3Cline x1='3' y1='10' x2='21' y2='10'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.7rem center, right 0.7rem center;
  background-size: auto, 18px 18px;
  padding-right: 2.4rem;
  border-radius: 12px;
}

input:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: var(--color-input-focus);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-input-focus) 38%, transparent);
}

input::placeholder,
textarea::placeholder {
  color: var(--color-input-placeholder);
}

.field-error {
  color: var(--state-error-text);
  border: 1px solid var(--state-error-border);
  background: var(--state-error-bg);
  border-radius: 10px;
  padding: 0.32rem 0.5rem;
  font-size: 0.82rem;
  line-height: 1.3;
}

.date-field {
  display: grid;
  grid-gap: 0.3rem;
  gap: 0.3rem;
}

.grid-kpi {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  grid-gap: 0.75rem;
  gap: 0.75rem;
}

.airport-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-gap: 0.75rem;
  gap: 0.75rem;
  align-items: flex-end;
}

/* =========================
   QUICK SEARCH REFINEMENTS
   ========================= */
.quick-search-panel {
  position: relative;
  overflow: visible;
  border-color: color-mix(in srgb, var(--border) 72%, var(--qs-input-border));
  box-shadow: var(--qs-panel-shadow);
  -webkit-backdrop-filter: blur(2px);
          backdrop-filter: blur(2px);
  border-radius: 32px;
  padding: 1.25rem;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 250, 244, 0.94)),
    var(--panel-bg);
}

.quick-search-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='920' height='360' viewBox='0 0 920 360'%3E%3Cpath d='M70 140c60-42 160-56 230-30 78 30 170 20 240-18 66-36 150-48 230-30 58 14 110 40 150 82' fill='none' stroke='%236c7a89' stroke-width='1.2' stroke-linecap='round'/%3E%3Cpath d='M120 240c70-24 140-16 220 10 74 24 160 24 230-4 70-28 160-44 240-22' fill='none' stroke='%236c7a89' stroke-width='1.2' stroke-linecap='round'/%3E%3Cpath d='M160 70c80-30 170-40 260-16 80 22 160 10 240-18 50-18 110-26 160-20' fill='none' stroke='%236c7a89' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E");
  opacity: 0.018;
  pointer-events: none;
  mix-blend-mode: multiply;
}

.quick-search-panel::after {
  content: "";
  position: absolute;
  left: 12%;
  right: 12%;
  bottom: -24px;
  height: 48px;
  background: radial-gradient(circle, rgba(47, 40, 24, 0.22), transparent 70%);
  filter: blur(10px);
  opacity: 0.42;
  pointer-events: none;
}

.quick-search-panel.ready {
  border-color: rgba(46, 110, 98, 0.45);
  box-shadow: 0 0 0 1px var(--qs-ready), var(--qs-panel-shadow-strong);
}

@media (hover: none), (prefers-reduced-motion: reduce) {
  .quick-search-panel {
    -webkit-backdrop-filter: none;
            backdrop-filter: none;
  }
}

.qs-setup-critical-filters {
  border-radius: 24px;
  background: linear-gradient(180deg, rgba(248, 250, 252, 0.92), rgba(255, 255, 255, 0.96));
}

.qs-route {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  grid-gap: 1rem;
  gap: 1rem;
  align-items: center;
}

.qs-route-card {
  display: grid;
  grid-gap: 0.7rem;
  gap: 0.7rem;
  align-content: flex-start;
  min-height: var(--qs-route-card-min-height);
  padding: 0.95rem 1rem;
  border-radius: 16px;
  background: var(--surface);
  border: 1px solid var(--border);
  box-shadow: 0 12px 24px var(--shadow);
}

.qs-route-line {
  position: relative;
  width: 120px;
  height: 14px;
  display: grid;
  place-items: center;
}

.qs-route-line::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--qs-route-line), transparent);
  border-radius: 999px;
  transform: translateY(-50%);
  box-shadow: 0 0 10px var(--qs-route-glow);
}

.qs-route-swap {
  position: relative;
  z-index: 1;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--border));
  background: color-mix(in srgb, var(--surface) 88%, var(--surface-2));
  color: var(--qs-route-line);
  box-shadow: 0 10px 20px var(--shadow);
  transition:
    transform 0.16s ease,
    color 0.16s ease,
    border-color 0.16s ease,
    box-shadow 0.16s ease;
}

.qs-route-swap svg {
  width: 18px;
  height: 18px;
}

.qs-route:hover .qs-route-swap {
  transform: rotate(8deg) scale(1.02);
  color: color-mix(in srgb, var(--accent) 55%, var(--qs-route-line));
  border-color: color-mix(in srgb, var(--accent) 44%, var(--border));
}

.qs-route-swap:focus-visible {
  outline: 3px solid var(--qs-focus-outline);
  outline-offset: 3px;
}

.qs-route-swap:active {
  transform: scale(0.98);
}

.route-pulse .qs-route-line::before {
  animation: routePulse 0.14s ease;
}

.route-pulse .qs-route-card {
  animation: routeCard 0.14s ease;
}

.qs-label {
  display: grid;
  grid-gap: 0.35rem;
  gap: 0.35rem;
  font-weight: 600;
  line-height: 1.35;
}

.qs-label > span:first-child {
  color: var(--ink);
}

.qs-label small {
  color: var(--qs-text-secondary);
  font-size: 0.82rem;
  line-height: 1.35;
}

.qs-label-inline {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
}

.qs-icon-inline {
  width: 18px;
  height: 18px;
}

.qs-input-wrap {
  position: relative;
  display: grid;
  align-items: center;
  min-height: var(--qs-control-height);
  --qs-prefix-slot: 44px;
  --qs-prefix-left: 0.6rem;
}

.qs-route-card .qs-input-wrap {
  min-height: 44px;
}

.qs-input {
  min-height: var(--qs-control-height);
  border: 1px solid var(--qs-input-border);
  border-radius: 12px;
  padding: 0.7rem 0.85rem 0.7rem 3.25rem;
  font: inherit;
  background: var(--input-bg);
  color: var(--ink);
  box-shadow:
    inset 0 1px 2px rgba(31, 29, 26, 0.14),
    var(--qs-input-elevation);
  transition:
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    background 0.16s ease,
    color 0.16s ease;
}
/* Variante neutra: mismo aspecto sin el padding izquierdo grande del icono de prefijo.
   Para selects, inputs numericos, y cualquier control que no necesite el icono MapPin. */
.qs-input-neutral {
  min-height: var(--qs-control-height);
  border: 1px solid var(--qs-input-border);
  border-radius: 12px;
  padding: 0.7rem 0.85rem;
  font: inherit;
  background: var(--input-bg);
  color: var(--ink);
  box-shadow:
    inset 0 1px 2px rgba(31, 29, 26, 0.14),
    var(--qs-input-elevation);
  transition:
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    background 0.16s ease,
    color 0.16s ease;
}

.qs-input-neutral::placeholder {
  color: var(--qs-placeholder);
  opacity: 1;
  transition: color 0.16s ease, opacity 0.16s ease;
}

.qs-input-neutral:focus-visible {
  outline: none;
  border-color: var(--color-input-focus);
  box-shadow: var(--qs-focus-ring);
}

.qs-input-neutral:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  background: color-mix(in srgb, var(--input-bg) 64%, var(--surface));
}

.qs-route-card .qs-input {
  min-height: 44px;
  height: 44px;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  padding-left: calc(var(--qs-prefix-left) + var(--qs-prefix-slot) + 0.65rem);
}

.qs-input-with-action {
  padding-right: 3rem;
}

.qs-route-card .qs-input-with-action {
  padding-right: 3.15rem;
}

.qs-input::placeholder {
  color: var(--qs-placeholder);
  opacity: 1;
  transition: color 0.16s ease, opacity 0.16s ease;
}

.qs-input:focus-visible {
  outline: none;
  border-color: var(--color-input-focus);
  box-shadow: var(--qs-focus-ring), inset 0 1px 2px rgba(31, 29, 26, 0.22);
}

.qs-input:focus-visible::placeholder {
  color: var(--qs-placeholder-focus);
  opacity: 0.82;
}

.qs-input:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  box-shadow: none;
}

.qs-input:not(:placeholder-shown)::placeholder {
  opacity: 0.58;
}

.qs-autocomplete {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 0.35rem);
  z-index: 15;
  margin: 0;
  padding: 0.35rem;
  list-style: none;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--qs-input-border-strong) 50%, transparent);
  background: var(--color-dropdown-bg);
  box-shadow: 0 18px 30px rgba(31, 29, 26, 0.14);
}

.qs-autocomplete-item {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--ink);
  padding: 0.5rem 0.6rem;
  text-align: left;
  font: inherit;
  cursor: pointer;
}

.qs-autocomplete-item strong {
  font-size: 0.82rem;
  letter-spacing: 0.06em;
}

.qs-autocomplete-item span {
  color: var(--qs-text-secondary);
  font-size: 0.82rem;
}

.qs-autocomplete-group-label {
  padding: 0.5rem 0.9rem 0.2rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--qs-text-secondary);
}

.qs-autocomplete-item:hover,
.qs-autocomplete-item.active {
  background: color-mix(in srgb, var(--accent) 14%, var(--surface));
}

.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;
}

.qs-input-prefix {
  position: absolute;
  left: var(--qs-prefix-left);
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  width: var(--qs-prefix-slot);
  min-width: var(--qs-prefix-slot);
  pointer-events: none;
}

.qs-input-icon {
  width: 16px;
  height: 16px;
  display: inline-grid;
  place-items: center;
  color: color-mix(in srgb, var(--qs-text-secondary) 70%, var(--ink));
  flex: 0 0 16px;
}

.qs-input-inline-action {
  position: absolute;
  right: 0.5rem;
  top: 50%;
  transform: translateY(-50%);
  width: 34px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--qs-input-border) 82%, var(--border));
  background: color-mix(in srgb, var(--surface) 86%, #fff);
  color: var(--ink);
  display: inline-grid;
  place-items: center;
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
  z-index: 3;
}

.qs-input-inline-action svg {
  width: 16px;
  height: 16px;
}

.qs-input-inline-action:hover {
  border-color: var(--qs-input-border-strong);
}

.qs-input-inline-action:focus-visible {
  outline: none;
  box-shadow: var(--qs-focus-ring);
  border-color: var(--qs-input-border-strong);
}

.qs-input-wrap:focus-within .qs-input-prefix {
  color: var(--ink);
}

.qs-input.date-ghost {
  background-image: none;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
}

.qs-date-picker {
  position: relative;
}

.qs-date-trigger {
  width: 100%;
  min-height: 74px;
  justify-content: space-between;
  align-items: center;
  text-align: left;
  padding: 0.88rem 0.95rem 0.9rem 1rem;
  cursor: pointer;
  background:
    radial-gradient(circle at top right, rgba(217, 93, 57, 0.14), transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(255, 248, 241, 0.97)),
    var(--input-bg);
  border-radius: 18px;
  position: relative;
  overflow: hidden;
}

.qs-date-trigger:hover {
  border-color: var(--qs-input-border-strong);
  box-shadow:
    inset 0 1px 1px rgba(31, 29, 26, 0.08),
    0 10px 18px rgba(31, 29, 26, 0.08);
}

.qs-date-picker.is-open .qs-date-trigger {
  border-color: rgba(217, 93, 57, 0.55);
  box-shadow:
    0 0 0 3px rgba(217, 93, 57, 0.12),
    inset 0 1px 1px rgba(31, 29, 26, 0.1),
    0 12px 20px rgba(31, 29, 26, 0.08);
}

.qs-date-picker.is-invalid .qs-date-trigger {
  border-color: var(--state-error-border);
}

.qs-date-trigger::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(205, 191, 170, 0.55), transparent);
}

.qs-date-trigger__content {
  min-width: 0;
  display: grid;
  grid-gap: 0.16rem;
  gap: 0.16rem;
}

.qs-date-trigger__eyebrow {
  font-size: 0.69rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #8a7766;
}

.qs-date-trigger__value {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--ink);
  font-weight: 700;
  font-size: 1.02rem;
  letter-spacing: -0.02em;
}

.qs-date-trigger:not(.has-value) .qs-date-trigger__value {
  color: #493d32;
  font-weight: 500;
}

.qs-date-trigger__meta {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #8a7766;
  font-size: 0.8rem;
  font-weight: 600;
}

.qs-date-trigger__actions {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin-left: 0.8rem;
  padding-left: 0.9rem;
  border-left: 1px solid rgba(205, 191, 170, 0.45);
  flex-shrink: 0;
}

.qs-date-inline-icon,
.qs-date-trigger__caret {
  width: 2rem;
  height: 2rem;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
}

.qs-date-inline-icon {
  color: color-mix(in srgb, var(--qs-text-secondary) 70%, var(--ink));
  background: rgba(255, 255, 255, 0.74);
  border: 1px solid rgba(205, 191, 170, 0.42);
}

.qs-date-inline-icon svg,
.qs-date-trigger__caret svg {
  width: 16px;
  height: 16px;
}

.qs-date-trigger__caret {
  color: #7c6757;
  transition: transform 0.18s ease, color 0.18s ease, background 0.18s ease;
}

.qs-date-trigger__caret.is-open {
  transform: rotate(180deg);
  color: #9a3412;
  background: rgba(255, 237, 213, 0.92);
}

.qs-date-popover {
  position: absolute;
  top: calc(100% + 0.65rem);
  left: 0;
  z-index: 60;
  width: min(100%, 332px);
  min-width: 292px;
  padding: 1rem;
  border-radius: 26px;
  border: 1px solid rgba(205, 191, 170, 0.78);
  background:
    radial-gradient(circle at top right, rgba(217, 93, 57, 0.1), transparent 32%),
    radial-gradient(circle at left center, rgba(46, 110, 98, 0.08), transparent 28%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(255, 248, 241, 0.96));
  box-shadow: 0 28px 56px rgba(32, 28, 21, 0.18);
  -webkit-backdrop-filter: blur(12px);
          backdrop-filter: blur(12px);
  animation: qsDatePopoverIn 160ms cubic-bezier(0.16, 1, 0.3, 1);
  transform-origin: top left;
}

.qs-date-popover::before {
  content: "";
  position: absolute;
  top: -8px;
  left: 1.6rem;
  width: 16px;
  height: 16px;
  transform: rotate(45deg);
  border-left: 1px solid rgba(205, 191, 170, 0.78);
  border-top: 1px solid rgba(205, 191, 170, 0.78);
  background: rgba(255, 250, 246, 0.98);
}

@keyframes qsDatePopoverIn {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.qs-date-popover__header,
.qs-date-popover__nav,
.qs-date-popover__footer {
  display: flex;
  align-items: center;
}

.qs-date-popover__header {
  justify-content: space-between;
  gap: 0.8rem;
  margin-bottom: 0.85rem;
}

.qs-date-popover__header strong {
  display: block;
  color: #1f1d1a;
  font-size: 1.02rem;
  letter-spacing: -0.02em;
  text-transform: capitalize;
}

.qs-date-popover__eyebrow {
  display: block;
  margin-bottom: 0.12rem;
  color: #7c6757;
  font-size: 0.69rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.qs-date-popover__hint-scope-badge {
  display: inline-flex;
  margin-top: 0.28rem;
  padding: 0.16rem 0.48rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, #2e6e62 36%, transparent);
  background: color-mix(in srgb, #2e6e62 12%, transparent);
  color: #2e6e62;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.qs-date-popover__nav {
  gap: 0.45rem;
}

.qs-date-nav {
  width: 2.2rem;
  height: 2.2rem;
  border-radius: 999px;
  border: 1px solid rgba(205, 191, 170, 0.82);
  background: rgba(255, 255, 255, 0.82);
  color: #5f574c;
  display: inline-grid;
  place-items: center;
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, color 0.18s ease;
}

.qs-date-nav:hover {
  transform: translateY(-1px);
  border-color: rgba(217, 93, 57, 0.28);
  background: rgba(255, 243, 236, 0.96);
  color: #9a3412;
}

.qs-date-nav svg {
  width: 15px;
  height: 15px;
}

.qs-date-popover__weekdays,
.qs-date-popover__grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.qs-date-popover__weekdays {
  gap: 0.3rem;
  margin-bottom: 0.42rem;
}

.qs-date-popover__weekdays span {
  display: grid;
  place-items: center;
  min-height: 1.75rem;
  color: #8a7766;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.qs-date-popover__grid {
  gap: 0.34rem;
}

.qs-date-day {
  min-height: 2.5rem;
  border-radius: 16px;
  border: 1px solid transparent;
  background: transparent;
  color: #1f1d1a;
  display: inline-grid;
  place-items: center;
  transition:
    transform 0.18s ease,
    border-color 0.18s ease,
    background 0.18s ease,
    color 0.18s ease,
    box-shadow 0.18s ease;
  position: relative;
  overflow: visible;
}

.qs-date-day:hover:not(.is-disabled) {
  transform: translateY(-1px);
  border-color: rgba(205, 191, 170, 0.8);
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 12px 18px rgba(32, 28, 21, 0.08);
}

.qs-date-day__number {
  font-size: 0.9rem;
  font-weight: 700;
}

.qs-date-day.hint-low:not(.is-outside):not(.is-disabled):not(.is-selected) {
  background: color-mix(in srgb, #2e6e62 16%, transparent);
  border-color: color-mix(in srgb, #2e6e62 34%, transparent);
}

.qs-date-day.hint-mid:not(.is-outside):not(.is-disabled):not(.is-selected) {
  background: color-mix(in srgb, #b45309 15%, transparent);
  border-color: color-mix(in srgb, #b45309 32%, transparent);
}

.qs-date-day.hint-high:not(.is-outside):not(.is-disabled):not(.is-selected) {
  background: color-mix(in srgb, #b42318 14%, transparent);
  border-color: color-mix(in srgb, #b42318 30%, transparent);
}

.qs-date-day.is-hints-loading:not(.is-outside):not(.is-disabled):not(.is-selected) {
  background-image: linear-gradient(
    110deg,
    rgba(223, 209, 191, 0.08) 28%,
    rgba(223, 209, 191, 0.34) 48%,
    rgba(223, 209, 191, 0.08) 68%
  );
  background-size: 220% 100%;
  animation: qsDateHintShimmer 1.55s ease-in-out infinite;
}

.qs-date-day__no-price {
  position: absolute;
  right: 0.3rem;
  bottom: 0.24rem;
  display: inline-flex;
  align-items: center;
  color: color-mix(in srgb, #6f665a 90%, #ffffff 10%);
}

.qs-date-day__no-price-icon {
  width: 0.7rem;
  height: 0.7rem;
  display: inline-grid;
  place-items: center;
  opacity: 0.92;
}

.qs-date-day__no-price-icon svg {
  width: 100%;
  height: 100%;
}

.qs-date-day__no-price-tooltip {
  position: absolute;
  right: 0;
  bottom: calc(100% + 0.35rem);
  min-width: 120px;
  max-width: 170px;
  padding: 0.28rem 0.4rem;
  border-radius: 8px;
  border: 1px solid rgba(205, 191, 170, 0.76);
  background: rgba(255, 251, 245, 0.96);
  color: #544b41;
  font-size: 0.62rem;
  line-height: 1.25;
  text-align: left;
  box-shadow: 0 10px 16px rgba(24, 20, 14, 0.12);
  opacity: 0;
  pointer-events: none;
  transform: translateY(4px);
  transition: opacity 0.14s ease, transform 0.14s ease;
  z-index: 3;
}

.qs-date-day:hover .qs-date-day__no-price-tooltip,
.qs-date-day:focus-visible .qs-date-day__no-price-tooltip {
  opacity: 1;
  transform: translateY(0);
}

.qs-date-day.is-outside {
  color: #b4a593;
}

.qs-date-day.is-today {
  border-color: rgba(46, 110, 98, 0.24);
  color: #1f6a5d;
}

.qs-date-day.is-selected {
  border-color: rgba(217, 93, 57, 0.42);
  background: linear-gradient(180deg, rgba(217, 93, 57, 0.16), rgba(255, 239, 233, 0.96));
  color: #9a3412;
  box-shadow: 0 12px 24px rgba(217, 93, 57, 0.14);
}

.qs-date-day.is-disabled {
  opacity: 0.36;
  cursor: not-allowed;
  box-shadow: none;
}

@keyframes qsDateHintShimmer {
  0% {
    background-position: 190% 0;
  }
  100% {
    background-position: -180% 0;
  }
}

.qs-date-popover__footer {
  justify-content: space-between;
  gap: 0.75rem;
  margin-top: 0.85rem;
  padding-top: 0.8rem;
  border-top: 1px solid rgba(205, 191, 170, 0.34);
}

.qs-date-popover__footer-label {
  color: #8a7766;
  font-size: 0.74rem;
  font-weight: 600;
}

.qs-date-popover__footer strong {
  color: #1f1d1a;
  font-size: 0.84rem;
  letter-spacing: -0.01em;
  text-align: right;
}

.qs-check-inline {
  align-self: center;
  min-height: 44px;
  padding-bottom: 0.1rem;
}

.qs-roundtrip-toggle {
  align-items: flex-start;
  padding-top: 0.2rem;
}

.qs-roundtrip-copy {
  display: grid;
  grid-gap: 0.18rem;
  gap: 0.18rem;
}

.qs-roundtrip-copy strong {
  font-size: 0.95rem;
  line-height: 1.1;
}

@media (max-width: 900px) {
  .qs-date-grid,
  .qs-date-grid.has-return {
    grid-template-columns: 1fr;
  }

  .qs-date-popover {
    width: 100%;
    min-width: 0;
  }

  .qs-date-popover::before {
    left: 1rem;
  }

  .qs-check-inline {
    justify-self: start;
  }
}

.qs-check {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  font-weight: 600;
  color: var(--ink);
  cursor: pointer;
  position: relative;
}

.qs-check input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.qs-check-ui {
  width: 34px;
  height: 34px;
  border-radius: 12px;
  border: 1px solid var(--qs-input-border);
  display: grid;
  place-items: center;
  color: var(--qs-placeholder);
  background: var(--surface-2);
  transition:
    transform 0.16s ease,
    border-color 0.16s ease,
    color 0.16s ease,
    box-shadow 0.16s ease,
    background 0.16s ease;
}

.qs-check-ui svg {
  width: 18px;
  height: 18px;
  transition: transform 0.16s ease;
}

.qs-check input:checked + .qs-check-ui {
  background: color-mix(in srgb, var(--accent-2) 85%, #ffffff);
  color: var(--accent-ink);
  border-color: color-mix(in srgb, var(--accent-2) 70%, var(--border));
  box-shadow: var(--qs-check-shadow);
  transform: translateY(-1px);
}

.qs-check input:checked + .qs-check-ui svg {
  transform: scale(1.08);
}

.qs-check input:focus-visible + .qs-check-ui {
  outline: 3px solid var(--qs-focus-outline);
  outline-offset: 2px;
}

.qs-check input:disabled + .qs-check-ui {
  opacity: 0.55;
}

.qs-passengers {
  display: grid;
  grid-gap: 0.35rem;
  gap: 0.35rem;
}

.qs-passengers-copy,
.qs-passengers-note {
  max-width: 68ch;
}

.qs-stepper {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.4rem;
  border-radius: 999px;
  border: 1px solid var(--qs-input-border);
  background: var(--surface);
  box-shadow: inset 0 1px 2px rgba(31, 29, 26, 0.08);
}

.qs-stepper button {
  width: 36px;
  height: 36px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--surface-2);
  font-size: 1.1rem;
  font-weight: 600;
  cursor: pointer;
  transition: transform 0.16s ease, box-shadow 0.16s ease, background 0.16s ease;
}

.qs-stepper button:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 18px var(--shadow);
}

.qs-stepper button:focus-visible {
  outline: 3px solid var(--qs-focus-outline);
  outline-offset: 2px;
}

.qs-stepper button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

.qs-stepper-value {
  min-width: 108px;
  text-align: center;
  font-weight: 700;
  display: grid;
  grid-gap: 0.08rem;
  gap: 0.08rem;
}

.qs-stepper-value strong {
  font-size: 1rem;
  line-height: 1;
}

.qs-stepper-value small {
  font-size: 0.72rem;
  color: var(--ink-muted);
  line-height: 1.2;
}

.qs-actions {
  display: flex;
  gap: 0.85rem;
  align-items: center;
  flex-wrap: wrap;
}

.qs-search-cta {
  display: grid;
  grid-gap: 0.35rem;
  gap: 0.35rem;
}

.qs-search-cta .btn-search {
  min-height: 44px;
}

.qs-search-hint {
  font-size: 0.8rem;
  color: var(--ink-muted);
}

.qs-return-hint {
  margin-top: 0.1rem;
}

.btn-search {
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, var(--qs-accent), var(--qs-accent-2));
  color: var(--accent-ink);
  border: 1px solid color-mix(in srgb, var(--qs-accent) 62%, rgba(121, 106, 88, 0.22));
  border-radius: 16px;
  box-shadow: var(--qs-button-shadow);
}

.btn-search::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent 20%, rgba(255, 255, 255, 0.35), transparent 60%);
  transform: translateX(-120%);
  transition: transform 0.25s ease;
}

.btn-search:hover::after {
  transform: translateX(120%);
}

.btn-search:hover {
  box-shadow: var(--qs-button-shadow-hover);
  border-color: color-mix(in srgb, var(--qs-accent-2) 72%, rgba(121, 106, 88, 0.2));
}

.btn-search:focus-visible {
  outline: 3px solid var(--qs-focus-outline);
  outline-offset: 2px;
}

.btn-search:disabled {
  opacity: 1;
  color: var(--ink-muted);
  border-color: color-mix(in srgb, var(--border) 76%, rgba(217, 93, 57, 0.12));
  background:
    linear-gradient(180deg, rgba(247, 239, 228, 0.96), rgba(238, 230, 218, 0.94)),
    var(--surface);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.72),
    0 8px 18px rgba(47, 40, 24, 0.08);
  filter: none;
}

.btn-search:disabled::after {
  display: none;
}

.qs-summary {
  margin-top: 0;
  padding: 0.6rem 0.9rem;
  border-radius: 14px;
  border: 1px solid var(--color-border);
  background: #FFFFFF;
  display: grid;
  grid-gap: 0.2rem;
  gap: 0.2rem;
  font-size: 0.9rem;
  box-shadow: 0 12px 20px var(--shadow);
  position: -webkit-sticky;
  position: sticky;
  top: calc(var(--qs-sticky-top) + var(--qs-toolbar-height));
  z-index: 15;
  min-height: var(--qs-summary-height);
  align-self: flex-start;
}

.qs-summary span {
  color: var(--ink-muted);
}

.qs-degraded-inline {
  margin: 0.85rem 0 0;
  color: var(--color-text-secondary);
}

.qs-summary-detail-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.qs-summary-chip {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 0.16rem 0.52rem;
  font-size: 0.75rem;
  font-weight: 600;
  border: 1px solid var(--color-border-strong);
  background: var(--color-surface);
  color: var(--color-text-primary);
}

.qs-summary-chip-highlight {
  animation: qsSummaryHighlight 800ms ease-out;
  border-color: #F59E0B;
  box-shadow: 0 0 0 2px rgba(245, 158, 11, 0.18);
}

@keyframes qsSummaryHighlight {
  0% {
    background: #FEF3C7;
    border-color: #F59E0B;
  }
  100% {
    background: var(--color-surface);
    border-color: var(--color-border-strong);
  }
}

.qs-summary-missing {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: 0.25rem;
}

.qs-summary-missing-badge {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 0.18rem 0.55rem;
  font-size: 0.75rem;
  font-weight: 600;
  background: var(--color-border);
  border: 1px solid var(--color-border-strong);
  color: var(--color-text-primary);
}

.qs-ready {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.88rem;
  color: var(--accent-2);
  font-weight: 600;
}

.qs-ready svg {
  width: 18px;
  height: 18px;
}

.qs-tip {
  display: inline-grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--qs-input-border) 80%, var(--border));
  color: var(--qs-text-secondary);
  font-size: 0.72rem;
  margin-left: 0.35rem;
  position: relative;
  cursor: help;
}

.qs-tip svg {
  width: 12px;
  height: 12px;
}

.qs-tip:focus-visible {
  outline: 3px solid var(--qs-focus-outline);
  outline-offset: 2px;
}

.qs-tip::after {
  content: attr(data-tip);
  position: absolute;
  bottom: 130%;
  left: 50%;
  transform: translateX(-50%) translateY(6px);
  padding: 0.45rem 0.6rem;
  border-radius: 10px;
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--ink);
  font-size: 0.78rem;
  white-space: normal;
  max-width: 260px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.16s ease, transform 0.16s ease;
  box-shadow: 0 10px 20px var(--shadow);
  z-index: 2;
}

.qs-tip:hover::after {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

.qs-tip:focus-visible::after {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

.flag-badge {
  width: 22px;
  height: 14px;
  border-radius: 4px;
  border: 1px solid rgba(120, 110, 98, 0.35);
  background: linear-gradient(
    90deg,
    var(--flag-1) 0%,
    var(--flag-1) 34%,
    var(--flag-2) 34%,
    var(--flag-2) 67%,
    var(--flag-3) 67%,
    var(--flag-3) 100%
  );
  margin-right: 0;
  box-shadow: 0 6px 10px rgba(31, 29, 26, 0.12);
  flex: 0 0 auto;
}

.qs-flag-fallback {
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 1px solid var(--color-border-strong);
  background: var(--color-surface);
  color: #64748B;
  display: inline-grid;
  place-items: center;
  opacity: 0.85;
  flex: none;
  flex: 0 0 18px;
}

.qs-flag-fallback svg {
  width: 12px;
  height: 12px;
}

.qs-flag-emoji {
  width: 18px;
  height: 18px;
  display: inline-grid;
  place-items: center;
  font-size: 16px;
  line-height: 1;
  border-radius: 999px;
  overflow: hidden;
  flex: 0 0 18px;
}

.airport-list button {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.qs-route-card .btn-ghost {
  min-height: var(--qs-control-height);
  transition:
    transform 0.16s ease,
    background 0.16s ease,
    box-shadow 0.16s ease,
    border-color 0.16s ease;
}

.qs-route-card .btn-ghost:hover {
  background: color-mix(in srgb, var(--surface-2) 70%, var(--surface));
  border-color: color-mix(in srgb, var(--accent) 40%, var(--border));
  box-shadow: 0 12px 20px var(--shadow);
  transform: scale(1.02);
}

.qs-route-card .btn-ghost:active {
  transform: scale(0.99);
}

.qs-route-card .btn-ghost:focus-visible {
  outline: 3px solid var(--qs-focus-outline);
  outline-offset: 2px;
}

@keyframes routePulse {
  from {
    opacity: 0.3;
    transform: translateY(-1px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes routeCard {
  from {
    opacity: 0.7;
    transform: translateY(3px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.airport-row small {
  font-size: 0.8rem;
  opacity: 0.7;
}

.airport-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(31, 29, 26, 0.42);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(1rem, 4vw, 2.5rem);
  z-index: 1400;
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
}

.airport-modal {
  width: min(1040px, 96vw);
  background: var(--panel-bg);
  border-radius: 28px;
  box-shadow: 0 28px 56px rgba(32, 28, 21, 0.22);
  overflow: hidden;
  border: 1px solid var(--border);
}

.airport-modal-left {
  background: var(--surface);
  padding: 1.5rem 1.5rem 1.25rem;
}

.airport-modal-left h2 {
  margin: 0 0 1rem;
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--ink);
}

.airport-country-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-gap: 0.6rem 0.75rem;
  gap: 0.6rem 0.75rem;
}

.country-pill {
  border: none;
  background: transparent;
  color: var(--ink);
  font-size: 0.95rem;
  text-align: left;
  padding: 0.4rem 0.2rem;
  border-radius: 20px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.country-pill.active {
  background: var(--accent-2);
  color: var(--color-text-inverse);
  padding: 0.35rem 0.8rem;
  box-shadow: 0 6px 12px rgba(46, 110, 98, 0.18);
}

.airport-modal-right {
  padding: 1.25rem 1.5rem 1.5rem;
}

.airport-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 0.75rem;
}

.airport-modal-header h3 {
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
}

.link-reset {
  border: none;
  background: transparent;
  color: var(--accent-2);
  cursor: pointer;
  font-weight: 500;
}

.link-reset:hover {
  text-decoration: underline;
}

.airport-list {
  display: grid;
  grid-gap: 0.3rem;
  gap: 0.3rem;
  max-height: 330px;
  overflow-y: auto;
  padding-right: 0.25rem;
}

.airport-list button {
  text-align: left;
  border: none;
  background: transparent;
  padding: 0.5rem 0.75rem;
  font-size: 0.95rem;
  color: var(--ink);
  cursor: pointer;
  border-radius: 8px;
}

.airport-list button:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

.airport-list button span {
  opacity: 0.65;
  font-size: 0.85rem;
  margin-left: 0.35rem;
}

.airport-list button:hover {
  background: var(--surface);
}

.page-actions {
  display: flex;
  gap: 0.75rem;
  justify-content: flex-end;
  align-items: center;
}

.theme-switch {
  --toggle-size: 30px;
  --container-width: calc(5.625em * 0.7);
  --container-height: calc(2.5em * 0.6);
  --container-radius: 6.25em;
  --container-light-bg: #3d7eae;
  --container-night-bg: #1d1f2c;
  --circle-container-diameter: calc(3.375em * 0.6);
  --sun-moon-diameter: calc(2.125em * 0.6);
  --sun-bg: #ecca2f;
  --moon-bg: #c4c9d1;
  --spot-color: #959db1;
  --circle-container-offset: calc((var(--circle-container-diameter) - var(--container-height)) / 2 * -1);
  --stars-color: var(--color-text-inverse);
  --clouds-color: #f3fdff;
  --back-clouds-color: #aacadf;
  --transition: 0.5s cubic-bezier(0, -0.02, 0.4, 1.25);
  --circle-transition: 0.3s cubic-bezier(0, -0.02, 0.35, 1.17);
}

.theme-switch,
.theme-switch *,
.theme-switch *::before,
.theme-switch *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-size: var(--toggle-size);
}

.theme-switch__container {
  width: var(--container-width);
  height: var(--container-height);
  background-color: var(--container-light-bg);
  border-radius: var(--container-radius);
  overflow: hidden;
  cursor: pointer;
  box-shadow: 0em -0.062em 0.062em rgba(0, 0, 0, 0.25), 0em 0.062em 0.125em rgba(255, 255, 255, 0.94);
  transition: var(--transition);
  position: relative;
}

.theme-switch__container::before {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  box-shadow: 0em 0.05em 0.187em rgba(0, 0, 0, 0.25) inset, 0em 0.05em 0.187em rgba(0, 0, 0, 0.25) inset;
  border-radius: var(--container-radius);
}

.theme-switch__checkbox {
  display: none;
}

.theme-switch__circle-container {
  width: var(--circle-container-diameter);
  height: var(--circle-container-diameter);
  background-color: rgba(255, 255, 255, 0.1);
  position: absolute;
  left: var(--circle-container-offset);
  top: var(--circle-container-offset);
  border-radius: var(--container-radius);
  box-shadow: inset 0 0 0 2.2em rgba(255, 255, 255, 0.1),
    inset 0 0 0 2.2em rgba(255, 255, 255, 0.1),
    0 0 0 0.45em rgba(255, 255, 255, 0.1),
    0 0 0 0.9em rgba(255, 255, 255, 0.1);
  display: flex;
  transition: var(--circle-transition);
  pointer-events: none;
}

.theme-switch__sun-moon-container {
  pointer-events: auto;
  position: relative;
  z-index: 2;
  width: var(--sun-moon-diameter);
  height: var(--sun-moon-diameter);
  margin: auto;
  border-radius: var(--container-radius);
  background-color: var(--sun-bg);
  box-shadow: 0.062em 0.062em 0.062em 0em rgba(254, 255, 239, 0.61) inset, 0em -0.062em 0.062em 0em #a1872a inset;
  filter: drop-shadow(0.062em 0.125em 0.125em rgba(0, 0, 0, 0.25)) drop-shadow(0em 0.062em 0.125em rgba(0, 0, 0, 0.25));
  overflow: hidden;
  transition: var(--transition);
}

.theme-switch__moon {
  transform: translateX(100%);
  width: 100%;
  height: 100%;
  background-color: var(--moon-bg);
  border-radius: inherit;
  box-shadow: 0.062em 0.062em 0.062em 0em rgba(254, 255, 239, 0.61) inset, 0em -0.062em 0.062em 0em #969696 inset;
  transition: var(--transition);
  position: relative;
}

.theme-switch__spot {
  position: absolute;
  top: 0.75em;
  left: 0.312em;
  width: 0.75em;
  height: 0.75em;
  border-radius: var(--container-radius);
  background-color: var(--spot-color);
  box-shadow: 0em 0.0312em 0.062em rgba(0, 0, 0, 0.25) inset;
}

.theme-switch__spot:nth-of-type(2) {
  width: 0.375em;
  height: 0.375em;
  top: 0.937em;
  left: 1.375em;
}

.theme-switch__spot:nth-last-of-type(3) {
  width: 0.25em;
  height: 0.25em;
  top: 0.312em;
  left: 0.812em;
}

.theme-switch__clouds {
  width: 0.85em;
  height: 0.85em;
  background-color: var(--clouds-color);
  border-radius: var(--container-radius);
  position: absolute;
  bottom: -0.42em;
  left: 0.18em;
  box-shadow: 0.62em 0.18em var(--clouds-color),
    -0.24em -0.24em var(--back-clouds-color),
    1.02em 0.22em var(--clouds-color),
    0.38em -0.08em var(--back-clouds-color),
    1.55em 0 var(--clouds-color),
    0.92em -0.05em var(--back-clouds-color),
    2.1em 0.2em var(--clouds-color),
    1.45em -0.24em var(--back-clouds-color),
    2.6em -0.05em var(--clouds-color),
    1.86em 0em var(--back-clouds-color),
    3.2em -0.24em var(--clouds-color),
    2.42em -0.36em var(--back-clouds-color),
    3.35em -1.24em 0 0.32em var(--clouds-color),
    2.9em -0.44em var(--back-clouds-color),
    3em -1.5em 0 0.32em var(--back-clouds-color);
  transition: 0.5s cubic-bezier(0, -0.02, 0.4, 1.25);
}

.theme-switch__stars-container {
  position: absolute;
  color: var(--stars-color);
  top: -100%;
  left: 0.2em;
  width: 1.8em;
  height: auto;
  transition: var(--transition);
}

.theme-switch__checkbox:checked + .theme-switch__container {
  background-color: var(--container-night-bg);
}

.theme-switch__checkbox:checked + .theme-switch__container .theme-switch__circle-container {
  left: calc(100% - var(--circle-container-offset) - var(--circle-container-diameter));
}

.theme-switch__checkbox:checked + .theme-switch__container .theme-switch__circle-container:hover {
  left: calc(100% - var(--circle-container-offset) - var(--circle-container-diameter) - 0.187em);
}

.theme-switch__circle-container:hover {
  left: calc(var(--circle-container-offset) + 0.187em);
}

.theme-switch__checkbox:checked + .theme-switch__container .theme-switch__moon {
  transform: translate(0);
}

.theme-switch__checkbox:checked + .theme-switch__container .theme-switch__clouds {
  bottom: -2.6em;
}

.theme-switch__checkbox:checked + .theme-switch__container .theme-switch__stars-container {
  top: 50%;
  transform: translateY(-50%);
}

.marketing-card {
  --bg-color: var(--surface-2);
  background-color: var(--bg-color);
  padding: 1rem 1.5rem;
  border-radius: 1.25rem;
  color: var(--ink);
  border-color: var(--border);
  box-shadow: 0 18px 36px var(--shadow);
}

:root[data-theme="dark"] .marketing-card {
  --bg-color: #151b18;
  box-shadow: 0 22px 44px var(--shadow-strong);
}

.login-loader {
  color: var(--ink-muted);
  font-family: "IBM Plex Sans", sans-serif;
  font-weight: 500;
  font-size: 24px;
  box-sizing: content-box;
  height: 40px;
  padding: 10px 6px;
  display: flex;
  border-radius: 8px;
  align-items: center;
  gap: 0.25rem;
}

.login-words {
  overflow: hidden;
  position: relative;
  height: 40px;
  transform: translateY(5px);
}

.login-words::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(var(--bg-color) 10%, transparent 30%, transparent 70%, var(--bg-color) 90%);
  z-index: 20;
}

.login-word {
  display: block;
  height: 100%;
  padding-left: 6px;
  color: var(--accent);
  animation: spin_4991 4s infinite;
}


@keyframes spin_4991 {
  10% {
    transform: translateY(-102%);
  }

  25% {
    transform: translateY(-100%);
  }

  35% {
    transform: translateY(-202%);
  }

  50% {
    transform: translateY(-200%);
  }

  60% {
    transform: translateY(-302%);
  }

  75% {
    transform: translateY(-300%);
  }

  85% {
    transform: translateY(-402%);
  }

  100% {
    transform: translateY(-400%);
  }
}

.glass-signin-shell {
  position: relative;
  min-height: calc(100vh - 6.5rem);
  display: grid;
  align-content: start;
  justify-items: center;
  grid-gap: 1rem;
  gap: 1rem;
}

.glass-signin-shell::before,
.glass-signin-shell::after {
  content: "";
  position: absolute;
  border-radius: 999px;
  filter: blur(40px);
  pointer-events: none;
  z-index: 0;
}

.glass-signin-shell::before {
  width: min(40vw, 420px);
  height: min(40vw, 420px);
  top: 1rem;
  right: -8rem;
  background: color-mix(in srgb, var(--accent) 24%, transparent);
}

.glass-signin-shell::after {
  width: min(34vw, 360px);
  height: min(34vw, 360px);
  bottom: -2rem;
  left: -7rem;
  background: color-mix(in srgb, var(--accent-2) 18%, transparent);
}

.glass-signin-topbar {
  width: min(100%, 920px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  position: relative;
  z-index: 1;
}

.glass-signin-card {
  width: min(100%, 600px);
  padding: 1.75rem;
  border-radius: 1.5rem;
  border: 1px solid color-mix(in srgb, var(--border) 75%, var(--surface));
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--surface) 92%, transparent), color-mix(in srgb, var(--panel-bg) 88%, transparent));
  -webkit-backdrop-filter: blur(16px);
          backdrop-filter: blur(16px);
  box-shadow:
    0 24px 54px color-mix(in srgb, var(--shadow-strong) 52%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 10%, transparent);
  position: relative;
  z-index: 1;
}

.glass-forgot-card {
  width: min(100%, 600px);
  padding: 1.75rem;
  border-radius: 1.5rem;
  border: 1px solid color-mix(in srgb, var(--border) 75%, var(--surface));
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--surface) 92%, transparent), color-mix(in srgb, var(--panel-bg) 88%, transparent));
  -webkit-backdrop-filter: blur(16px);
          backdrop-filter: blur(16px);
  box-shadow:
    0 24px 54px color-mix(in srgb, var(--shadow-strong) 52%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 10%, transparent);
  position: relative;
  z-index: 1;
}

.glass-signin-head {
  text-align: center;
  display: grid;
  grid-gap: 0.55rem;
  gap: 0.55rem;
  margin-bottom: 1.1rem;
}

.glass-signin-head h1 {
  margin: 0;
  font-size: clamp(1.45rem, 2.8vw, 2rem);
}

.glass-signin-head p {
  margin: 0;
  color: var(--ink-muted);
}

.glass-signin-chip {
  margin: 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--border) 65%, transparent);
  padding: 0.26rem 0.72rem;
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-muted);
}

.glass-signin-social {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-gap: 0.65rem;
  gap: 0.65rem;
  margin-bottom: 1rem;
}

.glass-signin-social-btn {
  border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
  background: color-mix(in srgb, var(--panel-bg) 84%, transparent);
  color: var(--ink);
  border-radius: 999px;
  min-height: 2.55rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  font-weight: 600;
  transition: transform 180ms ease, border-color 180ms ease, background-color 180ms ease;
}

.glass-signin-social-btn:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--accent) 55%, var(--border));
}

.glass-signin-divider {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin: 0.2rem 0 1rem;
  color: var(--ink-muted);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 0.68rem;
}

.glass-signin-divider::before,
.glass-signin-divider::after {
  content: "";
  flex: 1 1 auto;
  height: 1px;
  background: color-mix(in srgb, var(--border) 80%, transparent);
}

.glass-signin-form {
  display: grid;
  grid-gap: 0.85rem;
  gap: 0.85rem;
}

.glass-signin-form label {
  display: grid;
  grid-gap: 0.32rem;
  gap: 0.32rem;
  color: var(--ink);
  font-size: 0.89rem;
}

.glass-signin-form input[type="email"],
.glass-signin-form input[type="password"] {
  min-height: 2.8rem;
  border-radius: 0.9rem;
  border: 1px solid color-mix(in srgb, var(--border) 84%, transparent);
  background: color-mix(in srgb, var(--panel-bg) 75%, transparent);
  color: var(--ink);
  padding: 0.55rem 0.8rem;
}

.glass-signin-form input[type="email"]::placeholder,
.glass-signin-form input[type="password"]::placeholder {
  color: color-mix(in srgb, var(--ink-muted) 80%, transparent);
}

.glass-signin-subline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-top: 0.25rem;
}

.glass-signin-remember {
  display: inline-flex;
  align-items: flex-start;
  gap: 0.62rem;
  font-size: 0.82rem;
  color: var(--ink);
  cursor: pointer;
}

.glass-signin-remember input[type="checkbox"] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  width: 1.05rem;
  height: 1.05rem;
  margin: 0.1rem 0 0;
  border-radius: 0.3rem;
  border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
  background: color-mix(in srgb, var(--panel-bg) 88%, transparent);
  position: relative;
  transition: border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

.glass-signin-remember input[type="checkbox"]:checked {
  border-color: color-mix(in srgb, var(--accent) 70%, var(--border));
  background: color-mix(in srgb, var(--accent) 86%, var(--panel-bg));
}

.glass-signin-remember input[type="checkbox"]:checked::after {
  content: "";
  position: absolute;
  inset: 0;
  width: 0.32rem;
  height: 0.56rem;
  margin: auto;
  border: solid color-mix(in srgb, var(--panel-bg) 96%, white);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg) translate(-1px, -1px);
}

.glass-signin-remember input[type="checkbox"]:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent);
}

.glass-signin-remember-copy {
  display: grid;
  grid-gap: 0.06rem;
  gap: 0.06rem;
}

.glass-signin-remember-copy strong {
  font-size: 0.83rem;
  font-weight: 600;
  line-height: 1.25;
}

.glass-signin-remember-copy small {
  font-size: 0.73rem;
  line-height: 1.35;
  color: var(--ink-muted);
}

.glass-signin-forgot {
  border: none;
  background: transparent;
  color: var(--accent);
  text-decoration: underline;
  -webkit-text-decoration-color: color-mix(in srgb, var(--accent) 55%, transparent);
          text-decoration-color: color-mix(in srgb, var(--accent) 55%, transparent);
  text-underline-offset: 0.18rem;
  font-size: 0.78rem;
  font-weight: 600;
  padding: 0;
}

.glass-signin-submit {
  margin-top: 0.2rem;
  width: 100%;
}

.glass-signin-alt-actions {
  margin-top: 0.45rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0.45rem 0.7rem;
}

.glass-signin-alt-copy {
  color: var(--ink-muted);
  font-size: 0.8rem;
}

.glass-signin-alt-link {
  min-height: auto;
  padding: 0.28rem 0.1rem;
  border: none;
  border-bottom: 1px solid transparent;
  border-radius: 0;
  background: transparent;
  color: var(--accent);
  font-size: 0.84rem;
  font-weight: 600;
  text-decoration: none;
  box-shadow: none;
}

.glass-signin-alt-link:hover {
  transform: none;
  border-color: color-mix(in srgb, var(--accent) 45%, transparent);
  background: transparent;
  box-shadow: none;
}

.glass-signin-alt-link:focus-visible {
  outline: 2px solid var(--border-focus);
  outline-offset: 3px;
  border-radius: 6px;
}

.glass-signin-legal {
  margin: 0.85rem 0 0;
  color: var(--ink-muted);
  text-align: center;
  font-size: 0.76rem;
  line-height: 1.45;
}

.glass-forgot-footer {
  margin-top: 0.85rem;
  display: flex;
  justify-content: center;
}

@media (max-width: 740px) {
  .glass-signin-shell {
    min-height: auto;
  }

  .glass-forgot-card,
  .glass-signin-card {
    padding: 1.1rem;
    border-radius: 1.15rem;
  }

  .glass-signin-social {
    grid-template-columns: 1fr;
  }

  .glass-signin-social-btn {
    justify-content: flex-start;
    padding: 0 0.85rem;
  }

  .glass-signin-subline {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* =========================
   PRIVATE ACCOUNT MENU
   ========================= */
.private-layout {
  position: relative;
}


/* Sticky/morph base lives in .shell-header (components.css).
   Keep only the private-layout composition overrides here. */
.private-account-anchor {
  min-height: 52px;
}

.private-account-controls {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  margin-left: auto;
}

.private-content {
  padding-top: 0;
}

/* Reduced-motion handling is centralized in .shell-header (components.css). */

.private-theme-toggle {
  border-radius: 14px;
  border: 1px solid var(--border-default);
  background: color-mix(in srgb, var(--panel-bg) 90%, var(--surface));
  padding: 0.32rem 0.44rem;
  box-shadow: var(--shadow-elevation);
}

.private-locale-toggle {
  border-radius: 14px;
  border: 1px solid var(--border-default);
  background: color-mix(in srgb, var(--panel-bg) 90%, var(--surface));
  padding: 0.32rem 0.44rem;
  box-shadow: var(--shadow-elevation);
}

.language-toggle {
  border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--border-default));
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface) 82%, transparent);
  color: var(--text-primary);
  min-width: 3rem;
  height: 2rem;
  padding: 0 0.65rem;
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  cursor: pointer;
  transition: transform 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease;
}

.language-toggle:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--accent) 50%, var(--border-default));
  box-shadow: 0 12px 24px var(--shadow-soft);
}

.language-toggle:focus-visible {
  outline: 3px solid var(--border-focus);
  outline-offset: 2px;
}

.language-toggle__label {
  line-height: 1;
}

.account-menu {
  position: relative;
  min-width: 250px;
}

.account-trigger {
  width: 100%;
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  border-radius: 16px;
  border: 1px solid var(--border-default);
  background: color-mix(in srgb, var(--panel-bg) 86%, var(--surface));
  color: var(--text-primary);
  padding: 0.45rem 0.65rem;
  cursor: pointer;
  box-shadow: var(--shadow-elevation);
  transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}

.account-trigger:hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 34px var(--shadow-strong);
}

.account-trigger:focus-visible {
  outline: 3px solid var(--border-focus);
  outline-offset: 2px;
}

.account-avatar {
  width: 36px;
  height: 36px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  font-weight: 700;
  font-size: 0.8rem;
  background: linear-gradient(135deg, var(--accent), var(--accent-2));
  color: var(--accent-ink);
}

.account-meta {
  display: grid;
  text-align: left;
  min-width: 0;
}

.account-meta strong {
  font-size: 0.82rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.account-meta small {
  color: var(--text-secondary);
  font-size: 0.74rem;
}

.account-caret {
  margin-left: auto;
  color: var(--text-secondary);
}

.account-dropdown {
  position: absolute;
  right: 0;
  top: calc(100% + 0.45rem);
  width: 100%;
  background: var(--color-dropdown-bg);
  border: 1px solid var(--color-dropdown-border);
  border-radius: 16px;
  box-shadow: 0 20px 40px var(--shadow-strong);
  padding: 0.45rem;
  display: grid;
  grid-gap: 0.24rem;
  gap: 0.24rem;
  animation: menuIn 0.16s ease;
}

.account-status-panel {
  padding: 0.9rem 1rem;
  border-radius: 14px;
  background:
    linear-gradient(145deg, rgba(217, 93, 57, 0.18), rgba(255, 198, 111, 0.1)),
    var(--surface);
  border: 1px solid rgba(217, 93, 57, 0.3);
  display: grid;
  grid-gap: 0.4rem;
  gap: 0.4rem;
}

.account-status-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.5rem;
}

.account-status-panel p {
  margin: 0;
  font-size: 0.78rem;
  color: var(--ink-muted);
}

.account-group-grid {
  display: grid;
  grid-gap: 0.6rem;
  gap: 0.6rem;
}

.account-group-card {
  padding: 0.8rem 0.9rem;
  border-radius: 12px;
  border: 1px solid var(--color-border-strong);
  background: var(--color-card);
  display: grid;
  grid-gap: 0.65rem;
  gap: 0.65rem;
  box-shadow: 0 12px 28px rgba(31, 29, 26, 0.12);
}

.account-group-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0.5rem;
}

.account-group-card-header span {
  font-weight: 600;
  letter-spacing: 0.06em;
  font-size: 0.78rem;
}

.account-group-card-header small {
  font-size: 0.7rem;
  line-height: 1.2;
  color: var(--ink-muted);
  display: block;
}

.account-group-items {
  display: grid;
  grid-gap: 0.35rem;
  gap: 0.35rem;
}

.account-link {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.45rem 0.4rem;
  border-radius: 10px;
  border: 1px solid transparent;
  text-decoration: none;
  color: var(--text-primary);
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.account-link:hover,
.account-link:focus-visible {
  border-color: color-mix(in srgb, var(--color-accent) 42%, transparent);
  background: color-mix(in srgb, var(--color-accent) 12%, var(--color-card));
  transform: translateX(2px);
}

.account-link-icon {
  width: 1.5rem;
  height: 1.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.6rem;
  background: rgba(217, 93, 57, 0.12);
  color: var(--accent);
}

.account-link-admin {
  border-color: rgba(255, 198, 111, 0.6);
  background: rgba(255, 198, 111, 0.12);
}

.account-group {
  display: grid;
  grid-gap: 0.24rem;
  gap: 0.24rem;
  padding: 0.2rem;
  border-radius: 12px;
}

.account-group + .account-group {
  border-top: 1px dashed var(--border-default);
  padding-top: 0.45rem;
  margin-top: 0.2rem;
}

.account-group-label {
  padding: 0.2rem 0.45rem;
  font-size: 0.62rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--text-secondary);
}

.account-divider {
  height: 1px;
  background: var(--border-default);
  margin: 0.35rem 0.35rem;
}

.panel-list {
  display: grid;
  grid-gap: 0.6rem;
  gap: 0.6rem;
}

.panel-list-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.8rem;
  flex-wrap: wrap;
  padding: 0.6rem 0.7rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--surface);
}

.account-dropdown a,
.account-dropdown button {
  width: 100%;
  text-align: left;
  border: 1px solid transparent;
  background: transparent;
  color: var(--text-primary);
  border-radius: 10px;
  padding: 0.56rem 0.62rem;
  font: inherit;
  cursor: pointer;
  transition: background 0.16s ease, border-color 0.16s ease, transform 0.16s ease;
}

.account-dropdown a:hover,
.account-dropdown button:hover {
  background: var(--color-dropdown-hover);
  border-color: var(--color-dropdown-border);
  transform: translateX(1px);
}

.account-dropdown a:focus-visible,
.account-dropdown button:focus-visible {
  outline: 3px solid var(--border-focus);
  outline-offset: 2px;
}

.account-logout {
  margin-top: 0.22rem;
  background: linear-gradient(135deg, color-mix(in srgb, var(--color-accent-pressed) 70%, var(--color-surface) 30%), color-mix(in srgb, var(--color-accent-pressed) 86%, var(--color-surface) 14%)) !important;
  color: var(--color-button-primary-text) !important;
  border: 1px solid color-mix(in srgb, var(--color-accent) 46%, transparent) !important;
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  justify-content: space-between;
  padding: 0.6rem 0.9rem;
  box-shadow: var(--btn-shadow-strong) !important;
}

.account-dropdown .account-logout:hover {
  transform: scale(1.01);
}

.account-dropdown .account-logout:active {
  transform: scale(0.98);
}

.account-dropdown .account-logout:focus-visible {
  outline: 3px solid var(--border-focus);
  outline-offset: 2px;
}

:root[data-theme="dark"] .account-logout {
  color: var(--color-button-primary-text) !important;
}

@keyframes menuIn {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* =========================
   DASHBOARD PREMIUM
   ========================= */
.dashboard-shell {
  max-width: var(--ui-dashboard-max-width);
}

.dashboard-top-stage {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(260px, 0.72fr);
  grid-gap: 1.25rem;
  gap: 1.25rem;
  align-items: start;
}

.dashboard-top-main {
  display: grid;
  grid-gap: var(--dashboard-section-gap);
  gap: var(--dashboard-section-gap);
  min-width: 0;
}

.dashboard-hero-state {
  position: relative;
  display: grid;
  grid-template-columns: 1.6fr 0.4fr;
  grid-gap: 1.25rem;
  gap: 1.25rem;
  padding: var(--ui-hero-density-padding);
  border-radius: var(--radius-xl);
  background:
    linear-gradient(140deg, rgba(255, 244, 229, 0.92), rgba(255, 252, 245, 0.65)),
    var(--panel-bg);
  border: 1px solid var(--border);
  box-shadow: 0 34px 70px var(--shadow-strong);
  overflow: hidden;
}

:root[data-theme="dark"] .dashboard-hero-state {
  background:
    linear-gradient(140deg, rgba(24, 30, 27, 0.95), rgba(20, 24, 22, 0.7)),
    var(--panel-bg);
}

.dashboard-hero-state::after {
  content: "";
  position: absolute;
  inset: auto -20% -30% auto;
  width: 420px;
  height: 320px;
  background: radial-gradient(circle, rgba(217, 93, 57, 0.2), transparent 70%);
  filter: blur(8px);
}

.dashboard-hero-content {
  display: grid;
  grid-gap: var(--dashboard-block-gap);
  gap: var(--dashboard-block-gap);
  z-index: 1;
}

.dashboard-hero-title h2 {
  margin: 0;
  font-size: 1.78rem;
}

.dashboard-hero-status {
  margin: 0.42rem 0 0;
  color: var(--dashboard-muted-tone);
  font-size: var(--dashboard-muted-size);
  line-height: 1.45;
}

.dashboard-hero-highlight {
  display: grid;
  grid-gap: 0.8rem;
  gap: 0.8rem;
}

.hero-opportunity,
.hero-empty {
  border-radius: 16px;
  border: 1px solid var(--border);
  background: var(--surface);
  padding: 1rem 1.1rem;
  display: grid;
  grid-gap: 0.6rem;
  gap: 0.6rem;
}

.hero-opportunity strong,
.hero-empty strong {
  font-size: 1rem;
}

.hero-opportunity p,
.hero-empty p {
  margin: 0;
  color: var(--ink-muted);
  font-size: 0.9rem;
}

.hero-opportunity-metrics {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  align-items: center;
}

.hero-label {
  display: block;
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ink-muted);
  margin-bottom: 0.2rem;
}

.dashboard-hero-actions {
  display: flex;
  gap: 0.6rem;
  flex-wrap: wrap;
}

.dashboard-hero-side {
  display: grid;
  grid-gap: 0.9rem;
  gap: 0.9rem;
  align-content: flex-start;
  justify-items: end;
  z-index: 1;
}

.dashboard-news-rail {
  position: -webkit-sticky;
  position: sticky;
  top: 1.4rem;
}

.dashboard-news-card {
  position: relative;
  overflow: hidden;
  border-radius: 30px;
  border: 1px solid color-mix(in srgb, var(--color-border) 74%, white 26%);
  background:
    linear-gradient(180deg, rgba(255, 250, 244, 0.74), rgba(241, 234, 224, 0.46)),
    linear-gradient(135deg, rgba(255, 255, 255, 0.52), rgba(255, 255, 255, 0.08));
  box-shadow: 0 26px 58px rgba(76, 60, 42, 0.16);
  -webkit-backdrop-filter: blur(22px);
          backdrop-filter: blur(22px);
}

.dashboard-news-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.24), transparent 34%),
    radial-gradient(circle at top right, rgba(217, 93, 57, 0.2), transparent 30%);
  pointer-events: none;
}

.dashboard-news-media-wrap {
  position: relative;
  padding: 0.9rem;
}

.dashboard-news-media {
  min-height: 250px;
  border-radius: 24px;
  background-size: cover;
  background-position: center;
  transform: scale(1);
  transition: transform 0.5s ease;
  box-shadow: inset 0 -40px 120px rgba(9, 11, 14, 0.16);
}

.dashboard-news-card:hover .dashboard-news-media,
.dashboard-news-card:focus-within .dashboard-news-media {
  transform: scale(1.04);
}

.dashboard-news-chip {
  position: absolute;
  top: 1.6rem;
  left: 1.6rem;
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  padding: 0.38rem 0.8rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--color-chip-bg) 88%, transparent);
  border: 1px solid var(--color-chip-border);
  -webkit-backdrop-filter: blur(12px);
          backdrop-filter: blur(12px);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-chip-text);
}

.dashboard-news-body {
  display: grid;
  grid-gap: 1.15rem;
  gap: 1.15rem;
  padding: 0 1.15rem 1.2rem;
  position: relative;
  z-index: 1;
}

.dashboard-news-copy {
  display: grid;
  grid-gap: 0.72rem;
  gap: 0.72rem;
}

.dashboard-news-kicker {
  margin: 0;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-text-secondary);
}

.dashboard-news-copy h3 {
  margin: 0;
  font-family: "Playfair Display", serif;
  font-size: clamp(1.48rem, 2.1vw, 2rem);
  line-height: 1.06;
  letter-spacing: -0.03em;
  max-width: 13ch;
}

.dashboard-news-excerpt {
  margin: 0;
  color: var(--color-text-secondary);
  line-height: 1.72;
  font-size: 0.94rem;
}

.dashboard-news-meta {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-gap: 0.75rem;
  gap: 0.75rem;
  align-items: center;
  padding-top: 0.2rem;
  border-top: 1px solid rgba(140, 123, 105, 0.16);
}

.dashboard-news-author-mark {
  width: 2.75rem;
  height: 2.75rem;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: linear-gradient(145deg, rgba(46, 110, 98, 0.2), rgba(217, 93, 57, 0.16));
  border: 1px solid rgba(255, 255, 255, 0.48);
  font-size: 0.82rem;
  font-weight: 700;
  color: #2b362f;
}

.dashboard-news-meta strong {
  display: block;
  font-size: 0.92rem;
}

.dashboard-news-meta p {
  margin: 0.18rem 0 0;
  color: var(--color-text-secondary);
  font-size: 0.8rem;
  line-height: 1.45;
}

.dashboard-news-link {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  min-height: 3rem;
  padding: 0.8rem 0.95rem;
  border-radius: 18px;
  background: color-mix(in srgb, var(--color-chip-bg) 84%, transparent);
  border: 1px solid var(--color-chip-border);
  color: var(--color-text-primary);
  text-decoration: none;
  font-weight: 600;
  transition: transform 0.2s ease, border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

.dashboard-news-link:hover,
.dashboard-news-link:focus-visible {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--color-accent) 40%, var(--color-border));
  background: color-mix(in srgb, var(--color-chip-bg) 94%, white 6%);
  box-shadow: 0 14px 28px rgba(84, 63, 40, 0.12);
}

.dashboard-news-link:focus-visible {
  outline: none;
}

/* Dashboard dispatch/news card: dark-native editorial treatment (avoid light leakage). */
:root[data-theme="dark"] .dashboard-news-card {
  border-color: color-mix(in srgb, var(--color-border) 82%, var(--color-border-strong) 18%);
  background:
    radial-gradient(circle at top right, rgba(224, 123, 86, 0.12), transparent 30%),
    radial-gradient(circle at left center, rgba(111, 178, 161, 0.1), transparent 32%),
    linear-gradient(180deg, color-mix(in srgb, var(--color-surface-elevated) 88%, var(--color-surface) 12%), color-mix(in srgb, var(--color-surface) 92%, var(--color-surface-muted) 8%));
  box-shadow: 0 26px 58px rgba(0, 0, 0, 0.48);
  -webkit-backdrop-filter: blur(18px);
          backdrop-filter: blur(18px);
}

:root[data-theme="dark"] .dashboard-news-card::before {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.06), transparent 34%),
    radial-gradient(circle at top right, rgba(224, 123, 86, 0.22), transparent 30%);
}

:root[data-theme="dark"] .dashboard-news-meta {
  border-top-color: color-mix(in srgb, var(--color-border) 82%, transparent);
}

:root[data-theme="dark"] .dashboard-news-author-mark {
  background: linear-gradient(145deg, rgba(111, 178, 161, 0.2), rgba(224, 123, 86, 0.16));
  border-color: color-mix(in srgb, var(--color-border-strong) 62%, rgba(255, 255, 255, 0.16));
  color: var(--color-text-primary);
}

:root[data-theme="dark"] .dashboard-news-link:hover,
:root[data-theme="dark"] .dashboard-news-link:focus-visible {
  background: color-mix(in srgb, var(--color-chip-bg) 94%, var(--color-surface) 6%);
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.36);
}

.hero-user-card {
  display: flex;
  gap: 0.6rem;
  align-items: center;
  padding: 0.7rem 0.9rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--surface);
  box-shadow: 0 14px 26px var(--shadow);
  min-width: 180px;
}

.hero-user-name {
  font-weight: 600;
  font-size: 0.95rem;
}

.hero-user-note {
  font-size: 0.8rem;
  color: var(--ink-muted);
}

.dashboard-section {
  margin-top: var(--dashboard-section-gap);
  display: grid;
  grid-gap: var(--dashboard-block-gap);
  gap: var(--dashboard-block-gap);
}

.dashboard-section-manage {
  margin-top: 0;
}

.dashboard-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding-bottom: 0.2rem;
}

.dashboard-section-head h3 {
  margin: 0;
  font-size: 1.16rem;
  line-height: 1.28;
}

.dashboard-section-head p {
  margin: 0.28rem 0 0;
  color: var(--dashboard-muted-tone);
  font-size: var(--dashboard-muted-size);
  line-height: 1.45;
  max-width: 54ch;
}

.dashboard-section-head-row {
  align-items: center;
}

.dashboard-primary-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-gap: 1.15rem;
  gap: 1.15rem;
}

.dashboard-primary-grid .module-card {
  grid-column: span 6;
  box-shadow: 0 16px 30px var(--shadow);
  gap: 1rem;
}

.module-card-opportunity {
  grid-column: span 12;
}

.link-subtle {
  font-size: 0.84rem;
  color: var(--dashboard-muted-tone);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  padding-bottom: 0.1rem;
  background: none;
  border: none;
  cursor: pointer;
  font-family: inherit;
}

.link-subtle:hover {
  color: var(--ink);
  border-color: rgba(217, 93, 57, 0.4);
}

.link-subtle:focus-visible {
  outline: 2px solid var(--border-focus);
  outline-offset: 2px;
  border-radius: 4px;
}

.dashboard-secondary {
  padding: 1.22rem 1.36rem;
  border-radius: var(--radius-lg);
  border: 1px solid var(--border);
  background: var(--surface);
  box-shadow: 0 12px 26px var(--shadow);
}

.activity-timeline {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-gap: 0.72rem;
  gap: 0.72rem;
}

.activity-timeline-item {
  display: grid;
  grid-template-columns: 16px 1fr;
  grid-gap: 0.6rem;
  gap: 0.6rem;
  align-items: start;
}

.activity-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--accent-2);
  margin-top: 0.35rem;
}

.activity-timeline-item p {
  margin: 0;
  font-size: 0.88rem;
  color: var(--ink);
}

.activity-timeline-item span {
  font-size: 0.78rem;
  color: var(--ink-muted);
}

.dashboard-hero {
  position: relative;
  display: grid;
  grid-template-columns: 1.4fr 0.6fr;
  grid-gap: 1.5rem;
  gap: 1.5rem;
  padding: 2.2rem;
  border-radius: var(--radius-xl);
  background:
    linear-gradient(140deg, rgba(255, 244, 229, 0.9), rgba(255, 252, 245, 0.6)),
    var(--panel-bg);
  border: 1px solid var(--border);
  box-shadow: 0 30px 60px var(--shadow-strong);
  overflow: hidden;
}

:root[data-theme="dark"] .dashboard-hero {
  background:
    linear-gradient(140deg, rgba(24, 30, 27, 0.95), rgba(20, 24, 22, 0.7)),
    var(--panel-bg);
}

.dashboard-hero::after {
  content: "";
  position: absolute;
  inset: auto -20% -35% auto;
  width: 420px;
  height: 320px;
  background: radial-gradient(circle, rgba(217, 93, 57, 0.18), transparent 70%);
  filter: blur(8px);
}

.dashboard-title {
  display: grid;
  grid-gap: 0.6rem;
  gap: 0.6rem;
  z-index: 1;
}

.dashboard-title h1 {
  margin: 0;
}

.dashboard-subtitle {
  margin: 0;
  color: var(--ink-muted);
  max-width: 30rem;
  line-height: 1.5;
}

.dashboard-hint {
  margin: 0;
  font-size: 0.9rem;
  color: var(--ink);
}

.dashboard-meta {
  display: grid;
  grid-gap: 0.8rem;
  gap: 0.8rem;
  z-index: 1;
  align-content: flex-start;
  justify-items: end;
}

.lang-pill {
  padding: 0.35rem 0.9rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--surface-2);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.hero-actions {
  display: flex;
  gap: 0.6rem;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.kpi-grid {
  margin-top: 1.5rem;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-gap: 1rem;
  gap: 1rem;
}

.kpi-card {
  grid-column: span 4;
  padding: 1.2rem 1.35rem;
  border-radius: 18px;
  background: var(--surface);
  border: 1px solid var(--border);
  box-shadow: 0 20px 36px var(--shadow);
  display: grid;
  grid-gap: 0.4rem;
  gap: 0.4rem;
}

.kpi-card small {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.7rem;
  color: var(--ink-muted);
}

.kpi-value {
  font-size: 1.6rem;
  font-weight: 700;
}

.kpi-user {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  min-width: 0;
}

.kpi-user-avatar {
  width: 40px;
  height: 40px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  font-weight: 700;
  font-size: 0.8rem;
  background: color-mix(in srgb, var(--accent) 75%, var(--accent-2));
  color: var(--accent-ink);
  flex: 0 0 auto;
}

.kpi-user .kpi-value {
  font-size: 1.08rem;
  overflow-wrap: anywhere;
}

.kpi-state {
  display: flex;
  align-items: center;
}

.kpi-note {
  font-size: 0.85rem;
  color: var(--ink-muted);
}

.status-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.32rem;
  padding: 0.3rem 0.65rem;
  border-radius: 999px;
  border: 1px solid var(--border-default);
  font-size: 0.82rem;
  font-weight: 700;
}

.status-ok {
  color: #256b56;
  border-color: rgba(37, 107, 86, 0.34);
  background: rgba(37, 107, 86, 0.12);
}

.status-degraded {
  color: #8d5a1c;
  border-color: rgba(167, 120, 52, 0.36);
  background: rgba(167, 120, 52, 0.12);
}

/* =========================
   SUPPORT CONTACT PAGE
   ========================= */
.support-contact-page {
  display: grid;
  grid-gap: 1.25rem;
  gap: 1.25rem;
}

.support-contact-hero {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at top left, rgba(217, 93, 57, 0.16), transparent 26%),
    radial-gradient(circle at top right, rgba(46, 110, 98, 0.14), transparent 28%),
    linear-gradient(145deg, rgba(255, 250, 244, 0.96), rgba(255, 244, 232, 0.9)),
    var(--panel-bg);
  animation: supportContactFadeIn 520ms ease both;
}

.support-contact-hero::after {
  content: "";
  position: absolute;
  right: -48px;
  top: -64px;
  width: 180px;
  height: 180px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.28), transparent 70%);
  pointer-events: none;
}

.support-contact-hero-copy {
  position: relative;
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
  z-index: 1;
}

.support-contact-orb {
  position: absolute;
  border-radius: 999px;
  filter: blur(22px);
  opacity: 0.72;
  pointer-events: none;
}

.support-contact-orb-primary {
  top: -56px;
  left: -24px;
  width: 200px;
  height: 200px;
  background: rgba(217, 93, 57, 0.16);
}

.support-contact-orb-secondary {
  right: 2%;
  bottom: -84px;
  width: 220px;
  height: 220px;
  background: rgba(46, 110, 98, 0.16);
}

.support-contact-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0.32rem 0.7rem;
  border-radius: 999px;
  border: 1px solid rgba(217, 93, 57, 0.24);
  background: rgba(255, 250, 244, 0.74);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-muted);
}

.support-contact-hero-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
}

.support-contact-hero-header h2 {
  margin: 0;
  max-width: 18ch;
  font-size: clamp(1.7rem, 4vw, 2.7rem);
  line-height: 1.04;
}

.support-contact-hero-header p {
  margin: 0.75rem 0 0;
  max-width: 46rem;
  color: var(--ink-muted);
  font-size: 1rem;
  line-height: 1.7;
}

.support-contact-points {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-gap: 0.85rem;
  gap: 0.85rem;
}

.support-contact-signal-strip {
  display: grid;
  grid-template-columns: 1.35fr 1fr 0.85fr;
  grid-gap: 0.6rem;
  gap: 0.6rem;
}

.support-contact-signal-strip span {
  height: 10px;
  border-radius: 999px;
  background:
    linear-gradient(90deg, rgba(217, 93, 57, 0.88), rgba(46, 110, 98, 0.58)),
    rgba(255, 255, 255, 0.6);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45);
}

.support-contact-point {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-gap: 0.7rem;
  gap: 0.7rem;
  align-items: flex-start;
  padding: 0.95rem 1rem;
  border-radius: 18px;
  border: 1px solid rgba(217, 205, 187, 0.72);
  background: rgba(255, 250, 244, 0.78);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.58);
  animation: supportContactRise 520ms ease both;
}

.support-contact-point p {
  margin: 0;
  color: var(--ink-muted);
  line-height: 1.55;
}

.support-contact-point-icon,
.support-contact-aside-icon {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(217, 93, 57, 0.12);
  color: var(--accent);
  border: 1px solid rgba(217, 93, 57, 0.18);
  box-shadow: 0 10px 22px rgba(217, 93, 57, 0.1);
  flex: 0 0 auto;
}

.support-contact-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
  grid-gap: 1rem;
  gap: 1rem;
  align-items: start;
}

.support-contact-form-panel,
.support-contact-aside {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
}

.support-contact-form-panel {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(150deg, rgba(255, 255, 255, 0.44), rgba(255, 247, 238, 0.18)),
    var(--panel-bg);
}

.support-contact-form-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(135deg, rgba(217, 93, 57, 0.08), transparent 28%),
    radial-gradient(circle at top right, rgba(46, 110, 98, 0.1), transparent 32%);
  pointer-events: none;
}

.support-contact-form-header {
  align-items: start;
  position: relative;
  z-index: 1;
}

.support-contact-form textarea {
  min-height: 220px;
}

.support-contact-form input::placeholder,
.support-contact-form textarea::placeholder {
  color: var(--placeholder);
}

.support-contact-actions {
  justify-content: space-between;
  align-items: flex-start;
  position: relative;
  z-index: 1;
}

.support-contact-actions .panel-note {
  max-width: 26rem;
  line-height: 1.5;
}

.support-contact-aside-copy {
  display: grid;
  grid-gap: 0.2rem;
  gap: 0.2rem;
}

.support-contact-aside-cards {
  display: grid;
  grid-gap: 0.8rem;
  gap: 0.8rem;
}

.support-contact-aside-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-gap: 0.85rem;
  gap: 0.85rem;
  padding: 1rem;
  align-items: start;
}

.support-contact-aside-card h3 {
  margin: 0 0 0.28rem;
  font-size: 1rem;
}

.support-contact-aside-card p {
  margin: 0;
  color: var(--ink-muted);
  line-height: 1.55;
}

.support-contact-form {
  position: relative;
  z-index: 1;
}

.support-contact-form-kicker {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-bottom: 0.4rem;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-muted);
}

.support-contact-form-kicker::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--accent), var(--accent-2));
  box-shadow: 0 0 0 4px rgba(217, 93, 57, 0.12);
}

.support-contact-account-row {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: space-between;
  gap: 0.9rem;
  align-items: center;
  flex-wrap: wrap;
}

.support-contact-account-chip {
  display: grid;
  grid-gap: 0.18rem;
  gap: 0.18rem;
  padding: 0.78rem 0.9rem;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--border) 70%, white 30%);
  background: rgba(255, 255, 255, 0.5);
  box-shadow: 0 14px 28px rgba(32, 28, 21, 0.06);
}

.support-contact-account-chip span {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-muted);
}

.support-contact-account-chip strong {
  font-size: 0.95rem;
  overflow-wrap: anywhere;
}

.support-contact-response-note {
  margin: 0;
  max-width: 32rem;
  color: var(--ink-muted);
  line-height: 1.55;
}

.support-contact-field {
  display: grid;
  grid-gap: 0.35rem;
  gap: 0.35rem;
}

.support-contact-label-row {
  display: flex;
  justify-content: space-between;
  gap: 0.8rem;
  align-items: center;
  flex-wrap: wrap;
}

.support-contact-counter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 0.2rem 0.6rem;
  border-radius: 999px;
  border: 1px solid rgba(217, 205, 187, 0.8);
  background: rgba(255, 255, 255, 0.56);
  font-size: 0.74rem;
  font-weight: 700;
  color: var(--ink-muted);
}

.support-contact-counter-short {
  border-color: rgba(167, 120, 52, 0.34);
  background: rgba(167, 120, 52, 0.1);
  color: #8d5a1c;
}

.support-contact-counter-ready {
  border-color: rgba(46, 110, 98, 0.32);
  background: rgba(46, 110, 98, 0.1);
  color: #256b56;
}

.support-contact-counter-rich {
  border-color: rgba(217, 93, 57, 0.34);
  background: rgba(217, 93, 57, 0.1);
  color: #a6452a;
}

.support-contact-field textarea,
.support-contact-field input {
  width: 100%;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--border-default) 84%, white 16%);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(255, 250, 244, 0.78)),
    var(--input-bg);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.78),
    0 14px 26px rgba(32, 28, 21, 0.06);
  transition:
    border-color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s ease;
}

.support-contact-field textarea:focus-visible,
.support-contact-field input:focus-visible {
  outline: none;
  border-color: var(--border-focus);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.82),
    0 0 0 4px rgba(217, 93, 57, 0.12),
    0 18px 32px rgba(32, 28, 21, 0.09);
  transform: translateY(-1px);
}

.support-contact-field.is-invalid textarea,
.support-contact-field.is-invalid input {
  border-color: rgba(178, 74, 48, 0.44);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.78),
    0 0 0 4px rgba(178, 74, 48, 0.08);
}

.support-contact-field-hint,
.support-contact-field-error {
  line-height: 1.45;
}

.support-contact-checklist {
  display: grid;
  grid-gap: 0.8rem;
  gap: 0.8rem;
  padding: 1rem;
  border-radius: 20px;
  background:
    linear-gradient(160deg, rgba(255, 255, 255, 0.58), rgba(255, 246, 236, 0.2)),
    var(--surface);
}

.support-contact-checklist-items {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}

.support-contact-checklist-item {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.42rem 0.7rem;
  border-radius: 999px;
  border: 1px solid rgba(217, 205, 187, 0.84);
  background: rgba(255, 255, 255, 0.62);
  font-size: 0.8rem;
  font-weight: 600;
}

.support-contact-checklist-item i {
  color: var(--accent);
}

.support-contact-action-rail {
  display: flex;
  justify-content: flex-start;
}

.support-contact-secondary {
  box-shadow: 0 10px 20px rgba(32, 28, 21, 0.08);
}

@keyframes supportContactFadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes supportContactRise {
  from {
    opacity: 0;
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 900px) {
  .support-contact-hero-header,
  .support-contact-actions,
  .support-contact-account-row {
    flex-direction: column;
    align-items: flex-start;
  }

  .support-contact-points,
  .support-contact-layout {
    grid-template-columns: 1fr;
  }

  .support-contact-label-row {
    align-items: flex-start;
  }
}

@media (max-width: 640px) {
  .support-contact-page {
    gap: 1rem;
  }

  .support-contact-point,
  .support-contact-aside-card {
    border-radius: 16px;
  }

  .support-contact-form textarea {
    min-height: 180px;
  }

  .support-contact-signal-strip {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .support-contact-hero,
  .support-contact-point,
  .support-contact-field textarea,
  .support-contact-field input {
    animation: none !important;
    transition: none !important;
  }
}

/* Dark-mode hardening: /soporte/contacto should not leak light surfaces. */
:root[data-theme="dark"] .support-contact-hero {
  border-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
  background:
    radial-gradient(circle at top left, rgba(224, 123, 86, 0.14), transparent 26%),
    radial-gradient(circle at top right, rgba(111, 178, 161, 0.12), transparent 28%),
    linear-gradient(152deg, color-mix(in srgb, var(--color-surface) 90%, var(--color-surface-elevated) 10%), color-mix(in srgb, var(--color-surface-elevated) 86%, var(--color-surface-muted) 14%));
}

:root[data-theme="dark"] .support-contact-hero::after {
  background: radial-gradient(circle, rgba(255, 255, 255, 0.08), transparent 72%);
}

:root[data-theme="dark"] .support-contact-eyebrow {
  border-color: color-mix(in srgb, var(--color-accent) 34%, var(--color-border));
  background: color-mix(in srgb, var(--color-surface-elevated) 84%, var(--color-surface) 16%);
  color: var(--color-text-secondary);
}

:root[data-theme="dark"] .support-contact-hero-header h2,
:root[data-theme="dark"] .support-contact-form-header h2,
:root[data-theme="dark"] .support-contact-aside-card h3 {
  color: var(--color-text-primary);
}

:root[data-theme="dark"] .support-contact-hero-header p,
:root[data-theme="dark"] .support-contact-point p,
:root[data-theme="dark"] .support-contact-response-note,
:root[data-theme="dark"] .support-contact-aside-card p,
:root[data-theme="dark"] .support-contact-field-hint,
:root[data-theme="dark"] .support-contact-form-kicker,
:root[data-theme="dark"] .support-contact-account-chip span {
  color: var(--color-text-secondary);
}

:root[data-theme="dark"] .support-contact-point,
:root[data-theme="dark"] .support-contact-form-panel,
:root[data-theme="dark"] .support-contact-aside,
:root[data-theme="dark"] .support-contact-aside-card,
:root[data-theme="dark"] .support-contact-checklist {
  border-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
  background:
    radial-gradient(circle at top right, rgba(224, 123, 86, 0.08), transparent 30%),
    linear-gradient(165deg, color-mix(in srgb, var(--color-surface-elevated) 88%, var(--color-surface) 12%), color-mix(in srgb, var(--color-surface) 90%, var(--color-surface-muted) 10%));
  box-shadow:
    0 18px 36px rgba(0, 0, 0, 0.34),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

:root[data-theme="dark"] .support-contact-account-chip,
:root[data-theme="dark"] .support-contact-counter,
:root[data-theme="dark"] .support-contact-checklist-item {
  border-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
  background: color-mix(in srgb, var(--color-surface) 88%, var(--color-surface-elevated) 12%);
  color: var(--color-text-secondary);
  box-shadow: none;
}

:root[data-theme="dark"] .support-contact-account-chip strong,
:root[data-theme="dark"] .support-contact-checklist-item {
  color: var(--color-text-primary);
}

:root[data-theme="dark"] .support-contact-counter-short {
  border-color: color-mix(in srgb, var(--color-warning-border) 64%, var(--color-border));
  background: color-mix(in srgb, var(--color-warning-bg) 54%, var(--color-surface));
  color: var(--color-warning-text);
}

:root[data-theme="dark"] .support-contact-counter-ready {
  border-color: color-mix(in srgb, var(--color-success-border) 64%, var(--color-border));
  background: color-mix(in srgb, var(--color-success-bg) 52%, var(--color-surface));
  color: var(--color-success-text);
}

:root[data-theme="dark"] .support-contact-counter-rich {
  border-color: color-mix(in srgb, var(--color-accent) 52%, var(--color-border));
  background: color-mix(in srgb, var(--color-accent) 20%, var(--color-surface));
  color: var(--color-text-primary);
}

:root[data-theme="dark"] .support-contact-field textarea,
:root[data-theme="dark"] .support-contact-field input {
  border-color: color-mix(in srgb, var(--color-input-border) 84%, var(--color-border));
  background: color-mix(in srgb, var(--color-input-bg) 90%, var(--color-surface) 10%);
  color: var(--color-input-text);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 10px 24px rgba(0, 0, 0, 0.3);
}

:root[data-theme="dark"] .support-contact-field input::placeholder,
:root[data-theme="dark"] .support-contact-field textarea::placeholder {
  color: var(--color-input-placeholder);
}

:root[data-theme="dark"] .support-contact-field textarea:focus-visible,
:root[data-theme="dark"] .support-contact-field input:focus-visible {
  border-color: var(--color-input-focus);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 0 0 3px color-mix(in srgb, var(--color-input-focus) 35%, transparent),
    0 14px 26px rgba(0, 0, 0, 0.34);
}

:root[data-theme="dark"] .support-contact-field.is-invalid textarea,
:root[data-theme="dark"] .support-contact-field.is-invalid input {
  border-color: color-mix(in srgb, var(--color-danger-border) 68%, var(--color-border));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 0 0 3px color-mix(in srgb, var(--color-danger-border) 34%, transparent);
}

/* =========================
   SUPPORT ABOUT US PAGE
   ========================= */
.support-about-page {
  display: grid;
  grid-gap: 1.35rem;
  gap: 1.35rem;
}

.support-about-hero {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-gap: 1.15rem;
  gap: 1.15rem;
  background:
    radial-gradient(circle at top left, rgba(217, 93, 57, 0.16), transparent 28%),
    radial-gradient(circle at right center, rgba(46, 110, 98, 0.14), transparent 24%),
    linear-gradient(145deg, rgba(255, 250, 244, 0.98), rgba(248, 240, 230, 0.92)),
    var(--panel-bg);
  box-shadow: 0 24px 54px var(--shadow);
}

.support-about-hero::after {
  content: "";
  position: absolute;
  right: -42px;
  top: -52px;
  width: 180px;
  height: 180px;
  border-radius: 40px;
  transform: rotate(18deg);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.48), rgba(255, 255, 255, 0.08));
  border: 1px solid rgba(255, 255, 255, 0.4);
}

.support-about-hero-copy,
.support-about-section-copy,
.support-about-card-copy {
  position: relative;
  z-index: 1;
  display: grid;
  grid-gap: 0.75rem;
  gap: 0.75rem;
}

.support-about-eyebrow,
.support-about-kicker {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0.32rem 0.74rem;
  border-radius: 999px;
  border: 1px solid rgba(217, 93, 57, 0.22);
  background: rgba(255, 255, 255, 0.56);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink);
}

.support-about-hero-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.support-about-hero-header h2,
.support-about-section-copy h2 {
  margin: 0;
  max-width: 16ch;
  font-size: clamp(1.8rem, 4vw, 2.8rem);
  line-height: 1.02;
}

.support-about-hero-header p,
.support-about-section-copy p {
  margin: 0;
  max-width: 44rem;
  color: var(--ink-muted);
  line-height: 1.68;
}

.support-about-quote {
  position: relative;
  z-index: 1;
  margin: 0;
}

.support-about-quote-frame {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-gap: 0.9rem;
  gap: 0.9rem;
  min-height: 220px;
  padding: 1.35rem 1.35rem 1.2rem;
  border-radius: 28px;
  border: 1px solid color-mix(in srgb, var(--border) 70%, white 30%);
  background:
    radial-gradient(circle at top right, rgba(46, 110, 98, 0.15), transparent 24%),
    radial-gradient(circle at left center, rgba(217, 93, 57, 0.14), transparent 26%),
    linear-gradient(155deg, rgba(255, 255, 255, 0.78), rgba(255, 246, 236, 0.54)),
    var(--surface);
  box-shadow:
    0 28px 52px rgba(32, 28, 21, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.78);
  -webkit-backdrop-filter: blur(14px);
          backdrop-filter: blur(14px);
}

.support-about-quote-frame::after {
  content: "";
  position: absolute;
  right: -36px;
  bottom: -46px;
  width: 180px;
  height: 180px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(217, 93, 57, 0.14), transparent 68%);
  pointer-events: none;
}

.support-about-quote-kicker {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  width: -moz-fit-content;
  width: fit-content;
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ink-muted);
}

.support-about-quote-kicker::before {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent-2) 62%, white 38%));
  box-shadow: 0 0 0 6px rgba(217, 93, 57, 0.12);
}

.support-about-quote-mark {
  position: absolute;
  right: 1.15rem;
  top: 0.75rem;
  font-family: "Playfair Display", serif;
  font-size: clamp(4rem, 9vw, 6.6rem);
  line-height: 1;
  color: rgba(31, 29, 26, 0.12);
  pointer-events: none;
}

.support-about-quote-frame p {
  position: relative;
  z-index: 1;
  margin: 0;
  max-width: 18ch;
  font-family: "Playfair Display", serif;
  font-size: clamp(2rem, 4.6vw, 3.6rem);
  line-height: 0.98;
  letter-spacing: -0.04em;
  color: var(--ink);
  text-wrap: balance;
}

.support-about-quote-caret {
  display: inline-block;
  width: 2px;
  height: 0.9em;
  margin-left: 0.12em;
  transform: translateY(0.08em);
  background: color-mix(in srgb, var(--accent) 72%, var(--ink) 28%);
  animation: support-about-caret-blink 0.9s steps(1) infinite;
}

.support-about-quote-caret.is-hidden {
  opacity: 0;
  animation: none;
}

.support-about-quote-underline {
  position: relative;
  z-index: 1;
  width: min(190px, 52%);
  height: 8px;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    rgba(217, 93, 57, 0.9),
    color-mix(in srgb, var(--accent) 56%, var(--accent-2) 44%),
    rgba(46, 110, 98, 0.48)
  );
  box-shadow: 0 10px 22px rgba(217, 93, 57, 0.18);
}

@keyframes support-about-caret-blink {
  0%,
  45% {
    opacity: 1;
  }

  46%,
  100% {
    opacity: 0;
  }
}

.support-about-principles {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-gap: 0.85rem;
  gap: 0.85rem;
}

.support-about-principle {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-gap: 0.7rem;
  gap: 0.7rem;
  padding: 1rem;
  border-radius: 18px;
  border: 1px solid rgba(217, 205, 187, 0.8);
  background:
    linear-gradient(155deg, rgba(255, 255, 255, 0.68), rgba(255, 246, 237, 0.44)),
    var(--surface);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.support-about-principle p {
  margin: 0;
  color: var(--ink-muted);
  line-height: 1.55;
}

.support-about-principle-icon {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: color-mix(in srgb, var(--color-accent) 14%, transparent);
  color: var(--color-accent);
}

.support-about-section {
  display: grid;
  grid-template-columns: minmax(260px, 0.78fr) minmax(0, 1.22fr);
  grid-gap: 1rem;
  gap: 1rem;
  align-items: start;
}

.support-about-section-copy {
  position: -webkit-sticky;
  position: sticky;
  top: 5.5rem;
  padding: 1.25rem;
  border-radius: 24px;
  border: 1px solid color-mix(in srgb, var(--border) 78%, white 22%);
  background:
    linear-gradient(150deg, rgba(255, 255, 255, 0.58), rgba(255, 245, 235, 0.24)),
    var(--surface);
  box-shadow: 0 20px 42px var(--shadow);
}

.support-about-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
  padding-top: 0.2rem;
}

.support-about-team-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 1rem;
  gap: 1rem;
}

.support-about-card {
  padding: 1rem;
  border-radius: 22px;
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
  min-height: 260px;
  background:
    linear-gradient(160deg, rgba(255, 255, 255, 0.7), rgba(255, 248, 240, 0.34)),
    var(--panel-bg);
  box-shadow: 0 20px 40px rgba(32, 28, 21, 0.12);
}

.support-about-card-coral {
  background:
    radial-gradient(circle at top left, rgba(217, 93, 57, 0.12), transparent 34%),
    linear-gradient(160deg, rgba(255, 255, 255, 0.7), rgba(255, 248, 240, 0.34)),
    var(--panel-bg);
}

.support-about-card-sage {
  background:
    radial-gradient(circle at top left, rgba(46, 110, 98, 0.14), transparent 34%),
    linear-gradient(160deg, rgba(255, 255, 255, 0.7), rgba(247, 250, 246, 0.34)),
    var(--panel-bg);
}

.support-about-card-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
}

.support-about-card-badge {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0.34rem 0.72rem;
  border-radius: 999px;
  border: 1px solid rgba(217, 205, 187, 0.86);
  background: rgba(255, 255, 255, 0.62);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.support-about-card-avatar {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: rgba(31, 29, 26, 0.08);
  color: var(--ink);
  font-weight: 700;
  letter-spacing: 0.06em;
}

.support-about-card-copy h3 {
  margin: 0;
  font-size: 1.3rem;
  font-family: "Playfair Display", serif;
}

.support-about-card-copy p {
  margin: 0;
  color: var(--ink-muted);
  line-height: 1.62;
}

.support-about-focus-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.support-about-focus-pill {
  display: inline-flex;
  align-items: center;
  padding: 0.32rem 0.68rem;
  border-radius: 999px;
  border: 1px solid rgba(217, 205, 187, 0.82);
  background: rgba(255, 255, 255, 0.58);
  font-size: 0.8rem;
  color: var(--ink);
}

:root[data-theme="dark"] .support-about-hero {
  background:
    radial-gradient(circle at top left, rgba(224, 123, 86, 0.12), transparent 30%),
    radial-gradient(circle at right center, rgba(111, 178, 161, 0.12), transparent 24%),
    linear-gradient(145deg, rgba(20, 26, 23, 0.98), rgba(16, 21, 19, 0.94)),
    var(--panel-bg);
  border-color: rgba(95, 114, 104, 0.72);
  box-shadow: 0 28px 60px rgba(0, 0, 0, 0.42);
}

:root[data-theme="dark"] .support-about-hero::after {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02));
  border-color: rgba(255, 255, 255, 0.08);
}

:root[data-theme="dark"] .support-about-eyebrow,
:root[data-theme="dark"] .support-about-kicker,
:root[data-theme="dark"] .support-about-card-badge,
:root[data-theme="dark"] .support-about-focus-pill {
  border-color: rgba(95, 114, 104, 0.72);
  background: rgba(255, 255, 255, 0.05);
  color: var(--ink);
}

:root[data-theme="dark"] .support-about-principle,
:root[data-theme="dark"] .support-about-section-copy,
:root[data-theme="dark"] .support-about-card {
  border-color: rgba(95, 114, 104, 0.68);
  background:
    linear-gradient(160deg, rgba(255, 255, 255, 0.03), rgba(0, 0, 0, 0.14)),
    color-mix(in srgb, var(--surface) 84%, transparent);
  box-shadow:
    0 20px 40px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

:root[data-theme="dark"] .support-about-card-coral {
  background:
    radial-gradient(circle at top left, rgba(224, 123, 86, 0.14), transparent 34%),
    linear-gradient(160deg, rgba(255, 255, 255, 0.03), rgba(0, 0, 0, 0.14)),
    color-mix(in srgb, var(--surface) 84%, transparent);
}

:root[data-theme="dark"] .support-about-card-sage {
  background:
    radial-gradient(circle at top left, rgba(111, 178, 161, 0.14), transparent 34%),
    linear-gradient(160deg, rgba(255, 255, 255, 0.03), rgba(0, 0, 0, 0.14)),
    color-mix(in srgb, var(--surface) 84%, transparent);
}

:root[data-theme="dark"] .support-about-principle-icon,
:root[data-theme="dark"] .support-about-card-avatar {
  background: rgba(255, 255, 255, 0.07);
  color: var(--ink);
}

:root[data-theme="dark"] .support-about-quote-frame {
  border-color: rgba(95, 114, 104, 0.74);
  background:
    radial-gradient(circle at top right, rgba(111, 178, 161, 0.16), transparent 24%),
    radial-gradient(circle at left center, rgba(224, 123, 86, 0.16), transparent 26%),
    linear-gradient(155deg, rgba(25, 32, 29, 0.94), rgba(17, 22, 20, 0.92)),
    color-mix(in srgb, var(--surface) 82%, transparent);
  box-shadow:
    0 28px 56px rgba(0, 0, 0, 0.4),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

:root[data-theme="dark"] .support-about-quote-mark {
  color: rgba(242, 235, 224, 0.14);
}

:root[data-theme="dark"] .support-about-quote-kicker {
  color: var(--ink-muted);
}

:root[data-theme="dark"] .support-about-quote-kicker::before {
  box-shadow: 0 0 0 6px rgba(224, 123, 86, 0.14);
}

:root[data-theme="dark"] .support-about-quote-underline {
  box-shadow: 0 10px 22px rgba(224, 123, 86, 0.18);
}

@media (max-width: 980px) {
  .support-about-section {
    grid-template-columns: 1fr;
  }

  .support-about-section-copy {
    position: static;
  }
}

@media (max-width: 900px) {
  .support-about-hero-header {
    flex-direction: column;
  }

  .support-about-quote-frame p {
    max-width: 20ch;
  }

  .support-about-principles,
  .support-about-team-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .support-about-page {
    gap: 1rem;
  }

  .support-about-quote-frame {
    min-height: 190px;
    padding: 1.1rem;
    border-radius: 22px;
  }

  .support-about-quote-mark {
    right: 0.8rem;
    top: 0.6rem;
  }

  .support-about-principle,
  .support-about-card,
  .support-about-section-copy {
    border-radius: 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .support-about-quote-frame,
  .support-about-quote-caret {
    animation: none !important;
    transition: none !important;
  }
}

.support-article-page {
  display: grid;
  grid-gap: 1.35rem;
  gap: 1.35rem;
}

.support-article {
  display: grid;
  grid-gap: 1.15rem;
  gap: 1.15rem;
}

.support-article-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.78fr);
  grid-gap: 1rem;
  gap: 1rem;
  align-items: stretch;
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at top left, rgba(217, 93, 57, 0.14), transparent 28%),
    radial-gradient(circle at right center, rgba(46, 110, 98, 0.12), transparent 24%),
    linear-gradient(145deg, rgba(255, 250, 244, 0.98), rgba(248, 240, 230, 0.9)),
    var(--panel-bg);
  box-shadow: 0 24px 54px var(--shadow);
}

.support-article-hero-copy {
  display: grid;
  align-content: start;
  grid-gap: 0.9rem;
  gap: 0.9rem;
}

.support-article-eyebrow {
  display: inline-flex;
  align-items: center;
  width: -moz-fit-content;
  width: fit-content;
  min-height: 2rem;
  padding: 0.36rem 0.78rem;
  border-radius: 999px;
  border: 1px solid rgba(217, 93, 57, 0.2);
  background: rgba(255, 255, 255, 0.58);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.support-article-hero-copy h2 {
  margin: 0;
  max-width: 12ch;
  font-family: "Playfair Display", serif;
  font-size: clamp(2.4rem, 5vw, 4.6rem);
  line-height: 0.95;
  letter-spacing: -0.05em;
  text-wrap: balance;
}

.support-article-hero-copy p {
  margin: 0;
  max-width: 58ch;
  color: var(--ink-muted);
  line-height: 1.72;
  font-size: 1.02rem;
}

.support-article-hero-media {
  position: relative;
  min-height: 320px;
  border-radius: 28px;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.08)),
    rgba(255, 250, 244, 0.54);
  border: 1px solid rgba(255, 255, 255, 0.45);
}

.support-article-hero-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.support-article-layout {
  display: grid;
  grid-template-columns: minmax(220px, 0.4fr) minmax(0, 1fr);
  grid-gap: 1rem;
  gap: 1rem;
  align-items: start;
}

.support-article-meta {
  position: -webkit-sticky;
  position: sticky;
  top: 5.5rem;
}

.support-article-meta-card {
  display: grid;
  grid-gap: 0.45rem;
  gap: 0.45rem;
  padding: 1.15rem;
  border-radius: 24px;
  border: 1px solid color-mix(in srgb, var(--border) 78%, white 22%);
  background:
    linear-gradient(150deg, rgba(255, 255, 255, 0.58), rgba(255, 245, 235, 0.24)),
    var(--surface);
  box-shadow: 0 20px 42px var(--shadow);
}

.support-article-meta-label {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-muted);
}

.support-article-meta-card strong {
  font-size: 1rem;
}

.support-article-meta-card p {
  margin: 0;
  color: var(--ink-muted);
  line-height: 1.6;
}

.support-article-body {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
  min-width: 0;
}

.support-article-prose {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
  padding: 1.5rem;
  border-radius: 28px;
  border: 1px solid rgba(217, 205, 187, 0.82);
  background:
    linear-gradient(160deg, rgba(255, 255, 255, 0.78), rgba(255, 248, 240, 0.42)),
    var(--surface);
  box-shadow: 0 22px 44px rgba(32, 28, 21, 0.1);
}

.support-article-prose p,
.support-article-highlight li {
  margin: 0;
  color: #4f473e;
  font-size: 1.02rem;
  line-height: 1.85;
}

.support-article-prose h3 {
  margin: 0.5rem 0 0;
  font-family: "Playfair Display", serif;
  font-size: clamp(1.6rem, 2.2vw, 2.3rem);
  line-height: 1.02;
  letter-spacing: -0.04em;
}

.support-article-prose blockquote {
  margin: 0.2rem 0;
  padding: 1.15rem 1.2rem 1.1rem;
  border-left: 3px solid rgba(217, 93, 57, 0.55);
  border-radius: 0 20px 20px 0;
  background:
    radial-gradient(circle at top right, rgba(46, 110, 98, 0.08), transparent 30%),
    rgba(255, 247, 239, 0.84);
  font-family: "Playfair Display", serif;
  font-size: clamp(1.45rem, 2vw, 2rem);
  line-height: 1.2;
  letter-spacing: -0.03em;
  color: var(--ink);
}

.support-article-highlight {
  display: grid;
  grid-gap: 0.7rem;
  gap: 0.7rem;
  padding: 1.1rem 1.15rem;
  border-radius: 22px;
  border: 1px solid rgba(217, 205, 187, 0.85);
  background:
    linear-gradient(150deg, rgba(255, 255, 255, 0.7), rgba(255, 245, 235, 0.38)),
    var(--surface);
}

.support-article-highlight span {
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-muted);
}

.support-article-highlight ul {
  margin: 0;
  padding-left: 1.1rem;
  display: grid;
  grid-gap: 0.55rem;
  gap: 0.55rem;
}

.support-article-footer {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
}

:root[data-theme="dark"] .support-article-hero {
  background:
    radial-gradient(circle at top left, rgba(224, 123, 86, 0.12), transparent 30%),
    radial-gradient(circle at right center, rgba(111, 178, 161, 0.12), transparent 24%),
    linear-gradient(145deg, rgba(20, 26, 23, 0.98), rgba(16, 21, 19, 0.94)),
    var(--panel-bg);
  border-color: rgba(95, 114, 104, 0.72);
  box-shadow: 0 28px 60px rgba(0, 0, 0, 0.42);
}

:root[data-theme="dark"] .support-article-eyebrow,
:root[data-theme="dark"] .support-article-meta-card,
:root[data-theme="dark"] .support-article-prose,
:root[data-theme="dark"] .support-article-highlight {
  border-color: rgba(95, 114, 104, 0.72);
  background:
    linear-gradient(160deg, rgba(255, 255, 255, 0.03), rgba(0, 0, 0, 0.14)),
    color-mix(in srgb, var(--surface) 84%, transparent);
}

:root[data-theme="dark"] .support-article-prose blockquote {
  background:
    radial-gradient(circle at top right, rgba(111, 178, 161, 0.12), transparent 30%),
    rgba(255, 255, 255, 0.03);
  color: var(--ink);
}

@media (max-width: 980px) {
  .support-article-hero,
  .support-article-layout {
    grid-template-columns: 1fr;
  }

  .support-article-meta {
    position: static;
  }
}

@media (max-width: 900px) {
  .support-article-hero-copy h2 {
    max-width: 100%;
  }

  .support-article-prose {
    padding: 1.15rem;
  }
}

.status-down {
  color: #a03922;
  border-color: rgba(178, 74, 48, 0.38);
  background: rgba(178, 74, 48, 0.14);
}

:root[data-theme="dark"] .status-ok {
  color: #8ed7c1;
  border-color: rgba(123, 208, 186, 0.42);
  background: rgba(61, 128, 111, 0.24);
}

:root[data-theme="dark"] .status-degraded {
  color: #f3cb8a;
  border-color: rgba(205, 154, 86, 0.5);
  background: rgba(150, 108, 52, 0.22);
}

:root[data-theme="dark"] .status-down {
  color: #f4b3a5;
  border-color: rgba(214, 123, 102, 0.55);
  background: rgba(134, 63, 51, 0.28);
}

.module-grid {
  margin-top: 1.6rem;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-gap: 1rem;
  gap: 1rem;
}

.module-card {
  grid-column: span 4;
  padding: 1.4rem 1.5rem;
  border-radius: var(--radius-lg);
  background: var(--surface-2);
  border: 1px solid var(--border);
  box-shadow: 0 18px 32px var(--shadow);
  display: grid;
  grid-gap: 0.9rem;
  gap: 0.9rem;
  position: relative;
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.module-card::after {
  content: "";
  position: absolute;
  inset: auto -30% -55% auto;
  width: 260px;
  height: 220px;
  background: radial-gradient(circle, rgba(46, 110, 98, 0.16), transparent 70%);
}

.module-card:hover {
  transform: translateY(-4px);
  border-color: rgba(46, 110, 98, 0.45);
  box-shadow: 0 26px 50px var(--shadow-strong);
}

.module-card:focus-within {
  border-color: rgba(217, 93, 57, 0.55);
  box-shadow: 0 0 0 3px rgba(217, 93, 57, 0.2), 0 24px 46px var(--shadow-strong);
}

.module-card-feature {
  grid-column: span 4;
  border-color: color-mix(in srgb, var(--accent) 35%, var(--border));
  background: linear-gradient(150deg, color-mix(in srgb, var(--surface-2) 78%, var(--surface-3)), var(--surface-2));
}

.module-card-compact {
  grid-column: span 3;
}

.module-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.8rem;
  z-index: 1;
}

.module-icon {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: var(--surface-3);
  border: 1px solid var(--border);
  display: grid;
  place-items: center;
  color: var(--accent-2);
}

.module-title {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 700;
}

.module-desc {
  margin: 0;
  color: var(--dashboard-muted-tone);
  line-height: 1.5;
  font-size: 0.91rem;
  z-index: 1;
}

.module-actions {
  display: flex;
  gap: 0.56rem;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 0.12rem;
  z-index: 1;
}

.module-actions > .btn-secondary,
.module-actions > .btn-ghost {
  min-width: -moz-fit-content;
  min-width: fit-content;
}

.suggestions-card-content {
  display: grid;
  grid-gap: 0.8rem;
  gap: 0.8rem;
  z-index: 1;
}

.suggestion-highlight {
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--accent) 40%, var(--border));
  background: color-mix(in srgb, var(--surface) 82%, var(--surface-3));
  padding: 0.75rem 0.85rem;
  display: grid;
  grid-gap: 0.4rem;
  gap: 0.4rem;
}

.suggestion-highlight strong {
  font-size: 0.95rem;
}

.suggestion-highlight p {
  margin: 0;
  color: var(--ink-muted);
  font-size: 0.86rem;
}

.suggestion-list {
  display: grid;
  grid-gap: 0.5rem;
  gap: 0.5rem;
}

.suggestion-item {
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--surface);
  padding: 0.55rem 0.7rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
}

.suggestion-item p {
  margin: 0;
  color: var(--ink);
  font-size: 0.84rem;
}

.suggestion-badge {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  border: 1px solid rgba(46, 110, 98, 0.35);
  background: rgba(46, 110, 98, 0.12);
  color: var(--ink);
  padding: 0.2rem 0.55rem;
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  width: -moz-fit-content;
  width: fit-content;
}

.suggestion-badge.subtle {
  border-color: rgba(121, 106, 88, 0.34);
  background: rgba(121, 106, 88, 0.12);
}

.suggestion-empty {
  border-radius: 14px;
  border: 1px dashed var(--border);
  background: var(--surface);
  padding: 0.85rem;
  display: grid;
  grid-gap: 0.35rem;
  gap: 0.35rem;
  z-index: 1;
}

.suggestion-empty strong {
  font-size: 0.92rem;
}

.suggestion-empty p {
  margin: 0;
  color: var(--ink-muted);
  font-size: 0.84rem;
}

.activity-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-gap: 0.55rem;
  gap: 0.55rem;
  z-index: 1;
}

.activity-list li {
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--surface);
  padding: 0.58rem 0.7rem;
  display: grid;
  grid-gap: 0.2rem;
  gap: 0.2rem;
}

.activity-list p {
  margin: 0;
  font-size: 0.86rem;
  color: var(--ink);
}

.activity-list span {
  font-size: 0.76rem;
  color: var(--ink-muted);
}

/* =========================
   DASHBOARD NOTES
   ========================= */
.notes-board {
  margin-top: var(--dashboard-section-gap);
  display: grid;
  grid-gap: 1.1rem;
  gap: 1.1rem;
  padding: 1.46rem;
  border-radius: var(--radius-lg);
  border: 1px solid var(--border);
  background: var(--surface-2);
  box-shadow: 0 18px 32px var(--shadow);
}

.notes-board-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.notes-board-header h3 {
  margin: 0 0 0.3rem;
  font-size: 1.15rem;
}

.notes-board-header p {
  margin: 0;
  color: var(--dashboard-muted-tone);
  font-size: var(--dashboard-muted-size);
  line-height: 1.45;
  max-width: 32rem;
}

.notes-header-actions {
  display: flex;
  gap: 0.56rem;
  flex-wrap: wrap;
  align-items: center;
}

.notes-board-content {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  grid-gap: 1rem;
  gap: 1rem;
}

.notes-collapsed-hint {
  font-size: 0.9rem;
  color: var(--ink-muted);
  padding: 0.2rem 0;
}

.notes-panel,
.notes-list {
  border-radius: var(--radius-lg);
  border: 1px solid var(--border);
  background: var(--surface);
  box-shadow: none;
  padding: 1.2rem;
  display: grid;
  grid-gap: 1.2rem;
  gap: 1.2rem;
}

.notes-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.notes-header h2 {
  margin: 0 0 0.3rem;
  font-size: 1.3rem;
}

.notes-header p {
  margin: 0;
  color: var(--ink-muted);
  max-width: 30rem;
}

.notes-form {
  display: grid;
  grid-gap: 0.9rem;
  gap: 0.9rem;
}

.notes-field {
  display: grid;
  grid-gap: 0.45rem;
  gap: 0.45rem;
  font-size: 0.9rem;
  color: var(--ink-muted);
}

.notes-field span {
  font-weight: 600;
  color: var(--ink);
}

.notes-field input,
.notes-field textarea {
  width: 100%;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--input-bg);
  padding: 0.7rem 0.85rem;
  font-family: "IBM Plex Sans", sans-serif;
  font-size: 0.95rem;
  color: var(--ink);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.notes-field textarea {
  min-height: 140px;
  resize: vertical;
}

.notes-field input:focus-visible,
.notes-field textarea:focus-visible {
  outline: none;
  border-color: var(--border-focus);
  box-shadow: 0 0 0 3px rgba(217, 93, 57, 0.2);
}

.notes-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: center;
}

.notes-status {
  font-size: 0.85rem;
  color: var(--ink-muted);
}

.notes-list-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
}

.notes-list-header h3,
.notes-list-header h4 {
  margin: 0;
  font-size: 1.05rem;
}

.notes-list-header span {
  font-size: 0.8rem;
  color: var(--ink-muted);
}

.notes-empty {
  border-radius: 14px;
  border: 1px dashed var(--border);
  background: var(--surface-2);
  padding: 1.1rem;
  color: var(--ink-muted);
}

.notes-empty strong {
  display: block;
  color: var(--ink);
  margin-bottom: 0.2rem;
}

.notes-cards {
  display: grid;
  grid-gap: 0.8rem;
  gap: 0.8rem;
}

.notes-card {
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 0.9rem 1rem;
  background: var(--surface-2);
  text-align: left;
  display: grid;
  grid-gap: 0.45rem;
  gap: 0.45rem;
  cursor: pointer;
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.notes-card:hover {
  transform: translateY(-2px);
  border-color: rgba(217, 93, 57, 0.4);
  box-shadow: 0 16px 28px var(--shadow);
}

.notes-card.is-active {
  border-color: rgba(46, 110, 98, 0.5);
  background: var(--surface-3);
}

.notes-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
}

.notes-card-head strong {
  font-size: 0.95rem;
  color: var(--ink);
}

.notes-card-head span {
  font-size: 0.75rem;
  color: var(--ink-muted);
}

.notes-card p {
  margin: 0;
  color: var(--ink-muted);
  font-size: 0.88rem;
  line-height: 1.5;
}

.tech-footer {
  margin-top: 1.6rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: center;
  justify-content: space-between;
}

.tech-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.tech-chip {
  padding: 0.3rem 0.75rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--surface);
  font-size: 0.78rem;
  letter-spacing: 0.02em;
}

/* =========================
   NOTICE / TOAST
   ========================= */
.notice {
  border-radius: 14px;
  border: 1px solid var(--border);
  padding: 0.85rem 1rem;
  background: var(--surface-2);
  box-shadow: 0 12px 28px var(--shadow);
  font-weight: 500;
}


.btn-compact {
  min-height: 40px;
  padding: 0.45rem 0.85rem;
  border-radius: 11px;
}

.history-filter-apply {
  min-height: 34px;
  padding: 0.35rem 0.75rem;
  border-radius: 9px;
  font-size: 0.82rem;
  gap: 0.4rem;
  border: 1px solid color-mix(in srgb, var(--border) 74%, transparent);
  background: color-mix(in srgb, var(--surface) 90%, transparent);
  color: var(--ink);
  box-shadow: 0 8px 18px color-mix(in srgb, var(--shadow) 35%, transparent);
}

.history-filter-apply:hover:not(:disabled) {
  border-color: color-mix(in srgb, var(--accent) 46%, var(--border));
  background: color-mix(in srgb, var(--surface-2) 90%, transparent);
}

.history-filter-apply:disabled {
  border-color: color-mix(in srgb, var(--border) 68%, transparent);
  background: color-mix(in srgb, var(--surface-2) 82%, transparent);
  color: var(--ink-muted);
  box-shadow: none;
}

.notice-success {
  border-color: var(--state-success-border);
  background: var(--state-success-bg);
  color: var(--state-success-text);
}

.notice-warning {
  border-color: var(--state-warning-border);
  background: var(--state-warning-bg);
  color: var(--state-warning-text);
}

.notice-error {
  border-color: var(--state-error-border);
  background: var(--state-error-bg);
  color: var(--state-error-text);
}

.notice-info {
  border-color: var(--state-info-border);
  background: var(--state-info-bg);
  color: var(--state-info-text);
}

.toast {
  position: fixed;
  top: 1.5rem;
  right: 1.5rem;
  z-index: 80;
  max-width: 320px;
  padding: 1rem 1.2rem;
  border-radius: 16px;
  background: var(--surface);
  border: 1px solid var(--border);
  box-shadow: 0 24px 50px var(--shadow-strong);
  display: grid;
  grid-gap: 0.6rem;
  gap: 0.6rem;
}

.toast-actions {
  display: flex;
  justify-content: flex-end;
}

.toast.notice-success {
  border-color: var(--state-success-border);
  background: var(--state-success-bg);
  color: var(--state-success-text);
}

.toast.notice-error {
  border-color: var(--state-error-border);
  background: var(--state-error-bg);
  color: var(--state-error-text);
}

/* =========================
   WEATHER CARD (Uiverse base)
   ========================= */
.weather-grid {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  margin-top: 1rem;
}

.weather-group {
  display: grid;
  grid-gap: 0.9rem;
  gap: 0.9rem;
  padding: 1rem;
  border-radius: var(--radius-lg);
  border: 1px solid var(--border);
  background: var(--surface);
  box-shadow: 0 16px 30px var(--shadow);
}

.weather-group h3 {
  margin: 0;
  font-size: 1rem;
}

.cardm {
  position: relative;
  display: grid;
  align-items: center;
  justify-items: center;
}

.cardm > .card {
  position: relative;
  width: 240px;
  height: 130px;
  border-radius: 22px;
  background: var(--surface);
  color: var(--ink);
  z-index: 2;
  transition: 0.4s ease-in-out;
  border: 1px solid var(--border);
  box-shadow: 0 14px 28px var(--shadow);
}

:root[data-theme="dark"] .cardm > .card {
  background: var(--surface-2);
}

.weather {
  position: relative;
  margin: 0.9em;
}

.main {
  font-size: 1.8em;
  position: relative;
  top: -2.6em;
  left: 4.1em;
  color: var(--ink);
}

.mainsub {
  position: relative;
  top: -9.5em;
  left: 12.6em;
  font-size: 0.62em;
  color: var(--ink-muted);
}

.card2 {
  position: absolute;
  display: flex;
  flex-direction: row;
  width: 232px;
  height: 130px;
  border-radius: 30px;
  background: var(--surface-2);
  z-index: -1;
  transition: 0.4s ease-in-out;
  border: 1px solid var(--border);
}

.cardm > .card:hover {
  background-color: var(--surface-3);
  cursor: pointer;
}

.cardm > .card:hover + .card2 {
  height: 260px;
  border-bottom-left-radius: 0px;
  border-bottom-right-radius: 0px;
}

.cardm > .card:hover + .card2 .lower {
  top: 16.2em;
}

.upper {
  display: flex;
  flex-direction: row;
  position: relative;
  color: var(--ink);
  left: 1.4em;
  top: 0.5em;
  gap: 3.2em;
}

.humiditytext {
  position: relative;
  left: 3.1em;
  top: 2.4em;
  font-size: 0.6em;
  color: var(--ink-muted);
}

.airtext {
  position: relative;
  left: 3.2em;
  top: 2.4em;
  font-size: 0.6em;
  color: var(--ink-muted);
}

.lower {
  display: flex;
  flex-direction: row;
  position: absolute;
  text-align: center;
  color: var(--ink);
  left: 2.6em;
  top: 1em;
  margin-top: 0.7em;
  font-size: 0.7em;
  transition: 0.4s ease-in-out;
}

.aqi {
  margin-right: 2.6em;
}

.realfeel {
  margin-right: 1.4em;
}

.card3 {
  position: absolute;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 232px;
  height: 30px;
  top: 4.5em;
  left: -2.2em;
  font-size: 1.1em;
  border-bottom-left-radius: 30px;
  border-bottom-right-radius: 30px;
  background: linear-gradient(135deg, var(--accent-2), var(--accent));
  color: var(--accent-ink);
  transition: 0.4s ease-in-out;
}

/* =========================
   AIRPLANE CLOUD LOADER
   ========================= */
.air-loader,
.air-loader * {
  box-sizing: border-box;
}

.air-loader {
  --size: 1;
  --duration: 3.4s;
  --radius: 1.25rem;

  --sky-top: #e4f4ff;
  --sky-mid: #bee6ff;
  --sky-bottom: #f6fbff;

  --cloud: #ffffff;
  --cloud-shadow: rgba(60, 121, 168, 0.18);

  --line: rgba(74, 141, 194, 0.42);

  --plane-body: #ffffff;
  --plane-metal: #dce8f4;
  --plane-accent: #1f6fb2;
  --plane-window: #91d5ff;

  --text: #144769;
  --text-accent: #2b84cf;
  --border: rgba(20, 71, 105, 0.14);

  --stars-opacity: 0;
  --fog-opacity: 0.28;

  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-radius: var(--radius);

  width: calc(22rem * var(--size));
  height: calc(12.5rem * var(--size));

  background: linear-gradient(
    180deg,
    var(--sky-top) 0%,
    var(--sky-mid) 58%,
    var(--sky-bottom) 100%
  );
  border: 1px solid var(--border);
  box-shadow:
    0 10px 28px rgba(32, 88, 128, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.7);

  font-family: "IBM Plex Sans", sans-serif;
}

.air-loader[data-theme="dark"] {
  --sky-top: #081629;
  --sky-mid: #102945;
  --sky-bottom: #1a3b5c;

  --cloud: #c7dcff;
  --cloud-shadow: rgba(5, 12, 22, 0.5);

  --line: rgba(173, 218, 255, 0.38);

  --plane-body: #eaf2ff;
  --plane-metal: #a8bdd8;
  --plane-accent: #76bcff;
  --plane-window: #c3ecff;

  --text: #dfedff;
  --text-accent: #86c9ff;
  --border: rgba(167, 209, 255, 0.2);

  --stars-opacity: 0.48;
  --fog-opacity: 0.12;

  box-shadow:
    0 14px 36px rgba(0, 0, 0, 0.5),
    inset 0 1px 0 rgba(219, 236, 255, 0.08);
}

@media (prefers-color-scheme: dark) {
  .air-loader[data-theme="auto"] {
    --sky-top: #081629;
    --sky-mid: #102945;
    --sky-bottom: #1a3b5c;

    --cloud: #c7dcff;
    --cloud-shadow: rgba(5, 12, 22, 0.5);

    --line: rgba(173, 218, 255, 0.38);

    --plane-body: #eaf2ff;
    --plane-metal: #a8bdd8;
    --plane-accent: #76bcff;
    --plane-window: #c3ecff;

    --text: #dfedff;
    --text-accent: #86c9ff;
    --border: rgba(167, 209, 255, 0.2);

    --stars-opacity: 0.48;
    --fog-opacity: 0.12;

    box-shadow:
      0 14px 36px rgba(0, 0, 0, 0.5),
      inset 0 1px 0 rgba(219, 236, 255, 0.08);
  }
}

.air-loader::before {
  content: "";
  position: absolute;
  inset: -20%;
  z-index: 0;
  pointer-events: none;
  opacity: var(--stars-opacity);
  background:
    radial-gradient(circle at 12% 22%, rgba(255,255,255,.95) 0 1px, transparent 1.2px),
    radial-gradient(circle at 28% 70%, rgba(255,255,255,.85) 0 1px, transparent 1.2px),
    radial-gradient(circle at 52% 36%, rgba(255,255,255,.9) 0 1px, transparent 1.3px),
    radial-gradient(circle at 76% 60%, rgba(255,255,255,.75) 0 1px, transparent 1.2px),
    radial-gradient(circle at 88% 18%, rgba(255,255,255,.9) 0 1px, transparent 1.2px);
  animation: twinkle 4.2s ease-in-out infinite alternate;
}

.air-loader::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 44%;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(to top, rgba(255,255,255,var(--fog-opacity)), transparent);
}

.cloud-layer {
  position: absolute;
  inset: 0;
  width: 220%;
  pointer-events: none;
}

.cloud-layer.back {
  --z: 0.8;
  --alpha: 0.62;
  z-index: 2;
  filter: blur(0.15px);
  animation: cloudMoveBack 26s linear infinite;
}

.cloud-layer.front {
  --z: 1.12;
  --alpha: 0.92;
  z-index: 5;
  animation: cloudMoveFront 15s linear infinite;
}

.cloud-layer .cloud {
  position: absolute;
  --h: 2rem;
  height: calc(var(--h) * var(--z));
  width: calc(var(--h) * 2.65 * var(--z));
  border-radius: 999px;
  background: var(--cloud);
  opacity: var(--alpha);
  box-shadow: 0 0.35rem 0.8rem var(--cloud-shadow);
}

.cloud-layer .cloud::before,
.cloud-layer .cloud::after {
  content: "";
  position: absolute;
  background: inherit;
  border-radius: inherit;
}

.cloud-layer .cloud::before {
  width: 48%;
  height: 120%;
  left: 14%;
  top: -55%;
}

.cloud-layer .cloud::after {
  width: 38%;
  height: 105%;
  right: 14%;
  top: -42%;
}

.cloud-layer .cloud:nth-child(1)  { --h: 1.4rem; top: 9%;  left: 2%;   }
.cloud-layer .cloud:nth-child(2)  { --h: 1.75rem; top: 24%; left: 11%;  }
.cloud-layer .cloud:nth-child(3)  { --h: 2.2rem; top: 15%; left: 24%;  }
.cloud-layer .cloud:nth-child(4)  { --h: 2.5rem; top: 37%; left: 36%;  }
.cloud-layer .cloud:nth-child(5)  { --h: 1.65rem; top: 21%; left: 50%;  }
.cloud-layer .cloud:nth-child(6)  { --h: 2.1rem; top: 10%; left: 63%;  }
.cloud-layer .cloud:nth-child(7)  { --h: 1.9rem; top: 29%; left: 78%;  }
.cloud-layer .cloud:nth-child(8)  { --h: 2.35rem; top: 14%; left: 95%;  }
.cloud-layer .cloud:nth-child(9)  { --h: 1.55rem; top: 33%; left: 112%; }
.cloud-layer .cloud:nth-child(10) { --h: 2.25rem; top: 18%; left: 132%; }
.cloud-layer .cloud:nth-child(11) { --h: 2rem; top: 28%; left: 154%; }
.cloud-layer .cloud:nth-child(12) { --h: 1.8rem; top: 11%; left: 173%; }
.cloud-layer .cloud:nth-child(13) { --h: 2.45rem; top: 35%; left: 192%; }

.plane-wrap {
  position: absolute;
  top: 53%;
  left: -23%;
  width: 9.6rem;
  height: 4.1rem;
  z-index: 4;
  transform-origin: 32% 50%;
  animation: flyAcross var(--duration) cubic-bezier(.45, .05, .55, .95) infinite;
}

.contrail {
  position: absolute;
  left: -10.2rem;
  top: 2rem;
  width: 9.8rem;
  height: 0.32rem;
  border-radius: 99px;
  transform-origin: right center;
  background: repeating-linear-gradient(
    90deg,
    var(--line) 0 0.62rem,
    transparent 0.62rem 1.12rem
  );
  filter: blur(0.15px);
  animation: trailPulse var(--duration) ease-in-out infinite;
}

.plane {
  position: absolute;
  inset: 0;
  transform-origin: 35% 50%;
  animation: planeBob 1.1s ease-in-out infinite;
}

.plane::after {
  content: "";
  position: absolute;
  left: 2rem;
  top: 2.95rem;
  width: 5.5rem;
  height: 0.5rem;
  border-radius: 99px;
  background: rgba(0, 0, 0, 0.16);
  filter: blur(0.35rem);
  opacity: 0.28;
}

.fuselage {
  position: absolute;
  left: 1.35rem;
  top: 1.52rem;
  width: 5.85rem;
  height: 1.12rem;
  border-radius: 1.2rem 1.8rem 1.8rem 1.2rem;
  background: linear-gradient(180deg, var(--plane-body), var(--plane-metal));
  box-shadow:
    inset 0 0.12rem 0 rgba(255, 255, 255, 0.65),
    inset 0 -0.12rem 0 rgba(0, 0, 0, 0.08);
}

.fuselage::before {
  content: "";
  position: absolute;
  right: -0.52rem;
  top: 0.16rem;
  width: 0.92rem;
  height: 0.8rem;
  border-radius: 0 65% 65% 0;
  transform: skewX(-12deg);
  background: linear-gradient(180deg, var(--plane-body), var(--plane-metal));
}

.fuselage::after {
  content: "";
  position: absolute;
  left: -0.82rem;
  top: 0.2rem;
  width: 1rem;
  height: 0.72rem;
  background: var(--plane-accent);
  -webkit-clip-path: polygon(0 50%, 100% 0, 100% 100%);
          clip-path: polygon(0 50%, 100% 0, 100% 100%);
  opacity: 0.9;
}

.wing {
  position: absolute;
  display: block;
}

.wing-main {
  left: 3.12rem;
  top: 1.74rem;
  width: 2.7rem;
  height: 0.95rem;
  border-radius: 0.18rem 0.65rem 0.65rem 0.22rem;
  background: linear-gradient(180deg, var(--plane-accent), var(--plane-metal));
  transform: skewX(-18deg) rotate(-8deg);
  box-shadow: inset 0 -0.12rem 0 rgba(0, 0, 0, 0.12);
}

.wing-main::before {
  content: "";
  position: absolute;
  left: 0.28rem;
  top: -0.92rem;
  width: 2.2rem;
  height: 0.95rem;
  border-radius: 0.18rem 0.65rem 0.38rem 0.22rem;
  background: linear-gradient(180deg, var(--plane-body), var(--plane-metal));
  transform: skewX(17deg) rotate(8deg);
}

.wing-tail {
  left: 1.33rem;
  top: 1.14rem;
  width: 0.95rem;
  height: 0.82rem;
  background: var(--plane-accent);
  border-radius: 0.1rem;
  -webkit-clip-path: polygon(0 100%, 100% 14%, 100% 100%);
          clip-path: polygon(0 100%, 100% 14%, 100% 100%);
  transform: rotate(-8deg);
}

.window {
  position: absolute;
  left: 3.03rem;
  top: 1.9rem;
  width: 2.75rem;
  height: 0.28rem;
  border-radius: 99px;
  opacity: 0.96;
  background:
    radial-gradient(circle at 0.14rem 50%, var(--plane-window) 0 0.13rem, transparent 0.14rem)
    0 0 / 0.52rem 100% repeat-x;
}

.window::before {
  content: "";
  position: absolute;
  right: -0.72rem;
  top: -0.17rem;
  width: 0.66rem;
  height: 0.54rem;
  border-radius: 48% 52% 65% 35%;
  background: var(--plane-window);
}

.label {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0.8rem;
  z-index: 6;

  margin: 0;
  text-align: center;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  font-size: 0.84rem;
  font-weight: 700;
  color: var(--text);
}

.label::after {
  content: attr(data-text);
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  color: var(--text-accent);
  -webkit-clip-path: inset(0 100% 0 0);
          clip-path: inset(0 100% 0 0);
  animation: textSweep 2.3s ease-in-out infinite;
  white-space: nowrap;
}

.dots {
  display: inline-block;
  width: 0ch;
  overflow: hidden;
  vertical-align: bottom;
  animation: dots 1.2s steps(2, end) infinite;
}

.dots::before {
  content: "…";
}

@keyframes cloudMoveBack {
  from { transform: translateX(0); }
  to   { transform: translateX(-54%); }
}

@keyframes cloudMoveFront {
  from { transform: translateX(0); }
  to   { transform: translateX(-58%); }
}

@keyframes flyAcross {
  0%   { transform: translateX(0)    translateY(0.15rem) rotate(-2deg); }
  22%  { transform: translateX(92%)  translateY(-0.55rem) rotate(2deg); }
  50%  { transform: translateX(210%) translateY(-1rem) rotate(4deg); }
  78%  { transform: translateX(332%) translateY(-0.35rem) rotate(1deg); }
  100% { transform: translateX(430%) translateY(0.15rem) rotate(-2deg); }
}

@keyframes planeBob {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50%      { transform: translateY(-0.16rem) rotate(-1deg); }
}

@keyframes trailPulse {
  0%   { opacity: 0.1; transform: scaleX(0.2); }
  18%  { opacity: 0.85;
  flex: none; transform: scaleX(1); }
  75%  { opacity: 0.55; transform: scaleX(0.92); }
  100% { opacity: 0.08; transform: scaleX(0.2); }
}

@keyframes textSweep {
  0%   { -webkit-clip-path: inset(0 100% 0 0); clip-path: inset(0 100% 0 0); }
  48%  { -webkit-clip-path: inset(0 0 0 0); clip-path: inset(0 0 0 0); }
  100% { -webkit-clip-path: inset(0 0 0 100%); clip-path: inset(0 0 0 100%); }
}

@keyframes dots {
  to { width: 1ch; }
}

@keyframes twinkle {
  0%   { transform: translateY(0) scale(1); opacity: var(--stars-opacity); }
  100% { transform: translateY(-0.3%) scale(1.04); opacity: calc(var(--stars-opacity) * 0.72); }
}

@media (prefers-reduced-motion: reduce) {
  .air-loader *,
  .air-loader::before,
  .air-loader::after {
    animation: none !important;
  }
}

/* =========================
   404 PAGE
   ========================= */
.not-found {
  min-height: 70vh;
  display: grid;
  place-items: center;
  padding: 2rem 1rem 3rem;
}

.sky-door-card {
  width: min(420px, 92vw);
  text-align: center;
  perspective: 1400px;
  padding: 20px;
  border-radius: var(--radius-lg);
  background: var(--surface);
  border: 1px solid var(--border);
  box-shadow: 0 26px 50px var(--shadow-strong);
}

.door-title {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 10px;
  color: var(--ink);
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
}

.door-description {
  font-size: 16px;
  color: var(--ink-muted);
  margin-bottom: 25px;
}

.sky-door {
  width: 100%;
  height: 220px;
  position: relative;
  margin-bottom: 25px;
  perspective: 1200px;
}

.door-left,
.door-right {
  width: 50%;
  height: 100%;
  background: linear-gradient(145deg, var(--surface-2), var(--surface-3));
  border: 2px solid var(--border);
  border-radius: 6px;
  position: absolute;
  top: 0;
  transition:
    transform 1.2s cubic-bezier(0.68, -0.55, 0.265, 1.55),
    box-shadow 0.5s;
  box-shadow: 0 12px 24px var(--shadow);
  z-index: 2;
}

.door-left {
  left: 0;
  transform-origin: left center;
}

.door-right {
  right: 0;
  transform-origin: right center;
}

.sky-door:hover .door-left {
  transform: rotateY(-120deg);
  box-shadow:
    inset 0 0 30px rgba(0, 0, 0, 0.18),
    0 18px 30px var(--shadow-strong);
}

.sky-door:hover .door-right {
  transform: rotateY(120deg);
  box-shadow:
    inset 0 0 30px rgba(0, 0, 0, 0.18),
    0 18px 30px var(--shadow-strong);
}

.door-handle {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: radial-gradient(circle at 30% 30%, rgba(217, 93, 57, 0.8), rgba(46, 110, 98, 0.7));
  border: 1px solid rgba(217, 93, 57, 0.6);
  box-shadow:
    inset -2px -2px 4px rgba(0, 0, 0, 0.2),
    2px 2px 4px rgba(0, 0, 0, 0.12);
  animation: handle-shine 3s infinite alternate;
}

.door-left .door-handle {
  right: 15px;
}

.door-right .door-handle {
  left: 15px;
}

@keyframes handle-shine {
  0% {
    box-shadow:
      inset -2px -2px 4px rgba(0, 0, 0, 0.3),
      2px 2px 4px rgba(0, 0, 0, 0.2);
  }
  50% {
    box-shadow:
      inset -1px -1px 6px rgba(255, 255, 200, 0.5),
      2px 2px 5px rgba(0, 0, 0, 0.3);
  }
  100% {
    box-shadow:
      inset -2px -2px 4px rgba(0, 0, 0, 0.3),
      2px 2px 4px rgba(0, 0, 0, 0.2);
  }
}

.door-content {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 20px;
  opacity: 0;
  transform: translateY(20px) scale(0.95);
  transition:
    opacity 0.6s ease 0.6s,
    transform 0.6s ease 0.6s;
}

.door-message {
  font-size: 18px;
  font-weight: bold;
  color: var(--ink);
  text-align: center;
}

.sky-door:hover .door-content {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.action-buttons {
  display: flex;
  justify-content: center;
  gap: 15px;
}

.btn {
  text-decoration: none;
  background: var(--surface-2);
  color: var(--ink);
  padding: 10px 22px;
  border-radius: 10px;
  font-weight: bold;
  border: 1px solid var(--border);
  transition:
    transform 0.2s ease,
    background 0.3s ease,
    box-shadow 0.3s ease;
  box-shadow: 0 10px 22px var(--shadow);
}

.btn:hover {
  transform: translateY(-3px);
  background: var(--surface-3);
  box-shadow: 0 14px 26px var(--shadow-strong);
}


@media (max-width: 1100px) {
  .dashboard-top-stage {
    grid-template-columns: 1fr;
  }

  .dashboard-news-rail {
    position: static;
    order: 2;
  }

  .dashboard-hero-state {
    grid-template-columns: 1fr;
  }

  .dashboard-hero-side {
    justify-items: start;
  }

  .dashboard-primary-grid .module-card {
    grid-column: span 6;
  }

  .notes-board-content {
    grid-template-columns: 1fr;
  }

  .module-card-feature,
  .module-card {
    grid-column: span 6;
  }

  .module-card-compact {
    grid-column: span 6;
  }

  .kpi-card,
  .module-card {
    grid-column: span 6;
  }
}

@media (max-width: 900px) {
  .landing-hero {
    grid-template-columns: 1fr;
  }

  .landing-grid {
    grid-template-columns: 1fr;
  }

  .landing-steps-grid {
    grid-template-columns: 1fr;
  }

  .landing-pulse-grid {
    grid-template-columns: 1fr;
  }

  .landing-why-grid {
    grid-template-columns: 1fr;
  }

  .landing-footer {
    flex-direction: column;
    align-items: flex-start;
  }

  .landing-footer-links {
    grid-template-columns: 1fr;
    width: 100%;
  }

  .landing-access {
    flex-direction: column;
    align-items: flex-start;
  }

  .page-header {
    grid-template-columns: 1fr;
    justify-items: start;
    gap: 0.7rem;
    padding-bottom: 0.55rem;
  }

  .suggestions-actions .state-pill {
    margin-left: 0;
  }

  .watchlist-header-right {
    justify-content: flex-start;
  }

  .modal-overlay {
    align-items: flex-start;
  }

  .modal-card {
    width: 100%;
    max-height: 94vh;
  }

  .airport-modal {
    grid-template-columns: 1fr;
    min-height: auto;
  }

  .airport-country-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dashboard-hero {
    grid-template-columns: 1fr;
  }

  .dashboard-section,
  .notes-board {
    margin-top: 1.7rem;
  }

  .dashboard-secondary,
  .notes-board {
    padding: 1.14rem 1.08rem;
  }

  .dashboard-meta {
    justify-items: start;
  }

  .dashboard-hero-state {
    padding: 1.8rem;
  }

  .dashboard-news-body {
    padding: 0 1rem 1rem;
  }

  .dashboard-news-copy h3 {
    max-width: 100%;
  }

  .dashboard-primary-grid .module-card {
    grid-column: span 12;
  }

  .private-account-anchor {
    top: var(--shell-header-top);
    padding: 0.55rem 0.75rem;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0.65rem;
  }

  .private-nav {
    order: 2;
    width: 100%;
  }

  .private-account-controls {
    order: 1;
    width: 100%;
    justify-content: flex-end;
  }

  .account-menu {
    min-width: 198px;
  }

  .qs-route {
    grid-template-columns: 1fr;
  }

  .qs-route-line {
    width: auto;
    height: auto;
    margin: -0.15rem 0 0.4rem;
  }

  .qs-route-line::before {
    display: none;
  }

  .qs-flex-grid,
  .qs-filter-grid {
    grid-template-columns: 1fr;
  }

  .qs-filter-core .qs-filter-grid {
    grid-template-columns: 1fr;
  }

  .qs-result-row {
    grid-template-columns: 1fr;
  }

  .qs-result-actions {
    justify-items: start;
    width: 100%;
  }

  .qs-result-price {
    text-align: left;
  }

  .qs-result-buttons {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
  }

  .qs-result-buttons .btn-ghost,
  .qs-result-buttons .btn-primary,
  .qs-result-details-link {
    width: 100%;
  }

  .qs-result-details-link {
    text-align: left;
  }

  .qs-row-menu {
    left: 0;
    right: auto;
    width: 100%;
  }

  .qs-active-chips {
    gap: 0.4rem;
  }

  .qs-active-chips .qs-chip {
    width: 100%;
    justify-content: space-between;
  }

  .qs-results-head {
    align-items: flex-start;
  }

  .qs-results-toolbar {
    position: static;
    border-bottom: none;
    background: transparent;
    padding: 0;
  }

  .auth-grid {
    grid-template-columns: 1fr;
  }

  .kpi-grid,
  .module-grid {
    grid-template-columns: 1fr;
  }

  .kpi-card,
  .module-card {
    grid-column: span 12;
  }

  .module-card-feature,
  .module-card-compact {
    grid-column: span 12;
  }

  .notes-board {
    grid-template-columns: 1fr;
  }

  .tech-footer {
    align-items: flex-start;
  }

  .notice-compact {
    align-items: flex-start;
    flex-direction: column;
  }

  .watch-row {
    grid-template-columns: 1fr;
    align-items: flex-start;
    min-height: 0;
  }

  .watch-route strong {
    white-space: normal;
  }

  .watch-smart-tools {
    width: 100%;
    align-items: stretch;
  }

  .watch-smart-counts {
    gap: 0.25rem 0.35rem;
  }

  .watch-bulk-toolbar {
    margin-left: 0;
  }

  .watch-smart-search,
  .watch-smart-sort {
    flex: 1 1 220px;
  }

  .watch-smart-search input,
  .watch-smart-sort select {
    width: 100%;
    min-width: 0;
  }

  .watch-empty-search {
    align-items: stretch;
  }

  .watch-price {
    text-align: left;
  }

  .watch-price-area {
    justify-items: start;
    width: 100%;
  }

  .watch-row-actions {
    width: 100%;
    justify-items: start;
    gap: 0.42rem;
  }

  .watch-row-actions .alert-actions {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, auto)) minmax(0, auto);
    justify-content: start;
    grid-gap: 0.36rem;
    gap: 0.36rem;
  }

  .watch-inline-price {
    margin-left: 0;
    width: 100%;
  }

  .compare-body {
    grid-template-columns: 1fr;
  }

  .compare-date {
    justify-self: start;
  }

  .prefs-layout {
    grid-template-columns: 1fr;
  }

  .prefs-hero {
    grid-template-columns: 1fr;
  }

  .prefs-nav {
    display: none;
  }

  .prefs-nav-mobile {
    display: block;
  }

  .prefs-radius-row {
    grid-template-columns: 1fr;
  }

  .prefs-guideline-grid {
    grid-template-columns: 1fr;
  }

  .prefs-search-grid,
  .prefs-search-toggle-grid,
  .prefs-search-time-grid,
  .prefs-search-hero,
  .prefs-search-grid-essential,
  .prefs-hub-secondary-grid {
    grid-template-columns: 1fr;
  }

  .prefs-hero-chips {
    justify-content: flex-start;
  }

  .prefs-savebar {
    position: fixed;
    left: 0.75rem;
    right: 0.75rem;
    bottom: max(0.75rem, env(safe-area-inset-bottom, 0px));
    flex-direction: column;
    align-items: stretch;
  }

  .prefs-search-form {
    padding-bottom: calc(12.5rem + env(safe-area-inset-bottom, 0px));
  }

  .prefs-savebar .row-actions {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
  }

  .prefs-savebar .btn-primary,
  .prefs-savebar .btn-ghost {
    width: 100%;
  }
}

@media (max-width: 390px) {
  .qs-empty-primary-cta {
    width: 100%;
    order: -1;
  }

  .qs-results-controls {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
    grid-gap: 0.45rem;
    gap: 0.45rem;
  }

  .qs-results-controls .field {
    width: 100%;
  }

  .qs-results-controls .btn-ghost,
  .qs-results-controls .qs-input {
    width: 100%;
    min-height: 44px;
  }
}

@media (max-width: 900px) {
  .split {
    grid-template-columns: 1fr;
  }
}

/* Recommendations Explorer */
.reco-shell {
  position: relative;
  display: grid;
  grid-gap: 1.35rem;
  gap: 1.35rem;
}

.reco-header-clean {
  display: grid;
  grid-gap: 0.9rem;
  gap: 0.9rem;
  padding: 1.45rem 1.6rem;
  background: linear-gradient(140deg, color-mix(in srgb, var(--color-surface) 90%, transparent), color-mix(in srgb, var(--color-surface-elevated) 74%, transparent));
}

.reco-header-clean h1 {
  margin: 0;
  font-size: clamp(1.75rem, 3.2vw, 2.35rem);
}

.reco-header-clean p {
  margin: 0.2rem 0 0;
  color: var(--ink-muted);
  max-width: 62ch;
}

.reco-mode-toggle {
  display: inline-grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  background: var(--color-surface-elevated);
  border: 1px solid var(--color-border-strong);
  border-radius: 999px;
  padding: 0.2rem;
  width: min(320px, 100%);
}

.reco-mode-toggle button {
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--ink-muted);
  padding: 0.45rem 0.8rem;
  font-weight: 600;
  cursor: pointer;
}

.reco-mode-toggle button.is-active {
  background: var(--accent-2);
  color: var(--accent-ink);
}

.reco-status-line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem;
  font-size: 0.9rem;
  color: var(--ink-muted);
  padding: 0.75rem 1rem;
}

.reco-status-line strong {
  color: var(--ink);
}

.reco-status-sep {
  color: rgba(91, 83, 73, 0.42);
}

.reco-layout-2 {
  display: grid;
  grid-template-columns: minmax(260px, 30%) minmax(0, 70%);
  grid-gap: 1.25rem;
  gap: 1.25rem;
  align-items: start;
}

.reco-config-panel {
  background: linear-gradient(180deg, color-mix(in srgb, var(--color-surface-elevated) 92%, transparent), color-mix(in srgb, var(--color-card) 72%, transparent));
  border: 1px solid var(--color-border);
  position: relative;
  display: grid;
  grid-gap: 1.05rem;
  gap: 1.05rem;
  transition: transform 180ms ease, opacity 180ms ease, max-height 180ms ease;
}

.reco-config-panel.is-collapsed {
  max-height: 214px;
  overflow: hidden;
}

.reco-config-panel.is-collapsed::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 36px;
  background: linear-gradient(to top, var(--color-surface), transparent);
  pointer-events: none;
}

.reco-config-panel.is-collapsed .reco-filters,
.reco-config-panel.is-collapsed .reco-weight,
.reco-config-panel.is-collapsed .reco-impact-summary,
.reco-config-panel.is-collapsed .reco-flex {
  display: none;
}

.reco-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.reco-panel-header h2 {
  margin: 0;
  font-size: 1.04rem;
}

.reco-results-focus {
  display: grid;
  grid-gap: 1.05rem;
  gap: 1.05rem;
  background: linear-gradient(180deg, color-mix(in srgb, var(--color-surface) 95%, transparent), color-mix(in srgb, var(--color-card) 84%, transparent));
  border-radius: 1rem;
  padding: 0.9rem;
  border: 1px solid var(--color-border);
}

.reco-results-toolbar {
  position: -webkit-sticky;
  position: sticky;
  top: 0.9rem;
  z-index: 4;
}

.reco-pick {
  display: grid;
  grid-gap: 0.75rem;
  gap: 0.75rem;
}

.reco-filter-mode {
  display: grid;
  grid-gap: 0.45rem;
  gap: 0.45rem;
}

.reco-filter-mode label {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.9rem;
}

.reco-flex {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 0.8rem;
  gap: 0.8rem;
}

.reco-slider-row {
  margin-bottom: 0.35rem;
}

.reco-slider-head {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  font-size: 0.92rem;
}

.reco-weight input[type="range"],
.reco-filters input[type="range"],
.reco-slider-row input[type="range"] {
  width: 100%;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  height: 4px;
  border-radius: 999px;
  background: rgba(121, 106, 88, 0.24);
}

.reco-weight input[type="range"]::-webkit-slider-thumb,
.reco-filters input[type="range"]::-webkit-slider-thumb,
.reco-slider-row input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
          appearance: none;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  border: 1px solid rgba(46, 110, 98, 0.5);
  background: var(--surface);
  box-shadow: 0 4px 12px rgba(46, 110, 98, 0.25);
  -webkit-transition: transform 120ms ease;
  transition: transform 120ms ease;
}

.reco-weight input[type="range"]::-webkit-slider-thumb:hover,
.reco-filters input[type="range"]::-webkit-slider-thumb:hover,
.reco-slider-row input[type="range"]::-webkit-slider-thumb:hover {
  transform: scale(1.08);
}

.reco-weight input[type="range"]::-moz-range-thumb,
.reco-filters input[type="range"]::-moz-range-thumb,
.reco-slider-row input[type="range"]::-moz-range-thumb {
  width: 13px;
  height: 13px;
  border-radius: 50%;
  border: 1px solid rgba(46, 110, 98, 0.5);
  background: var(--surface);
  box-shadow: 0 4px 12px rgba(46, 110, 98, 0.25);
}

.reco-impact {
  display: inline-flex;
  margin-top: 0.3rem;
  font-size: 0.8rem;
}

.reco-impact.is-positive {
  color: #2e6e62;
}

.reco-impact.is-negative {
  color: #b06e23;
}

.reco-impact-summary {
  margin: 0;
  border: 1px dashed var(--border);
  border-radius: 10px;
  padding: 0.55rem 0.7rem;
  font-size: 0.86rem;
  color: var(--ink-muted);
}

.reco-cta-sticky {
  position: -webkit-sticky;
  position: sticky;
  bottom: 0.8rem;
  margin-top: 0.6rem;
  z-index: 2;
}

.reco-cta-main {
  width: 100%;
  min-height: 48px;
  border-radius: 14px;
  box-shadow: 0 10px 18px rgba(217, 93, 57, 0.2);
  transition: transform 140ms ease, box-shadow 140ms ease;
}

.reco-cta-main:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 24px rgba(217, 93, 57, 0.26);
}

.reco-results-bar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}

.reco-sort {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 0.8rem;
  gap: 0.8rem;
  min-width: min(360px, 100%);
}

.reco-cards-grid {
  display: grid;
  grid-gap: 1.05rem;
  gap: 1.05rem;
}

.reco-card-v2 {
  border-radius: 1.15rem;
  border: 1px solid var(--color-border);
  background: var(--color-card);
  padding: 1.15rem 1.2rem;
  box-shadow: 0 12px 22px rgba(32, 28, 21, 0.12);
  display: grid;
  grid-gap: 0.8rem;
  gap: 0.8rem;
  animation: recoRise 280ms ease both;
  transition: transform 160ms ease, box-shadow 160ms ease;
}

.reco-card-v2:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 30px rgba(32, 28, 21, 0.18);
}

.reco-card-summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
}

.reco-card-main {
  display: grid;
  grid-gap: 0.2rem;
  gap: 0.2rem;
}

.reco-rank-pill {
  justify-self: start;
  font-size: 0.68rem;
  font-weight: 700;
  border: 1px solid rgba(46, 110, 98, 0.36);
  color: var(--accent-2);
  border-radius: 999px;
  padding: 0.12rem 0.45rem;
  background: rgba(46, 110, 98, 0.08);
}

.reco-route-xl {
  margin: 0;
  font-size: 0.98rem;
  font-weight: 700;
}

.reco-price-xl {
  margin: 0;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.1;
}

.reco-smart-tag {
  margin: 0;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--accent-2);
}

.reco-meta-line {
  margin: 0;
  color: var(--ink-muted);
  font-size: 0.88rem;
}

.reco-topby-line {
  margin: 0;
  font-size: 0.88rem;
  color: var(--color-text-secondary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.reco-score-lg {
  display: grid;
  place-items: center;
  border-radius: 1.1rem;
  padding: 0.8rem 0.9rem;
  min-width: 132px;
  border: 1px solid transparent;
  animation: recoScorePop 300ms ease both;
  box-shadow: 0 10px 18px rgba(32, 28, 21, 0.14);
}

.reco-score-top {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.reco-score-lg span {
  font-size: clamp(1.8rem, 3vw, 2.4rem);
  line-height: 1;
  font-weight: 700;
}

.reco-score-lg small {
  font-size: 0.75rem;
  font-weight: 600;
}

.reco-score-percentile {
  color: var(--color-text-secondary);
}

.reco-score-band-text {
  opacity: 0.86;
}

.reco-score-band-high {
  background: color-mix(in srgb, var(--state-success-bg) 88%, transparent);
  color: var(--state-success-text);
  border-color: var(--state-success-border);
}

.reco-score-band-midHigh {
  background: color-mix(in srgb, var(--state-info-bg) 86%, transparent);
  color: var(--state-info-text);
  border-color: var(--state-info-border);
}

.reco-score-band-midLow {
  background: color-mix(in srgb, var(--state-warning-bg) 88%, transparent);
  color: var(--state-warning-text);
  border-color: var(--state-warning-border);
}

.reco-score-band-low {
  background: color-mix(in srgb, var(--color-chip-bg) 88%, transparent);
  color: var(--color-text-secondary);
  border-color: var(--color-chip-border);
}

.reco-score-tip {
  border: 1px solid var(--color-border-strong);
  background: var(--color-chip-bg);
  color: var(--color-text-secondary);
  border-radius: 999px;
  width: 18px;
  height: 18px;
  font-size: 0.66rem;
  font-weight: 700;
  cursor: help;
  position: relative;
  line-height: 1;
  display: inline-grid;
  place-items: center;
}

.reco-score-tip::after {
  content: attr(data-tip);
  position: absolute;
  top: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  min-width: 220px;
  max-width: 260px;
  background: color-mix(in srgb, var(--color-surface-elevated) 92%, #000000 8%);
  color: var(--color-text-primary);
  font-size: 0.73rem;
  line-height: 1.35;
  padding: 0.45rem 0.55rem;
  border-radius: 8px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 120ms ease;
  z-index: 4;
}

.reco-score-tip:hover::after,
.reco-score-tip:focus-visible::after {
  opacity: 1;
}

.reco-why {
  display: grid;
  grid-gap: 0.35rem;
  gap: 0.35rem;
}

.reco-why strong {
  font-size: 0.9rem;
}

.reco-why ul {
  margin: 0;
  padding-left: 1rem;
  display: grid;
  grid-gap: 0.25rem;
  gap: 0.25rem;
  font-size: 0.88rem;
}

.tone-positive {
  color: var(--accent-2);
}

.tone-negative {
  color: var(--state-warning-text);
}

.tone-neutral {
  color: var(--ink-muted);
}

.reco-expand-btn {
  justify-self: start;
}

.reco-card-details {
  display: grid;
  grid-gap: 0.4rem;
  gap: 0.4rem;
  padding: 0.75rem 0.85rem;
  background: var(--color-surface-elevated);
  border-radius: 0.9rem;
  border: 1px solid var(--color-border);
  font-size: 0.9rem;
}

.reco-detail-row {
  margin: 0;
}

.reco-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.reco-empty {
  text-align: center;
  padding: 2rem;
}

.reco-ai-fallback p {
  margin: 0.35rem 0;
}

.reco-scale-footer {
  background: color-mix(in srgb, var(--color-surface) 78%, transparent);
}

.reco-scale-footer h3 {
  margin: 0 0 0.4rem;
  font-size: 0.98rem;
}

.reco-scale-footer p {
  margin: 0.2rem 0;
  color: var(--ink-muted);
  font-size: 0.88rem;
}

:root[data-theme="dark"] .reco-header-clean,
:root[data-theme="dark"] .reco-config-panel,
:root[data-theme="dark"] .reco-results-focus,
:root[data-theme="dark"] .reco-card-v2,
:root[data-theme="dark"] .reco-card-details,
:root[data-theme="dark"] .reco-scale-footer {
  border-color: color-mix(in srgb, var(--color-border) 88%, #a6b9af 12%);
  background:
    radial-gradient(circle at top right, color-mix(in srgb, var(--color-accent) 8%, transparent), transparent 34%),
    linear-gradient(180deg, color-mix(in srgb, var(--color-surface) 88%, #111614 12%), color-mix(in srgb, var(--color-surface-elevated) 86%, #0d1210 14%));
}

:root[data-theme="dark"] .reco-mode-toggle {
  background: color-mix(in srgb, var(--color-surface-elevated) 90%, #0f1312 10%);
  border-color: color-mix(in srgb, var(--color-border) 90%, #9fb4aa 10%);
}

:root[data-theme="dark"] .reco-mode-toggle button {
  color: var(--color-text-secondary);
}

:root[data-theme="dark"] .reco-mode-toggle button.is-active {
  color: var(--color-accent-text);
}

:root[data-theme="dark"] .reco-results-focus .field input,
:root[data-theme="dark"] .reco-results-focus .field select,
:root[data-theme="dark"] .reco-config-panel .field input,
:root[data-theme="dark"] .reco-config-panel .field select {
  background: var(--color-input-bg);
  border-color: var(--color-input-border);
  color: var(--color-text-primary);
}

@keyframes recoRise {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes recoScorePop {
  from {
    opacity: 0;
    transform: scale(0.9);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .reco-card-v2,
  .reco-score-lg {
    animation: none !important;
    transition: none !important;
  }
}

@media (max-width: 1100px) {
  .reco-layout-2 {
    grid-template-columns: 1fr;
  }

  .reco-results-toolbar {
    position: static;
  }
}

@media (max-width: 900px) {
  .reco-shell {
    gap: 1rem;
  }

  .reco-header-clean {
    padding: 1.1rem 1rem;
  }

  .reco-header-clean h1 {
    font-size: clamp(1.45rem, 6vw, 1.95rem);
  }

  .reco-mode-toggle {
    width: 100%;
  }

  .reco-status-line {
    gap: 0.35rem;
    padding: 0.65rem 0.75rem;
    font-size: 0.84rem;
    align-items: flex-start;
  }

  .reco-layout-2 {
    gap: 0.95rem;
  }

  .reco-config-panel {
    gap: 0.85rem;
  }

  .reco-config-panel.is-collapsed {
    max-height: 184px;
  }

  .reco-results-focus {
    padding: 0.65rem;
  }

  .reco-results-bar {
    align-items: stretch;
  }

  .reco-sort {
    grid-template-columns: 1fr;
    min-width: 0;
  }

  .reco-flex {
    grid-template-columns: 1fr;
  }

  .reco-card-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    grid-gap: 0.7rem;
    gap: 0.7rem;
  }

  .reco-card-v2 {
    padding: 0.95rem;
    gap: 0.7rem;
  }

  .reco-price-xl {
    font-size: 1.4rem;
  }

  .reco-score-lg {
    min-width: 104px;
    padding: 0.6rem 0.65rem;
  }

  .reco-score-lg span {
    font-size: 1.9rem;
  }

  .reco-score-tip::after {
    left: auto;
    right: 0;
    transform: none;
    min-width: 180px;
    max-width: 220px;
  }

  .reco-cta-sticky {
    position: static;
    margin-top: 0.2rem;
  }

  .reco-scale-footer {
    padding: 0.85rem 0.95rem;
  }

  .reco-status-sep {
    display: none;
  }
}

@media (max-width: 640px) {
  .reco-header-clean p {
    font-size: 0.9rem;
  }

  .reco-panel-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.55rem;
  }

  .reco-card-summary {
    grid-template-columns: 1fr;
  }

  .reco-score-lg {
    justify-self: start;
  }

  .reco-topby-line {
    max-width: 100%;
  }

  .reco-card-details {
    padding: 0.65rem 0.7rem;
    font-size: 0.86rem;
  }
}

/* Recomendaciones IA exacto */
.radar-pagina {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
}

.radar-bloque {
  display: grid;
  grid-gap: 0.75rem;
  gap: 0.75rem;
}

.radar-compacto {
  gap: 0.5rem;
}

.radar-titulo {
  margin: 0;
  font-size: clamp(1.5rem, 2.8vw, 2.2rem);
  font-family: "Playfair Display", serif;
}

.radar-subtitulo {
  margin: 0;
  color: var(--ink-muted);
  line-height: 1.45;
}

.radar-seccion-titulo {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
}

.radar-subseccion {
  margin: 0.25rem 0 0;
  font-size: 0.98rem;
  font-weight: 700;
}

.radar-estado-lineas p,
.radar-escala-lineas p {
  margin: 0.2rem 0;
}

.radar-secundario {
  justify-self: start;
  padding: 0.38rem 0.7rem;
  font-size: 0.84rem;
}

.radar-controles-fila {
  display: flex;
  gap: 0.9rem;
  flex-wrap: wrap;
  align-items: flex-end;
}

.radar-campo-inline {
  min-width: 220px;
}

.radar-tarjetas {
  display: grid;
  grid-gap: 0.8rem;
  gap: 0.8rem;
}

.radar-tarjeta {
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface);
  padding: 0.9rem 1rem;
  display: grid;
  grid-gap: 0.35rem;
  gap: 0.35rem;
}

.radar-ruta {
  margin: 0;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.radar-bloque-puntaje {
  display: flex;
  align-items: baseline;
  gap: 0.35rem;
  line-height: 1;
}

.radar-numero-puntaje {
  font-size: clamp(2rem, 4vw, 2.8rem);
  font-weight: 800;
  color: #2e6e62;
}

.radar-texto-puntaje {
  font-size: 1.02rem;
  font-weight: 700;
}

.radar-precio {
  margin: 0;
  font-size: 1.15rem;
  font-weight: 700;
}

.radar-etiqueta {
  margin: 0;
  color: var(--accent-2);
  font-weight: 600;
}

.radar-top-por {
  margin: 0;
  font-size: 0.9rem;
}

.radar-meta-linea {
  margin: 0;
  color: var(--ink-muted);
  font-size: 0.9rem;
}

.radar-campos-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 0.75rem;
  gap: 0.75rem;
}

.radar-ayuda {
  margin: 0;
  color: var(--ink-muted);
}

.radar-deslizadores {
  display: grid;
  grid-gap: 0.55rem;
  gap: 0.55rem;
}

.radar-deslizador-fila {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  align-items: center;
  grid-gap: 0.75rem;
  gap: 0.75rem;
}

.radar-deslizador-fila input[type="range"] {
  width: 100%;
}

.radar-resumen-prioridad p {
  margin: 0.22rem 0;
  font-size: 0.92rem;
}

.radar-checkbox-linea {
  align-items: center;
  padding-top: 1.35rem;
}

.radar-doble-campo {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 0.55rem;
  gap: 0.55rem;
}

.radar-radios-vertical {
  display: grid;
  grid-gap: 0.35rem;
  gap: 0.35rem;
  margin-top: 0.25rem;
}

.radar-radios-vertical label {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.9rem;
}

.radar-accion {
  justify-items: start;
}

.radar-boton-principal {
  min-width: 220px;
}

@media (max-width: 900px) {
  .radar-campos-grid {
    grid-template-columns: 1fr;
  }

  .radar-deslizador-fila {
    grid-template-columns: 1fr;
    gap: 0.35rem;
  }

  .radar-doble-campo {
    grid-template-columns: 1fr;
  }
}
/* =========================
   QS Boarding Loader (markup-compatible)
   Uses existing:
   - .qs-boarding
   - .qs-boarding-track
   - .qs-boarding-passengers (container with children = pax)
   - .qs-boarding-plane (+ --ready, --takeoff)
   ========================= */

.qs-boarding {
  width: 100%;
  max-width: 560px;
  min-height: 110px;
  margin: 0 auto;
  padding: 12px 12px 6px;
}

/* Make the loader feel "product-grade" */
.qs-boarding {
  --qs-boarding-bg: var(--color-surface);
  --qs-boarding-border: var(--color-border);
  --qs-boarding-ink: var(--color-text-primary);
  --qs-boarding-muted: #64748b;
  --qs-boarding-pax: var(--color-text-primary);
  --qs-boarding-gate: #1e40af;
}

.qs-boarding-subchecks {
  margin: 0 0 8px;
  padding: 8px 10px;
  border: 1px solid var(--qs-boarding-border);
  border-radius: 10px;
  background: var(--color-surface);
  text-align: left;
}

.qs-boarding-subchecks-title {
  display: block;
  margin: 0 0 6px;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--qs-boarding-ink);
}

.qs-boarding-subchecks-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-gap: 4px;
  gap: 4px;
}

.qs-boarding-subcheck {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr) auto;
  align-items: center;
  grid-gap: 8px;
  gap: 8px;
  min-height: 20px;
  color: var(--qs-boarding-muted);
  font-size: 0.76rem;
}

.qs-boarding-subcheck-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--color-border-strong);
}

.qs-boarding-subcheck-text {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.qs-boarding-subcheck-state {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.qs-boarding-subcheck--active {
  color: var(--qs-boarding-ink);
}

.qs-boarding-subcheck--active .qs-boarding-subcheck-dot {
  background: #1e40af;
}

.qs-boarding-subcheck--done .qs-boarding-subcheck-dot {
  background: #16a34a;
}

.qs-loading-kpis {
  margin-top: 10px;
  display: grid;
  grid-gap: 4px;
  gap: 4px;
  text-align: left;
}

.qs-loading-kpi {
  margin: 0;
  font-size: 0.8rem;
  color: var(--qs-boarding-ink);
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

.qs-loading-kpi strong {
  font-size: 0.84rem;
}

.qs-loading-kpi-muted {
  color: var(--qs-boarding-muted);
}

.qs-boarding-track {
  position: relative;
  height: 76px;
  border-radius: 14px;
  background: var(--qs-boarding-bg);
  border: 1px solid var(--qs-boarding-border);
  overflow: hidden;

  /* Prevent accidental repaints spilling outside */
  contain: layout paint;
}

/* Runway on the right */
.qs-boarding-track::after {
  content: "";
  position: absolute;
  right: 8px;
  bottom: 6px;
  width: 52px;
  height: 10px;
  border-radius: 999px;
  background:
    linear-gradient(90deg, transparent 0 8px, var(--qs-boarding-border) 8px 12px, transparent 12px 16px),
    linear-gradient(90deg, rgba(203, 213, 225, 0.75), rgba(226, 232, 240, 0.35));
  opacity: 0.6;
}

/* Gate on the left */
.qs-boarding-track::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 22px;
  height: 28px;
  border: 1px solid var(--qs-boarding-border);
  border-radius: 8px;
  background: var(--qs-boarding-bg);
  box-shadow: inset -6px 0 0 rgba(30, 64, 175, 0.16);
  opacity: 1;
}

/* PASSENGERS container exists: .qs-boarding-passengers */
.qs-boarding-passengers {
  position: absolute;
  left: 12px;
  right: 140px;
  top: 18px;
  height: 40px;

  display: flex;
  align-items: center;
  gap: 4px;

  min-height: 40px;
}

/* Pax items: make them look like tiny humans (head+body) */
.qs-boarding-passengers > * {
  position: relative;
  width: 8px;
  height: 16px;
  flex: 0 0 auto;

  opacity: 0.22;
  transform: translateY(0);
}

/* head */
.qs-boarding-passengers > *::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: var(--qs-boarding-pax);
}

/* body */
.qs-boarding-passengers > *::after {
  content: "";
  position: absolute;
  top: 6px;
  left: 50%;
  transform: translateX(-50%);
  width: 8px;
  height: 10px;
  border-radius: 6px;
  background: color-mix(in srgb, var(--qs-boarding-pax) 88%, white 12%);
}

.qs-boarding-passengers > *.is-done,
.qs-boarding-passengers > *[data-state="done"] {
  opacity: 0;
  transform: translateY(2px);
  transition: opacity 140ms linear, transform 140ms ease-out;
}

.qs-boarding-passengers > *.is-current,
.qs-boarding-passengers > *[data-state="current"] {
  opacity: 1;
  filter: drop-shadow(0 2px 4px rgba(15, 23, 42, 0.1));
}

/* Single animated walker marker */
.qs-boarding-passengers::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 2px;
  width: 10px;
  height: 20px;
  opacity: 0.9;
  pointer-events: none;
  background:
    radial-gradient(circle at 5px 4px, var(--qs-boarding-ink) 0 3px, transparent 3px),
    radial-gradient(10px 10px at 5px 13px, var(--qs-boarding-ink) 0 6px, transparent 6px);
  filter: drop-shadow(0 6px 10px rgba(15, 23, 42, 0.12));
  animation: none;
  transform: translateX(calc(var(--qs-board-step, 0) * 12px)) translateZ(0);
  transition: transform 360ms ease-in-out;
  will-change: transform;
}

@keyframes qsPseudoBoard {
  0% {
    transform: translateX(0) translateY(0);
    opacity: 0;
  }

  15% {
    opacity: 1;
  }

  70% {
    transform: translateX(44px) translateY(0);
    opacity: 1;
  }

  100% {
    transform: translateX(52px) translateY(2px);
    opacity: 0;
  }
}

.qs-boarding-plane {
  position: absolute;
  right: 16px;
  top: 22px;
  width: 92px;
  height: 32px;
  border-radius: 999px;
  background: var(--qs-boarding-ink);
  border: 1px solid var(--qs-boarding-border);
  box-shadow: 0 12px 26px rgba(15, 23, 42, 0.18);
  transform: translate3d(0, 0, 0) rotate(0deg);
  opacity: 1;
  will-change: transform, opacity;
}

/* wing */
.qs-boarding-plane::before {
  content: "";
  position: absolute;
  left: 18px;
  top: 18px;
  width: 28px;
  height: 10px;
  border-radius: 999px;
  background: var(--qs-boarding-pax);
  opacity: 0.9;
}

.qs-boarding-plane--ready {
  animation: qsPlaneReady 180ms ease-in-out infinite;
}

@keyframes qsPlaneReady {
  0%,
  100% {
    transform: translate3d(0, 0, 0);
  }

  50% {
    transform: translate3d(0, -1px, 0);
  }
}

.qs-boarding-plane--takeoff {
  animation: qsPlaneTakeoff 300ms ease-out forwards;
}

@keyframes qsPlaneTakeoff {
  0% {
    transform: translate3d(0, 0, 0) rotate(0deg);
    opacity: 1;
  }

  100% {
    transform: translate3d(52px, -18px, 0) rotate(-12deg);
    opacity: 0.85;
  flex: none;
  }
}

.qs-boarding-plane--ready.qs-boarding-plane--takeoff {
  animation: qsPlaneTakeoff 300ms ease-out forwards;
}

@media (max-width: 900px) {
  .qs-boarding {
    max-width: 100%;
  }

  .qs-boarding-track {
    height: 68px;
  }

  .qs-boarding-plane {
    width: 84px;
  }

  .qs-boarding-passengers {
    right: 130px;
    gap: 3px;
  }

  .qs-boarding-subcheck {
    font-size: 0.74rem;
  }

  .qs-boarding-passengers::after {
    transform: translateX(calc(var(--qs-board-step, 0) * 11px)) translateZ(0);
  }
}

@media (max-width: 390px) {
  .qs-boarding-passengers {
    gap: 2px;
  }

  .qs-boarding-subchecks {
    padding: 8px;
  }

  .qs-boarding-subcheck {
    grid-template-columns: 10px minmax(0, 1fr);
  }

  .qs-boarding-subcheck-state {
    display: none;
  }

  .qs-boarding-passengers > * {
    width: 7px;
    height: 14px;
  }

  .qs-boarding-passengers > *::before {
    width: 5px;
    height: 5px;
  }

  .qs-boarding-passengers > *::after {
    top: 5px;
    width: 7px;
    height: 9px;
  }

  .qs-boarding-passengers::after {
    transform: translateX(calc(var(--qs-board-step, 0) * 9px)) translateZ(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .qs-boarding-plane,
  .qs-boarding-passengers::after {
    animation: none !important;
    transition: none !important;
  }

  .qs-boarding-passengers::after {
    display: none;
  }
}

/* /quick-search - loading range: convertir en barra de progreso discreta y consistente */
.qs-state.qs-state-loading .qs-range input[type="range"] {
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  width: 100%;
  height: 6px;
  border-radius: 9999px;
  background: rgba(0, 0, 0, 0.12);
  outline: none;
  margin: 0;
}

.qs-state.qs-state-loading .qs-range input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 14px;
  height: 14px;
  border-radius: 9999px;
  background: rgba(0, 0, 0, 0.45);
  border: 0;
}

.qs-state.qs-state-loading .qs-range input[type="range"]::-moz-range-thumb {
  width: 14px;
  height: 14px;
  border-radius: 9999px;
  background: rgba(0, 0, 0, 0.45);
  border: 0;
}

.qs-state.qs-state-loading .qs-range input[type="range"]::-moz-range-track {
  height: 6px;
  border-radius: 9999px;
  background: rgba(0, 0, 0, 0.12);
  border: 0;
}

/* /quick-search - popover "Como ordenamos": panel flotante anclado al summary */
.qs-how-order {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  max-width: 100%;
}

.qs-how-order__summary {
  list-style: none;
}

.qs-how-order__summary::-webkit-details-marker {
  display: none;
}

.qs-how-order[open] .qs-how-order__panel {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: 50;
  min-width: 320px;
  max-width: 520px;
  padding: 12px 12px;
  border-radius: 12px;
  background: var(--color-surface);
  border: 1px solid rgba(0, 0, 0, 0.12);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12);
  left: auto;
  right: 0;
  max-width: min(520px, calc(100vw - 32px));
}

/* Boton primario disabled: no debe parecer CTA activo */
.btn-primary:disabled,
.btn-primary[aria-disabled="true"] {
  opacity: 0.55;
  cursor: not-allowed;
  filter: grayscale(15%);
}

.btn-primary:disabled:hover,
.btn-primary[aria-disabled="true"]:hover {
  transform: none;
  box-shadow: none;
}

/* /quick-search - toolbar: alineacion consistente entre dropdown y pills */
.qs-results-toolbar,
.qs-results-controls {
  align-items: center;
}

.qs-results-controls {
  flex-wrap: wrap;
  row-gap: 8px;
  column-gap: 8px;
}

/* /quick-search - Popover "Como ordenamos": anclar al trigger, no al toolbar completo */
.qs-how-order {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  max-width: 100%;
}

.qs-how-order[open] .qs-how-order__panel {
  left: auto;
  right: 0;
  max-width: min(520px, calc(100vw - 32px));
}

/* /quick-search - loading: normalizar el control/timeline (evitar ticks + pill gigante) */
.qs-state.qs-state-loading .qs-loading-progress {
  display: flex;
  justify-content: center;
  align-items: center;
}

.qs-state.qs-state-loading .qs-loading-progress input[type="range"] {
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  width: min(420px, 100%);
  height: 6px;
  border-radius: 9999px;
  background: rgba(0, 0, 0, 0.12);
  outline: none;
  margin: 0;
}

.qs-state.qs-state-loading .qs-loading-progress input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 14px;
  height: 14px;
  border-radius: 9999px;
  background: rgba(0, 0, 0, 0.45);
  border: 0;
}

.qs-state.qs-state-loading .qs-loading-progress input[type="range"]::-moz-range-thumb {
  width: 14px;
  height: 14px;
  border-radius: 9999px;
  background: rgba(0, 0, 0, 0.45);
  border: 0;
}

.qs-state.qs-state-loading .qs-loading-progress input[type="range"]::-moz-range-track {
  height: 6px;
  border-radius: 9999px;
  background: rgba(0, 0, 0, 0.12);
  border: 0;
}

/* /quick-search — Airport modal: redesigned for clarity, accessibility, and visual polish */
.qs-airport-modal {
  position: relative;
  width: min(1040px, 96vw);
  min-height: min(620px, calc(100dvh - 3rem));
  max-height: 82vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border-radius: 28px;
  background:
    radial-gradient(circle at 92% 6%, rgba(217, 93, 57, 0.07), transparent 28%),
    radial-gradient(circle at 8% 90%, rgba(46, 110, 98, 0.05), transparent 24%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 248, 241, 0.96));
  animation: qsModalFadeIn 220ms ease-out both;
}

@keyframes qsModalFadeIn {
  from {
    opacity: 0;
    transform: scale(0.97) translateY(6px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

/* ── Close button ── */
.qs-airport-modal__close {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 5;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 999px;
  border: 1px solid rgba(205, 191, 170, 0.36);
  background: rgba(255, 252, 248, 0.88);
  color: var(--ink, #1f1d1a);
  cursor: pointer;
  transition: background 120ms, border-color 120ms, transform 80ms;
}

.qs-airport-modal__close:hover {
  background: rgba(255, 248, 241, 1);
  border-color: rgba(205, 191, 170, 0.56);
  transform: scale(1.06);
}

.qs-airport-modal__close:focus-visible {
  outline: 3px solid var(--border-focus, #8c7558);
  outline-offset: 2px;
}

/* ── Header ── */
.qs-airport-modal__header {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 3;
  background: rgba(255, 252, 248, 0.98);
  border-bottom: 1px solid rgba(205, 191, 170, 0.28);
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
}

/* ── Body grid ── */
.qs-airport-modal__body {
  display: grid;
  grid-template-columns: minmax(300px, 1.12fr) minmax(340px, 0.88fr);
  grid-gap: 0;
  gap: 0;
  overflow: hidden;
  flex: 1 1 auto;
}

/* ── Left panel: Countries ── */
.qs-airport-modal__countries {
  overflow: auto;
  padding: 20px 18px 20px 20px;
  border-right: 1px solid rgba(205, 191, 170, 0.22);
}

.qs-airport-modal__countries .qs-airport-modal__header h2 {
  margin: 0 0 14px;
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--ink, #1f1d1a);
}

/* Country grid: 3 columns for breathing room */
.qs-airport-modal .airport-country-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-gap: 6px 8px;
  gap: 6px 8px;
}

/* Country pill: bigger touch targets, hover state */
.qs-airport-modal .country-pill {
  border: 1px solid transparent;
  background: transparent;
  color: var(--ink, #1f1d1a);
  font-size: 0.9rem;
  font-weight: 500;
  text-align: left;
  padding: 8px 10px;
  border-radius: 12px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: background 120ms, border-color 120ms, transform 100ms, box-shadow 120ms;
}

.qs-airport-modal .country-pill:hover {
  background: rgba(46, 110, 98, 0.06);
  border-color: rgba(46, 110, 98, 0.14);
  transform: translateY(-1px);
}

.qs-airport-modal .country-pill:focus-visible {
  outline: 3px solid var(--border-focus, #8c7558);
  outline-offset: 1px;
}

.qs-airport-modal .country-pill.active {
  background: var(--accent-2, #2e6e62);
  color: var(--color-text-inverse, #fff);
  padding: 8px 14px;
  border-color: transparent;
  box-shadow: 0 4px 12px rgba(46, 110, 98, 0.22);
  font-weight: 600;
}

.qs-airport-modal .country-pill.active:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(46, 110, 98, 0.28);
}

.country-pill__name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ── Right panel: Airports ── */
.qs-airport-modal__airports {
  overflow: auto;
  padding: 18px 20px 20px 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Header with count badge */
.qs-airport-modal__airports .qs-airport-modal__header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding-bottom: 0;
  border-bottom: none;
  background: transparent;
  position: static;
}

.qs-airport-modal__airports .qs-airport-modal__header h3 {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 8px;
}

.qs-airport-modal__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 22px;
  padding: 0 7px;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  background: rgba(46, 110, 98, 0.12);
  color: var(--accent-2, #2e6e62);
}

/* ── "Use all [Country]" button ── */
.qs-airport-modal__country-action {
  display: grid;
  grid-gap: 6px;
  gap: 6px;
}

.qs-airport-modal__use-country {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
  border-radius: 12px;
  border: 1px solid rgba(46, 110, 98, 0.22);
  background:
    linear-gradient(135deg, rgba(46, 110, 98, 0.06), rgba(46, 110, 98, 0.02));
  color: var(--accent-2, #2e6e62);
  font-size: 0.88rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 120ms, border-color 120ms, transform 80ms;
}

.qs-airport-modal__use-country:hover {
  background: rgba(46, 110, 98, 0.1);
  border-color: rgba(46, 110, 98, 0.32);
  transform: translateY(-1px);
}

.qs-airport-modal__use-country:focus-visible {
  outline: 3px solid var(--border-focus, #8c7558);
  outline-offset: 2px;
}

/* ── Search bar with icon ── */
.qs-airport-modal__search {
  position: relative;
  display: flex;
  align-items: center;
}

.qs-airport-modal__search-icon {
  position: absolute;
  left: 12px;
  color: var(--ink-muted, #8c7d6d);
  pointer-events: none;
  flex-shrink: 0;
}

.qs-airport-modal__search-input {
  padding-left: 36px !important;
}

/* ── Recents ── */
.qs-airport-modal__recents {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.qs-airport-modal__recents-label {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-muted, #8c7d6d);
  margin-right: 2px;
}

.qs-airport-modal__recent-chip {
  border: 1px solid rgba(205, 191, 170, 0.36);
  background: rgba(255, 252, 248, 0.8);
  color: var(--ink, #1f1d1a);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  padding: 4px 10px;
  border-radius: 8px;
  cursor: pointer;
  transition: background 100ms, border-color 100ms;
}

.qs-airport-modal__recent-chip:hover {
  background: rgba(46, 110, 98, 0.08);
  border-color: rgba(46, 110, 98, 0.2);
}

.qs-airport-modal__recent-chip:focus-visible {
  outline: 3px solid var(--border-focus, #8c7558);
  outline-offset: 1px;
}

/* ── Airport list items ── */
.qs-airport-modal .airport-list {
  display: grid;
  grid-gap: 2px;
  gap: 2px;
  overflow-y: auto;
  flex: 1 1 auto;
  min-height: 0;
  padding-right: 4px;
}

.qs-airport-modal__airport-item {
  display: flex;
  align-items: center;
  gap: 8px;
  text-align: left;
  border: 1px solid transparent;
  background: transparent;
  padding: 10px 12px;
  font-size: 0.92rem;
  color: var(--ink, #1f1d1a);
  cursor: pointer;
  border-radius: 10px;
  transition: background 100ms, border-color 100ms, transform 80ms;
}

.qs-airport-modal__airport-item:hover {
  background: rgba(46, 110, 98, 0.05);
  border-color: rgba(46, 110, 98, 0.12);
  transform: translateX(2px);
}

.qs-airport-modal__airport-item:focus-visible {
  outline: 3px solid var(--border-focus, #8c7558);
  outline-offset: 1px;
}

.qs-airport-modal__airport-name {
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.qs-airport-modal__airport-iata {
  flex: 0 0 auto;
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  color: var(--accent-2, #2e6e62);
  padding: 2px 8px;
  border-radius: 6px;
  background: rgba(46, 110, 98, 0.08);
}

/* ── Empty state ── */
.qs-airport-modal__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 40px 20px;
  text-align: center;
  color: var(--ink-muted, #8c7d6d);
}

.qs-airport-modal__empty p {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.5;
}

/* ── Responsive: mobile stacks vertically ── */
@media (max-width: 900px) {
  .airport-modal-overlay {
    align-items: flex-start;
    padding: 1rem;
  }

  .qs-airport-modal__body {
    grid-template-columns: 1fr;
  }

  .qs-airport-modal__countries {
    border-right: none;
    border-bottom: 1px solid rgba(205, 191, 170, 0.22);
    padding-bottom: 14px;
    max-height: 260px;
  }

  .qs-airport-modal .airport-country-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .qs-airport-modal__airports {
    padding-left: 20px;
  }

  .qs-airport-modal__close {
    top: 10px;
    right: 10px;
  }
}

.qs-airport-modal__countries button,
.qs-airport-modal__countries a,
.qs-airport-modal__countries [role="button"] {
  padding-top: 8px;
  padding-bottom: 8px;
}

.private-nav {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: thin;
}

.private-nav-link {
  flex: 0 0 auto;
  font-size: 0.86rem;
  font-weight: 600;
  line-height: 1.2;
  padding: 7px 11px;
  border-radius: 999px;
  color: var(--text-secondary);
  border: 1px solid var(--border-default);
  background: color-mix(in srgb, var(--surface) 86%, var(--panel-bg));
  text-decoration: none;
  white-space: nowrap;
}

.private-nav-link:hover {
  border-color: color-mix(in srgb, var(--accent) 35%, var(--border-default));
  background: color-mix(in srgb, var(--surface-2) 78%, var(--panel-bg));
}

.private-nav-link:focus-visible {
  outline: 3px solid var(--border-focus);
  outline-offset: 2px;
}

.private-nav-link.is-active {
  color: var(--text-primary);
  border-color: color-mix(in srgb, var(--color-accent) 52%, transparent);
  background: color-mix(in srgb, var(--accent) 14%, var(--surface));
  box-shadow: 0 8px 14px rgba(31, 29, 26, 0.08);
}

.account-profile-shell {
  display: grid;
  grid-gap: 1.25rem;
  gap: 1.25rem;
}

.account-profile-topbar {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-gap: 1rem;
  gap: 1rem;
  align-items: end;
}

.account-profile-heading {
  display: grid;
  grid-gap: 0.28rem;
  gap: 0.28rem;
}

.account-profile-heading-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  align-items: center;
  justify-content: space-between;
}

.account-profile-heading h1 {
  margin: 0;
  font-family: "Playfair Display", serif;
  font-size: clamp(2.2rem, 4.6vw, 3.5rem);
  line-height: 0.94;
  letter-spacing: -0.04em;
}

.account-profile-heading p {
  margin: 0;
  max-width: 44rem;
  color: var(--ink-muted);
  font-size: 0.98rem;
}

.account-profile-navlink {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  width: -moz-fit-content;
  width: fit-content;
  border: 1px solid color-mix(in srgb, var(--border) 68%, white 32%);
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface) 84%, white 16%);
  color: var(--ink);
  padding: 0.62rem 0.9rem;
  font-weight: 700;
  box-shadow: 0 10px 24px rgba(32, 28, 21, 0.08);
}

.account-profile-navlink svg {
  flex: 0 0 auto;
}

.account-profile-navlink:active {
  transform: translateY(1px);
}

.account-profile-glass {
  position: relative;
  overflow: hidden;
  border-radius: 26px;
  border: 1px solid color-mix(in srgb, var(--border) 72%, white 28%);
  background:
    linear-gradient(145deg, rgba(255, 252, 247, 0.84), rgba(248, 240, 231, 0.7)),
    color-mix(in srgb, var(--panel-bg) 90%, transparent);
  box-shadow:
    0 28px 60px rgba(32, 28, 21, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.72);
  -webkit-backdrop-filter: blur(22px);
          backdrop-filter: blur(22px);
}

.account-profile-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(280px, 0.82fr);
  grid-gap: 1rem;
  gap: 1rem;
  padding: 1rem;
}

.account-profile-main,
.account-profile-side {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
}

.account-profile-hero,
.account-profile-panel {
  position: relative;
  border-radius: 20px;
  border: 1px solid color-mix(in srgb, var(--border) 66%, white 34%);
  background:
    linear-gradient(155deg, rgba(255, 255, 255, 0.52), rgba(255, 247, 238, 0.22)),
    color-mix(in srgb, var(--surface) 88%, transparent);
  box-shadow:
    0 18px 40px rgba(32, 28, 21, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.64);
  -webkit-backdrop-filter: blur(18px);
          backdrop-filter: blur(18px);
}

.account-profile-hero {
  padding: 1.1rem;
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
  background:
    radial-gradient(circle at top left, rgba(217, 93, 57, 0.14), transparent 36%),
    radial-gradient(circle at bottom right, rgba(46, 110, 98, 0.14), transparent 34%),
    linear-gradient(155deg, rgba(255, 255, 255, 0.54), rgba(255, 247, 238, 0.22)),
    color-mix(in srgb, var(--surface) 88%, transparent);
}

.account-profile-hero-copy,
.account-profile-panel-header,
.account-profile-loading-copy {
  display: grid;
  grid-gap: 0.35rem;
  gap: 0.35rem;
}

.account-profile-panel-title {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-gap: 0.7rem;
  gap: 0.7rem;
  align-items: center;
}

.account-profile-panel-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--border) 68%, white 32%);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.74), rgba(255, 246, 238, 0.42));
  color: var(--ink);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.account-profile-panel-icon-danger {
  color: #8d301e;
  background: linear-gradient(135deg, rgba(217, 93, 57, 0.2), rgba(255, 255, 255, 0.4));
  border-color: rgba(217, 93, 57, 0.3);
}

.account-profile-hero-copy h2,
.account-profile-panel-header h3,
.account-profile-loading-copy h2 {
  margin: 0;
  font-family: "Playfair Display", serif;
  font-size: clamp(1.28rem, 2.1vw, 1.72rem);
  line-height: 1.12;
}

.account-profile-hero-copy p,
.account-profile-panel-header p,
.account-profile-loading-copy p,
.account-profile-danger-copy,
.account-profile-empty {
  margin: 0;
  color: var(--ink-muted);
  line-height: 1.6;
}

.account-profile-kicker {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-muted);
}

.account-profile-kicker::before {
  content: "";
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent-2) 55%, white 45%));
  box-shadow: 0 0 0 5px rgba(217, 93, 57, 0.12);
}

.account-profile-status {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  justify-content: center;
  min-height: 32px;
  padding: 0.38rem 0.74rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--border) 72%, white 28%);
  background: rgba(255, 255, 255, 0.55);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.account-profile-status svg {
  flex: 0 0 auto;
}

.account-profile-status.status-ok {
  background: color-mix(in srgb, var(--accent-2) 16%, white 84%);
  border-color: color-mix(in srgb, var(--accent-2) 38%, white 62%);
  color: color-mix(in srgb, var(--accent-2) 74%, black 26%);
}

.account-profile-status.status-degraded {
  background: color-mix(in srgb, var(--accent) 14%, white 86%);
  border-color: color-mix(in srgb, var(--accent) 34%, white 66%);
  color: color-mix(in srgb, var(--accent) 72%, black 28%);
}

.account-profile-status.account-profile-status-neutral {
  background: rgba(255, 255, 255, 0.5);
  border-color: color-mix(in srgb, var(--border) 68%, white 32%);
  color: var(--ink);
}

.account-profile-identity {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-gap: 0.85rem;
  gap: 0.85rem;
  align-items: center;
}

.account-profile-avatar-shell {
  position: relative;
  width: 92px;
  height: 92px;
  padding: 5px;
  border-radius: 24px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0.18)),
    rgba(255, 255, 255, 0.22);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.75),
    0 20px 36px rgba(32, 28, 21, 0.14);
}

.account-profile-avatar-badge {
  position: absolute;
  right: -4px;
  bottom: -4px;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--border) 66%, white 34%);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(255, 246, 238, 0.86));
  color: var(--ink);
  box-shadow: 0 12px 22px rgba(32, 28, 21, 0.12);
}

.account-profile-avatar {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  border-radius: 20px;
  object-fit: cover;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--surface-3) 88%, white 12%), color-mix(in srgb, var(--surface) 78%, var(--accent) 22%));
}

.account-profile-avatar-fallback {
  color: var(--ink);
  font-size: 1.45rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.account-profile-meta {
  display: grid;
  grid-gap: 0.7rem;
  gap: 0.7rem;
}

.account-profile-meta-pillset {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  justify-content: flex-end;
}

.account-profile-banner {
  display: grid;
  grid-gap: 0.28rem;
  gap: 0.28rem;
  padding: 0.78rem 0.85rem;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--border) 62%, white 38%);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.48), rgba(255, 248, 241, 0.18)),
    color-mix(in srgb, var(--surface-3) 76%, white 24%);
}

.account-profile-banner p {
  margin: 0;
  font-size: 0.83rem;
  line-height: 1.45;
  color: var(--ink-muted);
}

.account-profile-banner-label {
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink);
}

.account-profile-meta-line {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
  justify-content: space-between;
}

.account-profile-meta-line strong {
  font-size: 0.96rem;
  overflow-wrap: anywhere;
}

.account-profile-meta-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-gap: 0.6rem;
  gap: 0.6rem;
}

.account-profile-meta-card,
.account-profile-session-row {
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--border) 70%, white 30%);
  background:
    linear-gradient(160deg, rgba(255, 255, 255, 0.5), rgba(255, 249, 241, 0.18)),
    color-mix(in srgb, var(--surface) 86%, transparent);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

.account-profile-meta-card {
  padding: 0.65rem 0.75rem;
  display: grid;
  grid-gap: 0.22rem;
  gap: 0.22rem;
}

.account-profile-meta-card span,
.account-profile-session-copy span {
  color: var(--ink-muted);
  font-size: 0.76rem;
}

.account-profile-meta-card strong {
  font-size: 0.92rem;
}

.account-profile-panel {
  padding: 0.95rem;
  display: grid;
  grid-gap: 0.85rem;
  gap: 0.85rem;
}

.account-profile-panel-soft {
  background:
    linear-gradient(155deg, rgba(255, 255, 255, 0.46), rgba(255, 247, 238, 0.18)),
    color-mix(in srgb, var(--surface) 82%, transparent);
}

.account-profile-danger {
  background:
    radial-gradient(circle at top right, rgba(217, 93, 57, 0.14), transparent 42%),
    linear-gradient(155deg, rgba(255, 255, 255, 0.42), rgba(255, 247, 238, 0.16)),
    color-mix(in srgb, var(--surface) 82%, transparent);
}

.account-profile-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 0.8rem;
  gap: 0.8rem;
}

.account-profile-field {
  display: grid;
  grid-gap: 0.35rem;
  gap: 0.35rem;
  font-size: 0.86rem;
  font-weight: 600;
  color: var(--ink);
}

.account-profile-field-head {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
}

.account-profile-field-icon {
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.54);
  border: 1px solid color-mix(in srgb, var(--border) 70%, white 30%);
  color: var(--ink-muted);
}

.account-profile-field input {
  width: 100%;
  min-height: 44px;
  padding: 0.7rem 0.85rem;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--border) 78%, white 22%);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(255, 250, 244, 0.66)),
    var(--input-bg);
  color: var(--text-primary);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.78),
    0 10px 20px rgba(32, 28, 21, 0.06);
}

.account-profile-field input:focus-visible {
  outline: 3px solid rgba(217, 93, 57, 0.18);
  border-color: var(--border-focus);
}

.account-profile-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}

.account-profile-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  min-height: 42px;
  border-radius: 999px;
  padding: 0.72rem 1rem;
  border: 1px solid transparent;
  font-weight: 700;
  letter-spacing: 0.01em;
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    background-color 0.18s ease,
    border-color 0.18s ease;
}

.account-profile-button:active {
  transform: translateY(1px);
}

.account-profile-button:disabled {
  opacity: 0.58;
  cursor: not-allowed;
}

.account-profile-button-primary {
  color: var(--accent-ink);
  background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 92%, white 8%), color-mix(in srgb, var(--accent) 68%, var(--accent-2) 32%));
  box-shadow: 0 16px 30px rgba(217, 93, 57, 0.22);
}

.account-profile-button-secondary {
  color: var(--ink);
  background: rgba(255, 255, 255, 0.5);
  border-color: color-mix(in srgb, var(--border) 68%, white 32%);
  box-shadow: 0 10px 20px rgba(32, 28, 21, 0.08);
}

.account-profile-button-danger {
  color: #7c2617;
  background: linear-gradient(135deg, rgba(217, 93, 57, 0.18), rgba(255, 255, 255, 0.4));
  border-color: rgba(217, 93, 57, 0.36);
  box-shadow: 0 12px 24px rgba(217, 93, 57, 0.12);
}

.account-profile-form .account-profile-actions {
  grid-column: 1 / -1;
  padding-top: 0.2rem;
}

.account-profile-session-list {
  display: grid;
  grid-gap: 0.55rem;
  gap: 0.55rem;
}

.account-profile-session-row {
  padding: 0.7rem 0.78rem;
  display: flex;
  gap: 0.6rem;
  align-items: flex-start;
  justify-content: space-between;
}

.account-profile-session-copy {
  display: grid;
  grid-gap: 0.2rem;
  gap: 0.2rem;
}

.account-profile-session-label {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
}

.account-profile-session-icon {
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.5);
  border: 1px solid color-mix(in srgb, var(--border) 68%, white 32%);
  color: var(--ink-muted);
}

.account-profile-session-copy p {
  margin: 0;
  color: var(--ink-muted);
  font-size: 0.8rem;
  line-height: 1.35;
}

.account-profile-loading {
  padding: 1.2rem;
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
  min-height: 280px;
  align-items: center;
}

.account-profile-delete-modal {
  background:
    radial-gradient(circle at top right, rgba(217, 93, 57, 0.12), transparent 38%),
    linear-gradient(180deg, rgba(255, 252, 247, 0.96), rgba(249, 241, 232, 0.96));
  border: 1px solid color-mix(in srgb, var(--border) 72%, white 28%);
  box-shadow: 0 28px 56px rgba(32, 28, 21, 0.28);
}

.account-profile-orb {
  position: absolute;
  border-radius: 999px;
  filter: blur(18px);
  opacity: 0.7;
  pointer-events: none;
}

.account-profile-orb-primary {
  top: -56px;
  right: 10%;
  width: 220px;
  height: 220px;
  background: rgba(217, 93, 57, 0.16);
}

.account-profile-orb-secondary {
  bottom: -72px;
  left: 8%;
  width: 200px;
  height: 200px;
  background: rgba(46, 110, 98, 0.14);
}

:root[data-theme="dark"] .account-profile-glass {
  border-color: rgba(94, 109, 101, 0.7);
  background:
    linear-gradient(145deg, rgba(23, 30, 27, 0.84), rgba(16, 21, 19, 0.74)),
    color-mix(in srgb, var(--panel-bg) 82%, transparent);
  box-shadow:
    0 30px 64px rgba(0, 0, 0, 0.46),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

:root[data-theme="dark"] .account-profile-hero,
:root[data-theme="dark"] .account-profile-panel,
:root[data-theme="dark"] .account-profile-meta-card,
:root[data-theme="dark"] .account-profile-session-row,
:root[data-theme="dark"] .account-profile-delete-modal {
  border-color: rgba(95, 114, 104, 0.65);
  background:
    linear-gradient(155deg, rgba(255, 255, 255, 0.04), rgba(0, 0, 0, 0.14)),
    color-mix(in srgb, var(--surface) 76%, transparent);
  box-shadow:
    0 18px 38px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

:root[data-theme="dark"] .account-profile-field input {
  background:
    linear-gradient(180deg, rgba(21, 28, 26, 0.92), rgba(17, 23, 21, 0.84)),
    var(--input-bg);
  border-color: rgba(95, 114, 104, 0.7);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 12px 24px rgba(0, 0, 0, 0.2);
}

:root[data-theme="dark"] .account-profile-kicker::before {
  box-shadow: 0 0 0 5px rgba(224, 123, 86, 0.16);
}

:root[data-theme="dark"] .account-profile-navlink,
:root[data-theme="dark"] .account-profile-status,
:root[data-theme="dark"] .account-profile-banner,
:root[data-theme="dark"] .account-profile-button-secondary {
  border-color: rgba(95, 114, 104, 0.65);
  background: rgba(255, 255, 255, 0.04);
}

:root[data-theme="dark"] .account-profile-avatar-badge,
:root[data-theme="dark"] .account-profile-panel-icon,
:root[data-theme="dark"] .account-profile-field-icon,
:root[data-theme="dark"] .account-profile-session-icon {
  border-color: rgba(95, 114, 104, 0.65);
  background: rgba(255, 255, 255, 0.05);
}

:root[data-theme="dark"] .account-profile-button-danger {
  color: #f2c0b5;
  border-color: rgba(224, 123, 86, 0.38);
  background: rgba(224, 123, 86, 0.14);
}

@media (max-width: 980px) {
  .account-profile-topbar {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .account-profile-grid {
    grid-template-columns: 1fr;
  }

  .account-profile-side {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
  }
}

@media (max-width: 760px) {
  .account-profile-grid {
    padding: 0.8rem;
  }

  .account-profile-heading h1 {
    font-size: clamp(1.9rem, 8vw, 2.5rem);
  }

  .account-profile-hero,
  .account-profile-panel,
  .account-profile-loading {
    padding: 0.9rem;
  }

  .account-profile-identity {
    grid-template-columns: 1fr;
  }

  .account-profile-meta-grid,
  .account-profile-form,
  .account-profile-side {
    grid-template-columns: 1fr;
  }

  .account-profile-avatar-shell {
    width: 82px;
    height: 82px;
  }

  .account-profile-session-row,
  .account-profile-meta-line,
  .account-profile-heading-row {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (prefers-reduced-motion: reduce) {
  .account-profile-glass,
  .account-profile-hero,
  .account-profile-panel,
  .account-profile-field input {
    transition: none !important;
  }
}

/* /quick-search polish pass: restore Viru's editorial warmth without changing behavior. */
.quick-search-shell {
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}

.quick-search-shell .btn-primary,
.quick-search-shell .btn-search,
.quick-search-shell .btn-ghost,
.quick-search-shell .qs-chip,
.quick-search-shell .qs-flex-preset,
.quick-search-shell .qs-flex-stepper-btn,
.quick-search-shell .qs-row-menu-item {
  min-height: 40px;
  transition-property: transform, border-color, background-color, color, box-shadow;
  transition-duration: 160ms;
  transition-timing-function: cubic-bezier(0.2, 0, 0, 1);
}

.quick-search-shell .btn-primary:active,
.quick-search-shell .btn-search:active,
.quick-search-shell .btn-ghost:active,
.quick-search-shell .qs-chip:active,
.quick-search-shell .qs-flex-preset:active,
.quick-search-shell .qs-flex-stepper-btn:active {
  transform: scale(0.96);
}

.quick-search-shell h1,
.quick-search-shell h2,
.quick-search-shell h3,
.qs-command-stage__status-copy strong,
.qs-results-stagehead__copy h2 {
  text-wrap: balance;
}

.quick-search-shell p,
.qs-command-stage__status-copy p,
.qs-results-stagehead__copy p {
  text-wrap: pretty;
}

.qs-inline-icon {
  width: 1rem;
  height: 1rem;
  flex: 0 0 auto;
}

.qs-command-stage__intro,
.qs-command-stage__status,
.qs-results-panel {
  min-width: 0;
  border-color: color-mix(in srgb, var(--border) 74%, white 26%);
  background:
    radial-gradient(circle at top right, rgba(217, 93, 57, 0.1), transparent 30%),
    radial-gradient(circle at left center, rgba(46, 110, 98, 0.07), transparent 28%),
    linear-gradient(180deg, color-mix(in srgb, var(--surface) 96%, white 4%), color-mix(in srgb, var(--surface-2) 68%, var(--surface) 32%));
  box-shadow:
    0 24px 48px rgba(32, 28, 21, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.64);
}

.qs-command-stage,
.qs-command-stage__top,
.quick-search-panel,
.qs-workspace,
.qs-workspace-grid,
.qs-results-panel,
.qs-context-rail {
  min-width: 0;
}

.qs-command-stage__eyebrow,
.qs-results-stagehead__eyebrow,
.qs-command-stage__metric span,
.qs-workspace-hint,
.qs-result-meta,
.qs-result-price,
.qs-context-applied,
.qs-warning,
.qs-warning-warm,
.qs-explain-grid p,
.qs-flex-helper,
.qs-empty-causes {
  color: var(--ink-muted);
}

.qs-command-stage__status-copy strong,
.qs-command-stage__metric strong,
.qs-results-stagehead__copy h2,
.qs-context-applied strong,
.qs-workspace,
.qs-result-route strong,
.qs-result-price strong {
  color: var(--ink);
}

.qs-command-stage__metric strong,
.qs-results-summary,
.qs-result-price,
.qs-info-count,
.qs-warning-grouped-count,
.qs-warning-group-chip,
.qs-flex-stepper-value strong {
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

.qs-command-stage__status-badge,
.qs-command-stage__snapshot > span,
.qs-command-stage__signal,
.qs-hero-chip,
.qs-summary-chip {
  border-color: color-mix(in srgb, var(--border) 70%, white 30%);
  background: color-mix(in srgb, var(--surface) 84%, white 16%);
  color: var(--ink);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.52);
}

.qs-command-stage__status-badge-ready,
.qs-command-stage__status-ready .qs-command-stage__metric strong {
  color: color-mix(in srgb, var(--accent-2) 76%, black 24%);
}

.qs-command-stage__status-badge-active {
  border-color: color-mix(in srgb, var(--accent-2) 34%, var(--border));
  background: color-mix(in srgb, var(--accent-2) 14%, var(--surface));
  color: color-mix(in srgb, var(--accent-2) 78%, black 22%);
}

.qs-command-stage__status-badge-warning,
.qs-hero-chip-warning,
.qs-degraded-chip {
  border-color: var(--state-warning-border);
  background: var(--state-warning-bg);
  color: var(--state-warning-text);
}

.qs-command-stage__status-badge-alert,
.qs-command-stage__signal-critical {
  border-color: var(--state-error-border);
  background: var(--state-error-bg);
  color: var(--state-error-text);
}

.qs-hero-chip-accent,
.qs-command-stage__signal-pending,
.qs-results-stagehead__chip-warning {
  border-color: color-mix(in srgb, var(--accent) 30%, var(--border));
  background: color-mix(in srgb, var(--accent) 12%, var(--surface));
  color: color-mix(in srgb, var(--accent) 76%, black 24%);
}

.qs-command-stage__metric,
.qs-filter-group,
.qs-filter-accordion,
.qs-flex-panel,
.qs-search-summary-compact,
.qs-info-stack {
  border-color: color-mix(in srgb, var(--border) 72%, white 28%);
  background: color-mix(in srgb, var(--surface) 88%, white 12%);
  box-shadow:
    0 14px 28px rgba(32, 28, 21, 0.07),
    inset 0 1px 0 rgba(255, 255, 255, 0.56);
}

.qs-filters-panel {
  background:
    radial-gradient(circle at top right, rgba(217, 93, 57, 0.08), transparent 28%),
    linear-gradient(180deg, color-mix(in srgb, var(--surface) 96%, white 4%), color-mix(in srgb, var(--surface-2) 72%, var(--surface) 28%));
  box-shadow: -22px 0 48px rgba(32, 28, 21, 0.18);
  transition: transform 0.24s cubic-bezier(0.2, 0, 0, 1);
}

.qs-filters-panel.is-open {
  transform: translateX(0);
}

.qs-filters-backdrop {
  background: color-mix(in srgb, var(--ink) 42%, transparent);
}

.qs-filters-header,
.qs-filter-actions {
  background: color-mix(in srgb, var(--surface) 94%, var(--surface-2));
}

.qs-results-stagehead,
.qs-results-toolbar,
.qs-info-body,
.qs-warning-grouped-details {
  border-color: color-mix(in srgb, var(--border) 72%, transparent);
}

.qs-results-toolbar {
  background: color-mix(in srgb, var(--surface) 94%, transparent);
}

.qs-result-row {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(210px, 0.65fr);
  grid-gap: 1rem;
  gap: 1rem;
  align-items: start;
  border-color: color-mix(in srgb, var(--border) 82%, white 18%);
  border-radius: 18px;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--surface) 94%, white 6%), color-mix(in srgb, var(--surface-2) 44%, var(--surface) 56%));
  box-shadow:
    0 12px 26px rgba(32, 28, 21, 0.07),
    inset 0 1px 0 rgba(255, 255, 255, 0.56);
  transition-property: transform, border-color, box-shadow;
  transition-duration: 160ms;
  transition-timing-function: cubic-bezier(0.2, 0, 0, 1);
}

.qs-result-row:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--accent) 26%, var(--border));
  box-shadow:
    0 18px 34px rgba(32, 28, 21, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.62);
}

.qs-result-main {
  display: grid;
  grid-gap: 0.42rem;
  gap: 0.42rem;
  min-width: 0;
}

.qs-result-route,
.qs-result-stats,
.qs-result-badges,
.qs-result-buttons {
  display: flex;
  flex-wrap: wrap;
}

.qs-result-route {
  align-items: center;
  gap: 0.55rem;
}

.qs-result-route strong {
  font-size: 1.05rem;
}

.qs-result-stats,
.qs-result-badges {
  gap: 0.4rem 0.6rem;
}

.qs-result-stats {
  font-size: 0.85rem;
  color: var(--ink-muted);
}

.qs-result-actions {
  display: grid;
  grid-gap: 0.7rem;
  gap: 0.7rem;
  justify-items: end;
  min-width: 0;
}

.qs-result-price {
  display: grid;
  justify-items: end;
  grid-gap: 0.15rem;
  gap: 0.15rem;
  text-align: right;
}

.qs-result-price strong {
  font-size: 1.28rem;
}

.qs-result-buttons {
  justify-content: flex-end;
  gap: 0.45rem;
}

.qs-row-menu-wrap {
  position: relative;
}

.qs-row-menu-trigger {
  width: 40px;
  min-width: 40px;
  min-height: 40px;
  padding: 0;
  justify-content: center;
}

.qs-row-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 0.4rem);
  z-index: 30;
  min-width: 190px;
  display: grid;
  grid-gap: 0.25rem;
  gap: 0.25rem;
  padding: 0.38rem;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--border) 76%, white 24%);
  background: color-mix(in srgb, var(--surface) 94%, white 6%);
  box-shadow: 0 18px 36px rgba(32, 28, 21, 0.18);
}

.qs-row-menu-item {
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--ink);
  padding: 0.58rem 0.68rem;
  text-align: left;
  text-decoration: none;
  font: inherit;
  cursor: pointer;
}

.qs-row-menu-item:hover,
.qs-row-menu-item:focus-visible {
  background: color-mix(in srgb, var(--accent) 10%, var(--surface));
  outline: none;
}

.qs-result-details {
  grid-column: 1 / -1;
  border-top-color: color-mix(in srgb, var(--border) 82%, transparent);
}

.qs-state {
  border-color: color-mix(in srgb, var(--border) 76%, white 24%);
  background:
    radial-gradient(circle at top right, rgba(46, 110, 98, 0.08), transparent 28%),
    linear-gradient(180deg, color-mix(in srgb, var(--surface) 96%, white 4%), color-mix(in srgb, var(--surface-2) 58%, var(--surface) 42%));
  box-shadow: 0 14px 28px rgba(32, 28, 21, 0.08);
}

.qs-state h3 {
  font-family: "Playfair Display", serif;
  color: var(--ink);
}

.qs-state-rate,
.qs-state-empty {
  border-color: var(--state-warning-border);
  background:
    radial-gradient(circle at top right, color-mix(in srgb, var(--state-warning-bg) 72%, transparent), transparent 32%),
    linear-gradient(180deg, color-mix(in srgb, var(--state-warning-bg) 62%, var(--surface) 38%), var(--surface));
}

.qs-state-error {
  border-color: var(--state-error-border);
  background:
    radial-gradient(circle at top right, color-mix(in srgb, var(--state-error-bg) 70%, transparent), transparent 32%),
    linear-gradient(180deg, color-mix(in srgb, var(--state-error-bg) 62%, var(--surface) 38%), var(--surface));
}

.qs-skeleton-card {
  border-color: color-mix(in srgb, var(--border) 78%, white 22%);
  background: color-mix(in srgb, var(--surface) 88%, white 12%);
}

.qs-skeleton-row {
  background: linear-gradient(90deg, rgba(217, 205, 187, 0.28), rgba(255, 250, 244, 0.8), rgba(217, 205, 187, 0.28));
}

.qs-warning-grouped,
.qs-warning-grouped-neutral {
  border-color: color-mix(in srgb, var(--border) 78%, white 22%);
  background: color-mix(in srgb, var(--surface-2) 72%, var(--surface) 28%);
  color: var(--ink);
}

.qs-warning-grouped-critical {
  border-color: var(--state-error-border);
  background: var(--state-error-bg);
  color: var(--state-error-text);
}

.qs-warning-grouped-count,
.qs-info-count {
  border-color: color-mix(in srgb, var(--border) 78%, white 22%);
  background: color-mix(in srgb, var(--surface) 88%, white 12%);
  color: var(--ink);
}

.qs-warning-group-chip {
  border-color: color-mix(in srgb, var(--border) 76%, white 24%);
  background: var(--surface);
  color: var(--ink-muted);
}

:root[data-theme="dark"] .qs-command-stage__intro,
:root[data-theme="dark"] .qs-command-stage__status,
:root[data-theme="dark"] .qs-results-panel,
:root[data-theme="dark"] .qs-result-row,
:root[data-theme="dark"] .qs-flex-control,
:root[data-theme="dark"] .qs-filter-group,
:root[data-theme="dark"] .qs-filter-accordion,
:root[data-theme="dark"] .qs-flex-panel,
:root[data-theme="dark"] .qs-search-summary-compact,
:root[data-theme="dark"] .qs-info-stack,
:root[data-theme="dark"] .qs-filters-panel,
:root[data-theme="dark"] .qs-state,
:root[data-theme="dark"] .qs-row-menu {
  border-color: rgba(95, 114, 104, 0.66);
  background:
    radial-gradient(circle at top right, rgba(224, 123, 86, 0.08), transparent 30%),
    linear-gradient(180deg, color-mix(in srgb, var(--surface) 88%, white 4%), color-mix(in srgb, var(--surface-2) 82%, black 18%));
  box-shadow:
    0 22px 44px rgba(0, 0, 0, 0.34),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

:root[data-theme="dark"] .qs-command-stage__status-badge,
:root[data-theme="dark"] .qs-command-stage__snapshot > span,
:root[data-theme="dark"] .qs-command-stage__signal,
:root[data-theme="dark"] .qs-hero-chip,
:root[data-theme="dark"] .qs-summary-chip,
:root[data-theme="dark"] .qs-warning-group-chip,
:root[data-theme="dark"] .qs-warning-grouped-count,
:root[data-theme="dark"] .qs-info-count {
  border-color: rgba(95, 114, 104, 0.66);
  background: rgba(255, 255, 255, 0.05);
  color: var(--ink);
  box-shadow: none;
}

:root[data-theme="dark"] .qs-setup-critical-filters {
  background: linear-gradient(180deg, color-mix(in srgb, var(--color-surface) 90%, var(--color-surface-elevated) 10%), color-mix(in srgb, var(--color-surface-elevated) 86%, var(--color-surface-muted) 14%));
}

/* Final dark pass: quick-search central form must be fully dark-native. */
:root[data-theme="dark"] .qs-flex-summary {
  background: color-mix(in srgb, var(--surface) 88%, var(--surface-2) 12%);
  border-color: color-mix(in srgb, var(--border) 82%, var(--accent) 18%);
  color: var(--color-text-secondary);
}

:root[data-theme="dark"] .qs-flex-preset {
  border-color: color-mix(in srgb, var(--color-border) 86%, var(--color-border-strong) 14%);
  background: color-mix(in srgb, var(--color-surface) 84%, var(--color-surface-elevated) 16%);
  color: var(--color-text-primary);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

:root[data-theme="dark"] .qs-flex-preset:hover {
  border-color: color-mix(in srgb, var(--color-accent) 38%, var(--color-border));
  background: color-mix(in srgb, var(--color-surface-elevated) 84%, var(--color-surface) 16%);
}

:root[data-theme="dark"] .qs-flex-preset.is-active {
  border-color: color-mix(in srgb, var(--color-accent) 48%, var(--color-border));
  background: color-mix(in srgb, var(--color-accent) 18%, var(--color-surface));
  color: var(--color-text-primary);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.34);
}

:root[data-theme="dark"] .qs-flex-stepper {
  border-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
  background: color-mix(in srgb, var(--color-input-bg) 86%, var(--color-surface) 14%);
}

:root[data-theme="dark"] .qs-flex-stepper-btn {
  background: color-mix(in srgb, var(--color-surface) 76%, var(--color-surface-elevated) 24%);
  color: var(--color-text-primary);
}

:root[data-theme="dark"] .qs-flex-stepper-btn:disabled {
  opacity: 0.55;
  color: var(--color-text-disabled);
  background: color-mix(in srgb, var(--color-surface) 88%, var(--color-surface-muted) 12%);
}

:root[data-theme="dark"] .qs-date-trigger {
  border-color: color-mix(in srgb, var(--color-input-border) 86%, var(--color-border));
  background: color-mix(in srgb, var(--color-input-bg) 90%, var(--color-surface) 10%);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.34);
}

:root[data-theme="dark"] .qs-date-trigger__value {
  color: var(--color-text-primary);
}

:root[data-theme="dark"] .qs-date-trigger:not(.has-value) .qs-date-trigger__value {
  color: var(--color-input-placeholder);
}

:root[data-theme="dark"] .qs-date-inline-icon {
  background: color-mix(in srgb, var(--color-surface-elevated) 76%, var(--color-surface) 24%);
  border-color: color-mix(in srgb, var(--color-border) 82%, var(--color-border-strong) 18%);
  color: var(--color-text-secondary);
}

:root[data-theme="dark"] .qs-date-trigger__actions {
  border-left-color: color-mix(in srgb, var(--color-border) 84%, transparent);
}

:root[data-theme="dark"] .qs-date-trigger__caret {
  color: var(--color-text-secondary);
}

:root[data-theme="dark"] .qs-date-trigger__caret.is-open {
  color: color-mix(in srgb, var(--color-accent) 68%, var(--color-text-primary));
  background: color-mix(in srgb, var(--color-accent) 14%, var(--color-surface));
}

:root[data-theme="dark"] .qs-date-popover {
  border-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
  background:
    radial-gradient(circle at top right, rgba(224, 123, 86, 0.12), transparent 34%),
    radial-gradient(circle at left center, rgba(111, 178, 161, 0.1), transparent 30%),
    linear-gradient(180deg, color-mix(in srgb, var(--color-surface-elevated) 90%, var(--color-surface) 10%), color-mix(in srgb, var(--color-surface) 88%, var(--color-surface-muted) 12%));
  box-shadow: 0 30px 56px rgba(0, 0, 0, 0.58);
}

:root[data-theme="dark"] .qs-date-popover::before {
  border-left-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
  border-top-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
  background: color-mix(in srgb, var(--color-surface-elevated) 92%, var(--color-surface) 8%);
}

:root[data-theme="dark"] .qs-date-popover__header strong,
:root[data-theme="dark"] .qs-date-day,
:root[data-theme="dark"] .qs-date-popover__footer strong {
  color: var(--color-text-primary);
}

:root[data-theme="dark"] .qs-date-popover__eyebrow,
:root[data-theme="dark"] .qs-date-popover__weekdays span,
:root[data-theme="dark"] .qs-date-popover__footer-label {
  color: var(--color-text-secondary);
}

:root[data-theme="dark"] .qs-date-popover__hint-scope-badge {
  border-color: color-mix(in srgb, #2e6e62 55%, var(--color-border));
  background: color-mix(in srgb, #2e6e62 24%, var(--color-surface));
  color: color-mix(in srgb, var(--color-text-primary) 88%, #8de0cf 12%);
}

:root[data-theme="dark"] .qs-date-nav {
  border-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
  background: color-mix(in srgb, var(--color-surface) 84%, var(--color-surface-elevated) 16%);
  color: var(--color-text-secondary);
}

:root[data-theme="dark"] .qs-date-nav:hover {
  border-color: color-mix(in srgb, var(--color-accent) 36%, var(--color-border));
  background: color-mix(in srgb, var(--color-accent) 14%, var(--color-surface));
  color: var(--color-text-primary);
}

:root[data-theme="dark"] .qs-date-day:hover:not(.is-disabled) {
  border-color: color-mix(in srgb, var(--color-border-strong) 72%, var(--color-border));
  background: color-mix(in srgb, var(--color-surface-elevated) 80%, var(--color-surface) 20%);
  box-shadow: 0 10px 16px rgba(0, 0, 0, 0.32);
}

:root[data-theme="dark"] .qs-date-day.hint-low:not(.is-outside):not(.is-disabled):not(.is-selected) {
  background: color-mix(in srgb, #2e6e62 28%, var(--color-surface));
  border-color: color-mix(in srgb, #2e6e62 45%, var(--color-border));
}

:root[data-theme="dark"] .qs-date-day.hint-mid:not(.is-outside):not(.is-disabled):not(.is-selected) {
  background: color-mix(in srgb, #b45309 27%, var(--color-surface));
  border-color: color-mix(in srgb, #b45309 42%, var(--color-border));
}

:root[data-theme="dark"] .qs-date-day.hint-high:not(.is-outside):not(.is-disabled):not(.is-selected) {
  background: color-mix(in srgb, #b42318 24%, var(--color-surface));
  border-color: color-mix(in srgb, #b42318 40%, var(--color-border));
}

:root[data-theme="dark"] .qs-date-day.is-hints-loading:not(.is-outside):not(.is-disabled):not(.is-selected) {
  background-image: linear-gradient(
    110deg,
    color-mix(in srgb, var(--color-surface) 84%, transparent) 28%,
    color-mix(in srgb, var(--color-accent) 22%, var(--color-surface)) 48%,
    color-mix(in srgb, var(--color-surface) 84%, transparent) 68%
  );
}

:root[data-theme="dark"] .qs-date-day.is-outside {
  color: color-mix(in srgb, var(--color-text-muted) 76%, var(--color-surface-elevated));
}

:root[data-theme="dark"] .qs-date-day.is-today {
  border-color: color-mix(in srgb, var(--color-info-border) 70%, var(--color-border));
  color: var(--color-info-text);
}

:root[data-theme="dark"] .qs-date-day.is-selected {
  border-color: color-mix(in srgb, var(--color-accent) 54%, var(--color-border));
  background: color-mix(in srgb, var(--color-accent) 18%, var(--color-surface-elevated));
  color: var(--color-text-primary);
  box-shadow: 0 12px 20px rgba(0, 0, 0, 0.4);
}

:root[data-theme="dark"] .qs-date-day__no-price {
  color: color-mix(in srgb, var(--color-text-secondary) 85%, var(--color-text-primary) 15%);
}

:root[data-theme="dark"] .qs-date-day__no-price-tooltip {
  border-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
  background: color-mix(in srgb, var(--color-surface-elevated) 94%, var(--color-surface) 6%);
  color: var(--color-text-secondary);
  box-shadow: 0 12px 18px rgba(0, 0, 0, 0.38);
}

:root[data-theme="dark"] .qs-date-popover__footer {
  border-top-color: color-mix(in srgb, var(--color-border) 84%, transparent);
}

:root[data-theme="dark"] .qs-summary {
  border-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
  background: color-mix(in srgb, var(--color-surface) 88%, var(--color-surface-elevated) 12%);
  box-shadow: 0 16px 30px rgba(0, 0, 0, 0.4);
}

:root[data-theme="dark"] .qs-degraded-inline {
  color: var(--color-text-secondary);
}

:root[data-theme="dark"] .btn-search:disabled {
  color: var(--color-text-disabled);
  border-color: color-mix(in srgb, var(--color-border) 84%, var(--color-accent) 16%);
  background: color-mix(in srgb, var(--color-surface) 88%, var(--color-surface-muted) 12%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 8px 18px rgba(0, 0, 0, 0.28);
}

@media (max-width: 720px) {
  .qs-result-row {
    grid-template-columns: 1fr;
  }

  .qs-result-actions,
  .qs-result-price {
    justify-items: start;
    text-align: left;
  }

  .qs-result-buttons {
    justify-content: flex-start;
  }

  .qs-row-menu {
    left: 0;
    right: auto;
  }
}

.qs-filter-console {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
  border-radius: 24px;
  border-color: color-mix(in srgb, var(--border) 74%, white 26%);
  background:
    radial-gradient(circle at 8% 0%, rgba(46, 110, 98, 0.1), transparent 32%),
    linear-gradient(180deg, color-mix(in srgb, var(--surface) 96%, white 4%), color-mix(in srgb, var(--surface-2) 64%, var(--surface) 36%));
  box-shadow:
    0 12px 24px rgba(32, 28, 21, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.62);
}

.qs-filter-console-head,
.qs-filter-section-head,
.qs-filter-pending,
.qs-filter-actions {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
}

.qs-filter-console-head h3,
.qs-filter-section-head h3 {
  margin: 0;
  font-family: "Playfair Display", serif;
  color: var(--ink);
}

.qs-filter-console-head p,
.qs-filter-section-head p {
  margin: 0.25rem 0 0;
  color: var(--ink-muted);
  line-height: 1.45;
}

.qs-filter-eyebrow {
  display: inline-flex;
  margin-bottom: 0.22rem;
  color: var(--ink-muted);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.qs-filter-console-actions {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 0.5rem;
}

.qs-filter-section-actions {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 0.5rem;
}

.qs-filter-count,
.qs-filter-support {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--border) 74%, white 26%);
  background: color-mix(in srgb, var(--surface) 86%, white 14%);
  color: var(--ink);
  padding: 0.34rem 0.62rem;
  font-size: 0.76rem;
  font-weight: 800;
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}

.qs-filter-support {
  min-height: 26px;
  padding: 0.24rem 0.54rem;
  font-size: 0.7rem;
}

.qs-filter-support-live {
  border-color: color-mix(in srgb, var(--accent-2) 36%, var(--border));
  background: color-mix(in srgb, var(--accent-2) 12%, var(--surface));
}

.qs-filter-support-partial {
  border-color: var(--state-warning-border);
  background: var(--state-warning-bg);
}

.qs-filter-console-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-gap: 0.72rem;
  gap: 0.72rem;
}

.qs-filter-console-card,
.qs-filter-preset {
  display: grid;
  grid-gap: 0.28rem;
  gap: 0.28rem;
  min-width: 0;
  border: 1px solid color-mix(in srgb, var(--border) 76%, white 24%);
  border-radius: 16px;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--surface) 92%, white 8%), color-mix(in srgb, var(--surface-2) 42%, var(--surface) 58%));
  color: var(--ink);
  text-align: left;
  padding: 0.78rem 0.82rem;
  cursor: pointer;
  box-shadow:
    0 6px 14px rgba(32, 28, 21, 0.05),
    inset 0 1px 0 rgba(255, 255, 255, 0.56);
  transition: transform 0.2s cubic-bezier(0.2, 0, 0, 1), box-shadow 0.2s cubic-bezier(0.2, 0, 0, 1), border-color 0.2s ease;
}

.qs-filter-console-card:hover,
.qs-filter-console-card:focus-visible,
.qs-filter-preset:hover,
.qs-filter-preset:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 34%, var(--border));
  outline: none;
  transform: translateY(-2px);
  box-shadow:
    0 12px 24px rgba(47, 40, 24, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

.qs-filter-console-card:active,
.qs-filter-preset:active {
  transform: translateY(0) scale(0.98);
  box-shadow:
    0 4px 10px rgba(47, 40, 24, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.4);
}

.qs-filter-console-card span,
.qs-filter-preset span {
  color: var(--ink-muted);
  font-size: 0.78rem;
  line-height: 1.35;
}

.qs-filter-console-card strong,
.qs-filter-preset strong {
  color: var(--ink);
  font-size: 0.96rem;
  line-height: 1.18;
}

.qs-filter-console-card .qs-filter-support {
  justify-self: start;
  margin-top: 0.1rem;
}

.qs-filter-pending {
  align-items: center;
  border: 1px solid color-mix(in srgb, var(--accent) 40%, var(--border));
  border-radius: 18px;
  background:
    radial-gradient(circle at 8% 12%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 52%),
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--accent) 16%, var(--surface)),
      color-mix(in srgb, var(--accent) 8%, var(--surface))
    );
  box-shadow:
    0 12px 24px rgba(47, 31, 20, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.52);
  padding: 0.92rem 0.96rem;
}

.qs-filter-pending div {
  display: grid;
  grid-gap: 0.2rem;
  gap: 0.2rem;
}

.qs-filter-pending strong {
  color: color-mix(in srgb, var(--ink) 88%, #55250e);
  letter-spacing: 0.01em;
}

.qs-filter-pending span {
  color: color-mix(in srgb, var(--ink-muted) 82%, #7d3d22);
  font-size: 0.88rem;
}

.qs-filter-pending .qs-filter-pending-cta {
  min-height: 2.35rem;
  padding-inline: 1.05rem;
  border: 1px solid color-mix(in srgb, var(--accent) 52%, transparent);
  box-shadow:
    0 10px 18px color-mix(in srgb, var(--accent) 26%, transparent),
    inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

.qs-filter-console-chips {
  margin: 0;
  border-top: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
  padding-top: 0.8rem;
}

.qs-filter-console-empty {
  margin: 0;
  border-top: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
  padding-top: 0.8rem;
}

.qs-filter-mode-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.qs-filter-mode-chip {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0.24rem 0.62rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--border) 74%, white 26%);
  background: color-mix(in srgb, var(--surface) 90%, white 10%);
  color: var(--ink-muted);
  font-size: 0.74rem;
  font-weight: 700;
}

.qs-filter-console .qs-check-ui,
.qs-filter-console .qs-check-ui svg,
.qs-filter-console-drawer .qs-check-ui,
.qs-filter-console-drawer .qs-check-ui svg {
  pointer-events: none;
}

.qs-filter-console-drawer {
  display: grid;
  grid-gap: 0.95rem;
  gap: 0.95rem;
  padding: 1rem;
  padding-bottom: 1.4rem;
  overflow: visible;
}

.qs-filters-panel {
  box-sizing: border-box;
  width: min(540px, 100vw);
  max-width: 100vw;
}

.qs-filters-header {
  padding: 1rem 1rem 0.7rem;
}

.qs-filter-actions {
  position: -webkit-sticky;
  position: sticky;
  bottom: 0;
  z-index: 2;
  padding: 0.8rem 1rem max(0.95rem, env(safe-area-inset-bottom, 0px));
  margin: 0;
  border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
}

.qs-filter-console-drawer .field,
.qs-filter-console-drawer .qs-check {
  min-width: 0;
}

.qs-filter-console-drawer .field > span,
.qs-filter-console-drawer .field > label {
  min-width: 0;
}

.qs-filter-console-drawer .qs-input,
.qs-filter-console-drawer select.qs-input,
.qs-filter-console-drawer input.qs-input {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: 0.62rem 0.78rem;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.qs-filter-console-drawer select.qs-input {
  text-overflow: ellipsis;
  white-space: nowrap;
}

.qs-filter-console-drawer .qs-range {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(88px, 124px);
  grid-gap: 0.6rem;
  gap: 0.6rem;
  align-items: center;
}

.qs-filter-console-drawer .qs-range input[type="number"] {
  text-align: center;
}

.qs-filter-group-guided {
  display: grid;
  grid-gap: 0.9rem;
  gap: 0.9rem;
  padding: 1rem;
  border-radius: 18px;
}

.qs-filter-group-partial {
  border-color: var(--state-warning-border);
  background:
    radial-gradient(circle at top right, color-mix(in srgb, var(--state-warning-bg) 78%, transparent), transparent 36%),
    color-mix(in srgb, var(--surface) 88%, white 12%);
}

.qs-filter-presets {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 0.6rem;
  gap: 0.6rem;
}

.qs-filter-group-guided .qs-filter-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 0.85rem;
  gap: 0.85rem;
}

.qs-filter-wide {
  grid-column: 1 / -1;
}

.qs-filter-group-guided .field,
.qs-filter-group-guided .qs-check {
  min-width: 0;
}

.qs-filter-group-guided .qs-chip-input {
  min-height: 48px;
}

:root[data-theme="dark"] .qs-filter-console,
:root[data-theme="dark"] .qs-filter-console-card,
:root[data-theme="dark"] .qs-filter-preset,
:root[data-theme="dark"] .qs-filter-group-guided {
  border-color: rgba(95, 114, 104, 0.66);
  background:
    linear-gradient(160deg, rgba(255, 255, 255, 0.04), rgba(0, 0, 0, 0.14)),
    color-mix(in srgb, var(--surface) 82%, transparent);
  box-shadow:
    0 18px 34px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

:root[data-theme="dark"] .qs-filter-count,
:root[data-theme="dark"] .qs-filter-support {
  border-color: rgba(95, 114, 104, 0.66);
  background: rgba(255, 255, 255, 0.05);
}

@media (max-width: 900px) {
  .qs-filter-console-grid,
  .qs-filter-presets,
  .qs-filter-group-guided .qs-filter-grid {
    grid-template-columns: 1fr;
  }

  .qs-filter-console-head,
  .qs-filter-section-head,
  .qs-filter-pending,
  .qs-filter-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .qs-filter-console-actions,
  .qs-filter-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 520px) {
  .qs-filters-panel {
    width: 100vw;
    max-width: 100vw;
  }

  .qs-filters-header {
    padding: 0.85rem 0.8rem 0.66rem;
  }

  .qs-filter-console {
    border-radius: 18px;
    padding: 0.85rem;
  }

  .qs-filter-console-card,
  .qs-filter-preset,
  .qs-filter-group-guided {
    border-radius: 14px;
    padding: 0.78rem;
  }

  .qs-filter-console-drawer {
    padding: 0.75rem;
  }

  .qs-filter-actions {
    padding-inline: 0.75rem;
  }

  .qs-filter-console-drawer .qs-range {
    grid-template-columns: 1fr;
  }
}

/* /quick-search weather upgrade: warmer, more editorial, same data contract. */
.qs-secondary-weather {
  margin-top: 0.9rem;
  border-color: color-mix(in srgb, var(--border) 66%, #ffd9be 34%);
  background:
    radial-gradient(circle at 14% 14%, rgba(233, 130, 76, 0.18), transparent 38%),
    radial-gradient(circle at 86% 12%, rgba(255, 221, 176, 0.24), transparent 30%),
    linear-gradient(160deg, color-mix(in srgb, var(--surface) 90%, #fff0e1 10%), color-mix(in srgb, var(--surface-2) 80%, #f6eadf 20%));
  box-shadow:
    0 24px 44px rgba(52, 35, 24, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.qs-secondary-weather .panel-header {
  margin-top: 0.9rem;
}

.qs-secondary-weather .weather-grid {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1.1rem;
  margin-top: 1.1rem;
}

.qs-secondary-weather .weather-group {
  padding: 1.05rem;
  gap: 0.85rem;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--border) 60%, #ffd8b8 40%);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--surface) 90%, #ffefe0 10%), color-mix(in srgb, var(--surface-2) 88%, #fff8f1 12%));
  box-shadow:
    0 16px 28px rgba(62, 38, 22, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.64);
}

.qs-secondary-weather .weather-group h3 {
  font-size: 0.94rem;
  letter-spacing: 0.01em;
}

.qs-secondary-weather .weather-days {
  display: grid;
  grid-gap: 0.75rem;
  gap: 0.75rem;
}

.qs-weather-card {
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--border) 56%, #ffcda7 44%);
  background:
    radial-gradient(circle at 84% 16%, rgba(239, 158, 85, 0.22), transparent 36%),
    linear-gradient(148deg, #fff6eb, #fff1e1 52%, #ffead7);
  color: #34271d;
  padding: 0.78rem 0.84rem;
  display: grid;
  grid-gap: 0.5rem;
  gap: 0.5rem;
  box-shadow:
    0 12px 22px rgba(68, 45, 29, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.68);
  transition: transform 180ms cubic-bezier(0.2, 0, 0, 1), box-shadow 180ms cubic-bezier(0.2, 0, 0, 1);
}

.qs-weather-card:hover {
  transform: translateY(-2px);
  box-shadow:
    0 16px 28px rgba(68, 45, 29, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.74);
}

.qs-weather-card__header,
.qs-weather-card__row,
.qs-weather-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
}

.qs-weather-card__header strong {
  font-size: 0.84rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: capitalize;
}

.qs-weather-card__stage {
  border-radius: 999px;
  padding: 0.22rem 0.58rem;
  border: 1px solid rgba(188, 99, 46, 0.32);
  background: rgba(255, 247, 235, 0.72);
  color: #7f4f2c;
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.qs-weather-card__main {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.7rem;
}

.qs-weather-card__temp {
  font-size: 1.65rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.02em;
  color: #2f2118;
}

.qs-weather-card__temp-min {
  font-size: 0.78rem;
  color: #6a5343;
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

.qs-weather-card__row {
  font-size: 0.8rem;
  color: #4f3c31;
}

.qs-weather-card__footer {
  padding-top: 0.44rem;
  border-top: 1px solid rgba(144, 97, 63, 0.18);
  font-size: 0.72rem;
  color: #604a3b;
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

:root[data-theme="dark"] .qs-secondary-weather {
  border-color: color-mix(in srgb, var(--color-border) 82%, var(--color-accent) 18%);
  background:
    radial-gradient(circle at 14% 14%, color-mix(in srgb, var(--color-accent) 24%, transparent), transparent 38%),
    radial-gradient(circle at 86% 12%, rgba(111, 178, 161, 0.14), transparent 30%),
    linear-gradient(160deg, color-mix(in srgb, var(--surface) 84%, #1a201d 16%), color-mix(in srgb, var(--surface-2) 86%, #121614 14%));
}

:root[data-theme="dark"] .qs-secondary-weather .weather-group {
  border-color: color-mix(in srgb, var(--color-border-strong) 88%, var(--color-accent) 12%);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--surface) 88%, #161b19 12%), color-mix(in srgb, var(--surface-2) 90%, #0f1312 10%));
}

:root[data-theme="dark"] .qs-weather-card {
  border-color: color-mix(in srgb, var(--color-border-strong) 88%, var(--color-accent) 12%);
  background:
    radial-gradient(circle at 84% 16%, color-mix(in srgb, var(--color-accent) 22%, transparent), transparent 36%),
    linear-gradient(148deg, color-mix(in srgb, var(--surface) 86%, #1a1f1d 14%), color-mix(in srgb, var(--surface-2) 88%, #131816 12%));
  color: var(--color-text-primary);
}

:root[data-theme="dark"] .qs-weather-card__stage {
  border-color: color-mix(in srgb, var(--color-accent) 44%, var(--color-border));
  background: color-mix(in srgb, var(--surface) 78%, #ffffff 6%);
  color: var(--color-accent-hover);
}

:root[data-theme="dark"] .qs-weather-card__temp,
:root[data-theme="dark"] .qs-weather-card__temp-min,
:root[data-theme="dark"] .qs-weather-card__row,
:root[data-theme="dark"] .qs-weather-card__footer {
  color: var(--color-text-primary);
}

@media (max-width: 840px) {
  .qs-secondary-weather .weather-grid {
    grid-template-columns: 1fr;
  }

  .qs-weather-card__footer {
    flex-wrap: wrap;
  }
}

/* Final cascade guard: prevent light islands in quick-search dark mode. */
:root[data-theme="dark"] .quick-search-shell .quick-search-panel {
  border-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
  background:
    radial-gradient(circle at top right, rgba(224, 123, 86, 0.1), transparent 28%),
    radial-gradient(circle at left center, rgba(111, 178, 161, 0.08), transparent 24%),
    linear-gradient(180deg, color-mix(in srgb, var(--color-surface-elevated) 88%, var(--color-surface) 12%), color-mix(in srgb, var(--color-surface) 92%, var(--color-surface-muted) 8%));
  box-shadow:
    0 24px 46px rgba(0, 0, 0, 0.44),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

:root[data-theme="dark"] .quick-search-shell .quick-search-panel::before {
  background: radial-gradient(circle at 12% 18%, rgba(224, 123, 86, 0.14), transparent 42%);
}

:root[data-theme="dark"] .quick-search-shell .quick-search-panel::after {
  background: radial-gradient(circle at 84% 72%, rgba(111, 178, 161, 0.12), transparent 40%);
}

:root[data-theme="dark"] .quick-search-shell .qs-summary {
  border-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
  background: color-mix(in srgb, var(--color-surface) 90%, var(--color-surface-elevated) 10%);
  box-shadow: 0 16px 30px rgba(0, 0, 0, 0.4);
}

:root[data-theme="dark"] .quick-search-shell .btn-search:disabled {
  color: var(--color-text-disabled);
  border-color: color-mix(in srgb, var(--color-border) 84%, var(--color-accent) 16%);
  background: color-mix(in srgb, var(--color-surface) 90%, var(--color-surface-muted) 10%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 8px 18px rgba(0, 0, 0, 0.28);
}

/* Landing dark-mode hardening: remove light island while preserving editorial tone. */
:root[data-theme="dark"] .landing-hero {
  border-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
  background:
    radial-gradient(circle at 84% 16%, rgba(224, 123, 86, 0.12), transparent 32%),
    radial-gradient(circle at 14% 14%, rgba(111, 178, 161, 0.1), transparent 30%),
    linear-gradient(145deg, color-mix(in srgb, var(--color-surface) 90%, var(--color-surface-elevated) 10%), color-mix(in srgb, var(--color-surface-elevated) 84%, var(--color-surface-muted) 16%));
  box-shadow: 0 26px 60px rgba(0, 0, 0, 0.5);
}

:root[data-theme="dark"] .landing-hero-copy h1,
:root[data-theme="dark"] .landing-panel-header h2,
:root[data-theme="dark"] .demo-chart-header strong,
:root[data-theme="dark"] .landing-claim {
  color: var(--color-text-primary);
}

:root[data-theme="dark"] .landing-hero-copy p,
:root[data-theme="dark"] .landing-cta-note,
:root[data-theme="dark"] .landing-panel-header p {
  color: var(--color-text-secondary);
}

:root[data-theme="dark"] .landing-hero-panel {
  border-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
  background:
    radial-gradient(circle at top right, rgba(224, 123, 86, 0.1), transparent 34%),
    linear-gradient(160deg, color-mix(in srgb, var(--color-surface-elevated) 88%, var(--color-surface) 12%), color-mix(in srgb, var(--color-surface) 90%, var(--color-surface-muted) 10%));
  box-shadow:
    0 20px 42px rgba(0, 0, 0, 0.46),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

:root[data-theme="dark"] .demo-chart,
:root[data-theme="dark"] .demo-calendar {
  border-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
  background: color-mix(in srgb, var(--color-surface) 88%, var(--color-surface-elevated) 12%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

:root[data-theme="dark"] .demo-chart-header,
:root[data-theme="dark"] .demo-calendar-header,
:root[data-theme="dark"] .demo-day,
:root[data-theme="dark"] .demo-chip-muted {
  color: var(--color-text-secondary);
}

:root[data-theme="dark"] .demo-date {
  background: color-mix(in srgb, var(--color-info-bg) 58%, var(--color-surface));
  border-color: color-mix(in srgb, var(--color-info-border) 60%, transparent);
  color: var(--color-text-primary);
}

:root[data-theme="dark"] .demo-date-2 {
  background: color-mix(in srgb, var(--color-accent) 18%, var(--color-surface));
  border-color: color-mix(in srgb, var(--color-accent) 46%, transparent);
}

:root[data-theme="dark"] .demo-date-3 {
  background: color-mix(in srgb, var(--color-chip-bg) 88%, var(--color-surface) 12%);
  border-color: color-mix(in srgb, var(--color-chip-border) 72%, transparent);
}

:root[data-theme="dark"] .demo-chip {
  border-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
  background: color-mix(in srgb, var(--color-surface) 88%, var(--color-surface-elevated) 12%);
  color: var(--color-text-primary);
}

/* Final dark pass: quick-search info rail + airport picker must avoid light leakage. */
:root[data-theme="dark"] .quick-search-shell .qs-info-stack {
  border-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
  background:
    radial-gradient(circle at 92% 10%, rgba(224, 123, 86, 0.1), transparent 28%),
    linear-gradient(180deg, color-mix(in srgb, var(--color-surface) 90%, var(--color-surface-elevated) 10%), color-mix(in srgb, var(--color-surface-elevated) 86%, var(--color-surface-muted) 14%));
}

:root[data-theme="dark"] .quick-search-shell .qs-info-summary,
:root[data-theme="dark"] .quick-search-shell .qs-info-body,
:root[data-theme="dark"] .quick-search-shell .qs-info-tech-body {
  border-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
}

:root[data-theme="dark"] .quick-search-shell .qs-info-tier,
:root[data-theme="dark"] .quick-search-shell .qs-info-tech,
:root[data-theme="dark"] .quick-search-shell .qs-sources-panel,
:root[data-theme="dark"] .quick-search-shell .qs-info-impact-row {
  border-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
  background: color-mix(in srgb, var(--color-surface-elevated) 88%, var(--color-surface) 12%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

:root[data-theme="dark"] .quick-search-shell .qs-info-tier-kicker {
  color: var(--color-text-secondary);
}

:root[data-theme="dark"] .quick-search-shell .qs-info-tier strong,
:root[data-theme="dark"] .quick-search-shell .qs-info-impact-row span,
:root[data-theme="dark"] .quick-search-shell .qs-sources-panel strong {
  color: var(--color-text-primary);
}

:root[data-theme="dark"] .quick-search-shell .qs-sources-panel li span {
  color: var(--color-text-secondary);
}

:root[data-theme="dark"] .quick-search-shell .qs-info-impact-row-critical {
  border-color: color-mix(in srgb, var(--color-danger-border) 74%, var(--color-border));
  background: color-mix(in srgb, var(--color-danger-bg) 52%, var(--color-surface));
}

:root[data-theme="dark"] .quick-search-shell .qs-airport-modal {
  border-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
  background:
    radial-gradient(circle at top right, rgba(224, 123, 86, 0.12), transparent 30%),
    radial-gradient(circle at 18% 14%, rgba(111, 178, 161, 0.1), transparent 26%),
    linear-gradient(170deg, color-mix(in srgb, var(--color-surface-elevated) 90%, var(--color-surface) 10%), color-mix(in srgb, var(--color-surface) 92%, var(--color-surface-muted) 8%));
}

:root[data-theme="dark"] .quick-search-shell .qs-airport-modal__close {
  border-color: color-mix(in srgb, var(--color-border) 80%, var(--color-border-strong) 20%);
  background: color-mix(in srgb, var(--color-surface-elevated) 88%, var(--color-surface) 12%);
  color: var(--color-text-primary);
}

:root[data-theme="dark"] .quick-search-shell .qs-airport-modal__close:hover {
  background: color-mix(in srgb, var(--color-surface-elevated) 96%, var(--color-surface) 4%);
}

:root[data-theme="dark"] .quick-search-shell .qs-airport-modal__header,
:root[data-theme="dark"] .quick-search-shell .qs-airport-modal__search {
  border-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
  background: color-mix(in srgb, var(--color-surface) 90%, var(--color-surface-elevated) 10%);
}

:root[data-theme="dark"] .quick-search-shell .qs-airport-modal__countries {
  border-right-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
}

:root[data-theme="dark"] .quick-search-shell .airport-modal-left,
:root[data-theme="dark"] .quick-search-shell .airport-modal-right {
  background: transparent;
}

:root[data-theme="dark"] .quick-search-shell .airport-modal-left h2,
:root[data-theme="dark"] .quick-search-shell .airport-modal-header h3,
:root[data-theme="dark"] .quick-search-shell .country-pill {
  color: var(--color-text-primary);
}

:root[data-theme="dark"] .quick-search-shell .qs-airport-modal__airport-item {
  color: var(--color-text-primary);
}

:root[data-theme="dark"] .quick-search-shell .qs-airport-modal__airport-item:hover {
  background: color-mix(in srgb, var(--color-surface-elevated) 84%, var(--color-surface) 16%);
  border-color: color-mix(in srgb, var(--color-border) 70%, var(--color-border-strong) 30%);
}

:root[data-theme="dark"] .quick-search-shell .qs-airport-modal__airport-iata {
  background: rgba(111, 178, 161, 0.14);
  color: color-mix(in srgb, var(--color-accent-secondary) 80%, white 20%);
}

:root[data-theme="dark"] .quick-search-shell .qs-airport-modal__count {
  background: rgba(111, 178, 161, 0.16);
  color: color-mix(in srgb, var(--color-accent-secondary) 80%, white 20%);
}

:root[data-theme="dark"] .quick-search-shell .qs-airport-modal__use-country {
  border-color: rgba(111, 178, 161, 0.24);
  background: rgba(111, 178, 161, 0.08);
  color: color-mix(in srgb, var(--color-accent-secondary) 80%, white 20%);
}

:root[data-theme="dark"] .quick-search-shell .qs-airport-modal__use-country:hover {
  background: rgba(111, 178, 161, 0.14);
  border-color: rgba(111, 178, 161, 0.34);
}

:root[data-theme="dark"] .quick-search-shell .qs-airport-modal__recent-chip {
  border-color: color-mix(in srgb, var(--color-border) 72%, var(--color-border-strong) 28%);
  background: color-mix(in srgb, var(--color-surface-elevated) 80%, var(--color-surface) 20%);
  color: var(--color-text-primary);
}

:root[data-theme="dark"] .quick-search-shell .qs-airport-modal__recent-chip:hover {
  background: color-mix(in srgb, var(--color-surface-elevated) 92%, var(--color-surface) 8%);
  border-color: rgba(111, 178, 161, 0.24);
}

:root[data-theme="dark"] .quick-search-shell .qs-airport-modal__search-icon {
  color: var(--color-text-secondary);
}

:root[data-theme="dark"] .quick-search-shell .qs-airport-modal__empty {
  color: var(--color-text-secondary);
}

:root[data-theme="dark"] .quick-search-shell .qs-airport-modal__recents-label {
  color: var(--color-text-secondary);
}


/* Animated route dot for watchlist map */
.watch-map-route-dot {
  width: 14px;
  height: 14px;
  background: #D95D39;
  border: 2px solid #fff;
  border-radius: 50%;
  box-shadow: 0 0 0 3px rgba(217, 93, 57, 0.35), 0 0 12px rgba(217, 93, 57, 0.35);
  pointer-events: none;
  animation: watchRouteDotPulse 2s ease-in-out infinite;
}

@keyframes watchRouteDotPulse {
  0%, 100% {
    box-shadow: 0 0 0 3px rgba(217, 93, 57, 0.35), 0 0 8px rgba(217, 93, 57, 0.2);
    transform: scale(1);
  }
  50% {
    box-shadow: 0 0 0 5px rgba(217, 93, 57, 0.15), 0 0 16px rgba(217, 93, 57, 0.25);
    transform: scale(1.1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .watch-map-route-dot {
    animation: none;
  }
}
/* Landing 2026 warm-aviation redesign (route / only, no /prueba reuse) */
.landing-shell {
  display: grid;
  grid-gap: 1.35rem;
  gap: 1.35rem;
}

.landing-shell-full {
  position: relative;
  width: 100%;
  overflow-x: clip;
  display: grid;
  grid-gap: 1.45rem;
  gap: 1.45rem;
  padding: var(--ui-shell-padding-top) 0 var(--ui-shell-padding-bottom);
}

.landing-inner {
  width: min(100%, 1440px);
  margin: 0 auto;
  padding-inline: clamp(1rem, 2.8vw, 2.5rem);
}

.landing-inner-wide {
  width: min(100%, 1600px);
}

.landing-fullband {
  width: 100%;
  padding-inline: clamp(0.4rem, 1.4vw, 1rem);
}

.landing-fullband-hero,
.landing-fullband-proof,
.landing-fullband-close {
  position: relative;
}

.landing-fullband-hero::before,
.landing-fullband-proof::before,
.landing-fullband-close::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

.landing-fullband-hero::before {
  background:
    radial-gradient(circle at 12% 40%, color-mix(in srgb, var(--landing-glow-warm) 60%, transparent), transparent 48%),
    radial-gradient(circle at 84% 22%, color-mix(in srgb, var(--accent-2) 12%, transparent), transparent 42%);
}

.landing-fullband-proof::before {
  background: linear-gradient(90deg, color-mix(in srgb, var(--landing-glow-warm) 48%, transparent), transparent 48%);
}

.landing-fullband-close::before {
  background: linear-gradient(180deg, transparent, color-mix(in srgb, var(--landing-route-line) 8%, transparent));
}

.landing-fullband .landing-inner {
  position: relative;
  z-index: 1;
}

.landing-eyebrow {
  margin: 0;
  font-size: 0.76rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--ink-muted);
  font-weight: 700;
}

.landing-hero-v2 {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.8fr);
  grid-gap: 1.1rem;
  gap: 1.1rem;
  border-radius: 24px;
  border: 1px solid color-mix(in srgb, var(--border) 86%, transparent);
  background:
    radial-gradient(circle at 8% 18%, rgba(255, 176, 0, 0.14), transparent 44%),
    radial-gradient(circle at 92% 20%, rgba(80, 191, 230, 0.14), transparent 40%),
    linear-gradient(145deg, color-mix(in srgb, var(--panel-bg) 82%, var(--surface) 18%), color-mix(in srgb, var(--surface) 78%, var(--panel-bg) 22%));
  box-shadow: 0 24px 58px var(--shadow-strong);
  padding: clamp(1.1rem, 2vw, 2rem);
}

.landing-hero-v2-copy {
  display: grid;
  align-content: center;
  grid-gap: 0.72rem;
  gap: 0.72rem;
}

.landing-hero-v2-copy h1 {
  margin: 0;
  font-family: "Playfair Display", serif;
  font-size: clamp(2rem, 4.8vw, 3.45rem);
  line-height: 1.03;
  max-width: 16ch;
}

.landing-claim {
  margin: 0;
  font-size: clamp(1rem, 2.1vw, 1.28rem);
  font-weight: 600;
  color: var(--ink);
}

.landing-body {
  margin: 0;
  color: var(--ink-muted);
  line-height: 1.7;
  max-width: 54ch;
}

.landing-hero-points {
  margin: 0.2rem 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-gap: 0.45rem;
  gap: 0.45rem;
}

.landing-hero-points li {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  color: color-mix(in srgb, var(--ink) 90%, var(--accent) 10%);
  font-size: 0.95rem;
  line-height: 1.45;
}

.landing-hero-points li::before {
  content: "•";
  color: var(--accent);
  font-weight: 700;
}

.landing-cta-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem;
  margin-top: 0.45rem;
}

.landing-cta-note {
  margin: 0.15rem 0 0;
  color: var(--ink-muted);
  font-size: 0.9rem;
}

.landing-signal-panel {
  border: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
  border-radius: 20px;
  padding: 1rem;
  background: color-mix(in srgb, var(--surface) 80%, transparent);
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
  display: grid;
  grid-gap: 0.78rem;
  gap: 0.78rem;
}

.landing-panel-header-v2 h2 {
  margin: 0;
  font-size: 1.14rem;
  font-family: "Playfair Display", serif;
}

.landing-panel-header-v2 p {
  margin: 0.18rem 0 0;
  color: var(--ink-muted);
  font-size: 0.86rem;
}

.landing-signal-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.8rem;
}

.signal-route {
  display: grid;
  grid-gap: 0.1rem;
  gap: 0.1rem;
}

.signal-route strong {
  font-family: "IBM Plex Mono", "IBM Plex Sans", monospace;
  letter-spacing: 0.02em;
}

.signal-label,
.signal-meta {
  color: var(--ink-muted);
  font-size: 0.78rem;
}

.signal-chip {
  display: inline-flex;
  align-items: center;
  padding: 0.22rem 0.62rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
  background: color-mix(in srgb, var(--surface) 72%, transparent);
  font-size: 0.75rem;
  font-weight: 700;
}

.signal-chip-success {
  border-color: color-mix(in srgb, var(--state-success-border) 84%, var(--border));
  background: color-mix(in srgb, var(--state-success-bg) 84%, transparent);
}

.signal-chip-muted {
  color: var(--ink-muted);
}

.signal-bars {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  align-items: end;
  grid-gap: 0.3rem;
  gap: 0.3rem;
  min-height: 86px;
}

.signal-bars span {
  border-radius: 999px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--accent) 88%, #ffffff 12%), color-mix(in srgb, var(--accent) 18%, transparent));
}

.landing-signal-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 0.55rem;
  gap: 0.55rem;
}

.signal-cell {
  border: 1px solid color-mix(in srgb, var(--border) 74%, transparent);
  border-radius: 12px;
  background: color-mix(in srgb, var(--surface) 74%, transparent);
  padding: 0.52rem 0.6rem;
  display: grid;
  grid-gap: 0.15rem;
  gap: 0.15rem;
}

.signal-cell span {
  color: var(--ink-muted);
  font-size: 0.75rem;
}

.signal-cell strong {
  font-size: 0.86rem;
}

.landing-signal-foot {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.landing-proof-band {
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  border-radius: 20px;
  padding: 1rem;
  background:
    linear-gradient(120deg, rgba(255, 176, 0, 0.08), transparent 34%),
    color-mix(in srgb, var(--surface) 92%, var(--panel-bg) 8%);
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  grid-gap: 0.95rem;
  gap: 0.95rem;
}

.landing-proof-copy h2 {
  margin: 0.2rem 0 0.35rem;
  font-family: "Playfair Display", serif;
  font-size: clamp(1.35rem, 2.2vw, 1.9rem);
}

.landing-proof-copy p {
  margin: 0;
  color: var(--ink-muted);
}

.landing-metrics-v2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 0.6rem;
  gap: 0.6rem;
}

.landing-metric-v2 {
  border: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
  border-radius: 12px;
  padding: 0.6rem 0.75rem;
  background: color-mix(in srgb, var(--surface) 78%, transparent);
  display: grid;
  grid-gap: 0.14rem;
  gap: 0.14rem;
}

.landing-metric-v2 strong {
  font-size: 1.07rem;
}

.landing-metric-v2 span {
  font-size: 0.82rem;
  color: var(--ink-muted);
}

.landing-capabilities {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(0, 0.82fr);
  grid-gap: 0.9rem;
  gap: 0.9rem;
  margin-top: 0.75rem;
}

.landing-capability-main,
.landing-flow-v2,
.landing-close-cta,
.landing-calendar-preview {
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  border-radius: 20px;
  padding: 1rem;
  background: color-mix(in srgb, var(--surface) 92%, var(--panel-bg) 8%);
}

.landing-cap-main-grid {
  margin-top: 0.7rem;
  display: grid;
  grid-gap: 0.55rem;
  gap: 0.55rem;
}

.landing-capability-side {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 0.65rem;
  gap: 0.65rem;
}

.landing-cap-card {
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  border-radius: 14px;
  padding: 0.75rem;
  background:
    linear-gradient(140deg, color-mix(in srgb, var(--accent-2) 11%, transparent), transparent 52%),
    color-mix(in srgb, var(--surface) 84%, transparent);
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.landing-cap-card:hover,
.landing-cap-card:focus-within {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--accent) 24%, var(--border));
  box-shadow: 0 8px 18px var(--shadow);
}

.landing-cap-card h3 {
  margin: 0 0 0.3rem;
}

.landing-cap-card p {
  margin: 0;
  color: var(--ink-muted);
  font-size: 0.88rem;
}

.landing-steps-grid-v2 {
  margin-top: 0.78rem;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-gap: 0.65rem;
  gap: 0.65rem;
}

.landing-step-v2 {
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  border-radius: 13px;
  padding: 0.72rem;
  background: color-mix(in srgb, var(--surface) 86%, transparent);
}

.step-index {
  display: inline-flex;
  padding: 0.1rem 0.42rem;
  border-radius: 999px;
  font-size: 0.7rem;
  font-family: "IBM Plex Mono", "IBM Plex Sans", monospace;
  border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
  color: var(--ink-muted);
}

.landing-step-v2 h3 {
  margin: 0.45rem 0 0.3rem;
  font-size: 0.92rem;
}

.landing-step-v2 p {
  margin: 0;
  color: var(--ink-muted);
  font-size: 0.84rem;
  line-height: 1.5;
}

.landing-close-cta {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: center;
  background:
    radial-gradient(circle at 12% 16%, rgba(255, 176, 0, 0.11), transparent 46%),
    color-mix(in srgb, var(--surface) 90%, var(--panel-bg) 10%);
}

.landing-close-cta h2 {
  margin: 0.2rem 0 0.25rem;
  font-family: "Playfair Display", serif;
  font-size: clamp(1.3rem, 2.3vw, 1.95rem);
}

.landing-close-cta p {
  margin: 0;
  color: var(--ink-muted);
}

.landing-close-actions {
  display: grid;
  grid-gap: 0.5rem;
  gap: 0.5rem;
  justify-items: start;
}

.landing-calendar-preview {
  display: grid;
  grid-gap: 0.7rem;
  gap: 0.7rem;
}

.demo-calendar-grid-v2 {
  background: color-mix(in srgb, var(--surface) 86%, transparent);
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  border-radius: 14px;
  padding: 0.7rem;
}

@media (max-width: 1100px) {
  .landing-hero-v2,
  .landing-proof-band,
  .landing-capabilities {
    grid-template-columns: 1fr;
  }

  .landing-steps-grid-v2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .landing-close-cta {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 760px) {
  .landing-capability-side,
  .landing-metrics-v2,
  .landing-steps-grid-v2,
  .landing-signal-grid {
    grid-template-columns: 1fr;
  }

  .landing-hero-v2 {
    padding: 0.95rem;
  }

  .landing-shell {
    gap: 1rem;
  }

  .landing-shell-full {
    gap: 0.95rem;
  }

  .landing-fullband {
    padding-inline: 0.35rem;
  }
}

:root[data-theme="dark"] .landing-hero-v2 {
  background:
    radial-gradient(circle at 12% 20%, rgba(255, 176, 0, 0.15), transparent 46%),
    radial-gradient(circle at 92% 22%, rgba(80, 191, 230, 0.14), transparent 44%),
    linear-gradient(150deg, color-mix(in srgb, var(--surface) 86%, var(--surface-2) 14%), color-mix(in srgb, var(--surface-2) 82%, #0f1312 18%));
  box-shadow: 0 26px 60px rgba(0, 0, 0, 0.54);
}

:root[data-theme="dark"] .landing-signal-panel,
:root[data-theme="dark"] .landing-capability-main,
:root[data-theme="dark"] .landing-flow-v2,
:root[data-theme="dark"] .landing-close-cta,
:root[data-theme="dark"] .landing-calendar-preview,
:root[data-theme="dark"] .landing-proof-band,
:root[data-theme="dark"] .landing-cap-card,
:root[data-theme="dark"] .landing-step-v2,
:root[data-theme="dark"] .landing-metric-v2,
:root[data-theme="dark"] .signal-cell,
:root[data-theme="dark"] .demo-calendar-grid-v2 {
  border-color: color-mix(in srgb, var(--color-border) 84%, var(--color-border-strong) 16%);
  background-color: color-mix(in srgb, var(--color-surface) 90%, var(--color-surface-elevated) 10%);
}

:root[data-theme="dark"] .landing-cap-card {
  border-color: color-mix(in srgb, var(--color-border) 90%, transparent);
  background:
    linear-gradient(140deg, color-mix(in srgb, var(--accent-2) 7%, transparent), transparent 58%),
    color-mix(in srgb, var(--color-surface) 92%, var(--color-surface-elevated) 8%);
}

:root[data-theme="dark"] .landing-cap-card:hover,
:root[data-theme="dark"] .landing-cap-card:focus-within {
  border-color: color-mix(in srgb, var(--accent) 18%, var(--color-border));
  box-shadow: 0 7px 16px color-mix(in srgb, var(--shadow) 58%, transparent);
}

:root[data-theme="dark"] .signal-bars span {
  background: linear-gradient(180deg, color-mix(in srgb, var(--accent) 82%, #ffffff 18%), color-mix(in srgb, var(--accent) 22%, transparent));
}

/* Landing personality pass: warm flight-deck rhythm */
.landing-hero-v2 {
  isolation: isolate;
  grid-template-columns: minmax(0, 1.14fr) minmax(340px, 0.86fr);
  background:
    radial-gradient(circle at 8% 16%, var(--landing-glow-warm), transparent 46%),
    radial-gradient(circle at 88% 18%, color-mix(in srgb, var(--accent-2) 18%, transparent), transparent 41%),
    linear-gradient(150deg, color-mix(in srgb, var(--surface) 90%, var(--panel-bg) 10%), color-mix(in srgb, var(--surface-2) 84%, var(--surface) 16%));
}

.landing-hero-v2::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    repeating-linear-gradient(90deg, transparent 0 58px, color-mix(in srgb, var(--landing-runway-light) 26%, transparent) 58px 59px, transparent 59px 118px),
    linear-gradient(180deg, color-mix(in srgb, var(--landing-route-line) 20%, transparent), transparent 20%);
  opacity: 0.26;
}

.landing-hero-airway {
  position: absolute;
  top: 1rem;
  left: 1.1rem;
  right: 1.1rem;
  display: flex;
  align-items: center;
  gap: 0.45rem;
  z-index: 1;
  pointer-events: none;
}

.airway-point {
  font-size: 0.66rem;
  font-family: "IBM Plex Mono", "IBM Plex Sans", monospace;
  font-weight: 700;
  letter-spacing: 0.08em;
  padding: 0.14rem 0.4rem;
  border-radius: 999px;
  border: 1px solid var(--landing-flight-strip-border);
  background: color-mix(in srgb, var(--landing-terminal-glass) 92%, transparent);
}

.airway-arc {
  height: 22px;
  flex: 1 1;
  border-top: 1px dashed color-mix(in srgb, var(--landing-route-line) 74%, transparent);
  border-radius: 999px 999px 0 0;
  position: relative;
}

.airway-arc::after {
  content: "";
  position: absolute;
  right: 28%;
  top: -4px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--landing-runway-light);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--landing-runway-light) 24%, transparent), 0 0 12px color-mix(in srgb, var(--landing-runway-light) 40%, transparent);
}

.landing-hero-v2-copy {
  position: relative;
  z-index: 2;
  padding-top: 1.4rem;
}

.landing-signal-panel {
  position: relative;
  z-index: 2;
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--landing-terminal-glass) 88%, transparent), color-mix(in srgb, var(--surface) 84%, transparent));
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--landing-runway-light) 26%, transparent);
}

.signal-chip-pulse {
  border-color: var(--landing-signal-active);
  animation: landingSignalPulse 2.8s ease-in-out infinite;
}

.landing-flight-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-gap: 0.35rem;
  gap: 0.35rem;
  border: 1px dashed var(--landing-flight-strip-border);
  border-radius: 10px;
  padding: 0.45rem 0.5rem;
  background: color-mix(in srgb, var(--landing-terminal-glass) 88%, transparent);
}

.landing-flight-strip span {
  font-size: 0.68rem;
  font-family: "IBM Plex Mono", "IBM Plex Sans", monospace;
  color: var(--ink-muted);
}

.signal-bars span {
  animation: landingBarBreathe 3.6s ease-in-out infinite;
}

.signal-bars span:nth-child(2n) {
  animation-delay: 0.35s;
}

.signal-bars span:nth-child(3n) {
  animation-delay: 0.7s;
}

.landing-proof-band {
  grid-template-columns: minmax(0, 1fr);
  gap: 0.8rem;
  background:
    linear-gradient(95deg, color-mix(in srgb, var(--landing-glow-warm) 90%, transparent), transparent 36%),
    color-mix(in srgb, var(--surface) 92%, var(--panel-bg) 8%);
}

.landing-metrics-v2 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.landing-capabilities {
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr);
}

.landing-cap-main-grid .pulse-row {
  border: 1px solid color-mix(in srgb, var(--landing-flight-strip-border) 86%, transparent);
  border-radius: 12px;
  padding: 0.58rem 0.62rem;
  background: color-mix(in srgb, var(--landing-terminal-glass) 86%, transparent);
  transition: transform 0.2s ease, border-color 0.2s ease;
}

.landing-cap-main-grid .pulse-row:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--accent) 38%, var(--landing-flight-strip-border));
}

.landing-capability-side {
  grid-template-columns: 1fr;
}

.landing-flow-v2 {
  overflow: hidden;
  position: relative;
}

.landing-steps-grid-v2 {
  position: relative;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.landing-steps-grid-v2::before {
  content: "";
  position: absolute;
  left: 0.8rem;
  right: 0.8rem;
  top: 0.95rem;
  border-top: 1px dashed color-mix(in srgb, var(--landing-route-line) 68%, transparent);
}

.landing-step-v2 {
  position: relative;
  z-index: 1;
}

.landing-step-v2:hover {
  transform: translateY(-2px);
}

.landing-step-v2,
.landing-close-cta,
.landing-calendar-preview,
.landing-metric-v2 {
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.landing-metric-v2:hover,
.landing-calendar-preview:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 28px var(--shadow);
}

.demo-meta-strip {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}

@keyframes landingSignalPulse {
  0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--landing-signal-active) 36%, transparent); }
  50% { box-shadow: 0 0 0 6px color-mix(in srgb, var(--landing-signal-active) 8%, transparent); }
}

@keyframes landingBarBreathe {
  0%, 100% { filter: saturate(0.95); }
  50% { filter: saturate(1.14) brightness(1.06); }
}

:root[data-theme="dark"] .landing-hero-v2 {
  background:
    radial-gradient(circle at 12% 20%, color-mix(in srgb, var(--landing-glow-warm) 112%, transparent), transparent 46%),
    radial-gradient(circle at 92% 22%, color-mix(in srgb, var(--accent-2) 22%, transparent), transparent 44%),
    linear-gradient(153deg, color-mix(in srgb, var(--surface) 86%, #122122 14%), color-mix(in srgb, var(--surface-2) 82%, #0e1718 18%));
}

@media (max-width: 1100px) {
  .landing-metrics-v2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .landing-hero-airway {
    position: static;
    margin-bottom: 0.4rem;
  }

  .landing-hero-v2-copy {
    padding-top: 0;
  }

  .landing-metrics-v2 {
    grid-template-columns: 1fr;
  }

  .landing-steps-grid-v2::before {
    display: none;
  }

  .landing-flight-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (prefers-reduced-motion: reduce) {
  .signal-chip-pulse,
  .signal-bars span {
    animation: none;
  }
}

/* Landing conversion restructure — stronger narrative, fewer competing blocks */
.landing-conv-hero-grid {
  gap: clamp(1rem, 2vw, 1.4rem);
  align-items: stretch;
}

.landing-conv-copy {
  gap: 0.85rem;
}

.landing-conv-copy h1 {
  text-wrap: balance;
  max-width: 12ch;
}

.landing-conv-copy .landing-body,
.landing-proof-copy-v2 p,
.landing-decision-heading p,
.landing-close-copy p {
  text-wrap: pretty;
}

.landing-hero-link {
  font-size: 0.9rem;
}

.landing-conv-trust {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: 0.1rem;
}

.landing-conv-trust span {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0.28rem 0.72rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface) 86%, transparent);
  border: 1px solid color-mix(in srgb, var(--landing-flight-strip-border) 78%, transparent);
  box-shadow: 0 10px 22px color-mix(in srgb, var(--shadow-strong) 8%, transparent);
  font-size: 0.8rem;
  color: color-mix(in srgb, var(--ink) 92%, var(--accent) 8%);
}

.landing-conv-metrics-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-gap: 0.6rem;
  gap: 0.6rem;
  margin-top: 0.2rem;
}

.landing-metric-v2--hero {
  min-height: 96px;
  box-shadow:
    0 14px 26px color-mix(in srgb, var(--shadow-strong) 8%, transparent),
    inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.landing-metric-v2--hero strong,
.landing-proof-metrics strong {
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

.landing-conv-demo {
  border-radius: 24px;
  padding: 1.05rem;
  background:
    linear-gradient(165deg, color-mix(in srgb, var(--landing-terminal-glass) 92%, transparent), color-mix(in srgb, var(--surface) 86%, transparent));
  box-shadow:
    0 24px 42px color-mix(in srgb, var(--shadow-strong) 16%, transparent),
    inset 0 1px 0 color-mix(in srgb, var(--landing-runway-light) 28%, transparent);
}

.landing-demo-stack {
  display: grid;
  grid-gap: 0.65rem;
  gap: 0.65rem;
}

.landing-demo-card {
  display: grid;
  grid-gap: 0.55rem;
  gap: 0.55rem;
  padding: 0.72rem;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--landing-flight-strip-border) 82%, transparent);
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  box-shadow: 0 12px 24px color-mix(in srgb, var(--shadow-strong) 8%, transparent);
}

.landing-demo-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
}

.landing-demo-card-header strong {
  font-size: 0.84rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ink-muted);
}

.demo-calendar-grid-v3 {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  grid-gap: 0.28rem;
  gap: 0.28rem;
  padding: 0.55rem;
}

.landing-signal-foot--elevated {
  justify-content: space-between;
}

.landing-proof-cred {
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  align-items: start;
  padding: 1.15rem;
}

.landing-proof-copy-v2 h2,
.landing-decision-heading h2,
.landing-close-copy h2 {
  text-wrap: balance;
}

.landing-proof-grid-v2 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-gap: 0.65rem;
  gap: 0.65rem;
  grid-column: 1 / -1;
}

.landing-proof-card {
  min-height: 150px;
}

.landing-conv-decision {
  display: grid;
  grid-gap: 0.9rem;
  gap: 0.9rem;
  margin-top: 0.7rem;
}

.landing-decision-heading {
  align-items: flex-end;
}

.landing-decision-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.16fr) minmax(320px, 0.84fr);
  grid-gap: 0.9rem;
  gap: 0.9rem;
}

.landing-decision-story {
  display: grid;
  grid-gap: 0.85rem;
  gap: 0.85rem;
  padding: 1rem;
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  border-radius: 22px;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--surface) 92%, transparent), color-mix(in srgb, var(--surface-2) 82%, transparent));
  box-shadow: 0 20px 38px color-mix(in srgb, var(--shadow-strong) 10%, transparent);
}

.landing-steps-grid-v3 {
  margin-top: 0;
}

.landing-steps-grid-v3::before {
  top: 1.05rem;
}

.landing-steps-grid-v3 .landing-step-v2 {
  min-height: 170px;
  transition-property: transform, box-shadow, border-color, background-color;
  transition-duration: 0.22s;
  transition-timing-function: cubic-bezier(0.2, 0, 0, 1);
}

.landing-steps-grid-v3 .landing-step-v2:hover {
  box-shadow: 0 14px 28px color-mix(in srgb, var(--shadow-strong) 10%, transparent);
}

.landing-decision-support {
  grid-template-columns: 1fr;
}

.landing-cap-card--cta {
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--accent) 10%, transparent), transparent 60%),
    color-mix(in srgb, var(--surface) 88%, transparent);
}

.landing-cap-card--cta .btn-secondary {
  margin-top: 0.35rem;
  min-height: 40px;
}

.landing-close-cta-v2 {
  gap: 1.2rem;
  align-items: center;
}

.landing-close-copy {
  display: grid;
  grid-gap: 0.3rem;
  gap: 0.3rem;
  max-width: 60ch;
}

.landing-close-proof {
  margin: 0.35rem 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-gap: 0.45rem;
  gap: 0.45rem;
}

.landing-close-proof li {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  color: var(--ink-muted);
}

.landing-close-proof li::before {
  content: "";
  width: 10px;
  height: 10px;
  margin-top: 0.35rem;
  border-radius: 50%;
  background: var(--landing-runway-light);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--landing-runway-light) 20%, transparent);
  flex: 0 0 auto;
}

.landing-cap-card,
.landing-metric-v2,
.landing-step-v2,
.landing-demo-card,
.landing-conv-trust span,
.landing-close-cta-v2,
.landing-proof-cred,
.landing-decision-story {
  transition-property: transform, box-shadow, border-color, background-color, opacity;
  transition-duration: 0.22s;
  transition-timing-function: cubic-bezier(0.2, 0, 0, 1);
}

.landing-cap-card:active,
.landing-metric-v2:active,
.landing-step-v2:active,
.landing-demo-card:active {
  transform: scale(0.96);
}

.landing-metric-v2:hover,
.landing-demo-card:hover,
.landing-proof-cred:hover,
.landing-close-cta-v2:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 32px color-mix(in srgb, var(--shadow-strong) 12%, transparent);
}

@media (max-width: 1100px) {
  .landing-conv-metrics-row,
  .landing-proof-grid-v2,
  .landing-decision-grid {
    grid-template-columns: 1fr;
  }

  .landing-proof-cred {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .landing-conv-trust,
  .landing-cta-row,
  .landing-demo-card-header,
  .landing-signal-foot--elevated {
    align-items: flex-start;
  }

  .landing-conv-metrics-row,
  .landing-proof-grid-v2 {
    grid-template-columns: 1fr;
  }

  .landing-conv-demo,
  .landing-proof-cred,
  .landing-decision-story,
  .landing-close-cta-v2 {
    padding: 0.9rem;
  }

  .landing-close-cta-v2 {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (prefers-reduced-motion: reduce) {
  .landing-cap-card,
  .landing-metric-v2,
  .landing-step-v2,
  .landing-demo-card,
  .landing-conv-trust span,
  .landing-close-cta-v2,
  .landing-proof-cred,
  .landing-decision-story {
    transition: none;
    transform: none;
  }
}

/* Puerta a puerta V1 */
.d2d-page {
  max-width: 1380px;
}

.d2d-page-header .page-title h1,
.d2d-hero h2 {
  font-family: "Playfair Display", serif;
}

.d2d-ops-panel {
  display: grid;
  grid-gap: 0.9rem;
  gap: 0.9rem;
}

.d2d-hero {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 0.34fr);
  grid-gap: 1rem;
  gap: 1rem;
  align-items: stretch;
  background:
    radial-gradient(circle at 12% 20%, color-mix(in srgb, var(--accent) 18%, transparent), transparent 42%),
    radial-gradient(circle at 92% 15%, color-mix(in srgb, var(--accent-2) 18%, transparent), transparent 38%),
    linear-gradient(145deg, color-mix(in srgb, var(--surface) 88%, var(--panel-bg) 12%), color-mix(in srgb, var(--surface-2) 82%, var(--surface) 18%));
}

.d2d-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: repeating-linear-gradient(90deg, transparent 0 52px, color-mix(in srgb, var(--accent-2) 18%, transparent) 52px 53px, transparent 53px 104px);
  opacity: 0.35;
}

.d2d-hero > * {
  position: relative;
  z-index: 1;
}

.d2d-mini-kicker,
.d2d-option-kicker {
  display: inline-flex;
  align-items: center;
  width: max-content;
  border: 1px solid color-mix(in srgb, var(--border) 76%, var(--accent) 24%);
  border-radius: 999px;
  padding: 0.16rem 0.5rem;
  color: var(--ink-muted);
  font-family: "IBM Plex Mono", "IBM Plex Sans", monospace;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.d2d-hero h2 {
  margin: 0.55rem 0 0.4rem;
  font-size: clamp(1.55rem, 3vw, 2.8rem);
  line-height: 0.98;
}

.d2d-hero p {
  max-width: 62rem;
  color: var(--ink-muted);
  line-height: 1.62;
}

.d2d-hero-ticket {
  display: grid;
  grid-gap: 0.22rem;
  gap: 0.22rem;
  align-content: center;
  border: 1px dashed color-mix(in srgb, var(--border) 82%, var(--accent-2) 18%);
  border-radius: 18px;
  padding: 1rem;
  background: color-mix(in srgb, var(--surface) 84%, transparent);
}

.d2d-hero-ticket strong {
  font-family: "IBM Plex Mono", "IBM Plex Sans", monospace;
  font-size: 1.35rem;
}

@media (max-width: 720px) {
  .d2d-hero {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.8rem;
  }

  .d2d-hero h2 {
    max-width: 12ch;
    font-size: clamp(1.9rem, 8vw, 2.45rem);
    line-height: 1.04;
    text-wrap: balance;
  }

  .d2d-hero p {
    max-width: none;
  }

  .d2d-hero-ticket {
    padding: 0.85rem 0.95rem;
  }

  .d2d-hero-ticket strong {
    font-size: 1.08rem;
  }
}

.d2d-ops-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.d2d-ops-summary span {
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--border) 74%, transparent);
  padding: 0.25rem 0.62rem;
  font-size: 0.79rem;
  color: var(--ink-muted);
  background: color-mix(in srgb, var(--surface) 94%, transparent);
}

.d2d-form,
.d2d-location-coords {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-gap: 0.8rem;
  gap: 0.8rem;
  align-items: end;
}

.d2d-filter-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(188px, 1fr));
  grid-gap: 0.8rem;
  gap: 0.8rem;
  align-items: start;
  min-width: 0;
}

.d2d-form-essentials {
  gap: 0.85rem;
}

.d2d-form-essentials > .btn-primary {
  justify-self: start;
}

.d2d-essentials-head {
  grid-column: 1 / -1;
}

.d2d-filters-collapse {
  margin-top: 0.25rem;
}

.d2d-filters-collapse summary {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  cursor: pointer;
}

.d2d-filters-collapse summary span {
  color: var(--ink-muted);
  font-size: 0.84rem;
}

.d2d-filters-collapse[open] summary {
  margin-bottom: 0.7rem;
}

.d2d-filters-content {
  display: grid;
  grid-gap: 0.75rem;
  gap: 0.75rem;
  min-width: 0;
}

.d2d-filter-section {
  display: grid;
  grid-gap: 0.72rem;
  gap: 0.72rem;
  min-width: 0;
}

.d2d-filter-section + .d2d-filter-section {
  margin-top: 0.2rem;
  padding-top: 0.85rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
}

.d2d-filter-section-title {
  margin: 0;
  color: var(--ink-muted);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.d2d-filter-label {
  font-size: 0.86rem;
  font-weight: 500;
  color: var(--ink-muted);
  line-height: 1.28;
}

.d2d-filter-label-with-help {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  min-width: 0;
}

.d2d-filter-help {
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--border) 74%, var(--accent) 26%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: "IBM Plex Mono", "IBM Plex Sans", monospace;
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--ink-muted);
  background: color-mix(in srgb, var(--surface) 88%, var(--panel-bg) 12%);
  cursor: help;
}

.d2d-input-with-suffix {
  position: relative;
  min-width: 0;
}

.d2d-input-with-suffix .prefs-control,
.d2d-input-with-suffix .qs-input-neutral {
  width: 100%;
  padding-right: 2.3rem;
}

.d2d-input-suffix {
  position: absolute;
  top: 50%;
  right: 0.74rem;
  transform: translateY(-50%);
  color: var(--ink-muted);
  font-family: "IBM Plex Mono", "IBM Plex Sans", monospace;
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  pointer-events: none;
}

.d2d-checkbox-field {
  grid-column: span 2;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.55rem;
  min-height: 44px;
}

.d2d-autocomplete {
  position: relative;
}

.d2d-autocomplete-status {
  margin: 0.3rem 0 0;
  font-size: 0.78rem;
  color: var(--ink-muted);
}

.d2d-suggestions {
  position: absolute;
  z-index: 30;
  top: calc(100% + 0.35rem);
  left: 0;
  right: 0;
  display: grid;
  grid-gap: 0.25rem;
  gap: 0.25rem;
  padding: 0.45rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface) 96%, var(--panel-bg) 4%);
  box-shadow: 0 18px 34px var(--shadow-strong);
}

.d2d-suggestions button {
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--ink);
  text-align: left;
  padding: 0.5rem;
  cursor: pointer;
}

.d2d-suggestions button:hover,
.d2d-suggestions button:focus-visible {
  background: color-mix(in srgb, var(--surface-2) 78%, transparent);
  outline: 3px solid var(--color-input-focus);
  outline-offset: 2px;
}

.d2d-suggestions span,
.d2d-option-main p,
.d2d-history-list span {
  color: var(--ink-muted);
  font-size: 0.86rem;
}

.d2d-toggle-row,
.d2d-option-meta,
.d2d-option-sources,
.d2d-option-quick-badges {
  display: flex;
  gap: 0.45rem;
  flex-wrap: wrap;
  align-items: center;
  min-width: 0;
}

.d2d-toggle-row .field {
  flex: 1 1 220px;
  min-width: 0;
  display: grid;
  grid-gap: 0.42rem;
  gap: 0.42rem;
}

.d2d-form .field,
.d2d-filters-content .field {
  min-width: 0;
}

.d2d-filters-content .field {
  display: flex;
  flex-direction: column;
  gap: 0.42rem;
  font-weight: 500;
}

.d2d-form .field-hint,
.d2d-filters-content .field-hint {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.d2d-filters-content .prefs-control,
.d2d-filters-content .prefs-toggle,
.d2d-filters-content .qs-input-neutral {
  width: 100%;
  min-width: 0;
}

.d2d-filters-content :is(input, select, button):focus-visible {
  outline: 3px solid var(--color-input-focus);
  outline-offset: 2px;
}

.d2d-toggle-row .prefs-toggle {
  min-height: 44px;
  justify-content: flex-start;
  padding: 0.5rem 0.62rem;
}

.d2d-toggle-row .prefs-toggle-track {
  width: 46px;
  height: 26px;
}

.d2d-toggle-row .prefs-toggle-knob {
  width: 18px;
  height: 18px;
}

.d2d-toggle-row .prefs-toggle.is-on .prefs-toggle-track {
  background: color-mix(in srgb, #FFB000 32%, var(--surface));
  border-color: color-mix(in srgb, #FFB000 62%, var(--border));
}

.d2d-toggle-row .prefs-toggle.is-on .prefs-toggle-knob {
  background: #FFB000;
  border-color: color-mix(in srgb, #FFB000 80%, #1f1d1a);
  transform: translateX(18px);
}

.d2d-toggle-row .prefs-toggle.is-on {
  border-color: color-mix(in srgb, #FFB000 64%, var(--border));
  background: color-mix(in srgb, var(--surface) 88%, #FFB000 12%);
}

.d2d-state-card,
.d2d-loading-state,
.d2d-success-copy,
.d2d-no-coverage,
.d2d-error-state {
  margin-top: 1rem;
}

.d2d-empty-state {
  position: relative;
  overflow: hidden;
  min-height: 150px;
}

.d2d-radar-dot {
  position: absolute;
  right: 1rem;
  top: 1rem;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  border: 1px solid color-mix(in srgb, var(--accent-2) 42%, transparent);
  box-shadow: inset 0 0 0 18px color-mix(in srgb, var(--accent-2) 8%, transparent), 0 0 0 12px color-mix(in srgb, var(--accent) 6%, transparent);
}

.d2d-loading-state {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.d2d-loading-radar {
  position: relative;
  width: 76px;
  height: 76px;
  border-radius: 50%;
  border: 1px solid color-mix(in srgb, var(--accent-2) 45%, var(--border));
  background: radial-gradient(circle, color-mix(in srgb, var(--accent) 14%, transparent), transparent 60%);
}

.d2d-loading-radar span {
  position: absolute;
  inset: 12px;
  border-radius: 50%;
  border: 1px dashed color-mix(in srgb, var(--accent-2) 40%, transparent);
  animation: d2dRadar 2.8s linear infinite;
}

.d2d-loading-radar span:nth-child(2) { inset: 22px; animation-duration: 2.1s; }
.d2d-loading-radar span:nth-child(3) { inset: 32px; animation-duration: 1.6s; }


/* ── Phase 2: state personality ── */

/* Shared state entry animation */
.d2d-state-enter {
  animation: d2d-state-fade-in 0.4s ease-out both;
}

@keyframes d2d-state-fade-in {
  from { opacity: 0; transform: translateY(4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Empty state visual: animated route */
.d2d-empty-visual {
  display: flex;
  justify-content: center;
  padding: 1.25rem 0 0.5rem;
}

.d2d-empty-route {
  display: flex;
  align-items: center;
  gap: 0;
  animation: d2d-route-pulse 2.5s ease-in-out infinite;
}

.d2d-empty-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
}

.d2d-empty-origin {
  background: var(--accent);
  box-shadow: 0 0 6px color-mix(in srgb, var(--accent) 50%, transparent);
}

.d2d-empty-dest {
  background: var(--accent-2);
  box-shadow: 0 0 6px color-mix(in srgb, var(--accent-2) 50%, transparent);
}

.d2d-empty-line {
  width: 32px;
  height: 1.5px;
  background: var(--border);
  border-radius: 1px;
}

.d2d-empty-plane {
  font-size: 1.15rem;
  color: var(--accent);
  line-height: 1;
}

@keyframes d2d-route-pulse {
  0%, 100% { opacity: 0.7; }
  50% { opacity: 1; }
}

/* Loading state: skeleton cards */
.d2d-loading-header {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.d2d-loading-skeletons {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  margin-top: 1rem;
}

.d2d-skeleton-card {
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--panel-bg);
  padding: 0.85rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.d2d-skeleton-line {
  height: 0.7rem;
  border-radius: 6px;
  background: linear-gradient(
    90deg,
    color-mix(in srgb, var(--border) 50%, transparent) 25%,
    color-mix(in srgb, var(--border) 80%, transparent) 50%,
    color-mix(in srgb, var(--border) 50%, transparent) 75%
  );
  background-size: 200% 100%;
  animation: d2d-shimmer 1.5s ease-in-out infinite;
}

.d2d-skeleton-route {
  width: 55%;
}

.d2d-skeleton-meta {
  width: 80%;
}

.d2d-skeleton-price {
  width: 35%;
}

@keyframes d2d-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* Error state: friendly visual */
.d2d-error-visual {
  display: flex;
  justify-content: center;
  padding: 0.4rem 0;
}

.d2d-error-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  font-size: 1.5rem;
  color: var(--accent);
  animation: d2d-error-soft-pulse 2s ease-in-out infinite;
}

@keyframes d2d-error-soft-pulse {
  0%, 100% { opacity: 0.8; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.08); }
}


@media (prefers-reduced-motion: reduce) {
  .d2d-state-enter,
  .d2d-empty-route,
  .d2d-skeleton-line,
  .d2d-error-icon,
  .d2d-timeline-leg,
  .d2d-option-card,
  .d2d-sticky-bar,
  .d2d-compare-row-bar,
  .d2d-compare-bar-fill {
    animation: none !important;
    transition: none !important;
  }
}


/* ── Phase 3: connected timeline ── */

.d2d-connected-timeline {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  position: relative;
}

.d2d-timeline-leg {
  position: relative;
  padding-left: 2rem;
  animation: d2d-leg-reveal 0.35s ease-out both;
}

.d2d-timeline-leg:nth-child(1) { animation-delay: 0ms; }
.d2d-timeline-leg:nth-child(2) { animation-delay: 120ms; }
.d2d-timeline-leg:nth-child(3) { animation-delay: 240ms; }
.d2d-timeline-leg:nth-child(4) { animation-delay: 360ms; }

@keyframes d2d-leg-reveal {
  from { opacity: 0; transform: translateX(-6px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* Vertical connector line between legs */
.d2d-timeline-connector {
  position: absolute;
  left: 0.55rem;
  top: -0.85rem;
  height: 0.85rem;
  width: 1.5px;
  background: linear-gradient(to bottom, var(--accent), color-mix(in srgb, var(--border) 60%, transparent));
  border-radius: 1px;
}

/* Leg card base */
.d2d-leg-card {
  border-radius: 12px;
  overflow: hidden;
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 0.2s cubic-bezier(0.16, 1, 0.3, 1),
              border-color 0.2s ease;
}

.d2d-leg-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 16px var(--shadow);
}

.d2d-leg-card-inner {
  position: relative;
  padding: 0.65rem 0.85rem;
}

/* Flight segment: boarding-pass aesthetic */
.d2d-leg-flight {
  border-left: 3px solid var(--accent);
  background: linear-gradient(
    135deg,
    var(--panel-bg),
    color-mix(in srgb, var(--accent) 4%, var(--panel-bg))
  );
}

/* Ground segment: mode-adaptive */
.d2d-leg-ground {
  border-left: 3px solid var(--border);
  background: var(--panel-bg);
}

/* Mode-specific accent dots via ::before */
/* Connector dots on timeline leg (has position:relative) */
.d2d-timeline-leg::before {
  content: "";
  position: absolute;
  left: 0.55rem;
  top: 1.1rem;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--border);
  z-index: 1;
  transform: translateX(-50%);
}

.d2d-timeline-leg.is-ground::before {
  width: 8px;
  height: 8px;
  background: var(--border);
}

.d2d-timeline-leg.is-flight::before {
  width: 10px;
  height: 10px;
  background: var(--accent);
  box-shadow: 0 0 6px color-mix(in srgb, var(--accent) 45%, transparent);
}

/* Segment typography refinements */
.d2d-segment-main strong {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.92rem;
  color: var(--ink);
}

.d2d-segment-time {
  margin: 0.2rem 0 0;
  font-size: 0.82rem;
  color: var(--ink-muted);
}

.d2d-segment-meta {
  margin-top: 0.45rem;
}

/* Flight details strip */
.d2d-leg-flight .d2d-leg-card-inner {
  border-left: none;
  position: relative;
}

.d2d-leg-flight .d2d-leg-card-inner::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0.3rem;
  bottom: 0.3rem;
  width: 1px;
  background: repeating-linear-gradient(
    to bottom,
    color-mix(in srgb, var(--accent) 30%, transparent) 0,
    color-mix(in srgb, var(--accent) 30%, transparent) 3px,
    transparent 3px,
    transparent 6px
  );
  opacity: 0.4;
}

/* Responsive */
@media (max-width: 640px) {
  .d2d-timeline-leg {
    padding-left: 1.5rem;
  }

  .d2d-timeline-connector {
    left: 0.4rem;
  }
}


/* ── Phase 4: option card visual hierarchy ── */

/* Base card */
.d2d-option-card {
  position: relative;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: var(--panel-bg);
  padding: 1rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-gap: 0.85rem;
  gap: 0.85rem;
  align-items: start;
  cursor: pointer;
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 0.2s cubic-bezier(0.16, 1, 0.3, 1),
              border-color 0.2s ease,
              background 0.2s ease;
}

.d2d-option-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 20px var(--shadow);
  border-color: color-mix(in srgb, var(--accent) 30%, var(--border));
}

/* Preserve golden glow on hover for chosen cards */
.d2d-option-card.is-chosen:hover {
  box-shadow: 0 6px 20px var(--shadow), 0 0 14px color-mix(in srgb, var(--accent) 18%, transparent);
}

.d2d-option-card:focus-within {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

/* Real result: premium treatment */
.d2d-option-card.is-real {
  border-color: color-mix(in srgb, var(--accent-2) 30%, var(--border));
  background: linear-gradient(
    135deg,
    var(--panel-bg),
    color-mix(in srgb, var(--accent-2) 4%, var(--panel-bg))
  );
}

/* Deeplink: dashed border, info tone */
.d2d-option-card.is-deeplink {
  border-style: dashed;
  border-color: color-mix(in srgb, var(--accent-2) 20%, var(--border));
}

/* Estimate: muted, translucent */
.d2d-option-card.is-estimate {
  opacity: 0.84;
  border-color: transparent;
  background: color-mix(in srgb, var(--border) 20%, var(--panel-bg));
}

/* Chosen plan: golden glow */
.d2d-option-card.is-chosen {
  border-color: var(--accent);
  box-shadow: 0 0 14px color-mix(in srgb, var(--accent) 18%, transparent);
  background: linear-gradient(
    135deg,
    color-mix(in srgb, var(--accent) 6%, var(--panel-bg)),
    color-mix(in srgb, var(--accent) 3%, var(--panel-bg))
  );
}

/* Recommended star */
.d2d-recommended-star {
  position: absolute;
  top: 0.55rem;
  right: 0.8rem;
  color: var(--accent);
  font-size: 0.95rem;
  line-height: 1;
  z-index: 1;
  pointer-events: none;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.1));
}

/* Options stack spacing */
.d2d-options-stack {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

/* Option card inner sections */
.d2d-option-main {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  min-width: 0;
}

.d2d-option-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}

.d2d-option-head h3 {
  margin: 0.25rem 0 0;
  font-size: 1rem;
  font-weight: 700;
}

.d2d-option-trust-note {
  margin: 0;
  font-size: 0.78rem;
  color: var(--ink-muted);
  font-style: italic;
}

.d2d-option-quick-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.d2d-option-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem 0.65rem;
  font-size: 0.82rem;
  color: var(--ink-muted);
}

.d2d-option-price {
  font-size: 1rem;
  color: var(--ink);
}

.d2d-option-price-unconfirmed {
  color: var(--ink-muted);
}

.d2d-option-sources {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
}

.d2d-option-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.4rem;
  flex-shrink: 0;
}

.d2d-decision-reasons {
  border-top: 1px dashed var(--border);
  padding-top: 0.45rem;
}

.d2d-decision-reasons strong {
  display: block;
  font-size: 0.82rem;
  margin-bottom: 0.3rem;
  color: var(--ink);
}

.d2d-decision-reasons ul {
  margin: 0;
  padding-left: 1.1rem;
  display: grid;
  grid-gap: 0.2rem;
  gap: 0.2rem;
  font-size: 0.82rem;
  color: var(--ink-muted);
}

/* Touch devices: remove hover elevation */
@media (hover: none) {
  .d2d-option-card:hover {
    transform: none;
    box-shadow: none;
    border-color: var(--border);
  }
}


/* ── Phase 5: sticky decision bar ── */

.d2d-sticky-bar {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 25;
  background: color-mix(in srgb, var(--panel-bg) 94%, transparent);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border);
  padding: 0.45rem 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  animation: d2d-sticky-enter 0.25s ease-out;
  flex-wrap: wrap;
}

@keyframes d2d-sticky-enter {
  from { opacity: 0; transform: translateY(-100%); }
  to   { opacity: 1; transform: translateY(0); }
}

.d2d-sticky-summary {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-shrink: 0;
}

.d2d-sticky-plan-label {
  font-size: 0.9rem;
  color: var(--ink);
}

.d2d-sticky-metrics {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  font-size: 0.78rem;
  color: var(--ink-muted);
}

.d2d-sticky-metrics > span {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
}

.d2d-sticky-trust.success {
  color: var(--accent-2);
}

.d2d-sticky-trust.warning {
  color: var(--accent);
}

.d2d-sticky-nav {
  display: flex;
  gap: 0.2rem;
}

.d2d-sticky-nav-item {
  padding: 0.3rem 0.55rem;
  border-radius: 8px;
  font-size: 0.75rem;
  font-weight: 600;
  background: none;
  border: 1px solid transparent;
  color: var(--ink-muted);
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
  white-space: nowrap;
}

.d2d-sticky-nav-item:hover {
  background: color-mix(in srgb, var(--border) 30%, transparent);
  color: var(--ink);
}

.d2d-sticky-nav-item.is-active {
  background: var(--accent);
  color: var(--accent-ink);
  border-color: var(--accent);
}

/* Section scroll-margin for sticky bar */
#d2d-section-results,
#d2d-section-timeline,
#d2d-section-compare,
#d2d-section-maphub {
  scroll-margin-top: 56px;
}

/* Responsive */
@media (max-width: 768px) {
  .d2d-sticky-bar {
    flex-direction: column;
    padding: 0.4rem 0.75rem;
    gap: 0.4rem;
  }

  .d2d-sticky-summary {
    width: 100%;
    justify-content: space-between;
  }

  .d2d-sticky-nav {
    overflow-x: auto;
    width: 100%;
    -webkit-overflow-scrolling: touch;
  }

  .d2d-sticky-nav::-webkit-scrollbar {
    height: 0;
  }
}


/* ── Phase 6: comparator bars ── */

.d2d-compare-collapse {
  border: none;
}

.d2d-compare-collapse summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  padding: 0.35rem 0;
}

.d2d-compare-collapse summary::-webkit-details-marker {
  display: none;
}

.d2d-compare-chart {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-top: 0.5rem;
}

.d2d-compare-row-bar {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  padding: 0.75rem 0.85rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--panel-bg);
  animation: d2d-bar-grow 0.5s ease-out both;
}

.d2d-compare-row-bar:nth-child(1) { animation-delay: 0ms; }
.d2d-compare-row-bar:nth-child(2) { animation-delay: 80ms; }
.d2d-compare-row-bar:nth-child(3) { animation-delay: 160ms; }
.d2d-compare-row-bar:nth-child(4) { animation-delay: 240ms; }

@keyframes d2d-bar-grow {
  from { opacity: 0; transform: translateX(-4px); }
  to   { opacity: 1; transform: translateX(0); }
}

.d2d-compare-option {
  font-size: 0.92rem;
  color: var(--ink);
}

.d2d-compare-bars {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  grid-gap: 0.5rem;
  gap: 0.5rem;
}

.d2d-compare-bar-group {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  grid-gap: 0.4rem;
  gap: 0.4rem;
  font-size: 0.76rem;
}

.d2d-compare-bar-label {
  color: var(--ink-muted);
  white-space: nowrap;
  min-width: 4.5rem;
  text-transform: uppercase;
  font-size: 0.68rem;
  letter-spacing: 0.06em;
  font-weight: 600;
}

.d2d-compare-bar-track {
  height: 6px;
  border-radius: 3px;
  background: color-mix(in srgb, var(--border) 40%, transparent);
  overflow: hidden;
  min-width: 40px;
}

.d2d-compare-bar-fill {
  height: 100%;
  border-radius: 3px;
  min-width: 6px;
  transition: width 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.d2d-compare-bar-fill.is-better {
  background: var(--accent-2);
}

.d2d-compare-bar-fill.is-worse {
  background: var(--accent);
}


.d2d-compare-delta {
  font-weight: 600;
  white-space: nowrap;
  min-width: 3.5rem;
  text-align: right;
}

.d2d-compare-delta.is-better {
  color: var(--accent-2);
}

.d2d-compare-delta.is-worse {
  color: var(--accent);
}

/* Mobile: stack bars vertically, reduce gap */
@media (max-width: 640px) {
  .d2d-compare-bars {
    grid-template-columns: 1fr;
    gap: 0.35rem;
  }
}


/* ── Phase 7: filter slide-out panel ── */

.d2d-filters-header {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.d2d-filter-overlay {
  position: fixed;
  inset: 0;
  background: color-mix(in srgb, var(--ink) 32%, transparent);
  z-index: 30;
  animation: d2d-overlay-in 0.2s ease-out;
}

@keyframes d2d-overlay-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

.d2d-filter-slideout {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(380px, 92vw);
  z-index: 31;
  background: var(--panel-bg);
  border-left: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  animation: d2d-slide-in 0.28s cubic-bezier(0.16, 1, 0.3, 1);
  overflow-y: auto;
}

@keyframes d2d-slide-in {
  from { transform: translateX(100%); }
  to   { transform: translateX(0); }
}

.d2d-filter-slideout-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}

.d2d-filter-slideout-header h2 {
  margin: 0;
  font-size: 1.1rem;
}

.d2d-filter-slideout-body {
  padding: 1rem;
  flex: 1 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

/* Presets */
.d2d-filter-presets {
  padding-bottom: 0.85rem;
  border-bottom: 1px solid var(--border);
}

.d2d-filter-presets-label {
  display: block;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ink-muted);
  margin-bottom: 0.5rem;
}

.d2d-filter-preset-buttons {
  display: flex;
  gap: 0.4rem;
  flex-wrap: wrap;
}

/* Filter sections */
.d2d-filter-section {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.d2d-filter-section-title {
  margin: 0;
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--ink);
}

.d2d-filter-grid {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.d2d-toggle-row {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.d2d-filter-label {
  display: block;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--ink-muted);
  margin-bottom: 0.2rem;
}

.d2d-filter-label-with-help {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.d2d-filter-help {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  font-size: 0.65rem;
  font-weight: 700;
  color: var(--ink-muted);
  border: 1px solid var(--border);
  cursor: help;
}

.d2d-input-with-suffix {
  display: flex;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
  background: var(--input-bg);
}

.d2d-input-with-suffix input {
  flex: 1 1;
  border: none;
  padding: 0.45rem 0.55rem;
  font: inherit;
  background: transparent;
  color: var(--ink);
}

.d2d-input-suffix {
  padding: 0.45rem 0.55rem;
  font-size: 0.78rem;
  color: var(--ink-muted);
  background: color-mix(in srgb, var(--border) 30%, transparent);
}

/* Reduced-motion */
@media (prefers-reduced-motion: reduce) {
  .d2d-filter-overlay,
  .d2d-filter-slideout {
    animation: none !important;
  }
}

/* ══════════════════════════════════════════════════════════════
   Phase 8 — Route Visual (connected trace + IATA cards + draw animation)
   ══════════════════════════════════════════════════════════════ */

.d2d-route-visual {
  padding: 0.75rem 0 0.5rem;
  margin-bottom: 0.25rem;
}

/* ── Trace list ──────────────────────────────────────────── */
.d2d-route-trace {
  list-style: none;
  margin: 0;
  padding: 0.5rem 0.75rem;
  display: flex;
  align-items: center;
  gap: 0;
  overflow-x: auto;
}

/* ── Each segment (connector + node) ─────────────────────── */
.d2d-route-segment {
  display: flex;
  align-items: center;
  gap: 0;
  flex-shrink: 0;
  opacity: 0;
  animation: d2d-route-node-reveal 0.4s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
}

@keyframes d2d-route-node-reveal {
  0% {
    opacity: 0;
    transform: translateY(6px) scale(0.92);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* ── Connector line between nodes ────────────────────────── */
.d2d-route-connector {
  display: flex;
  align-items: center;
  gap: 0;
  min-width: 2rem;
  flex-shrink: 0;
}

.d2d-route-connector-line {
  display: block;
  height: 2px;
  min-width: 1.25rem;
  background: var(--border);
  position: relative;
  overflow: hidden;
}

.d2d-route-connector-line::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: left;
  animation: d2d-route-line-draw 0.55s 0.35s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
}

@keyframes d2d-route-line-draw {
  to { transform: scaleX(1); }
}

.d2d-route-connector-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  background: var(--panel-bg);
  border: 1.5px solid var(--border);
  color: var(--ink-muted);
  flex-shrink: 0;
  margin: 0 0.15rem;
  opacity: 0;
  animation: d2d-route-node-reveal 0.35s 0.2s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
}

/* ── Route node (boarding-pass style card) ───────────────── */
.d2d-route-node {
  display: flex;
  align-items: center;
  padding: 0.35rem 0.6rem;
  border-radius: 6px;
  background: var(--panel-bg);
  border: 1.5px solid var(--border);
  flex-shrink: 0;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.d2d-route-node.is-flight-node {
  border-color: color-mix(in srgb, var(--accent) 45%, transparent);
  background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 8%, var(--panel-bg)), var(--panel-bg));
}

.d2d-route-node.is-arrival-node {
  border-color: var(--accent-2);
  background: linear-gradient(135deg, color-mix(in srgb, var(--accent-2) 10%, var(--panel-bg)), var(--panel-bg));
}

.d2d-route-node.is-ground-node {
  border-style: dashed;
  border-color: color-mix(in srgb, var(--ink-muted) 35%, transparent);
}

/* ── IATA text inside node ───────────────────────────────── */
.d2d-route-iata {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--ink);
  white-space: nowrap;
}

.is-flight-node .d2d-route-iata {
  font-size: 0.88rem;
}

.d2d-route-plane-icon {
  color: var(--accent);
  flex-shrink: 0;
}

/* ── Mode labels row ─────────────────────────────────────── */
.d2d-route-labels {
  display: flex;
  align-items: center;
  gap: 0;
  padding: 0.15rem 0.75rem 0.25rem;
  overflow-x: auto;
}

.d2d-route-label {
  font-size: 0.68rem;
  font-weight: 500;
  color: var(--ink-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.1rem 0.55rem;
  white-space: nowrap;
  flex-shrink: 0;
  opacity: 0;
  animation: d2d-route-label-reveal 0.3s 0.3s ease forwards;
}

@keyframes d2d-route-label-reveal {
  to { opacity: 1; }
}

.d2d-route-label.is-flight-label {
  color: var(--accent);
  font-weight: 600;
}

/* ── Flight strip (compact IATA + dashes) ────────────────── */
.d2d-route-flight-strip {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.35rem 0.75rem 0.1rem;
  font-size: 0.72rem;
  color: var(--ink-muted);
}

.d2d-route-flight-strip-iata {
  font-weight: 700;
  letter-spacing: 0.05em;
  color: var(--ink);
  font-size: 0.78rem;
}

.d2d-route-flight-strip-line {
  display: flex;
  align-items: center;
  gap: 0.2rem;
  color: var(--accent);
}

.d2d-route-flight-strip-dash {
  width: 1rem;
  height: 1px;
  background: var(--border);
}

/* ── Reduced motion ──────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .d2d-route-segment,
  .d2d-route-label {
    animation: none;
    opacity: 1;
    transform: none;
  }
  .d2d-route-connector-line::after {
    animation: none;
    transform: scaleX(1);
  }
  .d2d-route-connector-icon {
    animation: none;
    opacity: 1;
  }
}

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 640px) {
  .d2d-route-trace {
    padding: 0.4rem 0.5rem;
  }
  .d2d-route-connector {
    min-width: 1.25rem;
  }
  .d2d-route-connector-line {
    min-width: 0.7rem;
  }
  .d2d-route-node {
    padding: 0.25rem 0.4rem;
  }
  .d2d-route-iata {
    font-size: 0.72rem;
  }
  .is-flight-node .d2d-route-iata {
    font-size: 0.76rem;
  }
}

/* ══════════════════════════════════════════════════════════════
   Phase 9 — Map Hub alive dashboard (horizontal scroll + live dots)
   ══════════════════════════════════════════════════════════════ */

/* ── Horizontal capability scroll ───────────────────────── */
.d2d-map-hub-scroll {
  display: flex;
  gap: 0.65rem;
  overflow-x: auto;
  padding: 0.5rem 0 0.75rem;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: var(--border) transparent;
}

.d2d-map-hub-scroll::-webkit-scrollbar {
  height: 4px;
}

.d2d-map-hub-scroll::-webkit-scrollbar-thumb {
  background: var(--border);
  border-radius: 2px;
}

/* ── Horizontal capability card ─────────────────────────── */
.d2d-map-card-horizontal {
  flex: 0 0 220px;
  scroll-snap-align: start;
  padding: 0.75rem;
  border-radius: 8px;
  border: 1.5px solid var(--border);
  background: var(--panel-bg);
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.d2d-map-card-horizontal:hover {
  border-color: var(--accent);
  box-shadow: 0 2px 12px color-mix(in srgb, var(--accent) 10%, transparent);
  transform: translateY(-1px);
}

.d2d-map-card-horizontal.is-available {
  border-color: color-mix(in srgb, var(--accent-2) 45%, transparent);
}

.d2d-map-card-horizontal.is-partial {
  border-color: color-mix(in srgb, var(--accent) 35%, transparent);
}

.d2d-map-card-horizontal strong {
  font-size: 0.8rem;
  line-height: 1.25;
  color: var(--ink);
}

.d2d-map-card-horizontal p {
  font-size: 0.7rem;
  color: var(--ink-muted);
  line-height: 1.35;
  flex: 1 1;
}

.d2d-capability-reason {
  font-size: 0.72rem;
  color: var(--ink-muted);
  line-height: 1.35;
  margin: 0.3rem 0 0;
  font-style: italic;
  opacity: 0.85;
  flex: none;
}

/* ── Card icon row ──────────────────────────────────────── */
.d2d-map-card-icon {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.d2d-capability-state-icon {
  font-size: 0.72rem;
  font-weight: 600;
  width: 1.2rem;
  height: 1.2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: 1.5px solid var(--border);
  color: var(--ink-muted);
}

.d2d-capability-state-icon.is-available {
  border-color: var(--accent-2);
  color: var(--accent-2);
  background: color-mix(in srgb, var(--accent-2) 12%, transparent);
}

.d2d-capability-state-icon.is-partial {
  border-color: var(--accent);
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 10%, transparent);
}

/* ── Live pulse dot ─────────────────────────────────────── */
.d2d-capability-dot.is-live {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--accent-2);
  flex-shrink: 0;
  animation: d2d-live-pulse 2s ease-in-out infinite;
}

@keyframes d2d-live-pulse {
  0%, 100% {
    box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent-2) 60%, transparent);
  }
  50% {
    box-shadow: 0 0 0 5px transparent;
  }
}

/* ── Capability status pill (compact) ───────────────────── */
.d2d-capability-pill {
  font-size: 0.62rem;
  align-self: flex-start;
  padding: 0.1rem 0.4rem;
}

/* ── Saved Places section (always visible) ──────────────── */
.d2d-saved-places-section {
  margin-top: 0.75rem;
  padding-top: 0.75rem;
  border-top: 1px solid var(--border);
}

.d2d-saved-places-section header {
  margin-bottom: 0.5rem;
}

.d2d-saved-places-section h3 {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.88rem;
  margin: 0 0 0.15rem;
  color: var(--ink);
}

/* ── Reduced motion ─────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .d2d-capability-dot.is-live {
    animation: none;
  }
}

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 640px) {
  .d2d-map-card-horizontal {
    flex: 0 0 185px;
    padding: 0.6rem;
  }
  .d2d-map-card-horizontal strong {
    font-size: 0.75rem;
  }
  .d2d-map-card-horizontal p {
    font-size: 0.66rem;
  }
}

/* ══════════════════════════════════════════════════════════════
   Phase 10 — Micro-interactions, final polish, dual-theme QA
   ══════════════════════════════════════════════════════════════ */

/* ── Button press compression ───────────────────────────── */
.btn-primary:active,
.btn-secondary:active,
.btn-ghost:active,
.btn-compact:active {
  transform: scale(0.97);
}

/* ── Section entry animation + stagger ──────────────────── */
.d2d-chosen-trust,
.d2d-results-section,
.d2d-option-comparator,
.d2d-estimate-section,
.d2d-map-hub {
  animation: d2d-section-enter 0.45s cubic-bezier(0.22, 0.61, 0.36, 1) both;
}

@keyframes d2d-section-enter {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.d2d-chosen-trust        { animation-delay: 0ms; }
.d2d-results-section     { animation-delay: 60ms; }
.d2d-option-comparator   { animation-delay: 120ms; }
.d2d-estimate-section    { animation-delay: 180ms; }
.d2d-map-hub             { animation-delay: 240ms; }

/* ── Status pill color transitions ──────────────────────── */
.status-pill {
  transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

/* ── Focus-visible ring for all interactive elements ────── */
:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: 2px;
}

/* ── Autocomplete smooth entry ──────────────────────────── */
.d2d-autocomplete .qs-autocomplete {
  animation: d2d-autocomplete-in 0.18s ease-out;
}

@keyframes d2d-autocomplete-in {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ── Chosen option enhanced transition ──────────────────── */
.d2d-option-card.is-chosen {
  transition: border-color 0.35s ease, box-shadow 0.35s ease, background 0.35s ease, transform 0.25s ease;
}

/* ── Trust modal animation ──────────────────────────────── */
.d2d-trust-overlay {
  animation: d2d-overlay-in 0.2s ease-out;
}

.d2d-trust-modal {
  animation: d2d-modal-enter 0.28s cubic-bezier(0.22, 0.61, 0.36, 1);
}

@keyframes d2d-modal-enter {
  from {
    opacity: 0;
    transform: scale(0.96) translateY(8px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

/* ── Comparator row bar animation enhancement ───────────── */
.d2d-compare-row-bar {
  animation: d2d-row-bar-reveal 0.4s cubic-bezier(0.22, 0.61, 0.36, 1) both;
}

.d2d-compare-row-bar:nth-child(1) { animation-delay: 0ms; }
.d2d-compare-row-bar:nth-child(2) { animation-delay: 80ms; }
.d2d-compare-row-bar:nth-child(3) { animation-delay: 160ms; }

@keyframes d2d-row-bar-reveal {
  from {
    opacity: 0;
    transform: translateX(-6px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* ── Touch device: remove hover elevation ───────────────── */
@media (hover: none) {
  .d2d-option-card:hover,
  .d2d-leg-card:hover,
  .d2d-map-card-horizontal:hover,
  .d2d-compare-row-bar:hover {
    transform: none;
    box-shadow: none;
  }
}

/* ── Mobile responsive refinements ──────────────────────── */
@media (max-width: 768px) {
  /* Sticky bar: collapse metrics, keep only label + price */
  .d2d-sticky-bar {
    flex-direction: column;
    padding: 0.4rem 0.5rem;
    gap: 0.25rem;
  }

  .d2d-sticky-summary {
    width: 100%;
    justify-content: space-between;
  }

  .d2d-sticky-metrics {
    gap: 0.4rem;
    font-size: 0.72rem;
  }

  .d2d-sticky-nav {
    overflow-x: auto;
    width: 100%;
    justify-content: flex-start;
  }

  /* Filter slide-out: full width */
  .d2d-filter-slideout {
    width: 100vw;
  }

  /* Comparator: thinner bars */
  .d2d-compare-bar-fill {
    height: 5px;
    border-radius: 2.5px;
  }

  .d2d-compare-bar-group {
    font-size: 0.7rem;
  }

  /* Map cards: stack vertically instead of horizontal scroll */
  .d2d-map-hub-scroll {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 0.5rem;
    gap: 0.5rem;
    overflow-x: visible;
    scroll-snap-type: none;
  }

  .d2d-map-card-horizontal {
    flex: none;
    scroll-snap-align: none;
  }

  /* Option cards: reduce padding */
  .d2d-option-card {
    padding: 0.65rem;
  }

  /* Comparator: hide collapse, always open */
  .d2d-compare-collapse {
    border: none;
    padding: 0;
  }

  .d2d-compare-collapse summary {
    pointer-events: none;
    cursor: default;
  }
}

@media (max-width: 480px) {
  /* Map cards: single column */
  .d2d-map-hub-scroll {
    grid-template-columns: 1fr;
  }

  /* Section delay: faster for mobile */
  .d2d-chosen-trust        { animation-delay: 0ms; }
  .d2d-results-section     { animation-delay: 30ms; }
  .d2d-option-comparator   { animation-delay: 60ms; }
  .d2d-estimate-section    { animation-delay: 90ms; }
  .d2d-map-hub             { animation-delay: 120ms; }
}

/* ══════════════════════════════════════════════════════════════
/* ══════════════════════════════════════════════════════════════
   Hoteles — Area Search & Results
   ══════════════════════════════════════════════════════════════ */

/* ── Search mode tabs ─────────────────────────────────────────── */
.hotel-search-mode-tabs {
  display: flex;
  gap: 0.45rem;
}

.hotel-search-mode-tab {
  flex: 1 1;
  padding: 0.55rem 1rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--ink-muted);
  cursor: pointer;
  transition: background 150ms ease, color 150ms ease, border-color 150ms ease;
  font-weight: 600;
  font-size: 0.88rem;
}

.hotel-search-mode-tab:hover {
  background: color-mix(in srgb, var(--surface-2) 80%, var(--surface));
  border-color: color-mix(in srgb, var(--accent) 28%, var(--border));
}

.hotel-search-mode-tab.is-active {
  background: color-mix(in srgb, var(--accent) 14%, var(--surface));
  border-color: color-mix(in srgb, var(--accent) 48%, var(--border));
  color: var(--accent);
}

.hotel-search-mode-tab:focus-visible {
  outline: 2px solid var(--border-focus);
  outline-offset: 2px;
}

/* ── Search grid ──────────────────────────────────────────────── */
.hotel-search-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 0.8rem;
  gap: 0.8rem;
  align-items: end;
}

.hotel-search-area-grid {
  grid-template-columns: 2fr 1fr 1fr 0.85fr;
}

/* ── Area autocomplete ────────────────────────────────────────── */
.hotel-area-autocomplete {
  position: relative;
}

.hotel-area-suggestions {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: var(--panel-bg);
  border: 1px solid var(--border);
  border-radius: 12px;
  z-index: 14;
  max-height: 210px;
  overflow-y: auto;
  margin-top: 0.3rem;
  list-style: none;
  padding: 0.25rem;
  box-shadow: 0 12px 28px var(--shadow);
}

.hotel-area-suggestion-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 0.6rem 0.75rem;
  background: none;
  border: none;
  border-radius: 10px;
  color: var(--ink);
  cursor: pointer;
  text-align: left;
  transition: background 120ms ease;
  font: inherit;
}

.hotel-area-suggestion-item:hover,
.hotel-area-suggestion-item:focus-visible {
  background: color-mix(in srgb, var(--surface-2) 80%, transparent);
  outline: none;
}

.hotel-area-spinner {
  position: absolute;
  right: 0.75rem;
  top: 50%;
  transform: translateY(-50%);
  width: 1rem;
  height: 1rem;
  border: 2px solid var(--border);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: hotel-spin 0.55s linear infinite;
}

@keyframes hotel-spin {
  from {
    transform: translateY(-50%) rotate(0deg);
  }
  to {
    transform: translateY(-50%) rotate(360deg);
  }
}

.hotel-area-resolved-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  margin-top: 0.35rem;
  font-size: 0.78rem;
  color: var(--accent);
  font-weight: 600;
}

/* ── Area results ─────────────────────────────────────────────── */
.hotel-area-results-list {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.hotel-area-result-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
}

.hotel-area-result-main {
  flex: 1 1;
  min-width: 0;
}

.hotel-area-result-price {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.25rem;
  flex-shrink: 0;
}


/* ── Provider toggle ─────────────────────────────────────────── */
.hotel-provider-toggle {
  display: grid;
}

.hotel-provider-toggle-row {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.55rem 0.7rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--surface);
  font-weight: 600;
  font-size: 0.88rem;
  color: var(--ink);
  cursor: pointer;
  transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
  box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.6);
}

.hotel-provider-toggle-row:hover {
  border-color: color-mix(in srgb, var(--accent) 38%, var(--border));
  background: color-mix(in srgb, var(--surface-2) 82%, var(--surface));
  box-shadow: 0 8px 18px var(--shadow);
}

.hotel-provider-toggle-row input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: var(--accent);
  cursor: pointer;
  flex-shrink: 0;
}

.hotel-provider-toggle-note,
.hotel-provider-context-note {
  display: block;
  margin-top: 0.45rem;
  max-width: 44rem;
}

.hotel-provider-context {
  display: grid;
  justify-items: end;
  grid-gap: 0.4rem;
  gap: 0.4rem;
}

:root[data-theme="dark"] .hotel-provider-toggle-row {
  border-color: var(--border);
  background: color-mix(in srgb, var(--surface) 90%, var(--surface-2) 10%);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25);
}

:root[data-theme="dark"] .hotel-provider-toggle-row:hover {
  border-color: color-mix(in srgb, var(--accent) 44%, var(--border));
  background: color-mix(in srgb, var(--surface-2) 86%, var(--surface) 14%);
}

.hotel-tracked-offers-list,
.hotel-comp-set-member-list,
.hotel-nearby-list {
  display: grid;
  grid-gap: 0.8rem;
  gap: 0.8rem;
}

.hotel-tracked-offer-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  grid-gap: 0.9rem;
  gap: 0.9rem;
}

.hotel-tracked-offer-copy {
  min-width: 0;
  display: grid;
  grid-gap: 0.45rem;
  gap: 0.45rem;
}

.hotel-tracked-offer-header,
.hotel-tracked-offer-price-row,
.hotel-comp-set-summary,
.hotel-nearby-item,
.hotel-comp-set-member-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
}

.hotel-tracked-offer-prices {
  display: grid;
  grid-gap: 0.35rem;
  gap: 0.35rem;
}

.hotel-tracked-offer-price-row {
  flex-wrap: wrap;
}

.hotel-tracked-offer-price-value {
  font-size: 1.05rem;
}

.hotel-tracked-offer-actions,
.hotel-comp-set-actions,
.hotel-nearby-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.55rem;
}

.hotel-tracked-offer-actions {
  flex-direction: column;
}

.hotel-tracked-offer-snapshots {
  grid-column: 1 / -1;
}

.hotel-comp-set-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.hotel-comp-set-item {
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface);
  color: var(--ink);
  padding: 0.45rem 0.85rem;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  transition: border-color 0.18s ease, background 0.18s ease, transform 0.18s ease;
}

.hotel-comp-set-item:hover,
.hotel-comp-set-item:focus-visible,
.hotel-comp-set-item.is-active {
  border-color: color-mix(in srgb, var(--accent) 42%, var(--border));
  background: color-mix(in srgb, var(--surface-2) 82%, var(--surface));
}

.hotel-comp-set-item:hover {
  transform: translateY(-1px);
}

.hotel-comp-set-active {
  display: grid;
  grid-gap: 0.8rem;
  gap: 0.8rem;
}

.hotel-comp-set-summary {
  flex-wrap: wrap;
}

.hotel-comp-set-eyebrow {
  display: inline-flex;
  margin-bottom: 0.25rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--accent);
}

.hotel-nearby-item {
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 0.8rem 0.95rem;
  background: color-mix(in srgb, var(--surface) 92%, var(--surface-2));
}

.hotel-nearby-copy {
  display: grid;
  grid-gap: 0.2rem;
  gap: 0.2rem;
}
/* ── Responsive ───────────────────────────────────────────────── */
@media (max-width: 740px) {
  .hotel-search-grid,
  .hotel-search-area-grid {
    grid-template-columns: 1fr;
  }

  .hotel-search-mode-tabs {
    flex-direction: column;
  }

  .hotel-provider-context {
    justify-items: start;
  }

  .hotel-tracked-offer-header,
  .hotel-nearby-item,
  .hotel-comp-set-member-item,
  .hotel-comp-set-summary {
    align-items: flex-start;
    flex-direction: column;
  }

  .hotel-tracked-offer-actions,
  .hotel-nearby-actions,
  .hotel-comp-set-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .hotel-tracked-offer-actions {
    flex-direction: row;
  }
}

@media (max-width: 980px) {
  .hotel-tracked-offer-item {
    grid-template-columns: 1fr;
  }

  .hotel-tracked-offer-actions {
    flex-direction: row;
    justify-content: flex-start;
  }
}

/* Comprehensive reduced-motion (all d2d-* animations) */
@media (prefers-reduced-motion: reduce) {
  /* Phase 10 additions */
  .d2d-chosen-trust,
  .d2d-results-section,
  .d2d-option-comparator,
  .d2d-estimate-section,
  .d2d-map-hub,
  .d2d-trust-overlay,
  .d2d-trust-modal,
  .d2d-compare-row-bar,
  .d2d-autocomplete .qs-autocomplete {
    animation: none !important;
    transition: none !important;
    opacity: 1;
    transform: none;
  }

  /* Phase 4-6 remnants not covered by individual blocks */
  .d2d-option-card.is-chosen,
  .d2d-compare-bar-fill,
  .d2d-sticky-bar,
  /* Button press */
  .btn-primary:active,
  .btn-secondary:active,
  .btn-ghost:active,
  .btn-compact:active {
    transform: none;
    transition: none;
  }

  /* Status pills */
  .status-pill {
    transition: none;
  }
}

/* Watchlist polish — incremental hierarchy and tactility */
.watchlist-page {
  position: relative;
}

.watchlist-page-header-shell {
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.05rem;
  border: 1px solid color-mix(in srgb, var(--border) 76%, transparent);
  border-radius: calc(var(--radius-xl) - 2px);
  background:
    radial-gradient(circle at 12% 18%, color-mix(in srgb, var(--accent) 8%, transparent), transparent 34%),
    radial-gradient(circle at 88% 12%, color-mix(in srgb, var(--accent-2) 10%, transparent), transparent 28%),
    linear-gradient(145deg, color-mix(in srgb, var(--surface) 94%, transparent), color-mix(in srgb, var(--surface-2) 82%, transparent));
  box-shadow:
    0 18px 38px color-mix(in srgb, var(--shadow-strong) 12%, transparent),
    inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.watchlist-page-title {
  display: grid;
  grid-gap: 0.18rem;
  gap: 0.18rem;
}

.watchlist-page-title h1,
.watchlist-page .panel-title {
  text-wrap: balance;
}

.watchlist-page-title p {
  text-wrap: pretty;
}

.watchlist-back-link,
.watchlist-add-cta {
  min-height: 42px;
}

.watchlist-back-link {
  border-color: color-mix(in srgb, var(--border) 82%, transparent);
  background: color-mix(in srgb, var(--surface) 84%, var(--surface-2));
}

.watchlist-add-cta {
  box-shadow:
    0 16px 28px color-mix(in srgb, var(--accent) 20%, transparent),
    inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

.watchlist-notice-stack {
  display: grid;
  grid-gap: 0.65rem;
  gap: 0.65rem;
}

.watchlist-notice {
  margin: 0;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--border) 76%, transparent);
  box-shadow: 0 12px 24px color-mix(in srgb, var(--shadow-strong) 8%, transparent);
}

.watchlist-notice strong,
.watchlist-notice p {
  margin: 0;
}

.watchlist-notice--hint {
  align-items: center;
}

.watchlist-notice--freshness,
.watchlist-notice--message {
  padding-inline: 0.9rem;
}

.watchlist-cockpit-grid {
  gap: 1.1rem;
}

.watchlist-area > .panel {
  border-radius: calc(var(--radius-lg) + 2px);
  border-color: color-mix(in srgb, var(--border) 70%, transparent);
  box-shadow:
    0 16px 34px color-mix(in srgb, var(--shadow-strong) 10%, transparent),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.watch-smart-panel {
  gap: 0.9rem;
}

.watch-smart-panel-header {
  gap: 0.9rem;
}

.watch-smart-count-pill,
.watch-smart-meta,
.watch-route-code,
.watch-date,
.watch-inline-price,
.watch-meta-chip,
.watch-price,
.price-drop-badge,
.watch-detail-metric > strong,
.watch-detail-operational-item,
.compare-count {
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

.watch-smart-tools {
  gap: 0.65rem;
  align-items: stretch;
}

.watch-smart-tool-group {
  display: flex;
  align-items: flex-end;
  gap: 0.55rem;
  padding: 0.55rem 0.6rem;
  border: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
  border-radius: 16px;
  background: color-mix(in srgb, var(--surface) 92%, transparent);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

.watch-smart-tool-group--filters {
  flex: 1 1 360px;
  flex-wrap: wrap;
}

.watch-smart-tool-group--selection {
  margin-left: auto;
}

.watch-smart-tool-group--calendar {
  margin-left: auto;
}

.watch-smart-search input,
.watch-smart-sort select,
.watch-smart-calendar-toggle {
  min-height: 42px;
}

.watch-smart-search input,
.watch-smart-sort select {
  box-shadow:
    0 8px 20px color-mix(in srgb, var(--shadow) 8%, transparent),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
  transition-property: border-color, background-color, box-shadow, transform;
  transition-duration: 0.22s;
  transition-timing-function: cubic-bezier(0.2, 0, 0, 1);
}

.watch-smart-search input:focus,
.watch-smart-sort select:focus {
  border-color: color-mix(in srgb, var(--accent) 56%, var(--border));
  box-shadow:
    0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent),
    0 10px 24px color-mix(in srgb, var(--shadow-strong) 10%, transparent);
  outline: none;
}

.watch-bulk-toolbar {
  align-items: center;
  gap: 0.5rem;
}

.watch-row {
  padding: 0.82rem 0.85rem;
  border-color: color-mix(in srgb, var(--border) 54%, transparent);
  background:
    linear-gradient(150deg, color-mix(in srgb, var(--surface) 94%, transparent), color-mix(in srgb, var(--surface-2) 76%, transparent));
  box-shadow:
    0 10px 22px color-mix(in srgb, var(--shadow-strong) 7%, transparent),
    inset 0 1px 0 rgba(255, 255, 255, 0.18);
  transition-property: transform, box-shadow, background-color, border-color;
  transition-duration: 0.24s;
  transition-timing-function: cubic-bezier(0.2, 0, 0, 1);
  will-change: transform;
}

.watch-row:hover {
  transform: translateX(3px);
  box-shadow:
    0 16px 28px color-mix(in srgb, var(--shadow-strong) 12%, transparent),
    inset 0 1px 0 rgba(255, 255, 255, 0.24);
}

.watch-row:active {
  transform: translateX(2px) scale(0.96);
}

.watch-row[data-selected="true"] {
  border-color: color-mix(in srgb, var(--accent-2) 44%, var(--border));
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--surface) 86%, transparent), color-mix(in srgb, var(--accent-2) 8%, var(--surface-2)));
  box-shadow:
    0 18px 30px color-mix(in srgb, var(--shadow-strong) 12%, transparent),
    inset 0 0 0 1px color-mix(in srgb, var(--accent-2) 22%, transparent);
}

.watch-route {
  gap: 0.5rem;
}

.watch-route-code {
  letter-spacing: 0.01em;
}

.watch-meta {
  gap: 0.42rem;
}

.watch-meta-chip {
  background: color-mix(in srgb, var(--surface) 78%, var(--surface-2));
}

.watch-note {
  max-width: 58ch;
}

.watch-price-area {
  gap: 0.55rem;
}

.watch-row-actions .alert-actions > .btn-compact,
.watch-bulk-toolbar > .btn-compact,
.watch-detail-actions > .btn-compact {
  min-height: 40px;
}

.watch-detail-panel {
  gap: 0.82rem;
}

.watch-detail-title-block {
  display: grid;
  grid-gap: 0.15rem;
  gap: 0.15rem;
}

.watch-detail-hero {
  padding: 0.8rem 0.85rem;
  border-radius: 18px;
  border-color: color-mix(in srgb, var(--border) 74%, transparent);
  box-shadow:
    0 12px 24px color-mix(in srgb, var(--shadow-strong) 8%, transparent),
    inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.watch-detail-hero-status {
  min-height: 32px;
}

.watch-detail-block--primary {
  padding: 0.25rem 0;
}

.watch-detail-metric {
  border-radius: 16px;
  min-height: 64px;
  box-shadow:
    0 10px 20px color-mix(in srgb, var(--shadow-strong) 6%, transparent),
    inset 0 1px 0 rgba(255, 255, 255, 0.16);
}

.watch-detail-metric--primary {
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--surface) 84%, transparent), color-mix(in srgb, var(--accent) 8%, var(--surface-2)));
  border-color: color-mix(in srgb, var(--accent) 30%, var(--border));
}

.watch-detail-operational-item {
  padding: 0.45rem 0.55rem;
  border-radius: 12px;
  background: color-mix(in srgb, var(--surface) 90%, transparent);
}

.watch-detail-confidence,
.compare-panel,
.watch-map-panel {
  box-shadow:
    0 14px 28px color-mix(in srgb, var(--shadow-strong) 9%, transparent),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.watch-detail-empty-state {
  border-radius: 18px;
  padding: 0.95rem;
}

.history-panel .panel-header,
.watch-map-panel .panel-header,
.compare-panel .panel-header {
  align-items: flex-start;
}

.watch-map-panel {
  border-radius: calc(var(--radius-lg) + 2px);
}

.compare-panel {
  border-radius: calc(var(--radius-lg) + 2px);
}

.compare-panel .compare-selector {
  margin-top: 0.2rem;
}

.compare-option {
  min-height: 44px;
  border-radius: 14px;
  transition-property: transform, box-shadow, border-color, background-color;
  transition-duration: 0.22s;
  transition-timing-function: cubic-bezier(0.2, 0, 0, 1);
}

.compare-option:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 24px color-mix(in srgb, var(--shadow-strong) 8%, transparent);
}

.compare-option:active {
  transform: scale(0.96);
}

@media (max-width: 1120px) {
  .watch-smart-tool-group--selection,
  .watch-smart-tool-group--calendar {
    margin-left: 0;
  }
}

@media (max-width: 768px) {
  .watchlist-page-header-shell {
    padding: 0.85rem;
  }

  .watch-smart-tool-group {
    width: 100%;
  }

  .watch-smart-tool-group--filters {
    flex: 1 1 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .watchlist-page-header-shell,
  .watchlist-notice,
  .watch-smart-search input,
  .watch-smart-sort select,
  .watch-row,
  .compare-option {
    transition: none;
    animation: none;
    transform: none;
    will-change: auto;
  }
}

/*!******************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[3]!./src/styles/quick-search-dual.css ***!
  \******************************************************************************************************************************************************************************************************************************************************************************/
/* ═══════════════════════════════════════════════════════════════════════════
   Quick-Search Dual‑Panel Layout
   ────────────────────────────────────────────────────────────────────────────
   Desktop (≥900px): side‑by‑side grid with a central divider.
   Mobile  (<900px): stacked panels, each collapsible via a toggle in its header.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Grid container ───────────────────────────────────────────────────── */

.qs-dual-workspace {
  display: grid;
  grid-template-columns: 1fr 1px 1fr;
  grid-gap: 0;
  gap: 0;
  width: 100%;
  min-height: 320px;
  position: relative;
  isolation: isolate;
}

/* ── Individual panels ────────────────────────────────────────────────── */

.qs-dual-panel {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 12px 16px 16px;
  position: relative;
}

.qs-dual-panel--outbound {
  padding-right: 14px;
}

.qs-dual-panel--return {
  padding-left: 14px;
}

/* ── Panel header ─────────────────────────────────────────────────────── */

.qs-dual-panel__header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-bottom: 10px;
  margin-bottom: 8px;
  border-bottom: 1px solid var(--color-border-subtle, rgba(128,128,128,0.18));
}

.qs-dual-panel__header-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  flex-shrink: 0;
}

.qs-dual-panel--outbound .qs-dual-panel__header-icon {
  background: var(--qs-outbound-tint, rgba(72,149,239,0.12));
  color: var(--qs-outbound-ink, #4895ef);
}

.qs-dual-panel--return .qs-dual-panel__header-icon {
  background: var(--qs-return-tint, rgba(247,127,0,0.12));
  color: var(--qs-return-ink, #f77f00);
}

.qs-dual-panel__header-label {
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  opacity: 0.7;
}

.qs-dual-panel__header-route {
  font-size: 0.9rem;
  font-weight: 600;
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 4px;
}

.qs-dual-panel__header-route .qs-inline-icon {
  width: 14px;
  height: 14px;
  opacity: 0.5;
}

.qs-dual-panel__header-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--color-surface-raised, rgba(255,255,255,0.06));
  font-size: 0.72rem;
  font-weight: 600;
  line-height: 1;
}

.qs-dual-panel__date {
  font-size: 0.75rem;
  opacity: 0.5;
  margin-bottom: 8px;
}

/* ── Panel body (scroll area) ─────────────────────────────────────────── */

.qs-dual-panel__body {
  flex: 1 1;
  overflow-y: auto;
  min-height: 0;
}

.qs-dual-view-controls {
  display: grid;
  grid-gap: 0.8rem;
  gap: 0.8rem;
  padding: 0.85rem 0.95rem;
  margin-bottom: 0.9rem;
  border: 1px solid var(--color-border-subtle, rgba(128,128,128,0.14));
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface, rgba(255,255,255,0.04)) 92%, transparent);
}

.qs-dual-view-controls__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}

.qs-dual-view-controls__head strong {
  display: block;
  font-size: 0.86rem;
}

.qs-dual-view-controls__head p {
  margin: 0.18rem 0 0;
  font-size: 0.78rem;
  color: var(--color-text-secondary, rgba(128,128,128,0.72));
}

.qs-dual-view-controls__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 0.75rem;
  gap: 0.75rem;
}

.qs-dual-view-controls .field {
  display: grid;
  grid-gap: 0.35rem;
  gap: 0.35rem;
}

/* ── Panel footer (pagination) ──────────────────────────────────────── */

.qs-dual-panel__footer {
  padding-top: 8px;
  margin-top: 4px;
  border-top: 1px solid var(--color-border-subtle, rgba(128,128,128,0.12));
}

/* ── Central divider ──────────────────────────────────────────────────── */

.qs-dual-divider {
  position: relative;
  width: 1px;
  background: var(--color-border-subtle, rgba(128,128,128,0.16));
}

.qs-dual-divider::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 2px;
  height: 64px;
  border-radius: 1px;
  background: linear-gradient(
    to bottom,
    transparent 0%,
    var(--qs-outbound-ink, #4895ef) 15%,
    var(--qs-return-ink, #f77f00) 85%,
    transparent 100%
  );
  opacity: 0.5;
}

/* ── Combined price banner ────────────────────────────────────────────── */

.qs-dual-combined {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 8px 16px;
  background: var(--color-surface-raised, rgba(255,255,255,0.04));
  border-top: 1px solid var(--color-border-subtle, rgba(128,128,128,0.12));
  font-size: 0.82rem;
  order: 1;
}

.qs-dual-combined__label {
  opacity: 0.65;
}

.qs-dual-combined__price {
  font-weight: 700;
  font-size: 0.95rem;
  background: linear-gradient(135deg, var(--qs-outbound-ink, #4895ef), var(--qs-return-ink, #f77f00));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.qs-dual-combined__save {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  border: 1px solid var(--color-accent, #4895ef);
  border-radius: 8px;
  background: var(--color-accent, #4895ef);
  color: #fff;
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 150ms, transform 120ms, box-shadow 150ms;
  margin-left: 12px;
}

.qs-dual-combined__save:hover:not(:disabled) {
  background: color-mix(in srgb, var(--color-accent, #4895ef) 85%, black);
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(72, 149, 239, 0.3);
}

.qs-dual-combined__save:active:not(:disabled) {
  transform: translateY(0);
  box-shadow: none;
}

.qs-dual-combined__save:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
}

.qs-dual-combined__saving {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.qs-spinner {
  animation: qs-spin 0.8s linear infinite;
}

@keyframes qs-spin {
  to {
    transform: rotate(360deg);
  }
}

/* ── Sync toggle ─────────────────────────────────────────────────────── */

.qs-dual-sync {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  padding: 4px 16px 6px;
  order: 0;
}

.qs-dual-sync__toggle {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  border: 1px solid var(--color-border-subtle, rgba(128,128,128,0.16));
  border-radius: 6px;
  background: transparent;
  color: var(--color-text-secondary, rgba(128,128,128,0.6));
  font-size: 0.72rem;
  font-weight: 500;
  cursor: pointer;
  transition: background 120ms, color 120ms, border-color 120ms;
}

.qs-dual-sync__toggle:hover {
  background: var(--color-surface-raised, rgba(255,255,255,0.04));
  color: var(--color-text-primary);
}

.qs-dual-sync__toggle--active {
  border-color: var(--color-accent, #4895ef);
  color: var(--color-accent, #4895ef);
}

/* ── Pagination per panel ─────────────────────────────────────────────── */

.qs-dual-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding-top: 10px;
  margin-top: 8px;
  border-top: 1px solid var(--color-border-subtle, rgba(128,128,128,0.10));
}

.qs-dual-pagination__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 32px;
  padding: 0 8px;
  border: 1px solid var(--color-border-subtle, rgba(128,128,128,0.18));
  border-radius: 6px;
  background: transparent;
  color: var(--color-text-primary);
  font-size: 0.78rem;
  font-weight: 500;
  cursor: pointer;
  transition: background 120ms, border-color 120ms;
}

.qs-dual-pagination__btn:hover {
  background: var(--color-surface-raised, rgba(255,255,255,0.06));
}

.qs-dual-pagination__btn:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

.qs-dual-pagination__btn--active {
  background: var(--color-accent, #4895ef);
  border-color: var(--color-accent, #4895ef);
  color: #fff;
  font-weight: 600;
}

.qs-dual-pagination__info {
  font-size: 0.75rem;
  opacity: 0.55;
  padding: 0 6px;
}

/* ── Responsive (mobile) ──────────────────────────────────────────────── */

@media (max-width: 899px) {
  .qs-dual-workspace {
    grid-template-columns: 1fr;
  }

  .qs-dual-divider {
    width: 100%;
    height: 1px;
    margin: 8px 0;
  }

  .qs-dual-divider::after {
    width: 64px;
    height: 2px;
    background: linear-gradient(
      to right,
      transparent 0%,
      var(--qs-outbound-ink, #4895ef) 15%,
      var(--qs-return-ink, #f77f00) 85%,
      transparent 100%
    );
  }

  .qs-dual-panel--outbound {
    padding-right: 16px;
  }

  .qs-dual-panel--return {
    padding-left: 16px;
  }

  .qs-dual-view-controls__grid {
    grid-template-columns: 1fr;
  }

  .qs-dual-panel__header {
    cursor: pointer;
  }

  .qs-dual-panel--collapsed .qs-dual-panel__body {
    display: none;
  }

  .qs-dual-panel__collapse-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 6px 0;
    border: none;
    background: transparent;
    color: var(--color-text-secondary, rgba(128,128,128,0.6));
    cursor: pointer;
  }

  .qs-dual-panel__collapse-btn:hover {
    color: var(--color-text-primary);
  }
}

/*!********************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[3]!./src/styles/globals.css ***!
  \********************************************************************************************************************************************************************************************************************************************************************/


/*!*******************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[3]!./node_modules/maplibre-gl/dist/maplibre-gl.css ***!
  \*******************************************************************************************************************************************************************************************************************************************************************************************/
.maplibregl-map{font:12px/20px Helvetica Neue,Arial,Helvetica,sans-serif;overflow:hidden;position:relative;-webkit-tap-highlight-color:rgb(0 0 0/0)}.maplibregl-canvas{left:0;position:absolute;top:0}.maplibregl-map:-webkit-full-screen{height:100%;width:100%}.maplibregl-map:fullscreen{height:100%;width:100%}.maplibregl-ctrl-group button.maplibregl-ctrl-compass{touch-action:none}.maplibregl-canvas-container.maplibregl-interactive,.maplibregl-ctrl-group button.maplibregl-ctrl-compass{cursor:-webkit-grab;cursor:grab;-webkit-user-select:none;-moz-user-select:none;user-select:none}.maplibregl-canvas-container.maplibregl-interactive.maplibregl-track-pointer{cursor:pointer}.maplibregl-canvas-container.maplibregl-interactive:active,.maplibregl-ctrl-group button.maplibregl-ctrl-compass:active{cursor:-webkit-grabbing;cursor:grabbing}.maplibregl-canvas-container.maplibregl-touch-zoom-rotate,.maplibregl-canvas-container.maplibregl-touch-zoom-rotate .maplibregl-canvas{touch-action:pan-x pan-y}.maplibregl-canvas-container.maplibregl-touch-drag-pan,.maplibregl-canvas-container.maplibregl-touch-drag-pan .maplibregl-canvas{touch-action:pinch-zoom}.maplibregl-canvas-container.maplibregl-touch-zoom-rotate.maplibregl-touch-drag-pan,.maplibregl-canvas-container.maplibregl-touch-zoom-rotate.maplibregl-touch-drag-pan .maplibregl-canvas{touch-action:none}.maplibregl-canvas-container.maplibregl-touch-drag-pan.maplibregl-cooperative-gestures,.maplibregl-canvas-container.maplibregl-touch-drag-pan.maplibregl-cooperative-gestures .maplibregl-canvas{touch-action:pan-x pan-y}.maplibregl-ctrl-bottom-left,.maplibregl-ctrl-bottom-right,.maplibregl-ctrl-top-left,.maplibregl-ctrl-top-right{pointer-events:none;position:absolute;z-index:2}.maplibregl-ctrl-top-left{left:0;top:0}.maplibregl-ctrl-top-right{right:0;top:0}.maplibregl-ctrl-bottom-left{bottom:0;left:0}.maplibregl-ctrl-bottom-right{bottom:0;right:0}.maplibregl-ctrl{clear:both;pointer-events:auto;transform:translate(0)}.maplibregl-ctrl-top-left .maplibregl-ctrl{float:left;margin:10px 0 0 10px}.maplibregl-ctrl-top-right .maplibregl-ctrl{float:right;margin:10px 10px 0 0}.maplibregl-ctrl-bottom-left .maplibregl-ctrl{float:left;margin:0 0 10px 10px}.maplibregl-ctrl-bottom-right .maplibregl-ctrl{float:right;margin:0 10px 10px 0}.maplibregl-ctrl-group{background:#fff;border-radius:4px}.maplibregl-ctrl-group:not(:empty){box-shadow:0 0 0 2px rgba(0,0,0,.1)}@media (forced-colors:active){.maplibregl-ctrl-group:not(:empty){box-shadow:0 0 0 2px ButtonText}}.maplibregl-ctrl-group button{background-color:transparent;border:0;box-sizing:border-box;cursor:pointer;display:block;height:29px;outline:none;padding:0;width:29px}.maplibregl-ctrl-group button+button{border-top:1px solid #ddd}.maplibregl-ctrl button .maplibregl-ctrl-icon{background-position:50%;background-repeat:no-repeat;display:block;height:100%;width:100%}@media (forced-colors:active){.maplibregl-ctrl-icon{background-color:transparent}.maplibregl-ctrl-group button+button{border-top:1px solid ButtonText}}.maplibregl-ctrl button::-moz-focus-inner{border:0;padding:0}.maplibregl-ctrl-attrib-button:focus,.maplibregl-ctrl-group button:focus{box-shadow:0 0 2px 2px #0096ff}.maplibregl-ctrl button:disabled{cursor:not-allowed}.maplibregl-ctrl button:disabled .maplibregl-ctrl-icon{opacity:.25}@media (hover:hover){.maplibregl-ctrl button:not(:disabled):hover{background-color:rgba(0,0,0,.05)}}.maplibregl-ctrl button:not(:disabled):active{background-color:rgba(0,0,0,.05)}.maplibregl-ctrl-group button:focus:focus-visible{box-shadow:0 0 2px 2px #0096ff}.maplibregl-ctrl-group button:focus:not(:focus-visible){box-shadow:none}.maplibregl-ctrl-group button:focus:first-child{border-radius:4px 4px 0 0}.maplibregl-ctrl-group button:focus:last-child{border-radius:0 0 4px 4px}.maplibregl-ctrl-group button:focus:only-child{border-radius:inherit}.maplibregl-ctrl button.maplibregl-ctrl-zoom-out .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23333' viewBox='0 0 29 29'%3E%3Cpath d='M10 13c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h9c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13z'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-zoom-in .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23333' viewBox='0 0 29 29'%3E%3Cpath d='M14.5 8.5c-.75 0-1.5.75-1.5 1.5v3h-3c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h3v3c0 .75.75 1.5 1.5 1.5S16 19.75 16 19v-3h3c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-3v-3c0-.75-.75-1.5-1.5-1.5'/%3E%3C/svg%3E")}@media (forced-colors:active){.maplibregl-ctrl button.maplibregl-ctrl-zoom-out .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M10 13c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h9c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13z'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-zoom-in .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M14.5 8.5c-.75 0-1.5.75-1.5 1.5v3h-3c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h3v3c0 .75.75 1.5 1.5 1.5S16 19.75 16 19v-3h3c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-3v-3c0-.75-.75-1.5-1.5-1.5'/%3E%3C/svg%3E")}}@media (forced-colors:active) and (prefers-color-scheme:light){.maplibregl-ctrl button.maplibregl-ctrl-zoom-out .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' viewBox='0 0 29 29'%3E%3Cpath d='M10 13c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h9c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13z'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-zoom-in .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' viewBox='0 0 29 29'%3E%3Cpath d='M14.5 8.5c-.75 0-1.5.75-1.5 1.5v3h-3c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h3v3c0 .75.75 1.5 1.5 1.5S16 19.75 16 19v-3h3c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-3v-3c0-.75-.75-1.5-1.5-1.5'/%3E%3C/svg%3E")}}.maplibregl-ctrl button.maplibregl-ctrl-fullscreen .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23333' viewBox='0 0 29 29'%3E%3Cpath d='M24 16v5.5c0 1.75-.75 2.5-2.5 2.5H16v-1l3-1.5-4-5.5 1-1 5.5 4 1.5-3zM6 16l1.5 3 5.5-4 1 1-4 5.5 3 1.5v1H7.5C5.75 24 5 23.25 5 21.5V16zm7-11v1l-3 1.5 4 5.5-1 1-5.5-4L6 13H5V7.5C5 5.75 5.75 5 7.5 5zm11 2.5c0-1.75-.75-2.5-2.5-2.5H16v1l3 1.5-4 5.5 1 1 5.5-4 1.5 3h1z'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-shrink .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' viewBox='0 0 29 29'%3E%3Cpath d='M18.5 16c-1.75 0-2.5.75-2.5 2.5V24h1l1.5-3 5.5 4 1-1-4-5.5 3-1.5v-1zM13 18.5c0-1.75-.75-2.5-2.5-2.5H5v1l3 1.5L4 24l1 1 5.5-4 1.5 3h1zm3-8c0 1.75.75 2.5 2.5 2.5H24v-1l-3-1.5L25 5l-1-1-5.5 4L17 5h-1zM10.5 13c1.75 0 2.5-.75 2.5-2.5V5h-1l-1.5 3L5 4 4 5l4 5.5L5 12v1z'/%3E%3C/svg%3E")}@media (forced-colors:active){.maplibregl-ctrl button.maplibregl-ctrl-fullscreen .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M24 16v5.5c0 1.75-.75 2.5-2.5 2.5H16v-1l3-1.5-4-5.5 1-1 5.5 4 1.5-3zM6 16l1.5 3 5.5-4 1 1-4 5.5 3 1.5v1H7.5C5.75 24 5 23.25 5 21.5V16zm7-11v1l-3 1.5 4 5.5-1 1-5.5-4L6 13H5V7.5C5 5.75 5.75 5 7.5 5zm11 2.5c0-1.75-.75-2.5-2.5-2.5H16v1l3 1.5-4 5.5 1 1 5.5-4 1.5 3h1z'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-shrink .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M18.5 16c-1.75 0-2.5.75-2.5 2.5V24h1l1.5-3 5.5 4 1-1-4-5.5 3-1.5v-1zM13 18.5c0-1.75-.75-2.5-2.5-2.5H5v1l3 1.5L4 24l1 1 5.5-4 1.5 3h1zm3-8c0 1.75.75 2.5 2.5 2.5H24v-1l-3-1.5L25 5l-1-1-5.5 4L17 5h-1zM10.5 13c1.75 0 2.5-.75 2.5-2.5V5h-1l-1.5 3L5 4 4 5l4 5.5L5 12v1z'/%3E%3C/svg%3E")}}@media (forced-colors:active) and (prefers-color-scheme:light){.maplibregl-ctrl button.maplibregl-ctrl-fullscreen .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' viewBox='0 0 29 29'%3E%3Cpath d='M24 16v5.5c0 1.75-.75 2.5-2.5 2.5H16v-1l3-1.5-4-5.5 1-1 5.5 4 1.5-3zM6 16l1.5 3 5.5-4 1 1-4 5.5 3 1.5v1H7.5C5.75 24 5 23.25 5 21.5V16zm7-11v1l-3 1.5 4 5.5-1 1-5.5-4L6 13H5V7.5C5 5.75 5.75 5 7.5 5zm11 2.5c0-1.75-.75-2.5-2.5-2.5H16v1l3 1.5-4 5.5 1 1 5.5-4 1.5 3h1z'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-shrink .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' viewBox='0 0 29 29'%3E%3Cpath d='M18.5 16c-1.75 0-2.5.75-2.5 2.5V24h1l1.5-3 5.5 4 1-1-4-5.5 3-1.5v-1zM13 18.5c0-1.75-.75-2.5-2.5-2.5H5v1l3 1.5L4 24l1 1 5.5-4 1.5 3h1zm3-8c0 1.75.75 2.5 2.5 2.5H24v-1l-3-1.5L25 5l-1-1-5.5 4L17 5h-1zM10.5 13c1.75 0 2.5-.75 2.5-2.5V5h-1l-1.5 3L5 4 4 5l4 5.5L5 12v1z'/%3E%3C/svg%3E")}}.maplibregl-ctrl button.maplibregl-ctrl-compass .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23333' viewBox='0 0 29 29'%3E%3Cpath d='m10.5 14 4-8 4 8z'/%3E%3Cpath fill='%23ccc' d='m10.5 16 4 8 4-8z'/%3E%3C/svg%3E")}@media (forced-colors:active){.maplibregl-ctrl button.maplibregl-ctrl-compass .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='m10.5 14 4-8 4 8z'/%3E%3Cpath fill='%23ccc' d='m10.5 16 4 8 4-8z'/%3E%3C/svg%3E")}}@media (forced-colors:active) and (prefers-color-scheme:light){.maplibregl-ctrl button.maplibregl-ctrl-compass .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' viewBox='0 0 29 29'%3E%3Cpath d='m10.5 14 4-8 4 8z'/%3E%3Cpath fill='%23ccc' d='m10.5 16 4 8 4-8z'/%3E%3C/svg%3E")}}.maplibregl-ctrl button.maplibregl-ctrl-globe .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' fill='none' stroke='%23333' viewBox='0 0 22 22'%3E%3Ccircle cx='11' cy='11' r='8.5'/%3E%3Cpath d='M17.5 11c0 4.819-3.02 8.5-6.5 8.5S4.5 15.819 4.5 11 7.52 2.5 11 2.5s6.5 3.681 6.5 8.5Z'/%3E%3Cpath d='M13.5 11c0 2.447-.331 4.64-.853 6.206-.262.785-.562 1.384-.872 1.777-.314.399-.58.517-.775.517s-.461-.118-.775-.517c-.31-.393-.61-.992-.872-1.777C8.831 15.64 8.5 13.446 8.5 11s.331-4.64.853-6.206c.262-.785.562-1.384.872-1.777.314-.399.58-.517.775-.517s.461.118.775.517c.31.393.61.992.872 1.777.522 1.565.853 3.76.853 6.206Z'/%3E%3Cpath d='M11 7.5c-1.909 0-3.622-.166-4.845-.428-.616-.132-1.08-.283-1.379-.434a1.3 1.3 0 0 1-.224-.138q.07-.058.224-.138c.299-.151.763-.302 1.379-.434C7.378 5.666 9.091 5.5 11 5.5s3.622.166 4.845.428c.616.132 1.08.283 1.379.434.105.053.177.1.224.138q-.07.058-.224.138c-.299.151-.763.302-1.379.434-1.223.262-2.936.428-4.845.428ZM4.486 6.436ZM11 16.5c-1.909 0-3.622-.166-4.845-.428-.616-.132-1.08-.283-1.379-.434a1.3 1.3 0 0 1-.224-.138 1.3 1.3 0 0 1 .224-.138c.299-.151.763-.302 1.379-.434C7.378 14.666 9.091 14.5 11 14.5s3.622.166 4.845.428c.616.132 1.08.283 1.379.434.105.053.177.1.224.138a1.3 1.3 0 0 1-.224.138c-.299.151-.763.302-1.379.434-1.223.262-2.936.428-4.845.428Zm-6.514-1.064ZM11 12.5c-2.46 0-4.672-.222-6.255-.574-.796-.177-1.406-.38-1.805-.59a1.5 1.5 0 0 1-.39-.272.3.3 0 0 1-.047-.064.3.3 0 0 1 .048-.064c.066-.073.189-.167.389-.272.399-.21 1.009-.413 1.805-.59C6.328 9.722 8.54 9.5 11 9.5s4.672.222 6.256.574c.795.177 1.405.38 1.804.59.2.105.323.2.39.272a.3.3 0 0 1 .047.064.3.3 0 0 1-.048.064 1.4 1.4 0 0 1-.389.272c-.399.21-1.009.413-1.804.59-1.584.352-3.796.574-6.256.574Zm-8.501-1.51v.002zm0 .018v.002zm17.002.002v-.002zm0-.018v-.002z'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-globe-enabled .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' fill='none' stroke='%2333b5e5' viewBox='0 0 22 22'%3E%3Ccircle cx='11' cy='11' r='8.5'/%3E%3Cpath d='M17.5 11c0 4.819-3.02 8.5-6.5 8.5S4.5 15.819 4.5 11 7.52 2.5 11 2.5s6.5 3.681 6.5 8.5Z'/%3E%3Cpath d='M13.5 11c0 2.447-.331 4.64-.853 6.206-.262.785-.562 1.384-.872 1.777-.314.399-.58.517-.775.517s-.461-.118-.775-.517c-.31-.393-.61-.992-.872-1.777C8.831 15.64 8.5 13.446 8.5 11s.331-4.64.853-6.206c.262-.785.562-1.384.872-1.777.314-.399.58-.517.775-.517s.461.118.775.517c.31.393.61.992.872 1.777.522 1.565.853 3.76.853 6.206Z'/%3E%3Cpath d='M11 7.5c-1.909 0-3.622-.166-4.845-.428-.616-.132-1.08-.283-1.379-.434a1.3 1.3 0 0 1-.224-.138q.07-.058.224-.138c.299-.151.763-.302 1.379-.434C7.378 5.666 9.091 5.5 11 5.5s3.622.166 4.845.428c.616.132 1.08.283 1.379.434.105.053.177.1.224.138q-.07.058-.224.138c-.299.151-.763.302-1.379.434-1.223.262-2.936.428-4.845.428ZM4.486 6.436ZM11 16.5c-1.909 0-3.622-.166-4.845-.428-.616-.132-1.08-.283-1.379-.434a1.3 1.3 0 0 1-.224-.138 1.3 1.3 0 0 1 .224-.138c.299-.151.763-.302 1.379-.434C7.378 14.666 9.091 14.5 11 14.5s3.622.166 4.845.428c.616.132 1.08.283 1.379.434.105.053.177.1.224.138a1.3 1.3 0 0 1-.224.138c-.299.151-.763.302-1.379.434-1.223.262-2.936.428-4.845.428Zm-6.514-1.064ZM11 12.5c-2.46 0-4.672-.222-6.255-.574-.796-.177-1.406-.38-1.805-.59a1.5 1.5 0 0 1-.39-.272.3.3 0 0 1-.047-.064.3.3 0 0 1 .048-.064c.066-.073.189-.167.389-.272.399-.21 1.009-.413 1.805-.59C6.328 9.722 8.54 9.5 11 9.5s4.672.222 6.256.574c.795.177 1.405.38 1.804.59.2.105.323.2.39.272a.3.3 0 0 1 .047.064.3.3 0 0 1-.048.064 1.4 1.4 0 0 1-.389.272c-.399.21-1.009.413-1.804.59-1.584.352-3.796.574-6.256.574Zm-8.501-1.51v.002zm0 .018v.002zm17.002.002v-.002zm0-.018v-.002z'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-terrain .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' fill='%23333' viewBox='0 0 22 22'%3E%3Cpath d='m1.754 13.406 4.453-4.851 3.09 3.09 3.281 3.277.969-.969-3.309-3.312 3.844-4.121 6.148 6.886h1.082v-.855l-7.207-8.07-4.84 5.187L6.169 6.57l-5.48 5.965v.871ZM.688 16.844h20.625v1.375H.688Zm0 0'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-terrain-enabled .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' fill='%2333b5e5' viewBox='0 0 22 22'%3E%3Cpath d='m1.754 13.406 4.453-4.851 3.09 3.09 3.281 3.277.969-.969-3.309-3.312 3.844-4.121 6.148 6.886h1.082v-.855l-7.207-8.07-4.84 5.187L6.169 6.57l-5.48 5.965v.871ZM.688 16.844h20.625v1.375H.688Zm0 0'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23333' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate:disabled .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23aaa' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3Cpath fill='red' d='m14 5 1 1-9 9-1-1z'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-active .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%2333b5e5' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-active-error .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23e58978' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-background .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%2333b5e5' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-background-error .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23e54e33' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-waiting .maplibregl-ctrl-icon{animation:maplibregl-spin 2s linear infinite}@media (forced-colors:active){.maplibregl-ctrl button.maplibregl-ctrl-geolocate .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23fff' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate:disabled .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23999' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3Cpath fill='red' d='m14 5 1 1-9 9-1-1z'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-active .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%2333b5e5' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-active-error .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23e58978' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-background .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%2333b5e5' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-background-error .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23e54e33' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3C/svg%3E")}}@media (forced-colors:active) and (prefers-color-scheme:light){.maplibregl-ctrl button.maplibregl-ctrl-geolocate .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate:disabled .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23666' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3Cpath fill='red' d='m14 5 1 1-9 9-1-1z'/%3E%3C/svg%3E")}}@keyframes maplibregl-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}a.maplibregl-ctrl-logo{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='88' height='23' fill='none'%3E%3Cpath fill='%23000' fill-opacity='.4' fill-rule='evenodd' d='M17.408 16.796h-1.827l2.501-12.095h.198l3.324 6.533.988 2.19.988-2.19 3.258-6.533h.181l2.6 12.095h-1.81l-1.218-5.644-.362-1.71-.658 1.71-2.929 5.644h-.098l-2.914-5.644-.757-1.71-.345 1.71zm1.958-3.42-.726 3.663a1.255 1.255 0 0 1-1.232 1.011h-1.827a1.255 1.255 0 0 1-1.229-1.509l2.501-12.095a1.255 1.255 0 0 1 1.23-1.001h.197a1.25 1.25 0 0 1 1.12.685l3.19 6.273 3.125-6.263a1.25 1.25 0 0 1 1.123-.695h.181a1.255 1.255 0 0 1 1.227.991l1.443 6.71a5 5 0 0 1 .314-.787l.009-.016a4.6 4.6 0 0 1 1.777-1.887c.782-.46 1.668-.667 2.611-.667a4.6 4.6 0 0 1 1.7.32l.306.134c.21-.16.474-.256.759-.256h1.694a1.255 1.255 0 0 1 1.212.925 1.255 1.255 0 0 1 1.212-.925h1.711c.284 0 .545.094.755.252.613-.3 1.312-.45 2.075-.45 1.356 0 2.557.445 3.482 1.4q.47.48.763 1.064V4.701a1.255 1.255 0 0 1 1.255-1.255h1.86A1.255 1.255 0 0 1 54.44 4.7v9.194h2.217c.19 0 .37.043.532.118v-4.77c0-.356.147-.678.385-.906a2.42 2.42 0 0 1-.682-1.71c0-.665.267-1.253.735-1.7a2.45 2.45 0 0 1 1.722-.674 2.43 2.43 0 0 1 1.705.675q.318.302.504.683V4.7a1.255 1.255 0 0 1 1.255-1.255h1.744A1.255 1.255 0 0 1 65.812 4.7v3.335a4.8 4.8 0 0 1 1.526-.246c.938 0 1.817.214 2.59.69a4.47 4.47 0 0 1 1.67 1.743v-.98a1.255 1.255 0 0 1 1.256-1.256h1.777c.233 0 .451.064.639.174a3.4 3.4 0 0 1 1.567-.372c.346 0 .861.02 1.285.232a1.25 1.25 0 0 1 .689 1.004 4.7 4.7 0 0 1 .853-.588c.795-.44 1.675-.647 2.61-.647 1.385 0 2.65.39 3.525 1.396.836.938 1.168 2.173 1.168 3.528q-.001.515-.056 1.051a1.255 1.255 0 0 1-.947 1.09l.408.952a1.255 1.255 0 0 1-.477 1.552c-.418.268-.92.463-1.458.612-.613.171-1.304.244-2.049.244-1.06 0-2.043-.207-2.886-.698l-.015-.008c-.798-.48-1.419-1.135-1.818-1.963l-.004-.008a5.8 5.8 0 0 1-.548-2.512q0-.429.053-.843a1.3 1.3 0 0 1-.333-.086l-.166-.004c-.223 0-.426.062-.643.228-.03.024-.142.139-.142.59v3.883a1.255 1.255 0 0 1-1.256 1.256h-1.777a1.255 1.255 0 0 1-1.256-1.256V15.69l-.032.057a4.8 4.8 0 0 1-1.86 1.833 5.04 5.04 0 0 1-2.484.634 4.5 4.5 0 0 1-1.935-.424 1.25 1.25 0 0 1-.764.258h-1.71a1.255 1.255 0 0 1-1.256-1.255V7.687a2.4 2.4 0 0 1-.428.625c.253.23.412.561.412.93v7.553a1.255 1.255 0 0 1-1.256 1.255h-1.843a1.25 1.25 0 0 1-.894-.373c-.228.23-.544.373-.894.373H51.32a1.255 1.255 0 0 1-1.256-1.255v-1.251l-.061.117a4.7 4.7 0 0 1-1.782 1.884 4.77 4.77 0 0 1-2.485.67 5.6 5.6 0 0 1-1.485-.188l.009 2.764a1.255 1.255 0 0 1-1.255 1.259h-1.729a1.255 1.255 0 0 1-1.255-1.255v-3.537a1.255 1.255 0 0 1-1.167.793h-1.679a1.25 1.25 0 0 1-.77-.263 4.5 4.5 0 0 1-1.945.429c-.885 0-1.724-.21-2.495-.632l-.017-.01a5 5 0 0 1-1.081-.836 1.255 1.255 0 0 1-1.254 1.312h-1.81a1.255 1.255 0 0 1-1.228-.99l-.782-3.625-2.044 3.939a1.25 1.25 0 0 1-1.115.676h-.098a1.25 1.25 0 0 1-1.116-.68l-2.061-3.994zM35.92 16.63l.207-.114.223-.15q.493-.356.735-.785l.061-.118.033 1.332h1.678V9.242h-1.694l-.033 1.267q-.133-.329-.526-.658l-.032-.028a3.2 3.2 0 0 0-.668-.428l-.27-.12a3.3 3.3 0 0 0-1.235-.23q-1.136-.001-1.974.493a3.36 3.36 0 0 0-1.3 1.382q-.445.89-.444 2.074 0 1.2.51 2.107a3.8 3.8 0 0 0 1.382 1.381 3.9 3.9 0 0 0 1.893.477q.795 0 1.455-.33zm-2.789-5.38q-.576.675-.575 1.762 0 1.102.559 1.794.576.675 1.645.675a2.25 2.25 0 0 0 .934-.19 2.2 2.2 0 0 0 .468-.29l.178-.161a2.2 2.2 0 0 0 .397-.561q.244-.5.244-1.15v-.115q0-.708-.296-1.267l-.043-.077a2.2 2.2 0 0 0-.633-.709l-.13-.086-.047-.028a2.1 2.1 0 0 0-1.073-.285q-1.052 0-1.629.692zm2.316 2.706c.163-.17.28-.407.28-.83v-.114c0-.292-.06-.508-.15-.68a.96.96 0 0 0-.353-.389.85.85 0 0 0-.464-.127c-.4 0-.56.114-.664.239l-.01.012c-.148.174-.275.45-.275.945 0 .506.122.801.27.99.097.11.266.224.68.224.303 0 .504-.09.687-.269zm7.545 1.705a2.6 2.6 0 0 0 .331.423q.319.33.755.548l.173.074q.65.255 1.49.255 1.02 0 1.844-.493a3.45 3.45 0 0 0 1.316-1.4q.493-.904.493-2.089 0-1.909-.988-2.913-.988-1.02-2.584-1.02-.898 0-1.575.347a3 3 0 0 0-.415.262l-.199.166a3.4 3.4 0 0 0-.64.82V9.242h-1.712v11.553h1.729l-.017-5.134zm.53-1.138q.206.29.48.5l.155.11.053.034q.51.296 1.119.297 1.07 0 1.645-.675.577-.69.576-1.762 0-1.119-.576-1.777-.558-.675-1.645-.675-.435 0-.835.16a2 2 0 0 0-.284.136 2 2 0 0 0-.363.254 2.2 2.2 0 0 0-.46.569l-.082.162a2.6 2.6 0 0 0-.213 1.072v.115q0 .707.296 1.267l.135.211zm.964-.818a1.1 1.1 0 0 0 .367.385.94.94 0 0 0 .476.118c.423 0 .59-.117.687-.23.159-.194.28-.478.28-.95 0-.53-.133-.8-.266-.952l-.021-.025c-.078-.094-.231-.221-.68-.221a1 1 0 0 0-.503.135l-.012.007a.86.86 0 0 0-.335.343c-.073.133-.132.324-.132.614v.115a1.4 1.4 0 0 0 .14.66zm15.7-6.222q.347-.346.346-.856a1.05 1.05 0 0 0-.345-.79 1.18 1.18 0 0 0-.84-.329q-.51 0-.855.33a1.05 1.05 0 0 0-.346.79q0 .51.346.855.345.346.856.346.51 0 .839-.346zm4.337 9.314.033-1.332q.191.403.59.747l.098.081a4 4 0 0 0 .316.224l.223.122a3.2 3.2 0 0 0 1.44.322 3.8 3.8 0 0 0 1.875-.477 3.5 3.5 0 0 0 1.382-1.366q.527-.89.526-2.09 0-1.184-.444-2.073a3.24 3.24 0 0 0-1.283-1.399q-.823-.51-1.942-.51a3.5 3.5 0 0 0-1.527.344l-.086.043-.165.09a3 3 0 0 0-.33.214q-.432.315-.656.707a2 2 0 0 0-.099.198l.082-1.283V4.701h-1.744v12.095zm.473-2.509a2.5 2.5 0 0 0 .566.7q.117.098.245.18l.144.08a2.1 2.1 0 0 0 .975.232q1.07 0 1.645-.675.576-.69.576-1.778 0-1.102-.576-1.777-.56-.691-1.645-.692a2.2 2.2 0 0 0-1.015.235q-.22.113-.415.282l-.15.142a2.1 2.1 0 0 0-.42.594q-.223.479-.223 1.1v.115q0 .705.293 1.26zm2.616-.293c.157-.191.28-.479.28-.967 0-.51-.13-.79-.276-.961l-.021-.026c-.082-.1-.232-.225-.67-.225a.87.87 0 0 0-.681.279l-.012.011c-.154.155-.274.38-.274.807v.115c0 .285.057.499.144.669a1.1 1.1 0 0 0 .367.405c.137.082.28.123.455.123.423 0 .59-.118.686-.23zm8.266-3.013q.345-.13.724-.14l.069-.002q.493 0 .642.099l.247-1.794q-.196-.099-.717-.099a2.3 2.3 0 0 0-.545.063 2 2 0 0 0-.411.148 2.2 2.2 0 0 0-.4.249 2.5 2.5 0 0 0-.485.499 2.7 2.7 0 0 0-.32.581l-.05.137v-1.48h-1.778v7.553h1.777v-3.884q0-.546.159-.943a1.5 1.5 0 0 1 .466-.636 2.5 2.5 0 0 1 .399-.253 2 2 0 0 1 .224-.099zm9.784 2.656.05-.922q0-1.743-.856-2.698-.838-.97-2.584-.97-1.119-.001-2.007.493a3.46 3.46 0 0 0-1.4 1.382q-.493.906-.493 2.106 0 1.07.428 1.975.428.89 1.332 1.432.906.526 2.255.526.973 0 1.668-.185l.044-.012.135-.04q.613-.184.984-.421l-.542-1.267q-.3.162-.642.274l-.297.087q-.51.131-1.3.131-.954 0-1.497-.444a1.6 1.6 0 0 1-.192-.193q-.366-.44-.512-1.234l-.004-.021zm-5.427-1.256-.003.022h3.752v-.138q-.011-.727-.288-1.118a1 1 0 0 0-.156-.176q-.46-.428-1.316-.428-.986 0-1.494.604-.379.45-.494 1.234zm-27.053 2.77V4.7h-1.86v12.095h5.333V15.15zm7.103-5.908v7.553h-1.843V9.242h1.843z'/%3E%3Cpath fill='%23fff' d='m19.63 11.151-.757-1.71-.345 1.71-1.12 5.644h-1.827L18.083 4.7h.197l3.325 6.533.988 2.19.988-2.19L26.839 4.7h.181l2.6 12.095h-1.81l-1.218-5.644-.362-1.71-.658 1.71-2.93 5.644h-.098l-2.913-5.644zm14.836 5.81q-1.02 0-1.893-.478a3.8 3.8 0 0 1-1.381-1.382q-.51-.906-.51-2.106 0-1.185.444-2.074a3.36 3.36 0 0 1 1.3-1.382q.839-.494 1.974-.494a3.3 3.3 0 0 1 1.234.231 3.3 3.3 0 0 1 .97.575q.396.33.527.659l.033-1.267h1.694v7.553H37.18l-.033-1.332q-.279.593-1.02 1.053a3.17 3.17 0 0 1-1.662.444zm.296-1.482q.938 0 1.58-.642.642-.66.642-1.711v-.115q0-.708-.296-1.267a2.2 2.2 0 0 0-.807-.872 2.1 2.1 0 0 0-1.119-.313q-1.053 0-1.629.692-.575.675-.575 1.76 0 1.103.559 1.795.577.675 1.645.675zm6.521-6.237h1.711v1.4q.906-1.597 2.83-1.597 1.596 0 2.584 1.02.988 1.005.988 2.914 0 1.185-.493 2.09a3.46 3.46 0 0 1-1.316 1.399 3.5 3.5 0 0 1-1.844.493q-.954 0-1.662-.329a2.67 2.67 0 0 1-1.086-.97l.017 5.134h-1.728zm4.048 6.22q1.07 0 1.645-.674.577-.69.576-1.762 0-1.119-.576-1.777-.558-.675-1.645-.675-.592 0-1.12.296-.51.28-.822.823-.296.527-.296 1.234v.115q0 .708.296 1.267.313.543.823.855.51.296 1.119.297z'/%3E%3Cpath fill='%23e1e3e9' d='M51.325 4.7h1.86v10.45h3.473v1.646h-5.333zm7.12 4.542h1.843v7.553h-1.843zm.905-1.415a1.16 1.16 0 0 1-.856-.346 1.17 1.17 0 0 1-.346-.856 1.05 1.05 0 0 1 .346-.79q.346-.329.856-.329.494 0 .839.33a1.05 1.05 0 0 1 .345.79 1.16 1.16 0 0 1-.345.855q-.33.346-.84.346zm7.875 9.133a3.17 3.17 0 0 1-1.662-.444q-.723-.46-1.004-1.053l-.033 1.332h-1.71V4.701h1.743v4.657l-.082 1.283q.279-.658 1.086-1.119a3.5 3.5 0 0 1 1.778-.477q1.119 0 1.942.51a3.24 3.24 0 0 1 1.283 1.4q.445.888.444 2.072 0 1.201-.526 2.09a3.5 3.5 0 0 1-1.382 1.366 3.8 3.8 0 0 1-1.876.477zm-.296-1.481q1.069 0 1.645-.675.577-.69.577-1.778 0-1.102-.577-1.776-.56-.691-1.645-.692a2.12 2.12 0 0 0-1.58.659q-.642.641-.642 1.694v.115q0 .71.296 1.267a2.4 2.4 0 0 0 .807.872 2.1 2.1 0 0 0 1.119.313zm5.927-6.237h1.777v1.481q.263-.757.856-1.217a2.14 2.14 0 0 1 1.349-.46q.527 0 .724.098l-.247 1.794q-.149-.099-.642-.099-.774 0-1.416.494-.626.493-.626 1.58v3.883h-1.777V9.242zm9.534 7.718q-1.35 0-2.255-.526-.904-.543-1.332-1.432a4.6 4.6 0 0 1-.428-1.975q0-1.2.493-2.106a3.46 3.46 0 0 1 1.4-1.382q.889-.495 2.007-.494 1.744 0 2.584.97.855.956.856 2.7 0 .444-.05.92h-5.43q.18 1.005.708 1.45.542.443 1.497.443.79 0 1.3-.131a4 4 0 0 0 .938-.362l.542 1.267q-.411.263-1.119.46-.708.198-1.711.197zm1.596-4.558q.016-1.02-.444-1.432-.46-.428-1.316-.428-1.728 0-1.991 1.86z'/%3E%3Cpath d='M5.074 15.948a.484.657 0 0 0-.486.659v1.84a.484.657 0 0 0 .486.659h4.101a.484.657 0 0 0 .486-.659v-1.84a.484.657 0 0 0-.486-.659zm3.56 1.16H5.617v.838h3.017z' style='fill:%23fff;fill-rule:evenodd;stroke-width:1.03600001'/%3E%3Cg style='stroke-width:1.12603545'%3E%3Cpath d='M-9.408-1.416c-3.833-.025-7.056 2.912-7.08 6.615-.02 3.08 1.653 4.832 3.107 6.268.903.892 1.721 1.74 2.32 2.902l-.525-.004c-.543-.003-.992.304-1.24.639a1.87 1.87 0 0 0-.362 1.121l-.011 1.877c-.003.402.104.787.347 1.125.244.338.688.653 1.23.656l4.142.028c.542.003.99-.306 1.238-.641a1.87 1.87 0 0 0 .363-1.121l.012-1.875a1.87 1.87 0 0 0-.348-1.127c-.243-.338-.688-.653-1.23-.656l-.518-.004c.597-1.145 1.425-1.983 2.348-2.87 1.473-1.414 3.18-3.149 3.2-6.226-.016-3.59-2.923-6.684-6.993-6.707m-.006 1.1v.002c3.274.02 5.92 2.532 5.9 5.6-.017 2.706-1.39 4.026-2.863 5.44-1.034.994-2.118 2.033-2.814 3.633-.018.041-.052.055-.075.065q-.013.004-.02.01a.34.34 0 0 1-.226.084.34.34 0 0 1-.224-.086l-.092-.077c-.699-1.615-1.768-2.669-2.781-3.67-1.454-1.435-2.797-2.762-2.78-5.478.02-3.067 2.7-5.545 5.975-5.523m-.02 2.826c-1.62-.01-2.944 1.315-2.955 2.96-.01 1.646 1.295 2.988 2.916 2.999h.002c1.621.01 2.943-1.316 2.953-2.961.011-1.646-1.294-2.988-2.916-2.998m-.005 1.1c1.017.006 1.829.83 1.822 1.89s-.83 1.874-1.848 1.867c-1.018-.006-1.829-.83-1.822-1.89s.83-1.874 1.848-1.868m-2.155 11.857 4.14.025c.271.002.49.305.487.676l-.013 1.875c-.003.37-.224.67-.495.668l-4.14-.025c-.27-.002-.487-.306-.485-.676l.012-1.875c.003-.37.224-.67.494-.668' style='color:%23000;font-style:normal;font-variant:normal;font-weight:400;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:%23000;letter-spacing:normal;word-spacing:normal;text-transform:none;writing-mode:lr-tb;direction:ltr;text-orientation:mixed;dominant-baseline:auto;baseline-shift:baseline;text-anchor:start;white-space:normal;shape-padding:0;clip-rule:evenodd;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:%23000;solid-opacity:1;vector-effect:none;fill:%23000;fill-opacity:.4;fill-rule:evenodd;stroke:none;stroke-width:2.47727823;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto' transform='translate(15.553 2.85)scale(.88807)'/%3E%3Cpath d='M-9.415-.316C-12.69-.338-15.37 2.14-15.39 5.207c-.017 2.716 1.326 4.041 2.78 5.477 1.013 1 2.081 2.055 2.78 3.67l.092.076a.34.34 0 0 0 .225.086.34.34 0 0 0 .227-.083l.019-.01c.022-.009.057-.024.074-.064.697-1.6 1.78-2.64 2.814-3.634 1.473-1.414 2.847-2.733 2.864-5.44.02-3.067-2.627-5.58-5.901-5.601m-.057 8.784c1.621.011 2.944-1.315 2.955-2.96.01-1.646-1.295-2.988-2.916-2.999-1.622-.01-2.945 1.315-2.955 2.96s1.295 2.989 2.916 3' style='clip-rule:evenodd;fill:%23e1e3e9;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:2.47727823;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:.4' transform='translate(15.553 2.85)scale(.88807)'/%3E%3Cpath d='M-11.594 15.465c-.27-.002-.492.297-.494.668l-.012 1.876c-.003.371.214.673.485.675l4.14.027c.271.002.492-.298.495-.668l.012-1.877c.003-.37-.215-.672-.485-.674z' style='clip-rule:evenodd;fill:%23fff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:2.47727823;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:.4' transform='translate(15.553 2.85)scale(.88807)'/%3E%3C/g%3E%3C/svg%3E");background-repeat:no-repeat;cursor:pointer;display:block;height:23px;margin:0 0 -4px -4px;overflow:hidden;width:88px}a.maplibregl-ctrl-logo.maplibregl-compact{width:14px}@media (forced-colors:active){a.maplibregl-ctrl-logo{background-color:transparent;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='88' height='23' fill='none'%3E%3Cpath fill='%23000' fill-opacity='.4' fill-rule='evenodd' d='M17.408 16.796h-1.827l2.501-12.095h.198l3.324 6.533.988 2.19.988-2.19 3.258-6.533h.181l2.6 12.095h-1.81l-1.218-5.644-.362-1.71-.658 1.71-2.929 5.644h-.098l-2.914-5.644-.757-1.71-.345 1.71zm1.958-3.42-.726 3.663a1.255 1.255 0 0 1-1.232 1.011h-1.827a1.255 1.255 0 0 1-1.229-1.509l2.501-12.095a1.255 1.255 0 0 1 1.23-1.001h.197a1.25 1.25 0 0 1 1.12.685l3.19 6.273 3.125-6.263a1.25 1.25 0 0 1 1.123-.695h.181a1.255 1.255 0 0 1 1.227.991l1.443 6.71a5 5 0 0 1 .314-.787l.009-.016a4.6 4.6 0 0 1 1.777-1.887c.782-.46 1.668-.667 2.611-.667a4.6 4.6 0 0 1 1.7.32l.306.134c.21-.16.474-.256.759-.256h1.694a1.255 1.255 0 0 1 1.212.925 1.255 1.255 0 0 1 1.212-.925h1.711c.284 0 .545.094.755.252.613-.3 1.312-.45 2.075-.45 1.356 0 2.557.445 3.482 1.4q.47.48.763 1.064V4.701a1.255 1.255 0 0 1 1.255-1.255h1.86A1.255 1.255 0 0 1 54.44 4.7v9.194h2.217c.19 0 .37.043.532.118v-4.77c0-.356.147-.678.385-.906a2.42 2.42 0 0 1-.682-1.71c0-.665.267-1.253.735-1.7a2.45 2.45 0 0 1 1.722-.674 2.43 2.43 0 0 1 1.705.675q.318.302.504.683V4.7a1.255 1.255 0 0 1 1.255-1.255h1.744A1.255 1.255 0 0 1 65.812 4.7v3.335a4.8 4.8 0 0 1 1.526-.246c.938 0 1.817.214 2.59.69a4.47 4.47 0 0 1 1.67 1.743v-.98a1.255 1.255 0 0 1 1.256-1.256h1.777c.233 0 .451.064.639.174a3.4 3.4 0 0 1 1.567-.372c.346 0 .861.02 1.285.232a1.25 1.25 0 0 1 .689 1.004 4.7 4.7 0 0 1 .853-.588c.795-.44 1.675-.647 2.61-.647 1.385 0 2.65.39 3.525 1.396.836.938 1.168 2.173 1.168 3.528q-.001.515-.056 1.051a1.255 1.255 0 0 1-.947 1.09l.408.952a1.255 1.255 0 0 1-.477 1.552c-.418.268-.92.463-1.458.612-.613.171-1.304.244-2.049.244-1.06 0-2.043-.207-2.886-.698l-.015-.008c-.798-.48-1.419-1.135-1.818-1.963l-.004-.008a5.8 5.8 0 0 1-.548-2.512q0-.429.053-.843a1.3 1.3 0 0 1-.333-.086l-.166-.004c-.223 0-.426.062-.643.228-.03.024-.142.139-.142.59v3.883a1.255 1.255 0 0 1-1.256 1.256h-1.777a1.255 1.255 0 0 1-1.256-1.256V15.69l-.032.057a4.8 4.8 0 0 1-1.86 1.833 5.04 5.04 0 0 1-2.484.634 4.5 4.5 0 0 1-1.935-.424 1.25 1.25 0 0 1-.764.258h-1.71a1.255 1.255 0 0 1-1.256-1.255V7.687a2.4 2.4 0 0 1-.428.625c.253.23.412.561.412.93v7.553a1.255 1.255 0 0 1-1.256 1.255h-1.843a1.25 1.25 0 0 1-.894-.373c-.228.23-.544.373-.894.373H51.32a1.255 1.255 0 0 1-1.256-1.255v-1.251l-.061.117a4.7 4.7 0 0 1-1.782 1.884 4.77 4.77 0 0 1-2.485.67 5.6 5.6 0 0 1-1.485-.188l.009 2.764a1.255 1.255 0 0 1-1.255 1.259h-1.729a1.255 1.255 0 0 1-1.255-1.255v-3.537a1.255 1.255 0 0 1-1.167.793h-1.679a1.25 1.25 0 0 1-.77-.263 4.5 4.5 0 0 1-1.945.429c-.885 0-1.724-.21-2.495-.632l-.017-.01a5 5 0 0 1-1.081-.836 1.255 1.255 0 0 1-1.254 1.312h-1.81a1.255 1.255 0 0 1-1.228-.99l-.782-3.625-2.044 3.939a1.25 1.25 0 0 1-1.115.676h-.098a1.25 1.25 0 0 1-1.116-.68l-2.061-3.994zM35.92 16.63l.207-.114.223-.15q.493-.356.735-.785l.061-.118.033 1.332h1.678V9.242h-1.694l-.033 1.267q-.133-.329-.526-.658l-.032-.028a3.2 3.2 0 0 0-.668-.428l-.27-.12a3.3 3.3 0 0 0-1.235-.23q-1.136-.001-1.974.493a3.36 3.36 0 0 0-1.3 1.382q-.445.89-.444 2.074 0 1.2.51 2.107a3.8 3.8 0 0 0 1.382 1.381 3.9 3.9 0 0 0 1.893.477q.795 0 1.455-.33zm-2.789-5.38q-.576.675-.575 1.762 0 1.102.559 1.794.576.675 1.645.675a2.25 2.25 0 0 0 .934-.19 2.2 2.2 0 0 0 .468-.29l.178-.161a2.2 2.2 0 0 0 .397-.561q.244-.5.244-1.15v-.115q0-.708-.296-1.267l-.043-.077a2.2 2.2 0 0 0-.633-.709l-.13-.086-.047-.028a2.1 2.1 0 0 0-1.073-.285q-1.052 0-1.629.692zm2.316 2.706c.163-.17.28-.407.28-.83v-.114c0-.292-.06-.508-.15-.68a.96.96 0 0 0-.353-.389.85.85 0 0 0-.464-.127c-.4 0-.56.114-.664.239l-.01.012c-.148.174-.275.45-.275.945 0 .506.122.801.27.99.097.11.266.224.68.224.303 0 .504-.09.687-.269zm7.545 1.705a2.6 2.6 0 0 0 .331.423q.319.33.755.548l.173.074q.65.255 1.49.255 1.02 0 1.844-.493a3.45 3.45 0 0 0 1.316-1.4q.493-.904.493-2.089 0-1.909-.988-2.913-.988-1.02-2.584-1.02-.898 0-1.575.347a3 3 0 0 0-.415.262l-.199.166a3.4 3.4 0 0 0-.64.82V9.242h-1.712v11.553h1.729l-.017-5.134zm.53-1.138q.206.29.48.5l.155.11.053.034q.51.296 1.119.297 1.07 0 1.645-.675.577-.69.576-1.762 0-1.119-.576-1.777-.558-.675-1.645-.675-.435 0-.835.16a2 2 0 0 0-.284.136 2 2 0 0 0-.363.254 2.2 2.2 0 0 0-.46.569l-.082.162a2.6 2.6 0 0 0-.213 1.072v.115q0 .707.296 1.267l.135.211zm.964-.818a1.1 1.1 0 0 0 .367.385.94.94 0 0 0 .476.118c.423 0 .59-.117.687-.23.159-.194.28-.478.28-.95 0-.53-.133-.8-.266-.952l-.021-.025c-.078-.094-.231-.221-.68-.221a1 1 0 0 0-.503.135l-.012.007a.86.86 0 0 0-.335.343c-.073.133-.132.324-.132.614v.115a1.4 1.4 0 0 0 .14.66zm15.7-6.222q.347-.346.346-.856a1.05 1.05 0 0 0-.345-.79 1.18 1.18 0 0 0-.84-.329q-.51 0-.855.33a1.05 1.05 0 0 0-.346.79q0 .51.346.855.345.346.856.346.51 0 .839-.346zm4.337 9.314.033-1.332q.191.403.59.747l.098.081a4 4 0 0 0 .316.224l.223.122a3.2 3.2 0 0 0 1.44.322 3.8 3.8 0 0 0 1.875-.477 3.5 3.5 0 0 0 1.382-1.366q.527-.89.526-2.09 0-1.184-.444-2.073a3.24 3.24 0 0 0-1.283-1.399q-.823-.51-1.942-.51a3.5 3.5 0 0 0-1.527.344l-.086.043-.165.09a3 3 0 0 0-.33.214q-.432.315-.656.707a2 2 0 0 0-.099.198l.082-1.283V4.701h-1.744v12.095zm.473-2.509a2.5 2.5 0 0 0 .566.7q.117.098.245.18l.144.08a2.1 2.1 0 0 0 .975.232q1.07 0 1.645-.675.576-.69.576-1.778 0-1.102-.576-1.777-.56-.691-1.645-.692a2.2 2.2 0 0 0-1.015.235q-.22.113-.415.282l-.15.142a2.1 2.1 0 0 0-.42.594q-.223.479-.223 1.1v.115q0 .705.293 1.26zm2.616-.293c.157-.191.28-.479.28-.967 0-.51-.13-.79-.276-.961l-.021-.026c-.082-.1-.232-.225-.67-.225a.87.87 0 0 0-.681.279l-.012.011c-.154.155-.274.38-.274.807v.115c0 .285.057.499.144.669a1.1 1.1 0 0 0 .367.405c.137.082.28.123.455.123.423 0 .59-.118.686-.23zm8.266-3.013q.345-.13.724-.14l.069-.002q.493 0 .642.099l.247-1.794q-.196-.099-.717-.099a2.3 2.3 0 0 0-.545.063 2 2 0 0 0-.411.148 2.2 2.2 0 0 0-.4.249 2.5 2.5 0 0 0-.485.499 2.7 2.7 0 0 0-.32.581l-.05.137v-1.48h-1.778v7.553h1.777v-3.884q0-.546.159-.943a1.5 1.5 0 0 1 .466-.636 2.5 2.5 0 0 1 .399-.253 2 2 0 0 1 .224-.099zm9.784 2.656.05-.922q0-1.743-.856-2.698-.838-.97-2.584-.97-1.119-.001-2.007.493a3.46 3.46 0 0 0-1.4 1.382q-.493.906-.493 2.106 0 1.07.428 1.975.428.89 1.332 1.432.906.526 2.255.526.973 0 1.668-.185l.044-.012.135-.04q.613-.184.984-.421l-.542-1.267q-.3.162-.642.274l-.297.087q-.51.131-1.3.131-.954 0-1.497-.444a1.6 1.6 0 0 1-.192-.193q-.366-.44-.512-1.234l-.004-.021zm-5.427-1.256-.003.022h3.752v-.138q-.011-.727-.288-1.118a1 1 0 0 0-.156-.176q-.46-.428-1.316-.428-.986 0-1.494.604-.379.45-.494 1.234zm-27.053 2.77V4.7h-1.86v12.095h5.333V15.15zm7.103-5.908v7.553h-1.843V9.242h1.843z'/%3E%3Cpath fill='%23fff' d='m19.63 11.151-.757-1.71-.345 1.71-1.12 5.644h-1.827L18.083 4.7h.197l3.325 6.533.988 2.19.988-2.19L26.839 4.7h.181l2.6 12.095h-1.81l-1.218-5.644-.362-1.71-.658 1.71-2.93 5.644h-.098l-2.913-5.644zm14.836 5.81q-1.02 0-1.893-.478a3.8 3.8 0 0 1-1.381-1.382q-.51-.906-.51-2.106 0-1.185.444-2.074a3.36 3.36 0 0 1 1.3-1.382q.839-.494 1.974-.494a3.3 3.3 0 0 1 1.234.231 3.3 3.3 0 0 1 .97.575q.396.33.527.659l.033-1.267h1.694v7.553H37.18l-.033-1.332q-.279.593-1.02 1.053a3.17 3.17 0 0 1-1.662.444zm.296-1.482q.938 0 1.58-.642.642-.66.642-1.711v-.115q0-.708-.296-1.267a2.2 2.2 0 0 0-.807-.872 2.1 2.1 0 0 0-1.119-.313q-1.053 0-1.629.692-.575.675-.575 1.76 0 1.103.559 1.795.577.675 1.645.675zm6.521-6.237h1.711v1.4q.906-1.597 2.83-1.597 1.596 0 2.584 1.02.988 1.005.988 2.914 0 1.185-.493 2.09a3.46 3.46 0 0 1-1.316 1.399 3.5 3.5 0 0 1-1.844.493q-.954 0-1.662-.329a2.67 2.67 0 0 1-1.086-.97l.017 5.134h-1.728zm4.048 6.22q1.07 0 1.645-.674.577-.69.576-1.762 0-1.119-.576-1.777-.558-.675-1.645-.675-.592 0-1.12.296-.51.28-.822.823-.296.527-.296 1.234v.115q0 .708.296 1.267.313.543.823.855.51.296 1.119.297z'/%3E%3Cpath fill='%23e1e3e9' d='M51.325 4.7h1.86v10.45h3.473v1.646h-5.333zm7.12 4.542h1.843v7.553h-1.843zm.905-1.415a1.16 1.16 0 0 1-.856-.346 1.17 1.17 0 0 1-.346-.856 1.05 1.05 0 0 1 .346-.79q.346-.329.856-.329.494 0 .839.33a1.05 1.05 0 0 1 .345.79 1.16 1.16 0 0 1-.345.855q-.33.346-.84.346zm7.875 9.133a3.17 3.17 0 0 1-1.662-.444q-.723-.46-1.004-1.053l-.033 1.332h-1.71V4.701h1.743v4.657l-.082 1.283q.279-.658 1.086-1.119a3.5 3.5 0 0 1 1.778-.477q1.119 0 1.942.51a3.24 3.24 0 0 1 1.283 1.4q.445.888.444 2.072 0 1.201-.526 2.09a3.5 3.5 0 0 1-1.382 1.366 3.8 3.8 0 0 1-1.876.477zm-.296-1.481q1.069 0 1.645-.675.577-.69.577-1.778 0-1.102-.577-1.776-.56-.691-1.645-.692a2.12 2.12 0 0 0-1.58.659q-.642.641-.642 1.694v.115q0 .71.296 1.267a2.4 2.4 0 0 0 .807.872 2.1 2.1 0 0 0 1.119.313zm5.927-6.237h1.777v1.481q.263-.757.856-1.217a2.14 2.14 0 0 1 1.349-.46q.527 0 .724.098l-.247 1.794q-.149-.099-.642-.099-.774 0-1.416.494-.626.493-.626 1.58v3.883h-1.777V9.242zm9.534 7.718q-1.35 0-2.255-.526-.904-.543-1.332-1.432a4.6 4.6 0 0 1-.428-1.975q0-1.2.493-2.106a3.46 3.46 0 0 1 1.4-1.382q.889-.495 2.007-.494 1.744 0 2.584.97.855.956.856 2.7 0 .444-.05.92h-5.43q.18 1.005.708 1.45.542.443 1.497.443.79 0 1.3-.131a4 4 0 0 0 .938-.362l.542 1.267q-.411.263-1.119.46-.708.198-1.711.197zm1.596-4.558q.016-1.02-.444-1.432-.46-.428-1.316-.428-1.728 0-1.991 1.86z'/%3E%3Cpath d='M5.074 15.948a.484.657 0 0 0-.486.659v1.84a.484.657 0 0 0 .486.659h4.101a.484.657 0 0 0 .486-.659v-1.84a.484.657 0 0 0-.486-.659zm3.56 1.16H5.617v.838h3.017z' style='fill:%23fff;fill-rule:evenodd;stroke-width:1.03600001'/%3E%3Cg style='stroke-width:1.12603545'%3E%3Cpath d='M-9.408-1.416c-3.833-.025-7.056 2.912-7.08 6.615-.02 3.08 1.653 4.832 3.107 6.268.903.892 1.721 1.74 2.32 2.902l-.525-.004c-.543-.003-.992.304-1.24.639a1.87 1.87 0 0 0-.362 1.121l-.011 1.877c-.003.402.104.787.347 1.125.244.338.688.653 1.23.656l4.142.028c.542.003.99-.306 1.238-.641a1.87 1.87 0 0 0 .363-1.121l.012-1.875a1.87 1.87 0 0 0-.348-1.127c-.243-.338-.688-.653-1.23-.656l-.518-.004c.597-1.145 1.425-1.983 2.348-2.87 1.473-1.414 3.18-3.149 3.2-6.226-.016-3.59-2.923-6.684-6.993-6.707m-.006 1.1v.002c3.274.02 5.92 2.532 5.9 5.6-.017 2.706-1.39 4.026-2.863 5.44-1.034.994-2.118 2.033-2.814 3.633-.018.041-.052.055-.075.065q-.013.004-.02.01a.34.34 0 0 1-.226.084.34.34 0 0 1-.224-.086l-.092-.077c-.699-1.615-1.768-2.669-2.781-3.67-1.454-1.435-2.797-2.762-2.78-5.478.02-3.067 2.7-5.545 5.975-5.523m-.02 2.826c-1.62-.01-2.944 1.315-2.955 2.96-.01 1.646 1.295 2.988 2.916 2.999h.002c1.621.01 2.943-1.316 2.953-2.961.011-1.646-1.294-2.988-2.916-2.998m-.005 1.1c1.017.006 1.829.83 1.822 1.89s-.83 1.874-1.848 1.867c-1.018-.006-1.829-.83-1.822-1.89s.83-1.874 1.848-1.868m-2.155 11.857 4.14.025c.271.002.49.305.487.676l-.013 1.875c-.003.37-.224.67-.495.668l-4.14-.025c-.27-.002-.487-.306-.485-.676l.012-1.875c.003-.37.224-.67.494-.668' style='color:%23000;font-style:normal;font-variant:normal;font-weight:400;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:%23000;letter-spacing:normal;word-spacing:normal;text-transform:none;writing-mode:lr-tb;direction:ltr;text-orientation:mixed;dominant-baseline:auto;baseline-shift:baseline;text-anchor:start;white-space:normal;shape-padding:0;clip-rule:evenodd;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:%23000;solid-opacity:1;vector-effect:none;fill:%23000;fill-opacity:.4;fill-rule:evenodd;stroke:none;stroke-width:2.47727823;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto' transform='translate(15.553 2.85)scale(.88807)'/%3E%3Cpath d='M-9.415-.316C-12.69-.338-15.37 2.14-15.39 5.207c-.017 2.716 1.326 4.041 2.78 5.477 1.013 1 2.081 2.055 2.78 3.67l.092.076a.34.34 0 0 0 .225.086.34.34 0 0 0 .227-.083l.019-.01c.022-.009.057-.024.074-.064.697-1.6 1.78-2.64 2.814-3.634 1.473-1.414 2.847-2.733 2.864-5.44.02-3.067-2.627-5.58-5.901-5.601m-.057 8.784c1.621.011 2.944-1.315 2.955-2.96.01-1.646-1.295-2.988-2.916-2.999-1.622-.01-2.945 1.315-2.955 2.96s1.295 2.989 2.916 3' style='clip-rule:evenodd;fill:%23e1e3e9;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:2.47727823;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:.4' transform='translate(15.553 2.85)scale(.88807)'/%3E%3Cpath d='M-11.594 15.465c-.27-.002-.492.297-.494.668l-.012 1.876c-.003.371.214.673.485.675l4.14.027c.271.002.492-.298.495-.668l.012-1.877c.003-.37-.215-.672-.485-.674z' style='clip-rule:evenodd;fill:%23fff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:2.47727823;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:.4' transform='translate(15.553 2.85)scale(.88807)'/%3E%3C/g%3E%3C/svg%3E")}}@media (forced-colors:active) and (prefers-color-scheme:light){a.maplibregl-ctrl-logo{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='88' height='23' fill='none'%3E%3Cpath fill='%23000' fill-opacity='.4' fill-rule='evenodd' d='M17.408 16.796h-1.827l2.501-12.095h.198l3.324 6.533.988 2.19.988-2.19 3.258-6.533h.181l2.6 12.095h-1.81l-1.218-5.644-.362-1.71-.658 1.71-2.929 5.644h-.098l-2.914-5.644-.757-1.71-.345 1.71zm1.958-3.42-.726 3.663a1.255 1.255 0 0 1-1.232 1.011h-1.827a1.255 1.255 0 0 1-1.229-1.509l2.501-12.095a1.255 1.255 0 0 1 1.23-1.001h.197a1.25 1.25 0 0 1 1.12.685l3.19 6.273 3.125-6.263a1.25 1.25 0 0 1 1.123-.695h.181a1.255 1.255 0 0 1 1.227.991l1.443 6.71a5 5 0 0 1 .314-.787l.009-.016a4.6 4.6 0 0 1 1.777-1.887c.782-.46 1.668-.667 2.611-.667a4.6 4.6 0 0 1 1.7.32l.306.134c.21-.16.474-.256.759-.256h1.694a1.255 1.255 0 0 1 1.212.925 1.255 1.255 0 0 1 1.212-.925h1.711c.284 0 .545.094.755.252.613-.3 1.312-.45 2.075-.45 1.356 0 2.557.445 3.482 1.4q.47.48.763 1.064V4.701a1.255 1.255 0 0 1 1.255-1.255h1.86A1.255 1.255 0 0 1 54.44 4.7v9.194h2.217c.19 0 .37.043.532.118v-4.77c0-.356.147-.678.385-.906a2.42 2.42 0 0 1-.682-1.71c0-.665.267-1.253.735-1.7a2.45 2.45 0 0 1 1.722-.674 2.43 2.43 0 0 1 1.705.675q.318.302.504.683V4.7a1.255 1.255 0 0 1 1.255-1.255h1.744A1.255 1.255 0 0 1 65.812 4.7v3.335a4.8 4.8 0 0 1 1.526-.246c.938 0 1.817.214 2.59.69a4.47 4.47 0 0 1 1.67 1.743v-.98a1.255 1.255 0 0 1 1.256-1.256h1.777c.233 0 .451.064.639.174a3.4 3.4 0 0 1 1.567-.372c.346 0 .861.02 1.285.232a1.25 1.25 0 0 1 .689 1.004 4.7 4.7 0 0 1 .853-.588c.795-.44 1.675-.647 2.61-.647 1.385 0 2.65.39 3.525 1.396.836.938 1.168 2.173 1.168 3.528q-.001.515-.056 1.051a1.255 1.255 0 0 1-.947 1.09l.408.952a1.255 1.255 0 0 1-.477 1.552c-.418.268-.92.463-1.458.612-.613.171-1.304.244-2.049.244-1.06 0-2.043-.207-2.886-.698l-.015-.008c-.798-.48-1.419-1.135-1.818-1.963l-.004-.008a5.8 5.8 0 0 1-.548-2.512q0-.429.053-.843a1.3 1.3 0 0 1-.333-.086l-.166-.004c-.223 0-.426.062-.643.228-.03.024-.142.139-.142.59v3.883a1.255 1.255 0 0 1-1.256 1.256h-1.777a1.255 1.255 0 0 1-1.256-1.256V15.69l-.032.057a4.8 4.8 0 0 1-1.86 1.833 5.04 5.04 0 0 1-2.484.634 4.5 4.5 0 0 1-1.935-.424 1.25 1.25 0 0 1-.764.258h-1.71a1.255 1.255 0 0 1-1.256-1.255V7.687a2.4 2.4 0 0 1-.428.625c.253.23.412.561.412.93v7.553a1.255 1.255 0 0 1-1.256 1.255h-1.843a1.25 1.25 0 0 1-.894-.373c-.228.23-.544.373-.894.373H51.32a1.255 1.255 0 0 1-1.256-1.255v-1.251l-.061.117a4.7 4.7 0 0 1-1.782 1.884 4.77 4.77 0 0 1-2.485.67 5.6 5.6 0 0 1-1.485-.188l.009 2.764a1.255 1.255 0 0 1-1.255 1.259h-1.729a1.255 1.255 0 0 1-1.255-1.255v-3.537a1.255 1.255 0 0 1-1.167.793h-1.679a1.25 1.25 0 0 1-.77-.263 4.5 4.5 0 0 1-1.945.429c-.885 0-1.724-.21-2.495-.632l-.017-.01a5 5 0 0 1-1.081-.836 1.255 1.255 0 0 1-1.254 1.312h-1.81a1.255 1.255 0 0 1-1.228-.99l-.782-3.625-2.044 3.939a1.25 1.25 0 0 1-1.115.676h-.098a1.25 1.25 0 0 1-1.116-.68l-2.061-3.994zM35.92 16.63l.207-.114.223-.15q.493-.356.735-.785l.061-.118.033 1.332h1.678V9.242h-1.694l-.033 1.267q-.133-.329-.526-.658l-.032-.028a3.2 3.2 0 0 0-.668-.428l-.27-.12a3.3 3.3 0 0 0-1.235-.23q-1.136-.001-1.974.493a3.36 3.36 0 0 0-1.3 1.382q-.445.89-.444 2.074 0 1.2.51 2.107a3.8 3.8 0 0 0 1.382 1.381 3.9 3.9 0 0 0 1.893.477q.795 0 1.455-.33zm-2.789-5.38q-.576.675-.575 1.762 0 1.102.559 1.794.576.675 1.645.675a2.25 2.25 0 0 0 .934-.19 2.2 2.2 0 0 0 .468-.29l.178-.161a2.2 2.2 0 0 0 .397-.561q.244-.5.244-1.15v-.115q0-.708-.296-1.267l-.043-.077a2.2 2.2 0 0 0-.633-.709l-.13-.086-.047-.028a2.1 2.1 0 0 0-1.073-.285q-1.052 0-1.629.692zm2.316 2.706c.163-.17.28-.407.28-.83v-.114c0-.292-.06-.508-.15-.68a.96.96 0 0 0-.353-.389.85.85 0 0 0-.464-.127c-.4 0-.56.114-.664.239l-.01.012c-.148.174-.275.45-.275.945 0 .506.122.801.27.99.097.11.266.224.68.224.303 0 .504-.09.687-.269zm7.545 1.705a2.6 2.6 0 0 0 .331.423q.319.33.755.548l.173.074q.65.255 1.49.255 1.02 0 1.844-.493a3.45 3.45 0 0 0 1.316-1.4q.493-.904.493-2.089 0-1.909-.988-2.913-.988-1.02-2.584-1.02-.898 0-1.575.347a3 3 0 0 0-.415.262l-.199.166a3.4 3.4 0 0 0-.64.82V9.242h-1.712v11.553h1.729l-.017-5.134zm.53-1.138q.206.29.48.5l.155.11.053.034q.51.296 1.119.297 1.07 0 1.645-.675.577-.69.576-1.762 0-1.119-.576-1.777-.558-.675-1.645-.675-.435 0-.835.16a2 2 0 0 0-.284.136 2 2 0 0 0-.363.254 2.2 2.2 0 0 0-.46.569l-.082.162a2.6 2.6 0 0 0-.213 1.072v.115q0 .707.296 1.267l.135.211zm.964-.818a1.1 1.1 0 0 0 .367.385.94.94 0 0 0 .476.118c.423 0 .59-.117.687-.23.159-.194.28-.478.28-.95 0-.53-.133-.8-.266-.952l-.021-.025c-.078-.094-.231-.221-.68-.221a1 1 0 0 0-.503.135l-.012.007a.86.86 0 0 0-.335.343c-.073.133-.132.324-.132.614v.115a1.4 1.4 0 0 0 .14.66zm15.7-6.222q.347-.346.346-.856a1.05 1.05 0 0 0-.345-.79 1.18 1.18 0 0 0-.84-.329q-.51 0-.855.33a1.05 1.05 0 0 0-.346.79q0 .51.346.855.345.346.856.346.51 0 .839-.346zm4.337 9.314.033-1.332q.191.403.59.747l.098.081a4 4 0 0 0 .316.224l.223.122a3.2 3.2 0 0 0 1.44.322 3.8 3.8 0 0 0 1.875-.477 3.5 3.5 0 0 0 1.382-1.366q.527-.89.526-2.09 0-1.184-.444-2.073a3.24 3.24 0 0 0-1.283-1.399q-.823-.51-1.942-.51a3.5 3.5 0 0 0-1.527.344l-.086.043-.165.09a3 3 0 0 0-.33.214q-.432.315-.656.707a2 2 0 0 0-.099.198l.082-1.283V4.701h-1.744v12.095zm.473-2.509a2.5 2.5 0 0 0 .566.7q.117.098.245.18l.144.08a2.1 2.1 0 0 0 .975.232q1.07 0 1.645-.675.576-.69.576-1.778 0-1.102-.576-1.777-.56-.691-1.645-.692a2.2 2.2 0 0 0-1.015.235q-.22.113-.415.282l-.15.142a2.1 2.1 0 0 0-.42.594q-.223.479-.223 1.1v.115q0 .705.293 1.26zm2.616-.293c.157-.191.28-.479.28-.967 0-.51-.13-.79-.276-.961l-.021-.026c-.082-.1-.232-.225-.67-.225a.87.87 0 0 0-.681.279l-.012.011c-.154.155-.274.38-.274.807v.115c0 .285.057.499.144.669a1.1 1.1 0 0 0 .367.405c.137.082.28.123.455.123.423 0 .59-.118.686-.23zm8.266-3.013q.345-.13.724-.14l.069-.002q.493 0 .642.099l.247-1.794q-.196-.099-.717-.099a2.3 2.3 0 0 0-.545.063 2 2 0 0 0-.411.148 2.2 2.2 0 0 0-.4.249 2.5 2.5 0 0 0-.485.499 2.7 2.7 0 0 0-.32.581l-.05.137v-1.48h-1.778v7.553h1.777v-3.884q0-.546.159-.943a1.5 1.5 0 0 1 .466-.636 2.5 2.5 0 0 1 .399-.253 2 2 0 0 1 .224-.099zm9.784 2.656.05-.922q0-1.743-.856-2.698-.838-.97-2.584-.97-1.119-.001-2.007.493a3.46 3.46 0 0 0-1.4 1.382q-.493.906-.493 2.106 0 1.07.428 1.975.428.89 1.332 1.432.906.526 2.255.526.973 0 1.668-.185l.044-.012.135-.04q.613-.184.984-.421l-.542-1.267q-.3.162-.642.274l-.297.087q-.51.131-1.3.131-.954 0-1.497-.444a1.6 1.6 0 0 1-.192-.193q-.366-.44-.512-1.234l-.004-.021zm-5.427-1.256-.003.022h3.752v-.138q-.011-.727-.288-1.118a1 1 0 0 0-.156-.176q-.46-.428-1.316-.428-.986 0-1.494.604-.379.45-.494 1.234zm-27.053 2.77V4.7h-1.86v12.095h5.333V15.15zm7.103-5.908v7.553h-1.843V9.242h1.843z'/%3E%3Cpath fill='%23fff' d='m19.63 11.151-.757-1.71-.345 1.71-1.12 5.644h-1.827L18.083 4.7h.197l3.325 6.533.988 2.19.988-2.19L26.839 4.7h.181l2.6 12.095h-1.81l-1.218-5.644-.362-1.71-.658 1.71-2.93 5.644h-.098l-2.913-5.644zm14.836 5.81q-1.02 0-1.893-.478a3.8 3.8 0 0 1-1.381-1.382q-.51-.906-.51-2.106 0-1.185.444-2.074a3.36 3.36 0 0 1 1.3-1.382q.839-.494 1.974-.494a3.3 3.3 0 0 1 1.234.231 3.3 3.3 0 0 1 .97.575q.396.33.527.659l.033-1.267h1.694v7.553H37.18l-.033-1.332q-.279.593-1.02 1.053a3.17 3.17 0 0 1-1.662.444zm.296-1.482q.938 0 1.58-.642.642-.66.642-1.711v-.115q0-.708-.296-1.267a2.2 2.2 0 0 0-.807-.872 2.1 2.1 0 0 0-1.119-.313q-1.053 0-1.629.692-.575.675-.575 1.76 0 1.103.559 1.795.577.675 1.645.675zm6.521-6.237h1.711v1.4q.906-1.597 2.83-1.597 1.596 0 2.584 1.02.988 1.005.988 2.914 0 1.185-.493 2.09a3.46 3.46 0 0 1-1.316 1.399 3.5 3.5 0 0 1-1.844.493q-.954 0-1.662-.329a2.67 2.67 0 0 1-1.086-.97l.017 5.134h-1.728zm4.048 6.22q1.07 0 1.645-.674.577-.69.576-1.762 0-1.119-.576-1.777-.558-.675-1.645-.675-.592 0-1.12.296-.51.28-.822.823-.296.527-.296 1.234v.115q0 .708.296 1.267.313.543.823.855.51.296 1.119.297z'/%3E%3Cpath fill='%23e1e3e9' d='M51.325 4.7h1.86v10.45h3.473v1.646h-5.333zm7.12 4.542h1.843v7.553h-1.843zm.905-1.415a1.16 1.16 0 0 1-.856-.346 1.17 1.17 0 0 1-.346-.856 1.05 1.05 0 0 1 .346-.79q.346-.329.856-.329.494 0 .839.33a1.05 1.05 0 0 1 .345.79 1.16 1.16 0 0 1-.345.855q-.33.346-.84.346zm7.875 9.133a3.17 3.17 0 0 1-1.662-.444q-.723-.46-1.004-1.053l-.033 1.332h-1.71V4.701h1.743v4.657l-.082 1.283q.279-.658 1.086-1.119a3.5 3.5 0 0 1 1.778-.477q1.119 0 1.942.51a3.24 3.24 0 0 1 1.283 1.4q.445.888.444 2.072 0 1.201-.526 2.09a3.5 3.5 0 0 1-1.382 1.366 3.8 3.8 0 0 1-1.876.477zm-.296-1.481q1.069 0 1.645-.675.577-.69.577-1.778 0-1.102-.577-1.776-.56-.691-1.645-.692a2.12 2.12 0 0 0-1.58.659q-.642.641-.642 1.694v.115q0 .71.296 1.267a2.4 2.4 0 0 0 .807.872 2.1 2.1 0 0 0 1.119.313zm5.927-6.237h1.777v1.481q.263-.757.856-1.217a2.14 2.14 0 0 1 1.349-.46q.527 0 .724.098l-.247 1.794q-.149-.099-.642-.099-.774 0-1.416.494-.626.493-.626 1.58v3.883h-1.777V9.242zm9.534 7.718q-1.35 0-2.255-.526-.904-.543-1.332-1.432a4.6 4.6 0 0 1-.428-1.975q0-1.2.493-2.106a3.46 3.46 0 0 1 1.4-1.382q.889-.495 2.007-.494 1.744 0 2.584.97.855.956.856 2.7 0 .444-.05.92h-5.43q.18 1.005.708 1.45.542.443 1.497.443.79 0 1.3-.131a4 4 0 0 0 .938-.362l.542 1.267q-.411.263-1.119.46-.708.198-1.711.197zm1.596-4.558q.016-1.02-.444-1.432-.46-.428-1.316-.428-1.728 0-1.991 1.86z'/%3E%3Cpath d='M5.074 15.948a.484.657 0 0 0-.486.659v1.84a.484.657 0 0 0 .486.659h4.101a.484.657 0 0 0 .486-.659v-1.84a.484.657 0 0 0-.486-.659zm3.56 1.16H5.617v.838h3.017z' style='fill:%23fff;fill-rule:evenodd;stroke-width:1.03600001'/%3E%3Cg style='stroke-width:1.12603545'%3E%3Cpath d='M-9.408-1.416c-3.833-.025-7.056 2.912-7.08 6.615-.02 3.08 1.653 4.832 3.107 6.268.903.892 1.721 1.74 2.32 2.902l-.525-.004c-.543-.003-.992.304-1.24.639a1.87 1.87 0 0 0-.362 1.121l-.011 1.877c-.003.402.104.787.347 1.125.244.338.688.653 1.23.656l4.142.028c.542.003.99-.306 1.238-.641a1.87 1.87 0 0 0 .363-1.121l.012-1.875a1.87 1.87 0 0 0-.348-1.127c-.243-.338-.688-.653-1.23-.656l-.518-.004c.597-1.145 1.425-1.983 2.348-2.87 1.473-1.414 3.18-3.149 3.2-6.226-.016-3.59-2.923-6.684-6.993-6.707m-.006 1.1v.002c3.274.02 5.92 2.532 5.9 5.6-.017 2.706-1.39 4.026-2.863 5.44-1.034.994-2.118 2.033-2.814 3.633-.018.041-.052.055-.075.065q-.013.004-.02.01a.34.34 0 0 1-.226.084.34.34 0 0 1-.224-.086l-.092-.077c-.699-1.615-1.768-2.669-2.781-3.67-1.454-1.435-2.797-2.762-2.78-5.478.02-3.067 2.7-5.545 5.975-5.523m-.02 2.826c-1.62-.01-2.944 1.315-2.955 2.96-.01 1.646 1.295 2.988 2.916 2.999h.002c1.621.01 2.943-1.316 2.953-2.961.011-1.646-1.294-2.988-2.916-2.998m-.005 1.1c1.017.006 1.829.83 1.822 1.89s-.83 1.874-1.848 1.867c-1.018-.006-1.829-.83-1.822-1.89s.83-1.874 1.848-1.868m-2.155 11.857 4.14.025c.271.002.49.305.487.676l-.013 1.875c-.003.37-.224.67-.495.668l-4.14-.025c-.27-.002-.487-.306-.485-.676l.012-1.875c.003-.37.224-.67.494-.668' style='color:%23000;font-style:normal;font-variant:normal;font-weight:400;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:%23000;letter-spacing:normal;word-spacing:normal;text-transform:none;writing-mode:lr-tb;direction:ltr;text-orientation:mixed;dominant-baseline:auto;baseline-shift:baseline;text-anchor:start;white-space:normal;shape-padding:0;clip-rule:evenodd;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:%23000;solid-opacity:1;vector-effect:none;fill:%23000;fill-opacity:.4;fill-rule:evenodd;stroke:none;stroke-width:2.47727823;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto' transform='translate(15.553 2.85)scale(.88807)'/%3E%3Cpath d='M-9.415-.316C-12.69-.338-15.37 2.14-15.39 5.207c-.017 2.716 1.326 4.041 2.78 5.477 1.013 1 2.081 2.055 2.78 3.67l.092.076a.34.34 0 0 0 .225.086.34.34 0 0 0 .227-.083l.019-.01c.022-.009.057-.024.074-.064.697-1.6 1.78-2.64 2.814-3.634 1.473-1.414 2.847-2.733 2.864-5.44.02-3.067-2.627-5.58-5.901-5.601m-.057 8.784c1.621.011 2.944-1.315 2.955-2.96.01-1.646-1.295-2.988-2.916-2.999-1.622-.01-2.945 1.315-2.955 2.96s1.295 2.989 2.916 3' style='clip-rule:evenodd;fill:%23e1e3e9;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:2.47727823;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:.4' transform='translate(15.553 2.85)scale(.88807)'/%3E%3Cpath d='M-11.594 15.465c-.27-.002-.492.297-.494.668l-.012 1.876c-.003.371.214.673.485.675l4.14.027c.271.002.492-.298.495-.668l.012-1.877c.003-.37-.215-.672-.485-.674z' style='clip-rule:evenodd;fill:%23fff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:2.47727823;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:.4' transform='translate(15.553 2.85)scale(.88807)'/%3E%3C/g%3E%3C/svg%3E")}}.maplibregl-ctrl.maplibregl-ctrl-attrib{background-color:hsla(0,0%,100%,.5);margin:0;padding:0 5px}@media screen{.maplibregl-ctrl-attrib.maplibregl-compact{background-color:#fff;border-radius:12px;box-sizing:content-box;color:#000;margin:10px;min-height:20px;padding:2px 24px 2px 0;position:relative}.maplibregl-ctrl-attrib.maplibregl-compact-show{padding:2px 28px 2px 8px;visibility:visible}.maplibregl-ctrl-bottom-left>.maplibregl-ctrl-attrib.maplibregl-compact-show,.maplibregl-ctrl-top-left>.maplibregl-ctrl-attrib.maplibregl-compact-show{border-radius:12px;padding:2px 8px 2px 28px}.maplibregl-ctrl-attrib.maplibregl-compact .maplibregl-ctrl-attrib-inner{display:none}.maplibregl-ctrl-attrib-button{background-color:hsla(0,0%,100%,.5);background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill-rule='evenodd' viewBox='0 0 20 20'%3E%3Cpath d='M4 10a6 6 0 1 0 12 0 6 6 0 1 0-12 0m5-3a1 1 0 1 0 2 0 1 1 0 1 0-2 0m0 3a1 1 0 1 1 2 0v3a1 1 0 1 1-2 0'/%3E%3C/svg%3E");border:0;border-radius:12px;box-sizing:border-box;cursor:pointer;display:none;height:24px;outline:none;position:absolute;right:0;top:0;width:24px}.maplibregl-ctrl-attrib summary.maplibregl-ctrl-attrib-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;list-style:none}.maplibregl-ctrl-attrib summary.maplibregl-ctrl-attrib-button::-webkit-details-marker{display:none}.maplibregl-ctrl-bottom-left .maplibregl-ctrl-attrib-button,.maplibregl-ctrl-top-left .maplibregl-ctrl-attrib-button{left:0}.maplibregl-ctrl-attrib.maplibregl-compact .maplibregl-ctrl-attrib-button,.maplibregl-ctrl-attrib.maplibregl-compact-show .maplibregl-ctrl-attrib-inner{display:block}.maplibregl-ctrl-attrib.maplibregl-compact-show .maplibregl-ctrl-attrib-button{background-color:rgba(0,0,0,.05)}.maplibregl-ctrl-bottom-right>.maplibregl-ctrl-attrib.maplibregl-compact:after{bottom:0;right:0}.maplibregl-ctrl-top-right>.maplibregl-ctrl-attrib.maplibregl-compact:after{right:0;top:0}.maplibregl-ctrl-top-left>.maplibregl-ctrl-attrib.maplibregl-compact:after{left:0;top:0}.maplibregl-ctrl-bottom-left>.maplibregl-ctrl-attrib.maplibregl-compact:after{bottom:0;left:0}}@media screen and (forced-colors:active){.maplibregl-ctrl-attrib.maplibregl-compact:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%23fff' fill-rule='evenodd' viewBox='0 0 20 20'%3E%3Cpath d='M4 10a6 6 0 1 0 12 0 6 6 0 1 0-12 0m5-3a1 1 0 1 0 2 0 1 1 0 1 0-2 0m0 3a1 1 0 1 1 2 0v3a1 1 0 1 1-2 0'/%3E%3C/svg%3E")}}@media screen and (forced-colors:active) and (prefers-color-scheme:light){.maplibregl-ctrl-attrib.maplibregl-compact:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill-rule='evenodd' viewBox='0 0 20 20'%3E%3Cpath d='M4 10a6 6 0 1 0 12 0 6 6 0 1 0-12 0m5-3a1 1 0 1 0 2 0 1 1 0 1 0-2 0m0 3a1 1 0 1 1 2 0v3a1 1 0 1 1-2 0'/%3E%3C/svg%3E")}}.maplibregl-ctrl-attrib a{color:rgba(0,0,0,.75);text-decoration:none}.maplibregl-ctrl-attrib a:hover{color:inherit;text-decoration:underline}.maplibregl-attrib-empty{display:none}.maplibregl-ctrl-scale{background-color:hsla(0,0%,100%,.75);border:2px solid #333;border-top:#333;box-sizing:border-box;color:#333;font-size:10px;padding:0 5px;white-space:nowrap}.maplibregl-popup{display:flex;left:0;pointer-events:none;position:absolute;top:0;will-change:transform}.maplibregl-popup-anchor-top,.maplibregl-popup-anchor-top-left,.maplibregl-popup-anchor-top-right{flex-direction:column}.maplibregl-popup-anchor-bottom,.maplibregl-popup-anchor-bottom-left,.maplibregl-popup-anchor-bottom-right{flex-direction:column-reverse}.maplibregl-popup-anchor-left{flex-direction:row}.maplibregl-popup-anchor-right{flex-direction:row-reverse}.maplibregl-popup-tip{border:10px solid transparent;height:0;width:0;z-index:1}.maplibregl-popup-anchor-top .maplibregl-popup-tip{align-self:center;border-bottom-color:#fff;border-top:none}.maplibregl-popup-anchor-top-left .maplibregl-popup-tip{align-self:flex-start;border-bottom-color:#fff;border-left:none;border-top:none}.maplibregl-popup-anchor-top-right .maplibregl-popup-tip{align-self:flex-end;border-bottom-color:#fff;border-right:none;border-top:none}.maplibregl-popup-anchor-bottom .maplibregl-popup-tip{align-self:center;border-bottom:none;border-top-color:#fff}.maplibregl-popup-anchor-bottom-left .maplibregl-popup-tip{align-self:flex-start;border-bottom:none;border-left:none;border-top-color:#fff}.maplibregl-popup-anchor-bottom-right .maplibregl-popup-tip{align-self:flex-end;border-bottom:none;border-right:none;border-top-color:#fff}.maplibregl-popup-anchor-left .maplibregl-popup-tip{align-self:center;border-left:none;border-right-color:#fff}.maplibregl-popup-anchor-right .maplibregl-popup-tip{align-self:center;border-left-color:#fff;border-right:none}[dir=rtl] .maplibregl-popup-anchor-left{flex-direction:row-reverse}[dir=rtl] .maplibregl-popup-anchor-right{flex-direction:row}[dir=rtl] .maplibregl-popup-anchor-top-left .maplibregl-popup-tip{align-self:flex-end}[dir=rtl] .maplibregl-popup-anchor-top-right .maplibregl-popup-tip{align-self:flex-start}[dir=rtl] .maplibregl-popup-anchor-bottom-left .maplibregl-popup-tip{align-self:flex-end}[dir=rtl] .maplibregl-popup-anchor-bottom-right .maplibregl-popup-tip{align-self:flex-start}.maplibregl-popup-close-button{background-color:transparent;border:0;border-radius:0 3px 0 0;cursor:pointer;position:absolute;right:0;top:0}.maplibregl-popup-close-button:hover{background-color:rgba(0,0,0,.05)}.maplibregl-popup-content{background:#fff;border-radius:3px;box-shadow:0 1px 2px rgba(0,0,0,.1);padding:15px 10px;pointer-events:auto;position:relative}.maplibregl-popup-anchor-top-left .maplibregl-popup-content{border-top-left-radius:0}.maplibregl-popup-anchor-top-right .maplibregl-popup-content{border-top-right-radius:0}.maplibregl-popup-anchor-bottom-left .maplibregl-popup-content{border-bottom-left-radius:0}.maplibregl-popup-anchor-bottom-right .maplibregl-popup-content{border-bottom-right-radius:0}.maplibregl-popup-track-pointer{display:none}.maplibregl-popup-track-pointer *{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.maplibregl-map:hover .maplibregl-popup-track-pointer{display:flex}.maplibregl-map:active .maplibregl-popup-track-pointer{display:none}.maplibregl-marker{left:0;position:absolute;top:0;transition:opacity .2s;will-change:transform}.maplibregl-user-location-dot,.maplibregl-user-location-dot:before{background-color:#1da1f2;border-radius:50%;height:15px;width:15px}.maplibregl-user-location-dot:before{animation:maplibregl-user-location-dot-pulse 2s infinite;content:"";position:absolute}.maplibregl-user-location-dot:after{border:2px solid #fff;border-radius:50%;box-shadow:0 0 3px rgba(0,0,0,.35);box-sizing:border-box;content:"";height:19px;left:-2px;position:absolute;top:-2px;width:19px}@media (prefers-reduced-motion:reduce){.maplibregl-user-location-dot:before{animation:none}}@keyframes maplibregl-user-location-dot-pulse{0%{opacity:1;transform:scale(1)}70%{opacity:0;transform:scale(3)}to{opacity:0;transform:scale(1)}}.maplibregl-user-location-dot-stale{background-color:#aaa}.maplibregl-user-location-dot-stale:after{display:none}.maplibregl-user-location-accuracy-circle{background-color:#1da1f233;border-radius:100%;height:1px;width:1px}.maplibregl-crosshair,.maplibregl-crosshair .maplibregl-interactive,.maplibregl-crosshair .maplibregl-interactive:active{cursor:crosshair}.maplibregl-boxzoom{background:#fff;border:2px dotted #202020;height:0;left:0;opacity:.5;position:absolute;top:0;width:0}.maplibregl-cooperative-gesture-screen{align-items:center;background:rgba(0,0,0,.4);color:#fff;display:flex;font-size:1.4em;inset:0;justify-content:center;line-height:1.2;opacity:0;padding:1rem;pointer-events:none;position:absolute;transition:opacity 1s ease 1s;z-index:99999}.maplibregl-cooperative-gesture-screen.maplibregl-show{opacity:1;transition:opacity .05s}.maplibregl-cooperative-gesture-screen .maplibregl-mobile-message{display:none}@media (hover:none),(pointer:coarse){.maplibregl-cooperative-gesture-screen .maplibregl-desktop-message{display:none}.maplibregl-cooperative-gesture-screen .maplibregl-mobile-message{display:block}}.maplibregl-pseudo-fullscreen{height:100%!important;left:0!important;position:fixed!important;top:0!important;width:100%!important;z-index:99999}