:root{--navy:#16233A;--cream:#F3ECE0;--cream2:#EAE1D2;--orange:#E2553A;--ink:#16233A;--muted:#5B6578;--line:rgba(22,35,58,.12)}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:Poppins,system-ui,sans-serif;background:var(--cream);color:var(--ink);line-height:1.7;-webkit-font-smoothing:antialiased}
a{color:var(--orange)}
:focus-visible{outline:3px solid var(--orange);outline-offset:3px;border-radius:6px}
.wrap{width:min(820px,100% - 32px);margin-inline:auto}
header{border-bottom:1px solid var(--line);background:rgba(243,236,224,.92)}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:72px;gap:16px;width:min(1200px,100% - 32px)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.brand img{width:40px;height:40px}
.brand b{font-family:Lora,serif;font-size:1.4rem;font-weight:700}
.brand b i{color:var(--orange);font-weight:600}
.back{font-size:.92rem;color:var(--muted);text-decoration:none}
.back:hover{color:var(--ink)}
main{padding:64px 0 90px}
.label{font-size:.75rem;letter-spacing:.22em;text-transform:uppercase;font-weight:500;color:var(--orange)}
h1{font-family:Lora,Georgia,serif;font-weight:700;line-height:1.1;font-size:clamp(2.2rem,5vw,3.2rem);margin:12px 0 10px}
h1 em{font-style:italic;font-weight:600;color:var(--orange)}
.maj{color:var(--muted);font-size:.9rem;margin-bottom:40px}
h2{font-family:Lora,Georgia,serif;font-weight:700;font-size:1.45rem;line-height:1.25;margin:40px 0 12px;padding-top:24px;border-top:1px solid var(--line)}
h3{font-weight:600;font-size:1rem;margin:20px 0 6px}
p,li{color:#2c3647;font-size:.98rem}
p+p{margin-top:10px}
ul{margin:10px 0 0 1.2rem;display:grid;gap:6px}
.box{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px 24px;margin-top:14px}
.box p{margin:0}
.box p+p{margin-top:4px}
.todo{background:#fff3cd;border-radius:4px;padding:0 4px}
.toc{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:.9rem}
footer{border-top:1px solid var(--line);padding:28px 0;color:var(--muted);font-size:.85rem}
footer .wrap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;width:min(1200px,100% - 32px)}
footer nav{display:flex;gap:18px;flex-wrap:wrap}
footer a{color:inherit;text-decoration:none}
footer a:hover,footer a[aria-current]{color:var(--ink);text-decoration:underline}