:root{--bg:#0b0f14;--card:#111826;--text:#e6edf3;--muted:#9aa4af;--accent:#6ee7b7;--line:#233041;--maxw:980px;}
@media (prefers-color-scheme: light){:root{--bg:#ffffff;--card:#f6f7f9;--text:#111827;--muted:#4b5563;--accent:#0ea5e9;--line:#e5e7eb;}}
*{box-sizing:border-box} body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.55}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:var(--maxw);margin:0 auto;padding:16px}
.header{display:flex;flex-direction:column;gap:8px;padding:20px 0}
.title{font-size:28px;font-weight:800;letter-spacing:-0.02em}
.subtitle{color:var(--muted)}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px}
.grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
@media (min-width:720px){.grid{grid-template-columns:repeat(9,minmax(0,1fr));}}
.letterbtn{display:flex;align-items:center;justify-content:center;border-radius:12px;padding:12px 0;border:1px solid var(--line);background:transparent;font-weight:700}
.letterbtn.active{border-color:var(--accent);box-shadow:0 0 0 2px rgba(110,231,183,0.15) inset}
.letterbtn.missing{opacity:0.35}
.azbar{position:sticky;top:0;background:linear-gradient(to bottom,var(--bg),rgba(0,0,0,0));backdrop-filter:blur(8px);padding:10px 0;z-index:10}
.azrow{display:flex;flex-wrap:wrap;gap:8px}
.azrow a{padding:8px 10px;border-radius:999px;border:1px solid var(--line)}
.azrow a[aria-current="page"]{border-color:var(--accent)}
.entry{margin:14px 0}
.entry h2{margin:0 0 8px 0;font-size:20px}
.entry p{margin:0 0 10px 0;color:var(--text)}
.entry .meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:999px;padding:6px 10px;color:var(--muted)}
.footer{margin:28px 0 10px 0;color:var(--muted);font-size:13px}