/* Rei do Rodeio professional UI layer */
:root {
    --rr-pro-ink: #fff7ed;
    --rr-pro-muted: #a8b3c7;
    --rr-pro-surface: rgba(10, 16, 31, 0.88);
    --rr-pro-surface-strong: rgba(5, 10, 23, 0.96);
    --rr-pro-line: rgba(255, 255, 255, 0.11);
    --rr-pro-gold: #facc15;
    --rr-pro-amber: #f97316;
    --rr-pro-green: #16a34a;
    --rr-pro-blue: #38bdf8;
    --rr-pro-red: #ef4444;
    --rr-pro-shadow: 0 24px 70px rgba(0, 0, 0, 0.34);
    --rr-pro-focus: 0 0 0 4px rgba(250, 204, 21, 0.2);
}

body {
    --rr-accent: var(--rr-pro-amber);
    --rr-accent-strong: #ea580c;
}

.rr-main {
    isolation: isolate;
}

.rr-pro-ready .rr-panel,
.rr-pro-ready .rr-stage,
.rr-pro-ready .rr-modal__dialog,
.rr-pro-ready .rr-card,
.rr-pro-ready .rr-arena-card,
.rr-pro-ready .rr-box {
    border-color: var(--rr-pro-line);
}

.rr-pro-ready .rr-panel,
.rr-pro-ready .rr-stage,
.rr-pro-ready .rr-modal__dialog {
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.015)),
        radial-gradient(circle at 16% 0%, rgba(250, 204, 21, 0.11), transparent 32%),
        radial-gradient(circle at 92% 12%, rgba(56, 189, 248, 0.08), transparent 28%),
        var(--rr-pro-surface-strong);
    box-shadow: var(--rr-pro-shadow);
}

.rr-pro-ready .rr-arena-gateway {
    background:
        linear-gradient(180deg, rgba(2, 6, 23, 0.2), rgba(2, 6, 23, 0.88)),
        radial-gradient(circle at 18% 18%, rgba(250, 204, 21, 0.15), transparent 28%),
        radial-gradient(circle at 78% 12%, rgba(22, 163, 74, 0.12), transparent 30%),
        linear-gradient(135deg, #050816 0%, #09111f 48%, #020617 100%);
}

.rr-pro-ready .rr-arena-gateway__title,
.rr-pro-ready .rr-side__headline,
.rr-pro-ready .rr-title {
    letter-spacing: -0.04em;
    text-wrap: balance;
}

.rr-pro-ready .rr-arena-gateway__copy,
.rr-pro-ready .rr-side__text,
.rr-pro-ready .rr-copy {
    color: rgba(255, 247, 237, 0.82);
}

.rr-pro-ready .rr-pill,
.rr-pro-ready .status-badge,
.rr-pro-ready .rr-arena-card__tag,
.rr-pro-ready .rr-card__badge {
    border-color: rgba(250, 204, 21, 0.2);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.025)),
        rgba(15, 23, 42, 0.72);
    color: #fde68a;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.rr-pro-ready .rr-arena-card {
    transform-style: preserve-3d;
    border-radius: 24px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.018)),
        radial-gradient(circle at 18% 12%, color-mix(in srgb, var(--rr-accent, #f59e0b) 20%, transparent), transparent 34%),
        linear-gradient(180deg, rgba(15, 23, 42, 0.96), rgba(3, 7, 18, 0.98));
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.34);
}

.rr-pro-ready .rr-arena-card__media,
.rr-pro-ready .rr-arena-card__body,
.rr-pro-ready .rr-arena-card__actions {
    transform: translateZ(18px);
}

.rr-pro-ready .rr-arena-card__button,
.rr-pro-ready .rr-btn,
.rr-pro-ready .rr-hero__btn,
.rr-pro-ready .rr-card__btn,
.rr-pro-ready .rr-side__nav-btn,
.rr-pro-ready .rr-mobile-actions__btn {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    min-width: 0;
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        border-color 0.2s ease,
        filter 0.2s ease;
}

.rr-pro-ready .rr-arena-card__button::after,
.rr-pro-ready .rr-btn::after,
.rr-pro-ready .rr-hero__btn::after,
.rr-pro-ready .rr-card__btn::after,
.rr-pro-ready .rr-side__nav-btn::after,
.rr-pro-ready .rr-mobile-actions__btn::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(110deg, transparent 0%, rgba(255, 255, 255, 0.24) 42%, transparent 58%);
    transform: translateX(-130%);
    transition: transform 0.58s ease;
}

.rr-pro-ready .rr-arena-card__button:hover::after,
.rr-pro-ready .rr-btn:hover::after,
.rr-pro-ready .rr-hero__btn:hover::after,
.rr-pro-ready .rr-card__btn:hover::after,
.rr-pro-ready .rr-side__nav-btn:hover::after,
.rr-pro-ready .rr-mobile-actions__btn:hover::after {
    transform: translateX(130%);
}

