body { font-family: -apple-system, Helvetica, Arial, sans-serif; margin: 0; background: #f5f6f8; color: #1c1e21; }
header { background: #14161a; color: white; padding: 16px 24px; display: flex; align-items: center; gap: 12px; }
header h1 { margin: 0; font-size: 20px; flex: 1; }
button { padding: 8px 14px; border-radius: 6px; border: 1px solid #ccc; background: white; cursor: pointer; }
button.danger { background: #e0245e; color: white; border: none; }
.flag { padding: 4px 10px; border-radius: 12px; font-size: 12px; font-weight: 600; }
.flag.on { background: #ffdede; color: #b00020; }
.flag.off { background: #d9f7e3; color: #0a7a3d; }
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; padding: 24px; }
.card { background: white; border-radius: 10px; padding: 16px 18px; box-shadow: 0 1px 3px rgba(0,0,0,0.08); }
.card h2 { margin-top: 0; font-size: 15px; text-transform: uppercase; color: #666; letter-spacing: 0.03em; }
.human-actions { padding: 0 24px; }
.action-card { background: #fff8e1; border-left: 4px solid #f5a623; border-radius: 6px; padding: 12px 16px; margin-bottom: 10px; }
.errors { grid-column: span 2; }