/* Dragon Images CSS - Auto-generated */
.dragon-image {
    width: 100px;
    height: 100px;
    object-fit: cover;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3);
    transition: transform 0.2s ease;
}

.dragon-image:hover {
    transform: scale(1.05);
}

.dragon-card {
    position: relative;
}

.dragon-card img {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: 6px;
    border: 2px solid rgba(255,255,255,0.2);
}

.dragon-portrait {
    width: 120px;
    height: 120px;
    object-fit: cover;
    border-radius: 10px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.4);
}

/* Element-based fallback styles */
.dragon-fire { border-color: #f97316; box-shadow: 0 2px 8px rgba(249,115,22,0.4); }
.dragon-water { border-color: #06b6d4; box-shadow: 0 2px 8px rgba(6,182,212,0.4); }
.dragon-earth { border-color: #84cc16; box-shadow: 0 2px 8px rgba(132,204,22,0.4); }
.dragon-wind { border-color: #8b5cf6; box-shadow: 0 2px 8px rgba(139,92,246,0.4); }
.dragon-ice { border-color: #06b6d4; box-shadow: 0 2px 8px rgba(6,182,212,0.4); }
.dragon-light { border-color: #fbbf24; box-shadow: 0 2px 8px rgba(251,191,36,0.4); }
.dragon-shadow { border-color: #6b7280; box-shadow: 0 2px 8px rgba(107,114,128,0.4); }
.dragon-lightning { border-color: #eab308; box-shadow: 0 2px 8px rgba(234,179,8,0.4); }

.dragon-ates_ejderhasi {
    background-image: url('./assets/dragons/fire/ates_ejderhasi.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-ates_ejderhasi:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-su_koruyucusu {
    background-image: url('./assets/dragons/water/su_koruyucusu.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-su_koruyucusu:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-parlak_alev {
    background-image: url('./assets/dragons/fire/parlak_alev.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-parlak_alev:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-ates_krali {
    background-image: url('./assets/dragons/fire/ates_krali.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-ates_krali:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-gunes_tanrisi {
    background-image: url('./assets/dragons/fire/gunes_tanrisi.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-gunes_tanrisi:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-erimis_celik {
    background-image: url('./assets/dragons/fire/erimis_celik.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-erimis_celik:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-dalgacik {
    background-image: url('./assets/dragons/water/dalgacik.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-dalgacik:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-deniz_canavari {
    background-image: url('./assets/dragons/water/deniz_canavari.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-deniz_canavari:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-gelgit_ustasi {
    background-image: url('./assets/dragons/water/gelgit_ustasi.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-gelgit_ustasi:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-tas_golem {
    background-image: url('./assets/dragons/earth/tas_golem.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-tas_golem:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-toprak_devasi {
    background-image: url('./assets/dragons/earth/toprak_devasi.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-toprak_devasi:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-ana_toprak {
    background-image: url('./assets/dragons/earth/ana_toprak.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-ana_toprak:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-firtina_ruzgari {
    background-image: url('./assets/dragons/wind/firtina_ruzgari.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-firtina_ruzgari:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-hayalet_ruzgar {
    background-image: url('./assets/dragons/wind/hayalet_ruzgar.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-hayalet_ruzgar:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-isik_parcacigi {
    background-image: url('./assets/dragons/light/isik_parcacigi.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-isik_parcacigi:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-parlak_aura {
    background-image: url('./assets/dragons/light/parlak_aura.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-parlak_aura:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-goksel_isik {
    background-image: url('./assets/dragons/wind/goksel_isik.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-goksel_isik:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-golge_parcasi {
    background-image: url('./assets/dragons/shadow/golge_parcasi.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-golge_parcasi:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-karanlik_seytan {
    background-image: url('./assets/dragons/ice/karanlik_seytan.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-karanlik_seytan:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-buz_kristali {
    background-image: url('./assets/dragons/earth/buz_kristali.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-buz_kristali:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-buzul_devasi {
    background-image: url('./assets/dragons/ice/buzul_devasi.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-buzul_devasi:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-kis_krali {
    background-image: url('./assets/dragons/ice/kis_krali.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-kis_krali:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-buzul_kirigi {
    background-image: url('./assets/dragons/ice/buzul_kirigi.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-buzul_kirigi:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-simsek_firtinasi {
    background-image: url('./assets/dragons/wind/simsek_firtinasi.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-simsek_firtinasi:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-donmus_golge {
    background-image: url('./assets/dragons/shadow/donmus_golge.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-donmus_golge:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-doga_koruyucusu {
    background-image: url('./assets/dragons/water/doga_koruyucusu.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-doga_koruyucusu:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-gunes_tutulmasi {
    background-image: url('./assets/dragons/fire/gunes_tutulmasi.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-gunes_tutulmasi:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-zehir_engerek {
    background-image: url('./assets/dragons/fire/zehir_engerek.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-zehir_engerek:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-kan_ayi {
    background-image: url('./assets/dragons/fire/kan_ayi.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-kan_ayi:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-kaos_tanrisi {
    background-image: url('./assets/dragons/mythic/kaos_tanrisi.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-kaos_tanrisi:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-duzen_tanrisi {
    background-image: url('./assets/dragons/mythic/duzen_tanrisi.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-duzen_tanrisi:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-antik_bosluk {
    background-image: url('./assets/dragons/shadow/antik_bosluk.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-antik_bosluk:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}

.dragon-alfa_ve_omega {
    background-image: url('./assets/dragons/legendary/alfa_ve_omega.jpg');
    background-size: cover;
    background-position: center;
}

.dragon-alfa_ve_omega:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(45deg, transparent 60%, rgba(255,255,255,0.1) 100%);
    border-radius: inherit;
    pointer-events: none;
}