:root { --bg:#0b0b0c; --fg:#e9e9ea; --muted:#b3b3b6; --card:#131316; --accent:#7c7cff; }
* { box-sizing: border-box; }
body { margin:0; font:16px/1.5 system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, 'Helvetica Neue', Arial; background:var(--bg); color:var(--fg); }
header { position:sticky; top:0; background:rgba(11,11,12,0.9); backdrop-filter:saturate(1.2) blur(8px); border-bottom:1px solid #1e1e22; z-index:10; }
.container { max-width:1100px; margin:0 auto; padding:24px; }
h1 { font-size:22px; margin:0 0 8px; }
.search { display:flex; gap:12px; align-items:center; }
input[type="search"] { width:100%; padding:12px 14px; border-radius:12px; border:1px solid #2a2a32; background:#0f0f12; color:var(--fg); }
.badge { font-size:12px; color:#888; background:#1a1a1f; padding:6px 10px; border-radius:999px; }
main { padding: 8px 0 48px; }
.card { background:var(--card); border:1px solid #1e1e22; border-radius:16px; padding:18px; margin:16px 0; }
.card h2 { font-size:16px; margin:0 0 8px; color:var(--accent); }
.page-text { white-space:pre-wrap; word-wrap:break-word; }
.muted { color: var(--muted); }
.footer { color:#9a9aa2; font-size:12px; padding:24px; text-align:center; border-top:1px solid #1e1e22; background:#0e0e11; }
kbd { background:#222; padding:2px 6px; border-radius:6px; border:1px solid #333; font-size:12px; }
small a { color:#a7a7ff; }
hr { border:0; border-top:1px solid #1f1f24; margin:24px 0; }
a.button { display:inline-block; padding:10px 14px; border-radius:10px; border:1px solid #2a2a32; text-decoration:none; color:var(--fg); background:#121217; }
a.button:hover { border-color:#34343c; }