/*
 * Kor Diyarı — MMORPG Panelleri, Kompakt Dünya Boss Barı, 52×52 Kare İkon Izgaraları &
 * 2 Katmanlı [M] Dünya + Etiketli Bölge İç Haritası Stilleri (mmoStyles.css)
 * Kart: CE2-50 · KD-UI-MAP-MMO-05 · Sprint: SPRINT-KOR-DIYARI-UI-KIMLIK
 *
 * Tasarım İlkeleri & Murat'ın Sade Ekran Kuralı:
 *   - En küçük metin boyutu >= 13px (hiçbir seçicide 13px altı yazı yok)
 *   - "Kor & Obsidyen" tasarım dili (--kd-bg-obsidian, --kd-bronze-*, --kd-ember-*)
 *   - Pazar / Takas / 32'lik Lonca Kasası yuvaları 52×52px kare ikon standardı + kd-tooltip
 *   - 2 Katmanlı [M] Dünya Haritası (Kıta Topolojisi + Etiketli Bölge İç Haritası & Tıkla-Yürü)
 *   - 1440×900 ve 1280×720 çözünürlüklerde sıfır taşma ve sıfır üst üste binme
 */

.mmo-ui-root {
  position: fixed;
  inset: 0;
  z-index: 26;
  pointer-events: none;
  font-family: var(--kd-font-ui, "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
  font-size: 14px;
  line-height: 1.4;
  color: var(--kd-text-ivory, #f7f2e8);
}

.mmo-ui-root [hidden],
.world-map-backdrop[hidden],
.world-map-backdrop [hidden] {
  display: none !important;
}

.mmo-ui-root *,
.mmo-ui-root *::before,
.mmo-ui-root *::after,
.world-map-backdrop *,
.world-map-backdrop *::before,
.world-map-backdrop *::after {
  box-sizing: border-box;
}

/* ============================================================================
 * 1) HIZLI ERİŞİM ROZET ÇUBUĞU (Yalnız showDock: true ise aktif)
 * ============================================================================ */

.mmo-dock-bar {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 27;
  pointer-events: auto;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  padding: 8px 12px;
  border-radius: var(--kd-radius-md, 8px);
  background: var(--kd-bg-obsidian-glass, rgba(18, 16, 23, 0.92));
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1.5px solid var(--kd-bronze-base, #946f47);
  box-shadow: var(--kd-shadow-window, 0 18px 44px rgba(0, 0, 0, 0.78));
}

.mmo-dock-btn {
  min-height: 36px;
  padding: 6px 12px;
  border-radius: var(--kd-radius-sm, 6px);
  border: 1px solid var(--kd-bronze-muted, #6b5035);
  background: var(--kd-bg-basalt, #1a1721);
  color: var(--kd-text-ivory, #f7f2e8);
  font-family: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  white-space: nowrap;
  transition: border-color 130ms ease, background 130ms ease;
}

.mmo-dock-btn:hover:not(:disabled) {
  border-color: var(--kd-bronze-highlight, #f3d299);
  background: var(--kd-bg-slate, #24202e);
}

.mmo-dock-btn.is-active {
  border-color: var(--kd-ember-gold, #fbbf24);
  background: linear-gradient(180deg, #7c2d12 0%, #431407 100%);
  color: var(--kd-text-gold, #fde68a);
}

.mmo-dock-badge {
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(245, 158, 11, 0.25);
  border: 1px solid var(--kd-ember-gold, #fbbf24);
  color: var(--kd-text-gold, #fde68a);
  font-size: 13px;
  font-weight: 800;
}

/* ============================================================================
 * 2) ÜST-ORTA KOMPAKT DÜNYA BOSS (KOR TİTANI IGNIS) & SINIR PVP BARI
 *    (Yalnızca "borderlands" bölgesindeyken veya kişisel ödül sandığı varken görünür)
 * ============================================================================ */

.mmo-top-hud-stack {
  position: fixed;
  top: 14px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 27;
  width: min(560px, calc(100vw - 48px));
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  pointer-events: none;
}

.mmo-pvp-strip {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  pointer-events: none;
}

.mmo-pvp-pill {
  pointer-events: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 32px;
  padding: 4px 13px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
  background: var(--kd-bg-obsidian-glass, rgba(18, 16, 23, 0.92));
  border: 1px solid var(--kd-bronze-base, #946f47);
  color: var(--kd-text-ivory, #f7f2e8);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.56);
}

.mmo-pvp-pill[data-pvp-state="borderlands"] {
  background: rgba(68, 16, 22, 0.94);
  border-color: rgba(248, 113, 113, 0.82);
  color: #fecaca;
}

.mmo-pvp-pill[data-pvp-state="duel"] {
  background: rgba(72, 40, 12, 0.94);
  border-color: var(--kd-ember-gold, #fbbf24);
  color: var(--kd-text-gold, #fde68a);
}

.mmo-duel-countdown-banner {
  align-self: center;
  padding: 8px 22px;
  border-radius: var(--kd-radius-md, 8px);
  background: linear-gradient(135deg, rgba(88, 28, 18, 0.96) 0%, rgba(36, 16, 14, 0.96) 100%);
  border: 2px solid var(--kd-ember-gold, #fbbf24);
  box-shadow: 0 0 24px rgba(245, 158, 11, 0.42), 0 12px 28px rgba(0, 0, 0, 0.68);
  color: #fef08a;
  font-size: 22px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-align: center;
}

.mmo-invite-toast {
  pointer-events: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  padding: 10px 14px;
  border-radius: var(--kd-radius-md, 8px);
  background: var(--kd-bg-obsidian, #121017);
  border: 1.5px solid var(--kd-ember-gold, #fbbf24);
  box-shadow: var(--kd-shadow-window, 0 18px 44px rgba(0, 0, 0, 0.8));
}

.mmo-invite-text {
  font-size: 14px;
  font-weight: 700;
  color: var(--kd-text-gold, #fde68a);
}

.mmo-invite-actions {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

/* Kompakt Kor Titanı Ignis Barı */
.mmo-worldboss-card {
  pointer-events: auto;
  padding: 9px 14px;
  border-radius: var(--kd-radius-md, 8px);
  background: linear-gradient(180deg, rgba(44, 17, 18, 0.95) 0%, rgba(18, 16, 23, 0.96) 100%);
  border: 1.5px solid rgba(251, 146, 60, 0.82);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.72), inset 0 1px 0 rgba(254, 215, 170, 0.16);
}

.mmo-worldboss-card[data-boss-mode="chest"] {
  border-color: var(--kd-ember-gold, #fbbf24);
  background: linear-gradient(180deg, rgba(58, 36, 12, 0.95) 0%, rgba(18, 16, 23, 0.96) 100%);
}

.mmo-worldboss-inner {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.mmo-worldboss-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
}

.mmo-worldboss-identity {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.mmo-boss-portrait {
  width: 38px;
  height: 38px;
  border-radius: var(--kd-radius-sm, 6px);
  background-color: #0d0b11;
  border: 1px solid var(--kd-ember-gold, #fbbf24);
  background-image: url("../../assets/sprites/boss_ignis.png");
  background-size: 304px 114px;
  background-position: 0 0;
  background-repeat: no-repeat;
  image-rendering: pixelated;
  flex-shrink: 0;
}

.mmo-boss-portrait[data-phase="2"],
.mmo-boss-portrait[data-phase="3"] {
  background-image: url("../../assets/sprites/boss_ignis_phase2.png");
  border-color: #fde047;
  box-shadow: 0 0 12px rgba(251, 146, 60, 0.55);
}

.mmo-boss-title-wrap {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.mmo-boss-name {
  font-family: var(--kd-font-display, Georgia, serif);
  font-size: 15px;
  font-weight: 800;
  color: #ffedd5;
}

.mmo-boss-sub {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  font-size: 13px;
  font-weight: 700;
  color: #fed7aa;
}

.mmo-boss-phase-pill {
  padding: 1px 8px;
  border-radius: 999px;
  background: rgba(234, 88, 12, 0.34);
  border: 1px solid rgba(251, 146, 60, 0.72);
  color: #ffedd5;
  font-size: 13px;
  font-weight: 800;
}

.mmo-boss-telegraph-pill {
  padding: 1px 9px;
  border-radius: 999px;
  background: rgba(185, 28, 28, 0.55);
  border: 1px solid #fca5a5;
  color: #fef2f2;
  font-size: 13px;
  font-weight: 800;
}

.mmo-boss-hp-track {
  position: relative;
  height: 19px;
  border-radius: 6px;
  background: #09080d;
  border: 1px solid rgba(251, 146, 60, 0.52);
  overflow: hidden;
}

.mmo-boss-hp-fill {
  height: 100%;
  background: linear-gradient(90deg, #b91c1c 0%, #ea580c 58%, #f59e0b 100%);
  transition: width 150ms ease-out;
}

.mmo-boss-hp-label {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px;
  font-size: 13px;
  font-weight: 800;
  color: #ffffff;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.92);
}

.mmo-boss-contrib-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
}

.mmo-my-contrib-pill {
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
  background: rgba(16, 185, 129, 0.22);
  border: 1px solid rgba(52, 211, 153, 0.68);
  color: #a7f3d0;
}

.mmo-my-contrib-pill[data-eligible="false"] {
  background: rgba(245, 158, 11, 0.2);
  border-color: rgba(251, 191, 36, 0.62);
  color: #fde68a;
}

.mmo-boss-top-ranks {
  font-size: 13px;
  font-weight: 700;
  color: var(--kd-text-sand, #d7cbb8);
}

/* ============================================================================
 * 3) ORTAK MODAL PENCERE İSKELETİ — KOR & OBSİDYEN (Takas · Pazar · Lonca)
 * ============================================================================ */

.mmo-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: var(--kd-z-modal-backdrop, 400);
  pointer-events: auto;
  background: var(--kd-backdrop-veil, rgba(7, 6, 11, 0.84));
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.mmo-modal-window {
  width: min(940px, calc(100vw - 40px));
  max-height: min(830px, calc(100vh - 40px));
  border-radius: var(--kd-radius-lg, 12px);
  background: var(--kd-bg-obsidian, #121017);
  border: 2px solid var(--kd-bronze-base, #946f47);
  box-shadow:
    inset 0 0 0 1px rgba(243, 210, 153, 0.14),
    var(--kd-shadow-window, 0 24px 64px rgba(0, 0, 0, 0.85));
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.mmo-modal-window.is-scam-warning {
  border-color: #fbbf24;
  box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.44), 0 24px 64px rgba(0, 0, 0, 0.85);
  animation: mmoScamPulse 1.3s ease-in-out infinite;
}

@keyframes mmoScamPulse {
  0%,
  100% {
    box-shadow: 0 0 0 2px rgba(251, 191, 36, 0.35), 0 24px 64px rgba(0, 0, 0, 0.85);
  }
  50% {
    box-shadow: 0 0 0 6px rgba(251, 191, 36, 0.68), 0 24px 64px rgba(0, 0, 0, 0.85);
  }
}

.mmo-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  padding: 14px 20px;
  border-bottom: 1px solid var(--kd-bronze-muted, #6b5035);
  background: linear-gradient(180deg, rgba(36, 32, 46, 0.94) 0%, rgba(18, 16, 23, 0.96) 100%);
  flex-shrink: 0;
}

.mmo-modal-title-group {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.mmo-modal-title {
  margin: 0;
  font-family: var(--kd-font-display, Georgia, serif);
  font-size: 19px;
  font-weight: 800;
  color: var(--kd-bronze-highlight, #f3d299);
}

.mmo-modal-subtitle {
  font-size: 13px;
  font-weight: 700;
  color: var(--kd-text-sand, #d7cbb8);
}

.mmo-close-btn {
  min-height: 34px;
  padding: 6px 13px;
  border-radius: var(--kd-radius-sm, 6px);
  border: 1px solid var(--kd-bronze-base, #946f47);
  background: var(--kd-bg-basalt, #1a1721);
  color: var(--kd-text-ivory, #f7f2e8);
  font-family: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  transition: border-color 120ms ease, background 120ms ease;
}

.mmo-close-btn:hover {
  border-color: var(--kd-ember-coral, #f87171);
  background: rgba(88, 22, 30, 0.88);
  color: #fecaca;
}

.mmo-modal-body {
  padding: 16px 20px;
  overflow-y: auto;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.mmo-modal-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  padding: 11px 20px;
  border-top: 1px solid var(--kd-bronze-dim, #4a3825);
  background: rgba(13, 11, 17, 0.94);
  flex-shrink: 0;
}

/* Durum / Hata / Scam Uyarı Bantları */
.mmo-banner {
  padding: 10px 14px;
  border-radius: var(--kd-radius-md, 8px);
  font-size: 14px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.mmo-banner[data-tone="warning"] {
  background: rgba(120, 53, 15, 0.92);
  border: 1.5px solid #fbbf24;
  color: #fef08a;
}

.mmo-banner[data-tone="error"] {
  background: rgba(88, 20, 28, 0.92);
  border: 1.5px solid #f87171;
  color: #fecaca;
}

.mmo-banner[data-tone="success"] {
  background: rgba(12, 68, 52, 0.92);
  border: 1.5px solid #34d399;
  color: #a7f3d0;
}

.mmo-banner[data-tone="info"] {
  background: var(--kd-bg-basalt, #1a1721);
  border: 1px solid var(--kd-bronze-muted, #6b5035);
  color: var(--kd-text-ivory, #f7f2e8);
}

/* Ortak Düğme, Girdi ve Sekme Bileşenleri */
.mmo-tabs-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.mmo-tab-btn {
  min-height: 36px;
  padding: 7px 15px;
  border-radius: var(--kd-radius-sm, 6px);
  border: 1px solid var(--kd-bronze-muted, #6b5035);
  background: var(--kd-bg-socket, #0d0b11);
  color: var(--kd-text-sand, #d7cbb8);
  font-family: inherit;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
  transition: border-color 120ms ease, background 120ms ease, color 120ms ease;
}

.mmo-tab-btn:hover {
  border-color: var(--kd-bronze-bright, #cfa060);
  color: var(--kd-text-ivory, #f7f2e8);
}

.mmo-tab-btn.is-active {
  background: linear-gradient(180deg, #9a3412 0%, #5c1d0c 100%);
  border-color: var(--kd-ember-gold, #fbbf24);
  color: #fff7ed;
}

.mmo-btn {
  min-height: 36px;
  padding: 7px 14px;
  border-radius: var(--kd-radius-sm, 6px);
  border: 1px solid var(--kd-bronze-base, #946f47);
  background: var(--kd-bg-slate, #24202e);
  color: var(--kd-text-ivory, #f7f2e8);
  font-family: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  white-space: nowrap;
  transition: filter 120ms ease, border-color 120ms ease;
}

.mmo-btn:hover:not(:disabled) {
  filter: brightness(1.1);
  border-color: var(--kd-bronze-highlight, #f3d299);
}

.mmo-btn:focus-visible,
.mmo-input:focus-visible,
.mmo-select:focus-visible,
.mmo-tab-btn:focus-visible,
.mmo-dock-btn:focus-visible,
.mmo-close-btn:focus-visible,
.mmo-square-slot:focus-visible {
  outline: 2px solid var(--kd-ember-gold, #fbbf24);
  outline-offset: 2px;
}

.mmo-btn:disabled {
  background: rgba(30, 32, 42, 0.58);
  border-color: rgba(148, 163, 184, 0.24);
  color: rgba(203, 213, 225, 0.55);
  cursor: not-allowed;
}

.mmo-btn-primary {
  background: linear-gradient(180deg, #c2410c 0%, #9a3412 100%);
  border-color: var(--kd-ember-gold, #fbbf24);
  color: #fff7ed;
}

.mmo-btn-amber {
  background: linear-gradient(180deg, #b45309 0%, #78350f 100%);
  border-color: #fcd34d;
  color: #fffbeb;
}

.mmo-btn-danger {
  background: rgba(82, 20, 30, 0.88);
  border-color: rgba(248, 113, 113, 0.64);
  color: #fecaca;
}

.mmo-input,
.mmo-select {
  min-height: 36px;
  min-width: 0;
  max-width: 100%;
  padding: 6px 11px;
  border-radius: var(--kd-radius-sm, 6px);
  border: 1px solid var(--kd-bronze-muted, #6b5035);
  background: var(--kd-bg-socket, #0d0b11);
  color: var(--kd-text-ivory, #f7f2e8);
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  user-select: text;
}

.mmo-field-label {
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 5px;
  font-size: 13px;
  font-weight: 700;
  color: var(--kd-text-sand, #d7cbb8);
}

.mmo-field-label > .mmo-input,
.mmo-field-label > .mmo-select {
  width: 100%;
}

/* ============================================================================
 * 4) 52×52 KARE İKON YUVALARI (Pazar Çantası · Takas · 32'lik Lonca Kasası)
 * ============================================================================ */

.mmo-square-slot {
  position: relative;
  width: 52px;
  height: 52px;
  min-width: 52px;
  min-height: 52px;
  padding: 0;
  border-radius: var(--kd-radius-sm, 6px);
  background: var(--kd-bg-socket, #0d0b11);
  border: 1.5px solid var(--kd-bronze-dim, #4a3825);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--kd-text-ivory, #f7f2e8);
  font-family: inherit;
  flex-shrink: 0;
  transition: transform 110ms ease, border-color 120ms ease, box-shadow 120ms ease;
}

.mmo-square-slot.is-empty {
  border-style: dashed;
  border-color: rgba(148, 111, 71, 0.34);
  background: rgba(13, 11, 17, 0.72);
}

.mmo-square-slot.is-interactive {
  cursor: pointer;
}

.mmo-square-slot.is-interactive:hover {
  transform: translateY(-1px);
  border-color: var(--kd-bronze-highlight, #f3d299);
}

.mmo-square-slot[data-rarity="common"] {
  border-color: rgba(168, 162, 158, 0.65);
  background: radial-gradient(circle at 50% 42%, rgba(168, 162, 158, 0.14), #0d0b11 76%);
}

.mmo-square-slot[data-rarity="rare"] {
  border-color: var(--kd-rarity-rare, #38bdf8);
  background: radial-gradient(circle at 50% 42%, rgba(56, 189, 248, 0.2), #0d0b11 76%);
}

.mmo-square-slot[data-rarity="epic"] {
  border-color: var(--kd-rarity-epic, #c084fc);
  background: radial-gradient(circle at 50% 42%, rgba(192, 132, 252, 0.24), #0d0b11 76%);
}

.mmo-square-slot[data-rarity="legendary"] {
  border-color: var(--kd-rarity-legendary, #f59e0b);
  background: radial-gradient(circle at 50% 42%, rgba(245, 158, 11, 0.28), #0d0b11 76%);
  box-shadow: 0 0 12px rgba(245, 158, 11, 0.22);
}

.mmo-square-slot.is-selected {
  box-shadow: 0 0 0 2px var(--kd-ember-gold, #fbbf24), 0 0 14px rgba(251, 191, 36, 0.38);
}

.mmo-item-sprite {
  width: 40px;
  height: 40px;
  background-image: url("../../assets/ui/icons_atlas.png");
  background-size: 160px 480px;
  background-repeat: no-repeat;
  image-rendering: pixelated;
  pointer-events: none;
}

.mmo-square-slot .slot-plus {
  position: absolute;
  top: 2px;
  left: 3px;
  padding: 0 4px;
  border-radius: 4px;
  background: rgba(13, 11, 17, 0.88);
  color: var(--kd-text-gold, #fde68a);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.15;
  pointer-events: none;
}

.mmo-square-slot .slot-qty,
.mmo-square-slot .slot-selected-mark {
  position: absolute;
  bottom: 2px;
  right: 3px;
  padding: 0 4px;
  border-radius: 4px;
  background: rgba(13, 11, 17, 0.9);
  color: #ffffff;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.15;
  pointer-events: none;
}

.mmo-square-slot .slot-selected-mark {
  background: rgba(217, 119, 6, 0.92);
  color: #fffbeb;
}

.mmo-slot-index-tag {
  font-size: 13px;
  font-weight: 700;
  color: rgba(215, 203, 184, 0.42);
  pointer-events: none;
}

.mmo-square-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, 52px);
  gap: 8px;
  justify-content: start;
}

/* ============================================================================
 * 5) ÇİFT KİLİTLİ GÜVENLİ TAKAS PENCERESİ
 * ============================================================================ */

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

.mmo-trade-side {
  padding: 13px;
  border-radius: var(--kd-radius-md, 8px);
  background: var(--kd-bg-basalt, #1a1721);
  border: 1.5px solid var(--kd-bronze-dim, #4a3825);
  display: flex;
  flex-direction: column;
  gap: 11px;
}

.mmo-trade-side[data-stage="locked"] {
  border-color: var(--kd-ember-gold, #fbbf24);
}

.mmo-trade-side[data-stage="confirmed"] {
  border-color: #34d399;
  background: rgba(16, 40, 34, 0.88);
}

.mmo-trade-side-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
}

.mmo-trade-player-title {
  font-size: 15px;
  font-weight: 800;
  color: var(--kd-text-ivory, #f7f2e8);
}

.mmo-trade-state-pill {
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
  background: var(--kd-bg-socket, #0d0b11);
  border: 1px solid var(--kd-bronze-muted, #6b5035);
  color: var(--kd-text-sand, #d7cbb8);
}

.mmo-trade-state-pill[data-stage="locked"] {
  background: rgba(245, 158, 11, 0.22);
  border-color: #fbbf24;
  color: #fef08a;
}

.mmo-trade-state-pill[data-stage="confirmed"] {
  background: rgba(16, 185, 129, 0.24);
  border-color: #34d399;
  color: #a7f3d0;
}

.mmo-offer-slots-grid {
  display: grid;
  grid-template-columns: repeat(6, 52px);
  gap: 8px;
  justify-content: start;
}

.mmo-item-meta {
  font-size: 13px;
  font-weight: 700;
  color: var(--kd-text-sand, #d7cbb8);
}

.mmo-trade-gold-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  padding: 9px 12px;
  border-radius: var(--kd-radius-sm, 6px);
  background: var(--kd-bg-socket, #0d0b11);
  border: 1px solid rgba(251, 191, 36, 0.36);
}

.mmo-gold-amount {
  font-size: 15px;
  font-weight: 900;
  color: var(--kd-text-gold, #fde68a);
}

.mmo-bag-picker-section {
  padding: 12px 14px;
  border-radius: var(--kd-radius-md, 8px);
  background: var(--kd-bg-basalt, #1a1721);
  border: 1px solid var(--kd-bronze-dim, #4a3825);
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.mmo-section-title {
  margin: 0;
  font-family: var(--kd-font-display, Georgia, serif);
  font-size: 15px;
  font-weight: 800;
  color: var(--kd-bronze-highlight, #f3d299);
}

.mmo-bag-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, 52px);
  gap: 8px;
}

/* ============================================================================
 * 6) KASABA PAZAR VİTRİNİ ([B])
 * ============================================================================ */

.mmo-market-filter-bar {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  align-items: end;
  padding: 12px 14px;
  border-radius: var(--kd-radius-md, 8px);
  background: var(--kd-bg-basalt, #1a1721);
  border: 1px solid var(--kd-bronze-dim, #4a3825);
}

.mmo-market-listings {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(276px, 1fr));
  gap: 12px;
}

.mmo-listing-card {
  padding: 12px;
  border-radius: var(--kd-radius-md, 8px);
  background: var(--kd-bg-basalt, #1a1721);
  border: 1.5px solid var(--kd-bronze-dim, #4a3825);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 10px;
  transition: border-color 120ms ease, background 120ms ease, transform 110ms ease;
}

.mmo-listing-card:hover {
  border-color: var(--kd-bronze-bright, #cfa060);
  background: var(--kd-bg-slate, #24202e);
  transform: translateY(-1px);
}

.mmo-listing-card[data-rarity="rare"] {
  border-color: rgba(56, 189, 248, 0.58);
}

.mmo-listing-card[data-rarity="epic"] {
  border-color: rgba(192, 132, 252, 0.64);
}

.mmo-listing-card[data-rarity="legendary"] {
  border-color: rgba(245, 158, 11, 0.78);
}

.mmo-listing-head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  min-width: 0;
}

.mmo-listing-top {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.mmo-listing-title {
  font-size: 15px;
  font-weight: 800;
  color: var(--kd-text-ivory, #f7f2e8);
  word-break: break-word;
}

.mmo-listing-seller {
  font-size: 13px;
  font-weight: 700;
  color: var(--kd-text-ash, #a89b88);
}

.mmo-listing-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-top: 8px;
  border-top: 1px solid rgba(148, 111, 71, 0.24);
}

.mmo-market-sell-layout {
  display: grid;
  grid-template-columns: 1.25fr 1fr;
  gap: 14px;
}

.mmo-tax-preview-card {
  padding: 14px;
  border-radius: var(--kd-radius-md, 8px);
  background: var(--kd-bg-basalt, #1a1721);
  border: 1.5px solid rgba(251, 191, 36, 0.44);
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.mmo-empty-state {
  padding: 20px 16px;
  border-radius: var(--kd-radius-md, 8px);
  background: var(--kd-bg-socket, #0d0b11);
  border: 1px dashed var(--kd-bronze-muted, #6b5035);
  text-align: center;
  font-size: 14px;
  font-weight: 700;
  color: var(--kd-text-sand, #d7cbb8);
}

/* ============================================================================
 * 7) [G] LONCA MERKEZİ, 8 SANCAK ARMASI & 32 YUVALI (8×4) ORTAK KASA
 * ============================================================================ */

.mmo-crest-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.mmo-crest-option {
  min-height: 62px;
  padding: 9px 10px;
  border-radius: var(--kd-radius-sm, 6px);
  border: 1.5px solid var(--kd-bronze-dim, #4a3825);
  background: var(--kd-bg-socket, #0d0b11);
  color: var(--kd-text-ivory, #f7f2e8);
  font-family: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 10px;
  transition: border-color 120ms ease, background 120ms ease;
}

.mmo-crest-option:hover {
  border-color: var(--kd-bronze-bright, #cfa060);
}

.mmo-crest-option.is-selected {
  border-color: var(--kd-ember-gold, #fbbf24);
  background: rgba(68, 42, 14, 0.85);
  color: var(--kd-text-gold, #fde68a);
}

.mmo-crest-sprite {
  width: 40px;
  height: 40px;
  border-radius: 6px;
  background-image: url("../../assets/ui/guild_crests_atlas.png");
  background-size: 160px 80px;
  background-repeat: no-repeat;
  image-rendering: pixelated;
  flex-shrink: 0;
}

.mmo-guild-summary-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  padding: 11px 14px;
  border-radius: var(--kd-radius-md, 8px);
  background: var(--kd-bg-basalt, #1a1721);
  border: 1px solid var(--kd-bronze-muted, #6b5035);
}

.mmo-guild-members-list,
.mmo-audit-list,
.mmo-guild-chat-feed {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.mmo-member-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  padding: 9px 12px;
  border-radius: var(--kd-radius-sm, 6px);
  background: var(--kd-bg-socket, #0d0b11);
  border: 1px solid var(--kd-bronze-dim, #4a3825);
}

.mmo-rank-pill {
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
  background: rgba(36, 32, 46, 0.9);
  border: 1px solid var(--kd-bronze-muted, #6b5035);
  color: var(--kd-text-sand, #d7cbb8);
}

.mmo-rank-pill[data-rank="leader"] {
  background: rgba(245, 158, 11, 0.24);
  border-color: #fbbf24;
  color: #fef08a;
}

.mmo-rank-pill[data-rank="officer"] {
  background: rgba(16, 185, 129, 0.22);
  border-color: #34d399;
  color: #a7f3d0;
}

.mmo-vault-grid {
  display: grid;
  grid-template-columns: repeat(8, 52px);
  gap: 8px;
  justify-content: start;
}

.mmo-guild-chat-feed {
  max-height: 220px;
  overflow-y: auto;
  padding: 12px;
  border-radius: var(--kd-radius-sm, 6px);
  background: var(--kd-bg-socket, #0d0b11);
  border: 1px solid var(--kd-bronze-dim, #4a3825);
}

.mmo-guild-chat-msg {
  font-size: 14px;
  color: var(--kd-text-ivory, #f7f2e8);
  word-break: break-word;
}

.mmo-guild-chat-sender {
  font-weight: 800;
  color: var(--kd-ember-gold, #fbbf24);
  margin-right: 6px;
}

.mmo-inline-form {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

/* ============================================================================
 * 8) 2 KATMANLI [M] DÜNYA HARİTASI & ETİKETLİ BÖLGE İÇ HARİTASI (worldMapModal.mjs)
 * ============================================================================ */

.world-map-card {
  width: min(1160px, calc(100vw - 36px));
  max-height: min(850px, calc(100vh - 36px));
  overflow-y: auto;
  padding: 18px 20px;
  border-radius: var(--kd-radius-lg, 12px);
  background: var(--kd-bg-obsidian, #121017);
  border: 2px solid var(--kd-bronze-base, #946f47);
  box-shadow:
    inset 0 0 0 1px rgba(243, 210, 153, 0.14),
    var(--kd-shadow-window, 0 24px 64px rgba(0, 0, 0, 0.85));
  display: flex;
  flex-direction: column;
  gap: 14px;
  color: var(--kd-text-ivory, #f7f2e8);
}

.world-map-title-wrap {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.world-map-subtitle {
  font-size: 13px;
  font-weight: 600;
  color: var(--kd-text-sand, #d7cbb8);
}

.world-map-header-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.world-map-layer-switch-btn,
.world-map-close-btn,
.zone-map-back-btn,
.world-map-zoom-zone-btn {
  min-height: 36px;
  padding: 6px 13px;
  border-radius: var(--kd-radius-sm, 6px);
  font-family: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  transition: filter 120ms ease, border-color 120ms ease, background 120ms ease;
}

.world-map-layer-switch-btn,
.world-map-zoom-zone-btn {
  border: 1px solid var(--kd-ember-gold, #fbbf24);
  background: linear-gradient(180deg, #9a3412 0%, #5c1d0c 100%);
  color: #fff7ed;
}

.world-map-zoom-zone-btn.is-secondary,
.zone-map-back-btn {
  border: 1px solid var(--kd-bronze-bright, #cfa060);
  background: var(--kd-bg-slate, #24202e);
  color: var(--kd-text-gold, #fde68a);
}

.world-map-close-btn {
  border: 1px solid var(--kd-bronze-base, #946f47);
  background: var(--kd-bg-basalt, #1a1721);
  color: var(--kd-text-ivory, #f7f2e8);
}

.world-map-close-btn:hover {
  border-color: #f87171;
  background: rgba(88, 22, 30, 0.88);
  color: #fecaca;
}

.world-map-layer-switch-btn:hover,
.world-map-zoom-zone-btn:hover,
.zone-map-back-btn:hover {
  filter: brightness(1.1);
}

.world-map-body {
  display: grid;
  grid-template-columns: minmax(0, 1.9fr) minmax(272px, 0.92fr);
  gap: 16px;
  align-items: stretch;
}

.world-map-stage-host {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

/* Katman 1: Kıta Haritası Sahnesi */
.world-map-canvas-wrap {
  position: relative;
  width: 100%;
  min-height: 468px;
  border-radius: var(--kd-radius-md, 8px);
  border: 1.5px solid var(--kd-bronze-base, #946f47);
  background:
    radial-gradient(circle at 25% 46%, rgba(52, 211, 153, 0.12) 0%, transparent 46%),
    radial-gradient(circle at 66% 24%, rgba(234, 88, 12, 0.16) 0%, transparent 45%),
    linear-gradient(160deg, #16131e 0%, #1c1714 55%, #100e15 100%);
  box-shadow: inset 0 0 44px rgba(0, 0, 0, 0.76);
  overflow: hidden;
}

.world-map-compass-text {
  fill: var(--kd-bronze-highlight, #f3d299);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.world-map-edge-glow {
  stroke: rgba(251, 191, 36, 0.18);
  stroke-width: 6;
  stroke-linecap: round;
}

.world-map-edge {
  stroke: rgba(207, 160, 96, 0.72);
  stroke-width: 2.2;
  stroke-dasharray: 6 5;
}

.world-map-edge-label {
  fill: #e7dcc8;
  font-size: 13px;
  font-weight: 700;
  paint-order: stroke;
  stroke: rgba(12, 10, 16, 0.92);
  stroke-width: 4px;
}

.world-map-nodes {
  position: absolute;
  inset: 0;
}

.world-map-node-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--zone-color, #34d399);
  box-shadow: 0 0 10px var(--zone-color, #34d399);
}

.world-map-node-name {
  font-size: 14px;
  font-weight: 800;
  color: var(--kd-text-ivory, #f7f2e8);
  text-align: center;
}

.world-map-node-lvl {
  font-size: 13px;
  font-weight: 700;
  color: var(--kd-text-gold, #fde68a);
}

.world-map-node-badges {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 5px;
}

.world-map-badge {
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
}

.world-map-badge.is-you {
  background: rgba(16, 185, 129, 0.24);
  border: 1px solid rgba(52, 211, 153, 0.8);
  color: #a7f3d0;
}

.world-map-badge.is-party {
  background: rgba(245, 158, 11, 0.22);
  border: 1px solid rgba(251, 191, 36, 0.8);
  color: #fef08a;
}

/* Katman 2: Etiketli Bölge İç Haritası Sahnesi */
.zone-map-stage {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.zone-map-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  padding: 8px 12px;
  border-radius: var(--kd-radius-md, 8px);
  background: var(--kd-bg-basalt, #1a1721);
  border: 1px solid var(--kd-bronze-muted, #6b5035);
}

.zone-map-crumb-wrap {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px;
}

.zone-map-crumb-title {
  font-family: var(--kd-font-display, Georgia, serif);
  font-size: 16px;
  font-weight: 800;
}

.zone-map-crumb-meta {
  font-size: 13px;
  font-weight: 700;
  color: var(--kd-text-sand, #d7cbb8);
}

.zone-map-quick-tabs {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
}

.zone-map-quick-tab {
  padding: 4px 9px;
  border-radius: var(--kd-radius-sm, 6px);
  border: 1px solid var(--kd-bronze-dim, #4a3825);
  background: var(--kd-bg-socket, #0d0b11);
  color: var(--kd-text-sand, #d7cbb8);
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.zone-map-quick-tab:hover {
  border-color: var(--kd-bronze-bright, #cfa060);
  color: var(--kd-text-ivory, #f7f2e8);
}

.zone-map-quick-tab.is-active {
  border-color: var(--kd-ember-gold, #fbbf24);
  background: linear-gradient(180deg, #7c2d12 0%, #431407 100%);
  color: #fff7ed;
}

.zone-map-viewport {
  position: relative;
  width: 100%;
  aspect-ratio: 760 / 460;
  min-height: 420px;
  border-radius: var(--kd-radius-md, 8px);
  border: 1.5px solid var(--kd-bronze-base, #946f47);
  background: #0d0b11;
  box-shadow: inset 0 0 36px rgba(0, 0, 0, 0.82);
  overflow: hidden;
}

.zone-map-svg {
  display: block;
  width: 100%;
  height: 100%;
  cursor: crosshair;
}

.zone-svg-frame-bg {
  fill: #131019;
  stroke: rgba(148, 111, 71, 0.35);
  stroke-width: 1;
}

.zone-svg-walkable {
  fill: rgba(45, 58, 48, 0.62);
}

.zone-svg-walkable.is-zone-town {
  fill: rgba(44, 68, 54, 0.66);
}

.zone-svg-walkable.is-zone-forest {
  fill: rgba(32, 62, 46, 0.68);
}

.zone-svg-walkable.is-zone-dungeon,
.zone-svg-walkable.is-zone-crypt {
  fill: rgba(44, 38, 62, 0.72);
}

.zone-svg-walkable.is-zone-steppe {
  fill: rgba(88, 60, 36, 0.64);
}

.zone-svg-walkable.is-zone-borderlands {
  fill: rgba(68, 30, 30, 0.68);
}

.zone-svg-road {
  fill: rgba(207, 168, 112, 0.56);
}

.zone-svg-road.is-zone-dungeon,
.zone-svg-road.is-zone-crypt {
  fill: rgba(139, 122, 176, 0.45);
}

.zone-svg-water {
  fill: rgba(56, 189, 248, 0.52);
}

.zone-svg-lava {
  fill: rgba(249, 115, 22, 0.72);
}

.zone-svg-room {
  fill: none;
  stroke: rgba(207, 160, 96, 0.36);
  stroke-width: 1.1;
  vector-effect: non-scaling-stroke;
}

.zone-svg-room.is-boss-room {
  fill: rgba(220, 38, 38, 0.14);
  stroke: rgba(248, 113, 113, 0.85);
  stroke-width: 1.8;
}

.zone-svg-leader-line {
  stroke: rgba(243, 210, 153, 0.62);
  stroke-width: 1.35;
  stroke-dasharray: 3 3;
  vector-effect: non-scaling-stroke;
  pointer-events: none;
}

.zone-svg-anchor-dot {
  fill: #fde68a;
  stroke: #0d0b11;
  stroke-width: 1.6;
  pointer-events: none;
}

.zone-svg-anchor-dot.is-portal {
  fill: #38bdf8;
}

.zone-svg-anchor-dot.is-heal {
  fill: #34d399;
}

.zone-svg-anchor-dot.is-boss {
  fill: #f87171;
}

.zone-svg-anchor-dot.is-you {
  fill: #10b981;
  stroke: #ffffff;
}

.zone-map-pins-layer {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.zone-map-pin {
  position: absolute;
  transform: translate(-50%, -50%);
  pointer-events: auto;
  z-index: 2;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(16, 14, 22, 0.93);
  border: 1.5px solid var(--kd-bronze-bright, #cfa060);
  color: var(--kd-text-ivory, #f7f2e8);
  font-family: inherit;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.78);
  transition: transform 110ms ease, border-color 110ms ease, background 110ms ease;
}

.zone-map-pin:hover {
  z-index: 8;
  transform: translate(-50%, -52%) scale(1.04);
  border-color: var(--kd-ember-gold, #fbbf24);
  background: rgba(36, 30, 44, 0.98);
}

.zone-map-pin.is-portal {
  border-color: #38bdf8;
  background: rgba(12, 30, 48, 0.94);
  color: #e0f2fe;
}

.zone-map-pin.is-npc {
  border-color: #fbbf24;
  background: rgba(34, 26, 16, 0.94);
  color: #fef3c7;
}

.zone-map-pin.is-service {
  border-color: #c084fc;
  background: rgba(32, 18, 46, 0.94);
  color: #f3e8ff;
}

.zone-map-pin.is-heal {
  border-color: #34d399;
  background: rgba(10, 38, 30, 0.94);
  color: #d1fae5;
}

.zone-map-pin.is-boss {
  z-index: 4;
  border-color: #f87171;
  background: linear-gradient(180deg, rgba(82, 18, 24, 0.96) 0%, rgba(38, 12, 16, 0.96) 100%);
  color: #fee2e2;
}

.zone-map-pin.is-party {
  z-index: 5;
  border-color: #4ade80;
  background: rgba(14, 48, 28, 0.95);
  color: #dcfce7;
}

.zone-map-pin.is-you {
  z-index: 6;
  border-color: #6ee7b7;
  background: linear-gradient(180deg, #059669 0%, #065f46 100%);
  color: #ffffff;
  box-shadow: 0 0 0 2px rgba(52, 211, 153, 0.38), 0 8px 18px rgba(0, 0, 0, 0.82);
}

.zone-map-pin.is-quest {
  z-index: 7;
  border-color: #fde047;
  background: rgba(88, 52, 10, 0.96);
  color: #fef9c3;
}

.zone-map-legend {
  padding: 8px 12px;
  border-radius: var(--kd-radius-sm, 6px);
  background: var(--kd-bg-socket, #0d0b11);
  border: 1px solid var(--kd-bronze-dim, #4a3825);
}

.zone-map-legend-hint {
  font-size: 13px;
  font-weight: 700;
  color: var(--kd-text-sand, #d7cbb8);
}

/* Sağ Bölge Rehberi Detay Sütunu */
.world-map-detail-badges {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.world-map-chip {
  padding: 3px 10px;
  border-radius: 999px;
  border: 1px solid var(--kd-bronze-base, #946f47);
  background: var(--kd-bg-socket, #0d0b11);
  color: var(--kd-text-gold, #fde68a);
  font-size: 13px;
  font-weight: 800;
}

.world-map-chip.is-current {
  border-color: #34d399;
  background: rgba(16, 185, 129, 0.18);
  color: #a7f3d0;
}

.world-map-detail-title {
  margin: 0;
  font-family: var(--kd-font-display, Georgia, serif);
  font-size: 18px;
  font-weight: 800;
  color: var(--kd-text-ivory, #f7f2e8);
}

.world-map-detail-desc {
  margin: 0;
  font-size: 14px;
  line-height: 1.45;
  color: var(--kd-text-sand, #d7cbb8);
}

.world-map-detail-box {
  padding: 10px 12px;
  border-radius: var(--kd-radius-sm, 6px);
  background: var(--kd-bg-socket, #0d0b11);
  border: 1px solid var(--kd-bronze-dim, #4a3825);
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.world-map-box-label {
  font-size: 13px;
  font-weight: 800;
  color: var(--kd-bronze-highlight, #f3d299);
}

.world-map-box-val {
  font-size: 14px;
  font-weight: 700;
  color: var(--kd-text-ivory, #f7f2e8);
}

.world-map-feat-list {
  margin: 0;
  padding-left: 18px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 13px;
  color: var(--kd-text-sand, #d7cbb8);
}

.world-map-party-empty,
.world-map-party-ally {
  font-size: 13px;
  font-weight: 700;
  color: var(--kd-text-sand, #d7cbb8);
}

.world-map-party-ally {
  color: #86efac;
}

.world-map-detail-actions {
  margin-top: auto;
  padding-top: 6px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

@media (max-width: 980px) {
  .mmo-trade-columns,
  .mmo-market-sell-layout,
  .world-map-body {
    grid-template-columns: 1fr;
  }

  .mmo-market-filter-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mmo-vault-grid {
    grid-template-columns: repeat(4, 52px);
  }

  .mmo-crest-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* ============================================================================
   FAZ 4 (CE2-76) — [M] KITA HARİTASI 2.0 (14 DÜĞÜMLÜ İNTERAKTİF KITA ATLASI)
   Sade Ekran Kuralı: Tüm font-size >= 13px, sıfır düğüm çakışması
   ============================================================================ */

.world-map-backdrop {
  z-index: var(--kd-z-modal-backdrop, 400);
  background: var(--kd-backdrop-veil, rgba(7, 6, 11, 0.84));
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.world-map-card.is-continent-v2 {
  width: min(1290px, calc(100vw - 24px));
  max-height: calc(100vh - 24px);
}

.world-map-card.is-continent-v2 .world-map-body {
  grid-template-columns: minmax(0, 1.95fr) minmax(320px, 0.98fr);
}

.world-map-card.is-continent-v2 .world-map-canvas-wrap {
  min-height: 556px;
}

.world-map-card.is-continent-v2 .world-map-node {
  min-width: 112px;
  max-width: 144px;
  padding: 5px 8px;
  gap: 2px;
}

.world-map-card.is-continent-v2 .world-map-node.is-level-locked {
  opacity: 0.88;
  border-style: dashed;
}

.world-map-card.is-continent-v2 .world-map-detail {
  max-height: 560px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.world-map-boss-counter-pill {
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid rgba(251, 191, 36, 0.65);
  background: rgba(68, 28, 14, 0.72);
  color: #fde68a;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}

.world-map-badge.is-boss-up {
  background: rgba(185, 28, 28, 0.25);
  border: 1px solid rgba(248, 113, 113, 0.75);
  color: #fecaca;
}

.world-map-chip.is-locked {
  border-color: rgba(248, 113, 113, 0.8);
  background: rgba(127, 29, 29, 0.35);
  color: #fecaca;
}

.world-map-inner-preview {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 8px 10px;
  border-radius: var(--kd-radius-sm, 6px);
  background: var(--kd-bg-socket, #0d0b11);
  border: 1.5px solid var(--kd-bronze-base, #946f47);
  cursor: pointer;
  transition: border-color 120ms ease, transform 120ms ease;
}

.world-map-inner-preview:hover {
  border-color: var(--kd-ember-gold, #fbbf24);
}

.world-map-inner-preview-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.world-map-preview-hint {
  font-size: 13px;
  font-weight: 700;
  color: var(--kd-text-gold, #fde68a);
}

.world-map-inner-preview-svg {
  display: block;
  width: 100%;
  height: 152px;
  border-radius: 6px;
  background: #120f18;
}

.world-map-portal-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  width: 100%;
  padding: 6px 9px;
  border-radius: 6px;
  border: 1px solid rgba(56, 189, 248, 0.42);
  background: rgba(12, 28, 44, 0.62);
  color: var(--kd-text-ivory, #f7f2e8);
  font-family: inherit;
  font-size: 13px;
  text-align: left;
  cursor: pointer;
}

.world-map-portal-item:hover {
  border-color: #38bdf8;
  background: rgba(16, 40, 62, 0.86);
}

.world-map-portal-item.is-locked {
  border-color: rgba(248, 113, 113, 0.52);
  background: rgba(58, 18, 24, 0.55);
}

.world-map-portal-item-title {
  font-size: 13px;
  font-weight: 800;
  color: #e0f2fe;
}

.world-map-portal-item-lock {
  font-size: 13px;
  font-weight: 700;
}

.world-map-portal-item-lock.is-locked {
  color: #fca5a5;
}

.world-map-portal-item-lock.is-open {
  color: #86efac;
}

.world-map-party-elsewhere {
  font-size: 13px;
  font-weight: 700;
  color: #fde68a;
}

.zone-svg-anchor-dot.is-party {
  fill: #4ade80;
  stroke: #052e16;
}

/* 8 Yeni Kıta Bölgesi SVG Biyom Zemin & Yol Renkleri */
.zone-svg-walkable.is-zone-whispering_meadows {
  fill: rgba(52, 108, 66, 0.68);
}
.zone-svg-walkable.is-zone-pea_terraces {
  fill: rgba(74, 118, 46, 0.68);
}
.zone-svg-walkable.is-zone-misty_swamp {
  fill: rgba(26, 76, 74, 0.72);
}
.zone-svg-walkable.is-zone-sun_scorch_dunes {
  fill: rgba(126, 84, 34, 0.68);
}
.zone-svg-walkable.is-zone-sunken_ruins {
  fill: rgba(28, 74, 98, 0.72);
}
.zone-svg-walkable.is-zone-frostpeak_pass {
  fill: rgba(64, 98, 128, 0.72);
}
.zone-svg-walkable.is-zone-crystal_abyss {
  fill: rgba(74, 38, 98, 0.74);
}
.zone-svg-walkable.is-zone-citadel_of_ash {
  fill: rgba(78, 26, 26, 0.76);
}

.zone-svg-road.is-zone-sunken_ruins,
.zone-svg-road.is-zone-frostpeak_pass {
  fill: rgba(186, 230, 253, 0.48);
}

.zone-svg-road.is-zone-crystal_abyss {
  fill: rgba(232, 121, 249, 0.44);
}

.zone-svg-road.is-zone-citadel_of_ash {
  fill: rgba(248, 113, 113, 0.42);
}

/* ============================================================================
   FAZ 6 (CE2-81): [L] GÖREV GÜNLÜĞÜ 2.0, ANTİK PARŞÖMEN BİLMECE KARTI,
   4 GÖREVLİK SAĞ ÜST HUD TAKİPÇİSİ, KEHRİBAR HABİTAT ÇEMBERİ & MİNİMAP YÖN OKU
   ============================================================================ */

.modal-window--journal-v2 {
  width: min(1040px, 95vw);
  max-height: min(80vh, 720px);
  overflow-y: auto;
}

.kd-journal-v2 {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.kd-journal-v2-topbar {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 8px;
  background: rgba(15, 13, 21, 0.9);
  border: 1px solid rgba(180, 148, 92, 0.35);
}

.kd-journal-v2-stats {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.kd-journal-stat-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(28, 25, 36, 0.92);
  border: 1px solid rgba(148, 111, 71, 0.48);
  color: #e7e1d6;
  font-size: 13px;
  font-weight: 700;
}

.kd-journal-stat-pill.is-gold {
  border-color: rgba(251, 191, 36, 0.72);
  background: rgba(72, 46, 12, 0.6);
  color: #fde68a;
}

.kd-journal-stat-pill.is-mystery {
  border-color: rgba(192, 132, 252, 0.72);
  background: rgba(59, 24, 88, 0.58);
  color: #f3e8ff;
}

.kd-journal-v2-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.kd-journal-tab-btn {
  padding: 7px 12px;
  font-size: 13px;
  font-weight: 800;
  border-radius: 7px;
  border: 1px solid rgba(148, 111, 71, 0.44);
  background: rgba(20, 17, 27, 0.88);
  color: #e2dcd0;
  cursor: pointer;
  transition: border-color 120ms ease, background 120ms ease, color 120ms ease;
}

.kd-journal-tab-btn:hover {
  border-color: rgba(251, 191, 36, 0.72);
  color: #fef3c7;
}

.kd-journal-tab-btn.is-active {
  background: linear-gradient(180deg, rgba(146, 64, 14, 0.82), rgba(78, 34, 12, 0.92));
  border-color: #fbbf24;
  color: #fffbeb;
  box-shadow: 0 0 12px rgba(251, 191, 36, 0.24);
}

.kd-journal-tab-btn.is-mystery-tab.is-active {
  background: linear-gradient(180deg, rgba(107, 33, 168, 0.85), rgba(59, 7, 100, 0.95));
  border-color: #d8b4fe;
  color: #faf5ff;
  box-shadow: 0 0 14px rgba(192, 132, 252, 0.32);
}

.kd-journal-v2-grid {
  display: grid;
  grid-template-columns: minmax(290px, 340px) minmax(0, 1fr);
  gap: 12px;
  min-height: 360px;
  max-height: 500px;
}

.kd-journal-v2-grid .kd-quest-detail,
.kd-journal-v2-grid .kd-quest-list {
  max-height: 500px;
  overflow-y: auto;
}

.kd-journal-row-wrap {
  display: flex;
  align-items: stretch;
  gap: 6px;
}

.kd-journal-row-wrap .kd-quest-list-item {
  flex: 1;
  min-width: 0;
  align-items: center;
}

.kd-journal-row-titles {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  flex: 1;
  min-width: 0;
  text-align: left;
}

.kd-journal-row-sub {
  font-size: 13px;
  color: #b8b0a2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

.kd-journal-row-sub.is-mystery {
  color: #d8b4fe;
  font-weight: 700;
}

.kd-journal-row-wrap.is-locked .kd-quest-list-item {
  opacity: 0.86;
  border-style: dashed;
}

.kd-journal-pin-icon-btn {
  width: 34px;
  flex-shrink: 0;
  border-radius: 6px;
  border: 1px solid rgba(148, 111, 71, 0.42);
  background: rgba(18, 15, 24, 0.9);
  color: #cbbba0;
  font-size: 14px;
  cursor: pointer;
}

.kd-journal-pin-icon-btn.is-pinned {
  border-color: rgba(251, 191, 36, 0.85);
  background: rgba(92, 54, 14, 0.72);
  color: #fde68a;
}

.kd-quest-lock-banner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  margin-bottom: 10px;
  border-radius: 8px;
  background: rgba(69, 20, 28, 0.56);
  border: 1.5px solid rgba(248, 113, 113, 0.65);
  color: #fecaca;
  font-size: 14px;
}

.kd-quest-lock-reason {
  color: #fde68a;
  font-weight: 700;
}

.kd-quest-habitat-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 12px;
  margin-bottom: 10px;
  border-radius: 7px;
  background: rgba(78, 44, 10, 0.58);
  border: 1px solid rgba(251, 191, 36, 0.65);
  color: #fde68a;
  font-size: 13px;
  font-weight: 700;
}

.kd-mystery-seal {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  margin-bottom: 10px;
  border-radius: 8px;
  background: linear-gradient(90deg, rgba(76, 29, 149, 0.72), rgba(46, 16, 101, 0.85));
  border: 1.5px solid rgba(216, 180, 254, 0.78);
  color: #f5d0fe;
  font-size: 14px;
  font-weight: 800;
  box-shadow: 0 0 16px rgba(168, 85, 247, 0.24);
}

.kd-mystery-parchment {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px 14px;
  margin-bottom: 8px;
  border-radius: 10px;
  background: linear-gradient(165deg, #3c2c1a 0%, #2a1d11 55%, #1f150d 100%);
  border: 2px solid #c09553;
  box-shadow:
    inset 0 0 24px rgba(15, 9, 4, 0.68),
    0 6px 18px rgba(0, 0, 0, 0.45);
  color: #f9edd5;
}

.kd-mystery-parchment-hdr {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(217, 179, 118, 0.35);
}

.kd-mystery-parchment-title {
  font-size: 15px;
  font-weight: 800;
  color: #fde68a;
  letter-spacing: 0.02em;
}

.kd-parchment-toggle-btn {
  font-size: 13px;
  padding: 4px 10px;
}

.kd-mystery-riddle-poem {
  margin: 0;
  padding: 10px 14px;
  border-left: 3px solid #f59e0b;
  background: rgba(18, 12, 7, 0.48);
  border-radius: 6px;
}

.kd-mystery-riddle-line {
  margin: 4px 0;
  font-size: 15px;
  font-style: italic;
  line-height: 1.5;
  color: #fef3c7;
}

.kd-mystery-zero-leak-note {
  font-size: 13px;
  color: #e9d5ff;
  font-weight: 600;
}

/* Sağ Üst 4 Görevlik HUD Takipçisi */
.kd-tracker-card-v2 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 8px 10px;
  text-align: left;
}

.kd-tracker-card-v2.is-marked {
  border-color: rgba(251, 191, 36, 0.85);
  box-shadow: 0 0 10px rgba(251, 191, 36, 0.18);
}

.kd-tracker-card-v2.is-mystery {
  border-color: rgba(192, 132, 252, 0.65);
}

.kd-tracker-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}

.kd-tracker-open-btn {
  flex: 1;
  min-width: 0;
  padding: 0;
  border: none;
  background: transparent;
  color: #fef3c7;
  font-family: inherit;
  font-size: 13px;
  font-weight: 800;
  text-align: left;
  cursor: pointer;
}

.kd-tracker-quick-btns {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.kd-tracker-mini-btn {
  padding: 2px 6px;
  border-radius: 5px;
  border: 1px solid rgba(180, 148, 92, 0.45);
  background: rgba(16, 14, 22, 0.85);
  color: #fde68a;
  font-size: 13px;
  cursor: pointer;
}

.tracker-hint-line.is-mystery {
  color: #e9d5ff;
  font-size: 13px;
  font-weight: 700;
}

/* [M] 14 Düğümlü Kıta Haritası Görev Hedef Bölgesi & Kehribar Yaratık Habitat Çemberi */
.world-map-node.is-quest-target {
  border-color: #fbbf24;
  box-shadow:
    0 0 0 2px rgba(251, 191, 36, 0.45),
    0 0 20px rgba(245, 158, 11, 0.62);
  z-index: 6;
}

.world-map-badge.is-quest-target {
  background: rgba(146, 64, 14, 0.92);
  border: 1px solid #fbbf24;
  color: #fef3c7;
  font-size: 13px;
  font-weight: 800;
}

.continent-quest-node-aura {
  fill: rgba(251, 191, 36, 0.14);
  stroke: rgba(251, 191, 36, 0.42);
  stroke-width: 1.6;
  stroke-dasharray: 5 4;
}

.continent-quest-node-ring {
  fill: none;
  stroke: #fbbf24;
  stroke-width: 2.4;
}

.quest-habitat-highlight {
  pointer-events: none;
}

.quest-habitat-aura {
  fill: rgba(245, 158, 11, 0.16);
  stroke: rgba(251, 191, 36, 0.36);
  stroke-width: 1.5;
}

.quest-habitat-ring {
  fill: rgba(251, 191, 36, 0.12);
  stroke: #fbbf24;
  stroke-width: 2.6;
  stroke-dasharray: 7 5;
  animation: kdHabitatPulse 2.2s ease-in-out infinite;
}

.quest-habitat-core {
  fill: #fde68a;
  stroke: #92400e;
  stroke-width: 2;
}

@keyframes kdHabitatPulse {
  0%,
  100% {
    stroke-opacity: 0.95;
    fill-opacity: 0.12;
  }
  50% {
    stroke-opacity: 0.55;
    fill-opacity: 0.24;
  }
}

/* Minimap Yön Oku */
.minimap-quest-arrow {
  position: absolute;
  transform: translate(-50%, -50%);
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 2px 6px;
  border-radius: 999px;
  border: 1.5px solid #fbbf24;
  background: rgba(69, 26, 3, 0.92);
  color: #fde68a;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  z-index: 8;
  box-shadow: 0 0 10px rgba(245, 158, 11, 0.65);
}

.minimap-quest-arrow-glyph {
  display: inline-block;
  color: #fbbf24;
  font-size: 13px;
  line-height: 1;
}

.minimap-quest-arrow-dist {
  font-size: 13px;
  color: #fef3c7;
}

@media (max-width: 820px) {
  .kd-journal-v2-grid {
    grid-template-columns: 1fr;
  }
}

/* ============================================================================
 * FAZ 7 (CE2-85): CANLI PARTİ BULUCU, MÜHÜRLÜ GRUP ZİNDANI, KOR YARIĞI (45s),
 * GRUP GANİMET ZAR (NEED / GREED / PASS) & [J] CANAVAR ATLASI + ÜNVANLAR
 * (Tüm metin boyutları >= 13px kuralına %100 uyumludur)
 * ============================================================================ */

.pf-social-mode-tabs {
  margin-bottom: 12px;
}

.pf-board-section {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 14px;
  border-color: rgba(251, 191, 36, 0.42);
  background: linear-gradient(180deg, rgba(28, 23, 38, 0.96) 0%, rgba(18, 16, 25, 0.96) 100%);
}

.pf-board-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}

.pf-board-title-box {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.pf-board-subtitle {
  font-size: 13px;
  color: rgba(247, 242, 232, 0.78);
}

.pf-party-status-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  padding: 10px 14px;
  border-radius: 8px;
  border: 1px solid rgba(52, 211, 153, 0.35);
  background: rgba(6, 78, 59, 0.28);
}

.pf-party-status-text {
  font-size: 14px;
  font-weight: 600;
  color: #d1fae5;
}

.pf-create-form-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 14px;
  border-radius: 8px;
  border: 1px solid rgba(251, 191, 36, 0.45);
  background: rgba(36, 27, 18, 0.55);
}

.pf-subcard-title {
  margin: 0;
  font-size: 15px;
  font-weight: 800;
  color: #fde68a;
}

.pf-form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 12px;
}

.pf-wanted-picker-row {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.pf-class-chips-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.pf-class-chip {
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid rgba(148, 111, 71, 0.65);
  background: rgba(26, 23, 33, 0.9);
  color: rgba(247, 242, 232, 0.85);
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: border-color 120ms ease, background 120ms ease;
}

.pf-class-chip.is-selected {
  border-color: #34d399;
  background: rgba(16, 185, 129, 0.24);
  color: #ecfdf5;
}

.pf-filter-bar {
  display: grid;
  grid-template-columns: 2fr 1.2fr 1.2fr 0.8fr;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 8px;
  background: rgba(15, 13, 21, 0.72);
  border: 1px solid rgba(148, 111, 71, 0.35);
}

.pf-listings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 12px;
}

.pf-listing-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 8px;
  border: 1px solid rgba(148, 111, 71, 0.55);
  background: rgba(24, 21, 33, 0.92);
}

.pf-listing-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.pf-listing-title {
  font-size: 15px;
  font-weight: 800;
  color: #fef3c7;
}

.pf-slots-pill {
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid rgba(56, 189, 248, 0.55);
  background: rgba(14, 116, 144, 0.32);
  color: #bae6fd;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}

.pf-listing-meta-row,
.pf-wanted-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.pf-zone-badge,
.pf-level-badge,
.pf-activity-badge,
.pf-role-badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
}

.pf-zone-badge {
  background: rgba(16, 185, 129, 0.18);
  border: 1px solid rgba(52, 211, 153, 0.45);
  color: #a7f3d0;
}

.pf-level-badge {
  background: rgba(245, 158, 11, 0.2);
  border: 1px solid rgba(251, 191, 36, 0.5);
  color: #fde68a;
}

.pf-level-badge.is-locked {
  background: rgba(239, 68, 68, 0.2);
  border-color: rgba(248, 113, 113, 0.55);
  color: #fecaca;
}

.pf-activity-badge {
  background: rgba(139, 92, 246, 0.2);
  border: 1px solid rgba(167, 139, 250, 0.45);
  color: #ddd6fe;
}

.pf-role-badge {
  background: rgba(38, 34, 52, 0.92);
  border: 1px solid rgba(196, 181, 253, 0.38);
  color: #f3e8ff;
}

.pf-listing-note {
  font-size: 13px;
  color: rgba(247, 242, 232, 0.78);
}

.pf-listing-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: auto;
  padding-top: 8px;
  border-top: 1px solid rgba(148, 111, 71, 0.25);
}

.pf-leader-label {
  font-size: 13px;
  color: rgba(247, 242, 232, 0.85);
}

.pf-mine-pill {
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(16, 185, 129, 0.22);
  border: 1px solid #34d399;
  color: #a7f3d0;
  font-size: 13px;
  font-weight: 800;
}

.pf-sealed-launcher {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-top: 8px;
  border-top: 1px solid rgba(148, 111, 71, 0.35);
}

.pf-sealed-launcher-head {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.pf-sealed-tier-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
}

.pf-sealed-tier-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px;
  border-radius: 8px;
  border: 1px solid rgba(251, 191, 36, 0.38);
  background: rgba(22, 19, 31, 0.92);
}

.pf-sealed-tier-top {
  display: flex;
  align-items: center;
  gap: 8px;
}

.pf-sealed-tier-lv {
  padding: 2px 8px;
  border-radius: 6px;
  background: rgba(245, 158, 11, 0.24);
  border: 1px solid #fbbf24;
  color: #fde68a;
  font-size: 13px;
  font-weight: 800;
}

.pf-sealed-tier-name {
  font-size: 14px;
  font-weight: 800;
  color: #f7f2e8;
}

.pf-sealed-tier-meta {
  font-size: 13px;
  color: rgba(247, 242, 232, 0.78);
}

/* Sağ Üst Co-op HUD Yığını (Kor Yarığı + Mühürlü Zindan + Grup Ganimet Zarı) */
.pf-coop-hud-stack {
  position: fixed;
  top: 16px;
  right: 484px;
  z-index: 28;
  width: min(370px, calc(100vw - 32px));
  display: flex;
  flex-direction: column;
  gap: 12px;
  pointer-events: none;
}

@media (max-width: 1200px) {
  .pf-coop-hud-stack {
    right: 204px;
  }
}

.pf-rift-card,
.pf-sealed-hud-card,
.pf-loot-roll-card,
.pf-loot-result-card {
  pointer-events: auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px 14px;
  border-radius: 10px;
  background: rgba(18, 15, 26, 0.95);
  border: 1.5px solid rgba(245, 158, 11, 0.65);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.75);
}

.pf-rift-card.is-joining-glow {
  border-color: #fbbf24;
  box-shadow: 0 0 22px rgba(245, 158, 11, 0.55), 0 14px 32px rgba(0, 0, 0, 0.75);
  animation: pfRiftGlowPulse 1.8s ease-in-out infinite;
}

@keyframes pfRiftGlowPulse {
  0%,
  100% {
    box-shadow: 0 0 16px rgba(245, 158, 11, 0.45), 0 14px 32px rgba(0, 0, 0, 0.75);
  }
  50% {
    box-shadow: 0 0 28px rgba(251, 191, 36, 0.85), 0 14px 32px rgba(0, 0, 0, 0.8);
  }
}

.pf-rift-header,
.pf-sealed-hud-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.pf-rift-alert-title,
.pf-sealed-hud-title {
  font-size: 15px;
  font-weight: 800;
  color: #fde68a;
}

.pf-rift-timer-pill,
.pf-timer-chip,
.pf-lives-chip {
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(124, 45, 18, 0.65);
  border: 1px solid #fb923c;
  color: #ffedd5;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}

.pf-lives-chip {
  background: rgba(127, 29, 29, 0.65);
  border-color: #f87171;
  color: #fee2e2;
}

.pf-sealed-hud-pills {
  display: flex;
  align-items: center;
  gap: 6px;
}

.pf-rift-meta,
.pf-sealed-objective {
  font-size: 13px;
  color: rgba(247, 242, 232, 0.88);
}

.pf-rift-join-cta {
  width: 100%;
  justify-content: center;
  font-size: 14px;
  font-weight: 800;
}

.pf-rift-joined-btn {
  width: 100%;
  justify-content: center;
  border-color: #34d399;
  background: rgba(6, 95, 70, 0.6);
  color: #d1fae5;
  font-size: 14px;
  font-weight: 800;
}

.pf-progress-track {
  width: 100%;
  height: 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.14);
}

.pf-progress-fill {
  height: 100%;
  border-radius: 999px;
  transition: width 180ms ease;
}

.pf-progress-fill.is-rift {
  background: linear-gradient(90deg, #f97316 0%, #fbbf24 100%);
}

.pf-progress-fill.is-sealed {
  background: linear-gradient(90deg, #10b981 0%, #38bdf8 100%);
}

.pf-progress-fill.is-loot-timer {
  background: linear-gradient(90deg, #a855f7 0%, #fbbf24 100%);
}

.pf-wave-progress-wrap {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.pf-wave-pips-row {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 6px;
}

.pf-wave-pip {
  text-align: center;
  padding: 2px 4px;
  border-radius: 6px;
  border: 1px solid rgba(148, 111, 71, 0.4);
  background: rgba(26, 23, 33, 0.85);
  color: rgba(247, 242, 232, 0.65);
  font-size: 13px;
  font-weight: 700;
}

.pf-wave-pip.is-cleared {
  border-color: #34d399;
  background: rgba(16, 185, 129, 0.22);
  color: #a7f3d0;
}

.pf-wave-pip.is-current {
  border-color: #fbbf24;
  background: rgba(245, 158, 11, 0.3);
  color: #fef3c7;
}

.pf-lever-bar {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  padding-top: 4px;
}

.pf-lever-btn {
  font-size: 13px;
  justify-content: center;
}

/* Grup Nadir Ganimet Zar (Need / Greed / Pass) Kartı */
/* Alt-orta, araç çubuğu ve bildirimin üstü: karakter ve ad etiketleri ekran ortasında açık kalır.
   Genişlik sol sohbet (363px) ile sağ takip kutusu arasına sığar; iki kart yan yana, üçüncüsü üste. */
.pf-loot-roll-stack {
  position: fixed;
  left: 50%;
  bottom: 146px;
  transform: translateX(-50%);
  width: min(calc(100vw - 32px), max(340px, min(690px, calc(100vw - 750px))));
  display: flex;
  flex-wrap: wrap-reverse;
  justify-content: center;
  align-items: flex-end;
  gap: 10px;
}

.pf-loot-roll-stack[hidden] {
  display: none;
}

.pf-loot-roll-stack > * {
  flex: 0 1 340px;
  min-width: 0;
}

/* Üç ve üstü kartta dipnot düşer: üst sıra karakterin ad etiketine ulaşmasın */
.pf-loot-roll-stack:has(> :nth-child(3)) .pf-loot-foot {
  display: none;
}

/* Boss bandı ya da seviye bandı üst ortadayken Yarık/Zindan kartı onların altına iner */
@media (min-width: 1121px) {
  body:has(#hud-boss-banner:not([hidden])) .pf-coop-hud-stack,
  body:has(#hud-levelup-banner:not([hidden])) .pf-coop-hud-stack {
    top: 102px;
  }
  body:has(#hud-boss-banner:not([hidden])):has(#hud-levelup-banner:not([hidden])) .pf-coop-hud-stack {
    top: 190px;
  }
}

.pf-loot-roll-card[data-rarity="epic"] {
  border-color: #a855f7;
  box-shadow: 0 0 18px rgba(168, 85, 247, 0.4), 0 14px 32px rgba(0, 0, 0, 0.78);
}

.pf-loot-roll-card[data-rarity="legendary"] {
  border-color: #f59e0b;
  box-shadow: 0 0 22px rgba(245, 158, 11, 0.5), 0 14px 32px rgba(0, 0, 0, 0.8);
}

.pf-loot-roll-card[data-rarity="mythic"] {
  border-color: #ef4444;
  box-shadow: 0 0 24px rgba(239, 68, 68, 0.6), 0 14px 32px rgba(0, 0, 0, 0.82);
}

.pf-loot-head {
  display: flex;
  align-items: center;
  gap: 12px;
}

.pf-loot-meta-col {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.pf-loot-kicker {
  font-size: 13px;
  font-weight: 700;
  color: #fde68a;
}

.pf-loot-item-name {
  font-size: 15px;
  font-weight: 800;
  color: #ffffff;
}

.pf-loot-submeta,
.pf-loot-foot {
  font-size: 13px;
  color: rgba(247, 242, 232, 0.8);
}

.pf-loot-class-warn {
  padding: 5px 8px;
  border-radius: 6px;
  background: rgba(127, 29, 29, 0.45);
  border: 1px solid rgba(248, 113, 113, 0.45);
  color: #fecaca;
  font-size: 13px;
}

.pf-loot-actions-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}

.pf-loot-btn {
  justify-content: center;
  padding: 6px 8px;
  font-size: 13px;
}

.pf-loot-result-title,
.pf-rift-completed-text {
  font-size: 14px;
  font-weight: 800;
  color: #fde68a;
}

/* [F10] GM Kor Yarığı Tetikleme Barı */
.pf-gm-rift-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  padding: 8px 14px;
  border-top: 1px solid rgba(251, 191, 36, 0.35);
  background: rgba(45, 22, 10, 0.72);
}

.pf-gm-rift-label {
  font-size: 13px;
  font-weight: 800;
  color: #fde68a;
}

.pf-gm-rift-note {
  font-size: 13px;
  color: rgba(247, 242, 232, 0.82);
}

/* [J] Canavar Atlası (Bestiary) & BaşÜstü Ünvanlar (Titles) Penceresi */
.modal-window--bestiary {
  width: min(980px, 95vw);
  max-height: 88vh;
  display: flex;
  flex-direction: column;
}

.bestiary-modal-body {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 14px 18px 18px;
  overflow-y: auto;
}

.bst-top-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}

.bst-active-title-pill {
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid rgba(251, 191, 36, 0.55);
  background: rgba(120, 53, 15, 0.42);
  color: #fde68a;
  font-size: 13px;
  font-weight: 800;
}

.bst-filter-row {
  display: grid;
  grid-template-columns: 220px 1fr;
  align-items: center;
  gap: 12px;
}

/* CE2-106: uzun kural metni arama kutusundan genişlik yemesin, kendi satırına iner. */
.bst-tier-rule-hint {
  grid-column: 1 / -1;
  font-size: 13px;
  color: #a7f3d0;
}

/* CE2-106: GM arama ipucu tam okunsun (uzun placeholder ~333px + iç boşluk). */
.kd-gm-input[data-testid="gm-item-search"] {
  flex: 1 1 380px;
  min-width: min(380px, 100%);
  box-sizing: border-box;
}

.bst-split-layout {
  display: grid;
  grid-template-columns: 340px 1fr;
  gap: 14px;
  min-height: 360px;
}

.bst-mob-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 440px;
  overflow-y: auto;
  padding-right: 4px;
}

.bst-mob-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid rgba(148, 111, 71, 0.42);
  background: rgba(22, 19, 31, 0.9);
  color: #f7f2e8;
  font-family: inherit;
  text-align: left;
  cursor: pointer;
}

.bst-mob-row.is-selected {
  border-color: #fbbf24;
  background: rgba(69, 26, 3, 0.55);
}

.bst-mob-row.is-mastered {
  border-color: rgba(52, 211, 153, 0.65);
}

.bst-mob-row-name {
  font-size: 14px;
  font-weight: 800;
  color: #fef3c7;
}

.bst-mob-row-sub {
  font-size: 13px;
  color: rgba(247, 242, 232, 0.72);
}

.bst-kill-pill {
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid rgba(148, 111, 71, 0.5);
  background: rgba(15, 13, 21, 0.85);
  color: #fde68a;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}

.bst-kill-pill.is-mastered {
  border-color: #34d399;
  background: rgba(6, 95, 70, 0.55);
  color: #d1fae5;
}

.bst-detail-card {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 16px;
  border-radius: 10px;
  border: 1px solid rgba(148, 111, 71, 0.55);
  background: rgba(20, 18, 29, 0.94);
}

.bst-detail-title {
  margin: 0;
  font-size: 18px;
  font-weight: 800;
  color: #fde68a;
}

.bst-detail-meta {
  font-size: 14px;
  color: rgba(247, 242, 232, 0.8);
}

.bst-tier-progress-box {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px;
  border-radius: 8px;
  background: rgba(12, 10, 18, 0.75);
  border: 1px solid rgba(148, 111, 71, 0.35);
}

.bst-tier-progress-label {
  font-size: 14px;
  font-weight: 700;
  color: #f7f2e8;
}

.bst-milestones-row,
.bst-drops-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.bst-milestone-chip {
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid rgba(148, 111, 71, 0.45);
  background: rgba(26, 23, 36, 0.85);
  color: rgba(247, 242, 232, 0.72);
  font-size: 13px;
  font-weight: 700;
}

.bst-milestone-chip.is-reached {
  border-color: #34d399;
  background: rgba(16, 185, 129, 0.2);
  color: #d1fae5;
}

.bst-mastery-banner {
  padding: 10px 14px;
  border-radius: 8px;
  border: 1px solid rgba(251, 191, 36, 0.4);
  background: rgba(69, 26, 3, 0.38);
  color: #fde68a;
  font-size: 14px;
  font-weight: 700;
}

.bst-mastery-banner.is-unlocked {
  border-color: #34d399;
  background: rgba(6, 95, 70, 0.45);
  color: #ecfdf5;
}

.bst-drops-section {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.bst-title-preview-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 14px;
  border-radius: 10px;
  border: 1px solid rgba(251, 191, 36, 0.5);
  background: radial-gradient(circle at center, rgba(120, 53, 15, 0.45) 0%, rgba(18, 15, 26, 0.95) 80%);
}

.bst-overhead-title-line {
  font-size: 16px;
  font-weight: 800;
  color: #fde047;
}

.bst-overhead-name-line {
  font-size: 15px;
  font-weight: 700;
  color: #f7f2e8;
}

.bst-titles-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 12px;
}

.bst-title-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 14px;
  border-radius: 8px;
  border: 1px solid rgba(148, 111, 71, 0.42);
  background: rgba(22, 19, 31, 0.9);
  opacity: 0.78;
}

.bst-title-card.is-unlocked {
  opacity: 1;
  border-color: rgba(52, 211, 153, 0.5);
}

.bst-title-card.is-active-title {
  opacity: 1;
  border-color: #fbbf24;
  box-shadow: 0 0 14px rgba(251, 191, 36, 0.32);
}

.bst-title-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.bst-title-name {
  font-size: 15px;
  font-weight: 800;
  color: #fef3c7;
}

.bst-title-req {
  font-size: 13px;
  color: rgba(247, 242, 232, 0.8);
  margin-bottom: auto;
}

@media (max-width: 1120px) {
  .pf-coop-hud-stack {
    right: 16px;
    top: 230px;
  }
  .pf-filter-bar,
  .bst-filter-row,
  .bst-split-layout {
    grid-template-columns: 1fr;
  }
}