:root{--bg:#09090b;--surface:#131316;--surface-2:#1c1c20;--border:#27272a;--border-hover:#3f3f46;--text:#fafafa;--text-muted:#a1a1aa;--text-dim:#71717a;--accent:#34d399;--accent-dim:#059669;--error:#ef4444;--error-bg:#2d1414;--radius:10px;--radius-sm:6px;--transition:.15s ease}*,:before,:after{box-sizing:border-box;margin:0;padding:0}[hidden]{display:none!important}html{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;-webkit-font-smoothing:antialiased}body{color:var(--text);background:var(--bg);min-height:100dvh;font-family:system-ui,-apple-system,sans-serif;line-height:1.5}#app{max-width:1200px;margin:0 auto;padding:1.5rem 1.25rem 3rem}header{text-align:center;padding:2rem 0 1.5rem}header h1{letter-spacing:-.03em;font-size:2.5rem;font-weight:800}.accent{color:var(--accent)}header p{color:var(--text-muted);margin-top:.35rem;font-size:.925rem}.tabs{border-bottom:1px solid var(--border);scrollbar-width:none;gap:.125rem;margin-bottom:1.5rem;display:flex;overflow-x:auto}.tabs::-webkit-scrollbar{display:none}.tab{color:var(--text-dim);cursor:pointer;white-space:nowrap;transition:color var(--transition), border-color var(--transition);background:0 0;border:none;border-bottom:2px solid #0000;padding:.6rem 1.25rem;font-family:inherit;font-size:.875rem;font-weight:500}.tab:hover{color:var(--text-muted)}.tab.active{color:var(--accent);border-bottom-color:var(--accent)}.panel{display:none}.panel.active{display:block}.panel-desc{color:var(--text-dim);margin-bottom:1.25rem;font-size:.85rem}.split{grid-template-columns:380px 1fr;align-items:start;gap:1.5rem;display:grid}@media (width<=860px){.split{grid-template-columns:1fr}}.controls{scrollbar-width:thin;scrollbar-color:var(--border) transparent;flex-direction:column;gap:.75rem;max-height:calc(100dvh - 200px);padding-right:.25rem;display:flex;overflow-y:auto}.section{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);overflow:hidden}.section summary{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:.5rem;padding:.6rem .9rem;font-size:.8rem;font-weight:600;list-style:none;display:flex}.section summary:before{content:"▸";transition:transform var(--transition);font-size:.7rem}.section[open] summary:before{transform:rotate(90deg)}.section summary::-webkit-details-marker{display:none}.field-grid{grid-template-columns:1fr 1fr;gap:.625rem;padding:.75rem .9rem;display:grid}.field-grid .field.full{grid-column:1/-1}.field{flex-direction:column;gap:.2rem;display:flex}.field.full{width:100%}.controls>.field{padding:0 .125rem}.field label{color:var(--text-dim);text-transform:uppercase;letter-spacing:.04em;font-size:.7rem;font-weight:600}.field input,.field select,.field textarea{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);transition:border-color var(--transition), box-shadow var(--transition);outline:none;width:100%;padding:.45rem .65rem;font-family:inherit;font-size:.85rem}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--accent-dim);box-shadow:0 0 0 2px #34d39914}.field textarea{resize:vertical;min-height:80px;font-family:SF Mono,Fira Code,monospace;font-size:.8rem}.field input::placeholder,.field textarea::placeholder{color:var(--text-dim);opacity:.6}.hint{color:var(--accent-dim);min-height:1rem;font-size:.72rem}.preview{flex-direction:column;gap:.75rem;display:flex;position:sticky;top:1.5rem}.output{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);min-height:260px;padding:1rem;font-family:SF Mono,Fira Code,monospace;font-size:.8rem;line-height:1.6;overflow:auto}.output .error{color:var(--error);background:var(--error-bg);border-radius:var(--radius-sm);text-align:center;word-break:break-word;width:100%;padding:.65rem 1rem;font-size:.85rem}.output table{border-collapse:collapse;width:100%}.output th,.output td{text-align:left;border-bottom:1px solid var(--border);white-space:nowrap;padding:.35rem .75rem;font-size:.8rem}.output th{color:var(--accent);text-transform:uppercase;letter-spacing:.03em;background:var(--surface);font-size:.75rem;font-weight:600;position:sticky;top:0}.output td{color:var(--text-muted)}.output td.num{text-align:right;font-variant-numeric:tabular-nums;color:#60a5fa}.output td.bool{color:#fbbf24}.output td.date{color:#c084fc}.output td.null{color:var(--text-dim);opacity:.5;font-style:italic}.output .meta{color:var(--text-dim);border-top:1px solid var(--border);margin-top:.5rem;padding:.5rem 0;font-size:.75rem}.actions{flex-wrap:wrap;gap:.5rem;display:flex}.btn{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);cursor:pointer;transition:background var(--transition), border-color var(--transition);padding:.45rem 1.1rem;font-family:inherit;font-size:.825rem;font-weight:500}.btn:hover{background:var(--surface-2);border-color:var(--border-hover)}.btn.primary{background:var(--accent-dim);border-color:var(--accent);color:#fff}.btn.primary:hover{background:var(--accent)}.btn:disabled{opacity:.4;cursor:not-allowed}.drop-zone{border:2px dashed var(--border);border-radius:var(--radius);text-align:center;color:var(--text-dim);transition:border-color var(--transition), background var(--transition);cursor:pointer;padding:2rem}.drop-zone:hover,.drop-zone.drag-over{border-color:var(--accent);background:#34d3990a}.drop-zone input[type=file]{display:none}.drop-zone p{font-size:.85rem}.drop-zone .icon{margin-bottom:.5rem;font-size:2rem}.stats{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.5rem;margin-bottom:1rem;display:grid}.stat{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);text-align:center;padding:.6rem .75rem}.stat .value{color:var(--accent);font-variant-numeric:tabular-nums;font-size:1.4rem;font-weight:700}.stat .label{color:var(--text-dim);text-transform:uppercase;letter-spacing:.04em;font-size:.7rem}.toast{background:var(--surface-2);border:1px solid var(--border);color:var(--text);border-radius:var(--radius);opacity:0;pointer-events:none;z-index:200;padding:.5rem 1.25rem;font-size:.85rem;font-weight:500;transition:transform .25s cubic-bezier(.22,1,.36,1),opacity .25s;position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%)translateY(120%)}.toast.show{opacity:1;transform:translate(-50%)translateY(0)}footer{text-align:center;color:var(--text-dim);padding:3rem 0 1rem;font-size:.8rem}footer a{color:var(--accent);font-weight:600;text-decoration:none}footer a:hover{text-decoration:underline}@media (prefers-color-scheme:light){:root{--bg:#fafafa;--surface:#fff;--surface-2:#f4f4f5;--border:#e4e4e7;--border-hover:#d4d4d8;--text:#18181b;--text-muted:#71717a;--text-dim:#a1a1aa;--accent:#059669;--accent-dim:#047857;--error:#dc2626;--error-bg:#fef2f2}html{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}}