/* Shared chrome is viewport-wide. Native buttons and gameplay remain in place. */
body.rrdd-game-shell{--rrdd-header-height:64px;--rrdd-footer-height:26px;--rrdd-content-height:calc(100dvh - var(--rrdd-header-height) - var(--rrdd-footer-height));margin:0}
body.rrdd-with-stages{--rrdd-header-height:108px}
body.rrdd-game-shell header.rrdd-game-header{position:fixed!important;inset:0 0 auto!important;width:100%!important;height:var(--rrdd-header-height)!important;min-height:var(--rrdd-header-height)!important;z-index:100!important;background:#fffaf1!important;border-bottom:1px solid #e7e2d7!important;box-shadow:none!important}
.rrdd-header-space{height:var(--rrdd-header-height);min-height:var(--rrdd-header-height);width:100%;flex-shrink:0;grid-column:1/-1}
.rrdd-game-header .rrdd-game-brand{top:10px!important;height:44px!important;width:100px!important}.rrdd-game-header .rrdd-game-brand img{width:100px!important;height:44px!important}
.rrdd-game-header .rrdd-game-exit{top:10px!important;left:clamp(16px,2.5vw,40px)!important;background:transparent!important;padding:8px 10px!important}
.rrdd-game-header .rrdd-game-tools{height:64px!important;min-height:64px!important;padding:10px clamp(16px,2.5vw,40px)!important;gap:10px!important;align-items:center!important}
.rrdd-game-header .rrdd-game-stages{height:44px!important;bottom:0!important;max-width:100%!important;width:100%!important;background:#f7f3e9;border-top:1px solid #eee8dc;gap:clamp(8px,2vw,28px)!important}
.rrdd-game-stages button,.rrdd-game-stages .journey-step{min-height:44px!important;padding:4px 14px!important;font-size:12px!important;font-weight:700;border-radius:8px!important;box-shadow:none!important}
.rrdd-game-header .rrdd-game-tools .rrdd-fullscreen-tool,.rrdd-game-header .rrdd-settings-toggle{width:44px!important;height:44px!important;padding:0!important;border:0!important;background:transparent!important;border-radius:12px!important;box-shadow:none!important;flex-shrink:0}
.rrdd-game-header .rrdd-fullscreen-tool{font-size:0!important}.rrdd-fullscreen-tool svg,.rrdd-fullscreen-tool span{display:none!important}.rrdd-fullscreen-tool::after{content:'⛶';font:26px/1 system-ui;color:#173c61}.rrdd-game-header .rrdd-settings-toggle{font:24px/1 system-ui!important;color:#173c61!important}
.rrdd-game-header .rrdd-standalone-tool{top:10px!important;right:24px!important}
.rrdd-game-header .rrdd-challenge-timer{background:transparent!important;border:0!important;border-radius:0;padding:2px 12px!important;min-width:130px;min-height:40px;column-gap:12px}
.rrdd-game-header .rrdd-challenge-timer b{font-size:20px!important}.rrdd-game-header .rrdd-challenge-timer span{font-size:10px}.rrdd-game-header .rrdd-challenge-timer small{font-size:10px}
.rrdd-game-header .rrdd-learning-pause{min-width:44px!important;min-height:44px!important;padding:0!important;background:transparent!important;border:0!important;border-radius:12px!important;color:#173c61!important;font:22px/1 system-ui!important}
.rrdd-game-header .rrdd-learning-pause[aria-pressed=true]{background:#ffdf81!important}
.rrdd-game-header.rrdd-has-challenge-timer .timer,.rrdd-game-header.rrdd-has-challenge-timer .adventure-timer{display:none!important}
.rrdd-learning-break{width:min(420px,calc(100vw - 40px));box-sizing:border-box;border:1px solid #e4e2d8;border-radius:24px;background:#fffaf1;padding:30px;color:#173c61;text-align:center;box-shadow:0 24px 80px #173c6140;font:16px/1.5 'Trebuchet MS',system-ui,sans-serif}.rrdd-learning-break::backdrop{background:#122d4b99;backdrop-filter:blur(5px)}.rrdd-learning-break h2{font-size:26px;margin:0 0 10px}.rrdd-learning-break p{margin:0 0 22px}.rrdd-learning-break button{min-height:48px;border:0;border-radius:14px;padding:12px 24px;background:#ffda64;color:#173c61;font:700 16px 'Trebuchet MS',sans-serif;cursor:pointer}
.rrdd-game-header .rrdd-secondary-tool{display:none!important}
.rrdd-settings-background{display:none;position:absolute;top:60px;right:20px;width:240px;height:calc(var(--rrdd-tool-count)*48px + 16px);border:1px solid #e2e5de;border-radius:18px;background:#fffaf1;box-shadow:0 14px 40px #173c6126;z-index:3}
.rrdd-settings-open .rrdd-settings-background{display:block}
.rrdd-game-header.rrdd-settings-open .rrdd-secondary-tool{display:flex!important;position:absolute!important;top:calc(68px + var(--rrdd-tool-row)*48px)!important;right:28px!important;width:224px!important;min-height:44px!important;align-items:center;justify-content:center;gap:8px;border:0!important;border-radius:10px!important;z-index:4;background:transparent!important;color:#173c61!important;font-size:14px!important}
.rrdd-game-header.rrdd-settings-open .rrdd-secondary-tool:hover{background:#edf3e9!important}.rrdd-game-header.rrdd-settings-open .rrdd-secondary-tool>span{display:inline!important}
.rrdd-game-header.rrdd-settings-open .rrdd-secondary-tool[hidden]{display:none!important}
.rrdd-game-footer{background:#fffaf1!important;border-top:1px solid #eae5dc!important;height:var(--rrdd-footer-height)!important;box-sizing:border-box;z-index:99!important}
/* Short/portrait windows can scroll; wide screens share the tablet layout,
   rather than stretching a card to fill every extra desktop pixel. */
.rrdd-game-shell .reader-shell{max-width:none!important;width:100%!important;box-sizing:border-box!important;padding:0!important;margin:0!important}
.rrdd-game-shell .rsg-phase{box-sizing:border-box;padding:18px clamp(20px,3vw,48px)}
.rrdd-result.rrdd-unified-result{inset:var(--rrdd-header-height) 0 var(--rrdd-footer-height)!important;z-index:90!important}
.achievement-overlay:has(.rrdd-unified-result:not([hidden])){inset:var(--rrdd-header-height) 0 var(--rrdd-footer-height)!important;z-index:90!important}
@media(min-width:1000px) and (min-height:650px){
 .rrdd-game-shell .reader-shell{height:calc(100dvh - var(--rrdd-footer-height))!important;min-height:0!important;display:grid!important;grid-template-rows:var(--rrdd-header-height) minmax(0,1fr)!important;gap:0!important}
 .rrdd-game-shell:has(#playScreen) .app-shell{grid-template-rows:var(--rrdd-header-height) minmax(0,1fr) var(--rrdd-footer-height)!important}
 body.rrdd-game-shell:has(#exitGame){grid-template-rows:var(--rrdd-header-height) minmax(0,1fr) var(--rrdd-footer-height)!important}
 .rrdd-game-shell .rsg-phase{width:min(100%,1240px)!important;max-height:850px;align-self:center;justify-self:center;margin:0 auto!important;min-height:0}
 .ready-game #listen{height:auto!important;grid-template-rows:auto auto;align-content:center;gap:24px;max-height:calc(var(--rrdd-content-height) - 24px);padding-block:20px}
 .ready-game .phase-copy{justify-self:center;width:100%;max-width:none!important;text-align:center}
 .ready-game #listen .story-panel{height:auto!important;max-height:100%;width:100%;align-self:center;box-sizing:border-box;padding:16px!important;border-radius:24px;box-shadow:0 12px 36px #061c3420}
 .ready-game #listen .story-panel>img{height:auto!important;max-height:min(520px,calc(var(--rrdd-content-height) - 150px))!important;aspect-ratio:4/3;object-fit:contain!important}
 .ready-game .phase-copy h1{font-size:clamp(28px,2.7vw,38px)!important;line-height:1.15;margin:6px 0!important}
 .ready-game .phase-copy p{margin:6px 0!important}
 .ready-game #watch{max-height:800px;padding-block:24px}
 .ready-game #watch .film-card{height:min(100%,660px);aspect-ratio:9/16}
 /* The original flex route squeezed six illustrated tiles to 31px at 1024x768. */
 .ready-game #route{max-height:880px;gap:10px}
 .ready-game .route-panel{display:grid!important;grid-template-rows:40px 38px minmax(196px,1fr) 44px 40px;gap:8px!important;padding:12px 20px!important}
 .ready-game .route-panel .stars-heading{height:40px;min-height:0}.ready-game .route-panel .stars-heading h2{font-size:24px;margin:0}
 .ready-game .mission-stars{padding:0!important;min-height:0;align-items:center;grid-template-columns:repeat(6,1fr)}
 .ready-game .mission-star{display:flex;align-items:center;justify-content:center;gap:6px}.ready-game .mission-star b{font-size:28px;line-height:1}.ready-game .mission-star small{font-size:12px}
 .ready-game .station-grid{height:100%;min-height:0;grid-template-rows:repeat(2,minmax(0,1fr));margin:0!important;gap:8px}
 .ready-game .station-card{min-height:0!important;grid-template-rows:minmax(0,1fr) auto auto;align-content:stretch;padding:7px;gap:3px;overflow:hidden}
 .ready-game .station-card img.station-icon{height:100%;width:auto;max-height:100px;max-width:100%;min-height:0;align-self:center;justify-self:center;object-fit:contain}
 .ready-game .station-card strong{font-size:15px;line-height:1.2}.ready-game .station-card small{font-size:12px;line-height:1.2}
 .ready-game #trophyRoute{margin:0 auto!important;min-height:44px;padding:8px 20px;max-width:100%}.ready-game .route-footer{min-height:0;align-items:center}.ready-game .route-footer button{min-height:40px;padding:6px 10px}
 /* Reading words must fit their grid row, never paint over the Hear button. */
 .ready-game .story-reading-panel{height:calc(100% - 104px);min-height:0;box-sizing:border-box;grid-template-rows:36px minmax(0,1fr) 46px auto 46px;padding:16px 22px;gap:8px 20px}
 .ready-game .story-reading-panel .tracking-sentence{font-size:clamp(20px,2.05vw,28px)!important;line-height:1.45!important;padding:4px;margin:0!important;min-height:0;max-height:100%;overflow:auto;overscroll-behavior:contain;align-self:center}
 .ready-game .story-reading-panel .tracking-sentence span{padding:2px 3px}.ready-game .story-reading-panel .reading-scene{max-height:100%;min-width:0;min-height:0;object-fit:contain}
 .rrdd-game-shell .experience-phase{width:min(100%,1280px);margin-inline:auto;box-sizing:border-box;padding:16px 28px;max-height:900px;align-self:center}
 .rrdd-game-shell .practice-phase .reading-stage{max-height:650px!important;align-self:center;width:100%}
 .rrdd-game-shell:has(#playScreen) main{max-width:1320px;width:100%;box-sizing:border-box;padding:16px 32px!important}
 .rrdd-game-shell:has(#playScreen) .scene-frame{max-height:760px}
 body.rrdd-game-shell:has(#exitGame) main{max-width:1280px;padding:18px 32px!important;box-sizing:border-box}
 body.rrdd-game-shell:has(#exitGame) .view{max-height:850px;margin:auto;width:100%}
 body.rrdd-game-shell:has(#exitGame) #stations .station{display:grid;grid-template-rows:minmax(0,1fr) auto auto;gap:3px;min-height:0;padding:8px;overflow:hidden;align-content:stretch}
 body.rrdd-game-shell:has(#exitGame) #stations .station img{height:100%;width:auto;max-height:100px;max-width:100%;min-height:0;align-self:center;justify-self:center;margin:0;object-fit:contain}
 body.rrdd-game-shell:has(#exitGame) #stations .station strong{font-size:15px;line-height:1.2}
 body.rrdd-game-shell:has(#exitGame) #stations .station small{font-size:12px;line-height:1.2}
 body.rrdd-game-shell:has(#exitGame) #sentence{font-size:clamp(22px,2.4vw,32px);line-height:1.4;max-height:100%;min-height:0;overflow:auto;overscroll-behavior:contain}
 .rrdd-game-shell .app-shell:has(.site-header){padding-top:0!important}
}
@media(max-width:700px){
 body.rrdd-game-shell{--rrdd-header-height:120px}body.rrdd-with-stages{--rrdd-header-height:164px}
 .rrdd-game-header .rrdd-game-tools{padding:64px 12px 0!important;height:120px!important;min-height:120px!important;justify-content:center!important;gap:8px!important}
 .rrdd-game-header .rrdd-game-stages{gap:4px!important}.rrdd-game-stages button,.rrdd-game-stages .journey-step{padding:4px 8px!important;font-size:11px!important}
 .rrdd-game-header .rrdd-game-brand{top:10px!important}.rrdd-game-header .rrdd-game-exit{left:12px!important}
 .rrdd-settings-background{top:114px}.rrdd-game-header.rrdd-settings-open .rrdd-secondary-tool{top:calc(122px + var(--rrdd-tool-row)*48px)!important}
 .rrdd-game-shell .controls{bottom:var(--rrdd-footer-height)!important}
}
@media(max-width:380px){.rrdd-game-header .rrdd-game-tools{gap:2px!important;padding-inline:6px!important}.rrdd-game-header .rrdd-challenge-timer{min-width:112px;padding:2px 6px!important;column-gap:6px}.rrdd-game-header .rrdd-challenge-timer span,.rrdd-game-header .rrdd-challenge-timer small{font-size:9px}.rrdd-game-header .rrdd-challenge-timer b{font-size:18px!important}}
/* Do not clip a certificate form when zoom, browser chrome or a short window
   leaves less vertical room. The 13-inch landscape target still fits at once. */
@media(min-width:701px) and (max-height:850px){.rrdd-result.rrdd-unified-result{overflow:auto!important}.rrdd-unified-result .rrdd-completion-layout{max-height:none;min-height:auto;flex:none}}
@media(min-width:701px) and (orientation:portrait){
 .rrdd-game-shell .reader-shell{height:auto!important;min-height:calc(100dvh - 26px)!important;grid-template-rows:var(--rrdd-header-height) auto!important}
 .rrdd-game-shell .experience-phase{height:auto!important;max-height:none!important}
 .rrdd-game-shell .practice-phase .reading-stage{height:auto!important;max-height:none!important}
}

/* Shared awards: intrinsic canvas ratio, square choices, always-visible picker.
   Never combine a fixed canvas height with a narrower max-width. */
.rrdd-result.rrdd-unified-result{overflow:auto!important}
.rrdd-unified-result .rrdd-completion-layout{min-height:min-content;max-height:none;flex:none;margin-block:auto}
.rrdd-unified-result .rrdd-certificate-preview{min-height:0;align-self:center;min-width:0}
.rrdd-unified-result .rrdd-certificate-preview canvas{box-sizing:content-box!important;width:min(100%,calc((100dvh - 230px)*.8),460px)!important;height:auto!important;max-height:none!important;aspect-ratio:4/5!important;object-fit:contain}
.rrdd-certificate-form>.rrdd-avatar-picker{position:static!important;inset:auto!important;box-sizing:border-box!important;width:100%!important;margin:14px 0!important;padding:0!important;border:0!important;box-shadow:none!important;background:transparent!important}
.rrdd-certificate-form .rrdd-avatar-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important;max-width:290px!important;gap:6px!important;margin-inline:auto}
.rrdd-certificate-form .rrdd-avatar-option{box-sizing:border-box!important;width:100%!important;height:auto!important;min-height:44px!important;max-height:none!important;aspect-ratio:1!important;display:grid!important;place-items:center;padding:3px!important}
.rrdd-certificate-form .rrdd-avatar-option .rrdd-avatar{display:block;width:100%;height:auto;aspect-ratio:1}
.rrdd-certificate-form .rrdd-join-leaderboard[hidden]{display:none!important}
.rrdd-certificate-form .rrdd-save-certificate{display:block;width:100%;min-height:44px!important;margin:12px 0 0!important;padding:8px 12px!important;border:1px solid #a9c2c7!important;border-radius:12px!important;background:transparent!important;color:#173c61!important;box-shadow:none!important;font:600 14px 'Trebuchet MS',sans-serif!important}
@media(max-width:700px){.rrdd-unified-result .rrdd-completion-layout{margin-block:0}.rrdd-unified-result .rrdd-certificate-preview canvas{width:min(100%,288px)!important;height:auto!important}.rrdd-certificate-form{padding:18px}.rrdd-certificate-form .rrdd-avatar-grid{max-width:290px!important}}
@media(max-width:360px){.rrdd-certificate-form .rrdd-avatar-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}}

/* One quiet cue for a meaningful next action; never flash every control. */
.rrdd-game-shell :is(.word-game-button,.sentence-play,.nav-button,#quizNext,.quiz-speak){min-height:44px!important}
.rrdd-game-shell .quiz-speak{min-width:44px!important}
.rrdd-game-shell .guide-pulse:not(:disabled):not(.playing),.rrdd-game-shell :is(#quizNext,#nextRound,#readNext,#nextDiscovery,#watchNext,#followButton,#next,#trophy,#trophyRoute):not(:disabled):not([hidden]){animation:rrdd-action-guide 2.4s ease-in-out infinite!important}
@keyframes rrdd-action-guide{0%,100%{box-shadow:0 0 0 0 #ffcf5740}50%{box-shadow:0 0 0 6px #ffcf5760}}
@media(prefers-reduced-motion:reduce){.rrdd-game-shell .guide-pulse:not(:disabled):not(.playing),.rrdd-game-shell :is(#quizNext,#nextRound,#readNext,#nextDiscovery,#watchNext,#followButton,#next,#trophy,#trophyRoute):not(:disabled):not([hidden]){animation:none!important;outline:3px solid #e8b846;outline-offset:3px}}
