/* Source: base.css */
:root{
    --bg:#0d0908;
    --bg-soft:#16100e;
    --panel:#1b1311;
    --panel-2:#211715;
    --border:#3a2620;
    --border-light:#5a3a30;
    --primary:#7e1f1a;
    --primary-hover:#9d2a22;
    --gold:#c69a57;
    --gold-soft:#e0bb82;
    --text:#f4ece6;
    --muted:#b9a79c;
    --danger:#b43b31;
    --shadow:0 10px 30px rgba(0,0,0,.35);
    --radius:18px;
    --container:1280px;
}

*{box-sizing:border-box}

html{scroll-behavior:smooth}

html,
body{
    min-height:100%;
}

body{
    margin:0;
    font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background:
        radial-gradient(circle at top, rgba(126, 41, 26, 0.22), transparent 35%),
        linear-gradient(180deg, #120c0b 0%, #201715 100%);
    color:var(--text);
    min-height:100vh;
}

.site-shell{
    min-height:100vh;
    display:flex;
    flex-direction:column;
}

.site-content{
    flex:1;
}

.site-content::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(13, 9, 8, .92) 0%, rgba(13, 9, 8, .72) 45%, rgba(13, 9, 8, .88) 100%), url(/assets/img/home-bg-alt.webp) center / cover no-repeat;
    opacity: .04;
    pointer-events: none;
    -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0, rgba(0, 0, 0, 1) calc(100% - 90px), rgba(0, 0, 0, 0) 100%);
    mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0, rgba(0, 0, 0, 1) calc(100% - 90px), rgba(0, 0, 0, 0) 100%);
}

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

img{
    max-width:100%;
    display:block;
}

.container{
    width:min(var(--container), calc(100% - 32px));
    margin:0 auto;
}

.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    border:none;
    border-radius:14px;
    padding:13px 20px;
    font-weight:700;
    cursor:pointer;
    transition:.2s ease;
}

.btn-primary{
    background:linear-gradient(180deg, var(--primary-hover), var(--primary));
    color:#fff;
    box-shadow:0 10px 24px rgba(126,31,26,.28);
}

.btn-primary:hover{
    transform:translateY(-1px);
    filter:brightness(1.05);
}

.btn-secondary{
    background:rgba(255,255,255,.03);
    border:1px solid var(--border);
    color:var(--text);
}

.btn-secondary:hover{
    background:rgba(255,255,255,.06);
}

.muted{
    color:var(--muted);
}

/* Source: layout.css */
.section{
    padding:72px 0;
}

.section-title{
    font-size:clamp(28px, 4vw, 42px);
    margin:0 0 12px;
    line-height:1.1;
}

.section-subtitle{
    color:var(--muted);
    max-width:760px;
    line-height:1.7;
    margin:0 auto 0 0;
}

.grid-2{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:22px;
}

.grid-3{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:22px;
}

.card{
    background:linear-gradient(180deg, rgba(30,22,19,.92), rgba(21,15,13,.98));
    border:1px solid rgba(198,154,87,.12);
    border-radius:22px;
    box-shadow:var(--shadow);
    overflow:hidden;
}

.card-body{
    padding:24px;
}

.badge{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 12px;
    border-radius:999px;
    background:rgba(198,154,87,.08);
    color:var(--gold-soft);
    border:1px solid rgba(198,154,87,.15);
    font-size:12px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.12em;
}

.ranking-table{
    width:100%;
    border-collapse:collapse;
    overflow:hidden;
}

.ranking-table th,
.ranking-table td{
    padding:16px 14px;
    text-align:left;
    border-bottom:1px solid rgba(198,154,87,.08);
}

.ranking-table th{
    color:var(--gold-soft);
    font-size:13px;
    text-transform:uppercase;
    letter-spacing:.12em;
}

.ranking-table td{
    color:var(--text);
}

.ranking-table tr:last-child td{
    border-bottom:none;
}

/* Source: navbar.css */
.topbar{
    position:sticky;
    top:0;
    z-index:1002;
    backdrop-filter:blur(12px);
    background:rgba(15,10,9,.82);
    border-bottom:1px solid rgba(198,154,87,.14);
}

.navbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:82px;
    gap:24px;
}

.brand{
    display:flex;
    align-items:center;
    gap:10px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.brand-mark{
    width: 55px;
    height: 55px;
    border-radius:12px;
    display:grid;
    place-items:center;
    font-size:18px;
    opacity:.65;
}

.brand-mark img{
    filter: drop-shadow(5px 5px 4px rgba(0,0,0,0.3));
}

.brand-text{
    display:flex;
    flex-direction:column;
    line-height:1;
}

.brand-text small{
    color:var(--gold);
    font-size:11px;
    font-weight:600;
    letter-spacing:.16em;
    margin-top:6px;
}

.nav-panel{
    display:flex;
    align-items:center;
    gap:12px;
}

.nav-links{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}

.nav-link{
    padding:10px 14px;
    border-radius:12px;
    color:var(--muted);
    font-weight:600;
    transition:.2s ease;
}

.nav-link:hover,
.nav-link.active{
    color:var(--text);
    background:rgba(255,255,255,.04);
}

.nav-actions{
    display:flex;
    align-items:center;
    gap:12px;
}

.nav-account-slot{
    width:190px;
    min-width:190px;
    flex:0 0 190px;
}

.nav-account-loading,
.nav-account-unavailable,
.nav-login-button{
    width:100%;
    min-height:46px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    white-space:nowrap;
}

.nav-account-loading,
.nav-account-unavailable{
    padding:10px 14px;
    border-radius:12px;
    border:1px solid var(--border);
    background:
        linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02)),
        var(--panel);
    color:var(--muted);
    font-size:13px;
    font-weight:700;
    box-shadow:0 6px 18px rgba(0,0,0,.18);
}

.nav-account-unavailable{
    border-color:rgba(212,111,111,.24);
    background:rgba(160,33,33,.12);
    color:#ffd5d5;
}

.nav-account-spinner{
    width:18px;
    height:18px;
    border-radius:999px;
    border:2px solid rgba(198,154,87,.16);
    border-top-color:var(--gold-soft);
    animation:navAccountSpin .9s linear infinite;
    flex-shrink:0;
}

.nav-account-warning{
    width:18px;
    height:18px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:rgba(212,111,111,.18);
    color:#ffd5d5;
    font-weight:900;
    flex-shrink:0;
}

@keyframes navAccountSpin{
    to{
        transform:rotate(360deg);
    }
}

.lang-dropdown,
.account-dropdown{
    position:relative;
    min-width:130px;
}

.nav-account-slot .account-dropdown{
    width:100%;
    min-width:0;
}

.lang-trigger,
.account-trigger{
    width:100%;
    min-height:46px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:10px 14px;
    border-radius:12px;
    border:1px solid var(--border);
    background:
        linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02)),
        var(--panel);
    color:var(--text);
    cursor:pointer;
    transition:.2s ease;
    font-weight:700;
    box-shadow:0 6px 18px rgba(0,0,0,.18);
}

.lang-trigger:hover,
.account-trigger:hover{
    background:
        linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.03)),
        var(--panel-2);
    border-color:var(--border-light);
}

.lang-trigger:focus-visible,
.account-trigger:focus-visible{
    outline:none;
    border-color:var(--gold);
    box-shadow:0 0 0 3px rgba(198,154,87,.16);
}

.lang-trigger-label{
    display:flex;
    align-items:center;
    min-width:0;
}

