/* assets/css/styles.css */
:root {
  --bg: #0b0d11;
  --panel: #12151c;
  --text: #e6ebff;
  --muted: #9aa4bf;
  --brand: #4f7cff;
  --accent: #22c55e;
  --danger: #ef4444;
  --maxw: 980px;
}
* { box-sizing: border-box; }
html, body { margin:0; padding:0; background:var(--bg); color:var(--text); font:16px/1.6 system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji"; }
a { color: var(--brand); text-decoration: none; }
a:hover { text-decoration: underline; }
.container { max-width: var(--maxw); margin: 0 auto; padding: 1.25rem; }
.site-header { background: var(--panel); border-bottom: 1px solid #202636; position: sticky; top: 0; z-index: 10; }
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.brand { display:flex; gap:.6rem; align-items:center; font-weight: 700; font-size: 1.05rem; }
.logo { font-size: 1.25rem; }
.nav ul { display: flex; list-style: none; padding: 0; margin: 0; gap: .75rem; }
.nav a { display: inline-block; padding: .5rem .75rem; border-radius: .6rem; }
.nav a.active, .nav a[aria-current="page"] { background: #1a2130; }
.hero { padding: 2.5rem 0 0; }
.hero h1 { font-size: clamp(1.6rem, 3vw + 1rem, 2.4rem); margin: 0 0 .25rem; }
.hero p { color: var(--muted); margin-top: 0; }
.btn { display:inline-block; background: var(--brand); color:white; padding:.7rem 1rem; border-radius:.7rem; border:none; cursor:pointer; font-weight:600; }
.btn:hover { filter: brightness(1.08); text-decoration: none; }
.grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap:1rem; margin: 1.5rem 0 2rem; }
.grid article, .card { background: var(--panel); border:1px solid #202636; border-radius: .9rem; padding:1rem; }
.cards { display:grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap:1rem; }
.site-footer { border-top:1px solid #202636; background: var(--panel); margin-top:2rem; }
.site-footer p { margin: 0; padding: 1rem 0; color: var(--muted); }
.field { margin: .85rem 0; }
.field label { display:block; font-weight:600; margin-bottom:.35rem; }
.field input, .field textarea { width: 100%; padding: .7rem .8rem; background: #0e121a; color: var(--text); border: 1px solid #1f2736; border-radius: .6rem; }
.alert { padding: .8rem 1rem; border-radius: .6rem; margin: 1rem 0; }
.alert.error { background: #2a1214; border: 1px solid #7f1d1d; }
.alert.success { background: #102a1a; border: 1px solid #14532d; }
@media (prefers-color-scheme: light) {
  :root { --bg:#f6f8ff; --panel:#ffffff; --text:#0b1020; --muted:#5a6275; }
  .nav a.active, .nav a[aria-current="page"] { background: #eef2ff; }
  .field input, .field textarea { background: white; border: 1px solid #e3e8ff; }
  .site-header { border-bottom-color: #e9edff; }
  .site-footer { border-top-color: #e9edff; }
}