:root {
  color-scheme: dark;
  font-family: Inter, system-ui, -apple-system, sans-serif;
  --bg: #0c1320;
  --surface: #0f1d34;
  --surface-alt: #111f38;
  --surface-soft: #10213a;
  --surface-hover: #1d365b;
  --text: #e6edf7;
  --muted: #a8bddf;
  --muted-2: #9fb5d8;
  --border: #223251;
  --border-strong: #2e4f81;
  --card-border: #28426b;
  --table-border: #253a5f;
  --accent-bg: #173052;
  --warn-bg: #2a1a13;
  --warn-border: #5a2f1d;
  --warn-text: #ffd5bf;
  --chart-bg: #0f203e;
  --chart-border: #24426f;
  --focus-ring: #56b6ff;
}

:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f3f6fb;
  --surface: #ffffff;
  --surface-alt: #f8fbff;
  --surface-soft: #f1f6ff;
  --surface-hover: #e6eefc;
  --text: #11233d;
  --muted: #3f5878;
  --muted-2: #516a8a;
  --border: #cad6e8;
  --border-strong: #8aa7cf;
  --card-border: #bcd0e8;
  --table-border: #d4deec;
  --accent-bg: #dce9ff;
  --warn-bg: #fff3e5;
  --warn-border: #e4c08f;
  --warn-text: #7a4d14;
  --chart-bg: #f5f8ff;
  --chart-border: #d6e2f5;
  --focus-ring: #2f67c6;
}

/* Trading academy / cockpit design tokens */
:root {
  --glass-bg: rgba(15, 29, 52, 0.75);
  --glass-border: rgba(34, 50, 81, 0.6);
  --glass-blur: 12px;
  --signal-buy: #22c55e;
  --signal-sell: #ef4444;
  --signal-caution: #f59e0b;
  --panel-glow: rgba(86, 182, 255, 0.08);
  --intel-card-bg: rgba(17, 31, 56, 0.9);
}
:root[data-theme="light"] {
  --glass-bg: rgba(255, 255, 255, 0.85);
  --glass-border: rgba(188, 208, 232, 0.8);
  --intel-card-bg: rgba(248, 251, 255, 0.95);
}

body {
  margin: 0;
  background: var(--custom-bg, var(--bg));
  color: var(--text);
  overflow-x: hidden;
}

.skip-link {
  position: absolute;
  left: 8px;
  top: -40px;
  background: var(--accent-bg);
  color: var(--text);
  padding: 8px 10px;
  border-radius: 8px;
  z-index: 1200;
}

.skip-link:focus {
  top: 8px;
}

.app-shell {
  min-height: 100vh;
}

.topbar {
  padding: 10px 16px;
  border-bottom: 1px solid var(--border);
  background: var(--surface);
}

.topbar-main {
  display: flex;
  align-items: center;
  gap: 12px;
}

.topbar-brand {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
}

.topbar-logo {
  display: block;
  width: 48px;
  height: 48px;
  flex-shrink: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='16' y1='4' x2='16' y2='28' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23f5d042'/%3E%3Cstop offset='1' stop-color='%23e8a723'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M16 2v4M16 26v4M2 16h4M26 16h4' stroke='%239cdb74' stroke-width='2.2' stroke-linecap='round'/%3E%3Cpath d='M6.93 6.93l2.83 2.83M22.14 22.14l2.83 2.83M6.93 25.07l2.83-2.83M22.14 9.86l2.83-2.83' stroke='%23e8a723' stroke-width='2.2' stroke-linecap='round'/%3E%3Cpath d='M16 7v2.5M16 22.5v2.5M7 16h2.5M22.5 16h2.5M9.86 9.86l1.77 1.77M20.36 20.36l1.77 1.77M9.86 22.14l1.77-1.77M20.36 11.64l1.77-1.77' stroke='%2356b6ff' stroke-width='1.8' stroke-linecap='round'/%3E%3Ccircle cx='16' cy='16' r='5' fill='url(%23g)'/%3E%3Ccircle cx='16' cy='16' r='3' fill='%23fff' opacity='.35'/%3E%3C/svg%3E") center/contain no-repeat;
}

.topbar h1 {
  margin: 0;
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  background: linear-gradient(90deg, #56b6ff, #9cdb74);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.topbar-helm-link {
  margin-left: 12px;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--accent, #56b6ff);
  text-decoration: none;
  cursor: pointer;
  background: none;
  padding: 4px 10px;
  border-radius: 6px;
  border: 1px solid var(--border-strong, #334155);
  transition: background 0.2s, color 0.2s;
}

.topbar-helm-link:hover {
  background: var(--surface-hover, rgba(86, 182, 255, 0.1));
  color: var(--accent-bright, #79c0ff);
}

.profile-wrapper {
  position: relative;
  margin-left: auto;
  flex-shrink: 0;
}

.profile-button {
  display: flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  background: var(--surface-soft);
  color: var(--text);
  padding: 6px 12px;
  cursor: pointer;
  font-size: 0.875rem;
}

.profile-button:hover {
  background: var(--surface-hover);
}

.profile-chevron {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-right: 2px solid var(--muted);
  border-bottom: 2px solid var(--muted);
  transform: rotate(45deg);
  margin-top: -3px;
  transition: transform 0.2s;
}

.profile-button[aria-expanded="true"] .profile-chevron {
  transform: rotate(-135deg);
  margin-top: 3px;
}

.profile-icon {
  display: block;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e6edf7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='3'/%3E%3Cpath d='M4 20v-2a4 4 0 0 1 4-4h8a4 4 0 0 1 4 4v2'/%3E%3C/svg%3E") center/contain no-repeat;
}

:root[data-theme="light"] .profile-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2311233d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='3'/%3E%3Cpath d='M4 20v-2a4 4 0 0 1 4-4h8a4 4 0 0 1 4 4v2'/%3E%3C/svg%3E");
}

.profile-label {
  max-width: 120px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.profile-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 220px;
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-radius: 10px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
  z-index: 1100;
}

.profile-dropdown[hidden] {
  display: none;
}

@media (max-width: 480px) {
  .profile-label {
    display: none;
  }
}

.topbar button {
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  background: var(--surface-soft);
  color: var(--text);
  padding: 8px 10px;
}

.hamburger-button {
  display: none;
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  background: var(--surface-soft);
  color: var(--text);
  padding: 8px 10px;
  width: 36px;
  height: 36px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  cursor: pointer;
}

.hamburger-icon {
  display: block;
  width: 16px;
  height: 2px;
  background: var(--text);
  position: relative;
}

.hamburger-icon::before,
.hamburger-icon::after {
  content: "";
  display: block;
  width: 16px;
  height: 2px;
  background: var(--text);
  position: absolute;
  left: 0;
}

.hamburger-icon::before {
  top: -5px;
}

.hamburger-icon::after {
  top: 5px;
}

.service-alerts {
  display: none;
  padding: 10px 16px;
  border-bottom: 1px solid var(--warn-border);
  background: var(--warn-bg);
  color: var(--warn-text);
  font-size: 0.9rem;
}

.service-alerts.show {
  display: block;
}

.compact-label {
  display: flex;
  flex-direction: column;
  font-size: 0.75rem;
  color: var(--muted-2);
}

.topbar-bg-control {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 4px;
}
.topbar-bg-control input[type="color"] {
  width: 2rem;
  height: 1.75rem;
  padding: 2px;
  border: 1px solid var(--border-strong);
  border-radius: 6px;
  cursor: pointer;
  background: var(--surface);
  flex-shrink: 0;
}
.topbar-bg-control .btn {
  padding: 4px 8px;
  font-size: 0.7rem;
}

.compact-label input,
.compact-label select,
.compact-label textarea {
  margin-top: 4px;
  min-width: 0;
  width: 100%;
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  background: var(--surface-soft);
  color: var(--text);
  padding: 7px;
}

.compact-label textarea {
  resize: vertical;
  min-height: 64px;
}

.layout {
  display: grid;
  grid-template-columns: 192px 1fr;
  min-height: calc(100vh - 70px);
  min-width: 0;
}

.module-nav {
  border-right: 1px solid var(--border);
  padding: 12px;
  min-width: 0;
  transition: max-height 0.2s ease, opacity 0.2s ease, padding 0.2s ease;
}

.module-nav button {
  width: 100%;
  text-align: left;
  margin-bottom: 8px;
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 8px;
  padding: 10px;
}

.module-nav button.active {
  background: var(--surface-hover);
  border-color: var(--border-strong);
}

.nav-group {
  margin-bottom: 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  padding: 4px 6px;
}

.nav-group-title {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted-2);
  margin: 4px 0 8px;
  cursor: pointer;
  list-style: none;
}

.nav-group-title::-webkit-details-marker {
  display: none;
}

.nav-group-title::before {
  content: "▾";
  margin-right: 6px;
}

.nav-group:not([open]) .nav-group-title::before {
  content: "▸";
}

.nav-group:not([open]) button[data-module-id] {
  display: none;
}

.nav-debug {
  margin-top: 12px;
  border-top: 1px solid var(--border);
  padding-top: 8px;
  font-size: 0.78rem;
  color: var(--muted-2);
}

.nav-debug ul {
  padding-left: 18px;
}

.module-content {
  padding: 16px;
  min-width: 0;
  overflow-x: hidden;
  box-sizing: border-box;
}

.module-content-body {
  display: block;
  max-width: 100%;
  overflow-x: hidden;
}

.module-content h2,
.module-content h3 {
  letter-spacing: 0.01em;
}

/* Overview: two rows – video on top, journey and rest below */
.overview-layout {
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 1rem;
  margin-bottom: 1rem;
}

.overview-row-video {
  min-width: 0;
}

.overview-row-main {
  min-width: 0;
}

/* Two-column layout on wide screens to reduce scrolling (skip when SaaS app hub per-app view is shown) */
@media (min-width: 1000px) {
  .module-content-body:not(:has(.saas-hub-app-view)) {
    column-count: 2;
    column-gap: 1.75rem;
    column-fill: balance;
  }

  .module-content-body .overview-layout,
  .module-content-body .start-hero {
    column-span: all;
  }

  .module-content-body > * {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  .module-content-body section,
  .module-content-body article,
  .module-content-body .card,
  .module-content-body .hero-card,
  .module-content-body .start-hero,
  .module-content-body .level-section,
  .module-content-body .hierarchy-section,
  .module-content-body .hierarchy-tree,
  .module-content-body .detail-toggle,
  .module-content-body .section-details,
  .module-content-body .research-section,
  .module-content-body .table-wrap,
  .module-content-body details,
  .module-content-body .card-grid,
  .module-content-body .tile-grid,
  .module-content-body .start-actions,
  .module-content-body .project-hero,
  .module-content-body .project-selector,
  .module-content-body .level-cards,
  .module-content-body .view-data-details {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  .module-content-body h2 {
    column-span: all;
    margin-bottom: 0.5rem;
  }

  .module-content-body .nav-flow-hint,
  .module-content-body .kpi-row {
    column-span: all;
  }

  .module-content-body #initiative-feedback,
  .module-content-body .inline-feedback {
    column-span: all;
  }
}

.module-breadcrumbs {
  margin-bottom: 12px;
  color: var(--muted-2);
  font-size: 0.85rem;
}

.nav-flow-hint {
  margin: -0.25rem 0 1rem;
  color: var(--muted-2);
  font-size: 0.9rem;
  line-height: 1.4;
}

.module-avatar-instructor {
  margin-bottom: 14px;
}

.avatar-instructor-card {
  border: 1px solid var(--card-border);
  border-radius: 12px;
  background: var(--surface-alt);
  padding: 12px;
}

.avatar-instructor-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.avatar-instructor-header h3 {
  margin: 0;
  font-size: 0.95rem;
}

.avatar-instructor-route {
  color: var(--muted-2);
  font-size: 0.78rem;
}

.avatar-instructor-actions {
  margin: 8px 0;
}

.avatar-instructor-video {
  width: 100%;
  border-radius: 10px;
  border: 1px solid var(--table-border);
  background: var(--surface-soft);
}

.avatar-instructor-placeholder {
  border: 1px dashed var(--border-strong);
  border-radius: 10px;
  background: var(--surface-soft);
  padding: 10px;
  color: var(--muted);
}

.card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}

.card {
  border: 1px solid var(--card-border);
  border-radius: 10px;
  background: var(--surface-alt);
  padding: 12px;
}

.card .label {
  color: var(--muted-2);
  font-size: 0.8rem;
}

.card .value {
  font-size: 1.3rem;
  margin-top: 6px;
}

/* Start (execution) hero – AI-first CTAs */
.start-hero {
  margin: 1rem 0 1.5rem;
  padding: 1.25rem;
  border-radius: 12px;
  background: var(--surface-alt);
  border: 1px solid var(--card-border);
}

.start-tagline {
  margin: 0 0 1rem;
  color: var(--muted);
  font-size: 0.95rem;
  line-height: 1.45;
}

.start-actions {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 12px;
}

.start-cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 6px;
  flex: 1 1 180px;
  min-width: 140px;
  max-width: 320px;
  padding: 1rem 1.25rem;
  border-radius: 12px;
  border: 1px solid var(--border-strong);
  background: var(--surface-soft);
  color: var(--text);
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}

@media (max-width: 480px) {
  .start-cta {
    min-width: 0;
    flex: 1 1 100%;
    max-width: none;
  }
}

.start-cta:hover {
  background: var(--surface-hover);
  border-color: var(--border-strong);
}

.start-cta:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}

.start-cta-icon {
  font-size: 1.75rem;
  line-height: 1;
}

.start-cta-label {
  font-weight: 600;
  font-size: 0.95rem;
}

.start-cta-hint {
  font-size: 0.75rem;
  color: var(--muted-2);
  line-height: 1.3;
}

.start-cta-primary {
  border-color: #56b6ff;
  background: rgba(22, 96, 189, 0.2);
}

.start-cta-primary:hover {
  background: rgba(22, 96, 189, 0.35);
}

.start-cta-secondary {
  border-style: dashed;
}

/* Ideas / Seeds – project hero and tiles */
.project-selector {
  margin-bottom: 1rem;
}

.project-selector .compact-label {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
}

.selector-icon {
  font-size: 1.25rem;
}

.selector-select {
  min-width: 200px;
}

.project-hero {
  margin-bottom: 1.5rem;
}

.hero-card {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  padding: 1rem 1.25rem;
  border-radius: 12px;
  border: 1px solid var(--card-border);
  background: var(--surface-alt);
}

.hero-icon {
  font-size: 2rem;
  line-height: 1;
  flex-shrink: 0;
}

.hero-body {
  min-width: 0;
}

.hero-title {
  margin: 0 0 0.25rem;
  font-size: 1.2rem;
  font-weight: 600;
}

.hero-meta {
  margin: 0 0 0.5rem;
  font-size: 0.85rem;
  color: var(--muted-2);
}

.hero-status {
  text-transform: capitalize;
}

.hero-desc {
  margin: 0;
  font-size: 0.9rem;
  color: var(--muted);
  line-height: 1.4;
}

.tile-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 1rem;
}

.tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  min-width: 90px;
  padding: 0.75rem 1rem;
  border-radius: 10px;
  border: 1px solid var(--card-border);
  background: var(--surface-soft);
}

.tile-icon {
  font-size: 1.5rem;
  line-height: 1;
}

.tile-value {
  font-size: 1.35rem;
  font-weight: 600;
}

.tile-label {
  font-size: 0.75rem;
  color: var(--muted-2);
}

.tile-clickable {
  cursor: pointer;
  border: none;
  font: inherit;
  color: inherit;
  background: var(--surface-soft);
  transition: background 0.15s ease, transform 0.1s ease;
}

.tile-clickable:hover {
  background: var(--surface-hover);
}

.tile-clickable:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}

.tile-clickable:active {
  transform: scale(0.98);
}

/* KPI summary row – always visible */
.kpi-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem 1.5rem;
  padding: 0.75rem 1rem;
  margin: 1rem 0;
  border-radius: 10px;
  background: var(--surface-alt);
  border: 1px solid var(--card-border);
}

.kpi-item {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  font-size: 0.9rem;
}

.kpi-value {
  font-weight: 700;
  color: var(--text);
}

.kpi-label {
  font-size: 0.8rem;
  color: var(--muted-2);
}

.kpi-row .kpi-expert-btn {
  margin-left: auto;
}

/* Seed summary header row (Idea Garden) – title + stats with icons + expert button */
.seed-summary-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem 1.5rem;
  padding: 0.75rem 1rem;
  margin: 1rem 0;
  border-radius: 10px;
  background: var(--surface-alt);
  border: 1px solid var(--card-border);
}

.seed-summary-title {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--text);
}

.seed-summary-icon {
  font-size: 1.1rem;
}

.seed-summary-stat {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.9rem;
}

.seed-summary-stat-icon {
  font-size: 1rem;
  opacity: 0.9;
}

.seed-summary-header .kpi-value,
.seed-summary-header .kpi-label {
  font-size: inherit;
}

.seed-summary-header .seed-summary-expert-btn {
  margin-left: auto;
}

/* Idea Garden two-column layout below header */
.idea-garden-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
  margin-top: 0.5rem;
}

@media (max-width: 900px) {
  .idea-garden-columns {
    grid-template-columns: 1fr;
  }
}

.idea-garden-col {
  min-width: 0;
}

/* Collapsible sections – only summary visible by default */
.collapsible-section {
  margin: 0.5rem 0;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-soft);
}

.collapsible-section-summary {
  list-style: none;
  cursor: pointer;
  padding: 0.6rem 1rem;
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--text);
  user-select: none;
}

.collapsible-section-summary::-webkit-details-marker,
.collapsible-section-summary::marker {
  display: none;
}

.collapsible-section-summary::before {
  content: "▸ ";
  display: inline-block;
  margin-right: 6px;
  color: var(--muted-2);
  transition: transform 0.15s ease;
}

.collapsible-section[open] .collapsible-section-summary::before {
  content: "▾ ";
}

.collapsible-section[open] .collapsible-section-summary {
  border-bottom: 1px solid var(--border);
}

.collapsible-section > *:not(summary) {
  padding: 1rem;
}

.collapsible-section-icon {
  margin-right: 4px;
}

/* Hierarchy tree: seed → initiatives → goals → tasks (collapsible) */
.hierarchy-section {
  margin-top: 1.5rem;
  padding: 1rem 0;
  border-top: 1px solid var(--border);
}

.hierarchy-details {
  margin-top: 0.5rem;
}

.hierarchy-details-summary {
  list-style: none;
  font-size: 1rem;
  font-weight: 600;
  color: var(--text);
  cursor: pointer;
  padding: 6px 0;
  user-select: none;
}

.hierarchy-details-summary::-webkit-details-marker,
.hierarchy-details-summary::marker {
  display: none;
}

.hierarchy-details-summary::before {
  content: "▾";
  display: inline-block;
  margin-right: 6px;
  transition: transform 0.15s ease;
}

.hierarchy-details:not([open]) .hierarchy-details-summary::before {
  transform: rotate(-90deg);
}

.hierarchy-heading {
  margin: 0 0 0.75rem;
  font-size: 1rem;
  font-weight: 600;
  color: var(--text);
}

.hierarchy-tree {
  font-size: 0.9rem;
  color: var(--text);
  margin-top: 0.5rem;
}

.hierarchy-tree .tree-root {
  list-style: none;
  padding-left: 0;
  margin: 0.25rem 0;
  border-left: none;
}

.hierarchy-tree .tree-branch-wrap {
  list-style: none;
}

.hierarchy-tree .tree-root > .tree-branch-wrap > .tree-branch {
  list-style: none;
  padding-left: 1.25rem;
  margin: 0.25rem 0;
  border-left: 2px solid var(--border);
}

.hierarchy-tree .tree-branch {
  list-style: none;
  padding-left: 1.25rem;
  margin: 0.15rem 0;
  border-left: 2px solid var(--border);
}

.hierarchy-tree .tree-initiative-wrap,
.hierarchy-tree .tree-goal-wrap {
  list-style: none;
  margin: 2px 0;
}

.hierarchy-tree .tree-node-details {
  margin: 2px 0;
}

.hierarchy-tree .tree-node-details > summary.tree-node {
  list-style: none;
  cursor: pointer;
}

.tree-node-details summary::-webkit-details-marker,
.tree-node-details summary::marker {
  display: none;
}

.hierarchy-tree .tree-toggle {
  display: inline-block;
  width: 1em;
  margin-right: 2px;
  text-align: center;
  transition: transform 0.15s ease;
  color: var(--muted-2);
}

.tree-node-details[open] .tree-toggle::before {
  content: "▾";
}

.tree-node-details:not([open]) .tree-toggle::before {
  content: "▸";
}

.hierarchy-tree .tree-node {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 0 4px 4px;
  margin: 2px 0;
  position: relative;
}

.hierarchy-tree .tree-node::before {
  content: "";
  position: absolute;
  left: -1.25rem;
  top: 50%;
  width: 0.75rem;
  height: 2px;
  background: var(--border);
}

.hierarchy-tree .tree-root > .tree-node::before {
  display: none;
}

.hierarchy-tree .tree-node-seed.tree-node::before {
  display: none;
}

.hierarchy-tree .tree-icon {
  font-size: 1.1rem;
  line-height: 1;
  flex-shrink: 0;
}

.hierarchy-tree .tree-node-seed .tree-icon {
  font-size: 1.35rem;
}

.hierarchy-tree .tree-label {
  flex: 1;
  min-width: 0;
}

.hierarchy-tree .tree-tasks {
  margin-top: 2px;
}

/* Level sections (Initiatives / Goals / Tasks in this seed) */
.level-section {
  margin-top: 1.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--border);
}

.level-section-heading {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 0.35rem;
  font-size: 1.05rem;
  font-weight: 600;
}

.level-section-icon {
  font-size: 1.2rem;
}

.level-section-hint {
  margin: 0 0 0.75rem;
  font-size: 0.8rem;
  color: var(--muted-2);
  line-height: 1.35;
}

.level-cards {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.level-cards-row {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
}

.level-card {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid var(--card-border);
  background: var(--surface-alt);
}

.level-card-icon {
  font-size: 1.35rem;
  line-height: 1;
  flex-shrink: 0;
}

.level-card-body {
  min-width: 0;
}

.level-card-title {
  margin: 0 0 4px;
  font-size: 0.95rem;
  font-weight: 600;
}

.level-card-meta {
  margin: 0;
  font-size: 0.8rem;
  color: var(--muted-2);
  line-height: 1.35;
}

.level-card-parent {
  font-style: italic;
  color: var(--muted);
}

.view-data-details {
  margin-top: 0.75rem;
  border-top: 1px dashed var(--border);
  padding-top: 0.5rem;
}

.view-data-summary {
  list-style: none;
  cursor: pointer;
  font-size: 0.85rem;
  color: var(--muted-2);
  padding: 4px 0;
  user-select: none;
}

.view-data-summary::-webkit-details-marker,
.view-data-summary::marker {
  display: none;
}

.view-data-summary::before {
  content: "▸ ";
  display: inline-block;
  margin-right: 4px;
  color: var(--muted);
}

.view-data-details[open] .view-data-summary::before {
  content: "▾ ";
}

.view-data-details .table-wrap {
  margin-top: 0.5rem;
}

.research-section {
  margin-top: 0.5rem;
}

.research-section h4 {
  margin: 1rem 0 0.5rem;
  font-size: 0.95rem;
  color: var(--muted-2);
}

.research-section h4:first-child {
  margin-top: 0;
}

.health-meter {
  margin-top: 8px;
  width: 100%;
  height: 10px;
  border-radius: 999px;
  background: var(--surface-soft);
  border: 1px solid var(--card-border);
  overflow: hidden;
}

.health-meter-fill {
  height: 100%;
  background: linear-gradient(90deg, #56b6ff 0%, #9cdb74 65%, #ffb86b 100%);
}

.table-wrap {
  margin-top: 12px;
  overflow-x: auto;
}

table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
}

th,
td {
  border-bottom: 1px solid var(--table-border);
  padding: 8px;
  text-align: left;
}

td button {
  margin-right: 4px;
  margin-bottom: 4px;
  border: 1px solid var(--border-strong);
  border-radius: 6px;
  background: var(--surface-soft);
  color: var(--text);
  padding: 4px 8px;
  font-size: 0.78rem;
}

.view-toggle {
  display: inline-flex;
  gap: 6px;
  margin-top: 10px;
  margin-bottom: 6px;
}

.view-toggle button {
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  background: var(--surface-soft);
  color: var(--text);
  padding: 4px 10px;
  font-size: 0.8rem;
}

.view-toggle button.active {
  background: var(--surface-hover);
}

.is-hidden {
  display: none !important;
}

.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1000;
  background: rgba(7, 15, 28, 0.7);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}

.modal-dialog {
  width: min(860px, 100%);
  max-height: 90vh;
  overflow-y: auto;
  border: 1px solid var(--card-border);
  border-radius: 12px;
  background: var(--surface);
  color: var(--text);
}

.modal-header,
.modal-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 14px;
  border-bottom: 1px solid var(--border);
}

.modal-footer {
  border-bottom: 0;
  border-top: 1px solid var(--border);
}

