/* Europa777 hero + intro animations, ported from the owner zip (eu-lobby.dc.html).
   Timing, easing, delays and transform values match the zip.
   eu-shim, euS-bar, euS-glow and euS-out are the same beats, on transform/opacity
   only (the zip swept background-position, width, box-shadow and a blur filter).
   eu-breathe and eu-pose are declared in the zip and never applied to an element. */

@keyframes eu-kb {
    0% { transform: scale(1); }
    100% { transform: scale(1.06); }
}
@keyframes eu-breathe {
    0%, 100% { transform: rotate(-0.6deg) scale(1, 1); }
    50% { transform: rotate(0.5deg) scale(1.006, 1.014); }
}
@keyframes eu-pulse {
    0%, 100% { opacity: 0.35; transform: scale(0.9); }
    50% { opacity: 0.95; transform: scale(1.08); }
}
@keyframes eu-tw {
    0%, 100% { opacity: 0.15; transform: scale(0.6); }
    50% { opacity: 1; transform: scale(1); }
}
@keyframes eu-flick {
    0%, 100% { opacity: 0.75; }
    20% { opacity: 0.95; }
    45% { opacity: 0.6; }
    70% { opacity: 1; }
}
@keyframes eu-rise {
    0% { opacity: 0; transform: translate(0, 0) scale(0.6); }
    15% { opacity: 1; }
    100% { opacity: 0; transform: translate(var(--dx), -120px) scale(1); }
}
/* Phone: the full 120px rise leaves the hero. Same beat, a shorter climb. */
@keyframes eu-rise-m {
    0% { opacity: 0; transform: translate(0, 0) scale(0.6); }
    15% { opacity: 1; }
    100% { opacity: 0; transform: translate(var(--dx), -64px) scale(1); }
}
@keyframes eu-shim {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}
@keyframes eu-head {
    0%, 100% { transform: rotate(-3deg) translateY(0); }
    22% { transform: rotate(1.5deg) translateY(-2px); }
    48% { transform: rotate(3deg) translateY(1px); }
    70% { transform: rotate(-0.5deg) translateY(-1px); }
}
@keyframes eu-coin {
    0%, 100% { transform: rotate(1.5deg) translateY(0); }
    50% { transform: rotate(-3.2deg) translateY(-5px); }
}
@keyframes eu-wal {
    0%, 100% { transform: rotate(-2.5deg); }
    35% { transform: rotate(4deg); }
    60% { transform: rotate(3deg); }
}
@keyframes eu-ear {
    0%, 78%, 100% { transform: rotate(0deg); }
    82% { transform: rotate(-4.5deg); }
    86% { transform: rotate(2deg); }
    90% { transform: rotate(-1.5deg); }
    94% { transform: rotate(0deg); }
}
@keyframes eu-tail {
    0%, 100% { transform: rotate(-3deg); }
    50% { transform: rotate(3.5deg); }
}
@keyframes eu-body {
    0%, 100% { transform: translateY(0) scale(1, 1); }
    50% { transform: translateY(-3px) scale(1.004, 1.01); }
}
@keyframes eu-pose {
    0% { opacity: 0; transform: translateY(10px) scale(0.97); }
    3% { opacity: 1; transform: translateY(-4px) scale(1.015); }
    6% { transform: translateY(0) scale(1); }
    25% { opacity: 1; transform: translateY(0) scale(1); }
    28% { opacity: 0; transform: translateY(4px) scale(0.99); }
    100% { opacity: 0; }
}
@keyframes eu-fade {
    0% { opacity: 0; }
    100% { opacity: 1; }
}
@keyframes eu-thumb {
    0%, 100% { transform: rotate(0deg); }
    18% { transform: rotate(-8deg); }
    30% { transform: rotate(-5.5deg); }
    40% { transform: rotate(-8deg); }
    62% { transform: rotate(-1deg); }
}
@keyframes eu-ding {
    0%, 14% { opacity: 0; transform: scale(0.4); }
    20% { opacity: 1; transform: scale(1.25); }
    34% { opacity: 0; transform: scale(0.8); }
    100% { opacity: 0; }
}
@keyframes eu-headB {
    0%, 100% { transform: rotate(0deg) translateY(0); }
    30% { transform: rotate(1.6deg) translateY(-1.5px); }
    62% { transform: rotate(-1.2deg) translateY(0); }
    72% { transform: rotate(2deg) translateY(-1px); }
    84% { transform: rotate(0.6deg); }
}
@keyframes eu-wink {
    0%, 64% { opacity: 0; }
    68% { opacity: 1; }
    80% { opacity: 1; }
    85%, 100% { opacity: 0; }
}
@keyframes eu-in {
    0% { opacity: 0; transform: translateY(24px); }
    100% { opacity: 1; transform: none; }
}

