* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; background: var(--bg); color: var(--text); font: 14px var(--font-ui); }
#app { padding: 16px; }
.panel { background: var(--panel); border: 1px solid var(--border); border-radius: 8px; padding: 16px; max-width: 420px; }
.panel h2 { margin: 0 0 8px; color: var(--gold); font-size: 16px; }
button { background: var(--panel); color: var(--text); border: 1px solid var(--border); border-radius: 6px; padding: 8px 12px; cursor: pointer; }
.muted { color: var(--muted); }
body.debug { padding: 16px; max-width: 900px; }
table { border-collapse: collapse; width: 100%; margin-bottom: 16px; }
th, td { border: 1px solid var(--border); padding: 6px 8px; text-align: left; font-family: var(--font-mono); font-size: 12px; }
tr.bad td { color: var(--danger); }
pre { background: var(--panel); border: 1px solid var(--border); padding: 10px; overflow: auto; font-family: var(--font-mono); font-size: 12px; }