/* Palette matches sandbox-shell.css. Scoped so admin and other views stay independent. */
.exp-page, .lh-page, .wm-wrap, .wm-tooltip, .acc-wrap, .gx, .gx-modal {
    --player-bg: #191814;
    --player-surface: #24211b;
    --player-raised: #2d2921;
    --player-line: #574a32;
    --player-brass: #c5a35e;
    --player-gold: #e5cb8c;
    --player-text: #e9dec8;
    --player-muted: #b3a58d;
    --player-sage: #8db9a4;
    --player-red: #df998c;
    color-scheme: dark;
}
:is(.exp-page, .lh-page, .wm-wrap, .acc-wrap, .gx) :where(span, label) { color: inherit; font-size: inherit; }

/* Shared player views: experience, loot, world map, account and gold exchange. */

/* ExperienceInfo.cshtml */
.exp-page {
    min-height: 100%; height: 100%; width: 100%;
    box-sizing: border-box;
    color: var(--player-text);
    padding: 12px; padding-top: 25px;
    display: flex; flex-direction: column; gap: 8px;
    overflow-x: hidden; overflow-y: auto;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}
.exp-page * { box-sizing: border-box; max-width: 100%; }
.exp-page--pulse .exp-card { box-shadow: 0 0 0 1px rgba(197,163,94,.35), 0 0 28px rgba(197,163,94,.18); transition: box-shadow .25s ease; }

