.back-to-top {
  position:fixed; z-index:40; right:max(20px,env(safe-area-inset-right)); bottom:var(--top-button-bottom,24px);
  width:50px; height:50px; padding:12px; display:grid; place-items:center;
  border:1px solid var(--line,rgba(23,25,20,.2)); border-radius:14px;
  background:var(--panel,#fbfaf4); color:var(--ink,#171914);
  box-shadow:0 4px 16px rgba(23,25,20,.07); cursor:pointer;
  opacity:0; visibility:hidden; pointer-events:none; transform:translateY(10px);
  transition:opacity .2s,transform .2s,visibility .2s,border-color .2s;
}
.back-to-top.is-visible { opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0); }
.back-to-top svg { width:23px; height:23px; stroke:currentColor; stroke-width:1.6; fill:none; stroke-linecap:round; stroke-linejoin:round; transition:transform .2s; }
.back-to-top::after { content:""; position:absolute; right:7px; top:7px; width:4px; height:4px; border-radius:50%; background:var(--orange,#ff5636); }
.back-to-top:hover { border-color:var(--muted,#5f635b); }.back-to-top:hover svg { transform:translateY(-3px); }
.back-to-top:focus-visible { outline:2px solid var(--orange,#ff5636); outline-offset:4px; }
@media(max-width:780px) { .back-to-top { right:max(14px,env(safe-area-inset-right)); width:46px; height:46px; padding:11px; border-radius:12px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.back-to-top,.back-to-top svg { transition:none; } }
