/* =====================================================
   LEGEND CLASSIC - MU ONLINE 0.99B
   Classic Global MU Website
   Main stylesheet - Version 1.0
===================================================== */

/* 1. RESET */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

[hidden] {
    display: none !important;
}

html {
    scroll-behavior: smooth;
}

body {
    background: #171313;
    color: #e6d4c0;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 14px;
    line-height: 1.5;
}

a {
    color: inherit;
    text-decoration: none;
}

button {
    font-family: inherit;
}

/* 2. WEBSITE WRAPPER */
.website {
    width: min(1100px, 96%);
    margin: 0 auto;
    background: #1b1515;
    min-height: 100vh;
    border-left: 1px solid #60402d;
    border-right: 1px solid #60402d;
    box-shadow: 0 0 35px rgba(0, 0, 0, 0.8);
}

/* 3. HERO BANNER */
.hero {
    width: 100%;
    height: clamp(230px, 33vw, 365px);
    position: relative;
    background-image:
        linear-gradient(
            to bottom,
            transparent 65%,
            rgba(35, 5, 10, 0.75) 100%
        ),
        url("../images/banner/legend-classic-banner.png");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    border-bottom: 3px solid #701b21;
    overflow: hidden;
}

.hero-content {
    display: none;
}

/* 4. MAIN NAVIGATION */
.main-menu {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    background: linear-gradient(
        to bottom,
        #421619,
        #210d10
    );
    border-top: 1px solid #a47742;
    border-bottom: 2px solid #a47742;
    min-height: 48px;
    padding: 4px;
}

.main-menu a {
    color: #e7c99a;
    font-family: Georgia, "Times New Roman", serif;
    font-weight: bold;
    font-size: 12px;
    text-align: center;
    padding: 11px 15px;
    transition: 0.2s;
    border-right: 1px solid rgba(180, 120, 65, 0.2);
}

.main-menu a:hover,
.main-menu a.active {
    color: #fff1c9;
    background: linear-gradient(
        to bottom,
        #8d542c,
        #4d2119
    );
    box-shadow: inset 0 0 10px rgba(255, 190, 90, 0.2);
}

/* 5. MAIN TWO-COLUMN LAYOUT */
.main-layout {
    display: grid;
    grid-template-columns: 245px minmax(0, 1fr);
    gap: 12px;
    padding: 12px;
    align-items: start;
}

