/* Studio comfort corrections. The grid follows the actual toolbar height. */
:root { --tool-rail:136px; --inspector-width:268px; }
body { display:grid; grid-template-rows:auto auto minmax(0,1fr) auto; min-width:0; }
.app-header { height:auto; min-height:57px; min-width:0; }
.topbar { height:auto; min-height:49px; min-width:0; padding:8px 18px 8px calc(var(--tool-rail) + 16px); gap:16px; flex-wrap:wrap; }
.workspace { position:relative; height:auto; min-height:0; min-width:0; overflow:hidden; grid-template-columns:var(--tool-rail) minmax(0,1fr) var(--inspector-width); }
.tool-dock { min-width:0; padding:12px 10px; overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain; scrollbar-gutter:stable; }
.tool-group { margin-bottom:10px; min-width:0; }
.tool-group-title { font-size:10px; line-height:1.4; letter-spacing:.55px; margin:4px 0 7px; color:#73796a; overflow-wrap:anywhere; }
.tool-grid { grid-template-columns:repeat(2,minmax(44px,1fr)); gap:6px; }
.tool-button { min-width:44px; min-height:44px; height:48px; padding:8px 5px; border-radius:7px; }
.tool-button svg { width:28px; height:28px; flex:none; }
.tool-button[aria-pressed=true] { box-shadow:inset 0 0 0 1px #bdc6a7; }
.tool-button:focus-visible { outline-offset:-3px; }
.edit-dock { flex:none; min-height:44px; margin:8px 0 12px; padding:8px 4px; font-size:11px; line-height:1.4; overflow-wrap:anywhere; }
.dock-help { flex:none; min-height:44px; font-size:10px; padding:10px 3px; }
.inspector { min-width:0; min-height:0; overflow-x:hidden; overscroll-behavior:contain; }
.inspector-section { padding:17px 16px; min-width:0; }
.inspector-section p,.edit-subdetails summary,.section-kicker { overflow-wrap:anywhere; }
.select-row { min-width:0; flex-wrap:wrap; row-gap:6px; }
.select-row select { min-width:0; max-width:100%; }
.editing-panel .select-row select { max-width:160px; }
.edit-number-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.edit-number-grid label { min-width:0; }
.edit-actions button { white-space:normal; }
.edit-commit { position:sticky; bottom:0; z-index:2; margin-bottom:0; box-shadow:0 -3px 10px #30372f0c; }
.selection-state { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:7px; padding:9px; margin:10px 0; border:1px solid #c6cfb6; border-radius:5px; background:#e9eddf; font-size:10px; }
.selection-state button { border:1px solid #c0c9b0; background:#fffdf4; padding:7px 9px; font-size:10px; }
.layer,.layer-extras,.preset-row,.preset-choice { min-width:0; }
.layer-thumbnail,.visibility,.layer-index { flex:none; }
.preset-choice span { min-width:0; overflow-wrap:anywhere; }
.preset-choice canvas { flex:none; max-width:36%; object-fit:contain; }
.wood-palette { width:100%; max-width:240px; margin-left:auto; margin-right:auto; transform:rotate(-4deg); transform-origin:center; }
.statusbar { height:auto; min-height:30px; min-width:0; }
.statusbar>* { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.graphics-message { max-width:calc(100% - 28px); left:14px; right:14px; line-height:1.5; }
.graphics-message button { flex:none; }
.reference-board { max-width:calc(100% - 20px); max-height:calc(100% - 20px); }
.focus-mode .workspace { grid-template-columns:0 minmax(0,1fr) 0; }
.focus-mode .tool-dock,.focus-mode .inspector { visibility:hidden; padding:0; border:0; }

@media(min-width:1700px) {
 :root { --tool-rail:144px; --inspector-width:288px; }
 .tool-button { height:52px; }
 .inspector-section { padding:18px 20px; }
}
@media(max-width:1250px) {
 :root { --tool-rail:128px; --inspector-width:248px; }
 .topbar { padding:8px 12px; gap:12px; }
 .tool-dock { padding-left:8px; padding-right:8px; }
 .top-slider input { width:76px; }
 .app-header { gap:10px; }
 .title-button { max-width:160px; }
 .inspector-section { padding:15px 13px; }
}
@media(max-width:1000px) {
 .save-status { display:none; }
 .title-button { max-width:130px; }
 .app-header { padding:8px 12px; }
 .header-actions { gap:9px; }
 .topbar { gap:10px; }
}
@media(max-width:900px) {
 .workspace { grid-template-columns:var(--tool-rail) minmax(0,1fr) 0; }
 .inspector { position:absolute; right:0; top:0; bottom:0; width:280px; max-width:calc(100% - var(--tool-rail)); transform:translateX(100%); visibility:hidden; box-shadow:-8px 0 30px #0002; z-index:12; }
 .inspector.mobile-open { transform:none; visibility:visible; }
 .palette-mobile-toggle { display:inline-flex!important; align-items:center; min-height:30px; }
 .top-slider input { width:64px; }
 .opacity-slider { display:flex; }
 .first-hint { max-width:220px; }
 .scene-label { max-width:48%; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
 .statusbar #pointer-status { display:none; }
 .focus-mode .inspector { visibility:hidden; }
}
@media(max-width:680px) {
 :root { --tool-rail:72px; }
 body { min-width:0; }
 .app-header { min-height:53px; padding:7px 9px; flex-wrap:wrap; gap:6px; }
 .brand { font-size:25px; flex:none; }
 .header-actions { gap:6px; flex-wrap:wrap; }
 .header-actions .quiet-button { padding:5px; }
 .primary-button { padding:9px 10px; }
 .topbar { min-height:47px; padding:7px 9px; gap:8px 10px; }
 .top-slider { font-size:10px; gap:5px; }
 .top-slider input { width:54px; }
 .top-slider output { font-size:9px; min-width:24px; }
 .view-actions { gap:6px; }
 .tool-dock { padding:8px 5px; scrollbar-gutter:auto; }
 .tool-grid { grid-template-columns:minmax(44px,1fr); gap:4px; }
 .tool-button { height:44px; min-width:44px; padding:7px 4px; }
 .tool-button svg { width:26px; height:26px; }
 .tool-group-title { font-size:9px; letter-spacing:0; margin:5px 0 7px; }
 .edit-dock { font-size:10px; }
 .dock-help { font-size:9px; overflow-wrap:anywhere; }
 .inspector { width:280px; }
 .inspector-section { padding:15px; }
 .wood-palette { transform:rotate(-4deg); width:100%; }
 .statusbar { min-height:28px; padding:0 9px; font-size:9px; gap:9px; }
 .statusbar #medium-status { flex:1; }
 .graphics-message { top:9px; left:9px; right:9px; padding:8px; font-size:9px; max-width:calc(100% - 18px); }
 .viewport-controls { right:10px; bottom:12px; }
 .first-hint { max-width:min(210px,calc(100% - 30px)); }
}