/* Shared HUD and footer layout. Used in both worlds after the material themes. */
html body #lesson .code-pane{padding-bottom:24px!important}
html body #lesson .scene-subtools{position:absolute;top:calc(100% + 10px);left:0;display:flex;align-items:center;gap:9px;white-space:nowrap}
html body #lesson .scene-toolbar .speed-control,
html body #lesson .scene-toolbar .task-toggle{
 position:static!important;inset:auto!important;margin:0!important;min-height:36px;
 display:flex;align-items:center;gap:8px;padding:5px 9px;
 background:#f8f0dc!important;border:1px solid #a29573!important;border-radius:6px;
 color:#384b37!important;text-shadow:none!important;font-size:14px!important;font-weight:700;
 opacity:1;box-shadow:inset 0 1px #fffdf4,0 2px 5px #534c3026
}
html body #lesson .scene-toolbar .speed-control select{
 min-width:66px;min-height:27px;padding:3px 5px;border:1px solid #9b9e7c;border-radius:4px;
 background:#fffdf1!important;color:#263e2b!important;text-shadow:none!important;
 font-size:14px!important;font-weight:700;opacity:1;cursor:pointer
}
html body #lesson .scene-toolbar .speed-control option{background:#fffdf1;color:#263e2b}
/* Run labels sit inside the button, freeing the row beneath the controls. */
html body #lesson .run-code:after{bottom:3px!important;font-size:9px!important;line-height:1;letter-spacing:0;color:#fff9e5!important;text-shadow:0 1px #26482b}
html body #lesson .run-code>span{background-position:center 36%!important;background-size:30px 30px!important}
html body #lesson .scene-region-hud{
 position:absolute;top:105px;right:20px;z-index:10;display:flex;flex-direction:column;
 align-items:flex-end;gap:12px;width:min(210px,calc(50% - 28px));pointer-events:none
}
html body #lesson .scene-region-hud .collect-counter{
 position:static!important;inset:auto!important;margin:0;max-width:100%;flex-shrink:0;
 justify-content:center;white-space:nowrap;box-sizing:border-box
}
html body #lesson .scene-region-hud .gobek-site-plaque{
 position:static!important;inset:auto!important;max-width:100%;width:100%;height:auto;
 align-items:center;gap:7px;box-sizing:border-box
}
html body #lesson .scene-region-hud .gobek-site-plaque svg{width:32px;height:38px;flex:0 0 32px}
html body #lesson .scene-region-hud .gobek-site-plaque>span{min-width:0;flex:1}
html body #lesson .scene-region-hud .gobek-site-plaque b{font-size:clamp(16px,1.55vw,22px);line-height:1.15;overflow-wrap:anywhere}
html body #lesson .scene-region-hud .gobek-site-plaque small{font-size:10px;line-height:1.3}
html body #lesson .scene-region-hud .gobek-site-plaque em{font-size:9px;letter-spacing:.7px;line-height:1.3}
html body #lesson .lesson-scene .weather-card{top:145px!important;max-width:calc(50% - 28px)!important}
html body #lesson .lesson-scene .mission-state{top:var(--scene-data-top,170px)!important;max-width:calc(50% - 28px)!important}
html body #lesson[data-world="gobeklitepe"] .lesson-scene .mission-state{top:var(--scene-weather-data-top,225px)!important}
html body #lesson .scene-caption-dock{
 position:absolute;z-index:12;left:24px;right:72px;bottom:var(--scene-caption-bottom,270px);
 display:flex;align-items:flex-end;gap:10px;pointer-events:none
}
html body #lesson .scene-caption-copy{min-width:0;flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:7px}
html body #lesson .scene-caption-dock .level-route-label,
html body #lesson .scene-caption-dock .scene-badge{
 position:static!important;inset:auto!important;margin:0;max-width:100%;width:auto;
 box-sizing:border-box;line-height:1.35;white-space:normal;overflow-wrap:anywhere
}
html body #lesson .scene-caption-dock .scene-badge{padding:7px 9px;border-radius:7px;background:#3e4939ed}
html body #lesson .scene-caption-dock .scene-badge b{font-weight:600}
html body #lesson .scene-caption-dock .level-route-label{background:#f4e8ccf5;color:#4e553d!important;padding:6px 8px;text-shadow:none;border-color:#fff9e1}
html body #lesson .scene-caption-dock .scene-compass{position:static!important;inset:auto!important;margin:0;flex:0 0 32px;width:32px;height:32px}
html body #lesson .scene-reset-view{bottom:var(--scene-caption-bottom,270px)!important;right:24px}
/* The status line belongs to the editor footer, not underneath its border. */
html body #lesson .workspace-foot{position:relative;flex-shrink:0;padding-bottom:14px!important;min-height:0!important}
html body #lesson .workspace-footer-main{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;min-width:0}
html body #lesson .workspace-footer-main .lesson-brand{min-width:0;flex:1 1 175px}
html body #lesson .workspace-footer-main .back-atlas{
 position:static!important;inset:auto!important;margin:0!important;order:initial;
 display:flex;align-items:center;min-height:30px;padding:5px 8px;font-size:12px;
 flex:0 0 auto;white-space:nowrap;z-index:auto
}
html body #lesson .workspace-footer-main .back-atlas span{display:inline}
html body #lesson .workspace-foot .lesson-statusbar{
 position:static!important;inset:auto!important;margin:0!important;padding:8px 0 0!important;
 height:auto!important;min-height:30px;max-width:100%;display:grid;
 grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:8px;
 border-top:1px solid #a2947359;z-index:auto;background:none
}
html body #lesson .workspace-foot .lesson-statusbar #code-message{
 display:block;min-width:0;overflow:visible;white-space:normal;text-overflow:clip;
 line-height:1.4;font-size:12px!important;color:inherit!important
}
html body #lesson .workspace-foot .lesson-statusbar #saved-indicator{font-size:11px!important;line-height:1.4;white-space:normal;text-align:right;max-width:98px;color:inherit!important}
html body #lesson #workspace{scrollbar-width:none}
html body #lesson #workspace::-webkit-scrollbar{display:none}
@media(max-width:1100px){
 html body #lesson .scene-region-hud{right:16px;top:105px;gap:10px}
 html body #lesson .scene-caption-dock{left:20px;right:64px}
 html body #lesson .scene-subtools{gap:6px}
 html body #lesson .scene-toolbar .speed-control,html body #lesson .scene-toolbar .task-toggle{font-size:13px!important;padding:4px 7px;gap:5px}
}
@media(max-width:760px){
 html body #lesson .scene-region-hud{top:119px;right:14px;gap:10px;width:calc(50% - 24px)}
 html body #lesson .scene-region-hud .gobek-site-plaque svg{width:26px;flex-basis:26px}
 html body #lesson .scene-region-hud .gobek-site-plaque b{font-size:17px}
 html body #lesson .scene-region-hud .gobek-site-plaque small{font-size:9px}
 html body #lesson .scene-region-hud .gobek-site-plaque em{font-size:8px;letter-spacing:.3px}
 html body #lesson .lesson-scene .weather-card{top:145px!important;max-width:calc(50% - 25px)!important}
 html body #lesson .lesson-scene .mission-state{max-width:calc(50% - 25px)!important}
 html body #lesson .scene-caption-dock{left:14px;right:59px}
 html body #lesson .scene-caption-dock .level-route-label,html body #lesson .scene-caption-dock .scene-badge{font-size:11px!important}
 html body #lesson .scene-reset-view{right:14px}
 html body #lesson .scene-toolbar .speed-control,html body #lesson .scene-toolbar .task-toggle{min-height:33px}
 html body #lesson .scene-toolbar .speed-control select{font-size:14px!important;min-width:62px}
 html body #lesson .run-code:after{font-size:7px!important;bottom:2px!important}
 html body #lesson .run-code>span{background-size:25px 25px!important;background-position:center 32%!important}
 html body #lesson .workspace-foot .lesson-statusbar{grid-template-columns:minmax(0,1fr)}
 html body #lesson .workspace-foot .lesson-statusbar #saved-indicator{max-width:none;text-align:left}
}
html body #lesson .scene-region-hud .level-pill{position:static!important;inset:auto!important;margin:0;max-width:100%;padding:7px 9px;min-height:32px;white-space:normal;text-align:left;pointer-events:auto!important;text-shadow:none}
html body #lesson[data-world="cappadocia"] .lesson-scene .mission-state{left:auto!important;right:20px!important;width:230px!important;display:block}
html body #lesson[data-world="gobeklitepe"] .lesson-scene .mission-state{left:20px!important;right:auto!important}
@media(max-width:760px){html body #lesson[data-world="cappadocia"] .lesson-scene .mission-state{right:14px!important}html body #lesson[data-world="gobeklitepe"] .lesson-scene .mission-state{left:14px!important}html body #lesson .scene-region-hud .level-pill{font-size:12px;padding:6px 8px}}
/* Footer remains visible when blocks are replaced by the Python or Java editor. */
html body #lesson .code-pane>.workspace-foot{flex:0 0 auto;grid-column:auto;grid-row:auto}
html body #lesson .workspace-area{grid-template-rows:auto minmax(0,1fr)}
@media(max-width:760px){html body #lesson[data-world="gobeklitepe"][data-level="10"] .result-pane{height:760px;min-height:760px}}
@media(max-width:760px){html body #lesson .scene-region-hud{top:136px}}