/* 金幣／銀幣立繪 · 新素材 currency-coins-banner.png（左金右銀） */
:root {
    --void-coin-art: url('../images/ui/currency-coins-banner.png?v=3');
    --void-coin-spin-dur: 7s;
    --void-coin-glow-dur: 2.4s;
}

/* 外框：尺寸由 --xs/sm/md/lg 控制 */
.void-coin-icon {
    position: relative;
    display: inline-block;
    flex-shrink: 0;
    vertical-align: middle;
    border-radius: 50%;
    overflow: visible;
    transform-style: preserve-3d;
    transform-origin: center center;
    animation: voidCoinTilt var(--void-coin-spin-dur) ease-in-out infinite;
}

/* 正反雙面同一張幣圖，避免 Y 軸轉到 180° 時變成空白／異色 */
.void-coin-icon::before,
.void-coin-icon::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background-image: var(--void-coin-art);
    background-repeat: no-repeat;
    background-size: 200% 100%;
    backface-visibility: hidden;
    transform-style: preserve-3d;
    pointer-events: none;
}

.void-coin-icon::before {
    transform: rotateY(0deg);
    z-index: 2;
}

.void-coin-icon::after {
    transform: rotateY(180deg);
    z-index: 1;
}

.void-coin-icon--gold::before,
.void-coin-icon--gold::after {
    background-position: 0% 50%;
    box-shadow: inset 0 -2px 4px rgba(0, 0, 0, 0.4);
}

.void-coin-icon--silver::before,
.void-coin-icon--silver::after {
    background-position: 100% 50%;
    box-shadow: inset 0 -2px 4px rgba(0, 0, 0, 0.4);
}

/* 輕微左右搖擺（不翻 360°），避免側面光暈像立體球 */
@keyframes voidCoinTilt {
    0%, 100% { transform: rotateY(-14deg); }
    50% { transform: rotateY(14deg); }
}

.void-coin-icon--silver {
    animation-delay: 0.35s;
}

.void-coin-icon--xs {
    width: 20px;
    height: 20px;
}

.void-coin-icon--sm {
    width: 26px;
    height: 26px;
}

.void-coin-icon--md {
    width: 38px;
    height: 38px;
}

.void-coin-icon--lg {
    width: 52px;
    height: 52px;
}

.coin-reward-line {
    display: inline-flex;
    align-items: center;
    gap: 0.35em;
    vertical-align: middle;
}

.coin-reward-line__text {
    line-height: 1.2;
}

/* 頂部餘額大幣 */
.hdr-coin-visual-gold,
.hdr-coin-visual-silver {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    animation: coinFloat 2.8s ease-in-out infinite;
    overflow: visible;
}

.hdr-coin-visual-silver {
    animation-delay: 0.4s;
}

.hdr-coin-visual .void-coin-icon {
    width: 100%;
    height: 100%;
    filter: none;
}

/* 頂欄：隱藏舊版立體球高光層 */
.hdr-coin-visual .hdr-coin-shine {
    display: none !important;
}

.hdr-coin-visual .void-coin-icon::after {
    display: none;
}

.hdr-coin-visual .void-coin-icon--gold::before,
.hdr-coin-visual .void-coin-icon--silver::before {
    box-shadow: inset 0 -2px 4px rgba(0, 0, 0, 0.35);
}

.hdr-coin-visual .hdr-coin-face {
    display: none;
}

.hdr-coin-shine {
    display: none;
}

/* 抽卡機餘額列 */
.gacha-cur {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.gacha-cur .void-coin-icon--sm {
    width: 28px;
    height: 28px;
}

/* 卡機分頁圖標見 pool-tab-icons.css */

/* 召喚按鈕費用 */
.summon-btn__cost {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    flex-wrap: wrap;
}

.summon-btn__cost .void-coin-icon {
    flex-shrink: 0;
}

.summon-cost-line {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

.friends-reward-hint {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.coin-amount-text {
    white-space: nowrap;
}

/* 市集／任務 */
.market-balance {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
    width: 100%;
}

.market-balance__item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.market-filter-btn .void-coin-icon,
.btn-summon__cost .void-coin-icon,
.pity-chip--cur .void-coin-icon {
    vertical-align: middle;
}

.pity-chip--cur .void-coin-icon {
    width: 18px;
    height: 18px;
}

.market-price-unit {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.missions-coin-label .void-coin-icon--md {
    width: 42px;
    height: 42px;
}

.zone-reward-item .void-coin-icon {
    vertical-align: -0.2em;
}

.eng-task-reward-pill .void-coin-icon {
    width: 16px;
    height: 16px;
    vertical-align: -0.15em;
}

/* 領取／閃爍時加強亮光 */
.hdr-coin-gold.hdr-coin-flash .void-coin-icon::before,
.hdr-coin-silver.hdr-coin-flash .void-coin-icon::before {
    filter: brightness(1.12);
}

@media (prefers-reduced-motion: reduce) {
    .void-coin-icon {
        animation: none;
        filter: none;
    }
    .hdr-coin-visual-gold,
    .hdr-coin-visual-silver {
        animation: none;
    }
}

@media (max-width: 720px) {
    .missions-coin-label .void-coin-icon--md {
        width: 36px;
        height: 36px;
    }

    .missions-coin .void-coin-icon {
        animation: none;
    }
}
