/* Tier badge colors */
.tier-bg-common { background: #94a3b8; color: white; }
.tier-bg-uncommon { background: #22c55e; color: white; }
.tier-bg-rare { background: #3b82f6; color: white; }
.tier-bg-epic { background: #a855f7; color: white; text-shadow: 0 0 8px rgba(168,85,247,0.4); }
.tier-bg-legendary { background: linear-gradient(135deg, #f59e0b, #eab308); color: #1e293b; text-shadow: 0 0 8px rgba(245,158,11,0.4); }

/* Inline tier badges for dashboard cards */
.tier-badge-common { background: #e2e8f0; color: #64748b; }
.tier-badge-uncommon { background: #dcfce7; color: #16a34a; }
.tier-badge-rare { background: #dbeafe; color: #2563eb; }
.tier-badge-epic { background: #f3e8ff; color: #9333ea; }
.tier-badge-legendary { background: #fef3c7; color: #d97706; }

/* Tier dots */
.tier-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.tier-dot-common { background: #94a3b8; }
.tier-dot-uncommon { background: #22c55e; }
.tier-dot-rare { background: #3b82f6; }
.tier-dot-epic { background: #a855f7; box-shadow: 0 0 4px rgba(168,85,247,0.5); }
.tier-dot-legendary { background: #f59e0b; box-shadow: 0 0 6px rgba(245,158,11,0.5); }

/* Slot machine */
.slot-reel {
    border: 3px solid #334155;
}

.slot-strip {
    transition: transform 0.1s linear;
}

.slot-strip.stopping {
    transition: transform 0.8s cubic-bezier(0.23, 1, 0.32, 1);
}

.slot-item {
    border-bottom: 1px solid #e2e8f0;
}

/* Coin flip */
.coin {
    width: 160px;
    height: 160px;
    perspective: 800px;
    position: relative;
    transform-style: preserve-3d;
    transition: transform 2s ease-out;
}

.coin-face {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    backface-visibility: hidden;
    border: 4px solid #d4af37;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}

.coin-front {
    background: linear-gradient(135deg, #fef3c7, #fde68a);
}

.coin-back {
    background: linear-gradient(135deg, #e0e7ff, #c7d2fe);
    transform: rotateX(180deg);
}

.coin-spinning {
    animation: coinFlip 2s ease-out forwards;
}

@keyframes coinFlip {
    0% { transform: rotateX(0deg) translateY(0); }
    15% { transform: rotateX(540deg) translateY(-120px); }
    30% { transform: rotateX(1080deg) translateY(-80px); }
    50% { transform: rotateX(1620deg) translateY(-40px); }
    75% { transform: rotateX(1800deg) translateY(-10px); }
    100% { transform: rotateX(1800deg) translateY(0); }
}

.coin-spinning.land-back {
    animation: coinFlipBack 2s ease-out forwards;
}

@keyframes coinFlipBack {
    0% { transform: rotateX(0deg) translateY(0); }
    15% { transform: rotateX(540deg) translateY(-120px); }
    30% { transform: rotateX(1080deg) translateY(-80px); }
    50% { transform: rotateX(1620deg) translateY(-40px); }
    75% { transform: rotateX(1980deg) translateY(-10px); }
    100% { transform: rotateX(1980deg) translateY(0); }
}