.account-trigger-label{
    letter-spacing:.08em;
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.lang-trigger-value,
.lang-option-main{
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
}

.lang-flag{
    width:20px;
    height:20px;
    border-radius:999px;
    object-fit:cover;
    display:block;
    flex-shrink:0;
    box-shadow:
        0 0 0 1px rgba(255,255,255,.08),
        0 4px 10px rgba(0,0,0,.22);
}

.lang-trigger .lang-code{
    color:var(--text);
}

.lang-option .lang-code{
    font-weight:800;
    letter-spacing:.08em;
    color:var(--gold-soft);
}

.lang-name{
    color:var(--muted);
    font-weight:600;
    margin-left:auto;
    text-align:right;
}

.lang-trigger-arrow{
    width:10px;
    height:10px;
    border-right:2px solid var(--gold-soft);
    border-bottom:2px solid var(--gold-soft);
    transform:rotate(45deg) translateY(-1px);
    transition:transform .2s ease;
    flex-shrink:0;
    margin-right:2px;
}

.lang-dropdown.open .lang-trigger-arrow,
.account-dropdown.open .lang-trigger-arrow{
    transform:rotate(-135deg) translateY(-1px);
}

.lang-menu,
.account-menu{
    position:absolute;
    top:calc(100% + 10px);
    right:0;
    min-width:100%;
    background:linear-gradient(180deg, rgba(30,22,19,.98), rgba(21,15,13,.98));
    border:1px solid rgba(198,154,87,.14);
    border-radius:16px;
    box-shadow:var(--shadow);
    padding:8px;
    display:flex;
    flex-direction:column;
    gap:6px;
    opacity:0;
    visibility:hidden;
    transform:translateY(8px);
    pointer-events:none;
    transition:opacity .2s ease, transform .2s ease, visibility .2s ease;
    z-index:1100;
}

.lang-dropdown.open .lang-menu,
.account-dropdown.open .account-menu{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
    pointer-events:auto;
}

.lang-option,
.account-option{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    border:none;
    background:transparent;
    color:var(--text);
    padding:12px 14px;
    border-radius:12px;
    cursor:pointer;
    transition:.2s ease;
    text-align:left;
    font:inherit;
}

.lang-option:hover,
.account-option:hover{
    background:rgba(255,255,255,.05);
}

.lang-option.active{
    background:rgba(198,154,87,.10);
    border:1px solid rgba(198,154,87,.16);
}

.lang-code{
    font-weight:800;
    letter-spacing:.08em;
    color:var(--gold-soft);
}

.lang-name{
    color:var(--muted);
    font-weight:600;
}

.menu-toggle{
    display:none;
    width:52px;
    height:52px;
    border-radius:14px;
    border:1px solid var(--border);
    background:rgba(255,255,255,.03);
    cursor:pointer;
    padding:0;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:6px;
    transition:.2s ease;
}

.menu-toggle:hover{
    background:rgba(255,255,255,.06);
}

.menu-toggle span{
    display:block;
    width:22px;
    height:2px;
    background:var(--text);
    border-radius:999px;
    transition:.25s ease;
}

.nav-overlay{
    display:none;
}


/* Source: footer.css */
.footer{
    border-top:1px solid rgba(198,154,87,.1);
    padding:28px 0 40px;
    color:var(--muted);
    background:rgba(0,0,0,.12);
}

.footer-wrap{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    flex-wrap:wrap;
}

.footer-links{
    display:flex;
    gap:18px;
    flex-wrap:wrap;
}

.footer-links a:hover{
    color:var(--gold-soft);
}

/* Source: pages.css */
.page-hero{
    padding:72px 0 28px;
}

.page-hero-box{
    padding:32px;
}

.page-content{
    padding:24px 0 80px;
}

.form-card{
    max-width:620px;
    margin:0 auto;
}

.form-grid{
    display:grid;
    gap:16px;
}

.form-group{
    display:grid;
    gap:8px;
}

.form-label{
    font-weight:700;
    color:var(--text);
}

.form-input{
    width:100%;
    background:var(--panel);
    color:var(--text);
    border:1px solid var(--border);
    border-radius:14px;
    padding:14px 16px;
    outline:none;
}

@media (max-width: 1235px){
    .form-input{
        font-size: 16px;
    }
}

.form-input:focus{
    border-color:var(--gold);
    box-shadow:0 0 0 3px rgba(198,154,87,.12);
}

.form-input.is-invalid{
    border-color:#d46f6f;
    box-shadow:0 0 0 3px rgba(212,111,111,.12);
}

.form-feedback{
    border-radius:14px;
    padding:14px 16px;
    font-weight:600;
    border:1px solid transparent;
}

.form-feedback.is-error{
    color:#ffd5d5;
    background:rgba(160,33,33,.18);
    border-color:rgba(212,111,111,.25);
}

.form-feedback.is-success{
    color:#dcffe0;
    background:rgba(35,125,54,.18);
    border-color:rgba(88,196,115,.28);
}

.form-feedback.is-warning{
    color:#ffe9ae;
    background:rgba(176,124,22,.18);
    border-color:rgba(234,190,91,.28);
}

.form-error{
    min-height:18px;
    font-size:13px;
    color:#ffb3b3;
}

.checkbox-row{
    display:flex;
    align-items:center;
    gap:12px;
    width:fit-content;
    min-height:52px;
    padding:12px 14px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:16px;
    background:rgba(255,255,255,.03);
    color:var(--text);
    font-weight:700;
    cursor:pointer;
    transition:border-color .2s ease, background .2s ease, transform .2s ease;
}

.checkbox-row:hover{
    border-color:rgba(198,154,87,.22);
    background:rgba(198,154,87,.06);
}

.checkbox-row span{
    color:var(--text);
    line-height:1.4;
}

.checkbox-row input{
    appearance:none;
    -webkit-appearance:none;
    width:22px;
    height:22px;
    margin:0;
    flex-shrink:0;
    display:grid;
    place-items:center;
    border:1px solid rgba(255,255,255,.16);
    border-radius:7px;
    background:rgba(255,255,255,.03);
    transition:border-color .2s ease, background .2s ease, box-shadow .2s ease;
    cursor:pointer;
}

.checkbox-row input::before{
    content:"";
    width:10px;
    height:10px;
    border-radius:3px;
    background:linear-gradient(135deg, var(--gold-soft), var(--gold));
    transform:scale(0);
    transition:transform .16s ease;
}

.checkbox-row input:checked{
    border-color:rgba(198,154,87,.42);
    background:rgba(198,154,87,.14);
}

.checkbox-row input:checked::before{
    transform:scale(1);
}

.checkbox-row input:focus-visible{
    outline:none;
    box-shadow:0 0 0 3px rgba(198,154,87,.16);
}

.turnstile-box{
    display:flex;
    justify-content:flex-start;
    min-height:66px;
    max-width:100%;
    overflow:hidden;
    pointer-events:none;
    touch-action:pan-y;
}

.turnstile-box[data-widget-rendered="1"]{
    pointer-events:auto;
    touch-action:auto;
}

.auth-recovery-note{
    margin-top:6px;
}

.page-sections{
    display:grid;
    gap:24px;
}

.download-page{display:grid;gap:24px}
.download-section{padding:24px;border:1px solid var(--border);border-radius:8px;background:linear-gradient(180deg,rgba(34,23,20,.9),rgba(18,12,10,.94));box-shadow:0 18px 50px rgba(0,0,0,.24)}
.download-section-head{display:flex;align-items:flex-start;gap:16px;margin-bottom:20px}
.download-section-head h2{margin:0 0 6px;color:var(--text);font-size:22px}
.download-section-head p{margin:0;color:var(--muted);line-height:1.55}
.download-section-mark{display:grid;place-items:center;width:42px;height:42px;flex:0 0 auto;border:1px solid rgba(198,154,87,.28);border-radius:6px;background:rgba(198,154,87,.1);color:var(--gold-soft);font-weight:900}
.download-requirements-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.download-requirement-card,.download-item-card{border:1px solid var(--border);border-radius:7px;background:linear-gradient(180deg,rgba(48,31,26,.72),rgba(27,19,17,.84));transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}
.download-requirement-card:hover,.download-item-card:hover{border-color:rgba(198,154,87,.36);box-shadow:inset 0 0 28px rgba(198,154,87,.08),0 12px 28px rgba(0,0,0,.2);transform:translateY(-2px)}
.download-requirement-card{display:flex;align-items:flex-start;gap:14px;padding:18px}
.download-requirement-card img,.download-item-title img{width:24px;height:24px;filter:invert(74%) sepia(27%) saturate(751%) hue-rotate(357deg) brightness(90%)}
.download-requirement-card h3,.download-item-card h3{margin:0;color:var(--text);font-size:14px;text-transform:uppercase}
.download-requirement-card p,.download-item-card p{margin:7px 0 0;color:var(--muted);font-size:14px;line-height:1.55}
.download-items-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.download-item-card{display:flex;flex-direction:column;gap:18px;padding:20px}
.download-item-top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.download-item-top>span{color:var(--muted);font-size:11px;text-transform:uppercase;text-align:right}
.download-item-title{display:flex;align-items:center;gap:11px;min-width:0}
.download-item-card .btn{align-self:flex-start;min-width:140px;margin-top:auto}
.download-empty{grid-column:1/-1;padding:22px;border:1px dashed var(--border);border-radius:7px;color:var(--muted);text-align:center}
@media(max-width:1000px){.download-requirements-grid,.download-items-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.download-section{padding:18px}.download-requirements-grid,.download-items-grid{grid-template-columns:1fr}.download-item-top{flex-direction:column}.download-item-top>span{text-align:left}.download-item-card .btn{width:100%}}
@media(max-width:372px){
    .download-page{gap:16px}
    .download-section{min-width:0;padding:14px}
    .download-section-head{gap:10px}
    .download-section-mark{width:34px;height:34px;font-size:12px}
    .download-section-head>div,.download-requirement-card>div,.download-item-title{min-width:0}
    .download-section-head h2{font-size:18px;overflow-wrap:anywhere}
    .download-section-head p,.download-requirement-card p,.download-item-card p{font-size:13px;overflow-wrap:anywhere}
    .download-requirement-card,.download-item-card{min-width:0;padding:14px}
    .download-requirement-card{gap:10px}
    .download-requirement-card h3,.download-item-card h3{overflow-wrap:anywhere}
    .download-item-card .btn{min-width:0;padding-left:12px;padding-right:12px}
}

.section-head{
    margin-bottom:18px;
}

.section-head h2{
    margin:0 0 8px;
    font-size:24px;
    color:var(--text);
}

.section-head p{
    margin:0;
    color:var(--muted);
    line-height:1.6;
}

.table-wrap{
    width:100%;
    overflow-x:auto;
}

.download-table{
    width:100%;
    border-collapse:collapse;
    min-width:640px;
    background:rgba(255,255,255,.02);
    border:1px solid var(--border);
    border-radius:16px;
    overflow:hidden;
}

.download-table thead th{
    text-align:left;
    font-size:14px;
    font-weight:700;
    color:var(--gold-soft);
    background:rgba(255,255,255,.03);
    padding:16px 18px;
    border-bottom:1px solid var(--border);
}

.download-table tbody td{
    padding:16px 18px;
    border-bottom:1px solid rgba(255,255,255,.05);
    color:var(--text);
    vertical-align:middle;
}

.download-table tbody tr:last-child td{
    border-bottom:none;
}

.download-table tbody tr:hover{
    background:rgba(255,255,255,.025);
}

.download-table td:first-child,
.download-table th:first-child{
    width:72px;
    text-align:center;
}

.download-table td:last-child,
.download-table th:last-child{
    width:180px;
}

.btn-download{
    min-width:140px;
}

.download-note{
    margin:18px 0 0;
    color:var(--muted);
    line-height:1.6;
    font-size:14px;
}

@media (max-width: 768px){
    .table-wrap{
        overflow:visible;
    }

    .download-table{
        min-width:unset;
        border:none;
        background:transparent;
    }

    .download-table thead{
        display:none;
    }

    .download-table tbody{
        display:flex;
        flex-direction:column;
        gap:14px;
    }

    .download-table tbody tr{
        display:flex;
        flex-direction:column;
        gap:12px;
        padding:16px;
        background:rgba(255,255,255,.03);
        border:1px solid var(--border);
        border-radius:16px;
    }

    .download-table tbody td{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:14px;
        padding:0;
        border:none;
        width:100%;
        text-align:left !important;
    }

    .download-table tbody td:first-child{
        display:none;
    }

    .download-table tbody td:last-child{
        justify-content:stretch;
        margin-top:25px;
        width:100%;
    }

    .download-table tbody td:last-child .btn-download{
        width:100%;
    }

    .download-table tbody td::before{
        content:attr(data-label);
        font-size:13px;
        font-weight:700;
        color:var(--gold-soft);
        flex-shrink:0;
    }
}

.auth-modal-open{
    overflow:hidden;
}

.auth-modal-overlay{
    position:fixed;
    inset:0;
    z-index:1200;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
    background:rgba(7,10,18,.88);
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden;
}

.auth-modal-overlay[hidden]{
    display:none !important;
}

.auth-modal{
    position:relative;
    width:min(100%, 520px);
    padding:28px;
    border-radius:24px;
    border:1px solid rgba(198,154,87,.22);
    background:
        radial-gradient(circle at top, rgba(198,154,87,.14), transparent 38%),
        linear-gradient(180deg, rgba(19,24,38,.96), rgba(12,16,27,.98));
    box-shadow:
        0 24px 80px rgba(0,0,0,.48),
        0 0 0 1px rgba(255,255,255,.03) inset;
    transform:translateZ(0);
    contain:layout paint;
}

.auth-modal-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-bottom:16px;
    padding:7px 12px;
    border-radius:999px;
    border:1px solid rgba(198,154,87,.24);
    background:rgba(198,154,87,.10);
    color:var(--gold-soft);
    font-size:12px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.auth-modal-title{
    margin:0 0 12px;
    color:var(--text);
    font-size:28px;
    line-height:1.2;
}

.auth-modal-text{
    margin:0;
    color:var(--muted);
    font-size:15px;
    line-height:1.7;
}

.auth-modal-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin-top:26px;
}

.auth-modal-secondary{
    justify-content:center;
}

.auth-modal-close{
    position:absolute;
    top:14px;
    right:14px;
    width:40px;
    height:40px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:1px solid var(--border);
    border-radius:12px;
    background:rgba(255,255,255,.04);
    color:var(--text);
    font-size:22px;
    line-height:1;
    cursor:pointer;
    transition:all .2s ease;
}

.auth-modal-close:hover{
    border-color:rgba(198,154,87,.35);
    background:rgba(198,154,87,.10);
    color:var(--gold-soft);
}

@media (max-width: 640px){
    .auth-modal{
        padding:22px;
        border-radius:20px;
    }

    .auth-modal-title{
        font-size:23px;
    }

    .auth-modal-actions{
        grid-template-columns:1fr;
    }
}

.account-card{
    overflow:hidden;
}

.account-tabs{
    display:grid;
    gap:24px;
}

.account-tab-input{
    position:absolute;
    opacity:0;
    pointer-events:none;
}

.account-tab-nav{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    padding:8px;
    border:1px solid var(--border);
    border-radius:22px;
    background:rgba(255,255,255,.03);
}

.account-tab-link{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
    padding:0 18px;
    border-radius:16px;
    color:var(--muted);
    font-size:14px;
    font-weight:800;
    cursor:pointer;
    transition:background .2s ease, color .2s ease, border-color .2s ease;
}

.account-tab-link:hover{
    color:var(--text);
    background:rgba(255,255,255,.04);
}

#account-tab-info:checked ~ .account-tab-nav label[for="account-tab-info"],
#account-tab-security:checked ~ .account-tab-nav label[for="account-tab-security"],
#account-tab-purchases:checked ~ .account-tab-nav label[for="account-tab-purchases"]{
    border:1px solid rgba(198,154,87,.24);
    background:rgba(198,154,87,.12);
    color:var(--gold-soft);
}

.account-tab-panels{
    min-width:0;
}

.account-tab-panel{
    display:none;
}

#account-tab-info:checked ~ .account-tab-panels .account-tab-panel--info,
#account-tab-security:checked ~ .account-tab-panels .account-tab-panel--security,
#account-tab-purchases:checked ~ .account-tab-panels .account-tab-panel--purchases{
    display:grid;
    gap:24px;
}

.account-card-body{
    padding:28px;
}

.account-overview{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:20px;
    margin-bottom:24px;
}

.account-profile{
    display:flex;
    align-items:center;
    gap:18px;
    min-width:0;
}

.account-avatar{
    width:72px;
    height:72px;
    border-radius:22px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    background:linear-gradient(135deg, rgba(198,154,87,.22), rgba(198,154,87,.08));
    border:1px solid rgba(198,154,87,.22);
    color:var(--gold-soft);
    font-size:28px;
    font-weight:800;
}

.account-profile-copy{
    min-width:0;
}

.account-profile-copy h2{
    margin:0;
    color:var(--text);
    font-size:28px;
    line-height:1.2;
}

.account-profile-copy p{
    margin:6px 0 0;
    color:var(--muted);
    word-break:break-word;
}

.account-eyebrow{
    display:inline-block;
    margin-bottom:8px;
    color:var(--gold-soft);
    font-size:12px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.account-badges{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:10px;
}

.account-badge,
.account-summary-pill{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:10px 14px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.04);
    color:var(--text);
    font-size:13px;
    font-weight:700;
}

.account-badge--accent{
    border-color:rgba(198,154,87,.22);
    background:rgba(198,154,87,.10);
    color:var(--gold-soft);
}

.account-stats-grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:18px;
}

.account-stat-card{
    display:flex;
    flex-direction:column;
    gap:10px;
    min-height:168px;
    padding:22px;
    border-radius:20px;
    border:1px solid var(--border);
    background:rgba(255,255,255,.03);
}

.account-stat-card--coins{
    justify-content:space-between;
}

.account-stat-label,
.character-label,
.character-stat span{
    color:var(--muted);
    font-size:13px;
    font-weight:700;
}

.account-stat-value{
    color:var(--text);
    font-size:32px;
    line-height:1.15;
}

