@import url('https://fonts.googleapis.com/css2?family=Lexend:wght@400;500;600;700&family=Karla:ital,wght@0,400;0,500;0,600;0,700;1,400&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  --ink:#142036;
  --ink-soft:#49597a;
  --ink-faint:#8292ab;
  --paper:#F2F5F8;
  --surface:#ffffff;
  --line:#D9E1E9;
  --accent:#1D8FA0;
  --accent-strong:#0E6978;
  --accent-ink:#ffffff;
  --shadow: 0 1px 2px rgba(20,32,54,.04), 0 8px 24px -12px rgba(20,32,54,.18);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ink:#EAEFF5; --ink-soft:#AEBBCE; --ink-faint:#7686A0;
    --paper:#0E1620; --surface:#141E2B; --line:#223247;
    --accent:#3FC3D6; --accent-strong:#6DD8E6; --accent-ink:#05282D;
    --shadow: 0 1px 2px rgba(0,0,0,.3), 0 12px 32px -16px rgba(0,0,0,.6);
  }
}
:root[data-theme="dark"]{
  --ink:#EAEFF5; --ink-soft:#AEBBCE; --ink-faint:#7686A0;
  --paper:#0E1620; --surface:#141E2B; --line:#223247;
  --accent:#3FC3D6; --accent-strong:#6DD8E6; --accent-ink:#05282D;
  --shadow: 0 1px 2px rgba(0,0,0,.3), 0 12px 32px -16px rgba(0,0,0,.6);
}

*{box-sizing:border-box;}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:'Karla',system-ui,-apple-system,sans-serif;
  font-size:16px; line-height:1.6;
}
a{color:inherit;}
h1,h2{font-family:'Lexend',system-ui,sans-serif; text-wrap:balance; letter-spacing:-.01em; color:var(--ink);}
.wrap{max-width:760px; margin:0 auto; padding:0 24px;}

header{border-bottom:1px solid var(--line); padding:20px 0; margin-bottom:8px;}
.header-row{display:flex; align-items:center; justify-content:space-between; gap:16px;}
.brand-text{font-family:'Lexend'; font-weight:700; font-size:22px; letter-spacing:-.015em; text-decoration:none;}
.brand-text em{font-style:normal; color:var(--accent-strong);}
.back{
  font-family:'Lexend'; font-weight:500; font-size:14px; color:var(--ink-soft);
  text-decoration:none; display:inline-flex; align-items:center; gap:6px;
}
.back:hover{color:var(--accent-strong);}

main{padding:52px 0 72px;}
.eyebrow{
  font-family:'IBM Plex Mono',monospace; font-size:12.5px; letter-spacing:.09em;
  text-transform:uppercase; color:var(--accent-strong); font-weight:500;
}
h1{font-size:clamp(28px,4vw,38px); font-weight:600; margin:10px 0 6px;}
.updated{font-size:13.5px; color:var(--ink-faint); margin-bottom:40px;}
h2{font-size:19px; font-weight:600; margin:38px 0 12px;}
p{color:var(--ink-soft); font-size:15.5px; margin:0 0 14px;}
ul{color:var(--ink-soft); font-size:15.5px; padding-left:20px; margin:0 0 14px;}
li{margin-bottom:8px;}
strong{color:var(--ink);}
.callout{
  background:var(--surface); border:1px solid var(--line); border-radius:14px;
  padding:20px 22px; box-shadow:var(--shadow); margin:28px 0;
}
.callout p{margin:0; font-size:14.5px;}

footer{border-top:1px solid var(--line); padding:24px 0; font-size:13px; color:var(--ink-faint);}