:root{
  --canvas:#171C21;--panel:#1F262C;--line:#333E46;--line-int:#6E7C88;
  --accent:#E8E0D2;--ember:#E8B26A;--text:#ECE6DC;--text-2:#A3AEB5;--text-3:#8A959C;
  --display:'Vollkorn',Georgia,'Times New Roman',serif;--body:'Commissioner',system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
}
*{box-sizing:border-box}
html,body{overflow-x:hidden;overflow-x:clip}
body{margin:0;background:var(--canvas);color:var(--text);
  font-family:var(--body);font-size:16.5px;line-height:1.7;-webkit-font-smoothing:antialiased}
a{color:var(--accent)}
a:hover{color:#fff}
:focus-visible{outline:2px solid var(--ember);outline-offset:3px;border-radius:3px}
.skip{position:absolute;left:-9999px;top:0;background:var(--accent);color:#14181C;padding:12px 18px}
.skip:focus{left:0}
.top{border-bottom:1px solid var(--line);padding:14px clamp(18px,4vw,46px)}
.top .in{max-width:760px;margin:0 auto;display:flex;align-items:center;gap:14px}
.top .brand{display:flex;align-items:center;gap:11px;font-family:var(--display);font-size:19px;
  text-decoration:none;color:var(--text)}
.top svg{width:24px;height:24px;flex:0 0 auto}
.lang{display:flex;gap:2px;align-items:center;margin-left:auto;
  background:rgba(255,255,255,.045);border:1px solid var(--line);border-radius:9px;padding:3px}
.lang button{background:none;border:0;padding:6px 8px;border-radius:6px;font-family:var(--mono);
  font-size:11px;letter-spacing:.06em;color:var(--text-3);cursor:pointer;
  transition:color .3s,background .3s}
.lang button:hover{color:var(--text)}
.lang button[aria-current="true"]{background:#2A333A;color:var(--text)}
.small{font-size:14px;color:var(--text-3)}
@media (max-width:520px){.top .brand span{display:none}}
@media (pointer:coarse){.lang button{min-height:44px;display:inline-flex;align-items:center;justify-content:center}}
main{max-width:760px;margin:0 auto;padding:clamp(40px,7vh,70px) clamp(18px,4vw,46px) clamp(60px,9vh,100px)}
h1{font-family:var(--display);font-weight:400;font-size:clamp(29px,4.4vw,42px);line-height:1.1;
  letter-spacing:-.015em;margin:0 0 8px;text-wrap:balance}
.lede{color:var(--text-2);margin:0 0 clamp(28px,4vw,44px);font-size:15.5px}
h2{font-family:var(--display);font-weight:400;font-size:clamp(20px,2.4vw,25px);line-height:1.2;
  letter-spacing:-.01em;margin:clamp(30px,4vw,44px) 0 12px}
p,li{color:var(--text-2);margin:0 0 13px;max-width:68ch}
strong{color:var(--text);font-weight:500}
ul{padding-left:20px;margin:0 0 16px}
li{margin-bottom:7px}
.block{background:var(--panel);border:1px solid var(--line);border-radius:13px;
  padding:clamp(18px,2.4vw,26px);margin:0 0 20px}
.block p{margin:0 0 6px}
.block p:last-child{margin:0}
.mono{font-family:var(--mono);font-size:14px;color:var(--accent)}
.todo{display:inline-block;padding:2px 9px;border-radius:6px;background:rgba(232,178,106,.14);
  border:1px solid var(--ember);color:var(--ember);font-family:var(--mono);font-size:12.5px;
  letter-spacing:.03em}
.note{border-left:2px solid var(--ember);padding:4px 0 4px 16px;margin:0 0 20px}
.note p{color:var(--text-3);font-size:14.5px}
footer{border-top:1px solid var(--line);padding:26px clamp(18px,4vw,46px) 40px}
footer .in{max-width:760px;margin:0 auto;display:flex;gap:22px;flex-wrap:wrap;
  font-size:14px}
footer a{color:var(--text-2);text-decoration:none}
footer a:hover{color:var(--text)}