/* basev2.css */
*, *::before, *::after {
    box-sizing: border-box;
}

:root {
    --bodyBackground: #f8fafc;
    --secondBackgroundColor: #ffffff;
    --textColor: #334155;
    --textHeaderColor: #ffffff;
    --titleColor: #0f172a;
    --specialElement: #06b6d4;
    --specialElementTwo: #0891b2;
    --navBackground: rgba(255, 255, 255, 0.85);
    --buttonTextColor: #ffffff;
    --borderRadius: 16px;
    --navMargin: 0px;
    --paymentsBorder: #e2e8f0;
    --spanBackgroundColor: #0f172a;
}

::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-thumb {
    background-color: var(--specialElement);
    border-radius: 10px;
}

html, body {
    height: 100%;
}

body {
    background-color: var(--bodyBackground);
    background-image: radial-gradient(#cbd5e1 1.5px, transparent 1.5px);
    background-size: 35px 35px;
    font-family: 'Montserrat', sans-serif;
    color: var(--textColor);
    margin: 0;
    display: flex;
    flex-direction: column;
    -webkit-font-smoothing: antialiased;
}

.row--center {
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
}

@media (min-width: 1600px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 80%;
    }
}


/* navbarv2.css */
.navbar-nav {
    margin: 0 auto !important; 
    align-items: center;
}

.navbar {
    background: rgba(255, 255, 255, 0.8) !important; 
    padding: 18px 7%;
    border-bottom: 1px solid rgba(255, 255, 255, 0.4) !important; 
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.05) !important;
    backdrop-filter: blur(15px); 
    -webkit-backdrop-filter: blur(15px);
    position: fixed; 
    width: 100%;
    top: 0;
    left: 0;
    z-index: 1030;
    transition: all 0.4s ease;
}

.navbar.scrolled {
    background: rgba(255, 255, 255, 0.95) !important; 
    padding: 12px 7%;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08) !important;
}

.navbar-brand {
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
}

.navbar__logo {
    height: 65px !important; 
    width: auto !important;
    filter: none !important;
    transition: transform 0.3s ease;
}

.navbar__logo:hover {
    transform: scale(1.05);
}

.navbar-expand-lg .navbar-nav .nav-link {
    color: #475569 !important;
    font-weight: 700;
    font-size: 0.95rem;
    padding: 10px 18px !important;
    margin: 0 5px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    border-radius: 12px;
    transition: all 0.3s ease;
}

.nav-link--icon {
    padding: 10px !important;
    font-size: 22px;
    margin-top: -2px;
}

.navbar-expand-lg .navbar-nav .nav-link:hover,
.navbar-expand-lg .navbar-nav .active {
    color: var(--specialElement) !important; 
    background: rgba(6, 182, 212, 0.08) !important;
}

.navbar-expand-lg .navbar-nav .nav-link[href*="shop"]:hover, 
.navbar-expand-lg .navbar-nav .nav-link[href*="shop"].active,
.navbar-expand-lg .navbar-nav .nav-link[href*="sklep"]:hover, 
.navbar-expand-lg .navbar-nav .nav-link[href*="sklep"].active { 
    color: #10b981 !important; 
    background: rgba(16, 185, 129, 0.08) !important; 
}

.navbar-expand-lg .navbar-nav .nav-link[href*="youtube"]:hover, 
.navbar-expand-lg .navbar-nav .nav-link[href*="youtube"].active { 
    color: #ff0000 !important; 
    background: rgba(255, 0, 0, 0.08) !important; 
}
.navbar-expand-lg .navbar-nav .nav-link[href*="discord"]:hover, 
.navbar-expand-lg .navbar-nav .nav-link[href*="discord"].active { 
    color: #5865F2 !important; 
    background: rgba(88, 101, 242, 0.08) !important; 
}
.navbar-expand-lg .navbar-nav .nav-link[href*="tiktok"]:hover, 
.navbar-expand-lg .navbar-nav .nav-link[href*="tiktok"].active { 
    color: #000000 !important; 
    background: rgba(0, 0, 0, 0.08) !important; 
}
.navbar-expand-lg .navbar-nav .nav-link[href*="instagram"]:hover, 
.navbar-expand-lg .navbar-nav .nav-link[href*="instagram"].active { 
    color: #E1306C !important; 
    background: rgba(225, 48, 108, 0.08) !important; 
}
.navbar-expand-lg .navbar-nav .nav-link[href*="facebook"]:hover, 
.navbar-expand-lg .navbar-nav .nav-link[href*="facebook"].active { 
    color: #1877F2 !important; 
    background: rgba(24, 119, 242, 0.08) !important; 
}

.navbar .fa-bars {
    color: #1e293b !important;
    font-size: 26px;
}

.navbar--transparent {
    background: transparent !important;
    border-bottom: none !important;
    box-shadow: none !important;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.header-content-online {
    animation: animateOnline 3s infinite;
    border-radius: 50%;
    margin-right: 8px;
    margin-bottom: 3px;
    background: #10b981;
}

@keyframes animateOnline {
    0% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.4); transform: scale(0.85); }
    50% { box-shadow: 0 0 0 8px rgba(16, 185, 129, 0); transform: scale(1); }
    100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); transform: scale(0.85); }
}

@media only screen and (max-width: 991px) {
    .navbar {
        padding: 15px 5%; 
    }
    .navbar-nav {
        background: rgba(255, 255, 255, 0.95);
        border-radius: 16px;
        margin-top: 15px;
        padding: 15px;
        box-shadow: 0 15px 35px rgba(0,0,0,0.1);
    }
    .nav-link--icon {
        display: inline-block;
    }
    .navbar-expand-lg .navbar-nav .nav-link {
        margin-bottom: 8px;
    }
}

/* headerv2.css */
.header {
    background: url('/assets/img/bg.webp') center/cover no-repeat;
    position: relative;
    text-align: center;
    /* ZWIĘKSZONY PADDING = WIĘKSZY OBRAZEK W TLE */
    padding: 240px 0 150px 0; 
    border-bottom: none;
    display: block;
}

.header::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(15, 23, 42, 0.35);
    z-index: 1;
}

.header .container {
    position: relative;
    z-index: 2;
}

.header__content__h1 {
    background: linear-gradient(135deg, #f97316 10%, #ffedd5 60%, #ffffff 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 5rem;
    font-weight: 900;
    line-height: 1.1;
    margin-bottom: 15px;
    letter-spacing: -1px;
    filter: drop-shadow(0 6px 12px rgba(0, 0, 0, 0.6));
    text-transform: uppercase;
    display: inline-block;
}

.header__content__p {
    color: #f1f5f9;
    font-size: 1.2rem;
    margin: 0 auto 40px auto;
    max-width: 800px;
    font-weight: 600;
    line-height: 1.6;
    text-transform: none;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.6);
    display: block;
}

.header__action-area {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.header__ip-btn {
    background: #10b981;
    color: #ffffff;
    font-size: 1.1rem;
    font-weight: 800;
    padding: 16px 32px;
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 20px -5px rgba(16, 185, 129, 0.5);
    cursor: pointer;
    transition: all 0.3s ease;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.header__ip-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 15px 25px -5px rgba(16, 185, 129, 0.6);
    background: #059669;
}

.header__online-status {
    background-color: #ffffff;
    color: #0f172a;
    font-size: 1.1rem;
    font-weight: 800;
    padding: 16px 32px;
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 20px -5px rgba(0, 0, 0, 0.1);
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.header__online-status svg circle {
    animation: pulseDot 2s infinite;
}

@keyframes pulseDot {
    0% { box-shadow: 0 0 0 0 rgba(0, 255, 43, 0.8); transform: scale(1); }
    70% { box-shadow: 0 0 0 10px rgba(0, 255, 43, 0); transform: scale(1.1); }
    100% { box-shadow: 0 0 0 0 rgba(0, 255, 43, 0); transform: scale(1); }
}

.header__content__btn {
    background-color: #06b6d4;
    color: #ffffff !important;
    font-size: 1.1rem;
    font-weight: 800;
    padding: 16px 32px;
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 20px -5px rgba(6, 182, 212, 0.5);
    transition: all 0.3s ease;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    margin-top: 10px;
}

.header__content__btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 15px 25px -5px rgba(6, 182, 212, 0.6);
    background-color: #0891b2;
}

/* ZMIANA: Mniej widoczny przycisk Voucher (wtopiony w tło) */
.header .header__voucher-btn, 
.header a[href*="voucher"] {
    background: rgba(255, 255, 255, 0.05); /* Bardzo mała widoczność tła */
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    color: rgba(255, 255, 255, 0.6) !important; /* Szary, stonowany tekst */
    font-size: 0.95rem;
    font-weight: 600;
    padding: 12px 24px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 12px;
    box-shadow: none; /* Usunięto mocny cień */
    text-decoration: none !important;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    transition: all 0.3s ease;
    margin-top: 25px;
    margin-left: 10px;
}

.header .header__voucher-btn:hover, 
.header a[href*="voucher"]:hover {
    background: rgba(255, 255, 255, 0.15);
    color: #ffffff !important; /* Po najechaniu staje się czytelniejszy */
    border-color: rgba(255, 255, 255, 0.4);
    transform: translateY(-2px);
}

@media only screen and (max-width: 991px) {
    .header {
        padding: 160px 0 80px 0;
    }
    .header__content__h1 {
        font-size: 3rem;
    }
    .header__action-area {
        flex-direction: column;
    }
    .header__ip-btn, 
    .header__online-status, 
    .header__content__btn {
        width: 90%;
        justify-content: center;
    }
    .header .header__voucher-btn, 
    .header a[href*="voucher"] {
        margin-left: 0;
        margin-top: 15px;
        width: 90%;
        justify-content: center;
    }
}


/* productsv2.css */
html {
    scroll-behavior: smooth;
}

.servers, .shop {
    padding-top: 60px;
}

.servers__card, .shop__card {
    background-color: var(--secondBackgroundColor);
    text-align: center;
    margin-bottom: 30px;
    border: 1px solid rgba(0, 0, 0, 0.05);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03);
    transition: all 0.3s ease;
    border-radius: 20px;
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: visible;
}

.servers__card {
    padding: 45px 30px;
}

.shop__card {
    padding: 35px 25px 25px 25px;
}

.servers__card:hover, .shop__card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08);
}

@keyframes bonusPulse {
    0% { transform: scale(1) rotate(3deg); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15); filter: brightness(1); }
    50% { transform: scale(1.12) rotate(-2deg); box-shadow: 0 15px 30px rgba(0, 0, 0, 0.25); filter: brightness(1.1); }
    100% { transform: scale(1) rotate(3deg); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15); filter: brightness(1); }
}

.shop__card__badge {
    position: absolute;
    top: -15px;
    right: -15px;
    color: #fff;
    font-weight: 800;
    font-size: 0.95rem;
    padding: 10px 20px;
    border: none;
    border-radius: 20px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
    z-index: 10;
    text-transform: uppercase;
    animation: bonusPulse 2.5s ease-in-out infinite;
    transform-origin: center;
}

.shop__card__badge--tier-1 { background: linear-gradient(135deg, #3b82f6, #2563eb); } 
.shop__card__badge--tier-2 { background: linear-gradient(135deg, #f97316, #ea580c); } 
.shop__card__badge--tier-3 { background: linear-gradient(135deg, #ef4444, #dc2626); } 

.servers__card__img {
    max-width: 160px;
    max-height: 160px;
    margin-bottom: 30px;
    border-radius: 20px;
    transition: transform 0.4s ease;
}

.shop__card__img {
    max-width: 160px;
    max-height: 160px;
    width: 100%;
    object-fit: contain;
    display: block;
    margin: 0 auto 30px auto;
    border: none; 
    transition: transform 0.4s ease;
}

.servers__card:hover .servers__card__img,
.shop__card:hover .shop__card__img {
    transform: scale(1.08) translateY(-5px);
}

.servers__card__h3, .shop__card__h3 {
    font-size: 24px;
    color: var(--titleColor);
    margin-bottom: 20px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.servers__card__actions {
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-top: auto;
}

@keyframes encouragePulse {
    0% { transform: scale(1); box-shadow: 0 4px 12px rgba(16, 185, 129, 0.2); }
    50% { transform: scale(1.03); box-shadow: 0 12px 25px rgba(16, 185, 129, 0.4); }
    100% { transform: scale(1); box-shadow: 0 4px 12px rgba(16, 185, 129, 0.2); }
}

.servers__card__btn--support {
    background-color: #10b981;
    text-decoration: none;
    padding: 16px 20px;
    color: #fff !important;
    font-weight: 700;
    font-size: 1rem;
    border: none;
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(16, 185, 129, 0.25);
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    transition: all 0.3s ease;
    text-transform: uppercase;
    cursor: pointer;
    animation: encouragePulse 2.5s infinite ease-in-out;
}

.servers__card__btn--support:hover {
    background-color: #059669;
    animation: none;
    transform: translateY(-2px);
    box-shadow: 0 12px 25px rgba(16, 185, 129, 0.35);
}

.servers__card__btn--support:active {
    transform: translateY(1px);
    box-shadow: 0 4px 10px rgba(16, 185, 129, 0.2);
}

.servers__card__btn--ranks {
    background-color: #f1f5f9;
    color: #334155 !important;
    text-decoration: none;
    padding: 14px 20px;
    font-weight: 700;
    border: none;
    border-radius: 12px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    transition: all 0.3s ease;
    text-transform: uppercase;
    cursor: pointer;
}

.servers__card__btn--ranks:hover {
    background-color: #e2e8f0;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05);
}

.servers__card__btn--ranks:active {
    transform: translateY(1px);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
}

.shop__card__description {
    overflow-y: auto;
    margin-bottom: 25px;
    padding: 0 10px;
}

.shop__card__description__p {
    color: #64748b;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.6;
    text-transform: none;
    margin-bottom: 0px;
}

.shop__card__action {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: auto;
    padding-top: 20px;
    gap: 12px;
}

.shop__card__price {
    background-color: #f1f5f9;
    color: #0f172a;
    font-weight: 800;
    padding: 8px 20px;
    font-size: 1.1rem;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    text-transform: uppercase;
}

.shop__card__btn {
    background-color: #10b981;
    color: #fff;
    font-weight: 800;
    padding: 14px 24px;
    font-size: 1.05rem;
    width: 100%;
    border: none;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-transform: uppercase;
    box-shadow: 0 8px 20px rgba(16, 185, 129, 0.25);
    letter-spacing: 0.5px;
}

.shop__card__btn:hover {
    background-color: #059669; 
    transform: translateY(-2px);
    box-shadow: 0 12px 25px rgba(16, 185, 129, 0.35);
}

.shop__last__btn {
    background-color: #3b82f6;
    text-decoration: none;
    padding: 16px 50px;
    color: #fff !important;
    transition: all 0.3s ease;
    font-weight: 700;
    border: none;
    display: table;
    margin: auto;
    margin-bottom: 50px;
    box-shadow: 0 10px 25px rgba(59, 130, 246, 0.3);
    border-radius: 30px;
    font-size: 1.1rem;
}

.shop__last__btn:hover {
    background-color: #2563eb;
    transform: translateY(-3px);
    box-shadow: 0 15px 35px rgba(59, 130, 246, 0.4);
}

.shop__last__h3 {
    font-size: 22px;
    color: var(--titleColor);
    text-align: center;
    font-weight: 800;
    margin-bottom: 25px;
    letter-spacing: 0.5px;
}

.shop__last__card {
    width: 100%;
    background-color: var(--secondBackgroundColor);
    padding: 16px 20px;
    margin-bottom: 15px;
    display: flex;
    border: 1px solid rgba(0, 0, 0, 0.04);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.03);
    align-items: center;
    border-radius: 16px;
    position: relative;
    transition: all 0.3s ease;
}

.shop__last__card:hover {
    transform: translateX(5px);
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.06);
    border-color: rgba(16, 185, 129, 0.2);
}

.shop__last__card:hover .shop__last__card__left__img {
    transform: scale(1.1);
}

.shop__last__card__time-badge {
    position: absolute;
    top: -12px;
    left: 15px;
    background: #ef4444; 
    color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    padding: 4px 12px;
    border: none;
    border-radius: 12px;
    box-shadow: 0 4px 10px rgba(239, 68, 68, 0.3);
    display: flex;
    align-items: center;
    gap: 6px;
    text-transform: uppercase;
    z-index: 5;
}

.pulse-dot {
    width: 6px;
    height: 6px;
    background: #fff;
    border-radius: 50%;
    display: inline-block;
    animation: dotPulse 1.5s infinite;
}

@keyframes dotPulse {
    0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7); }
    70% { transform: scale(1); box-shadow: 0 0 0 6px rgba(255, 255, 255, 0); }
    100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); }
}

.shop__last__card__left {
    width: 25%;
}

.shop__last__card__right {
    width: 75%;
    padding-left: 10px;
}

.shop__last__card__right__h4 {
    font-size: 1rem;
    margin-bottom: 2px;
    color: #1e293b;
    font-weight: 800;
}

.shop__last__card__right__h5, .shop__last__card__right__h6 {
    font-size: 0.85rem;
    margin-bottom: 0px;
    color: #64748b;
    font-weight: 500;
    text-transform: none;
}

.shop__last__card__left__img {
    display: block;
    border-radius: 50%;
    border: 2px solid #f1f5f9;
    max-width: 100%;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    transition: all 0.3s ease;
}

.reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

.delay-100 { transition-delay: 100ms; }
.delay-200 { transition-delay: 200ms; }
.delay-300 { transition-delay: 300ms; }
.delay-400 { transition-delay: 400ms; }
.delay-500 { transition-delay: 500ms; }

@media only screen and (max-width: 1400px) {
    .ranks-grid { grid-template-columns: repeat(3, 1fr); gap: 20px; }
    .shop__last__card__left { width: 30%; }
    .shop__last__card__right { width: 70%; }
}

@media only screen and (max-width: 1200px) {
    .shop__last__card__left { width: 15%; }
    .shop__last__card__right { width: 85%; }
}

@media only screen and (max-width: 991px) {
    .ranks-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
}

@media only screen and (max-width: 767px) {
    .ranks-grid { grid-template-columns: 1fr; }
    .section-title__h2 { font-size: 2rem; }
    .header__content__h1 { font-size: 2.5rem; }
    .shop__last__card__left { width: 20%; }
    .shop__last__card__right { width: 80%; }
    .shop__last__card { padding-left: 15px; }
}

/* pagesv4.css */
.tos {
    background-color: #fff;
    padding: 50px;
    margin: 80px auto 120px auto;
    max-width: 1200px;
    border: none;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.05);
    border-radius: 24px;
}

.tos h2 {
    color: #1e293b; 
    font-size: 2.2rem;
    font-weight: 800;
    text-transform: uppercase;
    border-bottom: 2px solid #e2e8f0;
    padding-bottom: 15px;
    margin-top: 40px;
    margin-bottom: 25px;
    display: inline-block;
}

.tos p {
    color: #475569;
    margin-bottom: 20px;
    font-size: 1.1rem;
    font-weight: 500;
    line-height: 1.8;
}

.tos ul {
    margin-bottom: 20px;
    padding-left: 30px;
}

.tos li {
    color: #475569;
    font-size: 1.1rem;
    font-weight: 500;
    line-height: 1.8;
    margin-bottom: 10px;
    list-style-type: disc;
}

@keyframes slideUpFade {
    0% { opacity: 0; transform: translateY(40px); }
    100% { opacity: 1; transform: translateY(0); }
}

@keyframes floatIcon {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}

.voucher {
    padding-top: 160px;
    margin-bottom: 120px;
    display: flex;
    justify-content: center;
    align-items: center;
    animation: slideUpFade 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
}

.voucher__wrapper {
    background: #fff;
    padding: 50px;
    border: 1px solid rgba(0,0,0,0.05);
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.05);
    max-width: 650px;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
    border-radius: 24px;
}

.voucher__icon {
    font-size: 4rem;
    color: #10b981; 
    margin-bottom: 20px;
    display: inline-block;
    animation: floatIcon 3s ease-in-out infinite;
    filter: drop-shadow(0 10px 15px rgba(16, 185, 129, 0.2));
}

.voucher__h3 {
    font-size: 2.2rem;
    margin-bottom: 15px;
    color: #0f172a;
    font-weight: 800;
    text-transform: uppercase;
}

.voucher__desc {
    color: #64748b;
    font-weight: 500;
    font-size: 1.1rem;
    margin-bottom: 40px;
}

.voucher__content {
    text-align: left;
}

.voucher__form-group {
    margin-bottom: 30px;
}

.voucher__label {
    font-weight: 700;
    font-size: 1.1rem;
    color: #334155;
    margin-bottom: 15px;
    display: block;
    text-transform: uppercase;
}

.voucher__input {
    width: 100%;
    height: 60px;
    border: 2px solid #e2e8f0;
    padding: 0 25px;
    font-weight: 600;
    font-size: 1.1rem;
    box-shadow: none;
    background: #f8fafc;
    border-radius: 12px;
    outline: none;
    box-sizing: border-box;
    transition: all 0.3s ease;
}

.voucher__input:focus {
    background-color: #fff;
    border-color: #06b6d4;
    box-shadow: 0 0 0 4px rgba(6, 182, 212, 0.15);
}

.voucher__input::placeholder {
    color: #94a3b8;
    font-weight: 500;
}

.voucher__code-group {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    width: 100%;
    box-sizing: border-box;
    gap: 15px;
}

.voucher__input--code {
    flex-grow: 1;
}

.voucher__btn {
    min-height: 60px;
    background: #10b981;
    color: #fff !important;
    border: none;
    padding: 0 35px;
    font-weight: 700;
    font-size: 1.1rem;
    cursor: pointer;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 20px rgba(16, 185, 129, 0.25);
    box-sizing: border-box;
    flex-shrink: 0;
    text-transform: uppercase;
    transition: all 0.3s ease;
}

.voucher__btn:hover {
    background: #059669;
    transform: translateY(-2px);
    box-shadow: 0 12px 25px rgba(16, 185, 129, 0.35);
}

.status {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    min-height: 60vh;
    padding: 60px 20px;
    text-align: center;
    animation: slideUpFade 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
}

.status__title__h1 {
    font-size: 8rem; 
    font-weight: 800;
    color: #ef4444; 
    text-shadow: none;
    margin-bottom: 0;
    line-height: 1;
    text-transform: uppercase;
}

.status__title__h1--transaction {
    font-size: 3rem;
    color: #0f172a;
    text-shadow: none; 
}

.status__title__border {
    display: none; 
}

.status__content__card {
    background: #fff;
    border: 1px solid rgba(0,0,0,0.05);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
    padding: 40px 50px;
    margin-top: 40px;
    display: inline-block;
    max-width: 100%;
    box-sizing: border-box;
    text-align: left; 
    border-radius: 20px;
}

.status__content__card--paid {
    border-top: 4px solid #10b981;
}

.status__content__card--fail {
    border-top: 4px solid #ef4444;
}

.status__content__card__h5 {
    font-size: 1.5rem;
    font-weight: 800;
    color: #1e293b;
    text-transform: uppercase;
    margin-bottom: 20px;
    border-bottom: 1px solid #e2e8f0;
    padding-bottom: 15px;
}

.status__content__card__h6 {
    font-size: 1.05rem;
    font-weight: 500;
    color: #64748b;
    text-transform: uppercase;
    margin-bottom: 15px;
    word-break: break-all;
}

.status__content__card__h6 b {
    color: #0f172a;
    font-weight: 700;
}

.shop__goal-card {
    width: 100%;
    background-color: #fff;
    padding: 20px;
    margin-bottom: 20px;
    border: 1px solid rgba(0,0,0,0.05);
    box-shadow: 0 10px 25px rgba(0,0,0,0.03);
    border-radius: 16px;
}

.shop__goal-title {
    font-size: 1rem;
    color: #334155;
    font-weight: 800;
    text-transform: uppercase;
    margin-bottom: 15px;
    text-align: center;
}

.shop__goal-progress {
    height: 12px;
    border: none;
    border-radius: 20px;
    background-color: #f1f5f9;
    overflow: hidden;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.05);
}

.shop__goal-bar {
    max-width: 100%;
    background: linear-gradient(90deg, #10b981, #34d399);
    border: none;
    border-radius: 20px;
}

.shop__last__card__verified-icon {
    color: #10b981;
    font-size: 0.8rem;
    margin-left: 3px;
}

.shop__last__card--gold {
    background: linear-gradient(135deg, #fffbeb, #fef08a) !important;
    border: 1px solid rgba(250, 204, 21, 0.4) !important;
    box-shadow: 0 10px 30px rgba(250, 204, 21, 0.2) !important;
    position: relative;
    overflow: visible !important;
    transition: all 0.3s ease;
    margin-bottom: 25px;
    display: flex;
    border-radius: 16px;
}

.shop__last__card--gold:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 35px rgba(250, 204, 21, 0.3) !important;
}

.shop__last__card__badge--gold {
    position: absolute;
    top: -12px;
    right: -10px;
    background-color: #f59e0b;
    color: #fff;
    font-weight: 800;
    font-size: 0.85rem;
    padding: 6px 14px;
    border: none;
    box-shadow: 0 5px 15px rgba(245, 158, 11, 0.3);
    text-transform: uppercase;
    z-index: 10;
    border-radius: 20px;
}

.shop__last__card__right__gold-container {
    display: flex;
    align-items: center; 
    width: 100%;
}

.shop__last__card__right__h4--gold-centered {
    font-weight: 800 !important;
    color: #b45309 !important;
    font-size: 1.1rem !important;
    text-transform: uppercase;
    margin-bottom: 0 !important; 
}

@keyframes pulseCrown {
    0% { transform: scale(1) rotate(0deg); }
    50% { transform: scale(1.15) rotate(-10deg); }
    100% { transform: scale(1) rotate(0deg); }
}

.gold-crown {
    color: #fff;
    text-shadow: none;
    animation: pulseCrown 2s infinite;
    margin-right: 5px;
}

@media only screen and (max-width: 767px) {
    .tos {
        padding: 30px 20px;
        margin: 120px 15px 80px 15px; 
    }
    .tos h2 { font-size: 1.8rem; }
    .voucher {
        padding-top: 90px; 
        margin-bottom: 60px;
    }
    .voucher__wrapper {
        padding: 30px 20px;
    }
    .voucher__h3 { font-size: 1.8rem; }
    .voucher__input {
        padding: 0 15px;
        font-size: 1rem;
        height: 55px;
    }
    .voucher__code-group {
        flex-direction: column;
        gap: 15px;
    }
    .voucher__btn {
        width: 100%;
        min-height: 55px;
    }
    .status__title__h1 { font-size: 5rem; }
    .status__title__h1--transaction { font-size: 2rem; }
    .status__content__card {
        padding: 30px 20px;
        width: 100%; 
    }
    .status__content__card__h5 { font-size: 1.3rem; }
    .status__content__card__h6 { font-size: 0.95rem; }
}

/* paymentsv3.css */
@keyframes slideUpFade {
    0% { opacity: 0; transform: translateY(40px); }
    100% { opacity: 1; transform: translateY(0); }
}

@keyframes floatIcon {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}

.payments {
    padding-top: 160px; /* Zwiększono z 80px, aby przesunąć stronę w dół */
    margin-bottom: 80px;
    display: flow-root;
    animation: slideUpFade 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
}

.payments__content__product {
    background: #fff;
    padding: 40px;
    border: none;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.05);
    min-height: 700px;
    margin-right: 30px;
    border-radius: 24px;
    display: flow-root;
    box-sizing: border-box;
    max-width: 100%;
}

.payments__content__label {
    font-weight: 700;
    margin-bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #0f172a;
    font-size: 0.95rem;
    background: #f1f5f9;
    padding: 0 20px;
    border: none;
    border-radius: 12px 0 0 12px;
    min-height: 60px;
    white-space: normal;
    word-break: normal;
    box-sizing: border-box;
    flex-shrink: 0;
    min-width: min-content;
    text-align: center;
    line-height: 1.2;
}

.payments__content__label__question {
    margin-right: 8px;
    color: var(--specialElement);
    font-weight: 800;
}

.payments__content__product__item {
    text-align: center;
}

.payments__content__product__item__img {
    max-width: 200px;
    max-height: 200px;
    width: 100%;
    height: auto;
    margin-bottom: 20px;
    transition: transform 0.4s ease;
    border-radius: 16px;
}

.payments__content__product__item__img:hover {
    transform: scale(1.05) translateY(-5px);
}

.payments__content__product__description {
    max-height: 200px;
    min-height: 200px;
    overflow-y: auto;
    padding-right: 10px;
    color: #475569;
    font-weight: 500;
    line-height: 1.6;
    text-transform: none;
}

.payments__content__product__h3 {
    font-weight: 800;
    font-size: 1.8rem;
    color: #1e293b;
    margin-top: 20px;
    margin-bottom: 20px;
}

.payments__content__code {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    margin-bottom: 40px;
    width: 100%;
    box-sizing: border-box;
    border: 2px solid #e2e8f0;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
    transition: all 0.3s ease;
}

.payments__content__code:focus-within {
    border-color: var(--specialElement);
    box-shadow: 0 0 0 4px rgba(0, 168, 255, 0.15);
}

.payments__content__code__input {
    min-height: 60px;
    background-color: transparent;
    padding: 0 15px;
    font-weight: 600;
    flex-grow: 1;
    flex-shrink: 1;
    min-width: 0;
    margin: 0;
    border: none;
    text-transform: uppercase;
    outline: none;
    box-sizing: border-box;
    font-size: 1.05rem;
}

.payments__content__code__btn {
    min-height: 60px;
    background: #1e293b;
    color: #fff !important;
    border: none;
    padding: 0 25px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    flex-shrink: 0;
    transition: background-color 0.3s ease;
}

.payments__content__code__btn:hover {
    background: #334155;
}

.payments__content__forms__title {
    display: flex;
    align-items: center;
    margin-top: 50px;
    margin-bottom: 30px;
}

.payments__content__forms__title__number {
    background: var(--specialElement);
    color: #fff;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.1rem;
    border: none;
    box-shadow: 0 6px 15px rgba(0, 168, 255, 0.3);
    margin-right: 15px;
    border-radius: 50%;
    flex-shrink: 0;
}

.payments__content__forms__title__h3 {
    font-weight: 800;
    font-size: 1.3rem;
    margin: 0;
    color: #1e293b;
}

/* Nowa klasa do ładnego ostylowania wybranego wariantu */
.payments__variant-info {
    font-size: 1.05rem;
    color: #475569;
    font-weight: 600;
    margin-top: -15px;
    margin-bottom: 30px;
    background: #f8fafc;
    padding: 12px 20px;
    border-left: 4px solid var(--specialElement, #00a8ff);
    border-radius: 4px 12px 12px 4px;
    display: block;
    width: fit-content;
    box-sizing: border-box;
}

.payments__variant-info strong,
.payments__variant-info b {
    color: #0f172a;
    font-weight: 800;
}

.payments__content__forms__user__input {
    width: 100%;
    height: 60px;
    border: 2px solid #e2e8f0;
    padding: 0 20px;
    font-weight: 600;
    font-size: 1.05rem;
    box-shadow: none;
    margin-bottom: 30px;
    background: #f8fafc;
    border-radius: 12px;
    outline: none;
    box-sizing: border-box;
    transition: all 0.3s ease;
}

.payments__content__forms__user__input:focus {
    background-color: #fff;
    border-color: var(--specialElement);
    box-shadow: 0 0 0 4px rgba(0, 168, 255, 0.15);
}

.payments__content__forms__user__input::placeholder {
    color: #94a3b8;
    font-weight: 500;
}

.payments__content__forms__method {
    display: grid;
    grid-template-columns: 1fr;
    gap: 15px;
    margin-top: 20px;
}

.payments__content__forms__method__card {
    background: #fff;
    border: 2px solid #e2e8f0;
    padding: 20px 25px;
    text-align: left;
    box-shadow: 0 4px 10px rgba(0,0,0,0.02);
    cursor: pointer;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    border-radius: 16px;
    width: 100%;
    box-sizing: border-box;
    transition: all 0.3s ease;
}

.payments__content__forms__method__card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);
    border-color: #cbd5e1;
}

.payments__content__forms__method .active {
    background: rgba(0, 168, 255, 0.05);
    border-color: var(--specialElement);
    box-shadow: 0 10px 25px rgba(0, 168, 255, 0.15);
    transform: translateY(-3px);
}

.payments__content__forms__method__card__icon {
    font-size: 1.8rem;
    margin-bottom: 0;
    margin-right: 20px;
    color: #1e293b;
    min-width: 40px;
    text-align: center;
}

.payments__content__forms__method .active .payments__content__forms__method__card__icon,
.payments__content__forms__method .active .payments__content__forms__method__card__a {
    color: var(--specialElement);
}

.payments__content__forms__method__card__a {
    font-weight: 700;
    color: #1e293b;
    font-size: 1.05rem;
    text-decoration: none;
    transition: color 0.3s ease;
}

.payments__content__forms_price {
    display: flow-root;
    clear: both;
    margin-top: 50px;
    padding-top: 30px;
    border-top: 1px solid #e2e8f0;
}

.payments__content__forms_price a {
    color: var(--specialElement);
    text-decoration: none;
    font-weight: 600;
}

.payments__content__forms_price__label {
    margin-top: 4px;
    display: inline-block;
    font-weight: 700;
    color: #334155;
}

.payments__content__forms_price__label_operator {
    margin-top: 4px;
    display: block;
    margin-bottom: 20px;
    font-weight: 500;
    color: #64748b;
    text-transform: none;
}

.payments__content__forms__price__info {
    float: left;
    margin-top: 25px;
    font-weight: 800;
    font-size: 1.3rem;
    color: #0f172a;
}

.payments__content__forms_price__btn {
    background: #10b981;
    color: #fff !important;
    width: 100%;
    max-width: 300px;
    float: right;
    padding: 18px 20px;
    font-weight: 700;
    font-size: 1.1rem;
    border: none;
    box-shadow: 0 8px 20px rgba(16, 185, 129, 0.3);
    margin-top: 15px;
    margin-bottom: 20px;
    cursor: pointer;
    border-radius: 12px;
    box-sizing: border-box;
    transition: all 0.3s ease;
}

.payments__content__forms_price__btn:hover {
    background: #059669;
    transform: translateY(-2px);
    box-shadow: 0 12px 25px rgba(16, 185, 129, 0.4);
}

.payments__content__forms_price__checkbox {
    display: flex;
    align-items: center;
    cursor: pointer;
    margin-bottom: 25px;
    font-weight: 600;
    font-size: 0.9rem;
    text-transform: uppercase;
    color: #475569;
}

.payments__content__forms_price__checkbox input {
    display: none;
}

.payments__content__forms_price__checkbox .checkmark {
    width: 24px;
    height: 24px;
    border: 2px solid #cbd5e1;
    background-color: #fff;
    margin-right: 15px;
    display: inline-block;
    position: relative;
    border-radius: 6px;
    flex-shrink: 0;
    transition: all 0.2s ease;
}

.payments__content__forms_price__checkbox:hover input ~ .checkmark {
    border-color: var(--specialElement);
    background-color: #f8fafc;
}

.payments__content__forms_price__checkbox input:checked ~ .checkmark {
    background-color: var(--specialElement);
    border-color: var(--specialElement);
}

.payments__content__forms_price__checkbox .checkmark:after {
    content: "";
    position: absolute;
    display: none;
    left: 7px;
    top: 3px;
    width: 6px;
    height: 12px;
    border: solid white;
    border-width: 0 3px 3px 0;
    transform: rotate(45deg);
}

.payments__content__forms_price__checkbox input:checked ~ .checkmark:after {
    display: block;
}


.toast-container {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 9999;
    width: 350px;
    pointer-events: none;
}

.custom-toast {
    background: #fff;
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 35px rgba(0, 0, 0, 0.1);
    padding: 16px 20px;
    font-weight: 600;
    font-size: 0.95rem;
    width: 100%;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: absolute;
    top: 0;
    right: 0;
    pointer-events: auto;
    
    /* Zmienna aktualizowana przez JS, która steruje pozycją (0 to najnowszy) */
    --toast-index: 0;
    z-index: calc(1000 - var(--toast-index));
    
    transform: translateX(120%);
    opacity: 0;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* Wypełnienie przerw między powiadomieniami, by hover nie uciekał przy rozwijaniu */
.custom-toast::after {
    content: "";
    position: absolute;
    top: -20px;
    bottom: -20px;
    left: 0;
    right: 0;
    z-index: -1;
}

.custom-toast.show {
    opacity: 1;
}

.custom-toast.hiding {
    transform: translateX(120%) scale(0.9) !important;
    opacity: 0 !important;
}

/* WARIANT ZŁOŻONY (brak hover) */
.toast-container:not(:hover) .custom-toast.show {
    transform: translateY(calc(var(--toast-index) * 14px)) scale(calc(1 - (var(--toast-index) * 0.05)));
    opacity: calc(1 - (var(--toast-index) * 0.25));
}

/* WARIANT ROZWINIĘTY (po najechaniu myszką) */
.toast-container:hover .custom-toast.show {
    transform: translateY(calc(var(--toast-index) * 80px)) scale(1);
    opacity: 1;
}

.custom-toast.error { background: #ef4444; color: #fff; }
.custom-toast.success { background: #10b981; color: #fff; }
.custom-toast.info { background: var(--specialElement); color: #fff; }

.custom-toast-close {
    cursor: pointer;
    font-weight: 800;
    font-size: 1.2rem;
    margin-left: 15px;
    opacity: 0.8;
    transition: all 0.2s ease;
}

.custom-toast-close:hover {
    opacity: 1;
    transform: scale(1.1);
}

@media only screen and (max-width: 1199px) {
    .payments__content__product {
        margin-bottom: 40px;
        margin-right: 0;
        padding: 30px;
    }
    .payments__content__code {
        flex-direction: column;
        border: none;
        background: transparent;
    }
    .payments__content__label, 
    .payments__content__code__input, 
    .payments__content__code__btn {
        width: 100%;
        border-radius: 12px;
        margin-bottom: 15px;
    }
    .payments__content__code__input {
        border: 2px solid #e2e8f0;
        background: #fff;
    }
}

@media only screen and (max-width: 991px) {
    .payments__content__forms_price__btn {
        float: none;
        max-width: 100%;
        margin-top: 30px;
    }
    .payments__content__forms__price__info {
        float: none;
        display: block;
        text-align: center;
        margin-top: 20px;
    }
}

@media only screen and (max-width: 767px) {
    .payments {
        padding-top: 90px;
        margin-bottom: 40px;
    }
    .payments__content__product {
        padding: 20px;
        box-shadow: 0 10px 25px rgba(0,0,0,0.05);
    }
    .payments__content__product__h3 {
        font-size: 1.5rem;
    }
    .payments__content__label {
        height: auto;
        padding: 15px 20px;
    }
    .payments__content__forms__title {
        flex-direction: column;
        align-items: flex-start;
    }
    .payments__content__forms__title__number {
        margin-bottom: 15px;
    }
    .payments__content__forms__method__card {
        padding: 15px 20px;
    }
    .payments__content__forms__user__input {
        padding: 0 15px;
        font-size: 1rem;
    }
    .toast-container {
        top: 15px;
        right: 15px;
        left: 15px;
        width: calc(100% - 30px);
    }
    .custom-toast {
        min-width: auto;
        font-size: 0.9rem;
    }
}


/* footerv2.css */
.footer {
    background-color: #0f172a; 
    color: #f8fafc;
    padding: 60px 0;
    width: 100%;
    margin-top: auto; 
    flex-shrink: 0;
}

.footer__h3 {
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #fff;
}

.footer__info {
    opacity: 0.7;
    font-size: 0.9rem;
    text-transform: none; 
    display: block;
    margin-top: 6px;
    font-weight: 400;
    line-height: 1.6;
}

.footer__company {
    opacity: 0.8;
    font-size: 0.95rem;
    text-transform: none;
    line-height: 1.8;
    font-weight: 400;
}

.footer__company-highlight {
    color: var(--specialElement);
    font-weight: 700;
}

.footer__spaceis {
    font-size: 0.95rem;
    font-weight: 600;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 15px;
    margin-bottom: 0;
    opacity: 0.9;
}

.footer__spaceis__img {
    width: 100px;
    transition: all 0.3s ease;
    content: var(--spaceisLogo);
}

.footer__spaceis__img:hover {
    transform: translateY(-2px);
    opacity: 1;
}

.footer__a {
    color: var(--specialElement);
    text-decoration: none;
    font-weight: 600;
    transition: color 0.3s ease;
}

.footer__a:hover {
    color: #fff;
}

@media only screen and (max-width: 991px) {
    .footer {
        text-align: center;
        padding: 50px 20px;
    }
    
    .footer__spaceis {
        justify-content: center;
        margin-top: 35px;
    }

    .footer__company {
        margin-top: 35px;
        padding-top: 30px;
        border-top: 1px solid rgba(255,255,255,0.1);
        padding-bottom: 30px;
        border-bottom: 1px solid rgba(255,255,255,0.1);
    }
}

/* pixel-ranks.css */
/* Rank cards use the same square tiles, pixel edges and palette as the shop. */
.ranks-wrap { margin-top: 58px; margin-bottom: 22px; scroll-margin-top: 28px; }
.ranks-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 26px; }
.ranks-heading h1 { color: var(--page-text); font-size: clamp(1.6rem, 2.25vw, 2.3rem); font-weight: 900; line-height: 1.2; text-transform: uppercase; margin: 0 0 10px; }
.ranks-heading p { color: var(--page-muted); font-size: .875rem; margin: 0; line-height: 1.6; }
.ranks-heading .ranks-eyebrow { display: flex; align-items: center; gap: 9px; margin-bottom: 10px; color: var(--page-text); text-transform: uppercase; font-size: .625rem; font-weight: 800; letter-spacing: .13em; }
.ranks-eyebrow > span { width: 10px; height: 10px; background: #ffbf05; box-shadow: 5px -5px 0 #ffdf64; margin-right: 5px; }
.ranks-expand { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; gap: 15px; border: 1px solid var(--page-line); background: var(--page-bg); color: var(--page-text); font-size: .6875rem !important; font-weight: 700 !important; padding: 15px 18px; cursor: pointer; }
.ranks-expand:hover { border-color: var(--page-text); }
.ranks-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 16px; }
.rank-card { --rank-color: #a6ed65; --rank-ink: #44751c; min-width: 0; border: 1px solid var(--page-line); border-bottom: 4px solid var(--rank-color); background: var(--page-bg); transition: transform .22s ease, border-color .22s ease; }
.rank-card:hover { transform: translateY(-4px); border-color: var(--rank-color); }
.rank-card--svip { --rank-color: #ff9933; --rank-ink: #a45200; }
.rank-card--mvip { --rank-color: #069afa; --rank-ink: #0078c5; }
.rank-card--sky { --rank-color: #6cd3fb; --rank-ink: #137498; }
.rank-card--bogacz { --rank-color: #ffc634; --rank-ink: #9a6500; }
.rank-card__header { --tile-color: var(--rank-color); min-height: 195px; padding: 23px 24px; }
.rank-card__duration { position: relative; display: inline-block; padding: 6px 9px; background: rgb(0 0 0 / 16%); color: #fff; font-size: .625rem; font-weight: 700; text-transform: uppercase; }
.rank-card__emblem { position: absolute; top: 56px; right: 18px; color: rgb(255 255 255 / 23%); font-size: 3.7rem; transform: rotate(-12deg); pointer-events: none; }
.rank-card__header h3 { position: relative; color: #fff; font-size: clamp(1.65rem, 2.05vw, 2.15rem); font-weight: 900; line-height: 1.2; margin: 21px 0 12px; }
.rank-card__price { position: relative; margin: 0; display: flex; gap: 4px; flex-direction: column; color: #fff; line-height: 1.2; }
.rank-card__price > strong { font-size: 1.85rem; font-weight: 800; }
.rank-card__price > strong > span { font-size: .95rem; }
.rank-card__price > span { font-size: .5625rem; font-weight: 600; }
.rank-card--vip .rank-card__header h3, .rank-card--vip .rank-card__price { color: #21410e; }
.rank-card--bogacz .rank-card__header h3, .rank-card--bogacz .rank-card__price { color: #493200; }
.rank-card__body { padding: 20px 16px 0; }
.rank-card__kit { display: flex; gap: 10px; align-items: center; min-height: 46px; margin: 0 0 18px; font-size: .5625rem; font-weight: 500; color: var(--page-muted); line-height: 1.5; }
.rank-card__kit > i { font-size: 1.3rem; color: var(--rank-ink); flex: 0 0 26px; }
.rank-card__kit strong { display: block; color: var(--page-text); font-size: .8125rem; font-weight: 800; }
.rank-card__stats { display: grid; grid-template-columns: 1fr 1.3fr 1.1fr; margin: 0 0 20px; padding: 14px 0; border-block: 1px solid var(--page-line); }
.rank-card__stats > div { display: flex; flex-direction: column-reverse; align-items: center; gap: 4px; border-left: 1px solid var(--page-line); min-width: 0; }
.rank-card__stats > div:first-child { border-left: 0; }
.rank-card__stats dt { font-size: .625rem; font-weight: 500; color: var(--page-muted); margin: 0; line-height: 1.3; }
.rank-card__stats dd { color: var(--page-text); font-size: 1.2rem; font-weight: 800; margin: 0; line-height: 1.2; }
.rank-card__buy-btn { width: 100%; min-height: 46px; display: flex; align-items: center; justify-content: space-between; gap: 8px; border: 0; background: #233a61; color: #fff; padding: 12px 13px; font-size: .75rem !important; font-weight: 800 !important; cursor: pointer; text-transform: uppercase; transition: background .2s ease; }
.rank-card__buy-btn > i { color: var(--rank-color); transition: transform .2s ease; }
.rank-card__buy-btn:hover { background: #162a4b; }
.rank-card__buy-btn:hover > i { transform: translateX(4px); }
.rank-card__details { margin-top: 5px; }
.rank-card__details > summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; list-style: none; min-height: 52px; padding: 15px 0; font-size: .6875rem; font-weight: 600; color: var(--page-text); cursor: pointer; }
.rank-card__details > summary::-webkit-details-marker { display: none; }
.rank-card__details > summary > i { color: var(--rank-ink); font-size: .625rem; transition: transform .2s ease; }
.rank-card__details[open] > summary > i { transform: rotate(45deg); }
.rank-card__benefits { border-top: 1px solid var(--page-line); padding-bottom: 8px; }
.rank-card__group { color: var(--rank-ink); margin: 17px 0 7px; font-size: .5625rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.rank-benefit-list { margin: 0; }
.rank-benefit { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--page-line); font-size: .6875rem; line-height: 1.5; }
.rank-benefit:last-child { border-bottom: 0; }
.rank-benefit dt { color: var(--page-muted); font-weight: 500; min-width: 0; }
.rank-benefit dd { color: var(--page-text); font-weight: 700; text-align: right; margin: 0; flex: 0 0 auto; max-width: 48%; overflow-wrap: anywhere; }
.rank-benefit dd > .fa-check { color: #13965e; }
.rank-benefit--unavailable dd { color: var(--page-muted); }
.rank-benefit-list--commands .rank-benefit dt { font-size: .6875rem; }
.ranks-how { display: flex; align-items: center; gap: 18px; margin-top: 22px; padding: 22px 26px; background: #f4f6f9; border-left: 4px solid #ffbf05; color: var(--page-text); }
.ranks-how__icon { flex: 0 0 40px; color: #233a61; font-size: 1.8rem; }
.ranks-how p { flex: 1; margin: 0; font-size: .6875rem; line-height: 1.7; color: var(--page-muted); }
.ranks-how strong { display: block; color: var(--page-text); font-size: .75rem; text-transform: uppercase; margin-bottom: 3px; }
.ranks-how code { color: var(--page-text); background: #e6eaf1; padding: 3px 7px; white-space: nowrap; font-size: .6875rem; font-weight: 700; }
.ranks-how > a { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 13px; color: var(--page-text); font-size: .6875rem; font-weight: 700; text-decoration: none; padding: 10px 0; }
.ranks-how > a:hover { text-decoration: underline; }
.rank-sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.ranks-section button:focus-visible, .ranks-section summary:focus-visible, .ranks-section a:focus-visible, .rank-popup button:focus-visible, .rank-popup a:focus-visible { outline: 3px solid #364f78; outline-offset: 4px; }

/* The purchase dialog follows the same two-step wallet purchase as before. */
.rank-popup { position: fixed; inset: 0; z-index: 99999; display: flex; align-items: center; justify-content: center; padding: 24px; background: rgb(16 27 46 / 68%); opacity: 0; visibility: hidden; transition: opacity .2s ease, visibility .2s ease; }
.rank-popup.is-open { opacity: 1; visibility: visible; }
.rank-popup__box { --popup-color: #a6ed65; --popup-ink: #fff; width: min(620px, 100%); max-height: calc(100dvh - 48px); overflow-y: auto; background: var(--page-bg); color: var(--page-text); transform: translateY(20px); transition: transform .25s ease; border-bottom: 5px solid var(--popup-color); }
.rank-popup.is-open .rank-popup__box { transform: translateY(0); }
.rank-popup__box--svip { --popup-color: #ff9933; --popup-ink: #fff; }
.rank-popup__box--mvip { --popup-color: #069afa; --popup-ink: #fff; }
.rank-popup__box--sky { --popup-color: #6cd3fb; --popup-ink: #fff; }
.rank-popup__box--bogacz { --popup-color: #ffc634; --popup-ink: #fff; }
.rank-popup__head { --tile-color: var(--popup-color); padding: 27px 75px 29px 28px; min-height: 172px; }
.rank-popup__eyebrow { position: relative; z-index: 2; display: block; color: var(--popup-ink); font-size: .625rem; font-weight: 700; text-transform: uppercase; text-shadow: 0 2px 3px rgb(18 35 57 / 30%); }
.rank-popup__title { position: relative; z-index: 2; color: var(--popup-ink); font-size: 2.75rem; line-height: 1.1; font-weight: 900; margin: 17px 0 8px; text-shadow: 0 3px 5px rgb(18 35 57 / 28%); }
.rank-popup__subtitle { position: relative; z-index: 2; color: var(--popup-ink); font-size: .75rem; font-weight: 700; margin: 0; }
.rank-popup__emblem { position: absolute; top: 60px; right: 56px; color: rgb(255 255 255 / 24%); font-size: 5rem; transform: rotate(-12deg); pointer-events: none; }
.rank-popup__close { position: absolute; z-index: 3; top: 16px; right: 16px; width: 36px; height: 36px; display: grid; place-items: center; border: 0; background: rgb(0 0 0 / 15%); color: #fff; cursor: pointer; }
.rank-popup__close:hover { background: rgb(0 0 0 / 28%); }
.rank-popup__body { padding: 24px 28px; }
.rank-popup__steps { display: flex; align-items: center; gap: 18px; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid var(--page-line); }
.rank-popup__steps > span { display: flex; align-items: center; gap: 9px; font-size: .625rem; font-weight: 700; color: var(--page-text); }
.rank-popup__steps b { display: grid; place-items: center; width: 27px; height: 27px; background: #233a61; color: #fff; font-size: .6875rem; }
.rank-popup__steps > i { font-size: .625rem; color: var(--page-muted); }
.rank-popup__notice { font-size: .75rem; line-height: 1.7; color: var(--page-muted); margin: 0 0 19px; }
.rank-popup__options { display: grid; gap: 10px; }
.rank-popup__option { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 18px; border: 1px solid var(--page-line); border-left: 4px solid var(--popup-color); background: var(--page-bg); color: var(--page-text); text-decoration: none; transition: border-color .2s ease, transform .2s ease; }
.rank-popup__option:hover { color: var(--page-text); border-color: var(--popup-color); transform: translateX(3px); }
.rank-popup__option-main { display: flex; align-items: center; gap: 13px; min-width: 0; }
.rank-popup__option-icon { display: grid; place-items: center; width: 38px; height: 42px; flex: 0 0 38px; background: #f0f3f8; color: #233a61; font-size: 1.15rem; }
.rank-popup__option-copy { min-width: 0; }
.rank-popup__option-title { display: block; color: var(--page-text); font-size: .8125rem; font-weight: 800; line-height: 1.4; }
.rank-popup__option-desc { display: block; color: var(--page-muted); font-size: .625rem; line-height: 1.6; margin-top: 5px; }
.rank-popup__option-right { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; }
.rank-popup__price { display: flex; flex-direction: column; gap: 4px; color: var(--page-text); font-size: .9375rem; font-weight: 800; white-space: nowrap; }
.rank-popup__price > small { font-size: .5rem; font-weight: 500; color: var(--page-muted); }
.rank-popup__arrow { font-size: .75rem; color: var(--page-text); }
.rank-popup__best { display: block; width: fit-content; max-width: 100%; margin-top: 7px; padding: 5px 7px; background: #e9f8dc; color: #376b12; font-size: .4375rem; line-height: 1.5; font-weight: 800; }
.rank-popup__option--bonus { border-color: #9bd87b; border-left-color: #49b83a; background: linear-gradient(90deg, #f4fff0 0%, #fff 52%); }
.rank-popup__option--bonus .rank-popup__option-desc { display: inline-flex; align-items: center; width: fit-content; margin-top: 7px; padding: 6px 9px; background: #dcf7cf; color: #237218; font-weight: 900; text-transform: uppercase; letter-spacing: .02em; }
.rank-popup__option--bonus .rank-popup__option-desc::before { content: '\f06b'; margin-right: 6px; font-family: 'Font Awesome 6 Free'; font-weight: 900; }
.rank-popup__foot { display: flex; align-items: flex-start; gap: 12px; margin: 0 28px 25px; padding: 18px 0 0; border-top: 1px solid var(--page-line); color: var(--page-muted); }
.rank-popup__foot > i { font-size: 1.25rem; color: var(--page-text); }
.rank-popup__foot > p { margin: 0; font-size: .6875rem; line-height: 1.7; }
.rank-popup__foot strong { display: inline-block; color: var(--page-text); padding: 2px 7px; background: #edf0f5; font-size: .6875rem; white-space: nowrap; }
body.rank-popup-open { overflow: hidden; }

@media (max-width: 1200px) {
    .ranks-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .rank-card__header { min-height: 190px; }
    .rank-card__header h3 { font-size: 2rem; }
    .rank-card__body { padding-inline: 20px; }
    .rank-card__stats dt { font-size: .625rem; }
    .rank-card__buy-btn { font-size: .75rem !important; }
    .rank-card__kit { font-size: .625rem; }
    .rank-card__details > summary { font-size: .6875rem; }
    .rank-benefit, .rank-benefit-list--commands .rank-benefit dt { font-size: .6875rem; }
}
@media (max-width: 800px) {
    .ranks-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ranks-heading { align-items: flex-start; flex-direction: column; gap: 18px; }
    .ranks-how { align-items: flex-start; flex-wrap: wrap; padding: 20px; }
    .ranks-how p { flex-basis: calc(100% - 58px); }
    .ranks-how > a { margin-left: 58px; }
}
@media (max-width: 520px) {
    .ranks-wrap { margin-top: 40px; }
    .ranks-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; }
    .rank-card__header { min-height: 175px; padding: 21px 24px; }
    .rank-card__header h3 { margin-top: 17px; font-size: 2.3rem; }
    .rank-card__emblem { top: 57px; right: 29px; font-size: 4.5rem; }
    .rank-card__price { flex-direction: row; align-items: baseline; gap: 12px; }
    .rank-card__price > span { font-size: .625rem; }
    .rank-card__body { padding: 20px 24px 0; }
    .rank-card__kit { font-size: .6875rem; }
    .rank-card__kit strong { font-size: .875rem; }
    .rank-card__stats { padding-block: 16px; }
    .rank-card__stats dd { font-size: 1.35rem; }
    .rank-card__stats dt { font-size: .625rem; }
    .rank-card__buy-btn { padding: 16px; font-size: .8125rem !important; }
    .rank-card__details > summary { font-size: .75rem; }
    .rank-benefit, .rank-benefit-list--commands .rank-benefit dt { font-size: .75rem; }
    .rank-card__group { font-size: .625rem; }
    .ranks-heading p { font-size: .75rem; }
    .ranks-how { gap: 12px; }
    .ranks-how__icon { flex-basis: 26px; font-size: 1.5rem; }
    .ranks-how p { flex-basis: calc(100% - 38px); }
    .ranks-how > a { margin-left: 38px; }
    .rank-popup { padding: 12px; }
    .rank-popup__box { max-height: calc(100dvh - 24px); }
    .rank-popup__head { padding: 25px 64px 25px 22px; min-height: 160px; }
    .rank-popup__title { font-size: 2.3rem; }
    .rank-popup__body { padding: 22px 18px; }
    .rank-popup__steps { gap: 10px; }
    .rank-popup__steps > span { gap: 6px; font-size: .5625rem; }
    .rank-popup__steps b { width: 23px; height: 23px; }
    .rank-popup__notice { font-size: .6875rem; }
    .rank-popup__option { gap: 10px; padding: 15px 12px; }
    .rank-popup__option-main { gap: 0; }
    .rank-popup__option-icon { display: none; }
    .rank-popup__option-title { font-size: .75rem; }
    .rank-popup__option-right { gap: 7px; }
    .rank-popup__price { font-size: .8125rem; }
    .rank-popup__foot { margin: 0 18px 22px; }
}
@media (prefers-reduced-motion: reduce) {
    .rank-card, .rank-card__buy-btn > i, .rank-card__details > summary > i, .rank-popup, .rank-popup__box, .rank-popup__option { transition: none !important; }
    .rank-card:hover, .rank-popup__option:hover { transform: none; }
}


/* pixel.css */
:root {
    --page-bg: #fff;
    --page-text: #202a3c;
    --page-muted: #626e81;
    --page-line: #e8eaf0;
    --bodyBackground: #fff;
    --textColor: #202a3c;
    --titleColor: #192438;
    --borderRadius: 0;
    --pixel-edge: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 48'%3E%3Cpath fill='black' d='M0 0h24v24h24V0h24v48h24V24h24V0h48v24h24v24h24V24h24V0h24v48h24V24h24V0h24v24h24v24h24V0h24v48H0Z'/%3E%3C/svg%3E");
}
html { min-height: 100%; height: auto; scroll-padding-top: 24px; }
body.pixel-site { background: var(--page-bg); background-image: none; color: var(--page-text); font-family: 'Montserrat', sans-serif; min-height: 100vh; height: auto; display: block; margin: 0; }
.pixel-site button, .pixel-site input, .pixel-site select, .pixel-site textarea { font-family: inherit; }
.pixel-site [hidden] { display: none !important; }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.pixel-site .reveal, .pixel-site .reveal.active { opacity: 1; transform: none; transition: none; }
.skip-link { position: fixed; top: 8px; left: 16px; transform: translateY(-150%); z-index: 10001; background: #fff; color: #192438; padding: 12px 20px; font-size: 0.8125rem; font-weight: 700; }
.skip-link:focus { transform: translateY(0); }
.site-width { width: calc(100% - 64px); max-width: 1616px; margin-left: auto; margin-right: auto; }
.container { width: calc(100% - 64px); max-width: 1320px; margin-left: auto; margin-right: auto; padding-left: 12px; padding-right: 12px; }
.site-header { min-height: 103px; display: flex; align-items: center; gap: 20px; position: relative; z-index: 50; }
.site-brand { display: flex; align-items: center; flex: 0 0 auto; text-decoration: none; }
.site-brand img { display: block; width: 68px; height: 74px; object-fit: contain; }
.server-status { display: inline-flex; align-items: center; gap: 8px; background: none; border: 0; color: var(--page-text); font-size: 0.8125rem !important; font-weight: 700 !important; padding: 7px 0; white-space: nowrap; }
.server-status > i { color: #697489; font-size: 0.75rem; }
.server-status__dot, .status-dot { width: 8px; height: 8px; background: #a8b0bc; border-radius: 50%; box-shadow: 0 0 0 3px #a8b0bc15; }
.server-status.is-online .status-dot { background: #58dc00; box-shadow: 0 0 0 3px #effde4; }
.site-nav { display: flex; align-items: center; justify-content: center; gap: clamp(20px, 3.2vw, 56px); flex: 1; margin-left: 30px; }
.site-nav__link { display: inline-flex; align-items: center; justify-content: center; position: relative; isolation: isolate; min-height: 40px; color: var(--page-text); font-size: 0.8125rem; font-weight: 500; text-decoration: none; text-transform: uppercase; white-space: nowrap; }
.site-nav__link::before { content: ''; position: absolute; z-index: -1; left: 50%; width: 65%; height: 36px; transform: translateX(-50%) skew(-17deg); background: #ffbe0b; opacity: 0; transition: opacity .18s; }
.site-nav__link:hover { color: var(--page-text); }
.site-nav__link:hover::before { opacity: .35; }
.site-nav__link.active, .site-nav__link[aria-current='page'] { font-weight: 700; }
.site-nav__link.active::before, .site-nav__link[aria-current='page']::before { opacity: 1; }
.header-actions { display: flex; align-items: center; gap: 12px; margin-left: 28px; margin-right: 10px; }
.angle-button { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 48px; width: 48px; height: 48px; border: 0; border-radius: 0; background: #e7e9ef; color: #6a7589; transform: skew(-17deg); font-size: 1.3125rem !important; text-decoration: none; cursor: pointer; }
.angle-button > i, .angle-button > span { transform: skew(17deg); }
.angle-button:hover { background: #dce0e8; color: #32405a; }
.angle-button--shop, .angle-button--cart { background: #55d800; color: #fff; }
.angle-button--shop:hover, .angle-button--cart:hover { background: #4bc400; color: #fff; }
.angle-button--shop > span { font-size: 1.38rem; line-height: 1; font-weight: 600; text-shadow: 0 1px 0 rgb(22 102 0 / 18%); }
.menu-toggle { display: none; border: 0; background: transparent; color: var(--page-text); font-size: 1.5rem !important; padding: 8px; }
.site-search { position: absolute; top: calc(100% - 8px); right: 0; width: min(440px, 100%); padding: 20px; border: 1px solid var(--page-line); background: var(--page-bg); box-shadow: 0 14px 28px rgb(18 31 52 / 10%); }
.site-search form, .site-search > div { display: flex; gap: 8px; }
.site-search label { display: block; font-size: 0.75rem; font-weight: 700; margin-bottom: 10px; }
.site-search input { width: 100%; min-width: 0; border: 1px solid #dce0e8; border-radius: 0; padding: 11px; font-size: 0.8125rem; }
.site-search button { border: 0; background: #ffbf05; color: #23304a; padding: 10px 16px; font-weight: 700; font-size: 0.8125rem; }
.site-header a:focus-visible, .site-header button:focus-visible, .pixel-tile:focus-visible, .tile-cta:focus-visible, .site-footer button:focus-visible { outline: 3px solid #273e64; outline-offset: 5px; }

.pixel-tile { position: relative; isolation: isolate; overflow: hidden; background: var(--tile-color); border: 0; border-radius: 0; color: #fff; text-decoration: none; }
.pixel-tile::before, .pixel-tile::after { content: ''; position: absolute; left: 0; width: 100%; background: rgb(255 255 255 / 20%); pointer-events: none; z-index: -1; }
.pixel-tile::before { top: 0; height: 24%; }
.pixel-tile::after { top: calc(24% - 1px); height: 48px; mask-image: var(--pixel-edge); mask-size: 384px 48px; mask-repeat: repeat-x; transform: rotate(180deg); }
.pixel-bottom { position: absolute; bottom: 0; left: 0; width: 100%; height: 27%; min-height: 48px; background: rgb(0 0 0 / 11%); mask-image: var(--pixel-edge), linear-gradient(#000, #000); mask-size: 384px 48px, 100% calc(100% - 47px); mask-position: top left, bottom left; mask-repeat: repeat-x, no-repeat; z-index: -1; pointer-events: none; }
.tone-red { --tile-color: #ff240a; }
.tone-blue { --tile-color: #069afa; }
.tone-pink { --tile-color: #e833da; }
.tone-lime { --tile-color: #83ed00; }
.tone-yellow { --tile-color: #ffe323; }
.tone-gold { --tile-color: #ffba08; }
.tone-green { --tile-color: #05d881; }
.tone-navy { --tile-color: #263e6d; }
.tone-cyan { --tile-color: #13afe5; }
.tone-brown { --tile-color: #c77e32; }
.tone-charcoal { --tile-color: #333; }
.tile-badges { position: absolute; top: 24px; left: 24px; right: 20px; display: flex; align-items: flex-start; gap: 8px; flex-wrap: wrap; z-index: 3; }
.tile-badge { background: rgb(0 0 0 / 18%); color: #fff; padding: 8px 13px; font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; line-height: 1.2; }
.tile-badge--lime { background: #a2fb35; }
.tile-badge--gold { background: #ffb900; }
.tile-badge--beta { display: inline-flex; align-items: center; gap: 7px; background: #233a61; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 20%); }
.tile-badge--pink { background: #ff72a0; }
.tile-badge--dark { background: #cd812c; }
.tile-cta { display: inline-flex; align-items: center; gap: 10px; width: fit-content; background: rgb(255 255 255 / 12%); color: #fff; padding: 13px 24px; font-size: 0.8125rem; font-weight: 600; border: 0; border-radius: 0; text-decoration: none; }
.tile-cta:hover { background: rgb(255 255 255 / 24%); color: #fff; }
.tile-marker { position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%); width: 32px; height: 7px; background: #fff; }
.tile-marker::after { content: ''; position: absolute; left: 36px; top: 0; width: 8px; height: 7px; background: rgb(255 255 255 / 35%); }

.home-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.home-left, .home-right { display: grid; min-width: 0; gap: 16px; }
.home-left { grid-template-rows: 225fr 606fr 210fr; }
.home-right { grid-template-rows: 715fr 342fr; }
.home-shortcuts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.shortcut-tile { min-height: 150px; aspect-ratio: 1.744; display: flex; align-items: center; justify-content: center; padding: 25px 20px; text-align: center; }
.shortcut-tile h2 { margin: 0; color: #fff; font-size: clamp(22px, 2vw, 32px); font-weight: 900; text-transform: uppercase; line-height: 1.2; }
.shortcut-tile:hover, .social-tile:hover, .shop-banner:hover, .server-tile:hover { color: #fff; }
.offer-tile { aspect-ratio: 1.32; min-height: 440px; }
.offer-copy { padding: 40px; position: relative; z-index: 2; }
.offer-copy > p { color: #fff; font-size: 1rem; line-height: 1.4; margin: 0 0 2px; }
.offer-copy h1 { color: #fff; font-size: 2.875rem; line-height: 1.05; font-weight: 900; text-transform: uppercase; margin: 0 0 9px; }
.offer-copy .tile-badges { position: static; gap: 0; }
.offer-character { position: absolute; right: -3%; bottom: -6%; width: 61%; height: 87%; object-fit: contain; object-position: bottom right; pointer-events: none; }
.offer-tile > .tile-cta { position: absolute; bottom: 40px; left: 40px; z-index: 3; background: #02c878; }
.social-grid { display: grid; grid-template-columns: 1fr 1fr 2fr; gap: 16px; min-height: 150px; }
.social-tile { display: flex; align-items: center; justify-content: center; gap: 16px; min-width: 0; padding: 22px; }
.social-tile > i { font-size: 2.5rem; }
.social-tile strong { color: #fff; font-size: 1.125rem; line-height: 1.45; font-weight: 600; text-transform: uppercase; }
.social-tile--compact strong { display: none; }
.world-tile { position: relative; isolation: isolate; min-height: 550px; overflow: hidden; display: block; color: #fff; text-decoration: none; background: #253448; }
.world-tile > img, .world-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; z-index: -2; }
.world-tile::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgb(0 0 0 / 6%) 25%, rgb(0 0 0 / 12%) 45%, rgb(0 0 0 / 82%) 100%); }
.world-tile:hover { color: #fff; }
.world-copy { position: absolute; bottom: 58px; left: 32px; right: 32px; }
.world-copy h2 { font-size: clamp(28px, 2.35vw, 38px); font-weight: 900; line-height: 1.2; color: #fff; margin: 0 0 12px; text-transform: uppercase; }
.world-copy p { font-size: 1.3125rem; line-height: 1.45; margin: 0 0 22px; color: #fff; padding-right: 55px; }
.world-arrow { position: absolute; right: 32px; bottom: 58px; display: grid; place-items: center; width: 48px; height: 48px; background: rgb(255 255 255 / 25%); border-radius: 50%; color: #fff; }
.world-copy .world-arrow { right: 0; bottom: 0; }
.world-copy > .tile-cta { margin-top: 22px; }
.shop-banner { min-height: 250px; border-top: 4px solid #ffcc43; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 15px; padding: 24px; }
.shop-banner h2 { color: #fff; font-size: 2rem; font-weight: 900; text-transform: uppercase; border-bottom: 3px solid #ffcc43; margin: 0; padding: 0 8px 8px; line-height: 1.1; }
.shop-banner p { font-size: 0.8125rem; color: #d3dbee; margin: 0; }
.banner-border { position: absolute; inset: 7px; border: 1px dashed rgb(255 219 99 / 45%); pointer-events: none; }
.banner-icon { color: #ffd142; font-size: 2.5rem; }
.banner-decoration { position: absolute; bottom: 11%; left: 7%; color: #197ada; font-size: 4.0625rem; transform: rotate(-12deg); filter: drop-shadow(3px 4px 0 #11233f); }
.banner-decoration--right { left: auto; right: 6%; color: #ffbc12; transform: rotate(12deg); }

.server-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 16px; }
.server-tile { grid-column: span 3; min-height: 257px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 64px 46px 40px; }
.server-tile > img, .server-tile__image { width: 118px; height: 118px; object-fit: contain; transition: transform .2s; flex-shrink: 0; }
.server-tile:hover > img { transform: translateY(-5px) rotate(-3deg); }
.server-tile h2 { color: #fff; font-size: 2rem; font-weight: 800; line-height: 1.2; text-transform: uppercase; margin: 0; text-align: right; overflow-wrap: anywhere; }
.server-tile .tile-badges { top: 16px; left: 16px; gap: 8px; }
.server-grid--many .server-tile:nth-child(n+7) { grid-column: span 2; padding-right: 32px; padding-left: 32px; }
.server-grid--many .server-tile:nth-child(n+7) h2 { font-size: 1.75rem; }
.server-tile:only-child { grid-column: span 6; }
.shop-helpers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 16px; }
.shop-helpers > a { min-height: 160px; display: flex; align-items: center; justify-content: center; gap: 20px; padding: 24px; color: #fff; text-decoration: none; text-transform: uppercase; font-weight: 800; }
.shop-helpers > a > i { font-size: 2.125rem; }
.shop-helpers h2, .shop-helpers strong { color: #fff; font-size: 1.3125rem; margin: 0; font-weight: 800; }
.shop-helpers p { color: #fff; font-size: 0.75rem; margin: 5px 0 0; font-weight: 500; text-transform: none; }
.catalog-empty { padding: 56px 24px; text-align: center; background: #f4f6f9; border-bottom: 4px solid #ffbf05; }
.catalog-empty h1, .catalog-empty h2 { font-size: 1.5rem; font-weight: 800; text-transform: uppercase; }
.filter-status { font-size: 0.8125rem; color: var(--page-muted); margin-bottom: 16px; }
.rank-details { margin-top: 24px; margin-bottom: 24px; }
.rank-details > summary { color: var(--page-text); border-bottom: 1px solid var(--page-line); padding: 16px 0; cursor: pointer; font-weight: 700; font-size: 0.8125rem; text-transform: uppercase; }
.rank-details[open] > summary { margin-bottom: 24px; }
.pixel-site .rank-card, .pixel-site .rank-card__header, .pixel-site .rank-card__buy-btn, .pixel-site .rank-buy-btn, .pixel-site .ranks-table-container, .pixel-site .rank-popup__box, .pixel-site .rank-popup__option, .pixel-site .rank-popup__notice { border-radius: 0; box-shadow: none; }
.pixel-site .rank-buy-btn::after, .pixel-site .rank-card__buy-btn::after { border-radius: 0; }

.site-footer { display: grid; grid-template-columns: 1fr 1.35fr; gap: 18px 35px; align-items: start; padding-top: 26px; padding-bottom: 22px; color: var(--page-text); font-size: 0.75rem; line-height: 1.6; }
.site-footer p { margin: 0; }
.footer-copyright, .site-footer__copyright { color: var(--page-text); font-size: 0.75rem; }
.footer-copyright a, .site-footer__copyright a, .site-footer a { color: inherit; text-decoration: none; }
.footer-copyright > span, .footer-disclaimer > span { display: block; }
.footer-copyright img { max-width: 82px; max-height: 20px; object-fit: contain; vertical-align: middle; margin-left: 4px; }
.footer-disclaimer, .site-footer__disclaimer { justify-self: end; font-size: 0.75rem; color: var(--page-muted); }
.footer-disclaimer strong, .site-footer__disclaimer strong { color: var(--page-text); }
.footer-company, .site-footer__company { grid-column: 1 / -1; border-top: 1px solid var(--page-line); padding-top: 12px; color: var(--page-muted); font-size: 0.625rem; }
.footer-company > summary, .site-footer__company > summary { cursor: pointer; }
.footer-company > p, .site-footer__company > p { padding-top: 8px; }
.pixel-site .payments, .pixel-site .voucher, .pixel-site .daily_reward, .pixel-site .daily-reward { padding-top: 24px; }
.pixel-site .payments__content__product, .pixel-site .payments__content__code, .pixel-site .payments__content__forms__method__card, .pixel-site .payments__content__forms__user__input, .pixel-site .payments__content__forms_price__btn, .pixel-site .payments__variant-info, .pixel-site .voucher__wrapper, .pixel-site .voucher__input, .pixel-site .voucher__btn, .pixel-site .tos { border-radius: 0; box-shadow: none; }
.pixel-site .tos { margin-top: 24px; margin-bottom: 40px; border: 1px solid var(--page-line); }
.pixel-site .payments__content__code { display: grid; grid-template-columns: minmax(0, 1fr) 52px; border: 1px solid #e2e8f0; }
.pixel-site .payments__content__label { grid-column: 1 / -1; min-width: 0; width: 100%; min-height: 44px; padding: 12px; margin: 0; border-radius: 0; }
.pixel-site .payments__content__code__input { width: 100%; min-width: 0; margin: 0; border: 0; border-radius: 0; }
.pixel-site .payments__content__code__btn { width: 52px; padding: 0; margin: 0; border-radius: 0; }
.ip-toast-notification { position: fixed; left: 50%; top: 20px; transform: translate(-50%, -20px); opacity: 0; visibility: hidden; background: #54d800; color: #183405; padding: 14px 24px; font-size: 0.8125rem; font-weight: 700; z-index: 10000; pointer-events: none; transition: .2s; }
.ip-toast-notification.show { transform: translate(-50%, 0); opacity: 1; visibility: visible; }
.site-toast { position: fixed; left: 50%; bottom: 24px; transform: translate(-50%, 20px); opacity: 0; visibility: hidden; padding: 14px 22px; background: #22375b; color: #fff; font-size: 0.8125rem; font-weight: 600; z-index: 10000; max-width: calc(100% - 28px); text-align: center; pointer-events: none; transition: .2s; }
.site-toast.is-visible { transform: translate(-50%, 0); opacity: 1; visibility: visible; }


@media (max-width: 1200px) {
    .site-nav { gap: 20px; margin-left: 10px; }
    .header-actions { margin-left: 8px; }
    .server-status { gap: 5px; }
    .social-tile { gap: 12px; padding: 16px; }
    .social-tile strong { font-size: 0.875rem; }
    .social-tile > i { font-size: 2.125rem; }
    .world-copy h2 { font-size: 1.75rem; }
    .world-copy p { font-size: 1rem; }
    .server-tile { padding-left: 32px; padding-right: 32px; }
    .server-tile h2 { font-size: 1.75rem; }
    .server-grid--many .server-tile:nth-child(n+7) { gap: 18px; padding-left: 24px; padding-right: 24px; }
    .server-grid--many .server-tile:nth-child(n+7) h2 { font-size: 1.375rem; }
    .server-grid--many .server-tile:nth-child(n+7) > img { width: 85px; height: 100px; }
}
@media (max-width: 980px) {
    .site-header { min-height: 92px; gap: 16px; }
    .site-brand img { width: 58px; height: 68px; }
    .menu-toggle { display: block; margin-left: auto; }
    .site-nav { display: none; position: absolute; top: 100%; left: 0; right: 0; background: var(--page-bg); margin: 0; padding: 20px; border: 1px solid var(--page-line); box-shadow: 0 12px 20px rgb(0 0 0 / 8%); }
    .site-nav.is-open, .site-header.is-open .site-nav { display: flex; flex-direction: column; gap: 12px; align-items: stretch; }
    .site-nav__link::before { max-width: 90px; }
    .header-actions { margin-left: auto; }
    .offer-copy { padding: 26px; }
    .offer-copy h1 { font-size: 2.375rem; }
    .offer-tile > .tile-cta { left: 26px; bottom: 32px; }
    .tile-badges { top: 20px; left: 20px; gap: 6px; }
    .tile-badge { padding: 7px 9px; font-size: 0.5625rem; }
    .world-copy { left: 24px; right: 24px; }
    .world-arrow { right: 24px; }
    .banner-decoration { font-size: 2.875rem; }
    .shortcut-tile h2 { font-size: 1.375rem; }
    .social-grid { gap: 12px; }
    .social-tile { padding: 13px; gap: 10px; }
    .social-tile strong { font-size: 0.6875rem; }
    .social-tile > i { font-size: 1.8125rem; }
    .server-grid--many .server-tile:nth-child(n+7) { grid-column: span 3; }
    .site-footer { column-gap: 18px; }
}
@media (max-width: 700px) {
    .site-width { width: calc(100% - 28px); }
    .site-header { min-height: 86px; gap: 12px; }
    .site-brand img { width: 53px; height: 65px; }
    .server-status { font-size: 0.6875rem !important; }
    .header-actions { gap: 8px; margin-right: 7px; }
    .angle-button { width: 38px; height: 40px; flex-basis: 38px; font-size: 1.125rem !important; }
    .menu-toggle { font-size: 1.3125rem !important; padding: 5px; }
    .home-grid { grid-template-columns: 1fr; }
    .home-left, .home-right { grid-template-rows: auto; }
    .home-shortcuts { gap: 12px; }
    .shortcut-tile { min-height: 132px; min-width: 0; width: 100%; aspect-ratio: auto; padding: 20px 12px; }
    .shortcut-tile h2 { font-size: clamp(15px, 4vw, 25px); }
    .offer-tile { min-height: 430px; min-width: 0; width: 100%; aspect-ratio: auto; }
    .offer-copy { padding: 27px; }
    .offer-copy h1 { font-size: 2.625rem; }
    .offer-character { width: 66%; height: 85%; }
    .social-grid { min-height: 145px; }
    .social-tile strong { font-size: 0.6875rem; }
    .social-tile > i { font-size: 1.75rem; }
    .world-tile { min-height: 480px; }
    .world-copy h2 { font-size: 1.75rem; }
    .world-copy p { font-size: 1.0625rem; }
    .shop-banner { min-height: 260px; }
    .server-grid { grid-template-columns: 1fr; gap: 14px; }
    .server-tile, .server-tile:only-child, .server-grid--many .server-tile:nth-child(n+7) { grid-column: auto; min-height: 230px; padding: 66px 26px 32px; }
    .server-tile h2, .server-grid--many .server-tile:nth-child(n+7) h2 { font-size: 1.625rem; }
    .server-tile > img, .server-grid--many .server-tile:nth-child(n+7) > img { width: 100px; height: 108px; }
    .shop-helpers { grid-template-columns: 1fr; gap: 14px; }
    .shop-helpers > a { min-height: 138px; }
    .site-footer { grid-template-columns: 1fr auto; padding-top: 22px; gap: 16px; }
    .footer-disclaimer, .site-footer__disclaimer { grid-column: 1 / -1; justify-self: start; font-size: 0.6875rem; }
    .footer-copyright, .site-footer__copyright { font-size: 0.6875rem; }
    .pixel-site .tos { padding: 24px; }
    .pixel-site .voucher__wrapper { padding: 28px 20px; }
}
@media (max-width: 380px) {
    .site-header { gap: 8px; }
    .server-status > i { display: none; }
    .header-actions { gap: 7px; }
    .angle-button { width: 33px; flex-basis: 33px; }
    .social-grid { grid-template-columns: 1fr 1fr 2fr; gap: 10px; }
    .social-tile strong { font-size: 0.6875rem; }
    .social-tile > i { font-size: 1.75rem; }
    .offer-copy { padding: 22px; }
    .server-tile { gap: 14px; padding-left: 22px; padding-right: 22px; }
    .server-tile h2 { font-size: 1.4375rem; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .pixel-site *, .pixel-site *::before, .pixel-site *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}


/* pixel-shop.css */
.product-shop { padding-bottom: 36px; }
.product-shop__header { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 28px 0 30px; }
.product-shop__back { display: inline-flex; align-items: center; gap: 9px; color: #626b7b; font-size: 0.75rem; font-weight: 600; text-decoration: none; margin-bottom: 24px; }
.product-shop__back:hover { color: #151e31; }
.product-shop__eyebrow { color: #687083; font-size: 0.8125rem; margin: 0 0 5px; }
.product-shop__header h1 { color: var(--page-text, #192237); font-size: clamp(28px, 3vw, 44px); font-weight: 900; line-height: 1.1; text-transform: uppercase; margin: 0; }
.product-shop__voucher { display: inline-flex; align-items: center; gap: 10px; padding: 16px 22px; background: #ffbf05; color: #192237; font-size: 0.75rem; font-weight: 800; text-decoration: none; }
.product-shop__voucher:hover { background: #ffd027; color: #192237; }
.product-shop__catalog { display: grid; gap: 16px; }
.product-shop__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
@media (min-width: 1200px) {
    .product-shop__grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
    .product-tile { grid-column: span 3; }
    .product-tile:nth-child(n+7) { grid-column: span 2; padding-inline: 24px; }
    .product-tile:nth-child(n+7) .product-tile__body { grid-template-columns: 80px minmax(0, 1fr); gap: 16px; }
    .product-tile:nth-child(n+7) .product-tile__image { width: 80px; height: 100px; }
    .product-tile:nth-child(n+7) .product-tile__details h2 { font-size: 1.4rem; }
    .product-tile:nth-child(n+7) .product-tile__description { font-size: .75rem; }
    .product-tile:nth-child(n+7) .product-tile__buy { font-size: .65rem; padding: 13px; gap: 14px; }
}
.product-tile { display: flex; flex-direction: column; color: #fff; padding: 20px 30px 25px; min-height: 300px; }
.product-tile__badges { display: flex; align-items: flex-start; flex-wrap: wrap; gap: 6px; min-height: 29px; position: relative; z-index: 1; }
.product-tile__badge { display: inline-flex; align-items: center; gap: 6px; min-height: 28px; font-size: 0.625rem; font-weight: 700; padding: 6px 10px; line-height: 1.3; text-transform: uppercase; }
.product-tile__badge--keys { background: #ce812c; color: #fff; }
.product-tile__body { display: grid; grid-template-columns: 130px minmax(0, 1fr); align-items: center; gap: 25px; flex: 1; position: relative; z-index: 1; padding: 18px 0 22px; }
.product-tile__image { display: block; width: 130px; height: 125px; object-fit: contain; transition: transform .22s ease; }
.product-tile:hover .product-tile__image { transform: translateY(-4px) rotate(-3deg); }
.product-tile__details { text-align: right; min-width: 0; }
.product-tile__details h2 { font-size: clamp(24px, 2vw, 34px); font-weight: 900; text-transform: uppercase; line-height: 1.12; color: #fff; text-shadow: 0 2px 3px rgb(0 0 0 / 22%); margin: 0 0 12px; overflow-wrap: anywhere; }
.product-tile__description { font-size: 0.8125rem; font-weight: 500; line-height: 1.65; color: #fff; margin: 0; overflow-wrap: anywhere; }
.product-tile__footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 18px; position: relative; z-index: 1; }
.product-tile__pricing { display: flex; flex-direction: column; gap: 3px; }
.product-tile__price { color: #fff; font-size: 1.875rem; font-weight: 900; line-height: 1.1; }
.product-tile__price small { font-size: 0.9375rem; font-weight: 700; }
.product-tile__total { color: #fff; font-size: 0.6875rem; font-weight: 500; }
.product-tile__buy { display: inline-flex; align-items: center; gap: 24px; color: #fff; background: rgb(0 0 0 / 15%); border: 1px solid rgb(255 255 255 / 35%); border-radius: 0; font-size: 0.75rem; font-weight: 800; padding: 15px 20px; cursor: pointer; transition: background .2s ease; }
.product-tile__buy:hover, .product-tile__buy:focus-visible { background: rgb(0 0 0 / 28%); color: #fff; text-decoration: none; }
.product-shop__voucher:focus-visible, .product-tile__buy:focus-visible, .product-shop__back:focus-visible { outline: 3px solid #192237; outline-offset: 4px; }
.product-shop__community { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 32px; }
.product-panel { min-width: 0; background: #f5f6f8; padding: 28px; border-top: 4px solid #ffbf05; }
.product-panel--leaders { border-top-color: #55de00; }
.product-panel--purchases { border-top-color: #13aff1; }
.product-panel__heading { display: flex; align-items: center; gap: 12px; margin-bottom: 26px; color: #1b2944; }
.product-panel__heading > i { color: #df9d00; font-size: 1.25rem; }
.product-panel--leaders .product-panel__heading > i { color: #48be00; }
.product-panel--purchases .product-panel__heading > i { color: #0c9fdf; }
.product-panel__heading h2 { font-size: 1.1875rem; font-weight: 800; margin: 0; text-transform: uppercase; }
.product-goal + .product-goal { margin-top: 24px; }
.product-goal__title { color: #25324a; font-size: 0.8125rem; line-height: 1.7; font-weight: 700; }
.product-goal__title span { display: block; color: #677083; font-size: 0.75rem; font-weight: 500; }
.product-goal__progress { background: #e1e4ea; height: 13px; margin-top: 12px; overflow: hidden; }
.product-goal__bar { background: #ffbf05; height: 100%; max-width: 100%; }
.product-podium { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; align-items: end; padding-top: 28px; }
.product-podium__place { display: flex; position: relative; flex-direction: column; align-items: center; gap: 12px; min-width: 0; padding: 22px 6px 16px; }
.product-podium__place--silver { background: #dfe6ec; min-height: 180px; }
.product-podium__place--gold { background: #ffd12c; min-height: 213px; }
.product-podium__place--bronze { background: #dca77a; min-height: 164px; }
.product-podium__medal { position: absolute; top: -14px; width: 29px; height: 29px; background: #fff; color: #67768c; display: grid; place-items: center; }
.product-podium__place--gold .product-podium__medal { color: #b97d00; }
.product-podium__place--bronze .product-podium__medal { color: #9e5d27; }
.product-podium__place img, .product-podium__empty { display: block; width: 48px; height: 48px; image-rendering: pixelated; }
.product-podium__place--gold img { width: 58px; height: 58px; }
.product-podium__empty { background: rgb(255 255 255 / 45%); }
.product-podium__nick { width: 100%; color: #25324a; text-align: center; font-size: 0.6875rem; font-weight: 700; overflow-wrap: anywhere; }
.product-podium__place > strong { font-size: 1.625rem; color: #25324a; margin-top: auto; line-height: 1; font-weight: 900; }
.product-purchases { display: flex; flex-direction: column; gap: 15px; }
.product-purchase { display: flex; align-items: flex-start; gap: 12px; position: relative; padding-bottom: 15px; border-bottom: 1px solid #e2e5ea; }
.product-purchase:last-child { border-bottom: 0; padding-bottom: 0; }
.product-purchase > img { width: 42px; height: 42px; image-rendering: pixelated; }
.product-purchase__details { min-width: 0; flex: 1; }
.product-purchase__details h3 { margin: 0 0 4px; font-size: 0.8125rem; font-weight: 800; color: #26334b; overflow-wrap: anywhere; }
.product-purchase__details h3 i { font-size: 0.625rem; color: #4bc305; }
.product-purchase__details p { font-size: 0.6875rem; line-height: 1.5; margin: 0; color: #59667d; overflow-wrap: anywhere; }
.product-purchase__details time { font-size: 0.625rem; color: #788295; }
.product-purchase__time { background: #e2f7d6; color: #3e781e; font-size: 0.5rem; font-weight: 700; padding: 4px 6px; white-space: nowrap; }
.upsell-modal { display: none; position: fixed; inset: 0; z-index: 9999; background: rgb(12 23 42 / 80%); align-items: center; justify-content: center; padding: 20px; overflow-y: auto; }
.upsell-modal-content { background: #fff; border-top: 6px solid #ffbf05; padding: 30px; width: 100%; max-width: 480px; text-align: center; position: relative; max-height: calc(100dvh - 40px); overflow-y: auto; animation: product-modal-in .2s ease; }
.upsell-close { position: absolute; top: 10px; right: 14px; font-size: 1.75rem; line-height: 1; padding: 4px; border: 0; background: transparent; color: #687083; cursor: pointer; }
.upsell-icon { font-size: 2.875rem; margin-bottom: 10px; }
.upsell-modal h2 { font-size: 1.4375rem; line-height: 1.25; color: #1b2944; font-weight: 900; text-transform: uppercase; margin: 0 0 14px; }
.upsell-modal p { font-size: 0.8125rem; line-height: 1.65; color: #5c677b; margin: 0 0 18px; }
.upsell-benefits { background: #fff4c7; padding: 18px; margin-bottom: 20px; text-align: left; }
.upsell-benefits ul { margin: 0; padding: 0; list-style: none; }
.upsell-benefits li { color: #71581d; font-size: 0.8125rem; line-height: 1.7; padding-left: 20px; position: relative; }
.upsell-benefits li + li { margin-top: 5px; }
.upsell-benefits li::before { content: '\2713'; color: #35840c; position: absolute; left: 0; font-weight: 900; }
.upsell-btn-primary { display: block; background: #54d800; color: #173306; border: 0; padding: 16px; width: 100%; font-size: 0.8125rem; font-weight: 800; cursor: pointer; }
.upsell-btn-primary:hover { background: #63e512; }
.upsell-btn-secondary { margin-top: 10px; border: 0; background: transparent; color: #5c677b; padding: 9px 0; font-size: 0.6875rem; font-weight: 600; text-decoration: underline; cursor: pointer; }
.upsell-btn-primary:focus-visible, .upsell-btn-secondary:focus-visible, .upsell-close:focus-visible { outline: 3px solid #1b2944; outline-offset: 3px; }
.upsell-modal.closing { opacity: 0; transition: opacity .3s; }
@keyframes product-modal-in { from { opacity: 0; transform: translateY(15px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 1100px) {
    .product-tile { padding: 18px 22px 22px; }
    .product-tile__body { grid-template-columns: 100px minmax(0, 1fr); gap: 18px; }
    .product-tile__image { width: 100px; height: 110px; }
    .product-shop__community { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .product-panel--purchases:last-child { grid-column: 1 / -1; }
    .product-panel--purchases .product-purchases { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
}
@media (max-width: 760px) {
    .product-shop__header { align-items: flex-start; padding-top: 12px; gap: 18px; }
    .product-shop__header h1 { font-size: 1.6875rem; }
    .product-shop__back { margin-bottom: 18px; }
    .product-shop__voucher { font-size: 0.625rem; padding: 13px; margin-top: 2px; white-space: nowrap; gap: 7px; }
    .product-shop__grid { grid-template-columns: 1fr; }
    .product-tile { min-height: 260px; padding: 17px 22px 22px; }
    .product-tile__body { grid-template-columns: 112px minmax(0, 1fr); padding: 12px 0 20px; }
    .product-tile__image { width: 112px; height: 110px; }
    .product-tile__details h2 { font-size: 1.625rem; }
    .product-shop__community { grid-template-columns: 1fr; margin-top: 22px; }
    .product-panel { padding: 23px; }
    .product-panel--purchases .product-purchases { display: flex; }
}
@media (max-width: 420px) {
    .product-shop__header { flex-direction: column; }
    .product-shop__voucher { margin-top: 0; }
    .product-tile__body { grid-template-columns: 86px minmax(0, 1fr); gap: 12px; }
    .product-tile__image { width: 86px; height: 100px; }
    .product-tile__details h2 { font-size: 1.4375rem; }
    .product-tile__description { font-size: 0.6875rem; }
    .product-tile__buy { padding: 13px 15px; gap: 16px; }
    .product-tile__price { font-size: 1.6875rem; }
    .upsell-modal-content { padding: 24px 20px; }
}
@media (prefers-reduced-motion: reduce) {
    .product-tile__image, .product-tile__buy, .upsell-modal { transition: none; }
    .upsell-modal-content { animation: none; }
}
.topup-bonus { align-self: flex-start; position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; background: #233a61; color: #ffe28a; border-bottom: 3px solid #ffcf35; font-size: .75rem; font-weight: 800; }


/* motion.css */
/* Progressive enhancement: content remains visible without JavaScript. */
.pixel-site .motion-enter {
    animation: livesky-appear .65s cubic-bezier(.22, 1, .36, 1) both;
    animation-delay: var(--motion-delay, 0ms);
}
.pixel-site .motion-surface {
    transition: box-shadow .3s ease;
}
.pixel-site .motion-shine {
    position: absolute;
    inset: -45% -75%;
    z-index: 4;
    display: block;
    pointer-events: none;
    background: linear-gradient(110deg, transparent 43%, rgb(255 255 255 / 8%) 49%, rgb(255 255 255 / 14%) 50%, transparent 57%);
    transform: translateX(-65%);
    opacity: 0;
}
.pixel-site .tile-cta,
.pixel-site .product-tile__buy,
.pixel-site .product-shop__voucher,
.pixel-site .upsell-btn-primary,
.pixel-site .angle-button {
    transition: background .2s ease, box-shadow .2s ease, scale .2s ease;
}
.pixel-site .tile-cta > i,
.pixel-site .product-tile__buy > i,
.pixel-site .world-arrow > i,
.pixel-site .social-tile > i,
.pixel-site .banner-icon,
.pixel-site .banner-decoration,
.pixel-site .site-brand img {
    transition: translate .35s cubic-bezier(.22, 1, .36, 1), scale .35s ease, rotate .35s ease;
}
.pixel-site .world-tile > img,
.pixel-site .server-tile > img,
.pixel-site .product-tile__image {
    transition: transform .35s ease, scale .7s cubic-bezier(.22, 1, .36, 1);
}
.motion-enabled .motion-in-view .offer-character {
    animation: livesky-float 5s ease-in-out infinite;
}
.motion-enabled .motion-in-view .banner-icon {
    animation: livesky-gem 4.5s ease-in-out infinite;
}
.motion-enabled .server-status.is-online .status-dot {
    animation: livesky-status 3s ease-out infinite;
}
.pixel-site .motion-enter .product-goal__bar {
    transform-origin: left center;
    animation: livesky-progress .95s cubic-bezier(.22, 1, .36, 1) both;
    animation-delay: var(--motion-delay, 0ms);
}
.motion-paused .pixel-site .offer-character,
.motion-paused .pixel-site .banner-icon,
.motion-paused .pixel-site .status-dot {
    animation-play-state: paused;
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .pixel-site .motion-tilt {
        transform: perspective(1400px) rotateX(var(--motion-tilt-x, 0deg)) rotateY(var(--motion-tilt-y, 0deg));
        transition: transform .25s ease-out, box-shadow .3s ease;
    }
    .pixel-site .motion-surface:hover {
        box-shadow: 0 10px 26px rgb(19 37 64 / 14%);
    }
    .pixel-site .motion-surface:hover > .motion-shine,
    .pixel-site .motion-surface:focus-within > .motion-shine {
        animation: livesky-shine .9s ease both;
    }
    .pixel-site .world-tile:hover > img { scale: 1.045; }
    .pixel-site .product-tile:hover .product-tile__image,
    .pixel-site .server-tile:hover > img { scale: 1.07; }
    .pixel-site .tile-cta:hover > i,
    .pixel-site .product-tile__buy:hover > i,
    .pixel-site .world-tile:hover .world-arrow > i { translate: 4px 0; }
    .pixel-site .social-tile:hover > i { translate: 0 -4px; rotate: -7deg; scale: 1.1; }
    .pixel-site .shop-banner:hover .banner-decoration { translate: 0 -7px; scale: 1.1; }
    .pixel-site .shop-banner:hover .banner-decoration--right { translate: 0 -10px; }
    .pixel-site .site-brand:hover img { rotate: -6deg; scale: 1.07; }
    .pixel-site .angle-button:hover { translate: 0 -2px; }
    .pixel-site .angle-button { transition: background .2s ease, translate .2s ease, scale .2s ease; }
}
@media (prefers-reduced-motion: no-preference) {
    .pixel-site .tile-cta:active,
    .pixel-site .product-tile__buy:active,
    .pixel-site .product-shop__voucher:active,
    .pixel-site .upsell-btn-primary:active,
    .pixel-site .angle-button:active { scale: .97; }
    .pixel-site .site-search:not([hidden]) { animation: livesky-appear .22s ease both; }
}
@keyframes livesky-appear {
    from { opacity: .7; translate: 0 6px; }
    to { opacity: 1; translate: 0 0; }
}
@keyframes livesky-float {
    0%, 100% { translate: 0 0; rotate: 0deg; }
    50% { translate: 0 -10px; rotate: 1deg; }
}
@keyframes livesky-gem {
    0%, 100% { translate: 0 0; rotate: -4deg; }
    50% { translate: 0 -7px; rotate: 5deg; }
}
@keyframes livesky-status {
    0% { box-shadow: 0 0 0 0 rgb(88 220 0 / 35%); }
    65%, 100% { box-shadow: 0 0 0 7px rgb(88 220 0 / 0%); }
}
@keyframes livesky-shine {
    0% { transform: translateX(-65%); opacity: 0; }
    20% { opacity: 1; }
    100% { transform: translateX(65%); opacity: 0; }
}
@keyframes livesky-progress {
    from { scale: 0 1; }
    to { scale: 1 1; }
}
@media (prefers-reduced-motion: reduce) {
    .pixel-site .motion-enter,
    .pixel-site .motion-enter .product-goal__bar,
    .pixel-site .offer-character,
    .pixel-site .banner-icon,
    .pixel-site .status-dot,
    .pixel-site .motion-shine {
        animation: none !important;
    }
    .pixel-site .motion-tilt { transform: none !important; }
    .pixel-site .motion-surface,
    .pixel-site .world-tile > img,
    .pixel-site .server-tile > img,
    .pixel-site .product-tile__image,
    .pixel-site .tile-cta,
    .pixel-site .tile-cta > i,
    .pixel-site .product-tile__buy,
    .pixel-site .product-tile__buy > i,
    .pixel-site .product-shop__voucher,
    .pixel-site .upsell-btn-primary,
    .pixel-site .angle-button,
    .pixel-site .world-arrow > i,
    .pixel-site .social-tile > i,
    .pixel-site .banner-icon,
    .pixel-site .banner-decoration,
    .pixel-site .site-brand img { transition: none !important; }
    .pixel-site .server-tile:hover > img,
    .pixel-site .product-tile:hover .product-tile__image { transform: none; }
}


/* pixel-checkout.css */
.pixel-checkout { padding-top: 12px; padding-bottom: 24px; }
.product-detail__card { display: grid; grid-template-columns: minmax(240px, .85fr) minmax(0, 1.15fr); width: min(100%, 1000px); margin-inline: auto; border: 1px solid var(--page-line); background: var(--page-bg); }
.product-detail .checkout-product__hero { justify-content: center; min-height: 310px; height: 100%; padding: 30px; }
.product-detail .checkout-product__image { width: min(75%, 230px); height: 230px; margin: 0; }
.product-detail__content { display: flex; flex-direction: column; justify-content: center; min-width: 0; padding: clamp(24px, 3vw, 40px); }
.product-detail__content h1 { margin: 0 0 18px; color: var(--page-text); font-size: clamp(1.25rem, 2vw, 1.8rem); line-height: 1.25; font-weight: 900; text-transform: uppercase; overflow-wrap: anywhere; }
.product-detail .cart-add-form--checkout { margin: 24px 0 0; background: transparent; }
.product-detail .cart-add { min-height: 50px; background: #ffcf32; color: #20385f; border: 0; font-size: .8rem; transition: background .2s; }
.product-detail .cart-add:hover { background: #ffdb64; }
.product-detail__variant-label { display: block; margin-bottom: 8px; font-size: .75rem; font-weight: 800; color: var(--page-text); }
.product-detail__variant { display: block; width: 100%; min-height: 48px; margin-bottom: 16px; padding: 12px; border: 1px solid var(--page-line); border-radius: 0; background: #f4f7fb; color: #20385f; font: inherit; font-size: .8rem; }
.product-detail :focus-visible { outline: 3px solid #069afa; outline-offset: 3px; }
@media(max-width: 640px) {
    .product-detail__card { grid-template-columns: minmax(0, 1fr); }
    .product-detail .checkout-product__hero { min-height: 200px; padding: 18px; }
    .product-detail .checkout-product__image { width: 165px; height: 165px; }
    .product-detail__content { padding: 24px 20px; }
    .product-detail .cart-add-form--checkout { margin-top: 20px; }
}
.checkout-back { display: inline-flex; align-items: center; gap: 9px; color: var(--page-muted); font-size: .75rem; font-weight: 600; text-decoration: none; margin-bottom: 24px; }
.checkout-back:hover { color: var(--page-text); }
.checkout-back i { font-size: .6875rem; transition: transform .2s; }
.checkout-back:hover i { transform: translateX(-4px); }
.checkout-header { margin-bottom: 26px; }
.checkout-header__line { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.checkout-eyebrow { color: var(--page-muted); font-size: .625rem; letter-spacing: .12em; font-weight: 700; margin: 0 0 7px; }
.checkout-header h1 { color: var(--page-text); font-size: clamp(1.5rem, 2.2vw, 2.25rem); font-weight: 900; text-transform: uppercase; line-height: 1.18; margin: 0; }
.checkout-header__icon { display: grid; place-items: center; flex: 0 0 54px; height: 54px; background: #ffbf08; color: #24314a; font-size: 1.375rem; }
.checkout-layout { display: grid; grid-template-columns: minmax(280px, .8fr) minmax(0, 1.65fr); gap: 24px; align-items: start; }
.checkout-product, .checkout-form { min-width: 0; }
.checkout-product__hero { display: flex; flex-direction: column; align-items: center; padding: 24px 30px 30px; min-height: 330px; }
.checkout-product__badge { align-self: flex-start; background: #ffbf08; color: #25304a; padding: 7px 12px; font-size: .625rem; font-weight: 800; letter-spacing: .03em; }
.checkout-product__promotion { position: absolute; right: 24px; top: 24px; background: #ff344d; color: #fff; padding: 7px 12px; font-size: .6875rem; font-weight: 800; }
.checkout-product__image { width: 174px; height: 170px; object-fit: contain; margin: 10px auto 12px; filter: drop-shadow(0 9px 0 rgb(0 0 0 / 10%)); transition: transform .3s; }
.checkout-product__hero:hover .checkout-product__image { transform: translateY(-5px) rotate(-3deg); }
.checkout-product__hero h2 { color: #fff; text-shadow: 0 2px 3px rgb(0 0 0 / 22%); margin: 0; text-align: center; font-weight: 900; font-size: clamp(1.375rem, 2vw, 2rem); line-height: 1.2; text-transform: uppercase; overflow-wrap: anywhere; }
.checkout-product__description { border: 1px solid var(--page-line); border-top: 0; padding: 25px 28px; background: var(--page-bg); }
.checkout-product__description h3 { color: var(--page-text); font-size: .8125rem; text-transform: uppercase; font-weight: 800; margin: 0 0 13px; }
.checkout-product__richtext { color: var(--page-muted); font-size: .8125rem; font-weight: 500; line-height: 1.8; overflow-wrap: anywhere; }
.checkout-product__richtext > :last-child { margin-bottom: 0; }
.checkout-product__richtext p { font-size: inherit; line-height: inherit; }
.checkout-product__richtext ul, .checkout-product__richtext ol { padding-left: 20px; }
.checkout-product__richtext img { max-width: 100%; height: auto; }
.checkout-product__richtext a { color: #0783c9; }
.checkout-discount { background: #f2f5f8; padding: 24px 28px; margin-top: 16px; }
.checkout-discount label { display: flex; align-items: center; gap: 8px; color: #24314a; font-size: .75rem; font-weight: 700; margin-bottom: 14px; }
.checkout-discount label i { color: #069afa; }
.checkout-discount__controls { display: flex; }
.checkout-discount input { background: #fff; border: 1px solid #dce2eb; border-right: 0; border-radius: 0; width: 100%; min-width: 0; min-height: 48px; color: #24314a; font-size: .75rem; padding: 12px; font-weight: 600; }
.checkout-discount button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; flex-shrink: 0; border: 0; border-radius: 0; background: #263e6d; color: #fff; padding: 12px 15px; font-size: .6875rem; font-weight: 700; }
.checkout-discount button:hover { background: #355386; }
.checkout-step { padding: 27px 30px; border: 1px solid var(--page-line); margin-bottom: 16px; background: var(--page-bg); }
.checkout-step__heading { display: flex; align-items: center; gap: 14px; margin-bottom: 23px; }
.checkout-step__number { display: grid; place-items: center; width: 44px; height: 44px; flex-shrink: 0; background: #ffbf08; color: #25314b; font-size: .9375rem; font-weight: 900; }
.checkout-step--methods .checkout-step__number { background: #069afa; color: #fff; }
.checkout-step--details .checkout-step__number { background: #83ed00; color: #25314b; }
.checkout-step__heading p { font-size: .5625rem; letter-spacing: .1em; font-weight: 700; color: var(--page-muted); margin: 0 0 3px; }
.checkout-step__heading h2 { color: var(--page-text); font-size: 1.0625rem; line-height: 1.25; font-weight: 800; margin: 0; }
.checkout-variant { display: flex; align-items: center; gap: 14px; background: #fff8dd; padding: 16px 18px; border-left: 3px solid #ffbf08; }
.checkout-variant > i { color: #cf9400; font-size: .875rem; }
.checkout-variant span, .checkout-variant strong { display: block; }
.checkout-variant span { font-size: .625rem; color: #796c42; margin-bottom: 4px; }
.checkout-variant strong { color: #483d22; font-size: .8125rem; font-weight: 800; overflow-wrap: anywhere; }
.checkout-range { margin: 0 0 20px; }
.checkout-range label { display: block; color: var(--page-muted); font-size: .75rem; margin-bottom: 12px; }
.checkout-range input { display: block; width: 100%; height: 22px; accent-color: #069afa; }
.checkout-range__labels { display: flex; justify-content: space-between; gap: 16px; margin-top: 8px; font-size: .625rem; font-weight: 600; color: var(--page-muted); }
.checkout-range__labels span:last-child { text-align: right; }
.checkout-empty { font-size: .8125rem; color: var(--page-muted); line-height: 1.7; margin: 0; }
.checkout-methods { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.pixel-checkout .checkout-method { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: row; align-items: center; gap: 12px; min-height: 84px; width: 100%; padding: 18px; background: var(--page-bg); border: 2px solid var(--page-line); border-radius: 0; box-shadow: none; transform: none; text-align: left; transition: border-color .2s, background .2s; }
.pixel-checkout .checkout-method:hover { background: #f1f9ff; border-color: #88cdfb; transform: none; box-shadow: none; }
.pixel-checkout .checkout-method.active { background: #eaf7ff; border-color: #069afa; transform: none; box-shadow: none; }
.checkout-method__icon { width: 30px; flex-shrink: 0; text-align: center; color: #069afa; font-size: 1.625rem; }
.checkout-method__name { color: var(--page-text); font-size: .8125rem; font-weight: 800; flex: 1; min-width: 0; overflow-wrap: anywhere; }
.checkout-method__check { display: grid; place-items: center; width: 20px; height: 20px; flex-shrink: 0; border: 1px solid #dce2eb; color: transparent; font-size: .625rem; }
.checkout-method.active .checkout-method__check { border-color: #069afa; background: #069afa; color: #fff; }
.checkout-method__fx { position: absolute; z-index: -1; inset: 0 34px 0 0; overflow: hidden; pointer-events: none; }
.checkout-method__fx i { position: absolute; bottom: -12px; color: #069afa; opacity: 0; font-size: .76rem; filter: drop-shadow(0 1px 0 rgb(15 75 116 / 18%)); }
.checkout-method__fx i:nth-child(1) { left: 18%; }
.checkout-method__fx i:nth-child(2) { left: 48%; font-size: .7rem; }
.checkout-method__fx i:nth-child(3) { left: 75%; }
.checkout-method:hover .checkout-method__fx i,
.checkout-method.active .checkout-method__fx i { animation: checkout-payment-icons-up .9s cubic-bezier(.22,.7,.3,1) both; }
.checkout-method:hover .checkout-method__fx i:nth-child(2),
.checkout-method.active .checkout-method__fx i:nth-child(2) { animation-delay: .08s; }
.checkout-method:hover .checkout-method__fx i:nth-child(3),
.checkout-method.active .checkout-method__fx i:nth-child(3) { animation-delay: .16s; }
.checkout-method.active .checkout-method__icon { animation: checkout-method-confirm .38s cubic-bezier(.2,.8,.2,1); }
@keyframes checkout-payment-icons-up {
    0% { opacity: 0; transform: translateY(3px) rotate(-4deg) scale(.82); }
    28% { opacity: .38; }
    72% { opacity: .2; }
    100% { opacity: 0; transform: translateY(-38px) rotate(5deg) scale(.98); }
}
@keyframes checkout-method-confirm {
    0% { transform: scale(.88) rotate(-5deg); }
    55% { transform: scale(1.14) rotate(3deg); }
    100% { transform: scale(1) rotate(0); }
}
.checkout-methods__hint { color: var(--page-muted); margin: 16px 0 0; font-size: .6875rem; line-height: 1.7; }
.checkout-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.checkout-field { min-width: 0; }
.checkout-field > label { display: block; color: var(--page-text); font-size: .75rem; font-weight: 700; margin-bottom: 10px; }
.checkout-field input { display: block; width: 100%; min-width: 0; height: 54px; background: #f6f8fa; color: #24314a; border: 1px solid #dce2eb; border-radius: 0; font-size: .75rem; font-weight: 600; padding: 12px 14px; }
.checkout-field input::placeholder, .checkout-discount input::placeholder { color: #8390a1; font-weight: 500; }
.checkout-field > p { color: var(--page-muted); font-size: .625rem; line-height: 1.7; margin: 8px 0 0; }
.checkout-player { display: flex; }
.checkout-player input { border-left: 0; }
.checkout-player__avatar { flex: 0 0 54px; height: 54px; display: grid; place-items: center; background: #eef5e7; border: 1px solid #dce2eb; }
.checkout-player__avatar img { width: 36px; height: 36px; image-rendering: pixelated; }
.checkout-sms { color: #766024; background: #fff5d4; border-left: 3px solid #ffbf08; padding: 18px; font-size: .8125rem; line-height: 1.8; margin-top: 20px; }
.checkout-summary { background: #f3f6fa; padding: 26px 30px; border-top: 4px solid #ffbf08; }
.checkout-summary__heading { display: flex; align-items: center; gap: 10px; margin-bottom: 20px; color: #263e6d; }
.checkout-summary__heading h2 { color: #24314a; font-size: .875rem; text-transform: uppercase; font-weight: 800; margin: 0; }
.checkout-summary__details { font-size: .75rem; line-height: 1.6; margin: 0; }
.checkout-summary__details > div { display: flex; justify-content: space-between; align-items: baseline; gap: 20px; padding: 6px 0; }
.checkout-summary__details dt { color: #67758b; font-weight: 500; }
.checkout-summary__details dd { color: #24314a; font-weight: 700; margin: 0; text-align: right; overflow-wrap: anywhere; }
.checkout-summary__total { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 20px 0; margin-top: 10px; border-top: 1px solid #dae1eb; }
.checkout-summary__total > span { color: #24314a; font-size: .8125rem; font-weight: 700; }
.checkout-summary__total > strong { color: #24314a; font-size: 2rem; font-weight: 900; line-height: 1.2; text-align: right; }
.checkout-summary__total strong > span { font-size: .8125rem; font-weight: 700; }
.checkout-summary__total .checkout-price-before { display: block; margin-bottom: 8px; color: #46546a; font-size: .8125rem; font-weight: 600; line-height: 1.6; }
.checkout-summary__total s { display: inline-block; margin-left: 6px; color: #37465d; font-size: 1.125rem; font-weight: 750; text-decoration-thickness: 2px; text-decoration-color: #a83232; }
.checkout-terms { display: flex; align-items: flex-start; gap: 11px; font-size: .6875rem; line-height: 1.8; color: #5b687b; cursor: pointer; margin-bottom: 20px; }
.checkout-terms input { flex: 0 0 18px; width: 18px; height: 18px; margin-top: 1px; accent-color: #069afa; cursor: pointer; }
.checkout-terms a, .checkout-provider a { color: #2377b6; text-decoration: underline; text-underline-offset: 3px; }
.checkout-terms i { font-size: .5rem; }
.checkout-submit {
    position: relative;
    isolation: isolate;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    min-height: 48px;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background: #43c90c;
    box-shadow: none;
    color: #fff;
    text-shadow: 0 1px 0 rgba(19, 91, 2, .5);
    font-size: .6875rem;
    font-weight: 800;
    letter-spacing: 0;
    padding: 12px 15px;
    cursor: pointer;
    transform: translateY(0);
    transition: background .2s ease;
}
.checkout-submit::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    background: linear-gradient(105deg, transparent 24%, rgba(255, 255, 255, .22) 43%, rgba(255, 255, 255, .08) 54%, transparent 70%);
    transform: translateX(-120%);
    transition: transform .65s cubic-bezier(.22, .7, .2, 1);
}
.checkout-submit::after {
    content: none;
}
.checkout-submit:hover {
    background: #55dc1f;
    filter: none;
    transform: none;
    box-shadow: none;
}
.checkout-submit:hover::before { transform: translateX(120%); }
.checkout-submit:active {
    transform: none;
    box-shadow: none;
}
.checkout-submit > i {
    position: relative;
    right: auto;
    color: #fff;
    filter: drop-shadow(0 2px 0 rgba(11, 30, 58, .55));
    transition: transform .22s ease;
}
.checkout-submit:hover > i { transform: translateX(4px); }
.checkout-submit__coins {
    position: absolute;
    z-index: -1;
    inset: 0 44px 0 0;
    overflow: hidden;
    pointer-events: none;
}
.checkout-submit__coins i {
    position: absolute;
    bottom: -8px;
    display: grid;
    place-items: center;
    width: 24px;
    height: 15px;
    border: 1px solid rgb(72 222 111 / 72%);
    border-radius: 3px;
    background: #baffca;
    color: #0b9e3a;
    opacity: 0;
    font-size: .66rem;
    box-shadow: inset 0 0 0 1px rgb(255 255 255 / 48%);
    filter: drop-shadow(0 3px 3px rgba(8, 91, 29, .2));
}
.checkout-submit__coins i:nth-child(1) { left: 18%; }
.checkout-submit__coins i:nth-child(2) { left: 50%; font-size: .61rem; }
.checkout-submit__coins i:nth-child(3) { left: 76%; }
.checkout-submit:hover .checkout-submit__coins i { animation: checkout-coins-up .86s cubic-bezier(.2,.72,.28,1) both; }
.checkout-submit:hover .checkout-submit__coins i:nth-child(1) { animation-delay: .02s; }
.checkout-submit:hover .checkout-submit__coins i:nth-child(2) { animation-delay: .12s; }
.checkout-submit:hover .checkout-submit__coins i:nth-child(3) { animation-delay: .22s; }
@keyframes checkout-coins-up {
    0% { opacity: 0; transform: translateY(8px) rotate(-6deg) scale(.78); }
    24% { opacity: .88; transform: translateY(-2px) rotate(-2deg) scale(.94); }
    68% { opacity: .68; }
    100% { opacity: 0; transform: translateY(-48px) rotate(8deg) scale(1.06); }
}
.checkout-provider { color: #778397; margin: 16px 0 0; font-size: .625rem; font-weight: 500; line-height: 1.8; overflow-wrap: anywhere; }
.pixel-checkout button:focus-visible, .pixel-checkout input:focus-visible, .pixel-checkout a:focus-visible { outline: 3px solid #243e65; outline-offset: 3px; }
@media (max-width: 1100px) {
    .checkout-layout { grid-template-columns: minmax(260px, .85fr) minmax(0, 1.4fr); gap: 18px; }
    .checkout-step, .checkout-summary { padding: 24px; }
    .checkout-methods { grid-template-columns: 1fr; }
    .checkout-fields { grid-template-columns: 1fr; }
    .checkout-discount, .checkout-product__description { padding: 22px; }
}
@media (max-width: 760px) {
    .checkout-layout { grid-template-columns: 1fr; gap: 20px; }
    .checkout-header { margin-bottom: 20px; }
    .checkout-product__hero { min-height: 270px; padding: 20px 24px 26px; }
    .checkout-product__image { width: 145px; height: 130px; margin: 4px auto 10px; }
    .checkout-product__hero h2 { font-size: 1.625rem; }
    .checkout-product__description { padding: 22px 24px; }
    .checkout-discount { margin-top: 12px; padding: 22px 24px; }
    .checkout-methods { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pixel-checkout .checkout-method { padding: 15px; }
    .checkout-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 480px) {
    .pixel-checkout { padding-top: 8px; }
    .checkout-back { margin-bottom: 20px; }
    .checkout-header__icon { flex-basis: 44px; height: 44px; font-size: 1.125rem; }
    .checkout-header h1 { font-size: 1.375rem; }
    .checkout-header__line { gap: 14px; }
    .checkout-step, .checkout-summary { padding: 22px 20px; }
    .checkout-step__heading { gap: 12px; margin-bottom: 20px; }
    .checkout-step__heading h2 { font-size: .9375rem; }
    .checkout-step__number { width: 39px; height: 39px; font-size: .8125rem; }
    .checkout-methods, .checkout-fields { grid-template-columns: 1fr; }
    .pixel-checkout .checkout-method { min-height: 72px; }
    .checkout-summary__total > strong { font-size: 1.75rem; }
    .checkout-summary__details > div { gap: 14px; }
    .checkout-submit { min-height: 48px; padding: 12px 15px; font-size: .6875rem; }
}
@media (prefers-reduced-motion: reduce) {
    .checkout-back i, .checkout-product__image, .pixel-checkout .checkout-method, .checkout-submit, .checkout-submit::before, .checkout-submit > i { transition: none; }
    .checkout-back:hover i, .checkout-product__hero:hover .checkout-product__image, .checkout-submit:hover > i { transform: none; }
    .checkout-submit:hover, .checkout-submit:active { transform: none; }
    .checkout-submit:hover::before { transform: translateX(-120%); }
    .checkout-submit:hover .checkout-submit__coins i { animation: none; }
    .checkout-method:hover .checkout-method__fx i, .checkout-method.active .checkout-method__fx i, .checkout-method.active .checkout-method__icon { animation: none; }
}
.checkout-upgrade { display: flex; align-items: center; gap: 18px; padding: 22px; margin-bottom: 20px; background: #fff7db; border: 1px solid #f1d783; border-left: 4px solid #ffbf08; color: #24314a; }
.checkout-upgrade img { object-fit: contain; flex-shrink: 0; }
.checkout-upgrade__label { color: #725009; font-size: .625rem; font-weight: 800; letter-spacing: .04em; }
.checkout-upgrade h2 { font-size: 1.125rem; font-weight: 900; margin: 6px 0; }
.checkout-upgrade p { font-size: .75rem; line-height: 1.6; margin: 0 0 12px; }
.checkout-upgrade a { display: inline-flex; gap: 12px; align-items: center; background: #233a61; color: #fff; padding: 11px 14px; font-size: .75rem; font-weight: 700; }
.checkout-upgrade a:hover { background: #355386; }
.checkout-upgrade a:focus-visible { outline: 3px solid #069afa; outline-offset: 3px; }
@media(max-width: 480px) { .checkout-upgrade { gap: 10px; padding: 16px; } .checkout-upgrade img { width: 50px; height: 60px; } }


/* pixel-voucher.css */
.voucher-page { padding-top: 24px; padding-bottom: 34px; }
.voucher-page__back { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 22px; color: var(--page-muted); font-size: .75rem; font-weight: 600; text-decoration: none; }
.voucher-page__back:hover { color: var(--page-text); }
.voucher-page__layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.18fr); gap: 20px; width:100%; margin-inline: auto; }
.voucher-promo { display: flex; flex-direction: column; align-items: flex-start; min-height: min(690px, calc(100vh - 190px)); padding: 44px 54px; }
.voucher-promo__badge { display: inline-flex; align-items: center; gap: 8px; background: #ffcb22; color: #253149; padding: 9px 13px; font-size: .6875rem; font-weight: 800; }
.voucher-promo__copy { position: relative; z-index: 1; margin-top: 37px; }
.voucher-promo__copy > p { color: #fff; font-size: .875rem; line-height: 1.8; margin: 0 0 9px; }
.voucher-promo__copy h2 { color: #fff; font-size: clamp(30px, 3.1vw, 46px); font-weight: 900; line-height: 1.13; margin: 0 0 19px; }
.voucher-promo__chest { display: block; position: relative; z-index: 1; width: 245px; height: 220px; align-self: center; object-fit: contain; margin-top: 5px; filter: drop-shadow(0 14px 0 rgb(0 49 114 / 15%)); transition: transform .3s ease; }
.voucher-promo:hover .voucher-promo__chest { transform: translateY(-7px) rotate(-3deg); }
.voucher-promo__caption { display: flex; align-items: center; gap: 12px; margin-top: auto; padding-top: 18px; font-size: .6875rem; line-height: 1.6; font-weight: 600; color: #fff; }
.voucher-promo__caption > span { display: grid; place-items: center; width: 28px; height: 28px; flex-shrink: 0; border: 1px solid rgb(255 255 255 / 45%); font-size: .625rem; font-weight: 800; }
.voucher-form-panel { border: 1px solid var(--page-line); border-top: 4px solid #ffbf05; background: var(--page-bg); padding: clamp(42px,5vw,76px); min-width: 0; display:flex; flex-direction:column; justify-content:center; }
.voucher-form-panel__eyebrow { display: block; margin-bottom: 10px; color: var(--page-muted); font-size: .625rem; letter-spacing: .1em; font-weight: 700; }
.voucher-form-panel__header h1 { color: var(--page-text); font-size: clamp(26px, 2.4vw, 34px); font-weight: 900; line-height: 1.15; text-transform: uppercase; margin: 0 0 14px; }
.voucher-form-panel__header p { color: var(--page-muted); font-size: .8125rem; line-height: 1.8; max-width: 420px; margin: 0; }
.voucher-form { margin-top: 30px; }
.voucher-field + .voucher-field { margin-top: 24px; }
.voucher-field label { display: flex; align-items: center; gap: 9px; color: var(--page-text); font-size: .75rem; font-weight: 800; margin-bottom: 11px; }
.voucher-field label > span { color: #8993a5; font-size: .625rem; font-weight: 600; }
.voucher-field__input-wrap { position: relative; }
.voucher-field__input-wrap > i { position: absolute; top: 50%; left: 17px; transform: translateY(-50%); color: #818da2; font-size: .875rem; pointer-events: none; }
.pixel-site .voucher-field__input { display: block; border: 1px solid #dce1e8; border-radius: 0; background: #f6f7fa; padding: 17px 16px 17px 46px; width: 100%; min-width: 0; color: var(--page-text); font-size: .875rem; line-height: 1.4; box-shadow: none; transition: border-color .18s ease, background .18s ease; }
.voucher-field__input::placeholder { color: #8590a1; opacity: 1; }
.voucher-field__input:hover { border-color: #aeb8c8; }
.voucher-field__input:focus { outline: 2px solid #069afa; outline-offset: 2px; border-color: #069afa; background: var(--page-bg); }
.voucher-field__input[aria-invalid='true'] { border-color: #d74545; }
.pixel-site .voucher-field__input--code { font-weight: 700; letter-spacing: .025em; }
.voucher-field > p { font-size: .6875rem; color: var(--page-muted); line-height: 1.7; margin: 8px 0 0; }
.pixel-site .voucher-submit { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; margin-top: 27px; border: 0; border-radius: 0; padding: 19px 22px; background: #ffbf05; color: #1b2944; font-size: .8125rem; line-height: 1.4; font-weight: 800; text-align: left; transition: background .2s ease, transform .2s ease; }
.voucher-submit:hover { background: #ffcf38; }
.voucher-submit:active { transform: translateY(2px); }
.voucher-submit > i { transition: transform .2s ease; }
.voucher-submit:hover > i { transform: translateX(4px); }
.voucher-submit:focus-visible, .voucher-page__back:focus-visible { outline: 3px solid #069afa; outline-offset: 4px; }
.voucher-form__note { display: flex; align-items: flex-start; gap: 9px; margin: 15px 0 0; color: var(--page-muted); font-size: .625rem; line-height: 1.7; }
.voucher-form__note > i { padding-top: 3px; color: #8590a1; }
.voucher-feedback { display: flex; align-items: flex-start; gap: 10px; border-left: 3px solid #d74545; background: #fff0f0; color: #9e2c2c; padding: 14px 16px; margin-bottom: 23px; font-size: .75rem; font-weight: 600; line-height: 1.7; overflow-wrap: anywhere; }
.voucher-feedback > i { margin-top: 4px; }
.voucher-feedback--success { border-left-color: #4aa624; background: #edfae6; color: #2d7114; }
@media (max-width: 1000px) {
    .voucher-page__layout { grid-template-columns: minmax(0, .85fr) minmax(0, 1fr); }
    .voucher-promo { padding: 28px; }
    .voucher-promo__copy h2 { font-size: 2rem; }
    .voucher-form-panel { padding: 32px 26px; }
    .voucher-promo__chest { width: 215px; height: 230px; }
}
@media (max-width: 760px) {
    .voucher-page { padding-top: 13px; padding-bottom: 16px; }
    .voucher-page__back { margin-bottom: 18px; }
    .voucher-page__layout { grid-template-columns: minmax(0, 1fr); gap: 16px; }
    .voucher-promo { min-height: 294px; padding: 23px; }
    .voucher-promo__badge { padding: 7px 10px; font-size: .625rem; }
    .voucher-promo__copy { margin-top: 26px; width: 65%; }
    .voucher-promo__copy h2 { font-size: clamp(24px, 6.2vw, 38px); margin-bottom: 12px; }
    .voucher-promo__copy > p { font-size: .6875rem; line-height: 1.65; }
    .voucher-promo__chest { position: absolute; right: -6px; top: 84px; width: 39%; height: 158px; margin: 0; }
    .voucher-promo__break { display: none; }
    .voucher-promo__caption { margin-top: 8px; padding-top: 12px; font-size: .625rem; }
    .voucher-form-panel { padding: 28px 23px; }
    .voucher-form-panel__header h1 { font-size: 1.5rem; }
    .voucher-form-panel__header p { font-size: .75rem; }
    .voucher-form { margin-top: 24px; }
    .pixel-site .voucher-field__input { font-size: 1rem; padding-block: 15px; }
    .pixel-site .voucher-submit { padding: 18px; }
}
@media (prefers-reduced-motion: reduce) {
    .voucher-promo__chest, .voucher-submit, .voucher-submit > i, .pixel-site .voucher-field__input { transition: none; }
    .voucher-promo:hover .voucher-promo__chest { transform: none; }
}


/* pixel-purchases.css */
.purchase-stream { display: grid; grid-template-columns: 210px minmax(0,1fr); align-items: center; gap: 28px; margin-top: 30px; padding: 30px; background: #20385f; color: #fff; position: relative; isolation: isolate; min-width: 0; }
.purchase-stream::before { content: ''; position: absolute; inset: 0; z-index: -1; background:radial-gradient(circle at 1px 1px,rgb(255 255 255/.12) 1px,transparent 1.5px); background-size:23px 23px; }
.purchase-stream__heading h2 { color: #fff; font-size: 1.8rem; line-height: 1.06; font-weight: 900; text-transform: uppercase; margin: 0 0 17px; }
.purchase-stream__heading h2 > span { color: #ffcd28; }
.purchase-stream__heading > span { display: flex; align-items: center; gap: 8px; font-size: .6875rem; color: #bdcce0; }
.purchase-track { display: flex; gap: 12px; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; cursor: grab; user-select: none; -webkit-user-select: none; min-width: 0; }
.purchase-track::-webkit-scrollbar { display: none; }
.purchase-track.is-dragging { cursor: grabbing; }
.purchase-track:focus-visible { outline: 3px solid #ffcc32; outline-offset: 5px; }
/* One receipt style works for single products and mixed carts alike. */
.pixel-site .purchase-card { position:relative; isolation:isolate; overflow:hidden; flex:0 0 198px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; padding:20px 14px 38px; min-width:0; min-height:205px; background:#f4f7fc; color:#233d67; text-align:center; clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%); }
.pixel-site .purchase-card::before { content:''; position:absolute; bottom:0; left:0; right:0; height:26px; z-index:-1; background:linear-gradient(90deg,#e6edf7 0 24%,transparent 24% 49%,#e6edf7 49% 76%,transparent 76%); background-size:48px 100%; opacity:.7; }
.pixel-site .purchase-card::after { content:none; }
.pixel-site .purchase-card__avatar { display:block; width:64px; height:64px; margin:2px 0; padding:0; border:0; border-radius:0; background:transparent; image-rendering:pixelated; object-fit:contain; pointer-events:none; filter:drop-shadow(0 4px 0 rgb(35 61 103/.1)); }
.pixel-site .purchase-card h3 { color:#233d67; font-size:.84rem; font-weight:900; margin:0; line-height:1.25; overflow-wrap:anywhere; text-shadow:none; }
.pixel-site .purchase-card__details { position:absolute; inset:auto 10px 10px; display:grid; padding:10px; background:#233d67; color:#fff; text-align:center; opacity:0; translate:0 8px; pointer-events:none; transition:opacity .24s ease,translate .24s ease; }
.pixel-site .purchase-card__details p { margin:0; color:#fff; font-size:.85rem; font-weight:900; line-height:1.35; overflow-wrap:anywhere; }
.pixel-site .purchase-card.is-revealed .purchase-card__details { opacity:1; translate:0 0; }
.pixel-site .purchase-card:focus-visible { outline:3px solid #ffcf32; outline-offset:-4px; }
@media (max-width: 850px) { .purchase-stream { grid-template-columns: 160px minmax(0,1fr); gap: 20px; padding: 25px; } .purchase-stream__heading h2 { font-size: 1.5rem; } }
@media (max-width: 600px) { .purchase-stream { grid-template-columns: minmax(0,1fr); padding: 24px 18px; gap: 20px; } .purchase-stream__heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; } .purchase-stream__heading h2 { margin: 0; font-size: 1.4rem; } .purchase-stream__heading > span { font-size: .625rem; } }
.product-shop__community { grid-template-columns: minmax(0, 1fr); }
.top-buyers { padding: 28px 0 0; min-width: 0; }
.top-buyers__heading { display: flex; align-items: center; gap: 12px; margin-bottom: 23px; }
.top-buyers__heading > span { display: grid; place-items: center; width: 38px; height: 38px; background: #ffcf32; color: #775400; }
.top-buyers__heading h2 { color: #23334e; font-size: 1.2rem; font-weight: 800; text-transform: uppercase; margin: 0; }
.top-buyers__list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; list-style: none; padding: 0; margin: 0; }
.buyer-card { --buyer-accent: #bbc7d5; display: flex; align-items: center; position: relative; gap: 20px; min-width: 0; padding: 38px 28px 30px; min-height: 170px; border: 1px solid #e1e6ee; border-bottom: 4px solid var(--buyer-accent); background: #f8f9fb; isolation: isolate; overflow: hidden; }
.buyer-card::after { content: ''; position: absolute; inset: auto 0 0; height: 25px; z-index: -1; opacity: .15; background: var(--buyer-accent); mask: var(--pixel-edge) repeat-x bottom / 200px 25px; }
.buyer-card--1 { --buyer-accent: #f8c128; background: #fff9e7; border-color: #f8e6ae; border-bottom-color: #f8c128; }
.buyer-card--3 { --buyer-accent: #c99568; background: #fcf6f1; border-color: #ecdccd; border-bottom-color: #c99568; }
.buyer-card__position { position: absolute; top: 11px; right: 18px; font-size: 2.4rem; line-height: 1; font-weight: 900; color: var(--buyer-accent); opacity: .4; z-index: -1; }
.buyer-card__avatar { position: relative; flex: 0 0 64px; }
.buyer-card__avatar img { display: block; width: 64px; height: 64px; image-rendering: pixelated; object-fit: contain; filter: drop-shadow(0 5px 0 rgb(30 45 70 / 9%)); }
.buyer-card__avatar > i { position: absolute; top: -28px; left: 18px; font-size: 23px; color: #cf9300; transform: rotate(-10deg); }
.buyer-card__info { min-width: 0; }
.buyer-card__info > span { font-size: .625rem; letter-spacing: .04em; color: #738097; font-weight: 700; }
.buyer-card--1 .buyer-card__info > span { color: #9a7100; }
.buyer-card__info h3 { color: #23334e; font-size: 1.125rem; font-weight: 800; margin: 8px 0 0; overflow-wrap: anywhere; }
@media (max-width: 1000px) { .buyer-card { padding-inline: 18px; gap: 15px; } .buyer-card__info h3 { font-size: .9375rem; } .buyer-card__avatar, .buyer-card__avatar img { width: 50px; height: 50px; flex-basis: 50px; } .buyer-card__avatar > i { left: 12px; } }
@media (max-width: 700px) {


    .top-buyers__heading h2 { font-size: 1rem; }


    .top-buyers { padding-top: 4px; }
    .top-buyers__list { grid-template-columns: minmax(0,1fr); gap: 12px; }
    .buyer-card { min-height: 125px; padding: 27px 25px; gap: 22px; }
    .buyer-card__info h3 { font-size: 1.125rem; }
    .buyer-card__position { font-size: 3.5rem; top: 24px; right: 25px; }
}


/* refinements.css */
.home-bestseller { display: inline-flex; align-items: center; gap: 9px; padding: 9px 14px; margin: 12px 0 8px; color: #fff0ac; background: linear-gradient(115deg, #493200, #785000); border: 1px solid #ffe08a; border-radius: 5px; font-size: .75rem; font-weight: 900; letter-spacing: .12em; box-shadow: 0 5px 14px rgb(73 50 0 / 18%); }
.home-bestseller i { color: #ffd45b; }
.topup-bonus { background: #dfffbd; color: #245414; border-bottom-color: #5bc62b; }
.checkout-upgrade { position: relative; align-items: center; max-height: 320px; padding: 18px; overflow: hidden; background: #f7f9fc; border-color: #e1e7ef; border-left-color: #b6c9df; gap: 16px; transform-origin: top center; transition: opacity .28s ease, transform .4s cubic-bezier(.4,0,.2,1), max-height .42s cubic-bezier(.4,0,.2,1), margin .42s ease, padding .42s ease, border-width .38s ease; }
.checkout-upgrade::before { content: ''; position: absolute; z-index: 0; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, transparent, #76d34e, #ffbf08, transparent); background-size: 180% 100%; animation: checkout-upgrade-value 3.2s ease-in-out infinite; }
.checkout-upgrade > * { position: relative; z-index: 1; }
.checkout-upgrade.is-closing { opacity: 0; transform: perspective(700px) rotateX(-12deg) scaleY(.08); max-height: 0; margin-bottom: 0; padding-block: 0; border-top-width: 0; border-bottom-width: 0; pointer-events: none; }
.checkout-upgrade > img { width: 72px; height: 86px; }
.checkout-upgrade h2 { font-size: .9375rem; font-weight: 700; margin: 0 32px 8px 0; }
.checkout-upgrade__content { flex: 1; min-width: 0; }
.checkout-upgrade__close { position: absolute; top: 7px; right: 7px; width: 36px; height: 36px; border: 0; background: #e2ebf6; color: #233a61; font-size: 26px; cursor: pointer; }
.checkout-upgrade__close:hover { background: #cbdcf0; }
.checkout-upgrade__close:focus-visible { outline: 3px solid #069afa; outline-offset: 2px; }
.checkout-upgrade__label { color: #506a8d; }
.checkout-upgrade__progress { display: flex; align-items: center; gap: 12px; margin: 10px 0 8px; }
.checkout-upgrade__progress > div { flex: 1; padding: 8px 10px; background: #fff; border: 1px solid #e1e7ef; }
.checkout-upgrade__progress > div:last-child { background: #edf5ea; color: #31512a; border-color: #9fce8e; transform: scale(1.025); box-shadow: 0 5px 16px rgb(67 131 47 / 13%); }
.checkout-upgrade__progress > i { color: #56a83b; animation: checkout-upgrade-arrow 1.45s ease-in-out infinite; }
.checkout-upgrade__progress small { display: block; font-size: .6875rem; font-weight: 600; }
.checkout-upgrade__progress strong { display: block; margin-top: 3px; font-size: 1.125rem; font-weight: 750; }
.checkout-upgrade__progress strong small { display: inline; font-size: .75rem; }
.checkout-upgrade .checkout-upgrade__gain { font-weight: 600; margin-bottom: 5px; font-size: .6875rem; }
.checkout-upgrade__gift { display: inline-flex; gap: 7px; background: #e5f7df; color: #2f7222; padding: 6px 9px; font-size: .6875rem; font-weight: 800; margin-bottom: 10px; box-shadow: inset 0 0 0 1px #bfe2b4; }
.checkout-upgrade a { display: flex; justify-content: space-between; }
.checkout-upgrade a { position: relative; overflow: hidden; padding: 9px 12px; font-size: .6875rem; background: linear-gradient(90deg, #dfe9f3, #edf6e9); color: #233a61; box-shadow: inset 0 0 0 1px #c6d7c0; }
.checkout-upgrade a::before { content: ''; position: absolute; inset: 0; background: linear-gradient(105deg, transparent 28%, rgb(255 255 255 / 62%) 48%, transparent 68%); transform: translateX(-120%); transition: transform .65s ease; }
.checkout-upgrade a:hover::before { transform: translateX(120%); }
.checkout-upgrade a:hover { background: #d5e0ee; }
.pixel-site .home-grid .motion-shine { background: linear-gradient(110deg, transparent 46%, rgb(255 255 255 / 3%) 49%, rgb(255 255 255 / 6%) 50%, transparent 54%); }
.checkout-upgrade .checkout-upgrade__note { font-size: .625rem; color: #64748b; margin: 8px 0 0; }
@keyframes checkout-upgrade-value { 0%,100% { background-position: 100% 0; opacity: .65; } 50% { background-position: 0 0; opacity: 1; } }
@keyframes checkout-upgrade-arrow { 0%,100% { transform: translateX(-2px); } 50% { transform: translateX(3px); } }

.form-feedback.is-entering { animation: form-feedback-slide-in .36s cubic-bezier(.2,.8,.2,1) both; }
@keyframes form-feedback-slide-in { from { opacity: 0; transform: translateY(-9px); clip-path: inset(0 0 100% 0); } to { opacity: 1; transform: translateY(0); clip-path: inset(0); } }
.voucher-promo__chest { width: min(100%, 360px); height: 310px; margin-top: 0; }
.voucher-promo { min-height: 570px; background-image: radial-gradient(ellipse at 50% 65%, rgb(255 255 255 / 24%), transparent 65%); }
.voucher-promo__copy { margin-top: 24px; }
.voucher-form-panel { display: flex; flex-direction: column; }
.voucher-help { display: flex; align-items: flex-start; gap: 12px; padding: 18px; margin-top: auto; background: #f2f6fc; border-left: 3px solid #069afa; color: #536681; }
.voucher-help p { margin: 0; font-size: .75rem; line-height: 1.7; }
.voucher-help strong { display: block; color: #233a61; }
.voucher-form { margin-bottom: 24px; }
@media(min-width: 981px) { .site-nav__link::before { width: calc(100% + 20px); height: 34px; transition: opacity .25s, transform .45s cubic-bezier(.16,1,.3,1); } .site-nav__link:hover::before { transform: translateX(-50%) skew(-17deg) scaleX(1); opacity: .65; } .site-nav__link:hover > span { transform: translateY(-3px); } }
@media(max-width: 980px) { .site-nav { clip-path: inset(0 0 100% 0); transition: clip-path .4s cubic-bezier(.16,1,.3,1), opacity .25s, transform .4s, visibility .4s; } .site-nav.is-open { clip-path: inset(0); } .site-nav.is-open .site-nav__link { transition-delay: calc(var(--menu-index, 0) * 50ms); } }
@media(max-width: 600px) { .checkout-upgrade { padding: 24px 16px 16px; } .checkout-upgrade > img { display: none; } .checkout-upgrade__progress { gap: 10px; } .voucher-help { margin-top: 0; } }
@media(prefers-reduced-motion: reduce) { .site-nav, .site-nav__link::before, .site-nav__link > span { transition: none !important; } }

.ranks-wrap { max-width: 1280px; margin-top: 28px; margin-bottom: 42px; }
body.pixel-site { display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh; }
.pixel-site > .site-header, .pixel-site > .site-footer { flex-shrink: 0; }
.pixel-site > main { flex: 1 0 auto; min-width: 0; width: 100%; }
.pixel-site > .site-footer { margin-top: auto; }
.offer-tile.tone-gold .offer-copy h1, .offer-tile.tone-gold .offer-copy > p { color: #493200; }
.offer-tile.tone-gold > .tile-cta { background: #493200; color: #fff; }
.rank-card__body { padding: 22px 24px 0; }
.rank-card__header h3 { font-size: 2.25rem; }
.rank-card__price > span, .rank-card__duration { font-size: .75rem; }
.rank-card__kit { font-size: .75rem; }
.rank-card__kit strong { font-size: 1rem; }
.rank-card__stats dt { font-size: .75rem; }
.rank-card__stats dd { font-size: 1.6rem; }
.rank-card__buy-btn { font-size: .8125rem !important; padding: 16px; }
.rank-card__details > summary { font-size: .8125rem; min-height: 58px; }
.rank-card__group { font-size: .75rem; }
.rank-benefit, .rank-benefit-list--commands .rank-benefit dt { font-size: .875rem; line-height: 1.6; }
.rank-card--svip .rank-card__header h3, .rank-card--svip .rank-card__price { color: #512b00; }
.rank-card--sky .rank-card__header h3, .rank-card--sky .rank-card__price { color: #10374b; }
.rank-popup__option-desc, .rank-popup__foot > p { font-size: .8125rem; }
.rank-popup__notice { font-size: .875rem; }
.rank-popup__best { font-size: .625rem; }
.ranks-how p, .ranks-how strong, .ranks-how > a { font-size: .8125rem; }
.footer-company { display: flex; flex-wrap: wrap; gap: 12px 32px; justify-content: space-between; padding-top: 20px; font-size: .75rem; }
.footer-company h2 { margin: 0; font-size: .75rem; font-weight: 700; color: var(--page-text); }
.site-nav__link::before { transform: translateX(-50%) skew(-17deg) scaleX(.35); transform-origin: center; transition: opacity .25s ease, transform .32s cubic-bezier(.22,1,.36,1); }
.site-nav__link:hover::before, .site-nav__link[aria-current='page']::before { transform: translateX(-50%) skew(-17deg) scaleX(1); }
.site-nav__link > span { transition: transform .25s ease; }
.site-nav__link:hover > span { transform: translateY(-2px); }
.menu-toggle { min-width: 40px; min-height: 40px; }
.menu-toggle__lines { position: relative; display: block; width: 24px; height: 20px; }
.menu-toggle__lines > span { display: block; position: absolute; width: 24px; height: 2px; left: 0; background: currentColor; transition: transform .3s ease, opacity .2s ease, top .3s ease; }
.menu-toggle__lines > span:nth-child(1) { top: 2px; }
.menu-toggle__lines > span:nth-child(2) { top: 9px; }
.menu-toggle__lines > span:nth-child(3) { top: 16px; }
.menu-toggle[aria-expanded='true'] .menu-toggle__lines > span:nth-child(1) { top: 9px; transform: rotate(45deg); }
.menu-toggle[aria-expanded='true'] .menu-toggle__lines > span:nth-child(2) { opacity: 0; transform: translateX(5px); }
.menu-toggle[aria-expanded='true'] .menu-toggle__lines > span:nth-child(3) { top: 9px; transform: rotate(-45deg); }
@media (max-width: 980px) {
    .site-nav, .site-nav.is-open { display: flex; flex-direction: column; align-items: stretch; gap: 3px; padding: 16px; visibility: hidden; opacity: 0; transform: translateY(-12px) scale(.98); transform-origin: top right; pointer-events: none; border-top: 3px solid #ffbf05; transition: opacity .22s ease, transform .3s cubic-bezier(.22,1,.36,1), visibility .3s; }
    .site-nav.is-open { visibility: visible; opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
    .site-nav .site-nav__link { justify-content: flex-start; min-height: 48px; padding: 10px 15px; opacity: 0; transform: translateY(-7px); transition: opacity .2s ease, transform .25s ease; }
    .site-nav.is-open .site-nav__link { opacity: 1; transform: translateY(0); transition-delay: calc(var(--menu-index, 0) * 35ms); }
    .site-nav__link::before { left: 0; width: 4px; height: 22px; transform: none; }
    .site-nav__link:hover::before, .site-nav__link[aria-current='page']::before { transform: none; }
    .site-nav__link:hover { background: #f6f7fa; }
}
@media (max-width: 800px) { .ranks-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .ranks-grid { grid-template-columns: minmax(0, 1fr); } .ranks-wrap { margin-top: 15px; } .footer-company { display: block; } .footer-company h2 { margin-bottom: 10px; } }
@media (prefers-reduced-motion: reduce) { .site-nav, .site-nav__link, .site-nav__link::before, .site-nav__link > span, .menu-toggle__lines > span { transition: none !important; } }
.form-feedback { display: flex; align-items: flex-start; gap: 10px; border-left: 3px solid #d74545; background: #fff0f0; color: #9e2c2c; padding: 14px 16px; margin-bottom: 20px; font-size: .8125rem; font-weight: 600; line-height: 1.7; overflow-wrap: anywhere; }
.form-feedback > i { margin-top: 4px; }
.form-feedback--success { border-left-color: #4aa624; background: #edfae6; color: #2d7114; }
.checkout-field input[aria-invalid='true'], .voucher-field__input[aria-invalid='true'] { border-color: #d74545; background: #fff8f8; }
.checkout-discount .form-feedback { margin-top: 14px; margin-bottom: 0; }
.voucher-page__layout { max-width: 1080px; }
.voucher-promo { min-height: 440px; justify-content: center; }
.voucher-promo__copy { margin-top: 24px; }
.voucher-promo__chest { width: 200px; height: 190px; }
.voucher-form-panel { padding: 32px; }
.voucher-form { margin-top: 24px; }
@media (max-width: 760px) {
    .voucher-promo { min-height: 160px; padding: 24px; }
    .voucher-promo__badge { display: none; }
    .voucher-promo__copy { margin: 0; width: 65%; }
    .voucher-promo__copy h2 { margin: 0; font-size: 1.625rem; }
    .voucher-promo__chest { width: 120px; height: 130px; top: 15px; right: 10px; }
    .voucher-form-panel { padding: 26px 22px; }
}
.checkout-credit { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px; padding: 9px 12px; margin-top: 10px; background: #eaf4e4; color: #31512a; border-left: 2px solid #71b74a; font-size: .75rem; }
.checkout-credit > span strong { font-size: .875rem; }
.checkout-credit small { font-size: .6875rem; }
.checkout-product__description summary { cursor: pointer; font-size: .8125rem; font-weight: 700; color: #24314a; }
.checkout-product__description[open] summary { margin-bottom: 14px; }
.checkout-product__description { overflow: hidden; box-sizing: border-box; }
.checkout-product__description summary { display: flex; align-items: center; justify-content: space-between; list-style: none; gap: 12px; }
.checkout-product__description summary::-webkit-details-marker { display: none; }
.checkout-product__description summary::after { content: '+'; display: grid; place-items: center; width: 26px; height: 26px; flex-shrink: 0; background: #e4edf8; color: #233a61; font-size: 20px; transition: transform .3s, background .3s; }
.checkout-product__description[open] summary::after { transform: rotate(45deg); background: #ffdf78; }
.checkout-product__description summary:focus-visible { outline: 2px solid #069afa; outline-offset: 4px; }
@media(prefers-reduced-motion: reduce) { .checkout-product__description summary::after { transition: none; } }
/* Small interaction cues, without continuous motion or stronger shine. */
@media (prefers-reduced-motion: no-preference) {
    .pixel-site .checkout-method { transition: border-color .22s, background .22s, box-shadow .22s; }
    .pixel-site .checkout-method__check { transition: background .2s, border-color .2s, color .2s; }
    .pixel-site .checkout-method.active .checkout-method__check i { animation: subtle-check .23s ease-out; }
    .pixel-site :is(.checkout-submit, .voucher-submit, .rank-buy-btn, .checkout-upgrade a, .checkout-discount button) { transition: background .2s, box-shadow .2s, scale .16s; }
    .pixel-site :is(.checkout-submit, .voucher-submit, .rank-buy-btn, .checkout-upgrade a):active { scale: .99; }
    .pixel-site :is(.checkout-submit, .voucher-submit, .rank-buy-btn, .checkout-upgrade a) > i { transition: translate .22s ease; }
    .pixel-site :is(.checkout-submit, .voucher-submit, .rank-buy-btn, .checkout-upgrade a):hover > i { translate: 3px 0; }
    .pixel-site :is(.checkout-field input, .voucher-field__input, .checkout-discount input) { transition: border-color .2s, background .2s, box-shadow .2s; }
    .pixel-site :is(.checkout-field input, .voucher-field__input, .checkout-discount input):focus { box-shadow: 0 0 0 3px rgb(6 154 250 / 8%); }
    .pixel-site .form-feedback:not([hidden]) { animation: subtle-feedback .25s ease-out; }
    .pixel-site .buyer-card { transition: box-shadow .25s, translate .25s; }
    .pixel-site .buyer-card__avatar img { transition: scale .3s; }
    .pixel-site .rank-matrix__row > :is(th, td) { transition: background .18s; }
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .pixel-site .buyer-card:hover { translate: 0 -2px; box-shadow: 0 5px 15px rgb(35 58 97 / 7%); }
    .pixel-site .buyer-card:hover .buyer-card__avatar img { scale: 1.035; }
    .pixel-site .checkout-method:hover { box-shadow: 0 3px 10px rgb(35 58 97 / 6%); }
}
@keyframes subtle-check { from { scale: .8; opacity: .5; } to { scale: 1; opacity: 1; } }
@keyframes subtle-feedback { from { opacity: .5; translate: 0 3px; } to { opacity: 1; translate: 0 0; } }
.pixel-site .form-feedback.is-entering { animation: form-feedback-slide-in .36s cubic-bezier(.2,.8,.2,1) both; }
@media (prefers-reduced-motion: reduce) {
    .checkout-upgrade, .checkout-upgrade::before, .checkout-upgrade__progress > i, .checkout-upgrade a::before,
    .pixel-site .form-feedback.is-entering { animation: none; transition: none; }
    .checkout-upgrade.is-closing { display: none; }
}


/* rank-comparison.css */
.rank-compare-hint { display: none; color: #6a778b; font-size: .75rem; gap: 8px; align-items: center; }
.rank-matrix-scroll { position: relative; overflow-x: auto; scrollbar-width: thin; scrollbar-color: #abbcd1 #eef2f7; padding-bottom: 10px; border: 1px solid #e2e7ef; background: #fff; }
.rank-matrix-scroll:focus-visible { outline: 3px solid #278dcc; outline-offset: 4px; }
.rank-matrix { width: 100%; min-width: 1080px; border-collapse: separate; border-spacing: 0; table-layout: fixed; color: #24324a; font-size: .875rem; }
.rank-matrix__label-col { width: 235px; }
.rank-matrix th, .rank-matrix td { padding: 16px; border-bottom: 1px solid #e7ebf2; line-height: 1.5; vertical-align: middle; }
.rank-matrix__label { position: sticky; left: 0; z-index: 2; text-align: left; background: #fff; font-weight: 600; box-shadow: 1px 0 0 #e2e7ef; }
.rank-matrix th.rank-matrix__intro { background: #f3f6fa; padding: 26px; vertical-align: bottom; }
.rank-matrix__intro > i { display: block; color: #7990ad; font-size: 1.5rem; margin-bottom: 16px; }
.rank-matrix__intro > span { display: block; font-size: 1.0625rem; font-weight: 800; }
.rank-matrix__intro > small { display: block; font-size: .75rem; color: #6d7b8f; margin-top: 5px; font-weight: 500; }
.rank-matrix th.rank-matrix__header { padding: 0; vertical-align: top; border-left: 3px solid #fff; }
.rank-matrix__rank { --tile-color: #a6ed65; --rank-ink: #fff; padding: 21px 14px 16px; color: var(--rank-ink); min-height: 242px; text-align: left; }
.rank-matrix__header--svip .rank-matrix__rank { --tile-color: #ff9933; --rank-ink: #fff; }
.rank-matrix__header--mvip .rank-matrix__rank { --tile-color: #069afa; --rank-ink: #fff; }
.rank-matrix__header--sky .rank-matrix__rank { --tile-color: #6cd3fb; --rank-ink: #fff; }
.rank-matrix__header--bogacz .rank-matrix__rank { --tile-color: #ffc634; --rank-ink: #fff; }
.rank-matrix__period, .rank-matrix__badge { display: inline-block; position: relative; font-size: .625rem; padding: 5px 7px; font-weight: 800; }
.rank-matrix__period { background: rgb(20 36 58 / 17%); color: #fff; text-shadow: 0 1px 2px rgb(18 35 57 / 30%); }
.rank-matrix__badge { background: #7b5800; color: #fff; }
.rank-matrix__badge { display: inline-flex; align-items: center; gap: 6px; background: linear-gradient(115deg, #493200, #785000); color: #fff2ba; border: 1px solid #e6b63d; border-radius: 4px; letter-spacing: .08em; box-shadow: 0 3px 8px rgb(73 50 0 / 16%); }
.rank-matrix thead { position: relative; z-index: 5; background: #fff; }
.rank-matrix thead.is-pinned { box-shadow: 0 8px 16px rgb(25 43 70 / 15%); }
.rank-matrix__badge + .rank-matrix__period { margin-top: 6px; margin-left: 4px; }
.rank-matrix__emblem { position: absolute; right: 10px; top: 66px; font-size: 2.25rem; opacity: .18; transform: rotate(-12deg); }
.rank-matrix__rank h2 { position: relative; color: var(--rank-ink); font-size: 1.5rem; font-weight: 900; margin: 17px 0 13px; line-height: 1.2; text-shadow: 0 2px 3px rgb(18 35 57 / 28%); }
.rank-matrix__rank p { position: relative; color: var(--rank-ink); margin: 0 0 17px; text-shadow: 0 2px 3px rgb(18 35 57 / 28%); }
.rank-matrix__rank p > strong { display: block; font-size: 1.625rem; font-weight: 900; line-height: 1.2; }
.rank-matrix__rank strong > small { font-size: .875rem; }
.rank-matrix__rank p > span { display: block; font-size: .625rem; font-weight: 600; margin-top: 4px; }
.rank-matrix .rank-buy-btn { display: flex; align-items: center; justify-content: space-between; gap: 5px; position: relative; width: 100%; padding: 12px 10px; border: 0; background: #233a61; color: #fff; font-size: .625rem; font-weight: 800; white-space: nowrap; transition: background .2s; }
.rank-matrix .rank-buy-btn:hover { background: #142744; }
.rank-matrix .rank-buy-btn:focus-visible { outline: 3px solid #173d68; outline-offset: 3px; }
.rank-matrix__row td { text-align: center; font-weight: 650; }
.rank-matrix__row:nth-child(even) > th, .rank-matrix__row:nth-child(even) > td { background: #f6f8fb; }
.rank-matrix__row:hover > th, .rank-matrix__row:hover > td { background: #edf4fb; }
.rank-matrix__value .fa-check { color: #318322; font-size: 1rem; }
.rank-matrix__value .fa-minus { color: #98a3b2; font-size: .75rem; }
.rank-matrix td.rank-matrix__featured { background: #fff7d9; border-inline: 2px solid #efc33f; font-weight: 800; }
.rank-matrix__row:nth-child(even) > .rank-matrix__featured { background: #fff0b8; }
.rank-matrix__row:hover > .rank-matrix__featured { background: #ffe58d; }
.rank-matrix .rank-matrix__header--bogacz { border: 2px solid #e8b426; border-bottom: 0; }
.rank-matrix__header--bogacz .rank-matrix__rank { padding-top: 19px; }
.rank-matrix__header--bogacz .rank-buy-btn, .rank-matrix tfoot .rank-matrix__featured .rank-buy-btn { background: #513900; color: #fff4ce; }
.rank-matrix__group > th, .rank-matrix__group > td { background: #eaf0f7; color: #586d89; font-size: .75rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; padding-block: 13px; }
.rank-matrix__group > th:not(:first-child) { text-align: center; }
.rank-matrix__group > th.rank-matrix__featured { background: #ffdc70; color: #513900; border-inline: 2px solid #efc33f; }
.rank-matrix tfoot td { background: #f3f6fa; padding-block: 20px; }
.rank-matrix tfoot .rank-matrix__featured { border-bottom: 3px solid #efc33f; }
@media (max-width: 1150px) { .rank-compare-hint { display: inline-flex; } }
@media (max-width: 700px) {
    .rank-matrix { min-width: 930px; font-size: .8125rem; }
    .rank-matrix__label-col { width: 150px; }
    .rank-matrix th, .rank-matrix td { padding: 13px 11px; }
    .rank-matrix th.rank-matrix__intro { padding: 18px 13px; }
    .rank-matrix__intro > span { font-size: .875rem; }
    .rank-matrix__intro > small { font-size: .6875rem; }
    .rank-matrix__rank { padding-inline: 11px; }
    .rank-matrix__rank h2 { font-size: 1.3rem; }
    .ranks-heading h1 { font-size: 1.5rem; }
}


/* subtle-motion.css */
/* Soft entrance fade and restrained interaction feedback. */
.product-tile { cursor: pointer; }
.product-tile__buy { text-decoration: none; }
.product-tile:focus-within { outline: 2px solid #233a61; outline-offset: 3px; }
.pixel-site .motion-enter { animation: none; }
.pixel-site .motion-tilt { transform: none; }
.motion-enabled .motion-in-view .offer-character,
.motion-enabled .motion-in-view .banner-icon,
.motion-enabled .server-status.is-online .status-dot { animation: none; }
.pixel-site .motion-shine { display: block; background: linear-gradient(110deg, transparent 46%, rgb(255 255 255 / 5%) 49%, rgb(255 255 255 / 10%) 50%, transparent 54%); }
.pixel-site .checkout-upgrade__cost { display: block; color: #536681; font-size: .6875rem; margin-bottom: 5px; }
.pixel-site .buyer-card:hover { translate: none; }
.pixel-site .buyer-card:hover .buyer-card__avatar img { scale: 1; }
.pixel-site .product-tile:hover .product-tile__image,
.pixel-site .checkout-product__hero:hover .checkout-product__image,
.pixel-site .server-tile:hover > img { transform: none; scale: 1.04; }
.pixel-site .world-tile:hover > img { scale: 1.025; }
.pixel-site .site-brand:hover img,
.pixel-site .social-tile:hover > i,
.pixel-site .shop-banner:hover .banner-decoration { translate: none; rotate: none; scale: 1.02; }
.pixel-site .site-nav__link:hover > span { transform: none; }
.pixel-site .checkout-method.active .checkout-method__check i,
.pixel-site .form-feedback:not([hidden]) { animation: none; }
.pixel-site :is(.checkout-submit, .voucher-submit, .rank-buy-btn, .checkout-upgrade a):active { scale: 1; }
.pixel-site :is(.checkout-submit, .voucher-submit, .rank-buy-btn, .checkout-upgrade a):hover > i { translate: 1px 0; }
.pixel-site .checkout-upgrade { padding: 14px 42px 14px 16px; gap: 14px; }
.pixel-site .checkout-upgrade > img { display: block; width: 68px; height: 80px; }
.pixel-site .checkout-upgrade h2 { font-size: .8125rem; margin: 0 0 6px; }
.pixel-site .checkout-upgrade__progress { margin: 0 0 7px; }
.pixel-site .checkout-upgrade__progress > div { padding: 6px 9px; }
.pixel-site .checkout-upgrade__gift { margin-bottom: 7px; }
.pixel-site .checkout-upgrade__close { width: 28px; height: 28px; font-size: 22px; }
@media (max-width: 480px) {
    .pixel-site .checkout-upgrade { padding-left: 12px; gap: 10px; }
    .pixel-site .checkout-upgrade > img { width: 44px; height: 60px; }
    .pixel-site .checkout-upgrade__progress { gap: 7px; }
    .pixel-site .checkout-upgrade__progress strong { font-size: 1rem; }
}
@media (prefers-reduced-motion: no-preference) {
    .pixel-site .motion-enter { animation: quiet-appear .6s ease-out both; animation-delay: var(--motion-delay, 0ms); }
    .motion-enabled .motion-in-view .offer-character { animation: quiet-float 6.5s ease-in-out infinite; }
    .motion-enabled .motion-in-view .banner-icon { animation: quiet-float 7s ease-in-out infinite; }
    .pixel-site :is(.checkout-upgrade__close, .voucher-page__back, .product-shop__back, .checkout-back, .footer-company a) { transition: color .15s, background-color .15s; }
    .pixel-site input[type='checkbox'] { transition: box-shadow .15s; }
    .pixel-site input[type='checkbox']:focus-visible { box-shadow: 0 0 0 3px rgb(6 154 250 / 10%); }
}
@keyframes quiet-appear { from { opacity: .68; } to { opacity: 1; } }
@keyframes quiet-float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -7px; } }
.pixel-site .checkout-upgrade a { position: relative; overflow: hidden; isolation: isolate; gap: 12px; padding: 12px 15px; background: #edf1f6; color: #324763; border: 1px solid #d3dce8; border-bottom: 1px solid #d3dce8; border-radius: 4px; font-weight: 800; box-shadow: none; }
.pixel-site .checkout-upgrade a:hover { background: #e3eaf3; }
.pixel-site .checkout-upgrade a::before { content: ''; position: absolute; inset: -40% -60%; pointer-events: none; background: linear-gradient(110deg, transparent 43%, rgb(255 255 255 / 12%) 50%, transparent 57%); transform: translateX(-70%); opacity: 0; }
.pixel-site .checkout-upgrade a > i { display: grid; place-items: center; flex-shrink: 0; width: 25px; height: 25px; background: rgb(255 255 255 / 35%); border-radius: 3px; }
@media (prefers-reduced-motion: no-preference) {
    .pixel-site .checkout-upgrade a { transition: translate .2s, box-shadow .2s, background .2s; }
    .pixel-site .checkout-upgrade a:is(:hover, :focus-visible) { translate: 0 0; box-shadow: 0 2px 5px rgb(35 58 97 / 5%); }
    .pixel-site .checkout-upgrade a:is(:hover, :focus-visible)::before { animation: livesky-shine .85s ease both; }
    .pixel-site .checkout-upgrade a:hover > i { translate: 2px 0; }
    .pixel-site .checkout-upgrade a:active { translate: 0 0; }
}
@media (prefers-reduced-motion: reduce) {
    .pixel-site .product-tile:hover .product-tile__image,
    .pixel-site .checkout-product__hero:hover .checkout-product__image,
    .pixel-site .server-tile:hover > img,
    .pixel-site .world-tile:hover > img { scale: 1; }
}


/* interaction-polish.css */
/* Search panel opens and closes from the header control. */
.pixel-site .server-loader { position: fixed; z-index: 100000; top: 0; left: 0; width: 100%; height: 4px; overflow: hidden; background: rgb(25 47 78 / 14%); opacity: 0; pointer-events: none; transition: opacity .16s ease; }
.pixel-site .server-loader > span { position: absolute; inset: 0 auto 0 0; width: 5%; background: linear-gradient(90deg, #087fd0 0%, #08a8ff 72%, #ffbf05 100%); box-shadow: 2px 0 10px rgb(6 154 250 / 48%); transition: width 3.8s cubic-bezier(.12,.72,.18,1); }
.pixel-site .server-loader.is-visible { opacity: 1; }
.pixel-site .server-loader.is-visible > span { width: 82%; }
.pixel-site .server-loader.is-complete > span { width: 100%; transition-duration: .18s; }

.pixel-site .site-search:not([hidden]) {
    animation: none;
    opacity: 0;
    pointer-events: none;
    clip-path: inset(0 0 100% 0);
    transform: translateY(-10px) scale(.98);
    transform-origin: top right;
    transition: opacity .24s ease, clip-path .32s cubic-bezier(.22, 1, .36, 1), transform .32s cubic-bezier(.22, 1, .36, 1);
}
.pixel-site .site-search.is-open {
    opacity: 1;
    pointer-events: auto;
    clip-path: inset(0);
    transform: translateY(0) scale(1);
}
.pixel-site .search-toggle[aria-expanded='true'] { background: #ffcf3f; color: #23304a; }
.pixel-site .search-toggle > i { transition: transform .3s cubic-bezier(.22, 1, .36, 1); }
.pixel-site .search-toggle[aria-expanded='true'] > i { transform: skew(17deg) rotate(-12deg) scale(1.08); }

/* A clear but calm marker follows the focused navigation item. */
@media (min-width: 981px) {
    .pixel-site .site-nav { position: relative; }
    .pixel-site .site-nav__indicator { position: absolute; z-index: 0; top: 50%; left: 0; width: 0; height: 32px; background: #ffbf05; opacity: 0; transform: translateY(-50%) skew(-17deg); pointer-events: none; }
    .pixel-site .site-nav__indicator.is-ready { transition: left .42s cubic-bezier(.22,1,.36,1), width .42s cubic-bezier(.22,1,.36,1), opacity .22s ease; }
    .pixel-site .site-nav__indicator.is-visible { opacity: 1; }
    .pixel-site .site-nav__link { z-index: 1; transition: color .22s ease; }
    .pixel-site .site-nav__link::before, .pixel-site .site-nav__link::after { content: none; }
    .pixel-site .site-nav__link > span { transform: none; transition: none; }
}
.pixel-site .site-nav__indicator { display: none; }
@media (min-width: 981px) { .pixel-site .site-nav__indicator { display: block; } }
@media (max-width: 980px) {
    .pixel-site .site-nav .site-nav__link { transform: translateX(-10px); transition: opacity .28s ease, transform .36s cubic-bezier(.22, 1, .36, 1), background .2s ease; }
    .pixel-site .site-nav.is-open .site-nav__link { transform: translateX(0); transition-delay: calc(var(--menu-index, 0) * 45ms); }
}

/* Home graphics respond a little more clearly to pointer movement. */
@media (hover: hover) and (pointer: fine) {
    .pixel-site .home-grid .social-tile:hover > i { scale: 1.1; rotate: -5deg; }
    .pixel-site .home-grid .shop-banner:hover .banner-icon { scale: 1.12; translate: 0 -3px; }
    .pixel-site .home-grid .shop-banner:hover .banner-decoration { scale: 1.09; }
    .pixel-site .home-grid .site-brand:hover img { scale: 1.08; }
}

/* Rank actions share the site's dark square button style. */
.pixel-site .rank-matrix__rank { display: flex; flex-direction: column; min-height: 248px; }
.pixel-site .rank-matrix__meta { display: flex; align-items: flex-start; gap: 5px; min-height: 26px; }
.pixel-site .rank-matrix__meta .rank-matrix__period { margin: 0; white-space: nowrap; }
.pixel-site .rank-matrix__rank p { margin-bottom: 12px; }
.pixel-site .rank-matrix__header--bogacz .rank-matrix__rank { padding-top: 21px; }
.pixel-site .rank-matrix .rank-matrix__header--bogacz { border-top: 0; }
.pixel-site .rank-matrix .rank-buy-btn {
    min-height: 43px;
    margin-top: auto;
    padding: 11px 12px;
    background: #243a60;
    border: 0;
    color: #fff;
    font-size: .6875rem;
    box-shadow: none;
    transition: background .2s ease, transform .2s ease;
}
.pixel-site .rank-matrix .rank-buy-btn:hover, .pixel-site .rank-matrix .rank-buy-btn:focus-visible { background: #152844; color: #fff; transform: translateY(-1px); }
.pixel-site .rank-matrix__header--bogacz .rank-buy-btn { background: #513900; color: #fff4ce; }
.pixel-site .rank-matrix__header--bogacz .rank-buy-btn:hover, .pixel-site .rank-matrix__header--bogacz .rank-buy-btn:focus-visible { background: #3c2900; color: #fff4ce; }
.pixel-site .rank-matrix .rank-buy-btn > i { transition: transform .2s ease; }
.pixel-site .rank-matrix .rank-buy-btn:hover > i { transform: translateX(3px); }

/* The rank popup makes the wallet amount and next action easy to scan. */
.pixel-site .rank-popup__box { border: 1px solid #e2e8ef; border-bottom: 5px solid var(--popup-color); box-shadow: 0 18px 50px rgb(8 22 43 / 22%); }
.pixel-site .rank-popup__subtitle { display: inline-block; padding: 7px 10px; background: rgb(20 34 52 / 28%); color: #fff; font-size: .8125rem; text-shadow: 0 2px 3px rgb(18 35 57 / 24%); }
.pixel-site .rank-popup__subtitle strong { font-weight: 900; }
.pixel-site .rank-popup__steps { gap: 12px; margin-bottom: 14px; padding-bottom: 15px; }
.pixel-site .rank-popup__steps > span { flex: 1; padding: 10px 12px; background: #f4f7fb; font-size: .75rem; line-height: 1.3; }
.pixel-site .rank-popup__steps > span:first-child { background: #eaf6e5; }
.pixel-site .rank-popup__steps b { flex: 0 0 27px; background: #314b70; }
.pixel-site .rank-popup__notice { margin-bottom: 15px; color: #354762; font-size: .8125rem; line-height: 1.55; }
.pixel-site .rank-popup__option { padding: 15px 17px; border: 1px solid #dce4ec; border-left: 5px solid var(--popup-color); background: #fff; }
.pixel-site .rank-popup__option:hover, .pixel-site .rank-popup__option:focus-visible { background: #f6f9fc; border-color: var(--popup-color); box-shadow: 0 5px 16px rgb(35 58 97 / 9%); }
.pixel-site .rank-popup__option-title { font-size: .9375rem; }
.pixel-site .rank-popup__option-desc { font-size: .75rem; line-height: 1.45; }
.pixel-site .rank-popup__option-action { font-size: .6875rem; font-weight: 800; text-transform: uppercase; color: #253b5e; }
.pixel-site .rank-popup__best { margin-top: 5px; }
.pixel-site .rank-popup__price { align-items: flex-end; color: #1d3150; font-size: 1.125rem; }
.pixel-site .rank-popup__price > small { font-size: .625rem; }
.pixel-site .rank-popup__arrow { display: grid; place-items: center; width: 30px; height: 30px; background: #edf1f7; color: #213650; }
.pixel-site .rank-popup__foot { background: #f6f8fb; border-top: 0; padding: 13px 15px; margin-top: 0; }
.pixel-site .rank-popup__foot > p { line-height: 1.45; }

/* Receipt cards and the buyer list respond gently to pointer focus. */
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .pixel-site .purchase-card,
    .pixel-site .purchase-card__avatar,
    .pixel-site .purchase-card h3,
    .pixel-site .purchase-card__details,
    .pixel-site .buyer-card,
    .pixel-site .buyer-card__avatar img { transition: transform .24s ease, translate .24s ease, scale .24s ease, opacity .24s ease, box-shadow .24s ease, filter .24s ease; }
    .pixel-site .purchase-card:hover { transform: translateY(-4px); box-shadow: 0 9px 18px rgb(26 43 65 / 18%); }
    .pixel-site .purchase-card:hover .purchase-card__avatar,
    .pixel-site .purchase-card:focus .purchase-card__avatar { scale: 1.04; translate: 0 -2px; filter: drop-shadow(0 7px 0 rgb(22 35 50 / 19%)); }
    .pixel-site .purchase-card:hover h3,
    .pixel-site .purchase-card:focus h3 { translate: none; }
    .pixel-site .buyer-card:hover { translate: 0 -3px; box-shadow: 0 8px 20px rgb(35 58 97 / 12%); }
    .pixel-site .buyer-card:hover .buyer-card__avatar img { scale: 1.08; }
}
@media (hover: hover) and (pointer: fine) {
    .pixel-site .purchase-card:hover .purchase-card__details { opacity: 1; translate: 0 0; }
}
.pixel-site .purchase-card:focus .purchase-card__details { opacity: 1; translate: 0 0; }
@media (prefers-reduced-motion: reduce) {
    .pixel-site .server-loader, .pixel-site .server-loader > span { animation: none; transition: none; }
    .pixel-site .promotions-panel:not([hidden]) { transition: none; }
    .pixel-site .purchase-card,
    .pixel-site .purchase-card__avatar,
    .pixel-site .purchase-card h3,
    .pixel-site .purchase-card__details,
    .pixel-site .buyer-card,
    .pixel-site .buyer-card__avatar img { transition: none !important; }
    .pixel-site .purchase-card:hover .purchase-card__avatar,
    .pixel-site .purchase-card:focus .purchase-card__avatar,
    .pixel-site .purchase-card:hover h3,
    .pixel-site .purchase-card:focus h3 { translate: none; scale: 1; }
}

/* Legal documents keep their API content and gain direct section links. */
.pixel-site .legal-page { max-width: 1280px; padding-block: 34px 44px; }
.pixel-site .legal-page__header { margin-bottom: 24px; }
.pixel-site .legal-page__header > p { margin: 0 0 5px; color: #63738a; font-size: .6875rem; font-weight: 800; text-transform: uppercase; letter-spacing: .12em; }
.pixel-site .legal-page__header h1 { margin: 0; color: #202e46; font-size: clamp(1.75rem, 3vw, 2.5rem); font-weight: 900; line-height: 1.2; }
.pixel-site .legal-page__layout { display: grid; grid-template-columns: minmax(220px, 280px) minmax(0, 1fr); gap: 20px; align-items: start; }
.pixel-site .legal-page__toc { position: sticky; top: 20px; padding: 22px 18px; background: #f5f7fa; border-top: 4px solid #ffbf05; }
.pixel-site .legal-page__toc h2 { margin: 0 0 14px; color: #263653; font-size: .875rem; font-weight: 900; text-transform: uppercase; }
.pixel-site .legal-page__toc ol { display: grid; gap: 3px; margin: 0; padding: 0; list-style: none; }
.pixel-site .legal-page__toc a { display: block; padding: 8px 9px; color: #42546f; text-decoration: none; font-size: .75rem; font-weight: 650; line-height: 1.4; border-left: 3px solid transparent; transition: background .2s ease, color .2s ease, border-color .2s ease; }
.pixel-site .legal-page__toc a:hover, .pixel-site .legal-page__toc a:focus-visible { background: #eaf0f7; color: #1c3151; border-left-color: #ffbf05; }
.pixel-site .legal-page__toc a:focus-visible { outline: 2px solid #233a61; outline-offset: 2px; }
.pixel-site .legal-page__content.tos { width: 100%; max-width: none; min-width: 0; margin: 0; padding: 32px 36px; overflow-wrap: anywhere; }
.pixel-site .legal-page__content h2 { display: block; scroll-margin-top: 22px; font-size: 1.35rem; margin-top: 33px; }
.pixel-site .legal-page__content h2:first-of-type { margin-top: 20px; }
.pixel-site .legal-page__content p, .pixel-site .legal-page__content li { font-size: .875rem; line-height: 1.75; }
.pixel-site .policy-scope { display: flex; align-items: center; justify-content: space-between; gap: 28px; margin-bottom: 20px; padding: 22px 24px; background: #f5f7fa; border-left: 4px solid #069afa; }
.pixel-site .policy-scope > div:first-child { min-width: 0; }
.pixel-site .policy-scope > div:first-child > span { display: block; margin-bottom: 4px; color: #718096; font-size: .5625rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.pixel-site .policy-scope h2 { margin: 0; color: #24314a; font-size: 1rem; font-weight: 850; }
.pixel-site .policy-scope p { margin: 5px 0 0; color: #66758a; font-size: .6875rem; }
.pixel-site .policy-scope__options { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; flex: 0 1 440px; }
.pixel-site .policy-scope__options a { display: flex; align-items: center; gap: 11px; min-width: 0; min-height: 58px; padding: 10px 13px; border: 1px solid #dce3ec; background: #fff; color: #34445d; text-align: left; text-decoration: none; transition: border-color .2s ease, background .2s ease, color .2s ease; }
.pixel-site .policy-scope__options a > i { width: 20px; color: #6f7f94; text-align: center; font-size: 1rem; }
.pixel-site .policy-scope__options a span, .pixel-site .policy-scope__options a small { display: block; }
.pixel-site .policy-scope__options a span { min-width: 0; font-size: .6875rem; font-weight: 800; }
.pixel-site .policy-scope__options a small { margin-top: 2px; color: #8290a2; font-size: .5rem; font-weight: 600; line-height: 1.35; }
.pixel-site .policy-scope__options a:hover { border-color: #8bcdf7; background: #f5fbff; color: #173a5c; }
.pixel-site .policy-scope__options a.is-active { border-color: #069afa; background: #eaf7ff; color: #173a5c; }
.pixel-site .policy-scope__options a.is-active > i { color: #069afa; }
.pixel-site .policy-scope__options a.is-policy-switching { border-color: #069afa; background: #eaf7ff; color: #173a5c; transform: translateY(-2px); }
.pixel-site .policy-scope__options a.is-policy-switching > i { color: #069afa; animation: policy-switch-icon .46s cubic-bezier(.22,1,.36,1) both; }
.pixel-site .legal-page.is-policy-leaving { animation: policy-page-leave .24s ease both; pointer-events: none; }
.pixel-site .legal-page.is-policy-entering .policy-scope { animation: policy-scope-enter .46s cubic-bezier(.22,1,.36,1) both; }
.pixel-site .legal-page.is-policy-entering .legal-page__layout { animation: policy-content-enter .5s .06s cubic-bezier(.22,1,.36,1) both; }
@keyframes policy-switch-icon { 50% { transform: translateY(-4px) scale(1.12); } }
@keyframes policy-page-leave { to { opacity: 0; transform: translateX(-12px); } }
@keyframes policy-scope-enter { from { opacity: 0; transform: translateY(-10px); } }
@keyframes policy-content-enter { from { opacity: 0; transform: translateY(12px); } }

.pixel-site .rank-popup.is-open .rank-popup__head > :not(.pixel-bottom) { animation: rank-popup-head-enter .4s cubic-bezier(.22,1,.36,1) both; }
.pixel-site .rank-popup.is-open .rank-popup__options .rank-popup__option { animation: rank-popup-option-enter .42s .08s cubic-bezier(.22,1,.36,1) both; }
.pixel-site .rank-popup.is-open .rank-popup__option--bonus .rank-popup__option-desc { animation: rank-bonus-enter .52s .22s cubic-bezier(.22,1,.36,1) both; }
@keyframes rank-popup-head-enter { from { opacity: 0; transform: translateY(-7px); } }
@keyframes rank-popup-option-enter { from { opacity: 0; transform: translateY(12px); } }
@keyframes rank-bonus-enter { from { opacity: 0; transform: scale(.88); } }

.pixel-site .product-shop__grid .product-tile:nth-child(1) { --offer-sequence: 0; }
.pixel-site .product-shop__grid .product-tile:nth-child(2) { --offer-sequence: 1; }
.pixel-site .product-shop__grid .product-tile:nth-child(3) { --offer-sequence: 2; }
.pixel-site .product-shop__grid .product-tile:nth-child(4) { --offer-sequence: 3; }
.pixel-site .product-shop__grid .product-tile:nth-child(5) { --offer-sequence: 4; }
.pixel-site .product-shop__grid .product-tile:nth-child(6) { --offer-sequence: 5; }
.pixel-site .product-shop__grid .product-tile:nth-child(7) { --offer-sequence: 6; }
.pixel-site .product-shop__grid .product-tile:nth-child(8) { --offer-sequence: 7; }
.pixel-site .product-shop__grid .product-tile:nth-child(9) { --offer-sequence: 8; }
.js .pixel-site .product-tile .topup-bonus,
.js .pixel-site .product-tile__recommend { opacity: 0; }
.pixel-site .product-tile.is-offer-visible .topup-bonus {
    animation: shop-bonus-enter .42s cubic-bezier(.16,1,.3,1) both;
    animation-delay: .04s;
}
.pixel-site .product-tile.is-offer-visible .product-tile__recommend {
    animation: shop-recommend-enter .42s cubic-bezier(.16,1,.3,1) both;
    animation-delay: .02s;
}
@keyframes shop-bonus-enter {
    0% { opacity: 0; transform: translateY(12px) scale(.82); filter: blur(3px); }
    62% { opacity: 1; transform: translateY(-2px) scale(1.045); filter: blur(0); }
    100% { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}
@keyframes shop-recommend-enter {
    0% { opacity: 0; transform: translateY(-14px) scale(.84); filter: blur(3px); }
    64% { opacity: 1; transform: translateY(2px) scale(1.04); filter: blur(0); }
    100% { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}
@media (max-width: 800px) {
    .pixel-site .legal-page__layout { grid-template-columns: minmax(0, 1fr); }
    .pixel-site .legal-page__toc { position: static; }
    .pixel-site .legal-page__toc ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pixel-site .policy-scope { align-items: stretch; flex-direction: column; }
    .pixel-site .policy-scope__options { flex-basis: auto; }
}
@media (max-width: 520px) {
    .pixel-site .legal-page__toc ol { grid-template-columns: minmax(0, 1fr); }
    .pixel-site .legal-page__content.tos { padding: 22px 18px; }
    .pixel-site .policy-scope { padding: 18px; }
    .pixel-site .policy-scope__options { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
    .pixel-site .rank-popup__steps { gap: 6px; }
    .pixel-site .rank-popup__steps > span { padding: 8px; font-size: .625rem; }
    .pixel-site .rank-popup__option { padding: 12px; }
    .pixel-site .rank-popup__option-title { font-size: .8125rem; }
    .pixel-site .rank-popup__option-action { display: none; }
    .pixel-site .rank-popup__price { font-size: .875rem; }
    .pixel-site .rank-popup__arrow { width: 24px; height: 24px; }
}
@media (prefers-reduced-motion: reduce) {
    .pixel-site .site-search:not([hidden]) { transition: none; }
    .pixel-site .site-nav .site-nav__link, .pixel-site .site-nav__link::before, .pixel-site .site-nav__link::after, .pixel-site .search-toggle > i, .pixel-site .rank-matrix .rank-buy-btn, .pixel-site .rank-matrix .rank-buy-btn > i { transition: none; }
    .pixel-site .policy-scope__options a.is-policy-switching > i, .pixel-site .legal-page.is-policy-leaving, .pixel-site .legal-page.is-policy-entering .policy-scope, .pixel-site .legal-page.is-policy-entering .legal-page__layout, .pixel-site .rank-popup.is-open .rank-popup__head > :not(.pixel-bottom), .pixel-site .rank-popup.is-open .rank-popup__options .rank-popup__option, .pixel-site .rank-popup.is-open .rank-popup__option--bonus .rank-popup__option-desc, .pixel-site .product-tile .topup-bonus, .pixel-site .product-tile__recommend { animation: none; }
    .js .pixel-site .product-tile .topup-bonus, .js .pixel-site .product-tile__recommend { opacity: 1; }
}
/* Feedback is re-triggered by forms.js, including repeated identical errors. */
.pixel-site .form-feedback.is-entering { animation: form-feedback-slide-in .38s cubic-bezier(.18,.82,.22,1) both !important; }
@media (prefers-reduced-motion: reduce) { .pixel-site .form-feedback.is-entering { animation: none !important; } }


/* responsive-polish.css */
/* Move the pixel pattern inside a tile while its content stays still. */
.pixel-tile::after,
.pixel-tile > .pixel-bottom {
    transition: mask-position .65s cubic-bezier(.2, .7, .25, 1);
}

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
    .pixel-tile:hover::after { mask-position: 48px 0; }
    .pixel-tile:hover > .pixel-bottom { mask-position: -48px 0, 0 bottom; }
}

/* Keep text clear of oversized illustrations when two home columns are narrow. */
@media (min-width: 701px) and (max-width: 1250px) {
    .home-grid .offer-tile { aspect-ratio: auto; width: 100%; min-width: 0; }
    .home-grid .offer-character { width: 45%; height: 70%; right: -3%; bottom: -2%; }
    .home-grid .offer-copy { padding: 26px; }
    .home-grid .offer-copy h1 { font-size: clamp(2rem, 3vw, 2.625rem); }
    .home-grid .offer-tile > .tile-cta { left: 26px; bottom: 26px; }
    .home-grid .shop-banner .banner-decoration { font-size: clamp(2rem, 3vw, 3.5rem); }
}

@media (max-width: 700px) {
    .home-grid .offer-character { width: 51%; height: 60%; right: -2%; bottom: -3%; }
    .home-grid .offer-copy { padding: 27px; }
    .home-grid .offer-copy h1 { font-size: clamp(2.125rem, 9vw, 2.625rem); }
    .home-grid .offer-tile > .tile-cta { left: 27px; bottom: 27px; }
    .home-grid .shop-banner .banner-decoration { font-size: 2.875rem; }
    .home-grid .world-copy { bottom: 30px; }
    .home-grid .world-copy p { padding-right: 0; max-width: 25ch; }
    .server-tile > img, .server-tile__image { width: min(27vw, 100px); height: min(29vw, 108px); }
}

@media (max-width: 380px) {
    .home-grid .offer-copy { padding: 22px; }
    .home-grid .offer-character { width: 47%; height: 56%; }
    .home-grid .offer-tile > .tile-cta { left: 22px; bottom: 22px; }
}

/* Tablet portrait (including iPad mini): give the main home tiles full width. */
@media (min-width: 701px) and (max-width: 820px) {
    .home-grid { grid-template-columns: minmax(0, 1fr); }
    .home-left, .home-right { grid-template-rows: auto; }
    .home-grid .shortcut-tile { aspect-ratio: 1.85; min-height: 160px; padding: 20px 16px; }
    .home-grid .shortcut-tile h2 { font-size: clamp(1rem, 2.4vw, 1.25rem); }
    .home-grid .offer-tile { min-height: 470px; }
    .home-grid .offer-copy { padding: 32px; }
    .home-grid .offer-copy h1 { font-size: clamp(2rem, 5vw, 2.625rem); }
    .home-grid .offer-character { width: 42%; height: 68%; right: -1%; bottom: -2%; }
    .home-grid .offer-tile > .tile-cta { left: 32px; bottom: 32px; }
    .home-grid .social-grid { min-height: 160px; }
    .home-grid .social-tile { gap: 12px; padding: 15px; }
    .home-grid .social-tile > i { font-size: 1.875rem; }
    .home-grid .social-tile strong { font-size: clamp(.625rem, 1.5vw, .75rem); }
    .home-grid .world-tile { min-height: 510px; }
    .home-grid .world-copy { left: 28px; right: 28px; bottom: 42px; }
    .home-grid .world-copy h2 { font-size: clamp(1.75rem, 4vw, 2.125rem); }
    .home-grid .world-copy p { max-width: 42ch; padding-right: 36px; font-size: clamp(.875rem, 1.8vw, 1rem); }
    .home-grid .shop-banner { min-height: 270px; }
}

.rank-mobile-list { display: none; }

.checkout-summary__details > div { min-width: 0; }
.checkout-summary__details dd { max-width: 68%; }
.checkout-summary__variant { display: block; color: #65738a; font-size: .6875rem; font-weight: 600; }

@media (prefers-reduced-motion: no-preference) {
    .pixel-site .checkout-submit {
        transition: background .2s ease;
    }
}

@media (max-width: 420px) {
    .product-tile__footer { align-items: flex-end; }
    .product-tile__pricing { min-width: 0; }
    .product-tile__buy { flex: 0 0 auto; }
}

@media (max-width: 700px) {
    .rank-matrix-scroll, .rank-compare-hint { display: none !important; }
    .rank-mobile-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; }
    .rank-mobile-card { min-width: 0; border: 1px solid #e2e7ef; background: #fff; }
    .rank-mobile-card--bogacz { border: 2px solid #dfad26; box-shadow: 0 8px 20px rgb(107 76 5 / 10%); }
    .rank-mobile-card__header { --tile-color: #a6ed65; --rank-ink: #21410e; padding: 17px; color: var(--rank-ink); }
    .rank-mobile-card--vip .rank-mobile-card__header { --rank-ink: #fff; }
    .rank-mobile-card--svip .rank-mobile-card__header { --tile-color: #ff9933; --rank-ink: #fff; }
    .rank-mobile-card--mvip .rank-mobile-card__header { --tile-color: #069afa; --rank-ink: #fff; }
    .rank-mobile-card--sky .rank-mobile-card__header { --tile-color: #6cd3fb; --rank-ink: #fff; }
    .rank-mobile-card--bogacz .rank-mobile-card__header { --tile-color: #ffc634; --rank-ink: #fff; }
    .rank-mobile-card__meta { display: flex; gap: 8px; align-items: center; min-height: 24px; }
    .rank-mobile-card__meta .rank-matrix__period { margin: 0; }
    .rank-mobile-card__title { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin: 10px 0 15px; }
    .rank-mobile-card__title h2 { margin: 0; color: var(--rank-ink); font-size: 1.625rem; font-weight: 900; line-height: 1.15; }
    .rank-mobile-card__title strong { color: var(--rank-ink); font-size: 1.25rem; font-weight: 900; white-space: nowrap; }
    .rank-mobile-card__buy { display: flex; align-items: center; justify-content: space-between; width: 100%; gap: 10px; padding: 12px 14px; border: 0; background: #253d65; color: #fff; font-size: .75rem; font-weight: 800; text-align: left; transition: background .2s ease, transform .2s ease; }
    .rank-mobile-card__buy:hover { background: #152844; color: #fff; transform: translateY(-2px); }
    .rank-mobile-card--bogacz .rank-mobile-card__buy { background: #513900; color: #fff4ce; }
    .rank-mobile-card--bogacz .rank-mobile-card__buy:hover { background: #382700; }
    .rank-mobile-card__buy:focus-visible { outline: 3px solid #253d65; outline-offset: 3px; }
    .rank-mobile-card__benefits { padding: 4px 16px 8px; }
    .rank-mobile-card__benefits h3 { margin: 13px -16px 2px; padding: 9px 16px; background: #eaf0f7; color: #536989; font-size: .6875rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
    .rank-mobile-card__benefit { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; padding: 10px 0; border-bottom: 1px solid #e7ebf2; color: #27364d; font-size: .75rem; line-height: 1.35; }
    .rank-mobile-card__benefit:last-child { border-bottom: 0; }
    .rank-mobile-card__benefit span { min-width: 0; }
    .rank-mobile-card__benefit strong { flex: 0 0 auto; max-width: 47%; color: #263e6d; font-size: .75rem; font-weight: 800; text-align: right; overflow-wrap: anywhere; }
    .rank-mobile-card__benefit strong.is-included { color: #2f8422; }
    .rank-mobile-card__benefit strong.is-excluded { color: #8896aa; }
}

@media (prefers-reduced-motion: reduce) {
    .pixel-tile::after, .pixel-tile > .pixel-bottom, .rank-mobile-card__buy { transition: none; }
}


/* shop-offer-cards.css */
.pixel-site .product-tile {
    min-height: 356px;
    padding: 17px;
    gap: 0;
    background: var(--tile-color);
}

.pixel-site .product-tile__visual {
    position: relative;
    z-index: 1;
    display: grid;
    place-items: center;
    min-height: 160px;
    background: transparent;
    border: 0;
}

.pixel-site .product-tile__image,
.pixel-site .product-tile:nth-child(n+7) .product-tile__image {
    width: min(58%, 160px);
    height: 142px;
    margin: 0;
    object-fit: contain;
    filter: none;
}

.pixel-site .product-tile--featured { box-shadow: inset 0 0 0 3px rgb(255 255 255 / 72%); }
.pixel-site .product-tile--featured .product-tile__visual { min-height: 170px; padding-top: 22px; }
.pixel-site .product-tile__recommend { position: absolute; top: 9px; right: 9px; z-index: 2; display: inline-flex; align-items: center; gap: 6px; padding: 6px 9px; background: #244729; color: #fff; font-size: .625rem; font-weight: 900; text-transform: uppercase; letter-spacing: .035em; }
.pixel-site .product-tile__recommend i { color: #bcf895; }

.pixel-site .product-tile__offer {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 106px;
    padding: 16px 8px 13px;
    text-align: center;
}

.pixel-site .product-tile__eyebrow {
    color: #fff;
    font-size: .625rem;
    font-weight: 800;
    letter-spacing: .16em;
    line-height: 1.3;
    text-shadow: 0 2px 3px rgb(20 31 47 / 38%);
    text-transform: uppercase;
}

.pixel-site .product-tile__price {
    display: block;
    margin-top: 3px;
    color: #fff;
    font-size: clamp(1.875rem, 2.7vw, 2.75rem);
    font-weight: 900;
    line-height: 1.1;
    white-space: nowrap;
    text-shadow: 0 3px 4px rgb(20 31 47 / 35%);
}

.pixel-site .product-tile__price small {
    color: #fff;
    font-size: .6em;
    font-weight: 900;
    text-transform: uppercase;
}

.pixel-site .product-tile .topup-bonus {
    align-self: center;
    margin-top: 10px;
    padding: 8px 13px;
    border: 1px solid #79d58a;
    border-radius: 999px;
    background: #e3ffe9;
    color: #115d30;
    font-size: .75rem;
    line-height: 1.2;
    font-weight: 900;
    text-shadow: none;
}

.pixel-site .product-tile__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: nowrap;
    padding-top: 13px;
    margin-top: auto;
    border-top: 1px solid rgb(255 255 255 / 55%);
}

.pixel-site .product-tile__pricing { gap: 2px; min-width: 0; }
.pixel-site .product-tile__total { color: #fff; font-size: .625rem; font-weight: 700; text-shadow: 0 1px 2px rgb(20 31 47 / 35%); }
.pixel-site .product-tile__cost { color: #fff; font-size: 1.25rem; font-weight: 900; line-height: 1.1; white-space: nowrap; text-shadow: 0 2px 3px rgb(20 31 47 / 35%); }
.pixel-site .product-tile__buy { flex: 0 0 auto; justify-content: space-between; gap: 12px; padding: 11px 13px; background: transparent; border: 1px solid rgb(255 255 255 / 82%); color: #fff; font-size: .6875rem; white-space: nowrap; }
.pixel-site .product-tile__buy:hover,
.pixel-site .product-tile__buy:focus-visible { background: rgb(255 255 255 / 18%); color: #fff; }

@media (min-width: 1200px) {
    .pixel-site .product-tile:nth-child(n+7) { padding: 17px; }
    .pixel-site .product-tile:nth-child(n+7) .product-tile__buy { font-size: .6875rem; padding: 11px 13px; gap: 12px; }
}

@media (max-width: 760px) {
    .pixel-site .product-tile { min-height: 340px; padding: 15px; }
    .pixel-site .product-tile__visual { min-height: 148px; }
    .pixel-site .product-tile--featured .product-tile__visual { min-height: 158px; }
    .pixel-site .product-tile__image,
    .pixel-site .product-tile:nth-child(n+7) .product-tile__image { height: 130px; }
    .pixel-site .product-tile__offer { min-height: 100px; padding: 14px 8px 12px; }
    .pixel-site .product-tile__price { font-size: 2.25rem; }
}

@media (max-width: 380px) {
    .pixel-site .product-tile__cost { font-size: 1.125rem; }
    .pixel-site .product-tile__buy { gap: 8px; padding: 10px; font-size: .625rem; }
}


/* home-livesky.css */
.ls-home {
    --ls-navy: #142c52;
    --ls-navy-deep: #0b1d3a;
    --ls-blue: #0b9cf0;
    --ls-cyan: #62d9ff;
    --ls-green: #55d833;
    --ls-gold: #ffc42e;
    display: grid;
    gap: clamp(54px, 6vw, 86px);
    padding-bottom: 26px;
}
.ls-home .ls-kicker { margin: 0 0 10px; color: #7b91ad; font-size: .6875rem; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.ls-hero { position: relative; isolation: isolate; min-height: clamp(430px, 54vh, 540px); overflow: hidden; display: flex; align-items: flex-end; padding: clamp(30px, 4vw, 58px); background: var(--ls-navy-deep); color: #fff; clip-path: polygon(0 0, calc(100% - 28px) 0, 100% 28px, 100% 100%, 0 100%); }
.ls-hero::before { content: ''; position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg, rgb(7 22 47 / 94%) 0%, rgb(8 30 58 / 82%) 38%, rgb(8 27 49 / 18%) 70%, rgb(8 27 49 / 10%) 100%); }
.ls-hero::after { content: ''; position: absolute; z-index: -1; width: 430px; height: 430px; right: -120px; top: -180px; border: 1px solid rgb(255 255 255 / 20%); border-radius: 50%; box-shadow: 0 0 0 52px rgb(255 255 255 / 5%), 0 0 0 108px rgb(255 255 255 / 4%); }
.ls-hero__image { position: absolute; inset: 0; z-index: -3; width: 100%; height: 100%; object-fit: cover; object-position: center 54%; scale: 1.01; transition: scale 1.4s cubic-bezier(.16,1,.3,1); }
.ls-hero:hover .ls-hero__image { scale: 1.035; }
.ls-hero > .motion-shine { display: none !important; }
.ls-hero__grid { position: absolute; inset: 0; z-index: -1; opacity: .17; background-image: linear-gradient(rgb(255 255 255 / 18%) 1px, transparent 1px), linear-gradient(90deg, rgb(255 255 255 / 18%) 1px, transparent 1px); background-size: 54px 54px; mask-image: linear-gradient(90deg, #000, transparent 72%); pointer-events: none; }
.ls-hero__cloud { position: absolute; z-index: 0; width: 74px; height: 18px; background: rgb(255 255 255 / 14%); transform: skewX(-22deg); pointer-events: none; animation: ls-cloud-drift 8s ease-in-out infinite alternate; }
.ls-hero__cloud::before, .ls-hero__cloud::after { content: ''; position: absolute; bottom: 0; background: inherit; }
.ls-hero__cloud::before { left: 18px; width: 28px; height: 33px; }
.ls-hero__cloud::after { right: -25px; width: 36px; height: 12px; }
.ls-hero__cloud--one { top: 30%; right: 14%; }
.ls-hero__cloud--two { top: 48%; right: 5%; scale: .62; animation-delay: -3s; }
@keyframes ls-cloud-drift { to { translate: 18px -5px; } }
.ls-hero__badges { position: absolute; top: clamp(22px, 3vw, 36px); left: clamp(24px, 4vw, 58px); right: 32px; display: flex; flex-wrap: wrap; gap: 8px; }
.ls-hero__badges > span { display: inline-flex; align-items: center; gap: 8px; min-height: 34px; padding: 8px 12px; background: rgb(9 28 55 / 76%); border: 1px solid rgb(255 255 255 / 22%); backdrop-filter: blur(9px); color: #fff; font-size: .625rem; font-weight: 800; text-transform: uppercase; }
.ls-hero__badges > span:first-child { background: var(--ls-green); border-color: #86ed6e; color: #153b0b; }
.ls-hero__live > i { width: 7px; height: 7px; border-radius: 50%; background: #72f04d; box-shadow: 0 0 0 4px rgb(114 240 77 / 16%); }
.ls-hero__content { position: relative; z-index: 2; width: min(690px, 72%); }
.ls-hero-team { position:absolute; z-index:1; right:3.5%; bottom:-7%; width:min(44%,610px); height:88%; pointer-events:none; perspective:900px; }
.ls-hero-player { position:absolute; bottom:0; width:34%; height:95%; margin:0; transform-origin:50% 100%; transition:transform .75s cubic-bezier(.16,1,.3,1), filter .4s ease; filter:drop-shadow(0 18px 16px rgb(1 12 27/.42)); }
.ls-hero-player img { width:100%; height:100%; object-fit:contain; object-position:bottom; transition:filter .35s ease; }
.ls-hero-player figcaption { position:absolute; left:50%; bottom:8%; padding:5px 8px; background:rgb(8 28 54/.72); border:1px solid rgb(255 255 255/.25); color:#fff; font-size:.55rem; font-weight:800; letter-spacing:.04em; transform:translateX(-50%); opacity:0; transition:opacity .25s, transform .3s; }
.ls-hero-player--left { left:2%; z-index:1; transform:rotate(-7deg) translateY(7%) scale(.9); animation:ls-player-left 4.7s ease-in-out infinite; }
.ls-hero-player--center { left:32%; z-index:3; transform:translateY(-2%) scale(1.04); animation:ls-player-center 4.1s ease-in-out -.8s infinite; }
.ls-hero-player--right { right:1%; z-index:2; transform:rotate(7deg) translateY(6%) scale(.92); animation:ls-player-right 5.2s ease-in-out -1.7s infinite; }
.ls-hero:hover .ls-hero-player { animation:none; }
.ls-hero:hover .ls-hero-player--left { transform:rotate(-15deg) translate(-18%,-7%) scale(.98); }
.ls-hero:hover .ls-hero-player--center { transform:translateY(-12%) scale(1.13) rotate(2deg); }
.ls-hero:hover .ls-hero-player--right { transform:rotate(15deg) translate(18%,-6%) scale(1.01); }
.ls-hero:hover .ls-hero-player img { filter:brightness(1.08) drop-shadow(0 5px 7px rgb(98 217 255/.2)); }
.ls-hero:hover .ls-hero-player figcaption { opacity:1; transform:translate(-50%,-5px); }
@keyframes ls-player-left { 0%,100%{transform:rotate(-7deg) translateY(7%) scale(.9)} 50%{transform:rotate(-10deg) translate(-4%,-1%) scale(.93)} }
@keyframes ls-player-center { 0%,100%{transform:translateY(-2%) scale(1.04) rotate(-1deg)} 50%{transform:translateY(-8%) scale(1.075) rotate(2deg)} }
@keyframes ls-player-right { 0%,100%{transform:rotate(7deg) translateY(6%) scale(.92)} 50%{transform:rotate(11deg) translate(4%,-2%) scale(.95)} }
.ls-hero__content .ls-kicker { color: #83e8ff; }
.ls-hero h1 { max-width: 690px; margin: 0; color: #fff; font-size: clamp(2.4rem, 4.4vw, 4.65rem); font-weight: 900; letter-spacing: -.045em; line-height: .96; text-transform: uppercase; text-shadow: 0 5px 22px rgb(0 0 0 / 34%); }
.ls-hero h1 span { color: var(--ls-cyan); }
.ls-hero__lead { max-width: 650px; margin: 23px 0 27px; color: rgb(255 255 255 / 86%); font-size: clamp(.925rem, 1.3vw, 1.075rem); line-height: 1.65; }
.ls-hero__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.ls-button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 51px; padding: 13px 19px; border: 1px solid transparent; color: #fff; font: inherit; font-size: .75rem; font-weight: 800; text-decoration: none; cursor: pointer; transition: translate .25s ease, background .25s ease, border-color .25s ease; }
.ls-button:hover { color: #fff; translate: 0 -2px; }
.ls-button--primary { background: var(--ls-blue); border-color: #55c8ff; }
.ls-button--primary strong { padding-left: 4px; color: #fff; font-weight: 900; }
.ls-button--glass { background: rgb(255 255 255 / 10%); border-color: rgb(255 255 255 / 30%); backdrop-filter: blur(10px); }
.ls-button--glass:hover { background: rgb(255 255 255 / 17%); }
.ls-hero__shop { position: absolute; right: clamp(26px, 4vw, 58px); bottom: clamp(26px, 4vw, 58px); z-index: 2; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 13px; min-width: 245px; padding: 12px 15px 12px 12px; background: #fff; color: var(--ls-navy); box-shadow: 0 18px 40px rgb(4 14 31 / 30%); text-decoration: none; transition: translate .28s cubic-bezier(.22,1,.36,1), box-shadow .28s ease; }
.ls-hero__shop:hover { color: var(--ls-navy); translate: 0 -4px; box-shadow: 0 22px 46px rgb(4 14 31 / 38%); }
.ls-hero__shop-icon { display: grid; place-items: center; width: 48px; height: 48px; background: var(--ls-gold); color: #563c00; font-size: 1.25rem; }
.ls-hero__shop small, .ls-hero__shop strong { display: block; }
.ls-hero__shop small { margin-bottom: 3px; color: #7d8ba0; font-size: .5625rem; font-weight: 700; text-transform: uppercase; }
.ls-hero__shop strong { color: var(--ls-navy); font-size: .75rem; }
.ls-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 28px; margin-bottom: 24px; }
.ls-section-heading h2 { margin: 0; color: var(--ls-navy); font-size: clamp(1.65rem, 3vw, 2.65rem); font-weight: 900; letter-spacing: -.035em; line-height: 1.05; text-transform: uppercase; }
.ls-section-heading > p { max-width: 350px; margin: 0; color: #75859b; font-size: .8125rem; line-height: 1.6; text-align: right; }
.ls-feature-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 16px; }
.ls-feature { position: relative; isolation: isolate; overflow: hidden; min-height: 275px; padding: 28px; display: flex; flex-direction: column; justify-content: flex-end; color: #fff; text-decoration: none; clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 0 100%); transition: translate .3s cubic-bezier(.22,1,.36,1); }
.ls-feature::before { content: ''; position: absolute; z-index: -1; inset: auto -60px -100px auto; width: 220px; height: 220px; border: 35px solid rgb(255 255 255 / 9%); border-radius: 50%; transition: transform .65s cubic-bezier(.16,1,.3,1); }
@keyframes ls-shop-hover { 0%,100% { transform:translateY(0) rotate(-.15deg); } 50% { transform:translateY(-8px) rotate(.2deg); } }
.ls-feature:hover::before { transform: translate(-18px, -12px) scale(1.13) rotate(9deg); }
.ls-feature--shop { grid-column: span 6; background: linear-gradient(135deg, #42ce67, #15994b); }
.ls-feature--ranks { grid-column: span 3; background: linear-gradient(145deg, #159ee7, #087bc6); }
.ls-feature--map { grid-column: span 3; background: linear-gradient(145deg, #ffb81c, #ffd642); color: #3d2b00; }
.ls-feature--map .ls-feature__copy strong, .ls-feature--map .ls-feature__icon, .ls-feature--map .ls-feature__arrow { color: #fff; }
.ls-feature--map .ls-feature__icon { background: rgb(255 255 255 / 18%); border-color: rgb(255 255 255 / 26%); }
.ls-feature--map .ls-feature__arrow { border-color: rgb(255 255 255 / 42%); }
.ls-voxel-ribbon { position: absolute; top: 34px; left: 112px; display: flex; align-items: center; gap: 11px; opacity: .32; transform: translateX(0); transition: transform .65s cubic-bezier(.16,1,.3,1), opacity .35s ease; pointer-events: none; }
.ls-voxel-ribbon i { display: block; width: 17px; height: 17px; background: rgb(255 255 255 / 62%); transform: rotate(45deg); transition: transform .55s cubic-bezier(.22,1,.36,1); }
.ls-voxel-ribbon i:nth-child(2), .ls-voxel-ribbon i:nth-child(5) { width: 10px; height: 10px; translate: 0 16px; opacity: .62; }
.ls-voxel-ribbon i:nth-child(3) { translate: 0 -8px; }
.ls-voxel-ribbon i:nth-child(4) { width: 23px; height: 23px; translate: 0 7px; opacity: .5; }
.ls-voxel-ribbon i:nth-child(6) { translate: 0 -3px; opacity: .44; }
.ls-feature:hover .ls-voxel-ribbon, .ls-rank-banner:hover .ls-voxel-ribbon, .ls-voxel-host:hover .ls-voxel-ribbon { transform: translateX(28px); opacity: .55; }
.ls-feature:hover .ls-voxel-ribbon i:nth-child(odd), .ls-rank-banner:hover .ls-voxel-ribbon i:nth-child(odd), .ls-voxel-host:hover .ls-voxel-ribbon i:nth-child(odd) { transform: rotate(55deg) translateY(-3px); }
.ls-feature:hover .ls-voxel-ribbon i:nth-child(even), .ls-rank-banner:hover .ls-voxel-ribbon i:nth-child(even), .ls-voxel-host:hover .ls-voxel-ribbon i:nth-child(even) { transform: rotate(35deg) translateY(3px); }
.ls-voxel-ribbon--rank { top: auto; left: 46%; bottom: 34px; opacity: .18; }
.ls-voxel-ribbon--auto { z-index: 1; top: 22px; left: 24%; scale: .72; opacity: .18; transform-origin: left center; }
.product-tile .ls-voxel-ribbon--auto { top: 17%; left: 8%; }
.checkout-product__hero .ls-voxel-ribbon--auto, .voucher-promo .ls-voxel-ribbon--auto { top: 26px; left: 20%; }
.purchase-card .ls-voxel-ribbon--auto, .buyer-card .ls-voxel-ribbon--auto { top: 17px; left: 42%; scale: .55; opacity: .13; }
.ls-community-card .ls-voxel-ribbon--auto { top: 24px; left: 12%; scale: .62; opacity: .2; }
.ls-community-card > :not(.ls-voxel-ribbon) { position: relative; z-index: 2; }
.ls-feature__number { position: absolute; top: 20px; right: 23px; color: rgb(255 255 255 / 28%); font-size: 2.3rem; font-weight: 900; }
.ls-feature__icon { position: absolute; top: 27px; left: 28px; display: grid; place-items: center; width: 60px; height: 60px; background: rgb(255 255 255 / 14%); border: 1px solid rgb(255 255 255 / 18%); font-size: 1.6rem; transition: transform .35s cubic-bezier(.22,1,.36,1); }
.ls-feature:hover .ls-feature__icon { transform: translateY(-4px) rotate(-4deg) scale(1.07); }
.ls-feature__copy { display: block; padding-right: 42px; }
.ls-feature__copy small, .ls-feature__copy strong, .ls-feature__copy > span { display: block; }
.ls-feature__copy small { margin-bottom: 7px; color: rgb(255 255 255 / 68%); font-size: .5875rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.ls-feature__copy strong { color: #fff; font-size: clamp(1.2rem, 2vw, 1.75rem); font-weight: 900; line-height: 1.15; text-transform: uppercase; }
.ls-feature__copy > span { max-width: 430px; margin-top: 10px; color: rgb(255 255 255 / 76%); font-size: .72rem; line-height: 1.55; }
.ls-feature__arrow { position: absolute; right: 23px; bottom: 26px; display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid rgb(255 255 255 / 34%); transition: background .25s ease, transform .25s ease; }
.ls-feature:hover .ls-feature__arrow { background: #fff; color: var(--ls-navy); transform: translateX(3px); }
.ls-rank-banner { position: relative; isolation: isolate; overflow: hidden; min-height: 390px; padding: clamp(34px, 5vw, 68px); display: flex; align-items: center; background: linear-gradient(120deg, #ff9213 0%, #ffb813 54%, #ffd43b 100%); color: #172d4e; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 26px), calc(100% - 26px) 100%, 0 100%); }
.ls-rank-banner::before { content: ''; position: absolute; inset: 0; z-index: -1; background-image: radial-gradient(circle at 1px 1px, rgb(92 49 0 / 17%) 1px, transparent 0); background-size: 28px 28px; mask-image: linear-gradient(90deg, #000, transparent 76%); }
.ls-rank-banner__copy { position: relative; z-index: 2; width: min(620px, 59%); }
.ls-rank-banner .ls-kicker { color: #704600; }
.ls-rank-banner__badge { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 13px; padding: 7px 10px; background: #172d4e; border: 1px solid #314e76; color: #ffe899; font-size: .625rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.ls-rank-banner h2 { margin: 0; color: #172d4e; font-size: clamp(3.1rem, 6vw, 6.4rem); font-weight: 900; letter-spacing: -.055em; line-height: .9; }
.ls-rank-banner__copy > p:not(.ls-kicker) { max-width: 520px; margin: 21px 0 25px; color: rgb(255 255 255 / 78%); font-size: .9rem; line-height: 1.65; }
.ls-rank-banner__actions { display: flex; align-items: center; gap: 18px; margin-top: 27px; }
.ls-button--gold { background: #172d4e; color: #fff; }
.ls-button--gold:hover { color: #fff; background: #0c1f3e; }
.ls-rank-banner__actions > span { color: #5d430c; font-size: .6875rem; font-weight: 800; }
.ls-rank-banner > img { position: absolute; right: 5%; bottom: -34%; width: min(37%, 470px); height: 135%; object-fit: contain; object-position: center bottom; filter: drop-shadow(0 24px 24px rgb(3 15 34 / 35%)); transition: transform .65s cubic-bezier(.16,1,.3,1); }
.ls-rank-banner:hover > img { transform: translateY(-8px) rotate(1deg) scale(1.025); }
.ls-rank-banner__orbit { position: absolute; right: 9%; top: 50%; width: 300px; height: 300px; translate: 0 -50%; border: 1px solid rgb(73 45 0 / 20%); border-radius: 50%; transition: transform .75s cubic-bezier(.16,1,.3,1); }
.ls-rank-banner__orbit--two { width: 390px; height: 390px; right: 6%; border-color: rgb(255 255 255 / 28%); }
.ls-rank-banner:hover .ls-rank-banner__orbit--one { transform: translate(16px, -9px) scale(1.08); }
.ls-rank-banner:hover .ls-rank-banner__orbit--two { transform: translate(-12px, 8px) scale(.96); }
.ls-community__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ls-community-card { position: relative; isolation: isolate; overflow: hidden; min-width: 0; min-height: 132px; padding: 20px; display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 13px; border: 0; color: #fff; text-align: center; text-decoration: none; font: inherit; cursor: pointer; transition: translate .32s cubic-bezier(.22,1,.36,1), filter .25s ease; }
.ls-community-card::after { content: ''; position: absolute; z-index: -1; width: 150px; height: 150px; border: 22px solid rgb(255 255 255 / 10%); border-radius: 50%; transition: transform .45s cubic-bezier(.22,1,.36,1); }
.ls-community-card:hover::after { transform: translate(12px, -9px) scale(1.3) rotate(10deg); }
.ls-community-card > i { color: #fff; font-size: 2.55rem; filter: drop-shadow(0 6px 10px rgb(0 0 0 / 15%)); transition: transform .4s cubic-bezier(.22,1,.36,1); }
.ls-community-card:hover > i { transform: translateY(-5px) rotate(-5deg) scale(1.12); }
.ls-community-card--discord { background: #5865f2; }
.ls-community-card--video { background: #ff2d27; }
.ls-community-card--server { background: #51c932; }
.ls-community-card strong { color: #fff; font-size: .82rem; font-weight: 900; text-transform: uppercase; }
.ls-card-pattern { position:absolute; z-index:0; inset:13px -34px 36px; display:grid; grid-template-columns:repeat(4,1fr); place-items:center; gap:12px 25px; opacity:.17; transform:rotate(-7deg) scale(1.08); transition:transform .65s cubic-bezier(.16,1,.3,1), opacity .35s ease; pointer-events:none; }
.ls-card-pattern i { color:#fff; font-size:clamp(1.65rem,3vw,3.1rem); filter:none; }
.ls-card-pattern i:nth-child(even) { transform:translateY(18px) rotate(12deg) scale(.82); }
.ls-card-pattern i:nth-child(3n) { transform:rotate(-16deg) scale(1.12); }
.ls-card-ridge { position:absolute; z-index:0; left:0; right:0; bottom:0; height:30px; background:rgb(0 0 0/.16); clip-path:polygon(0 47%,7% 47%,7% 13%,13% 13%,13% 67%,21% 67%,21% 30%,29% 30%,29% 83%,38% 83%,38% 20%,46% 20%,46% 60%,54% 60%,54% 7%,63% 7%,63% 73%,72% 73%,72% 33%,81% 33%,81% 87%,90% 87%,90% 20%,96% 20%,96% 53%,100% 53%,100% 100%,0 100%); transition:height .5s cubic-bezier(.16,1,.3,1), opacity .3s ease; pointer-events:none; }
.ls-feature:hover .ls-card-pattern,.ls-community-card:hover .ls-card-pattern { transform:rotate(-3deg) translateX(18px) scale(1.13); opacity:.25; }
.ls-feature:hover .ls-card-ridge,.ls-community-card:hover .ls-card-ridge { height:39px; opacity:.86; }
.ls-feature > :not(.ls-card-pattern):not(.ls-card-ridge),.ls-community-card > :not(.ls-card-pattern):not(.ls-card-ridge) { z-index:2; }
.ls-feature .ls-voxel-ribbon,.ls-community-card .ls-voxel-ribbon { display:none; }
@media (max-width: 980px) {
    .ls-hero { min-height: 460px; }
    .ls-hero__content { width: min(760px, 100%); padding-bottom: 0; }
    .ls-hero-team { right:-5%; width:48%; opacity:.72; }
    .ls-hero__shop { left: clamp(24px, 4vw, 58px); right: auto; bottom: 28px; }
    .ls-feature--shop { grid-column: span 12; }
    .ls-feature--ranks, .ls-feature--map { grid-column: span 6; }
    .ls-rank-banner__copy { width: 67%; }
    .ls-rank-banner > img { right: -3%; width: 43%; }
    .ls-community__grid { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
    .ls-home { gap: 48px; }
    .ls-hero-team { right:-28%; bottom:-13%; width:75%; height:64%; opacity:.42; }
    .ls-hero__content { z-index:3; }
    .ls-hero { min-height: 430px; align-items: center; padding: 32px 23px; clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%); }
    .ls-hero::before { background: linear-gradient(180deg, rgb(7 22 47 / 82%), rgb(8 25 50 / 90%) 72%, rgb(8 25 50 / 96%)); }
    .ls-hero__image { object-position: 62% center; }
    .ls-hero__badges { top: 20px; left: 20px; right: 20px; }
    .ls-hero__badges > span { padding: 7px 9px; font-size: .5rem; }
    .ls-hero h1 { font-size: clamp(2.35rem, 12vw, 4rem); }
    .ls-hero__lead { font-size: .82rem; }
    .ls-hero__actions { align-items: stretch; flex-direction: column; }
    .ls-button { width: 100%; }
    .ls-hero__shop { left: 20px; right: 20px; bottom: 20px; min-width: 0; }
    .ls-section-heading { align-items: flex-start; flex-direction: column; gap: 10px; }
    .ls-section-heading > p { text-align: left; }
    .ls-feature--shop, .ls-feature--ranks, .ls-feature--map { grid-column: span 12; }
    .ls-feature { min-height: 240px; }
    .ls-rank-banner { min-height: 560px; align-items: flex-start; padding: 36px 25px; }
    .ls-rank-banner__copy { width: 100%; }
    .ls-rank-banner__copy > p:not(.ls-kicker) { width: 72%; }
    .ls-rank-banner__actions { align-items: flex-start; flex-direction: column; gap: 11px; }
    .ls-rank-banner__actions .ls-button { width: fit-content; }
    .ls-rank-banner > img { right: -15%; bottom: -37%; width: 75%; height: 110%; }
    .ls-rank-banner__orbit { right: -32%; top: 69%; }
}
@media (prefers-reduced-motion: reduce) {
    .ls-hero__cloud { animation: none; }
    .ls-feature--shop { animation:none; }
    .ls-hero-player { animation:none; }
    .ls-hero__image, .ls-feature, .ls-feature__icon, .ls-feature__arrow, .ls-rank-banner > img, .ls-community-card, .ls-button, .ls-hero__shop { transition: none; }
}

/* Samodzielny pikselowy motyw sklepu z bezszwowym SVG banknotów. */
.ls-feature--shop { background:#38df55; box-shadow:inset 0 -9px 0 #168b35; }
.ls-feature--shop .ls-card-pattern,.ls-feature--shop .ls-card-ridge,.ls-feature--shop .ls-voxel-ribbon { display:none; }
.ls-money-pattern { position:absolute; z-index:0; inset:-104px -180px; background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxODAiIGhlaWdodD0iMTA0IiB2aWV3Qm94PSIwIDAgMTgwIDEwNCIgc2hhcGUtcmVuZGVyaW5nPSJjcmlzcEVkZ2VzIj48cmVjdCB3aWR0aD0iMTgwIiBoZWlnaHQ9IjEwNCIgZmlsbD0iIzM4ZGY1NSIvPjxnIG9wYWNpdHk9Ii4yOCI+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoOCA4KSByb3RhdGUoLTggNDIgMjUpIj48cmVjdCB3aWR0aD0iODQiIGhlaWdodD0iNTAiIGZpbGw9IiMwODdmMzIiLz48cmVjdCB4PSI2IiB5PSI2IiB3aWR0aD0iNzIiIGhlaWdodD0iMzgiIGZpbGw9IiM2NWYwNzgiLz48cmVjdCB4PSIxMyIgeT0iMTIiIHdpZHRoPSI1OCIgaGVpZ2h0PSIyNiIgZmlsbD0iIzIwYjk0NyIvPjxyZWN0IHg9IjM0IiB5PSIxNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjIyIiBmaWxsPSIjOWFmZjlkIi8+PHJlY3QgeD0iMzgiIHk9IjE4IiB3aWR0aD0iOCIgaGVpZ2h0PSIxNCIgZmlsbD0iIzA4N2YzMiIvPjxyZWN0IHg9IjQiIHk9IjE4IiB3aWR0aD0iNyIgaGVpZ2h0PSIxNCIgZmlsbD0iIzA4N2YzMiIvPjxyZWN0IHg9IjczIiB5PSIxOCIgd2lkdGg9IjciIGhlaWdodD0iMTQiIGZpbGw9IiMwODdmMzIiLz48L2c+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAxIDUzKSByb3RhdGUoOSAzOCAyMSkiPjxyZWN0IHdpZHRoPSI3NiIgaGVpZ2h0PSI0NCIgZmlsbD0iIzBhOTQzOCIvPjxyZWN0IHg9IjYiIHk9IjYiIHdpZHRoPSI2NCIgaGVpZ2h0PSIzMiIgZmlsbD0iIzcyZjE4NCIvPjxyZWN0IHg9IjEyIiB5PSIxMSIgd2lkdGg9IjUyIiBoZWlnaHQ9IjIyIiBmaWxsPSIjMjRjMzRjIi8+PHJlY3QgeD0iMzAiIHk9IjEyIiB3aWR0aD0iMTYiIGhlaWdodD0iMjAiIGZpbGw9IiNhNmZmYTgiLz48cmVjdCB4PSIzNSIgeT0iMTYiIHdpZHRoPSI2IiBoZWlnaHQ9IjEyIiBmaWxsPSIjMDg3ZjMyIi8+PC9nPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDExOSAtMTgpIHJvdGF0ZSgxMyAzMyAyMCkiPjxyZWN0IHdpZHRoPSI2OCIgaGVpZ2h0PSI0MiIgZmlsbD0iIzBiOGIzNiIvPjxyZWN0IHg9IjYiIHk9IjYiIHdpZHRoPSI1NiIgaGVpZ2h0PSIzMCIgZmlsbD0iIzViZWE3MiIvPjxyZWN0IHg9IjI1IiB5PSI4IiB3aWR0aD0iMTgiIGhlaWdodD0iMjYiIGZpbGw9IiMxNmFkNDIiLz48L2c+PC9nPjwvc3ZnPg=="); background-repeat:repeat; background-size:180px 104px; image-rendering:pixelated; animation:ls-money-drift 11s linear infinite; pointer-events:none; will-change:transform; }
.ls-feature--shop::before { display:none; }
.ls-feature--shop .ls-feature__copy { align-self:center; margin:auto; text-align:center; }
.ls-feature--shop .ls-feature__copy strong { font-family:'Courier New',monospace; font-size:clamp(1.25rem,2.4vw,2rem); letter-spacing:.04em; text-shadow:0 3px 0 rgb(5 76 31/.42); }
@keyframes ls-money-drift { from{transform:translate(0,0)} to{transform:translate(180px,104px)} }
@keyframes ls-player-left { 0%,100%{transform:rotate(-4deg) translateY(5%) scale(.9)} 50%{transform:rotate(-6deg) translate(-2%,-1%) scale(.92)} }
@keyframes ls-player-center { 0%,100%{transform:translateY(0) scale(1.02) rotate(-.5deg)} 50%{transform:translateY(-4%) scale(1.045) rotate(1deg)} }
@keyframes ls-player-right { 0%,100%{transform:rotate(4deg) translateY(5%) scale(.91)} 50%{transform:rotate(6deg) translate(2%,-1%) scale(.93)} }
.ls-hero-player--left{animation-duration:7.8s}.ls-hero-player--center{animation-duration:7.2s}.ls-hero-player--right{animation-duration:8.4s}
@media(prefers-reduced-motion:reduce){.ls-money-pattern{animation:none}}

/* Oryginalny język powierzchni LiveSky: ukośne narożniki i gwiezdna siatka. */
.pixel-site:not(.classic-home-version) .pixel-tile::before,
.pixel-site:not(.classic-home-version) .pixel-tile::after,
.pixel-site:not(.classic-home-version) .pixel-bottom { display: none !important; }
.pixel-site:not(.classic-home-version) .pixel-tile::after {
    content: "";
    display: block !important;
    position: absolute;
    z-index: 0;
    inset: auto 0 0;
    width: 100%;
    height: 25px;
    background: rgb(0 0 0 / 14%);
    clip-path: polygon(0 46%,6% 46%,6% 8%,12% 8%,12% 68%,20% 68%,20% 26%,28% 26%,28% 82%,37% 82%,37% 16%,45% 16%,45% 58%,54% 58%,54% 4%,63% 4%,63% 74%,72% 74%,72% 31%,81% 31%,81% 88%,90% 88%,90% 18%,96% 18%,96% 54%,100% 54%,100% 100%,0 100%);
    pointer-events: none;
}
.pixel-site:not(.classic-home-version) .pixel-tile {
    background-color: var(--tile-color);
    background-image: radial-gradient(circle, rgb(255 255 255 / 30%) 1.8px, transparent 2.2px), linear-gradient(135deg, rgb(255 255 255 / 15%), transparent 48%);
    background-size: 21px 21px, 100% 100%;
    clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 14px 100%, 0 calc(100% - 14px));
}

.ls-rank-showcase { position: relative; height: clamp(320px, 31vw, 430px); overflow: hidden; color: #fff; clip-path: polygon(0 0, calc(100% - 26px) 0, 100% 26px, 100% 100%, 22px 100%, 0 calc(100% - 22px)); }
.ls-rank-showcase__viewport, .ls-rank-slide { position: absolute; inset: 0; }
.ls-rank-slide { --rank-a:#65d83e; --rank-b:#238b42; display:flex; align-items:center; padding:clamp(34px,5vw,76px); overflow:hidden; opacity:0; visibility:hidden; transform:translateX(5%); transition:opacity .55s ease, transform .7s cubic-bezier(.2,.8,.2,1), visibility .55s; background:linear-gradient(125deg,var(--rank-a),var(--rank-b)); }
.ls-rank-slide::before { content:""; position:absolute; inset:0; opacity:.58; background-image:radial-gradient(circle,rgb(255 255 255/.45) 1.8px,transparent 2.2px); background-size:23px 23px; mask-image:linear-gradient(90deg,#000,transparent 88%); }
.ls-rank-slide.is-active { opacity:1; visibility:visible; transform:none; z-index:2; }
.ls-rank-slide--svip { --rank-a:#ff9b26; --rank-b:#dc5b16; }
.ls-rank-slide--mvip { --rank-a:#188ff0; --rank-b:#1255bb; }
.ls-rank-slide--sky { --rank-a:#54c8ef; --rank-b:#2584c8; }
.ls-rank-slide--bogacz { --rank-a:#ffb21b; --rank-b:#e56e12; }
.ls-rank-slide__copy { position:relative; z-index:3; display:flex; flex-direction:column; align-items:flex-start; }
.ls-rank-slide__copy p { margin:0 0 8px; color:#fff; font-size:.72rem; font-weight:900; letter-spacing:.16em; text-transform:uppercase; }
.ls-rank-slide__copy strong { color:#fff; font-size:clamp(3.3rem,7vw,7.4rem); font-weight:900; line-height:.88; text-shadow:0 5px 20px rgb(0 0 0/.18); }
.ls-rank-slide__price { margin-top:16px; color:#fff; font-size:1.1rem; font-weight:900; }
.ls-rank-slide__copy a { margin-top:26px; padding:14px 19px; border:1px solid rgb(255 255 255/.58); background:rgb(9 31 57/.2); color:#fff; font-size:.75rem; font-weight:800; text-decoration:none; transition:translate .25s, background .25s; }
.ls-rank-slide__copy a:hover { translate:5px 0; background:rgb(9 31 57/.34); }
.ls-rank-slide__badge { margin-bottom:14px; padding:8px 11px; background:#6c4300; color:#fff; font-size:.66rem; font-weight:900; text-transform:uppercase; }
.ls-rank-slide > img { position:absolute; z-index:2; right:5%; bottom:-27%; width:min(42%,500px); height:116%; object-fit:contain; filter:drop-shadow(0 24px 22px rgb(0 0 0/.23)); transform:translate(15%,5%) scale(.92); transition:transform .9s cubic-bezier(.16,1,.3,1); }
.ls-rank-slide.is-active > img { transform:none; }
.ls-rank-slide__constellation { position:absolute; right:6%; top:10%; width:42%; height:60%; border:1px solid rgb(255 255 255/.16); border-radius:50%; transition:transform 1s cubic-bezier(.16,1,.3,1); }
.ls-rank-slide__constellation i { position:absolute; width:12px; height:12px; background:rgb(255 255 255/.38); transform:rotate(45deg); }
.ls-rank-slide__constellation i:nth-child(1){left:5%;top:52%}.ls-rank-slide__constellation i:nth-child(2){left:35%;top:4%}.ls-rank-slide__constellation i:nth-child(3){right:8%;top:38%}.ls-rank-slide__constellation i:nth-child(4){left:49%;bottom:2%}
.ls-rank-showcase:hover .is-active .ls-rank-slide__constellation { transform:rotate(10deg) scale(1.04); }
.ls-rank-showcase__nav { position:absolute; z-index:5; top:50%; width:45px; height:45px; border:1px solid rgb(255 255 255/.35); background:rgb(8 29 54/.24); color:#fff; cursor:pointer; transform:translateY(-50%); transition:background .2s, transform .2s; }
.ls-rank-showcase__nav:hover { background:rgb(8 29 54/.5); transform:translateY(-50%) scale(1.06); }
.ls-rank-showcase__nav--prev { left:18px; }.ls-rank-showcase__nav--next { right:18px; }
.ls-rank-showcase__dots { position:absolute; z-index:5; left:50%; bottom:22px; display:flex; gap:8px; transform:translateX(-50%); }
.ls-rank-showcase__dots button { width:9px; height:9px; padding:0; border:1px solid rgb(255 255 255/.7); border-radius:50%; background:transparent; cursor:pointer; transition:width .25s,background .25s,border-radius .25s; }
.ls-rank-showcase__dots button.is-active { width:28px; border-radius:9px; background:#fff; }
@media(max-width:650px){.ls-rank-showcase{height:415px}.ls-rank-slide{align-items:flex-start;padding:32px 26px}.ls-rank-slide__copy strong{font-size:3.05rem}.ls-rank-slide>img{right:-8%;bottom:-29%;width:72%;height:100%}.ls-rank-showcase__nav{top:auto;bottom:14px}.ls-rank-showcase__dots{bottom:31px}}
@media(prefers-reduced-motion:reduce){.ls-rank-slide,.ls-rank-slide>img,.ls-rank-slide__constellation{transition:none}.ls-rank-showcase__dots button{transition:none}}

/* Impuls LiveSky zastępuje dolny pikselowy ornament na ofertach. */
.pixel-site:not(.classic-home-version) .pixel-tile::after { display:none !important; }
.pixel-site:not(.classic-home-version) .product-tile::after,
.pixel-site:not(.classic-home-version) .offer-tile::after {
    content:""; display:block !important; position:absolute; z-index:2; left:20px; right:20px; bottom:12px; width:auto; height:5px;
    background:linear-gradient(90deg,transparent 0 5%,rgb(255 255 255/.7) 5% 12%,transparent 12% 17%,rgb(255 255 255/.22) 17% 52%,#fff 52% 57%,rgb(255 255 255/.22) 57% 92%,transparent 92%);
    background-size:210% 100%; clip-path:none; opacity:.72; animation:ls-energy-rail 4.4s linear infinite; pointer-events:none;
}
.pixel-site:not(.classic-home-version) .product-tile:hover::after,.pixel-site:not(.classic-home-version) .offer-tile:hover::after { animation-duration:1.9s; opacity:1; }
@keyframes ls-energy-rail { to { background-position:-210% 0; } }

/* Postacie reagują własnym ruchem, bez zmiany układu po najechaniu. */
.ls-hero:hover .ls-hero-player--left { animation:ls-player-left 4.7s ease-in-out infinite; }
.ls-hero:hover .ls-hero-player--center { animation:ls-player-center 4.1s ease-in-out -.8s infinite; }
.ls-hero:hover .ls-hero-player--right { animation:ls-player-right 5.2s ease-in-out -1.7s infinite; }
.ls-hero:hover .ls-hero-player img { filter:none; }
.ls-hero:hover .ls-hero-player figcaption { opacity:0; transform:translateX(-50%); }

.angle-button--discord { background:#5865f2; color:#fff; }
.angle-button--discord:hover { background:#4752c4; color:#fff; }
.angle-button--discord > i { transform:skew(17deg); font-size:1.15rem; }

.site-toast { display:flex; align-items:center; gap:12px; min-width:min(340px,calc(100% - 28px)); text-align:left; background:#102c50; border-left:4px solid #62db42; box-shadow:0 16px 42px rgb(5 20 41/.24); }
.site-toast > i { display:grid; place-items:center; flex:0 0 30px; width:30px; height:30px; border-radius:50%; background:#62db42; color:#15380e; }
.site-toast__copy { display:grid; gap:2px; }
.site-toast__copy strong { color:#fff; font-size:.76rem; }
.site-toast__copy small { color:#c9d7e8; font-size:.64rem; font-weight:500; }
[data-copy-ip].is-copied { filter:brightness(1.08); }

.footer-copyright img { width:104px; max-width:104px; max-height:27px; }

/* Voucher wykorzystuje całą szerokość roboczą strony. */
.voucher-page__layout { max-width:none; width:100%; grid-template-columns:minmax(0,1fr) minmax(0,1.18fr); gap:20px; }
.voucher-promo { min-height:min(690px,calc(100vh - 190px)); justify-content:flex-start; padding:44px 54px; }
.voucher-promo__chest { width:min(72%,360px); height:310px; }
.voucher-form-panel { padding:clamp(42px,5vw,76px); justify-content:center; }
@media(max-width:760px){.voucher-page__layout{grid-template-columns:1fr}.voucher-promo{min-height:290px;padding:24px}.voucher-promo__chest{width:39%;height:158px}.voucher-form-panel{padding:28px 23px}}

.ls-hero-player img { transform:scaleY(.91); transform-origin:center bottom; }
.ls-hero:hover .ls-hero-player--left { animation:ls-player-left 7.8s ease-in-out infinite; }
.ls-hero:hover .ls-hero-player--center { animation:ls-player-center 7.2s ease-in-out -.8s infinite; }
.ls-hero:hover .ls-hero-player--right { animation:ls-player-right 8.4s ease-in-out -1.7s infinite; }

/* Wspólny, ruchomy język graficzny głównych odnośników. */
.ls-hero-team { display:none; }
.ls-feature { overflow:hidden; box-shadow:inset 0 -9px 0 rgb(0 0 0/.22); }
.ls-feature--shop { background:#38df55; }
.ls-feature--ranks { background:#37a9e5; }
.ls-feature--map { background:#ffc846; }
.ls-feature .ls-card-pattern,
.ls-feature .ls-card-ridge,
.ls-feature .ls-voxel-ribbon,
.ls-feature .ls-feature__icon { display:none; }
.ls-feature-pattern { position:absolute; z-index:0; inset:-104px -180px; background-repeat:repeat; background-size:180px 104px; image-rendering:pixelated; pointer-events:none; will-change:transform; animation:ls-feature-pattern-drift 12s linear infinite; }
.ls-feature-pattern--money { background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxODAiIGhlaWdodD0iMTA0IiB2aWV3Qm94PSIwIDAgMTgwIDEwNCIgc2hhcGUtcmVuZGVyaW5nPSJjcmlzcEVkZ2VzIj48cmVjdCB3aWR0aD0iMTgwIiBoZWlnaHQ9IjEwNCIgZmlsbD0iIzM4ZGY1NSIvPjxnIG9wYWNpdHk9Ii4yOCI+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoOCA4KSByb3RhdGUoLTggNDIgMjUpIj48cmVjdCB3aWR0aD0iODQiIGhlaWdodD0iNTAiIGZpbGw9IiMwODdmMzIiLz48cmVjdCB4PSI2IiB5PSI2IiB3aWR0aD0iNzIiIGhlaWdodD0iMzgiIGZpbGw9IiM2NWYwNzgiLz48cmVjdCB4PSIxMyIgeT0iMTIiIHdpZHRoPSI1OCIgaGVpZ2h0PSIyNiIgZmlsbD0iIzIwYjk0NyIvPjxyZWN0IHg9IjM0IiB5PSIxNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjIyIiBmaWxsPSIjOWFmZjlkIi8+PHJlY3QgeD0iMzgiIHk9IjE4IiB3aWR0aD0iOCIgaGVpZ2h0PSIxNCIgZmlsbD0iIzA4N2YzMiIvPjxyZWN0IHg9IjQiIHk9IjE4IiB3aWR0aD0iNyIgaGVpZ2h0PSIxNCIgZmlsbD0iIzA4N2YzMiIvPjxyZWN0IHg9IjczIiB5PSIxOCIgd2lkdGg9IjciIGhlaWdodD0iMTQiIGZpbGw9IiMwODdmMzIiLz48L2c+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAxIDUzKSByb3RhdGUoOSAzOCAyMSkiPjxyZWN0IHdpZHRoPSI3NiIgaGVpZ2h0PSI0NCIgZmlsbD0iIzBhOTQzOCIvPjxyZWN0IHg9IjYiIHk9IjYiIHdpZHRoPSI2NCIgaGVpZ2h0PSIzMiIgZmlsbD0iIzcyZjE4NCIvPjxyZWN0IHg9IjEyIiB5PSIxMSIgd2lkdGg9IjUyIiBoZWlnaHQ9IjIyIiBmaWxsPSIjMjRjMzRjIi8+PHJlY3QgeD0iMzAiIHk9IjEyIiB3aWR0aD0iMTYiIGhlaWdodD0iMjAiIGZpbGw9IiNhNmZmYTgiLz48cmVjdCB4PSIzNSIgeT0iMTYiIHdpZHRoPSI2IiBoZWlnaHQ9IjEyIiBmaWxsPSIjMDg3ZjMyIi8+PC9nPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDExOSAtMTgpIHJvdGF0ZSgxMyAzMyAyMCkiPjxyZWN0IHdpZHRoPSI2OCIgaGVpZ2h0PSI0MiIgZmlsbD0iIzBiOGIzNiIvPjxyZWN0IHg9IjYiIHk9IjYiIHdpZHRoPSI1NiIgaGVpZ2h0PSIzMCIgZmlsbD0iIzViZWE3MiIvPjxyZWN0IHg9IjI1IiB5PSI4IiB3aWR0aD0iMTgiIGhlaWdodD0iMjYiIGZpbGw9IiMxNmFkNDIiLz48L2c+PC9nPjwvc3ZnPg=="); }
.ls-feature-pattern--ranks { background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxODAiIGhlaWdodD0iMTA0IiB2aWV3Qm94PSIwIDAgMTgwIDEwNCIgc2hhcGUtcmVuZGVyaW5nPSJjcmlzcEVkZ2VzIj48ZyBmaWxsPSIjMDg3ZWI3IiBvcGFjaXR5PSIuMyI+PHBhdGggZD0iTTEyIDIyaDh2MTBoMTJWMThoMTJ2MTRoMTJWMjJoOHYzOEgxMnptOCA0NGgzNnY4SDIweiIvPjxwYXRoIGQ9Ik0xMDggNDZoOHYxMGgxMlY0MmgxMnYxNGgxMlY0Nmg4djM4aC01MnptOCA0NGgzNnY4aC0zNnoiLz48L2c+PC9zdmc+"); }
.ls-feature-pattern--map { background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxODAiIGhlaWdodD0iMTA0IiB2aWV3Qm94PSIwIDAgMTgwIDEwNCIgc2hhcGUtcmVuZGVyaW5nPSJjcmlzcEVkZ2VzIj48ZyBmaWxsPSIjYmQ4MDAwIiBvcGFjaXR5PSIuMyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMTAgMjBsMjAtOCAyMiA4IDIyLTh2NTJsLTIyIDgtMjItOC0yMCA4em04IDZ2MzRsMTItNVYyMXptMjAtM3YzNGwxNCA1VjI4em0yMiA1djM0bDYtM1YyNXoiLz48cGF0aCBkPSJNMTI2IDM2aDE2djhoOHYxNmgtOHY4aC04djEyaC04VjY4aC04di04aC04VjQ0aDE2em0wIDh2MTZoMTZWNDR6Ii8+PC9nPjwvc3ZnPg=="); }
.ls-feature .ls-feature__copy { z-index:2; align-self:center; margin:auto; text-align:center; }
.ls-feature .ls-feature__copy strong { font-family:inherit; font-size:clamp(1.25rem,2.2vw,1.9rem); letter-spacing:0; text-shadow:0 3px 0 rgb(0 0 0/.2); }
.ls-feature .ls-feature__arrow { z-index:2; }
@keyframes ls-feature-pattern-drift { to { transform:translate(180px,104px); } }
@media (prefers-reduced-motion:reduce) { .ls-feature-pattern { animation:none; } }

.ls-community-card { min-height:132px; box-shadow:inset 0 -7px 0 rgb(0 0 0/.2); transition:translate .3s cubic-bezier(.22,1,.36,1),filter .28s ease,box-shadow .3s ease; }
.ls-community-card::after,
.ls-community-card > i,
.ls-community-card .ls-card-pattern,
.ls-community-card .ls-card-ridge { display:none; }
.ls-community-card--discord { background:#5865f2; }
.ls-community-card--video { background:#ff2d36; }
.ls-community-card--server { background:#43d85c; }
.ls-community-pattern { position:absolute!important; z-index:0!important; inset:-96px -168px; background-repeat:repeat; background-size:168px 96px; image-rendering:pixelated; pointer-events:none; will-change:transform; opacity:.9; animation:ls-community-pattern-drift 13s linear infinite; transition:opacity .3s ease, filter .3s ease; }
.ls-community-pattern--discord { background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNjgiIGhlaWdodD0iOTYiIHZpZXdCb3g9IjAgMCAxNjggOTYiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyI+PGcgZmlsbD0iIzMxM2JiOCIgb3BhY2l0eT0iLjMiPjxwYXRoIGQ9Ik0xMiAyNGgxMnYtOGgyOHY4aDEydjQwSDUydjhIMjR2LThIMTJ6bTE2IDE2djEyaDhWNDB6bTIwIDB2MTJoOFY0MHoiLz48cGF0aCBkPSJNOTggNDhoMTBWMzZoMzR2MTJoMTB2MzBoLTEydi04aC0zMHY4SDk4em0xOCA0djEwaDhWNTJ6bTE4IDB2MTBoOFY1MnoiLz48L2c+PC9zdmc+"); }
.ls-community-pattern--youtube { background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNjgiIGhlaWdodD0iOTYiIHZpZXdCb3g9IjAgMCAxNjggOTYiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyI+PGcgZmlsbD0iI2JkMTExYyIgb3BhY2l0eT0iLjI4Ij48cGF0aCBkPSJNMTAgMThoNjJ2MTBoOHYzNmgtOHYxMEgxMFY2NEgyVjI4aDh6bTI0IDE2djI0bDIyLTEyeiIvPjxwYXRoIGQ9Ik0xMDggOGg0OHY4aDh2MzBoLTh2OGgtNDh2LThoLThWMTZoOHptMTYgMTR2MjBsMjAtMTB6Ii8+PHBhdGggZD0iTTEwMiA2OGg0MnY4aDh2MThoLTU4Vjc2aDh6bTE0IDR2MThsMTctOXoiLz48L2c+PC9zdmc+"); }
.ls-community-pattern--server { background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNjgiIGhlaWdodD0iOTYiIHZpZXdCb3g9IjAgMCAxNjggOTYiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyI+PGcgZmlsbD0iIzIxOGQyZCIgb3BhY2l0eT0iLjI4Ij48cGF0aCBkPSJNMTggMTRoNDZ2MTJIMzB2MzhoLTEyem0xNCAxNmg0OHY1MkgzMnptMTAgMTB2MzJoMjhWNDB6Ii8+PHBhdGggZD0iTTEwOCAxOGg0MHYxMGgtMzB2MzJoLTEwem0xMiAxNGgzOHY0NGgtMzh6bTkgOXYyNmgyMFY0MXoiLz48L2c+PC9zdmc+"); }
.ls-community-card strong { position:relative; z-index:3; font-size:clamp(.9rem,1.5vw,1.15rem); letter-spacing:.02em; text-shadow:0 3px 0 rgb(0 0 0/.24); transition:transform .28s cubic-bezier(.22,1,.36,1), text-shadow .28s ease; }
@keyframes ls-community-pattern-drift { to { transform:translate(168px,96px); } }
@media (prefers-reduced-motion:reduce) { .ls-community-pattern { animation:none; } }

.ls-shop-pixels { position:absolute; z-index:1; left:-3%; right:-3%; bottom:0; height:76px; display:grid; grid-template-columns:repeat(9,1fr); align-items:end; overflow:hidden; pointer-events:none; opacity:.34; transition:transform .65s cubic-bezier(.22,1,.36,1),opacity .3s ease; }
.ls-shop-pixels::after { content:''; position:absolute; left:0; right:0; bottom:0; height:28px; background:#087f38; }
.ls-shop-pixels i { position:relative; z-index:1; display:block; width:58%; height:48px; justify-self:center; background:#087f38; transform-origin:center bottom; animation:ls-shop-pixel-wave 4.8s ease-in-out infinite alternate; }
.ls-shop-pixels i:nth-child(2n) { width:76%; height:62px; animation-delay:-1.7s; }
.ls-shop-pixels i:nth-child(3n) { width:44%; height:39px; animation-delay:-3.1s; }
.ls-shop-pixels i:nth-child(4n) { width:66%; height:54px; animation-delay:-.9s; }
.ls-feature--shop:hover .ls-shop-pixels { transform:translateX(10px); opacity:.42; }
@keyframes ls-shop-pixel-wave { from { transform:translateY(8px); } to { transform:translateY(0); } }
@media (prefers-reduced-motion:reduce) { .ls-shop-pixels i { animation:none; } }

/* Trójwarstwowe, płaskie tło kart doładowań. */
.pixel-site :is(.product-tile, .rank-matrix__rank, .rank-mobile-card__header, .rank-popup__head, .checkout-product__hero, .voucher-promo) { --topup-light:color-mix(in srgb,var(--tile-color,#069afa),white 22%); --topup-mid:var(--tile-color,#069afa); --topup-dark:color-mix(in srgb,var(--tile-color,#069afa),black 14%); background:var(--topup-dark)!important; }
.pixel-site :is(.product-tile, .rank-matrix__rank, .rank-mobile-card__header, .rank-popup__head, .checkout-product__hero, .voucher-promo).tone-pink { --topup-light:#f06be6; --topup-mid:#e83bd9; --topup-dark:#c925bd; }
.pixel-site :is(.product-tile, .rank-matrix__rank, .rank-mobile-card__header, .rank-popup__head, .checkout-product__hero, .voucher-promo).tone-blue { --topup-light:#57c2ff; --topup-mid:#159ff0; --topup-dark:#0783cd; }
.pixel-site :is(.product-tile, .rank-matrix__rank, .rank-mobile-card__header, .rank-popup__head, .checkout-product__hero, .voucher-promo).tone-brown { --topup-light:#dea163; --topup-mid:#c77e32; --topup-dark:#a75d20; }
.pixel-site :is(.product-tile, .rank-matrix__rank, .rank-mobile-card__header, .rank-popup__head, .checkout-product__hero, .voucher-promo).tone-lime { --topup-light:#b7f36c; --topup-mid:#83dd22; --topup-dark:#60b70d; }
.pixel-site :is(.product-tile, .rank-matrix__rank, .rank-mobile-card__header, .rank-popup__head, .checkout-product__hero, .voucher-promo).tone-gold { --topup-light:#ffd96b; --topup-mid:#ffba18; --topup-dark:#eb8f00; }
.pixel-site :is(.product-tile, .rank-matrix__rank, .rank-mobile-card__header, .rank-popup__head, .checkout-product__hero, .voucher-promo).tone-yellow { --topup-light:#fff07b; --topup-mid:#ffdd2e; --topup-dark:#f4b900; }
.pixel-site :is(.product-tile, .rank-matrix__rank, .rank-mobile-card__header, .rank-popup__head, .checkout-product__hero, .voucher-promo).tone-green { --topup-light:#5ae6aa; --topup-mid:#12cf82; --topup-dark:#079d62; }
.pixel-site :is(.product-tile, .rank-matrix__rank, .rank-mobile-card__header, .rank-popup__head, .checkout-product__hero, .voucher-promo).tone-cyan { --topup-light:#68d9f5; --topup-mid:#19b5df; --topup-dark:#078bad; }
/* Each layer owns one edge, so the two rows never overlap. */
.pixel-site:not(.classic-home-version) :is(.product-tile, .rank-matrix__rank, .rank-mobile-card__header, .rank-popup__head, .checkout-product__hero, .voucher-promo) { background:var(--topup-mid)!important; }
.pixel-site :is(.product-tile, .rank-matrix__rank, .rank-mobile-card__header, .rank-popup__head, .checkout-product__hero, .voucher-promo).tone-gold { --topup-light:#ffd32b; --topup-mid:#ffba10; --topup-dark:#f49b00; }
.pixel-site:not(.classic-home-version) :is(.product-tile, .rank-matrix__rank, .rank-mobile-card__header, .rank-popup__head, .checkout-product__hero, .voucher-promo)::before,
.pixel-site:not(.classic-home-version) :is(.product-tile, .rank-matrix__rank, .rank-mobile-card__header, .rank-popup__head, .checkout-product__hero, .voucher-promo)::after {
 content:""; display:block!important; position:absolute; z-index:-1; inset:auto 0; width:calc(100% + 48px); left:-24px; height:40%;
 pointer-events:none; clip-path:none; opacity:1; transform:none; border:0; min-height:0; transition:translate .8s cubic-bezier(.16,1,.3,1);
 mask-image:linear-gradient(#000,#000),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='384' height='48' viewBox='0 0 384 48'%3E%3Cpath d='M0 0H384V24H360V0H336V24H312V0H288V24H264V48H240V0H192V24H168V48H144V0H120V24H96V48H72V0H48V24H24V0H0Z' fill='black'/%3E%3C/svg%3E");
 mask-size:100% calc(100% - 47px),384px 48px; mask-position:0 0,0 100%; mask-repeat:no-repeat,repeat-x;
 animation:topup-pixel-row-a 18s linear infinite;
}
.pixel-site:not(.classic-home-version) :is(.product-tile, .rank-matrix__rank, .rank-mobile-card__header, .rank-popup__head, .checkout-product__hero, .voucher-promo)::before { top:0; bottom:auto; background:var(--topup-light); }
.pixel-site:not(.classic-home-version) :is(.product-tile, .rank-matrix__rank, .rank-mobile-card__header, .rank-popup__head, .checkout-product__hero, .voucher-promo)::after { top:auto; bottom:0; background:var(--topup-dark); transform:rotate(180deg); }
.pixel-site:not(.classic-home-version) :is(.product-tile, .rank-matrix__rank, .rank-mobile-card__header, .rank-popup__head, .checkout-product__hero, .voucher-promo):hover::before,
.pixel-site:not(.classic-home-version) :is(.product-tile, .rank-matrix__rank, .rank-mobile-card__header, .rank-popup__head, .checkout-product__hero, .voucher-promo):hover::after { animation:topup-pixel-row-a 18s linear infinite; opacity:1; }
@keyframes topup-pixel-row-a { from { mask-position:0 0,0 100%; } to { mask-position:0 0,384px 100%; } }
@media(prefers-reduced-motion:reduce) {
 .pixel-site:not(.classic-home-version) :is(.product-tile, .rank-matrix__rank, .rank-mobile-card__header, .rank-popup__head, .checkout-product__hero, .voucher-promo)::before,
 .pixel-site:not(.classic-home-version) :is(.product-tile, .rank-matrix__rank, .rank-mobile-card__header, .rank-popup__head, .checkout-product__hero, .voucher-promo)::after,
 .pixel-site:not(.classic-home-version) :is(.product-tile, .rank-matrix__rank, .rank-mobile-card__header, .rank-popup__head, .checkout-product__hero, .voucher-promo):hover::before,
 .pixel-site:not(.classic-home-version) :is(.product-tile, .rank-matrix__rank, .rank-mobile-card__header, .rank-popup__head, .checkout-product__hero, .voucher-promo):hover::after { animation:none; }
}
/* Hover separates the layers without restarting the scrolling pattern. */
.pixel-site:not(.classic-home-version) :is(.product-tile,.rank-matrix__rank,.rank-mobile-card__header,.rank-popup__head,.checkout-product__hero, .voucher-promo) { position:relative; isolation:isolate; overflow:hidden; }
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
 .pixel-site:not(.classic-home-version) :is(.product-tile,.rank-matrix__rank,.rank-mobile-card__header,.rank-popup__head,.checkout-product__hero, .voucher-promo):hover::before { translate:-10px -22px; }
 .pixel-site:not(.classic-home-version) :is(.product-tile,.rank-matrix__rank,.rank-mobile-card__header,.rank-popup__head,.checkout-product__hero, .voucher-promo):hover::after { translate:10px 22px; }
}
.pixel-site .purchase-card__avatar { border:0; border-radius:0; padding:0; background:transparent; }
/* Stop decorative work outside the viewport and in background tabs. */
.pixel-site .decoration-offscreen::before,.pixel-site .decoration-offscreen::after,
.pixel-site .decoration-offscreen :is(.ls-feature-pattern,.ls-community-pattern),
.motion-paused .pixel-site *::before,.motion-paused .pixel-site *::after,
.motion-paused .pixel-site :is(.ls-feature-pattern,.ls-community-pattern) { animation-play-state:paused!important; }
@media(max-width:420px) {
 .site-header { gap:10px; }
 .site-header .header-actions { gap:9px; margin-left:auto; margin-right:6px; }
 .site-header .angle-button { width:38px; height:42px; flex-basis:38px; }
 .site-header .site-brand img { width:54px; height:60px; }
 .site-header .server-status { font-size:.7rem!important; gap:5px; }
}

/* App launch announcement between the main shortcuts and rank showcase. */
.ls-app-launch { position:relative; display:flex; align-items:center; gap:30px; overflow:hidden; padding:22px 32px; margin:0; background:#20385f; color:#fff; text-decoration:none; clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px)); }
.ls-app-launch:hover { color:#fff; text-decoration:none; }
.ls-app-launch__preview { flex:0 0 94px; height:144px; overflow:hidden; border-radius:6px; transform:rotate(-5deg); box-shadow:0 12px 25px #0b193d55; }
.ls-app-launch__preview img { display:block; width:100%; height:auto; }
.ls-app-launch__copy { display:flex; flex-direction:column; align-items:flex-start; gap:10px; }
.ls-app-launch__badge { display:inline-flex; align-items:center; gap:7px; padding:6px 9px; background:#dff8d6; color:#21552c; font-size:.6rem; font-weight:900; letter-spacing:.06em; }
.ls-app-launch__copy strong { color:#fff; font-size:clamp(1.15rem,2vw,1.7rem); font-weight:900; line-height:1.2; }
.ls-app-launch__copy>span:last-child { font-size:.78rem; color:#d6e1f2; line-height:1.5; }
.ls-app-launch__cta { display:flex; align-items:center; justify-content:center; gap:18px; flex-shrink:0; margin-left:auto; padding:16px 20px; background:#ffcf32; color:#20385f; font-size:.78rem; font-weight:900; transition:background .25s; }
.ls-app-launch__cta i { transition:transform .3s; }
.ls-app-launch:hover .ls-app-launch__cta { background:#ffdf70; }
.ls-app-launch:hover .ls-app-launch__cta i { transform:translateX(4px); }
.ls-app-launch:focus-visible { outline:3px solid #ffcf32; outline-offset:4px; }
@media(max-width:900px) { .ls-app-launch { display:grid; grid-template-columns:76px minmax(0,1fr); gap:16px 22px; padding:24px; } .ls-app-launch__preview { width:76px; height:130px; grid-row:1/3; } .ls-app-launch__cta { grid-column:2; margin:0; justify-self:start; padding:12px 16px; } }
@media(max-width:480px) { .ls-app-launch { gap:18px; padding:22px 18px; grid-template-columns:58px minmax(0,1fr); } .ls-app-launch__preview { width:58px; height:104px; grid-row:1; } .ls-app-launch__copy>span:last-child { font-size:.7rem; } .ls-app-launch__cta { grid-column:1/-1; justify-self:stretch; } }
@media(prefers-reduced-motion:reduce) { .ls-app-launch__cta,.ls-app-launch__cta i { transition:none; } .ls-app-launch:hover .ls-app-launch__cta i { transform:none; } }

.ls-community-card--app { background:#35cf53; }
.ls-app-tile-icon { position:absolute; right:12%; top:50%; transform:translateY(-50%) rotate(12deg); color:#168e3290; font-size:7rem; pointer-events:none; }
.ls-community-card--app strong { position:relative; z-index:1; }
.ls-app-tile-badge { position:absolute; top:14px; left:16px; padding:5px 7px; background:#e8ffe6; color:#20632b; font-size:.55rem; font-weight:900; letter-spacing:.06em; }
.pixel-site:not(.classic-home-version) .product-tile:has(:focus-visible)::before,
.pixel-site:not(.classic-home-version) .product-tile:has(:focus-visible)::after { animation-play-state:paused!important; }

.ls-community-pattern--app { background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNjgiIGhlaWdodD0iOTYiIHZpZXdCb3g9IjAgMCAxNjggOTYiPjxnIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzIxOGQyZCIgc3Ryb2tlLXdpZHRoPSI3IiBvcGFjaXR5PSIuMzIiPjxyZWN0IHg9IjE3IiB5PSI5IiB3aWR0aD0iMzUiIGhlaWdodD0iNjEiIHJ4PSIzIi8+PHJlY3QgeD0iMTAzIiB5PSIyOCIgd2lkdGg9IjMwIiBoZWlnaHQ9IjU0IiByeD0iMyIvPjxwYXRoIGQ9Ik0yOSA2MGgxMU0xMTMgNzJoMTAiLz48L2c+PC9zdmc+"); }

/* Keep the app title centered independently of its hover caption. */
.pixel-site .ls-community-card--app { display:flex; justify-content:center; align-items:center; }
.pixel-site .ls-community-card--app strong { position:absolute; top:50%; left:50%; margin:0; transform:translate(-50%,-50%); }
.pixel-site .ls-community-card--app .ls-app-tile-badge { position:absolute; inset:auto; top:calc(50% + 23px); left:50%; margin:0; white-space:nowrap; opacity:0; transform:translate(-50%,6px); transition:opacity .25s ease,transform .35s cubic-bezier(.22,1,.36,1); pointer-events:none; }
.pixel-site .ls-community-card--app:is(:hover,:focus-visible) .ls-app-tile-badge { opacity:1; transform:translate(-50%,0); }
@media(prefers-reduced-motion:reduce) { .pixel-site .ls-community-card--app .ls-app-tile-badge { transition:none; } }

/* Keep link hit areas still: only their contents respond to hover/touch. */
.pixel-site .ls-home :is(.ls-feature, .ls-community-card) {
    transform: none;
    translate: none;
    animation: none;
    filter: none;
    color: #fff;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    transition: box-shadow .3s ease;
}
.pixel-site .ls-feature__copy {
    transform: translateY(0);
    transition: transform .45s cubic-bezier(.22,1,.36,1);
}
.pixel-site .ls-home :is(.ls-feature, .ls-community-card):focus-visible {
    outline: 3px solid #20385f;
    outline-offset: -5px;
}
@media (hover: hover) and (pointer: fine) {
    .pixel-site .ls-feature:is(:hover, :focus-visible) .ls-feature__copy { transform: translateY(-4px); }
    .pixel-site .ls-home :is(.ls-feature, .ls-community-card):is(:hover, :focus-visible) {
        box-shadow: inset 0 -7px 0 rgb(0 0 0 / 24%), inset 0 0 0 2px rgb(255 255 255 / 20%);
    }
    .pixel-site .ls-home :is(.ls-feature, .ls-community-card):is(:hover, :focus-visible) :is(.ls-feature-pattern, .ls-community-pattern) {
        animation-play-state: paused;
    }
    .pixel-site .ls-community-card:not(.ls-community-card--app):is(:hover, :focus-visible) strong { transform: translateY(-3px); }
}
@media (hover: none), (pointer: coarse) {
    .pixel-site .ls-home :is(.ls-feature, .ls-community-card):active { box-shadow: inset 0 0 0 3px rgb(255 255 255 / 55%), inset 0 -7px 0 rgb(0 0 0 / 20%); }
    .pixel-site .ls-feature:hover::before { transform: none; }
    .pixel-site .ls-feature:hover .ls-feature__arrow { transform: none; background: transparent; color: inherit; }
    .pixel-site .ls-community-card--app .ls-app-tile-badge { opacity: 1; transform: translate(-50%,0); }
    .pixel-site .ls-home :is(.ls-feature-pattern, .ls-community-pattern) { animation-duration: 24s; }
}
@media (prefers-reduced-motion: reduce) {
    .pixel-site .ls-home :is(.ls-feature__copy, .ls-community-card strong, .ls-feature__arrow) { transition: none; }
    .pixel-site .ls-feature:is(:hover, :focus-visible) .ls-feature__copy,
    .pixel-site .ls-community-card:not(.ls-community-card--app):is(:hover, :focus-visible) strong { transform: none; }
}

/* Desktop depth: independent translate keeps the paused pattern at its current frame. */
.ls-card-glow { display: none; pointer-events: none; }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .pixel-site .ls-home .ls-card-glow {
        display: block; position: absolute; z-index: 1; inset: -40%;
        background: radial-gradient(ellipse at center, rgb(255 255 255 / 28%), transparent 58%);
        opacity: 0;
        transform: translate(calc(var(--card-x, 0) * 18%), calc(var(--card-y, 0) * 18%));
        transition: opacity .4s ease, transform .65s cubic-bezier(.22,1,.36,1);
    }
    .pixel-site .ls-home :is(.ls-feature, .ls-community-card):is(:hover, :focus-visible) .ls-card-glow { opacity: 1; }
    .pixel-site .ls-home :is(.ls-feature-pattern, .ls-community-pattern) {
        translate: 0 0;
        transition: translate .65s cubic-bezier(.22,1,.36,1);
    }
    .pixel-site .ls-home :is(.ls-feature, .ls-community-card):hover :is(.ls-feature-pattern, .ls-community-pattern) {
        translate: calc(var(--card-x, 0) * -12px) calc(var(--card-y, 0) * -9px);
    }
    .pixel-site .ls-feature__copy {
        translate: 0 0;
        transition: transform .55s cubic-bezier(.22,1,.36,1), translate .55s cubic-bezier(.22,1,.36,1);
    }
    .pixel-site .ls-feature:is(:hover, :focus-visible) .ls-feature__copy { transform: translateY(-8px) scale(1.035); }
    .pixel-site .ls-feature:hover .ls-feature__copy { translate: calc(var(--card-x, 0) * 7px) calc(var(--card-y, 0) * 4px); }
    .pixel-site .ls-feature__arrow {
        transform: translateY(0); background: rgb(255 255 255 / 8%);
        transition: transform .5s cubic-bezier(.22,1,.36,1), background .3s ease, color .3s ease, box-shadow .3s ease;
    }
    .pixel-site .ls-feature__arrow i { transition: transform .5s cubic-bezier(.22,1,.36,1); }
    .pixel-site .ls-feature:is(:hover, :focus-visible) .ls-feature__arrow {
        transform: translate(-4px,-5px) scale(1.12); background: #fff; color: #20385f;
        box-shadow: 0 6px 14px rgb(12 25 43 / 12%);
    }
    .pixel-site .ls-feature:is(:hover, :focus-visible) .ls-feature__arrow i { transform: rotate(-35deg); }
    .pixel-site .ls-community-card strong {
        translate: 0 0;
        transition: transform .45s cubic-bezier(.22,1,.36,1), translate .55s cubic-bezier(.22,1,.36,1);
    }
    .pixel-site .ls-community-card:hover strong { translate: calc(var(--card-x, 0) * 5px) calc(var(--card-y, 0) * 3px); }
}


/* cart.css */
.cart-flight{position:fixed;z-index:10000;width:56px;height:56px;object-fit:contain;pointer-events:none;filter:drop-shadow(0 4px 5px #20385f24);will-change:transform,opacity}
.header-cart{position:relative;display:grid;place-items:center;width:44px;height:44px;color:#233d67;text-decoration:none;transition:background .2s;background:#f1f5fb}
.header-cart:hover{color:#233d67;background:#ffcf32}.header-cart__count{position:absolute;top:-6px;right:-6px;min-width:20px;height:20px;padding:0 5px;display:grid;place-items:center;background:#ffcf32;color:#20385f;font-size:.6rem;font-weight:900;border-radius:10px}.header-cart__count[hidden]{display:none}
.cart-add{display:flex;justify-content:center;align-items:center;gap:8px;padding:12px 18px;width:100%;background:#ffffff18;color:#fff;border:1px solid #ffffff60;font:inherit;font-size:.7rem;font-weight:800;cursor:pointer;transition:background .2s}
.cart-add:hover{background:#ffffff30}.cart-add:disabled{cursor:wait;opacity:.7}.cart-add-form{margin:0 22px 18px;position:relative;z-index:2}.cart-add-form--checkout{margin:16px 0;background:#263e6d}.cart-add-form--checkout .cart-add{padding:15px}
.cart-add-form [data-cart-feedback]{padding:10px 12px;margin:8px 0 0;background:#fff4dd;color:#755110;font-size:.7rem;line-height:1.6}.cart-add-form [data-cart-feedback][hidden]{display:none}
.cart-methods{padding:0;border:0;margin:0 0 22px;display:grid;gap:8px}.cart-methods legend{font-size:.75rem;font-weight:800;margin-bottom:10px}.cart-payment-form .cart-method{display:block;margin:0;cursor:pointer}.cart-payment-form .cart-method input{position:absolute;width:1px;height:1px;opacity:0;padding:0}.cart-method>span{display:flex;align-items:center;gap:10px;padding:15px 12px;background:#fff;border:2px solid #dbe3ef;font-size:.7rem;line-height:1.5}.cart-method input:checked+span{border-color:#ffcf32;background:#fff9e3}.cart-method input:focus-visible+span{outline:2px solid #233d67;outline-offset:2px}.cart-payment-form>label:not(.cart-terms){margin-top:16px}.cart-payment-form .cart-terms{display:flex;gap:10px;align-items:flex-start;margin:18px 0 0;font-weight:500;font-size:.7rem;line-height:1.6}.cart-payment-form .cart-terms input{width:17px;height:17px;flex:0 0 17px;padding:0;margin:2px 0 0;accent-color:#233d67}.cart-terms a{color:#233d67;font-weight:700}.cart-attempt-actions{display:flex;gap:20px;flex-wrap:wrap;margin-top:12px}.cart-attempt-actions a{color:#233d67;font-weight:800}
.cart-method__amount{margin-left:auto;white-space:nowrap;font-size:.65rem;font-weight:800}
.cart-retry-form{display:flex;align-items:center;flex-wrap:wrap;gap:12px 20px;margin-top:18px;padding-top:16px;border-top:1px solid #e3d5b9}.cart-retry-form label{display:flex;align-items:center;gap:9px;font-size:.75rem}.cart-retry-form input[type=checkbox]{width:17px;height:17px;accent-color:#233d67}.cart-retry-form button{border:0;background:#233d67;color:#fff;padding:12px 16px;font:inherit;font-size:.7rem;font-weight:800;cursor:pointer}.cart-retry-form small{flex-basis:100%;font-size:.65rem}.cart-retry-form button:hover{background:#355587}
.cart-page{padding:30px 0 50px;color:#233d67}.cart-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:28px 0}.cart-header p{margin:0 0 8px;text-transform:uppercase;font-size:.65rem;font-weight:800;color:#677c99}.cart-header h1{font-size:clamp(2rem,4vw,3.4rem);font-weight:900;margin:0;display:flex;align-items:center;gap:16px}.cart-header h1 span{font-size:1rem;background:#ffcf32;display:grid;place-items:center;min-width:36px;height:36px;padding:0 8px}
.cart-clear,.cart-item__remove{font:inherit;font-size:.7rem;background:none;border:0;color:#687a94;cursor:pointer;display:flex;align-items:center;gap:8px}.cart-clear:hover,.cart-item__remove:hover{color:#d94335}.cart-layout{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(290px,1fr);gap:28px;align-items:start}.cart-items{display:grid;gap:14px}.cart-item{display:flex;align-items:center;gap:20px;background:#f4f7fb;padding:20px;min-width:0}.cart-item__image{display:grid;place-items:center;width:112px;height:112px;flex-shrink:0;background:#ffcf32;overflow:hidden}.cart-item__image img{width:90px;height:90px;object-fit:contain}.cart-item__details{flex:1;min-width:0}.cart-item h2{font-size:.95rem;font-weight:900;margin:0 0 8px;overflow-wrap:anywhere}.cart-item__details p{font-size:.7rem;margin:0 0 8px;color:#687a94}.cart-item__credit{font-size:.7rem;font-weight:800;color:#398439}.cart-item__notice{font-size:.7rem;color:#ad4233}.cart-item__end{display:grid;justify-items:end;align-self:stretch;align-content:space-between;gap:20px}.cart-item__end strong{font-size:1rem;white-space:nowrap}
.cart-quantity{display:flex;align-items:center;gap:4px;margin-top:14px}.cart-quantity button{border:0;background:#e4ecf7;color:#233d67;width:30px;height:32px;font:inherit;font-weight:800;cursor:pointer}.cart-quantity button:disabled{opacity:.4;cursor:default}.cart-quantity input{width:44px;height:32px;text-align:center;border:1px solid #dbe3ef;background:white;font:inherit;font-size:.75rem;color:#233d67;appearance:textfield}.cart-quantity input::-webkit-inner-spin-button{appearance:none}.cart-quantity .cart-quantity__save{width:auto;padding:0 10px;font-size:.65rem;margin-left:5px;background:#fff}.cart-continue{display:flex;align-items:center;justify-content:center;gap:10px;padding:18px;color:#233d67;background:#eef3fb;font-size:.75rem;font-weight:800;text-decoration:none}.cart-continue:hover{background:#e4ecf7}
.cart-summary{background:#f4f7fb;padding:24px;position:sticky;top:20px}.cart-summary__heading{background:#263e6d;color:#fff;margin:-24px -24px 20px;padding:24px;border-bottom:5px solid #ffcf32}.cart-summary__heading>i{color:#ffcf32;font-size:1.5rem}.cart-summary h2{font-size:1.3rem;font-weight:900;margin:14px 0 7px}.cart-summary__heading p{font-size:.75rem;margin:0;color:#ccd9ef}.cart-summary dl{margin:0}.cart-summary dl>div{display:flex;justify-content:space-between;gap:10px;font-size:.75rem;padding:10px 0}.cart-summary dd{margin:0;font-weight:800}.cart-total{border-top:1px solid #dce5f0;margin-top:14px;padding-top:20px;display:flex;align-items:center;justify-content:space-between;gap:10px}.cart-total>span{font-size:.8rem;font-weight:700}.cart-total>strong{font-size:1.7rem;font-weight:900}.cart-total small{font-size:.8rem}.cart-payment-form{margin-top:22px}.cart-payment-form label{display:block;font-size:.75rem;font-weight:800;margin-bottom:9px}.cart-payment-form input{box-sizing:border-box;width:100%;border:1px solid #d1ddec;background:#fff;font:inherit;font-size:.85rem;padding:14px;color:#233d67}.cart-pay{display:flex;justify-content:center;align-items:center;gap:12px;border:0;border-bottom:5px solid #b28a0c;background:#ffcf32;color:#20385f;padding:17px 18px;font:inherit;font-weight:900;font-size:.8rem;text-decoration:none;cursor:pointer;margin-top:16px;width:100%;box-sizing:border-box;transition:background .2s}.cart-pay:hover{background:#ffdc62;color:#20385f}.cart-pay:disabled{opacity:.45;cursor:default}.cart-summary__note{font-size:.65rem;line-height:1.8;color:#657994;margin:15px 0 0}.cart-empty{text-align:center;padding:65px 20px;background:#f4f7fb}.cart-empty>span{display:grid;place-items:center;width:90px;height:90px;margin:0 auto;background:#ffcf32;font-size:2rem}.cart-empty h2{font-weight:900;margin:24px 0 12px}.cart-empty p{font-size:.85rem;color:#657994}.cart-empty .cart-pay{max-width:260px;margin:25px auto 0}.cart-warning{background:#fff4dd;padding:18px;font-size:.8rem;line-height:1.7;margin-bottom:20px;color:#755110}.cart-warning>i{margin-right:8px}
@media(max-width:950px){.cart-layout{grid-template-columns:1fr}.cart-summary{position:static}.cart-item__details{flex:1}}
@media(max-width:600px){.header-cart{width:34px;height:34px;font-size:.8rem}.header-cart__count{top:-5px;right:-4px;min-width:17px;height:17px;font-size:.55rem}.cart-header{align-items:flex-start}.cart-header h1{font-size:2rem}.cart-clear{font-size:.6rem}.cart-item{flex-wrap:wrap;gap:14px;padding:15px}.cart-item__image{width:80px;height:90px}.cart-item__image img{width:70px;height:70px}.cart-item__details{flex-basis:calc(100% - 100px)}.cart-item__end{width:100%;display:flex;align-items:center;justify-content:space-between;padding-top:12px;border-top:1px solid #dce5f0}.cart-summary{padding:20px}.cart-summary__heading{margin:-20px -20px 20px}.cart-add-form{margin-inline:18px}.cart-add-form--checkout{margin-inline:0}}
/* The drawer shares the shop's navy and gold palette. */
.pixel-site .cart-add-form--tile{margin:0;min-width:0}.pixel-site .cart-add-form--tile .cart-add{white-space:normal;line-height:1.4;font-size:.65rem;gap:7px;padding:10px 12px}
.cart-drawer{box-sizing:border-box;position:fixed;inset:0 0 0 auto;margin:0;width:min(460px,100%);height:100dvh;max-width:100%;max-height:100dvh;border:0;border-left:5px solid #ffcf32;padding:0;background:#f4f7fb;color:#233d67;box-shadow:-12px 0 60px #0b203533;overflow:hidden}
.cart-drawer[open]{display:flex;flex-direction:column;animation:cart-slide-in .32s cubic-bezier(.2,.8,.2,1)}.cart-drawer::backdrop{background:#0b203585;animation:cart-backdrop-in .25s ease}.cart-drawer.is-closing{animation:cart-slide-out .22s ease-in forwards}.cart-drawer.is-closing::backdrop{animation:cart-backdrop-out .22s ease-in forwards}
.cart-drawer__header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:25px 24px;background:#263e6d;color:#fff;flex-shrink:0}.cart-drawer__header h2{display:flex;align-items:center;gap:12px;margin:0;font-size:1.15rem;font-weight:900}.cart-drawer__header h2>i{color:#ffcf32}.cart-drawer__header h2>span{display:grid;place-items:center;min-width:24px;height:24px;background:#ffcf32;color:#233d67;font-size:.7rem}.cart-drawer__header h2>span[hidden]{display:none}.cart-drawer__header button{border:0;width:36px;height:36px;background:#ffffff14;color:white;font-size:1rem;cursor:pointer}.cart-drawer__header button:hover{background:#ffffff30}
.cart-drawer__notice{padding:15px 24px;background:#e6f5dc;border-bottom:1px solid #cde5bc;color:#34722b;font-size:.8rem;font-weight:800;flex-shrink:0}.cart-drawer__notice.is-error{background:#fff0de;color:#8c452b}.cart-drawer__notice[hidden]{display:none}.cart-drawer__body{overflow-y:auto;overscroll-behavior:contain;flex:1;min-height:0;display:flex;flex-direction:column}.cart-drawer__items{padding:20px 20px 6px;display:grid;gap:12px}.drawer-item{display:flex;align-items:flex-start;gap:14px;background:white;padding:18px 14px;position:relative}.drawer-item>img{width:74px;height:74px;object-fit:contain;flex-shrink:0;background:#ffcf321a}.drawer-item__details{min-width:0;flex:1}.drawer-item h3{font-weight:900;font-size:.85rem;margin:0 22px 7px 0;overflow-wrap:anywhere}.drawer-item p{font-size:.7rem;margin:0 0 8px;color:#70819a}.drawer-item strong{font-size:.85rem}.drawer-item .cart-quantity{gap:4px;flex-wrap:wrap;margin-top:12px}.drawer-item .cart-quantity__save{font-size:.6rem;margin-left:0}.drawer-remove-form{position:absolute;right:9px;top:9px}.drawer-remove-form button{border:0;background:none;color:#8a98ab;width:26px;height:26px;cursor:pointer}.drawer-remove-form button:hover{color:#d94335}.cart-drawer__footer{margin-top:auto;padding:22px 24px calc(22px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid #e0e7f1;position:sticky;bottom:0;flex-shrink:0}.cart-drawer__credit{display:flex;align-items:center;gap:8px;font-size:.7rem;margin-bottom:16px;color:#547653}.cart-drawer__credit strong{margin-left:auto}.cart-drawer__total{display:flex;align-items:center;justify-content:space-between;gap:10px;font-weight:800;font-size:.8rem}.cart-drawer__total>strong{font-size:1.6rem}.cart-drawer__total small{font-size:.8rem}.cart-drawer__continue{display:block;width:100%;background:none;border:0;color:#687b96;font:inherit;font-size:.7rem;margin-top:16px;cursor:pointer}.cart-drawer__continue:hover{color:#233d67}.cart-drawer__empty{text-align:center;margin:auto;padding:45px 24px}.cart-drawer__empty>i{display:grid;place-items:center;margin:auto;background:#ffcf32;width:90px;height:90px;font-size:2rem}.cart-drawer__empty h3{font-weight:900;margin-top:24px}.cart-drawer__empty p{font-size:.8rem;color:#70819a}.cart-drawer__empty button{background:#263e6d;color:white;padding:16px 20px;border:0;font:inherit;font-size:.75rem;font-weight:800;cursor:pointer;margin-top:18px}.cart-drawer__loading{padding:35px 24px;font-size:.85rem}.cart-drawer :focus-visible{outline:3px solid #ffcf32;outline-offset:3px}.cart-drawer[aria-busy=true] .cart-drawer__items{opacity:.65}
@keyframes cart-slide-in{from{transform:translateX(100%)}to{transform:translateX(0)}}@keyframes cart-slide-out{to{transform:translateX(100%)}}@keyframes cart-backdrop-in{from{opacity:0}to{opacity:1}}@keyframes cart-backdrop-out{to{opacity:0}}
@media(max-width:380px){.cart-drawer__header{padding:20px 16px}.cart-drawer__items{padding:14px 10px}.drawer-item{gap:10px;padding:16px 10px}.drawer-item>img{width:58px;height:58px}.drawer-item .cart-quantity button{width:27px}.drawer-item .cart-quantity__save{width:auto;padding:0 6px}.cart-drawer__footer{padding-inline:16px}.pixel-site .cart-add-form--tile .cart-add{font-size:.6rem}}
@media(prefers-reduced-motion:reduce){.cart-drawer[open],.cart-drawer::backdrop,.cart-drawer.is-closing,.cart-drawer.is-closing::backdrop{animation:none}}
.cart-rank-note{font-size:.7rem;color:#677c99;line-height:1.5;margin:0;padding:4px 0}.cart-drawer .cart-rank-note{padding:8px 22px}.cart-rewards{display:grid;grid-template-columns:1fr 1fr;gap:8px;background:#eef3fa;padding:14px}.cart-reward{display:flex;align-items:center;gap:8px;font-size:.7rem;color:#64778f}.cart-reward>i:first-child{color:#be8a14;font-size:1rem}.cart-reward span{font-weight:800}.cart-reward small{display:block;font-weight:500;font-size:.65rem;margin-top:3px}.cart-reward.is-reached{color:#398238}.cart-reward>i:last-child:not(:first-child){font-size:.65rem;margin-left:auto}.cart-rewards>p{grid-column:1/-1;margin:4px 0 0;font-size:.7rem;color:#627690}.cart-drawer .cart-rewards{margin:8px 20px}.cart-upgrade{display:flex;flex-wrap:wrap;align-items:center;gap:14px;justify-content:space-between;background:#fff8df;border-left:4px solid #ffcf32;padding:16px;margin:0;color:#233d67}.cart-upgrade>div{flex:1;min-width:160px}.cart-upgrade strong{font-size:.8rem}.cart-upgrade p{font-size:.7rem;margin:6px 0}.cart-upgrade span{font-size:.7rem;font-weight:800;color:#3b7a39}.cart-upgrade .cart-add{width:auto;background:#263e6d;color:#fff;border:0;padding:11px 15px}.cart-upgrade [data-cart-feedback]{flex-basis:100%}.cart-drawer .cart-upgrade{margin:0 20px 16px}.cart-summary__heading h2{margin:0;font-size:1.05rem}.cart-summary__heading{padding:18px 24px}.cart-summary dl>div{padding:6px 0}.cart-payment-form input{padding:11px 12px}.cart-method>span{padding:12px}.cart-total{padding-top:14px}.cart-payment-form{margin-top:17px}.cart-drawer__footer{position:static}.cart-drawer__body>.cart-drawer__footer{margin-top:auto}

.cart-discount-saving[hidden]{display:none}


/* compact-screens.css */
/* Keep smaller screens compact without shrinking readable text or touch targets. */
@media (max-width:1600px), (max-height:900px){
 .pixel-site .site-header{min-height:82px}.pixel-site .product-shop__header{padding:18px 0 22px}.pixel-site .product-shop__back{margin-bottom:14px}
 .pixel-site .product-tile,.pixel-site .product-tile:nth-child(n+7){min-height:280px;padding:14px}.pixel-site .product-tile__visual{min-height:115px}.pixel-site .product-tile--featured .product-tile__visual{min-height:125px;padding-top:14px}.pixel-site .product-tile__image,.pixel-site .product-tile:nth-child(n+7) .product-tile__image{height:110px;width:min(55%,130px)}.pixel-site .product-tile__offer{min-height:85px;padding:10px 5px}.pixel-site .product-tile__price{font-size:2rem}.pixel-site .product-tile .topup-bonus{padding:6px 10px;font-size:.65rem;margin-top:7px}.pixel-site .product-tile__footer{padding-top:10px}
 .pixel-site .ranks-wrap{margin-top:28px}.pixel-site .rank-card__header{padding:18px}.pixel-site .rank-card__name{font-size:1.6rem}.pixel-site .rank-card__body{padding:16px}.pixel-site .rank-card__image{max-height:155px;object-fit:contain}.pixel-site .ls-rank-showcase{height:305px}
 .pixel-site .cart-page{padding-top:18px}.pixel-site .cart-header{margin:16px 0}.pixel-site .cart-header h1{font-size:2.3rem}.pixel-site .cart-item{padding:15px;gap:15px}.pixel-site .cart-item__image{width:86px;height:86px}.pixel-site .cart-item__image img{width:74px;height:74px}.pixel-site .cart-summary{padding:20px}.pixel-site .cart-summary__heading{margin:-20px -20px 16px;padding:16px 20px}.pixel-site .cart-quantity{margin-top:10px}.pixel-site .cart-pay{padding:14px 16px}
 .pixel-site .app-showcase--wide{padding:24px 5%;gap:35px}.pixel-site .app-showcase--wide .app-showcase__stage{width:min(100%,320px)}.pixel-site .app-showcase__aside h1{font-size:2.6rem}.pixel-site .app-showcase__aside .app-showcase__menu{margin-top:22px}
 .pixel-site .checkout-layout{gap:24px}.pixel-site .voucher-card{padding:24px}
}
@media(min-width:1000px) and (max-width:1600px){.pixel-site .product-shop__grid{grid-template-columns:repeat(3,minmax(0,1fr))}.pixel-site .product-tile,.pixel-site .product-tile:nth-child(n+7){grid-column:auto}}
@media(max-width:760px){.pixel-site .product-tile,.pixel-site .product-tile:nth-child(n+7){min-height:265px;padding:14px}.pixel-site .product-tile__visual{min-height:105px}.pixel-site .product-tile--featured .product-tile__visual{min-height:118px}.pixel-site .product-tile__image,.pixel-site .product-tile:nth-child(n+7) .product-tile__image{height:100px}.pixel-site .product-tile__offer{min-height:80px}.pixel-site .ls-rank-showcase{height:315px}.pixel-site .app-showcase--wide .app-showcase__stage{width:min(100%,280px)}.pixel-site .cart-layout{gap:18px}.pixel-site .cart-item__details{flex-basis:calc(100% - 105px)}.pixel-site .cart-drawer__header{padding:20px}.pixel-site .cart-drawer__items{padding-top:14px}.pixel-site .cart-drawer__footer{padding-top:16px}.pixel-site .cart-rewards{padding:12px}.pixel-site .app-showcase__aside h1{font-size:2rem}}
@media (max-width:1600px), (max-height:900px){
 .pixel-site .checkout-product__hero{min-height:260px;padding:18px 24px}.pixel-site .checkout-product__image{width:140px;height:130px;margin:8px auto}.pixel-site .checkout-step{padding:20px 22px;margin-bottom:12px}.pixel-site .checkout-step__heading{margin-bottom:16px}.pixel-site .checkout-product__description,.pixel-site .checkout-discount{padding:18px 22px}
 .pixel-site .voucher-promo{min-height:430px;padding:28px 32px}.pixel-site .voucher-promo__copy{margin-top:24px}.pixel-site .voucher-promo__chest{width:190px;height:165px}.pixel-site .voucher-form-panel{padding:28px 32px}.pixel-site .voucher-field+.voucher-field{margin-top:18px}
}
@media (max-width:1600px), (max-height:900px){.pixel-site .rank-card__header{min-height:165px}.pixel-site .rank-card__header h3{margin:14px 0 9px;font-size:1.65rem}.pixel-site .rank-card__price>strong{font-size:1.6rem}.pixel-site .rank-card__kit{margin-bottom:12px;min-height:38px}}


/* cart-enhancements.css */
/* Rewards and recommendation share a compact, readable layout. */
.cart-benefits,.cart-benefits.has-offer{display:grid;grid-template-columns:1fr;gap:10px;margin:0 0 20px;min-width:0}
.cart-goals{padding:16px;background:#fff;border:1px solid #d7e1ed;min-width:0}
.cart-goals__heading{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}
.cart-goals__heading>span{font-size:.82rem;font-weight:900;color:#233d67}.cart-goals__heading i{margin-right:6px;color:#a4790b}
.cart-goals__heading>small{font-size:.72rem;color:#465d7a;line-height:1.5}
.cart-goals .cart-rewards{display:grid;grid-template-columns:1fr 1fr;padding:0;margin:0;background:none;gap:10px}
.cart-goals .cart-reward{position:relative;display:flex;gap:12px;align-items:center;padding:12px;background:#f0faff;border:1px solid #b9dfef;min-width:0;color:#244764;transition:background .35s,border-color .35s}
.cart-reward__icon{position:relative;display:grid;place-items:center;width:40px;height:44px;flex-shrink:0;background:#daf2ff;color:#1381ac;font-size:1.35rem}
.cart-goals .cart-reward:nth-child(2){background:#fffae8;border-color:#edda9d}.cart-reward:nth-child(2) .cart-reward__icon{background:#ffedac;color:#a47700}
.cart-reward__check{position:absolute;right:-4px;bottom:-3px;display:grid;place-items:center;width:19px;height:19px;border:2px solid #fff;border-radius:50%;background:#3c952f;color:#fff;font-size:.55rem;opacity:0;transform:scale(.4)}
.cart-reward__content{min-width:0;flex:1}.cart-reward__content>div:first-child{display:flex;justify-content:space-between;align-items:center;gap:8px}
.cart-reward__content strong{font-size:.78rem;line-height:1.4;color:#244764}.cart-reward__content>div:first-child>span{font-size:.68rem;white-space:nowrap;font-weight:800;color:#35536f;background:#ffffffa6;padding:3px 6px}
.cart-goal-track{height:7px;background:#dbe7ed;margin:9px 0 7px;overflow:hidden}.cart-goal-track>span{display:block;height:100%;background:#3fbae9;transition:width .48s ease}.cart-reward:nth-child(2) .cart-goal-track>span{background:#e8b82d}
.cart-reward__content>small{font-size:.68rem;color:#465d7a;line-height:1.5;margin:0}
.cart-goals .cart-reward.is-reached{background:#e6f6dd;border-color:#a9d798;color:#286c26}.cart-reward.is-reached .cart-reward__icon{background:#cdecbe;color:#32842b}.cart-reward.is-reached .cart-reward__check{opacity:1;transform:scale(1)}.cart-reward.is-reached .cart-goal-track>span{background:#4a9b34}.cart-reward.is-reached .cart-reward__content strong,.cart-reward.is-reached .cart-reward__content>small,.cart-reward.is-reached .cart-reward__content>div:first-child>span{color:#286c26}.cart-reward.is-reached small i{margin-right:4px}
.cart-offer-slot{min-width:0}.cart-benefits .cart-upgrade{display:block;margin:0;padding:11px 14px;background:#fff9e6;border:1px solid #ebd58e;color:#233d67}
.cart-upgrade__badge{display:block;font-size:.7rem!important;letter-spacing:.02em;color:#735708!important;font-weight:800;margin-bottom:8px}.cart-upgrade__badge i{margin-right:5px}
.cart-benefits .cart-upgrade .cart-upgrade__row{display:flex;align-items:center;gap:12px;min-width:0}
.cart-upgrade__row>img{width:48px;height:48px;object-fit:contain;flex-shrink:0}.cart-upgrade__details{min-width:0;flex:1}.cart-benefits .cart-upgrade .cart-upgrade__details strong{display:block;font-size:.98rem;line-height:1.4;font-weight:900;color:#233d67}.cart-upgrade__details strong i{font-size:.65rem;margin:0 4px;color:#977311}.cart-upgrade__details small{display:block;font-size:.7rem;color:#34632a;margin-top:4px;line-height:1.4}
.cart-benefits .cart-upgrade .cart-add{flex-shrink:0;display:flex;align-items:center;gap:9px;background:#d5f5c4;border:1px solid #9bd376;color:#245d20;padding:10px 13px;font-size:.76rem;white-space:nowrap;width:auto}.cart-benefits .cart-upgrade .cart-add:hover{background:#c0edab}.cart-upgrade [data-cart-feedback]{margin:8px 0 0}
.cart-drawer .cart-benefits,.cart-drawer .cart-benefits.has-offer{grid-template-columns:minmax(0,1fr);margin:12px 16px 0;gap:10px}.cart-drawer .cart-goals{padding:12px}.cart-drawer .cart-goals__heading{flex-wrap:wrap;gap:5px}.cart-drawer .cart-goals .cart-rewards{grid-template-columns:1fr;gap:8px}.cart-drawer .cart-upgrade{margin:0;padding:11px 12px}.cart-drawer .cart-upgrade__row{gap:9px}.cart-drawer .cart-upgrade__row>img{width:38px;height:42px}.cart-drawer .cart-upgrade .cart-upgrade__details strong{font-size:.9rem}.cart-drawer .cart-upgrade__details small{font-size:.68rem}.cart-drawer .cart-upgrade .cart-add{padding:10px;font-size:.7rem}
.cart-confetti{position:absolute;left:32px;top:38%;width:5px;height:8px;pointer-events:none;z-index:3}
.cart-drawer .drawer-item p,.cart-page .cart-item__details p,.cart-drawer .cart-drawer__continue,.cart-page .cart-summary__note,.cart-page .cart-clear,.cart-page .cart-item__remove{color:#465d7a}.cart-drawer .drawer-remove-form button{color:#52647a}.cart-drawer .cart-drawer__credit{color:#34632a}.cart-drawer .cart-drawer__continue,.cart-page .cart-summary__note{font-size:.72rem}.cart-drawer .drawer-item p{font-size:.74rem}
.pixel-site .policy-scope{padding:14px 20px;gap:16px}.pixel-site .policy-scope__options{flex-basis:320px}.pixel-site .policy-scope__options a{min-height:42px;padding:10px 13px}.pixel-site .policy-scope__options a span{font-size:.76rem}
@media(max-width:600px){.cart-goals{padding:12px}.cart-goals__heading{flex-wrap:wrap;gap:5px}.cart-goals .cart-rewards{grid-template-columns:1fr;gap:8px}.cart-benefits{margin-bottom:16px}.cart-benefits .cart-upgrade__row{gap:8px}.cart-upgrade__row>img{width:36px;height:40px}.cart-benefits .cart-upgrade .cart-add{font-size:.7rem;padding:10px}.cart-benefits .cart-upgrade .cart-upgrade__details strong{font-size:.88rem}.pixel-site .policy-scope__options{flex-basis:auto;grid-template-columns:1fr 1fr}}
@media(max-width:350px){.cart-drawer .cart-upgrade__row>img{display:none}.cart-reward__content strong{font-size:.73rem}.cart-reward__content>div:first-child>span{padding:2px 4px}}
/* Identical fields and feedback in voucher and checkout. */
.pixel-site .voucher-form .voucher-field__input,.pixel-site .cart-payment-form .voucher-field__input{box-sizing:border-box;min-height:50px;padding:14px 14px 14px 46px;background:#f6f7fa;border:1px solid #dce1e8;border-radius:0;font-size:.85rem;line-height:1.4;color:#263e6d;transition:border-color .2s,background .2s}
.pixel-site .voucher-form .voucher-field__input:focus,.pixel-site .cart-payment-form .voucher-field__input:focus{background:#fff;outline:2px solid #069afa;outline-offset:2px;border-color:#069afa}
.pixel-site .voucher-form .voucher-field__input[aria-invalid=true],.pixel-site .cart-payment-form .voucher-field__input[aria-invalid=true]{border-color:#d74545;background:#fff5f5}
.pixel-site .voucher-form .voucher-field label,.pixel-site .cart-payment-form .voucher-field label{display:block;font-size:.75rem;font-weight:800;margin:0 0 9px}
.cart-payment-form .voucher-field{margin-top:16px}.pixel-site .cart-payment-form .cart-nick-wrap input{padding-left:63px}.cart-nick-wrap>img{position:absolute;top:50%;left:14px;transform:translateY(-50%);width:34px;height:34px;image-rendering:pixelated;background:#e4eaf3;pointer-events:none}.cart-payment-form .cart-terms{margin-top:18px}
.pixel-site .cart-drawer__notice.form-feedback{padding:12px 18px;margin:0;border-left-width:3px;font-size:.72rem;line-height:1.5}.pixel-site .form-feedback[hidden]{display:none}
.cart-item,.drawer-item{transform-origin:center;will-change:auto}
.rank-popup__cart-form{margin:0}.rank-popup__cart-form .rank-popup__option{width:100%;font:inherit;text-align:left;cursor:pointer}.rank-popup__cart-form .rank-popup__option:disabled{opacity:.6;cursor:wait}
@media(max-width:600px){.rank-popup__cart-form .rank-popup__option{flex-wrap:wrap;gap:10px}.rank-popup__cart-form .rank-popup__option-right{margin-left:auto}.rank-popup__cart-form .rank-popup__option-action{font-size:.65rem}}
@media(prefers-reduced-motion:reduce){.cart-goal-track>span,.cart-reward{transition:none}.cart-confetti{display:none}}

.pixel-site .cart-drawer__notice.form-feedback{border-bottom:0;background:#fff0f0;border-left-color:#d74545;color:#9e2c2c;font-weight:600}.pixel-site .cart-drawer__notice.form-feedback--success{background:#edfae6;border-left-color:#4aa624;color:#2d7114}

/* Shared inputs, buttons and footer; coupon uses native disclosure semantics. */
.pixel-site .voucher-form .cart-nick-wrap input{padding-left:63px;font-weight:400;letter-spacing:normal}.pixel-site .voucher-form .voucher-field__input--code{font-weight:400;letter-spacing:normal}
.pixel-site .voucher-form .voucher-submit{justify-content:center;background:#ffcf32;border-bottom:5px solid #b28a0c;padding:17px 18px;font-size:.8rem;font-weight:900;color:#20385f;line-height:1.4;margin-top:16px;cursor:pointer}.pixel-site .voucher-form .voucher-submit:hover{background:#ffdc62}.pixel-site .voucher-form .voucher-submit>i{translate:none;transform:none}
.cart-benefits .cart-upgrade .cart-upgrade__free{display:inline-block;font-size:.74rem;font-weight:800;color:#245d20;background:#e3f4d6;padding:3px 6px;margin-top:4px}.cart-drawer .cart-upgrade .cart-upgrade__free{font-size:.7rem}
.cart-discount{margin:14px 0;border-top:1px solid #dce5f0;border-bottom:1px solid #dce5f0;color:#233d67}.cart-discount>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 0;font-size:.73rem;font-weight:700;cursor:pointer;list-style:none}.cart-discount>summary::-webkit-details-marker{display:none}.cart-discount>summary>span>i{margin-right:7px;color:#916b07}.cart-discount>summary>i{font-size:.6rem;transition:rotate .2s}.cart-discount[open]>summary>i{rotate:180deg}.cart-discount>summary:focus-visible{outline:2px solid #233d67;outline-offset:3px}
.cart-discount__note{margin:0 0 12px;font-size:.7rem;line-height:1.6;color:#657a98}
.cart-discount__panel{overflow:hidden;box-sizing:border-box}.cart-discount-form{padding-bottom:14px;margin:0}.cart-discount__controls{display:flex;gap:8px}.pixel-site .cart-discount__controls input{min-width:0;width:100%;min-height:42px;padding:10px 12px;background:#f6f7fa;border:1px solid #dce1e8;color:#233d67;font:inherit;font-size:.78rem;border-radius:0}.cart-discount__controls input:focus{outline:2px solid #069afa;outline-offset:2px}.cart-discount__controls button{border:0;background:#ffcf32;color:#233d67;font:inherit;font-size:.7rem;font-weight:800;padding:10px 12px;cursor:pointer;flex-shrink:0}.cart-discount__controls button:hover{background:#ffdc62}.cart-discount-form button:disabled{opacity:.55;cursor:wait}
.cart-discount__active{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.cart-discount__active>span{display:flex;align-items:center;flex:1;flex-wrap:wrap;gap:8px;font-size:.76rem}.cart-discount__active small{background:#e3f4d6;color:#245d20;padding:4px 7px;font-size:.68rem}.cart-discount__active button{width:28px;height:28px;border:0;background:#e6ecf5;color:#233d67;cursor:pointer}.cart-discount-form .form-feedback{flex-basis:100%;font-size:.72rem;margin:10px 0 0;padding:10px 12px}.cart-discount-saving{display:flex;justify-content:space-between;gap:10px;font-size:.73rem;color:#34632a;margin-top:10px}
.pixel-site>.site-footer{display:block;margin-top:auto;padding:28px 0 20px;border-top:1px solid #dce5f0;color:#233d67;font-size:.74rem;line-height:1.7}.footer-main{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) auto;gap:24px;align-items:start}.pixel-site .footer-company{display:block;border:0;padding:0;grid-column:auto;font-size:.74rem;color:#465d7a}.pixel-site .footer-company h2,.footer-contact h2{font-size:.75rem;font-weight:800;color:#233d67;margin:0 0 8px}.pixel-site .footer-company>p{padding:0}.footer-contact>a{display:block;color:#233d67;overflow-wrap:anywhere}.footer-contact .footer-app{margin-top:10px;font-weight:700}.footer-app>i{margin-right:5px}.footer-provider{display:flex;align-items:center;gap:10px;align-self:center;font-size:.68rem;color:#465d7a}.footer-provider img{display:block;width:104px;height:27px;object-fit:contain}.footer-bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:20px;padding-top:14px;border-top:1px solid #dce5f0;font-size:.68rem;color:#465d7a}.pixel-site .footer-disclaimer{margin:0;font-size:.68rem;color:#465d7a;justify-self:auto}.footer-bottom>span{font-weight:700}.site-footer a:hover{text-decoration:underline}
@media(max-width:760px){.footer-main{grid-template-columns:1fr 1fr;gap:18px}.footer-provider{grid-column:1/-1}.footer-bottom{gap:6px;display:grid}}
@media(max-width:480px){.footer-main{grid-template-columns:1fr}.footer-provider{grid-column:auto}.pixel-site>.site-footer{padding-top:22px}.cart-benefits .cart-upgrade__row{flex-wrap:wrap}.cart-upgrade__details{flex-basis:110px}}
@media(prefers-reduced-motion:reduce){.cart-discount>summary>i{transition:none}}

.pixel-site .cart-discount__controls input[aria-invalid=true]{border-color:#d74545;background:#fff5f5}
@media(max-width:1600px),(max-height:900px){.pixel-site .voucher-form .voucher-submit{padding:14px 16px}}

/* Copy feedback stays next to the button, outside clipped decorative surfaces. */
.ip-copy-bubble { position:fixed; z-index:100010; display:grid; gap:3px; width:max-content; max-width:calc(100vw - 16px); box-sizing:border-box; padding:11px 15px; background:#233d67; color:#fff; box-shadow:0 8px 24px rgb(17 36 65/.22); pointer-events:none; font-family:Montserrat,sans-serif; animation:ip-copy-appear .18s ease-out; }
.ip-copy-bubble strong { color:#fff; font-size:.75rem; font-weight:800; line-height:1.3; }
.ip-copy-bubble strong::before { content:'✓'; color:#adf088; padding-right:7px; }
.ip-copy-bubble>span { color:#d5e6ff; font-size:.7rem; line-height:1.4; }
.ip-copy-bubble::after { content:''; position:absolute; top:-6px; left:var(--arrow-left,50%); width:12px; height:12px; background:inherit; transform:translateX(-50%) rotate(45deg); }
.ip-copy-bubble.is-above::after { top:auto; bottom:-6px; }
.ip-copy-bubble.is-error { pointer-events:auto; }
.ip-copy-bubble.is-error strong::before { content:'!'; color:#ffcf32; }
.ip-copy-bubble.is-error>span { user-select:all; }
@keyframes ip-copy-appear { from { opacity:0; translate:0 4px; } to { opacity:1; translate:0 0; } }
@media(prefers-reduced-motion:reduce) { .ip-copy-bubble { animation:none; } }

/* Required consents: quiet entrance, stronger feedback only after validation. */
.cart-required { display:inline-flex; align-items:center; gap:5px; margin-left:4px; padding:2px 6px; border-radius:3px; color:#b63c39; background:#fff0ee; font-size:.58rem; line-height:1.5; font-weight:800; white-space:nowrap; vertical-align:baseline; }
.cart-required::before { content:""; width:4px; height:4px; border-radius:50%; background:currentColor; }
.cart-terms:has(input:checked) .cart-required { color:#327343; background:#e6f3e7; }
.cart-terms input:focus-visible { outline:2px solid #159ff0; outline-offset:3px; }
.cart-terms.is-required-error .cart-required { color:#a92727; background:#ffe0dc; }
@media(prefers-reduced-motion:no-preference) {
    .cart-required { animation:cart-required-enter .5s ease-out both; }
    .cart-terms+.cart-terms .cart-required { animation-delay:.1s; }
    .cart-terms:has(input:checked) .cart-required { animation:cart-required-check .28s ease-out; }
    .cart-terms.is-required-error .cart-required { animation:cart-required-shake .4s ease-in-out; }
}
@keyframes cart-required-enter { from { opacity:0; transform:translateY(3px); } to { opacity:1; transform:none; } }
@keyframes cart-required-check { 50% { transform:scale(.95); } }
@keyframes cart-required-shake { 20%,60% { transform:translateX(-3px); } 40%,80% { transform:translateX(3px); } }


.coin-rewards{margin:0 0 22px;padding:13px 18px;background:linear-gradient(110deg,#fffaf0,#f6f8fc 65%);border:1px solid #e4e9f1;border-left:3px solid #ffcf32;color:#52657f;font-size:.72rem;line-height:1.6}
.coin-rewards>summary{display:flex;align-items:center;gap:9px;cursor:pointer;list-style:none}.coin-rewards>summary::-webkit-details-marker{display:none}.coin-rewards>summary>strong{color:#233d67;font-size:.75rem}.coin-rewards>summary>i:first-child{color:#97710c}.coin-rewards>summary>i:last-child{margin-left:auto;font-size:.6rem;transition:transform .25s}.coin-rewards[open]>summary>i:last-child{transform:rotate(180deg)}.coin-rewards>summary:focus-visible{outline:2px solid #059afa;outline-offset:5px}.coin-rewards__content{margin-top:12px;padding-top:12px;border-top:1px solid #e2e7ef;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.coin-rewards__rates{display:flex;gap:10px;flex-wrap:wrap}.coin-rewards__rates>span{display:flex;align-items:center;gap:5px;padding:5px 10px;border:1px solid #dfe6f0;background:#ffffffc9;font-size:.67rem;white-space:nowrap}.coin-rewards__rates b{font-size:1rem;color:#233d67}.coin-rewards__rates small{font-size:.61rem;background:#fff0b2;color:#685113;padding:1px 5px;margin-right:2px}
.pixel-site .coin-rewards__content>p{margin:0;font-size:.68rem;color:#52657f}.coin-rewards code{display:inline-block;padding:1px 7px;background:#e8edf6;color:#233d67;font-weight:800;font-family:inherit}
@keyframes checkout-details-enter { from { opacity:0; transform:translateY(-3px); } to { opacity:1; transform:none; } }
.checkout-preview-note { display:flex; flex-wrap:wrap; align-items:center; gap:8px 18px; margin:0 0 20px; padding:14px 18px; background:#fff6d4; border-left:4px solid #ffcf32; color:#20385f; font-size:.7rem; }.checkout-preview-note>strong { font-weight:900; }.checkout-preview-note>a { margin-left:auto; color:#20385f; text-decoration:underline; font-weight:700; }

/* Keep the keyboard skip control invisible until it receives focus. */
.pixel-site > .skip-link:not(:focus) { opacity:0; pointer-events:none; }

.cart-item__discount{display:inline-block;margin-left:6px;padding:3px 6px;background:#ffcf32;color:#20385f;font-size:.64rem}

/* The code threshold offer is deliberate, dismissible, and never adds an item on its own. */
.discount-topup{position:fixed;inset:0;margin:auto;width:min(440px,calc(100% - 28px));max-height:calc(100dvh - 28px);padding:0;border:1px solid #dce4f0;border-top:4px solid #ffcf32;background:#fff;color:#233d67;box-shadow:0 24px 90px #132d5b40;overflow:auto;overscroll-behavior:contain}
.discount-topup::backdrop{background:#152a4a88;backdrop-filter:blur(4px)}.discount-topup>div{position:relative;padding:28px}
.discount-topup__close{position:absolute;right:10px;top:10px;width:32px;height:32px;border:0;background:#f0f3f8;color:#425a7b;cursor:pointer}.discount-topup__icon{display:grid;place-items:center;width:44px;height:44px;background:#fff2ba;color:#806000;margin-bottom:18px;font-size:1.1rem}
.pixel-site .discount-topup h2{font-size:1.25rem;font-weight:900;line-height:1.4;margin:0 0 8px;color:#233d67}.pixel-site .discount-topup p{font-size:.76rem;line-height:1.7;margin:0 0 18px;color:#657791}
.discount-topup__product{display:flex;align-items:center;gap:12px;padding:14px 12px;margin:20px 0;background:#f3f6fb;border:1px solid #e2e9f3}.discount-topup__product img{object-fit:contain;max-width:64px;height:64px}.discount-topup__product>span{display:grid;gap:4px}.discount-topup__product strong{font-size:.95rem;color:#233d67}.discount-topup__product small{font-size:.65rem;color:#61738c}.discount-topup__product>b{font-size:.9rem;margin-left:auto;white-space:nowrap}
.discount-topup__add{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;border:0;padding:15px 12px;background:#ffcf32;color:#20385f;font:inherit;font-size:.75rem;font-weight:800;text-decoration:none;cursor:pointer;transition:background .2s,transform .2s}.discount-topup__add:hover{background:#ffdc62;transform:translateY(-1px)}.discount-topup__add:disabled{opacity:.7;cursor:wait;transform:none}.discount-topup__skip{display:block;margin:16px auto 0;border:0;background:none;color:#61738c;font:inherit;font-size:.68rem;cursor:pointer;text-decoration:underline;text-underline-offset:3px}.pixel-site .discount-topup .discount-topup__feedback{margin:16px 0 0;padding:10px;background:#fff0ed;color:#9d332b}
.discount-topup :is(button,a):focus-visible,.war-promo :is(button,a):focus-visible{outline:2px solid #059afa;outline-offset:3px}.discount-topup [hidden]{display:none!important}
.war-promo{display:flex;align-items:center;justify-content:center;gap:18px;padding:9px 16px!important;margin-top:0!important;margin-bottom:16px!important;border:1px solid #f1e6bc;background:linear-gradient(100deg,#fffdf7,#fff5cf 50%,#fffdf7);color:#233d67;box-sizing:border-box}
.war-promo__label{display:flex;align-items:center;gap:8px;font-size:.65rem;text-transform:uppercase;letter-spacing:.09em;font-weight:800}.war-promo__label i{color:#a27b18;font-size:.85rem}.war-promo__code{display:flex;align-items:center;gap:12px;padding:8px 14px;border:1px solid #f2c42d;background:#ffcf32;color:#233d67;font:inherit;cursor:pointer;box-shadow:0 2px 0 #d5ac25}.war-promo__code b{font-size:.8rem;letter-spacing:.08em}.war-promo__code>span{font-size:.83rem;font-weight:900;border-left:1px solid #233d6729;padding-left:12px}.war-promo__code i{font-size:.7rem;color:#4d5864}.war-promo__code.is-copied{border-color:#5b8b39;background:#e3f2d7;box-shadow:0 2px 0 #6b994a}
.war-campaign .product-shop__eyebrow{color:#8b6b19}.war-campaign .product-shop__voucher{box-shadow:inset 0 -2px #e5ba32}
@media(max-width:700px){.coin-rewards{padding:12px 14px}.coin-rewards__rates{gap:8px;width:100%}.coin-rewards__rates>span{flex:1;justify-content:center;padding:5px 7px}.war-promo{gap:12px;padding:9px 10px!important;flex-wrap:wrap}.war-promo__label{font-size:.57rem;letter-spacing:.04em;gap:6px}.war-promo__code{gap:8px;padding:7px 10px}.war-promo__code b,.war-promo__code>span{font-size:.73rem}.war-promo__code>span{padding-left:8px}.discount-topup>div{padding:24px 18px}.discount-topup__product{gap:8px}.discount-topup__product img{width:54px;height:54px}.pixel-site .discount-topup h2{font-size:1.1rem}}
@media(prefers-reduced-motion:no-preference){.discount-topup[open]{animation:discount-topup-enter .3s cubic-bezier(.2,.8,.2,1)}.coin-rewards[open] .coin-rewards__content{animation:checkout-details-enter .24s ease-out}.war-promo__code{transition:background .2s,border-color .2s}.war-promo__code:hover{background:#ffdb60;border-color:#d5ac25}}
@keyframes discount-topup-enter{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.discount-topup__add,.coin-rewards>summary>i:last-child{transition:none}.discount-topup__add:hover{transform:none}}
/* Three cumulative goals; seasonal reward retains its purple identity after unlocking. */
.cart-goals .cart-rewards{grid-template-columns:repeat(2,minmax(0,1fr))}
.cart-goals .cart-reward--halloween{grid-column:1/-1;background:linear-gradient(115deg,#f4edff,#faf6ff);border-color:#c4a1ec;padding-right:52px;overflow:hidden}
.cart-reward--halloween .cart-reward__icon{background:#e6d5fa;color:#7942b2;box-shadow:0 0 18px #b084da22}
.cart-reward--halloween .cart-reward__content strong,.cart-reward--halloween .cart-reward__content>small,.cart-reward--halloween .cart-reward__content>div:first-child>span{color:#61358a}
.cart-reward--halloween .cart-goal-track{background:#e3d7ef}.cart-reward--halloween .cart-goal-track>span{background:linear-gradient(90deg,#9960d4,#c18bec)}
.cart-reward__haunt{position:absolute;right:11px;top:50%;transform:translateY(-50%);display:grid;place-items:center;gap:4px;pointer-events:none;color:#a067ce}
.cart-reward__haunt>img{width:23px;height:23px;filter:hue-rotate(235deg) saturate(.85)}.cart-reward__haunt>span{font-size:12px}
.cart-goals .cart-reward--halloween.is-reached{background:linear-gradient(115deg,#ead9ff,#f6eeff);border-color:#aa70d8;color:#61358a}
.cart-reward--halloween.is-reached .cart-reward__icon{background:#dcc0f7;color:#7234a8}.cart-reward--halloween.is-reached .cart-goal-track>span{background:linear-gradient(90deg,#8545be,#b477e5)}
.cart-reward--halloween.is-reached .cart-reward__content strong,.cart-reward--halloween.is-reached .cart-reward__content>small,.cart-reward--halloween.is-reached .cart-reward__content>div:first-child>span{color:#61358a}
.cart-reward--halloween .cart-reward__check{background:#8045b2}
@media(prefers-reduced-motion:no-preference){.cart-reward__haunt>span{animation:cart-haunt-spark 3.5s ease-in-out infinite}.cart-reward--halloween.is-reached .cart-reward__haunt>img{animation:cart-haunt-bob 4s ease-in-out infinite}}
@keyframes cart-haunt-spark{0%,100%{opacity:.4;scale:.7;rotate:0deg}50%{opacity:1;scale:1.2;rotate:35deg}}
@keyframes cart-haunt-bob{0%,100%{translate:0 0;rotate:-6deg}50%{translate:0 -4px;rotate:6deg}}
@media(max-width:600px){.cart-goals .cart-rewards{grid-template-columns:minmax(0,1fr)}}
/* Quiet value caption, separate from the purchase threshold. */
.pixel-site .cart-reward__content>.cart-reward__worth{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px;margin:3px 0 0;padding:0;font-size:.63rem;line-height:1.5;color:#52677c;font-weight:400}
.cart-reward__worth>b{font-weight:700;font-variant-numeric:tabular-nums;color:#344f68;white-space:nowrap}
.cart-reward--halloween .cart-reward__worth>b{color:#714592}
.cart-reward.is-reached .cart-reward__worth>b{color:#35682d}.cart-reward--halloween.is-reached .cart-reward__worth>b{color:#714592}
/* Polished copy feedback, reversible bonus disclosure and a complete menu exit. */
.ip-copy-bubble{animation:none;border:1px solid #3a5275;border-bottom:3px solid #ffcf32;padding:13px 18px;gap:5px;box-shadow:0 12px 30px #152c4a26;transform-origin:var(--arrow-left,50%) 0;border-radius:5px}
.ip-copy-bubble strong{font-size:.7rem;font-weight:600;color:#e1eafb}.ip-copy-bubble>span{font-size:.88rem;font-weight:800;letter-spacing:.025em;color:#fff}
.ip-copy-bubble strong::before{display:inline-grid;place-items:center;width:17px;height:17px;padding:0;margin-right:7px;background:#b7e99922;border-radius:50%;color:#b7e999}
.coin-rewards.has-smooth-toggle{box-sizing:border-box;transition:border-color .25s,box-shadow .25s}
.coin-rewards.has-smooth-toggle.is-expanding{border-color:#dfd5b9;border-left-color:#ffcf32;box-shadow:0 4px 16px #233d6707}
.coin-rewards.has-smooth-toggle .coin-rewards__content{animation:none}
.coin-rewards.has-smooth-toggle>summary>i:last-child{transform:rotate(0);transition:transform .32s cubic-bezier(.22,.8,.25,1)}
.coin-rewards.has-smooth-toggle.is-expanding>summary>i:last-child{transform:rotate(180deg)}
@media(max-width:980px){
 .pixel-site .site-nav{display:flex;flex-direction:column;clip-path:none;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-10px) scale(.985);transform-origin:50% 0;transition:opacity .24s ease,transform .3s cubic-bezier(.22,.8,.25,1),visibility 0s linear .3s}
 .pixel-site .site-nav.is-open{visibility:visible;opacity:1;pointer-events:auto;transform:translateY(0) scale(1);transition:opacity .24s ease,transform .34s cubic-bezier(.22,.8,.25,1),visibility 0s}
 .pixel-site .site-nav .site-nav__link{transition:opacity .18s ease,transform .24s ease;transition-delay:0s}
 .pixel-site .site-nav.is-open .site-nav__link{transition-delay:calc(var(--menu-index,0)*25ms)}
}
@media(prefers-reduced-motion:reduce){.coin-rewards.has-smooth-toggle,.coin-rewards.has-smooth-toggle>summary>i:last-child,.pixel-site .site-nav,.pixel-site .site-nav .site-nav__link{transition:none!important}}
/* Keep the seasonal threshold aligned with the other price badges. */
.cart-goals .cart-reward--halloween{padding-right:12px}
.cart-reward__haunt{top:37px;right:13px;transform:none;display:flex;gap:4px;align-items:center}
.cart-reward__haunt>img{width:16px;height:16px}.cart-reward__haunt>span{font-size:9px}
.pixel-site .cart-reward--halloween .cart-reward__worth{padding-right:36px}
/* Halloween coupon prompt: local motion only, no particle overlays. */
.discount-topup { border-top:3px solid #f89435; background:#fffaf4; }
.discount-topup>div { background:radial-gradient(circle at 100% 0,#eddffb 0,transparent 55%); }
.discount-topup .discount-topup__icon { background:transparent; width:60px; height:60px; display:inline-grid; vertical-align:middle; }
.discount-topup__eyebrow { color:#82509f; font-size:11px; font-weight:900; letter-spacing:.12em; margin-left:12px; }
.discount-topup #discount-topup-title { margin:18px 0 8px; }
.discount-topup .discount-topup__missing { font-size:15px; color:#334767; margin:0 0 12px; }
.discount-topup__missing strong { color:#a34a0b; white-space:nowrap; }
.discount-topup .discount-topup__add { background:#ffc43c; border-radius:4px; }
.cart-discount__controls { flex-wrap:wrap; }
.cart-discount__controls input { min-width:100px; flex:1 1 120px; }
.cart-discount__controls .cart-code-paste { background:#edf1f7; color:#233d67; padding:0 12px; min-height:44px; }
@media(prefers-reduced-motion:no-preference) {
 .discount-topup[open] .discount-topup__icon img { animation:coupon-pumpkin .55s ease-out both; }
 @keyframes coupon-pumpkin { from { opacity:0; transform:translateY(8px) rotate(-12deg) scale(.9); } to { opacity:1; transform:none; } }
}
@media(max-width:420px) { .discount-topup>div { padding:22px 18px; } .cart-discount__controls .cart-code-paste { padding:0 9px; } }
.discount-topup { width:min(620px,calc(100vw - 24px)); max-height:calc(100dvh - 28px); overflow-y:auto; }
.discount-topup__choices { display:grid; gap:10px; margin:16px 0; }
.discount-topup__choice { border:1px solid #e5d6ed; background:#ffffffc9; padding:12px; border-radius:6px; }
.discount-topup__recommended { display:block; color:#82509f; font-weight:800; margin-bottom:6px; }
.discount-topup__choice .discount-topup__product { margin:0 0 10px; padding:0; }
.discount-topup__choice .discount-topup__product img { width:45px; height:45px; }
.discount-topup__choice .discount-topup__add { padding:10px 14px; min-height:42px; }
/* Compact coupon suggestions. */
.discount-topup { width:min(430px,calc(100vw - 24px)); }
.discount-topup>div { padding:22px; }
.discount-topup__heading { display:flex; align-items:center; gap:10px; padding-right:20px; }
.discount-topup .discount-topup__heading #discount-topup-title { font-size:17px; line-height:1.45; margin:0; }
.discount-topup__heading strong { color:#a34a0b; white-space:nowrap; }
.discount-topup__choices { gap:8px; margin:15px 0 8px; }
.discount-topup__choice { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:6px 12px; padding:10px; }
.discount-topup__recommended { grid-column:1/-1; font-size:10px; margin:0; }
.discount-topup__choice .discount-topup__product { margin:0; gap:8px; flex-wrap:wrap; }
.discount-topup__choice .discount-topup__product img { width:32px; height:32px; }
.discount-topup__choice .discount-topup__product strong { font-size:12px; }
.discount-topup__choice .discount-topup__product b { font-size:12px; }
.cart-discount__controls .cart-code-paste { flex:0 0 40px; width:40px; padding:0; }
@media(prefers-reduced-motion:no-preference){.discount-topup[open] .discount-topup__heading>img { animation:coupon-pumpkin .45s ease-out both; }}

/* Coupon dialog: readable sizing and a brief, local entrance. */
.discount-topup { width:min(490px,calc(100vw - 24px)); }
.discount-topup>div { padding:26px; }
.discount-topup .discount-topup__heading #discount-topup-title { font-size:20px; line-height:1.4; }
.discount-topup__heading>img { width:40px; height:40px; flex-shrink:0; }
.discount-topup__choice { padding:13px; gap:8px 14px; }
.discount-topup__choice .discount-topup__product strong,
.discount-topup__choice .discount-topup__product b { font-size:14px; }
.discount-topup__recommended { font-size:11px; }
.discount-topup__choice .discount-topup__add { font-size:13px; padding:12px 16px; }
.discount-topup__skip { font-size:12px; }
@media(prefers-reduced-motion:no-preference) {
 .discount-topup[open] { animation:coupon-dialog-enter .32s cubic-bezier(.16,1,.3,1) both; }
 .discount-topup[open]::backdrop { animation:coupon-backdrop-enter .25s ease-out both; }
 .discount-topup[open] .discount-topup__choice { animation:coupon-choice-enter .3s .07s ease-out both; }
 .discount-topup[open] .discount-topup__choice:nth-child(2) { animation-delay:.12s; }
 .discount-topup[open] .discount-topup__heading>img { animation:coupon-pumpkin-enter .48s cubic-bezier(.16,1,.3,1) both; }
 .discount-topup__choice .discount-topup__add { transition:background .18s,transform .18s; }
 .discount-topup__choice .discount-topup__add:active { transform:scale(.97); }
 @keyframes coupon-dialog-enter { from { opacity:0; transform:translateY(14px) scale(.97); } to { opacity:1; transform:none; } }
 @keyframes coupon-choice-enter { from { opacity:0; transform:translateY(7px); } to { opacity:1; transform:none; } }
 @keyframes coupon-backdrop-enter { from { opacity:0; } to { opacity:1; } }
 @keyframes coupon-pumpkin-enter { 0% { transform:rotate(-14deg) scale(.85); } 65% { transform:rotate(4deg) scale(1.04); } 100% { transform:none; } }
}
@media(max-width:420px) {
 .discount-topup>div { padding:23px 18px; }
 .discount-topup .discount-topup__heading #discount-topup-title { font-size:18px; }
 .discount-topup__choice { gap:8px; padding:11px; }
}
/* Match the angular rank dialog. */
.discount-topup { width:min(580px,calc(100vw - 24px)); border:0; border-bottom:5px solid #ffbb36; border-radius:0; background:white; }
.discount-topup>div { padding:0; background:none; }
.discount-topup__hero { position:relative; overflow:hidden; padding:25px 30px 23px; color:#fff; background:#f5a623; clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px)); }
.discount-topup__hero::before { content:''; position:absolute; inset:0; pointer-events:none; opacity:.25; background:repeating-linear-gradient(90deg,transparent 0 35px,#ffe8a8 35px 55px,transparent 55px 90px); mask-image:linear-gradient(#000,transparent 45%,transparent 65%,#000); }
.discount-topup__hero>img { position:absolute; right:28px; bottom:22px; opacity:.32; width:80px; height:80px; }
.discount-topup__tag { position:relative; font-size:10px; font-weight:900; }
.discount-topup .discount-topup__hero #discount-topup-title { position:relative; margin:12px 0; padding-right:50px; color:white; font-size:17px; line-height:1.35; }
.discount-topup__hero h2 strong { display:block; font-size:38px; font-weight:900; text-shadow:0 3px 0 #bd771b45; }
.discount-topup__threshold { display:inline-block; padding:5px 9px; background:#85501044; font-size:12px; font-weight:800; }
.discount-topup .discount-topup__close { z-index:2; background:#80521e40; color:white; top:12px; right:12px; }
.discount-topup__body { padding:22px 28px 16px; }
.discount-topup__steps { display:flex; align-items:center; gap:10px; margin-bottom:18px; font-size:11px; font-weight:800; }
.discount-topup__steps>span { flex:1; background:#f2f5fa; padding:10px; }
.discount-topup__steps>span:first-child { background:#fff3da; }
.discount-topup__steps b { display:inline-grid; place-items:center; background:#304c73; color:white; width:24px; height:24px; margin-right:5px; }
.discount-topup__steps>i { color:#8796ad; font-size:10px; }
.discount-topup__choice { border:1px solid #dce3ef; border-left:5px solid #ffc248; border-radius:0; background:white; padding:14px; }
.discount-topup__choice .discount-topup__add { background:transparent; color:#233d67; font-size:11px; padding:8px; border-radius:0; }
.discount-topup__choice .discount-topup__add i { background:#edf2f8; padding:9px; margin-left:5px; }
.discount-topup.is-closing { pointer-events:none; animation:coupon-dialog-exit .18s ease-in both!important; }
.discount-topup.is-closing::backdrop { animation:coupon-backdrop-exit .18s ease-in both!important; }
.discount-topup.is-closing .discount-topup__choice { animation:none!important; }
@keyframes coupon-dialog-exit { to { opacity:0; transform:translateY(8px) scale(.985); } }
@keyframes coupon-backdrop-exit { to { opacity:0; } }
@media(max-width:420px) { .discount-topup__hero { padding:22px; } .discount-topup__body { padding:16px 14px 12px; } .discount-topup__steps { gap:5px; font-size:10px; } .discount-topup__steps>span { padding:8px; } .discount-topup__choice { padding:10px; gap:6px; } }
@media(prefers-reduced-motion:reduce) { .discount-topup.is-closing,.discount-topup.is-closing::backdrop { animation:none!important; } }


/* shop-card-overlay.css */
/* One interaction layer for top-ups. The card/button hit area never moves. */
.pixel-site .product-shop .product-tile { position: relative; isolation: isolate; transform: none; }
.pixel-site .product-shop .product-tile:focus-within { outline: none; }
.pixel-site .product-shop .product-tile:has(:focus-visible) { outline: 3px solid #20385f; outline-offset: 3px; }
.pixel-site .product-shop :is(.product-tile__visual, .product-tile__offer, .product-tile__footer) {
    position: relative;
    z-index: 6;
    pointer-events: none;
}
.pixel-site .product-shop .product-tile__footer { padding-right: 60px; border-top: 0; }
.pixel-site .product-shop .product-tile__image,
.pixel-site .product-shop .product-tile:hover .product-tile__image {
    transform: none;
    scale: 1;
}
.pixel-site .product-shop :is(.product-tile__image, .product-tile__offer, .product-tile__pricing) {
    transition: transform .48s cubic-bezier(.22,1,.36,1);
}
.pixel-site .product-shop .product-tile__overlay-form { position: absolute; inset: 0; z-index: 5; margin: 0; }
.pixel-site .product-shop .product-tile__overlay-action {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #fff;
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    transition: background-color .3s ease;
}
.pixel-site .product-shop .product-tile__overlay-label {
    position: absolute;
    right: 15px;
    bottom: 15px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 4px;
    max-width: calc(100% - 30px);
    background: #fff;
    box-shadow: 0 6px 18px rgb(9 24 43 / 15%);
    color: #20385f;
    font-size: .7rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .025em;
    pointer-events: none;
    transition: opacity .25s ease, transform .4s cubic-bezier(.22,1,.36,1), background-color .25s ease;
}
.pixel-site .product-shop .product-tile__overlay-label i {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 42px;
    height: 42px;
    background: #ffcf32;
    color: #20385f;
    font-size: 1rem;
}
.pixel-site .product-shop .product-tile__overlay-label span { display: none; }
.pixel-site .product-shop .product-tile__overlay-action:active { background: rgb(12 25 43 / 10%); }
.pixel-site .product-shop .product-tile__overlay-action:active .product-tile__overlay-label { transform: scale(.95); }
.pixel-site .product-shop .product-tile__overlay-action:focus-visible { outline: 3px solid #20385f; outline-offset: -5px; }
.pixel-site .product-shop .product-tile__overlay-action:focus-visible .product-tile__overlay-label { opacity: 1; transform: none; background: #ffcf32; }
.pixel-site .product-shop .product-tile__overlay-form [data-cart-feedback]:not([hidden]) {
    position: absolute; left: 12px; right: 12px; top: 12px; bottom: auto; z-index: 7; margin: 0;
    box-shadow: 0 4px 15px rgb(0 0 0 / 18%);
}
@media (min-width: 761px) and (hover: hover) and (pointer: fine) {
    .pixel-site .product-shop .product-tile__footer { padding-right: 155px; }
    .pixel-site .product-shop .product-tile__overlay-label {
        min-height: 46px; padding: 8px 50px 8px 14px; gap: 0;
        opacity: 0; transform: translateY(8px);
        clip-path: inset(0 0 0 calc(100% - 46px));
        transition: opacity .22s ease, clip-path .5s cubic-bezier(.22,1,.36,1), transform .4s cubic-bezier(.22,1,.36,1), background-color .25s ease;
    }
    .pixel-site .product-shop .product-tile__overlay-label i {
        position: absolute; right: 4px; top: 4px; width: 38px; height: 38px;
        overflow: hidden; transition: background-color .3s ease;
    }
    .pixel-site .product-shop .product-tile__overlay-label .fa-plus::before,
    .pixel-site .product-shop .product-tile__overlay-label .fa-plus::after {
        position: absolute; inset: 0; display: grid; place-items: center;
        transition: transform .5s cubic-bezier(.22,1,.36,1), opacity .3s ease;
    }
    .pixel-site .product-shop .product-tile__overlay-label .fa-plus::after {
        content: "\f07a"; opacity: 0; transform: translateY(22px) rotate(-18deg) scale(.75);
    }
    .pixel-site .product-shop .product-tile__overlay-label span {
        display: inline; opacity: 0; transform: translateX(12px);
        transition: opacity .25s ease, transform .45s cubic-bezier(.22,1,.36,1);
    }
    .pixel-site .product-shop .product-tile__overlay-action:is(:hover, :focus-visible, .is-adding) .product-tile__overlay-label { clip-path: inset(0); opacity: 1; transform: translateY(0); }
    .pixel-site .product-shop .product-tile__overlay-action:is(:hover, :focus-visible, .is-adding) .product-tile__overlay-label span { opacity: 1; transform: translateX(0); }
    .pixel-site .product-shop .product-tile__overlay-action:is(:hover, :focus-visible) .product-tile__overlay-label .fa-plus::before { opacity: 0; transform: translateY(-22px) rotate(90deg) scale(.75); }
    .pixel-site .product-shop .product-tile__overlay-action:is(:hover, :focus-visible) .product-tile__overlay-label .fa-plus::after { opacity: 1; transform: translateY(0) rotate(0) scale(1); }
    .pixel-site .product-shop .product-tile:is(:hover, :has(:focus-visible)) .product-tile__image { transform: translateY(-6px) scale(.96); }
    .pixel-site .product-shop .product-tile:is(:hover, :has(:focus-visible)) .product-tile__offer { transform: translateY(-6px); }
    .pixel-site .product-shop .product-tile:is(:hover, :has(:focus-visible)) .product-tile__pricing { transform: translateY(-2px); }
    .pixel-site .product-shop .product-tile__overlay-action:hover { background: rgb(12 25 43 / 12%); }
    .pixel-site .product-shop .product-tile__overlay-action:hover .product-tile__overlay-label { opacity: 1; transform: translateY(0); }
    .pixel-site:not(.classic-home-version) .product-tile:hover::before,
    .pixel-site:not(.classic-home-version) .product-tile:hover::after { animation-play-state: paused !important; }
}
@media (hover: none), (pointer: coarse) {
    /* Keep mobile scrolling cheap and avoid emulated/sticky hover. */
    .pixel-site:not(.classic-home-version) .product-tile::before,
    .pixel-site:not(.classic-home-version) .product-tile::after { animation: none; translate: none; }
}
/* Busy feedback occupies its own row, never the price. */
.cart-add.is-adding { cursor: progress; }
.pixel-site .product-shop .product-tile__overlay-action.is-adding { opacity: 1; background: rgb(12 25 43 / 12%); }
.pixel-site .product-shop .product-tile__overlay-action.is-adding .product-tile__overlay-label { opacity: 1; transform: none; }
.pixel-site .product-shop .product-tile__overlay-action.is-adding .product-tile__overlay-label span { display: inline; }
.pixel-site .product-shop .product-tile__overlay-action.is-adding .product-tile__overlay-label i { background: transparent; }
@media (max-width: 760px), (hover: none), (pointer: coarse) {
    .pixel-site .product-shop .product-tile__overlay-action.is-adding .product-tile__overlay-label {
        bottom: 15px; right: 15px; max-width: calc(100% - 125px); min-height: 50px;
        padding: 4px 10px 4px 4px; overflow: hidden; box-sizing: border-box;
        transform-origin: right bottom; animation: cart-label-touch .24s ease-out;
    }
    .pixel-site .product-shop .product-tile__overlay-action.is-adding .product-tile__overlay-label span { min-width: 0; overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) {
    .pixel-site .product-shop :is(.product-tile__overlay-action, .product-tile__overlay-label, .product-tile__image, .product-tile__offer, .product-tile__pricing) { transition: none; }
    .pixel-site .product-shop .product-tile:is(:hover, :has(:focus-visible)) :is(.product-tile__image, .product-tile__offer, .product-tile__pricing) { transform: none; }
    .cart-add.is-adding .fa-spin { animation: none; }
}

@media (prefers-reduced-motion: no-preference) {
    .pixel-site .product-shop .product-tile__overlay-action.is-adding .product-tile__overlay-label { animation: cart-label-press .3s ease-out; }
}
@keyframes cart-label-press {
    0% { transform: scale(.94); }
    65% { transform: scale(1.025); }
    100% { transform: scale(1); }
}
@media (prefers-reduced-motion: reduce) {
    .pixel-site .product-shop .product-tile__overlay-label span,
    .pixel-site .product-shop .product-tile__overlay-label i,
    .pixel-site .product-shop .product-tile__overlay-label i::before,
    .pixel-site .product-shop .product-tile__overlay-label i::after { transition: none; }
}

@keyframes cart-label-touch { from { transform: scale(.94); } to { transform: scale(1); } }
@media (max-width:760px), (hover:none), (pointer:coarse) {
    .pixel-site .product-shop .product-tile__overlay-action.is-adding .product-tile__overlay-label { animation-name: cart-label-touch; }
}
@media (prefers-reduced-motion:reduce) {
    .pixel-site .product-shop .product-tile__overlay-action.is-adding .product-tile__overlay-label { animation: none; }
}


/* halloween-accents.css */
/* Decorative accents only. The normal light theme and product colours stay intact. */
.halloween-brand-pumpkin,.halloween-ribbon{display:none}
.halloween-accents .site-brand{position:relative;overflow:visible}
.halloween-accents .site-brand>.halloween-brand-pumpkin{display:block!important;position:absolute;right:-5px;bottom:1px;width:27px!important;height:27px!important;object-fit:contain;pointer-events:none;filter:drop-shadow(0 2px 2px #814b1926)}
.halloween-accents .halloween-ribbon{display:flex;align-items:center;justify-content:space-between;gap:16px;position:relative;isolation:isolate;min-height:62px;padding:10px 24px!important;margin-top:2px!important;margin-bottom:14px!important;border:1px solid #f0e5d5;background:linear-gradient(100deg,#fff8ed,#fff 45%,#faf8ff);box-sizing:border-box;overflow:hidden;border-radius:0}
.halloween-ribbon::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:radial-gradient(circle at 18% 28%,#e9a75244 0 1px,transparent 2px),radial-gradient(circle at 83% 72%,#8b7aab44 0 1px,transparent 2px);background-size:64px 50px}
.halloween-ribbon__label{font-size:.76rem;color:#52617b;text-align:center;line-height:1.5}.halloween-ribbon__label strong{color:#233d67;font-weight:800}.halloween-ribbon__label small{display:block;letter-spacing:.15em;font-size:.5rem;font-weight:800;color:#956021;margin-top:3px}
.halloween-ribbon__scene{display:flex;align-items:center;gap:20px;flex-shrink:0;pointer-events:none}.halloween-ribbon__scene img{display:block;object-fit:contain}.halloween-ribbon__scene--ghost{gap:18px}.halloween-spark{color:#c5852f;font-size:.85rem}.halloween-bat{display:block;color:#7a6a94}

.halloween-accents .site-footer{position:relative;border-top-color:#e9dcc8}
.halloween-accents .site-footer::after{content:'';position:absolute;right:0;top:0;width:68px;height:68px;pointer-events:none;opacity:.22;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80' fill='none' stroke='%2384769b' stroke-width='1.4'%3E%3Cpath d='M80 0H0M80 0V80M80 0 10 70M80 0 43 80M80 0 0 38M52 0Q53 18 80 28M27 0Q31 35 80 53M0 0Q5 58 80 80M61 19Q42 18 35 0M41 39Q11 29 0 17M58 49Q55 67 64 80'/%3E%3C/svg%3E") no-repeat center/contain}
@media(hover:hover) and (pointer:fine){.halloween-accents .product-tile:hover{box-shadow:0 9px 28px #c4812926}.halloween-accents .site-brand:hover>.halloween-brand-pumpkin{transform:rotate(-10deg)}}
@media(prefers-reduced-motion:no-preference){.halloween-brand-pumpkin{transition:transform .3s ease}.halloween-ribbon__scene--ghost>img{animation:halloween-ghost-drift 5s ease-in-out infinite}.halloween-bat{animation:halloween-bat-drift 7s ease-in-out infinite}.halloween-spark{animation:halloween-spark-glow 4s ease-in-out infinite}.halloween-ribbon:hover .halloween-ribbon__scene *{animation-play-state:paused}}
@keyframes halloween-ghost-drift{0%,100%{transform:translateY(3px) rotate(-4deg)}50%{transform:translateY(-4px) rotate(4deg)}}
@keyframes halloween-bat-drift{0%,100%{transform:translate(0,1px) rotate(-5deg)}50%{transform:translate(-9px,-3px) rotate(4deg)}}
@keyframes halloween-spark-glow{0%,100%{opacity:.4;transform:scale(.85)}50%{opacity:1;transform:scale(1.1)}}
@media(max-width:700px){.halloween-accents .halloween-ribbon{min-height:58px;gap:9px;padding:9px 13px!important}.halloween-ribbon__label{font-size:.65rem}.halloween-ribbon__label strong{display:block}.halloween-ribbon__label small{font-size:.43rem;letter-spacing:.1em}.halloween-ribbon__scene{gap:0}.halloween-ribbon__pumpkin{width:29px;height:29px}.halloween-ribbon__scene--ghost>img{width:29px;height:34px}.halloween-spark,.halloween-bat{display:none}.halloween-accents .site-brand>.halloween-brand-pumpkin{width:21px!important;height:21px!important;right:-2px;bottom:0}.halloween-accents .site-footer::after{width:43px;height:43px}}
@media(prefers-reduced-motion:reduce){.halloween-ribbon *{animation:none!important}.halloween-brand-pumpkin{transition:none!important}}

/* More characters, placed in the unused corners rather than over the content. */
.hw-page-corners,.hw-tile-decor,.hw-community-decoration,.hw-ground{display:none}
.halloween-accents .hw-page-corners{display:block;position:absolute;inset:0 0 auto;height:180px;overflow:hidden;pointer-events:none;z-index:1}
.hw-page-corners>img{position:absolute;top:0;opacity:.22;pointer-events:none}.hw-page-corners__left{left:0;transform:scaleX(-1)}.hw-page-corners__right{right:0}.hw-page-corners>.hw-hanging-spider{right:5px;top:68px;width:40px;height:90px;opacity:.75;transform-origin:50% 0}
.halloween-accents .hw-tile-decor{display:block;position:absolute;right:0;top:0;width:110px;height:100px;pointer-events:none;z-index:1;overflow:hidden}
.halloween-accents .ls-feature>.hw-tile-decor{z-index:3}
.pixel-site .hw-tile-decor>img{display:block!important;position:absolute!important;object-fit:contain!important;margin:0!important;padding:0!important;pointer-events:none;filter:none!important}
.pixel-site .hw-tile-decor>.hw-tile-decor__web{inset:0 0 auto auto;width:100px!important;height:100px!important;opacity:.32;transform:none!important}
.pixel-site .hw-tile-decor>.hw-tile-decor__character{top:13px;right:17px;width:56px!important;height:60px!important;opacity:1;filter:drop-shadow(0 3px 2px #28334a28)!important;transform:none}
.pixel-site .hw-tile-decor--bat>.hw-tile-decor__character{top:24px;right:14px;width:65px!important;height:42px!important}
.halloween-accents .product-tile>.hw-tile-decor{left:0;right:auto;width:76px;height:90px;z-index:2}
.pixel-site .product-tile>.hw-tile-decor>.hw-tile-decor__web{left:0;right:auto;width:76px!important;height:76px!important;transform:scaleX(-1)!important;opacity:.22}
.pixel-site .product-tile>.hw-tile-decor>.hw-tile-decor__character{left:11px;right:auto;top:14px;width:38px!important;height:42px!important}
.pixel-site .product-tile>.hw-tile-decor--bat>.hw-tile-decor__character{width:44px!important;height:32px!important;top:19px}
.halloween-accents .hw-community-decoration{display:flex;align-items:center;justify-content:center;gap:22px;pointer-events:none;height:46px;margin:0 0 14px;color:#bc8b35}.hw-community-decoration>span{font-size:.8rem}
.halloween-accents .hw-ground{display:flex;align-items:flex-end;justify-content:space-between;pointer-events:none;margin-top:24px;margin-bottom:-2px;height:50px;position:relative;z-index:1}.hw-ground>span:first-child{display:flex;align-items:flex-end;gap:3px}.hw-ground>span:first-child>img+img{margin-left:-10px;transform:rotate(8deg)}.hw-ground__bat{position:absolute;left:54%;bottom:8px;opacity:.55}.hw-ground__ghost{margin-right:18px}
@media(prefers-reduced-motion:no-preference){.hw-hanging-spider{animation:hw-spider-sway 7s ease-in-out infinite}.hw-tile-decor--ghost .hw-tile-decor__character,.hw-community-decoration>img:first-child,.hw-ground__ghost{animation:hw-ghost-hover 5.5s ease-in-out infinite}.product-tile:nth-child(3n + 2) .hw-tile-decor__character{animation-delay:-2s}.ls-feature:is(:hover,:focus-visible) .hw-tile-decor__character,.product-tile:is(:hover,:focus-within) .hw-tile-decor__character{animation-play-state:paused}.hw-tile-decor--pumpkin .hw-tile-decor__character{transition:rotate .35s ease}.ls-feature:is(:hover,:focus-visible) .hw-tile-decor--pumpkin .hw-tile-decor__character{rotate:-9deg}}
@keyframes hw-spider-sway{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(6deg)}}
@keyframes hw-ghost-hover{0%,100%{translate:0 2px;rotate:-3deg}50%{translate:0 -5px;rotate:3deg}}
@media(max-width:1279px){.hw-page-corners>.hw-hanging-spider{display:none}}
@media(max-width:700px){.hw-page-corners>img{width:65px;height:65px;opacity:.13}.halloween-accents .hw-tile-decor{width:86px;height:82px}.pixel-site .hw-tile-decor>.hw-tile-decor__web{width:85px!important;height:85px!important}.pixel-site .hw-tile-decor>.hw-tile-decor__character{width:42px!important;height:46px!important;top:10px;right:15px}.pixel-site .hw-tile-decor--bat>.hw-tile-decor__character{width:51px!important;height:34px!important;top:17px}.halloween-accents .product-tile>.hw-tile-decor{width:66px;height:75px}.pixel-site .product-tile>.hw-tile-decor>.hw-tile-decor__character{width:32px!important;height:36px!important;left:9px;top:12px}.halloween-accents .hw-ground{height:40px}.hw-ground>span:first-child>img:first-child{width:39px;height:39px}.hw-ground__ghost{width:31px;height:35px}.hw-community-decoration>img{width:32px;height:36px}}
@media(prefers-reduced-motion:reduce){.hw-page-corners *,.hw-tile-decor *,.hw-community-decoration *,.hw-ground *{animation:none!important;transition:none!important}}

/* Native same-origin transitions preserve the normal navigation and form lifecycle. */
.hw-flying-bat{position:absolute!important;left:12px!important;bottom:24px!important;width:46px!important;height:30px!important;object-fit:contain!important;pointer-events:none}
.hw-hover-magic{z-index:4}
.hw-spell-ring{position:absolute;width:68px;height:68px;border:2px dashed #ffe1a0;border-radius:50%;box-shadow:0 0 16px #b795e580,inset 0 0 12px #fff2bc66;pointer-events:none}
.hw-mote{position:absolute;left:22px;top:20px;width:4px;height:4px;background:#e9d8ff;border-radius:50%;opacity:0;pointer-events:none}.hw-mote:nth-of-type(2){left:35px;animation-delay:1.1s!important}.hw-mote:nth-of-type(3){left:45px;animation-delay:2.2s!important}
@media(prefers-reduced-motion:no-preference){
 .hw-tile-decor--potion .hw-mote{animation:hw-bubble 3.8s ease-out infinite}
 .hw-tile-decor--moon .hw-mote{animation:hw-starlight 4s ease-in-out infinite;background:#fff0b1;border-radius:0;rotate:45deg}
 .hw-tile-decor--potion .hw-tile-decor__character{animation:hw-brew 6s ease-in-out infinite;transform-origin:50% 85%}
 .hw-tile-decor--moon .hw-tile-decor__character{animation:hw-moon-rock 8s ease-in-out infinite}
 .hw-ground.hw-in-view>span:first-child>img{animation:hw-cat-peek 5s ease-in-out 2;transform-origin:50% 100%}
}
@keyframes hw-bubble{0%{opacity:0;translate:0 14px;scale:.4}25%{opacity:.9}90%,100%{opacity:0;translate:5px -18px;scale:1.3}}
@keyframes hw-starlight{0%,100%{opacity:0;scale:.4}50%{opacity:.9;scale:1.5}}
@keyframes hw-brew{0%,70%,100%{rotate:0deg}78%{rotate:-8deg}87%{rotate:6deg}94%{rotate:-3deg}}
@keyframes hw-moon-rock{0%,100%{rotate:-7deg;translate:0 0}50%{rotate:7deg;translate:0 -4px}}
@keyframes hw-cat-peek{0%,65%,100%{rotate:0deg;scale:1}75%{rotate:-6deg;scale:1 .93}85%{rotate:4deg;scale:1 1.03}}
@view-transition{navigation:auto}
html:has(.halloween-accents)::view-transition-old(root){animation:hw-page-out .18s ease-in both;mix-blend-mode:normal}
html:has(.halloween-accents)::view-transition-new(root){animation:hw-page-in .3s cubic-bezier(.2,.8,.2,1) both;mix-blend-mode:normal}
@keyframes hw-page-out{to{opacity:0;transform:translateY(-5px) scale(.998)}}
@keyframes hw-page-in{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
.hw-magic-host{position:relative}
.hw-cart-magic{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:12;border-radius:inherit}
.hw-cart-magic__ghost{position:absolute!important;width:34px!important;height:39px!important;object-fit:contain!important;margin:0!important;filter:drop-shadow(0 2px 3px #5a458d33);pointer-events:none}
.hw-cart-magic>i{position:absolute;width:5px;height:5px;border-radius:1px;pointer-events:none}
.hw-navigation-wisp{position:fixed;top:105px;right:max(22px,calc((100vw - 1616px)/2));width:36px;height:44px;z-index:80;pointer-events:none;contain:layout paint;overflow:hidden}.hw-navigation-wisp>img{width:100%;height:100%;object-fit:contain}
@media(prefers-reduced-motion:no-preference){.halloween-ribbon__pumpkin{animation:hw-pumpkin-arrive .6s cubic-bezier(.2,.8,.2,1) both}.hw-in-view>span:first-child{animation:hw-pumpkin-arrive .55s ease-out both}.hw-community-decoration.hw-in-view>img:last-child{animation:hw-pumpkin-arrive .6s ease-out both}.ls-feature:is(:hover,:focus-visible) .hw-tile-decor--bat>.hw-tile-decor__character,.product-tile:is(:hover,:focus-within) .hw-tile-decor--bat>.hw-tile-decor__character{animation:hw-bat-greeting .6s ease-out}.site-footer:hover::after{transition:opacity .35s;opacity:.4}}
@keyframes hw-pumpkin-arrive{0%{opacity:0;translate:0 6px;rotate:-10deg}65%{opacity:1;translate:0 -2px;rotate:4deg}100%{opacity:1;translate:0;rotate:0deg}}
@keyframes hw-bat-greeting{25%{scale:1.05 .8;rotate:-7deg}65%{scale:1 1.08;rotate:6deg}100%{scale:1;rotate:0deg}}
@media(max-width:700px){.hw-navigation-wisp{top:92px;right:19px;width:28px;height:34px}.hw-cart-magic__ghost{width:29px!important;height:34px!important}}
@media(prefers-reduced-motion:reduce){@view-transition{navigation:none}html:has(.halloween-accents)::view-transition-old(root),html:has(.halloween-accents)::view-transition-new(root){animation:none!important}.hw-navigation-wisp,.hw-cart-magic{display:none}.halloween-ribbon__pumpkin,.hw-in-view>*,.hw-community-decoration>img{animation:none!important}}
/* A single, non-blocking Halloween sweep after an internal page change. */
.hw-navigation-wisp{inset:0;width:100%;height:100%;z-index:90;overflow:hidden;contain:strict;pointer-events:none}
.hw-transition-mist{position:absolute;inset:0 -25%;background:radial-gradient(ellipse at 40% 45%,#b49ad638,transparent 55%),radial-gradient(ellipse at 60% 65%,#ffe1a025,transparent 50%);pointer-events:none}
.hw-navigation-wisp>.hw-transition-bat{position:absolute;left:0;height:auto;max-width:60px;object-fit:contain;filter:drop-shadow(0 3px 6px #35204f25);pointer-events:none}
@media(prefers-reduced-motion:reduce){.hw-navigation-wisp{display:none}}
/* v18: articulated characters and a restrained, staged arrival. */
.hw-navigation-wisp>.hw-transition-bat{max-width:84px;will-change:transform,opacity}
.hw-transition-mist{background:radial-gradient(ellipse at 40% 45%,#b49ad630,transparent 48%),radial-gradient(ellipse at 60% 65%,#ffe1a020,transparent 45%)}
.hw-cart-arrival{position:absolute;right:65px;top:18px;width:42px;height:48px;z-index:20;pointer-events:none}
.hw-arrival-ghost{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 7px #66517e28)}
.hw-spell-ring{border:1px solid #fff1b9;box-shadow:0 0 15px #b795e560,inset 0 0 8px #fff2bc50}
.hw-spell-ring::after{content:'';position:absolute;inset:8px;border:1px dashed #fff3cb;border-radius:50%}
@media(prefers-reduced-motion:no-preference){
 .hw-page-corners>.hw-hanging-spider{animation:hw-spider-drop 1.5s cubic-bezier(.22,.75,.25,1) both,hw-spider-sway 7s 1.5s ease-in-out infinite}
 html:has(.halloween-accents)::view-transition-new(root){animation:hw-clean-reveal .48s cubic-bezier(.2,.7,.25,1) both}
 .hw-ground.hw-in-view>span:first-child>img{animation:none}
}
@keyframes hw-spider-drop{0%{translate:0 -140px;rotate:-8deg}48%{translate:0 7px;rotate:5deg}68%{translate:0 -9px;rotate:-3deg}84%{translate:0 3px;rotate:1deg}100%{translate:0 0;rotate:0deg}}
@keyframes hw-clean-reveal{from{opacity:.15;clip-path:polygon(0 0,0 0,0 100%,0 100%);transform:translateX(-8px)}to{opacity:1;clip-path:polygon(0 0,100% 0,100% 100%,0 100%);transform:none}}
@media(prefers-reduced-motion:reduce){.hw-cart-arrival{display:none}}
/* More visible silhouettes without covering the controls. */
.hw-navigation-wisp>.hw-transition-bat{max-width:108px;filter:drop-shadow(0 5px 8px #35204f38)}
.hw-cart-arrival{width:52px;height:58px;top:17px}
.hw-spell-ring{width:86px;height:86px;box-shadow:0 0 22px #b795e580,inset 0 0 12px #fff2bc70}
.hw-cart-magic>i{width:6px;height:6px}
@media(max-width:700px){.hw-cart-arrival{width:43px;height:49px;top:18px}.hw-navigation-wisp>.hw-transition-bat{max-width:78px}}


/* motion-budget.css */
/* Mobile/slow devices: only expensive seasonal overlays, not ordinary UI motion. */
html[data-halloween-motion="light"] :is(.hw-navigation-wisp, .hw-cart-magic, .hw-cart-arrival) {
    display: none !important;
}
html[data-halloween-motion="light"]::view-transition-old(root),
html[data-halloween-motion="light"]::view-transition-new(root) { animation: none !important; }
/* Broad suppression is reserved for the user's explicit reduced-motion preference. */
html[data-motion-mode="limited"] *,
html[data-motion-mode="limited"] *::before,
html[data-motion-mode="limited"] *::after {
    animation: none !important;
    transition-duration: 0.12s !important;
    transition-delay: 0s !important;
    scroll-behavior: auto !important;
    will-change: auto !important;
}
html[data-motion-mode="limited"] .app-enter {
    opacity: 1 !important;
    translate: none !important;
}
html[data-motion-mode="limited"] :is(.hw-page-corners, .hw-community-decoration, .hw-ground,
    .hw-tile-decor, .hw-navigation-wisp, .hw-cart-magic, .hw-cart-arrival,
    .motion-shine, .ls-card-glow, .ls-voxel-ribbon) { display: none !important; }
html[data-motion-mode="limited"]::view-transition-old(root),
html[data-motion-mode="limited"]::view-transition-new(root) { animation: none !important; }
/* Loading still has an explicit, static visual indicator. */
html[data-motion-mode="limited"] .server-loader.is-visible span { transform: none; width: 100%; }
@media (prefers-reduced-motion: reduce) {
    html[data-motion-mode="limited"] *, html[data-motion-mode="limited"] *::before,
    html[data-motion-mode="limited"] *::after { transition-duration: 0s !important; }
}