/* Scoped screen contract. All off-page material has explicit page controls. */
[hidden]{display:none!important}
body:not(.adult-mode){position:fixed;inset:0;width:var(--view-width,100%);height:var(--view-height,100dvh);overflow:hidden}
body:not(.adult-mode) #app .shell,body:not(.adult-mode) #app .workspace{height:var(--view-height,100dvh)!important;min-height:0!important;max-height:var(--view-height,100dvh)!important}
body:not(.adult-mode) #app .workspace{display:flex;flex-direction:column;width:100%;margin:0 auto}
body:not(.adult-mode) #app .main{flex:1 1 0!important;min-height:0!important;height:auto;display:flex;flex-direction:column;padding:8px 18px!important;gap:8px;overflow:hidden}
body:not(.adult-mode) #app .topbar{flex:none;height:60px!important;min-height:60px!important;padding:5px 18px!important}
body:not(.adult-mode) #app .app-footer{height:22px!important;min-height:22px!important;position:static!important;margin:0!important;flex:none;padding:2px 18px!important}
#app .child-ui *,.child-dialog *{scrollbar-width:none}
#app .child-ui *::-webkit-scrollbar,.child-dialog *::-webkit-scrollbar{display:none}
#app .child-ui .game-shell,#app .child-ui .play-world,#app .child-ui .play-content{min-height:0!important;max-width:100%;overflow:hidden!important}
#app .child-ui .game-shell{flex:1 1 0!important}
#app .child-ui .play-world{padding:8px!important;margin:0!important}
#app .child-ui .play-content{justify-content:flex-start!important;flex:1 1 0!important;gap:8px}
#app .child-ui .game-top{min-height:56px;height:auto;flex:none}
#app .child-ui .game-actions{min-height:56px;flex:none;gap:6px!important}
/* Keep the configured toys; use an explicit help chooser when they do not fit. */
#app .child-ui .game-actions{flex-wrap:nowrap!important;align-items:center!important}
#app .child-ui .game-help-actions{display:flex!important;flex-wrap:nowrap!important;gap:8px!important;flex:none!important}
#app .child-ui .game-help-menu{display:none!important}
#app .child-ui .game-actions.help-compact .game-help-actions{display:none!important}
#app .child-ui .game-actions.help-compact .game-help-menu{display:inline-flex!important}
#app .child-ui .game-shell>.play-world{flex:1 1 0!important;height:100%!important;min-height:0!important;max-height:100%!important}
#app .child-ui .game-shell .play-content{flex:1 1 0!important}
#app .child-ui .topbar{flex-wrap:nowrap!important;justify-content:space-between;gap:6px}
#app .child-ui .top-tools{flex-wrap:nowrap!important}
#app .child-ui .home-brand{min-width:0;flex:1;gap:6px}#app .child-ui .home-brand span{min-width:0}
#app .child-ui .game-top{margin:0!important}#app .child-ui .game-top-tools{flex:none}
#app .child-ui .access-board-scroll{overflow:visible!important;max-height:none!important;scrollbar-gutter:auto;width:100%!important}
#app .child-ui .fit-region.fit-region{grid-template-columns:var(--fit-columns)!important;grid-template-rows:none!important;width:100%!important;height:auto!important;min-width:0!important;max-width:100%!important;gap:8px!important}
#app .child-ui .fit-region>button{width:100%!important;min-width:var(--fit-cell,48px)!important}
#app .child-ui .world-heading{min-height:42px;flex:none;flex-wrap:nowrap!important;margin:0!important}
#app .child-ui .world-heading h1{font-size:clamp(20px,2.4vw,32px)!important}
.world-toolbar{display:flex;flex:none;align-items:center;gap:12px;min-width:0;width:100%;height:auto}
.world-toolbar .world-horizons{flex:1;gap:12px!important;margin:0!important;min-width:0;justify-content:center;flex-wrap:nowrap!important}
.world-toolbar .horizon-control{min-width:72px;width:116px;max-width:unset;min-height:64px}
.world-toolbar .horizon-control>.button-art{min-height:58px;padding:6px;gap:3px;border-radius:22px}
.resume-compact.kid-action{--control-size:60px;min-width:60px!important;width:150px!important;max-width:220px;height:64px!important;min-height:64px!important;border-radius:22px!important}
.resume-compact>.toy-face{display:flex!important;flex-direction:row!important;justify-content:center;gap:8px!important;min-height:0!important}
.resume-compact .kid-label{display:block!important;position:static!important;width:auto;height:auto;clip:auto;font-size:16px!important;white-space:normal}
.world-toolbar .difficulty-compact{display:none!important}
.world-toolbar.toolbar-modal .world-horizons{display:none!important}
.world-toolbar.toolbar-modal .difficulty-compact{display:inline-flex!important;margin-inline:auto;--control-size:64px}
#app .child-ui .world-scene[data-art-integration]{flex:1 1 0!important;min-height:0!important;height:auto!important;max-height:100%!important;margin:0!important;padding:8px!important;overflow:hidden}
#app .child-ui .integrated-archipelago[data-art-integration]{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:6px!important;align-items:stretch}
#app .child-ui .integrated-archipelago[data-art-integration]>.world-landmark{grid-column:auto!important;min-width:0;min-height:0!important;height:100%!important;gap:3px;padding:0;align-self:stretch}
#app .child-ui .integrated-archipelago .landmark-visual{height:0!important;min-height:0!important;flex:1 1 0!important;aspect-ratio:auto!important}
#app .child-ui .integrated-archipelago .island-illustration{width:100%!important;height:100%!important;max-height:100%!important;object-fit:contain;min-height:0!important}
#app .child-ui .landmark-plaque{font-size:clamp(12px,1.1vw,16px);line-height:1.25;padding:6px 8px!important;flex:none;max-width:100%;overflow-wrap:anywhere}
#app .child-ui .integrated-closeup[data-art-integration]{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:8px!important;align-items:stretch}
#app .child-ui .integrated-closeup .world-art-stage{height:100%;min-height:0;display:flex;align-items:center}
#app .child-ui .integrated-closeup .themed-ground{height:100%;width:100%;display:flex;align-items:center}
#app .child-ui .integrated-closeup .island-near-art{width:100%!important;height:100%!important;max-height:100%!important;object-fit:contain}
#app .child-ui .island-destinations{min-height:0;height:100%;gap:8px!important;align-content:start;padding:0!important;grid-template-columns:minmax(0,1fr)}
#app .child-ui .integrated-closeup .zone-hotspot{min-height:64px!important;height:auto!important;padding:6px!important;grid-template-columns:56px minmax(0,1fr);gap:8px!important}
#app .child-ui .integrated-closeup .zone-hotspot .landmark-visual{width:56px!important;height:48px!important}
#app .child-ui .integrated-closeup .zone-hotspot .landmark-plaque{font-size:15px;padding:0!important}
.island-info-button.kid-action{--control-size:48px;position:absolute;right:90px;top:8px}
body[data-route=atlas] #main,body[data-route=intro20] #main,body[data-route=finish] #main{position:relative}
#app .child-ui .world-bottom{display:none}
#app .child-ui .habitat-scene{flex:1 1 0;min-height:0!important;height:auto!important;max-height:100%;width:100%;overflow:hidden}
#app .child-ui .habitat-heading{flex:none;margin:0;gap:8px}
#app .child-ui .habitat-heading h1{margin:0}#app .child-ui .habitat-intro,#app .child-ui .habitat-caption{display:none}
#app .child-ui .habitat-heading-links{gap:8px;display:flex;align-items:center}#app .child-ui .habitat-heading-links .kid-action{--control-size:48px}
#app .child-ui .habitat-actions{flex:none;margin:0;gap:8px}#app .child-ui .habitat-actions .kid-action{--control-size:56px}
#app .child-ui .home-v043{flex:1 1 0!important;min-height:0!important;max-height:100%;padding:0!important;gap:8px}
#app .child-ui .home-sculpture{min-height:0!important;height:100%;max-height:100%;display:flex;align-items:center}
#app .child-ui .home-sculpture .island-illustration{height:100%;max-height:100%;width:100%;object-fit:contain}
#app .child-ui .home-actions{margin:12px 0;gap:8px}#app .child-ui .home-actions .kid-action{--control-size:70px}
#app .child-ui .home-note{flex:none;margin:0;max-height:none}#app .child-ui .home-note p{display:none}
.modal-backdrop:has(.child-dialog){height:var(--view-height,100dvh);width:var(--view-width,100%);padding:10px;overflow:hidden!important}
.dialog.child-dialog{height:calc(var(--view-height,100dvh) - 20px)!important;max-height:calc(var(--view-height,100dvh) - 20px)!important;overflow:hidden!important;scrollbar-gutter:auto;padding:18px!important;gap:8px!important;min-height:0}
.child-dialog>#dialog-title{flex:none;margin:0!important;padding-right:44px;font-size:clamp(22px,2.3vw,30px)}
.fit-dialog-body{min-height:0;flex:1 1 0;display:flex;flex-direction:column;gap:8px;overflow:hidden;text-align:center;width:100%}
.fit-dialog-actions{flex:none;margin:0!important;display:flex;gap:8px!important;flex-wrap:wrap;justify-content:center}
.child-dialog .fit-dialog-actions .kid-action{--control-size:64px;width:64px;min-width:64px;min-height:64px;height:64px}
.child-dialog .fit-dialog-actions .toy-face{min-height:0!important;padding:6px!important}
.child-dialog .intro20-entry-button{min-height:48px;min-width:48px;flex:1 1 120px;flex-basis:120px!important;font-size:16px;padding:10px;max-width:240px}
.child-dialog .tutorial-step{margin:0;font-size:14px}.tutorial-scene{width:100%;height:min(180px,var(--fit-budget));display:flex;justify-content:center}.tutorial-scene svg{width:100%;height:100%;object-fit:contain}
.fit-split{display:contents!important}
.fit-unit{flex:none;min-width:0!important;max-width:100%!important;overflow-wrap:anywhere}
.fit-art{max-height:var(--fit-budget,180px)!important;min-height:0!important;height:min(180px,var(--fit-budget,180px))!important;max-width:100%;object-fit:contain;flex:none}
.fit-art svg,.fit-art img{max-width:100%;max-height:100%;height:100%;object-fit:contain}
.fit-text-part{display:block;line-height:1.5}
.fit-region{display:grid!important;gap:8px!important;min-width:0!important;width:100%!important;overflow:visible!important;position:relative;align-items:start}
.fit-region>button{min-width:0!important;max-width:100%!important;width:100%!important}
.fit-region>.fit-unit{margin:0!important}
.fit-pager{display:flex;flex:none;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;min-height:48px;margin:0;padding:2px;width:100%;font:600 14px/1.3 var(--font-child)}
.fit-page-button,.information-button{min-width:48px;min-height:48px;font:700 17px/1.3 var(--font-child);border:2px solid #709b83;border-radius:17px;background:#f8eed4;color:#285346;padding:7px 12px;cursor:pointer;max-width:100%;white-space:normal;overflow-wrap:anywhere}
.fit-page-button:disabled{opacity:.5;cursor:default}.fit-page-button:focus-visible,.information-button:focus-visible{outline:3px solid #235b69;outline-offset:2px}
.fit-position{flex:1 1 100%;font-size:13px}.fit-overview{width:34px;max-height:28px;background:#e0eadd;border:1px solid #648973;position:relative}.fit-overview i{position:absolute;border:2px solid #285e50;background:#6ebca45c}
.modal-information{border:2px solid #996542;padding:10px;border-radius:14px;background:#fff1da}
.child-dialog .modal-information p{margin:0 0 6px}
body.access-large-targets .fit-page-button,body.access-large-targets .information-button,body.access-large-targets .child-dialog .intro20-entry-button{min-width:56px;min-height:56px}
body.large-text .fit-dialog-body,body.large-text .fit-text-part{font-size:24px}
.adult-ui,.adult-dialog{overflow:auto;scrollbar-width:auto}
#app .child-ui [hidden],.child-dialog [hidden]{display:none!important}
@container brotemar-screen (max-width:680px){
 body:not(.adult-mode) #app .main{padding:6px 10px!important;gap:6px}
 body:not(.adult-mode) #app .topbar{padding:4px 10px!important}.home-brand small{display:none}.top-tools{gap:4px}#app .child-ui .top-tools .header-action{width:44px;min-width:44px}#app .child-ui .pill.gold{padding:4px;font-size:12px}#app .child-ui .home-brand span{max-width:85px}.home-brand strong{font-size:16px}
 .world-toolbar{gap:6px}.resume-compact.kid-action{width:56px!important;min-width:56px!important}.resume-compact .kid-label{display:none!important}.world-toolbar .world-horizons{gap:4px!important}.world-toolbar .horizon-control{min-width:64px;width:76px}.world-toolbar .horizon-control .horizon-label{font-size:14px;overflow-wrap:anywhere}
 #app .child-ui .integrated-archipelago[data-art-integration]{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}
 #app .child-ui .integrated-closeup[data-art-integration]{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) minmax(0,1.3fr)}
 #app .child-ui .island-destinations{grid-template-columns:repeat(2,minmax(0,1fr))}#app .child-ui .integrated-closeup .zone-hotspot{grid-template-columns:minmax(0,1fr);text-align:center;gap:3px!important}#app .child-ui .integrated-closeup .zone-hotspot .landmark-visual{display:none}#app .child-ui .integrated-closeup .zone-hotspot .landmark-plaque{text-align:center}
 #app .child-ui .world-heading h1{font-size:20px!important}.world-nav .kid-action{--control-size:48px}.island-info-button.kid-action{right:65px;--control-size:44px}
 #app .child-ui .home-v043{display:flex;flex-direction:column}#app .child-ui .home-words{flex:none}#app .child-ui .home-sculpture{flex:1 1 0}#app .child-ui .home-words h1{font-size:26px!important}#app .child-ui .home-words .subtitle{font-size:16px;margin:6px 0}#app .child-ui .home-actions{margin:8px 0}#app .child-ui .home-sculpture .home-buddy{width:64px}
 .dialog.child-dialog{padding:12px!important}.child-dialog .fit-dialog-actions .kid-action{--control-size:56px;min-width:56px;width:56px;min-height:56px;height:56px}.child-dialog .intro20-entry-button{flex-basis:100px!important;font-size:15px;padding:8px}
}
@container brotemar-screen (max-height:450px){
 body:not(.adult-mode) #app .topbar{display:none}body:not(.adult-mode) #app .app-footer{display:none}#app .child-ui .world-heading .eyebrow{display:none}#app .child-ui .world-heading{min-height:36px}.world-toolbar .horizon-control{min-height:56px}.world-toolbar .horizon-control>.button-art{min-height:50px}.world-toolbar .horizon-control .icon{display:none}
 #app .child-ui .integrated-archipelago[data-art-integration]{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:minmax(0,1fr)}
 #app .child-ui .integrated-closeup[data-art-integration]{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr)}
 #app .child-ui .home-v043{flex-direction:row}#app .child-ui .home-words,#app .child-ui .home-sculpture{width:50%}.child-dialog .fit-dialog-actions{flex-wrap:nowrap}.child-dialog .intro20-entry-button{font-size:14px}.child-dialog>.close-dialog{width:40px;height:40px}.child-dialog>#dialog-title{font-size:20px}
}

body:not(.show-button-labels) #app .child-ui .game-help-actions .kid-action{width:var(--control-size)!important;min-width:var(--control-size)!important;max-width:none!important}
body.show-button-labels #app .child-ui .game-help-actions .kid-action{width:clamp(104px,12vw,164px)!important;min-width:104px!important;max-width:none!important}
#app .child-ui .game-actions .game-help-menu{--control-size:66px}
body.show-button-labels #app .child-ui .game-help-menu{width:116px!important;min-width:116px!important;height:auto;min-height:86px}
#app .child-ui .game-actions .game-commit{flex:none!important}
#app .child-ui .work-seabed{width:100%!important;min-width:0!important;grid-template-columns:repeat(auto-fit,minmax(var(--access-work-cell),1fr))!important}
#app .child-ui .help-choices{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
#app .child-ui .topbar .home-brand strong{white-space:nowrap}
#app .child-ui .habitat-heading-links{flex:none}
#app .child-ui .habitat-heading{align-items:center}

#app .child-ui .habitat-slots{position:absolute;inset:12px 12px auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;max-width:calc(100% - 24px)!important;z-index:5}
#app .child-ui .habitat-slots .habitat-spot{position:relative;left:auto;top:auto;translate:none;width:100%!important;height:86px;max-width:none;max-height:none;min-height:72px;display:flex;flex-direction:column;align-items:center}
#app .child-ui .habitat-slots .habitat-spot>.button-art{height:64px;min-height:56px!important;width:100%;flex:1}
.habitat-slot-label{font:600 14px/1.3 var(--font-child);color:#224e43;background:#fff7d9d9;border-radius:8px;padding:2px 6px}
#app .child-ui .habitat-scene>.fit-pager{position:absolute;bottom:8px;left:12px;width:calc(100% - 24px);z-index:6;background:#f6f2dfe8;border-radius:16px}
#app .child-ui .habitat-slots .habitat-item-art{max-width:100%;max-height:100%;height:100%;object-fit:contain}

#app .child-ui .habitat-heading .eyebrow{display:none}
#app .child-ui .habitat-heading h1{font-size:26px;line-height:1.2}
.fit-pager{position:relative}.fit-overview{position:absolute;top:3px;right:3px;width:24px;max-height:20px}.fit-position{padding-right:26px}
@container brotemar-screen (max-height:450px){
 body[data-route=game]:not(.adult-mode) #app .main{display:grid;grid-template-columns:minmax(0,1fr) 122px;grid-template-rows:auto minmax(0,1fr);gap:8px}
 #app .child-ui .game-top{grid-column:1/-1;grid-row:1;min-height:56px;max-width:100%}
 #app .child-ui .game-top .eyebrow{display:none}
 #app .child-ui .game-shell{grid-column:1;grid-row:2;height:100%!important;min-height:0!important}
 #app .child-ui .game-actions{grid-column:2;grid-row:2;height:100%;display:flex;flex-direction:column;justify-content:center!important;padding:0!important;gap:8px}
 #app .child-ui .game-actions .game-help-actions{display:none!important}
 #app .child-ui .game-actions .game-help-menu{display:inline-flex!important}
 #app .child-ui .game-actions .kid-action{max-width:122px!important}
 #app .child-ui .game-top-tools .kid-action{width:104px!important;min-width:104px!important}
}

#modal-root .child-dialog .intro20-map-caption{min-height:0;padding:10px}
#modal-root .child-dialog .intro20-map-drawing{height:min(160px,var(--fit-budget));aspect-ratio:auto}
#modal-root .child-dialog .intro20-map-card{overflow:visible}
#app .child-ui .fit-region{padding:0!important;margin:0!important}
#app .child-ui .habitat-slots{width:calc(100% - 24px)!important;max-width:calc(100% - 24px)!important}

#app .child-ui .home-v043.fit-paged{display:flex!important;flex-direction:column!important}
#app .child-ui .fit-text-part{width:100%!important;max-width:100%!important}
#app .child-ui .fit-unit:not(button):not(input):not(svg){position:relative!important;inset:auto!important;translate:none!important}
#app .child-ui .habitat-heading-links{flex-wrap:wrap;justify-content:flex-end;max-width:70%}
#app .child-ui .habitat-heading-links .kid-action{max-width:100%}
@container brotemar-screen (max-height:450px){
 body[data-route=game]:not(.adult-mode) #app .main{grid-template-columns:minmax(0,1fr) 174px}
 #app .child-ui .game-actions .kid-action{max-width:164px!important}
 #app .child-ui .game-actions .game-help-menu{position:fixed;top:8px;right:132px;width:104px!important;min-width:104px!important;z-index:5}
 #app .child-ui .game-top>div:first-child{max-width:calc(100% - 234px)}
 #app .child-ui .game-actions>.fit-pager{max-width:174px;align-self:center}
}

#app .child-ui [hidden],#modal-root .child-dialog [hidden]{display:none!important}
@container brotemar-screen (max-height:450px){
 body[data-route=collection]:not(.adult-mode) #app .main{display:grid;grid-template-columns:minmax(0,1fr) 174px;grid-template-rows:auto minmax(0,1fr);gap:8px}
 #app .child-ui .habitat-heading{grid-column:1/-1;grid-row:1}
 #app .child-ui .habitat-scene{grid-column:1;grid-row:2;height:100%!important;margin:0!important}
 #app .child-ui .habitat-actions{grid-column:2;grid-row:2;flex-direction:column;justify-content:center;margin:0!important}
}

/* Page units occupy their measured space; original grid positions belong to the
   unpaged drawing and must not create empty tracks in a window. */
#app .child-ui .fit-region>*{grid-area:auto!important;align-self:start!important;justify-self:stretch!important}
#app .child-ui .fit-unit{margin:0!important}
#app .child-ui .game-top h1{font-size:24px!important;line-height:1.2!important;margin:0!important}
body.large-text #app .child-ui .game-top h1{font-size:28px!important}
#app .child-ui .game-top .kid-action,#app .child-ui .game-actions .kid-action{height:auto!important;min-height:56px!important}
#app .child-ui .game-top .toy-face,#app .child-ui .game-actions .toy-face{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:center!important;gap:6px!important;min-height:56px!important;padding:8px!important}
#app .child-ui .game-top .kid-action svg,#app .child-ui .game-actions .kid-action svg{width:28px!important;height:28px!important;flex:none}
#app .child-ui .game-top .kid-label,#app .child-ui .game-actions .kid-label{margin:0!important}
#app .child-ui .game-actions .game-help-menu{min-height:56px!important}
body.large-text #app .child-ui .game-top .eyebrow{font-size:16px!important}
#app .child-ui .world-pagination{display:flex;flex:none;align-items:center;justify-content:center;gap:8px;margin:0!important;min-height:48px}
#app .child-ui .island-destination-frame{display:flex;flex-direction:column;min-height:0;gap:8px;overflow:hidden}
#app .child-ui .world-nav .kid-action{position:static;--control-size:48px}
#app .child-ui .integrated-archipelago[data-landmarks="2"],#app .child-ui .integrated-archipelago[data-landmarks="1"]{grid-template-rows:minmax(0,1fr)}
.child-dialog .tutorial-step{display:block;font-size:14px;line-height:1.3;padding-top:3px}

#app .child-ui .fit-game-body{display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important}
#app .child-ui .fit-game-body>.fit-unit{align-self:stretch!important;grid-area:auto!important}
#app .child-ui .fit-region>button{margin:0!important;box-sizing:border-box!important}
#app .child-ui .fit-region>.treasure-nest-wrap{min-width:0!important;max-width:100%}
#app .child-ui .fit-region>.treasure-nest-wrap button{width:100%!important;min-width:0!important;max-width:100%!important}
#app .child-ui .fit-region .treasure-nest-wrap .treasure-remove{width:auto!important}
#app .child-ui .fit-game-body .fit-pager,.child-dialog .fit-pager{position:static!important;grid-area:auto!important;align-self:stretch!important}
#app .child-ui .fit-pager:not(:has(.fit-position)),.child-dialog .fit-pager:not(:has(.fit-position)){flex-wrap:nowrap;gap:4px}
#app .child-ui .game-top{display:flex!important;align-items:center;gap:8px!important}
#app .child-ui .game-top>div:first-child{flex:1;min-width:0}
#app .child-ui .game-identity{display:flex;gap:6px!important;min-width:0}
#app .child-ui .game-title-art{width:40px!important;height:40px!important;min-width:40px!important;flex:none}
#app .child-ui .game-top .step-dots{display:none}
#app .child-ui .game-top-tools{flex:none;gap:6px}
#app .child-ui .game-top .eyebrow{font-size:14px!important;line-height:1.3!important;margin:0 0 4px!important}
#app .child-ui .game-top .toy-face{min-height:56px!important;padding:6px!important;flex-direction:row!important}
#app .child-ui .game-top .kid-action .toy-glyph{width:24px!important;height:24px!important;flex:none}
#app .child-ui .game-top .kid-action .kid-label{font-size:18px!important;line-height:1.2!important;flex:none}
body.large-text #app .child-ui .game-top .kid-action .kid-label{font-size:22px!important}
#app .child-ui .world-nav .toy-face,#app .child-ui .difficulty-compact .toy-face{display:flex!important;flex-direction:row!important;gap:6px!important;align-items:center!important;min-height:56px!important;padding:6px!important}
#app .child-ui .world-nav .kid-action,#app .child-ui .difficulty-compact{min-width:104px!important;width:104px!important;height:auto!important;min-height:56px!important}
#app .child-ui .world-nav .kid-action svg,#app .child-ui .difficulty-compact svg{width:24px!important;height:24px!important;flex:none}
#app .child-ui .world-nav .kid-label,#app .child-ui .difficulty-compact .kid-label{font-size:18px!important;line-height:1.2!important;margin:0!important}
body.large-text #app .child-ui .world-nav .kid-label,body.large-text #app .child-ui .difficulty-compact .kid-label{font-size:22px!important}
#app .child-ui .integrated-archipelago[data-landmarks="2"]{grid-template-columns:repeat(2,minmax(0,1fr))}
#app .child-ui .integrated-archipelago[data-landmarks="1"]{grid-template-columns:minmax(0,1fr)}
#modal-root .child-dialog .fit-unit{margin:0!important;align-self:stretch}
@container brotemar-screen (max-height:450px){#app .child-ui .habitat-actions .kid-action{width:164px!important;min-width:0!important;max-width:164px!important}}

#modal-root .child-dialog{display:flex!important;flex-direction:column!important}
#modal-root .child-dialog .fit-dialog-actions .kid-action{width:auto!important;min-width:56px!important;min-height:56px!important;height:auto!important;max-width:100%}
#modal-root .child-dialog .fit-dialog-actions .toy-face{display:flex!important;flex-direction:row!important;align-items:center;justify-content:center;gap:6px;min-height:56px!important}
#modal-root .child-dialog .fit-dialog-actions .kid-action svg{width:28px!important;height:28px!important;flex:none}
#modal-root .child-dialog .fit-region>*{grid-area:auto!important;min-width:0!important;margin:0!important;position:relative!important;inset:auto!important;translate:none!important}
.fit-region button svg{max-height:var(--fit-illustration,120px)!important;object-fit:contain}
#modal-root .child-dialog .close-dialog{width:48px!important;height:48px!important;min-width:48px;min-height:48px;z-index:10}
body.access-large-targets #modal-root .child-dialog .close-dialog{width:56px!important;height:56px!important;min-width:56px;min-height:56px}
#modal-root .child-dialog>#dialog-title{padding-right:56px;min-height:48px}
#app .child-ui .topbar{min-height:68px!important;height:68px!important}
#app .child-ui .header-action,#app .child-ui .adult-entry,#app .child-ui .home-logo{width:48px!important;min-width:48px!important;height:48px!important;min-height:48px!important}
body.access-large-targets #app .child-ui .header-action,body.access-large-targets #app .child-ui .adult-entry,body.access-large-targets #app .child-ui .home-logo{width:56px!important;min-width:56px!important;height:56px!important;min-height:56px!important}
@container brotemar-screen (max-width:360px){#app .child-ui .home-brand span{display:none}.top-tools .pill.gold{font-size:12px;padding:2px}}

@container brotemar-screen (max-width:400px){body.access-large-targets #app .child-ui .home-brand span,body.access-large-targets #app .child-ui .top-tools .pill.gold{display:none}}

#app .child-ui .world-direct-navigation{display:flex;gap:8px}
@container brotemar-screen (max-width:900px){#app .child-ui .world-direct-navigation{display:none}}
#app .child-ui .treasure-pool.fit-unit{height:min(140px,var(--fit-budget))!important;min-height:56px!important;max-height:var(--fit-budget)!important;box-sizing:border-box}

/* Keep the full mission title on its own row; exits share the action row. */
#app .child-ui .game-exit-actions{flex:1;min-width:0;display:flex;gap:6px}
#app .child-ui .game-actions.help-compact .game-help-menu,#app .child-ui .game-actions .game-commit{flex:1!important;min-width:0!important}
#app .child-ui .game-actions.help-compact .kid-action{width:100%!important;min-width:0!important;max-width:100%!important}
#app .child-ui .game-actions .game-exit-actions .kid-label{font-size:18px!important}
body.large-text #app .child-ui .game-actions .game-exit-actions .kid-label{font-size:22px!important}
#app .child-ui .game-top>div:first-child{max-width:100%;width:100%}
#app .child-ui .world-pagination .kid-action{--control-size:48px;width:48px!important;height:48px!important;min-width:48px!important;min-height:48px!important}
body.access-large-targets #app .child-ui .world-pagination .kid-action{--control-size:56px;width:56px!important;height:56px!important;min-width:56px!important;min-height:56px!important}
#app .child-ui .world-pagination .toy-face{min-height:0!important;padding:6px!important}
#app .child-ui .world-pagination .kid-label{position:absolute!important;width:1px!important;height:1px!important;clip-path:inset(50%);overflow:hidden;white-space:nowrap}
#app .child-ui .world-pagination .kid-action svg{width:28px;height:28px}
@container brotemar-screen (max-width:680px){#app .child-ui .integrated-closeup[data-art-integration]{grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);grid-template-rows:minmax(0,1fr)}}
@container brotemar-screen (max-height:450px){
 #app .child-ui .game-top>div:first-child{max-width:calc(100% - 116px)}
 #app .child-ui .game-actions .game-help-menu{right:12px!important}
 #app .child-ui .game-exit-actions{flex:none;justify-content:center;width:100%}
 #app .child-ui .game-exit-actions .kid-action{width:164px!important}
 body[data-route=atlas]:not(.adult-mode) #app .main,body[data-route=intro20]:not(.adult-mode) #app .main,body[data-route=finish]:not(.adult-mode) #app .main{display:grid;grid-template-columns:minmax(0,1fr) 174px;grid-template-rows:auto minmax(0,1fr);gap:8px}
 #app .child-ui .world-heading{grid-column:1/-1;grid-row:1}
 #app .child-ui .world-scene{grid-column:1;grid-row:2;height:100%!important}
 #app .child-ui .world-toolbar{grid-column:2;grid-row:2;align-self:start;justify-content:center}
 #app .child-ui .world-toolbar .world-horizons{display:none!important}
 #app .child-ui .world-toolbar .difficulty-compact{display:inline-flex!important}
 #app .child-ui .world-pagination{grid-column:2;grid-row:2;align-self:end;gap:6px}
 #app .child-ui .integrated-closeup[data-art-integration]{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);grid-template-rows:minmax(0,1fr)}
 #modal-root .child-dialog{display:grid!important;grid-template-columns:minmax(0,1fr) 152px;grid-template-rows:auto minmax(0,1fr);gap:8px}
 #modal-root .child-dialog>#dialog-title{grid-column:1/-1;grid-row:1}
 #modal-root .child-dialog>.fit-dialog-body{grid-column:1;grid-row:2;height:100%;min-height:0}
 #modal-root .child-dialog>.fit-dialog-actions{grid-column:2;grid-row:2;align-self:start;flex-direction:column}
 #modal-root .child-dialog>.fit-pager{grid-column:2!important;grid-row:2!important;align-self:end!important;width:100%;margin:0}
 #modal-root .child-dialog .fit-dialog-actions .kid-action{width:100%!important;max-width:152px!important}
}

#app .child-ui .game-actions{padding:0!important;margin:0!important}
#app .child-ui .play-world{padding:4px!important}
body.large-text #app .child-ui .game-actions .kid-label{font-size:22px!important;line-height:1.2!important}
@container brotemar-screen (max-width:400px){
 #app .child-ui .game-title-art{display:none}
 body.show-button-labels #app .child-ui .game-actions .kid-action svg,body.show-button-labels #app .child-ui .game-actions .toy-glyph{display:none!important}
 #app .child-ui .game-actions .toy-face{padding:6px!important;gap:0!important}
}

#app .workspace.child-ui,.modal-backdrop:has(.child-dialog){container-type:size;container-name:brotemar-screen}
#app .child-ui .integrated-archipelago[data-art-integration]{display:flex!important;flex-direction:column!important;gap:8px}
#app .child-ui .archipelago-window{width:100%;min-height:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
#app .child-ui .archipelago-window>.world-landmark{position:relative!important;inset:auto!important;translate:none!important;display:flex!important;flex-direction:column!important;width:100%!important;min-width:0!important;height:128px!important;min-height:128px!important;max-height:128px!important;align-items:stretch;grid-area:auto!important}
#app .child-ui .archipelago-window .landmark-visual{flex:1 1 0;min-height:0!important;max-height:100%;width:100%;display:flex;justify-content:center}
#app .child-ui .archipelago-window .island-illustration{object-fit:contain;width:100%;height:100%;max-height:100%;max-width:100%}
#app .child-ui .archipelago-window .landmark-plaque{flex:none;text-align:center;margin:0}

#modal-root .child-dialog{position:relative!important}
#modal-root .child-dialog>.close-dialog{position:absolute!important;inset:12px 12px auto auto!important}
#modal-root .child-dialog input,#modal-root .child-dialog select,#modal-root .child-dialog textarea{box-sizing:border-box;width:100%!important;min-width:0!important;max-width:100%!important;min-height:48px}
body.access-large-targets #modal-root .child-dialog input,body.access-large-targets #modal-root .child-dialog select,body.access-large-targets #modal-root .child-dialog textarea{min-height:56px}
#app .child-ui .solid-net.fit-region .net-piece,#modal-root .child-dialog .solid-net.fit-region .net-piece{height:110px!important;min-height:110px!important;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:6px!important;box-sizing:border-box}
#app .child-ui .solid-net.fit-region .net-piece .variant-button,#modal-root .child-dialog .solid-net.fit-region .net-piece .variant-button{flex:none;margin:0!important;max-width:100%}
#app .child-ui .tower-tools{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:8px!important}
#app .child-ui .tower-tools .play-button{min-width:var(--fit-cell,56px)!important;max-width:100%!important;width:100%!important}

#app .child-ui .tower-control-page{display:flex;flex-direction:column;align-items:center;gap:4px;padding:4px;max-width:100%;box-sizing:border-box}
#app .child-ui .tower-control-page .mission-badge{margin:0!important;padding:0!important}
#app .child-ui .tower-control-page .tower-counter{margin:0!important;font-size:26px;line-height:1.2}
#app .child-ui .tower-control-page .tower-tools{max-width:180px}
#app .child-ui .tower-shaft.fit-art{width:min(110px,100%);margin-inline:auto;box-sizing:border-box}
#app .child-ui .tower-shaft.fit-art .tower-brick{flex:0 1 15px;min-height:3px;box-sizing:border-box}

/* Hidden pages must win over the original display rules of toys and drawings. */
#app .workspace.child-ui [hidden][hidden][hidden][hidden],#modal-root .dialog.child-dialog [hidden][hidden][hidden][hidden]{display:none!important}
#modal-root .child-dialog .fit-region{grid-template-columns:var(--fit-columns)!important;grid-template-rows:none!important;padding:0!important;margin:0!important;align-items:start}

.fit-pager:has(.fit-axis){gap:4px;padding:0}
.fit-axis{width:48px;min-width:48px;height:48px;min-height:48px;box-sizing:border-box;font:700 22px/1 var(--font-child);border:2px solid #709b83;border-radius:14px;background:#f8eed4;color:#285346;padding:2px}
body.access-large-targets .fit-axis{width:56px;min-width:56px;height:56px;min-height:56px}
#app .child-ui .fit-region>button,#modal-root .child-dialog .fit-region>button{height:auto!important;min-height:var(--fit-cell,48px)!important;box-sizing:border-box}
#app .child-ui .fit-region button>.button-art,#modal-root .child-dialog .fit-region button>.button-art{min-height:var(--fit-cell,48px)!important;height:auto!important;padding:4px!important;gap:4px!important;box-sizing:border-box}

#modal-root .child-dialog select.fit-axis{width:48px!important;min-width:48px!important}
body.access-large-targets #modal-root .child-dialog select.fit-axis{width:56px!important;min-width:56px!important}

#modal-root .child-dialog .fit-dialog-body button.fit-unit{width:100%!important;height:auto!important}
@container brotemar-screen (max-height:450px){
 #modal-root .child-dialog .fit-dialog-actions .intro20-entry-button{flex:none!important;flex-basis:auto!important;height:auto!important;line-height:1.25!important}
}

.fit-pager:has(.fit-axis){gap:2px}
.fit-position{box-sizing:border-box;max-width:100%}
#app .child-ui [data-fit-spatial].fit-region,#modal-root .child-dialog [data-fit-spatial].fit-region{justify-content:center}
#app .child-ui .fit-region:not([data-fit-spatial])>button,#modal-root .child-dialog .fit-region:not([data-fit-spatial])>button{aspect-ratio:auto!important}
@container brotemar-screen (max-width:400px){
 #app .child-ui .habitat-heading{display:grid;grid-template-columns:minmax(0,1fr);gap:6px}
 #app .child-ui .habitat-heading-links{max-width:100%;width:100%;flex-wrap:nowrap!important;justify-content:center}
 body.show-button-labels #app .child-ui .habitat-heading-links .kid-action{flex:1;min-width:0!important;width:100%!important;height:56px!important;min-height:56px!important}
 body.show-button-labels #app .child-ui .habitat-heading-links .toy-face{min-height:0!important;height:100%;padding:4px!important}
 body.show-button-labels #app .child-ui .habitat-heading-links svg{display:none!important}
}
@container brotemar-screen (max-height:450px){
 #app .child-ui .habitat-actions{flex-direction:column!important;flex-wrap:nowrap!important;align-items:center;gap:8px}
}

#app .child-ui .fit-region .crop-tower,#modal-root .child-dialog .fit-region .crop-tower{height:calc(var(--crop-height) * var(--fit-crop-scale,1))!important;min-height:0!important}
#app .child-ui .habitat-compact-menu{display:none!important}
@container brotemar-screen (max-width:400px) and (max-height:450px){
 #app .child-ui .habitat-heading{display:flex!important;flex-wrap:nowrap!important;min-height:56px}
 #app .child-ui .habitat-heading-links{width:130px!important;max-width:130px;flex:none}
 #app .child-ui .habitat-heading-links [data-action=habitat-help],#app .child-ui .habitat-heading-links [data-action=habitat-objectives]{display:none!important}
 #app .child-ui .habitat-heading-links .habitat-compact-menu{display:flex!important}
 body[data-route=collection]:not(.adult-mode) #app .main{grid-template-columns:minmax(0,1fr) 144px!important}
 #app .child-ui .habitat-actions .kid-action{width:100%!important;max-width:144px!important}
}

/* Secondary result actions keep their text and target inside short dialogs. */
@container brotemar-screen (max-height:450px){
 #modal-root .child-dialog .dialog-secondary .kid-action{width:100%!important;min-width:56px!important;min-height:56px!important;height:auto!important}
 #modal-root .child-dialog .dialog-secondary .toy-face{display:flex!important;flex-direction:row!important;align-items:center;justify-content:center;gap:6px;min-height:56px!important;padding:6px!important}
 #modal-root .child-dialog .dialog-secondary .kid-action svg{width:28px!important;height:28px!important;flex:none}
 #modal-root .child-dialog .dialog-secondary .kid-label{margin:0!important}
}
