/* Page-level styles for the 4 Bros Rip homepage. */
html{scroll-behavior:smooth}
body{margin:0;--color-bg:color-mix(in oklch,var(--color-accent-900) 42%,black);--color-text:var(--color-neutral-100);--color-surface:var(--color-accent-900);--color-divider:color-mix(in srgb,var(--color-neutral-100) 15%,transparent);--color-accent:oklch(0.62 0.21 262);background:var(--color-bg);color:var(--color-text);font-family:var(--font-body);text-wrap:pretty}
a{color:var(--color-accent-300);text-decoration:none}
a:hover{color:var(--color-accent-200)}
@keyframes rbPulse{0%,100%{opacity:1}50%{opacity:.25}}
@keyframes rbFloat{0%,100%{transform:translate(-50%,-50%) rotate(-2deg)}50%{transform:translate(-50%,-53%) rotate(2deg)}}
@keyframes rbFoil{from{background-position:0% 50%}to{background-position:250% 50%}}
@keyframes rbShake{0%,100%{transform:translate(-50%,-50%)}20%{transform:translate(-52%,-50%) rotate(-2deg)}40%{transform:translate(-48%,-50%) rotate(2deg)}60%{transform:translate(-51%,-50%) rotate(-1deg)}80%{transform:translate(-49%,-50%) rotate(1deg)}}
@keyframes rbSpin{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes rbPop{0%{transform:translate(-50%,0) scale(.3);opacity:0}60%{transform:translate(-50%,0) scale(1.15);opacity:1}100%{transform:translate(-50%,0) scale(1);opacity:1}}
@keyframes rbMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}