:root{
  --obsidian:#080a0f; --obsidian-1:#0e121b; --obsidian-2:#141926;
  --gold:#d4b45c; --gold-light:#efd694; --gold-dim:#b0913c;
  --silver:#e2e9f4; --ash:#8494ad; --text:#d3dded; --text-dim:#9aabc4;
  --jade-txt:#6fd7ab; --jade-dim:rgba(75,185,143,.15);
  --border-g:rgba(212,180,92,.24); --border-s:rgba(212,220,232,.13);
  --sans:'Syne',system-ui,sans-serif; --serif:'Cormorant Garamond',serif;
  --mono:'DM Mono',ui-monospace,monospace;
}
*{box-sizing:border-box}
body{margin:0; background:var(--obsidian); color:var(--text); font-family:var(--sans);
  -webkit-font-smoothing:antialiased; line-height:1.75}
.wrap{max-width:860px; margin:0 auto; padding:0 30px}
nav{border-bottom:1px solid var(--border-s); background:rgba(8,10,15,.94); position:sticky; top:0; z-index:9}
nav .wrap{display:flex; align-items:center; justify-content:space-between; gap:20px; height:70px}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none; color:inherit}
.brand b{font-size:13px; font-weight:800; letter-spacing:.26em; color:var(--gold-light); display:block}
.brand span{font-size:8px; letter-spacing:.3em; color:var(--ash); text-transform:uppercase; display:block; margin-top:3px}
nav a.back{font-size:10px; letter-spacing:.18em; text-transform:uppercase; color:var(--text-dim); text-decoration:none}
nav a.back:hover{color:var(--gold-light)}
header{padding:74px 0 30px; border-bottom:1px solid var(--border-s)}
.eyebrow{font-family:var(--mono); font-size:10px; letter-spacing:.24em; color:var(--gold); text-transform:uppercase}
h1{font-family:var(--serif); font-weight:300; font-size:clamp(32px,5vw,48px); line-height:1.1;
  margin:18px 0 14px; color:#fff}
.meta{font-family:var(--mono); font-size:11px; color:var(--ash)}
main{padding:44px 0 90px}
h2{font-family:var(--serif); font-weight:400; font-size:26px; color:#fff; margin:48px 0 16px}
h3{font-size:14px; font-weight:700; color:var(--silver); margin:30px 0 10px; letter-spacing:.01em}
p{font-size:14.5px; color:var(--text-dim); margin:0 0 18px}
ul{padding-left:20px; margin:0 0 18px}
li{font-size:14.5px; color:var(--text-dim); margin-bottom:9px}
strong{color:var(--silver); font-weight:600}
code,.mono{font-family:var(--mono); font-size:13px; color:var(--gold-light)}
table{width:100%; border-collapse:collapse; margin:0 0 22px; font-size:13.5px}
th,td{text-align:left; padding:11px 12px; border-bottom:1px solid var(--border-s); vertical-align:top}
th{font-family:var(--sans); font-size:9px; letter-spacing:.18em; text-transform:uppercase; color:var(--ash); font-weight:700}
td{color:var(--text-dim)}
td strong{color:var(--silver)}
.note{border-left:2px solid var(--gold); padding:14px 0 14px 20px; margin:26px 0}
.note p{margin:0; color:var(--silver)}
.pending{border:1px solid var(--border-g); background:rgba(212,180,92,.06); padding:22px 24px; margin:22px 0}
.pending h3{margin-top:0; color:var(--gold-light)}
.pending p:last-child{margin-bottom:0}
.st{font-family:var(--mono); font-size:9px; letter-spacing:.14em; text-transform:uppercase;
  padding:3px 9px; border:1px solid var(--border-s); color:var(--ash); white-space:nowrap}
.st.pub{border-color:rgba(75,185,143,.45); background:var(--jade-dim); color:var(--jade-txt)}
a{color:var(--gold-light)}
footer{border-top:1px solid var(--border-s); padding:34px 0; font-size:10px;
  letter-spacing:.16em; text-transform:uppercase; color:var(--ash)}
footer .wrap{display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap}
footer a{color:var(--ash); text-decoration:none}
footer a:hover{color:var(--gold-light)}
@media(max-width:640px){ h2{font-size:22px} .wrap{padding:0 20px} }
