/* Nova retro konsolu — "gerçek konsol" etkileşimleri (Retro.astro etkilesimli → .retro[data-konsol]).
 * tema.css'teki .retro* kurallarının üstüne yazar; davranış konsol.js'te. Marka/model/logo yok (D-037).
 * Kök öznitelikleri: [data-kartus] yanda · ustte · takili   [data-surukle] kartuş elde   [data-kirp] yuva altı kırpılır
 *                    [data-takili] [data-acik] (tema.css ile ortak)   [data-yakin] TV kameraya yaklaşır   [data-yuva-yakin] bırakılırsa takılır */

/* ── düğme sıfırlama: anahtarlar, kartuş ve TV düğmeleri gerçek <button> ── */
.retro[data-konsol] :is(.retro__kartus, .retro__anahtar, .retro__teker) { appearance: none; -webkit-appearance: none; margin: 0; padding: 0; border: 0; background: none; color: inherit; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.retro[data-konsol] :is(.retro__kartus, .retro__anahtar, .retro__teker):focus-visible { outline: 2px solid #ffa52b; outline-offset: .4cqw; }
.retro[data-konsol] .knsl-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* cihaz panelinde altta yardım satırı için biraz yer */
.telefon-sahne .retro[data-konsol] { width: min(820px, 94vw, calc((100svh - 290px) / .72)); }
@media (min-width: 1100px) { .panel--cihaz .telefon-sahne .retro[data-konsol] { width: min(820px, 56vw, calc((100svh - 290px) / .72)); } }
.knsl-yardim { margin: .5rem 0 0; font: 600 .74rem / 1.4 var(--font-util, ui-monospace, monospace); letter-spacing: .06em; color: var(--ink-muted, #c9a48e); text-align: center; max-width: 64ch; }
.knsl-yardim b { color: var(--d-vurgu2, #ffa52b); font-weight: 800; }

/* ── kartuş: konsolun yanında durur → (sürükle | tıkla) → yuvanın üstü → yuvaya iner ── */
.retro[data-konsol] { --yan-x: -29.5cqw; --yan-y: 11.8cqw; }
.retro[data-konsol] .retro__yuva { overflow: visible; }
.retro[data-konsol][data-kirp] .retro__yuva { clip-path: inset(-90cqw -90cqw 0 -90cqw); }
.retro[data-konsol] .retro__kartus { --tx: var(--yan-x); --ty: var(--yan-y); --rz: -5deg;
  pointer-events: auto; cursor: grab; touch-action: none; animation: none; z-index: 2;
  transform: translate(var(--tx), var(--ty)) rotate(var(--rz)) scale(var(--ks, 1));
  transition: transform .42s cubic-bezier(.3, .8, .25, 1), filter .2s; }
.retro[data-konsol][data-kartus="ustte"] .retro__kartus { --tx: 0px; --ty: -4cqw; --rz: 0deg; }
.retro[data-konsol][data-kartus="takili"] .retro__kartus { --tx: 0px; --ty: 5.4cqw; --rz: 0deg; cursor: pointer; transition: transform .2s cubic-bezier(.55, 0, .9, .4); }
.retro[data-konsol][data-surukle] .retro__kartus { cursor: grabbing; filter: drop-shadow(0 1.8cqw 1.4cqw rgb(0 0 0 / .55)) brightness(1.08); }
.retro[data-konsol] .retro__kartus:hover { filter: brightness(1.12); }
/* yanda dururken hafifçe "beni al" diye zıplar (transform'dan bağımsız translate) */
@media (prefers-reduced-motion: no-preference) {
  .retro[data-konsol][data-kartus="yanda"]:not([data-surukle]) .retro__kartus { animation: knsl-davet 3.2s ease-in-out 1.2s infinite; }
}
@keyframes knsl-davet { 0%, 70%, 100% { translate: 0 0; } 78% { translate: 0 -1.6cqw; } 86% { translate: 0 0; } 91% { translate: 0 -.6cqw; } }
/* yuva: sürüklerken bırakılabilecek yerdeyse parlar */
.retro[data-konsol] .retro__ust::after { transition: box-shadow .15s, background .15s; }
.retro[data-konsol][data-surukle] .retro__ust::after { box-shadow: inset 0 .3cqw .4cqw #000, 0 0 0 .3cqw #6b4a2a; }
.retro[data-konsol][data-yuva-yakin] .retro__ust::after { background: #1a0d06; box-shadow: inset 0 .3cqw .4cqw #000, 0 0 0 .35cqw #ffa52b, 0 0 2.4cqw #ff6a1e; }

/* ── anahtarlar: GÜÇ kaydırmalı (aria-checked), SIFIRLA yaylı (basılınca kalkar, bırakınca iner) ── */
.retro[data-konsol] .retro__anahtar { padding: .4cqw .6cqw; border-radius: .6cqw; }
/* parmakla da tutulsun: görünmez geniş dokunma alanı */
.retro[data-konsol] .retro__anahtar { position: relative; }
.retro[data-konsol] .retro__anahtar::before { content: ""; position: absolute; inset: max(-10px, -2cqw) max(-12px, -1.6cqw); }
.retro[data-konsol] .retro__anahtar:hover i { box-shadow: inset 0 0 0 .25cqw #4a3a30, 0 0 1cqw rgb(255 165 43 / .35); }
.retro[data-konsol] .retro__anahtar i::after { transition: transform .16s cubic-bezier(.5, 1.6, .5, 1); }
.retro[data-konsol] .knsl-sifirla[data-basili] i::after { transform: translateY(-90%); transition-duration: .06s; }
.retro[data-konsol] .retro__anahtar small { pointer-events: none; }

/* ── TV düğmeleri: KANAL (kademeli döner), SES (kapalı ↔ açık) ── */
.retro[data-konsol] .knsl-dugme { display: grid; justify-items: center; gap: .5cqw; }
.retro[data-konsol] .knsl-dugme small { font: 700 max(6px, 1cqw) / 1 var(--font-util, monospace); letter-spacing: .12em; color: #b7a493; }
.retro[data-konsol] .retro__tv-yan { gap: 1.6cqw; padding-top: 1.6cqw; }
.retro[data-konsol] .retro__teker { transition: box-shadow .15s; }
.retro[data-konsol] .retro__teker:hover { box-shadow: 0 .4cqw .6cqw rgb(0 0 0 / .6), inset 0 0 0 .35cqw #0d0c0c, 0 0 0 .25cqw rgb(255 165 43 / .35); }
.retro[data-konsol] .retro__teker::after { transform: rotate(var(--aci, -35deg)); transition: transform .14s cubic-bezier(.4, 1.8, .5, 1); }
.retro[data-konsol] .knsl-ses { --aci: -130deg; }
.retro[data-konsol] .knsl-ses[aria-pressed="true"] { --aci: 40deg; }
.retro[data-konsol] .knsl-ses[aria-pressed="true"]::before { content: ""; position: absolute; right: -1cqw; top: -.4cqw; width: .8cqw; aspect-ratio: 1; border-radius: 50%; background: #ffa52b; box-shadow: 0 0 .8cqw #ff6a1e; }

/* ── TV ekranı: kar, renk çubukları, ekran yazısı (OSD), CRT noktası ── */
.retro[data-konsol] .knsl-tv { position: absolute; inset: 0; z-index: 3; pointer-events: none; border-radius: inherit; overflow: hidden; }
.retro[data-konsol] .knsl-tv > * { position: absolute; }
.retro[data-konsol] .knsl-kar, .retro[data-konsol] .knsl-cubuk { inset: 0; width: 100%; height: 100%; opacity: 0; }
.retro[data-konsol] .knsl-kar { image-rendering: auto; filter: contrast(1.25) brightness(.95); }
.retro[data-konsol] .knsl-tv[data-gor="kar"] .knsl-kar { opacity: 1; }
.retro[data-konsol] .knsl-tv[data-gor="cubuk"] .knsl-cubuk { opacity: 1; }
.retro[data-konsol] .knsl-tv[data-gor="kar"], .retro[data-konsol] .knsl-tv[data-gor="cubuk"] { background: #000; }
/* genel test deseni: yedi dikey çubuk + alt şerit */
.retro[data-konsol] .knsl-cubuk { display: flex; background: linear-gradient(transparent 72%, #0b0b0b 72% 78%, transparent 78%),
  linear-gradient(90deg, #1b2a6b 0 18%, #f2f2f2 18% 32%, #3a1361 32% 50%, #101010 50% 78%, #1c1c1c 78% 86%, #101010 86%); }
.retro[data-konsol] .knsl-cubuk i { flex: 1; height: 72%; }
.retro[data-konsol] .knsl-cubuk i:nth-child(1) { background: #c0c0c0; }
.retro[data-konsol] .knsl-cubuk i:nth-child(2) { background: #c0c000; }
.retro[data-konsol] .knsl-cubuk i:nth-child(3) { background: #00c0c0; }
.retro[data-konsol] .knsl-cubuk i:nth-child(4) { background: #00c000; }
.retro[data-konsol] .knsl-cubuk i:nth-child(5) { background: #c000c0; }
.retro[data-konsol] .knsl-cubuk i:nth-child(6) { background: #c00000; }
.retro[data-konsol] .knsl-cubuk i:nth-child(7) { background: #0000c0; }
/* ortadaki yazı: "KARTUŞ TAK", "GÜÇ'Ü AÇ" (güç kapalıyken sönük, cam yansıması gibi) */
.retro[data-konsol] .knsl-ipucu { left: 0; right: 0; top: 50%; margin: 0; transform: translateY(-50%); text-align: center;
  font: 800 max(9px, 2.6cqw) / 1.2 var(--font-util, monospace); letter-spacing: .28em; color: #fff; opacity: 0;
  text-shadow: 0 0 .6cqw rgb(255 255 255 / .6), .25cqw 0 0 rgb(255 0 60 / .45), -.25cqw 0 0 rgb(0 200 255 / .45); }
.retro[data-konsol] .knsl-ipucu:not(:empty) { opacity: 1; }
.retro[data-konsol] .knsl-ipucu span { display: inline-block; padding: .5cqw 1.4cqw; background: rgb(0 0 0 / .72); }
.retro[data-konsol] .knsl-tv[data-gor="sonuk"] .knsl-ipucu { opacity: .32; text-shadow: none; color: #d8cfc4; font-size: max(8px, 1.9cqw); }
.retro[data-konsol] .knsl-tv[data-gor="sonuk"] .knsl-ipucu span { background: none; }
@media (prefers-reduced-motion: no-preference) {
  .retro[data-konsol] .knsl-tv[data-gor="kar"] .knsl-ipucu span { animation: knsl-yanip 1.1s steps(1) infinite; }
}
@keyframes knsl-yanip { 50% { opacity: .25; } }
/* OSD: yeşil kanal numarası / ses çubuğu, sağ üstte, birkaç saniye */
.retro[data-konsol] .knsl-osd { right: 7%; top: 8%; margin: 0; font: 800 max(10px, 3.4cqw) / 1 var(--font-util, monospace); letter-spacing: .08em; color: #3dff6a;
  text-shadow: 0 0 .8cqw rgb(61 255 106 / .7), .2cqw .2cqw 0 #062a10; opacity: 0; transition: opacity .2s; white-space: pre; text-align: right; }
.retro[data-konsol] .knsl-osd[data-gorunur] { opacity: 1; transition: none; }
.retro[data-konsol] .knsl-osd small { display: block; font-size: .5em; letter-spacing: .2em; margin-top: .6cqw; }
/* CRT kapanışında ortada kalan beyaz nokta */
.retro[data-konsol] .knsl-nokta { position: absolute; z-index: 3; pointer-events: none; left: 50%; top: 50%; width: 1.4cqw; height: 1.4cqw; margin: -.7cqw; border-radius: 50%; background: #fff;
  box-shadow: 0 0 1.4cqw .6cqw rgb(255 255 255 / .8), 0 0 4cqw 1.2cqw rgb(170 210 255 / .35); opacity: 0; }

/* açıkken hafif titreşim (cam altında, tıklamayı geçirir); hareket azaltmada yok */
.retro[data-konsol] .retro__ekran::before { content: ""; position: absolute; inset: 0; z-index: 4; pointer-events: none; border-radius: inherit; opacity: 0; background: rgb(255 255 255 / .035); }
@media (prefers-reduced-motion: no-preference) {
  .retro[data-konsol][data-acik] .retro__ekran::before { animation: knsl-titre .19s steps(2) infinite; }
}
@keyframes knsl-titre { 0% { opacity: .15; } 50% { opacity: .9; } 100% { opacity: .3; } }
/* sıfırlama / sinyal kopması: kısa ekran sarsıntısı (JS sınıfı) */
.retro[data-konsol] .retro__ekran[data-sars] { animation: knsl-sars .32s steps(6) 1; }
@keyframes knsl-sars { 0% { transform: translate(0, 0); filter: brightness(1.8) contrast(1.4); } 20% { transform: translate(-.6cqw, .2cqw) skewX(4deg); }
  40% { transform: translate(.5cqw, -.3cqw); filter: brightness(.6) hue-rotate(40deg); } 60% { transform: translate(-.3cqw, 0) skewX(-3deg); } 80% { transform: translate(.2cqw, .1cqw); } 100% { transform: none; filter: none; } }

/* ── öne gelme: oyun başlarken TV kameraya hafifçe yaklaşır, gölge büyür (yalnız geniş ekran) ── */
.retro[data-konsol] .retro__tv { transform-origin: 50% 100%; transition: transform .5s cubic-bezier(.3, .8, .25, 1); }
.retro[data-konsol] .retro__tv-govde { transition: box-shadow .5s; }
@media (min-width: 900px) and (prefers-reduced-motion: no-preference) {
  .retro[data-konsol][data-yakin] .retro__tv { transform: scale(1.06); }
  .retro[data-konsol][data-yakin] .retro__tv-govde { box-shadow: inset 0 0 0 .5cqw rgb(0 0 0 / .35), 0 4cqw 6cqw rgb(0 0 0 / .6), 0 0 14cqw color-mix(in srgb, var(--d-vurgu, #ff6a1e) 30%, transparent); }
}

/* ── kumanda: klavyeyi yansıtır; dokunmatik/fareyle de kullanılır ── */
.retro[data-konsol] .retro__kol { cursor: grab; touch-action: none; user-select: none; -webkit-user-select: none; }
.retro[data-konsol] .retro__cubuk { transform: rotate(var(--kol-aci, -6deg)) scaleY(var(--kol-boy, 1)); transition: transform .09s ease-out; }
.retro[data-konsol] .retro__kol[data-yon="sol"] { --kol-aci: -28deg; }
.retro[data-konsol] .retro__kol[data-yon="sag"] { --kol-aci: 26deg; }
.retro[data-konsol] .retro__kol[data-nova] { --kol-boy: .8; }
.retro[data-konsol] .retro__kol[data-nova] .retro__cubuk { box-shadow: 0 0 1.2cqw rgb(255 106 30 / .7); }
.retro[data-konsol] .retro__ates { cursor: pointer; transition: transform .06s, box-shadow .06s, filter .06s; }
.retro[data-konsol] .retro__kol[data-ates] .retro__ates { transform: translateY(.3cqw); box-shadow: 0 0 0 #4a1c09, 0 0 1.6cqw #ff6a1e; filter: brightness(1.25); }

/* ══ gerçekçi görünüm: ceviz kaplama + vernik, siyah plastik dokusu, fırçalanmış metal, bombeli CRT camı, zemin + oda ışığı ══
 * Dokular SVG feTurbulence'tan (data URI: bir kez rasterlenir, "stitch" ile döşenir). Görsel dosya yok; sürekli animasyon yok. */
.retro[data-konsol] {
  --knsl-ceviz: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='640' height='320'><filter id='f' x='0' y='0' width='100%' height='100%' color-interpolation-filters='sRGB'><feTurbulence type='fractalNoise' baseFrequency='.0042 .05' numOctaves='4' seed='11' stitchTiles='stitch'/><feComponentTransfer><feFuncR type='table' tableValues='.45 .8 .3 .7 .2 .85 .4 .95 .3 .65 .15 .8 .4 .9 .25 .6 .45'/></feComponentTransfer><feColorMatrix values='.44 0 0 0 .12 .26 0 0 0 .065 .12 0 0 0 .028 0 0 0 0 1' result='a'/><feTurbulence type='fractalNoise' baseFrequency='.008 .45' numOctaves='2' seed='4' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .07 0 0 0 0 .035 0 0 0 0 .015 -2.3 0 0 0 1.16'/><feComposite in2='a' operator='over'/></filter><rect width='100%' height='100%' filter='url(%23f)'/></svg>");
  --knsl-doku: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='f' x='0' y='0' width='100%' height='100%'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' seed='3' stitchTiles='stitch'/><feColorMatrix values='1 0 0 0 0 1 0 0 0 0 1 0 0 0 0 0 0 0 0 .1'/></filter><rect width='100%' height='100%' filter='url(%23f)'/></svg>");
  --knsl-kagit: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='f' x='0' y='0' width='100%' height='100%'><feTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3' seed='8' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .42 0 0 0 0 .3 0 0 0 0 .16 -1.5 0 0 0 .86'/></filter><rect width='100%' height='100%' filter='url(%23f)'/></svg>");
  --knsl-hali: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='f' x='0' y='0' width='100%' height='100%' color-interpolation-filters='sRGB'><feTurbulence type='fractalNoise' baseFrequency='.42' numOctaves='3' seed='5' stitchTiles='stitch'/><feColorMatrix values='.62 0 0 0 .06 .34 0 0 0 .02 .14 0 0 0 .005 0 0 0 0 1'/></filter><rect width='100%' height='100%' filter='url(%23f)'/></svg>");
  --knsl-firca: repeating-linear-gradient(90deg, rgb(255 255 255 / .09) 0 1px, rgb(0 0 0 / .06) 1px 2px, transparent 2px 3px, rgb(255 255 255 / .04) 3px 4px);
  --knsl-krom: linear-gradient(90deg, #5d6064, #c9ccd0 18%, #fbfcfd 33%, #9ea1a5 50%, #e2e4e6 68%, #85888c 86%, #4f5256);
}

/* sahne: halı (gerçek 3B düzlem, perspektif), lamba ışığı duvarda ve halıda; hepsi tıklamayı geçirir */
.retro[data-konsol]::before { content: ""; position: absolute; z-index: -2; left: -18cqw; right: -18cqw; top: -14cqw; bottom: 8cqw; pointer-events: none;
  background: radial-gradient(48% 52% at 26% 34%, rgb(255 168 92 / .13), rgb(255 140 70 / .05) 45%, transparent 72%),
    radial-gradient(40% 40% at 80% 60%, rgb(255 120 60 / .05), transparent 70%); }
.retro[data-konsol] .knsl-zemin { left: -13cqw; right: -13cqw; top: 46cqw; height: 32cqw; z-index: -1; pointer-events: none; perspective: 38cqw; perspective-origin: 50% -30%; }
.retro[data-konsol] .knsl-zemin::before { content: ""; position: absolute; left: 4%; right: 4%; top: -150%; bottom: 0; transform-origin: 50% 100%; transform: rotateX(72deg);
  border-radius: 3cqw; background: radial-gradient(60% 46% at 42% 72%, rgb(255 180 110 / .22), transparent 75%),
    linear-gradient(180deg, rgb(0 0 0 / .55), transparent 40%), var(--knsl-hali) 0 0 / 6cqw 6cqw, #5a2f15;
  box-shadow: inset 0 0 0 .7cqw rgb(60 28 10 / .55), inset 0 0 3cqw 1cqw rgb(0 0 0 / .45);
  -webkit-mask-image: linear-gradient(180deg, transparent, #000 30%, #000 94%, rgb(0 0 0 / .4)); mask-image: linear-gradient(180deg, transparent, #000 30%, #000 94%, rgb(0 0 0 / .4)); }

/* kablolar: yuvarlak kesit (yumuşak gölge + parlak sırt) */
.retro[data-konsol] .retro__kablo path { stroke: #0d0c0c; stroke-width: max(3px, .62cqw); }
.retro[data-konsol] .knsl-kablo-golge path { stroke: rgb(0 0 0 / .45); stroke-width: max(5px, 1.2cqw); filter: blur(2px); }
.retro[data-konsol] .knsl-kablo-isik path { stroke: rgb(255 236 214 / .2); stroke-width: max(1px, .14cqw); transform: translate(-.08px, -.16px); }

/* ── TV kabini: ceviz, vernik parlaması, yuvarlatılmış kenar ışığı, aşınmış kenarlar, temas gölgesi ── */
.retro[data-konsol] .retro__tv::after { content: ""; position: absolute; z-index: -1; left: 2%; right: 2%; top: 50.5cqw; height: 6.5cqw; pointer-events: none;
  background: radial-gradient(closest-side, rgb(0 0 0 / .75), rgb(0 0 0 / .4) 55%, transparent); }
.retro[data-konsol] .retro__tv-govde {
  background: linear-gradient(180deg, rgb(255 232 205 / .2) 0, rgb(255 232 205 / .04) 1.4cqw, transparent 4cqw, transparent 80%, rgb(0 0 0 / .32)),
    linear-gradient(104deg, transparent 6%, rgb(255 244 228 / .11) 12%, rgb(255 244 228 / .03) 19%, transparent 24%, transparent 72%, rgb(255 244 228 / .06) 79%, transparent 85%),
    radial-gradient(110% 80% at 24% 8%, rgb(255 186 118 / .14), transparent 62%),
    var(--knsl-ceviz) 0 0 / 66cqw 33cqw, #4a2a14;
  box-shadow: 0 .35cqw .3cqw rgb(0 0 0 / .55), 0 2.4cqw 3cqw rgb(0 0 0 / .45), 0 0 9cqw color-mix(in srgb, var(--d-vurgu, #ff6a1e) 12%, transparent); }
.retro[data-konsol] .retro__tv-govde::before { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  box-shadow: inset 0 .28cqw .12cqw rgb(255 222 186 / .42), inset .22cqw 0 .25cqw rgb(255 222 186 / .14), inset 0 -.45cqw .5cqw rgb(0 0 0 / .6),
    inset -.3cqw 0 .45cqw rgb(0 0 0 / .42), inset 0 0 0 .1cqw rgb(18 9 3 / .95), inset 0 0 1.1cqw .2cqw rgb(196 140 86 / .16); }
/* ön maske: dokulu siyah plastik, kenarında ince krom çıta */
.retro[data-konsol] .retro__cam { isolation: isolate; border: .34cqw solid transparent;
  background: var(--knsl-doku) 0 0 / 160px padding-box, radial-gradient(130% 100% at 28% 8%, #3b3735, #191716 50%, #0c0b0b) padding-box,
    linear-gradient(158deg, #fbfbf9, #8e8d8a 20%, #e3e2df 42%, #6c6b68 66%, #d1d0cc 86%, #777673) border-box;
  box-shadow: 0 0 0 .14cqw rgb(10 5 2 / .85), 0 .45cqw .7cqw rgb(0 0 0 / .5), inset 0 .22cqw .2cqw rgb(255 255 255 / .13), inset 0 -.35cqw .5cqw rgb(0 0 0 / .75); }
/* tüpün dudağı + kapalıyken koyu yeşil-gri cam */
.retro[data-konsol] .retro__ekran { background: radial-gradient(112% 96% at 50% 42%, #323b36 0%, #222925 42%, #101411 78%, #060807);
  box-shadow: 0 0 0 .3cqw #050505, 0 -.22cqw .25cqw .3cqw rgb(0 0 0 / .9), 0 .28cqw .2cqw .36cqw rgb(255 255 255 / .07); }
/* cam: oda/pencere yansıması, bombe parıltısı, köşe kararması; açıkken tarama çizgisi */
.retro[data-konsol] .retro__ekran::after {
  background: radial-gradient(36% 24% at 26% 16%, rgb(255 250 240 / .1), rgb(255 250 240 / .03) 55%, transparent 76%),
    linear-gradient(117deg, transparent 17%, rgb(255 255 255 / .045) 23%, rgb(255 255 255 / .015) 33%, transparent 35%),
    radial-gradient(90% 34% at 50% 106%, rgb(255 196 140 / .07), transparent 62%),
    repeating-linear-gradient(0deg, rgb(0 0 0 / .24) 0 1px, transparent 1px 3px),
    radial-gradient(120% 115% at 50% 48%, transparent 52%, rgb(0 0 0 / .32) 76%, rgb(0 0 0 / .86) 100%);
  box-shadow: inset 0 0 2.8cqw rgb(0 0 0 / .85), inset 0 0 .5cqw rgb(0 0 0 / .9), inset 0 .2cqw .2cqw rgb(255 255 255 / .05); }
.retro[data-konsol]:not([data-acik]) .retro__ekran::after {
  background: radial-gradient(34% 22% at 27% 17%, rgb(255 248 236 / .2), rgb(255 248 236 / .06) 55%, transparent 78%),
    radial-gradient(14% 8% at 72% 14%, rgb(255 214 160 / .1), transparent 80%),
    linear-gradient(117deg, transparent 15%, rgb(255 255 255 / .07) 22%, rgb(255 255 255 / .02) 33%, transparent 35%),
    radial-gradient(90% 34% at 50% 106%, rgb(255 196 140 / .1), transparent 62%),
    radial-gradient(120% 115% at 50% 48%, rgb(70 92 80 / .1) 30%, rgb(0 0 0 / .3) 76%, rgb(0 0 0 / .86) 100%); }
/* açık: fosfor ışığı çerçeveye taşar, görüntü hafif doygun (bloom yerine) */
.retro[data-konsol] .retro__cam::after { content: ""; position: absolute; z-index: -1; inset: 1.4cqw; border-radius: 9% / 12%; pointer-events: none; opacity: 0; transition: opacity .4s;
  box-shadow: 0 0 1.6cqw .5cqw rgb(170 200 255 / .16), 0 0 4cqw 1cqw rgb(255 150 90 / .06); }
.retro[data-konsol][data-acik] .retro__cam::after { opacity: 1; }
.retro[data-konsol][data-acik] .retro__ekran > .oyun-kap { filter: saturate(1.12) contrast(1.05); }
.retro[data-konsol][data-acik] .retro__ekran::before { background: radial-gradient(80% 70% at 50% 50%, rgb(255 255 255 / .05), transparent 70%); }

/* yan panel, düğmeler (tırtıklı metal + döner gösterge), delikli metal hoparlör ızgarası */
.retro[data-konsol] .retro__tv-yan { background: var(--knsl-doku) 0 0 / 160px, linear-gradient(180deg, #2c2826, #171514 38%, #0f0e0d);
  box-shadow: 0 0 0 .14cqw rgb(10 5 2 / .85), 0 .45cqw .7cqw rgb(0 0 0 / .45), inset 0 .22cqw .2cqw rgb(255 255 255 / .1), inset 0 -.35cqw .5cqw rgb(0 0 0 / .7); }
.retro[data-konsol] .retro__teker {
  background: radial-gradient(circle at 40% 30%, rgb(255 255 255 / .55), rgb(255 255 255 / 0) 24%),
    radial-gradient(circle closest-side, #eceae6 0, #d2cfca 30%, #a8a5a0 56%, #77746f 63%, rgb(20 20 20 / .9) 64.5%, transparent 67%),
    radial-gradient(circle closest-side, transparent 80%, rgb(0 0 0 / .55) 100%),
    repeating-conic-gradient(from 2deg, #2a2928 0 2.4deg, #8f8c88 3.4deg, #e2dfda 4.1deg, #5d5b58 5deg, #2a2928 6deg);
  box-shadow: 0 0 0 .22cqw #090808, 0 .2cqw 0 .22cqw rgb(255 255 255 / .06), 0 .7cqw .8cqw rgb(0 0 0 / .75), 0 .2cqw .15cqw rgb(0 0 0 / .9); }
.retro[data-konsol] .retro__teker:hover { box-shadow: 0 0 0 .22cqw #090808, 0 0 0 .45cqw rgb(255 165 43 / .35), 0 .7cqw .8cqw rgb(0 0 0 / .75); }
.retro[data-konsol] .retro__teker::after { top: 19%; height: 27%; width: .5cqw; margin-left: -.25cqw; border-radius: .25cqw; transform-origin: 50% 115%;
  background: linear-gradient(90deg, #3a3330, #0b0908 45%, #2a2421); box-shadow: 0 .06cqw 0 rgb(255 255 255 / .35); }
.retro[data-konsol] .knsl-dugme small { color: #cfc6b8; text-shadow: 0 .1cqw 0 #000; }
.retro[data-konsol] .retro__hoparlor { width: 10.5cqw; height: 15cqw; border-radius: .5cqw;
  background: radial-gradient(circle, #070707 0 .2cqw, rgb(0 0 0 / .55) .25cqw, transparent .3cqw) 0 0 / .8cqw .8cqw,
    radial-gradient(circle, #070707 0 .2cqw, rgb(0 0 0 / .55) .25cqw, transparent .3cqw) .4cqw .4cqw / .8cqw .8cqw,
    linear-gradient(180deg, rgb(255 255 255 / .2), transparent 35%, rgb(0 0 0 / .35)),
    var(--knsl-firca), linear-gradient(90deg, #66645f, #aeaba6 28%, #8a8782 52%, #bab7b2 78%, #6f6d68);
  box-shadow: 0 0 0 .2cqw #0a0909, 0 .15cqw 0 .2cqw rgb(255 255 255 / .07), inset 0 0 0 .08cqw rgb(255 255 255 / .25), inset 0 .3cqw .5cqw rgb(0 0 0 / .45); }
/* ayaklar: konik ceviz, ucu pirinç */
.retro[data-konsol] .retro__tv-ayak { position: relative; margin: -.2cqw 9% 0; height: 3.2cqw; background: none; }
.retro[data-konsol] .retro__tv-ayak::before, .retro[data-konsol] .retro__tv-ayak::after { content: ""; position: absolute; top: 0; width: 3.2cqw; height: 100%;
  clip-path: polygon(0 0, 100% 0, 78% 100%, 22% 100%);
  background: linear-gradient(180deg, transparent 78%, #c9a25a 80%, #f0d79a 86%, #8a6a2c 96%),
    linear-gradient(90deg, rgb(0 0 0 / .5), rgb(255 225 190 / .18) 35%, transparent 55%, rgb(0 0 0 / .55)), var(--knsl-ceviz) 0 0 / 30cqw 15cqw, #3a2010; }
.retro[data-konsol] .retro__tv-ayak::before { left: 0; }
.retro[data-konsol] .retro__tv-ayak::after { right: 0; }

/* ── konsol: oluklu siyah üst yüzey, ceviz ön panel, siyah yan kapaklar, temas gölgesi ── */
.retro[data-konsol] .retro__konsol { filter: drop-shadow(0 .5cqw .45cqw rgb(0 0 0 / .55)); }
.retro[data-konsol] .retro__konsol::after { content: ""; position: absolute; z-index: -1; left: -5%; right: -5%; bottom: -2cqw; height: 4cqw; pointer-events: none;
  background: radial-gradient(closest-side, rgb(0 0 0 / .8), rgb(0 0 0 / .4) 55%, transparent); }
.retro[data-konsol] .retro__ust {
  background: linear-gradient(180deg, rgb(255 255 255 / .1), transparent 38%, rgb(0 0 0 / .4)),
    radial-gradient(60% 180% at 28% 0%, rgb(255 196 140 / .09), transparent 60%),
    var(--knsl-doku) 0 0 / 120px,
    repeating-linear-gradient(90deg, #060505 0 .16cqw, #2b2725 .3cqw, #4c4744 .42cqw, #24201f .62cqw, #0d0c0c .9cqw, #060505 1.1cqw), #111;
  box-shadow: inset 0 -.18cqw 0 rgb(255 255 255 / .14), inset 0 .12cqw 0 rgb(255 255 255 / .08); }
.retro[data-konsol] .retro__ust::after { background: linear-gradient(#000, #0b0908 60%, #1c1917);
  box-shadow: inset 0 .35cqw .4cqw #000, 0 0 0 .28cqw #1b1817, 0 .12cqw 0 .3cqw rgb(255 255 255 / .1), 0 -.1cqw 0 .3cqw rgb(0 0 0 / .7); }
.retro[data-konsol] .retro__on {
  background: linear-gradient(180deg, rgb(0 0 0 / .6) 0, rgb(0 0 0 / .22) .8cqw, transparent 1.6cqw),
    linear-gradient(174deg, transparent 32%, rgb(255 242 224 / .13) 44%, rgb(255 242 224 / .03) 54%, transparent 58%),
    linear-gradient(180deg, rgb(255 230 200 / .08), transparent 40%, rgb(0 0 0 / .32)),
    var(--knsl-ceviz) 30% 0 / 52cqw 26cqw, #4a2a14;
  box-shadow: inset 0 .45cqw 0 #0c0a09, inset 0 .56cqw 0 rgb(255 255 255 / .08), inset 0 0 0 .12cqw rgb(15 8 3 / .9),
    inset 0 -.35cqw .3cqw rgb(0 0 0 / .5), inset 0 0 1.2cqw .1cqw rgb(196 140 86 / .14); }
.retro[data-konsol] .retro__on::before, .retro[data-konsol] .retro__on::after { content: ""; position: absolute; top: 0; bottom: 0; width: 2.6cqw; pointer-events: none;
  background: var(--knsl-doku) 0 0 / 120px, linear-gradient(180deg, #2a2624, #121010 45%, #0a0909); }
.retro[data-konsol] .retro__on::before { left: 0; border-radius: 0 0 0 1cqw; box-shadow: inset .2cqw .1cqw .15cqw rgb(255 255 255 / .12), inset -.15cqw 0 .2cqw rgb(0 0 0 / .8); }
.retro[data-konsol] .retro__on::after { right: 0; border-radius: 0 0 1cqw 0; box-shadow: inset -.2cqw .1cqw .2cqw rgb(0 0 0 / .6), inset .15cqw 0 .2cqw rgb(0 0 0 / .8); }

/* anahtarlar: krom plaka + yuva + tırtıklı krom kol; kol kalkınca gölgesi uzar */
.retro[data-konsol] .retro__anahtar { color: #f3e3c8; text-shadow: 0 .1cqw 0 rgb(0 0 0 / .85); }
.retro[data-konsol] .retro__anahtar i { --plaka: 0 .2cqw .25cqw rgb(0 0 0 / .65), 0 0 0 .1cqw #1a120b, inset 0 .1cqw 0 rgb(255 255 255 / .85), inset 0 -.1cqw 0 rgb(0 0 0 / .35);
  width: 2.8cqw; height: 5cqw; border-radius: .45cqw;
  background: var(--knsl-firca), linear-gradient(180deg, #f2f3f4, #a3a6aa 28%, #e4e6e8 55%, #8a8d91 82%, #c6c8cb); box-shadow: var(--plaka); }
.retro[data-konsol] .retro__anahtar:hover i { box-shadow: var(--plaka), 0 0 1cqw rgb(255 165 43 / .4); }
.retro[data-konsol] .retro__anahtar i::before { content: ""; position: absolute; left: 50%; top: 11%; bottom: 11%; width: .9cqw; margin-left: -.45cqw; border-radius: .45cqw;
  background: #040404; box-shadow: inset 0 .28cqw .25cqw #000, 0 .08cqw 0 rgb(255 255 255 / .7), 0 -.06cqw 0 rgb(0 0 0 / .4); }
.retro[data-konsol] .retro__anahtar i::after { left: 13%; right: 13%; bottom: 9%; height: 38%; border-radius: .3cqw;
  background: repeating-linear-gradient(0deg, rgb(0 0 0 / .2) 0 .1cqw, transparent .1cqw .28cqw), var(--knsl-krom);
  box-shadow: 0 .3cqw .3cqw rgb(0 0 0 / .6), inset 0 .1cqw 0 rgb(255 255 255 / .9), inset 0 -.12cqw 0 rgb(0 0 0 / .45);
  transition: transform .16s cubic-bezier(.5, 1.6, .5, 1), box-shadow .16s; }
.retro[data-konsol][data-acik] .retro__anahtar--guc i::after, .retro[data-konsol] .knsl-sifirla[data-basili] i::after {
  box-shadow: 0 .6cqw .5cqw rgb(0 0 0 / .45), inset 0 .1cqw 0 rgb(255 255 255 / .9), inset 0 -.12cqw 0 rgb(0 0 0 / .45); }
/* güç ışığı: krom halka içinde amber cam mercek; yanınca hale */
.retro[data-konsol] .retro__led { width: 1.6cqw;
  background: radial-gradient(circle at 36% 30%, rgb(255 255 255 / .55) 0 9%, transparent 18%), radial-gradient(circle at 50% 62%, #6a2c12, #2a0e05 72%);
  box-shadow: 0 0 0 .16cqw #121010, 0 0 0 .32cqw #b9bbbe, 0 .1cqw 0 .34cqw rgb(0 0 0 / .5), inset 0 -.15cqw .2cqw rgb(0 0 0 / .6); }
.retro[data-konsol][data-acik] .retro__led {
  background: radial-gradient(circle at 36% 30%, #fff 0 10%, transparent 20%), radial-gradient(circle at 50% 55%, #fff1c4 0 14%, #ffb04a 34%, #ff6a1e 60%, #a8360a 92%);
  box-shadow: 0 0 0 .16cqw #121010, 0 0 0 .32cqw #c9cbce, 0 0 1.2cqw .35cqw rgb(255 110 30 / .65), 0 0 3.2cqw .6cqw rgb(255 120 40 / .28); }

/* kartuş: kabartmalı plastik gövde, kenarı yıpranmış kağıt etiket (baskı dokusu), içinde oyunun piksel karesi */
.retro[data-konsol] .retro__kartus {
  background: linear-gradient(90deg, rgb(255 255 255 / .1), transparent 10% 90%, rgb(0 0 0 / .4)),
    linear-gradient(180deg, rgb(255 255 255 / .14), transparent 7%),
    repeating-linear-gradient(180deg, #34302d 0 .14cqw, #0f0d0c .14cqw .42cqw) left .3cqw top 1.2cqw / .7cqw 8.6cqw no-repeat,
    repeating-linear-gradient(180deg, #34302d 0 .14cqw, #0f0d0c .14cqw .42cqw) right .3cqw top 1.2cqw / .7cqw 8.6cqw no-repeat,
    var(--knsl-doku) 0 0 / 120px, linear-gradient(#272322, #161413);
  box-shadow: inset 0 .16cqw .1cqw rgb(255 255 255 / .2), inset 0 -.22cqw .2cqw rgb(0 0 0 / .65), inset .14cqw 0 .1cqw rgb(255 255 255 / .08), inset 0 0 0 .08cqw #000; }
.retro[data-konsol] .retro__kartus::before { content: ""; position: absolute; left: 1.15cqw; right: 1.15cqw; top: .7cqw; height: 9.7cqw; pointer-events: none;
  background: linear-gradient(#b8441a, #b8441a) 50% 6.75cqw / 78% .16cqw no-repeat, var(--knsl-kagit) 0 0 / 90px,
    radial-gradient(130% 120% at 46% 38%, #f4e8cc 50%, #e2cfa6 85%, #c9b083);
  clip-path: polygon(0 .8%, 22% 0, 48% .6%, 76% 0, 100% .5%, 99.4% 34%, 100% 71%, 99.5% 92%, 94% 100%, 63% 99.2%, 31% 100%, 2% 99.4%, 0 80%, .6% 42%); }
.retro[data-konsol] .retro__etiket { left: 1.75cqw; right: 1.75cqw; top: 1.3cqw; height: 5.6cqw; border-radius: .15cqw; box-shadow: inset 0 0 0 .14cqw rgb(13 6 10 / .85); }
.retro[data-konsol] .retro__etiket::before { width: 6.6cqw; height: 6.6cqw; margin-left: -3.3cqw; }
.retro[data-konsol] .retro__etiket::after { background: linear-gradient(160deg, rgb(255 214 140 / .24), transparent 45%, rgb(13 6 10 / .3)); }
.retro[data-konsol] .retro__kartus b { top: 7.75cqw; color: #2b170c; letter-spacing: .32em; text-shadow: 0 0 .06cqw rgb(43 23 12 / .6); }

/* kumanda: dokulu siyah taban, kauçuk körük, parlak çubuk, içbükey ateş düğmesi */
.retro[data-konsol] .retro__kol {
  background: radial-gradient(120% 120% at 22% 12%, rgb(255 255 255 / .1), transparent 50%), var(--knsl-doku) 0 0 / 120px, linear-gradient(160deg, #2c2928, #131211 55%, #0a0909);
  box-shadow: inset 0 .25cqw .15cqw rgb(255 255 255 / .17), inset .2cqw 0 .2cqw rgb(255 255 255 / .06), inset 0 -.4cqw .4cqw rgb(0 0 0 / .8), inset -.2cqw 0 .3cqw rgb(0 0 0 / .5),
    0 0 0 .1cqw #000, 0 .45cqw .35cqw rgb(0 0 0 / .65), 0 1.6cqw 2cqw rgb(0 0 0 / .4); }
.retro[data-konsol] .retro__kol::before { width: 5.8cqw; height: 5.8cqw; margin: -2.9cqw;
  background: radial-gradient(circle at 40% 34%, rgb(255 255 255 / .2), transparent 34%),
    repeating-radial-gradient(circle at 50% 50%, #0b0a0a 0 .3cqw, #2e2a29 .5cqw, #0b0a0a .72cqw), #111;
  box-shadow: 0 0 0 .18cqw #070606, 0 .25cqw .35cqw rgb(0 0 0 / .7), inset 0 0 .5cqw #000; }
.retro[data-konsol] .retro__cubuk { background: linear-gradient(90deg, #040404 0, #1c1a19 20%, #6e6a68 36%, #2a2827 50%, #0a0909 74%, #1a1818); }
.retro[data-konsol] .retro__cubuk::after { content: ""; position: absolute; left: -.25cqw; right: -.25cqw; top: -.5cqw; height: 2.2cqw; border-radius: 1.1cqw 1.1cqw .5cqw .5cqw;
  background: radial-gradient(circle at 38% 28%, rgb(255 255 255 / .45), transparent 30%), linear-gradient(90deg, #050505, #2b2827 30%, #5f5b59 42%, #141212 70%); }
.retro[data-konsol] .retro__ates { --halka: 0 0 0 .24cqw #0b0a0a, 0 0 0 .36cqw #3b3735, 0 .15cqw .15cqw .36cqw rgb(0 0 0 / .6);
  background: radial-gradient(circle at 50% 74%, rgb(255 214 176 / .5) 0, transparent 36%), radial-gradient(circle at 50% 36%, #7e2005 0, #d4441a 46%, #ff7a3c 72%, #b23a0e 88%, #5c1a05 100%);
  box-shadow: var(--halka), inset 0 .3cqw .35cqw rgb(0 0 0 / .5); }
.retro[data-konsol] .retro__kol[data-ates] .retro__ates { transform: translateY(.15cqw); box-shadow: var(--halka), inset 0 .4cqw .45cqw rgb(0 0 0 / .6), 0 0 1.6cqw #ff6a1e; filter: brightness(1.2); }

/* ══ sürükle-tak ipuçları: kartuş masada parlar, "SÜRÜKLE" + yol oku, bir kez oynayan hayalet el, takılınca oturma, sonra "GÜCE BAS" ══ */
.retro[data-konsol] { --el-x0: .5cqw; --el-y0: 59cqw; --el-x1: 30cqw; --el-y1: 44cqw; }
.retro[data-konsol] :is(.knsl-isik, .knsl-yol, .knsl-surukle, .knsl-hayalet) { pointer-events: none; opacity: 0; transition: opacity .3s; }
.retro[data-konsol][data-kartus="yanda"]:not([data-surukle]) :is(.knsl-isik, .knsl-yol, .knsl-surukle) { opacity: 1; }
/* kartuşun altında sıcak ışık havuzu */
.retro[data-konsol] .knsl-isik { left: -4cqw; top: 62cqw; width: 23cqw; height: 11cqw; z-index: 1;
  background: radial-gradient(closest-side, rgb(255 170 80 / .32), rgb(255 140 60 / .1) 60%, transparent); }
/* yol oku: kartuştan yuvaya kesik çizgi */
.retro[data-konsol] .knsl-yol { inset: 0; width: 100%; height: 100%; z-index: 3; overflow: visible; }
.retro[data-konsol] .knsl-yol path { fill: none; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.retro[data-konsol] .knsl-yol .knsl-yol__alt { stroke: rgb(10 5 2 / .7); stroke-width: max(4px, .7cqw); }
.retro[data-konsol] .knsl-yol .knsl-yol__cizgi { stroke: #ffb24a; stroke-width: max(2px, .32cqw); stroke-dasharray: 6 7; }
.retro[data-konsol] .knsl-yol .knsl-yol__uc { stroke: #ffb24a; stroke-width: max(2px, .32cqw); }
@media (prefers-reduced-motion: no-preference) {
  .retro[data-konsol] .knsl-yol .knsl-yol__cizgi { animation: knsl-akis 1s linear infinite; }
}
@keyframes knsl-akis { to { stroke-dashoffset: -13; } }
/* "SÜRÜKLE" etiketi kartuşun üstünde */
.retro[data-konsol] .knsl-surukle { left: 1cqw; top: 54.6cqw; z-index: 3; padding: .45cqw 1.1cqw; border-radius: 99px; white-space: nowrap;
  font: 800 max(9px, 1.45cqw) / 1 var(--font-util, monospace); letter-spacing: .2em; color: #1b0e05;
  background: linear-gradient(#ffc061, #ff9a2e); box-shadow: 0 .3cqw .8cqw rgb(0 0 0 / .55), 0 0 1.6cqw rgb(255 150 50 / .45); }
/* kartuşa geniş görünmez tutma alanı (dokunmatik) */
.retro[data-konsol] .retro__kartus::after { content: ""; position: absolute; inset: -2cqw -2.2cqw; }
.retro[data-konsol][data-kartus="takili"] .retro__kartus::after { inset: 0; }
/* sürüklerken yuva nabız gibi parlar (yaklaşınca tema kuralı daha güçlü yakar) */
@media (prefers-reduced-motion: no-preference) {
  .retro[data-konsol][data-surukle]:not([data-yuva-yakin]) .retro__ust::after { animation: knsl-yuva-nabiz 1s ease-in-out infinite; }
}
@keyframes knsl-yuva-nabiz { 50% { box-shadow: inset 0 .3cqw .4cqw #000, 0 0 0 .3cqw #ffa52b, 0 0 1.8cqw rgb(255 106 30 / .6); } }
/* hayalet el: bir kez kartuştan yuvanın üstüne taşır (JS [data-el] koyar; hareket azaltmada yok) */
.retro[data-konsol] .knsl-hayalet { left: 0; top: 0; width: 14cqw; height: 11.5cqw; z-index: 4; transform: translate(var(--el-x0), var(--el-y0)); }
.retro[data-konsol] .knsl-hayalet::before { content: ""; position: absolute; inset: 0; border-radius: 1cqw 1cqw .3cqw .3cqw; border: max(1.5px, .25cqw) dashed rgb(255 190 100 / .9);
  background: rgb(255 170 80 / .1); opacity: 0; }
.retro[data-konsol] .knsl-hayalet svg { position: absolute; left: 4.8cqw; top: 4.6cqw; width: 5.4cqw; height: auto; filter: drop-shadow(0 .4cqw .5cqw rgb(0 0 0 / .6)); }
.retro[data-konsol]:not([data-kartus="yanda"]) .knsl-hayalet { display: none; }
.retro[data-konsol][data-el] .knsl-hayalet { animation: knsl-el 2.8s cubic-bezier(.45, 0, .3, 1) 1 both; }
.retro[data-konsol][data-el] .knsl-hayalet::before { animation: knsl-el-iz 2.8s linear 1 both; }
.retro[data-konsol][data-el] .knsl-hayalet svg { animation: knsl-el-tut 2.8s ease-in-out 1 both; }
@keyframes knsl-el { 0% { opacity: 0; transform: translate(calc(var(--el-x0) + 3cqw), calc(var(--el-y0) + 4cqw)); }
  14% { opacity: 1; transform: translate(var(--el-x0), var(--el-y0)); } 24% { transform: translate(var(--el-x0), var(--el-y0)); }
  66% { transform: translate(var(--el-x1), var(--el-y1)); } 80% { opacity: 1; transform: translate(var(--el-x1), calc(var(--el-y1) + 3.2cqw)); }
  100% { opacity: 0; transform: translate(var(--el-x1), calc(var(--el-y1) + 3.2cqw)); } }
@keyframes knsl-el-iz { 0%, 20% { opacity: 0; } 28%, 76% { opacity: 1; } 90%, 100% { opacity: 0; } }
@keyframes knsl-el-tut { 0%, 14% { transform: none; } 20%, 76% { transform: scale(.86) rotate(-6deg); } 84%, 100% { transform: none; } }
/* takılınca: konsol tık diye oturur, yuva kısa parlar */
@media (prefers-reduced-motion: no-preference) {
  .retro[data-konsol][data-kartus="takili"] .retro__on { animation: knsl-otur .3s ease-out .16s 1 both; }
  .retro[data-konsol][data-kartus="takili"] .retro__ust::after { animation: knsl-flas .7s ease-out .16s 1; }
}
@keyframes knsl-otur { 0%, 100% { translate: 0 0; } 35% { translate: 0 .3cqw; } }
@keyframes knsl-flas { 0% { box-shadow: inset 0 .3cqw .4cqw #000, 0 0 0 .35cqw #ffd08a, 0 0 3cqw #ff6a1e; } 100% { box-shadow: inset 0 .35cqw .4cqw #000, 0 0 0 .28cqw #1b1817; } }
/* sonra: GÜÇ anahtarına ipucu ("GÜCE BAS"), anahtar nabız gibi parlar */
.retro[data-konsol] .knsl-guc::after { content: attr(data-ipucu); position: absolute; right: calc(100% + 1.6cqw); top: 50%; translate: 0 -50%; pointer-events: none; opacity: 0; transition: opacity .3s;
  padding: .45cqw 1cqw; border-radius: 99px; white-space: nowrap; font: 800 max(8px, 1.3cqw) / 1 var(--font-util, monospace); letter-spacing: .18em; color: #1b0e05;
  background: linear-gradient(#ffc061, #ff9a2e); box-shadow: 0 .3cqw .8cqw rgb(0 0 0 / .55), 0 0 1.6cqw rgb(255 150 50 / .45); text-shadow: none; }
.retro[data-konsol][data-kartus="takili"]:not([data-acik]) .knsl-guc::after { opacity: 1; transition-delay: .5s; }
.retro[data-konsol][data-kartus="takili"]:not([data-acik]) .knsl-guc i { box-shadow: var(--plaka), 0 0 0 .3cqw #ffa52b, 0 0 1.6cqw rgb(255 140 40 / .7); }
@media (prefers-reduced-motion: no-preference) {
  .retro[data-konsol][data-kartus="takili"]:not([data-acik]) .knsl-guc i { animation: knsl-guc-nabiz 1.2s ease-in-out .6s infinite; }
}
@keyframes knsl-guc-nabiz { 50% { box-shadow: var(--plaka), 0 0 0 .5cqw rgb(255 165 43 / .35), 0 0 2.6cqw rgb(255 140 40 / .9); } }
/* açılış ekranındaki "Kartuşu tak" düğmesi ikincil: erişilebilirlik için durur, ana yol sürüklemek */
.retro[data-konsol] .acilis [data-oyna] { min-height: 0; padding: .35rem .8rem; font-size: .72rem; letter-spacing: .06em; background: rgb(0 0 0 / .35); color: #ffcf8a;
  border: 1px solid rgb(255 178 74 / .55); box-shadow: none; }
.retro[data-konsol] .acilis [data-oyna]:hover { background: rgb(255 165 43 / .16); }

/* ── mobil: sade ve küçük; kartuş yine konsolun solunda ── */
@media (max-width: 599px) {
  .retro[data-konsol] { --yan-x: -31cqw; --yan-y: 13cqw; }
  .telefon-sahne .retro[data-konsol] { width: min(94vw, 420px); }
  .knsl-yardim { font-size: .68rem; padding-inline: 1rem; }
  .knsl-yardim__kol { display: none; }
  /* kartuş daha büyük ve kolay tutulur; ipuçları kaymış konsola göre */
  .retro[data-konsol] { --el-x0: 5cqw; --el-y0: 60.2cqw; --el-x1: 36cqw; }
  .retro[data-konsol][data-kartus="yanda"] .retro__kartus { --ks: 1.22; }
  .retro[data-konsol] .knsl-yol { transform: translateX(5cqw); }
  .retro[data-konsol] .knsl-surukle { left: 4.5cqw; top: 52.6cqw; font-size: max(9px, 2.2cqw); }
  .retro[data-konsol] .knsl-isik { left: 1cqw; }
  .retro[data-konsol] .knsl-guc::after { font-size: max(8px, 1.9cqw); }
}

@media (prefers-reduced-motion: reduce) {
  .retro[data-konsol] .retro__kartus, .retro[data-konsol] .retro__tv, .retro[data-konsol] .retro__teker::after, .retro[data-konsol] .retro__anahtar i::after, .retro[data-konsol] .retro__cubuk { transition: none; }
  .retro[data-konsol] .retro__ekran[data-sars] { animation: none; }
  .retro[data-konsol] .knsl-hayalet { display: none; }
}

/* ── oyun başlayınca TV kameraya yaklaşır ── */
.knsl-zoom-perde { position: absolute; inset: 0; z-index: 3; background: radial-gradient(60% 60% at 50% 50%, rgb(10 6 8 / .55), rgb(4 2 3 / .96)); cursor: zoom-out; opacity: 0; }
.knsl-zoom-kapat { position: fixed; top: max(16px, env(safe-area-inset-top, 0px)); right: 16px; z-index: 112; }
.retro[data-zoom] { position: relative; z-index: 4; will-change: transform; }
.retro[data-zoom] .bf-nova canvas, .retro[data-zoom] canvas { image-rendering: pixelated; }
/* perspektifli kap kendi katman bağlamını açıyor: yaklaşırken kabın kendisi perdenin üstüne çıkar */
.panel--cihaz:has(.retro[data-zoom]) .telefon-sahne { position: relative; z-index: 4; }
.bf-yatay:has(.retro[data-zoom]) :is(.panel__sayac, .ilerleme) { opacity: 0; transition: opacity .3s; }