.account-stat-value--small{
    font-size:22px;
    word-break:break-word;
}

.account-stat-meta{
    color:var(--muted);
    line-height:1.6;
}

.account-section-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
}

.account-summary-pills{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:10px;
}

.account-empty-state{
    padding:28px;
    border-radius:20px;
    border:1px dashed rgba(255,255,255,.12);
    background:rgba(255,255,255,.02);
}

.account-empty-state h3{
    margin:0 0 8px;
    color:var(--text);
    font-size:22px;
}

.account-empty-state p{
    margin:0;
    color:var(--muted);
    line-height:1.6;
}

.remote-data-state{
    padding:18px 20px;
    border-radius:18px;
    border:1px solid rgba(198,154,87,.14);
    background:rgba(255,255,255,.03);
    color:var(--muted);
    line-height:1.7;
}

.remote-data-state--loading,
.remote-inline-loading{
    display:flex;
    align-items:center;
    gap:12px;
}

.remote-data-spinner{
    width:24px;
    height:24px;
    border-radius:999px;
    border:3px solid rgba(198,154,87,.16);
    border-top-color:var(--gold-soft);
    animation:remoteDataSpin .9s linear infinite;
    flex-shrink:0;
}

.remote-inline-loading .remote-data-spinner{
    width:18px;
    height:18px;
    border-width:2px;
}

@keyframes remoteDataSpin{
    to{
        transform:rotate(360deg);
    }
}

.remote-data-state.is-error{
    border-color:rgba(212,111,111,.2);
    background:rgba(160,33,33,.12);
    color:#ffd5d5;
}

.account-characters-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:18px;
}

.character-card{
    padding:22px;
    border-radius:22px;
    border:1px solid var(--border);
    background:rgba(255,255,255,.03);
}

.character-card-top{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    margin-bottom:18px;
}

.character-card-top h3{
    margin:6px 0 0;
    color:var(--text);
    font-size:24px;
    line-height:1.2;
    word-break:break-word;
}

.character-level-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:10px 14px;
    border-radius:999px;
    border:1px solid rgba(198,154,87,.22);
    background:rgba(198,154,87,.10);
    color:var(--gold-soft);
    font-weight:800;
    white-space:nowrap;
}

.character-stats-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:14px;
}

.character-stat{
    display:grid;
    gap:8px;
    padding:14px;
    border-radius:16px;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(255,255,255,.05);
}

.character-stat strong{
    color:var(--text);
    font-size:16px;
    line-height:1.4;
    word-break:break-word;
}

.account-panels-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:24px;
}

.account-panel-card{
    height:100%;
}

.account-panel-head{
    margin-bottom:20px;
}

.account-form-note{
    padding:14px 16px;
    border-radius:16px;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.03);
    color:var(--muted);
    line-height:1.6;
    font-size:14px;
}

.account-form-actions{
    display:flex;
    justify-content:flex-start;
    gap:12px;
}

.account-form-note, .form-feedback{
    margin-bottom: 15px;
}

.account-purchase-table-wrap{
    overflow:auto;
    border:1px solid var(--border);
    border-radius:18px;
    background:rgba(255,255,255,.02);
}

.account-purchase-tabs{
    display:grid;
    gap:18px;
}

.account-purchase-tab-input{
    position:absolute;
    opacity:0;
    pointer-events:none;
}

.account-purchase-tab-nav{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    padding:8px;
    border:1px solid var(--border);
    border-radius:18px;
    background:rgba(255,255,255,.025);
}

.account-purchase-tab-link{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:42px;
    padding:0 16px;
    border-radius:14px;
    color:var(--muted);
    font-size:14px;
    font-weight:800;
    cursor:pointer;
    transition:.2s ease;
}

.account-purchase-tab-link:hover{
    color:var(--text);
    background:rgba(255,255,255,.04);
}

#account-purchase-tab-coins:checked ~ .account-purchase-tab-nav label[for="account-purchase-tab-coins"],
#account-purchase-tab-premium:checked ~ .account-purchase-tab-nav label[for="account-purchase-tab-premium"]{
    border:1px solid rgba(198,154,87,.24);
    background:rgba(198,154,87,.12);
    color:var(--gold-soft);
}

.account-purchase-tab-panel{
    display:none;
}

#account-purchase-tab-coins:checked ~ .account-purchase-tab-panels .account-purchase-tab-panel--coins,
#account-purchase-tab-premium:checked ~ .account-purchase-tab-panels .account-purchase-tab-panel--premium{
    display:block;
}

.account-purchase-table{
    width:100%;
    border-collapse:collapse;
    min-width:620px;
}

.account-purchase-table th,
.account-purchase-table td{
    padding:16px 18px;
    border-bottom:1px solid rgba(255,255,255,.06);
    text-align:left;
}

.account-purchase-table th{
    color:var(--gold-soft);
    font-size:12px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
    background:rgba(198,154,87,.06);
}

.account-purchase-table td{
    color:var(--muted);
}

.account-purchase-table td strong{
    color:#98f0aa;
}

.account-purchase-table tr:last-child td{
    border-bottom:0;
}

.text-success{
    color:#98f0aa !important;
}

.text-muted-soft{
    color:var(--muted) !important;
}

[data-auth-dialog][hidden]{
    display:none !important;
}

.auth-modal--wide{
    width:min(100%, 560px);
}

.auth-modal-header{
    padding-right:30px;
}

.auth-modal-header p{
    margin:0;
    color:var(--muted);
    line-height:1.7;
}

.auth-modal-note{
    margin-top:4px;
}

.auth-inline-actions{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
    margin-top:4px;
}

.auth-text-button{
    appearance:none;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:100%;
    padding:12px 16px;
    border:1px solid rgba(198,154,87,.28);
    border-radius:14px;
    background:rgba(255,255,255,.02);
    color:var(--gold-soft);
    font:inherit;
    font-weight:700;
    cursor:pointer;
    text-decoration:none;
    box-shadow:0 0 0 1px rgba(255,255,255,.02) inset;
    transition:border-color .2s ease, background .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
    font-size: 0.8em;
}

.auth-text-button:hover{
    border-color:rgba(198,154,87,.42);
    background:rgba(198,154,87,.08);
    color:var(--text);
    transform:translateY(-1px);
    box-shadow:0 10px 24px rgba(0,0,0,.18);
}

.auth-text-button:focus-visible{
    outline:none;
    border-color:rgba(198,154,87,.42);
    box-shadow:0 0 0 3px rgba(198,154,87,.14);
}

.auth-text-button:active{
    transform:translateY(0);
}

.login-inline-row{
    display:grid;
    grid-template-columns:minmax(220px, 220px) minmax(0, 1fr);
    align-items:start;
    gap:16px;
}

.login-remember-box{
    width:100%;
    min-height:66px;
    justify-content:flex-start;
}

.login-turnstile-group{
    margin:0;
}

.login-turnstile-group .turnstile-box{
    min-height:66px;
    align-items:flex-start;
}

.auth-loading-overlay{
    position:fixed;
    inset:0;
    z-index:9999;
    display:grid;
    place-items:center;
    padding:24px;
    background:rgba(8,8,10,.88);
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden;
}

.auth-effects-enhanced .auth-modal-overlay{
    background:rgba(7,10,18,.72);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
}

.auth-effects-enhanced .auth-loading-overlay{
    background:rgba(8,8,10,.72);
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
}

.auth-loading-box{
    width:min(100%, 420px);
    padding:28px 24px;
    border-radius:24px;
    border:1px solid rgba(255,255,255,.10);
    background:linear-gradient(180deg, rgba(34,26,18,.96), rgba(20,15,11,.96));
    box-shadow:0 30px 80px rgba(0,0,0,.45);
    text-align:center;
    transform:translateZ(0);
    contain:layout paint;
}

.auth-loading-spinner{
    width:54px;
    height:54px;
    margin:0 auto 18px;
    border-radius:50%;
    border:4px solid rgba(255,255,255,.12);
    border-top-color:var(--gold);
    animation:authSpin .85s linear infinite;
}

.auth-loading-title{
    margin:0 0 10px;
    color:var(--text);
    font-size:24px;
    line-height:1.2;
}

.auth-loading-text{
    margin:0;
    color:var(--muted);
    line-height:1.6;
    font-size:15px;
}

.auth-loading-overlay[hidden]{
    display:none !important;
}

@keyframes authSpin{
    to{
        transform:rotate(360deg);
    }
}

.ranking-layout{
    display:grid;
    grid-template-columns:280px minmax(0,1fr);
    gap:24px;
    align-items:start;
}

.ranking-sidebar{
    position:sticky;
    top:110px;
}

.ranking-sidebar-head{
    margin-bottom:18px;
}

.ranking-sidebar-head h2{
    margin:0 0 8px;
    color:var(--text);
    font-size:22px;
}

.ranking-sidebar-head p{
    margin:0;
    color:var(--muted);
    line-height:1.6;
}

.ranking-mobile-select{
    display:none;
    margin-bottom:16px;
}

.ranking-category-list{
    display:grid;
    gap:10px;
}

.ranking-category-button{
    width:100%;
    text-align:left;
    border:1px solid var(--border);
    background:rgba(255,255,255,.03);
    color:var(--text);
    border-radius:16px;
    padding:14px 16px;
    cursor:pointer;
    transition:.2s ease;
    display:grid;
    gap:4px;
}

.ranking-category-button:hover,
.ranking-category-button[aria-current="true"]{
    border-color:rgba(198,154,87,.35);
    background:rgba(198,154,87,.08);
    box-shadow:0 10px 30px rgba(0,0,0,.18);
}

.ranking-category-button small{
    color:var(--muted);
    font-size:12px;
}

.ranking-main{
    display:grid;
    gap:24px;
}

.ranking-toolbar-body{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:18px;
    flex-wrap:wrap;
}

.ranking-current-title{
    margin:0 0 8px;
    color:var(--text);
    font-size:26px;
}

.ranking-current-subtitle{
    margin:0;
    color:var(--muted);
    line-height:1.6;
}

.ranking-search{
    width:min(100%, 360px);
}

.ranking-table-wrap{
    width:100%;
    overflow-x:auto;
}

.ranking-table{
    width:100%;
    border-collapse:collapse;
    border:1px solid var(--border);
    border-radius:16px;
    overflow:hidden;
    background:rgba(255,255,255,.02);
}

.ranking-table th,
.ranking-table td{
    padding:16px 18px;
    border-bottom:1px solid rgba(255,255,255,.05);
    color:var(--text);
    text-align:left;
    vertical-align:middle;
}

.ranking-table th{
    color:var(--gold-soft);
    font-size:14px;
    font-weight:700;
    background:rgba(255,255,255,.03);
}

.ranking-table tbody tr:hover{
    background:rgba(255,255,255,.025);
}

.ranking-table tbody tr:last-child td{
    border-bottom:none;
}

.ranking-table th:first-child,
.ranking-table td:first-child{
    width:72px;
    text-align:center;
}

.ranking-empty{
    margin-top:18px;
    padding:18px;
    border:1px solid var(--border);
    border-radius:16px;
    color:var(--muted);
    text-align:center;
    background:rgba(255,255,255,.03);
}

.ranking-feedback{
    margin-bottom:18px;
    border-radius:14px;
    padding:14px 16px;
    font-weight:600;
    border:1px solid transparent;
}

.ranking-feedback.is-error{
    color:#ffd5d5;
    background:rgba(160,33,33,.18);
    border-color:rgba(212,111,111,.25);
}

.ranking-pagination{
    margin-top:22px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    flex-wrap:wrap;
}

.ranking-pagination-pages{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
    justify-content:center;
}

.ranking-page-button{
    min-width:44px;
    height:44px;
    border-radius:12px;
    border:1px solid var(--border);
    background:rgba(255,255,255,.03);
    color:var(--text);
    font-weight:700;
    cursor:pointer;
    transition:.2s ease;
    padding:0 10px;
    flex:0 0 auto;
}

.ranking-page-button:hover,
.ranking-page-button.is-active{
    border-color:rgba(198,154,87,.35);
    background:rgba(198,154,87,.12);
}

@media (max-width: 991px){
    .ranking-layout{
        grid-template-columns:1fr;
    }

    .ranking-sidebar{
        position:static;
    }

    .ranking-mobile-select{
        display:block;
    }

    .ranking-category-list{
        display:none;
    }
}

@media (max-width: 768px){
    .ranking-toolbar-body{
        align-items:stretch;
    }

    .ranking-search{
        width:100%;
    }

    .ranking-table{
        min-width:640px;
    }

        .ranking-pagination{
        flex-wrap:nowrap;
        gap:6px;
        justify-content:center;
    }

    .ranking-pagination .btn{
        min-width:36px;
        height:36px;
        padding:0 10px;
        border-radius:10px;
        flex:0 0 auto;
    }

    .ranking-pagination-pages{
        flex-wrap:nowrap;
        gap:4px;
        overflow:hidden;
    }

    .ranking-page-button{
        min-width:34px;
        height:34px;
        padding:0 6px;
        border-radius:10px;
        font-size:13px;
    }
}

