/* The material shelf and the drawing surface remain visible together. */
.build-settings{background:#f0f5ff;border-block:1px solid #cbdce8;position:relative;flex-shrink:0}
.build-settings>summary{cursor:pointer;padding:12px 18px;color:#21536b;font-size:15px;font-weight:600;min-height:46px}
.build-settings-body .ground-panel{border:0}.build-settings-body .build-context{height:auto;min-height:150px;overflow:visible}
.build-settings-body .build-context-actions{min-height:40px}.build-context-actions .btn{flex-shrink:0}
.studio.build-expanded{display:grid;grid-template-columns:154px minmax(0,1fr);grid-template-rows:auto auto 46px minmax(0,1fr);gap:0;overflow:hidden}
.build-expanded .build-toolbar{grid-column:1/-1;flex-wrap:nowrap;overflow-x:auto;padding:6px}
.build-expanded .build-tool{flex:0 0 auto;min-height:56px;min-width:55px}
.build-expanded .build-instruction{grid-column:1/-1;min-height:40px;padding:7px 12px}
.build-expanded .build-settings{grid-column:1/-1;grid-row:3;z-index:5}
.build-expanded .build-settings-body{position:absolute;right:0;top:100%;width:min(520px,calc(100vw - 20px));max-height:60vh;overflow:auto;border:1px solid #b8cdd9;background:#fff;box-shadow:0 12px 28px #12334430}
.build-expanded .build-settings .build-context{height:auto;min-height:150px;flex:none}
.build-expanded .construction-stage{grid-column:2;grid-row:4;min-width:0;min-height:0;display:flex;align-items:stretch}
.build-expanded .construction-stage>svg{flex:1;width:100%;height:100%;min-height:0;max-height:none}
.build-expanded .material-drawer{grid-column:1;grid-row:4;min-height:0;overflow-y:auto;overflow-x:hidden;border-right:1px solid #b5d8cb;display:flex;flex-direction:column}
.build-expanded .material-tabs{flex-shrink:0;flex-wrap:wrap;padding:5px;gap:3px}
.build-expanded .material-tabs button{width:100%;text-align:left;font-size:13px;min-height:40px;padding:7px 9px}
.build-expanded .shelf-items{overflow:visible;display:flex;flex-direction:column;min-height:0;align-items:center;padding:6px;gap:7px}
.build-expanded .shelf-items .shelf-piece{flex:0 0 auto;width:100%;max-width:136px;min-width:0;min-height:80px;border:1px solid #c7ded3;background:#ffffffa8}
.build-expanded .shelf-items .shelf-piece svg{width:44px;height:44px}.build-expanded .shelf-piece span{font-size:13px}
.build-expanded .saved-material{flex:none;width:100%;max-width:136px}
.sketch-tools{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 18px;background:#eef8ff;border-bottom:1px solid #c8dde8}
.sketch-tools>span{flex-basis:100%;font-size:15px;color:#31586d}.sketch-tools>a,.direct-tray a{font-size:15px;font-weight:650;color:#006f69;text-underline-offset:3px}
.canvas>svg:focus-visible{outline:3px solid #9962c7;outline-offset:-3px}
.pattern-canvas,.pattern-canvas>svg{min-height:280px;max-height:360px}
.drop-ready{outline:3px solid #7d3bc4!important;outline-offset:3px;background-color:#e8dcff!important}
[data-pattern-drop].drop-ready rect{fill:#ddc8ff;stroke:#7d3bc4;stroke-width:4}
.direct-tray [data-direct],.construction-stage,.heritage-stage,.canvas>svg,.early-cell,.tile-choice{touch-action:none;-webkit-user-select:none;user-select:none}
.build-settings[open]>summary{border-bottom:1px solid #cbdce8}
@media(max-width:740px){
 .studio.build-expanded{grid-template-columns:96px minmax(0,1fr);grid-template-rows:auto auto 44px minmax(0,1fr)}
 .build-expanded .build-tool{min-width:47px;min-height:55px;font-size:11px}.build-expanded .build-instruction{font-size:12px;min-height:36px}
 .build-expanded .material-tabs button{font-size:12px;padding:6px;min-height:38px}.build-expanded .shelf-items{padding:4px;gap:5px}
 .build-expanded .shelf-items .shelf-piece{min-height:72px;max-width:88px}.build-expanded .shelf-piece span{font-size:11px;line-height:1.2}
 .build-expanded .shelf-items .shelf-piece svg{width:36px;height:36px}.build-expanded .material-tabs{padding:4px}
 .sketch-tools{padding:12px}.sketch-tools .btn{flex:1}.sketch-tools>span{font-size:14px}
 .direct-tray{gap:8px;padding:12px}.direct-tray p{flex-basis:100%;margin:0}.return-tray{font-size:13px;padding:8px}.square-material{font-size:32px;padding:10px}.square-material span{font-size:14px}
 .pattern-canvas,.pattern-canvas>svg{min-height:240px;max-height:300px}
}
@media print{.sketch-tools,.build-settings{display:none}}

.balance-station{display:grid;grid-template-columns:minmax(0,1fr) 120px;gap:12px;padding:14px;background:#edf1ff;border-bottom:1px solid #c5cee8}
.balance-station .balance-tray{margin:0;padding:10px;gap:7px;min-height:92px;background:#fff}.balance-station .balance-tray strong{font-size:16px}.balance-station .balance-tray span{font-size:14px;flex-basis:auto}.balance-station .balance-tray button{font-size:13px;min-height:36px;padding:6px 10px}
.balance-add{display:flex;gap:7px;align-items:center;justify-content:center;flex-wrap:wrap}.balance-add .algebra-tile.variable{height:44px;min-width:44px}.balance-add small{font-size:12px;line-height:1.3;text-align:center;color:#334e67;flex-basis:100%}
.algebra-canvas{min-height:0}.algebra-canvas .algebra-sides{padding:16px 14px}.algebra-canvas .algebra-side{min-height:170px}
@media(max-width:740px){.balance-station{padding:10px;gap:8px;grid-template-columns:minmax(0,1fr) 92px}.balance-station .balance-tray{padding:8px}.balance-station .balance-tray strong{font-size:15px}.balance-add .algebra-tile,.balance-add .algebra-tile.variable{min-width:38px}.algebra-canvas .algebra-sides{padding:12px 8px}}

@media(max-width:600px){
 .studio.build-expanded{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto 44px minmax(0,1fr) 144px}
 .build-expanded .construction-stage{grid-column:1;grid-row:4}
 .build-expanded .material-drawer{grid-column:1;grid-row:5;overflow:hidden;border-right:0}
 .build-expanded .material-tabs{flex-wrap:nowrap;overflow-x:auto;padding:4px;min-height:44px}
 .build-expanded .material-tabs button{width:auto;flex-shrink:0;font-size:12px;min-height:36px;padding:6px 9px}
 .build-expanded .shelf-items{flex-direction:row;overflow-x:auto;overflow-y:hidden;padding:5px;min-height:91px;align-items:stretch}
 .build-expanded .shelf-items .shelf-piece{width:87px;min-width:87px;min-height:78px}.build-expanded .shelf-items .shelf-piece svg{width:40px;height:40px}
 .build-expanded .saved-material{width:87px;min-width:87px}.build-expanded .shelf-empty{min-width:260px}
}

@media(max-width:600px){.build-expanded .build-expand{order:-1;position:sticky;left:0;margin-left:0;z-index:2;background:#fff;border-right:1px solid #c8dcd7;color:#23594e;box-shadow:4px 0 5px #ffffffc9}}
