:root{
  --bg:#140506; --bg2:#1c070a; --panel:#24090c; --line:rgba(252,192,84,.18);
  --text:#fbf4e7; --muted:#c2a58f;
  --red:#9c0000; --red-dk:#6c0000; --red-br:#d80000;
  --gold:#fcc054; --gold-lt:#f7e4b6; --gold-dk:#c9902c;
  --max:760px;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);background-image:radial-gradient(900px 600px at 78% -5%,rgba(156,0,0,.45),transparent 60%);background-attachment:fixed;
color:var(--text);font-family:Inter,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.65;-webkit-font-smoothing:antialiased}
a{color:var(--gold)}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
header{position:sticky;top:0;z-index:20;background:rgba(20,5,6,.86);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:64px;max-width:1120px;margin:0 auto;padding:0 20px}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:-.4px;text-decoration:none;font-size:20px;color:var(--text)}
.logo img{height:32px;width:auto;display:block}
.logo span{background:linear-gradient(180deg,var(--gold-lt),var(--gold) 45%,var(--gold-dk));-webkit-background-clip:text;background-clip:text;color:transparent}
.nav .back{color:var(--muted);text-decoration:none;font-size:14px}
.nav .back:hover{color:var(--gold)}
main.wrap{padding:64px 20px 72px}
h1{scroll-margin-top:80px}
h1{font-size:clamp(30px,5vw,44px);letter-spacing:-1.2px;line-height:1.1;margin:0 0 8px;font-weight:800}
.updated{color:var(--muted);font-size:14px;margin:0 0 10px}
.note{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:16px 18px;color:var(--muted);font-size:14.5px;margin:22px 0 34px}
h2{font-size:21px;letter-spacing:-.4px;margin:36px 0 10px;color:var(--gold)}
h3{font-size:17px;margin:24px 0 6px}
p{margin:0 0 14px;color:#eadfd0}
ul{margin:0 0 14px;padding-left:20px;color:#eadfd0}
li{margin:6px 0}
strong{color:var(--text)}
hr{border:0;border-top:1px solid var(--line);margin:40px 0}
footer{border-top:1px solid var(--line);padding:28px 0 40px;color:var(--muted);font-size:14px}
footer a{color:var(--muted);text-decoration:none}
footer a:hover{color:var(--gold)}
.foot-row{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;max-width:1120px;margin:0 auto;padding:0 20px}
@media (max-width:640px){
  .nav{height:58px}
  .logo{font-size:18px}
  .logo img{height:28px}
  .nav .back{font-size:0}
  .nav .back:after{content:"← Back";font-size:14px}
  main.wrap{padding:44px 20px 64px}
  h1{font-size:clamp(28px,8vw,36px)}
  h2{font-size:19px;margin-top:30px}
}