/* Zərdaş - ümumi dizayn sistemi (taxta + qızıl, Azərbaycan motivləri) */
:root {
    --ink: #0c0918;
    --ink-2: #16112a;
    --ink-3: #221a3d;
    --panel: rgba(20, 15, 38, .94);
    --panel-solid: #191330;
    --line: rgba(255, 255, 255, .09);
    --gold: #f3c75f;
    --gold-hi: #ffe9a8;
    --gold-lo: #9a6a1c;
    --gold-line: rgba(243, 199, 95, .38);
    --wood: #7a3f12;
    --wood-dark: #3d1d07;
    --fg: #f6f1ff;
    --muted: #a49cc4;
    --red: #e8394d;
    --green: #1fb86b;
    --yellow: #f6b91f;
    --blue: #2f7bff;
    --az-blue: #00b5e2;
    --az-red: #ef3340;
    --az-green: #509e2f;
    --font-display: 'Unbounded', 'Trebuchet MS', system-ui, sans-serif;
    --font-body: 'Outfit', 'Segoe UI', system-ui, sans-serif;
    --safe-b: env(safe-area-inset-bottom, 0px);
    color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
    margin: 0;
    min-height: 100vh;
    min-height: 100dvh;
    font-family: var(--font-body);
    font-size: 14px;
    color: var(--fg);
    background: var(--ink);
    -webkit-tap-highlight-color: transparent;
    overflow-x: hidden;
}
img { max-width: 100%; }
a { color: var(--gold-hi); }
button, input, select, textarea { font: inherit; color: inherit; }

/* Fon şəkilləri: sabit qat (mobil Safari-də fixed problemi olmasın) */
.bg-layer {
    position: fixed;
    inset: 0;
    z-index: -1;
    background: var(--ink) center top / cover no-repeat;
}
.bg-layer::after {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(120% 70% at 50% 40%, rgba(8, 6, 20, .25), rgba(8, 6, 20, .78));
}
.bg-login { background-image: url('../img/opt/login-bg.jpg'); }
.bg-game { background-image: url('../img/opt/game-bg.jpg'); }

/* Azərbaycan bayrağı zolağı */
.flag-strip {
    height: 4px;
    background: linear-gradient(90deg, var(--az-blue) 0 33.3%, var(--az-red) 33.3% 66.6%, var(--az-green) 66.6%);
}

/* ===== Loqo lövhəsi: names.png + ortasında ZƏRDAŞ ===== */
.logo-sign {
    position: relative;
    width: 100%;
    max-width: 360px;
    margin: 0 auto;
    aspect-ratio: 900 / 330;
    background: url('../img/opt/logo_sign.png') center / contain no-repeat;
    filter: drop-shadow(0 10px 18px rgba(0, 0, 0, .6));
    container-type: inline-size;
}
.logo-sign span {
    position: absolute;
    left: 21%;
    right: 21%;
    top: 37%;
    bottom: 20%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 10.5cqw;
    letter-spacing: .06em;
    line-height: 1;
    white-space: nowrap;
    background: linear-gradient(180deg, #fffbe8 0%, #ffe28a 38%, #f0b43a 62%, #b7791f 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    filter: drop-shadow(0 2px 0 #4a2306) drop-shadow(0 0 6px rgba(0, 0, 0, .55));
}
.logo-sign small {
    position: absolute;
    left: 0; right: 0;
    bottom: -2%;
    text-align: center;
    font-size: 3.4cqw;
    font-weight: 700;
    letter-spacing: .3em;
    color: var(--gold-hi);
    text-shadow: 0 1px 3px #000;
}
.logo-sign.sm { max-width: 150px; width: 132px; flex: none; margin: 0; }
.logo-sign.sm small { display: none; }

/* Ümumi səhifə başlığı (Profil, Admin, Staff, Oyun) */
.g-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 8px 12px;
    border-radius: 18px;
    background: rgba(18, 13, 35, .95);
    border: 1px solid var(--gold-line);
}
.g-top .icon-wood { width: 42px; height: 42px; flex: none; }
.g-top .logo-sign.sm { width: 132px; max-width: 132px; margin: 0 auto; }

