.scroll-chrome{transition:transform .2s ease;will-change:transform}
.scroll-chrome.scroll-chrome-hidden{transform:translateY(calc(-100% - 6px));pointer-events:none}
/* One vertical reading scroll surface: all reading bars move together. */
#readingDialog .reading-v2-shell.directional-reader{display:block;height:100dvh;overflow:auto;overscroll-behavior-y:contain;scrollbar-gutter:stable;scroll-padding-top:12px}
#readingDialog .directional-reader .reading-v2-body{height:auto;min-height:0;overflow:visible;align-items:start}
#readingDialog .directional-reader .reading-v2-center{overflow:visible;scrollbar-gutter:auto;min-height:0}
#readingDialog .reading-scroll-chrome{position:sticky;top:0;z-index:45;display:grid;grid-template-columns:auto minmax(0,1fr);background:#faf9ff;border-bottom:1px solid #d2c8e4;box-shadow:0 3px 12px #34235d16}
#readingDialog .reading-scroll-chrome .parent-navigation{position:static;grid-column:1;min-height:44px;padding:3px 8px;box-shadow:none;border:0;background:transparent}
#readingDialog .reading-scroll-chrome .parent-navigation button{min-height:38px;padding:6px 10px;font-size:13px}
#readingDialog .reading-scroll-chrome .reading-v2-topbar{position:static;display:flex;justify-content:space-between;gap:8px;height:auto;min-height:44px;padding:3px 8px;box-shadow:none;border:0;background:transparent}
#readingDialog .reading-scroll-chrome .reading-v2-brand{display:none}
#readingDialog .reading-scroll-chrome .reading-v2-nav{display:flex;gap:4px;margin:0;justify-content:center}
#readingDialog .reading-scroll-chrome .reading-v2-nav button{width:40px;height:38px;min-height:38px;min-width:38px;padding:5px;font-size:20px;border-radius:10px}
#readingDialog .reading-scroll-chrome .reading-v2-nav button span{display:none}
#readingDialog .reading-scroll-chrome .reading-v2-player{gap:8px}
#readingDialog .reading-scroll-chrome .reading-close-v2{width:38px;height:38px;min-height:38px}
#readingDialog .reading-scroll-chrome .reading-story-toolbar{position:static;grid-column:1/-1;padding:6px 12px;background:#faf9ff;border:0;border-top:1px solid #e4dff0;border-radius:0;box-shadow:none;margin:0}
#readingDialog .reading-scroll-chrome .reading-story-select-wrap{display:flex;align-items:center;gap:6px 12px;flex-wrap:wrap}
#readingDialog .reading-story-select-wrap>div:first-child{flex:1;min-width:150px}
#readingDialog .reading-story-select-wrap .eyebrow{display:none}
#readingDialog #readingTitle{font-size:20px;line-height:1.2;margin:0}
#readingDialog #readingMeta{font-size:11px;line-height:1.3}
#readingDialog .comic-zoom-controls{gap:5px;margin:0;width:auto;flex-wrap:nowrap}
#readingDialog .comic-zoom-controls label{display:none}
#readingDialog .comic-zoom-presets{flex-wrap:nowrap;gap:3px}
#readingDialog .comic-zoom-presets button{min-height:34px;min-width:40px;padding:4px;font-size:12px}
#readingDialog #comicZoomRange{width:85px;min-width:60px;min-height:34px;max-width:110px}
#readingDialog #comicZoomValue{font-size:12px;min-width:32px}
#readingDialog .reading-story-picker>summary{min-height:34px;padding:7px 10px;font-size:12px}
#readingDialog .reading-story-picker-body{max-height:55dvh;overflow:auto}
@media(max-width:1100px){#readingDialog .reading-scroll-chrome .reading-v2-user,#readingDialog .reading-scroll-chrome .reading-v2-currency{display:none}}
@media(max-width:600px){
 #readingDialog .reading-scroll-chrome{grid-template-columns:1fr auto}
 #readingDialog .reading-scroll-chrome .parent-navigation{padding:3px 5px}
 #readingDialog .reading-scroll-chrome .parent-navigation button{max-width:150px;font-size:12px}
 #readingDialog .reading-scroll-chrome .reading-v2-nav button:not(#readingHomeBtn){display:none}
 #readingDialog .reading-scroll-chrome .reading-story-toolbar{padding:6px 8px}
 #readingDialog #readingTitle{font-size:17px}
 #readingDialog .reading-story-select-wrap>div:first-child{flex-basis:calc(100% - 125px);min-width:0}
 #readingDialog .reading-story-picker{order:1}
 #readingDialog .comic-zoom-controls{order:2;flex-basis:100%;justify-content:flex-start}
 #readingDialog .comic-zoom-presets button{min-height:36px;min-width:42px}
 #readingDialog .comic-zoom-presets button[data-comic-zoom="125"],#readingDialog .comic-zoom-presets button[data-comic-zoom="150"]{display:none}
 #readingDialog #comicZoomRange{flex:1;max-width:160px}
}
@media(prefers-reduced-motion:reduce){.scroll-chrome{transition:none}}

/* Large module headers overlay their scroll panes without occupying a fixed
   strip after scrolling. Negative margin is constant in both visible states. */
dialog .module-scroll-shell,dialog.module-scroll-shell[open]{display:flex!important;flex-direction:column;height:100dvh!important;min-height:0!important;max-height:100dvh!important;overflow:hidden!important;--module-chrome-height:0px}
.module-scroll-shell>.module-scroll-chrome{position:relative;z-index:60;flex:0 0 auto;min-width:0;margin-bottom:calc(-1 * var(--module-chrome-height));background:#f7f5ff}
.module-scroll-chrome>.parent-navigation{position:static;min-height:44px;padding:4px 12px}
.module-scroll-chrome>.parent-navigation button{min-height:36px}
.module-scroll-chrome>*{flex-shrink:0}
.module-scroll-shell>:is(.synonym-body,.speaking-body,.grammar-body,#lessonContent,#adventureContent,#petDexGrid,.leaderboard-content){flex:1 1 0;min-height:0!important;min-width:0;box-sizing:border-box}
#leaderboardDialog .module-scroll-shell>.leaderboard-content{overflow:auto;display:block}
.module-scroll-shell .module-scroll-pane{padding-top:calc(var(--module-base-padding,0px) + var(--module-chrome-height))!important;box-sizing:border-box;overscroll-behavior:contain;overflow-anchor:none;scroll-padding-top:12px}
@media(max-width:900px){
 .module-scroll-chrome :is(.synonym-hero,.speaking-hero,.grammar-hero){min-height:0;padding-top:10px;padding-bottom:10px}
 .module-scroll-chrome :is(.synonym-title-wrap,.speaking-title-wrap,.grammar-title-wrap) h2{font-size:clamp(23px,5vw,32px);line-height:1.1}
 .module-scroll-chrome :is(.synonym-stats-strip,.speaking-stats-strip,.grammar-stats-strip){padding-top:6px;padding-bottom:6px;gap:6px}
}
.module-scroll-shell :is(.synonym-main,.synonym-map-panel,.speaking-main,.speaking-map-panel,.grammar-main,.grammar-map-panel){min-height:0}
@media(max-width:850px){
 #synonymDialog .module-scroll-shell>.synonym-body{overflow:auto}
 #synonymDialog .module-scroll-shell :is(.synonym-main,.synonym-map-panel){max-height:none;overflow:visible}
 #synonymDialog .module-scroll-shell .synonym-map-head{position:static}
}

/* A dialog is visible only while open; layout rules must not override its native closed state. */
dialog.module-scroll-shell:not([open]){display:none!important}