body { font-family: system-ui, Arial; margin: 0; background:#f6f7fb; }
.container {width: 100%;max-width: none;margin: 0;padding: 16px 24px;}
.card { background: #fff; padding: 16px; border-radius: 10px; box-shadow: 0 2px 12px rgba(0,0,0,.06); }
.topbar { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.right { display:flex; align-items:center; gap:12px; }
.tabs { display:flex; gap:8px; margin: 14px 0; flex-wrap:wrap; }
.tab { padding:10px 12px; border-radius:999px; text-decoration:none; background:#fff; color:#222; border:1px solid #e6e7ee; }
.tab.active { background:#222; color:#fff; }
.btn { padding:8px 12px; border-radius:8px; border:1px solid #ddd; background:#fff; cursor:pointer; text-decoration:none; display:inline-block; }
.btn.primary { background:#1f6feb; border-color:#1f6feb; color:#fff; }
.btn.danger { background:#ffecec; border-color:#ffb5b5; }
.row { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.filters { display:flex; gap:10px; flex-wrap:wrap; margin: 10px 0 0; }
input, textarea, select { width: 100%; max-width: 520px; padding:10px; border-radius:8px; border:1px solid #ddd; }
label { display:block; margin: 10px 0; }
.table { width:100%; border-collapse: collapse; margin-top: 12px; }
.table th, .table td { text-align:left; padding:10px; border-top:1px solid #eee; vertical-align:top; }
.actions { display:flex; gap:8px; align-items:center; }
.muted { color:#666; font-size: 0.92rem; }
.alert { background:#fff2f2; border:1px solid #ffcccc; padding:10px; border-radius:8px; margin: 10px 0; }
.ok { background:#f0fff3; border:1px solid #c5f2cf; padding:10px; border-radius:8px; margin: 10px 0; }
.pager { display:flex; gap:8px; flex-wrap:wrap; margin-top: 12px; }

select[multiple]{max-width:720px;}
hr{opacity:.6;}