:root {
    --dxf-bg-0: #030817;
    --dxf-bg-1: #07152c;
    --dxf-panel: rgba(8, 20, 47, .88);
    --dxf-panel-strong: rgba(9, 19, 45, .97);
    --dxf-line: rgba(79, 147, 255, .38);
    --dxf-line-soft: rgba(126, 160, 255, .18);
    --dxf-cyan: #36ddff;
    --dxf-blue: #3b7dff;
    --dxf-pink: #ff39d3;
    --dxf-violet: #9d4dff;
    --dxf-gold: #ffc857;
    --dxf-green: #38eca7;
    --dxf-danger: #ff4f83;
    --dxf-text: #f7f9ff;
    --dxf-muted: #9eb5df;
    --dxf-radius-xl: 28px;
    --dxf-radius-lg: 22px;
    --dxf-radius-md: 16px;
    --dxf-shadow: 0 22px 54px rgba(0, 0, 0, .38);
}

/* Final-reference slot system and shared visual geometry */
.dxf-v2-page,
.game-shop,
.kart-race-page,
.postbox-page,
.news-overview,
.community-chat-page,
.menu-page { font-stretch: normal; }

.dxf-v2-page p,
.dxf-v2-page small,
.dxf-v2-page em,
.game-shop p,
.community-chat-page p { font-weight: 650; }

.dxf-progress,
.collection-progress,
.home4-task > div,
.home4-daily-reward > i,
.home4-feature-body > span:first-child > i {
    min-height: 8px;
    overflow: hidden;
    border: 1px solid rgba(81, 139, 255, .46);
    border-radius: 999px;
    background: #07122e;
    box-shadow: inset 0 1px 4px rgba(0, 0, 0, .6), 0 0 9px rgba(51, 211, 255, .08);
}

.dxf-progress > span,
.collection-progress > span,
.home4-task > div > i,
.home4-daily-reward > i > u,
.home4-feature-body > span:first-child > i > u {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #3fdcff, #815dff 54%, #ff43d1);
    box-shadow: 0 0 12px rgba(75, 214, 255, .42);
}

.home4-daily,
.home4-task,
.home4-daily-reward { position: relative; isolation: isolate; }

.home4-daily-bg,
.home4-task-bg,
.home4-reward-bg,
.dxf-profile-hub-bg {
    position: absolute;
    inset: 0;
    z-index: -1;
    overflow: hidden;
    border-radius: inherit;
    pointer-events: none;
}

.home4-daily-bg img,
.home4-task-bg img,
.home4-reward-bg img,
.dxf-profile-hub-bg img { width: 100%; height: 100%; object-fit: cover; }

.home4-daily-bg::after,
.home4-task-bg::after,
.home4-reward-bg::after,
.dxf-profile-hub-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(145deg, rgba(5, 16, 44, .46), rgba(4, 10, 30, .78));
}

.home4-task > :not(.home4-task-bg),
.home4-daily-reward > :not(.home4-reward-bg),
.home4-daily > :not(.home4-daily-bg) { position: relative; z-index: 1; }

.dxf-floating-reward {
    position: absolute;
    z-index: 4;
    right: 3%;
    bottom: -8%;
    width: min(34%, 260px);
    height: 90%;
    pointer-events: none;
}

.dxf-floating-reward img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: drop-shadow(0 14px 22px rgba(0, 0, 0, .46));
}

.dxf-reference-strip,
.dxf-feature-hero { overflow: hidden; }
.dxf-reference-strip:has(.dxf-floating-reward),
.dxf-feature-hero:has(.dxf-floating-reward) { overflow: visible; }

.dxf-profile-hub-hero { position: relative; isolation: isolate; overflow: hidden; }

.admin-graphics-page-index {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 12px;
    margin: 16px 0;
}

.admin-graphics-page-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: linear-gradient(145deg, var(--panel), var(--panel2));
}

.admin-graphics-page-card.is-complete { border-color: color-mix(in srgb, var(--green) 62%, var(--line)); }
.admin-graphics-page-card.is-partial { border-color: color-mix(in srgb, var(--cyan) 48%, var(--line)); }
.admin-graphics-page-card.is-empty { border-color: color-mix(in srgb, var(--pink) 34%, var(--line)); }

.admin-graphics-page-manage {
    min-height: 116px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 12px;
    padding: 14px;
    color: var(--text);
    text-decoration: none;
}

.admin-graphics-page-manage:hover { background: color-mix(in srgb, var(--cyan) 6%, transparent); }
.admin-graphics-page-title { min-width: 0; display: grid; gap: 7px; }
.admin-graphics-page-title b { font-size: .82rem; letter-spacing: .04em; }
.admin-graphics-page-title code { overflow-wrap: anywhere; color: var(--cyan); font-size: .67rem; }
.admin-graphics-page-status { display: grid; justify-items: end; gap: 4px; text-align: right; }
.admin-graphics-page-status strong { color: var(--text); font-size: .7rem; white-space: nowrap; }
.admin-graphics-page-status small { max-width: 145px; color: var(--muted); font-size: .62rem; font-weight: 850; line-height: 1.35; }
.admin-graphics-page-card.is-complete .admin-graphics-page-status small { color: var(--green); }
.admin-graphics-page-card.is-empty .admin-graphics-page-status small { color: var(--pink); }

.admin-graphics-page-open {
    min-height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 8px 12px;
    color: var(--text);
    border-top: 1px solid var(--line);
    text-decoration: none;
    font-size: .67rem;
    font-weight: 900;
}

.admin-graphics-page-open:hover { color: var(--cyan); background: color-mix(in srgb, var(--cyan) 7%, transparent); }
.admin-graphics-pages { display: grid; gap: 10px; }

.admin-graphics-page {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: color-mix(in srgb, var(--panel) 92%, transparent);
}

.admin-graphics-page > summary {
    min-height: 64px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 15px;
    cursor: pointer;
    list-style: none;
}

.admin-graphics-page > summary::-webkit-details-marker { display: none; }
.admin-graphics-page > summary > span { display: grid; gap: 2px; }
.admin-graphics-page > summary b { font-size: .9rem; letter-spacing: .05em; }
.admin-graphics-page > summary small { color: var(--muted); font-size: .65rem; }
.admin-graphics-page > summary em { color: var(--cyan); font-size: .66rem; font-style: normal; font-weight: 900; }
.admin-graphics-page[open] > summary { border-bottom: 1px solid var(--line); background: linear-gradient(90deg, rgba(90, 80, 255, .13), rgba(255, 55, 210, .08)); }
.admin-graphics-page .admin-home-slot-grid { padding: 12px; }
.admin-graphics-page .admin-home-slot-grid { grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 14px; }
.admin-graphics-page .admin-home-slot { min-height: 285px; padding: 12px; gap: 9px; }
.admin-graphics-page .admin-home-slot-preview { min-height: 145px; }
.admin-graphics-page .admin-home-slot-preview > .dxf-design-media { width: 100%; height: 100%; min-height: 145px; }
.admin-slot-file { display:block; color:rgba(255,255,255,.62); font-size:.59rem; line-height:1.45; overflow-wrap:anywhere; }
.admin-slot-file b { display:inline; font-size:inherit; }

.admin-slot-spec { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.admin-slot-spec > span {
    min-width: 0;
    display: grid;
    gap: 3px;
    padding: 9px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--panel2);
}
.admin-slot-spec b { font-size: .6rem; text-transform: uppercase; }
.admin-slot-spec small,
.admin-slot-spec code { overflow-wrap: anywhere; color: var(--muted); font-size: .62rem; }

@media (max-width: 760px) {
    body.is-auth .game-header {
        background: rgba(4, 9, 27, .98) !important;
        border-bottom: 1px solid rgba(85, 132, 255, .3) !important;
    }
    .mobile-brand img,
    body.page-home .mobile-brand img { width: 104px !important; max-height: 44px !important; }
    .bottom-nav .bottom-link > span:not(.nav-ico) { display: none !important; }
    .home4-daily-reward { overflow: visible; }
    .home4-daily-reward .home4-reward-art {
        position: absolute;
        z-index: 3;
        top: -17px;
        left: 50%;
        width: 66px;
        height: 57px;
        transform: translateX(-50%);
    }
    .home4-daily-reward .home4-reward-art img { width: 72px; max-height: 68px; object-fit: contain; }
    .home4-daily-reward > small { padding-top: 25px; }
    .dxf-floating-reward { right: -4px; bottom: -10px; width: 34%; height: 84%; }
    .admin-graphics-page-index { grid-template-columns: 1fr; }
    .admin-graphics-page-manage { min-height: 0; grid-template-columns: 1fr; }
    .admin-graphics-page-status { justify-items: start; text-align: left; }
    .admin-graphics-page-status small { max-width: none; }
    .admin-graphics-detail-head { align-items: stretch; flex-direction: column; }
    .admin-graphics-current-page { justify-content: space-between; }
    .admin-graphics-current-page > span { text-align: left; }
    .admin-slot-spec { grid-template-columns: 1fr; }
    .admin-graphics-page .admin-home-slot-grid { grid-template-columns: 1fr; }
}

.admin-graphics-detail-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 4px 0 12px;
}

.admin-graphics-current-page {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}

.admin-graphics-current-page > span { min-width: 0; display: grid; gap: 2px; text-align: right; }
.admin-graphics-current-page small { color: var(--muted); font-size: .58rem; font-weight: 900; text-transform: uppercase; letter-spacing: .06em; }
.admin-graphics-current-page code { overflow-wrap: anywhere; color: var(--cyan); font-size: .68rem; }

.admin-media-library-card {
    width: min(1120px, calc(100vw - 28px));
    max-height: min(88vh, 860px);
    overflow: auto;
}

.admin-selected-media-label {
    display: block;
    margin-top: -5px;
    color: var(--cyan);
    font-size: .65rem;
    font-weight: 800;
}

.admin-graphics-media-picker {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.admin-media-filters {
    display: grid;
    grid-template-columns: minmax(180px, 1.5fr) repeat(2, minmax(140px, 1fr));
    gap: 8px;
}

.admin-media-filters label {
    display: grid;
    gap: 4px;
    color: var(--muted);
    font-size: .65rem;
    font-weight: 850;
}

.admin-graphics-media-picker .admin-media-grid {
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    max-height: min(52vh, 560px);
    padding-right: 4px;
    overflow: auto;
}

.admin-graphics-media-picker .admin-media-choice {
    align-content: start;
}

.admin-graphics-media-picker .admin-media-choice > b,
.admin-graphics-media-picker .admin-media-choice > small,
.admin-graphics-media-picker .admin-media-choice > em {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-graphics-media-picker .admin-media-choice > b {
    font-size: .67rem;
}

.admin-graphics-media-picker .admin-media-choice > em {
    color: var(--cyan);
    font-size: .58rem;
    font-style: normal;
    font-weight: 850;
}

.admin-media-choice[hidden],
.admin-media-empty[hidden] {
    display: none !important;
}

.admin-media-empty {
    margin: 0;
    padding: 16px;
    border: 1px dashed var(--line);
    border-radius: 14px;
    color: var(--muted);
    text-align: center;
}

@media (max-width: 680px) {
    .admin-media-filters { grid-template-columns: 1fr; }
    .admin-graphics-media-picker .admin-media-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Eine einzige mobile App-Navigation auf jeder authentifizierten Route. */
@media (max-width: 760px) {
    body.is-auth .dxf-global-bottom-nav,
    body.is-public-profile-auth .dxf-global-bottom-nav {
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        align-items: stretch !important;
        width: 100vw !important;
        height: calc(88px + env(safe-area-inset-bottom)) !important;
        min-height: calc(88px + env(safe-area-inset-bottom)) !important;
        padding: 4px 5px env(safe-area-inset-bottom) !important;
        gap: 0 !important;
        overflow: visible !important;
    }

    body.is-auth .dxf-global-bottom-nav .bottom-link,
    body.is-public-profile-auth .dxf-global-bottom-nav .bottom-link {
        min-width: 0 !important;
        min-height: 80px !important;
        height: 80px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 0 !important;
        padding: 1px 2px 3px !important;
        overflow: visible !important;
    }

    body.is-auth .dxf-global-bottom-nav .bottom-link .nav-ico,
    body.is-public-profile-auth .dxf-global-bottom-nav .bottom-link .nav-ico {
        display: grid !important;
        flex: 0 0 58px !important;
        width: 58px !important;
        height: 58px !important;
        margin: 0 !important;
        padding: 0 !important;
        border-radius: 14px !important;
        background: transparent !important;
        overflow: hidden !important;
    }

    body.is-auth .dxf-global-bottom-nav .bottom-link .nav-ico img,
    body.is-public-profile-auth .dxf-global-bottom-nav .bottom-link .nav-ico img {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: contain !important;
        filter: none !important;
        opacity: .92 !important;
        transform: scale(.94) !important;
    }

    body.is-auth .dxf-global-bottom-nav .bottom-link.active .nav-ico img,
    body.is-public-profile-auth .dxf-global-bottom-nav .bottom-link.active .nav-ico img {
        opacity: 1 !important;
        transform: scale(1) !important;
        filter: drop-shadow(0 0 7px rgba(255, 55, 214, .55)) !important;
    }

    body.is-auth .dxf-global-bottom-nav .bottom-link > .nav-label,
    body.is-public-profile-auth .dxf-global-bottom-nav .bottom-link > .nav-label {
        display: block !important;
        max-width: 100% !important;
        margin: -3px 0 0 !important;
        color: rgba(232, 239, 255, .72) !important;
        font-size: 10px !important;
        font-weight: 850 !important;
        line-height: 1 !important;
        letter-spacing: .01em !important;
        text-align: center !important;
        white-space: nowrap !important;
    }

    body.is-auth .dxf-global-bottom-nav .bottom-link.active > .nav-label,
    body.is-public-profile-auth .dxf-global-bottom-nav .bottom-link.active > .nav-label {
        color: #ff69df !important;
        text-shadow: 0 0 9px rgba(255, 53, 204, .52) !important;
    }
}

html[data-theme],
html[data-theme="light"] {
    color-scheme: dark;
}

body.is-auth,
body.is-public-profile-auth {
    color: var(--dxf-text);
    background:
        radial-gradient(circle at 14% 0%, rgba(25, 109, 213, .22), transparent 34rem),
        radial-gradient(circle at 88% 14%, rgba(214, 35, 255, .13), transparent 30rem),
        linear-gradient(160deg, var(--dxf-bg-0), var(--dxf-bg-1) 58%, #020713) fixed !important;
}

body.is-auth::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    opacity: .18;
    background-image:
        linear-gradient(rgba(67, 145, 255, .12) 1px, transparent 1px),
        linear-gradient(90deg, rgba(67, 145, 255, .09) 1px, transparent 1px);
    background-size: 72px 72px;
    mask-image: linear-gradient(to bottom, #000, transparent 76%);
}

.app-frame {
    background: transparent !important;
}

.app-main {
    position: relative;
}

.game-header {
    border-bottom: 1px solid rgba(86, 143, 255, .22) !important;
    background: rgba(3, 9, 25, .88) !important;
    box-shadow: 0 12px 32px rgba(0, 0, 0, .24);
    backdrop-filter: blur(22px) saturate(145%);
}

.mobile-brand {
    display: none;
    align-items: center;
    min-width: 0;
}

.mobile-brand img {
    display: block;
    width: clamp(106px, 28vw, 154px);
    max-height: 45px;
    object-fit: contain;
    object-position: left center;
}

.resource-pill,
.plus-btn,
.player-avatar {
    border-color: rgba(99, 134, 255, .42) !important;
    background: linear-gradient(150deg, rgba(20, 34, 76, .92), rgba(5, 12, 34, .92)) !important;
    box-shadow: inset 0 0 18px rgba(41, 107, 255, .09), 0 8px 22px rgba(0, 0, 0, .22) !important;
}

.resource-pill.diamond {
    border-color: rgba(54, 221, 255, .54) !important;
}

.resource-pill.coins {
    border-color: rgba(255, 200, 87, .46) !important;
}

.resource-pill.messages {
    border-color: rgba(255, 57, 211, .42) !important;
}

.side-nav {
    background:
        radial-gradient(circle at 22% 8%, rgba(81, 78, 255, .2), transparent 14rem),
        linear-gradient(180deg, rgba(4, 12, 32, .99), rgba(5, 9, 25, .99)) !important;
    border-right: 1px solid rgba(91, 129, 255, .26) !important;
}

.side-link,
.desktop-nav-logout button {
    border: 1px solid transparent !important;
    border-radius: 14px !important;
}

.side-link:hover,
.side-link.active {
    color: #fff !important;
    border-color: rgba(104, 121, 255, .42) !important;
    background: linear-gradient(110deg, rgba(73, 66, 193, .3), rgba(229, 39, 222, .12)) !important;
    box-shadow: inset 3px 0 0 var(--dxf-pink), 0 8px 24px rgba(0, 0, 0, .22);
}

.panel,
.modal-card,
.empty-state {
    border-color: var(--dxf-line-soft) !important;
    background: linear-gradient(145deg, rgba(12, 26, 57, .94), rgba(6, 14, 35, .94)) !important;
    box-shadow: var(--dxf-shadow);
}

.primary-btn,
.pink-btn,
.orange-btn,
.dxf-primary-action {
    color: #fff !important;
    border: 1px solid rgba(255, 139, 240, .78) !important;
    background: linear-gradient(100deg, #8e35ff, #f42bc9 58%, #ff28a8) !important;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, .08) inset, 0 0 24px rgba(239, 42, 204, .26) !important;
}

.ghost-btn,
.tab,
.chip,
.filter-chip {
    color: #fff !important;
    border-color: rgba(100, 151, 255, .36) !important;
    background: rgba(8, 20, 48, .82) !important;
}

.dxf-v2-page {
    display: grid;
    gap: 22px;
    width: min(100%, 1280px);
    margin: 0 auto;
    padding-bottom: 24px;
}

.dxf-home-command-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 9px;
}

.dxf-home-command-grid > a {
    min-width: 0;
    min-height: 112px;
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-content: center;
    gap: 3px 10px;
    padding: 13px;
    color: #fff;
    border: 1px solid rgba(88, 148, 255, .34);
    border-radius: 19px;
    background: linear-gradient(145deg, rgba(11, 28, 62, .94), rgba(8, 15, 37, .95));
    text-decoration: none;
    box-shadow: 0 12px 26px rgba(0, 0, 0, .22);
}

.dxf-home-command-grid > a > span {
    grid-row: 1 / 3;
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    overflow: hidden;
    color: var(--dxf-cyan);
    font-size: 1.25rem;
    border-radius: 15px;
    background: rgba(41, 120, 255, .12);
}

.dxf-home-command-grid .tone-violet { color: #bd82ff; background: rgba(157, 77, 255, .12); }
.dxf-home-command-grid .tone-pink { color: var(--dxf-pink); background: rgba(255, 57, 211, .11); }
.dxf-home-command-grid .tone-gold { color: var(--dxf-gold); background: rgba(255, 200, 87, .1); }
.dxf-home-command-grid b { align-self: end; overflow: hidden; font-size: .76rem; text-overflow: ellipsis; white-space: nowrap; }
.dxf-home-command-grid small { align-self: start; color: var(--dxf-muted); font-size: .56rem; font-weight: 720; line-height: 1.2; }
.dxf-home-command-grid .dxf-weekly-chest { background: rgba(255, 174, 56, .11); }
.dxf-home-command-grid .dxf-weekly-chest .dxf-design-media { position: static; width: 100%; height: 100%; }
.dxf-home-command-grid .dxf-weekly-chest img { width: 100%; height: 100%; object-fit: contain; }

.dxf-page-title {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 8px 2px 0;
}

.dxf-page-title-icon {
    display: grid;
    place-items: center;
    flex: 0 0 62px;
    width: 62px;
    height: 62px;
    color: #fff;
    font-size: 1.72rem;
    border: 1px solid rgba(160, 115, 255, .6);
    border-radius: 20px;
    background: linear-gradient(145deg, rgba(66, 53, 185, .64), rgba(224, 30, 208, .34));
    box-shadow: 0 0 30px rgba(165, 50, 255, .24);
}

.dxf-page-title small,
.dxf-section header small {
    color: var(--dxf-cyan);
    font-size: .7rem;
    font-weight: 950;
    letter-spacing: .14em;
}

.dxf-page-title h1,
.dxf-page-title p,
.dxf-section h2 {
    margin: 0;
}

.dxf-page-title h1 {
    margin-top: 2px;
    font-size: clamp(2rem, 5vw, 3.6rem);
    line-height: .98;
    letter-spacing: -.045em;
    text-shadow: 0 0 28px rgba(89, 146, 255, .18);
}

.dxf-page-title p {
    margin-top: 7px;
    color: var(--dxf-muted);
    font-size: clamp(.82rem, 1.5vw, 1.02rem);
    font-weight: 700;
}

.dxf-feature-hero {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(280px, .92fr);
    min-height: 360px;
    overflow: hidden;
    border: 1px solid var(--dxf-line);
    border-radius: var(--dxf-radius-xl);
    background:
        radial-gradient(circle at 82% 34%, rgba(54, 221, 255, .2), transparent 32%),
        linear-gradient(135deg, rgba(10, 30, 69, .98), rgba(7, 15, 39, .98));
    box-shadow: 0 0 0 1px rgba(80, 192, 255, .05) inset, var(--dxf-shadow);
}

.dxf-feature-hero.tone-pink {
    border-color: rgba(255, 57, 211, .48);
    background: radial-gradient(circle at 82% 34%, rgba(255, 57, 211, .22), transparent 34%), linear-gradient(135deg, rgba(19, 23, 67, .98), rgba(37, 7, 53, .98));
}

.dxf-feature-hero.tone-violet {
    border-color: rgba(157, 77, 255, .55);
    background: radial-gradient(circle at 80% 30%, rgba(157, 77, 255, .25), transparent 34%), linear-gradient(135deg, rgba(12, 23, 60, .98), rgba(29, 9, 55, .98));
}

.dxf-feature-hero.tone-gold {
    border-color: rgba(255, 200, 87, .55);
    background: radial-gradient(circle at 82% 32%, rgba(255, 185, 65, .21), transparent 34%), linear-gradient(135deg, rgba(14, 25, 61, .98), rgba(45, 24, 25, .98));
}

.dxf-feature-content {
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 10px;
    padding: clamp(24px, 5vw, 54px);
}

.dxf-feature-content h2,
.dxf-feature-content p {
    margin: 0;
}

.dxf-feature-content h2 {
    max-width: 640px;
    font-size: clamp(1.7rem, 3.5vw, 3rem);
    line-height: 1.02;
    letter-spacing: -.035em;
}

.dxf-feature-content p {
    max-width: 620px;
    color: #b6c9ec;
    font-size: clamp(.84rem, 1.4vw, 1.02rem);
    font-weight: 700;
    line-height: 1.55;
}

.dxf-kicker {
    color: var(--dxf-pink);
    font-size: .72rem;
    font-weight: 950;
    letter-spacing: .14em;
}

.tone-cyan .dxf-kicker { color: var(--dxf-cyan); }
.tone-gold .dxf-kicker { color: var(--dxf-gold); }

.dxf-feature-art {
    grid-column: 2;
    grid-row: 1;
    position: relative;
    min-height: 360px;
    overflow: hidden;
}

.dxf-feature-art::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(90deg, #0a1b3f 0%, rgba(10, 27, 63, .32) 32%, transparent 70%);
}

.dxf-feature-art img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dxf-design-media.is-fallback {
    display: grid;
    place-items: center;
    background:
        radial-gradient(circle at 60% 35%, rgba(54, 221, 255, .2), transparent 23%),
        radial-gradient(circle at 72% 65%, rgba(255, 57, 211, .18), transparent 25%),
        linear-gradient(145deg, #101c48, #080d28);
}

.dxf-design-media.is-fallback::after {
    content: "";
    position: absolute;
    inset: 12%;
    border: 1px solid rgba(126, 164, 255, .13);
    border-radius: 50%;
    box-shadow: 0 0 70px rgba(68, 171, 255, .16);
}

.dxf-media-mark {
    color: rgba(255, 255, 255, .07);
    font-size: clamp(4rem, 10vw, 9rem);
    font-style: italic;
    font-weight: 1000;
    letter-spacing: -.12em;
}

.dxf-primary-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 46px;
    margin-top: 8px;
    padding: 0 22px;
    border-radius: 15px;
    font-size: .84rem;
    font-style: normal;
    font-weight: 950;
    text-decoration: none;
}

.dxf-progress {
    width: min(100%, 520px);
    height: 12px;
    margin-top: 8px;
    overflow: hidden;
    border: 1px solid rgba(103, 158, 255, .52);
    border-radius: 999px;
    background: rgba(1, 6, 22, .8);
}

.dxf-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #6950ff, var(--dxf-pink), var(--dxf-cyan));
    box-shadow: 0 0 16px rgba(255, 57, 211, .6);
}

.dxf-chip-row {
    display: flex;
    gap: 9px;
    overflow-x: auto;
    padding: 2px 1px 5px;
    scrollbar-width: none;
}

.dxf-chip-row::-webkit-scrollbar { display: none; }

.dxf-chip-row a {
    flex: 0 0 auto;
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    color: #c1d1ef;
    border: 1px solid rgba(104, 151, 255, .34);
    border-radius: 999px;
    background: rgba(7, 19, 45, .84);
    font-size: .74rem;
    font-weight: 900;
    text-decoration: none;
}

.dxf-chip-row a.is-active {
    color: #fff;
    border-color: rgba(255, 113, 233, .82);
    background: linear-gradient(100deg, rgba(119, 59, 255, .9), rgba(242, 42, 201, .86));
    box-shadow: 0 0 22px rgba(227, 51, 255, .3);
}

.dxf-section {
    display: grid;
    gap: 13px;
}

.dxf-section > header {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 12px;
}

.dxf-section h2 {
    margin-top: 3px;
    font-size: clamp(1.28rem, 2.5vw, 1.82rem);
}

.dxf-hub-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.dxf-hub-card {
    position: relative;
    min-height: 126px;
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr) auto;
    align-items: center;
    gap: 13px;
    overflow: hidden;
    padding: 18px;
    color: var(--dxf-text);
    border: 1px solid rgba(80, 160, 255, .38);
    border-radius: var(--dxf-radius-lg);
    background: linear-gradient(145deg, rgba(11, 29, 64, .94), rgba(7, 15, 38, .96));
    box-shadow: 0 15px 32px rgba(0, 0, 0, .24), inset 0 0 34px rgba(43, 129, 255, .045);
    text-decoration: none;
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.dxf-hub-card:hover {
    transform: translateY(-3px);
    border-color: rgba(88, 217, 255, .72);
    box-shadow: 0 18px 36px rgba(0, 0, 0, .3), 0 0 24px rgba(54, 221, 255, .1);
}

.dxf-hub-card.tone-pink { border-color: rgba(255, 57, 211, .4); }
.dxf-hub-card.tone-violet { border-color: rgba(157, 77, 255, .44); }
.dxf-hub-card.tone-gold { border-color: rgba(255, 200, 87, .4); }

.dxf-hub-icon {
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    color: var(--dxf-cyan);
    font-size: 1.35rem;
    border: 1px solid rgba(54, 221, 255, .32);
    border-radius: 17px;
    background: rgba(42, 124, 255, .14);
    box-shadow: inset 0 0 20px rgba(54, 221, 255, .1);
}

.tone-pink .dxf-hub-icon { color: var(--dxf-pink); border-color: rgba(255, 57, 211, .34); background: rgba(255, 57, 211, .11); }
.tone-violet .dxf-hub-icon { color: #c487ff; border-color: rgba(157, 77, 255, .36); background: rgba(157, 77, 255, .12); }
.tone-gold .dxf-hub-icon { color: var(--dxf-gold); border-color: rgba(255, 200, 87, .36); background: rgba(255, 200, 87, .1); }

.dxf-hub-copy {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.dxf-hub-copy b { font-size: 1rem; }
.dxf-hub-copy em { color: var(--dxf-muted); font-size: .72rem; font-style: normal; font-weight: 680; line-height: 1.4; }
.dxf-hub-copy small { color: var(--dxf-cyan); font-size: .62rem; font-weight: 900; }
.dxf-hub-arrow { color: rgba(222, 232, 255, .72); }

.dxf-stat-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.dxf-stat-grid article {
    min-height: 108px;
    display: grid;
    align-content: center;
    gap: 4px;
    padding: 18px;
    border: 1px solid rgba(97, 142, 255, .34);
    border-radius: var(--dxf-radius-lg);
    background: linear-gradient(145deg, rgba(16, 31, 66, .92), rgba(8, 16, 39, .94));
}

.dxf-stat-grid small { color: var(--dxf-cyan); font-size: .62rem; font-weight: 950; letter-spacing: .1em; }
.dxf-stat-grid strong { font-size: clamp(1.5rem, 3vw, 2.25rem); }
.dxf-stat-grid span { color: var(--dxf-muted); font-size: .72rem; font-weight: 750; }

.dxf-avatar-teaser-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 11px;
}

.dxf-avatar-teaser-grid > a {
    min-width: 0;
    display: grid;
    gap: 6px;
    padding: 8px 8px 11px;
    color: #fff;
    border: 1px solid rgba(91, 145, 255, .4);
    border-radius: 18px;
    background: rgba(9, 22, 51, .9);
    text-decoration: none;
}

.dxf-avatar-teaser-grid > a > span {
    position: relative;
    aspect-ratio: .86;
    overflow: hidden;
    border-radius: 13px;
    background: linear-gradient(145deg, rgba(51, 82, 162, .25), rgba(189, 37, 209, .15));
}

.dxf-avatar-teaser-grid img,
.dxf-avatar-teaser-grid video,
.dxf-avatar-teaser-grid .avatar-display {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.dxf-avatar-teaser-grid b { overflow: hidden; font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }
.dxf-avatar-teaser-grid small { color: var(--dxf-cyan); font-size: .56rem; font-weight: 850; }

.dxf-empty-state {
    min-height: 270px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 9px;
    padding: 28px;
    text-align: center;
    border: 1px dashed rgba(105, 153, 255, .42);
    border-radius: var(--dxf-radius-xl);
    background: radial-gradient(circle at 50% 42%, rgba(156, 74, 255, .13), transparent 30%), rgba(8, 18, 42, .82);
}

.dxf-empty-state > i { color: var(--dxf-pink); font-size: 2.2rem; }
.dxf-empty-state h2,
.dxf-empty-state p { margin: 0; }
.dxf-empty-state p { color: var(--dxf-muted); font-size: .8rem; }

.dxf-embedded-profile {
    display: grid;
    gap: 16px;
}

.dxf-embedded-profile > .dxf-existing-page-hero {
    display: none;
}

.dxf-existing-page-hero {
    position: relative;
    min-height: 180px;
    margin: 0 0 18px;
    overflow: hidden;
    border: 1px solid rgba(80, 158, 255, .4);
    border-radius: 24px;
    background: linear-gradient(145deg, rgba(14, 32, 71, .96), rgba(18, 8, 43, .96));
    box-shadow: var(--dxf-shadow);
}

.dxf-existing-page-hero .dxf-design-media {
    position: absolute;
    inset: 0;
}

.dxf-existing-page-hero .dxf-design-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dxf-existing-page-hero .dxf-design-media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(3, 10, 29, .95), rgba(3, 10, 29, .42) 58%, rgba(3, 10, 29, .08));
}

.dxf-existing-page-hero-copy {
    position: relative;
    z-index: 2;
    min-height: 180px;
    width: min(68%, 640px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 5px;
    padding: 24px;
}

.dxf-existing-page-hero-copy small { color: var(--dxf-cyan); font-size: .62rem; font-weight: 950; letter-spacing: .13em; }
.dxf-existing-page-hero-copy h1,
.dxf-existing-page-hero-copy p { margin: 0; }
.dxf-existing-page-hero-copy h1 { font-size: clamp(1.5rem, 3vw, 2.4rem); line-height: 1; }
.dxf-existing-page-hero-copy p { color: var(--dxf-muted); font-size: .78rem; font-weight: 700; }

.admin-slot-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.admin-disable-btn {
    color: #ff98b8 !important;
    border-color: rgba(255, 79, 131, .4) !important;
}

.admin-home-slot.is-disabled {
    opacity: .58;
    filter: saturate(.35);
}

.admin-home-slot em {
    text-transform: none !important;
}

@media (min-width: 761px) {
    .app-main {
        width: min(100%, 1440px) !important;
        max-width: none !important;
        padding-right: clamp(22px, 3vw, 46px) !important;
        padding-left: clamp(22px, 3vw, 46px) !important;
    }

    .bottom-nav { display: none !important; }
}

@media (max-width: 1080px) {
    .dxf-home-command-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .dxf-hub-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dxf-avatar-teaser-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    body.is-auth {
        padding-bottom: calc(86px + env(safe-area-inset-bottom)) !important;
    }

    .game-header {
        min-height: 75px !important;
        display: grid !important;
        grid-template-columns: minmax(94px, 1fr) auto;
        align-items: center;
        gap: 8px;
        padding: 9px 12px !important;
    }

    .mobile-brand { display: flex; }

    .resource-strip {
        display: flex !important;
        align-items: center;
        justify-content: flex-end;
        gap: 6px !important;
        min-width: 0;
        padding: 0 !important;
    }

    .resource-group {
        display: flex !important;
        align-items: center;
        justify-content: flex-end;
        gap: 5px !important;
        min-width: 0;
    }

    .player-chip { order: 5; }
    .resource-pill.coins { order: 1; }
    .resource-pill.diamond { order: 2; }
    .resource-pill.messages { order: 3; }
    .resource-pill.push-settings { display: none !important; }
    .plus-btn { order: 4; }

    .resource-pill {
        min-width: 0 !important;
        height: 34px !important;
        min-height: 34px !important;
        padding: 0 8px !important;
        border-radius: 12px !important;
        gap: 4px !important;
    }

    .resource-pill img { width: 20px !important; height: 20px !important; }
    .resource-pill b { font-size: .66rem !important; }
    .resource-pill.messages { width: 34px !important; padding: 0 !important; }
    .resource-pill.messages b { position: absolute; transform: translate(11px, -11px); min-width: 15px; height: 15px; display: grid; place-items: center; border-radius: 99px; background: var(--dxf-pink); font-size: .48rem !important; }
    .plus-btn { display: none !important; }
    .player-avatar { width: 37px !important; height: 37px !important; }

    .app-main {
        padding-top: 13px !important;
        padding-right: 12px !important;
        padding-left: 12px !important;
        padding-bottom: 22px !important;
    }

    .bottom-nav {
        left: 50% !important;
        bottom: 0 !important;
        z-index: 70 !important;
        width: 100% !important;
        max-width: none !important;
        min-height: calc(78px + env(safe-area-inset-bottom)) !important;
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        gap: 0 !important;
        padding: 5px 5px env(safe-area-inset-bottom) !important;
        transform: translateX(-50%);
        border: 0 !important;
        border-top: 1px solid rgba(95, 135, 255, .35) !important;
        border-radius: 24px 24px 0 0 !important;
        background: rgba(4, 10, 29, .96) !important;
        box-shadow: 0 -16px 44px rgba(0, 0, 0, .42), 0 -1px 0 rgba(255, 57, 211, .08) inset !important;
        backdrop-filter: blur(24px) saturate(150%);
    }

    .bottom-link {
        position: relative;
        min-width: 0 !important;
        min-height: 70px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 1px !important;
        padding: 3px 1px !important;
        color: #b7c7e8 !important;
        border: 0 !important;
        border-radius: 16px !important;
        background: transparent !important;
        font-size: .56rem !important;
        font-weight: 850 !important;
        text-decoration: none;
    }

    .bottom-link::before {
        content: "";
        position: absolute;
        top: -5px;
        left: 20%;
        right: 20%;
        height: 3px;
        border-radius: 999px;
        background: transparent;
    }

    .bottom-link.active {
        color: #ff74e2 !important;
        background: radial-gradient(circle at 50% 28%, rgba(255, 46, 210, .18), transparent 58%) !important;
    }

    .bottom-link.active::before {
        background: linear-gradient(90deg, var(--dxf-violet), var(--dxf-pink));
        box-shadow: 0 0 12px var(--dxf-pink);
    }

    .bottom-link .nav-ico {
        width: 50px !important;
        height: 50px !important;
        margin: -4px 0 -3px !important;
        padding: 0 !important;
        overflow: visible !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: none !important;
        box-shadow: none !important;
    }

    .bottom-link .nav-ico img {
        width: 100% !important;
        height: 100% !important;
        object-fit: contain !important;
        filter: saturate(.7) brightness(.95);
        transform: scale(.86);
        transition: transform .2s ease, filter .2s ease;
    }

    .bottom-link.active .nav-ico img {
        filter: saturate(1.22) brightness(1.12) drop-shadow(0 0 8px rgba(255, 48, 213, .55));
        transform: scale(1);
    }

    .dxf-v2-page { gap: 15px; }
    .dxf-home-command-grid { display: flex; overflow-x: auto; gap: 8px; padding-bottom: 3px; scrollbar-width: none; }
    .dxf-home-command-grid::-webkit-scrollbar { display: none; }
    .dxf-home-command-grid > a { flex: 0 0 150px; min-height: 82px; grid-template-columns: 38px minmax(0, 1fr); padding: 9px; border-radius: 16px; }
    .dxf-home-command-grid > a > span { width: 38px; height: 38px; border-radius: 12px; font-size: 1rem; }
    .dxf-home-command-grid b { font-size: .68rem; }
    .dxf-home-command-grid small { font-size: .5rem; }
    .dxf-page-title { gap: 10px; }
    .dxf-page-title-icon { flex-basis: 48px; width: 48px; height: 48px; border-radius: 15px; font-size: 1.25rem; }
    .dxf-page-title h1 { font-size: 2rem; }
    .dxf-page-title p { margin-top: 4px; font-size: .72rem; line-height: 1.3; }
    .dxf-page-title small { font-size: .55rem; }

    .dxf-feature-hero {
        grid-template-columns: 1fr;
        min-height: 0;
        border-radius: 21px;
    }

    .dxf-feature-art {
        grid-column: 1;
        grid-row: 1;
        min-height: 190px;
        max-height: 230px;
    }

    .dxf-feature-art::before {
        background: linear-gradient(0deg, #091b3e 0%, rgba(9, 27, 62, .18) 48%, transparent 80%);
    }

    .dxf-feature-content {
        grid-column: 1;
        grid-row: 2;
        padding: 17px;
    }

    .dxf-feature-content h2 { font-size: 1.45rem; }
    .dxf-feature-content p { font-size: .72rem; }
    .dxf-feature-content > small { color: var(--dxf-muted); font-size: .6rem; }
    .dxf-primary-action { min-height: 42px; width: 100%; padding: 0 14px; font-size: .72rem; }
    .dxf-chip-row a { min-height: 38px; padding: 0 14px; font-size: .66rem; }
    .dxf-hub-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
    .dxf-hub-card { min-height: 126px; grid-template-columns: 42px minmax(0, 1fr); align-content: center; gap: 9px; padding: 12px 10px; border-radius: 17px; }
    .dxf-hub-icon { width: 42px; height: 42px; border-radius: 14px; font-size: 1rem; }
    .dxf-hub-arrow { display: none; }
    .dxf-hub-copy b { font-size: .76rem; }
    .dxf-hub-copy em { font-size: .58rem; line-height: 1.3; }
    .dxf-hub-copy small { grid-column: 1 / -1; font-size: .51rem; }
    .dxf-section h2 { font-size: 1.08rem; }
    .dxf-section header small { font-size: .52rem; }
    .dxf-stat-grid { gap: 7px; }
    .dxf-stat-grid article { min-height: 82px; padding: 10px; border-radius: 16px; }
    .dxf-stat-grid small { font-size: .48rem; }
    .dxf-stat-grid strong { font-size: 1rem; }
    .dxf-stat-grid span { font-size: .54rem; }
    .dxf-avatar-teaser-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .dxf-existing-page-hero { min-height: 132px; margin-bottom: 12px; border-radius: 19px; }
    .dxf-existing-page-hero-copy { min-height: 132px; width: 74%; padding: 15px; }
    .dxf-existing-page-hero-copy h1 { font-size: 1.35rem; }
    .dxf-existing-page-hero-copy p { font-size: .64rem; }
    .admin-slot-actions { grid-template-columns: 1fr; }
}

@media (max-width: 430px) {
    .game-header { grid-template-columns: minmax(82px, .82fr) auto; padding-right: 8px !important; padding-left: 9px !important; }
    .mobile-brand img { width: 98px; }
    .resource-pill { padding: 0 6px !important; }
    .resource-pill img { width: 17px !important; height: 17px !important; }
    .resource-pill b { font-size: .58rem !important; }
    .player-avatar { width: 34px !important; height: 34px !important; }
    .bottom-link .nav-ico { width: 46px !important; height: 46px !important; }
    .dxf-hub-card { min-height: 116px; }
}

@media (max-width: 350px) {
    .resource-pill.coins { display: none !important; }
    .dxf-hub-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .dxf-hub-card,
    .bottom-link .nav-ico img { transition: none; }
}

/* Final home composition */
.player-level-meta {
    display: grid;
    gap: 1px;
    color: #fff;
    line-height: 1;
}

.player-level-meta b { font-size: .68rem; }
.player-level-meta small { color: var(--dxf-muted); font-size: .52rem; font-weight: 850; }

body.page-home .app-main {
    width: min(100%, 1480px) !important;
}

.home3-page {
    display: grid;
    gap: clamp(18px, 2.1vw, 30px);
    width: min(100%, 1360px);
    margin: 0 auto;
    padding-bottom: 28px;
}

.home3-hero,
.home3-panel,
.home3-feature-card,
.home3-community {
    border: 1px solid rgba(75, 142, 255, .36);
    box-shadow: 0 20px 50px rgba(0, 0, 0, .3), inset 0 0 0 1px rgba(255, 255, 255, .025);
}

.home3-hero {
    position: relative;
    min-height: clamp(330px, 34vw, 510px);
    overflow: hidden;
    border-color: rgba(189, 80, 255, .68);
    border-radius: 30px;
    background: #06132d;
    box-shadow: 0 0 0 1px rgba(54, 221, 255, .16), 0 24px 60px rgba(0, 0, 0, .36), 0 0 34px rgba(200, 49, 255, .12);
}

.home3-hero-media,
.home3-hero-slide,
.home3-hero-shade {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.home3-hero-slide {
    z-index: 1;
    object-fit: cover;
    opacity: 0;
    transform: scale(1.025);
    transition: opacity .55s ease, transform 3.2s ease;
}

.home3-hero-slide.is-active { opacity: 1; transform: scale(1); }

.home3-hero-shade {
    z-index: 2;
    background: linear-gradient(90deg, rgba(2, 8, 27, .92) 0%, rgba(3, 10, 31, .64) 40%, rgba(3, 10, 31, .06) 72%), linear-gradient(0deg, rgba(3, 8, 25, .55), transparent 45%);
    pointer-events: none;
}

.home3-hero-copy {
    position: relative;
    z-index: 3;
    width: min(58%, 690px);
    min-height: clamp(330px, 34vw, 510px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 12px;
    padding: clamp(28px, 5vw, 72px);
}

.home3-hero-copy small,
.home3-section-head small {
    color: var(--dxf-cyan);
    font-size: .72rem;
    font-weight: 950;
    letter-spacing: .14em;
}

.home3-hero-copy h1,
.home3-hero-copy p { margin: 0; }
.home3-hero-copy h1 { font-size: clamp(2.15rem, 5vw, 4.6rem); line-height: .96; letter-spacing: -.045em; text-shadow: 0 4px 24px rgba(0, 0, 0, .72); }
.home3-hero-copy p { max-width: 560px; color: #d9e6ff; font-size: clamp(.82rem, 1.4vw, 1.08rem); font-weight: 720; line-height: 1.45; text-shadow: 0 2px 12px #000; }
.home3-hero-copy > a { min-height: 52px; display: inline-flex; align-items: center; gap: 13px; margin-top: 8px; padding: 0 24px; color: #fff; border: 2px solid #72cfff; border-radius: 999px; background: rgba(6, 32, 81, .76); box-shadow: 0 0 24px rgba(54, 221, 255, .35), inset 0 0 18px rgba(54, 221, 255, .12); font-size: .82rem; font-weight: 950; text-decoration: none; text-transform: uppercase; }

.home3-hero-dots { position: absolute; z-index: 4; left: 50%; bottom: 15px; display: flex; gap: 8px; transform: translateX(-50%); }
.home3-hero-dots button { width: 11px; height: 11px; padding: 0; border: 0; border-radius: 50%; background: rgba(203, 216, 250, .5); box-shadow: none; }
.home3-hero-dots button.is-active { background: var(--dxf-pink); box-shadow: 0 0 13px rgba(255, 57, 211, .8); }

.home3-panel {
    padding: clamp(17px, 2vw, 27px);
    border-radius: 27px;
    background: radial-gradient(circle at 88% 14%, rgba(70, 101, 255, .12), transparent 30%), linear-gradient(145deg, rgba(10, 28, 62, .96), rgba(5, 16, 42, .97));
}

.home3-section-head {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) auto;
    gap: 13px;
    align-items: center;
    margin-bottom: 17px;
}

.home3-title-icon { width: 48px; height: 48px; display: grid; place-items: center; color: #fff; border-radius: 14px; font-size: 1.25rem; }
.home3-title-icon.pink { background: linear-gradient(145deg, #e62ccc, #774cff); box-shadow: 0 0 22px rgba(237, 48, 219, .28); }
.home3-title-icon.cyan { background: linear-gradient(145deg, #1677ff, #20d9ef); box-shadow: 0 0 22px rgba(54, 221, 255, .24); }
.home3-section-head h2 { margin: 2px 0 0; color: #fff; font-size: clamp(1.2rem, 2vw, 1.7rem); line-height: 1; }
.home3-section-head > strong,
.home3-section-head > a { color: #c9d9f8; font-size: .73rem; font-weight: 850; text-decoration: none; }

.home3-daily-layout { display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(250px, .8fr); gap: 15px; }
.home3-task-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.home3-task { min-width: 0; min-height: 178px; display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto auto auto auto; gap: 5px 8px; padding: 16px; color: #fff; border: 1px solid rgba(81, 153, 255, .48); border-radius: 20px; background: linear-gradient(155deg, rgba(13, 48, 93, .9), rgba(7, 21, 54, .96)); text-decoration: none; }
.home3-task.is-done { border-color: rgba(44, 232, 157, .7); background: linear-gradient(155deg, rgba(9, 77, 66, .72), rgba(5, 34, 46, .95)); }
.home3-task-status { grid-column: 1 / -1; width: 48px; height: 48px; display: grid; place-items: center; margin-bottom: 4px; color: #c9d8ff; border-radius: 50%; background: rgba(94, 125, 255, .18); font-size: 1.15rem; }
.home3-task.is-done .home3-task-status { color: #fff; background: linear-gradient(145deg, #28d892, #147b60); box-shadow: 0 0 20px rgba(45, 235, 162, .35); }
.home3-task h3,
.home3-task p { grid-column: 1 / -1; margin: 0; }
.home3-task h3 { font-size: .88rem; }
.home3-task p { color: #c0d2f3; font-size: .66rem; font-weight: 750; line-height: 1.3; }
.home3-task > div { align-self: center; height: 8px; overflow: hidden; border-radius: 999px; background: rgba(157, 175, 221, .2); }
.home3-task > div i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #756bff, #36ddff); }
.home3-task.is-done > div i { background: linear-gradient(90deg, #30d898, #7dffc7); }
.home3-task > b { align-self: center; color: #b9c9ec; font-size: .7rem; }

.home3-daily-reward { min-height: 178px; display: grid; grid-template-columns: minmax(110px, .8fr) minmax(130px, 1fr); gap: 12px; align-items: center; padding: 14px; color: #fff; border: 1px solid rgba(101, 147, 255, .42); border-radius: 20px; background: radial-gradient(circle at 25% 40%, rgba(255, 186, 69, .15), transparent 36%), linear-gradient(145deg, rgba(21, 29, 67, .94), rgba(8, 18, 46, .98)); text-decoration: none; }
.home3-reward-art { min-width: 0; display: grid; place-items: center; }
.home3-reward-art img { width: 100%; max-height: 154px; object-fit: contain; filter: drop-shadow(0 12px 18px rgba(0, 0, 0, .38)); }
.home3-reward-art > i { color: var(--dxf-gold); font-size: 4rem; }
.home3-daily-reward > span:last-child { display: grid; gap: 7px; }
.home3-daily-reward small { color: #fff; font-size: .69rem; font-weight: 950; }
.home3-daily-reward b { color: var(--dxf-pink); font-size: 1.45rem; }
.home3-daily-reward em { color: var(--dxf-muted); font-size: .62rem; font-style: normal; font-weight: 800; }
.home3-daily-reward > span > i,
.home3-feature-body > span:first-child > i { height: 10px; overflow: hidden; border: 1px solid rgba(89, 144, 255, .5); border-radius: 999px; background: rgba(2, 9, 28, .72); }
.home3-daily-reward u,
.home3-feature-body u { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #a940ff, #ff45ce 62%, #43ddff); }

.home3-feature-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px; }
.home3-feature-card { min-width: 0; min-height: 245px; overflow: hidden; color: #fff; border-radius: 25px; background: linear-gradient(145deg, rgba(24, 24, 67, .98), rgba(7, 18, 47, .98)); text-decoration: none; }
.home3-feature-card.fast { border-color: rgba(177, 75, 255, .46); }
.home3-feature-card.wish { border-color: rgba(255, 57, 211, .54); }
.home3-feature-card.weekly { border-color: rgba(171, 92, 255, .5); }
.home3-feature-card.event { border-color: rgba(54, 221, 255, .48); }
.home3-feature-card > header { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 20px; background: linear-gradient(90deg, rgba(110, 35, 168, .34), rgba(20, 31, 73, .18)); }
.home3-feature-card > header span { display: flex; align-items: center; gap: 10px; color: #f49cff; font-size: .83rem; font-weight: 950; }
.home3-feature-card.fast > header span i,
.home3-feature-card.weekly > header span i { color: var(--dxf-gold); }
.home3-feature-card.event > header span { color: var(--dxf-cyan); }
.home3-feature-card > header > i { color: rgba(190, 205, 241, .72); }
.home3-feature-body { min-height: 187px; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(130px, .75fr); align-items: stretch; }
.home3-feature-body > span:first-child { position: relative; z-index: 2; display: grid; align-content: center; gap: 9px; padding: 19px 8px 19px 22px; }
.home3-feature-body small { color: #e9efff; font-size: .94rem; font-weight: 900; }
.home3-feature-body strong { display: flex; align-items: center; gap: 7px; font-size: clamp(1.35rem, 2.6vw, 2.15rem); line-height: 1; }
.home3-feature-body strong img { width: 24px; height: 24px; object-fit: contain; }
.home3-feature-body em,
.home3-feature-body p { margin: 0; color: #becff0; font-size: .72rem; font-style: normal; font-weight: 760; line-height: 1.35; }
.home3-feature-body > span:first-child > b { width: max-content; display: inline-flex; align-items: center; gap: 8px; margin-top: 2px; padding: 8px 12px; color: #fff; border: 1px solid rgba(83, 156, 255, .54); border-radius: 999px; background: rgba(28, 84, 179, .33); font-size: .64rem; }
.home3-feature-body > span:first-child > i.is-prepared { opacity: .48; }
.home3-feature-art { position: relative; min-width: 0; display: grid; place-items: end center; overflow: hidden; color: rgba(133, 175, 255, .68); font-size: 5rem; background: radial-gradient(circle at 50% 64%, rgba(62, 114, 255, .22), transparent 58%); }
.home3-feature-art::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(8, 18, 48, .88), transparent 48%); pointer-events: none; }
.home3-feature-art > img,
.home3-wish-avatar,
.home3-feature-art .avatar-static-shell,
.home3-feature-art .dxf-design-media { width: 100%; height: 100%; }
.home3-feature-art > img,
.home3-wish-avatar,
.home3-feature-art .dxf-design-media img { object-fit: contain; object-position: center bottom; }
.home3-feature-art .avatar-static-shell { position: relative; display: block; }
.home3-feature-art .avatar-static-shell img { width: 100%; height: 100%; }
.home3-feature-art.chest img { padding: 8px; }
.home3-feature-art.event-art { align-items: stretch; }
.home3-feature-art.event-art .dxf-design-media { position: relative; inset: auto; min-height: 100%; }
.home3-feature-art.event-art .dxf-design-media.is-fallback { background: radial-gradient(circle, rgba(55, 144, 255, .22), transparent 64%); }

.home3-quick-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.home3-quick-grid > a { min-width: 0; min-height: 220px; display: grid; grid-template-rows: minmax(0, 1fr) auto; overflow: hidden; color: #fff; border: 1px solid rgba(81, 154, 255, .48); border-radius: 20px; background: #07162f; text-decoration: none; box-shadow: 0 12px 30px rgba(0, 0, 0, .28); }
.home3-quick-grid > a:nth-child(odd) { border-color: rgba(236, 60, 223, .48); }
.home3-quick-grid > a > span { min-height: 0; display: grid; place-items: center; overflow: hidden; background: radial-gradient(circle, rgba(86, 75, 220, .28), rgba(5, 15, 39, .8)); }
.home3-quick-grid img { width: 100%; height: 100%; object-fit: cover; }
.home3-quick-grid span > i { color: var(--dxf-cyan); font-size: 3.5rem; }
.home3-quick-grid b { min-height: 48px; display: grid; place-items: center; padding: 8px; background: rgba(4, 10, 28, .9); font-size: .76rem; text-align: center; }

.home3-community { position: relative; min-height: 240px; display: grid; align-items: center; overflow: hidden; color: #fff; border-radius: 27px; background: linear-gradient(125deg, #171443, #081934); text-decoration: none; }
.home3-community > .dxf-design-media { position: absolute; inset: 0; width: 100%; height: 100%; }
.home3-community > .dxf-design-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(4, 8, 26, .94), rgba(8, 12, 38, .54), rgba(8, 12, 38, .12)); }
.home3-community > span { position: relative; z-index: 2; display: grid; gap: 5px; padding: clamp(24px, 5vw, 60px); }
.home3-community small { color: var(--dxf-cyan); font-size: .7rem; font-weight: 950; letter-spacing: .14em; }
.home3-community strong { max-width: 680px; font-size: clamp(1.8rem, 4vw, 3.4rem); line-height: 1; text-transform: uppercase; }
.home3-community em { color: #ff92e7; font-size: clamp(.9rem, 1.7vw, 1.25rem); font-style: normal; font-weight: 800; }
.home3-community > i { position: absolute; z-index: 2; right: 30px; width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; background: rgba(255, 255, 255, .1); }

@media (min-width: 761px) {
    body.is-auth .brand { min-height: 72px !important; padding: 8px 10px !important; }
    body.is-auth .desktop-brand-logo { width: 100% !important; height: 54px !important; flex: 1 1 auto !important; border-radius: 0 !important; object-fit: contain !important; }
    body.is-auth .desktop-brand-name { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip-path: inset(50%) !important; }
    body.page-home .game-header { height: 84px !important; }
    body.page-home .resource-strip { height: 84px !important; padding: 11px 34px !important; }
    body.page-home .player-avatar { width: 50px !important; height: 50px !important; }
    body.page-home .resource-pill { height: 42px !important; min-width: 82px !important; font-size: .86rem !important; }
    body.page-home .plus-btn { width: 42px !important; height: 42px !important; }
}

@media (max-width: 920px) {
    .home3-daily-layout { grid-template-columns: 1fr; }
    .home3-daily-reward { grid-template-columns: 145px minmax(0, 1fr); }
    .home3-quick-grid { gap: 10px; }
    .home3-quick-grid > a { min-height: 180px; }
}

@media (max-width: 760px) {
    body.page-home { padding-bottom: calc(104px + env(safe-area-inset-bottom)) !important; }
    body.page-home .game-header { min-height: 88px !important; grid-template-columns: minmax(140px, .95fr) auto !important; padding: 9px 10px !important; }
    body.page-home .mobile-brand img { width: 140px; max-height: 54px; }
    body.page-home .resource-strip { gap: 4px !important; }
    body.page-home .resource-group { gap: 3px !important; order: 1; }
    body.page-home .player-chip { order: 2; display: grid !important; justify-items: center; gap: 1px; }
    body.page-home .resource-pill.messages { order: 0; }
    body.page-home .resource-pill.coins { order: 1; }
    body.page-home .resource-pill.diamond { order: 2; }
    body.page-home .resource-pill { height: 36px !important; min-height: 36px !important; padding: 0 7px !important; }
    body.page-home .resource-pill b { font-size: .62rem !important; }
    body.page-home .resource-pill img { width: 18px !important; height: 18px !important; }
    body.page-home .resource-pill.messages { width: 36px !important; }
    body.page-home .player-avatar { width: 38px !important; height: 38px !important; }
    body.page-home .player-level-meta { margin-top: -2px; }
    body.page-home .player-level-meta b { font-size: .5rem; }
    body.page-home .player-level-meta small { display: none; }
    body.page-home .app-main { padding: 15px 11px 26px !important; }
    body.page-home .bottom-nav { min-height: calc(96px + env(safe-area-inset-bottom)) !important; padding: 7px 5px env(safe-area-inset-bottom) !important; border-radius: 28px 28px 0 0 !important; }
    body.page-home .bottom-link { min-height: 86px !important; gap: 2px !important; font-size: .63rem !important; }
    body.page-home .bottom-link .nav-ico { width: 60px !important; height: 60px !important; margin: -5px 0 -5px !important; }
    .home3-page { gap: 18px; padding-bottom: 8px; }
    .home3-hero { min-height: 228px; border-radius: 21px; }
    .home3-hero-copy { width: 72%; min-height: 228px; gap: 7px; padding: 18px; }
    .home3-hero-copy small { font-size: .57rem; }
    .home3-hero-copy h1 { font-size: clamp(1.35rem, 7vw, 1.78rem); }
    .home3-hero-copy p { display: none; }
    .home3-hero-copy > a { min-height: 39px; margin-top: 2px; padding: 0 15px; border-width: 1px; font-size: .58rem; }
    .home3-hero-dots { bottom: 9px; gap: 6px; }
    .home3-hero-dots button { width: 8px; height: 8px; }
    .home3-panel { padding: 13px; border-radius: 20px; }
    .home3-section-head { grid-template-columns: 38px minmax(0, 1fr) auto; gap: 9px; margin-bottom: 12px; }
    .home3-title-icon { width: 38px; height: 38px; border-radius: 11px; font-size: 1rem; }
    .home3-section-head small { font-size: .59rem; }
    .home3-section-head h2 { font-size: 1.03rem; }
    .home3-section-head > strong,
    .home3-section-head > a { font-size: .58rem; }
    .home3-task-grid { gap: 7px; }
    .home3-task { min-height: 158px; gap: 4px; padding: 10px 8px; border-radius: 16px; }
    .home3-task-status { width: 38px; height: 38px; font-size: .92rem; }
    .home3-task h3 { font-size: .72rem; }
    .home3-task p { font-size: .59rem; }
    .home3-task > div { height: 6px; }
    .home3-task > b { font-size: .62rem; }
    .home3-daily-layout { grid-template-columns: minmax(0, 3fr) minmax(82px, .9fr); gap: 7px; }
    .home3-daily-reward { min-height: 158px; grid-template-columns: 1fr; grid-template-rows: 72px auto; gap: 3px; padding: 7px 5px; border-radius: 16px; text-align: center; }
    .home3-reward-art img { max-height: 72px; }
    .home3-daily-reward > span:last-child { gap: 3px; }
    .home3-daily-reward small { font-size: .56rem; }
    .home3-daily-reward b { font-size: 1.12rem; }
    .home3-daily-reward em { font-size: .54rem; }
    .home3-feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .home3-feature-card { min-height: 200px; border-radius: 18px; }
    .home3-feature-card > header { min-height: 43px; padding: 0 9px; }
    .home3-feature-card > header span { gap: 6px; font-size: .67rem; }
    .home3-feature-body { min-height: 157px; grid-template-columns: minmax(0, 1fr) 62px; }
    .home3-feature-body > span:first-child { gap: 5px; padding: 11px 1px 11px 10px; }
    .home3-feature-body small { font-size: .7rem; }
    .home3-feature-body strong { gap: 4px; font-size: 1.05rem; }
    .home3-feature-body strong img { width: 16px; height: 16px; }
    .home3-feature-body em,
    .home3-feature-body p { font-size: .57rem; }
    .home3-feature-body > span:first-child > b { padding: 6px 8px; font-size: .55rem; }
    .home3-quick { overflow: hidden; }
    .home3-quick-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; overflow: visible; padding-bottom: 0; }
    .home3-quick-grid > a { min-height: 116px; border-radius: 14px; }
    .home3-quick-grid b { min-height: 35px; padding: 4px 2px; font-size: .58rem; }
    .home3-community { min-height: 180px; border-radius: 20px; }
    .home3-community > span { padding: 22px 18px; }
    .home3-community small { font-size: .59rem; }
    .home3-community strong { font-size: 1.55rem; }
    .home3-community em { font-size: .74rem; }
    .home3-community > i { right: 16px; width: 38px; height: 38px; }
}

@media (max-width: 430px) {
    body.page-home .game-header { grid-template-columns: 136px auto !important; padding-right: 7px !important; padding-left: 8px !important; }
    body.page-home .mobile-brand img { width: 136px; }
    body.page-home .resource-pill { padding: 0 5px !important; }
    body.page-home .resource-pill img { width: 16px !important; height: 16px !important; }
    body.page-home .resource-pill b { font-size: .55rem !important; }
    body.page-home .player-avatar { width: 35px !important; height: 35px !important; }
}

@media (max-width: 370px) {
    body.page-home .game-header { grid-template-columns: 118px auto !important; }
    body.page-home .mobile-brand img { width: 118px; }
    body.page-home .resource-pill.coins { display: flex !important; }
    body.page-home .resource-pill { padding: 0 4px !important; }
    .home3-task { padding: 9px 6px; }
    .home3-task h3 { font-size: .61rem; }
    .home3-section-head > strong { max-width: 70px; text-align: right; }
}

/* HOME reference geometry */
body.page-home .app-main {
    width: min(100%, 1480px) !important;
}

.home4-page {
    width: min(100%, 1360px);
    display: grid;
    gap: 18px;
    margin: 0 auto;
    padding-bottom: 24px;
}

.home4-hero,
.home4-daily,
.home4-feature-card,
.home4-quick,
.home4-invite,
.home4-community {
    border: 1px solid rgba(75, 139, 255, .4);
    box-shadow: 0 14px 34px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .04);
}

.home4-hero {
    position: relative;
    min-height: 500px;
    overflow: hidden;
    border-color: rgba(193, 62, 255, .62);
    border-radius: 26px;
    background: #060d24;
}

.home4-hero-media,
.home4-hero-slide,
.home4-hero-link {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.home4-hero-slide {
    opacity: 0;
    object-fit: cover;
    object-position: center;
    transform: scale(1.015);
    transition: opacity .55s ease, transform 3.2s ease;
}

.home4-hero-slide.is-active { opacity: 1; transform: scale(1); }
.home4-hero-link { z-index: 2; }

.home4-hero-dots {
    position: absolute;
    z-index: 4;
    left: 50%;
    bottom: 12px;
    display: flex;
    gap: 7px;
    transform: translateX(-50%);
}

.home4-hero-dots button {
    width: 10px;
    height: 10px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(202, 215, 246, .54);
    box-shadow: none;
}

.home4-hero-dots button.is-active {
    background: var(--dxf-pink);
    box-shadow: 0 0 11px rgba(255, 57, 211, .82);
}

.home4-daily,
.home4-quick {
    padding: 18px;
    border-radius: 24px;
    background: linear-gradient(145deg, rgba(8, 29, 63, .95), rgba(5, 16, 39, .98));
}

.home4-daily-head,
.home4-quick > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 13px;
}

.home4-daily-head h2,
.home4-quick h2 {
    margin: 0;
    color: #fff;
    font-size: 1.15rem;
    line-height: 1;
}

.home4-daily-head h2 i { color: #ff62dd; margin-right: 7px; }
.home4-quick h2 i { color: #55dfff; margin-right: 7px; }
.home4-daily-head span,
.home4-quick > header a { color: #bed0ef; font-size: .72rem; font-weight: 850; text-decoration: none; }

.home4-daily-layout { display: grid; grid-template-columns: minmax(0, 3fr) minmax(220px, 1fr); gap: 13px; }
.home4-task-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; }

.home4-task {
    min-width: 0;
    min-height: 150px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto auto 7px;
    gap: 6px 8px;
    align-content: center;
    padding: 14px;
    color: #fff;
    border: 1px solid rgba(75, 143, 255, .48);
    border-radius: 18px;
    background: linear-gradient(150deg, rgba(13, 51, 100, .88), rgba(6, 20, 50, .97));
    text-decoration: none;
}

.home4-task.is-done { border-color: rgba(43, 231, 157, .75); background: linear-gradient(150deg, rgba(8, 74, 62, .82), rgba(4, 32, 42, .98)); }
.home4-task-status { grid-column: 1 / -1; width: 42px; height: 42px; display: grid; place-items: center; color: #cbd8ff; border-radius: 50%; background: rgba(91, 125, 255, .2); }
.home4-task.is-done .home4-task-status { color: #fff; background: linear-gradient(145deg, #32df9d, #16795f); box-shadow: 0 0 18px rgba(44, 235, 164, .3); }
.home4-task h3 { grid-column: 1 / -1; margin: 0; font-size: .8rem; }
.home4-task > div { align-self: center; height: 7px; overflow: hidden; border-radius: 99px; background: rgba(154, 173, 217, .2); }
.home4-task > div i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #786cff, #39dfff); }
.home4-task.is-done > div i { background: linear-gradient(90deg, #36dca0, #78ffc5); }
.home4-task > b { color: #c3d1ed; font-size: .68rem; }

.home4-daily-reward {
    min-height: 150px;
    display: grid;
    grid-template-columns: minmax(100px, 1fr) minmax(100px, .9fr);
    grid-template-rows: auto auto 8px;
    gap: 4px 10px;
    align-items: center;
    padding: 10px;
    color: #fff;
    border: 1px solid rgba(125, 154, 255, .44);
    border-radius: 18px;
    background: radial-gradient(circle at 27% 40%, rgba(255, 191, 62, .14), transparent 40%), rgba(9, 19, 50, .96);
    text-decoration: none;
}

.home4-reward-art { grid-row: 1 / 4; display: grid; place-items: center; min-width: 0; }
.home4-reward-art img { width: 100%; max-height: 132px; object-fit: contain; filter: drop-shadow(0 8px 14px rgba(0, 0, 0, .38)); }
.home4-reward-art > i { color: var(--dxf-gold); font-size: 3rem; }
.home4-daily-reward small { align-self: end; font-size: .67rem; font-weight: 950; }
.home4-daily-reward > b { align-self: start; color: var(--dxf-pink); font-size: 1.4rem; }
.home4-daily-reward > i,
.home4-feature-body > span:first-child > i { height: 8px; overflow: hidden; border: 1px solid rgba(78, 137, 255, .5); border-radius: 99px; background: rgba(2, 9, 28, .75); }
.home4-daily-reward u,
.home4-feature-body u { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #a93fff, #ff45ce 62%, #43ddff); }

.home4-feature-stack { display: grid; gap: 13px; }
.home4-feature-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }

.home4-feature-card {
    min-width: 0;
    min-height: 190px;
    overflow: hidden;
    color: #fff;
    border-color: rgba(185, 73, 255, .45);
    border-radius: 22px;
    background: linear-gradient(145deg, rgba(25, 23, 68, .98), rgba(6, 17, 45, .98));
    text-decoration: none;
}

.home4-feature-card.event { border-color: rgba(54, 221, 255, .45); }
.home4-feature-card > header { height: 44px; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 0 15px; background: linear-gradient(90deg, rgba(112, 34, 171, .38), rgba(18, 30, 72, .2)); }
.home4-feature-card > header span { display: flex; align-items: center; gap: 7px; color: #f49cff; font-size: .76rem; font-weight: 950; }
.home4-feature-card.fast > header span i,
.home4-feature-card.weekly > header span i { color: var(--dxf-gold); }
.home4-feature-card.event > header span { color: var(--dxf-cyan); }
.home4-feature-card > header > i { color: rgba(201, 214, 245, .72); }
.home4-feature-body { height: 146px; display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(105px, .75fr); }
.home4-feature-body > span:first-child { position: relative; z-index: 2; min-width: 0; display: grid; align-content: center; gap: 7px; padding: 13px 4px 13px 17px; }
.home4-feature-body small { overflow: hidden; color: #eef3ff; font-size: .8rem; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; }
.home4-feature-body strong { font-size: clamp(1.15rem, 2.3vw, 1.8rem); line-height: 1; }
.home4-feature-body em { overflow: hidden; margin: 0; color: #bdcdef; font-size: .68rem; font-style: normal; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.home4-feature-art { position: relative; min-width: 0; display: grid; place-items: end center; overflow: hidden; color: rgba(133, 175, 255, .7); font-size: 3.4rem; background: radial-gradient(circle at 50% 62%, rgba(65, 115, 255, .23), transparent 62%); }
.home4-feature-art::after { content: ""; position: absolute; inset: 0; z-index: 2; background: linear-gradient(90deg, rgba(8, 18, 48, .78), transparent 48%); pointer-events: none; }
.home4-feature-art > img,
.home4-feature-art > .dxf-design-media,
.home4-feature-art > .dxf-design-media img { width: 100%; height: 100%; object-fit: cover; }
.home4-feature-art.chest > img { padding: 7px; object-fit: contain; }
.home4-feature-art.event-art > .dxf-design-media { position: absolute; inset: 0; z-index: 1; }
.home4-feature-art.event-art > .dxf-design-media.is-fallback { display: none; }
.home4-event-fallback { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

.home4-quick { overflow: hidden; }
.home4-quick-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.home4-quick-grid > a { min-width: 0; min-height: 160px; display: grid; grid-template-rows: minmax(0, 1fr) auto; overflow: hidden; color: #fff; border: 1px solid rgba(76, 149, 255, .5); border-radius: 17px; background: #07162f; text-decoration: none; }
.home4-quick-grid > a:nth-child(odd) { border-color: rgba(235, 63, 223, .5); }
.home4-quick-grid > a > span { min-height: 0; display: grid; place-items: center; overflow: hidden; background: radial-gradient(circle, rgba(86, 75, 220, .28), rgba(5, 15, 39, .8)); }
.home4-quick-grid img { width: 100%; height: 100%; object-fit: cover; }
.home4-quick-grid span > i { color: var(--dxf-cyan); font-size: 2.7rem; }
.home4-quick-grid b { min-height: 38px; display: grid; place-items: center; padding: 5px; background: rgba(4, 10, 28, .94); font-size: .7rem; text-align: center; }

.home4-invite {
    position: relative;
    isolation: isolate;
    min-height: 210px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 24px;
    align-items: center;
    overflow: hidden;
    padding: 26px 30px;
    color: #fff;
    border-radius: 22px;
    background: radial-gradient(circle at 18% 50%, rgba(220, 45, 255, .3), transparent 34%), linear-gradient(125deg, #171443, #071a39 62%, #061126);
}
.home4-invite.is-ready { border-color: rgba(228, 66, 255, .62); }
.home4-invite.is-waiting { border-color: rgba(86, 151, 255, .5); }
.home4-invite-bg { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; }
.home4-invite-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(4, 8, 28, .94), rgba(5, 12, 34, .66) 55%, rgba(5, 12, 34, .28)); }
.home4-invite-bg img { width: 100%; height: 100%; object-fit: cover; }
.home4-invite-copy { position: relative; z-index: 1; min-width: 0; display: grid; gap: 6px; }
.home4-invite-copy small { color: #67e7ff; font-size: .67rem; font-weight: 950; letter-spacing: .12em; }
.home4-invite-copy small i { margin-right: 6px; color: #ff73e1; }
.home4-invite-copy h2 { max-width: 760px; margin: 0; font-size: clamp(1.35rem, 2.5vw, 2.25rem); line-height: 1.04; }
.home4-invite-copy p { max-width: 720px; margin: 0; color: #c8d5ef; font-size: .82rem; font-weight: 800; }
.home4-invite-action { position: relative; z-index: 1; min-width: 230px; display: grid; justify-items: end; gap: 8px; }
.home4-invite-action > span { color: #f0f5ff; font-size: .72rem; font-weight: 900; }
.home4-invite-action > span i { margin-right: 6px; color: #66e7ff; }
.home4-invite-action > strong { color: #fff; font-size: 1.2rem; }
.home4-invite-action > small { color: #b8c7e4; font-size: .65rem; font-weight: 850; }
.home4-invite-action > small b { color: #fff; }
.home4-invite-action button { min-height: 42px; padding: 0 17px; border: 1px solid rgba(255, 255, 255, .18); border-radius: 13px; color: #fff; background: linear-gradient(135deg, #d936ff, #755bff 56%, #2fcff5); box-shadow: 0 10px 24px rgba(111, 65, 255, .25); font-size: .74rem; font-weight: 950; }
.home4-invite-action button i { margin-left: 7px; }

.home4-community { position: relative; min-height: 130px; display: grid; align-items: center; overflow: hidden; color: #fff; border-radius: 22px; background: linear-gradient(125deg, #171443, #081934); text-decoration: none; }
.home4-community > .dxf-design-media { position: absolute; inset: 0; width: 100%; height: 100%; }
.home4-community > .dxf-design-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(4, 8, 26, .92), rgba(8, 12, 38, .5), rgba(8, 12, 38, .08)); }
.home4-community > span { position: relative; z-index: 2; display: grid; gap: 3px; padding: 20px 30px; }
.home4-community small { color: var(--dxf-cyan); font-size: .63rem; font-weight: 950; letter-spacing: .12em; }
.home4-community strong { max-width: 720px; font-size: clamp(1.4rem, 3.2vw, 2.7rem); line-height: 1; }
.home4-community em { color: #ff92e7; font-size: .82rem; font-style: normal; font-weight: 850; }
.home4-community > i { position: absolute; z-index: 3; right: 22px; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: rgba(255, 255, 255, .1); }

@media (max-width: 760px) {
    body.page-home { padding-bottom: calc(78px + env(safe-area-inset-bottom)) !important; }
    body.page-home .game-header { height: 80px !important; min-height: 80px !important; grid-template-columns: 148px minmax(0, 1fr) !important; gap: 6px !important; padding: 7px 9px !important; }
    body.page-home .mobile-brand img { width: 148px !important; max-height: 60px !important; }
    body.page-home .resource-strip { gap: 3px !important; overflow: visible; }
    body.page-home .resource-group { order: 1; gap: 3px !important; }
    body.page-home .player-chip { order: 2; min-width: 38px; display: grid !important; justify-items: center; gap: 0; }
    body.page-home .resource-pill.messages { order: 0; width: 31px !important; }
    body.page-home .resource-pill.coins { order: 1; }
    body.page-home .resource-pill.diamond { order: 2; }
    body.page-home .resource-pill.push-settings,
    body.page-home .plus-btn { display: none !important; }
    body.page-home .resource-pill { height: 31px !important; min-height: 31px !important; padding: 0 5px !important; border-radius: 10px !important; }
    body.page-home .resource-pill img { width: 16px !important; height: 16px !important; }
    body.page-home .resource-pill b { font-size: .56rem !important; }
    body.page-home .resource-pill.messages b { min-width: 13px; height: 13px; transform: translate(10px, -10px); font-size: .42rem !important; }
    body.page-home .player-avatar { width: 34px !important; height: 34px !important; }
    body.page-home .player-level-meta { margin-top: -1px; }
    body.page-home .player-level-meta b { font-size: .48rem; }
    body.page-home .player-level-meta small { display: none; }
    body.page-home .app-main { padding: 86px 8px 84px !important; }

    .home4-page { gap: 6px; padding-bottom: 0; }
    .home4-hero { min-height: 188px; height: 188px; border-radius: 16px; }
    .home4-hero-dots { bottom: 6px; gap: 5px; }
    .home4-hero-dots button { width: 7px; height: 7px; }

    .home4-daily { height: 122px; padding: 7px; border-radius: 15px; }
    .home4-daily-head { height: 22px; margin-bottom: 5px; }
    .home4-daily-head h2 { font-size: .78rem; }
    .home4-daily-head h2 i { margin-right: 4px; }
    .home4-daily-head span { font-size: .51rem; }
    .home4-daily-layout { height: 81px; grid-template-columns: minmax(0, 3fr) minmax(80px, .92fr); gap: 5px; }
    .home4-task-grid { gap: 5px; }
    .home4-task { min-height: 81px; grid-template-rows: 27px 1fr 5px; gap: 2px 4px; padding: 5px; border-radius: 10px; }
    .home4-task-status { width: 27px; height: 27px; font-size: .68rem; }
    .home4-task h3 { align-self: center; font-size: .6rem; line-height: 1.05; }
    .home4-task > div { height: 5px; }
    .home4-task > b { font-size: .5rem; }
    .home4-daily-reward { min-height: 81px; grid-template-columns: 1fr; grid-template-rows: 39px 11px 14px 5px; gap: 1px; justify-items: center; padding: 4px; border-radius: 10px; text-align: center; }
    .home4-reward-art { grid-row: auto; width: 100%; height: 39px; }
    .home4-reward-art img { max-height: 42px; }
    .home4-daily-reward small { align-self: center; font-size: .43rem; }
    .home4-daily-reward > b { align-self: center; font-size: .8rem; line-height: 1; }
    .home4-daily-reward > i { width: 86%; height: 5px; }

    .home4-feature-stack { gap: 6px; }
    .home4-feature-row { gap: 6px; }
    .home4-feature-card { height: 101px; min-height: 101px; border-radius: 14px; }
    .home4-feature-card > header { height: 25px; padding: 0 7px; }
    .home4-feature-card > header span { gap: 4px; font-size: .58rem; }
    .home4-feature-card > header > i { font-size: .58rem; }
    .home4-feature-body { height: 76px; grid-template-columns: minmax(0, 1.45fr) 54px; }
    .home4-feature-body > span:first-child { gap: 3px; padding: 6px 0 6px 8px; }
    .home4-feature-body small { font-size: .6rem; }
    .home4-feature-body strong { font-size: .88rem; }
    .home4-feature-body em { font-size: .52rem; }
    .home4-feature-body > span:first-child > i { height: 5px; }
    .home4-feature-art { font-size: 2rem; }
    .home4-feature-art.chest > img { padding: 3px; }

    .home4-quick { height: 116px; padding: 7px; border-radius: 15px; }
    .home4-quick > header { height: 20px; margin-bottom: 5px; }
    .home4-quick h2 { font-size: .72rem; }
    .home4-quick h2 i { margin-right: 4px; }
    .home4-quick > header a { font-size: .49rem; }
    .home4-quick-grid { height: 77px; gap: 5px; }
    .home4-quick-grid > a { min-height: 77px; border-radius: 9px; }
    .home4-quick-grid b { min-height: 19px; padding: 2px 1px; font-size: .5rem; line-height: 1.05; }
    .home4-quick-grid span > i { font-size: 1.7rem; }

    .home4-invite { min-height: 132px; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; padding: 12px 13px; border-radius: 15px; }
    .home4-invite-copy { gap: 3px; }
    .home4-invite-copy small { font-size: .45rem; }
    .home4-invite-copy h2 { font-size: .88rem; }
    .home4-invite-copy p { max-width: 210px; font-size: .54rem; line-height: 1.25; }
    .home4-invite-action { min-width: 116px; gap: 5px; }
    .home4-invite-action > span { font-size: .47rem; text-align: right; }
    .home4-invite-action > strong { font-size: .72rem; }
    .home4-invite-action > small { font-size: .46rem; text-align: right; }
    .home4-invite-action button { min-height: 32px; padding: 0 9px; border-radius: 9px; font-size: .5rem; }
    .home4-invite-action button i { margin-left: 4px; }

    .home4-community { height: 68px; min-height: 68px; border-radius: 15px; }
    .home4-community > span { gap: 1px; padding: 8px 13px; padding-right: 46px; }
    .home4-community small { font-size: .42rem; }
    .home4-community strong { font-size: .9rem; }
    .home4-community em { font-size: .52rem; }
    .home4-community > i { right: 11px; width: 27px; height: 27px; font-size: .65rem; }

    body.page-home .bottom-nav { min-height: calc(78px + env(safe-area-inset-bottom)) !important; padding: 3px 5px env(safe-area-inset-bottom) !important; border-radius: 20px 20px 0 0 !important; box-shadow: 0 -9px 28px rgba(0, 0, 0, .42) !important; }
    body.page-home .bottom-link { min-height: 72px !important; gap: 0 !important; padding: 2px 1px !important; font-size: .54rem !important; background: transparent !important; }
    body.page-home .bottom-link span:last-child { display: block !important; }
    body.page-home .bottom-link .nav-ico { width: 38px !important; height: 38px !important; margin: 0 0 -1px !important; }
    body.page-home .bottom-link.active { color: #ff72df !important; background: transparent !important; }
    body.page-home .bottom-link.active .nav-ico img { filter: saturate(1.06) brightness(1.03) drop-shadow(0 0 3px rgba(255, 48, 213, .25)); transform: scale(.9); }
}

@media (max-width: 385px) {
    body.page-home .game-header { grid-template-columns: 132px minmax(0, 1fr) !important; padding-right: 6px !important; padding-left: 7px !important; }
    body.page-home .mobile-brand img { width: 132px !important; }
    body.page-home .resource-pill { padding: 0 4px !important; }
    .home4-daily-head span { font-size: .47rem; }
    .home4-feature-card > header span { font-size: .49rem; }
}

/* Complete reference pass: shared shell and page-specific media surfaces */
.dxf-layered-feature,
.dxf-slot-surface,
.dxf-visual-hub-card,
.home4-feature-card,
.dxf-reference-strip,
.dxf-avatar-detail-hero {
    position: relative;
    isolation: isolate;
}

.dxf-feature-bg,
.dxf-panel-bg,
.home4-card-bg,
.dxf-hub-media,
.dxf-reference-strip-media,
.dxf-avatar-detail-bg,
.dxf-shows-live-backdrop,
.dxf-schedule-backdrop,
.dxf-wins-future-backdrop {
    position: absolute;
    inset: 0;
    z-index: -1;
    overflow: hidden;
    pointer-events: none;
}

.dxf-feature-bg img,
.dxf-panel-bg img,
.home4-card-bg img,
.dxf-hub-media img,
.dxf-reference-strip-media img,
.dxf-avatar-detail-bg img,
.dxf-shows-live-backdrop img,
.dxf-schedule-backdrop img,
.dxf-wins-future-backdrop img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home4-card-bg::after,
.dxf-hub-media::after,
.dxf-reference-strip-media::after,
.dxf-avatar-detail-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(4, 11, 31, .94), rgba(4, 11, 31, .54) 58%, rgba(4, 11, 31, .18));
}

.home4-feature-card > :not(.home4-card-bg) { position: relative; z-index: 1; }

.dxf-visual-hub-card {
    min-height: 150px;
    overflow: hidden;
    align-content: end;
}

.dxf-visual-hub-card .dxf-hub-media { opacity: .76; }
.dxf-visual-hub-card .dxf-hub-icon,
.dxf-visual-hub-card .dxf-hub-copy,
.dxf-visual-hub-card .dxf-hub-arrow { position: relative; z-index: 1; }

.dxf-reference-strip {
    min-height: 150px;
    display: grid;
    align-items: end;
    overflow: hidden;
    margin: 0 0 18px;
    padding: 22px;
    border: 1px solid rgba(90, 150, 255, .4);
    border-radius: 22px;
    background: radial-gradient(circle at 80% 25%, rgba(219, 48, 255, .24), transparent 34%), linear-gradient(135deg, rgba(9, 25, 59, .98), rgba(18, 8, 43, .98));
    box-shadow: var(--dxf-shadow);
}

.dxf-reference-strip > div:not(.dxf-reference-strip-media) {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 4px;
    width: min(70%, 700px);
}

.dxf-reference-strip small { color: var(--dxf-pink); font-size: .68rem; font-weight: 950; letter-spacing: .13em; }
.dxf-reference-strip b { font-size: clamp(1.25rem, 3vw, 2rem); line-height: 1; }
.dxf-reference-strip span { color: #b9c9e8; font-size: .78rem; font-weight: 750; }

.dxf-context-strips {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.dxf-context-strips > span {
    position: relative;
    isolation: isolate;
    min-height: 84px;
    display: grid;
    place-items: end start;
    overflow: hidden;
    padding: 12px;
    border: 1px solid rgba(93, 146, 255, .38);
    border-radius: 16px;
    background: linear-gradient(145deg, #0b1d43, #100b2c);
}

.dxf-context-strips b { position: relative; z-index: 1; font-size: .72rem; }
.dxf-context-media { position: absolute; inset: 0; z-index: -1; opacity: .62; }
.dxf-context-media img { width: 100%; height: 100%; object-fit: cover; }

.dxf-avatar-detail-hero {
    min-height: 360px;
    display: grid;
    grid-template-columns: minmax(280px, .85fr) minmax(0, 1.15fr);
    align-items: center;
    overflow: hidden;
    margin: 14px 0 20px;
    padding: 28px;
    border: 1px solid rgba(221, 70, 255, .55);
    border-radius: 26px;
    background: radial-gradient(circle at 25% 45%, rgba(47, 208, 255, .18), transparent 34%), linear-gradient(135deg, #0b2048, #250934);
    box-shadow: var(--dxf-shadow);
}

.dxf-avatar-detail-dynamic { position: relative; z-index: 1; min-height: 300px; display: grid; place-items: center; }
.dxf-avatar-detail-dynamic img,
.dxf-avatar-detail-dynamic video { width: 100%; height: 300px; object-fit: contain; filter: drop-shadow(0 20px 24px rgba(0, 0, 0, .42)); }
.dxf-avatar-detail-hero > div:last-child { position: relative; z-index: 1; display: grid; gap: 8px; }
.dxf-avatar-detail-hero small { color: var(--dxf-cyan); font-weight: 950; letter-spacing: .14em; }
.dxf-avatar-detail-hero h1,
.dxf-avatar-detail-hero p { margin: 0; }
.dxf-avatar-detail-hero h1 { font-size: clamp(2rem, 5vw, 4rem); line-height: 1; }
.dxf-avatar-detail-hero p { color: #b7c9eb; font-weight: 700; }

.dxf-collection-reward-art { position: absolute; top: 118px; right: 4%; z-index: 3; width: min(18vw, 170px); pointer-events: none; }
.dxf-collection-reward-media img { width: 100%; filter: drop-shadow(0 15px 20px rgba(0, 0, 0, .45)); }
.prestige-album-app { position: relative; }

.dxf-shows-live-backdrop,
.dxf-schedule-backdrop,
.dxf-wins-future-backdrop { position: relative; z-index: 0; min-height: 120px; margin: 0 0 14px; border: 1px solid rgba(103, 147, 255, .35); border-radius: 20px; }

@media (min-width: 761px) {
    :root { --dxf-app-width: 100vw !important; }
    body.is-auth { display: block !important; }
    .app-frame {
        width: 100vw !important;
        max-width: none !important;
        grid-template-columns: 248px minmax(0, 1fr) !important;
        grid-template-rows: 72px minmax(0, 1fr) !important;
        margin: 0 !important;
        overflow: visible !important;
        box-shadow: none !important;
    }
    .side-nav {
        grid-column: 1 !important;
        grid-row: 1 / span 2 !important;
        display: flex !important;
        align-items: stretch !important;
        width: 248px !important;
        padding: 18px 14px !important;
    }
    .side-nav .brand { min-height: 74px; }
    .side-nav .desktop-brand-logo { width: 190px !important; height: 64px !important; object-fit: contain !important; }
    .side-nav .desktop-brand-name { display: none !important; }
    .side-link { width: 100% !important; min-height: 44px !important; grid-template-columns: 34px minmax(0, 1fr); justify-items: start; text-align: left; }
    .game-header {
        grid-column: 2 !important;
        grid-row: 1 !important;
        position: sticky !important;
        left: auto !important;
        right: auto !important;
        width: 100% !important;
        max-width: none !important;
        height: 72px !important;
        transform: none !important;
    }
    .resource-strip { height: 72px !important; max-width: 1440px !important; padding: 8px 28px !important; }
    .app-main { grid-column: 2 !important; grid-row: 2 !important; padding: 26px clamp(22px, 3vw, 46px) 54px !important; }
}

@media (max-width: 760px) {
    .game-header,
    body.page-home .game-header {
        left: 0 !important;
        right: 0 !important;
        width: 100vw !important;
        max-width: none !important;
        height: 72px !important;
        min-height: 72px !important;
        grid-template-columns: 112px minmax(0, 1fr) !important;
        gap: 5px !important;
        padding: 6px max(8px, env(safe-area-inset-right)) 6px max(8px, env(safe-area-inset-left)) !important;
        transform: none !important;
        border-radius: 0 !important;
    }
    .mobile-brand img,
    body.page-home .mobile-brand img { width: 112px !important; max-height: 48px !important; }
    .app-main,
    body.page-home .app-main { padding-top: 80px !important; }
    .resource-strip { height: 60px !important; gap: 3px !important; }
    .resource-pill { height: 30px !important; min-height: 30px !important; padding: 0 5px !important; }
    .resource-pill img { width: 16px !important; height: 16px !important; }
    .resource-pill b { font-size: .55rem !important; }
    .player-avatar { width: 33px !important; height: 33px !important; }
    .bottom-nav { width: 100vw !important; max-width: none !important; left: 0 !important; right: 0 !important; transform: none !important; border-radius: 20px 20px 0 0 !important; }
    .bottom-link { min-height: 72px !important; padding: 1px !important; gap: 0 !important; background: transparent !important; }
    body.is-auth .bottom-nav .bottom-link .nav-ico { width: 64px !important; height: 64px !important; margin: 0 !important; padding: 0 !important; overflow: hidden; border-radius: 15px !important; background: transparent !important; transform: none !important; }
    body.is-auth .bottom-nav .bottom-link .nav-ico img { width: 100% !important; height: 100% !important; object-fit: contain !important; filter: none !important; opacity: .9; transform: scale(.94) !important; transition: opacity .16s ease, transform .16s ease, filter .16s ease; }
    body.is-auth .bottom-nav .bottom-link.active .nav-ico img { opacity: 1; transform: scale(1) !important; filter: drop-shadow(0 0 7px rgba(255, 55, 214, .5)) !important; }
    .dxf-v2-page { gap: 10px; }
    .dxf-page-title { min-height: 68px; gap: 10px; }
    .dxf-page-title-icon { width: 42px; height: 42px; font-size: 1rem; }
    .dxf-page-title h1 { font-size: 1.7rem; }
    .dxf-page-title p { margin-top: 3px; font-size: .68rem; }
    .dxf-feature-hero { min-height: 226px; border-radius: 18px; }
    .dxf-feature-art { min-height: 226px; }
    .dxf-feature-content { padding: 17px; }
    .dxf-feature-content h2 { font-size: 1.35rem; }
    .dxf-feature-content p { font-size: .68rem; line-height: 1.35; }
    .dxf-hub-grid { gap: 8px; }
    .dxf-visual-hub-card { min-height: 112px; }
    .dxf-reference-strip { min-height: 112px; margin-bottom: 11px; padding: 14px; border-radius: 17px; }
    .dxf-reference-strip > div:not(.dxf-reference-strip-media) { width: 78%; }
    .dxf-reference-strip b { font-size: 1.06rem; }
    .dxf-reference-strip span { font-size: .62rem; }
    .dxf-context-strips { gap: 6px; margin-bottom: 10px; }
    .dxf-context-strips > span { min-height: 66px; padding: 8px; border-radius: 12px; }
    .dxf-avatar-detail-hero { min-height: 260px; grid-template-columns: 44% 56%; margin: 8px 0 12px; padding: 14px; border-radius: 19px; }
    .dxf-avatar-detail-dynamic { min-height: 220px; }
    .dxf-avatar-detail-dynamic img,
    .dxf-avatar-detail-dynamic video { height: 220px; }
    .dxf-avatar-detail-hero h1 { font-size: 1.6rem; }
    .dxf-avatar-detail-hero p { font-size: .66rem; }
    .dxf-collection-reward-art { top: 90px; width: 92px; }
}

@media (max-width: 760px) {
    .mobile-brand img,
    body.page-home .mobile-brand img { width: 104px !important; max-height: 44px !important; }
    .bottom-nav .bottom-link > span:not(.nav-ico) { display: none !important; }
    .home4-daily-reward { position: relative; overflow: visible; }
    .home4-daily-reward .home4-reward-art { position: absolute; z-index: 3; top: -17px; left: 50%; width: 66px; height: 57px; transform: translateX(-50%); }
    .home4-daily-reward .home4-reward-art img { width: 72px; max-height: 68px; object-fit: contain; }
    .home4-daily-reward > small { padding-top: 25px; }
}

.dxf-profile-reference-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.dxf-page-bg,
.dxf-panel-bg,
.dxf-reference-strip-overlay {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: .28;
    pointer-events: none;
}

.dxf-page-bg { position: fixed; z-index: -1; }
.dxf-panel-bg { border-radius: inherit; z-index: 0; }
.dxf-slot-surface { position: relative; isolation: isolate; }
.dxf-slot-surface > :not(.dxf-page-bg):not(.dxf-panel-bg) { position: relative; z-index: 1; }
.dxf-reference-strip-overlay { opacity: .2; mix-blend-mode: screen; }
.shop-feature-frame { right: 14% !important; }
.shop-feature-effect { right: 2% !important; width: 21% !important; }
.dxf-cards-collection-reward { right: 8%; transform: scale(.72); transform-origin: right bottom; }
.dxf-collection-missing-visual { min-height: 120px; position: relative; overflow: visible; }
.prestige-album-app > .dxf-collection-reward-art { position: absolute !important; top: 118px; }
.card-lightbox.dxf-slot-surface { position: fixed !important; inset: 0 !important; z-index: 1200 !important; }
.card-lightbox.dxf-slot-surface > .dxf-page-bg { position: absolute; z-index: 0; opacity: .38; }

@media (max-width: 760px) {
    .dxf-profile-reference-grid { grid-template-columns: 1fr; }
    .prestige-album-app > .dxf-collection-reward-art { top: 90px; }
    .shop-feature-frame { right: 11% !important; }
    .shop-feature-effect { right: -4% !important; }
}

/* Referenzstrukturen: Sammeln, Spielen, Fortschritt und Wunschliste. */
.dxf-reference-collect,
.dxf-reference-play,
.dxf-reference-progress { gap: 12px; }

.dxf-collection-head,
.dxf-progress-head {
    position: relative;
    min-height: 112px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 16px;
    overflow: hidden;
    border: 1px solid rgba(76, 205, 255, .22);
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(11, 29, 66, .98), rgba(19, 13, 55, .96));
}

.dxf-collection-head > :not(.dxf-panel-bg),
.dxf-progress-head > :not(.dxf-panel-bg) { position: relative; z-index: 1; }
.dxf-collection-head small,
.dxf-progress-head small { color: var(--cyan); font-size: .63rem; font-weight: 950; letter-spacing: .12em; }
.dxf-collection-head h1,
.dxf-progress-head h1 { margin: 2px 0 4px; font-size: 1.62rem; }
.dxf-collection-head p,
.dxf-progress-head p { margin: 0; color: rgba(232, 239, 255, .7); font-size: .76rem; font-weight: 650; }
.dxf-level-orb,
.dxf-progress-head > span { width: 68px; height: 68px; display: grid; place-items: center; align-content: center; border: 2px solid rgba(255, 73, 213, .75); border-radius: 50%; background: radial-gradient(circle, rgba(121, 58, 255, .42), rgba(8, 12, 37, .94)); box-shadow: 0 0 22px rgba(221, 51, 255, .22); }
.dxf-level-orb b,
.dxf-progress-head > span b { font-size: 1.15rem; line-height: 1; }
.dxf-level-orb small,
.dxf-progress-head > span small { margin-top: 3px; font-size: .45rem; }

.dxf-collection-tools { display: grid; grid-template-columns: minmax(0, 1fr) 46px; gap: 8px; }
.dxf-collection-tools label { min-height: 44px; display: grid; grid-template-columns: 22px minmax(0, 1fr); align-items: center; gap: 7px; padding: 0 12px; border: 1px solid rgba(91, 180, 255, .25); border-radius: 14px; background: rgba(7, 18, 45, .88); color: var(--cyan); }
.dxf-collection-tools input { min-width: 0; border: 0; padding: 0; background: transparent; box-shadow: none; }
.dxf-collection-tools button { min-height: 44px; border: 1px solid rgba(255, 80, 214, .28); border-radius: 14px; background: rgba(39, 20, 73, .92); color: #ff67dc; }
.dxf-collection-tabs { overflow-x: auto; flex-wrap: nowrap; }

.dxf-collection-feature { position: relative; min-height: 220px; display: grid; grid-template-columns: minmax(0, 1fr) 115px; align-items: end; gap: 12px; padding: 18px; overflow: hidden; border: 1px solid rgba(75, 194, 255, .28); border-radius: 22px; background: linear-gradient(145deg, #0d2850, #24123f); isolation: isolate; }
.dxf-collection-feature > :not(.dxf-panel-bg) { position: relative; z-index: 1; }
.dxf-collection-feature-copy small,
.dxf-collection-feature-copy > b { color: var(--cyan); font-size: .62rem; font-weight: 950; }
.dxf-collection-feature-copy h2 { margin: 4px 0; font-size: 1.34rem; }
.dxf-collection-feature-copy p { margin: 0 0 12px; color: rgba(255,255,255,.72); font-size: .72rem; }
.dxf-collection-feature-copy > b { display: block; margin-top: 7px; }
.dxf-collection-reward { display: grid; justify-items: center; gap: 4px; text-align: center; }
.dxf-collection-reward .dxf-design-media { width: 104px; height: 104px; }
.dxf-collection-reward .dxf-design-media img { width: 100%; height: 100%; object-fit: contain; }
.dxf-collection-reward span { display: grid; gap: 2px; }
.dxf-collection-reward small { color: #ffd869; font-size: .48rem; font-weight: 950; }
.dxf-collection-reward b { font-size: .72rem; }

.dxf-avatar-collection-section { padding: 14px; }
.dxf-avatar-collection-section > header a { color: var(--cyan); font-size: .65rem; font-weight: 850; }
.dxf-collection-avatar-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.dxf-collection-avatar-grid > a { min-width: 0; display: grid; gap: 4px; padding: 7px; overflow: hidden; border: 1px solid rgba(255,255,255,.1); border-radius: 14px; background: rgba(255,255,255,.04); color: #fff; text-decoration: none; }
.dxf-collection-avatar-grid > a > span { min-height: 92px; display: grid; place-items: center; overflow: hidden; border-radius: 10px; background: linear-gradient(150deg, rgba(24,80,133,.55), rgba(73,23,100,.58)); }
.dxf-collection-avatar-grid img { width: 100%; height: 92px; object-fit: contain; }
.dxf-collection-avatar-grid .is-missing > span { filter: grayscale(1); opacity: .55; }
.dxf-collection-avatar-grid b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .65rem; }
.dxf-collection-avatar-grid small { color: var(--muted); font-size: .53rem; font-weight: 800; }
.dxf-collection-more-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.dxf-collection-more-grid > a,
.dxf-play-mode-grid > a { position: relative; min-height: 150px; display: flex; align-items: flex-end; padding: 12px; overflow: hidden; border: 1px solid rgba(255,255,255,.12); border-radius: 18px; background: #101a42; color: #fff; text-decoration: none; isolation: isolate; }
.dxf-collection-more-grid .dxf-design-media,
.dxf-play-mode-grid .dxf-design-media { position: absolute; inset: 0; z-index: 0; }
.dxf-collection-more-grid .dxf-design-media img,
.dxf-play-mode-grid .dxf-design-media img { width: 100%; height: 100%; object-fit: cover; }
.dxf-collection-more-grid > a::after,
.dxf-play-mode-grid > a::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(0deg, rgba(5,9,28,.96), rgba(5,9,28,.08)); }
.dxf-collection-more-grid > a > span,
.dxf-play-mode-grid > a > span { position: relative; z-index: 2; display: grid; gap: 2px; }
.dxf-collection-more-grid small,
.dxf-play-mode-grid small { color: var(--cyan); font-size: .52rem; font-weight: 950; letter-spacing: .09em; }
.dxf-collection-more-grid b,
.dxf-play-mode-grid b { font-size: .83rem; }
.dxf-collection-more-grid em,
.dxf-play-mode-grid em { color: rgba(255,255,255,.68); font-size: .58rem; font-style: normal; font-weight: 700; }

.dxf-play-race-feature,
.dxf-play-arena-feature,
.dxf-play-today,
.dxf-progress-daily,
.dxf-progress-week,
.dxf-progress-goal { position: relative; overflow: hidden; border: 1px solid rgba(78, 183, 255, .22); border-radius: 20px; background: linear-gradient(145deg, rgba(9,28,66,.97), rgba(30,15,63,.96)); isolation: isolate; }
.dxf-play-race-feature { min-height: 250px; display: grid; grid-template-columns: minmax(0, 1fr) 150px; align-items: end; gap: 14px; padding: 18px; }
.dxf-play-race-feature > :not(.dxf-panel-bg),
.dxf-play-arena-feature > :not(.dxf-panel-bg),
.dxf-play-today > :not(.dxf-panel-bg),
.dxf-progress-daily > :not(.dxf-panel-bg),
.dxf-progress-week > :not(.dxf-panel-bg),
.dxf-progress-goal > :not(.dxf-panel-bg) { position: relative; z-index: 1; }
.dxf-play-race-feature small,
.dxf-play-arena-feature small,
.dxf-play-today small,
.dxf-progress-daily small,
.dxf-progress-week small,
.dxf-progress-goal small { color: var(--cyan); font-size: .58rem; font-weight: 950; letter-spacing: .1em; }
.dxf-play-race-feature h2,
.dxf-play-arena-feature h2 { margin: 4px 0; font-size: 1.36rem; }
.dxf-play-race-feature p,
.dxf-play-arena-feature p { margin: 0 0 12px; color: rgba(255,255,255,.72); font-size: .72rem; }
.dxf-play-race-feature aside { display: grid; gap: 7px; padding: 12px; border: 1px solid rgba(255,255,255,.1); border-radius: 15px; background: rgba(5,9,29,.72); }
.dxf-play-race-feature aside b { font-size: .82rem; }
.dxf-play-race-feature aside em { color: var(--muted); font-size: .55rem; font-style: normal; font-weight: 750; }
.dxf-play-arena-feature { min-height: 150px; display: grid; grid-template-columns: minmax(0, 1fr) 90px; align-items: end; gap: 12px; padding: 16px; }
.dxf-play-arena-feature > span { display: grid; justify-items: center; gap: 4px; padding: 11px; border-radius: 14px; background: rgba(92,48,171,.38); text-align: center; }
.dxf-play-arena-feature > span i { color: #ffd65d; font-size: 1.35rem; }
.dxf-play-arena-feature a { color: var(--cyan); font-size: .68rem; font-weight: 900; }
.dxf-play-mode-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.dxf-play-mode-grid > a { min-height: 145px; }
.dxf-play-today { min-height: 86px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; padding: 14px; color: #fff; text-decoration: none; }
.dxf-play-today > span { display: grid; gap: 2px; }
.dxf-play-today b { font-size: .9rem; }
.dxf-play-today em { color: var(--muted); font-size: .62rem; font-style: normal; font-weight: 700; }

.dxf-progress-daily { display: grid; gap: 12px; padding: 15px; }
.dxf-progress-daily > header { display: flex; align-items: center; justify-content: space-between; }
.dxf-progress-daily h2,
.dxf-progress-week h2,
.dxf-progress-goal h2 { margin: 2px 0; font-size: 1.08rem; }
.dxf-progress-daily > header > b { color: #ff6bdd; font-size: .72rem; }
.dxf-daily-task-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.dxf-daily-task-grid article { min-height: 112px; display: grid; justify-items: center; align-content: center; gap: 7px; padding: 9px; border: 1px solid rgba(90,164,255,.28); border-radius: 14px; background: rgba(9,31,64,.74); text-align: center; }
.dxf-daily-task-grid article.is-done { border-color: rgba(45,221,149,.55); background: rgba(9,76,60,.58); }
.dxf-daily-task-grid i { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.1); color: var(--cyan); }
.dxf-daily-task-grid .is-done i { background: rgba(47,218,143,.25); color: #7fffc0; }
.dxf-daily-task-grid b { font-size: .65rem; line-height: 1.25; }
.dxf-daily-task-grid span { color: var(--muted); font-size: .58rem; font-weight: 850; }
.dxf-progress-daily > aside { display: grid; grid-template-columns: 82px minmax(0, 1fr); align-items: center; gap: 10px; padding: 9px 12px; border: 1px solid rgba(255,193,76,.2); border-radius: 15px; background: rgba(32,17,56,.78); }
.dxf-progress-daily > aside .dxf-design-media { width: 78px; height: 66px; }
.dxf-progress-daily > aside .dxf-design-media img { width: 100%; height: 100%; object-fit: contain; }
.dxf-progress-daily > aside > span { display: grid; gap: 5px; }
.dxf-progress-week { min-height: 170px; display: grid; grid-template-columns: minmax(0, 1fr) 130px; align-items: center; gap: 8px; padding: 16px; }
.dxf-progress-week > div:not(.dxf-panel-bg) { display: grid; gap: 6px; }
.dxf-progress-week p,
.dxf-progress-goal p { margin: 0; color: var(--muted); font-size: .65rem; }
.dxf-progress-week em { color: #ffd466; font-size: .58rem; font-style: normal; font-weight: 850; }
.dxf-progress-week-reward { width: 126px; height: 126px; }
.dxf-progress-week-reward img { width: 100%; height: 100%; object-fit: contain; }
.dxf-progress-track { padding: 14px; border: 1px solid rgba(255,255,255,.1); border-radius: 18px; background: rgba(12,19,48,.86); }
.dxf-progress-track > div { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 10px; }
.dxf-progress-track > div::before { content: ""; position: absolute; left: 10%; right: 10%; top: 21px; height: 3px; background: linear-gradient(90deg, #ff4bd2 45%, rgba(255,255,255,.12) 45%); }
.dxf-progress-track span { position: relative; z-index: 1; display: grid; justify-items: center; gap: 4px; }
.dxf-progress-track span i { width: 42px; height: 42px; display: grid; place-items: center; border: 2px solid rgba(128,148,218,.45); border-radius: 50%; background: #101b43; }
.dxf-progress-track span.is-earned i { border-color: #ff52d5; color: #ff72de; }
.dxf-progress-track span b { font-size: .57rem; }
.dxf-progress-goal { min-height: 128px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 12px; padding: 15px; }
.dxf-progress-goal > div:not(.dxf-panel-bg) { display: grid; gap: 5px; }
.dxf-progress-goal > a { color: var(--cyan); font-size: .65rem; font-weight: 900; }
.dxf-wishlist-goal { min-height: 250px; }
.dxf-wishlist-avatar { position: absolute; z-index: 2; right: 3%; bottom: 0; width: 42%; height: 88%; display: grid; place-items: end center; pointer-events: none; }
.dxf-wishlist-avatar img { width: 100%; height: 100%; object-fit: contain; object-position: center bottom; }
.dxf-wishlist-goal .dxf-feature-content { max-width: 58%; }
.dxf-wishlist-goal .dxf-feature-content > small { color: var(--muted); font-size: .6rem; font-weight: 800; }

@media (max-width: 560px) {
    .dxf-collection-avatar-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .dxf-collection-avatar-grid > a:nth-child(n+7) { display: none; }
    .dxf-play-mode-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .dxf-play-mode-grid > a { min-height: 132px; padding: 9px; }
    .dxf-play-race-feature { grid-template-columns: 1fr; min-height: 260px; }
    .dxf-play-race-feature aside { width: min(100%, 220px); }
    .dxf-daily-task-grid { gap: 6px; }
    .dxf-daily-task-grid article { min-height: 104px; padding: 7px 5px; }
    .dxf-progress-week { grid-template-columns: minmax(0, 1fr) 104px; }
    .dxf-progress-week-reward { width: 102px; height: 102px; }
}

.dxf-reference-event { gap: 12px; }
.dxf-event-main-hero,
.dxf-event-progress,
.dxf-event-tasks,
.dxf-event-collection,
.dxf-event-community,
.dxf-event-shop { position: relative; overflow: hidden; border: 1px solid rgba(109, 127, 255, .25); border-radius: 20px; background: linear-gradient(145deg, rgba(10,27,65,.98), rgba(40,15,72,.96)); isolation: isolate; }
.dxf-event-main-hero > :not(.dxf-panel-bg),
.dxf-event-progress > :not(.dxf-panel-bg),
.dxf-event-tasks > :not(.dxf-panel-bg),
.dxf-event-collection > :not(.dxf-panel-bg),
.dxf-event-community > :not(.dxf-panel-bg),
.dxf-event-shop > :not(.dxf-panel-bg) { position: relative; z-index: 1; }
.dxf-event-main-hero { min-height: 240px; display: flex; align-items: flex-end; padding: 18px; }
.dxf-event-main-hero h1 { margin: 3px 0 5px; font-size: 1.7rem; }
.dxf-event-main-hero p { margin: 0 0 9px; color: rgba(255,255,255,.72); font-size: .75rem; }
.dxf-event-main-hero small,
.dxf-event-progress small,
.dxf-event-tasks small,
.dxf-event-collection small,
.dxf-event-community small,
.dxf-event-shop small { color: var(--cyan); font-size: .58rem; font-weight: 950; letter-spacing: .1em; }
.dxf-event-main-hero span { display: inline-flex; align-items: center; gap: 5px; color: #ffc75b; font-size: .62rem; font-weight: 850; }
.dxf-event-progress { min-height: 142px; display: grid; grid-template-columns: minmax(0,1fr) 112px; align-items: center; gap: 10px; padding: 15px; }
.dxf-event-progress h2 { margin: 4px 0; font-size: 1.25rem; }
.dxf-event-progress p { margin: 6px 0 0; color: var(--muted); font-size: .6rem; }
.dxf-event-reward { width: 108px; height: 108px; }
.dxf-event-reward img { width: 100%; height: 100%; object-fit: contain; }
.dxf-event-track { padding: 14px; border: 1px solid rgba(255,255,255,.1); border-radius: 18px; background: rgba(12,19,48,.86); }
.dxf-event-track > div { position: relative; display: grid; grid-template-columns: repeat(5,1fr); gap: 5px; margin-top: 11px; }
.dxf-event-track > div::before { content:""; position:absolute; left:8%; right:8%; top:19px; height:3px; background:linear-gradient(90deg,#ff4bd2 35%,rgba(255,255,255,.12) 35%); }
.dxf-event-track span { position:relative; z-index:1; display:grid; justify-items:center; gap:4px; }
.dxf-event-track span i { width:38px; height:38px; display:grid; place-items:center; border:2px solid rgba(126,145,218,.45); border-radius:50%; background:#111b43; }
.dxf-event-track span.is-earned i { border-color:#ff5bd8; color:#ff78e1; }
.dxf-event-track span b { font-size:.55rem; }
.dxf-event-tasks { padding: 14px; }
.dxf-event-tasks > header { display:flex; align-items:center; justify-content:space-between; }
.dxf-event-tasks h2,
.dxf-event-community h2 { margin:2px 0; font-size:1.05rem; }
.dxf-event-tasks > header > b { color:#ff67db; font-size:.68rem; }
.dxf-event-tasks > div:not(.dxf-panel-bg) { display:grid; gap:7px; margin-top:10px; }
.dxf-event-tasks article { display:grid; grid-template-columns:36px minmax(0,1fr); align-items:center; gap:9px; padding:9px; border:1px solid rgba(255,255,255,.09); border-radius:13px; background:rgba(0,0,0,.17); }
.dxf-event-tasks article > i { width:34px; height:34px; display:grid; place-items:center; border-radius:50%; background:rgba(87,111,218,.2); color:var(--cyan); }
.dxf-event-tasks article.is-done > i { background:rgba(37,203,132,.2); color:#77ffc0; }
.dxf-event-tasks article span { display:grid; gap:2px; }
.dxf-event-tasks article b { font-size:.68rem; }
.dxf-event-tasks article small { color:var(--muted); font-size:.54rem; letter-spacing:0; }
.dxf-event-collection,
.dxf-event-shop { min-height:98px; display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:10px; padding:14px; color:#fff; text-decoration:none; }
.dxf-event-collection > span,
.dxf-event-shop > span { display:grid; gap:3px; }
.dxf-event-collection b,
.dxf-event-shop b { font-size:.9rem; }
.dxf-event-collection em,
.dxf-event-shop em { color:var(--muted); font-size:.6rem; font-style:normal; font-weight:750; }
.dxf-event-collection .dxf-progress { margin-top:4px; }
.dxf-event-collection .dxf-progress i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#a833ff,#ff49cf,#37d9ff); }
.dxf-event-community { min-height:155px; display:grid; grid-template-columns:minmax(0,1fr) 112px; align-items:center; gap:8px; padding:15px; }
.dxf-event-community p { margin:4px 0 10px; color:var(--muted); font-size:.65rem; }

.dxf-avatar-shop-page { display:grid; gap:12px; }
.dxf-avatar-shop-head { display:grid; grid-template-columns:minmax(0,1fr) auto auto; align-items:center; gap:10px; padding:14px; border:1px solid rgba(99,139,255,.2); border-radius:20px; background:linear-gradient(145deg,rgba(8,26,61,.98),rgba(34,14,66,.96)); }
.dxf-avatar-shop-head small,
.dxf-avatar-shop-hero small,
.dxf-avatar-popular > header small { color:var(--cyan); font-size:.58rem; font-weight:950; letter-spacing:.1em; }
.dxf-avatar-shop-head h1 { margin:2px 0; font-size:1.5rem; }
.dxf-avatar-shop-head p { margin:0; color:var(--muted); font-size:.65rem; }
.dxf-avatar-shop-head .avatar-shop-wallet { display:flex; gap:5px; padding:0; background:transparent; border:0; }
.dxf-avatar-shop-head .avatar-shop-wallet span { min-height:34px; padding:5px 7px; border-radius:12px; background:rgba(255,255,255,.07); }
.dxf-avatar-shop-head > a { display:grid; justify-items:center; gap:3px; color:#ff69dc; text-decoration:none; font-size:.55rem; font-weight:850; }
.dxf-avatar-shop-head > a i { width:34px; height:34px; display:grid; place-items:center; border-radius:12px; background:rgba(255,61,195,.13); }
.dxf-avatar-shop-hero { position:relative; min-height:250px; display:flex; align-items:flex-end; padding:18px; overflow:hidden; border:1px solid rgba(255,83,222,.32); border-radius:22px; background:linear-gradient(145deg,#152c6b,#4b1767); isolation:isolate; }
.dxf-avatar-shop-hero > :not(.dxf-panel-bg) { position:relative; z-index:2; }
.dxf-avatar-shop-hero > div:last-child { max-width:55%; }
.dxf-avatar-shop-hero h2 { margin:4px 0; font-size:1.35rem; }
.dxf-avatar-shop-hero p { margin:0 0 12px; color:rgba(255,255,255,.7); font-size:.7rem; }
.dxf-avatar-shop-hero-character { position:absolute!important; right:2%; bottom:0; width:48%; height:94%; display:grid; align-items:end; z-index:1!important; }
.dxf-avatar-shop-hero-character img { width:100%; height:100%; object-fit:contain; object-position:center bottom; }
.dxf-avatar-shop-tabs { overflow-x:auto; flex-wrap:nowrap; }
.dxf-avatar-popular { display:grid; gap:8px; }
.dxf-avatar-popular > header h2 { margin:2px 0; font-size:1.05rem; }
.dxf-avatar-popular > .section-bar { display:none; }
.dxf-avatar-popular .avatar-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }

@media(max-width:560px){
    .dxf-avatar-shop-head { grid-template-columns:minmax(0,1fr) auto; }
    .dxf-avatar-shop-head .avatar-shop-wallet { grid-column:1/-1; grid-row:2; }
    .dxf-avatar-shop-head > a { grid-column:2; grid-row:1; }
}

/* Admin Seitengrafiken: klare Desktop-Arbeitsfläche und sicher begrenzte Vorschauen. */
#admin-home-graphics {
    grid-column: 1 / -1 !important;
    width: 100%;
    overflow: visible;
}

.admin-grid > .admin-fold:has(> #admin-home-graphics) {
    grid-column: 1 / -1;
}

#admin-home-graphics .admin-graphics-page {
    overflow: hidden;
    border: 1px solid rgba(106, 143, 255, .25);
    border-radius: 20px;
    background: rgba(8, 17, 43, .94);
}

#admin-home-graphics .admin-graphics-page > summary {
    min-height: 78px;
    padding: 16px 20px;
}

#admin-home-graphics .admin-graphics-page > summary b { font-size: 1.05rem; }
#admin-home-graphics .admin-graphics-page > summary small { margin-top: 3px; font-size: .75rem; }
#admin-home-graphics .admin-graphics-page > summary em { font-size: .72rem; }

#admin-home-graphics .admin-home-slot-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    padding: 18px;
}

#admin-home-graphics .admin-home-slot {
    min-height: 430px;
    gap: 12px;
    padding: 14px;
    overflow: hidden;
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(22, 31, 64, .98), rgba(31, 24, 55, .98));
    border-color: rgba(117, 151, 255, .27);
    box-shadow: 0 14px 34px rgba(0, 0, 0, .2);
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

#admin-home-graphics .admin-home-slot:hover {
    transform: translateY(-2px);
    border-color: rgba(76, 220, 255, .58);
    box-shadow: 0 18px 42px rgba(0, 0, 0, .3), 0 0 0 1px rgba(255, 74, 217, .12);
}

#admin-home-graphics .admin-home-slot-preview {
    position: relative;
    isolation: isolate;
    contain: paint;
    width: 100%;
    height: 220px;
    min-height: 220px;
    aspect-ratio: auto;
    overflow: hidden;
    border: 1px solid rgba(116, 153, 255, .22);
    border-radius: 13px;
    background:
        linear-gradient(45deg, rgba(255,255,255,.025) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.025) 75%),
        #070d22;
    background-size: 22px 22px;
}

#admin-home-graphics .admin-home-slot-preview > img,
#admin-home-graphics .admin-home-slot-preview > video {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

#admin-home-graphics .admin-home-slot-preview > .dxf-design-media.is-fallback,
#admin-home-graphics .admin-current-graphic-preview > .dxf-design-media.is-fallback {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    border-radius: inherit;
}

#admin-home-graphics .admin-home-slot-preview > .dxf-design-media.is-fallback::before,
#admin-home-graphics .admin-home-slot-preview > .dxf-design-media.is-fallback::after,
#admin-home-graphics .admin-current-graphic-preview > .dxf-design-media.is-fallback::before,
#admin-home-graphics .admin-current-graphic-preview > .dxf-design-media.is-fallback::after {
    content: none !important;
    display: none !important;
}

#admin-home-graphics .admin-home-slot-preview .dxf-media-mark,
#admin-home-graphics .admin-current-graphic-preview .dxf-media-mark {
    position: relative;
    z-index: 1;
    font-size: clamp(3.2rem, 6vw, 6.2rem);
    letter-spacing: -.09em;
}

#admin-home-graphics .admin-slider-count {
    position: absolute;
    right: 10px;
    bottom: 10px;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 10px;
    border-radius: 999px;
    color: #fff;
    background: rgba(5, 11, 31, .88);
    border: 1px solid rgba(81, 220, 255, .46);
    font-size: .7rem;
    font-weight: 950;
    backdrop-filter: blur(8px);
}

#admin-home-graphics .admin-slot-copy { display: grid; gap: 5px; }
#admin-home-graphics .admin-slot-copy > b {
    color: #fff;
    font-size: 1rem;
    line-height: 1.2;
    white-space: normal;
}
#admin-home-graphics .admin-slot-copy > small {
    min-height: 38px;
    color: rgba(232, 239, 255, .76);
    font-size: .72rem;
    line-height: 1.45;
}

#admin-home-graphics .admin-slot-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

#admin-home-graphics .admin-slot-meta em {
    display: inline-flex;
    min-width: 0;
    padding: 6px 8px;
    border-radius: 8px;
    color: #d6e5ff;
    background: rgba(90, 115, 190, .15);
    border: 1px solid rgba(128, 157, 239, .18);
    font-size: .64rem;
    font-style: normal;
    font-weight: 850;
    overflow-wrap: anywhere;
}

#admin-home-graphics .admin-slot-file {
    min-height: 36px;
    color: rgba(220, 230, 255, .66);
    font-size: .65rem;
    line-height: 1.5;
}

#admin-home-graphics .admin-slot-edit-cta {
    align-self: end;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 38px;
    border-radius: 11px;
    color: #07132d;
    background: linear-gradient(100deg, #55dcff, #ef5dff);
    font-size: .72rem;
    font-weight: 1000;
}

#admin-home-graphics .admin-replace-modal {
    padding: 32px;
    overflow: auto;
}

#admin-home-graphics .admin-replace-card {
    width: min(1100px, calc(100vw - 96px));
    max-width: 1100px;
    max-height: calc(100dvh - 64px);
    gap: 18px;
    padding: 26px;
    border-radius: 24px;
    color: #eef4ff;
    background: linear-gradient(145deg, rgba(10, 20, 50, .995), rgba(31, 15, 55, .995));
    border-color: rgba(104, 143, 255, .38);
}

#admin-home-graphics .admin-replace-heading { display: grid; gap: 5px; padding-right: 44px; }
#admin-home-graphics .admin-replace-heading > span {
    color: #51ddff;
    font-size: .66rem;
    font-weight: 1000;
    letter-spacing: .14em;
}
#admin-home-graphics .admin-replace-heading h2 { padding: 0; font-size: 1.55rem; }
#admin-home-graphics .admin-replace-heading p { margin: 0; color: rgba(222, 232, 255, .72); font-size: .78rem; line-height: 1.45; }

#admin-home-graphics .admin-current-graphic {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr);
    gap: 18px;
    padding: 14px;
    border-radius: 18px;
    background: rgba(2, 9, 28, .64);
    border: 1px solid rgba(104, 145, 255, .22);
}

#admin-home-graphics .admin-current-graphic-preview {
    position: relative;
    isolation: isolate;
    contain: paint;
    min-height: 280px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border-radius: 13px;
    background: #070d22;
}

#admin-home-graphics .admin-current-graphic-preview > img,
#admin-home-graphics .admin-current-graphic-preview > video {
    width: 100%;
    height: 280px;
    object-fit: contain;
}

#admin-home-graphics .admin-current-graphic-preview.is-slider-preview {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 5px;
    padding: 5px;
}

#admin-home-graphics .admin-current-graphic-preview.is-slider-preview > img {
    height: 134px;
    object-fit: cover;
    border-radius: 8px;
}

#admin-home-graphics .admin-current-graphic-info {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
}

#admin-home-graphics .admin-current-graphic-info > span { color: #51ddff; font-size: .62rem; font-weight: 1000; letter-spacing: .12em; }
#admin-home-graphics .admin-current-graphic-info > strong { color: #fff; font-size: 1.15rem; line-height: 1.25; overflow-wrap: anywhere; }
#admin-home-graphics .admin-current-graphic-info > code {
    max-height: 105px;
    padding: 10px;
    overflow: auto;
    border-radius: 10px;
    color: #cad9ff;
    background: rgba(255, 255, 255, .055);
    font-size: .68rem;
    line-height: 1.5;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}
#admin-home-graphics .admin-current-graphic-info > small { color: rgba(226, 235, 255, .7); font-size: .68rem; line-height: 1.45; }

#admin-home-graphics .admin-slot-spec {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

#admin-home-graphics .admin-slot-spec > span { min-height: 74px; padding: 11px; }
#admin-home-graphics .admin-slot-spec b { color: #fff; font-size: .63rem; }
#admin-home-graphics .admin-slot-spec small,
#admin-home-graphics .admin-slot-spec code { color: #bdcae9; font-size: .68rem; line-height: 1.4; }

#admin-home-graphics .admin-upload-field {
    padding: 14px;
    border-radius: 14px;
    color: #fff;
    background: rgba(255, 255, 255, .045);
    border: 1px solid rgba(121, 150, 236, .24);
}

#admin-home-graphics .admin-upload-field > small { color: rgba(220, 231, 255, .65); font-size: .66rem; font-weight: 700; }
#admin-home-graphics .admin-upload-field input[type=file] {
    padding: 10px;
    border-radius: 10px;
    color: #eaf2ff;
    background: rgba(3, 9, 27, .65);
    border: 1px dashed rgba(82, 218, 255, .4);
}

#admin-home-graphics .admin-download-current,
#admin-home-graphics .admin-library-open-btn,
#admin-home-graphics .admin-slot-actions .ghost-btn,
#admin-home-graphics .admin-media-library-card .ghost-btn {
    color: #eaf2ff !important;
    background: rgba(39, 54, 98, .42) !important;
    border-color: rgba(117, 151, 245, .35) !important;
}

#admin-home-graphics .admin-library-open-btn {
    min-height: 50px;
    border-color: rgba(70, 219, 255, .55) !important;
}

#admin-home-graphics .admin-slot-actions { gap: 10px; }
#admin-home-graphics .admin-slot-actions.is-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
#admin-home-graphics .admin-slot-actions button { min-height: 48px; white-space: normal; line-height: 1.2; }
#admin-home-graphics .admin-slot-actions .primary-btn { color: #fff !important; }

#admin-home-graphics .admin-media-picker-multi .admin-media-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    max-height: 420px;
    padding: 6px;
    overflow: auto;
}

#admin-home-graphics .admin-media-picker-multi .admin-media-choice {
    min-width: 0;
    padding: 8px;
    background: rgba(255, 255, 255, .045);
}

#admin-home-graphics .admin-media-picker-multi .admin-media-choice span { aspect-ratio: 8 / 3; }
#admin-home-graphics .admin-media-picker-multi .admin-media-choice img { object-fit: contain; background: #070d22; }

#admin-home-graphics .admin-media-library-modal {
    position: fixed;
    inset: 0;
    z-index: 380;
    display: grid;
    place-items: center;
    padding: 28px;
    background: rgba(2, 4, 15, .9);
    backdrop-filter: blur(16px);
}

#admin-home-graphics .admin-media-library-modal[hidden] { display: none !important; }
#admin-home-graphics .admin-media-library-card {
    width: min(1280px, calc(100vw - 72px));
    max-width: 1280px;
    max-height: calc(100dvh - 56px);
    padding: 24px;
    color: #eef4ff;
    background: linear-gradient(145deg, rgba(9, 19, 47, .995), rgba(31, 15, 55, .995));
    border: 1px solid rgba(104, 143, 255, .38);
    border-radius: 24px;
}

#admin-home-graphics .admin-media-library-card h2 { margin: 0; color: #fff; font-size: 1.4rem; }
#admin-home-graphics .admin-media-library-card .admin-media-grid { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }

@media (max-width: 1180px) {
    #admin-home-graphics .admin-home-slot-grid { grid-template-columns: 1fr; }
    #admin-home-graphics .admin-slot-spec { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    #admin-home-graphics .admin-media-picker-multi .admin-media-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    #admin-home-graphics .admin-home-slot-grid { gap: 12px; padding: 10px; }
    #admin-home-graphics .admin-home-slot { min-height: 0; }
    #admin-home-graphics .admin-home-slot-preview { height: 170px; min-height: 170px; }
    #admin-home-graphics .admin-replace-modal { padding: 0; }
    #admin-home-graphics .admin-replace-card { width: 100%; max-width: none; max-height: none; padding: 16px 13px 24px; border-radius: 0; }
    #admin-home-graphics .admin-current-graphic { grid-template-columns: 1fr; }
    #admin-home-graphics .admin-current-graphic-preview { min-height: 190px; }
    #admin-home-graphics .admin-current-graphic-preview > img,
    #admin-home-graphics .admin-current-graphic-preview > video { height: 190px; }
    #admin-home-graphics .admin-current-graphic-preview.is-slider-preview > img { height: 88px; }
    #admin-home-graphics .admin-slot-spec { grid-template-columns: 1fr 1fr; }
    #admin-home-graphics .admin-slot-actions,
    #admin-home-graphics .admin-slot-actions.is-two { grid-template-columns: 1fr; }
    #admin-home-graphics .admin-media-picker-multi .admin-media-grid { grid-template-columns: 1fr 1fr; }
    #admin-home-graphics .admin-media-library-modal { padding: 0; }
    #admin-home-graphics .admin-media-library-card { width: 100%; max-height: 100dvh; min-height: 100dvh; padding: 16px 12px 24px; border-radius: 0; }
}

/* Home: one artwork per card, stable image geometry on desktop and mobile. */
.home4-daily { height: auto; }
.home4-daily-layout { align-items: stretch; grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); }
.home4-task-grid { align-items: stretch; }
.home4-task,
.home4-daily-reward {
    min-height: 0;
    aspect-ratio: 700 / 760;
    align-content: end;
    background: #07142e;
}
.home4-task > .home4-task-bg,
.home4-daily-reward > .home4-reward-bg {
    position: absolute;
    inset: 0;
    width: auto;
    height: auto;
    min-height: 0;
    align-self: stretch;
    border: 0;
    border-radius: inherit;
    background: none;
    box-shadow: none;
}
.home4-task > .home4-task-bg img,
.home4-daily-reward > .home4-reward-bg img { width: 100%; height: 100%; object-fit: cover; }
.home4-task { grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto 8px; padding: 14px; }
.home4-task h3 { grid-column: 1 / -1; align-self: end; text-shadow: 0 2px 7px #000; }
.home4-task > div { align-self: center; }
.home4-task > b { align-self: center; text-shadow: 0 2px 6px #000; }
.home4-task-bg::after,
.home4-reward-bg::after { background: linear-gradient(180deg, rgba(2, 7, 24, .02) 34%, rgba(3, 10, 30, .9) 100%); }
.home4-daily-reward {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto 8px;
    justify-items: stretch;
    padding: 14px;
    text-align: left;
}
.home4-daily-reward small,
.home4-daily-reward > b { align-self: end; text-shadow: 0 2px 7px #000; }
.home4-daily-reward > i { width: 100%; }

.home4-feature-card { display: grid; grid-template-rows: auto minmax(0, 1fr); aspect-ratio: 5 / 3; min-height: 0; height: auto; }
.home4-feature-body { height: auto; grid-template-columns: 1fr; }
.home4-feature-body > span:first-child { max-width: 72%; padding-right: 16px; text-shadow: 0 2px 8px rgba(0, 0, 0, .95); }
.home4-card-bg::after { background: linear-gradient(90deg, rgba(4, 11, 31, .9), rgba(4, 11, 31, .48) 58%, rgba(4, 11, 31, .08)); }
.home4-feature-card.is-graphic-only { aspect-ratio: 5 / 3; min-height: 0; }
.home4-feature-card.is-graphic-only .home4-card-bg::after { display: none; }
.home4-feature-card.is-graphic-only .home4-card-bg img { object-fit: cover; }

.home4-community {
    aspect-ratio: 4 / 1;
    min-height: 0;
    height: auto;
    background: #07142e;
}
.home4-community > .dxf-design-media { position: absolute; inset: 0; }
.home4-community > .dxf-design-media::after { display: none; }
.home4-community > .dxf-design-media img { width: 100%; height: 100%; object-fit: contain; }

/* Arena: daily goals first, followed by editable home-style destination cards. */
.arena-home-page { display: grid; gap: 16px; }
.arena-daily-goals {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: grid;
    gap: 14px;
    padding: 20px;
    border: 1px solid rgba(82, 146, 255, .46);
    border-radius: 24px;
    background: linear-gradient(145deg, rgba(8, 29, 63, .96), rgba(9, 12, 40, .98));
    box-shadow: var(--dxf-shadow);
}
.arena-daily-goals > .dxf-panel-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(4, 10, 30, .28), rgba(4, 10, 30, .92)); }
.arena-daily-head { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #fff; }
.arena-daily-head span { color: var(--dxf-cyan); font-weight: 950; }
.arena-daily-head b { color: #d8e4ff; font-size: .85rem; }
.arena-daily-goals .arena-info-card,
.arena-daily-goals .challenge-level-list { position: relative; z-index: 1; margin: 0; }
.arena-daily-goals .arena-info-card { padding: 12px 14px; background: rgba(5, 13, 38, .72); }
.arena-home-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.arena-home-grid .dxf-reference-strip { min-height: 250px; margin: 0; align-items: end; text-decoration: none; }
.arena-home-grid .dxf-reference-strip > div { position: relative; z-index: 1; display: grid; gap: 5px; }
.arena-home-grid .dxf-reference-strip > i { position: absolute; z-index: 2; right: 20px; bottom: 22px; color: #fff; }

@media (max-width: 760px) {
    .home4-daily { height: auto; }
    .home4-daily-layout { height: auto; }
    .home4-task { min-height: 0; grid-template-rows: auto 5px; gap: 3px 4px; padding: 5px; }
    .home4-task h3 { font-size: .56rem; }
    .home4-daily-reward { min-height: 0; grid-template-rows: auto auto 5px; gap: 2px; padding: 5px; justify-items: stretch; text-align: left; }
    .home4-daily-reward small { font-size: .4rem; }
    .home4-daily-reward > b { font-size: .72rem; }
    .home4-daily-reward > i { width: 100%; }
    .home4-feature-card { height: auto; min-height: 0; }
    .home4-feature-body { height: auto; grid-template-columns: 1fr; }
    .home4-feature-body > span:first-child { max-width: 76%; }
    .home4-feature-card.is-graphic-only { height: auto; min-height: 0; }
    .home4-community { height: auto; min-height: 0; border-radius: 15px; }
    .arena-home-page { gap: 8px; }
    .arena-daily-goals { gap: 8px; padding: 9px; border-radius: 16px; }
    .arena-daily-head { align-items: flex-start; flex-direction: column; gap: 3px; }
    .arena-daily-head span { font-size: .76rem; }
    .arena-daily-head b { font-size: .62rem; }
    .arena-daily-goals .arena-info-card { padding: 8px; }
    .arena-daily-goals .arena-info-card p { margin: 0 0 4px; font-size: .68rem; }
    .arena-daily-goals .arena-info-card small { font-size: .58rem; }
    .arena-home-grid { grid-template-columns: 1fr 1fr; gap: 7px; }
    .arena-home-grid .dxf-reference-strip { min-height: 150px; padding: 10px; border-radius: 14px; }
    .arena-home-grid .dxf-reference-strip b { font-size: .86rem; }
    .arena-home-grid .dxf-reference-strip span { font-size: .56rem; }
    .arena-home-grid .dxf-reference-strip > i { right: 9px; bottom: 10px; font-size: .7rem; }
}

/* Sammeln /collect – eigenständiger Referenzaufbau. Absichtlich nur auf der Root-Seite aktiv. */
body.is-collect-root {
    --collect-bg: #020b1f;
    --collect-panel: #071a3a;
    --collect-line: rgba(56, 137, 255, .78);
    --collect-cyan: #18d8ff;
    --collect-pink: #f53bff;
    --collect-violet: #8d42ff;
    overflow-x: hidden;
    background: radial-gradient(circle at 50% 18%, rgba(31, 36, 103, .28), transparent 34%), linear-gradient(180deg, #020815 0%, #031027 45%, #020916 100%);
}

body.is-collect-root .app-main {
    overflow-x: hidden;
}

body.is-collect-root .dxf-collect-page {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    display: block;
    color: #fff;
}

body.is-collect-root .dxf-collect-full-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

body.is-collect-root .dxf-collect-full-bg img,
body.is-collect-root .dxf-collect-full-bg video {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

body.is-collect-root .dxf-collect-hero {
    position: relative;
    isolation: isolate;
    min-height: clamp(290px, 35vw, 470px);
    overflow: hidden;
    border: 1px solid rgba(46, 119, 255, .42);
    border-radius: 26px;
    background: radial-gradient(circle at 66% 38%, rgba(105, 38, 219, .62), transparent 34%), linear-gradient(135deg, #071b43, #110a31 72%);
    box-shadow: 0 18px 52px rgba(0, 0, 0, .34);
}

body.is-collect-root .dxf-collect-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(1, 9, 27, .72) 0%, rgba(1, 9, 27, .38) 38%, rgba(1, 9, 27, .05) 68%, rgba(1, 9, 27, .18) 100%);
}

body.is-collect-root .dxf-collect-hero-copy {
    position: absolute;
    z-index: 2;
    left: clamp(24px, 4vw, 52px);
    top: 50%;
    width: min(47%, 560px);
    transform: translateY(-50%);
    text-shadow: 0 3px 16px rgba(0, 0, 0, .65);
}

body.is-collect-root .dxf-collect-hero-copy h1 {
    margin: 0 0 10px;
    font-size: clamp(2.3rem, 5vw, 4.8rem);
    line-height: .96;
    font-weight: 950;
    letter-spacing: -.045em;
}

body.is-collect-root .dxf-collect-hero-copy p {
    max-width: 560px;
    margin: 0;
    color: rgba(241, 246, 255, .88);
    font-size: clamp(.82rem, 1.4vw, 1.16rem);
    line-height: 1.42;
    font-weight: 650;
}

body.is-collect-root .dxf-collect-level-orb {
    position: absolute;
    z-index: 3;
    top: 28px;
    right: 28px;
    width: 112px;
    height: 112px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 2px;
    border: 2px solid rgba(255, 73, 231, .92);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(114, 38, 226, .58), rgba(12, 10, 47, .92));
    box-shadow: 0 0 34px rgba(245, 59, 255, .36), inset 0 0 22px rgba(51, 169, 255, .15);
    text-align: center;
}

body.is-collect-root .dxf-collect-level-orb i {
    color: #ff68e9;
    font-size: 1.2rem;
}

body.is-collect-root .dxf-collect-level-orb b {
    font-size: 1.32rem;
    line-height: 1;
}

body.is-collect-root .dxf-collect-level-orb small {
    color: #b9c9ff;
    font-size: .62rem;
    font-weight: 950;
    letter-spacing: .04em;
}

body.is-collect-root .dxf-collect-shell {
    width: 100%;
    display: grid;
    gap: 20px;
    padding: 22px 0 10px;
}

body.is-collect-root .dxf-collect-tools {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
}

body.is-collect-root .dxf-collect-tools label,
body.is-collect-root .dxf-collect-tools button {
    min-height: 58px;
    border: 1px solid rgba(63, 126, 255, .82);
    border-radius: 19px;
    background: rgba(4, 21, 52, .92);
    box-shadow: inset 0 0 22px rgba(32, 91, 189, .08);
}

body.is-collect-root .dxf-collect-tools label {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    padding: 0 18px;
    color: var(--collect-cyan);
}

body.is-collect-root .dxf-collect-tools label > i {
    font-size: 1.1rem;
}

body.is-collect-root .dxf-collect-tools input {
    min-width: 0;
    height: 100%;
    padding: 0;
    border: 0;
    outline: 0;
    background: transparent;
    box-shadow: none;
    color: #fff;
    font-size: .96rem;
    font-weight: 750;
}

body.is-collect-root .dxf-collect-tools input::placeholder {
    color: rgba(208, 220, 255, .52);
}

body.is-collect-root .dxf-collect-tools button {
    min-width: 128px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 0 18px;
    color: #e7ebff;
    font-size: .9rem;
    font-weight: 850;
}

body.is-collect-root .dxf-collect-tools button i {
    color: #ff4fe5;
    font-size: 1.15rem;
}

body.is-collect-root .dxf-collect-tabs {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
}

body.is-collect-root .dxf-collect-tabs a {
    min-width: 0;
    min-height: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 10px;
    border: 1px solid rgba(66, 128, 255, .72);
    border-radius: 999px;
    background: rgba(4, 20, 49, .9);
    color: #dbe6ff;
    text-decoration: none;
    font-size: .82rem;
    font-weight: 850;
    white-space: nowrap;
}

body.is-collect-root .dxf-collect-tabs a i {
    color: #a8c9ff;
}

body.is-collect-root .dxf-collect-tabs a.is-active {
    border-color: #ff68f4;
    background: linear-gradient(135deg, #9d0bd9, #f329e9);
    color: #fff;
    box-shadow: 0 0 18px rgba(245, 59, 255, .44), inset 0 0 18px rgba(255, 255, 255, .08);
}

body.is-collect-root .dxf-collect-feature {
    position: relative;
    isolation: isolate;
    min-height: 245px;
    overflow: hidden;
    border: 1px solid rgba(61, 135, 255, .82);
    border-radius: 24px;
    background: radial-gradient(circle at 75% 45%, rgba(83, 41, 202, .5), transparent 40%), linear-gradient(135deg, #071e47, #111038);
    box-shadow: inset 0 0 32px rgba(36, 99, 206, .09);
}

body.is-collect-root .dxf-collect-feature::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(2, 16, 44, .93) 0%, rgba(2, 16, 44, .66) 43%, rgba(2, 16, 44, .12) 72%, rgba(2, 16, 44, .28) 100%);
}

body.is-collect-root .dxf-collect-feature-copy {
    position: absolute;
    z-index: 2;
    left: 30px;
    top: 50%;
    width: 54%;
    transform: translateY(-50%);
}

body.is-collect-root .dxf-collect-feature-copy small {
    color: var(--collect-cyan);
    font-size: .78rem;
    font-weight: 950;
    letter-spacing: .06em;
}

body.is-collect-root .dxf-collect-feature-copy h2 {
    margin: 4px 0 5px;
    font-size: clamp(1.8rem, 3.4vw, 3rem);
    line-height: 1;
}

body.is-collect-root .dxf-collect-feature-copy p {
    margin: 0 0 16px;
    color: #d9e3ff;
    font-size: .95rem;
    font-weight: 700;
}

body.is-collect-root .dxf-collect-progress {
    width: min(100%, 620px);
    height: 12px;
    overflow: hidden;
    border: 1px solid rgba(255, 79, 229, .82);
    border-radius: 999px;
    background: rgba(8, 17, 52, .8);
    box-shadow: 0 0 14px rgba(245, 59, 255, .18);
}

body.is-collect-root .dxf-collect-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #f32ae9, #b641ff 48%, #1cdcff 100%);
    box-shadow: 0 0 16px rgba(34, 220, 255, .42);
}

body.is-collect-root .dxf-collect-feature-copy > b {
    display: block;
    margin-top: 8px;
    color: var(--collect-cyan);
    font-size: .9rem;
}

body.is-collect-root .dxf-collect-reward-state {
    position: absolute;
    z-index: 3;
    right: 24px;
    bottom: 18px;
    display: grid;
    justify-items: end;
    gap: 5px;
    text-decoration: none;
}

body.is-collect-root .dxf-collect-reward-state small {
    color: #ffe51d;
    font-size: .69rem;
    font-weight: 950;
    letter-spacing: .02em;
}

body.is-collect-root .dxf-collect-reward-state span {
    min-width: 190px;
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 0 17px;
    border: 1px solid #ff4be8;
    border-radius: 999px;
    background: rgba(27, 21, 83, .88);
    color: #fff;
    box-shadow: 0 0 18px rgba(245, 59, 255, .28);
    font-weight: 900;
}

body.is-collect-root .dxf-collect-category-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

body.is-collect-root .dxf-collect-category-card {
    position: relative;
    isolation: isolate;
    min-width: 0;
    aspect-ratio: 700 / 760;
    overflow: hidden;
    border: 1px solid rgba(56, 132, 255, .8);
    border-radius: 21px;
    background: radial-gradient(circle at 50% 35%, rgba(77, 70, 198, .48), transparent 43%), linear-gradient(145deg, #09234c, #0a1436 62%, #15103b);
    color: #fff;
    text-decoration: none;
}

body.is-collect-root .dxf-collect-category-card::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(4, 13, 39, .02) 35%, rgba(3, 12, 34, .86) 73%, rgba(3, 12, 34, .96) 100%);
}

body.is-collect-root .dxf-collect-category-placeholder {
    position: absolute;
    z-index: 1;
    inset: 12% 16% 34%;
    display: grid;
    place-items: center;
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(29, 209, 255, .12), rgba(245, 59, 255, .16));
    color: #b8d5ff;
    font-size: clamp(2rem, 5vw, 4.5rem);
}

body.is-collect-root .dxf-collect-category-copy {
    position: absolute;
    z-index: 3;
    left: 14px;
    right: 36px;
    bottom: 20px;
    display: grid;
    gap: 2px;
}

body.is-collect-root .dxf-collect-category-copy b {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: clamp(.85rem, 1.5vw, 1.08rem);
}

body.is-collect-root .dxf-collect-category-copy small {
    color: #c8d9ff;
    font-size: .78rem;
    font-weight: 800;
}

body.is-collect-root .dxf-collect-category-card > i {
    position: absolute;
    z-index: 3;
    right: 13px;
    bottom: 35px;
    color: #c39cff;
}

body.is-collect-root .dxf-collect-category-progress {
    position: absolute;
    z-index: 3;
    left: 14px;
    right: 14px;
    bottom: 9px;
    height: 5px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(22, 40, 87, .94);
}

body.is-collect-root .dxf-collect-category-progress i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #b42eff, #18d8ff);
    box-shadow: 0 0 9px rgba(24, 216, 255, .5);
}

body.is-collect-root .dxf-collect-latest {
    display: grid;
    gap: 12px;
}

body.is-collect-root .dxf-collect-latest > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

body.is-collect-root .dxf-collect-latest > header h2 {
    margin: 0;
    font-size: 1.35rem;
}

body.is-collect-root .dxf-collect-latest > header h2 i {
    margin-right: 8px;
    color: #ee59ff;
    filter: drop-shadow(0 0 9px rgba(238, 89, 255, .46));
}

body.is-collect-root .dxf-collect-latest > header a {
    color: var(--collect-cyan);
    text-decoration: none;
    font-size: .82rem;
    font-weight: 900;
    white-space: nowrap;
}

body.is-collect-root .dxf-collect-avatar-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

body.is-collect-root .dxf-collect-avatar-card {
    position: relative;
    min-width: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto auto;
    gap: 5px;
    padding: 10px;
    overflow: hidden;
    border: 1px solid rgba(61, 135, 255, .82);
    border-radius: 19px;
    background: linear-gradient(160deg, rgba(10, 34, 77, .96), rgba(11, 16, 54, .98));
    color: #fff;
    text-decoration: none;
}

body.is-collect-root .dxf-collect-avatar-card[hidden] {
    display: none !important;
}

body.is-collect-root .dxf-collect-avatar-art {
    min-height: 0;
    aspect-ratio: 1 / 1;
    display: grid;
    place-items: end center;
    overflow: hidden;
    border-radius: 13px;
    background: radial-gradient(circle at 50% 42%, rgba(96, 69, 202, .52), rgba(14, 38, 80, .94));
}

body.is-collect-root .dxf-collect-avatar-art .avatar-static-shell,
body.is-collect-root .dxf-collect-avatar-art .dxf-collect-avatar-image-shell,
body.is-collect-root .dxf-collect-avatar-art > img {
    width: 100%;
    height: 100%;
    display: block;
}

body.is-collect-root .dxf-collect-avatar-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center bottom;
}

body.is-collect-root .dxf-collect-avatar-card > b {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .88rem;
}

body.is-collect-root .dxf-collect-avatar-card > small {
    min-height: 20px;
    display: grid;
    place-items: center;
    padding: 0 7px;
    border: 1px solid rgba(255, 58, 235, .62);
    border-radius: 999px;
    background: rgba(99, 21, 130, .72);
    color: #ff83eb;
    font-size: .63rem;
    font-weight: 950;
    letter-spacing: .02em;
}

body.is-collect-root .dxf-collect-avatar-card.is-missing > small {
    border-color: rgba(28, 186, 255, .66);
    background: rgba(5, 82, 135, .72);
    color: #3de4ff;
}

body.is-collect-root .dxf-collect-avatar-check,
body.is-collect-root .dxf-collect-avatar-new {
    position: absolute;
    z-index: 4;
    top: 15px;
    right: 15px;
}

body.is-collect-root .dxf-collect-avatar-check {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #13c999;
    color: #fff;
    box-shadow: 0 0 14px rgba(19, 201, 153, .48);
}

body.is-collect-root .dxf-collect-avatar-new {
    min-height: 26px;
    display: inline-flex;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    background: linear-gradient(135deg, #ac16e7, #ff35df);
    font-size: .62rem;
    font-weight: 950;
    box-shadow: 0 0 14px rgba(245, 59, 255, .38);
}

body.is-collect-root .dxf-collect-promo {
    position: relative;
    isolation: isolate;
    min-height: 140px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 20px;
    overflow: hidden;
    padding: 24px 28px;
    border: 1px solid rgba(63, 136, 255, .84);
    border-radius: 22px;
    background: radial-gradient(circle at 18% 60%, rgba(56, 144, 255, .36), transparent 30%), linear-gradient(130deg, #082b58, #11133d 58%, #07152f);
    color: #fff;
    text-decoration: none;
}

body.is-collect-root .dxf-collect-promo::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(3, 15, 42, .18), rgba(3, 15, 42, .72) 58%, rgba(3, 15, 42, .88));
}

body.is-collect-root .dxf-collect-promo > span,
body.is-collect-root .dxf-collect-promo > strong {
    position: relative;
    z-index: 2;
}

body.is-collect-root .dxf-collect-promo > span {
    display: grid;
    gap: 5px;
    padding-left: min(22vw, 250px);
}

body.is-collect-root .dxf-collect-promo > span b {
    font-size: clamp(1.25rem, 2.5vw, 2.2rem);
}

body.is-collect-root .dxf-collect-promo > span small {
    color: #d9e3ff;
    font-size: .88rem;
    line-height: 1.3;
}

body.is-collect-root .dxf-collect-promo > strong {
    min-width: 180px;
    min-height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 0 24px;
    border: 1px solid #ff62ed;
    border-radius: 999px;
    background: linear-gradient(135deg, #ab18dc, #ff2add);
    box-shadow: 0 0 20px rgba(245, 59, 255, .38);
}

body.is-collect-root .dxf-collect-topbar {
    box-sizing: border-box;
}

body.is-collect-root .dxf-collect-top-resources {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

body.is-collect-root .dxf-collect-resource {
    min-width: 138px;
    height: 42px;
    display: grid;
    grid-template-columns: 25px minmax(0, 1fr) 30px;
    align-items: center;
    gap: 6px;
    padding: 0 5px 0 10px;
    border: 1px solid rgba(98, 81, 255, .78);
    border-radius: 999px;
    background: rgba(6, 15, 45, .9);
    box-shadow: inset 0 0 15px rgba(64, 36, 160, .13);
}

body.is-collect-root .dxf-collect-resource img {
    width: 23px;
    height: 23px;
    object-fit: contain;
}

body.is-collect-root .dxf-collect-resource b {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .82rem;
}

body.is-collect-root .dxf-collect-resource > a {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(132, 87, 255, .88);
    border-radius: 9px;
    background: linear-gradient(145deg, #3155d6, #6112b3);
    color: #fff;
    text-decoration: none;
    font-size: 1.05rem;
    line-height: 1;
}

body.is-collect-root .dxf-collect-notifications {
    position: relative;
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    color: #a9c5ff;
    text-decoration: none;
    font-size: 1.55rem;
}

body.is-collect-root .dxf-collect-notifications span {
    position: absolute;
    top: 3px;
    right: 2px;
    width: 10px;
    height: 10px;
    border: 2px solid #071028;
    border-radius: 50%;
    background: #ff35d5;
    box-shadow: 0 0 9px rgba(255, 53, 213, .7);
}

@media (min-width: 761px) {
    body.is-collect-root .dxf-collect-topbar .dxf-collect-brand img {
        width: 210px !important;
        max-height: 58px !important;
    }
    body.is-collect-root .dxf-collect-shell {
        padding-left: clamp(18px, 2.4vw, 34px);
        padding-right: clamp(18px, 2.4vw, 34px);
    }
}

@media (max-width: 760px) {
    body.is-collect-root .side-nav {
        display: none !important;
    }

    body.is-collect-root .game-header.dxf-collect-topbar {
        left: 0 !important;
        right: 0 !important;
        width: 100vw !important;
        max-width: none !important;
        height: 82px !important;
        min-height: 82px !important;
        display: grid !important;
        grid-template-columns: minmax(106px, 1fr) auto !important;
        align-items: center !important;
        gap: 5px !important;
        padding: 5px max(7px, env(safe-area-inset-right)) 5px max(8px, env(safe-area-inset-left)) !important;
        transform: none !important;
        border-radius: 0 !important;
    }

    body.is-collect-root .dxf-collect-brand {
        min-width: 0;
        height: 70px;
        display: flex;
        align-items: center;
    }

    body.is-collect-root .dxf-collect-brand img {
        width: clamp(112px, 31vw, 150px) !important;
        max-width: 100% !important;
        max-height: 64px !important;
        object-fit: contain !important;
        object-position: left center !important;
    }

    body.is-collect-root .dxf-collect-top-resources {
        gap: 4px;
    }

    body.is-collect-root .dxf-collect-resource {
        min-width: 0;
        width: clamp(76px, 22vw, 96px);
        height: 34px;
        grid-template-columns: 18px minmax(0, 1fr) 23px;
        gap: 3px;
        padding: 0 3px 0 6px;
    }

    body.is-collect-root .dxf-collect-resource img {
        width: 18px;
        height: 18px;
    }

    body.is-collect-root .dxf-collect-resource b {
        font-size: clamp(.55rem, 2.1vw, .69rem);
    }

    body.is-collect-root .dxf-collect-resource > a {
        width: 22px;
        height: 22px;
        border-radius: 7px;
        font-size: .82rem;
    }

    body.is-collect-root .dxf-collect-notifications {
        width: 30px;
        height: 34px;
        font-size: 1.25rem;
    }

    body.is-collect-root .dxf-collect-notifications span {
        width: 8px;
        height: 8px;
        top: 1px;
        right: 0;
    }

    body.is-collect-root .app-main {
        width: 100% !important;
        max-width: none !important;
        padding: 82px 0 calc(84px + env(safe-area-inset-bottom)) !important;
    }

    body.is-collect-root .dxf-collect-page {
        max-width: none;
    }

    body.is-collect-root .dxf-collect-hero {
        min-height: 172px;
        border-left: 0;
        border-right: 0;
        border-radius: 0;
    }

    body.is-collect-root .dxf-collect-hero-copy {
        left: 18px;
        width: 48%;
    }

    body.is-collect-root .dxf-collect-hero-copy h1 {
        margin-bottom: 6px;
        font-size: clamp(1.85rem, 8.4vw, 2.3rem);
    }

    body.is-collect-root .dxf-collect-hero-copy p {
        font-size: clamp(.57rem, 2.35vw, .72rem);
        line-height: 1.3;
    }

    body.is-collect-root .dxf-collect-level-orb {
        top: 14px;
        right: 13px;
        width: 64px;
        height: 64px;
        gap: 1px;
        border-width: 1.5px;
    }

    body.is-collect-root .dxf-collect-level-orb i {
        font-size: .72rem;
    }

    body.is-collect-root .dxf-collect-level-orb b {
        font-size: .86rem;
    }

    body.is-collect-root .dxf-collect-level-orb small {
        font-size: .38rem;
    }

    body.is-collect-root .dxf-collect-shell {
        gap: 12px;
        padding: 12px 12px 8px;
    }

    body.is-collect-root .dxf-collect-tools {
        gap: 7px;
    }

    body.is-collect-root .dxf-collect-tools label,
    body.is-collect-root .dxf-collect-tools button {
        min-height: 44px;
        border-radius: 13px;
    }

    body.is-collect-root .dxf-collect-tools label {
        grid-template-columns: 20px minmax(0, 1fr);
        gap: 6px;
        padding: 0 11px;
    }

    body.is-collect-root .dxf-collect-tools label > i {
        font-size: .9rem;
    }

    body.is-collect-root .dxf-collect-tools input {
        font-size: .68rem;
    }

    body.is-collect-root .dxf-collect-tools button {
        min-width: 82px;
        gap: 6px;
        padding: 0 10px;
        font-size: .67rem;
    }

    body.is-collect-root .dxf-collect-tools button i {
        font-size: .9rem;
    }

    body.is-collect-root .dxf-collect-tabs {
        gap: 5px;
    }

    body.is-collect-root .dxf-collect-tabs a {
        min-height: 34px;
        gap: 4px;
        padding: 0 4px;
        border-radius: 999px;
        font-size: clamp(.52rem, 2.2vw, .65rem);
    }

    body.is-collect-root .dxf-collect-tabs a i {
        font-size: .73rem;
    }

    body.is-collect-root .dxf-collect-feature {
        min-height: 138px;
        border-radius: 15px;
    }

    body.is-collect-root .dxf-collect-feature-copy {
        left: 15px;
        width: 56%;
    }

    body.is-collect-root .dxf-collect-feature-copy small {
        font-size: .53rem;
    }

    body.is-collect-root .dxf-collect-feature-copy h2 {
        margin: 3px 0 4px;
        font-size: clamp(1.15rem, 5vw, 1.48rem);
    }

    body.is-collect-root .dxf-collect-feature-copy p {
        margin-bottom: 9px;
        font-size: .59rem;
    }

    body.is-collect-root .dxf-collect-progress {
        height: 8px;
    }

    body.is-collect-root .dxf-collect-feature-copy > b {
        margin-top: 5px;
        font-size: .58rem;
    }

    body.is-collect-root .dxf-collect-reward-state {
        right: 11px;
        bottom: 9px;
        gap: 3px;
    }

    body.is-collect-root .dxf-collect-reward-state small {
        font-size: .42rem;
    }

    body.is-collect-root .dxf-collect-reward-state span {
        min-width: 104px;
        min-height: 28px;
        gap: 8px;
        padding: 0 10px;
        font-size: .62rem;
    }

    body.is-collect-root .dxf-collect-category-grid {
        gap: 7px;
    }

    body.is-collect-root .dxf-collect-category-card {
        border-radius: 12px;
    }

    body.is-collect-root .dxf-collect-category-placeholder {
        inset: 10% 14% 34%;
        border-radius: 10px;
        font-size: clamp(1.4rem, 8vw, 2.2rem);
    }

    body.is-collect-root .dxf-collect-category-copy {
        left: 8px;
        right: 20px;
        bottom: 14px;
        gap: 1px;
    }

    body.is-collect-root .dxf-collect-category-copy b {
        font-size: clamp(.58rem, 2.5vw, .72rem);
    }

    body.is-collect-root .dxf-collect-category-copy small {
        font-size: .5rem;
    }

    body.is-collect-root .dxf-collect-category-card > i {
        right: 7px;
        bottom: 24px;
        font-size: .6rem;
    }

    body.is-collect-root .dxf-collect-category-progress {
        left: 8px;
        right: 8px;
        bottom: 6px;
        height: 3px;
    }

    body.is-collect-root .dxf-collect-latest {
        gap: 8px;
    }

    body.is-collect-root .dxf-collect-latest > header {
        gap: 10px;
    }

    body.is-collect-root .dxf-collect-latest > header h2 {
        font-size: .96rem;
    }

    body.is-collect-root .dxf-collect-latest > header h2 i {
        margin-right: 5px;
    }

    body.is-collect-root .dxf-collect-latest > header a {
        font-size: .58rem;
    }

    body.is-collect-root .dxf-collect-avatar-grid {
        gap: 7px;
    }

    body.is-collect-root .dxf-collect-avatar-card {
        gap: 3px;
        padding: 6px;
        border-radius: 12px;
    }

    body.is-collect-root .dxf-collect-avatar-art {
        border-radius: 8px;
    }

    body.is-collect-root .dxf-collect-avatar-card > b {
        font-size: clamp(.52rem, 2.4vw, .67rem);
    }

    body.is-collect-root .dxf-collect-avatar-card > small {
        min-height: 15px;
        padding: 0 3px;
        font-size: clamp(.4rem, 1.7vw, .49rem);
    }

    body.is-collect-root .dxf-collect-avatar-check,
    body.is-collect-root .dxf-collect-avatar-new {
        top: 8px;
        right: 8px;
    }

    body.is-collect-root .dxf-collect-avatar-check {
        width: 22px;
        height: 22px;
        font-size: .58rem;
    }

    body.is-collect-root .dxf-collect-avatar-new {
        min-height: 19px;
        padding: 0 6px;
        font-size: .43rem;
    }

    body.is-collect-root .dxf-collect-promo {
        min-height: 76px;
        gap: 8px;
        padding: 10px 10px;
        border-radius: 12px;
    }

    body.is-collect-root .dxf-collect-promo > span {
        gap: 2px;
        padding-left: 27%;
    }

    body.is-collect-root .dxf-collect-promo > span b {
        font-size: clamp(.72rem, 3.1vw, .92rem);
    }

    body.is-collect-root .dxf-collect-promo > span small {
        font-size: clamp(.43rem, 1.9vw, .54rem);
    }

    body.is-collect-root .dxf-collect-promo > strong {
        min-width: 92px;
        min-height: 31px;
        gap: 7px;
        padding: 0 10px;
        font-size: .58rem;
    }

    body.is-collect-root .bottom-nav.dxf-global-bottom-nav {
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100vw !important;
        max-width: none !important;
        height: calc(76px + env(safe-area-inset-bottom)) !important;
        min-height: calc(76px + env(safe-area-inset-bottom)) !important;
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        align-items: stretch !important;
        gap: 0 !important;
        padding: 4px 5px env(safe-area-inset-bottom) !important;
        transform: none !important;
        border-radius: 18px 18px 0 0 !important;
        box-sizing: border-box !important;
        background: rgba(3, 14, 39, .98) !important;
        border-top: 1px solid rgba(57, 115, 214, .42) !important;
        box-shadow: 0 -7px 24px rgba(0, 0, 0, .42) !important;
    }

    body.is-collect-root .bottom-nav .bottom-link {
        position: relative !important;
        min-width: 0 !important;
        min-height: 68px !important;
        height: 68px !important;
        display: grid !important;
        grid-template-rows: 34px 18px !important;
        place-items: center !important;
        align-content: center !important;
        gap: 1px !important;
        padding: 0 !important;
        transform: none !important;
        background: transparent !important;
        color: #b8ccff !important;
        font-size: .61rem !important;
        font-weight: 750 !important;
        text-decoration: none !important;
        box-sizing: border-box !important;
    }

    body.is-collect-root .bottom-nav .bottom-link::before {
        content: "";
        position: absolute;
        top: -4px;
        left: 27%;
        right: 27%;
        height: 3px;
        border-radius: 999px;
        background: transparent;
    }

    body.is-collect-root .bottom-nav .bottom-link.active::before {
        background: #ee38f2;
        box-shadow: 0 0 10px rgba(238, 56, 242, .65);
    }

    body.is-collect-root .bottom-nav .bottom-link > .nav-label,
    body.is-collect-root .bottom-nav .bottom-link > span:not(.nav-ico) {
        display: block !important;
        width: 100% !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        text-align: center !important;
        line-height: 18px !important;
        color: inherit !important;
    }

    body.is-collect-root .bottom-nav .bottom-link.active > .nav-label {
        color: #fff !important;
        text-shadow: 0 0 8px rgba(238, 56, 242, .52) !important;
    }

    body.is-collect-root .bottom-nav .bottom-link .nav-ico,
    body.is-collect-root .dxf-global-bottom-nav .bottom-link .nav-ico {
        width: 32px !important;
        height: 32px !important;
        min-width: 32px !important;
        min-height: 32px !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        transform: none !important;
    }

    body.is-collect-root .bottom-nav .bottom-link .nav-ico img,
    body.is-collect-root .dxf-global-bottom-nav .bottom-link .nav-ico img {
        width: 32px !important;
        height: 32px !important;
        max-width: 32px !important;
        max-height: 32px !important;
        object-fit: contain !important;
        opacity: .82 !important;
        transform: none !important;
        filter: none !important;
    }

    body.is-collect-root .bottom-nav .bottom-link.active .nav-ico img {
        opacity: 1 !important;
        transform: none !important;
        filter: drop-shadow(0 0 6px rgba(238, 56, 242, .58)) !important;
    }
}

@media (max-width: 390px) {
    body.is-collect-root .game-header.dxf-collect-topbar {
        grid-template-columns: minmax(94px, 1fr) auto !important;
    }
    body.is-collect-root .dxf-collect-brand img {
        width: clamp(98px, 29vw, 118px) !important;
    }
    body.is-collect-root .dxf-collect-resource {
        width: clamp(70px, 21vw, 82px);
        grid-template-columns: 16px minmax(0, 1fr) 21px;
    }
    body.is-collect-root .dxf-collect-resource img {
        width: 16px;
        height: 16px;
    }
    body.is-collect-root .dxf-collect-resource > a {
        width: 20px;
        height: 20px;
    }
    body.is-collect-root .dxf-collect-notifications {
        width: 27px;
    }
    body.is-collect-root .dxf-collect-tabs a {
        font-size: .49rem;
    }
}

/* Spielen reference rebuild - isolated to /play and /spielen. */
body.is-play-root {
    background:
        radial-gradient(circle at 72% 9%, rgba(55, 35, 181, .16), transparent 28rem),
        radial-gradient(circle at 12% 28%, rgba(0, 154, 255, .09), transparent 26rem),
        #020a1d !important;
}

body.is-play-root .dxf-play-screen {
    width: min(100%, 1180px);
    gap: 18px;
    margin: 0 auto;
    padding-bottom: 34px;
}

body.is-play-root .dxf-play-intro {
    min-width: 0;
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 22px;
    padding: 2px 10px 0;
}

body.is-play-root .dxf-play-intro > div {
    min-width: 0;
}

body.is-play-root .dxf-play-intro h1 {
    margin: 0;
    color: #fff;
    font-size: clamp(2.3rem, 5vw, 4.2rem);
    font-weight: 1000;
    line-height: .96;
    letter-spacing: -.045em;
    text-shadow: 0 0 18px rgba(79, 126, 255, .18);
}

body.is-play-root .dxf-play-intro p {
    margin: 10px 0 0;
    color: #c7d4f5;
    font-size: clamp(.88rem, 1.75vw, 1.18rem);
    line-height: 1.3;
}

body.is-play-root .dxf-play-intro > span {
    flex: 0 0 auto;
    padding: 0 14px 2px 0;
    color: #ea70ff;
    font-family: "Segoe Script", "Brush Script MT", cursive;
    font-size: clamp(1.08rem, 2.5vw, 1.9rem);
    font-weight: 700;
    line-height: 1.06;
    text-align: right;
    transform: rotate(-6deg);
    text-shadow: 0 0 14px rgba(230, 75, 255, .28);
}

body.is-play-root .dxf-play-full-bg {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    border: 1px solid rgba(64, 187, 255, .68);
    background: linear-gradient(145deg, #071f48 0%, #07152f 48%, #180d3b 100%);
    box-shadow: inset 0 0 0 1px rgba(68, 100, 255, .1), 0 12px 34px rgba(0, 0, 0, .28);
}

body.is-play-root .dxf-play-full-bg > .dxf-play-card-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: inherit;
    pointer-events: none;
}

body.is-play-root .dxf-play-full-bg > .dxf-play-card-bg img,
body.is-play-root .dxf-play-full-bg > .dxf-play-card-bg video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.is-play-root .dxf-play-full-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(2, 10, 31, .52) 0%, rgba(3, 12, 34, .1) 54%, rgba(3, 10, 28, .16) 100%);
}

body.is-play-root .dxf-play-full-bg > :not(.dxf-play-card-bg) {
    position: relative;
    z-index: 2;
}

body.is-play-root .dxf-play-race-card {
    min-height: 500px;
    border-radius: 28px;
}

body.is-play-root .dxf-play-race-card::after {
    background:
        linear-gradient(180deg, rgba(2, 9, 28, .04) 0%, rgba(3, 8, 27, .02) 42%, rgba(3, 8, 27, .42) 72%, rgba(3, 8, 27, .94) 100%),
        linear-gradient(90deg, rgba(3, 8, 27, .34), transparent 48%);
}

body.is-play-root .dxf-play-race-season {
    position: absolute !important;
    top: 20px;
    right: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 52px;
    padding: 7px 13px;
    border: 1px solid rgba(115, 126, 225, .5);
    border-radius: 12px;
    background: rgba(5, 12, 39, .86);
    box-shadow: 0 8px 22px rgba(0, 0, 0, .28);
    backdrop-filter: blur(12px);
}

body.is-play-root .dxf-play-race-season > i {
    color: #ffc34c;
    font-size: 1.2rem;
}

body.is-play-root .dxf-play-race-season > span {
    display: grid;
    gap: 2px;
}

body.is-play-root .dxf-play-race-season b {
    color: #fff;
    font-size: .76rem;
    line-height: 1;
}

body.is-play-root .dxf-play-race-season small {
    color: #d2defa;
    font-size: .58rem;
    line-height: 1;
}

body.is-play-root .dxf-play-race-copy {
    min-height: 500px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    gap: 11px;
    padding: 70px 42px 128px;
}

body.is-play-root .dxf-play-race-logo {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    color: #fff;
    font-style: italic;
    text-shadow: 0 3px 2px rgba(0, 0, 0, .34), 0 0 18px rgba(255, 50, 222, .28);
}

body.is-play-root .dxf-play-race-logo > i {
    color: #f6f8ff;
    font-size: clamp(1.6rem, 4vw, 2.5rem);
    filter: drop-shadow(0 0 9px rgba(106, 112, 255, .58));
}

body.is-play-root .dxf-play-race-logo > b {
    font-size: clamp(2rem, 5vw, 4rem);
    font-weight: 1000;
    letter-spacing: -.06em;
    line-height: .95;
}

body.is-play-root .dxf-play-race-copy > p {
    max-width: 410px;
    margin: 0 0 4px;
    color: #fff;
    font-size: clamp(1rem, 2vw, 1.35rem);
    font-weight: 900;
    line-height: 1.2;
    text-transform: uppercase;
    text-shadow: 0 2px 8px rgba(0, 0, 0, .64);
}

body.is-play-root .dxf-play-race-start {
    width: min(470px, 58%);
    min-height: 64px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    padding: 0 24px;
    border: 2px solid rgba(255, 136, 244, .98);
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(180deg, #ff25d0, #d30bcd);
    box-shadow: inset 0 2px 6px rgba(255,255,255,.27), 0 0 28px rgba(246, 31, 224, .62);
    font-size: clamp(1rem, 2vw, 1.35rem);
    font-weight: 1000;
    text-decoration: none;
}

body.is-play-root .dxf-play-week-progress {
    position: absolute !important;
    left: 0;
    right: 0;
    bottom: 0;
    min-height: 108px;
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) auto 120px;
    grid-template-rows: auto auto;
    align-items: center;
    gap: 4px 14px;
    padding: 15px 20px;
    border-top: 1px solid rgba(86, 111, 240, .42);
    background: linear-gradient(90deg, rgba(7, 16, 51, .97), rgba(8, 20, 57, .94) 65%, rgba(18, 21, 54, .97));
    box-shadow: 0 -12px 28px rgba(1, 4, 20, .36);
    backdrop-filter: blur(16px);
}

body.is-play-root .dxf-play-week-flag {
    grid-row: 1 / span 2;
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    color: #fff;
    font-size: 1.85rem;
    filter: drop-shadow(0 0 10px rgba(107, 100, 255, .6));
}

body.is-play-root .dxf-play-week-main {
    min-width: 0;
    display: grid;
    gap: 8px;
}

body.is-play-root .dxf-play-week-main > small {
    color: #fff;
    font-size: .84rem;
    font-weight: 900;
}

body.is-play-root .dxf-play-week-track,
body.is-play-root .dxf-play-task-progress,
body.is-play-root .dxf-play-small-card div > span {
    position: relative;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(37, 54, 101, .92);
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, .48);
}

body.is-play-root .dxf-play-week-track {
    width: 100%;
    max-width: 540px;
    height: 17px;
}

body.is-play-root .dxf-play-week-track > i,
body.is-play-root .dxf-play-task-progress > i,
body.is-play-root .dxf-play-small-card div > span > i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #ef39df, #c326f2 50%, #42dfff);
    box-shadow: 0 0 12px rgba(218, 44, 242, .45);
}

body.is-play-root .dxf-play-week-progress > strong {
    grid-column: 3;
    grid-row: 1;
    align-self: end;
    color: #fff;
    font-size: 1.45rem;
    line-height: 1;
    white-space: nowrap;
}

body.is-play-root .dxf-play-week-progress > em {
    grid-column: 3;
    grid-row: 2;
    align-self: start;
    color: #fff;
    font-size: .65rem;
    font-style: normal;
    font-weight: 750;
    white-space: nowrap;
}

body.is-play-root .dxf-play-week-chest {
    grid-column: 4;
    grid-row: 1 / span 2;
    justify-self: end;
    width: 74px;
    height: 66px;
    display: grid;
    place-items: center;
    color: #ffbd43;
    border-radius: 16px;
    background: radial-gradient(circle, rgba(255, 186, 41, .24), transparent 66%);
    font-size: 2.8rem;
    filter: drop-shadow(0 0 10px rgba(255, 161, 27, .48));
}

body.is-play-root .dxf-play-week-claim {
    grid-column: 4;
    grid-row: 1 / span 2;
    justify-self: end;
    margin: 0;
}

body.is-play-root .dxf-play-week-claim button {
    min-height: 44px;
    padding: 0 14px;
    border: 1px solid rgba(61, 238, 171, .84);
    border-radius: 13px;
    color: #041813;
    background: linear-gradient(180deg, #57f2a5, #24d888);
    box-shadow: 0 0 18px rgba(48, 226, 150, .28);
    font-weight: 950;
}

body.is-play-root .dxf-play-modes-grid {
    display: grid;
    grid-template-columns: minmax(0, .93fr) minmax(0, 1.07fr);
    gap: 16px;
}

body.is-play-root .dxf-play-arena-card,
body.is-play-root .dxf-play-small-card {
    color: #fff;
    text-decoration: none;
}

body.is-play-root .dxf-play-arena-card {
    min-height: 430px;
    border-radius: 24px;
}

body.is-play-root .dxf-play-arena-card::after {
    background: linear-gradient(180deg, rgba(3, 8, 25, .02) 20%, rgba(3, 8, 25, .16) 48%, rgba(5, 9, 29, .9) 100%);
}

body.is-play-root .dxf-play-card-copy {
    min-height: 430px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    gap: 8px;
    padding: 26px 24px;
}

body.is-play-root .dxf-play-card-copy h2 {
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: clamp(1.3rem, 2.8vw, 2rem);
    line-height: 1;
}

body.is-play-root .dxf-play-card-copy h2 i {
    color: #fff;
    filter: drop-shadow(0 0 9px rgba(109, 89, 255, .65));
}

body.is-play-root .dxf-play-card-copy > p {
    margin: 0 0 5px;
    color: #e5ebff;
    font-size: .9rem;
}

body.is-play-root .dxf-play-card-copy > span {
    min-height: 35px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 12px;
    border: 1px solid rgba(132, 117, 255, .38);
    border-radius: 11px;
    background: rgba(15, 16, 45, .82);
    font-size: .75rem;
    font-weight: 850;
    backdrop-filter: blur(8px);
}

body.is-play-root .dxf-play-card-copy > span i {
    color: #ffd057;
}

body.is-play-root .dxf-play-card-copy > strong {
    width: 100%;
    min-height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin-top: 4px;
    border: 1px solid #d66dff;
    border-radius: 16px;
    background: linear-gradient(100deg, rgba(131, 37, 245, .96), rgba(214, 46, 245, .94));
    box-shadow: 0 0 22px rgba(189, 46, 246, .34);
    font-size: 1rem;
}

body.is-play-root .dxf-play-side-cards {
    display: grid;
    grid-template-rows: repeat(3, minmax(0, 1fr));
    gap: 13px;
}

body.is-play-root .dxf-play-small-card {
    min-height: 134px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 42px;
    align-items: center;
    gap: 8px;
    padding: 18px 14px 18px 20px;
    border-radius: 20px;
}

body.is-play-root .dxf-play-small-card::after {
    background: linear-gradient(90deg, rgba(4, 13, 40, .92) 0%, rgba(4, 13, 40, .7) 52%, rgba(4, 13, 40, .12) 100%);
}

body.is-play-root .dxf-play-small-card > div {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px 10px;
    align-items: center;
}

body.is-play-root .dxf-play-small-card h3 {
    grid-column: 1 / -1;
    margin: 0;
    color: #fff;
    font-size: clamp(1rem, 2vw, 1.28rem);
    line-height: 1.02;
}

body.is-play-root .dxf-play-small-card h3 i {
    width: 26px;
    margin-right: 6px;
    color: #f6f8ff;
    filter: drop-shadow(0 0 8px rgba(99, 86, 255, .58));
}

body.is-play-root .dxf-play-small-card p {
    grid-column: 1 / -1;
    margin: 0;
    color: #dce5ff;
    font-size: .76rem;
    line-height: 1.2;
}

body.is-play-root .dxf-play-small-card div > span {
    width: 100%;
    height: 11px;
}

body.is-play-root .dxf-play-small-card div > b {
    font-size: .73rem;
}

body.is-play-root .dxf-play-small-card > i:last-child {
    width: 36px;
    height: 42px;
    display: grid;
    place-items: center;
    justify-self: end;
    border: 1px solid rgba(98, 111, 207, .42);
    border-radius: 12px;
    background: rgba(10, 16, 52, .65);
    color: #fff;
    font-size: 1.08rem;
}

body.is-play-root .dxf-play-today-panel {
    min-height: 320px;
    display: grid;
    align-content: start;
    gap: 18px;
    padding: 20px;
    border-radius: 24px;
}

body.is-play-root .dxf-play-today-panel::after {
    background: linear-gradient(135deg, rgba(5, 19, 52, .91), rgba(5, 15, 42, .87));
}

body.is-play-root .dxf-play-today-panel > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

body.is-play-root .dxf-play-today-panel > header > div {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 14px;
}

body.is-play-root .dxf-play-today-panel > header > div > i {
    width: 48px;
    height: 48px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: radial-gradient(circle, #7346ff, #2b1b85 70%);
    box-shadow: 0 0 20px rgba(112, 74, 255, .38);
    font-size: 1.35rem;
}

body.is-play-root .dxf-play-today-panel h2,
body.is-play-root .dxf-play-today-panel p {
    margin: 0;
}

body.is-play-root .dxf-play-today-panel h2 {
    color: #fff;
    font-size: 1.4rem;
}

body.is-play-root .dxf-play-today-panel p {
    margin-top: 4px;
    color: #cbd8f6;
    font-size: .8rem;
}

body.is-play-root .dxf-play-today-panel > header > b {
    flex: 0 0 auto;
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 0 11px;
    border: 1px solid rgba(112, 132, 216, .45);
    border-radius: 10px;
    color: #dfe7ff;
    background: rgba(9, 16, 48, .82);
    font-size: .68rem;
}

body.is-play-root .dxf-play-daily-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

body.is-play-root .dxf-play-daily-task {
    min-width: 0;
    min-height: 168px;
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    align-content: center;
    gap: 10px 9px;
    padding: 15px;
    border: 1px solid rgba(69, 146, 247, .46);
    border-radius: 16px;
    background: linear-gradient(145deg, rgba(8, 29, 63, .82), rgba(7, 17, 45, .91));
    box-shadow: inset 0 0 18px rgba(46, 139, 255, .07);
}

body.is-play-root .dxf-play-task-state {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border: 2px solid rgba(105, 131, 207, .7);
    border-radius: 50%;
    color: transparent;
    background: rgba(10, 25, 62, .9);
}

body.is-play-root .dxf-play-daily-task.is-complete .dxf-play-task-state {
    border-color: #30e8a0;
    color: #fff;
    background: linear-gradient(145deg, #31dea0, #12ba82);
    box-shadow: 0 0 12px rgba(48, 232, 160, .34);
}

body.is-play-root .dxf-play-daily-task > b {
    min-width: 0;
    align-self: center;
    color: #fff;
    font-size: .8rem;
    line-height: 1.2;
}

body.is-play-root .dxf-play-task-progress {
    grid-column: 1 / -1;
    height: 15px;
}

body.is-play-root .dxf-play-daily-task > small {
    grid-column: 1 / -1;
    margin-top: -23px;
    padding-right: 7px;
    color: #fff;
    font-size: .64rem;
    font-weight: 900;
    line-height: 15px;
    text-align: right;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .7);
    pointer-events: none;
}

body.is-play-root .dxf-play-daily-task > form,
body.is-play-root .dxf-play-task-claimed,
body.is-play-root .dxf-play-task-reward {
    grid-column: 1 / -1;
    margin: 0;
}

body.is-play-root .dxf-play-daily-task > form button,
body.is-play-root .dxf-play-task-claimed,
body.is-play-root .dxf-play-task-reward {
    width: 100%;
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 11px;
    font-size: .77rem;
    font-weight: 1000;
}

body.is-play-root .dxf-play-daily-task > form button,
body.is-play-root .dxf-play-task-claimed {
    border: 1px solid rgba(80, 255, 176, .72);
    color: #031d15;
    background: linear-gradient(180deg, #5affb1, #29dd91);
    box-shadow: 0 0 16px rgba(45, 225, 147, .18);
}

body.is-play-root .dxf-play-task-reward {
    border: 1px solid rgba(73, 140, 239, .4);
    color: #5fe5ff;
    background: linear-gradient(145deg, rgba(10, 31, 72, .9), rgba(12, 23, 56, .94));
    font-size: 1rem;
}

body.is-play-root .dxf-play-task-reward i,
body.is-play-root .dxf-play-daily-task > form button i {
    color: #4adfff;
}

body.is-play-root .dxf-play-today-panel > footer {
    color: #94aedc;
    font-size: .68rem;
    font-weight: 800;
    text-align: right;
}

body.is-play-root .dxf-play-topbar {
    box-sizing: border-box;
}

body.is-play-root .dxf-play-top-resources {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

body.is-play-root .dxf-play-resource {
    min-width: 132px;
    height: 42px;
    display: grid;
    grid-template-columns: 25px minmax(0, 1fr) 30px;
    align-items: center;
    gap: 6px;
    padding: 0 5px 0 9px;
    border: 1px solid rgba(98, 81, 255, .78);
    border-radius: 999px;
    background: rgba(6, 15, 45, .92);
    box-shadow: inset 0 0 15px rgba(64, 36, 160, .14);
}

body.is-play-root .dxf-play-resource.is-diamonds {
    border-color: rgba(45, 189, 255, .72);
}

body.is-play-root .dxf-play-resource img {
    width: 23px;
    height: 23px;
    object-fit: contain;
}

body.is-play-root .dxf-play-resource b {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #fff;
    font-size: .82rem;
}

body.is-play-root .dxf-play-resource > a {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(132, 87, 255, .88);
    border-radius: 9px;
    color: #fff;
    background: linear-gradient(145deg, #6a1fc6, #4211a2);
    font-size: 1.05rem;
    line-height: 1;
    text-decoration: none;
}

body.is-play-root .dxf-play-resource.is-diamonds > a {
    border-color: rgba(24, 210, 255, .82);
    background: linear-gradient(145deg, #0079b8, #126dc0);
}

body.is-play-root .dxf-play-player {
    position: relative;
    width: 50px;
    height: 50px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 2px solid #c345ff;
    border-radius: 50%;
    color: #fff;
    background: #151242;
    box-shadow: 0 0 15px rgba(208, 52, 255, .34);
    text-decoration: none;
}

body.is-play-root .dxf-play-player::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 1px;
    width: 10px;
    height: 10px;
    border: 2px solid #071028;
    border-radius: 50%;
    background: #22df8b;
}

body.is-play-root .dxf-play-player .dxf-play-player-media,
body.is-play-root .dxf-play-player .dxf-play-player-media img,
body.is-play-root .dxf-play-player img,
body.is-play-root .dxf-play-player video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.is-play-root .dxf-play-notifications {
    position: relative;
    width: 42px;
    height: 50px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    color: #f0f4ff;
    font-size: 1.5rem;
    text-decoration: none;
}

body.is-play-root .dxf-play-notifications > span {
    position: absolute;
    top: 1px;
    right: -1px;
    min-width: 18px;
    height: 18px;
    display: grid;
    place-items: center;
    padding: 0 4px;
    border: 2px solid #071028;
    border-radius: 999px;
    color: #fff;
    background: #ff375f;
    font-size: .53rem;
    font-weight: 1000;
    line-height: 1;
}

@media (min-width: 761px) {
    body.is-play-root .dxf-play-topbar .dxf-play-brand img {
        width: 210px !important;
        max-height: 58px !important;
    }
}

@media (max-width: 760px) {
    body.is-play-root {
        padding-bottom: calc(76px + env(safe-area-inset-bottom)) !important;
    }

    body.is-play-root .side-nav {
        display: none !important;
    }

    body.is-play-root .game-header.dxf-play-topbar {
        left: 0 !important;
        right: 0 !important;
        width: 100vw !important;
        max-width: none !important;
        height: 82px !important;
        min-height: 82px !important;
        display: grid !important;
        grid-template-columns: minmax(116px, 1fr) auto !important;
        align-items: center !important;
        gap: 4px !important;
        padding: 5px max(7px, env(safe-area-inset-right)) 5px max(9px, env(safe-area-inset-left)) !important;
        transform: none !important;
        border-radius: 0 !important;
    }

    body.is-play-root .dxf-play-brand {
        min-width: 0;
        height: 70px;
        display: flex;
        align-items: center;
    }

    body.is-play-root .dxf-play-brand img {
        width: clamp(118px, 32vw, 145px) !important;
        max-width: 100% !important;
        max-height: 64px !important;
        object-fit: contain !important;
        object-position: left center !important;
    }

    body.is-play-root .dxf-play-top-resources {
        gap: 4px;
    }

    body.is-play-root .dxf-play-resource {
        min-width: 0;
        width: clamp(73px, 21vw, 92px);
        height: 34px;
        grid-template-columns: 18px minmax(0, 1fr) 22px;
        gap: 3px;
        padding: 0 3px 0 5px;
    }

    body.is-play-root .dxf-play-resource img {
        width: 18px;
        height: 18px;
    }

    body.is-play-root .dxf-play-resource b {
        font-size: clamp(.53rem, 2vw, .66rem);
    }

    body.is-play-root .dxf-play-resource > a {
        width: 21px;
        height: 21px;
        border-radius: 7px;
        font-size: .78rem;
    }

    body.is-play-root .dxf-play-player {
        width: 39px;
        height: 39px;
        border-width: 1.5px;
    }

    body.is-play-root .dxf-play-player::after {
        width: 8px;
        height: 8px;
        border-width: 1.5px;
    }

    body.is-play-root .dxf-play-notifications {
        width: 29px;
        height: 39px;
        font-size: 1.22rem;
    }

    body.is-play-root .dxf-play-notifications > span {
        top: -2px;
        right: -3px;
        min-width: 15px;
        height: 15px;
        padding: 0 3px;
        border-width: 1.5px;
        font-size: .45rem;
    }

    body.is-play-root .app-main {
        width: 100% !important;
        max-width: none !important;
        padding: 94px 11px calc(82px + env(safe-area-inset-bottom)) !important;
    }

    body.is-play-root .dxf-play-screen {
        width: 100%;
        max-width: none;
        gap: 11px;
        padding-bottom: 3px;
    }

    body.is-play-root .dxf-play-intro {
        align-items: center;
        gap: 8px;
        padding: 0 5px 2px;
    }

    body.is-play-root .dxf-play-intro h1 {
        font-size: clamp(2rem, 9.8vw, 2.55rem);
    }

    body.is-play-root .dxf-play-intro p {
        margin-top: 6px;
        font-size: clamp(.63rem, 2.75vw, .77rem);
    }

    body.is-play-root .dxf-play-intro > span {
        max-width: 38%;
        padding-right: 5px;
        font-size: clamp(.72rem, 3.4vw, .94rem);
    }

    body.is-play-root .dxf-play-race-card {
        min-height: 270px;
        border-radius: 15px;
    }

    body.is-play-root .dxf-play-race-season {
        top: 8px;
        right: 8px;
        gap: 5px;
        min-height: 34px;
        padding: 5px 7px;
        border-radius: 8px;
    }

    body.is-play-root .dxf-play-race-season > i {
        font-size: .77rem;
    }

    body.is-play-root .dxf-play-race-season b {
        font-size: .52rem;
    }

    body.is-play-root .dxf-play-race-season small {
        font-size: .42rem;
    }

    body.is-play-root .dxf-play-race-copy {
        min-height: 270px;
        gap: 6px;
        padding: 42px 14px 67px;
    }

    body.is-play-root .dxf-play-race-logo {
        gap: 6px;
    }

    body.is-play-root .dxf-play-race-logo > i {
        font-size: 1.25rem;
    }

    body.is-play-root .dxf-play-race-logo > b {
        font-size: clamp(1.45rem, 7.5vw, 2rem);
    }

    body.is-play-root .dxf-play-race-copy > p {
        max-width: 55%;
        font-size: .61rem;
        line-height: 1.12;
    }

    body.is-play-root .dxf-play-race-start {
        align-self: center;
        width: min(260px, 72%);
        min-height: 40px;
        gap: 9px;
        padding: 0 14px;
        border-width: 1.5px;
        font-size: .86rem;
    }

    body.is-play-root .dxf-play-week-progress {
        min-height: 58px;
        grid-template-columns: 30px minmax(0, 1fr) auto 40px;
        gap: 2px 7px;
        padding: 7px 9px;
    }

    body.is-play-root .dxf-play-week-flag {
        width: 28px;
        height: 28px;
        font-size: 1.05rem;
    }

    body.is-play-root .dxf-play-week-main {
        gap: 4px;
    }

    body.is-play-root .dxf-play-week-main > small {
        font-size: .52rem;
    }

    body.is-play-root .dxf-play-week-track {
        height: 9px;
    }

    body.is-play-root .dxf-play-week-progress > strong {
        font-size: .93rem;
    }

    body.is-play-root .dxf-play-week-progress > em {
        max-width: 96px;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: .39rem;
    }

    body.is-play-root .dxf-play-week-chest {
        width: 38px;
        height: 34px;
        border-radius: 8px;
        font-size: 1.52rem;
    }

    body.is-play-root .dxf-play-week-claim button {
        min-height: 30px;
        padding: 0 7px;
        border-radius: 8px;
        font-size: .46rem;
    }

    body.is-play-root .dxf-play-modes-grid {
        grid-template-columns: minmax(0, .93fr) minmax(0, 1.07fr);
        gap: 8px;
    }

    body.is-play-root .dxf-play-arena-card {
        min-height: 220px;
        border-radius: 15px;
    }

    body.is-play-root .dxf-play-card-copy {
        min-height: 220px;
        gap: 4px;
        padding: 12px 10px;
    }

    body.is-play-root .dxf-play-card-copy h2 {
        gap: 5px;
        font-size: clamp(1rem, 4.4vw, 1.24rem);
    }

    body.is-play-root .dxf-play-card-copy > p {
        margin-bottom: 1px;
        font-size: .54rem;
    }

    body.is-play-root .dxf-play-card-copy > span {
        min-height: 23px;
        gap: 4px;
        padding: 0 6px;
        border-radius: 7px;
        font-size: .48rem;
    }

    body.is-play-root .dxf-play-card-copy > strong {
        min-height: 36px;
        gap: 7px;
        margin-top: 2px;
        border-radius: 10px;
        font-size: .65rem;
    }

    body.is-play-root .dxf-play-side-cards {
        gap: 7px;
    }

    body.is-play-root .dxf-play-small-card {
        min-height: 68px;
        grid-template-columns: minmax(0, 1fr) 25px;
        gap: 3px;
        padding: 7px 6px 7px 9px;
        border-radius: 12px;
    }

    body.is-play-root .dxf-play-small-card > div {
        gap: 3px 5px;
    }

    body.is-play-root .dxf-play-small-card h3 {
        font-size: clamp(.65rem, 3vw, .77rem);
        line-height: 1;
    }

    body.is-play-root .dxf-play-small-card h3 i {
        width: 15px;
        margin-right: 3px;
        font-size: .72rem;
    }

    body.is-play-root .dxf-play-small-card p {
        font-size: .45rem;
    }

    body.is-play-root .dxf-play-small-card div > span {
        height: 6px;
    }

    body.is-play-root .dxf-play-small-card div > b {
        font-size: .44rem;
    }

    body.is-play-root .dxf-play-small-card > i:last-child {
        width: 22px;
        height: 27px;
        border-radius: 8px;
        font-size: .65rem;
    }

    body.is-play-root .dxf-play-today-panel {
        min-height: 188px;
        gap: 10px;
        padding: 11px;
        border-radius: 15px;
    }

    body.is-play-root .dxf-play-today-panel > header {
        gap: 8px;
    }

    body.is-play-root .dxf-play-today-panel > header > div {
        gap: 7px;
    }

    body.is-play-root .dxf-play-today-panel > header > div > i {
        width: 30px;
        height: 30px;
        font-size: .84rem;
    }

    body.is-play-root .dxf-play-today-panel h2 {
        font-size: .95rem;
    }

    body.is-play-root .dxf-play-today-panel p {
        margin-top: 2px;
        font-size: .49rem;
    }

    body.is-play-root .dxf-play-today-panel > header > b {
        min-height: 25px;
        gap: 4px;
        padding: 0 6px;
        border-radius: 7px;
        font-size: .43rem;
    }

    body.is-play-root .dxf-play-daily-grid {
        gap: 7px;
    }

    body.is-play-root .dxf-play-daily-task {
        min-height: 98px;
        grid-template-columns: 20px minmax(0, 1fr);
        gap: 6px 5px;
        padding: 8px 7px;
        border-radius: 10px;
    }

    body.is-play-root .dxf-play-task-state {
        width: 20px;
        height: 20px;
        border-width: 1.5px;
        font-size: .55rem;
    }

    body.is-play-root .dxf-play-daily-task > b {
        font-size: clamp(.46rem, 2.15vw, .57rem);
    }

    body.is-play-root .dxf-play-task-progress {
        height: 10px;
    }

    body.is-play-root .dxf-play-daily-task > small {
        margin-top: -16px;
        padding-right: 4px;
        font-size: .42rem;
        line-height: 10px;
    }

    body.is-play-root .dxf-play-daily-task > form button,
    body.is-play-root .dxf-play-task-claimed,
    body.is-play-root .dxf-play-task-reward {
        min-height: 29px;
        gap: 4px;
        border-radius: 7px;
        font-size: .5rem;
    }

    body.is-play-root .dxf-play-task-reward {
        font-size: .72rem;
    }

    body.is-play-root .dxf-play-today-panel > footer {
        font-size: .43rem;
    }

    body.is-play-root .bottom-nav.dxf-global-bottom-nav {
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100vw !important;
        max-width: none !important;
        height: calc(76px + env(safe-area-inset-bottom)) !important;
        min-height: calc(76px + env(safe-area-inset-bottom)) !important;
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        align-items: stretch !important;
        gap: 0 !important;
        padding: 4px 5px env(safe-area-inset-bottom) !important;
        transform: none !important;
        border-radius: 18px 18px 0 0 !important;
        box-sizing: border-box !important;
        background: rgba(3, 12, 35, .985) !important;
        border-top: 1px solid rgba(83, 99, 202, .42) !important;
        box-shadow: 0 -7px 24px rgba(0, 0, 0, .44) !important;
    }

    body.is-play-root .bottom-nav .bottom-link {
        position: relative !important;
        min-width: 0 !important;
        min-height: 68px !important;
        height: 68px !important;
        display: grid !important;
        grid-template-rows: 33px 18px !important;
        place-items: center !important;
        align-content: center !important;
        gap: 1px !important;
        padding: 0 !important;
        transform: none !important;
        background: transparent !important;
        color: #bdc9f8 !important;
        font-size: .6rem !important;
        font-weight: 800 !important;
        text-decoration: none !important;
        box-sizing: border-box !important;
    }

    body.is-play-root .bottom-nav .bottom-link::before {
        content: "";
        position: absolute;
        top: -4px;
        left: 27%;
        right: 27%;
        height: 3px;
        border-radius: 999px;
        background: transparent;
    }

    body.is-play-root .bottom-nav .bottom-link.active::before {
        background: #f13ef2;
        box-shadow: 0 0 10px rgba(241, 62, 242, .7);
    }

    body.is-play-root .bottom-nav .bottom-link > .nav-label,
    body.is-play-root .bottom-nav .bottom-link > span:not(.nav-ico) {
        display: block !important;
        width: 100% !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        text-align: center !important;
        line-height: 18px !important;
        color: inherit !important;
    }

    body.is-play-root .bottom-nav .bottom-link.active > .nav-label {
        color: #ff56ef !important;
        text-shadow: 0 0 8px rgba(238, 56, 242, .55) !important;
    }

    body.is-play-root .bottom-nav .bottom-link .nav-ico,
    body.is-play-root .dxf-global-bottom-nav .bottom-link .nav-ico {
        width: 30px !important;
        height: 30px !important;
        min-width: 30px !important;
        min-height: 30px !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        transform: none !important;
    }

    body.is-play-root .bottom-nav .bottom-link .nav-ico img,
    body.is-play-root .dxf-global-bottom-nav .bottom-link .nav-ico img {
        width: 30px !important;
        height: 30px !important;
        max-width: 30px !important;
        max-height: 30px !important;
        object-fit: contain !important;
        opacity: .86 !important;
        transform: none !important;
        filter: none !important;
    }

    body.is-play-root .bottom-nav .bottom-link.active .nav-ico img {
        opacity: 1 !important;
        transform: none !important;
        filter: drop-shadow(0 0 6px rgba(238, 56, 242, .62)) !important;
    }
}

@media (max-width: 390px) {
    body.is-play-root .game-header.dxf-play-topbar {
        grid-template-columns: minmax(100px, 1fr) auto !important;
    }

    body.is-play-root .dxf-play-brand img {
        width: clamp(101px, 29vw, 116px) !important;
    }

    body.is-play-root .dxf-play-resource {
        width: clamp(67px, 20vw, 78px);
        grid-template-columns: 16px minmax(0, 1fr) 19px;
    }

    body.is-play-root .dxf-play-resource img {
        width: 16px;
        height: 16px;
    }

    body.is-play-root .dxf-play-resource > a {
        width: 19px;
        height: 19px;
    }

    body.is-play-root .dxf-play-player {
        width: 35px;
        height: 35px;
    }

    body.is-play-root .dxf-play-notifications {
        width: 25px;
    }

    body.is-play-root .dxf-play-intro > span {
        display: none;
    }

    body.is-play-root .dxf-play-modes-grid {
        grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
        gap: 6px;
    }

    body.is-play-root .dxf-play-card-copy {
        padding-right: 7px;
        padding-left: 7px;
    }

    body.is-play-root .dxf-play-card-copy > span {
        padding-right: 5px;
        padding-left: 5px;
        font-size: .43rem;
    }

    body.is-play-root .dxf-play-small-card {
        padding-left: 7px;
    }

    body.is-play-root .dxf-play-small-card h3 {
        font-size: .62rem;
    }

    body.is-play-root .dxf-play-daily-task {
        padding-right: 5px;
        padding-left: 5px;
    }
}

/* ========================================================================
   2026-09 final reference pass: one header + one 5-item bottom navigation
   across the complete app. Page selectors below only style their own views.
   ======================================================================== */

@media (max-width: 760px) {
    body.is-auth {
        padding-bottom: calc(78px + env(safe-area-inset-bottom)) !important;
    }

    body.is-auth .game-header.dxf-global-topbar,
    body.is-auth.page-home .game-header.dxf-global-topbar {
        left: 0 !important;
        right: 0 !important;
        width: 100vw !important;
        max-width: none !important;
        height: 80px !important;
        min-height: 80px !important;
        grid-template-columns: 148px minmax(0, 1fr) !important;
        gap: 6px !important;
        padding: 7px 9px !important;
        transform: none !important;
        border-radius: 0 !important;
        background: linear-gradient(180deg, rgba(2, 10, 31, .995), rgba(3, 12, 36, .985)) !important;
        border-bottom: 1px solid rgba(76, 132, 255, .22) !important;
        box-shadow: 0 6px 22px rgba(0, 0, 0, .26) !important;
        z-index: 90 !important;
    }

    body.is-auth .dxf-global-topbar .mobile-brand,
    body.is-auth .dxf-global-topbar .mobile-brand img {
        width: 148px !important;
        max-width: 148px !important;
        height: 60px !important;
        max-height: 60px !important;
        object-fit: contain !important;
        object-position: left center !important;
    }

    body.is-auth .dxf-global-topbar .resource-strip {
        height: 64px !important;
        min-width: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 3px !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    body.is-auth .dxf-global-topbar .resource-group {
        order: 1 !important;
        min-width: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 3px !important;
    }

    body.is-auth .dxf-global-topbar .player-chip {
        order: 2 !important;
        min-width: 36px !important;
        width: 36px !important;
        display: grid !important;
        justify-items: center !important;
        gap: 0 !important;
        padding: 0 !important;
    }

    body.is-auth .dxf-global-topbar .player-avatar {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        border-width: 1px !important;
    }

    body.is-auth .dxf-global-topbar .player-level-meta {
        margin-top: -1px !important;
    }

    body.is-auth .dxf-global-topbar .player-level-meta b {
        font-size: .47rem !important;
        line-height: 1 !important;
    }

    body.is-auth .dxf-global-topbar .player-level-meta small,
    body.is-auth .dxf-global-topbar .resource-pill.push-settings,
    body.is-auth .dxf-global-topbar .plus-btn {
        display: none !important;
    }

    body.is-auth .dxf-global-topbar .resource-pill {
        height: 31px !important;
        min-height: 31px !important;
        min-width: 0 !important;
        padding: 0 5px !important;
        border-radius: 10px !important;
    }

    body.is-auth .dxf-global-topbar .resource-pill img {
        width: 16px !important;
        height: 16px !important;
    }

    body.is-auth .dxf-global-topbar .resource-pill b {
        font-size: .55rem !important;
    }

    body.is-auth .dxf-global-topbar .resource-pill.messages {
        order: 0 !important;
        width: 31px !important;
        min-width: 31px !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    body.is-auth .dxf-global-topbar .resource-pill.messages b {
        position: absolute !important;
        min-width: 13px !important;
        height: 13px !important;
        display: grid !important;
        place-items: center !important;
        transform: translate(10px, -10px) !important;
        border-radius: 50% !important;
        background: #ff315f !important;
        font-size: .4rem !important;
    }

    body.is-auth .app-main,
    body.is-auth.page-home .app-main {
        padding-top: 86px !important;
        padding-right: 8px !important;
        padding-bottom: 86px !important;
        padding-left: 8px !important;
    }

    body.is-auth .bottom-nav.dxf-global-bottom-nav,
    body.is-auth.page-home .bottom-nav.dxf-global-bottom-nav,
    body.is-auth.is-collect-root .bottom-nav.dxf-global-bottom-nav,
    body.is-auth.is-play-root .bottom-nav.dxf-global-bottom-nav {
        position: fixed !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100vw !important;
        max-width: none !important;
        height: calc(78px + env(safe-area-inset-bottom)) !important;
        min-height: calc(78px + env(safe-area-inset-bottom)) !important;
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        align-items: stretch !important;
        gap: 0 !important;
        padding: 3px 5px env(safe-area-inset-bottom) !important;
        transform: none !important;
        border-radius: 20px 20px 0 0 !important;
        background: rgba(3, 12, 35, .99) !important;
        border: 1px solid rgba(75, 132, 255, .28) !important;
        border-bottom: 0 !important;
        box-shadow: 0 -9px 28px rgba(0, 0, 0, .42) !important;
        z-index: 100 !important;
        box-sizing: border-box !important;
    }

    body.is-auth .dxf-global-bottom-nav .bottom-link,
    body.is-auth.is-collect-root .dxf-global-bottom-nav .bottom-link,
    body.is-auth.is-play-root .dxf-global-bottom-nav .bottom-link {
        position: relative !important;
        min-width: 0 !important;
        min-height: 72px !important;
        height: 72px !important;
        display: grid !important;
        grid-template-rows: 38px 18px !important;
        place-items: center !important;
        align-content: center !important;
        gap: 0 !important;
        padding: 2px 1px !important;
        transform: none !important;
        background: transparent !important;
        color: #becaf4 !important;
        font-size: .54rem !important;
        font-weight: 850 !important;
        text-decoration: none !important;
        box-sizing: border-box !important;
    }

    body.is-auth .dxf-global-bottom-nav .bottom-link::before {
        content: "" !important;
        position: absolute !important;
        top: -3px !important;
        left: 29% !important;
        right: 29% !important;
        height: 3px !important;
        border-radius: 99px !important;
        background: transparent !important;
    }

    body.is-auth .dxf-global-bottom-nav .bottom-link.active::before {
        background: #f442ea !important;
        box-shadow: 0 0 9px rgba(244, 66, 234, .66) !important;
    }

    body.is-auth .dxf-global-bottom-nav .bottom-link > .nav-label,
    body.is-auth .dxf-global-bottom-nav .bottom-link > span:not(.nav-ico) {
        display: block !important;
        width: 100% !important;
        overflow: hidden !important;
        color: inherit !important;
        line-height: 18px !important;
        text-align: center !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    body.is-auth .dxf-global-bottom-nav .bottom-link .nav-ico,
    body.is-auth.is-collect-root .dxf-global-bottom-nav .bottom-link .nav-ico,
    body.is-auth.is-play-root .dxf-global-bottom-nav .bottom-link .nav-ico {
        width: 32px !important;
        height: 32px !important;
        min-width: 32px !important;
        min-height: 32px !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        transform: none !important;
    }

    body.is-auth .dxf-global-bottom-nav .bottom-link .nav-ico img,
    body.is-auth.is-collect-root .dxf-global-bottom-nav .bottom-link .nav-ico img,
    body.is-auth.is-play-root .dxf-global-bottom-nav .bottom-link .nav-ico img {
        width: 32px !important;
        height: 32px !important;
        max-width: 32px !important;
        max-height: 32px !important;
        object-fit: contain !important;
        opacity: .9 !important;
        transform: none !important;
        filter: none !important;
    }

    body.is-auth .dxf-global-bottom-nav .bottom-link.active {
        color: #ff63e8 !important;
    }

    body.is-auth .dxf-global-bottom-nav .bottom-link.active .nav-ico img {
        opacity: 1 !important;
        filter: drop-shadow(0 0 6px rgba(244, 66, 234, .5)) !important;
    }

    .global-back-bar {
        min-height: 34px !important;
        margin: -2px 0 7px !important;
        padding: 0 3px !important;
        background: transparent !important;
        border: 0 !important;
    }

    .global-back-bar button {
        min-height: 34px !important;
        padding: 0 5px !important;
        color: #d7e3ff !important;
        background: transparent !important;
        border: 0 !important;
        font-size: .75rem !important;
    }
}

@media (max-width: 385px) {
    body.is-auth .game-header.dxf-global-topbar,
    body.is-auth.page-home .game-header.dxf-global-topbar {
        grid-template-columns: 132px minmax(0, 1fr) !important;
        padding-right: 6px !important;
        padding-left: 7px !important;
    }
    body.is-auth .dxf-global-topbar .mobile-brand,
    body.is-auth .dxf-global-topbar .mobile-brand img {
        width: 132px !important;
        max-width: 132px !important;
    }
    body.is-auth .dxf-global-topbar .resource-pill { padding: 0 4px !important; }
    body.is-auth .dxf-global-bottom-nav .bottom-link { font-size: .5rem !important; }
}

/* Full-bleed editable graphics are always background layers. */
.dxf-existing-page-hero,
.dxf-avatar-shop-hero,
.dxf-avatar-detail-progress,
.dxf-progress-daily,
.dxf-progress-week,
.dxf-progress-goal,
.dxf-event-main-hero,
.dxf-event-progress,
.dxf-event-tasks,
.dxf-event-collection,
.dxf-event-community,
.dxf-event-shop,
.dxf-news-feature-card,
.dxf-kartrace-progress,
.arena-daily-goals,
.ranking-panel,
.message-card,
.win-card {
    isolation: isolate;
}

.dxf-existing-page-hero > .dxf-design-media,
.dxf-avatar-shop-hero > .dxf-panel-bg,
.dxf-avatar-detail-progress > .dxf-panel-bg,
.dxf-progress-daily > .dxf-panel-bg,
.dxf-progress-week > .dxf-panel-bg,
.dxf-progress-goal > .dxf-panel-bg,
.dxf-event-main-hero > .dxf-panel-bg,
.dxf-event-progress > .dxf-panel-bg,
.dxf-event-tasks > .dxf-panel-bg,
.dxf-event-collection > .dxf-panel-bg,
.dxf-event-community > .dxf-panel-bg,
.dxf-event-shop > .dxf-panel-bg,
.dxf-news-feature-card > .dxf-panel-bg,
.dxf-kartrace-progress > .dxf-panel-bg,
.arena-daily-goals > .dxf-panel-bg,
.ranking-panel > .dxf-panel-bg,
.win-card > .dxf-panel-bg {
    position: absolute !important;
    inset: 0 !important;
    z-index: -2 !important;
    width: 100% !important;
    height: 100% !important;
    border-radius: inherit !important;
    overflow: hidden !important;
    pointer-events: none !important;
}

.dxf-existing-page-hero > .dxf-design-media img,
.dxf-avatar-shop-hero > .dxf-panel-bg img,
.dxf-avatar-detail-progress > .dxf-panel-bg img,
.dxf-progress-daily > .dxf-panel-bg img,
.dxf-progress-week > .dxf-panel-bg img,
.dxf-progress-goal > .dxf-panel-bg img,
.dxf-event-main-hero > .dxf-panel-bg img,
.dxf-event-progress > .dxf-panel-bg img,
.dxf-event-tasks > .dxf-panel-bg img,
.dxf-event-collection > .dxf-panel-bg img,
.dxf-event-community > .dxf-panel-bg img,
.dxf-event-shop > .dxf-panel-bg img,
.dxf-news-feature-card > .dxf-panel-bg img,
.dxf-kartrace-progress > .dxf-panel-bg img,
.arena-daily-goals > .dxf-panel-bg img,
.ranking-panel > .dxf-panel-bg img,
.win-card > .dxf-panel-bg img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* WUNSCHLISTE */
.dxf-wishlist-page { display: grid; gap: 12px; }
.dxf-wishlist-page .dxf-existing-page-hero { min-height: 150px; }
.dxf-wishlist-goal { min-height: 340px; border-color: rgba(255, 63, 214, .52); box-shadow: 0 0 22px rgba(214, 42, 255, .14); }
.dxf-wishlist-goal .dxf-feature-content { max-width: 58%; gap: 7px; }
.dxf-wishlist-goal .dxf-feature-content h2 { font-size: clamp(1.4rem, 4vw, 2.4rem); }
.dxf-wishlist-goal .dxf-feature-content p { margin: 4px 0; font-size: 1.05rem; font-weight: 950; }
.dxf-wishlist-goal .dxf-feature-content p i { color: var(--dxf-cyan); }
.dxf-wishlist-page .dxf-avatar-teaser-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.dxf-wishlist-page .dxf-avatar-teaser-grid > a { overflow: hidden; border: 1px solid rgba(77, 155, 255, .58); border-radius: 17px; background: rgba(5, 19, 48, .96); }
.dxf-wishlist-page .dxf-avatar-teaser-grid > a > span { aspect-ratio: .82; overflow: hidden; }
.dxf-wishlist-page .dxf-avatar-teaser-grid img,
.dxf-wishlist-page .dxf-avatar-teaser-grid video { width: 100%; height: 100%; object-fit: cover; }

/* AVATAR SHOP */
.dxf-avatar-shop-category-shell { position: relative; isolation: isolate; overflow: hidden; border-radius: 17px; }
.dxf-avatar-shop-category-shell > .dxf-panel-bg { position: absolute; inset: 0; z-index: -1; }
.dxf-avatar-shop-category-shell > .dxf-panel-bg img { width: 100%; height: 100%; object-fit: cover; }
.dxf-avatar-shop-category-shell .dxf-chip-row { margin: 0; padding: 8px; }
.dxf-avatar-popular .avatar-grid,
.dxf-avatar-shop-page ~ .avatar-grid,
body.route-avatar .avatar-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
body.route-avatar .avatar-family-tile { overflow: hidden; border-radius: 18px; }
body.route-avatar .avatar-family-tile .avatar-preview { aspect-ratio: .92; min-height: 0; }
body.route-avatar .avatar-family-tile .avatar-preview img,
body.route-avatar .avatar-family-tile .avatar-preview video { width: 100%; height: 100%; object-fit: cover; }

/* AVATAR DETAIL */
.dxf-avatar-detail-progress { position: relative; min-height: 145px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 16px; margin: 0 0 12px; padding: 17px; overflow: hidden; border: 1px solid rgba(109, 139, 255, .34); border-radius: 20px; background: rgba(8, 20, 52, .94); }
.dxf-avatar-detail-progress > div:not(.dxf-panel-bg) { display: grid; gap: 7px; }
.dxf-avatar-detail-progress small { color: #9ebcff; font-size: .62rem; font-weight: 950; letter-spacing: .08em; }
.dxf-avatar-detail-progress strong { display: flex; align-items: center; gap: 8px; font-size: 1.45rem; }
.dxf-avatar-detail-progress strong img { width: 28px; height: 28px; object-fit: contain; }
.dxf-avatar-detail-progress p { margin: 0; color: var(--dxf-muted); font-size: .7rem; }
.dxf-avatar-detail-progress > a { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 0 15px; color: #fff; border: 1px solid rgba(255, 70, 220, .6); border-radius: 14px; background: linear-gradient(135deg, rgba(221, 35, 255, .78), rgba(109, 62, 255, .85)); font-size: .72rem; font-weight: 950; text-decoration: none; }
body.route-avatar-modelle .avatar-detail-head { position: relative; isolation: isolate; overflow: hidden; }
body.route-avatar-modelle .avatar-detail-head > .dxf-panel-bg { position: absolute; inset: 0; z-index: -1; }
body.route-avatar-modelle .avatar-detail-head > .dxf-panel-bg img { width: 100%; height: 100%; object-fit: cover; }
body.route-avatar-modelle .avatar-model-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }

/* FORTSCHRITT */
.dxf-progress-tabs { flex-wrap: nowrap; overflow-x: auto; }
.dxf-progress-daily-layout { display: grid; grid-template-columns: minmax(0, 1.8fr) minmax(170px, .72fr); gap: 12px; }
.dxf-progress-daily-layout .dxf-daily-task-grid { display: grid; gap: 8px; }
.dxf-progress-daily-layout .dxf-daily-task-grid article { grid-template-columns: 38px minmax(0,1fr) 34px; gap: 9px; }
.dxf-progress-daily-layout .dxf-daily-task-grid article > span { display: grid; gap: 4px; }
.dxf-progress-daily-layout .dxf-daily-task-grid article > span small { color: var(--dxf-muted); letter-spacing: 0; }
.dxf-progress-daily-layout .dxf-daily-task-grid article > span em { height: 6px; overflow: hidden; border-radius: 99px; background: #07122d; }
.dxf-progress-daily-layout .dxf-daily-task-grid article > span em u { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#735dff,#ff3dd4,#4de2ff); }
.dxf-progress-daily-layout > aside { min-width: 0; display: grid; align-content: center; justify-items: center; gap: 7px; padding: 9px; border: 1px solid rgba(255, 204, 75, .28); border-radius: 16px; background: rgba(20, 16, 49, .75); text-align: center; }
.dxf-progress-daily-layout > aside .dxf-progress-daily-reward { width: min(140px,100%); height: 105px; }
.dxf-progress-daily-layout > aside .dxf-progress-daily-reward img { width: 100%; height: 100%; object-fit: contain; }
.dxf-progress-daily-layout > aside > span { display: grid; gap: 5px; width: 100%; }
.dxf-progress-daily-layout > aside a { color: #ffd96b; font-size: .6rem; font-weight: 950; text-decoration: none; }
.dxf-progress-track > header { display: flex; align-items: end; justify-content: space-between; gap: 8px; }
.dxf-progress-track > header a { color: var(--dxf-cyan); font-size: .6rem; font-weight: 900; text-decoration: none; }
.dxf-progress-track > div { grid-template-columns: repeat(7, 1fr); }

/* EVENT / COLLECTION STEPS */
.dxf-event-main-hero .dxf-primary-action { margin-top: 10px; }
.dxf-event-track > header { display: flex; justify-content: space-between; align-items: end; gap: 8px; }
.dxf-event-track > header a { color: var(--dxf-cyan); font-size: .6rem; font-weight: 900; text-decoration: none; }
.dxf-event-track > div { grid-template-columns: repeat(4,1fr); }
.dxf-event-tasks article span em { height: 6px; overflow: hidden; border-radius: 99px; background: #07122d; }
.dxf-event-tasks article span em u { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#397dff,#45e5ff,#ff44d5); }

/* ARENA */
.dxf-arena-mode-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin: 0 0 12px; }
.dxf-arena-mode-grid > a { min-height: 112px; display: grid; align-content: center; justify-items: center; gap: 5px; padding: 12px; color: #eaf0ff; border: 1px solid rgba(73, 143, 255, .48); border-radius: 17px; background: linear-gradient(145deg, rgba(9,26,64,.96), rgba(12,22,52,.96)); text-align: center; text-decoration: none; }
.dxf-arena-mode-grid > a.is-active { border-color: #ef49e8; background: radial-gradient(circle at 50% 20%, rgba(230,61,255,.35), rgba(23,15,65,.97)); box-shadow: 0 0 18px rgba(224,49,255,.18); }
.dxf-arena-mode-grid i { color: #9fb6ff; font-size: 1.55rem; }
.dxf-arena-mode-grid .is-active i { color: #ff6bea; }
.dxf-arena-mode-grid b { font-size: .92rem; }
.dxf-arena-mode-grid small { color: var(--dxf-muted); font-size: .58rem; }
.arena-daily-goals { overflow: hidden; border: 1px solid rgba(92,145,255,.32); border-radius: 20px; }
.arena-home-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.arena-home-grid .dxf-reference-strip { min-height: 150px; margin: 0; }

/* FAMILYKARTRACE */
.dxf-kartrace-stats { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; margin: -2px 0 11px; }
.dxf-kartrace-stats article { min-width: 0; display: grid; gap: 3px; padding: 11px 8px; border: 1px solid rgba(83,150,255,.34); border-radius: 15px; background: rgba(7,20,50,.95); }
.dxf-kartrace-stats i { color: #f4b739; font-size: 1rem; }
.dxf-kartrace-stats small { color: var(--dxf-muted); font-size: .52rem; }
.dxf-kartrace-stats b { font-size: 1rem; }
.dxf-kartrace-progress { position: relative; min-height: 145px; display: grid; grid-template-columns: minmax(0,1fr) 130px; align-items: center; gap: 10px; margin: 0 0 12px; padding: 15px; overflow: hidden; border: 1px solid rgba(179,63,255,.4); border-radius: 19px; background: rgba(13,18,52,.95); }
.dxf-kartrace-progress > div:not(.dxf-panel-bg):not(.dxf-kartrace-progress-reward) { display: grid; gap: 6px; }
.dxf-kartrace-progress small { color: #ff64df; font-size: .6rem; font-weight: 950; letter-spacing: .08em; }
.dxf-kartrace-progress h2 { margin: 0; font-size: 1.05rem; }
.dxf-kartrace-progress p { margin: 0; color: var(--dxf-muted); font-size: .62rem; }
.dxf-kartrace-progress-reward { width: 125px; height: 115px; }
.dxf-kartrace-progress-reward img { width: 100%; height: 100%; object-fit: contain; }

/* KARTEN */
.prestige-album-app { display: grid; gap: 11px; }
.prestige-album-app .dxf-collection-detail-strip { min-height: 185px; }
.prestige-album-app .prestige-tabs,
.prestige-album-app .album-tabs { overflow-x: auto; }
.prestige-album-app .book-slot-grid,
.prestige-album-app .prestige-card-grid { gap: 9px; }

/* NEWS */
.dxf-news-page { display: grid; gap: 11px; }
.dxf-news-feature-card { position: relative; min-height: 310px; display: flex; align-items: flex-end; overflow: hidden; color: #fff; border: 1px solid rgba(66,171,255,.56); border-radius: 21px; background: #071a3f; text-decoration: none; }
.dxf-news-feature-card::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(2,13,37,.88),rgba(2,13,37,.26) 70%,rgba(2,13,37,.12)); }
.dxf-news-feature-image { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; object-fit: cover; }
.dxf-news-feature-card > div:last-child { width: min(68%,760px); display: grid; gap: 6px; padding: 22px; }
.dxf-news-feature-card small { color: var(--dxf-cyan); font-size: .62rem; font-weight: 950; letter-spacing: .08em; }
.dxf-news-feature-card h2 { margin: 0; font-size: clamp(1.55rem,4vw,2.8rem); }
.dxf-news-feature-card p { margin: 0; color: #d9e5ff; font-size: .76rem; }
.dxf-news-feature-card span { color: #fff; font-size: .7rem; font-weight: 950; }
.dxf-news-tabs { flex-wrap: nowrap; overflow-x: auto; }
.news-preview-grid { display: grid; gap: 10px; }
.news-preview-card { display: grid; grid-template-columns: minmax(180px,.8fr) minmax(0,1.2fr); min-height: 180px; overflow: hidden; border: 1px solid rgba(74,144,255,.34); border-radius: 17px; background: rgba(7,20,50,.96); }
.news-preview-image { min-height: 180px; }
.news-preview-image img { width: 100%; height: 100%; object-fit: cover; }
.news-preview-content { position: relative; z-index: 1; display: grid; align-content: center; gap: 5px; padding: 14px; }
.news-preview-content > small { color: var(--dxf-muted); font-size: .55rem; }
.news-preview-content h2 { margin: 0; font-size: 1.05rem; }
.news-preview-content p { margin: 0; color: var(--dxf-muted); font-size: .66rem; }
.news-read-more { color: var(--dxf-cyan); font-size: .62rem; font-weight: 950; text-decoration: none; }

/* POSTFACH */
body.route-postbox .dxf-context-strips { grid-template-columns: repeat(4,minmax(0,1fr)); }
body.route-postbox .postbox-title-row .section-bar { display: none; }
body.route-postbox .postbox-tabs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
body.route-postbox .postbox-tabs a { min-height: 48px; display: flex; align-items: center; justify-content: center; gap: 6px; border: 1px solid rgba(75,145,255,.36); border-radius: 14px; background: rgba(8,22,54,.94); }
body.route-postbox .postbox-tabs a.active { border-color: #f44de7; background: linear-gradient(145deg,rgba(216,42,255,.35),rgba(75,43,169,.5)); }
body.route-postbox .message-card { border-radius: 17px; border-color: rgba(75,145,255,.32); background: rgba(7,22,54,.94); }
body.route-postbox .message-card.unread { border-color: rgba(243,64,224,.62); box-shadow: 0 0 17px rgba(228,53,255,.12); }

/* FAMILY CHAT */
body.route-chat .dxf-chat-header-graphic {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 5;
    overflow: hidden;
    border: 1px solid rgba(92,145,255,.28);
    border-radius: 19px;
    background: rgba(7,18,48,.9);
}
body.route-chat .dxf-chat-header-graphic:empty { display: none; }
body.route-chat .dxf-chat-header-media,
body.route-chat .dxf-chat-header-media img { width: 100%; height: 100%; }
body.route-chat .dxf-chat-header-media img { display: block; object-fit: cover; }
body.route-chat .chat-shell { overflow: hidden; border: 1px solid rgba(92,145,255,.28); border-radius: 19px; background: rgba(7,18,48,.9); }
body.route-chat .chat-list { max-height: min(66vh,760px); padding: 10px; }
body.route-chat .chat-form { position: sticky; bottom: 0; z-index: 3; gap: 8px; padding: 10px; border-top: 1px solid rgba(86,145,255,.22); background: rgba(5,15,41,.98); }

/* GEWINNE */
body.route-wins .wins-grid,
body.route-gewinne .wins-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
body.route-wins .win-card,
body.route-gewinne .win-card { min-height: 220px; overflow: hidden; border: 1px solid rgba(74,153,255,.42); border-radius: 17px; }

/* RANGLISTEN */
.dxf-ranking-tabs { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; margin: 0 0 12px; }
.dxf-ranking-tabs a { min-height: 52px; display: grid; place-items: center; padding: 7px; color: #e5edff; border: 1px solid rgba(75,145,255,.4); border-radius: 14px; background: rgba(7,20,52,.96); font-size: .66rem; font-weight: 900; text-align: center; text-decoration: none; }
.dxf-ranking-tabs a.is-active { color:#fff; border-color:#f34ee8; background:linear-gradient(145deg,rgba(216,48,255,.5),rgba(67,52,174,.58)); }
.ranking-podium { align-items: end; }
.ranking-podium-card.place-1 { transform: translateY(-9px); }

/* SHOP */
body.route-shop .dxf-shop-feature-strip { min-height: 210px; }
body.route-shop .shop-shortcuts { grid-template-columns: repeat(2,minmax(0,1fr)); }
body.route-shop .shop-offer-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }

/* SHOWS & RADIO */
body.route-stream .dxf-shows-live-backdrop { position: relative; min-height: 270px; overflow: hidden; border: 1px solid rgba(78,146,255,.38); border-radius: 20px; }
body.route-stream .dxf-shows-live-backdrop img { width:100%; height:100%; min-height:270px; object-fit:cover; }
body.route-stream .stream-radio-banner { margin-top: -282px; min-height: 270px; border-radius: 20px; background: rgba(5,13,38,.2); }
body.route-stream .stream-show-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
body.route-stream #stream-upcoming + .dxf-schedule-backdrop { min-height: 120px; border-radius: 17px; overflow: hidden; }
body.route-stream #stream-upcoming + .dxf-schedule-backdrop img { width:100%; height:100%; object-fit:cover; }

/* PROFILE */
body.route-profile .profile-v2-hero,
body.route-profil .profile-v2-hero { min-height: 360px; overflow: hidden; border-radius: 21px; }
body.route-profile .profile-endgame-block,
body.route-profil .profile-endgame-block { position: relative; overflow: hidden; border-radius: 20px; }

@media (max-width: 760px) {
    .dxf-existing-page-hero { min-height: 124px; margin-bottom: 8px; border-radius: 16px; }
    .dxf-existing-page-hero-copy { min-height: 124px; width: 72%; padding: 13px; }
    .dxf-existing-page-hero-copy small { font-size: .48rem; }
    .dxf-existing-page-hero-copy h1 { font-size: 1.42rem; }
    .dxf-existing-page-hero-copy p { font-size: .58rem; line-height: 1.25; }

    .dxf-wishlist-goal { min-height: 285px; }
    .dxf-wishlist-goal .dxf-feature-content { max-width: 61%; padding: 14px; }
    .dxf-wishlist-goal .dxf-feature-content h2 { font-size: 1.2rem; }
    .dxf-wishlist-goal .dxf-feature-content p { font-size: .85rem; }
    .dxf-wishlist-avatar { width: 46%; }
    .dxf-wishlist-page .dxf-avatar-teaser-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; }
    .dxf-wishlist-page .dxf-avatar-teaser-grid > a { border-radius: 12px; }
    .dxf-wishlist-page .dxf-avatar-teaser-grid > a > b { padding: 5px 5px 0; font-size: .58rem; }
    .dxf-wishlist-page .dxf-avatar-teaser-grid > a > small { padding: 0 5px 6px; font-size: .5rem; }

    .dxf-avatar-shop-head { grid-template-columns: minmax(0,1fr) auto; padding: 11px; border-radius: 16px; }
    .dxf-avatar-shop-head h1 { font-size: 1.35rem; }
    .dxf-avatar-shop-head p { font-size: .58rem; }
    .dxf-avatar-shop-hero { min-height: 230px; padding: 14px; border-radius: 17px; }
    .dxf-avatar-shop-hero > div:last-child { max-width: 58%; }
    .dxf-avatar-shop-hero h2 { font-size: 1.1rem; }
    .dxf-avatar-shop-hero p { font-size: .58rem; }
    .dxf-avatar-shop-hero-character { width: 51%; }
    .dxf-avatar-shop-category-shell .dxf-chip-row { gap: 6px; padding: 6px; }

    .dxf-avatar-detail-hero { min-height: 330px; grid-template-columns: 48% 52%; padding: 12px; }
    .dxf-avatar-detail-dynamic { min-height: 290px; }
    .dxf-avatar-detail-dynamic img,
    .dxf-avatar-detail-dynamic video { height: 290px; }
    .dxf-avatar-detail-progress { min-height: 128px; grid-template-columns: minmax(0,1fr) 115px; gap: 8px; padding: 12px; border-radius: 16px; }
    .dxf-avatar-detail-progress strong { font-size: 1.05rem; }
    .dxf-avatar-detail-progress p { font-size: .55rem; }
    .dxf-avatar-detail-progress > a { min-height: 40px; padding: 0 8px; font-size: .55rem; text-align: center; }
    body.route-avatar-modelle .avatar-model-grid { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 6px; }
    body.route-avatar-modelle .avatar-model-grid .avatar-tile { min-width: 0; padding: 4px; border-radius: 10px; }
    body.route-avatar-modelle .avatar-model-grid .avatar-tile > span { font-size: .48rem; }
    body.route-avatar-modelle .avatar-model-grid .avatar-action-btn { min-height: 27px; font-size: .45rem; }

    .dxf-progress-daily { padding: 11px; }
    .dxf-progress-daily-layout { grid-template-columns: minmax(0,1.72fr) minmax(92px,.72fr); gap: 7px; }
    .dxf-progress-daily-layout .dxf-daily-task-grid { gap: 5px; }
    .dxf-progress-daily-layout .dxf-daily-task-grid article { grid-template-columns: 28px minmax(0,1fr) 22px; gap: 6px; padding: 7px; }
    .dxf-progress-daily-layout .dxf-daily-task-grid article > i { width: 28px; height: 28px; }
    .dxf-progress-daily-layout .dxf-daily-task-grid article b { font-size: .55rem; }
    .dxf-progress-daily-layout .dxf-daily-task-grid article small { font-size: .46rem; }
    .dxf-progress-daily-layout > aside { padding: 5px; border-radius: 12px; }
    .dxf-progress-daily-layout > aside .dxf-progress-daily-reward { width: 78px; height: 63px; }
    .dxf-progress-daily-layout > aside small { font-size: .42rem; }
    .dxf-progress-daily-layout > aside b { font-size: .7rem; }
    .dxf-progress-daily-layout > aside a { font-size: .44rem; }
    .dxf-progress-track > div { gap: 3px; }
    .dxf-progress-track span i { width: 30px; height: 30px; font-size: .55rem; }
    .dxf-progress-track > div::before { top: 15px; }

    .dxf-event-main-hero { min-height: 230px; padding: 14px; border-radius: 16px; }
    .dxf-event-main-hero h1 { font-size: 1.35rem; }
    .dxf-event-progress { min-height: 125px; grid-template-columns:minmax(0,1fr) 90px; padding: 11px; }
    .dxf-event-reward { width: 86px; height: 86px; }
    .dxf-event-track { padding: 10px; }
    .dxf-event-track span i { width: 32px; height: 32px; }
    .dxf-event-track > div::before { top: 16px; }

    .dxf-arena-mode-grid { gap: 6px; }
    .dxf-arena-mode-grid > a { min-height: 84px; gap: 3px; padding: 8px 4px; border-radius: 13px; }
    .dxf-arena-mode-grid i { font-size: 1.1rem; }
    .dxf-arena-mode-grid b { font-size: .67rem; }
    .dxf-arena-mode-grid small { font-size: .47rem; }
    .arena-home-grid { gap: 6px; }
    .arena-home-grid .dxf-reference-strip { min-height: 108px; }

    .dxf-kartrace-stats { gap: 5px; }
    .dxf-kartrace-stats article { padding: 7px 5px; border-radius: 11px; }
    .dxf-kartrace-stats i { font-size: .75rem; }
    .dxf-kartrace-stats small { font-size: .42rem; }
    .dxf-kartrace-stats b { font-size: .72rem; }
    .dxf-kartrace-progress { min-height: 118px; grid-template-columns:minmax(0,1fr) 88px; padding: 10px; border-radius: 15px; }
    .dxf-kartrace-progress h2 { font-size: .75rem; }
    .dxf-kartrace-progress p { font-size: .48rem; }
    .dxf-kartrace-progress-reward { width: 84px; height: 78px; }

    .prestige-album-app .dxf-collection-detail-strip { min-height: 135px; }

    .dxf-news-feature-card { min-height: 235px; border-radius: 16px; }
    .dxf-news-feature-card > div:last-child { width: 72%; padding: 14px; }
    .dxf-news-feature-card h2 { font-size: 1.18rem; }
    .dxf-news-feature-card p { font-size: .56rem; }
    .news-preview-card { grid-template-columns: 49% 51%; min-height: 116px; border-radius: 13px; }
    .news-preview-image { min-height: 116px; }
    .news-preview-content { gap: 3px; padding: 8px; }
    .news-preview-content h2 { font-size: .68rem; }
    .news-preview-content p { font-size: .49rem; line-height: 1.25; }
    .news-preview-content > small,
    .news-read-more { font-size: .44rem; }

    body.route-postbox .dxf-context-strips { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 4px; }
    body.route-postbox .dxf-context-strips > span { min-height: 54px; padding: 5px; }
    body.route-postbox .dxf-context-strips b { font-size: .46rem; }
    body.route-postbox .postbox-tabs a { min-height: 40px; border-radius: 11px; font-size: .6rem; }
    body.route-postbox .message-card { padding: 8px; border-radius: 13px; }

    body.route-chat .app-main {
        min-height: 100dvh;
        padding-top: 88px !important;
        padding-right: 8px !important;
        padding-left: 8px !important;
        padding-bottom: calc(154px + env(safe-area-inset-bottom)) !important;
    }
    body.route-chat .dxf-chat-header-graphic {
        aspect-ratio: 16 / 5;
        border-radius: 15px;
    }
    body.route-chat .chat-community-shell {
        min-height: 0;
        margin-top: 8px;
        border-radius: 15px;
    }
    body.route-chat .chat-list {
        max-height: none;
        height: calc(100dvh - 364px - env(safe-area-inset-bottom));
        min-height: 250px;
        padding: 6px;
        overscroll-behavior: contain;
        scrollbar-width: thin;
    }
    body.route-chat .chat-form {
        position: fixed;
        left: 50%;
        right: auto;
        bottom: calc(88px + env(safe-area-inset-bottom));
        z-index: 80;
        width: min(calc(100vw - 16px), calc(var(--dxf-app-width) - 16px));
        grid-template-columns: minmax(0,1fr) auto;
        gap: 7px;
        padding: 7px;
        transform: translateX(-50%);
        border: 1px solid rgba(86,145,255,.28);
        border-radius: 15px 15px 0 0;
        background: rgba(5,15,41,.985);
        box-shadow: 0 -8px 26px rgba(0,0,0,.34);
        backdrop-filter: blur(18px);
    }
    body.route-chat .chat-form input { min-width: 0; min-height: 48px; }
    body.route-chat .chat-form .primary-btn { min-width: 82px; min-height: 48px; padding: 0 14px; }

    body.route-wins .wins-grid,
    body.route-gewinne .wins-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; }
    body.route-wins .win-card,
    body.route-gewinne .win-card { min-height: 150px; padding: 7px; border-radius: 12px; }

    .dxf-ranking-tabs { gap: 5px; }
    .dxf-ranking-tabs a { min-height: 42px; padding: 4px; border-radius: 11px; font-size: .5rem; }

    body.route-shop .dxf-shop-feature-strip { min-height: 140px; }
    body.route-shop .shop-offer-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; }

    body.route-stream .dxf-shows-live-backdrop { min-height: 220px; }
    body.route-stream .dxf-shows-live-backdrop img { min-height: 220px; }
    body.route-stream .stream-radio-banner { margin-top: -232px; min-height: 220px; }
    body.route-stream .stream-show-list { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; }
}

@media (max-width: 420px) {
    body.route-stream .stream-show-list { grid-template-columns: 1fr; }
    body.route-shop .shop-offer-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .dxf-avatar-detail-progress { grid-template-columns: 1fr; }
    .dxf-avatar-detail-progress > a { width: 100%; }
}

/* Shop page rework */
.dxf-shop-page-rework{display:grid;gap:18px;padding-bottom:12px}
.dxf-shop-page-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:start}
.dxf-shop-page-head>div{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"icon title" ". subtitle";column-gap:12px;row-gap:4px;align-items:start}
.dxf-shop-page-icon{grid-area:icon;width:44px;height:44px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(135deg,rgba(211,82,255,.26),rgba(54,207,255,.18));border:1px solid rgba(92,198,255,.25);box-shadow:0 12px 26px rgba(0,0,0,.18);font-size:1.18rem;color:#f5d9ff}
.dxf-shop-page-head h1{grid-area:title;margin:0;font-size:2.8rem;line-height:.95;letter-spacing:-.03em}
.dxf-shop-page-head p{grid-area:subtitle;margin:0;color:var(--muted);font-size:.98rem;font-weight:700}
.dxf-shop-page-head small{align-self:flex-start;color:#7fbcff;font-size:1rem;line-height:1.05;text-align:right;font-family:"Brush Script MT",cursive;letter-spacing:.02em;padding-top:6px}
.dxf-shop-filter-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.dxf-shop-filter-tabs a{min-height:44px;display:flex;align-items:center;justify-content:center;padding:8px 10px;border:1px solid rgba(103,116,192,.34);border-radius:14px;background:rgba(10,16,38,.88);color:#f4f7ff;font-size:.82rem;font-weight:850;box-shadow:0 12px 24px rgba(0,0,0,.16);text-align:center;line-height:1.1}
.dxf-shop-filter-tabs a.active{border-color:rgba(255,124,245,.52);background:linear-gradient(180deg,rgba(255,76,232,.96),rgba(168,74,255,.9));box-shadow:0 14px 28px rgba(219,58,255,.24)}
.dxf-slot-surface{position:relative;overflow:hidden;border:1px solid rgba(88,124,214,.28);border-radius:24px;background:linear-gradient(180deg,rgba(12,19,44,.96),rgba(7,12,31,.96));box-shadow:0 18px 40px rgba(0,0,0,.24);isolation:isolate}
.dxf-slot-surface-compact{padding:14px}
.dxf-slot-surface>.dxf-design-media{position:absolute;inset:0;z-index:0;opacity:.34;pointer-events:none}
.dxf-slot-surface>.dxf-design-media img{width:100%;height:100%;object-fit:cover}
.dxf-slot-surface>*:not(.dxf-design-media){position:relative;z-index:1}
.dxf-shop-feature-card{padding:16px}
.dxf-shop-feature-grid{display:grid;grid-template-columns:minmax(0,1fr) 1.06fr;gap:14px;align-items:stretch}
.dxf-shop-feature-copy{display:grid;align-content:start;gap:10px;padding:4px 0}
.dxf-shop-feature-label{width:max-content;display:inline-flex;align-items:center;justify-content:center;padding:5px 12px;border-radius:999px;border:1px solid rgba(255,224,127,.35);background:rgba(255,211,92,.14);color:#ffe17b;font-size:.72rem;font-weight:1000;letter-spacing:.08em}
.dxf-shop-feature-copy h2{margin:0;font-size:2.05rem;line-height:.92;letter-spacing:-.03em}
.dxf-shop-feature-copy p{margin:0;color:#d4dcff;font-size:.93rem;line-height:1.4}
.dxf-shop-feature-price{display:inline-flex;align-items:center;gap:8px;width:max-content;padding:6px 0 4px 0}.dxf-shop-feature-price img{width:22px;height:22px}.dxf-shop-feature-price b{font-size:2rem;line-height:1;color:#ffd25a}
.dxf-shop-main-buy,.dxf-shop-buy-btn{min-height:48px;display:inline-flex;align-items:center;justify-content:center;padding:0 20px;border:0;border-radius:18px;background:linear-gradient(180deg,#ff5ae8,#b24eff);color:#fff;font-size:1.02rem;font-weight:1000;box-shadow:0 14px 28px rgba(207,74,255,.24)}
.dxf-shop-main-buy{width:min(100%,290px)}
.dxf-shop-feature-visual{display:grid;grid-template-columns:minmax(0,1fr) 132px;gap:12px;align-items:stretch}
.dxf-shop-feature-main-image{min-height:260px;border-radius:22px;border:1px solid rgba(109,148,255,.28);background:radial-gradient(circle at 50% 25%,rgba(255,103,245,.24),rgba(53,207,255,.08) 42%,rgba(8,11,26,.7) 74%);display:grid;place-items:center;padding:14px}
.dxf-shop-feature-main-image img{max-width:100%;max-height:280px;object-fit:contain;filter:drop-shadow(0 16px 30px rgba(0,0,0,.34))}
.dxf-shop-feature-sidegrid{display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:10px}
.dxf-shop-feature-sidecard{min-width:0;display:grid;gap:6px;align-content:start;padding:10px;border-radius:18px;border:1px solid rgba(101,130,221,.28);background:rgba(9,16,36,.84)}
.dxf-shop-feature-sidecard img{width:100%;height:74px;object-fit:contain;border-radius:12px}
.dxf-shop-feature-sidecard span{font-size:.72rem;font-weight:800;line-height:1.2;color:#f4f7ff}
.dxf-shop-feature-sidecard.is-slot{padding:0;overflow:hidden}.dxf-shop-feature-sidecard.is-slot .dxf-shop-feature-side-image{position:static;opacity:1;height:88px}.dxf-shop-feature-sidecard.is-slot .dxf-shop-feature-side-image img{height:100%;object-fit:cover}.dxf-shop-feature-sidecard.is-slot span{padding:0 10px 10px}
.dxf-shop-section-head{display:flex;align-items:end;justify-content:space-between;gap:10px}.dxf-shop-section-head h2{margin:0;font-size:2rem;line-height:1}.dxf-shop-section-head a{color:#b4caff;font-size:.88rem;font-weight:750;text-align:right}
.dxf-shop-product-grid{display:grid;gap:10px}
.dxf-shop-product-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.dxf-shop-product-grid.four{grid-template-columns:repeat(4,minmax(0,1fr));padding:12px}
.dxf-shop-product-card{overflow:hidden;border:1px solid rgba(92,119,208,.28);border-radius:20px;background:linear-gradient(180deg,rgba(11,17,40,.98),rgba(8,13,34,.96));box-shadow:0 16px 32px rgba(0,0,0,.18)}
.dxf-shop-product-media{position:relative;display:grid;place-items:center;min-height:120px;padding:10px;background:radial-gradient(circle at 50% 18%,rgba(255,81,233,.16),rgba(53,207,255,.08) 45%,rgba(9,13,35,.35) 70%)}
.dxf-shop-product-media img{max-width:100%;max-height:104px;object-fit:contain;filter:drop-shadow(0 12px 24px rgba(0,0,0,.32))}
.dxf-shop-product-fallback{width:60px;height:60px;display:grid;place-items:center;border-radius:18px;background:rgba(15,24,58,.82)}
.dxf-shop-product-fallback img{width:36px;height:36px;object-fit:contain}
.dxf-shop-product-badge{position:absolute;left:8px;top:8px;display:inline-flex;align-items:center;justify-content:center;min-height:23px;padding:3px 8px;border-radius:999px;background:rgba(255,80,164,.16);border:1px solid rgba(255,112,201,.28);color:#fff;font-size:.62rem;font-weight:1000;letter-spacing:.04em;text-transform:uppercase}
.dxf-shop-product-copy{display:grid;gap:8px;padding:10px 10px 12px}.dxf-shop-product-copy h3{margin:0;font-size:1.02rem;line-height:1.05}.dxf-shop-product-copy p{margin:0;color:#c7d5ff;font-size:.78rem;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2em}.dxf-shop-inline-price{display:inline-flex;align-items:center;gap:5px}.dxf-shop-inline-price img{width:16px;height:16px}.dxf-shop-inline-price b{font-size:1.22rem;line-height:1}.dxf-shop-product-card.currency-diamonds .dxf-shop-inline-price b{color:#6fe7ff}.dxf-shop-product-card.currency-coins .dxf-shop-inline-price b{color:#ffd35a}
.dxf-shop-style-preview{display:grid;grid-template-columns:160px minmax(0,1fr) 165px;gap:12px;padding:14px}
.dxf-shop-style-avatar{width:100%;min-height:170px;display:grid;place-items:center;border-radius:20px;border:1px solid rgba(116,142,255,.25);background:rgba(10,16,39,.7);padding:10px}.dxf-shop-style-avatar img{max-width:100%;max-height:200px;object-fit:contain;filter:drop-shadow(0 16px 30px rgba(0,0,0,.34))}
.dxf-shop-style-center{display:grid;align-content:center;gap:8px;padding:14px 16px;border-radius:20px;border:1px solid rgba(99,126,221,.26);background:linear-gradient(180deg,rgba(24,18,62,.76),rgba(10,16,39,.82))}
.dxf-shop-style-center h3{margin:0;font-size:1.9rem}.dxf-shop-style-member{width:max-content;display:inline-flex;align-items:center;justify-content:center;padding:5px 12px;border-radius:999px;background:rgba(211,84,255,.18);border:1px solid rgba(233,126,255,.28);font-size:.74rem;font-weight:950;letter-spacing:.05em}.dxf-shop-style-center p{margin:0;color:#d7ddff;font-size:.93rem;font-weight:700}.dxf-shop-style-badges{display:flex;gap:10px;flex-wrap:wrap}.dxf-shop-style-badges span{width:38px;height:38px;display:grid;place-items:center;border-radius:14px;border:1px solid rgba(111,138,255,.24);background:rgba(10,16,39,.74);color:#ffe797;font-size:1rem}
.dxf-shop-style-right{display:grid;gap:9px}.dxf-shop-style-right article{display:grid;gap:2px;padding:10px 12px;border-radius:16px;border:1px solid rgba(105,130,219,.28);background:rgba(9,16,36,.82)}.dxf-shop-style-right article small{color:#8ecbff;font-size:.68rem;font-weight:950;text-transform:uppercase;letter-spacing:.04em}.dxf-shop-style-right article b{font-size:.86rem;line-height:1.2}
.dxf-shop-almost-done{display:grid;gap:8px;padding:14px}.dxf-shop-almost-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.dxf-shop-almost-head span{color:#ffd76b;font-size:.95rem;font-weight:1000}.dxf-shop-almost-head b{font-size:.95rem;line-height:1.3}.dxf-shop-almost-progress{height:15px;border-radius:999px;border:1px solid rgba(111,131,211,.26);background:rgba(10,16,39,.82);overflow:hidden}.dxf-shop-almost-progress span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#ff5ce9,#b44cff)}.dxf-shop-almost-meta{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:10px}.dxf-shop-almost-meta strong{font-size:1.05rem}.dxf-shop-almost-meta em{color:#ff8cf3;font-size:1.1rem;font-style:normal;font-weight:900}.dxf-shop-almost-meta img{width:48px;height:48px;object-fit:contain;border-radius:16px;background:rgba(9,16,36,.74);padding:6px;border:1px solid rgba(102,128,212,.25)}
@media(min-width:900px){.dxf-shop-page-rework{gap:22px}.dxf-shop-page-head h1{font-size:3.1rem}.dxf-shop-page-head p{font-size:1.02rem}.dxf-shop-feature-card{padding:20px}.dxf-shop-feature-copy h2{font-size:2.8rem}.dxf-shop-feature-price b{font-size:2.5rem}.dxf-shop-feature-main-image{min-height:320px}.dxf-shop-feature-main-image img{max-height:320px}.dxf-shop-product-media{min-height:180px}.dxf-shop-product-media img{max-height:160px}}
@media(max-width:700px){.dxf-shop-page-head h1{font-size:2.45rem}.dxf-shop-page-head p{font-size:.92rem}.dxf-shop-page-head small{font-size:.9rem}.dxf-shop-filter-tabs{grid-template-columns:repeat(5,minmax(64px,1fr));overflow:auto;padding-bottom:2px}.dxf-shop-filter-tabs a{white-space:nowrap;font-size:.78rem;min-width:64px}.dxf-shop-feature-grid{grid-template-columns:1fr}.dxf-shop-feature-visual{grid-template-columns:minmax(0,1fr) 110px}.dxf-shop-feature-main-image{min-height:220px}.dxf-shop-feature-main-image img{max-height:220px}.dxf-shop-section-head h2{font-size:1.85rem}.dxf-shop-section-head a{font-size:.8rem}.dxf-shop-product-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.dxf-shop-product-grid.four{grid-template-columns:repeat(4,minmax(0,1fr));padding:10px}.dxf-shop-product-media{min-height:92px;padding:8px}.dxf-shop-product-media img{max-height:80px}.dxf-shop-product-copy{padding:8px}.dxf-shop-product-copy h3{font-size:.82rem}.dxf-shop-product-copy p{font-size:.68rem}.dxf-shop-inline-price b{font-size:1rem}.dxf-shop-style-preview{grid-template-columns:1fr;gap:10px}.dxf-shop-style-avatar{min-height:145px}.dxf-shop-style-center h3{font-size:1.55rem}.dxf-shop-style-right{grid-template-columns:repeat(2,minmax(0,1fr))}.dxf-shop-almost-head b{font-size:.88rem}.dxf-shop-almost-meta{grid-template-columns:1fr auto}.dxf-shop-almost-meta em{grid-column:1 / -1}}

.dxf-progress-page{display:grid;gap:16px}
.dxf-progress-v3-head,.dxf-progress-v3-panel,.dxf-progress-v3-level-card,.dxf-progress-v3-task,.dxf-progress-v3-claim,.dxf-progress-v3-milestone,.dxf-progress-v3-goal-card{position:relative;overflow:hidden}
.dxf-progress-v3-head{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;padding:18px;border-radius:28px;border:1px solid rgba(110,141,255,.22);background:linear-gradient(180deg,rgba(11,19,44,.98),rgba(8,13,34,.98));box-shadow:0 16px 34px rgba(0,0,0,.18)}
.dxf-progress-v3-head-bg,.dxf-progress-v3-level-bg,.dxf-progress-v3-panel-bg,.dxf-progress-v3-task-bg,.dxf-progress-v3-claim-bg{position:absolute;inset:0;opacity:.18;pointer-events:none;z-index:0}.dxf-progress-v3-head-bg img,.dxf-progress-v3-level-bg img,.dxf-progress-v3-panel-bg img,.dxf-progress-v3-task-bg img,.dxf-progress-v3-claim-bg img{width:100%;height:100%;object-fit:cover}
.dxf-progress-v3-head>*:not(.dxf-progress-v3-head-bg),.dxf-progress-v3-level-card>*:not(.dxf-progress-v3-level-bg),.dxf-progress-v3-panel>*:not(.dxf-progress-v3-panel-bg),.dxf-progress-v3-task>*:not(.dxf-progress-v3-task-bg),.dxf-progress-v3-claim>*:not(.dxf-progress-v3-claim-bg){position:relative;z-index:1}
.dxf-progress-v3-head-copy{display:grid;gap:8px;align-content:start}.dxf-progress-v3-head-copy h1{margin:0;font-size:2.7rem;line-height:.95;letter-spacing:-.04em}.dxf-progress-v3-head-copy p{margin:0;display:inline-flex;align-items:center;gap:10px;color:#b9cbff;font-size:1rem;font-weight:750}.dxf-progress-v3-head-copy p i{color:#ff8cf2}
.dxf-progress-v3-level-card{display:grid;grid-template-columns:56px minmax(0,1fr);gap:12px;align-items:center;padding:16px 18px;border-radius:24px;border:1px solid rgba(131,93,255,.34);background:linear-gradient(180deg,rgba(18,14,48,.96),rgba(8,14,38,.96))}.dxf-progress-v3-level-icon{width:56px;height:56px;display:grid;place-items:center;border-radius:18px;background:radial-gradient(circle at 30% 30%,rgba(255,119,240,.46),rgba(119,73,255,.22) 55%,rgba(11,18,41,.18));border:1px solid rgba(255,117,234,.34);color:#ff96f3;font-size:1.35rem;box-shadow:0 0 30px rgba(255,84,236,.18)}.dxf-progress-v3-level-copy{display:grid;gap:6px}.dxf-progress-v3-level-copy small{color:#dce6ff;font-size:.86rem;font-weight:800;opacity:.92}.dxf-progress-v3-level-copy strong{font-size:2rem;line-height:1}.dxf-progress-v3-level-meta{display:flex;align-items:center;justify-content:space-between;gap:10px}.dxf-progress-v3-level-meta b{color:#ff8cf2;font-size:.86rem}.dxf-progress-v3-level-meta i{color:#dce6ff;opacity:.9}
.dxf-progress-v3-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.dxf-progress-v3-tabs a{min-height:54px;display:flex;align-items:center;justify-content:center;gap:9px;padding:0 12px;border-radius:18px;border:1px solid rgba(92,121,214,.26);background:linear-gradient(180deg,rgba(10,16,39,.92),rgba(8,14,36,.92));color:#edf2ff;font-size:.9rem;font-weight:850;text-align:center}.dxf-progress-v3-tabs a i{font-size:1rem;color:#cfd8ff}.dxf-progress-v3-tabs a.is-active{border-color:rgba(146,103,255,.52);background:linear-gradient(180deg,rgba(134,78,255,.82),rgba(75,180,255,.38));box-shadow:0 0 0 1px rgba(144,103,255,.2),0 0 30px rgba(162,90,255,.2)}.dxf-progress-v3-tabs a.is-active i{color:#fff}
.dxf-progress-v3-panel{display:grid;gap:14px;padding:18px;border-radius:28px;border:1px solid rgba(110,141,255,.22);background:linear-gradient(180deg,rgba(11,17,40,.98),rgba(8,13,34,.98));box-shadow:0 14px 28px rgba(0,0,0,.16)}
.dxf-progress-v3-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}.dxf-progress-v3-section-head small{display:block;margin-bottom:5px;color:#7fd7ff;font-size:.8rem;font-weight:1000;letter-spacing:.08em;text-transform:uppercase}.dxf-progress-v3-section-head h2{margin:0 0 4px 0;font-size:2rem;line-height:.96;letter-spacing:-.03em}.dxf-progress-v3-section-head p{margin:0;color:#cfd9ff;font-size:.95rem;line-height:1.35}.dxf-progress-v3-section-head b{display:inline-flex;align-items:center;gap:8px;color:#f0b8ff;font-size:1rem;font-weight:900}.dxf-progress-v3-section-head--inline b{color:#dce6ff}
.dxf-progress-v3-daily-layout{display:grid;gap:14px}.dxf-progress-v3-task-list{display:grid;gap:12px}.dxf-progress-v3-task{display:grid;grid-template-columns:42px minmax(0,1fr) auto 28px;gap:12px;align-items:center;min-height:88px;padding:16px 18px;border-radius:22px;border:1px solid rgba(90,120,214,.26);background:rgba(9,15,37,.82)}.dxf-progress-v3-task-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:14px;background:rgba(255,255,255,.06);border:1px solid rgba(126,150,224,.22);color:#9fe7ff;font-size:1.05rem}.dxf-progress-v3-task-copy{display:grid;gap:4px;min-width:0}.dxf-progress-v3-task-copy b{font-size:1.08rem;line-height:1.1}.dxf-progress-v3-task-copy small{color:#bfd0ff;font-size:.82rem;line-height:1.25}.dxf-progress-v3-task-value{font-size:1.5rem;line-height:1;color:#6ffff0;font-weight:1000;white-space:nowrap}.dxf-progress-v3-task-state{width:28px;display:grid;place-items:center;font-size:1.6rem;color:#8192c6}.dxf-progress-v3-task.is-done .dxf-progress-v3-task-state{color:#42f4a4}.dxf-progress-v3-task.is-claimed{border-color:rgba(82,234,173,.24)}.dxf-progress-v3-task.is-claimed .dxf-progress-v3-task-value{color:#afffe6}
.dxf-progress-v3-claim{display:grid;align-content:start;justify-items:center;gap:10px;padding:18px;border-radius:24px;border:1px solid rgba(130,95,255,.28);background:radial-gradient(circle at 50% 10%,rgba(255,104,238,.16),rgba(88,130,255,.08) 48%,rgba(10,16,39,.92) 80%)}.dxf-progress-v3-claim-art-wrap{width:100%;display:grid;place-items:center;min-height:170px}.dxf-progress-v3-claim-art{max-width:100%;max-height:220px}.dxf-progress-v3-claim-art img{max-width:100%;max-height:220px;object-fit:contain;filter:drop-shadow(0 16px 30px rgba(0,0,0,.36))}.dxf-progress-v3-claim strong{font-size:1.6rem;line-height:1;text-align:center}.dxf-progress-v3-claim p{margin:0;color:#d6ddff;text-align:center;font-size:.93rem;line-height:1.32}.dxf-progress-v3-claim form,.dxf-progress-v3-week-claim{width:100%}.dxf-progress-v3-claim button,.dxf-progress-v3-week-claim button{width:100%;min-height:54px;display:flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:18px;background:linear-gradient(180deg,#ffd95c,#ffb325);color:#2d1900;font-size:1rem;font-weight:1000;box-shadow:0 16px 28px rgba(255,184,41,.22)}.dxf-progress-v3-claim-link{width:100%;min-height:52px;display:flex;align-items:center;justify-content:center;border-radius:18px;border:1px solid rgba(108,133,221,.24);background:rgba(13,21,50,.72);color:#edf2ff;font-weight:900}.dxf-progress-v3-claim-progress,.dxf-progress-v3-bar{width:100%;height:14px;border-radius:999px;border:1px solid rgba(112,131,211,.26);background:rgba(9,16,36,.82);overflow:hidden}.dxf-progress-v3-claim-progress span,.dxf-progress-v3-bar span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#ff62e8,#8e5dff 55%,#42d8ff)}.dxf-progress-v3-bar--lg{height:18px}.dxf-progress-v3-claim em{font-style:normal;color:#d1ddff;font-size:.82rem;font-weight:800}.dxf-progress-v3-pill{width:max-content;display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;background:rgba(54,214,155,.14);border:1px solid rgba(87,239,186,.2);font-size:.8rem;font-weight:900;color:#9ff3ce}
.dxf-progress-v3-week-score{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.dxf-progress-v3-week-score strong{font-size:2rem;line-height:1}.dxf-progress-v3-week-score span{color:#d1dbff;font-size:1rem;font-weight:850}
.dxf-progress-v3-milestones{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.dxf-progress-v3-milestone{display:grid;gap:8px;justify-items:center;padding:16px 12px;border-radius:22px;border:1px solid rgba(98,124,214,.24);background:rgba(9,16,36,.8);text-align:center}.dxf-progress-v3-milestone-top{width:34px;height:34px;display:grid;place-items:center;border-radius:999px;background:rgba(255,95,229,.14);border:1px solid rgba(255,114,236,.26);color:#ff92f1}.dxf-progress-v3-milestone-art{width:72px;height:72px;display:grid;place-items:center;border-radius:20px;border:1px solid rgba(114,138,220,.24);background:rgba(12,20,48,.84)}.dxf-progress-v3-milestone-art img{width:100%;height:100%;object-fit:contain}.dxf-progress-v3-milestone-art span{font-size:1.5rem;color:#ffe282}.dxf-progress-v3-milestone strong{font-size:.96rem;line-height:1.05}.dxf-progress-v3-milestone small{color:#bcd0ff;font-size:.76rem}.dxf-progress-v3-milestone.is-earned{border-color:rgba(84,239,183,.28);box-shadow:0 0 0 1px rgba(84,239,183,.1) inset}.dxf-progress-v3-milestone.is-earned .dxf-progress-v3-milestone-top{background:rgba(71,238,166,.18);border-color:rgba(84,239,183,.28);color:#68ffbd}.dxf-progress-v3-milestone.is-current{border-color:rgba(255,201,92,.3);box-shadow:0 0 0 1px rgba(255,200,84,.08) inset}
.dxf-progress-v3-goals{display:grid;gap:12px}.dxf-progress-v3-goal-card{display:grid;grid-template-columns:74px minmax(0,1fr) minmax(110px,150px) 14px;gap:14px;align-items:center;padding:14px 16px;border-radius:24px;border:1px solid rgba(99,126,218,.24);background:rgba(9,16,36,.82)}.dxf-progress-v3-goal-art{width:74px;height:74px;display:grid;place-items:center;border-radius:20px;border:1px solid rgba(114,138,220,.24);background:radial-gradient(circle at 50% 18%,rgba(255,81,233,.16),rgba(53,207,255,.08) 45%,rgba(9,13,35,.35) 70%);overflow:hidden}.dxf-progress-v3-goal-art img,.dxf-progress-v3-goal-art .avatar-display{width:100%;height:100%;object-fit:contain}.dxf-progress-v3-goal-art .avatar-display-shell{width:100%;height:100%;display:grid;place-items:center}.dxf-progress-v3-goal-art span{font-size:1.7rem;color:#ffcd63}.dxf-progress-v3-goal-copy{display:grid;gap:4px;min-width:0}.dxf-progress-v3-goal-copy strong{font-size:1.18rem;line-height:1.08}.dxf-progress-v3-goal-copy p{margin:0;color:#c9d7ff;font-size:.84rem;line-height:1.3}.dxf-progress-v3-goal-meta{display:grid;gap:6px}.dxf-progress-v3-goal-meta b{font-size:1rem;text-align:right}.dxf-progress-v3-goal-card>i{color:#d8e2ff;font-size:1rem;justify-self:end}.dxf-progress-v3-goal-card--streak{grid-template-columns:74px minmax(0,1fr) 1fr 24px}.dxf-progress-v3-streak-days{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}.dxf-progress-v3-streak-days span{min-width:40px;display:grid;justify-items:center;gap:4px;color:#6f7eb3;font-size:.75rem;font-weight:800}.dxf-progress-v3-streak-days span i{width:30px;height:30px;display:grid;place-items:center;border-radius:999px;border:1px solid rgba(102,127,210,.22);background:rgba(10,16,39,.76)}.dxf-progress-v3-streak-days span.is-active{color:#ffd3ff}.dxf-progress-v3-streak-days span.is-active i{background:linear-gradient(180deg,#ff65e9,#b44dff);border-color:rgba(255,102,234,.4);color:#fff;box-shadow:0 8px 18px rgba(212,78,255,.26)}.dxf-progress-v3-goal-gift{width:24px;height:24px;display:grid;place-items:center;color:#ffcd63}
@media(min-width:900px){.dxf-progress-v3-head{grid-template-columns:minmax(0,1fr) 390px;padding:24px}.dxf-progress-v3-head-copy h1{font-size:4rem}.dxf-progress-v3-daily-layout{grid-template-columns:minmax(0,1fr) 320px}.dxf-progress-v3-milestones{grid-template-columns:repeat(6,minmax(0,1fr))}.dxf-progress-v3-goal-card{grid-template-columns:86px minmax(0,1fr) 180px 18px}.dxf-progress-v3-goal-card--streak{grid-template-columns:86px minmax(0,1fr) auto 26px}.dxf-progress-v3-goal-art{width:86px;height:86px}}
@media(max-width:700px){.dxf-progress-v3-head-copy h1{font-size:2.25rem}.dxf-progress-v3-head-copy p{font-size:.9rem}.dxf-progress-v3-level-card{padding:14px}.dxf-progress-v3-level-copy strong{font-size:1.7rem}.dxf-progress-v3-tabs{grid-template-columns:repeat(4,minmax(72px,1fr));overflow:auto;padding-bottom:2px}.dxf-progress-v3-tabs a{white-space:nowrap;min-width:72px;font-size:.78rem}.dxf-progress-v3-section-head h2{font-size:1.65rem}.dxf-progress-v3-task{grid-template-columns:40px minmax(0,1fr) auto 24px;padding:14px}.dxf-progress-v3-task-value{font-size:1.08rem}.dxf-progress-v3-claim strong{font-size:1.35rem}.dxf-progress-v3-week-score strong{font-size:1.55rem}.dxf-progress-v3-goal-card{grid-template-columns:64px minmax(0,1fr);gap:12px}.dxf-progress-v3-goal-meta,.dxf-progress-v3-goal-card>i{grid-column:2}.dxf-progress-v3-goal-meta b{text-align:left}.dxf-progress-v3-goal-card--streak{grid-template-columns:64px minmax(0,1fr)}.dxf-progress-v3-streak-days{grid-column:1 / -1;justify-content:flex-start}.dxf-progress-v3-goal-gift{grid-column:2;justify-self:end}}

@media(max-width:700px){
.dxf-progress-page{gap:8px!important;padding-bottom:0}
.dxf-progress-v3-head{grid-template-columns:minmax(0,.95fr) minmax(0,1.35fr)!important;gap:8px!important;align-items:center!important;padding:10px 10px!important;border-radius:20px!important;min-height:74px}
.dxf-progress-v3-head-copy{gap:3px!important;padding-left:2px}
.dxf-progress-v3-head-copy h1{font-size:1.72rem!important;line-height:.94!important;letter-spacing:-.045em!important}
.dxf-progress-v3-head-copy p{gap:5px!important;font-size:.58rem!important;line-height:1.05!important;white-space:nowrap}
.dxf-progress-v3-head-copy p i{font-size:.62rem}
.dxf-progress-v3-level-card{grid-template-columns:34px minmax(0,1fr)!important;gap:7px!important;padding:8px 9px!important;border-radius:16px!important;min-height:58px}
.dxf-progress-v3-level-icon{width:34px!important;height:34px!important;border-radius:11px!important;font-size:.82rem!important}
.dxf-progress-v3-level-copy{gap:2px!important}
.dxf-progress-v3-level-copy small{font-size:.56rem!important;line-height:1!important}
.dxf-progress-v3-level-copy strong{font-size:1.35rem!important;line-height:.92!important}
.dxf-progress-v3-level-meta{gap:4px!important}
.dxf-progress-v3-level-meta b{font-size:.53rem!important;white-space:nowrap}
.dxf-progress-v3-level-meta i{font-size:.55rem}
.dxf-progress-v3-bar{height:6px!important}
.dxf-progress-v3-bar--lg{height:8px!important}

.dxf-progress-v3-tabs{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important;overflow:visible!important;padding:0!important}
.dxf-progress-v3-tabs a{min-width:0!important;min-height:34px!important;padding:0 4px!important;border-radius:12px!important;gap:4px!important;font-size:.56rem!important;line-height:1!important;white-space:nowrap!important}
.dxf-progress-v3-tabs a i{font-size:.64rem!important}

.dxf-progress-v3-panel{gap:7px!important;padding:10px!important;border-radius:19px!important}
.dxf-progress-v3-section-head{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;align-items:start!important;gap:5px 8px!important;flex-wrap:nowrap!important}
.dxf-progress-v3-section-head>div{min-width:0}
.dxf-progress-v3-section-head h2{display:flex;align-items:center;gap:6px;margin:0 0 3px!important;font-size:1rem!important;line-height:1!important;letter-spacing:-.025em!important}
.dxf-progress-v3-section-head h2 i{color:#ff75e6;font-size:.8rem}
.dxf-progress-v3-section-head p{font-size:.58rem!important;line-height:1.16!important;max-width:100%!important}
.dxf-progress-v3-section-head b{gap:4px!important;font-size:.54rem!important;line-height:1.05!important;white-space:nowrap!important;padding-top:2px}
.dxf-progress-v3-section-head b i{font-size:.56rem}
.dxf-progress-v3-section-head--inline{align-items:center!important}

.dxf-progress-v3-daily-layout{grid-template-columns:minmax(0,1.56fr) minmax(102px,.72fr)!important;gap:7px!important;align-items:stretch!important}
.dxf-progress-v3-task-list{gap:5px!important}
.dxf-progress-v3-task{grid-template-columns:27px minmax(0,1fr) auto 17px!important;gap:5px!important;min-height:42px!important;padding:6px 7px!important;border-radius:12px!important}
.dxf-progress-v3-task-icon{width:27px!important;height:27px!important;border-radius:8px!important;font-size:.65rem!important}
.dxf-progress-v3-task-copy{gap:1px!important}
.dxf-progress-v3-task-copy b{font-size:.61rem!important;line-height:1.05!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dxf-progress-v3-task-copy small{font-size:.47rem!important;line-height:1.05!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dxf-progress-v3-task-value{font-size:.67rem!important;line-height:1!important}
.dxf-progress-v3-task-state{width:17px!important;font-size:.83rem!important}

.dxf-progress-v3-claim{gap:4px!important;padding:6px!important;border-radius:13px!important;align-content:start!important;min-height:136px}
.dxf-progress-v3-claim-art-wrap{min-height:60px!important;height:60px!important}
.dxf-progress-v3-claim-art,.dxf-progress-v3-claim-art img{max-height:62px!important}
.dxf-progress-v3-claim strong{font-size:.62rem!important;line-height:1.05!important}
.dxf-progress-v3-claim p{display:none!important}
.dxf-progress-v3-claim form{margin:0!important}
.dxf-progress-v3-claim button{min-height:25px!important;border-radius:8px!important;gap:4px!important;font-size:.48rem!important;padding:0 4px!important}
.dxf-progress-v3-claim-link{min-height:25px!important;border-radius:8px!important;font-size:.48rem!important}
.dxf-progress-v3-claim-progress{height:5px!important}
.dxf-progress-v3-claim em{font-size:.42rem!important;line-height:1!important;text-align:center}
.dxf-progress-v3-pill{padding:3px 5px!important;font-size:.44rem!important;gap:3px!important}

.dxf-progress-v3-week-score{gap:5px!important;flex-wrap:nowrap!important}
.dxf-progress-v3-week-score strong{font-size:1rem!important;line-height:1!important}
.dxf-progress-v3-week-score span{font-size:.52rem!important;line-height:1!important;white-space:nowrap}
.dxf-progress-v3-milestones{grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:4px!important}
.dxf-progress-v3-milestone{gap:2px!important;padding:5px 2px!important;border-radius:10px!important;min-width:0!important}
.dxf-progress-v3-milestone-top{width:17px!important;height:17px!important;font-size:.42rem!important}
.dxf-progress-v3-milestone-art{width:34px!important;height:34px!important;border-radius:8px!important}
.dxf-progress-v3-milestone-art span{font-size:.75rem!important}
.dxf-progress-v3-milestone strong{font-size:.45rem!important;line-height:1!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.dxf-progress-v3-milestone small{font-size:.39rem!important;line-height:1!important;white-space:nowrap}
.dxf-progress-v3-week-claim{margin-top:0!important}
.dxf-progress-v3-week-claim button{min-height:28px!important;border-radius:9px!important;font-size:.5rem!important}

.dxf-progress-v3-goals{gap:5px!important}
.dxf-progress-v3-goal-card{grid-template-columns:40px minmax(0,1fr) 88px 9px!important;gap:6px!important;align-items:center!important;padding:6px 7px!important;border-radius:12px!important;min-height:48px}
.dxf-progress-v3-goal-art{width:40px!important;height:40px!important;border-radius:9px!important}
.dxf-progress-v3-goal-art span{font-size:.85rem!important}
.dxf-progress-v3-goal-copy{gap:1px!important}
.dxf-progress-v3-goal-copy strong{font-size:.57rem!important;line-height:1.04!important}
.dxf-progress-v3-goal-copy p{font-size:.44rem!important;line-height:1.05!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dxf-progress-v3-goal-meta{display:grid!important;grid-column:auto!important;gap:3px!important}
.dxf-progress-v3-goal-meta b{font-size:.49rem!important;line-height:1!important;text-align:right!important}
.dxf-progress-v3-goal-card>i{grid-column:auto!important;font-size:.52rem!important}
.dxf-progress-v3-goal-card--streak{grid-template-columns:40px minmax(0,1fr) auto 16px!important}
.dxf-progress-v3-streak-days{grid-column:auto!important;display:grid!important;grid-template-columns:repeat(7,17px)!important;gap:2px!important;justify-content:end!important;flex-wrap:nowrap!important}
.dxf-progress-v3-streak-days span{min-width:0!important;gap:1px!important;font-size:.37rem!important}
.dxf-progress-v3-streak-days span i{width:15px!important;height:15px!important;font-size:.38rem!important}
.dxf-progress-v3-streak-days span small{font-size:.34rem!important}
.dxf-progress-v3-goal-gift{grid-column:auto!important;width:16px!important;height:16px!important;font-size:.65rem!important}
}

.dxf-progress-reference-exact{gap:11px!important;padding-bottom:6px!important}
.dxf-progress-ref-top,.dxf-progress-ref-section,.dxf-progress-ref-level,.dxf-progress-ref-task,.dxf-progress-ref-daily-reward,.dxf-progress-ref-reward-art,.dxf-progress-ref-goal,.dxf-progress-ref-goal-art{position:relative;overflow:hidden;isolation:isolate}
.dxf-progress-ref-top-bg,.dxf-progress-ref-level-bg,.dxf-progress-ref-section-bg,.dxf-progress-ref-daily-reward-bg{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;z-index:0!important;opacity:1!important;pointer-events:none!important}
.dxf-progress-ref-top-bg img,.dxf-progress-ref-level-bg img,.dxf-progress-ref-section-bg img,.dxf-progress-ref-daily-reward-bg img{width:100%!important;height:100%!important;object-fit:cover!important}
.dxf-progress-ref-top>*:not(.dxf-progress-ref-top-bg),.dxf-progress-ref-level>*:not(.dxf-progress-ref-level-bg),.dxf-progress-ref-section>*:not(.dxf-progress-ref-section-bg),.dxf-progress-ref-daily-reward>*:not(.dxf-progress-ref-daily-reward-bg){position:relative;z-index:1}
.dxf-progress-ref-top{display:grid;grid-template-columns:minmax(0,.98fr) minmax(0,1.18fr);align-items:center;gap:9px;min-height:64px;padding:5px 2px;background:transparent}
.dxf-progress-ref-title{min-width:0;display:grid;align-content:center;gap:5px;padding-left:3px}
.dxf-progress-ref-title h1{margin:0;color:#f8f9ff;font-size:1.86rem;line-height:.94;font-weight:1000;letter-spacing:-.045em;text-shadow:0 2px 8px rgba(0,0,0,.28)}
.dxf-progress-ref-title p{margin:0;display:flex;align-items:center;gap:6px;color:#9fb8ff;font-size:.66rem;line-height:1.05;font-weight:750;white-space:nowrap}
.dxf-progress-ref-title p i{color:#e977ff;font-size:.69rem}
.dxf-progress-ref-level{display:grid;grid-template-columns:38px minmax(0,.72fr) minmax(0,1.25fr) 10px;align-items:center;gap:6px;min-height:53px;padding:7px 9px;border:1px solid rgba(98,93,255,.62);border-radius:12px;background:linear-gradient(105deg,rgba(26,12,67,.93),rgba(6,19,49,.93));box-shadow:0 0 0 1px rgba(77,199,255,.08) inset,0 0 18px rgba(105,64,255,.12)}
.dxf-progress-ref-level-art{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;background:radial-gradient(circle at 50% 45%,rgba(236,91,255,.3),rgba(89,49,173,.18) 60%,transparent 72%);color:#ef79ff;font-size:1.24rem;filter:drop-shadow(0 0 8px rgba(225,73,255,.35))}
.dxf-progress-ref-level-art img{width:100%;height:100%;object-fit:contain}
.dxf-progress-ref-level-copy{display:grid;align-content:center;gap:0;min-width:0}.dxf-progress-ref-level-copy small{color:#f0f3ff;font-size:.56rem;line-height:1;font-weight:800;white-space:nowrap}.dxf-progress-ref-level-copy strong{color:#fff;font-size:1.45rem;line-height:.95;font-weight:1000}
.dxf-progress-ref-level-xp{display:grid;gap:4px;align-content:end;min-width:0}.dxf-progress-ref-level-xp>b{color:#ea85ff;font-size:.54rem;line-height:1;font-weight:950;white-space:nowrap;text-align:right}.dxf-progress-ref-level-xp>span{height:5px;border-radius:999px;background:#0d1840;border:1px solid rgba(89,105,189,.42);overflow:hidden}.dxf-progress-ref-level-xp>span i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#a54fff,#b54cff 53%,#52d8ff)}.dxf-progress-ref-level>i{color:#e9edff;font-size:.58rem}
.dxf-progress-ref-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}
.dxf-progress-ref-tabs a{min-width:0;min-height:35px;display:flex;align-items:center;justify-content:center;gap:6px;padding:0 7px;border:1px solid rgba(74,102,181,.5);border-radius:9px;background:linear-gradient(180deg,rgba(9,19,45,.96),rgba(7,13,34,.96));color:#f2f4ff;font-size:.63rem;line-height:1;font-weight:850;white-space:nowrap;box-shadow:0 0 0 1px rgba(255,255,255,.015) inset}
.dxf-progress-ref-tabs a i{color:#e8e8ff;font-size:.72rem}.dxf-progress-ref-tabs a.is-active{border-color:rgba(91,160,255,.82);background:linear-gradient(110deg,#a044ff,#596bff 55%,#168ddd);box-shadow:0 0 14px rgba(103,66,255,.38),0 0 12px rgba(39,199,255,.18) inset}.dxf-progress-ref-tabs a.is-active i{color:#fff}
.dxf-progress-ref-section{display:grid;gap:8px;padding:10px 11px;border:1px solid rgba(100,55,235,.76);border-radius:13px;background:linear-gradient(135deg,rgba(8,18,47,.98),rgba(8,14,37,.98));box-shadow:0 0 0 1px rgba(22,124,255,.08) inset}
.dxf-progress-ref-section>header{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:8px}.dxf-progress-ref-section>header>div{min-width:0}.dxf-progress-ref-section>header h2{margin:0;display:flex;align-items:center;gap:7px;color:#fff;font-size:1.18rem;line-height:1;font-weight:1000;letter-spacing:.005em}.dxf-progress-ref-section>header h2 i{color:#f26cf4;font-size:.91rem;filter:drop-shadow(0 0 7px rgba(242,90,255,.32))}.dxf-progress-ref-section>header p{margin:4px 0 0;color:#c4d0f8;font-size:.58rem;line-height:1.18;font-weight:650}.dxf-progress-ref-section>header>b{display:flex;align-items:center;gap:5px;color:#e0d5ff;font-size:.55rem;line-height:1;font-weight:850;white-space:nowrap}.dxf-progress-ref-section>header>b i{font-size:.63rem;color:#e7c1ff}
.dxf-progress-ref-today{min-height:188px}
.dxf-progress-ref-today-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(105px,.76fr);gap:8px;align-items:stretch}
.dxf-progress-ref-task-list{display:grid;grid-template-rows:repeat(3,1fr);gap:6px;min-width:0}
.dxf-progress-ref-task{display:grid;grid-template-columns:34px minmax(0,1fr) auto 22px;gap:7px;align-items:center;min-height:39px;padding:6px 8px;border:1px solid rgba(67,113,183,.58);border-radius:9px;background:linear-gradient(100deg,rgba(7,23,49,.94),rgba(7,17,42,.94));box-shadow:0 0 0 1px rgba(25,120,198,.06) inset}
.dxf-progress-ref-task-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:8px;color:#dbe5ff;font-size:1rem;background:radial-gradient(circle at 50% 50%,rgba(85,64,255,.22),rgba(12,25,55,.32));overflow:hidden}.dxf-progress-ref-task-icon img{width:100%;height:100%;object-fit:contain}.dxf-progress-ref-task-icon i{filter:drop-shadow(0 0 7px rgba(105,119,255,.44))}
.dxf-progress-ref-task-copy{min-width:0;display:grid;gap:2px}.dxf-progress-ref-task-copy strong{color:#fff;font-size:.69rem;line-height:1.04;font-weight:950;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dxf-progress-ref-task-copy small{color:#a8c3ef;font-size:.49rem;line-height:1.08;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dxf-progress-ref-task>b{color:#65f3dd;font-size:.75rem;line-height:1;font-weight:1000;white-space:nowrap}.dxf-progress-ref-task>i{color:#7890c6;font-size:1rem}.dxf-progress-ref-task.is-complete>i{color:#53f6a8;filter:drop-shadow(0 0 6px rgba(65,255,172,.4))}
.dxf-progress-ref-daily-reward{display:grid;grid-template-rows:minmax(0,1fr) auto auto;align-items:end;justify-items:center;gap:5px;min-width:0;padding:5px 6px 6px;border:1px solid rgba(94,77,190,.62);border-radius:10px;background:radial-gradient(circle at 50% 24%,rgba(171,66,255,.22),rgba(15,16,49,.84) 64%,rgba(8,15,35,.95));text-align:center}
.dxf-progress-ref-daily-art{width:100%;min-height:72px;display:grid;place-items:center}.dxf-progress-ref-daily-art-img{width:100%;height:82px;display:grid;place-items:center}.dxf-progress-ref-daily-art-img img{max-width:100%;max-height:82px;object-fit:contain;filter:drop-shadow(0 0 10px rgba(245,98,255,.38))}.dxf-progress-ref-daily-art-img:empty:before{content:""}
.dxf-progress-ref-daily-reward>strong{color:#ffe178;font-size:.59rem;line-height:1.05;font-weight:1000}.dxf-progress-ref-daily-reward form{width:100%;margin:0}.dxf-progress-ref-daily-reward button,.dxf-progress-ref-daily-reward>a{width:100%;min-height:28px;display:flex;align-items:center;justify-content:center;gap:5px;padding:0 6px;border:0;border-radius:8px;background:linear-gradient(180deg,#ffe966,#ffb313);color:#2f1a00;font-size:.51rem;line-height:1;font-weight:1000;box-shadow:0 0 12px rgba(255,196,38,.46);text-decoration:none}.dxf-progress-ref-daily-reward>a{background:linear-gradient(180deg,#bd5cff,#813cff);color:#fff;box-shadow:0 0 10px rgba(171,67,255,.34)}.dxf-progress-ref-reward-done{display:flex;align-items:center;gap:4px;color:#7bf4b6;font-size:.49rem;font-weight:850}
.dxf-progress-ref-week{min-height:188px}
.dxf-progress-ref-week-score{display:flex;align-items:center;justify-content:space-between;gap:8px}.dxf-progress-ref-week-score strong{color:#fff;font-size:1.33rem;line-height:1;font-weight:1000}.dxf-progress-ref-week-score>b{color:#c7d2ff;font-size:.57rem;line-height:1;font-weight:850}
.dxf-progress-ref-week-bar{height:9px;border:1px solid rgba(87,80,222,.72);border-radius:999px;background:#11163d;overflow:hidden;box-shadow:0 0 8px rgba(123,71,255,.18) inset}.dxf-progress-ref-week-bar span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#b55aff,#b758ff 38%,#4cd6ff 70%,#703be3);box-shadow:0 0 9px rgba(73,218,255,.28)}
.dxf-progress-ref-week-track{position:relative;height:9px;margin:10px 7px 0;border-radius:999px;background:linear-gradient(90deg,#e93bed 0 58%,#32416e 58% 100%)}.dxf-progress-ref-week-track span{display:block;height:100%;max-width:100%;border-radius:inherit;background:linear-gradient(90deg,#ef3ceb,#9f47ff)}
.dxf-progress-ref-rewards{position:relative;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;padding-top:3px}.dxf-progress-ref-rewards article{position:relative;display:grid;grid-template-rows:34px auto auto;justify-items:center;gap:2px;min-width:0;padding:6px 3px 5px;border:1px solid rgba(75,104,170,.55);border-radius:8px;background:rgba(6,19,46,.9);text-align:center}.dxf-progress-ref-rewards article.is-current{border-color:rgba(255,75,232,.8);box-shadow:0 0 11px rgba(248,71,225,.25)}.dxf-progress-ref-rewards article.is-earned{border-color:rgba(50,214,166,.56)}.dxf-progress-ref-reward-state{position:absolute;left:50%;top:-15px;transform:translateX(-50%);width:22px;height:22px;display:grid;place-items:center;border-radius:50%;border:2px solid #33446d;background:#101839;color:#95a5d4;font-size:.5rem;z-index:3}.dxf-progress-ref-rewards article.is-earned .dxf-progress-ref-reward-state{background:#1ac584;border-color:#5effbd;color:#fff;box-shadow:0 0 8px rgba(47,255,176,.35)}.dxf-progress-ref-rewards article.is-current .dxf-progress-ref-reward-state{width:28px;height:28px;top:-18px;background:#6b2f88;border-color:#ffdb58;color:#ffd95c;font-size:.7rem;box-shadow:0 0 11px rgba(255,77,227,.48)}
.dxf-progress-ref-reward-art{width:100%;height:34px;display:grid;place-items:center;border-radius:6px;background:rgba(10,24,55,.72);overflow:hidden}.dxf-progress-ref-reward-art img{width:100%;height:100%;object-fit:contain}.dxf-progress-ref-reward-art>i{color:#e990ff;font-size:.95rem;filter:drop-shadow(0 0 6px rgba(223,100,255,.3))}.dxf-progress-ref-rewards article>strong{color:#fff;font-size:.56rem;line-height:1;font-weight:950;white-space:nowrap}.dxf-progress-ref-rewards article>small{color:#c3cff5;font-size:.41rem;line-height:1.05;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.dxf-progress-ref-rewards article.is-current>small{color:#ff9df3}.dxf-progress-ref-rewards article.is-earned>small{color:#9ff3d4}
.dxf-progress-ref-goals{min-height:184px;gap:7px}
.dxf-progress-ref-goals>header{align-items:center}.dxf-progress-ref-goals>header>b{color:#bfd0ff}
.dxf-progress-ref-goal{display:grid;grid-template-columns:48px minmax(0,1fr) minmax(82px,104px) 9px;align-items:center;gap:8px;min-height:47px;padding:5px 7px;border:1px solid rgba(68,112,179,.58);border-radius:10px;background:linear-gradient(100deg,rgba(7,22,49,.94),rgba(7,16,40,.94));color:#fff}
.dxf-progress-ref-goal-art{width:48px;height:40px;display:grid;place-items:center;border-radius:8px;background:radial-gradient(circle at 50% 40%,rgba(76,89,255,.2),rgba(10,23,52,.48));overflow:hidden}.dxf-progress-ref-goal-art img,.dxf-progress-ref-goal-art .avatar-display,.dxf-progress-ref-goal-art .avatar-display-shell{width:100%;height:100%;object-fit:contain}.dxf-progress-ref-goal-art i{color:#f5a9ff;font-size:1.05rem}.dxf-progress-ref-goal-copy{min-width:0;display:grid;gap:2px}.dxf-progress-ref-goal-copy strong{color:#fff;font-size:.64rem;line-height:1.08;font-weight:950}.dxf-progress-ref-goal-copy small{color:#a8c3ef;font-size:.47rem;line-height:1.08;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dxf-progress-ref-goal-progress{display:grid;gap:4px;min-width:0}.dxf-progress-ref-goal-progress>b{color:#eef1ff;font-size:.56rem;line-height:1;text-align:right}.dxf-progress-ref-goal-progress>span{height:5px;border-radius:999px;background:#10193a;border:1px solid rgba(78,101,167,.64);overflow:hidden}.dxf-progress-ref-goal-progress>span i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#e84adb,#bd4dff 55%,#5ed8ff)}.dxf-progress-ref-goal>i{color:#e7ecff;font-size:.55rem}
.dxf-progress-ref-streak{grid-template-columns:48px minmax(0,1fr) auto 14px}.dxf-progress-ref-weekdays{display:grid;grid-template-columns:repeat(7,18px);gap:2px;justify-content:end}.dxf-progress-ref-weekdays>span{display:grid;justify-items:center;gap:2px;color:#8292c0}.dxf-progress-ref-weekdays>span i{width:16px;height:16px;display:grid;place-items:center;border-radius:50%;font-size:.37rem}.dxf-progress-ref-weekdays>span.is-active i{background:linear-gradient(180deg,#f35edf,#bd4cff);color:#fff;box-shadow:0 0 7px rgba(244,73,222,.35)}.dxf-progress-ref-weekdays>span small{font-size:.37rem;line-height:1;color:#aebce7}.dxf-progress-ref-streak>i{color:#ffbf3e;font-size:.82rem;filter:drop-shadow(0 0 6px rgba(255,178,30,.3))}
@media(min-width:701px){.dxf-progress-ref-top{grid-template-columns:minmax(0,1fr) 380px;min-height:116px;padding:14px}.dxf-progress-ref-title h1{font-size:3.7rem}.dxf-progress-ref-title p{font-size:1rem}.dxf-progress-ref-level{min-height:94px;grid-template-columns:72px minmax(0,.7fr) minmax(0,1.2fr) 20px;padding:14px 18px;border-radius:22px}.dxf-progress-ref-level-art{width:72px;height:72px;font-size:2rem}.dxf-progress-ref-level-copy small{font-size:1rem}.dxf-progress-ref-level-copy strong{font-size:2.7rem}.dxf-progress-ref-level-xp>b{font-size:.98rem}.dxf-progress-ref-level-xp>span{height:10px}.dxf-progress-ref-tabs{gap:16px}.dxf-progress-ref-tabs a{min-height:64px;border-radius:16px;font-size:1.12rem}.dxf-progress-ref-tabs a i{font-size:1.25rem}.dxf-progress-ref-section{padding:22px 24px;border-radius:24px;gap:14px}.dxf-progress-ref-section>header h2{font-size:2rem}.dxf-progress-ref-section>header p{font-size:1rem}.dxf-progress-ref-section>header>b{font-size:.95rem}.dxf-progress-ref-today-grid{grid-template-columns:minmax(0,1.7fr) minmax(250px,.8fr);gap:18px}.dxf-progress-ref-task{min-height:82px;grid-template-columns:66px minmax(0,1fr) auto 46px;padding:10px 16px;border-radius:16px}.dxf-progress-ref-task-icon{width:60px;height:60px}.dxf-progress-ref-task-copy strong{font-size:1.2rem}.dxf-progress-ref-task-copy small{font-size:.93rem}.dxf-progress-ref-task>b{font-size:1.35rem}.dxf-progress-ref-task>i{font-size:2rem}.dxf-progress-ref-daily-art{min-height:220px}.dxf-progress-ref-daily-art-img{height:240px}.dxf-progress-ref-daily-art-img img{max-height:240px}.dxf-progress-ref-daily-reward>strong{font-size:1.05rem}.dxf-progress-ref-daily-reward button,.dxf-progress-ref-daily-reward>a{min-height:58px;font-size:1rem}.dxf-progress-ref-week-score strong{font-size:2rem}.dxf-progress-ref-week-score>b{font-size:1rem}.dxf-progress-ref-week-bar{height:18px}.dxf-progress-ref-week-track{height:12px;margin-top:24px}.dxf-progress-ref-rewards{gap:14px}.dxf-progress-ref-rewards article{grid-template-rows:100px auto auto;padding:12px 8px;border-radius:15px}.dxf-progress-ref-reward-state{width:42px;height:42px;top:-27px;font-size:.95rem}.dxf-progress-ref-rewards article.is-current .dxf-progress-ref-reward-state{width:54px;height:54px;top:-33px;font-size:1.15rem}.dxf-progress-ref-reward-art{height:100px}.dxf-progress-ref-reward-art>i{font-size:2rem}.dxf-progress-ref-rewards article>strong{font-size:1.05rem}.dxf-progress-ref-rewards article>small{font-size:.82rem}.dxf-progress-ref-goal{grid-template-columns:110px minmax(0,1fr) 220px 20px;min-height:94px;padding:10px 14px;border-radius:17px}.dxf-progress-ref-goal-art{width:100px;height:78px}.dxf-progress-ref-goal-copy strong{font-size:1.15rem}.dxf-progress-ref-goal-copy small{font-size:.9rem}.dxf-progress-ref-goal-progress>b{font-size:1rem}.dxf-progress-ref-goal-progress>span{height:10px}.dxf-progress-ref-streak{grid-template-columns:110px minmax(0,1fr) auto 30px}.dxf-progress-ref-weekdays{grid-template-columns:repeat(7,36px);gap:6px}.dxf-progress-ref-weekdays>span i{width:30px;height:30px;font-size:.72rem}.dxf-progress-ref-weekdays>span small{font-size:.68rem}}

.profile-ref-page{width:min(100%,1280px);margin:0 auto;display:grid;gap:14px;padding:0 0 20px}.profile-ref-hero{position:relative;isolation:isolate;min-height:430px;overflow:hidden;border:1px solid rgba(73,157,255,.58);border-radius:28px;background:radial-gradient(circle at 23% 35%,rgba(103,48,255,.34),transparent 33%),radial-gradient(circle at 76% 18%,rgba(0,204,255,.17),transparent 30%),linear-gradient(135deg,#061125,#081a3a 58%,#071632);box-shadow:0 0 0 1px rgba(211,48,255,.2) inset,0 18px 48px rgba(0,0,0,.28),0 0 28px rgba(35,125,255,.12)}.profile-ref-hero:after{content:"DX FAMILY";position:absolute;right:3%;top:28%;z-index:-1;color:rgba(131,96,255,.11);font-size:clamp(4rem,10vw,8rem);font-weight:1000;line-height:.78;transform:rotate(-9deg);letter-spacing:-.08em}.profile-ref-hero-bg,.profile-ref-panel-bg,.profile-ref-rank-bg{position:absolute!important;inset:0!important;z-index:-2!important;width:100%!important;height:100%!important;overflow:hidden!important;border-radius:inherit!important}.profile-ref-hero-bg img,.profile-ref-panel-bg img,.profile-ref-rank-bg img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important}.profile-ref-hero-bg:after,.profile-ref-panel-bg:after,.profile-ref-rank-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,9,28,.08),rgba(3,11,31,.62) 48%,rgba(3,11,31,.88))}.profile-ref-hero-avatar{position:absolute;left:0;bottom:-1px;z-index:1;width:48%;height:100%;display:flex;align-items:flex-end;justify-content:center;overflow:hidden;pointer-events:none}.profile-ref-main-avatar-shell,.profile-ref-main-avatar{position:relative;display:block;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important}.profile-ref-main-avatar-shell>img.profile-ref-main-avatar,.profile-ref-main-avatar-shell>video.profile-ref-main-avatar,.profile-ref-hero-avatar>img.profile-ref-main-avatar{width:100%!important;height:100%!important;object-fit:contain!important;object-position:center bottom!important;transform:scale(1.1) translateY(4%);transform-origin:center bottom}.profile-ref-main-avatar-shell .avatar-decoration-layer{transform-origin:center bottom}.profile-ref-hero-copy{position:relative;z-index:3;display:grid;align-content:center;justify-items:start;gap:10px;min-height:430px;padding:70px 170px 56px 46%}.profile-ref-status{display:inline-flex;align-items:center;gap:8px;color:#cad8ff;font-size:.92rem;font-weight:850}.profile-ref-status i{width:11px;height:11px;border-radius:50%;background:#20efac;box-shadow:0 0 14px rgba(32,239,172,.95)}.profile-ref-hero-copy h1{margin:0;color:#fff;font-size:clamp(2rem,4.2vw,3.5rem);line-height:.96;font-weight:1000;letter-spacing:-.025em;text-shadow:0 5px 20px rgba(0,0,0,.5)}.profile-ref-handle{margin:-5px 0 0;color:#a9bdf1;font-weight:850}.profile-ref-title-pill{display:inline-flex;align-items:center;gap:8px;max-width:100%;padding:8px 16px;border:1px solid rgba(233,49,255,.74);border-radius:999px;background:rgba(73,16,125,.43);box-shadow:0 0 22px rgba(226,46,255,.16);color:#fff;font-weight:950}.profile-ref-title-pill i{color:#ff5cff;text-shadow:0 0 14px rgba(255,83,255,.9)}.profile-ref-tagline{max-width:420px;margin:0;color:#b7c9f3;font-size:1rem;line-height:1.35;font-weight:750}.profile-ref-level-row{display:grid;grid-template-columns:88px minmax(180px,320px);gap:14px;align-items:center;margin-top:7px}.profile-ref-level-orb{width:88px;height:88px;display:grid;place-items:center;align-content:center;border-radius:50%;border:6px solid #32dfff;background:radial-gradient(circle,#082948 48%,#061227 50%);box-shadow:0 0 0 6px rgba(137,60,255,.45),0 0 26px rgba(38,224,255,.48)}.profile-ref-level-orb small{color:#4cf5ff;font-weight:1000;line-height:1}.profile-ref-level-orb b{font-size:2rem;line-height:1;color:#fff}.profile-ref-level-copy{display:grid;gap:6px}.profile-ref-level-copy small{color:#bcd0ff;font-size:.87rem;font-weight:900}.profile-ref-level-copy>i{display:block;height:12px;overflow:hidden;border:2px solid rgba(127,136,255,.8);border-radius:999px;background:#040b22}.profile-ref-level-copy>i u{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#4368ff,#43e9f4);box-shadow:0 0 15px rgba(75,223,255,.6)}.profile-ref-level-copy>b{justify-self:end;color:#fff;font-size:.82rem}.profile-ref-hero-actions{position:absolute;right:22px;top:22px;z-index:5;display:grid;gap:8px;justify-items:end}.profile-ref-edit-button,.profile-ref-secondary-button{min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 18px;border-radius:16px;text-decoration:none!important;color:#fff;font-weight:950;border:1px solid rgba(115,158,255,.7);background:rgba(7,20,50,.78);box-shadow:0 0 0 1px rgba(255,255,255,.06) inset,0 0 22px rgba(63,128,255,.12)}.profile-ref-edit-button:hover,.profile-ref-secondary-button:hover{color:#fff;border-color:#ef4cff;box-shadow:0 0 24px rgba(239,76,255,.28)}.profile-ref-secondary-button{font-size:.76rem;min-height:38px}.profile-ref-level-badge{position:absolute;right:26px;bottom:26px;z-index:4;width:110px;height:108px;display:grid;place-items:center;align-content:center;gap:2px;border-radius:18px;background:rgba(5,20,52,.82);border:1px solid rgba(77,150,255,.55);box-shadow:0 0 22px rgba(49,132,255,.15);text-align:center}.profile-ref-level-badge>i{font-size:2.2rem;color:#64cfff;text-shadow:0 0 18px rgba(75,203,255,.7)}.profile-ref-level-badge small{color:#a8c8ff;font-size:.63rem;font-weight:850}.profile-ref-level-badge b{font-size:.76rem}.profile-ref-shell.profile-v2{width:100%!important;max-width:none!important;display:grid!important;gap:14px!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important}.profile-ref-panel{position:relative;isolation:isolate;overflow:hidden;display:grid;gap:12px;padding:18px;border:1px solid rgba(74,132,255,.5);border-radius:24px;background:linear-gradient(145deg,rgba(5,18,46,.98),rgba(4,16,41,.96));box-shadow:0 0 0 1px rgba(213,46,255,.12) inset,0 16px 38px rgba(0,0,0,.2)}.profile-ref-panel-bg{opacity:.38}.profile-ref-panel-bg:after{background:linear-gradient(180deg,rgba(4,13,36,.25),rgba(4,13,36,.82))}.profile-ref-section-head{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:12px}.profile-ref-section-head>div{min-width:0;display:flex;align-items:center;gap:11px}.profile-ref-section-head>div>span{flex:0 0 auto;width:40px;height:40px;display:grid;place-items:center;border-radius:13px;background:linear-gradient(135deg,rgba(84,78,255,.3),rgba(34,197,255,.12));color:#bdb7ff;font-size:1.25rem;text-shadow:0 0 15px rgba(115,84,255,.8)}.profile-ref-section-head>div>span.gold{color:#ffd85a;background:linear-gradient(135deg,rgba(255,177,28,.26),rgba(97,37,255,.12))}.profile-ref-section-head>div>span.pink{color:#ff65e6;background:linear-gradient(135deg,rgba(255,57,207,.24),rgba(78,66,255,.12))}.profile-ref-section-head>div>span.violet{color:#d99aff}.profile-ref-section-head p{min-width:0;display:grid;gap:2px;margin:0}.profile-ref-section-head p>b{color:#fff;font-size:1.35rem;line-height:1}.profile-ref-section-head p>small{color:#9fb6e9;font-size:.76rem;font-weight:750}.profile-ref-section-head>a{flex:0 0 auto;min-height:36px;display:inline-flex;align-items:center;gap:7px;padding:0 14px;border-radius:14px;border:1px solid rgba(157,91,255,.55);background:rgba(11,24,55,.75);color:#fff!important;text-decoration:none!important;font-size:.72rem;font-weight:900}.profile-ref-stat-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.profile-ref-stat-grid article{position:relative;min-width:0;min-height:108px;display:grid;grid-template-columns:42px minmax(0,1fr);gap:8px;align-items:center;padding:12px;border-radius:17px;border:1px solid rgba(84,154,255,.42);background:linear-gradient(150deg,rgba(10,29,65,.95),rgba(6,18,44,.94));overflow:hidden}.profile-ref-stat-grid article:after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:linear-gradient(90deg,#2fd7ff,#5e61ff)}.profile-ref-stat-grid article.is-violet:after{background:linear-gradient(90deg,#765cff,#e34cff)}.profile-ref-stat-grid article.is-pink:after{background:linear-gradient(90deg,#ff3fd8,#c74fff)}.profile-ref-stat-grid article.is-gold:after{background:linear-gradient(90deg,#ffad2f,#ffe26a)}.profile-ref-stat-grid article>i{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:rgba(83,130,255,.18);color:#a5dfff;font-size:1.3rem}.profile-ref-stat-grid article p{min-width:0;display:grid;gap:2px;margin:0}.profile-ref-stat-grid article p>b{font-size:1.05rem;white-space:nowrap}.profile-ref-stat-grid article p>b small{color:#9bb2df;font-size:.7rem}.profile-ref-stat-grid article p>span{color:#b8c8ea;font-size:.67rem;font-weight:800}.profile-ref-stat-grid article>em{position:absolute;right:10px;bottom:11px;color:#9bb1df;font-size:.63rem;font-style:normal;font-weight:900}.profile-ref-collection-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.08fr .92fr;gap:10px}.profile-ref-rarity-card,.profile-ref-collection-progress{min-width:0;min-height:145px;border-radius:18px;border:1px solid rgba(72,139,255,.36);background:rgba(4,17,42,.8)}.profile-ref-rarity-card{padding:13px}.profile-ref-rarity-card h3{margin:0 0 10px;font-size:.84rem}.profile-ref-rarity-card>div{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.profile-ref-rarity-card span{display:grid;place-items:center;gap:3px;min-height:92px;padding:7px 4px;border-radius:12px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.09);text-align:center}.profile-ref-rarity-card span>i{font-size:1.32rem;color:#d9e3ff}.profile-ref-rarity-card span.rare>i{color:#27d9ff}.profile-ref-rarity-card span.epic>i{color:#e257ff}.profile-ref-rarity-card span.legend>i{color:#ffbd35}.profile-ref-rarity-card span>b{font-size:.86rem}.profile-ref-rarity-card span>small{color:#a9bbe3;font-size:.57rem;font-weight:800}.profile-ref-collection-progress{position:relative;overflow:hidden;display:grid;grid-template-columns:76px minmax(0,1fr) 16px;gap:10px;align-items:center;padding:12px;color:#fff!important;text-decoration:none!important}.profile-ref-collection-progress>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.2}.profile-ref-collection-progress:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,12,34,.93),rgba(4,20,48,.82))}.profile-ref-ring,.profile-ref-collection-progress>p,.profile-ref-collection-progress>i{position:relative;z-index:1}.profile-ref-ring{width:72px;height:72px;display:grid;place-items:center;border-radius:50%;background:conic-gradient(#e74fff calc(var(--profile-progress)*1%),#17244f 0);box-shadow:0 0 18px rgba(227,77,255,.3)}.profile-ref-ring:after{content:"";position:absolute;width:55px;height:55px;border-radius:50%;background:#07152f}.profile-ref-ring b{position:relative;z-index:1;font-size:1rem}.profile-ref-collection-progress>p{display:grid;gap:3px;margin:0}.profile-ref-collection-progress>p small{color:#9fb4e5;font-size:.6rem}.profile-ref-collection-progress>p b{font-size:1rem}.profile-ref-collection-progress>p span{color:#9db5e5;font-size:.68rem}.profile-ref-showcase-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}.profile-ref-avatar-showcase,.profile-ref-showcase-card,.profile-ref-album-showcase{min-width:0;min-height:200px;border-radius:16px;background:linear-gradient(160deg,rgba(30,28,87,.84),rgba(7,19,47,.96));border:1px solid rgba(132,74,255,.48);box-shadow:0 0 20px rgba(77,102,255,.11);overflow:hidden}.profile-ref-avatar-showcase{display:grid;grid-template-rows:1fr auto auto;align-items:end;padding:8px;text-align:center}.profile-ref-avatar-showcase>div{height:145px;display:flex;align-items:flex-end;justify-content:center;overflow:hidden;border-radius:12px;background:radial-gradient(circle at 50% 60%,rgba(217,61,255,.35),transparent 55%)}.profile-ref-showcase-avatar,.profile-ref-showcase-avatar-shell{width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;object-fit:contain!important}.profile-ref-showcase-avatar-shell>img,.profile-ref-showcase-avatar-shell>video{width:100%!important;height:100%!important;object-fit:contain!important;object-position:center bottom!important}.profile-ref-avatar-showcase>b,.profile-ref-album-showcase>b{margin-top:6px;font-size:.72rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-ref-avatar-showcase>small,.profile-ref-album-showcase>small{color:#9eb5e5;font-size:.56rem}.profile-ref-avatar-showcase>small i{color:#ff58d8}.profile-ref-showcase-card{display:grid;place-items:center;padding:6px}.profile-ref-showcase-frame.dxf-card-frame{width:100%!important;max-width:150px!important}.profile-ref-album-showcase{display:grid;grid-template-rows:1fr auto auto;align-items:end;padding:8px;color:#fff!important;text-decoration:none!important;text-align:center}.profile-ref-album-showcase>img{width:100%;height:145px;object-fit:cover;border-radius:12px}.profile-ref-album-showcase>i{height:145px;display:grid;place-items:center;color:#62e0ff;font-size:3rem}.profile-ref-almost{padding-bottom:14px}.profile-ref-almost-content{position:relative;z-index:1;display:grid;grid-template-columns:110px minmax(0,1fr) 150px;gap:13px;align-items:center;color:#fff!important;text-decoration:none!important}.profile-ref-missing-card{height:105px;display:grid;place-items:center;overflow:hidden;border:1px solid rgba(75,186,255,.45);border-radius:14px;background:rgba(6,27,61,.82)}.profile-ref-missing-card img{width:100%;height:100%;object-fit:cover}.profile-ref-missing-card>i{font-size:2.2rem;color:#8ddcff}.profile-ref-almost-content>p{display:grid;gap:5px;margin:0}.profile-ref-almost-content>p>b{font-size:1rem}.profile-ref-almost-content>p>strong{font-size:.82rem}.profile-ref-almost-content>p>i{display:block;height:10px;overflow:hidden;border:1px solid rgba(89,145,255,.55);border-radius:99px;background:#07132f}.profile-ref-almost-content>p>i u{display:block;height:100%;background:linear-gradient(90deg,#2ad8ff,#b43cff);box-shadow:0 0 12px rgba(47,210,255,.4)}.profile-ref-almost-content>p>small{color:#a6bbe8;font-size:.66rem}.profile-ref-reward{height:105px;display:grid;place-items:center;align-content:center;gap:3px;border-radius:14px;background:radial-gradient(circle at 50% 40%,rgba(59,123,255,.36),rgba(5,18,48,.92));border:1px solid rgba(75,160,255,.48);text-align:center}.profile-ref-reward>i{font-size:1.7rem;color:#74e1ff;text-shadow:0 0 18px rgba(86,215,255,.8)}.profile-ref-reward>b{font-size:1.1rem}.profile-ref-reward>small{font-size:.6rem;color:#b4c9ef}.profile-ref-style-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.profile-ref-style-grid article{display:grid;grid-template-columns:86px minmax(0,1fr);grid-template-rows:auto 1fr;gap:6px 10px;min-height:126px;padding:10px;border-radius:16px;border:1px solid rgba(84,142,255,.42);background:rgba(4,18,44,.84)}.profile-ref-style-grid article>small{grid-column:1/-1;color:#a9bce9;font-size:.64rem;font-weight:850}.profile-ref-style-grid article>span{width:86px;height:82px;display:grid;place-items:center;overflow:hidden;border-radius:12px;background:linear-gradient(135deg,rgba(171,55,255,.18),rgba(40,183,255,.13));border:1px solid rgba(142,80,255,.4)}.profile-ref-style-grid article>span img{width:100%;height:100%;object-fit:contain}.profile-ref-style-grid article>span i{font-size:2rem;color:#d879ff}.profile-ref-style-grid article>p{min-width:0;display:grid;align-content:center;gap:4px;margin:0}.profile-ref-style-grid article>p b{font-size:.72rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-ref-style-grid article>p em{font-size:.58rem;font-style:normal;color:#d564ff;font-weight:900}.profile-ref-community-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.profile-ref-community-card,.profile-ref-rank-card{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:58px minmax(0,1fr) auto;gap:10px;align-items:center;min-height:112px;padding:14px;border:1px solid rgba(76,142,255,.46);border-radius:20px;background:linear-gradient(145deg,rgba(5,22,52,.98),rgba(4,15,39,.96));box-shadow:0 12px 28px rgba(0,0,0,.18)}.profile-ref-community-card>span,.profile-ref-rank-card>span{width:58px;height:58px;display:grid;place-items:center;border-radius:16px;background:rgba(91,104,255,.15);color:#9bacff;font-size:1.7rem}.profile-ref-community-card>p,.profile-ref-rank-card>p{display:grid;gap:2px;margin:0}.profile-ref-community-card small,.profile-ref-rank-card small{color:#9eb6e9;font-size:.65rem}.profile-ref-community-card b,.profile-ref-rank-card b{font-size:1.45rem;line-height:1}.profile-ref-community-card em,.profile-ref-rank-card em{color:#9eb4e0;font-size:.62rem;font-style:normal}.profile-ref-community-card>a{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;color:#fff!important;background:rgba(255,255,255,.06)}.profile-ref-rank-card{border-color:rgba(175,67,255,.45)}.profile-ref-rank-card>p b{color:#eb62ff}.profile-ref-rank-card>i{font-size:2.3rem;color:#ffca47;text-shadow:0 0 20px rgba(255,192,49,.46)}.profile-ref-rank-bg{opacity:.24}.profile-ref-rank-bg:after{background:linear-gradient(90deg,rgba(5,17,46,.9),rgba(23,11,52,.62))}.profile-ref-edit-page{gap:14px}.profile-ref-hero.is-editing{min-height:380px}.profile-ref-hero.is-editing .profile-ref-hero-copy{min-height:380px}.profile-ref-edit-intro{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 16px;border:1px solid rgba(89,146,255,.44);border-radius:19px;background:linear-gradient(145deg,rgba(9,26,59,.96),rgba(17,13,52,.96))}.profile-ref-edit-intro>div:not(.profile-ref-panel-bg){position:relative;z-index:1;display:flex;align-items:center;gap:12px}.profile-ref-edit-intro>div>i{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:linear-gradient(135deg,#8e35ff,#f42bc9);color:#fff}.profile-ref-edit-intro>div>span{display:grid;gap:2px}.profile-ref-edit-intro b{font-size:.95rem}.profile-ref-edit-intro small{color:#9fb5e4;font-size:.7rem}.profile-ref-edit-intro>a{position:relative;z-index:1;display:inline-flex;align-items:center;gap:7px;color:#fff!important;font-size:.7rem;font-weight:900;text-decoration:none!important}.profile-ref-edit-shell.profile-edit-shell{width:100%!important;max-width:none!important;gap:12px!important;padding:0!important;background:none!important;border:0!important}.profile-ref-edit-section,.profile-ref-effects-wrap>.profile-edit-section{border:1px solid rgba(77,139,255,.45)!important;border-radius:20px!important;background:linear-gradient(145deg,rgba(6,22,52,.97),rgba(7,15,40,.97))!important;box-shadow:0 12px 30px rgba(0,0,0,.18)!important}.profile-ref-edit-section>summary,.profile-ref-effects-wrap>.profile-edit-section>summary{padding:16px!important;background:linear-gradient(90deg,rgba(77,72,255,.12),rgba(217,47,255,.08))!important}.profile-ref-edit-section>summary b,.profile-ref-effects-wrap>.profile-edit-section>summary b{font-size:1rem!important}.profile-summary-icon{width:34px;height:34px;display:grid!important;place-items:center;border-radius:11px;background:rgba(112,77,255,.17);color:#c693ff}.profile-ref-form{padding:14px!important}.profile-ref-form label{color:#dce7ff!important}.profile-ref-form input,.profile-ref-form textarea,.profile-ref-form select{border:1px solid rgba(84,142,255,.36)!important;background:rgba(4,16,41,.88)!important;color:#fff!important}.profile-ref-edit-section .profile-showcase-picker{padding:6px}.profile-ref-effects-wrap{display:grid}.profile-ref-effects-wrap>.profile-edit-section{margin:0}.profile-ref-shell .profile-action-grid{margin-top:0}.profile-ref-page .profile-action-grid{border:1px solid rgba(72,132,255,.35);border-radius:20px;overflow:hidden}.profile-ref-page .profile-share-card,.profile-ref-page .profile-message-card,.profile-ref-page .profile-action-card{background:rgba(5,18,46,.95)!important}
@media(max-width:900px){.profile-ref-hero{min-height:390px}.profile-ref-hero-copy{min-height:390px;padding:70px 132px 45px 43%}.profile-ref-hero-avatar{width:46%}.profile-ref-level-badge{right:18px;bottom:18px;width:96px;height:94px}.profile-ref-showcase-grid{gap:6px}.profile-ref-avatar-showcase,.profile-ref-showcase-card,.profile-ref-album-showcase{min-height:170px}.profile-ref-avatar-showcase>div,.profile-ref-album-showcase>img,.profile-ref-album-showcase>i{height:118px}.profile-ref-style-grid article{grid-template-columns:70px minmax(0,1fr)}.profile-ref-style-grid article>span{width:70px;height:70px}}
@media(max-width:720px){.profile-ref-page{gap:9px;padding:0 7px 14px}.profile-ref-hero{min-height:345px;border-radius:21px}.profile-ref-hero:after{font-size:3.6rem;right:-2%;top:34%}.profile-ref-hero-bg:after{background:linear-gradient(90deg,rgba(3,9,28,.06),rgba(3,11,31,.46) 42%,rgba(3,11,31,.9))}.profile-ref-hero-avatar{width:47%;height:95%}.profile-ref-main-avatar-shell>img.profile-ref-main-avatar,.profile-ref-main-avatar-shell>video.profile-ref-main-avatar,.profile-ref-hero-avatar>img.profile-ref-main-avatar{transform:scale(1.18) translateY(5%)}.profile-ref-hero-copy{min-height:345px;gap:6px;padding:64px 82px 30px 42%}.profile-ref-status{font-size:.65rem}.profile-ref-status i{width:8px;height:8px}.profile-ref-hero-copy h1{font-size:1.7rem}.profile-ref-title-pill{max-width:190px;padding:6px 10px;font-size:.65rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.profile-ref-tagline{max-width:210px;font-size:.66rem}.profile-ref-level-row{grid-template-columns:60px minmax(110px,180px);gap:8px;margin-top:4px}.profile-ref-level-orb{width:60px;height:60px;border-width:4px;box-shadow:0 0 0 4px rgba(137,60,255,.4),0 0 18px rgba(38,224,255,.4)}.profile-ref-level-orb small{font-size:.58rem}.profile-ref-level-orb b{font-size:1.35rem}.profile-ref-level-copy{gap:4px}.profile-ref-level-copy small{font-size:.58rem}.profile-ref-level-copy>i{height:8px}.profile-ref-level-copy>b{font-size:.55rem}.profile-ref-hero-actions{right:10px;top:10px}.profile-ref-edit-button,.profile-ref-secondary-button{min-height:34px;padding:0 10px;border-radius:12px;font-size:.58rem}.profile-ref-secondary-button{min-height:30px}.profile-ref-level-badge{right:10px;bottom:10px;width:68px;height:70px;border-radius:12px}.profile-ref-level-badge>i{font-size:1.45rem}.profile-ref-level-badge small{font-size:.44rem}.profile-ref-level-badge b{font-size:.5rem}.profile-ref-panel{gap:8px;padding:10px;border-radius:18px}.profile-ref-section-head{gap:6px}.profile-ref-section-head>div{gap:7px}.profile-ref-section-head>div>span{width:30px;height:30px;border-radius:10px;font-size:.9rem}.profile-ref-section-head p>b{font-size:.95rem}.profile-ref-section-head p>small{font-size:.55rem}.profile-ref-section-head>a{min-height:30px;padding:0 9px;border-radius:11px;font-size:.53rem}.profile-ref-stat-grid{gap:5px}.profile-ref-stat-grid article{min-height:83px;grid-template-columns:30px minmax(0,1fr);gap:4px;padding:7px;border-radius:12px}.profile-ref-stat-grid article>i{width:30px;height:30px;border-radius:9px;font-size:.92rem}.profile-ref-stat-grid article p>b{font-size:.72rem}.profile-ref-stat-grid article p>b small{font-size:.48rem}.profile-ref-stat-grid article p>span{font-size:.48rem}.profile-ref-stat-grid article>em{right:6px;bottom:7px;font-size:.45rem}.profile-ref-collection-grid{grid-template-columns:1.02fr .98fr;gap:6px}.profile-ref-rarity-card,.profile-ref-collection-progress{min-height:120px;border-radius:13px}.profile-ref-rarity-card{padding:8px}.profile-ref-rarity-card h3{margin-bottom:6px;font-size:.58rem}.profile-ref-rarity-card>div{gap:3px}.profile-ref-rarity-card span{min-height:76px;padding:4px 2px;border-radius:8px}.profile-ref-rarity-card span>i{font-size:.9rem}.profile-ref-rarity-card span>b{font-size:.62rem}.profile-ref-rarity-card span>small{font-size:.42rem}.profile-ref-collection-progress{grid-template-columns:50px minmax(0,1fr) 10px;gap:6px;padding:8px}.profile-ref-ring{width:48px;height:48px}.profile-ref-ring:after{width:37px;height:37px}.profile-ref-ring b{font-size:.7rem}.profile-ref-collection-progress>p small{font-size:.42rem}.profile-ref-collection-progress>p b{font-size:.67rem}.profile-ref-collection-progress>p span{font-size:.45rem}.profile-ref-showcase-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}.profile-ref-avatar-showcase,.profile-ref-showcase-card,.profile-ref-album-showcase{min-height:126px;border-radius:11px;padding:4px}.profile-ref-avatar-showcase>div,.profile-ref-album-showcase>img,.profile-ref-album-showcase>i{height:83px;border-radius:8px}.profile-ref-avatar-showcase>b,.profile-ref-album-showcase>b{margin-top:3px;font-size:.47rem}.profile-ref-avatar-showcase>small,.profile-ref-album-showcase>small{font-size:.39rem}.profile-ref-showcase-frame.dxf-card-frame{max-width:82px!important}.profile-ref-showcase-frame .dxf-card-frame-body{padding:4px 3px!important;border-radius:8px!important}.profile-ref-showcase-frame .dxf-card-stars{min-height:9px!important;font-size:.4rem!important}.profile-ref-showcase-frame strong{font-size:.39rem!important}.profile-ref-almost-content{grid-template-columns:76px minmax(0,1fr) 92px;gap:7px}.profile-ref-missing-card,.profile-ref-reward{height:76px;border-radius:10px}.profile-ref-almost-content>p{gap:3px}.profile-ref-almost-content>p>b{font-size:.66rem}.profile-ref-almost-content>p>strong{font-size:.55rem}.profile-ref-almost-content>p>i{height:7px}.profile-ref-almost-content>p>small{font-size:.46rem}.profile-ref-reward>i{font-size:1.1rem}.profile-ref-reward>b{font-size:.7rem}.profile-ref-reward>small{font-size:.42rem}.profile-ref-style-grid{gap:5px}.profile-ref-style-grid article{grid-template-columns:52px minmax(0,1fr);min-height:91px;gap:4px 6px;padding:6px;border-radius:11px}.profile-ref-style-grid article>small{font-size:.45rem}.profile-ref-style-grid article>span{width:52px;height:50px;border-radius:8px}.profile-ref-style-grid article>span i{font-size:1.2rem}.profile-ref-style-grid article>p b{font-size:.49rem}.profile-ref-style-grid article>p em{font-size:.42rem}.profile-ref-community-grid{gap:6px}.profile-ref-community-card,.profile-ref-rank-card{min-height:82px;grid-template-columns:39px minmax(0,1fr) auto;gap:6px;padding:8px;border-radius:14px}.profile-ref-community-card>span,.profile-ref-rank-card>span{width:39px;height:39px;border-radius:11px;font-size:1.05rem}.profile-ref-community-card small,.profile-ref-rank-card small{font-size:.44rem}.profile-ref-community-card b,.profile-ref-rank-card b{font-size:.88rem}.profile-ref-community-card em,.profile-ref-rank-card em{font-size:.42rem}.profile-ref-rank-card>i{font-size:1.35rem}.profile-ref-hero.is-editing,.profile-ref-hero.is-editing .profile-ref-hero-copy{min-height:330px}.profile-ref-edit-intro{padding:9px 10px;border-radius:14px}.profile-ref-edit-intro>div>i{width:32px;height:32px;border-radius:10px}.profile-ref-edit-intro b{font-size:.7rem}.profile-ref-edit-intro small{font-size:.5rem}.profile-ref-edit-intro>a{font-size:.5rem}.profile-ref-edit-section,.profile-ref-effects-wrap>.profile-edit-section{border-radius:15px!important}.profile-ref-edit-section>summary,.profile-ref-effects-wrap>.profile-edit-section>summary{padding:11px!important}.profile-ref-edit-section>summary b,.profile-ref-effects-wrap>.profile-edit-section>summary b{font-size:.75rem!important}.profile-summary-icon{width:28px;height:28px}.profile-ref-form{padding:9px!important}.profile-ref-form .form-grid.two-col{grid-template-columns:1fr!important}.profile-ref-edit-section .profile-showcase-picker{grid-template-columns:repeat(3,minmax(0,1fr))!important}.profile-ref-edit-section .profile-editor-frame.dxf-card-frame{width:100%!important}}
@media(max-width:420px){.profile-ref-hero-copy{padding-left:41%;padding-right:74px}.profile-ref-title-pill{max-width:155px}.profile-ref-tagline{max-width:170px}.profile-ref-level-row{grid-template-columns:54px minmax(95px,145px)}.profile-ref-level-orb{width:54px;height:54px}.profile-ref-level-badge{width:62px;height:64px}.profile-ref-section-head>a{padding:0 7px}.profile-ref-stat-grid article{min-height:76px;padding:6px}.profile-ref-stat-grid article>i{width:26px;height:26px;font-size:.8rem}.profile-ref-stat-grid article p>b{font-size:.62rem}.profile-ref-stat-grid article p>span{font-size:.42rem}.profile-ref-rarity-card span{min-height:68px}.profile-ref-showcase-grid{gap:3px}.profile-ref-avatar-showcase,.profile-ref-showcase-card,.profile-ref-album-showcase{min-height:116px}.profile-ref-avatar-showcase>div,.profile-ref-album-showcase>img,.profile-ref-album-showcase>i{height:75px}.profile-ref-showcase-frame.dxf-card-frame{max-width:74px!important}.profile-ref-style-grid article{grid-template-columns:44px minmax(0,1fr);padding:5px}.profile-ref-style-grid article>span{width:44px;height:44px}.profile-ref-community-card,.profile-ref-rank-card{grid-template-columns:34px minmax(0,1fr) auto}.profile-ref-community-card>span,.profile-ref-rank-card>span{width:34px;height:34px}}
.profile-ref-share-box{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:12px}.profile-ref-share-box input{min-width:0;border:1px solid rgba(84,142,255,.36)!important;background:rgba(4,16,41,.88)!important;color:#fff!important}@media(max-width:560px){.profile-ref-share-box{grid-template-columns:1fr}.profile-ref-share-box .primary-btn{width:100%}}


.profile-ref-hero-avatar{overflow:hidden!important}
.profile-ref-main-avatar-shell{overflow:hidden!important}
.profile-ref-main-avatar-shell>img.profile-ref-main-avatar,
.profile-ref-main-avatar-shell>video.profile-ref-main-avatar,
.profile-ref-hero-avatar>img.profile-ref-main-avatar{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:50% 20%!important;
    transform:none!important;
}
@media(max-width:720px){
    .profile-ref-main-avatar-shell>img.profile-ref-main-avatar,
    .profile-ref-main-avatar-shell>video.profile-ref-main-avatar,
    .profile-ref-hero-avatar>img.profile-ref-main-avatar{
        object-position:50% 18%!important;
    }
}


.home4-top-collectors {
    position: relative;
    isolation: isolate;
    width: 100%;
    aspect-ratio: 1820 / 864;
    overflow: hidden;
    color: #fff;
    border: 1px solid rgba(60, 134, 255, .54);
    border-radius: 24px;
    background: linear-gradient(145deg, #081c42, #050f26);
    box-shadow: 0 14px 34px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .04);
}

.home4-top-collectors-bg,
.home4-top-collectors-boxes {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
}

.home4-top-collectors-bg {
    z-index: 0;
}

.home4-top-collectors-boxes {
    z-index: 3;
}

.home4-top-collectors-bg img,
.home4-top-collectors-boxes img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center bottom;
    transform: translateY(11.5%);
    transform-origin: center bottom;
}

.home4-top-collectors-head {
    position: absolute;
    z-index: 6;
    top: 3.2%;
    right: 2.6%;
    left: 2.6%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-width: 0;
}

.home4-top-collectors-title {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    text-shadow: 0 2px 10px rgba(0, 0, 0, .85);
}

.home4-top-collectors-title > i {
    flex: 0 0 auto;
    color: #ffd34f;
    font-size: clamp(1rem, 2vw, 1.55rem);
    filter: drop-shadow(0 0 10px rgba(255, 197, 47, .55));
}

.home4-top-collectors-title > span {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.home4-top-collectors-title strong {
    display: block;
    max-width: min(54vw, 620px);
    overflow: hidden;
    color: #fff;
    font-size: clamp(.76rem, 1.55vw, 1.15rem);
    font-weight: 950;
    line-height: 1.05;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home4-top-collectors-title small {
    display: block;
    max-width: min(54vw, 620px);
    overflow: hidden;
    color: #eef4ff;
    font-size: clamp(.48rem, .9vw, .72rem);
    font-weight: 800;
    line-height: 1.1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home4-top-collectors-head > a {
    flex: 0 0 auto;
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 0 14px;
    color: #fff;
    border: 1px solid rgba(218, 93, 255, .9);
    border-radius: 999px;
    background: linear-gradient(135deg, rgba(111, 39, 188, .88), rgba(43, 24, 104, .94));
    box-shadow: 0 0 18px rgba(205, 47, 255, .28), inset 0 1px 0 rgba(255, 255, 255, .14);
    font-size: clamp(.5rem, .85vw, .7rem);
    font-weight: 900;
    text-decoration: none;
    text-shadow: 0 1px 5px rgba(0, 0, 0, .7);
}

.home4-top-collectors-avatars,
.home4-top-collectors-entries {
    position: absolute;
    inset: 0;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.home4-top-collectors-avatars {
    z-index: 2;
    pointer-events: none;
}

.home4-top-collector-avatar {
    position: relative;
    min-width: 0;
    height: 100%;
    overflow: hidden;
}

.home4-top-collector-avatar img,
.home4-top-collector-avatar video {
    position: absolute;
    top: 22%;
    left: 4%;
    width: 92%;
    height: 48%;
    display: block;
    object-fit: contain;
    object-position: center bottom;
    transform: scale(1.1);
    transform-origin: center bottom;
    filter: drop-shadow(0 12px 12px rgba(0, 0, 0, .52));
}

.home4-top-collector-avatar > b,
.home4-top-collector-avatar > i {
    position: absolute;
    top: 29%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: rgba(255, 255, 255, .6);
    font-size: clamp(1.8rem, 4vw, 4rem);
}

.home4-top-collector-avatar.is-empty {
    opacity: .42;
}

.home4-top-collectors-entries {
    z-index: 5;
}

.home4-top-collector-entry {
    position: relative;
    min-width: 0;
    height: 100%;
    color: #fff;
    text-decoration: none;
    outline: none;
}

.home4-top-collector-entry:focus-visible {
    box-shadow: inset 0 0 0 3px rgba(255, 255, 255, .8);
}

.home4-top-collector-info {
    position: absolute;
    top: 67.4%;
    right: 8%;
    left: 8%;
    height: 15.8%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3%;
    min-width: 0;
    text-align: center;
    text-shadow: 0 2px 6px rgba(0, 0, 0, .92), 0 0 10px rgba(0, 0, 0, .55);
}

.home4-top-collector-info b {
    display: block;
    width: 100%;
    overflow: hidden;
    color: #fff;
    font-size: clamp(.56rem, 1.28vw, .96rem);
    font-weight: 950;
    line-height: 1.02;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home4-top-collector-info small {
    display: inline-flex;
    align-items: flex-end;
    justify-content: center;
    gap: .2em;
    color: #f5f8ff;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
}

.home4-top-collector-info small .score {
    font-size: clamp(.78rem, 1.85vw, 1.42rem);
    font-weight: 1000;
    line-height: .92;
}

.home4-top-collector-info small .label {
    font-size: clamp(.44rem, .86vw, .68rem);
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: .01em;
    opacity: .96;
}

.home4-top-collector-entry.is-empty .home4-top-collector-info {
    opacity: .58;
}

.admin-top-collector-form small {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    font-size: .62rem;
}

.admin-top-collector-graphics {
    padding: 10px 12px;
    border: 1px solid rgba(91, 143, 255, .22);
    border-radius: 12px;
    background: rgba(9, 20, 48, .48);
}

.admin-top-collector-graphics small {
    margin: 0;
}

@media (max-width: 760px) {
    .home4-top-collectors {
        border-radius: 15px;
    }

    .home4-top-collectors-head {
        top: 3%;
        right: 2.2%;
        left: 2.2%;
        gap: 5px;
    }

    .home4-top-collectors-title {
        gap: 5px;
    }

    .home4-top-collectors-title > i {
        font-size: .82rem;
    }

    .home4-top-collectors-title strong {
        max-width: 205px;
        font-size: .64rem;
    }

    .home4-top-collectors-title small {
        max-width: 205px;
        font-size: .43rem;
    }

    .home4-top-collectors-head > a {
        min-height: 25px;
        gap: 4px;
        padding: 0 8px;
        font-size: .45rem;
    }

    .home4-top-collector-avatar img,
    .home4-top-collector-avatar video {
        top: 23.5%;
        left: 2%;
        width: 96%;
        height: 48%;
        transform: scale(1.12);
    }

    .home4-top-collector-info {
        top: 67.9%;
        right: 7%;
        left: 7%;
        height: 15.4%;
        gap: 2%;
    }

    .home4-top-collector-info b {
        font-size: .47rem;
    }

    .home4-top-collector-info small .score {
        font-size: .66rem;
    }

    .home4-top-collector-info small .label {
        font-size: .34rem;
    }
}

@media (max-width: 385px) {
    .home4-top-collectors-title strong,
    .home4-top-collectors-title small {
        max-width: 165px;
    }

    .home4-top-collectors-head > a {
        min-height: 23px;
        padding: 0 6px;
        font-size: .4rem;
    }

    .home4-top-collector-info b {
        font-size: .44rem;
    }

    .home4-top-collector-info small {
        font-size: .36rem;
    }
}

/* Home · Kick-Support Guthaben */
.home4-support-credit {
    position: relative;
    isolation: isolate;
    width: 100%;
    min-height: 132px;
    aspect-ratio: 1600 / 420;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    overflow: hidden;
    padding: 18px 20px;
    border: 1px solid rgba(88, 137, 255, .55);
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 78% 18%, rgba(47, 225, 255, .22), transparent 34%),
        radial-gradient(circle at 18% 100%, rgba(231, 55, 255, .18), transparent 38%),
        linear-gradient(135deg, #071635, #101444 58%, #071426);
    box-shadow: 0 14px 34px rgba(0, 0, 0, .27), inset 0 1px 0 rgba(255, 255, 255, .05);
}

.home4-support-credit.is-ready {
    border-color: rgba(70, 222, 255, .72);
    box-shadow: 0 14px 34px rgba(0, 0, 0, .27), 0 0 24px rgba(41, 203, 255, .11), inset 0 1px 0 rgba(255, 255, 255, .06);
}

.home4-support-credit-bg {
    position: absolute;
    z-index: 0;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
}

.home4-support-credit-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(3, 10, 31, .93) 0%, rgba(5, 13, 36, .72) 48%, rgba(5, 12, 32, .20) 100%);
}

.home4-support-credit-bg img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.home4-support-credit-copy,
.home4-support-credit-action {
    position: relative;
    z-index: 1;
}

.home4-support-credit-copy {
    min-width: 0;
    max-width: 760px;
    display: grid;
    gap: 5px;
    text-shadow: 0 2px 8px rgba(0, 0, 0, .82);
}

.home4-support-credit-copy > small {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #59eaff;
    font-size: clamp(.58rem, .9vw, .76rem);
    font-weight: 950;
    letter-spacing: .12em;
}

.home4-support-credit-copy > small i {
    color: #6eeaff;
    filter: drop-shadow(0 0 8px rgba(73, 222, 255, .65));
}

.home4-support-credit-copy h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(1.02rem, 2vw, 1.65rem);
    font-weight: 1000;
    line-height: 1.02;
}

.home4-support-credit-copy p {
    max-width: 650px;
    margin: 0;
    color: rgba(239, 246, 255, .82);
    font-size: clamp(.66rem, 1vw, .82rem);
    font-weight: 800;
    line-height: 1.25;
}

.home4-support-credit-action {
    min-width: 155px;
    display: grid;
    justify-items: end;
    gap: 9px;
}

.home4-support-credit-value {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #fff;
    text-shadow: 0 2px 8px rgba(0, 0, 0, .82);
}

.home4-support-credit-value > i {
    color: #51dfff;
    font-size: clamp(1rem, 1.6vw, 1.35rem);
    filter: drop-shadow(0 0 9px rgba(60, 219, 255, .7));
}

.home4-support-credit-value > b {
    font-size: clamp(1.35rem, 2.5vw, 2.05rem);
    font-weight: 1000;
    line-height: .9;
}

.home4-support-credit-value > small {
    align-self: flex-end;
    padding-bottom: 2px;
    color: rgba(228, 241, 255, .75);
    font-size: .62rem;
    font-weight: 900;
    text-transform: uppercase;
}

.home4-support-credit-action > button {
    min-height: 39px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 15px;
    border: 1px solid rgba(93, 224, 255, .74);
    border-radius: 13px;
    color: #fff;
    background: linear-gradient(135deg, #0fc9ff, #7652ff 58%, #dc35e9);
    box-shadow: 0 8px 22px rgba(44, 153, 255, .26), inset 0 1px 0 rgba(255, 255, 255, .28);
    font-size: .73rem;
    font-weight: 950;
    cursor: pointer;
}

.home4-support-credit-next {
    max-width: 190px;
    color: rgba(237, 245, 255, .82);
    font-size: .65rem;
    font-weight: 850;
    line-height: 1.2;
    text-align: right;
    text-shadow: 0 2px 7px rgba(0, 0, 0, .8);
}

.home4-support-modal-card {
    max-width: 430px;
    text-align: center;
    background:
        radial-gradient(circle at 50% 0, rgba(63, 220, 255, .22), transparent 34%),
        linear-gradient(155deg, #101a43, #120e35 58%, #07152e);
    border-color: rgba(74, 211, 255, .48);
}

.home4-support-modal-icon {
    width: 74px;
    height: 74px;
    margin: 0 auto 7px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(91, 226, 255, .65);
    border-radius: 24px;
    color: #64e5ff;
    background: radial-gradient(circle at 35% 25%, rgba(255, 255, 255, .26), transparent 20%), linear-gradient(145deg, rgba(30, 183, 255, .28), rgba(103, 59, 255, .25));
    box-shadow: 0 0 26px rgba(66, 211, 255, .24), inset 0 0 18px rgba(255, 255, 255, .07);
    font-size: 2rem;
}

.home4-support-modal-kicker {
    display: block;
    margin-bottom: 4px;
    color: #61e6ff;
    font-size: .62rem;
    font-weight: 950;
    letter-spacing: .14em;
}

.home4-support-modal-card h2 {
    margin: 0;
    color: #fff;
}

.home4-support-modal-card > p {
    margin: 7px auto 0;
    max-width: 340px;
}

.home4-support-modal-amount {
    margin: 14px auto 12px;
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 7px;
    color: #fff;
    text-shadow: 0 0 16px rgba(57, 214, 255, .28);
}

.home4-support-modal-amount strong {
    font-size: clamp(2.4rem, 8vw, 3.6rem);
    font-weight: 1000;
    line-height: .9;
}

.home4-support-modal-amount span {
    color: #68e5ff;
    font-size: .88rem;
    font-weight: 950;
}

.home4-support-modal-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
}

.home4-support-modal-stats > span {
    min-width: 0;
    display: grid;
    gap: 3px;
    padding: 9px 6px;
    border: 1px solid rgba(255, 255, 255, .09);
    border-radius: 12px;
    background: rgba(255, 255, 255, .055);
}

.home4-support-modal-stats small {
    color: rgba(226, 239, 255, .6);
    font-size: .53rem;
    font-weight: 850;
}

.home4-support-modal-stats b {
    overflow: hidden;
    color: #fff;
    font-size: .7rem;
    font-weight: 950;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home4-support-modal-rate {
    display: block;
    margin-top: 10px;
    color: rgba(226, 239, 255, .72);
    font-size: .62rem;
    font-weight: 850;
}

.home4-support-modal-card form {
    margin: 12px 0 0;
}

.home4-support-redeem-btn {
    width: 100%;
    min-height: 46px;
}

@media (max-width: 760px) {
    .home4-support-credit {
        min-height: 106px;
        aspect-ratio: auto;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 7px;
        padding: 11px 10px;
        border-radius: 15px;
    }

    .home4-support-credit-bg::after {
        background: linear-gradient(90deg, rgba(3, 10, 31, .94) 0%, rgba(5, 13, 36, .70) 58%, rgba(5, 12, 32, .28) 100%);
    }

    .home4-support-credit-copy {
        gap: 3px;
    }

    .home4-support-credit-copy > small {
        gap: 4px;
        font-size: .46rem;
        letter-spacing: .08em;
    }

    .home4-support-credit-copy h2 {
        max-width: 225px;
        font-size: .83rem;
        line-height: 1.04;
    }

    .home4-support-credit-copy p {
        max-width: 230px;
        font-size: .5rem;
        line-height: 1.18;
    }

    .home4-support-credit-action {
        min-width: 82px;
        gap: 6px;
    }

    .home4-support-credit-value {
        gap: 4px;
    }

    .home4-support-credit-value > i {
        font-size: .78rem;
    }

    .home4-support-credit-value > b {
        font-size: 1.08rem;
    }

    .home4-support-credit-value > small {
        display: none;
    }

    .home4-support-credit-action > button {
        min-height: 30px;
        gap: 4px;
        padding: 0 9px;
        border-radius: 9px;
        font-size: .54rem;
    }

    .home4-support-credit-next {
        max-width: 92px;
        font-size: .45rem;
        line-height: 1.15;
    }

    .home4-support-modal-card {
        width: min(92vw, 400px);
    }

    .home4-support-modal-icon {
        width: 62px;
        height: 62px;
        border-radius: 20px;
        font-size: 1.65rem;
    }

    .home4-support-modal-stats {
        gap: 5px;
    }

    .home4-support-modal-stats > span {
        padding: 8px 4px;
    }

    .home4-support-modal-stats small {
        font-size: .47rem;
    }

    .home4-support-modal-stats b {
        font-size: .62rem;
    }
}

@media (max-width: 385px) {
    .home4-support-credit-copy h2 {
        max-width: 205px;
        font-size: .76rem;
    }

    .home4-support-credit-copy p {
        max-width: 205px;
        font-size: .46rem;
    }

    .home4-support-credit-action {
        min-width: 76px;
    }

    .home4-support-credit-action > button {
        padding: 0 7px;
        font-size: .5rem;
    }
}

.home4-today-shows {
    width: 100%;
    display: grid;
    gap: 8px;
    padding: 10px;
    overflow: hidden;
    border: 1px solid rgba(89, 142, 255, .38);
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(7, 19, 52, .96), rgba(24, 12, 52, .96));
    box-shadow: 0 12px 30px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .04);
}

.home4-today-shows-head {
    min-height: 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.home4-today-shows-head > span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #fff;
    font-size: .66rem;
    font-weight: 1000;
    letter-spacing: .06em;
}

.home4-today-shows-head > span i {
    color: #ff42d0;
    filter: drop-shadow(0 0 8px rgba(255, 54, 211, .45));
}

.home4-today-shows-head > a {
    min-height: 27px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 9px;
    color: #dbe8ff;
    background: rgba(255, 255, 255, .06);
    font-size: .56rem;
    font-weight: 950;
    text-decoration: none;
}

.home4-today-show-track {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}

.home4-today-show-track::-webkit-scrollbar {
    display: none;
}

.home4-today-show-card {
    flex: 0 0 min(390px, 88%);
    min-height: 126px;
    display: grid;
    grid-template-columns: minmax(118px, 42%) minmax(0, 1fr);
    overflow: hidden;
    scroll-snap-align: start;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg, rgba(29, 18, 66, .98), rgba(7, 32, 67, .96));
    text-decoration: none;
    box-shadow: inset 0 0 0 1px rgba(255, 59, 203, .07);
}

.home4-today-show-card:only-child {
    flex-basis: 100%;
}

.home4-today-show-card.is-live {
    border-color: rgba(255, 58, 186, .52);
    box-shadow: 0 0 22px rgba(255, 46, 185, .12), inset 0 0 0 1px rgba(255, 255, 255, .05);
}

.home4-today-show-media {
    position: relative;
    min-height: 126px;
    display: grid;
    place-items: center;
    overflow: hidden;
    background: linear-gradient(145deg, rgba(217, 0, 255, .18), rgba(53, 212, 255, .16));
}

.home4-today-show-media > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home4-today-show-media > i {
    color: rgba(255, 255, 255, .82);
    font-size: 1.8rem;
}

.home4-today-show-media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 45%, rgba(3, 8, 23, .78));
    pointer-events: none;
}

.home4-today-show-time {
    position: absolute;
    z-index: 2;
    left: 7px;
    right: 7px;
    bottom: 7px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #fff;
    font-size: .58rem;
    font-weight: 950;
    text-shadow: 0 2px 6px #000;
}

.home4-today-show-time i {
    margin: 0;
}

.home4-today-show-media > em {
    position: absolute;
    z-index: 2;
    top: 7px;
    left: 7px;
    padding: 4px 7px;
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(90deg, #ff2aa8, #c539ff);
    box-shadow: 0 4px 14px rgba(255, 39, 169, .35);
    font-size: .5rem;
    font-style: normal;
    font-weight: 1000;
    letter-spacing: .08em;
}

.home4-today-show-copy {
    min-width: 0;
    display: grid;
    align-content: center;
    gap: 4px;
    padding: 10px 11px;
}

.home4-today-show-copy > small {
    color: #ff58d4;
    font-size: .48rem;
    font-weight: 1000;
    letter-spacing: .1em;
}

.home4-today-show-copy > strong {
    display: -webkit-box;
    overflow: hidden;
    color: #fff;
    font-size: .82rem;
    font-weight: 1000;
    line-height: 1.08;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.home4-today-show-copy > span {
    overflow: hidden;
    color: rgba(224, 236, 255, .72);
    font-size: .53rem;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home4-today-show-copy > u {
    margin-top: 3px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #6deaff;
    font-size: .54rem;
    font-weight: 950;
    text-decoration: none;
}

.home4-radio-promo {
    position: relative;
    min-height: 112px;
    display: block;
    overflow: hidden;
    border: 1px solid rgba(60, 208, 255, .3);
    border-radius: 14px;
    color: #fff;
    background: #071631;
    text-decoration: none;
}

.home4-radio-promo-media,
.home4-radio-promo-media img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.home4-radio-promo-media img {
    object-fit: cover;
}

.home4-radio-promo::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(3, 8, 27, .94) 0%, rgba(5, 12, 36, .76) 55%, rgba(5, 12, 36, .24) 100%);
}

.home4-radio-promo-overlay {
    position: relative;
    z-index: 2;
    max-width: 74%;
    min-height: 112px;
    display: grid;
    align-content: center;
    gap: 3px;
    padding: 12px;
}

.home4-radio-promo-overlay > small {
    color: #61e9ff;
    font-size: .48rem;
    font-weight: 1000;
    letter-spacing: .08em;
}

.home4-radio-promo-overlay > strong {
    font-size: .88rem;
    font-weight: 1000;
    line-height: 1.05;
}

.home4-radio-promo-overlay > span {
    color: rgba(229, 239, 255, .75);
    font-size: .53rem;
    font-weight: 800;
}

.home4-radio-promo-overlay > u {
    margin-top: 3px;
    color: #ff55d5;
    font-size: .53rem;
    font-weight: 950;
    text-decoration: none;
}

.home4-radio-promo > b {
    position: absolute;
    z-index: 3;
    top: 8px;
    right: 8px;
    padding: 4px 7px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 999px;
    color: #dbe8ff;
    background: rgba(8, 17, 43, .78);
    font-size: .47rem;
    font-weight: 1000;
    letter-spacing: .08em;
}

.home4-radio-promo > b.is-online {
    color: #fff;
    border-color: rgba(76, 236, 197, .38);
    background: rgba(21, 177, 132, .72);
}

body.route-stream .shows2-page {
    display: grid;
    gap: 12px;
}

body.route-stream .shows2-page .dxf-existing-page-hero {
    margin-bottom: 0;
}

body.route-stream .shows2-top-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(260px, .8fr);
    gap: 10px;
}

body.route-stream .shows2-radio-card,
body.route-stream .shows2-create-card {
    position: relative;
    min-height: 154px;
    overflow: hidden;
    border: 1px solid rgba(82, 145, 255, .35);
    border-radius: 18px;
    color: #fff;
    background: linear-gradient(145deg, #07183c, #17123f);
    text-decoration: none;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .24), inset 0 1px 0 rgba(255, 255, 255, .04);
}

body.route-stream .shows2-radio-card-bg {
    position: absolute;
    z-index: 0;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

body.route-stream .shows2-radio-card-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: .46;
}

body.route-stream .shows2-radio-card::after {
    content: "";
    position: absolute;
    z-index: 1;
    inset: 0;
    background: linear-gradient(90deg, rgba(4, 11, 34, .97) 0%, rgba(7, 15, 42, .84) 52%, rgba(7, 15, 42, .25) 100%);
    pointer-events: none;
}

body.route-stream .shows2-radio-art {
    position: absolute;
    z-index: 1;
    top: 0;
    right: 0;
    width: 48%;
    height: 100%;
    overflow: hidden;
}

body.route-stream .shows2-radio-art img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: .72;
    mask-image: linear-gradient(90deg, transparent 0%, #000 35%);
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 35%);
}

body.route-stream .shows2-radio-copy {
    position: relative;
    z-index: 3;
    width: 62%;
    min-height: 154px;
    display: grid;
    align-content: center;
    gap: 5px;
    padding: 18px;
}

body.route-stream .shows2-radio-copy > small {
    color: #64e8ff;
    font-size: .6rem;
    font-weight: 1000;
    letter-spacing: .1em;
}

body.route-stream .shows2-radio-copy > strong {
    font-size: 1.28rem;
    font-weight: 1000;
    line-height: 1.02;
}

body.route-stream .shows2-radio-copy > span {
    color: rgba(228, 238, 255, .78);
    font-size: .72rem;
    font-weight: 800;
}

body.route-stream .shows2-radio-copy > u {
    margin-top: 5px;
    color: #ff57d6;
    font-size: .68rem;
    font-weight: 1000;
    text-decoration: none;
}

body.route-stream .shows2-radio-card > b {
    position: absolute;
    z-index: 4;
    top: 11px;
    right: 11px;
    padding: 5px 9px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 999px;
    color: #dbe8ff;
    background: rgba(5, 15, 40, .82);
    font-size: .55rem;
    font-weight: 1000;
    letter-spacing: .08em;
}

body.route-stream .shows2-radio-card.is-online > b {
    color: #fff;
    border-color: rgba(255, 77, 211, .45);
    background: linear-gradient(90deg, #ff2dad, #b83cff);
    box-shadow: 0 0 18px rgba(255, 45, 173, .24);
}

body.route-stream .shows2-create-card {
    min-width: 0;
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) 20px;
    align-items: center;
    gap: 10px;
    padding: 14px;
    border-color: rgba(246, 72, 222, .42);
    background: linear-gradient(145deg, rgba(46, 16, 79, .98), rgba(12, 42, 79, .98));
}

body.route-stream .shows2-create-card > span {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 18px;
    color: #fff;
    background: linear-gradient(145deg, #ff35b5, #704bff 58%, #1bcfed);
    box-shadow: 0 8px 22px rgba(183, 46, 255, .26);
    font-size: 1.35rem;
}

body.route-stream .shows2-create-card > div {
    min-width: 0;
    display: grid;
    gap: 3px;
}

body.route-stream .shows2-create-card small {
    color: #ff62da;
    font-size: .54rem;
    font-weight: 1000;
    letter-spacing: .09em;
}

body.route-stream .shows2-create-card strong {
    font-size: 1rem;
    font-weight: 1000;
}

body.route-stream .shows2-create-card p {
    margin: 0;
    color: rgba(225, 237, 255, .72);
    font-size: .65rem;
    font-weight: 800;
    line-height: 1.24;
}

body.route-stream .shows2-create-card > i {
    color: #6ee9ff;
    font-size: .9rem;
}

body.route-stream .shows2-section {
    display: grid;
    gap: 10px;
    padding: 12px;
    border: 1px solid rgba(82, 145, 255, .27);
    border-radius: 18px;
    background: linear-gradient(150deg, rgba(7, 18, 49, .93), rgba(17, 12, 43, .93));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03);
}

body.route-stream .shows2-section-head {
    min-height: 56px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

body.route-stream .shows2-section-head > div {
    min-width: 0;
    display: grid;
    gap: 2px;
}

body.route-stream .shows2-section-head > div > small {
    color: #ff58d6;
    font-size: .56rem;
    font-weight: 1000;
    letter-spacing: .11em;
}

body.route-stream .shows2-section-head h2 {
    margin: 0;
    color: #fff;
    font-size: 1.12rem;
    font-weight: 1000;
    line-height: 1.05;
}

body.route-stream .shows2-section-head p {
    margin: 0;
    color: rgba(219, 233, 255, .65);
    font-size: .61rem;
    font-weight: 850;
}

body.route-stream .shows2-section-head > span {
    flex: 0 0 auto;
    min-width: 78px;
    display: grid;
    justify-items: center;
    gap: 1px;
    padding: 8px 9px;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 13px;
    background: rgba(255, 255, 255, .055);
}

body.route-stream .shows2-section-head > span b {
    color: #67eaff;
    font-size: 1rem;
    font-weight: 1000;
}

body.route-stream .shows2-section-head > span small {
    color: rgba(226, 237, 255, .68);
    font-size: .46rem;
    font-weight: 900;
}

body.route-stream .shows2-schedule-banner {
    position: relative;
    min-height: 100px;
    overflow: hidden;
    border: 1px solid rgba(86, 149, 255, .3);
    border-radius: 14px;
    background: linear-gradient(145deg, #071b42, #2a1052);
}

body.route-stream .shows2-schedule-banner-bg,
body.route-stream .shows2-schedule-banner-bg img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

body.route-stream .shows2-schedule-banner-bg img {
    object-fit: cover;
}

body.route-stream .shows2-schedule-banner::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(5, 12, 36, .94), rgba(8, 16, 45, .58) 68%, rgba(8, 16, 45, .18));
}

body.route-stream .shows2-schedule-banner > div {
    position: relative;
    z-index: 2;
    min-height: 100px;
    display: grid;
    align-content: center;
    gap: 2px;
    padding: 14px;
}

body.route-stream .shows2-schedule-banner small {
    color: #63e8ff;
    font-size: .54rem;
    font-weight: 1000;
    letter-spacing: .1em;
}

body.route-stream .shows2-schedule-banner strong {
    color: #fff;
    font-size: 1.12rem;
    font-weight: 1000;
}

body.route-stream .shows2-schedule-banner span {
    color: rgba(226, 238, 255, .73);
    font-size: .62rem;
    font-weight: 800;
}

body.route-stream .stream-show-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
    padding: 0;
}

body.route-stream .stream-event-card {
    min-width: 0;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 15px;
    background: linear-gradient(145deg, rgba(20, 15, 53, .98), rgba(10, 28, 61, .98));
    box-shadow: 0 10px 26px rgba(0, 0, 0, .22), inset 0 0 0 1px rgba(255, 56, 199, .05);
}

body.route-stream .stream-event-card.cancelled {
    opacity: .72;
    filter: saturate(.65);
}

body.route-stream .stream-event-poster {
    height: auto;
    min-height: 0;
    aspect-ratio: 2 / 1;
    border-radius: 15px 15px 0 0;
}

body.route-stream .stream-event-poster img,
body.route-stream .stream-event-poster .image-placeholder {
    width: 100%;
    height: 100%;
    min-height: 0;
    aspect-ratio: 2 / 1;
}

body.route-stream .stream-event-poster img {
    object-fit: cover;
}

body.route-stream .stream-event-poster::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 52%, rgba(4, 7, 21, .68));
    pointer-events: none;
}

body.route-stream .stream-date-chip,
body.route-stream .stream-time-chip,
body.route-stream .badge-hot,
body.route-stream .stream-cancelled-badge {
    z-index: 2;
}

body.route-stream .stream-date-chip {
    min-width: 58px;
    min-height: 41px;
    padding: 4px 7px;
    border-radius: 11px 0 11px 0;
}

body.route-stream .stream-date-chip small {
    font-size: .51rem;
}

body.route-stream .stream-date-chip b {
    font-size: .85rem;
}

body.route-stream .stream-time-chip {
    right: 9px;
    bottom: 7px;
    font-size: .64rem;
}

body.route-stream .stream-event-body {
    gap: 7px;
    padding: 10px;
}

body.route-stream .stream-event-body h2 {
    display: -webkit-box;
    overflow: hidden;
    margin: 0;
    color: #fff;
    font-size: 1rem;
    font-weight: 1000;
    line-height: 1.08;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

body.route-stream .stream-dj-line {
    gap: 6px;
    min-width: 0;
    color: rgba(226, 237, 255, .74);
    font-size: .7rem;
}

body.route-stream .stream-dj-line img,
body.route-stream .stream-dj-line i {
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
}

body.route-stream .stream-dj-line span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.route-stream .stream-rsvp-actions,
body.route-stream .stream-rsvp-stats {
    gap: 6px;
}

body.route-stream .stream-rsvp-actions .rsvp-btn {
    min-height: 38px;
    border-radius: 10px;
    font-size: .7rem;
}

body.route-stream .stream-rsvp-actions .rsvp-btn i {
    font-size: .85rem;
}

body.route-stream .stream-rsvp-stats span {
    min-height: 34px;
    border-radius: 9px;
    font-size: .66rem;
}

body.route-stream .stream-info-fold {
    border-radius: 10px;
}

body.route-stream .stream-info-fold summary {
    min-height: 38px;
    padding: 0 10px;
    font-size: .68rem;
}

body.route-stream .stream-info-fold p {
    padding: 0 10px 9px;
    font-size: .66rem;
}

body.route-stream .stream-info-fold .stream-link {
    min-height: 34px;
    margin: 0 10px 10px;
    font-size: .66rem;
}

body.route-stream .stream-owner-actions {
    gap: 6px;
}

body.route-stream .stream-owner-actions .ghost-btn,
body.route-stream .stream-owner-actions .primary-btn,
body.route-stream .stream-owner-actions .danger-btn {
    min-height: 36px;
    border-radius: 10px;
    font-size: .64rem;
}

body.route-stream .stream-comment-row {
    padding-top: 0;
    font-size: .64rem;
}

body.route-stream .stream-show-list .empty-state {
    grid-column: 1 / -1;
    min-height: 94px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px;
    border: 1px dashed rgba(92, 149, 255, .35);
    border-radius: 13px;
    color: rgba(224, 237, 255, .78);
    background: rgba(255, 255, 255, .04);
}

body.route-stream .stream-show-list .empty-state > i {
    flex: 0 0 auto;
    margin: 0;
    color: #ff55d3;
    font-size: 1.2rem;
}

body.route-stream .stream-show-list .empty-state > span {
    display: grid;
    gap: 2px;
    text-align: left;
}

body.route-stream .stream-show-list .empty-state b {
    color: #fff;
    font-size: .73rem;
}

body.route-stream .stream-show-list .empty-state small {
    color: rgba(220, 234, 255, .63);
    font-size: .58rem;
}

@media (max-width: 760px) {
    .home4-today-shows {
        gap: 6px;
        padding: 8px;
        border-radius: 15px;
    }

    .home4-today-shows-head {
        min-height: 23px;
    }

    .home4-today-shows-head > span {
        gap: 5px;
        font-size: .52rem;
    }

    .home4-today-shows-head > a {
        min-height: 23px;
        padding: 0 7px;
        border-radius: 8px;
        font-size: .45rem;
    }

    .home4-today-show-card {
        flex-basis: 90%;
        min-height: 108px;
        grid-template-columns: minmax(104px, 42%) minmax(0, 1fr);
        border-radius: 12px;
    }

    .home4-today-show-media {
        min-height: 108px;
    }

    .home4-today-show-time {
        left: 6px;
        right: 5px;
        bottom: 6px;
        font-size: .47rem;
    }

    .home4-today-show-media > em {
        top: 6px;
        left: 6px;
        padding: 3px 6px;
        font-size: .42rem;
    }

    .home4-today-show-copy {
        gap: 3px;
        padding: 8px;
    }

    .home4-today-show-copy > small {
        font-size: .4rem;
    }

    .home4-today-show-copy > strong {
        font-size: .72rem;
    }

    .home4-today-show-copy > span,
    .home4-today-show-copy > u {
        font-size: .45rem;
    }

    .home4-radio-promo,
    .home4-radio-promo-overlay {
        min-height: 96px;
    }

    .home4-radio-promo-overlay {
        max-width: 78%;
        padding: 9px;
    }

    .home4-radio-promo-overlay > small {
        font-size: .4rem;
    }

    .home4-radio-promo-overlay > strong {
        font-size: .74rem;
    }

    .home4-radio-promo-overlay > span,
    .home4-radio-promo-overlay > u {
        font-size: .44rem;
    }

    body.route-stream .shows2-page {
        gap: 9px;
    }

    body.route-stream .shows2-top-grid {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    body.route-stream .shows2-radio-card {
        min-height: 124px;
        border-radius: 15px;
    }

    body.route-stream .shows2-radio-copy {
        width: 70%;
        min-height: 124px;
        gap: 3px;
        padding: 12px;
    }

    body.route-stream .shows2-radio-copy > small {
        font-size: .46rem;
    }

    body.route-stream .shows2-radio-copy > strong {
        font-size: .92rem;
    }

    body.route-stream .shows2-radio-copy > span,
    body.route-stream .shows2-radio-copy > u {
        font-size: .51rem;
    }

    body.route-stream .shows2-radio-card > b {
        top: 8px;
        right: 8px;
        padding: 4px 7px;
        font-size: .43rem;
    }

    body.route-stream .shows2-create-card {
        min-height: 82px;
        grid-template-columns: 44px minmax(0, 1fr) 16px;
        gap: 8px;
        padding: 9px;
        border-radius: 14px;
    }

    body.route-stream .shows2-create-card > span {
        width: 44px;
        height: 44px;
        border-radius: 14px;
        font-size: 1rem;
    }

    body.route-stream .shows2-create-card small {
        font-size: .42rem;
    }

    body.route-stream .shows2-create-card strong {
        font-size: .76rem;
    }

    body.route-stream .shows2-create-card p {
        font-size: .48rem;
    }

    body.route-stream .shows2-section {
        gap: 8px;
        padding: 8px;
        border-radius: 15px;
    }

    body.route-stream .shows2-section-head {
        min-height: 48px;
        gap: 8px;
    }

    body.route-stream .shows2-section-head > div > small {
        font-size: .43rem;
    }

    body.route-stream .shows2-section-head h2 {
        font-size: .86rem;
    }

    body.route-stream .shows2-section-head p {
        font-size: .47rem;
    }

    body.route-stream .shows2-section-head > span {
        min-width: 62px;
        padding: 6px;
        border-radius: 10px;
    }

    body.route-stream .shows2-section-head > span b {
        font-size: .78rem;
    }

    body.route-stream .shows2-section-head > span small {
        font-size: .38rem;
    }

    body.route-stream .shows2-schedule-banner,
    body.route-stream .shows2-schedule-banner > div {
        min-height: 82px;
    }

    body.route-stream .shows2-schedule-banner {
        border-radius: 12px;
    }

    body.route-stream .shows2-schedule-banner > div {
        padding: 10px;
    }

    body.route-stream .shows2-schedule-banner small {
        font-size: .42rem;
    }

    body.route-stream .shows2-schedule-banner strong {
        font-size: .83rem;
    }

    body.route-stream .shows2-schedule-banner span {
        font-size: .46rem;
    }

    body.route-stream .stream-show-list {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    body.route-stream .stream-event-card {
        border-radius: 13px;
    }

    body.route-stream .stream-event-poster {
        border-radius: 13px 13px 0 0;
    }

    body.route-stream .stream-event-body {
        gap: 6px;
        padding: 9px;
    }

    body.route-stream .stream-event-body h2 {
        font-size: .86rem;
    }

    body.route-stream .stream-dj-line {
        font-size: .6rem;
    }

    body.route-stream .stream-rsvp-actions .rsvp-btn {
        min-height: 35px;
        font-size: .62rem;
    }

    body.route-stream .stream-rsvp-stats span {
        min-height: 31px;
        font-size: .58rem;
    }

    body.route-stream .stream-info-fold summary {
        min-height: 35px;
        font-size: .6rem;
    }

    body.route-stream .stream-comment-row {
        font-size: .56rem;
    }
}

.home4-today-show-card {
    min-height: 88px;
    grid-template-columns: 132px minmax(0, 1fr);
    align-items: center;
    padding: 6px;
}

.home4-today-show-media {
    width: 120px;
    min-height: 0;
    height: auto;
    aspect-ratio: 2 / 1;
    align-self: center;
    border-radius: 10px;
}

.home4-today-show-media > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home4-today-show-copy {
    padding: 7px 8px 7px 3px;
}

body.route-stream .shows2-radio-card {
    min-height: 0;
    display: grid;
    grid-template-rows: auto auto;
    background: #05091b;
}

body.route-stream .shows2-radio-card::after {
    display: none;
}

body.route-stream .shows2-radio-art {
    position: relative;
    z-index: 1;
    top: auto;
    right: auto;
    width: 100%;
    height: auto;
    aspect-ratio: 1600 / 420;
    display: block;
    overflow: hidden;
    background: #05091b;
}

body.route-stream .shows2-radio-art img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    opacity: 1;
    mask-image: none;
    -webkit-mask-image: none;
}

body.route-stream .shows2-radio-footer {
    position: relative;
    z-index: 2;
    min-height: 50px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 10px;
    padding: 8px 11px;
    border-top: 1px solid rgba(100, 160, 255, .2);
    background: linear-gradient(90deg, rgba(8, 22, 55, .98), rgba(31, 13, 60, .98));
}

body.route-stream .shows2-radio-footer > span {
    min-width: 0;
    display: grid;
    gap: 1px;
}

body.route-stream .shows2-radio-footer small {
    color: #67eaff;
    font-size: .5rem;
    font-weight: 1000;
    letter-spacing: .08em;
}

body.route-stream .shows2-radio-footer strong {
    color: #fff;
    font-size: .78rem;
    font-weight: 1000;
}

body.route-stream .shows2-radio-footer em {
    padding: 5px 8px;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 999px;
    color: #dbe8ff;
    background: rgba(255, 255, 255, .06);
    font-size: .48rem;
    font-style: normal;
    font-weight: 1000;
    letter-spacing: .08em;
}

body.route-stream .shows2-radio-card.is-online .shows2-radio-footer em {
    color: #fff;
    border-color: rgba(255, 78, 215, .4);
    background: linear-gradient(90deg, #ff2dad, #a83cff);
    box-shadow: 0 0 16px rgba(255, 45, 173, .22);
}

body.route-stream .shows2-radio-footer > i {
    color: #6deaff;
    font-size: .8rem;
}

body.route-stream .shows2-week-nav {
    min-height: 72px;
    display: grid;
    grid-template-columns: minmax(92px, .8fr) minmax(150px, 1.4fr) minmax(92px, .8fr);
    align-items: stretch;
    overflow: hidden;
    border: 1px solid rgba(83, 148, 255, .34);
    border-radius: 17px;
    background: linear-gradient(145deg, rgba(7, 19, 53, .98), rgba(28, 12, 59, .98));
    box-shadow: 0 10px 26px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .04);
}

body.route-stream .shows2-week-arrow {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px;
    color: #dce9ff;
    background: linear-gradient(90deg, rgba(58, 77, 156, .14), transparent);
    font-size: .65rem;
    font-weight: 950;
    text-decoration: none;
}

body.route-stream .shows2-week-arrow.next {
    background: linear-gradient(270deg, rgba(197, 58, 255, .16), transparent);
}

body.route-stream .shows2-week-arrow i {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 9px;
    color: #6deaff;
    background: rgba(255, 255, 255, .05);
}

body.route-stream .shows2-week-arrow.next i {
    color: #ff61da;
}

body.route-stream .shows2-week-current {
    min-width: 0;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 1px;
    padding: 8px 12px;
    border-left: 1px solid rgba(255, 255, 255, .08);
    border-right: 1px solid rgba(255, 255, 255, .08);
    text-align: center;
    background: radial-gradient(circle at 50% 50%, rgba(194, 48, 255, .16), transparent 70%);
}

body.route-stream .shows2-week-current > small {
    color: #ff61da;
    font-size: .45rem;
    font-weight: 1000;
    letter-spacing: .11em;
}

body.route-stream .shows2-week-current > strong {
    color: #fff;
    font-size: .96rem;
    font-weight: 1000;
    line-height: 1.05;
}

body.route-stream .shows2-week-current > span {
    color: rgba(222, 235, 255, .72);
    font-size: .56rem;
    font-weight: 850;
}

body.route-stream .shows2-week-current > a {
    margin-top: 3px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #6deaff;
    font-size: .48rem;
    font-weight: 950;
    text-decoration: none;
}

@media (max-width: 760px) {
    .home4-today-show-card {
        min-height: 78px;
        grid-template-columns: 118px minmax(0, 1fr);
        padding: 5px;
    }

    .home4-today-show-media {
        width: 108px;
        min-height: 0;
        height: auto;
        aspect-ratio: 2 / 1;
        border-radius: 9px;
    }

    .home4-today-show-copy {
        gap: 2px;
        padding: 5px 5px 5px 2px;
    }

    .home4-today-show-copy > strong {
        font-size: .68rem;
        -webkit-line-clamp: 2;
    }

    .home4-today-show-copy > span,
    .home4-today-show-copy > u {
        font-size: .43rem;
    }

    .home4-today-show-time {
        left: 5px;
        right: 4px;
        bottom: 4px;
        font-size: .41rem;
    }

    body.route-stream .shows2-radio-card {
        min-height: 0;
    }

    body.route-stream .shows2-radio-art {
        width: 100%;
        height: auto;
        aspect-ratio: 1600 / 420;
    }

    body.route-stream .shows2-radio-footer {
        min-height: 42px;
        gap: 7px;
        padding: 6px 8px;
    }

    body.route-stream .shows2-radio-footer small {
        font-size: .4rem;
    }

    body.route-stream .shows2-radio-footer strong {
        font-size: .63rem;
    }

    body.route-stream .shows2-radio-footer em {
        padding: 4px 6px;
        font-size: .4rem;
    }

    body.route-stream .shows2-week-nav {
        min-height: 62px;
        grid-template-columns: 58px minmax(0, 1fr) 58px;
        border-radius: 14px;
    }

    body.route-stream .shows2-week-arrow {
        padding: 7px;
    }

    body.route-stream .shows2-week-arrow span {
        display: none;
    }

    body.route-stream .shows2-week-arrow i {
        width: 31px;
        height: 31px;
        border-radius: 10px;
        font-size: .72rem;
    }

    body.route-stream .shows2-week-current {
        padding: 6px 8px;
    }

    body.route-stream .shows2-week-current > small {
        font-size: .38rem;
    }

    body.route-stream .shows2-week-current > strong {
        font-size: .78rem;
    }

    body.route-stream .shows2-week-current > span {
        font-size: .45rem;
    }

    body.route-stream .shows2-week-current > a {
        font-size: .4rem;
    }
}


.profile-ref-owned-avatars{position:relative;overflow:hidden;margin-top:16px;padding:18px;border:1px solid rgba(98,126,255,.36);border-radius:24px;background:linear-gradient(145deg,rgba(8,31,73,.94),rgba(19,13,54,.96));box-shadow:0 16px 42px rgba(0,0,0,.16)}
.profile-ref-owned-avatars-head{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.profile-ref-owned-avatars-icon{display:grid;place-items:center;width:44px;height:44px;flex:0 0 44px;border-radius:14px;background:linear-gradient(135deg,#633cff,#ef2bc0);font-size:19px;color:#fff;box-shadow:0 8px 24px rgba(126,59,255,.28)}
.profile-ref-owned-avatars-head>div{min-width:0;flex:1}
.profile-ref-owned-avatars-head h2{margin:0;color:#fff;font-size:20px;line-height:1.1}
.profile-ref-owned-avatars-head p{margin:4px 0 0;color:rgba(227,235,255,.72);font-size:12px}
.profile-ref-owned-avatars-count{display:grid;place-items:center;min-width:34px;height:34px;padding:0 9px;border:1px solid rgba(88,213,255,.35);border-radius:999px;background:rgba(30,92,176,.22);color:#bfefff;font-weight:900}
.profile-ref-owned-avatars-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:10px}
.profile-ref-owned-avatar{appearance:none;position:relative;display:flex;min-width:0;flex-direction:column;align-items:stretch;overflow:hidden;padding:0;border:1px solid rgba(120,145,255,.28);border-radius:18px;background:rgba(17,23,61,.92);color:#fff;text-align:left;cursor:pointer;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}
.profile-ref-owned-avatar:hover{transform:translateY(-2px);border-color:rgba(61,215,255,.72);box-shadow:0 10px 28px rgba(0,0,0,.24)}
.profile-ref-owned-avatar.is-active{border-color:#35dfff;box-shadow:0 0 0 1px rgba(53,223,255,.45),0 10px 30px rgba(25,185,255,.16)}
.profile-ref-owned-avatar-media{position:relative;display:grid;place-items:center;height:116px;margin:8px 8px 0;border-radius:14px;background:linear-gradient(160deg,rgba(103,54,171,.24),rgba(18,68,120,.18));overflow:hidden}
.profile-ref-owned-avatar-render{display:block;max-width:100%;width:100%;height:100%;object-fit:contain}
.profile-ref-owned-avatar-copy{display:flex;min-width:0;flex-direction:column;padding:9px 10px 5px}
.profile-ref-owned-avatar-copy b,.profile-ref-owned-avatar-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.profile-ref-owned-avatar-copy b{font-size:13px;line-height:1.2}
.profile-ref-owned-avatar-copy small{margin-top:3px;color:rgba(224,230,255,.64);font-size:10px}
.profile-ref-owned-avatar-state{margin:2px 9px 9px;padding:6px 8px;border-radius:9px;background:linear-gradient(90deg,#7538ef,#ed2bbb);color:#fff;font-size:10px;font-weight:900;text-align:center}
.profile-ref-owned-avatar.is-active .profile-ref-owned-avatar-state{background:rgba(34,211,238,.14);color:#65eaff;border:1px solid rgba(53,223,255,.3)}
.profile-avatar-activate-modal{z-index:10050}
.profile-avatar-activate-card{width:min(410px,calc(100vw - 28px));padding:22px;border-radius:26px;background:linear-gradient(160deg,#11173a,#21123c);border:1px solid rgba(113,135,255,.42);text-align:center}
.profile-avatar-activate-media{display:grid;place-items:center;height:260px;margin:4px 0 14px;border-radius:20px;background:radial-gradient(circle at 50% 45%,rgba(114,69,255,.3),rgba(4,16,48,.2) 64%);overflow:hidden}
.profile-avatar-activate-render{display:block;width:100%;height:100%;object-fit:contain}
.profile-avatar-activate-copy small{color:#5ce7ff;font-weight:900;font-size:10px;letter-spacing:.11em}
.profile-avatar-activate-copy h2{margin:5px 0 2px;color:#fff;font-size:25px}
.profile-avatar-activate-copy p{margin:0 0 16px;color:rgba(232,236,255,.7);font-size:13px}
.profile-avatar-already-active{display:flex;align-items:center;gap:10px;margin:0 0 12px;padding:11px 12px;border:1px solid rgba(53,223,255,.3);border-radius:14px;background:rgba(30,189,221,.09);text-align:left}
.profile-avatar-already-active>i{color:#52e6ff;font-size:20px}
.profile-avatar-already-active span{display:flex;flex-direction:column}
.profile-avatar-already-active b{font-size:12px;color:#fff}
.profile-avatar-already-active small{margin-top:2px;color:rgba(226,236,255,.68);font-size:10px}
@media(max-width:720px){
.profile-ref-owned-avatars{margin-top:10px;padding:12px;border-radius:18px}
.profile-ref-owned-avatars-head{gap:9px;margin-bottom:10px}
.profile-ref-owned-avatars-icon{width:36px;height:36px;flex-basis:36px;border-radius:11px;font-size:15px}
.profile-ref-owned-avatars-head h2{font-size:16px}
.profile-ref-owned-avatars-head p{font-size:10px}
.profile-ref-owned-avatars-count{min-width:29px;height:29px;font-size:11px}
.profile-ref-owned-avatars-grid{display:grid;grid-auto-flow:column;grid-auto-columns:108px;grid-template-columns:none;gap:8px;overflow-x:auto;padding:1px 1px 7px;scroll-snap-type:x proximity;overscroll-behavior-x:contain}
.profile-ref-owned-avatar{scroll-snap-align:start;border-radius:14px}
.profile-ref-owned-avatar-media{height:94px;margin:6px 6px 0;border-radius:11px}
.profile-ref-owned-avatar-copy{padding:7px 7px 4px}
.profile-ref-owned-avatar-copy b{font-size:11px}
.profile-ref-owned-avatar-copy small{font-size:9px}
.profile-ref-owned-avatar-state{margin:1px 6px 6px;padding:5px 6px;font-size:9px}
.profile-avatar-activate-card{padding:17px;border-radius:21px}
.profile-avatar-activate-media{height:220px;border-radius:16px}
.profile-avatar-activate-copy h2{font-size:21px}
}

/* RANGLISTEN V3 */
body.route-rank .rankings-v3-page,
body.route-rankings .rankings-v3-page,
body.route-ranglisten .rankings-v3-page{display:grid;gap:12px}
.rankings-v3-nav{display:flex;gap:7px;overflow-x:auto;padding:1px 1px 4px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.rankings-v3-nav::-webkit-scrollbar{display:none}
.rankings-v3-nav a{flex:0 0 auto;min-height:38px;display:inline-flex;align-items:center;justify-content:center;padding:0 13px;border:1px solid rgba(89,151,255,.28);border-radius:999px;background:rgba(8,22,54,.9);color:#dceaff;font-size:.66rem;font-weight:950;text-decoration:none;white-space:nowrap;box-shadow:inset 0 0 0 1px rgba(255,255,255,.025)}
.rankings-v3-nav a:active{transform:translateY(1px)}
.rankings-v3-grid{display:grid;gap:14px}
.rankings-v3-category{overflow:hidden;border:1px solid rgba(91,151,255,.25);border-radius:22px;background:linear-gradient(155deg,rgba(10,24,58,.98),rgba(14,9,35,.98));box-shadow:0 16px 38px rgba(0,0,0,.28)}
.rankings-v3-category-head{position:relative;min-height:148px;display:flex;align-items:flex-end;overflow:hidden;background:radial-gradient(circle at 80% 20%,rgba(217,0,255,.28),transparent 36%),linear-gradient(135deg,#162960,#21123d)}
.rankings-v3-category-media{position:absolute!important;inset:0;width:100%;height:100%;z-index:0}
.rankings-v3-category-media img{display:block;width:100%;height:100%;object-fit:cover}
.rankings-v3-category-shade{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(4,10,29,.94) 0%,rgba(4,10,29,.72) 44%,rgba(4,10,29,.22) 100%),linear-gradient(0deg,rgba(5,12,31,.86),transparent 65%)}
.rankings-v3-category-copy{position:relative;z-index:2;display:grid;gap:3px;padding:18px 20px;color:#fff}
.rankings-v3-category-copy small{color:#63e5ff;font-size:.58rem;font-weight:950;letter-spacing:.12em}
.rankings-v3-category-copy h2{margin:0;font-size:1.45rem;line-height:1.05}
.rankings-v3-category-copy span{color:rgba(255,255,255,.7);font-size:.7rem;font-weight:850}
.rankings-v3-podium{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;padding:11px 11px 8px}
.rankings-v3-podium-card{position:relative;min-width:0;min-height:178px;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;justify-items:center;align-content:start;gap:6px;padding:10px 8px;border:1px solid rgba(255,255,255,.09);border-radius:17px;background:linear-gradient(160deg,rgba(255,255,255,.085),rgba(255,255,255,.025));color:#fff;text-align:center;text-decoration:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.035)}
.rankings-v3-podium-card.place-1{border-color:rgba(255,213,80,.32);background:radial-gradient(circle at 50% 0,rgba(255,203,75,.18),transparent 50%),linear-gradient(160deg,rgba(255,255,255,.10),rgba(255,255,255,.025));box-shadow:0 0 24px rgba(255,204,62,.07),inset 0 0 0 1px rgba(255,221,118,.05)}
.rankings-v3-podium-card.place-2{border-color:rgba(157,215,255,.22)}
.rankings-v3-podium-card.place-3{border-color:rgba(255,151,200,.2)}
.rankings-v3-podium-card.is-me{border-color:rgba(65,225,255,.7);box-shadow:0 0 0 2px rgba(53,212,255,.12),0 0 22px rgba(53,212,255,.12)}
.rankings-v3-rank{min-height:34px;display:grid;place-items:center}
.rankings-v3-podium-avatar{width:62px;height:62px;border-radius:19px;box-shadow:0 8px 20px rgba(0,0,0,.28)}
.rankings-v3-podium-name{width:100%;min-width:0;display:grid;gap:2px;align-content:start}
.rankings-v3-podium-name b,.rankings-v3-podium-name small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rankings-v3-podium-name b{font-size:.78rem}
.rankings-v3-podium-name small{color:rgba(255,255,255,.52);font-size:.56rem;font-weight:800}
.rankings-v3-podium-card>em{display:grid;gap:1px;margin-top:auto;color:#fff;font-size:1rem;font-style:normal;font-weight:950;line-height:1}
.rankings-v3-podium-card>em small{color:rgba(255,255,255,.48);font-size:.48rem;font-weight:900;text-transform:uppercase}
.rankings-v3-user{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:10px;align-items:center;margin:2px 11px 10px;padding:10px 11px;border:1px solid rgba(89,154,255,.22);border-radius:15px;background:linear-gradient(135deg,rgba(42,77,147,.22),rgba(129,43,164,.13));color:#fff}
.rankings-v3-user.is-top3{border-color:rgba(53,212,255,.36);background:linear-gradient(135deg,rgba(30,119,160,.22),rgba(129,43,164,.15))}
.rankings-v3-user-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:linear-gradient(135deg,#7c4dff,#28c9ee);box-shadow:0 7px 18px rgba(0,0,0,.22)}
.rankings-v3-user-icon i{margin:0;font-size:1rem}
.rankings-v3-user-copy{min-width:0;display:grid;gap:2px}
.rankings-v3-user-copy small{color:#63e5ff;font-size:.5rem;font-weight:950;letter-spacing:.1em}
.rankings-v3-user-copy b{font-size:.82rem}
.rankings-v3-user-copy em{overflow:hidden;color:rgba(255,255,255,.66);font-size:.63rem;font-style:normal;font-weight:800;line-height:1.25;text-overflow:ellipsis;white-space:nowrap}
.rankings-v3-user>strong{display:grid;gap:2px;text-align:right;font-size:.92rem;font-weight:950;white-space:nowrap}
.rankings-v3-user>strong small{color:rgba(255,255,255,.48);font-size:.48rem;font-weight:900;text-transform:uppercase}
.rankings-v3-more{margin:0 11px 11px;border:1px solid rgba(255,255,255,.08);border-radius:15px;background:rgba(4,12,31,.45);overflow:hidden}
.rankings-v3-more>summary{list-style:none;min-height:44px;display:flex;align-items:center;justify-content:center;padding:0 12px;cursor:pointer;color:#70eaff;background:rgba(53,212,255,.055);font-size:.65rem;font-weight:950}
.rankings-v3-more>summary::-webkit-details-marker{display:none}
.rankings-v3-more>summary i{margin:0 7px 0 0}
.rankings-v3-more-open{display:none}
.rankings-v3-more[open] .rankings-v3-more-closed{display:none}
.rankings-v3-more[open] .rankings-v3-more-open{display:inline}
.rankings-v3-list{display:grid;gap:6px;padding:7px;border-top:1px solid rgba(255,255,255,.07)}
.rankings-v3-row{min-height:56px;margin:0;border-radius:12px;background:rgba(255,255,255,.055)}
.rankings-v3-row.is-me{border-color:rgba(53,212,255,.5);background:linear-gradient(135deg,rgba(53,212,255,.10),rgba(217,0,255,.08));box-shadow:inset 0 0 0 1px rgba(53,212,255,.08)}
.rankings-v3-row>em{display:grid;gap:1px;text-align:right;font-style:normal}
.rankings-v3-row>em small{color:rgba(255,255,255,.46);font-size:.44rem;font-weight:900;text-transform:uppercase}
.rankings-v3-empty{margin:11px}

@media(min-width:900px){
    .rankings-v3-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
    .rankings-v3-category-head{min-height:132px}
    .rankings-v3-podium-card{min-height:185px}
    .rankings-v3-podium-avatar{width:66px;height:66px}
}

@media(max-width:640px){
    body.route-rank .rankings-v3-page,
    body.route-rankings .rankings-v3-page,
    body.route-ranglisten .rankings-v3-page{gap:9px}
    .rankings-v3-nav{margin:0 -2px;gap:5px}
    .rankings-v3-nav a{min-height:34px;padding:0 10px;font-size:.56rem}
    .rankings-v3-grid{gap:10px}
    .rankings-v3-category{border-radius:17px}
    .rankings-v3-category-head{min-height:105px}
    .rankings-v3-category-copy{padding:12px 13px}
    .rankings-v3-category-copy small{font-size:.47rem}
    .rankings-v3-category-copy h2{font-size:1.05rem}
    .rankings-v3-category-copy span{font-size:.55rem}
    .rankings-v3-podium{gap:5px;padding:7px 7px 6px}
    .rankings-v3-podium-card{min-height:139px;gap:4px;padding:7px 4px;border-radius:13px}
    .rankings-v3-rank{min-height:27px}
    .rankings-v3-podium-card .podium-rank-medal{width:29px;height:29px;margin:0;border-radius:9px}
    .rankings-v3-podium-card .podium-rank-medal i{font-size:.72rem}
    .rankings-v3-podium-card .podium-rank-medal small{right:-4px;bottom:-4px;width:14px;height:14px;font-size:.45rem}
    .rankings-v3-podium-avatar{width:46px;height:46px;border-radius:14px}
    .rankings-v3-podium-name b{font-size:.62rem}
    .rankings-v3-podium-name small{font-size:.46rem}
    .rankings-v3-podium-card>em{font-size:.76rem}
    .rankings-v3-podium-card>em small{font-size:.38rem}
    .rankings-v3-user{grid-template-columns:35px minmax(0,1fr) auto;gap:7px;margin:1px 7px 7px;padding:8px;border-radius:12px}
    .rankings-v3-user-icon{width:35px;height:35px;border-radius:11px}
    .rankings-v3-user-icon i{font-size:.82rem}
    .rankings-v3-user-copy small{font-size:.43rem}
    .rankings-v3-user-copy b{font-size:.7rem}
    .rankings-v3-user-copy em{font-size:.52rem}
    .rankings-v3-user>strong{font-size:.74rem}
    .rankings-v3-user>strong small{font-size:.38rem}
    .rankings-v3-more{margin:0 7px 7px;border-radius:12px}
    .rankings-v3-more>summary{min-height:38px;font-size:.56rem}
    .rankings-v3-list{gap:5px;padding:5px}
    .rankings-v3-row{grid-template-columns:31px 36px minmax(0,1fr) auto;min-height:49px;gap:6px;padding:6px;border-radius:10px}
    .rankings-v3-row .rank-medal{width:27px;height:27px;border-radius:9px}
    .rankings-v3-row .rank-medal i{font-size:.7rem}
    .rankings-v3-row .rank-medal small{width:14px;height:14px;font-size:.45rem}
    .rankings-v3-row .ranking-avatar{width:36px;height:36px;border-radius:11px}
    .rankings-v3-row .ranking-name b{font-size:.64rem}
    .rankings-v3-row .ranking-name small{font-size:.48rem}
    .rankings-v3-row>em{font-size:.64rem}
    .rankings-v3-row>em small{font-size:.36rem}
}

@media(max-width:360px){
    .rankings-v3-podium-card{min-height:132px;padding-left:3px;padding-right:3px}
    .rankings-v3-podium-avatar{width:42px;height:42px}
    .rankings-v3-podium-name small{display:none}
    .rankings-v3-user-copy em{white-space:normal}
}

/* Home shows block – mobile-first next show card */
.home4-today-shows {
    gap: 10px;
}

.home4-today-show-card {
    width: 100%;
    min-height: 0;
    display: grid;
    grid-template-columns: 1fr;
    align-items: stretch;
    padding: 0;
    border-radius: 16px;
    overflow: hidden;
}

.home4-today-show-card:only-child {
    flex-basis: auto;
}

.home4-today-show-media {
    width: 100%;
    min-height: 0;
    height: auto;
    aspect-ratio: 2.2 / 1;
    border-radius: 0;
}

.home4-today-show-media::after {
    background: linear-gradient(180deg, rgba(4, 10, 26, 0.04) 0%, rgba(4, 10, 26, 0.12) 100%);
}

.home4-today-show-copy {
    gap: 7px;
    padding: 12px;
}

.home4-today-show-copy > small {
    font-size: .55rem;
    letter-spacing: .12em;
}

.home4-today-show-copy > strong {
    font-size: 1rem;
    line-height: 1.08;
    -webkit-line-clamp: 2;
}

.home4-today-show-datetime-row {
    display: grid;
    gap: 6px;
}

.home4-today-show-date,
.home4-today-show-time-big,
.home4-today-show-meta,
.home4-today-show-countdown,
.home4-today-show-footer,
.home4-today-show-more {
    min-width: 0;
}

.home4-today-show-date,
.home4-today-show-time-big,
.home4-today-show-meta,
.home4-today-show-countdown,
.home4-today-show-footer,
.home4-today-show-more,
.home4-today-show-footer > u {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.home4-today-show-date {
    color: rgba(223, 234, 255, .84);
    font-size: .63rem;
    font-weight: 900;
}

.home4-today-show-time-big {
    color: #fff;
    font-size: .98rem;
    font-weight: 1000;
    line-height: 1.1;
}

.home4-today-show-date i,
.home4-today-show-time-big i,
.home4-today-show-countdown i {
    color: #6deaff;
    flex: 0 0 auto;
}

.home4-today-show-meta {
    color: rgba(224, 236, 255, .76);
    font-size: .6rem;
    font-weight: 850;
    line-height: 1.35;
}

.home4-today-show-countdown {
    width: fit-content;
    max-width: 100%;
    padding: 7px 10px;
    border: 1px solid rgba(109, 234, 255, .18);
    border-radius: 999px;
    color: #dffdff;
    background: rgba(109, 234, 255, .08);
    font-size: .6rem;
    font-weight: 950;
    line-height: 1;
    flex-wrap: wrap;
}

.home4-today-show-countdown.is-live {
    color: #ffe9fb;
    background: rgba(255, 62, 186, .11);
    border-color: rgba(255, 62, 186, .2);
}

.home4-today-show-countdown > b {
    color: #fff;
    font-size: .72rem;
    font-weight: 1000;
}

.home4-today-show-footer {
    width: 100%;
    justify-content: space-between;
    gap: 10px;
    margin-top: 2px;
}

.home4-today-show-more {
    color: rgba(224, 236, 255, .64);
    font-size: .56rem;
    font-weight: 850;
    line-height: 1.3;
}

.home4-today-show-footer > u {
    min-height: 34px;
    margin-top: 0;
    padding: 0 12px;
    justify-content: center;
    border: 1px solid rgba(109, 234, 255, .22);
    border-radius: 10px;
    color: #6deaff;
    background: rgba(109, 234, 255, .08);
    font-size: .62rem;
    font-weight: 1000;
    text-decoration: none;
    white-space: nowrap;
}

@media (max-width: 760px) {
    .home4-today-shows {
        gap: 8px;
        padding: 8px;
    }

    .home4-today-shows-head {
        align-items: center;
        gap: 8px;
    }

    .home4-today-shows-head > span {
        font-size: .58rem;
    }

    .home4-today-shows-head > a {
        min-height: 26px;
        padding: 0 8px;
        font-size: .48rem;
    }

    .home4-today-show-card {
        border-radius: 14px;
    }

    .home4-today-show-media {
        aspect-ratio: 2.15 / 1;
    }

    .home4-today-show-copy {
        gap: 6px;
        padding: 10px;
    }

    .home4-today-show-copy > small {
        font-size: .48rem;
    }

    .home4-today-show-copy > strong {
        font-size: .9rem;
    }

    .home4-today-show-date {
        font-size: .58rem;
    }

    .home4-today-show-time-big {
        font-size: .88rem;
    }

    .home4-today-show-meta,
    .home4-today-show-countdown,
    .home4-today-show-more,
    .home4-today-show-footer > u {
        font-size: .56rem;
    }

    .home4-today-show-countdown > b {
        font-size: .66rem;
    }

    .home4-today-show-footer {
        align-items: center;
    }

    .home4-today-show-footer > u {
        min-height: 32px;
        padding: 0 10px;
    }
}

/* Stream schedule – visible date and time row */
body.route-stream .stream-show-when{display:flex;flex-wrap:wrap;align-items:center;gap:7px 12px;min-width:0;padding:9px 10px;border:1px solid rgba(84,215,255,.28);border-radius:11px;background:linear-gradient(110deg,rgba(36,92,141,.26),rgba(34,22,86,.35));color:#f2f8ff}
body.route-stream .stream-show-when-date,body.route-stream .stream-show-when-time{display:inline-flex;align-items:center;gap:7px;min-width:0;line-height:1.3;white-space:normal}
body.route-stream .stream-show-when-date{font-size:.79rem;font-weight:800}
body.route-stream .stream-show-when-time{font-size:.92rem;font-weight:950;color:#80f4ff;font-variant-numeric:tabular-nums}
body.route-stream .stream-show-when i{margin:0;flex:0 0 auto;font-size:.9em}
@media(max-width:760px){body.route-stream .stream-show-when{padding:9px 10px;gap:5px 10px}body.route-stream .stream-show-when-date{font-size:.75rem}body.route-stream .stream-show-when-time{font-size:.94rem}body.route-stream .stream-time-chip{display:none}}
@media(max-width:360px){body.route-stream .stream-show-when{flex-direction:column;align-items:flex-start}body.route-stream .stream-show-when-time{font-size:1rem}}

.profile-ref-hero>.pet-avatar-companion{position:absolute;left:26%;bottom:0;z-index:4;display:flex;align-items:flex-end;justify-content:center;width:clamp(165px,18vw,225px);height:clamp(165px,18vw,225px);max-width:none;max-height:none;pointer-events:none;overflow:visible}
.profile-ref-hero>.pet-avatar-companion img,.profile-ref-hero>.pet-avatar-companion video{display:block;width:100%;height:100%;max-width:none;max-height:none;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 7px 13px rgba(0,0,0,.6))}
.profile-ref-hero>.pet-avatar-companion.pet-placeholder{display:grid;place-items:center;width:115px;height:115px;border-radius:50%;border:2px solid #f6a2df;background:#8e43a8;color:#fff;font-size:2rem;font-weight:bold}
@media(max-width:900px){.profile-ref-hero>.pet-avatar-companion{left:19%;width:clamp(128px,18vw,170px);height:clamp(128px,18vw,170px)}}
@media(max-width:720px){.profile-ref-hero>.pet-avatar-companion{left:1.5%;bottom:0;width:clamp(106px,31vw,140px);height:clamp(106px,31vw,140px)}}

.dxf-family-week-help{position:relative;z-index:1;margin:2px 0;color:#d7e2ff;font-size:clamp(.65rem,1.35vw,.83rem);line-height:1.5}
.dxf-family-week-breakdown{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:6px}
.dxf-family-week-breakdown>span{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border:1px solid rgba(109,138,227,.4);border-radius:8px;background:rgba(3,13,35,.76);color:#afc6ed;font-size:.66rem}
.dxf-family-week-breakdown b{color:#fff;font-weight:900}
.dxf-progress-ref-rewards article{grid-template-rows:34px auto auto auto;align-content:start}
.dxf-progress-ref-rewards article.is-claimable{border-color:#f9bb49;box-shadow:0 0 13px rgba(255,194,66,.24)}
.dxf-progress-ref-rewards article.is-claimable .dxf-progress-ref-reward-state{background:#ffc845;color:#271731;border-color:#fff0a0}
.dxf-progress-ref-rewards article>form{width:100%;position:relative;z-index:4;margin-top:5px}
.dxf-progress-ref-rewards article>form button{width:100%;min-height:28px;padding:4px 2px;border:0;border-radius:7px;background:linear-gradient(135deg,#ffe66b,#ffae2f);color:#251431;font-weight:950;font-size:clamp(.49rem,1.2vw,.78rem);cursor:pointer}
.dxf-family-week-claimed,.dxf-family-week-locked{margin-top:5px;font-size:clamp(.46rem,1.1vw,.7rem);line-height:1.15;color:#b8c4e9}
.dxf-family-week-claimed{color:#72f7bd;font-weight:900}
.dxf-progress-ref-rewards article>small{white-space:normal;overflow-wrap:anywhere;overflow:visible;max-width:100%;line-height:1.2}
@media(max-width:700px){.dxf-progress-ref-rewards{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 7px;padding-top:14px}.dxf-progress-ref-rewards article{grid-template-rows:46px auto auto auto;min-height:112px;padding:8px 6px}.dxf-progress-ref-reward-art{height:46px}.dxf-progress-ref-rewards article>strong{font-size:.73rem}.dxf-progress-ref-rewards article>small{font-size:.65rem}.dxf-progress-ref-rewards article>form button{font-size:.68rem;min-height:31px}}


body.is-play-root .dxf-play-farm-banner {
    position: relative;
    isolation: isolate;
    display: flex;
    align-items: center;
    min-height: 270px;
    width: 100%;
    overflow: hidden;
    border: 1px solid rgba(158, 231, 112, .68);
    border-radius: 24px;
    background: radial-gradient(ellipse at 82% 20%, rgba(193, 255, 126, .23), transparent 43%), linear-gradient(115deg, #0b3029 0%, #175735 54%, #385f27 100%);
    color: #fff;
    text-decoration: none;
    box-shadow: 0 16px 36px rgba(0, 0, 0, .28), inset 0 0 0 1px rgba(225, 255, 166, .07);
    transition: border-color .18s ease, transform .18s ease;
}
body.is-play-root .dxf-play-farm-banner::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: .22;
    background: repeating-linear-gradient(150deg, transparent 0 46px, rgba(206, 255, 142, .15) 47px 48px, transparent 49px 96px);
    pointer-events: none;
}
body.is-play-root .dxf-play-farm-banner:hover,
body.is-play-root .dxf-play-farm-banner:focus-visible {
    border-color: #d3ff88;
    transform: translateY(-2px);
}
body.is-play-root .dxf-play-farm-banner-copy {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 11px;
    padding: 30px clamp(20px, 4vw, 54px);
    max-width: 74%;
}
body.is-play-root .dxf-play-farm-banner-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #baff92;
    font-size: clamp(.8rem, 1.4vw, 1rem);
    font-weight: 850;
    letter-spacing: .05em;
    text-transform: uppercase;
}
body.is-play-root .dxf-play-farm-banner-copy > strong {
    color: #fff;
    font-size: clamp(2.2rem, 5.8vw, 5rem);
    font-weight: 1000;
    letter-spacing: -.055em;
    line-height: 1;
    text-shadow: 0 6px 22px rgba(0, 0, 0, .28);
}
body.is-play-root .dxf-play-farm-banner-copy > strong em {
    color: #c5fc72;
    font-style: normal;
}
body.is-play-root .dxf-play-farm-banner-subtitle {
    color: #edf9e5;
    font-size: clamp(.88rem, 1.9vw, 1.18rem);
    line-height: 1.35;
}
body.is-play-root .dxf-play-farm-banner-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    min-height: 43px;
    margin-top: 6px;
    padding: 9px 20px;
    border-radius: 13px;
    background: linear-gradient(180deg, #d2ff78, #8fd43f);
    color: #163d1e;
    box-shadow: 0 7px 17px rgba(0, 0, 0, .25);
    font-size: 1rem;
    font-weight: 950;
}
body.is-play-root .dxf-play-farm-banner-art {
    position: absolute;
    right: clamp(26px, 9vw, 145px);
    top: 50%;
    color: rgba(217, 255, 147, .28);
    font-size: clamp(7rem, 16vw, 14rem);
    line-height: 1;
    transform: translateY(-50%) rotate(-15deg);
    pointer-events: none;
}
@media (max-width: 720px) {
    body.is-play-root .dxf-play-farm-banner {
        min-height: 196px;
        border-radius: 16px;
    }
    body.is-play-root .dxf-play-farm-banner-copy {
        max-width: 88%;
        gap: 8px;
        padding: 20px 18px;
    }
    body.is-play-root .dxf-play-farm-banner-copy > strong {
        font-size: clamp(2rem, 8.5vw, 3.3rem);
    }
    body.is-play-root .dxf-play-farm-banner-subtitle {
        font-size: .81rem;
    }
    body.is-play-root .dxf-play-farm-banner-action {
        min-height: 36px;
        margin-top: 1px;
        padding: 7px 14px;
        font-size: .83rem;
    }
    body.is-play-root .dxf-play-farm-banner-art {
        right: 14px;
        font-size: 8rem;
    }
}


body.is-play-root .dxf-play-feature-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
    min-width: 0;
}
body.is-play-root .dxf-play-feature-grid.is-pets-only {grid-template-columns: minmax(0, 1fr)}
body.is-play-root .dxf-play-feature {
    position: relative;
    isolation: isolate;
    display: block;
    min-width: 0;
    min-height: 330px;
    overflow: hidden;
    border-radius: 23px;
    text-decoration: none;
    color: #fff;
    transition: transform .18s ease, border-color .18s ease;
}
body.is-play-root .dxf-play-feature:focus-visible,
body.is-play-root .dxf-play-quick-card:focus-within,
body.is-play-root .dxf-play-arena-feature:focus-visible {outline: 2px solid #7fd8ff;outline-offset:3px}
body.is-play-root .dxf-play-feature:hover {transform:translateY(-3px)}
body.is-play-root .dxf-play-farm-banner {
    display: block;
    width: 100%;
    min-height: 330px;
    background: radial-gradient(ellipse at 85% 20%, rgba(175,249,119,.40), transparent 38%), linear-gradient(120deg,#062c30 0%,#09533e 55%,#174d37 100%);
    border-color: rgba(133,246,154,.68);
}
body.is-play-root .dxf-play-farm-banner::before {
    z-index:0;
    opacity:1;
    background: linear-gradient(90deg,rgba(1,27,31,.93) 0%,rgba(4,52,48,.77) 46%,rgba(10,76,45,.03) 100%),radial-gradient(circle at 90% 110%,rgba(123,205,85,.36),transparent 50%);
}
body.is-play-root .dxf-play-farm-banner::after,
body.is-play-root .dxf-play-pets-feature::after {
    content:"";
    position:absolute;
    z-index:0;
    inset:auto -12% -50% 15%;
    height:72%;
    border-radius:50%;
    background:rgba(12,255,203,.10);
    filter:blur(32px);
    pointer-events:none;
}
body.is-play-root .dxf-play-farm-landscape {
    position:absolute;
    right:-9%;
    bottom:-18%;
    z-index:1;
    width:77%;
    height:112%;
    object-fit:contain;
    object-position:center bottom;
    opacity:.88;
    filter:drop-shadow(0 14px 25px rgba(0,0,0,.38));
    pointer-events:none;
}
body.is-play-root .dxf-play-farm-banner-copy {
    z-index:2;
    min-height:330px;
    max-width:64%;
    justify-content:space-between;
    gap:7px;
    padding:21px 22px;
}
body.is-play-root .dxf-play-farm-banner-eyebrow {font-size:clamp(.68rem,1vw,.86rem);color:#c2ffb9}
body.is-play-root .dxf-play-farm-logo {
    display:block;
    width:min(100%,225px);
    height:130px;
    object-fit:contain;
    object-position:left center;
    filter:drop-shadow(0 5px 10px rgba(0,0,0,.42));
}
body.is-play-root .dxf-play-farm-banner-subtitle {max-width:270px;font-size:clamp(.75rem,1vw,.98rem);font-weight:650;line-height:1.35;text-shadow:0 2px 5px #061a16}
body.is-play-root .dxf-play-farm-banner-action {
    margin:0;
    width:max-content;
    max-width:100%;
    min-height:38px;
    padding:8px 14px;
    font-size:.86rem;
    gap:12px;
    white-space:nowrap;
}
body.is-play-root .dxf-play-pets-feature {
    border:1px solid rgba(240,110,255,.67);
    background:radial-gradient(ellipse at 77% 25%,rgba(188,115,255,.45),transparent 47%),linear-gradient(120deg,#120e39 0%,#28215e 56%,#18396b 100%);
    box-shadow:inset 0 0 0 1px rgba(245,154,255,.10),0 16px 36px rgba(0,0,0,.28);
}
body.is-play-root .dxf-play-pets-feature::before {
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    background:linear-gradient(90deg,rgba(12,12,42,.94),rgba(19,17,57,.74) 43%,rgba(28,18,71,.02) 100%);
    pointer-events:none;
}
body.is-play-root .dxf-play-pets-art {
    position:absolute;
    z-index:1;
    right:-8%;
    bottom:-17%;
    width:78%;
    height:115%;
    object-fit:contain;
    object-position:center bottom;
    filter:drop-shadow(0 15px 25px rgba(4,9,32,.45));
    pointer-events:none;
}
body.is-play-root .dxf-play-pets-copy {
    position:relative;
    z-index:2;
    display:flex;
    min-height:330px;
    max-width:66%;
    padding:23px 22px;
    flex-direction:column;
    align-items:flex-start;
    justify-content:space-between;
    gap:10px;
}
body.is-play-root .dxf-play-pets-eyebrow {display:flex;align-items:center;gap:8px;color:#ffa8f6;text-transform:uppercase;font-size:clamp(.68rem,1vw,.86rem);font-weight:900;letter-spacing:.04em}
body.is-play-root .dxf-play-pets-copy>strong {margin-top:auto;font-size:clamp(1.6rem,3vw,2.7rem);font-weight:1000;letter-spacing:-.04em;text-shadow:0 3px 12px #0b0731}
body.is-play-root .dxf-play-pets-subtitle {max-width:260px;font-size:clamp(.76rem,1vw,.98rem);line-height:1.4;font-weight:650;text-shadow:0 2px 8px #060824}
body.is-play-root .dxf-play-pets-action {display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:38px;padding:9px 13px;border-radius:13px;background:linear-gradient(120deg,#ff4cce,#963dff);color:#fff;font-size:.86rem;font-weight:900;white-space:nowrap;box-shadow:0 7px 19px rgba(6,4,32,.35)}
body.is-play-root .dxf-play-quick-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
body.is-play-root .dxf-play-quick-card {position:relative;min-width:0;min-height:136px;display:grid;grid-template-columns:48px minmax(0,1fr) 14px;align-items:center;gap:11px;padding:16px 17px;border-radius:18px;color:#fff;text-decoration:none;transition:border-color .16s,transform .16s}
body.is-play-root a.dxf-play-quick-card:hover {transform:translateY(-2px);border-color:#b8a7ff}
body.is-play-root .dxf-play-quick-card .dxf-play-card-bg {z-index:-1;opacity:.60}
body.is-play-root .dxf-play-quick-card::before {content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(95deg,rgba(3,14,41,.98),rgba(6,17,51,.84) 60%,rgba(12,16,55,.35));pointer-events:none}
body.is-play-root .dxf-play-quick-icon {position:relative;z-index:1;width:46px;height:46px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(135deg,rgba(86,79,219,.5),rgba(19,67,114,.65));border:1px solid rgba(134,178,255,.38);font-size:1.2rem;color:#d3eeff}
body.is-play-root .dxf-play-quick-copy {position:relative;z-index:1;min-width:0;display:flex;flex-direction:column;gap:5px}
body.is-play-root .dxf-play-quick-copy strong {color:#fff;font-size:clamp(.81rem,1.35vw,1.12rem);line-height:1.16;font-weight:950;overflow-wrap:break-word}
body.is-play-root .dxf-play-quick-copy small {color:#c9d7ff;font-size:clamp(.66rem,.9vw,.78rem);line-height:1.25}
body.is-play-root .dxf-play-quick-copy em {color:#c7d5fc;font-style:normal;font-size:.68rem;font-weight:800}
body.is-play-root .dxf-play-quick-arrow {position:relative;z-index:1;font-size:.86rem;color:#bfd4ff}
body.is-play-root .dxf-play-quick-progress {display:block;width:100%;height:6px;border-radius:8px;background:#122c55;overflow:hidden}
body.is-play-root .dxf-play-quick-progress i {display:block;height:100%;background:linear-gradient(90deg,#ee42e0,#51d2ff);border-radius:inherit}
body.is-play-root .dxf-play-quick-race-link {display:flex;justify-content:space-between;align-items:center;gap:6px;text-decoration:none;color:#fff}
body.is-play-root .dxf-play-quick-race-link:hover strong {color:#a7eaff}
body.is-play-root .dxf-play-kart-quick {grid-template-columns:48px minmax(0,1fr);border-color:rgba(233,92,236,.55)}
body.is-play-root .dxf-play-kart-claim {margin:0;position:relative;z-index:2}
body.is-play-root .dxf-play-kart-claim button {border:0;border-radius:9px;background:linear-gradient(125deg,#61efc1,#31cbd8);color:#092743;font-size:.74rem;font-weight:900;padding:7px 10px;cursor:pointer}
body.is-play-root .dxf-play-arena-feature {position:relative;display:flex;align-items:center;min-height:220px;padding:24px 28px;border-radius:23px;text-decoration:none;color:#fff;transition:transform .18s ease,border-color .18s ease}
body.is-play-root .dxf-play-arena-feature:hover {transform:translateY(-2px);border-color:#a78bff}
body.is-play-root .dxf-play-arena-feature::before {content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(90deg,rgba(4,11,40,.98) 0%,rgba(13,12,54,.85) 47%,rgba(3,21,51,.17) 100%)}
body.is-play-root .dxf-play-arena-feature .dxf-play-card-bg {z-index:-1;opacity:.85}
body.is-play-root .dxf-play-arena-feature-copy {position:relative;z-index:2;display:flex;align-items:flex-start;flex-direction:column;gap:10px;max-width:60%}
body.is-play-root .dxf-play-arena-feature-copy>small {font-size:clamp(.69rem,.95vw,.85rem);font-weight:900;color:#efb1ff;line-height:1.3}
body.is-play-root .dxf-play-arena-feature-copy>strong {font-size:clamp(2.25rem,4.4vw,4rem);font-weight:1000;letter-spacing:-.05em;line-height:1}
body.is-play-root .dxf-play-arena-feature-copy>span {font-size:clamp(.8rem,1.2vw,1rem);color:#e1e7ff;line-height:1.36}
body.is-play-root .dxf-play-arena-feature-copy>b {display:inline-flex;align-items:center;gap:12px;min-height:38px;border-radius:12px;padding:9px 16px;background:linear-gradient(120deg,#ae3fff,#fa3fd8);font-size:.85rem;color:#fff}

.profile-ref-page>.profile-ref-hero.profile-prestige-shell {background:linear-gradient(130deg,#06112b,#101c44 50%,#121036)}
.profile-ref-page>.profile-ref-hero.profile-frame-neon {border:2px solid #3fdcfc;box-shadow:inset 0 0 0 2px rgba(232,77,255,.45),inset 0 0 20px rgba(50,221,255,.28),0 0 24px rgba(73,215,255,.35),0 15px 44px rgba(0,0,0,.35)}
.profile-ref-page>.profile-ref-hero.profile-frame-gold {border:2px solid #ffd36d;box-shadow:inset 0 0 0 3px rgba(255,216,102,.32),inset 0 0 24px rgba(255,206,72,.25),0 0 26px rgba(255,196,63,.35),0 15px 44px rgba(0,0,0,.34)}
.profile-ref-page>.profile-ref-hero.profile-bg-neon:before,.profile-ref-page>.profile-ref-hero.profile-bg-stage:before {content:"";position:absolute;z-index:0;inset:0;pointer-events:none;border-radius:inherit}
.profile-ref-page>.profile-ref-hero.profile-bg-neon:before {background:radial-gradient(circle at 70% 0%,rgba(44,235,255,.35),transparent 40%),linear-gradient(115deg,rgba(12,9,40,.01),rgba(172,54,255,.18))}
.profile-ref-page>.profile-ref-hero.profile-bg-stage:before {background:radial-gradient(circle at 65% 10%,rgba(242,66,221,.40),transparent 42%),linear-gradient(115deg,rgba(12,9,40,.01),rgba(105,31,159,.23))}
.profile-ref-page>.profile-ref-hero.profile-ref-glow-neon .profile-ref-hero-copy h1 {text-shadow:0 0 10px #45e8ff,0 0 24px rgba(65,224,255,.55)}
.profile-ref-page>.profile-ref-hero.profile-ref-glow-gold .profile-ref-hero-copy h1 {text-shadow:0 0 10px #ffe082,0 0 25px rgba(255,179,44,.48)}
.profile-ref-page>.profile-ref-hero.profile-ref-glow-fire .profile-ref-hero-copy h1 {text-shadow:0 0 11px #ff8c4b,0 0 25px rgba(255,56,60,.58)}
.profile-ref-page>.profile-ref-hero.profile-ref-glow-electric .profile-ref-hero-copy h1 {text-shadow:0 0 10px #8ab7ff,0 0 27px rgba(92,85,255,.58)}
.profile-ref-page>.profile-ref-hero .profile-ref-hero-avatar {left:1%;width:37%;height:94%;max-width:440px;overflow:visible!important;align-items:flex-end}
.profile-ref-page>.profile-ref-hero .profile-ref-main-avatar-shell,.profile-ref-page>.profile-ref-hero .profile-ref-main-avatar {width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;overflow:visible!important}
.profile-ref-page>.profile-ref-hero .profile-ref-main-avatar-shell>img.profile-ref-main-avatar,
.profile-ref-page>.profile-ref-hero .profile-ref-main-avatar-shell>video.profile-ref-main-avatar,
.profile-ref-page>.profile-ref-hero .profile-ref-hero-avatar>img.profile-ref-main-avatar {display:block;width:100%!important;height:100%!important;object-fit:contain!important;object-position:center bottom!important;transform:none!important}
.profile-ref-page>.profile-ref-hero .profile-ref-avatar-effect {position:absolute;inset:0;z-index:3;width:100%;height:100%;object-fit:contain;pointer-events:none;mix-blend-mode:screen;opacity:.85}
.profile-ref-page>.profile-ref-hero>.pet-avatar-companion {left:27%;bottom:1%;z-index:4;width:clamp(135px,17vw,208px);height:clamp(135px,17vw,208px)}
.profile-ref-page>.profile-ref-hero .profile-ref-hero-copy {z-index:5}
.profile-ref-page>.profile-ref-hero .profile-ref-hero-actions {z-index:7}
.profile-ref-page>.profile-ref-hero .profile-ref-level-badge {z-index:6}
.profile-ref-farm-panel {position:relative;isolation:isolate;min-height:165px;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(220px,1fr) auto;align-items:center;gap:16px;padding:21px 24px;border-radius:22px;border:1px solid rgba(144,237,125,.63);background:radial-gradient(ellipse at 82% 0%,rgba(145,255,100,.16),transparent 45%),linear-gradient(125deg,#072b2c,#093c38 60%,#12362c);color:#fff;box-shadow:0 12px 30px rgba(0,0,0,.21)}
.profile-ref-farm-panel:before {content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,rgba(2,25,30,.92),rgba(9,46,37,.79),rgba(13,49,37,.53))}
.profile-ref-farm-art {position:absolute;z-index:-1;right:-2%;bottom:-40%;width:35%;height:185%;object-fit:contain;opacity:.42;pointer-events:none}
.profile-ref-farm-heading {position:relative;z-index:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.profile-ref-farm-heading>span {color:#beffb5;font-size:.74rem;letter-spacing:.06em;font-weight:900}
.profile-ref-farm-heading>strong {font-size:clamp(1.3rem,2.4vw,2rem);font-weight:1000;line-height:1.1}
.profile-ref-farm-heading>small {font-size:.79rem;color:#d2eedd}
.profile-ref-farm-stats {position:relative;z-index:1;display:flex;align-items:center;gap:13px;min-width:0}
.profile-ref-farm-rank {flex-shrink:0;display:flex;align-items:center;justify-content:center;flex-direction:column;width:76px;height:76px;border:4px solid #adff80;border-radius:50%;background:rgba(10,48,31,.79);box-shadow:0 0 0 4px rgba(125,241,122,.16),0 0 25px rgba(139,255,116,.16)}
.profile-ref-farm-rank>small {font-size:.58rem;font-weight:850;color:#c3ffb8}
.profile-ref-farm-rank>b {font-size:1.65rem;line-height:1.2;font-weight:1000}
.profile-ref-farm-xp {display:grid;gap:8px;min-width:0;flex:1}
.profile-ref-farm-xp>small {font-size:.81rem;font-weight:900;color:#f5fff0}
.profile-ref-farm-xp>i {display:block;width:100%;height:9px;border-radius:30px;background:#153d35;overflow:hidden}
.profile-ref-farm-xp>i>u {display:block;height:100%;background:linear-gradient(90deg,#73e9a1,#cbff79);border-radius:inherit}
.profile-ref-farm-xp>em {font-size:.67rem;font-weight:800;font-style:normal;color:#b7dec7}
.profile-ref-farm-open {position:relative;z-index:2;display:inline-flex;justify-content:center;align-items:center;gap:8px;min-height:40px;min-width:135px;padding:9px 14px;border-radius:11px;background:linear-gradient(110deg,#cefc73,#80d54a);color:#143922;text-decoration:none;font-size:.79rem;font-weight:950;white-space:nowrap}
.profile-ref-farm-open:hover {filter:brightness(1.08)}
@media(max-width:950px) {
    .profile-ref-farm-panel {grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:15px}
    .profile-ref-farm-open {grid-column:1/-1;justify-self:start}
}
@media(max-width:700px) {
    body.is-play-root .dxf-play-feature-grid {gap:8px}
    body.is-play-root .dxf-play-feature,body.is-play-root .dxf-play-farm-banner {min-height:252px;border-radius:15px}
    body.is-play-root .dxf-play-farm-banner-copy,body.is-play-root .dxf-play-pets-copy {min-height:252px;padding:12px 10px;gap:6px}
    body.is-play-root .dxf-play-farm-banner-copy {max-width:87%}
    body.is-play-root .dxf-play-farm-logo {height:102px;width:min(100%,150px)}
    body.is-play-root .dxf-play-farm-landscape {width:100%;right:-29%;bottom:-10%;height:84%;opacity:.65}
    body.is-play-root .dxf-play-farm-banner::before {background:linear-gradient(90deg,rgba(1,27,31,.94),rgba(4,52,48,.66) 60%,rgba(10,76,45,.15))}
    body.is-play-root .dxf-play-farm-banner-eyebrow,body.is-play-root .dxf-play-pets-eyebrow {font-size:.61rem;letter-spacing:0;gap:5px}
    body.is-play-root .dxf-play-farm-banner-subtitle,body.is-play-root .dxf-play-pets-subtitle {font-size:.69rem;line-height:1.28}
    body.is-play-root .dxf-play-farm-banner-action,body.is-play-root .dxf-play-pets-action {min-height:31px;font-size:.66rem;padding:7px 8px;gap:6px;border-radius:9px}
    body.is-play-root .dxf-play-pets-copy {max-width:88%}
    body.is-play-root .dxf-play-farm-banner-action,body.is-play-root .dxf-play-pets-action {white-space:normal;text-align:center;line-height:1.1}
    body.is-play-root .dxf-play-pets-copy>strong {font-size:clamp(1.35rem,5vw,1.8rem)}
    body.is-play-root .dxf-play-pets-art {width:110%;right:-45%;height:90%;bottom:-16%;opacity:.9}
    body.is-play-root .dxf-play-quick-grid {gap:7px}
    body.is-play-root .dxf-play-quick-card {min-height:104px;grid-template-columns:28px minmax(0,1fr);gap:6px;padding:9px 8px;border-radius:12px}
    body.is-play-root .dxf-play-quick-icon {width:28px;height:28px;font-size:.85rem;border-radius:9px}
    body.is-play-root .dxf-play-quick-copy {gap:4px}
    body.is-play-root .dxf-play-quick-copy strong {font-size:.73rem}
    body.is-play-root .dxf-play-quick-copy small,body.is-play-root .dxf-play-quick-copy em {font-size:.6rem}
    body.is-play-root .dxf-play-quick-arrow {display:none}
    body.is-play-root .dxf-play-kart-quick {grid-template-columns:26px minmax(0,1fr)}
    body.is-play-root .dxf-play-quick-race-link>i {font-size:.65rem}
    body.is-play-root .dxf-play-kart-claim button {font-size:.63rem;padding:6px 7px}
    body.is-play-root .dxf-play-arena-feature {min-height:162px;padding:14px;border-radius:15px}
    body.is-play-root .dxf-play-arena-feature-copy {max-width:72%;gap:6px}
    body.is-play-root .dxf-play-arena-feature-copy>strong {font-size:2.25rem}
    body.is-play-root .dxf-play-arena-feature-copy>small {font-size:.63rem}
    body.is-play-root .dxf-play-arena-feature-copy>span {font-size:.68rem}
    body.is-play-root .dxf-play-arena-feature-copy>b {min-height:30px;padding:7px 11px;font-size:.69rem}
    .profile-ref-page>.profile-ref-hero .profile-ref-hero-avatar {left:0;width:42%;height:86%;max-width:none}
    .profile-ref-page>.profile-ref-hero>.pet-avatar-companion {left:11%;width:clamp(95px,28vw,140px);height:clamp(95px,28vw,140px)}
    .profile-ref-farm-panel {grid-template-columns:minmax(0,1fr) auto;padding:13px;gap:11px;min-height:122px;border-radius:15px}
    .profile-ref-farm-heading {grid-column:1 / -1;gap:3px}
    .profile-ref-farm-heading>strong {font-size:1.18rem}
    .profile-ref-farm-heading>small {font-size:.67rem}
    .profile-ref-farm-stats {gap:9px}
    .profile-ref-farm-rank {width:55px;height:55px;border-width:3px}
    .profile-ref-farm-rank>small {font-size:.44rem}
    .profile-ref-farm-rank>b {font-size:1.16rem}
    .profile-ref-farm-xp>small {font-size:.67rem}
    .profile-ref-farm-xp>em {font-size:.58rem}
    .profile-ref-farm-open {grid-column:2;min-width:0;font-size:.64rem;padding:8px;white-space:normal;line-height:1.15;max-width:110px}
    .profile-ref-farm-art {width:60%;right:-20%;height:140%;bottom:-20%}
}
@media(max-width:390px) {
    body.is-play-root .dxf-play-feature,body.is-play-root .dxf-play-farm-banner {min-height:236px}
    body.is-play-root .dxf-play-farm-banner-copy,body.is-play-root .dxf-play-pets-copy {min-height:236px;padding:10px 7px}
    body.is-play-root .dxf-play-farm-banner-action,body.is-play-root .dxf-play-pets-action {font-size:.59rem}
    body.is-play-root .dxf-play-pets-copy>strong {font-size:1.25rem}
    body.is-play-root .dxf-play-quick-card {padding:8px 6px;grid-template-columns:24px minmax(0,1fr);gap:4px}
    body.is-play-root .dxf-play-quick-icon {width:24px;height:24px;font-size:.76rem}
    body.is-play-root .dxf-play-quick-copy strong {font-size:.67rem}
}
@media(prefers-reduced-motion: reduce) {
    body.is-play-root .dxf-play-feature,body.is-play-root .dxf-play-quick-card,body.is-play-root .dxf-play-arena-feature {transition:none}
}

body.is-play-root .dxf-play-scene-art {position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;object-position:center;pointer-events:none}
body.is-play-root .dxf-play-farm-banner>.dxf-play-scene-art {opacity:.88}
body.is-play-root .dxf-play-farm-banner::before {z-index:1}
body.is-play-root .dxf-play-arena-feature>.dxf-play-scene-art {z-index:-1;opacity:.9}


body.is-play-root .dxf-play-feature .dxf-play-scene-art {
    z-index: 0;
    opacity: .98;
}
body.is-play-root .dxf-play-farm-banner {
    border-color: rgba(102, 214, 255, .42);
    background: linear-gradient(120deg, #071529 0%, #0b1d3d 56%, #0b2143 100%);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.06), 0 18px 38px rgba(0,0,0,.3);
}
body.is-play-root .dxf-play-farm-banner::before {
    z-index: 1;
    background: linear-gradient(90deg, rgba(4, 12, 28, .96) 0%, rgba(7, 16, 35, .86) 42%, rgba(9, 29, 56, .34) 70%, rgba(10, 35, 61, .10) 100%), radial-gradient(circle at 82% 18%, rgba(83, 208, 255, .22), transparent 34%);
}
body.is-play-root .dxf-play-farm-banner::after {
    background: rgba(82, 192, 255, .12);
}
body.is-play-root .dxf-play-farm-banner-eyebrow { color: #8de5ff; }
body.is-play-root .dxf-play-farm-banner-subtitle { color: #eef7ff; text-shadow: 0 2px 9px rgba(0,0,0,.55); }
body.is-play-root .dxf-play-farm-banner-action {
    background: linear-gradient(180deg, #d7ff78, #91d949);
    color: #173e1f;
}
body.is-play-root .dxf-play-farm-banner>.dxf-play-scene-art { opacity: .94; object-position: center; }
body.is-play-root .dxf-play-pets-feature {
    border-color: rgba(241, 105, 255, .62);
    background: linear-gradient(120deg, #120b35 0%, #241655 58%, #162a5c 100%);
}
body.is-play-root .dxf-play-pets-feature::before {
    background: linear-gradient(90deg, rgba(11, 11, 34, .96) 0%, rgba(18, 14, 50, .85) 43%, rgba(25, 19, 69, .32) 72%, rgba(25, 20, 66, .08) 100%), radial-gradient(circle at 84% 12%, rgba(255, 120, 233, .22), transparent 30%);
}
body.is-play-root .dxf-play-pets-feature>.dxf-play-scene-art { opacity: .94; object-position: center; }
body.is-play-root .dxf-play-pets-copy strong,
body.is-play-root .dxf-play-pets-subtitle {
    text-shadow: 0 3px 12px rgba(0,0,0,.45);
}
body.is-play-root .dxf-play-arena-feature {
    min-height: 248px;
    border-color: rgba(162, 125, 255, .52);
    background: linear-gradient(120deg, #080d2a 0%, #150f43 55%, #0e1d49 100%);
    overflow: hidden;
}
body.is-play-root .dxf-play-arena-feature::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background: linear-gradient(90deg, rgba(5, 8, 27, .97) 0%, rgba(10, 11, 40, .88) 40%, rgba(12, 18, 57, .42) 70%, rgba(13, 22, 60, .10) 100%), radial-gradient(circle at 78% 20%, rgba(255, 0, 214, .16), transparent 28%), radial-gradient(circle at 82% 75%, rgba(0, 212, 255, .18), transparent 25%);
}
body.is-play-root .dxf-play-arena-feature>.dxf-play-scene-art {
    z-index: -1;
    opacity: .93;
    object-position: center;
}
body.is-play-root .dxf-play-arena-feature-copy {
    max-width: 52%;
    gap: 12px;
}
body.is-play-root .dxf-play-arena-feature-copy > strong {
    font-size: clamp(2.6rem, 4.8vw, 4.4rem);
    text-shadow: 0 4px 18px rgba(0,0,0,.35);
}
body.is-play-root .dxf-play-arena-feature-copy > span { max-width: 460px; }
body.is-play-root .dxf-play-arena-feature-copy > b {
    box-shadow: 0 10px 20px rgba(0,0,0,.24);
}
.profile-ref-page > .profile-ref-hero .profile-ref-hero-avatar {
    left: 1.2%;
    width: 43%;
    height: 97%;
    max-width: 520px;
}
.profile-ref-page > .profile-ref-hero .profile-ref-main-avatar-shell > img.profile-ref-main-avatar,
.profile-ref-page > .profile-ref-hero .profile-ref-main-avatar-shell > video.profile-ref-main-avatar,
.profile-ref-page > .profile-ref-hero .profile-ref-hero-avatar > img.profile-ref-main-avatar {
    transform: scale(1.08) translateY(1%) !important;
}
.profile-ref-page > .profile-ref-hero > .pet-avatar-companion {
    left: 24%;
    bottom: 2%;
    width: clamp(128px, 15vw, 198px);
    height: clamp(128px, 15vw, 198px);
}
.profile-ref-page > .profile-ref-hero .profile-ref-hero-copy {
    padding: 58px 170px 46px 41%;
}
.profile-ref-page > .profile-ref-hero .profile-ref-level-badge {
    width: 120px;
    height: 116px;
}
.profile-ref-farm-panel {
    border-color: rgba(107, 220, 255, .46);
    background: linear-gradient(125deg, #07152d, #0d2240 56%, #10284a);
    box-shadow: 0 14px 32px rgba(0,0,0,.23);
}
.profile-ref-farm-panel::before {
    z-index: 0;
    background: linear-gradient(90deg, rgba(4, 13, 30, .95), rgba(6, 18, 40, .82), rgba(10, 28, 53, .46));
}
.profile-ref-farm-bg {
    position: absolute;
    inset: 0;
    z-index: -2;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    opacity: .55;
    pointer-events: none;
}
.profile-ref-farm-art {
    right: -1%;
    bottom: -35%;
    width: 33%;
    opacity: .68;
}
.profile-ref-farm-heading > span { color: #98e8ff; }
.profile-ref-farm-rank {
    border-color: #8be7ff;
    background: rgba(7, 26, 50, .82);
    box-shadow: 0 0 0 4px rgba(87, 201, 255, .14), 0 0 24px rgba(87, 201, 255, .12);
}
.profile-ref-farm-rank > small { color: #b8f0ff; }
.profile-ref-farm-xp > i { background: rgba(10, 33, 56, .78); }
.profile-ref-farm-xp > i > u { background: linear-gradient(90deg, #53d0ff, #b0ff6d); }
@media(max-width:700px) {
    body.is-play-root .dxf-play-farm-banner,
    body.is-play-root .dxf-play-pets-feature { min-height: 258px; }
    body.is-play-root .dxf-play-farm-banner::before {
        background: linear-gradient(90deg, rgba(4, 12, 28, .95) 0%, rgba(7, 16, 35, .84) 52%, rgba(9, 29, 56, .30) 76%, rgba(10, 35, 61, .08) 100%);
    }
    body.is-play-root .dxf-play-pets-feature::before {
        background: linear-gradient(90deg, rgba(11, 11, 34, .95) 0%, rgba(18, 14, 50, .82) 52%, rgba(25, 19, 69, .28) 76%, rgba(25, 20, 66, .06) 100%);
    }
    body.is-play-root .dxf-play-farm-banner-copy,
    body.is-play-root .dxf-play-pets-copy {
        max-width: 94%;
        min-height: 258px;
        padding: 14px 11px;
    }
    body.is-play-root .dxf-play-farm-logo { width: min(100%, 164px); height: 106px; }
    body.is-play-root .dxf-play-farm-landscape { width: 106%; right: -30%; bottom: -7%; height: 88%; opacity: .72; }
    body.is-play-root .dxf-play-pets-art { width: 108%; right: -42%; height: 95%; bottom: -14%; opacity: .94; }
    body.is-play-root .dxf-play-arena-feature {
        min-height: 186px;
        padding: 16px 14px;
    }
    body.is-play-root .dxf-play-arena-feature-copy {
        max-width: 82%;
        gap: 7px;
    }
    body.is-play-root .dxf-play-arena-feature-copy > strong { font-size: 2rem; }
    body.is-play-root .dxf-play-arena-feature-copy > span { max-width: 235px; }
    .profile-ref-page > .profile-ref-hero .profile-ref-hero-avatar {
        left: 1%;
        width: 52%;
        height: 92%;
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-main-avatar-shell > img.profile-ref-main-avatar,
    .profile-ref-page > .profile-ref-hero .profile-ref-main-avatar-shell > video.profile-ref-main-avatar,
    .profile-ref-page > .profile-ref-hero .profile-ref-hero-avatar > img.profile-ref-main-avatar {
        transform: scale(1.14) translateY(1%) !important;
    }
    .profile-ref-page > .profile-ref-hero > .pet-avatar-companion {
        left: 16%;
        bottom: 1%;
        width: clamp(92px, 27vw, 132px);
        height: clamp(92px, 27vw, 132px);
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-hero-copy {
        min-height: 350px;
        padding: 74px 12px 20px 43%;
        gap: 7px;
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-hero-copy h1 { font-size: clamp(1.8rem, 9vw, 2.7rem); }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-row { grid-template-columns: 66px minmax(120px, 1fr); gap: 9px; }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-orb {
        width: 66px;
        height: 66px;
        border-width: 4px;
        box-shadow: 0 0 0 4px rgba(137,60,255,.35), 0 0 20px rgba(38,224,255,.34);
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-orb b { font-size: 1.55rem; }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-copy small { font-size: .67rem; }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-copy > b { font-size: .64rem; }
    .profile-ref-page > .profile-ref-hero .profile-ref-hero-actions {
        right: 10px;
        top: 10px;
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-edit-button {
        min-height: 34px;
        padding: 0 11px;
        font-size: .62rem;
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-badge {
        right: 10px;
        bottom: 10px;
        width: 82px;
        height: 82px;
        border-radius: 14px;
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-badge > i { font-size: 1.7rem; }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-badge small { font-size: .5rem; }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-badge b { font-size: .58rem; }
    .profile-ref-farm-panel {
        grid-template-columns: minmax(0, 1fr) auto;
        min-height: 126px;
    }
    .profile-ref-farm-art { width: 62%; right: -21%; bottom: -19%; opacity: .72; }
}
@media(max-width:390px) {
    body.is-play-root .dxf-play-farm-banner,
    body.is-play-root .dxf-play-pets-feature { min-height: 244px; }
    body.is-play-root .dxf-play-farm-banner-copy,
    body.is-play-root .dxf-play-pets-copy { min-height: 244px; padding: 11px 8px; }
    body.is-play-root .dxf-play-arena-feature { min-height: 176px; }
    .profile-ref-page > .profile-ref-hero .profile-ref-hero-copy {
        padding: 74px 10px 18px 42%;
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-hero-avatar { width: 54%; }
}


body.is-play-root .dxf-play-pets-feature.has-pets-backdrop > .dxf-play-scene-art {
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: 76% center !important;
    opacity: 1 !important;
}
body.is-play-root .dxf-play-pets-feature.has-pets-backdrop > .dxf-play-pets-art {
    display: none !important;
}
body.is-play-root .dxf-play-pets-feature.has-pets-backdrop::before {
    z-index: 1;
    background: linear-gradient(90deg, rgba(7,7,28,.94) 0%, rgba(13,11,43,.86) 31%, rgba(15,9,41,.48) 66%, rgba(15,9,41,.12) 100%);
}
body.is-play-root .dxf-play-pets-feature.has-pets-backdrop .dxf-play-pets-copy {
    z-index: 3;
    position: relative;
}
body.is-play-root a.dxf-play-arena-feature.dxf-play-full-bg {
    position: relative;
    display: flex;
    align-items: center;
    isolation: isolate;
    overflow: hidden;
}
body.is-play-root a.dxf-play-arena-feature.dxf-play-full-bg > .dxf-play-scene-art {
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    opacity: .94 !important;
    pointer-events: none;
}
body.is-play-root a.dxf-play-arena-feature.dxf-play-full-bg > .dxf-play-card-bg {
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
}
body.is-play-root a.dxf-play-arena-feature.dxf-play-full-bg::before {
    z-index: 1;
}
body.is-play-root a.dxf-play-arena-feature.dxf-play-full-bg::after {
    z-index: 2;
}
body.is-play-root a.dxf-play-arena-feature.dxf-play-full-bg > .dxf-play-arena-feature-copy {
    position: relative !important;
    z-index: 4 !important;
    display: flex !important;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    justify-items: start;
    gap: 11px;
    min-width: 0;
    max-width: min(560px, 63%);
    width: auto;
    padding: 0 !important;
    margin: 0;
    border: none;
    background: transparent !important;
    color: #fff !important;
    opacity: 1 !important;
    visibility: visible !important;
    text-align: left !important;
    pointer-events: none;
}
body.is-play-root .dxf-play-arena-feature-copy > small,
body.is-play-root .dxf-play-arena-feature-copy > strong,
body.is-play-root .dxf-play-arena-feature-copy > span,
body.is-play-root .dxf-play-arena-feature-copy > b {
    position: relative;
    display: block;
    color: #fff;
    opacity: 1;
    visibility: visible;
    text-align: left;
}
body.is-play-root .dxf-play-arena-feature-copy > small {
    color: #f3b5ff;
    font-size: clamp(.72rem, 1.1vw, .9rem);
}
body.is-play-root .dxf-play-arena-feature-copy > strong {
    font-size: clamp(2rem, 4.2vw, 3.8rem);
    line-height: 1.04;
}
body.is-play-root .dxf-play-arena-feature-copy > span {
    font-size: clamp(.82rem, 1.2vw, 1rem);
    line-height: 1.35;
    color: #e9e6ff;
}
body.is-play-root .dxf-play-arena-feature-copy > b {
    display: inline-flex !important;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    border-radius: 12px;
    background: linear-gradient(110deg,#c122f4,#f32ed5);
    box-shadow: 0 8px 18px rgba(0,0,0,.3);
    font-size: .88rem;
    white-space: nowrap;
}
@media(max-width:700px) {
    body.is-play-root .dxf-play-pets-feature.has-pets-backdrop > .dxf-play-scene-art {
        object-position: 80% center !important;
    }
    body.is-play-root .dxf-play-pets-feature.has-pets-backdrop::before {
        background: linear-gradient(90deg,rgba(7,7,28,.93),rgba(12,9,41,.80) 44%,rgba(17,11,47,.12));
    }
    body.is-play-root a.dxf-play-arena-feature.dxf-play-full-bg > .dxf-play-arena-feature-copy {
        max-width: 89%;
        gap: 6px;
    }
    body.is-play-root .dxf-play-arena-feature-copy > small { font-size: .65rem; }
    body.is-play-root .dxf-play-arena-feature-copy > strong { font-size: clamp(1.55rem, 7vw, 2.15rem); }
    body.is-play-root .dxf-play-arena-feature-copy > span { font-size: .7rem; max-width: 245px; }
    body.is-play-root .dxf-play-arena-feature-copy > b { font-size: .72rem; padding: 8px 12px; }
}


.profile-ref-page {
    width: min(100%, 1280px);
    max-width: 100%;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr);
}
.profile-ref-page > .profile-ref-hero {
    box-sizing: border-box;
    position: relative;
    width: 100% !important;
    max-width: none !important;
    min-width: 0;
    margin: 0 !important;
    padding: 0 !important;
    justify-self: stretch;
    align-self: stretch;
    min-height: 430px;
    overflow: hidden;
}
.profile-ref-page > .profile-ref-hero .profile-ref-hero-copy {
    box-sizing: border-box;
    width: 100%;
    max-width: none;
    min-width: 0;
    min-height: 430px;
    padding: 74px 165px 44px 40%;
    align-content: center;
}
.profile-ref-page > .profile-ref-hero .profile-ref-hero-avatar {
    box-sizing: border-box;
    left: 2%;
    width: 36%;
    height: 96%;
    max-width: 475px;
    bottom: 0;
    overflow: visible !important;
    align-items: flex-end;
    justify-content: center;
}
.profile-ref-page > .profile-ref-hero .profile-ref-main-avatar-shell,
.profile-ref-page > .profile-ref-hero .profile-ref-main-avatar {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
}
.profile-ref-page > .profile-ref-hero .profile-ref-main-avatar-shell > img.profile-ref-main-avatar,
.profile-ref-page > .profile-ref-hero .profile-ref-main-avatar-shell > video.profile-ref-main-avatar,
.profile-ref-page > .profile-ref-hero .profile-ref-hero-avatar > img.profile-ref-main-avatar {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center bottom !important;
    transform: none !important;
}
.profile-ref-page > .profile-ref-hero > .pet-avatar-companion {
    left: 26%;
    bottom: 1%;
    width: clamp(120px, 13vw, 192px);
    height: clamp(120px, 13vw, 192px);
    z-index: 4;
}
.profile-ref-page > .profile-ref-hero .profile-ref-hero-copy h1 {
    max-width: 100%;
    overflow-wrap: anywhere;
}
.profile-ref-page > .profile-ref-hero .profile-ref-level-row {
    max-width: 100%;
    min-width: 0;
}
.profile-ref-page > .profile-ref-hero .profile-ref-level-copy {
    min-width: 0;
}
@media (max-width: 1050px) and (min-width: 721px) {
    .profile-ref-page > .profile-ref-hero .profile-ref-hero-copy {
        padding: 62px 125px 40px 41%;
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-row {
        grid-template-columns: 70px minmax(0, 1fr);
        gap: 10px;
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-orb {
        width: 70px;
        height: 70px;
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-badge {
        right: 14px;
        bottom: 14px;
        width: 90px;
        height: 90px;
    }
}
@media (max-width: 720px) {
    .profile-ref-page { min-width: 0; padding-inline: 0; }
    .profile-ref-page > .profile-ref-hero,
    .profile-ref-page > .profile-ref-hero.is-editing {
        width: 100% !important;
        max-width: none !important;
        min-height: 435px;
        border-radius: 18px;
        padding: 0 !important;
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-hero-copy,
    .profile-ref-page > .profile-ref-hero.is-editing .profile-ref-hero-copy {
        position: relative;
        z-index: 5;
        display: grid;
        align-content: start;
        justify-items: start;
        width: 100%;
        min-width: 0;
        min-height: 435px;
        padding: 66px 13px 225px;
        gap: 7px;
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-status {
        font-size: .69rem;
        line-height: 1.1;
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-hero-copy h1 {
        margin: 0;
        max-width: 100%;
        font-size: clamp(1.75rem, 8.6vw, 2.55rem);
        line-height: 1.08;
        overflow-wrap: anywhere;
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-title-pill {
        max-width: calc(100% - 6px);
        font-size: .66rem;
        padding: 6px 10px;
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-tagline {
        max-width: min(96%, 270px);
        margin: 0;
        font-size: .72rem;
        line-height: 1.3;
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-hero-avatar {
        position: absolute;
        left: 0;
        bottom: 0;
        width: 58%;
        height: 56%;
        max-width: none;
        overflow: visible !important;
    }
    .profile-ref-page > .profile-ref-hero > .pet-avatar-companion {
        left: 20%;
        bottom: 2%;
        width: clamp(92px, 30vw, 142px);
        height: clamp(92px, 30vw, 142px);
        z-index: 4;
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-row {
        position: absolute;
        z-index: 6;
        right: 10px;
        bottom: 114px;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 8px;
        width: 39%;
        min-width: 0;
        max-width: 160px;
        margin: 0;
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-orb {
        width: 62px;
        height: 62px;
        border-width: 4px;
        box-shadow: 0 0 0 3px rgba(137,60,255,.40), 0 0 16px rgba(38,224,255,.40);
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-orb b { font-size: 1.45rem; }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-copy {
        display: grid;
        width: 100%;
        min-width: 0;
        gap: 4px;
        text-align: center;
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-copy small { font-size: .62rem; }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-copy > b {
        justify-self: center;
        white-space: nowrap;
        font-size: .55rem;
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-copy > i { width: 100%; height: 8px; }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-badge {
        right: 10px;
        bottom: 9px;
        width: 78px;
        height: 69px;
        border-radius: 12px;
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-badge > i { font-size: 1.45rem; }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-badge small { font-size: .49rem; }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-badge b { font-size: .55rem; }
    .profile-ref-page > .profile-ref-hero .profile-ref-hero-actions { top: 10px; right: 10px; }
    .profile-ref-page > .profile-ref-hero .profile-ref-edit-button,
    .profile-ref-page > .profile-ref-hero .profile-ref-secondary-button {
        min-height: 34px;
        font-size: .63rem;
        padding: 0 10px;
    }
    .profile-ref-page > .profile-ref-hero .profile-ref-hero-bg:after {
        background: linear-gradient(180deg, rgba(3,11,31,.28), rgba(3,11,31,.48) 40%, rgba(3,11,31,.16) 85%);
    }
}
@media (max-width: 340px) {
    .profile-ref-page > .profile-ref-hero,
    .profile-ref-page > .profile-ref-hero.is-editing { min-height: 442px; }
    .profile-ref-page > .profile-ref-hero .profile-ref-hero-copy,
    .profile-ref-page > .profile-ref-hero.is-editing .profile-ref-hero-copy { min-height: 442px; }
    .profile-ref-page > .profile-ref-hero .profile-ref-hero-copy h1 { font-size: 1.7rem; }
    .profile-ref-page > .profile-ref-hero .profile-ref-level-row { width: 41%; right: 8px; }
    .profile-ref-page > .profile-ref-hero > .pet-avatar-companion { left: 19%; }
}