.ranking-position-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:36px;
    height:36px;
    padding:0 10px;
    border-radius:999px;
    border:1px solid var(--border);
    background:rgba(255,255,255,.04);
    color:var(--text);
    font-weight:800;
}

.ranking-row-top td{
    font-weight:700;
}

.ranking-row-top-1{
    background:rgba(255, 215, 0, .10);
}

.ranking-row-top-2{
    background:rgba(192, 192, 192, .10);
}

.ranking-row-top-3{
    background:rgba(205, 127, 50, .12);
}

.ranking-position-badge.is-top-1{
    border-color:rgba(255, 215, 0, .45);
    background:rgba(255, 215, 0, .18);
    color:#ffe27a;
}

.ranking-position-badge.is-top-2{
    border-color:rgba(192, 192, 192, .45);
    background:rgba(192, 192, 192, .16);
    color:#f1f1f1;
}

.ranking-position-badge.is-top-3{
    border-color:rgba(205, 127, 50, .45);
    background:rgba(205, 127, 50, .18);
    color:#f2bf8a;
}

.ranking-toolbar-body{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
    flex-wrap:wrap;
}

.ranking-toolbar-meta{
    min-width:0;
    flex:1 1 320px;
}

.ranking-toolbar-actions{
    display:flex;
    flex-direction:column;
    align-items:flex-end;
    gap:10px;
    flex:0 1 360px;
    width:min(100%, 360px);
}

.ranking-current-title{
    margin:0 0 8px;
    color:var(--text);
    font-size:26px;
}

.ranking-current-subtitle{
    margin:0;
    color:var(--muted);
    line-height:1.6;
}

.ranking-search{
    width:100%;
}

.ranking-reset-timer{
    display:inline-flex;
    align-items:center;
    justify-content: space-between;
    gap:8px;
    padding:10px 14px;
    border-radius:12px;
    border:1px solid rgba(198,154,87,.22);
    background:rgba(198,154,87,.08);
    color:var(--gold-soft);
    font-size:14px;
    font-weight:600;
    line-height:1.4;
    width:100%;
    text-align:right;
}

.ranking-reset-timer strong{
    color:var(--text);
    font-weight:800;
}

@media (max-width: 1235px){
    .ranking-toolbar-body{
        align-items:stretch;
    }

    .ranking-toolbar-actions{
        width:100%;
        flex:1 1 100%;
        align-items:stretch;
    }

    .ranking-reset-timer{
        width:100%;
        justify-content:space-between;
        text-align:left;
    }

    .ranking-search{
        width:100%;
    }

    .ranking-table{
        min-width:640px;
    }
}

.ranking-board-switch{
    margin-top:20px;
    display:flex;
    gap:12px;
    flex-wrap:wrap;
}

.ranking-board-button{
    min-width:140px;
    height:46px;
    padding:0 18px;
    border-radius:14px;
    border:1px solid var(--border);
    background:rgba(255,255,255,.03);
    color:var(--text);
    font-weight:700;
    cursor:pointer;
    transition:.2s ease;
}

.ranking-board-button:hover,
.ranking-board-button[aria-current="true"]{
    border-color:rgba(198,154,87,.35);
    background:rgba(198,154,87,.12);
}

.ranking-layout.is-guild-mode{
    grid-template-columns:minmax(0,1fr);
}

.ranking-layout.is-guild-mode .ranking-sidebar{
    display:none;
}

@media (max-width: 768px){
    .ranking-board-switch{
        gap:10px;
    }

    .ranking-board-button{
        flex:1 1 0;
        min-width:0;
    }
}

.shop-switch{
    display:flex;
    gap:12px;
    margin-bottom:24px;
    flex-wrap:wrap;
}

.shop-panel{
    overflow:visible;
}

.shop-panel-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;
    margin-bottom:24px;
    flex-wrap:wrap;
}

.shop-panel-head h2{
    margin:0 0 8px;
    color:var(--text);
    font-size:28px;
}

.shop-panel-head p{
    margin:0;
    color:var(--muted);
    line-height:1.6;
}

.shop-provider-badge,
.shop-balance-card{
    min-width:220px;
    padding:16px 18px;
    border-radius:18px;
    border:1px solid rgba(198,154,87,.22);
    background:rgba(255,255,255,.03);
    display:grid;
    gap:4px;
}

.shop-provider-badge span,
.shop-balance-card span{
    font-size:13px;
    color:var(--muted);
}

.shop-provider-badge strong,
.shop-balance-card strong{
    color:var(--text);
    font-size:22px;
    font-weight:800;
}

.shop-package-grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:18px;
}

.shop-premium-flow .shop-package-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
}

.shop-package-card{
    position:relative;
    border:1px solid var(--border);
    border-radius:22px;
    background:rgba(255,255,255,.025);
    padding:22px;
    display:grid;
    gap:18px;
    transition:.2s ease;
}

.shop-package-card:hover{
    border-color:rgba(198,154,87,.35);
    box-shadow:0 18px 40px rgba(0,0,0,.18);
}

.shop-package-card.is-featured{
    border-color:rgba(198,154,87,.35);
    box-shadow:0 18px 40px rgba(0,0,0,.18);
}

.shop-package-badge{
    position:absolute;
    top:14px;
    right:14px;
    padding:8px 12px;
    border-radius:999px;
    background:rgba(198,154,87,.18);
    border:1px solid rgba(198,154,87,.28);
    color:var(--gold-soft);
    font-size:12px;
    font-weight:800;
}

.shop-package-coins{
    display:grid;
    gap:6px;
}

.shop-package-old{
    color:var(--muted);
    text-decoration:line-through;
    font-size:15px;
}

.shop-package-main{
    color:var(--text);
    font-size:34px;
    font-weight:900;
    line-height:1.1;
}

.shop-package-sub{
    color:#9bc34b;
    font-weight:700;
}

.shop-package-price{
    color:var(--gold-soft);
    font-size:28px;
    font-weight:900;
}

.shop-package-promo{
    padding:10px 12px;
    border-radius:12px;
    background:rgba(155,195,75,.10);
    border:1px solid rgba(155,195,75,.20);
    color:#b8db69;
    font-size:14px;
    font-weight:700;
}

.shop-buy-button{
    width:100%;
}

.shop-premium-flow{
    display:grid;
    gap:22px;
}

.shop-premium-steps{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr)) minmax(220px, .8fr);
    gap:12px;
    align-items:stretch;
    padding:10px;
    border:1px solid var(--border);
    border-radius:22px;
    background:rgba(255,255,255,.03);
}

.shop-premium-step{
    display:flex;
    align-items:center;
    gap:12px;
    min-height:58px;
    padding:12px 14px;
    border:1px solid transparent;
    border-radius:16px;
    background:transparent;
    color:var(--muted);
    cursor:pointer;
    text-align:left;
    transition:.2s ease;
}

.shop-premium-step:disabled{
    cursor:not-allowed;
    opacity:.55;
}

.shop-premium-step:not(:disabled):hover,
.shop-premium-step.is-active{
    border-color:rgba(198,154,87,.28);
    background:rgba(198,154,87,.10);
    color:var(--text);
}

.shop-premium-step span{
    width:32px;
    height:32px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
    border:1px solid rgba(198,154,87,.24);
    color:var(--gold-soft);
    font-weight:900;
}

.shop-premium-step strong{
    font-size:14px;
}

.shop-premium-selected{
    display:grid;
    gap:4px;
    padding:12px 14px;
    border-radius:16px;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.03);
}

.shop-premium-selected span,
.shop-premium-package-summary span{
    color:var(--muted);
    font-size:13px;
    font-weight:700;
}

.shop-premium-selected strong,
.shop-premium-package-summary strong{
    color:var(--text);
    font-size:18px;
}

.shop-premium-step-panel{
    display:none;
}

.shop-premium-step-panel.is-active{
    display:block;
}

.shop-premium-intro-grid{
    display:grid;
    grid-template-columns:minmax(0, 1.35fr) minmax(280px, .65fr);
    gap:18px;
    align-items:start;
}

.shop-character-card,
.shop-premium-benefits,
.shop-premium-package-summary{
    padding:22px;
    border-radius:22px;
    border:1px solid var(--border);
    background:rgba(255,255,255,.025);
}

.shop-premium-section-head{
    margin-bottom:18px;
}

.shop-premium-section-head h3,
.shop-premium-benefits h3{
    margin:0 0 8px;
    color:var(--text);
    font-size:24px;
}

.shop-premium-section-head p{
    margin:0;
    color:var(--muted);
    line-height:1.6;
}

.shop-character-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:14px;
    margin-top:16px;
}

.shop-character-option{
    display:grid;
    gap:8px;
    min-height:128px;
    padding:18px;
    border:1px solid var(--border);
    border-radius:18px;
    background:rgba(255,255,255,.03);
    color:var(--text);
    cursor:pointer;
    text-align:left;
    transition:.2s ease;
}

.shop-character-option:hover,
.shop-character-option.is-active{
    border-color:rgba(198,154,87,.46);
    background:rgba(198,154,87,.08);
    box-shadow:0 18px 42px rgba(198,154,87,.08);
}

.shop-character-option span{
    color:var(--muted);
    font-size:12px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.shop-character-option strong{
    color:var(--text);
    font-size:22px;
    line-height:1.2;
    word-break:break-word;
}

.shop-character-option small{
    color:var(--gold-soft);
    font-weight:800;
}

.shop-premium-flow-actions{
    display:flex;
    justify-content:flex-end;
    margin-top:18px;
}

.shop-premium-benefits ul{
    display:grid;
    gap:12px;
    margin:16px 0 0;
    padding:0;
    list-style:none;
}

.shop-premium-benefits li{
    position:relative;
    padding-left:24px;
    color:var(--muted);
    line-height:1.65;
}

.shop-premium-benefits li::before{
    content:"";
    position:absolute;
    top:.72em;
    left:0;
    width:8px;
    height:8px;
    border-radius:999px;
    background:var(--gold-soft);
    box-shadow:0 0 18px rgba(198,154,87,.3);
}

.shop-premium-benefits-featured{
    padding:30px;
}

.shop-premium-benefits-featured h3{
    font-size:32px;
    line-height:1.18;
}

.shop-premium-benefits-featured ul{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:16px;
    margin-top:22px;
}

.shop-premium-benefits-featured li{
    padding:16px 18px 16px 42px;
    border-radius:16px;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.025);
    color:var(--text);
}

.shop-premium-benefits-featured li::before{
    top:24px;
    left:20px;
}

.shop-premium-package-summary{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
    margin-bottom:18px;
}

.shop-premium-package-summary > div{
    display:grid;
    gap:4px;
}

.shop-premium-prices{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
}

.shop-premium-price-box{
    padding:14px 16px;
    border-radius:16px;
    border:1px solid var(--border);
    background:rgba(255,255,255,.03);
    display:grid;
    gap:6px;
}

.shop-premium-price-box span{
    color:var(--muted);
    font-size:13px;
}

.shop-premium-price-box strong{
    color:var(--text);
    font-size:22px;
    font-weight:800;
}

.shop-premium-actions{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:14px;
}

.shop-premium-form{
    display:grid;
    gap:12px;
}

.shop-empty-state{
    grid-column:1 / -1;
    padding:24px;
    text-align:center;
    border:1px solid var(--border);
    border-radius:18px;
    color:var(--muted);
    background:rgba(255,255,255,.02);
}

.shop-status-card{
    max-width:900px;
    margin:0 auto;
}

.shop-status-body{
    display:flex;
    align-items:flex-start;
    gap:24px;
}

.shop-status-icon{
    width:74px;
    height:74px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:34px;
    font-weight:900;
    flex:0 0 auto;
}

.shop-status-icon.is-success{
    background:rgba(120, 180, 90, .12);
    border:1px solid rgba(120, 180, 90, .25);
    color:#a6d67c;
}

.shop-status-icon.is-cancel{
    background:rgba(214,106,106,.12);
    border:1px solid rgba(214,106,106,.25);
    color:#f0a2a2;
}

.shop-status-content{
    display:grid;
    gap:16px;
}

.shop-status-content h2{
    margin:0;
    color:var(--text);
    font-size:30px;
}

.shop-status-content p{
    margin:0;
    color:var(--muted);
    line-height:1.7;
}

.shop-status-note{
    padding:16px 18px;
    border-radius:16px;
    border:1px solid rgba(198,154,87,.18);
    background:rgba(255,255,255,.03);
    display:grid;
    gap:4px;
}

.shop-status-note[hidden]{
    display:none;
}

.shop-status-note strong{
    color:var(--text);
}

.shop-status-note span{
    color:var(--muted);
}

