/* WOPH word-world identity: lively Home, gentler lesson canvas. */
.everyday-home.word-home{background:#ffdc55 url('assets/ornaments/word-world-reference-v2.webp') center top / 100% clamp(690px,216vw,1120px) no-repeat!important}
.everyday-home .word-home-header{grid-template-columns:minmax(0,1fr) 56px 56px;column-gap:12px!important}
.everyday-home .word-home-header .music-button,.everyday-home .word-home-header .word-parent{width:56px!important;height:56px!important;min-width:56px!important;min-height:56px!important;padding:0!important;border-radius:19px!important;box-sizing:border-box!important}
.everyday-home .word-home-header .music-button .woph-ui-glyph,.everyday-home .word-home-header .word-parent .woph-ui-glyph{width:31px!important;height:31px!important}
/* Keep activity instructions legible and the board visually dominant. */
:is(.literacy-player,.spell-player,.twins-player,.trace-player,.play-player,.count-player,.upper-journey,.letters-player){background:linear-gradient(#fff8e9e8,#fff8e9ee),url('assets/ornaments/word-world-reference-v2.webp') center top / min(100%,520px) 100% no-repeat,#fff8e9!important}
:is(.literacy-player,.spell-player,.twins-player,.trace-player,.play-player,.count-player,.upper-journey,.letters-player)::backdrop{background:#fff8e9}
/* Welcome and parent surfaces use a quieter tint to keep form labels clear. */
.woph-welcome,.screen:not(.word-home),.onboard,.profiles-screen,.parent-shell{background:linear-gradient(#fff5d8eb,#fff5d8f2),url('assets/ornaments/word-world-reference-v2.webp') center top / min(100%,520px) auto no-repeat,#fff5d8}
/* Small screens: keep spelling picture, slots and letter choices visible together. */
@media(max-height:700px){
 .spell-shell:not(.spell-summary) .spell-main{gap:6px;padding:4px 2px;justify-content:flex-start}
 .spell-shell:not(.spell-summary) .spell-kicker,.spell-shell:not(.spell-summary) .spell-instruction{display:none}
 .spell-shell:not(.spell-summary) .spell-main h1{font-size:23px;line-height:1.1}
 .spell-shell:not(.spell-summary) .spell-picture{width:96px;height:88px;min-height:88px;border-radius:24px!important}
 .spell-shell:not(.spell-summary) .spell-picture>img{width:82px;height:82px}
 .spell-shell:not(.spell-summary) .spell-picture>span{width:34px;height:34px;right:0;bottom:0}
 .spell-shell:not(.spell-summary) .spell-slots,.spell-shell:not(.spell-summary) .spell-bank{gap:6px;padding:0}
 .spell-shell:not(.spell-summary) .spell-slot{height:62px;min-height:62px}
 .spell-shell:not(.spell-summary) .spell-glyph{height:52px}
 .spell-shell:not(.spell-summary) .spell-tile{height:72px;min-height:72px}
 .spell-shell:not(.spell-summary) .spell-coach{min-height:24px;padding:0}
 .spell-shell:not(.spell-summary) .spell-coach img{display:none}
 .spell-shell:not(.spell-summary) .spell-status{font-size:12px;line-height:1.25;text-align:center;width:100%}
}
/* Continue the word-world ornaments down the full scrolling home page. */
.everyday-home.word-home{position:relative;isolation:isolate;overflow:hidden}
.everyday-home.word-home::before{content:'';position:absolute;z-index:0;pointer-events:none;top:clamp(690px,216vw,1120px);bottom:0;left:0;right:0;background:url('assets/ornaments/word-world-reference-v2.webp') center top / 100% clamp(690px,216vw,1120px) repeat-y;opacity:.56;mask-image:linear-gradient(to right,#000 0%,#000 4%,transparent 20%,transparent 80%,#000 96%,#000 100%)}
.everyday-home .word-home-header,.everyday-home .word-home-content{position:relative;z-index:1}
/* A single continuous illustration. Cover keeps its proportions on phones and tablets. */
.everyday-home.word-home{background:#ffdc55 url('assets/ornaments/word-world-long-v2.webp') center top / cover no-repeat!important}
.everyday-home.word-home::before{content:none!important}
/* Center the play area on landscape tablets and keep the surrounding canvas warm. */
body:has(.everyday-home){background:#ffdc55!important}
.everyday-home.word-home{margin-inline:auto;background-image:url('assets/ornaments/word-world-long-v4.webp')!important}

/* Restore the dark Twin Connect canvas so its light instructions remain readable. */
.twins-player{background:linear-gradient(#573390e8,#5a3692ee),url('assets/ornaments/word-world-reference-v2.webp') center top / min(100%,520px) 100% no-repeat,#573390!important}
.twins-player::backdrop{background:#573390!important}
.twins-player .lit-demo-launch{color:#fff9e8}
/* Keep the language switch, brand and back/skip controls in separate columns. */
.woph-welcome:not(.auth-portrait) .welcome-header{display:grid;grid-template-columns:minmax(64px,1fr) minmax(76px,118px) minmax(94px,1fr);align-items:center;gap:4px}
.woph-welcome:not(.auth-portrait) .welcome-header .welcome-logo{grid-column:2;grid-row:1;width:100%;max-width:118px;justify-self:center}
.woph-welcome:not(.auth-portrait) .welcome-header .welcome-back{grid-column:1;grid-row:1;position:static;justify-self:start;width:64px;min-width:64px;height:64px}
.woph-welcome:not(.auth-portrait) .welcome-header .welcome-skip{grid-column:3;grid-row:1;position:static;justify-self:end;max-width:100%;min-width:64px;min-height:56px;padding:6px;font-size:13px;text-align:right;line-height:1.2}
/* Keep the sentence picture, listening action, answer and choices together. */
.literacy-player[data-mode="order"] .lit-main{gap:8px;padding:6px 4px}
.literacy-player[data-mode="order"] .lit-kicker{display:none}
.literacy-player[data-mode="order"] .lit-story-art{height:84px}
.literacy-player[data-mode="order"] .lit-order-slots{min-height:68px;padding:6px;gap:6px}
.literacy-player[data-mode="order"] .lit-token-bank{padding:4px 0;gap:8px}
.literacy-player[data-mode="order"] .lit-word-token{min-height:64px;min-width:64px;padding:8px 10px;font-size:18px}
.literacy-player[data-mode="order"] .lit-main>.lit-secondary{min-height:56px;padding:8px;font-size:16px}
@media(max-height:700px){.literacy-player[data-mode="order"] .lit-story-art{height:56px}.literacy-player[data-mode="order"] .lit-main h1{font-size:23px}.literacy-player[data-mode="order"] .lit-main{gap:5px;padding:4px}.literacy-player[data-mode="order"] .lit-order-slots{min-height:55px}.literacy-player[data-mode="order"] .lit-word-token{min-height:56px;min-width:56px;font-size:16px;padding:6px 8px}.literacy-player[data-mode="order"] .lit-main>.lit-secondary{min-height:48px}.literacy-player[data-mode="order"] .lit-coach.has-feedback img{display:none}}
/* Fit the matching board, guidance and controls within portrait screens. */
@media(min-width:0px){
 .twins-shell:not(.twins-summary){height:100svh;min-height:0;padding-top:10px;padding-bottom:max(12px,env(safe-area-inset-bottom))}
 .twins-shell:not(.twins-summary) .twins-main{min-height:0;padding:6px 0;justify-content:center}
 .twins-shell:not(.twins-summary) .twins-board{max-width:min(100%,300px,calc(100svh - 365px))}
 .twins-shell:not(.twins-summary) .twins-eyebrow{margin:0 0 4px}
 .twins-shell:not(.twins-summary) .twins-main h1{font-size:24px;line-height:1.15}
 .twins-shell:not(.twins-summary) .twins-instruction{margin:6px 0 10px;font-size:13px}
 .twins-shell:not(.twins-summary) .twins-pair-count{margin:8px 0;font-size:16px}
 .twins-shell:not(.twins-summary) .twins-coach{min-height:46px;padding:4px 8px}
 .twins-shell:not(.twins-summary) .twins-coach img{width:36px;height:40px}
 .twins-shell:not(.twins-summary) .twins-status{font-size:12px;line-height:1.35}
 .twins-shell:not(.twins-summary) .twins-bottom{flex-shrink:0}
}
/* Preserve space between demo, board, feedback and footer on small screens. */
.twins-player .lit-demo-launch{min-height:44px;padding:6px 8px;flex-shrink:0}
.twins-shell:not(.twins-summary) .twins-board{max-width:min(100%,300px,calc(100svh - 410px))}
.twins-shell:not(.twins-summary) .twins-main{flex:1 1 auto;min-height:0}
/* Landscape tablets have room for a wider catalog while keeping cards readable. */
@media(min-width:900px) and (orientation:landscape){
 .everyday-home.word-home{max-width:900px}
 .everyday-home .word-home-content{max-width:none;padding-inline:32px}
 .everyday-home .word-home-header{padding-inline:32px}
 .everyday-home .discovery-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
 .everyday-home .world-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
}
@media(min-width:900px) and (orientation:landscape){.everyday-home .word-home-header{max-width:none;width:100%;margin:0;box-sizing:border-box}}
/* Contextual storybook artwork stays within the rounded reading panel. */
.lit-story-art.story-scene{object-fit:cover;object-position:center;border-radius:28px}
.piper-preview-panel{padding:18px;margin:16px 0;border:2px solid #e4d5f1;border-radius:24px;background:#f5efff;color:#302047}.piper-preview-panel h3{margin:0;font:600 19px Fredoka,sans-serif}.piper-preview-panel p{font:14px/1.55 Andika,sans-serif}.piper-preview-panel button{min-height:56px;min-width:0;width:100%;margin-top:8px;padding:12px;border:2px solid #cbb5df;border-radius:18px;background:#fff;color:#4c2e79;font:500 16px Fredoka,sans-serif}.piper-preview-panel button[aria-pressed=true]{background:#dfefdf;border-color:#559a72;color:#245f44}.piper-status:empty{display:none}
.demo-practice-grid{display:grid;grid-template-columns:repeat(3,72px);gap:6px;justify-content:center}.demo-practice-grid button{width:72px;height:72px;min-height:72px;border:2px solid #d4c4e4;border-radius:18px;background:#f7f1ff;color:#513595;font:600 32px Andika,sans-serif}.demo-practice-grid button.on-path{background:#c4ead5;border-color:#328664;color:#174f3a}.demo-practice-status{font:14px/1.4 Andika,sans-serif;margin:0;color:#302047}.lit-demo-sheet [data-starter-practice]{font-size:16px;min-height:56px}
.lit-demo-sheet.is-practicing .demo-copy,.lit-demo-sheet.is-practicing .demo-controls,.lit-demo-sheet.is-practicing [data-starter-practice],.lit-demo-sheet.is-practicing .starter-audio-status{display:none}

/* A gentle visual cue accompanies the spoken picture name after a retry. */
.literacy-player .lit-choice.try-again{border-color:#be7950;box-shadow:0 5px 0 #9c5f3c}

.demo-sound-cue{display:flex;align-items:center;justify-content:center;gap:8px}.demo-sound-cue img{width:42px;height:42px;object-fit:contain}

/* Listening to a story choice is separate from submitting an answer. */
.lit-option{display:flex;gap:8px;min-width:0;width:100%;align-items:stretch}
.lit-choices.is-text .lit-option .lit-choice{flex:1;min-width:0}
.lit-choice-listen{display:grid;place-items:center;flex:0 0 72px;width:72px;min-height:72px;border:2px solid #fff;border-radius:22px;background:#eee3fa;box-shadow:0 4px 0 #c7b3df;color:#51327c}
.lit-choice-listen .world-icon{width:30px;height:30px}

.lit-beat-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media (prefers-reduced-motion:no-preference){.lit-beat-count>span:last-of-type{animation:woph-beat-pop .2s ease-out}@keyframes woph-beat-pop{from{transform:scale(.45)}to{transform:scale(1)}}}

@media(max-height:700px){.literacy-player[data-mode="story"] .lit-main:has(.lit-choices.is-text){gap:5px;padding:4px 0}.literacy-player[data-mode="story"] .lit-main:has(.lit-choices.is-text) h1{font-size:22px;line-height:1.12}.literacy-player[data-mode="story"] .lit-main:has(.lit-choices.is-text) .lit-story-art{height:56px}.literacy-player[data-mode="story"] .lit-choices.is-text{gap:6px;margin:0}.literacy-player[data-mode="story"] .lit-choices.is-text .lit-choice{min-height:72px;padding:8px 12px}.literacy-player[data-mode="story"] .lit-main:has(.lit-choices.is-text) .lit-coach:not(.has-feedback){display:none}}
.literacy-player[data-mode="story"] .lit-footer:has(.lit-tools){display:block}
.literacy-player[data-mode="story"] .lit-footer .lit-tools .lit-secondary{padding:8px;font-size:15px;gap:6px}
.literacy-player[data-mode="story"] .lit-footer .lit-tools{grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
@media(prefers-reduced-motion:no-preference){.literacy-player .lit-choice.correct{animation:woph-correct-celebrate .3s ease-out}@keyframes woph-correct-celebrate{0%{transform:scale(.96)}60%{transform:scale(1.025)}100%{transform:scale(1)}}}

/* Four friends remain easy to choose on the character step. */
.literacy-player[data-book-step="1"] .lit-book-choices{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-height:700px){.literacy-player[data-book-step="1"] .lit-main{gap:6px;padding:4px 0}.literacy-player[data-book-step="1"] .lit-art{height:60px;width:76px}.literacy-player[data-book-step="1"] .lit-book-choice{min-height:88px;padding:5px 8px}.literacy-player[data-book-step="1"] .lit-book-choice img{height:58px}}