:root{--bg:#E8EEF6;--card:#FFFFFF;--ink:#152033;--ink2:#5A6A80;--line:#C9D4E4;--accent:#1B4FD8}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#0E1218;--card:#171D27;--ink:#E6ECF4;--ink2:#9AA8BB;--line:#2E3848;--accent:#7EB0FF}}
:root[data-theme="dark"]{--bg:#0E1218;--card:#171D27;--ink:#E6ECF4;--ink2:#9AA8BB;--line:#2E3848;--accent:#7EB0FF}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 "Segoe UI",system-ui,sans-serif}
main{max-width:720px;margin:0 auto;padding:32px 16px}
h1{font-size:1.6rem;margin:0 0 4px}
p.sub{color:var(--ink2);margin:0 0 24px}
p.note{color:var(--ink2);font-size:.9rem;margin-top:20px}
p.crumbs{font-size:.9rem;margin:0 0 12px;color:var(--ink2)}
p.crumbs a{color:var(--accent);text-decoration:none}
a.card{display:block;background:var(--card);border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:10px;padding:16px 18px;color:inherit;text-decoration:none;margin-bottom:12px}
a.card:hover{border-color:var(--accent)}
a.card b{display:block;font-size:1.1rem;margin-bottom:4px}
a.card span{color:var(--ink2);font-size:.95rem}