.rr-pro-ready .rr-arena-card__button:focus-visible,
.rr-pro-ready .rr-btn:focus-visible,
.rr-pro-ready .rr-hero__btn:focus-visible,
.rr-pro-ready .rr-card__btn:focus-visible,
.rr-pro-ready .rr-side__nav-btn:focus-visible,
.rr-pro-ready .rr-mobile-actions__btn:focus-visible,
.rr-pro-ready .rr-input:focus,
.rr-pro-ready .rr-search:focus,
.rr-pro-ready .rr-select:focus {
    outline: 0;
    box-shadow: var(--rr-pro-focus);
}

.rr-pro-ready .rr-card {
    border-radius: 22px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.015)),
        radial-gradient(circle at 90% 0%, rgba(250, 204, 21, 0.12), transparent 30%),
        radial-gradient(circle at 12% 100%, rgba(56, 189, 248, 0.08), transparent 28%),
        linear-gradient(180deg, rgba(15, 21, 41, 0.98), rgba(4, 8, 18, 0.98));
    box-shadow: 0 22px 52px rgba(0, 0, 0, 0.28);
    transition: transform 0.24s ease, box-shadow 0.24s ease, border-color 0.24s ease;
}

.rr-pro-ready .rr-card:hover {
    border-color: rgba(250, 204, 21, 0.32);
    box-shadow: 0 30px 72px rgba(0, 0, 0, 0.36);
    transform: translateY(-4px);
}

.rr-pro-ready .rr-card__prize-frame {
    border-color: rgba(250, 204, 21, 0.2);
    background:
        radial-gradient(circle at 50% 0%, rgba(250, 204, 21, 0.16), transparent 44%),
        linear-gradient(180deg, rgba(2, 6, 23, 0.76), rgba(2, 6, 23, 0.94));
}

.rr-pro-ready .rr-card__prize-value,
.rr-pro-ready .rr-slot-prize {
    text-shadow: 0 8px 30px rgba(250, 204, 21, 0.28);
}

.rr-pro-ready .rr-card__meta {
    color: var(--rr-pro-muted);
}

.rr-pro-ready .rr-input,
.rr-pro-ready .rr-search,
.rr-pro-ready .rr-select {
    border-color: rgba(255, 255, 255, 0.13);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.rr-pro-ready .rr-modal {
    background:
        radial-gradient(circle at 50% 12%, rgba(250, 204, 21, 0.1), transparent 30%),
        rgba(2, 6, 23, 0.82);
}

.rr-pro-ripple {
    position: absolute;
    width: 12px;
    height: 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.42);
    pointer-events: none;
    transform: translate(-50%, -50%) scale(0);
    animation: rrProRipple 0.62s ease-out forwards;
}

.rr-pro-toast-stack {
    position: fixed;
    right: max(16px, env(safe-area-inset-right));
    bottom: max(18px, env(safe-area-inset-bottom));
    z-index: 9998;
    display: grid;
    gap: 10px;
    width: min(360px, calc(100vw - 32px));
    pointer-events: none;
}

.rr-pro-toast {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 12px;
    align-items: center;
    padding: 13px 14px;
    border: 1px solid rgba(250, 204, 21, 0.22);
    border-radius: 18px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.02)),
        rgba(5, 10, 23, 0.94);
    color: var(--rr-pro-ink);
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.32);
    opacity: 0;
    transform: translateY(10px);
    animation: rrProToastIn 0.28s ease forwards;
}

.rr-pro-toast i,
.rr-pro-toast svg {
    color: var(--rr-pro-gold);
}

.rr-pro-toast strong {
    display: block;
    font-size: 0.86rem;
    font-weight: 900;
}

.rr-pro-toast span {
    display: block;
    margin-top: 2px;
    color: var(--rr-pro-muted);
    font-size: 0.78rem;
    font-weight: 700;
}

.rr-pro-scroll-cue {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 9997;
    width: var(--rr-pro-scroll, 0%);
    height: 3px;
    background: linear-gradient(90deg, var(--rr-pro-gold), var(--rr-pro-green), var(--rr-pro-blue));
    box-shadow: 0 0 18px rgba(250, 204, 21, 0.32);
    pointer-events: none;
}

.rr-pro-ready .swiper {
    width: 100%;
}

.rr-pro-ready .swiper-pagination-bullet {
    background: rgba(255, 255, 255, 0.5);
    opacity: 1;
}

.rr-pro-ready .swiper-pagination-bullet-active {
    background: var(--rr-pro-gold);
}

@keyframes rrProRipple {
    to {
        opacity: 0;
        transform: translate(-50%, -50%) scale(18);
    }
}

@keyframes rrProToastIn {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 767px) {
    .rr-pro-ready .rr-cards__grid {
        display: grid;
        grid-auto-flow: column;
        grid-auto-columns: minmax(82vw, 1fr);
        grid-template-columns: none !important;
        overflow-x: auto;
        overscroll-behavior-x: contain;
        scroll-snap-type: x mandatory;
        scroll-padding: 18px;
        padding-bottom: 8px;
        -webkit-overflow-scrolling: touch;
    }

    .rr-pro-ready .rr-card {
        scroll-snap-align: start;
    }

    .rr-pro-toast-stack {
        bottom: max(96px, env(safe-area-inset-bottom));
    }
}

@media (prefers-reduced-motion: reduce) {
    .rr-pro-ready *,
    .rr-pro-ripple,
    .rr-pro-toast {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}