/* Learn With Yuna 8.4 — balanced picture-book reader */
:root{--book-ink:#172033;--book-muted:#667085;--book-line:#e4e7ee;--book-paper:#fffdf9;--story-accent:#80601a;--story-deep:#5f450f;--story-soft:#fff7d8;--story-rgb:128,96,26}
.story-page-kicker{margin:0 0 4px;color:var(--story-accent,#6657b8);font-size:12px;font-weight:900;letter-spacing:.11em;text-transform:uppercase}
.story-rail-heading>div:first-child>p{margin:5px 0 0;color:#687083;font-size:14px}.story-card.is-locked-story .story-card-image{filter:saturate(.75) brightness(.84)}.story-lock-overlay{position:absolute;inset:auto 12px 12px 12px;z-index:2;display:flex;align-items:center;justify-content:center;gap:7px;padding:9px 11px;border:1px solid rgba(255,255,255,.72);border-radius:13px;background:rgba(27,31,43,.82);color:#fff;font-size:12px;font-weight:900;backdrop-filter:blur(8px)}
.story-book-shell{position:relative;height:100%;min-height:0;padding-bottom:calc(66px + env(safe-area-inset-bottom));background:var(--book-paper)}
.story-book-spread{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(320px,.82fr) minmax(270px,330px);height:100%;min-height:0;background:var(--book-paper)}
.story-stage{grid-area:auto!important;min-width:0!important;height:100%!important;padding:clamp(10px,1.5vw,20px)!important;background:linear-gradient(145deg,#f7f3ea,#fff)!important;border-right:1px solid var(--book-line)!important;display:grid!important;place-items:center!important}
.story-stage img,#pageImage{width:100%!important;height:100%!important;object-fit:contain!important;border-radius:clamp(14px,1.7vw,24px)!important;background:#f8f5ef!important;box-shadow:0 14px 38px rgba(27,32,47,.11)!important}
.story-copy-panel{min-width:0;min-height:0;display:flex;flex-direction:column;background:#fff;border-right:1px solid var(--book-line)}
#storyTextContainer.story-box{flex:1;height:auto!important;min-height:0!important;padding:clamp(24px,3.2vw,48px)!important;padding-bottom:20px!important;background:#fff!important;overflow:auto!important}
.story-text{font-size:clamp(20px,2vw,28px)!important;line-height:1.58!important;color:var(--book-ink)!important}.story-text p{margin:0 0 1em!important}.story-text p:last-child{margin-bottom:0!important}
.try-words{margin-top:clamp(18px,2.5vw,30px)!important;padding:15px 16px!important;border:1px solid rgba(var(--story-rgb,102,87,184),.24)!important;border-radius:17px!important;background:linear-gradient(145deg,var(--story-soft,#f4f1ff),#fff)!important;display:flex!important;align-items:center!important;gap:10px!important;flex-wrap:wrap!important}.try-label{color:var(--book-muted)!important;font-size:12px!important;font-weight:900!important;text-transform:uppercase!important;letter-spacing:.08em!important}.try-chip{min-height:42px!important;padding:8px 14px!important;border:0!important;border-radius:13px!important;background:var(--story-accent,#6657b8)!important;color:#fff!important;font-size:18px!important;font-weight:900!important;box-shadow:0 4px 0 var(--story-deep,#4f438f)!important}
.story-reader-actions{flex:none;display:flex;gap:8px;padding:12px 16px 14px;border-top:1px solid var(--book-line);background:rgba(255,255,255,.97)}.reader-action{min-height:46px;display:inline-flex;align-items:center;justify-content:center;gap:7px;flex:1;border:1px solid #d7dbe4;border-radius:14px;background:#fff;color:#253047;font:inherit;font-size:13px;font-weight:850;cursor:pointer}.reader-action.primary{background:var(--story-accent,#6657b8);border-color:var(--story-accent,#6657b8);color:#fff}.reader-action.is-favorite{background:#fff5f6;border-color:#f1bec5;color:#a6273c}.reader-action.coach-toggle{display:none}
.story-coach-panel{min-width:0;min-height:0;overflow:auto;padding:20px 17px;background:linear-gradient(180deg,var(--story-soft,#f5f1ff),#fff 48%)}.story-coach-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:14px}.story-coach-head>div{display:flex;align-items:center;gap:8px}.story-coach-icon{font-size:22px}.story-coach-head strong{font-size:19px}.story-coach-plus{padding:4px 7px;border:1px solid rgba(var(--story-rgb,128,96,26),.30);border-radius:999px;background:#fff;color:var(--story-deep,#5f450f);font-size:10px;font-weight:900}.story-coach-item{margin-bottom:9px;padding:12px;border:1px solid rgba(82,91,112,.12);border-radius:14px;background:rgba(255,255,255,.88)}.story-coach-item p{margin:4px 0 0;color:#4f5b70;font-size:13px;line-height:1.48}.coach-label{color:var(--story-deep,#4f438f);font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.story-coach-advanced[hidden]{display:none!important}.story-coach-upgrade{display:flex;justify-content:center;margin-top:12px;padding:10px;border-radius:12px;background:var(--story-accent,#6657b8);color:#fff;font-size:12px;font-weight:900;text-decoration:none}
.story-nav{position:absolute!important;left:0!important;right:0!important;bottom:0!important;height:calc(62px + env(safe-area-inset-bottom))!important}.story-modal-open{overflow:hidden}.story-plus-gate-card{border-color:rgba(var(--story-rgb,128,96,26),.25)!important;background:linear-gradient(155deg,var(--story-soft,#fff7d8),#fff 70%)!important}.story-plus-gate-icon{width:54px;height:54px;display:grid;place-items:center;margin:0 auto 12px;border-radius:17px;background:#fff;color:var(--story-deep,#5f450f);font-size:25px;box-shadow:0 8px 20px rgba(var(--story-rgb,128,96,26),.13)}.story-plus-cta{background:var(--story-accent,#80601a)!important;color:#fff!important;border-color:var(--story-accent,#80601a)!important}
@media(max-width:1180px){.story-book-spread{grid-template-columns:minmax(0,1.12fr) minmax(300px,.88fr)}.story-coach-panel{grid-column:1/-1;position:absolute;z-index:40;right:12px;bottom:76px;width:min(390px,calc(100% - 24px));max-height:min(62vh,500px);display:none;border:1px solid rgba(var(--story-rgb,102,87,184),.22);border-radius:20px;box-shadow:0 22px 58px rgba(28,34,48,.22)}.story-coach-panel.is-open{display:block}.reader-action.coach-toggle{display:inline-flex}}
@media(max-width:699px) and (orientation:portrait){.story-book-shell{padding-bottom:calc(62px + env(safe-area-inset-bottom))}.story-book-spread{grid-template-columns:1fr;grid-template-rows:minmax(180px,42%) minmax(0,58%)}.story-stage{border-right:0!important;border-bottom:1px solid var(--book-line)!important;padding:7px!important}.story-stage img,#pageImage{border-radius:13px!important;box-shadow:none!important}.story-copy-panel{border-right:0}.story-text{font-size:clamp(18px,5.2vw,23px)!important;line-height:1.52!important}#storyTextContainer.story-box{padding:17px 18px 14px!important}.story-reader-actions{padding:8px 10px 10px;gap:6px}.reader-action{min-height:43px;font-size:11.5px;padding:6px}.story-coach-panel{right:8px;bottom:70px;width:calc(100% - 16px);max-height:55vh}.try-words{margin-top:14px!important;padding:11px!important}.try-chip{min-height:38px!important;font-size:16px!important}.story-title-main{font-size:15px!important}}
@media(orientation:landscape) and (max-height:560px){.story-book-spread{grid-template-columns:minmax(0,1.08fr) minmax(280px,.92fr)}#storyTextContainer.story-box{padding:14px 18px 12px!important}.story-text{font-size:clamp(16px,2vw,20px)!important;line-height:1.42!important}.story-reader-actions{padding:6px 10px 8px}.reader-action{min-height:38px;font-size:11px}.try-words{margin-top:10px!important;padding:8px 10px!important}.try-chip{min-height:34px!important;font-size:15px!important}.story-book-shell{padding-bottom:calc(52px + env(safe-area-inset-bottom))}.story-nav{height:calc(50px + env(safe-area-inset-bottom))!important}}
@media(prefers-reduced-motion:reduce){.reader-action,.story-card{transition:none!important}}


/* 8.4.1 — discoverable Favorites, one audio control, minimizable coach, one-line Today's Word */
.story-library-quick{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.story-library-view{min-height:40px;padding:0 13px;border:1px solid rgba(var(--story-rgb,128,96,26),.22);border-radius:999px;background:#fff;color:#38445a;font:inherit;font-size:12px;font-weight:900;cursor:pointer}.story-library-view.is-active{background:var(--story-soft,#fff7d8);border-color:rgba(var(--story-rgb,128,96,26),.38);color:var(--story-deep,#5f450f)}.story-favorite-count{min-width:21px;height:21px;display:inline-grid;place-items:center;margin-left:4px;padding:0 5px;border-radius:999px;background:var(--story-accent,#80601a);color:#fff;font-size:10px}.story-card.is-favorite-story .story-card-bg{box-shadow:0 0 0 2px rgba(190,48,68,.15),0 14px 34px rgba(31,36,56,.08)}.story-favorites-empty{width:min(100%,560px);margin:20px auto 6px;padding:30px;border:1px dashed rgba(var(--story-rgb,128,96,26),.30);border-radius:22px;background:linear-gradient(145deg,var(--story-soft,#fff7d8),#fff);text-align:center}.story-favorites-empty>span{display:block;font-size:32px;color:#ba4052}.story-favorites-empty strong{display:block;margin-top:6px;font-size:19px}.story-favorites-empty p{margin:7px auto 15px;max-width:42ch;color:#687083;line-height:1.5}.story-favorites-empty button{min-height:42px;padding:0 15px;border:0;border-radius:13px;background:var(--story-accent,#80601a);color:#fff;font:inherit;font-weight:900;cursor:pointer}
.story-title-controls{width:42px}.story-header-content{grid-template-columns:44px minmax(0,1fr) 44px!important}
.try-words{display:flex!important;align-items:center!important;gap:7px!important;flex-wrap:nowrap!important;min-width:0!important;overflow:hidden!important;padding:12px 14px!important}.try-star{flex:0 0 auto;font-size:18px}.try-label{flex:0 0 auto!important;white-space:nowrap!important;text-transform:none!important;letter-spacing:0!important;font-size:13px!important;color:var(--book-ink)!important}.try-chip{flex:0 1 auto!important;min-width:0!important;max-width:100%!important;min-height:36px!important;padding:6px 11px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;font-size:clamp(15px,2vw,18px)!important;box-shadow:none!important}
.reader-action.coach-toggle{display:inline-flex!important}.story-coach-head-actions{display:flex;align-items:center;gap:7px}.story-coach-collapse{width:34px;height:34px;display:grid;place-items:center;border:1px solid rgba(var(--story-rgb,128,96,26),.24);border-radius:11px;background:#fff;color:var(--story-deep,#5f450f);font:inherit;font-size:20px;font-weight:900;cursor:pointer}.story-book-spread{transition:grid-template-columns .18s ease}.story-book-spread.coach-collapsed{grid-template-columns:minmax(0,1.18fr) minmax(320px,.82fr)}.story-book-spread.coach-collapsed .story-coach-panel{display:none}.story-toast{position:fixed;z-index:100020;left:50%;bottom:max(84px,calc(70px + env(safe-area-inset-bottom)));transform:translateX(-50%);width:min(92vw,520px);padding:12px 16px;border:1px solid rgba(var(--story-rgb,128,96,26),.27);border-radius:14px;background:rgba(255,255,255,.97);color:#263247;font-size:13px;font-weight:850;text-align:center;box-shadow:0 16px 45px rgba(28,34,48,.18);backdrop-filter:blur(10px)}
@media(max-width:1180px){.story-library-quick{width:100%;order:3}.story-book-spread.coach-collapsed{grid-template-columns:minmax(0,1.12fr) minmax(300px,.88fr)}.story-book-spread.coach-collapsed .story-coach-panel{display:none}.story-coach-panel.is-open{display:block!important}.story-coach-collapse{position:sticky;top:0}.story-reader-actions{flex-wrap:nowrap}}
@media(max-width:699px) and (orientation:portrait){.story-library-view{flex:1}.story-reader-actions{display:grid;grid-template-columns:1fr 1fr}.reader-action.coach-toggle{grid-column:1/-1}.try-words{padding:9px 10px!important}.try-label{font-size:11.5px!important}.try-chip{font-size:14px!important}.story-toast{bottom:max(74px,calc(62px + env(safe-area-inset-bottom)));font-size:12px}}

/* 8.4.2 — compact mobile-style Parent Coach sheet for short landscape screens */
@media (orientation:landscape) and (max-width:1180px) and (max-height:720px){
  .story-book-shell{padding-bottom:calc(52px + env(safe-area-inset-bottom))!important}
  .story-book-spread{
    grid-template-columns:minmax(0,1.06fr) minmax(280px,.94fr)!important;
    grid-template-rows:minmax(0,1fr)!important;
    min-height:0!important;
  }
  .story-stage{padding:6px!important}
  .story-stage img,#pageImage{border-radius:12px!important;box-shadow:0 8px 24px rgba(27,32,47,.10)!important}
  #storyTextContainer.story-box{padding:12px 16px 10px!important}
  .story-text{font-size:clamp(15px,2.05vw,19px)!important;line-height:1.43!important}
  .try-words{margin-top:8px!important;padding:7px 9px!important;min-height:36px!important}
  .try-label{font-size:11px!important}.try-chip{min-height:30px!important;font-size:14px!important;padding:4px 9px!important}
  .story-reader-actions{padding:5px 8px 7px!important;gap:5px!important}
  .reader-action{min-height:36px!important;padding:4px 7px!important;font-size:10.5px!important;border-radius:11px!important}
  .story-nav{height:calc(48px + env(safe-area-inset-bottom))!important}

  /* Open as a compact bottom sheet, not a third cramped column. */
  .story-coach-panel{
    position:fixed!important;
    z-index:100060!important;
    left:max(8px,env(safe-area-inset-left))!important;
    right:max(8px,env(safe-area-inset-right))!important;
    bottom:calc(54px + env(safe-area-inset-bottom))!important;
    width:auto!important;
    max-height:calc(100dvh - 68px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important;
    padding:10px!important;
    overflow:auto!important;
    border:1px solid rgba(var(--story-rgb,128,96,26),.24)!important;
    border-radius:17px!important;
    background:linear-gradient(180deg,var(--story-soft,#fff7d8),#fff 48%)!important;
    box-shadow:0 22px 58px rgba(28,34,48,.26)!important;
  }
  .story-coach-panel.is-open{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px!important}
  .story-coach-head{
    grid-column:1/-1;
    position:sticky;
    top:-10px;
    z-index:2;
    margin:-10px -10px 2px!important;
    padding:9px 10px;
    background:linear-gradient(180deg,var(--story-soft,#fff7d8),rgba(255,255,255,.97));
    border-bottom:1px solid rgba(var(--story-rgb,128,96,26),.15);
  }
  .story-coach-head strong{font-size:16px!important}.story-coach-icon{font-size:18px!important}
  .story-coach-panel>.story-coach-item{grid-column:1/-1;margin:0!important}
  .story-coach-advanced{grid-column:1/-1;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px!important}
  .story-coach-advanced[hidden]{display:none!important}
  .story-coach-item{margin:0!important;padding:9px!important;border-radius:12px!important}
  .story-coach-item p{font-size:11.5px!important;line-height:1.36!important}
  .coach-label{font-size:9.5px!important}
  .story-coach-upgrade{grid-column:1/-1;margin-top:0!important}
}

@media (orientation:landscape) and (max-width:760px) and (max-height:520px){
  .story-book-spread{grid-template-columns:minmax(0,1fr) minmax(240px,.92fr)!important}
  .story-text{font-size:14.5px!important;line-height:1.38!important}
  .story-coach-panel.is-open{grid-template-columns:1fr!important}
  .story-coach-advanced{grid-template-columns:repeat(3,minmax(150px,1fr))!important;overflow-x:auto!important}
}

/* 8.4.3 — full word line and non-squeezing Parent Coach on landscape */

/* The original story-box is flex. Force a vertical reading flow so Today's
   Word sits below the story instead of being squeezed into one letter. */
#storyTextContainer.story-box{display:block!important}
#storyTextContainer .story-text{width:100%!important;max-width:36ch!important;margin:0!important}
#storyTextContainer .try-words{width:100%!important;max-width:100%!important;overflow:visible!important}
#storyTextContainer .try-chip{flex:0 0 auto!important;max-width:calc(100% - 132px)!important}

/* Up to common laptop/tablet landscape widths, Parent Coach behaves like a
   temporary drawer. The picture-book spread always remains two balanced pages. */
@media (min-width:700px) and (max-width:1700px){
  .story-book-spread,
  .story-book-spread.coach-collapsed{
    grid-template-columns:minmax(0,1.10fr) minmax(340px,.90fr)!important;
    grid-template-rows:minmax(0,1fr)!important;
  }
  .story-coach-panel{
    grid-column:auto!important;
    position:absolute!important;
    z-index:100060!important;
    left:auto!important;
    right:12px!important;
    top:12px!important;
    bottom:calc(72px + env(safe-area-inset-bottom))!important;
    width:min(370px,calc(100% - 24px))!important;
    max-height:none!important;
    display:none!important;
    padding:14px!important;
    overflow:auto!important;
    border:1px solid rgba(var(--story-rgb,128,96,26),.24)!important;
    border-radius:19px!important;
    background:linear-gradient(180deg,var(--story-soft,#fff7d8),#fff 48%)!important;
    box-shadow:0 22px 58px rgba(28,34,48,.25)!important;
  }
  .story-coach-panel.is-open{display:block!important}
  .story-book-spread.coach-collapsed .story-coach-panel{display:none!important}
  .story-coach-head{position:sticky!important;top:-14px!important;z-index:2!important;margin:-14px -14px 10px!important;padding:12px 14px!important;background:linear-gradient(180deg,var(--story-soft,#fff7d8),rgba(255,255,255,.97))!important;border-bottom:1px solid rgba(var(--story-rgb,128,96,26),.15)!important}
}

/* Short landscape phones/tablets use a compact bottom sheet. */
@media (orientation:landscape) and (max-width:1700px) and (max-height:720px){
  .story-coach-panel{
    position:fixed!important;
    left:max(8px,env(safe-area-inset-left))!important;
    right:max(8px,env(safe-area-inset-right))!important;
    top:auto!important;
    bottom:calc(54px + env(safe-area-inset-bottom))!important;
    width:auto!important;
    max-height:min(62vh,430px)!important;
    padding:10px!important;
    border-radius:17px!important;
  }
  .story-coach-panel.is-open{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px!important}
  .story-coach-head{grid-column:1/-1;top:-10px!important;margin:-10px -10px 2px!important;padding:9px 10px!important}
  .story-coach-panel>.story-coach-item{grid-column:1/-1;margin:0!important}
  .story-coach-advanced{grid-column:1/-1;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px!important}
  .story-coach-advanced[hidden]{display:none!important}
}

@media (max-width:699px) and (orientation:portrait){
  #storyTextContainer .story-text{max-width:none!important}
  #storyTextContainer .try-chip{max-width:calc(100% - 110px)!important}
  .story-coach-panel{
    position:fixed!important;left:8px!important;right:8px!important;top:auto!important;
    bottom:calc(70px + env(safe-area-inset-bottom))!important;width:auto!important;max-height:55vh!important;display:none!important;
  }
  .story-coach-panel.is-open{display:block!important}
}



/* 8.4.4 — iPad portrait/landscape fit and administrator page-audio tools */
.story-admin-dock{position:fixed;z-index:100090;left:max(10px,env(safe-area-inset-left));bottom:max(72px,calc(66px + env(safe-area-inset-bottom)));font-family:inherit}
.story-admin-toggle{min-height:40px;padding:0 14px;border:1px solid rgba(91,67,17,.22);border-radius:13px;background:#fff8dc;color:#563f0d;font:inherit;font-size:12px;font-weight:900;box-shadow:0 10px 28px rgba(35,31,22,.15);cursor:pointer}
.story-admin-panel{position:absolute;left:0;bottom:48px;width:min(430px,calc(100vw - 20px));padding:15px;border:1px solid rgba(91,67,17,.20);border-radius:18px;background:rgba(255,255,255,.98);box-shadow:0 24px 65px rgba(28,34,48,.24);backdrop-filter:blur(12px)}
.story-admin-panel[hidden]{display:none!important}.story-admin-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.story-admin-head strong{font-size:15px}.story-admin-head button{width:32px;height:32px;border:0;border-radius:10px;background:#f5f2ea;font-size:20px;cursor:pointer}.story-admin-panel p{margin:8px 0 12px;color:#667085;font-size:12px;line-height:1.45}.story-admin-actions{display:flex;gap:7px;flex-wrap:wrap}.story-admin-status{margin-top:10px;padding:9px 10px;border-radius:11px;background:#f8f7f2;color:#475467;font-size:11.5px;font-weight:750;overflow-wrap:anywhere}

/* Fill the real iPad viewport instead of trusting Safari's sometimes-short visualViewport. */
#single-story-view{height:100dvh!important;min-height:100svh!important;top:0!important}
#single-story-view>.single-story-view{height:100%!important}
.story-book-shell,.story-book-spread{height:100%!important;min-height:0!important}

/* iPad landscape: use the full screen with a balanced two-page spread. */
@media (min-width:700px) and (orientation:landscape){
  .story-header-content{min-height:50px!important;padding-top:max(6px,env(safe-area-inset-top))!important;padding-bottom:6px!important}
  .story-book-shell{padding-bottom:calc(54px + env(safe-area-inset-bottom))!important}
  .story-book-spread,.story-book-spread.coach-collapsed{grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr)!important;height:100%!important}
  .story-stage{padding:10px!important}.story-stage img,#pageImage{height:100%!important;max-height:none!important;object-fit:contain!important}
  #storyTextContainer.story-box{padding:clamp(18px,2.2vw,34px)!important;padding-bottom:12px!important}
  .story-text{font-size:clamp(18px,2vw,27px)!important;line-height:1.5!important}
  .story-reader-actions{padding:7px 10px!important}.story-nav{height:calc(52px + env(safe-area-inset-bottom))!important}
}

/* iPad portrait: a premium stacked picture-book page, not an orientation block. */
@media (min-width:700px) and (orientation:portrait){
  .story-book-shell{padding-bottom:calc(58px + env(safe-area-inset-bottom))!important}
  .story-book-spread,.story-book-spread.coach-collapsed{display:grid!important;grid-template-columns:1fr!important;grid-template-rows:minmax(0,54%) minmax(0,46%)!important;height:100%!important}
  .story-stage{grid-column:1!important;grid-row:1!important;padding:10px 16px 6px!important;border-right:0!important;border-bottom:1px solid var(--book-line)!important}
  .story-stage img,#pageImage{width:100%!important;height:100%!important;object-fit:contain!important}
  .story-copy-panel{grid-column:1!important;grid-row:2!important;border-right:0!important;min-height:0!important}
  #storyTextContainer.story-box{padding:16px 28px 10px!important}.story-text{max-width:52ch!important;font-size:clamp(20px,2.7vw,28px)!important;line-height:1.48!important}
  .try-words{margin-top:10px!important}.story-reader-actions{padding:7px 18px 9px!important}
  .story-coach-panel{position:fixed!important;left:14px!important;right:14px!important;top:auto!important;bottom:calc(64px + env(safe-area-inset-bottom))!important;width:auto!important;max-height:48vh!important;display:none!important}
  .story-coach-panel.is-open{display:block!important}
}

@media (max-width:699px){.story-admin-dock{display:none!important}}

/* 8.4.9 administrator narration studio */
.story-admin-panel{width:min(760px,calc(100vw - 24px));max-height:min(78vh,760px);overflow:auto}
.story-admin-intro{margin:0 0 14px;color:#5f6b7d;line-height:1.5}
.story-admin-section{padding:14px 0;border-top:1px solid #e7eaf0}
.story-admin-section:first-of-type{border-top:0}.story-admin-section h3{margin:0 0 9px;font-size:15px}.story-admin-section-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.story-admin-section-head span{font-size:12px;color:#6a7688}.story-admin-actions{display:flex;flex-wrap:wrap;gap:8px}.story-admin-nudge{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:10px 0}.story-admin-nudge span{font-size:12px;font-weight:700;color:#5e697b}.story-admin-nudge button{min-height:34px;padding:0 10px;border:1px solid #d7dce5;border-radius:9px;background:#fff}.story-timing-table{display:grid;gap:6px;margin-top:12px}.story-timing-row{display:grid;grid-template-columns:72px 84px 110px minmax(0,1fr);gap:8px;align-items:center;padding:8px;border:1px solid #e1e5ec;border-radius:10px;background:#fff}.story-timing-row.is-current{border-color:var(--story-accent,#8a6712);box-shadow:0 0 0 2px rgba(var(--story-rgb,138,103,18),.12)}.timing-jump{border:0;background:var(--story-soft,#fff5d8);color:var(--story-deep,#6f5108);border-radius:8px;min-height:34px;font-weight:800}.timing-input{width:100%;min-height:34px;border:1px solid #d8dde6;border-radius:8px;padding:5px 7px}.story-timing-row>span{font-size:12px;color:#5f6b7d}.story-timing-row small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#6b7687}@media(max-width:700px){.story-timing-row{grid-template-columns:68px 80px 1fr}.story-timing-row small{grid-column:1/-1}.story-admin-panel{max-height:72vh}}


/* 8.5.0 — professional space-saving single-story reader
   The reader fills the visible viewport, actions float above the page,
   and Parent Coach opens as an overlay instead of shrinking the book. */
#single-story-view{
  inset:var(--story-vv-top,0px) 0 auto 0!important;
  height:var(--story-vv-height,100dvh)!important;
  max-height:var(--story-vv-height,100dvh)!important;
}
#single-story-view>.single-story-view{
  display:flex!important;
  flex-direction:column!important;
  height:100%!important;
  min-height:0!important;
}
.story-header-content{flex:0 0 auto!important}
.story-tools{flex:0 0 auto!important}
#internal-story-content{
  position:relative!important;
  flex:1 1 auto!important;
  height:auto!important;
  min-height:0!important;
  overflow:hidden!important;
}
.story-book-shell{
  position:absolute!important;
  inset:0!important;
  height:auto!important;
  min-height:0!important;
  padding:0!important;
  overflow:hidden!important;
  background:#fff!important;
}
.story-book-spread,
.story-book-spread.coach-collapsed{
  position:absolute!important;
  inset:0 0 calc(52px + env(safe-area-inset-bottom)) 0!important;
  height:auto!important;
  min-height:0!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.08fr) minmax(340px,.92fr)!important;
  grid-template-rows:minmax(0,1fr)!important;
  overflow:hidden!important;
}
.story-stage{
  min-height:0!important;
  height:100%!important;
  padding:clamp(6px,1vw,12px)!important;
  background:linear-gradient(145deg,var(--story-soft,#fff9e8),#fff)!important;
  border-right:1px solid var(--book-line)!important;
}
.story-stage img,#pageImage{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  border-radius:clamp(12px,1.4vw,20px)!important;
  box-shadow:0 10px 28px rgba(27,34,48,.10)!important;
  background:transparent!important;
}
.story-copy-panel{
  position:relative!important;
  min-height:0!important;
  height:100%!important;
  border-right:0!important;
  overflow:hidden!important;
  background:linear-gradient(180deg,#fff 0%,var(--story-soft,#fffaf0) 140%)!important;
}
#storyTextContainer.story-box{
  height:100%!important;
  min-height:0!important;
  overflow:auto!important;
  padding:clamp(22px,3vw,46px)!important;
  padding-bottom:110px!important;
  background:transparent!important;
}
.story-text{font-size:clamp(19px,2.05vw,29px)!important;line-height:1.5!important}
.try-words{margin-top:clamp(14px,2vh,24px)!important}

/* Floating, minimal action dock. It no longer consumes story-page height. */
.story-reader-actions{
  position:absolute!important;
  z-index:55!important;
  right:clamp(10px,1.5vw,20px)!important;
  bottom:clamp(10px,1.5vw,18px)!important;
  width:auto!important;
  max-width:calc(100% - 20px)!important;
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  padding:7px!important;
  border:1px solid rgba(var(--story-rgb,138,103,18),.18)!important;
  border-radius:17px!important;
  background:rgba(255,255,255,.92)!important;
  box-shadow:0 12px 34px rgba(25,31,45,.16)!important;
  backdrop-filter:blur(14px)!important;
  -webkit-backdrop-filter:blur(14px)!important;
}
.reader-action{
  flex:0 0 auto!important;
  min-height:40px!important;
  padding:7px 12px!important;
  border-radius:12px!important;
  font-size:12px!important;
  white-space:nowrap!important;
  box-shadow:none!important;
}
.reader-action.primary{box-shadow:0 3px 0 var(--story-deep,#6f5108)!important}

/* Coach is always a floating drawer/sheet; it never changes book columns. */
.story-coach-panel{
  position:absolute!important;
  z-index:70!important;
  top:12px!important;
  right:12px!important;
  bottom:12px!important;
  left:auto!important;
  width:min(360px,calc(100% - 24px))!important;
  max-height:none!important;
  display:none!important;
  overflow:auto!important;
  padding:15px!important;
  border:1px solid rgba(var(--story-rgb,138,103,18),.20)!important;
  border-radius:20px!important;
  background:linear-gradient(180deg,var(--story-soft,#fff5d8),rgba(255,255,255,.98) 42%)!important;
  box-shadow:0 22px 58px rgba(25,31,45,.24)!important;
}
.story-coach-panel.is-open{display:block!important}
.story-book-spread.coach-collapsed .story-coach-panel{display:none!important}
.story-coach-head{position:sticky!important;top:-15px!important;z-index:2!important;margin:-15px -15px 12px!important;padding:13px 15px!important;background:rgba(255,255,255,.94)!important;backdrop-filter:blur(12px)!important;-webkit-backdrop-filter:blur(12px)!important;border-bottom:1px solid rgba(var(--story-rgb,138,103,18),.14)!important}

.story-nav{
  position:absolute!important;
  z-index:50!important;
  left:0!important;right:0!important;bottom:0!important;
  height:calc(52px + env(safe-area-inset-bottom))!important;
  padding:4px 8px max(4px,env(safe-area-inset-bottom))!important;
  background:rgba(255,255,255,.96)!important;
}
.story-nav-counter{min-height:40px!important}
.bottom-nav-btn{width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;border-radius:13px!important}

/* iPad landscape: preserve the two-page book and use every visible pixel. */
@media (min-width:700px) and (max-width:1400px) and (orientation:landscape){
  .story-header-content{min-height:48px!important;padding-top:5px!important;padding-bottom:5px!important}
  .story-book-spread,.story-book-spread.coach-collapsed{grid-template-columns:minmax(0,1.06fr) minmax(360px,.94fr)!important}
  .story-stage{padding:7px!important}
  #storyTextContainer.story-box{padding:clamp(18px,2.5vw,32px)!important;padding-bottom:96px!important}
  .story-text{font-size:clamp(18px,2.25vw,25px)!important;line-height:1.46!important}
  .story-reader-actions{right:10px!important;bottom:9px!important;padding:6px!important;gap:5px!important}
  .reader-action{min-height:38px!important;padding:6px 10px!important;font-size:11px!important}
  .story-coach-panel{top:9px!important;right:9px!important;bottom:9px!important;width:min(340px,42vw)!important}
}

/* Short landscape screens: icon-led compact actions and a wider coach sheet. */
@media (orientation:landscape) and (max-height:650px){
  .story-book-spread,.story-book-spread.coach-collapsed{inset:0 0 calc(46px + env(safe-area-inset-bottom)) 0!important;grid-template-columns:minmax(0,1.12fr) minmax(280px,.88fr)!important}
  .story-nav{height:calc(46px + env(safe-area-inset-bottom))!important}
  .story-nav-counter{min-height:36px!important;font-size:12px!important}
  .bottom-nav-btn{width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important}
  #storyTextContainer.story-box{padding:14px 16px 82px!important}
  .story-text{font-size:clamp(16px,2.1vw,20px)!important;line-height:1.4!important}
  .try-words{margin-top:9px!important;padding:8px 10px!important}
  .story-reader-actions{bottom:7px!important;right:7px!important;padding:5px!important;border-radius:14px!important}
  .reader-action{min-height:34px!important;padding:5px 8px!important;font-size:10px!important}
  .story-coach-panel{top:7px!important;right:7px!important;bottom:7px!important;width:min(430px,46vw)!important;padding:11px!important}
  .story-coach-head{top:-11px!important;margin:-11px -11px 8px!important;padding:9px 11px!important}
  .story-coach-item{padding:9px!important}.story-coach-item p{font-size:11.5px!important}
}

/* iPad/phone portrait: stacked book, floating bottom actions, coach bottom sheet. */
@media (orientation:portrait) and (max-width:1100px){
  .story-book-spread,.story-book-spread.coach-collapsed{
    grid-template-columns:1fr!important;
    grid-template-rows:minmax(220px,48%) minmax(0,52%)!important;
  }
  .story-stage{grid-column:1!important;grid-row:1!important;border-right:0!important;border-bottom:1px solid var(--book-line)!important;padding:8px!important}
  .story-copy-panel{grid-column:1!important;grid-row:2!important}
  #storyTextContainer.story-box{padding:18px 20px 96px!important}
  .story-text{font-size:clamp(18px,4vw,25px)!important}
  .story-reader-actions{left:50%!important;right:auto!important;bottom:9px!important;transform:translateX(-50%)!important;width:max-content!important;max-width:calc(100% - 16px)!important}
  .story-coach-panel{position:absolute!important;left:10px!important;right:10px!important;top:auto!important;bottom:10px!important;width:auto!important;max-height:min(54vh,520px)!important}
}

@media (max-width:560px){
  .story-book-spread,.story-book-spread.coach-collapsed{grid-template-rows:minmax(180px,43%) minmax(0,57%)!important}
  #storyTextContainer.story-box{padding:15px 16px 92px!important}
  .story-text{font-size:clamp(17px,5.1vw,22px)!important;line-height:1.48!important}
  .story-reader-actions{gap:4px!important;padding:5px!important}
  .reader-action{padding:5px 8px!important;font-size:10.5px!important}
  .reader-action span{font-size:14px!important}
  .try-words{padding:8px 9px!important}
}

/* =========================================================
   Learn With Yuna 8.5.1 — polished kid story page + iPad portrait
   ========================================================= */
.story-copy-panel{
  position:relative!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  background:
    radial-gradient(circle at 88% 7%,rgba(var(--story-rgb,138,103,18),.09),transparent 31%),
    linear-gradient(180deg,#fffefb 0%,#fff 72%,var(--story-soft,#fffaf0) 155%)!important;
}
#storyTextContainer.story-box{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  min-height:0!important;
  scrollbar-width:thin;
  scrollbar-color:rgba(var(--story-rgb,138,103,18),.30) transparent;
  padding:clamp(60px,7vw,84px) clamp(24px,4vw,54px) clamp(28px,4vw,48px)!important;
}
.story-text,
#storyTextContainer .story-text{
  width:100%!important;
  max-width:34rem!important;
  margin:auto!important;
  font-family:"Nunito","Avenir Next","Trebuchet MS",system-ui,sans-serif!important;
  font-size:clamp(1.28rem,1.1rem + .58vw,2rem)!important;
  font-weight:650!important;
  line-height:1.58!important;
  letter-spacing:.008em!important;
  text-wrap:pretty;
  color:#302a3d!important;
}
.story-text p{margin:0 0 .78em!important}.story-text p:last-child{margin-bottom:0!important}
.story-text strong,.story-text b{font-weight:850!important;color:var(--story-deep,#70520c)!important}
.story-text em,.story-text i{font-style:normal!important;font-weight:800!important;color:var(--story-deep,#70520c)!important}
.try-words{
  width:min(100%,34rem)!important;
  margin:clamp(14px,2vh,22px) auto 0!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.78)!important;
  border:1px solid rgba(var(--story-rgb,138,103,18),.15)!important;
}
.try-chip{white-space:nowrap!important}

/* Small floating tools in the top-right of the text page. */
.story-reader-actions{
  position:absolute!important;
  z-index:55!important;
  top:clamp(10px,1.4vw,18px)!important;
  right:clamp(10px,1.4vw,18px)!important;
  bottom:auto!important;
  left:auto!important;
  transform:none!important;
  width:auto!important;
  max-width:calc(100% - 20px)!important;
  display:flex!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  gap:5px!important;
  margin:0!important;
  padding:5px!important;
  border:1px solid rgba(var(--story-rgb,138,103,18),.16)!important;
  border-radius:15px!important;
  background:rgba(255,255,255,.93)!important;
  box-shadow:0 9px 26px rgba(25,31,45,.13)!important;
  backdrop-filter:blur(14px)!important;
  -webkit-backdrop-filter:blur(14px)!important;
}
.reader-action{
  min-width:42px!important;
  min-height:42px!important;
  width:42px!important;
  height:42px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  border-radius:11px!important;
  font-size:0!important;
  line-height:1!important;
  overflow:hidden!important;
  white-space:nowrap!important;
}
.reader-action span{font-size:18px!important;line-height:1!important}
.reader-action.primary{box-shadow:0 2px 0 var(--story-deep,#6f5108)!important}
.reader-action:focus-visible{outline:3px solid rgba(var(--story-rgb,138,103,18),.28)!important;outline-offset:2px!important}

/* iPad portrait: show the complete 16:9 image and use a compact book layout. */
@media screen and (min-width:768px) and (max-width:1180px) and (orientation:portrait){
  .story-book-reader,.story-reader,.story-book-shell,.story-book-frame{min-height:0!important;height:auto!important;max-height:none!important}
  .story-book-shell{height:100%!important}
  .story-book-spread,.story-book-spread.coach-collapsed{
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-rows:auto minmax(0,1fr)!important;
    gap:0!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:hidden!important;
  }
  .story-stage,.story-illustration,.story-illustration-frame,.story-image-panel,.story-page-image,.story-media{
    width:100%!important;
    aspect-ratio:16/9!important;
    height:auto!important;
    min-height:0!important;
    max-height:min(43vh,470px)!important;
    overflow:hidden!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:8px!important;
    background:radial-gradient(circle at 50% 45%,rgba(var(--story-rgb,138,103,18),.12),rgba(255,252,244,.96) 72%)!important;
    border-right:0!important;
    border-bottom:1px solid var(--book-line)!important;
    border-radius:0!important;
  }
  .story-stage img,.story-illustration img,.story-illustration-frame img,.story-image-panel img,.story-page-image img,.story-media img,#storyImage,#pageImage{
    width:100%!important;
    height:100%!important;
    max-width:100%!important;
    object-fit:contain!important;
    object-position:center center!important;
    display:block!important;
  }
  .story-copy-panel,.story-text-panel,.story-page-copy,.story-content-panel{
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    overflow:hidden!important;
    padding:0!important;
  }
  #storyTextContainer.story-box{
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    overflow-y:auto!important;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    padding:66px 28px 28px!important;
  }
  .story-text-scroll,.story-copy-scroll,.story-page-text,#storyText{
    max-height:none!important;
    overflow:visible!important;
  }
  .story-reader-actions,.story-floating-actions,.story-action-dock{
    position:absolute!important;
    top:10px!important;
    right:10px!important;
    bottom:auto!important;
    left:auto!important;
    transform:none!important;
    width:auto!important;
    max-width:calc(100% - 20px)!important;
    margin:0!important;
  }
  .parent-coach-panel,.story-coach-panel,.parent-coach-drawer{
    position:absolute!important;
    left:12px!important;
    right:12px!important;
    bottom:12px!important;
    top:auto!important;
    width:auto!important;
    max-width:none!important;
    max-height:48vh!important;
    overflow-y:auto!important;
    z-index:9999!important;
    border-radius:20px!important;
  }
}

@media(max-width:767px){
  #storyTextContainer.story-box{padding:62px 18px 24px!important}
  .story-text,#storyTextContainer .story-text{font-size:clamp(1.1rem,4.7vw,1.42rem)!important;line-height:1.55!important}
  .reader-action{width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important}
}

/* Learn With Yuna 8.6.3 — unified Story Time library and reader
   Free and Plus receive the same layout, spacing, cards, reader surfaces,
   and controls. Membership changes access only. */

.story-time-main{
  --story-accent:#80601a;
  --story-deep:#5f450f;
  --story-soft:#fff7d8;
  --story-rgb:128,96,26;
  background:#fff!important;
}

/* Library introduction and centered view filters. */
.story-category-library{
  width:min(1180px,calc(100% - 28px));
  margin-inline:auto;
  padding:clamp(8px,1.4vw,16px) 0 clamp(6px,1.2vw,12px)!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.story-library-intro{max-width:760px;margin:0 auto 24px;text-align:center}
.story-library-intro h2{margin:0;font-size:clamp(1.45rem,1.1rem + .8vw,2rem)}
.story-library-intro p{margin:7px auto 14px;max-width:62ch;color:#687083;line-height:1.5}
.story-library-quick{
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  margin:14px auto 2px!important;
}
.story-library-view{
  min-height:38px;
  padding:0 13px;
  border:1px solid #d9dde6;
  border-radius:999px;
  background:#fff;
  color:#38445a;
  font:inherit;
  font-size:12px;
  font-weight:900;
  cursor:pointer;
}
.story-library-view.is-active{
  border-color:#d9c57f;
  background:#fff8df;
  color:#694d0c;
}
.story-favorite-count{
  min-width:21px;height:21px;display:inline-grid;place-items:center;
  margin-left:4px;padding:0 5px;border-radius:999px;
  background:#80601a;color:#fff;font-size:10px;
}

/* One horizontal slider per story category. */
.story-category-rows{display:grid!important;gap:clamp(24px,3vw,36px)!important;width:100%!important;margin-top:28px}
.story-category-row{position:relative;width:100%!important;min-width:0!important;overflow:visible!important;padding:0 10px 2px!important}.story-category-row::before,.story-category-row::after{content:"";position:absolute;top:58px;bottom:10px;width:36px;z-index:2;pointer-events:none}.story-category-row::before{left:0;background:linear-gradient(90deg,var(--lwy88-paper,#fffdf8) 0%,rgba(255,253,248,0) 100%)}.story-category-row::after{right:0;background:linear-gradient(270deg,var(--lwy88-paper,#fffdf8) 0%,rgba(255,253,248,0) 100%)}
.story-category-row[hidden]{display:none!important}
.story-category-heading{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;margin:0 2px 12px!important}.story-category-head-meta{display:flex!important;align-items:center!important;gap:10px!important;flex:0 0 auto}.story-category-hint{display:inline-flex!important;align-items:center!important;min-height:38px;padding:0 12px;border-radius:999px;background:#fff7d8;color:#6b5415;font-size:11px;font-weight:900;letter-spacing:.02em;box-shadow:0 6px 16px rgba(128,96,26,.10)}
.story-category-heading h3{margin:0!important;font-size:clamp(1.05rem,.95rem + .42vw,1.35rem)!important;line-height:1.2;color:#2f3444}
.story-category-controls{display:flex!important;gap:9px!important;flex:0 0 auto}
.story-row-btn{width:42px;height:42px;display:grid;place-items:center;border:1px solid rgba(128,96,26,.18);border-radius:999px;background:#fff;color:#5e4a12;font:inherit;font-size:27px;line-height:1;cursor:pointer;box-shadow:0 10px 24px rgba(128,96,26,.12)}.story-row-btn:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(128,96,26,.16)}
.story-row-btn:disabled{opacity:.32;cursor:default;box-shadow:none}
.story-category-track{display:grid!important;grid-auto-flow:column!important;grid-auto-columns:clamp(200px,20vw,246px)!important;gap:clamp(14px,1.8vw,20px)!important;width:100%!important;overflow-x:auto!important;overflow-y:hidden!important;padding:4px 14px 18px!important;scroll-snap-type:x mandatory!important;scroll-padding-left:14px!important;scrollbar-width:none!important;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch!important;cursor:grab}.story-category-track:active{cursor:grabbing}
.story-category-track::-webkit-scrollbar{display:none!important}
.story-category-track .story-card{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  margin:0!important;
  aspect-ratio:4/5!important;
  scroll-snap-align:start!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.story-category-track .story-card-link,
.story-category-track .story-card-bg{display:block!important;width:100%!important;height:100%!important}
.story-category-track .story-card-link{color:inherit;text-decoration:none}
.story-category-track .story-card-bg{
  position:relative;
  display:grid!important;
  grid-template-rows:minmax(0,62%) minmax(0,38%)!important;
  overflow:hidden!important;
  border:1px solid #e7e9ef!important;
  border-radius:19px!important;
  background:#fff!important;
  box-shadow:0 10px 24px rgba(31,36,56,.07)!important;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.story-category-track .story-card:hover .story-card-bg{
  transform:translateY(-2px);
  border-color:#d9dde6!important;
  box-shadow:0 14px 30px rgba(31,36,56,.10)!important;
}
.story-category-track .story-card-image-wrap{
  position:relative!important;width:100%!important;height:100%!important;min-height:0!important;
  aspect-ratio:auto!important;overflow:hidden!important;border-radius:18px 18px 0 0!important;
}
.story-category-track .story-card-image{
  display:block!important;width:100%!important;height:100%!important;
  aspect-ratio:auto!important;object-fit:cover!important;object-position:center!important;
}
.story-category-track .story-meta{
  min-height:0!important;padding:10px 11px 12px!important;overflow:hidden!important;
  display:flex!important;flex-direction:column!important;justify-content:flex-start!important;
}
.story-category-track .story-title-row{display:block!important;min-width:0!important}
.story-category-track .story-title{
  margin:0!important;display:-webkit-box!important;-webkit-box-orient:vertical!important;
  -webkit-line-clamp:2!important;overflow:hidden!important;
  font-size:clamp(.88rem,.83rem + .18vw,1rem)!important;line-height:1.17!important;
}
.story-category-track .story-author{
  min-height:14px!important;margin:6px 0 0!important;color:#737b8c!important;font-size:10.5px!important;line-height:1.25!important;
  white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;
}
.story-category-track .story-desc{display:none!important}
.story-category-track .story-card-badge{
  position:absolute!important;z-index:3!important;right:8px!important;
  width:auto!important;margin:0!important;padding:4px 6px!important;
  border-radius:999px!important;font-size:8px!important;line-height:1!important;
  box-shadow:0 3px 10px rgba(31,36,56,.12)!important;
}
.story-category-track .story-plus-badge{top:8px!important}
.story-category-track .story-new-badge{top:31px!important}
.story-category-track .story-lock-overlay{left:8px!important;right:8px!important;bottom:8px!important;padding:7px 8px!important;font-size:10px!important}
.story-card.is-favorite-story .story-card-bg{box-shadow:0 0 0 2px rgba(190,48,68,.15),0 14px 30px rgba(31,36,56,.09)!important}
.story-favorites-empty{
  width:min(100%,560px);margin:24px auto 6px;padding:30px;
  border:1px dashed #d9c57f;border-radius:22px;background:linear-gradient(145deg,#fff8df,#fff);text-align:center;
}
.story-favorites-empty>span{display:block;font-size:32px;color:#ba4052}
.story-favorites-empty strong{display:block;margin-top:6px;font-size:19px}
.story-favorites-empty p{margin:7px auto 15px;max-width:42ch;color:#687083;line-height:1.5}
.story-favorites-empty button{min-height:42px;padding:0 15px;border:0;border-radius:13px;background:#80601a;color:#fff;font:inherit;font-weight:900;cursor:pointer}

/* Compact story tools stay beside the title and never cover text or artwork. */
#single-story-view .story-header-content{
  position:relative!important;
  min-height:72px!important;
  padding:9px 56px!important;
  display:grid!important;
  grid-template-columns:42px minmax(0,1fr) 42px!important;
  align-items:center!important;
  background:#fff!important;
  border-bottom:1px solid #e7e9ef!important;
}
#single-story-view .back-btn{grid-column:1!important;justify-self:start!important}
#single-story-view .story-title-cluster{
  grid-column:2!important;justify-self:center!important;min-width:0!important;
  max-width:min(840px,100%)!important;display:flex!important;align-items:center!important;
  justify-content:center!important;gap:9px!important;
}
#single-story-view .story-heading{min-width:0!important;text-align:center!important}
#single-story-view .story-title-main{
  margin:0!important;font-size:clamp(.98rem,.88rem + .35vw,1.22rem)!important;
  line-height:1.15!important;white-space:normal!important;overflow-wrap:anywhere!important;
}
#single-story-view .story-reader-author{margin:3px 0 0!important;font-size:.72rem!important;line-height:1.15!important}
#single-story-view .story-title-controls{
  position:static!important;flex:0 0 auto!important;display:flex!important;align-items:center!important;
  gap:3px!important;width:auto!important;margin:0!important;padding:3px!important;
  border:1px solid #e1e5ec!important;border-radius:12px!important;
  background:rgba(255,255,255,.96)!important;box-shadow:0 6px 18px rgba(31,36,56,.09)!important;
}
#single-story-view .story-title-controls .story-word-tool.try-words{
  width:30px!important;height:30px!important;min-width:30px!important;min-height:30px!important;
  max-width:30px!important;max-height:30px!important;margin:0!important;padding:0!important;
  overflow:visible!important;border:0!important;border-radius:9px!important;background:transparent!important;box-shadow:none!important;
}
#single-story-view .story-title-controls .reader-action,
#single-story-view .story-title-controls .today-word-star-button{
  width:30px!important;height:30px!important;min-width:30px!important;min-height:30px!important;
  max-width:30px!important;max-height:30px!important;margin:0!important;padding:0!important;
  display:grid!important;place-items:center!important;overflow:hidden!important;
  border:1px solid #e0e4eb!important;border-radius:9px!important;background:#fff!important;color:#2f3748!important;
  font:inherit!important;font-size:0!important;line-height:1!important;cursor:pointer!important;box-shadow:none!important;
}
#single-story-view .story-title-controls .reader-action.primary{background:#80601a!important;border-color:#80601a!important;color:#fff!important}
#single-story-view .story-title-controls .reader-action.is-favorite{background:#fff4f5!important;border-color:#efbdc5!important;color:#a6273c!important}
#single-story-view .story-title-controls .reader-action>span[aria-hidden="true"],
#single-story-view .story-title-controls .today-word-star-button>span{font-size:14px!important;line-height:1!important}
#single-story-view .story-title-controls .reader-action-label{
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;
  overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}
#single-story-view .story-title-controls :is(button):focus-visible{outline:3px solid rgba(128,96,26,.24)!important;outline-offset:2px!important}

/* Today’s Word is icon-only; tapping the star reveals this compact hint. */
.today-word-hint{
  position:absolute!important;z-index:90!important;top:calc(100% - 3px)!important;right:clamp(12px,3vw,38px)!important;
  width:min(320px,calc(100vw - 24px))!important;padding:14px 38px 14px 14px!important;
  display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;gap:10px!important;align-items:start!important;
  border:1px solid #e1e5ec!important;border-radius:16px!important;background:#fff!important;
  box-shadow:0 16px 40px rgba(31,36,56,.16)!important;
}
.today-word-hint[hidden]{display:none!important}
.today-word-hint-star{font-size:20px;line-height:1.2}
.today-word-hint strong{display:block;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#6b4e0d}
.today-word-hint p{margin:3px 0!important;font-size:17px!important;font-weight:900!important;color:#242b3a!important}
.today-word-hint small{display:block;color:#687083;font-size:11.5px;line-height:1.4}
.today-word-hint-close{
  position:absolute;top:7px;right:7px;width:28px;height:28px;display:grid;place-items:center;
  border:0;border-radius:9px;background:#f4f6f8;color:#465064;font-size:18px;cursor:pointer;
}

/* Neutral reader surfaces for every member. */
.story-book-shell,.story-ending-card{border-color:#e7e9ef!important;box-shadow:0 12px 30px rgba(31,36,56,.07)!important}
.story-stage{background:#fbfaf7!important}
.story-copy-panel{background:#fff!important}
.story-coach-panel{
  background:linear-gradient(180deg,#fff8df,#fff 48%)!important;
  border-color:#e1e5ec!important;
  box-shadow:0 14px 34px rgba(31,36,56,.11)!important;
}
#storyTextContainer.story-box{background:#fff!important}

/* Calm completion screen. */
.story-end-overlay{
  position:fixed;z-index:100040;inset:0;display:grid;place-items:center;
  padding:max(18px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));
  background:rgba(26,31,45,.46);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
}
.story-end-overlay.hidden{display:none!important}
.story-ending-card{
  width:min(560px,100%);max-height:min(90vh,720px);overflow:auto;padding:clamp(24px,4vw,38px);
  border:1px solid #e7e9ef;border-radius:28px;background:linear-gradient(160deg,#fffdf7,#fff 72%);
  text-align:center;box-shadow:0 28px 80px rgba(22,28,43,.24);
}
.story-end-overlay.is-bedtime .story-ending-card{background:linear-gradient(160deg,#f8f7ff,#fff 72%)}
.story-end-icon{font-size:42px;line-height:1}
.story-ending-card h2{margin:12px 0 8px;font-size:clamp(1.75rem,5vw,2.5rem);line-height:1.08}
.story-end-word{display:inline-flex;margin:4px auto 16px;padding:8px 12px;border-radius:999px;background:#fff8df;color:#694d0c;font-weight:900}
.story-end-question,.story-end-parent{margin:12px auto 0;padding:14px;border:1px solid #e7e9ef;border-radius:16px;background:#fff;text-align:left;color:#4d586b;line-height:1.5}
.story-end-parent strong{display:block;margin-bottom:4px;color:#2c3444}
.end-save-word{margin-top:14px;min-height:40px;padding:0 14px;border:1px solid #d9c57f;border-radius:12px;background:#fff8df;color:#694d0c;font:inherit;font-weight:850;cursor:pointer}
.end-save-word.is-saved{background:#f0f8f2;border-color:#b7ddc1;color:#2c7142}
.end-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:9px;margin-top:18px}
.end-btn{min-height:44px;padding:0 16px;border:1px solid #80601a;border-radius:13px;background:#80601a;color:#fff;font:inherit;font-weight:900;cursor:pointer}
.end-btn.secondary{border-color:#dce1e8;background:#fff;color:#354055}

@media(max-width:767px){
  .story-category-library{width:min(100% - 18px,1180px);padding:20px 12px!important;border-radius:20px!important}
  .story-library-intro{margin-bottom:18px}
  .story-library-intro p{font-size:13px}
  .story-category-rows{gap:24px!important;margin-top:22px}
  .story-category-controls{display:none!important}
  .story-category-track{grid-auto-columns:clamp(165px,46vw,185px)!important;gap:10px!important;padding-bottom:10px!important}
  #single-story-view .story-header-content{
    min-height:62px!important;padding:7px 9px!important;
    grid-template-columns:36px minmax(0,1fr)!important;
  }
  #single-story-view .story-title-cluster{
    grid-column:2!important;width:100%!important;max-width:100%!important;
    display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:5px!important;justify-content:stretch!important;
  }
  #single-story-view .story-heading{text-align:center!important}
  #single-story-view .story-title-main{font-size:clamp(.84rem,3.7vw,1rem)!important;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
  #single-story-view .story-reader-author{font-size:.63rem!important}
  #single-story-view .story-title-controls{gap:2px!important;padding:2px!important}
  #single-story-view .story-title-controls .story-word-tool.try-words,
  #single-story-view .story-title-controls .reader-action,
  #single-story-view .story-title-controls .today-word-star-button{
    width:27px!important;height:27px!important;min-width:27px!important;min-height:27px!important;max-width:27px!important;max-height:27px!important;
  }
  #single-story-view .story-title-controls .reader-action>span[aria-hidden="true"],
  #single-story-view .story-title-controls .today-word-star-button>span{font-size:13px!important}
  .today-word-hint{top:calc(100% - 1px)!important;right:8px!important;width:min(300px,calc(100vw - 16px))!important}
  .story-ending-card{padding:24px 18px;border-radius:22px}
  .end-actions{display:grid;grid-template-columns:1fr}
  .end-btn{width:100%}
}

@media(max-width:390px){
  #single-story-view .story-title-cluster{grid-template-columns:1fr!important;gap:3px!important}
  #single-story-view .story-title-controls{justify-self:end!important}
  #single-story-view .story-heading{text-align:right!important}
  #single-story-view .story-title-main{-webkit-line-clamp:1}
  #single-story-view .story-reader-author{display:none!important}
}

@media(min-width:768px) and (max-width:1180px){
  .story-category-track{grid-auto-columns:clamp(185px,25vw,215px)!important}
}

@media(max-height:560px) and (orientation:landscape){
  #single-story-view .story-header-content{min-height:54px!important;padding-block:4px!important}
  #single-story-view .story-title-controls .story-word-tool.try-words,
  #single-story-view .story-title-controls .reader-action,
  #single-story-view .story-title-controls .today-word-star-button{
    width:27px!important;height:27px!important;min-width:27px!important;min-height:27px!important;max-width:27px!important;max-height:27px!important;
  }
  .story-ending-card{max-height:94vh;padding:18px 22px}
  .story-ending-card h2{margin-top:7px}
  .story-end-question,.story-end-parent{padding:10px;margin-top:8px}
  .end-actions{margin-top:12px}
}

@media(prefers-reduced-motion:reduce){
  .story-category-track{scroll-behavior:auto!important}
  .story-category-track .story-card-bg{transition:none!important}
}


@media(max-width:767px){
  .story-category-head-meta{gap:8px!important}
  .story-category-hint{padding:0 10px;font-size:10px}
  .story-category-row{padding:0 2px 2px!important}
  .story-category-row::before,.story-category-row::after{top:64px;width:22px}
}


/* 8.9.1 — one Story Time introduction instead of a second “Choose a story” layer. */
.story-library-hero{padding-bottom:32px!important}
.story-library-hero .story-library-quick{margin-top:18px!important}
.story-category-library{padding-top:28px!important}
.story-category-rows{margin-top:0!important}

/* 8.10.0 — calm audiobook opening and completion flow */
#storyEndOverlay .end-card{
  width:min(590px,100%)!important;
  max-height:min(92dvh,760px)!important;
  overflow:auto!important;
  padding:clamp(24px,4vw,38px)!important;
  border-radius:28px!important;
  background:linear-gradient(160deg,#fffdf8,#fff 72%)!important;
  text-align:center!important;
}
#storyEndOverlay.is-bedtime .end-card{background:linear-gradient(160deg,#f8f7ff,#fff 72%)!important}
#storyEndOverlay .end-complete-icon{font-size:42px;line-height:1}
#storyEndOverlay .end-title{margin:12px 0 5px!important;font-size:clamp(2rem,6vw,2.7rem)!important;line-height:1.05!important}
#storyEndOverlay .end-story-credit{margin:0 auto 18px!important;color:#667085!important;font-size:.88rem!important;font-weight:750!important;line-height:1.4!important}
#storyEndOverlay .end-word{
  display:block!important;
  margin:0 auto!important;
  padding:16px!important;
  border:1px solid #eadcaa!important;
  border-radius:18px!important;
  background:#fff9e8!important;
  color:#5f470f!important;
}
#storyEndOverlay .end-word-label{display:block;margin-bottom:4px;font-size:.72rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
#storyEndOverlay .end-word strong{display:block;font-size:clamp(1.35rem,5vw,1.8rem);line-height:1.15}
#storyEndOverlay .end-word-actions{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:12px}
#storyEndOverlay .end-mini-btn,
#storyEndOverlay .end-talk-toggle{
  min-height:40px;display:inline-flex;align-items:center;justify-content:center;padding:0 14px;
  border:1px solid #d8c47a;border-radius:999px;background:#fff;color:#624b12;
  font:inherit;font-size:.82rem;font-weight:850;text-decoration:none;cursor:pointer;
}
#storyEndOverlay .end-mini-btn.secondary{border-color:#dde2ea;color:#3d4758}
#storyEndOverlay .end-talk-toggle{width:100%;margin-top:14px;border-color:#d8d0f2;background:#f8f6ff;color:#50428f}
#storyEndOverlay .end-talk-toggle[aria-expanded="true"]{background:#eee9ff}
#storyEndOverlay .end-discussion{
  margin-top:10px;padding:15px;border:1px solid #e1dcef;border-radius:16px;background:#fbfaff;text-align:left;
}
#storyEndOverlay .end-discussion[hidden]{display:none!important}
#storyEndOverlay .end-discussion p{margin:5px 0!important;color:#2f3746!important;font-size:1rem;font-weight:800;line-height:1.45}
#storyEndOverlay .end-discussion small{display:block;color:#697386;line-height:1.45}
#storyEndOverlay .end-section-label{display:block;color:#62539e;font-size:.7rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
#storyEndOverlay .end-grownups{margin-top:12px;padding:0;border:1px solid #e4e7ec;border-radius:16px;background:#fff;text-align:left;overflow:hidden}
#storyEndOverlay .end-grownups summary{padding:13px 15px;color:#3e4858;font-weight:850;cursor:pointer;list-style-position:inside}
#storyEndOverlay .end-grownups[open] summary{border-bottom:1px solid #eceff3;background:#fafbfc}
#storyEndOverlay .end-grownups p{margin:0!important;padding:14px 15px!important;color:#5c6677!important;line-height:1.5!important}
#storyEndOverlay .end-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px!important;margin-top:16px!important}
#storyEndOverlay .end-btn{width:100%!important;min-height:46px!important}

@media(max-width:560px){
  #storyEndOverlay .end-card{padding:22px 16px!important;border-radius:22px!important}
  #storyEndOverlay .end-story-credit{font-size:.78rem!important}
  #storyEndOverlay .end-actions{grid-template-columns:1fr!important}
  #storyEndOverlay .end-mini-btn{flex:1 1 145px}
}

/* 8.10.0 — gentle reading guidance and parent-controlled pacing */
.story-text.page-listening .sentence-unit{
  border-radius:.48em;
  transition:background-color .22s ease,box-shadow .22s ease,opacity .22s ease;
}
.story-text.page-listening .sentence-unit.active-sentence{
  background:#fff1a8;
  box-shadow:0 0 0 .18em #fff1a8;
  color:#243047;
}
.story-text.page-listening .sentence-unit.past-sentence{opacity:.74}
.story-text.page-listening.page-cue-fallback .sentence-unit{
  background:#fff9dc;
  box-shadow:0 0 0 .12em #fff9dc;
  color:#243047;
  opacity:1;
}
.story-auto-turn-setting{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin:12px 0 0;
  padding:12px 13px;
  border:1px solid #e7e2f2;
  border-radius:15px;
  background:#fbfaff;
  color:#394253;
  cursor:pointer;
}
.story-auto-turn-setting span{display:grid;gap:2px}
.story-auto-turn-setting strong{font-size:.86rem;line-height:1.25}
.story-auto-turn-setting small{color:#687286;font-size:.73rem;line-height:1.35}
.story-auto-turn-setting input{
  width:42px;
  height:24px;
  flex:0 0 auto;
  accent-color:#7665b7;
  cursor:pointer;
}
@media(max-width:720px){
  #replayPageBtn .reader-action-label{display:none}
  #replayPageBtn{min-width:44px}
}
@media(prefers-reduced-motion:reduce){
  .story-text.page-listening .sentence-unit{transition:none}
}


/* Learn With Yuna 8.10.6 — reliable, interactive story completion. */
#storyEndOverlay .end-finished-message{margin:0 0 4px!important;color:#465164!important;font-weight:750!important}
#storyEndOverlay .end-choice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px}
#storyEndOverlay .end-choice-grid[hidden]{display:none!important}
#storyEndOverlay .end-choice-btn{min-height:46px;padding:9px 10px;border:1px solid #d9deea;border-radius:14px;background:#fff;color:#2f3a4d;font:inherit;font-weight:850;cursor:pointer;box-shadow:0 3px 0 #d8dde7;touch-action:manipulation}
#storyEndOverlay .end-choice-btn:active,#storyEndOverlay .end-choice-btn.is-selected{transform:translateY(2px);box-shadow:0 1px 0 #c9cfda;background:#fff4cf;border-color:#e5c968;color:#5b4510}
#storyEndOverlay .end-encouragement{margin:10px 0 0!important;color:#5f6b7d!important;font-size:.88rem!important;font-weight:750!important}
@media(max-width:520px){#storyEndOverlay .end-choice-grid{grid-template-columns:1fr}.end-card{max-height:94vh;overflow:auto}}


/* 8.10.9 — illustrated, touch-first Story Time controls and a calm premium finish. */
#single-story-view .story-title-controls{
  gap:7px!important;padding:5px!important;border-radius:18px!important;
  background:rgba(255,255,255,.98)!important;box-shadow:0 10px 26px rgba(31,36,56,.11)!important;
}
#single-story-view .story-title-controls .story-word-tool.try-words{
  width:62px!important;height:54px!important;min-width:62px!important;min-height:54px!important;
  max-width:none!important;max-height:none!important;border-radius:14px!important;
}
#single-story-view .story-title-controls .reader-action,
#single-story-view .story-title-controls .today-word-star-button{
  width:62px!important;height:54px!important;min-width:62px!important;min-height:54px!important;
  max-width:none!important;max-height:none!important;display:flex!important;flex-direction:column!important;
  align-items:center!important;justify-content:center!important;gap:2px!important;padding:4px 5px!important;
  overflow:visible!important;border:1px solid #dfe4ec!important;border-radius:14px!important;
  background:linear-gradient(180deg,#fff 0%,#f7f8fb 100%)!important;color:#30394b!important;
  box-shadow:0 3px 0 #d5dae4,0 6px 15px rgba(35,42,59,.08)!important;
  font-size:inherit!important;touch-action:manipulation!important;-webkit-tap-highlight-color:transparent!important;
  transition:transform .1s ease,box-shadow .1s ease,background .12s ease!important;
}
#single-story-view .story-title-controls .reader-action:active,
#single-story-view .story-title-controls .today-word-star-button:active{
  transform:translateY(2px)!important;box-shadow:0 1px 0 #d5dae4,0 3px 8px rgba(35,42,59,.08)!important;
}
#single-story-view .story-title-controls .reader-action.primary{
  background:linear-gradient(180deg,#fff8dc 0%,#f7e7a8 100%)!important;border-color:#dcc36c!important;color:#5d4710!important;
  box-shadow:0 3px 0 #cbb35e,0 7px 16px rgba(119,89,16,.12)!important;
}
#single-story-view .story-title-controls .reader-action-label{
  position:static!important;width:auto!important;height:auto!important;padding:0!important;margin:0!important;
  overflow:visible!important;clip:auto!important;white-space:nowrap!important;border:0!important;
  font-size:10px!important;line-height:1!important;font-weight:900!important;letter-spacing:.01em!important;
}
.story-tool-art{width:31px;height:28px;display:grid;place-items:center;flex:0 0 auto}
.story-tool-art svg{width:100%;height:100%;overflow:visible}
.story-art-book{fill:#fff;stroke:#6f5716;stroke-width:2;stroke-linejoin:round}
.story-art-spine{fill:none;stroke:#b38e2b;stroke-width:2;stroke-linecap:round}
.story-listen-waves path{fill:none;stroke:#6f5716;stroke-width:2.3;stroke-linecap:round}
.story-listen-pause{display:none}.story-listen-pause rect{fill:#6f5716}
.story-listen-tool.is-playing .story-listen-waves{display:none}.story-listen-tool.is-playing .story-listen-pause{display:block}
.story-listen-tool.is-playing{background:linear-gradient(180deg,#f5ebff,#e4d8ff)!important;border-color:#b7a5e7!important;color:#4b3d87!important;box-shadow:0 3px 0 #a997dc,0 7px 16px rgba(83,65,145,.15)!important}
.story-art-couch{fill:#f1b86c;stroke:#78512d;stroke-width:2;stroke-linejoin:round}
.story-art-couch-back{fill:#ffd39a;stroke:#78512d;stroke-width:2;stroke-linejoin:round}
.story-art-person{fill:#78512d}.story-art-person.child{fill:#9b6c3d}
.story-art-person-line,.story-art-couch-leg{fill:none;stroke:#78512d;stroke-width:2;stroke-linecap:round}
.story-coach-tool.is-open{background:linear-gradient(180deg,#fff3dc,#ffe0aa)!important;border-color:#e0ad62!important}
.story-art-star{fill:#ffd65a;stroke:#80601a;stroke-width:2;stroke-linejoin:round}
.story-art-star-shine{fill:none;stroke:#e6a700;stroke-width:2.2;stroke-linecap:round}
.today-word-hint strong{color:#6b4e0d}

#storyEndOverlay .end-card{
  width:min(500px,100%)!important;padding:clamp(22px,4vw,34px)!important;border-radius:30px!important;
  background:linear-gradient(160deg,#fffdf7,#fff 68%,#fbf8ff)!important;overflow:hidden!important;
}
#storyEndOverlay .end-sparkles{position:absolute;inset:0;pointer-events:none}
#storyEndOverlay .end-sparkles span{position:absolute;color:#e9b932;opacity:.74;font-size:18px;animation:lwyEndSparkle 2.8s ease-in-out infinite}
#storyEndOverlay .end-sparkles span:nth-child(1){left:9%;top:12%;animation-delay:-.4s}
#storyEndOverlay .end-sparkles span:nth-child(2){right:10%;top:16%;font-size:15px;animation-delay:-1.1s}
#storyEndOverlay .end-sparkles span:nth-child(3){left:13%;bottom:18%;font-size:13px;animation-delay:-1.8s}
#storyEndOverlay .end-sparkles span:nth-child(4){right:12%;bottom:24%;animation-delay:-2.3s}
@keyframes lwyEndSparkle{0%,100%{transform:translateY(0) scale(.9);opacity:.42}50%{transform:translateY(-5px) scale(1.1);opacity:.9}}
#storyEndOverlay .end-complete-illustration{width:86px;height:76px;margin:0 auto 4px;display:grid;place-items:center}
#storyEndOverlay .end-complete-illustration svg{width:100%;height:100%;overflow:visible}
#storyEndOverlay .end-book-page{fill:#fff7d6;stroke:#80601a;stroke-width:2.5;stroke-linejoin:round}
#storyEndOverlay .end-book-spine{fill:none;stroke:#c1972e;stroke-width:2.5;stroke-linecap:round}
#storyEndOverlay .end-book-star{fill:#ffd65a;stroke:#80601a;stroke-width:2;stroke-linejoin:round;transform-origin:center;animation:lwyEndStar .55s cubic-bezier(.2,.8,.2,1) both}
@keyframes lwyEndStar{from{transform:translateY(7px) scale(.55);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}
#storyEndOverlay .end-title{margin:7px 0 6px!important;font-size:clamp(1.9rem,6vw,2.55rem)!important}
#storyEndOverlay .end-finished-message{margin:0 auto 5px!important;color:#4b5668!important;font-size:.98rem!important}
#storyEndOverlay .end-story-credit{margin:0 auto 15px!important;max-width:38ch!important;font-size:.8rem!important}
#storyEndOverlay .end-reward{
  display:flex;align-items:center;gap:11px;margin:0 auto 12px;padding:12px 14px;border:1px solid #ead88d;
  border-radius:18px;background:linear-gradient(145deg,#fff9df,#fffdf4);text-align:left;color:#59450f;
}
#storyEndOverlay .end-reward-star{width:38px;height:38px;display:grid;place-items:center;flex:0 0 auto;border-radius:13px;background:#ffd65a;color:#76580d;font-size:24px;box-shadow:0 3px 0 #d7b23d}
#storyEndOverlay .end-reward strong{display:block;font-size:.92rem}#storyEndOverlay .end-reward small{display:block;margin-top:2px;color:#6a6252;line-height:1.35}
#storyEndOverlay .end-favorite-btn{
  width:100%;min-height:52px;display:flex;align-items:center;justify-content:center;gap:10px;padding:7px 14px;
  border:1px solid #efbdc5;border-radius:16px;background:linear-gradient(180deg,#fff8f9,#fff0f2);color:#9f2b40;
  font:inherit;font-weight:900;cursor:pointer;box-shadow:0 3px 0 #e7b0ba;touch-action:manipulation;
}
#storyEndOverlay .end-favorite-btn:active{transform:translateY(2px);box-shadow:0 1px 0 #e7b0ba}
#storyEndOverlay .end-heart-art{width:29px;height:27px}.end-heart-art svg{width:100%;height:100%}.end-heart-art path{fill:#fff;stroke:#bd4157;stroke-width:2.3;stroke-linejoin:round}
#storyEndOverlay .end-favorite-btn.is-favorite{background:linear-gradient(180deg,#ffe9ed,#ffdce2);border-color:#df8d9d}
#storyEndOverlay .end-favorite-btn.is-favorite .end-heart-art path{fill:#c83f57}
#storyEndOverlay .end-talk-toggle{margin-top:11px!important;min-height:44px!important;background:#f8f7fb!important;border-color:#dfdce9!important;color:#4d5668!important}
#storyEndOverlay .end-discussion{margin-top:9px!important;padding:13px!important}
#storyEndOverlay .end-grownups{margin-top:10px!important}
#storyEndOverlay .end-actions{margin-top:13px!important}
#storyEndOverlay .end-btn{min-height:50px!important;border-radius:15px!important;touch-action:manipulation!important}

@media(max-width:767px){
  #single-story-view .story-title-controls{gap:4px!important;padding:3px!important;border-radius:14px!important}
  #single-story-view .story-title-controls .story-word-tool.try-words,
  #single-story-view .story-title-controls .reader-action,
  #single-story-view .story-title-controls .today-word-star-button{
    width:48px!important;height:46px!important;min-width:48px!important;min-height:46px!important;max-width:none!important;max-height:none!important;
  }
  .story-tool-art{width:25px;height:23px}
  #single-story-view .story-title-controls .reader-action-label{font-size:8.5px!important}
  #storyEndOverlay .end-card{padding:20px 15px!important;border-radius:24px!important;max-height:94dvh!important;overflow:auto!important}
  #storyEndOverlay .end-complete-illustration{width:72px;height:62px}
  #storyEndOverlay .end-reward{padding:10px 11px}
}
@media(max-width:390px){
  #single-story-view .story-title-cluster{grid-template-columns:minmax(0,1fr) auto!important;align-items:center!important}
  #single-story-view .story-heading{text-align:center!important}
  #single-story-view .story-title-controls .story-word-tool.try-words,
  #single-story-view .story-title-controls .reader-action,
  #single-story-view .story-title-controls .today-word-star-button{width:44px!important;min-width:44px!important}
}
@media(prefers-reduced-motion:reduce){
  #storyEndOverlay .end-sparkles span,#storyEndOverlay .end-book-star{animation:none!important}
  #single-story-view .story-title-controls .reader-action,#single-story-view .story-title-controls .today-word-star-button{transition:none!important}
}


/* 8.10.10 — centered story identity, right-side tools, and an adaptive artwork mat. */
@media (min-width:768px){
  #single-story-view .story-header-content{
    display:grid!important;
    grid-template-columns:minmax(190px,1fr) minmax(260px,auto) minmax(190px,1fr)!important;
    align-items:center!important;
    gap:12px!important;
    padding-inline:clamp(14px,2vw,26px)!important;
  }
  #single-story-view .back-btn{grid-column:1!important;justify-self:start!important;position:relative!important;z-index:2!important}
  #single-story-view .story-title-cluster{display:contents!important}
  #single-story-view .story-heading{grid-column:2!important;justify-self:center!important;text-align:center!important;min-width:0!important;max-width:min(42vw,520px)!important}
  #single-story-view .story-title-controls{grid-column:3!important;justify-self:end!important;align-self:center!important;margin:0!important}
  #single-story-view .story-title-main{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
}

#single-story-view .story-stage{
  --story-stage-image:none;
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  background:#17233b!important;
}
#single-story-view .story-stage::before{
  content:"";
  position:absolute;
  z-index:0;
  inset:-28px;
  background-image:var(--story-stage-image)!important;
  background-position:center!important;
  background-size:cover!important;
  filter:blur(22px) saturate(.86) brightness(.62);
  transform:scale(1.08);
  opacity:.88;
  pointer-events:none;
}
#single-story-view .story-stage::after{
  content:"";
  position:absolute;
  z-index:1;
  inset:0;
  background:linear-gradient(180deg,rgba(15,24,43,.16),rgba(15,24,43,.28));
  pointer-events:none;
}
#single-story-view .story-stage #pageImage{
  position:relative!important;
  z-index:2!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  filter:none!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.08),0 12px 34px rgba(5,11,24,.25)!important;
}
#single-story-view .story-stage .hotspot-container{z-index:3!important}

@media (max-width:900px) and (orientation:portrait){
  #single-story-view .story-header-content{grid-template-columns:minmax(150px,1fr) minmax(220px,auto) minmax(176px,1fr)!important;gap:7px!important}
  #single-story-view .story-title-controls .story-word-tool.try-words,
  #single-story-view .story-title-controls .reader-action,
  #single-story-view .story-title-controls .today-word-star-button{
    width:54px!important;min-width:54px!important;height:50px!important;min-height:50px!important;
  }
  #single-story-view .story-title-controls{gap:5px!important;padding:4px!important}
  #single-story-view .story-title-main{font-size:clamp(.86rem,2vw,1.05rem)!important}
}
@media (max-width:767px){
  #single-story-view .story-stage::before{filter:blur(16px) saturate(.82) brightness(.65)}
}

/* 8.10.11 — stable iPad story layout: wider reading line, no large portrait gap. */
#single-story-view .story-copy-panel{
  justify-content:flex-start!important;
}
#single-story-view #storyTextContainer.story-box{
  justify-content:flex-start!important;
  padding-top:clamp(20px,3vw,38px)!important;
}
#single-story-view #storyTextContainer .story-text{
  max-width:min(48rem,100%)!important;
  margin:0 auto!important;
}
#single-story-view .story-stage::before{
  filter:blur(15px) saturate(.82) brightness(.64)!important;
  transform:scale(1.045)!important;
  opacity:.78!important;
}
@media screen and (min-width:768px) and (max-width:1180px) and (orientation:portrait){
  #single-story-view #storyTextContainer.story-box{
    padding:24px 30px 28px!important;
  }
  #single-story-view .story-stage,
  #single-story-view .story-illustration,
  #single-story-view .story-illustration-frame,
  #single-story-view .story-image-panel,
  #single-story-view .story-page-image,
  #single-story-view .story-media{
    max-height:min(46vh,500px)!important;
  }
}
@media (orientation:landscape) and (min-width:700px){
  #single-story-view #storyTextContainer.story-box{
    padding-top:clamp(18px,2.2vw,30px)!important;
  }
}

/* 8.10.11 audit follow-up — wider story reading measure and softer tablet controls. */
#single-story-view .story-title-controls button,
#single-story-view .story-nav button{
  touch-action:manipulation!important;
  -webkit-tap-highlight-color:transparent!important;
}
@media (pointer:coarse){
  #single-story-view .story-title-controls button,
  #single-story-view .story-nav button{
    transition:transform 35ms ease-out,box-shadow 45ms ease-out!important;
  }
  #single-story-view .story-title-controls button:active,
  #single-story-view .story-nav button:active{
    transform:translateY(1px) scale(.99)!important;
  }
}


/* 8.10.16 — phone story header cleanup.
   Keep the story identity centered on its own row and place Word / Listen / Coach
   in a compact second row so 320–430px phones never squeeze or clip the title. */
@media (max-width:767px){
  #single-story-view .story-header-content{
    min-height:0!important;
    padding:6px 8px 7px!important;
    display:grid!important;
    grid-template-columns:36px minmax(0,1fr) 36px!important;
    grid-template-rows:auto auto!important;
    align-items:center!important;
    column-gap:4px!important;
    row-gap:4px!important;
  }
  #single-story-view .back-btn{
    grid-column:1!important;
    grid-row:1!important;
    justify-self:start!important;
    align-self:center!important;
  }
  #single-story-view .story-title-cluster{
    display:contents!important;
  }
  #single-story-view .story-heading{
    grid-column:2!important;
    grid-row:1!important;
    justify-self:stretch!important;
    min-width:0!important;
    max-width:none!important;
    text-align:center!important;
  }
  #single-story-view .story-title-main{
    margin:0!important;
    font-size:clamp(.82rem,3.6vw,.98rem)!important;
    line-height:1.12!important;
    white-space:normal!important;
    overflow:hidden!important;
    text-overflow:clip!important;
    overflow-wrap:anywhere!important;
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
  }
  #single-story-view .story-reader-author{
    display:block!important;
    margin:2px 0 0!important;
    font-size:.58rem!important;
    line-height:1.1!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  #single-story-view .story-title-controls{
    grid-column:1 / -1!important;
    grid-row:2!important;
    justify-self:center!important;
    align-self:center!important;
    display:flex!important;
    gap:3px!important;
    width:auto!important;
    margin:0!important;
    padding:2px!important;
    border-radius:12px!important;
  }
  #single-story-view .story-title-controls .story-word-tool.try-words,
  #single-story-view .story-title-controls .reader-action,
  #single-story-view .story-title-controls .today-word-star-button{
    width:44px!important;
    height:40px!important;
    min-width:44px!important;
    min-height:40px!important;
    max-width:44px!important;
    max-height:40px!important;
    padding:1px!important;
    border-radius:9px!important;
  }
  #single-story-view .story-title-controls .story-tool-art{
    width:18px!important;
    height:16px!important;
  }
  #single-story-view .story-title-controls .reader-action-label{
    display:block!important;
    margin-top:0!important;
    font-size:7.5px!important;
    line-height:1!important;
    letter-spacing:0!important;
  }
  #single-story-view .today-word-hint{
    top:100%!important;
    right:8px!important;
    left:8px!important;
    width:auto!important;
    max-width:none!important;
  }
}
@media (max-width:380px){
  #single-story-view .story-header-content{
    grid-template-columns:34px minmax(0,1fr) 34px!important;
    padding-inline:6px!important;
  }
  #single-story-view .story-title-main{
    font-size:clamp(.78rem,3.8vw,.9rem)!important;
  }
  #single-story-view .story-reader-author{display:none!important}
  #single-story-view .story-title-controls .story-word-tool.try-words,
  #single-story-view .story-title-controls .reader-action,
  #single-story-view .story-title-controls .today-word-star-button{
    width:40px!important;
    min-width:40px!important;
    max-width:40px!important;
    height:36px!important;
    min-height:36px!important;
    max-height:36px!important;
  }
  #single-story-view .story-title-controls .story-tool-art{
    width:18px!important;
    height:16px!important;
  }
  #single-story-view .story-title-controls .reader-action-label{font-size:6.5px!important}
}


/* Learn With Yuna 8.10.17 — concise story finish card. */
#storyEndOverlay .end-card{
  width:min(382px,calc(100vw - 28px))!important;
  max-height:min(88dvh,560px)!important;
  padding:22px!important;
  border:1px solid #e7e9ef!important;
  border-radius:24px!important;
  background:#fff!important;
  box-shadow:0 24px 64px rgba(22,28,43,.22)!important;
  overflow:auto!important;
}
#storyEndOverlay .end-complete-icon{
  width:44px!important;height:44px!important;margin:0 auto 10px!important;
  display:grid!important;place-items:center!important;
  border-radius:14px!important;background:#eef8f2!important;color:#2f7a54!important;
  font-size:24px!important;font-weight:950!important;
}
#storyEndOverlay .end-kicker{
  margin:0 0 4px!important;color:#707789!important;
  font-size:10.5px!important;letter-spacing:.09em!important;text-transform:uppercase!important;
}
#storyEndOverlay .end-title{
  margin:0!important;font-size:clamp(1.55rem,6vw,1.9rem)!important;
  line-height:1.08!important;letter-spacing:-.03em!important;
}
#storyEndOverlay .end-finished-message{
  max-width:30ch!important;margin:7px auto 0!important;
  color:#667085!important;font-size:.9rem!important;line-height:1.42!important;font-weight:600!important;
}
#storyEndOverlay .end-actions{
  display:grid!important;grid-template-columns:1fr 1fr!important;gap:9px!important;margin-top:17px!important;
}
#storyEndOverlay .end-actions .end-btn:first-child{grid-column:auto!important}
#storyEndOverlay .end-btn{
  min-height:46px!important;padding:0 12px!important;border-radius:13px!important;
  font-size:.9rem!important;font-weight:850!important;
}
#storyEndOverlay .end-secondary-actions{
  display:flex!important;justify-content:center!important;align-items:center!important;gap:8px!important;
  margin-top:10px!important;
}
#storyEndOverlay .end-favorite-btn,
#storyEndOverlay .end-talk-toggle{
  width:auto!important;min-height:36px!important;margin:0!important;padding:0 11px!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;
  border:1px solid #e2e5eb!important;border-radius:999px!important;background:#f8f9fb!important;
  color:#596274!important;box-shadow:none!important;font:inherit!important;font-size:.78rem!important;font-weight:800!important;
}
#storyEndOverlay .end-favorite-btn.is-favorite{
  background:#fff2f6!important;border-color:#efc8d7!important;color:#96516e!important;
}
#storyEndOverlay .end-heart-text{font-size:16px!important;line-height:1!important}
#storyEndOverlay .end-talk-toggle{color:#4f5c73!important}
#storyEndOverlay .end-discussion{
  margin-top:10px!important;padding:11px 12px!important;
  border:1px solid #e5e8ee!important;border-radius:14px!important;background:#fafbfc!important;
  text-align:left!important;
}
#storyEndOverlay .end-discussion>p:first-child{
  margin:0!important;color:#2f3848!important;font-size:.92rem!important;font-weight:800!important;line-height:1.4!important;
}
#storyEndOverlay .end-choice-grid{margin-top:9px!important;gap:6px!important}
#storyEndOverlay .end-choice-btn{
  min-height:38px!important;padding:7px 9px!important;border-radius:11px!important;
  box-shadow:none!important;font-size:.78rem!important;
}
#storyEndOverlay .end-encouragement{
  margin:8px 0 0!important;color:#7a8290!important;font-size:.76rem!important;font-weight:650!important;
}
#storyEndOverlay .end-sparkles,
#storyEndOverlay .end-complete-illustration,
#storyEndOverlay .end-reward,
#storyEndOverlay .end-story-credit,
#storyEndOverlay .end-grownups{display:none!important}
@media(max-width:420px){
  #storyEndOverlay.end-overlay{padding:10px!important}
  #storyEndOverlay .end-card{padding:18px 14px!important;border-radius:20px!important}
  #storyEndOverlay .end-actions{gap:7px!important}
  #storyEndOverlay .end-btn{min-height:44px!important;font-size:.84rem!important}
  #storyEndOverlay .end-secondary-actions{gap:6px!important}
  #storyEndOverlay .end-favorite-btn,#storyEndOverlay .end-talk-toggle{padding:0 9px!important;font-size:.74rem!important}
}


/* 8.10.55 — keep Parent Coach from covering the story */
@media(max-width:1180px){
  .story-coach-panel{max-height:290px!important;max-height:min(30dvh,290px)!important;overflow:auto!important;padding:12px!important;border-radius:16px!important}
  .story-coach-head{margin-bottom:8px!important}.story-coach-head strong{font-size:15px!important}.story-coach-icon{font-size:17px!important}
  .story-coach-item{padding:8px 10px!important;margin-bottom:6px!important}.story-coach-item p{font-size:12px!important;line-height:1.38!important}
  .story-auto-turn-setting{padding:8px!important}
}
@media(max-width:699px){.story-coach-panel{max-height:30vh!important;max-height:30dvh!important;left:8px!important;right:8px!important;width:auto!important}}


/* 8.10.56 — Parent Coach is an optional compact bottom drawer, never a permanent third reading column. */
.story-book-spread,
.story-book-spread.coach-collapsed{
  grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr)!important;
}
.story-coach-panel{
  position:fixed!important;
  z-index:100030!important;
  left:auto!important;
  right:max(14px,env(safe-area-inset-right))!important;
  top:auto!important;
  bottom:calc(66px + env(safe-area-inset-bottom))!important;
  width:min(440px,calc(100vw - 28px))!important;
  max-height:min(30dvh,280px)!important;
  min-height:0!important;
  display:none!important;
  overflow:auto!important;
  padding:12px!important;
  border:1px solid rgba(var(--story-rgb,102,87,184),.18)!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:0 18px 48px rgba(28,34,48,.18)!important;
}
.story-coach-panel.is-open{display:block!important}
.story-book-spread.coach-collapsed .story-coach-panel{display:none!important}
.story-coach-head{position:sticky!important;top:-12px!important;z-index:2!important;margin:0 -12px 8px!important;padding:10px 12px 8px!important;background:rgba(255,255,255,.97)!important;border-bottom:1px solid rgba(31,36,56,.07)!important}
.story-coach-item{padding:8px 10px!important;margin-bottom:6px!important}
.story-coach-item p{font-size:12px!important;line-height:1.4!important}
.story-auto-turn-setting{padding:8px!important}
@media(min-width:1181px){
  .story-stage{grid-column:1!important}
  .story-copy-panel{grid-column:2!important}
}
@media(max-width:699px){
  .story-coach-panel{
    left:8px!important;
    right:8px!important;
    width:auto!important;
    bottom:calc(62px + env(safe-area-inset-bottom))!important;
    max-height:30dvh!important;
    border-radius:16px!important;
  }
}

/* =========================================================
   8.10.59 — iPhone portrait Story Time layout repair
   8.10.56 intentionally removed Parent Coach as a permanent third column,
   but its late two-column rule was also overriding the phone stack.
   Keep phones as one full-width picture row + one full-width reading row.
   ========================================================= */
@media screen and (max-width:699px) and (orientation:portrait){
  .story-book-spread,
  .story-book-spread.coach-collapsed{
    width:100%!important;
    min-width:0!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:auto minmax(0,1fr)!important;
    grid-template-areas:"image" "text"!important;
  }

  .story-stage{
    grid-area:image!important;
    grid-column:1!important;
    grid-row:1!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:16/9!important;
    padding:0!important;
    overflow:hidden!important;
    border-right:0!important;
    border-bottom:1px solid var(--book-line)!important;
    background:#fff!important;
  }
  .story-stage img,
  #pageImage{
    display:block!important;
    width:100%!important;
    height:100%!important;
    max-width:100%!important;
    max-height:none!important;
    object-fit:contain!important;
    object-position:center!important;
    border-radius:0!important;
    box-shadow:none!important;
    background:#fff!important;
  }

  .story-copy-panel{
    grid-area:text!important;
    grid-column:1!important;
    grid-row:2!important;
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    height:100%!important;
    overflow:hidden!important;
    border-right:0!important;
  }
  #storyTextContainer.story-box{
    width:100%!important;
    min-width:0!important;
    height:100%!important;
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    justify-content:flex-start!important;
    padding:22px 20px 26px!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .story-text,
  #storyTextContainer .story-text{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    font-size:clamp(1.16rem,5.05vw,1.38rem)!important;
    line-height:1.55!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
    hyphens:none!important;
    -webkit-hyphens:none!important;
  }
  .story-text .sentence-unit,
  .story-text .tap-word{
    white-space:normal!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
    hyphens:none!important;
    -webkit-hyphens:none!important;
  }

  .story-coach-panel{
    left:8px!important;
    right:8px!important;
    width:auto!important;
    bottom:calc(62px + env(safe-area-inset-bottom))!important;
    max-height:30dvh!important;
  }
}


/* =========================================================
   8.10.60 — unified Story Time image + narration fallback
   - iPhone portrait always reserves a real 16:9 illustration row.
   - The text panel fills only its own grid row, so it cannot collapse the image.
   - Narration without exact timestamp cues never paints a false whole-page highlight.
   ========================================================= */
.story-text.page-cue-fallback .sentence-unit,
.story-text.page-listening.page-cue-fallback .sentence-unit{
  background:transparent!important;
  box-shadow:none!important;
  color:inherit!important;
  opacity:1!important;
}

@media screen and (max-width:699px) and (orientation:portrait){
  .story-book-spread,
  .story-book-spread.coach-collapsed{
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:clamp(180px,56.25vw,260px) minmax(0,1fr)!important;
    grid-template-areas:"image" "text"!important;
  }
  #single-story-view .story-stage,
  .story-stage{
    grid-area:image!important;
    grid-column:1!important;
    grid-row:1!important;
    width:100%!important;
    height:100%!important;
    min-height:180px!important;
    max-height:260px!important;
    aspect-ratio:auto!important;
    display:grid!important;
    place-items:center!important;
    overflow:hidden!important;
    padding:0!important;
    border-right:0!important;
    border-bottom:1px solid var(--book-line)!important;
    background:#17233b!important;
  }
  #single-story-view .story-stage #pageImage,
  .story-stage img,
  #pageImage{
    display:block!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    object-fit:contain!important;
    object-position:center!important;
    border-radius:0!important;
    box-shadow:none!important;
    background:transparent!important;
  }
  .story-copy-panel{
    grid-area:text!important;
    grid-column:1!important;
    grid-row:2!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:100%!important;
    overflow:hidden!important;
  }
  #storyTextContainer.story-box{
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
  }
}

#single-story-view .story-stage.story-image-missing::before{background-image:none!important;filter:none!important}
#single-story-view .story-stage.story-image-missing::after{
  background:linear-gradient(145deg,#f7f3ea,#fff)!important;
}


/* Learn With Yuna 8.10.66 — engaging, minimal completion card. */
.story-toast{display:flex;align-items:center;justify-content:center;gap:7px}
.story-toast-undo{border:0;background:transparent;color:#6b4fc8;font:inherit;font-weight:950;text-decoration:underline;text-underline-offset:2px;cursor:pointer;padding:2px 4px}
#storyEndOverlay .end-favorite-btn .end-heart-text{font-size:22px;line-height:1;color:#c13c55}
#storyEndOverlay .end-favorite-btn.is-favorite{background:#fff0f3!important;border-color:#e7a5b2!important;color:#9d3045!important}
#storyEndOverlay .end-talk-toggle{font-weight:900!important}
#storyEndOverlay .end-discussion>p:first-child{margin:0 0 10px!important;font-size:1.05rem!important;font-weight:900!important;color:#263247!important}
#storyEndOverlay .end-choice-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:9px!important}
#storyEndOverlay .end-choice-btn{position:relative;min-height:86px!important;display:grid!important;grid-template-rows:auto auto;place-items:center;gap:4px;padding:10px 8px!important;border-radius:18px!important;background:#fff!important}
#storyEndOverlay .end-choice-picture{font-size:28px;line-height:1.05}
#storyEndOverlay .end-choice-word{font-size:.92rem;font-weight:900;line-height:1.1;text-align:center}
#storyEndOverlay .end-choice-speak{position:absolute;right:7px;top:6px;font-size:11px;opacity:.56}
#storyEndOverlay .end-choice-hint{margin:9px 0 0!important;color:#788194!important;font-size:.75rem!important;font-weight:750!important;text-align:center}
@media(max-width:520px){#storyEndOverlay .end-choice-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}.story-toast{width:auto;max-width:92vw;padding:10px 13px}}


/* Learn With Yuna 8.10.67 — one clean reader toolbar; remove obsolete floating action remnants. */
#single-story-view .story-reader-actions,
#single-story-view .story-floating-actions,
#single-story-view .story-action-dock{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}