@font-face{font-family:"Archivo";font-style:normal;font-weight:100 900;font-stretch:62% 125%;font-display:swap;src:url(fonts/archivo-latin-wdth-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/ibm-plex-sans-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/ibm-plex-sans-latin-600-normal.woff2) format("woff2")}

:root{--bg:#eef1f4;--surface:#fff;--ink:#16202b;--muted:#5a6573;--line:#d6dce3;--accent:#1c4f8a;--warn-bg:#fbeed6;--warn:#9a5b00;color-scheme:light}
@media (prefers-color-scheme:dark){:root{--bg:#0f141a;--surface:#171e26;--ink:#e5eaf0;--muted:#9aa6b4;--line:#2b3542;--accent:#7fb0ec;--warn-bg:#33260f;--warn:#f0b75a;color-scheme:dark}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif}
main{max-width:760px;margin:0 auto;padding:24px max(16px,env(safe-area-inset-left)) 56px}
h1,h2{font-family:"Archivo","Arial Narrow",system-ui,sans-serif;font-stretch:85%;letter-spacing:-.005em;text-wrap:balance;margin:0}
h1{font-size:1.9rem;font-weight:800;margin-bottom:6px}
h2{font-size:1.2rem;font-weight:700;margin:28px 0 6px}
p,ul{margin:8px 0}
ul{padding-left:1.2em}
a{color:var(--accent)}
.back{display:inline-block;margin-bottom:18px;font-size:.92rem}
.muted{color:var(--muted);font-size:.9rem}
.todo{background:var(--warn-bg);color:var(--ink);border-left:3px solid var(--warn);padding:10px 14px;border-radius:0 6px 6px 0;font-size:.92rem;margin:14px 0}
.ph{background:var(--warn-bg);border-radius:3px;padding:0 4px;font-weight:600}
.card{background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:4px 20px 20px}
