/*
 * Factory VOA — Smart Cascade visual language.
 * Reference: Smart Cascade Flow (Lovable project smart-cascata-stream).
 * This layer is intentionally visual: existing Factory behavior and test IDs stay intact.
 */

body.smart-cascata-build {
  color-scheme: light;
  --bg: #fbfaf7;
  --bg-2: #ffffff;
  --bg-3: #f4f2ec;
  --ink: #252a2d;
  --muted: #73787c;
  --line: #e6e2d9;
  --gold: #1f8f86;
  --amber: #c78b2e;
  --ok: #1f8f86;
  --warn: #c78b2e;
  --bad: #c75b61;
  --info: #6d63b7;
  --radius: 20px;
  --smart-teal: #1f8f86;
  --smart-teal-soft: #e7f5f2;
  --smart-violet: #6d63b7;
  --smart-violet-soft: #f0eef9;
  --smart-rose: #c75b61;
  --smart-rose-soft: #faeeee;
  --smart-amber: #c78b2e;
  --smart-amber-soft: #fbf3df;
  --smart-surface: #ffffff;
  --smart-ink: #252a2d;
  --smart-shadow: 0 1px 2px rgb(35 38 40 / 4%), 0 14px 34px -20px rgb(35 38 40 / 18%);
  --smart-shadow-hover: 0 1px 2px rgb(35 38 40 / 4%), 0 18px 42px -18px rgb(31 143 134 / 24%);
  background:
    radial-gradient(circle at 94% 3%, rgb(231 245 242 / 80%), transparent 28rem),
    radial-gradient(circle at 5% 35%, rgb(240 238 249 / 70%), transparent 24rem),
    var(--bg);
  color: var(--ink);
  font-family: "DM Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
}

body.smart-cascata-build .app-shell {
  background: transparent;
}

body.smart-cascata-build .topbar {
  background: rgb(255 255 255 / 92%);
  border-bottom: 1px solid var(--line);
  box-shadow: 0 1px 0 rgb(35 38 40 / 2%);
  backdrop-filter: blur(18px);
}

body.smart-cascata-build .brand {
  color: var(--smart-ink);
}

body.smart-cascata-build .meter-chip {
  background: #fff;
  border-color: var(--line);
  box-shadow: 0 1px 2px rgb(35 38 40 / 3%);
}

body.smart-cascata-build .meter-chip span,
body.smart-cascata-build .meter-chip small,
body.smart-cascata-build .top-meta {
  color: var(--muted);
}

body.smart-cascata-build .meter-chip strong,
body.smart-cascata-build .meter-chip-link {
  color: var(--smart-ink);
}

body.smart-cascata-build .meter-chip-link:hover,
body.smart-cascata-build .meter-chip-link:focus-visible {
  border-color: rgb(31 143 134 / 45%);
  box-shadow: 0 0 0 3px rgb(31 143 134 / 8%);
}

body.smart-cascata-build .meter-bar {
  background: #eef0ec;
}

body.smart-cascata-build .meter-bar i {
  background: var(--smart-teal);
}

body.smart-cascata-build .provider-credit-exhausted {
  background: var(--smart-rose-soft);
  border-color: rgb(199 91 97 / 35%);
}

body.smart-cascata-build .layout {
  grid-template-columns: 230px minmax(0, 1fr);
}

body.smart-cascata-build nav.side {
  background: rgb(255 255 255 / 88%);
  border-right-color: var(--line);
  padding: 14px 12px;
  backdrop-filter: blur(14px);
}

body.smart-cascata-build nav.side a,
body.smart-cascata-build .tabbar a {
  color: #52585c;
  border: 1px solid transparent;
  font-weight: 650;
}

body.smart-cascata-build nav.side a:hover {
  background: #f7f6f2;
  color: var(--smart-ink);
}

body.smart-cascata-build nav.side a.active,
body.smart-cascata-build .tabbar a.active {
  background: var(--smart-teal-soft);
  border-color: rgb(31 143 134 / 12%);
  color: #15756d;
}

body.smart-cascata-build main {
  padding: 26px clamp(18px, 3vw, 42px) 48px;
}

body.smart-cascata-build [data-testid="build-page"] {
  width: min(1440px, 100%);
  margin: 0 auto;
}

/* Cascata-like hero injected by factory-smart-cascata.js */
body.smart-cascata-build .smart-build-hero {
  position: relative;
  overflow: hidden;
  margin-bottom: 18px;
  padding: clamp(22px, 3vw, 36px);
  border: 1px solid var(--line);
  border-radius: 28px;
  background: rgb(255 255 255 / 92%);
  box-shadow: var(--smart-shadow);
}