.modal-header button,
.modal-footer button {
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  background: var(--surface-soft);
  color: var(--text);
  padding: 6px 10px;
}

.wizard-progress {
  display: grid;
  gap: 6px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--border);
}

.wizard-step {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.85rem;
  color: var(--muted-2);
}

.wizard-step span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 999px;
  border: 1px solid var(--border-strong);
  background: var(--surface-soft);
}

.wizard-step.active {
  color: var(--text);
  font-weight: 600;
}

.wizard-step.done span {
  background: #214a2f;
  border-color: #3a7e52;
}

.wizard-body {
  padding: 14px;
}

.inline-feedback {
  display: none;
  margin: 10px 14px 0;
  padding: 8px 10px;
  border: 1px solid var(--warn-border);
  border-radius: 8px;
  background: var(--warn-bg);
  color: var(--warn-text);
  font-size: 0.85rem;
}

.inline-feedback.show {
  display: block;
}

.preset-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-bottom: 8px;
  color: var(--muted-2);
  font-size: 0.8rem;
}

.preset-button {
  border: 1px solid var(--border-strong);
  border-radius: 999px;
  background: var(--surface-soft);
  color: var(--text);
  padding: 4px 10px;
  font-size: 0.75rem;
}

.help-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 1px solid var(--border-strong);
  background: var(--accent-bg);
  color: var(--text);
  font-size: 0.8rem;
  font-weight: 700;
  margin-left: 4px;
  cursor: help;
  box-shadow: 0 0 0 1px rgba(127, 183, 255, 0.25);
}

.stat-link {
  margin-top: 6px;
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  background: var(--surface-soft);
  color: var(--text);
  padding: 4px 10px;
  font-size: 1.2rem;
  cursor: pointer;
}

.link-button {
  border: 1px solid var(--border-strong);
  border-radius: 6px;
  background: var(--surface-soft);
  color: var(--text);
  padding: 3px 8px;
  font-size: 0.75rem;
  margin-right: 4px;
}

.muted-note {
  color: var(--muted-2);
  font-size: 0.8rem;
}

.prompt-details summary {
  cursor: pointer;
  color: var(--muted);
  font-size: 0.82rem;
}

.prompt-content {
  margin: 8px 0 0;
  padding: 8px;
  border: 1px solid var(--table-border);
  border-radius: 8px;
  background: var(--surface-soft);
  color: var(--text);
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 0.78rem;
  max-height: 220px;
  overflow: auto;
}

.line-chart {
  display: block;
}

.clickable-row,
.clickable-card {
  cursor: pointer;
}

.clickable-row:hover {
  background: var(--surface-soft);
}

.clickable-card:hover {
  border-color: var(--border-strong);
}

.record-inspector-dialog {
  width: min(980px, 100%);
}

.record-inspector-actions {
  display: flex;
  gap: 8px;
}

/* ── AquaSafe Workflow Report modal ── */
.aquasafe-report-modal .aquasafe-report-dialog {
  width: min(920px, 100%);
  max-height: 90vh;
  overflow-y: auto;
}
.aquasafe-report-body {
  padding: 1rem 1.5rem;
  overflow-y: auto;
  max-height: calc(90vh - 60px);
}
.aquasafe-report-section {
  margin-bottom: 1.5rem;
}
.aquasafe-report-section h2 {
  margin: 0 0 0.75rem;
  font-size: 1.1rem;
  border-bottom: 1px solid var(--border);
  padding-bottom: 0.25rem;
}
.aquasafe-report-section h3 {
  margin: 1rem 0 0.5rem;
  font-size: 0.95rem;
}
.aquasafe-report-section p,
.aquasafe-report-section ul {
  margin: 0.5rem 0;
  line-height: 1.5;
}
.aquasafe-report-section ul {
  padding-left: 1.5rem;
}
.aquasafe-report-table {
  width: 100%;
  border-collapse: collapse;
  margin: 0.5rem 0;
  font-size: 0.9rem;
}
.aquasafe-report-table th,
.aquasafe-report-table td {
  border: 1px solid var(--border);
  padding: 0.4rem 0.6rem;
  text-align: left;
}
.aquasafe-report-table th {
  background: var(--surface-alt, rgba(255, 255, 255, 0.05));
}
.aquasafe-report-diagram {
  margin: 1rem 0;
  padding: 1rem;
  background: var(--surface-alt, rgba(255, 255, 255, 0.03));
  border-radius: 8px;
  font-size: 0.85rem;
}
.flow-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0.5rem 0;
}
.flow-node {
  padding: 0.25rem 0.5rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 4px;
}
.flow-arrow {
  color: var(--muted, #888);
}
.saas-app-group-links .btn-link,
.saas-workflow-report-btn {
  display: inline;
  background: none;
  border: none;
  padding: 0;
  color: var(--focus-ring, #58a6ff);
  cursor: pointer;
  font-size: inherit;
  text-decoration: none;
}
.saas-app-group-links .btn-link:hover,
.saas-workflow-report-btn:hover {
  text-decoration: underline;
}
.saas-app-group-links a + .saas-workflow-report-btn::before,
.saas-app-group-links .saas-workflow-report-btn + a::before {
  content: " · ";
  color: var(--muted, #888);
}

@media print {
  .aquasafe-report-body {
    max-height: none;
  }
}

.record-section + .record-section {
  margin-top: 12px;
}

.record-section h4 {
  margin: 0 0 8px;
}

.record-side-panel {
  position: fixed;
  top: 0;
  right: 0;
  width: min(42vw, 560px);
  height: 100vh;
  z-index: 1100;
  border-left: 1px solid var(--border);
  background: var(--surface);
  overflow-y: auto;
  box-shadow: -12px 0 24px rgba(0, 0, 0, 0.25);
}

@media (max-width: 900px) {
  .record-side-panel {
    width: min(92vw, 560px);
  }
}

button:focus-visible,
input:focus-visible,
select:focus-visible,
summary:focus-visible,
.stat-link:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}

/* ── Nav backdrop (mobile drawer overlay) ── */

.nav-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 999;
  background: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(2px);
}

.app-shell.nav-open .nav-backdrop {
  display: block;
}

@media (max-width: 800px) {
  .hamburger-button {
    display: inline-flex;
  }

  .layout {
    grid-template-columns: 1fr;
  }

  .module-nav {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: 280px;
    z-index: 1000;
    transform: translateX(-100%);
    transition: transform 0.25s ease;
    background: var(--surface);
    border-right: 1px solid var(--border);
    overflow-y: auto;
    padding: 16px 12px;
  }

  .app-shell.nav-open .module-nav {
    transform: translateX(0);
  }

  .module-nav button {
    padding: 8px;
    margin-bottom: 6px;
  }

  .nav-group {
    margin-bottom: 8px;
  }

  .module-content {
    padding: 12px;
  }

  .card-grid {
    grid-template-columns: 1fr;
  }

  table {
    font-size: 0.82rem;
  }

  th,
  td {
    padding: 6px;
  }
}

/* ── Per-section detail toggles ── */

.detail-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface-soft);
  color: var(--muted);
  padding: 4px 12px;
  font-size: 0.78rem;
  cursor: pointer;
  margin: 10px 0 4px;
}

.detail-toggle:hover {
  color: var(--text);
  border-color: var(--border-strong);
}

.detail-toggle-icon {
  font-size: 0.7rem;
}

.section-details.collapsed {
  display: none !important;
}

/* ── Video Hero ── */

.video-hero {
  border: 1px solid var(--card-border);
  border-radius: 12px;
  background: var(--surface-alt);
  margin-bottom: 16px;
  overflow: hidden;
}

.video-hero-toggle {
  cursor: pointer;
  padding: 12px 16px;
  font-size: 0.9rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--text);
  list-style: none;
}

.video-hero-toggle::-webkit-details-marker {
  display: none;
}

.video-hero-toggle::before {
  content: "\25BE ";
  color: var(--muted);
}

.video-hero:not([open]) .video-hero-toggle::before {
  content: "\25B8 ";
}

.video-hero-body {
  padding: 0 16px 16px;
}

.video-hero-body video {
  width: 100%;
  max-height: 480px;
  border-radius: 10px;
  border: 1px solid var(--table-border);
  background: #000;
}

.video-hero-hint {
  margin: 8px 0 0;
  font-size: 0.78rem;
  color: var(--muted-2);
}

.investment-updates-section {
  margin: 1rem 0;
  padding: 1rem;
  border: 1px solid var(--card-border);
  border-radius: 12px;
  background: var(--surface-alt);
}
.investment-updates-section h3 { margin: 0 0 0.5rem; }
.re-inv-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 6px; flex-wrap: wrap; }
.re-inv-header .muted-note { margin: 0; }

/* Top row: Investment Updates | Market Pulse side by side */
.re-overview-top-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.25rem;
  margin-bottom: 1.25rem;
  align-items: start;
}
@media (max-width: 768px) {
  .re-overview-top-row {
    grid-template-columns: 1fr;
  }
}
.re-overview-top-col {
  min-width: 0;
}
.re-overview-top-col .investment-updates-section,
.re-overview-top-col .market-pulse-section {
  margin: 0;
}
.market-pulse-section h3 { margin: 0 0 0.5rem; }
.re-market-cards .re-datacard { cursor: default; }
.market-datacard.re-market-accent { border-left-color: #2f67c6; }
.re-datacard-value { font-weight: 600; color: var(--text); }
.re-market-cards .re-datacard-type {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.re-overview-portfolio { margin-top: 0.5rem; }

/* Widget dashboard */
.re-overview-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1rem;
}
.re-overview-header h3 { margin: 0; }
.re-overview-actions {
  display: flex;
  gap: 0.5rem;
  align-items: center;
}
.re-widget-tab-container { margin-top: 0.5rem; }

.re-widget-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 1rem;
  align-items: start;
}
.re-widget {
  min-width: 0;
  border: 1px solid var(--card-border);
  border-radius: 12px;
  background: var(--surface);
  overflow: hidden;
}
.re-widget[data-size="third"] { grid-column: span 2; }
.re-widget[data-size="half"] { grid-column: span 3; }
.re-widget[data-size="full"] { grid-column: span 6; }
.re-widget-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.5rem 0.75rem;
  background: var(--surface-alt);
  border-bottom: 1px solid var(--border);
  font-size: 0.9rem;
  font-weight: 600;
}
.re-widget-title { margin: 0; }
.re-widget-collapse {
  border: none;
  background: transparent;
  cursor: pointer;
  font-size: 1.1rem;
  line-height: 1;
  padding: 0 4px;
  color: var(--muted);
}
.re-widget-collapse:hover { color: var(--text); }
.re-widget-body {
  padding: 0.75rem 1rem;
  overflow: hidden;
  min-width: 0;
}
.re-widget.re-widget-collapsed .re-widget-body { display: none; }
.re-widget-show-all {
  margin-top: 0.5rem;
  padding: 0.35rem 0.75rem;
  font-size: 0.85rem;
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  background: var(--surface-soft);
  color: var(--text);
  cursor: pointer;
}
.re-widget-show-all:hover { background: var(--surface); }

@media (max-width: 768px) {
  .re-widget-grid {
    grid-template-columns: 1fr;
  }
  .re-widget[data-size="third"],
  .re-widget[data-size="half"],
  .re-widget[data-size="full"] {
    grid-column: span 1;
  }
}

/* Customize modal */
.re-customize-modal .modal-dialog { max-width: 520px; }
.re-customize-body { padding: 1rem; max-height: 60vh; overflow-y: auto; }
.re-customize-tab-section {
  margin-bottom: 1.25rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0.75rem 1rem;
}
.re-customize-tab-section legend {
  font-weight: 600;
  padding: 0 0.35rem;
}
.re-customize-widget-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.re-customize-widget-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem 0;
  border-bottom: 1px solid var(--border);
  flex-wrap: wrap;
}
.re-customize-widget-row:last-child { border-bottom: 0; }
.re-customize-order { display: flex; gap: 2px; }
.re-customize-order button {
  padding: 2px 6px;
  font-size: 0.8rem;
  border: 1px solid var(--border-strong);
  border-radius: 4px;
  background: var(--surface-soft);
  cursor: pointer;
}
.re-customize-order button:disabled { opacity: 0.5; cursor: not-allowed; }
.re-customize-label { flex: 1; min-width: 0; font-size: 0.9rem; }
.re-customize-size { min-width: 5rem; padding: 4px 6px; }
.re-customize-visible { font-size: 0.85rem; white-space: nowrap; }
.re-customize-visible input { margin-right: 4px; }

/* News sidebar */
.re-news-sidebar-backdrop {
  position: fixed;
  inset: 0;
  z-index: 999;
  background: rgba(0, 0, 0, 0.4);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s, visibility 0.2s;
}
.re-news-sidebar-backdrop:not(.is-hidden) {
  opacity: 1;
  visibility: visible;
}
.re-news-sidebar {
  position: fixed;
  top: 0;
  right: 0;
  width: min(380px, 90vw);
  height: 100vh;
  z-index: 1000;
  background: var(--surface);
  border-left: 1px solid var(--border);
  box-shadow: -8px 0 24px rgba(0, 0, 0, 0.15);
  display: flex;
  flex-direction: column;
  transition: transform 0.25s ease;
  overflow: hidden;
}
.re-news-sidebar.is-hidden { transform: translateX(100%); }
.re-news-sidebar:not(.is-hidden) { transform: translateX(0); }
.re-news-sidebar-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.re-news-sidebar-header h3 { margin: 0; font-size: 1rem; }
.re-news-sidebar-close {
  border: none;
  background: transparent;
  font-size: 1.4rem;
  line-height: 1;
  padding: 0 4px;
  cursor: pointer;
  color: var(--muted);
}
.re-news-sidebar-close:hover { color: var(--text); }
.re-news-sidebar-body {
  flex: 1;
  overflow-y: auto;
  padding: 1rem;
}
.re-news-sidebar-body section { margin-bottom: 1.25rem; }
.re-news-sidebar-body h4 { margin: 0 0 0.5rem; font-size: 0.95rem; }
.re-tab.re-news-toggle { margin-left: auto; }
@media (max-width: 768px) {
  .re-tabs.re-tabs-main { gap: 0; overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .re-tabs-main .re-tab { padding: 0.5rem 0.65rem; font-size: 0.8rem; white-space: nowrap; flex-shrink: 0; }
  .re-filter-bar { flex-direction: column; align-items: stretch; gap: 0.35rem; }
  .re-filter-label { display: none; }
  .re-hero-subtitle { font-size: 0.82rem; }
  .re-news-sidebar {
    width: 100%;
    max-width: 100%;
  }
}

.re-datacards-row {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin: 0.75rem 0 0;
}
.re-datacard {
  flex: 1 1 280px;
  min-width: 0;
  border-radius: 12px;
  padding: 1rem;
  border: 1px solid var(--card-border);
  background: var(--surface);
  border-left-width: 4px;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}
.re-datacard-type { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted); }
.re-datacard-title { margin: 0; font-size: 1rem; line-height: 1.25; }
.re-datacard-summary { margin: 0; font-size: 0.85rem; color: var(--muted-2); line-height: 1.4; }
.re-datacard-fields { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.25rem 1rem; font-size: 0.85rem; margin-top: 0.25rem; }
.re-datacard-fields .label { color: var(--muted); margin-right: 0.35rem; }
.re-datacard-meta { margin: 0; font-size: 0.85rem; }
.re-datacard-link { font-size: 0.8rem; }
.re-datacard-agent { font-size: 0.72rem; color: var(--muted); margin-top: auto; }

