/* ════ Mühür Dünyası v1.2.1 — premium tahta, sembol taşları, efektler, vadiler ve "Hamlen bitti" penceresi ════
   Özgün Gece Mührü kimliği: gece camgöbeği + pirinç/altın çerçeve + balmumu kırmızısı. Hareket azaltma tercihine uyar. */

/* ── Seviye ekranı: vadi arka planı ── */
.m3l { position: relative; isolation: isolate; background: #06080b; }
.m3l::before { content: ''; position: absolute; inset: 0; z-index: -2; background: var(--valley, none) center / cover no-repeat; filter: blur(2px) saturate(1.1); transform: scale(1.04); opacity: .55; }
.m3l::after { content: ''; position: absolute; inset: 0; z-index: -1; background: radial-gradient(110% 60% at 50% 45%, rgba(6,8,11,.25), rgba(6,8,11,.88) 75%), linear-gradient(180deg, rgba(6,8,11,.7), transparent 25%, transparent 70%, rgba(6,8,11,.9)); }
.m3l__moves { border-radius: 18px; background: radial-gradient(120% 90% at 50% 0%, #4a3518, #150f07 70%); border: 0; box-shadow: 0 0 0 2px #2a1d0b, 0 0 0 4px #d6b26a, 0 0 0 5px #6b4f1f, 0 8px 18px rgba(0,0,0,.6), inset 0 2px 0 rgba(255,240,200,.35); }
.m3l__moves b { font-size: 28px; text-shadow: 0 2px 0 #3a2508, 0 0 12px rgba(255,220,140,.5); }
.m3l__goals { background: linear-gradient(180deg, rgba(30,24,14,.9), rgba(10,9,7,.88)); border: 0; box-shadow: 0 0 0 1.5px #8c6a2f, 0 0 0 3px rgba(214,178,106,.25), 0 8px 18px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,240,200,.18); border-radius: 18px; }
.m3l__goals li b { font-size: 16px; text-shadow: 0 1px 2px #000; }
.m3-gi { width: 38px; height: 38px; filter: drop-shadow(0 2px 3px rgba(0,0,0,.5)); }

/* ── Süslü tahta çerçevesi ── */
.m3l__board { position: relative; padding: 0; }
.m3l__board::before { content: ''; position: absolute; inset: -9px; border-radius: 22px; z-index: 0; pointer-events: none;
  background: linear-gradient(#0b1418, #0b1418) padding-box, linear-gradient(135deg, #6b4f1f, #f6e2a8 18%, #a37d3a 38%, #f1d79a 55%, #7a5a26 75%, #e9c77a) border-box;
  border: 4px solid transparent; box-shadow: 0 18px 40px rgba(0,0,0,.75), 0 0 0 1px #000, inset 0 0 24px rgba(0,0,0,.8); }
.m3l__board::after { content: ''; position: absolute; inset: -16px; z-index: 4; pointer-events: none;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cdefs%3E%3ClinearGradient id='a' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%23fff1c4'/%3E%3Cstop offset='.5' stop-color='%23d6a948'/%3E%3Cstop offset='1' stop-color='%236b4a14'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M4 4h14l-4 4H8v6l-4 4z' fill='url(%23a)' stroke='%233a2606' stroke-width='1'/%3E%3Ccircle cx='10' cy='10' r='4.5' fill='%23b3262a' stroke='%23ffd98a' stroke-width='1.5'/%3E%3C/svg%3E") left top / 34px no-repeat,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cdefs%3E%3ClinearGradient id='a' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%23fff1c4'/%3E%3Cstop offset='.5' stop-color='%23d6a948'/%3E%3Cstop offset='1' stop-color='%236b4a14'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M36 4H22l4 4h6v6l4 4z' fill='url(%23a)' stroke='%233a2606' stroke-width='1'/%3E%3Ccircle cx='30' cy='10' r='4.5' fill='%23b3262a' stroke='%23ffd98a' stroke-width='1.5'/%3E%3C/svg%3E") right top / 34px no-repeat,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cdefs%3E%3ClinearGradient id='a' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%23fff1c4'/%3E%3Cstop offset='.5' stop-color='%23d6a948'/%3E%3Cstop offset='1' stop-color='%236b4a14'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M4 36h14l-4-4H8v-6l-4-4z' fill='url(%23a)' stroke='%233a2606' stroke-width='1'/%3E%3Ccircle cx='10' cy='30' r='4.5' fill='%23b3262a' stroke='%23ffd98a' stroke-width='1.5'/%3E%3C/svg%3E") left bottom / 34px no-repeat,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cdefs%3E%3ClinearGradient id='a' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%23fff1c4'/%3E%3Cstop offset='.5' stop-color='%23d6a948'/%3E%3Cstop offset='1' stop-color='%236b4a14'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M36 36H22l4-4h6v-6l4-4z' fill='url(%23a)' stroke='%233a2606' stroke-width='1'/%3E%3Ccircle cx='30' cy='30' r='4.5' fill='%23b3262a' stroke='%23ffd98a' stroke-width='1.5'/%3E%3C/svg%3E") right bottom / 34px no-repeat; }
.m3b { z-index: 1; }
.m3b__cells { border-radius: 12px; }
.m3c { background: linear-gradient(180deg, rgba(var(--cell, 28,60,66), .78), rgba(var(--cell, 28,60,66), .58)); box-shadow: inset 0 0 0 1px rgba(255,236,190,.05), inset 0 -6px 10px rgba(0,0,0,.18); }
.m3c.is-alt { background: linear-gradient(180deg, rgba(var(--cell2, 20,44,50), .82), rgba(var(--cell2, 20,44,50), .62)); }
.m3c.is-hole { background: transparent; box-shadow: none; }

/* ── Taşlar ── */
.m3t { padding: 2px; transition: transform .26s cubic-bezier(.3, 1.35, .5, 1); }
.m3t__in > svg { filter: none; }
.m3t__in > svg.tile { transition: transform .15s; }
.m3t.is-sel .m3t__in { transform: scale(1.14); filter: brightness(1.18) drop-shadow(0 0 8px #fff3cf); }
.m3t.is-born .m3t__in { animation: m3drop .42s cubic-bezier(.3, 1.5, .5, 1); }
@keyframes m3drop { 0% { transform: scale(.4) translateY(-30%); opacity: 0; } 70% { transform: scale(1.06, .94); opacity: 1; } }
.m3t.is-pop .m3t__in { transform: scale(1.45); opacity: 0; filter: brightness(2.2) saturate(.6); transition: transform .2s ease-out, opacity .22s, filter .1s; }
.m3t.is-pop--sp .m3t__in { transform: scale(1.9); }
/* özel taş: aura + canlı parçalar */
.m3t__aura { position: absolute; inset: -12%; border-radius: 50%; background: radial-gradient(circle, rgba(255,240,190,.75), rgba(255,200,90,.25) 45%, transparent 70%); animation: m3aura 1.6s ease-in-out infinite; pointer-events: none; }
.m3t[data-s="x"] .m3t__aura { background: conic-gradient(from 0deg, #ff7a6b80, #ffe17a80, #7ae0a080, #7ab0ff80, #e09bff80, #ff7a6b80); filter: blur(5px); animation: m3spin 3s linear infinite; }
@keyframes m3aura { 50% { transform: scale(1.12); opacity: .65; } }
.m3t[data-s="h"] .m3t__in, .m3t[data-s="v"] .m3t__in, .m3t[data-s="b"] .m3t__in { animation: none; }
.m3t__in > svg.sp { filter: drop-shadow(0 0 5px rgba(255,236,170,.9)); }
.sp-streak { animation: m3streak 1.1s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
@keyframes m3streak { 50% { opacity: .35; transform: scaleX(.75); } }
.sp-spark { animation: m3sparkle .35s steps(2) infinite; transform-box: fill-box; transform-origin: center; }
@keyframes m3sparkle { 50% { transform: scale(.7) rotate(25deg); opacity: .75; } }
.sp--x .sp-rays { animation: m3spin 4s linear infinite; transform-origin: 50px 50px; }
.m3t__in > svg.sp--x { animation: none; }
.m3t[data-s="b"] .m3t__in > svg.sp--b { animation: m3tick 1.2s ease-in-out infinite; }
@keyframes m3tick { 50% { transform: scale(1.06) rotate(-3deg); } }

/* ── Efektler ── */
.m3b__fx { overflow: visible; }
.m3b__fx > i { position: absolute; pointer-events: none; display: block; }
.m3flash { width: var(--s); height: var(--s); margin: calc(var(--s) / -2) 0 0 calc(var(--s) / -2); border-radius: 50%; background: radial-gradient(circle, #fff 0%, var(--c) 30%, transparent 68%); mix-blend-mode: screen; animation: m3flash .34s ease-out forwards; }
@keyframes m3flash { from { transform: scale(.3); opacity: 1; } to { transform: scale(1.25); opacity: 0; } }
.m3shard { width: 9px; height: 13px; margin: -6px 0 0 -4px; background: linear-gradient(135deg, #fff 0%, var(--c) 45%, rgba(0,0,0,.35) 100%); clip-path: polygon(50% 0, 100% 40%, 60% 100%, 0 55%); animation: m3shard .6s cubic-bezier(.15, .7, .3, 1) forwards; }
.m3shard--ember { width: 6px; height: 6px; clip-path: none; border-radius: 50%; background: radial-gradient(circle, #fff6d0, var(--c) 55%, transparent 70%); }
@keyframes m3shard { 0% { transform: translate(0, 0) rotate(0) scale(var(--z)); opacity: 1; } 75% { opacity: 1; } 100% { transform: translate(var(--dx), calc(var(--dy) + 18px)) rotate(var(--r)) scale(.2); opacity: 0; } }
.m3spark { width: 4px; height: 4px; margin: -2px; border-radius: 50%; background: #fff; box-shadow: 0 0 6px 2px var(--c); animation: m3spark .7s ease-out forwards; }
@keyframes m3spark { to { transform: translate(var(--dx), var(--dy)); opacity: 0; } }
.m3beam { mix-blend-mode: screen; }
.m3beam--h { left: -8px; right: -8px; background: linear-gradient(180deg, transparent 0%, rgba(255,214,120,.55) 25%, #fffbe8 46%, #fff 50%, #fffbe8 54%, rgba(255,214,120,.55) 75%, transparent 100%); box-shadow: 0 0 24px 6px rgba(255,200,90,.55); animation: m3beamh .6s ease-out forwards; }
.m3beam--v { top: -8px; bottom: -8px; background: linear-gradient(90deg, transparent 0%, rgba(255,214,120,.55) 25%, #fffbe8 46%, #fff 50%, #fffbe8 54%, rgba(255,214,120,.55) 75%, transparent 100%); box-shadow: 0 0 24px 6px rgba(255,200,90,.55); animation: m3beamv .6s ease-out forwards; }
@keyframes m3beamh { 0% { transform: scaleY(.15) scaleX(.1); opacity: 1; } 25% { transform: scaleY(1.25) scaleX(1); } 100% { transform: scaleY(.08); opacity: 0; } }
@keyframes m3beamv { 0% { transform: scaleX(.15) scaleY(.1); opacity: 1; } 25% { transform: scaleX(1.25) scaleY(1); } 100% { transform: scaleX(.08); opacity: 0; } }
.m3beam.is-roller { filter: hue-rotate(-30deg) saturate(1.6); }
.m3comet { width: 26px; height: 26px; margin: -13px; border-radius: 50%; background: radial-gradient(circle, #fff, #ffe08a 40%, transparent 70%); box-shadow: 0 0 18px 6px rgba(255,214,120,.7); animation: m3comet .5s cubic-bezier(.3, 0, .2, 1) forwards; }
.m3comet--h { animation-name: m3cometh; } .m3comet--v { animation-name: m3cometv; }
@keyframes m3cometh { to { transform: translateX(var(--d)) scale(.5); opacity: .2; } }
@keyframes m3cometv { to { transform: translateY(var(--d)) scale(.5); opacity: .2; } }
.m3ring { border: 5px solid #ffe2a0; box-shadow: 0 0 26px #ff9d3c, inset 0 0 22px #ff9d3c; animation: m3ring .6s cubic-bezier(.1, .6, .3, 1) forwards; }
.m3ring--2 { border-width: 2px; border-color: rgba(255,240,200,.7); animation-duration: .8s; animation-delay: .05s; }
.m3fire { width: var(--s); height: var(--s); margin: calc(var(--s) / -2) 0 0 calc(var(--s) / -2); border-radius: 50%; background: radial-gradient(circle, #fffbe8 0%, #ffd27a 20%, #ff8a2a 42%, rgba(200,40,20,.6) 58%, transparent 72%); mix-blend-mode: screen; animation: m3fire .7s ease-out forwards; }
@keyframes m3fire { 0% { transform: scale(.2); opacity: 1; } 40% { transform: scale(1); opacity: 1; } 100% { transform: scale(1.15); opacity: 0; } }
.m3smoke { width: var(--s); height: var(--s); margin: calc(var(--s) / -2) 0 0 calc(var(--s) / -2); border-radius: 50%; background: radial-gradient(circle, rgba(90,80,70,.55), rgba(40,35,30,0) 70%); animation: m3smoke 1.1s ease-out forwards; }
@keyframes m3smoke { from { transform: scale(.4); opacity: .9; } to { transform: translate(var(--dx), var(--dy)) scale(1.8); opacity: 0; } }
.m3bolts { position: absolute; inset: 0; overflow: visible; mix-blend-mode: screen; }
.m3bolts path { fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 900; stroke-dashoffset: 900; animation: m3bolt .7s ease-out forwards; }
.m3bolts path.g { stroke-width: 9; opacity: .55; filter: blur(2px); }
.m3bolts path.w { stroke: #fff; stroke-width: 2.5; }
.m3bolts .hit { opacity: 0; animation: m3hitf .7s ease-out forwards; }
.m3bolts__core { animation: m3core .7s ease-out forwards; opacity: .9; }
@keyframes m3bolt { 0% { stroke-dashoffset: 900; } 45% { stroke-dashoffset: 0; opacity: 1; } 60% { opacity: .4; } 70% { opacity: 1; } 100% { stroke-dashoffset: 0; opacity: 0; } }
@keyframes m3hitf { 40% { opacity: 0; transform: scale(.4); } 55% { opacity: 1; } 100% { opacity: 0; } }
@keyframes m3core { from { transform-origin: center; opacity: 1; } to { opacity: 0; } }
.m3make { width: var(--s); height: var(--s); margin: calc(var(--s) / -2) 0 0 calc(var(--s) / -2); border-radius: 50%; background: conic-gradient(from 0deg, transparent, rgba(255,236,170,.9), transparent 30%, rgba(255,236,170,.9) 50%, transparent 70%, rgba(255,236,170,.9) 90%, transparent); -webkit-mask: radial-gradient(circle, transparent 35%, #000 37%, #000 60%, transparent 62%); mask: radial-gradient(circle, transparent 35%, #000 37%, #000 60%, transparent 62%); animation: m3make .7s ease-out forwards; }
@keyframes m3make { from { transform: scale(.4) rotate(0); opacity: 1; } to { transform: scale(1.2) rotate(180deg); opacity: 0; } }
.m3burst { width: var(--s); height: var(--s); margin: calc(var(--s) / -2) 0 0 calc(var(--s) / -2); background: repeating-conic-gradient(rgba(255,240,190,.8) 0 6deg, transparent 6deg 24deg); -webkit-mask: radial-gradient(circle, #000 10%, transparent 65%); mask: radial-gradient(circle, #000 10%, transparent 65%); mix-blend-mode: screen; animation: m3burstr .9s ease-out forwards; }
@keyframes m3burstr { from { transform: scale(.2) rotate(0); opacity: 1; } to { transform: scale(1.3) rotate(40deg); opacity: 0; } }
.m3screenflash { position: absolute; inset: -40px; background: radial-gradient(circle at 50% 50%, var(--c), transparent 70%); mix-blend-mode: screen; opacity: 0; animation: m3sflash .45s ease-out; }
@keyframes m3sflash { 20% { opacity: .55; } }
.m3score { position: absolute; transform: translate(-50%, -50%); font: 900 17px var(--f-ui); color: #fff7d6; -webkit-text-stroke: 1px #6b4a14; text-shadow: 0 2px 0 #6b4a14, 0 0 10px rgba(255,210,120,.8); pointer-events: none; animation: m3scorea .95s ease-out forwards; z-index: 5; }
@keyframes m3scorea { 0% { opacity: 0; transform: translate(-50%, -30%) scale(.5); } 20% { opacity: 1; transform: translate(-50%, -60%) scale(1.15); } 100% { opacity: 0; transform: translate(-50%, -160%) scale(1); } }
.m3float.is-praise, .m3float.is-win { font: 800 40px/1 var(--f-display); letter-spacing: .01em; color: #fff3cf; background: linear-gradient(180deg, #fffbe8 10%, #ffd36a 50%, #c4861e 90%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; filter: drop-shadow(0 3px 0 #4a3008) drop-shadow(0 0 14px rgba(255,200,90,.7)); animation: m3praise 1.25s cubic-bezier(.2, 1.4, .4, 1) forwards; z-index: 6; }
.m3float.is-praise--4, .m3float.is-praise--5, .m3float.is-praise--6 { font-size: 46px; background-image: linear-gradient(180deg, #fff 5%, #ffe17a 35%, #ff9d3c 70%, #b3262a 95%); }
@keyframes m3praise { 0% { opacity: 0; transform: translate(-50%, 0) scale(.3) rotate(-8deg); } 25% { opacity: 1; transform: translate(-50%, 0) scale(1.15) rotate(2deg); } 40% { transform: translate(-50%, 0) scale(1) rotate(0); } 80% { opacity: 1; } 100% { opacity: 0; transform: translate(-50%, -30px) scale(1.05); } }
.m3float.is-combo { font: 900 24px var(--f-ui); color: #ffe2a0; -webkit-text-stroke: 1px #6b1a14; text-shadow: 0 3px 0 #6b1a14, 0 0 14px #ff8a4a; }
.m3l.is-shake { animation: m3shake .38s cubic-bezier(.36, .07, .19, .97); }

/* ── Güçlendirici çubuğu ── */
.m3-bb { background: radial-gradient(120% 100% at 50% 0%, #2c3a44, #10161c 70%); border: 0; box-shadow: 0 0 0 1.5px #8c6a2f, 0 6px 14px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,240,200,.2); }
.m3-bb b { background: linear-gradient(180deg, #e0463f, #8e1b1b); box-shadow: 0 2px 4px rgba(0,0,0,.5); }

/* ── Harita: sonsuz numaralı yol ── */
.m3w__trail { position: relative; margin: 16px 0 8px; padding: 18px 0 10px; border-radius: 22px; overflow: hidden; isolation: isolate; box-shadow: 0 0 0 1.5px #8c6a2f, 0 0 0 4px rgba(214,178,106,.18), var(--shadow); }
.m3w__trail::before { content: ''; position: absolute; inset: 0; z-index: -2; background: var(--valley) center / cover no-repeat; }
.m3w__trail::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(6,8,11,.5), rgba(6,8,11,.2) 40%, rgba(6,8,11,.75)); }
.m3w__banner { margin: 0 14px 6px; text-align: center; }
.m3w__banner small { display: block; font: 700 10.5px var(--f-ui); letter-spacing: .18em; text-transform: uppercase; color: #ffe7b0; text-shadow: 0 1px 3px #000; }
.m3w__banner b { display: inline-block; margin-top: 4px; padding: 6px 22px; font: 700 21px var(--f-display); color: #2a1a06; background: linear-gradient(180deg, #fff1c4, #e3b85c 55%, #a77a2c); clip-path: polygon(0 0, 100% 0, 94% 50%, 100% 100%, 0 100%, 6% 50%); text-shadow: 0 1px 0 rgba(255,255,255,.5); box-shadow: 0 4px 10px rgba(0,0,0,.5); }
.m3w__path { list-style: none; margin: 0; padding: 4px 0; display: flex; flex-direction: column-reverse; gap: 4px; align-items: stretch; overflow: visible; }
.m3w__path li { position: relative; height: 62px; display: block; }
.m3w__path li > span { position: absolute; top: 4px; left: calc(var(--x) * 1%); transform: translateX(-50%); width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; font: 800 18px var(--f-ui); color: #e9e3d6; background: radial-gradient(circle at 40% 30%, #3b4a55, #141b22 70%); border: 0; box-shadow: 0 0 0 3px #1a120a, 0 0 0 5px #8c6a2f, 0 6px 12px rgba(0,0,0,.6), inset 0 2px 0 rgba(255,255,255,.15); overflow: hidden; text-shadow: 0 1px 2px #000; }
.m3w__path li.is-done > span { background: radial-gradient(circle at 40% 30%, #5fbf86, #1d5a37 70%); box-shadow: 0 0 0 3px #10261a, 0 0 0 5px #d6b26a, 0 6px 12px rgba(0,0,0,.6), inset 0 2px 0 rgba(255,255,255,.25); cursor: pointer; }
.m3w__path li.is-cur > span { width: 64px; height: 64px; top: -1px; font-size: 21px; color: #2a1a06; background: radial-gradient(circle at 40% 30%, #fffbe8, #f1d79a 40%, #c8963c 80%); box-shadow: 0 0 0 3px #3a2606, 0 0 0 6px #ffe7a8, 0 0 26px 6px rgba(255,210,120,.6), 0 8px 14px rgba(0,0,0,.6); animation: m3curp 1.6s ease-in-out infinite; cursor: pointer; text-shadow: none; }
@keyframes m3curp { 50% { transform: translateX(-50%) scale(1.08); } }
.m3w__path li.is-boss > span { box-shadow: 0 0 0 3px #2a0a0a, 0 0 0 5px #e2574c, 0 0 18px rgba(226,87,76,.6), 0 6px 12px rgba(0,0,0,.6); }
.m3w__path li.is-lock > span { filter: saturate(.4) brightness(.8); }
.m3w__path li.is-valley > span::after { content: ''; position: absolute; inset: 0; border-radius: 50%; box-shadow: inset 0 0 0 3px #b98cff; }
.m3w__path li > span img { width: 100%; height: 100%; object-fit: cover; }
.m3w__path li > i { position: absolute; top: 56px; left: calc(var(--x) * 1%); transform: translateX(-50%); font-style: normal; font-size: 11px; color: #ffe08a; letter-spacing: -1px; text-shadow: 0 1px 2px #000; }
.m3w__path li > em { position: absolute; top: 14px; left: calc(var(--x) * 1% + 38px); font: 700 11px var(--f-ui); font-style: normal; color: #fff; background: rgba(120,60,200,.85); padding: 3px 8px; border-radius: 99px; white-space: nowrap; box-shadow: 0 2px 6px rgba(0,0,0,.5); }
.m3w__path li.is-right > em { left: auto; right: calc((100 - var(--x)) * 1% + 38px); }
.m3w__dots { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; pointer-events: none; }
.m3w__dots path { fill: none; stroke: rgba(255,231,168,.7); stroke-width: 3; stroke-dasharray: 2 9; stroke-linecap: round; }
.m3w__inf { text-align: center; margin-top: 4px; font: 600 12px var(--f-ui); color: #ffe7b0; text-shadow: 0 1px 3px #000; }
.m3w__story { margin: 10px 0 0; padding: 12px 14px; border-radius: 16px; background: linear-gradient(180deg, rgba(36,28,16,.92), rgba(14,11,8,.92)); box-shadow: 0 0 0 1px #8c6a2f, var(--shadow); }
.m3w__story h3 { margin: 0 0 4px; font: 700 18px var(--f-display); color: var(--gold-hi); }
.m3w__story p { margin: 0; font-size: 13px; color: #d8cfbb; line-height: 1.45; }
.m3w__story small { color: var(--muted); }

/* ── Vadi geçişi (video + afiş) ── */
.m3v { position: fixed; inset: 0; z-index: 400; background: #000; display: grid; place-items: center; overflow: hidden; }
.m3v video, .m3v .m3v__still { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.m3v .m3v__still { background: var(--bg) center / cover; animation: m3kb 8s linear forwards; }
@keyframes m3kb { from { transform: scale(1.02); } to { transform: scale(1.14) translateY(-2%); } }
.m3v::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.55), transparent 30%, transparent 60%, rgba(0,0,0,.85)); pointer-events: none; }
.m3v__skip { position: absolute; z-index: 3; top: calc(14px + var(--safe-t, 0px)); right: 14px; padding: 8px 14px; border-radius: 99px; border: 1px solid rgba(255,231,168,.6); background: rgba(0,0,0,.55); color: #ffe7b0; font: 700 13px var(--f-ui); opacity: 0; transition: opacity .3s; }
.m3v__skip.is-on { opacity: 1; }
.m3v__story { position: absolute; z-index: 2; left: 18px; right: 18px; bottom: calc(40px + var(--safe-b, 0px)); text-align: center; color: #f3ead6; animation: m3pop .8s .4s both var(--ease); }
.m3v__story small { display: block; font: 700 11px var(--f-ui); letter-spacing: .2em; text-transform: uppercase; color: #ffd98a; }
.m3v__story h2 { margin: 6px 0; font: 700 34px/1.05 var(--f-display); background: linear-gradient(180deg, #fffbe8, #ffd36a 55%, #c4861e); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; filter: drop-shadow(0 3px 0 #2a1a06); }
.m3v__story p { margin: 0 auto; max-width: 34ch; font-size: 14px; line-height: 1.5; text-shadow: 0 1px 4px #000; }

/* ── "Hamlen bitti" penceresi ── */
.modal.modal--m3x .modal__card { overflow: visible; padding-top: 58px; border: 0; background: radial-gradient(120% 70% at 50% 0%, #2c2212, #120e08 60%, #0a0806); box-shadow: 0 0 0 2px #2a1d0b, 0 0 0 5px #d6b26a, 0 0 0 7px #6b4f1f, 0 24px 60px rgba(0,0,0,.85), inset 0 2px 0 rgba(255,240,200,.25); border-radius: 26px; }
.modal--m3x .modal__title { text-align: center; font: 800 30px var(--f-display); background: linear-gradient(180deg, #fffbe8, #ffd36a 55%, #c4861e); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; filter: drop-shadow(0 2px 0 #3a2508); }
.modal--m3x .modal__actions { gap: 10px; }
.m3x__ribbon { position: absolute; left: 50%; top: -22px; transform: translateX(-50%); width: 88%; height: 46px; display: grid; place-items: center; font: 800 15px var(--f-ui); letter-spacing: .14em; color: #fff3df; text-transform: uppercase; background: linear-gradient(180deg, #d24b3f, #8e1b1b); clip-path: polygon(0 0, 100% 0, 95% 50%, 100% 100%, 0 100%, 5% 50%); box-shadow: 0 6px 14px rgba(0,0,0,.5); text-shadow: 0 2px 0 #4a0a0a; }
.m3x__hero { position: relative; margin: 0 auto 6px; width: 150px; height: 120px; display: grid; place-items: center; }
.m3x__hero::before { content: ''; position: absolute; inset: -10px; border-radius: 50%; background: repeating-conic-gradient(rgba(255,226,150,.28) 0 8deg, transparent 8deg 22deg); -webkit-mask: radial-gradient(circle, #000 25%, transparent 70%); mask: radial-gradient(circle, #000 25%, transparent 70%); animation: m3spin 12s linear infinite; }
.m3x__hero svg { position: relative; width: 110px; height: 110px; filter: drop-shadow(0 8px 12px rgba(0,0,0,.6)); animation: m3bob 2.2s ease-in-out infinite; }
.m3x__plus { position: absolute; right: -2px; bottom: 6px; font: 900 38px/1 var(--f-ui); color: #fff7d6; -webkit-text-stroke: 2px #6b4a14; text-shadow: 0 4px 0 #6b4a14, 0 0 18px rgba(255,210,120,.9); animation: m3plus 1.4s ease-in-out infinite; }
@keyframes m3bob { 50% { transform: translateY(-6px) rotate(-3deg); } }
@keyframes m3plus { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.18) rotate(-6deg); } }
.m3x__left { text-align: center; font: 800 18px var(--f-ui); color: #ffd2a8; margin: 0 0 8px; }
.m3x__goals { list-style: none; margin: 0 0 10px; padding: 8px; display: flex; justify-content: center; gap: 12px; border-radius: 16px; background: rgba(0,0,0,.4); box-shadow: inset 0 0 0 1px rgba(214,178,106,.25); }
.m3x__goals li { position: relative; display: grid; justify-items: center; }
.m3x__goals li b { font: 800 15px var(--f-ui); color: #fff; text-shadow: 0 1px 2px #000; }
.m3x__goals .m3-gi { width: 40px; height: 40px; }
.m3x__note { text-align: center; color: var(--muted); font-size: 12.5px; margin: 0; }
.btn.btn--m3buy { min-height: 58px; font: 800 18px var(--f-ui); color: #1b1408; border-radius: 99px; background: linear-gradient(180deg, #fff6d0 0%, #f1d79a 30%, #d6a948 70%, #a87a1c 100%); box-shadow: 0 0 0 2px #5a3a0a, 0 6px 0 #5a3a0a, 0 12px 22px rgba(0,0,0,.5), inset 0 2px 0 rgba(255,255,255,.7); position: relative; overflow: hidden; display: flex; gap: 10px; align-items: center; justify-content: center; }
.btn.btn--m3buy::after { content: ''; position: absolute; top: 0; bottom: 0; width: 40%; left: -60%; background: linear-gradient(100deg, transparent, rgba(255,255,255,.75), transparent); animation: m3shine 2.4s ease-in-out infinite; }
@keyframes m3shine { 60%, 100% { left: 130%; } }
.btn.btn--m3buy .gem { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; border-radius: 99px; background: rgba(42,26,6,.88); color: #bfe9ff; font-size: 16px; }
.btn.btn--m3buy .gem svg { width: 20px; height: 20px; }
.btn.btn--m3ad { min-height: 48px; border-radius: 99px; background: linear-gradient(180deg, #2a6b4a, #134028); color: #eafff2; box-shadow: 0 0 0 1.5px #7fb69a, 0 4px 0 #0b2a1a, 0 8px 16px rgba(0,0,0,.45); font-weight: 800; }
.btn.btn--m3giveup { background: transparent; color: #c9bfae; text-decoration: underline; text-underline-offset: 4px; box-shadow: none; min-height: 40px; font-weight: 700; }
.m3x__lose { list-style: none; margin: 0 0 10px; padding: 0; display: grid; gap: 8px; }
.m3x__lose li { display: flex; gap: 10px; align-items: center; padding: 10px 12px; border-radius: 14px; background: rgba(120,20,20,.25); box-shadow: inset 0 0 0 1px rgba(226,87,76,.4); color: #ffd9d2; font-weight: 700; }
.m3x__lose li .ico { width: 22px; height: 22px; color: #ff8b7a; flex: none; }

/* v1.2.4: hareket azaltma tercihinde canlı parçalar durdurulmaz, yalnızca yavaşlatılır */
@media (prefers-reduced-motion: reduce) {
  .sp-streak, .sp-spark, .sp--x .sp-rays, .m3x__hero::before, .m3x__hero svg, .m3x__plus, .btn.btn--m3buy::after, .m3w__path li.is-cur > span { animation-duration: 3s !important; }
  .m3v .m3v__still { animation: none !important; }
}