body.smart-cascata-build .smart-build-hero::after {
  content: "";
  position: absolute;
  width: 310px;
  height: 310px;
  right: -115px;
  top: -170px;
  border-radius: 999px;
  background: var(--smart-teal-soft);
  filter: blur(2px);
  opacity: 0.95;
  pointer-events: none;
}

body.smart-cascata-build .smart-build-hero-top,
body.smart-cascata-build .smart-build-hero-actions,
body.smart-cascata-build .smart-build-chip {
  display: flex;
  align-items: center;
}

body.smart-cascata-build .smart-build-hero-top {
  position: relative;
  z-index: 1;
  justify-content: space-between;
  gap: 18px;
}

body.smart-cascata-build .smart-build-chip {
  width: max-content;
  gap: 7px;
  margin-bottom: 14px;
  padding: 6px 11px;
  border-radius: 999px;
  background: var(--smart-teal-soft);
  color: #15756d;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

body.smart-cascata-build .smart-build-chip i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--smart-teal);
  box-shadow: 0 0 0 4px rgb(31 143 134 / 11%);
}

body.smart-cascata-build .smart-build-hero h1 {
  margin: 0;
  color: var(--smart-ink);
  font-family: "Instrument Serif", Georgia, "Times New Roman", serif;
  font-size: clamp(40px, 5vw, 64px);
  font-weight: 500;
  letter-spacing: -.035em;
  line-height: .98;
}

body.smart-cascata-build .smart-build-hero h1 em {
  color: var(--smart-teal);
  font-style: normal;
}

body.smart-cascata-build .smart-build-hero p {
  max-width: 720px;
  margin: 15px 0 0;
  color: #656b6f;
  font-size: 15px;
  line-height: 1.55;
}

body.smart-cascata-build .smart-build-hero-actions {
  position: relative;
  z-index: 1;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 9px;
}

body.smart-cascata-build .smart-build-action {
  min-height: 42px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: #fff;
  color: var(--smart-ink);
  font-weight: 750;
  cursor: pointer;
  box-shadow: 0 1px 2px rgb(35 38 40 / 3%);
}

body.smart-cascata-build .smart-build-action.primary {
  border-color: var(--smart-teal);
  background: var(--smart-teal);
  color: #fff;
}

body.smart-cascata-build .smart-build-action:hover {
  transform: translateY(-1px);
  box-shadow: var(--smart-shadow-hover);
}

/* Factory build lounge becomes the metric strip from Smart Cascade. */
body.smart-cascata-build .fab-build-lounge {
  margin-bottom: 18px;
}

body.smart-cascata-build .fab-lounge-shell,
body.smart-cascata-build .vb-panel,
body.smart-cascata-build .vb-canvas-panel,
body.smart-cascata-build .vb-edit-box,
body.smart-cascata-build .founder-auth-drawer,
body.smart-cascata-build .card,
body.smart-cascata-build .panel,
body.smart-cascata-build .event,
body.smart-cascata-build .gate,
body.smart-cascata-build .empty {
  background: #fff;
  border-color: var(--line);
  box-shadow: var(--smart-shadow);
}

