*{box-sizing:border-box;margin:0;padding:0}:root{--bg: #1a1a1a;--panel: #2a2a2a;--panel-2: #333;--border: #404040;--text: #e0e0e0;--text-muted: #888;--accent: #4fc3f7;--accent-hover: #29b6f6;--button-text: #1a1a1a;--button-disabled: #7a7a7a;--input-bg: #404040;--input-border: #555;--preview-bg: #2a2a2a;--danger: #f44336;--danger-hover: #ff6b6b;--success: #4caf50;--success-hover: #3e8e41;--error-bg: #330000;--error-border: #660000;--highlight: #00ffff;--highlight-shadow-1: #00ffffaa;--highlight-shadow-2: #00ffff55;--highlight-red: #ff4d4f;--highlight-yellow: #ffff00}body.theme-light{--bg: #f4f6f8;--panel: #ffffff;--panel-2: #f0f2f5;--border: #d0d7de;--text: #1b1f24;--text-muted: #57606a;--accent: #0ea5e9;--accent-hover: #0284c7;--button-text: #0b1220;--button-disabled: #b7bec7;--input-bg: #ffffff;--input-border: #cfd8dc;--preview-bg: #ffffff;--danger: #d32f2f;--danger-hover: #ef5350;--success: #2e7d32;--success-hover: #1b5e20;--error-bg: #fde8e8;--error-border: #f8b4b4;--highlight: #00a6c7;--highlight-shadow-1: #00a6c7aa;--highlight-shadow-2: #00a6c755;--highlight-red: #d32f2f;--highlight-yellow: #f9a825}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:var(--bg);color:var(--text);height:100vh;overflow:hidden}.header{background:var(--panel);padding:.8rem 1rem;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;gap:1rem}.header-left{display:flex;align-items:center;gap:.8rem}.menu-toggle{background:var(--panel-2);color:var(--text);border:1px solid var(--border);border-radius:6px;padding:.35rem;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;margin-right:0;font-size:.9rem}.menu-toggle:hover{background:var(--accent-hover);color:var(--button-text)}.theme-toggle{background:var(--panel-2);color:var(--text);border:1px solid var(--border);font-size:.85rem;padding:.3rem .6rem;border-radius:4px;cursor:pointer}.theme-toggle:hover{background:var(--accent-hover);color:var(--button-text)}.title{font-size:1.5rem;font-weight:600;color:var(--accent);display:flex;align-items:center;gap:.8rem}.logo{height:32px;width:32px}.stats{display:flex;gap:2rem;font-size:.9rem}.stat{display:flex;flex-direction:column;align-items:center}.stat-label{color:var(--text-muted);font-size:.8rem}.stat-value{font-weight:600;color:var(--accent)}.controls{display:flex;flex-direction:column;gap:1rem;width:100%}.option-section{display:flex;flex-direction:column;gap:.6rem;padding:.6rem;background:var(--panel-2);border:1px solid var(--border);border-radius:8px}.section-title{font-size:.85rem;font-weight:600;color:var(--text-muted);letter-spacing:.02em;text-transform:uppercase}.file-input{position:relative;display:inline-block}.file-input input[type=file]{position:absolute;left:-9999px}.controls>button{height:40px}button,.file-button{background:var(--accent);color:var(--button-text);border:none;padding:.4rem .8rem;margin-right:10px;border-radius:4px;font-weight:600;transition:background .2s;font-size:18px;cursor:pointer}.icon{width:18px;height:18px;display:inline-block}.app-shell{display:flex;height:100vh;width:100%}.sidebar{width:320px;background:var(--panel);border-right:1px solid var(--border);display:flex;flex-direction:column;transition:width .2s ease;overflow:hidden}.sidebar.collapsed{width:0;border-right:0}.sidebar-inner{display:flex;flex-direction:column;height:100%;padding:1rem;gap:1rem;overflow-y:auto}.sidebar.collapsed .sidebar-inner{opacity:0;pointer-events:none}.sidebar-section{display:flex;flex-direction:column;gap:.6rem}.sidebar-footer{margin-top:auto;display:flex;flex-direction:column;gap:.6rem;padding-top:.6rem;border-top:1px solid var(--border)}.action-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}.action-button{background:var(--panel-2);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:.5rem .6rem;display:inline-flex;align-items:center;gap:.5rem;font-size:.9rem;font-weight:600;cursor:pointer;text-decoration:none;margin-right:0}.action-button.primary{background:var(--accent);color:var(--button-text);border-color:var(--accent)}.action-button.file-button{background:var(--panel-2);color:var(--text);border:1px solid var(--border)}.action-button:hover{background:var(--accent-hover);color:var(--button-text)}.action-button:disabled{background:var(--panel-2);color:var(--text-muted);border-color:var(--border);cursor:not-allowed}.app-main{flex:1;min-width:0;display:flex;flex-direction:column}label.file-button{padding:.6rem .8rem}button{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:larger}button:disabled{background:var(--button-disabled)!important;cursor:text}button:hover,.file-button:hover{background:var(--accent-hover)}.option-group{display:flex;flex-wrap:wrap;gap:1rem;align-items:center}.grouping-label{color:var(--text-muted);font-weight:600}.grouping-option{cursor:pointer}.grouping-option input{margin-right:.35rem}.checkbox-group{display:flex;align-items:center;gap:.5rem}.precision-row label{min-width:90px;text-align:right}.checkbox-group input[type=checkbox],.checkbox-group input[type=radio]{accent-color:var(--accent)}.number-input{width:60px;background:var(--input-bg);border:1px solid var(--input-border);color:var(--text);padding:.25rem .5rem;border-radius:4px}.dimension-input{width:80px;background:var(--input-bg);border:1px solid var(--input-border);color:var(--text);padding:.25rem .5rem;border-radius:4px}@media(orientation:portrait){.main-content{flex-direction:column}.dragbar{width:100%;height:6px;cursor:row-resize}}.editor-panel,.preview-panel{flex:1;display:flex;flex-direction:column}.panel-header{background:var(--panel-2);padding:.5rem 1rem;font-weight:600;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;height:42px}.editor-actions{display:flex;gap:.5rem;align-items:center}.view-toggle{background:var(--panel-2);color:var(--text);border:1px solid var(--border);padding:.25rem .6rem;border-radius:4px;cursor:pointer;font-size:.85rem;display:inline-flex;align-items:center;gap:.35rem}.view-toggle.active{background:var(--accent);color:var(--button-text);border-color:var(--accent)}.copy-btn{padding:.25rem .6rem;font-size:.85rem;display:inline-flex;align-items:center;gap:.35rem}.editor-hidden{display:none}.editor-loading{padding:1rem;color:var(--text-muted)}.download-btn{background:var(--success);color:#fff;border:none;padding:.25rem .75rem;border-radius:4px;cursor:pointer;font-size:.8rem}.download-btn:hover{background:var(--success-hover)}.editor-container{flex:1;position:relative;padding-top:10px;overflow:hidden}.editor-container #editor{position:absolute;inset:10px 0 0}.monaco-editor .lineHighlight,.monaco-editor .lineHighlightBorder{background:transparent!important;border:none!important}.monaco-editor .scroll-decoration{box-shadow:none!important}.preview-container{flex:1;padding:1rem;overflow:auto;background:var(--preview-bg);display:flex;align-items:center;justify-content:center;min-height:0}.preview-controls{display:flex;gap:.5rem;align-items:center}.preview-placeholder{color:var(--text-muted);font-size:.95rem;text-align:center;padding:1rem}.svg-preview{max-width:100%;max-height:100%;border:1px solid var(--border);background:var(--preview-bg)}.error{color:var(--danger);padding:1rem;background:var(--error-bg);border:1px solid var(--error-border);border-radius:4px;margin:1rem}.drop-zone{border:2px dashed var(--accent);border-radius:8px;padding:2rem;text-align:center;margin:1rem;background:var(--panel);transition:all .2s}.drop-zone.dragover{background:var(--panel-2);border-color:var(--accent-hover)}.reduction-indicator{font-weight:600}.reduction-positive{color:var(--success)}.reduction-negative{color:var(--danger)}.svg-preview{transform-origin:center center;transition:transform .2s ease-in-out}.preview-container>svg,.preview-container .preview-svg{display:block;max-width:100%;max-height:100%;border:1px solid var(--border);background:var(--preview-bg)}.preview-container>svg.preview-svg-auto-size,.preview-container .preview-svg.preview-svg-auto-size{width:100%;height:100%}.main-content{display:flex;flex:1;min-height:0}.dragbar{z-index:10;width:6px;cursor:col-resize;background:var(--border);flex:0 0 6px;align-self:stretch}#left-panel,#right-panel{overflow:hidden;min-height:0}.tree-view{position:absolute;inset:0;padding:1rem 0;background:var(--panel-2);color:var(--text);font-family:Courier New,Courier,monospace;font-size:.9rem;-webkit-user-select:none;user-select:none;white-space:nowrap;scrollbar-color:var(--input-border) var(--panel-2)}.tree-content{overflow-y:auto;overflow-x:hidden;max-height:100%}.tree-view::-webkit-scrollbar{width:12px;height:12px}.tree-view::-webkit-scrollbar-track{background:var(--panel-2)}.tree-view::-webkit-scrollbar-thumb{background:var(--input-border);border-radius:6px;border:2px solid var(--panel-2)}.tree-view::-webkit-scrollbar-thumb:hover{background:var(--accent)}.tree-view::-webkit-scrollbar-corner{background:var(--panel-2)}.tree-node-wrapper{position:relative;width:max-content;min-width:100%}.tree-node-header{display:flex;flex-wrap:nowrap;align-items:center;gap:.5rem;cursor:pointer;border-radius:4px;transition:background .2s;white-space:nowrap;width:100%;position:relative}.tree-node-header:hover{background:var(--panel-2)}.tree-node-header.selected{background:var(--panel-2);border-color:var(--accent)}.tree-node-header.drag-over{border:2px dashed var(--accent);background:var(--panel-2)}.tree-prefix{color:var(--text-muted);white-space:pre;flex-shrink:0}.tag-name{color:var(--accent);font-weight:600;flex-shrink:0}.attributes{display:flex;flex-wrap:nowrap;gap:.4rem;flex-grow:1;align-items:center;padding-right:4rem}.attribute{display:inline-flex;align-items:center;gap:.2rem;font-size:.8rem;flex-shrink:0;position:relative}.attr-name{color:var(--accent)}.attr-value-container{position:relative;display:inline-flex;align-items:center}.attr-value{color:var(--text);border:none;background:#ffffff0d;padding:0 4px;border-radius:2px;max-width:200px;text-overflow:ellipsis;white-space:nowrap;cursor:text;font-family:inherit;font-size:inherit;box-sizing:content-box}.attr-value:focus{background:var(--panel-2);outline:1px solid var(--accent);max-width:none;z-index:10}.attr-value-full{display:none;position:absolute;top:100%;left:0;background:var(--panel-2);color:var(--text);padding:.5rem;border:1px solid var(--accent);border-radius:4px;z-index:100;max-width:400px;word-break:break-all;box-shadow:0 4px 10px #00000080;white-space:normal}.attr-value-container:hover .attr-value-full{display:block}.attr-remove{display:none;background:transparent;color:var(--text-muted);border:none;cursor:pointer;font-size:.7rem;padding:0 2px;line-height:1}.attribute:hover .attr-remove{display:inline-flex;color:var(--danger)}.attr-remove:hover{color:var(--danger-hover)}.node-controls{display:flex;gap:.2rem;margin-left:auto;padding-left:.5rem;padding-right:.5rem;position:sticky;right:0;background:var(--panel-2);z-index:5;opacity:0;transition:opacity .2s}.tree-node-header:hover .node-controls,.tree-node-header.selected .node-controls{background:var(--panel-2);opacity:1}.control-btn{background:var(--panel-2);color:var(--text);border:none;padding:.1rem .3rem;border-radius:2px;cursor:pointer;font-size:.7rem}.control-btn:hover{background:var(--accent)}.control-btn.danger{color:var(--danger)}.tree-node-header.text-node{color:var(--accent)}.attr-dialog-backdrop{position:fixed;inset:0;background:#0000008c;display:flex;align-items:center;justify-content:center;z-index:2000}.attr-dialog{background:var(--panel);color:var(--text);border:1px solid var(--border);border-radius:6px;padding:.8rem;width:320px;box-shadow:0 10px 30px #00000080;font-family:inherit}.attr-dialog-title{font-size:.9rem;font-weight:600;margin-bottom:.6rem;color:var(--accent)}.attr-dialog .field{display:flex;flex-direction:column;gap:.2rem;margin-bottom:.6rem;position:relative}.attr-dialog label{font-size:.75rem;color:var(--text-muted)}.attr-dialog input{background:var(--input-bg);border:1px solid var(--input-border);color:var(--text);padding:.35rem .45rem;border-radius:4px;font-size:.85rem}.attr-dialog input:focus{outline:1px solid var(--accent);border-color:var(--accent)}.attr-dialog .actions{display:flex;gap:.5rem;justify-content:flex-end;margin-top:.4rem}.attr-dialog .btn{background:var(--panel-2);color:var(--text);border:none;padding:.3rem .6rem;border-radius:4px;cursor:pointer;font-size:.8rem}.attr-dialog .btn.primary{background:var(--accent);color:var(--button-text);font-weight:600}.attr-suggestion-list{margin-top:.35rem;border:1px solid var(--input-border);border-radius:4px;background:var(--input-bg);max-height:160px;overflow-y:auto;display:flex;flex-direction:column;padding:.2rem;gap:.1rem}.attr-suggestion-item{background:transparent;color:var(--text);border:none;text-align:left;font-size:.8rem;padding:.3rem .4rem;border-radius:3px;margin-right:0}.attr-suggestion-item:hover,.attr-suggestion-item.selected{background:var(--accent);color:var(--button-text)}.highlighted-preview{fill:var(--highlight)!important;font-weight:700!important;cursor:pointer}.highlighted-preview{filter:drop-shadow(0 0 3px var(--highlight)) drop-shadow(0 0 8px var(--highlight-shadow-1)) drop-shadow(0 0 14px var(--highlight-shadow-2))}.highlighted-preview.white-outline{fill:#fff!important;paint-order:stroke fill;stroke:#000;stroke-width:2.8px;filter:drop-shadow(0 0 5px rgba(0,0,0,.7))}.highlighted-preview.red-alert{fill:var(--highlight-red)!important;filter:drop-shadow(0 0 4px var(--highlight-red)) drop-shadow(0 0 10px var(--highlight-shadow-1))}.highlighted-preview.yellow-pop{fill:var(--highlight-yellow)!important;filter:drop-shadow(0 0 6px var(--highlight-shadow-1))}text.highlighted-preview,.highlighted-preview text{fill:var(--highlight)!important;stroke:#000!important;stroke-width:2.5px!important;paint-order:stroke fill!important;font-weight:700!important}text.highlighted-preview.white-outline{fill:#fff!important;stroke:#000!important;stroke-width:3px!important;paint-order:stroke fill!important}