@keyframes euS-star {
    0% { opacity: 0; transform: scale(0) rotate(-90deg); }
    70% { opacity: 1; transform: scale(1.35) rotate(10deg); }
    100% { opacity: 1; transform: scale(1) rotate(0deg); }
}
@keyframes euS-ring {
    to { transform: rotate(360deg); }
}
@keyframes euS-coin {
    0% { transform: translateY(-140px) rotateY(0deg) scale(0.6); opacity: 0; }
    35% { opacity: 1; }
    55% { transform: translateY(0) rotateY(540deg) scale(1); }
    68% { transform: translateY(-18px) rotateY(620deg) scale(1); }
    80%, 100% { transform: translateY(0) rotateY(720deg) scale(1); }
}
@keyframes euS-glow {
    0%, 100% { opacity: 0; transform: scale(0.86); }
    50% { opacity: 1; transform: scale(1); }
}
@keyframes euS-bar {
    from { transform: scaleX(0); }
    to { transform: scaleX(1); }
}
@keyframes euS-win {
    0%, 85% { opacity: 0; transform: scale(0.6); }
    100% { opacity: 1; transform: scale(1); }
}
@keyframes euS-logo {
    0% { opacity: 0; transform: translateY(16px) scale(0.85); }
    100% { opacity: 1; transform: none; }
}
@keyframes euS-out {
    to { opacity: 0; transform: scale(1.06); }
}
@keyframes euS-burst {
    0% { opacity: 0; transform: translate(0, 0) scale(0.4); }
    20% { opacity: 1; }
    100% { opacity: 0; transform: translate(var(--x), var(--y)) scale(1); }
}

@keyframes eu-mapdot {
    0%, 100% { opacity: 0.9; }
    50% { opacity: 0.3; }
}
@keyframes eu-mapgift {
    0%, 100% { transform: translateY(0) scale(1); }
    50% { transform: translateY(-5px) scale(1.08); }
}

@media (prefers-reduced-motion: reduce) {
    [data-eu-anim] { animation: none !important; will-change: auto; }
}

[data-eu-paused] [data-eu-anim],
[data-eu-paused][data-eu-anim] {
    animation-play-state: paused !important;
}

body.c7-redesign .b7-hero__slide[hidden] [data-eu-anim] {
    animation-play-state: paused !important;
}

/* ---- Hero scene -------------------------------------------------- */
body.c7-redesign .eu-scene {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    background: #000A2B;
    animation: eu-fade 0.6s ease-out both;
}
body.c7-redesign .eu-scene__bg {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    aspect-ratio: 1672 / 941;
    transform: translate(-50%, -50%);
}
body.c7-redesign .eu-scene__shift {
    position: absolute;
    inset: 0;
    transform: translate3d(calc(var(--px, 0) * -12px), calc(var(--py, 0) * -6px), 0) scale(1.04);
    transition: transform 0.8s cubic-bezier(0.2, 0.7, 0.2, 1);
}
body.c7-redesign .eu-scene__plate {
    position: absolute;
    inset: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
body.c7-redesign .eu-scene__photo,
body.c7-redesign .eu-scene__photo img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: fill;
    display: block;
}
@media (min-width: 768px) {
    body.c7-redesign .eu-scene__photo { display: none; }
}
body.c7-redesign .eu-scene--welcome .eu-scene__plate {
    background-image: url("../img/eu/hero-anim-bg.webp");
    transform-origin: 70% 45%;
    animation: eu-kb 26s ease-in-out infinite alternate;
}
body.c7-redesign .eu-scene--cashback .eu-scene__plate {
    background-image: url("../img/eu/hero2-bg.webp");
    transform-origin: 50% 50%;
    animation: eu-kb 24s ease-in-out infinite alternate;
}
body.c7-redesign .eu-scene__veil {
    display: none;
}

