.pb-back-to-top {
	position: fixed;
	right: var(--pb-space-5);
	bottom: var(--pb-space-5);
	z-index: 100;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--pb-surface);
	color: var(--pb-accent);
	box-shadow: var(--pb-shadow-md);
	transition: opacity var(--pb-motion-base) var(--pb-ease-standard), transform var(--pb-motion-base) var(--pb-ease-standard), color var(--pb-motion-fast) var(--pb-ease-standard), background-color var(--pb-motion-fast) var(--pb-ease-standard), box-shadow var(--pb-motion-fast) var(--pb-ease-standard);
}

/* JS'siz durumda buton her zaman görünür/işlevsel kalır (native #masthead
   anchor'ı çalışır) — kaydırmaya göre gizle/göster SADECE .pb-js varken. */
.pb-js .pb-back-to-top {
	opacity: 0;
	visibility: hidden;
	transform: translateY(12px);
	pointer-events: none;
}

.pb-js .pb-back-to-top.is-visible {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
	pointer-events: auto;
}

/* .is-visible ile birlikte hedeflenir (bkz. yukarı) — hover/focus rengi
   header'daki arama/hamburger ikon-butonlarıyla VE footer'daki RSS
   ikon-butonuyla AYNI dili konuşuyor (soft accent zemin + accent-strong
   ikon), sitenin geri kalanından kopuk, tam-ters-dolgu bir "FAB" görünümü
   yerine. :hover kısmı gerçek fare/pointer cihazlarıyla sınırlı — dokunmatik
   ekranlarda tarayıcılar bir dokunuştan sonra :hover'ı "yapışık" bırakabilir,
   dokunmatikte SADECE :focus-visible (klavye) geçerli kalıyor. */
@media (hover: hover) and (pointer: fine) {
	.pb-js .pb-back-to-top.is-visible:hover {
		color: var(--pb-accent-strong);
		background: var(--pb-accent-soft);
		transform: translateY(-2px);
		box-shadow: var(--pb-shadow-lg);
	}
}

.pb-js .pb-back-to-top.is-visible:focus-visible {
	color: var(--pb-accent-strong);
	background: var(--pb-accent-soft);
	transform: translateY(-2px);
	box-shadow: var(--pb-shadow-lg);
}

.pb-back-to-top .pb-icon {
	width: 20px;
	height: 20px;
	transform: rotate(180deg);
}