/* CSS from ailearning-article.html */

  body.page-ailearning-article *, body.page-ailearning-article *::before, body.page-ailearning-article *::after{ box-sizing: border-box; margin: 0; padding: 0; }

  body.page-ailearning-article{
    --purple-dark:  #2d1778;
    --purple-mid:   #5b21b6;
    --purple-soft:  #a88bf8;
    --purple-light: #ede9fe;
    --yellow:       #f5c800;
    --yellow-dark:  #b38900;
    --text-dark:    #1a0f4e;
    --text-body:    #2e1f6e;
    --text-muted:   #6b5fa5;
    --white:        #ffffff;
    --bg-page:      #f3f0ff;
  }

  body.page-ailearning-article{
    font-family: 'Quicksand', sans-serif;
    background: var(--bg-page);
    color: var(--text-body);
    line-height: 1.75;
  }

  /* HEADER */
  body.page-ailearning-article .site-header{
    background: var(--purple-dark);
    padding: 14px 36px;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  body.page-ailearning-article .site-logo{ display: flex; align-items: center; gap: 10px; text-decoration: none; }
  body.page-ailearning-article .site-logo-icon{ font-size: 22px; }
  body.page-ailearning-article .site-logo-text{ color: #fff; font-size: 15px; font-weight: 700; }
  body.page-ailearning-article .site-logo-text span{ color: var(--yellow); }
  body.page-ailearning-article .site-nav{ display: flex; gap: 22px; }
  body.page-ailearning-article .site-nav a{ color: #d3c2ff; text-decoration: none; font-size: 12px; font-weight: 600; transition: color .2s; }
  body.page-ailearning-article .site-nav a:hover, body.page-ailearning-article .site-nav a.active{ color: var(--yellow); }

  /* ARTICLE WRAPPER */
  body.page-ailearning-article .article-outer{ max-width: 720px; margin: 0 auto; padding: 40px 24px 80px; }

  /* BYLINE */
  body.page-ailearning-article .byline-strip{ display: flex; align-items: center; gap: 12px; margin-bottom: 28px; }
  body.page-ailearning-article .byline-avatar{
    width: 42px; height: 42px; border-radius: 50%;
    background: var(--purple-mid);
    display: flex; align-items: center; justify-content: center;
    font-size: 18px; flex-shrink: 0;
  }
  body.page-ailearning-article .byline-name{ font-size: 13px; font-weight: 700; color: var(--purple-dark); }
  body.page-ailearning-article .byline-meta{ font-size: 11px; color: var(--text-muted); font-weight: 500; }
  body.page-ailearning-article .byline-badge{
    margin-left: auto;
    background: var(--yellow);
    color: var(--purple-dark);
    font-size: 10px; font-weight: 700;
    letter-spacing: .8px; text-transform: uppercase;
    padding: 4px 12px; border-radius: 20px;
  }

  /* HEADLINE */
  body.page-ailearning-article .article-headline{
    font-family: 'Lora', serif;
    font-size: clamp(26px, 5vw, 38px);
    font-weight: 600;
    color: var(--purple-dark);
    line-height: 1.22;
    margin-bottom: 14px;
  }
  body.page-ailearning-article .article-headline span{ color: var(--purple-soft); }
  body.page-ailearning-article .article-subheadline{
    font-family: 'Lora', serif;
    font-style: italic;
    font-size: 17px; font-weight: 400;
    color: var(--text-muted);
    line-height: 1.6;
    margin-bottom: 22px;
  }

  /* STAT CHIPS */
  body.page-ailearning-article .stats-row{ display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 30px; }
  body.page-ailearning-article .stat-chip{
    background: var(--purple-mid);
    color: #fff;
    border-radius: 20px;
    padding: 5px 13px;
    font-size: 12px; font-weight: 700;
  }

  /* HERO IMAGE */
  body.page-ailearning-article .hero-image{
    width: 100%; border-radius: 16px; overflow: hidden;
    margin-bottom: 10px;
    background: var(--purple-dark);
    height: 340px;
    display: flex; align-items: center; justify-content: center;
    position: relative;
  }
  body.page-ailearning-article .hero-image img{ width: 100%; height: 100%; object-fit: cover; border-radius: 16px; }
  body.page-ailearning-article .img-placeholder{ text-align: center; color: #d3c2ff; padding: 20px; }
  body.page-ailearning-article .img-placeholder .img-ico{ font-size: 44px; margin-bottom: 8px; }
  body.page-ailearning-article .img-placeholder p{ font-size: 12px; font-weight: 600; opacity: .8; }
  body.page-ailearning-article .image-caption{
    font-size: 12px; color: var(--text-muted); text-align: center;
    margin-bottom: 32px; font-style: italic;
  }

  /* ── STYLE 4 DIVIDER: outlined hearts + yellow stars on line ── */
  body.page-ailearning-article .divider-wrap{
    display: flex; align-items: center; gap: 12px;
    margin: 36px 0;
  }
  body.page-ailearning-article .divider-label{
    font-family: 'Lora', serif;
    font-style: italic;
    font-size: 13px; font-weight: 600;
    color: var(--purple-soft);
    white-space: nowrap;
  }
  body.page-ailearning-article .divider-svg{ flex: 1; display: block; height: 34px; overflow: visible; }

  /* INTRO BOX */
  body.page-ailearning-article .intro-box{
    background: var(--purple-dark);
    border-radius: 14px;
    padding: 20px 24px;
    margin-bottom: 32px;
    color: #e9d5ff;
    font-size: 14px; font-weight: 500; line-height: 1.8;
  }
  body.page-ailearning-article .intro-box .intro-hi{ color: var(--yellow); font-size: 15px; font-weight: 700; margin-bottom: 8px; }

  /* TOC BOX */
  body.page-ailearning-article .toc-box{
    background: var(--yellow);
    border-radius: 14px;
    padding: 20px 24px;
    margin-bottom: 36px;
  }
  body.page-ailearning-article .toc-title{
    font-size: 12px; font-weight: 700;
    letter-spacing: .8px; text-transform: uppercase;
    color: var(--purple-dark);
    margin-bottom: 12px;
  }
  body.page-ailearning-article .toc-box ul{ list-style: none; display: flex; flex-direction: column; gap: 8px; }
  body.page-ailearning-article .toc-box ul li{
    font-size: 13px; font-weight: 700;
    color: var(--purple-dark);
    padding-left: 20px; position: relative;
  }
  body.page-ailearning-article .toc-box ul li::before{
    content: "♥";
    position: absolute; left: 0;
    color: var(--purple-mid); font-size: 11px; top: 2px;
  }

  /* ARTICLE BODY */
  .article-body.page-ailearning-article h2{
    font-family: 'Lora', serif;
    font-size: 22px; font-weight: 600;
    color: var(--purple-dark);
    margin: 36px 0 14px; line-height: 1.3;
  }
  .article-body.page-ailearning-article h3{
    font-size: 17px; font-weight: 700;
    color: var(--purple-mid);
    margin: 28px 0 10px;
  }
  .article-body.page-ailearning-article p{
    font-size: 15px; color: var(--text-body);
    margin-bottom: 18px; line-height: 1.85;
  }
  .article-body.page-ailearning-article strong{ color: var(--purple-dark); font-weight: 700; }

  /* PULL QUOTE */
  body.page-ailearning-article .pull-quote{
    background: var(--purple-dark);
    border-left: 5px solid var(--yellow);
    border-radius: 0 14px 14px 0;
    padding: 18px 24px;
    margin: 28px 0;
    font-family: 'Lora', serif;
    font-style: italic;
    font-size: 17px;
    color: #fff;
    line-height: 1.65;
  }

  /* INLINE IMAGE */
  body.page-ailearning-article .inline-image{
    width: 100%; border-radius: 14px; overflow: hidden;
    margin: 28px 0 8px;
    background: var(--purple-mid);
    height: 220px;
    display: flex; align-items: center; justify-content: center;
  }
  body.page-ailearning-article .inline-image img{ width: 100%; height: 100%; object-fit: cover; border-radius: 14px; }

  /* VIDEO BLOCK */
  body.page-ailearning-article .video-block{
    background: var(--purple-dark);
    border: 2px solid var(--yellow);
    border-radius: 14px;
    padding: 20px 24px;
    margin: 28px 0;
    display: flex; align-items: center; gap: 16px;
  }
  body.page-ailearning-article .video-play{
    width: 50px; height: 50px; flex-shrink: 0;
    background: var(--yellow);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 20px; color: var(--purple-dark);
  }
  body.page-ailearning-article .video-label{ font-size: 10px; text-transform: uppercase; letter-spacing: 1px; color: #d3c2ff; font-weight: 700; margin-bottom: 4px; }
  body.page-ailearning-article .video-title{ font-size: 14px; font-weight: 700; color: #fff; margin-bottom: 4px; line-height: 1.4; }
  body.page-ailearning-article .video-link{ font-size: 12px; color: var(--yellow); font-weight: 600; text-decoration: none; }
  body.page-ailearning-article .video-link:hover{ text-decoration: underline; }

  /* STEP CARDS */
  body.page-ailearning-article .steps-list{ display: flex; flex-direction: column; gap: 14px; margin: 24px 0 32px; }
  body.page-ailearning-article .step-card{
    background: #fff;
    border: 2px solid var(--purple-mid);
    border-radius: 14px;
    padding: 16px 20px;
    display: flex; gap: 16px; align-items: flex-start;
  }
  body.page-ailearning-article .step-num{
    width: 36px; height: 36px; flex-shrink: 0;
    background: var(--yellow);
    color: var(--purple-dark);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 15px; font-weight: 700;
  }
  body.page-ailearning-article .step-content h4{ font-size: 14px; font-weight: 700; color: var(--purple-dark); margin-bottom: 4px; }
  body.page-ailearning-article .step-content p{ font-size: 13px; color: var(--text-muted); margin: 0; line-height: 1.65; }

  /* PROFILE CARDS */
  body.page-ailearning-article .profiles-grid{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 12px; margin: 24px 0 32px;
  }
  body.page-ailearning-article .profile-card{
    background: var(--purple-dark);
    border-radius: 14px;
    padding: 18px 14px;
    text-align: center;
  }
  body.page-ailearning-article .profile-avatar{
    width: 48px; height: 48px; border-radius: 50%;
    margin: 0 auto 10px;
    background: var(--yellow);
    display: flex; align-items: center; justify-content: center;
    font-size: 20px; font-weight: 700;
    color: var(--purple-dark);
  }
  body.page-ailearning-article .profile-name{ font-size: 13px; font-weight: 700; color: var(--yellow); margin-bottom: 2px; }
  body.page-ailearning-article .profile-sub{ font-size: 11px; color: #d3c2ff; font-weight: 500; margin-bottom: 8px; }
  body.page-ailearning-article .profile-badge{
    display: inline-block;
    background: var(--purple-mid);
    color: #fff;
    font-size: 10px; font-weight: 700;
    padding: 3px 10px; border-radius: 12px;
  }

  /* PROMPT BOX */
  body.page-ailearning-article .prompt-box{
    background: var(--purple-dark);
    border: 2px solid var(--yellow);
    border-radius: 16px;
    padding: 24px 26px;
    margin: 28px 0;
    position: relative;
  }
  body.page-ailearning-article .prompt-label{ font-size: 10px; text-transform: uppercase; letter-spacing: 1px; color: var(--yellow); font-weight: 700; margin-bottom: 12px; }
  body.page-ailearning-article .prompt-text{ font-family: monospace; font-size: 13px; color: #e9d5ff; line-height: 1.8; white-space: pre-wrap; }
  body.page-ailearning-article .prompt-copy{
    position: absolute; top: 16px; right: 16px;
    background: var(--yellow); border: none; border-radius: 8px;
    padding: 6px 12px; font-family: 'Quicksand', sans-serif;
    font-size: 11px; font-weight: 700; color: var(--purple-dark);
    cursor: pointer;
  }
  body.page-ailearning-article .prompt-copy:hover{ background: #ffd700; }

  /* CTA BOX */
  body.page-ailearning-article .cta-box{
    background: var(--purple-dark);
    border: 3px solid var(--yellow);
    border-radius: 16px;
    padding: 28px;
    text-align: center;
    margin: 36px 0;
  }
  body.page-ailearning-article .cta-box .cta-emoji{ font-size: 30px; margin-bottom: 10px; }
  body.page-ailearning-article .cta-box h3{ font-family: 'Lora', serif; font-size: 20px; font-weight: 600; color: var(--yellow); margin-bottom: 10px; }
  body.page-ailearning-article .cta-box p{ font-size: 13px; color: #d3c2ff; margin-bottom: 18px; }
  body.page-ailearning-article .cta-btn{
    display: inline-block;
    background: var(--yellow);
    color: var(--purple-dark);
    text-decoration: none;
    padding: 13px 30px;
    border-radius: 30px;
    font-size: 14px; font-weight: 700;
    transition: background .2s;
  }
  body.page-ailearning-article .cta-btn:hover{ background: #ffd700; }

  /* SIGN OFF */
  body.page-ailearning-article .signoff{
    font-family: 'Lora', serif;
    font-style: italic;
    font-size: 16px;
    color: var(--purple-dark);
    line-height: 1.8;
    margin-top: 24px;
  }
  body.page-ailearning-article .signoff strong{ font-style: normal; color: var(--purple-mid); }

  /* FOOTER TAGS */
  body.page-ailearning-article .article-footer{
    border-top: 2px solid var(--purple-mid);
    margin-top: 48px; padding-top: 24px;
    display: flex; justify-content: space-between;
    align-items: center; flex-wrap: wrap; gap: 12px;
  }
  body.page-ailearning-article .footer-tags{ display: flex; gap: 8px; flex-wrap: wrap; }
  body.page-ailearning-article .footer-tag{
    background: var(--purple-mid);
    color: #fff;
    font-size: 11px; font-weight: 700;
    padding: 4px 12px; border-radius: 12px;
  }
  body.page-ailearning-article .footer-share{ display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--text-muted); font-weight: 600; }
  body.page-ailearning-article .share-btn{
    background: var(--yellow); border: none; border-radius: 8px;
    padding: 5px 12px; font-size: 11px; font-weight: 700;
    color: var(--purple-dark); cursor: pointer; font-family: 'Quicksand', sans-serif;
  }
  body.page-ailearning-article .share-btn:hover{ background: #ffd700; }

  @media (max-width: 600px) {
    body.page-ailearning-article .site-nav{ display: none; }
    body.page-ailearning-article .profiles-grid{ grid-template-columns: 1fr 1fr; }
    body.page-ailearning-article .article-footer{ flex-direction: column; align-items: flex-start; }
  }


/* CSS from aria_storybook.html */

  body.page-aria_storybook *{margin:0;padding:0;box-sizing:border-box}
  body.page-aria_storybook{
    --lavender:#C8B8E8;
    --lavender-light:#EDE6F8;
    --lavender-mid:#B09DD6;
    --lavender-deep:#7B5EA7;
    --lavender-dark:#4B3580;
    --yellow:#FFD700;
    --yellow-light:#FFF8DC;
    --yellow-warm:#FFC107;
    --yellow-soft:#FFFACD;
    --white:#FFFFFF;
    --text-dark:#2D1B4E;
    --text-mid:#5A4080;
    --text-light:#8B6CAE;
    --bg:#F5F0FF;
    --card-bg:#FEFCFF;
    --accent-green:#7CC97C;
    --accent-blue:#7BB8E8;
    --accent-coral:#F0907A;
  }
  body.page-aria_storybook{
    font-family:'Quicksand',sans-serif;
    background:var(--bg);
    color:var(--text-dark);
    min-height:100vh;
    overflow-x:hidden;
  }

  /* ===== COVER PAGE ===== */
  body.page-aria_storybook #cover{
    min-height:100vh;
    background:linear-gradient(160deg,#2D1B4E 0%,#4B3580 45%,#7B5EA7 100%);
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    text-align:center;padding:2rem;position:relative;overflow:hidden;
  }
  body.page-aria_storybook .stars{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}
  body.page-aria_storybook .star{position:absolute;border-radius:50%;background:#FFD700;animation:twinkle 2s infinite alternate}
  @keyframes twinkle{0%{opacity:.3;transform:scale(1)}100%{opacity:1;transform:scale(1.3)}}
  body.page-aria_storybook .cover-robot{font-size:7rem;margin-bottom:1rem;animation:float 3s ease-in-out infinite}
  @keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}
  body.page-aria_storybook .cover-title{
    font-size:clamp(2rem,5vw,3.5rem);font-weight:700;
    color:#FFD700;text-shadow:0 0 30px rgba(255,215,0,.4);
    line-height:1.2;margin-bottom:.5rem;
  }
  body.page-aria_storybook .cover-subtitle{
    font-size:clamp(1rem,2.5vw,1.4rem);color:#EDE6F8;
    margin-bottom:2rem;font-weight:500;
  }
  body.page-aria_storybook .cover-tags{display:flex;gap:.75rem;flex-wrap:wrap;justify-content:center;margin-bottom:2.5rem}
  body.page-aria_storybook .tag{
    background:rgba(255,215,0,.15);border:1px solid rgba(255,215,0,.4);
    color:#FFD700;padding:.35rem 1rem;border-radius:20px;font-size:.85rem;font-weight:600;
  }
  body.page-aria_storybook .btn-start{
    background:#FFD700;color:#2D1B4E;border:none;padding:.9rem 2.5rem;
    border-radius:50px;font-size:1.1rem;font-weight:700;cursor:pointer;
    font-family:'Quicksand',sans-serif;
    box-shadow:0 4px 20px rgba(255,215,0,.4);
    transition:transform .2s,box-shadow .2s;
  }
  body.page-aria_storybook .btn-start:hover{transform:translateY(-3px);box-shadow:0 8px 30px rgba(255,215,0,.5)}

  /* ===== CHAPTERS ===== */
  body.page-aria_storybook .page{
    display:none;min-height:100vh;
    padding:2rem 1.5rem 4rem;max-width:860px;margin:0 auto;
  }
  body.page-aria_storybook .page.active{display:block}

  /* progress bar */
  body.page-aria_storybook #progress-bar{
    position:fixed;top:0;left:0;height:4px;
    background:linear-gradient(90deg,var(--lavender-deep),var(--yellow));
    transition:width .4s;z-index:100;
  }

  /* top nav */
  body.page-aria_storybook .top-nav{
    position:fixed;top:4px;left:0;right:0;
    display:flex;justify-content:space-between;align-items:center;
    padding:.5rem 1.5rem;z-index:99;
    background:rgba(245,240,255,.92);backdrop-filter:blur(8px);
    border-bottom:1px solid var(--lavender);
  }
  body.page-aria_storybook .nav-title{font-weight:700;font-size:.85rem;color:var(--lavender-dark)}
  body.page-aria_storybook .nav-chapter{font-size:.8rem;color:var(--text-light)}

  /* chapter header */
  body.page-aria_storybook .chapter-label{
    display:inline-block;
    background:var(--lavender-deep);color:#fff;
    font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
    padding:.3rem 1rem;border-radius:20px;margin-bottom:.75rem;margin-top:3.5rem;
  }
  body.page-aria_storybook .chapter-title{
    font-size:clamp(1.6rem,4vw,2.4rem);font-weight:700;
    color:var(--lavender-dark);line-height:1.25;margin-bottom:.5rem;
  }
  body.page-aria_storybook .chapter-emoji{font-size:2.5rem;margin-bottom:.5rem;display:block}
  body.page-aria_storybook .divider{
    height:3px;width:60px;
    background:linear-gradient(90deg,var(--lavender-deep),var(--yellow));
    border-radius:2px;margin:.75rem 0 1.5rem;
  }

  /* illustration boxes */
  body.page-aria_storybook .illustration{
    width:100%;border-radius:20px;
    padding:2rem;margin:1.5rem 0;
    display:flex;align-items:center;justify-content:center;
    flex-direction:column;gap:.75rem;
    background:linear-gradient(135deg,var(--lavender-light),var(--yellow-soft));
    border:2px solid var(--lavender);
    min-height:160px;
  }
  body.page-aria_storybook .illus-big{font-size:4rem}
  body.page-aria_storybook .illus-row{display:flex;gap:1rem;align-items:center;flex-wrap:wrap;justify-content:center}
  body.page-aria_storybook .illus-caption{font-size:.85rem;color:var(--text-light);text-align:center;font-weight:600}

  /* story text */
  body.page-aria_storybook .story-p{
    font-size:1.05rem;line-height:1.85;color:var(--text-dark);
    margin-bottom:1.1rem;
  }
  body.page-aria_storybook .story-p strong{color:var(--lavender-dark)}

  /* dialogue bubbles */
  body.page-aria_storybook .dialogue{
    border-left:4px solid var(--lavender-deep);
    background:var(--card-bg);
    padding:1rem 1.25rem;border-radius:0 14px 14px 0;
    margin:1.25rem 0;
  }
  body.page-aria_storybook .dialogue.aria{
    border-left-color:var(--yellow-warm);
    background:var(--yellow-soft);
  }
  body.page-aria_storybook .dialogue .speaker{
    font-size:.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
    color:var(--lavender-dark);margin-bottom:.35rem;
  }
  body.page-aria_storybook .dialogue.aria .speaker{color:#B8860B}
  body.page-aria_storybook .dialogue .text{font-size:1rem;color:var(--text-dark);line-height:1.7;font-style:italic}

  /* fact cards */
  body.page-aria_storybook .fact-card{
    background:var(--lavender-light);border:1.5px solid var(--lavender);
    border-radius:16px;padding:1rem 1.25rem;margin:.75rem 0;
    display:flex;align-items:flex-start;gap:.75rem;
  }
  body.page-aria_storybook .fact-icon{font-size:1.5rem;flex-shrink:0}
  body.page-aria_storybook .fact-text{font-size:.95rem;color:var(--text-dark);line-height:1.6}
  body.page-aria_storybook .fact-text strong{color:var(--lavender-dark)}

  /* scene setting */
  body.page-aria_storybook .scene-box{
    background:var(--lavender-dark);color:#EDE6F8;
    border-radius:16px;padding:1.25rem 1.5rem;
    margin:1.25rem 0;font-size:.95rem;line-height:1.7;
    font-style:italic;
  }
  body.page-aria_storybook .scene-box::before{content:'📍 Scene: ';font-style:normal;font-weight:700;color:var(--yellow)}

  /* wow moment */
  body.page-aria_storybook .wow-box{
    background:linear-gradient(135deg,#4B3580,#7B5EA7);
    color:#fff;border-radius:20px;padding:1.5rem;margin:1.5rem 0;
    border:2px solid var(--yellow);
    position:relative;overflow:hidden;
  }
  body.page-aria_storybook .wow-box::before{
    content:'✨ WOW MOMENT';
    position:absolute;top:.6rem;right:.8rem;
    font-size:.65rem;font-weight:700;letter-spacing:.1em;
    color:var(--yellow);opacity:.8;
  }
  body.page-aria_storybook .wow-box p{font-size:1rem;line-height:1.75}

  /* quiz */
  body.page-aria_storybook .quiz-section{
    background:var(--card-bg);border:2px solid var(--lavender);
    border-radius:20px;padding:1.5rem;margin:1.5rem 0;
  }
  body.page-aria_storybook .quiz-title{font-size:1.1rem;font-weight:700;color:var(--lavender-dark);margin-bottom:1rem}
  body.page-aria_storybook .q-item{margin-bottom:1rem}
  body.page-aria_storybook .q-text{font-size:.95rem;font-weight:600;color:var(--text-dark);margin-bottom:.5rem}
  body.page-aria_storybook .q-opt{
    display:block;padding:.5rem 1rem;margin:.25rem 0;
    border:1.5px solid var(--lavender);border-radius:10px;
    cursor:pointer;font-size:.9rem;font-family:'Quicksand',sans-serif;
    background:#fff;color:var(--text-dark);text-align:left;
    transition:background .15s,border-color .15s;
  }
  body.page-aria_storybook .q-opt:hover{background:var(--lavender-light);border-color:var(--lavender-mid)}
  body.page-aria_storybook .q-opt.correct{background:#e8f8e8;border-color:var(--accent-green);color:#1a5c1a}
  body.page-aria_storybook .q-opt.wrong{background:#fde8e8;border-color:#e88;color:#7a1a1a}
  body.page-aria_storybook .quiz-score{font-size:1rem;font-weight:700;color:var(--lavender-dark);margin-top:.75rem}

  /* CTA page */
  body.page-aria_storybook .cta-grid{
    display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
    gap:1rem;margin:1.5rem 0;
  }
  body.page-aria_storybook .cta-card{
    background:var(--card-bg);border:1.5px solid var(--lavender);
    border-radius:16px;padding:1.25rem;text-align:center;
  }
  body.page-aria_storybook .cta-card .c-icon{font-size:2rem;margin-bottom:.5rem}
  body.page-aria_storybook .cta-card h4{font-size:.95rem;font-weight:700;color:var(--lavender-dark);margin-bottom:.4rem}
  body.page-aria_storybook .cta-card p{font-size:.85rem;color:var(--text-mid);line-height:1.5}

  /* navigation buttons */
  body.page-aria_storybook .nav-btns{
    display:flex;justify-content:space-between;align-items:center;
    margin-top:3rem;padding-top:1.5rem;
    border-top:1.5px solid var(--lavender);
  }
  body.page-aria_storybook .btn-nav{
    background:var(--lavender-deep);color:#fff;border:none;
    padding:.7rem 1.5rem;border-radius:50px;font-size:.9rem;font-weight:700;
    cursor:pointer;font-family:'Quicksand',sans-serif;
    transition:background .2s,transform .15s;display:flex;align-items:center;gap:.4rem;
  }
  body.page-aria_storybook .btn-nav:hover{background:var(--lavender-dark);transform:translateY(-2px)}
  body.page-aria_storybook .btn-nav.next{background:linear-gradient(90deg,var(--lavender-deep),var(--yellow-warm));color:#fff}
  body.page-aria_storybook .btn-nav:disabled{opacity:.4;cursor:not-allowed;transform:none}
  body.page-aria_storybook .chapter-dots{display:flex;gap:.4rem}
  body.page-aria_storybook .dot{
    width:9px;height:9px;border-radius:50%;
    background:var(--lavender);cursor:pointer;
    transition:background .2s,transform .2s;
  }
  body.page-aria_storybook .dot.active{background:var(--lavender-dark);transform:scale(1.3)}

  /* glossary */
  body.page-aria_storybook .glossary-term{
    background:var(--yellow-soft);border-left:3px solid var(--yellow-warm);
    border-radius:0 10px 10px 0;padding:.6rem 1rem;margin:.5rem 0;
  }
  body.page-aria_storybook .glossary-term strong{color:#B8860B}

  /* character card */
  body.page-aria_storybook .char-card{
    display:flex;gap:1rem;align-items:flex-start;
    background:var(--lavender-light);border-radius:16px;padding:1rem;margin:.75rem 0;
  }
  body.page-aria_storybook .char-avatar{
    width:64px;height:64px;border-radius:50%;
    background:var(--lavender-deep);display:flex;
    align-items:center;justify-content:center;
    font-size:2rem;flex-shrink:0;
  }
  body.page-aria_storybook .char-info h4{font-size:1rem;font-weight:700;color:var(--lavender-dark)}
  body.page-aria_storybook .char-info p{font-size:.85rem;color:var(--text-mid);line-height:1.5;margin-top:.2rem}

  /* responsive */
  @media(max-width:600px){
    body.page-aria_storybook .cover-robot{font-size:5rem}
    body.page-aria_storybook .story-p{font-size:.97rem}
    body.page-aria_storybook .chapter-title{font-size:1.5rem}
  }


/* CSS from student_ai_book_prompt_generator.html */

  @import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@400;body.page-student_ai_book_prompt_generator 500;600;700&display=swap');

  .sab-wrap{
    font-family: 'Quicksand', sans-serif;
    background: #f3f0ff;
    border-radius: 18px;
    overflow: hidden;
    max-width: 680px;
    margin: 0 auto;
  }

  body.page-student_ai_book_prompt_generator .sab-header{
    background: #4c2a8a;
    padding: 24px 28px 20px;
    position: relative;
  }

  body.page-student_ai_book_prompt_generator .sab-badge{
    display: inline-block;
    background: #f5d84e;
    color: #2d1a6e;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 20px;
    margin-bottom: 10px;
  }

  body.page-student_ai_book_prompt_generator .sab-title{
    color: #fff;
    font-size: 26px;
    font-weight: 700;
    line-height: 1.2;
    margin: 0 0 4px;
  }

  body.page-student_ai_book_prompt_generator .sab-title span{
    color: #f5d84e;
  }

  body.page-student_ai_book_prompt_generator .sab-sub{
    color: #c9b8f5;
    font-size: 12px;
    font-weight: 500;
    margin: 6px 0 0;
  }

  body.page-student_ai_book_prompt_generator .sab-rocket{
    position: absolute;
    top: 20px;
    right: 24px;
    font-size: 28px;
    opacity: 0.85;
  }

  body.page-student_ai_book_prompt_generator .sab-intro{
    background: #fff;
    border-left: 3px solid #a78bfa;
    margin: 20px 20px 0;
    padding: 12px 16px;
    border-radius: 0 10px 10px 0;
    font-size: 13px;
    color: #5b4a8a;
    font-weight: 500;
    line-height: 1.6;
  }

  body.page-student_ai_book_prompt_generator .sab-form{
    padding: 16px 20px 24px;
  }

  body.page-student_ai_book_prompt_generator .sab-section{
    margin-bottom: 20px;
  }

  body.page-student_ai_book_prompt_generator .sab-label{
    display: block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    color: #6d4fc2;
    margin-bottom: 6px;
  }

  body.page-student_ai_book_prompt_generator .sab-label span{
    color: #e74c90;
  }

  body.page-student_ai_book_prompt_generator .sab-hint{
    font-size: 11px;
    color: #9c8bc4;
    font-weight: 500;
    margin-bottom: 7px;
    display: block;
    font-style: italic;
    text-transform: none;
    letter-spacing: 0;
  }

  body.page-student_ai_book_prompt_generator .sab-input{
    width: 100%;
    border: 1.5px solid #d0bcf5;
    border-radius: 10px;
    padding: 10px 14px;
    font-family: 'Quicksand', sans-serif;
    font-size: 13px;
    color: #3b2a6e;
    background: #faf8ff;
    box-sizing: border-box;
    outline: none;
    transition: border 0.2s;
  }

  body.page-student_ai_book_prompt_generator .sab-input:focus{
    border-color: #a88bf8;
    background: #fff;
  }

  body.page-student_ai_book_prompt_generator .sab-input::placeholder{
    color: #b8aad6;
  }

  body.page-student_ai_book_prompt_generator .sab-pills{
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 4px;
  }

  body.page-student_ai_book_prompt_generator .sab-pill{
    background: #ede8ff;
    border: 1.5px solid #c4b0f0;
    color: #5534a5;
    border-radius: 20px;
    padding: 6px 13px;
    font-size: 12px;
    font-weight: 600;
    font-family: 'Quicksand', sans-serif;
    cursor: pointer;
    transition: all 0.18s;
    user-select: none;
  }

  body.page-student_ai_book_prompt_generator .sab-pill:hover{
    background: #d8ccff;
    border-color: #a88bf8;
  }

  body.page-student_ai_book_prompt_generator .sab-pill.active{
    background: #6d28d9;
    border-color: #6d28d9;
    color: #fff;
  }

  body.page-student_ai_book_prompt_generator .sab-pill.yellow.active{
    background: #f5d84e;
    border-color: #d4a000;
    color: #3b2200;
  }

  body.page-student_ai_book_prompt_generator .sab-pill.yellow:hover{
    background: #fff2a8;
    border-color: #d4a000;
  }

  body.page-student_ai_book_prompt_generator .sab-divider{
    height: 1px;
    background: #e4d9ff;
    margin: 4px 0 20px;
  }

  body.page-student_ai_book_prompt_generator .sab-cta{
    background: #6d28d9;
    color: #fff;
    border: none;
    border-radius: 12px;
    padding: 16px 0;
    width: 100%;
    font-family: 'Quicksand', sans-serif;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s, transform 0.1s;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 8px;
  }

  body.page-student_ai_book_prompt_generator .sab-cta:hover{ background: #5b21b6; }
  body.page-student_ai_book_prompt_generator .sab-cta:active{ transform: scale(0.98); }

  body.page-student_ai_book_prompt_generator .sab-output{
    display: none;
    background: #fff;
    border: 2px solid #a78bfa;
    border-radius: 14px;
    padding: 18px 20px;
    margin-top: 16px;
    position: relative;
  }

  body.page-student_ai_book_prompt_generator .sab-output.show{ display: block; }

  body.page-student_ai_book_prompt_generator .sab-out-label{
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    color: #a88bf8;
    margin-bottom: 10px;
  }

  body.page-student_ai_book_prompt_generator .sab-out-text{
    font-size: 13.5px;
    color: #2d1a6e;
    font-weight: 500;
    line-height: 1.75;
    white-space: pre-wrap;
  }

  body.page-student_ai_book_prompt_generator .sab-copy-btn{
    position: absolute;
    top: 14px;
    right: 14px;
    background: #f5d84e;
    border: none;
    border-radius: 8px;
    padding: 6px 12px;
    font-family: 'Quicksand', sans-serif;
    font-size: 11px;
    font-weight: 700;
    color: #3b2200;
    cursor: pointer;
    transition: background 0.15s;
  }

  body.page-student_ai_book_prompt_generator .sab-copy-btn:hover{ background: #ffe000; }

  body.page-student_ai_book_prompt_generator .sab-select-info{
    font-size: 10.5px;
    color: #b8aad6;
    font-weight: 500;
    margin-top: 5px;
  }

