:root { --gap: 14px; --radius: 16px; }
* { box-sizing: border-box; }
body { margin: 0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; line-height: 1.35; background: #fafafa; color:#111; }
a { color: inherit; }
.container { max-width: 1080px; margin: 0 auto; padding: 20px; }
.nav { display:flex; gap: var(--gap); align-items:center; justify-content:space-between; padding: 12px 20px; border-bottom:1px solid #e7e7e7; position:sticky; top:0; background:#fff; z-index:20; }
.brand { font-weight: 800; text-decoration:none; letter-spacing:.2px; }
.nav a { text-decoration:none; }
.row { display:flex; gap: var(--gap); flex-wrap:wrap; align-items:center; }
.grid { display:grid; grid-template-columns: repeat(12, 1fr); gap: var(--gap); }
.card { border:1px solid #e7e7e7; border-radius: var(--radius); padding:16px; background:#fff; box-shadow: 0 1px 0 rgba(0,0,0,.02); }
.card h1,.card h2,.card h3 { margin: 0 0 10px 0; }
.muted { color:#666; }
.badge { display:inline-block; padding:4px 8px; border-radius:999px; border:1px solid #e7e7e7; font-size:12px; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:10px 12px; border-radius:12px; border:1px solid #d8d8d8; background:#fff; cursor:pointer; text-decoration:none; }
.btn.primary { background:#111; color:#fff; border-color:#111; }
.btn:disabled { opacity:.6; cursor:not-allowed; }
.input, select, textarea { width:100%; padding:10px 12px; border-radius:12px; border:1px solid #d8d8d8; background:#fff; }
.footer { padding: 30px 20px; color:#666; border-top:1px solid #eee; margin-top: 30px; }
.small { font-size: 13px; }
hr { border:0; border-top:1px solid #eee; margin: 14px 0; }


.table{width:100%;border-collapse:collapse}
.table th,.table td{border-bottom:1px solid #eee;padding:10px;text-align:left}
.table th{font-size:12px;color:#666;text-transform:uppercase;letter-spacing:.06em}