:root{--bg-primary: #1a1a1a;--bg-secondary: #2a2a2a;--bg-tertiary: #3a3a3a;--text-primary: #e0e0e0;--text-secondary: #b0b0b0;--text-muted: #808080;--border-color: #404040;--accent-color: #4CAF50;--error-color: #f44336;--success-color: #4CAF50;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;color:var(--text-primary);background-color:var(--bg-primary);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{margin:0;padding:0;box-sizing:border-box}body{margin:0;display:flex;min-width:320px;min-height:100vh}#app{width:100%;margin:0 auto}button{border-radius:8px;border:1px solid var(--border-color);padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:var(--bg-secondary);color:var(--text-primary);cursor:pointer;transition:background-color .2s,border-color .2s}button:hover{background-color:var(--bg-tertiary);border-color:var(--accent-color)}button:focus,button:focus-visible{outline:2px solid var(--accent-color);outline-offset:2px}button.active{background-color:var(--accent-color);border-color:var(--accent-color);color:#fff}textarea{width:100%;height:100%;padding:1rem;font-family:Courier New,Courier,monospace;font-size:14px;background-color:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border-color);border-radius:4px;resize:none;outline:none}textarea:focus{border-color:var(--accent-color)}pre{margin:0;font-family:Courier New,Courier,monospace;font-size:14px;white-space:pre-wrap;word-wrap:break-word}.error-text{color:var(--error-color)}.success-text{color:var(--success-color)}main.svelte-1n46o8q{width:100%;min-height:100vh;display:flex;flex-direction:column}header.svelte-1n46o8q{padding:2rem;text-align:center;background-color:var(--bg-secondary);border-bottom:2px solid var(--border-color)}h1.svelte-1n46o8q{font-size:2.5rem;margin-bottom:.5rem;color:var(--accent-color)}.subtitle.svelte-1n46o8q{color:var(--text-secondary);font-size:1.1rem}.mode-switcher.svelte-1n46o8q{display:flex;justify-content:center;gap:1rem;padding:1.5rem;background-color:var(--bg-primary)}section.svelte-1n46o8q{flex:1;padding:1rem;overflow:hidden}.panel-container.svelte-1n46o8q{display:grid;grid-template-columns:1fr 1fr;gap:1rem;height:calc(100vh - 300px)}.panel.svelte-1n46o8q{display:flex;flex-direction:column;background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:8px;overflow:hidden}.panel-header.svelte-1n46o8q{display:flex;justify-content:space-between;align-items:center;padding:1rem;background-color:var(--bg-tertiary);border-bottom:1px solid var(--border-color)}.panel-header.svelte-1n46o8q h2:where(.svelte-1n46o8q){font-size:1.2rem;font-weight:500}.input-panel.svelte-1n46o8q textarea:where(.svelte-1n46o8q),.diff-left.svelte-1n46o8q textarea:where(.svelte-1n46o8q),.diff-right.svelte-1n46o8q textarea:where(.svelte-1n46o8q){flex:1;border:none;border-radius:0}.output-panel.svelte-1n46o8q{padding:1rem}.formatted-json.svelte-1n46o8q{padding:1rem;overflow:auto;height:100%}.error-message.svelte-1n46o8q{padding:1rem;background-color:#f443361a;border:1px solid var(--error-color);border-radius:4px;margin:1rem}.placeholder.svelte-1n46o8q{display:flex;align-items:center;justify-content:center;height:100%;color:var(--text-muted);font-style:italic}.diff-controls.svelte-1n46o8q{display:flex;justify-content:center;padding:1rem 0}.diff-result.svelte-1n46o8q{margin-top:1rem;padding:1rem;background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:8px}.diff-result.svelte-1n46o8q h3:where(.svelte-1n46o8q){margin-bottom:.5rem}footer.svelte-1n46o8q{padding:1rem;text-align:center;background-color:var(--bg-secondary);border-top:1px solid var(--border-color);color:var(--text-secondary)}footer.svelte-1n46o8q a:where(.svelte-1n46o8q){color:var(--accent-color);text-decoration:none}footer.svelte-1n46o8q a:where(.svelte-1n46o8q):hover{text-decoration:underline}@media(max-width:768px){.panel-container.svelte-1n46o8q{grid-template-columns:1fr;height:auto}.panel.svelte-1n46o8q{min-height:300px}}
