html.dtc-auto-scrolling { scroll-behavior: auto !important; }
body .dtc-guest-tools > #dtc-auto-scroll { --dtc-guest-button-color: #565d64; }
body .dtc-guest-tools > #dtc-auto-scroll[aria-pressed="true"] { --dtc-guest-button-color: #a5262d; }
body #dtc-auto-scroll > .dtc-scroll-pause { display: none; }
body #dtc-auto-scroll[aria-pressed="true"] > .dtc-scroll-play { display: none; }
body #dtc-auto-scroll[aria-pressed="true"] > .dtc-scroll-pause { display: block; }
@media (prefers-reduced-motion: no-preference) {
	body #dtc-auto-scroll[aria-pressed="false"] > .dtc-scroll-play { animation: dtc-guest-scroll-hint 2.8s ease-in-out .8s infinite !important; }
	body .dtc-guest-tools > #dtc-auto-scroll[aria-pressed="true"]::before { animation: dtc-guest-scroll-active 2.4s ease-in-out infinite !important; }
}
@keyframes dtc-guest-scroll-hint {
	0%, 55%, 100% { transform: translateY(0); }
	68% { transform: translateY(-2px); }
	81% { transform: translateY(3px); }
	92% { transform: translateY(0); }
}
@keyframes dtc-guest-scroll-active {
	0%, 100% { box-shadow: 0 2px 8px rgb(0 0 0 / 15%), 0 0 0 0 rgb(165 38 45 / 0%); }
	50% { box-shadow: 0 2px 8px rgb(0 0 0 / 15%), 0 0 0 4px rgb(165 38 45 / 15%); }
}
@media (prefers-reduced-motion: reduce) {
	body #dtc-auto-scroll > svg, body .dtc-guest-tools > #dtc-auto-scroll::before { animation: none !important; }
}
html.dtc-guest-unavailable body .dtc-guest-tools,
html.dtc-guest-unavailable body #dtc-reaction-layer { display: none; }
body #dtc-scroll-status { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); clip-path: inset(50%); white-space: nowrap; border: 0; }
/* Demo links on the left and a wide-desktop QR card stay outside the action column. */
@media screen and (min-width: 1024px) and (max-width: 1200px) {
	body:has(.dtc-guest-tools:not([hidden])) .dtc-mobile-qr { bottom: max(240px, env(safe-area-inset-bottom)); }
}
