

  
  @media (prefers-reduced-motion: reduce){
    *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  }
  *{ box-sizing:border-box; }
  html{ scroll-behavior:smooth; }
  body{ margin:0; background:var(--bg); color:var(--ink); font-family:var(--sans); line-height:1.5; -webkit-font-smoothing:antialiased; }
  a{ color:inherit; text-decoration:none; }
  img{ max-width:100%; display:block; }
  button{ font-family:inherit; cursor:pointer; }
  button:focus-visible, a:focus-visible{ outline:2.5px solid var(--purple-600); outline-offset:2px; }
  .wrap{ max-width:1120px; margin:0 auto; padding:0 24px; }

  /* ---------- NAV ---------- */
  header.topbar{ position:sticky; top:0; z-index:50; background:var(--white); border-bottom:1px solid var(--line); }
  .topbar-inner{ max-width:1120px; margin:0 auto; padding:14px 24px; display:flex; align-items:center; gap:36px; }
  .brand{ display:flex; align-items:center; gap:11px; flex:none; }
  .brand img{ height:28px; }
  .brand-div{ width:1px; height:22px; background:var(--line); }
  .brand-suffix{ font-size:16px; font-weight:300; font-style:italic; color:var(--ink); letter-spacing:-0.01em; }
  nav.primary-nav{ display:flex; gap:28px; flex:1; }
  nav.primary-nav a{ font-size:14px; font-weight:600; color:var(--ink-soft); padding:8px 0; border-bottom:2px solid transparent; }
  nav.primary-nav a:hover{ color:var(--ink); }
  nav.primary-nav a.current{ color:var(--purple-700); border-bottom-color:var(--purple-600); }
  .nav-actions{ display:flex; align-items:center; gap:18px; flex:none; }
  .search-btn{ display:flex; align-items:center; gap:8px; background:var(--bg); border:1px solid var(--line); border-radius:999px; padding:8px 14px; font-size:13px; color:var(--ink-faint); }
  .signin-link{ font-size:14px; font-weight:600; color:var(--ink-soft); }
  @media (max-width:920px){ nav.primary-nav, .search-btn{ display:none; } }
  .day-jump{ position:sticky; top:57px; z-index:49; background:var(--white); border-bottom:1px solid var(--line); }
  .day-jump-inner{ max-width:1120px; margin:0 auto; padding:0 24px; display:flex; align-items:center; gap:6px; overflow-x:auto; scrollbar-width:none; }
  .day-jump-inner::-webkit-scrollbar{ display:none; }
  .day-jump-label{ font-size:11.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft); flex:none; padding-right:4px; }
  .day-jump a{ flex:none; font-size:13px; font-weight:600; color:var(--ink-soft); padding:10px 14px; border-bottom:2px solid transparent; white-space:nowrap; }
  .day-jump a:hover{ color:var(--ink); }
  .day-jump a.active{ color:var(--purple-700); border-bottom-color:var(--purple-600); }

  /* ---------- HERO (editorial masthead, left-aligned) ---------- */
  .hero{ position:relative; overflow:hidden; background:var(--purple-900); color:var(--white); padding:64px 24px 0; }
  .hero::before{ content:""; position:absolute; inset:0; background-image:url('../assets/52c3e0934c09d8a0.png'); background-repeat:repeat; background-size:96px 96px; opacity:.05; pointer-events:none; }
  .hero-inner{ max-width:1120px; margin:0 auto; display:grid; grid-template-columns:1.1fr .9fr; gap:40px; align-items:end; padding-bottom:56px; position:relative; }
  .masthead{ display:flex; align-items:center; gap:18px; margin-bottom:26px; }
  .masthead img{ height:56px; flex:none; }
  .masthead-title{ margin:0; line-height:1; white-space:nowrap; }
  .masthead-title .m-compa{ font-size:clamp(30px,4vw,44px); font-weight:800; letter-spacing:-0.02em; color:var(--white); }
  .masthead-title .m-uni{ font-size:clamp(30px,4vw,44px); font-weight:300; font-style:italic; letter-spacing:-0.01em; color:var(--purple-100); margin-left:6px; }
  .hero-eyebrow{ display:inline-flex; align-items:center; gap:8px; font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--purple-100); background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.2); padding:6px 14px; border-radius:999px; margin:0 0 20px; }
  .hero p.lede{ margin:16px 0 30px; }
  @media (max-width:640px){ .masthead{ flex-wrap:wrap; } .masthead img{ height:44px; } }
  .hero-ctas{ display:flex; gap:12px; flex-wrap:wrap; }
  .btn{ display:inline-flex; align-items:center; gap:8px; border:none; border-radius:999px; padding:13px 24px; font-weight:700; font-size:14.5px; }
  .btn-primary{ background:var(--white); color:var(--purple-900); }
  .btn-primary:hover{ background:var(--purple-100); }
  .btn-ghost{ background:transparent; color:var(--white); border:1.5px solid rgba(255,255,255,.35); }
  .btn-ghost:hover{ border-color:var(--white); }
  .btn-launch{ background:linear-gradient(135deg, var(--purple-600), var(--purple-700)); color:var(--white); border:1px solid rgba(255,255,255,.18); box-shadow:0 6px 18px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.16); }
  .btn-launch:hover{ background:linear-gradient(135deg, #7C68EE, var(--purple-600)); box-shadow:0 8px 22px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.2); }
  .hero-panel{ background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.16); border-radius:20px; padding:26px; backdrop-filter:blur(2px); }
  .hero-panel .k{ font-family:var(--mono); font-size:12px; color:var(--purple-100); text-transform:uppercase; letter-spacing:.05em; margin-bottom:14px; }
  .hero-stat-row{ display:grid; grid-template-columns:1fr 1fr; gap:22px 14px; }
  .hero-stat{ text-align:left; }
  .hero-stat .num{ font-size:28px; font-weight:700; font-family:var(--mono); line-height:1; }
  .hero-stat .lab{ font-size:12px; color:var(--purple-100); margin-top:6px; }
  .hero-rule{ border:none; border-top:1px solid rgba(255,255,255,.14); margin:16px 0; }
  .hero-panel .quote{ font-size:13.5px; color:var(--purple-100); line-height:1.6; }

  /* ---------- PATH TILES (kept for later re-use) ---------- */
  .paths{ padding:56px 24px 8px; }
  .paths-head{ display:flex; align-items:baseline; justify-content:space-between; gap:20px; margin-bottom:28px; flex-wrap:wrap; }
  .paths-head h2{ font-size:24px; margin:0; letter-spacing:-0.01em; }
  .paths-head p{ margin:6px 0 0; color:var(--ink-soft); font-size:14.5px; max-width:520px; }
  .path-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
  .path-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:22px; display:flex; flex-direction:column; gap:10px; transition:border-color .15s ease; }
  .path-card:hover{ border-color:var(--purple-600); }
  .path-icon{ width:36px; height:36px; border-radius:10px; background:var(--purple-050); color:var(--purple-700); display:flex; align-items:center; justify-content:center; font-size:16px; flex:none; }
  .path-card h3{ font-size:16.5px; margin:2px 0 0; }
  .path-card p{ font-size:13.5px; color:var(--ink-soft); margin:0; flex:1; }
  .path-card .go{ font-size:13px; font-weight:700; color:var(--purple-700); }
  @media (max-width:820px){ .path-grid{ grid-template-columns:repeat(2,1fr); } }
  @media (max-width:560px){ .path-grid{ grid-template-columns:1fr; } }

  /* ---------- CUSTOMER STORIES (static spotlight list, logos inline) ---------- */
  .stories{ padding:60px 24px 68px; background:var(--white); }
  .stories-head{ max-width:600px; margin-bottom:8px; }
  .stories-eyebrow{ display:inline-flex; font-size:12px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--purple-700); background:var(--purple-100); padding:6px 14px; border-radius:999px; margin-bottom:16px; }
  .stories-head h2{ font-size:clamp(30px,4vw,38px); font-weight:800; margin:0; letter-spacing:-0.02em; line-height:1.08; }
  .stories-head p{ margin:12px 0 0; color:var(--ink-soft); font-size:15.5px; }

  .story-list{
    margin-top:34px; display:grid; grid-template-columns:1fr 1fr; column-gap:48px;
  }
  .story-item{
    padding:30px 0; border-top:1px solid var(--line);
  }
  .story-item:nth-child(1), .story-item:nth-child(2){ border-top:none; }
  .story-quote{
    font-family:Georgia,'Times New Roman',serif; font-style:italic;
    font-size:18px; line-height:1.55; color:var(--ink); margin:0;
  }
  .story-byline{ display:flex; align-items:center; gap:14px; margin-top:20px; }
  .story-byline .story-logo img{ height:24px; width:auto; display:block; flex:none; }
  .story-who{ display:flex; flex-direction:column; gap:5px; }
  .story-who strong{ font-family:var(--sans); font-size:13.5px; color:var(--ink); }
  .story-who .role{ font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:.04em; color:var(--purple-700); background:var(--purple-100); padding:2px 9px; border-radius:999px; align-self:flex-start; }
  @media (max-width:760px){
    .story-list{ grid-template-columns:1fr; column-gap:0; }
    .story-item:nth-child(2){ border-top:1px solid var(--line); }
    .story-quote{ font-size:17.5px; }
  }

  /* ---------- COMPA CRASH COURSE ---------- */
  .crash{ padding:12px 24px 60px; }
  .crash-card{ background:var(--purple-900); border-radius:28px; padding:44px 40px 40px; color:var(--white); position:relative; overflow:hidden; }
  .crash-card::before{ content:""; position:absolute; inset:0; background-image:url('../assets/52c3e0934c09d8a0.png'); background-repeat:repeat; background-size:80px 80px; opacity:.05; pointer-events:none; }
  .crash-head{ position:relative; max-width:640px; margin-bottom:38px; }
  .crash-eyebrow{ display:inline-flex; align-items:center; gap:8px; font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--purple-100); background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.2); padding:6px 14px; border-radius:999px; margin-bottom:16px; }
  .crash-head h2{ font-size:28px; margin:0 0 10px; letter-spacing:-0.01em; }
  .crash-head p{ font-size:15px; color:var(--purple-100); margin:0; opacity:.9; }
  .crash-path{ position:relative; display:grid; grid-template-columns:repeat(5,1fr); gap:0; margin-bottom:32px; }
  .crash-path::before{ content:""; position:absolute; top:19px; left:10%; right:10%; height:1px; background:rgba(255,255,255,.2); }
  .crash-step{ position:relative; padding:0 14px 0 0; }
  .crash-step .num{ position:relative; z-index:1; width:38px; height:38px; border-radius:50%; background:var(--purple-900); border:1.5px solid rgba(255,255,255,.35); display:flex; align-items:center; justify-content:center; font-family:var(--mono); font-size:13px; font-weight:700; margin-bottom:16px; }
  .crash-step:first-child .num{ background:var(--white); color:var(--purple-900); border-color:var(--white); }
  .crash-step .day-label{ font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--purple-100); opacity:.8; margin-bottom:5px; }
  .crash-step h3{ font-size:15.5px; margin:0 0 8px; line-height:1.3; }
  .crash-step p{ font-size:12.5px; color:var(--purple-100); opacity:.85; margin:0; line-height:1.5; }
  .crash-foot{ position:relative; display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; padding-top:28px; border-top:1px solid rgba(255,255,255,.14); }
  .crash-foot p{ font-size:13.5px; color:var(--purple-100); margin:0; }
  @media (max-width:900px){ .crash-path{ grid-template-columns:repeat(2,1fr); gap:24px; } .crash-path::before{ display:none; } }
  @media (max-width:560px){ .crash-path{ grid-template-columns:1fr; } }

  /* ---------- FEATURED INSIGHT (split banner) ---------- */
  /* ---------- COMP TRAINING (101/201/301 levels) ---------- */
  .comp-training{ padding:56px 24px; }
  .comp-training-head{ margin-bottom:32px; max-width:640px; }
  .comp-training-eyebrow{ font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--purple-600); margin-bottom:8px; display:block; }
  .comp-training-head h2{ font-size:26px; margin:0 0 10px; letter-spacing:-0.01em; }
  .comp-training-head p{ font-size:14.5px; color:var(--ink-soft); margin:0; }
  .comp-training-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
  .comp-card{ background:var(--white); border:1px solid var(--line); border-radius:20px; padding:26px 24px 24px; display:flex; flex-direction:column; gap:14px; transition:border-color .15s ease, box-shadow .15s ease; }
  .comp-card:hover{ border-color:var(--purple-600); box-shadow:0 12px 24px rgba(36,26,87,.08); }
  .comp-level{ display:inline-flex; align-items:center; justify-content:center; width:56px; height:56px; border-radius:14px; font-family:var(--mono); font-size:16px; font-weight:800; flex:none; }
  .comp-card.level-101 .comp-level{ background:var(--purple-050); color:var(--purple-700); }
  .comp-card.level-201 .comp-level{ background:var(--purple-100); color:var(--purple-700); }
  .comp-card.level-301 .comp-level{ background:var(--purple-900); color:var(--white); }
  .comp-card h3{ font-size:17.5px; margin:0; letter-spacing:-0.01em; }
  .comp-card .comp-audience{ font-size:12px; color:var(--ink-faint); margin:-8px 0 0; }
  .comp-card p.comp-desc{ font-size:13.5px; color:var(--ink-soft); margin:0; line-height:1.55; }
  .comp-topics{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:7px; }
  .comp-topics li{ font-size:13px; color:var(--ink); padding-left:18px; position:relative; }
  .comp-topics li::before{ content:"✓"; position:absolute; left:0; color:var(--purple-600); font-weight:700; font-size:11.5px; top:2px; }
  .comp-card-foot{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:auto; padding-top:16px; border-top:1px solid var(--line); }
  .comp-card-foot .format{ font-size:11.5px; color:var(--ink-faint); font-family:var(--mono); }
  .comp-card-foot a{ font-size:13px; font-weight:700; color:var(--purple-700); }
  @media (max-width:900px){ .comp-training-grid{ grid-template-columns:1fr; } }

  /* ---------- FROM THE HUB (featured + latest, unified) ---------- */
  .hub{ padding:56px 24px; }
  .hub-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:32px; flex-wrap:wrap; }
  .hub-eyebrow{ font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--purple-600); margin-bottom:8px; display:block; }
  .hub-head h2{ font-size:26px; margin:0 0 8px; letter-spacing:-0.01em; }
  .hub-head p{ font-size:14.5px; color:var(--ink-soft); margin:0; max-width:480px; }
  .hub-head > a{ font-size:13.5px; font-weight:700; color:var(--purple-700); white-space:nowrap; }
  .hub-grid{ display:grid; grid-template-columns:1.3fr 1fr; gap:24px; align-items:stretch; }

  .hub-feature{ background:var(--white); border:1px solid var(--line); border-radius:22px; overflow:hidden; display:flex; flex-direction:column; }
  .hub-feature-media{ background:linear-gradient(135deg,var(--purple-700),var(--purple-900)); position:relative; min-height:200px; padding:24px; display:flex; align-items:flex-end; flex:none; overflow:hidden; }
  .hub-feature-media::before{ content:""; position:absolute; inset:0; background-image:radial-gradient(rgba(255,255,255,.16) 1.5px, transparent 1.5px); background-size:20px 20px; opacity:.5; }
  .hub-feature-tag{ position:relative; font-size:11.5px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:var(--purple-900); background:var(--white); padding:6px 12px; border-radius:999px; }
  .hub-feature-body{ padding:26px 28px 28px; display:flex; flex-direction:column; gap:12px; flex:1; }
  .hub-feature-meta{ font-size:12.5px; color:var(--ink-faint); font-family:var(--mono); }
  .hub-feature-body h3{ font-size:22px; margin:0; line-height:1.25; letter-spacing:-0.01em; }
  .hub-feature-body p{ font-size:14px; color:var(--ink-soft); margin:0; }
  .hub-feature-body .go{ font-size:13.5px; font-weight:700; color:var(--purple-700); margin-top:auto; }

  .hub-list{ background:var(--white); border:1px solid var(--line); border-radius:22px; padding:6px 24px; display:flex; flex-direction:column; }
  .hub-item{ display:flex; gap:14px; padding:18px 0; border-bottom:1px solid var(--line); }
  .hub-item:last-child{ border-bottom:none; }
  .hub-item-icon{ width:34px; height:34px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:15px; flex:none; }
  .hub-item-icon.tutorial{ background:var(--purple-050); color:var(--purple-700); }
  .hub-item-icon.story{ background:var(--green-bg); color:var(--green); }
  .hub-item-icon.brief{ background:var(--amber-bg); color:var(--amber); }
  .hub-item-body{ flex:1; min-width:0; }
  .hub-item-tag{ font-size:10.5px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; margin-bottom:4px; display:block; }
  .hub-item-tag.tutorial{ color:var(--purple-700); }
  .hub-item-tag.story{ color:var(--green); }
  .hub-item-tag.brief{ color:var(--amber); }
  .hub-item h4{ font-size:14.5px; margin:0 0 4px; line-height:1.35; font-weight:700; }
  .hub-item .meta{ font-size:11.5px; color:var(--ink-faint); font-family:var(--mono); }
  @media (max-width:900px){ .hub-grid{ grid-template-columns:1fr; } }

  /* ---------- CUSTOMER VOICES ---------- */
  .voices{ background:var(--purple-050); padding:60px 0; position:relative; overflow:hidden; }
  .voices::before{ content:""; position:absolute; inset:0; background-image:radial-gradient(var(--purple-100) 1.5px, transparent 1.5px); background-size:24px 24px; opacity:.6; pointer-events:none; }
  .voices .wrap{ position:relative; }
  .voices-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:28px; padding:0 24px; flex-wrap:wrap; }
  .voices-eyebrow{ font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--purple-600); margin-bottom:8px; display:block; }
  .voices-head h2{ font-size:26px; margin:0 0 8px; letter-spacing:-0.01em; }
  .voices-head p{ font-size:14.5px; color:var(--ink-soft); margin:0; max-width:460px; }
  .voices-head > a{ font-size:13.5px; font-weight:700; color:var(--purple-700); white-space:nowrap; }
  .voice-row{ display:flex; gap:18px; overflow-x:auto; padding:6px 24px 10px; scroll-snap-type:x proximity; position:relative; }
  .voice-card{ scroll-snap-align:start; flex:none; width:320px; background:var(--white); border:1px solid var(--line); border-radius:18px; padding:26px 24px 24px; display:flex; flex-direction:column; gap:18px; position:relative; box-shadow:0 1px 2px rgba(36,26,87,.04); transition:box-shadow .15s ease, transform .15s ease; }
  .voice-card:hover{ box-shadow:0 12px 24px rgba(36,26,87,.1); transform:translateY(-2px); }
  .voice-mark{ font-family:Georgia,serif; font-size:52px; line-height:1; color:var(--purple-100); font-weight:700; height:28px; }
  .voice-quote{ font-size:15px; color:var(--ink); line-height:1.6; margin:0; }
  .voice-who{ display:flex; align-items:center; gap:12px; margin-top:auto; padding-top:16px; border-top:1px solid var(--line); }
  .avatar{ width:38px; height:38px; border-radius:50%; background:linear-gradient(135deg,var(--purple-600),var(--purple-900)); color:var(--white); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:14px; flex:none; }
  .voice-who .name{ font-size:13.5px; font-weight:700; }
  .voice-who .role{ font-size:12px; color:var(--ink-faint); }

  /* ---------- COMMUNITY STRIP ---------- */
  .community{ padding:56px 24px; }
  .community-card{ background:var(--white); border:1px solid var(--line); border-radius:22px; padding:34px; display:grid; grid-template-columns:1fr auto; align-items:center; gap:24px; }
  .community-eyebrow{ font-size:12px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--purple-600); margin-bottom:8px; }
  .community-card h3{ font-size:20px; margin:0 0 6px; }
  .community-card p{ font-size:14px; color:var(--ink-soft); margin:0; }
  .community-card .date{ font-family:var(--mono); font-size:12.5px; color:var(--ink-faint); margin-top:8px; }
  .btn-outline{ background:transparent; border:1.5px solid var(--purple-600); color:var(--purple-700); }
  .btn-outline:hover{ background:var(--purple-050); }
  @media (max-width:640px){ .community-card{ grid-template-columns:1fr; } }

  /* ---------- CLOSING CTA ---------- */
  .closing{ background:var(--purple-900); color:var(--white); padding:64px 24px; text-align:center; }
  .closing img{ height:34px; margin:0 auto 18px; }
  .closing h2{ font-size:28px; margin:0 0 8px; letter-spacing:-0.01em; }
  .closing p{ color:var(--purple-100); font-size:15px; margin:0 0 26px; }

  /* ---------- FOOTER ---------- */
  footer{ background:var(--ink); color:var(--purple-100); padding:52px 24px 28px; }
  .footer-grid{ display:grid; grid-template-columns:1.4fr repeat(4,1fr); gap:28px; padding-bottom:36px; border-bottom:1px solid rgba(255,255,255,.12); }
  .footer-brand-row{ display:flex; align-items:center; gap:10px; margin-bottom:16px; }
  .footer-brand-row img.mark{ height:30px; }
  .footer-brand-row .word{ font-size:15px; font-weight:300; font-style:italic; color:var(--purple-100); }
  .footer-brand-row .word b{ font-weight:800; font-style:normal; color:var(--white); }
  .footer-brand p{ font-size:13px; color:#9C96B3; max-width:220px; }
  .footer-col h4{ font-size:12px; text-transform:uppercase; letter-spacing:.06em; color:#9C96B3; margin:0 0 14px; }
  .footer-col a{ display:block; font-size:13.5px; color:var(--purple-100); margin-bottom:10px; }
  .footer-col a:hover{ color:var(--white); }
  .footer-bottom{ padding-top:22px; font-size:12.5px; color:#7D77A0; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; }
  @media (max-width:820px){ .footer-grid{ grid-template-columns:1fr 1fr; } }

  /* ===== DAY 1 CONTENT STYLES ===== */
/* HERO */
  .lesson-hero{ position:relative; overflow:hidden; background:var(--purple-900); padding:64px 24px 88px; color:var(--white); }
  .hero-grid{ position:absolute; inset:0; display:grid; grid-template-columns:repeat(12,1fr); grid-template-rows:repeat(6,1fr); opacity:.5; pointer-events:none; }
  .hero-grid div{ background:var(--purple-600); }
  .lesson-hero-inner{ position:relative; max-width:720px; margin:0 auto; text-align:center; }
  .eyebrow{ display:inline-flex; align-items:center; gap:8px; font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--purple-100); background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.18); padding:6px 14px; border-radius:999px; margin-bottom:22px; }
  h1.hero-title{ font-size:clamp(34px,5.5vw,52px); line-height:1.06; margin:0 0 16px; font-weight:800; letter-spacing:-0.02em; }
  .hero-sub{ font-size:17px; color:var(--purple-100); margin:0 auto 30px; max-width:540px; }
  /* SECTIONS */
  .section{ padding:60px 24px; }
  .section-head{ max-width:660px; margin:0 auto 36px; text-align:center; }
  .section-eyebrow{ font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--purple-600); margin-bottom:10px; }
  .section-head h2{ font-size:28px; margin:0 0 12px; letter-spacing:-0.01em; }
  .section-head p{ color:var(--ink-soft); font-size:15.5px; margin:0; }

  .stat-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; max-width:920px; margin:0 auto; }
  .stat-grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; max-width:700px; margin:0 auto; }
  .stat-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:20px 18px; }
  .stat-card .label{ font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--purple-600); margin-bottom:8px; }
  .stat-card .value{ font-size:15px; font-weight:700; margin-bottom:4px; }
  .stat-card .desc{ font-size:13px; color:var(--ink-soft); }

  .callout{ max-width:700px; margin:20px auto 0; background:var(--purple-050); border:1px dashed var(--purple-600); border-radius:12px; padding:16px 20px; font-size:14px; color:var(--purple-900); display:flex; gap:10px; align-items:flex-start; }
  .callout b{ font-weight:700; }
  .callout.muted{ background:var(--bg); border:1px solid var(--line); color:var(--ink-soft); }

  /* PROMPT ANATOMY (generic flow diagram, not app UI) */
  .anatomy-flow{ display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:10px; max-width:860px; margin:0 auto 26px; }
  .anatomy-piece{ background:var(--white); border:1.5px solid var(--purple-600); border-radius:12px; padding:12px 16px; text-align:center; min-width:110px; }
  .anatomy-piece .big{ font-family:var(--mono); font-weight:700; color:var(--purple-700); font-size:12.5px; }
  .anatomy-piece .small{ font-size:10.5px; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.05em; margin-top:4px; }
  .anatomy-plus{ font-size:18px; color:var(--ink-faint); font-weight:300; }
  .anatomy-result{ max-width:660px; margin:0 auto; text-align:center; background:var(--purple-900); color:var(--white); border-radius:14px; padding:20px 26px; font-family:var(--mono); font-size:14.5px; font-weight:600; }
  .anatomy-result span{ color:var(--purple-100); font-size:11px; display:block; margin-bottom:8px; font-family:var(--sans); text-transform:uppercase; letter-spacing:.06em; font-weight:700; }

  /* BEFORE/AFTER */
  .ba-grid{ display:flex; flex-direction:column; gap:16px; max-width:760px; margin:0 auto; }
  .ba-card{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:14px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:20px; }
  .ba-side{ padding:2px 4px; }
  .ba-label{ font-size:10.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; margin-bottom:6px; }
  .ba-before .ba-label{ color:var(--red); }
  .ba-after .ba-label{ color:var(--green); }
  .ba-text{ font-family:var(--mono); font-size:13px; line-height:1.5; }
  .ba-before .ba-text{ color:var(--ink-soft); }
  .ba-after .ba-text{ color:var(--ink); font-weight:600; }
  .ba-arrow{ color:var(--ink-faint); font-size:18px; }
  .ba-why{ grid-column:1 / -1; font-size:12px; color:var(--ink-faint); border-top:1px dashed var(--line); padding-top:10px; margin-top:2px; }

  /* FILL-IN-THE-BLANK EXERCISE (worksheet style) */
  .worksheet{ max-width:720px; margin:0 auto; background:var(--white); border:1px solid var(--line); border-radius:20px; padding:28px 30px; }
  .worksheet-label{ font-size:11.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--purple-600); margin-bottom:14px; }
  .fillblank-sentence{ font-family:var(--mono); font-size:15.5px; line-height:2.1; color:var(--ink); margin-bottom:22px; }
  .blank{ display:inline-block; min-width:110px; padding:3px 10px; border-bottom:2.5px solid var(--purple-600); text-align:center; font-weight:700; color:var(--purple-700); background:var(--purple-050); border-radius:6px 6px 0 0; margin:0 2px; }
  .blank.empty{ color:var(--ink-faint); font-weight:400; background:transparent; }
  .wordbank-label{ font-size:11px; font-weight:700; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.05em; margin-bottom:10px; }
  .wordbank{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:20px; }
  .word-chip{ border:1.5px solid var(--purple-600); background:var(--white); color:var(--purple-700); font-size:13px; font-weight:600; padding:9px 15px; border-radius:999px; }
  .word-chip:hover{ background:var(--purple-050); }
  .word-chip:disabled{ opacity:.35; cursor:default; border-color:var(--line); color:var(--ink-faint); }
  .check-btn{ background:var(--purple-600); color:var(--white); border:none; border-radius:999px; padding:12px 24px; font-weight:700; font-size:14px; }
  .check-btn:hover{ background:var(--purple-700); }
  .check-btn:disabled{ background:var(--line); color:var(--ink-faint); cursor:default; }
  .worksheet-feedback{ margin-top:16px; padding:14px 16px; border-radius:10px; font-size:13.5px; display:none; }
  .worksheet-feedback.show{ display:block; }
  .worksheet-feedback.good{ background:var(--green-bg); color:#0f5a2b; }
  .worksheet-feedback.retry{ background:var(--amber-bg); color:#7a3a06; }

  /* EXERCISE CARD (replaces app-mockup sandboxes) */
  .exercise-card{ max-width:760px; margin:0 auto 28px; background:var(--white); border:1px solid var(--line); border-radius:20px; padding:26px 28px; }
  .exercise-card:last-child{ margin-bottom:0; }
  .exercise-head{ display:flex; align-items:center; gap:10px; margin-bottom:16px; }
  .exercise-icon{ width:32px; height:32px; border-radius:9px; background:var(--purple-050); color:var(--purple-700); display:flex; align-items:center; justify-content:center; font-size:15px; flex:none; }
  .exercise-title{ font-weight:700; font-size:15px; }
  .scenario-quote{ border-left:3px solid var(--purple-600); background:var(--purple-050); padding:12px 18px; border-radius:0 10px 10px 0; font-size:14px; color:var(--ink); line-height:1.6; margin-bottom:18px; }
  .reveal-btn{ background:none; border:1.5px solid var(--purple-600); color:var(--purple-700); border-radius:999px; padding:10px 20px; font-weight:700; font-size:13.5px; }
  .reveal-btn:hover{ background:var(--purple-050); }
  .insight-box{ margin-top:18px; border-radius:14px; background:var(--purple-050); padding:18px 20px; display:none; }
  .insight-box.show{ display:block; animation:fadein .3s ease; }
  @keyframes fadein{ from{opacity:0; transform:translateY(4px);} to{opacity:1; transform:translateY(0);} }
  .insight-label{ font-size:10.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--purple-700); margin-bottom:10px; }
  .insight-box p{ font-size:13.8px; line-height:1.6; margin:0 0 10px; color:var(--ink); }
  .insight-box p:last-child{ margin-bottom:0; }
  .insight-caveat{ font-size:12.5px; color:var(--ink-faint); margin-top:10px; padding-top:10px; border-top:1px dashed var(--line); }

  /* PITFALLS */
  .pitfall-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; max-width:820px; margin:0 auto; }

  /* WEEK MAP */
  .map-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; max-width:920px; margin:0 auto; }
  .map-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:18px; position:relative; }
  .map-icon{ width:30px; height:30px; border-radius:8px; background:var(--purple-050); color:var(--purple-700); display:flex; align-items:center; justify-content:center; font-size:14px; margin-bottom:10px; }
  .map-card h3{ font-size:14px; margin:0 0 6px; }
  .map-card p{ font-size:12.5px; color:var(--ink-soft); margin:0 0 10px; }
  .map-day{ font-size:10.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--purple-700); background:var(--purple-100); padding:3px 9px; border-radius:999px; display:inline-block; }
  .map-day.today{ background:var(--green-bg); color:var(--green); }
  .pitfall-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:20px; }
  .pitfall-head{ display:flex; align-items:center; gap:10px; margin-bottom:10px; }
  .pitfall-icon{ width:28px; height:28px; border-radius:8px; background:var(--red-bg); color:var(--red); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:13px; flex:none; }
  .pitfall-card h3{ font-size:14px; margin:0; }
  .pitfall-card .fix{ font-size:13px; color:var(--ink-soft); margin:0; padding-left:38px; }
  .pitfall-card .fix b{ color:var(--green); }

  /* QUIZ */
  .quiz-card{ max-width:100%; margin:0 auto 20px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:24px; }
  .quiz-q{ font-weight:700; font-size:14.5px; margin:0 0 14px; }
  .quiz-options{ display:flex; flex-direction:column; gap:8px; }
  .quiz-option{ display:block; width:100%; text-align:left; border:1.5px solid var(--line); background:var(--white); border-radius:10px; padding:11px 15px; font-size:13.5px; color:var(--ink); }
  .quiz-option:hover{ border-color:var(--purple-600); }
  .quiz-option.correct{ border-color:var(--green); background:var(--green-bg); font-weight:700; }
  .quiz-option.incorrect{ border-color:var(--red); background:var(--red-bg); }
  .quiz-option:disabled{ cursor:default; }
  .quiz-feedback{ font-size:12.8px; margin-top:12px; padding-top:12px; border-top:1px dashed var(--line); color:var(--ink-soft); display:none; }
  .quiz-feedback.show{ display:block; }
  .quiz-score{ max-width:100%; margin:0 auto; text-align:center; font-size:14px; color:var(--ink-soft); background:var(--purple-050); border-radius:12px; padding:16px; font-weight:600; }

  /* DAILY GOAL */
  .goal-section{ padding:50px 24px; background:var(--purple-050); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .goal-box{ max-width:640px; margin:0 auto; background:var(--white); border:2px solid var(--purple-600); border-radius:20px; padding:28px 30px; text-align:center; box-shadow:0 20px 50px -25px rgba(36,26,87,.25); }
  .goal-icon{ font-size:28px; margin-bottom:10px; }
  .goal-box h2{ font-size:20px; margin:0 0 10px; }
  .goal-box p{ font-size:14.5px; color:var(--ink-soft); margin:0 0 20px; }
  .goal-btn{ background:var(--purple-600); color:var(--white); border:none; border-radius:999px; padding:12px 24px; font-weight:700; font-size:14px; display:inline-flex; align-items:center; gap:8px; }
  .goal-btn:hover{ background:var(--purple-700); }
  .goal-btn.done{ background:var(--green); }
  .goal-actions{ display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }
  .goal-launch-btn{ background:transparent; color:var(--purple-700); border:1.5px solid var(--purple-600); border-radius:999px; padding:12px 22px; font-weight:700; font-size:14px; display:inline-flex; align-items:center; gap:8px; }
  .goal-launch-btn:hover{ background:var(--purple-050); }

  /* FOOTER */
  .footer-section{ background:var(--purple-900); color:var(--white); padding:56px 24px 60px; }
  .footer-inner{ max-width:680px; margin:0 auto; text-align:center; }
  .footer-inner h2{ font-size:24px; margin:0 0 10px; }
  .footer-inner p{ color:var(--purple-100); font-size:14.5px; margin:0 0 26px; }
  .next-teaser{ margin-top:34px; border-top:1px solid rgba(255,255,255,.15); padding-top:26px; font-size:13.5px; color:var(--purple-100); }
  .next-teaser b{ color:var(--white); }

  @media (max-width:720px){
    .stat-grid{ grid-template-columns:1fr 1fr; }
    .stat-grid-3{ grid-template-columns:1fr 1fr; }
    .map-grid{ grid-template-columns:1fr 1fr; }
    .pitfall-grid{ grid-template-columns:1fr; }
    .pitfall-card .fix{ padding-left:0; margin-top:4px; }
    .ba-card{ grid-template-columns:1fr; }
    .ba-arrow{ display:none; }
  }

  .course-nav{ max-width:640px; margin:30px auto 0; padding-top:26px; border-top:1px solid rgba(255,255,255,.15); display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }
  .course-nav .side-link{ font-size:13px; font-weight:700; color:var(--purple-100); display:inline-flex; align-items:center; gap:6px; }
  .course-nav .side-link:hover{ color:var(--white); }
  .course-nav .home-link{ font-size:12.5px; font-weight:600; color:var(--purple-100); opacity:.75; display:inline-flex; align-items:center; gap:6px; }
  .course-nav .home-link:hover{ opacity:1; color:var(--white); }
  .course-nav .next-link{ background:var(--white); color:var(--purple-900); padding:11px 20px; border-radius:999px; font-weight:700; font-size:13.5px; }
  .course-nav .next-link:hover{ background:var(--purple-100); }
  @media (max-width:560px){ .course-nav{ justify-content:center; text-align:center; } }


  /* ===== DAY 2 CONTENT STYLES ===== */
/* HERO */
  .lesson-hero{ position:relative; overflow:hidden; background:var(--purple-900); padding:64px 24px 88px; color:var(--white); }
  .hero-grid{ position:absolute; inset:0; display:grid; grid-template-columns:repeat(12,1fr); grid-template-rows:repeat(6,1fr); opacity:.5; pointer-events:none; }
  .hero-grid div{ background:var(--purple-600); }
  .lesson-hero-inner{ position:relative; max-width:720px; margin:0 auto; text-align:center; }
  .eyebrow{ display:inline-flex; align-items:center; gap:8px; font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--purple-100); background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.18); padding:6px 14px; border-radius:999px; margin-bottom:22px; }
  h1.hero-title{ font-size:clamp(34px,5.5vw,52px); line-height:1.06; margin:0 0 16px; font-weight:800; letter-spacing:-0.02em; }
  .hero-sub{ font-size:17px; color:var(--purple-100); margin:0 auto 30px; max-width:540px; }
  /* SECTIONS */
  .section{ padding:60px 24px; }
  .section-head{ max-width:660px; margin:0 auto 36px; text-align:center; }
  .section-eyebrow{ font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--purple-600); margin-bottom:10px; }
  .section-head h2{ font-size:28px; margin:0 0 12px; letter-spacing:-0.01em; }
  .section-head p{ color:var(--ink-soft); font-size:15.5px; margin:0; }

  .stat-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; max-width:920px; margin:0 auto; }
  .stat-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:20px 18px; }
  .stat-card .label{ font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--purple-600); margin-bottom:8px; }
  .stat-card .value{ font-size:15px; font-weight:700; margin-bottom:4px; }
  .stat-card .desc{ font-size:13px; color:var(--ink-soft); }

  .callout{ max-width:700px; margin:20px auto 0; background:var(--purple-050); border:1px dashed var(--purple-600); border-radius:12px; padding:16px 20px; font-size:14px; color:var(--purple-900); display:flex; gap:10px; align-items:flex-start; }
  .callout b{ font-weight:700; }
  .callout.muted{ background:var(--bg); border:1px solid var(--line); color:var(--ink-soft); }

  /* PROMPT ANATOMY (generic flow diagram, not app UI) */
  .anatomy-flow{ display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:10px; max-width:860px; margin:0 auto 26px; }
  .anatomy-piece{ background:var(--white); border:1.5px solid var(--purple-600); border-radius:12px; padding:12px 16px; text-align:center; min-width:110px; }
  .anatomy-piece .big{ font-family:var(--mono); font-weight:700; color:var(--purple-700); font-size:12.5px; }
  .anatomy-piece .small{ font-size:10.5px; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.05em; margin-top:4px; }
  .anatomy-plus{ font-size:18px; color:var(--ink-faint); font-weight:300; }
  .anatomy-result{ max-width:660px; margin:0 auto; text-align:center; background:var(--purple-900); color:var(--white); border-radius:14px; padding:20px 26px; font-family:var(--mono); font-size:14.5px; font-weight:600; }
  .anatomy-result span{ color:var(--purple-100); font-size:11px; display:block; margin-bottom:8px; font-family:var(--sans); text-transform:uppercase; letter-spacing:.06em; font-weight:700; }

  /* BEFORE/AFTER */
  .ba-grid{ display:flex; flex-direction:column; gap:16px; max-width:760px; margin:0 auto; }
  .ba-card{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:14px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:20px; }
  .ba-side{ padding:2px 4px; }
  .ba-label{ font-size:10.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; margin-bottom:6px; }
  .ba-before .ba-label{ color:var(--red); }
  .ba-after .ba-label{ color:var(--green); }
  .ba-text{ font-family:var(--mono); font-size:13px; line-height:1.5; }
  .ba-before .ba-text{ color:var(--ink-soft); }
  .ba-after .ba-text{ color:var(--ink); font-weight:600; }
  .ba-arrow{ color:var(--ink-faint); font-size:18px; }
  .ba-why{ grid-column:1 / -1; font-size:12px; color:var(--ink-faint); border-top:1px dashed var(--line); padding-top:10px; margin-top:2px; }

  /* FILL-IN-THE-BLANK EXERCISE (worksheet style) */
  .worksheet{ max-width:720px; margin:0 auto; background:var(--white); border:1px solid var(--line); border-radius:20px; padding:28px 30px; }
  .worksheet-label{ font-size:11.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--purple-600); margin-bottom:14px; }
  .fillblank-sentence{ font-family:var(--mono); font-size:15.5px; line-height:2.1; color:var(--ink); margin-bottom:22px; }
  .blank{ display:inline-block; min-width:110px; padding:3px 10px; border-bottom:2.5px solid var(--purple-600); text-align:center; font-weight:700; color:var(--purple-700); background:var(--purple-050); border-radius:6px 6px 0 0; margin:0 2px; }
  .blank.empty{ color:var(--ink-faint); font-weight:400; background:transparent; }
  .wordbank-label{ font-size:11px; font-weight:700; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.05em; margin-bottom:10px; }
  .wordbank{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:20px; }
  .word-chip{ border:1.5px solid var(--purple-600); background:var(--white); color:var(--purple-700); font-size:13px; font-weight:600; padding:9px 15px; border-radius:999px; }
  .word-chip:hover{ background:var(--purple-050); }
  .word-chip:disabled{ opacity:.35; cursor:default; border-color:var(--line); color:var(--ink-faint); }
  .check-btn{ background:var(--purple-600); color:var(--white); border:none; border-radius:999px; padding:12px 24px; font-weight:700; font-size:14px; }
  .check-btn:hover{ background:var(--purple-700); }
  .check-btn:disabled{ background:var(--line); color:var(--ink-faint); cursor:default; }
  .worksheet-feedback{ margin-top:16px; padding:14px 16px; border-radius:10px; font-size:13.5px; display:none; }
  .worksheet-feedback.show{ display:block; }
  .worksheet-feedback.good{ background:var(--green-bg); color:#0f5a2b; }
  .worksheet-feedback.retry{ background:var(--amber-bg); color:#7a3a06; }

  /* EXERCISE CARD (replaces app-mockup sandboxes) */
  .exercise-card{ max-width:760px; margin:0 auto 28px; background:var(--white); border:1px solid var(--line); border-radius:20px; padding:26px 28px; }
  .exercise-card:last-child{ margin-bottom:0; }
  .exercise-head{ display:flex; align-items:center; gap:10px; margin-bottom:16px; }
  .exercise-icon{ width:32px; height:32px; border-radius:9px; background:var(--purple-050); color:var(--purple-700); display:flex; align-items:center; justify-content:center; font-size:15px; flex:none; }
  .exercise-title{ font-weight:700; font-size:15px; }
  .scenario-quote{ border-left:3px solid var(--purple-600); background:var(--purple-050); padding:12px 18px; border-radius:0 10px 10px 0; font-size:14px; color:var(--ink); line-height:1.6; margin-bottom:18px; }
  .reveal-btn{ background:none; border:1.5px solid var(--purple-600); color:var(--purple-700); border-radius:999px; padding:10px 20px; font-weight:700; font-size:13.5px; }
  .reveal-btn:hover{ background:var(--purple-050); }
  .insight-box{ margin-top:18px; border-radius:14px; background:var(--purple-050); padding:18px 20px; display:none; }
  .insight-box.show{ display:block; animation:fadein .3s ease; }
  @keyframes fadein{ from{opacity:0; transform:translateY(4px);} to{opacity:1; transform:translateY(0);} }
  .insight-label{ font-size:10.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--purple-700); margin-bottom:10px; }
  .insight-box p{ font-size:13.8px; line-height:1.6; margin:0 0 10px; color:var(--ink); }
  .insight-box p:last-child{ margin-bottom:0; }
  .insight-caveat{ font-size:12.5px; color:var(--ink-faint); margin-top:10px; padding-top:10px; border-top:1px dashed var(--line); }

  /* PITFALLS */
  .pitfall-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; max-width:820px; margin:0 auto; }

  /* WEEK MAP */
  .map-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; max-width:920px; margin:0 auto; }
  .map-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:18px; position:relative; }
  .map-icon{ width:30px; height:30px; border-radius:8px; background:var(--purple-050); color:var(--purple-700); display:flex; align-items:center; justify-content:center; font-size:14px; margin-bottom:10px; }
  .map-card h3{ font-size:14px; margin:0 0 6px; }
  .map-card p{ font-size:12.5px; color:var(--ink-soft); margin:0 0 10px; }
  .map-day{ font-size:10.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--purple-700); background:var(--purple-100); padding:3px 9px; border-radius:999px; display:inline-block; }
  .map-day.today{ background:var(--green-bg); color:var(--green); }
  .pitfall-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:20px; }
  .pitfall-head{ display:flex; align-items:center; gap:10px; margin-bottom:10px; }
  .pitfall-icon{ width:28px; height:28px; border-radius:8px; background:var(--red-bg); color:var(--red); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:13px; flex:none; }
  .pitfall-card h3{ font-size:14px; margin:0; }
  .pitfall-card .fix{ font-size:13px; color:var(--ink-soft); margin:0; padding-left:38px; }
  .pitfall-card .fix b{ color:var(--green); }

  /* QUIZ */
  .quiz-card{ max-width:100%; margin:0 auto 20px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:24px; }
  .quiz-q{ font-weight:700; font-size:14.5px; margin:0 0 14px; }
  .quiz-options{ display:flex; flex-direction:column; gap:8px; }
  .quiz-option{ display:block; width:100%; text-align:left; border:1.5px solid var(--line); background:var(--white); border-radius:10px; padding:11px 15px; font-size:13.5px; color:var(--ink); }
  .quiz-option:hover{ border-color:var(--purple-600); }
  .quiz-option.correct{ border-color:var(--green); background:var(--green-bg); font-weight:700; }
  .quiz-option.incorrect{ border-color:var(--red); background:var(--red-bg); }
  .quiz-option:disabled{ cursor:default; }
  .quiz-feedback{ font-size:12.8px; margin-top:12px; padding-top:12px; border-top:1px dashed var(--line); color:var(--ink-soft); display:none; }
  .quiz-feedback.show{ display:block; }
  .quiz-score{ max-width:100%; margin:0 auto; text-align:center; font-size:14px; color:var(--ink-soft); background:var(--purple-050); border-radius:12px; padding:16px; font-weight:600; }

  /* DAILY GOAL */
  .goal-section{ padding:50px 24px; background:var(--purple-050); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .goal-box{ max-width:640px; margin:0 auto; background:var(--white); border:2px solid var(--purple-600); border-radius:20px; padding:28px 30px; text-align:center; box-shadow:0 20px 50px -25px rgba(36,26,87,.25); }
  .goal-icon{ font-size:28px; margin-bottom:10px; }
  .goal-box h2{ font-size:20px; margin:0 0 10px; }
  .goal-box p{ font-size:14.5px; color:var(--ink-soft); margin:0 0 20px; }
  .goal-btn{ background:var(--purple-600); color:var(--white); border:none; border-radius:999px; padding:12px 24px; font-weight:700; font-size:14px; display:inline-flex; align-items:center; gap:8px; }
  .goal-btn:hover{ background:var(--purple-700); }
  .goal-btn.done{ background:var(--green); }

  /* FOOTER */
  .footer-section{ background:var(--purple-900); color:var(--white); padding:56px 24px 60px; }
  .footer-inner{ max-width:680px; margin:0 auto; text-align:center; }
  .footer-inner h2{ font-size:24px; margin:0 0 10px; }
  .footer-inner p{ color:var(--purple-100); font-size:14.5px; margin:0 0 26px; }
  .next-teaser{ margin-top:34px; border-top:1px solid rgba(255,255,255,.15); padding-top:26px; font-size:13.5px; color:var(--purple-100); }
  .next-teaser b{ color:var(--white); }

  @media (max-width:720px){
    .stat-grid{ grid-template-columns:1fr 1fr; }
    .map-grid{ grid-template-columns:1fr 1fr; }
    .pitfall-grid{ grid-template-columns:1fr; }
    .pitfall-card .fix{ padding-left:0; margin-top:4px; }
    .ba-card{ grid-template-columns:1fr; }
    .ba-arrow{ display:none; }
  }

  .course-nav{ max-width:640px; margin:30px auto 0; padding-top:26px; border-top:1px solid rgba(255,255,255,.15); display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }
  .course-nav .side-link{ font-size:13px; font-weight:700; color:var(--purple-100); display:inline-flex; align-items:center; gap:6px; }
  .course-nav .side-link:hover{ color:var(--white); }
  .course-nav .home-link{ font-size:12.5px; font-weight:600; color:var(--purple-100); opacity:.75; display:inline-flex; align-items:center; gap:6px; }
  .course-nav .home-link:hover{ opacity:1; color:var(--white); }
  .course-nav .next-link{ background:var(--white); color:var(--purple-900); padding:11px 20px; border-radius:999px; font-weight:700; font-size:13.5px; }
  .course-nav .next-link:hover{ background:var(--purple-100); }
  @media (max-width:560px){ .course-nav{ justify-content:center; text-align:center; } }


  /* ===== DAY 3 CONTENT STYLES ===== */
/* HERO */
  .lesson-hero{ position:relative; overflow:hidden; background:var(--purple-900); padding:64px 24px 88px; color:var(--white); }
  .hero-grid{ position:absolute; inset:0; display:grid; grid-template-columns:repeat(12,1fr); grid-template-rows:repeat(6,1fr); opacity:.5; pointer-events:none; }
  .hero-grid div{ background:var(--purple-600); }
  .lesson-hero-inner{ position:relative; max-width:720px; margin:0 auto; text-align:center; }
  .eyebrow{ display:inline-flex; align-items:center; gap:8px; font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--purple-100); background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.18); padding:6px 14px; border-radius:999px; margin-bottom:22px; }
  h1.hero-title{ font-size:clamp(34px,5.5vw,52px); line-height:1.06; margin:0 0 16px; font-weight:800; letter-spacing:-0.02em; }
  .hero-sub{ font-size:17px; color:var(--purple-100); margin:0 auto 30px; max-width:540px; }
  /* SECTIONS */
  .section{ padding:60px 24px; }
  .section-head{ max-width:660px; margin:0 auto 36px; text-align:center; }
  .section-eyebrow{ font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--purple-600); margin-bottom:10px; }
  .section-head h2{ font-size:28px; margin:0 0 12px; letter-spacing:-0.01em; }
  .section-head p{ color:var(--ink-soft); font-size:15.5px; margin:0; }

  .stat-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; max-width:920px; margin:0 auto; }
  .stat-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:20px 18px; }
  .stat-card .label{ font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--purple-600); margin-bottom:8px; }
  .stat-card .value{ font-size:15px; font-weight:700; margin-bottom:4px; }
  .stat-card .desc{ font-size:13px; color:var(--ink-soft); }

  .callout{ max-width:700px; margin:20px auto 0; background:var(--purple-050); border:1px dashed var(--purple-600); border-radius:12px; padding:16px 20px; font-size:14px; color:var(--purple-900); display:flex; gap:10px; align-items:flex-start; }
  .callout b{ font-weight:700; }
  .callout.muted{ background:var(--bg); border:1px solid var(--line); color:var(--ink-soft); }

  /* PROMPT ANATOMY (generic flow diagram, not app UI) */
  .anatomy-flow{ display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:10px; max-width:860px; margin:0 auto 26px; }
  .anatomy-piece{ background:var(--white); border:1.5px solid var(--purple-600); border-radius:12px; padding:12px 16px; text-align:center; min-width:110px; }
  .anatomy-piece .big{ font-family:var(--mono); font-weight:700; color:var(--purple-700); font-size:12.5px; }
  .anatomy-piece .small{ font-size:10.5px; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.05em; margin-top:4px; }
  .anatomy-plus{ font-size:18px; color:var(--ink-faint); font-weight:300; }
  .anatomy-result{ max-width:660px; margin:0 auto; text-align:center; background:var(--purple-900); color:var(--white); border-radius:14px; padding:20px 26px; font-family:var(--mono); font-size:14.5px; font-weight:600; }
  .anatomy-result span{ color:var(--purple-100); font-size:11px; display:block; margin-bottom:8px; font-family:var(--sans); text-transform:uppercase; letter-spacing:.06em; font-weight:700; }

  /* BEFORE/AFTER */
  .ba-grid{ display:flex; flex-direction:column; gap:16px; max-width:760px; margin:0 auto; }
  .ba-card{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:14px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:20px; }
  .ba-side{ padding:2px 4px; }
  .ba-label{ font-size:10.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; margin-bottom:6px; }
  .ba-before .ba-label{ color:var(--red); }
  .ba-after .ba-label{ color:var(--green); }
  .ba-text{ font-family:var(--mono); font-size:13px; line-height:1.5; }
  .ba-before .ba-text{ color:var(--ink-soft); }
  .ba-after .ba-text{ color:var(--ink); font-weight:600; }
  .ba-arrow{ color:var(--ink-faint); font-size:18px; }
  .ba-why{ grid-column:1 / -1; font-size:12px; color:var(--ink-faint); border-top:1px dashed var(--line); padding-top:10px; margin-top:2px; }

  /* FILL-IN-THE-BLANK EXERCISE (worksheet style) */
  .worksheet{ max-width:720px; margin:0 auto; background:var(--white); border:1px solid var(--line); border-radius:20px; padding:28px 30px; }
  .worksheet-label{ font-size:11.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--purple-600); margin-bottom:14px; }
  .fillblank-sentence{ font-family:var(--mono); font-size:15.5px; line-height:2.1; color:var(--ink); margin-bottom:22px; }
  .blank{ display:inline-block; min-width:110px; padding:3px 10px; border-bottom:2.5px solid var(--purple-600); text-align:center; font-weight:700; color:var(--purple-700); background:var(--purple-050); border-radius:6px 6px 0 0; margin:0 2px; }
  .blank.empty{ color:var(--ink-faint); font-weight:400; background:transparent; }
  .wordbank-label{ font-size:11px; font-weight:700; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.05em; margin-bottom:10px; }
  .wordbank{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:20px; }
  .word-chip{ border:1.5px solid var(--purple-600); background:var(--white); color:var(--purple-700); font-size:13px; font-weight:600; padding:9px 15px; border-radius:999px; }
  .word-chip:hover{ background:var(--purple-050); }
  .word-chip:disabled{ opacity:.35; cursor:default; border-color:var(--line); color:var(--ink-faint); }
  .check-btn{ background:var(--purple-600); color:var(--white); border:none; border-radius:999px; padding:12px 24px; font-weight:700; font-size:14px; }
  .check-btn:hover{ background:var(--purple-700); }
  .check-btn:disabled{ background:var(--line); color:var(--ink-faint); cursor:default; }
  .worksheet-feedback{ margin-top:16px; padding:14px 16px; border-radius:10px; font-size:13.5px; display:none; }
  .worksheet-feedback.show{ display:block; }
  .worksheet-feedback.good{ background:var(--green-bg); color:#0f5a2b; }
  .worksheet-feedback.retry{ background:var(--amber-bg); color:#7a3a06; }

  /* EXERCISE CARD (replaces app-mockup sandboxes) */
  .exercise-card{ max-width:760px; margin:0 auto 28px; background:var(--white); border:1px solid var(--line); border-radius:20px; padding:26px 28px; }
  .exercise-card:last-child{ margin-bottom:0; }
  .exercise-head{ display:flex; align-items:center; gap:10px; margin-bottom:16px; }
  .exercise-icon{ width:32px; height:32px; border-radius:9px; background:var(--purple-050); color:var(--purple-700); display:flex; align-items:center; justify-content:center; font-size:15px; flex:none; }
  .exercise-title{ font-weight:700; font-size:15px; }
  .scenario-quote{ border-left:3px solid var(--purple-600); background:var(--purple-050); padding:12px 18px; border-radius:0 10px 10px 0; font-size:14px; color:var(--ink); line-height:1.6; margin-bottom:18px; }
  .reveal-btn{ background:none; border:1.5px solid var(--purple-600); color:var(--purple-700); border-radius:999px; padding:10px 20px; font-weight:700; font-size:13.5px; }
  .reveal-btn:hover{ background:var(--purple-050); }
  .insight-box{ margin-top:18px; border-radius:14px; background:var(--purple-050); padding:18px 20px; display:none; }
  .insight-box.show{ display:block; animation:fadein .3s ease; }
  @keyframes fadein{ from{opacity:0; transform:translateY(4px);} to{opacity:1; transform:translateY(0);} }
  .insight-label{ font-size:10.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--purple-700); margin-bottom:10px; }
  .insight-box p{ font-size:13.8px; line-height:1.6; margin:0 0 10px; color:var(--ink); }
  .insight-box p:last-child{ margin-bottom:0; }
  .insight-caveat{ font-size:12.5px; color:var(--ink-faint); margin-top:10px; padding-top:10px; border-top:1px dashed var(--line); }

  /* PITFALLS */
  .pitfall-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; max-width:820px; margin:0 auto; }
  .pitfall-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:20px; }
  .pitfall-head{ display:flex; align-items:center; gap:10px; margin-bottom:10px; }
  .pitfall-icon{ width:28px; height:28px; border-radius:8px; background:var(--red-bg); color:var(--red); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:13px; flex:none; }
  .pitfall-card h3{ font-size:14px; margin:0; }
  .pitfall-card .fix{ font-size:13px; color:var(--ink-soft); margin:0; padding-left:38px; }
  .pitfall-card .fix b{ color:var(--green); }

  /* QUIZ */
  .quiz-card{ max-width:100%; margin:0 auto 20px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:24px; }
  .quiz-q{ font-weight:700; font-size:14.5px; margin:0 0 14px; }
  .quiz-options{ display:flex; flex-direction:column; gap:8px; }
  .quiz-option{ display:block; width:100%; text-align:left; border:1.5px solid var(--line); background:var(--white); border-radius:10px; padding:11px 15px; font-size:13.5px; color:var(--ink); }
  .quiz-option:hover{ border-color:var(--purple-600); }
  .quiz-option.correct{ border-color:var(--green); background:var(--green-bg); font-weight:700; }
  .quiz-option.incorrect{ border-color:var(--red); background:var(--red-bg); }
  .quiz-option:disabled{ cursor:default; }
  .quiz-feedback{ font-size:12.8px; margin-top:12px; padding-top:12px; border-top:1px dashed var(--line); color:var(--ink-soft); display:none; }
  .quiz-feedback.show{ display:block; }
  .quiz-score{ max-width:100%; margin:0 auto; text-align:center; font-size:14px; color:var(--ink-soft); background:var(--purple-050); border-radius:12px; padding:16px; font-weight:600; }

  /* DAILY GOAL */
  .goal-section{ padding:50px 24px; background:var(--purple-050); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .goal-box{ max-width:640px; margin:0 auto; background:var(--white); border:2px solid var(--purple-600); border-radius:20px; padding:28px 30px; text-align:center; box-shadow:0 20px 50px -25px rgba(36,26,87,.25); }
  .goal-icon{ font-size:28px; margin-bottom:10px; }
  .goal-box h2{ font-size:20px; margin:0 0 10px; }
  .goal-box p{ font-size:14.5px; color:var(--ink-soft); margin:0 0 20px; }
  .goal-btn{ background:var(--purple-600); color:var(--white); border:none; border-radius:999px; padding:12px 24px; font-weight:700; font-size:14px; display:inline-flex; align-items:center; gap:8px; }
  .goal-btn:hover{ background:var(--purple-700); }
  .goal-btn.done{ background:var(--green); }

  /* FOOTER */
  .footer-section{ background:var(--purple-900); color:var(--white); padding:56px 24px 60px; }
  .footer-inner{ max-width:680px; margin:0 auto; text-align:center; }
  .footer-inner h2{ font-size:24px; margin:0 0 10px; }
  .footer-inner p{ color:var(--purple-100); font-size:14.5px; margin:0 0 26px; }
  .next-teaser{ margin-top:34px; border-top:1px solid rgba(255,255,255,.15); padding-top:26px; font-size:13.5px; color:var(--purple-100); }
  .next-teaser b{ color:var(--white); }

  /* MATCH EXERCISE */
  .match-wrap{ display:grid; grid-template-columns:1fr 1fr; gap:24px; max-width:720px; margin:0 auto; }
  .match-col-label{ font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:10px; text-align:center; }
  .match-item{ width:100%; text-align:left; border:1.5px solid var(--line); background:var(--white); border-radius:12px; padding:13px 16px; font-size:13.5px; margin-bottom:10px; color:var(--ink); }
  .match-item:hover{ border-color:var(--purple-600); }
  .match-item.selected{ border-color:var(--purple-600); background:var(--purple-050); }
  .match-item.matched{ border-color:var(--green); background:var(--green-bg); color:#0f5a2b; font-weight:600; cursor:default; }
  .match-item.wrong{ border-color:var(--red); background:var(--red-bg); }
  .match-status{ text-align:center; font-size:13px; color:var(--ink-faint); margin-top:6px; }

  @media (max-width:720px){
    .stat-grid{ grid-template-columns:1fr 1fr; }
    .pitfall-grid{ grid-template-columns:1fr; }
    .pitfall-card .fix{ padding-left:0; margin-top:4px; }
    .ba-card{ grid-template-columns:1fr; }
    .ba-arrow{ display:none; }
    .match-wrap{ grid-template-columns:1fr; }
  }

  .course-nav{ max-width:640px; margin:30px auto 0; padding-top:26px; border-top:1px solid rgba(255,255,255,.15); display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }
  .course-nav .side-link{ font-size:13px; font-weight:700; color:var(--purple-100); display:inline-flex; align-items:center; gap:6px; }
  .course-nav .side-link:hover{ color:var(--white); }
  .course-nav .home-link{ font-size:12.5px; font-weight:600; color:var(--purple-100); opacity:.75; display:inline-flex; align-items:center; gap:6px; }
  .course-nav .home-link:hover{ opacity:1; color:var(--white); }
  .course-nav .next-link{ background:var(--white); color:var(--purple-900); padding:11px 20px; border-radius:999px; font-weight:700; font-size:13.5px; }
  .course-nav .next-link:hover{ background:var(--purple-100); }
  @media (max-width:560px){ .course-nav{ justify-content:center; text-align:center; } }

  /* ---- PIXEL-CLOSE PLAYBOOK MOCKUPS (Day 3 only) ---- */
  .mock-wizard{ background:#fff; border:1px solid #e5e5f0; border-radius:20px; overflow:hidden; box-shadow:0 20px 50px -25px rgba(36,26,87,.2); max-width:760px; margin:0 auto 20px; }
  .mock-progress-wrap{ padding:20px 30px 16px; border-bottom:1px solid #eee; }
  .mock-progress-bar{ display:flex; gap:6px; max-width:220px; margin:0 auto 10px; }
  .mock-progress-seg{ flex:1; height:4px; border-radius:2px; background:#e5e0f5; }
  .mock-progress-seg.active{ background:var(--purple-600); }
  .mock-progress-labels{ text-align:center; }
  .mock-step-name{ font-weight:700; color:var(--purple-600); font-size:13px; }
  .mock-step-desc{ font-size:12px; color:#a8a3c0; }

  .mock-body{ padding:24px 30px; }
  .mock-title{ font-size:20px; font-weight:800; margin:0 0 8px; color:#111; }
  .mock-desc{ font-size:13.5px; color:#666; margin:0 0 20px; line-height:1.5; }

  .mock-field{ border:1px solid #e5e5ec; border-radius:14px; padding:16px 18px; margin-bottom:12px; }
  .mock-field-top{ display:flex; align-items:flex-start; gap:12px; flex-wrap:wrap; }
  .mock-field-icon{ font-size:16px; color:#333; margin-top:2px; }
  .mock-field-text{ flex:1; min-width:160px; }
  .mock-field-label{ font-weight:700; font-size:14.5px; color:#111; }
  .mock-field-desc{ font-size:12.5px; color:#8a8a99; margin-top:2px; }
  .mock-field-control{ min-width:180px; flex:none; }
  .mock-dropdown{ border:1px solid #e0e0ea; border-radius:10px; padding:9px 14px; display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:13.5px; color:#333; background:#fff; }
  .mock-dropdown .chev{ color:#999; font-size:11px; }
  .mock-tag-control{ border:1px solid #d8ccf7; border-radius:10px; padding:9px 14px; display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:13.5px; color:var(--purple-700); font-weight:600; background:#fff; }
  .mock-tag-control .x{ color:var(--purple-600); font-weight:700; }
  .mock-added-label{ font-size:12px; font-weight:700; color:#111; margin:12px 0 8px; }
  .mock-chip{ display:inline-flex; align-items:center; gap:6px; background:var(--purple-050); color:var(--purple-700); font-size:12.5px; font-weight:600; padding:6px 12px; border-radius:8px; }

  .mock-radio-group{ display:flex; flex-direction:column; gap:10px; }
  .mock-radio{ display:flex; align-items:center; gap:10px; font-size:14px; color:#333; }
  .mock-radio .rc{ width:16px; height:16px; border-radius:50%; border:1.5px solid #ccc; flex:none; }

  .mock-input{ border:1px solid #e0e0ea; border-radius:10px; padding:12px 14px; font-size:14px; color:#333; margin-top:6px; }
  .mock-textarea{ border:1px solid #e0e0ea; border-radius:10px; padding:14px; font-size:13px; color:#444; line-height:1.6; min-height:90px; margin-top:6px; }
  .mock-input-label{ font-weight:700; font-size:14px; color:#111; margin-bottom:2px; }

  .mock-run-btn{ width:100%; background:var(--purple-600); color:#fff; border:none; border-radius:12px; padding:15px; font-weight:700; font-size:14.5px; margin-top:6px; cursor:pointer; }
  .mock-run-btn:hover{ background:var(--purple-700); }

  .mock-report{ background:#fff; border:1px solid #e5e5f0; border-radius:20px; overflow:hidden; box-shadow:0 20px 50px -25px rgba(36,26,87,.2); max-width:760px; margin:0 auto; display:none; }
  .mock-report.show{ display:block; animation:fadein .35s ease; }
  .mock-report-progress{ padding:16px 30px; border-bottom:1px solid #eee; }
  .mock-report-body{ padding:26px 30px; }
  .mock-report-titlerow{ display:flex; align-items:center; gap:12px; margin-bottom:16px; }
  .mock-report-icon{ width:32px; height:32px; border-radius:50%; background:#f2f0fb; display:flex; align-items:center; justify-content:center; font-size:14px; flex:none; }
  .mock-report-title{ font-size:19px; font-weight:800; color:#111; }
  .mock-report-meta{ font-size:13.5px; color:#333; line-height:1.9; margin-bottom:14px; }
  .mock-report-meta b{ font-weight:700; }
  .mock-report-para{ font-size:13.5px; color:#333; line-height:1.6; margin-bottom:18px; }
  .mock-report-subhead{ display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
  .mock-report-subhead h4{ font-size:15px; font-weight:800; margin:0; color:#111; }
  .mock-report-icons{ display:flex; gap:8px; color:#999; font-size:13px; }
  .mock-table{ width:100%; border-collapse:collapse; margin-bottom:18px; font-size:13px; border:1px solid #eee; border-radius:10px; overflow:hidden; }
  .mock-table th{ background:#f7f7fb; text-align:left; padding:10px 12px; font-size:12px; color:#666; font-weight:700; }
  .mock-table td{ padding:10px 12px; border-top:1px solid #eee; color:#333; }
  .mock-table td.mock-delta{ color:var(--green); font-weight:800; background:#eaf7ee; }
  .mock-supporting h4, .mock-insights h4{ font-size:15px; font-weight:800; margin:0 0 10px; color:#111; }
  .mock-supporting ul{ margin:0 0 18px; padding-left:20px; font-size:13.5px; color:#333; line-height:1.9; }
  .mock-supporting li b{ font-weight:700; }
  .mock-insights ol{ margin:0; padding-left:20px; font-size:13.5px; color:#333; line-height:1.7; }
  .mock-insights li{ margin-bottom:10px; }
  .mock-insights li b{ font-weight:700; }
  .mock-caveat{ font-size:12.5px; color:var(--ink-faint); margin-top:10px; padding-top:10px; border-top:1px dashed var(--line); }

  @media (max-width:640px){
    .mock-field-top{ flex-direction:column; }
    .mock-field-control{ width:100%; }
  }

  /* ===== DAY 4 CONTENT STYLES ===== */
/* HERO */
  .lesson-hero{ position:relative; overflow:hidden; background:var(--purple-900); padding:64px 24px 88px; color:var(--white); }
  .hero-grid{ position:absolute; inset:0; display:grid; grid-template-columns:repeat(12,1fr); grid-template-rows:repeat(6,1fr); opacity:.5; pointer-events:none; }
  .hero-grid div{ background:var(--purple-600); }
  .lesson-hero-inner{ position:relative; max-width:720px; margin:0 auto; text-align:center; }
  .eyebrow{ display:inline-flex; align-items:center; gap:8px; font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--purple-100); background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.18); padding:6px 14px; border-radius:999px; margin-bottom:22px; }
  h1.hero-title{ font-size:clamp(34px,5.5vw,52px); line-height:1.06; margin:0 0 16px; font-weight:800; letter-spacing:-0.02em; }
  .hero-sub{ font-size:17px; color:var(--purple-100); margin:0 auto 30px; max-width:540px; }
  /* SECTIONS */
  .section{ padding:60px 24px; }
  .section-head{ max-width:660px; margin:0 auto 36px; text-align:center; }
  .section-eyebrow{ font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--purple-600); margin-bottom:10px; }
  .section-head h2{ font-size:28px; margin:0 0 12px; letter-spacing:-0.01em; }
  .section-head p{ color:var(--ink-soft); font-size:15.5px; margin:0; }

  .stat-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; max-width:920px; margin:0 auto; }
  .stat-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:20px 18px; }
  .stat-card .label{ font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--purple-600); margin-bottom:8px; }
  .stat-card .value{ font-size:15px; font-weight:700; margin-bottom:4px; }
  .stat-card .desc{ font-size:13px; color:var(--ink-soft); }

  .callout{ max-width:700px; margin:20px auto 0; background:var(--purple-050); border:1px dashed var(--purple-600); border-radius:12px; padding:16px 20px; font-size:14px; color:var(--purple-900); display:flex; gap:10px; align-items:flex-start; }
  .callout b{ font-weight:700; }
  .callout.muted{ background:var(--bg); border:1px solid var(--line); color:var(--ink-soft); }

  /* PROMPT ANATOMY (generic flow diagram, not app UI) */
  .anatomy-flow{ display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:10px; max-width:860px; margin:0 auto 26px; }
  .anatomy-piece{ background:var(--white); border:1.5px solid var(--purple-600); border-radius:12px; padding:12px 16px; text-align:center; min-width:110px; }
  .anatomy-piece .big{ font-family:var(--mono); font-weight:700; color:var(--purple-700); font-size:12.5px; }
  .anatomy-piece .small{ font-size:10.5px; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.05em; margin-top:4px; }
  .anatomy-plus{ font-size:18px; color:var(--ink-faint); font-weight:300; }
  .anatomy-result{ max-width:660px; margin:0 auto; text-align:center; background:var(--purple-900); color:var(--white); border-radius:14px; padding:20px 26px; font-family:var(--mono); font-size:14.5px; font-weight:600; }
  .anatomy-result span{ color:var(--purple-100); font-size:11px; display:block; margin-bottom:8px; font-family:var(--sans); text-transform:uppercase; letter-spacing:.06em; font-weight:700; }

  /* BEFORE/AFTER */
  .ba-grid{ display:flex; flex-direction:column; gap:16px; max-width:760px; margin:0 auto; }
  .ba-card{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:14px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:20px; }
  .ba-side{ padding:2px 4px; }
  .ba-label{ font-size:10.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; margin-bottom:6px; }
  .ba-before .ba-label{ color:var(--red); }
  .ba-after .ba-label{ color:var(--green); }
  .ba-text{ font-family:var(--mono); font-size:13px; line-height:1.5; }
  .ba-before .ba-text{ color:var(--ink-soft); }
  .ba-after .ba-text{ color:var(--ink); font-weight:600; }
  .ba-arrow{ color:var(--ink-faint); font-size:18px; }
  .ba-why{ grid-column:1 / -1; font-size:12px; color:var(--ink-faint); border-top:1px dashed var(--line); padding-top:10px; margin-top:2px; }

  /* FILL-IN-THE-BLANK EXERCISE (worksheet style) */
  .worksheet{ max-width:720px; margin:0 auto; background:var(--white); border:1px solid var(--line); border-radius:20px; padding:28px 30px; }
  .worksheet-label{ font-size:11.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--purple-600); margin-bottom:14px; }
  .fillblank-sentence{ font-family:var(--mono); font-size:15.5px; line-height:2.1; color:var(--ink); margin-bottom:22px; }
  .blank{ display:inline-block; min-width:110px; padding:3px 10px; border-bottom:2.5px solid var(--purple-600); text-align:center; font-weight:700; color:var(--purple-700); background:var(--purple-050); border-radius:6px 6px 0 0; margin:0 2px; }
  .blank.empty{ color:var(--ink-faint); font-weight:400; background:transparent; }
  .wordbank-label{ font-size:11px; font-weight:700; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.05em; margin-bottom:10px; }
  .wordbank{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:20px; }
  .word-chip{ border:1.5px solid var(--purple-600); background:var(--white); color:var(--purple-700); font-size:13px; font-weight:600; padding:9px 15px; border-radius:999px; }
  .word-chip:hover{ background:var(--purple-050); }
  .word-chip:disabled{ opacity:.35; cursor:default; border-color:var(--line); color:var(--ink-faint); }
  .check-btn{ background:var(--purple-600); color:var(--white); border:none; border-radius:999px; padding:12px 24px; font-weight:700; font-size:14px; }
  .check-btn:hover{ background:var(--purple-700); }
  .check-btn:disabled{ background:var(--line); color:var(--ink-faint); cursor:default; }
  .worksheet-feedback{ margin-top:16px; padding:14px 16px; border-radius:10px; font-size:13.5px; display:none; }
  .worksheet-feedback.show{ display:block; }
  .worksheet-feedback.good{ background:var(--green-bg); color:#0f5a2b; }
  .worksheet-feedback.retry{ background:var(--amber-bg); color:#7a3a06; }

  /* EXERCISE CARD (replaces app-mockup sandboxes) */
  .exercise-card{ max-width:760px; margin:0 auto 28px; background:var(--white); border:1px solid var(--line); border-radius:20px; padding:26px 28px; }
  .exercise-card:last-child{ margin-bottom:0; }
  .exercise-head{ display:flex; align-items:center; gap:10px; margin-bottom:16px; }
  .exercise-icon{ width:32px; height:32px; border-radius:9px; background:var(--purple-050); color:var(--purple-700); display:flex; align-items:center; justify-content:center; font-size:15px; flex:none; }
  .exercise-title{ font-weight:700; font-size:15px; }
  .scenario-quote{ border-left:3px solid var(--purple-600); background:var(--purple-050); padding:12px 18px; border-radius:0 10px 10px 0; font-size:14px; color:var(--ink); line-height:1.6; margin-bottom:18px; }
  .reveal-btn{ background:none; border:1.5px solid var(--purple-600); color:var(--purple-700); border-radius:999px; padding:10px 20px; font-weight:700; font-size:13.5px; }
  .reveal-btn:hover{ background:var(--purple-050); }
  .insight-box{ margin-top:18px; border-radius:14px; background:var(--purple-050); padding:18px 20px; display:none; }
  .insight-box.show{ display:block; animation:fadein .3s ease; }
  @keyframes fadein{ from{opacity:0; transform:translateY(4px);} to{opacity:1; transform:translateY(0);} }
  .insight-label{ font-size:10.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--purple-700); margin-bottom:10px; }
  .insight-box p{ font-size:13.8px; line-height:1.6; margin:0 0 10px; color:var(--ink); }
  .insight-box p:last-child{ margin-bottom:0; }
  .insight-caveat{ font-size:12.5px; color:var(--ink-faint); margin-top:10px; padding-top:10px; border-top:1px dashed var(--line); }

  /* PITFALLS */
  .pitfall-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; max-width:820px; margin:0 auto; }
  .pitfall-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:20px; }
  .pitfall-head{ display:flex; align-items:center; gap:10px; margin-bottom:10px; }
  .pitfall-icon{ width:28px; height:28px; border-radius:8px; background:var(--red-bg); color:var(--red); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:13px; flex:none; }
  .pitfall-card h3{ font-size:14px; margin:0; }
  .pitfall-card .fix{ font-size:13px; color:var(--ink-soft); margin:0; padding-left:38px; }
  .pitfall-card .fix b{ color:var(--green); }

  /* QUIZ */
  .quiz-card{ max-width:100%; margin:0 auto 20px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:24px; }
  .quiz-q{ font-weight:700; font-size:14.5px; margin:0 0 14px; }
  .quiz-options{ display:flex; flex-direction:column; gap:8px; }
  .quiz-option{ display:block; width:100%; text-align:left; border:1.5px solid var(--line); background:var(--white); border-radius:10px; padding:11px 15px; font-size:13.5px; color:var(--ink); }
  .quiz-option:hover{ border-color:var(--purple-600); }
  .quiz-option.correct{ border-color:var(--green); background:var(--green-bg); font-weight:700; }
  .quiz-option.incorrect{ border-color:var(--red); background:var(--red-bg); }
  .quiz-option:disabled{ cursor:default; }
  .quiz-feedback{ font-size:12.8px; margin-top:12px; padding-top:12px; border-top:1px dashed var(--line); color:var(--ink-soft); display:none; }
  .quiz-feedback.show{ display:block; }
  .quiz-score{ max-width:100%; margin:0 auto; text-align:center; font-size:14px; color:var(--ink-soft); background:var(--purple-050); border-radius:12px; padding:16px; font-weight:600; }

  /* DAILY GOAL */
  .goal-section{ padding:50px 24px; background:var(--purple-050); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .goal-box{ max-width:640px; margin:0 auto; background:var(--white); border:2px solid var(--purple-600); border-radius:20px; padding:28px 30px; text-align:center; box-shadow:0 20px 50px -25px rgba(36,26,87,.25); }
  .goal-icon{ font-size:28px; margin-bottom:10px; }
  .goal-box h2{ font-size:20px; margin:0 0 10px; }
  .goal-box p{ font-size:14.5px; color:var(--ink-soft); margin:0 0 20px; }
  .goal-btn{ background:var(--purple-600); color:var(--white); border:none; border-radius:999px; padding:12px 24px; font-weight:700; font-size:14px; display:inline-flex; align-items:center; gap:8px; }
  .goal-btn:hover{ background:var(--purple-700); }
  .goal-btn.done{ background:var(--green); }

  /* FOOTER */
  .footer-section{ background:var(--purple-900); color:var(--white); padding:56px 24px 60px; }
  .footer-inner{ max-width:680px; margin:0 auto; text-align:center; }
  .footer-inner h2{ font-size:24px; margin:0 0 10px; }
  .footer-inner p{ color:var(--purple-100); font-size:14.5px; margin:0 0 26px; }
  .next-teaser{ margin-top:34px; border-top:1px solid rgba(255,255,255,.15); padding-top:26px; font-size:13.5px; color:var(--purple-100); }
  .next-teaser b{ color:var(--white); }

  /* MATCH EXERCISE */
  .match-wrap{ display:grid; grid-template-columns:1fr 1fr; gap:24px; max-width:720px; margin:0 auto; }
  .match-col-label{ font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:10px; text-align:center; }
  .match-item{ width:100%; text-align:left; border:1.5px solid var(--line); background:var(--white); border-radius:12px; padding:13px 16px; font-size:13.5px; margin-bottom:10px; color:var(--ink); }
  .match-item:hover{ border-color:var(--purple-600); }
  .match-item.selected{ border-color:var(--purple-600); background:var(--purple-050); }
  .match-item.matched{ border-color:var(--green); background:var(--green-bg); color:#0f5a2b; font-weight:600; cursor:default; }
  .match-item.wrong{ border-color:var(--red); background:var(--red-bg); }
  .match-status{ text-align:center; font-size:13px; color:var(--ink-faint); margin-top:6px; }

  /* ITEM LIST (Files / Prompts examples) */
  .item-list{ max-width:760px; margin:0 auto 24px; display:flex; flex-direction:column; gap:10px; }
  .item{ background:var(--white); border:1px solid var(--line); border-radius:12px; padding:14px 18px; display:flex; gap:14px; align-items:flex-start; }
  .item-icon{ width:30px; height:30px; border-radius:8px; background:var(--purple-050); color:var(--purple-700); display:flex; align-items:center; justify-content:center; font-size:14px; flex:none; }
  .item-body{ flex:1; }
  .item-body h3{ font-size:14px; margin:0 0 4px; }
  .item-body p{ font-size:13px; color:var(--ink-soft); margin:0; }
  .source-tag{ font-size:10px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--purple-700); background:var(--purple-100); padding:3px 9px; border-radius:999px; flex:none; white-space:nowrap; }

  @media (max-width:720px){
    .stat-grid{ grid-template-columns:1fr 1fr; }
    .pitfall-grid{ grid-template-columns:1fr; }
    .pitfall-card .fix{ padding-left:0; margin-top:4px; }
    .ba-card{ grid-template-columns:1fr; }
    .ba-arrow{ display:none; }
    .match-wrap{ grid-template-columns:1fr; }
  }

  .course-nav{ max-width:640px; margin:30px auto 0; padding-top:26px; border-top:1px solid rgba(255,255,255,.15); display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }
  .course-nav .side-link{ font-size:13px; font-weight:700; color:var(--purple-100); display:inline-flex; align-items:center; gap:6px; }
  .course-nav .side-link:hover{ color:var(--white); }
  .course-nav .home-link{ font-size:12.5px; font-weight:600; color:var(--purple-100); opacity:.75; display:inline-flex; align-items:center; gap:6px; }
  .course-nav .home-link:hover{ opacity:1; color:var(--white); }
  .course-nav .next-link{ background:var(--white); color:var(--purple-900); padding:11px 20px; border-radius:999px; font-weight:700; font-size:13.5px; }
  .course-nav .next-link:hover{ background:var(--purple-100); }
  @media (max-width:560px){ .course-nav{ justify-content:center; text-align:center; } }


  /* ===== DAY 5 CONTENT STYLES ===== */
/* HERO */
  .lesson-hero{ position:relative; overflow:hidden; background:var(--purple-900); padding:64px 24px 88px; color:var(--white); }
  .hero-grid{ position:absolute; inset:0; display:grid; grid-template-columns:repeat(12,1fr); grid-template-rows:repeat(6,1fr); opacity:.5; pointer-events:none; }
  .hero-grid div{ background:var(--purple-600); }
  .lesson-hero-inner{ position:relative; max-width:720px; margin:0 auto; text-align:center; }
  .eyebrow{ display:inline-flex; align-items:center; gap:8px; font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--purple-100); background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.18); padding:6px 14px; border-radius:999px; margin-bottom:22px; }
  h1.hero-title{ font-size:clamp(34px,5.5vw,52px); line-height:1.06; margin:0 0 16px; font-weight:800; letter-spacing:-0.02em; }
  .hero-sub{ font-size:17px; color:var(--purple-100); margin:0 auto 30px; max-width:540px; }
  /* SECTIONS */
  .section{ padding:60px 24px; }
  .section-head{ max-width:660px; margin:0 auto 36px; text-align:center; }
  .section-eyebrow{ font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--purple-600); margin-bottom:10px; }
  .section-head h2{ font-size:28px; margin:0 0 12px; letter-spacing:-0.01em; }
  .section-head p{ color:var(--ink-soft); font-size:15.5px; margin:0; }

  .stat-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; max-width:920px; margin:0 auto; }
  .stat-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:20px 18px; }
  .stat-card .label{ font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--purple-600); margin-bottom:8px; }
  .stat-card .value{ font-size:15px; font-weight:700; margin-bottom:4px; }
  .stat-card .desc{ font-size:13px; color:var(--ink-soft); }

  .callout{ max-width:700px; margin:20px auto 0; background:var(--purple-050); border:1px dashed var(--purple-600); border-radius:12px; padding:16px 20px; font-size:14px; color:var(--purple-900); display:flex; gap:10px; align-items:flex-start; }
  .callout b{ font-weight:700; }
  .callout.muted{ background:var(--bg); border:1px solid var(--line); color:var(--ink-soft); }

  /* PROMPT ANATOMY (generic flow diagram, not app UI) */
  .anatomy-flow{ display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:10px; max-width:860px; margin:0 auto 26px; }
  .anatomy-piece{ background:var(--white); border:1.5px solid var(--purple-600); border-radius:12px; padding:12px 16px; text-align:center; min-width:110px; }
  .anatomy-piece .big{ font-family:var(--mono); font-weight:700; color:var(--purple-700); font-size:12.5px; }
  .anatomy-piece .small{ font-size:10.5px; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.05em; margin-top:4px; }
  .anatomy-plus{ font-size:18px; color:var(--ink-faint); font-weight:300; }
  .anatomy-result{ max-width:660px; margin:0 auto; text-align:center; background:var(--purple-900); color:var(--white); border-radius:14px; padding:20px 26px; font-family:var(--mono); font-size:14.5px; font-weight:600; }
  .anatomy-result span{ color:var(--purple-100); font-size:11px; display:block; margin-bottom:8px; font-family:var(--sans); text-transform:uppercase; letter-spacing:.06em; font-weight:700; }

  /* BEFORE/AFTER */
  .ba-grid{ display:flex; flex-direction:column; gap:16px; max-width:760px; margin:0 auto; }
  .ba-card{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:14px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:20px; }
  .ba-side{ padding:2px 4px; }
  .ba-label{ font-size:10.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; margin-bottom:6px; }
  .ba-before .ba-label{ color:var(--red); }
  .ba-after .ba-label{ color:var(--green); }
  .ba-text{ font-family:var(--mono); font-size:13px; line-height:1.5; }
  .ba-before .ba-text{ color:var(--ink-soft); }
  .ba-after .ba-text{ color:var(--ink); font-weight:600; }
  .ba-arrow{ color:var(--ink-faint); font-size:18px; }
  .ba-why{ grid-column:1 / -1; font-size:12px; color:var(--ink-faint); border-top:1px dashed var(--line); padding-top:10px; margin-top:2px; }

  /* FILL-IN-THE-BLANK EXERCISE (worksheet style) */
  .worksheet{ max-width:720px; margin:0 auto; background:var(--white); border:1px solid var(--line); border-radius:20px; padding:28px 30px; }
  .worksheet-label{ font-size:11.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--purple-600); margin-bottom:14px; }
  .fillblank-sentence{ font-family:var(--mono); font-size:15.5px; line-height:2.1; color:var(--ink); margin-bottom:22px; }
  .blank{ display:inline-block; min-width:110px; padding:3px 10px; border-bottom:2.5px solid var(--purple-600); text-align:center; font-weight:700; color:var(--purple-700); background:var(--purple-050); border-radius:6px 6px 0 0; margin:0 2px; }
  .blank.empty{ color:var(--ink-faint); font-weight:400; background:transparent; }
  .wordbank-label{ font-size:11px; font-weight:700; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.05em; margin-bottom:10px; }
  .wordbank{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:20px; }
  .word-chip{ border:1.5px solid var(--purple-600); background:var(--white); color:var(--purple-700); font-size:13px; font-weight:600; padding:9px 15px; border-radius:999px; }
  .word-chip:hover{ background:var(--purple-050); }
  .word-chip:disabled{ opacity:.35; cursor:default; border-color:var(--line); color:var(--ink-faint); }
  .check-btn{ background:var(--purple-600); color:var(--white); border:none; border-radius:999px; padding:12px 24px; font-weight:700; font-size:14px; }
  .check-btn:hover{ background:var(--purple-700); }
  .check-btn:disabled{ background:var(--line); color:var(--ink-faint); cursor:default; }
  .worksheet-feedback{ margin-top:16px; padding:14px 16px; border-radius:10px; font-size:13.5px; display:none; }
  .worksheet-feedback.show{ display:block; }
  .worksheet-feedback.good{ background:var(--green-bg); color:#0f5a2b; }
  .worksheet-feedback.retry{ background:var(--amber-bg); color:#7a3a06; }

  /* EXERCISE CARD (replaces app-mockup sandboxes) */
  .exercise-card{ max-width:760px; margin:0 auto 28px; background:var(--white); border:1px solid var(--line); border-radius:20px; padding:26px 28px; }
  .exercise-card:last-child{ margin-bottom:0; }
  .exercise-head{ display:flex; align-items:center; gap:10px; margin-bottom:16px; }
  .exercise-icon{ width:32px; height:32px; border-radius:9px; background:var(--purple-050); color:var(--purple-700); display:flex; align-items:center; justify-content:center; font-size:15px; flex:none; }
  .exercise-title{ font-weight:700; font-size:15px; }
  .scenario-quote{ border-left:3px solid var(--purple-600); background:var(--purple-050); padding:12px 18px; border-radius:0 10px 10px 0; font-size:14px; color:var(--ink); line-height:1.6; margin-bottom:18px; }
  .reveal-btn{ background:none; border:1.5px solid var(--purple-600); color:var(--purple-700); border-radius:999px; padding:10px 20px; font-weight:700; font-size:13.5px; }
  .reveal-btn:hover{ background:var(--purple-050); }
  .insight-box{ margin-top:18px; border-radius:14px; background:var(--purple-050); padding:18px 20px; display:none; }
  .insight-box.show{ display:block; animation:fadein .3s ease; }
  @keyframes fadein{ from{opacity:0; transform:translateY(4px);} to{opacity:1; transform:translateY(0);} }
  .insight-label{ font-size:10.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--purple-700); margin-bottom:10px; }
  .insight-box p{ font-size:13.8px; line-height:1.6; margin:0 0 10px; color:var(--ink); }
  .insight-box p:last-child{ margin-bottom:0; }
  .insight-caveat{ font-size:12.5px; color:var(--ink-faint); margin-top:10px; padding-top:10px; border-top:1px dashed var(--line); }

  /* PITFALLS */
  .pitfall-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; max-width:820px; margin:0 auto; }
  .pitfall-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:20px; }
  .pitfall-head{ display:flex; align-items:center; gap:10px; margin-bottom:10px; }
  .pitfall-icon{ width:28px; height:28px; border-radius:8px; background:var(--red-bg); color:var(--red); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:13px; flex:none; }
  .pitfall-card h3{ font-size:14px; margin:0; }
  .pitfall-card .fix{ font-size:13px; color:var(--ink-soft); margin:0; padding-left:38px; }
  .pitfall-card .fix b{ color:var(--green); }

  /* QUIZ */
  .quiz-card{ max-width:100%; margin:0 auto 20px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:24px; }
  .quiz-q{ font-weight:700; font-size:14.5px; margin:0 0 14px; }
  .quiz-options{ display:flex; flex-direction:column; gap:8px; }
  .quiz-option{ display:block; width:100%; text-align:left; border:1.5px solid var(--line); background:var(--white); border-radius:10px; padding:11px 15px; font-size:13.5px; color:var(--ink); }
  .quiz-option:hover{ border-color:var(--purple-600); }
  .quiz-option.correct{ border-color:var(--green); background:var(--green-bg); font-weight:700; }
  .quiz-option.incorrect{ border-color:var(--red); background:var(--red-bg); }
  .quiz-option:disabled{ cursor:default; }
  .quiz-feedback{ font-size:12.8px; margin-top:12px; padding-top:12px; border-top:1px dashed var(--line); color:var(--ink-soft); display:none; }
  .quiz-feedback.show{ display:block; }
  .quiz-score{ max-width:100%; margin:0 auto; text-align:center; font-size:14px; color:var(--ink-soft); background:var(--purple-050); border-radius:12px; padding:16px; font-weight:600; }

  /* DAILY GOAL */
  .goal-section{ padding:50px 24px; background:var(--purple-050); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .goal-box{ max-width:640px; margin:0 auto; background:var(--white); border:2px solid var(--purple-600); border-radius:20px; padding:28px 30px; text-align:center; box-shadow:0 20px 50px -25px rgba(36,26,87,.25); }
  .goal-icon{ font-size:28px; margin-bottom:10px; }
  .goal-box h2{ font-size:20px; margin:0 0 10px; }
  .goal-box p{ font-size:14.5px; color:var(--ink-soft); margin:0 0 20px; }
  .goal-btn{ background:var(--purple-600); color:var(--white); border:none; border-radius:999px; padding:12px 24px; font-weight:700; font-size:14px; display:inline-flex; align-items:center; gap:8px; }
  .goal-btn:hover{ background:var(--purple-700); }
  .goal-btn.done{ background:var(--green); }

  /* FOOTER */
  .footer-section{ background:var(--purple-900); color:var(--white); padding:56px 24px 60px; }
  .footer-inner{ max-width:680px; margin:0 auto; text-align:center; }
  .footer-inner h2{ font-size:24px; margin:0 0 10px; }
  .footer-inner p{ color:var(--purple-100); font-size:14.5px; margin:0 0 26px; }
  .next-teaser{ margin-top:34px; border-top:1px solid rgba(255,255,255,.15); padding-top:26px; font-size:13.5px; color:var(--purple-100); }
  .next-teaser b{ color:var(--white); }

  /* MATCH EXERCISE */
  .match-wrap{ display:grid; grid-template-columns:1fr 1fr; gap:24px; max-width:720px; margin:0 auto; }
  .match-col-label{ font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:10px; text-align:center; }
  .match-item{ width:100%; text-align:left; border:1.5px solid var(--line); background:var(--white); border-radius:12px; padding:13px 16px; font-size:13.5px; margin-bottom:10px; color:var(--ink); }
  .match-item:hover{ border-color:var(--purple-600); }
  .match-item.selected{ border-color:var(--purple-600); background:var(--purple-050); }
  .match-item.matched{ border-color:var(--green); background:var(--green-bg); color:#0f5a2b; font-weight:600; cursor:default; }
  .match-item.wrong{ border-color:var(--red); background:var(--red-bg); }
  .match-status{ text-align:center; font-size:13px; color:var(--ink-faint); margin-top:6px; }

  /* ITEM LIST (Files / Prompts examples) */
  .item-list{ max-width:760px; margin:0 auto 24px; display:flex; flex-direction:column; gap:10px; }
  .item{ background:var(--white); border:1px solid var(--line); border-radius:12px; padding:14px 18px; display:flex; gap:14px; align-items:flex-start; }
  .item-icon{ width:30px; height:30px; border-radius:8px; background:var(--purple-050); color:var(--purple-700); display:flex; align-items:center; justify-content:center; font-size:14px; flex:none; }
  .item-body{ flex:1; }
  .item-body h3{ font-size:14px; margin:0 0 4px; }
  .item-body p{ font-size:13px; color:var(--ink-soft); margin:0; }
  .source-tag{ font-size:10px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--purple-700); background:var(--purple-100); padding:3px 9px; border-radius:999px; flex:none; white-space:nowrap; }

  /* GOVERNANCE CARDS */
  .gov-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; max-width:960px; margin:0 auto; }
  .gov-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:22px; }
  .gov-icon{ width:34px; height:34px; border-radius:9px; background:var(--purple-050); color:var(--purple-700); display:flex; align-items:center; justify-content:center; font-size:16px; margin-bottom:12px; }
  .gov-card h3{ font-size:14.5px; margin:0 0 8px; }
  .gov-card p{ font-size:13px; color:var(--ink-soft); margin:0 0 12px; }
  .gov-note{ font-size:11.5px; color:var(--purple-700); font-weight:700; background:var(--purple-100); padding:5px 10px; border-radius:8px; display:inline-block; }

  /* PLAIN CHECKLIST (no radio/form graphics) */
  .check-list{ display:flex; flex-direction:column; gap:10px; margin-bottom:20px; }
  .check-item{ display:flex; align-items:flex-start; gap:10px; font-size:13.5px; color:var(--ink); background:var(--purple-050); border-radius:10px; padding:12px 14px; }
  .check-item .ck{ color:var(--green); font-weight:800; flex:none; }

  /* COMPLETION RECAP */
  .recap-grid{ display:flex; flex-direction:column; gap:8px; max-width:560px; margin:0 auto 22px; text-align:left; }
  .recap-row{ display:flex; align-items:center; gap:10px; font-size:13.5px; color:var(--purple-100); }
  .recap-row .rc-dot{ width:20px; height:20px; border-radius:50%; background:var(--green); color:var(--white); font-size:11px; display:flex; align-items:center; justify-content:center; flex:none; font-weight:800; }

  @media (max-width:720px){
    .stat-grid{ grid-template-columns:1fr 1fr; }
    .map-grid{ grid-template-columns:1fr 1fr; }
    .pitfall-grid{ grid-template-columns:1fr; }
    .pitfall-card .fix{ padding-left:0; margin-top:4px; }
    .ba-card{ grid-template-columns:1fr; }
    .ba-arrow{ display:none; }
    .match-wrap{ grid-template-columns:1fr; }
    .gov-grid{ grid-template-columns:1fr; }
  }

  .course-nav{ max-width:640px; margin:30px auto 0; padding-top:26px; border-top:1px solid rgba(255,255,255,.15); display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }
  .course-nav .side-link{ font-size:13px; font-weight:700; color:var(--purple-100); display:inline-flex; align-items:center; gap:6px; }
  .course-nav .side-link:hover{ color:var(--white); }
  .course-nav .home-link{ font-size:12.5px; font-weight:600; color:var(--purple-100); opacity:.75; display:inline-flex; align-items:center; gap:6px; }
  .course-nav .home-link:hover{ opacity:1; color:var(--white); }
  .course-nav .next-link{ background:var(--white); color:var(--purple-900); padding:11px 20px; border-radius:999px; font-weight:700; font-size:13.5px; }
  .course-nav .next-link:hover{ background:var(--purple-100); }
  @media (max-width:560px){ .course-nav{ justify-content:center; text-align:center; } }


  /* ===== VIEW ROUTER (page-like navigation within one file) ===== */
  .view{ display:none; }
  .view.active{ display:block; }
  .footer-inner > .next-teaser:first-child{ margin-top:0; border-top:none; padding-top:0; }
  .complete-row{ display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap; }
  .complete-row button{ background:var(--white); color:var(--purple-900); border:none; border-radius:999px; padding:13px 24px; font-weight:700; font-size:14.5px; display:flex; align-items:center; gap:8px; cursor:pointer; }
  .complete-row button.done{ background:var(--green); color:var(--white); }
  .recap-grid{ text-align:left; max-width:480px; margin:0 auto 22px; display:flex; flex-direction:column; gap:10px; }
  .recap-row{ font-size:14px; color:var(--purple-100); display:flex; align-items:flex-start; gap:10px; }
  .rc-dot{ flex:0 0 auto; width:20px; height:20px; border-radius:50%; background:rgba(255,255,255,.15); color:var(--white); font-size:11px; font-weight:800; display:flex; align-items:center; justify-content:center; font-family:var(--mono); }
  .crash-step{ position:relative; }
  .crash-done-badge{ display:none; align-items:center; gap:6px; font-size:11.5px; font-weight:800; letter-spacing:.03em; text-transform:uppercase; color:var(--green); margin-top:8px; }
  .game-badge{ display:none; align-items:center; gap:6px; font-size:11.5px; font-weight:800; letter-spacing:.02em; margin-top:8px; padding:5px 11px; border-radius:999px; width:fit-content; }
  .game-badge.show{ display:flex; }
  .game-badge.tier-earned{ background:var(--purple-100); color:var(--purple-700); }
  .badge-tally{ display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:700; color:var(--purple-700); background:var(--purple-050); border:1px solid var(--purple-100); border-radius:999px; padding:6px 14px; margin-top:14px; }
  .crash-done-badge.show{ display:flex; }
  .crash-step.day-done .num{ background:var(--green); border-color:var(--green); color:var(--white); }

  /* ---- Mode Duel bonus game modal ---- */
  .bonus-modal{ position:fixed; inset:0; z-index:300; display:none; align-items:center; justify-content:center; padding:20px; }
  .bonus-modal.open{ display:flex; }
  .modeduel-backdrop{ position:absolute; inset:0; background:rgba(14,10,38,.82); backdrop-filter:blur(2px); }
  .modeduel-panel{ position:relative; width:100%; max-width:720px; }
  .modeduel-panel iframe{ width:100%; height:840px; max-height:88vh; border:0; border-radius:20px; box-shadow:0 30px 70px rgba(0,0,0,.5); display:block; background:#0E0A26; }
  .modeduel-close{
    position:absolute; top:-14px; right:-14px; width:36px; height:36px; border-radius:50%;
    background:#fff; color:var(--purple-900); border:none; font-size:15px; font-weight:700; cursor:pointer;
    box-shadow:0 6px 16px rgba(0,0,0,.35); display:flex; align-items:center; justify-content:center;
  }
  .modeduel-close:hover{ background:var(--purple-100); }
  .modeduel-close:focus-visible{ outline:2.5px solid #fff; outline-offset:2px; }
  @media (max-width:640px){ .modeduel-panel iframe{ height:82vh; } .modeduel-close{ top:6px; right:6px; } }

  /* ---------- PRODUCT-STYLE CHAT MOCK (Day 1 examples) ---------- */
  .cp-window{ background:#FCFCFE; border:1px solid var(--line); border-radius:18px; padding:22px 22px 18px; margin-bottom:18px; font-family:var(--sans); }
  .cp-chat{ min-height:230px; }
  .cp-user-row{ display:flex; flex-direction:column; align-items:flex-end; gap:8px; margin-bottom:34px; }
  .cp-user-bubble{ background:#F3F4F7; color:#15151F; border-radius:14px; padding:18px 22px 36px; font-size:15px; line-height:1.45; max-width:86%; }
  .cp-copy{ color:#55556A; display:inline-flex; padding-right:4px; }
  .cp-agent{ display:flex; gap:14px; align-items:flex-start; }
  .cp-avatar{ flex:none; display:inline-flex; width:34px; height:34px; margin-top:-2px; }
  .cp-arc{ transform-origin:24px 24px; animation:cpspin 1.6s linear infinite; }
  @keyframes cpspin{ to{ transform:rotate(360deg); } }
  .cp-agent-body{ min-width:0; }
  .cp-thinking-label{ font-size:19px; font-weight:400; line-height:1.2; padding-top:4px; background:linear-gradient(90deg,#5B3FA8 0%,#1B1B2A 45%,#3A82A8 100%); -webkit-background-clip:text; background-clip:text; color:transparent; display:inline-block; letter-spacing:.005em; }
  .cp-sub{ margin:8px 0 0; font-size:13.5px; color:#6B6B7B; line-height:1.5; }
  .cp-sub u{ text-underline-offset:2px; color:#4B4B5C; }
  .cp-resp{ display:none; }
  .cp-resp.show{ display:flex; animation:fadein .3s ease; }
  .cp-window.is-answered .cp-thinking{ display:none; }
  .cp-answer{ margin:0; font-size:15px; line-height:1.65; color:#15151F; }
  .cp-caveat{ margin:12px 0 0; padding-top:10px; border-top:1px dashed var(--line); font-size:12.5px; color:var(--ink-faint); }
  .cp-composer{ margin-top:26px; background:#fff; border:1px solid #D6D6E0; border-radius:20px; padding:16px 16px 12px; box-shadow:0 1px 2px rgba(20,20,40,.04); }
  .cp-placeholder{ display:flex; align-items:flex-start; min-height:52px; font-size:15px; color:#767687; }
  .cp-caret{ width:1.5px; height:20px; background:#15151F; margin-right:1px; flex:none; animation:cpblink 1.1s steps(1) infinite; }
  @keyframes cpblink{ 50%{ opacity:0; } }
  .cp-composer-row{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
  .cp-left, .cp-right{ display:flex; align-items:center; gap:10px; }
  .cp-plus{ width:34px; height:34px; border-radius:10px; border:1px solid #E7E7EF; background:#fff; box-shadow:0 1px 2px rgba(20,20,40,.05); display:inline-flex; align-items:center; justify-content:center; font-size:24px; font-weight:300; color:#8A8A9A; line-height:1; }
  .cp-divider{ width:1px; height:18px; background:#E1E1EA; margin:0 4px 0 2px; }
  .cp-ico{ display:inline-flex; color:#8A8A9A; padding:0 4px; }
  .cp-status{ display:inline-flex; align-items:center; gap:7px; background:#EDE8FC; color:#4630B5; font-weight:700; font-size:14px; padding:8px 13px; border-radius:9px; white-space:nowrap; }
  .cp-dots{ display:inline-flex; gap:4px; }
  .cp-dots i{ width:5px; height:5px; border-radius:50%; background:#B9A9F0; display:block; animation:cpdot 1.2s ease-in-out infinite; }
  .cp-dots i:nth-child(2){ animation-delay:.2s; }
  .cp-dots i:nth-child(3){ animation-delay:.4s; background:#6D56DD; }
  @keyframes cpdot{ 0%,100%{ opacity:.35; } 50%{ opacity:1; } }
  .cp-mode{ display:inline-flex; align-items:center; gap:6px; background:#F2F2F6; color:#8A8A9A; font-weight:600; font-size:14px; padding:8px 12px; border-radius:9px; }
  .cp-send{ width:36px; height:36px; border-radius:10px; background:#A99FDF; color:#fff; border:1px solid #9488D6; display:inline-flex; align-items:center; justify-content:center; }
  .cp-window.is-answered .cp-status{ display:none; }
  .cp-window.is-answered .cp-ph-text{ opacity:0; }
  @media (max-width:560px){
    .cp-window{ padding:16px 14px 14px; }
    .cp-user-bubble{ max-width:100%; font-size:14px; padding:14px 16px 24px; }
    .cp-mode, .cp-ico-slash{ display:none; }
    .cp-ph-text{ font-size:13.5px; }
  }

  /* Light gap so the bonus-round banner and the day-complete banner don't stack as one solid purple block */
  .lesson-section .footer-section{ margin-top:0; border-top:56px solid var(--purple-050); }

  /* ---------- PRODUCT-STYLE PLAYBOOK FORMS (Day 2: Price a Role, Survey Comparison) ---------- */
  .pf-body{ padding:28px 30px 26px; background:#FCFCFE; }
  .pf-title{ font-size:26px; font-weight:800; color:#14141c; letter-spacing:-.01em; margin:0 0 6px; }
  .pf-desc{ font-size:14.5px; color:#4a4a58; line-height:1.5; margin:0 0 22px; }
  .pf-row{ display:flex; align-items:center; gap:14px; border:1px solid #e6e6ef; border-radius:18px; padding:16px 20px; margin-bottom:12px; background:#fff; }
  .pf-ico{ flex:none; width:24px; height:24px; color:#5b5b6b; display:inline-flex; }
  .pf-text{ flex:1; min-width:0; }
  .pf-label{ font-weight:600; font-size:15px; color:#14141c; }
  .pf-req{ color:#4a3ebb; margin-left:6px; font-weight:700; }
  .pf-hint{ font-size:13px; color:#777788; margin-top:3px; line-height:1.4; }
  .pf-ctl{ flex:0 0 44%; max-width:44%; }
  .pf-box{ border:1px solid #e1e1ea; border-radius:12px; padding:10px 14px; font-size:14px; color:#14141c; min-height:42px; display:flex; align-items:center; justify-content:space-between; gap:10px; box-shadow:0 1px 2px rgba(20,20,40,.06); background:#fff; }
  .pf-box .chev{ color:#555; font-size:12px; }
  .pf-area{ display:block; align-items:flex-start; min-height:96px; line-height:1.5; color:#80808f; font-size:13.5px; padding:12px 14px; }
  .pf-checks{ display:flex; flex-direction:column; gap:8px; }
  .pf-check{ display:flex; align-items:center; gap:10px; font-size:14px; color:#14141c; }
  .pf-check i{ width:20px; height:20px; border:1.5px solid #c9c9d6; border-radius:6px; flex:none; display:inline-flex; align-items:center; justify-content:center; font-style:normal; font-size:12px; color:#fff; background:#fff; }
  .pf-check.on i{ background:#4a3ebb; border-color:#4a3ebb; }
  .mock-run-btn.pf-run{ background:#4a3ebb; border-radius:12px; font-size:15px; margin-top:18px; box-shadow:0 4px 12px -4px rgba(74,62,187,.55); }
  .mock-run-btn.pf-run:hover{ background:#3f34a6; }
  .pf-try{ text-align:center; font-size:12.5px; color:var(--ink-faint); margin:12px 0 0; }
  .mock-sample-banner{ display:flex; gap:12px; align-items:flex-start; background:var(--amber-bg); border:1px solid #F0D9B0; color:#7A3E08; border-radius:12px; padding:13px 16px; font-size:13.5px; line-height:1.55; margin-bottom:20px; }
  .mock-sample-banner b{ font-weight:800; }
  .msb-icon{ flex:none; font-size:16px; line-height:1.4; }
  .mock-table td.mock-delta.neg{ color:var(--red); background:#FDECEC; }
  @media (max-width:600px){ .pf-row{ flex-wrap:wrap; } .pf-ctl{ flex:1 1 100%; max-width:100%; } .pf-body{ padding:22px 16px; } }

  /* ---------- DAY BADGE (earned by finishing every required activity in a day) ---------- */
  .day-badge{ max-width:100%; margin:24px auto 0; background:var(--white); border:1px solid var(--line); border-radius:20px; padding:24px 26px; display:flex; gap:24px; align-items:center; }
  .day-badge.earned{ border-color:var(--purple-600); box-shadow:0 14px 36px -22px rgba(108,86,232,.55); background:linear-gradient(180deg,#fff 0%,var(--purple-050) 100%); }
  .db-medal{ flex:none; width:84px; height:96px; }
  .day-badge.just-earned .db-medal{ animation:dbpop .5s ease; }
  @keyframes dbpop{ 0%{ transform:scale(.6); opacity:0; } 70%{ transform:scale(1.08); } 100%{ transform:scale(1); opacity:1; } }
  .db-main{ flex:1; min-width:0; }
  .db-title{ font-size:18px; font-weight:800; color:var(--ink); margin:0 0 4px; }
  .db-sub{ font-size:13.5px; color:var(--ink-soft); margin:0 0 14px; line-height:1.5; }
  .day-badge.earned .db-sub{ margin-bottom:0; }
  .db-steps{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
  .db-step{ width:100%; display:flex; align-items:center; gap:10px; text-align:left; background:var(--bg); border:1px solid var(--line); border-radius:10px; padding:9px 12px; font-size:13.5px; color:var(--ink); }
  .db-step:hover{ border-color:var(--purple-600); }
  .db-check{ flex:none; width:20px; height:20px; border-radius:50%; border:1.5px solid #C9C3E6; display:inline-flex; align-items:center; justify-content:center; font-size:12px; color:#fff; background:#fff; }
  .db-step.done .db-check{ background:var(--green); border-color:var(--green); }
  .db-step.done{ background:var(--green-bg); border-color:#BFE3CB; }
  .db-label{ flex:1; }
  .db-count{ flex:none; font-size:12.5px; font-weight:700; color:var(--ink-faint); font-variant-numeric:tabular-nums; }
  .db-step.done .db-count{ color:var(--green); }
  .db-reset{ background:none; border:none; padding:0; margin-top:10px; font-size:12px; color:var(--ink-faint); text-decoration:underline; }
  .day-jump-prog{ margin-left:auto; flex:none; display:flex; align-items:center; gap:10px; font-size:12.5px; font-weight:700; color:var(--ink-soft); padding:0 4px 0 18px; white-space:nowrap; }
  .djp-bar{ width:80px; height:6px; border-radius:3px; background:#E5E0F5; overflow:hidden; }
  .djp-bar i{ display:block; height:100%; background:var(--purple-600); border-radius:3px; transition:width .25s ease; }
  .day-jump-prog.earned{ color:var(--purple-700); }
  @media (max-width:600px){ .day-badge{ flex-direction:column; text-align:center; padding:22px 16px; } .db-step{ text-align:left; } .day-jump-prog .djp-bar{ display:none; } }


:root{--purple-600:#6C56E8;
    --purple-700:#5642C4;
    --purple-900:#241A57;
    --purple-100:#EDE9FE;
    --purple-050:#F7F5FF;
    --bg:#FAFAFC;
    --ink:#1B1730;
    --ink-soft:#5B5570;
    --ink-faint:#8B84A3;
    --line:#E3DFF5;
    --green:#15803D;
    --green-bg:#EAF7EE;
    --red:#B91C1C;
    --amber:#B45309;
    --amber-bg:#FDF3E4;
    --white:#fff;
    --radius:16px;
    --mono:'JetBrains Mono','SFMono-Regular',Consolas,monospace;
    --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;}
@media (prefers-reduced-motion: reduce){*{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important;}}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0; background:var(--bg); color:var(--ink); font-family:var(--sans); line-height:1.5; -webkit-font-smoothing:antialiased;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
button{font-family:inherit; cursor:pointer;}
button:focus-visible,a:focus-visible{outline:2.5px solid var(--purple-600) !important;outline-offset:2px !important}
@media (max-width:920px){nav.primary-nav, .search-btn{display:none !important}}
.day-jump-inner::-webkit-scrollbar{display:none !important}
.day-jump a.active{color:var(--purple-700) !important;border-bottom-color:var(--purple-600) !important}
.hero::before{content:"" !important;position:absolute !important;inset:0 !important;background-image:url('../assets/52c3e0934c09d8a0.png') !important;background-repeat:repeat !important;background-size:96px 96px !important;opacity:.05 !important;pointer-events:none !important}
@media (max-width:640px){.masthead{flex-wrap:wrap !important}}
@media (max-width:640px){.masthead img{height:44px !important}}
.btn-ghost{background:transparent !important;color:var(--white) !important;border:1.5px solid rgba(255,255,255,.35) !important}
.btn-ghost:hover{border-color:var(--white) !important}
.paths{padding:56px 24px 8px !important}
.paths-head{display:flex !important;align-items:baseline !important;justify-content:space-between !important;gap:20px !important;margin-bottom:28px !important;flex-wrap:wrap !important}
.paths-head h2{font-size:24px !important;margin:0 !important;letter-spacing:-0.01em !important}
.paths-head p{margin:6px 0 0 !important;color:var(--ink-soft) !important;font-size:14.5px !important;max-width:520px !important}
.path-grid{display:grid !important;grid-template-columns:repeat(3,1fr) !important;gap:16px !important}
.path-card{background:var(--white) !important;border:1px solid var(--line) !important;border-radius:var(--radius) !important;padding:22px !important;display:flex !important;flex-direction:column !important;gap:10px !important;transition:border-color .15s ease !important}
.path-card:hover{border-color:var(--purple-600) !important}
.path-icon{width:36px !important;height:36px !important;border-radius:10px !important;background:var(--purple-050) !important;color:var(--purple-700) !important;display:flex !important;align-items:center !important;justify-content:center !important;font-size:16px !important;flex:none !important}
.path-card h3{font-size:16.5px !important;margin:2px 0 0 !important}
.path-card p{font-size:13.5px !important;color:var(--ink-soft) !important;margin:0 !important;flex:1 !important}
.path-card .go{font-size:13px !important;font-weight:700 !important;color:var(--purple-700) !important}
@media (max-width:820px){.path-grid{grid-template-columns:repeat(2,1fr) !important}}
@media (max-width:560px){.path-grid{grid-template-columns:1fr !important}}
@media (max-width:760px){.story-list{grid-template-columns:1fr !important;column-gap:0 !important}}
@media (max-width:760px){.story-item:nth-child(2){border-top:1px solid var(--line) !important}}
@media (max-width:760px){.story-quote{font-size:17.5px !important}}
.crash-card::before{content:"" !important;position:absolute !important;inset:0 !important;background-image:url('../assets/52c3e0934c09d8a0.png') !important;background-repeat:repeat !important;background-size:80px 80px !important;opacity:.05 !important;pointer-events:none !important}
.crash-path::before{content:"" !important;position:absolute !important;top:19px !important;left:10% !important;right:10% !important;height:1px !important;background:rgba(255,255,255,.2) !important}
@media (max-width:900px){.crash-path{grid-template-columns:repeat(2,1fr) !important;gap:24px !important}}
@media (max-width:900px){.crash-path::before{display:none !important}}
@media (max-width:560px){.crash-path{grid-template-columns:1fr !important}}
.comp-training{padding:56px 24px !important}
.comp-training-head{margin-bottom:32px !important;max-width:640px !important}
.comp-training-eyebrow{font-size:12px !important;font-weight:700 !important;letter-spacing:.08em !important;text-transform:uppercase !important;color:var(--purple-600) !important;margin-bottom:8px !important;display:block !important}
.comp-training-head h2{font-size:26px !important;margin:0 0 10px !important;letter-spacing:-0.01em !important}
.comp-training-head p{font-size:14.5px !important;color:var(--ink-soft) !important;margin:0 !important}
.comp-training-grid{display:grid !important;grid-template-columns:repeat(3,1fr) !important;gap:18px !important}
.comp-card{background:var(--white) !important;border:1px solid var(--line) !important;border-radius:20px !important;padding:26px 24px 24px !important;display:flex !important;flex-direction:column !important;gap:14px !important;transition:border-color .15s ease, box-shadow .15s ease !important}
.comp-card:hover{border-color:var(--purple-600) !important;box-shadow:0 12px 24px rgba(36,26,87,.08) !important}
.comp-level{display:inline-flex !important;align-items:center !important;justify-content:center !important;width:56px !important;height:56px !important;border-radius:14px !important;font-family:var(--mono) !important;font-size:16px !important;font-weight:800 !important;flex:none !important}
.comp-card.level-101 .comp-level{background:var(--purple-050) !important;color:var(--purple-700) !important}
.comp-card.level-201 .comp-level{background:var(--purple-100) !important;color:var(--purple-700) !important}
.comp-card.level-301 .comp-level{background:var(--purple-900) !important;color:var(--white) !important}
.comp-card h3{font-size:17.5px !important;margin:0 !important;letter-spacing:-0.01em !important}
.comp-card .comp-audience{font-size:12px !important;color:var(--ink-faint) !important;margin:-8px 0 0 !important}
.comp-card p.comp-desc{font-size:13.5px !important;color:var(--ink-soft) !important;margin:0 !important;line-height:1.55 !important}
.comp-topics{list-style:none !important;margin:0 !important;padding:0 !important;display:flex !important;flex-direction:column !important;gap:7px !important}
.comp-topics li{font-size:13px !important;color:var(--ink) !important;padding-left:18px !important;position:relative !important}
.comp-topics li::before{content:"✓" !important;position:absolute !important;left:0 !important;color:var(--purple-600) !important;font-weight:700 !important;font-size:11.5px !important;top:2px !important}
.comp-card-foot{display:flex !important;align-items:center !important;justify-content:space-between !important;gap:10px !important;margin-top:auto !important;padding-top:16px !important;border-top:1px solid var(--line) !important}
.comp-card-foot .format{font-size:11.5px !important;color:var(--ink-faint) !important;font-family:var(--mono) !important}
.comp-card-foot a{font-size:13px !important;font-weight:700 !important;color:var(--purple-700) !important}
@media (max-width:900px){.comp-training-grid{grid-template-columns:1fr !important}}
.hub{padding:56px 24px !important}
.hub-head{display:flex !important;align-items:flex-end !important;justify-content:space-between !important;gap:20px !important;margin-bottom:32px !important;flex-wrap:wrap !important}
.hub-eyebrow{font-size:12px !important;font-weight:700 !important;letter-spacing:.08em !important;text-transform:uppercase !important;color:var(--purple-600) !important;margin-bottom:8px !important;display:block !important}
.hub-head h2{font-size:26px !important;margin:0 0 8px !important;letter-spacing:-0.01em !important}
.hub-head p{font-size:14.5px !important;color:var(--ink-soft) !important;margin:0 !important;max-width:480px !important}
.hub-head > a{font-size:13.5px !important;font-weight:700 !important;color:var(--purple-700) !important;white-space:nowrap !important}
.hub-grid{display:grid !important;grid-template-columns:1.3fr 1fr !important;gap:24px !important;align-items:stretch !important}
.hub-feature{background:var(--white) !important;border:1px solid var(--line) !important;border-radius:22px !important;overflow:hidden !important;display:flex !important;flex-direction:column !important}
.hub-feature-media{background:linear-gradient(135deg,var(--purple-700),var(--purple-900)) !important;position:relative !important;min-height:200px !important;padding:24px !important;display:flex !important;align-items:flex-end !important;flex:none !important;overflow:hidden !important}
.hub-feature-media::before{content:"" !important;position:absolute !important;inset:0 !important;background-image:radial-gradient(rgba(255,255,255,.16) 1.5px, transparent 1.5px) !important;background-size:20px 20px !important;opacity:.5 !important}
.hub-feature-tag{position:relative !important;font-size:11.5px !important;font-weight:800 !important;letter-spacing:.05em !important;text-transform:uppercase !important;color:var(--purple-900) !important;background:var(--white) !important;padding:6px 12px !important;border-radius:999px !important}
.hub-feature-body{padding:26px 28px 28px !important;display:flex !important;flex-direction:column !important;gap:12px !important;flex:1 !important}
.hub-feature-meta{font-size:12.5px !important;color:var(--ink-faint) !important;font-family:var(--mono) !important}
.hub-feature-body h3{font-size:22px !important;margin:0 !important;line-height:1.25 !important;letter-spacing:-0.01em !important}
.hub-feature-body p{font-size:14px !important;color:var(--ink-soft) !important;margin:0 !important}
.hub-feature-body .go{font-size:13.5px !important;font-weight:700 !important;color:var(--purple-700) !important;margin-top:auto !important}
.hub-list{background:var(--white) !important;border:1px solid var(--line) !important;border-radius:22px !important;padding:6px 24px !important;display:flex !important;flex-direction:column !important}
.hub-item{display:flex !important;gap:14px !important;padding:18px 0 !important;border-bottom:1px solid var(--line) !important}
.hub-item:last-child{border-bottom:none !important}
.hub-item-icon{width:34px !important;height:34px !important;border-radius:10px !important;display:flex !important;align-items:center !important;justify-content:center !important;font-size:15px !important;flex:none !important}
.hub-item-icon.tutorial{background:var(--purple-050) !important;color:var(--purple-700) !important}
.hub-item-icon.story{background:var(--green-bg) !important;color:var(--green) !important}
.hub-item-icon.brief{background:var(--amber-bg) !important;color:var(--amber) !important}
.hub-item-body{flex:1 !important;min-width:0 !important}
.hub-item-tag{font-size:10.5px !important;font-weight:800 !important;letter-spacing:.05em !important;text-transform:uppercase !important;margin-bottom:4px !important;display:block !important}
.hub-item-tag.tutorial{color:var(--purple-700) !important}
.hub-item-tag.story{color:var(--green) !important}
.hub-item-tag.brief{color:var(--amber) !important}
.hub-item h4{font-size:14.5px !important;margin:0 0 4px !important;line-height:1.35 !important;font-weight:700 !important}
.hub-item .meta{font-size:11.5px !important;color:var(--ink-faint) !important;font-family:var(--mono) !important}
@media (max-width:900px){.hub-grid{grid-template-columns:1fr !important}}
.voices{background:var(--purple-050) !important;padding:60px 0 !important;position:relative !important;overflow:hidden !important}
.voices::before{content:"" !important;position:absolute !important;inset:0 !important;background-image:radial-gradient(var(--purple-100) 1.5px, transparent 1.5px) !important;background-size:24px 24px !important;opacity:.6 !important;pointer-events:none !important}
.voices .wrap{position:relative !important}
.voices-head{display:flex !important;align-items:flex-end !important;justify-content:space-between !important;gap:20px !important;margin-bottom:28px !important;padding:0 24px !important;flex-wrap:wrap !important}
.voices-eyebrow{font-size:12px !important;font-weight:700 !important;letter-spacing:.08em !important;text-transform:uppercase !important;color:var(--purple-600) !important;margin-bottom:8px !important;display:block !important}
.voices-head h2{font-size:26px !important;margin:0 0 8px !important;letter-spacing:-0.01em !important}
.voices-head p{font-size:14.5px !important;color:var(--ink-soft) !important;margin:0 !important;max-width:460px !important}
.voices-head > a{font-size:13.5px !important;font-weight:700 !important;color:var(--purple-700) !important;white-space:nowrap !important}
.voice-row{display:flex !important;gap:18px !important;overflow-x:auto !important;padding:6px 24px 10px !important;scroll-snap-type:x proximity !important;position:relative !important}
.voice-card{scroll-snap-align:start !important;flex:none !important;width:320px !important;background:var(--white) !important;border:1px solid var(--line) !important;border-radius:18px !important;padding:26px 24px 24px !important;display:flex !important;flex-direction:column !important;gap:18px !important;position:relative !important;box-shadow:0 1px 2px rgba(36,26,87,.04) !important;transition:box-shadow .15s ease, transform .15s ease !important}
.voice-card:hover{box-shadow:0 12px 24px rgba(36,26,87,.1) !important;transform:translateY(-2px) !important}
.voice-mark{font-family:Georgia,serif !important;font-size:52px !important;line-height:1 !important;color:var(--purple-100) !important;font-weight:700 !important;height:28px !important}
.voice-quote{font-size:15px !important;color:var(--ink) !important;line-height:1.6 !important;margin:0 !important}
.voice-who{display:flex !important;align-items:center !important;gap:12px !important;margin-top:auto !important;padding-top:16px !important;border-top:1px solid var(--line) !important}
.avatar{width:38px !important;height:38px !important;border-radius:50% !important;background:linear-gradient(135deg,var(--purple-600),var(--purple-900)) !important;color:var(--white) !important;display:flex !important;align-items:center !important;justify-content:center !important;font-weight:700 !important;font-size:14px !important;flex:none !important}
.voice-who .name{font-size:13.5px !important;font-weight:700 !important}
.voice-who .role{font-size:12px !important;color:var(--ink-faint) !important}
.community{padding:56px 24px !important}
.community-card{background:var(--white) !important;border:1px solid var(--line) !important;border-radius:22px !important;padding:34px !important;display:grid !important;grid-template-columns:1fr auto !important;align-items:center !important;gap:24px !important}
.community-eyebrow{font-size:12px !important;font-weight:800 !important;letter-spacing:.06em !important;text-transform:uppercase !important;color:var(--purple-600) !important;margin-bottom:8px !important}
.community-card h3{font-size:20px !important;margin:0 0 6px !important}
.community-card p{font-size:14px !important;color:var(--ink-soft) !important;margin:0 !important}
.community-card .date{font-family:var(--mono) !important;font-size:12.5px !important;color:var(--ink-faint) !important;margin-top:8px !important}
.btn-outline{background:transparent !important;border:1.5px solid var(--purple-600) !important;color:var(--purple-700) !important}
.btn-outline:hover{background:var(--purple-050) !important}
@media (max-width:640px){.community-card{grid-template-columns:1fr !important}}
footer{background:var(--ink); color:var(--purple-100); padding:52px 24px 28px;}
@media (max-width:820px){.footer-grid{grid-template-columns:1fr 1fr !important}}
.hero-grid div{background:var(--purple-600) !important}
.anatomy-result{max-width:660px !important;margin:0 auto !important;text-align:center !important;background:var(--purple-900) !important;color:var(--white) !important;border-radius:14px !important;padding:20px 26px !important;font-family:var(--mono) !important;font-size:14.5px !important;font-weight:600 !important}
.anatomy-result span{color:var(--purple-100) !important;font-size:11px !important;display:block !important;margin-bottom:8px !important;font-family:var(--sans) !important;text-transform:uppercase !important;letter-spacing:.06em !important;font-weight:700 !important}
.worksheet{max-width:720px !important;margin:0 auto !important;background:var(--white) !important;border:1px solid var(--line) !important;border-radius:20px !important;padding:28px 30px !important}
.worksheet-label{font-size:11.5px !important;font-weight:800 !important;letter-spacing:.06em !important;text-transform:uppercase !important;color:var(--purple-600) !important;margin-bottom:14px !important}
.fillblank-sentence{font-family:var(--mono) !important;font-size:15.5px !important;line-height:2.1 !important;color:var(--ink) !important;margin-bottom:22px !important}
.blank{display:inline-block !important;min-width:110px !important;padding:3px 10px !important;border-bottom:2.5px solid var(--purple-600) !important;text-align:center !important;font-weight:700 !important;color:var(--purple-700) !important;background:var(--purple-050) !important;border-radius:6px 6px 0 0 !important;margin:0 2px !important}
.blank.empty{color:var(--ink-faint) !important;font-weight:400 !important;background:transparent !important}
.wordbank-label{font-size:11px !important;font-weight:700 !important;color:var(--ink-faint) !important;text-transform:uppercase !important;letter-spacing:.05em !important;margin-bottom:10px !important}
.wordbank{display:flex !important;flex-wrap:wrap !important;gap:8px !important;margin-bottom:20px !important}
.word-chip{border:1.5px solid var(--purple-600) !important;background:var(--white) !important;color:var(--purple-700) !important;font-size:13px !important;font-weight:600 !important;padding:9px 15px !important;border-radius:999px !important}
.word-chip:hover{background:var(--purple-050) !important}
.word-chip:disabled{opacity:.35 !important;cursor:default !important;border-color:var(--line) !important;color:var(--ink-faint) !important}
.check-btn{background:var(--purple-600) !important;color:var(--white) !important;border:none !important;border-radius:999px !important;padding:12px 24px !important;font-weight:700 !important;font-size:14px !important}
.check-btn:hover{background:var(--purple-700) !important}
.check-btn:disabled{background:var(--line) !important;color:var(--ink-faint) !important;cursor:default !important}
.worksheet-feedback{margin-top:16px !important;padding:14px 16px !important;border-radius:10px !important;font-size:13.5px !important;display:none !important}
.worksheet-feedback.show{display:block !important}
.worksheet-feedback.good{background:var(--green-bg) !important;color:#0f5a2b !important}
.worksheet-feedback.retry{background:var(--amber-bg) !important;color:#7a3a06 !important}
.insight-box.show{display:block !important;animation:fadein .3s ease !important}
@keyframes fadein{ from{opacity:0; transform:translateY(4px);} to{opacity:1; transform:translateY(0);} }
.insight-box p:last-child{margin-bottom:0 !important}
.pitfall-card .fix b{color:var(--green) !important}
.quiz-option.correct{border-color:var(--green) !important;background:var(--green-bg) !important;font-weight:700 !important}
.quiz-option.incorrect{border-color:var(--red) !important;background:var(--red-bg) !important}
.quiz-option:disabled{cursor:default !important}
.quiz-feedback.show{display:block !important}
.goal-btn.done{background:var(--green) !important}
@media (max-width:720px){.stat-grid{grid-template-columns:1fr 1fr !important}}
@media (max-width:720px){.stat-grid-3{grid-template-columns:1fr 1fr !important}}
@media (max-width:720px){.map-grid{grid-template-columns:1fr 1fr !important}}
@media (max-width:720px){.pitfall-grid{grid-template-columns:1fr !important}}
@media (max-width:720px){.pitfall-card .fix{padding-left:0 !important;margin-top:4px !important}}
@media (max-width:720px){.ba-card{grid-template-columns:1fr !important}}
@media (max-width:720px){.ba-arrow{display:none !important}}
@media (max-width:560px){.course-nav{justify-content:center !important;text-align:center !important}}
.hero-grid div{background:var(--purple-600) !important}
.anatomy-result{max-width:660px !important;margin:0 auto !important;text-align:center !important;background:var(--purple-900) !important;color:var(--white) !important;border-radius:14px !important;padding:20px 26px !important;font-family:var(--mono) !important;font-size:14.5px !important;font-weight:600 !important}
.anatomy-result span{color:var(--purple-100) !important;font-size:11px !important;display:block !important;margin-bottom:8px !important;font-family:var(--sans) !important;text-transform:uppercase !important;letter-spacing:.06em !important;font-weight:700 !important}
.worksheet{max-width:720px !important;margin:0 auto !important;background:var(--white) !important;border:1px solid var(--line) !important;border-radius:20px !important;padding:28px 30px !important}
.worksheet-label{font-size:11.5px !important;font-weight:800 !important;letter-spacing:.06em !important;text-transform:uppercase !important;color:var(--purple-600) !important;margin-bottom:14px !important}
.fillblank-sentence{font-family:var(--mono) !important;font-size:15.5px !important;line-height:2.1 !important;color:var(--ink) !important;margin-bottom:22px !important}
.blank{display:inline-block !important;min-width:110px !important;padding:3px 10px !important;border-bottom:2.5px solid var(--purple-600) !important;text-align:center !important;font-weight:700 !important;color:var(--purple-700) !important;background:var(--purple-050) !important;border-radius:6px 6px 0 0 !important;margin:0 2px !important}
.blank.empty{color:var(--ink-faint) !important;font-weight:400 !important;background:transparent !important}
.wordbank-label{font-size:11px !important;font-weight:700 !important;color:var(--ink-faint) !important;text-transform:uppercase !important;letter-spacing:.05em !important;margin-bottom:10px !important}
.wordbank{display:flex !important;flex-wrap:wrap !important;gap:8px !important;margin-bottom:20px !important}
.word-chip{border:1.5px solid var(--purple-600) !important;background:var(--white) !important;color:var(--purple-700) !important;font-size:13px !important;font-weight:600 !important;padding:9px 15px !important;border-radius:999px !important}
.word-chip:hover{background:var(--purple-050) !important}
.word-chip:disabled{opacity:.35 !important;cursor:default !important;border-color:var(--line) !important;color:var(--ink-faint) !important}
.check-btn{background:var(--purple-600) !important;color:var(--white) !important;border:none !important;border-radius:999px !important;padding:12px 24px !important;font-weight:700 !important;font-size:14px !important}
.check-btn:hover{background:var(--purple-700) !important}
.check-btn:disabled{background:var(--line) !important;color:var(--ink-faint) !important;cursor:default !important}
.worksheet-feedback{margin-top:16px !important;padding:14px 16px !important;border-radius:10px !important;font-size:13.5px !important;display:none !important}
.worksheet-feedback.show{display:block !important}
.worksheet-feedback.good{background:var(--green-bg) !important;color:#0f5a2b !important}
.worksheet-feedback.retry{background:var(--amber-bg) !important;color:#7a3a06 !important}
.insight-box.show{display:block !important;animation:fadein .3s ease !important}
@keyframes fadein{ from{opacity:0; transform:translateY(4px);} to{opacity:1; transform:translateY(0);} }
.insight-box p:last-child{margin-bottom:0 !important}
.pitfall-card .fix b{color:var(--green) !important}
.quiz-option.correct{border-color:var(--green) !important;background:var(--green-bg) !important;font-weight:700 !important}
.quiz-option.incorrect{border-color:var(--red) !important;background:var(--red-bg) !important}
.quiz-option:disabled{cursor:default !important}
.quiz-feedback.show{display:block !important}
.goal-btn.done{background:var(--green) !important}
@media (max-width:720px){.stat-grid{grid-template-columns:1fr 1fr !important}}
@media (max-width:720px){.map-grid{grid-template-columns:1fr 1fr !important}}
@media (max-width:720px){.pitfall-grid{grid-template-columns:1fr !important}}
@media (max-width:720px){.pitfall-card .fix{padding-left:0 !important;margin-top:4px !important}}
@media (max-width:720px){.ba-card{grid-template-columns:1fr !important}}
@media (max-width:720px){.ba-arrow{display:none !important}}
@media (max-width:560px){.course-nav{justify-content:center !important;text-align:center !important}}
.hero-grid div{background:var(--purple-600) !important}
.anatomy-result{max-width:660px !important;margin:0 auto !important;text-align:center !important;background:var(--purple-900) !important;color:var(--white) !important;border-radius:14px !important;padding:20px 26px !important;font-family:var(--mono) !important;font-size:14.5px !important;font-weight:600 !important}
.anatomy-result span{color:var(--purple-100) !important;font-size:11px !important;display:block !important;margin-bottom:8px !important;font-family:var(--sans) !important;text-transform:uppercase !important;letter-spacing:.06em !important;font-weight:700 !important}
.worksheet{max-width:720px !important;margin:0 auto !important;background:var(--white) !important;border:1px solid var(--line) !important;border-radius:20px !important;padding:28px 30px !important}
.worksheet-label{font-size:11.5px !important;font-weight:800 !important;letter-spacing:.06em !important;text-transform:uppercase !important;color:var(--purple-600) !important;margin-bottom:14px !important}
.fillblank-sentence{font-family:var(--mono) !important;font-size:15.5px !important;line-height:2.1 !important;color:var(--ink) !important;margin-bottom:22px !important}
.blank{display:inline-block !important;min-width:110px !important;padding:3px 10px !important;border-bottom:2.5px solid var(--purple-600) !important;text-align:center !important;font-weight:700 !important;color:var(--purple-700) !important;background:var(--purple-050) !important;border-radius:6px 6px 0 0 !important;margin:0 2px !important}
.blank.empty{color:var(--ink-faint) !important;font-weight:400 !important;background:transparent !important}
.wordbank-label{font-size:11px !important;font-weight:700 !important;color:var(--ink-faint) !important;text-transform:uppercase !important;letter-spacing:.05em !important;margin-bottom:10px !important}
.wordbank{display:flex !important;flex-wrap:wrap !important;gap:8px !important;margin-bottom:20px !important}
.word-chip{border:1.5px solid var(--purple-600) !important;background:var(--white) !important;color:var(--purple-700) !important;font-size:13px !important;font-weight:600 !important;padding:9px 15px !important;border-radius:999px !important}
.word-chip:hover{background:var(--purple-050) !important}
.word-chip:disabled{opacity:.35 !important;cursor:default !important;border-color:var(--line) !important;color:var(--ink-faint) !important}
.check-btn{background:var(--purple-600) !important;color:var(--white) !important;border:none !important;border-radius:999px !important;padding:12px 24px !important;font-weight:700 !important;font-size:14px !important}
.check-btn:hover{background:var(--purple-700) !important}
.check-btn:disabled{background:var(--line) !important;color:var(--ink-faint) !important;cursor:default !important}
.worksheet-feedback{margin-top:16px !important;padding:14px 16px !important;border-radius:10px !important;font-size:13.5px !important;display:none !important}
.worksheet-feedback.show{display:block !important}
.worksheet-feedback.good{background:var(--green-bg) !important;color:#0f5a2b !important}
.worksheet-feedback.retry{background:var(--amber-bg) !important;color:#7a3a06 !important}
.insight-box.show{display:block !important;animation:fadein .3s ease !important}
@keyframes fadein{ from{opacity:0; transform:translateY(4px);} to{opacity:1; transform:translateY(0);} }
.insight-box p:last-child{margin-bottom:0 !important}
.pitfall-card .fix b{color:var(--green) !important}
.quiz-option.correct{border-color:var(--green) !important;background:var(--green-bg) !important;font-weight:700 !important}
.quiz-option.incorrect{border-color:var(--red) !important;background:var(--red-bg) !important}
.quiz-option:disabled{cursor:default !important}
.quiz-feedback.show{display:block !important}
.goal-btn.done{background:var(--green) !important}
.match-item.selected{border-color:var(--purple-600) !important;background:var(--purple-050) !important}
.match-item.matched{border-color:var(--green) !important;background:var(--green-bg) !important;color:#0f5a2b !important;font-weight:600 !important;cursor:default !important}
.match-item.wrong{border-color:var(--red) !important;background:var(--red-bg) !important}
@media (max-width:720px){.stat-grid{grid-template-columns:1fr 1fr !important}}
@media (max-width:720px){.pitfall-grid{grid-template-columns:1fr !important}}
@media (max-width:720px){.pitfall-card .fix{padding-left:0 !important;margin-top:4px !important}}
@media (max-width:720px){.ba-card{grid-template-columns:1fr !important}}
@media (max-width:720px){.ba-arrow{display:none !important}}
@media (max-width:720px){.match-wrap{grid-template-columns:1fr !important}}
@media (max-width:560px){.course-nav{justify-content:center !important;text-align:center !important}}
.mock-progress-seg.active{background:var(--purple-600) !important}
.mock-tag-control{border:1px solid #d8ccf7 !important;border-radius:10px !important;padding:9px 14px !important;display:flex !important;align-items:center !important;justify-content:space-between !important;gap:10px !important;font-size:13.5px !important;color:var(--purple-700) !important;font-weight:600 !important;background:#fff !important}
.mock-tag-control .x{color:var(--purple-600) !important;font-weight:700 !important}
.mock-added-label{font-size:12px !important;font-weight:700 !important;color:#111 !important;margin:12px 0 8px !important}
.mock-chip{display:inline-flex !important;align-items:center !important;gap:6px !important;background:var(--purple-050) !important;color:var(--purple-700) !important;font-size:12.5px !important;font-weight:600 !important;padding:6px 12px !important;border-radius:8px !important}
.mock-report.show{display:block !important;animation:fadein .35s ease !important}
.mock-report-icons{display:flex !important;gap:8px !important;color:#999 !important;font-size:13px !important}
.mock-supporting h4{font-size:15px !important;font-weight:800 !important;margin:0 0 10px !important;color:#111 !important}
.mock-supporting ul{margin:0 0 18px !important;padding-left:20px !important;font-size:13.5px !important;color:#333 !important;line-height:1.9 !important}
.mock-supporting li b{font-weight:700 !important}
@media (max-width:640px){.mock-field-top{flex-direction:column !important}}
@media (max-width:640px){.mock-field-control{width:100% !important}}
.hero-grid div{background:var(--purple-600) !important}
.anatomy-result{max-width:660px !important;margin:0 auto !important;text-align:center !important;background:var(--purple-900) !important;color:var(--white) !important;border-radius:14px !important;padding:20px 26px !important;font-family:var(--mono) !important;font-size:14.5px !important;font-weight:600 !important}
.anatomy-result span{color:var(--purple-100) !important;font-size:11px !important;display:block !important;margin-bottom:8px !important;font-family:var(--sans) !important;text-transform:uppercase !important;letter-spacing:.06em !important;font-weight:700 !important}
.worksheet{max-width:720px !important;margin:0 auto !important;background:var(--white) !important;border:1px solid var(--line) !important;border-radius:20px !important;padding:28px 30px !important}
.worksheet-label{font-size:11.5px !important;font-weight:800 !important;letter-spacing:.06em !important;text-transform:uppercase !important;color:var(--purple-600) !important;margin-bottom:14px !important}
.fillblank-sentence{font-family:var(--mono) !important;font-size:15.5px !important;line-height:2.1 !important;color:var(--ink) !important;margin-bottom:22px !important}
.blank{display:inline-block !important;min-width:110px !important;padding:3px 10px !important;border-bottom:2.5px solid var(--purple-600) !important;text-align:center !important;font-weight:700 !important;color:var(--purple-700) !important;background:var(--purple-050) !important;border-radius:6px 6px 0 0 !important;margin:0 2px !important}
.blank.empty{color:var(--ink-faint) !important;font-weight:400 !important;background:transparent !important}
.wordbank-label{font-size:11px !important;font-weight:700 !important;color:var(--ink-faint) !important;text-transform:uppercase !important;letter-spacing:.05em !important;margin-bottom:10px !important}
.wordbank{display:flex !important;flex-wrap:wrap !important;gap:8px !important;margin-bottom:20px !important}
.word-chip{border:1.5px solid var(--purple-600) !important;background:var(--white) !important;color:var(--purple-700) !important;font-size:13px !important;font-weight:600 !important;padding:9px 15px !important;border-radius:999px !important}
.word-chip:hover{background:var(--purple-050) !important}
.word-chip:disabled{opacity:.35 !important;cursor:default !important;border-color:var(--line) !important;color:var(--ink-faint) !important}
.check-btn{background:var(--purple-600) !important;color:var(--white) !important;border:none !important;border-radius:999px !important;padding:12px 24px !important;font-weight:700 !important;font-size:14px !important}
.check-btn:hover{background:var(--purple-700) !important}
.check-btn:disabled{background:var(--line) !important;color:var(--ink-faint) !important;cursor:default !important}
.worksheet-feedback{margin-top:16px !important;padding:14px 16px !important;border-radius:10px !important;font-size:13.5px !important;display:none !important}
.worksheet-feedback.show{display:block !important}
.worksheet-feedback.good{background:var(--green-bg) !important;color:#0f5a2b !important}
.worksheet-feedback.retry{background:var(--amber-bg) !important;color:#7a3a06 !important}
.insight-box.show{display:block !important;animation:fadein .3s ease !important}
@keyframes fadein{ from{opacity:0; transform:translateY(4px);} to{opacity:1; transform:translateY(0);} }
.insight-box p:last-child{margin-bottom:0 !important}
.pitfall-card .fix b{color:var(--green) !important}
.quiz-option.correct{border-color:var(--green) !important;background:var(--green-bg) !important;font-weight:700 !important}
.quiz-option.incorrect{border-color:var(--red) !important;background:var(--red-bg) !important}
.quiz-option:disabled{cursor:default !important}
.quiz-feedback.show{display:block !important}
.goal-btn.done{background:var(--green) !important}
.match-item.selected{border-color:var(--purple-600) !important;background:var(--purple-050) !important}
.match-item.matched{border-color:var(--green) !important;background:var(--green-bg) !important;color:#0f5a2b !important;font-weight:600 !important;cursor:default !important}
.match-item.wrong{border-color:var(--red) !important;background:var(--red-bg) !important}
@media (max-width:720px){.stat-grid{grid-template-columns:1fr 1fr !important}}
@media (max-width:720px){.pitfall-grid{grid-template-columns:1fr !important}}
@media (max-width:720px){.pitfall-card .fix{padding-left:0 !important;margin-top:4px !important}}
@media (max-width:720px){.ba-card{grid-template-columns:1fr !important}}
@media (max-width:720px){.ba-arrow{display:none !important}}
@media (max-width:720px){.match-wrap{grid-template-columns:1fr !important}}
@media (max-width:560px){.course-nav{justify-content:center !important;text-align:center !important}}
.hero-grid div{background:var(--purple-600) !important}
.anatomy-result{max-width:660px !important;margin:0 auto !important;text-align:center !important;background:var(--purple-900) !important;color:var(--white) !important;border-radius:14px !important;padding:20px 26px !important;font-family:var(--mono) !important;font-size:14.5px !important;font-weight:600 !important}
.anatomy-result span{color:var(--purple-100) !important;font-size:11px !important;display:block !important;margin-bottom:8px !important;font-family:var(--sans) !important;text-transform:uppercase !important;letter-spacing:.06em !important;font-weight:700 !important}
.worksheet{max-width:720px !important;margin:0 auto !important;background:var(--white) !important;border:1px solid var(--line) !important;border-radius:20px !important;padding:28px 30px !important}
.worksheet-label{font-size:11.5px !important;font-weight:800 !important;letter-spacing:.06em !important;text-transform:uppercase !important;color:var(--purple-600) !important;margin-bottom:14px !important}
.fillblank-sentence{font-family:var(--mono) !important;font-size:15.5px !important;line-height:2.1 !important;color:var(--ink) !important;margin-bottom:22px !important}
.blank{display:inline-block !important;min-width:110px !important;padding:3px 10px !important;border-bottom:2.5px solid var(--purple-600) !important;text-align:center !important;font-weight:700 !important;color:var(--purple-700) !important;background:var(--purple-050) !important;border-radius:6px 6px 0 0 !important;margin:0 2px !important}
.blank.empty{color:var(--ink-faint) !important;font-weight:400 !important;background:transparent !important}
.wordbank-label{font-size:11px !important;font-weight:700 !important;color:var(--ink-faint) !important;text-transform:uppercase !important;letter-spacing:.05em !important;margin-bottom:10px !important}
.wordbank{display:flex !important;flex-wrap:wrap !important;gap:8px !important;margin-bottom:20px !important}
.word-chip{border:1.5px solid var(--purple-600) !important;background:var(--white) !important;color:var(--purple-700) !important;font-size:13px !important;font-weight:600 !important;padding:9px 15px !important;border-radius:999px !important}
.word-chip:hover{background:var(--purple-050) !important}
.word-chip:disabled{opacity:.35 !important;cursor:default !important;border-color:var(--line) !important;color:var(--ink-faint) !important}
.check-btn{background:var(--purple-600) !important;color:var(--white) !important;border:none !important;border-radius:999px !important;padding:12px 24px !important;font-weight:700 !important;font-size:14px !important}
.check-btn:hover{background:var(--purple-700) !important}
.check-btn:disabled{background:var(--line) !important;color:var(--ink-faint) !important;cursor:default !important}
.worksheet-feedback{margin-top:16px !important;padding:14px 16px !important;border-radius:10px !important;font-size:13.5px !important;display:none !important}
.worksheet-feedback.show{display:block !important}
.worksheet-feedback.good{background:var(--green-bg) !important;color:#0f5a2b !important}
.worksheet-feedback.retry{background:var(--amber-bg) !important;color:#7a3a06 !important}
.insight-box.show{display:block !important;animation:fadein .3s ease !important}
@keyframes fadein{ from{opacity:0; transform:translateY(4px);} to{opacity:1; transform:translateY(0);} }
.insight-box p:last-child{margin-bottom:0 !important}
.pitfall-card .fix b{color:var(--green) !important}
.quiz-option.correct{border-color:var(--green) !important;background:var(--green-bg) !important;font-weight:700 !important}
.quiz-option.incorrect{border-color:var(--red) !important;background:var(--red-bg) !important}
.quiz-option:disabled{cursor:default !important}
.quiz-feedback.show{display:block !important}
.goal-btn.done{background:var(--green) !important}
.match-item.selected{border-color:var(--purple-600) !important;background:var(--purple-050) !important}
.match-item.matched{border-color:var(--green) !important;background:var(--green-bg) !important;color:#0f5a2b !important;font-weight:600 !important;cursor:default !important}
.match-item.wrong{border-color:var(--red) !important;background:var(--red-bg) !important}
.gov-grid{display:grid !important;grid-template-columns:repeat(3,1fr) !important;gap:16px !important;max-width:960px !important;margin:0 auto !important}
.gov-card{background:var(--white) !important;border:1px solid var(--line) !important;border-radius:var(--radius) !important;padding:22px !important}
.gov-icon{width:34px !important;height:34px !important;border-radius:9px !important;background:var(--purple-050) !important;color:var(--purple-700) !important;display:flex !important;align-items:center !important;justify-content:center !important;font-size:16px !important;margin-bottom:12px !important}
.gov-card h3{font-size:14.5px !important;margin:0 0 8px !important}
.gov-card p{font-size:13px !important;color:var(--ink-soft) !important;margin:0 0 12px !important}
.gov-note{font-size:11.5px !important;color:var(--purple-700) !important;font-weight:700 !important;background:var(--purple-100) !important;padding:5px 10px !important;border-radius:8px !important;display:inline-block !important}
.check-list{display:flex !important;flex-direction:column !important;gap:10px !important;margin-bottom:20px !important}
.check-item{display:flex !important;align-items:flex-start !important;gap:10px !important;font-size:13.5px !important;color:var(--ink) !important;background:var(--purple-050) !important;border-radius:10px !important;padding:12px 14px !important}
.check-item .ck{color:var(--green) !important;font-weight:800 !important;flex:none !important}
@media (max-width:720px){.stat-grid{grid-template-columns:1fr 1fr !important}}
@media (max-width:720px){.map-grid{grid-template-columns:1fr 1fr !important}}
@media (max-width:720px){.pitfall-grid{grid-template-columns:1fr !important}}
@media (max-width:720px){.pitfall-card .fix{padding-left:0 !important;margin-top:4px !important}}
@media (max-width:720px){.ba-card{grid-template-columns:1fr !important}}
@media (max-width:720px){.ba-arrow{display:none !important}}
@media (max-width:720px){.match-wrap{grid-template-columns:1fr !important}}
@media (max-width:720px){.gov-grid{grid-template-columns:1fr !important}}
@media (max-width:560px){.course-nav{justify-content:center !important;text-align:center !important}}
.view.active{display:block !important}
.footer-inner > .next-teaser:first-child{margin-top:0 !important;border-top:none !important;padding-top:0 !important}
.complete-row button.done{background:var(--green) !important;color:var(--white) !important}
.game-badge.show{display:flex !important}
.game-badge.tier-earned{background:var(--purple-100) !important;color:var(--purple-700) !important}
.crash-done-badge.show{display:flex !important}
.crash-step.day-done .num{background:var(--green) !important;border-color:var(--green) !important;color:var(--white) !important}
.bonus-modal{position:fixed !important;inset:0 !important;z-index:300 !important;display:none !important;align-items:center !important;justify-content:center !important;padding:20px !important}
.bonus-modal.open{display:flex !important}
.modeduel-backdrop{position:absolute !important;inset:0 !important;background:rgba(14,10,38,.82) !important;backdrop-filter:blur(2px) !important}
.modeduel-panel{position:relative !important;width:100% !important;max-width:720px !important}
.modeduel-panel iframe{width:100% !important;height:840px !important;max-height:88vh !important;border:0 !important;border-radius:20px !important;box-shadow:0 30px 70px rgba(0,0,0,.5) !important;display:block !important;background:#0E0A26 !important}
.modeduel-close{position:absolute !important;top:-14px !important;right:-14px !important;width:36px !important;height:36px !important;border-radius:50% !important;background:#fff !important;color:var(--purple-900) !important;border:none !important;font-size:15px !important;font-weight:700 !important;cursor:pointer !important;box-shadow:0 6px 16px rgba(0,0,0,.35) !important;display:flex !important;align-items:center !important;justify-content:center !important}
.modeduel-close:hover{background:var(--purple-100) !important}
.modeduel-close:focus-visible{outline:2.5px solid #fff !important;outline-offset:2px !important}
@media (max-width:640px){.modeduel-panel iframe{height:82vh !important}}
@media (max-width:640px){.modeduel-close{top:6px !important;right:6px !important}}
@keyframes cpspin{ to{ transform:rotate(360deg); } }
.cp-resp.show{display:flex !important;animation:fadein .3s ease !important}
.cp-window.is-answered .cp-thinking{display:none !important}
@keyframes cpblink{ 50%{ opacity:0; } }
@keyframes cpdot{ 0%,100%{ opacity:.35; } 50%{ opacity:1; } }
.cp-window.is-answered .cp-status{display:none !important}
.cp-window.is-answered .cp-ph-text{opacity:0 !important}
@media (max-width:560px){.cp-window{padding:16px 14px 14px !important}}
@media (max-width:560px){.cp-user-bubble{max-width:100% !important;font-size:14px !important;padding:14px 16px 24px !important}}
@media (max-width:560px){.cp-mode, .cp-ico-slash{display:none !important}}
@media (max-width:560px){.cp-ph-text{font-size:13.5px !important}}
@media (max-width:600px){.pf-row{flex-wrap:wrap !important}}
@media (max-width:600px){.pf-ctl{flex:1 1 100% !important;max-width:100% !important}}
@media (max-width:600px){.pf-body{padding:22px 16px !important}}
.day-badge.earned{border-color:var(--purple-600) !important;box-shadow:0 14px 36px -22px rgba(108,86,232,.55) !important;background:linear-gradient(180deg,#fff 0%,var(--purple-050) 100%) !important}
.db-medal{flex:none !important;width:84px !important;height:96px !important}
.day-badge.just-earned .db-medal{animation:dbpop .5s ease !important}
@keyframes dbpop{ 0%{ transform:scale(.6); opacity:0; } 70%{ transform:scale(1.08); } 100%{ transform:scale(1); opacity:1; } }
.db-main{flex:1 !important;min-width:0 !important}
.db-title{font-size:18px !important;font-weight:800 !important;color:var(--ink) !important;margin:0 0 4px !important}
.db-sub{font-size:13.5px !important;color:var(--ink-soft) !important;margin:0 0 14px !important;line-height:1.5 !important}
.day-badge.earned .db-sub{margin-bottom:0 !important}
.db-steps{list-style:none !important;margin:0 !important;padding:0 !important;display:flex !important;flex-direction:column !important;gap:6px !important}
.db-step{width:100% !important;display:flex !important;align-items:center !important;gap:10px !important;text-align:left !important;background:var(--bg) !important;border:1px solid var(--line) !important;border-radius:10px !important;padding:9px 12px !important;font-size:13.5px !important;color:var(--ink) !important}
.db-step:hover{border-color:var(--purple-600) !important}
.db-check{flex:none !important;width:20px !important;height:20px !important;border-radius:50% !important;border:1.5px solid #C9C3E6 !important;display:inline-flex !important;align-items:center !important;justify-content:center !important;font-size:12px !important;color:#fff !important;background:#fff !important}
.db-step.done .db-check{background:var(--green) !important;border-color:var(--green) !important}
.db-step.done{background:var(--green-bg) !important;border-color:#BFE3CB !important}
.db-label{flex:1 !important}
.db-count{flex:none !important;font-size:12.5px !important;font-weight:700 !important;color:var(--ink-faint) !important;font-variant-numeric:tabular-nums !important}
.db-step.done .db-count{color:var(--green) !important}
.db-reset{background:none !important;border:none !important;padding:0 !important;margin-top:10px !important;font-size:12px !important;color:var(--ink-faint) !important;text-decoration:underline !important}
.djp-bar{width:80px !important;height:6px !important;border-radius:3px !important;background:#E5E0F5 !important;overflow:hidden !important}
.djp-bar i{display:block !important;height:100% !important;background:var(--purple-600) !important;border-radius:3px !important;transition:width .25s ease !important}
.day-jump-prog.earned{color:var(--purple-700) !important}
@media (max-width:600px){.day-badge{flex-direction:column !important;text-align:center !important;padding:22px 16px !important}}
@media (max-width:600px){.db-step{text-align:left !important}}
@media (max-width:600px){.day-jump-prog .djp-bar{display:none !important}}
.ln-item.active{background:#F7F5FF !important;color:#5642C4 !important}
.ln-item.active .ln-dot{background:#6C56E8 !important;border-color:#6C56E8 !important;box-shadow:0 0 0 4px #E4DEFB !important}
.ln-item.seen .ln-dot{background:#6C56E8 !important;border-color:#6C56E8 !important}
.ln-item.seen .ln-dot::after{content:"";position:absolute;left:1.5px;top:-.5px;width:2.5px;height:5px;border:solid #fff;border-width:0 1.6px 1.6px 0;transform:rotate(45deg)}
.ln-item .ln-dot{transition:background .2s ease,border-color .2s ease,box-shadow .2s ease !important}
.ln-item.seen{color:#3B3556 !important}
@media (max-width:900px){.lesson-pager-grid{grid-template-columns:minmax(0,1fr) !important}.lesson-pager-grid > span{display:none !important}.lesson-layout{grid-template-columns:minmax(0,1fr) !important}.lesson-aside{display:none !important}}

.hv1:hover{color:#1B1730 !important}
.hv2:hover{border-color:#6C56E8 !important;box-shadow:0 10px 28px rgba(36,26,87,.10) !important}
.hv3:hover{background:#EDE9FE !important}
.hv4:hover{background:#5642C4 !important}
.hv5:hover{background:#F7F5FF !important;color:#1B1730 !important}
.hv6:hover{background:#F7F5FF !important}
.hv7:hover{border-color:#6C56E8 !important}
.hv8:hover{border-color:#6C56E8 !important;color:#1B1730 !important}
.hv9:hover{background:#3f34a6 !important}
.hv10:hover{color:#fff !important}

/* ===== v5 additions: Daily Goal + Bonus Level steps in the new lesson layout ===== */

.lx-bonus{ position:relative; overflow:hidden; background:#241A57; border-radius:20px; padding:44px 32px 36px; color:#fff; text-align:left; }
.lx-bonus::before{ content:""; position:absolute; inset:0; background-image:url('../assets/52c3e0934c09d8a0.png'); background-size:80px 80px; opacity:.05; pointer-events:none; }
.lx-bonus > *{ position:relative; }
.lx-bonus-eyebrow{ font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:#EDE9FE; margin-bottom:10px; }
.lx-bonus h2{ font-size:30px; margin:0 0 14px; letter-spacing:-0.015em; line-height:1.2; color:#fff; }
.lx-bonus p{ font-size:17px; line-height:1.65; color:#EDE9FE; margin:0 0 26px; }
.lx-play{ display:inline-flex; align-items:center; gap:8px; border-radius:999px; padding:13px 26px; font-weight:700; font-size:15px; background:#fff; color:#241A57; border:none; }
.lx-play:hover{ background:#EDE9FE; }
.lx-bonus-note{ font-size:12.5px; color:#EDE9FE; opacity:.8; margin-top:16px; }
.lesson-main{ position:relative; }
#crash-course .course-grid > .deep-card{ flex:0 0 calc((100% - 20px) / 2); min-width:0; }
@media (max-width:900px){ #crash-course .course-grid > .deep-card{ flex-basis:calc((100% - 20px) / 2); } }
@media (max-width:620px){ #crash-course .course-grid > .deep-card{ flex-basis:100%; } }
@media (max-width:760px){
  .hero-inner{ grid-template-columns:1fr !important; }
  .topbar-inner{ gap:14px !important; padding:12px 16px !important; }
  .cu-tabs{ gap:16px !important; }
  .cu-tab{ white-space:nowrap; font-size:13.5px !important; }
  .brand img{ height:24px !important; }
  .nav-actions{ gap:10px !important; }
  .signin-link{ white-space:nowrap; font-size:13.5px !important; }
}
@media (max-width:480px){ .brand-div, .brand-suffix{ display:none !important; } }