.shop-payment-summary{
    display:grid;
    gap:10px;
    padding:16px;
    border-radius:18px;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.03);
}

.shop-payment-summary-row{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
    padding:12px 0;
    border-bottom:1px solid rgba(255,255,255,.06);
}

.shop-payment-summary-row:last-child{
    border-bottom:0;
}

.shop-payment-summary-row span{
    color:var(--muted);
    font-size:13px;
    font-weight:700;
}

.shop-payment-summary-row strong{
    color:var(--text);
    text-align:right;
    word-break:break-word;
}

.shop-payment-summary-row--coins strong{
    color:#98f0aa;
}

.shop-status-actions{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
}

@media (max-width: 1100px){
    .shop-package-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }

    .shop-premium-actions{
        grid-template-columns:1fr;
    }
}

@media (max-width: 768px){
    .shop-package-grid,
    .shop-premium-flow .shop-package-grid{
        grid-template-columns:1fr;
    }

    .shop-panel-head{
        flex-direction:column;
    }

    .shop-provider-badge,
    .shop-balance-card{
        width:100%;
        min-width:0;
    }

    .shop-premium-prices{
        grid-template-columns:1fr;
    }

    .shop-status-body{
        flex-direction:column;
    }

    .shop-status-actions{
        flex-direction:column;
    }

    .shop-status-actions .btn{
        width:100%;
    }

    .shop-payment-summary-row{
        flex-direction:column;
        gap:6px;
    }

    .shop-payment-summary-row strong{
        text-align:left;
    }
}

.shop-layout{
    display:grid;
    grid-template-columns:280px minmax(0,1fr);
    gap:24px;
    align-items:start;
}

.shop-methods-card{
    position:sticky;
    top:110px;
    height: 100%;
}

.shop-methods-head{
    margin-bottom:18px;
}

.shop-methods-head h3{
    margin:0 0 8px;
    color:var(--text);
    font-size:22px;
}

.shop-methods-head p{
    margin:0;
    color:var(--muted);
    line-height:1.6;
}

.shop-method-list{
    display:grid;
    gap:10px;
}

.shop-method-button{
    width:100%;
    text-align:left;
    border:1px solid var(--border);
    background:rgba(255,255,255,.03);
    color:var(--text);
    border-radius:16px;
    padding:14px 16px;
    cursor:default;
    transition:.2s ease;
    display:flex;
    align-items:center;
    gap:12px;
}

.shop-method-button.is-active{
    border-color:rgba(198,154,87,.35);
    background:rgba(198,154,87,.08);
    box-shadow:0 10px 30px rgba(0,0,0,.18);
}

.shop-method-icon{
    width:40px;
    height:40px;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(198,154,87,.16);
    border:1px solid rgba(198,154,87,.26);
    color:var(--gold-soft);
    font-weight:900;
}

.shop-method-text{
    display:grid;
    gap:2px;
}

.shop-method-text strong{
    color:var(--text);
    font-size:15px;
}

.shop-method-text small{
    color:var(--muted);
    font-size:12px;
}

.shop-main{
    min-width:0;
}

.shop-character-card{
    margin-bottom:20px;
}

@media (max-width: 991px){
    .shop-layout{
        grid-template-columns:1fr;
    }

    .shop-methods-card{
        position:static;
    }
}

.shop-hero-switch{
    margin-top:20px;
    display:flex;
    gap:12px;
    flex-wrap:wrap;
}

.shop-hero-switch-button{
    min-width:140px;
    height:46px;
    padding:0 18px;
    border-radius:14px;
    border:1px solid var(--border);
    background:rgba(255,255,255,.03);
    color:var(--text);
    font-weight:700;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    transition:.2s ease;
}

.shop-hero-switch-button:hover,
.shop-hero-switch-button.is-active{
    border-color:rgba(198,154,87,.35);
    background:rgba(198,154,87,.12);
}

@media (max-width: 768px){
    .shop-hero-switch{
        gap:10px;
    }

    .shop-hero-switch-button{
        flex:1 1 0;
        min-width:0;
    }
}
.maintenance-login-page {
    min-height: 100svh;
    background:
        radial-gradient(circle at 50% 42%, rgba(125, 76, 41, .12), transparent 38%),
        linear-gradient(180deg, rgba(8, 6, 5, .7), rgba(8, 6, 5, .94)),
        url("../img/maintenance/header-maintenance-20260703-1930.png") center / cover fixed no-repeat;
}

.maintenance-login-page .site-shell,
.maintenance-login-page .site-content {
    min-height: 100svh;
}

.maintenance-login-content {
    display: grid;
    min-height: 100svh;
    place-items: center;
    padding: 30px 16px;
}

.maintenance-login-content .container {
    width: min(100%, 520px);
}

.maintenance-login-content .form-card {
    border-color: rgba(205, 164, 104, .2);
    background: rgba(14, 11, 10, .88);
    box-shadow: 0 28px 80px rgba(0, 0, 0, .55);
    backdrop-filter: blur(12px);
}

.maintenance-login-content .login-inline-row {
    grid-template-columns: 1fr;
}

.maintenance-login-content .login-remember-box {
    min-height: auto;
}

.maintenance-login-content .login-turnstile-group,
.maintenance-login-content .turnstile-box {
    width: 100%;
    min-width: 0;
}

.maintenance-login-content .turnstile-box {
    overflow: visible;
}

.maintenance-login-heading {
    display: grid;
    justify-items: center;
    gap: 8px;
    margin-bottom: 26px;
    text-align: center;
}

.maintenance-login-heading img {
    width: 130px;
    height: auto;
    margin-bottom: 8px;
}

.maintenance-login-heading h1 {
    margin: 0;
    color: #e4c79c;
    font-family: Cinzel, serif;
    font-size: clamp(1.6rem, 5vw, 2.15rem);
    font-weight: 600;
}

