/* Compact, touch-sized controls for the phone building workspace. */
.touch-help-entry { display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto; min-width:44px; min-height:44px; padding:8px 10px; border:1px solid #cddfd3; border-radius:11px; background:#f5f9f1; color:#376c58; font:inherit; font-size:12px; font-weight:650; touch-action:manipulation; }
.touch-help-entry:focus-visible { outline:3px solid #147987; outline-offset:3px; }
.edit-controls .phone-action-label { display:none; }
#workspace-menu .phone-view-settings .icon-button { display:flex; align-items:center; justify-content:flex-start; width:100%; gap:8px; padding:10px 12px; border:1px solid #d2e0cf; border-radius:10px; background:#f0f5e9; color:#507247; font:inherit; font-size:13px; }
#workspace-menu .phone-view-settings .icon-button:disabled { opacity:.45; }
#workspace-menu .phone-workspace-controls { margin-top:8px; }
@media screen and (max-width:600px), screen and (max-width:950px) and (max-height:500px) {
 .workshop.canvas-workspace { --phone-bottom:max(8px,env(safe-area-inset-bottom)); --materials-bottom:calc(64px + env(safe-area-inset-bottom)); --materials-height:min(300px,46dvh); }
 .canvas-workspace .reference-button,.canvas-workspace .ghost-button { min-width:44px; min-height:44px; background:#fbfdf9; }
 .canvas-workspace .reference-button { font-size:11px; }
 .canvas-workspace .camera-controls,.canvas-workspace .edit-controls { bottom:var(--phone-bottom); z-index:8; min-height:50px; padding:2px; gap:2px; border:1px solid #c8ddd1; border-radius:12px; background:#fbfdf9; box-shadow:0 2px 8px #31564b0c; }
 .canvas-workspace .camera-controls { left:max(8px,env(safe-area-inset-left)); flex-direction:row; }
 .canvas-workspace .edit-controls { right:max(8px,env(safe-area-inset-right)); }
 .canvas-workspace .camera-controls .camera-toolbar { width:auto; padding:0; gap:2px; border:0; }
 .canvas-workspace .camera-controls .camera-toolbar button,.canvas-workspace .edit-controls .icon-button { flex:0 0 44px; width:44px; height:44px; min-width:44px; min-height:44px; padding:10px; }
 .canvas-workspace .camera-toolbar button > span,.canvas-workspace .camera-toolbar kbd { display:none; }
 .canvas-workspace .camera-toolbar .icon,.canvas-workspace .edit-controls .icon { width:21px; height:21px; flex-basis:21px; }
 .canvas-workspace .edit-controls [data-action="rotate-piece"],.canvas-workspace .edit-controls [data-action="delete"],.canvas-workspace .edit-controls .tool-separator { display:none; }
 .canvas-workspace .workspace-edge-materials { bottom:var(--phone-bottom); min-width:88px; min-height:50px; padding:8px; gap:5px; font-size:12px; background:#fff8dc; }
 .canvas-workspace .workspace-edge-materials > .icon { display:block; width:19px; height:19px; flex-basis:19px; }
 .canvas-workspace .workspace-edge-library,.canvas-workspace .workspace-edge-steps { min-width:44px; min-height:56px; top:42%; padding:8px 6px; font-size:11px; background:#fbfdf9; }
 .canvas-workspace .piece-controls.is-mobile-docked { z-index:9; width:min(380px,calc(100% - 16px)); padding:4px 6px 6px; border-color:#bcd5c6; border-radius:14px; background:#fbfdf9; box-shadow:0 5px 18px #31564b1c; opacity:1; overscroll-behavior:contain; }
 .canvas-workspace .piece-controls.is-mobile-docked.is-dragging { opacity:.9; }
 .piece-controls.is-mobile-docked .piece-controls-grip,.piece-controls.is-mobile-docked .piece-controls-reset,.piece-controls.is-mobile-docked kbd { display:none; }
 .piece-controls.is-mobile-docked .piece-controls-chrome { min-height:44px; }
 .piece-controls.is-mobile-docked .piece-controls-chrome .piece-controls-label { padding-left:7px; font-size:12px; }
 .piece-controls.is-mobile-docked .piece-controls-chrome button { min-width:44px; min-height:44px; }
 .piece-controls.is-mobile-docked .piece-controls-body { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:4px 0; width:100%; }
 .piece-controls.is-mobile-docked button { min-height:44px; padding:7px; font-size:12px; }
 .piece-controls.is-mobile-docked .piece-controls-tilt,.piece-controls.is-mobile-docked .piece-controls-height { grid-row:1; justify-self:center; padding:0; border:0; }
 .piece-controls.is-mobile-docked .piece-controls-tilt { grid-column:1 / 4; }
 .piece-controls.is-mobile-docked .piece-controls-height { grid-column:4 / -1; }
 .piece-controls.is-mobile-docked .piece-controls-angle,.piece-controls.is-mobile-docked .piece-controls-level { padding:0; font-size:11px; }
 .piece-controls.is-mobile-docked .piece-controls-angle { min-width:50px; }
 .piece-controls.is-mobile-docked .piece-controls-body > button { grid-row:2; justify-self:center; min-width:44px; }
 .piece-controls.is-mobile-docked [data-action="turn-active-piece"] { grid-column:1 / 3; }
 .piece-controls.is-mobile-docked .piece-controls-invert { grid-column:3; }
 .piece-controls.is-mobile-docked .piece-controls-more { grid-column:4; }
 .piece-controls.is-mobile-docked .piece-controls-return { grid-column:5; width:44px; padding:8px; }
 .piece-controls.is-mobile-docked .piece-controls-return span { display:none; }
 .piece-controls.is-mobile-docked .piece-controls-dismiss { grid-column:6; }
 .piece-controls.is-mobile-docked .lamp-settings { grid-row:3; grid-column:1 / -1; justify-content:space-between; flex-wrap:wrap; }
 .piece-controls.is-mobile-docked .lamp-settings select { min-height:44px; font-size:16px; }
 .canvas-workspace .piece-controls.is-mobile-docked.is-collapsed { width:max-content; min-width:88px; }
 .piece-controls.is-mobile-docked.is-collapsed .piece-controls-expand { width:100%; }
 .canvas-workspace:is([data-open-panels~="materials"],[data-open-panels~="library"],[data-open-panels~="steps"]):not([data-material-dragging="true"]) .piece-controls { visibility:hidden; pointer-events:none; }
 .canvas-workspace .workspace-hud { bottom:calc(68px + env(safe-area-inset-bottom) + var(--tray-rise)); }
 .canvas-workspace .workspace-hud button { min-height:44px; font-size:12px; }
 .canvas-workspace .toast,.canvas-workspace .magnet-feedback { font-size:12px; }
 .canvas-workspace #workspace-library,.canvas-workspace #workspace-steps { bottom:calc(68px + env(safe-area-inset-bottom)); }
 #workspace-materials { background:#fbfdf9; }
 #workspace-materials .piece-tools { grid-template-columns:repeat(5,minmax(44px,1fr)); gap:5px; }
 #workspace-materials .piece-tool { min-width:44px; min-height:56px; font-size:10px; }
 #workspace-materials .tray-tabs button,#workspace-materials .rail-actions button,#workspace-materials .tray-height button,#workspace-materials .tray-placement button { min-height:44px; }
 #workspace-materials .tray-height button { min-width:44px; }
 #workspace-materials .tray-colors { flex-basis:100%; }
 #workspace-materials .color-swatches { max-width:none; flex-wrap:wrap; gap:4px; }
 #workspace-materials .color-swatch { min-width:44px; min-height:44px; background-clip:content-box; border:9px solid transparent; }
 #workspace-materials .color-swatch::after { inset:3px; }
 #workspace-materials:has([data-action="bricks-open"][aria-pressed="true"]) .color-swatches { flex-wrap:wrap; }
 #workspace-materials .brick-tools { grid-template-columns:repeat(3,minmax(44px,1fr)); }
}
/* Keep the building tools in one row on short landscape screens. */
@media screen and (max-width:950px) and (max-height:500px) {
 .canvas-workspace .piece-controls.is-mobile-docked { width:min(680px,calc(100% - 120px)); display:flex; flex-direction:row; align-items:center; gap:4px; }
 .piece-controls.is-mobile-docked .piece-controls-body { display:flex; flex:1; min-width:0; flex-wrap:nowrap; justify-content:flex-start; overflow-x:auto; min-height:48px; }
 .piece-controls.is-mobile-docked .piece-controls-body > * { flex-shrink:0; }
 .piece-controls.is-mobile-docked .piece-controls-chrome { min-height:44px; flex:0 0 44px; width:auto; }
 .piece-controls.is-mobile-docked .piece-controls-chrome .piece-controls-label { display:none; }
 .piece-controls.is-mobile-docked.is-collapsed .piece-controls-chrome { flex:1; }
 .canvas-workspace .workspace-edge-library,.canvas-workspace .workspace-edge-steps { top:32%; }
}