.preview-toolbar{display:none}
.topic-page #scene-content>.map-wide,.catalog .map-wide{display:none}
.reading-snippet{display:none;font-size:14px;line-height:1.8;padding:12px 16px;background:var(--surface);color:var(--depth)}
/* The sticky element and the controls share the same containing block. */
@media(max-width:850px){
 #workspace .experiment-layout,.topic-page .experiment-layout,.topic-page:is([data-topic=structure],[data-topic=argument]) .experiment-layout{display:block}
 #workspace .phenomenon,.topic-page .topic-phenomenon{display:contents;position:static}
 #workspace .phenomenon:after{display:none}
 #workspace .visual-frame,.topic-page .visual-frame,.topic-page[data-topic=maps] .visual-frame,.topic-page[data-topic=pixels] .visual-frame{position:sticky;top:0;z-index:5;background:var(--bg);padding:0 0 8px;border-bottom:1px solid var(--line);box-shadow:0 6px 9px #263c3510}
 .preview-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:44px;background:var(--bg)}
 .preview-toolbar>span{font-size:11px;line-height:1.5;color:var(--muted)}
 .preview-toggle{min-height:44px;flex:none;border:1px solid var(--line);border-radius:20px;background:var(--surface);color:var(--depth);font-size:12px;padding:6px 12px}
 .visual-frame .canvas-top{border-top:0;padding:4px 0 8px;line-height:1.5;gap:4px 12px}
 .visual-frame .canvas-top>span:first-child{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
 .visual-frame .canvas-top>span:last-child:not(:first-child){display:none}
 #workspace #scene,.topic-page #scene-content>svg{display:block;width:100%;height:auto;max-height:var(--preview-scene-height,32vh);aspect-ratio:auto}
 .topic-page #scene-content:has(.science-moon-sky)>svg{height:calc(var(--preview-scene-height,32vh) / 2);max-height:none}
 .topic-page:is([data-topic=structure],[data-topic=argument]) #scene-content{max-height:var(--preview-scene-height,32vh);overflow:auto;overscroll-behavior:contain}
 .reading-snippet{font-size:14px;line-height:1.6;padding:8px 12px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
 .topic-page .controls,#workspace .controls{position:static;order:initial;margin-top:20px}
 .experiment-layout .controls :is(button,input,select,summary){scroll-margin-top:var(--preview-scroll-offset,320px);scroll-margin-bottom:24px}
 #reading-content{margin-top:16px}
 #reading-content :is(button,summary){scroll-margin-top:var(--preview-scroll-offset,320px);scroll-margin-bottom:24px}
 .topic-page:is([data-topic=structure],[data-topic=argument]) .experiment-layout{display:flex;flex-direction:column;align-items:stretch}
 .topic-page:is([data-topic=structure],[data-topic=argument]) .controls{order:1}
 .topic-page:is([data-topic=structure],[data-topic=argument]) #topic-extra{order:2}
 .topic-page:is([data-topic=structure],[data-topic=argument]) #reading-content{order:3}
}
@media(max-width:850px) and (max-height:500px) and (orientation:landscape){
 .preview-toolbar{justify-content:flex-end}
 .preview-toolbar>span{display:none}
 .visual-frame .canvas-top{position:absolute;top:0;left:0;right:118px;min-height:44px;padding:0;align-items:center}
 .topic-page #scene-content:has(.science-moon-sky){display:flex;justify-content:center}
 .topic-page #scene-content:has(.science-moon-sky)>svg{width:50%;height:var(--preview-scene-height,28vh);max-height:none}
 .topic-page #scene-content>.map-tall{display:none}
 .topic-page #scene-content>.map-wide{display:block}
}