/* RemixIcon hizalanması */
i[class^="ri-"], i[class*=" ri-"] {
    display: inline-block;
    vertical-align: -0.12em;
    line-height: 1;
}

/* ===== Taxta düymə: btn_wood.png border-image ilə, istənilən enə uzanır ===== */
.btn-wood {
    --h: 58px;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: var(--h);
    padding: 0 18px;
    border-style: solid;
    border-width: calc(var(--h) * .23) calc(var(--h) * .52);
    border-image: url('../img/opt/btn_wood.png') 32 72 fill / calc(var(--h) * .23) calc(var(--h) * .52) stretch;
    background: none;
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 15px;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: #fff4d2;
    text-shadow: 0 2px 0 #3b1a04, 0 0 8px rgba(0, 0, 0, .6);
    text-decoration: none;
    cursor: pointer;
    filter: drop-shadow(0 8px 12px rgba(0, 0, 0, .55));
    transition: transform .12s ease, filter .2s ease, opacity .2s;
    user-select: none;
}
.btn-wood > * { margin: -12px 0; }
.btn-wood:active { transform: translateY(2px) scale(.98); }
.btn-wood:disabled, .btn-wood.disabled { opacity: .55; filter: grayscale(.7); cursor: not-allowed; }
.btn-wood.block { display: flex; width: 100%; }
.btn-wood.lg { --h: 70px; font-size: 18px; }
.btn-wood.sm { --h: 44px; font-size: 12px; padding: 0 8px; }
.btn-wood .ico { width: 26px; height: 26px; object-fit: contain; }
.btn-wood.pulse { animation: woodPulse 1.6s ease-in-out infinite; }
@keyframes woodPulse { 50% { transform: scale(1.035); } }

