/* LaunchCart UI v9 — clean RTL mobile shell, summary dashboard, and journey roadmap */
:root{
  --bg:#f3f6fb;
  --bg-2:#eaf0f8;
  --surface:#ffffff;
  --surface-soft:#f8fafc;
  --text:#111827;
  --muted:#667085;
  --soft:#98a2b3;
  --line:#e3eaf3;
  --line-strong:#d7e1ee;
  --navy-950:#020617;
  --navy-925:#041027;
  --navy-900:#061331;
  --navy-850:#08205c;
  --blue:#2563eb;
  --blue-2:#2f6bff;
  --blue-3:#60a5fa;
  --blue-soft:#eef4ff;
  --green:#16a34a;
  --green-soft:#ecfdf3;
  --orange:#f97316;
  --orange-soft:#fff7ed;
  --purple:#7c3aed;
  --purple-soft:#f4edff;
  --red:#ef4444;
  --radius-xl:28px;
  --radius-lg:22px;
  --shadow-soft:0 10px 28px rgba(15,23,42,.065);
  --shadow-card:0 16px 44px rgba(15,23,42,.09);
  --shadow-hero:0 26px 70px rgba(2,6,23,.26);
  --bottom-nav-h:86px;
  --app-max:430px;
}

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{width:100%;min-height:100%;background:var(--bg);direction:rtl}
body{
  margin:0;
  width:100%;
  min-height:100dvh;
  overflow-x:hidden;
  color:var(--text);
  background:
    radial-gradient(circle at 15% -5%,rgba(96,165,250,.18),transparent 28%),
    linear-gradient(180deg,#f8fbff 0%,#eef3f9 100%);
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Segoe UI",Tahoma,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
  overscroll-behavior-y:none;
}
button,input,textarea,select{font:inherit}
button{border:0;background:transparent;color:inherit;cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.52}
svg{display:block;max-width:100%;flex-shrink:0}

.app{
  width:100%;
  max-width:var(--app-max);
  min-height:100dvh;
  margin:0 auto;
  padding:0 14px calc(var(--bottom-nav-h) + 54px + env(safe-area-inset-bottom));
  position:relative;
  background:transparent;
  isolation:isolate;
}
.app > section,
.sm-page,
.summary-dashboard{
  padding-bottom:calc(var(--bottom-nav-h) + 34px + env(safe-area-inset-bottom));
}

/* =========================================================
   1) Safe premium app shell/header
   ========================================================= */
.topbar{
  position:relative!important;
  z-index:60;
  margin:0 -14px!important;
  padding:calc(44px + env(safe-area-inset-top)) 22px 18px!important;
  color:#fff!important;
  background:
    radial-gradient(circle at 82% 18%,rgba(47,107,255,.34),transparent 30%),
    radial-gradient(circle at 26% 92%,rgba(96,165,250,.14),transparent 34%),
    linear-gradient(145deg,#020617 0%,#06122e 47%,#071d59 74%,#0d3a9c 100%)!important;
  border:0!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  overflow:hidden;
}
.topbar:before{
  content:"";
  position:absolute;
  inset:auto auto -20px -90px;
  width:260px;
  height:150px;
  border-radius:60%;
  border-top:12px solid rgba(255,255,255,.10);
  transform:rotate(16deg);
  pointer-events:none;
}
.topbar:after{
  content:"";
  position:absolute;
  inset:8px -64px auto auto;
  width:250px;
  height:160px;
  border-radius:50%;
  border-top:12px solid rgba(255,255,255,.08);
  border-right:12px solid rgba(255,255,255,.045);
  transform:rotate(-18deg);
  pointer-events:none;
}

.brand-row{
  position:relative!important;
  z-index:3;
  min-height:72px;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}
.brand{
  min-width:0;
  width:100%;
  max-width:250px;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  text-align:center!important;
  pointer-events:none;
}
.logo,.logo-wordmark,.brand-name{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.logo-wordmark,.brand-name{
  color:#fff!important;
  font-size:25px!important;
  line-height:1!important;
  font-weight:900!important;
  letter-spacing:-.7px!important;
  text-shadow:0 12px 30px rgba(0,0,0,.28);
}
.brand-name span{color:#fff!important}
.brand-sub{
  display:block!important;
  width:100%;
  max-width:240px!important;
  margin:0!important;
  color:rgba(219,234,254,.70)!important;
  font-size:12.5px!important;
  line-height:1.35!important;
  font-weight:700!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  text-align:center!important;
}
.brand-row > div:last-child{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  pointer-events:none!important;
  transform:none!important;
}
.icon-btn{
  position:absolute!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:52px!important;
  min-width:52px!important;
  height:52px!important;
  min-height:52px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.085)!important;
  border:1px solid rgba(255,255,255,.18)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 16px 34px rgba(0,0,0,.17)!important;
  backdrop-filter:blur(16px)!important;
  color:#fff!important;
  font-size:0!important;
  overflow:hidden!important;
  pointer-events:auto!important;
}
.icon-btn[data-action="show-help"]{left:0!important}
.icon-btn[data-action="show-help"]:before{
  content:"";
  width:24px;
  height:24px;
  background:center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 8a6 6 0 1 1 12 0c0 7 3 7 3 9H3c0-2 3-2 3-9'/%3E%3Cpath d='M10 21h4'/%3E%3C/svg%3E");
}
.icon-btn[data-action="logout"]{
  right:0!important;
  width:76px!important;
  min-width:76px!important;
  color:transparent!important;
  background:rgba(255,255,255,.075)!important;
}
.icon-btn[data-action="logout"]:before{
  content:"";
  position:absolute;
  right:8px;
  width:40px;
  height:40px;
  border-radius:999px;
  background:
    radial-gradient(circle at 50% 36%,#f8fafc 0 15%,#94a3b8 16% 25%,#111827 26% 41%,#cbd5e1 42% 68%,#f8fafc 69% 100%);
  box-shadow:0 0 0 1px rgba(255,255,255,.32),0 8px 20px rgba(0,0,0,.18);
}
.icon-btn[data-action="logout"]:after{
  content:"";
  position:absolute;
  left:14px;
  top:50%;
  width:10px;
  height:10px;
  border-right:2px solid rgba(255,255,255,.88);
  border-bottom:2px solid rgba(255,255,255,.88);
  transform:translateY(-68%) rotate(45deg);
}

/* =========================================================
   2) Bottom navigation — floating pill, no content collision
   ========================================================= */
.tabs{
  position:fixed!important;
  left:50%!important;
  right:auto!important;
  bottom:calc(10px + env(safe-area-inset-bottom))!important;
  transform:translateX(-50%)!important;
  z-index:100!important;
  width:min(calc(100vw - 28px),404px)!important;
  min-height:76px!important;
  margin:0!important;
  display:grid!important;
  grid-template-columns:repeat(2,1fr)!important;
  gap:8px!important;
  padding:8px!important;
  background:rgba(255,255,255,.94)!important;
  border:1px solid rgba(224,231,242,.96)!important;
  border-radius:32px!important;
  box-shadow:0 24px 70px rgba(15,23,42,.22)!important;
  backdrop-filter:blur(24px)!important;
}
.tab{
  min-width:0!important;
  min-height:58px!important;
  border-radius:25px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
  background:transparent!important;
  border:0!important;
  color:#667085!important;
  font-size:12.5px!important;
  font-weight:900!important;
  line-height:1!important;
  box-shadow:none!important;
  transition:transform .14s ease,background .14s ease,color .14s ease,box-shadow .14s ease;
}
.tab:active{transform:scale(.98)}
.tab.active{
  color:#fff!important;
  background:linear-gradient(145deg,#2f6bff,#1554ef)!important;
  box-shadow:0 16px 36px rgba(37,99,235,.34)!important;
}
.nav-icon,.tab .emoji{display:flex!important;align-items:center!important;justify-content:center!important;line-height:1!important}
.nav-icon svg{width:24px!important;height:24px!important}
.tab span:last-child{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* =========================================================
   3) Hero system — shared language, different page purpose
   ========================================================= */
.hero,.page-hero,.summary-hero,.sm-hero{
  position:relative!important;
  overflow:hidden!important;
  margin:0 -14px 0!important;
  color:#fff!important;
  background:
    radial-gradient(circle at 77% 36%,rgba(69,130,255,.42),transparent 25%),
    radial-gradient(circle at 92% 88%,rgba(37,99,235,.34),transparent 31%),
    linear-gradient(145deg,#020617 0%,#061331 44%,#0a2c7a 76%,#1554ef 100%)!important;
  border:0!important;
  border-radius:0 0 42px 42px!important;
  box-shadow:var(--shadow-hero)!important;
  backdrop-filter:none!important;
}
.hero,.page-hero,.sm-hero{
  min-height:326px;
  padding:44px 22px 88px!important;
}
.summary-hero{
  min-height:458px;
  padding:42px 22px 30px!important;
}
.hero:before,.page-hero:before,.summary-hero:before,.sm-hero:before{
  content:"";
  position:absolute;
  z-index:0;
  right:58px;
  top:64px;
  width:152px;
  height:152px;
  opacity:.82;
  filter:drop-shadow(0 0 18px rgba(96,165,250,.72));
  background:
    linear-gradient(90deg,rgba(255,255,255,.72),rgba(96,165,250,.54)) 27px 20px/4px 86px no-repeat,
    linear-gradient(135deg,#3b82f6 0 62%,transparent 63%) 31px 18px/82px 44px no-repeat,
    radial-gradient(ellipse at 50% 78%,rgba(96,165,250,.52) 0 18px,transparent 19px);
  pointer-events:none;
}
.hero:after,.page-hero:after,.summary-hero:after,.sm-hero:after{
  content:"";
  position:absolute;
  z-index:0;
  right:-78px;
  bottom:72px;
  width:348px;
  height:178px;
  border-radius:56% 0 0 48%;
  border-top:12px solid rgba(255,255,255,.48);
  border-right:12px solid rgba(96,165,250,.32);
  box-shadow:inset 22px 22px 0 rgba(37,99,235,.16),0 0 18px rgba(96,165,250,.70),0 0 58px rgba(37,99,235,.45);
  transform:rotate(-13deg);
  opacity:.76;
  pointer-events:none;
}
.summary-hero:before{right:52px;top:58px;opacity:.62}
.summary-hero:after{bottom:118px;opacity:.46}
.hero > *,.page-hero > *,.summary-hero > *,.sm-hero > *{position:relative;z-index:2}
.hero-top-row,.page-hero-top,.sm-hero-hdr{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  margin:0 0 18px!important;
}
.summary-hero-glow{display:none!important}
.eyebrow,.status-pill,.hero-progress-chip,.sm-date-pill,.summary-next-eyebrow{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:34px;
  padding:8px 13px;
  border-radius:999px;
  color:#dbeafe;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
  backdrop-filter:blur(14px);
  font-size:12px;
  line-height:1;
  font-weight:900;
  white-space:nowrap;
}
.hero h1,.page-hero h1,.summary-hero-title,.sm-h1{
  max-width:59%!important;
  margin:17px 0 12px!important;
  color:#fff!important;
  font-size:36px!important;
  line-height:1.14!important;
  font-weight:950!important;
  letter-spacing:-1px!important;
  text-align:right!important;
  text-shadow:0 14px 36px rgba(0,0,0,.28);
}
.hero p,.page-hero p,.summary-hero-sub,.sm-sub{
  max-width:61%!important;
  margin:0!important;
  color:rgba(219,234,254,.88)!important;
  font-size:15.5px!important;
  line-height:1.85!important;
  text-align:right!important;
}

/* =========================================================
   4) Journey floating progress card
   ========================================================= */
.compact-progress-card{
  position:relative!important;
  z-index:8;
  margin:-54px 12px 24px!important;
  padding:18px!important;
  border-radius:28px!important;
  background:rgba(255,255,255,.98)!important;
  border:1px solid rgba(230,235,243,.96)!important;
  box-shadow:0 24px 58px rgba(15,23,42,.15)!important;
  backdrop-filter:blur(18px)!important;
}
.progress-info{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:12px;
  color:#667085;
  font-size:13.5px;
  font-weight:900;
}
.progress-info b{color:#2563eb;font-size:15px;font-weight:950}
.progress-track{
  height:12px;
  border-radius:999px;
  background:#e8eef7;
  overflow:hidden;
}
.progress-fill{
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg,#60a5fa,#2563eb);
  box-shadow:0 0 16px rgba(37,99,235,.35);
}

/* =========================================================
   5) Summary dashboard hero and rail
   ========================================================= */
.summary-metrics,.sm-stats-row,.hero-grid,.quick-metrics{
  display:grid!important;
  grid-template-columns:repeat(3,1fr)!important;
  gap:9px!important;
  margin-top:24px!important;
}
.summary-metric,.sm-sbox,.hero-stat,.quick-metrics div{
  min-width:0;
  min-height:106px;
  padding:13px 9px!important;
  border-radius:23px!important;
  background:rgba(255,255,255,.105)!important;
  border:1px solid rgba(255,255,255,.155)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08)!important;
  backdrop-filter:blur(14px)!important;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:#fff;
}
.summary-metric-icon,.sm-sbox-icon{
  width:38px;
  height:38px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:8px;
  color:#bfdbfe;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.14);
}
.summary-metric-icon svg{width:21px;height:21px}
.summary-metric-num,.sm-sbox-num,.hero-stat b,.quick-metrics b{
  display:block;
  color:#fff!important;
  font-size:27px!important;
  line-height:1!important;
  font-weight:950!important;
  letter-spacing:-.4px;
}
.summary-metric-label,.sm-sbox-label,.hero-stat span,.quick-metrics span{
  display:block;
  margin-top:7px;
  color:#c8dbff!important;
  font-size:11.5px!important;
  line-height:1.35;
  font-weight:800;
}
.sm-ring-wrap{position:relative;display:flex;align-items:center;justify-content:center;margin-bottom:8px}
.sm-ring-svg{display:block;width:42px;height:42px}
.sm-ring-lbl{position:absolute;color:#fff;font-size:10.5px;font-weight:950;line-height:1;white-space:nowrap}
.summary-progress-rail{
  margin-top:18px;
  padding:16px;
  border-radius:24px;
  background:rgba(255,255,255,.095);
  border:1px solid rgba(255,255,255,.15);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(14px);
}
.summary-rail-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:11px;color:#fff;font-weight:900}
.summary-rail-label{color:#dbeafe;font-size:12.5px;line-height:1.35}
.summary-rail-pct{font-size:16px;color:#fff}
.summary-rail-bar{height:11px;border-radius:999px;background:rgba(255,255,255,.18);overflow:hidden}
.summary-rail-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,#60a5fa,#2563eb);box-shadow:0 0 18px rgba(96,165,250,.55)}
.summary-rail-milestones{display:flex;justify-content:space-between;margin-top:10px;color:#dbeafe;font-size:11px;font-weight:900}
.summary-rail-next{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  margin-top:12px;
  min-height:34px;
  padding:8px 12px;
  border-radius:999px;
  color:#dbeafe;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.10);
  font-size:12px;
  font-weight:900;
  line-height:1.35;
  text-align:center;
}

/* =========================================================
   6) Section headers
   ========================================================= */
.task-phase,.summary-section-label,.sm-section-title,.sm-section-hdr{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  flex-direction:row-reverse!important;
  gap:12px!important;
  margin:28px 4px 13px!important;
  color:#10162a!important;
  font-size:23px!important;
  line-height:1.25!important;
  font-weight:950!important;
  letter-spacing:-.55px!important;
  text-align:right!important;
}
.task-phase:after,
.summary-section-label:before,
.sm-section-title:before,
.sm-section-hdr:before{
  content:"";
  width:46px;
  height:46px;
  min-width:46px;
  border-radius:18px;
  background:
    radial-gradient(circle at 40% 34%,rgba(96,165,250,.46),transparent 28%),
    linear-gradient(145deg,#ffffff,#eef4ff);
  border:1px solid #dbeafe;
  box-shadow:0 9px 22px rgba(37,99,235,.10);
}
.summary-section-label svg,.sm-section-title svg,.sm-section-hdr svg{display:none!important}

/* =========================================================
   7) Common card and button language
   ========================================================= */
.panel,.foundation-card,.task-card,.stat,.summary-item,.analysis-card,.modal,.loading-card,
.summary-next-card,.summary-suggestion,.summary-stage-card,.summary-founder-card{
  background:rgba(255,255,255,.985)!important;
  border:1px solid rgba(226,234,244,.98)!important;
  border-radius:28px!important;
  box-shadow:var(--shadow-soft)!important;
}
.panel{padding:17px!important;margin-bottom:14px!important}
.action-panel{background:linear-gradient(180deg,#fff,#f8fbff)!important;border-color:#dbeafe!important}
.panel-title{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
.panel h2,.panel h3,.panel-title h2,.panel-title h3{margin:0;color:#10162a;letter-spacing:-.4px}
.panel h2,.panel-title h2{font-size:21px;line-height:1.35;font-weight:950}
.panel h3,.panel-title h3{font-size:18px;line-height:1.4;font-weight:900}
.muted,.small,.tiny{color:#667085;line-height:1.7}
.muted{font-size:14px}.small{font-size:12.8px}.tiny{font-size:11.5px;color:#98a2b3}

.btn,.small-btn,.link-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:50px;
  padding:13px 17px;
  border-radius:19px;
  font-weight:950;
  line-height:1.25;
  white-space:nowrap;
  transition:transform .15s ease,box-shadow .15s ease,background .15s ease,opacity .15s ease;
}
.btn:active,.small-btn:active,.link-btn:active{transform:scale(.985)}
.btn.primary,.summary-cta-btn,.summary-suggestion-btn{
  color:#fff!important;
  background:linear-gradient(145deg,#2f6bff,#1554ef)!important;
  box-shadow:0 16px 34px rgba(37,99,235,.28)!important;
}
.btn.secondary{
  color:#344054!important;
  background:#fff!important;
  border:1px solid #e3e9f2!important;
  box-shadow:0 8px 22px rgba(16,24,40,.04)!important;
}
.btn.ghost{
  color:#475467!important;
  background:#f8fafc!important;
  border:1px solid #e3e9f2!important;
}
.btn.full{width:100%}
.small-btn{min-height:40px;padding:9px 13px;border-radius:15px;font-size:13px}
.link-btn{min-height:auto;padding:8px 4px;color:#667085;background:transparent}

.badge,.required-tag,.ghs-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  min-height:27px;
  padding:7px 11px;
  border-radius:999px;
  color:#1d4ed8;
  background:#eef4ff;
  border:1px solid #dbeafe;
  font-size:11.5px;
  line-height:1;
  font-weight:900;
  white-space:nowrap;
}
.badge.green,.badge.good{color:#15803d;background:#ecfdf3;border-color:#bbf7d0}
.badge.orange,.badge.warn{color:#c2410c;background:#fff7ed;border-color:#fed7aa}
.badge.purple{color:#6d28d9;background:#f4edff;border-color:#e9d5ff}
.badge.gray,.badge.light{color:#64748b;background:#f3f6fa;border-color:#e7edf5}
.badge.dark{color:#fff;background:#0f172a;border-color:#0f172a}
.done-task .task-top .badge.green{color:#15803d;background:#ecfdf3;border-color:#bbf7d0}
.required-tag{min-height:auto;margin-inline-start:6px;padding:4px 8px;font-size:10.5px}
.required-tag.light{color:#64748b;background:#f8fafc;border-color:#e5e7eb}

/* =========================================================
   8) Journey roadmap cards — compact premium, not green alerts
   ========================================================= */
.card-list{display:grid;gap:12px}
.card-list.journey-grid{grid-template-columns:1fr}
.task-card{
  position:relative;
  width:100%;
  padding:16px!important;
  border-radius:26px!important;
  text-align:right!important;
  background:#fff!important;
  border-color:#e5edf7!important;
  box-shadow:0 10px 26px rgba(15,23,42,.055)!important;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease;
  overflow:hidden;
}
.task-card:active{transform:scale(.992)}
.task-card.done-task,
.task-card.featured-task{
  background:linear-gradient(180deg,#fff 0%,#fbfffc 100%)!important;
  border-color:#c8f3d4!important;
  box-shadow:0 12px 30px rgba(22,163,74,.065)!important;
}
.task-card.done-task:before{
  content:"";
  position:absolute;
  inset:0 0 auto auto;
  width:5px;
  height:100%;
  background:linear-gradient(180deg,#22c55e,#86efac);
  opacity:.92;
}
.locked-task,
.journey-foundation-card{
  background:#f8fafc!important;
  border-color:#e6edf6!important;
  opacity:.82!important;
  cursor:default!important;
}
.task-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:11px}
.task-card h3{
  margin:0 0 7px;
  color:#10162a;
  font-size:20px;
  line-height:1.28;
  font-weight:950;
  letter-spacing:-.35px;
}
.task-card p{margin:0;color:#667085;font-size:14px;line-height:1.65}
.task-artifact{
  display:grid;
  gap:4px;
  margin:13px 0 0;
  padding:12px 13px;
  border-radius:19px;
  background:#f8fbff;
  border:1px solid #e5edf8;
}
.task-artifact span{color:#8b98ad;font-size:11.5px;font-weight:850}
.task-artifact b{color:#10162a;font-size:14px;line-height:1.42;font-weight:950}
.task-foot{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px}
.locked-task h3{margin-bottom:0;color:#344054;font-size:18px}
.locked-task .task-foot{justify-content:space-between;color:#98a2b3}
.locked-task svg{opacity:.78}

/* =========================================================
   9) Summary dashboard cards and rows
   ========================================================= */
.summary-next-card,.summary-suggestion,.summary-stage-card,.summary-founder-card{
  padding:16px!important;
  margin-bottom:13px!important;
  overflow:hidden;
}
.summary-next-card{
  display:block;
  width:100%;
  text-align:right;
  background:linear-gradient(180deg,#fff,#f7fbff)!important;
  border-color:#dbeafe!important;
  box-shadow:0 14px 36px rgba(37,99,235,.10)!important;
}
.summary-next-eyebrow{
  width:max-content;
  color:#2563eb;
  background:#eef4ff;
  border-color:#dbeafe;
  box-shadow:none;
  backdrop-filter:none;
  margin-bottom:12px;
}
.summary-next-inner{display:block}
.summary-next-badge{
  display:inline-flex;
  margin-bottom:9px;
  padding:7px 11px;
  border-radius:999px;
  background:#eef4ff;
  color:#2563eb;
  font-size:11.5px;
  font-weight:950;
}
.summary-next-title{margin:0;color:#10162a;font-size:22px;line-height:1.3;font-weight:950;letter-spacing:-.35px}
.summary-next-desc{margin:6px 0 0;color:#667085;font-size:14px;line-height:1.65}
.summary-next-cta{margin-top:14px}
.summary-cta-btn,.summary-suggestion-btn{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  border-radius:18px;
  min-height:48px;
  padding:12px 18px;
  font-weight:950;
}

.summary-artifacts-scroll{
  overflow-x:auto;
  overflow-y:hidden;
  margin:0 -14px;
  padding:0 14px 8px;
  scroll-snap-type:x proximity;
  scroll-padding-inline:14px;
  scrollbar-width:none;
}
.summary-artifacts-scroll::-webkit-scrollbar{display:none}
.summary-artifacts-track{display:flex;gap:10px;min-width:max-content}
.summary-artifact-card{
  width:142px;
  min-height:132px;
  padding:13px 11px;
  border-radius:23px;
  background:#fff;
  border:1px solid #e6ebf3;
  box-shadow:0 10px 26px rgba(16,24,40,.055);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  text-align:center;
  scroll-snap-align:start;
}
button.summary-artifact-card{cursor:pointer}
.summary-artifact-icon{
  width:43px;
  height:43px;
  border-radius:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#2563eb;
  background:#eef4ff;
  border:1px solid #dbeafe;
}
.summary-artifact-icon svg{width:18px;height:18px}
.summary-artifact-body{display:grid;gap:3px;min-width:0;max-width:100%}
.summary-artifact-title{display:block;color:#10162a;font-size:13px;font-weight:950;line-height:1.32;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:118px}
.summary-artifact-value{display:block;color:#667085;font-size:11.5px;font-weight:800;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:118px}
.summary-artifact-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:6px 9px;
  border-radius:999px;
  background:#eef4ff;
  color:#2563eb;
  font-size:10.5px;
  line-height:1;
  font-weight:950;
}
.summary-artifact-card--confirmed{border-color:#dbeafe;background:linear-gradient(180deg,#fff,#fbfdff)}
.summary-artifact-pill--confirmed{background:#ecfdf3;color:#15803d}
.summary-artifact-card--pending{border-color:#fed7aa;background:#fffdf9}
.summary-artifact-pill--pending{background:#fff7ed;color:#c2410c}
.summary-artifact-card--future{background:#f8fafc;border-color:#e6ebf3;box-shadow:none}
.summary-artifact-card--future .summary-artifact-icon{color:#94a3b8;background:#f1f5f9;border-color:#e2e8f0}
.summary-artifact-pill--future{background:#f3f6fa;color:#667085}

.summary-suggestion{
  display:flex!important;
  align-items:center!important;
  gap:13px!important;
  border-color:#dbeafe!important;
  background:linear-gradient(135deg,#fff,#f8faff)!important;
}
.summary-suggestion-icon{
  width:54px;
  height:54px;
  min-width:54px;
  border-radius:20px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  background:linear-gradient(145deg,#7c3aed,#2563eb);
  box-shadow:0 14px 30px rgba(124,58,237,.22);
}
.summary-suggestion-body{flex:1;min-width:0}
.summary-suggestion-text{margin:0 0 12px;color:#344054;font-size:14px;line-height:1.7}

.summary-stage-list{display:grid;gap:11px}
.summary-stage-card{padding:14px!important}
.summary-stage-head{
  display:flex!important;
  align-items:center!important;
  gap:11px!important;
  list-style:none!important;
  cursor:pointer;
}
.summary-stage-head::-webkit-details-marker{display:none}
.summary-stage-num{
  width:48px;
  height:48px;
  min-width:48px;
  border-radius:19px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#eef4ff;
  color:#2563eb;
  font-size:19px;
  font-weight:950;
}
.summary-stage-info{flex:1;min-width:0;display:grid;gap:3px;text-align:right}
.summary-stage-title{color:#10162a;font-size:17px;font-weight:950;line-height:1.35}
.summary-stage-count{color:#667085;font-size:12.5px;font-weight:850}
.summary-stage-chevron{color:#98a2b3;transition:transform .18s ease}
details[open] > .summary-stage-head .summary-stage-chevron{transform:rotate(180deg)}
.summary-stage-rows{display:grid;gap:8px;margin-top:13px}
.summary-dec-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:11px;
  padding:11px 12px;
  border-radius:16px;
  background:#f8fafc;
  border:1px solid #e6ebf3;
}
.summary-dec-main{display:grid;gap:3px;min-width:0;text-align:right}
.summary-dec-label{color:#667085;font-size:11.5px;font-weight:850;line-height:1.35}
.summary-dec-val{color:#10162a;font-size:13.5px;font-weight:950;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.summary-dec-pill{
  flex-shrink:0;
  padding:6px 9px;
  border-radius:999px;
  background:#eafaf0;
  color:#15803d;
  font-size:10.5px;
  font-weight:950;
  line-height:1;
}
.summary-dec-pill--saved{background:#eef4ff;color:#2563eb}
.summary-stage-card--future{background:#f8fafc!important;box-shadow:none!important;opacity:.86}
.summary-stage-card--future .summary-stage-num{background:#f1f5f9;color:#94a3b8}

.summary-founder-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.summary-founder-header .summary-section-label{margin:0!important;font-size:18px!important;gap:8px!important}
.summary-founder-header .summary-section-label:before{display:none}
.summary-founder-rows{display:grid;gap:8px}
.summary-founder-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:11px 12px;
  border-radius:16px;
  background:#f8fafc;
  border:1px solid #e6ebf3;
}
.summary-founder-row span{color:#667085;font-size:12px;font-weight:850}
.summary-founder-row b{color:#10162a;font-size:13.5px;font-weight:950;text-align:left}
.summary-danger-zone{
  margin-top:14px;
  margin-bottom:calc(var(--bottom-nav-h) + 18px);
  border-radius:22px;
  background:#fff;
  border:1px solid #e6ebf3;
  box-shadow:var(--shadow-soft);
  overflow:hidden;
}
.summary-danger-head{list-style:none;padding:14px 16px;display:flex;align-items:center;gap:10px;color:#667085;font-weight:900;cursor:pointer}
.summary-danger-head::-webkit-details-marker{display:none}
.summary-danger-body{padding:0 16px 16px}
.summary-danger-warn{margin:0 0 12px;color:#991b1b;font-size:13px;line-height:1.6}

/* =========================================================
   10) Mission/detail/form screens — reduce bulk, keep CTA reachable
   ========================================================= */
.foundation-card{
  overflow:hidden!important;
  border-radius:28px!important;
  margin:0 0 14px!important;
}
.card-head{
  position:relative;
  padding:19px 18px!important;
  background:linear-gradient(180deg,#fff,#fbfdff)!important;
  border-bottom:1px solid #edf2f7;
}
.card-kicker{display:flex;align-items:center;gap:9px;margin-bottom:9px;color:#2563eb;font-size:12px;font-weight:950}
.card-kicker span:first-child{
  width:40px;
  height:40px;
  border-radius:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#2563eb;
  background:#eef4ff;
  border:1px solid #dbeafe;
}
.card-head h2{margin:0 0 7px;color:#10162a;font-size:22px;line-height:1.32;font-weight:950;letter-spacing:-.5px}
.card-head p{margin:0;color:#667085;font-size:13.5px;line-height:1.7}
.card-body{padding:17px!important}
.field,.mission-field{display:block;margin-bottom:13px}
.label{display:block;margin-bottom:8px;color:#1f2937;font-size:13.5px;line-height:1.45;font-weight:900}
.input,.textarea,.select{
  width:100%;
  outline:none;
  color:#10162a;
  background:#fff;
  border:1px solid #dbe3ee;
  border-radius:19px;
  padding:13px 14px;
  box-shadow:0 2px 10px rgba(16,24,40,.025);
  transition:border-color .16s ease,box-shadow .16s ease;
}
.input,.select{min-height:54px}
.textarea{min-height:92px;resize:vertical;line-height:1.7}
.input:focus,.textarea:focus,.select:focus{border-color:#3b82f6;box-shadow:0 0 0 4px rgba(59,130,246,.12)}
.nav-actions{
  position:static!important;
  display:grid!important;
  grid-template-columns:1fr 1.65fr!important;
  gap:11px!important;
  margin:18px 0 0!important;
  padding:15px 0 0!important;
  border-top:1px solid #edf2f7!important;
  background:transparent!important;
  backdrop-filter:none!important;
}
.nav-actions .btn{width:100%}

/* =========================================================
   11) Reusable utility blocks from existing app
   ========================================================= */
.grid{display:grid;gap:12px}
.grid.two{grid-template-columns:1fr!important}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  border-radius:999px;
  color:#475467;
  background:#fff;
  border:1px solid #dfe6f0;
  font-size:13px;
  line-height:1.3;
  font-weight:850;
}
.chip.active{color:#fff;background:linear-gradient(145deg,#2f6bff,#1554ef);border-color:#2563eb;box-shadow:0 10px 24px rgba(37,99,235,.20)}
.why,.lesson-box,.illustration,.expander.why,.category-hint,.manual-box,.file-placeholder{border-radius:22px;background:#f8fafc;border:1px solid #e3eaf4}
.lesson-box{padding:14px;margin-bottom:14px;background:linear-gradient(180deg,#f8fbff,#eef4ff);border-color:#dbeafe}
.lesson-box h3{margin:0 0 8px;color:#10162a;font-size:16px;font-weight:950}
.lesson-box p{margin:0;color:#344054;font-size:13.5px;line-height:1.75}
.illustration{display:flex;align-items:flex-start;gap:12px;padding:13px;margin:0 0 14px}
.illustration .bubble{
  width:42px;
  height:42px;
  min-width:42px;
  border-radius:17px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#1d4ed8;
  background:#eef4ff;
  border:1px solid #dbeafe;
  box-shadow:0 8px 18px rgba(37,99,235,.08);
  font-size:18px;
  font-weight:950;
}
.illustration b{color:#10162a;font-size:13.5px;font-weight:950}
.illustration p{margin:4px 0 0;color:#667085;font-size:12.5px;line-height:1.55}
.why{display:flex;align-items:flex-start;gap:8px;margin:8px 0 12px;padding:10px 11px;color:#667085;font-size:12px;line-height:1.6}
.why span:first-child{
  width:20px;
  height:20px;
  min-width:20px;
  border-radius:8px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#2563eb;
  background:#eef4ff;
  font-size:11px;
  font-weight:950;
}
.why span:first-child:before{content:"i";font-family:Arial,sans-serif}
.stat-grid,.mini-grid{display:grid;grid-template-columns:1fr 1fr!important;gap:10px}
.stat{padding:14px!important}
.stat span{display:block;color:#667085;font-size:12px;line-height:1.35;font-weight:850}
.stat b{display:block;margin-top:6px;color:#10162a;font-size:21px;line-height:1.15;font-weight:950;letter-spacing:-.45px}
.empty,.compact-empty{padding:17px;border-radius:22px;color:#667085;background:#fff;border:1px dashed #cbd5e1;font-size:13px;line-height:1.7}
.modal-backdrop{position:fixed;inset:0;z-index:110;display:flex;align-items:flex-end;justify-content:center;padding:12px;background:rgba(15,23,42,.56);backdrop-filter:blur(10px)}
.modal{width:100%;max-width:620px;max-height:84dvh;overflow:auto;padding:18px;border-radius:30px 30px 22px 22px!important;box-shadow:0 32px 88px rgba(0,0,0,.28)!important}
.loading{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;background:rgba(248,250,252,.78);backdrop-filter:blur(12px)}
.spinner{width:36px;height:36px;margin:0 auto 11px;border-radius:999px;border:4px solid #dbeafe;border-top-color:#2563eb;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* =========================================================
   12) Mobile QA responsive tuning
   ========================================================= */
@media (max-width:390px){
  :root{--bottom-nav-h:82px}
  .app{padding-left:10px;padding-right:10px;padding-bottom:calc(var(--bottom-nav-h) + 50px + env(safe-area-inset-bottom))}
  .topbar,.hero,.page-hero,.summary-hero,.sm-hero{margin-left:-10px!important;margin-right:-10px!important}
  .topbar{padding-left:18px!important;padding-right:18px!important;padding-top:calc(42px + env(safe-area-inset-top))!important}
  .brand-row{min-height:68px}.logo-wordmark,.brand-name{font-size:23px!important}.brand-sub{max-width:208px!important;font-size:11.8px!important}
  .icon-btn{width:48px!important;min-width:48px!important;height:48px!important;min-height:48px!important}
  .icon-btn[data-action="logout"]{width:68px!important;min-width:68px!important}.icon-btn[data-action="logout"]:before{width:37px;height:37px}
  .hero,.page-hero,.sm-hero{min-height:310px;padding:40px 19px 82px!important}
  .summary-hero{min-height:448px;padding:38px 19px 28px!important}
  .hero h1,.page-hero h1,.summary-hero-title,.sm-h1{max-width:64%!important;font-size:31px!important}
  .hero p,.page-hero p,.summary-hero-sub,.sm-sub{max-width:68%!important;font-size:14px!important;line-height:1.78!important}
  .hero:before,.page-hero:before,.summary-hero:before,.sm-hero:before{right:42px;top:62px;transform:scale(.88);transform-origin:top right}
  .hero:after,.page-hero:after,.summary-hero:after,.sm-hero:after{right:-96px;width:330px;bottom:72px;opacity:.62}
  .summary-metrics,.sm-stats-row,.hero-grid,.quick-metrics{gap:8px!important;margin-top:20px!important}
  .summary-metric,.sm-sbox,.hero-stat,.quick-metrics div{min-height:98px;padding:11px 7px!important;border-radius:21px!important}
  .summary-metric-icon{width:34px;height:34px;margin-bottom:7px}.summary-metric-num,.sm-sbox-num,.hero-stat b,.quick-metrics b{font-size:23px!important}.summary-metric-label,.sm-sbox-label,.hero-stat span,.quick-metrics span{font-size:10.5px!important}
  .summary-progress-rail{padding:14px;margin-top:15px}.summary-rail-next{font-size:11px}
  .compact-progress-card{margin-left:8px!important;margin-right:8px!important}
  .task-phase,.summary-section-label,.sm-section-title,.sm-section-hdr{font-size:21px!important}.task-phase:after,.summary-section-label:before,.sm-section-title:before,.sm-section-hdr:before{width:42px;height:42px;min-width:42px;border-radius:16px}
  .task-card h3{font-size:18.5px}.task-card p{font-size:13.5px}.summary-artifact-card{width:132px;min-height:126px}
  .tabs{width:calc(100vw - 18px)!important;min-height:72px!important}.tab{min-height:54px!important;font-size:12px!important}.nav-icon svg{width:22px!important;height:22px!important}
  .nav-actions{grid-template-columns:1fr 1.35fr!important}
}

@media (min-width:760px){
  :root{--app-max:980px}
  .app{padding-left:22px;padding-right:22px}
  .topbar,.hero,.page-hero,.summary-hero,.sm-hero{margin-left:-22px!important;margin-right:-22px!important}
  .topbar{padding-left:38px!important;padding-right:38px!important}
  .brand{max-width:360px}.brand-sub{max-width:320px!important}
  .hero,.page-hero,.sm-hero{min-height:390px;padding:58px 56px 108px!important}
  .summary-hero{min-height:520px;padding:54px 56px 42px!important}
  .hero h1,.page-hero h1,.summary-hero-title,.sm-h1{font-size:46px!important;max-width:55%!important}
  .hero p,.page-hero p,.summary-hero-sub,.sm-sub{font-size:17px!important;max-width:55%!important}
  .hero:before,.page-hero:before,.summary-hero:before,.sm-hero:before{right:150px;top:86px;transform:scale(1.18)}
  .hero:after,.page-hero:after,.summary-hero:after,.sm-hero:after{right:18px;bottom:100px;width:470px;height:220px}
  .tabs{width:min(560px,72vw)!important}
  .compact-progress-card{max-width:560px;margin-left:auto!important;margin-right:auto!important}
  .card-list.journey-grid{grid-template-columns:1fr 1fr;gap:14px}.locked-task h3{min-height:48px}
  .grid.two{grid-template-columns:1fr 1fr!important}
  .stat-grid,.mini-grid{grid-template-columns:repeat(4,1fr)!important}
  .summary-artifact-card{width:152px}.summary-artifacts-track{gap:12px}
  .summary-stage-list{grid-template-columns:1fr 1fr}.summary-stage-card:first-child,.summary-stage-card:nth-child(2),.summary-stage-card:nth-child(3){grid-column:auto}
  .modal-backdrop{align-items:center}.modal{border-radius:32px!important}
}

/* v9.1 refinements after selector audit: keep hero artwork away from RTL text and normalize section icon placement */
.hero h1,.page-hero h1,.summary-hero-title,.sm-h1,
.hero p,.page-hero p,.summary-hero-sub,.sm-sub{
  margin-left:auto!important;
}
.hero:before,.page-hero:before,.summary-hero:before,.sm-hero:before{
  right:auto;
  left:46px;
}
.hero:after,.page-hero:after,.summary-hero:after,.sm-hero:after{
  right:auto;
  left:-90px;
  transform:rotate(13deg);
}
.summary-hero:before{right:auto;left:42px}
.task-phase,.summary-section-label,.sm-section-title,.sm-section-hdr{
  flex-direction:row!important;
}
.task-phase:before{
  content:"";
  width:46px;
  height:46px;
  min-width:46px;
  border-radius:18px;
  background:radial-gradient(circle at 40% 34%,rgba(96,165,250,.46),transparent 28%),linear-gradient(145deg,#ffffff,#eef4ff);
  border:1px solid #dbeafe;
  box-shadow:0 9px 22px rgba(37,99,235,.10);
}
.task-phase:after{display:none!important}
@media (max-width:390px){
  .hero:before,.page-hero:before,.summary-hero:before,.sm-hero:before{right:auto;left:30px;transform:scale(.88);transform-origin:top left}
  .hero:after,.page-hero:after,.summary-hero:after,.sm-hero:after{right:auto;left:-112px}
  .task-phase:before{width:42px;height:42px;min-width:42px;border-radius:16px}
}
@media (min-width:760px){
  .hero:before,.page-hero:before,.summary-hero:before,.sm-hero:before{right:auto;left:150px;transform:scale(1.18);transform-origin:top left}
  .hero:after,.page-hero:after,.summary-hero:after,.sm-hero:after{right:auto;left:18px}
}
