:root { --border:#e6e6e6; --text:#1f1f1f; --muted:#666; }
*{ box-sizing:border-box; }
body{ margin:0; font-family:system-ui, -apple-system, Segoe UI, Roboto, Arial; color:var(--text); background:#fff; }
.container{ max-width:980px; margin:0 auto; padding:18px; }
.site-header{ border-bottom:1px solid var(--border); background:#fff; position:sticky; top:0; }
.header-row{ display:flex; align-items:center; justify-content:space-between; gap:16px; }
.brand{ text-decoration:none; font-weight:800; letter-spacing:-0.2px; color:var(--text); }
.nav a{ margin-left:14px; text-decoration:none; color:var(--text); }
.nav a:hover{ text-decoration:underline; }
.btn{ display:inline-block; background:#111; color:#fff; padding:10px 14px; border-radius:10px; text-decoration:none; border:0; cursor:pointer; }
.btn-small{ padding:8px 12px; border-radius:10px; }
.card{ border:1px solid var(--border); border-radius:14px; padding:14px; background:#fff; }
.grid{ display:grid; gap:12px; }
.grid-2{ grid-template-columns:1fr 1fr; }
@media (max-width:800px){ .grid-2{ grid-template-columns:1fr; } }
label{ display:block; margin-top:12px; font-weight:600; }
input, select, textarea{ width:100%; padding:10px; border:1px solid var(--border); border-radius:12px; margin-top:6px; }
textarea{ min-height:90px; }
.muted{ color:var(--muted); font-size:14px; }
.flash{ padding:10px 12px; border-radius:12px; margin:12px 0; border:1px solid var(--border); }
.flash-error{ background:#fff5f5; border-color:#ffd7d7; }
.flash-success{ background:#f4fff7; border-color:#c6f6d5; }
.table{ width:100%; border-collapse:collapse; }
.table th,.table td{ padding:10px; border-bottom:1px solid var(--border); text-align:left; vertical-align:top; }
.pill{ display:inline-block; padding:4px 10px; border:1px solid var(--border); border-radius:999px; font-size:12px; }