:root{
  --bg: #f2f8f7;
  --rail: #0f766e;
  --rail2: #6d28d9;
  --panel: #ffffff;
  --ink: #0b1220;
}

body{background:linear-gradient(120deg, rgba(15,118,110,.10), rgba(109,40,217,.08)), var(--bg); color:var(--ink);}
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;}

.split{min-height:100vh; display:grid; grid-template-columns: 300px minmax(0, 1fr);}
.rail{background:linear-gradient(160deg, rgba(15,118,110,.95), rgba(109,40,217,.85)); color:#fff; padding:1.2rem 1rem; position:sticky; top:0; height:100vh; overflow:auto;}
#logo a{color:#fff; font-weight:900; text-decoration:none;}
.rail__tagline{opacity:.9; font-size:.9rem; margin-top:.35rem;}
.rail__nav{margin-top:1rem;}
.rail__nav ul{list-style:none; padding:0; margin:0; display:grid; gap:.35rem;}
.rail__link{display:flex; gap:.55rem; align-items:center; padding:.5rem .6rem; border-radius:10px; color:#fff; text-decoration:none; background:rgba(255,255,255,.08);}
.rail__link:hover{background:rgba(255,255,255,.14);}
.rail__link.is-active{background:rgba(255,255,255,.22);}
.rail__scrollspy{margin-top:1rem; padding-top:1rem; border-top:1px solid rgba(255,255,255,.18);}
.rail__label{font-size:.75rem; letter-spacing:.08em; text-transform:uppercase; opacity:.85; margin-bottom:.5rem;}
.toc{list-style:none; padding:0; margin:0; display:grid; gap:.25rem;}
.toc a{color:#fff; text-decoration:none; opacity:.85; font-size:.9rem;}
.toc a.is-current{opacity:1; text-decoration:underline;}

.panel{padding:1.25rem;}
.panel__header{display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1rem;}
.panel__badge{font-weight:800; background:#fff; border:1px solid rgba(0,0,0,.08); border-radius:999px; padding:.35rem .7rem;}
.content{background:var(--panel); border:1px solid rgba(0,0,0,.08); border-radius:16px; padding:1.25rem;}

@media (max-width: 920px){
  .split{grid-template-columns: 1fr;}
  .rail{position:relative; height:auto;}
}

#footer{background:#fff; border-top:1px solid rgba(0,0,0,.08);}
#footer .container{max-width:1100px; margin:0 auto; padding:1.2rem;}