:root{--color-background: #0f172a;--color-surface: #1e293b;--color-surface-raised: #253449;--color-muted: #272f42;--color-border: #334155;--color-border-strong: #475569;--color-foreground: #f8fafc;--color-foreground-muted: #94a3b8;--color-accent: #22c55e;--color-accent-foreground: #052e16;--color-destructive: #ef4444;--color-destructive-surface: #3f1d1d;--color-destructive-foreground: #fecaca;--color-destructive-foreground-muted: #fca5a5;--color-warning: #fbbf24;--color-ring: #38bdf8;--font-ui: "IBM Plex Sans", system-ui, -apple-system, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--radius-sm: 6px;--radius-md: 10px;--duration-fast: .15s;--duration-base: .2s;color-scheme:dark}:root[data-theme=light]{--color-background: #f8fafc;--color-surface: #ffffff;--color-surface-raised: #f1f5f9;--color-muted: #eef2f7;--color-border: #e2e8f0;--color-border-strong: #cbd5e1;--color-foreground: #0f172a;--color-foreground-muted: #64748b;--color-accent: #166534;--color-accent-foreground: #f0fdf4;--color-destructive: #dc2626;--color-destructive-surface: #fee2e2;--color-destructive-foreground: #7f1d1d;--color-destructive-foreground-muted: #991b1b;--color-warning: #b45309;--color-ring: #0369a1;color-scheme:light}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:var(--color-background);color:var(--color-foreground);font-family:var(--font-ui);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;transition:background var(--duration-base) ease,color var(--duration-base) ease}#root{min-height:100dvh}button,textarea,input{font-family:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}:focus-visible{outline:2px solid var(--color-ring);outline-offset:2px}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.001ms!important;transition-duration:.001ms!important}}.app{max-width:1440px;margin:0 auto;padding:var(--space-5) var(--space-5) var(--space-6);min-height:100dvh;display:flex;flex-direction:column;gap:var(--space-5)}.app__header{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:var(--space-3)}.app__header-actions{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-2)}.app__header-text{display:flex;flex-direction:column;gap:var(--space-1)}.app__title-group{display:flex;align-items:center;gap:var(--space-3)}.app__title{font-size:1.5rem;font-weight:600;margin:0;letter-spacing:-.01em}.app__subtitle{margin:0;color:var(--color-foreground-muted);font-size:.9375rem}.badge{display:inline-flex;align-items:center;padding:var(--space-1) var(--space-2);border-radius:999px;background:var(--color-muted);border:1px solid var(--color-border);color:var(--color-foreground-muted);font-size:.75rem;font-weight:500;font-family:var(--font-mono);letter-spacing:.02em}.app__grid{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4);min-height:0}.app__footer{border-top:1px solid var(--color-border);padding-top:var(--space-5);font-size:.875rem;color:var(--color-foreground-muted);text-align:right}.app__footer a{color:var(--color-accent)}.app__footer-credit{margin:0}@media (max-width: 900px){.app__grid{grid-template-columns:1fr}}.app__main{flex:1;display:flex;flex-direction:column;gap:var(--space-4);min-height:0}.pane{display:flex;flex-direction:column;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);min-height:420px;overflow:hidden}.pane__header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-border);flex-wrap:wrap}.pane__title{font-size:.875rem;font-weight:600;margin:0;color:var(--color-foreground)}.pane__header-actions{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-2)}.pane__textarea{flex:1;resize:none;border:none;background:transparent;color:var(--color-foreground);font-family:var(--font-mono);font-size:.875rem;line-height:1.6;padding:var(--space-4);min-height:240px}.pane__textarea::placeholder{color:var(--color-foreground-muted)}.pane__footer{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-top:1px solid var(--color-border);flex-wrap:wrap}.pane__footer-label{font-size:.8125rem;color:var(--color-foreground-muted);white-space:nowrap}.chip-row{display:flex;flex-wrap:wrap;gap:var(--space-2)}.chip{padding:var(--space-1) var(--space-3);border-radius:999px;border:1px solid var(--color-border-strong);background:var(--color-muted);color:var(--color-foreground);font-size:.8125rem;transition:background var(--duration-fast) ease,border-color var(--duration-fast) ease}.chip:hover{background:var(--color-surface-raised);border-color:var(--color-ring)}.pane__body{flex:1;display:flex;flex-direction:column;min-height:0}.pane__toolbar{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-4);border-bottom:1px solid var(--color-border);flex-wrap:wrap}.output-section{display:grid;grid-template-columns:1fr;gap:var(--space-4);min-height:0}@media (min-width: 1200px){.output-section{grid-template-columns:1fr 300px}}.tree-view{display:flex;flex-direction:column;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);min-height:200px;overflow:hidden}@media (min-width: 1200px){.tree-view{min-height:420px}}.tree-view__header{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-border);color:var(--color-foreground-muted);flex-wrap:wrap}.tree-view__header svg{width:16px;height:16px;flex-shrink:0}.tree-view__title{font-size:.875rem;font-weight:600;margin:0;color:var(--color-foreground)}.tree-view__tabs{display:flex;gap:var(--space-1);margin-left:auto}.tree-view__tab{padding:2px var(--space-2);border-radius:var(--radius-sm);border:1px solid transparent;background:transparent;color:var(--color-foreground-muted);font-size:.75rem;font-weight:500;transition:background var(--duration-fast) ease,color var(--duration-fast) ease}.tree-view__tab:hover{background:var(--color-surface-raised);color:var(--color-foreground)}.tree-view__tab[aria-selected=true]{background:var(--color-muted);border-color:var(--color-border-strong);color:var(--color-foreground)}.tree-view__body{flex:1;overflow:auto;padding:var(--space-3) var(--space-4);font-family:var(--font-mono);font-size:.8125rem}.tree-view__empty{margin:0;color:var(--color-foreground-muted)}.tree-view__cert-editor{display:flex;flex-direction:column;height:100%;gap:var(--space-2)}.tree-view__cert-toolbar{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);flex-wrap:wrap}.tree-view__cert-hint{display:inline-flex;align-items:center;gap:var(--space-1);margin:0;font-size:.75rem;font-weight:500;color:var(--color-ring)}.tree-view__cert-hint svg{width:14px;height:14px;flex-shrink:0}.tree-view__cert-textarea{flex:1;width:100%;box-sizing:border-box;resize:none;border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);background:var(--color-muted);color:var(--color-foreground);font-family:var(--font-mono);font-size:.8125rem;line-height:1.6;padding:var(--space-3);min-height:200px;transition:border-color var(--duration-fast) ease}.tree-view__cert-textarea:hover{border-color:var(--color-ring)}.tree-view__cert-textarea:focus-visible{border-color:var(--color-ring)}.tree-view__cert-textarea::placeholder{color:var(--color-foreground-muted)}.tree-branch>summary{list-style:none;cursor:pointer}.tree-branch>summary::-webkit-details-marker{display:none}.tree-branch>summary:before{content:"▸";display:inline-block;width:1em;color:var(--color-foreground-muted);transition:transform var(--duration-fast) ease}.tree-branch[open]>summary:before{transform:rotate(90deg)}.tree-row{display:flex;align-items:baseline;gap:var(--space-1);padding:2px 0;line-height:1.5;overflow-wrap:anywhere}.tree-children{padding-left:1.1em;margin-left:.35em;border-left:1px solid var(--color-border)}.tree-row__key{color:var(--color-foreground-muted)}.tree-row__key:after{content:":";margin-right:var(--space-1)}.tree-row__value{color:var(--color-foreground)}.tree-row__value--uint,.tree-row__value--nint,.tree-row__value--float,.tree-row__value--number{color:var(--color-ring)}.tree-row__value--text,.tree-row__value--text-chunk,.tree-row__value--string{color:var(--color-accent)}.tree-row__value--bytes,.tree-row__value--bytes-chunk{color:var(--color-warning)}.tree-row__value--bool,.tree-row__value--null,.tree-row__value--undefined,.tree-row__value--simple{color:var(--color-foreground-muted)}.hexdump-children{padding-left:1.1em;margin-left:.35em;border-left:1px solid var(--color-border)}.hexdump-row{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:var(--space-2);row-gap:0;padding:2px 0;line-height:1.5}.hexdump-row__hex{color:var(--color-ring);overflow-wrap:anywhere;word-break:break-all}.hexdump-row--content .hexdump-row__hex{color:var(--color-warning)}.hexdump-row__comment{color:var(--color-foreground-muted);overflow-wrap:anywhere}.hexdump-row__comment:before{content:"# "}.diff-result{min-height:200px}.diff-result__header{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-border);color:var(--color-foreground-muted)}.diff-result__header svg{width:16px;height:16px;flex-shrink:0}.diff-result__body{padding:var(--space-3) var(--space-4);overflow:auto}.diff-result__lines{margin:0;font-family:var(--font-mono);font-size:.8125rem;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere}.diff-result__line{display:flex;gap:var(--space-2);padding:0 var(--space-2);border-radius:var(--radius-sm)}.diff-result__line--added{background:color-mix(in srgb,var(--color-accent) 16%,transparent);color:var(--color-foreground)}.diff-result__line--removed{background:color-mix(in srgb,var(--color-destructive) 16%,transparent);color:var(--color-foreground)}.diff-result__line--same{color:var(--color-foreground-muted)}.diff-result__marker{flex-shrink:0;width:1ch;font-weight:600}.diff-result__line--added .diff-result__marker{color:var(--color-accent)}.diff-result__line--removed .diff-result__marker{color:var(--color-destructive)}.diff-result__text{white-space:pre-wrap;overflow-wrap:anywhere}.error-banner{display:flex;align-items:flex-start;gap:var(--space-3);margin:var(--space-4);padding:var(--space-3) var(--space-4);background:var(--color-destructive-surface);border:1px solid var(--color-destructive);border-radius:var(--radius-sm);color:var(--color-destructive-foreground)}.error-banner svg{flex-shrink:0;margin-top:2px;color:var(--color-destructive)}.error-banner__message{margin:0;font-size:.875rem;color:var(--color-foreground)}.error-banner__offset{margin:var(--space-1) 0 0;font-size:.8125rem;font-family:var(--font-mono);color:var(--color-destructive-foreground-muted)}.segmented{display:inline-flex;border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);overflow:hidden}.segmented__option{padding:var(--space-1) var(--space-3);min-height:32px;background:transparent;border:none;color:var(--color-foreground-muted);font-size:.8125rem;font-weight:500;transition:background var(--duration-fast) ease,color var(--duration-fast) ease}.segmented__option:not(:last-child){border-right:1px solid var(--color-border-strong)}.segmented__option[aria-pressed=true]{background:var(--color-accent);color:var(--color-accent-foreground)}.segmented__option:not([aria-pressed=true]):hover{background:var(--color-surface-raised);color:var(--color-foreground)}.icon-button{display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-3);min-height:32px;background:var(--color-muted);border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);color:var(--color-foreground);font-size:.8125rem;font-weight:500;transition:background var(--duration-fast) ease,border-color var(--duration-fast) ease}.icon-button:hover:not(:disabled){background:var(--color-surface-raised);border-color:var(--color-ring)}.icon-button:disabled{opacity:.5}.icon-button[aria-pressed=true]{background:var(--color-accent);border-color:var(--color-accent);color:var(--color-accent-foreground)}.icon-button svg{width:14px;height:14px}.round-trip{display:inline-flex;align-items:center;gap:var(--space-1);font-size:.8125rem;font-weight:500;white-space:nowrap}.round-trip svg{width:14px;height:14px}.round-trip--match{color:var(--color-accent)}.round-trip--diff{color:var(--color-warning)}.determinism{display:inline-flex;align-items:center;gap:var(--space-1);font-size:.8125rem;font-weight:500;white-space:nowrap;cursor:default}.determinism svg{width:14px;height:14px}.determinism--yes{color:var(--color-accent)}.determinism--no{color:var(--color-warning)}.theme-toggle{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;background:var(--color-muted);border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);color:var(--color-foreground);transition:background var(--duration-fast) ease,border-color var(--duration-fast) ease}.theme-toggle:hover{background:var(--color-surface-raised);border-color:var(--color-ring)}.theme-toggle svg{width:16px;height:16px}@media (max-width: 900px){.pane__textarea,.tree-view__cert-textarea{font-size:1rem}.icon-button,.segmented__option{min-height:44px;padding:var(--space-2) var(--space-3)}.chip,.tree-view__tab{min-height:40px;padding:var(--space-2) var(--space-3);display:inline-flex;align-items:center}.theme-toggle{width:44px;height:44px}}