body:has(.bg-editor) .site-footer{display:none}body:has(.bg-editor) #main{max-width:none;padding:0}.image-page:has(.bg-editor){background:var(--ui-bg-muted);max-width:none;min-height:0;color:var(--ui-text);margin:0;padding:0}.bg-drawer,.bg-export-dialog{background:var(--ui-bg)}.bg-drawer,.bg-editor,.bg-export-dialog{--bg-paper:var(--ui-bg);--bg-line:var(--ui-border);--bg-muted:var(--ui-text-muted);--bg-base:var(--ui-bg-muted);color:var(--ui-text);font-size:14px}.bg-editor{background:var(--bg-base);flex-direction:column;height:calc(100dvh - 60px);min-height:0;display:flex}.bg-controls button,.bg-editor button,.bg-export-dialog button{min-height:44px}.bg-controls button svg,.bg-editor button svg{flex-shrink:0}.bg-editor button:focus-visible,.bg-editor canvas:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.bg-editor h1{white-space:nowrap;margin:0;font-size:21px;font-weight:650}.bg-heading{background:var(--bg-paper);border-bottom:1px solid var(--bg-line);align-items:center;gap:12px;min-height:68px;padding:10px 24px;display:flex}.bg-file{text-overflow:ellipsis;white-space:nowrap;max-width:40%;margin-left:auto;font-size:13px;overflow:hidden}.bg-file small{color:var(--bg-muted);margin-left:12px;font-size:12px}.bg-heading>button:last-child{justify-content:center;width:44px}.bg-workspace{flex:1;grid-template-columns:minmax(0,1fr) 380px;min-height:0;display:grid}.bg-main{flex-direction:column;min-width:0;min-height:0;display:flex}.bg-viewbar{background:var(--bg-paper);border-bottom:1px solid var(--bg-line);flex:none;justify-content:space-between;align-items:center;gap:12px;padding:8px 16px;display:flex}.bg-history,.bg-zoom{gap:2px;display:flex}.bg-history button,.bg-zoom button{justify-content:center;min-width:44px}.bg-view-tabs{gap:2px;padding:4px}.bg-view-tab{min-width:44px;min-height:40px;font-size:13px}.bg-toolrow{border-bottom:1px solid var(--bg-line);flex:none;align-items:center;gap:8px;padding:8px 18px;display:flex}.bg-toolrow>button{gap:6px;padding:8px 10px}.bg-image-select{min-width:0;max-width:200px;min-height:44px;margin-left:auto}.bg-stage{flex:1;place-items:safe center;min-height:0;padding:18px;display:grid;position:relative;overflow:auto}.bg-artboard{background-color:#fff;background-image:conic-gradient(#e6e9ef 25%,transparent 0 50%,#e6e9ef 0 75%,transparent 0);background-size:20px 20px;flex:none;position:relative;box-shadow:0 2px 12px #0000000d}.bg-artboard canvas{width:100%;max-width:none;height:100%;display:block}.bg-artboard .bg-drawing{touch-action:none;cursor:crosshair}.bg-stage-message,.bg-under-art{color:var(--bg-muted);text-align:center}.bg-under-art{flex:none;justify-content:center;align-items:center;gap:12px;min-height:44px;padding:8px 18px;font-size:12px;line-height:1.6;display:flex}.bg-under-art>[data-slot=root]{flex:1;min-width:80px;max-width:240px}.bg-under-art>span{min-width:0}.bg-filmstrip{background:var(--bg-paper);border-top:1px solid var(--bg-line);flex:none;gap:12px;padding:10px 18px;display:flex;overflow:auto}.bg-thumb-wrap{flex-shrink:0;align-items:center;gap:2px;display:flex}.bg-thumb{gap:8px;max-width:190px;min-height:58px;padding:5px}.bg-thumb img{-o-object-fit:contain;object-fit:contain;flex:none;width:44px;height:44px}.bg-thumb span{text-overflow:ellipsis;white-space:nowrap;max-width:110px;font-size:12px;overflow:hidden}.bg-thumb .iconify{flex:none}.bg-thumb-remove{justify-content:center;width:44px}.bg-sidebar{background:var(--bg-paper);border-left:1px solid var(--bg-line)}.bg-controls,.bg-sidebar{flex-direction:column;min-height:0;display:flex}.bg-controls{flex:1}.bg-panel-tabs{border-bottom:1px solid var(--bg-line);background:var(--bg-paper);border-radius:0;flex:none;gap:0;width:100%;padding:0 12px}.bg-panel-tab{border-radius:0;flex:1;justify-content:center;min-width:0;min-height:56px;padding:8px 4px;font-size:13px}.bg-panel-label{white-space:normal;text-overflow:clip;text-align:center;line-height:1.3;overflow:visible}.bg-panel-indicator{background:var(--accent,var(--ui-primary));height:2px;box-shadow:none}.bg-control-body{flex-direction:column;flex:1;gap:18px;min-height:0;padding:20px 22px;display:flex;overflow:auto}.bg-control-body h2{margin:0;font-size:17px;font-weight:650}.bg-control-body .img-settings-content{background:0 0;padding:0}.bg-control-body .img-settings-content>h2{display:none}.bg-control-body .img-settings-content .img-hint{font-size:12px;line-height:1.7}.bg-note{color:var(--bg-muted);overflow-wrap:anywhere;margin:0;font-size:12px;line-height:1.75}.bg-sidebar-action{border-top:1px solid var(--bg-line);flex:none;gap:12px;padding:18px 22px;display:grid}.bg-download,.bg-run{justify-content:center;min-height:48px}.bg-color-presets{grid-template-columns:1fr 1fr;gap:8px;display:grid}.bg-color-presets button{white-space:normal;justify-content:flex-start;gap:7px;font-size:12px}.bg-color-presets span{border:1px solid #0003;border-radius:50%;flex:none;width:20px;height:20px;display:inline-block}.bg-color-input{align-items:center;gap:10px;display:flex}.bg-color-input>button{flex:none;width:44px}.bg-color-input input{min-height:44px}.bg-color-picker{background:var(--ui-bg);padding:16px}.bg-filename{overflow-wrap:anywhere;margin:0;font-size:12px}.bg-processing{z-index:3;background:color-mix(in srgb,var(--ui-bg) 90%,transparent);place-items:center;padding:20px;display:grid;position:absolute;inset:0;overflow:auto}.bg-processing>div{text-align:center;gap:16px;max-width:420px;display:grid}.bg-processing h2{margin:0;font-size:19px;font-weight:650}.bg-processing p{overflow-wrap:anywhere;margin:0;font-size:13px;line-height:1.7}.bg-processing button{justify-content:center}.bg-inline-error{color:var(--ui-error);margin:0;padding:10px 18px;font-size:13px}.bg-error{flex:none;margin:8px 18px}.bg-error [data-slot=close]{min-width:44px;min-height:44px}.bg-drawer{width:calc(min(100vw,440px));max-width:100vw}.bg-drawer-body{padding:0;overflow:auto}.bg-drawer-body,.bg-export-dialog{flex-direction:column;display:flex}.bg-export-dialog{width:620px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px)}.bg-export-body{grid-template-columns:160px minmax(0,1fr);gap:22px;min-height:0;display:grid;overflow:auto}.bg-export-preview{background-color:#fff;background-image:conic-gradient(#e6e9ef 25%,transparent 0 50%,#e6e9ef 0 75%,transparent 0);border:1px solid var(--bg-line);background-size:18px 18px;align-self:start}.bg-export-preview canvas{width:100%;height:auto;display:block}.bg-export-fields{flex-direction:column;gap:18px;min-width:0;display:flex}.bg-export-footer{flex-shrink:0;justify-content:flex-end;gap:12px;display:flex}.bg-export-fields button,.bg-export-fields input{min-height:44px}@media (width>=861px) and (width<=1100px){.bg-file small{display:none}.bg-viewbar{flex-wrap:wrap;gap:3px;padding:5px 8px}.bg-viewbar>[data-slot=root]{flex-basis:100%;order:3}.bg-view-tabs{width:100%}.bg-zoom{margin-left:auto}.bg-heading{padding:10px 14px}.bg-heading h1{font-size:18px}.bg-file{max-width:25%}}@media (width<=860px){.bg-editor{height:auto;min-height:calc(100dvh - 60px);padding-bottom:calc(84px + env(safe-area-inset-bottom))}.bg-heading{flex-wrap:wrap;gap:8px;padding:10px 12px}.bg-heading h1{font-size:19px}.bg-file,.bg-heading>button,.bg-view-tab{font-size:12px}.bg-heading>button:last-child{margin-left:auto}.bg-file{flex-basis:100%;order:4;max-width:100%;margin:0}.bg-file small{display:inline}.bg-workspace{flex:1;display:block}.bg-main{min-height:calc(100dvh - 260px)}.bg-viewbar{flex-wrap:wrap;gap:4px;padding:5px 10px}.bg-viewbar>[data-slot=root]{order:3;width:100%}.bg-view-tabs{width:100%}.bg-view-tab{min-height:44px}.bg-zoom{margin-left:auto}.bg-toolrow{flex-wrap:wrap;gap:3px;padding:6px 10px}.bg-toolrow>button{padding:8px;font-size:12px}.bg-image-select{flex-basis:100%;width:100%;max-width:none;margin:4px 0 0}.bg-stage{flex:none;height:calc(clamp(220px,48dvh,600px));min-height:220px}.bg-under-art{padding:8px 12px;font-size:12px}.bg-filmstrip{padding:8px 10px}.bg-thumb{max-width:160px}.bg-thumb span{max-width:85px}.bg-mobile-actions{z-index:25;padding:12px 12px calc(12px + env(safe-area-inset-bottom));background:var(--bg-paper);border-top:1px solid var(--bg-line);grid-template-columns:1fr 1fr;gap:10px;display:grid;position:fixed;bottom:0;left:0;right:0}.bg-mobile-actions button{white-space:normal;justify-content:center;min-width:0;min-height:48px;font-size:13px}.bg-control-body{padding:20px 18px;overflow:visible}.bg-controls{flex:none;overflow:visible}.bg-drawer-body .bg-control-body{flex:none}.bg-processing{position:absolute}.bg-processing>div{gap:10px}.bg-processing h2{font-size:16px}.bg-processing p{font-size:12px}.bg-export-dialog{width:calc(100vw - 24px)}.bg-export-body{grid-template-columns:minmax(0,1fr);gap:16px}.bg-export-preview{justify-self:center;width:100px}.bg-export-footer{justify-content:stretch;gap:8px}.bg-export-footer button{white-space:normal;flex:1;justify-content:center;min-height:44px}.bg-error,.bg-inline-error{overflow-wrap:anywhere}.bg-sidebar-action{display:none}.image-page.image-workspace:has(.bg-editor){height:auto;overflow:visible}}.bg-download,.bg-export-footer>button:last-child,.bg-mobile-actions>button:last-child,.bg-run{background:var(--accent,var(--ui-primary));border:1px solid var(--accent,var(--ui-primary));color:#fff}.bg-download:hover,.bg-export-footer>button:last-child:hover,.bg-mobile-actions>button:last-child:hover,.bg-run:hover{background:var(--accent-dark,var(--accent,var(--ui-primary)))}.bg-control-body>*{flex-shrink:0}.bg-view-indicator{background:var(--accent,var(--ui-primary));box-shadow:none}.bg-view-tab[data-state=active]{color:#fff;background:0 0}.bg-panel-tab[data-state=active]{color:var(--accent,var(--ui-primary));background:0 0}.bg-source-loading{-o-object-fit:contain;object-fit:contain;max-width:min(100%,600px);max-height:55dvh}@media (prefers-reduced-motion:reduce){.bg-drawer *,.bg-editor *,.bg-export-dialog *{transition:none!important}}@media (width>=861px) and (height<=540px){.bg-main{overflow:auto}.bg-stage{flex:none;min-height:180px}}