.maintenance-login-heading p {
    margin: 0;
    color: #9d9088;
    font-size: .85rem;
    line-height: 1.55;
}
.terms-document{display:grid;grid-template-columns:minmax(220px,.32fr) minmax(0,1fr);gap:28px;align-items:start}
.terms-toc{position:sticky;top:104px;display:grid;gap:6px;padding:22px;border:1px solid rgba(190,145,79,.25);border-radius:18px;background:rgba(12,8,6,.72);box-shadow:0 24px 60px rgba(0,0,0,.24)}
.terms-toc>span{margin-bottom:8px;color:#d9ae6c;font-family:var(--font-display);font-size:1.15rem;text-transform:uppercase;letter-spacing:.08em}
.terms-toc a{padding:8px 10px;border-radius:8px;color:var(--text-muted);font-size:.9rem;line-height:1.35}
.terms-toc a:hover{color:var(--text);background:rgba(190,145,79,.1)}
.terms-sections{display:grid;gap:14px}
.terms-section{display:grid;grid-template-columns:54px minmax(0,1fr);gap:18px;padding:26px 28px;border:1px solid rgba(190,145,79,.22);border-radius:18px;background:linear-gradient(145deg,rgba(28,18,14,.86),rgba(10,7,6,.86));box-shadow:0 22px 55px rgba(0,0,0,.22);scroll-margin-top:100px}
.terms-section-number{color:#b88a4d;font-family:var(--font-display);font-size:1.25rem}
.terms-section h2{margin:0 0 12px;color:#ead1aa;font-family:var(--font-display);font-size:clamp(1.15rem,2vw,1.45rem)}
.terms-section-copy{color:var(--text-muted);line-height:1.8}
@media(max-width:860px){.terms-document{grid-template-columns:1fr}.terms-toc{position:static}.terms-section{grid-template-columns:38px minmax(0,1fr);padding:21px 18px;gap:10px}}


/* Source: responsive.css */
@media (max-width: 1100px){
    .hero-grid,
    .grid-3,
    .grid-2{
        grid-template-columns:1fr;
    }
}

@media (max-width: 1235px){
    .navbar{
        position:relative;
        min-height:auto;
        padding:16px 0;
        display:grid;
        grid-template-columns:1fr auto;
        align-items:center;
        gap:14px;
    }

    .brand{
        min-width:0;
        position:relative;
        z-index:1001;
    }

    .menu-toggle{
        display:flex;
        position:relative;
        z-index:1001;
    }

    .nav-overlay{
        display:block;
        position:fixed;
        inset:0;
        background:rgba(8, 6, 6, 0.48);
        backdrop-filter:blur(8px);
        -webkit-backdrop-filter:blur(8px);
        opacity:0;
        visibility:hidden;
        pointer-events:none;
        transition:opacity .25s ease, visibility .25s ease;
        z-index:1000;
    }

    .nav-overlay.active{
        opacity:1;
        visibility:visible;
        pointer-events:auto;
    }

    .nav-panel{
        position:absolute;
        top:100%;
        left:0;
        right:0;
        margin-top:12px;
        display:none;
        width:100%;
        padding:14px;
        border-radius:18px;
        background:linear-gradient(180deg, rgba(30,22,19,.98), rgba(21,15,13,.98));
        border:1px solid rgba(198,154,87,.12);
        box-shadow:var(--shadow);
        flex-direction:column;
        align-items:stretch;
        z-index:1003;
        overflow:visible;
    }

    .navbar.menu-open .nav-panel{
        display:flex;
    }

    .navbar.menu-open .nav-overlay{
        opacity:1;
        visibility:visible;
        pointer-events:auto;
    }

    .nav-actions{
        order:-1;
        width:100%;
        display:flex;
        flex-direction:column;
        align-items:stretch;
        justify-content:flex-start;
        gap:10px;
        margin-top:0;
        margin-bottom:12px;
    }

    .nav-links{
        order:2;
        width:100%;
        flex-direction:column;
        align-items:stretch;
        gap:8px;
    }

    .nav-link{
        width:100%;
        padding:13px 14px;
        border-radius:12px;
    }

    .nav-actions form,
    .nav-account-slot,
    .nav-login-button,
    .nav-account-loading,
    .nav-account-unavailable,
    .lang-dropdown,
    .account-dropdown{
        width:100%;
        min-width:0;
        flex-basis:auto;
    }

    .lang-dropdown{
        order:-2;
        position:relative;
    }

    .account-dropdown{
        order:2;
        position:relative;
    }

    .lang-trigger,
    .account-trigger{
        width:100%;
        justify-content:space-between;
    }

    .lang-menu,
    .account-menu{
        position:absolute;
        top:calc(100% + 8px);
        left:0;
        right:0;
        margin-top:0;
        min-width:100%;
        width:100%;
        max-width:none;
        box-sizing:border-box;
        z-index:1015;
        max-height:min(320px, 50dvh);
        overflow-y:auto;
        overflow-x:hidden;
        -webkit-overflow-scrolling:touch;
    }

    .lang-option{
        display:flex;
        flex-direction:column;
        align-items:stretch;
        gap:4px;
    }

    .lang-option-main{
        display:flex;
        align-items:center;
        gap:10px;
        width:100%;
    }

    .lang-name{
        margin-left:30px;
        text-align:left;
        white-space:normal;
        line-height:1.2;
        font-size:12px;
    }

    .navbar.menu-open .menu-toggle span:nth-child(1){
        transform:translateY(8px) rotate(45deg);
    }

    .navbar.menu-open .menu-toggle span:nth-child(2){
        opacity:0;
    }

    .navbar.menu-open .menu-toggle span:nth-child(3){
        transform:translateY(-8px) rotate(-45deg);
    }

    .account-stats-grid,
    .account-characters-grid,
    .account-panels-grid,
    .shop-premium-steps,
    .shop-premium-benefits-featured ul,
    .shop-premium-intro-grid{
        grid-template-columns:1fr;
    }

    .presentation-topbar .presentation-navbar{
        --presentation-topbar-height:64px;
        min-height:64px;
        padding:7px 12px;
        display:flex;
        justify-content:space-between;
        gap:10px;
    }

    .presentation-topbar .brand-mark{
        width:46px;
        height:46px;
    }

    .presentation-topbar .brand-text span{
        font-size:15px;
    }

    .presentation-topbar .brand-text small{
        font-size:10px;
        letter-spacing:.13em;
    }

    .presentation-topbar .presentation-mobile-categories{
        flex:1 1 auto;
        max-width:none;
        min-height:38px;
    }

    .presentation-topbar .presentation-mobile-link{
        min-width:112px;
        max-width:170px;
        padding:8px 12px;
        font-size:12px;
    }

    .presentation-topbar .menu-toggle{
        width:48px;
        height:48px;
        min-width:48px;
        margin-left:auto;
        flex:0 0 auto;
    }
}

@media (max-width: 820px){
    .hero-copy,
    .hero-side{
        padding:22px;
    }

    .hero-side{
        height:auto;
        min-height:auto;
        max-height:520px;
    }

    .hero-stats{
        grid-template-columns:1fr;
    }

    .download-card .card-body{
        padding:20px;
    }

    .section-head h2{
        font-size:21px;
    }

    .btn-download{
        width:100%;
        min-width:unset;
    }

    .news-comparison{
        padding:16px 16px 0;
    }

    .comparison-handle{
        width:48px;
        height:48px;
    }

    .event-widget{
        padding:16px;
    }

    .event-calendar-dropdown{
        top:72px;
        left:16px;
        right:16px;
    }

    .event-item{
        grid-template-columns:52px 1fr;
        gap:12px;
    }

    .event-item-icon{
        width:52px;
        height:52px;
        border-radius:100%;
    }

    .account-card-body{
        padding:20px;
    }

    .account-overview,
    .account-section-head{
        flex-direction:column;
        align-items:stretch;
    }

    .account-badges,
    .account-summary-pills{
        justify-content:flex-start;
    }

    .shop-character-grid{
        grid-template-columns:1fr;
    }

    .shop-premium-package-summary{
        align-items:stretch;
        flex-direction:column;
    }

    .shop-premium-flow-actions .btn,
    .shop-premium-package-summary .btn{
        width:100%;
    }

    .account-tab-nav{
        display:grid;
        grid-template-columns:1fr;
    }

    .account-tab-link{
        width:100%;
    }

    .account-purchase-table{
        min-width:0;
    }

    .account-purchase-table thead{
        display:none;
    }

    .account-purchase-table,
    .account-purchase-table tbody,
    .account-purchase-table tr,
    .account-purchase-table td{
        display:block;
        width:100%;
    }

    .account-purchase-table tr{
        padding:14px 16px;
        border-bottom:1px solid rgba(255,255,255,.06);
    }

    .account-purchase-table tr:last-child{
        border-bottom:0;
    }

    .account-purchase-table td{
        display:flex;
        justify-content:space-between;
        gap:16px;
        padding:8px 0;
        border-bottom:0;
        text-align:right;
    }

    .account-purchase-table td::before{
        content:attr(data-label);
        color:var(--muted);
        font-size:12px;
        font-weight:800;
        text-align:left;
        text-transform:uppercase;
    }
}

@media (max-width: 560px){
    .hero-side{
        height:auto;
        min-height:auto;
        max-height:500px;
    }

    .news-comparison-toolbar{
        gap:10px;
    }

    .comparison-nav{
        width:40px;
        height:40px;
    }

    .comparison-nav--overlay{
        top:12px;
        width:36px;
        height:36px;
    }

    .comparison-nav--overlay-left{
        left:12px;
    }

    .comparison-nav--overlay-right{
        right:12px;
    }

    .event-widget{
        padding:14px;
    }

    .event-toolbar{
        grid-template-columns:40px 1fr 40px;
        gap:10px;
    }

    .event-day-nav,
    .event-date-button{
        min-height:40px;
    }

    .event-date-label{
        font-size:14px;
    }

    .event-calendar-dropdown{
        top:66px;
        left:14px;
        right:14px;
        padding:14px;
    }

    .event-calendar-weekdays,
    .event-calendar-grid{
        gap:6px;
    }

    .event-calendar-day{
        min-height:36px;
        border-radius:12px;
        font-size:13px;
    }

    .event-item{
        padding:12px;
    }

    .event-item h4{
        font-size:16px;
    }

    .event-item-line{
        font-size:13px;
    }

    .account-profile{
        align-items:flex-start;
    }

    .account-avatar{
        width:60px;
        height:60px;
        border-radius:18px;
        font-size:24px;
    }

    .account-profile-copy h2{
        font-size:24px;
    }

    .account-stat-card,
    .character-card{
        padding:18px;
    }

    .account-stat-value{
        font-size:26px;
    }

    .character-card-top,
    .character-stats-grid{
        grid-template-columns:1fr;
    }

    .character-card-top{
        display:grid;
    }

    .auth-inline-actions{
        grid-template-columns:1fr;
        gap:10px;
    }
}

@media (max-width: 820px){
    .login-inline-row{
        grid-template-columns:1fr;
    }
}


/* Source: cinematic-theme.css */
/* Shared cinematic theme for account, commerce and administration pages. */
body.cinematic-theme {
    --cinematic-bg-image: url("../img/maintenance/header-maintenance-20260703-1930.png");
    --cinematic-bg-position: center 35%;
    --cinematic-gold: #d5ad73;
    --cinematic-gold-bright: #efd5aa;
    --cinematic-teal: #7fc0bc;
    --cinematic-panel: rgba(14, 11, 10, .84);
    --cinematic-panel-strong: rgba(11, 9, 8, .94);
    --cinematic-border: rgba(213, 173, 115, .2);
    --cinematic-border-hover: rgba(229, 190, 132, .46);
    --cinematic-shadow: 0 28px 80px rgba(0, 0, 0, .46);
    position: relative;
    min-height: 100svh;
    background:
        linear-gradient(180deg, rgba(7, 6, 5, .64), rgba(7, 6, 5, .84)),
        var(--cinematic-bg-image) var(--cinematic-bg-position) / cover no-repeat fixed,
        #090706;
    font-family: Onest, Inter, sans-serif;
}

body.cinematic-theme::before,
body.cinematic-theme::after {
    position: fixed;
    inset: 0;
    z-index: -2;
    content: "";
    pointer-events: none;
}

body.cinematic-theme::before {
    background:
        linear-gradient(180deg, rgba(7, 6, 5, .64), rgba(7, 6, 5, .84)),
        var(--cinematic-bg-image) var(--cinematic-bg-position) / cover no-repeat;
}

body.cinematic-theme::after {
    z-index: -1;
    background:
        radial-gradient(circle at 16% 16%, rgba(108, 189, 187, .12), transparent 24%),
        radial-gradient(circle at 76% 34%, rgba(164, 82, 63, .12), transparent 30%),
        radial-gradient(circle at 50% 42%, transparent 0 22%, rgba(5, 4, 4, .34) 62%, rgba(4, 3, 3, .78) 100%);
}

.cinematic-theme .site-shell {
    isolation: isolate;
}

.cinematic-theme .site-content {
    position: relative;
}

.cinematic-theme .site-content::before {
    display: none;
}

.cinematic-theme .topbar {
    border-bottom-color: rgba(213, 173, 115, .18);
    background: rgba(9, 7, 6, .74);
    box-shadow: 0 12px 36px rgba(0, 0, 0, .28);
    backdrop-filter: blur(18px) saturate(115%);
}

.cinematic-theme .brand-text span,
.cinematic-theme .section-title,
.cinematic-theme .section-head h2,
.cinematic-theme .ranking-current-title,
.cinematic-theme .shop-panel-head h2,
.cinematic-theme .account-profile-copy h2,
.cinematic-theme .admin-section-head h2 {
    font-family: Cinzel, serif;
    letter-spacing: .02em;
}

.cinematic-theme .nav-link {
    border: 1px solid transparent;
}

.cinematic-theme .nav-link:hover,
.cinematic-theme .nav-link.active {
    border-color: rgba(213, 173, 115, .16);
    background: linear-gradient(180deg, rgba(213, 173, 115, .1), rgba(213, 173, 115, .035));
}

.cinematic-theme .nav-login-button,
.cinematic-theme .lang-trigger,
.cinematic-theme .nav-account-trigger {
    border-color: rgba(213, 173, 115, .2);
    background: rgba(15, 12, 10, .72);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .2);
}

.cinematic-theme .footer {
    border-top-color: rgba(213, 173, 115, .13);
    background: rgba(8, 6, 5, .78);
    backdrop-filter: blur(14px);
}

.cinematic-theme .page-hero {
    padding: clamp(42px, 7vw, 82px) 0 20px;
}

.cinematic-theme .page-hero-box {
    position: relative;
    padding: clamp(28px, 5vw, 52px);
    overflow: hidden;
    border: 1px solid var(--cinematic-border);
    border-radius: 6px;
    background:
        linear-gradient(125deg, rgba(213, 173, 115, .07), transparent 35%),
        rgba(11, 9, 8, .72);
    box-shadow: var(--cinematic-shadow), inset 0 1px rgba(255, 255, 255, .025);
    backdrop-filter: blur(14px);
}

.cinematic-theme .page-hero-box::before,
.cinematic-theme .page-hero-box::after {
    position: absolute;
    width: 44px;
    height: 44px;
    border-color: rgba(213, 173, 115, .55);
    content: "";
    pointer-events: none;
}

.cinematic-theme .page-hero-box::before {
    top: -1px;
    left: -1px;
    border-top: 1px solid;
    border-left: 1px solid;
}

.cinematic-theme .page-hero-box::after {
    right: -1px;
    bottom: -1px;
    border-right: 1px solid;
    border-bottom: 1px solid;
}

.cinematic-theme .page-hero-box .section-title {
    color: var(--cinematic-gold-bright);
    font-size: clamp(2rem, 4vw, 3.4rem);
    font-weight: 600;
    text-shadow: 0 0 28px rgba(213, 173, 115, .14), 0 4px 12px rgba(0, 0, 0, .5);
}

.cinematic-theme .page-hero-box .section-subtitle {
    max-width: 820px;
    color: #bdb1a7;
    font-size: 1rem;
}

.cinematic-theme .page-content {
    padding-top: 26px;
}

.cinematic-theme .card,
.cinematic-theme .download-section,
.cinematic-theme .shop-panel {
    border-color: var(--cinematic-border);
    border-radius: 10px;
    background:
        linear-gradient(145deg, rgba(213, 173, 115, .035), transparent 34%),
        var(--cinematic-panel);
    box-shadow: var(--cinematic-shadow), inset 0 1px rgba(255, 255, 255, .025);
    backdrop-filter: blur(14px);
}

.cinematic-theme .form-card {
    max-width: 680px;
}

.cinematic-auth-page .form-card {
    position: relative;
}

.cinematic-auth-page .form-card::before {
    position: absolute;
    top: 0;
    left: 12%;
    width: 76%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(213, 173, 115, .7), transparent);
    content: "";
}

.cinematic-theme .form-input {
    border-color: rgba(213, 173, 115, .18);
    border-radius: 8px;
    background: rgba(7, 6, 5, .58);
    color: #eee6df;
    box-shadow: inset 0 2px 8px rgba(0, 0, 0, .2);
}

.cinematic-theme .form-input:hover {
    border-color: rgba(213, 173, 115, .3);
}

.cinematic-theme .form-input:focus {
    border-color: rgba(213, 173, 115, .56);
    box-shadow: 0 0 0 3px rgba(213, 173, 115, .1), inset 0 2px 8px rgba(0, 0, 0, .2);
}

.cinematic-theme .form-label {
    color: #c6b7ab;
    font-weight: 600;
}

.cinematic-theme .checkbox-row {
    border-color: rgba(213, 173, 115, .16);
    border-radius: 8px;
    background: rgba(7, 6, 5, .42);
}

.cinematic-theme .btn {
    border-radius: 7px;
    letter-spacing: .025em;
}

.cinematic-theme .btn-primary {
    border: 1px solid rgba(242, 205, 150, .2);
    background: linear-gradient(180deg, #9d4a36, #6f271f);
    box-shadow: 0 12px 28px rgba(94, 30, 23, .32), inset 0 1px rgba(255, 255, 255, .12);
}

.cinematic-theme .btn-primary:hover {
    border-color: rgba(242, 205, 150, .42);
    filter: brightness(1.12);
}

.cinematic-theme .btn-secondary {
    border-color: rgba(213, 173, 115, .22);
    background: rgba(213, 173, 115, .055);
}

.cinematic-theme .btn-secondary:hover {
    border-color: rgba(213, 173, 115, .42);
    background: rgba(213, 173, 115, .1);
}

.cinematic-theme .form-feedback {
    border-radius: 8px;
    backdrop-filter: blur(8px);
}

/* Download */
.cinematic-download-page .download-page {
    gap: 22px;
}

.cinematic-download-page .download-section {
    padding: clamp(20px, 3vw, 30px);
}

.cinematic-download-page .download-section-mark {
    border-color: rgba(213, 173, 115, .32);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(213, 173, 115, .16), rgba(7, 6, 5, .2));
    color: var(--cinematic-gold-bright);
    box-shadow: 0 0 18px rgba(213, 173, 115, .08);
}

.cinematic-download-page .download-requirement-card,
.cinematic-download-page .download-item-card {
    border-color: rgba(213, 173, 115, .13);
    border-radius: 8px;
    background: rgba(11, 9, 8, .56);
}

.cinematic-download-page .download-requirement-card:hover,
.cinematic-download-page .download-item-card:hover {
    border-color: var(--cinematic-border-hover);
    background: rgba(20, 16, 13, .76);
    box-shadow: 0 18px 44px rgba(0, 0, 0, .28), 0 0 24px rgba(127, 192, 188, .035);
}

/* Ranking */
.cinematic-ranking-page .ranking-layout {
    gap: 20px;
}

.cinematic-ranking-page .ranking-sidebar,
.cinematic-ranking-page .ranking-toolbar,
.cinematic-ranking-page .ranking-main > .card {
    border-color: var(--cinematic-border);
    background: var(--cinematic-panel);
}

.cinematic-ranking-page .ranking-category-button {
    border: 1px solid transparent;
    border-radius: 7px;
}

.cinematic-ranking-page .ranking-category-button:hover,
.cinematic-ranking-page .ranking-category-button[aria-current="true"] {
    border-color: rgba(213, 173, 115, .22);
    background:
        linear-gradient(90deg, rgba(213, 173, 115, .13), rgba(213, 173, 115, .025)),
        rgba(9, 7, 6, .42);
}

.cinematic-ranking-page .ranking-table th {
    border-bottom-color: rgba(213, 173, 115, .24);
    background: rgba(213, 173, 115, .055);
    color: var(--cinematic-gold-bright);
}

.cinematic-ranking-page .ranking-table tbody tr:hover {
    background: rgba(127, 192, 188, .045);
}

.cinematic-ranking-page .ranking-board-button,
.cinematic-ranking-page .ranking-page-button {
    border-radius: 6px;
    border-color: rgba(213, 173, 115, .16);
    background: rgba(8, 7, 6, .52);
}

/* Account */
.cinematic-account-page .account-tab-nav {
    padding: 6px;
    border: 1px solid rgba(213, 173, 115, .14);
    border-radius: 9px;
    background: rgba(9, 7, 6, .6);
    backdrop-filter: blur(12px);
}

.cinematic-account-page .account-tab-link {
    border-radius: 6px;
}

.cinematic-account-page .account-tab-link:hover,
.cinematic-account-page #account-tab-info:checked ~ .account-tab-nav label[for="account-tab-info"],
.cinematic-account-page #account-tab-security:checked ~ .account-tab-nav label[for="account-tab-security"],
.cinematic-account-page #account-tab-purchases:checked ~ .account-tab-nav label[for="account-tab-purchases"] {
    background: linear-gradient(180deg, rgba(213, 173, 115, .14), rgba(213, 173, 115, .055));
    box-shadow: inset 0 0 0 1px rgba(213, 173, 115, .18);
}

