:root{
  --bg:#eef2f4;
  --ink:#12212b;
  --muted:#51606c;
  --pane:#ffffff;
  --accent:#14b8a6;
  --accent2:#0ea5e9;
  --line:rgba(18,33,43,.12);
}

body.theme-b0002{background:var(--bg); color:var(--ink);}

.split{
  display:grid;
  grid-template-columns: 340px minmax(0,1fr);
  min-height:100vh;
}

.left-pane{
  background:linear-gradient(180deg, rgba(20,184,166,.10), rgba(14,165,233,.08));
  border-right:1px solid var(--line);
  padding:1.2rem 1rem;
}

.right-pane{padding:1.2rem;}

#logo a{font-weight:800; letter-spacing:.2px; color:var(--ink); text-decoration:none;}

.tagline{color:var(--muted); font-size:.95rem;}

.navlist a{display:flex; align-items:center; gap:.5rem; padding:.45rem .6rem; border-radius:10px; color:var(--ink); text-decoration:none;}
.navlist a:hover{background:rgba(20,184,166,.10);}
.navlist a.is-active{background:rgba(14,165,233,.12);}

.content-surface{
  background:var(--pane);
  border:1px solid var(--line);
  border-radius:16px;
  padding:1rem;
}

#footer{margin-top:2rem; padding:1.75rem 0; border-top:1px solid var(--line);}

.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;}

@media (max-width: 959px){
  .split{grid-template-columns: 1fr;}
  .left-pane{display:none;}
}