:root{
  --a0063-bg:#fbfaf7;
  --a0063-ink:#111827;
  --a0063-muted:#6b7280;
  --a0063-border:#efe7dd;
  --a0063-accent:#8b5cf6;
  --a0063-surface:#ffffff;
}

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

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

#logo a{ display:flex; align-items:center; gap:10px; text-decoration:none; color:inherit; }

.a0063-wrap{
  display:grid;
  grid-template-columns: 1.35fr .65fr;
  gap:16px;
}

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

.a0063-pane{ display:grid; gap:16px; position:sticky; top:72px; align-self:start; }

.a0063-drawer{
  position:fixed;
  top:0;
  right:0;
  height:100vh;
  width:min(360px, 92vw);
  transform: translateX(110%);
  transition: transform .2s ease;
  background:var(--a0063-surface);
  border-left:1px solid var(--a0063-border);
  z-index:80;
  padding:16px;
}

body[data-drawer="1"] .a0063-drawer{ transform: translateX(0); }

.a0063-backdrop{
  position:fixed;
  inset:0;
  background: rgba(17,24,39,.35);
  z-index:70;
  display:none;
}
body[data-drawer="1"] .a0063-backdrop{ display:block; }

.a0063-nav a{
  display:block;
  padding:10px 10px;
  border-radius:12px;
  text-decoration:none;
  color:inherit;
}
.a0063-nav a:hover{ background:#f5f3ff; }
.a0063-nav a.is-active{ background:#ede9fe; color:var(--a0063-accent); font-weight:700; }

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