/* ════ Gece Mührü v1.2.6 ════
   1) Sistem çubukları (3 tuşlu / hareketli gezinme, durum çubuğu) için güvenli alan — tüm ekran ve pencereler.
   2) Premium görünüm: sağlam üst çubuk, alt sekme çubuğu, Mühür Dünyası kartları, üst HUD, süslü güçlendirici tepsisi.
   3) Vadiye özgü resimsel haritalar + canlı ortam + oyma taş/pirinç yol ve düğümler.
   4) Klan Sohbeti: sekme, kayan panel, okunmamış rozeti, Dünya Sohbeti geçişi.
   Özgün Gece Mührü kimliği: gece siyahı + pirinç/altın + balmumu kırmızısı. */

/* ───────── 1) Güvenli alan ───────── */
html { --tab-h: 64px; }
.view { padding-left: calc(16px + var(--safe-l)); padding-right: calc(16px + var(--safe-r)); padding-top: calc(76px + var(--safe-t)); padding-bottom: calc(var(--tab-h) + 32px + var(--safe-b)); }
body.is-immersive .view { padding: var(--safe-t) 4px calc(24px + var(--safe-b)); }
/* Kendi güvenli alanını veren tam ekranlar: çift üst/alt boşluk yok */
body.is-immersive[data-screen="muhur"] .view, body.is-immersive[data-screen="seviye"] .view { padding: 0 var(--safe-r) 0 var(--safe-l); }
.lv { padding-bottom: calc(86px + var(--safe-b)); }
#toasts { top: calc(72px + var(--safe-t)); }
body.is-immersive #toasts, body.has-modal #toasts { top: calc(12px + var(--safe-t)); }
.offline { bottom: calc(var(--tab-h) + 14px + var(--safe-b)); }
.modal__card { max-height: calc(100dvh - 16px - var(--safe-t)); padding-bottom: calc(14px + var(--safe-b)); }
.modal.modal--m3x .modal__card { max-height: calc(100dvh - 40px - var(--safe-t)); }
.nb__book { height: min(86dvh, calc(100dvh - 72px - var(--safe-t)), 760px); padding-bottom: calc(8px + var(--safe-b)); }
body:has(.nb) #toasts { top: calc(10px + var(--safe-t)); }
.store-sim__sheet { padding-bottom: calc(22px + var(--safe-b)); }
.splash__inner { padding-bottom: calc(44px + var(--safe-b)); }
.intro { padding-bottom: calc(28px + var(--safe-b)); padding-top: calc(24px + var(--safe-t)); }

