.json-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}@media (max-width: 880px){.json-grid{grid-template-columns:1fr}}.json-pane{display:flex;flex-direction:column;gap:10px;min-height:440px}.json-pane h4{font-size:13px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.json-input{width:100%;min-height:440px;background:var(--cream-2);border:var(--stroke) solid var(--ink);border-radius:var(--radius-sm);padding:12px 14px;font-family:var(--font-mono);font-size:13px;line-height:1.55;color:var(--ink);resize:vertical;outline:none;white-space:pre;-moz-tab-size:2;tab-size:2}.json-input:focus{background:var(--paper);box-shadow:var(--shadow-soft)}.json-input.has-error{border-color:var(--peach-deep)}.json-output{flex:1;background:var(--paper);border:var(--stroke) solid var(--ink);border-radius:var(--radius-sm);padding:12px 14px;font-family:var(--font-mono);font-size:13px;line-height:1.55;overflow:auto;white-space:pre;margin:0;min-height:440px}.json-foot{display:flex;gap:10px;align-items:center;margin-top:14px;flex-wrap:wrap;font-size:13px;color:var(--muted)}input[type=checkbox].tn-check{accent-color:var(--green-deep);width:16px;height:16px}