{"id":24382,"date":"2026-08-25T16:34:59","date_gmt":"2026-08-25T11:04:59","guid":{"rendered":"https:\/\/sparkl.me\/blog\/the-spark-newsletters\/"},"modified":"2026-08-25T16:41:19","modified_gmt":"2026-08-25T11:11:19","slug":"the-spark-newsletters","status":"publish","type":"page","link":"https:\/\/sparkl.me\/blog\/the-spark-newsletters\/","title":{"rendered":"The Spark Newsletter Archive"},"content":{"rendered":"<style>\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n       ALL CSS SCOPED UNDER .snl  \u2192  zero WordPress conflicts\n    \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n\n    \/* \u2500\u2500 tokens \u2500\u2500 *\/\n    .snl {\n      --snl-ink:    #0c0c14;\n      --snl-ink2:   #2b2b3d;\n      --snl-ink3:   #4a4a68;\n      --snl-mute:   #9898b4;\n      --snl-rule:   #e4e4f0;\n      --snl-paper:  #f8f8fc;\n      --snl-white:  #ffffff;\n      --snl-volt:   #4f3ff0;\n      --snl-volt-l: #7265f5;\n      --snl-neon:   #00d4aa;\n      --snl-amber:  #f5a623;\n      --snl-fd:  \"Cormorant Garamond\", \"Georgia\", serif;\n      --snl-fb:  \"Figtree\", \"Helvetica Neue\", sans-serif;\n      --snl-fm:  \"JetBrains Mono\", \"Courier New\", monospace;\n      --snl-ease: cubic-bezier(0.22, 1, 0.36, 1);\n    }\n\n    \/* \u2500\u2500 base reset (scoped) \u2500\u2500 *\/\n    .snl, .snl * { box-sizing: border-box; }\n    .snl img { display: block; max-width: 100%; }\n    .snl a, .snl button { font-family: var(--snl-fb); text-decoration: none; }\n\n    \/* \u2500\u2500 wrapper \u2500\u2500 *\/\n    .snl {\n      width: min(1380px, calc(100vw - 48px));\n      max-width: none;\n      position: relative;\n      left: 50%;\n      transform: translateX(-50%);\n      margin: 0 0 60px;\n      background: var(--snl-white);\n      color: var(--snl-ink);\n      font-family: var(--snl-fb);\n      -webkit-font-smoothing: antialiased;\n      overflow-x: hidden;\n    }\n\n    \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n       HERO MASTHEAD\n    \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n    .snl-hero {\n      position: relative;\n      background: var(--snl-white);\n      border-radius: 24px;\n      padding: 64px 72px 0;\n      margin-bottom: 2px;\n      overflow: hidden;\n    }\n\n    .snl-hero-year-bg {\n      position: absolute;\n      bottom: -0.06em;\n      right: 32px;\n      font-family: var(--snl-fd);\n      font-size: clamp(130px, 20vw, 280px);\n      font-weight: 700;\n      line-height: 1;\n      letter-spacing: -0.05em;\n      color: transparent;\n      -webkit-text-stroke: 1.5px rgba(79, 63, 240, 0.06);\n      user-select: none;\n      pointer-events: none;\n    }\n\n    \/* live chip *\/\n    .snl-chip {\n      display: inline-flex;\n      align-items: center;\n      gap: 8px;\n      padding: 5px 16px;\n      background: var(--snl-paper);\n      border: 1px solid var(--snl-rule);\n      color: var(--snl-mute);\n      border-radius: 100px;\n      font-family: var(--snl-fm);\n      font-size: 11px;\n      letter-spacing: 0.14em;\n      text-transform: uppercase;\n      margin-bottom: 32px;\n    }\n\n    @keyframes snlBlink { 0%,100%{opacity:1} 50%{opacity:0.2} }\n\n    \/* hero headline *\/\n    .snl-headline {\n      font-family: var(--snl-fd);\n      font-size: clamp(72px, 12vw, 168px);\n      font-weight: 700;\n      line-height: 0.88;\n      letter-spacing: -0.04em;\n      color: var(--snl-ink);\n      position: relative;\n      z-index: 2;\n      margin: 0 0 0;\n    }\n\n    .snl-headline-the {\n      display: block;\n      font-weight: 300;\n      font-style: italic;\n      color: var(--snl-ink3);\n      font-size: 0.42em;\n      letter-spacing: 0.02em;\n      margin-bottom: 0.08em;\n    }\n\n    .snl-headline-spark {\n      display: block;\n      color: var(--snl-ink);\n    }\n\n    \/* strip bar under headline *\/\n    .snl-hero-strip {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      gap: 24px;\n      margin-top: 40px;\n      padding: 20px 0;\n      border-top: 1px solid var(--snl-rule);\n      position: relative;\n      z-index: 2;\n    }\n\n    .snl-hero-quote {\n      font-family: var(--snl-fd);\n      font-size: 19px;\n      line-height: 1.55;\n      color: var(--snl-ink3);\n      font-style: italic;\n      font-weight: 400;\n      max-width: 520px;\n      margin: 0;\n    }\n\n    .snl-hero-from {\n      font-family: var(--snl-fm);\n      font-size: 10px;\n      color: var(--snl-mute);\n      letter-spacing: 0.2em;\n      text-transform: uppercase;\n      white-space: nowrap;\n    }\n\n    \/* \u2500\u2500 Quick index strip \u2500\u2500 *\/\n    .snl-index-strip {\n      display: flex;\n      align-items: stretch;\n      gap: 0;\n      background: var(--snl-white);\n      border: 1px solid var(--snl-rule);\n      border-radius: 14px;\n      margin-bottom: 24px;\n      overflow: hidden;\n    }\n\n    .snl-index-label {\n      padding: 16px 24px;\n      font-family: var(--snl-fm);\n      font-size: 10px;\n      letter-spacing: 0.18em;\n      color: var(--snl-mute);\n      text-transform: uppercase;\n      border-right: 1px solid var(--snl-rule);\n      display: flex;\n      align-items: center;\n      white-space: nowrap;\n    }\n\n    .snl-index-links {\n      display: flex;\n      align-items: stretch;\n      flex: 1;\n    }\n\n    .snl-index-link {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      padding: 14px 24px;\n      border-right: 1px solid var(--snl-rule);\n      cursor: pointer;\n      transition: background 0.2s;\n      text-decoration: none;\n    }\n\n    .snl-index-link:hover { background: var(--snl-paper); }\n\n    .snl-index-num {\n      font-family: var(--snl-fm);\n      font-size: 10px;\n      color: var(--snl-mute);\n      letter-spacing: 0.1em;\n      min-width: 22px;\n    }\n\n    .snl-index-month {\n      font-family: var(--snl-fb);\n      font-size: 13px;\n      font-weight: 600;\n      color: var(--snl-ink);\n    }\n\n    .snl-index-year {\n      font-family: var(--snl-fm);\n      font-size: 10px;\n      color: var(--snl-mute);\n      margin-left: 4px;\n    }\n\n    .snl-current-dot {\n      display: inline-block;\n      font-family: var(--snl-fm);\n      font-size: 9px;\n      color: var(--snl-volt);\n      letter-spacing: 0.1em;\n      text-transform: uppercase;\n      background: rgba(79,63,240,0.08);\n      padding: 2px 7px;\n      border-radius: 4px;\n      flex-shrink: 0;\n    }\n\n    .snl-more-btn {\n      margin-left: auto;\n      padding: 14px 24px;\n      background: none;\n      border: none;\n      cursor: pointer;\n      font-family: var(--snl-fm);\n      font-size: 11px;\n      color: var(--snl-volt);\n      letter-spacing: 0.06em;\n      display: none;\n      align-items: center;\n      gap: 6px;\n    }\n\n    .snl-more-btn.visible { display: flex; }\n    .snl-more-btn:hover { opacity: 0.65; }\n\n\n    \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n       FEATURED CURRENT NEWSLETTER\n    \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n\n    \/* \u2500\u2500 card overlay link (makes entire card clickable) \u2500\u2500 *\/\n    .snl-card-link {\n      position: absolute;\n      inset: 0;\n      z-index: 1;\n      display: block;\n      cursor: pointer;\n    }\n\n    \/* inner CTAs sit above the overlay *\/\n    .snl-cta, .snl-arc-cta-link {\n      position: relative;\n      z-index: 2;\n    }\n\n    .snl-featured {\n      display: grid;\n      grid-template-columns: 1fr 1fr;\n      background: var(--snl-white);\n      border: 1px solid var(--snl-rule);\n      border-radius: 24px;\n      overflow: hidden;\n      min-height: 580px;\n      margin-bottom: 32px;\n      scroll-margin-top: 80px;\n      position: relative;\n      transition: box-shadow 0.28s ease;\n    }\n\n    .snl-featured:hover {\n      box-shadow: 0 12px 40px -10px rgba(79,63,240,0.18);\n    }\n\n    \/* \u2500 screenshot panel \u2500 *\/\n    .snl-preview-panel {\n      position: relative;\n      background: linear-gradient(150deg, #eeeaff 0%, #e4dfff 45%, #ede9ff 100%);\n      padding: 44px 36px 0 44px;\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: flex-end;\n      overflow: hidden;\n    }\n\n    \/* dot grid texture *\/\n    .snl-preview-panel::before {\n      content: \"\";\n      position: absolute;\n      inset: 0;\n      background-image: radial-gradient(circle, rgba(79,63,240,0.13) 1px, transparent 1px);\n      background-size: 22px 22px;\n      pointer-events: none;\n      opacity: 0.7;\n    }\n\n    \/* floating badge *\/\n    .snl-preview-badge {\n      position: absolute;\n      top: 22px;\n      right: 22px;\n      display: inline-flex;\n      align-items: center;\n      gap: 7px;\n      padding: 7px 14px;\n      background: rgba(255,255,255,0.9);\n      backdrop-filter: blur(10px);\n      -webkit-backdrop-filter: blur(10px);\n      border: 1px solid rgba(79,63,240,0.2);\n      border-radius: 100px;\n      font-family: var(--snl-fm);\n      font-size: 11px;\n      color: var(--snl-ink);\n      letter-spacing: 0.06em;\n      z-index: 2;\n    }\n\n\n    \/* browser chrome wrapper *\/\n    .snl-browser {\n      position: relative;\n      width: 100%;\n      max-width: 420px;\n      border-radius: 12px 12px 0 0;\n      overflow: hidden;\n      box-shadow:\n        0 -2px 0 rgba(255,255,255,0.5) inset,\n        0 28px 72px -8px rgba(79, 63, 240, 0.3),\n        0 8px 24px -4px rgba(0,0,0,0.12);\n      transition: transform 0.5s var(--snl-ease);\n    }\n\n    .snl-featured:hover .snl-browser { transform: translateY(-6px); }\n\n    \/* trigger circle arrow and underline on full-card hover *\/\n    .snl-featured:hover .snl-cta::after { transform: scaleX(1); }\n    .snl-featured:hover .snl-cta .snl-cta-circle {\n      background: var(--snl-volt);\n      border-color: var(--snl-volt);\n      color: #fff;\n      transform: rotate(-45deg);\n    }\n\n    .snl-browser-bar {\n      background: #f0f0f6;\n      padding: 10px 14px;\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      border-bottom: 1px solid rgba(0,0,0,0.07);\n    }\n\n    .snl-browser-dots { display: flex; gap: 5px; }\n    .snl-browser-dots span { width: 9px; height: 9px; border-radius: 50%; }\n    .snl-browser-dots span:nth-child(1) { background: #ff6059; }\n    .snl-browser-dots span:nth-child(2) { background: #ffbe2f; }\n    .snl-browser-dots span:nth-child(3) { background: #28c840; }\n\n    .snl-browser-url {\n      flex: 1;\n      background: rgba(255,255,255,0.85);\n      border: 1px solid rgba(0,0,0,0.09);\n      border-radius: 5px;\n      padding: 4px 10px;\n      font-family: var(--snl-fm);\n      font-size: 10px;\n      color: var(--snl-mute);\n      letter-spacing: 0.02em;\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n\n    .snl-browser-screen {\n      position: relative;\n      background: #fff;\n      width: 100%;\n      height: 435px;\n      max-height: 440px;\n      overflow: hidden;\n    }\n\n    .snl-browser-screen img {\n      display: block;\n      width: 100%;\n      height: 100%;\n      object-fit: cover;\n      object-position: top center;\n    }\n\n    \/* fade out bottom of screenshot *\/\n    .snl-browser-screen::after {\n      content: \"\";\n      position: absolute;\n      bottom: 0; left: 0; right: 0;\n      height: 110px;\n      background: linear-gradient(to bottom, transparent, rgba(237, 233, 255, 0.97));\n      pointer-events: none;\n    }\n\n    .snl-browser-placeholder {\n      min-height: 340px;\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      background: linear-gradient(145deg, #1e1e2e 0%, #1a1040 50%, #2d1f6e 100%);\n      color: #fff;\n      font-family: var(--snl-fd);\n      font-size: 48px;\n      font-weight: 600;\n      letter-spacing: -0.03em;\n      gap: 4px;\n    }\n\n    .snl-browser-placeholder span { color: var(--snl-neon); }\n\n    \/* \u2500 text panel \u2500 *\/\n    .snl-text-panel {\n      padding: 56px 60px;\n      display: flex;\n      flex-direction: column;\n      justify-content: space-between;\n      border-left: 1px solid var(--snl-rule);\n    }\n\n    .snl-tag-row {\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      margin-bottom: 28px;\n    }\n\n    .snl-tag-label {\n      font-family: var(--snl-fm);\n      font-size: 10px;\n      letter-spacing: 0.16em;\n      color: var(--snl-mute);\n      text-transform: uppercase;\n    }\n\n    .snl-tag-badge {\n      display: inline-block;\n      padding: 3px 10px;\n      background: var(--snl-volt);\n      color: #fff;\n      border-radius: 4px;\n      font-family: var(--snl-fm);\n      font-size: 10px;\n      letter-spacing: 0.12em;\n      text-transform: uppercase;\n    }\n\n    .snl-issue-title {\n      font-family: var(--snl-fd);\n      font-size: clamp(28px, 3.5vw, 46px);\n      font-weight: 600;\n      line-height: 1.1;\n      letter-spacing: -0.025em;\n      color: var(--snl-ink);\n      margin: 0 0 20px;\n    }\n\n    .snl-issue-desc {\n      font-family: var(--snl-fb);\n      font-size: 15px;\n      line-height: 1.72;\n      color: var(--snl-ink3);\n      font-weight: 400;\n      margin: 0 0 32px;\n    }\n\n    \/* CTA *\/\n    .snl-cta {\n      display: inline-flex;\n      align-items: center;\n      gap: 14px;\n      text-decoration: none;\n      font-family: var(--snl-fb);\n      font-size: 13px;\n      font-weight: 600;\n      letter-spacing: 0.06em;\n      text-transform: uppercase;\n      color: var(--snl-ink);\n      position: relative;\n      padding-bottom: 2px;\n    }\n\n    .snl-cta::after {\n      content: \"\";\n      position: absolute;\n      bottom: -2px; left: 0; right: 36px;\n      height: 1.5px;\n      background: var(--snl-volt);\n      transform: scaleX(0);\n      transform-origin: left;\n      transition: transform 0.3s var(--snl-ease);\n    }\n\n    .snl-cta:hover::after { transform: scaleX(1); }\n\n    .snl-cta-circle {\n      width: 36px;\n      height: 36px;\n      border-radius: 50%;\n      border: 1.5px solid var(--snl-ink);\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      font-size: 15px;\n      flex-shrink: 0;\n      transition: all 0.28s var(--snl-ease);\n    }\n\n    .snl-cta:hover .snl-cta-circle {\n      background: var(--snl-volt);\n      border-color: var(--snl-volt);\n      color: #fff;\n      transform: rotate(-45deg);\n    }\n\n    .snl-date-row {\n      display: flex;\n      align-items: flex-end;\n      gap: 10px;\n      padding-top: 28px;\n      border-top: 1px solid var(--snl-rule);\n      margin-top: auto;\n    }\n\n    .snl-date-month {\n      font-family: var(--snl-fd);\n      font-size: 22px;\n      font-weight: 600;\n      color: var(--snl-ink);\n      letter-spacing: -0.01em;\n    }\n\n    .snl-date-year {\n      font-family: var(--snl-fm);\n      font-size: 12px;\n      color: var(--snl-mute);\n      margin-bottom: 3px;\n    }\n\n\n    \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n       ARCHIVE SECTION HEADER\n    \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n    .snl-section-head {\n      display: flex;\n      align-items: center;\n      gap: 16px;\n      padding: 20px 0;\n      margin-bottom: 20px;\n      margin-top: 48px;\n    }\n\n    .snl-section-rule { flex: 1; height: 1px; background: var(--snl-rule); }\n    .snl-section-label {\n      font-family: var(--snl-fm);\n      font-size: 10px;\n      letter-spacing: 0.2em;\n      color: var(--snl-mute);\n      text-transform: uppercase;\n      white-space: nowrap;\n    }\n\n\n    \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n       ARCHIVE ROW\n    \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n    .snl-archive-list { display: flex; flex-direction: column; gap: 20px; }\n\n    .snl-archive-row {\n      display: grid;\n      grid-template-columns: 300px 1fr;\n      background: var(--snl-white);\n      border: 1px solid var(--snl-rule);\n      border-radius: 20px;\n      overflow: hidden;\n      min-height: 300px;\n      scroll-margin-top: 100px;\n      position: relative;\n      transition: box-shadow 0.28s ease;\n    }\n\n    .snl-archive-row:hover {\n      box-shadow: 0 12px 40px -10px rgba(79,63,240,0.18);\n    }\n\n    \/* trigger circle arrow on full-card hover *\/\n    .snl-archive-row:hover .snl-arc-cta-link { color: var(--snl-volt); }\n    .snl-archive-row:hover .snl-arc-circle {\n      background: var(--snl-volt);\n      border-color: var(--snl-volt);\n      color: #fff;\n      transform: rotate(-45deg) scale(1.08);\n    }\n\n    \/* \u2500 mini browser screenshot col \u2500 *\/\n    .snl-arc-shot {\n      position: relative;\n      background: linear-gradient(155deg, #eeebff 0%, #e5e1ff 100%);\n      padding: 28px 24px 0 28px;\n      display: flex;\n      align-items: flex-end;\n      justify-content: center;\n      overflow: hidden;\n    }\n\n    .snl-arc-shot::before {\n      content: \"\";\n      position: absolute; inset: 0;\n      background-image: radial-gradient(circle, rgba(79,63,240,0.1) 1px, transparent 1px);\n      background-size: 18px 18px;\n      opacity: 0.6;\n      pointer-events: none;\n    }\n\n    .snl-mini-browser {\n      position: relative;\n      width: 100%;\n      max-width: 240px;\n      border-radius: 8px 8px 0 0;\n      overflow: hidden;\n      box-shadow:\n        0 16px 48px -6px rgba(79,63,240,0.22),\n        0 4px 12px -2px rgba(0,0,0,0.1);\n      transition: transform 0.4s var(--snl-ease);\n    }\n\n    .snl-archive-row:hover .snl-mini-browser { transform: translateY(-4px); }\n\n    .snl-mini-bar {\n      background: #f0f0f6;\n      padding: 7px 10px;\n      display: flex;\n      align-items: center;\n      gap: 7px;\n      border-bottom: 1px solid rgba(0,0,0,0.06);\n    }\n\n    .snl-mini-dots { display: flex; gap: 4px; }\n    .snl-mini-dots span { width: 7px; height: 7px; border-radius: 50%; }\n    .snl-mini-dots span:nth-child(1) { background: #ff6059; }\n    .snl-mini-dots span:nth-child(2) { background: #ffbe2f; }\n    .snl-mini-dots span:nth-child(3) { background: #28c840; }\n\n    .snl-mini-url {\n      flex: 1; background: rgba(255,255,255,0.82);\n      border: 1px solid rgba(0,0,0,0.08); border-radius: 4px;\n      padding: 3px 8px; font-family: var(--snl-fm);\n      font-size: 9px; color: var(--snl-mute);\n      white-space: nowrap; overflow: hidden; text-overflow: ellipsis;\n    }\n\n    .snl-mini-screen {\n      position: relative;\n      background: #fff;\n      width: 100%;\n      height: 225px;\n      max-height: 230px;\n      overflow: hidden;\n    }\n\n    .snl-mini-screen img {\n      display: block; width: 100%; height: 100%;\n      object-fit: cover; object-position: top center;\n    }\n\n    .snl-mini-screen::after {\n      content: \"\"; position: absolute; bottom: 0; left: 0; right: 0;\n      height: 70px;\n      background: linear-gradient(to bottom, transparent, rgba(237, 233, 255, 0.98));\n      pointer-events: none;\n    }\n\n    .snl-mini-placeholder {\n      min-height: 160px; display: flex; align-items: center; justify-content: center;\n      background: linear-gradient(140deg, #1e1e2e, #1a1040);\n      color: #fff; font-family: var(--snl-fd); font-size: 20px;\n      font-weight: 600; letter-spacing: -0.02em;\n    }\n    .snl-mini-placeholder span { color: var(--snl-neon); }\n\n    \/* \u2500 text col \u2500 *\/\n    .snl-arc-text {\n      padding: 36px 44px 36px 40px;\n      display: flex;\n      flex-direction: column;\n      justify-content: space-between;\n      border-left: 1px solid var(--snl-rule);\n    }\n\n    .snl-arc-top {}\n\n    .snl-arc-meta {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      margin-bottom: 16px;\n    }\n\n    .snl-arc-num {\n      font-family: var(--snl-fm);\n      font-size: 10px;\n      color: var(--snl-mute);\n      letter-spacing: 0.12em;\n    }\n\n    .snl-arc-sep {\n      width: 20px;\n      height: 1px;\n      background: var(--snl-rule);\n    }\n\n    .snl-arc-date {\n      font-family: var(--snl-fm);\n      font-size: 10px;\n      color: var(--snl-volt);\n      letter-spacing: 0.14em;\n      text-transform: uppercase;\n    }\n\n    .snl-arc-title {\n      font-family: var(--snl-fd);\n      font-size: clamp(22px, 2.8vw, 32px);\n      font-weight: 600;\n      line-height: 1.12;\n      letter-spacing: -0.025em;\n      color: var(--snl-ink);\n      margin: 0 0 28px;\n    }\n\n    .snl-arc-cta-link {\n      display: inline-flex;\n      align-items: center;\n      gap: 12px;\n      text-decoration: none;\n      font-family: var(--snl-fb);\n      font-size: 12px;\n      font-weight: 600;\n      letter-spacing: 0.08em;\n      text-transform: uppercase;\n      color: var(--snl-ink);\n      transition: color 0.2s;\n    }\n    .snl-arc-cta-link:hover { color: var(--snl-volt); }\n\n    .snl-arc-circle {\n      width: 40px; height: 40px; border-radius: 50%;\n      border: 1.5px solid var(--snl-rule);\n      display: flex; align-items: center; justify-content: center;\n      font-size: 16px; transition: all 0.28s var(--snl-ease);\n    }\n\n    .snl-arc-cta-link:hover .snl-arc-circle {\n      background: var(--snl-volt);\n      border-color: var(--snl-volt);\n      color: #fff;\n      transform: rotate(-45deg) scale(1.08);\n    }\n\n\n    \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n       SELECTION HIGHLIGHT (scroll target animation)\n    \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n    .snl-selected { isolation: isolate; }\n\n    .snl-selected::before {\n      content: \"\";\n      position: absolute; inset: 0;\n      pointer-events: none; z-index: 10;\n      outline: 2px solid var(--snl-neon);\n      outline-offset: -2px;\n      box-shadow: inset 0 0 40px rgba(0, 212, 170, 0.05);\n      border-radius: inherit;\n      animation: snlScan 2.7s var(--snl-ease) forwards;\n    }\n\n    .snl-selected::after {\n      content: \"\u25c9  ISSUE LOCATED\";\n      position: absolute; top: 12px; right: 18px; z-index: 40;\n      padding: 5px 12px;\n      background: var(--snl-neon); color: var(--snl-ink);\n      border-radius: 5px;\n      font-family: var(--snl-fm); font-size: 10px; letter-spacing: 0.1em;\n      white-space: nowrap; pointer-events: none;\n      animation: snlLabel 2.7s var(--snl-ease) forwards;\n    }\n\n    @keyframes snlScan { 0%{opacity:0} 12%{opacity:1} 76%{opacity:1} 100%{opacity:0} }\n    @keyframes snlLabel { 0%{opacity:0;transform:translateY(-8px)} 12%,76%{opacity:1;transform:translateY(0)} 100%{opacity:0;transform:translateY(-6px)} }\n\n\n    \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n       RESPONSIVE\n    \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n    @media (max-width: 960px) {\n      .snl-hero { padding: 48px 48px 0; }\n      .snl-featured { grid-template-columns: 1fr; min-height: auto; }\n      .snl-preview-panel { padding: 36px 36px 0; min-height: 380px; }\n      .snl-browser { max-width: 360px; }\n      .snl-text-panel { padding: 44px 48px; border-left: none; border-top: 1px solid var(--snl-rule); }\n      .snl-archive-row { grid-template-columns: 240px 1fr; }\n    }\n\n    @media (max-width: 700px) {\n      .snl { width: calc(100vw - 24px); margin-bottom: 40px; }\n      .snl-hero { padding: 36px 32px 0; border-radius: 18px; }\n      .snl-headline { font-size: 60px; }\n      .snl-hero-strip { flex-direction: column; align-items: flex-start; gap: 10px; }\n      .snl-index-strip { flex-direction: column; border-radius: 12px; }\n      .snl-index-label { border-right: none; border-bottom: 1px solid var(--snl-rule); }\n      .snl-index-links { flex-wrap: wrap; }\n      .snl-index-link { border-right: 1px solid var(--snl-rule); flex-grow: 1; }\n      .snl-archive-row { grid-template-columns: 1fr; min-height: auto; }\n      .snl-arc-shot { min-height: 260px; padding: 24px 24px 0; }\n      .snl-mini-browser { max-width: 200px; }\n      .snl-arc-text { padding: 28px 28px; border-left: none; border-top: 1px solid var(--snl-rule); }\n      .snl-text-panel { padding: 32px 28px; }\n    }\n\n    @media (max-width: 480px) {\n      .snl-hero { padding: 28px 22px 0; }\n      .snl-headline { font-size: 48px; }\n      .snl-text-panel { padding: 28px 22px; }\n      .snl-arc-text { padding: 24px 22px; }\n      .snl-issue-title { font-size: 26px; }\n      .snl-arc-title { font-size: 22px; }\n    }\n<\/style>\n\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     WRAPPER \u2014 all CSS scoped here, safe for WordPress custom HTML\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<div class=\"snl\">\n\n  <!-- HERO -->\n  <header class=\"snl-hero\">\n    <div class=\"snl-hero-year-bg\" id=\"snlYearBg\" aria-hidden=\"true\"><\/div>\n\n    <div class=\"snl-chip\">Monthly Newsletter Archive<\/div>\n\n    <h1 class=\"snl-headline\">\n      <span class=\"snl-headline-the\">The<\/span>\n      <span class=\"snl-headline-spark\">Spark.<\/span>\n    <\/h1>\n\n    <div class=\"snl-hero-strip\">\n      <p class=\"snl-hero-quote\">\n        \"Curated stories, deep insights, and a touch of the avant-garde \u2014 delivered monthly.\"\n      <\/p>\n      <span class=\"snl-hero-from\">From Sparkl<\/span>\n    <\/div>\n  <\/header>\n\n  <!-- QUICK INDEX STRIP -->\n  <div class=\"snl-index-strip\">\n    <span class=\"snl-index-label\">Newsletters<\/span>\n    <div class=\"snl-index-links\" id=\"snlIndexLinks\"><\/div>\n    <button class=\"snl-more-btn\" id=\"snlMoreBtn\" type=\"button\">+ More \u2193<\/button>\n  <\/div>\n\n  <!-- ISSUES RENDERED HERE -->\n  <div id=\"snlIssues\"><\/div>\n\n<\/div><!-- \/.snl -->\n\n<script>\n(function () {\n  \/* \u2550\u2550 DATA FROM WORDPRESS \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n  const newsletters = [{\"id\":24603,\"title\":\"What\u2019s Shaping Learning Right Now\",\"description\":\"September 2026 at Sparkl: SAT insights, student success stories, expert perspectives, key events, and highlights shaping personalized learning.\",\"month\":\"September\",\"year\":\"2026\",\"image\":\"https:\/\/sparkl.me\/blog\/wp-content\/uploads\/2026\/09\/newslettersep.png\",\"url\":\"https:\/\/sparkl.me\/blog\/whats-shaping-learning-right-now-newsletter-september-2026\/\",\"spotlight\":\"SPARKL SPOTLIGHT\"},{\"id\":24385,\"title\":\"A Month of Big Wins \\u0026#038; Bright Sparks\",\"description\":\"A deep dive into our latest stories, achievements, milestones and everything happening across Sparkl.\",\"month\":\"August\",\"year\":\"2026\",\"image\":\"https:\/\/sparkl.me\/blog\/wp-content\/uploads\/2026\/08\/augustpic.png\",\"url\":\"https:\/\/sparkl.me\/blog\/books\/a-month-of-big-wins-bright-sparks-newsletter-august-2026\/\",\"spotlight\":\"SPARKL SPOTLIGHT\"},{\"id\":24383,\"title\":\"Welcome to The Spark: Stories, Insights \\u0026#038; What\u2019s New at Sparkl\",\"description\":\"\",\"month\":\"July\",\"year\":\"2026\",\"image\":\"https:\/\/sparkl.me\/blog\/wp-content\/uploads\/2026\/08\/julypic.png\",\"url\":\"https:\/\/sparkl.me\/blog\/books\/welcome-to-the-spark-stories-insights-whats-new-at-sparkl-newsletter-july-2026\/\",\"spotlight\":\"SPARKL SPOTLIGHT\"}];\n\n\/* \u2550\u2550 Helpers \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n  const pad = n => String(n).padStart(2, \"0\");\n  const myr = it => `${it.month.toUpperCase()} ${it.year}`;\n  const yr  = new Date().getFullYear();\n\n  document.getElementById(\"snlYearBg\").textContent = yr;\n\n  \/* \u2500\u2500 Build browser chrome \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n  function browserHTML(item, opts = {}) {\n    const {\n      barCls      = \"snl-browser-bar\",\n      dotsCls     = \"snl-browser-dots\",\n      urlCls      = \"snl-browser-url\",\n      screenCls   = \"snl-browser-screen\",\n      placeCls    = \"snl-browser-placeholder\",\n      maxH        = 440\n    } = opts;\n\n    \/* URL bar: use the real destination URL if available, else constructed slug *\/\n    const displayURL = (item.url && item.url !== \"#\")\n      ? item.url.replace(\/^https?:\\\/\\\/\/, \"\")\n      : `sparkl.me\/newsletter\/${item.month.toLowerCase()}-${item.year}`;\n\n    \/* Image: shows thumbnail PNG when provided, placeholder as fallback *\/\n    const imgPart = item.image\n      ? `<img decoding=\"async\" src=\"${item.image}\" alt=\"${item.title}\"\n              onerror=\"this.style.display='none';this.nextElementSibling.style.removeProperty('display');\">\n         <div class=\"${placeCls}\" style=\"display:none;\">THE <span>SPARK<\/span><\/div>`\n      : `<div class=\"${placeCls}\">THE <span>SPARK<\/span><\/div>`;\n\n    return `\n      <div class=\"${barCls}\">\n        <div class=\"${dotsCls}\"><span><\/span><span><\/span><span><\/span><\/div>\n        <div class=\"${urlCls}\">${displayURL}<\/div>\n      <\/div>\n      <div class=\"${screenCls}\" style=\"max-height:${maxH}px;\">${imgPart}<\/div>`;\n  }\n\n  \/* \u2500\u2500 CTA \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n  function ctaHTML(item, label = \"Read Newsletter\") {\n    const target = (item.url && item.url !== \"#\") ? 'target=\"_blank\" rel=\"noopener noreferrer\"' : '';\n    const href = (item.url && item.url !== \"#\") ? item.url : '#';\n    return `\n      <a href=\"${href}\" class=\"snl-cta\" ${target}\n         onclick=\"event.stopPropagation();\">\n        ${label}\n        <span class=\"snl-cta-circle\" aria-hidden=\"true\">\u2197<\/span>\n      <\/a>`;\n  }\n\n  \/* \u2550\u2550 Render current \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n  function renderCurrent(item) {\n    const target = (item.url && item.url !== \"#\") ? 'target=\"_blank\" rel=\"noopener noreferrer\"' : '';\n    const href = (item.url && item.url !== \"#\") ? item.url : '#';\n    const overlayLink = `<a class=\"snl-card-link\" href=\"${href}\" ${target} aria-hidden=\"true\" tabindex=\"-1\"><\/a>`;\n\n    return `\n    <article class=\"snl-featured\" id=\"snl-newsletter-0\" aria-label=\"Current newsletter: ${myr(item)}\">\n      ${overlayLink}\n\n      <!-- screenshot panel -->\n      <div class=\"snl-preview-panel\">\n        <div class=\"snl-preview-badge\">\n          ${item.spotlight || \"SPARKL SPOTLIGHT\"}\n        <\/div>\n        <div class=\"snl-browser\">\n          ${browserHTML(item, { maxH: 440 })}\n        <\/div>\n      <\/div>\n\n      <!-- text panel -->\n      <div class=\"snl-text-panel\">\n        <div>\n          <div class=\"snl-tag-row\">\n            <span class=\"snl-tag-label\">Current Newsletter<\/span>\n            <span class=\"snl-tag-badge\">LATEST<\/span>\n          <\/div>\n          <h2 class=\"snl-issue-title\">${item.title}<\/h2>\n          ${item.description ? `<p class=\"snl-issue-desc\">${item.description}<\/p>` : \"\"}\n          ${ctaHTML(item, \"Read Newsletter\")}\n        <\/div>\n        <div class=\"snl-date-row\">\n          <span class=\"snl-date-month\">${item.month}<\/span>\n          <span class=\"snl-date-year\">${item.year}<\/span>\n        <\/div>\n      <\/div>\n\n    <\/article>`;\n  }\n\n  \/* \u2550\u2550 Render previous \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n  function renderPrevious(item, i) {\n    const n = pad(i + 1);\n    const target = (item.url && item.url !== \"#\") ? 'target=\"_blank\" rel=\"noopener noreferrer\"' : '';\n    const href = (item.url && item.url !== \"#\") ? item.url : '#';\n    const overlayLink = `<a class=\"snl-card-link\" href=\"${href}\" ${target} aria-hidden=\"true\" tabindex=\"-1\"><\/a>`;\n\n    const actionEl = `\n      <a href=\"${href}\" class=\"snl-arc-cta-link\" ${target}\n         onclick=\"event.stopPropagation();\">\n        <span class=\"snl-arc-circle\" aria-hidden=\"true\">\u2197<\/span>\n        Read\n      <\/a>`;\n\n    return `\n    <article class=\"snl-archive-row\" id=\"snl-newsletter-${i + 1}\"\n       aria-label=\"Newsletter ${n}: ${myr(item)}\">\n      ${overlayLink}\n\n      <!-- mini screenshot -->\n      <div class=\"snl-arc-shot\">\n        <div class=\"snl-mini-browser\">\n          ${browserHTML(item, {\n            barCls:    \"snl-mini-bar\",\n            dotsCls:   \"snl-mini-dots\",\n            urlCls:    \"snl-mini-url\",\n            screenCls: \"snl-mini-screen\",\n            placeCls:  \"snl-mini-placeholder\",\n            maxH:      230\n          })}\n        <\/div>\n      <\/div>\n\n      <!-- text -->\n      <div class=\"snl-arc-text\">\n        <div class=\"snl-arc-top\">\n          <div class=\"snl-arc-meta\">\n            <span class=\"snl-arc-num\">${n}<\/span>\n            <span class=\"snl-arc-sep\" aria-hidden=\"true\"><\/span>\n            <span class=\"snl-arc-date\">${myr(item)}<\/span>\n          <\/div>\n          <h2 class=\"snl-arc-title\">${item.title}<\/h2>\n        <\/div>\n        ${actionEl}\n      <\/div>\n\n    <\/article>`;\n  }\n\n  \/* \u2550\u2550 Build DOM \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n  const issuesEl = document.getElementById(\"snlIssues\");\n  const current  = newsletters[0];\n  const previous = newsletters.slice(1);\n  let html = \"\";\n\n  if (current) html += renderCurrent(current);\n\n  if (previous.length) {\n    html += `\n      <div class=\"snl-section-head\" id=\"snlPreviousStart\">\n        <span class=\"snl-section-rule\" aria-hidden=\"true\"><\/span>\n        <span class=\"snl-section-label\">Previous Newsletters<\/span>\n        <span class=\"snl-section-rule\" aria-hidden=\"true\"><\/span>\n      <\/div>\n      <div class=\"snl-archive-list\">\n        ${previous.map((it, i) => renderPrevious(it, i)).join(\"\")}\n      <\/div>`;\n  }\n\n  issuesEl.innerHTML = html;\n\n  \/* \u2550\u2550 Index links \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n  const indexLinks = document.getElementById(\"snlIndexLinks\");\n\n  newsletters.slice(0, 2).forEach((item, i) => {\n    const a = document.createElement(\"a\");\n    a.href = `#snl-newsletter-${i}`;\n    a.className = \"snl-index-link\";\n    a.dataset.target = `snl-newsletter-${i}`;\n    a.innerHTML = `\n      <span class=\"snl-index-num\">${pad(i + 1)}<\/span>\n      <span class=\"snl-index-month\">${item.month}<\/span>\n      <span class=\"snl-index-year\">${item.year}<\/span>\n      ${i === 0 ? '<span class=\"snl-current-dot\">Current<\/span>' : \"\"}`;\n    indexLinks.appendChild(a);\n  });\n\n  \/* \u2550\u2550 More button \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n  const moreBtn = document.getElementById(\"snlMoreBtn\");\n  if (newsletters.length > 2) moreBtn.classList.add(\"visible\");\n\n  \/* \u2550\u2550 Highlight \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n  let hlTimer = null;\n\n  function highlight(el) {\n    document.querySelectorAll(\".snl-selected\").forEach(e => e.classList.remove(\"snl-selected\"));\n    if (hlTimer) clearTimeout(hlTimer);\n    el.classList.remove(\"snl-selected\");\n    void el.offsetWidth; \/\/ reflow\n    el.classList.add(\"snl-selected\");\n    hlTimer = setTimeout(() => el.classList.remove(\"snl-selected\"), 2700);\n  }\n\n  function scrollTo(id) {\n    const el = document.getElementById(id);\n    if (!el) return;\n    el.scrollIntoView({ behavior: \"smooth\", block: \"start\" });\n    setTimeout(() => highlight(el), 650);\n  }\n\n  \/* \u2550\u2550 Wire clicks (index strip only \u2014 cards are now native <a> tags) \u2550\u2550\u2550\u2550\u2550 *\/\n  document.querySelectorAll(\"[data-target]\").forEach(link => {\n    link.addEventListener(\"click\", e => {\n      e.preventDefault();\n      scrollTo(link.dataset.target);\n    });\n  });\n\n  moreBtn.addEventListener(\"click\", () => {\n    if (newsletters.length <= 2) return;\n    scrollTo(\"snl-newsletter-2\");\n  });\n\n})();\n<\/script>\n\n    \n","protected":false},"excerpt":{"rendered":"","protected":false},"author":8,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-past-papers.php","meta":{"footnotes":""},"class_list":["post-24382","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.1.1 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>The Spark Newsletter Archive - Sparkl<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/sparkl.me\/blog\/the-spark-newsletters\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"The Spark Newsletter Archive - Sparkl\" \/>\n<meta property=\"og:url\" content=\"https:\/\/sparkl.me\/blog\/the-spark-newsletters\/\" \/>\n<meta property=\"og:site_name\" content=\"Sparkl\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/people\/Sparkl-Edventure\/61563873962227\/\" \/>\n<meta property=\"article:modified_time\" content=\"2026-08-25T11:11:19+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/sparkl.me\/blog\/the-spark-newsletters\/\",\"url\":\"https:\/\/sparkl.me\/blog\/the-spark-newsletters\/\",\"name\":\"The Spark Newsletter Archive - Sparkl\",\"isPartOf\":{\"@id\":\"https:\/\/sparkl.me\/blog\/#website\"},\"datePublished\":\"2026-08-25T11:04:59+00:00\",\"dateModified\":\"2026-08-25T11:11:19+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/sparkl.me\/blog\/the-spark-newsletters\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/sparkl.me\/blog\/the-spark-newsletters\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/sparkl.me\/blog\/the-spark-newsletters\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/sparkl.me\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"The Spark Newsletter Archive\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/sparkl.me\/blog\/#website\",\"url\":\"https:\/\/sparkl.me\/blog\/\",\"name\":\"Sparkl\",\"description\":\"Learning Made Personal\",\"publisher\":{\"@id\":\"https:\/\/sparkl.me\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/sparkl.me\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/sparkl.me\/blog\/#organization\",\"name\":\"Sparkl\",\"url\":\"https:\/\/sparkl.me\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/sparkl.me\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/sparkl.me\/blog\/wp-content\/uploads\/2025\/06\/CourseSparkl-ColourBlack-Height40px.svg\",\"contentUrl\":\"https:\/\/sparkl.me\/blog\/wp-content\/uploads\/2025\/06\/CourseSparkl-ColourBlack-Height40px.svg\",\"width\":154,\"height\":40,\"caption\":\"Sparkl\"},\"image\":{\"@id\":\"https:\/\/sparkl.me\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/people\/Sparkl-Edventure\/61563873962227\/\",\"https:\/\/www.youtube.com\/@SparklEdventure\",\"https:\/\/www.instagram.com\/sparkledventure\",\"https:\/\/www.linkedin.com\/company\/sparkl-edventure\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"The Spark Newsletter Archive - Sparkl","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/sparkl.me\/blog\/the-spark-newsletters\/","og_locale":"en_US","og_type":"article","og_title":"The Spark Newsletter Archive - Sparkl","og_url":"https:\/\/sparkl.me\/blog\/the-spark-newsletters\/","og_site_name":"Sparkl","article_publisher":"https:\/\/www.facebook.com\/people\/Sparkl-Edventure\/61563873962227\/","article_modified_time":"2026-08-25T11:11:19+00:00","twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/sparkl.me\/blog\/the-spark-newsletters\/","url":"https:\/\/sparkl.me\/blog\/the-spark-newsletters\/","name":"The Spark Newsletter Archive - Sparkl","isPartOf":{"@id":"https:\/\/sparkl.me\/blog\/#website"},"datePublished":"2026-08-25T11:04:59+00:00","dateModified":"2026-08-25T11:11:19+00:00","breadcrumb":{"@id":"https:\/\/sparkl.me\/blog\/the-spark-newsletters\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/sparkl.me\/blog\/the-spark-newsletters\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/sparkl.me\/blog\/the-spark-newsletters\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/sparkl.me\/blog\/"},{"@type":"ListItem","position":2,"name":"The Spark Newsletter Archive"}]},{"@type":"WebSite","@id":"https:\/\/sparkl.me\/blog\/#website","url":"https:\/\/sparkl.me\/blog\/","name":"Sparkl","description":"Learning Made Personal","publisher":{"@id":"https:\/\/sparkl.me\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/sparkl.me\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/sparkl.me\/blog\/#organization","name":"Sparkl","url":"https:\/\/sparkl.me\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/sparkl.me\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/sparkl.me\/blog\/wp-content\/uploads\/2025\/06\/CourseSparkl-ColourBlack-Height40px.svg","contentUrl":"https:\/\/sparkl.me\/blog\/wp-content\/uploads\/2025\/06\/CourseSparkl-ColourBlack-Height40px.svg","width":154,"height":40,"caption":"Sparkl"},"image":{"@id":"https:\/\/sparkl.me\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/people\/Sparkl-Edventure\/61563873962227\/","https:\/\/www.youtube.com\/@SparklEdventure","https:\/\/www.instagram.com\/sparkledventure","https:\/\/www.linkedin.com\/company\/sparkl-edventure"]}]}},"_links":{"self":[{"href":"https:\/\/sparkl.me\/blog\/wp-json\/wp\/v2\/pages\/24382","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sparkl.me\/blog\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/sparkl.me\/blog\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/sparkl.me\/blog\/wp-json\/wp\/v2\/users\/8"}],"replies":[{"embeddable":true,"href":"https:\/\/sparkl.me\/blog\/wp-json\/wp\/v2\/comments?post=24382"}],"version-history":[{"count":2,"href":"https:\/\/sparkl.me\/blog\/wp-json\/wp\/v2\/pages\/24382\/revisions"}],"predecessor-version":[{"id":24392,"href":"https:\/\/sparkl.me\/blog\/wp-json\/wp\/v2\/pages\/24382\/revisions\/24392"}],"wp:attachment":[{"href":"https:\/\/sparkl.me\/blog\/wp-json\/wp\/v2\/media?parent=24382"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}