/* R48: quiet, contextual signifier. No full-screen layer or gesture capture. */
.scroll-guide{position:fixed;z-index:25;left:50%;bottom:max(12px,env(safe-area-inset-bottom));transform:translate(-50%,6px);display:flex;align-items:center;gap:10px;width:max-content;max-width:calc(100vw - 40px);height:34px;padding:0 14px;border:1px solid #24443e20;border-radius:24px;background:rgba(250,252,250,.94);color:#405e50;box-shadow:0 3px 16px #142c2310;font:400 11px/1 Manrope,Arial,sans-serif;letter-spacing:.02em;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .25s ease,transform .25s ease,visibility .25s}
.scroll-guide.is-visible{opacity:1;visibility:visible;transform:translate(-50%,0)}
.scroll-guide[data-theme="dark"]{background:rgba(16,30,26,.78);color:#fafcfa;border-color:#ffffff28;box-shadow:none}
.scroll-guide[data-area="method"]{bottom:max(4px,env(safe-area-inset-bottom));height:30px}
.scroll-guide svg{display:block;width:18px;height:22px;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round;flex:none}
.scroll-guide .scroll-guide-touch,.scroll-guide .scroll-guide-mobile{display:none}
.scroll-guide .scroll-guide-arrows path:first-child{opacity:.35}
.scroll-guide .scroll-guide-arrows path:last-child{opacity:.7}
.scroll-guide.animate .scroll-guide-arrows{animation:guide-down 1.8s cubic-bezier(.4,0,.2,1) 2}
@keyframes guide-down{0%,100%{transform:translateY(-2px);opacity:.5}50%{transform:translateY(3px);opacity:1}}
@keyframes guide-swipe{0%,100%{transform:translateY(5px);opacity:0}20%{opacity:.85}75%{transform:translateY(-5px);opacity:.2}}
.scroll-guide-ready #metodo .scroll-hint{display:none}
@media(pointer:coarse){.scroll-guide .scroll-guide-touch,.scroll-guide .scroll-guide-mobile{display:block}.scroll-guide .scroll-guide-desktop{display:none}.scroll-guide-touch .touch-track{opacity:.25}.scroll-guide.animate .touch-dot{animation:guide-swipe 1.8s cubic-bezier(.4,0,.2,1) 2}.scroll-guide-touch .touch-dot{fill:currentColor;stroke:none}}
@media(max-width:700px){.scroll-guide{font-size:10px;gap:8px;padding-inline:12px;height:32px}}
@media(prefers-reduced-motion:reduce){.scroll-guide{transition:none;transform:translate(-50%,0)}.scroll-guide.animate svg,.scroll-guide.animate .touch-dot{animation:none!important}}

body[data-motion-paused="true"] .scroll-guide svg,body[data-motion-paused="true"] .scroll-guide .touch-dot{animation:none!important}
