@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');

:root{
  --bg: #07090d;
  --bg-panel: #11141b;
  --steel: #2c323d;
  --steel-light: #3d4452;
  --gold: #d4a73c;
  --gold-bright: #e8b54a;
  --gold-dim: #8a6d28;
  --text: #e7e9ee;
  --text-dim: #9aa1ad;
  --text-faint: #5c6270;
}
*{ box-sizing: border-box; margin:0; padding:0; }
body{
  background: var(--bg);
  color: var(--text);
  font-family: 'Inter', sans-serif;
  line-height: 1.65;
}
a{ color: var(--gold-bright); }
h1,h2,h3{
  font-family: 'Oswald', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  font-weight: 600;
  color: var(--text);
}
.skip-link{
  position: absolute; left: -999px; top: 0;
  background: var(--gold); color: #0a0c10; padding: 12px 20px; z-index: 100;
  font-family:'Oswald',sans-serif;
}
.skip-link:focus{ left: 12px; top: 12px; }
header{
  background: rgba(7,9,13,0.9);
  border-bottom: 1px solid var(--steel);
  padding: 16px 32px;
}
.nav{
  display:flex; align-items:center; justify-content: space-between;
  max-width: 900px; margin: 0 auto;
}
.brand{ display:flex; align-items:center; gap: 12px; }
.brand img{ width: 34px; height: 34px; display:block; }
.brand-text{ font-family:'Oswald',sans-serif; font-size: 15px; letter-spacing: 0.08em; line-height:1.1; }
.brand-text b{ color: var(--gold); }
.back-link{ font-size: 14px; color: var(--text-dim); }
.back-link:hover{ color: var(--gold-bright); }

main{ max-width: 780px; margin: 0 auto; padding: 70px 32px 100px; }
main h1{ font-size: clamp(28px,4vw,38px); margin-bottom: 10px; }
main .updated{ color: var(--text-faint); font-family:'JetBrains Mono',monospace; font-size: 12.5px; margin-bottom: 44px; }
main h2{ font-size: 19px; margin-top: 40px; margin-bottom: 14px; }
main p, main li{ color: var(--text-dim); font-size: 15px; margin-bottom: 14px; }
main ul, main ol{ padding-left: 22px; margin-bottom: 14px; }
main table{ width:100%; border-collapse: collapse; margin: 20px 0; font-size: 14px; }
main th, main td{ text-align:left; padding: 10px 12px; border: 1px solid var(--steel); color: var(--text-dim); }
main th{ color: var(--text); background: var(--bg-panel); font-family:'JetBrains Mono',monospace; font-size: 12.5px; text-transform: uppercase; letter-spacing: 0.05em; }
.tag{
  font-family:'JetBrains Mono',monospace; color: var(--gold); font-size: 13px;
  letter-spacing: 0.14em; text-transform: uppercase; display:block; margin-bottom: 14px;
}
footer{
  border-top: 1px solid var(--steel); padding: 30px 32px; text-align:center;
  color: var(--text-faint); font-size: 13px;
}
footer a{ color: var(--text-faint); margin: 0 10px; }
footer a:hover{ color: var(--gold-bright); }
a:focus-visible, button:focus-visible{ outline: 2px solid var(--gold); outline-offset: 2px; }