/* ── Homepage Intelligence Layer ── */
.root :global(.home-intelligence-panel) {
  position: fixed;
  top: calc(var(--header-height) + 16px);
  right: 18px;
  bottom: 20px;
  width: min(360px, calc(100vw - var(--sidebar-width) - 56px));
  z-index: 890;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 18px;
  overflow: hidden;
  border: 1px solid rgba(34, 211, 238, 0.18);
  border-radius: 24px;
  background:
    radial-gradient(
      circle at 18% 0%,
      rgba(34, 211, 238, 0.16),
      transparent 32%
    ),
    radial-gradient(
      circle at 100% 20%,
      rgba(59, 130, 246, 0.18),
      transparent 34%
    ),
    linear-gradient(155deg, rgba(5, 12, 25, 0.86), rgba(12, 19, 35, 0.78));
  backdrop-filter: blur(24px) saturate(130%);
  box-shadow:
    0 28px 80px rgba(0, 0, 0, 0.42),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
  animation: home-panel-enter 520ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.root :global(.home-panel-glow) {
  position: absolute;
  inset: -28% -30% auto auto;
  width: 260px;
  height: 260px;
  border-radius: 999px;
  background: radial-gradient(
    circle,
    rgba(34, 211, 238, 0.18),
    transparent 62%
  );
  pointer-events: none;
}

.root :global(.home-panel-kicker),
.root :global(.home-panel-airport),
.root :global(.home-signal-label),
.root :global(.home-pro-card span),
.root :global(.opportunity-strip-heading span) {
  color: rgba(148, 163, 184, 0.92);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.root :global(.home-panel-kicker) {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.root :global(.home-panel-pulse) {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--accent-cyan);
  box-shadow: 0 0 18px rgba(34, 211, 238, 0.7);
  animation: pulse 2s ease-in-out infinite;
}

.root :global(.home-panel-city) {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.root :global(.home-panel-city h2) {
  margin-top: 6px;
  color: #f8fafc;
  font-size: clamp(28px, 4vw, 42px);
  font-weight: 900;
  line-height: 0.92;
  letter-spacing: -0.07em;
}

.root :global(.home-risk-badge) {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 26px;
  border-radius: 999px;
  padding: 5px 10px 5px 8px;
  border: 1px solid rgba(148, 163, 184, 0.2);
  background: rgba(9, 18, 36, 0.58);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
  color: rgba(226, 232, 240, 0.88);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.01em;
  white-space: nowrap;
}

.root :global(.home-risk-badge::before) {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: currentColor;
  opacity: 0.88;
  box-shadow: 0 0 8px color-mix(in srgb, currentColor 24%, transparent);
}

.root :global(.home-risk-badge.high) {
  border-color: rgba(248, 113, 113, 0.34);
  color: #fda4af;
  background: rgba(69, 10, 10, 0.32);
}

.root :global(.home-risk-badge.medium) {
  border-color: rgba(251, 191, 36, 0.3);
  color: #fcd34d;
  background: rgba(67, 36, 6, 0.28);
}

.root :global(.home-risk-badge.low) {
  border-color: rgba(52, 211, 153, 0.28);
  color: #86efac;
  background: rgba(7, 47, 35, 0.28);
}

.root :global(.home-panel-subtitle) {
  max-width: 310px;
  color: rgba(203, 213, 225, 0.78);
  font-size: 13px;
  line-height: 1.6;
}

.root :global(.home-metric-grid) {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.root :global(.home-metric-card) {
  min-height: 86px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 12px;
  padding: 13px;
  border: 1px solid rgba(148, 163, 184, 0.13);
  border-radius: 18px;
  background: rgba(2, 6, 23, 0.36);
}

.root :global(.home-metric-card.primary) {
  background:
    linear-gradient(135deg, rgba(34, 211, 238, 0.2), rgba(59, 130, 246, 0.08)),
    rgba(2, 6, 23, 0.42);
  border-color: rgba(34, 211, 238, 0.24);
}

.root :global(.home-metric-card span) {
  color: rgba(148, 163, 184, 0.86);
  font-size: 11px;
  font-weight: 700;
}

.root :global(.home-metric-card strong) {
  color: #f8fafc;
  font-size: 24px;
  font-weight: 900;
  letter-spacing: -0.06em;
}

.root :global(.home-signal-card) {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 14px;
  padding: 14px;
  border: 1px solid rgba(34, 211, 238, 0.16);
  border-radius: 20px;
  background: rgba(8, 13, 27, 0.48);
}

.root :global(.home-signal-line) {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 5px;
  height: 68px;
}

.root :global(.home-signal-line span) {
  width: 7px;
  border-radius: 999px;
  background: linear-gradient(180deg, #22d3ee, #3b82f6);
  opacity: 0.88;
  animation: home-signal-wave 1.8s ease-in-out infinite;
}

.root :global(.home-signal-line span:nth-child(1)) {
  height: 32px;
}

.root :global(.home-signal-line span:nth-child(2)) {
  height: 56px;
  animation-delay: 180ms;
}

.root :global(.home-signal-line span:nth-child(3)) {
  height: 42px;
  animation-delay: 360ms;
}

.root :global(.home-signal-card strong) {
  display: block;
  margin: 5px 0 4px;
  color: #e2e8f0;
  font-size: 15px;
}

.root :global(.home-signal-card p) {
  color: rgba(148, 163, 184, 0.9);
  font-size: 12px;
  line-height: 1.55;
}

.root :global(.home-pro-card) {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px;
  border: 1px solid rgba(251, 191, 36, 0.26);
  border-radius: 20px;
  background:
    linear-gradient(135deg, rgba(251, 191, 36, 0.1), transparent 60%),
    rgba(15, 23, 42, 0.52);
}

.root :global(.home-pro-card.active) {
  border-color: rgba(34, 211, 238, 0.28);
  background:
    linear-gradient(135deg, rgba(34, 211, 238, 0.12), transparent 60%),
    rgba(15, 23, 42, 0.52);
}

.root :global(.home-pro-card strong) {
  display: block;
  margin-top: 5px;
  color: #f8fafc;
  font-size: 12px;
  line-height: 1.45;
}

.root :global(.home-pro-card a),
.root :global(.home-pro-card button) {
  flex-shrink: 0;
  border: 1px solid rgba(34, 211, 238, 0.32);
  border-radius: 999px;
  background: rgba(34, 211, 238, 0.1);
  color: #a5f3fc;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  padding: 8px 12px;
  text-decoration: none;
  transition:
    transform 160ms ease,
    border-color 160ms ease,
    background 160ms ease;
}

.root :global(.home-pro-card a:hover),
.root :global(.home-pro-card button:hover) {
  transform: translateY(-1px);
  border-color: rgba(34, 211, 238, 0.62);
  background: rgba(34, 211, 238, 0.16);
}

.root :global(.home-intelligence-panel.full) {
  bottom: 18px;
  width: min(372px, calc(100vw - var(--sidebar-width) - 56px));
  gap: 14px;
  overflow-y: auto;
  border-color: rgba(34, 211, 238, 0.22);
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(37, 99, 235, 0.18),
      transparent 38%
    ),
    radial-gradient(
      circle at 0% 100%,
      rgba(34, 211, 238, 0.06),
      transparent 32%
    ),
    linear-gradient(165deg, rgba(3, 10, 22, 0.96), rgba(5, 18, 38, 0.94));
  box-shadow:
    inset 1px 0 0 rgba(255, 255, 255, 0.04),
    -10px 0 34px rgba(0, 0, 0, 0.18);
}

.root :global(.home-intelligence-panel.full::-webkit-scrollbar) {
  width: 4px;
}

.root :global(.home-intelligence-panel.full::-webkit-scrollbar-thumb) {
  background: rgba(34, 211, 238, 0.28);
  border-radius: 999px;
}

/* Close button removed — panel always visible */

.root :global(.home-panel-header-left) {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.root :global(.home-panel-live-indicator) {
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #22c55e;
  box-shadow: 0 0 10px rgba(34, 197, 94, 0.6);
  animation: pulse 2s ease-in-out infinite;
}

.root :global(.home-panel-header) {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(115, 137, 161, 0.12);
}

.root :global(.home-focus-title) {
  color: rgba(226, 232, 240, 0.92);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.root :global(.home-why-link) {
  border: 1px solid rgba(96, 165, 250, 0.22);
  border-radius: 999px;
  padding: 4px 10px;
  background: rgba(96, 165, 250, 0.06);
  color: #93c5fd;
  cursor: pointer;
  font: inherit;
  font-size: 10px;
  font-weight: 700;
  transition: all 180ms ease;
}

.root :global(.home-why-link:hover) {
  border-color: rgba(96, 165, 250, 0.42);
  background: rgba(96, 165, 250, 0.12);
  color: #bfdbfe;
}

.root :global(.home-top-opportunity-label) {
  display: inline-flex;
  align-self: flex-start;
  align-items: center;
  gap: 7px;
  padding: 5px 8px;
  border: 1px solid rgba(34, 211, 238, 0.18);
  border-radius: 999px;
  background: rgba(8, 145, 178, 0.1);
  color: var(--color-accent-secondary);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.root :global(.home-top-opportunity-label::before) {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #22c55e;
  box-shadow: 0 0 12px rgba(34, 197, 94, 0.72);
}

.root :global(.home-card-titlebar) {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.root :global(.home-card-titlebar h2) {
  color: #f8fafc;
  font-size: 22px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.045em;
}

.root :global(.home-card-titlebar p),
.root :global(.home-card-meta-row) {
  color: rgba(148, 163, 184, 0.88);
  font-size: 12px;
  font-weight: 600;
}

.root :global(.home-card-titlebar p) {
  margin-top: 7px;
}

.root :global(.home-card-meta-row) {
  display: flex;
  align-items: center;
  gap: 8px;
}

.root :global(.home-card-live-dot) {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #22c55e;
  box-shadow: 0 0 12px rgba(34, 197, 94, 0.72);
}

.root :global(.home-weather-hero) {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 130px;
  gap: 14px;
  align-items: center;
  padding: 16px;
  border: 1px solid rgba(34, 211, 238, 0.14);
  border-radius: 18px;
  background:
    radial-gradient(
      circle at 88% 24%,
      rgba(245, 158, 11, 0.12),
      transparent 24%
    ),
    linear-gradient(180deg, rgba(8, 16, 30, 0.62), rgba(4, 10, 22, 0.36));
}

.root :global(.home-weather-main strong) {
  display: block;
  color: #f8fafc;
  font-size: 62px;
  font-weight: 900;
  line-height: 0.96;
  letter-spacing: -0.08em;
}

.root :global(.home-weather-label),
.root :global(.home-weather-sub),
.root :global(.home-weather-stat span),
.root :global(.home-weather-stat small) {
  display: block;
  color: rgba(148, 163, 184, 0.88);
  font-size: 12px;
}

.root :global(.home-weather-label) {
  margin-bottom: 8px;
  color: var(--color-accent-secondary);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.root :global(.home-weather-sub) {
  margin-top: 10px;
}

.root :global(.home-weather-side) {
  display: grid;
  justify-items: end;
  gap: 10px;
}

.root :global(.home-weather-icon) {
  position: relative;
  width: 88px;
  height: 76px;
}

.root :global(.home-weather-stat) {
  min-width: 118px;
  padding: 9px 10px;
  border: 1px solid rgba(148, 163, 184, 0.12);
  border-radius: 12px;
  background: rgba(2, 8, 18, 0.35);
  text-align: right;
}

.root :global(.home-weather-stat strong) {
  display: block;
  margin-top: 3px;
  color: #f8fafc;
  font-size: 18px;
  font-weight: 900;
}

.root :global(.home-weather-stat small) {
  margin-top: 2px;
  font-size: 10px;
}

.root :global(.home-weather-icon .sun),
.root :global(.home-weather-icon .mist),
.root :global(.home-weather-icon .wind),
.root :global(.home-weather-icon .bolt) {
  position: absolute;
}

.root :global(.home-weather-icon .sun) {
  top: 8px;
  left: 6px;
  width: 26px;
  height: 26px;
  border-radius: 999px;
  background: radial-gradient(circle, #fde68a 0%, #f59e0b 70%, #f97316 100%);
  box-shadow:
    0 0 0 7px rgba(251, 191, 36, 0.12),
    0 0 22px rgba(245, 158, 11, 0.26);
}

.root :global(.home-weather-icon .cloud) {
  position: absolute;
  border-radius: 999px;
  background: linear-gradient(180deg, #b8c4d2, #6B7A90);
  filter: drop-shadow(0 10px 18px rgba(0, 0, 0, 0.28));
}

.root :global(.home-weather-icon .cloud-a) {
  left: 10px;
  top: 24px;
  width: 70px;
  height: 30px;
}

.root :global(.home-weather-icon .cloud-b) {
  left: 31px;
  top: 10px;
  width: 37px;
  height: 37px;
}

.root :global(.home-weather-icon .rain) {
  position: absolute;
  top: 58px;
  width: 4px;
  height: 13px;
  border-radius: 999px;
  background: var(--color-accent-primary);
  transform: rotate(18deg);
}

.root :global(.home-weather-icon .rain-a) {
  left: 29px;
}

.root :global(.home-weather-icon .rain-b) {
  left: 48px;
}

.root :global(.home-weather-icon .rain-c) {
  left: 67px;
}

.root :global(.home-weather-icon .mist) {
  left: 20px;
  width: 46px;
  height: 2px;
  border-radius: 999px;
  background: rgba(191, 219, 254, 0.85);
  box-shadow: 0 0 10px rgba(148, 163, 184, 0.18);
}

.root :global(.home-weather-icon .mist-a) {
  top: 58px;
}

.root :global(.home-weather-icon .mist-b) {
  top: 64px;
  left: 28px;
  width: 38px;
}

.root :global(.home-weather-icon .wind) {
  left: 20px;
  width: 44px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    rgba(125, 211, 252, 0),
    rgba(125, 211, 252, 0.92)
  );
}

.root :global(.home-weather-icon .wind::after) {
  content: "";
  position: absolute;
  right: -3px;
  top: -1px;
  width: 9px;
  height: 4px;
  border-top: 2px solid rgba(125, 211, 252, 0.92);
  border-right: 2px solid rgba(125, 211, 252, 0.92);
  border-radius: 0 8px 0 0;
}

.root :global(.home-weather-icon .wind-a) {
  top: 28px;
}

.root :global(.home-weather-icon .wind-b) {
  top: 42px;
  left: 30px;
  width: 34px;
}

.root :global(.home-weather-icon .bolt) {
  top: 44px;
  left: 20px;
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 2px solid transparent;
  border-top: 18px solid #fbbf24;
  transform: skewX(-16deg);
  filter: drop-shadow(0 0 12px rgba(251, 191, 36, 0.32));
}

.root :global(.home-weather-icon .bolt::after) {
  content: "";
  position: absolute;
  left: -5px;
  top: -4px;
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 2px solid transparent;
  border-top: 12px solid #fde047;
  transform: translateX(5px) translateY(8px);
}

.root :global(.home-weather-icon.weather-clear .cloud),
.root :global(.home-weather-icon.weather-clear .rain),
.root :global(.home-weather-icon.weather-clear .mist),
.root :global(.home-weather-icon.weather-clear .wind),
.root :global(.home-weather-icon.weather-clear .bolt) {
  display: none;
}

.root :global(.home-weather-icon.weather-partly .rain),
.root :global(.home-weather-icon.weather-partly .mist),
.root :global(.home-weather-icon.weather-partly .wind),
.root :global(.home-weather-icon.weather-partly .bolt) {
  display: none;
}

.root :global(.home-weather-icon.weather-cloudy .sun),
.root :global(.home-weather-icon.weather-cloudy .rain),
.root :global(.home-weather-icon.weather-cloudy .mist),
.root :global(.home-weather-icon.weather-cloudy .wind),
.root :global(.home-weather-icon.weather-cloudy .bolt) {
  display: none;
}

.root :global(.home-weather-icon.weather-rain .sun),
.root :global(.home-weather-icon.weather-rain .mist),
.root :global(.home-weather-icon.weather-rain .wind),
.root :global(.home-weather-icon.weather-rain .bolt) {
  display: none;
}

.root :global(.home-weather-icon.weather-storm .sun),
.root :global(.home-weather-icon.weather-storm .mist),
.root :global(.home-weather-icon.weather-storm .wind) {
  display: none;
}

.root :global(.home-weather-icon.weather-mist .sun),
.root :global(.home-weather-icon.weather-mist .rain),
.root :global(.home-weather-icon.weather-mist .wind),
.root :global(.home-weather-icon.weather-mist .bolt) {
  display: none;
}

.root :global(.home-weather-icon.weather-wind .sun),
.root :global(.home-weather-icon.weather-wind .rain),
.root :global(.home-weather-icon.weather-wind .mist),
.root :global(.home-weather-icon.weather-wind .bolt) {
  display: none;
}

.root :global(.home-max-so-far) {
  grid-column: 2;
  color: rgba(203, 213, 225, 0.86);
  font-size: 12px;
  text-align: right;
}

.root :global(.home-max-so-far strong) {
  display: block;
  margin-top: 4px;
  font-size: 16px;
  letter-spacing: -0.03em;
}

.root :global(.home-max-so-far small) {
  color: rgba(148, 163, 184, 0.9);
  font-size: 11px;
}

.root :global(.home-deb-card),
.root :global(.home-card-section) {
  border-radius: 14px;
  border: 1px solid rgba(115, 137, 161, 0.12);
  background: linear-gradient(
    180deg,
    rgba(8, 16, 30, 0.88),
    rgba(6, 12, 24, 0.74)
  );
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 2px 8px rgba(0, 0, 0, 0.18);
  transition: border-color 200ms ease;
}

.root :global(.home-deb-card:hover),
.root :global(.home-card-section:hover) {
  border-color: rgba(34, 211, 238, 0.18);
}

.root :global(.home-deb-card) {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px;
}

.root :global(.home-deb-card span),
.root :global(.home-card-section h3) {
  color: var(--color-accent-secondary);
  font-size: 12px;
  font-weight: 800;
}

.root :global(.home-deb-card small),
.root :global(.home-card-section h3 small) {
  color: rgba(148, 163, 184, 0.82);
  font-weight: 700;
}

.root :global(.home-deb-card strong) {
  display: inline-block;
  margin-top: 9px;
  color: #f8fafc;
  font-size: 26px;
  font-weight: 900;
  letter-spacing: -0.055em;
}

.root :global(.home-deb-card em) {
  margin-left: 10px;
  color: #f87171;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
}

.root :global(.home-market-metrics svg) {
  width: 100%;
  height: 42px;
}

.root :global(.home-market-metrics polyline) {
  fill: none;
  stroke: #18e6d4;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.2;
}

.root :global(.home-card-section) {
  padding: 12px 14px;
}

.root :global(.home-card-section h3) {
  margin-bottom: 10px;
  color: rgba(226, 232, 240, 0.94);
}

.root :global(.home-card-section.intraday) {
  border-color: rgba(34, 211, 238, 0.2);
  background:
    radial-gradient(
      circle at 0% 35%,
      rgba(34, 211, 238, 0.12),
      transparent 44%
    ),
    linear-gradient(180deg, rgba(7, 14, 26, 0.94), rgba(9, 17, 30, 0.82));
}

.root :global(.home-intraday-chart) {
  position: relative;
  padding: 6px 0 18px 34px;
}

.root :global(.home-intraday-chart svg) {
  width: calc(100% - 34px);
  margin-left: 34px;
  height: 78px;
}

.root :global(.home-intraday-y-axis) {
  position: absolute;
  inset: 0 auto 18px 0;
  width: 30px;
  pointer-events: none;
}

.root :global(.home-intraday-y-label) {
  position: absolute;
  left: 0;
  transform: translateY(-50%);
  color: rgba(148, 163, 184, 0.72);
  font-size: 10px;
  font-weight: 700;
}

.root :global(.home-intraday-x-axis) {
  position: absolute;
  left: 34px;
  right: 10px;
  bottom: 0;
  height: 14px;
  pointer-events: none;
}

.root :global(.home-intraday-x-label) {
  position: absolute;
  bottom: 0;
  transform: translateX(-50%);
  color: rgba(148, 163, 184, 0.72);
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
}

.root :global(.home-intraday-chart line) {
  stroke: rgba(115, 137, 161, 0.14);
  stroke-width: 0.9;
}

.root :global(.home-intraday-chart polyline) {
  fill: none;
  stroke: #22d3ee;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 8px rgba(34, 211, 238, 0.22));
}

.root :global(.home-intraday-chart circle) {
  fill: var(--color-accent-primary);
  stroke: rgba(15, 23, 42, 0.92);
  stroke-width: 1.6;
  filter: drop-shadow(0 0 10px rgba(56, 189, 248, 0.28));
}

.root :global(.home-intraday-reports) {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin-top: 8px;
}

.root :global(.home-intraday-reports span) {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  padding: 7px 8px;
  border: 1px solid rgba(34, 211, 238, 0.12);
  border-radius: 10px;
  background: rgba(2, 8, 18, 0.55);
}

.root :global(.home-intraday-reports b) {
  color: rgba(148, 163, 184, 0.9);
  font-size: 10px;
  font-weight: 800;
}

.root :global(.home-intraday-reports strong) {
  color: #e0f2fe;
  font-size: 11px;
  font-weight: 900;
}

.root :global(.home-card-section.forecast) {
  border-color: rgba(99, 102, 241, 0.24);
}

.root :global(.home-forecast-grid) {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.root :global(.home-forecast-item) {
  min-width: 0;
  padding: 10px 8px;
  border: 1px solid rgba(148, 163, 184, 0.14);
  border-radius: 12px;
  background: rgba(15, 23, 42, 0.5);
  text-align: center;
}

.root :global(.home-forecast-item span) {
  display: block;
  color: rgba(148, 163, 184, 0.84);
  font-size: 10px;
  font-weight: 800;
}

.root :global(.home-forecast-item strong) {
  display: block;
  margin-top: 6px;
  color: #f8fafc;
  font-size: 16px;
  font-weight: 900;
  letter-spacing: -0.04em;
}

.root :global(.home-model-stack) {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.root :global(.home-model-stack span) {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 8px;
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 6px;
  background: rgba(15, 23, 42, 0.72);
  color: rgba(226, 232, 240, 0.92);
  font-size: 11px;
  font-weight: 800;
}

.root :global(.home-model-stack i),
.root :global(.key-signals i.active) {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #22c55e;
  box-shadow: 0 0 10px rgba(34, 197, 94, 0.62);
}

.root :global(.home-card-section.probability) {
  border-color: rgba(251, 113, 133, 0.18);
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(251, 113, 133, 0.08),
      transparent 42%
    ),
    linear-gradient(180deg, rgba(7, 14, 26, 0.94), rgba(9, 17, 30, 0.82));
}

.root :global(.home-probability-list),
.root :global(.home-probability-ladder) {
  display: grid;
  gap: 8px;
}

.root :global(.home-probability-row),
.root :global(.home-probability-ladder-row) {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) 42px;
  align-items: center;
  gap: 9px;
  color: rgba(226, 232, 240, 0.95);
  font-size: 12px;
  font-weight: 800;
}

.root :global(.home-probability-row div),
.root :global(.home-probability-track) {
  position: relative;
  height: 14px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(115, 137, 161, 0.12);
}

.root :global(.home-probability-row i),
.root :global(.home-probability-track i) {
  position: absolute;
  inset: 0 auto 0 0;
  border-radius: inherit;
  background: linear-gradient(90deg, #3b82f6, #18e6d4);
  box-shadow: 0 0 10px rgba(34, 211, 238, 0.14);
}

.root :global(.home-probability-row strong),
.root :global(.home-probability-ladder-row strong) {
  position: relative;
  z-index: 1;
  display: block;
  color: #f8fafc;
  font-size: 12px;
  line-height: 1;
  text-align: right;
}

.root :global(.home-probability-threshold) {
  color: rgba(226, 232, 240, 0.95);
  font-size: 12px;
  font-weight: 900;
}

.root :global(.home-card-empty) {
  color: rgba(148, 163, 184, 0.9);
  font-size: 12px;
  line-height: 1.5;
}

.root :global(.home-card-section.market) {
  position: relative;
  border-color: rgba(34, 211, 238, 0.16);
}

.root :global(.home-card-section.market.locked) {
  border-color: rgba(251, 191, 36, 0.28);
}

.root :global(.home-market-header),
.root :global(.home-market-ticket),
.root :global(.home-market-prices),
.root :global(.home-market-metrics) {
  display: flex;
  align-items: center;
}

.root :global(.home-market-header),
.root :global(.home-market-ticket) {
  justify-content: space-between;
  gap: 10px;
}

.root :global(.home-market-header span) {
  color: rgba(148, 163, 184, 0.88);
  font-size: 11px;
  font-weight: 700;
}

.root :global(.home-market-ticket) {
  margin-top: 8px;
}

.root :global(.home-market-question strong) {
  display: block;
  color: #f8fafc;
  font-size: 15px;
}

.root :global(.home-market-question span) {
  display: block;
  margin-top: 3px;
  color: rgba(148, 163, 184, 0.8);
  font-size: 11px;
}

.root :global(.home-market-prices) {
  gap: 6px;
}

.root :global(.home-market-prices span) {
  border-radius: 7px;
  padding: 7px 9px;
  font-size: 12px;
  font-weight: 900;
}

.root :global(.home-market-prices .yes) {
  color: var(--color-accent-secondary);
  background: rgba(8, 145, 178, 0.2);
}

.root :global(.home-market-prices .no) {
  color: #fca5a5;
  background: rgba(127, 29, 29, 0.24);
}

.root :global(.home-market-metrics) {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) 94px;
  gap: 8px;
  margin-top: 10px;
}

.root :global(.home-market-metrics span) {
  color: rgba(148, 163, 184, 0.84);
  font-size: 11px;
}

.root :global(.home-market-metrics strong) {
  display: block;
  margin-top: 3px;
  color: #22c55e;
  font-size: 13px;
}

.root :global(.home-market-lock) {
  display: inline-flex;
  margin-top: 10px;
  color: #fde68a;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.root :global(.key-signals) {
  border-color: transparent;
  background: transparent;
  padding: 0 4px;
}

.root :global(.key-signals ul) {
  display: grid;
  gap: 7px;
  list-style: none;
}

.root :global(.key-signals li) {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: rgba(203, 213, 225, 0.88);
  font-size: 12px;
}

.root :global(.key-signals i) {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.42);
}

.root :global(.key-signals i.amber.active) {
  background: #f59e0b;
  box-shadow: 0 0 10px rgba(245, 158, 11, 0.62);
}

.root :global(.key-signals p) {
  margin-top: 9px;
  color: rgba(100, 116, 139, 0.9);
  font-size: 11px;
}

.root :global(.home-intelligence-panel.full .home-pro-card) {
  margin-top: 0;
}

.root :global(.home-opportunity-strip) {
  position: fixed;
  left: calc(var(--sidebar-width) + 22px);
  right: 392px;
  bottom: 18px;
  z-index: 880;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 16px;
  border: 1px solid rgba(148, 163, 184, 0.14);
  border-radius: 24px;
  background:
    radial-gradient(
      circle at 82% -10%,
      rgba(59, 130, 246, 0.14),
      transparent 34%
    ),
    radial-gradient(
      circle at 8% 50%,
      rgba(34, 211, 238, 0.12),
      transparent 32%
    ),
    rgba(7, 13, 25, 0.76);
  backdrop-filter: blur(20px) saturate(130%);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.34);
  animation: opportunity-strip-enter 580ms cubic-bezier(0.16, 1, 0.3, 1) 120ms
    both;
}

.root :global(.opportunity-strip-topline) {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.root :global(.opportunity-strip-copy) {
  display: flex;
  flex-direction: column;
  gap: 7px;
  min-width: 0;
  flex: 1;
}

.root :global(.opportunity-strip-kicker) {
  color: rgba(148, 163, 184, 0.8);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.root :global(.opportunity-strip-copy strong) {
  color: #f8fafc;
  font-size: 19px;
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: -0.02em;
}

.root :global(.opportunity-strip-copy p) {
  max-width: 620px;
  color: rgba(191, 219, 254, 0.74);
  font-size: 12px;
  line-height: 1.6;
}

.root :global(.opportunity-strip-tape) {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
  max-width: 460px;
}

.root :global(.opportunity-tape-pill) {
  display: flex;
  min-width: 92px;
  flex-direction: column;
  gap: 3px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(148, 163, 184, 0.16);
  background: rgba(9, 16, 30, 0.7);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
}

.root :global(.opportunity-tape-pill span) {
  color: rgba(148, 163, 184, 0.82);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.root :global(.opportunity-tape-pill strong) {
  color: #f8fafc;
  font-size: 16px;
  font-weight: 800;
  line-height: 1;
}

.root :global(.opportunity-tape-pill.accent-cyan strong) {
  color: var(--color-accent-secondary);
}

.root :global(.opportunity-tape-pill.accent-green strong) {
  color: #4ade80;
}

.root :global(.opportunity-tape-pill.accent-slate strong) {
  color: rgba(226, 232, 240, 0.78);
}

.root :global(.opportunity-tape-pill.accent-outline) {
  min-width: auto;
  justify-content: center;
  padding: 9px 11px;
  background: rgba(6, 11, 23, 0.62);
}

.root :global(.opportunity-tape-pill.accent-outline span) {
  color: rgba(191, 219, 254, 0.92);
  font-size: 11px;
  letter-spacing: 0;
  text-transform: none;
}

.root :global(.opportunity-strip-main) {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(280px, 0.92fr);
  gap: 14px;
}

.root :global(.opportunity-hero-card) {
  position: relative;
  overflow: hidden;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-height: 244px;
  padding: 18px;
  border: 1px solid rgba(56, 189, 248, 0.18);
  border-radius: 22px;
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(14, 165, 233, 0.22),
      transparent 28%
    ),
    radial-gradient(
      circle at 12% 88%,
      rgba(16, 185, 129, 0.1),
      transparent 28%
    ),
    linear-gradient(135deg, rgba(7, 14, 28, 0.96), rgba(12, 27, 48, 0.92));
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: left;
  box-shadow:
    0 18px 42px rgba(2, 6, 23, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
  transition:
    transform 160ms ease,
    border-color 160ms ease,
    box-shadow 160ms ease;
}

.root :global(.opportunity-hero-card:hover) {
  transform: translateY(-2px);
  border-color: rgba(34, 211, 238, 0.36);
  box-shadow:
    0 24px 52px rgba(2, 6, 23, 0.36),
    0 0 0 1px rgba(34, 211, 238, 0.08);
}

.root :global(.opportunity-hero-header) {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.root :global(.opportunity-hero-copy) {
  display: flex;
  min-width: 0;
  flex: 1;
  flex-direction: column;
  gap: 6px;
}

.root :global(.opportunity-hero-kicker) {
  color: var(--color-accent-secondary);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.root :global(.opportunity-hero-title-row) {
  display: flex;
  align-items: baseline;
  gap: 10px;
  min-width: 0;
}

.root :global(.opportunity-hero-title-row strong) {
  overflow: hidden;
  color: #f8fafc;
  font-size: 28px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.04em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.root :global(.opportunity-hero-date) {
  color: rgba(186, 230, 253, 0.76);
  font-size: 12px;
  font-weight: 700;
}

.root :global(.opportunity-hero-copy p) {
  max-width: 520px;
  color: rgba(226, 232, 240, 0.82);
  font-size: 13px;
  line-height: 1.55;
}

.root :global(.opportunity-hero-tags) {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.root :global(.opportunity-hero-tag) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 0 11px;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.16);
  background: rgba(7, 13, 25, 0.58);
  color: rgba(226, 232, 240, 0.92);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.root :global(.opportunity-hero-tag.engine) {
  border-color: rgba(34, 211, 238, 0.24);
  color: var(--color-accent-secondary);
}

.root :global(.opportunity-hero-tag.signal-yes) {
  border-color: rgba(74, 222, 128, 0.26);
  color: #86efac;
}

.root :global(.opportunity-hero-tag.signal-no) {
  border-color: rgba(251, 113, 133, 0.24);
  color: #fda4af;
}

.root :global(.opportunity-hero-tag.signal-neutral) {
  color: rgba(191, 219, 254, 0.88);
}

.root :global(.opportunity-hero-tag.risk.high) {
  border-color: rgba(251, 113, 133, 0.24);
  color: #fda4af;
}

.root :global(.opportunity-hero-tag.risk.medium) {
  border-color: rgba(251, 191, 36, 0.24);
  color: #fcd34d;
}

.root :global(.opportunity-hero-tag.risk.low) {
  border-color: rgba(74, 222, 128, 0.24);
  color: #86efac;
}

.root :global(.opportunity-hero-body) {
  display: grid;
  gap: 14px;
}

.root :global(.opportunity-hero-edgeblock) {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid rgba(34, 211, 238, 0.18);
  background: linear-gradient(
    135deg,
    rgba(8, 15, 28, 0.84),
    rgba(13, 30, 52, 0.82)
  );
}

.root :global(.opportunity-hero-edgeblock span) {
  color: rgba(148, 163, 184, 0.8);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.root :global(.opportunity-hero-edgeblock strong) {
  color: #4ade80;
  font-size: 44px;
  font-weight: 900;
  line-height: 0.95;
  letter-spacing: -0.05em;
}

.root :global(.opportunity-hero-edgeblock em) {
  color: rgba(191, 219, 254, 0.84);
  font-size: 12px;
  font-style: normal;
  line-height: 1.5;
}

.root :global(.opportunity-hero-metrics) {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.root :global(.opportunity-hero-metric) {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 5px;
  padding: 12px 13px;
  border-radius: 14px;
  border: 1px solid rgba(148, 163, 184, 0.14);
  background: rgba(9, 16, 30, 0.6);
}

.root :global(.opportunity-hero-metric span) {
  color: rgba(148, 163, 184, 0.8);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.root :global(.opportunity-hero-metric strong) {
  overflow: hidden;
  color: #f8fafc;
  font-size: 20px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.03em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.root :global(.opportunity-hero-book) {
  display: grid;
  grid-template-columns: repeat(2, minmax(110px, 132px)) minmax(0, 1fr);
  gap: 12px;
  align-items: stretch;
}

.root :global(.opportunity-book-side) {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(148, 163, 184, 0.16);
  background: rgba(6, 11, 23, 0.62);
}

.root :global(.opportunity-book-side span) {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.root :global(.opportunity-book-side strong) {
  font-size: 26px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.03em;
}

.root :global(.opportunity-book-side.yes) {
  border-color: rgba(34, 211, 238, 0.22);
}

.root :global(.opportunity-book-side.yes span),
.root :global(.opportunity-book-side.yes strong) {
  color: #22d3ee;
}

.root :global(.opportunity-book-side.no) {
  border-color: rgba(251, 113, 133, 0.22);
}

.root :global(.opportunity-book-side.no span),
.root :global(.opportunity-book-side.no strong) {
  color: #fda4af;
}

.root :global(.opportunity-hero-sparkline-wrap) {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(148, 163, 184, 0.14);
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(59, 130, 246, 0.14),
      transparent 32%
    ),
    rgba(8, 15, 28, 0.66);
}

.root :global(.opportunity-hero-sparkline-wrap span) {
  color: rgba(148, 163, 184, 0.8);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.root :global(.opportunity-hero-sparkline) {
  width: 100%;
  height: 44px;
}

.root :global(.opportunity-hero-sparkline polyline) {
  fill: none;
  stroke: #18e6d4;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 10px rgba(34, 211, 238, 0.26));
}

.root :global(.opportunity-hero-footer) {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: rgba(191, 219, 254, 0.82);
  font-size: 11px;
  font-weight: 700;
}

.root :global(.opportunity-side-grid) {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.root :global(.opportunity-side-tile) {
  display: flex;
  min-height: 116px;
  flex-direction: column;
  justify-content: space-between;
  gap: 12px;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid rgba(148, 163, 184, 0.14);
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(30, 64, 175, 0.12),
      transparent 30%
    ),
    rgba(9, 16, 30, 0.68);
}

.root :global(.opportunity-side-tile-head span) {
  color: rgba(241, 245, 249, 0.92);
  font-size: 13px;
  font-weight: 700;
}

.root :global(.opportunity-side-tile-body) {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.root :global(.opportunity-side-stat) {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 4px;
}

.root :global(.opportunity-side-stat b) {
  overflow: hidden;
  color: #f8fafc;
  font-size: 24px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.04em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.root :global(.opportunity-side-stat span) {
  color: rgba(148, 163, 184, 0.82);
  font-size: 10px;
  font-weight: 600;
}

.root :global(.opportunity-side-stat b.accent-red) {
  color: #fb7185;
}

.root :global(.opportunity-side-stat b.accent-amber) {
  color: #fbbf24;
}

.root :global(.opportunity-side-stat b.accent-green) {
  color: #4ade80;
}

.root :global(.opportunity-side-stat b.accent-cyan) {
  color: #22d3ee;
}

.root :global(.opportunity-mini-grid) {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.root :global(.opportunity-empty-state) {
  display: flex;
  min-height: 168px;
  align-items: center;
  justify-content: center;
  padding: 0 18px;
  border: 1px dashed rgba(34, 211, 238, 0.2);
  border-radius: 16px;
  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(34, 211, 238, 0.08),
      transparent 44%
    ),
    rgba(7, 12, 22, 0.72);
}

.root :global(.opportunity-empty-copy) {
  display: grid;
  gap: 6px;
  justify-items: center;
  text-align: center;
}

.root :global(.opportunity-empty-copy strong) {
  color: rgba(241, 245, 249, 0.94);
  font-size: 15px;
  font-weight: 800;
}

.root :global(.opportunity-empty-copy span) {
  color: rgba(148, 163, 184, 0.88);
  font-size: 12px;
  line-height: 1.6;
}

.root :global(.opportunity-mini-card) {
  position: relative;
  overflow: hidden;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 152px;
  padding: 14px;
  border: 1px solid rgba(148, 163, 184, 0.14);
  border-radius: 18px;
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(30, 64, 175, 0.12),
      transparent 32%
    ),
    rgba(10, 16, 28, 0.84);
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: left;
  transition:
    transform 160ms ease,
    border-color 160ms ease,
    background 160ms ease;
}

.root :global(.opportunity-mini-card:hover) {
  transform: translateY(-2px);
  border-color: rgba(34, 211, 238, 0.32);
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(30, 64, 175, 0.18),
      transparent 32%
    ),
    rgba(15, 23, 42, 0.92);
}

.root :global(.opportunity-mini-head) {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.root :global(.opportunity-mini-rank) {
  width: 30px;
  height: 30px;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.2);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #f8fafc;
  font-size: 13px;
  font-weight: 800;
  flex-shrink: 0;
  background: rgba(6, 11, 23, 0.46);
}

.root :global(.opportunity-mini-copy) {
  display: flex;
  min-width: 0;
  flex: 1;
  flex-direction: column;
  gap: 6px;
}

.root :global(.opportunity-pill) {
  margin-left: auto;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  border: 1px solid rgba(148, 163, 184, 0.18);
  color: rgba(226, 232, 240, 0.86);
}

.root :global(.opportunity-pill.high) {
  color: #fda4af;
  border-color: rgba(251, 113, 133, 0.26);
}

.root :global(.opportunity-pill.medium) {
  color: #fbbf24;
  border-color: rgba(251, 191, 36, 0.24);
}

.root :global(.opportunity-pill.low) {
  color: #4ade80;
  border-color: rgba(74, 222, 128, 0.24);
}

.root :global(.opportunity-mini-copy strong) {
  overflow: hidden;
  color: #f8fafc;
  font-size: 15px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.root :global(.opportunity-mini-copy p) {
  display: -webkit-box;
  overflow: hidden;
  color: rgba(203, 213, 225, 0.88);
  font-size: 11px;
  line-height: 1.45;
  min-height: 32px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.root :global(.opportunity-mini-metrics) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.root :global(.opportunity-yes) {
  color: #22d3ee;
  font-size: 12px;
  font-weight: 800;
}

.root :global(.opportunity-no) {
  color: #fda4af;
  font-size: 12px;
  font-weight: 800;
}

.root :global(.opportunity-edge) {
  color: rgba(34, 211, 238, 0.9);
  font-size: 18px;
  font-weight: 800;
}

.root :global(.opportunity-mini-sparkline) {
  width: 100%;
  height: 28px;
  margin-top: auto;
}

.root :global(.opportunity-mini-sparkline polyline) {
  fill: none;
  stroke: #18e6d4;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 8px rgba(34, 211, 238, 0.22));
}

/* ── Light Theme Dashboard Overrides ── */
:global(html.light) .root {
  background:
    radial-gradient(
      circle at 22% 12%,
      rgba(14, 165, 233, 0.16),
      transparent 28%
    ),
    radial-gradient(
      circle at 78% 0%,
      rgba(59, 130, 246, 0.12),
      transparent 24%
    ),
    linear-gradient(180deg, #f8fbff 0%, #e7f1fb 100%);
}

:global(html.light) .root :global(.map) {
  background: #dfeefa;
  border-color: rgba(36, 68, 104, 0.18);
  filter: none;
  box-shadow:
    0 28px 80px rgba(31, 64, 104, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.86);
}

:global(html.light) .root :global(.map .leaflet-tile) {
  filter: saturate(1.08) contrast(0.98) brightness(1.02);
}

:global(html.light) .weatherAura {
  opacity: 0.22;
  mix-blend-mode: multiply;
}

:global(html.light) .weatherAuraScrim {
  background:
    linear-gradient(
      180deg,
      rgba(248, 252, 255, 0.2) 0%,
      rgba(248, 252, 255, 0.08) 42%,
      rgba(226, 239, 250, 0.28) 100%
    ),
    radial-gradient(
      circle at 50% 58%,
      rgba(14, 165, 233, 0.08) 0%,
      rgba(14, 165, 233, 0) 52%
    );
}

:global(html.light) .root :global(.home-panel-city h2),
:global(html.light) .root :global(.home-weather-main strong),
:global(html.light) .root :global(.home-weather-stat strong),
:global(html.light) .root :global(.home-deb-card strong),
:global(html.light) .root :global(.home-card-section h3),
:global(html.light) .root :global(.opportunity-strip-copy strong),
:global(html.light) .root :global(.opportunity-hero-title-row strong),
:global(html.light) .root :global(.opportunity-hero-metric strong),
:global(html.light) .root :global(.opportunity-hero-edgeblock strong),
:global(html.light) .root :global(.opportunity-book-side strong),
:global(html.light) .root :global(.opportunity-side-stat b),
:global(html.light) .root :global(.opportunity-mini-copy strong),
:global(html.light) .root :global(.city-item .city-name-text) {
  color: #0b1726;
}

:global(html.light) .root :global(.home-panel-subtitle),
:global(html.light) .root :global(.home-weather-sub),
:global(html.light) .root :global(.home-weather-label),
:global(html.light) .root :global(.home-weather-stat span),
:global(html.light) .root :global(.home-weather-stat small),
:global(html.light) .root :global(.home-deb-card small),
:global(html.light) .root :global(.home-card-section h3 small),
:global(html.light) .root :global(.opportunity-strip-kicker),
:global(html.light) .root :global(.opportunity-strip-copy p),
:global(html.light) .root :global(.opportunity-tape-pill span),
:global(html.light) .root :global(.opportunity-hero-kicker),
:global(html.light) .root :global(.opportunity-hero-date),
:global(html.light) .root :global(.opportunity-hero-copy p),
:global(html.light) .root :global(.opportunity-hero-metric span),
:global(html.light) .root :global(.opportunity-hero-edgeblock span),
:global(html.light) .root :global(.opportunity-hero-edgeblock em),
:global(html.light) .root :global(.opportunity-hero-footer),
:global(html.light) .root :global(.opportunity-side-tile-head span),
:global(html.light) .root :global(.opportunity-side-stat span),
:global(html.light) .root :global(.opportunity-mini-copy p),
:global(html.light) .root :global(.city-group-title),
:global(html.light) .root :global(.home-panel-kicker),
:global(html.light) .root :global(.home-panel-airport) {
  color: rgba(66, 84, 108, 0.86);
}

:global(html.light) .root :global(.header) {
  background: rgba(248, 252, 255, 0.9);
  border-bottom-color: rgba(36, 68, 104, 0.14);
  box-shadow: 0 12px 34px rgba(31, 64, 104, 0.08);
}

:global(html.light) .root :global(.brand-mark) {
  background: rgba(255, 255, 255, 0.82);
  border-color: rgba(14, 165, 233, 0.24);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.72),
    0 10px 24px rgba(31, 64, 104, 0.12);
}

:global(html.light) .root :global(.locale-switch) {
  background: rgba(255, 255, 255, 0.82);
  border-color: rgba(36, 68, 104, 0.16);
  color: rgba(66, 84, 108, 0.78);
}

:global(html.light) .root :global(.locale-switch span.active) {
  color: #075985;
  background: rgba(14, 165, 233, 0.14);
  box-shadow: inset 0 0 0 1px rgba(14, 165, 233, 0.22);
}

:global(html.light) .root :global(.city-list),
:global(html.light) .root :global(.home-intelligence-panel),
:global(html.light) .root :global(.home-opportunity-strip) {
  background:
    radial-gradient(
      circle at 12% 0%,
      rgba(14, 165, 233, 0.08),
      transparent 34%
    ),
    rgba(248, 252, 255, 0.9);
  border-color: rgba(36, 68, 104, 0.16);
  box-shadow: 0 28px 70px rgba(31, 64, 104, 0.14);
  color: #0b1726;
}

:global(html.light) .root :global(.home-summary-card),
:global(html.light) .root :global(.opportunity-hero-card),
:global(html.light) .root :global(.opportunity-side-tile),
:global(html.light) .root :global(.opportunity-mini-card),
:global(html.light) .root :global(.opportunity-tape-pill),
:global(html.light) .root :global(.opportunity-hero-metric),
:global(html.light) .root :global(.opportunity-book-side),
:global(html.light) .root :global(.opportunity-hero-sparkline-wrap),
:global(html.light) .root :global(.home-deb-card),
:global(html.light) .root :global(.home-card-section),
:global(html.light) .root :global(.home-metric-card),
:global(html.light) .root :global(.home-forecast-item),
:global(html.light) .root :global(.home-intraday-reports span) {
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(14, 165, 233, 0.08),
      transparent 36%
    ),
    rgba(255, 255, 255, 0.92);
  border-color: rgba(36, 68, 104, 0.14);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
  color: #0b1726;
}

:global(html.light) .root :global(.home-weather-hero) {
  background: linear-gradient(
    135deg,
    rgba(238, 246, 255, 0.98),
    rgba(216, 233, 248, 0.92)
  );
  border-color: rgba(36, 68, 104, 0.14);
}

:global(html.light) .root :global(.home-card-section.intraday),
:global(html.light) .root :global(.home-card-section.probability) {
  background:
    radial-gradient(circle at 0% 25%, rgba(14, 165, 233, 0.1), transparent 42%),
    rgba(255, 255, 255, 0.92);
}

:global(html.light) .root :global(.home-intraday-chart line) {
  stroke: rgba(66, 84, 108, 0.16);
}

:global(html.light) .root :global(.home-intraday-reports strong),
:global(html.light) .root :global(.home-probability-threshold),
:global(html.light) .root :global(.home-market-question strong),
:global(html.light) .root :global(.home-market-metrics strong),
:global(html.light) .root :global(.home-forecast-item strong) {
  color: #0b1726;
}

:global(html.light) .root :global(.home-probability-row div),
:global(html.light) .root :global(.home-probability-track) {
  background: rgba(37, 57, 82, 0.12);
}

:global(html.light) .root :global(.city-group) {
  background: rgba(255, 255, 255, 0.54);
  border-color: rgba(36, 68, 104, 0.12);
}

:global(html.light) .root :global(.city-group-header:hover),
:global(html.light) .root :global(.city-item:hover) {
  background: rgba(221, 235, 250, 0.86);
}

:global(html.light) .root :global(.city-item.active) {
  background:
    linear-gradient(90deg, rgba(14, 165, 233, 0.18), rgba(14, 165, 233, 0.06)),
    rgba(255, 255, 255, 0.88);
  border-color: rgba(14, 165, 233, 0.42);
}

:global(html.light) .root :global(.leaflet-control-attribution),
:global(html.light) .root :global(.leaflet-control-zoom a) {
  background: rgba(248, 252, 255, 0.86) !important;
  border-color: rgba(36, 68, 104, 0.16) !important;
  color: #0b1726 !important;
}

@keyframes home-panel-enter {
  from {
    opacity: 0;
    transform: translate3d(24px, 0, 0) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@keyframes opportunity-strip-enter {
  from {
    opacity: 0;
    transform: translate3d(0, 22px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes home-signal-wave {
  0%,
  100% {
    transform: scaleY(0.72);
    opacity: 0.68;
  }
  50% {
    transform: scaleY(1);
    opacity: 1;
  }
}

@media (max-width: 1360px) {
  .root :global(.map) {
    right: 18px;
  }

  .root :global(.home-intelligence-panel) {
    display: none;
  }

  .root :global(.home-opportunity-strip) {
    right: 18px;
  }
}

@media (max-width: 1280px) {
  .root :global(.opportunity-strip-topline) {
    flex-direction: column;
  }

  .root :global(.opportunity-strip-tape) {
    max-width: none;
    justify-content: flex-start;
  }

  .root :global(.opportunity-hero-metrics) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .root :global(.opportunity-hero-book) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .root :global(.opportunity-hero-sparkline-wrap) {
    grid-column: 1 / -1;
  }

  .root :global(.opportunity-mini-grid) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1024px) {
  .root :global(.map) {
    left: 18px;
    bottom: 188px;
  }

  .root :global(.home-opportunity-strip) {
    left: 18px;
  }

  .root :global(.opportunity-strip-main) {
    grid-template-columns: 1fr;
  }

  .root :global(.opportunity-side-grid) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 768px) {
  .root :global(.map) {
    inset: var(--header-height) 0 0;
    border-radius: 0;
    border-left: 0;
    border-right: 0;
  }

  .root :global(.home-opportunity-strip) {
    display: none;
  }
}