:root { color-scheme: light; --bg:#f4f6f5; --surface:#fff; --ink:#17211b; --muted:#647068; --line:#d8dfda; --accent:#146b58; --accent-soft:#e1f0eb; --navy:#22313b; }
* { box-sizing:border-box; } body { margin:0; background:var(--bg); color:var(--ink); font:16px/1.65 Inter,"Segoe UI","Microsoft YaHei",Arial,sans-serif; }
a { color:var(--accent); } main { max-width:920px; margin:auto; padding:34px 22px 56px; } header { border-bottom:1px solid var(--line); padding-bottom:24px; } .eyebrow { color:var(--accent); font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; } h1 { margin:8px 0; font-size:34px; line-height:1.2; } h2 { margin-top:30px; font-size:21px; } p,li { max-width:790px; } .label { display:inline-block; margin-top:10px; padding:4px 8px; background:#fff4d6; border:1px solid #ead18a; border-radius:4px; font-size:13px; color:#745600; } .grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:18px; } .card { background:var(--surface); border:1px solid var(--line); padding:15px 17px; } .card strong { display:block; margin-bottom:4px; } code { background:#eef2ef; padding:2px 5px; border-radius:3px; font-size:13px; } footer { margin-top:36px; border-top:1px solid var(--line); padding-top:16px; color:var(--muted); font-size:13px; } @media (max-width:650px){ main{padding:24px 14px 40px} h1{font-size:28px}.grid{grid-template-columns:1fr} }