
:root{--bg:#0b1020;--card:#121a33;--text:#eef2ff;--muted:#b7c0e0;--link:#9bb5ff;--border:rgba(255,255,255,.10);--shadow:0 10px 30px rgba(0,0,0,.35)}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,Helvetica,sans-serif;background:radial-gradient(1200px 600px at 20% 0%, rgba(155,181,255,.25), transparent 60%), var(--bg); color:var(--text); line-height:1.65}
a{color:var(--link); text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1000px;margin:0 auto;padding:24px}
.header{position:sticky;top:0;backdrop-filter:saturate(140%) blur(10px); background:rgba(11,16,32,.65); border-bottom:1px solid var(--border); z-index:10}
.nav{display:flex;gap:14px; align-items:center; justify-content:space-between}
.brand{display:flex; gap:10px; align-items:center}
.logo{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg, rgba(155,181,255,.95), rgba(255,255,255,.15)); box-shadow: var(--shadow)}
.brand b{font-size:16px}
.links{display:flex;gap:14px;flex-wrap:wrap; justify-content:flex-end}
.hero{padding:34px 0 10px}
.hero h1{margin:0 0 8px;font-size:34px}
.hero p{margin:0;color:var(--muted); max-width:820px}
.grid{display:grid; grid-template-columns:repeat(12,1fr); gap:16px; margin-top:18px}
.card{grid-column: span 6; background:rgba(18,26,51,.78); border:1px solid var(--border); border-radius:18px; padding:18px; box-shadow: var(--shadow)}
.card h2{margin:0 0 6px;font-size:18px}
.card p{margin:0;color:var(--muted)}
.badge{display:inline-flex; align-items:center; gap:8px; padding:8px 10px; border:1px solid var(--border); border-radius:999px; color:var(--muted); margin-top:12px}
.main{padding:22px 0 36px}
.paper{background:rgba(18,26,51,.78); border:1px solid var(--border); border-radius:18px; padding:22px; box-shadow: var(--shadow}
.paper h1{margin:0 0 10px;font-size:26px}
.paper h2{margin:18px 0 8px;font-size:18px}
.paper .meta{color:var(--muted); margin-bottom:10px}
.footer{border-top:1px solid var(--border); color:var(--muted); padding:18px 0; font-size:13px}
.small{font-size:13px;color:var(--muted)}
hr{border:0;border-top:1px solid var(--border); margin:18px 0}
ul{padding-left:18px}
@media (max-width:780px){.card{grid-column: span 12}.hero h1{font-size:28px}}