body.c7-redesign .eu-fox {
    position: absolute;
    transform: translate3d(calc(var(--px, 0) * 14px), calc(var(--py, 0) * 4px), 0);
    transition: transform 0.8s cubic-bezier(0.2, 0.7, 0.2, 1);
}
body.c7-redesign .eu-fox--rig {
    aspect-ratio: 710 / 840;
    bottom: -27%;
    height: 124%;
    right: max(2%, calc((100% - 980px) / 2));
    filter: drop-shadow(0 18px 30px rgba(0, 0, 0, 0.45));
}
body.c7-redesign .eu-fox--cash {
    aspect-ratio: 850 / 780;
    bottom: -5%;
    height: 94%;
    right: max(0%, calc((100% - 980px) / 2 - 40px));
    filter: drop-shadow(0 18px 30px rgba(0, 0, 0, 0.4));
}
body.c7-redesign .eu-fox__in {
    position: absolute;
    inset: 0;
    animation: eu-in 0.9s cubic-bezier(0.2, 0.8, 0.2, 1) both;
}
body.c7-redesign .eu-fox__body {
    position: absolute;
    inset: 0;
    transform-origin: 50% 100%;
    animation: eu-body 4.8s ease-in-out infinite;
}
body.c7-redesign .eu-grp,
body.c7-redesign .eu-part {
    position: absolute;
    inset: 0;
    pointer-events: none;
}
body.c7-redesign .eu-part {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
}
body.c7-redesign .eu-a-tail { animation: eu-tail 3.6s ease-in-out infinite; }
body.c7-redesign .eu-a-tail2 { animation: eu-tail 3.4s ease-in-out infinite; }
body.c7-redesign .eu-a-wal {
    transform-origin: 87.37% 47.05%;
    animation: eu-wal 5.2s ease-in-out infinite;
}
body.c7-redesign .eu-a-coin {
    transform-origin: 33.82% 41.90%;
    animation: eu-coin 4.4s ease-in-out infinite;
}
body.c7-redesign .eu-a-head {
    transform-origin: 49.61% 31.43%;
    animation: eu-head 6.4s ease-in-out infinite;
}
body.c7-redesign .eu-a-headB {
    transform-origin: 54.12% 44.23%;
    animation: eu-headB 6s ease-in-out infinite;
}
body.c7-redesign .eu-a-ear { animation: eu-ear 5.5s ease-in-out infinite; }
body.c7-redesign .eu-a-thumb {
    transform-origin: 46.47% 55.13%;
    animation: eu-thumb 3s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}
body.c7-redesign .eu-a-wink {
    opacity: 0;
    animation: eu-wink 6s ease-in-out infinite;
}

