:root{--bgr-primary:var(--main-primary);--bgr-primary-hover:var(--main-primary-hover);--bgr-text:#1e293b;--bgr-text-muted:#64748b;--bgr-bg:#fff;--bgr-bg-secondary:#f8fafc;--bgr-border:#e2e8f0;--bgr-border-hover:#cbd5e1;--bgr-radius:var(--main-radius);--bgr-radius-lg:var(--main-radius-lg);--bgr-shadow:0 1px 3px #00000014;--bgr-shadow-md:0 4px 12px #0000001a;--bgr-checker-light:#fff;--bgr-checker-dark:#e2e8f0;--bgr-toolbar-bg:#fff;--bgr-upload-border:#cbd5e1;--bgr-upload-bg:#fff9}._bgr-container{flex-direction:column;min-height:500px;display:flex}._bgr-editor{flex-direction:column;gap:0;height:100%;display:flex}@media (max-width:768px){._bgr-container{padding-left:1rem;padding-right:1rem}}._bgr-upload{min-height:400px;padding:var(--main-space-6);justify-content:center;align-items:center;display:flex}._bgr-upload-area{justify-content:center;align-items:center;gap:var(--main-space-3);width:100%;max-width:480px;padding:var(--main-space-10) var(--main-space-6);border-style:dashed;border-width:2px;border-color:var(--bgr-upload-border);border-radius:var(--bgr-radius-lg);background:var(--bgr-upload-bg);cursor:pointer;text-align:center;flex-direction:column;transition:border-color .2s,background .2s;display:flex}._bgr-upload-area:hover,._bgr-upload-area.dragover{border-color:var(--bgr-primary);background:#6366f10a}._bgr-upload-icon{color:var(--bgr-text-muted);margin-bottom:var(--main-space-2)}._bgr-upload-area:hover ._bgr-upload-icon,._bgr-upload-area.dragover ._bgr-upload-icon{color:var(--bgr-primary)}._bgr-upload-title{font-size:var(--main-text-lg);color:var(--bgr-text);font-weight:600}._bgr-upload-subtitle{font-size:var(--main-text-sm);color:var(--bgr-text-muted)}._bgr-upload-hint{font-size:var(--main-text-xs);color:var(--bgr-text-muted);margin-top:var(--main-space-2);opacity:.7}@media (max-width:768px){._bgr-upload{min-height:300px;padding:var(--main-space-4)}._bgr-upload-area{padding:var(--main-space-8) var(--main-space-4)}}._bgr-toolbar{background:var(--bgr-toolbar-bg);border-style:solid;border-width:0 0 1px;border-color:var(--bgr-border);border-radius:var(--bgr-radius-lg) var(--bgr-radius-lg) 0 0}._bgr-toolbar-main{justify-content:space-between;align-items:center;gap:var(--main-space-3);padding:var(--main-space-2) var(--main-space-3);display:flex}._bgr-toolbar-left,._bgr-toolbar-right{align-items:center;gap:var(--main-space-2);display:flex}._bgr-toolbar-group{align-items:center;gap:var(--main-space-1);display:flex}._bgr-toolbar-sep{background:var(--bgr-border);width:1px;height:24px}._bgr-toolbar-sub{align-items:center;gap:var(--main-space-4);padding:var(--main-space-2) var(--main-space-3);border-style:solid;border-width:1px 0 0;border-color:var(--bgr-border);background:var(--bgr-bg-secondary);display:flex}._bgr-tool-btn{border-radius:var(--bgr-radius);color:var(--bgr-text-muted);font-size:var(--main-text-sm);cursor:pointer;white-space:nowrap;background:0 0;border:1px solid #0000;align-items:center;gap:6px;padding:6px 10px;transition:color .15s,background .15s;display:inline-flex}._bgr-tool-btn:hover{color:var(--bgr-text);background:var(--bgr-bg-secondary)}._bgr-tool-btn.active{color:var(--bgr-primary);background:#6366f114;border-color:#6366f133}._bgr-tool-btn:disabled{opacity:.4;cursor:not-allowed}._bgr-checker-icon{border-style:solid;border-width:1px;border-color:var(--bgr-border);background-color:#fff;background-image:linear-gradient(45deg,#ccc 25%,#0000 25% 75%,#ccc 75%),linear-gradient(45deg,#ccc 25%,#0000 25% 75%,#ccc 75%);background-position:0 0,4px 4px;background-size:8px 8px;border-radius:3px;width:14px;height:14px;display:inline-block}._bgr-brush-options{align-items:center;gap:var(--main-space-2);display:flex}._bgr-brush-label{font-size:var(--main-text-xs);color:var(--bgr-text-muted);white-space:nowrap}._bgr-range{width:100px;accent-color:var(--bgr-primary);cursor:pointer}#_bgr-brush-size-val{font-size:var(--main-text-xs);color:var(--bgr-text-muted);text-align:center;min-width:20px}._bgr-color-panel{align-items:center;gap:var(--main-space-2);display:flex}._bgr-color-picker{border-style:solid;border-width:1px;border-color:var(--bgr-border);border-radius:var(--bgr-radius);cursor:pointer;background:0 0;width:28px;height:28px;padding:0}._bgr-color-presets{align-items:center;gap:4px;display:flex}._bgr-color-swatch{border-style:solid;border-width:2px;border-color:var(--bgr-border);cursor:pointer;border-radius:50%;width:22px;height:22px;padding:0;transition:box-shadow .15s}._bgr-color-swatch:hover{box-shadow:0 0 0 2px #6366f14d}._bgr-color-swatch.active{border-color:var(--bgr-primary);box-shadow:0 0 0 2px #6366f14d}@media (max-width:768px){._bgr-toolbar-main{padding:var(--main-space-2);gap:var(--main-space-1);flex-wrap:wrap}._bgr-toolbar-left{flex:1}._bgr-toolbar-right{flex-shrink:0}._bgr-btn-label,._bgr-toolbar-sep{display:none}._bgr-toolbar-sub{padding:var(--main-space-2);gap:var(--main-space-2);flex-wrap:wrap}._bgr-brush-options{flex:1;min-width:150px}._bgr-range{flex:1}}._bgr-preview-wrap{background:var(--bgr-bg-secondary);flex:1;justify-content:center;align-items:center;min-height:350px;display:flex;position:relative;overflow:hidden}._bgr-canvas-area{background-image:linear-gradient(45deg, var(--bgr-checker-dark) 25%, transparent 25%, transparent 75%, var(--bgr-checker-dark) 75%), linear-gradient(45deg, var(--bgr-checker-dark) 25%, transparent 25%, transparent 75%, var(--bgr-checker-dark) 75%);background-position:0 0,8px 8px;background-size:16px 16px;background-color:var(--bgr-checker-light);max-width:100%;max-height:100%;box-shadow:var(--bgr-shadow-md);justify-content:center;align-items:center;line-height:0;display:inline-flex;position:relative}._bgr-canvas-area canvas{object-fit:contain;max-width:100%;max-height:calc(80vh - 200px);display:block}._bgr-brush-cursor{pointer-events:none;z-index:10;border:2px solid #fffc;border-radius:50%;display:none;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #0000004d}._bgr-loading{z-index:20;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#ffffffd9;justify-content:center;align-items:center;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}._bgr-loading-content{align-items:center;gap:var(--main-space-4);padding:var(--main-space-6);flex-direction:column;display:flex}._bgr-loading-spinner{border-style:solid;border-width:3px;border-color:var(--bgr-border);border-top-color:var(--bgr-primary);border-radius:50%;width:40px;height:40px;animation:.8s linear infinite _bgr-spin}@keyframes _bgr-spin{to{transform:rotate(360deg)}}._bgr-loading-text{font-size:var(--main-text-sm);color:var(--bgr-text);font-weight:500}._bgr-progress{background:var(--bgr-border);border-radius:2px;width:200px;height:4px;overflow:hidden}._bgr-progress-bar{background:var(--bgr-primary);border-radius:2px;width:0%;height:100%;transition:width .3s}@media (max-width:768px){._bgr-preview-wrap{min-height:250px}._bgr-canvas-area canvas{max-height:calc(70vh - 200px)}}._bgr-output{justify-content:space-between;align-items:center;gap:var(--main-space-3);padding:var(--main-space-2) var(--main-space-3);background:var(--bgr-toolbar-bg);border-style:solid;border-width:1px 0 0;border-color:var(--bgr-border);border-radius:0 0 var(--bgr-radius-lg) var(--bgr-radius-lg);display:flex}._bgr-output-info{font-size:var(--main-text-sm);color:var(--bgr-text-muted);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}._bgr-output-controls{align-items:center;gap:var(--main-space-3);flex-shrink:0;display:flex}._bgr-select{border-style:solid;border-width:1px;border-color:var(--bgr-border);border-radius:var(--bgr-radius);background:var(--bgr-bg);color:var(--bgr-text);font-size:var(--main-text-sm);cursor:pointer;-webkit-appearance:auto;appearance:auto;padding:6px 28px 6px 10px}._bgr-quality-wrap{align-items:center;gap:var(--main-space-2);font-size:var(--main-text-sm);color:var(--bgr-text-muted);display:flex}._bgr-quality-label{white-space:nowrap}._bgr-range{cursor:pointer;width:80px;accent-color:var(--bgr-primary)}._bgr-btn-primary{background:var(--bgr-primary);color:#fff;border-radius:var(--bgr-radius);font-size:var(--main-text-sm);cursor:pointer;white-space:nowrap;border-width:0;align-items:center;gap:6px;padding:8px 16px;font-weight:500;transition:opacity .15s;display:inline-flex;box-shadow:0 2px 8px #6366f140}._bgr-btn-primary:hover{opacity:.9}._bgr-btn-primary:disabled{opacity:.5;cursor:not-allowed}@media (max-width:768px){._bgr-output{gap:var(--main-space-2);padding:var(--main-space-2);flex-direction:column}._bgr-output-controls{justify-content:space-between;width:100%}._bgr-quality-wrap{display:none}}