.play-button,
.button,
.faction-content a,
.discord-card > a,
.quick-links a,
.rank-tabs button,
.panel-heading a,
.footer-center a {
    position: relative;
    overflow: hidden;
    transition: transform .24s ease, border-color .24s ease, color .24s ease,
                background-color .24s ease, box-shadow .24s ease, filter .24s ease;
}

.play-button::before,
.button::before,
.faction-content a::before,
.discord-card > a::before {
    content: "";
    position: absolute;
    top: -45%;
    left: -70%;
    width: 34%;
    height: 190%;
    background: linear-gradient(90deg, transparent, rgba(255, 235, 192, .32), transparent);
    transform: skewX(-22deg);
    transition: left .55s ease;
    pointer-events: none;
}

.play-button:hover,
.button:hover {
    transform: translateY(-3px);
    color: #fff;
    border-color: #ff7167;
    box-shadow: inset 0 0 22px rgba(255, 87, 62, .3), 0 7px 24px rgba(215, 32, 35, .34);
}

.button-outline:hover {
    border-color: #e8bd79;
    box-shadow: inset 0 0 20px rgba(225, 177, 102, .16), 0 7px 23px rgba(0, 0, 0, .55);
}

.play-button:hover::before,
.button:hover::before,
.faction-content a:hover::before,
.discord-card > a:hover::before {
    left: 140%;
}

.play-button:active,
.button:active,
.faction-content a:active,
.discord-card > a:active,
.quick-links a:active {
    transform: translateY(0) scale(.98);
    transition-duration: .08s;
}

.faction-card {
    transition: transform .32s ease, border-color .32s ease, box-shadow .32s ease;
}

.faction-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 50% 80%, rgba(232, 184, 105, .18), transparent 48%);
    opacity: 0;
    transition: opacity .32s ease;
    pointer-events: none;
}

.faction-card:hover {
    transform: translateY(-5px);
    border-color: rgba(244, 201, 130, .9);
    box-shadow: 0 12px 28px rgba(0, 0, 0, .55);
}

.faction-card:hover::after { opacity: 1; }
.faction-card:hover .faction-content { transform: translateY(-4px); }
.faction-content { z-index: 1; transition: transform .32s ease; }

.faction-content a:hover {
    color: #fff;
    border-color: #f0c57e;
    background: rgba(45, 31, 17, .82);
    box-shadow: 0 0 19px rgba(219, 167, 85, .22);
}

