/* Approved cream/forest learning screens, shared by mobile and desktop. */
.word-unit{white-space:nowrap}
.practice-workspace{background:#fbfcf8}
.practice-workspace main{max-width:900px}
.practice-workspace .learning-grid{display:flex;flex-direction:column;gap:30px}
.practice-workspace .learning-grid>[hidden],.practice-workspace [hidden]{display:none!important}
.practice-workspace .listening-card,.practice-workspace .reading-module,.practice-workspace .shadow-live{width:100%;max-width:760px;margin:0 auto}
.practice-workspace .vocabulary-card{width:100%;max-width:760px;margin:0 auto;padding:20px 24px;border-top:1px solid #dbe3d3}
.vocabulary-card h2{display:flex;align-items:center;gap:14px;font-size:23px;color:#294535;margin:0 0 12px}
.vocabulary-card .vocab-list{padding:0}
.vocabulary-card .vocab{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid #dbe3d3}
.vocabulary-card .vocab:last-child{border-bottom:0}
.vocab-copy strong{font-size:21px;font-weight:700;color:#294535}
.vocab-copy p{font-size:15px;line-height:1.65;color:#53634a;margin-top:4px}
.vocabulary-card .vocab>button{width:44px;height:44px;flex-shrink:0;border-radius:12px;background:#e7eddc;color:#345d43}
.practice-workspace .shadow-live{background:transparent;border:0;box-shadow:none;overflow:visible}
.shadow-live .shadow-body{padding:18px 24px 24px}
.shadow-heading{padding-left:24px}
.shadow-progress-head strong{font-size:15px;line-height:1.5;color:#294535}
.shadow-progress-track{height:6px;margin:16px 0 38px}
.shadow-progress-track span{background:#345d43}
.shadow-live .shadow-current-card{position:relative;padding:0 0 24px;margin:0;border:0;border-radius:0;min-height:0;background:transparent;box-shadow:none}
.shadow-live .shadow-current-card p[lang=en]{font-size:24px!important;line-height:1.55;font-weight:600;letter-spacing:-.2px;color:#294535;margin:0;padding-right:48px}
.shadow-live .shadow-current-card p:not([lang]){font-size:15px;color:#53634a;line-height:1.75;margin:20px 0 0}
.shadow-live .shadow-reference-icon{position:absolute;right:0;top:2px;display:grid;place-items:center;width:40px;min-height:40px;padding:8px;border-radius:12px;background:#e7eddc;color:#345d43}
.shadow-reference-icon svg{width:23px;height:23px}
.shadow-live .shadow-guide{display:flex;align-items:center;gap:10px;min-height:135px;border:0;margin:18px 0 12px;padding-top:0;background:transparent}
.shadow-live .shadow-guide>img{width:90px;height:110px;object-fit:contain}
.shadow-success-copy{display:none}
.shadow-live .shadow-guide.is-encouraging>img{width:150px;height:175px}
.shadow-guide.is-encouraging .shadow-success-copy{display:flex;align-items:center;gap:7px;flex:1;padding:18px 12px;border-radius:22px;background:#e7eddc;color:#294535;font-size:20px;line-height:1.6}
.shadow-success-copy .shadow-success-paw{width:28px;height:28px;object-fit:contain}
.shadow-success-copy strong{white-space:pre-line}
.shadow-primary{display:flex;flex-direction:column;align-items:center;gap:16px;margin:40px 0 12px}
.shadow-primary .shadow-record-button{display:grid;place-items:center;flex:none;width:96px;height:96px;min-height:96px;padding:0;margin:0;background:#345d43;color:#fffef8;border:0;border-radius:50%;box-shadow:none}
.shadow-primary .shadow-record-button svg{display:block;width:56px;height:56px;stroke-width:1.6}
.shadow-primary [data-shadow-button-label]{font-size:16px;font-weight:500;color:#345d43;line-height:1.5;text-align:center}
.shadow-primary .shadow-record-button[data-state=stop]{animation:mic-listening 1.5s ease-in-out infinite}
.shadow-primary .shadow-record-button[data-state=feedback]{background:#4b7352}
.shadow-primary .shadow-record-button:disabled{opacity:1;background:#69816a;box-shadow:none;cursor:wait}
@keyframes mic-listening{50%{box-shadow:0 0 0 8px #dfead7}}
.shadow-tools{display:grid;gap:4px;border-top:1px solid #dbe3d3;margin-top:6px;padding-top:6px;min-width:190px}
.shadow-tools .mode-tabs{display:grid;gap:4px;margin:0;border:0}
.shadow-tools .mode-tabs button{border-radius:8px;min-height:44px;font-size:14px;padding:8px;text-align:left;box-shadow:none}
.shadow-tools .shadow-navigation{display:flex;gap:4px;margin:4px 0}
.shadow-tools button{font-size:14px!important;min-height:44px;width:100%;padding:10px!important;text-align:left;border-radius:8px;color:#294535;background:transparent}
.shadow-tools button[aria-pressed=true],.shadow-tools button:hover{background:#e7eddc}
.shadow-tools [hidden]{display:none!important}
.shadow-tools .shadow-sentence-tools{display:grid;gap:2px}
.shadow-more{margin-bottom:16px;text-align:right}
.shadow-more>summary{cursor:pointer;font-size:14px;min-height:40px;color:#53634a}
.shadow-more .shadow-tools{text-align:left}
.shadow-live .shadow-done h3{font-size:23px;margin:12px 0 28px}
.quiz-next{display:block;width:100%;min-height:52px;border-radius:14px;background:#345d43;color:#fffef8;font-size:17px;font-weight:650;padding:12px 18px;margin-top:24px}
.quiz-next:disabled{background:#e7eddc;color:#53634a;cursor:default}
.practice-workspace .reading-module.is-quiz{border:0;background:transparent;box-shadow:none;overflow:visible;max-width:760px}
.practice-workspace:has(.reading-quiz .quiz-progress) #checkin-panel{display:none!important}
.reading-module.is-quiz>.section-heading{display:none}
.practice-workspace .reading-module.is-quiz .reading-module-body{margin:0}
.practice-workspace .reading-module.is-quiz .reading-quiz{border:0;padding-top:12px}
.quiz-progress strong{font-size:22px;color:#294535}
.quiz-progress progress{display:block;width:100%;height:7px;margin:16px 0 36px;border:0;border-radius:10px;overflow:hidden;appearance:none;background:#e2e8d8;color:#345d43}
.quiz-progress progress::-webkit-progress-bar{background:#e2e8d8}
.quiz-progress progress::-webkit-progress-value{background:#345d43}
.quiz-progress progress::-moz-progress-bar{background:#345d43}
.quiz-question-head{display:flex;align-items:start;gap:14px;margin-bottom:22px}
.quiz-question-head h3{font-size:25px;line-height:1.55;color:#294535;flex:1;min-width:0}
.quiz-question-head>button{color:#345d43;min-height:44px;font-size:14px;text-decoration:underline;text-underline-offset:4px;flex-shrink:0}
.reading-quiz .question{padding:0;border:0;min-width:0}
.reading-quiz .question legend.visually-hidden{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.reading-quiz .quiz-option{border:1px solid #cbd5c0;border-radius:13px;min-height:56px;align-items:center;margin:0 0 10px;padding:10px 12px;gap:8px;color:#294535;font-size:18px;line-height:1.6}
.reading-quiz .quiz-option.chosen{border-color:#7b8f70;background:#eef1e6}
.reading-quiz .quiz-option.is-correct{border:2px solid #345d43;background:#e7eddc}
.reading-quiz .quiz-option>svg{width:25px;height:25px;color:#345d43;flex-shrink:0}
.reading-quiz .quiz-option input{accent-color:#345d43;width:22px;height:22px;margin:4px 7px 4px 0;flex-shrink:0}
.quiz-result{display:flex;align-items:center;gap:12px;margin:28px 0 0;padding:16px 14px;border-radius:20px;background:#e7eddc;color:#294535}
.quiz-result.is-review{background:#f0efdf}
.quiz-kaikai{width:100px;height:120px;object-fit:contain;flex-shrink:0}
.quiz-result>div{min-width:0;flex:1}
.quiz-result strong{font-size:23px;line-height:1.4;display:flex;align-items:center;gap:7px}
.quiz-result strong>svg{width:26px;height:26px;padding:5px;border-radius:50%;background:#345d43;color:#fffef8}
.quiz-result p{font-size:15px;color:#53634a;line-height:1.75;margin-top:8px}
.quiz-result p[lang=en]{font-size:17px;font-weight:650;color:#294535}
.quiz-done{text-align:center;padding:20px}
.quiz-done .quiz-kaikai{width:160px;height:170px}
.quiz-done h3{font-size:24px;margin:16px 0}
.quiz-done button{min-height:44px;color:#345d43;text-decoration:underline}
@media(max-width:760px){
 :root{--mobile-dock-height:78px}
 .practice-workspace main{padding-left:20px!important;padding-right:20px!important}
 #app[data-mobile-module] .learning-grid{gap:24px}
 #app[data-mobile-module="shadow"] .practice-scene,#app[data-mobile-module="reading"] .practice-scene{display:none}
 #app[data-mobile-module="reading"] .vocabulary-card,#app[data-mobile-module="reading"] .shadow-preview{display:none!important}
 #app[data-mobile-module] .vocabulary-card{padding:16px 0;margin-top:2px}
 #app[data-mobile-module] .vocab-list{padding:0}
 #app[data-mobile-module] .shadow-live .shadow-heading{display:none}
 #app[data-mobile-module] .shadow-live .shadow-body{padding:14px 0 20px}
 #app[data-mobile-module] .shadow-live .shadow-current-card{padding:0 0 22px;min-height:0;border:0;border-radius:0}
 #app[data-mobile-module="shadow"] .shadow-live [data-shadow-reference]{display:grid}
 #app[data-mobile-module] .shadow-live .shadow-current-card p[lang=en]{font-size:24px!important;line-height:1.55}
 #app[data-mobile-module] .shadow-live .shadow-current-card p:not([lang]){font-size:15px!important;line-height:1.75}
 #app[data-mobile-module] .shadow-live .shadow-progress-head strong{font-size:15px}
 .practice-workspace .practice-header h1{font-size:17px}
 #app[data-mobile-module] .mobile-step-nav button{font-size:14px}
 .practice-workspace .mobile-step-nav button>span{display:none}
 #app[data-mobile-module] .desktop-quiz-action,#app[data-mobile-module] .desktop-quiz-start{display:none!important}
 #app[data-mobile-module="shadow"] .mobile-learning-dock{display:none!important}
 #app[data-mobile-module="shadow"] main{padding-bottom:calc(232px + env(safe-area-inset-bottom,0px))!important}
 #app[data-mobile-module="shadow"] .shadow-live .shadow-primary{display:flex!important;position:fixed;left:0;right:0;bottom:0;z-index:64;gap:16px;margin:0;padding:16px 20px calc(60px + env(safe-area-inset-bottom,0px));background:#fbfcf8;border:0}
 #app[data-mobile-module="shadow"] .shadow-live [data-shadow-record]{display:grid;width:96px;height:96px;min-height:96px}
 #app[data-mobile-module] .reading-module.is-quiz .reading-quiz{padding:10px 0 24px!important}
 #app[data-mobile-module] .reading-module.is-quiz .reading-module-body{margin:0}
 #app[data-mobile-module] .quiz-question-head h3{font-size:24px}
 #app[data-mobile-module] .reading-quiz .quiz-option{font-size:18px;padding:12px;align-items:center;min-height:60px}
 .quiz-result{padding:14px 12px;gap:8px}
 .quiz-kaikai{width:125px;height:150px}
 .quiz-result strong{font-size:22px}
 .quiz-result p{font-size:14px}
 #app[data-mobile-module] .mobile-learning-dock[data-feedback=true] .mobile-next{background:#345d43;color:#fffef8;border-color:#345d43;opacity:1}
 .mobile-learning-dock .mobile-next{font-size:18px;font-weight:650;min-height:54px;border-radius:14px}
}
@media(prefers-reduced-motion:reduce){.shadow-guide,.quiz-result,.shadow-primary .shadow-record-button[data-state=stop]{animation:none}}