:root { --bg:#0b1220; --fg:#e8eef6; --link:#9ad1ff; --muted:#a8b3c7; --card:#111a2e; --accent:#b5f5a2; }
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif; background:var(--bg); color:var(--fg); line-height:1.6 }
.container { max-width: 980px; margin: 0 auto; padding: 1.25rem }
a { color: var(--link); text-decoration: none }
a:hover { text-decoration: underline }
.site-header { border-bottom: 1px solid #223; background: #0e1830; position: sticky; top:0; z-index:10 }
.brand { font-weight: 800; letter-spacing: 0.5px; margin-right:1rem }
nav a { margin-right: 1rem }
.hero { padding: 2rem; background: linear-gradient(180deg,#0f1a34 0,#0b1220); border-radius: 16px; box-shadow: 0 10px 30px rgba(0,0,0,.25) }
.hero h1 { font-size: clamp(1.6rem, 3vw, 2.2rem); margin: 0 0 .3rem }
.hero p { color: var(--muted); margin: .25rem 0 }
.cards { display: grid; grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); gap: 1rem; margin-top:1rem }
.card { background: var(--card); border:1px solid #213; border-radius: 14px; padding: 1rem }
.card h3 { margin-top: 0 }
.badge { display:inline-block; padding:.2rem .5rem; border-radius: 999px; border:1px solid #2a395b; color:#cfe2ff; font-size:.8rem }
.section { margin-top: 1.25rem }
table { width: 100%; border-collapse: collapse; }
th, td { border-bottom: 1px solid #2a395b; padding: 0.5rem; text-align: left; }
.site-footer { border-top:1px solid #223; color: var(--muted); }
small.muted { color: var(--muted) }