:root{
  --stage-0:#0d0f14;--fg:#f4ede0;--mut:#9a9488;--spark:#ff6b1a;--spark-2:#ffb03a;
  --disp:'Fraunces',Georgia,serif;--body:'Space Grotesk',system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--stage-0);color:var(--fg);font-family:var(--body);font-weight:300;line-height:1.75;-webkit-font-smoothing:antialiased}
a{color:var(--spark-2)}
.wrap{max-width:760px;margin:0 auto;padding:60px clamp(20px,5vw,40px) 100px}
header{display:flex;justify-content:space-between;align-items:center;padding:24px clamp(20px,5vw,40px);border-bottom:1px solid #ffffff12;position:sticky;top:0;background:rgba(13,15,20,.85);backdrop-filter:blur(10px);z-index:10}
.brand{font-family:var(--disp);font-size:22px}
header nav a{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--mut);margin-left:22px}
header nav a:hover{color:var(--spark-2)}
h1{font-family:var(--disp);font-weight:400;font-size:clamp(34px,6vw,54px);line-height:1.05;margin:30px 0 10px}
.updated{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut);margin-bottom:40px}
h2{font-family:var(--disp);font-weight:500;font-size:clamp(20px,3vw,26px);margin:44px 0 14px;color:var(--fg)}
h3{font-size:16px;font-weight:500;margin:26px 0 8px;color:var(--spark-2)}
p,li{color:#d8d2c6;font-size:15px;margin-bottom:14px}
ul{margin:0 0 14px 22px}
li{margin-bottom:8px}
.note{border:1px solid var(--spark);background:rgba(255,107,26,.08);border-radius:8px;padding:18px 20px;margin:30px 0;font-size:14px;color:var(--spark-2)}
.back{display:inline-block;margin-top:50px;font-size:13px;letter-spacing:.14em;text-transform:uppercase;border:1px solid #ffffff2a;padding:12px 24px;border-radius:100px;color:var(--fg)}
.back:hover{border-color:var(--spark);color:var(--spark-2)}
footer{border-top:1px solid #ffffff12;padding:40px clamp(20px,5vw,40px);font-size:12px;color:var(--mut);text-align:center}