.png-workspace,.png-editor{--soft: color-mix(in srgb, var(--accent) 6%, var(--surface));--shadow: color-mix(in srgb, var(--text) 12%, transparent);--paper: var(--surface)}.png-workspace button,.png-editor button,.png-editor select{font:inherit}.png-workspace button,.png-editor button{transition:background .16s,border-color .16s,transform .16s}.png-workspace button:focus-visible,.png-editor :focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 45%,transparent);outline-offset:3px}.png-workspace [hidden]{display:none!important}.workspace-heading,.queue-toolbar,.export-bar,.png-editor .modal-header,.png-editor .modal-footer{display:flex;align-items:center;justify-content:space-between;gap:16px}.workspace-heading{margin-bottom:22px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:.14em;color:var(--text-dim)}.workspace-heading h2{margin:4px 0 0;font-size:21px;letter-spacing:-.5px}.local-label{font-size:12px;color:var(--accent-dark)}.png-workspace.has-images .dropzone{padding:16px 20px}.queue-toolbar{margin:26px 0 16px}.queue-toolbar h3{font-size:15px;margin:0}.queue-toolbar p,.preview-hint{font-size:12px;color:var(--text-dim);margin:4px 0 0}.png-workspace .image-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}.png-workspace .image-card{min-width:0;border:1px solid var(--border);border-radius:13px;overflow:hidden;background:var(--surface);transition:border-color .16s,box-shadow .16s}.png-workspace .image-card:hover,.png-workspace .image-card:focus-within{border-color:var(--accent);box-shadow:0 5px 18px var(--shadow)}.png-workspace .image-card.dragging{opacity:.4}.png-workspace .image-card.drop-target{outline:2px solid var(--accent);outline-offset:3px}.png-workspace .card-top{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;font-size:11px;color:var(--text-dim)}.png-workspace .drag-handle{cursor:grab;letter-spacing:2px}.png-workspace .image-preview-wrapper{display:flex;align-items:center;justify-content:center;width:100%;height:174px;padding:12px 20px;border:0;background:var(--bg);cursor:pointer}.png-workspace .image-preview-wrapper canvas{display:block;max-width:100%;max-height:100%;box-shadow:0 2px 8px var(--shadow);pointer-events:none}.png-workspace .image-info{padding:12px;min-width:0}.png-workspace .image-name{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:12px;font-weight:600}.png-workspace .image-meta{font-size:11px;color:var(--text-dim);margin-top:4px}.png-workspace .image-actions{display:flex;align-items:center;gap:5px;margin-top:12px}.png-workspace .image-actions button,.png-editor .icon-button{border:1px solid var(--border);background:var(--surface);color:var(--text-dim);border-radius:8px;height:34px;min-width:32px;cursor:pointer}.png-workspace .image-actions .edit-btn{flex:1;text-align:left;padding:0 10px;font-size:12px;white-space:nowrap;color:var(--accent-dark);background:var(--soft)}.png-workspace .image-actions button:hover:not(:disabled),.png-editor .icon-button:hover{border-color:var(--accent);color:var(--accent-dark)}.png-workspace button:disabled{opacity:.35;cursor:not-allowed}.png-workspace .export-bar{border-top:1px solid var(--border);padding-top:20px;margin-top:24px}.export-note{margin-left:auto;color:var(--text-dim);font-size:12px}.png-workspace .text-button,.png-editor .text-button{background:none;border:0;color:var(--text-dim);cursor:pointer;font-size:12px;padding:8px 0}.png-workspace .text-button:hover,.png-editor .text-button:hover{color:var(--accent-dark)}#status{margin:12px 0 0;color:var(--text-dim);font-size:13px}#status:empty{display:none}.png-editor{padding:0;border:1px solid var(--border);border-radius:20px;background:var(--surface);color:var(--text);width:min(980px,calc(100vw - 40px));max-width:none;max-height:calc(100dvh - 40px);margin:auto;box-shadow:0 24px 80px var(--shadow)}.png-editor[open]{display:flex;flex-direction:column}.png-editor::backdrop{background:color-mix(in srgb,var(--text) 45%,transparent);backdrop-filter:blur(5px)}.png-editor .modal-header{padding:20px 24px;border-bottom:1px solid var(--border)}.png-editor .modal-header>div{min-width:0}.png-editor h3{font-size:16px;margin:4px 0 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.png-editor .icon-button{flex-shrink:0;font-size:20px}.png-editor .editor-body{display:grid;grid-template-columns:minmax(0,1fr) 260px;min-height:0;overflow:auto}.png-editor .canvas-panel{display:flex;flex-direction:column;min-width:0;background:var(--bg);padding:20px}.png-editor .preview-area{height:min(52dvh,480px);min-height:120px;display:flex;align-items:center;justify-content:center;overflow:hidden}.png-editor #previewCanvas{flex-shrink:0;box-shadow:0 4px 20px var(--shadow);cursor:grab;touch-action:none}.png-editor #previewCanvas:active{cursor:grabbing}.png-editor .preview-hint{text-align:center;margin-top:16px}.png-editor .editor-controls{padding:24px 20px;border-left:1px solid var(--border)}.png-editor .control-section{margin-bottom:24px}.png-editor label{display:block;font-size:12px;margin:16px 0 7px;font-weight:600}.png-editor select{width:100%;padding:10px;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:8px;font-size:12px}.png-editor .label-row{display:flex;align-items:baseline;justify-content:space-between}.png-editor output{color:var(--accent-dark);font-size:12px;font-variant-numeric:tabular-nums}.png-editor .zoom-controls{display:flex;align-items:center;gap:10px}.png-editor input[type=range]{min-width:0;width:100%;accent-color:var(--accent)}.png-editor .placement-buttons{display:flex;gap:8px;margin-top:14px}.png-editor .placement-buttons .btn{font-size:11px;padding:9px 8px;flex:1}.png-editor .control-help,.png-editor .editor-note{font-size:11px;color:var(--text-dim);line-height:1.6;margin-top:12px}.png-editor .editor-note{border-top:1px solid var(--border);padding-top:16px}.png-editor .modal-footer{padding:16px 24px;border-top:1px solid var(--border)}.png-editor .modal-footer span{margin-right:auto;font-size:11px;color:var(--text-dim)}@media(max-width:600px){.png-workspace{padding:16px}.local-label,.export-note{display:none}.png-workspace .image-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.png-workspace .image-preview-wrapper{height:145px;padding:12px}.png-workspace .image-info{padding:9px}.png-workspace .image-actions{gap:3px;flex-wrap:wrap}.png-workspace .image-actions .edit-btn{flex-basis:100%;text-align:center}.png-workspace .image-actions button:not(.edit-btn){flex:1}.queue-toolbar .btn{padding:9px 12px;font-size:12px}.png-editor{width:calc(100vw - 16px);max-height:calc(100dvh - 16px);border-radius:14px}.png-editor .editor-body{grid-template-columns:1fr}.png-editor .preview-area{height:30dvh}.png-editor .canvas-panel{padding:12px}.png-editor .editor-controls{border-left:0;border-top:1px solid var(--border);padding:16px}.png-editor .control-section{margin-bottom:16px}.png-editor .modal-header,.png-editor .modal-footer{padding:12px 16px}.png-editor .modal-footer span{display:none}.png-editor .modal-footer{justify-content:flex-end}}