:root{--tool-accent: #0f0f0f;--tool-accent-hover: #333;--tool-bg: #ffffff;--tool-bg-off: #f8f9fa;--tool-bg-secondary: #f3f4f6;--tool-bg-tertiary: #e5e7eb;--tool-text: #1f2937;--tool-text-muted: #4b5563;--tool-text-faint: #6b7280;--tool-border: #e5e7eb;--tool-border-dark: #d1d5db;--tool-danger: #ef4444;--tool-danger-bg: #fee2e2;--tool-success: #22c55e;--tool-success-bg: #dcfce7;--tool-info: #3b82f6;--xml-tag: #8b5cf6;--xml-attr: #f59e0b;--xml-value: #10b981;--xml-comment: #9ca3af;--xml-text: #1f2937}html.theme-dark{--tool-bg: #0a0a0a;--tool-bg-off: #111111;--tool-bg-secondary: #1a1a1a;--tool-bg-tertiary: #222222;--tool-text: #e0e0e0;--tool-text-muted: #b0b0b0;--tool-text-faint: #808080;--tool-border: #272727;--tool-border-dark: #333333;--tool-danger-bg: #450a0a;--tool-success-bg: #14532d;--xml-tag: #a78bfa;--xml-attr: #fbbf24;--xml-value: #34d399;--xml-comment: #6b7280;--xml-text: #e0e0e0}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:Anek Devanagari,sans-serif;background:var(--tool-bg);color:var(--tool-text);min-height:100vh;font-size:14px}.xf-main{width:100%;max-width:1600px;margin:0 auto;padding:20px 16px 60px}.page-intro{margin-bottom:24px}.page-intro h1{font-size:24px;font-weight:700;color:var(--tool-text);margin-bottom:6px}.page-intro h1 img{vertical-align:middle;margin-right:8px}.page-intro h1 .tag{font-family:monospace;font-size:12px;vertical-align:middle}.page-intro p{font-size:15px;color:var(--tool-text-muted);line-height:1.6;max-width:800px}.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:6px;border:1.5px solid var(--tool-border-dark);background:var(--tool-bg);color:var(--tool-text);font-size:13px;font-weight:500;cursor:pointer;transition:all .15s;font-family:inherit}.btn:focus{outline:2px solid var(--tool-accent);outline-offset:2px}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--tool-accent);border-color:var(--tool-accent);color:var(--tool-bg)}.btn-primary:hover:not(:disabled){background:var(--tool-accent-hover);border-color:var(--tool-accent-hover)}html.theme-dark .btn-primary{color:#fff}.btn:hover:not(:disabled){background:var(--tool-bg-secondary);border-color:var(--tool-accent)}.btn.active{background:var(--tool-bg-secondary);border-color:var(--tool-accent);color:var(--tool-text);font-weight:600;box-shadow:0 0 0 1px var(--tool-accent)}.btn-sm{padding:5px 10px;font-size:12px}.btn-icon{padding:5px 8px;font-size:13px;border-radius:4px}.toolbar{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:12px;background:var(--tool-bg-off);border:1px solid var(--tool-border);border-radius:8px;padding:12px;align-items:center;justify-content:space-between}.toolbar-group{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.select select{background-color:var(--tool-bg);color:var(--tool-text);border:1px solid var(--tool-border-dark);border-radius:6px;padding:4px 8px;font-size:13px;font-family:inherit;cursor:pointer}.select select:focus{border-color:var(--tool-accent);outline:none}.select select option{background-color:var(--tool-bg);color:var(--tool-text)}.workspace{display:grid;grid-template-columns:1fr 1fr;gap:20px;height:65vh;min-height:450px;margin-bottom:24px;width:100%;box-sizing:border-box}.panel{display:flex;flex-direction:column;border:1px solid var(--tool-border-dark);border-radius:8px;overflow:hidden;background:var(--tool-bg);position:relative;height:100%;width:100%;min-width:0;min-height:0;box-sizing:border-box}.panel.has-content .empty-state{display:none}.panel-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:var(--tool-bg-off);border-bottom:1px solid var(--tool-border);font-size:13px;font-weight:600;color:var(--tool-text);flex-shrink:0;min-height:50px;box-sizing:border-box}#outputTabs span{transition:color .15s;color:var(--tool-text-muted)}#outputTabs span:hover{color:var(--tool-text)}#outputTabs span.active{color:var(--tool-accent)!important;font-weight:700;border-bottom:2px solid var(--tool-accent);padding-bottom:2px}.editor-area{flex:1;width:100%;min-width:0;min-height:0;resize:none;border:none;outline:none;padding:16px;font-family:Space Mono,monospace;font-size:13px;line-height:1.5;background:transparent;color:inherit;overflow-y:auto;overflow-x:hidden}.editor-with-lines{display:flex;flex:1;min-height:0;overflow:hidden}.line-numbers{padding:16px 8px 16px 12px;font-family:Space Mono,monospace;font-size:13px;line-height:1.5;color:var(--tool-text-faint);background:var(--tool-bg-off);text-align:right;user-select:none;overflow-y:hidden;min-width:40px;max-width:50px;border-right:1px solid var(--tool-border);flex-shrink:0}.line-numbers span{display:block;height:19.5px}.editor-wrapper{flex:1;display:flex;flex-direction:column;min-width:0;overflow:hidden}.editor-with-lines .editor-area{flex:1;overflow:auto}.output-with-lines{display:flex;flex:1;min-height:0;overflow:hidden}.output-with-lines .output-container{flex:1;overflow:auto}.output-container{flex:1;padding:16px;overflow:auto;overflow-x:hidden;font-family:Space Mono,monospace;font-size:13px;line-height:1.5;min-width:0;min-height:0}pre.syntax-highlighted{margin:0;white-space:pre-wrap;word-wrap:break-word}.xml-tag{color:var(--xml-tag);font-weight:500}.xml-attr{color:var(--xml-attr)}.xml-value{color:var(--xml-value)}.xml-comment{color:var(--xml-comment);font-style:italic}.xml-text{color:var(--xml-text)}.xml-punct{color:var(--tool-text-faint)}.tree-view{font-family:Space Mono,monospace;font-size:13px;line-height:1.5}.tree-node{padding-left:20px;position:relative}.tree-toggle{position:absolute;left:0;top:2px;cursor:pointer;color:var(--tool-text-muted);width:16px;text-align:center;user-select:none;font-size:10px}.tree-toggle:hover{color:var(--tool-text)}.tree-toggle.collapsed{transform:rotate(-90deg)}.tree-content.collapsed{display:none}.tree-key{color:var(--xml-tag);font-weight:500;margin-right:4px}.tree-punct{color:var(--tool-text-faint)}.error-banner{background-color:var(--tool-danger-bg);border-left:4px solid var(--tool-danger);color:var(--tool-text);padding:12px 16px;border-radius:4px;margin-bottom:16px;font-family:Space Mono,monospace;font-size:12px;display:flex;justify-content:space-between;align-items:start}.file-overlay{position:absolute;inset:0;background:var(--tool-bg-off);border:2px dashed var(--tool-accent);z-index:10;display:flex;flex-direction:column;align-items:center;justify-content:center}.tabs{display:flex;border-bottom:1px solid var(--tool-border);margin-bottom:16px}.tab{padding:8px 16px;cursor:pointer;font-size:13px;font-weight:600;color:var(--tool-text-muted);border-bottom:2px solid transparent;margin-bottom:-1px}.tab.active{color:var(--tool-text);border-bottom-color:var(--tool-accent)}.success-banner{background-color:var(--tool-success-bg);border-left:4px solid var(--tool-success);color:var(--tool-text);padding:12px 16px;border-radius:4px;margin-bottom:16px;font-family:Space Mono,monospace;font-size:12px}.error-banner .dismiss-btn{background:transparent;border:none;color:var(--tool-text-muted);cursor:pointer;padding:4px;font-size:14px;line-height:1}.error-banner .dismiss-btn:hover{color:var(--tool-text)}.hidden{display:none!important}.empty-state{position:absolute;inset:50px 0 0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--tool-text-muted);text-align:center;padding:32px;background:var(--tool-bg);z-index:5;pointer-events:none}.empty-state-icon{font-size:32px;margin-bottom:12px;opacity:.5;pointer-events:auto}.empty-state-text{font-size:14px;line-height:1.5;pointer-events:auto}.tab.active{color:var(--tool-text)!important;border-bottom-color:var(--tool-accent)}.tab{cursor:pointer;transition:color .15s;color:var(--tool-text-muted)!important}.tab:hover{color:var(--tool-text)!important}.modal-overlay{position:fixed;inset:0;background:#00000073;z-index:2000;display:flex;align-items:center;justify-content:center;padding:20px}.modal-overlay.hidden{display:none!important}.modal-box{background:var(--tool-bg);border:1px solid var(--tool-border);border-radius:12px;width:100%;max-width:720px;max-height:85vh;display:flex;flex-direction:column;box-shadow:0 24px 64px #0000002e}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--tool-border);background:var(--tool-bg);border-radius:12px 12px 0 0}.modal-header h2{font-size:15px;font-weight:700}.modal-body{padding:20px;display:block;overflow-y:auto}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px}.stats-card{background:var(--tool-bg-off);border:1px solid var(--tool-border);border-radius:8px;padding:14px;text-align:center}.stats-card .sc-value{font-size:24px;font-weight:800;color:var(--tool-text)}.stats-card .sc-label{font-size:11px;color:var(--tool-text-muted);margin-top:2px;text-transform:uppercase;letter-spacing:.5px}.type-table{width:100%;border-collapse:collapse;font-size:12px;margin-bottom:20px}.type-table th,.type-table td{padding:6px 10px;text-align:left;border-bottom:1px solid var(--tool-border)}.type-table th{font-weight:700;color:var(--tool-text-faint);text-transform:uppercase;font-size:10px;letter-spacing:.4px}.type-table tr:last-child td{border-bottom:none}@media(max-width:768px){.workspace{grid-template-columns:1fr}.stats-grid{grid-template-columns:repeat(2,1fr)}}
