.btn{ border-radius:14px; padding:12px 16px; font-size:14px; font-weight:600; border:none; cursor:pointer; font-family:inherit; }
.btn-outline{ background:transparent; color:var(--primary); border:1.5px solid var(--primary); width:100%; }
.btn-small{ width:auto; padding:8px 14px; border-radius:11px; font-size:12.5px; white-space:nowrap; }
.btn:disabled{ opacity:.55; cursor:default; }
.btn svg{ width:16px; height:16px; vertical-align:-3px; margin-inline-end:6px; }
.icon-btn{ width:36px; height:36px; border-radius:12px; display:flex; align-items:center; justify-content:center; background:var(--card); border:1px solid var(--border); color:var(--text); cursor:pointer; }
.icon-btn svg{width:16px; height:16px;}
.icon-btn-sm{ flex:0 0 auto; width:22px; height:22px; border:none; background:none; color:var(--text-muted); display:flex; align-items:center; justify-content:center; cursor:pointer; padding:0; }
.icon-btn-sm svg{ width:14px; height:14px; }
.icon-btn-sm:hover{ color:var(--primary); }
/* Sun/moon cross-fade, same technique as the marketing site's header
   toggle (assets/css/site.css) — both icons stay in the DOM, stacked
   and absolutely positioned, swapping via opacity+rotate+scale instead
   of display:none so it animates instead of popping. */
.theme-toggle-btn{
  margin-inline-start:auto; flex:0 0 auto; position:relative; overflow:hidden;
  width:32px; height:32px; border-radius:50%; border:none; background:var(--bg-soft);
  color:var(--text-muted); cursor:pointer;
}
.theme-toggle-btn svg{
  position:absolute; top:50%; left:50%; width:16px; height:16px;
  transform:translate(-50%,-50%) rotate(0deg) scale(1); opacity:1;
  transition:transform .3s cubic-bezier(.22,1,.36,1), opacity .25s ease, color .25s ease;
}
.theme-toggle-btn .icon-moon{ opacity:0; transform:translate(-50%,-50%) rotate(-90deg) scale(.4); }
.link-btn{ flex:0 0 auto; font-size:12px; font-weight:600; color:var(--primary); cursor:pointer; }
.link-btn svg{ width:14px; height:14px; display:block; }
/* ===== auth screen ===== */
.btn-primary{ background:var(--primary); color:var(--on-primary); }