:root{ --bg:#ffffff; --fg:#111; --muted:#777; --red:#c42020; }
*{ box-sizing:border-box; }
body{ margin:0; font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial; color:var(--fg); background:var(--bg); }
.header{ display:flex; align-items:center; gap:12px; padding:12px 16px; border-bottom:1px solid #eee; }
.header img{ height:36px; }
.container{ max-width:980px; margin:0 auto; padding:16px; }
.card{ border:1px solid #eee; border-radius:12px; padding:16px; margin:12px 0; }
.btn{ background:var(--red); color:#fff; border:none; padding:10px 14px; border-radius:10px; cursor:pointer; }
.btn.secondary{ background:#444; }
.input, textarea, select{ width:100%; padding:10px; border:1px solid #ddd; border-radius:10px; }
label{ font-size:14px; color:#333; }
.row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.table{ width:100%; border-collapse:collapse; }
.table th, .table td{ padding:8px; border-bottom:1px solid #eee; text-align:left; }
.badge{ display:inline-block; padding:4px 8px; border-radius:999px; font-size:12px; background:#eee; }
.badge.ok{ background:#e5f7ea; color:#207a38; }
.badge.wait{ background:#fff4e5; color:#8a5b00; }
.badge.no{ background:#fde7e7; color:#8a2222; }
.alert{ padding:10px; border-radius:10px; margin-bottom:12px; }
.alert.ok{ background:#e5f7ea; color:#207a38; }
.alert.err{ background:#fde7e7; color:#8a2222; }
.link{ color:var(--red); text-decoration:none; }