:root { --ink:#0d1b2a; --ink-2:#1b2b45; --teal:#19c3b1; --teal-dark:#0e8f82; --paper:#f6f8fb; --line:#dde3ec; --dim:#5d6b82; --warn-bg:#fff6e0; --warn-line:#e8c26b; }
* { box-sizing:border-box; }
body { margin:0; font-family:"Segoe UI",system-ui,sans-serif; background:var(--paper); color:#14213d; line-height:1.6; }
header { background:linear-gradient(160deg,var(--ink),var(--ink-2)); color:#fff; padding:16px 28px; display:flex; justify-content:space-between; align-items:center; }
header a { color:#cfe; text-decoration:none; font-size:14px; }
main { max-width:800px; margin:28px auto; padding:0 20px 40px; }
article { background:#fff; border-radius:12px; padding:26px 30px 30px; box-shadow:0 1px 3px rgba(13,27,42,.08); }
h1 { font-size:26px; margin:0 0 4px; }
h2 { font-size:17px; margin:28px 0 6px; color:var(--ink-2); }
.meta { color:var(--dim); font-size:13px; margin:0 0 18px; }
p, li { font-size:15px; }
ul { padding-left:22px; } li { margin:3px 0; }
.draft { background:var(--warn-bg); border:1px solid var(--warn-line); border-radius:8px; padding:10px 14px; font-size:14px; margin:0 0 18px; }
.draft[hidden] { display:none; }
.key { background:#eefaf8; border:1px solid #bfe9e3; border-radius:8px; padding:4px 16px 8px; margin:14px 0 4px; }
.key h2 { margin-top:12px; }
.foot { margin-top:30px; padding-top:14px; border-top:1px solid var(--line); color:var(--dim); font-size:13px; }
a { color:var(--teal-dark); }
@media print { header, .draft { display:none; } body { background:#fff; } article { box-shadow:none; padding:0; } }
header a[hidden] { display:none; }