:root{
  --a0033-bg:#fbf7ef;
  --a0033-ink:#1f2937;
  --a0033-accent:#2f855a;
  --a0033-line: rgba(31,41,55,.10);
}

body.theme-a0033{
  background: linear-gradient(180deg, #fffdf9 0%, var(--a0033-bg) 55%, #ffffff 100%);
  color: var(--a0033-ink);
  padding-bottom: 4.2rem;
}

header.headroom{
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(255,255,255,.85);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--a0033-line);
}

#logo a{font-weight: 800; text-decoration: none; color: var(--a0033-ink);}
.tag-pill{display:inline-block; padding:.25rem .6rem; border-radius:999px; border:1px solid var(--a0033-line); font-size:.85rem;}

.split{
  display:grid;
  grid-template-columns: 360px 1fr;
  min-height: calc(100vh - 140px);
  gap: 1rem;
  padding: 1rem;
}

.pane-info{position: sticky; top: 96px; align-self: start; height: fit-content;}
.content-wrap{max-width: 920px;}

.tabbar{
  position: fixed;
  inset: auto 0 0 0;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
  border-top: 1px solid var(--a0033-line);
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  z-index: 60;
}

.tabbar .tab{padding: .75rem .5rem; text-align:center; color: var(--a0033-ink); text-decoration: none;}
.tabbar .tab.is-active{color: var(--a0033-accent); font-weight: 700;}
.tab-title{display:block; font-size:.9rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

@media (max-width: 980px){
  .split{grid-template-columns: 1fr;}
  .pane-info{position: static;}
}

#footer{padding: 2.5rem 0;}
#footer .social [class^="icon-"]{display:inline-block;width:1.25rem;height:1.25rem;border-radius:999px;background:currentColor;opacity:.18;vertical-align:middle;}