/* R1.4 remains intact; this sheet only arranges the drawing workspace. */
.workspace-bar{grid-column:1/-1;grid-row:1;display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0}
.workspace-bar strong{font-size:14px}.workspace-bar button{min-width:112px;min-height:48px}
.editor{grid-template-rows:auto auto 1fr;--sheet-height:clamp(396px,min(calc(100dvh - 156px),calc((100vw - 396px)*1491/1055)),660px)}
#stage{grid-row:2/4}.colors{grid-row:2}.tools{grid-row:3}
#palette-close,.compact-menu{display:none}
html.color-expanded,body.color-expanded{overflow:hidden;overscroll-behavior:none}
body.color-expanded>header,body.color-expanded>footer{display:none}
.editor.compact{position:relative;width:100%;max-width:none;height:calc(100dvh - 92px);min-height:320px;margin:0;padding:4px;gap:4px;grid-template-columns:minmax(0,1fr);grid-template-rows:48px minmax(0,1fr) 52px 48px}
.color-expanded .editor.compact{position:fixed;inset:0;height:100dvh;min-height:0;padding:max(4px,env(safe-area-inset-top)) max(4px,env(safe-area-inset-right)) max(4px,env(safe-area-inset-bottom)) max(4px,env(safe-area-inset-left));background:#f5f3ec;z-index:10}
.compact .workspace-bar{grid-row:1;grid-column:1;padding:0 4px}
.compact #stage{grid-row:2;grid-column:1;width:100%;height:100%;max-width:none;min-height:0;border-radius:12px}
.compact .colors{grid-column:1;grid-row:3;padding:0;border:0;background:transparent;align-self:stretch}
.compact .palette-actions{grid-template-columns:repeat(4,minmax(48px,1fr));gap:4px}
.compact button,.compact .swatch{min-height:48px;min-width:48px}
.compact .palette-actions button{height:48px;flex-direction:row;font-size:12px;gap:5px}
.compact #current-color{width:22px;height:22px;flex-shrink:0}
.compact .palette-panels{display:none;position:absolute;bottom:108px;left:4px;right:4px;max-height:calc(100% - 168px);overflow:auto;padding:10px;background:#fffdf8;border:1px solid #b4c3b7;border-radius:16px;box-shadow:0 5px 24px #162a3533;z-index:3;min-height:0}
.compact.palette-open .palette-panels{display:block}
.compact #palette-close{display:flex;margin:8px 0 0;width:100%}
.compact .basic-swatches{gap:6px}.compact .swatch{width:48px;height:48px}
.compact .swatch-list .swatch{width:100%}
.compact .tools{grid-column:1;grid-row:4;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));align-self:stretch;gap:4px;min-width:0}
.compact .zoom-tools,.compact .edit-tools{display:contents}
.compact .tools button{padding:3px 1px;height:48px}
.compact .tools #fit{font-size:11px;line-height:1.1}
.compact .tools .tip,.compact .auto-tools,.compact .result-tools,.compact .selection,.compact .edit-tools span{display:none}
.compact-menu{gap:8px}
body:has(.compact) .compact-menu{display:grid;grid-template-columns:1fr 1fr}
.compact-menu button{font-size:13px;margin:0;min-height:48px}
dialog button,dialog .button{min-height:48px}
@media(orientation:landscape) and (min-width:701px){
 .editor.compact{grid-template-columns:minmax(0,1fr) 156px;grid-template-rows:48px minmax(0,1fr) 100px;min-height:250px}
 .compact .workspace-bar{grid-column:1/-1}
 .compact #stage{grid-column:1;grid-row:2/4}
 .compact .colors{grid-column:2;grid-row:2;align-self:start}
 .compact .tools{grid-column:2;grid-row:3;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,48px)}
 .compact .palette-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
 .compact .palette-panels{left:auto;right:4px;bottom:108px;width:304px;max-height:calc(100% - 164px)}
}
@media print{
 .workspace-bar{display:none!important}
 html.color-expanded,body.color-expanded{overflow:visible}
 body.color-expanded .editor{display:none!important}
}

@media(max-width:360px){.compact .basic-swatches{grid-template-columns:repeat(2,1fr)}}

.gesture-hint{display:block;font-size:11px;font-weight:400;color:#53635e;margin-top:3px}
