.editor-app{background:var(--background);height:100dvh;min-height:34rem;color:var(--foreground);overflow-wrap:anywhere;accent-color:var(--foreground);caret-color:var(--foreground);flex-direction:column;font-size:.8125rem;display:flex;container-type:inline-size}.editor-app ::selection{background:var(--foreground);color:var(--background)}.editor-app :is(button,a,select,svg):focus-visible{outline:2px solid var(--foreground);outline-offset:2px}.editor-app button{cursor:pointer}.editor-app button:disabled{cursor:default}.editor-app button{min-height:2.75rem}.editor-app svg{flex-shrink:0}.editor-app h2{font-size:.8125rem;font-weight:600}.editor-skip{z-index:100;background:var(--background);padding:.75rem;position:fixed;top:-10rem;left:1rem}.editor-skip:focus{top:1rem}.editor-header{border-bottom:1px solid var(--border);align-items:center;gap:1.5rem;min-height:4.5rem;padding:.625rem 1.25rem;display:flex}.editor-brand{flex-shrink:0;align-items:center;gap:.5rem;font-size:1.125rem;font-weight:700;display:flex}.editor-brand img{width:2rem;height:2rem}.editor-header-actions{align-items:center;gap:.5rem;margin-left:auto;display:flex}.editor-header-actions>button{min-width:2.75rem;min-height:2.75rem}.editor-history{border-right:1px solid var(--border);gap:.125rem;margin-right:.25rem;padding-right:.75rem;display:flex}.editor-history button{min-width:2.75rem}.editor-export{gap:.5rem;padding-inline:1rem}.editor-workspace{flex:1;grid-template-columns:14.5rem minmax(0,1fr) 20rem;min-height:0;display:grid;position:relative}.editor-inspector{border-right:1px solid var(--border);background:var(--background);scrollbar-width:thin;scrollbar-color:var(--border) transparent;min-width:0;overflow:auto}.editor-inspector-heading{justify-content:space-between;align-items:center;padding:1.25rem 1.125rem .75rem;display:flex}.editor-panel-close{display:none}.editor-tools{border-bottom:1px solid var(--border);grid-template-columns:repeat(3,minmax(0,1fr));gap:.375rem;padding:0 .875rem 1rem;display:grid}.editor-tools button{white-space:normal;height:auto;min-height:4rem;color:var(--muted-foreground);border-radius:var(--radius-md);flex-direction:column;gap:.375rem;padding:.625rem .25rem;font-size:.6875rem;display:flex}.editor-tools button svg{width:1.125rem;height:1.125rem}.editor-tools button[aria-pressed=true]{background:var(--foreground);color:var(--background)}.editor-properties{padding:1.125rem}.editor-board-label,.editor-field-label{margin-bottom:.5rem;font-size:.75rem;font-weight:500;display:block}.editor-board-select{margin-bottom:1.5rem;position:relative}.editor-board-select select{appearance:none;background:var(--background);border:1px solid var(--input);border-radius:var(--radius-lg);width:100%;min-height:2.75rem;padding:.5rem 2rem .5rem .75rem;font-size:.8125rem}.editor-board-select>svg{pointer-events:none;width:1rem;height:1rem;position:absolute;top:.875rem;right:.75rem}.editor-color-field>label{margin-bottom:.5rem;font-size:.75rem;font-weight:500;display:block}.editor-color-input{align-items:center;gap:.5rem;display:flex}.editor-color-input input[type=color]{border:1px solid var(--input);border-radius:var(--radius-lg);background:var(--background);cursor:pointer;flex-shrink:0;width:2.75rem;height:2.75rem;padding:.25rem}.editor-color-input input[type=color]::-webkit-color-swatch-wrapper{padding:0}.editor-color-input input[type=color]::-webkit-color-swatch{border-radius:var(--radius-sm);border:0}.editor-color-input input:not([type=color]){min-height:2.75rem;font-size:.75rem}.editor-swatches{flex-wrap:wrap;gap:.25rem;margin:.625rem -.125rem 0;display:flex}.editor-swatches button{border-radius:var(--radius-sm);border:1px solid var(--border);place-items:center;width:1.75rem;height:1.75rem;min-height:1.75rem;display:grid}.editor-swatches button svg{width:.875rem;height:.875rem}.editor-object-properties{border-top:1px solid var(--border);gap:.875rem;margin-top:1.5rem;padding-top:1.25rem;display:grid}.editor-object-properties input{min-height:2.75rem;font-size:.8125rem}.editor-property-empty{color:var(--muted-foreground);align-items:flex-start;gap:.625rem;padding:.25rem 0 1rem;font-size:.75rem;line-height:1.75;display:flex}.editor-property-empty>svg{width:1rem;height:1rem;margin-top:.25rem}.editor-number-field{min-width:0;color:var(--muted-foreground);gap:.375rem;font-size:.75rem;display:grid}.editor-number-field input{color:var(--foreground);font-variant-numeric:tabular-nums}.editor-field-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;display:grid}.editor-object-actions{gap:.5rem;display:flex}.editor-snap-guide{stroke:var(--foreground);stroke-width:1.5px;stroke-dasharray:6 6;opacity:.6;pointer-events:none}.editor-object-actions>button:first-child{white-space:normal;flex:1}.editor-image-note,.editor-small-note{color:var(--muted-foreground);white-space:pre-line;font-size:.6875rem;line-height:1.75}.editor-image-note{border-top:1px solid var(--border);margin-top:1.25rem;padding-top:1rem}.editor-center{background:color-mix(in oklch, var(--muted) 70%, var(--background));flex-direction:column;min-width:0;min-height:0;display:flex;position:relative}.editor-canvas-header{grid-template-columns:1fr auto 1fr;align-items:center;gap:.5rem;min-height:3.75rem;padding:.5rem 1.5rem;display:grid}.editor-canvas-header>div{flex-wrap:wrap;grid-area:1/1;align-items:center;gap:.625rem;display:flex}.editor-canvas-header>.editor-face-switch{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--muted);grid-area:1/2;justify-self:center;gap:.125rem;padding:.125rem;display:flex}.editor-canvas-header>button{grid-area:1/3;justify-self:end}.editor-face-switch button{white-space:nowrap;min-height:2.25rem;padding-inline:.75rem;font-size:.75rem}.editor-face-switch button[aria-pressed=true]{background:var(--foreground);color:var(--background)}.editor-auth{flex:none;width:5.5rem;height:2.75rem;display:flex}.editor-auth>div{height:100%}.editor-board-caption{color:var(--muted-foreground);font-size:.75rem}.editor-help{z-index:5;background:var(--popover);max-width:32rem;color:var(--popover-foreground);border:1px solid var(--border);border-radius:var(--radius-lg);margin-left:auto;padding:1rem;line-height:1.75;position:absolute;top:3.5rem;left:1rem;right:1rem}.editor-help p+p{color:var(--muted-foreground);margin-top:.75rem}.editor-canvas-area{scrollbar-width:thin;flex:1;justify-content:flex-start;align-items:flex-start;min-height:0;padding:2rem;display:flex;position:relative;overflow:auto}.editor-artwork-column{flex-direction:column;flex-shrink:0;align-items:center;gap:1rem;margin:auto;display:flex}.editor-end-label{color:var(--muted-foreground);font-size:.625rem}.editor-artboard{max-width:50vw;height:min(63dvh,44rem);position:relative}.editor-artboard>canvas,.editor-selection{width:100%;height:100%;position:absolute;inset:0}.editor-selection{touch-action:none;cursor:move;outline-offset:.5rem;border-radius:var(--radius-sm)}.editor-selection[data-tool=brush]{cursor:crosshair}.editor-selection-box{pointer-events:none}.editor-handle,.editor-handle-rotate{pointer-events:all}.editor-handle-nw,.editor-handle-se{cursor:nwse-resize}.editor-handle-ne,.editor-handle-sw{cursor:nesw-resize}.editor-handle-n,.editor-handle-s{cursor:ns-resize}.editor-handle-e,.editor-handle-w{cursor:ew-resize}.editor-handle-rotate{cursor:grab}.editor-canvas-footer{border-top:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.25rem .75rem;min-height:3.75rem;padding:.5rem 1.125rem;display:flex}.editor-canvas-footer>p{color:var(--muted-foreground);flex:1;max-width:28rem;font-size:.6875rem}.editor-zoom{font-variant-numeric:tabular-nums;align-items:center;gap:.125rem;display:flex}.editor-zoom button{min-width:2.5rem;font-size:.75rem}.editor-right{border-left:1px solid var(--border);background:var(--background);flex-direction:column;min-width:0;min-height:0;display:flex}.editor-preview{border-bottom:1px solid var(--border);padding:1.125rem}.editor-preview-header{justify-content:space-between;align-items:center;gap:.5rem;display:flex}.editor-preview-header button{min-width:2.25rem;min-height:2.25rem}.editor-preview-stage{border-radius:var(--radius-lg);background:color-mix(in oklch, var(--muted) 45%, var(--background));height:15rem;margin-top:.5rem;position:relative}.editor-preview-canvas{position:absolute;inset:0}.editor-preview-hint{color:var(--muted-foreground);margin-top:.75rem;font-size:.6875rem;line-height:1.75}.editor-preview-status{color:var(--muted-foreground);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:.75rem;padding:1rem;font-size:.75rem;display:flex;position:absolute;inset:0}.editor-layers{flex-direction:column;flex:1;min-height:0;display:flex}.editor-layers-heading{justify-content:space-between;align-items:center;padding:1.25rem 1.125rem .75rem;display:flex}.editor-layers-heading>div{align-items:center;gap:.5rem;display:flex}.editor-layers-heading svg{width:1rem;height:1rem}.editor-layers-heading span{color:var(--muted-foreground);font-size:.6875rem}.editor-layer-list{scrollbar-width:thin;flex:1;min-height:0;padding:0 .75rem .75rem;overflow:auto}.editor-layers-empty{color:var(--muted-foreground);text-align:center;justify-items:center;gap:.75rem;padding:2.5rem .5rem;font-size:.75rem;display:grid}.editor-layers-empty>svg{stroke-width:1.25px;width:1.5rem;height:1.5rem}.editor-layer{border-radius:var(--radius-md);border:1px solid #0000;align-items:center;gap:.25rem;margin-bottom:.25rem;display:flex}.editor-layer[data-selected=true]{border-color:var(--border);background:var(--muted)}.editor-layer[data-hidden=true] .editor-layer-select{opacity:.55}.editor-layer-select{text-align:left;flex:1;align-items:center;gap:.625rem;min-width:0;padding:.375rem;display:flex}.editor-layer-select>span:last-child{flex:1;min-width:0;font-size:.75rem}.editor-layer-thumbnail{border:1px solid var(--border);background:var(--background);border-radius:var(--radius-sm);flex-shrink:0;place-items:center;width:2.25rem;height:2.5rem;display:grid}.editor-layer-thumbnail svg{width:1rem;height:1rem}.editor-layer>button:last-child{flex-shrink:0;margin-right:.125rem}.editor-layer-actions{border-top:1px solid var(--border);gap:.375rem;padding:.625rem 1.125rem;display:flex}.editor-layer-actions button:last-child{margin-left:auto}.editor-mobile-nav{display:none}.editor-feedback{z-index:60;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--popover);width:max-content;max-width:calc(100% - 2rem);color:var(--popover-foreground);align-items:center;gap:1rem;padding:.5rem .5rem .5rem 1rem;font-size:.8125rem;display:flex;position:fixed;bottom:1.25rem;left:50%;transform:translate(-50%)}.editor-feedback[role=alert]{color:var(--destructive)}@container (width<=72rem){.editor-workspace{grid-template-columns:13rem minmax(0,1fr) 17rem}.editor-header{gap:1rem;padding-inline:1rem}.editor-history{margin-right:0;padding-right:.25rem}.editor-properties{padding:1rem}.editor-preview-stage{height:12rem}.editor-canvas-header{padding-inline:1rem}.editor-canvas-footer>p{flex-basis:100%}.editor-canvas-footer{justify-content:flex-end}}@container (width<=58rem){.editor-header{flex-wrap:wrap;gap:.5rem 1rem;padding:.5rem .75rem}.editor-brand{font-size:1rem}.editor-header-actions{flex-basis:100%;gap:.25rem;margin-left:0}.editor-header-actions>button{min-width:2.5rem}.editor-history{border:0;margin-right:auto}.editor-workspace{grid-template-rows:minmax(0,1fr) auto;grid-template-columns:minmax(0,1fr);display:grid}.editor-center{grid-area:1/1;padding-top:4.25rem}.editor-inspector{display:contents}.editor-inspector-heading,.editor-properties{display:none}.editor-tools{z-index:10;background:var(--background);justify-content:center;align-items:center;gap:.125rem;height:4.25rem;padding:.375rem .5rem;display:flex;position:absolute;top:0;left:0;right:0}.editor-tools button{flex:1;gap:.125rem;max-width:7rem;min-height:3.5rem;padding:.375rem}.editor-right{border-left:0;grid-area:1/1;display:none}.editor-workspace[data-view=preview] .editor-center{visibility:hidden;pointer-events:none}.editor-workspace[data-view=preview] .editor-right{padding-top:4.25rem;display:flex}.editor-workspace[data-view=preview] .editor-preview{border:0;flex-direction:column;flex:1;min-height:0;display:flex}.editor-workspace[data-view=preview] .editor-preview-stage{flex:1;height:auto;min-height:12rem}.editor-layers{display:none}.editor-mobile-nav{padding:.375rem .5rem max(.375rem, env(safe-area-inset-bottom));border-top:1px solid var(--border);background:var(--background);z-index:30;grid-area:2/1;grid-template-columns:repeat(4,minmax(0,1fr));gap:.125rem;display:grid}.editor-mobile-nav button{white-space:normal;height:auto;min-height:3.5rem;color:var(--muted-foreground);flex-direction:column;gap:.25rem;padding:.375rem .125rem;font-size:.6875rem}.editor-mobile-nav button[aria-pressed=true]{background:var(--muted);color:var(--foreground)}.editor-artboard{max-width:55vw;height:min(45dvh,32rem)}.editor-canvas-area{padding:1.5rem}.editor-canvas-header{grid-template-columns:1fr auto;row-gap:.375rem;min-height:3rem;padding-block:.25rem}.editor-canvas-header>.editor-face-switch{grid-area:2/1/3/-1;justify-self:center;margin-bottom:.25rem}.editor-canvas-header>button{grid-area:1/2}.editor-canvas-footer{gap:0;min-height:3rem;padding:.25rem .75rem}.editor-canvas-footer>p{display:none}.editor-workspace[data-panel=properties] .editor-properties{z-index:20;background:var(--background);padding:4rem 1.25rem 1.25rem;display:block;position:absolute;inset:0 0 4.25rem;overflow:auto}.editor-workspace[data-panel=properties] .editor-inspector-heading{z-index:25;background:var(--background);border-bottom:1px solid var(--border);height:3.5rem;padding:.5rem 1.25rem;display:flex;position:absolute;top:0;left:0;right:0}.editor-workspace[data-panel=properties] .editor-panel-close,.editor-workspace[data-panel=layers] .editor-panel-close{display:inline-flex}.editor-workspace[data-panel=layers] .editor-right{padding-top:0;display:flex}.editor-workspace[data-panel=layers] .editor-preview{display:none}.editor-workspace[data-panel=layers] .editor-layers{z-index:25;background:var(--background);display:flex;position:absolute;inset:0 0 4.25rem}.editor-workspace:is([data-panel=properties],[data-panel=layers]) .editor-center,.editor-workspace:is([data-panel=properties],[data-panel=layers]) .editor-tools,.editor-workspace[data-panel=properties] .editor-right{visibility:hidden}.editor-swatches button{width:2.75rem;height:2.75rem;min-height:2.75rem}.editor-feedback{bottom:5.25rem}}@container (width<=36rem){.editor-brand span{display:none}.editor-brand img{width:1.75rem;height:1.75rem}.editor-header{gap:.5rem}.editor-export{padding-inline:.625rem}.editor-export span{display:none}}@container (width<=23rem){.editor-header-actions{gap:.125rem}.editor-header-actions>button{width:2.25rem;min-width:2.25rem}.editor-brand{margin-right:.125rem}}@media (prefers-reduced-motion:no-preference){.editor-layer{transition:background-color .15s ease-out}}.editor-header{gap:0;padding-left:0}.editor-brand{border-right:1px solid var(--border);align-self:stretch;width:14.5rem;padding-inline:1.125rem}.editor-header-controls{align-items:center;gap:.75rem;min-width:0;padding-inline:1rem;display:flex}.editor-header-controls>.editor-board-label{clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}.editor-header-controls .editor-board-select{width:8rem;margin:0}.editor-header-controls .editor-board-select:has(#editor-board-size){width:12rem}.editor-header-controls .editor-history{border:0;margin:0;padding:0}@container (width<=72rem){.editor-brand{width:13rem}.editor-header-controls{gap:.5rem;padding-inline:1rem}}@container (width<=58rem){.editor-header{gap:.5rem;padding:.5rem .75rem}.editor-brand{border:0;width:auto;min-height:2.75rem;padding:0}.editor-header-actions{flex-basis:auto;margin-left:auto}.editor-header-controls{flex-basis:100%;order:3;gap:.375rem;padding:0}.editor-header-controls .editor-board-select{flex:1;width:auto;min-width:0}.editor-header-controls .editor-board-select:has(#editor-board-size){flex:1.5;width:auto}.editor-header-controls .editor-history{flex-shrink:0}.editor-header-controls select{padding-left:.5rem;font-size:.75rem}.editor-header-controls .editor-history button{width:2.25rem;min-width:2.25rem}.editor-brand span{display:inline}}@container (width>=58.001rem){.editor-inspector{flex-direction:column;display:flex;overflow:hidden}.editor-inspector-heading,.editor-tools{flex-shrink:0}.editor-properties{flex:1;min-height:0;overflow:auto}.editor-image-note,.editor-canvas-footer,.editor-layer-actions{border-top:1px solid var(--border);flex-shrink:0;align-items:center;height:5rem;min-height:5rem;margin:0;padding:.5rem 1.125rem;display:flex}.editor-image-note{white-space:pre-line}.editor-canvas-footer>p{flex-basis:auto}.editor-canvas-footer{flex-wrap:nowrap}}@container (width<=58rem){.editor-inspector>.editor-image-note{display:none}.editor-workspace[data-panel=properties] .editor-inspector>.editor-image-note{z-index:25;background:var(--background);margin:0;padding:.75rem 1.25rem;display:block;position:absolute;bottom:4.25rem;left:0;right:0}.editor-workspace[data-panel=properties] .editor-properties{padding-bottom:6rem}}.editor-preview-actions{align-items:center;gap:.5rem;display:flex}.editor-workspace .editor-preview[data-fullscreen]{z-index:40;background:var(--background);border:0;flex-direction:column;padding:1.125rem;display:flex;position:fixed;inset:0}.editor-workspace .editor-preview[data-fullscreen] .editor-preview-stage{flex:1;height:auto;min-height:0}
