/* Touch workspace: tools sit around the canvas, never squeeze it on opening. */
.canvas-view-tools{position:absolute;top:42px;right:16px;z-index:10}
.canvas-view-tools button{min-height:44px;padding:0 12px;border:1px solid #173f7328;border-radius:24px;background:#fffdf5ed;font-size:11px;box-shadow:0 2px 6px #173f7308}
.touch-hint,#collapseIconLibrary{display:none}
.zaoba-editor #closeIconLibrary{width:auto;min-width:54px;font-size:12px;padding:0 7px}
@media(max-width:760px), (pointer:coarse) and (max-width:1024px){
  html:has(body.zaoba-editor){height:100%;overflow:hidden;overscroll-behavior:none}
  body.zaoba-editor{height:var(--editor-height,100dvh);min-height:0;overflow:hidden;overscroll-behavior:none;display:flex;flex-direction:column;padding:env(safe-area-inset-top) env(safe-area-inset-right) 0 env(safe-area-inset-left);-webkit-tap-highlight-color:transparent}
  .zaoba-header{flex:none;min-height:46px;height:46px;padding:0 12px;border-bottom:1px solid #173f7310}
  .zaoba-brand{font-size:24px;gap:8px;line-height:1}
  .zaoba-brand small,.back-zaoba{display:none}
  .frame-brand-mark{width:28px;height:30px;font-size:19px;border-width:1.5px;border-radius:7px}
  .zaoba-main{flex:1;min-height:0;width:100%;max-width:none;padding:0;display:flex;flex-direction:column}
  .zaoba-intro{height:0;padding:0;min-height:0;flex:none}
  .zaoba-intro>div:first-child{display:none}
  .work-menu{position:absolute;z-index:20;top:env(safe-area-inset-top);right:10px;height:46px;display:flex;align-items:center}
  .work-menu #saveStatus{display:none}
  .work-menu #openWorks{font-size:12px;min-height:44px;padding:0 8px}
  .frame-workbench{display:flex;flex-direction:column;flex:1;min-height:0;border:0;border-radius:0;overflow:visible;box-shadow:none}
  .workbench-toolbar{display:contents}
  .design-start-controls{order:0;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:8px;padding:4px 10px 6px;flex:none;background:var(--paper)}
  .design-start-controls .size-dropdown,.design-start-controls .template-dropdown{display:block;min-width:0}
  .design-start-controls label>span{display:none!important}
  .design-start-controls label select{width:100%;max-width:none;min-height:44px;height:44px;padding:7px 22px 7px 9px;border-radius:10px;font-size:12px}
  .editor-layout,.editor-layout.library-open{order:1;position:relative;display:flex;flex-direction:row;flex:1;min-height:0;overflow:hidden}
  .zaoba-editor .canvas-area{position:relative!important;top:auto!important;display:flex;flex-direction:column;flex:1;min-height:0;width:100%;overflow:hidden;padding:0}
  .zaoba-editor .canvas-surface,.zaoba-editor #canvasArea.expanded .canvas-surface,.zaoba-editor .editor-layout.library-open .canvas-surface{height:auto!important;min-height:0!important;max-height:none;flex:1;min-width:0;width:100%;padding:32px 8px 56px!important}
  .zaoba-editor #designCanvas{touch-action:none;user-select:none;-webkit-user-select:none;overflow:visible}
  .canvas-meta{top:5px;left:12px;right:12px;font-size:9px;height:24px;align-items:center}
  #templateSeriesLink{display:none}
  .canvas-view-tools{top:0;right:8px}
  .canvas-view-tools button{min-height:36px;border:0;background:#fffdf6c9;font-size:10px;padding:0 10px}
  .touch-hint{display:block;flex:none;text-align:center;color:var(--muted);font-size:10px;line-height:20px;padding:0 8px;pointer-events:none}
  .zaoba-editor .canvas-help,.zaoba-editor .editor-layout.library-open .canvas-help{position:absolute;top:60px;bottom:auto;left:8px;right:8px;z-index:15;min-height:0;padding:0 4px;max-height:48px;overflow:auto;line-height:1.4;pointer-events:none;background:#f3ecd9eb;border-radius:7px}
  #constraintStatus:not(.warning){display:none}
  .zaoba-editor #constraintStatus.warning{font-size:11px;display:block;padding:2px 0 4px}
  .zaoba-editor #inlineTextError:not(:empty){font-size:11px;padding-bottom:3px}
  .zaoba-editor #limitLegend{top:37px;bottom:auto;left:12px;font-size:9px;gap:9px;z-index:2}
  .zaoba-editor #canvasQuickbar,.zaoba-editor .editor-layout.library-open #canvasQuickbar{bottom:6px;gap:0;padding:3px 4px;max-width:calc(100% - 12px);border-radius:14px;box-shadow:0 3px 16px #173f7317;overflow-x:auto;overscroll-behavior:contain;scrollbar-width:none}
  .zaoba-editor #canvasQuickbar>strong{display:none}
  .zaoba-editor #canvasQuickbar button{min-height:44px;min-width:44px;padding:4px 9px;font-size:12px;white-space:nowrap;flex:none}
  #flipControls{display:flex;flex:none}
  .zaoba-editor #textFontControl select{font-size:14px;min-height:44px;max-width:160px}
  .zaoba-editor .inplace-text{background:#fffdf5f2;border:1px dashed #173f7380!important;border-radius:7px;padding:4px 2px;box-shadow:0 3px 14px #173f7314}
  .creation-tools{order:2;display:grid;grid-template-columns:1fr 1fr .8fr;flex:none;gap:7px;margin:0;padding:5px 10px;border-top:1px solid #173f7318;background:var(--paper);z-index:32}
  .creation-tools>button,.color-control>button{min-height:44px;height:44px;padding:5px;gap:6px;font-size:13px;border-radius:10px;background:#fffdf6}
  .creation-tools>button[aria-expanded=true]{background:#f5dbe4;box-shadow:inset 0 0 0 1px #a1455335}
  #colorPopover{top:auto;bottom:calc(100% + 10px);right:0;max-width:calc(100vw - 24px);z-index:40}
  .workbench-bottom{order:3;position:relative;flex:none;margin:0;border-radius:0;padding:4px 10px max(7px,env(safe-area-inset-bottom));gap:7px;display:flex;align-items:center;z-index:31}
  .history-tools{padding:0;gap:0;border:0;background:transparent}
  .history-tools button{height:44px;width:44px;min-width:44px}
  .history-tools>span,#toggleCanvas{display:none}
  .preview-model-button,.zaoba-editor .finish-button{min-height:44px;height:44px;min-width:0;padding:5px 7px;font-size:12px;gap:3px;white-space:nowrap;max-width:none}
  .preview-model-button .tool-art-icon,.finish-button .tool-art-icon{width:23px;height:23px}
  .save-secondary,.editor-bottom-note{display:none}
  .zaoba-editor .icon-library,.zaoba-editor .editor-layout.library-open .icon-library{position:absolute;right:0;top:0;bottom:0;z-index:25;width:min(280px,76vw);height:100%;max-height:none;min-height:0;overflow:visible;padding:12px;display:flex;flex-direction:column;border:1px solid #173f7325;border-right:0;border-radius:17px 0 0 17px;box-shadow:-8px 0 24px #173f731b;background:#fffaf0}
  .library-heading{flex:none;gap:5px}
  .library-heading h2{font-size:23px}
  .zaoba-editor #closeIconLibrary{min-height:44px;height:44px;min-width:56px;font-size:12px;background:#f3ecd9;border-radius:10px}
  #collapseIconLibrary{display:flex;position:absolute;left:-43px;top:42%;z-index:2;width:44px;min-height:80px;padding:8px 2px;flex-direction:column;align-items:center;justify-content:center;background:#fffaf0;border:1px solid #173f7325;border-right:0;border-radius:13px 0 0 13px;box-shadow:-6px 2px 10px #173f7308;font-size:11px}
  #collapseIconLibrary span{font-size:29px;line-height:26px}
  .library-search{flex:none;margin:8px 0}
  .library-search input{min-height:44px;font-size:16px}
  .icon-categories{display:flex;flex:none;max-height:96px;flex-wrap:wrap;overflow-y:auto;gap:3px;margin:0;padding:0 0 5px;overscroll-behavior:contain}
  .icon-categories button{min-height:44px;padding:5px 8px;font-size:12px;flex:none}
  #libraryHint{flex:none;font-size:10px;line-height:1.5;margin:6px 0}
  .icon-grid{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;grid-template-columns:repeat(3,minmax(0,1fr));align-content:start;gap:6px;padding-bottom:12px}
  .icon-tile{min-height:88px;padding:6px 2px}
  .icon-tile>img,.icon-tile>svg{width:48px;height:48px}
  .icon-tile>span{font-size:10px}
  .zaoba-editor .toast{top:auto;bottom:122px;height:auto;width:max-content;max-width:calc(100vw - 28px);font-size:12px;pointer-events:none}
  .zaoba-editor dialog{max-height:calc(var(--editor-height,100dvh) - 20px);overscroll-behavior:contain}
}
@media(max-width:360px){
  .preview-model-button .tool-art-icon,.finish-button .tool-art-icon{display:none}
  .zaoba-editor #canvasQuickbar button{font-size:11px;padding:4px 7px}
}
@media(max-height:510px) and (pointer:coarse){
  .zaoba-header{display:none}
  .work-menu{display:none}
  .design-start-controls{padding:2px 8px}
  .creation-tools{padding:2px 10px}
  .workbench-bottom{padding-top:0;padding-bottom:max(3px,env(safe-area-inset-bottom))}
  .touch-hint{display:none}
  .zaoba-editor .canvas-surface{padding-top:20px!important;padding-bottom:52px!important}
}
@media(min-width:600px) and (max-width:1024px) and (max-height:510px) and (pointer:coarse){
  .frame-workbench{display:grid;grid-template-columns:minmax(0,1fr) 150px;grid-template-rows:48px minmax(0,1fr) auto}
  .design-start-controls{grid-column:1 / -1;grid-row:1}
  .editor-layout,.editor-layout.library-open{grid-column:1;grid-row:2 / 4}
  .creation-tools{grid-column:2;grid-row:2;grid-template-columns:1fr;align-content:start;gap:6px;padding:8px;border-top:0;border-left:1px solid #173f7315}
  .creation-tools>button,.color-control>button{width:100%}
  .workbench-bottom{grid-column:2;grid-row:3;flex-wrap:wrap;justify-content:center;padding:4px 8px;gap:5px}
  .history-tools{width:100%;justify-content:center}
  .preview-model-button,.zaoba-editor .finish-button{flex-basis:100%;min-height:44px}
  .zaoba-editor #canvasQuickbar{bottom:3px}
  .zaoba-editor .icon-library,.zaoba-editor .editor-layout.library-open .icon-library{padding:6px 10px}
  .icon-categories{max-height:44px;flex-wrap:nowrap;overflow-x:auto}
  .image-motif-library-entry{min-height:44px;padding:5px 8px;margin:3px 0}
  .image-motif-library-entry span{display:none}
  .library-search{margin:3px 0}
  #libraryHint{display:none}
}