.inv-datacard.inv-card-opportunity { border-left-color: #2d8f5e; }
.inv-datacard.inv-card-market { border-left-color: #2f67c6; }
.inv-datacard.inv-card-research { border-left-color: #7c4dff; }
.inv-datacard.inv-card-re { border-left-color: #e67e22; }
.inv-datacard.inv-card-default { border-left-color: var(--focus-ring); }

.holding-datacard.re-holding-accent-1 { border-left-color: #2d8f5e; }
.holding-datacard.re-holding-accent-2 { border-left-color: #2f67c6; }
.holding-datacard.re-holding-accent-3 { border-left-color: #c05621; }
.holding-datacard.re-holding-accent-4 { border-left-color: #6b46c1; }

/* Compact datacards: smaller squares, wrap to avoid overflow */
.re-datacards-compact.re-datacards-row {
  flex-wrap: wrap;
  gap: 0.75rem;
  margin: 0.5rem 0 0;
  min-width: 0;
  overflow-x: hidden;
}
.re-holdings-cards.re-datacards-compact {
  flex-wrap: wrap;
}
.re-datacard.re-datacard-compact {
  flex: 1 1 120px;
  min-width: 100px;
  max-width: 140px;
  aspect-ratio: 1;
  padding: 0.6rem;
  gap: 0.2rem;
  cursor: pointer;
  justify-content: center;
  text-align: center;
  min-height: 0;
}
.re-datacard.re-datacard-compact .re-datacard-type {
  font-size: 0.6rem;
}
.re-datacard.re-datacard-compact .re-datacard-title {
  font-size: 0.8rem;
  line-height: 1.2;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.re-datacard.re-datacard-compact .re-datacard-one {
  margin: 0;
  font-size: 0.75rem;
  color: var(--muted-2);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.re-widget-pagination {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.5rem;
  flex-wrap: wrap;
}
.re-widget-pagination-label {
  font-size: 0.8rem;
  color: var(--muted);
  margin-right: 0.25rem;
}
.re-widget-pagination-prev,
.re-widget-pagination-next {
  padding: 0.25rem 0.5rem;
  font-size: 0.8rem;
  border: 1px solid var(--border-strong);
  border-radius: 6px;
  background: var(--surface-soft);
  color: var(--text);
  cursor: pointer;
}
.re-widget-pagination-prev:disabled,
.re-widget-pagination-next:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

@media (max-width: 768px) {
  .re-datacards-compact.re-datacards-row {
    gap: 0.35rem;
  }
  .re-datacard.re-datacard-compact {
    flex: 1 1 calc(50% - 0.35rem);
    min-width: 64px;
    max-width: none;
    padding: 0.35rem;
    aspect-ratio: 1;
    min-height: 0;
  }
  .re-datacard.re-datacard-compact .re-datacard-type {
    font-size: 0.5rem;
  }
  .re-datacard.re-datacard-compact .re-datacard-title {
    font-size: 0.62rem;
    -webkit-line-clamp: 2;
  }
  .re-datacard.re-datacard-compact .re-datacard-one {
    font-size: 0.58rem;
  }
}

/* RE detail modal */
.re-detail-modal-backdrop .re-detail-modal {
  max-width: 480px;
}
.re-detail-modal .modal-header {
  padding: 10px 14px;
}
.re-detail-modal-title { margin: 0; font-size: 1rem; }
.re-detail-modal-close {
  font-size: 1.4rem;
  line-height: 1;
  padding: 0 6px;
  border: none;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
}
.re-detail-modal-close:hover { color: var(--text); }
.re-detail-modal-body {
  padding: 14px;
  max-height: 60vh;
  overflow-y: auto;
}
.re-detail-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
}
.re-detail-table .label {
  color: var(--muted);
  padding: 4px 8px 4px 0;
  vertical-align: top;
  width: 38%;
}
.re-detail-table td { padding: 4px 0; border-bottom: 1px solid var(--border); }
.re-detail-table tr:last-child td { border-bottom: 0; }

/* Market Pulse: range selector and "Showing" line */
.re-market-pulse-range-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 16px;
  margin-bottom: 14px;
  padding: 10px 0;
  border-bottom: 1px solid var(--border, #e0e0e0);
}
.re-market-pulse-range-label {
  font-size: 0.9rem;
  color: var(--text, #333);
}
.re-market-range-select {
  font-size: 0.9rem;
  padding: 6px 10px;
  border: 1px solid var(--border, #ccc);
  border-radius: 6px;
  background: var(--surface, #fff);
  color: var(--text, #333);
  cursor: pointer;
  min-width: 4.5em;
}
.re-market-range-select:hover:not(:disabled) { border-color: var(--accent, #0a7ea4); }
.re-market-range-select:disabled { opacity: 0.7; cursor: not-allowed; }
.re-market-pulse-showing {
  font-size: 0.9rem;
  color: var(--muted, #666);
}
.re-market-pulse-showing strong { color: var(--text, #333); }
.re-market-pulse-loading-overlay {
  padding: 10px 0;
  margin-bottom: 8px;
  font-size: 0.9rem;
  color: var(--accent, #0a7ea4);
}
.re-market-chart-wrap .line-chart { display: block; }

/* Market Pulse: 3 per row, larger cards */
.re-market-cards-with-charts.re-market-cards-3col {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
@media (max-width: 900px) {
  .re-market-cards-with-charts.re-market-cards-3col { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .re-market-cards-with-charts.re-market-cards-3col { grid-template-columns: 1fr; }
}
.re-market-cards-with-charts { display: flex; flex-wrap: wrap; gap: 12px; }
.re-market-cards-with-charts.re-market-cards-3col .re-market-chart-card-historical {
  min-width: 0;
  max-width: none;
}
.re-market-chart-card-historical {
  min-width: 200px;
  flex: 1 1 200px;
  max-width: 280px;
}
.re-market-chart-wrap {
  width: 100%;
  min-height: 110px;
  margin: 6px 0;
}
.re-market-chart-wrap .line-chart {
  width: 100%;
  height: 110px;
  display: block;
}
.re-market-single-value {
  min-height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--accent, #0a7ea4);
}
.re-market-sparkline-wrap {
  width: 100%;
  min-height: 28px;
  margin: 4px 0;
}
.re-market-sparkline {
  width: 100%;
  height: 28px;
  display: block;
  color: var(--accent, #0a7ea4);
}
.re-market-chart-card .re-datacard-value { font-weight: 600; }
.re-market-pulse-hint { margin: 8px 0 0; color: var(--muted); }
.re-market-pulse-hint code { font-size: 0.85em; }

/* Market Pulse: expandable modal chart */
.re-market-chart-modal .re-detail-modal { max-width: 520px; }
.re-market-chart-current { margin: 0 0 12px; font-size: 0.95rem; }
.re-market-chart-modal-chart {
  margin: 12px 0;
  padding: 12px;
  background: var(--surface-soft, #f5f5f5);
  border-radius: 8px;
}
.re-market-chart-expanded {
  width: 100%;
  height: auto;
  display: block;
  color: var(--accent, #0a7ea4);
}
.re-sparkline-large { vector-effect: non-scaling-stroke; }
.re-market-chart-history { margin-top: 12px; }

/* Add to Pipeline */
.re-add-pipeline-modal .re-detail-modal { max-width: 520px; }
.re-add-pipeline-form label { display: block; margin: 8px 0; }
.re-add-pipeline-form input[type="text"],
.re-add-pipeline-form input[type="number"],
.re-add-pipeline-form input[type="url"],
.re-add-pipeline-form select,
.re-add-pipeline-form textarea { width: 100%; max-width: 100%; box-sizing: border-box; }
.re-add-pipeline-form .modal-footer { margin-top: 12px; }
.re-datacard .re-add-pipeline-btn {
  position: absolute;
  top: 4px;
  right: 4px;
  font-size: 0.7rem;
  padding: 2px 6px;
  border-radius: 4px;
}
.re-datacard { position: relative; }
.re-datacard-inner { min-height: 2.5em; }
.re-datacard-img-wrap { width: 100%; aspect-ratio: 16/10; overflow: hidden; border-radius: 4px 4px 0 0; background: var(--bg-2); }
.re-datacard-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.re-datacard:has(.re-datacard-img-wrap) .re-datacard-inner { padding-top: 0.5rem; }
.re-detail-modal-img-wrap { margin-bottom: 1rem; max-width: 100%; }
.re-detail-modal-img { max-width: 100%; max-height: 280px; object-fit: contain; border-radius: 6px; display: block; }

/* Pipeline funnel */
.re-pipeline-funnel { margin-top: 8px; }
.re-pipeline-stages-row { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.re-pipeline-stage-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface-soft, #f5f5f5);
  cursor: pointer;
  font-size: 0.85rem;
}
.re-pipeline-stage-pill:hover { background: var(--surface, #eee); }
.re-pipeline-stage-pill.is-expanded { border-color: var(--accent, #0a7ea4); background: var(--accent-soft, rgba(10, 126, 164, 0.1)); }
.re-pipeline-stage-count { font-weight: 600; color: var(--muted); }
.re-pipeline-deals-list { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--border); }
.re-pipeline-deal-card {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: 6px;
  margin-bottom: 6px;
  background: var(--surface, #fff);
}
.re-pipeline-deal-main { flex: 1; min-width: 0; }
.re-pipeline-deal-actions { display: flex; gap: 6px; flex-wrap: wrap; }

/* Daily tasks */
.re-daily-tasks-body { margin-top: 4px; }
.re-daily-tasks-section { margin-bottom: 12px; }
.re-daily-tasks-section h4 { font-size: 0.85rem; margin: 0 0 6px; color: var(--muted); }
.re-daily-overdue h4 { color: var(--error, #c00); }
.re-daily-today h4 { color: var(--warning, #b8860b); }
.re-daily-task-item { list-style: none; padding: 6px 0; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 6px; }
.re-daily-task-item label { display: flex; align-items: center; gap: 8px; cursor: pointer; }
.re-daily-task-due { font-size: 0.8rem; color: var(--muted); }
.re-daily-tasks-badge {
  display: inline-block;
  margin-left: 6px;
  padding: 2px 6px;
  border-radius: 10px;
  font-size: 0.75rem;
  font-weight: 600;
  background: var(--accent, #0a7ea4);
  color: #fff;
}

/* Deal detail modal */
.re-deal-detail-modal .re-detail-modal { max-width: 560px; }
.re-deal-detail-stage-wrap { margin-left: auto; margin-right: 8px; }
.re-deal-detail-stage-wrap select { padding: 4px 8px; font-size: 0.9rem; }
.re-deal-detail-tabs { display: flex; gap: 4px; padding: 8px 0; border-bottom: 1px solid var(--border); margin-bottom: 8px; }
.re-deal-detail-tab { padding: 6px 12px; border: none; background: transparent; border-radius: 4px; cursor: pointer; font-size: 0.9rem; }
.re-deal-detail-tab:hover { background: var(--surface-soft); }
.re-deal-detail-tab.is-active { background: var(--accent-soft, rgba(10, 126, 164, 0.15)); font-weight: 600; }
.re-deal-detail-body .re-detail-table input,
.re-deal-detail-body .re-detail-table textarea { width: 100%; max-width: 100%; box-sizing: border-box; }
.re-deal-tasks-list, .re-deal-notes-list, .re-deal-contacts-list { list-style: none; margin: 0 0 12px; padding: 0; }
.re-deal-task-item { padding: 6px 0; border-bottom: 1px solid var(--border); }
.re-deal-note-meta { font-size: 0.8rem; color: var(--muted); }
.re-deal-add-task-form, .re-deal-add-note-form, .re-deal-add-contact-form { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-start; }
.re-detail-modal-actions { margin-top: 10px; }

.investment-updates-list { list-style: none; margin: 0.75rem 0 0; padding: 0; }
.investment-update-item {
  padding: 0.75rem 0;
  border-bottom: 1px solid var(--border);
}
.investment-update-item:last-child { border-bottom: none; }
.inv-type { font-size: 0.7rem; text-transform: uppercase; color: var(--muted); margin-right: 0.5rem; }
.inv-summary { margin: 0.35rem 0; font-size: 0.9rem; color: var(--muted-2); }
.inv-meta { font-size: 0.75rem; color: var(--muted); }

.video-hero-hint code {
  font-size: 0.75rem;
  background: var(--surface-soft);
  padding: 2px 6px;
  border-radius: 4px;
  border: 1px solid var(--border);
}

/* ── Mission Hero ── */

.mission-hero {
  border: 1px solid var(--card-border);
  border-radius: 12px;
  background: var(--surface-alt);
  margin-bottom: 16px;
  overflow: hidden;
}

.mission-hero-toggle {
  cursor: pointer;
  padding: 12px 16px;
  font-size: 0.9rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--text);
  list-style: none;
}

.mission-hero-toggle::-webkit-details-marker {
  display: none;
}

.mission-hero-toggle::before {
  content: "\25BE ";
  color: var(--muted);
}

.mission-hero:not([open]) .mission-hero-toggle::before {
  content: "\25B8 ";
}

.mission-hero-body {
  padding: 0 16px 16px;
}

.mission-hero-text p {
  margin: 0 0 10px;
  font-size: 0.92rem;
  line-height: 1.55;
  color: var(--text);
}

.mission-tagline {
  font-size: 1.2rem !important;
  font-weight: 700;
  letter-spacing: 0.01em;
  margin-bottom: 14px !important;
  background: linear-gradient(90deg, #56b6ff, #9cdb74);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.mission-closing {
  font-size: 0.88rem !important;
  color: var(--muted) !important;
  border-top: 1px solid var(--border);
  padding-top: 10px;
  margin-top: 14px !important;
}

/* ── Journey Pathway ── */

.journey-pathway {
  margin-bottom: 18px;
}

.journey-pathway-row .journey-nodes {
  flex-wrap: nowrap;
  justify-content: flex-start;
}

.journey-expert-btn {
  margin-left: auto;
  padding: 8px 14px;
  border-radius: 10px;
  border: 1px solid var(--border-strong);
  background: var(--surface-soft);
  color: var(--text);
  font-size: 0.9rem;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
}

.journey-expert-btn:hover {
  background: var(--surface-hover);
}

.journey-expert-btn:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}

.guided-setup-cta {
  margin: 1rem 0;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.primary-button {
  padding: 8px 16px;
  border-radius: 10px;
  border: 1px solid var(--border-strong);
  background: #2e5a8a;
  color: var(--text);
  font-weight: 600;
  cursor: pointer;
}

.primary-button:hover {
  background: #3a6b9e;
}

.expert-chat-context {
  padding: 10px 14px;
  font-size: 0.9rem;
  border-bottom: 1px solid var(--border);
  background: var(--surface-alt);
}

.expert-chat-body {
  padding: 14px;
}

/* Agent chat modal – conversation UI */
.agent-chat-backdrop {
  align-items: center;
  justify-content: center;
}

.agent-chat-dialog {
  display: flex;
  flex-direction: column;
  width: min(520px, 96vw);
  max-height: 88vh;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2);
}

.agent-chat-dialog .modal-header {
  flex-shrink: 0;
  padding: 14px 18px;
  border-bottom: 1px solid var(--border);
  background: var(--surface);
}

.agent-chat-dialog .modal-header h3 {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 600;
}

.agent-chat-context {
  padding: 10px 18px;
  font-size: 0.8rem;
  border-bottom: 1px solid var(--border);
  background: var(--surface-alt);
  color: var(--muted-2);
  flex-shrink: 0;
}

.agent-chat-journey {
  padding: 12px 18px;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, var(--surface-soft) 0%, var(--surface) 100%);
  flex-shrink: 0;
}

.agent-chat-journey-label {
  display: block;
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted-2);
  margin-bottom: 6px;
}

.agent-chat-journey-text {
  margin: 0;
  font-size: 0.88rem;
  line-height: 1.45;
  color: var(--text);
}

.agent-chat-optional {
  padding: 12px 18px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}

.agent-chat-optional-label {
  display: block;
  font-size: 0.8rem;
  margin-bottom: 8px;
  color: var(--muted-2);
}

.agent-chat-focus {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--border-strong);
  border-radius: 10px;
  background: var(--surface);
  color: var(--text);
  font-size: 0.9rem;
  box-sizing: border-box;
}

.agent-chat-focus:focus {
  outline: 2px solid var(--focus-ring, #2e5a8a);
  outline-offset: 2px;
}

/* Context files */
.agent-chat-files {
  padding: 12px 18px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
  background: var(--surface);
}

.agent-chat-files-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
}

.agent-chat-files-label {
  font-size: 0.8rem;
  color: var(--muted-2);
}

.agent-chat-file-input {
  position: absolute;
  width: 0;
  height: 0;
  opacity: 0;
  pointer-events: none;
}

.agent-chat-files-add {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 8px;
  border: 1px solid var(--border-strong);
  background: var(--surface-soft);
  color: var(--text);
  font-size: 0.85rem;
  font-weight: 500;
  cursor: pointer;
}

.agent-chat-files-add:hover {
  background: var(--surface-hover, #e8ecf0);
}

.agent-chat-files-hint {
  font-size: 0.75rem;
  color: var(--muted-2);
}

.agent-chat-files-drop {
  margin-top: 10px;
  padding: 14px;
  border: 2px dashed var(--border);
  border-radius: 10px;
  text-align: center;
  font-size: 0.85rem;
  color: var(--muted-2);
  transition: border-color 0.15s ease, background 0.15s ease;
}

.agent-chat-files-drop-active {
  border-color: var(--focus-ring, #2e5a8a);
  background: var(--surface-alt);
  color: var(--text);
}

.agent-chat-files-list {
  list-style: none;
  margin: 10px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.agent-chat-file-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 8px;
  background: var(--surface-alt);
  border: 1px solid var(--card-border);
  font-size: 0.85rem;
}

.agent-chat-file-name {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text);
}

.agent-chat-file-size {
  flex-shrink: 0;
  font-size: 0.75rem;
  color: var(--muted-2);
}

.agent-chat-file-remove {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  padding: 0;
  border: none;
  border-radius: 6px;
  background: transparent;
  color: var(--muted-2);
  font-size: 1.2rem;
  line-height: 1;
  cursor: pointer;
}

.agent-chat-file-remove:hover {
  background: var(--warn-bg, #fef2f2);
  color: var(--warn-text, #b91c1c);
}

/* Messages */
.agent-chat-messages {
  flex: 1 1 auto;
  min-height: 180px;
  max-height: 38vh;
  overflow-y: auto;
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  background: var(--surface);
}

.agent-chat-msg {
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-width: 88%;
}

.agent-chat-msg-user {
  align-self: flex-end;
  align-items: flex-end;
}

.agent-chat-msg-assistant {
  align-self: flex-start;
  align-items: flex-start;
}

.agent-chat-msg-who {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--muted-2);
  letter-spacing: 0.02em;
}

.agent-chat-msg-text {
  padding: 12px 16px;
  border-radius: 14px;
  font-size: 0.9rem;
  line-height: 1.5;
  white-space: pre-wrap;
  word-break: break-word;
}

.agent-chat-msg-user .agent-chat-msg-text {
  background: #1e4976;
  color: #fff;
  border-bottom-right-radius: 4px;
}

.agent-chat-msg-assistant .agent-chat-msg-text {
  background: var(--surface-alt);
  border: 1px solid var(--card-border);
  border-bottom-left-radius: 4px;
  color: var(--text);
}

.agent-chat-msg-thinking {
  align-self: flex-start;
  padding: 12px 16px;
  border-radius: 14px;
  background: var(--surface-alt);
  border: 1px solid var(--card-border);
  font-size: 0.88rem;
  color: var(--muted-2);
  opacity: 0;
  transition: opacity 0.2s ease;
}

.agent-chat-msg-thinking.is-visible {
  opacity: 1;
}

.agent-chat-input-wrap {
  display: flex;
  gap: 12px;
  padding: 14px 18px;
  border-top: 1px solid var(--border);
  background: var(--surface-soft);
  flex-shrink: 0;
  align-items: flex-end;
}

.agent-chat-input {
  flex: 1;
  min-height: 48px;
  padding: 12px 14px;
  border: 1px solid var(--border-strong);
  border-radius: 12px;
  background: var(--surface);
  color: var(--text);
  font-size: 0.9rem;
  font-family: inherit;
  resize: none;
  box-sizing: border-box;
}

.agent-chat-input:focus {
  outline: 2px solid var(--focus-ring, #2e5a8a);
  outline-offset: 2px;
}

.agent-chat-send {
  padding: 12px 20px;
  border-radius: 12px;
  border: none;
  background: #1e4976;
  color: #fff;
  font-weight: 600;
  font-size: 0.9rem;
  cursor: pointer;
  flex-shrink: 0;
}

.agent-chat-send:hover:not(:disabled) {
  background: #2a5a8e;
}

.agent-chat-send:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}

.is-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;
}

.journey-progress-bar {
  height: 4px;
  border-radius: 999px;
  background: var(--surface-soft);
  border: 1px solid var(--card-border);
  overflow: hidden;
  margin-bottom: 12px;
}

.journey-progress-fill {
  height: 100%;
  background: linear-gradient(90deg, #56b6ff 0%, #9cdb74 50%, #ffb86b 100%);
  transition: width 0.4s ease;
  border-radius: 999px;
}

.journey-nodes {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  flex-wrap: wrap;
}

.journey-node {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 10px 14px;
  border-radius: 10px;
  cursor: pointer;
  transition: background 0.15s ease;
  text-align: center;
  min-width: 80px;
}

.journey-node:hover {
  background: var(--surface-hover);
}

.journey-icon {
  font-size: 1.6rem;
  line-height: 1;
}

.journey-label {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--text);
}

.journey-subtitle {
  font-size: 0.72rem;
  color: var(--muted-2);
}

.journey-count {
  font-size: 0.72rem;
  font-weight: 700;
  background: var(--accent-bg);
  border: 1px solid var(--border-strong);
  border-radius: 999px;
  padding: 1px 7px;
  color: var(--text);
}

.journey-connector {
  display: inline-block;
  width: 28px;
  height: 2px;
  background: var(--border-strong);
  flex-shrink: 0;
}

.journey-done {
  opacity: 0.7;
}

.journey-done .journey-icon {
  filter: saturate(0.5);
}

.journey-active .journey-icon {
  filter: drop-shadow(0 0 6px rgba(86, 182, 255, 0.5));
}

.journey-active .journey-label {
  color: #56b6ff;
}

.journey-future {
  opacity: 0.4;
}

/* ── Responsive ── */

@media (max-width: 600px) {
  .journey-nodes {
    flex-direction: column;
    align-items: stretch;
  }

  .journey-connector {
    width: 2px;
    height: 16px;
    margin: 0 auto;
  }

  .journey-node {
    flex-direction: row;
    gap: 8px;
    min-width: 0;
    text-align: left;
  }

  .mission-hero-body {
    padding: 0 12px 12px;
  }
}

@media (min-width: 801px) {
  .hamburger-button {
    display: none !important;
  }

  .nav-backdrop {
    display: none !important;
  }
}

/* SaaS Project Dashboard: single-column full-width layout (no multi-column) */
.module-content-body:has(.saas-dashboard-wrap) {
  column-count: 1 !important;
  column-gap: 0;
}
.saas-dashboard-wrap {
  width: 100%;
  max-width: 100%;
}
.saas-dashboard-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 0.5rem;
}
.saas-dashboard-title {
  margin: 0;
  font-size: 1.5rem;
  letter-spacing: 0.01em;
}
.saas-dashboard-description {
  margin: 0 0 1rem;
  font-size: 0.9rem;
}
.saas-dashboard-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  width: 100%;
}
.saas-project-card .card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.75rem;
}
.saas-project-card .card-header h3 {
  margin: 0;
  font-size: 1.1rem;
}
.status-pill {
  padding: 0.2rem 0.5rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
}
.status-pill.status-up { background: rgba(156, 219, 116, 0.2); color: #9cdb74; }
.status-pill.status-down { background: rgba(255, 120, 100, 0.2); color: #ff7864; }
.status-pill.status-unknown { background: var(--surface-alt); color: var(--muted); }
.saas-project-card .card-grid.two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}
.saas-environments { display: flex; flex-direction: column; gap: 0.75rem; }
.saas-env-block {
  padding: 0.5rem 0.75rem;
  background: var(--surface-alt);
  border-radius: 6px;
  font-size: 0.9rem;
}
.saas-env-block .label { font-size: 0.8rem; color: var(--muted); }
.saas-env-block .env-live-link { font-size: 0.85rem; color: var(--focus-ring); word-break: break-all; }

/* SaaS app group with dropdown */
.saas-app-group { display: flex; flex-direction: column; }
.saas-app-group-header { flex: 1; }
.saas-app-dropdown summary.saas-app-summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 0.25rem 0;
}
.saas-app-dropdown summary.saas-app-summary::-webkit-details-marker { display: none; }
.saas-app-name { font-weight: 600; font-size: 1.1rem; }
.saas-app-meta { font-size: 0.85rem; color: var(--muted); }
.saas-app-chevron { font-size: 0.7rem; color: var(--muted); transition: transform 0.2s; }
.saas-app-dropdown[open] .saas-app-chevron { transform: rotate(180deg); }
.saas-env-dropdown-list {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  margin-top: 0.75rem;
  padding-top: 0.75rem;
  border-top: 1px solid var(--surface-alt);
}
.saas-env-dropdown-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 0.5rem 0.75rem;
  background: var(--surface-alt);
  border: none;
  border-radius: 6px;
  font-size: 0.9rem;
  text-align: left;
  cursor: pointer;
  transition: background 0.15s;
}
.saas-env-dropdown-item:hover:not(:disabled) { background: var(--surface); }
.saas-env-dropdown-item .env-item-label { color: var(--text); }
.saas-env-dropdown-item .status-pill { flex-shrink: 0; margin-left: 0.5rem; }
.saas-view-all-btn { background: transparent; border: 1px dashed var(--muted); }
.saas-view-all-btn .env-item-label { color: var(--muted); }
.saas-app-group-links { margin-top: 0.75rem; padding-top: 0.5rem; border-top: 1px solid var(--surface-alt); }
.saas-app-group-links a { color: var(--focus-ring); }

.saas-project-card .links {
  margin-bottom: 0.75rem;
}
.saas-project-card .links a {
  margin-right: 1rem;
  color: var(--focus-ring);
}
.saas-project-card .task-list table {
  width: 100%;
  font-size: 0.9rem;
}
.saas-project-card .task-list .badge { font-size: 0.75rem; padding: 0.1rem 0.4rem; border-radius: 4px; }
.badge-completed, .badge-done { background: rgba(156, 219, 116, 0.2); color: #9cdb74; }
.badge-pending, .badge-new { background: var(--surface-alt); color: var(--muted); }
.badge-active, .badge-in_progress { background: rgba(86, 182, 255, 0.2); color: #56b6ff; }

/* RE Investment Monitor: charts and articles */
.re-chart { margin: 1rem 0; }
.re-chart h4 { font-size: 0.9rem; margin-bottom: 0.5rem; color: var(--muted); }
.re-chart-bars-inner { display: flex; flex-direction: column; gap: 0.4rem; }
.re-chart-bar-row { display: grid; grid-template-columns: 1fr 2fr 80px; align-items: center; gap: 0.5rem; font-size: 0.85rem; }
.re-chart-bar-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.re-chart-bar-track { height: 8px; background: var(--surface-alt); border-radius: 4px; overflow: hidden; }
.re-chart-bar-fill { height: 100%; background: var(--focus-ring); border-radius: 4px; min-width: 4px; transition: width 0.2s; }
.re-chart-bar-value { text-align: right; font-variant-numeric: tabular-nums; }
.re-alerts-banner { background: var(--surface-alt); border-left: 4px solid var(--focus-ring); padding: 0.75rem 1rem; margin-bottom: 1rem; border-radius: 4px; }
.re-alerts-banner h4 { margin: 0 0 0.5rem; font-size: 0.95rem; }
.re-alerts-list { list-style: none; padding: 0; margin: 0; }
.re-alerts-list li { margin-bottom: 0.35rem; }
.re-alert-market { font-size: 0.8rem; color: var(--muted); margin-right: 0.35rem; }
.re-article-market { font-size: 0.75rem; color: var(--muted); margin-right: 0.25rem; }
.re-articles-list { list-style: none; padding: 0; margin: 0; }
.re-articles-list li { margin-bottom: 0.75rem; padding-bottom: 0.75rem; border-bottom: 1px solid var(--surface-alt); }
.re-articles-list li:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
.re-articles-list a { font-weight: 500; color: var(--focus-ring); }
.re-articles-list a:hover { text-decoration: underline; }
.re-article-desc { margin: 0.25rem 0 0; font-size: 0.85rem; color: var(--muted); line-height: 1.35; }
/* RE hero header */
.re-hero-header { margin-bottom: 0.25rem; }
.re-hero-header h2 { margin: 0 0 0.15rem; }
.re-hero-subtitle { margin: 0; font-size: 0.9rem; color: var(--muted); }
.re-loading-state { color: var(--muted); font-size: 0.9rem; }

/* RE section intro (used on pipeline, etc.) */
.re-section-intro { margin-bottom: 1rem; }
.re-section-intro h3 { margin: 0 0 0.25rem; }
.re-section-intro p { margin: 0; font-size: 0.9rem; color: var(--muted); line-height: 1.4; }

/* Tab navigation — standalone row above filter bar */
.re-tabs.re-tabs-main { display: flex; flex-wrap: wrap; gap: 0; margin: 0; padding: 0; border-bottom: 2px solid var(--border); }
.re-tabs-main .re-tab { padding: 0.6rem 1rem; font-size: 0.875rem; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: color 0.15s, border-color 0.15s; }
.re-tabs-main .re-tab:hover { color: var(--text); background: var(--surface-alt, transparent); }
.re-tabs-main .re-tab.active { color: var(--focus-ring); border-bottom-color: var(--focus-ring); font-weight: 600; }

/* Filter bar — compact row below tabs */
.re-filter-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; margin: 0.5rem 0 0.75rem; padding: 0.4rem 0.75rem; background: var(--surface-alt); border-radius: 8px; border: 1px solid var(--border); }
.re-filter-label { font-size: 0.8rem; color: var(--muted); font-weight: 500; white-space: nowrap; }
.re-filters-form { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem; margin: 0; }
.re-filters-form select, .re-filters-form input[type="text"] { padding: 0.3rem 0.45rem; border-radius: 4px; border: 1px solid var(--border); font-size: 0.85rem; background: var(--bg); color: var(--text); }
.re-filters-form input[type="text"] { min-width: 140px; }
.re-filters-form button { padding: 0.3rem 0.6rem; font-size: 0.85rem; cursor: pointer; }
.re-redfin-link { font-weight: 500; }
.re-ext-link { font-weight: 500; margin-right: 0.5rem; }

/* Tab content */
.re-monitor-wrap { display: block; }
.re-overview-header { display: flex; align-items: center; justify-content: flex-end; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.75rem; }
.re-chat-btn { font-size: 0.85rem; }
.re-portfolio-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
.re-portfolio-table th, .re-portfolio-table td { padding: 0.4rem 0.6rem; text-align: left; border-bottom: 1px solid var(--border); }
.re-portfolio-table th { font-weight: 600; color: var(--muted); }
.re-portfolio-table .table-wrap { overflow-x: auto; }
.re-tab-content { display: block; margin-top: 0.75rem; }
.re-tab-panel { display: none; margin-top: 0; min-width: 0; max-width: 100%; overflow-x: hidden; }
.re-tab-panel.is-visible { display: block; }
.re-tabs { display: flex; flex-wrap: wrap; gap: 0.25rem; margin: 1rem 0 0; border-bottom: 1px solid var(--border); }
.re-tab { padding: 0.5rem 1rem; background: transparent; border: none; border-bottom: 2px solid transparent; cursor: pointer; font-size: 0.9rem; color: var(--muted); }
.re-tab:hover { color: var(--text); }
.re-tab.active { color: var(--focus-ring); border-bottom-color: var(--focus-ring); font-weight: 500; }

/* Patterns panel: resolution selector and comparison */
.patterns-resolution-selector { display: flex; gap: 0.25rem; margin-bottom: 0.75rem; flex-wrap: wrap; }
.patterns-res-btn { padding: 0.35rem 0.75rem; font-size: 0.85rem; border: 1px solid var(--border); background: var(--chart-bg, #1a1d24); color: var(--muted); border-radius: 4px; cursor: pointer; }
.patterns-res-btn:hover { color: var(--text); }
.patterns-res-btn.active { background: var(--focus-ring); color: #fff; border-color: var(--focus-ring); }
.patterns-best-row { background: rgba(34, 197, 94, 0.12); }
.patterns-pct-bar { display: inline-block; height: 0.75rem; border-radius: 2px; vertical-align: middle; margin-right: 0.25rem; }
.patterns-pct-bar.up { background: var(--chart-up, #22c55e); }
.patterns-pct-bar.down { background: var(--chart-down, #ef4444); }
.patterns-pct-bar.flat { background: var(--muted, #64748b); }
.patterns-unit-seg { display: inline-block; font-size: 0.65rem; padding: 0 2px; border-radius: 2px; background: var(--muted); color: var(--text); margin: 0 1px; }
.patterns-top-accuracy { margin-bottom: 1rem; }
.patterns-top-accuracy h4 { margin-bottom: 0.25rem; }
.patterns-top-accuracy-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-top: 0.5rem; }
@media (max-width: 720px) { .patterns-top-accuracy-grid { grid-template-columns: 1fr; } }
.patterns-top-accuracy-col h5 { font-size: 0.9rem; margin: 0 0 0.5rem 0; color: var(--muted); }
.patterns-top-accuracy-card { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem; padding: 0.4rem 0; border-bottom: 1px solid var(--border); font-size: 0.85rem; }
.patterns-top-accuracy-card:last-child { border-bottom: none; }
.patterns-top-motif { margin-right: 0.25rem; }
.patterns-dir-badge { padding: 0.15rem 0.4rem; border-radius: 4px; font-size: 0.75rem; font-weight: 600; }
.patterns-dir-long { background: rgba(34, 197, 94, 0.25); color: var(--chart-up, #22c55e); }
.patterns-dir-short { background: rgba(239, 68, 68, 0.25); color: var(--chart-down, #ef4444); }
.patterns-top-acc { font-weight: 600; color: var(--text); }

/* Futures Trading Monitor: full-width layout, no wrap on overview */
.futures-monitor { width: 100%; max-width: 100%; position: relative; overflow-x: hidden; box-sizing: border-box; }
.futures-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.5rem;
}
.futures-header h2 { margin: 0; }
.futures-tab-panels { width: 100%; }
.module-content-body:has(.futures-monitor) { column-count: 1 !important; column-gap: 0; }
.module-content-body:has(.cron-table) { column-count: 1 !important; column-gap: 0; }
.futures-overview { width: 100%; }

/* Markets: 2x2 grid, compact charts */
.futures-markets { width: 100%; max-width: 100%; min-width: 0; overflow: hidden; }
.futures-markets-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
  min-height: 2.25rem;
}
.futures-markets-header h3 { margin: 0; font-size: 1rem; flex-shrink: 0; }
.futures-markets-header .futures-range-toolbar { flex-shrink: 0; }
.futures-range-toolbar {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.futures-range-label {
  font-size: 0.8rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--muted, #6b7280);
}
.futures-range-segment {
  display: inline-flex;
  background: var(--surface-alt, #f1f5f9);
  border-radius: 8px;
  padding: 3px;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.04);
}
.futures-range-btn {
  padding: 0.35rem 0.75rem;
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--muted, #64748b);
  background: transparent;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.futures-range-btn:hover {
  color: var(--text, #1e293b);
}
.futures-range-btn.is-active {
  color: var(--text, #1e293b);
  background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}
.futures-range-btn:focus-visible {
  outline: 2px solid var(--accent, #0a7ea4);
  outline-offset: 2px;
}
.futures-markets-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
  min-width: 0;
  max-width: 100%;
}
@media (max-width: 900px) {
  .futures-markets-grid { grid-template-columns: 1fr; }
}
.futures-chart-cell {
  background: var(--surface, #1a1f2e);
  border: 1px solid var(--chart-border, rgba(128,128,128,0.15));
  border-radius: 6px;
  padding: 0.35rem 0.4rem;
  min-height: 240px;
  min-width: 0;
  max-width: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.futures-chart-cell h4 { margin: 0 0 0.2rem; font-size: 0.8rem; font-weight: 600; color: var(--text); display: flex; align-items: center; gap: 0.4rem; letter-spacing: 0.02em; flex-shrink: 0; }
.futures-bias-badge { font-size: 0.6rem; font-weight: 600; padding: 0.1rem 0.35rem; border-radius: 3px; text-transform: uppercase; letter-spacing: 0.03em; }
.futures-bias-bullish { background: rgba(38, 166, 154, 0.2); color: #26a69a; }
.futures-bias-bearish { background: rgba(239, 83, 80, 0.2); color: #ef5350; }
.futures-bias-neutral { background: rgba(148, 163, 184, 0.2); color: #8a94a6; }
.futures-bias-section { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.5rem; }
.futures-bias-reasoning { font-size: 0.85rem; color: var(--muted, #64748b); font-style: italic; }
.futures-setups-list { margin: 0 0 1rem; padding-left: 1.25rem; font-size: 0.9rem; }
.futures-pnl-heatmap { margin-bottom: 1rem; }
.futures-news-by-market { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; margin-top: 0.5rem; }
.futures-news-market h4 { font-size: 0.9rem; margin: 0 0 0.5rem; color: var(--text); }
.futures-news-list { list-style: none; padding: 0; margin: 0; font-size: 0.85rem; }
.futures-news-list li { margin-bottom: 0.5rem; padding-bottom: 0.5rem; border-bottom: 1px solid var(--surface-alt); }
.futures-news-list li:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
.futures-news-list a { font-weight: 500; color: var(--focus-ring); }
.futures-news-list a:hover { text-decoration: underline; }
.futures-news-list .news-desc { font-size: 0.8rem; color: var(--muted, #64748b); display: block; margin-top: 0.15rem; }
.futures-chart-type-btn { padding: 0.3rem 0.6rem; font-size: 0.75rem; font-weight: 500; color: var(--muted, #8a94a6); background: transparent; border: none; border-radius: 4px; cursor: pointer; transition: all 0.15s; }
.futures-chart-type-btn:hover { color: var(--text); background: rgba(128,128,128,0.1); }
.futures-chart-type-btn.is-active { color: var(--text); background: rgba(128,128,128,0.15); }
.futures-chart-cell .futures-chart-wrap {
  flex: 1;
  min-height: 0;
  display: flex;
  align-items: stretch;
  justify-content: stretch;
  width: 100%;
  overflow: hidden;
}
.futures-chart-cell .futures-chart-wrap .cs-chart-container,
.futures-chart-cell .futures-chart-wrap .lc-chart-container {
  flex: 1;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}
.futures-chart-cell .futures-chart-wrap .cs-svg,
.futures-chart-cell .futures-chart-wrap .lc-svg {
  max-width: 100%;
  height: auto;
}
.futures-chart-cell .line-chart-wrapper { display: block; width: 100%; min-height: 0; overflow: hidden; }
.futures-chart-cell .line-chart { display: block; width: 100%; max-width: 100%; height: auto; }

/* Candlestick chart container */
.cs-chart-container { position: relative; width: 100%; min-width: 0; overflow: hidden; }
.cs-chart-container .cs-svg { display: block; width: 100%; height: auto; min-height: 180px; cursor: crosshair; }
.cs-info-bar {
  position: absolute; top: 4px; left: 42px; right: 44px;
  font-size: 12px; font-family: monospace; font-weight: 500;
  color: #e6edf7; letter-spacing: 0.02em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  opacity: 0; transition: opacity 0.12s; pointer-events: none;
  z-index: 2; padding: 6px 10px; background: rgba(0,0,0,0.85);
  border-radius: 4px; border: 1px solid rgba(128,128,128,0.3);
}
.cs-legend {
  display: flex; gap: 6px; flex-wrap: wrap;
  padding: 6px 4px 2px; font-family: var(--ff, system-ui, sans-serif);
}
.cs-overlay-toggle {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 5px 12px; border-radius: 5px;
  font-size: 13px; font-weight: 600; letter-spacing: 0.02em;
  border: 1px solid var(--border-strong);
  background: var(--surface-alt); color: var(--muted);
  cursor: pointer; transition: opacity 0.15s, background 0.15s, border-color 0.15s;
  opacity: 0.45; user-select: none;
}
.cs-overlay-toggle.active {
  opacity: 1; background: var(--accent-bg);
  border-color: var(--border-strong);
  color: var(--text);
}
.cs-dot {
  display: inline-block; width: 8px; height: 8px; border-radius: 50%;
}
.cs-hover-zone { cursor: crosshair; }

/* Mission Learning Overlays: lesson banner, news markers, correlation lines, recommendation badges */
.mission-lesson-banner {
  margin-bottom: 10px; padding: 10px 14px;
  background: var(--surface-alt, rgba(30,34,48,0.9));
  border: 1px solid var(--border, rgba(128,128,128,0.2));
  border-radius: 8px;
}
.mission-banner-header {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin-bottom: 6px;
}
.mission-banner-title {
  font-weight: 600; font-size: 14px; color: var(--text);
}
.mission-banner-category {
  font-size: 11px; padding: 2px 8px; border-radius: 4px;
  background: rgba(66,165,245,0.2); color: #42a5f5;
}
.mission-banner-difficulty {
  font-size: 11px; padding: 2px 8px; border-radius: 4px;
  font-weight: 500;
}
.mission-diff-beginner {
  background: rgba(34,197,94,0.2); color: #22c55e;
}
.mission-diff-intermediate {
  background: rgba(255,167,38,0.2); color: #ffa726;
}
.mission-diff-advanced {
  background: rgba(239,68,68,0.2); color: #ef4444;
}
.mission-banner-lesson {
  font-size: 13px; color: var(--muted, #8a94a6);
  line-height: 1.45;
}
.mission-hints-toggle {
  margin-left: auto;
}

/* Recommendation badges (signal markers with tooltip) */
.cs-signal.cs-recommendation-badge { cursor: help; }
.cs-signal.cs-recommendation-badge polygon { transition: opacity 0.15s; }
.cs-signal.cs-recommendation-badge:hover polygon { opacity: 1; }
.cs-confidence-bar rect { transition: width 0.2s; }

/* News markers with tooltip */
.cs-news-marker { cursor: help; }
.cs-news-marker text { transition: opacity 0.15s; }
.cs-news-marker:hover text { opacity: 1; }

/* Line chart interactive */
.lc-chart-container { position: relative; width: 100%; }
.lc-chart-container .lc-svg { display: block; width: 100%; height: auto; cursor: crosshair; }
.lc-info-bar {
  position: absolute; top: 4px; left: 42px; right: 44px;
  font-size: 12px; font-family: monospace; font-weight: 500;
  color: #e6edf7; letter-spacing: 0.02em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  opacity: 0; transition: opacity 0.12s; pointer-events: none;
  z-index: 2; padding: 6px 10px; background: rgba(0,0,0,0.85);
  border-radius: 4px; border: 1px solid rgba(128,128,128,0.3);
}
.lc-legend {
  font-size: 9px; color: var(--muted, #8a94a6); padding: 2px 4px 0;
  font-family: monospace; display: flex; align-items: center; gap: 6px;
}
.lc-legend-swatch { display: inline-block; width: 10px; height: 3px; border-radius: 1px; }
.lc-legend-text { font-weight: 500; }
.lc-hover-zone { cursor: crosshair; }

/* Expand button on chart cells */
.futures-expand-btn {
  margin-left: auto; background: none; border: 1px solid var(--border, rgba(128,128,128,0.2));
  color: var(--muted, #8a94a6); font-size: 12px; width: 24px; height: 24px;
  border-radius: 4px; cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: all 0.15s; line-height: 1;
}
.futures-expand-btn:hover { color: var(--text); border-color: var(--text); background: rgba(128,128,128,0.08); }

/* Fullscreen overlay */
.futures-fullscreen-overlay {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,0.92); display: flex; align-items: stretch; justify-content: stretch;
  animation: futures-fade-in 0.15s ease-out;
  padding: 8px;
}
@keyframes futures-fade-in { from { opacity: 0; } to { opacity: 1; } }
.futures-fullscreen-inner {
  background: var(--surface, #131722); border: 1px solid var(--border, rgba(128,128,128,0.15));
  border-radius: 6px; padding: 8px 12px; width: 100%; height: 100%;
  display: flex; flex-direction: column; overflow: hidden;
}
.futures-fullscreen-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 4px; flex-shrink: 0;
}
.futures-fullscreen-header h3 { margin: 0; font-size: 1rem; font-weight: 600; color: var(--text); }
.futures-fullscreen-close {
  background: none; border: none; color: var(--muted, #8a94a6); font-size: 24px;
  cursor: pointer; width: 36px; height: 36px; display: flex; align-items: center; justify-content: center;
  border-radius: 4px; transition: all 0.15s;
}
.futures-fullscreen-close:hover { color: var(--text); background: rgba(128,128,128,0.12); }
.futures-fullscreen-chart {
  flex: 1; display: flex; align-items: stretch; justify-content: stretch;
  min-height: 0; overflow: hidden;
}
.futures-fullscreen-chart .cs-chart-container,
.futures-fullscreen-chart .lc-chart-container { max-width: none; width: 100%; height: 100%; }
.futures-fullscreen-chart .cs-svg,
.futures-fullscreen-chart .lc-svg { width: 100%; height: 100%; }

/* Line chart legacy legend (fallback) */
.line-chart-legend {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  margin-top: 0.25rem;
  font-size: 0.75rem;
  color: var(--muted, #666);
}
.line-chart-legend-swatch {
  display: inline-block;
  width: 10px;
  height: 3px;
  border-radius: 1px;
}
.line-chart-legend-text { font-weight: 500; }
.line-chart-legend-vol { height: 8px; width: 12px; background: rgba(10, 126, 164, 0.4); margin-left: 0.5rem; }

/* Talk to Futures Assistant: floating callout, semi-transparent, draggable */
.futures-chat-callout {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  z-index: 1000;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem 0.6rem;
  background: rgba(255, 255, 255, 0.82);
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 10px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
  user-select: none;
}
.futures-chat-drag-handle {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.15rem;
  color: var(--muted, #888);
  font-size: 0.75rem;
  letter-spacing: -0.08em;
  cursor: grab;
  opacity: 0.7;
}
.futures-chat-drag-handle:hover { opacity: 1; }
.futures-chat-callout:active .futures-chat-drag-handle { cursor: grabbing; }
.futures-chat-callout-btn { cursor: pointer; font-size: 0.85rem; padding: 0.4rem 0.75rem; white-space: nowrap; flex-shrink: 0; }

/* Analysis: intro, KPIs, macro cards */
.futures-analysis { width: 100%; }
.futures-analysis-intro {
  margin: 0 0 1rem;
  font-size: 0.95rem;
  color: var(--muted, #555);
  line-height: 1.45;
}
.futures-analysis h3 { margin: 1rem 0 0.5rem; font-size: 1rem; }
.futures-analysis-kpis.card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
  gap: 0.75rem;
}
.futures-macro-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 0.75rem;
  margin-top: 0.5rem;
}
.futures-macro-card .muted { font-size: 0.7rem; margin-top: 0.2rem; color: var(--muted, #666); }

/* Market Intelligence hub (Analysis tab) */
.intel-hub { width: 100%; margin-bottom: 1.5rem; }
.intel-hub h3 { margin: 0 0 0.75rem; font-size: 1.05rem; }
.intel-executive {
  padding: 1rem 1.25rem;
  margin-bottom: 1rem;
  background: var(--surface-alt, #f8fafc);
  border-radius: 8px;
  border-left: 4px solid var(--accent, #0a7ea4);
}
.intel-executive-label { font-weight: 600; font-size: 0.85rem; margin-bottom: 0.5rem; color: var(--muted, #555); text-transform: uppercase; letter-spacing: 0.03em; }
.intel-executive-summary { margin: 0; font-size: 0.95rem; line-height: 1.5; color: var(--text); }
.intel-panels.card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 0.75rem;
  margin-bottom: 1rem;
}
.intel-panel { padding: 0.75rem 1rem; }
.intel-panel-header { font-weight: 600; font-size: 0.85rem; margin-bottom: 0.4rem; color: var(--text); }
.intel-panel-summary { margin: 0.4rem 0 0; font-size: 0.85rem; line-height: 1.4; color: var(--muted, #555); }
.intel-trend { font-size: 0.9rem; font-weight: 500; margin-bottom: 0.25rem; }
.intel-rsi-wrap { display: flex; align-items: center; gap: 0.5rem; margin: 0.5rem 0; font-size: 0.85rem; }
.intel-rsi-label { flex-shrink: 0; }
.intel-rsi-bar { flex: 1; height: 8px; background: var(--chart-bg, #e2e8f0); border-radius: 4px; overflow: hidden; }
.intel-rsi-fill { height: 100%; background: linear-gradient(90deg, #22c55e 0%, #eab308 50%, #ef4444 100%); border-radius: 4px; transition: width 0.2s; }
.intel-rsi-value { flex-shrink: 0; font-weight: 500; }
.intel-atr { font-size: 0.85rem; margin-top: 0.35rem; }
.intel-levels { margin-top: 0.5rem; font-size: 0.85rem; }
.intel-level-row { margin-bottom: 0.25rem; }
.intel-level-label { font-weight: 500; margin-right: 0.5rem; }
.intel-level-val { margin-right: 0.5rem; color: var(--muted, #555); }
.intel-forecast-wrap { margin-bottom: 1rem; }
.intel-forecast-card { padding: 1rem 1.25rem; }
.intel-forecast-bias { font-size: 1.1rem; font-weight: 600; margin-bottom: 0.35rem; }
.intel-forecast-meta { font-size: 0.8rem; color: var(--muted, #555); margin-bottom: 0.5rem; }
.intel-pattern-wrap { margin-bottom: 1rem; }
.intel-correlation-panel { margin-bottom: 1rem; }
.intel-correlation-panel .intel-panel-header { margin-bottom: 0.5rem; }
.intel-correlation-wrap { overflow-x: auto; margin: 0.5rem 0; }
.intel-correlation-table { border-collapse: collapse; font-size: 0.8rem; min-width: 180px; }
.intel-correlation-table th, .intel-correlation-table td { padding: 0.35rem 0.5rem; border: 1px solid var(--chart-border, #e2e8f0); text-align: center; }
.intel-corr-th { font-weight: 600; background: var(--surface-alt, #f1f5f9); }
.intel-corr-cell { min-width: 2.5rem; }

/* Journal: intro, toolbar, sections, recent entries */
.futures-journal { width: 100%; max-width: 52rem; }
.futures-journal-intro {
  margin: 0 0 1.25rem;
  padding: 0.75rem 1rem;
  background: var(--surface-alt, #f5f5f5);
  border-radius: 8px;
  font-size: 0.9rem;
  color: var(--text);
  line-height: 1.5;
  border-left: 3px solid var(--accent, #0a7ea4);
}
.futures-journal-form { margin-bottom: 1.5rem; }
.futures-journal-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.25rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--border, #e0e0e0);
}
.futures-journal-date-label,
.futures-journal-grade-label { display: flex; align-items: center; gap: 0.35rem; font-size: 0.9rem; }
.futures-journal-date-input,
.futures-journal-grade-input {
  padding: 0.4rem 0.5rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 0.9rem;
}
.futures-journal-grade-input { width: 4rem; text-align: center; }
.futures-journal-sections {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
}
@media (min-width: 640px) {
  .futures-journal-sections { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 900px) {
  .futures-journal-sections { grid-template-columns: 1fr 1fr 1fr; }
}
.futures-journal-section {
  background: var(--surface-alt, #f8f9fa);
  border: 1px solid var(--chart-border, #e8e8e8);
  border-radius: 8px;
  padding: 0.75rem 1rem;
}
.futures-journal-section h4 { margin: 0 0 0.25rem; font-size: 0.95rem; font-weight: 600; }
.futures-journal-hint {
  margin: 0 0 0.5rem;
  font-size: 0.75rem;
  color: var(--muted, #666);
  line-height: 1.35;
}
.futures-journal-section textarea {
  width: 100%;
  min-height: 4.5rem;
  padding: 0.5rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 0.9rem;
  font-family: inherit;
  resize: vertical;
}
.futures-journal-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.futures-journal-recent-item {
  display: block;
  padding: 0.6rem 0.75rem;
  margin-bottom: 0.35rem;
  background: var(--surface-alt, #f5f5f5);
  border: 1px solid var(--border, #e8e8e8);
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.15s ease;
}
.futures-journal-recent-item:hover { background: var(--chart-bg, #e8eef2); }
.futures-journal-recent-date { font-weight: 600; margin-right: 0.5rem; font-size: 0.9rem; }
.futures-journal-recent-grade {
  display: inline-block;
  margin-right: 0.5rem;
  padding: 0.1rem 0.35rem;
  background: var(--accent, #0a7ea4);
  color: #fff;
  border-radius: 4px;
  font-size: 0.75rem;
}
.futures-journal-recent-preview { font-size: 0.85rem; color: var(--muted, #555); }
.futures-journal-empty { padding: 0.75rem; color: var(--muted, #666); font-style: italic; }

.futures-overview .card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
}
@media (min-width: 900px) {
  .futures-overview .card-grid { grid-template-columns: repeat(6, 1fr); }
}

/* Crypto Trading Monitor: tabs and panels */
.crypto-monitor { width: 100%; max-width: 100%; position: relative; overflow-x: hidden; box-sizing: border-box; }
.crypto-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin-bottom: 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--border);
}
.crypto-tab-btn {
  padding: 0.4rem 0.85rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--muted);
  background: transparent;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: color 0.15s ease, background 0.15s ease;
}
.crypto-tab-btn:hover { color: var(--text); }
.crypto-tab-btn.active {
  color: var(--text);
  background: var(--surface-alt);
}
.crypto-tab-panel { width: 100%; min-height: 200px; }
.crypto-overview { width: 100%; }
.crypto-overview h3 { margin: 1rem 0 0.5rem; font-size: 1rem; }
.crypto-overview .table-wrap { margin-bottom: 1rem; }
.crypto-overview .positive { color: var(--success, #22c55e); }
.crypto-overview .negative { color: var(--error, #ef4444); }
.crypto-markets { width: 100%; max-width: 100%; min-width: 0; overflow: hidden; }
.crypto-markets-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}
.crypto-markets-header h3 { margin: 0; font-size: 1rem; }
.crypto-symbol-select { padding: 0.35rem 0.5rem; border-radius: 6px; border: 1px solid var(--border); background: var(--surface); color: var(--text); }
.crypto-range-toolbar { display: flex; align-items: center; gap: 0.5rem; }
.crypto-range-label { font-size: 0.8rem; color: var(--muted); text-transform: uppercase; }
.crypto-range-segment {
  display: inline-flex;
  background: var(--surface-alt);
  border-radius: 8px;
  padding: 3px;
}
.crypto-range-btn {
  padding: 0.35rem 0.75rem;
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--muted);
  background: transparent;
  border: none;
  border-radius: 6px;
  cursor: pointer;
}
.crypto-range-btn:hover { color: var(--text); }
.crypto-range-btn.is-active { color: var(--text); background: var(--surface); }
.crypto-chart-wrap { margin-top: 0.5rem; }
.crypto-chart-empty { padding: 2rem; text-align: center; }
.crypto-placeholder { padding: 1.5rem; }
.crypto-placeholder h3 { margin: 0 0 0.5rem; }

/* Futures Education: HTML tutorial typography and diagrams */
.futures-education { width: 100%; max-width: 100%; overflow-x: hidden; box-sizing: border-box; }
.futures-tutorial-html {
  font-size: 0.95rem;
  line-height: 1.55;
  color: var(--text);
  overflow-x: hidden;
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.futures-tutorial-html .tutorial-title { font-size: 1.5rem; font-weight: 700; margin: 0 0 1rem; color: var(--text); }
.futures-tutorial-html .tutorial-part { margin: 2rem 0; }
.futures-tutorial-html .tutorial-part > .part-heading { font-size: 1.2rem; font-weight: 600; margin: 0 0 0.75rem; color: var(--text); border-bottom: 1px solid var(--border); padding-bottom: 0.35rem; }
.futures-tutorial-html .tutorial-section { margin: 1.25rem 0; }
.futures-tutorial-html .tutorial-section > .section-heading { font-size: 1.05rem; font-weight: 600; margin: 0 0 0.5rem; color: var(--muted-2); }
.futures-tutorial-html .tutorial-section p { margin: 0.5rem 0; }
.futures-tutorial-html .tutorial-section ul { margin: 0.5rem 0; padding-left: 1.25rem; }
.futures-tutorial-html .tutorial-section li { margin: 0.25rem 0; }
.futures-tutorial-html .tutorial-table { width: 100%; max-width: 100%; border-collapse: collapse; font-size: 0.9rem; margin: 0.75rem 0; display: block; overflow-x: auto; }
.futures-tutorial-html .tutorial-table th,
.futures-tutorial-html .tutorial-table td { padding: 0.5rem 0.75rem; text-align: left; border: 1px solid var(--border); white-space: nowrap; }
.futures-tutorial-html .tutorial-table th { background: var(--surface-alt); font-weight: 600; color: var(--muted-2); }
.futures-tutorial-html .tutorial-diagram { margin: 1rem 0; text-align: center; overflow-x: auto; }
.futures-tutorial-html .tutorial-diagram svg { max-width: 100%; height: auto; }
.futures-tutorial-html .tutorial-note { font-size: 0.875rem; color: var(--muted); margin: 1rem 0; font-style: italic; }
.futures-tutorial-html .tutorial-glossary { margin-top: 2rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.futures-tutorial-html .tutorial-glossary dt { font-weight: 600; margin-top: 0.5rem; }
.futures-tutorial-html .tutorial-glossary dd { margin-left: 1rem; color: var(--muted); }
.futures-tutorial-html .tutorial-intro { margin: 0 0 1.5rem; color: var(--muted); }
.futures-tutorial-html .tutorial-section ol { margin: 0.5rem 0; padding-left: 1.5rem; }
.futures-tutorial-html .tutorial-section ol li { margin: 0.25rem 0; }
.futures-tutorial-html .tutorial-section code { font-size: 0.9em; padding: 0.1em 0.35em; background: var(--surface-alt); border-radius: 4px; }
.futures-tutorial-html .tutorial-section a { color: var(--focus-ring); }
.futures-tutorial-html pre { overflow-x: auto; max-width: 100%; }
.futures-tutorial-html img { max-width: 100%; height: auto; }

@media (min-width: 1000px) {
  .module-content-body .re-monitor-wrap { column-span: all; }
}
.re-address-search { max-width: 42rem; }
.re-address-search-form { display: flex; gap: 0.5rem; margin: 0.75rem 0; flex-wrap: wrap; }
.re-address-input { flex: 1; min-width: 200px; padding: 0.5rem; border-radius: 4px; border: 1px solid var(--border); }
.re-address-lookup { padding: 0.5rem 0.75rem; cursor: pointer; }
.re-address-result { margin: 1rem 0; padding: 0.75rem; background: var(--surface-alt); border-radius: 8px; }
.re-address-msg { margin: 0; }
.re-address-links-buttons { margin: 0.5rem 0; }
.re-tools-note { margin-top: 0.75rem; color: var(--muted); font-size: 0.85rem; }

/* RE Tools sub-tab and calculator shared */
.re-tools-wrap { margin-top: 0.5rem; }
.re-tools-pills { display: flex; flex-wrap: wrap; gap: 0.25rem; margin-bottom: 1rem; padding: 0.25rem; background: var(--surface-alt); border-radius: 8px; border: 1px solid var(--border); }
.re-tool-pill { padding: 0.4rem 0.75rem; font-size: 0.875rem; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); color: var(--muted); cursor: pointer; }
.re-tool-pill:hover { color: var(--text); border-color: var(--muted); }
.re-tool-pill.active { background: var(--focus-ring); color: var(--surface); border-color: var(--focus-ring); }
.re-tool-panels { display: block; }
.re-tool-panel { display: none; }
.re-tool-panel.is-visible { display: block; }
.re-tool-content { min-height: 120px; }

.re-calc-placeholder { color: var(--muted); font-size: 0.9rem; margin: 1rem 0; }
.re-calc-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 0.75rem; margin-bottom: 1.25rem; }
.re-calc-card { padding: 0.75rem 1rem; background: var(--surface-alt); border-radius: 8px; border: 1px solid var(--border); }
.re-calc-card .label { font-size: 0.8rem; color: var(--muted); margin-bottom: 0.25rem; }
.re-calc-card .value { font-size: 1.1rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.re-calc-card.positive .value { color: var(--success, #0a0); }
.re-calc-card.negative .value { color: var(--error, #c00); }
.re-calc-card.marginal .value { color: var(--warning, #a60); }

.re-calc-form { max-width: 52rem; }
.re-calc-section { margin: 1rem 0; border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
.re-calc-section summary { padding: 0.6rem 0.75rem; background: var(--surface-alt); cursor: pointer; font-weight: 500; list-style: none; }
.re-calc-section summary::-webkit-details-marker { display: none; }
.re-calc-section summary::before { content: "▸ "; }
.re-calc-section[open] summary::before { content: "▾ "; }
.re-calc-section-inner { padding: 0.75rem 1rem; }
.re-calc-row { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; margin-bottom: 0.5rem; }
.re-calc-row label { min-width: 10rem; font-size: 0.9rem; }
.re-calc-row input, .re-calc-row select { padding: 0.35rem 0.5rem; border-radius: 4px; border: 1px solid var(--border); font-size: 0.9rem; }
.re-calc-row input[type="number"] { width: 7rem; }
.re-calc-table-wrap { overflow-x: auto; margin: 0.75rem 0; }
.re-calc-table-wrap table { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.re-calc-table-wrap th, .re-calc-table-wrap td { padding: 0.4rem 0.6rem; border: 1px solid var(--border); text-align: left; }
.re-calc-table-wrap th { background: var(--surface-alt); font-weight: 500; }
.re-calc-actions { margin-top: 1rem; display: flex; gap: 0.5rem; flex-wrap: wrap; }
.re-calc-actions button { padding: 0.5rem 1rem; border-radius: 6px; border: 1px solid var(--border); background: var(--surface-alt); cursor: pointer; font-size: 0.9rem; }
.re-calc-actions button.primary { background: var(--focus-ring); color: var(--surface); border-color: var(--focus-ring); }

/* Base button styles – used across app */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  padding: 0.5rem 1rem;
  font-size: 0.9rem;
  font-weight: 500;
  border-radius: 8px;
  border: 1px solid var(--border-strong);
  background: var(--surface-soft);
  color: var(--text);
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}
.btn:hover:not(:disabled) {
  background: var(--surface-hover);
  border-color: var(--focus-ring);
  color: var(--focus-ring);
}
.btn:disabled { opacity: 0.6; cursor: not-allowed; }
.btn:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.btn.primary {
  background: var(--focus-ring);
  border-color: var(--focus-ring);
  color: var(--surface);
}
.btn.primary:hover:not(:disabled) {
  background: #3a7eb8;
  border-color: #3a7eb8;
  color: var(--surface);
  box-shadow: 0 2px 8px rgba(22, 96, 189, 0.35);
}
.btn.secondary {
  background: var(--surface-alt);
  border-color: var(--border);
}
.btn.secondary:hover:not(:disabled) {
  background: var(--surface-hover);
  border-color: var(--border-strong);
  color: var(--text);
}

/* Order entry – symbol selector, buy/sell, place order */
.order-entry {
  padding: 1rem;
  background: var(--surface-alt);
  border: 1px solid var(--border);
  border-radius: 10px;
}
.order-entry h4 { margin: 0 0 0.75rem; font-size: 1rem; font-weight: 600; }
.order-entry-symbols {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin-bottom: 0.75rem;
  padding: 3px;
  background: var(--surface);
  border-radius: 8px;
  border: 1px solid var(--border);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.04);
}
.order-entry-symbol {
  padding: 0.35rem 0.65rem;
  font-size: 0.85rem;
  font-weight: 500;
  color: var(--muted);
  background: transparent;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: color 0.15s, background 0.15s, box-shadow 0.15s;
}
.order-entry-symbol:hover { color: var(--text); }
.order-entry-symbol.active {
  color: var(--surface);
  background: var(--focus-ring, #0a7ea4);
  border: 1px solid var(--focus-ring, #0a7ea4);
  box-shadow: 0 0 0 2px rgba(86, 182, 255, 0.3);
}
.order-entry-current { margin-bottom: 0.75rem; }
.order-entry-price { font-size: 1.5rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.order-entry-buttons {
  display: flex;
  gap: 0.5rem;
  margin-bottom: 1rem;
}
.order-entry-side {
  flex: 1;
  padding: 0.6rem 1rem;
  font-size: 0.95rem;
  font-weight: 600;
  border-radius: 8px;
  border: 1px solid var(--border);
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.order-entry-side.buy-btn {
  background: rgba(16, 185, 129, 0.12);
  border-color: rgba(16, 185, 129, 0.4);
  color: #059669;
}
.order-entry-side.buy-btn:hover:not(:disabled),
.order-entry-side.buy-btn.active { background: rgba(16, 185, 129, 0.2); border-color: #059669; color: #059669; }
.order-entry-side.sell-btn {
  background: rgba(239, 68, 68, 0.1);
  border-color: rgba(239, 68, 68, 0.35);
  color: #dc2626;
}
.order-entry-side.sell-btn:hover:not(:disabled),
.order-entry-side.sell-btn.active { background: rgba(239, 68, 68, 0.18); border-color: #dc2626; color: #dc2626; }
.order-entry-form label { display: block; margin-bottom: 0.5rem; font-size: 0.85rem; color: var(--muted); }
.order-entry-form input, .order-entry-form select {
  width: 100%;
  padding: 0.5rem 0.65rem;
  margin-top: 0.2rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text);
  font-size: 0.9rem;
}
.order-entry-form button[type="submit"] { margin-top: 0.75rem; width: 100%; }
.order-entry-form [data-bracket-template] {
  font-weight: 500;
  background: var(--surface-alt);
}

/* Simulation session bar and layout */
.futures-simulation { padding: 0; }

/* Dual simulation cards: Combine (blue) + Live Sandbox (green) */
.sim-dual-cards {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin-bottom: 0.5rem;
}
.sim-card {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.4rem 0.75rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  font-size: 0.85rem;
  flex-wrap: wrap;
}
.sim-card-combine {
  border-left: 3px solid #1660bd;
}
.sim-card-sandbox {
  border-left: 3px solid #0d7d4d;
}
.sim-card-selected {
  background: rgba(10, 126, 164, 0.04);
}
.sim-card-combine.sim-card-selected { border-left-color: #1660bd; background: rgba(22, 96, 189, 0.06); }
.sim-card-sandbox.sim-card-selected { border-left-color: #0d7d4d; background: rgba(13, 125, 77, 0.06); }
.sim-card-title {
  font-size: 0.85rem;
  font-weight: 600;
  white-space: nowrap;
}
.sim-card-inline-stats {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.82rem;
  flex-wrap: wrap;
}
.sim-card-inline-stats .sim-card-balance { font-weight: 700; }
.sim-card-inline-stats progress { width: 60px; height: 5px; border-radius: 3px; vertical-align: middle; }
.sim-card-sep { color: var(--muted); opacity: 0.4; }
.sim-card-actions { display: flex; gap: 0.35rem; margin-left: auto; }
.sim-badge-experimental {
  font-size: 0.65rem;
  font-weight: 600;
  padding: 0.15rem 0.4rem;
  background: rgba(13, 125, 77, 0.2);
  color: #0d7d4d;
  border-radius: 4px;
  margin-left: 0.35rem;
}
.sim-env-badge-line {
  margin: 0 0 0.5rem 0;
  font-size: 0.85rem;
  color: var(--muted-2);
}
.sim-env-badge {
  font-weight: 600;
  padding: 0.2rem 0.5rem;
  border-radius: 6px;
  font-size: 0.8rem;
}
.sim-env-badge-value {
  background: var(--surface-soft);
  color: var(--accent);
}
.sim-order-env-note {
  margin: 0 0 0.5rem 0;
  font-size: 0.8rem;
  color: var(--muted-2);
}
.sim-type-badge {
  font-size: 0.7rem;
  font-weight: 600;
  padding: 0.2rem 0.45rem;
  border-radius: 4px;
}
.sim-type-combine { background: rgba(22, 96, 189, 0.15); color: #1660bd; }
.sim-type-live_sandbox { background: rgba(13, 125, 77, 0.15); color: #0d7d4d; }

.sim-session-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem 1rem;
  padding: 0.75rem 1rem;
  margin-bottom: 1rem;
  background: var(--surface-alt);
  border: 1px solid var(--border);
  border-radius: 10px;
}
.sim-mode-badge {
  padding: 0.25rem 0.5rem;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  color: var(--muted);
  background: var(--surface-soft);
  border-radius: 6px;
}
.sim-session-live .sim-mode-badge { background: rgba(38, 166, 154, 0.2); color: #26a69a; }
.sim-live-label { font-size: 0.8rem; color: var(--muted); font-weight: 500; }
.sim-session-bar > span { font-size: 0.9rem; color: var(--text); }
.sim-session-bar .btn { flex-shrink: 0; }
.sim-session-actions { display: flex; gap: 0.5rem; }
.sim-session-paused .sim-paused-badge {
  padding: 0.2rem 0.5rem;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  background: rgba(234, 179, 8, 0.25);
  color: var(--warn, #eab308);
  border-radius: 4px;
  animation: sim-pulse 1.5s ease-in-out infinite;
}
.sim-grid.sim-paused { opacity: 0.7; pointer-events: none; }
@keyframes sim-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.7; }
}
.sim-session-toast {
  padding: 0.6rem 1rem;
  margin-bottom: 0.75rem;
  font-size: 0.9rem;
  background: var(--warn-bg);
  border: 1px solid var(--warn-border);
  border-radius: 8px;
  color: var(--warn-text);
}
.sim-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
}
@media (min-width: 768px) {
  .sim-grid { grid-template-columns: minmax(240px, 1fr) minmax(200px, 1fr) minmax(200px, 1fr); }
}
.sim-col { min-width: 0; }
.sim-col h4 { margin: 0 0 0.5rem; font-size: 0.95rem; font-weight: 600; }
.sim-cards { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 0.75rem; }
.sim-gauges { display: flex; gap: 0.75rem; flex-wrap: wrap; margin-bottom: 0.5rem; }
/* Replay controls inline in session bar */
.sim-replay-date-badge {
  font-size: 0.75rem;
  color: var(--muted);
  background: var(--surface);
  padding: 0.2rem 0.5rem;
  border-radius: 4px;
  margin-right: 0.5rem;
  border: 1px solid var(--border);
}
.sim-replay-inline {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  flex: 1;
  min-width: 0;
}
.sim-replay-inline .sim-replay-controls {
  display: flex;
  gap: 0.25rem;
}
.sim-replay-inline .sim-replay-progress {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  min-width: 100px;
  flex: 1;
  max-width: 180px;
}
.sim-replay-scrubber {
  flex: 1;
  min-width: 60px;
  max-width: 120px;
  cursor: pointer;
  accent-color: var(--accent, #0a7ea4);
}
.sim-replay-inline .sim-replay-speed {
  display: flex;
  gap: 0.2rem;
}
/* Bar detail modal (click on candlestick) */
.sim-bar-detail-backdrop .sim-bar-detail-modal {
  width: min(720px, 100%);
}
.sim-bar-detail-backdrop .sim-bar-detail-modal.sim-bar-detail-modal-wide {
  max-width: 720px;
}
.sim-bar-detail-backdrop .sim-bar-detail-modal.sim-bar-detail-modal-compact {
  max-width: 560px;
}
.sim-details-modal-backdrop .sim-details-modal { max-width: 520px; }
.sim-details-modal-backdrop .sim-details-table { width: 100%; font-size: 0.875rem; }
.sim-details-modal-backdrop .sim-details-table .sim-details-key { color: var(--muted); padding: 0.35rem 0.5rem 0.35rem 0; vertical-align: top; }
.sim-details-modal-backdrop .sim-details-table .sim-details-val { padding: 0.35rem 0; word-break: break-word; }
.sim-bar-detail-backdrop .modal-header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.sim-bar-detail-backdrop .modal-header .sim-bar-detail-title {
  flex: 1;
  text-align: center;
}
.sim-bar-detail-drag-handle {
  cursor: default;
}
.bar-explain-prev,
.bar-explain-next {
  flex-shrink: 0;
  min-width: 36px;
  padding: 0.25rem 0.5rem;
  font-size: 1rem;
  line-height: 1;
}
.bar-explain-prev:disabled,
.bar-explain-next:disabled {
  opacity: 0.3;
  cursor: default;
}
.sim-bar-detail-title { margin: 0; font-size: 1.1rem; font-weight: 600; }

/* Chart bar highlight when modal is open */
.cs-hover-zone.bar-explain-active {
  fill: rgba(86, 182, 255, 0.25) !important;
}
.sim-bar-detail-body .sim-bar-detail-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  padding: 0.5rem 0;
  font-size: 0.95rem;
}
.sim-bar-detail-row + .sim-bar-detail-row { border-top: 1px solid var(--border); }
.sim-bar-detail-row.sim-bar-ohlc {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.25rem;
  border-top: 1px solid var(--border);
}
.sim-bar-detail-row.sim-bar-ohlc span {
  font-family: monospace;
  font-size: 0.9rem;
}
.sim-bar-up { color: #26a69a; }
.sim-bar-down { color: #ef5350; }
.sim-pnl-up { color: #26a69a; }
.sim-pnl-down { color: #ef5350; }
.sim-bar-detail-footer { text-align: center; }
.sim-bar-detail-body {
  padding: 16px;
  max-height: 70vh;
  overflow-y: auto;
}
.sim-bar-chat-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  font-size: 0.88rem;
  font-weight: 600;
  cursor: pointer;
  background: #1660bd;
  color: #fff !important;
  border: none;
  border-radius: 6px;
  padding: 10px 16px;
  width: 100%;
}
.sim-bar-chat-btn:hover {
  background: #3a7eb8;
  color: #fff !important;
}
.sim-bar-chat-btn::before { content: "\1F4AC"; }

@media (min-width: 901px) and (pointer: fine) {
  .sim-bar-detail-drag-handle {
    cursor: grab;
    user-select: none;
  }
  .is-dragging-modal .sim-bar-detail-drag-handle {
    cursor: grabbing;
  }
  .is-dragging-modal {
    user-select: none;
  }
}

@media (max-width: 768px) {
  .sim-bar-detail-backdrop {
    padding: 8px;
    align-items: flex-start;
  }
  .sim-bar-detail-backdrop .sim-bar-detail-modal {
    width: calc(100vw - 16px);
    max-height: calc(100vh - 16px);
    border-radius: 10px;
  }
  .sim-bar-detail-backdrop .sim-bar-detail-header {
    gap: 0.35rem;
    padding: 10px 12px;
  }
  .sim-bar-detail-title {
    font-size: 0.98rem;
    line-height: 1.2;
  }
  .sim-bar-detail-body {
    padding: 12px;
    max-height: calc(100vh - 190px);
  }
  .sim-bar-detail-footer {
    padding: 10px 12px;
  }
  .bar-explain-visual-row {
    flex-direction: column;
    gap: 0.65rem;
  }
  .bar-explain-candle-wrap {
    flex: 0 0 auto;
    width: 100%;
    min-height: 120px;
  }
  .bar-explain-ohlc-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0.5rem 0;
  }
  .bar-explain-stats {
    gap: 0.45rem 0.8rem;
    font-size: 0.84rem;
    margin-bottom: 0.5rem;
    padding-bottom: 0.5rem;
  }
  .bar-explain-pattern-name {
    font-size: 0.92rem;
  }
}

/* Explain This Bar — educational modal sections */
.bar-explain-importance {
  margin-bottom: 0.75rem;
  padding: 0.55rem 0.7rem;
  background: rgba(255,255,255,0.03);
  border: 1px solid var(--border);
  border-radius: 8px;
}
.bar-explain-importance-meter {
  width: 100%;
  height: 6px;
  background: rgba(128,128,128,0.15);
  border-radius: 3px;
  overflow: hidden;
  margin-bottom: 0.35rem;
}
.bar-explain-importance-fill {
  height: 100%;
  border-radius: 3px;
  transition: width 0.3s ease;
}
.bar-explain-importance-label {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: 0.85rem;
  margin-bottom: 2px;
}
.bar-explain-importance-score {
  font-size: 0.75rem;
  color: var(--muted);
  font-family: monospace;
}
.bar-explain-importance-desc {
  font-size: 0.78rem;
  line-height: 1.35;
  color: var(--muted-2, var(--muted));
}
.bar-explain-visual-row {
  display: flex;
  gap: 1rem;
  align-items: stretch;
  margin-bottom: 0.75rem;
}
.bar-explain-candle-wrap {
  flex: 0 0 110px;
  min-height: 180px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.15);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 6px 2px;
}
.bar-explain-candle-svg {
  display: block;
}
.bar-explain-right-col {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.bar-explain-ohlc-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  margin: 0.75rem 0;
}
.bar-explain-ohlc-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 6px 4px;
  background: rgba(255,255,255,0.03);
  border: 1px solid var(--border);
  border-radius: 6px;
}
.bar-explain-ohlc-label {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  margin-bottom: 2px;
}
.bar-explain-ohlc-val {
  font-family: monospace;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--text);
}
.bar-explain-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.25rem;
  font-size: 0.88rem;
  margin-bottom: 0.75rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--border);
}
.bar-explain-anatomy {
  margin-bottom: 0.75rem;
  padding: 0.6rem 0.75rem;
  background: rgba(255,255,255,0.03);
  border: 1px solid var(--border);
  border-radius: 8px;
}
.bar-explain-anatomy-title {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  margin-bottom: 0.4rem;
  font-weight: 600;
}
.bar-explain-anatomy-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: 0.85rem;
  padding: 2px 0;
  color: var(--text);
}
.bar-explain-anatomy-row + .bar-explain-anatomy-row {
  border-top: 1px solid rgba(128,128,128,0.1);
}
.bar-explain-pattern {
  margin-bottom: 0.75rem;
  padding: 0.65rem 0.75rem;
  background: rgba(86,182,255,0.06);
  border: 1px solid rgba(86,182,255,0.2);
  border-radius: 8px;
}
.bar-explain-pattern-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.35rem;
}
.bar-explain-pattern-name {
  font-weight: 700;
  font-size: 1rem;
  color: var(--text);
}
.bar-explain-pattern-bias {
  font-size: 0.8rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.bar-explain-pattern-desc {
  font-size: 0.88rem;
  line-height: 1.45;
  color: var(--muted-2, var(--text));
}

/* Entry recommendation (simulation bar modal) */
.bar-explain-entry {
  margin-bottom: 0.75rem;
  padding: 0.6rem 0.75rem;
  border-radius: 8px;
  border-left: 4px solid;
}
.bar-explain-entry-good {
  background: rgba(38, 166, 154, 0.08);
  border-left-color: #26a69a;
}
.bar-explain-entry-caution {
  background: rgba(255, 167, 38, 0.08);
  border-left-color: #ffa726;
}
.bar-explain-entry-poor {
  background: rgba(239, 83, 80, 0.08);
  border-left-color: #ef5350;
}
.bar-explain-entry-title {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  margin-bottom: 0.25rem;
  font-weight: 600;
}
.bar-explain-entry-verdict {
  font-size: 0.95rem;
  font-weight: 700;
  margin-bottom: 0.3rem;
}
.bar-explain-entry-good .bar-explain-entry-verdict { color: #26a69a; }
.bar-explain-entry-caution .bar-explain-entry-verdict { color: #ffa726; }
.bar-explain-entry-poor .bar-explain-entry-verdict { color: #ef5350; }
.bar-explain-entry-reason {
  font-size: 0.85rem;
  line-height: 1.4;
  color: var(--muted-2, var(--text));
}

.bar-explain-section {
  margin-bottom: 0.5rem;
}
.bar-explain-section-title {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  margin-bottom: 0.4rem;
  font-weight: 600;
}
.bar-explain-insight {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 0.4rem 0.6rem;
  margin-bottom: 4px;
  background: rgba(255,255,255,0.03);
  border-left: 3px solid var(--focus-ring);
  border-radius: 0 6px 6px 0;
}
.bar-explain-insight-label {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--text);
}
.bar-explain-insight-text {
  font-size: 0.82rem;
  line-height: 1.4;
  color: var(--muted-2, var(--text));
}

.sim-replay-inline .sim-replay-bar-info {
  font-size: 0.8rem;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 200px;
}
.sim-replay-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 1rem;
  padding: 0.5rem 0.75rem;
  margin-bottom: 0.5rem;
  background: var(--surface-alt);
  border: 1px solid var(--border);
  border-radius: 8px;
}
.sim-replay-controls {
  display: flex;
  gap: 0.5rem;
}
.sim-replay-progress {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 180px;
}
.sim-replay-position {
  font-size: 0.9rem;
  white-space: nowrap;
}
.sim-replay-progress-bar {
  flex: 1;
  height: 8px;
  background: var(--border);
  border-radius: 4px;
  overflow: hidden;
}
.sim-replay-progress-fill {
  height: 100%;
  background: var(--accent, #0a7ea4);
  border-radius: 4px;
  transition: width 0.2s ease;
}
.sim-replay-speed {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}
.sim-replay-speed-label {
  font-size: 0.85rem;
  color: var(--muted);
}
.sim-replay-speed-btn {
  padding: 0.2rem 0.4rem;
  font-size: 0.8rem;
}
.sim-replay-speed-btn.active {
  background: var(--accent-bg);
  border-color: var(--accent, #0a7ea4);
  color: var(--accent, #0a7ea4);
}
.sim-replay-bar-info {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  font-size: 0.85rem;
  color: var(--muted);
}
.sim-replay-time {
  font-family: monospace;
}
.sim-replay-no-bars {
  color: var(--warn-text, #b45309);
  font-size: 0.9rem;
}

/* Chart header: market symbol (left) + range (right) */
.sim-chart-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.35rem 0.5rem 0;
  font-size: 0.8rem;
  color: var(--muted, #8a94a6);
}
.sim-chart-symbol {
  font-weight: 600;
  color: var(--text, #1a1f2e);
}
.sim-chart-range {
  font-variant-numeric: tabular-nums;
}
.sim-chart-body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.sim-chart-hover-detail {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
  padding: 0.6rem 0.75rem;
  font-size: 0.95rem;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  min-height: 2.2rem;
  border-top: 1px solid var(--border, rgba(128,128,128,0.15));
  color: var(--text, #e6edf7);
}
.sim-hover-placeholder {
  color: var(--muted, #8a94a6);
  font-style: italic;
  font-weight: 400;
}
.sim-hover-time {
  font-weight: 700;
  color: var(--text, #e6edf7);
}
.sim-hover-up { color: #26a69a; font-weight: 600; }
.sim-hover-down { color: #ef5350; font-weight: 600; }
.sim-hover-vol { color: var(--muted, #8a94a6); }
.sim-hover-bar { color: var(--muted, #8a94a6); margin-left: auto; }

/* Chart view window (Last 50 / 100 / 200 / All) */
.sim-chart-view-bar {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.4rem 0;
  margin-bottom: 0.25rem;
  font-size: 0.85rem;
}
.sim-chart-view-label {
  color: var(--muted);
  margin-right: 0.25rem;
}
.sim-chart-window-btn {
  padding: 0.2rem 0.5rem;
  font-size: 0.8rem;
}
.sim-chart-window-btn.active {
  background: var(--accent-bg);
  border-color: var(--accent, #0a7ea4);
}

/* Simulation cockpit layout */
.sim-cockpit-top {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-auto-rows: minmax(280px, auto);
  gap: 1rem;
  margin-top: 1rem;
}
.sim-cockpit-top.sim-paused { opacity: 0.7; pointer-events: none; }
@media (max-width: 900px) {
  .sim-cockpit-top { grid-template-columns: 1fr; }
}
.sim-cockpit-chart {
  min-height: 260px;
  background: var(--chart-bg, #131722);
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid var(--border);
  display: flex;
  flex-direction: column;
}
.sim-cockpit-chart-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  min-height: 260px;
  padding: 1rem;
  color: var(--muted);
  font-size: 0.9rem;
  text-align: center;
}
.sim-cockpit-order {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  min-width: 0;
  min-height: 260px;
}
.sim-cockpit-order .order-entry { flex-shrink: 0; }
.order-entry-risk-calc { font-size: 0.85rem; margin: 0.4rem 0; color: var(--muted-2); }
.order-entry-risk-calc .order-entry-risk-value { font-weight: 600; color: var(--text); }

/* 3-panel trading terminal layout */
.sim-cockpit-terminal {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-auto-rows: minmax(280px, auto);
  gap: 1rem;
  margin-top: 1rem;
}
@media (min-width: 1400px) {
  .sim-cockpit-terminal {
    grid-template-columns: 55fr 20fr 25fr;
  }
}
@media (max-width: 1399px) and (min-width: 901px) {
  .sim-cockpit-terminal {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
  }
  .sim-cockpit-terminal .sim-cockpit-chart { grid-column: 1; }
  .sim-cockpit-terminal .sim-cockpit-order,
  .sim-cockpit-terminal .sim-cockpit-intel {
    display: inline-flex;
    flex: 1;
    min-width: 0;
  }
  .sim-cockpit-terminal .sim-cockpit-order-intel-wrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    grid-column: 1;
  }
}
@media (max-width: 900px) {
  .sim-cockpit-terminal { grid-template-columns: 1fr; }
}

.sim-cockpit-intel {
  min-height: 260px;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  overflow: hidden;
}

/* Mission bar (above cockpit when a mission is active) */
.sim-mission-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem 1rem;
  padding: 0.6rem 1rem;
  background: var(--glass-bg);
  backdrop-filter: blur(var(--glass-blur));
  -webkit-backdrop-filter: blur(var(--glass-blur));
  border: 1px solid var(--glass-border);
  border-radius: 8px;
  margin-bottom: 0.75rem;
  font-size: 0.9rem;
}
.sim-mission-bar-title { font-weight: 600; color: var(--text); }
.sim-mission-bar-objective { color: var(--muted-2); }
.sim-mission-bar-step { font-size: 0.8rem; color: var(--muted); }
.sim-mission-bar-actions { display: flex; gap: 0.5rem; margin-left: auto; }

/* Intelligence panel cards (glassmorphism) */
.intel-card {
  background: var(--intel-card-bg);
  backdrop-filter: blur(var(--glass-blur));
  -webkit-backdrop-filter: blur(var(--glass-blur));
  border: 1px solid var(--glass-border);
  border-radius: 8px;
  padding: 0.6rem 0.75rem;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.intel-card:hover { border-color: var(--border-strong); box-shadow: 0 0 0 1px var(--panel-glow); }
.intel-card-header {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  margin-bottom: 0.4rem;
}
.intel-news-item { font-size: 0.85rem; padding: 0.35rem 0; border-bottom: 1px solid var(--border); }
.intel-news-item:last-child { border-bottom: none; }
.intel-clickable { cursor: pointer; transition: background 0.15s ease, color 0.15s ease; }
.intel-clickable:hover { background: var(--surface-hover, rgba(255,255,255,0.06)); }
.intel-clickable:focus { outline: 1px solid var(--accent); outline-offset: 2px; }
.intel-sentiment-badge { display: inline-block; padding: 2px 6px; border-radius: 4px; font-size: 0.75rem; }
.intel-sentiment-bullish { background: rgba(34, 197, 94, 0.2); color: var(--signal-buy); }
.intel-sentiment-bearish { background: rgba(239, 68, 68, 0.2); color: var(--signal-sell); }
.intel-detail-modal-backdrop { z-index: 1600; }
.intel-detail-modal-backdrop .intel-detail-modal { max-width: 560px; }
.intel-detail-modal-backdrop .intel-detail-body { padding: 12px 16px; max-height: 70vh; overflow-y: auto; }
.intel-detail-modal-backdrop .intel-detail-title { font-weight: 600; margin-bottom: 0.5rem; }
.intel-detail-modal-backdrop .intel-detail-content { white-space: pre-wrap; word-break: break-word; line-height: 1.4; }
.intel-detail-modal-backdrop .intel-detail-extra { margin-top: 1rem; font-size: 0.875rem; }
.intel-detail-modal-backdrop .intel-detail-extra .sim-details-table .sim-details-key { color: var(--muted); padding-right: 0.5rem; }
.intel-sentiment-neutral { background: rgba(156, 163, 175, 0.2); color: var(--muted); }
.intel-signal { display: flex; align-items: center; gap: 0.5rem; padding: 0.4rem 0; font-size: 0.85rem; }
.intel-signal-long { border-left: 3px solid var(--signal-buy); padding-left: 0.5rem; }
.intel-signal-short { border-left: 3px solid var(--signal-sell); padding-left: 0.5rem; }
.intel-signal-confidence { width: 60px; height: 6px; background: var(--border); border-radius: 3px; overflow: hidden; }
.intel-signal-confidence-fill { height: 100%; border-radius: 3px; transition: width 0.2s; }
.intel-signal-confidence-fill.long { background: var(--signal-buy); }
.intel-signal-confidence-fill.short { background: var(--signal-sell); }

/* Outcome comparison drawer */
.sim-outcome-drawer {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  max-height: 45vh;
  background: var(--surface);
  border-top: 1px solid var(--border);
  border-radius: 12px 12px 0 0;
  box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.15);
  z-index: 1000;
  transform: translateY(100%);
  transition: transform 0.25s ease, opacity 0.25s ease;
  opacity: 0;
  overflow: auto;
}
.sim-outcome-drawer.is-open {
  transform: translateY(0);
  opacity: 1;
}
.sim-outcome-drawer-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.sim-outcome-drawer-body { padding: 1rem; }
.sim-outcome-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
.sim-outcome-card-combine { border-left: 4px solid #2563eb; }
.sim-outcome-card-sandbox { border-left: 4px solid #059669; }
.sim-outcome-card h4 { margin: 0 0 0.5rem; font-size: 0.95rem; }
.sim-outcome-row { display: flex; justify-content: space-between; font-size: 0.9rem; padding: 0.35rem 0; }
.sim-outcome-violation { color: var(--signal-caution); font-size: 0.85rem; }

/* Mission library modal */
.mission-library-modal {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: 2000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s, visibility 0.2s;
}
.mission-library-modal.is-open { opacity: 1; visibility: visible; }
.mission-library-dialog {
  background: var(--surface);
  border-radius: 12px;
  border: 1px solid var(--border);
  box-shadow: 0 12px 48px rgba(0, 0, 0, 0.3);
  max-width: 900px;
  width: 100%;
  max-height: 90vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.mission-library-header { padding: 1rem 1.25rem; border-bottom: 1px solid var(--border); display: flex; justify-content: space-between; align-items: center; }
.mission-library-filters { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-top: 0.5rem; }
.mission-library-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; padding: 1rem 1.25rem; overflow: auto; }
.mission-card {
  background: var(--surface-alt);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 1rem;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.mission-card:hover { border-color: var(--border-strong); box-shadow: 0 4px 12px rgba(0,0,0,0.08); }
.mission-card-title { margin: 0 0 0.35rem; font-size: 1rem; font-weight: 600; }
.mission-card-meta { font-size: 0.8rem; color: var(--muted); margin-bottom: 0.5rem; }
.mission-card-lesson { font-size: 0.85rem; color: var(--muted-2); margin-bottom: 0.75rem; }
.mission-difficulty-badge { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 0.75rem; }
.mission-difficulty-beginner { background: rgba(34, 197, 94, 0.2); color: var(--signal-buy); }
.mission-difficulty-intermediate { background: rgba(245, 158, 11, 0.2); color: var(--signal-caution); }
.mission-difficulty-advanced { background: rgba(239, 68, 68, 0.2); color: var(--signal-sell); }

.sim-risk-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  font-size: 0.85rem;
  padding: 0.5rem 0;
}
.sim-risk-strip .positive { color: var(--success, #22c55e); }
.sim-risk-strip .negative { color: var(--danger, #ef4444); }
.sim-positions-above-chart {
  margin-bottom: 0.5rem;
}
.sim-positions-header {
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
}
.sim-positions-header h4 { margin: 0 0 0.25rem; font-size: 0.95rem; font-weight: 600; }
.sim-positions-hint { font-size: 0.75rem; white-space: nowrap; }
.sim-pos-sl-tp { font-size: 0.75rem; color: var(--muted); white-space: nowrap; }
.sim-monitoring {
  margin-top: 1rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.sim-monitoring h4 { margin: 0 0 0.5rem; font-size: 0.95rem; font-weight: 600; }
.sim-monitoring .sim-table-caption { margin: -0.25rem 0 0.5rem; font-size: 0.8rem; line-height: 1.3; max-width: 52ch; }

/* Automation Queue: cron job styling */
.cron-status-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.8rem;
  font-weight: 500;
}
.cron-status-badge.cron-enabled { background: rgba(16, 185, 129, 0.15); color: #059669; }
.cron-status-badge.cron-disabled { background: rgba(239, 68, 68, 0.12); color: #dc2626; }
.cron-status-badge.cron-state-running { background: rgba(59, 130, 246, 0.15); color: #2563eb; }
.cron-status-badge.cron-state-completed { background: rgba(16, 185, 129, 0.15); color: #059669; }
.cron-status-badge.cron-state-failed { background: rgba(239, 68, 68, 0.12); color: #dc2626; }
.cron-status-badge.cron-state-queued { background: rgba(245, 158, 11, 0.15); color: #d97706; }
.cron-status-badge.cron-state-scheduled { background: rgba(139, 92, 246, 0.12); color: #7c3aed; }
.cron-status-badge.cron-state-paused { background: rgba(107, 114, 128, 0.15); color: #6b7280; }
.cron-last-run { font-size: 0.75rem; color: var(--muted); margin-left: 6px; }
tr.cron-disabled td { opacity: 0.55; }
.cron-actions { white-space: nowrap; }
.cron-group-count { font-size: 0.75rem; padding: 1px 6px; border-radius: 999px; background: var(--surface-alt); border: 1px solid var(--border); color: var(--muted); vertical-align: middle; margin-left: 4px; }
.cron-table { width: 100%; table-layout: auto; font-size: 0.9rem; }
.cron-table th, .cron-table td { padding: 0.5rem 0.6rem; }
.cron-table th:last-child, .cron-table td:last-child { text-align: right; }
.cron-actions .btn-sm, .btn.btn-sm {
  padding: 3px 8px;
  font-size: 0.8rem;
  border-radius: 4px;
  border: 1px solid var(--border);
  background: var(--surface-alt);
  cursor: pointer;
}
.btn.primary.btn-sm {
  background: var(--focus-ring);
  border-color: var(--focus-ring);
  color: #fff;
}
.btn.primary.btn-sm:hover:not(:disabled) {
  background: #3a7eb8;
  border-color: #3a7eb8;
  color: #fff;
}
.cron-actions .btn-sm:hover, .btn.btn-sm:hover { border-color: var(--focus-ring); color: var(--focus-ring); }
.cron-delete-btn:hover, .cron-batch-delete-btn:hover { border-color: #dc2626 !important; color: #dc2626 !important; }
.cron-edit-modal { position: fixed; inset: 0; background: rgba(0,0,0,0.4); z-index: 2000; display: flex; align-items: center; justify-content: center; }
.cron-edit-modal .modal-dialog { background: var(--surface); border-radius: 12px; border: 1px solid var(--border); box-shadow: 0 8px 24px rgba(0,0,0,0.2); }
.cron-edit-modal .modal-header { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1rem; border-bottom: 1px solid var(--border); }
.cron-edit-modal .modal-close { background: none; border: none; font-size: 1.25rem; cursor: pointer; color: var(--muted); }
.cron-add-modal { position: fixed; inset: 0; background: rgba(0,0,0,0.4); z-index: 2000; display: flex; align-items: center; justify-content: center; }
.cron-add-modal .modal-dialog { background: var(--surface); border-radius: 12px; border: 1px solid var(--border); box-shadow: 0 8px 24px rgba(0,0,0,0.2); }
.cron-add-modal .modal-header { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1rem; border-bottom: 1px solid var(--border); }
.cron-add-modal .modal-close { background: none; border: none; font-size: 1.25rem; cursor: pointer; color: var(--muted); }
.cron-field { display: block; margin: 8px 0; }
.cron-field input, .cron-field select, .cron-field textarea { width: 100%; padding: 6px 8px; border: 1px solid var(--border); border-radius: 4px; margin-top: 2px; font-size: 0.9rem; background: var(--surface); color: var(--text); }
.cron-field input[type="number"] { width: 100px; }
.cron-field input[type="datetime-local"] { width: auto; min-width: 220px; }
.cron-presets .cron-preset { font-size: 0.75rem; padding: 2px 7px; }

/* Automation Queue: category grouping and collapsible sections */
.cron-category-header { cursor: pointer; user-select: none; font-weight: 600; }
.cron-category-header:hover { background: var(--surface-alt); }
.cron-category-header td { padding: 0.5rem 0.6rem; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.cron-table .cron-category-header td,
.cron-table .cron-instance-group-row td { text-align: left !important; }
.cron-chevron { display: inline-block; margin-right: 6px; transition: transform 0.2s ease; }
.cron-category-section.collapsed .cron-chevron { transform: rotate(-90deg); }
.cron-category-header.collapsed .cron-chevron { transform: rotate(-90deg); }
.cron-chevron::before { content: "\25BC"; font-size: 0.65rem; vertical-align: middle; }
.cron-chevron-inner::before { content: "\25B6"; }
.cron-instance-group-row .cron-chevron-inner { margin-right: 4px; }
.cron-category-section.collapsed .cron-chevron-inner { transform: rotate(-90deg); }
.cron-instance-group-row.collapsed .cron-chevron-inner { transform: rotate(-90deg); }
.cron-category-badge { padding: 2px 8px; border-radius: 4px; font-size: 0.8rem; }
.cron-category-cat-futures .cron-category-badge, .cron-category-badge.cron-category-cat-futures { background: rgba(66, 165, 245, 0.2); color: #42a5f5; }
.cron-category-cat-real-estate .cron-category-badge, .cron-category-badge.cron-category-cat-real-estate { background: rgba(76, 175, 80, 0.2); color: #4caf50; }
.cron-category-cat-household .cron-category-badge, .cron-category-badge.cron-category-cat-household { background: rgba(255, 193, 7, 0.2); color: #e6a800; }
.cron-category-cat-system .cron-category-badge, .cron-category-badge.cron-category-cat-system { background: rgba(158, 158, 158, 0.25); color: #9e9e9e; }
.cron-category-cat-general .cron-category-badge, .cron-category-badge.cron-category-cat-general { background: rgba(149, 117, 205, 0.2); color: #9375cd; }
.cron-category-meta { font-weight: normal; color: var(--muted); font-size: 0.85rem; margin-left: 6px; }
.cron-category-section.collapsed tr:not(:first-child) { display: none; }
.cron-category-section.collapsed tr.cron-category-header td { border-bottom: none; }
.cron-instance-group-row { cursor: pointer; user-select: none; }
.cron-instance-group-row:hover { background: var(--surface-alt); }
.cron-instance-group-row td { padding: 0.4rem 0.6rem; }
.cron-instance-row-hidden { display: none !important; }
.cron-category-block { margin-bottom: 8px; }
.cron-category-header-cards { padding: 0.5rem 0.75rem; border-radius: 6px; border: 1px solid var(--border); margin-bottom: 0; }
.cron-category-header-cards:hover { background: var(--surface-alt); }
.cron-category-section-cards { margin-top: 6px; }
.cron-category-section-cards.collapsed { display: none; }
.cron-cards-wrap .cron-category-section-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 0.75rem; }
.cron-cards-wrap .cron-category-section-cards.collapsed { display: none; }

/* Schedule builder */
.sched-builder { margin: 8px 0; }
.sched-row { display: flex; align-items: center; gap: 8px; margin: 8px 0; flex-wrap: wrap; }
.sched-label { font-weight: 500; font-size: 0.85rem; min-width: 80px; color: var(--muted-2); }
.sched-freq { padding: 5px 8px; border: 1px solid var(--border); border-radius: 4px; font-size: 0.9rem; background: var(--surface); color: var(--text); }
.sched-hour, .sched-min { padding: 5px 6px; border: 1px solid var(--border); border-radius: 4px; font-size: 0.9rem; background: var(--surface); color: var(--text); }
.sched-toggle-group { display: flex; flex-wrap: wrap; gap: 3px; }
.sched-toggle-group button, .sched-toggle-grid button {
  padding: 4px 8px; font-size: 0.8rem; border: 1px solid var(--border); border-radius: 4px;
  background: var(--surface); color: var(--text); cursor: pointer; transition: background 0.15s, border-color 0.15s;
}
.sched-toggle-group button.active, .sched-toggle-grid button.active {
  background: var(--focus-ring); color: var(--surface); border-color: var(--focus-ring);
}
.sched-toggle-group button:hover, .sched-toggle-grid button:hover { border-color: var(--focus-ring); }
.sched-toggle-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; margin: 4px 0 8px; }
.sched-toggle-grid button { padding: 5px 2px; font-size: 0.78rem; text-align: center; }
.sched-preview { margin-top: 12px; padding-top: 8px; border-top: 1px solid var(--border); }
.sched-expr-preview { font-size: 0.85rem; padding: 3px 8px; background: var(--surface-alt); border-radius: 4px; }
.sched-advanced { margin-top: 6px; font-size: 0.82rem; color: var(--muted); }
.sched-advanced summary { cursor: pointer; }
.sched-interval { padding: 5px 6px; border: 1px solid var(--border); border-radius: 4px; font-size: 0.9rem; background: var(--surface); color: var(--text); }

/* Simulation Wizard — tutorial overlay */
.sim-wizard-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1500;
  pointer-events: none;
}
.sim-wizard-backdrop > * { pointer-events: auto; }
.sim-wizard-spotlight-frame {
  position: fixed;
  inset: 0;
  pointer-events: auto;
}
.sim-wizard-spotlight-frame.is-hidden { display: none; }
.sim-wizard-spotlight-frame .sim-wizard-panel {
  position: absolute;
  background: rgba(0, 0, 0, 0.65);
  pointer-events: auto;
}
.sim-wizard-spotlight-frame .sim-wizard-panel-full {
  inset: 0;
  width: auto;
  height: auto;
}
.sim-wizard-card {
  position: fixed;
  padding: 1rem 1.25rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4);
  max-width: 420px;
  z-index: 1501;
}
.sim-wizard-card.sim-wizard-card-centered {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  right: auto;
  bottom: auto;
}
.sim-wizard-title {
  margin: 0 0 0.75rem;
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--text);
}
.sim-wizard-content {
  font-size: 0.95rem;
  line-height: 1.5;
  color: var(--text);
  margin-bottom: 1rem;
}
.sim-wizard-content p { margin: 0.5rem 0; }
.sim-wizard-content p:first-child { margin-top: 0; }
.sim-wizard-content p:last-child { margin-bottom: 0; }
.sim-wizard-content strong { color: var(--muted-2); }
.sim-wizard-progress {
  display: flex;
  gap: 6px;
  margin-bottom: 0.75rem;
  flex-wrap: wrap;
}
.sim-wizard-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--border);
  transition: background 0.2s;
}
.sim-wizard-dot.active { background: var(--focus-ring); }
.sim-wizard-footer {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding-top: 0.5rem;
  border-top: 1px solid var(--border);
}
.sim-wizard-dismiss-label {
  font-size: 0.85rem;
  color: var(--muted);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}
.sim-wizard-dismiss-checkbox {
  cursor: pointer;
}
.sim-wizard-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.sim-wizard-nav {
  display: flex;
  gap: 0.5rem;
}
.sim-wizard-nav button { min-width: 72px; }
.sim-wizard-highlight {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
  position: relative;
  z-index: 1;
}
@media (max-width: 560px) {
  .sim-wizard-card {
    left: 12px !important;
    right: 12px !important;
    bottom: 12px !important;
    top: auto !important;
    max-width: none;
  }
}

/* Mission Wizard — per-mission guided overlay */
.mission-wizard-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1500;
  pointer-events: none;
}
.mission-wizard-backdrop > * { pointer-events: auto; }
.mission-wizard-spotlight-frame {
  position: fixed;
  inset: 0;
  pointer-events: none !important;
}
.mission-wizard-spotlight-frame.is-hidden { display: none; }
.mission-wizard-spotlight-frame .mission-wizard-panel {
  position: absolute;
  background: rgba(0, 0, 0, 0.55);
  backdrop-filter: blur(3px);
  pointer-events: auto;
}
.mission-wizard-spotlight-frame.mission-wizard-spotlight-chart-focus .mission-wizard-panel {
  backdrop-filter: none;
}
.mission-wizard-spotlight-frame .mission-wizard-panel.mission-wizard-briefing-dim {
  background: rgba(0, 0, 0, 0.25);
  backdrop-filter: blur(2px);
}
.mission-wizard-panel-full { inset: 0; width: auto; height: auto; }
.mission-wizard-card {
  position: fixed;
  top: 24px;
  left: 50%;
  transform: translateX(-50%);
  padding: 1rem 1.25rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4);
  max-width: 420px;
  max-height: calc(100vh - 48px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  z-index: 1501;
}
.mission-wizard-card.mission-wizard-card-centered {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  right: auto;
  bottom: auto;
  max-height: calc(100vh - 2rem);
}
.mission-wizard-card.mission-wizard-card-top {
  top: 24px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  right: auto !important;
  bottom: auto !important;
  max-height: calc(100vh - 48px) !important;
}
.mission-wizard-briefing-step .mission-wizard-card {
  max-width: 520px;
  padding: 1.25rem 1.5rem;
}
.mission-wizard-phase-bar {
  font-size: 0.8rem;
  color: var(--focus-ring);
  margin-bottom: 0.5rem;
  font-weight: 600;
  flex-shrink: 0;
}
.mission-wizard-progress {
  display: flex;
  gap: 6px;
  margin-bottom: 0.75rem;
  flex-wrap: wrap;
  flex-shrink: 0;
}
.mission-wizard-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--border);
  transition: background 0.2s;
}
.mission-wizard-dot.active { background: var(--focus-ring); }
.mission-wizard-title {
  margin: 0 0 0.75rem;
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--text);
  flex-shrink: 0;
}
.mission-wizard-scroll {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.mission-wizard-content {
  font-size: 0.95rem;
  line-height: 1.5;
  color: var(--text);
  margin-bottom: 0.75rem;
}
.mission-wizard-body { margin-bottom: 0.5rem; }
.mission-wizard-overview {
  padding: 0.75rem;
  margin-bottom: 0.75rem;
  background: var(--accent-bg, rgba(30, 58, 95, 0.35));
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 0.9rem;
}
.mission-wizard-overview-lead {
  margin: 0 0 0.5rem 0;
  color: var(--text);
  line-height: 1.4;
}
.mission-wizard-overview-learn,
.mission-wizard-overview-steps {
  margin-top: 0.5rem;
  color: var(--text);
}
.mission-wizard-overview-learn ul,
.mission-wizard-overview-list {
  margin: 0.2rem 0 0 1.25rem;
  padding: 0;
}
.mission-wizard-overview-list {
  list-style: decimal;
}
.mission-wizard-overview-learn li,
.mission-wizard-overview-list li {
  margin-bottom: 0.15rem;
}
.mission-wizard-briefing-chart-lines {
  margin-top: 0.75rem;
  padding: 0.5rem 0.75rem;
  background: var(--chart-bg, rgba(19, 23, 34, 0.4));
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 0.9rem;
}
.mission-wizard-briefing-chart-lines-list {
  margin: 0.35rem 0 0 0;
  padding-left: 1.25rem;
  list-style: none;
}
.mission-wizard-briefing-chart-lines-list li {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  margin-bottom: 0.25rem;
}
.mission-wizard-briefing-swatch {
  display: inline-block;
  width: 14px;
  height: 4px;
  border-radius: 2px;
  flex-shrink: 0;
}
.mission-wizard-briefing-color-name {
  color: var(--muted, #8a94a6);
  font-size: 0.85em;
}
.mission-wizard-chart-legend {
  margin-top: 0.75rem;
  padding: 0.6rem 0.75rem;
  background: var(--chart-bg, rgba(19, 23, 34, 0.5));
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 0.9rem;
}
.mission-wizard-chart-legend strong {
  display: block;
  margin-bottom: 0.35rem;
  color: var(--text);
}
.mission-wizard-chart-legend-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1rem;
  align-items: center;
}
.mission-wizard-chart-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}
.mission-wizard-legend-swatch {
  flex-shrink: 0;
  display: block;
}
.mission-wizard-legend-label {
  color: var(--text);
  white-space: nowrap;
}
.mission-wizard-chart-legend-item.mission-wizard-legend-item-mini {
  flex-direction: column;
  gap: 0.2rem;
  align-items: flex-start;
}
.mission-wizard-chart-legend-item.mission-wizard-legend-item-mini .mission-wizard-mini-pattern {
  display: block;
  flex-shrink: 0;
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.2);
}
.mission-wizard-seek-wrap { margin-top: 0.75rem; }
.mission-wizard-concepts {
  font-size: 0.9rem;
  color: var(--muted-2);
  margin-bottom: 0.5rem;
}
.mission-wizard-historical,
.mission-wizard-key-data {
  font-size: 0.9rem;
  color: var(--muted-2);
  margin-top: 0.75rem;
}
.mission-wizard-key-data ul { margin: 0.25rem 0 0 1rem; padding: 0; }
.mission-wizard-meta {
  font-size: 0.8rem;
  color: var(--muted);
  margin-top: 0.5rem;
}
.mission-wizard-instructor-note {
  padding: 0.6rem 0.75rem;
  background: var(--warn-bg);
  border: 1px solid var(--warn-border);
  border-radius: 8px;
  font-size: 0.85rem;
  color: var(--warn-text);
  margin-bottom: 0.75rem;
}
.mission-wizard-footer {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
  padding-top: 0.5rem;
  border-top: 1px solid var(--border);
  flex-shrink: 0;
}
.mission-wizard-actions { display: flex; gap: 0.5rem; align-items: center; }
.mission-wizard-highlight {
  position: relative;
  z-index: 1502;
  outline: 2px solid rgba(86, 182, 255, 0.9);
  outline-offset: 3px;
  box-shadow: 0 0 0 4px rgba(86, 182, 255, 0.25), 0 0 20px rgba(86, 182, 255, 0.3), 0 0 40px rgba(86, 182, 255, 0.1);
  border-radius: 6px;
  pointer-events: auto !important;
  cursor: pointer;
  animation: mw-highlight-pulse 2s ease-in-out infinite;
}
@keyframes mw-highlight-pulse {
  0%, 100% { box-shadow: 0 0 0 4px rgba(86, 182, 255, 0.25), 0 0 20px rgba(86, 182, 255, 0.3), 0 0 40px rgba(86, 182, 255, 0.1); }
  50% { box-shadow: 0 0 0 6px rgba(86, 182, 255, 0.35), 0 0 28px rgba(86, 182, 255, 0.45), 0 0 50px rgba(86, 182, 255, 0.15); }
}
.mission-wizard-highlight * {
  pointer-events: auto !important;
}
.mission-wizard-dot.done { background: var(--focus-ring); opacity: 0.5; }

/* Mission Wizard — intel panel knowledge highlighting */
.intel-card-dimmed {
  opacity: 0.35;
  filter: blur(1px);
  transition: opacity 0.3s, filter 0.3s;
}
.intel-card-highlighted {
  outline: 2px solid rgba(86, 182, 255, 0.7);
  outline-offset: 2px;
  border-radius: 8px;
  animation: mw-highlight-pulse 2s ease-in-out infinite;
}

/* Mission Wizard — floating hint bar (interactive phases) */
.mission-wizard-hint-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1500;
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.65rem 1.25rem;
  background: var(--surface);
  border-top: 2px solid var(--focus-ring);
  box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.35);
  animation: mw-hint-slide-up 0.25s ease-out;
}
@keyframes mw-hint-slide-up {
  from { transform: translateY(100%); opacity: 0; }
  to   { transform: translateY(0); opacity: 1; }
}
.mw-hint-left {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex-shrink: 0;
}
.mw-hint-phase {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--focus-ring);
  font-weight: 600;
}
.mw-hint-title {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text);
  white-space: nowrap;
}
.mw-hint-center {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.mw-hint-action {
  font-size: 0.9rem;
  color: var(--text);
}
.mw-hint-note {
  font-size: 0.8rem;
  color: var(--warn-text);
  background: var(--warn-bg);
  padding: 2px 6px;
  border-radius: 4px;
  display: inline-block;
}
.mw-hint-right {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  flex-shrink: 0;
}
.btn-sm {
  padding: 0.3rem 0.65rem;
  font-size: 0.8rem;
}

/* Mission Debrief — post-mission overlay */
.mission-debrief-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1600;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.mission-debrief-wrap {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.4);
  max-width: 480px;
  width: 100%;
  max-height: 90vh;
  overflow: auto;
}
.mission-debrief {
  padding: 1.25rem 1.5rem;
}
.mission-debrief-title {
  margin: 0 0 1rem;
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--text);
}
.mission-debrief-section {
  margin-bottom: 1rem;
}
.mission-debrief-section h3 {
  margin: 0 0 0.35rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--muted-2);
}
.mission-debrief-stats {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  font-size: 0.9rem;
  color: var(--text);
}
.mission-debrief-grade {
  display: inline-block;
  margin-top: 0.5rem;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 0.9rem;
  font-weight: 600;
}
.mission-debrief-grade-a { background: rgba(34, 197, 94, 0.2); color: var(--signal-buy); }
.mission-debrief-grade-b { background: rgba(86, 182, 255, 0.2); color: var(--focus-ring); }
.mission-debrief-grade-c { background: rgba(245, 158, 11, 0.2); color: var(--signal-caution); }
.mission-debrief-grade-d,
.mission-debrief-grade-f { background: rgba(239, 68, 68, 0.2); color: var(--signal-sell); }
.mission-debrief-narrative,
.mission-debrief-lesson {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.5;
  color: var(--text);
}
.mission-debrief-concepts {
  list-style: none;
  margin: 0;
  padding: 0;
}
.mission-debrief-concepts li { margin-bottom: 0.35rem; font-size: 0.9rem; }
.mission-debrief-check { color: var(--signal-buy); margin-right: 0.35rem; }
.mission-debrief-next { font-size: 0.95rem; margin-bottom: 0.5rem; }
.mission-debrief-next-link {
  color: var(--focus-ring);
  text-decoration: underline;
  cursor: pointer;
}
.mission-debrief-next-order { font-size: 0.8rem; color: var(--muted); margin-left: 0.35rem; }
.mission-debrief-actions { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--border); }

/* Mission Library — curriculum and progress */
.mission-library-progress {
  padding: 0.5rem 1.25rem;
  font-size: 0.9rem;
  color: var(--muted);
  border-bottom: 1px solid var(--border);
}
.mission-progress-summary { font-weight: 500; }
.mission-library-grid .mission-library-module {
  grid-column: 1 / -1;
}
.mission-library-module {
  margin-bottom: 1.5rem;
}
.mission-library-module-title {
  margin: 0 0 0.75rem;
  font-size: 1rem;
  font-weight: 600;
  color: var(--muted-2);
  padding-bottom: 0.35rem;
  border-bottom: 1px solid var(--border);
}
.mission-library-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 1rem;
}
.mission-card-header {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: center;
  margin-bottom: 0.5rem;
}
.mission-curriculum-order {
  font-size: 0.75rem;
  color: var(--muted);
  background: var(--surface-alt);
  padding: 2px 6px;
  border-radius: 4px;
}
.mission-module-badge {
  font-size: 0.7rem;
  color: var(--focus-ring);
  text-transform: uppercase;
  letter-spacing: 0.02em;
}
.mission-signal-badge {
  font-size: 0.65rem;
  color: var(--muted);
  background: var(--surface-alt);
  padding: 2px 5px;
  border-radius: 3px;
}
.mission-completed-badge {
  font-size: 0.75rem;
  color: var(--signal-buy);
  margin-left: auto;
}

/* Chart callouts (mission wizard annotations) */
.cs-callouts-annotations .cs-callout-annotation circle { cursor: default; }
.cs-callouts-annotations .cs-callout-annotation text { pointer-events: none; }

/* Chart teaching overlays: signal spotlight, prediction band, insight callout */
.cs-overlay-group { pointer-events: none; }
.cs-callout-zone { pointer-events: none; }
.cs-callout-zone-label { pointer-events: none; }
.cs-volume-refs { pointer-events: none; }
.cs-signal-spotlight { pointer-events: none; }
.cs-prediction-band { pointer-events: none; }
.cs-prediction-band-tp { }
.cs-prediction-band-sl { }
.cs-insight-callout { pointer-events: none; }
.cs-insight-title { font-family: var(--font-sans, system-ui, sans-serif); pointer-events: none; }
.cs-insight-body { font-family: var(--font-sans, system-ui, sans-serif); pointer-events: none; }

/* Signal Academy — Education tab */
.signal-academy {
  width: 100%;
  max-width: 56rem;
  padding: 0.5rem 0;
}
.signal-academy-header {
  margin-bottom: 1.5rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--border);
}
.signal-academy-header h2 {
  margin: 0 0 0.35rem;
  font-size: 1.35rem;
  font-weight: 600;
}
.signal-academy-subtitle {
  margin: 0;
  font-size: 0.95rem;
  color: var(--muted);
  line-height: 1.45;
}
.signal-academy-section {
  margin-bottom: 1.5rem;
}
.signal-academy-section h3 {
  margin: 0 0 0.75rem;
  font-size: 1.1rem;
  font-weight: 600;
}
.signal-academy-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
  gap: 1rem;
}
.signal-academy-card {
  background: var(--surface-alt);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 1rem 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.signal-academy-card-title {
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
}
.signal-academy-card-body {
  flex: 1;
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--muted);
}
.signal-academy-card-body p { margin: 0 0 0.5rem; }
.signal-academy-card-body p:last-child { margin-bottom: 0; }
.signal-academy-card-actions { margin-top: 0.25rem; }
.signal-academy-example {
  font-size: 0.85rem;
  color: var(--accent);
}
.signal-academy-concepts {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.signal-academy-concept {
  background: var(--surface-alt);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 1rem 1.25rem;
}
.signal-academy-concept h4 {
  margin: 0 0 0.35rem;
  font-size: 0.95rem;
  font-weight: 600;
}
.signal-academy-concept p {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.45;
  color: var(--muted);
}
.signal-academy-knowledge {
  padding: 1rem 0;
}
.signal-academy-knowledge ul {
  margin: 0 0 0.5rem;
  padding-left: 1.25rem;
}
.signal-academy-knowledge p {
  margin: 0.35rem 0;
  font-size: 0.9rem;
  color: var(--muted);
}
.signal-academy-kb-summary {
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--muted);
}

/* Session create modal */
.sim-create-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
}
.sim-create-modal {
  background: var(--surface);
  border-radius: 12px;
  border: 1px solid var(--border);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
  padding: 1.25rem;
  max-width: 480px;
  width: calc(100% - 32px);
  max-height: 90vh;
  overflow-y: auto;
}
.sim-create-modal h2 {
  margin: 0 0 1rem;
  font-size: 1.2rem;
}
.sim-create-form fieldset {
  margin: 0 0 1rem;
  padding: 0;
  border: none;
}
.sim-create-form legend {
  font-weight: 600;
  font-size: 0.9rem;
  margin-bottom: 0.5rem;
  display: block;
}
.sim-create-form label {
  display: block;
  margin: 0.5rem 0;
  font-size: 0.9rem;
}
.sim-create-form label:has(input[type="radio"]) {
  display: inline-block;
  margin-right: 1rem;
}
.sim-create-form input[type="text"],
.sim-create-form input[type="date"],
.sim-create-form select {
  margin-left: 0.5rem;
  padding: 6px 8px;
  border: 1px solid var(--border);
  border-radius: 4px;
  font-size: 0.9rem;
  background: var(--surface);
  color: var(--text);
}
.sim-create-form select { min-width: 140px; }
.sim-create-hint {
  margin: 0.5rem 0 0;
  font-size: 0.85rem;
  color: var(--muted);
}
.sim-create-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--border);
}

/* Session end modal */
.sim-end-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
}
.sim-end-modal-wrap .sim-end-modal {
  background: var(--surface);
  border-radius: 12px;
  border: 1px solid var(--border);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
  padding: 1.25rem;
  max-width: 480px;
  width: calc(100% - 32px);
}
.sim-end-modal h2 {
  margin: 0 0 1rem;
  font-size: 1.2rem;
}
.sim-end-confirm {
  margin: 0 0 1rem;
  font-size: 0.95rem;
}
.sim-end-summary {
  margin-bottom: 1rem;
}
.sim-end-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  margin-bottom: 0.75rem;
  font-size: 0.9rem;
}
.sim-end-outcome {
  padding: 0.5rem 0.75rem;
  border-radius: 6px;
  font-weight: 600;
  margin-bottom: 0.75rem;
}
.sim-outcome-passed { background: rgba(34, 197, 94, 0.2); color: var(--success, #22c55e); }
.sim-outcome-failed { background: rgba(239, 68, 68, 0.2); color: var(--danger, #ef4444); }
.sim-outcome-progress { background: rgba(59, 130, 246, 0.2); color: var(--accent, #0a7ea4); }
.sim-end-journal-prompt {
  font-size: 0.9rem;
  color: var(--muted);
  margin: 0;
}
.sim-end-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
  padding-top: 1rem;
  border-top: 1px solid var(--border);
}

/* Session history */
.sim-session-history {
  margin-top: 1.5rem;
}
.sim-session-history h4 {
  margin: 0 0 0.75rem;
  font-size: 1rem;
}
.sim-session-row {
  cursor: pointer;
}
.sim-session-row:hover {
  background: var(--surface-hover, rgba(0,0,0,0.04));
}
.sim-session-actions-cell {
  white-space: nowrap;
}
.sim-session-actions-cell .btn-sm {
  margin-right: 0.35rem;
}
.sim-session-actions-cell .btn-sm:last-child {
  margin-right: 0;
}
.sim-status-badge {
  padding: 0.2rem 0.5rem;
  font-size: 0.75rem;
  font-weight: 600;
  border-radius: 4px;
}
.sim-status-active { background: rgba(59, 130, 246, 0.2); color: var(--accent, #0a7ea4); }
.sim-status-completed { background: rgba(34, 197, 94, 0.2); color: var(--success, #22c55e); }
.sim-status-failed { background: rgba(239, 68, 68, 0.2); color: var(--danger, #ef4444); }
.sim-status-paused { background: rgba(234, 179, 8, 0.2); color: var(--warn, #eab308); }

/* Session detail overlay */
.sim-detail-overlay-backdrop {
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
}
.sim-detail-overlay {
  background: var(--surface);
  border-radius: 12px;
  border: 1px solid var(--border);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
  max-width: 600px;
  width: calc(100% - 32px);
  max-height: 90vh;
  overflow-y: auto;
}
.sim-detail-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--border);
}
.sim-detail-header h3 { margin: 0; font-size: 1.1rem; }
.sim-detail-close {
  background: none;
  border: none;
  font-size: 1.5rem;
  cursor: pointer;
  color: var(--muted);
  line-height: 1;
}
.sim-detail-close:hover { color: var(--text); }
.sim-detail-body {
  padding: 1rem 1.25rem;
}
.sim-detail-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  margin-bottom: 1rem;
  font-size: 0.9rem;
}
.sim-detail-body h4 { margin: 0.75rem 0 0.5rem; font-size: 0.95rem; }
.sim-detail-equity { margin-bottom: 1rem; }
.sim-detail-footer {
  padding: 1rem 1.25rem;
  border-top: 1px solid var(--border);
  display: flex;
  justify-content: flex-end;
}
.sim-detail-footer .sim-detail-enter { min-width: 140px; }

/* Order log cancel button */
.sim-order-cancel {
  font-size: 0.8rem;
  padding: 0.2rem 0.5rem;
}

/* ── Futures: Sentiment Strip ── */
.futures-sentiment-strip {
  margin: 1rem 0;
}
.futures-sentiment-gauges {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}
.futures-sentiment-gauge {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 180px;
}
.futures-sentiment-symbol {
  font-weight: 700;
  font-size: 0.85rem;
  min-width: 28px;
}
.futures-sentiment-bar {
  flex: 1;
  height: 8px;
  border-radius: 4px;
  background: var(--border);
  overflow: hidden;
}
.futures-sentiment-fill {
  height: 100%;
  border-radius: 4px;
  transition: width 0.3s ease;
}
.futures-sentiment-label {
  font-size: 0.8rem;
  color: var(--muted);
  min-width: 50px;
}

/* ── Futures: Mode Switcher ── */
.futures-mode-switcher {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 1rem;
  font-size: 0.9rem;
}
.futures-mode-switcher label {
  font-weight: 600;
  color: var(--muted);
}
.futures-mode-switcher select {
  padding: 5px 10px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text);
  font-size: 0.9rem;
}
.futures-mode-switcher select:focus {
  border-color: var(--accent, #0a7ea4);
  outline: none;
}

/* ── Futures: Knowledge Base Status ── */
.futures-kb-status {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.8rem;
  color: var(--muted);
  margin-left: auto;
  margin-right: 0.75rem;
}
.futures-kb-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
  flex-shrink: 0;
}
.futures-kb-dot.active {
  background: var(--success, #22c55e);
  box-shadow: 0 0 4px var(--success, #22c55e);
}
.futures-kb-dot.inactive {
  background: var(--muted, #a8bddf);
}

/* ── Futures: Alerts Panel ── */
.futures-alerts-panel {
  margin: 1rem 0;
  padding: 0.75rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface-alt);
}
.futures-alerts-panel h3 {
  margin: 0 0 0.5rem;
  font-size: 0.95rem;
}
.futures-alerts-list {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  font-size: 0.85rem;
}
.futures-alert-item {
  padding: 0.25rem 0;
  border-bottom: 1px solid var(--border);
}
.futures-alert-item:last-child {
  border-bottom: none;
}

/* ── Agent Chat: Sources & Feedback ── */
.chat-sources {
  margin-top: 0.5rem;
  font-size: 0.82rem;
  color: var(--muted);
}
.chat-sources summary {
  cursor: pointer;
  font-weight: 600;
  color: var(--muted-2, var(--muted));
  user-select: none;
}
.chat-sources summary:hover {
  color: var(--text);
}
.chat-sources ul {
  margin: 0.3rem 0 0 1rem;
  padding: 0;
  list-style: disc;
}
.chat-sources li {
  margin-bottom: 0.2rem;
  line-height: 1.4;
}
.agent-chat-thumbs-up {
  background: none;
  border: 1px solid var(--border);
  border-radius: 4px;
  cursor: pointer;
  font-size: 0.85rem;
  padding: 2px 6px;
  margin-top: 0.35rem;
  display: inline-block;
  opacity: 0.6;
  transition: opacity 0.15s;
}
.agent-chat-thumbs-up:hover {
  opacity: 1;
  border-color: var(--accent, #0a7ea4);
}
.agent-chat-thumbs-up-sent {
  opacity: 0.4;
  cursor: default;
  border-color: var(--success, #22c55e);
}

/* ── Helm full-screen overlay ── */
.helm-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  background: var(--bg, #0c1320);
}
.helm-overlay[hidden] { display: none; }
.helm-overlay-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.5rem 1rem;
  background: var(--surface, #111827);
  border-bottom: 1px solid var(--border, #1e293b);
  flex-shrink: 0;
}
.helm-overlay-title {
  font-weight: 600;
  font-size: 0.95rem;
  color: var(--text, #e2e8f0);
}
.helm-overlay-tabs {
  display: flex;
  gap: 0.25rem;
}
.helm-tab {
  background: transparent;
  border: 1px solid var(--border, #1e293b);
  border-radius: 6px;
  color: var(--text-muted, #94a3b8);
  font-size: 0.85rem;
  font-weight: 500;
  padding: 0.3rem 0.75rem;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
.helm-tab:hover {
  background: var(--surface-hover, rgba(86,182,255,0.08));
  color: var(--text, #e2e8f0);
}
.helm-tab.active {
  background: var(--accent, #56b6ff);
  color: #fff;
  border-color: var(--accent, #56b6ff);
}
.helm-overlay-actions {
  display: flex;
  gap: 0.5rem;
}
.helm-overlay-frame {
  flex: 1;
  border: none;
  width: 100%;
  background: var(--bg, #0c1320);
}

/* ── SaaS App Hub (unified app list + per-app Dashboard / GitHub / Settings / Branches / Team / Activity) ── */
.saas-hub-wrap {
  max-width: 1100px;
  margin: 0 auto;
}
.saas-hub-wrap.saas-hub-app-view {
  max-width: none;
  width: 100%;
  margin: 0;
}
.saas-hub-header {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}
.saas-hub-title {
  margin: 0;
  font-size: 1.25rem;
}
/* Pill-style tabs with icon support */
.saas-hub-tabs {
  display: flex;
  gap: 0.35rem;
  margin-bottom: 1.25rem;
  flex-wrap: wrap;
}
.saas-hub-tab {
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--muted);
  font-size: 0.875rem;
  padding: 0.45rem 1rem;
  cursor: pointer;
  transition: background 0.2s, color 0.2s, border-color 0.2s, transform 0.15s;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.saas-hub-tab:hover {
  background: var(--surface-hover);
  color: var(--text);
}
.saas-hub-tab.active {
  background: var(--accent-bg);
  color: var(--text);
  border-color: var(--border-strong);
  box-shadow: 0 0 0 1px var(--border-strong);
}
.saas-hub-tab svg {
  width: 1em;
  height: 1em;
  opacity: 0.9;
}
.saas-hub-tab-content {
  display: none;
}
.saas-hub-tab-content.active {
  display: block;
}
/* Metric cards bar (per-app dashboard summary) */
.saas-hub-metrics-bar {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 0.75rem;
  margin-bottom: 1.25rem;
}
@media (max-width: 900px) {
  .saas-hub-metrics-bar {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 600px) {
  .saas-hub-metrics-bar {
    grid-template-columns: repeat(2, 1fr);
  }
}
.saas-hub-metric-card {
  background: var(--glass-bg);
  backdrop-filter: blur(var(--glass-blur));
  -webkit-backdrop-filter: blur(var(--glass-blur));
  border: 1px solid var(--glass-border);
  border-radius: 10px;
  padding: 0.85rem 1rem;
  transition: transform 0.15s, box-shadow 0.15s;
  cursor: pointer;
}
.saas-hub-metric-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}
.saas-hub-metric-card .saas-hub-metric-label {
  font-size: 0.75rem;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 0.25rem;
}
.saas-hub-metric-card .saas-hub-metric-value {
  font-size: 1.35rem;
  font-weight: 600;
  color: var(--text);
}
/* App list: glassmorphism cards with hover lift */
.saas-hub-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 1.25rem;
}
.saas-hub-app-card {
  cursor: pointer;
  padding: 1.25rem;
  border-radius: 12px;
  background: var(--glass-bg);
  backdrop-filter: blur(var(--glass-blur));
  -webkit-backdrop-filter: blur(var(--glass-blur));
  border: 1px solid var(--glass-border);
  transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
}
.saas-hub-app-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
  border-color: var(--border-strong);
}
.saas-hub-app-card.health-up { box-shadow: 0 0 0 1px rgba(156, 219, 116, 0.35); }
.saas-hub-app-card.health-down { box-shadow: 0 0 0 1px rgba(255, 120, 100, 0.35); }
.saas-hub-app-card.health-unknown { }
.saas-hub-app-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}
.saas-hub-app-name {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 600;
}
.saas-hub-app-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
}
.saas-hub-app-stack {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin: 0.5rem 0 0;
}
.saas-hub-stack-badge {
  font-size: 0.7rem;
  padding: 0.2rem 0.5rem;
  border-radius: 6px;
  background: var(--surface-soft);
  color: var(--muted);
  border: 1px solid var(--border);
}
.saas-hub-app-meta,
.saas-hub-app-repo {
  margin: 0.35rem 0 0;
  font-size: 0.85rem;
}
.saas-hub-sparkline {
  margin-top: 0.5rem;
  height: 24px;
  display: flex;
  align-items: flex-end;
  gap: 2px;
}
.saas-hub-sparkline-bar {
  flex: 1;
  min-width: 4px;
  background: var(--accent-bg);
  border-radius: 2px;
  transition: height 0.2s;
}
/* Status pill pulse for "deploying" */
.saas-hub-app-pills .status-pill.status-deploying,
.status-pill.status-deploying {
  animation: saas-hub-pulse 1.5s ease-in-out infinite;
}
@keyframes saas-hub-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.6; }
}
.saas-hub-dashboard-sections {
  margin-bottom: 1rem;
}
.saas-hub-dashboard-section {
  margin-bottom: 1.25rem;
}
.saas-hub-dashboard-section h4 {
  margin: 0 0 0.5rem;
  font-size: 0.95rem;
  color: var(--muted);
}
.saas-hub-dashboard-sections .table-wrap table {
  border-collapse: collapse;
  width: 100%;
  font-size: 0.9rem;
}
.saas-hub-dashboard-sections .table-wrap th,
.saas-hub-dashboard-sections .table-wrap td {
  padding: 0.5rem 0.75rem;
  text-align: left;
  border-bottom: 1px solid var(--table-border);
}
.saas-hub-dashboard-sections .table-wrap th {
  color: var(--muted);
  font-weight: 500;
  width: 35%;
}
.saas-hub-github-container {
  min-height: 200px;
}
/* Branches / Team / Activity tab content containers */
.saas-hub-branches-container,
.saas-hub-team-container,
.saas-hub-activity-container {
  min-height: 200px;
  position: relative;
}

/* Git graph (Branches tab) */
.saas-hub-git-graph-wrap {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 1.5rem;
  align-items: start;
}
@media (max-width: 700px) {
  .saas-hub-git-graph-wrap { grid-template-columns: 1fr; }
}
.saas-hub-graph-sidebar-title {
  margin: 0 0 0.5rem;
  font-size: 0.9rem;
  color: var(--muted);
}
.saas-hub-branch-list {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}
.saas-hub-branch-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.35rem 0.5rem;
  border-radius: 6px;
  font-size: 0.85rem;
  cursor: default;
}
.saas-hub-branch-row:hover {
  background: var(--surface-hover);
}
.saas-hub-branch-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.saas-hub-branch-name {
  font-weight: 500;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.saas-hub-branch-meta {
  font-size: 0.75rem;
  margin-left: auto;
}
.saas-hub-graph-svg-wrap {
  overflow: auto;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--chart-bg);
}
.saas-hub-graph-svg {
  display: block;
}
.saas-hub-graph-node {
  cursor: pointer;
  transition: r 0.15s;
}
.saas-hub-graph-node:hover {
  r: 8;
}
.saas-hub-graph-tooltip {
  position: absolute;
  z-index: 100;
  padding: 0.5rem 0.75rem;
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  font-size: 0.85rem;
  max-width: 320px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}
.saas-hub-graph-detail-wrap {
  margin-top: 1rem;
}
.saas-hub-graph-detail-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}
.saas-hub-graph-detail-table th,
.saas-hub-graph-detail-table td {
  padding: 0.4rem 0.6rem;
  text-align: left;
  border-bottom: 1px solid var(--border);
}
.saas-hub-graph-detail-table th {
  color: var(--muted);
  font-weight: 500;
}

/* Team tab */
.saas-hub-team-wrap {
  max-width: 800px;
}
.saas-hub-team-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1rem;
}
.saas-hub-team-section {
  margin-bottom: 1.5rem;
}
.saas-hub-team-section h4 {
  margin: 0 0 0.5rem;
  font-size: 0.95rem;
  color: var(--muted);
}
.saas-hub-team-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
}
.saas-hub-team-table th,
.saas-hub-team-table td {
  padding: 0.5rem 0.75rem;
  text-align: left;
  border-bottom: 1px solid var(--border);
}
.saas-hub-team-table th {
  color: var(--muted);
  font-weight: 500;
}
.saas-hub-role-pill {
  font-size: 0.7rem;
  padding: 0.2rem 0.5rem;
  border-radius: 6px;
  background: var(--surface-soft);
  color: var(--muted);
}
.saas-hub-role-pill.saas-hub-role-internal { background: rgba(86, 182, 255, 0.2); color: var(--focus-ring); }
.saas-hub-role-pill.saas-hub-role-external { background: rgba(245, 158, 11, 0.2); color: var(--signal-caution); }
.saas-hub-role-pill.saas-hub-role-qa { background: rgba(34, 197, 94, 0.2); color: var(--signal-buy); }

/* Watch / Notification policy */
.watch-level-pill {
  font-size: 0.75rem;
  padding: 0.2rem 0.6rem;
  border-radius: 6px;
  background: var(--surface-soft);
  color: var(--muted);
  white-space: nowrap;
}
.watch-level-pill.watch-level-participating { background: rgba(86, 182, 255, 0.15); color: var(--focus-ring); }
.watch-level-pill.watch-level-all-activity { background: rgba(34, 197, 94, 0.15); color: var(--signal-buy); }
.watch-level-pill.watch-level-ignore { background: rgba(127, 127, 127, 0.15); color: var(--muted); }
.watch-level-pill.watch-level-custom { background: rgba(168, 85, 247, 0.15); color: #a855f7; }
.watch-level-pill.watch-level-none { background: transparent; color: var(--muted); font-style: italic; }
.watch-prefs-table .btn-sm { padding: 0.2rem 0.5rem; font-size: 0.75rem; }

.watch-pref-modal { max-width: 460px; }
.watch-options {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  margin: 0.75rem 0;
}
.watch-option {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  padding: 0.6rem 0.75rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
  margin: 0;
  color: var(--text);
  font-size: 0.9rem;
}
.watch-option:hover { border-color: var(--focus-ring); }
.watch-option-active { border-color: var(--focus-ring); background: rgba(86, 182, 255, 0.06); }
.watch-option input[type="radio"] { margin-top: 0.2rem; accent-color: var(--focus-ring); }
.watch-option-content { display: flex; flex-direction: column; gap: 0.15rem; }
.watch-option-content strong { font-size: 0.9rem; }
.watch-option-desc { font-size: 0.78rem; color: var(--muted); }

.watch-custom-events {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  padding: 0.75rem;
  margin-bottom: 0.75rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface-soft);
}
.watch-event-check {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.85rem;
  color: var(--text);
  cursor: pointer;
  margin: 0;
}
.watch-event-check input[type="checkbox"] { accent-color: var(--focus-ring); }

/* Agent Scans panel – use full width of app view */
.agent-scans-panel-wrap {
  width: 100%;
  max-width: none;
}
.agent-scans-toolbar {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-bottom: 0.25rem;
}
.agent-scans-toolbar .muted-note {
  margin: 0;
}
.agent-scans-runs h4 { margin: 0 0 0.75rem; font-size: 1rem; color: var(--muted); }
.agent-scan-runs-list { display: flex; flex-direction: column; gap: 1rem; }
.agent-scan-run-card {
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 1rem;
  background: var(--surface-soft);
}
.agent-scan-run-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
  font-size: 0.85rem;
}
.agent-scan-env { font-weight: 600; text-transform: capitalize; }
.agent-scan-branch { color: var(--muted); }
.agent-scan-sha { font-family: var(--font-mono, monospace); font-size: 0.8rem; }
.agent-scan-sha a { color: var(--focus-ring); }
.agent-scan-gate { font-weight: 600; padding: 0.15rem 0.5rem; border-radius: 4px; }
.agent-scan-gate.gate-success { background: rgba(34, 197, 94, 0.2); color: var(--signal-buy); }
.agent-scan-gate.gate-failure { background: rgba(239, 68, 68, 0.2); color: var(--signal-sell, #ef4444); }
.agent-scan-time { margin-left: auto; }
.agent-scan-steps-table { width: 100%; font-size: 0.8rem; border-collapse: collapse; margin-bottom: 0.75rem; }
.agent-scan-steps-table th, .agent-scan-steps-table td { padding: 0.35rem 0.5rem; text-align: left; border-bottom: 1px solid var(--border); }
.agent-scan-badge { font-size: 0.7rem; padding: 0.2rem 0.45rem; border-radius: 4px; font-weight: 500; }
.agent-status-pass { background: rgba(34, 197, 94, 0.2); color: var(--signal-buy); }
.agent-status-warn { background: rgba(245, 158, 11, 0.2); color: var(--signal-caution); }
.agent-status-fail { background: rgba(239, 68, 68, 0.2); color: var(--signal-sell, #ef4444); }
.agent-status-skip { background: var(--surface-soft); color: var(--muted); }
.agent-scan-agents-wrap h5 { margin: 0.5rem 0 0.35rem; font-size: 0.85rem; color: var(--muted); }
.agent-scan-agent-cards { display: flex; flex-direction: column; gap: 0.5rem; }
.agent-scan-agent-card { border-left: 3px solid var(--border); padding-left: 0.5rem; font-size: 0.85rem; }
.agent-scan-agent-header { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem; }
.agent-scan-summary { color: var(--muted); flex: 1; min-width: 0; }
.agent-scan-findings-list.is-hidden { display: none; }
.agent-scan-findings-list ul { margin: 0.35rem 0 0; padding-left: 1.25rem; }
.agent-scan-findings-list li { margin: 0.25rem 0; font-size: 0.8rem; }
.finding-severity { font-size: 0.7rem; padding: 0.1rem 0.3rem; border-radius: 3px; margin-right: 0.35rem; }
.finding-critical { background: rgba(239, 68, 68, 0.25); }
.finding-high { background: rgba(245, 158, 11, 0.25); }
.finding-medium, .finding-low { background: var(--surface-soft); color: var(--muted); }
.agent-scan-toggle-findings { margin-top: 0.25rem; }

/* Global Team module */
.global-team-wrap { padding: 0 0 2rem; }
.global-team-header { margin-bottom: 1rem; }
.global-team-title { font-size: 1.5rem; margin-bottom: 0.25rem; }
.global-team-actions { margin-bottom: 1rem; }
.global-team-section { margin-bottom: 1.5rem; }
.global-team-section h4 { margin-bottom: 0.5rem; font-size: 1rem; }
.global-team-table { width: 100%; border-collapse: collapse; }
.global-team-table th, .global-team-table td { padding: 0.5rem 0.75rem; text-align: left; border-bottom: 1px solid var(--border); }
.global-team-status { font-size: 0.8rem; text-transform: lowercase; }
.global-team-status-active { color: var(--signal-buy, #22c55e); }
.global-team-status-offboarded { color: var(--muted); }
.global-team-repos-cell { max-width: 280px; word-break: break-all; }

.saas-hub-add-collab-block { margin-bottom: 1rem; }
.saas-hub-add-collab-row { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
.saas-hub-add-collab-row .saas-hub-collab-select { min-width: 220px; }
.saas-hub-collab-other-wrap input { padding: 0.35rem 0.5rem; margin-left: 0.25rem; }

.saas-hub-dashboard-projects { margin-bottom: 1.5rem; }
.saas-hub-dashboard-projects .settings-section-title { margin-bottom: 0.5rem; }

/* Team onboarding/offboarding modal */
.saas-hub-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 9000;
  background: rgba(0, 0, 0, 0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.saas-hub-modal-wrap {
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-radius: 12px;
  padding: 1.25rem;
  max-width: 480px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
}
.saas-hub-modal-wrap h3 {
  margin: 0 0 0.5rem;
  font-size: 1.1rem;
}
.saas-hub-modal-wrap label {
  display: block;
  margin-top: 0.75rem;
  font-size: 0.85rem;
  color: var(--muted);
}
.saas-hub-modal-wrap label input,
.saas-hub-modal-wrap label select {
  display: block;
  width: 100%;
  margin-top: 0.25rem;
  padding: 0.4rem 0.5rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface-alt);
  color: var(--text);
  font-size: 0.9rem;
}
.saas-hub-modal-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 1.25rem;
}

/* Activity feed */
.saas-hub-activity-wrap {
  max-width: 700px;
}
.saas-hub-activity-toolbar {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-bottom: 0.5rem;
}
.saas-hub-activity-filters {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}
.saas-hub-activity-timeline {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.saas-hub-activity-card {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 0.65rem 0.85rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface-alt);
  font-size: 0.9rem;
}
.saas-hub-activity-card.saas-hub-activity-clickable {
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
.saas-hub-activity-card.saas-hub-activity-clickable:hover {
  background: var(--surface-hover);
  border-color: var(--border-strong);
}
.saas-hub-activity-icon {
  font-size: 1.1rem;
  opacity: 0.8;
  flex-shrink: 0;
}
.saas-hub-activity-body {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem;
  min-width: 0;
}
.saas-hub-activity-actor {
  font-weight: 500;
}
.saas-hub-activity-action {
  color: var(--muted);
}
.saas-hub-activity-target {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.saas-hub-activity-time {
  margin-left: auto;
  font-size: 0.8rem;
}

/* ── GitHub Management module ── */
.gh-management-wrap {
  max-width: 1200px;
  margin: 0 auto;
}
.gh-management-header {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}
.gh-management-title {
  margin: 0;
  font-size: 1.25rem;
}
.gh-repo-select-wrap {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.gh-repo-select-wrap label {
  font-size: 0.875rem;
  color: var(--muted);
}
.gh-repo-select {
  min-width: 220px;
  padding: 0.35rem 0.5rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text);
  font-size: 0.9rem;
}
.gh-overview-panels {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
}
@media (max-width: 900px) {
  .gh-overview-panels { grid-template-columns: 1fr; }
}
.gh-panel-title {
  margin: 0 0 0.75rem;
  font-size: 1rem;
  color: var(--muted);
}
.gh-card-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.gh-pr-card,
.gh-issue-card {
  padding: 0.75rem 1rem;
  cursor: pointer;
  transition: background 0.15s;
}
.gh-pr-card:hover,
.gh-issue-card:hover {
  background: var(--surface-hover);
}
.gh-pr-card-header,
.gh-issue-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
}
.gh-pr-card-title,
.gh-issue-card-title {
  color: var(--text);
  text-decoration: none;
  font-weight: 500;
  flex: 1;
}
.gh-pr-card-title:hover,
.gh-issue-card-title:hover {
  text-decoration: underline;
}
.gh-pr-card-meta,
.gh-issue-card-meta {
  font-size: 0.8rem;
  color: var(--muted);
  margin-top: 0.25rem;
}
.gh-issue-labels {
  margin-top: 0.35rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
}
.gh-label {
  font-size: 0.7rem;
  padding: 0.15rem 0.4rem;
  border-radius: 4px;
}
.gh-status-badge {
  font-size: 0.7rem;
  padding: 0.2rem 0.5rem;
  border-radius: 4px;
  font-weight: 500;
  white-space: nowrap;
}
.gh-status-pass,
.gh-status-success {
  background: rgba(34, 197, 94, 0.2);
  color: var(--signal-buy, #22c55e);
}
.gh-status-fail,
.gh-status-failure,
.gh-status-error {
  background: rgba(239, 68, 68, 0.2);
  color: var(--signal-sell, #ef4444);
}
.gh-status-pending {
  background: rgba(245, 158, 11, 0.2);
  color: var(--signal-caution, #f59e0b);
}
.gh-review-badge {
  font-size: 0.75rem;
  color: var(--muted);
  margin-left: 0.5rem;
}
.gh-error {
  color: var(--warn-text, #f59e0b);
  margin-bottom: 1rem;
}
.gh-back-btn {
  margin-right: 0.5rem;
}

.gh-refresh-btn {
  margin-left: auto;
  margin-right: 0.5rem;
}
.gh-pr-meta,
.gh-issue-meta {
  font-size: 0.875rem;
  color: var(--muted);
  margin-bottom: 1rem;
}
.gh-test-md-indicator {
  margin-left: 0.5rem;
  font-size: 0.8rem;
  padding: 0.15rem 0.4rem;
  border-radius: 4px;
}
.gh-test-md-ok {
  background: rgba(34, 197, 94, 0.2);
  color: var(--success-text, #22c55e);
}
.gh-test-md-missing {
  background: rgba(239, 68, 68, 0.2);
  color: var(--error-text, #ef4444);
}
.gh-action-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1rem;
}
.gh-merge-dropdown {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}
.gh-merge-dropdown select {
  padding: 0.35rem 0.5rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text);
  font-size: 0.85rem;
}
.gh-pr-tabs {
  display: flex;
  gap: 0.25rem;
  margin-bottom: 0.75rem;
}
.gh-tab {
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 6px;
  color: var(--muted);
  font-size: 0.875rem;
  padding: 0.4rem 0.75rem;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
.gh-tab:hover {
  background: var(--surface-hover);
  color: var(--text);
}
.gh-tab.active {
  background: var(--accent-bg);
  color: var(--text);
  border-color: var(--border-strong);
}
.gh-tab-content {
  display: none;
}
.gh-tab-content.active {
  display: block;
}
.gh-pr-conversation,
.gh-issue-comments {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.gh-pr-body,
.gh-comment-body {
  font-size: 0.9rem;
  line-height: 1.5;
  margin-top: 0.5rem;
}
.gh-comment-box {
  padding: 1rem;
}
.gh-comment-textarea {
  width: 100%;
  min-height: 80px;
  padding: 0.5rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text);
  font-family: inherit;
  font-size: 0.9rem;
  margin-bottom: 0.5rem;
  resize: vertical;
}
.gh-comment-box .btn {
  margin-top: 0.25rem;
}
.gh-files-layout {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 1rem;
}
@media (max-width: 768px) {
  .gh-files-layout { grid-template-columns: 1fr; }
}
.gh-file-tree {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  max-height: 70vh;
  overflow-y: auto;
}
.gh-file-tree-item {
  text-align: left;
  padding: 0.4rem 0.6rem;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: var(--text);
  font-size: 0.8rem;
  cursor: pointer;
  transition: background 0.15s;
}
.gh-file-tree-item:hover,
.gh-file-tree-item.active {
  background: var(--surface-hover);
}
.gh-diff-file-stats-inline {
  font-size: 0.75rem;
  color: var(--muted);
  margin-left: 0.35rem;
}
.gh-diff-files {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.gh-diff-file-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.4rem 0.75rem;
  background: var(--surface-alt);
  border-radius: 6px 6px 0 0;
  font-size: 0.85rem;
  border: 1px solid var(--border);
  border-bottom: none;
}
.gh-diff-file-name {
  font-family: ui-monospace, monospace;
  word-break: break-all;
}
.gh-diff-file-stats {
  display: flex;
  gap: 0.5rem;
  font-size: 0.8rem;
}
.gh-diff-stat-add { color: var(--signal-buy, #22c55e); }
.gh-diff-stat-del { color: var(--signal-sell, #ef4444); }
.gh-diff-viewer {
  border: 1px solid var(--border);
  border-radius: 0 0 6px 6px;
  overflow-x: auto;
  font-family: ui-monospace, monospace;
  font-size: 0.8rem;
  line-height: 1.4;
  background: var(--surface);
}
.gh-diff-pre {
  margin: 0;
  padding: 0.5rem;
  white-space: pre;
  min-width: max-content;
}
.gh-diff-line {
  display: flex;
  min-height: 1.4em;
}
.gh-diff-num {
  flex-shrink: 0;
  width: 2.5rem;
  padding-right: 0.5rem;
  color: var(--muted);
  user-select: none;
  text-align: right;
}
.gh-diff-content {
  flex: 1;
}
.gh-diff-add .gh-diff-content {
  background: rgba(34, 197, 94, 0.15);
}
.gh-diff-del .gh-diff-content {
  background: rgba(239, 68, 68, 0.15);
}
.gh-diff-hunk .gh-diff-content {
  color: var(--muted);
  font-style: italic;
}
.gh-check-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0;
  font-size: 0.9rem;
}
.gh-check-item a {
  color: var(--focus-ring, #56b6ff);
  margin-left: auto;
}
.gh-checks-section-title {
  font-size: 0.9rem;
  color: var(--muted);
  margin: 1rem 0 0.5rem;
}
.gh-checks-section-title:first-child {
  margin-top: 0;
}
.gh-checks-list {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.gh-journey-timeline {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-top: 0.75rem;
}
.gh-journey-step {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 0.5rem 0;
  border-left: 2px solid var(--border);
  padding-left: 0.75rem;
  margin-left: 0.5rem;
}
.gh-journey-icon {
  flex-shrink: 0;
  width: 1.25rem;
  text-align: center;
  color: var(--muted);
  font-size: 0.9rem;
}
.gh-journey-step-body strong { display: block; font-size: 0.9rem; margin-bottom: 0.2rem; }
.gh-journey-detail { font-size: 0.85rem; color: var(--muted); }
.gh-journey-detail a { color: var(--focus-ring); }
.gh-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 9000;
  background: rgba(0, 0, 0, 0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.gh-modal {
  max-width: 500px;
  width: 100%;
  max-height: 90vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.gh-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem;
  border-bottom: 1px solid var(--border);
}
.gh-modal-header h3 {
  margin: 0;
  font-size: 1rem;
}
.gh-modal-close {
  background: none;
  border: none;
  color: var(--muted);
  font-size: 1.5rem;
  cursor: pointer;
  line-height: 1;
  padding: 0 0.25rem;
}
.gh-modal-close:hover {
  color: var(--text);
}
.gh-modal-body {
  padding: 1rem;
  overflow-y: auto;
}
.gh-modal-body label {
  display: block;
  font-size: 0.85rem;
  color: var(--muted);
  margin-top: 0.75rem;
  margin-bottom: 0.25rem;
}
.gh-modal-body label:first-child {
  margin-top: 0;
}
.gh-input {
  width: 100%;
  padding: 0.5rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text);
  font-size: 0.9rem;
}
.gh-modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
  padding: 1rem;
  border-top: 1px solid var(--border);
}

/* ── CI/CD tab ── */
.saas-hub-cicd-container {
  min-height: 200px;
  position: relative;
}
.cicd-panel {
  max-width: 1000px;
}
.cicd-toolbar {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}
.cicd-toolbar label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.9rem;
  color: var(--muted);
}
.cicd-workflow-select {
  padding: 0.4rem 0.6rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface-alt);
  color: var(--text);
  font-size: 0.9rem;
  min-width: 180px;
}
.cicd-runs-section h4,
.cicd-detail-section h4 {
  margin: 0 0 0.75rem;
  font-size: 0.95rem;
  color: var(--muted);
}
.cicd-runs-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}
.cicd-runs-table th,
.cicd-runs-table td {
  padding: 0.5rem 0.75rem;
  text-align: left;
  border-bottom: 1px solid var(--border);
}
.cicd-runs-table th {
  color: var(--muted);
  font-weight: 500;
}
.cicd-run-row {
  cursor: pointer;
  transition: background 0.15s;
}
.cicd-run-row:hover {
  background: var(--surface-hover);
}
.cicd-commit-msg {
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cicd-status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 50%;
  font-size: 0.75rem;
  font-weight: 600;
}
.cicd-status-success {
  background: rgba(34, 197, 94, 0.2);
  color: #22c55e;
}
.cicd-status-failure {
  background: rgba(239, 68, 68, 0.2);
  color: #ef4444;
}
.cicd-status-pending {
  background: rgba(245, 158, 11, 0.2);
  color: #f59e0b;
}
.cicd-run-detail {
  margin-top: 1rem;
  padding: 1rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface-alt);
}
.cicd-run-meta p {
  margin: 0.25rem 0;
  font-size: 0.9rem;
}
.cicd-run-actions {
  display: flex;
  gap: 0.5rem;
  margin: 0.75rem 0;
}
.cicd-jobs-list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.cicd-job {
  padding: 0.75rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
}
.cicd-job-header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
  font-size: 0.9rem;
}
.cicd-job-duration {
  margin-left: auto;
  font-size: 0.8rem;
  color: var(--muted);
}
.cicd-job-steps {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding-left: 1.5rem;
  font-size: 0.85rem;
}
.cicd-step {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

/* ── Settings panel (branch protection, security, insights, projects) ── */
.saas-hub-settings-panel {
  margin-top: 1.5rem;
}
.saas-hub-settings-profile {
  margin-bottom: 1rem;
}
.saas-hub-settings-profile .settings-section-title {
  margin-bottom: 0.5rem;
}
.settings-panel {
  max-width: 900px;
}
.settings-section {
  margin-bottom: 2rem;
}
.settings-section-title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--text);
  margin: 0 0 0.75rem;
}
.settings-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}
.settings-table th,
.settings-table td {
  padding: 0.5rem 0.75rem;
  text-align: left;
  border-bottom: 1px solid var(--border);
}
.settings-table th {
  color: var(--muted);
  font-weight: 500;
}
.settings-badge {
  display: inline-block;
  padding: 0.2rem 0.5rem;
  border-radius: 4px;
  font-size: 0.8rem;
}
.settings-badge-on {
  background: rgba(34, 197, 94, 0.15);
  color: #22c55e;
}
.settings-badge-off {
  background: var(--surface-hover);
  color: var(--muted);
}
.settings-sparkline {
  display: inline-flex;
  align-items: flex-end;
  gap: 2px;
  height: 1.5rem;
  vertical-align: middle;
  margin-left: 0.5rem;
}
.settings-spark-bar {
  display: inline-block;
  width: 6px;
  min-height: 4px;
  background: var(--border-strong);
  border-radius: 2px;
}
.settings-severity {
  display: inline-block;
  padding: 0.2rem 0.4rem;
  border-radius: 4px;
  font-size: 0.8rem;
}
.settings-severity-critical {
  background: rgba(239, 68, 68, 0.2);
  color: #fca5a5;
}
.settings-severity-high {
  background: rgba(249, 115, 22, 0.2);
  color: #fdba74;
}
.settings-severity-medium {
  background: rgba(245, 158, 11, 0.2);
  color: #fcd34d;
}
.settings-severity-low {
  background: rgba(34, 197, 94, 0.15);
  color: #86efac;
}
.settings-links {
  list-style: none;
  padding: 0;
  margin: 0;
}
.settings-links li {
  margin-bottom: 0.35rem;
}
.settings-links a {
  color: var(--focus-ring, #56b6ff);
}
.settings-projects-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.settings-projects-list li {
  margin-bottom: 0.5rem;
}
.settings-projects-list a {
  color: var(--focus-ring, #56b6ff);
}
.settings-mini-board {
  margin-bottom: 1rem;
  padding: 0.75rem;
  background: var(--panel-bg, rgba(255,255,255,0.04));
  border-radius: 6px;
}
.settings-board-title {
  font-weight: 600;
  margin-bottom: 0.5rem;
}
.settings-board-columns {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  margin-bottom: 0.5rem;
}
.settings-board-column {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.2rem 0.5rem;
  background: var(--input-bg, rgba(0,0,0,0.2));
  border-radius: 4px;
  font-size: 0.9rem;
}
.settings-board-col-name { font-weight: 500; }
.settings-board-col-count { opacity: 0.9; }
.settings-panel .table-wrap {
  margin-bottom: 1rem;
}
.settings-panel .muted-note {
  font-size: 0.85rem;
  margin: 0.5rem 0;
}
.settings-panel a {
  color: var(--focus-ring, #56b6ff);
}