:root{
  --ink:#14162B; --mid:#4A4E6B; --soft:#8A8FAE; --bg:#F5F6FB; --card:#fff;
  --acc:#5B5BD6; --hair:#E7E9F4; --amber:#F5A524;
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font:16px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:760px;margin:0 auto;padding:32px 22px 96px}
header{display:flex;align-items:center;gap:12px;padding:22px 0}
header img{width:42px;height:42px;border-radius:12px}
header b{font-size:19px;letter-spacing:-.5px}
nav{margin-left:auto;display:flex;gap:6px}
nav button{
  border:1px solid var(--hair);background:var(--card);color:var(--mid);
  border-radius:99px;padding:7px 14px;font:inherit;font-size:13px;font-weight:600;cursor:pointer;
}
nav button[aria-pressed="true"]{background:var(--acc);border-color:var(--acc);color:#fff}
h1{font-size:32px;letter-spacing:-1.2px;line-height:1.15;margin:24px 0 6px}
h2{font-size:19px;letter-spacing:-.5px;margin:34px 0 8px}
h3{font-size:15px;margin:22px 0 4px}
p,li{color:var(--mid)}
.lead{font-size:17px;color:var(--mid)}
.meta{color:var(--soft);font-size:13.5px;margin:0}
.card{background:var(--card);border:1px solid var(--hair);border-radius:20px;padding:20px 22px;margin:18px 0}
.todo{background:#FFF7E6;border:1px solid #F5D48A;border-radius:16px;padding:16px 18px;margin:18px 0;color:#6B4C00}
table{width:100%;border-collapse:collapse;margin:12px 0;font-size:14.5px}
th,td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--hair);vertical-align:top}
th{color:var(--ink);font-weight:700}
td{color:var(--mid)}
a{color:var(--acc)}
footer{margin-top:56px;padding-top:22px;border-top:1px solid var(--hair);font-size:13.5px;color:var(--soft)}
footer a{margin-right:14px}
section[lang]:not(.on){display:none}
@media (prefers-color-scheme:dark){
  :root{--ink:#F2F3FA;--mid:#B9BDD4;--soft:#8A8FAE;--bg:#0F1120;--card:#191B2E;--hair:#2A2D45}
  .todo{background:#2E2409;border-color:#5C4A12;color:#F5D48A}
}