.cinematic-account-page .account-avatar {
    border-color: rgba(213, 173, 115, .35);
    background: radial-gradient(circle at 35% 30%, rgba(127, 192, 188, .18), rgba(118, 52, 36, .45));
    color: var(--cinematic-gold-bright);
    box-shadow: 0 0 28px rgba(127, 192, 188, .08);
}

.cinematic-account-page .account-stat-card,
.cinematic-account-page .account-panel-card,
.cinematic-account-page .account-character-card {
    border-color: rgba(213, 173, 115, .14);
    border-radius: 8px;
    background: rgba(9, 7, 6, .48);
}

.cinematic-account-page .account-stat-card:hover,
.cinematic-account-page .account-character-card:hover {
    border-color: rgba(213, 173, 115, .34);
    transform: translateY(-2px);
}

/* Shop */
.cinematic-shop-page .shop-switch {
    padding: 6px;
    border: 1px solid rgba(213, 173, 115, .14);
    border-radius: 9px;
    background: rgba(9, 7, 6, .62);
    backdrop-filter: blur(12px);
}

.cinematic-shop-page .shop-package-card,
.cinematic-shop-page .shop-character-card,
.cinematic-shop-page .shop-premium-benefits,
.cinematic-shop-page .shop-premium-package-summary,
.cinematic-shop-page .shop-premium-price-box {
    border-color: rgba(213, 173, 115, .14);
    border-radius: 8px;
    background:
        radial-gradient(circle at 80% 0, rgba(127, 192, 188, .055), transparent 30%),
        rgba(9, 7, 6, .54);
}

.cinematic-shop-page .shop-package-card:hover {
    border-color: var(--cinematic-border-hover);
    box-shadow: 0 20px 48px rgba(0, 0, 0, .32), 0 0 28px rgba(213, 173, 115, .05);
    transform: translateY(-4px);
}

.cinematic-shop-page .shop-package-card.is-featured {
    border-color: rgba(213, 173, 115, .42);
    background:
        linear-gradient(145deg, rgba(213, 173, 115, .1), transparent 42%),
        rgba(12, 9, 8, .72);
}

.cinematic-shop-page .shop-package-coins,
.cinematic-shop-page .shop-package-price,
.cinematic-shop-page .shop-balance-card strong {
    color: var(--cinematic-gold-bright);
    text-shadow: 0 0 18px rgba(213, 173, 115, .12);
}

/* Admin */
.cinematic-admin-page .admin-page-content {
    position: relative;
}

.cinematic-admin-page .admin-hero .page-hero-box {
    border-color: var(--cinematic-border);
    background:
        linear-gradient(125deg, rgba(213, 173, 115, .08), transparent 38%),
        rgba(11, 9, 8, .78);
}

.cinematic-admin-page .admin-sidebar {
    border-color: rgba(213, 173, 115, .2);
    border-radius: 10px;
    background:
        radial-gradient(circle at 30% 0, rgba(127, 192, 188, .07), transparent 32%),
        var(--cinematic-panel-strong);
    box-shadow: var(--cinematic-shadow);
    backdrop-filter: blur(16px);
}

.cinematic-admin-page .admin-sidebar-link {
    border-radius: 6px;
}

.cinematic-admin-page .admin-sidebar-link:hover,
.cinematic-admin-page .admin-sidebar-link.active {
    border-color: rgba(213, 173, 115, .2);
    background: linear-gradient(90deg, rgba(213, 173, 115, .12), rgba(213, 173, 115, .025));
}

.cinematic-admin-page .admin-stat-card,
.cinematic-admin-page .admin-panel-card,
.cinematic-admin-page .admin-disclosure,
.cinematic-admin-page .admin-presentation-category-admin {
    border-color: rgba(213, 173, 115, .16);
    border-radius: 9px;
    background:
        linear-gradient(145deg, rgba(213, 173, 115, .035), transparent 32%),
        var(--cinematic-panel);
    box-shadow: 0 20px 56px rgba(0, 0, 0, .34);
    backdrop-filter: blur(14px);
}

.cinematic-admin-page .admin-stat-card {
    position: relative;
    overflow: hidden;
}

.cinematic-admin-page .admin-stat-card::after {
    position: absolute;
    right: -28px;
    bottom: -28px;
    width: 90px;
    height: 90px;
    border: 1px solid rgba(127, 192, 188, .07);
    border-radius: 50%;
    content: "";
}

.cinematic-admin-page .admin-switch-row,
.cinematic-admin-page .admin-settings-block,
.cinematic-admin-page .admin-visual-item {
    border-color: rgba(213, 173, 115, .13);
    border-radius: 7px;
    background: rgba(8, 7, 6, .42);
}

.cinematic-admin-page .admin-locale-tab,
.cinematic-admin-page .admin-preview-device {
    border-radius: 6px;
}

/* Home */
.cinematic-home-page .hero {
    min-height: min(800px, calc(100svh - 82px));
    padding: clamp(68px, 9vw, 112px) 0;
    background: linear-gradient(
        to bottom,
        #0d0908 0%,
        #0d0908 72%,
        rgba(13, 9, 8, .94) 82%,
        rgba(13, 9, 8, .52) 93%,
        transparent 100%
    );
}

.cinematic-home-page .hero::before {
    background:
        linear-gradient(90deg, rgba(13, 9, 8, .92) 0%, rgba(13, 9, 8, .72) 45%, rgba(13, 9, 8, .88) 100%),
        url("../img/home-bg-1.webp") center / cover no-repeat;
    opacity: .25;
    -webkit-mask-image: linear-gradient(
        to bottom,
        #000 0%,
        #000 72%,
        rgba(0, 0, 0, .92) 80%,
        rgba(0, 0, 0, .5) 91%,
        transparent 100%
    );
    mask-image: linear-gradient(
        to bottom,
        #000 0%,
        #000 72%,
        rgba(0, 0, 0, .92) 80%,
        rgba(0, 0, 0, .5) 91%,
        transparent 100%
    );
}

.cinematic-home-page .hero-grid {
    gap: clamp(20px, 3vw, 38px);
}

.cinematic-home-page .hero-card {
    position: relative;
    border: 1px solid var(--cinematic-border);
    border-radius: 8px;
    background:
        linear-gradient(145deg, rgba(213, 173, 115, .055), transparent 36%),
        rgba(11, 9, 8, .72);
    box-shadow: var(--cinematic-shadow), inset 0 1px rgba(255, 255, 255, .025);
    backdrop-filter: blur(15px);
}

.cinematic-home-page .hero-copy {
    padding: clamp(30px, 5vw, 54px);
}

.cinematic-home-page .hero-copy::before,
.cinematic-home-page .hero-copy::after {
    position: absolute;
    width: 48px;
    height: 48px;
    border-color: rgba(213, 173, 115, .5);
    content: "";
}

.cinematic-home-page .hero-copy::before {
    top: -1px;
    left: -1px;
    border-top: 1px solid;
    border-left: 1px solid;
}

.cinematic-home-page .hero-copy::after {
    right: -1px;
    bottom: -1px;
    border-right: 1px solid;
    border-bottom: 1px solid;
}

.cinematic-home-page .eyebrow {
    border-color: rgba(213, 173, 115, .22);
    border-radius: 999px;
    background: rgba(213, 173, 115, .07);
    color: var(--cinematic-gold-bright);
}

.cinematic-home-page .hero h1 {
    color: #f0dbc0;
    font-family: Cinzel, serif;
    font-weight: 600;
    letter-spacing: .015em;
    text-shadow: 0 0 34px rgba(213, 173, 115, .13), 0 5px 16px rgba(0, 0, 0, .55);
}

.cinematic-home-page .hero p {
    color: #c2b6ac;
}

.cinematic-home-page .hero-stats {
    gap: 10px;
}

.cinematic-home-page .stat {
    border-color: rgba(213, 173, 115, .13);
    border-radius: 7px;
    background: rgba(7, 6, 5, .44);
}

.cinematic-home-page .stat strong {
    color: var(--cinematic-gold-bright);
    font-family: Cinzel, serif;
}

.cinematic-home-page .hero-side {
    background:
        radial-gradient(circle at 80% 8%, rgba(127, 192, 188, .07), transparent 28%),
        rgba(10, 8, 7, .48);
}

.cinematic-home-page .event-toolbar,
.cinematic-home-page .event-item,
.cinematic-home-page .event-calendar-dropdown {
    border-color: rgba(213, 173, 115, .14);
    border-radius: 7px;
    background: rgba(7, 6, 5, .58);
}

.cinematic-home-page .event-day-nav,
.cinematic-home-page .event-date-button {
    border-color: rgba(213, 173, 115, .18);
    background: rgba(213, 173, 115, .045);
}

.cinematic-home-page .section {
    position: relative;
}

.cinematic-home-page .section-title {
    color: var(--cinematic-gold-bright);
    font-family: Cinzel, serif;
    font-weight: 600;
    text-shadow: 0 0 24px rgba(213, 173, 115, .1);
}

.cinematic-home-page .section-subtitle {
    color: #b9ada4;
}

.cinematic-home-page .section .card {
    border-color: rgba(213, 173, 115, .16);
    border-radius: 8px;
    background:
        linear-gradient(145deg, rgba(213, 173, 115, .035), transparent 34%),
        rgba(11, 9, 8, .7);
}

.cinematic-home-page .section .card:hover {
    border-color: rgba(213, 173, 115, .34);
    box-shadow: 0 24px 62px rgba(0, 0, 0, .42), 0 0 24px rgba(127, 192, 188, .025);
}

.cinematic-home-page .feature-icon {
    border-color: rgba(213, 173, 115, .24);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(127, 192, 188, .12), rgba(126, 42, 31, .2));
    color: var(--cinematic-gold-bright);
}

.cinematic-home-page .news-comparison {
    padding: 14px 14px 0;
}

.cinematic-home-page .comparison-stage {
    border-radius: 6px;
}

.cinematic-home-page .ranking-table th {
    background: rgba(213, 173, 115, .045);
    color: var(--cinematic-gold-bright);
}

.cinematic-home-page .ranking-table tbody tr:hover {
    background: rgba(127, 192, 188, .04);
}

/* Presentation */
.cinematic-presentation-page {
    background: #090706;
}

.cinematic-presentation-page::before,
.cinematic-presentation-page::after {
    display: none;
}

.cinematic-presentation-page .presentation-topbar {
    border-bottom-color: rgba(213, 173, 115, .18);
    background: rgba(8, 6, 5, .76) !important;
    box-shadow: 0 14px 38px rgba(0, 0, 0, .34);
    backdrop-filter: blur(18px) saturate(115%) !important;
    -webkit-backdrop-filter: blur(18px) saturate(115%) !important;
}

