:root{
  --a0036-bg:#f6f8fb;
  --a0036-card:#ffffff;
  --a0036-ink:#0f172a;
  --a0036-muted:#64748b;
  --a0036-accent:#14b8a6;
  --a0036-line: rgba(15,23,42,.10);
}

body.theme-a0036{
  background:
    radial-gradient(900px 480px at 20% 0%, rgba(20,184,166,.12), transparent 55%),
    radial-gradient(900px 480px at 80% 5%, rgba(99,102,241,.10), transparent 58%),
    var(--a0036-bg);
  color: var(--a0036-ink);
}

.top{position: sticky; top:0; z-index: 50; background: rgba(255,255,255,.82); backdrop-filter: blur(10px); border-bottom: 1px solid var(--a0036-line);}
.bar{display:flex; align-items:center; justify-content: space-between; gap: 1rem; padding: 1rem 0;}

#logo a{font-weight: 800; text-decoration:none; color: var(--a0036-ink);}
.tagline{margin: .3rem 0 1rem; color: var(--a0036-muted);} 
.tagline p{margin:.25rem 0;}

.panes-grid{display:grid; grid-template-columns: minmax(0,1fr) 320px; gap: 1rem; align-items:start; padding: 1rem 0 2rem;}

.panel{background: rgba(255,255,255,.80); border: 1px solid var(--a0036-line); border-radius: 14px;}
.panel .panel-body{padding: 1rem;}

.menu .menu-item a{color: var(--a0036-ink);}
.menu .menu-item.active a{color: var(--a0036-accent); font-weight: 800;}

.chips{display:flex; flex-wrap: wrap; gap: .4rem; margin-top: .4rem;}
.chip{border: 1px solid var(--a0036-line); background: rgba(255,255,255,.75); border-radius: 999px; padding: .25rem .6rem; cursor:pointer;}

.content-body :is(h1,h2,h3){scroll-margin-top: 6rem;}

@media (max-width: 980px){
  .panes-grid{grid-template-columns: 1fr;}
}

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