:root{
  --banana:#F5C518;
  --banana-dark:#C9960A;
  --charcoal:#1A1712;
  --panel:#241E15;
  --panel-light:#2E2718;
  --cream:#FFF6E0;
  --leaf:#7A9A3C;
  --ember:#E8622C;
  --border-dark: rgba(0,0,0,.55);
  --border-light: rgba(255,255,255,.18);
}
*{box-sizing:border-box; margin:0; padding:0;}
body{
  background:var(--charcoal);
  color:var(--cream);
  font-family:'Rubik', sans-serif;
  line-height:1.6;
}
a{color:var(--banana); text-decoration:none;}
a:hover{ text-decoration:underline; }
.pixel{ font-family:'Press Start 2P', monospace; }
.mono{ font-family:'JetBrains Mono', monospace; }

.bevel{
  border-radius:4px;
  box-shadow:
    inset 2px 2px 0 var(--border-light),
    inset -3px -3px 0 var(--border-dark);
}
.bevel-btn{
  border-radius:4px;
  box-shadow:
    inset 2px 2px 0 var(--border-light),
    inset -3px -3px 0 var(--border-dark);
  transition: transform .08s ease;
}
.bevel-btn:active{ transform: translateY(2px); }

header{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px clamp(20px,5vw,64px);
  background:rgba(26,23,18,0.9);
  border-bottom:3px solid var(--panel-light);
}
.logo{
  display:flex; align-items:center; gap:10px;
  font-size:13px; color:var(--banana);
}
.logo span.dot{
  width:10px;height:10px;background:var(--leaf);
  display:inline-block;
}
.back-link{ font-size:13px; font-weight:600; color:var(--cream); opacity:.85; }
.back-link:hover{ color:var(--banana); }

main{
  max-width:820px; margin:0 auto;
  padding:clamp(40px,6vw,80px) clamp(20px,5vw,64px) 100px;
}
main h1{
  font-family:'Press Start 2P', monospace;
  font-size:clamp(20px,3vw,30px);
  line-height:1.5;
  margin-bottom:8px;
}
main .updated{
  font-family:'JetBrains Mono', monospace;
  font-size:12px; color:rgba(255,246,224,0.5);
  margin-bottom:40px;
}
main h2{
  font-size:19px; margin:36px 0 12px;
  color:var(--banana);
}
main p, main li{
  font-size:15px; color:rgba(255,246,224,0.8);
  margin-bottom:14px;
}
main ul{ padding-left:20px; }
main .callout{
  background:var(--panel); padding:18px 22px;
  font-size:13.5px; color:rgba(255,246,224,0.7);
  margin:28px 0;
}
main .callout b{ color:var(--banana); }

footer{
  border-top:3px solid var(--panel-light);
  padding:40px clamp(20px,5vw,64px) 50px;
  display:flex; flex-wrap:wrap; gap:20px;
  align-items:center; justify-content:space-between;
  font-size:12.5px; color:rgba(255,246,224,0.5);
  max-width:1320px; margin:0 auto;
}
footer .flinks{ display:flex; gap:22px; }

.changelog-entry{
  background:var(--panel);
  padding:24px 26px;
  margin-bottom:16px;
}
.changelog-entry .v{
  display:flex; align-items:center; gap:12px;
  margin-bottom:10px;
}
.changelog-entry .v .num{
  font-family:'JetBrains Mono', monospace;
  font-weight:700; color:var(--banana); font-size:15px;
}
.changelog-entry .v .date{
  font-family:'JetBrains Mono', monospace;
  font-size:12px; color:rgba(255,246,224,0.45);
}
.changelog-entry ul{ margin-top:8px; }
.changelog-entry li{ font-size:14px; margin-bottom:6px; }
.tag-new{ background:var(--leaf); color:var(--charcoal); font-size:10px; font-weight:700; padding:2px 7px; font-family:'JetBrains Mono',monospace;}
.tag-fix{ background:var(--panel-light); color:var(--cream); font-size:10px; font-weight:700; padding:2px 7px; font-family:'JetBrains Mono',monospace;}