/* ───────── 2a) Üst çubuk: sağlam, süslü alt kenar (içerik altından görünmez) ───────── */
.topbar { padding: calc(10px + var(--safe-t)) calc(12px + var(--safe-r)) 10px calc(12px + var(--safe-l));
  background: linear-gradient(180deg, #07090c 0%, #0b0f13 70%, #0e1217 100%); backdrop-filter: none; -webkit-backdrop-filter: none;
  box-shadow: 0 1px 0 rgba(214,178,106,.55), 0 2px 0 #050608, 0 10px 22px rgba(0,0,0,.65); }
.topbar::after { content: ''; position: absolute; left: 50%; bottom: -7px; width: 64px; height: 12px; transform: translateX(-50%); pointer-events: none;
  background: radial-gradient(circle at 50% 50%, #ffe7a8 0 2.5px, #b4893f 3px 4px, transparent 4.5px), linear-gradient(90deg, transparent, #d6b26a 30%, #d6b26a 70%, transparent) center / 100% 1px no-repeat; filter: drop-shadow(0 0 4px rgba(255,214,140,.6)); }

/* ───────── 2b) Alt sekme çubuğu: lake + pirinç ray ───────── */
.tabbar { padding: 7px calc(6px + var(--safe-r)) calc(7px + var(--safe-b)) calc(6px + var(--safe-l));
  background: linear-gradient(180deg, #12171d 0%, #0a0d11 55%, #07090c 100%); backdrop-filter: none; -webkit-backdrop-filter: none; border-top: 0;
  box-shadow: 0 -1px 0 rgba(214,178,106,.6), 0 -2px 0 #050608, 0 -12px 26px rgba(0,0,0,.6); }
.tabbar::before { content: ''; position: absolute; left: 10%; right: 10%; top: -1px; height: 1px; background: linear-gradient(90deg, transparent, #fff1c4, transparent); opacity: .7; pointer-events: none; }
.tabbar__t { padding: 5px 0 4px; min-height: 50px; border-radius: 14px; }
.tabbar__t.is-on { background: radial-gradient(80% 90% at 50% 0%, rgba(214,178,106,.22), transparent 70%); }
.tabbar__t.is-on .ico { filter: drop-shadow(0 0 6px rgba(255,214,140,.7)); }
.tabbar__t.is-on::before { top: -7px; width: 30px; }
.tabbar__t span { white-space: nowrap; font-size: 10.5px; }

/* ───────── 2c) Mühür Dünyası kartları ───────── */
.m3w__top h1 { background: linear-gradient(180deg, #fffbe8, #ffd36a 55%, #b9822a); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; filter: drop-shadow(0 2px 0 #2a1a06); }
.m3-chip { background: linear-gradient(180deg, #1b1610, #0c0a07); border: 0; box-shadow: 0 0 0 1px #8c6a2f, inset 0 1px 0 rgba(255,240,200,.15); padding: 5px 10px; }
.m3w__hero { border: 0; border-radius: 22px; min-height: 250px; box-shadow: 0 0 0 2px #1a1108, 0 0 0 3.5px #c9a35a, 0 0 0 6px #2a1d0b, 0 0 0 7px rgba(214,178,106,.3), 0 22px 44px -12px rgba(0,0,0,.85); }
.m3w__hero::before { background: var(--bg) center 22% / cover no-repeat; animation: m3mapdrift 36s ease-in-out infinite alternate; }
.m3w__hero::after { background: linear-gradient(180deg, rgba(7,9,12,0) 20%, rgba(7,9,12,.55) 55%, rgba(7,9,12,.95) 88%), radial-gradient(120% 80% at 50% 0%, transparent 50%, rgba(0,0,0,.45)); }
.m3w__hero-body h2 { background: linear-gradient(180deg, #fffbe8, #f1d79a 60%, #c8963c); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; filter: drop-shadow(0 2px 0 #1a1006); }
.m3w__hero-body h2 em { -webkit-text-fill-color: #ff8b7a; }
.m3w__hero .btn--gold { position: relative; overflow: hidden; overflow: clip; min-width: 150px; box-shadow: 0 0 0 2px #3a2606, 0 5px 0 #3a2606, 0 10px 22px rgba(0,0,0,.55), 0 0 22px rgba(255,214,120,.35), inset 0 2px 0 rgba(255,255,255,.65); }
.m3w__hero .btn--gold::after { content: ''; position: absolute; top: 0; bottom: 0; width: 40%; left: -60%; background: linear-gradient(100deg, transparent, rgba(255,255,255,.6), transparent); animation: m3shine 3s ease-in-out infinite; }

.m3w__story { position: relative; margin-top: 14px; padding: 16px 16px 14px 18px; border-radius: 20px;
  background: radial-gradient(120% 90% at 0% 0%, rgba(214,178,106,.16), transparent 55%), linear-gradient(180deg, #1f1810, #0f0c09);
  box-shadow: 0 0 0 1.5px #b48d47, 0 0 0 4px #17110a, 0 0 0 5px rgba(214,178,106,.35), 0 16px 34px -10px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,240,200,.12); }
.m3w__story::before { content: ''; position: absolute; right: 12px; top: -12px; width: 38px; height: 38px; border-radius: 50%;
  background: radial-gradient(circle at 38% 32%, #e2574c, #8e1b1b 60%, #4a0a0a); box-shadow: 0 3px 8px rgba(0,0,0,.6), inset 0 -3px 5px rgba(0,0,0,.4), inset 0 2px 2px rgba(255,200,190,.4); }
.m3w__story::after { content: '✦'; position: absolute; right: 23px; top: -4px; color: #ffd2c9; font-size: 16px; text-shadow: 0 1px 0 #4a0a0a; }
.m3w__story h3 { font-size: 21px; background: linear-gradient(180deg, #fffbe8, #f1d79a 60%, #c8963c); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; padding-right: 40px; }
.m3w__story p { font: italic 500 14px/1.55 var(--f-ui); color: #e6dcc6; }
.m3w__story p::first-letter { font: 700 30px/0.8 var(--f-display); color: var(--gold-hi); float: left; margin: 4px 6px 0 0; }
.m3w__story small { display: block; margin-top: 8px; padding-top: 8px; border-top: 1px solid rgba(214,178,106,.2); color: #c8b994; font-size: 12px; }

.m3-build { margin-top: 14px; border: 0; border-radius: 20px; padding: 16px; box-shadow: 0 0 0 1.5px #b48d47, 0 0 0 4px #17110a, 0 0 0 5px rgba(214,178,106,.35), 0 16px 34px -10px rgba(0,0,0,.8); }
.m3-build::before { opacity: .5; filter: saturate(1.1); }
.m3-build::after { background: linear-gradient(90deg, rgba(12,10,7,.95) 30%, rgba(12,10,7,.7)), linear-gradient(180deg, transparent 60%, rgba(0,0,0,.4)); }
.m3-build__head img { width: 62px; height: 62px; border: 0; padding: 2px; background: conic-gradient(from 200deg, #6b4f1f, #fff1c4, #b4893f, #fff1c4, #6b4f1f); box-shadow: 0 6px 14px rgba(0,0,0,.6); }
.m3-build h3 { background: linear-gradient(180deg, #fffbe8, #f1d79a 60%, #c8963c); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.m3-build .bar { height: 10px; border-radius: 99px; background: #050608; box-shadow: inset 0 1px 3px #000, 0 0 0 1px rgba(214,178,106,.5); overflow: hidden; }
.m3-build .bar i { display: block; height: 100%; transform-origin: left; background: linear-gradient(180deg, #fff1c4, #d6a948 55%, #8c6a2f); box-shadow: 0 0 10px rgba(255,214,120,.6); }
.m3-build p.small { font-style: italic; color: #e6dcc6; }

.m3w__regions { gap: 10px; margin-top: 14px; }
.m3-region { min-height: 92px; border: 0; border-radius: 16px; padding: 40px 9px 9px; box-shadow: 0 0 0 1px #0b0805, 0 0 0 2.5px #8c6a2f, 0 10px 20px -6px rgba(0,0,0,.8), inset 0 0 0 1px rgba(255,240,200,.08); }
.m3-region::before { transition: transform .5s; }
.m3-region::after { background: linear-gradient(180deg, rgba(7,9,12,0) 20%, rgba(7,9,12,.92) 85%); }
.m3-region b { font: 700 14px/1.15 var(--f-display); color: #fff1c4; text-shadow: 0 1px 2px #000; }
.m3-region small { font-weight: 700; color: #c8b994; }
.m3-region.is-open { box-shadow: 0 0 0 1px #0b0805, 0 0 0 2.5px #f1d79a, 0 0 18px rgba(255,214,120,.45), 0 10px 20px -6px rgba(0,0,0,.8); }
.m3-region.is-done { border: 0; box-shadow: 0 0 0 1px #0b0805, 0 0 0 2.5px #5fbf86, 0 10px 20px -6px rgba(0,0,0,.8); }
.m3-region.is-done > b::after { content: ' ✓'; color: #8fe0a8; }
.m3-region.is-lock > b::before { content: ''; display: block; width: 18px; height: 18px; margin-bottom: 4px; opacity: .85;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d6b26a' stroke-width='2'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E") center / contain no-repeat; }

.m3w__links { gap: 10px; margin-top: 16px; }
.m3-link { position: relative; grid-template-columns: 44px 1fr; column-gap: 10px; padding: 12px 12px 12px 10px; border: 0; border-radius: 16px;
  background: radial-gradient(120% 120% at 0% 0%, rgba(214,178,106,.14), transparent 55%), linear-gradient(180deg, #1b1610, #0d0b08);
  box-shadow: 0 0 0 1px #0b0805, 0 0 0 2px rgba(180,141,71,.75), 0 10px 20px -8px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,240,200,.1); }
.m3-link .ico { width: 44px; height: 44px; padding: 10px; border-radius: 50%; color: #2a1a06; background: radial-gradient(circle at 40% 30%, #fffbe8, #f1d79a 40%, #b4893f 85%); box-shadow: 0 0 0 1.5px #3a2606, 0 4px 8px rgba(0,0,0,.6), inset 0 -3px 4px rgba(0,0,0,.25); }
.m3-link b { font: 700 16px/1.1 var(--f-display); color: #fff1c4; }
.m3-link small { color: #b8ab8c; font-size: 11.5px; }
.m3-link::after { content: '›'; position: absolute; right: 12px; top: 50%; transform: translateY(-52%); font: 700 20px var(--f-ui); color: rgba(214,178,106,.7); }
.m3-link:active { transform: translateY(1px); }

/* ───────── 3) Vadi haritaları ───────── */
@keyframes m3mapdrift { from { transform: scale(1.02); } to { transform: scale(1.08) translateY(-1.2%); } }
.m3w__trail { --road: #5b4a36; --rim: rgba(255,210,140,.28); --lbl: #2a1d0b;
  margin: 18px -4px 10px; padding: 16px 0 18px; border-radius: 26px; isolation: isolate; overflow: hidden;
  box-shadow: 0 0 0 2px #120c06, 0 0 0 3.5px #c9a35a, 0 0 0 6px #22170a, 0 0 0 7px rgba(214,178,106,.35), 0 26px 50px -12px rgba(0,0,0,.9); }
.m3w__trail::before { z-index: -3; background: var(--map) center bottom / cover no-repeat; transform-origin: 50% 70%; animation: m3mapdrift 42s ease-in-out infinite alternate; }
.m3w__trail::after { z-index: -2; background: radial-gradient(130% 70% at 50% 50%, transparent 45%, rgba(4,5,8,.6) 100%), linear-gradient(180deg, rgba(4,5,8,.62), transparent 16%, transparent 84%, rgba(4,5,8,.75)); }
.m3w__trail[data-valley="liman"] { --road: #4e4334; --rim: rgba(120,220,230,.30); }
.m3w__trail[data-valley="orman"] { --road: #4a3a24; --rim: rgba(255,170,80,.30); }
.m3w__trail[data-valley="col"] { --road: #8a6a3a; --rim: rgba(255,214,130,.32); }
.m3w__trail[data-valley="dag"] { --road: #3a2b24; --rim: rgba(255,96,30,.50); }
.m3w__trail[data-valley="magara"] { --road: #3b3350; --rim: rgba(190,130,255,.42); }
.m3w__trail[data-valley="kule"] { --road: #2a1c20; --rim: rgba(255,50,50,.42); }

.m3w__banner { position: relative; z-index: 2; width: max-content; max-width: 86%; margin: 0 auto 6px; padding: 7px 34px 9px; text-align: center; border-radius: 14px;
  background: linear-gradient(180deg, rgba(24,18,10,.94), rgba(8,6,4,.94));
  box-shadow: 0 0 0 1.5px #c9a35a, 0 0 0 4px rgba(10,7,3,.92), 0 0 0 5px rgba(214,178,106,.45), 0 12px 24px rgba(0,0,0,.65), inset 0 1px 0 rgba(255,240,200,.15); }
.m3w__banner::before, .m3w__banner::after { content: ''; position: absolute; top: 50%; width: 12px; height: 12px; transform: translateY(-50%) rotate(45deg); background: linear-gradient(135deg, #fff1c4, #b4893f); box-shadow: 0 0 0 2px #120c06, 0 0 10px rgba(255,214,120,.6); }
.m3w__banner::before { left: 12px; } .m3w__banner::after { right: 12px; }
.m3w__banner small { display: block; font: 800 10px var(--f-ui); letter-spacing: .26em; text-transform: uppercase; color: var(--node, #d6b26a); text-shadow: 0 0 8px currentColor; }
.m3w__banner b { display: block; margin: 1px 0 0; padding: 0; font: 700 25px/1.1 var(--f-display); clip-path: none; box-shadow: none;
  background: linear-gradient(180deg, #fffbe8, #f1d79a 55%, #c8963c); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; text-shadow: none; filter: drop-shadow(0 2px 0 #1a1006); }
.m3w__banner span { display: block; font: 600 11px var(--f-ui); color: #c8b994; }
.m3w__inf { position: relative; z-index: 2; margin: 2px 0 4px; font-size: 11px; color: rgba(255,231,176,.8); letter-spacing: .04em; }
.m3w__road { position: relative; z-index: 1; }
.m3w__dots { z-index: 0; overflow: visible; }
.m3w__dots path { fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: none; }
.m3w__dots .m3w__r0 { stroke: var(--rim); stroke-width: 30; filter: blur(3px); }
.m3w__dots .m3w__r1 { stroke: var(--road); stroke-width: 18; opacity: .92; filter: drop-shadow(0 3px 2px rgba(0,0,0,.7)); }
.m3w__dots .m3w__r2 { stroke: rgba(255,231,168,.55); stroke-width: 2.2; stroke-dasharray: 1 11; }
.m3w__dots .m3w__r3 { stroke: #ffd77a; stroke-width: 5; opacity: .9; filter: drop-shadow(0 0 5px rgba(255,200,90,.9)); }
.m3w__path li > span { width: 56px; height: 56px; top: 3px; font: 900 18px var(--f-ui); color: #e9e3d6;
  background: radial-gradient(circle at 38% 30%, #4a535b, #1a2027 62%, #0b0e12);
  box-shadow: 0 0 0 2px #120c06, 0 0 0 4.5px #b4893f, 0 0 0 6px #2a1d0b, 0 8px 14px rgba(0,0,0,.75), inset 0 2px 1px rgba(255,255,255,.22), inset 0 -7px 10px rgba(0,0,0,.6); }
.m3w__path li.is-done > span { color: #fff; -webkit-text-stroke: .6px rgba(0,0,0,.6); text-shadow: 0 2px 0 rgba(0,0,0,.55);
  background: radial-gradient(circle at 36% 26%, #fff 0 4%, transparent 14%), radial-gradient(circle at 50% 45%, var(--node), #1a1208 92%);
  background: radial-gradient(circle at 36% 26%, #fff 0 4%, transparent 14%), radial-gradient(circle at 42% 32%, color-mix(in srgb, var(--node) 70%, #fff), var(--node) 42%, color-mix(in srgb, var(--node) 35%, #000) 92%);
  box-shadow: 0 0 0 2px #120c06, 0 0 0 4.5px #f1d79a, 0 0 0 6px #3a2808, 0 0 14px color-mix(in srgb, var(--node) 50%, transparent), 0 8px 14px rgba(0,0,0,.7), inset 0 -6px 10px rgba(0,0,0,.35); }
.m3w__path li.is-cur > span { width: 68px; height: 68px; top: -3px; font-size: 23px; color: #2a1a06;
  background: radial-gradient(circle at 36% 28%, #fff 0 5%, transparent 16%), radial-gradient(circle at 42% 32%, #fffbe8, #f1d79a 38%, #c8963c 78%, #7a5420);
  box-shadow: 0 0 0 2.5px #3a2606, 0 0 0 6px #ffe7a8, 0 0 0 7.5px #6b4a14, 0 0 30px 8px rgba(255,210,120,.55), 0 10px 16px rgba(0,0,0,.7), inset 0 -6px 10px rgba(122,84,32,.5); }
.m3w__halo { position: absolute; z-index: -1; top: -17px; left: calc(var(--x) * 1%); width: 96px; height: 96px; margin-left: -48px; border-radius: 50%; pointer-events: none;
  background: repeating-conic-gradient(from 0deg, rgba(255,231,168,.55) 0 6deg, transparent 6deg 18deg); -webkit-mask: radial-gradient(circle, transparent 36px, #000 37px, #000 46px, transparent 48px); mask: radial-gradient(circle, transparent 36px, #000 37px, #000 46px, transparent 48px);
  animation: m3halo 14s linear infinite; filter: drop-shadow(0 0 6px rgba(255,214,120,.8)); }
@keyframes m3halo { to { transform: rotate(360deg); } }
.m3w__path li.is-boss > span { width: 62px; height: 66px; top: 0; border-radius: 18px 18px 50% 50% / 18px 18px 46% 46%;
  background: radial-gradient(circle at 50% 30%, #5a1c1c, #1a0808 75%);
  box-shadow: 0 0 0 2px #120606, 0 0 0 4.5px #e2574c, 0 0 0 6.5px #f1d79a, 0 0 0 8px #3a0d0d, 0 0 22px rgba(226,87,76,.65), 0 10px 16px rgba(0,0,0,.75); animation: m3bossp 2.4s ease-in-out infinite; }
.m3w__path li.is-boss > span::before { content: ''; position: absolute; z-index: 2; top: -1px; left: 50%; width: 14px; height: 14px; margin-left: -7px; transform: rotate(45deg); background: linear-gradient(135deg, #fff1c4, #b4893f); box-shadow: 0 0 0 2px #3a0d0d; }
.m3w__path li.is-boss.is-cur > span { animation: m3bossp 2.4s ease-in-out infinite, none; }
@keyframes m3bossp { 50% { box-shadow: 0 0 0 2px #120606, 0 0 0 4.5px #ff7a6a, 0 0 0 6.5px #fff1c4, 0 0 0 8px #3a0d0d, 0 0 34px 6px rgba(255,90,74,.75), 0 10px 16px rgba(0,0,0,.75); } }
.m3w__path li.is-lock > span { filter: saturate(.35) brightness(.72); color: #a9a196; }
.m3w__path li.is-lock.is-boss > span { filter: saturate(.6) brightness(.8); }
.m3w__path li.is-valley > span::after { box-shadow: inset 0 0 0 3px var(--node); }
.m3w__path li > i { top: 58px; font-size: 12px; color: #ffe08a; letter-spacing: 0; padding: 0 5px; border-radius: 99px; background: rgba(10,7,3,.75); box-shadow: 0 0 0 1px rgba(214,178,106,.5); line-height: 15px; }
.m3w__path li > em { top: 16px; left: calc(var(--x) * 1% + 42px); padding: 4px 10px; border-radius: 8px; font: 800 11px var(--f-ui); color: #fff1c4;
  background: linear-gradient(180deg, rgba(30,22,12,.95), rgba(10,8,5,.95)); box-shadow: 0 0 0 1px #b4893f, 0 4px 10px rgba(0,0,0,.6); }
.m3w__path li.is-right > em { right: calc((100 - var(--x)) * 1% + 42px); }
.m3w__path li > em.is-bossl { color: #ffe0da; background: linear-gradient(180deg, #8e1b1b, #4a0a0a); box-shadow: 0 0 0 1px #f1d79a, 0 4px 10px rgba(0,0,0,.6); }
.m3w__path li.is-valley > em { color: #fff; background: linear-gradient(180deg, color-mix(in srgb, var(--node) 70%, #000), color-mix(in srgb, var(--node) 35%, #000)); box-shadow: 0 0 0 1px #f1d79a, 0 4px 10px rgba(0,0,0,.6); }

/* Canlı ortam katmanı */
.m3w__amb { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.m3w__amb > i { position: absolute; left: var(--l); top: var(--t); width: calc(5px * var(--z)); height: calc(5px * var(--z)); border-radius: 50%; opacity: 0; animation: m3fly var(--d) ease-in-out var(--w) infinite; }
.m3w__amb > b { position: absolute; display: none; }
.m3w__fog { inset: -10% -60% -10% -10%; background: radial-gradient(30% 14% at 25% 72%, var(--fog, rgba(210,220,230,.20)), transparent 70%), radial-gradient(26% 12% at 70% 40%, var(--fog, rgba(210,220,230,.16)), transparent 70%), radial-gradient(34% 12% at 45% 92%, var(--fog, rgba(210,220,230,.22)), transparent 70%); animation: m3fogd 38s ease-in-out infinite alternate; }
.m3w__fog--2 { animation-duration: 54s; animation-direction: alternate-reverse; transform: scaleY(-1); opacity: .8; }
@keyframes m3fogd { from { transform: translateX(-12%); } to { transform: translateX(14%); } }
.m3w__fog--2 { animation-name: m3fogd2; } @keyframes m3fogd2 { from { transform: scaleY(-1) translateX(10%); } to { transform: scaleY(-1) translateX(-14%); } }
.m3w__rays { inset: -20% -20% 30% -20%; background: repeating-linear-gradient(105deg, transparent 0 38px, var(--ray, rgba(255,230,170,.10)) 38px 64px, transparent 64px 120px); -webkit-mask: linear-gradient(180deg, #000, transparent 85%); mask: linear-gradient(180deg, #000, transparent 85%); animation: m3rays 9s ease-in-out infinite alternate; }
@keyframes m3rays { from { opacity: .45; transform: translateX(-3%); } to { opacity: 1; transform: translateX(3%); } }
.m3w__shim { left: 0; right: 0; bottom: 0; height: 30%; background: repeating-linear-gradient(180deg, transparent 0 7px, rgba(170,235,245,.10) 7px 8px, transparent 8px 15px), linear-gradient(90deg, transparent, rgba(170,235,245,.10), transparent) 0 0 / 50% 100%; -webkit-mask: linear-gradient(180deg, transparent, #000 40%); mask: linear-gradient(180deg, transparent, #000 40%); animation: m3shim 6s linear infinite; }
@keyframes m3shim { to { background-position: 0 30px, 200% 0; } }
@keyframes m3fly { 0% { opacity: 0; transform: translate(0, 0) scale(.6); } 20% { opacity: 1; } 50% { transform: translate(14px, -22px) scale(1); } 80% { opacity: .9; } 100% { opacity: 0; transform: translate(-10px, -44px) scale(.6); } }
@keyframes m3rise { 0% { opacity: 0; transform: translate(0, 0) scale(1); } 12% { opacity: 1; } 100% { opacity: 0; transform: translate(22px, -340px) scale(.4); } }
@keyframes m3twinkle { 0%, 100% { opacity: 0; transform: scale(.3) rotate(45deg); } 50% { opacity: 1; transform: scale(1.1) rotate(45deg); } }
@keyframes m3dust { 0% { opacity: 0; transform: translate(-20px, 0); } 30% { opacity: .8; } 100% { opacity: 0; transform: translate(80px, -16px); } }
/* vadi başına */
[data-amb="lantern"] > i { background: radial-gradient(circle, #fff6c8, #ffbf4a 45%, transparent 70%); box-shadow: 0 0 10px 3px rgba(255,190,80,.55); }
[data-amb="lantern"] .m3w__fog, [data-amb="lantern"] .m3w__rays { display: block; }
[data-amb="harbor"] { --fog: rgba(190,225,230,.30); }
[data-amb="harbor"] > i { background: radial-gradient(circle, #e8ffff, #7fe0ea 50%, transparent 72%); box-shadow: 0 0 8px 2px rgba(120,220,230,.5); }
[data-amb="harbor"] .m3w__fog, [data-amb="harbor"] .m3w__shim { display: block; }
[data-amb="firefly"] { --fog: rgba(255,200,140,.12); --ray: rgba(255,214,140,.09); }
[data-amb="firefly"] > i { background: radial-gradient(circle, #f6ffd0, #c8f060 45%, transparent 70%); box-shadow: 0 0 10px 4px rgba(200,240,96,.5); }
[data-amb="firefly"] .m3w__fog, [data-amb="firefly"] .m3w__rays { display: block; }
[data-amb="dust"] { --ray: rgba(255,214,140,.13); }
[data-amb="dust"] > i { width: calc(3px * var(--z)); height: calc(3px * var(--z)); background: #ffe1a8; box-shadow: 0 0 6px rgba(255,210,140,.7); animation-name: m3dust; }
[data-amb="dust"] .m3w__rays { display: block; }
[data-amb="ember"] { --fog: rgba(60,40,36,.35); }
[data-amb="ember"] > i, [data-amb="bloodmoon"] > i { top: calc(55% + var(--t) * .45); width: calc(4px * var(--z)); height: calc(4px * var(--z)); background: radial-gradient(circle, #fff3c0, #ff8a2a 50%, transparent 72%); box-shadow: 0 0 8px 2px rgba(255,120,40,.7); animation-name: m3rise; }
[data-amb="ember"] .m3w__fog { display: block; }
[data-amb="crystal"] { --fog: rgba(170,130,255,.16); --ray: rgba(200,170,255,.10); }
[data-amb="crystal"] > i { border-radius: 2px; width: calc(6px * var(--z)); height: calc(6px * var(--z)); background: linear-gradient(135deg, #fff, #d8b8ff 50%, #8a5ae0); box-shadow: 0 0 10px 3px rgba(190,140,255,.6); animation-name: m3twinkle; }
[data-amb="crystal"] .m3w__fog, [data-amb="crystal"] .m3w__rays, [data-amb="crystal"] .m3w__shim { display: block; }
[data-amb="crystal"] .m3w__shim { bottom: 18%; height: 34%; filter: hue-rotate(60deg); }
[data-amb="bloodmoon"] { --fog: rgba(150,30,40,.22); }
[data-amb="bloodmoon"] > i { background: radial-gradient(circle, #ffd0c0, #ff3a2a 50%, transparent 72%); box-shadow: 0 0 8px 2px rgba(255,40,30,.65); }
[data-amb="bloodmoon"] .m3w__fog { display: block; }
html.reduce-motion .m3w__amb > i, html.reduce-motion .m3w__amb > b, html.reduce-motion .m3w__halo, html.reduce-motion .m3w__trail::before { animation-duration: 0s !important; animation-play-state: paused; }

/* ───────── 2d) Mühür Dünyası seviye: tam yükseklik, üst HUD, süslü güçlendirici tepsisi ───────── */
.m3l { height: 100vh; height: 100dvh; min-height: 0; overflow: hidden; padding: calc(8px + var(--safe-t)) 8px 0; gap: 6px; }
.m3l__top { margin: calc(-8px - var(--safe-t)) -8px 2px; padding: calc(18px + var(--safe-t)) 10px 12px; flex: none;
  background: radial-gradient(70% 120% at 50% 0%, rgba(255,230,170,.14), transparent 60%), repeating-linear-gradient(92deg, rgba(0,0,0,.08) 0 3px, transparent 3px 11px), linear-gradient(180deg, #3d2814, #24170b 60%, #160e06);
  border-radius: 0 0 28px 28px; box-shadow: inset 0 -3px 0 #8c6a2f, inset 0 -5px 0 #2a1d0b, 0 4px 0 #d6b26a, 0 6px 0 #5a4016, 0 14px 26px rgba(0,0,0,.7); }
.m3l__top::after { content: ''; position: absolute; left: 50%; bottom: -13px; width: 34px; height: 18px; transform: translateX(-50%); pointer-events: none;
  background: radial-gradient(circle at 50% 30%, #fff1c4 0 3px, #d6a948 3.5px 6px, #5a4016 6.5px 7.5px, transparent 8px); filter: drop-shadow(0 2px 2px rgba(0,0,0,.6)); }
.m3l__lv { top: calc(2px + var(--safe-t)); padding: 1px 14px 2px; border-radius: 0 0 10px 10px; background: linear-gradient(180deg, #1a1108, #0b0805); box-shadow: 0 0 0 1px #8c6a2f; color: #ffe7b0; font: 800 10px var(--f-ui); letter-spacing: .16em; }
.m3l__top > .icon-btn { flex: none; width: 40px; height: 40px; color: #ffe7b0; background: radial-gradient(circle at 40% 30%, #4a3518, #150f07 72%); border: 0; box-shadow: 0 0 0 1.5px #2a1d0b, 0 0 0 3px #b4893f, 0 4px 8px rgba(0,0,0,.6); }
.m3l__boardwrap { flex: 1 1 auto; min-height: 0; padding: 16px 6px 22px; }
.m3l__board { width: min(100% - 8px, calc((100dvh - 290px - var(--safe-t) - var(--safe-b)) * 8 / 9), 460px); }
.m3l__hintbar { flex: none; }
/* Tepsi: ekranın altına kadar uzanan oymalı ceviz + pirinç ray; düğmeler sistem çubuğunun üstünde kalır. */
.m3l__boosters { flex: none; position: relative; z-index: 5; margin: 0 -8px; gap: 18px; align-items: flex-start;
  padding: 16px calc(14px + var(--safe-r)) calc(28px + var(--safe-b)) calc(14px + var(--safe-l)); border-radius: 30px 30px 0 0;
  background: radial-gradient(60% 90% at 50% 0%, rgba(255,230,170,.16), transparent 60%), repeating-linear-gradient(88deg, rgba(0,0,0,.09) 0 3px, transparent 3px 12px), linear-gradient(180deg, #3d2814, #24170b 55%, #120b05);
  box-shadow: inset 0 3px 0 #8c6a2f, inset 0 5px 0 #2a1d0b, 0 -4px 0 #d6b26a, 0 -6px 0 #5a4016, 0 -14px 26px rgba(0,0,0,.6); }
.m3l__boosters::before { content: ''; position: absolute; left: 50%; top: -14px; width: 34px; height: 18px; transform: translateX(-50%); pointer-events: none;
  background: radial-gradient(circle at 50% 70%, #fff1c4 0 3px, #d6a948 3.5px 6px, #5a4016 6.5px 7.5px, transparent 8px); filter: drop-shadow(0 -1px 2px rgba(0,0,0,.6)); }
.m3l__boosters::after { content: ''; position: absolute; left: 18px; right: 18px; bottom: calc(10px + var(--safe-b)); height: 2px; border-radius: 2px; background: linear-gradient(90deg, transparent, rgba(214,178,106,.6), transparent); pointer-events: none; }
.m3-bb { width: 66px; height: 66px; margin-bottom: 20px; }
.m3-bb small { bottom: -22px; padding: 1px 8px 2px; border-radius: 8px; background: linear-gradient(180deg, #1a1108, #0b0805); box-shadow: 0 0 0 1px #8c6a2f; font-size: 10.5px; }
.m3l__chat { position: relative; }
@media (max-height: 720px) {
  .m3l__top { min-height: 74px; padding-bottom: 8px; }
  .m3l__boosters { padding-top: 12px; padding-bottom: calc(22px + var(--safe-b)); gap: 14px; }
  .m3-bb { width: 54px; height: 54px; margin-bottom: 18px; } .m3-bb svg { width: 32px; height: 32px; }
  .m3l__boardwrap { padding: 12px 6px 16px; }
  .m3l__board { width: min(100% - 8px, calc((100dvh - 252px - var(--safe-t) - var(--safe-b)) * 8 / 9), 460px); }
}

/* Dedektif seviye alt çubuğu */
.lv__foot { padding-bottom: calc(10px + var(--safe-b)); padding-left: calc(14px + var(--safe-l)); padding-right: calc(14px + var(--safe-r)); }

/* ═════════ v1.2.6 · Klan Sohbeti / Dünya Sohbeti (ortak görünüm, sekme + kayan panel) ═════════ */
.chat-badge { position: absolute; top: -4px; right: -6px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; display: inline-grid; place-items: center;
  font: 800 10.5px/1 var(--f-ui); color: #fff; background: linear-gradient(180deg, #ff5a4a, #c0261b); box-shadow: 0 0 0 1.5px #1a0d06, 0 2px 6px rgba(192,38,27,.55); pointer-events: none; }
.chat-badge[hidden] { display: none; }
.tabbar__t { position: relative; }
.tabbar__t .chat-badge { top: 2px; right: calc(50% - 22px); }
.card-social nav a { position: relative; }
.card-social nav a .chat-badge { top: 2px; right: 8px; }

/* küçük düğme (harita başlığı, seviye HUD'u, dedektif ekranları) */
.chat-btn { position: relative; flex: none; width: 40px; height: 40px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 50%; cursor: pointer; color: #ffe7b0;
  background: radial-gradient(circle at 40% 30%, #4a3518, #150f07 72%); box-shadow: 0 0 0 1.5px #2a1d0b, 0 0 0 3px #b4893f, 0 4px 8px rgba(0,0,0,.6); -webkit-tap-highlight-color: transparent; }
.chat-btn .ico { width: 20px; height: 20px; }
.chat-btn:active { transform: scale(.94); }
.m3w__top .chat-btn { order: 0; }
.m3l__top .chat-btn--hud { margin-left: auto; }
.chatfab { position: fixed; z-index: 40; right: calc(12px + var(--safe-r)); bottom: calc(var(--tab-h, 64px) + 14px + var(--safe-b)); }
.chatfab[hidden] { display: none; }
.chatfab .chat-btn { width: 48px; height: 48px; }
.chatfab .chat-btn .ico { width: 23px; height: 23px; }
body.is-immersive .chatfab { bottom: auto; top: calc(var(--safe-t) + 64px); right: calc(8px + var(--safe-r)); }
body.is-immersive .chatfab .chat-btn { width: 40px; height: 40px; opacity: .92; }
body.has-chat .chatfab { visibility: hidden; }

/* görünüm */
.chat { display: grid; gap: 10px; padding: 12px; border-radius: 22px; position: relative;
  background: linear-gradient(180deg, rgba(36,27,15,.96), rgba(13,10,8,.97)); box-shadow: inset 0 0 0 1px rgba(255,231,176,.08), 0 0 0 1.5px #6a4e22, 0 14px 34px rgba(0,0,0,.55); }
.chat::before { content: ''; position: absolute; inset: 5px; border-radius: 18px; border: 1px solid rgba(214,178,106,.18); pointer-events: none; }
.chat__head { display: flex; align-items: center; gap: 10px; }
.chat__title { flex: 1; min-width: 0; }
.chat__title h2 { font: 600 26px var(--f-display); background: linear-gradient(180deg, #fffbe8, #ffd36a 55%, #b9822a); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.chat__title small { display: block; color: var(--muted); font-size: 12px; min-height: 1em; }
.chat__seg { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 5px; border-radius: 16px; background: rgba(0,0,0,.4); box-shadow: inset 0 0 0 1px rgba(214,178,106,.22); }
.chat__seg button { position: relative; display: flex; align-items: center; justify-content: center; gap: 7px; padding: 10px 6px; border: 0; border-radius: 12px; cursor: pointer;
  background: transparent; color: var(--muted); font: 700 13px var(--f-ui); }
.chat__seg button .ico { width: 18px; height: 18px; }
.chat__seg button .chat-badge { top: -5px; right: -2px; }
.chat__seg button.is-on { color: #2a1a06; background: linear-gradient(180deg, #ffe7a3, #d9a443); box-shadow: 0 4px 14px rgba(217,164,67,.35); }
/* Dünya Sohbeti — öne çıkan geçiş */
.chat__seg .chat__world { color: #bfe3ff; background: linear-gradient(180deg, rgba(64,120,170,.28), rgba(24,52,80,.35)); box-shadow: inset 0 0 0 1px rgba(140,200,255,.35); }
.chat__seg .chat__world.is-on { color: #06192a; background: linear-gradient(180deg, #c8ecff, #5aa6dc); box-shadow: 0 4px 16px rgba(90,166,220,.45); }
.chat__body { display: grid; gap: 8px; min-height: 0; }
.chat .chat__log { margin: 0; height: max(220px, calc(100dvh - 420px - var(--safe-t) - var(--safe-b))); border-radius: 14px; background: rgba(0,0,0,.28); box-shadow: inset 0 0 0 1px rgba(214,178,106,.12); padding: 8px; }
.chat[data-channel="world"] .chat__log li.is-mine { background: linear-gradient(180deg, rgba(90,166,220,.3), rgba(90,166,220,.14)); }
.chat__noclan { display: grid; gap: 10px; justify-items: center; text-align: center; padding: 6px 4px 2px; }
.chat__crest { width: 64px; height: 64px; display: grid; place-items: center; border-radius: 50%; color: #2a1a06; background: radial-gradient(circle at 40% 30%, #ffe7a3, #b8862f 70%); box-shadow: 0 0 0 3px #2a1d0b, 0 0 0 5px #b4893f, 0 8px 18px rgba(0,0,0,.5); }
.chat__crest .ico { width: 30px; height: 30px; }
.chat__noclan h3 { font: 600 22px var(--f-display); color: var(--gold-hi); }
.chat__noclan p { margin: 0; font-size: 13px; color: var(--muted); }
.btn--world { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; padding: 13px 14px; border: 0; border-radius: 14px; cursor: pointer; font: 800 15px var(--f-ui); color: #06192a;
  background: linear-gradient(180deg, #d4f0ff, #5aa6dc); box-shadow: 0 0 0 1.5px #0b2a44, 0 6px 18px rgba(90,166,220,.4); }
.btn--world .ico { width: 20px; height: 20px; }
.chat__clans { list-style: none; margin: 0; padding: 0; width: 100%; display: grid; gap: 6px; }
.chat__clans li { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 12px; background: rgba(255,255,255,.05); text-align: left; }
.chat__clans li b { flex: 1; min-width: 0; font-size: 14px; } .chat__clans li b small { display: block; font-weight: 500; color: var(--muted); font-size: 11px; }
.chat__clans li.is-empty { justify-content: center; color: var(--muted); background: none; font-size: 13px; }
.chat__create { display: grid; grid-template-columns: 1fr auto; gap: 8px; width: 100%; }
.chat__create input { min-width: 0; padding: 11px 13px; border-radius: 12px; border: 1px solid rgba(214,178,106,.35); background: rgba(0,0,0,.4); color: inherit; font: inherit; }
.chat__more { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--gold-hi); }
.chat__more .ico { width: 15px; height: 15px; }
.so-chatlink { position: relative; display: flex; align-items: center; gap: 12px; margin-top: 10px; padding: 12px 14px; border-radius: 16px; text-decoration: none; color: inherit;
  background: linear-gradient(180deg, rgba(217,164,67,.18), rgba(217,164,67,.06)); box-shadow: inset 0 0 0 1px rgba(214,178,106,.4); }
.so-chatlink > .ico { width: 26px; height: 26px; color: var(--gold-hi); }
.so-chatlink span { display: grid; } .so-chatlink span small { color: var(--muted); font-size: 12px; }
.so-chatlink .chat-badge { top: 8px; right: 10px; }

/* kayan panel — oyunu kapatmaz; geri tuşu / dış alan kapatır */
.chat-panel { position: fixed; inset: 0; z-index: 120; display: flex; flex-direction: column; justify-content: flex-end; }
.chat-panel__scrim { position: absolute; inset: 0; background: rgba(4,3,2,.55); opacity: 0; transition: opacity .22s ease; }
.chat-panel__sheet { position: relative; max-height: calc(100dvh - var(--safe-t) - 40px); height: 76dvh; display: flex; flex-direction: column;
  padding: 8px calc(8px + var(--safe-r)) calc(8px + var(--safe-b)) calc(8px + var(--safe-l)); transform: translateY(102%); transition: transform .26s cubic-bezier(.2,.8,.2,1); }
.chat-panel.is-in .chat-panel__scrim { opacity: 1; }
.chat-panel.is-in .chat-panel__sheet { transform: none; }
.chat-panel__grip { display: block; width: 46px; height: 5px; margin: 0 auto 6px; border-radius: 3px; background: rgba(255,231,176,.45); }
.chat--panel { flex: 1; min-height: 0; grid-template-rows: auto auto 1fr; border-radius: 22px 22px 18px 18px; }
.chat--panel .chat__body { grid-template-rows: 1fr auto auto; }
.chat--panel .chat__log { height: auto; min-height: 120px; }
.chat--panel .chat__noclan { overflow-y: auto; align-content: start; }
.chat__x { flex: none; }
@media (prefers-reduced-motion: reduce) { .chat-panel__sheet, .chat-panel__scrim { transition: none; } }
.so--chat { padding-bottom: 8px; }
.so--chat .so-tabs { margin-bottom: 10px; }
.so--chat .chat .chat__log { height: max(200px, calc(100dvh - 548px - var(--safe-t) - var(--safe-b))); }

/* ════ v1.2.7 — Vadiye özel seviye arka planı + ortam katmanı (dekor yok) ════ */
.m3l { position: relative; isolation: isolate; }
.m3l::before { filter: saturate(1.12) brightness(1.05); animation-duration: 40s; }
.m3l::after { background: radial-gradient(100% 62% at 50% 50%, rgba(6,8,11,.3), rgba(6,8,11,.5) 85%), linear-gradient(180deg, rgba(6,8,11,.35), transparent 16%, transparent 80%, rgba(6,8,11,.6)); }
.m3l > .m3l__amb { position: absolute; inset: 0; z-index: -1; opacity: .9; contain: strict; }
.m3l > .m3l__amb > b { opacity: .55; }
html.reduce-motion .m3l::before { animation: none; }
html.reduce-motion .m3l > .m3l__amb > i, html.reduce-motion .m3l > .m3l__amb > b { animation: none !important; }
@media (prefers-reduced-motion: reduce) { .m3l > .m3l__amb > i, .m3l > .m3l__amb > b { animation: none !important; } }