:root{
  --a0064-bg: #f7fbfb;
  --a0064-surface: #ffffff;
  --a0064-border: #d9f0ef;
  --a0064-ink: #0f172a;
  --a0064-muted: #475569;
  --a0064-accent: #0ea5a4;
}

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

.a0064-split{
  display:grid;
  grid-template-columns: 1fr 320px;
  gap:16px;
  align-items:start;
}

.a0064-card{
  background:var(--a0064-surface);
  border:1px solid var(--a0064-border);
  border-radius:16px;
  padding:16px;
}

.a0064-rail{
  position:sticky;
  top:16px;
}

.a0064-top{
  position:sticky;
  top:0;
  z-index:50;
  background: color-mix(in srgb, var(--a0064-bg) 75%, transparent);
  backdrop-filter: blur(10px) saturate(150%);
  border-bottom: 1px solid var(--a0064-border);
}

.a0064-top .container{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding: 12px 16px;
}

#logo a{
  text-decoration:none;
  color:inherit;
  font-weight:800;
}

.a0064-nav{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.a0064-nav a{ text-decoration:none; color:var(--a0064-muted); padding:6px 10px; border-radius:999px; }
.a0064-nav a:hover{ background:#e8fbfa; color:var(--a0064-ink); }

.a0064-toc a{ display:block; padding:8px 10px; border-radius:10px; text-decoration:none; color:var(--a0064-muted); }
.a0064-toc a:hover{ background:#e8fbfa; }
.a0064-toc a.is-active{ background:#d4f7f5; color:var(--a0064-accent); font-weight:700; }

@media (max-width: 960px){
  .a0064-split{ grid-template-columns: 1fr; }
  .a0064-rail{ position:static; }
}