/* Collection shell: lists scroll independently; the document retains an accessible fallback. */
html{color-scheme:dark;scrollbar-gutter:stable}
:is(html,body,.collection,.dialog,.session-console,.mm-history,.sn-joints){scrollbar-width:thin;scrollbar-color:#46556b #0c121c}
:is(html,body,.collection,.dialog,.session-console,.mm-history,.sn-joints)::-webkit-scrollbar{width:7px;height:7px}
:is(html,body,.collection,.dialog,.session-console,.mm-history,.sn-joints)::-webkit-scrollbar-track{background:#0c121c}
:is(html,body,.collection,.dialog,.session-console,.mm-history,.sn-joints)::-webkit-scrollbar-thumb{background:#46556b;border:2px solid #0c121c;border-radius:10px}
:is(html,body,.collection,.dialog,.session-console,.mm-history,.sn-joints)::-webkit-scrollbar-thumb:hover{background:#8395b2}
:is(html,body,.collection,.dialog,.session-console,.mm-history,.sn-joints)::-webkit-scrollbar-corner{background:#0c121c}
@media(forced-colors:active){:is(html,body,.collection,.dialog,.session-console,.mm-history,.sn-joints){scrollbar-color:auto}}
.topbar{height:56px;padding:0 22px;position:sticky;top:0;z-index:10;background:#0b1019f5;backdrop-filter:blur(12px)}
.brand{font-size:23px}.brand-symbol .lucide{width:25px;height:25px}.header-caption{font-size:9px;letter-spacing:1.5px}.games-menu{margin-left:auto;min-height:36px;padding:7px 15px}
.workspace{grid-template-columns:184px minmax(0,1fr);min-height:calc(100dvh - 56px);align-items:start}
.collection{height:calc(100dvh - 56px);position:sticky;top:56px;overflow:auto;overscroll-behavior:contain;padding:20px 10px;gap:6px;scrollbar-width:thin}
.aside-heading{font-size:9px;padding:0 8px 12px}.puzzle-item{padding:10px 8px;gap:9px;min-height:47px;border-radius:9px;box-shadow:none}.puzzle-item strong{font-size:12px;line-height:1.3}.puzzle-item div>span{font-size:9px}.puzzle-symbol>.lucide{width:19px;height:19px}.puzzle-item>.lucide{display:none}.collection-note,.aside-bottom{display:none}
main{padding:18px 22px;margin:0 auto}.game-heading{margin-bottom:18px}
.library-tools{display:grid;gap:13px;margin:0 0 18px}.library-tools input,.games-picker input{width:100%;max-width:540px;padding:12px 15px;background:#121d2c;border:1px solid #3c4f69;border-radius:10px;color:#edf2fa;font:inherit;font-size:14px}.library-filters{display:flex;gap:7px;flex-wrap:wrap}.library-filters .button{min-height:36px;font-size:12px;padding:7px 13px}.library-filters [aria-pressed=true]{background:#d8e2ff;color:#17253f}.library-count{font-size:12px;color:#a5b5ce}.library-empty{padding:30px 0;line-height:1.7;color:#b7c5d9}.collection-intro{margin-bottom:18px;font-size:14px}
.catalog-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:14px}.catalog-grid .game-card{display:grid;grid-template-columns:52px minmax(0,1fr);gap:13px;padding:18px;border-radius:14px;max-width:none}.catalog-grid .card-symbol{width:52px;height:52px;border-radius:12px}.catalog-grid .card-symbol .lucide{width:30px;height:30px}.catalog-grid .game-card h2{font-size:19px;letter-spacing:-.5px;margin:5px 0}.catalog-grid .eyebrow{font-size:8px;letter-spacing:1px}.catalog-grid .game-card p{font-size:12px}.catalog-grid .game-card .button{grid-column:1/-1;width:100%;margin:0;min-height:38px;font-size:12px}.catalog-grid .card-progress{font-size:10px;margin-top:5px}
.games-picker,.session-panel{max-width:660px;max-height:85dvh;overflow:auto;overscroll-behavior:contain;padding:22px}.games-picker>button,.panel-close{display:flex;margin-left:auto;margin-bottom:12px}.games-picker h2{margin-bottom:18px}.picker-list{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px}.picker-list a{display:flex;justify-content:space-between;gap:10px;padding:13px;border:1px solid #34455c;border-radius:9px;font-size:13px}.picker-list small{color:#94a6bc;font-size:10px}.picker-list a:hover{background:#22324a}.level-panel .rw-gallery,.level-panel .sn-gallery{padding:0;border:0}.level-panel .rw-gallery>h2,.level-panel .rw-gallery>p,.level-panel .rw-gallery>.eyebrow,.level-panel .rw-note,.level-panel .sn-gallery>h2,.level-panel .sn-gallery>.eyebrow{display:none}.level-panel .rw-levels,.level-panel .sn-levels{grid-template-columns:1fr 1fr}.session-panel .soma-small,.session-panel .control-note{display:block;margin:16px 0}.session-panel .history-block{margin-top:15px}
.session-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;min-height:44px}.session-bar h1,.sn-game .session-bar h1,.rw-game .session-bar h1{font-size:25px!important;letter-spacing:-.8px;margin:0;line-height:1.2}.session-bar-actions{display:flex;gap:7px;align-items:center}.session-bar-actions .button,.session-bar-actions .quiet-button{min-height:38px;font-size:12px;padding:8px 11px;white-space:normal}.session-bar-actions .button:first-child{max-width:250px}
[data-session] .game-navigation,[data-session] .sn-navigation,[data-session] .game-heading{display:none}
/* Cube: scene and all face controls share one work area. */
[data-session="cube-3"] .game-layout,[data-session="mirror"] .game-layout{grid-template-columns:minmax(0,1fr) 270px;gap:14px}
[data-session] #cube-stage{height:clamp(230px,calc(100dvh - 335px),520px)}
[data-session] .controls-panel{padding:15px}[data-session] .stage-hint{padding:8px 12px;font-size:11px}[data-session] .selected-face{padding:4px 12px 10px}[data-session] .stage-actions{padding:11px 12px}[data-session] .bottom-note{padding-top:8px;font-size:11px}
[data-session] .face-row{padding:5px 3px}[data-session] .turn-legend{margin:13px 0 6px}[data-session] .face-turn{height:38px;width:38px}
/* Soma: retain geometry and grid together; advanced copy lives in Options. */
[data-session="soma"] .soma-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:14px;align-items:start}
[data-session="soma"] .soma-play{display:block}[data-session="soma"] .soma-stage-wrap{position:relative;top:auto;box-shadow:none}
[data-session="soma"] .soma-stage-heading{padding:7px 12px;display:flex;justify-content:flex-end}[data-session="soma"] .soma-stage-heading>div{display:none}[data-session="soma"] .soma-stage-heading .quiet-button{font-size:11px;padding:4px}
[data-session="soma"] .soma-stage,[data-session="soma"] .soma-stage-wrap .soma-stage{height:clamp(190px,calc(100dvh - 470px),470px)}
[data-session="soma"] .soma-interaction{padding:6px 10px}[data-session="soma"] #soma-drag-help{display:none}[data-session="soma"] .soma-side{gap:0}[data-session="soma"] .soma-side>.soma-panel:last-child{display:none}
[data-session="soma"] .soma-panel{padding:12px}[data-session="soma"] .soma-panel-heading{margin-bottom:8px}[data-session="soma"] .soma-panel h2{font-size:12px}[data-session="soma"] .soma-pieces{gap:5px;grid-template-columns:repeat(4,1fr)}[data-session="soma"] .soma-pieces svg{height:37px}[data-session="soma"] .soma-pieces button{min-height:48px;padding:2px}[data-session="soma"] .soma-selected{padding:8px 0;margin:6px 0}[data-session="soma"] .soma-step{margin:10px 0 6px}[data-session="soma"] .soma-rotations .button{padding:8px 6px;font-size:11px;min-height:40px}[data-session="soma"] .soma-grid button{min-height:36px}[data-session="soma"] .soma-validity{margin:8px 0;font-size:11px;min-height:20px}[data-session="soma"] .soma-place{min-height:40px}[data-session="soma"] .soma-toolbar{padding:10px;gap:7px}[data-session="soma"] .soma-toolbar .button{font-size:12px;padding:8px 10px}[data-session="soma"] .soma-hints{padding:10px;margin:0}[data-session="soma"] .soma-hints h2{font-size:12px}[data-session="soma"] .soma-hints p{font-size:11px;margin-top:7px}[data-session="soma"] .soma-side button,[data-session="soma"] .soma-side select{scroll-margin-top:70px;scroll-margin-bottom:12px}
/* Snake: keep every session node inside its original query root. */
[data-session="serpiente"] .sn-layout{display:block}[data-session="serpiente"] .sn-title,[data-session="serpiente"] .sn-aside{display:none}
[data-session="serpiente"] .sn-play>.sn-target{display:flex;align-items:center;justify-content:center;gap:15px;border:0;border-radius:0;padding:7px 14px;text-align:left;height:68px}[data-session="serpiente"] .sn-play>.sn-target svg{width:58px;height:54px;margin:0}[data-session="serpiente"] .sn-play>.sn-target strong{font-size:14px}[data-session="serpiente"] .sn-play>.sn-target p{display:none}
[data-session="serpiente"] .sn-play .sn-session{display:grid;grid-template-columns:minmax(0,1fr) 300px;grid-template-rows:auto 1fr auto;align-items:start}
[data-session="serpiente"] .sn-play .sn-readings{grid-column:1;grid-row:1;padding:8px 14px;border:0}[data-session="serpiente"] .sn-play .sn-stage{grid-column:1;grid-row:2;height:clamp(230px,calc(100dvh - 310px),520px)}
[data-session="serpiente"] .sn-play .sn-console{grid-column:2;grid-row:1/4;padding:12px;border-top:0;border-left:1px solid #354354;max-height:calc(100dvh - 230px);overflow:auto;scrollbar-width:thin}
[data-session="serpiente"] .sn-play .sn-legend{grid-column:1;grid-row:3;padding:9px;gap:13px}[data-session="serpiente"] .sn-play .sn-win{grid-column:1;grid-row:3;margin:0;padding:10px;z-index:1}[data-session="serpiente"] .sn-play .sn-win:not([hidden])~.sn-legend{visibility:hidden}
[data-session="serpiente"] .sn-play .sn-modes{padding:0 0 12px;gap:6px;flex-wrap:wrap;background:none}[data-session="serpiente"] .sn-play .sn-modes>span{display:none}[data-session="serpiente"] .sn-play .sn-modes .button{flex:1;font-size:11px;padding:8px;min-height:40px}
[data-session="serpiente"] .sn-play .sn-selection{flex-direction:row;align-items:center}[data-session="serpiente"] .sn-play .sn-selection>.eyebrow{display:none}[data-session="serpiente"] .sn-play .sn-joints{margin:8px 0;gap:6px;max-height:95px;overflow:auto}[data-session="serpiente"] .sn-play .sn-turns{display:grid;grid-template-columns:1fr 1fr;gap:7px}[data-session="serpiente"] .sn-play .sn-turns .button{padding:9px 6px;font-size:11px;min-height:40px}[data-session="serpiente"] .sn-play .sn-verdict{font-size:11px;line-height:1.5;padding:10px 0;min-height:36px}[data-session="serpiente"] .sn-play .sn-actions{padding-top:10px;gap:6px}[data-session="serpiente"] .sn-play .sn-hint-copy{font-size:11px;line-height:1.5;margin-top:8px}[data-session="serpiente"] .sn-play .sn-console details{margin-top:10px;padding-top:10px}
/* Wheel: available height determines disk diameter; controls remain next to it. */
[data-session="rueda"] .rw-layout{display:block}[data-session="rueda"] .rw-title{display:none}[data-session="rueda"] .rw-play{max-width:1000px;margin:auto}[data-session="rueda"] .rw-readings{padding:10px 18px}[data-session="rueda"] .rw-view{height:clamp(240px,calc(100dvh - 365px),620px);max-height:none;aspect-ratio:auto}
[data-session="rueda"] .rw-controls{padding:12px 14px 3px}[data-session="rueda"] .rw-status{margin:6px 14px;font-size:11px}[data-session="rueda"] .rw-footer{padding:3px 14px 7px}[data-session="rueda"] .rw-details{padding:9px 14px}[data-session="rueda"] .rw-stage:has(+.rw-win:not([hidden])) .rw-view{height:clamp(210px,calc(100dvh - 405px),520px)}[data-session="rueda"] .rw-win{margin:8px 14px 0;padding:10px}
@media(max-width:1050px){.workspace{grid-template-columns:1fr}.collection{display:none}.header-caption{display:none}main{padding:14px 18px}}
@media(max-width:700px){.topbar{height:50px;padding:0 12px}.brand{font-size:21px}.workspace{min-height:calc(100dvh - 50px)}main{padding:12px}.games-menu{min-height:36px}.session-bar{flex-wrap:wrap;gap:8px;margin-bottom:10px}.session-bar h1{font-size:21px!important}.session-bar-actions{margin-left:auto;gap:5px}.session-bar-actions .button,.session-bar-actions .quiet-button{font-size:11px;min-height:40px;padding:8px}.session-bar-actions .button:first-child{max-width:145px}.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.catalog-grid .game-card{grid-template-columns:1fr;padding:13px;gap:9px}.catalog-grid .game-card h2{font-size:17px}.catalog-grid .game-card>div{min-height:85px}.catalog-grid .game-card .button{font-size:11px;white-space:normal;min-height:44px}.catalog-grid .game-card .eyebrow{line-height:1.5}.library-filters{gap:5px}.library-filters .button{font-size:11px;min-height:40px;padding:8px 10px}.picker-list{grid-template-columns:1fr}.session-panel{padding:16px}.level-panel .sn-levels,.level-panel .rw-levels{grid-template-columns:1fr}
[data-session="cube-3"] .game-layout,[data-session="mirror"] .game-layout{grid-template-columns:1fr;gap:10px}[data-session] #cube-stage{height:clamp(200px,calc(100dvh - 450px),310px)}[data-session] .stage-hint{display:none}[data-session] .stage-top{top:10px}[data-session] .controls-panel{padding:10px}[data-session] .control-heading,[data-session] .turn-legend{display:none}[data-session] .face-controls{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}[data-session] .face-row{display:grid;grid-template-columns:1fr 1fr;padding:4px;margin:0;gap:4px}[data-session] .face-select{grid-column:1/-1;gap:5px;min-height:30px}[data-session] .face-letter{width:23px;height:23px}[data-session] .face-name{font-size:10px}[data-session] .face-turn{width:100%;height:38px}[data-session] .selected-face{padding:5px 10px 8px;font-size:12px}[data-session] .stage-actions{padding:8px;gap:5px}[data-session] .stage-actions .button{font-size:11px;min-height:40px;padding:8px}[data-session] .stage-actions .reset-button{margin-left:auto}
[data-session="soma"] .soma-layout{grid-template-columns:1fr;gap:10px}[data-session="soma"] .soma-play{display:contents}[data-session="soma"] .soma-stage-heading{display:flex;padding:4px 10px}[data-session="soma"] #soma-view{min-height:32px}[data-session="soma"] .soma-stage-wrap{order:0;position:relative;top:auto}[data-session="soma"] .soma-stage-wrap .soma-stage{height:180px}[data-session="soma"] .soma-toolbar{order:2;padding:0}[data-session="soma"] .soma-side{order:1}[data-session="soma"] .soma-hints{order:3}[data-session="soma"] .soma-preview-footer{padding-bottom:6px}[data-session="soma"] .soma-panel{display:grid;grid-template-columns:1fr 1fr;gap:6px 10px}[data-session="soma"] .soma-panel>.soma-panel-heading:first-child{grid-column:1}[data-session="soma"] .soma-pieces{grid-column:1;grid-row:2}[data-session="soma"] .soma-selected{grid-column:1;grid-row:3;font-size:11px;margin:0;padding:0}[data-session="soma"] .soma-panel>h2.soma-step{display:none}[data-session="soma"] .soma-rotations{grid-column:1;grid-row:4;flex-wrap:wrap}[data-session="soma"] .soma-panel>.soma-panel-heading.soma-step{grid-column:2;grid-row:1;margin:0}[data-session="soma"] .soma-panel>.soma-panel-heading.soma-step>h2{display:none}[data-session="soma"] .soma-grid{grid-column:2;grid-row:2/5;align-self:start}[data-session="soma"] .soma-validity{grid-column:1/-1;margin:0}[data-session="soma"] .soma-place{grid-column:1/-1}[data-session="soma"] .soma-pieces{grid-template-columns:repeat(4,1fr)}[data-session="soma"] .soma-pieces svg{height:27px}[data-session="soma"] .soma-rotations .button{flex:1;padding:6px 3px;font-size:10px}[data-session="soma"] .soma-hints p{line-height:1.5}
[data-session="serpiente"] .sn-play>.sn-target{height:52px;padding:3px 10px;gap:10px}[data-session="serpiente"] .sn-play>.sn-target svg{width:43px;height:44px}[data-session="serpiente"] .sn-play>.sn-target strong{font-size:12px}[data-session="serpiente"] .sn-play .sn-session{display:flex;flex-direction:column}[data-session="serpiente"] .sn-play .sn-readings{width:100%;padding:6px 12px}[data-session="serpiente"] .sn-play .sn-stage{width:100%;height:clamp(180px,calc(100dvh - 610px),220px)}[data-session="serpiente"] .sn-play .sn-console{width:100%;max-height:none;overflow:visible;border-left:0;padding:10px}[data-session="serpiente"] .sn-play .sn-legend{padding:6px;width:100%}[data-session="serpiente"] .sn-play .sn-modes{padding-bottom:7px}[data-session="serpiente"] .sn-play .sn-modes .button{min-height:40px}[data-session="serpiente"] .sn-play .sn-selection{font-size:10px}[data-session="serpiente"] .sn-play .sn-joints{margin:5px 0}[data-session="serpiente"] .sn-play .sn-turns{grid-template-columns:1fr 1fr 1fr}[data-session="serpiente"] .sn-play .sn-turns .quiet-button{grid-column:1/-1;justify-self:end;padding:0;min-height:25px}[data-session="serpiente"] .sn-play .sn-verdict{padding:5px 0;min-height:24px}[data-session="serpiente"] .sn-play .sn-actions{padding-top:7px}[data-session="serpiente"] .sn-play .sn-hint-copy{margin-top:6px}[data-session="serpiente"] .sn-play .sn-win{margin:0;padding:10px;width:100%}[data-session="serpiente"] .sn-play .sn-win:not([hidden])~.sn-legend{display:none}
[data-session="rueda"] .rw-view{height:clamp(220px,calc(100dvh - 325px),480px)}[data-session="rueda"] .rw-readings{padding:8px 12px}[data-session="rueda"] .rw-controls .button{min-height:44px}[data-session="rueda"] .rw-stage:has(+.rw-win:not([hidden])) .rw-view{height:clamp(200px,calc(100dvh - 460px),400px)}
}
@media(max-width:360px){.catalog-grid{grid-template-columns:1fr}.catalog-grid .game-card{grid-template-columns:45px 1fr}.session-bar-actions{width:100%;justify-content:space-between}}
@media(min-width:701px) and (max-height:500px){.topbar{position:relative;height:44px}.collection{height:calc(100dvh - 44px);top:0}.session-bar{margin-bottom:8px}.session-bar h1{font-size:20px!important}main{padding:8px 14px}[data-session] #cube-stage{height:210px}[data-session="soma"] .soma-stage-wrap .soma-stage{height:210px}[data-session="serpiente"] .sn-play>.sn-target{height:48px}[data-session="serpiente"] .sn-play>.sn-target svg{height:40px}[data-session="serpiente"] .sn-play .sn-stage{height:200px}[data-session="serpiente"] .sn-play .sn-console{max-height:none}[data-session="rueda"] .rw-view{height:230px}}

.session-bar .game-stats{gap:10px;margin-left:8px;margin-right:auto}.session-bar .game-stats strong{font-size:18px}.session-bar .game-stats>div>span{font-size:9px}.session-bar .stat-divider{height:25px}.session-bar .stat-total{font-size:12px}
[data-session="soma"] #soma-stage{height:clamp(190px,calc(100dvh - 470px),400px)}
@media(max-width:700px){[data-session="soma"] #soma-stage{height:180px}.session-bar .game-stats{gap:8px}.session-bar .game-stats strong{font-size:16px}.session-bar .game-stats>div>span{font-size:8px}.session-bar .stat-divider{display:none}}
@media(min-width:701px) and (max-height:500px){
 [data-session="rueda"] .rw-play>[data-main="session"]{display:grid;grid-template-columns:minmax(0,1fr) 245px;align-items:center}
 [data-session="rueda"] .rw-readings{grid-column:1/-1;padding:5px 12px}
 [data-session="rueda"] .rw-stage{grid-column:1;grid-row:2/5}
 [data-session="rueda"] .rw-view{height:230px}
 [data-session="rueda"] .rw-controls{grid-column:2;grid-row:2;padding:8px;flex-wrap:wrap}
 [data-session="rueda"] .rw-controls .button{min-width:0;padding:10px 8px;font-size:11px}
 [data-session="rueda"] .rw-controls [data-rw="play"]{order:-1;width:100%}
 [data-session="rueda"] .rw-status{grid-column:2;grid-row:3}
 [data-session="rueda"] .rw-footer{grid-column:2;grid-row:4;flex-wrap:wrap}
 [data-session="rueda"] .rw-details,[data-session="rueda"] .rw-win{grid-column:1/-1}
 [data-session="serpiente"] .sn-play .sn-console{max-height:calc(100dvh - 150px)}
 [data-session="soma"] #soma-stage{height:190px}
}
/* Remaining games use the same session hierarchy; only their playing surfaces differ. */
.session-expanded .session-workspace{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:14px;align-items:start}
.session-expanded .session-side{display:flex;flex-direction:column;gap:12px;min-width:0}
.session-console{min-width:0;border:1px solid #354354;border-radius:16px;background:#121d29;overflow:auto;overscroll-behavior:contain;max-height:calc(100dvh - 155px);padding:12px}
.session-console>section,.session-console>div{min-width:0}
.session-expanded .session-console :is(.button,.quiet-button){font-size:12px;min-height:40px;padding:8px 10px}
.session-expanded .session-console :is(h2,h3){font-size:13px;line-height:1.4}
.session-expanded .session-console p{font-size:11px;line-height:1.6}
.session-expanded :is(.traffic-level-heading,.laser-board-heading,.soko-board-heading,.tg-board-heading,.hn-board-heading,.qz-board-heading,.ng-board-heading,.mm-case-heading){padding:10px 14px;min-height:35px;gap:8px}
.session-expanded :is(.traffic-level-heading,.laser-board-heading,.soko-board-heading,.tg-board-heading,.hn-board-heading,.qz-board-heading,.ng-board-heading,.mm-case-heading)>div:empty{display:none}
.session-expanded :is(.traffic-board-caption,.laser-caption,.soko-caption,.hn-scene-toolbar,.qz-table-toolbar,.mm-case-rules){padding:8px 14px;font-size:11px}
.session-expanded :is(.traffic-controller,.laser-panel,.soko-panel,.hn-progress,.qz-progress){padding:12px}
.session-console :is(.traffic-controller,.laser-panel,.hn-progress,.qz-progress){border:0;background:none;padding:0;box-shadow:none}
.session-console :is(.traffic-toolbar,.laser-toolbar,.soko-toolbar,.tg-toolbar,.hn-toolbar,.qz-toolbar,.ng-toolbar,.mm-toolbar){padding:10px 0;margin:0;display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-start}
.session-console :is(.traffic-hint-panel,.laser-hints,.soko-hints,.tg-hints,.hn-hints,.qz-hints,.ng-hints,.mm-hints){padding:12px 0 0;margin:0;border-top:1px solid #334254}
.session-console :is(.traffic-hint-top,.laser-hints-heading,.soko-hints>div,.tg-section-heading,.hn-hints>div,.qz-hints>div,.ng-hints>div,.mm-hints>div){gap:8px;flex-wrap:wrap}
.session-console :is(.traffic-hint-panel,.laser-hints,.soko-hints,.tg-hints,.hn-hints,.qz-hints,.ng-hints,.mm-hints) p{margin:8px 0}
.session-expanded .bottom-note{font-size:11px;padding-top:8px;line-height:1.6}
.session-panel :is(.session-level-group,.ms-gallery,.cb-gallery){border:0;background:none;padding:0}
.session-panel :is(.ms-gallery-note,.cb-note){display:none}
.session-panel :is(.ms-gallery>h2,.cb-gallery>h2){font-size:22px}
.session-panel :is(.ms-levels,.cb-levels){grid-template-columns:1fr 1fr}
.session-panel label{display:flex;align-items:center;gap:8px;min-height:44px;font-size:13px}
.session-panel :is(.traffic-keyboard,.laser-key-hint,.soko-small){display:block;margin-top:14px;font-size:13px;line-height:1.8}
.session-expanded .session-play{min-width:0}
/* Movement controls remain adjacent to their boards. */
[data-session=atascos] #traffic-stage{height:clamp(260px,calc(100dvh - 245px),560px);min-height:0}
[data-session=atascos] .traffic-controller .traffic-panel-title{margin-bottom:10px}
[data-session=atascos] .traffic-selection{margin:12px 0;padding:10px}
[data-session=atascos] .traffic-cars{gap:6px}
[data-session=atascos] .traffic-victory{padding:12px}
[data-session=laseres] #laser-stage{height:clamp(260px,calc(100dvh - 230px),560px);aspect-ratio:auto}
[data-session=laseres] .laser-selection{margin:12px 0;padding:10px}
[data-session=laseres] .laser-legend{margin-top:12px;gap:6px}
[data-session=sokoban] #soko-stage{height:clamp(250px,calc(100dvh - 245px),550px)}
[data-session=sokoban] .soko-controls{padding:0 0 8px}
[data-session=sokoban] .soko-dpad{grid-template-columns:repeat(3,42px);grid-template-rows:repeat(3,38px)}
[data-session=sokoban] .soko-map{max-width:240px}
[data-session=sokoban] .soko-panel-heading{margin-bottom:10px}
[data-session=sokoban] .soko-warning{margin:6px 0}
/* Tangram keeps palette, nudges, turn and placement together. */
[data-session=tangram] .tg-stage-wrap{position:relative;top:auto}
[data-session=tangram] #tg-stage{height:clamp(260px,calc(100dvh - 245px),550px)}
[data-session=tangram] #tg-stage svg{height:100%;max-height:none;width:100%}
[data-session=tangram] .tg-board-heading p{margin:0;font-size:11px}
[data-session=tangram] .tg-tray-section{padding:0 0 10px}
[data-session=tangram] .tg-tray{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
[data-session=tangram] .tg-tray button{padding:4px;min-height:49px}
[data-session=tangram] .tg-tray svg{height:32px}
[data-session=tangram] .tg-section-heading>span{display:none}
[data-session=tangram] .tg-manipulation{padding:0;border:0}
[data-session=tangram] .tg-adjust{flex-wrap:wrap;gap:8px}
[data-session=tangram] .tg-nudges{gap:6px}
[data-session=tangram] .tg-nudges button{min-height:38px;min-width:38px}
[data-session=tangram] .tg-selected-heading{padding:8px 0}
[data-session=tangram] .tg-place-actions{flex-wrap:wrap;gap:5px}
[data-session=tangram] .tg-legend{display:flex;flex-wrap:wrap;gap:12px;padding:10px 14px;font-size:11px}
/* Hanoi's miniature towers are the keyboard and graphics fallback controls. */
[data-session=hanoi] #hn-stage{height:clamp(250px,calc(100dvh - 250px),550px)}
[data-session=hanoi] .hn-instruction{padding:0 0 10px;flex-wrap:wrap;font-size:12px}
[data-session=hanoi] .hn-towers{gap:5px;padding:0}
[data-session=hanoi] .hn-towers>button{padding:7px;min-height:125px}
[data-session=hanoi] .hn-tower-label{gap:3px}
[data-session=hanoi] .hn-tower-label kbd{display:none}
[data-session=hanoi] .hn-mini-stack{height:70px}
[data-session=hanoi] .hn-tower-description{font-size:10px}
[data-session=hanoi] .hn-progress{margin-top:12px}
/* Grid games retain their complete geometry and textual clues. */
[data-session=quince] .qz-table{padding:0 15px 10px}
[data-session=quince] #qz-stage{width:min(100%,max(240px,calc(100dvh - 310px)),490px);margin:auto}
[data-session=quince] .qz-instruction{padding:10px 14px;font-size:12px}
[data-session=quince] #qz-target{width:142px;margin:10px auto 14px}
.session-target-label{color:#b9c9de;text-align:center}
[data-session=nonogramas] .ng-first{padding:10px 14px;margin:0;border-radius:0}
[data-session=nonogramas] .ng-first p{font-size:11px;line-height:1.6;margin-top:6px}
[data-session=nonogramas] .ng-first strong{font-size:12px}
[data-session=nonogramas] .ng-table{padding:10px 14px}
[data-session=nonogramas] .ng-tools{padding:0 0 10px;gap:8px}
[data-session=nonogramas] .ng-tools button{min-height:40px;font-size:12px}
[data-session=nonogramas] #ng-stage{max-width:460px;margin:auto}
[data-session=nonogramas] .ng-instruction{padding:10px 14px;font-size:12px;line-height:1.6}
[data-session=nonogramas] .ng-caption{font-size:9px;padding:8px 0}
/* Secret-code history is game information, always visible alongside its editor. */
[data-session=clave-secreta] .mm-vault{padding:12px 16px}
[data-session=clave-secreta] .mm-legend{padding:8px 16px;gap:10px}
[data-session=clave-secreta] .mm-history{max-height:clamp(140px,calc(100dvh - 510px),300px);overflow:auto;overscroll-behavior:contain}
[data-session=clave-secreta] .mm-editor{padding:12px 16px}
[data-session=clave-secreta] .mm-editor-heading{margin-bottom:10px}
[data-session=clave-secreta] .mm-palette{margin:10px 0}
[data-session=clave-secreta] .mm-message{margin:10px 14px;font-size:12px}
/* Rebuilt Mosaico and Canica controls stay inside their own session roots. */
[data-session=mosaico] .ms-layout,[data-session=canica] .cb-layout{display:block}
[data-session=mosaico] .ms-title,[data-session=canica] .cb-title{display:none}
.session-expanded .session-dynamic-workspace{display:grid;grid-template-columns:minmax(0,1fr) 320px;grid-template-rows:auto 1fr auto;align-items:start}
.session-dynamic-workspace>.session-console{grid-column:2;grid-row:1/5;border-radius:0;border-width:0 0 0 1px;align-self:stretch}
[data-session=mosaico] .ms-play .ms-board-top{grid-column:1;grid-row:1;padding:12px 14px}
[data-session=mosaico] .ms-play .ms-stage{grid-column:1;grid-row:2;align-self:center;padding:5px 12px}
[data-session=mosaico] .ms-play .ms-board{height:clamp(240px,calc(100dvh - 270px),530px);max-height:none}
[data-session=mosaico] .ms-play .ms-legend{grid-column:1;grid-row:3;padding:10px}
[data-session=mosaico] .ms-play .ms-result{grid-column:1;grid-row:4;margin:10px}
[data-session=mosaico] .ms-play .ms-palette-section{padding:0 0 10px;border:0;background:none}
[data-session=mosaico] .ms-play .ms-palette{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
[data-session=mosaico] .ms-play .ms-palette>button{padding:5px;gap:3px}
[data-session=mosaico] .ms-play .ms-palette svg{height:32px}
[data-session=mosaico] .ms-play .ms-section-heading{margin-bottom:8px}
[data-session=mosaico] .ms-play .ms-section-heading>span{display:none}
[data-session=mosaico] .ms-play :is(.ms-active,.ms-tools,.ms-nudge,.ms-history){padding:8px 0;gap:5px;flex-wrap:wrap}
[data-session=mosaico] .ms-play .ms-verdict{margin:5px 0;min-height:0}
[data-session=mosaico] .ms-play .ms-hints{padding:10px 0}
[data-session=mosaico] .ms-play .ms-keys{padding:10px 0}
[data-session=canica] .cb-play .cb-readings{grid-column:1;grid-row:1;padding:12px 16px}
[data-session=canica] .cb-play .cb-stage{grid-column:1;grid-row:2}
[data-session=canica] .cb-play .cb-view{height:clamp(260px,calc(100dvh - 250px),560px);max-height:none;aspect-ratio:auto}
[data-session=canica] .cb-play .cb-legend{grid-column:1;grid-row:3;padding:10px}
[data-session=canica] .cb-play .cb-win{grid-column:1;grid-row:4;margin:10px}
[data-session=canica] .cb-play .cb-controls{padding:10px 0;gap:10px;flex-wrap:wrap;justify-content:center}
[data-session=canica] .cb-play .cb-actions{padding:10px 0;flex-wrap:wrap;gap:8px}
[data-session=canica] .cb-play .cb-status{margin:8px 0;padding:0}
[data-session=canica] .cb-play .cb-instructions{padding:12px 0;font-size:12px}
@media(max-width:760px){
 .session-expanded .session-workspace,.session-expanded .session-dynamic-workspace{display:flex;flex-direction:column;gap:10px}
 .session-expanded :is(.session-play,.session-side,.session-console){width:100%;max-height:none;overflow:visible}
 .session-expanded .session-console{padding:12px}
 .session-expanded .session-dynamic-workspace{gap:0}
 .session-dynamic-workspace>.session-console{border-width:1px 0 0}
 .session-expanded .session-dynamic-workspace>:not(.session-console){width:100%}
 .session-panel :is(.ms-levels,.cb-levels){grid-template-columns:1fr}
 [data-session=atascos] #traffic-stage,[data-session=laseres] #laser-stage,[data-session=sokoban] #soko-stage{height:280px}
 [data-session=atascos] .traffic-controller .traffic-panel-title{display:none}
 [data-session=atascos] .traffic-selection{padding:6px;margin:7px 0}
 [data-session=laseres] .laser-panel-title{margin-bottom:8px}
 [data-session=laseres] .laser-selection{margin:8px 0;padding:6px}
 [data-session=sokoban] #soko-stage{height:240px}
 [data-session=sokoban] .soko-controls{padding:0}
 [data-session=sokoban] .soko-dpad{grid-template-columns:repeat(4,44px);grid-template-rows:44px}
 [data-session=sokoban] .soko-dpad>button{grid-area:auto}[data-session=sokoban] .soko-dpad>span{display:none}
 [data-session=tangram] #tg-stage{height:245px}
 [data-session=tangram] .tg-tray{grid-template-columns:repeat(7,minmax(0,1fr))}
 [data-session=tangram] .tg-tray button{min-height:44px}
 [data-session=tangram] .tg-tray svg{height:26px}
 [data-session=tangram] .tg-section-heading{margin-bottom:8px}
 [data-session=hanoi] #hn-stage{height:220px}
 [data-session=hanoi] .hn-caption{padding:7px;font-size:8px}
 [data-session=hanoi] .hn-towers>button{min-height:108px}
 [data-session=hanoi] .hn-mini-stack{height:50px}
 [data-session=quince] #qz-stage{width:min(100%,320px)}
 [data-session=quince] #qz-target{width:105px;float:right;margin:0 0 8px 12px}
 [data-session=quince] .session-target-label{display:none}
 [data-session=nonogramas] #ng-stage{max-width:365px}
 [data-session=nonogramas] .ng-instruction{font-size:11px;padding:8px 12px}
 [data-session=clave-secreta] .mm-history{max-height:190px}
 [data-session=clave-secreta] .mm-vault{padding:10px 12px}
 [data-session=clave-secreta] .mm-editor{padding:10px 12px}
 [data-session=mosaico] .ms-play .ms-board{height:230px}
 [data-session=mosaico] .ms-play .ms-palette{grid-template-columns:repeat(6,minmax(0,1fr))}
 [data-session=mosaico] .ms-play .ms-tip{margin-top:5px}
 [data-session=canica] .cb-play .cb-view{height:300px}
 [data-session=canica] .cb-play .cb-readings{padding:9px 12px}
 [data-session=canica] .cb-play .cb-controls{padding:0 0 8px;justify-content:space-between}
 [data-session=canica] .cb-play .cb-actions{padding:4px 0}
}
@media(min-width:761px) and (max-height:500px){.session-expanded .session-console{max-height:none}.session-expanded .session-workspace,.session-expanded .session-dynamic-workspace{grid-template-columns:minmax(0,1fr) 300px}}
/* Keep drawings inside their measured viewport and reduce secondary vertical spacing. */
[data-session=canica] .cb-play .cb-stage{height:clamp(260px,calc(100dvh - 275px),550px)}
[data-session=canica] .cb-play .cb-view{height:auto;max-height:none;aspect-ratio:auto}
[data-session=tangram] #tg-stage{height:clamp(230px,calc(100dvh - 310px),500px)}
[data-session=tangram] .tg-scene-caption{display:none}
[data-session=tangram] .tg-tray button{height:55px}
[data-session=tangram] .tg-verdict{padding:6px 0;min-height:30px}
[data-session=nonogramas] #ng-stage{width:min(100%,max(290px,calc(100dvh - 420px)),460px)}
[data-session=clave-secreta] .mm-play .mm-board{padding:10px 14px 12px}
[data-session=clave-secreta] .mm-play .mm-empty-history{padding:12px;min-height:60px;font-size:12px}
[data-session=clave-secreta] .mm-play .mm-editor{margin-top:8px;padding:10px 0 0}
[data-session=clave-secreta] .mm-play .mm-slots{padding:10px 0;gap:10px}
[data-session=clave-secreta] .mm-play .mm-palette{padding:4px 0;margin:6px 0}
[data-session=clave-secreta] .mm-play .mm-editor-bottom>span{display:none}
[data-session=clave-secreta] .mm-play .mm-editor-bottom .mm-primary{flex-basis:auto;flex:1;font-size:12px;min-height:44px}
[data-session=clave-secreta] .mm-play .mm-editor-bottom .quiet-button{min-height:44px}
@media(max-width:760px){
 [data-session=tangram] #tg-stage{height:180px}
 [data-session=tangram] .tg-stage-label{padding:5px 12px 0}
 [data-session=tangram] .tg-board-heading{padding:7px 12px}
 [data-session=tangram] .tg-legend{padding:8px 12px;gap:8px;font-size:10px;margin:0}
 [data-session=tangram] .tg-tray button{height:47px}
 [data-session=tangram] .tg-selected-heading{padding:5px 0}
 [data-session=nonogramas] #ng-stage{width:min(100%,310px)}
 [data-session=nonogramas] .ng-first>div{gap:7px}
 [data-session=nonogramas] .ng-first p{margin-top:4px}
 [data-session=clave-secreta] .mm-play .mm-vault{padding:8px 10px;gap:8px;flex-direction:row}
 [data-session=clave-secreta] .mm-play .mm-lock-copy{font-size:10px}
 [data-session=clave-secreta] .mm-play .mm-secret{gap:6px}
 [data-session=clave-secreta] .mm-play .mm-secret .mm-gem{width:28px;height:28px;font-size:16px}
 [data-session=clave-secreta] .mm-play .mm-vault .eyebrow{font-size:8px}
 [data-session=canica] .cb-play .cb-stage{height:280px}
 [data-session=canica] .cb-play .cb-view{height:auto}
}
[data-session=nonogramas] .ng-help-bar{padding:7px 12px;gap:8px;flex-wrap:wrap}
[data-session=nonogramas] .ng-help-bar>div{display:none}
[data-session=nonogramas] .ng-help-bar .button,[data-session=nonogramas] .ng-help-bar .quiet-button{font-size:11px;min-height:36px;padding:7px 10px}
[data-session=nonogramas] #ng-stage{width:min(100%,max(270px,calc(100dvh - 460px)),430px)}
@media(max-width:760px){[data-session=nonogramas] #ng-stage{width:min(100%,280px)}}

[data-session=nonogramas] #ng-stage:has(.ng-grid:is([data-size="8"],[data-size="10"])){width:min(100%,430px)}
.session-panel :is(.tg-intro,.hn-intro,.qz-intro,.ng-intro,.mm-intro){display:block;padding:14px}