body.c7-redesign .eu-glow {
    position: absolute;
    transform: translate(-50%, -50%);
    pointer-events: none;
}
body.c7-redesign .eu-glow__blob {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    mix-blend-mode: screen;
}
body.c7-redesign .eu-dot {
    position: absolute;
    border-radius: 50%;
    opacity: 0.2;
    pointer-events: none;
}
body.c7-redesign .eu-shim {
    position: absolute;
    left: 30%;
    top: 64%;
    width: 56%;
    height: 15%;
    overflow: hidden;
    mix-blend-mode: screen;
    pointer-events: none;
    -webkit-mask-image: linear-gradient(180deg, transparent, #000 30%, #000 70%, transparent);
    mask-image: linear-gradient(180deg, transparent, #000 30%, #000 70%, transparent);
}
body.c7-redesign .eu-shim__band {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 200%;
    background-image: linear-gradient(90deg, rgba(255, 210, 130, 0) 0%, rgba(255, 215, 140, 0.22) 12.5%, rgba(255, 210, 130, 0) 25%, rgba(255, 210, 130, 0) 100%);
    animation: eu-shim 7s linear infinite;
}
body.c7-redesign .eu-spark {
    position: absolute;
    top: 40%;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #FFE28A;
    box-shadow: 0 0 8px #FFCC00;
    opacity: 0;
    pointer-events: none;
    animation: eu-rise 2.6s ease-out infinite;
}
body.c7-redesign .eu-glint {
    position: absolute;
    border-radius: 50%;
    background: radial-gradient(closest-side, #fff, rgba(255, 230, 150, 0.7) 40%, rgba(255, 220, 120, 0));
    opacity: 0;
    pointer-events: none;
    animation: eu-tw 2.6s ease-in-out infinite;
}
body.c7-redesign .eu-ding {
    position: absolute;
    width: 26px;
    height: 26px;
    margin-left: -13px;
    margin-top: -13px;
    border-radius: 50%;
    background: radial-gradient(closest-side, #fff, rgba(255, 230, 150, 0.8) 35%, rgba(255, 220, 120, 0));
    opacity: 0;
    pointer-events: none;
    animation: eu-ding 3s ease-out infinite;
}

/* Owner override, phones only: the fox, coins and sparkles sit in the centre,
   fully inside the hero, with the headline kept in the lower band. */
@media (max-width: 767px) {
    /* The scene fade starts at opacity 0, which hides the city on the first frames. */
    body.c7-redesign .eu-scene {
        animation: none;
        opacity: 1;
    }
    body.c7-redesign .eu-scene__shift {
        transform: none;
    }
    /* Fill the hero exactly so percentage-placed sparkles cannot sit outside it. */
    body.c7-redesign .eu-scene--welcome .eu-scene__bg,
    body.c7-redesign .eu-scene--cashback .eu-scene__bg {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        min-width: 0;
        min-height: 0;
        aspect-ratio: auto;
        transform: none;
    }
    body.c7-redesign .eu-scene--welcome .eu-scene__plate {
        background-image: url("../img/eu/hero-anim-bg-m.webp");
    }
    body.c7-redesign .eu-scene--cashback .eu-scene__plate {
        background-image: url("../img/eu/hero2-bg-m.webp");
    }
    body.c7-redesign .eu-scene__veil {
        display: block;
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        height: 52%;
        background: linear-gradient(180deg, rgba(0, 10, 43, 0) 0%, rgba(0, 10, 43, 0.4) 58%, rgba(0, 10, 43, 0.82) 100%);
        pointer-events: none;
    }
    body.c7-redesign .eu-scene [data-eu-anim] {
        will-change: transform, opacity;
    }
    body.c7-redesign .eu-fox--rig,
    body.c7-redesign .eu-fox--cash {
        top: 28px;
        bottom: auto;
        left: 50%;
        right: auto;
        /* 1.77 times the previous 40% height. The inset keeps ears, coins and sparkles inside the hero. */
        height: 70.8%;
        width: auto;
        max-width: calc(100% - 16px);
        translate: -50% 0;
        /* The rig art ends in a straight cut at the knees. Fade that edge into the city. */
        -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 58%, rgba(0, 0, 0, 0.45) 78%, transparent 100%);
        mask-image: linear-gradient(180deg, #000 0%, #000 58%, rgba(0, 0, 0, 0.45) 78%, transparent 100%);
    }
    body.c7-redesign .eu-fox--cash {
        /* A hair under Welcome's 70.8% so the tail stays inside a 360px hero. */
        height: 66%;
    }
    body.c7-redesign .eu-spark {
        animation-name: eu-rise-m;
    }
}

/* ---- Intro splash (euS-*) --------------------------------------- */
body.c7-redesign .eu-splash {
    position: fixed;
    inset: 0;
    z-index: 300;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 30px;
    overflow: hidden;
    background: radial-gradient(circle at 50% 42%, #10307a 0%, #071637 70%);
    color: #fff;
}
body.c7-redesign .eu-splash[hidden] { display: none !important; }
body.c7-redesign .eu-splash.is-out {
    animation: euS-out 0.5s ease-in forwards;
    pointer-events: none;
}
body.c7-redesign .eu-splash__stage {
    position: relative;
    width: 240px;
    height: 240px;
    flex-shrink: 0;
}
body.c7-redesign .eu-splash__ring {
    position: absolute;
    inset: 0;
    animation: euS-ring 6s linear 0.8s infinite;
}
body.c7-redesign .eu-splash__star {
    position: absolute;
    width: 20px;
    height: 22px;
    color: #FFCC00;
    font-size: 20px;
    line-height: 22px;
    text-align: center;
    opacity: 0;
    text-shadow: 0 0 10px rgba(255, 204, 0, 0.6);
    animation: euS-star 0.45s cubic-bezier(0.3, 1.6, 0.5, 1) forwards;
}
body.c7-redesign .eu-splash__burst {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 8px;
    height: 8px;
    margin-left: -4px;
    margin-top: -4px;
    opacity: 0;
    animation: euS-burst 0.7s ease-out 1.45s forwards;
}
body.c7-redesign .eu-splash__coinwrap {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 120px;
    height: 120px;
    margin: -60px 0 0 -60px;
    perspective: 600px;
}
body.c7-redesign .eu-splash__coin {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: #0b1d45 url("../img/eu/logo-mark.webp") center / cover no-repeat;
    animation: euS-coin 1.3s cubic-bezier(0.3, 0.6, 0.4, 1) 0.2s both;
}
body.c7-redesign .eu-splash__glow {
    position: absolute;
    inset: -28px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 204, 0, 0.45), rgba(255, 204, 0, 0) 68%);
    opacity: 0;
    pointer-events: none;
    animation: euS-glow 1.2s ease-in-out 1.4s infinite;
}
body.c7-redesign .eu-splash__logo {
    width: min(360px, 82vw);
    height: auto;
    display: block;
    opacity: 0;
    filter: drop-shadow(0 8px 24px rgba(0, 0, 0, 0.5));
    animation: euS-logo 0.6s cubic-bezier(0.2, 1.4, 0.4, 1) 0.9s forwards;
}
body.c7-redesign .eu-splash__status {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}
body.c7-redesign .eu-splash__track {
    width: 180px;
    height: 4px;
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.18);
    overflow: hidden;
}
body.c7-redesign .eu-splash__track > span {
    display: block;
    width: 100%;
    height: 100%;
    background: #FFCC00;
    transform: scaleX(0);
    transform-origin: left center;
    animation: euS-bar 1.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}
body.c7-redesign .eu-splash__win {
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #FFCC00;
    animation: euS-win 0.3s ease-out 1.5s both;
}

/* Sidebar Daily Map tile, from eu-Sidebar.dc.html mapEl */
body.c7-redesign .eu-sbmap {
    position: relative;
    width: 36px;
    height: 36px;
    flex-shrink: 0;
}
body.c7-redesign .eu-sbmap__sheet {
    position: absolute;
    inset: 0;
    border-radius: 9px;
    background: linear-gradient(160deg, #f3d891, #c9a14a);
    box-shadow: 0 0 12px rgba(var(--a7-red-rgb), 0.35), inset 0 0 0 1.5px rgba(90, 60, 10, 0.5);
}
body.c7-redesign .eu-sbmap__glyph {
    position: absolute;
    inset: 6px;
    opacity: 0.75;
    background: #6b4a12;
    -webkit-mask: var(--eu-icon) center / contain no-repeat;
    mask: var(--eu-icon) center / contain no-repeat;
}
body.c7-redesign .eu-sbmap__dot {
    position: absolute;
    left: 8px;
    bottom: 8px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--a7-red-2);
    box-shadow: 0 0 0 2px rgba(255, 204, 0, 0.3);
    animation: eu-mapdot 1.6s linear infinite;
}
body.c7-redesign .eu-sbmap__coin {
    position: absolute;
    right: -3px;
    top: -5px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: radial-gradient(circle at 35% 30%, var(--a7-white), var(--a7-red) 60%, var(--a7-red-deep));
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.45), 0 0 0 1.5px var(--a7-navy);
    animation: eu-mapgift 1.1s ease-in-out infinite;
}
body.c7-redesign .eu-sbmap__gift {
    width: 12px;
    height: 12px;
    background: #fff;
    -webkit-mask: var(--eu-icon) center / contain no-repeat;
    mask: var(--eu-icon) center / contain no-repeat;
}

/* Header controls, each matching eu-lobby.dc.html. All 44px, with a visible focus ring. */
body.c7-redesign .c7-header .c7-header__tools .c7-btn--ghost {
    height: 44px;
    min-height: 44px;
    padding: 0 18px;
    border: 1px solid var(--a7-line);
    border-radius: 6px;
    background: transparent;
    color: var(--a7-text);
    font-weight: 700;
    font-size: 15px;
    line-height: 1;
    box-shadow: none;
}
body.c7-redesign .c7-header .c7-header__tools .c7-btn--ghost:hover {
    background: var(--a7-surface);
    color: var(--a7-text);
    border-color: var(--a7-line);
}
body.c7-redesign .c7-header .c7-header__langmenu .c7-menu__btn {
    height: 44px;
    min-height: 44px;
    gap: 8px;
    padding: 0 10px;
    border: 1px solid var(--a7-line);
    border-radius: 6px;
    background: var(--a7-navy);
    color: var(--a7-text);
    font-family: Cinzel, serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 1;
    box-shadow: none;
}
body.c7-redesign .c7-header .c7-header__langmenu .c7-menu__btn:hover,
body.c7-redesign .c7-header .c7-header__langmenu .c7-menu__btn[aria-expanded="true"] {
    background: var(--a7-navy);
    color: var(--a7-text);
    border-color: var(--a7-red);
}
body.c7-redesign .c7-header .c7-header__tools .c7-btn--primary {
    height: 44px;
    min-height: 44px;
    padding: 0 18px;
    border: 0;
    border-radius: 6px;
    background: var(--a7-red);
    color: var(--a7-on-accent);
    font-weight: 900;
    font-size: 15px;
    line-height: 1;
    box-shadow: none;
}
body.c7-redesign .c7-header .c7-header__tools .c7-btn--primary:hover {
    background: var(--a7-red-hi);
    color: var(--a7-on-accent);
}
body.c7-redesign .c7-header .c7-header__tools .br-pixbtn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 44px;
    min-height: 44px;
    padding: 0 14px;
    border: 1px solid var(--a7-red);
    border-radius: 6px;
    background: #0A1F5C;
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    line-height: 1;
    box-shadow: none;
    text-decoration: none;
}
body.c7-redesign .c7-header .c7-header__tools .br-pixbtn::before {
    content: "+";
    font-family: Cinzel, serif;
    color: var(--a7-red-text);
    font-size: 12px;
    font-weight: 700;
}
body.c7-redesign .c7-header .c7-header__tools .br-pixbtn > span {
    display: none;
}
body.c7-redesign .c7-header .c7-header__tools .br-pixbtn:hover {
    background: #0A2466;
    color: #fff;
    border-color: var(--a7-red);
    text-decoration: none;
}
body.c7-redesign .c7-header .c7-header__tools .c7-btn--ghost:focus-visible,
body.c7-redesign .c7-header .c7-header__langmenu .c7-menu__btn:focus-visible,
body.c7-redesign .c7-header .c7-header__tools .c7-btn--primary:focus-visible,
body.c7-redesign .c7-header .c7-header__tools .br-pixbtn:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 2px;
}
/* Zip shows Deposit only when wide (w >= 1024). Guest Deposit must not outrank that on phones. */
@media (max-width: 1023px) {
    body.c7-redesign .c7-header .c7-header__tools .br-pixbtn:not(.br-pixbtn--member) {
        display: none;
    }
}
/* Zip btnPad is 8px below 640px; btnFs is 14px below 400px. */
@media (max-width: 639px) {
    body.c7-redesign .c7-header .c7-header__tools .c7-btn--ghost,
    body.c7-redesign .c7-header .c7-header__tools .c7-btn--primary {
        padding: 0 8px;
    }
}
@media (max-width: 399px) {
    body.c7-redesign .c7-header .c7-header__tools .c7-btn--ghost,
    body.c7-redesign .c7-header .c7-header__tools .c7-btn--primary {
        font-size: 14px;
    }
}
