:root {
  --primary:#2F80ED;
  --accent:#27AE60;
  --bg:#f8fafc;
  --text:#1f2937;
  --muted:#6b7280;
}
* { box-sizing: border-box; }
html, body { margin:0; padding:0; font-family: Inter, system-ui, -apple-system, Arial, sans-serif; color:var(--text); background:var(--bg); }
a { color: var(--primary); text-decoration: none; }
a.btn, .btn { display:inline-block; padding:10px 16px; border-radius:10px; background:#e5e7eb; color:#111827; }
.btn.primary, .btn.btn-primary { background:linear-gradient(90deg,var(--primary), var(--accent)); color:white; }
.btn.small { padding:6px 10px; font-size:0.9em; }
.linklike { background:none; border:none; color:var(--primary); cursor:pointer; font:inherit; }

.container { max-width: 1100px; margin:0 auto; padding: 0 16px; }
.flex { display:flex; }
.space-between { justify-content: space-between; }
.align-center { align-items:center; }
.grid-2 { display:grid; grid-template-columns: repeat(2,1fr); gap:16px; }
.grid-3 { display:grid; grid-template-columns: repeat(3,1fr); gap:16px; }

.site-header { background:#fff; border-bottom:1px solid #e5e7eb; position:sticky; top:0; z-index:10; }
.site-header .logo { font-weight:700; font-size:20px; padding:14px 0; display:inline-block; }
.site-header nav a, .site-header nav form { margin:0 8px; }
.site-footer { margin-top:40px; padding:30px 0; background:#0f172a; color:#cbd5e1; }
.site-footer a { color:#cbd5e1; }
.site-footer .small { font-size:12px; padding-top:10px; }

.main { padding: 24px 0; }
.hero { background: linear-gradient(90deg, rgba(47,128,237,.08), rgba(39,174,96,.08)); padding: 40px 0; border-radius: 16px; margin: 16px 0; }
.hero .actions .btn { margin-right:8px; }
.features .card, .card { background:#fff; border:1px solid #e5e7eb; border-radius:12px; padding:16px; }
.table { width:100%; border-collapse: collapse; background:#fff; border-radius: 12px; overflow:hidden; }
.table th, .table td { border-bottom:1px solid #e5e7eb; padding:10px; text-align:left; }

.form-row { margin:10px 0; }
.form-row input, .form-row textarea { width:100%; padding:10px; border-radius:10px; border:1px solid #cbd5e1; background:#fff; }

.list { list-style: none; padding:0; }
.list li { background:#fff; border:1px solid #e5e7eb; padding:10px; margin:8px 0; border-radius:10px; }
.muted { color: var(--muted); }
.flash { padding:10px 16px; border-radius:10px; margin:8px 0; }
.flash.error { background:#fee2e2; color:#991b1b; }
.flash.success { background:#dcfce7; color:#14532d; }

@media (max-width: 800px) {
  .grid-2, .grid-3 { grid-template-columns: 1fr; }
  .site-header nav a, .site-header nav form { display:inline-block; margin: 4px 6px; }
}