/* 6. SIDEBAR */
.sidebar {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.panel {
    background: #261b1a;
    border: 1px solid #79533a;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
}

.panel-title {
    background: linear-gradient(
        to bottom,
        #85643d,
        #563b27
    );
    color: #fff0d1;
    padding: 10px 8px;
    font-size: 13px;
    text-align: center;
    font-weight: bold;
    border-bottom: 1px solid #a17a4c;
    letter-spacing: 0.5px;
}

/* 7. GAME EVENTS */
.event-list {
    list-style: none;
}

.event-list li {
    padding: 11px 10px;
    color: #e7d1b1;
    font-size: 13px;
    font-weight: bold;
    border-bottom: 1px solid #594039;
    background: #302321;
    transition: 0.2s;
}

.event-list li:hover {
    background: #503025;
    color: #ffd68a;
    padding-left: 16px;
}

.event-list li:last-child {
    border-bottom: none;
}

/* 8. SERVER INFORMATION */
.server-info {
    padding: 0 9px;
}

.server-info p {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 6px;
    padding: 9px 0;
    border-bottom: 1px solid #594039;
    font-size: 12px;
}

.server-info p:last-child {
    border-bottom: none;
}

.server-info span {
    color: #e1cbb0;
}

.server-info strong {
    color: #e5b66c;
    text-align: right;
}

/* 9. MAIN CONTENT */
.content {
    min-width: 0;
    background: #211817;
    border: 1px solid #79533a;
    padding: 10px;
    min-height: 550px;
}

/* 10. CONTENT TABS */
.content-tabs {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 5px;
    padding: 5px;
    margin-bottom: 15px;
    background: #292322;
    border: 1px solid #79533a;
}

.tab {
    min-height: 62px;
    border: 1px solid transparent;
    background: linear-gradient(
        to bottom,
        #422523,
        #291716
    );
    color: #dfc18d;
    font-size: 12px;
    font-weight: bold;
    cursor: pointer;
    transition: 0.2s;
}

.tab:hover,
.tab.active {
    background: linear-gradient(
        to bottom,
        #8a6840,
        #59432c
    );
    border: 1px solid #b58c52;
    color: #fff0cb;
    box-shadow: inset 0 0 12px rgba(255, 200, 100, 0.15);
}

/* 11. SECTION TITLE */
.section-title {
    background: linear-gradient(
        to bottom,
        #85643d,
        #5a412b
    );
    color: #fff2d9;
    text-align: center;
    padding: 11px;
    font-size: 17px;
    border: 1px solid #a37d4c;
    margin-bottom: 12px;
}

/* 12. NEWS LIST */
.news-list {
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.news-item {
    position: relative;
    padding: 13px 15px;
    background: linear-gradient(
        to right,
        #392322,
        #281b1b
    );
    border: 1px solid #72503b;
    border-left: 3px solid #a56b38;
    transition: 0.2s;
}

.news-item:hover {
    background: linear-gradient(
        to right,
        #503027,
        #30201e
    );
    border-left-color: #e3b45e;
}

.news-date {
    display: inline-block;
    color: #d9b47b;
    font-size: 10px;
    font-weight: bold;
    letter-spacing: 0.5px;
    margin-bottom: 4px;
}

.news-item h3 {
    color: #e9c5a0;
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 4px;
}

.news-item p {
    color: #bda995;
    font-size: 12px;
}

/* 13. OTHER CONTENT SECTIONS */
.news-section > p {
    color: #d0b99f;
    padding: 15px;
    background: #302321;
    border: 1px solid #72503b;
}

/* 14. FOOTER */
.footer {
    background: linear-gradient(
        to bottom,
        #371619,
        #1b0c0e
    );
    border-top: 2px solid #956b3e;
    text-align: center;
    padding: 22px 10px;
    margin-top: 10px;
}

.footer p:first-child {
    color: #e3bd80;
    font-weight: bold;
    font-size: 13px;
    letter-spacing: 1px;
}

.footer p:last-child {
    color: #a58a70;
    font-size: 11px;
    margin-top: 5px;
}

/* 15. TABLET */
@media (max-width: 800px) {

    .main-layout {
        grid-template-columns: 210px minmax(0, 1fr);
        gap: 8px;
        padding: 8px;
    }

    .main-menu a {
        padding: 10px 9px;
        font-size: 11px;
    }

    .content {
        padding: 7px;
    }
}

/* 16. MOBILE */
@media (max-width: 600px) {

    .website {
        width: 100%;
        border: none;
    }

    .hero {
        height: 190px;
        background-position: center 65%;
    }

    .main-menu {
        justify-content: flex-start;
    }

    .main-menu a {
        flex: 1 1 30%;
        padding: 10px 4px;
        font-size: 10px;
    }

    .main-layout {
        display: flex;
        flex-direction: column;
        padding: 8px;
    }

    .sidebar,
    .content {
        width: 100%;
    }

    .content-tabs {
        gap: 3px;
    }

    .tab {
        font-size: 10px;
        min-height: 55px;
    }

    .content {
        min-height: 400px;
    }

    .news-item h3 {
        font-size: 12px;
    }
}
/* FIX VIETNAMESE FONT RENDERING */
body {
    font-family: Tahoma, Arial, sans-serif;
}

.main-menu a,
.panel-title,
.section-title,
.tab,
.news-item,
.news-item h3,
.news-item p,
.server-info,
.event-list,
.footer {
    font-family: Tahoma, Arial, sans-serif;
}
/* =====================================================
   LEGEND CLASSIC - NEWS ACCORDION
   Version 1.0
===================================================== */

/* News item */
.news-item {
    padding: 0;
    overflow: hidden;
    background: linear-gradient(
        to right,
        #392322,
        #281b1b
    );
    border: 1px solid #72503b;
    border-left: 3px solid #a56b38;
}

/* News button */
.news-toggle {
    width: 100%;
    min-height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border: none;
    background: transparent;
    color: #e9c5a0;
    text-align: left;
    cursor: pointer;
    font-family: Tahoma, Arial, sans-serif;
}

.news-toggle:hover {
    background: rgba(150, 95, 45, 0.16);
}

/* Heading */
.news-heading {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.news-meta {
    display: flex;
    align-items: center;
    gap: 9px;
    flex-wrap: wrap;
}

.news-date {
    color: #e6bd7b;
    font-size: 10px;
    font-weight: bold;
}

.news-time {
    color: #bda995;
    font-size: 10px;
}

.news-title {
    color: #e9c5a0;
    font-size: 14px;
    font-weight: bold;
}

/* Arrow */
.news-arrow {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 27px;
    height: 27px;
    border-radius: 50%;
    border: 1px solid #95734d;
    background: #382c29;
    color: #e8c38a;
    font-size: 11px;
    transition: transform 0.2s;
}

.news-item.open .news-arrow {
    transform: rotate(180deg);
}

/* Expanded content */
.news-body {
    padding: 14px 15px;
    border-top: 1px solid #72503b;
    background: rgba(15, 8, 8, 0.35);
}

.news-body p {
    color: #d3bda6;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 13px;
    line-height: 1.8;
    margin-bottom: 8px;
}

.news-body p:last-child {
    margin-bottom: 0;
}

/* Mobile */
@media (max-width: 600px) {
    .news-toggle {
        padding: 10px;
    }

    .news-title {
        font-size: 12px;
    }
}
/* =========================================
   LEGEND CLASSIC - RANKING PAGE
========================================= */

.ranking-page {
    min-height: 580px;
    padding: 20px;
    background: #1d1715;
    border: 1px solid #785638;
    color: #e8c58e;
}

.ranking-header {
    text-align: center;
    padding: 18px;
    margin-bottom: 18px;
    background: linear-gradient(#785638, #49301e);
    border: 1px solid #a27a49;
}

.ranking-header h2 {
    margin: 0 0 7px;
    font-size: 22px;
    color: #fff0d0;
}

.ranking-header p {
    margin: 0;
    font-size: 11px;
    color: #e4bd83;
}

.ranking-tabs {
    display: flex;
    gap: 5px;
    margin-bottom: 18px;
    padding: 5px;
    background: #30201c;
    border: 1px solid #785638;
}

.ranking-tab {
    flex: 1;
    min-height: 48px;
    border: 1px solid #65412e;
    background: #351d1b;
    color: #e5bd7d;
    font-family: Tahoma, Arial, sans-serif;
    font-weight: bold;
    cursor: pointer;
}

.ranking-tab:hover,
.ranking-tab.active {
    background: linear-gradient(#82603b, #553a24);
    border-color: #c49a5c;
    color: #fff0d0;
}

.ranking-title {
    padding: 12px;
    margin: 0 0 12px;
    text-align: center;
    background: linear-gradient(#765535, #49301f);
    border: 1px solid #9b7548;
    color: #fff0d0;
    font-size: 16px;
}

.ranking-table-wrapper {
    width: 100%;
    overflow-x: auto;
    border: 1px solid #6c5840;
}

.ranking-table {
    width: 100%;
    min-width: 760px;
    border-collapse: collapse;
    background: #292b2d;
    font-family: Tahoma, Arial, sans-serif;
    text-align: center;
}

.ranking-table th {
    padding: 12px 7px;
    background: #62513a;
    border: 1px solid #85704f;
    color: #fff1d8;
    font-size: 11px;
    white-space: nowrap;
}

.ranking-table td {
    padding: 9px 7px;
    border: 1px solid #655c50;
    font-size: 13px;
    white-space: nowrap;
}

.ranking-table tbody tr {
    background: #292b2d;
    transition: background 0.2s;
}

.ranking-table tbody tr:hover {
    background: #3b3029;
}

.rank-medal {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: #43505c;
    border: 1px solid #697b8c;
    color: #fff;
    font-weight: bold;
}

.rank-1 {
    background: linear-gradient(#ffe65d, #c58a00);
    border-color: #ffdb36;
    box-shadow: 0 0 7px #b68c00;
}

.rank-2 {
    background: linear-gradient(#e1e7eb, #7c8996);
    border-color: #c6d1dc;
}

.rank-3 {
    background: linear-gradient(#ed9a45, #a94b16);
    border-color: #e4a45e;
}

.character-name {
    color: #eab34e;
    font-weight: bold;
}

.class-label,
.guild-label {
    display: inline-block;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: bold;
}

.class-label {
    background: #3d4955;
    border: 1px solid #64798d;
    color: #d8e5f2;
}

.guild-label {
    background: #253d5b;
    border: 1px solid #426eaa;
    color: #a9d4ff;
}

.level-value {
    color: #b4b9ff;
    font-weight: bold;
}

.reset-value {
    display: inline-block;
    padding: 4px 8px;
    border-radius: 12px;
    background: #462526;
    border: 1px solid #8e3b3b;
    color: #ff8585;
    font-weight: bold;
}

.point-value {
    color: #45e8a6;
    font-weight: bold;
}

.online-status {
    color: #5ab4e8;
    font-size: 10px;
    font-weight: bold;
}

.online-status::first-letter {
    color: #00c98a;
}

@media (max-width: 768px) {
    .ranking-page {
        padding: 10px;
    }

    .ranking-header h2 {
        font-size: 18px;
    }

    .ranking-tab {
        font-size: 10px;
    }
}

/* =================================================
   LEGEND CLASSIC - HALL OF FAME
   ORIGINAL RANKING DESIGN
================================================= */

.lc-ranking {
    padding: 22px;
    min-height: 650px;
    background: #1d1715;
    border: 1px solid #785638;
    color: #ead1a9;
    font-family: Tahoma, Arial, sans-serif;
}

/* INTRO */

.lc-rank-intro {
    position: relative;
    text-align: center;
    padding: 30px 15px;
    margin-bottom: 20px;
    overflow: hidden;
    background: linear-gradient(135deg, #461719, #241211 65%, #51301d);
    border: 1px solid #9c7545;
}

.lc-rank-emblem {
    color: #e4b76c;
    font-size: 30px;
    margin-bottom: 5px;
}

.lc-rank-overline {
    color: #d6ac70;
    font-size: 10px;
    letter-spacing: 4px;
}

.lc-rank-intro h2 {
    margin: 8px 0;
    color: #f1d39c;
    font-family: Georgia, serif;
    font-size: 30px;
    letter-spacing: 3px;
}

.lc-rank-subtitle {
    color: #c49c6a;
    font-size: 11px;
    letter-spacing: 1px;
}

/* CATEGORY */

.lc-rank-categories {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-bottom: 24px;
}

.lc-rank-category {
    min-height: 54px;
    background: #30201d;
    border: 1px solid #735034;
    color: #dcb779;
    font-weight: bold;
    cursor: pointer;
    transition: 0.2s;
}

.lc-rank-category span {
    margin-right: 8px;
    font-size: 17px;
}

.lc-rank-category:hover,
.lc-rank-category.active {
    background: linear-gradient(#775334, #442c20);
    border-color: #d0a45d;
    color: #fff0d0;
}

/* SECTION HEADING */

.lc-rank-section-heading {
    text-align: center;
    margin-bottom: 16px;
}

.lc-rank-section-heading h3 {
    color: #edca8d;
    font-family: Georgia, serif;
    letter-spacing: 1px;
}

.lc-rank-section-heading p {
    color: #a88b69;
    font-size: 10px;
    letter-spacing: 3px;
}

/* PODIUM */

.lc-rank-podium-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    align-items: end;
    gap: 12px;
    margin-bottom: 30px;
}

.lc-rank-card {
    text-align: center;
    padding: 18px 8px;
    background: linear-gradient(#392520, #241918);
    border: 1px solid #765638;
}

.lc-rank-card.first {
    min-height: 190px;
    border-color: #c99d47;
    background: linear-gradient(#57401f, #2e2017);
}

.lc-rank-card.second {
    min-height: 165px;
    border-color: #9099a1;
}

.lc-rank-card.third {
    min-height: 155px;
    border-color: #a66b3d;
}

.lc-rank-medal {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    margin-bottom: 8px;
    border-radius: 50%;
    background: #b68c40;
    border: 2px solid #f0d58c;
    color: #fff7df;
    font-family: Georgia, serif;
    font-size: 19px;
    font-weight: bold;
}

.second .lc-rank-medal {
    background: #77838c;
    border-color: #c7d0d5;
}

.third .lc-rank-medal {
    background: #a65d2d;
    border-color: #e4a26b;
}

.lc-rank-card p {
    color: #c9a66f;
    font-size: 10px;
}

.lc-rank-card h4 {
    margin: 8px 0;
    color: #f0c779;
    font-size: 16px;
}

.lc-rank-card span {
    display: block;
    color: #c8b49a;
    font-size: 11px;
}

.lc-rank-card strong {
    display: block;
    margin-top: 12px;
    color: #54dba8;
    font-size: 12px;
}

/* RANKING TABLE */

.lc-rank-list {
    border: 1px solid #76583c;
    background: #251a18;
}

.lc-rank-list-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px;
    background: linear-gradient(#4d3021, #30201a);
    border-bottom: 1px solid #76583c;
}

.lc-rank-list-heading h3 {
    margin: 0;
    color: #f0d29b;
    font-family: Georgia, serif;
}

.lc-rank-list-heading p {
    margin: 5px 0 0;
    color: #b99a73;
    font-size: 10px;
    letter-spacing: 2px;
}

.lc-rank-total {
    padding: 7px 12px;
    background: #543a25;
    border: 1px solid #a47a45;
    color: #f0d29b;
    font-size: 11px;
    font-weight: bold;
}

.lc-rank-table-scroll {
    width: 100%;
    overflow-x: auto;
}

.lc-rank-table {
    width: 100%;
    min-width: 850px;
    border-collapse: collapse;
    text-align: center;
    background: #292727;
}

.lc-rank-table th {
    padding: 13px 8px;
    background: #554333;
    border: 1px solid #756044;
    color: #f2d9aa;
    font-size: 10px;
    white-space: nowrap;
}

.lc-rank-table td {
    padding: 13px 8px;
    border: 1px solid #51473c;
    color: #e5c38c;
    font-size: 12px;
    white-space: nowrap;
}

.lc-rank-table tbody tr {
    transition: background 0.2s;
}

.lc-rank-table tbody tr:hover {
    background: #443229;
}

.lc-rank-table td:nth-child(1) {
    color: #e5bd70;
    font-weight: bold;
}

.lc-rank-table td:nth-child(2) {
    color: #f1c26d;
    font-weight: bold;
}

.lc-rank-table td:nth-child(5) {
    color: #b8c4ff;
    font-weight: bold;
}

.lc-rank-table td:nth-child(6) {
    color: #ff8989;
    font-weight: bold;
}

.lc-rank-table td:nth-child(7) {
    color: #48e0a3;
    font-weight: bold;
}

.lc-rank-table td:nth-child(8) {
    color: #43dba3;
    font-size: 10px;
    font-weight: bold;
}

/* PAGINATION */

.lc-rank-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
    padding: 18px 8px;
}

.lc-rank-pagination button {
    min-width: 32px;
    height: 32px;
    background: #392820;
    border: 1px solid #78563a;
    color: #e8c58d;
    cursor: pointer;
}

.lc-rank-pagination button.selected,
.lc-rank-pagination button:hover {
    background: #85603a;
    border-color: #d2a35c;
    color: white;
}

.lc-rank-pagination button:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.lc-rank-pagination span {
    color: #bda17c;
}

.lc-rank-note {
    text-align: center;
    margin-top: 18px;
    color: #957b60;
    font-size: 10px;
    letter-spacing: 1px;
}

/* MOBILE */

@media (max-width: 700px) {
    .lc-ranking {
        padding: 10px;
    }

    .lc-rank-intro h2 {
        font-size: 23px;
    }

    .lc-rank-category {
        font-size: 10px;
    }

    .lc-rank-category span {
        display: block;
        margin-bottom: 4px;
    }

    .lc-rank-podium-grid {
        gap: 5px;
    }

    .lc-rank-card {
        padding: 12px 4px;
    }

    .lc-rank-card h4 {
        font-size: 11px;
        overflow-wrap: anywhere;
    }
}
/* =========================================
   LEGEND CLASSIC - VIETNAMESE FONT REFINEMENT
========================================= */

/* Vietnamese headings */
.lc-rank-section-heading h3,
.lc-rank-list-heading h3 {
    font-family: Tahoma, Arial, sans-serif;
    letter-spacing: 0;
    line-height: 1.6;
    font-weight: bold;
}

/* Vietnamese subtitles */
.lc-rank-subtitle,
.lc-rank-card p,
.lc-rank-card span,
.lc-rank-list-heading p,
.lc-rank-table th,
.lc-rank-table td,
.lc-rank-note {
    font-family: Tahoma, Arial, sans-serif;
    letter-spacing: 0;
}

/* Improve Vietnamese accent spacing */
.lc-ranking {
    font-family: Tahoma, Arial, sans-serif;
    line-height: 1.5;
}

.lc-rank-section-heading {
    line-height: 1.5;
}
/* =====================================================
   LEGEND CLASSIC - GUILD HALL
   Original Guild Ranking Design
   Version 1.0
===================================================== */

.lc-guild {
    padding: 20px;
    min-height: 650px;
    background: #1d1715;
    color: #ead1a9;
}

/* PAGE INTRO */

.lc-guild-intro {
    text-align: center;
    padding: 28px 15px;
    margin-bottom: 20px;
    background: linear-gradient(120deg, #351516, #4a2d1d);
    border: 1px solid #87613b;
    position: relative;
}

.lc-guild-emblem {
    color: #dca64c;
    font-size: 28px;
    margin-bottom: 8px;
}

.lc-guild-intro p {
    color: #d9ae6e;
    font-size: 11px;
    letter-spacing: 5px;
    margin-bottom: 10px;
}

.lc-guild-intro h2 {
    color: #f4d39a;
    font-family: Georgia, serif;
    font-size: 32px;
    letter-spacing: 3px;
    margin-bottom: 10px;
}

.lc-guild-intro span {
    color: #d9b17b;
    font-size: 12px;
    letter-spacing: 2px;
}

/* SECTION HEADINGS */

.lc-guild-heading {
    text-align: center;
    margin: 25px 0 18px;
}

.lc-guild-heading h3 {
    color: #eac78e;
    font-family: Georgia, serif;
    font-size: 19px;
    letter-spacing: 1px;
}

.lc-guild-heading p {
    color: #a98a64;
    font-size: 10px;
    letter-spacing: 4px;
    margin-top: 7px;
}

/* TOP THREE GUILDS */

.lc-guild-podium-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    align-items: stretch;
}

.lc-guild-card {
    text-align: center;
    padding: 22px 12px;
    background: linear-gradient(145deg, #30211e, #211817);
    border: 1px solid #76533a;
    min-width: 0;
}

.lc-guild-card.first {
    background: linear-gradient(145deg, #594323, #302217);
    border-color: #c69b50;
    transform: translateY(-7px);
}

.lc-guild-card.second {
    border-color: #898d91;
}

.lc-guild-card.third {
    border-color: #a76b42;
}

.lc-guild-medal {
    width: 48px;
    height: 48px;
    line-height: 46px;
    border-radius: 50%;
    margin: 0 auto 12px;
    font-family: Georgia, serif;
    font-size: 22px;
    font-weight: bold;
    background: #4a4e51;
    border: 2px solid #aeb6bc;
    color: #fff;
}

.first .lc-guild-medal {
    background: #b58a37;
    border-color: #f4d47e;
}

.third .lc-guild-medal {
    background: #98552e;
    border-color: #e5a56e;
}

.lc-guild-card > span {
    display: block;
    color: #c9a46b;
    font-size: 10px;
    margin-bottom: 9px;
}

.lc-guild-card h4 {
    color: #f0c477;
    font-size: 17px;
    margin-bottom: 9px;
    overflow-wrap: anywhere;
}

.lc-guild-card p {
    color: #d0b99b;
    font-size: 11px;
    margin-bottom: 12px;
}

.lc-guild-card strong {
    display: block;
    color: #42d6a0;
    font-size: 12px;
}

/* GUILD RANKING TABLE */

.lc-guild-list {
    margin-top: 30px;
    border: 1px solid #765638;
    background: #211817;
}

.lc-guild-list-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 15px;
    background: linear-gradient(120deg, #40291f, #302019);
    border-bottom: 1px solid #765638;
}

.lc-guild-list-heading h3 {
    color: #eac58b;
    font-family: Georgia, serif;
    font-size: 18px;
}

.lc-guild-list-heading p {
    color: #b89a72;
    font-size: 10px;
    letter-spacing: 2px;
    margin-top: 7px;
}

.lc-guild-list-heading > span {
    padding: 9px 15px;
    border: 1px solid #a77c43;
    color: #e9c58a;
    font-size: 11px;
    font-weight: bold;
}

.lc-guild-table-scroll {
    width: 100%;
    overflow-x: auto;
}

.lc-guild-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 650px;
    text-align: center;
}

.lc-guild-table th {
    padding: 15px 10px;
    background: #594832;
    color: #f5dfb5;
    font-size: 11px;
    border: 1px solid #796345;
    white-space: nowrap;
}

.lc-guild-table td {
    padding: 12px 10px;
    background: #292727;
    border: 1px solid #51443a;
    color: #e8c58e;
    font-size: 13px;
}

.lc-guild-table tbody tr:nth-child(even) td {
    background: #302b28;
}

.lc-guild-table tbody tr:hover td {
    background: #403127;
}

/* RANK BADGES */

.lc-guild-rank {
    display: inline-flex;
    width: 28px;
    height: 28px;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    font-weight: bold;
    color: #fff;
    background: #48535d;
    border: 1px solid #84909a;
}

.lc-guild-rank.rank-1 {
    background: #c49a20;
    border-color: #ffe17a;
    color: #fff;
    box-shadow: 0 0 9px #b88c2d66;
}

.lc-guild-master {
    color: #49baff !important;
    font-weight: bold;
}

.lc-guild-name {
    display: inline-block;
    padding: 6px 12px;
    color: #83c7ff;
    background: #273747;
    border: 1px solid #47688b;
    font-weight: bold;
}

.lc-guild-members {
    display: inline-block;
    min-width: 34px;
    padding: 5px 9px;
    color: #f0d8ad;
    background: #414b55;
    border: 1px solid #687785;
    border-radius: 4px;
    font-weight: bold;
}

.lc-guild-logo-placeholder {
    display: flex;
    width: 40px;
    height: 40px;
    margin: auto;
    align-items: center;
    justify-content: center;
    background: #171717;
    border: 1px solid #89704d;
    color: #a58b60;
    font-size: 9px;
}

/* PAGINATION */

.lc-guild-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 7px;
    padding: 20px 10px;
}

.lc-guild-pagination button {
    min-width: 34px;
    height: 34px;
    border: 1px solid #765638;
    background: #30211e;
    color: #e8c58e;
    cursor: pointer;
}

.lc-guild-pagination button.selected {
    background: linear-gradient(#947044, #59402b);
    border-color: #d2a76c;
    color: #fff1cf;
}

.lc-guild-pagination button:disabled {
    opacity: 0.45;
    cursor: default;
}

/* FOOTNOTE */

.lc-guild-note {
    text-align: center;
    color: #9c8265;
    font-size: 10px;
    letter-spacing: 1px;
    padding: 18px 5px;
}

/* RESPONSIVE */

@media (max-width: 768px) {

    .lc-guild {
        padding: 12px 8px;
    }

    .lc-guild-intro h2 {
        font-size: 25px;
    }

    .lc-guild-podium-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .lc-guild-card.first {
        transform: none;
        order: -1;
    }

    .lc-guild-card {
        padding: 16px 10px;
    }

    .lc-guild-list-heading h3 {
        font-size: 14px;
    }

    .lc-guild-list-heading > span {
        padding: 7px 9px;
        font-size: 10px;
    }

    .lc-guild-table {
        min-width: 650px;
    }
}
/* ==========================================
   LEGEND CLASSIC - VIETNAMESE FONT FINAL FIX
========================================== */

/* Vietnamese content */
.lc-guild,
.lc-guild h3,
.lc-guild h4,
.lc-guild span,
.lc-guild p,
.lc-guild th,
.lc-guild td,
.lc-guild button {
    font-family: Tahoma, Arial, sans-serif !important;
    letter-spacing: normal !important;
    word-spacing: normal !important;
    font-kerning: normal;
}

/* Main English title */
.lc-guild-intro h2 {
    font-family: Georgia, "Times New Roman", serif !important;
    letter-spacing: 2px !important;
}

/* English decorative subtitles */
.lc-guild-intro > p,
.lc-guild-heading > p,
.lc-guild-list-heading > p {
    font-family: Georgia, "Times New Roman", serif !important;
    letter-spacing: 3px !important;
    text-transform: uppercase;
}

/* Vietnamese headings */
.lc-guild-heading h3,
.lc-guild-list-heading h3 {
    font-family: Tahoma, Arial, sans-serif !important;
    letter-spacing: normal !important;
    font-weight: bold;
}
/* ==========================================
   LEGEND CLASSIC - CHARACTER RANKING
   HALL OF LEGENDS
========================================== */

.lc-character {
    width: 100%;
    max-width: 1200px;
    margin: 35px auto;
    padding: 0 20px 40px;
    box-sizing: border-box;
    color: #d8c6a0;
}

/* INTRO */

.lc-character-intro {
    text-align: center;
    padding: 45px 20px 35px;
    background: linear-gradient(180deg, #21100e, #100b0a);
    border: 1px solid #76502a;
    border-bottom: 3px solid #a87936;
    margin-bottom: 25px;
}

.lc-character-emblem {
    color: #d5a64c;
    font-size: 38px;
    margin-bottom: 10px;
}

.lc-character-intro > p {
    color: #a87936;
    font-family: Georgia, serif;
    font-size: 12px;
    letter-spacing: 4px;
    margin: 0 0 12px;
}

.lc-character-intro h2 {
    color: #e8c77f;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 34px;
    letter-spacing: 4px;
    margin: 0 0 12px;
    text-shadow: 0 2px 8px #000;
}

.lc-character-intro > span {
    color: #b8a17b;
    font-size: 12px;
    letter-spacing: 3px;
}

/* STATISTICS */

.lc-character-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
    margin-bottom: 25px;
}

.lc-character-stat {
    background: #17110f;
    border: 1px solid #4d3825;
    padding: 20px 15px;
    text-align: center;
}

.lc-character-stat span {
    display: block;
    color: #9b805b;
    font-size: 11px;
    letter-spacing: 1px;
    margin-bottom: 10px;
}

.lc-character-stat strong {
    display: block;
    color: #e0b65e;
    font-family: Georgia, serif;
    font-size: 23px;
}

/* RANKING CONTAINER */

.lc-character-list {
    background: #130e0c;
    border: 1px solid #5b4028;
    padding: 22px;
}

.lc-character-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    padding-bottom: 18px;
    margin-bottom: 18px;
    border-bottom: 1px solid #59402b;
}

.lc-character-heading h3 {
    color: #e0bd77;
    font-family: Georgia, serif;
    font-size: 20px;
    margin: 0 0 7px;
}

.lc-character-heading p {
    color: #947650;
    font-size: 10px;
    letter-spacing: 2px;
    margin: 0;
}

.lc-character-heading > span {
    color: #e2bb6c;
    border: 1px solid #86602e;
    padding: 8px 15px;
    font-size: 11px;
    white-space: nowrap;
}

/* TABLE */

.lc-character-table-scroll {
    width: 100%;
    overflow-x: auto;
}

.lc-character-table {
    width: 100%;
    min-width: 850px;
    border-collapse: collapse;
    text-align: center;
}

.lc-character-table thead {
    background: #352018;
}

.lc-character-table th {
    color: #d9b66e;
    font-size: 11px;
    font-weight: bold;
    padding: 15px 10px;
    border-bottom: 2px solid #99703c;
    white-space: nowrap;
}

.lc-character-table td {
    padding: 14px 10px;
    border-bottom: 1px solid #34251c;
    font-size: 12px;
}

.lc-character-row {
    background: #19110e;
    transition: background 0.2s ease;
}

.lc-character-row:nth-child(even) {
    background: #201611;
}

.lc-character-row:hover {
    background: #382319;
}

/* RANK */

.lc-character-rank {
    font-weight: bold;
    font-family: Georgia, serif;
    font-size: 15px !important;
}

.lc-character-rank.rank-1 {
    color: #ffd45e;
    text-shadow: 0 0 8px #a87936;
}

.lc-character-rank.rank-2 {
    color: #d5d5d5;
}

.lc-character-rank.rank-3 {
    color: #c88b56;
}

.lc-character-rank.rank-normal {
    color: #9b805b;
}

/* CHARACTER INFORMATION */

.lc-character-name {
    color: #f0d18b;
    font-weight: bold;
}

.lc-character-class {
    color: #b69a72;
}

.lc-character-guild {
    color: #d1ad6a;
}

.lc-character-level,
.lc-character-reset {
    color: #e0c28a;
    font-weight: bold;
}

.lc-character-points {
    color: #f0c35f;
    font-weight: bold;
}

/* ONLINE STATUS */

.lc-character-online,
.lc-character-offline {
    display: inline-block;
    padding: 5px 9px;
    font-size: 10px;
    font-weight: bold;
    border-radius: 2px;
}

.lc-character-online {
    color: #75d68b;
    background: #15351d;
    border: 1px solid #347c42;
}

.lc-character-offline {
    color: #999;
    background: #292929;
    border: 1px solid #505050;
}

/* MESSAGE */

.lc-character-message {
    color: #c6a46c;
    text-align: center;
    padding: 25px 10px;
    font-size: 12px;
}

/* MOBILE */

@media (max-width: 768px) {

    .lc-character {
        padding: 0 10px 25px;
        margin: 20px auto;
    }

    .lc-character-intro {
        padding: 35px 10px;
    }

    .lc-character-intro h2 {
        font-size: 25px;
        letter-spacing: 2px;
    }

    .lc-character-stats {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .lc-character-list {
        padding: 12px;
    }

    .lc-character-heading h3 {
    font-family: Tahoma, Arial, sans-serif !important;
    font-size: 16px;
    letter-spacing: normal !important;
    word-spacing: normal !important;
    font-kerning: normal;
}
    .lc-character-heading h3,
    .lc-character-heading h3 * {
    text-transform: none;
}
/* =====================================================
   17. RANKING DROPDOWN MENU
===================================================== */

.main-menu {
    position: relative;
    z-index: 100;
}

.menu-dropdown {
    position: relative;
    display: flex;
    align-items: center;
}

.menu-dropdown-toggle {
    display: block;
    color: #e7c99a;
    font-family: Tahoma, Arial, sans-serif;
    font-weight: bold;
    font-size: 12px;
    text-align: center;
    padding: 11px 15px;
    border: none;
    border-right: 1px solid rgba(180, 120, 65, 0.2);
    background: transparent;
    cursor: pointer;
}

.menu-dropdown:hover .menu-dropdown-toggle,
.menu-dropdown:focus-within .menu-dropdown-toggle {
    color: #fff1c9;
    background: linear-gradient(to bottom, #8d542c, #4d2119);
}

.menu-dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 210px;
    background: #241716;
    border: 1px solid #a47742;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.7);
    z-index: 200;
}

.menu-dropdown:hover .menu-dropdown-menu,
.menu-dropdown:focus-within .menu-dropdown-menu {
    display: block;
}

.menu-dropdown-menu a {
    display: block;
    padding: 11px 14px;
    color: #e7c99a;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 12px;
    font-weight: bold;
    text-align: left;
    border-right: none;
    border-bottom: 1px solid #594039;
    white-space: nowrap;
}

.menu-dropdown-menu a:last-child {
    border-bottom: none;
}

.menu-dropdown-menu a:hover,
.menu-dropdown-menu a.active {
    color: #fff1c9;
    background: linear-gradient(to right, #80502c, #49221a);
}

@media (max-width: 600px) {
    .menu-dropdown {
        flex: 1 1 30%;
    }

    .menu-dropdown-toggle {
        width: 100%;
        padding: 10px 4px;
        font-size: 10px;
    }

    .menu-dropdown-menu {
        min-width: 190px;
    }
}


/* =====================================================
   LEGEND CLASSIC - RANKING DROPDOWN VISUAL REFINEMENT
   Override block: keeps the existing site styling intact
===================================================== */

/* Keep the dropdown aligned with the other main navigation items */
.main-menu {
    position: relative;
    z-index: 500;
}

.main-menu .menu-dropdown {
    position: relative;
    display: flex;
    align-items: stretch;
    align-self: stretch;
    flex: 0 0 auto;
    margin: 0;
    padding: 0;
}

/* Make the dropdown trigger look exactly like a main-menu link */
.main-menu .menu-dropdown-toggle {
    appearance: none;
    -webkit-appearance: none;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    margin: 0;
    padding: 11px 15px;
    border: 0;
    border-right: 1px solid rgba(180, 120, 65, 0.2);
    border-radius: 0;
    outline: none;
    background: transparent;
    color: #e7c99a;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 12px;
    font-weight: bold;
    line-height: 1.5;
    white-space: nowrap;
    cursor: pointer;
    transition: color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}

.main-menu .menu-dropdown:hover > .menu-dropdown-toggle,
.main-menu .menu-dropdown:focus-within > .menu-dropdown-toggle {
    color: #fff1c9;
    background: linear-gradient(to bottom, #8d542c, #4d2119);
    box-shadow: inset 0 0 10px rgba(255, 190, 90, 0.2);
}

/* Dropdown panel floats below the navigation; it does not take up menu space */
.main-menu .menu-dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 225px;
    margin: 0;
    padding: 4px 0;
    background: linear-gradient(to bottom, #30201d, #211514);
    border: 1px solid #a47742;
    border-top: 2px solid #c09250;
    border-radius: 0 0 3px 3px;
    box-shadow: 0 9px 22px rgba(0, 0, 0, 0.75);
    z-index: 1000;
}

.main-menu .menu-dropdown:hover > .menu-dropdown-menu,
.main-menu .menu-dropdown:focus-within > .menu-dropdown-menu {
    display: block;
}

.main-menu .menu-dropdown-menu a {
    display: flex;
    align-items: center;
    min-height: 39px;
    width: 100%;
    margin: 0;
    padding: 10px 14px;
    border: 0;
    border-bottom: 1px solid rgba(164, 119, 66, 0.32);
    background: transparent;
    color: #f0d5a8;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 12px;
    font-weight: bold;
    line-height: 1.4;
    text-align: left;
    white-space: nowrap;
    transition: color 0.18s ease, background 0.18s ease, padding-left 0.18s ease;
}

.main-menu .menu-dropdown-menu a:last-child {
    border-bottom: 0;
}

.main-menu .menu-dropdown-menu a:hover,
.main-menu .menu-dropdown-menu a:focus-visible,
.main-menu .menu-dropdown-menu a.active {
    padding-left: 19px;
    color: #fff4d6;
    background: linear-gradient(to right, #80502c, #49221a);
    outline: none;
}

.main-menu .menu-dropdown-toggle:focus-visible {
    outline: 1px solid #e0b66f;
    outline-offset: -3px;
}

/* Keep the dropdown usable on tablet and mobile widths */
@media (max-width: 800px) {
    .main-menu .menu-dropdown-toggle {
        padding: 10px 9px;
        font-size: 11px;
    }

    .main-menu .menu-dropdown-menu {
        min-width: 205px;
    }
}

@media (max-width: 600px) {
    .main-menu .menu-dropdown {
        flex: 1 1 30%;
    }

    .main-menu .menu-dropdown-toggle {
        width: 100%;
        min-height: 38px;
        padding: 10px 4px;
        font-size: 10px;
    }

    .main-menu .menu-dropdown-menu {
        min-width: 190px;
    }

    .main-menu .menu-dropdown-menu a {
        min-height: 36px;
        font-size: 11px;
    }
}



/* =========================================================
   CHARACTER RANKING HEADING + SUBTITLE - VIETNAMESE FONT FIX
   Applies to both:
   - BẢNG XẾP HẠNG NHÂN VẬT
   - THE GREATEST WARRIORS OF LEGEND
========================================================= */
html body .website main.lc-character .lc-character-list
.lc-character-heading > div > h3 {
    font-family: Arial, Tahoma, sans-serif !important;
    font-style: normal !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    word-spacing: 0 !important;
    text-indent: 0 !important;
    font-kerning: normal !important;
    font-variant-ligatures: normal !important;
    text-transform: none !important;
    line-height: 1.35 !important;
}

html body .website main.lc-character .lc-character-list
.lc-character-heading > div > p {
    font-family: Arial, Tahoma, sans-serif !important;
    font-style: normal !important;
    font-weight: 400 !important;
    letter-spacing: 1.5px !important;
    word-spacing: normal !important;
    text-indent: 0 !important;
    font-kerning: normal !important;
    font-variant-ligatures: normal !important;
    text-transform: uppercase;
    line-height: 1.5 !important;
}

@media (max-width: 768px) {
    html body .website main.lc-character .lc-character-list
    .lc-character-heading > div > h3 {
        font-size: 17px !important;
    }

    html body .website main.lc-character .lc-character-list
    .lc-character-heading > div > p {
        font-size: 9px !important;
        letter-spacing: 1px !important;
    }
}



/* =========================================================
   LEGEND CLASSIC - DOWNLOAD PAGE
========================================================= */
.lc-download {
    max-width: 940px;
    margin: 0 auto;
    padding: 30px 24px 42px;
    color: #f0d6ad;
}
.lc-download-intro {
    text-align: center;
    padding: 25px 18px 28px;
    margin-bottom: 22px;
    background: linear-gradient(135deg, #291413, #44221b 55%, #211313);
    border: 1px solid #8f6338;
    border-bottom: 3px solid #a47742;
}
.lc-download-emblem {
    display: block;
    color: #e9b85d;
    font-size: 28px;
    margin-bottom: 5px;
}
.lc-download-overline {
    color: #c79a59;
    font-size: 10px;
    letter-spacing: 3px;
    margin-bottom: 8px;
}
.lc-download-intro h2 {
    color: #f3d39a;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(21px, 3vw, 29px);
    letter-spacing: 1px;
    margin-bottom: 7px;
}
.lc-download-subtitle {
    color: #d7b37d;
    font-size: 11px;
    letter-spacing: 1.5px;
}
.lc-download-card {
    max-width: 690px;
    margin: 0 auto 24px;
    padding: 24px;
    background: linear-gradient(145deg, #2c1d19, #1e1513);
    border: 1px solid #9b713f;
    box-shadow: 0 8px 24px rgba(0,0,0,.35);
}
.lc-download-card-top {
    display: flex;
    align-items: center;
    gap: 17px;
    padding-bottom: 20px;
    border-bottom: 1px solid #63472f;
}
.lc-download-file-icon {
    width: 66px;
    height: 72px;
    flex: 0 0 66px;
    display: grid;
    place-items: center;
    color: #fff0ce;
    font-family: Arial, sans-serif;
    font-weight: 800;
    font-size: 17px;
    background: linear-gradient(#a87942, #56351f);
    border: 1px solid #d0a35e;
    clip-path: polygon(0 0, 72% 0, 100% 25%, 100% 100%, 0 100%);
}
.lc-download-label {
    color: #d5a65f;
    font-size: 10px;
    font-weight: bold;
    letter-spacing: 1.5px;
}
.lc-download-file-info h3 {
    color: #fff0d0;
    font-size: clamp(17px, 2.5vw, 22px);
    margin: 4px 0;
    overflow-wrap: anywhere;
}
.lc-download-file-info p {
    color: #c4a989;
    font-size: 12px;
}
.lc-download-meta {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    padding: 19px 0;
}
.lc-download-meta div {
    padding: 12px 8px;
    text-align: center;
    background: rgba(0,0,0,.2);
    border: 1px solid #4f3929;
}
.lc-download-meta span,
.lc-download-meta strong {
    display: block;
}
.lc-download-meta span {
    color: #b99a72;
    font-size: 9px;
    letter-spacing: 1px;
    margin-bottom: 5px;
}
.lc-download-meta strong {
    color: #f2c778;
    font-size: 14px;
}
.lc-download-button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    min-height: 56px;
    padding: 13px 18px;
    color: #fff4dc;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: .5px;
    text-align: center;
    background: linear-gradient(#b17c3e, #70401f);
    border: 1px solid #e1b66f;
    box-shadow: inset 0 1px rgba(255,255,255,.16), 0 4px 12px rgba(0,0,0,.3);
    transition: filter .18s ease, transform .18s ease;
}
.lc-download-button:hover {
    color: #fff;
    filter: brightness(1.15);
    transform: translateY(-1px);
}
.lc-download-button-icon {
    font-size: 20px;
}
.lc-download-note {
    margin-top: 10px;
    color: #b99c7d;
    font-size: 11px;
    text-align: center;
}
.lc-download-guide {
    padding: 21px;
    background: #211716;
    border: 1px solid #65472f;
}
.lc-download-section-heading {
    padding-bottom: 13px;
    margin-bottom: 14px;
    border-bottom: 1px solid #5b402c;
}
.lc-download-section-heading h3 {
    color: #eac17d;
    font-size: 17px;
}
.lc-download-section-heading p {
    margin-top: 4px;
    color: #a9875d;
    font-size: 9px;
    letter-spacing: 1.5px;
}
.lc-download-steps {
    display: grid;
    gap: 12px;
}
.lc-download-step {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 13px;
    background: #2a1d19;
    border: 1px solid #493327;
}
.lc-download-step > span {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    color: #f7d18d;
    font-weight: bold;
    background: #55371f;
    border: 1px solid #a77a42;
}
.lc-download-step h4 {
    color: #f0cc8d;
    font-size: 13px;
    margin-bottom: 4px;
}
.lc-download-step p {
    color: #cbb69b;
    font-size: 12px;
    line-height: 1.65;
}
.lc-download-warning {
    max-width: 940px;
    margin: 18px auto 0;
    padding: 15px 18px;
    background: #2a1b16;
    border-left: 3px solid #b17b3e;
    color: #cdb493;
}
.lc-download-warning strong {
    display: block;
    color: #e8bd79;
    font-size: 12px;
    margin-bottom: 4px;
}
.lc-download-warning p {
    font-size: 12px;
    line-height: 1.65;
}
@media (max-width: 600px) {
    .lc-download { padding: 18px 12px 28px; }
    .lc-download-card { padding: 16px; }
    .lc-download-meta { grid-template-columns: 1fr; }
    .lc-download-meta div {
        display: flex;
        justify-content: space-between;
        align-items: center;
        text-align: left;
        padding: 10px 12px;
    }
    .lc-download-meta span { margin: 0; }
    .lc-download-guide { padding: 14px; }
}


/* =========================================================
   LEGEND CLASSIC - CHARACTER RANKING TITLE FONT FIX
   Use Tahoma for reliable Vietnamese glyph spacing on older Windows.
========================================================= */
html body .website main.lc-character .lc-character-list
.lc-character-heading > div > h3 {
    font-family: Tahoma, Arial, sans-serif !important;
    font-size: 20px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    word-spacing: 0 !important;
    font-kerning: none !important;
    font-variant-ligatures: none !important;
    text-transform: none !important;
    white-space: normal !important;
    line-height: 1.4 !important;
}

html body .website main.lc-character .lc-character-list
.lc-character-heading > div > p {
    font-family: Tahoma, Arial, sans-serif !important;
    letter-spacing: 1.5px !important;
    word-spacing: normal !important;
}