/* Sadə düymələr */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 16px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: rgba(255, 255, 255, .07);
    font-weight: 700;
    font-size: 13.5px;
    cursor: pointer;
    text-decoration: none;
    color: var(--fg);
    transition: transform .12s, background .2s;
}
.btn:active { transform: scale(.97); }
.btn.gold { background: linear-gradient(180deg, var(--gold-hi), var(--gold) 55%, #c48c2a); color: #2a1804; border-color: transparent; }
.btn.green { background: linear-gradient(180deg, #33d685, #128a4f); border-color: transparent; color: #fff; }
.btn.red { background: linear-gradient(180deg, #ff5b6d, #b51f33); border-color: transparent; color: #fff; }
.btn.blue { background: linear-gradient(180deg, #5b9bff, #1f5fd6); border-color: transparent; color: #fff; }
.btn.ghost { background: transparent; }
.btn.sm { min-height: 34px; padding: 0 10px; font-size: 12px; border-radius: 10px; }
.btn:disabled { opacity: .5; cursor: not-allowed; }

/* Taxta dairəvi ikon düymələri (settings.png, exit.png ...) */
.icon-wood {
    width: 46px;
    height: 46px;
    flex: none;
    display: grid;
    place-items: center;
    border: 0;
    padding: 0;
    background: none;
    cursor: pointer;
    position: relative;
    transition: transform .12s;
    text-decoration: none;
}
.icon-wood img { width: 100%; height: 100%; object-fit: contain; }
.icon-wood:active { transform: scale(.92); }
.icon-wood .dot {
    position: absolute;
    top: 0; right: 0;
    min-width: 18px; height: 18px;
    padding: 0 5px;
    border-radius: 99px;
    background: var(--red);
    color: #fff;
    font-size: 10.5px;
    font-weight: 800;
    display: none;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 0 2px var(--ink);
}
.icon-wood .dot.on { display: flex; }

/* Panellər */
.panel {
    background: var(--panel);
    border: 1px solid var(--gold-line);
    border-radius: 22px;
    box-shadow: 0 14px 32px -16px rgba(0, 0, 0, .82), inset 0 1px 0 rgba(255, 255, 255, .07);
}
.panel-pad { padding: 18px; }
.panel-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 14px;
    font-family: var(--font-display);
    font-size: 14px;
    font-weight: 700;
    color: var(--gold-hi);
    letter-spacing: .03em;
}
.panel-title img { width: 30px; height: 30px; object-fit: contain; }
.panel-title .spacer { flex: 1; }

/* Form elementləri */
.field { margin-bottom: 14px; text-align: left; }
.field label {
    display: block;
    margin-bottom: 6px;
    font-size: 12.5px;
    font-weight: 700;
    color: var(--gold-hi);
    letter-spacing: .02em;
}
.input {
    width: 100%;
    min-height: 50px;
    padding: 0 16px;
    border-radius: 14px;
    border: 1px solid rgba(243, 199, 95, .28);
    background: rgba(8, 6, 18, .78);
    color: #fff;
    font-size: 15px;
    outline: none;
    transition: border-color .2s, box-shadow .2s;
}
.input:focus { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(243, 199, 95, .18); }
select.input { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--gold) 50%), linear-gradient(135deg, var(--gold) 50%, transparent 50%); background-position: calc(100% - 20px) 50%, calc(100% - 14px) 50%; background-size: 6px 6px; background-repeat: no-repeat; padding-right: 36px; }
.input-pass { position: relative; }
.input-pass button {
    position: absolute;
    right: 6px; top: 50%;
    transform: translateY(-50%);
    border: 0;
    background: none;
    color: var(--muted);
    font-size: 18px;
    width: 40px; height: 40px;
    cursor: pointer;
}

/* Seçim çipləri */
.chips { display: flex; gap: 8px; flex-wrap: wrap; }
.chip {
    flex: 1;
    min-width: 0;
    min-height: 44px;
    padding: 6px 10px;
    border-radius: 12px;
    border: 1.5px solid var(--line);
    background: rgba(255, 255, 255, .04);
    font-weight: 700;
    font-size: 13px;
    cursor: pointer;
    text-align: center;
    color: var(--fg);
}
.chip small { display: block; font-weight: 500; font-size: 10.5px; color: var(--muted); }
.chip.active { border-color: var(--gold); background: rgba(243, 199, 95, .16); color: var(--gold-hi); }

/* Bildirişlər */
.alert { padding: 12px 14px; border-radius: 14px; font-size: 13.5px; margin-bottom: 14px; line-height: 1.35; }
.alert.err { background: rgba(232, 57, 77, .18); border: 1px solid rgba(232, 57, 77, .7); color: #ffc1c8; }
.alert.ok { background: rgba(31, 184, 107, .18); border: 1px solid rgba(31, 184, 107, .7); color: #9ff5c8; }

#toast-wrap {
    position: fixed;
    left: 50%;
    top: 14px;
    transform: translateX(-50%);
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: min(92vw, 420px);
    pointer-events: none;
}
.toast {
    padding: 12px 16px;
    border-radius: 14px;
    background: rgba(25, 19, 48, .96);
    border: 1px solid var(--gold-line);
    box-shadow: 0 12px 30px rgba(0, 0, 0, .6);
    font-weight: 600;
    font-size: 13.5px;
    animation: toastIn .25s ease-out;
}
.toast.err { border-color: rgba(232, 57, 77, .8); }
.toast.ok { border-color: rgba(31, 184, 107, .8); }
.toast.out { opacity: 0; transform: translateY(-8px); transition: opacity .3s, transform .3s; }
@keyframes toastIn { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }

/* Modal / alt pəncərə */
.modal {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: none;
    align-items: flex-end;
    justify-content: center;
    background: rgba(5, 3, 12, .8);
}
.modal.open { display: flex; }
.modal .sheet {
    width: 100%;
    max-width: 520px;
    max-height: 88vh;
    overflow-y: auto;
    padding: 18px 18px calc(18px + var(--safe-b));
    border-radius: 26px 26px 0 0;
    background: linear-gradient(180deg, #221a3d, #140f27);
    border: 1px solid var(--gold-line);
    border-bottom: 0;
    animation: sheetUp .28s cubic-bezier(.2, .8, .3, 1);
}
.modal .sheet::before {
    content: "";
    display: block;
    width: 44px; height: 5px;
    margin: -6px auto 14px;
    border-radius: 9px;
    background: rgba(255, 255, 255, .2);
}
@keyframes sheetUp { from { transform: translateY(100%); } to { transform: none; } }
@media (min-width: 700px) {
    .modal { align-items: center; }
    .modal .sheet { border-radius: 26px; border-bottom: 1px solid var(--gold-line); }
}

/* Avatar */
.avatar {
    position: relative;
    flex: none;
    width: 44px; height: 44px;
    border-radius: 50%;
    overflow: visible;
    display: inline-block;
}
.avatar img.av { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; border: 2px solid var(--gold); background: #000; display: block; }
.avatar .vip { position: absolute; right: -6px; bottom: -6px; width: 22px; height: 22px; }

/* Ümumi Çat Mesajları (Lobbi və Oyun İçi Çat) */
.msg {
    display: flex;
    gap: 10px;
    align-items: flex-end;
    max-width: 88%;
}
.msg .avatar {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px;
    max-width: 34px;
    flex: 0 0 34px;
}
.msg .avatar img.av {
    width: 34px !important;
    height: 34px !important;
    border-width: 1.5px;
    border-radius: 50%;
    object-fit: cover;
}
.msg .avatar .vip {
    width: 15px;
    height: 15px;
    right: -3px;
    bottom: -3px;
}
.bubble {
    padding: 8px 12px;
    border-radius: 16px 16px 16px 4px;
    background: rgba(255, 255, 255, .09);
    border: 1px solid rgba(255, 255, 255, .1);
    font-size: 13.5px;
    line-height: 1.38;
    word-break: break-word;
}
.bubble .who {
    display: flex;
    gap: 6px;
    align-items: center;
    font-size: 11.5px;
    font-weight: 800;
    color: var(--gold-hi);
    margin-bottom: 2px;
}
.bubble .who time {
    font-weight: 500;
    font-size: 10.5px;
    color: var(--muted);
    margin-left: auto;
}
.msg.mine {
    align-self: flex-end;
    flex-direction: row-reverse;
}
.msg.mine .bubble {
    border-radius: 16px 16px 4px 16px;
    background: linear-gradient(180deg, rgba(243, 199, 95, .28), rgba(243, 199, 95, .14));
    border-color: rgba(243, 199, 95, .38);
}
.msg.admin .bubble { box-shadow: inset 0 0 0 1px rgba(232, 57, 77, .6); }
.msg.staff .bubble { box-shadow: inset 0 0 0 1px rgba(47, 123, 255, .6); }
.chat-form {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
}
.chat-form .input { flex: 1; min-height: 46px; }
.send-btn {
    flex: 0 0 50px;
    width: 50px;
    height: 46px;
    border: 0;
    background: none;
    padding: 0;
    cursor: pointer;
    display: grid;
    place-items: center;
}
.send-btn img {
    width: 46px;
    height: 42px;
    object-fit: contain;
    filter: drop-shadow(0 4px 6px rgba(0, 0, 0, .5));
}
.empty {
    text-align: center;
    padding: 24px 14px;
    color: var(--muted);
    border: 1px dashed rgba(255, 255, 255, .15);
    border-radius: 16px;
    font-size: 13px;
}

.coin { display: inline-flex; align-items: center; gap: 4px; font-weight: 800; color: var(--gold-hi); font-variant-numeric: tabular-nums; }
.coin::before {
    content: "";
    width: 1em; height: 1em;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 30%, #fff6c4, #f3c75f 45%, #a8711c 100%);
    box-shadow: inset 0 0 0 1.5px rgba(120, 70, 10, .6);
}

.badge {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 99px;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    background: rgba(255, 255, 255, .1);
    color: var(--fg);
}
.badge.admin { background: rgba(232, 57, 77, .25); color: #ffb3bc; }
.badge.staff { background: rgba(47, 123, 255, .25); color: #b5d0ff; }
.badge.vip { background: rgba(243, 199, 95, .22); color: var(--gold-hi); }
.badge.bot { background: rgba(31, 184, 107, .2); color: #a2f3c9; }
.badge.wait { background: rgba(31, 184, 107, .2); color: #a2f3c9; }
.badge.play { background: rgba(246, 185, 31, .2); color: #ffe08a; }

.muted { color: var(--muted); }
.center { text-align: center; }
.row { display: flex; align-items: center; gap: 10px; }
.grow { flex: 1; min-width: 0; }
.ellipsis { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hidden { display: none !important; }

/* Xüsusi Scrollbar (Brauzerin standart sürüşdürmə zolağı əvəzinə) */
* {
    scrollbar-width: thin;
    scrollbar-color: rgba(243, 199, 95, .38) rgba(12, 9, 24, .5);
}
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: rgba(12, 9, 24, .5); border-radius: 99px; }
::-webkit-scrollbar-thumb { background: linear-gradient(180deg, #f3c75f, #8c5808); border-radius: 99px; }

/* Forma xəta vurğusu */
.input.input-err, .z-select-trigger.input-err {
    border-color: var(--red) !important;
    box-shadow: 0 0 0 3px rgba(232, 57, 77, .28) !important;
    animation: zShake .36s ease-in-out;
}
@keyframes zShake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-6px); }
    50% { transform: translateX(6px); }
    75% { transform: translateX(-4px); }
}

/* ===== Xüsusi Zərdaş Seçim Düyməsi və Modalı (Standart <select> əvəzinə) ===== */
.z-native-select-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
    overflow: hidden !important;
}
.z-select-trigger {
    width: 100%;
    min-height: 50px;
    padding: 0 14px;
    border-radius: 14px;
    border: 1.5px solid rgba(243, 199, 95, .36);
    background: linear-gradient(180deg, rgba(32, 23, 58, .92), rgba(14, 10, 28, .94));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 6px 16px -8px rgba(0, 0, 0, .7);
    color: var(--fg);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    cursor: pointer;
    text-align: left;
    transition: border-color .2s, transform .12s, box-shadow .2s;
}
.z-select-trigger:hover, .z-select-trigger:focus {
    border-color: var(--gold);
    box-shadow: 0 0 0 3px rgba(243, 199, 95, .18);
}
.z-select-trigger:active { transform: scale(.985); }
.z-sel-left {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    font-size: 15px;
}
.z-sel-left i {
    color: var(--gold);
    font-size: 18px;
    flex: none;
}
.z-sel-left b {
    font-weight: 700;
    color: #fff;
}
.z-sel-right {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    border-radius: 99px;
    background: rgba(243, 199, 95, .14);
    border: 1px solid rgba(243, 199, 95, .3);
    color: var(--gold-hi);
    font-size: 11.5px;
    font-weight: 800;
    flex: none;
}
.z-sel-right i { font-size: 15px; }

.z-select-overlay { z-index: 3200; }
.z-select-sheet {
    max-height: 82vh !important;
    display: flex;
    flex-direction: column;
}
.z-sel-search-wrap { margin-bottom: 12px; }
.z-sel-search-box {
    position: relative;
    margin-bottom: 10px;
}
.z-sel-search-box i {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--gold);
    font-size: 18px;
    pointer-events: none;
}
.z-sel-search-box .input {
    padding-left: 42px;
    min-height: 46px;
    font-size: 14px;
}
.z-sel-popular {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}
.z-pop-chip {
    padding: 5px 10px;
    border-radius: 99px;
    border: 1px solid rgba(243, 199, 95, .3);
    background: rgba(243, 199, 95, .1);
    color: var(--gold-hi);
    font-size: 11.5px;
    font-weight: 700;
    cursor: pointer;
    transition: transform .12s, background .15s;
}
.z-pop-chip.active, .z-pop-chip:hover {
    background: linear-gradient(180deg, var(--gold-hi), var(--gold));
    color: #2a1804;
    border-color: transparent;
}
.z-opt-grid {
    display: grid;
    gap: 8px;
    max-height: 48vh;
    overflow-y: auto;
    padding: 2px 2px 6px;
}
.z-opt-grid.two-col { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.z-opt-grid.one-col { grid-template-columns: 1fr; }
.z-opt-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 11px 12px;
    border-radius: 14px;
    border: 1.5px solid var(--line);
    background: rgba(255, 255, 255, .04);
    color: var(--fg);
    font-size: 13.5px;
    font-weight: 700;
    cursor: pointer;
    text-align: left;
    min-width: 0;
    transition: border-color .15s, background .15s, transform .1s;
}
.z-opt-item:active { transform: scale(.97); }
.z-opt-item .z-opt-ico { color: var(--gold); font-size: 16px; flex: none; }
.z-opt-item .z-opt-chk { margin-left: auto; color: #33d685; font-size: 17px; flex: none; }
.z-opt-item.active {
    border-color: var(--gold-hi);
    background: linear-gradient(135deg, rgba(243, 199, 95, .22), rgba(122, 63, 18, .45));
    color: var(--gold-hi);
    box-shadow: 0 0 0 1px rgba(243, 199, 95, .3);
}

/* ===== Xüsusi Zərdaş Təsdiq / Çıxış / Bildiriş Modalı (Confirm & Alert əvəzinə) ===== */
.z-dialog-overlay {
    z-index: 3500;
    align-items: center !important;
    padding: 16px;
    backdrop-filter: blur(5px);
}
.z-dialog-sheet {
    max-width: 400px !important;
    border-radius: 26px !important;
    border: 1.5px solid var(--gold) !important;
    background: radial-gradient(120% 90% at 50% 0%, rgba(243, 199, 95, .18), transparent 60%), linear-gradient(180deg, #261c44, #130e24) !important;
    box-shadow: 0 22px 50px rgba(0, 0, 0, .85), inset 0 1px 0 rgba(255, 233, 168, .25) !important;
    text-align: center;
    padding: 24px 20px 20px !important;
}
.z-dialog-sheet::before { display: none !important; }
.z-dlg-badge {
    width: 66px;
    height: 66px;
    margin: 0 auto 12px;
    border-radius: 22px;
    display: grid;
    place-items: center;
    font-size: 32px;
    box-shadow: 0 10px 24px -8px rgba(0, 0, 0, .7);
}
.z-dlg-badge.danger {
    background: linear-gradient(135deg, rgba(232, 57, 77, .28), rgba(130, 18, 34, .55));
    border: 1.5px solid rgba(255, 110, 128, .65);
    color: #ff8593;
}
.z-dlg-badge.gold {
    background: linear-gradient(135deg, rgba(243, 199, 95, .28), rgba(122, 63, 18, .55));
    border: 1.5px solid var(--gold);
    color: var(--gold-hi);
}
.z-dlg-badge.ok {
    background: linear-gradient(135deg, rgba(31, 184, 107, .28), rgba(11, 100, 56, .55));
    border: 1.5px solid rgba(91, 230, 160, .65);
    color: #5be6a0;
}
.z-dlg-title {
    margin: 0 0 8px;
    font-family: var(--font-display);
    font-size: 18px;
    font-weight: 800;
    color: var(--gold-hi);
}
.z-dlg-msg {
    margin: 0 0 20px;
    font-size: 14px;
    line-height: 1.45;
    color: #dcd5f2;
}
.z-dlg-actions {
    display: flex;
    gap: 10px;
    align-items: center;
}

/* 404 / Xəta səhifəsi nişanı */
.z-err-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 18px;
    border-radius: 99px;
    background: linear-gradient(135deg, rgba(232, 57, 77, .25), rgba(122, 63, 18, .45));
    border: 1.5px solid var(--gold);
    color: var(--gold-hi);
    font-family: var(--font-display);
    font-size: 22px;
    font-weight: 800;
    box-shadow: 0 8px 20px rgba(0, 0, 0, .5);
}
.z-err-badge i { color: #ff6b7d; font-size: 24px; }

/* ===== Qlobal Oyunçu Profil Kartı Pəncərəsi (#z-player-modal) ===== */
.z-pcard-sheet {
    position: relative;
    max-width: 430px !important;
    border-radius: 26px !important;
    border: 1.5px solid var(--gold) !important;
    background: radial-gradient(120% 90% at 50% 0%, rgba(243, 199, 95, .20), transparent 62%), linear-gradient(180deg, #271b46, #120c22) !important;
    box-shadow: 0 24px 56px rgba(0, 0, 0, .88), inset 0 1px 0 rgba(255, 233, 168, .28) !important;
    padding: 20px 18px 18px !important;
}
.z-pcard-sheet::before { display: none !important; }
.z-pcard-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid rgba(243, 199, 95, .4);
    background: rgba(15, 10, 28, .75);
    color: var(--gold-hi);
    display: grid;
    place-items: center;
    font-size: 18px;
    cursor: pointer;
    z-index: 2;
}
.z-pcard-loading {
    padding: 28px 12px;
    text-align: center;
    color: var(--gold-hi);
    font-size: 14px;
}
.z-pcard-head {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 14px;
}
.z-pcard-av {
    position: relative;
    flex: none;
}
.z-pcard-lvl {
    position: absolute;
    bottom: -6px;
    left: 50%;
    transform: translateX(-50%);
    background: linear-gradient(135deg, #f3c75f, #b8791a);
    color: #1c1104;
    font-size: 10px;
    font-weight: 800;
    padding: 2px 8px;
    border-radius: 99px;
    border: 1px solid #fff3c4;
    white-space: nowrap;
}
.z-pcard-id {
    min-width: 0;
    flex: 1;
}
.z-pcard-name {
    font-family: var(--font-display);
    font-size: 17px;
    font-weight: 800;
    color: var(--gold-hi);
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}
.z-pcard-user {
    font-size: 12px;
    color: var(--muted);
    margin-bottom: 5px;
}
.z-pcard-role {
    font-family: var(--font-sans);
    font-size: 10px;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 99px;
    display: inline-flex;
    align-items: center;
    gap: 3px;
}
.z-pcard-role.vip { background: linear-gradient(135deg, #f3c75f, #a96810); color: #1b1002; }
.z-pcard-role.admin { background: linear-gradient(135deg, #ff586d, #9b1526); color: #fff; }
.z-pcard-role.staff { background: linear-gradient(135deg, #43b0ff, #16599e); color: #fff; }
.z-pcard-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-bottom: 5px;
}
.z-pcard-title, .z-pcard-region {
    font-size: 11px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 8px;
    background: rgba(243, 199, 95, .14);
    border: 1px solid rgba(243, 199, 95, .32);
    color: var(--gold-hi);
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.z-pcard-region {
    background: rgba(67, 176, 255, .14);
    border-color: rgba(67, 176, 255, .32);
    color: #9ed6ff;
}
.z-pcard-status {
    font-size: 11px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.z-pcard-status.on { color: #4ce89a; }
.z-pcard-status.off { color: var(--muted); }
.z-pcard-xp {
    background: rgba(12, 8, 24, .6);
    border: 1px solid rgba(243, 199, 95, .22);
    border-radius: 12px;
    padding: 8px 10px;
    margin-bottom: 12px;
}
.z-pcard-xprow {
    display: flex;
    justify-content: space-between;
    font-size: 11px;
    color: var(--muted);
    margin-bottom: 5px;
}
.z-pcard-xprow b { color: var(--gold-hi); }
.z-pcard-stats {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
    margin-bottom: 14px;
}
.z-pcard-stat {
    background: rgba(16, 11, 31, .65);
    border: 1px solid rgba(243, 199, 95, .2);
    border-radius: 12px;
    padding: 8px 10px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.z-pcard-stat b {
    font-size: 13px;
    color: var(--gold-hi);
    display: flex;
    align-items: center;
    gap: 5px;
}
.z-pcard-stat small {
    font-size: 10px;
    color: var(--muted);
}
.z-pcard-btnrow {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}
[data-pcard] {
    cursor: pointer;
}

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