/* === Enraged Rarity Card Styles === */
/* Shared across all pages that render cards */

.enraged .card-wrapper {
    box-shadow: 0 0 20px rgba(255,80,20,0.4), 0 0 50px rgba(255,60,10,0.15);
    border-radius: 10px;
}

@keyframes enraged-border-flicker {
    0%, 100% { box-shadow: 0 0 15px rgba(255,80,20,0.4), 0 0 35px rgba(255,120,40,0.2), 0 0 70px rgba(255,60,10,0.1); border-color: #ff6020; }
    25% { box-shadow: 0 0 20px rgba(255,100,30,0.5), 0 0 50px rgba(255,140,50,0.3), 0 0 90px rgba(255,80,20,0.15); border-color: #ff7830; }
    50% { box-shadow: 0 0 25px rgba(255,60,10,0.6), 0 0 55px rgba(255,100,30,0.35), 0 0 100px rgba(255,50,0,0.18); border-color: #ff5010; }
    75% { box-shadow: 0 0 18px rgba(255,120,40,0.45), 0 0 40px rgba(255,80,20,0.25), 0 0 80px rgba(255,60,10,0.12); border-color: #ff6828; }
}
@keyframes enraged-flame-rise {
    0% { transform: translateX(-50%) scaleY(0.8) scaleX(1); opacity: 0.7; }
    50% { transform: translateX(-50%) scaleY(1.15) scaleX(0.9); opacity: 1; }
    100% { transform: translateX(-50%) scaleY(0.8) scaleX(1); opacity: 0.7; }
}
@keyframes enraged-flame-rise-alt {
    0% { transform: translateX(-50%) scaleY(1) scaleX(0.95); opacity: 0.8; }
    50% { transform: translateX(-50%) scaleY(0.75) scaleX(1.05); opacity: 0.6; }
    100% { transform: translateX(-50%) scaleY(1) scaleX(0.95); opacity: 0.8; }
}
@keyframes enraged-ember-float {
    0% { transform: translateY(0) scale(1); opacity: 1; }
    100% { transform: translateY(-40px) scale(0.3); opacity: 0; }
}
@keyframes enraged-gem-molten {
    0%, 100% { filter: drop-shadow(0 0 8px rgba(255,80,20,0.6)); }
    33% { filter: drop-shadow(0 0 14px rgba(255,200,60,0.8)); }
    66% { filter: drop-shadow(0 0 10px rgba(255,120,30,0.7)); }
}
@keyframes enraged-banner-heat {
    0%, 100% { box-shadow: inset 0 1px 0 rgba(255,200,100,0.4), inset 0 -1px 0 rgba(255,100,30,0.3), 0 0 12px rgba(255,80,20,0.4), 0 0 30px rgba(255,60,10,0.2), 0 4px 10px rgba(0,0,0,0.7); }
    50% { box-shadow: inset 0 1px 0 rgba(255,220,120,0.5), inset 0 -1px 0 rgba(255,120,40,0.4), 0 0 20px rgba(255,100,30,0.6), 0 0 45px rgba(255,80,20,0.3), 0 4px 10px rgba(0,0,0,0.7); }
}
@keyframes enraged-shimmer {
    0% { left: -60%; }
    100% { left: 120%; }
}

.enraged .card-border {
    position: absolute; inset: 0; border: 3px solid #ff6020;
    border-radius: 10px; pointer-events: none; z-index: 4;
    animation: enraged-border-flicker 2s ease-in-out infinite;
}

/* Fire shimmer overlay */
.enraged-shimmer-overlay {
    position: absolute;
    inset: 0;
    border-radius: 8px;
    overflow: hidden;
    z-index: 30;
    pointer-events: none;
}
.enraged-shimmer-overlay::after {
    content: '';
    position: absolute;
    top: 0; left: -60%; width: 40%; height: 100%;
    background: linear-gradient(90deg, transparent 0%, rgba(255,180,80,0.06) 30%, rgba(255,220,150,0.14) 50%, rgba(255,180,80,0.06) 70%, transparent 100%);
    animation: enraged-shimmer 3s ease-in-out infinite;
}

/* Flame elements rising from bottom of card */
.enraged-flame {
    position: absolute;
    bottom: -4px;
    width: 60px; height: 50px;
    border-radius: 50% 50% 20% 20%;
    z-index: 5;
    pointer-events: none;
    filter: blur(3px);
}
.enraged-flame.f1 {
    left: 15%; height: 45px; width: 50px;
    background: radial-gradient(ellipse at 50% 80%, rgba(255,200,50,0.7) 0%, rgba(255,100,20,0.5) 40%, rgba(200,30,0,0.2) 70%, transparent 100%);
    animation: enraged-flame-rise 1.8s ease-in-out infinite;
}
.enraged-flame.f2 {
    left: 40%; height: 55px; width: 55px;
    background: radial-gradient(ellipse at 50% 80%, rgba(255,220,80,0.8) 0%, rgba(255,120,30,0.5) 40%, rgba(220,40,0,0.2) 70%, transparent 100%);
    animation: enraged-flame-rise-alt 1.5s ease-in-out infinite;
}
.enraged-flame.f3 {
    left: 65%; height: 48px; width: 52px;
    background: radial-gradient(ellipse at 50% 80%, rgba(255,180,40,0.7) 0%, rgba(255,90,15,0.5) 40%, rgba(190,25,0,0.2) 70%, transparent 100%);
    animation: enraged-flame-rise 2s ease-in-out infinite 0.4s;
}
.enraged-flame.f4 {
    left: 85%; height: 40px; width: 45px;
    background: radial-gradient(ellipse at 50% 80%, rgba(255,210,60,0.6) 0%, rgba(255,110,25,0.4) 40%, rgba(200,35,0,0.15) 70%, transparent 100%);
    animation: enraged-flame-rise-alt 1.7s ease-in-out infinite 0.2s;
}

/* Flame elements on top of card */
.enraged-flame-top {
    position: absolute;
    top: -4px;
    width: 50px; height: 40px;
    border-radius: 20% 20% 50% 50%;
    z-index: 5;
    pointer-events: none;
    filter: blur(3px);
    transform: rotate(180deg);
}
.enraged-flame-top.ft1 {
    left: 25%; height: 35px; width: 45px;
    background: radial-gradient(ellipse at 50% 80%, rgba(255,180,40,0.5) 0%, rgba(255,80,15,0.3) 40%, rgba(180,20,0,0.1) 70%, transparent 100%);
    animation: enraged-flame-rise 2.2s ease-in-out infinite 0.3s;
}
.enraged-flame-top.ft2 {
    left: 55%; height: 38px; width: 48px;
    background: radial-gradient(ellipse at 50% 80%, rgba(255,200,50,0.5) 0%, rgba(255,100,20,0.3) 40%, rgba(200,30,0,0.1) 70%, transparent 100%);
    animation: enraged-flame-rise-alt 1.9s ease-in-out infinite 0.6s;
}

/* Side flame accents */
.enraged .card-inner-frame { border: 1px solid rgba(255,100,30,0.3); }
.enraged .card-side-accent-left,
.enraged .card-side-accent-right {
    background: linear-gradient(180deg, transparent 0%, rgba(255,80,20,0.25) 20%, rgba(255,120,40,0.5) 50%, rgba(255,80,20,0.25) 80%, transparent 100%);
}
.enraged .card-corner-dot { background: radial-gradient(circle, rgba(255,100,30,0.9) 0%, transparent 70%); box-shadow: 0 0 6px rgba(255,80,20,0.4); }

/* Art frame — fiery ring */
.enraged .card-art-container .card-art-frame {
    position: absolute; inset: 0; border: 3px solid #ff6020; border-radius: 50%;
    z-index: 2; pointer-events: none;
    box-shadow: inset 0 0 15px rgba(0,0,0,0.6), 0 0 20px rgba(255,80,20,0.5), 0 0 45px rgba(255,60,10,0.2);
}

/* Hide default rivets — replaced by ember gems */
.enraged .card-art-rivet { display: none; }

/* Ember mini-gems around the oval */
.enraged .mini-gem {
    position: absolute;
    width: 24px; height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 4;
}
.enraged .mini-gem.top { top: -12px; left: 50%; transform: translateX(-50%); }
.enraged .mini-gem.bottom { bottom: -12px; left: 50%; transform: translateX(-50%); }
.enraged .mini-gem.left { left: -12px; top: 50%; transform: translateY(-50%); }
.enraged .mini-gem.right { right: -12px; top: 50%; transform: translateY(-50%); }
.enraged .mini-gem::before {
    content: '';
    position: absolute;
    inset: -6px;
    border-radius: 50%;
    filter: blur(5px);
    z-index: -1;
    animation: mythic-gem-sparkle 2s ease-in-out infinite;
}
.enraged .mini-gem.top::before { background: radial-gradient(circle, rgba(255,200,50,0.7) 0%, transparent 70%); animation-delay: 0s; }
.enraged .mini-gem.bottom::before { background: radial-gradient(circle, rgba(255,60,10,0.7) 0%, transparent 70%); animation-delay: 0.5s; }
.enraged .mini-gem.left::before { background: radial-gradient(circle, rgba(255,140,30,0.7) 0%, transparent 70%); animation-delay: 1s; }
.enraged .mini-gem.right::before { background: radial-gradient(circle, rgba(255,100,20,0.7) 0%, transparent 70%); animation-delay: 1.5s; }

.enraged .mini-gem-frame {
    position: absolute; inset: 0;
    background: linear-gradient(180deg, #6a3010 0%, #4a1a08 40%, #301005 60%, #5a2810 100%);
    clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
    box-shadow: 0 2px 4px rgba(0,0,0,0.6);
}
.enraged .mini-gem-trim {
    position: absolute; inset: 3px;
    background: linear-gradient(180deg, #ff8030 0%, #cc4010 50%, #ff8030 100%);
    clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
}
.enraged .mini-gem-inner {
    width: calc(100% - 10px); height: calc(100% - 10px);
    clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
    position: relative; z-index: 1;
}
.enraged .mini-gem-inner::after {
    content: '';
    position: absolute;
    top: 0; left: 15%; right: 15%; height: 50%;
    background: linear-gradient(180deg, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0.05) 100%);
    clip-path: polygon(0% 0%, 100% 0%, 50% 100%);
    z-index: 1;
}
.enraged .mini-gem-inner.flame-white { background: linear-gradient(180deg, #ffffc0 0%, #ffe070 35%, #ffb830 65%, #ffe060 100%); }
.enraged .mini-gem-inner.flame-orange { background: linear-gradient(180deg, #ffb060 0%, #ff6820 35%, #cc3000 65%, #ff5818 100%); }
.enraged .mini-gem-inner.flame-red { background: linear-gradient(180deg, #ff8060 0%, #dd2010 35%, #8a0008 65%, #cc2018 100%); }
.enraged .mini-gem-inner.flame-crimson { background: linear-gradient(180deg, #ff6040 0%, #cc1800 35%, #700005 65%, #aa1810 100%); }

.enraged .card-art-corner { background: rgba(255,100,30,0.7); }

/* Scorched nameplate with glowing cracks */
.enraged .card-name-banner {
    background: linear-gradient(180deg, rgb(80,30,10) 0%, rgb(50,18,8) 15%, rgb(30,10,5) 50%, rgb(50,18,8) 85%, rgb(80,30,10) 100%);
    animation: enraged-banner-heat 2s ease-in-out infinite;
}
.enraged .card-name-banner::before, .enraged .card-name-banner::after {
    background: linear-gradient(135deg, #ffe080 0%, #ff8020 40%, #cc3000 70%, #ff6018 100%);
    border-radius: 0;
    clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
    animation: mythic-diamond-pulse 1.5s ease-in-out infinite;
}
.enraged .card-name-banner::after { animation-delay: 0.75s; }
.enraged .card-name { color: #ffe8c0; text-shadow: 0 0 12px rgba(255,100,20,0.7), 0 0 24px rgba(255,60,10,0.3), 0 1px 3px rgba(0,0,0,0.8); }

/* Molten gem — pulsing between orange and white-hot */
@keyframes gem-flame-left {
    0%, 100% { transform: rotate(-25deg) scaleY(0.8); opacity: 0.7; }
    50% { transform: rotate(-30deg) scaleY(1.2); opacity: 1; }
}
@keyframes gem-flame-right {
    0%, 100% { transform: rotate(25deg) scaleY(1.1); opacity: 0.8; }
    50% { transform: rotate(30deg) scaleY(0.7); opacity: 0.6; }
}
@keyframes gem-flame-center {
    0%, 100% { transform: scaleY(0.9) scaleX(1); opacity: 0.8; }
    50% { transform: scaleY(1.3) scaleX(0.85); opacity: 1; }
}
@keyframes gem-fire-pulse {
    0%, 100% { box-shadow: 0 0 8px rgba(255,80,20,0.5), 0 0 20px rgba(255,120,40,0.3), 0 -4px 12px rgba(255,180,60,0.2); }
    50% { box-shadow: 0 0 14px rgba(255,100,30,0.7), 0 0 30px rgba(255,140,50,0.4), 0 -8px 20px rgba(255,200,80,0.3); }
}
.enraged .rarity-gem { width: 32px; height: 32px; top: calc(67% - 12px); animation: enraged-gem-molten 2.5s ease-in-out infinite; }
/* Fiery aura behind gem */
.enraged .rarity-gem::before { background: radial-gradient(circle, rgba(255,100,20,0.8) 0%, rgba(255,60,10,0.4) 40%, transparent 70%); animation: mythic-gem-sparkle 1.2s ease-in-out infinite; inset: -8px; }
/* Flame tongues rising from the gem */
.enraged .rarity-gem::after {
    content: '';
    position: absolute;
    bottom: 40%; left: 50%; transform: translateX(-50%);
    width: 20px; height: 28px;
    background: radial-gradient(ellipse at 50% 90%, rgba(255,220,80,0.8) 0%, rgba(255,120,20,0.5) 40%, rgba(200,40,0,0.15) 70%, transparent 100%);
    border-radius: 50% 50% 20% 20%;
    filter: blur(2px);
    z-index: -1;
    animation: gem-flame-center 1.4s ease-in-out infinite;
}
.enraged .rarity-gem-frame { background: linear-gradient(180deg, #6a2808 0%, #4a1805 40%, #301003 60%, #5a2208 100%); clip-path: polygon(20% 0%, 80% 0%, 100% 20%, 100% 80%, 80% 100%, 20% 100%, 0% 80%, 0% 20%); animation: gem-fire-pulse 2s ease-in-out infinite; }
.enraged .rarity-gem-trim { background: linear-gradient(180deg, #ff8030 0%, #cc4010 50%, #ff8030 100%); clip-path: polygon(20% 0%, 80% 0%, 100% 20%, 100% 80%, 80% 100%, 20% 100%, 0% 80%, 0% 20%); }
.enraged .rarity-gem-inner { background: linear-gradient(180deg, #ffffa0 0%, #ffb040 35%, #ff6010 65%, #ffc050 100%); clip-path: polygon(20% 0%, 80% 0%, 100% 20%, 100% 80%, 80% 100%, 20% 100%, 0% 80%, 0% 20%); }
.enraged .rarity-gem-inner::after { clip-path: polygon(10% 0%, 90% 0%, 50% 100%); }
/* Side flame tongues */
.enraged .rarity-gem-frame::before {
    content: '';
    position: absolute;
    bottom: 30%; left: -6px;
    width: 14px; height: 22px;
    background: radial-gradient(ellipse at 50% 90%, rgba(255,200,60,0.6) 0%, rgba(255,100,15,0.3) 50%, transparent 100%);
    border-radius: 50% 50% 20% 20%;
    filter: blur(2px);
    z-index: -1;
    transform-origin: bottom center;
    animation: gem-flame-left 1.6s ease-in-out infinite;
}
.enraged .rarity-gem-frame::after {
    content: '';
    position: absolute;
    bottom: 30%; right: -6px;
    width: 14px; height: 22px;
    background: radial-gradient(ellipse at 50% 90%, rgba(255,200,60,0.6) 0%, rgba(255,100,15,0.3) 50%, transparent 100%);
    border-radius: 50% 50% 20% 20%;
    filter: blur(2px);
    z-index: -1;
    transform-origin: bottom center;
    animation: gem-flame-right 1.5s ease-in-out infinite;
}

/* Lore panel consistent */
.enraged .card-lore-panel {
    background: linear-gradient(180deg, rgb(100,92,78) 0%, rgb(55,48,38) 50%, rgb(100,92,78) 100%);
    border: 2px solid rgba(160,144,128,0.5);
}
.enraged .card-lore-panel::before { border-top: 1px solid rgba(255,100,30,0.4); border-left: 1px solid rgba(255,100,30,0.4); }
.enraged .card-lore-panel::after { border-bottom: 1px solid rgba(255,100,30,0.4); border-right: 1px solid rgba(255,100,30,0.4); }
.enraged .card-type-bar::before { background: linear-gradient(180deg, #ff8030 0%, #cc4010 50%, #ff8030 100%); }
.enraged .card-type-bar::after { background: linear-gradient(180deg, #301008 0%, #200a05 40%, #150503 60%, #281008 100%); }
.enraged .card-type-label { color: #ffd0a0; }
.enraged .stat-badge::before { background: linear-gradient(180deg, #ff8030 0%, #cc4010 50%, #a02808 100%); }
.enraged .stat-badge.atk::after { background: linear-gradient(180deg, #381810 0%, #281008 50%, #1a0a05 100%); }
.enraged .stat-badge.def::after { background: linear-gradient(180deg, #381410 0%, #280c08 50%, #1a0805 100%); }
.enraged .stat-badge .stat-value { color: #ffe0b0; }
.enraged .mana-badge { filter: drop-shadow(0 2px 6px rgba(255,80,20,0.5)); }
.enraged .mana-badge::before { background: linear-gradient(180deg, #ff8030 0%, #cc4010 50%, #a02808 100%); }
.enraged .mana-badge::after {
    background: linear-gradient(180deg, #281008 0%, #1c0a05 50%, #120503 100%);
    box-shadow: inset 0 0 8px rgba(255,80,20,0.4);
}
.enraged .mana-badge .mana-value {
    color: #ffd8a0;
    text-shadow: 0 0 10px rgba(255,80,20,0.5), 0 2px 4px rgba(0,0,0,0.7);
}
