:root{--ink:#14161a;--paper:#fff;--paper-dim:#f3f4f2;--green-deep:#0b5c3c;--green-wa:#25d366;--green-soft:#e8f7ee;--line:#e2e4e0;--mono:'IBM Plex Mono',monospace;--sans:'Archivo',system-ui,sans-serif}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:var(--sans);color:var(--ink);background:var(--paper);line-height:1.65;font-size:17px;-webkit-font-smoothing:antialiased}
.wrap{max-width:780px;margin:0 auto;padding:0 24px}
header{border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(255,255,255,.92);backdrop-filter:blur(8px)}
.nav{display:flex;align-items:center;justify-content:space-between;height:64px}
.logo{font-weight:900;font-stretch:115%;letter-spacing:-.02em;font-size:18px;text-decoration:none;display:flex;align-items:center;gap:10px}
.logo-tag{font-weight:500;opacity:.6}
@media(max-width:620px){.logo{font-size:15px;gap:8px;flex-wrap:wrap;line-height:1.2;max-width:58%}}
.logo .dot{width:10px;height:10px;border-radius:50%;background:var(--green-wa);box-shadow:0 0 0 3px var(--green-soft)}
.back{font-family:var(--mono);font-size:13.5px;text-decoration:none;color:var(--green-deep)}
main{padding:56px 0 80px}
.eyebrow{font-family:var(--mono);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--green-deep);margin-bottom:14px}
h1{font-weight:900;font-stretch:115%;letter-spacing:-.03em;font-size:clamp(30px,5vw,44px);line-height:1.05;margin-bottom:10px}
.updated{font-family:var(--mono);font-size:12.5px;opacity:.55;margin-bottom:36px}
h2{font-weight:800;font-stretch:115%;font-size:21px;letter-spacing:-.01em;margin:34px 0 10px}
p{margin-bottom:14px}
ul{margin:0 0 14px 22px}
li{margin-bottom:6px}
a{color:var(--green-deep)}
.note{background:var(--paper-dim);border:1px solid var(--line);border-radius:14px;padding:18px 20px;font-size:14.5px;margin:28px 0}
footer{border-top:1px solid var(--line);padding:28px 0}
footer p{font-size:13.5px;opacity:.6;margin:0}
.nav-right{display:flex;align-items:center;gap:18px}
.lang{flex:none;display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12.5px;letter-spacing:.06em;white-space:nowrap}
.lang>*+*::before{content:"·";content:"·"/"";margin-right:8px;opacity:.4}
.lang a{color:var(--ink);text-decoration:none;opacity:.6;transition:opacity .15s}
.lang a:hover{opacity:1}
.lang [aria-current]{color:var(--green-deep);font-weight:500}
@media(max-width:620px){
  .nav-right{gap:12px}
  .lang{gap:6px;letter-spacing:0}
  .lang>*+*::before{margin-right:6px}
  .back-txt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}