body.smart-cascata-build .fab-lounge-shell {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.smart-cascata-build .fab-lounge-intro {
  margin-bottom: 12px;
  padding: 0 3px;
  color: var(--smart-ink);
}

body.smart-cascata-build .fab-lounge-intro small,
body.smart-cascata-build .fab-card-heading small,
body.smart-cascata-build .fab-agent-detail small,
body.smart-cascata-build .vb-kicker {
  color: var(--muted);
}

body.smart-cascata-build .fab-lounge-mark {
  background: var(--smart-teal);
  color: white;
  box-shadow: 0 10px 28px -14px rgb(31 143 134 / 80%);
}

body.smart-cascata-build .fab-sync-status {
  background: var(--smart-teal-soft);
  color: #15756d;
  border-color: rgb(31 143 134 / 14%);
}

body.smart-cascata-build .fab-lounge-tabs {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

body.smart-cascata-build .fab-lounge-tab {
  min-height: 116px;
  align-items: flex-start;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  color: var(--smart-ink);
  box-shadow: var(--smart-shadow);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

body.smart-cascata-build .fab-lounge-tab:hover,
body.smart-cascata-build .fab-lounge-tab.is-open {
  transform: translateY(-2px);
  border-color: rgb(31 143 134 / 28%);
  box-shadow: var(--smart-shadow-hover);
}

body.smart-cascata-build .fab-tab-copy small {
  color: var(--muted);
  font-size: 10px;
  letter-spacing: .1em;
}

body.smart-cascata-build .fab-tab-copy strong {
  color: var(--smart-ink);
  font-size: 14px;
}

body.smart-cascata-build .fab-tab-badge {
  min-width: 42px;
  height: 34px;
  border-radius: 11px;
  background: var(--smart-teal-soft);
  color: #15756d;
  font-size: 13px;
}

body.smart-cascata-build .fab-tab-chevron {
  color: #9b9fa2;
}

body.smart-cascata-build .fab-lounge-expand {
  margin-top: 10px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: #fff;
  box-shadow: var(--smart-shadow);
}

body.smart-cascata-build .fab-intelligence-card,
body.smart-cascata-build .fab-agent-choice,
body.smart-cascata-build .fab-active-list article,
body.smart-cascata-build .fab-agent-timeline article {
  background: #fbfbf9;
  border-color: var(--line);
  color: var(--smart-ink);
}

body.smart-cascata-build .fab-intelligence-card.is-active,
body.smart-cascata-build .fab-agent-choice.is-active,
body.smart-cascata-build .fab-agent-choice.is-selected {
  background: var(--smart-teal-soft);
  border-color: rgb(31 143 134 / 25%);
}

body.smart-cascata-build .fab-mini-meter,
body.smart-cascata-build .fab-progress-track {
  background: #efefeb;
}

body.smart-cascata-build .fab-mini-meter i,
body.smart-cascata-build .fab-progress-track i {
  background: var(--smart-teal);
}

body.smart-cascata-build .fab-progress-step span {
  border-color: var(--line);
  background: #fff;
  color: #73787c;
}

body.smart-cascata-build .fab-progress-step.is-done span,
body.smart-cascata-build .fab-progress-step.is-current span {
  background: var(--smart-teal);
  border-color: var(--smart-teal);
  color: white;
}

body.smart-cascata-build .fab-progress-step strong,
body.smart-cascata-build .fab-agent-detail h3,
body.smart-cascata-build .fab-active-list strong {
  color: var(--smart-ink);
}

body.smart-cascata-build .fab-agent-icon,
body.smart-cascata-build .fab-live-orb,
body.smart-cascata-build .fab-live-dot {
  background: var(--smart-teal);
  color: white;
}

/* Visual Builder: white canvas, rounded cards, quiet hierarchy. */
body.smart-cascata-build .vb-workspace {
  background: transparent;
  color: var(--smart-ink);
}

body.smart-cascata-build .vb-screen-strip,
body.smart-cascata-build .vb-local-tabs,
body.smart-cascata-build .vb-v2-view-switch {
  border-color: var(--line);
  background: #fff;
  box-shadow: var(--smart-shadow);
}

body.smart-cascata-build .vb-screen-tab,
body.smart-cascata-build .vb-local-tabs .btn,
body.smart-cascata-build .vb-v2-segmented button {
  color: #646a6e;
  background: transparent;
}

body.smart-cascata-build .vb-screen-tab.active,
body.smart-cascata-build .vb-local-tabs .btn:not(.secondary),
body.smart-cascata-build .vb-v2-segmented button.active {
  background: var(--smart-teal-soft);
  color: #15756d;
  border-color: rgb(31 143 134 / 18%);
}

body.smart-cascata-build .vb-plus,
body.smart-cascata-build .vb-v2-list-plus {
  background: #fff;
  border-color: var(--line);
  color: var(--smart-teal);
}

body.smart-cascata-build .vb-canvas-panel,
body.smart-cascata-build .vb-panel,
body.smart-cascata-build .vb-v2-screen-row,
body.smart-cascata-build .vb-dialog {
  color: var(--smart-ink);
}

body.smart-cascata-build .vb-canvas {
  background: #f8f8f5;
  border-color: var(--line);
}

body.smart-cascata-build .vb-mock-app,
body.smart-cascata-build .vb-v2-screen-row,
body.smart-cascata-build .vb-v2-check-items li {
  background: #fff;
  border-color: var(--line);
  color: var(--smart-ink);
}

body.smart-cascata-build .vb-status,
body.smart-cascata-build .vb-v2-state.ready,
body.smart-cascata-build .vb-v2-percent,
body.smart-cascata-build .vb-v2-kind {
  color: #15756d;
}

body.smart-cascata-build .vb-v2-big-progress,
body.smart-cascata-build .vb-v2-screen-progress i,
body.smart-cascata-build .vb-v2-tab-meta i {
  background: #efefeb;
}

body.smart-cascata-build .vb-v2-big-progress i b,
body.smart-cascata-build .vb-v2-screen-progress i b,
body.smart-cascata-build .vb-v2-tab-meta i b {
  background: var(--smart-teal);
}

body.smart-cascata-build input,
body.smart-cascata-build textarea,
body.smart-cascata-build select {
  background: #fff;
  border-color: var(--line);
  color: var(--smart-ink);
}

body.smart-cascata-build input:focus,
body.smart-cascata-build textarea:focus,
body.smart-cascata-build select:focus {
  outline: none;
  border-color: rgb(31 143 134 / 55%);
  box-shadow: 0 0 0 3px rgb(31 143 134 / 10%);
}

body.smart-cascata-build .btn {
  border: 1px solid var(--smart-teal);
  border-radius: 12px;
  background: var(--smart-teal);
  color: #fff;
  box-shadow: 0 5px 18px -12px rgb(31 143 134 / 70%);
}

body.smart-cascata-build .btn.secondary {
  border-color: var(--line);
  background: #fff;
  color: var(--smart-ink);
  box-shadow: none;
}

body.smart-cascata-build .btn.danger {
  border-color: rgb(199 91 97 / 22%);
  background: var(--smart-rose-soft);
  color: var(--smart-rose);
  box-shadow: none;
}

body.smart-cascata-build .btn:hover {
  filter: brightness(.98);
  transform: translateY(-1px);
}

/* Founder authorization center follows the same visual system. */
body.smart-cascata-build .founder-auth-center {
  margin: 0 0 18px;
}

body.smart-cascata-build .founder-auth-bell {
  color: var(--smart-ink) !important;
  background: #fff !important;
  border-color: var(--line) !important;
  border-radius: 18px !important;
  box-shadow: var(--smart-shadow) !important;
}

body.smart-cascata-build .founder-auth-center.has-pending .founder-auth-bell {
  border-color: rgb(31 143 134 / 35%) !important;
  box-shadow: var(--smart-shadow-hover) !important;
}

body.smart-cascata-build .founder-auth-bell small,
body.smart-cascata-build .founder-auth-title small,
body.smart-cascata-build .founder-auth-card-head small {
  color: #15756d !important;
}

body.smart-cascata-build .founder-auth-bell b {
  background: var(--smart-teal) !important;
  color: #fff !important;
}

body.smart-cascata-build .founder-auth-drawer {
  color: var(--smart-ink) !important;
  background: #fff !important;
  border-color: var(--line) !important;
}

body.smart-cascata-build .founder-auth-title > button {
  color: var(--smart-ink) !important;
}

body.smart-cascata-build .founder-auth-card {
  background: #fbfbf9 !important;
  border-color: var(--line) !important;
}

body.smart-cascata-build .founder-auth-card > p,
body.smart-cascata-build .founder-auth-card pre,
body.smart-cascata-build .founder-auth-empty {
  color: #666d71 !important;
}

body.smart-cascata-build .founder-auth-grid div {
  background: #fff !important;
  border-color: var(--line) !important;
}

body.smart-cascata-build .founder-auth-grid dt {
  color: var(--muted) !important;
}

body.smart-cascata-build .founder-auth-grid dd {
  color: var(--smart-ink) !important;
}

body.smart-cascata-build .founder-auth-balance-warning,
body.smart-cascata-build .founder-auth-error {
  color: #8a641d !important;
  background: var(--smart-amber-soft) !important;
  border-color: rgb(199 139 46 / 20%) !important;
}

body.smart-cascata-build .tabbar {
  background: rgb(255 255 255 / 96%);
  border-top-color: var(--line);
}

@media (max-width: 980px) {
  body.smart-cascata-build .fab-lounge-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body.smart-cascata-build .smart-build-hero-top {
    align-items: flex-start;
    flex-direction: column;
  }
  body.smart-cascata-build .smart-build-hero-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 860px) {
  body.smart-cascata-build .layout {
    grid-template-columns: 1fr;
  }
  body.smart-cascata-build main {
    padding: 16px 12px 28px;
  }
  body.smart-cascata-build .topbar {
    padding: 8px 10px;
  }
  body.smart-cascata-build .hamburger {
    background: #fff;
    color: var(--smart-ink);
    border: 1px solid var(--line);
  }
}

@media (max-width: 620px) {
  body.smart-cascata-build .smart-build-hero {
    padding: 22px 18px;
    border-radius: 22px;
  }
  body.smart-cascata-build .smart-build-hero h1 {
    font-size: 42px;
  }
  body.smart-cascata-build .fab-lounge-tabs {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  body.smart-cascata-build .fab-lounge-tab {
    min-height: 104px;
    padding: 13px;
  }
  body.smart-cascata-build .smart-build-action {
    flex: 1;
    min-width: 130px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.smart-cascata-build .fab-lounge-tab,
  body.smart-cascata-build .smart-build-action,
  body.smart-cascata-build .btn {
    transition: none;
    transform: none !important;
  }
}