:root { font-family: system-ui, Arial; }
body { margin: 0; background:#0f172a; color:#e2e8f0; }
header { padding:16px; background:#111827; display:flex; align-items:center; gap:12px; }
h1 { margin:0; font-size:20px; }
.env { opacity:.7 }
main { padding:16px; display:grid; gap:16px; max-width:1100px; margin:auto; }
.card { background:#111827; border:1px solid #374151; border-radius:12px; padding:16px; }
button { padding:8px 12px; border-radius:8px; border:1px solid #334155; background:#1f2937; color:#e5e7eb; cursor:pointer }
button:hover { background:#0b1220 }
pre { background:#0b1220; padding:12px; border-radius:8px; overflow:auto }
.grid { display:grid; grid-template-columns: 1fr 2fr; gap:12px; margin-bottom:12px; }
input, select { width:100%; padding:8px; border-radius:8px; border:1px solid #334155; background:#0b1220; color:#e5e7eb }
table { width:100%; border-collapse: collapse; margin-top:12px; }
th, td { border:1px solid #334155; padding:8px; font-size:14px; vertical-align: top; }
td > .row { display:flex; gap:6px; flex-wrap: wrap; }
.row { display:flex; gap:12px; align-items:center; flex-wrap: wrap; }
.badge { padding:2px 6px; border-radius:999px; border:1px solid #334155; }
footer { padding:12px 16px; opacity:.7; text-align:center }