*{box-sizing:border-box}body{margin:0;font-family:system-ui,sans-serif}.app{flex-direction:column;height:100vh;display:flex}header{border-bottom:1px solid #ddd;padding:8px 16px}h1{margin:0;font-size:18px}h2{color:#555;margin:0 0 8px;font-size:14px}main{flex:1;grid-template-columns:1fr 1fr;min-height:0;display:grid}.pane{padding:12px 16px;overflow:auto}.pane+.pane{border-left:1px solid #ddd}ul{margin:0;padding-left:20px;list-style:none}ul.root{margin-top:8px;padding-left:0}.row{align-items:center;gap:4px;margin:2px 0;display:flex}.row input{font:inherit;border:1px solid #0000;border-radius:4px;min-width:0;padding:2px 6px}.row input:hover,.row input:focus{border-color:#aaa}button{font:inherit;cursor:pointer;padding:2px 8px;font-size:12px}button.danger{color:#b00020}pre{margin:0;font-family:ui-monospace,Menlo,monospace;font-size:14px}.muted{color:#888;font-size:13px}.toolbar{border-top:1px solid #ddd;padding:8px 16px}@media (width<=700px){main{grid-template-columns:1fr}.pane+.pane{border-top:1px solid #ddd;border-left:0}}