:root { --bg:#0b0f1a; --bg2:#0e1422; --card:#121a2b; --line:#22304d;
          --txt:#e8eefc; --dim:#93a4c8; --acc:#34d399; --acc2:#60a5fa;
          --red:#f87171; --amber:#fbbf24; --shadow:0 8px 30px rgba(0,0,0,.45); }
  * { box-sizing:border-box; margin:0; padding:0; }
  html { scroll-behavior:smooth; }
  body { background:var(--bg); color:var(--txt); overflow-x:hidden;
         font:16px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; }
  a { color:var(--acc2); text-decoration:none; }
  .wrap { max-width:980px; margin:0 auto; padding:0 18px; }

  .aurora { position:fixed; inset:0; z-index:-1; overflow:hidden; pointer-events:none; }
  .aurora::before, .aurora::after { content:""; position:absolute; width:60vmax; height:60vmax;
    border-radius:50%; filter:blur(80px); opacity:.18; mix-blend-mode:screen; }
  .aurora::before { background:var(--acc); top:-20vmax; left:-15vmax;
    animation:drift1 22s ease-in-out infinite; }
  .aurora::after  { background:var(--acc2); bottom:-25vmax; right:-18vmax;
    animation:drift2 27s ease-in-out infinite; }
  @keyframes drift1 { 50% { transform:translate(8vmax,6vmax) scale(1.15); } }
  @keyframes drift2 { 50% { transform:translate(-7vmax,-5vmax) scale(1.2); } }

  /* Motion kit — every animation respects prefers-reduced-motion. */
  @keyframes riseIn { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:translateY(0); } }
  @keyframes popIn  { 0% { opacity:0; transform:scale(.96); } 60% { transform:scale(1.02); } 100% { opacity:1; transform:scale(1); } }
  @keyframes countUp { from { opacity:0.2; transform:translateX(-3px); } to { opacity:1; transform:translateX(0); } }
  @keyframes flashLine { 0% { box-shadow:0 0 0 0 rgba(52,211,153,.55); } 100% { box-shadow:0 0 0 20px rgba(52,211,153,0); } }
  @keyframes barGrow { from { width:0; } to { width:100%; } }

  section { opacity:0; transform:translateY(16px); }
  .section-in { animation:riseIn .55s cubic-bezier(.2,.7,.3,1) forwards; }
  .plan, .src, .pain, .shot, .contact, .engine-strip, .blind-cost, .dashTag .tg { transition:transform .16s ease, box-shadow .16s ease; }
  .plan:hover, .src:hover, .pain:hover, .shot:hover, .contact:hover { transform:translateY(-4px); box-shadow:var(--shadow); }
  .plan.vip { animation:popIn .5s cubic-bezier(.2,.7,.3,1); position:relative; }
  .plan.vip::after { content:"MOST POPULAR"; position:absolute; top:-9px; left:50%;
    transform:translateX(-50%); background:var(--acc); color:#06281c; font-size:10px;
    font-weight:800; letter-spacing:.08em; padding:3px 10px; border-radius:99px;
    box-shadow:0 4px 18px rgba(52,211,153,.35); }

  /* Per-day + anchor: draw the eye, never shout. */
  .perday, .anchor-note, .blind-cost { animation:flashLine 2.4s ease-out 1; }
  .perday b, .anchor-note b, .blind-cost b { animation:countUp .5s cubic-bezier(.2,.7,.3,1) both; }
  .engine-strip .es-head { animation:popIn .5s cubic-bezier(.2,.7,.3,1) .15s both; }

  @media (prefers-reduced-motion:reduce){
    .aurora::before,.aurora::after,.phone-frame,.ticker .track,.dashBar i,
    .brand .live .blip,.band .dot,.dash .live .blip,.ph-card.glow,
    .section-in,.plan.vip,.perday,.anchor-note,.blind-cost,.perday b,.anchor-note b,
    .blind-cost b,.engine-strip .es-head { animation:none !important; }
    .ticker .track { padding-left:0; }
    section { opacity:1 !important; transform:none !important; }
    html { scroll-behavior:auto; }
  }

  /* ── TOP BAR ── */
  :root { --topbar-h:49px; }
  .top { position:sticky; top:0; z-index:10; min-height:var(--topbar-h); backdrop-filter:blur(10px);
         background:rgba(11,15,26,.78); border-bottom:1px solid var(--line); }
  .top .row { max-width:980px; margin:0 auto; padding:10px 18px; display:flex;
              align-items:center; justify-content:space-between; }
  .brand { display:flex; align-items:center; gap:9px; font-weight:800; font-size:17px; }
  .brand img { width:28px; height:28px; border-radius:8px; }
  .brand .live { display:inline-flex; align-items:center; gap:6px; font-size:11.5px;
     font-weight:600; color:var(--acc); background:rgba(52,211,153,.12);
     border:1px solid rgba(52,211,153,.35); padding:3px 9px; border-radius:99px; }
  .brand .live .blip { width:6px; height:6px; border-radius:50%; background:var(--acc);
     animation:p 1.6s infinite; box-shadow:0 0 8px var(--acc); }
  /* W16 — truthful board state colours: STALE amber, PAUSED muted (not live). */
  .brand .live.live-stale { color:var(--amber, #f59e0b); border-color:rgba(245,158,11,.4); background:rgba(245,158,11,.12); }
  .brand .live.live-stale .blip { background:var(--amber, #f59e0b); box-shadow:0 0 8px var(--amber, #f59e0b); }
  .brand .live.live-paused { color:var(--muted, #94a3b8); border-color:rgba(148,163,184,.35); background:rgba(148,163,184,.10); }
  .brand .live.live-paused .blip { background:var(--muted, #94a3b8); animation:none; box-shadow:none; }
  @keyframes p { 50% { opacity:.3; } }
  .top-cta { font-weight:700; font-size:14px; padding:8px 16px; border-radius:10px;
     background:var(--acc); color:#06281c; }
  .launch-banner { position:sticky; top:var(--topbar-h); z-index:9; display:flex; align-items:center; justify-content:center; gap:12px;
    padding:10px 18px; background:linear-gradient(90deg,rgba(251,191,36,.12),rgba(52,211,153,.08));
    border-bottom:1px solid rgba(251,191,36,.28); box-shadow:0 5px 16px rgba(0,0,0,.22);
    color:var(--dim); font-size:13px; text-align:center; }
  .launch-banner[hidden] { display:none; }
  .launch-banner strong { color:var(--txt); font-weight:800; }
  .launch-count { display:inline-flex; align-items:center; gap:5px; color:var(--amber);
    font-variant-numeric:tabular-nums; font-weight:800; white-space:nowrap; }
  .launch-count small { color:var(--dim); font-size:11px; font-weight:600; }
  .launch-note { color:var(--dim); font-size:11.5px; }
  @media (max-width:640px){ .launch-banner { flex-wrap:wrap; gap:3px 8px; padding:9px 14px; } }

  /* Conversion rail: a visual, thumb-friendly shortcut for visitors who skim. */
  .signal-rail { display:grid; grid-template-columns:repeat(3,1fr); gap:10px;
    max-width:760px; margin:18px auto 0; }
  .signal { display:flex; align-items:center; gap:10px; min-height:62px;
    padding:11px 13px; border:1px solid var(--line); border-radius:15px;
    background:linear-gradient(145deg,rgba(18,26,43,.92),rgba(14,20,34,.72));
    color:var(--txt); transition:transform .16s ease,border-color .16s ease; }
  .signal:hover { transform:translateY(-3px); border-color:rgba(52,211,153,.7); }
  .signal .sig-no { display:grid; place-items:center; flex:0 0 30px; width:30px; height:30px;
    border-radius:10px; color:#06281c; background:var(--acc); font-weight:900; font-size:13px; }
  .signal:nth-child(2) .sig-no { background:var(--acc2); }
  .signal:nth-child(3) .sig-no { background:var(--amber); }
  .signal b { display:block; font-size:13px; line-height:1.15; }
  .signal span { display:block; color:var(--dim); font-size:11px; margin-top:3px; }
  .mobile-cta { display:none; }
  @media (max-width:640px){
    .signal-rail { grid-template-columns:1fr; gap:8px; margin:14px 0 0; }
    .signal { min-height:52px; padding:9px 11px; }
    .signal span { font-size:11.5px; }
    .mobile-cta { display:flex; position:fixed; left:12px; right:12px; bottom:calc(12px + env(safe-area-inset-bottom));
      z-index:30; align-items:center; justify-content:space-between; gap:10px; padding:9px 10px 9px 14px;
      background:rgba(11,15,26,.94); border:1px solid rgba(52,211,153,.45); border-radius:16px;
      box-shadow:0 12px 35px rgba(0,0,0,.5); backdrop-filter:blur(14px); }
    .mobile-cta span { color:var(--dim); font-size:12px; line-height:1.2; }
    .mobile-cta b { color:var(--txt); display:block; }
    .mobile-cta .btn { padding:10px 14px; font-size:13px; white-space:nowrap; }
    footer { padding-bottom:105px; }
  }
  @media (prefers-reduced-motion:reduce){ .signal { transition:none; } }

  .quick-start { max-width:900px; margin:24px auto 0; padding:18px 0 4px; }
  .quick-start h2 { font-size:clamp(19px,3.5vw,25px); margin-bottom:12px; }
  /* G6 — teach the @-mention: inline mode needs no install, so tell a visitor. */
  .inline-hint { font-size:13px; color:var(--dim); margin:-4px 0 14px; }
  .inline-hint b { color:var(--acc); }
  .quick-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
  .quick-card { display:flex; flex-direction:column; justify-content:center; min-height:86px;
    padding:14px 15px; border:1px solid var(--line); border-radius:15px; background:var(--card);
    color:var(--txt); transition:transform .16s ease,border-color .16s ease; }
  .quick-card:hover { transform:translateY(-3px); border-color:rgba(52,211,153,.7); }
  .quick-card b { font-size:14px; }
  .quick-card span { color:var(--dim); font-size:12px; margin-top:4px; }
  .quick-card.daily { border-color:rgba(52,211,153,.4); background:linear-gradient(145deg,rgba(52,211,153,.12),var(--card)); }
  @media (max-width:640px){ .quick-start { margin-top:18px; } .quick-grid { grid-template-columns:1fr; gap:8px; } .quick-card { min-height:62px; } }

  /* ── HERO (PAS: problem + agitate, then the solve below) ── */
  .hero { padding:46px 0 28px; text-align:center; position:relative; }
  /* warm dusk scene behind the hero (generated, illustrative) */
  .hero-bg { position:absolute; inset:-1px 0 auto; z-index:-1; height:720px; overflow:hidden; }
  .hero-bg img, .hero-bg video { width:100%; height:100%; object-fit:cover; opacity:.5; }
  .hero-bg img.off { display:none; }
  .hero-bg video.dead { display:none; }
  /* scrim: keeps hero text legible over the bright sunset + fades the scene
     smoothly into the page background (review: sunset core washed to ~3.5:1). */
  .hero-bg::after { content:""; position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(11,15,26,.25) 0%, rgba(11,15,26,.15) 38%,
      rgba(11,15,26,.55) 68%, rgba(11,15,26,.94) 100%); }
  .pill { display:inline-block; font-size:12.5px; font-weight:600; color:var(--dim);
    background:rgba(96,165,250,.08); border:1px solid var(--line);
    padding:6px 14px; border-radius:99px; margin-bottom:18px; }
  .pill b { color:var(--acc); }
  .hero h1 { font-size:clamp(28px,6.6vw,46px); line-height:1.08; letter-spacing:-.5px;
    margin:0 auto 14px; max-width:20ch; }
  .hero h1 .g { color:var(--acc); }
  .hero .sub { color:var(--dim); max-width:640px; margin:0 auto 22px;
    font-size:clamp(15px,2.6vw,18px); }
  .hero .sub b { color:var(--txt); }
  .cta { display:flex; gap:11px; justify-content:center; flex-wrap:wrap; }
  .btn { display:inline-flex; align-items:center; gap:7px; padding:14px 24px;
    border-radius:13px; font-weight:800; font-size:16px; transition:transform .15s; }
  .btn:active { transform:scale(.97); }
  .btn-p { background:var(--acc); color:#06281c; box-shadow:0 6px 20px rgba(52,211,153,.28); }
  .btn-s { background:var(--card); color:var(--txt); border:1px solid var(--line); }
  .mini { color:var(--dim); font-size:13px; margin-top:14px; }
  .mini b { color:var(--txt); }

  /* Three compact trust chips: honesty as a headline, not a wall of copy. */
  .chips { display:flex; gap:8px; justify-content:center; flex-wrap:wrap; margin:6px 0 4px; }
  .chips span { font-size:12px; font-weight:700; color:var(--dim);
    background:rgba(255,255,255,.04); border:1px solid var(--line);
    padding:5px 12px; border-radius:99px; }
  .chips span b { color:var(--acc); }

  /* G4 — "happening now": today's re-verified checked gap, so a visitor sees
     the product proving itself instead of a static recap. Honest: hidden when
     there is no measured survival today (I7). */
  .happening-now { display:flex; align-items:center; gap:10px; margin:14px auto 0;
    max-width:640px; text-align:left; font-size:13px; color:var(--dim);
    background:rgba(34,197,94,.07); border:1px solid rgba(34,197,94,.25);
    border-radius:12px; padding:9px 12px; text-decoration:none; }
  .happening-now .hn-dot { flex:none; width:8px; height:8px; border-radius:50%;
    background:var(--acc, #22c55e); animation:pulse 1.6s infinite; }
  .happening-now .hn-tx { flex:1; min-width:0; }
  .happening-now .hn-tx b { color:var(--txt); }
  .happening-now .hn-cta { flex:none; font-weight:700; color:var(--acc, #22c55e); }
  @keyframes pulse { 0%,100% { opacity:1; } 50% { opacity:.35; } }

  /* phone mockup kept (real in-app card layout) */
  .phone { margin:34px auto 0; perspective:1400px; }
  .phone-frame { width:280px; height:560px; margin:0 auto; border-radius:38px;
    background:linear-gradient(165deg,#1a2438,#0c1322); padding:9px; position:relative;
    box-shadow:var(--shadow),0 0 0 1px var(--line); transform:rotate(-2deg);
    animation:tilt 8s ease-in-out infinite; }
  @keyframes tilt { 50% { transform:rotate(1.5deg) translateY(-4px); } }
  .phone-notch { position:absolute; top:14px; left:50%; transform:translateX(-50%);
    width:90px; height:20px; background:#05080f; border-radius:99px; z-index:2; }
  .phone-screen { width:100%; height:100%; border-radius:30px; background:var(--bg2);
    overflow:hidden; position:relative; }
  .ph-status { display:flex; justify-content:space-between; padding:14px 18px 4px;
    font-size:10px; color:var(--dim); font-weight:600; }
  .ph-hdr { padding:6px 16px 10px; font-size:16px; font-weight:800; }
  .ph-hdr .badge { float:right; font-size:9px; font-weight:700; color:var(--acc);
    border:1px solid rgba(52,211,153,.35); padding:3px 8px; border-radius:99px; }
  .ph-card { margin:0 12px 9px; background:var(--card); border:1px solid var(--line);
    border-radius:14px; padding:12px 13px; }
  .ph-card.glow { border-color:var(--acc); box-shadow:0 0 0 2px rgba(52,211,153,.18);
    animation:cardpulse 2.4s ease-in-out infinite; }
  @keyframes cardpulse { 50% { box-shadow:0 0 0 2px rgba(52,211,153,.36); } }
  .ph-card .marq { font-weight:700; font-size:13px; }
  .ph-card .bar { display:flex; justify-content:space-between; align-items:center;
    margin-top:8px; font-size:11px; color:var(--dim); }
  .ph-card .books { display:flex; gap:6px; margin-top:8px; }
  .ph-card .bk { flex:1; text-align:center; font-size:9.5px; font-weight:600;
    background:rgba(255,255,255,.03); border:1px solid var(--line); border-radius:7px;
    padding:5px 2px; }
  .ph-card .bk b { display:block; font-size:12.5px; color:var(--txt); margin-top:2px; }
  .ph-card .edge { margin-top:10px; padding:7px 10px; background:rgba(52,211,153,.1);
    border-radius:8px; display:flex; justify-content:space-between; align-items:center; }
  .ph-card .edge b { font-size:18px; color:var(--acc); font-weight:900; }
  .ph-card .edge span { font-size:9.5px; color:var(--dim); }
  .ph-fab { position:absolute; bottom:18px; right:18px; background:var(--acc); color:#06281c;
    width:40px; height:40px; border-radius:50%; display:flex; align-items:center;
    justify-content:center; font-size:20px; font-weight:900; box-shadow:var(--shadow); }
  .ph.dim { opacity:.4; }
  .ph-cap { text-align:center; color:var(--dim); font-size:12px; margin-top:12px; }
  .ph-cap b { color:var(--txt); }

  /* Generated visuals (scripts/make_landing_visuals.py) — illustrative art,
     never photoreal people. */
  .hero-viz { display:grid; grid-template-columns:1.1fr 1fr; gap:22px; align-items:center;
    max-width:720px; margin:28px auto 0; }
  .hero-viz .person { width:100%; max-width:330px; margin:0 auto; border-radius:22px;
    aspect-ratio:3/2; object-fit:cover; object-position:center;
    border:1px solid var(--line); box-shadow:var(--shadow); display:block; }
  .hero-viz .phone { margin:0 auto; }
  .viz-cap { text-align:center; color:var(--dim); font-size:12px; margin-top:10px; }
  .viz-cap b { color:var(--txt); }
  .panel-art { width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:14px;
    border:1px solid var(--line); margin-bottom:14px; }
  .support-banner { width:100%; max-width:900px; border-radius:18px; border:1px solid var(--line);
    box-shadow:var(--shadow); margin:0 auto 24px; display:block; }
  .banner-viz { width:100%; max-width:900px; border-radius:18px; border:1px solid var(--line);
    box-shadow:var(--shadow); margin:0 auto 24px; display:block; }
  @media (max-width:640px){ .hero-viz { grid-template-columns:1fr; } }

  /* ── ticker ── */
  .ticker { border-top:1px solid var(--line); border-bottom:1px solid var(--line);
    background:linear-gradient(90deg,rgba(52,211,153,.04),rgba(96,165,250,.04));
    padding:11px 0; overflow:hidden; white-space:nowrap; margin:0; }
  .ticker .track { display:inline-block; padding-left:100%; animation:tick 38s linear infinite; }
  @keyframes tick { to { transform:translateX(-100%); } }
  .ticker .item { display:inline-block; margin:0 18px; color:var(--dim); font-weight:600;
    font-size:13.5px; }
  .ticker .item b { color:var(--acc); }
  .ticker .item .dot { width:6px; height:6px; border-radius:50%; background:var(--acc);
    display:inline-block; margin-right:7px; vertical-align:middle; }
  .band { display:flex; gap:18px; flex-wrap:wrap; justify-content:center;
    padding:14px 18px; color:var(--dim); font-size:14px; }
  .band b { color:var(--txt); }
  .band .dot { width:8px; height:8px; border-radius:50%; background:var(--acc);
    display:inline-block; margin-right:6px; animation:p 2s infinite; }

  section { padding:48px 0; border-top:1px solid var(--line); }
  .eyebrow { font-size:11.5px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase;
    color:var(--acc2); margin-bottom:8px; display:block; text-align:center; }
  h2 { font-size:clamp(22px,4.5vw,34px); margin-bottom:8px; text-align:center;
    letter-spacing:-.4px; line-height:1.18; }
  .lead { color:var(--dim); max-width:600px; margin:0 auto 28px; text-align:center;
    font-size:clamp(14.5px,2.4vw,17px); }
  .agit { max-width:640px; margin:26px auto 0; text-align:center; color:var(--txt);
    font-weight:700; font-size:clamp(15px,2.6vw,18px); }
  .agit span { color:var(--red); }
  .blind-cost { max-width:640px; margin:16px auto 0; text-align:center;
    color:var(--dim); font-size:14.5px; background:rgba(248,113,113,.07);
    border:1px solid rgba(248,113,113,.28); border-radius:14px; padding:14px 18px; }
  .blind-cost b { color:var(--red); font-size:16px; }
  .curiosity { max-width:600px; margin:14px auto 0; text-align:center; color:var(--dim); font-size:14px; }
  .curiosity a { color:var(--acc2); font-weight:700; }

  /* ── PAS pain cards ── */
  .pains { display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
  .pain { background:var(--card); border:1px solid var(--line); border-radius:18px;
    padding:22px 20px; position:relative; }
  .pain .ico { font-size:26px; margin-bottom:12px; }
  .pain h3 { font-size:16.5px; margin-bottom:7px; }
  .pain p { color:var(--dim); font-size:14.2px; }
  .pain .step { display:inline-block; font-size:10.5px; font-weight:800; letter-spacing:1.2px;
    color:var(--acc); background:rgba(52,211,153,.1); border:1px solid rgba(52,211,153,.28);
    padding:3px 9px; border-radius:99px; margin-bottom:10px; }
  .pain .old { color:var(--red); font-weight:800; }
  .pain .new { color:var(--acc); font-weight:800; }
  .solve { margin-top:26px; background:linear-gradient(135deg,rgba(52,211,153,.09),rgba(96,165,250,.06));
    border:1px solid rgba(52,211,153,.3); border-radius:18px; padding:22px; }
  .solve h3 { font-size:18px; margin-bottom:10px; text-align:center; }
  .solve ul { list-style:none; display:grid; gap:8px; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); }
  .solve li { color:var(--dim); font-size:14px; padding-left:24px; position:relative; }
  .solve li::before { content:"✓"; position:absolute; left:0; color:var(--acc); font-weight:800; }

  /* ── screenshots gallery (real product, nothing staged) ── */
  .shots { display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); }
  .shot { background:var(--card); border:1px solid var(--line); border-radius:16px;
    overflow:hidden; }
  .shot img { width:100%; height:190px; object-fit:cover; object-position:top; display:block; }
  .shot figcaption { padding:10px 13px; font-size:12.5px; color:var(--dim); }
  .shot figcaption b { color:var(--txt); display:block; font-size:13.5px; }
  .shot .tg-tag { display:inline-block; font-size:10px; font-weight:700; color:var(--acc);
    border:1px solid rgba(52,211,153,.35); border-radius:99px; padding:2px 8px; margin-bottom:5px; }

  /* ── video slot + css fallback ── */
  .vidwrap { position:relative; max-width:760px; margin:0 auto; border-radius:18px;
    overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow); aspect-ratio:16/9;
    background:linear-gradient(160deg,#0e1a2e,#070d18); }
  .vidwrap video { width:100%; height:100%; object-fit:cover; display:block; }
  .vidwrap video.dead { display:none; }
  .dash { position:absolute; inset:0; display:grid; grid-template-columns:1.2fr 1fr;
    grid-template-rows:auto 1fr; gap:14px; padding:18px; }
  .dash .ttl { grid-column:1/-1; display:flex; justify-content:space-between; align-items:center; }
  .dash .ttl b { font-size:14px; }
  .dash .ttl .live { font-size:10px; font-weight:700; color:var(--acc); display:flex;
    align-items:center; gap:5px; }
  .dash .ttl .live .blip { width:6px; height:6px; border-radius:50%; background:var(--acc);
    animation:p 1.4s infinite; }
  .dashBars { display:flex; flex-direction:column; gap:10px; justify-content:center; }
  .dashBar { height:8px; border-radius:99px; background:var(--line); overflow:hidden; position:relative; }
  .dashBar i { position:absolute; inset:0 auto 0 0; width:var(--w,50%); border-radius:99px;
    background:linear-gradient(90deg,var(--acc2),var(--acc));
    animation:barvar 6s ease-in-out infinite; }
  .dashBar:nth-child(2) i { animation-duration:7.5s; }
  .dashBar:nth-child(3) i { animation-duration:8.5s; }
  @keyframes barvar { 0%,100%{ width:30%;} 50%{ width:78%;} }
  .dashTag { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; align-content:center; }
  .dashTag .tg { background:rgba(255,255,255,.03); border:1px solid var(--line);
    border-radius:10px; padding:9px 11px; font-size:11px; color:var(--dim); }
  .dashTag .tg b { display:block; color:var(--acc); font-size:16px; font-weight:800; }
  .dashTag .tg:nth-child(2) b { color:var(--acc2); }
  .dashTag .tg:nth-child(3) b { color:var(--amber); }
  .vidcap { position:absolute; top:14px; left:14px; font-size:11px; color:var(--dim);
    background:rgba(0,0,0,.45); padding:3px 9px; border-radius:99px; }

  /* Silent micro-story: large captions over the loop, with a pause control.
     Reduced-motion renders the first beat statically (no timer). */
  .story { position:absolute; inset:0; display:flex; flex-direction:column;
    justify-content:flex-end; align-items:center; padding:0 0 30px;
    background:linear-gradient(180deg,rgba(7,13,24,0) 45%,rgba(7,13,24,.75) 100%);
    pointer-events:none; }
  .story-cap { font-size:clamp(20px,4.6vw,30px); font-weight:900; letter-spacing:-.3px;
    text-align:center; color:#fff; max-width:90%; line-height:1.15;
    text-shadow:0 2px 14px rgba(0,0,0,.55); }
  .story-cap .g { color:var(--acc); }
  .story-progress { display:flex; gap:6px; margin-top:14px; }
  .story-dot { width:26px; height:4px; border-radius:99px; background:rgba(255,255,255,.28); }
  .story-dot.on { background:var(--acc); }
  .story-btn { position:absolute; top:12px; right:12px; width:36px; height:36px;
    border-radius:50%; border:1px solid rgba(255,255,255,.3); background:rgba(0,0,0,.45);
    color:#fff; font-size:15px; line-height:1; cursor:pointer;
    display:flex; align-items:center; justify-content:center; z-index:2; }
  .story-btn:active { transform:scale(.94); }

  /* ── Bettar feeling (pre-plans emotion strip) ──
     Same video/story plumbing as the #see-it loop, but the clip rotates
     through illustrative human reactions. Honest captions only: the feeling of
     seeing the price, never a promise of winnings. */
  .feel-vidwrap { max-width:760px; }
  .feel-grid { display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
    max-width:760px; margin:20px auto 0; }
  .feel-grid .shot img { height:200px; object-position:center; }
  .feel-grid .shot figcaption { text-align:center; }

  /* ── big stat ── */
  .bighero { text-align:center; padding:6px 0 10px; }
  .bignum { font-size:clamp(56px,12vw,92px); font-weight:900; line-height:1;
    letter-spacing:-2px; color:var(--acc);
    background:linear-gradient(135deg,var(--acc),var(--acc2)); -webkit-background-clip:text;
    background-clip:text; -webkit-text-fill-color:transparent; }
  .bignum .pct { font-size:.4em; vertical-align:super; }
  .bigsub { color:var(--dim); font-size:15.5px; margin-top:8px; }
  .srcgrid { display:grid; gap:13px; grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
    margin-top:30px; }
  .src { background:var(--card); border:1px solid var(--line); border-radius:14px;
    padding:18px 14px; text-align:center; }
  .src b { display:block; font-size:30px; font-weight:900; color:var(--txt); line-height:1.1; }
  .src span { color:var(--dim); font-size:12.5px; }
  .kar { opacity:.35; color:var(--dim); display:block; font-size:12px;
    margin:14px 0 -10px; text-align:center; }

  /* Progressive disclosure: 3 headline stats up top, the full ledger behind
     an expander so first-time visitors aren't asked to read nine numbers. */
  .fullrecord { max-width:640px; margin:20px auto 0; background:var(--card);
    border:1px solid var(--line); border-radius:14px; padding:14px 18px; }
  .fullrecord summary { cursor:pointer; font-weight:700; font-size:14.5px;
    color:var(--acc2); list-style:none; text-align:center; }
  .fullrecord summary::after { content:"+"; float:right; color:var(--acc); font-weight:900; }
  .fullrecord[open] summary::after { content:"–"; }
  .fullrecord .srcgrid { margin-top:14px; }

  /* ── plans comparison ── */
  .cmp { width:100%; border-collapse:collapse; font-size:13.5px; margin-top:8px; }
  .cmp th, .cmp td { border:1px solid var(--line); padding:10px 10px; text-align:center;
    vertical-align:top; }
  .cmp th { background:var(--card); font-size:14px; }
  .cmp td:first-child, .cmp th:first-child { text-align:left; color:var(--dim); }
  .cmp .col-vip { background:rgba(52,211,153,.07); }
  .cmp th.col-vip { color:var(--acc); font-weight:900; }
  .cmp .yes { color:var(--acc); font-weight:800; }
  .cmp .no { color:var(--dim); opacity:.55; }
  .cmp .val { color:var(--txt); font-weight:700; }
  .planrow { display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); margin-top:22px; }
  .trust-strip { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; max-width:900px;
    margin:20px auto 0; }
  .trust-strip span { padding:9px 8px; border:1px solid var(--line); border-radius:11px; color:var(--dim);
    font-size:11.5px; text-align:center; background:rgba(255,255,255,.025); }
  .trust-strip b { display:block; color:var(--txt); font-size:12px; margin-bottom:2px; }
  @media (max-width:640px){ .trust-strip { grid-template-columns:repeat(2,minmax(0,1fr)); } .trust-strip span:last-child { grid-column:1/-1; } }
  .referral-flow { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; max-width:900px; margin:22px auto 0; }
  .referral-step { position:relative; padding:20px 18px; background:var(--card); border:1px solid var(--line);
    border-radius:16px; text-align:left; }
  .referral-step .step-no { display:grid; place-items:center; width:30px; height:30px; margin-bottom:12px;
    border-radius:10px; background:var(--acc); color:#06281c; font-size:13px; font-weight:900; }
  .referral-step:nth-child(2) .step-no { background:var(--acc2); }
  .referral-step:nth-child(3) .step-no { background:var(--amber); }
  .referral-step h3 { font-size:15px; margin-bottom:6px; }
  .referral-step p { color:var(--dim); font-size:13.5px; line-height:1.5; }
  .referral-step p b { color:var(--txt); }
  .referral-note { max-width:680px; margin:16px auto 0; padding:12px 16px; border:1px solid rgba(96,165,250,.28);
    border-radius:12px; color:var(--dim); font-size:13px; text-align:center; background:rgba(96,165,250,.06); }
  .referral-note b { color:var(--txt); }
  .referral-cta { display:flex; justify-content:center; margin-top:18px; }
  @media (max-width:640px){ .referral-flow { grid-template-columns:1fr; gap:9px; } .referral-step { padding:15px; } }
  .plan { background:var(--card); border:1px solid var(--line); border-radius:16px; padding:22px; }
  .price { font-size:32px; font-weight:900; margin:6px 0 2px; }
  .price small { font-size:14px; color:var(--dim); font-weight:400; }
  .perday { font-size:13px; color:var(--dim); margin:0 0 2px; }
  .perday b { color:var(--acc); }
  .anchor-note { font-size:12.5px; color:var(--dim); margin:6px 0 0;
    background:rgba(52,211,153,.06); border:1px solid rgba(52,211,153,.22);
    border-radius:9px; padding:7px 10px; }
  .anchor-note b { color:var(--acc); }
  .plan ul { list-style:none; margin:14px 0 18px; }
  .plan li { padding:6px 0 6px 26px; position:relative; color:var(--dim); font-size:14px; }
  .plan li::before { content:"✓"; position:absolute; left:0; color:var(--acc); font-weight:800; }
  .plan li.lock { opacity:.55; }
  .plan li.lock::before { content:"✕"; color:var(--dim); }
  .plan.vip { border-color:var(--acc); box-shadow:0 0 0 1px var(--acc),0 10px 30px rgba(52,211,153,.16); }
  .tag { display:inline-block; font-size:11px; font-weight:700; letter-spacing:.4px;
    color:#06281c; background:var(--acc); border-radius:99px; padding:4px 11px; margin-bottom:8px; }
  .momo { margin-top:16px; text-align:center; color:var(--dim); font-size:13.5px; }
  .momo b { color:var(--txt); }
  /* Payment methods are native HTML so labels stay readable on small screens. */
  .payment-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px;
    max-width:760px; margin:18px auto 4px; }
  .payment-method { display:flex; align-items:center; gap:10px; min-width:0;
    padding:12px 13px; background:var(--card); border:1px solid var(--line);
    border-radius:14px; }
  .payment-mark { display:grid; place-items:center; flex:0 0 34px; width:34px; height:34px;
    border-radius:50%; color:#07111f; font-size:12px; font-weight:800; letter-spacing:-.3px; }
  .payment-method:nth-child(1) .payment-mark { background:#f5c400; }
  .payment-method:nth-child(2) .payment-mark { background:#f04b61; }
  .payment-method:nth-child(3) .payment-mark { background:#4d8df7; }
  .payment-method strong { display:block; color:var(--txt); font-size:13px; font-weight:700;
    line-height:1.2; white-space:nowrap; }
  .payment-method small { display:block; color:var(--dim); font-size:11px; margin-top:3px; }
  @media (max-width:640px){
    .payment-grid { grid-template-columns:1fr; gap:8px; margin-top:14px; }
    .payment-method { padding:10px 12px; }
    .payment-mark { flex-basis:30px; width:30px; height:30px; font-size:10px; }
    .payment-method strong { font-size:12.5px; }
  }
  .seats { display:inline-block; margin-top:10px; font-size:12.5px; font-weight:700;
    color:var(--amber); background:rgba(251,191,36,.1); border:1px solid rgba(251,191,36,.35);
    border-radius:99px; padding:4px 12px; }

  /* Secondary detail (referrals, engines) behind an expander — audit P1:
     engine mechanics and referral terms stay visible but off the main path. */
  .moredetail { max-width:640px; margin:16px auto 0; background:var(--card);
    border:1px solid var(--line); border-radius:14px; padding:14px 18px; }
  .moredetail summary { cursor:pointer; font-weight:700; font-size:14px;
    color:var(--acc2); list-style:none; text-align:center; }
  .moredetail summary::after { content:"+"; float:right; color:var(--acc); font-weight:900; }
  .moredetail[open] summary::after { content:"–"; }
  .moredetail .momo { text-align:left; margin-top:12px; }
  .moredetail details { margin-top:10px; background:var(--bg2); border:1px solid var(--line);
    border-radius:12px; padding:12px 16px; }
  .moredetail details summary { cursor:pointer; font-weight:700; font-size:14.5px;
    list-style:none; text-align:left; color:var(--txt); }
  .moredetail details summary::after { content:"+"; float:right; color:var(--acc); font-weight:900; }
  .moredetail details[open] summary::after { content:"–"; }
  .moredetail details p { color:var(--dim); font-size:13.5px; margin-top:8px; }

  /* ── FAQ ── */
  .faq { max-width:720px; margin:0 auto; display:grid; gap:10px; }
  .faq details { background:var(--card); border:1px solid var(--line); border-radius:14px;
    padding:14px 18px; }
  .faq summary { cursor:pointer; font-weight:700; font-size:15px; list-style:none; }
  .faq summary::after { content:"+"; float:right; color:var(--acc); font-weight:900; }
  .faq details[open] summary::after { content:"–"; }
  .faq details p { color:var(--dim); font-size:14px; margin-top:10px; }
  .faq details p b { color:var(--txt); }

  /* ── support / contact ── */
  .contacts { display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
  .contact { background:var(--card); border:1px solid var(--line); border-radius:16px;
    padding:20px; text-align:center; }
  .contact .ico { font-size:26px; }
  .contact h3 { font-size:15px; margin:8px 0 6px; }
  .contact p { color:var(--dim); font-size:13px; }
  .contact a.btn-s { display:inline-block; margin-top:12px; padding:9px 18px; border-radius:10px;
    background:var(--bg2); border:1px solid var(--line); color:var(--txt); font-weight:700; font-size:13.5px; }
  /* Keep the contact promise and its supporting sentence visually separate on
     narrow screens where the long heading wraps to multiple lines. */
  #support h2 { max-width:24ch; margin:0 auto 14px; line-height:1.28; }
  #support .lead { max-width:540px; line-height:1.6; margin-bottom:30px; }
  @media (max-width:640px){
    #support h2 { max-width:18ch; line-height:1.3; margin-bottom:16px; }
    #support .lead { font-size:14.5px; line-height:1.6; }
  }

  .honest { background:var(--card); border:1px solid var(--line); border-radius:16px;
    padding:22px; color:var(--dim); font-size:14.5px; }
  .honest b { color:var(--txt); }
  footer { border-top:1px solid var(--line); padding:30px 0 46px; color:var(--dim);
    font-size:13.5px; text-align:center; }
  footer a { color:var(--dim); margin:0 8px; }
  .age { display:inline-block; border:1px solid var(--line); border-radius:8px;
    padding:2px 8px; font-weight:700; color:var(--txt); margin-bottom:8px; }
  .noscript { color:var(--dim); text-align:center; font-size:14px; }

  /* B4 — engine strip: "one plan, five engines" so the fee reads as abundance. */
  .engine-strip { margin-top:22px; background:linear-gradient(135deg,rgba(52,211,153,.07),rgba(96,165,250,.05));
    border:1px solid rgba(52,211,153,.25); border-radius:16px; padding:18px 20px; }
  .es-head { text-align:center; font-weight:800; font-size:15.5px; margin-bottom:10px; color:var(--txt); }
  .engine-strip ul { list-style:none; margin:0 0 12px; padding:0; display:grid;
    gap:8px; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); }
  .engine-strip li { font-size:13.5px; color:var(--dim); }
  .engine-strip li b { color:var(--txt); }
  .es-sub { text-align:center; margin-top:4px; font-weight:700; color:var(--acc); font-size:13.5px; }

  /* ── JOURNEY CAROUSEL (below hero, above the ticker) ──────────────────────
     Vendored Swiper (effect: 'cards'), 60% visual / 40% text per slide.
     Numbers are server-injected (I3); copy stays I2-safe. Without JS the
     slides render as a horizontally scroll-snapping row (fallback below). */
  .journey { padding:52px 0 58px; }
  .journey-inner { max-width:980px; margin:0 auto; padding:0 18px; }
  .journey h2 { margin-bottom:6px; }
  .journey .lead { margin-bottom:24px; }

  .journey-swiper { position:relative; padding:6px 4px 60px;
    --swiper-pagination-color: var(--acc);
    --swiper-navigation-color: var(--acc); }
  .journey-swiper .swiper-slide { height:auto; }

  /* card = the 60/40 split; visual column fills the full card height */
  .journey-card { position:relative; display:grid; grid-template-columns:1.5fr 1fr;
    min-height:340px; background:linear-gradient(160deg,var(--card),var(--bg2));
    border:1px solid var(--line); border-radius:20px; overflow:hidden;
    box-shadow:var(--shadow); transition:transform .18s ease, box-shadow .18s ease; }
  .journey-card:hover { transform:translateY(-3px); box-shadow:0 16px 44px rgba(0,0,0,.5); }

  .journey-visual { position:relative; min-height:0; }
  .journey-visual img { position:absolute; inset:0; width:100%; height:100%;
    object-fit:cover; display:block; }
  .j-num { position:absolute; top:12px; left:12px; z-index:2; display:grid;
    place-items:center; width:34px; height:34px; border-radius:11px;
    background:rgba(11,15,26,.72); border:1px solid rgba(255,255,255,.18);
    color:var(--txt); font-weight:900; font-size:14px; backdrop-filter:blur(6px); }

  /* slide 6 — five-engine "visual" (CSS-built, mirrors the engine strip) */
  .journey-engines { display:grid; place-items:center;
    background:radial-gradient(circle at 50% 42%, rgba(52,211,153,.14), rgba(96,165,250,.05) 62%, var(--bg2) 100%); }
  .engine-orbit { position:relative; display:grid; gap:10px; padding:22px; text-align:center; }
  .engine-core { margin-bottom:6px; font-size:clamp(20px,3.4vw,30px); font-weight:900;
    letter-spacing:-.5px; color:var(--acc);
    background:linear-gradient(135deg,var(--acc),var(--acc2)); -webkit-background-clip:text;
    background-clip:text; -webkit-text-fill-color:transparent; }
  .engine-orbit .ep { font-size:13px; font-weight:700; color:var(--txt);
    background:rgba(11,15,26,.6); border:1px solid var(--line); border-radius:99px;
    padding:8px 16px; box-shadow:0 4px 16px rgba(0,0,0,.28); }
  .engine-orbit .ep-1 { border-color:rgba(52,211,153,.55); }
  .engine-orbit .ep-2 { border-color:rgba(96,165,250,.55); }
  .engine-orbit .ep-3 { border-color:rgba(251,191,36,.55); }
  .engine-orbit .ep-4 { border-color:rgba(248,113,113,.55); }
  .engine-orbit .ep-5 { border-color:rgba(196,181,253,.55); }

  /* tool slides (07–12) — real app screenshots in a clean "screen" frame */
  .journey-tool { display:grid; place-items:center; overflow:hidden;
    background:radial-gradient(circle at 50% 28%, rgba(96,165,250,.14), rgba(11,15,26,0) 72%),
                linear-gradient(160deg,var(--bg2),#0a0f1c); }
  .tool-phone { width:min(56%,310px); aspect-ratio:5/6; border-radius:20px; overflow:hidden;
    border:1px solid var(--line); background:#fff; box-shadow:0 18px 46px rgba(0,0,0,.5),
    0 0 0 1px rgba(255,255,255,.07), inset 0 0 0 1px rgba(11,15,26,.06); }
  .tool-phone img { position:static; width:100%; height:100%; object-fit:cover;
    object-position:top; display:block; }
  @media (max-width:640px){ .tool-phone { width:min(58%,260px); } }

  .journey-copy { display:flex; flex-direction:column; align-items:flex-start;
    gap:9px; padding:24px 20px 26px; }
  .journey-copy .step { font-size:10.5px; font-weight:800; letter-spacing:1.2px;
    color:var(--acc); background:rgba(52,211,153,.1); border:1px solid rgba(52,211,153,.28);
    padding:3px 9px; border-radius:99px; }
  .journey-copy h3 { font-size:clamp(19px,3vw,25px); line-height:1.15; letter-spacing:-.3px; }
  .journey-copy p { color:var(--dim); font-size:14px; line-height:1.55; }
  .journey-copy p b { color:var(--txt); }
  .journey-stats { display:flex; gap:8px; flex-wrap:wrap; margin-top:2px; }
  .journey-stats span { font-size:11.5px; font-weight:600; color:var(--dim);
    background:rgba(255,255,255,.03); border:1px solid var(--line); border-radius:99px;
    padding:4px 11px; }
  .journey-stats b { color:var(--acc); }
  .journey-copy .jcta { margin-top:auto; padding:11px 18px; font-size:14px;
    border-radius:12px; }

  /* autoplay progress — one thin bar at the base of the active card */
  .journey-progress { position:absolute; left:0; right:0; bottom:0; height:4px;
    background:rgba(255,255,255,.06); z-index:3; }
  .journey-progress span { display:block; height:100%; width:0;
    background:linear-gradient(90deg,var(--acc2),var(--acc)); }

  /* controls row: prev/next flank the bullets (static, not centered overlay) */
  .journey-controls { position:absolute; left:0; right:0; bottom:14px;
    display:flex; align-items:center; justify-content:center; gap:18px; z-index:5; }
  .journey-controls .swiper-pagination { position:static; width:auto; }
  .journey-swiper .swiper-button-next, .journey-swiper .swiper-button-prev {
    position:static; top:auto; margin:0; width:38px; height:38px; flex:0 0 38px;
    background:var(--bg2); border:1px solid var(--line); border-radius:50%;
    transition:border-color .15s ease, background .15s ease; }
  .journey-swiper .swiper-button-next:hover, .journey-swiper .swiper-button-prev:hover {
    border-color:rgba(52,211,153,.7); background:var(--card); }
  .journey-swiper .swiper-button-next::after, .journey-swiper .swiper-button-prev::after {
    font-size:16px; }

  /* No-JS / pre-init fallback: a plain horizontally scroll-snapping row so the
     deck is still browsable before (or without) the lazy-loaded Swiper bundle. */
  .journey-swiper:not(.swiper-initialized) { overflow-x:auto; scroll-snap-type:x mandatory;
    padding-bottom:16px; -webkit-overflow-scrolling:touch; }
  .journey-swiper:not(.swiper-initialized) .swiper-wrapper { flex-wrap:nowrap; }
  .journey-swiper:not(.swiper-initialized) .swiper-slide {
    flex:0 0 min(88%,680px); scroll-snap-align:center; margin-right:12px; }
  .journey-swiper:not(.swiper-initialized) .journey-controls { display:none; }

  @media (max-width:640px){
    .journey { padding:40px 0 46px; }
    .journey-card { grid-template-columns:1fr; min-height:0; }
    .journey-visual { aspect-ratio:16/10; }
    .journey-visual img { position:static; height:100%; }
    .journey-copy { padding:18px 16px 22px; }
    .journey-copy .jcta { align-self:stretch; text-align:center; }
  }

  @media (prefers-reduced-motion:reduce){
    .journey-card, .journey-card:hover, .journey-swiper .swiper-slide {
      transition:none !important; transform:none !important; }
    .journey-progress span { animation:none !important; }
  }