/* wrapped1 (31-10-2026): the medallions of the ape types (components/_wrapped.html), wherever they are shown, and the
   Ape Wrapped button of the home page and /xp during December. */
/* the medallions (components/_wrapped.html) */
.wr-emblem { display: block; width: 100%; height: auto; overflow: visible; }
.wr-glyph { stroke-width: 0; stroke-linecap: round; stroke-linejoin: round; }
.wr-glyph .wr-g-cut { stroke: #1a0b33; stroke-opacity: .55; stroke-width: 2.6; }
.wr-glyph .wr-g-barb { stroke: #1a0b33; stroke-opacity: .3; stroke-width: 1.6; }
.wr-glyph .wr-g-ink { fill: #fff; }
.wr-glyph .wr-g-lens { fill: #12062a; stroke: var(--wa); stroke-width: 2.4; }
.wr-glyph .wr-g-shine { stroke: #fff; stroke-width: 2.6; stroke-opacity: .8; }
.wr-glyph .wr-g-paper { fill: #fff; }
.wr-glyph .wr-g-check { stroke: var(--wb); stroke-width: 5; }
.wr-glyph .wr-g-slot { fill: #12062a; }
.wr-glyph .wr-g-slice { fill: var(--wa); }
.wr-glyph .wr-g-slice2 { fill: #fff; fill-opacity: .92; }
.wr-glyph .wr-g-bulb { fill: #fff; }
.wr-glyph .wr-g-core { fill: #fff; fill-opacity: .9; }
.wr-em-text { font-family: inherit; font-weight: 700; }

/* the buttons of the home page and /xp, during December */
.wr-call { position: relative; display: flex; align-items: center; gap: 16px; padding: 16px 20px; border-radius: 20px; color: #fff; text-decoration: none; overflow: hidden;
    background: linear-gradient(110deg, #1b0b3a, #2a0f4f 45%, #0b2a2a); border: 1px solid rgba(255, 255, 255, .16); box-shadow: 0 16px 48px -18px rgba(153, 69, 255, .6);
    transition: transform .2s, box-shadow .2s; --a: #9945ff; --b: #14f195; }
.wr-call::before { content: ''; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 30%, rgba(255, 255, 255, .14) 45%, transparent 60%); background-size: 250% 100%; animation: wrHolo 5s ease-in-out infinite; pointer-events: none; }
.wr-call:hover { transform: translateY(-2px); box-shadow: 0 20px 56px -16px rgba(153, 69, 255, .8); }
.wr-call-em { flex: none; width: 58px; }
.wr-call-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.wr-call-text small { font-size: 12px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: #c4b5fd; }
.wr-call-text b { font-size: 19px; font-weight: 900; line-height: 1.15; }
.wr-call-text span { font-size: 14px; color: rgba(255, 255, 255, .75); }
.wr-call-go { margin-left: auto; flex: none; padding: 10px 18px; border-radius: 99px; font-weight: 800; font-size: 14px; color: #0b0418; background: linear-gradient(100deg, #fff, #c4b5fd 40%, #14f195); }
@media (max-width: 560px) { .wr-call { flex-wrap: wrap; } .wr-call-go { margin-left: 74px; } }

@media (prefers-reduced-motion: reduce) { .wr-call, .wr-call::before, .wr-emblem * { animation: none !important; transition: none !important; } }
.wr-call-home, .wr-call-xp { margin-top: 22px; margin-bottom: 4px; }