:root{
 --bg:#0b1020;
 --card:#111a33;
 --text:#e9eefc;
 --muted:#aab5d6;
 --accent:#7aa2ff;
 --border:#24315d;
}

*{
 box-sizing:border-box;
}

body{
 margin:0;
 font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
 background:linear-gradient(180deg,var(--bg),#060914);
 color:var(--text);
}

header{
 padding:24px 18px 12px;
 border-bottom:1px solid var(--border);
 position:sticky;
 top:0;
 background:rgba(11,16,32,.92);
 backdrop-filter:blur(6px);
 z-index:10;
}

header h1{
 margin:0;
 font-size:20px;
}

header p{
 margin:6px 0 0;
 color:var(--muted);
 font-size:13px;
 max-width:1100px;
}

main{
 padding:18px;
 max-width:1200px;
 margin:0 auto;
}

section{
 background:rgba(17,26,51,.78);
 border:1px solid var(--border);
 border-radius:16px;
 padding:16px;
 margin:14px 0;
 box-shadow:0 10px 30px rgba(0,0,0,.25);
 scroll-margin-top:100px;
}

section h2{
 margin:0 0 10px;
 font-size:16px;
}

section p{
 margin:6px 0 0;
 color:var(--muted);
 font-size:13px;
 line-height:1.45;
}

.badge{
 display:inline-block;
 margin-left:8px;
 padding:2px 8px;
 border:1px solid var(--border);
 border-radius:999px;
 font-size:11px;
 color:var(--muted);
}

a{
 color:var(--accent);
 text-decoration:none;
}

nav{
 margin-top:10px;
 display:flex;
 gap:10px;
 flex-wrap:wrap;
}

nav a{
 font-size:13px;
 padding:6px 10px;
 border:1px solid var(--border);
 border-radius:999px;
}

.tablewrap{
 overflow:auto;
 border:1px solid var(--border);
 border-radius:12px;
}

table{
 width:100%;
 border-collapse:separate;
 border-spacing:0;
 min-width:520px;
 background:rgba(6,9,20,.55);
}

th,td{
 padding:10px 12px;
 border-bottom:1px solid var(--border);
 text-align:left;
 font-size:13px;
 vertical-align:top;
}

th{
 position:sticky;
 top:0;
 background:rgba(17,26,51,.95);
 color:var(--text);
 font-weight:700;
}

tr:last-child td{
 border-bottom:0;
}

small{
 color:var(--muted);
}

.grid{
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:14px;
}

@media (max-width:980px){
 .grid{grid-template-columns:1fr;}
 table{min-width:420px;}
}

.grid4{
 display:grid;
 grid-template-columns:repeat(auto-fit, minmax(125px, 1fr));
 gap:14px;
}

.grid4 table{
 min-width:100%;
}

pre{
 white-space:pre-wrap;
 word-break:break-word;
 background:rgba(6,9,20,.55);
 border:1px solid var(--border);
 border-radius:12px;
 padding:12px;
 color:#dfe7ff;
 font-size:12px;
 line-height:1.5;
}

footer{
 padding:22px 18px 44px;
 color:var(--muted);
 text-align:center;
 font-size:12px;
}