body .canvas-panel .stage:has(.classroom-memory){height:auto;min-height:0;flex:1;display:flex;flex-direction:column;padding:12px;overflow:visible}
.stage:has(.classroom-memory)>svg{display:none!important}
.classroom-memory{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;align-items:start;margin-top:12px;min-width:0}
.cm-region{border:1px solid #d8cebf;border-radius:8px;background:#fffdf7;padding:12px;min-width:0}
.cm-region h3{font-size:20px;margin:0 0 12px;color:#302b25}
.cm-cell{border-bottom:1px solid #e5ddcf;padding:9px 10px;min-width:0;background:#f5f0e6;transition:background .35s,border-color .35s;overflow-wrap:anywhere}
.cm-cell:last-child{border-bottom:0}.cm-label{font-size:14px;color:#696157;display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px}.cm-label small{font:12px ui-monospace,monospace}.cm-cell strong{font:600 19px/1.5 ui-monospace,monospace;display:block;color:#302b25}.cm-next{font-size:12px;border-top:1px solid #e5ddcf;padding-top:5px;margin-top:4px;color:#696157}.cm-next b{font:600 13px ui-monospace,monospace;color:#b94c20}.cm-cell.is-hot{background:#f9e4d5;box-shadow:inset 3px 0 #e66b35}.cm-cell.is-freed{opacity:.45;border:1px dashed #9a8e7d}.cm-cell.is-inactive{opacity:.55}.cm-empty{font-size:15px;color:#81796d;line-height:1.6;margin:22px 0}.cm-cell[data-changed]{animation:cm-write .6s ease-out}@keyframes cm-write{from{background:#f7c8a8;transform:translateY(4px)}to{transform:translateY(0)}}
@media(max-width:650px){.classroom-memory{gap:8px}.cm-region{padding:8px}.cm-region h3{font-size:17px}.cm-cell{padding:7px}.cm-cell strong{font-size:16px}}
.classroom-memory{position:relative}.cm-region:last-of-type{padding-right:26px}.cm-links{position:absolute!important;inset:0;width:100%!important;height:100%!important;pointer-events:none;overflow:visible!important;display:block!important}.cm-links path{vector-effect:non-scaling-stroke}
body .canvas-panel .stage:has(.classroom-memory){flex:0 0 auto;min-height:min-content}.classroom-memory .cm-cell{padding:6px 9px}.classroom-memory .cm-cell strong{font-size:17px;line-height:1.3}.classroom-memory .cm-next{margin-top:2px;padding-top:3px}.classroom-memory .cm-region h3{margin-bottom:8px}.classroom-memory .cm-region{padding-top:10px;padding-bottom:10px}
.classroom-memory .cm-label{font-size:12px;line-height:17px}.classroom-memory .cm-cell strong{font-size:16px;line-height:21px}.classroom-memory .cm-next{font-size:11px;line-height:16px;margin-top:0;padding-top:2px}.classroom-memory .cm-cell{padding:5px 8px}.classroom-memory .cm-next b{font-size:12px}
/* A single course toolbar; memory scrolls independently of its explanation. */
body:has(#classroomMemory) > main{grid-template-rows:auto minmax(0,1fr) 50px;gap:8px;padding-top:6px}
body:has(#classroomMemory) .classroom-tools{grid-row:1;grid-template-columns:max-content max-content minmax(0,1fr) max-content;gap:12px;min-height:38px;padding:0}
body:has(#classroomMemory) #nav{grid-row:auto;grid-column:auto;height:36px;min-height:36px;gap:8px}
body:has(#classroomMemory) #breadcrumb{display:none}
body:has(#classroomMemory) .intro h1{font-family:inherit;font-size:18px;letter-spacing:0}
body:has(#classroomMemory) #catalogButton,body:has(#classroomMemory) #operationButtons button,body:has(#classroomMemory) .settings-drawer summary{min-height:34px;padding:6px 10px;font-size:13px}
body:has(#classroomMemory) .workspace{grid-row:2;gap:12px}
body:has(#classroomMemory) .controls{grid-row:3}
body:has(#classroomMemory) .canvas-panel{overflow:hidden}
body:has(#classroomMemory) .canvas-panel>.panel-head{display:none}
body .canvas-panel .stage:has(.classroom-memory){flex:1 1 0;min-height:0;overflow:auto;padding:8px 10px}
body:has(#classroomMemory) .stage-goal{font-size:13px;margin:0;padding:4px 8px;line-height:20px}
.classroom-memory{margin-top:8px}
body:has(#classroomMemory) .canvas-panel>.explanation{flex:0 0 auto;border-top:1px solid #e5ddcf;padding:9px 12px;margin:0;min-height:0}
body:has(#classroomMemory) .explanation h2{font-size:18px;line-height:1.3;margin:0 0 3px}
body:has(#classroomMemory) .explanation p{font-size:14px;line-height:1.45;margin:0;overflow-wrap:anywhere}
body:has(#classroomMemory) #description,body:has(#classroomMemory) .canvas-panel>.variable-check{display:none}
body:has(#classroomMemory) .canvas-panel>.code-note{flex:0 0 auto;margin:0;padding:5px 12px;border-top:1px solid #e5ddcf;max-height:32%;overflow:auto}
@media(max-width:850px){body:has(#classroomMemory) .classroom-tools{grid-template-columns:max-content minmax(0,1fr) max-content;gap:6px}body:has(#classroomMemory) .intro{display:none}}
@media(max-width:550px){body:has(#classroomMemory) .classroom-tools{grid-template-columns:max-content minmax(0,1fr)}body:has(#classroomMemory) .settings-drawer{grid-column:1/-1}body:has(#classroomMemory) #operationButtons button{padding-inline:8px}}
body:has(#classroomMemory) .stage-goal{flex:0 0 auto;height:auto;min-height:28px}.classroom-memory{flex:0 0 auto}
.classroom-memory .cm-label{line-height:15px}.classroom-memory .cm-cell{padding-block:4px}.classroom-memory .cm-cell strong{line-height:20px}.classroom-memory .cm-next{line-height:14px;padding-top:1px}
/* The catalogue selects a storage structure; operations stay in the toolbar. */
#catalog{width:min(500px,calc(100vw - 32px))}
#catalog .catalog-body{display:block;min-height:0}
#catalog #chapters{display:none}
#catalog .chapter-content{padding:18px}
.catalog-structures{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.catalog-structure{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:18px;border:1px solid #d8cebf;border-radius:8px;background:#fffdf7;color:#302b25;text-align:left;cursor:pointer;transition:background .18s,border-color .18s}
.catalog-structure strong{font-size:21px}.catalog-structure span{font-size:14px;color:#756b5e}.catalog-structure:hover{background:#f5f0e6;border-color:#b4a58f}.catalog-structure.current{background:#f9e8db;border-color:#dfaa88}