/* =====================================================================
   Pofuduk Kutu — r5.css (R5)
   ===================================================================== */
/* ---------- Ana menü: kalıcı MEKÂNLARIM ---------- */
.pill-btn.r5-places { background: linear-gradient(90deg, #FFE3F0, #FFF3B0); border-width: 5px; min-height: 66px; padding-right: 22px; font-size: var(--fs-m); }
.pill-btn.r5-places .ic { width: 50px; height: 50px; }
.pill-btn.r5-places small { background: #46C674; }

/* ---------- Mekânlarım seçim ekranı ---------- */
.placesel { background: linear-gradient(160deg, #FFF0F7 0%, #EDE4FF 55%, #DDF4FF 100%); }
.ps-chest { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; min-height: 56px; padding: 4px 16px 4px 6px; border: 4px solid var(--ink); border-radius: var(--rad-pill); background: #fff; box-shadow: 0 4px 0 var(--ink); font-weight: 900; }
.ps-chest svg { width: 46px; height: 40px; }
.ps-chest.ready { background: linear-gradient(90deg, #FFF3B0, #FFD9EC); animation: readyPulse 1.3s ease-in-out infinite; }
.ps-grid { flex: 1; min-height: 0; overflow-y: auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(200px, 44vw), 1fr)); gap: var(--sp-3); padding: 6px 6px 18px; align-content: start; scrollbar-width: thin; }
.ps-card { position: relative; aspect-ratio: 4 / 3.3; padding: 0; border: 5px solid var(--ink); border-radius: var(--rad-l); background: var(--pc); box-shadow: 0 7px 0 var(--ink); overflow: hidden; display: flex; flex-direction: column; transition: transform var(--dur-fast); }
.ps-card:active { transform: translateY(5px); box-shadow: 0 2px 0 var(--ink); }
.ps-art { flex: 1; min-height: 0; display: block; }
.ps-art svg { width: 100%; height: 100%; display: block; }
.ps-name { flex: none; padding: 6px 8px; background: var(--pc2); color: #fff; font-size: var(--fs-s); font-weight: 900; text-shadow: var(--outline); border-top: 4px solid var(--ink); }
.ps-card.locked .ps-art { filter: blur(6px) saturate(.5) brightness(1.08); transform: scale(1.1); }
.ps-card.locked { background: #EEE8F6; }
.ps-lock { position: absolute; inset: 0; display: grid; place-items: center; }
.ps-lock svg { width: 34%; max-width: 74px; filter: drop-shadow(0 4px 0 rgba(91, 58, 110, .35)); }
.ps-card.unlocking .ps-art { animation: psUnblur 1.4s ease-out both; }
.ps-card.unlocking { animation: psPop 1s var(--ease-bounce) both; box-shadow: 0 0 0 6px #FFD23F, 0 9px 0 6px var(--ink); }
@keyframes psUnblur { from { filter: blur(6px) saturate(.5); transform: scale(1.1); } to { filter: none; transform: none; } }
@keyframes psPop { 0% { transform: scale(.9) rotate(-3deg); } 60% { transform: scale(1.06) rotate(2deg); } 100% { transform: none; } }
.lock-card { align-items: center; text-align: center; }
.lk-chest svg { width: 120px; height: auto; }
.lk-row { display: flex; align-items: center; gap: 10px; }
.lk-row > svg { width: 44px; height: 44px; flex: none; }
.lk-dots { display: flex; flex-wrap: wrap; gap: 6px; max-width: 320px; }
.lk-dots i { width: 22px; height: 22px; border-radius: 50%; border: 3px solid var(--ink); background: #fff; }
.lk-dots i.on { background: #FFC93C; }
.lk-num { font-size: var(--fs-l); font-weight: 900; }

/* ---------- Mekân: paneller, seçim, stickerlar ---------- */
.pb-btn.stickers .stk-svg { width: 100%; height: 100%; }
.place-stk { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.pstk { position: absolute; width: calc(var(--u) * 70); height: calc(var(--u) * 70); transform: translate(-50%, -50%) rotate(-6deg); pointer-events: auto; touch-action: none; cursor: grab; }
.pstk .stk-svg { width: 100%; height: 100%; }
.pstk.boing { animation: aJelly .45s; }
.obj.selected, .friend.selected { filter: drop-shadow(0 0 0 #fff) drop-shadow(0 0 10px #FFD23F) drop-shadow(0 0 4px #FFD23F); }
.obj.selected { animation: selBob .9s ease-in-out infinite alternate; }
@keyframes selBob { to { transform: translate(-50%, -104%); } }
.has-sel .pfx.zone > svg, .has-sel .friend .fr-svg { filter: drop-shadow(0 0 6px rgba(255, 210, 63, .7)); }
.dr-item.locked { cursor: default; opacity: .9; }
.dr-item.locked .fr-svg { filter: brightness(0) opacity(.28); }
.dr-item.locked .dr-lock { position: absolute; bottom: 4px; right: 6px; font-size: 22px; color: #F2B800; text-shadow: 0 2px 0 var(--ink); }
.dr-item.nope { animation: aWiggle .4s; }
.dr-item.fig .ch-svg { width: 100%; height: 100%; }
.fig-art { display: block; width: 100%; height: 100%; }
.fig-art .ch-svg { width: 100%; height: 100%; overflow: visible; }
.dr-tab .dec-svg, .dr-tab .ch-svg { width: 100%; height: 100%; }
.fe-fr.locked { position: relative; }
.fe-fr.locked .fr-svg { filter: brightness(0) opacity(.25); }
.fe-fr.locked .dr-lock { position: absolute; bottom: 2px; right: 6px; font-size: 20px; color: #F2B800; text-shadow: 0 2px 0 var(--ink); }
.fe-fr.nope { animation: aWiggle .4s; }
.hp-fig .fr-svg { width: 100%; height: 100%; }
.fbx-card { background: radial-gradient(circle at 50% 35%, #F3ECFF, #FFE3EF 70%) !important; }
.fbx-box { width: min(280px, 64vw); background: none; border: 0; cursor: pointer; animation: breathe 2.2s ease-in-out infinite; }
.fbx-box svg { width: 100%; height: auto; overflow: visible; }
.fbx-box.shake { animation: shake .3s 2; }
.fbx-friend { height: min(260px, 40vh); aspect-ratio: 200 / 350; animation: aJelly .7s ease-in-out; }
.fbx-friend.k-baby { aspect-ratio: 200 / 260; height: min(200px, 32vh); }
.fbx-friend.k-animal { aspect-ratio: 200 / 290; height: min(220px, 34vh); }
.fbx-friend .fr-svg { width: 100%; height: 100%; }
.big-count.round { margin: 0; }
.life-count { display: flex; align-items: center; gap: 6px; font-size: var(--fs-s); font-weight: 900; color: var(--ink-soft); opacity: .8; }
.life-count .ic { width: 28px; height: 28px; }
@media (max-height: 520px) { .fbx-box { width: min(180px, 30vh); } .fbx-friend { height: 30vh; } }

/* ---------- Mekân eşya koleksiyonu (Eşyalarım) ---------- */
.pl-col { display: inline-flex; align-items: center; gap: 4px; min-height: 52px; padding: 4px 12px 4px 6px; border: 4px solid var(--ink); border-radius: var(--rad-pill); background: #fff; box-shadow: 0 4px 0 var(--ink); font-weight: 900; font-size: 15px; }
.pl-col svg { width: 36px; height: 36px; }
.pcol-ov .pcol-card { width: min(940px, 96vw); height: min(92vh, 760px); display: flex; flex-direction: column; gap: 8px; padding: 12px; border: 6px solid var(--ink); border-radius: var(--rad-l); background: #FFFBF4; box-shadow: 0 8px 0 var(--ink); }
.pcol-head { display: flex; align-items: center; gap: 10px; }
.pcol-head h2 { flex: 1; font-size: var(--fs-l); }
.pcol-ic .ic { width: 48px; height: 48px; }
.pcol-count { padding: 4px 14px; border: 4px solid var(--ink); border-radius: var(--rad-pill); background: var(--sun); font-size: var(--fs-m); }
.pcol-x { width: 50px; height: 50px; font-size: 22px; font-weight: 900; }
.pcol-cats { display: flex; gap: 6px; overflow-x: auto; flex: none; padding-bottom: 4px; scrollbar-width: none; }
.pcol-cat { flex: none; width: 58px; height: 58px; padding: 6px; border: 4px solid var(--ink); border-radius: 16px; background: #fff; font-size: 26px; font-weight: 900; color: #F2B800; }
.pcol-cat.on { background: var(--sun); color: var(--ink); }
.pcol-cat svg { width: 100%; height: 100%; }
.pcol-grid { flex: 1; min-height: 0; overflow-y: auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: 8px; align-content: start; }
.pcol-it { aspect-ratio: 1; padding: 10px; border: 3px solid rgba(91, 58, 110, .3); border-radius: 16px; background: #F3EEFA; }
.pcol-it svg, .pcol-it .item-svg { width: 100%; height: 100%; }
.pcol-it:not(.found) .item-svg, .pcol-it:not(.found) svg { filter: brightness(0) opacity(.22); }
.pcol-it.found { background: #fff; border: 4px solid var(--ink); box-shadow: 0 4px 0 var(--ink); }
.pcol-it.nope { animation: aWiggle .4s; }
.ps-name small { margin-left: 8px; padding: 1px 8px; border-radius: 10px; background: rgba(255, 255, 255, .85); color: var(--ink); font-size: 12px; text-shadow: none; }
.obj.a-fall { animation: coinFall .7s cubic-bezier(.3, 1.6, .5, 1) both; }
@keyframes coinFall { from { transform: translate(-50%, -260%) rotate(-120deg); } to { transform: translate(-50%, -100%); } }
.choco-flow path { stroke-dasharray: 10 8; animation: chocoFlow .5s linear infinite; }
@keyframes chocoFlow { to { stroke-dashoffset: -18; } }
.pfx-fountain .sheet { animation: sheetFlow 1.2s ease-in-out infinite alternate; transform-box: fill-box; transform-origin: 50% 0; }
@keyframes sheetFlow { to { transform: scaleX(1.03) scaleY(1.02); } }
/* Maskot balonu ve (mekân/oyun ekranlarında) maskot dokunuş yakalamaz — altındaki eşyalar alınabilir */
.pofi-bubble { pointer-events: none; }
body[data-screen="place"] .pofi, body[data-screen="game"] .pofi, body[data-screen="room"] .pofi, body[data-screen="friends"] .pofi { pointer-events: none !important; }

/* ---------- Kuaför: saç modeli paneli ---------- */
.style-ov .style-card { position: relative; width: min(980px, 96vw); height: min(90vh, 640px); display: flex; gap: 14px; padding: 16px; border: 6px solid var(--ink); border-radius: var(--rad-l); background: #FFF8FC; box-shadow: 0 8px 0 var(--ink); }
.sp-main { flex: 0 0 34%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; }
.sp-prev { height: 70%; aspect-ratio: 200 / 350; }
.sp-prev.k-baby { aspect-ratio: 200 / 260; } .sp-prev.k-animal { aspect-ratio: 200 / 290; }
.sp-prev .fr-svg { width: 100%; height: 100%; }
.sp-apply { font-size: var(--fs-m); min-width: 180px; }
.sp-side { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 10px; }
.sp-grid { flex: 1; min-height: 0; overflow-y: auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 10px; align-content: start; }
.sp-opt { aspect-ratio: 1; padding: 4px; border: 4px solid var(--ink); border-radius: 18px; background: #fff; box-shadow: 0 4px 0 var(--ink); }
.sp-opt.on { background: var(--sun); }
.sp-opt .fr-svg { width: 100%; height: 100%; }
.sp-colors { display: flex; flex-wrap: wrap; gap: 8px; flex: none; }
.sp-col { width: 46px; height: 46px; border-radius: 50%; border: 4px solid var(--ink); }
.sp-col.on { outline: 5px solid var(--sun); }
.sp-x { position: absolute; top: 10px; right: 10px; width: 50px; height: 50px; font-size: 22px; font-weight: 900; }
.sp-hint svg { width: 220px; }
.style-card:has(.sp-hint) { flex-direction: column; align-items: center; justify-content: center; width: min(420px, 90vw); height: auto; }
.sp-animal .fr-svg { width: 160px; height: 160px; }
.friend.restyle .fr-svg { animation: restyle .9s ease-in-out; }
@keyframes restyle { 0% { transform: none; } 30% { transform: scale(1.08) rotate(-4deg); filter: brightness(1.4); } 60% { transform: scale(.96) rotate(3deg); } 100% { transform: none; } }
@media (orientation: portrait) { .style-ov .style-card { flex-direction: column; } .sp-main { flex: 0 0 40%; } }
.sp-opt { overflow: hidden; }
.sp-opt .fr-svg, .sp-animal .fr-svg { overflow: hidden; }

/* ---------- Pozlar: yatma, yüzme ---------- */
.friend.pose-lie { transform: translate(-50%, -100%) rotate(-90deg); transform-origin: 50% 100%; }
.friend.pose-lie .shadow { display: none; }
.friend.pose-swim { animation: swimBob 1.8s ease-in-out infinite; }
.friend.pose-swim .fr-svg { clip-path: inset(0 0 50% 0); }
.friend.pose-swim::after { content: ''; position: absolute; left: -12%; right: -12%; bottom: calc(50% - 10px); height: 20px; border: 4px solid rgba(255, 255, 255, .9); border-radius: 50%; animation: ripple 1.8s ease-in-out infinite; }
.friend.pose-swim .shadow { display: none; }
@keyframes swimBob { 0%, 100% { transform: translate(-50%, -100%); } 50% { transform: translate(-50%, -103%); } }
@keyframes ripple { 0%, 100% { transform: scaleX(1); opacity: .9; } 50% { transform: scaleX(1.12); opacity: .6; } }
/* Araç bağlantısı (hortum vb.) */
.tether { position: absolute; inset: 0; pointer-events: none; z-index: 3; overflow: visible; }
.water-jet { position: absolute; pointer-events: none; z-index: 30; }
.pfx-fire .flame { animation: flicker .5s ease-in-out infinite alternate; transform-box: fill-box; transform-origin: 50% 100%; }
@keyframes flicker { to { transform: scaleY(1.06) scaleX(.96); } }
.pfx-meadow .flutter { animation: flutter 2.4s ease-in-out infinite; }
@keyframes flutter { 50% { transform: translateY(-14px); } }
/* Gövde giysisi (önlük, ceket, pelerin) arkadaşı taşımayı engellemez: dokunuş arkadaşa gider */
.obj.worn.w-apron { pointer-events: none; }
.fr-svg .beat { animation: beat .5s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
@keyframes beat { 50% { transform: scale(1.25); } }
.pfx-aquarium .swim0 { animation: fishA 3s ease-in-out infinite; } .pfx-aquarium .swim1 { animation: fishA 2.4s ease-in-out infinite reverse; } .pfx-aquarium .swim2 { animation: fishA 3.6s ease-in-out infinite; }
@keyframes fishA { 50% { transform: translateX(40px); } }
.pfx-xray .xray-img { animation: xrayIn .4s ease-out; }
@keyframes xrayIn { from { opacity: 0; } to { opacity: 1; } }
/* Kapalı araçta yolculuk: yalnız üst gövde (pencereden görünür), araç gövdesinin üstünde dokunulabilir */
.friend.pose-ride .fr-svg { clip-path: inset(0 0 46% 0); }
.friend.pose-ride .shadow, .friend.riding .shadow { display: none; }
.obj.worn.w-float { pointer-events: none; }
/* Pişen eşya: cızırtı (titreşim + buhar) */
.obj.cooking { animation: sizzle .18s linear infinite alternate; }
@keyframes sizzle { to { transform: translate(-50%, -100%) translateY(-2px); } }

/* ---------- Taksi: resimli hedef paneli ---------- */
.taxi-ov .taxi-card { position: relative; display: grid; grid-template-columns: repeat(2, minmax(140px, 220px)); gap: 18px; padding: 28px; background: #fff; border: 4px solid #5B3A6E; border-radius: 28px; box-shadow: 0 10px 0 rgba(91, 58, 110, .25); }
.taxi-dest { background: #FFF8E6; border: 4px solid #5B3A6E; border-radius: 22px; padding: 10px; cursor: pointer; transition: transform .12s; }
.taxi-dest:active { transform: scale(.95); }
.taxi-dest svg { width: 100%; height: auto; display: block; }
.taxi-dest.here { opacity: .45; }
.taxi-ov .tx-x { position: absolute; top: -18px; right: -18px; }
.obj .smoke { animation: smokeUp 1.6s ease-in-out infinite; }
@keyframes smokeUp { 50% { transform: translateY(-10px); opacity: .6; } }

/* ---------- Makyaj ve Bakım: yakın plan bakım paneli ---------- */
.beauty-ov .beauty-card { position: relative; display: flex; gap: 22px; align-items: stretch; padding: 24px; background: #fff; border: 4px solid #5B3A6E; border-radius: 30px; box-shadow: 0 10px 0 rgba(91, 58, 110, .25); max-width: min(94vw, 980px); max-height: 90vh; }
.beauty-ov .bp-left { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; background: #FFF0F8; border: 3px solid #5B3A6E; border-radius: 24px; padding: 10px; }
.beauty-ov .bp-prev { width: clamp(150px, 22vw, 240px); }
.beauty-ov .bp-prev svg { width: 100%; height: auto; display: block; }
.beauty-ov .bp-right { flex: 1 1 auto; display: flex; flex-direction: column; gap: 10px; min-width: 0; overflow-y: auto; padding: 8px; }
.beauty-ov .bp-tabs { display: flex; gap: 10px; }
.beauty-ov .bp-tab { width: 64px; height: 64px; border-radius: 18px; border: 3px solid #5B3A6E; background: #FFF8E6; padding: 4px; cursor: pointer; }
.beauty-ov .bp-tab.on { background: #FFD3E8; box-shadow: 0 0 0 4px #FF8FC0; }
.beauty-ov .bp-tab svg { width: 100%; height: 100%; }
.beauty-ov .bp-body { display: flex; flex-direction: column; gap: 8px; }
.beauty-ov .bp-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.beauty-ov .bp-label { height: 22px; }
.beauty-ov .bp-label svg { height: 100%; width: auto; }
.beauty-ov .bp-sw { width: 46px; height: 46px; border-radius: 50%; border: 3px solid #5B3A6E; cursor: pointer; padding: 0; }
.beauty-ov .bp-sw.on { box-shadow: 0 0 0 4px #fff, 0 0 0 8px #5B3A6E; }
.beauty-ov .bp-sw.none { background: #fff; }
.beauty-ov .bp-sw.none svg { width: 100%; height: 100%; }
.beauty-ov .bp-st, .beauty-ov .bp-pat { width: 54px; height: 54px; border-radius: 14px; border: 3px solid #5B3A6E; background: #FFF8E6; padding: 4px; cursor: pointer; }
.beauty-ov .bp-st.on, .beauty-ov .bp-pat.on { background: #FFD3E8; box-shadow: 0 0 0 4px #FF8FC0; }
.beauty-ov .bp-st svg, .beauty-ov .bp-pat svg { width: 100%; height: 100%; }
.beauty-ov .bp-close { display: flex; justify-content: center; }
.beauty-ov .bp-limb { width: clamp(170px, 24vw, 260px); height: auto; }
.beauty-ov .bp-nail { cursor: pointer; }
.beauty-ov .bp-actions { display: flex; gap: 12px; margin-top: auto; }
.beauty-ov .bp-actions .toy-btn { min-width: 74px; min-height: 64px; font-size: 30px; }
.beauty-ov .bp-clear svg { width: 34px; height: 34px; }
.beauty-ov .bp-x { position: absolute; top: -18px; right: -18px; }
.beauty-ov .bp-hint svg { width: 200px; }
@media (max-width: 760px), (max-height: 560px) { .beauty-ov .beauty-card { flex-direction: column; padding: 16px; } .beauty-ov .bp-prev { width: 120px; } .beauty-ov .bp-limb { width: 160px; } }

/* ---------- R5 final: üst üste nesneler ayrı seçilir, etkinlik düğmeleri erişilebilir ---------- */
/* Nesneler yalnız ÇİZİLİ kısımlarından dokunulur: üstteki eşyanın boş köşesi alttakini örtmez */
.place-obj > .obj { pointer-events: none; }
.place-obj > .obj svg.item-svg { pointer-events: none; }
.place-obj > .obj svg.item-svg * { pointer-events: visiblePainted; }
.place-obj > .obj div.item-svg { pointer-events: auto; }
.place-obj > .obj.in-closed .item-svg, .place-obj > .obj.in-closed .item-svg *,
.place-obj > .obj.worn.w-apron .item-svg, .place-obj > .obj.worn.w-apron .item-svg *,
.place-obj > .obj.worn.w-float .item-svg, .place-obj > .obj.worn.w-float .item-svg * { pointer-events: none !important; }
/* Etkinlik düğmeleri nesnelerin üstündeki katmanda */
.place-btn { position: absolute; inset: 0; z-index: 4; pointer-events: none; }
.place-btn > .pfx { pointer-events: auto; }

/* ================= R5 MİNİ OYUNLAR ================= */
/* Oyun kartları eşit; önerilen oyunda küçük rozet */
.game-body.picker { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: minmax(0, 1fr); }
.game-card.eq, .game-card.eq.featured { grid-row: auto; grid-column: auto; position: relative; background: #fff; }
.game-card.eq .g-ic .ic { width: clamp(56px, 12vmin, 120px); height: clamp(56px, 12vmin, 120px); }
.game-card .g-rec { position: absolute; top: 8px; right: 8px; width: clamp(34px, 6vmin, 52px); height: clamp(34px, 6vmin, 52px); animation: aJelly 2.4s ease-in-out infinite; }
.game-card .g-rec svg { width: 100%; height: 100%; }
@media (orientation: portrait) { .game-body.picker { grid-template-columns: repeat(2, minmax(0, 1fr)); } .game-card.eq.featured { grid-column: auto; } }
/* Resimli seviye kartları */
.g-chooser { max-width: 980px; }
.g-choice { width: clamp(118px, 17vmin, 170px); }
.g-choice-art { width: 82%; height: auto; display: block; }
.g-choice.lv4 { background: #E3E9FF; } .g-choice.lv5 { background: #F0E0FF; }
.g-chooser.n5 .g-choice-stars { font-size: 17px; letter-spacing: 0; }
/* Hafıza: okunabilir boy, gerekirse kaydırma */
.mem-scroll { flex: 1; width: 100%; height: 100%; min-height: 0; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.mem-scroll.scroll { overflow-y: auto; align-items: flex-start; -webkit-overflow-scrolling: touch; touch-action: pan-y; padding: 4px 0 16px; }
.mem-grid.r5 { display: grid; width: auto; max-width: none; justify-content: center; }
.mem-grid.r5 .mem-card { aspect-ratio: 1; }
/* Resimli ilerleme (tur yıldızları) */
.g-prog { display: flex; gap: 8px; justify-content: center; }
.g-prog span { width: clamp(26px, 4.5vmin, 40px); height: clamp(26px, 4.5vmin, 40px); }
.g-prog svg { width: 100%; height: 100%; fill: #fff; }
.g-prog span.on svg { fill: #FFE14D; }
.g-prog span.cur svg { fill: #FFF3B0; animation: aJelly 1.4s ease-in-out infinite; }
.sh-wrap { gap: var(--sp-3); }
.sh-wrap .dd-item, .sh-wrap .dd-target { width: clamp(80px, 15vmin, 150px); }
/* Renk + Sayı Atölyesi */
.ws-wrap { position: relative; gap: var(--sp-3); }
.ws-tray { flex-wrap: wrap; justify-content: center; gap: 10px; }
.ws-it { width: clamp(64px, 11vmin, 100px) !important; }
.ws-basket { width: clamp(130px, 20vmin, 200px); height: auto; aspect-ratio: auto; border: 0; background: none; display: flex; flex-direction: column; align-items: center; padding: 0; }
.ws-basket .ws-b, .ws-plate .ws-b { width: 100%; height: auto; }
.ws-in { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; min-height: 40px; max-width: 100%; }
.ws-mini { width: clamp(30px, 5vmin, 44px); height: clamp(30px, 5vmin, 44px); padding: 0; border: 0; background: none; cursor: pointer; }
.ws-mini svg { width: 100%; height: 100%; }
.ws-plate { width: clamp(220px, 34vmin, 340px); height: auto; aspect-ratio: auto; border: 0; background: none; display: flex; flex-direction: column-reverse; align-items: center; padding: 0; }
.ws-plate.ok { animation: aJelly .5s; }
.ws-order { display: flex; align-items: center; gap: 14px; }
.ws-card { display: flex; align-items: center; gap: 10px; background: #fff; border: 4px solid var(--ink); border-radius: 22px; padding: 8px 16px; box-shadow: 0 5px 0 var(--ink); }
.ws-card > svg:first-child { width: clamp(48px, 9vmin, 80px); height: clamp(48px, 9vmin, 80px); }
.ws-card .ws-dots { width: clamp(54px, 9vmin, 80px); height: auto; }
.ws-card.nope { animation: aWiggle .45s; }
.ws-ok { min-width: 70px; min-height: 64px; font-size: 32px; }
.ws-undo { position: absolute; left: 0; top: 0; min-width: 60px; min-height: 60px; padding: 6px; }
.ws-undo svg { width: 38px; height: 38px; }
/* Yıldız patlatma: büyük hedef ve resimli sayaç */
.pop-top.r5 { display: flex; align-items: center; gap: 16px; justify-content: center; }
.pop-target.big { width: clamp(84px, 15vmin, 140px); height: clamp(84px, 15vmin, 140px); background: #fff; border: 5px solid var(--ink); border-radius: 50%; padding: 10px; box-shadow: 0 6px 0 var(--ink); }
.pop-target.big svg { width: 100%; height: 100%; }
.pop-slots { display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px; }
.pop-slots span { width: clamp(28px, 5vmin, 44px); height: clamp(28px, 5vmin, 44px); filter: grayscale(1) opacity(.3); transition: filter .2s; }
.pop-slots span.on { filter: none; animation: aJelly .4s; }
.pop-slots svg { width: 100%; height: 100%; }
.pop-obj.big { width: clamp(84px, 15vmin, 136px); }
/* düzeltme: atölye tabağı/sepetleri büyük hedef, gölge kartları kare */
.ws-wrap .dd-target.ws-plate { width: clamp(260px, 42vmin, 420px); min-height: clamp(120px, 20vmin, 200px); justify-content: flex-end; }
.ws-wrap .dd-target.ws-basket { width: clamp(150px, 23vmin, 230px); }
.ws-wrap .ws-in { min-height: 48px; }
.sh-wrap .dd-item, .sh-wrap .dd-target { height: auto; aspect-ratio: 1; }
.sh-wrap .dd-row { align-items: center; }
/* Mekân başlığı: ad tek satır ve tam; hızlı geçiş düğmeleri kalan alanda yatay kayar */
.placescr .pl-title { flex: 0 0 auto; white-space: nowrap; }
.placescr .pl-switch { flex: 1 1 auto; min-width: 0; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; padding: 2px 4px 6px; margin: 0 6px; -webkit-overflow-scrolling: touch; }
.placescr .pl-switch::-webkit-scrollbar { display: none; }
.placescr .pl-switch .pl-sw { flex: 0 0 auto; }
.placescr .pl-switch.many .pl-sw { width: 48px; height: 48px; border-width: 3px; }
.placescr .s-top > * { flex-shrink: 0; }
.placescr .s-top > .pl-switch { flex-shrink: 1; }
/* Taksi hedef paneli dar ekranda ekrana sığar (kapat düğmesi dahil) */
@media (max-width: 520px) {
  .taxi-ov .taxi-card { grid-template-columns: repeat(2, minmax(0, 1fr)); width: calc(100vw - 48px); padding: 18px; gap: 12px; }
  .taxi-ov .tx-x { top: -14px; right: -10px; }
}
/* Mekânlarım: kart yüksekliği en-boy oranından; satır kartla büyür (telefonda üst üste binme düzeltmesi) */
.ps-grid { grid-auto-rows: auto; }
.ps-grid > .ps-card { align-self: start; height: auto; }
.ps-grid > .ps-card { overflow: clip; }
.ps-grid { grid-template-columns: repeat(auto-fill, minmax(min(200px, 40vw), 1fr)); }
/* Bakım paneli: dar/alçak ekranda kaydet/sil her zaman görünür */
.beauty-ov .bp-actions { position: sticky; bottom: 0; background: #fff; padding-top: 6px; z-index: 1; }
@media (max-height: 560px) and (min-width: 600px) {
  .beauty-ov .beauty-card { flex-direction: row; padding: 12px; max-height: 94vh; }
  .beauty-ov .bp-prev { width: 110px; }
  .beauty-ov .bp-limb { width: 130px; }
  .beauty-ov .bp-sw { width: 34px; height: 34px; }
  .beauty-ov .bp-st, .beauty-ov .bp-pat { width: 40px; height: 40px; }
  .beauty-ov .bp-tab { width: 48px; height: 48px; }
}
@media (max-width: 600px) {
  .beauty-ov .beauty-card { flex-direction: column; padding: 12px; max-height: 92vh; gap: 8px; }
  .beauty-ov .bp-left { padding: 4px; }
  .beauty-ov .bp-prev { width: 84px; }
  .beauty-ov .bp-limb { width: 140px; }
  .beauty-ov .bp-sw { width: 36px; height: 36px; }
}