/* ========= HEADER ========= */
.exp-header {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 10px;
    padding: 10px 12px;
    border: 1px solid rgba(197,163,94,.45); border-radius: 12px;
    background: var(--player-surface);
    min-width: 0;
}
.exp-header__left { min-width: 0; flex: 1 1 auto; }
.exp-title { font-size: 15px; font-weight: 900; letter-spacing: 1.5px; color: var(--player-brass); text-shadow: 0 0 10px rgba(197,163,94,.45); line-height: 1.15; }
.exp-subtitle { margin-top: 4px; font-size: 11.5px; color: var(--player-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.exp-subtitle b { color: var(--player-gold); }
.exp-header__right { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.exp-btn { border: 1px solid rgba(197,163,94,.45); background: rgba(0,0,0,.35); color: var(--player-brass); border-radius: 8px; padding: 6px 10px; font-weight: 800; cursor: pointer; font-size: 12px; white-space: nowrap; }
.exp-btn:hover { background: rgba(197,163,94,.12); color: var(--player-gold); }
.exp-live { display: inline-flex; align-items: center; gap: 7px; padding: 6px 9px; border-radius: 999px; border: 1px solid rgba(197,163,94,.3); background: var(--player-bg); white-space: nowrap; }
.exp-live__dot { width: 8px; height: 8px; border-radius: 999px; background: var(--player-sage); animation: expLivePulse 1.6s infinite; }
.exp-live__txt { font-size: 10px; letter-spacing: .8px; font-weight: 900; color: var(--player-sage); }
@keyframes expLivePulse {
    0%   { box-shadow: 0 0 0 0    rgba(121,168,149,.45); }
    70%  { box-shadow: 0 0 0 9px  rgba(121,168,149,0); }
    100% { box-shadow: 0 0 0 0    rgba(121,168,149,0); }
}

/* ========= KARTY ========= */
.exp-card { border: 1px solid rgba(197,163,94,.35); border-radius: 12px; background: var(--player-surface); padding: 10px; }
.exp-empty { text-align: center; padding: 24px 12px; color: var(--player-muted); font-size: 12px; }
.exp-sec { font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--player-brass); font-weight: 800; margin: 0 2px 8px; }
.exp-sec span { color: var(--player-gold); letter-spacing: 0; text-transform: none; font-weight: 800; margin-left: 4px; }
.exp-hint { font-size: 10px; color: var(--player-muted); text-align: center; margin-top: 6px; }

/* ikona broni */
.exp-ico { width: 44px; height: 44px; border-radius: 9px; border: 1px solid rgba(197,163,94,.45); background: radial-gradient(circle at 40% 30%, var(--player-raised), var(--player-bg)); display: flex; align-items: center; justify-content: center; flex-shrink: 0; overflow: hidden; }
.exp-ico img { width: 86%; height: 86%; object-fit: contain; }
.exp-ico .ph { color: var(--player-muted); font-size: 14px; font-weight: 900; }
.exp-ico.sm { width: 28px; height: 28px; border-radius: 7px; }

/* spotlight */
.exp-spot { display: flex; gap: 12px; align-items: center; border: 1px solid var(--player-gold); border-radius: 12px; padding: 10px 12px; background: linear-gradient(135deg, rgba(197,163,94,.12), var(--player-surface)); }
.exp-ring { position: relative; width: 84px; height: 84px; flex-shrink: 0; }
.exp-ring svg { transform: rotate(-90deg); display: block; }
.exp-ring .c { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
.exp-ring .c .exp-ico { width: 52px; height: 52px; border-radius: 50%; border-color: rgba(197,163,94,.5); }
.exp-spot__body { flex: 1; min-width: 0; }
.exp-name { font-weight: 800; color: var(--player-text); font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.exp-tag { display: inline-block; font-size: 8.5px; letter-spacing: .12em; text-transform: uppercase; border: 1px solid rgba(197,163,94,.5); color: var(--player-gold); border-radius: 999px; padding: 1px 6px; margin-left: 6px; vertical-align: middle; }
.exp-tag.dim { border-color: rgba(255,255,255,.15); color: var(--player-muted); }
.exp-lv { font-size: 22px; font-weight: 900; color: var(--player-gold); line-height: 1; }
.exp-lv small { font-size: 10px; color: var(--player-muted); font-weight: 700; margin-left: 3px; }
.exp-bonus { color: var(--player-sage); font-weight: 800; font-size: 12px; }
.exp-xp { color: var(--player-muted); font-size: 10.5px; margin-top: 4px; }
.exp-xp b { color: var(--player-text); }
.exp-xp .today { color: #b6a2c9; font-weight: 800; }
.exp-bar { height: 6px; border-radius: 4px; background: rgba(255,255,255,.07); overflow: hidden; margin-top: 6px; }
.exp-bar i { display: block; height: 100%; border-radius: 4px; background: linear-gradient(90deg, var(--player-brass), var(--player-gold)); transition: width .35s ease; }

/* żetony */
.exp-chips { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.exp-chip { display: flex; align-items: center; gap: 6px; border: 1px solid rgba(197,163,94,.3); border-radius: 999px; padding: 3px 9px 3px 3px; background: var(--player-surface); font-size: 10.5px; color: var(--player-text); cursor: pointer; user-select: none; }
.exp-chip:hover { border-color: rgba(197,163,94,.7); }
.exp-chip.on { border-color: var(--player-gold); background: rgba(197,163,94,.1); }
.exp-chip .lv { font-weight: 900; color: var(--player-gold); }
.exp-chip .mini { width: 44px; height: 4px; border-radius: 3px; background: rgba(255,255,255,.08); overflow: hidden; }
.exp-chip .mini i { display: block; height: 100%; background: linear-gradient(90deg, var(--player-brass), var(--player-gold)); }
.exp-chip .act { font-size: 9px; }

/* drabina */
.exp-ladder { position: relative; margin: 14px 10px 6px; }
.exp-track { height: 6px; border-radius: 3px; background: rgba(255,255,255,.07); position: relative; }
.exp-track i { display: block; height: 100%; border-radius: 3px; background: linear-gradient(90deg, var(--player-brass), var(--player-gold)); transition: width .35s ease; }
.exp-ms { position: absolute; top: -6px; width: 18px; height: 18px; border-radius: 50%; border: 2px solid rgba(197,163,94,.45); background: var(--player-bg); transform: translateX(-50%); display: flex; align-items: center; justify-content: center; font-size: 7.5px; color: var(--player-muted); font-weight: 700; }
.exp-ms.done { border-color: var(--player-gold); background: var(--player-gold); color: var(--player-bg); font-weight: 900; }
.exp-ms.you { border-color: var(--player-sage); background: var(--player-sage); color: #0b2a12; font-weight: 900; width: 22px; height: 22px; top: -8px; z-index: 2; box-shadow: 0 0 10px rgba(121,168,149,.5); }
.exp-lbls { display: flex; justify-content: space-between; font-size: 9px; color: var(--player-muted); margin-top: 14px; }
.exp-mrow { display: flex; justify-content: space-between; gap: 8px; font-size: 10.5px; padding: 4px 8px; border-bottom: 1px solid rgba(255,255,255,.05); }
.exp-mrow .l { color: var(--player-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.exp-mrow .r { color: var(--player-muted); white-space: nowrap; }
.exp-mrow b { color: var(--player-gold); }
.exp-mrow.done .l { color: var(--player-muted); }
.exp-mrow.you { background: rgba(121,168,149,.07); }
.exp-mrow.you .l { color: var(--player-sage); font-weight: 700; }

/* LootHistory.cshtml */
.lh-page {
    min-height: 100%; height: 100%; width: 100%;
    box-sizing: border-box;
    color: var(--player-text);
    padding: 12px; padding-top: 25px;
    display: flex; flex-direction: column; gap: 8px;
    overflow-x: hidden;
    container-type: inline-size; container-name: lh;
}
.lh-page * { box-sizing: border-box; max-width: 100%; }

/* ========= HEADER ========= */
.lh-header {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 10px;
    padding: 10px 12px;
    border: 1px solid rgba(197,163,94,.45); border-radius: 12px;
    background: var(--player-surface);
    min-width: 0;
}
.lh-header__left { min-width: 0; flex: 1 1 auto; }
.lh-title { font-size: 15px; font-weight: 900; letter-spacing: 1.5px; color: var(--player-brass); text-shadow: 0 0 10px rgba(197,163,94,.45); line-height: 1.15; }
.lh-subtitle { margin-top: 4px; font-size: 11.5px; color: var(--player-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lh-subtitle b { color: var(--player-gold); }
.lh-header__right { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.lh-btn {
    border: 1px solid rgba(197,163,94,.45); background: rgba(0,0,0,.35); color: var(--player-brass);
    border-radius: 8px; padding: 6px 10px; font-weight: 800; cursor: pointer; font-size: 12px; white-space: nowrap;
}
.lh-btn:hover { background: rgba(197,163,94,.12); color: var(--player-gold); }
.lh-live { display: inline-flex; align-items: center; gap: 7px; padding: 6px 9px; border-radius: 999px; border: 1px solid rgba(197,163,94,.3); background: var(--player-bg); white-space: nowrap; }
.lh-live__dot { width: 8px; height: 8px; border-radius: 999px; background: var(--player-sage); animation: lhLivePulse 1.6s infinite; }
.lh-live__txt { font-size: 10px; letter-spacing: .8px; font-weight: 900; color: var(--player-sage); }
@keyframes lhLivePulse {
    0%   { box-shadow: 0 0 0 0    rgba(121,168,149,.45); }
    70%  { box-shadow: 0 0 0 9px  rgba(121,168,149,0); }
    100% { box-shadow: 0 0 0 0    rgba(121,168,149,0); }
}

/* ========= ZAKŁADKI ========= */
.lh-tabs { display: flex; gap: 6px; }
.lh-tab {
    flex: 1; padding: 6px 8px; border-radius: 9px;
    border: 1px solid rgba(197,163,94,.3); background: var(--player-bg);
    color: var(--player-muted); font-size: 11.5px; font-weight: 800; letter-spacing: .6px; cursor: pointer;
}
.lh-tab:hover { color: var(--player-gold); }
.lh-tab.on { background: rgba(197,163,94,.16); color: var(--player-gold); border-color: var(--player-brass); }

/* ========= KARTA / UKŁAD ========= */
.lh-card {
    flex: 1 1 auto; min-height: 0;
    border: 1px solid rgba(197,163,94,.35); border-radius: 12px;
    background: var(--player-surface);
    overflow: hidden;
}
.lh-view[hidden] { display: none; }
.lh-body { display: grid; grid-template-columns: 108px minmax(0, 1fr); height: 100%; min-height: 0; }
.lh-days { border-right: 1px solid rgba(197,163,94,.2); overflow-y: auto; padding: 6px; }
.lh-detail { overflow-y: auto; overflow-x: hidden; padding: 8px; min-width: 0; }
.lh-stats { height: 100%; overflow-y: auto; padding: 8px; }

/* dni (master) */
.lh-day {
    display: block; width: 100%; text-align: left; cursor: pointer;
    border: 1px solid transparent; border-radius: 8px; padding: 5px 7px; margin-bottom: 3px;
    background: transparent; color: var(--player-muted); font-size: 10px; line-height: 1.3;
}
.lh-day:hover { background: rgba(197,163,94,.07); }
.lh-day.on { background: rgba(197,163,94,.15); border-color: rgba(197,163,94,.45); color: var(--player-gold); }
.lh-day b { display: block; color: var(--player-text); font-size: 11px; }
.lh-day.on b { color: var(--player-gold); }
.lh-day small { color: var(--player-muted); }
.lh-day .lh-day__more { display: block; text-align: center; padding: 6px; color: var(--player-muted); font-size: 10px; }

/* KPI */
.lh-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin-bottom: 6px; }
.lh-kpi { border: 1px solid rgba(197,163,94,.3); border-radius: 8px; padding: 6px 7px; background: var(--player-surface); min-width: 0; }
.lh-kpi .k { font-size: 9px; letter-spacing: .12em; text-transform: uppercase; color: var(--player-muted); white-space: nowrap; }
.lh-kpi .v { font-size: 14px; font-weight: 900; color: var(--player-gold); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lh-kpi .v small { font-size: 9px; font-weight: 800; margin-left: 3px; }
.lh-kpi .v small.up { color: var(--player-sage); }
.lh-kpi .v small.down { color: var(--player-red); }
.lh-kpi .v small.flat { color: var(--player-muted); }
.lh-sub { display: flex; gap: 12px; font-size: 10px; color: var(--player-muted); margin: 0 2px 6px; flex-wrap: wrap; }
.lh-sub b { color: var(--player-muted); }

/* godziny */
.lh-hours { display: flex; align-items: flex-end; gap: 2px; height: 44px; margin: 2px 2px 0; }
.lh-hours span {
    flex: 1; min-height: 2px; border-radius: 2px 2px 0 0; cursor: pointer;
    background: rgba(197,163,94,.28); transition: background .12s;
}
.lh-hours span:hover { background: rgba(197,163,94,.6); }
.lh-hours span.hi { background: var(--player-brass); }
.lh-hours span.sel { background: var(--player-gold); box-shadow: 0 0 6px rgba(197,163,94,.6); }
.lh-hours span.empty { background: rgba(255,255,255,.05); cursor: default; }
.lh-hlbl { display: flex; justify-content: space-between; color: var(--player-muted); font-size: 9px; margin: 1px 2px 6px; }

/* filtry */
.lh-filters { display: flex; gap: 5px; flex-wrap: wrap; margin-bottom: 6px; align-items: center; }
.lh-chip {
    border: 1px solid rgba(197,163,94,.35); border-radius: 999px; padding: 2px 8px;
    font-size: 9.5px; color: var(--player-muted); background: transparent; cursor: pointer; white-space: nowrap;
}
.lh-chip:hover { color: var(--player-gold); }
.lh-chip.on { background: rgba(197,163,94,.15); color: var(--player-gold); border-color: var(--player-brass); }
.lh-chip select { background: transparent; border: none; color: inherit; font-size: 9.5px; outline: none; max-width: 110px; }
.lh-chip select option { background: var(--player-bg); color: var(--player-text); }

/* sesje */
.lh-sess { border: 1px solid rgba(197,163,94,.28); border-radius: 9px; margin-bottom: 7px; overflow: hidden; }
.lh-sess__h {
    display: flex; align-items: center; gap: 8px; padding: 6px 9px;
    background: rgba(197,163,94,.08); cursor: pointer; user-select: none; font-size: 10.5px; min-width: 0;
}
.lh-sess__h:hover { background: rgba(197,163,94,.12); }
.lh-sess__h .sn { color: var(--player-gold); font-weight: 900; letter-spacing: .4px; white-space: nowrap; }
.lh-sess__h .sd { color: var(--player-muted); white-space: nowrap; }
.lh-sess__h .ss { margin-left: auto; display: flex; gap: 8px; color: var(--player-muted); font-size: 10px; white-space: nowrap; }
.lh-sess__h .ss b { color: var(--player-text); }
.lh-sess__h .ch { color: var(--player-muted); font-size: 9px; transition: transform .12s; }
.lh-sess.open .lh-sess__h .ch { transform: rotate(90deg); color: var(--player-brass); }
.lh-sess__b { display: none; }
.lh-sess.open .lh-sess__b { display: block; }
.lh-sess__more { text-align: center; padding: 5px; color: var(--player-muted); font-size: 10px; }

/* wiersze killi */
.lh-r { border-bottom: 1px solid rgba(255,255,255,.05); }
.lh-r__main {
    display: flex; align-items: center; gap: 7px; width: 100%;
    padding: 3px 8px; min-height: 24px; cursor: pointer;
    font-size: 11px; line-height: 1.2; user-select: none;
}
.lh-r__main:hover { background: rgba(197,163,94,.06); }
.lh-r.open .lh-r__main { background: rgba(197,163,94,.08); }
.lh-r--new .lh-r__main { animation: lhRowFlash 1.2s ease; }
@keyframes lhRowFlash { 0% { background: rgba(197,163,94,.25); } 100% { background: transparent; } }
.lh-r .r-time { color: var(--player-muted); font-size: 10px; font-family: Consolas, monospace; flex: 0 0 36px; }
.lh-r .r-enemy { color: var(--player-text); font-weight: 700; flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lh-r .r-loot { flex: 0 0 auto; font-size: 10px; color: var(--player-gold); font-weight: 700; }
.lh-r .r-loot.none { color: var(--player-muted); font-weight: 400; }
.lh-r .r-exp { flex: 0 0 auto; font-size: 10px; color: #b6a2c9; font-weight: 700; }
.lh-r .r-silver { flex: 0 0 auto; font-size: 10px; color: var(--player-gold); font-weight: 700; }
.lh-r .r-dmg { flex: 0 0 auto; font-weight: 800; font-size: 11px; color: var(--player-sage); }
.lh-r .r-dmg.partial { color: var(--player-gold); }
.lh-r .r-party { flex: 0 0 auto; font-size: 10px; color: var(--player-muted); }
.lh-r .r-chev { flex: 0 0 auto; color: var(--player-muted); font-size: 9px; transition: transform .12s ease; }
.lh-r.open .r-chev { transform: rotate(90deg); color: var(--player-brass); }
.lh-r__det { display: none; padding: 6px 10px 8px 52px; font-size: 11px; background: rgba(0,0,0,.25); }
.lh-r.open .lh-r__det { display: block; }
.lh-det-row { margin-top: 4px; color: var(--player-muted); }
.lh-det-row b { color: var(--player-gold); }
.lh-item {
    display: inline-flex; align-items: center; gap: 4px;
    background: rgba(197,163,94,.07); border: 1px solid rgba(197,163,94,.22); border-radius: 5px;
    padding: 1px 6px; font-size: 10px; color: var(--player-gold); white-space: nowrap; margin: 2px 3px 0 0;
}
.lh-item img { width: 15px; height: 15px; object-fit: contain; border-radius: 2px; flex-shrink: 0; }
.lh-part { color: var(--player-muted); }
.lh-part b { color: var(--player-text); font-weight: 700; }
.lh-empty-state { text-align: center; padding: 40px 16px; color: var(--player-muted); font-size: 12.5px; }
.lh-note { font-size: 10px; color: var(--player-muted); text-align: center; padding: 4px; }

/* dzień zarchiwizowany (podsumowanie per potwór) */
.lh-archb { font-size: 10px; opacity: .8; }
.lh-arch { display: flex; flex-direction: column; gap: 4px; margin-top: 6px; }
.lh-arch__r {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    padding: 7px 10px; border: 1px solid rgba(255,255,255,.08); border-radius: 8px;
    background: rgba(0,0,0,.18); font-size: 12px;
}
.lh-arch__r .a-enemy { font-weight: 800; color: var(--player-text); min-width: 120px; }
.lh-arch__r .a-kills b { color: var(--player-brass); }
.lh-arch__r .a-loot { color: var(--player-gold); }
.lh-arch__r .a-exp { color: var(--player-sage); }
.lh-arch__r .a-silver { color: var(--player-gold); }
.lh-arch__r .a-dmg { color: var(--player-muted); }
.lh-arch__r .a-extra { margin-left: auto; color: var(--player-muted); font-size: 11px; }

/* statystyki */
.lh-range { display: flex; gap: 5px; margin-bottom: 8px; }
.lh-range .lh-chip { flex: 1; text-align: center; }
.lh-bars { display: flex; align-items: flex-end; gap: 2px; height: 56px; margin: 6px 2px 0; }
.lh-bars span { flex: 1; min-height: 2px; border-radius: 2px 2px 0 0; background: rgba(197,163,94,.3); cursor: pointer; }
.lh-bars span:hover { background: var(--player-brass); }
.lh-bars span.hi { background: var(--player-brass); }
.lh-bars span.today { background: var(--player-gold); }
.lh-bars span.empty { background: rgba(255,255,255,.05); }
.lh-sec { font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--player-brass); font-weight: 800; margin: 10px 2px 5px; }
.lh-tbl { width: 100%; border-collapse: collapse; font-size: 10.5px; }
.lh-tbl td { padding: 3px 4px; border-bottom: 1px solid rgba(255,255,255,.05); color: var(--player-muted); white-space: nowrap; }
.lh-tbl td:first-child { color: var(--player-text); font-weight: 700; max-width: 0; overflow: hidden; text-overflow: ellipsis; width: 45%; }
.lh-tbl td b { color: var(--player-gold); }
.lh-tbl td.num { text-align: right; }

/* wąski panel: dni jako poziomy pasek nad szczegółami */
@container lh (max-width: 520px) {
    .lh-body { grid-template-columns: 1fr; grid-template-rows: auto minmax(0, 1fr); }
    .lh-days { display: flex; gap: 4px; overflow-x: auto; overflow-y: hidden; border-right: none; border-bottom: 1px solid rgba(197,163,94,.2); padding: 6px; }
    .lh-day { flex: 0 0 auto; width: auto; min-width: 78px; margin-bottom: 0; }
    .lh-day .lh-day__more { padding: 6px 8px; }
    .lh-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* _WorldMapContent.cshtml */
.wm-wrap {
    max-width: 1400px;
    margin: 12px auto 24px;
    padding: 0 10px;
    color: var(--player-text);
}

.wm-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    padding: 10px 14px;
    border: 1px solid rgba(197,163,94,0.45);
    border-radius: 12px;
    background: var(--player-surface);
    margin-bottom: 10px;
}

.wm-title {
    color: var(--player-brass);
    text-shadow: 0 0 10px rgba(197,163,94,0.55);
    font-weight: 800;
    letter-spacing: 2px;
    font-size: 1.05rem;
}

.wm-sub { color: var(--player-muted); font-size: .78rem; }

.wm-controls { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }

.wm-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px;
    border-radius: 999px;
    border: 1px solid rgba(197,163,94,0.35);
    background: rgba(0, 0, 0, 0.35);
    color: var(--player-text);
    font-size: .78rem;
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
}

.wm-chip input { accent-color: var(--player-brass); cursor: pointer; }
.wm-chip:hover { border-color: rgba(197,163,94,0.7); }

.wm-btn {
    border: 1px solid rgba(197,163,94,0.45);
    background: rgba(0, 0, 0, 0.35);
    color: var(--player-brass);
    border-radius: 8px;
    padding: 5px 10px;
    font-size: .8rem;
    font-weight: 700;
    cursor: pointer;
}

.wm-btn:hover { background: rgba(197,163,94,0.12); }

/* Wybór mapy — ten sam look co wm-btn, ale natywny select */
.wm-mapsel {
    border: 1px solid rgba(197,163,94,0.45);
    background: rgba(0, 0, 0, 0.55);
    color: var(--player-gold);
    border-radius: 8px;
    padding: 5px 8px;
    font-size: .8rem;
    font-weight: 700;
    cursor: pointer;
    max-width: 180px;
}
.wm-mapsel:hover { border-color: rgba(197,163,94,0.7); }
.wm-mapsel option { background: var(--player-bg); color: var(--player-text); }

.wm-stage {
    position: relative;
    border: 1px solid rgba(197,163,94,0.45);
    border-radius: 12px;
    background: var(--player-bg);
    overflow: hidden;
    height: min(78vh, 900px);
    box-shadow: 0 0 24px rgba(0, 0, 0, 0.6) inset;
}

#wmSvg { width: 100%; height: 100%; display: block; cursor: grab; touch-action: none; }
#wmSvg.dragging { cursor: grabbing; }

.wm-coords {
    position: absolute;
    left: 10px;
    bottom: 10px;
    padding: 4px 10px;
    border-radius: 8px;
    background: var(--player-bg);
    border: 1px solid rgba(197,163,94,0.35);
    color: var(--player-gold);
    font-size: .75rem;
    font-family: Consolas, monospace;
    pointer-events: none;
}

.wm-legend {
    position: absolute;
    right: 10px;
    top: 10px;
    padding: 8px 12px;
    border-radius: 10px;
    background: var(--player-bg);
    border: 1px solid rgba(197,163,94,0.35);
    font-size: .74rem;
    color: #d9cdb4;
    line-height: 1.7;
    pointer-events: none;
}

.wm-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; vertical-align: -1px; margin-right: 6px; }

.wm-zoom {
    position: absolute;
    left: 10px;
    top: 10px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.wm-zoom .wm-btn { width: 34px; height: 34px; padding: 0; font-size: 1rem; }

.wm-tooltip {
    position: fixed;
    z-index: 9999;
    min-width: 200px;
    max-width: 300px;
    background: linear-gradient(180deg, var(--player-raised), var(--player-bg));
    border: 1px solid rgba(197,163,94,0.55);
    border-radius: 10px;
    padding: 10px 12px;
    color: var(--player-text);
    font-size: .8rem;
    box-shadow: 0 0 18px rgba(0, 0, 0, 0.85);
    pointer-events: none;
    display: none;
}

.wm-tooltip__title {
    color: var(--player-gold);
    font-weight: 800;
    font-size: .88rem;
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.wm-tooltip__title img { width: 26px; height: 26px; object-fit: contain; border-radius: 5px; background: rgba(0,0,0,.4); }
/* baseline: etykieta i wartość siedzą na jednej linii pisma, nawet gdy
   wartość jest dłuższa/łamana (np. "strefa spawnera (UE)") */
.wm-tooltip__row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 1px 0; }
.wm-tooltip__row > span { flex: 0 0 auto; }
.wm-tooltip__row b { color: var(--player-gold); font-weight: 700; text-align: right; }
.wm-tooltip__muted { color: var(--player-muted); font-size: .72rem; margin-top: 5px; }
.wm-tt-alive { color: var(--player-sage); font-weight: 700; }
.wm-tt-dead { color: #b06a6a; font-weight: 700; }

.wm-note {
    margin-top: 8px;
    padding: 8px 12px;
    border-radius: 10px;
    border: 1px dashed rgba(197,163,94,0.4);
    background: rgba(197,163,94,0.05);
    color: var(--player-muted);
    font-size: .76rem;
    display: none;
}

/* Rozwijany panel warstw */
.wm-layers { position: relative; display: inline-block; }
.wm-layers__panel {
    display: none;
    position: absolute; right: 0; top: calc(100% + 6px); z-index: 60;
    min-width: 230px; padding: 8px;
    background: linear-gradient(180deg, var(--player-raised), var(--player-bg));
    border: 1px solid rgba(197,163,94,0.5); border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.7);
}
.wm-layers.open .wm-layers__panel { display: block; }
.wm-layer-row {
    display: flex; align-items: center; gap: 7px;
    padding: 5px 8px; border-radius: 8px; cursor: pointer;
    color: var(--player-text); font-size: .8rem; user-select: none;
}
.wm-layer-row:hover { background: rgba(197,163,94,0.08); }
.wm-layer-row input { accent-color: var(--player-brass); }
.wm-layer-row--head { cursor: default; }
.wm-layer-row--sub { padding-left: 26px; font-size: .76rem; }
.wm-layer-group { border-top: 1px solid rgba(255,255,255,.05); border-bottom: 1px solid rgba(255,255,255,.05); margin: 2px 0; }
.wm-exp {
    background: none; border: none; color: var(--player-gold); cursor: pointer;
    font-size: .85rem; padding: 2px 7px; transition: transform .15s;
}
.wm-exp.open { transform: rotate(90deg); }

/* Wariant kompaktowy (panel boczny) — klasę dodaje worldmap.js */
.wm-wrap.wm-compact { margin: 0 0 10px; padding: 0 2px; }
.wm-wrap.wm-compact .wm-head { flex-direction: column; align-items: flex-start; gap: 8px; padding: 8px 10px; }
.wm-wrap.wm-compact .wm-stage { height: min(58vh, 640px); }
.wm-wrap.wm-compact .wm-legend { display: none; }

/* W panelu bocznym pływający dropdown ucinał się o krawędź — tu panel
   warstw rozwija się w nurcie (pełna szerokość, spycha mapę w dół). */
.wm-wrap.wm-compact .wm-controls { width: 100%; }
.wm-wrap.wm-compact .wm-layers { display: block; flex: 1 1 auto; }
.wm-wrap.wm-compact .wm-layers__panel {
    position: static;
    width: 100%;
    min-width: 0;
    margin-top: 6px;
    box-shadow: none;
}

/* _AccountTabs.cshtml */
.acc-wrap { max-width: 980px; margin: 14px auto 28px; padding: 0 10px; color: var(--player-text); }

.acc-head {
    display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px;
    padding: 10px 14px; border: 1px solid rgba(197,163,94,.45); border-radius: 12px;
    background: var(--player-surface); margin-bottom: 10px;
}

.acc-title { color: var(--player-brass); text-shadow: 0 0 10px rgba(197,163,94,.55); font-weight: 800; letter-spacing: 2px; font-size: 1.02rem; }

.acc-tabs { display: flex; gap: 6px; flex-wrap: wrap; }

.acc-tab {
    display: inline-block; padding: 6px 14px; border-radius: 999px; text-decoration: none;
    border: 1px solid rgba(197,163,94,.35); background: rgba(0,0,0,.35);
    color: var(--player-text); font-size: .82rem; font-weight: 700;
}

.acc-tab:hover { border-color: rgba(197,163,94,.7); color: var(--player-gold); }
.acc-tab.active { border-color: var(--player-brass); color: var(--player-brass); background: rgba(197,163,94,.1); }

.acc-card {
    border: 1px solid rgba(197,163,94,.4); border-radius: 12px;
    background: var(--player-surface); padding: 14px 16px; margin-top: 10px;
}

.acc-card h4 { margin: 0 0 10px; color: var(--player-gold); font-size: .9rem; letter-spacing: 1px; }
.acc-muted { color: var(--player-muted); font-size: .8rem; }

.acc-form label { display: block; color: var(--player-muted); font-size: .74rem; margin: 10px 0 4px; letter-spacing: .5px; }
.acc-form input[type="text"], .acc-form input[type="email"], .acc-form input[type="file"] {
    width: 100%; max-width: 420px; box-sizing: border-box; background: var(--player-bg); color: var(--player-text);
    border: 1px solid rgba(197,163,94,.4); border-radius: 8px; padding: 7px 9px; font-size: .85rem;
}

.acc-btn {
    display: inline-block; margin-top: 10px; border: 1px solid rgba(197,163,94,.45);
    background: rgba(0,0,0,.35); color: var(--player-brass); border-radius: 8px; padding: 7px 14px;
    font-size: .82rem; font-weight: 700; cursor: pointer; text-decoration: none;
}

.acc-btn:hover { background: rgba(197,163,94,.12); }
.acc-btn.danger { color: #ff7a6a; border-color: rgba(255,90,90,.45); }

.acc-msg { margin-top: 10px; padding: 7px 10px; border-radius: 8px; font-size: .8rem; }
.acc-msg.ok { color: #9be89b; border: 1px solid rgba(120,220,120,.5); background: rgba(30,60,30,.35); }
.acc-msg.err { color: #ff9b9b; border: 1px solid rgba(255,90,90,.5); background: rgba(70,20,20,.35); }

.acc-avatar-big {
    width: 96px; height: 96px; border-radius: 50%; object-fit: cover;
    border: 2px solid rgba(197,163,94,.6); box-shadow: 0 0 14px rgba(197,163,94,.25);
    background: var(--player-bg);
}

.acc-table { width: 100%; border-collapse: collapse; font-size: .82rem; }
.acc-table th {
    text-align: left; color: var(--player-brass); letter-spacing: 1px; font-size: .72rem;
    padding: 6px 8px; border-bottom: 1px solid rgba(197,163,94,.35); white-space: nowrap;
}
.acc-table td { padding: 6px 8px; border-bottom: 1px solid rgba(255,255,255,.06); }
.acc-gold { color: var(--player-gold); font-weight: 700; }
.acc-on { color: var(--player-sage); font-weight: 700; }
.acc-off { color: var(--player-muted); }

/* GoldExchange.cshtml */
.gx { max-width: 560px; margin: 0 auto; padding: 14px; color: var(--player-text); font-family: "Segoe UI", system-ui, sans-serif; }
.gx-head { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 8px; }
.gx-head h2 { color: var(--player-brass); text-shadow: 0 0 10px rgba(197,163,94,.4); font-size: 1.25rem; margin: 0; }
.gx-wallet { display: flex; gap: 14px; font-size: 14px; }
.gx-wallet .w-gold b { color: var(--player-gold); }
.gx-wallet .w-silver b { color: #CFCFCF; }

.gx-rate { display: grid; grid-template-columns: 1.4fr 1fr 1fr .7fr; gap: 8px; margin-top: 12px; }
.gx-rate > div { background: rgba(0,0,0,.18); border: 1px solid rgba(255,255,255,.08); border-radius: 10px; padding: 8px 10px; }
.gx-rate .k { font-size: 10.5px; color: var(--player-muted); letter-spacing: .4px; text-transform: uppercase; }
.gx-rate .v { font-size: 17px; font-weight: 800; margin-top: 2px; }
.gx-rate .v small { font-size: 10px; color: var(--player-muted); font-weight: 400; }
.gx-rate .v.buy { color: var(--player-gold); }
.gx-rate .v.sell { color: var(--player-sage); }
.gx-per100 { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-top: 8px; font-size: 12px; color: var(--player-muted); }
.gx-per100 b { color: var(--player-text); }
.gx-per100 b.sell { color: var(--player-sage); }
.gx-per100 b.buy { color: var(--player-gold); }

.gx-sec-title { font-size: 12px; font-weight: 800; letter-spacing: .6px; text-transform: uppercase; color: var(--player-brass); margin-bottom: 6px; }
.gx-sec-title small { color: var(--player-muted); text-transform: none; font-weight: 400; }

.gx-chart-wrap { margin-top: 14px; background: rgba(0,0,0,.18); border: 1px solid rgba(255,255,255,.08); border-radius: 10px; padding: 10px; }
.gx-chart-wrap canvas { display: block; max-width: 100%; }
.gx-chart-empty { color: var(--player-muted); font-size: 12px; text-align: center; padding: 12px 0; }

.gx-forms { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 14px; }
.gx-form { background: rgba(0,0,0,.18); border: 1px solid rgba(255,255,255,.08); border-radius: 10px; padding: 10px; }
.gx-form .row { display: flex; gap: 8px; }
.gx-form input { flex: 1; min-width: 0; background: rgba(0,0,0,.4); border: 1px solid #444; color: #fff; border-radius: 8px; padding: 8px 10px; font-size: 14px; }
.gx-form input:focus { outline: none; border-color: var(--player-brass); box-shadow: 0 0 6px rgba(197,163,94,.35); }
.gx-form .est { margin-top: 6px; font-size: 11.5px; color: var(--player-muted); min-height: 15px; }
.gx-btn { border: none; border-radius: 8px; padding: 8px 16px; font-weight: 800; letter-spacing: .5px; cursor: pointer; color: #fff; }
.gx-btn.buy { background: linear-gradient(180deg, var(--player-brass), var(--player-brass)); }
.gx-btn.sell { background: linear-gradient(180deg, #7dc47d, #3f7a3f); }
.gx-btn:disabled { opacity: .5; cursor: default; }
.gx-btn:not(:disabled):hover { filter: brightness(1.12); }

/* wynik wymiany: ten sam wyglad co ag-alert z ui-gothic.css (studnia, zlota rama, akcent z lewej) */
.gx-msg { margin-top: 10px; padding: 9px 13px; border-radius: 6px; font-size: 13px; line-height: 1.45; color: #e0d3b6;
    background: var(--g-well-2, #2a1c0e); border: 1px solid var(--g-gold-dim, #8a6a2a); border-left: 4px solid var(--g-gold-mid, #c9a14a); }
.gx-msg.ok { color: #dde3b4; background: rgba(107,122,46,.16); border-color: #5d6a2a; border-left-color: #a8b25a; }
.gx-msg.err { color: #f5d0c6; background: rgba(90,31,20,.35); border-color: #8f3a2a; border-left-color: #c0503a; }

.gx-shop { margin-top: 14px; background: rgba(255,215,0,.05); border: 1px solid rgba(255,215,0,.25); border-radius: 10px; padding: 10px; }
.gx-shop__pack { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 15px; }
.gx-shop__pack b { color: var(--player-gold); }
.gx-shop__pack .price b { color: #fff; }
.gx-shop__note { margin-top: 6px; font-size: 11px; color: var(--player-muted); }

.gx-mine { margin-top: 14px; }
.gx-mine__list { display: flex; flex-direction: column; gap: 4px; }
.gx-row { display: flex; gap: 10px; align-items: center; background: rgba(0,0,0,.14); border: 1px solid rgba(255,255,255,.06); border-radius: 8px; padding: 6px 10px; font-size: 12px; }
.gx-row .t { color: var(--player-muted); min-width: 96px; }
.gx-row .what { flex: 1; }
.gx-row .what.buy { color: var(--player-gold); }
.gx-row .what.sell { color: var(--player-sage); }
.gx-row .what.grant { color: var(--player-gold); }
.gx-row .rate { color: var(--player-muted); }

@media (max-width: 520px) {
    .gx-rate { grid-template-columns: 1fr 1fr; }
    .gx-forms { grid-template-columns: 1fr; }
}

/* Shared visual language */
.exp-page, .lh-page, .wm-wrap, .acc-wrap, .gx {
    font-family: "Segoe UI", system-ui, sans-serif;
    color: var(--player-text);
    line-height: 1.5;
    scrollbar-color: var(--player-line) var(--player-bg);
}
.exp-page *, .lh-page *, .wm-wrap *, .acc-wrap *, .gx * { box-sizing: border-box; }
.player-heading { display: flex; align-items: center; gap: 12px; min-width: 0; }
.player-heading__text { min-width: 0; overflow-wrap: anywhere; }
.player-eyebrow { color: var(--player-muted); font-size: 10px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.player-icon {
    display: inline-block; width: 48px; height: 48px; flex: 0 0 48px; pointer-events: none;
    background: url("../images/ui/dock/navigation-realistic-v1.png") var(--page-icon-x, 0%) var(--page-icon-y, 0%) / 400% 200% no-repeat;
    mix-blend-mode: lighten;
}
.player-icon--experience { --page-icon-x: 33.333333%; }
.player-icon--loot { --page-icon-x: 66.666667%; }
.player-icon--market { --page-icon-x: 100%; }
.player-icon--bank { --page-icon-y: 100%; }
.player-icon--map { --page-icon-x: 66.666667%; --page-icon-y: 100%; }
.player-icon--info { --page-icon-x: 100%; --page-icon-y: 100%; }
.player-currency { width: 20px; height: 20px; object-fit: contain; vertical-align: -4px; flex: 0 0 auto; }
.exp-header, .lh-header, .wm-head, .acc-head {
    background: linear-gradient(120deg, #302a20, var(--player-surface) 70%);
    border: 1px solid var(--player-line); padding: 16px; gap: 14px;
    box-shadow: 0 8px 24px #0002, inset 0 1px #ffffff06;
    isolation: isolate;
}
.exp-title, .lh-title, .wm-title, .acc-title, .gx-head h2 {
    color: var(--player-gold); text-shadow: none; letter-spacing: .02em;
    font-family: Georgia, "Times New Roman", serif; font-size: 23px; line-height: 1.2; font-weight: 700; margin: 0;
}
.exp-subtitle, .lh-subtitle, .wm-sub { margin-top: 5px; font-size: 12px; }
.exp-card, .lh-card, .acc-card { border-color: var(--player-line); background: var(--player-surface); box-shadow: 0 6px 18px #0002; }
.exp-card { padding: 14px; }
.exp-btn, .lh-btn, .wm-btn, .acc-btn {
    background: linear-gradient(180deg, #383125, #28241d); color: var(--player-gold);
    border: 1px solid var(--player-line); min-height: 36px; box-shadow: inset 0 1px #ffffff06; font-weight: 600;
}
.exp-btn:hover, .lh-btn:hover, .wm-btn:hover, .acc-btn:hover {
    color: var(--player-gold); border-color: var(--player-brass); background: #3a3225;
}
:is(.exp-page, .lh-page, .wm-wrap, .acc-wrap, .gx, .gx-modal) :is(button, a, input, select, [tabindex]):focus-visible {
    outline: 2px solid var(--player-gold); outline-offset: 3px; box-shadow: none;
}
:is(.exp-page, .lh-page, .wm-wrap, .acc-wrap, .gx) button:disabled { cursor: not-allowed; opacity: .5; }
.exp-sec, .lh-sec, .gx-sec-title, .acc-card h4 { color: var(--player-gold); font-size: 12px; letter-spacing: .07em; }
.exp-live, .lh-live { border-color: #45584a; background: #222b24; padding: 5px 8px; }
.exp-live__dot, .lh-live__dot { animation: none; width: 6px; height: 6px; }
.exp-live__txt, .lh-live__txt { font-size: 9px; letter-spacing: .04em; }

/* Experience: room for the equipped weapon and readable milestones */
.exp-page { padding: 18px 14px; gap: 12px; container: experience / inline-size; background: var(--player-bg); }
.exp-header, .exp-card { flex-shrink: 0; }
.exp-header, .lh-header { flex-wrap: wrap; }
.exp-header__left, .lh-header__left { flex: 1 1 230px; }
.exp-header__right, .lh-header__right { flex-wrap: wrap; margin-left: auto; }
.exp-spot { border-color: #79643f; background: linear-gradient(125deg, #3a3021, #26241e); padding: 16px 14px; }
.exp-name { font-size: 15px; }
.exp-lv { font-size: 30px; margin-top: 4px; }
.exp-xp, .exp-hint, .exp-mrow { font-size: 12px; }
.exp-mrow { padding: 8px; }
.exp-tag { font-size: 9px; }
.exp-bonus { font-size: 13px; }
.exp-chip { border-radius: 10px; padding: 6px 10px 6px 6px; min-height: 40px; font-size: 12px; }
.exp-chip.on { background: #393120; }
.exp-chip .mini i, .exp-bar i, .exp-track i { background: linear-gradient(90deg, #937340, var(--player-gold)); }
.exp-ms.you { box-shadow: 0 0 0 3px #8db9a41c; }

/* Loot: consistent cards, quiet charts and touch-friendly filters */
.lh-page { background: var(--player-bg); padding: 18px 14px; gap: 12px; }
.lh-header, .lh-tabs { flex-shrink: 0; }
.lh-tab { min-height: 38px; font-size: 12px; }
.lh-tab.on, .acc-tab.active { background: #3c3323; border-color: #9f824b; color: var(--player-gold); box-shadow: inset 0 -2px #c5a35e; }
.lh-detail, .lh-stats { padding: 12px; }
.lh-kpis { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin-bottom: 10px; }
.lh-kpi { border-color: var(--player-line); padding: 10px; background: #2c281f; }
.lh-kpi .k { font-size: 10px; letter-spacing: .05em; }
.lh-kpi .v { font-size: 20px; font-variant-numeric: tabular-nums; }
.lh-day { padding: 9px 7px; font-size: 11px; }
.lh-day b { font-size: 13px; margin-bottom: 4px; }
.lh-hours { height: 60px; margin-top: 12px; }
.lh-hours span, .lh-bars span { background: #75603c; }
.lh-hours span.hi, .lh-bars span.hi { background: var(--player-brass); }
.lh-hours span.sel, .lh-bars span.today { background: var(--player-sage); box-shadow: none; }
.lh-hlbl, .lh-sub, .lh-note { font-size: 11px; }
.lh-filters { gap: 6px; margin: 12px 0; }
.lh-chip { min-height: 30px; padding: 5px 10px; font-size: 11px; }
.lh-chip select { font-size: 11px; }
.lh-sess__h { flex-wrap: wrap; padding: 10px; font-size: 12px; }
.lh-sess__h .ss { flex-wrap: wrap; font-size: 11px; }
.lh-r__main { padding: 9px 10px; min-height: 38px; }
.lh-item { white-space: normal; overflow-wrap: anywhere; font-size: 11px; padding: 3px 6px; }
.lh-item img { width: 20px; height: 20px; }
.lh-tbl { font-size: 12px; }
.lh-tbl td { padding: 8px 4px; }
@container lh (max-width: 620px) {
    .lh-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .lh-r__main { flex-wrap: wrap; gap: 6px; }
    .lh-r .r-enemy { flex-basis: calc(100% - 50px); }
}
@container lh (max-width: 360px) {
    .lh-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .lh-r__det { padding: 10px; }
    .lh-sess__h .ss { width: 100%; margin-left: 0; }
}
@container experience (max-width: 360px) {
    .exp-spot { gap: 10px; padding: 12px 8px; }
    .exp-ring { width: 70px; height: 70px; }
    .exp-ring svg { width: 70px; height: 70px; }
    .exp-name { white-space: normal; }
    .exp-tag { margin-left: 0; }
}

/* World map: sober chrome; marker colours retain their gameplay meaning. */
.wm-wrap { padding: 0 14px; }
.wm-head { align-items: center; }
.wm-title { font-size: 24px; }
.wm-btn, .wm-mapsel { min-height: 36px; }
.wm-stage { border-color: var(--player-line); background: var(--player-bg); }
.wm-legend { max-width: min(390px, 65%); padding: 10px 14px; border-color: var(--player-line); }
.wm-coords, .wm-layers__panel, .wm-tooltip { border-color: var(--player-line); background: #24211bf5; }
.wm-layer-row { padding: 8px; }
.wm-note { border-color: var(--player-line); }
.wm-zoom .wm-btn { width: 38px; height: 38px; }
.wm-wrap.wm-compact .wm-head { padding: 14px; }
.wm-wrap.wm-compact .wm-title { font-size: 22px; }
.wm-wrap.wm-compact .wm-controls { align-items: flex-start; }
.wm-wrap.wm-compact .wm-layers { flex-basis: 150px; }
.wm-tooltip { max-width: min(300px, calc(100vw - 24px)); min-width: min(200px, calc(100vw - 24px)); }

/* Account: shared page header, profile summary, forms and tables */
.acc-wrap { max-width: 1080px; padding: 0 18px; margin: 24px auto 36px; }
.acc-wrap .acc-head { padding: 18px 20px; margin-bottom: 18px; }
.acc-card { padding: 22px; margin-top: 16px; }
.acc-title { font-size: 28px; margin-top: 3px; }
.acc-tabs { gap: 6px; }
.acc-tab { border-radius: 8px; padding: 9px 13px; background: #1f1d18; border-color: var(--player-line); font-weight: 600; }
.acc-card h4 { margin-bottom: 16px; }
.acc-muted { font-size: 13px; overflow-wrap: anywhere; }
.acc-profile, .acc-avatar-editor { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.acc-profile__info { flex: 1 1 240px; min-width: 0; }
.acc-profile__name { font-size: 24px; font-weight: 700; color: var(--player-gold); overflow-wrap: anywhere; }
.acc-summary { display: flex; flex-wrap: wrap; gap: 10px 18px; margin-top: 12px; }
.acc-summary > span { padding: 7px 10px; border: 1px solid var(--player-line); border-radius: 8px; background: var(--player-bg); }
.acc-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-left: auto; }
.acc-avatar-big { flex: 0 0 auto; width: 88px; height: 88px; border-color: #957c4b; box-shadow: 0 0 0 5px #c5a35e0b; }
.acc-avatar-editor__form { flex: 1 1 240px; min-width: 0; }
.acc-form label { font-size: 13px; letter-spacing: 0; line-height: 1.6; }
.acc-form input[type="text"], .acc-form input[type="email"], .acc-form input[type="file"] { min-height: 42px; border-color: var(--player-line); padding: 10px 12px; max-width: 100%; }
.acc-form input[type="file"] { padding: 6px; font-size: 12px; }
.acc-form input::file-selector-button { background: #393123; color: var(--player-gold); border: 1px solid #806a42; border-radius: 5px; padding: 6px 10px; margin-right: 10px; cursor: pointer; }
.acc-btn { padding: 9px 14px; }
.acc-btn.danger { color: var(--player-red); border-color: #885c50; }
.acc-msg { padding: 12px 16px; }
.acc-msg.ok { color: #c8decf; border-color: #546b56; background: #253128; }
.acc-msg.err { color: #f1c2b6; border-color: #875346; background: #37231e; }
.acc-table-scroll { max-width: 100%; overflow-x: auto; border: 1px solid #49402f; border-radius: 10px; scrollbar-color: var(--player-line) var(--player-bg); }
.acc-table { font-size: 13px; margin: 0; font-variant-numeric: tabular-nums; }
.acc-table th { padding: 12px 14px; font-size: 10px; background: #1d1c17; color: var(--player-muted); border-color: var(--player-line); letter-spacing: .06em; }
.acc-table td { padding: 13px 14px; white-space: nowrap; }
.acc-table tbody tr:nth-child(even) { background: #ffffff02; }
.acc-table tbody tr:hover { background: #c5a35e08; }
.acc-on, .acc-off { display: inline-block; border-radius: 5px; padding: 2px 7px; font-size: 10px; letter-spacing: .04em; background: #1c1b17; }
.acc-on { background: #26342a; }
.acc-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.acc-metric { border: 1px solid var(--player-line); border-radius: 12px; padding: 20px; background: linear-gradient(145deg, #30291f, var(--player-surface)); isolation: isolate; }
.acc-metric .player-icon { width: 42px; height: 42px; margin-bottom: 8px; }
.acc-metric__value { color: var(--player-gold); font-size: 30px; font-weight: 700; line-height: 1.3; margin-top: 6px; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.acc-help { text-align: center; padding: 56px 24px; isolation: isolate; }
.acc-help > .player-icon { width: 96px; height: 96px; margin: 0 auto 18px; }
.acc-help h4 { font-size: 24px; font-family: Georgia, serif; letter-spacing: 0; margin: 10px 0; }

/* Exchange: same wallet icons, brass buy and sage sell, responsive dialog. */
.gx { max-width: 780px; margin: 18px auto; padding: 24px; background: var(--player-bg); border: 1px solid var(--player-line); border-radius: 14px; container: exchange / inline-size; }
.gx-head { align-items: center; gap: 14px; isolation: isolate; }
.gx-head h2 { font-size: 25px; }
.gx-wallet { flex-wrap: wrap; gap: 8px; }
.gx-wallet > span { display: inline-flex; align-items: center; gap: 5px; padding: 7px 10px; border: 1px solid var(--player-line); border-radius: 8px; background: var(--player-surface); font-size: 12px; }
.gx-rate { gap: 10px; margin-top: 20px; }
.gx-rate > div, .gx-chart-wrap, .gx-form { background: var(--player-surface); border-color: var(--player-line); }
.gx-rate > div { padding: 12px; min-width: 0; }
.gx-rate .k { font-size: 10px; line-height: 1.5; }
.gx-rate .v { font-size: 22px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.gx-rate .v small { display: block; font-size: 11px; }
.gx-rate__mid { border-color: #927746 !important; background: linear-gradient(135deg, #393020, #28241d) !important; }
.gx-per100 { gap: 6px 16px; margin-top: 12px; color: var(--player-muted); }
.gx-chart-wrap { margin-top: 20px; padding: 12px 10px; }
.gx-chart-wrap .gx-sec-title { padding: 0 4px; margin-bottom: 12px; }
.gx-sec-title small { font-size: 11px; letter-spacing: 0; }
.gx-form { padding: 16px; min-width: 0; }
.gx-form .row { margin: 12px 0 0; flex-wrap: nowrap; }
.gx-form .row > * { width: auto; padding-left: 10px; padding-right: 10px; margin-top: 0; }
.gx-form input { width: 0; border-color: var(--player-line); background: var(--player-bg); color: var(--player-text); min-height: 42px; }
.gx-btn { min-height: 42px; font-size: 11px; letter-spacing: .06em; border: 1px solid transparent; flex: 0 0 auto; }
.gx-btn.buy { color: #241c10; background: linear-gradient(180deg, #dcc18a, #b9995d); border-color: #dcc18a; }
.gx-btn.sell { color: #14251e; background: linear-gradient(180deg, #a2c5b4, #7fa58f); border-color: #a2c5b4; }
.gx-form .est { margin-top: 10px; font-size: 12px; }
.gx-msg { background: var(--player-surface); border-color: var(--player-line); border-left-color: var(--player-brass); color: var(--player-text); }
.gx-msg.ok { background: #253128; border-color: #536c55; border-left-color: var(--player-sage); color: #c8decf; }
.gx-msg.err { background: #37231e; border-color: #875346; border-left-color: var(--player-red); color: #f1c2b6; }
.gx-shop { background: #2b281e; border-color: #625338; padding: 16px; }
.gx-shop__pack { flex-wrap: wrap; }
.gx-shop__note { font-size: 12px; line-height: 1.6; margin-top: 10px; }
.gx-mine { margin-top: 22px; }
.gx-row { background: var(--player-surface); border-color: #423b2c; padding: 10px 12px; flex-wrap: wrap; gap: 6px 12px; }
.gx-row .t { font-size: 10px; }
.gx-row .what { flex: 1 1 180px; }
.gx-row .rate { font-size: 11px; }
.gx-modal { padding: 18px; }
.gx-modal__dialog { width: min(800px, 100%); max-height: calc(100dvh - 36px); background: var(--player-bg); border-color: #806a42; border-radius: 16px; box-shadow: 0 20px 80px #0009; scrollbar-color: var(--player-line) var(--player-bg); }
.gx-modal__close { width: 34px; height: 34px; border-color: var(--player-line); color: var(--player-muted); background: var(--player-surface); top: 14px; right: 14px; }
.gx-modal__close:hover { border-color: var(--player-brass); color: var(--player-gold); }
.gx-modal .gx { margin: 0; max-width: none; border: 0; border-radius: 0; }
@container exchange (max-width: 500px) {
    .gx-rate { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .gx-forms { grid-template-columns: 1fr; }
    .gx-per100 { flex-direction: column; }
}
@media (max-width: 600px) {
    .acc-wrap { padding: 0 10px; margin-top: 14px; }
    .acc-wrap .acc-head, .acc-card { padding: 16px; }
    .acc-head .player-heading { width: 100%; }
    .acc-tabs { width: 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .acc-tab { text-align: center; padding: 10px 6px; }
    .acc-profile, .acc-avatar-editor { gap: 16px; }
    .acc-profile__info { flex-basis: 100%; }
    .acc-actions { margin-left: 0; }
    .acc-summary { gap: 8px; }
    .acc-metrics { grid-template-columns: 1fr; gap: 10px; }
    .acc-metric { padding: 16px; }
    .acc-metric .player-icon { float: right; margin: 0 0 0 12px; }
    .acc-metric__value { font-size: 28px; }
    .gx { padding: 16px; margin: 10px; }
    .gx-modal { padding: 10px; }
    .gx-modal__dialog { max-height: calc(100dvh - 20px); }
    .gx-modal .gx-head { padding-right: 30px; }
    .gx-head h2 { font-size: 22px; }
    .gx-head .player-icon { width: 40px; height: 40px; flex-basis: 40px; }
    .gx-wallet { gap: 6px; }
    .gx-wallet > span { padding: 6px 8px; }
    .wm-wrap { padding: 0 10px; }
    .wm-legend { font-size: 10px; max-width: 58%; padding: 8px; line-height: 1.45; max-height: 48%; overflow-y: auto; pointer-events: auto; }
    .wm-controls { width: 100%; align-items: flex-start; }
    .wm-layers { flex: 1 1 150px; }
    .wm-layers__panel { position: static; min-width: 0; margin-top: 6px; }
}
@media (prefers-reduced-motion: reduce) {
    .exp-page *, .lh-page *, .wm-wrap *, .acc-wrap *, .gx-modal, .gx-modal * { animation: none !important; transition: none !important; }
}

.lh-currency { width: 14px; height: 14px; object-fit: contain; vertical-align: -3px; }

.acc-avatar { position: relative; display: inline-flex; flex: 0 0 auto; isolation: isolate; background: var(--player-bg); border-radius: 50%; }
.acc-avatar-default { display: none; position: absolute; inset: 6px; width: 76px; height: 76px; }
.acc-avatar:has(img[src$="/avatar_default.svg"]) .acc-avatar-big { opacity: 0; }
.acc-avatar:has(img[src$="/avatar_default.svg"]) { box-shadow: inset 0 0 0 1px #957c4b, 0 0 0 5px #c5a35e0b; }
.acc-avatar:has(img[src$="/avatar_default.svg"]) .acc-avatar-default { display: block; }

:is(.exp-page, .lh-page, .wm-wrap, .acc-wrap, .gx) :is(h1, h2, h3, h4) { text-shadow: none; }
.acc-avatar-default { border-radius: 50%; }

@container experience (max-width: 520px) {
    .exp-header__left { flex-basis: 100%; }
    .exp-title { font-size: 22px; overflow-wrap: normal; }
    .exp-header .player-icon { width: 40px; height: 40px; flex-basis: 40px; }
}
@container experience (max-width: 360px) {
    .exp-mrow { flex-wrap: wrap; }
    .exp-mrow .l { white-space: normal; overflow: visible; }
}
@container lh (max-width: 360px) {
    .lh-header__left { flex-basis: 100%; }
    .lh-title { font-size: 22px; overflow-wrap: normal; }
    .lh-header .player-icon { width: 40px; height: 40px; flex-basis: 40px; }
}