:root{--primary:#0082FB;--text:#1F2937;--muted:#6B7280;--bg:#FFFFFF;--soft:#F3F8FF}
@media (prefers-color-scheme:dark){:root{--text:#F3F4F6;--muted:#9CA3AF;--bg:#0B0F14;--soft:#111827}}
*{box-sizing:border-box}
body{margin:0;font:16px/1.65 -apple-system,"Segoe UI",Roboto,"Be Vietnam Pro",sans-serif;color:var(--text);background:var(--bg)}
header{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;background:var(--primary)}
header a{color:#fff;text-decoration:none;font-weight:700}
header nav a{font-weight:500;margin-left:14px;opacity:.92}
main{max-width:760px;margin:0 auto;padding:16px}
h1{font-size:1.6rem;margin:.8em 0 .2em}
h2{font-size:1.1rem;margin:1.6em 0 .3em;color:var(--primary)}
.meta{color:var(--muted);font-size:.9rem}
a{color:var(--primary)}
section+section{border-top:1px solid rgba(127,127,127,.25);margin-top:2em;padding-top:1em}
.hero{text-align:center;padding:24px 0}
.hero img{border-radius:22px}
.features{background:var(--soft);border-radius:14px;padding:16px 16px 16px 36px}
footer{text-align:center;color:var(--muted);font-size:.85rem;padding:24px 16px}