/* Итоговая компоновка оболочки. Картинки и геометрия игровых объектов здесь не меняются. */
.lesson-header{grid-template-columns:auto minmax(0,1fr) 120px auto;gap:10px 18px;padding:12px 24px}
.lesson-header>.back-button{grid-column:1;grid-row:1}
.lesson-header>.lesson-brand{grid-column:2;grid-row:1}
.lesson-header>.progress-block{grid-column:3;grid-row:1;width:120px}
.lesson-header>.header-actions{grid-column:4;grid-row:1}
.lesson-header>.header-stage{grid-column:1/-1;grid-row:2}
.stage-track{display:flex;flex-wrap:wrap;justify-content:center;gap:7px}
.stage-chip{font-size:1rem;line-height:1.2;padding:8px 12px;gap:7px;font-weight:600}
.stage-chip>span{font-size:.85rem;min-width:23px;height:23px}
.lesson-header .progress-copy{font-size:.8rem}
.lesson-main{min-height:0;grid-template-rows:minmax(0,1fr) auto}
.arena{margin-top:12px}
.arena.scene-home,.arena.scene-rooms,.arena.scene-balloons{background:transparent;border:0;box-shadow:none}
.arena>.task-area{top:22px;max-width:90%;padding:7px 16px}
.arena .task-area h2{font-size:clamp(1.3rem,2.3vw,1.85rem);line-height:1.2}
.colour-author-scene>.task-area{top:15px;padding:6px 14px}
.lesson-footer .feedback{font-size:.9rem;line-height:1.35}
@media(max-width:680px){
 .lesson-header{grid-template-columns:44px minmax(0,1fr) auto;padding:7px 10px;gap:7px}
 .lesson-header>.header-actions{grid-column:3;grid-row:1}
 .lesson-header>.header-stage{grid-column:1/-1;grid-row:2}
 .lesson-header>.progress-block{grid-column:1/-1;grid-row:3;width:100%;display:flex;gap:10px;align-items:center}
 .lesson-header .progress-copy{font-size:.75rem;margin:0;flex-shrink:0}
 .lesson-header .progress-track{flex:1}
 .stage-track{gap:5px}
 .stage-chip{font-size:.875rem;padding:6px 9px;gap:5px}
 .stage-chip>span{font-size:.75rem;min-width:20px;height:20px}
 .arena{margin-top:8px}
 .arena>.task-area{top:14px;padding:5px 10px}
 .arena .task-area h2{font-size:1.1rem}
 .colour-author-scene>.task-area{top:7px;padding:4px 8px}
 .lesson-footer .feedback{font-size:.8rem}
}
@media(max-height:560px) and (orientation:landscape){
 .lesson-header{padding:5px 12px;gap:5px 12px}
 .stage-track{gap:5px}.stage-chip{font-size:.875rem;padding:4px 8px;gap:5px}.stage-chip>span{font-size:.7rem;min-width:18px;height:18px}
 .arena{margin-top:7px}.arena>.task-area{top:12px;padding:4px 10px}.arena .task-area h2{font-size:1.05rem}
 .colour-author-scene>.task-area{top:5px;padding:3px 8px}
 .lesson-footer .feedback{font-size:.75rem}
}
.tree-interior>.task-area{top:14px;padding:6px 14px}
@media(max-width:680px){.tree-interior>.task-area{top:7px;padding:4px 8px}}
/* В изучении домика внимание направлено только на выбранный предмет. */
.tree-interior.is-focusing .interior-object:not(.is-focused){opacity:0;visibility:hidden;pointer-events:none;filter:none}
.tree-interior.is-focusing .interior-object.is-focused{opacity:1;visibility:visible;filter:drop-shadow(0 0 10px #ffdc55) drop-shadow(0 0 3px #fff4bd)}
.tree-interior.is-focusing .tree-roof.is-focused{background:#ffde6145}
/* Нижняя панель не меняет высоту при появлении слова и ответа. */
.lesson-word-row,.lesson-word-row:has([hidden]){display:flex;height:86px;min-height:86px;align-items:center;justify-content:center;padding-bottom:4px}
.lesson-footer .feedback{height:36px;min-height:36px;display:flex;align-items:center;justify-content:center;margin:0;padding:3px 0 7px}
/* Место для предметов зарезервировано на всех этапах комнат. */
.scene-rooms .rooms-layout{display:grid;grid-template-columns:minmax(0,1fr) 180px;align-items:center;justify-items:center;gap:16px;height:100%;width:100%}
.scene-rooms .rooms-layout .house-figure,.scene-rooms .rooms-layout:not(:has(.decorate-tray)) .house-figure{width:min(calc(var(--fit-height,300px)*1.333),calc(var(--fit-width,700px) - 205px));max-width:none}
.scene-rooms .house-tools:not(:has(.decorate-tray)){display:flex;visibility:hidden}
.scene-rooms .house-tools,.scene-rooms .house-tools:has(.decorate-tray){width:180px;height:auto;flex-direction:column}
@media(max-width:680px){
 .lesson-word-row,.lesson-word-row:has([hidden]){height:58px;min-height:58px}
 .lesson-footer .feedback{height:38px;min-height:38px}
 .scene-rooms .rooms-layout{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) 90px;gap:6px}
 .scene-rooms .rooms-layout .house-figure,.scene-rooms .rooms-layout:not(:has(.decorate-tray)) .house-figure{width:min(calc((var(--fit-height,300px) - 100px)*1.333),var(--fit-width,350px));max-width:none}
 .scene-rooms .house-tools,.scene-rooms .house-tools:has(.decorate-tray){width:100%;height:90px}
}
@media(max-height:560px) and (orientation:landscape){
 .lesson-word-row,.lesson-word-row:has([hidden]){height:48px;min-height:48px}
 .lesson-footer .feedback{height:28px;min-height:28px}
 .scene-rooms .rooms-layout{grid-template-columns:minmax(0,1fr) 180px;grid-template-rows:minmax(0,1fr);gap:16px}
 .scene-rooms .rooms-layout .house-figure,.scene-rooms .rooms-layout:not(:has(.decorate-tray)) .house-figure{width:min(calc(var(--fit-height,200px)*1.333),calc(var(--fit-width,750px) - 205px));max-width:none}
 .scene-rooms .house-tools,.scene-rooms .house-tools:has(.decorate-tray){width:180px;height:auto}
}
/* Закрытый дом занимает тот же размер, что и открытый на следующем этапе. */
.scene-rooms>.house-intro{width:min(calc(var(--fit-height,300px)*1.333),calc(var(--fit-width,700px) - 205px));height:auto;aspect-ratio:1448/1086;margin-right:196px}
.scene-rooms>.house-intro img{width:100%;height:100%;object-fit:contain}
@media(max-width:680px){.scene-rooms>.house-intro{width:min(calc((var(--fit-height,300px) - 100px)*1.333),var(--fit-width,350px));margin-right:0;margin-bottom:96px}}
@media(max-height:560px) and (orientation:landscape){.scene-rooms>.house-intro{width:min(calc(var(--fit-height,200px)*1.333),calc(var(--fit-width,750px) - 205px));margin-right:196px;margin-bottom:0}}
/* Компактная панель: помощь слева, слово по центру, продолжение справа. */
.lesson-footer{display:grid;grid-template-columns:minmax(0,1fr) minmax(210px,auto) minmax(0,1fr);grid-template-rows:60px 28px;column-gap:24px;padding:6px 28px max(8px,env(safe-area-inset-bottom));align-items:center}
.lesson-footer .lesson-controls{display:contents}
.lesson-footer .lesson-word-row,.lesson-footer .lesson-word-row:has([hidden]){grid-column:2;grid-row:1;height:60px;min-height:60px;padding:0;min-width:0}
.lesson-footer .feedback,.lesson-footer .feedback[data-kind="translation"]{grid-column:2;grid-row:2;height:28px;min-height:28px;padding:0;font-size:1rem;line-height:1.15;text-align:center;overflow-wrap:anywhere}
:root[data-word-style] .lesson-footer .word-pill{font-size:2.8rem;min-height:54px;min-width:210px;padding:3px 24px}
.lesson-footer [data-listen],.lesson-footer [data-hint]{grid-column:1;grid-row:1/3;min-height:48px;width:140px;font-size:.9rem;padding:10px 12px}
.lesson-footer [data-listen]{justify-self:start}.lesson-footer [data-hint]{justify-self:end}
.lesson-footer [data-next]{grid-column:3;grid-row:1/3;justify-self:end;min-height:50px;width:170px;font-size:1rem}
@media(max-width:1000px){.lesson-footer{column-gap:14px;padding-inline:18px}.lesson-footer [data-listen],.lesson-footer [data-hint]{width:112px;font-size:.8rem;padding:8px 6px}.lesson-footer [data-next]{width:125px}}
@media(max-width:760px){
 .lesson-footer{grid-template-columns:94px minmax(0,1fr) 94px;grid-template-rows:52px 42px;gap:2px 8px;padding:6px 10px max(8px,env(safe-area-inset-bottom))}
 .lesson-footer .lesson-word-row,.lesson-footer .lesson-word-row:has([hidden]){height:52px;min-height:52px}
 :root[data-word-style] .lesson-footer .word-pill{min-width:0;width:auto;max-width:100%;min-height:42px;font-size:clamp(1.3rem,5vw,2rem);padding:5px 10px;overflow-wrap:anywhere}
 .lesson-footer [data-listen],.lesson-footer [data-hint]{grid-column:1;justify-self:stretch;width:100%;min-height:42px;font-size:.75rem;gap:4px;padding:7px 4px}
 .lesson-footer [data-listen]{grid-row:1}.lesson-footer [data-hint]{grid-row:2}
 .lesson-footer [data-next]{grid-column:3;grid-row:1/3;width:100%;min-height:48px;font-size:.8rem;padding:8px 4px;gap:4px}
 .lesson-footer .feedback,.lesson-footer .feedback[data-kind="translation"]{height:42px;min-height:42px;font-size:.8rem}
 .lesson-footer svg.icon{width:16px;height:16px}
}
@media(max-width:359px){.lesson-footer{grid-template-columns:82px minmax(0,1fr) 82px;column-gap:5px;padding-inline:8px}.lesson-footer [data-listen],.lesson-footer [data-hint]{font-size:.65rem}.lesson-footer [data-next]{font-size:.7rem}:root[data-word-style] .lesson-footer .word-pill{font-size:1.3rem;padding-inline:5px}.lesson-footer [data-next] svg{display:none}}
