/* Wide-screen workspace. The phone layout remains below 1024px. */
@media(min-width:1024px){
 :root{--sidebar-width:380px;--rail-width:100px;--dock-height:0px;--header-height:72px}
 body>header{padding:0 26px}.workspace .sectionhead h1{font-size:26px}
 body>main,body.tools-open>main{position:absolute;top:var(--header-height);bottom:0;left:var(--rail-width);right:0;width:auto;height:auto;max-width:none;flex:none;margin:0;padding:0}
 body.tools-open>main{right:var(--sidebar-width);padding:0}
 body .workspace,body.tools-open .workspace{padding:18px 24px;height:100%;max-width:1100px;margin:auto;gap:6px}
 body .workspace>.sectionhead,body.tools-open .workspace>.sectionhead{display:flex;margin:0;min-height:44px}
 body .workspace>.previewtools,body.tools-open .workspace>.previewtools{display:flex;margin:0}
 body .workspace>.stage,body.tools-open .workspace>.stage{flex:1;min-height:0;padding:12px;background:#080808;border:1px solid #3f312c}
 body .workspace .canvaswrap,body.tools-open .workspace .canvaswrap{height:100%;width:auto;max-width:100%;min-width:0;aspect-ratio:9/16;box-shadow:0 10px 35px #0009}
 body .workspace>.transport,body.tools-open .workspace>.transport{height:44px;min-height:44px;margin:0}
 body .workspace>.quickbar,body.tools-open .workspace>.quickbar{display:flex;margin:0;height:38px}
 body .workspace>.mediaquick,body.tools-open .workspace>.mediaquick{display:none}
 body .appdock{position:absolute;top:var(--header-height);bottom:0;left:0;right:auto;width:var(--rail-width);min-height:0;display:flex;flex-direction:column;justify-content:flex-start;gap:8px;padding:18px 8px;border-top:0;border-right:1px solid #44342e;background:#101010}
 body .appdock button{flex:0 0 74px;width:100%;max-width:none;min-height:64px;font-size:12px;gap:8px}
 body .appdock button[aria-pressed=true]{box-shadow:inset 3px 0 #ec302c}
 body #toolsheet{position:absolute;top:var(--header-height);bottom:0;left:auto;right:0;width:var(--sidebar-width);height:auto;max-height:none;margin:0;border-radius:0;border-top:0;border-left:1px solid #594137;box-shadow:none}
 #toolsheet .sheetheading{min-height:65px;padding:12px 18px}#sheethost{height:auto;min-height:0;flex:1;overflow:auto}#editorcontrols{padding:16px}
 #toolsheet[data-view=details] #panel-details{grid-template-columns:1fr;grid-template-rows:auto auto auto}
 #toolsheet[data-view=details] .search{grid-column:1}#toolsheet[data-view=details] .filters{grid-column:1}
 #toolsheet .catalogue{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible;padding-bottom:6px;gap:10px}
 #toolsheet .catalogue .detailcard{min-width:0;min-height:118px}#toolsheet .catalogue .detailmain strong{max-width:none;font-size:14px}
 #toolsheet .templates,#toolsheet[data-view=templates] .templates{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible;gap:12px}
 #toolsheet .templates button,#toolsheet[data-view=templates] .templates button{min-height:120px;width:100%;gap:12px;min-width:0}
 #toolsheet[data-view=palette] #panel-style>.two{display:grid;grid-template-columns:1fr 1fr;overflow:visible;gap:14px}
 #toolsheet[data-view=palette] #panel-style>.two label{min-width:0}
 #toolsheet[data-view=palette] #palettes{flex-wrap:wrap;overflow:visible}
 body.previewonly>main{left:0;right:0;top:0;bottom:70px;padding:0}body.previewonly .workspace>.sectionhead,body.previewonly .workspace>.previewtools,body.previewonly .workspace>.quickbar{display:none}body.previewonly .appdock{display:none}
 body #status,body.tools-open #status{top:90px;right:20px;max-width:330px}
}
@media(min-width:1500px){:root{--sidebar-width:430px}.workspace .sectionhead h1{font-size:28px}}

/* Explicit icon dimensions prevent glyph wrapping into template names. */
#toolsheet .templates button,#toolsheet[data-view=templates] .templates button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;line-height:1.3;white-space:nowrap;padding:14px 8px}
#toolsheet .templates .templateicon{display:flex;align-items:center;justify-content:center;flex:0 0 48px;width:48px;height:48px;line-height:1;margin:0;padding:5px;overflow:hidden}
#toolsheet .templates .templateicon svg{display:block;width:38px;height:38px;flex:none}
