body { font-family: system-ui, sans-serif; margin:0; background:#f6f6f6; }
.top { display:flex; justify-content:space-between; padding:12px 18px; background:#111; color:#fff; }
.top a { color:#fff; margin-left:12px; text-decoration:none; }
.brand { font-weight:700; letter-spacing:0.5px; }
.wrap { padding:18px; max-width:1100px; margin:0 auto; }
.card { background:#fff; padding:16px; border-radius:14px; box-shadow:0 2px 10px rgba(0,0,0,.06); margin-bottom:16px; }
.grid { display:grid; grid-template-columns: 1fr; gap:16px; }
.cols { display:grid; grid-template-columns: 1fr 1fr; gap:14px; }
label { display:block; margin-top:10px; font-size:14px; }
input { width:100%; padding:9px; border:1px solid #ddd; border-radius:10px; }
button { margin-top:14px; padding:10px 14px; border:0; border-radius:12px; background:#111; color:#fff; cursor:pointer; }
.tbl { width:100%; border-collapse:collapse; }
.tbl th, .tbl td { padding:8px; border-bottom:1px solid #eee; text-align:left; }
.muted { color:#666; }
.err { background:#ffe9e9; border:1px solid #ffb9b9; padding:10px; border-radius:12px; margin:10px 0; }
.log { background:#0f0f0f; color:#e6e6e6; padding:12px; border-radius:12px; overflow:auto; max-height:420px; }
.row { display:flex; gap:16px; flex-wrap:wrap; }
@media (max-width: 900px) { .cols { grid-template-columns: 1fr; } }