.quick-links a:hover {
    transform: translateX(5px);
    border-color: rgba(239, 193, 119, .85);
    background: linear-gradient(90deg, #241b12, #0d0e10);
    box-shadow: 0 5px 17px rgba(0, 0, 0, .4);
}

.quick-links .quick-icon,
.quick-links i { transition: color .24s ease, filter .24s ease; }

.quick-links a:hover .quick-icon,
.quick-links a:hover i {
    color: #ffe0a7;
    filter: drop-shadow(0 0 6px rgba(238, 184, 94, .58));
}

.discord-card > a:hover {
    transform: translateY(-2px);
    color: #fff;
    border-color: #5b91ff;
    background: rgba(36, 71, 146, .25);
    box-shadow: inset 0 0 20px rgba(57, 103, 204, .3), 0 0 17px rgba(49, 89, 195, .24);
}

.rank-tabs button:hover:not(.active) {
    color: #ffe0a7;
    border-color: #c6985c;
    background: #1b1712;
}

/* Ranking podium: gold, silver and bronze */
.ranking-row.podium {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 31px;
    font-size: 11px;
    border-top-color: rgba(255, 255, 255, .13);
}

.ranking-row.podium::before {
    content: "";
    position: absolute;
    z-index: -2;
    inset: 0;
    background: linear-gradient(100deg, transparent 8%, var(--podium-wash) 46%, transparent 82%);
    background-size: 220% 100%;
    animation: podium-breathe 3.2s ease-in-out infinite;
}

.ranking-row.podium::after {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    bottom: 0;
    left: -45%;
    width: 32%;
    transform: skewX(-24deg);
    background: linear-gradient(90deg, transparent, var(--podium-shine), transparent);
    animation: podium-sweep 4.6s ease-in-out infinite;
}

.ranking-row.podium > b {
    color: var(--podium-text);
    font-weight: 700;
    letter-spacing: .25px;
    text-shadow: 0 0 9px var(--podium-glow);
}

.ranking-row.podium .top-rank {
    position: relative;
    display: grid;
    place-items: center;
    width: 23px;
    height: 23px;
    padding: 0;
    border: 1px solid var(--podium-border);
    border-radius: 50%;
    color: #100d09;
    background: var(--podium-medal);
    box-shadow: 0 0 10px var(--podium-glow), inset 0 1px 2px rgba(255, 255, 255, .65);
    font-weight: 900;
    animation: medal-pulse 2.5s ease-in-out infinite;
}

.ranking-row.podium-1 {
    --podium-wash: rgba(229, 168, 63, .25);
    --podium-shine: rgba(255, 232, 165, .56);
    --podium-text: #ffe2a1;
    --podium-glow: rgba(238, 176, 67, .48);
    --podium-border: #ffe09a;
    --podium-medal: linear-gradient(145deg, #fff0a8, #d99a27 60%, #7f4a10);
    box-shadow: inset 3px 0 0 #eab54f;
}

.ranking-row.podium-2 {
    --podium-wash: rgba(177, 195, 213, .18);
    --podium-shine: rgba(235, 246, 255, .45);
    --podium-text: #e8f1fa;
    --podium-glow: rgba(183, 206, 228, .35);
    --podium-border: #e5f1fb;
    --podium-medal: linear-gradient(145deg, #fff, #b7c6d2 58%, #63717c);
    box-shadow: inset 3px 0 0 #aabdcf;
    animation-delay: .35s;
}

.ranking-row.podium-3 {
    --podium-wash: rgba(184, 104, 51, .19);
    --podium-shine: rgba(255, 197, 144, .42);
    --podium-text: #f2bd8e;
    --podium-glow: rgba(205, 112, 54, .37);
    --podium-border: #e8a16d;
    --podium-medal: linear-gradient(145deg, #f3bd8b, #b66635 58%, #62301e);
    box-shadow: inset 3px 0 0 #bd7345;
    animation-delay: .7s;
}

.ranking-row.podium-1::after { animation-delay: 0s; }
.ranking-row.podium-2::after { animation-delay: 1.1s; }
.ranking-row.podium-3::after { animation-delay: 2.2s; }

@keyframes podium-sweep {
    0%, 34% { left: -45%; opacity: 0; }
    45% { opacity: 1; }
    68%, 100% { left: 125%; opacity: 0; }
}

@keyframes podium-breathe {
    0%, 100% { background-position: 100% 50%; filter: brightness(.82); }
    50% { background-position: 0 50%; filter: brightness(1.18); }
}

@keyframes medal-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.08); }
}

.panel-heading a:hover,
.footer-center a:hover {
    color: #f1c77e;
    text-shadow: 0 0 10px rgba(233, 184, 105, .4);
}

.social-link,
.language { transition: transform .2s ease, color .2s ease, border-color .2s ease, background-color .2s ease; }
.social-link:hover { transform: translateY(-2px) scale(1.1); color: #f0be73; }
.language:hover { color: #fff; border-color: #796143; background: #17130f; }

.menu-toggle span { transition: transform .22s ease, opacity .22s ease; }
.menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

@media (hover: none) {
    .faction-card:hover,
    .play-button:hover,
    .button:hover { transform: none; }
    .quick-links a:hover { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}

/* Live account and faction ranking additions */
.account-link {
    padding: 9px 11px;
    border: 1px solid rgba(215, 170, 104, .36);
    color: #e7c184;
    font: 700 9px Georgia, serif;
    letter-spacing: .6px;
    transition: color .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.account-link:hover { color:#fff; border-color:#dfad64; box-shadow:0 0 15px rgba(215,170,104,.18); }
#ranking-rows { transition: opacity .18s ease; }
#ranking-rows.loading { opacity: .36; pointer-events: none; }
.faction-mark { display:grid; place-items:center; height:29px; }
.faction-mark img { width:30px; height:30px; object-fit:contain; filter:drop-shadow(0 2px 4px #000); transition:transform .2s ease,filter .2s ease; }
.home-ranking-panel .faction-mark.faction-sky { background-image:none; }
.ranking-row:hover .faction-mark img { transform:scale(1.18); filter:drop-shadow(0 0 6px rgba(235,190,115,.48)); }
.ranking-empty { margin:22px 10px; text-align:center; color:#858c94; font-size:11px; }

/* Home ranking widget aligned with the full rankings page. */
.home-ranking-panel .panel-heading a{transition:color .2s,transform .2s}.home-ranking-panel .panel-heading a:hover{color:#fff0c9;transform:translateX(3px)}.home-ranking-panel .rank-tabs{height:46px;padding:7px 12px;gap:6px}.home-ranking-panel .rank-tabs button{display:flex;align-items:center;justify-content:center;gap:7px;border-color:rgba(204,153,76,.35);background:linear-gradient(180deg,#11151a,#090c0f);transition:border-color .2s,filter .2s,transform .2s}.home-ranking-panel .rank-tabs button span{color:#e9b866;font-size:14px}.home-ranking-panel .rank-tabs button:hover{border-color:#d9a45a;filter:brightness(1.15);transform:translateY(-1px)}.home-ranking-panel .rank-tabs button.active{color:#21170c;border-color:#f1c578;background:linear-gradient(110deg,#f3d497,#c7954b 62%,#efd08c);box-shadow:inset 0 0 16px rgba(255,255,255,.32),0 0 12px rgba(221,161,63,.16)}.home-ranking-panel .rank-tabs button.active span{color:#21170c}.home-ranking-panel .ranking-table{margin:0 12px;border-color:rgba(213,162,85,.18)}.home-ranking-panel .ranking-head,.home-ranking-panel .ranking-row{grid-template-columns:36px minmax(100px,1.2fr) 76px 78px}.home-ranking-panel .ranking-head{height:31px;padding:0 6px;color:#8e969f;font:700 8px Arial,sans-serif;letter-spacing:.75px}.home-ranking-panel .ranking-row{min-height:31px;padding:2px 6px}.home-ranking-panel .mini-ranking-row.podium{min-height:36px}.mini-rank-player,.mini-rank-value,.home-ranking-panel .faction-mark{display:flex;flex-direction:column;min-width:0}.mini-rank-player{text-align:left;gap:2px}.mini-rank-player b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#e9e7e3;font-size:10px}.mini-rank-player small,.mini-rank-value small,.home-ranking-panel .faction-mark small{color:#626c77;font:700 6px Arial,sans-serif;letter-spacing:.55px;text-transform:uppercase}.mini-rank-value{align-items:center;gap:1px}.mini-rank-value strong{color:#efc67e;font:700 11px Georgia,serif}.mini-rank-value.level-master strong{color:#55c9ff}.mini-rank-value.level-god strong{color:#d18bff}.mini-rank-value.level-rebirth strong{color:#ff6863}.mini-rank-value.level-points strong{color:#f0c474}.home-ranking-panel .faction-mark{align-items:center;gap:0;font-size:inherit}.home-ranking-panel .faction-mark img{width:23px;height:23px;object-fit:contain}.home-ranking-panel .faction-mark small{max-width:70px;overflow:hidden;text-overflow:ellipsis;color:#b89561}.home-ranking-panel #ranking-rows.loading{filter:saturate(.55)}
.home-ranking-panel .panel-heading .home-ranking-see-all{min-width:132px;height:30px;padding:0 10px;display:flex;align-items:center;justify-content:center;gap:10px;border:1px solid #a8783f;background:linear-gradient(100deg,rgba(116,19,23,.86),rgba(55,11,14,.9));box-shadow:inset 0 0 16px rgba(244,70,53,.16),0 0 10px rgba(205,38,35,.1);color:#efc57f;font:700 8px Georgia,serif;letter-spacing:.7px}.home-ranking-panel .panel-heading .home-ranking-see-all b{font-size:15px;transition:transform .2s}.home-ranking-panel .panel-heading .home-ranking-see-all:hover{color:#fff0ce;border-color:#ef4d45;box-shadow:inset 0 0 19px rgba(244,70,53,.25),0 0 15px rgba(205,38,35,.22);transform:translateY(-1px)}.home-ranking-panel .panel-heading .home-ranking-see-all:hover b{transform:translateX(3px)}
@media(max-width:520px){.home-ranking-panel .panel-heading .home-ranking-see-all{min-width:48px}.home-ranking-panel .panel-heading .home-ranking-see-all span{display:none}.home-ranking-panel .rank-tabs button{font-size:8px}.home-ranking-panel .rank-tabs button span{display:none}.home-ranking-panel .ranking-head,.home-ranking-panel .ranking-row{grid-template-columns:30px minmax(90px,1fr) 65px 60px}.home-ranking-panel .faction-mark small{display:none}}
@media(max-width:1180px){.account-link{display:none}}

.faction-grid-four { grid-template-columns:repeat(4,1fr); }
.faction-logo-card { height:310px; background-color:#080b0e; }
.faction-logo-card::before { background:linear-gradient(180deg,rgba(0,0,0,.22),rgba(0,0,0,.94)); }
.faction-dragon-card { background-image:url('../images/hero.png'); }
.faction-emblem { position:absolute; z-index:1; top:12px; left:50%; width:156px; height:156px; object-fit:contain; transform:translateX(-50%); filter:drop-shadow(0 8px 13px #000); transition:transform .32s ease,filter .32s ease; }
.faction-logo-card:hover .faction-emblem { transform:translateX(-50%) scale(1.07); filter:drop-shadow(0 8px 18px rgba(229,180,101,.38)); }
.faction-logo-card .faction-content { bottom:13px; padding:0 12px; }
.faction-logo-card .faction-content h2 { color:#f0d19c; }
.faction-logo-card .faction-content h3 { margin:3px 0 5px; color:#c9b18a; font:700 9px Georgia,serif; letter-spacing:1.5px; }
.faction-logo-card .faction-content p { min-height:30px; margin:0 auto 9px; max-width:250px; line-height:1.45; letter-spacing:.35px; }
.faction-logo-card .faction-content a { padding:9px; width:145px; }
@media(max-width:1180px){.faction-grid-four{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){.faction-grid-four{grid-template-columns:1fr}.faction-logo-card{height:310px}.faction-emblem{width:185px;height:185px}}