/* The editor: design above the object library, layer controls on the right. */
.object-controls{position:absolute;z-index:2147483647;display:flex;gap:2px;padding:2px;border:1px solid #e4e5dd;border-radius:6px;background:#fffffff7;box-shadow:0 2px 8px #20241820;touch-action:manipulation;cursor:default}
.object-controls button{width:25px;height:25px;display:grid;place-items:center;border-radius:4px;flex:none;padding:0;touch-action:manipulation}
.object-controls button:hover:not(:disabled){background:var(--orange-soft);color:var(--orange)}
.object-controls button:disabled{opacity:.28}
.object-controls svg{width:14px;height:14px;stroke-width:1.9}
.object-controls .object-delete{color:#bc4838}
.studio{display:grid;grid-template-columns:minmax(0,1fr) 240px;grid-template-rows:minmax(0,1fr) 270px;grid-template-areas:"workspace layers" "library layers";height:calc(100dvh - 72px);min-height:720px;align-items:stretch}
.workspace{grid-area:workspace;min-width:0;min-height:0;height:auto;padding:0 24px 8px;order:initial}
.workspace-intro{display:none}
.canvas-toolbar{min-height:48px;padding:5px 0;flex-wrap:nowrap;justify-content:space-between}
.canvas-viewport{flex:1;min-height:0;max-height:none;padding:12px 0 8px;overflow:hidden}
.workspace-bottom{min-height:29px}
.keyboard-hint{display:none}
.layers-panel{grid-area:layers;grid-row:1/3;grid-column:2;display:flex;flex-direction:column;gap:0;border-top:0;border-right:0;border-left:1px solid var(--line);padding:22px 17px;min-width:0;min-height:0;max-height:none;overflow-y:auto;order:initial}
.layers-panel .panel-heading,.layers-panel .panel-description,.layers-panel .layer-list,.layers-panel .empty-layers,.layers-panel .layer-actions{grid-column:auto}
.layers-panel .properties{grid-column:auto;grid-row:auto;padding-top:22px}
.layer-list{min-height:0;max-height:300px;margin-top:19px;flex-shrink:0}
.empty-layers{padding:27px 0}
.layer-actions{justify-content:center;margin-top:17px;flex-shrink:0}
.property-buttons,.properties .property-buttons{flex-direction:row}
.tip-card{display:block;margin-top:auto;padding-top:16px;flex-shrink:0}
.layers-panel:has(#selectionProperties:not([hidden])) .tip-card{display:none}
.library-panel{grid-area:library;grid-row:2;grid-column:1;display:flex;flex-direction:column;min-width:0;min-height:0;height:auto;border-left:0;border-top:1px solid var(--line);padding:14px 24px 12px;gap:9px;order:initial;background:#fff}
.library-header{display:flex;align-items:center;gap:18px;min-width:0;flex-shrink:0}
.library-title{min-width:195px;max-width:240px;flex:1}
.library-title .panel-heading{justify-content:flex-start;gap:13px}
.library-title .panel-heading h2{font-size:14px}
.library-title .panel-description{font-size:9px;margin-top:4px;line-height:1.5}
.library-header .search-box{flex:1;max-width:300px;min-width:120px;margin:0;padding:10px 12px}
.library-header .import-card{width:auto;max-width:210px;min-width:170px;margin:0;padding:9px 11px;gap:8px}
.library-header .import-card small{font-size:7px;margin-top:3px}
.library-controls{display:flex;align-items:center;justify-content:space-between;gap:15px;min-width:0;flex-shrink:0}
.library-controls .category-filters{margin:0;gap:5px;flex:1;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin;padding:1px 0 3px}
.filter-button{flex-shrink:0;padding:6px 9px}
.library-controls .library-meta{margin:0;gap:14px;flex-shrink:0;font-size:9px}
.library-grid{display:grid;grid-auto-flow:column;grid-auto-columns:124px;grid-template-columns:none;grid-template-rows:132px;gap:10px;flex:1;min-height:0;max-height:none;overflow-x:auto;overflow-y:hidden;align-content:start;padding:0 0 9px;overscroll-behavior-x:contain;scrollbar-width:thin}
.library-grid .object-card{height:132px;padding:8px 10px}
.library-grid .object-card img{height:82px}
.library-panel .library-footer{display:none}
.library-nav{display:flex;align-items:center;gap:4px;flex-shrink:0}
.library-nav .icon-button{width:28px;height:28px;border:1px solid #dce1d2;background:#fafbf7}
.library-nav .icon-button:hover:not(:disabled){border-color:var(--orange);color:var(--orange);background:var(--orange-soft)}
.library-nav .icon-button:disabled{opacity:.3}
.library-nav svg{width:15px;height:15px}
.previous-arrow{transform:rotate(180deg)}
.library-grid{scrollbar-width:auto;scrollbar-color:#a4af96 #eef1e7;touch-action:auto}
.library-grid:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
.library-grid::-webkit-scrollbar{height:11px}
.library-grid::-webkit-scrollbar-track{background:#eef1e7;border-radius:7px}
.library-grid::-webkit-scrollbar-thumb{background:#a4af96;border:2px solid #eef1e7;border-radius:7px}
.library-grid::-webkit-scrollbar-thumb:hover{background:#829170}
.empty-library{padding:26px 10px;font-size:11px}
@media(min-width:1001px){.studio.expanded{height:auto;min-height:0;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(560px,calc(100dvh - 72px)) 270px;grid-template-areas:"workspace" "library"}.studio.expanded .workspace,.studio.expanded .library-panel{grid-column:1}.studio.expanded .layers-panel{display:none}}
@media(min-width:1550px){.studio{grid-template-columns:minmax(0,1fr) 270px;grid-template-rows:minmax(0,1fr) 285px}.library-grid{grid-auto-columns:138px;grid-template-rows:146px}.library-grid .object-card{height:146px}.library-grid .object-card img{height:96px}}
@media(min-width:641px) and (max-width:1000px){.studio{grid-template-columns:minmax(0,1fr) 205px;min-height:740px;grid-template-rows:minmax(0,1fr) 265px}.workspace{padding:0 16px 8px}.library-panel{padding:13px 16px 10px}.layers-panel{padding:20px 12px}.library-header{gap:10px}.library-title{min-width:175px}.library-header .import-card{display:none}.library-controls{gap:10px}.library-controls .library-meta{gap:6px}.library-controls .library-meta select{max-width:80px}.library-title .panel-heading h2{font-size:13px}.library-title .panel-description{font-size:8px}.canvas-toolbar{flex-wrap:wrap;gap:2px}.expand-button,.expand-button+.separator{display:none}.header .project-title{display:none}}
@media(max-width:640px){.studio{display:flex;flex-direction:column;height:auto;min-height:calc(100dvh - 72px)}.workspace{order:0;padding:0 16px 10px}.canvas-toolbar{min-height:54px;flex-wrap:nowrap;padding:8px 0}.canvas-viewport{flex:none;min-height:0;padding:15px 0 10px;max-height:65dvh}.workspace-bottom{min-height:27px}.layers-panel{order:2;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:9px 17px;border-left:0;border-top:1px solid var(--line);padding:20px 16px;overflow:visible}.layers-panel .panel-heading,.layers-panel .panel-description,.layers-panel .layer-list,.layers-panel .empty-layers,.layers-panel .layer-actions{grid-column:1}.layers-panel .properties{grid-column:2;grid-row:1/6;padding:0}.layers-panel .tip-card{display:none}.layer-list{max-height:200px;margin-top:0}.layer-actions{justify-content:flex-start;gap:2px;margin-top:0}.empty-layers{padding:15px 0}.library-panel{order:1;padding:17px 16px 12px;gap:11px}.library-header{flex-wrap:wrap;gap:11px}.library-title{min-width:0;max-width:none;flex-basis:100%}.library-title .panel-heading{justify-content:space-between}.library-title .panel-heading h2{font-size:15px}.library-header .search-box{max-width:none;flex-basis:100%;min-width:0}.library-header .import-card{display:none}.library-controls{flex-wrap:wrap;gap:7px}.library-controls .category-filters{flex-basis:100%}.library-controls .library-meta{width:100%;justify-content:space-between}.library-grid{flex:none;min-height:0;grid-auto-columns:112px;grid-template-rows:128px;padding-bottom:8px;gap:8px}.library-grid .object-card{height:128px;padding:8px}.library-grid .object-card img{height:79px}.expand-button,.expand-button+.separator{display:none}}
.canvas-viewport{position:relative;padding-bottom:40px}