.cinematic-presentation-page .presentation-page {
    background: transparent;
    font-family: Onest, Inter, sans-serif;
}

.cinematic-presentation-page .presentation-page::before {
    background:
        linear-gradient(180deg, rgba(7, 6, 5, .72), rgba(7, 6, 5, .9)),
        radial-gradient(circle at 16% 14%, rgba(127, 192, 188, .11), transparent 25%),
        url("../img/maintenance/header-maintenance-20260703-1930.png") center 35% / cover no-repeat;
}

.cinematic-presentation-page .presentation-page .sidebar {
    border-right-color: rgba(213, 173, 115, .19);
    background:
        radial-gradient(circle at 30% 0, rgba(127, 192, 188, .07), transparent 28%),
        rgba(10, 8, 7, .91);
    box-shadow: 18px 0 48px rgba(0, 0, 0, .28);
    backdrop-filter: blur(18px);
}

.cinematic-presentation-page .presentation-page .sidebar-header,
.cinematic-presentation-page .presentation-page .current-section-indicator {
    border-color: rgba(213, 173, 115, .14);
    background: rgba(213, 173, 115, .035);
}

.cinematic-presentation-page .presentation-page .search-input,
.cinematic-presentation-page .presentation-page .social-btn,
.cinematic-presentation-page .presentation-page .sidebar-expand {
    border-color: rgba(213, 173, 115, .18);
    border-radius: 7px;
    background: rgba(7, 6, 5, .58);
}

.cinematic-presentation-page .presentation-page .nav-category-header:hover,
.cinematic-presentation-page .presentation-page .nav-category.active .nav-category-header {
    background: linear-gradient(90deg, color-mix(in srgb, var(--presentation-nav-category-hover-bg-color, #c69a57) 18%, transparent), transparent);
}

.cinematic-presentation-page .presentation-page .nav-category.active .nav-category-header {
    background: linear-gradient(90deg, color-mix(in srgb, var(--presentation-nav-category-active-bg-color, #c69a57) 24%, transparent), transparent);
}

.cinematic-presentation-page .presentation-page .nav-subcategory {
    border-radius: 5px;
}

.cinematic-presentation-page .presentation-page .nav-subcategory.active {
    background: linear-gradient(90deg, color-mix(in srgb, var(--presentation-nav-subcategory-active-bg-color, #c69a57) 22%, transparent), rgba(213, 173, 115, .045));
}

.cinematic-presentation-page .presentation-page .pres-hero-banner {
    height: 62vh;
    min-height: 460px;
}

.cinematic-presentation-page .presentation-page .pres-hero-bg {
    filter: brightness(.72) saturate(.86);
}

.cinematic-presentation-page .presentation-page .pres-hero-overlay {
    background: linear-gradient(180deg, rgba(7, 6, 5, .12), rgba(7, 6, 5, .93));
}

.cinematic-presentation-page .presentation-page .pres-hero-vignette {
    background:
        radial-gradient(circle at 50% 40%, transparent 28%, rgba(5, 4, 4, .55) 100%),
        linear-gradient(90deg, rgba(5, 4, 4, .35), transparent 30%, transparent 70%, rgba(5, 4, 4, .35));
}

.cinematic-presentation-page .presentation-page .content-wrapper {
    margin: -92px 18px 0;
    border-color: rgba(213, 173, 115, .18);
    border-radius: 10px 10px 0 0;
    background:
        linear-gradient(180deg, rgba(15, 12, 10, .9), rgba(8, 7, 6, .94)),
        radial-gradient(circle at 15% 0, rgba(127, 192, 188, .055), transparent 26%);
    box-shadow: 0 -28px 80px rgba(0, 0, 0, .62), inset 0 1px rgba(255, 255, 255, .025);
    backdrop-filter: blur(16px);
}

.cinematic-presentation-page .presentation-page .content-wrapper::before {
    width: min(320px, 52%);
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(213, 173, 115, .85), transparent);
}

.cinematic-presentation-page .presentation-page .section-block {
    border-color: rgba(213, 173, 115, .17);
    border-radius: 9px;
    background-color: rgba(10, 8, 7, .76);
    box-shadow: 0 24px 68px rgba(0, 0, 0, .34);
    isolation: isolate;
}

.cinematic-presentation-page .presentation-page .section-block::before {
    position: absolute;
    inset: 0;
    z-index: 0;
    content: "";
    pointer-events: none;
    background:
        linear-gradient(135deg, rgba(26, 18, 15, .6), rgba(8, 7, 6, .48)),
        radial-gradient(circle at 82% 8%, rgba(127, 192, 188, .055), transparent 35%);
    backdrop-filter: blur(1.5px) saturate(.62) sepia(.12);
    -webkit-backdrop-filter: blur(1.5px) saturate(.62) sepia(.12);
}

.cinematic-presentation-page .presentation-page .section-block > * {
    position: relative;
    z-index: 1;
}

.cinematic-presentation-page .presentation-page .section-title {
    color: var(--cinematic-gold-bright);
    font-weight: 600;
    text-shadow: 0 0 28px rgba(213, 173, 115, .12);
}

.cinematic-presentation-page .presentation-page .section-content {
    border-color: rgba(213, 173, 115, .13);
    border-radius: 8px;
    background:
        radial-gradient(circle at 82% 0, rgba(127, 192, 188, .045), transparent 25%),
        rgba(8, 7, 6, .48);
}

.cinematic-presentation-page .presentation-page .pres-info-box,
.cinematic-presentation-page .presentation-page .pres-card,
.cinematic-presentation-page .presentation-page .pres-card-icon,
.cinematic-presentation-page .presentation-page .pres-stat {
    border-color: rgba(213, 173, 115, .14);
    border-radius: 7px;
    background: rgba(8, 7, 6, .45);
}

.cinematic-presentation-page .presentation-page .pres-card:hover,
.cinematic-presentation-page .presentation-page .pres-card-icon:hover {
    border-color: rgba(213, 173, 115, .36);
    box-shadow: 0 18px 42px rgba(0, 0, 0, .28);
}

.cinematic-presentation-page .presentation-page .pres-content-block {
    border-radius: 7px;
    background:
        radial-gradient(circle at 82% 0, rgba(127, 192, 188, .055), transparent 28%),
        rgba(7, 6, 5, .3);
}

@media (max-width: 820px) {
    body.cinematic-theme {
        --cinematic-bg-position: 58% center;
    }

    .cinematic-theme .navbar {
        padding-block: 12px;
    }

    .cinematic-theme .menu-toggle {
        width: 48px;
        height: 48px;
        border-color: rgba(213, 173, 115, .24);
        border-radius: 8px;
        background:
            linear-gradient(145deg, rgba(213, 173, 115, .07), transparent 55%),
            rgba(10, 8, 7, .78);
        box-shadow: 0 12px 32px rgba(0, 0, 0, .34), inset 0 1px rgba(255, 255, 255, .025);
        backdrop-filter: blur(14px);
    }

    .cinematic-theme .menu-toggle span {
        width: 20px;
        background: linear-gradient(90deg, var(--cinematic-gold), #f0ddbb);
        box-shadow: 0 0 10px rgba(213, 173, 115, .1);
    }

    .cinematic-theme .nav-overlay {
        background:
            radial-gradient(circle at 18% 18%, rgba(127, 192, 188, .06), transparent 30%),
            rgba(5, 4, 4, .68);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
    }

    .cinematic-theme .nav-panel {
        left: 8px;
        right: 8px;
        width: auto;
        max-height: calc(100dvh - 104px);
        margin-top: 8px;
        padding: 10px;
        gap: 8px;
        overflow-x: hidden;
        overflow-y: auto;
        border-color: rgba(213, 173, 115, .22);
        border-radius: 9px;
        background:
            linear-gradient(145deg, rgba(213, 173, 115, .045), transparent 38%),
            rgba(8, 7, 6, .9);
        box-shadow: 0 28px 80px rgba(0, 0, 0, .62), inset 0 1px rgba(255, 255, 255, .025);
        backdrop-filter: blur(24px) saturate(112%);
        -webkit-backdrop-filter: blur(24px) saturate(112%);
        scrollbar-width: thin;
        scrollbar-color: rgba(213, 173, 115, .35) transparent;
    }

    .cinematic-theme .nav-actions {
        gap: 7px;
        margin-bottom: 2px;
    }

    .cinematic-theme .lang-trigger,
    .cinematic-theme .account-trigger,
    .cinematic-theme .nav-account-trigger,
    .cinematic-theme .nav-login-button,
    .cinematic-theme .nav-account-loading,
    .cinematic-theme .nav-account-unavailable {
        min-height: 44px;
        padding: 9px 12px;
        border-color: rgba(213, 173, 115, .16);
        border-radius: 7px;
        background: rgba(13, 10, 9, .62);
        box-shadow: none;
    }

    .cinematic-theme .nav-links {
        gap: 2px;
        padding-top: 7px;
        border-top: 1px solid rgba(213, 173, 115, .11);
    }

    .cinematic-theme .nav-link {
        min-height: 44px;
        padding: 10px 13px;
        border-radius: 5px;
        color: rgba(244, 236, 230, .78);
        font-size: .94rem;
    }

    .cinematic-theme .nav-link:hover,
    .cinematic-theme .nav-link.active {
        border-color: rgba(213, 173, 115, .16);
        color: #fff5e7;
        background:
            linear-gradient(90deg, rgba(213, 173, 115, .14), rgba(213, 173, 115, .025) 72%),
            rgba(255, 255, 255, .012);
        box-shadow: inset 2px 0 var(--cinematic-gold);
    }

    .cinematic-theme .lang-menu,
    .cinematic-theme .account-menu {
        border-color: rgba(213, 173, 115, .2);
        border-radius: 7px;
        background: rgba(9, 7, 6, .97);
        box-shadow: 0 20px 48px rgba(0, 0, 0, .56);
    }

    .cinematic-theme .page-hero {
        padding-top: 28px;
    }

    .cinematic-theme .page-hero-box {
        padding: 26px 20px;
    }

    .cinematic-theme .page-hero-box .section-title {
        font-size: clamp(1.7rem, 9vw, 2.5rem);
    }

    .cinematic-home-page .hero {
        min-height: auto;
        padding: 40px 0 64px;
    }

    .cinematic-home-page .hero::before {
        background-position: 58% 44%;
        -webkit-mask-image: linear-gradient(
            to bottom,
            #000 0%,
            #000 78%,
            rgba(0, 0, 0, .82) 88%,
            transparent 100%
        );
        mask-image: linear-gradient(
            to bottom,
            #000 0%,
            #000 78%,
            rgba(0, 0, 0, .82) 88%,
            transparent 100%
        );
    }

    .cinematic-home-page .hero-card {
        backdrop-filter: blur(10px);
    }

    .cinematic-presentation-page .presentation-page .content-wrapper {
        margin: -48px 8px 0;
        border-radius: 7px 7px 0 0;
    }

    .cinematic-presentation-page .presentation-page .section-block {
        border-radius: 7px;
    }

    .cinematic-presentation-page .presentation-page .section-block::before {
        background:
            linear-gradient(145deg, rgba(28, 19, 16, .66), rgba(7, 6, 5, .54)),
            radial-gradient(circle at 80% 5%, rgba(127, 192, 188, .045), transparent 32%);
        backdrop-filter: blur(1px) saturate(.56) sepia(.14);
        -webkit-backdrop-filter: blur(1px) saturate(.56) sepia(.14);
    }

    .cinematic-presentation-page .presentation-page .section-content {
        border-color: rgba(213, 173, 115, .12);
        background: rgba(7, 6, 5, .62);
        box-shadow: 0 18px 46px rgba(0, 0, 0, .24);
    }

    .cinematic-theme .card,
    .cinematic-theme .download-section,
    .cinematic-theme .shop-panel,
    .cinematic-admin-page .admin-sidebar,
    .cinematic-admin-page .admin-panel-card {
        backdrop-filter: blur(10px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .cinematic-theme *,
    .cinematic-theme *::before,
    .cinematic-theme *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}
@media (min-width: 1236px) {
    .navbar {
        gap: clamp(8px, 1vw, 16px);
    }

    .nav-panel {
        min-width: 0;
        flex: 1;
        justify-content: flex-end;
        gap: clamp(5px, .55vw, 10px);
    }

    .nav-links {
        min-width: 0;
        flex-wrap: nowrap;
        gap: clamp(1px, .2vw, 4px);
    }

    .nav-link {
        flex: 0 0 auto;
        padding-inline: clamp(5px, .45vw, 9px);
        font-size: clamp(.72rem, .68vw, .84rem);
        white-space: nowrap;
    }

    .nav-actions {
        flex: 0 0 auto;
        gap: 7px;
    }

    .nav-account-slot {
        width: clamp(145px, 11vw, 175px);
        min-width: clamp(145px, 11vw, 175px);
        flex-basis: clamp(145px, 11vw, 175px);
    }
}