@import "https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,300;0,14..32,400;0,14..32,500;0,14..32,600;0,14..32,700;0,14..32,800;1,14..32,400&family=JetBrains+Mono:wght@400;500&display=swap";*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#fff;--bg-secondary:#fafafa;--bg-tertiary:#f5f5f5;--bg-hover:#ebebeb;--border:#e8e8e8;--border-strong:#d0d0d0;--text:#111;--text-secondary:#555;--text-muted:#999;--text-placeholder:#bbb;--accent:#06f;--accent-light:#e8f0ff;--accent-hover:#0052cc;--color-obj:#06f;--color-text-elem:#d97706;--color-bg-elem:#059669;--danger:#dc2626;--success:#059669;--radius-sm:6px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--ease-out:cubic-bezier(.16, 1, .3, 1);--ease-spring:cubic-bezier(.34, 1.56, .64, 1);font-size:13px;line-height:1.5}[data-theme=dark]{--bg:#1c1c1c;--bg-secondary:#242424;--bg-tertiary:#2a2a2a;--bg-hover:#303030;--border:#383838;--border-strong:#4a4a4a;--text:#e8e8e8;--text-secondary:#a0a0a0;--text-muted:#6a6a6a;--text-placeholder:#4a4a4a;--accent:#fa6400;--accent-light:#fa64001f;--accent-hover:#e05a00;--color-obj:#fa6400;--color-text-elem:#d97706;--color-bg-elem:#059669;--danger:#f87171;--success:#34d399}html,body,#root{background:var(--bg);height:100%;color:var(--text);-webkit-font-smoothing:antialiased;font-family:Inter,system-ui,sans-serif}#root{flex-direction:column;display:flex;overflow:hidden}.mode-toggle{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-sm);gap:2px;padding:2px;display:flex}.mode-toggle-btn{border-radius:calc(var(--radius-sm) - 2px);cursor:pointer;color:var(--text-muted);background:0 0;border:none;align-items:center;gap:5px;padding:4px 12px;font-family:Inter,sans-serif;font-size:12px;font-weight:500;transition:all .12s;display:inline-flex}.mode-toggle-btn:hover{color:var(--text-secondary)}.mode-toggle-btn.active{background:var(--bg);color:var(--text);box-shadow:0 1px 3px #00000014}.generate-view{background:var(--bg);flex:1;justify-content:center;align-items:center;padding:48px 24px;display:flex;overflow-y:auto}.generate-view-inner{flex-direction:column;gap:28px;width:100%;max-width:680px;display:flex}.generate-header{text-align:center}.generate-title{color:var(--text);letter-spacing:-.03em;margin-bottom:8px;font-size:28px;font-weight:800}.generate-subtitle{color:var(--text-muted);font-size:14px;line-height:1.5}.generate-box{background:var(--bg);border:1.5px solid var(--border);border-radius:var(--radius-xl);transition:border-color .15s,box-shadow .15s;overflow:hidden;box-shadow:0 2px 16px #0000000f}.generate-box:focus-within{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-light), 0 2px 16px #0000000f}.generate-box.loading{border-color:var(--accent)}.generate-textarea{width:100%;color:var(--text);resize:none;background:0 0;border:none;outline:none;min-height:80px;max-height:200px;padding:20px 20px 12px;font-family:Inter,sans-serif;font-size:15px;line-height:1.6;overflow-y:auto}.generate-textarea::placeholder{color:var(--text-placeholder)}.generate-box-footer{border-top:1px solid var(--border);background:var(--bg-secondary);justify-content:space-between;align-items:center;padding:10px 14px;display:flex}.generate-hint{color:var(--text-muted);font-size:11px}.generate-hint kbd{font-size:10px}.generate-send{border-radius:var(--radius-sm);background:var(--bg-tertiary);color:var(--text-muted);cursor:default;border:none;align-items:center;gap:6px;padding:7px 16px;font-family:Inter,sans-serif;font-size:13px;font-weight:600;transition:all .12s;display:inline-flex}.generate-send.active{background:var(--text);color:#fff;cursor:pointer;box-shadow:0 2px 8px #00000026}.generate-send.active:hover{background:#333}.generate-send.active:active{transform:scale(.97)}.generate-thinking{color:var(--text-secondary);align-items:center;gap:12px;padding:24px 20px;font-size:14px;display:flex}.generate-spinner{border:2px solid var(--accent-light);border-top-color:var(--accent);border-radius:50%;flex-shrink:0;width:24px;height:24px;animation:.75s linear infinite spin}.generate-suggestions{flex-direction:column;gap:10px;display:flex}.generate-suggestions-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;font-size:11px;font-weight:600}.generate-suggestions-grid{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.generate-suggestion-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;text-align:left;transition:border-color .12s, background .12s, transform .12s var(--ease-spring);flex-direction:column;gap:4px;padding:12px 14px;font-family:Inter,sans-serif;display:flex}.generate-suggestion-card:hover{border-color:var(--accent);background:var(--accent-light);transform:translateY(-1px)}.generate-suggestion-label{color:var(--accent);text-transform:uppercase;letter-spacing:.05em;font-size:11px;font-weight:700}.generate-suggestion-text{color:var(--text-secondary);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:11px;line-height:1.4;display:-webkit-box;overflow:hidden}.center-col{flex-direction:column;flex:1;min-width:0;display:flex;overflow:hidden}@keyframes spin{to{transform:rotate(360deg)}}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:99px}::-webkit-scrollbar-thumb:hover{background:var(--border-strong)}.topbar{background:var(--bg);border-bottom:1px solid var(--border);z-index:10;flex-shrink:0;align-items:center;gap:6px;height:52px;padding:0 16px;display:flex}.topbar-logo{align-items:center;gap:8px;margin-right:4px;text-decoration:none;display:flex}.topbar-logo-icon{background:var(--text);width:26px;height:26px;color:var(--bg);letter-spacing:-.03em;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;font-size:13px;font-weight:700;display:flex}.topbar-logo-name{color:var(--text);letter-spacing:-.02em;font-size:13px;font-weight:700}.topbar-sep{background:var(--border);flex-shrink:0;width:1px;height:18px;margin:0 6px}.topbar-spacer{flex:1}.ratio-select{appearance:none;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23999994' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-position:right 8px center;background-repeat:no-repeat;padding:5px 28px 5px 10px;font-family:Inter,sans-serif;font-size:12px;font-weight:500;transition:border-color .15s}.ratio-select:focus{border-color:var(--accent);outline:none}.ratio-select:hover{border-color:var(--border-strong)}.kbd-hint{color:var(--text-muted);align-items:center;gap:4px;font-size:11px;display:flex}kbd{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-secondary);border-radius:4px;padding:1px 5px;font-family:inherit;font-size:10px;font-weight:500;line-height:1.6;display:inline-block}.btn{cursor:pointer;border-radius:var(--radius-sm);white-space:nowrap;-webkit-user-select:none;user-select:none;border:1px solid #0000;align-items:center;gap:5px;padding:5px 12px;font-family:Inter,sans-serif;font-size:12px;font-weight:500;line-height:1.4;transition:background .12s,border-color .12s,color .12s,box-shadow .12s,transform .1s;display:inline-flex}.btn:active:not(:disabled){transform:scale(.97)}.btn:disabled{opacity:.38;cursor:default}.btn-ghost{color:var(--text-secondary);background:0 0}.btn-ghost:hover:not(:disabled){background:var(--bg-secondary);color:var(--text)}.btn-default{background:var(--bg-secondary);border-color:var(--border);color:var(--text)}.btn-default:hover:not(:disabled){background:var(--bg-tertiary);border-color:var(--border-strong)}.btn-primary{background:var(--text);border-color:var(--text);color:var(--bg)}.btn-primary:hover:not(:disabled){opacity:.85}.btn-accent{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 1px 4px #7c3aed33}.btn-accent:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover);box-shadow:0 2px 8px #7c3aed4d}.btn-active{background:var(--accent-light);border-color:var(--accent);color:var(--accent)}.btn-danger{color:var(--danger);background:0 0;border-color:#0000}.btn-danger:hover:not(:disabled){background:#fef2f2;border-color:#fecaca}[data-theme=dark] .btn-danger:hover:not(:disabled){background:#dc26261f;border-color:#dc26264d}.btn-success-flash{border-color:var(--success)!important;color:var(--success)!important;background:#f0fdf4!important}[data-theme=dark] .btn-success-flash{background:#05966926!important}.btn-icon{justify-content:center;width:30px;height:30px;padding:5px}.tool-btn{border-radius:var(--radius-md);cursor:pointer;width:56px;color:var(--text-muted);-webkit-user-select:none;user-select:none;background:0 0;border:1px solid #0000;flex-direction:column;align-items:center;gap:4px;padding:8px 4px;font-family:Inter,sans-serif;font-size:10px;font-weight:500;line-height:1.2;transition:background .12s,color .12s,border-color .12s;display:flex}.tool-btn:hover:not(:disabled){background:var(--bg-secondary);color:var(--text-secondary)}.tool-btn.active{background:var(--accent-light);color:var(--accent);border-color:#7c3aed33}.tool-btn:disabled{opacity:.35;cursor:default}.tool-btn svg{width:18px;height:18px}.main-layout{flex:1;display:flex;overflow:hidden}.toolbox{background:var(--bg);border-right:1px solid var(--border);flex-direction:column;flex-shrink:0;align-items:center;gap:1px;width:68px;padding:10px 6px;display:flex}.toolbox-sep{background:var(--border);width:32px;height:1px;margin:5px 0}.canvas-area{background:var(--bg-secondary);flex-direction:column;flex:1;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.canvas-area:before{content:"";background-image:radial-gradient(circle, var(--border-strong) 1px, transparent 1px);pointer-events:none;opacity:.5;background-size:20px 20px;position:absolute;inset:0}.canvas-zoom-wrap{transform-origin:50%;transition:transform 80ms var(--ease-out);position:relative}.canvas-wrapper{border-radius:var(--radius-md);box-shadow:0 0 0 1px var(--border), 0 4px 24px #00000014, 0 1px 4px #0000000a;transition:box-shadow .2s;position:relative;overflow:hidden}.canvas-wrapper:focus-within,.canvas-wrapper:hover{box-shadow:0 0 0 1px var(--border-strong), 0 8px 32px #0000001f, 0 2px 6px #0000000f}.canvas-wrapper svg{cursor:crosshair;display:block}.canvas-wrapper.mode-select svg{cursor:default}.zoom-indicator{background:var(--bg);border:1px solid var(--border);color:var(--text-secondary);opacity:0;pointer-events:none;-webkit-user-select:none;user-select:none;border-radius:99px;align-items:center;gap:6px;padding:4px 10px;font-size:11px;font-weight:500;transition:opacity .25s;display:flex;position:absolute;bottom:16px;left:50%;transform:translate(-50%);box-shadow:0 2px 8px #00000014}.zoom-indicator.visible{opacity:1;pointer-events:auto}.bbox-rect{fill:var(--accent-light);stroke:var(--color-obj);stroke-width:1.5px;cursor:move;transition:fill .12s}.bbox-rect:hover{opacity:.85}.bbox-rect.selected{stroke-width:2px}.bbox-rect.type-text{stroke:var(--color-text-elem);fill:#d9770612}.bbox-rect.type-bg{stroke:var(--color-bg-elem);fill:#05966912}.elem-index-bg{rx:3}.elem-index-bg.type-obj{fill:var(--color-obj)}.elem-index-bg.type-text{fill:var(--color-text-elem)}.elem-index-bg.type-bg{fill:var(--color-bg-elem)}.elem-index-text{fill:#fff;pointer-events:none;-webkit-user-select:none;user-select:none;font-family:JetBrains Mono,monospace;font-size:9px;font-weight:700}.resize-handle{fill:#fff;stroke:var(--accent);stroke-width:1.5px;cursor:nwse-resize}.resize-handle:hover{fill:var(--accent-light)}.resize-handle.n,.resize-handle.s{cursor:ns-resize}.resize-handle.e,.resize-handle.w{cursor:ew-resize}.resize-handle.ne,.resize-handle.sw{cursor:nesw-resize}.snap-grid-line{stroke:var(--accent);stroke-opacity:.15;stroke-width:.5px}.draw-preview{fill:var(--accent-light);stroke:var(--accent);stroke-width:1.5px;stroke-dasharray:5 3;pointer-events:none}.bbox-tooltip{pointer-events:none;background:var(--text);color:#fff;border-radius:var(--radius-sm);white-space:nowrap;z-index:100;animation:tooltipIn .1s var(--ease-out);padding:4px 10px;font-family:JetBrains Mono,monospace;font-size:11px;position:absolute;box-shadow:0 4px 12px #00000026}@keyframes tooltipIn{0%{opacity:0;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}.canvas-magic-overlay{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:var(--radius-md);z-index:50;animation:fadeIn .2s var(--ease-out);background:#ffffffd1;flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex;position:absolute;inset:0}[data-theme=dark] .canvas-magic-overlay{background:#1c1c1ce0}.magic-spinner{border:2.5px solid var(--accent-light);border-top-color:var(--accent);border-radius:50%;width:32px;height:32px;animation:.75s linear infinite spin}.magic-label{color:var(--text);font-size:13px;font-weight:600}.magic-sublabel{color:var(--text-muted);font-size:11px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.right-panel{background:var(--bg);border-left:1px solid var(--border);flex-direction:column;flex-shrink:0;width:280px;display:flex;overflow:hidden}.panel-tabs{border-bottom:1px solid var(--border);flex-shrink:0;display:flex}.panel-tab{text-align:center;cursor:pointer;color:var(--text-muted);-webkit-user-select:none;user-select:none;border-bottom:2px solid #0000;flex:1;padding:10px 8px;font-size:12px;font-weight:500;transition:color .12s,border-color .12s}.panel-tab:hover{color:var(--text-secondary)}.panel-tab.active{color:var(--text);border-bottom-color:var(--text)}.panel-body{flex-direction:column;flex:1;gap:14px;padding:14px;display:flex;overflow-y:auto}.field-group{flex-direction:column;gap:5px;display:flex}.field-label{color:var(--text-secondary);letter-spacing:.01em;font-size:11px;font-weight:600}input[type=text],textarea{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-sm);width:100%;color:var(--text);resize:vertical;padding:7px 10px;font-family:Inter,sans-serif;font-size:12px;line-height:1.5;transition:border-color .12s,background .12s}input[type=text]::placeholder,textarea::placeholder{color:var(--text-placeholder)}input[type=text]:hover,textarea:hover{border-color:var(--border-strong)}input[type=text]:focus,textarea:focus{border-color:var(--accent);background:var(--bg);outline:none}textarea{min-height:72px}.type-selector{gap:4px;display:flex}.type-btn{text-align:center;border-radius:var(--radius-sm);cursor:pointer;border:1px solid var(--border);background:var(--bg-secondary);color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;flex:1;padding:5px 4px;font-family:Inter,sans-serif;font-size:11px;font-weight:600;transition:all .12s}.type-btn:hover{border-color:var(--border-strong);color:var(--text-secondary)}.type-btn.active-obj{background:var(--accent-light);border-color:var(--accent);color:var(--accent)}.type-btn.active-text{color:#92400e;background:#fef3c7;border-color:#d97706}.type-btn.active-bg{color:#065f46;background:#d1fae5;border-color:#059669}[data-theme=dark] .type-btn.active-text{color:#fbbf24;background:#d9770626}[data-theme=dark] .type-btn.active-bg{color:#34d399;background:#05966926}.bbox-preview{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--accent);padding:7px 10px;font-family:JetBrains Mono,monospace;font-size:11px}.section-header{align-items:center;gap:6px;display:flex}.section-title{color:var(--text-secondary);letter-spacing:.01em;font-size:11px;font-weight:600}.section-badge{background:var(--bg-tertiary);color:var(--text-muted);border:1px solid var(--border);border-radius:99px;padding:0 5px;font-size:10px;line-height:1.8}.divider{background:var(--border);height:1px}.style-toggle{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-sm);gap:2px;padding:2px;display:flex}.style-toggle-btn{text-align:center;border-radius:calc(var(--radius-sm) - 2px);cursor:pointer;color:var(--text-muted);background:0 0;border:none;flex:1;padding:4px 8px;font-family:Inter,sans-serif;font-size:11px;font-weight:500;transition:all .12s}.style-toggle-btn.active{background:var(--bg);color:var(--text);box-shadow:0 1px 3px #00000014}.style-toggle-btn:hover:not(.active){color:var(--text-secondary)}.palette-wrap{flex-direction:column;gap:7px;display:flex}.palette-toolbar{justify-content:space-between;align-items:center;gap:6px;display:flex}.palette-tools-left{flex-wrap:wrap;align-items:center;gap:4px;display:flex}.palette-tool-btn{color:var(--text-secondary);background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;align-items:center;gap:4px;height:24px;padding:3px 8px;font-size:11px;font-weight:500;line-height:1;transition:all .12s;display:inline-flex}.palette-tool-btn:hover:not(:disabled){color:var(--text);background:var(--bg-hover);border-color:var(--border-strong)}.palette-tool-btn.active{background:var(--accent-light);color:var(--accent);border-color:var(--accent);font-weight:600}.palette-tool-btn:disabled{opacity:.45;cursor:not-allowed}.palette-clear-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:2px 5px;font-size:11px;transition:color .12s,background .12s}.palette-clear-btn:hover{color:var(--danger);background:#dc262614}.palette-hex-entry-row{align-items:center;gap:4px;margin-bottom:2px;display:flex}.palette-hex-entry-input{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg);color:var(--text);text-transform:uppercase;flex:1;padding:4px 7px;font-family:JetBrains Mono,monospace;font-size:11px}.palette-hex-entry-input:focus{border-color:var(--accent);outline:none}.palette-hex-entry-btn{background:var(--accent);color:#fff;border-radius:var(--radius-sm);cursor:pointer;border:none;padding:4px 10px;font-size:11px;font-weight:600}.palette-hex-entry-btn:disabled{opacity:.5;cursor:not-allowed}.palette-row{flex-wrap:wrap;align-items:center;gap:5px;display:flex}.color-chip-wrap{cursor:pointer;flex-shrink:0;width:24px;height:24px;position:relative}.color-chip{border-radius:var(--radius-sm);width:24px;height:24px;transition:transform .12s var(--ease-spring), box-shadow .12s;border:1px solid #00000026;flex-shrink:0;position:relative}.color-chip-wrap:hover .color-chip{transform:scale(1.08);box-shadow:0 2px 8px #0003}.color-chip-actions{border-radius:var(--radius-sm);opacity:0;z-index:2;transition:opacity .12s;display:flex;position:absolute;inset:0;overflow:hidden}.color-chip-wrap:hover .color-chip-actions{opacity:1}.color-chip-action{color:#fff;cursor:pointer;background:#000000a6;border:none;flex:1;justify-content:center;align-items:center;padding:0;font-size:11px;font-weight:700;line-height:1;transition:background .1s;display:flex}.color-chip-action:hover{background:#000000d9}.color-chip-remove:hover{background:#dc2626e6}.color-chip-add{border-radius:var(--radius-sm);border:1.5px dashed var(--border-strong);cursor:pointer;width:24px;height:24px;color:var(--text-muted);transition:border-color .12s, color .12s, transform .12s var(--ease-spring);background:0 0;flex-shrink:0;justify-content:center;align-items:center;padding:0;font-family:inherit;font-size:14px;font-weight:400;line-height:1;display:flex}.color-chip-add:hover{border-color:var(--accent);color:var(--accent);transform:scale(1.12)}input[type=color]{opacity:0;pointer-events:none;width:0;height:0;position:absolute}.palette-hex-badges{flex-wrap:wrap;gap:4px;margin-top:1px;display:flex}.palette-hex-badge{color:var(--text-secondary);background:var(--bg-secondary);border:1px solid var(--border);cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:4px;padding:2px 5px;font-family:JetBrains Mono,monospace;font-size:10px;transition:all .12s}.palette-hex-badge:hover{background:var(--bg-hover);color:var(--text);border-color:var(--border-strong)}.palette-hex-badge.copied{background:var(--success);color:#fff;border-color:var(--success);font-weight:600}.palette-global-sync{background:var(--bg-secondary);border:1px dashed var(--border);border-radius:var(--radius-sm);flex-direction:column;gap:5px;margin-top:4px;padding:6px 8px;display:flex}.palette-sync-header{justify-content:space-between;align-items:center;display:flex}.palette-sync-label{text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted);font-size:10px;font-weight:600}.palette-sync-chips{flex-wrap:wrap;align-items:center;gap:4px;display:flex}.palette-sync-chip{cursor:pointer;width:18px;height:18px;transition:transform .12s var(--ease-spring), opacity .12s;border:1px solid #0000002e;border-radius:50%;justify-content:center;align-items:center;padding:0;display:flex}.palette-sync-chip:hover:not(:disabled){transform:scale(1.2);box-shadow:0 1px 4px #0003}.palette-sync-chip.added{opacity:.45;cursor:default}.sync-chip-check{color:#fff;text-shadow:0 1px 2px #000c;font-size:9px;font-weight:800}.preset-modal-backdrop{-webkit-backdrop-filter:blur(4px);z-index:1000;background:#000000a6;justify-content:center;align-items:center;padding:20px;animation:.15s ease-out modalFadeIn;display:flex;position:fixed;inset:0}.preset-modal-content{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-lg);flex-direction:column;width:740px;max-width:95vw;max-height:86vh;display:flex;position:relative;overflow:hidden;box-shadow:0 20px 50px #0006}.preset-modal-header{background:var(--bg-secondary);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:12px;padding:12px 18px;display:flex}.preset-modal-title-wrap{align-items:center;gap:8px;display:flex}.preset-modal-title{color:var(--text);font-size:14px;font-weight:700}.preset-modal-badge{background:var(--bg-tertiary);color:var(--text-muted);border:1px solid var(--border);border-radius:4px;padding:2px 6px;font-family:JetBrains Mono,monospace;font-size:10px}.preset-modal-tabs{background:var(--bg-tertiary);border-radius:var(--radius-sm);border:1px solid var(--border);gap:4px;padding:3px;display:flex}.preset-tab-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px 10px;font-size:11px;font-weight:500;transition:all .12s}.preset-tab-btn:hover{color:var(--text)}.preset-tab-btn.active{background:var(--bg);color:var(--text);font-weight:600;box-shadow:0 1px 3px #00000014}.preset-modal-close{color:var(--text-muted);cursor:pointer;border-radius:var(--radius-sm);background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;margin-left:auto;padding:4px;font-size:14px;line-height:1;transition:all .12s;display:inline-flex}.preset-modal-close:hover{color:var(--text);background:var(--bg-hover)}.preset-modal-body{flex-direction:column;gap:14px;padding:16px 20px;display:flex;overflow-y:auto}.preset-filters-bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.preset-categories{flex-wrap:wrap;gap:5px;display:flex}.preset-cat-pill{border:1px solid var(--border);background:var(--bg-secondary);color:var(--text-secondary);cursor:pointer;border-radius:12px;padding:3px 9px;font-size:11px;transition:all .1s}.preset-cat-pill:hover{color:var(--text);border-color:var(--border-strong)}.preset-cat-pill.active{background:var(--accent);color:#fff;border-color:var(--accent);font-weight:600}.preset-search-wrap{align-items:center;display:flex;position:relative}.preset-search-input{border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg);color:var(--text);width:210px;padding:5px 22px 5px 9px;font-size:11px}.preset-search-input:focus{border-color:var(--accent);outline:none}.preset-search-clear{color:var(--text-muted);cursor:pointer;background:0 0;border:none;font-size:10px;position:absolute;right:6px}.preset-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px;display:grid}.preset-card{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--bg);flex-direction:column;transition:transform .12s,box-shadow .12s,border-color .12s;display:flex;overflow:hidden}.preset-card:hover{border-color:var(--border-strong);transform:translateY(-2px);box-shadow:0 4px 14px #00000017}.preset-colorbar{width:100%;height:38px;display:flex}.preset-color-slice{cursor:pointer;flex:1;justify-content:center;align-items:center;transition:flex .15s;display:flex;position:relative}.preset-color-slice:hover{flex:1.9}.preset-slice-hex{color:#fff;text-shadow:0 1px 2px #000000e6;opacity:0;pointer-events:none;font-family:JetBrains Mono,monospace;font-size:9px;transition:opacity .1s}.preset-color-slice:hover .preset-slice-hex{opacity:1}.preset-card-details{flex-direction:column;flex:1;gap:6px;padding:10px 12px;display:flex}.preset-card-top{justify-content:space-between;align-items:baseline;display:flex}.preset-card-name{color:var(--text);font-size:13px;font-weight:600}.preset-card-cat{text-transform:uppercase;background:var(--bg-secondary);color:var(--text-muted);border-radius:3px;padding:2px 5px;font-size:9px;font-weight:600}.preset-card-desc{color:var(--text-secondary);margin:0;font-size:11px;line-height:1.35}.preset-card-actions{gap:6px;margin-top:auto;padding-top:6px;display:flex}.preset-btn-apply{background:var(--accent);color:#fff;border-radius:var(--radius-sm);cursor:pointer;border:none;flex:1;padding:5px 10px;font-size:11px;font-weight:600;transition:filter .1s}.preset-btn-apply:hover{filter:brightness(1.1)}.preset-btn-append{background:var(--bg-secondary);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;padding:5px 10px;font-size:11px;font-weight:500;transition:background .1s}.preset-btn-append:hover{background:var(--bg-hover)}.harmonies-body{gap:14px}.harmony-seed-bar{background:var(--bg-secondary);border-radius:var(--radius-md);border:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:10px;padding:10px 14px;display:flex}.harmony-seed-label{color:var(--text);font-size:12px;font-weight:600}.harmony-seed-input-wrap{align-items:center;gap:6px;display:flex}.harmony-seed-swatch{cursor:pointer;border:1px solid #00000026;border-radius:4px;width:26px;height:26px;box-shadow:0 1px 3px #0000001a}.harmony-seed-hex{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg);width:82px;color:var(--text);text-transform:uppercase;padding:4px 6px;font-family:JetBrains Mono,monospace;font-size:11px}.harmony-seed-hex:focus{border-color:var(--accent);outline:none}.harmony-seed-tool-btn{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg);color:var(--text);cursor:pointer;align-items:center;gap:4px;padding:4px 8px;font-size:11px;transition:all .1s;display:flex}.harmony-seed-tool-btn:hover{background:var(--bg-hover)}.harmony-current-swatches{align-items:center;gap:5px;margin-left:auto;display:flex}.harmony-current-label{color:var(--text-muted);font-size:10px}.harmony-swatch-chip{cursor:pointer;border:1px solid #00000026;border-radius:50%;width:18px;height:18px;padding:0;transition:transform .1s}.harmony-swatch-chip:hover{transform:scale(1.15)}.harmony-swatch-chip.active{outline:2px solid var(--accent);outline-offset:1px}.harmony-list{flex-direction:column;gap:10px;display:flex}.harmony-card{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--bg);align-items:center;gap:14px;padding:10px 14px;display:flex}.harmony-card-info{flex-shrink:0;width:150px}.harmony-card-title{color:var(--text);font-size:13px;font-weight:600}.harmony-card-desc{color:var(--text-muted);font-size:10px;line-height:1.3}.harmony-swatches-strip{border-radius:var(--radius-sm);border:1px solid var(--border);flex:1;height:34px;display:flex;overflow:hidden}.harmony-color-slice{cursor:pointer;flex:1;justify-content:center;align-items:center;transition:flex .15s;display:flex;position:relative}.harmony-color-slice:hover{flex:1.9}.harmony-slice-hex{color:#fff;text-shadow:0 1px 2px #000000e6;opacity:0;pointer-events:none;font-family:JetBrains Mono,monospace;font-size:9px;transition:opacity .1s}.harmony-color-slice:hover .harmony-slice-hex{opacity:1}.harmony-card-actions{flex-shrink:0;gap:6px;display:flex}.palette-copied-toast{color:#fff;z-index:1100;pointer-events:none;background:#111827;border-radius:20px;padding:8px 16px;font-size:12px;font-weight:500;animation:.15s modalFadeIn;position:fixed;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 6px 20px #0000004d}@keyframes modalFadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.elem-list{flex-direction:column;gap:2px;display:flex}.elem-item{border-radius:var(--radius-sm);cursor:pointer;animation:slideIn .15s var(--ease-out);border:1px solid #0000;align-items:center;gap:7px;padding:6px 8px;transition:background .1s,border-color .1s;display:flex}.elem-item:hover{background:var(--bg-secondary)}.elem-item.selected{background:var(--bg-secondary);border-color:var(--border)}.elem-item-index{border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;width:16px;height:16px;font-family:JetBrains Mono,monospace;font-size:9px;font-weight:700;display:flex}.elem-item-index.type-obj{background:var(--accent-light);color:var(--accent)}.elem-item-index.type-text{color:#92400e;background:#fef3c7}.elem-item-index.type-bg{color:#065f46;background:#d1fae5}[data-theme=dark] .elem-item-index.type-text{color:#fbbf24;background:#d9770626}[data-theme=dark] .elem-item-index.type-bg{color:#34d399;background:#05966926}.elem-item-type{text-transform:uppercase;letter-spacing:.04em;border-radius:4px;flex-shrink:0;padding:2px 5px;font-size:9px;font-weight:700}.elem-item-type.type-obj{background:var(--accent-light);color:var(--accent)}.elem-item-type.type-text{color:#92400e;background:#fef3c7}.elem-item-type.type-bg{color:#065f46;background:#d1fae5}[data-theme=dark] .elem-item-type.type-text{color:#fbbf24;background:#d9770626}[data-theme=dark] .elem-item-type.type-bg{color:#34d399;background:#05966926}.elem-item-desc{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:11px;overflow:hidden}.json-panel{background:var(--bg);border-left:1px solid var(--border);flex-direction:column;flex-shrink:0;width:296px;display:flex}.json-panel-header{border-bottom:1px solid var(--border);flex-shrink:0;align-items:center;gap:6px;height:44px;padding:0 12px;display:flex}.json-panel-title{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.06em;flex:1;font-size:11px;font-weight:600}.json-compact-toggle{color:var(--text-muted);cursor:pointer;border-radius:var(--radius-sm);-webkit-user-select:none;user-select:none;border:1px solid #0000;align-items:center;gap:4px;padding:3px 7px;font-family:JetBrains Mono,monospace;font-size:10px;font-weight:500;transition:all .12s;display:flex}.json-compact-toggle:hover{background:var(--bg-secondary);border-color:var(--border);color:var(--text-secondary)}.json-compact-toggle.active{background:var(--bg-secondary);border-color:var(--border);color:var(--text)}.json-output{color:var(--text-secondary);white-space:pre;background:var(--bg-secondary);flex:1;padding:12px 14px;font-family:JetBrains Mono,monospace;font-size:11.5px;line-height:1.7;overflow-y:auto}.json-key{color:#06f}.json-str{color:#059669}.json-num{color:#d97706}.json-bool{color:#dc2626}.json-null,.json-punct{color:var(--text-muted)}[data-theme=dark] .json-key{color:#79b8ff}[data-theme=dark] .json-str{color:#85e89d}[data-theme=dark] .json-num{color:#fa6400}[data-theme=dark] .json-bool{color:#f97583}[data-theme=dark] .json-output{background:var(--bg-tertiary)}.modal-backdrop{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:1000;animation:fadeIn .15s var(--ease-out);background:#0006;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-xl);width:700px;max-width:calc(100vw - 32px);max-height:calc(100vh - 64px);animation:modalIn .2s var(--ease-spring);flex-direction:column;display:flex;overflow:hidden;box-shadow:0 20px 60px #00000026,0 4px 12px #00000014}@keyframes modalIn{0%{opacity:0;transform:scale(.96)translateY(8px)}to{opacity:1;transform:scale(1)translateY(0)}}.modal-header{border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:flex-start;gap:16px;padding:20px 24px 16px;display:flex}.modal-header>:first-child{flex:1;min-width:0}.modal-header>.btn-icon,.modal-header>button:last-child{flex-shrink:0;margin-left:auto}.modal-title{color:var(--text);letter-spacing:-.02em;font-size:17px;font-weight:700}.modal-subtitle{color:var(--text-muted);margin-top:3px;font-size:12px}.modal-body{flex:1;padding:20px 24px;overflow-y:auto}.template-gallery-modal{width:780px;max-width:95vw}.template-gallery-header{justify-content:space-between;align-items:center;gap:16px;display:flex}.template-header-left{align-items:center;gap:16px;display:flex}.template-header-actions{align-items:center;gap:8px;display:flex}.template-tabs{background:var(--bg-tertiary);border-radius:var(--radius-sm);border:1px solid var(--border);gap:4px;padding:3px;display:flex}.template-tab-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:4px;align-items:center;padding:4px 12px;font-size:11px;font-weight:500;transition:all .12s;display:flex}.template-tab-btn:hover{color:var(--text)}.template-tab-btn.active{background:var(--bg);color:var(--text);font-weight:600;box-shadow:0 1px 3px #00000014}.tpl-tab-count{background:var(--accent);color:#fff;border-radius:8px;margin-left:5px;padding:1px 5px;font-family:JetBrains Mono,monospace;font-size:9px}.btn-save-canvas{border-radius:var(--radius-sm);padding:5px 12px;font-size:11px;font-weight:600}.template-grid{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}.template-card{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-lg);cursor:pointer;transition:border-color .15s, transform .15s var(--ease-spring), box-shadow .15s;flex-direction:column;display:flex;overflow:hidden}.template-card:hover{border-color:var(--border-strong);transform:translateY(-2px);box-shadow:0 6px 20px #0000001a}.template-card:active{transform:translateY(0)}.template-preview{background:var(--bg-secondary);justify-content:center;align-items:center;height:104px;display:flex;position:relative;overflow:hidden}.template-preview svg{width:100%;height:100%}.custom-template-preview{background:#090d16;padding:6px}.template-svg-container{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.template-thumbnail-svg{border-radius:4px;max-width:100%;max-height:100%}.template-info{flex-direction:column;flex:1;gap:3px;padding:10px 12px;display:flex}.template-card-top-row{justify-content:space-between;align-items:center;gap:6px;display:flex}.template-name{color:var(--text);font-size:12px;font-weight:600}.template-desc{color:var(--text-muted);font-size:10px;line-height:1.35}.template-badges-row{align-items:center;gap:4px;margin-top:2px;display:flex}.template-badge-ratio,.template-badge-cat,.template-badge-elems{background:var(--bg-secondary);color:var(--text-muted);border:1px solid var(--border);border-radius:3px;padding:1px 5px;font-family:JetBrains Mono,monospace;font-size:9px}.template-badge-cat{color:var(--accent);text-transform:uppercase;font-weight:600}.template-delete-btn{cursor:pointer;opacity:.45;background:0 0;border:none;border-radius:3px;padding:2px 4px;font-size:11px;transition:all .1s}.template-delete-btn:hover{opacity:1;color:var(--danger);background:#dc26261f}.my-library-body{flex-direction:column;gap:14px;min-height:380px;display:flex}.empty-library-state{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:8px;margin:auto;padding:48px 24px;display:flex}.empty-library-icon{opacity:.6;font-size:36px}.empty-library-title{color:var(--text);font-size:14px;font-weight:600}.empty-library-desc{color:var(--text-muted);max-width:400px;font-size:11px;line-height:1.45}.library-footer-bar{border-top:1px solid var(--border);justify-content:space-between;align-items:center;margin-top:auto;padding-top:12px;display:flex}.library-count-text{color:var(--text-muted);font-size:11px}.library-footer-actions{gap:6px;display:flex}.library-tool-btn{border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-secondary);color:var(--text);cursor:pointer;padding:4px 10px;font-size:11px;transition:all .1s}.library-tool-btn:hover:not(:disabled){background:var(--bg-hover)}.library-tool-btn:disabled{opacity:.4;cursor:not-allowed}.save-modal-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1200;background:#000000a6;justify-content:center;align-items:center;padding:20px;animation:.15s ease-out modalFadeIn;display:flex;position:fixed;inset:0}.save-modal-content{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-lg);width:600px;max-width:95vw;overflow:hidden;box-shadow:0 20px 50px #0006}.save-modal-header{background:var(--bg-secondary);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:12px 18px;display:flex}.save-modal-title-wrap{align-items:center;gap:8px;display:flex}.save-modal-title{color:var(--text);font-size:14px;font-weight:700}.save-modal-badge{background:var(--bg-tertiary);color:var(--text-muted);border:1px solid var(--border);border-radius:4px;padding:2px 6px;font-family:JetBrains Mono,monospace;font-size:10px}.save-modal-close{color:var(--text-muted);cursor:pointer;border-radius:var(--radius-sm);background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;margin-left:auto;padding:4px;font-size:14px;line-height:1;transition:all .12s;display:inline-flex}.save-modal-close:hover{color:var(--text);background:var(--bg-hover)}.save-modal-body{flex-direction:column;gap:16px;padding:16px 20px;display:flex}.save-modal-columns{grid-template-columns:190px 1fr;gap:18px;display:grid}.save-modal-preview-col{flex-direction:column;gap:8px;display:flex}.save-preview-title{text-transform:uppercase;color:var(--text-muted);letter-spacing:.04em;font-size:10px;font-weight:700}.save-preview-box{border-radius:var(--radius-md);border:1px solid var(--border);background:#080b14;justify-content:center;align-items:center;width:190px;height:160px;padding:8px;display:flex;overflow:hidden}.save-preview-stats{color:var(--text-muted);justify-content:space-between;font-family:JetBrains Mono,monospace;font-size:10px;display:flex}.save-modal-form-col{flex-direction:column;gap:12px;display:flex}.save-field-group{flex-direction:column;gap:4px;display:flex}.save-field-label{color:var(--text);font-size:11px;font-weight:600}.save-required{color:var(--danger)}.save-input{border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg);color:var(--text);padding:6px 9px;font-size:12px}.save-input:focus{border-color:var(--accent);outline:none}.save-cat-options{flex-wrap:wrap;gap:4px;display:flex}.save-cat-btn{border:1px solid var(--border);background:var(--bg-secondary);color:var(--text-secondary);cursor:pointer;border-radius:4px;padding:3px 8px;font-size:10px;transition:all .1s}.save-cat-btn:hover{border-color:var(--border-strong);color:var(--text)}.save-cat-btn.active{background:var(--accent);color:#fff;border-color:var(--accent);font-weight:600}.save-textarea{border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg);color:var(--text);resize:none;padding:6px 9px;font-family:inherit;font-size:11px}.save-textarea:focus{border-color:var(--accent);outline:none}.save-modal-footer{border-top:1px solid var(--border);justify-content:flex-end;align-items:center;gap:8px;padding-top:14px;display:flex}.save-btn-cancel{border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-secondary);color:var(--text);cursor:pointer;padding:6px 14px;font-size:11px;font-weight:500}.save-btn-submit{border-radius:var(--radius-sm);background:var(--accent);color:#fff;cursor:pointer;border:none;padding:6px 18px;font-size:11px;font-weight:600;transition:background .12s}.save-btn-submit:hover:not(:disabled){filter:brightness(1.1)}.save-btn-submit:disabled{opacity:.5;cursor:not-allowed}.save-btn-submit.saved{background:var(--success)}.empty-state{text-align:center;flex-direction:column;align-items:center;gap:6px;padding:24px 16px;display:flex}.empty-state-icon{opacity:.2;font-size:22px}.empty-state-text{color:var(--text-muted);font-size:12px;line-height:1.5}.error-toast{background:var(--bg);border-radius:var(--radius-lg);color:var(--danger);z-index:999;max-width:440px;animation:toastIn .2s var(--ease-spring);cursor:pointer;border:1px solid #fecaca;align-items:center;gap:8px;padding:10px 16px;font-size:12px;display:flex;position:fixed;bottom:20px;left:50%;transform:translate(-50%);box-shadow:0 8px 24px #0000001a}@keyframes toastIn{0%{opacity:0;transform:translate(-50%)translateY(8px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.error-toast-msg{flex:1}.ollama-badge{border-radius:var(--radius);background:var(--bg-3);color:var(--text-muted);cursor:default;-webkit-user-select:none;user-select:none;align-items:center;gap:5px;padding:3px 8px;font-size:11px;display:flex}.ollama-dot{border-radius:50%;flex-shrink:0;width:6px;height:6px}.ollama-dot.checking{background:var(--text-muted);opacity:.5}.ollama-dot.online{background:#22c55e;box-shadow:0 0 4px #22c55e88}.ollama-dot.offline{background:#f59e0b}.import-modal{flex-direction:column;width:800px;max-width:calc(100vw - 32px);height:640px;max-height:calc(100vh - 48px);display:flex}.import-modal-toolbar{background:var(--bg-secondary);border-bottom:1px solid var(--border);flex-wrap:wrap;flex-shrink:0;justify-content:space-between;align-items:center;gap:8px;padding:8px 16px;display:flex}.import-modal-toolbar-actions{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.import-toolbar-btn{align-items:center;gap:5px;height:28px;padding:4px 10px;font-size:11px;display:flex}.import-status-pill{background:var(--bg-tertiary);color:var(--text-muted);border:1px solid var(--border);white-space:nowrap;border-radius:999px;align-items:center;gap:6px;padding:4px 10px;font-family:JetBrains Mono,monospace;font-size:11px;display:flex}.status-dot{border-radius:50%;flex-shrink:0;width:6px;height:6px}.import-status-pill.status-valid{color:#059669;background:#0596691a;border-color:#0596694d}.dot-valid{background:#059669;box-shadow:0 0 5px #05966999}.import-status-pill.status-invalid{color:#dc2626;background:#dc26261a;border-color:#dc26264d}.dot-invalid{background:#dc2626;box-shadow:0 0 5px #dc262699}.dot-empty{background:var(--text-muted);opacity:.5}.import-modal-body{flex-direction:column;flex:1;gap:10px;min-height:0;padding:12px 16px;display:flex;overflow:hidden}.vsc-editor-wrapper{border-radius:var(--radius-md);background:#1e1e1e;border:1px solid #2d2d2d;flex-direction:column;flex:1;min-height:0;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 20px #00000026}.vsc-tab-bar{-webkit-user-select:none;user-select:none;background:#252526;border-bottom:1px solid #1e1e1e;flex-shrink:0;justify-content:space-between;align-items:center;height:34px;padding:0 12px;display:flex}.vsc-tab{color:#ccc;align-items:center;gap:6px;font-family:JetBrains Mono,Consolas,monospace;font-size:12px;display:flex}.vsc-editor-stats{color:#858585;align-items:center;gap:6px;font-family:JetBrains Mono,Consolas,monospace;font-size:11px;display:flex}.vsc-editor-body{flex:1;min-height:0;display:flex;position:relative;overflow:hidden}.vsc-gutter{text-align:right;color:#6e7681;-webkit-user-select:none;user-select:none;background:#1e1e1e;border-right:1px solid #282828;flex-shrink:0;width:44px;padding:12px 8px 12px 0;font-family:JetBrains Mono,Consolas,Monaco,monospace;font-size:12px;line-height:20px;overflow:hidden}.vsc-line-number{height:20px;line-height:20px}.vsc-code-surface{flex:1;min-height:0;position:relative;overflow:hidden}.vsc-pre,.vsc-textarea{tab-size:2;position:absolute;inset:0;white-space:pre!important;word-wrap:normal!important;box-sizing:border-box!important;margin:0!important;padding:12px 16px!important;font-family:JetBrains Mono,Consolas,Monaco,Courier New,monospace!important;font-size:13px!important;line-height:20px!important}.vsc-pre{pointer-events:none;-webkit-user-select:none;user-select:none;color:#d4d4d4;z-index:1;background:0 0;overflow:hidden}.vsc-pre code{font-family:inherit;font-size:inherit;line-height:inherit;background:0 0;border:none;padding:0}.vsc-textarea{z-index:2;box-shadow:none!important;color:#0000!important;caret-color:#528bff!important;resize:none!important;background:0 0!important;border:none!important;outline:none!important;overflow:auto!important}.vsc-textarea::selection{color:#0000!important;background:#264f7899!important}.vsc-key{color:#9cdcfe;font-weight:500}.vsc-string{color:#ce9178}.vsc-number{color:#b5cea8}.vsc-keyword{color:#569cd6;font-weight:500}.vsc-brace{color:gold}.vsc-bracket{color:orchid}.vsc-punct{color:#d4d4d4}.vsc-comment{color:#6a9955;font-style:italic}.vsc-placeholder{color:#6e7681;font-style:italic}.import-error-banner{border-radius:var(--radius-sm);color:var(--danger);animation:fadeIn .15s var(--ease-out);background:#dc26261a;border:1px solid #dc262640;flex-shrink:0;align-items:center;gap:8px;padding:8px 12px;font-family:JetBrains Mono,Consolas,monospace;font-size:12px;display:flex}.import-error-icon{font-weight:700}.import-error-msg{word-break:break-word;flex:1}.import-modal-footer{border-top:1px solid var(--border);background:var(--bg-secondary);flex-shrink:0;justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.import-footer-hints{color:var(--text-muted);font-size:12px}.import-footer-hints strong{color:var(--text);background:var(--bg-tertiary);border:1px solid var(--border);border-radius:4px;padding:2px 6px;font-family:JetBrains Mono,Consolas,monospace;font-weight:500}.import-footer-actions{gap:8px;display:flex}.ref-image-bar{z-index:50;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-xl);animation:fadeIn .15s var(--ease-out);-webkit-user-select:none;user-select:none;align-items:center;gap:8px;padding:4px 10px;display:flex;position:absolute;top:12px;left:50%;transform:translate(-50%);box-shadow:0 8px 24px #0000001f,0 2px 6px #0000000f}[data-theme=dark] .ref-image-bar{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-color:var(--border-strong);background:#1e1e1ee6;box-shadow:0 8px 28px #00000059}.ref-image-info{color:var(--text-secondary);align-items:center;gap:6px;max-width:140px;font-size:11px;font-weight:500;display:flex}.ref-image-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.ref-image-sep{background:var(--border);flex-shrink:0;width:1px;height:16px}.ref-bar-btn{border-radius:var(--radius-sm);width:24px;height:24px;color:var(--text-secondary);justify-content:center;align-items:center;padding:3px 6px;display:flex}.ref-bar-btn.active{color:var(--accent);background:var(--bg-hover)}.ref-slider-wrap{align-items:center;gap:6px;display:flex}.ref-slider-label{color:var(--text-muted);text-align:right;min-width:32px;font-family:JetBrains Mono,Consolas,monospace;font-size:11px}.ref-slider{width:72px;height:4px;accent-color:var(--accent);cursor:pointer}.ref-fit-btn{border-radius:var(--radius-sm);height:24px;color:var(--text-secondary);background:var(--bg-secondary);border:1px solid var(--border);padding:2px 8px;font-family:JetBrains Mono,Consolas,monospace;font-size:11px}.ref-fit-btn:hover{color:var(--text);border-color:var(--border-strong)}.ref-remove-btn:hover{color:var(--danger)!important;background:#dc26261a!important}.canvas-drop-overlay{z-index:80;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);pointer-events:none;animation:fadeIn .15s var(--ease-out);background:#0066ff14;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.canvas-drop-box{border:2px dashed var(--accent);border-radius:var(--radius-xl);background:var(--bg);color:var(--accent);flex-direction:column;align-items:center;gap:8px;padding:28px 40px;display:flex;box-shadow:0 16px 40px #00000026}.canvas-drop-title{color:var(--text);font-size:14px;font-weight:600}.canvas-drop-subtitle{color:var(--text-muted);font-size:12px}.tool-btn{position:relative}.tool-btn-dot{background:var(--accent);width:6px;height:6px;box-shadow:0 0 5px var(--accent);border-radius:50%;position:absolute;top:5px;right:5px}.canvas-live-text{filter:drop-shadow(0 1px 2px #0006);-webkit-user-select:none;user-select:none}.type-style-selector{gap:4px;display:flex}.type-style-btn{text-align:center;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg);color:var(--text-secondary);cursor:pointer;flex:1;padding:5px 2px;font-size:11px;transition:all .15s}.type-style-btn:hover{border-color:var(--border-strong);color:var(--text)}.type-style-btn.active{border-color:var(--color-text-elem,#d97706);color:var(--color-text-elem,#d97706);background:#d977061f;font-weight:700}.typo-options-row{align-items:center;gap:6px;display:flex}.typo-btn-group{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-secondary);display:flex;overflow:hidden}.typo-sub-btn{color:var(--text-secondary);cursor:pointer;border:none;border-right:1px solid var(--border);background:0 0;padding:4px 7px;font-family:JetBrains Mono,Consolas,monospace;font-size:11px}.typo-sub-btn:last-child{border-right:none}.typo-sub-btn:hover{color:var(--text);background:var(--bg-hover)}.typo-sub-btn.active{background:var(--color-text-elem,#d97706);color:#fff;font-weight:700}.typo-prompt-helper-btn{width:100%;color:var(--color-text-elem,#d97706);border:1px dashed var(--border-strong);border-radius:var(--radius-sm);justify-content:center;margin-top:6px;padding:5px 8px;font-size:11px}.typo-prompt-helper-btn:hover{border-color:var(--color-text-elem,#d97706);color:var(--color-text-elem,#d97706);background:#d9770614}.library-page-view{background:var(--bg);flex:1;justify-content:center;padding:36px 28px 60px;display:flex;overflow-y:auto}.library-page-inner{flex-direction:column;gap:24px;width:100%;max-width:1060px;display:flex}.library-page-header{border-bottom:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:20px;padding-bottom:20px;display:flex}.library-page-title-wrap{flex-direction:column;gap:4px;display:flex}.library-page-title{color:var(--text);letter-spacing:-.02em;font-size:24px;font-weight:800}.library-page-subtitle{color:var(--text-muted);max-width:620px;font-size:13px;line-height:1.45}.library-page-header-actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.library-save-btn{border-radius:var(--radius-sm);padding:7px 14px;font-size:12px;font-weight:600}.library-action-btn{border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-secondary);padding:7px 12px;font-size:12px}.library-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;display:flex}.library-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;display:grid}.library-card{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--bg);cursor:pointer;transition:transform .15s var(--ease-spring), box-shadow .15s, border-color .15s;flex-direction:column;display:flex;overflow:hidden}.library-card:hover{border-color:var(--border-strong);transform:translateY(-2px);box-shadow:0 8px 24px #00000017}.library-card-preview{background:#080b14;justify-content:center;align-items:center;height:148px;padding:12px;display:flex;position:relative;overflow:hidden}.library-card-body{flex-direction:column;flex:1;gap:6px;padding:14px 16px;display:flex}.library-card-header{justify-content:space-between;align-items:center;gap:8px;display:flex}.library-card-name{color:var(--text);text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:700;overflow:hidden}.library-card-delete-btn{cursor:pointer;opacity:.4;background:0 0;border:none;border-radius:4px;padding:2px 5px;font-size:13px;transition:all .12s}.library-card-delete-btn:hover{opacity:1;color:var(--danger);background:#dc26261a}.library-card-desc{color:var(--text-secondary);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-top:2px;font-size:11px;line-height:1.4;display:-webkit-box;overflow:hidden}.library-card-footer{margin-top:auto;padding-top:10px}.library-btn-load{background:var(--bg-secondary);width:100%;color:var(--text);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;text-align:center;padding:7px 12px;font-size:11px;font-weight:600;transition:all .12s}.library-card:hover .library-btn-load{background:var(--accent);color:#fff;border-color:var(--accent)}.library-empty-view{text-align:center;background:var(--bg-secondary);border-radius:var(--radius-xl);border:1.5px dashed var(--border);flex-direction:column;justify-content:center;align-items:center;gap:12px;margin-top:12px;padding:64px 20px;display:flex}.library-empty-actions{gap:10px;margin-top:12px;display:flex}.vision-modal{flex-direction:column;width:95vw;max-width:1060px;height:88vh;max-height:840px;display:flex}.vision-header-sparkle{color:#f59e0b;filter:drop-shadow(0 0 6px #f59e0b80);font-size:18px}.vision-modal-body{flex-direction:column;flex:1;min-height:0;padding:16px 20px;display:flex;overflow-y:auto}.vision-upload-view{flex-direction:column;gap:18px;height:100%;display:flex}.vision-dropzone{border:2px dashed var(--border);border-radius:var(--radius-lg);background:var(--bg-secondary);text-align:center;cursor:pointer;flex-direction:column;justify-content:center;align-items:center;padding:36px 20px;transition:all .15s;display:flex}.vision-dropzone:hover{border-color:var(--accent);background:var(--bg-hover);transform:translateY(-1px)}.vision-dropzone-icon{color:var(--accent);opacity:.9;margin-bottom:12px}.vision-dropzone-title{color:var(--text);margin-bottom:4px;font-size:15px;font-weight:600}.vision-dropzone-sub{color:var(--text-secondary);font-size:12px}.vision-current-ref-bar{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);justify-content:space-between;align-items:center;gap:16px;min-width:0;padding:12px 16px;display:flex}.vision-current-ref-info{flex:1;align-items:center;gap:10px;min-width:0;display:flex;overflow:hidden}.vision-current-ref-tag{text-transform:uppercase;background:var(--accent-subtle);color:var(--accent);border-radius:4px;flex-shrink:0;padding:3px 8px;font-size:10px;font-weight:700}.vision-current-ref-name{color:var(--text);white-space:nowrap;text-overflow:ellipsis;min-width:0;font-size:13px;font-weight:500;overflow:hidden}.vision-current-ref-btn{white-space:nowrap;flex-shrink:0}.vision-samples-section{flex-direction:column;gap:12px;display:flex}.vision-samples-header{flex-direction:column;gap:2px;display:flex}.vision-samples-title{color:var(--text);font-size:13px;font-weight:600}.vision-samples-desc{color:var(--text-secondary);font-size:11px}.vision-samples-grid{grid-template-columns:repeat(3,1fr);gap:14px;display:grid}.vision-sample-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;flex-direction:column;transition:all .15s;display:flex;overflow:hidden}.vision-sample-card:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:0 4px 12px #00000014}.vision-sample-thumb-wrap{background:#090b10;justify-content:center;align-items:center;height:120px;display:flex;position:relative;overflow:hidden}.vision-sample-thumb{object-fit:contain;width:100%;height:100%}.vision-sample-ratio-badge{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#fff;background:#000000bf;border-radius:4px;padding:2px 6px;font-family:JetBrains Mono,monospace;font-size:10px;font-weight:600;position:absolute;top:8px;right:8px}.vision-sample-meta{padding:10px 12px}.vision-sample-name{color:var(--text);font-size:13px;font-weight:600}.vision-sample-sub{color:var(--text-secondary);gap:6px;margin-top:4px;font-size:11px;display:flex}.vision-analyzing-view{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;padding:40px 20px;display:flex}.vision-radar-box{border:2px solid var(--accent);width:170px;height:170px;box-shadow:0 0 24px var(--accent-subtle);border-radius:14px;margin-bottom:24px;position:relative;overflow:hidden}.vision-radar-image{object-fit:contain;filter:brightness(.7);width:100%;height:100%}.vision-radar-scanner{background:linear-gradient(90deg,#0000,#00f0ff,#fff,#00f0ff,#0000);height:3px;animation:1.8s ease-in-out infinite alternate radarScan;position:absolute;top:0;left:0;right:0;box-shadow:0 0 12px #00f0ff}@keyframes radarScan{0%{transform:translateY(0)}to{transform:translateY(167px)}}.vision-analyzing-title{color:var(--text);margin-bottom:8px;font-size:16px;font-weight:700}.vision-analyzing-status{color:var(--text-secondary);max-width:480px;margin-bottom:24px;font-size:13px}.vision-analyzing-steps{align-items:center;gap:10px;display:flex}.vision-step-badge{background:var(--bg-secondary);color:var(--text-muted);border:1px solid var(--border);border-radius:999px;padding:4px 10px;font-size:11px}.vision-step-badge.active{background:var(--accent-subtle);color:var(--accent);border-color:var(--accent);font-weight:600}.vision-step-arrow{color:var(--text-muted);font-size:12px}.vision-preview-view{flex-direction:column;gap:12px;height:100%;display:flex}.vision-info-banner{border-radius:var(--radius-md);color:#f59e0b;background:#f59e0b1a;border:1px solid #f59e0b4d;align-items:center;gap:8px;padding:8px 12px;font-size:11px;display:flex}.vision-preview-grid{flex:1;grid-template-columns:1fr 1.15fr;gap:18px;min-height:0;display:grid}.vision-viewport-col{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-lg);flex-direction:column;gap:10px;padding:12px;display:flex;overflow:hidden}.vision-viewport-header{justify-content:space-between;align-items:center;display:flex}.vision-col-title{color:var(--text);text-transform:uppercase;letter-spacing:.5px;font-size:12px;font-weight:600}.vision-canvas-container{border-radius:var(--radius-md);background:#090a0f;border:1px solid #ffffff14;justify-content:center;align-items:center;width:100%;max-height:480px;margin:auto;display:flex;position:relative;overflow:hidden}.vision-canvas-img{object-fit:contain;width:100%;height:100%;display:block}.vision-canvas-svg{pointer-events:auto;width:100%;height:100%;position:absolute;inset:0}.vision-svg-box-group{cursor:pointer}.vision-svg-box{transition:all .12s}.vision-viewport-footer{justify-content:center;align-items:center;gap:16px;padding-top:4px;display:flex}.vision-legend-item{color:var(--text-secondary);align-items:center;gap:6px;font-size:11px;display:flex}.legend-dot{border-radius:50%;width:8px;height:8px}.legend-dot.obj{background:#3b82f6}.legend-dot.text{background:#f59e0b}.legend-dot.bg{background:#10b981}.vision-details-col{flex-direction:column;gap:12px;min-height:0;display:flex;overflow:hidden}.vision-desc-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);padding:10px 14px}.vision-desc-label{text-transform:uppercase;color:var(--text-muted);letter-spacing:.5px;margin-bottom:4px;font-size:10px;font-weight:700}.vision-desc-text{color:var(--text);font-size:12px;font-style:italic;line-height:1.45}.vision-palette-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);padding:10px 14px}.vision-card-header{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.vision-card-title{color:var(--text);font-size:11px;font-weight:600}.vision-card-sub{color:var(--text-muted);font-size:10px}.vision-palette-strip{gap:6px;height:32px;display:flex}.vision-palette-chip{cursor:pointer;border-radius:6px;flex:1;justify-content:center;align-items:center;transition:transform .12s;display:flex;box-shadow:0 1px 3px #0003}.vision-palette-chip:hover{transform:translateY(-2px)scale(1.02)}.vision-palette-chip-hex{color:#fff;text-shadow:0 1px 2px #000000d9;font-family:JetBrains Mono,monospace;font-size:9px;font-weight:700}.vision-tabs-bar{background:var(--bg-secondary);border-radius:var(--radius-md);border:1px solid var(--border);gap:4px;padding:4px;display:flex}.vision-tab-btn{border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;background:0 0;border:none;flex:1;padding:6px 10px;font-size:11px;font-weight:600;transition:all .12s}.vision-tab-btn.active{background:var(--bg);color:var(--accent);box-shadow:0 1px 3px #00000014}.vision-tab-content{flex:1;min-height:0;overflow-y:auto}.vision-elements-list{flex-direction:column;gap:8px;display:flex}.vision-element-row{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;flex-direction:column;gap:6px;padding:10px 12px;transition:all .12s;display:flex}.vision-element-row:hover,.vision-element-row.hovered{border-color:var(--accent);background:var(--bg-hover);transform:translate(2px)}.vision-elem-header{justify-content:space-between;align-items:center;display:flex}.vision-elem-badge{border-radius:4px;padding:2px 6px;font-size:9px;font-weight:700}.vision-elem-badge.type-obj{color:#3b82f6;background:#3b82f626}.vision-elem-badge.type-text{color:#f59e0b;background:#f59e0b26}.vision-elem-badge.type-bg{color:#10b981;background:#10b98126}.vision-elem-coords{color:var(--text-muted);font-family:JetBrains Mono,monospace;font-size:10px}.vision-elem-text-box{background:#f59e0b14;border-left:2px solid #f59e0b;border-radius:2px;align-items:center;gap:6px;padding:4px 8px;font-size:11px;display:flex}.vision-text-label{color:#f59e0b;font-weight:600}.vision-text-val{color:var(--text);font-weight:700}.vision-elem-desc{color:var(--text-secondary);font-size:11px;line-height:1.4}.vision-elem-palette{gap:4px;display:flex}.vision-mini-swatch{border-radius:3px;width:14px;height:14px;box-shadow:0 1px 2px #0003}.vision-style-view{flex-direction:column;gap:10px;display:flex}.vision-style-prop{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);padding:8px 12px}.vision-style-prop label{text-transform:uppercase;color:var(--text-muted);margin-bottom:3px;font-size:10px;font-weight:700;display:block}.vision-style-prop p{color:var(--text);margin:0;font-size:11px;line-height:1.4}.vision-json-view{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);flex-direction:column;height:100%;padding:10px;display:flex;position:relative}.vision-json-toolbar{justify-content:flex-end;margin-bottom:6px;display:flex}.vision-json-code{color:var(--text);flex:1;margin:0;font-family:JetBrains Mono,monospace;font-size:11px;line-height:1.4;overflow:auto}.vision-modal-footer{border-top:1px solid var(--border);justify-content:space-between;align-items:center;padding:12px 20px;display:flex}