/* Araba Park Et 3D */
body.oyunSayfa{background:#14181f;overscroll-behavior:none}
.oAlan{overflow:hidden;touch-action:none}
/* yatay telefonda üst barı inceltir (oyun alanı büyür) */
@media (orientation:landscape) and (max-height:520px){
  .oUst{padding:3px 10px;gap:8px}
  .oIkon{width:32px;height:32px;font-size:15px;border-radius:9px}
  .oBaslik{font-size:15px}
  .oLogo{font-size:14px}
}
:root{--dir:170px;--s:1}
.pkKap{position:absolute;inset:0;display:flex;flex-direction:column;overflow:hidden;background:#14181f;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;font-family:Nunito,system-ui,sans-serif}
.pkGorus{position:relative;flex:1 1 auto;min-height:0;overflow:hidden;background:linear-gradient(#9cc6ec,#cfe3f2 60%,#7a8a6c)}
#pkCanvas{position:absolute;left:0;top:0;width:100%;height:100%;display:block;touch-action:none;outline:none}
.pkYukle{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:#20304a;font:800 16px Nunito,sans-serif;z-index:1}
.pkYukle i{width:44px;height:44px;border-radius:50%;border:5px solid #ffffff88;border-top-color:#ffd23f;animation:pkDon .9s linear infinite}
@keyframes pkDon{to{transform:rotate(360deg)}}

/* ---------- üst bilgi */
.pkUst{position:absolute;left:8px;right:8px;top:8px;display:flex;justify-content:space-between;align-items:flex-start;gap:8px;z-index:3;pointer-events:none}
.pkUst>*{pointer-events:auto}
.pkSol{display:flex;flex-wrap:wrap;gap:6px;align-items:stretch;min-width:0}
.pkSag{display:flex;gap:6px;flex:0 0 auto}
.pkMenuBtn{display:flex;align-items:center;gap:7px;font:800 16px 'Baloo 2',Nunito,sans-serif;color:#2a1f00;background:linear-gradient(180deg,#ffe066,#f5b800);border:0;border-radius:13px;padding:5px 12px 5px 10px;cursor:pointer;box-shadow:0 3px 0 #0006,0 6px 16px #0004;white-space:nowrap;height:42px}
.pkMenuBtn i{font-style:normal;font-size:14px}
.pkMenuBtn:active{transform:translateY(2px);box-shadow:0 1px 0 #0006}
.pkStat{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:54px;height:42px;background:rgba(12,16,24,.72);border:1px solid #ffffff22;border-radius:12px;padding:2px 9px;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.pkStat small{color:#aab6c8;font:800 9.5px Nunito,sans-serif;text-transform:uppercase;letter-spacing:.5px;line-height:1.1}
.pkStat b{font:800 18px/1.1 'Baloo 2',Nunito,sans-serif;color:#fff;font-variant-numeric:tabular-nums;white-space:nowrap}
.pkStat.zaman b{color:#ffd23f}
.pkStat.zaman.az{border-color:#ff4b5c;animation:pkAz .8s infinite}
#pkHasar{color:#ff4b5c;letter-spacing:1px;font-size:15px}
#pkHasar .bos{color:#ffffff2a}
.pkStat.az{border-color:#ff4b5c88;animation:pkAz 1s infinite}
@keyframes pkAz{50%{background:rgba(120,20,30,.78)}}
#pkYildiz{color:#ffd23f;letter-spacing:1px;text-shadow:0 0 10px #ffd23f66;font-size:16px}
#pkYildiz .sonuk{color:#ffffff2a;text-shadow:none}
.pkAraclar{display:flex;gap:6px}
.pkArac,.pkIkon{position:relative;min-width:42px;height:42px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(12,16,24,.74);border:2px solid #ffffff2e;color:#fff;border-radius:12px;font-size:19px;line-height:1;cursor:pointer;font-family:inherit;padding:0 6px;-webkit-tap-highlight-color:transparent}
.pkArac small,.pkIkon small{font:800 9px Nunito,sans-serif;color:#d6deea;white-space:nowrap;margin-top:1px}
.pkArac.reklamli{background:linear-gradient(180deg,#3d8bff,#1f5fd6);border-color:#8fbaff}
.pkArac.reklamli::after{content:'▶';position:absolute;top:-7px;right:-6px;background:#ffd23f;color:#3a2600;font-size:8px;border-radius:8px;padding:1px 4px;line-height:1.4}
.pkArac:disabled{opacity:.4;cursor:not-allowed}
.pkArac:active,.pkIkon:active{transform:translateY(2px)}
.pkIkon{min-width:46px}

/* ---------- geri görüş kamerası */
.pkGeri{position:absolute;right:10px;top:60px;width:var(--gw,200px);height:var(--gh,120px);border:3px solid #1b1f26;border-radius:12px;box-shadow:0 0 0 2px #ffffff55,0 8px 20px #0007;z-index:2;pointer-events:none;overflow:hidden}
.pkGeri svg{position:absolute;inset:0;width:100%;height:100%;opacity:.85}
.pkGeri b{position:absolute;left:6px;top:4px;font:900 11px Nunito,sans-serif;color:#fff;background:#d8282f;border-radius:6px;padding:1px 6px;letter-spacing:.5px}
.pkGeri i{position:absolute;right:6px;top:5px;width:12px;height:12px;border-radius:50%;background:#38e07b;box-shadow:0 0 8px currentColor;color:#38e07b}
.pkGeri i.s1{background:#38e07b;color:#38e07b}.pkGeri i.s2{background:#ffd23f;color:#ffd23f}.pkGeri i.s3{background:#ff3b30;color:#ff3b30;animation:pkAz .3s infinite}
.pkGeri i.s0{background:#ffffff44;box-shadow:none}

/* ---------- park halkası / ipucu / uçan yazılar */
.pkParkH{position:absolute;left:50%;top:30%;width:74px;height:74px;transform:translate(-50%,-50%);z-index:2;pointer-events:none;filter:drop-shadow(0 4px 12px #0008)}
.pkParkH svg{width:100%;height:100%;transform:rotate(-90deg)}
.pkParkH circle{fill:rgba(12,16,24,.72);stroke-width:6}
.pkParkH .iz{stroke:#ffffff33}
.pkParkH .dolu{fill:none;stroke:#3ff7ff;stroke-dasharray:163.4;stroke-dashoffset:163.4;stroke-linecap:round}
.pkParkH b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:900 30px 'Baloo 2',Nunito,sans-serif;color:#3ff7ff}
.pkIpucu{position:absolute;left:50%;top:var(--ipY,64px);transform:translateX(-50%);background:rgba(12,16,24,.78);color:#fff;font:800 14px Nunito,sans-serif;padding:6px 14px;border-radius:12px;white-space:nowrap;z-index:2;pointer-events:none;border:1px solid #ffffff22;max-width:calc(100% - 20px);overflow:hidden;text-overflow:ellipsis}
.pkIpucu.iyi{border-color:#3ff7ff88;color:#bdfbff}
.pkIpucu.uyari{border-color:#ffd23f88;color:#ffe48a}
.pkUcan{position:absolute;inset:0;pointer-events:none;z-index:4;overflow:hidden}
.pkUcan span{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);font:900 26px 'Baloo 2',Nunito,sans-serif;color:#fff;text-shadow:0 3px 0 #0008,0 0 18px #000a;animation:pkUc 1.3s ease-out forwards;white-space:nowrap}
.pkUcan span.kirmizi{color:#ff6b5b}.pkUcan span.yesil{color:#5dff9a}.pkUcan span.sari{color:#ffd23f}
@keyframes pkUc{0%{opacity:0;transform:translate(-50%,-30%) scale(.7)}15%{opacity:1;transform:translate(-50%,-50%) scale(1.08)}70%{opacity:1}100%{opacity:0;transform:translate(-50%,-110%) scale(1)}}
.pkYanIpucu{position:absolute;left:8px;right:8px;bottom:52px;display:flex;align-items:center;gap:8px;background:rgba(31,95,214,.92);color:#fff;border-radius:12px;padding:6px 8px 6px 12px;font:800 13px Nunito,sans-serif;z-index:3;box-shadow:0 6px 16px #0006}
.pkYanIpucu span{flex:1}
.pkYanIpucu button{width:30px;height:30px;border-radius:9px;border:0;background:#ffffff33;color:#fff;font-size:15px;cursor:pointer;flex:0 0 auto}

/* ---------- hız göstergesi + park sensörü */
.pkGosterge{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);display:flex;align-items:center;gap:7px;background:rgba(12,16,24,.78);border:1px solid #ffffff26;border-radius:14px;padding:4px 10px;color:#fff;z-index:2;pointer-events:none;white-space:nowrap}
.pkGosterge b{font:900 22px/1 'Baloo 2',Nunito,sans-serif;color:#38e07b;min-width:18px;text-align:center}
.pkGosterge b.geri{color:#ff5a4e}.pkGosterge b.park{color:#4fb3ff}
.pkGosterge span{font:800 22px/1 'Baloo 2',Nunito,sans-serif;min-width:24px;text-align:right;font-variant-numeric:tabular-nums}
.pkGosterge small{font:700 10.5px Nunito,sans-serif;color:#aab6c8}
.pkSensor{display:flex;flex-direction:column;gap:2px;width:20px}
.pkSensor u{display:block;height:4px;border-radius:3px;background:#ffffff1f}
.pkSensor.arka{flex-direction:column-reverse}
.pkSensor.s1 u:nth-child(3),.pkSensor.s2 u:nth-child(3),.pkSensor.s3 u:nth-child(3){background:#38e07b}
.pkSensor.s2 u:nth-child(2),.pkSensor.s3 u:nth-child(2){background:#ffd23f}
.pkSensor.s3 u:nth-child(1){background:#ff3b30}
.pkSensor.arka.s1 u:nth-child(3),.pkSensor.arka.s2 u:nth-child(3),.pkSensor.arka.s3 u:nth-child(3){background:#38e07b}
.pkKlavye{display:none;position:absolute;left:50%;bottom:52px;transform:translateX(-50%);background:rgba(12,16,24,.55);color:#d6deea;font:600 12px Nunito,sans-serif;padding:5px 12px;border-radius:10px;white-space:nowrap;pointer-events:none;z-index:2}
.pkKlavye b{color:#ffd23f;background:#ffffff18;border-radius:5px;padding:0 4px;margin-left:6px}
.pkKap.klavye .pkKlavye{display:block}

/* ---------- kontrol paneli */
.pkPanel{display:grid;grid-template-columns:auto 1fr auto auto auto;grid-template-rows:auto auto;grid-template-areas:"dir bos el el gaz" "dir bos vit fren gaz";column-gap:calc(9px * var(--s));row-gap:calc(8px * var(--s));align-items:end;padding:6px 14px calc(10px + env(safe-area-inset-bottom)) calc(14px + env(safe-area-inset-left));padding-right:calc(14px + env(safe-area-inset-right));z-index:5;touch-action:none}
.pkKap.yatay .pkPanel{position:absolute;left:0;right:0;bottom:0;pointer-events:none;background:linear-gradient(180deg,rgba(10,13,19,0),rgba(10,13,19,.35) 55%,rgba(10,13,19,.6))}
.pkKap.yatay .pkPanel>*{pointer-events:auto}
.pkKap.dikey .pkPanel{position:relative;flex:0 0 auto;background:linear-gradient(180deg,#232831,#14171d 40%,#0e1015);border-top:2px solid #000;box-shadow:inset 0 2px 0 #ffffff14;padding-top:10px}
.pkDirK{grid-area:dir;position:relative;width:var(--dir);height:var(--dir);touch-action:none;border-radius:50%;cursor:grab;align-self:end}
.pkDirK:active{cursor:grabbing}
#pkDir{width:100%;height:100%;display:block;filter:drop-shadow(0 6px 10px #000a);will-change:transform;pointer-events:none}
.pkDirAci{position:absolute;left:50%;bottom:-2px;transform:translateX(-50%);font:800 10px Nunito,sans-serif;color:#aab6c8;background:#0009;border-radius:6px;padding:0 5px;pointer-events:none;opacity:0;transition:opacity .2s}
.pkDirK.tut .pkDirAci{opacity:1}
.pkEl{grid-area:el;height:calc(38px * var(--s));border-radius:12px;border:2px solid #6b7480;background:linear-gradient(180deg,#3a414c,#20252d);color:#cfd6e0;font:900 calc(11px * var(--s)) Nunito,sans-serif;letter-spacing:.4px;display:flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;touch-action:none;box-shadow:0 4px 0 #05070a;padding:0 8px;-webkit-tap-highlight-color:transparent;white-space:nowrap}
.pkEl i{font-style:normal;color:#ff5a4e;font-size:calc(14px * var(--s))}
.pkEl.acik{background:linear-gradient(180deg,#d8282f,#8c1218);border-color:#ff8a80;color:#fff;box-shadow:0 1px 0 #05070a,0 0 16px #ff3b3088}
.pkEl.acik i{color:#fff}
.pkVitesK{grid-area:vit;position:relative;width:calc(50px * var(--s));height:calc(128px * var(--s));border-radius:14px;background:linear-gradient(180deg,#2b313b,#171a20);border:2px solid #4b525d;touch-action:none;cursor:pointer;box-shadow:0 5px 0 #05070a,0 8px 16px #0008;display:flex;flex-direction:column;justify-content:space-around;align-items:center;-webkit-tap-highlight-color:transparent}
.pkVitesK span{position:relative;z-index:2;font:900 calc(17px * var(--s))/1 'Baloo 2',Nunito,sans-serif;color:#7c8592;width:100%;text-align:right;padding-right:calc(6px * var(--s));pointer-events:none}
.pkVitesK span.aktif.p{color:#4fb3ff}.pkVitesK span.aktif.r{color:#ff5a4e}.pkVitesK span.aktif.d{color:#38e07b}
.pkKanal{position:absolute;left:calc(13px * var(--s));top:14%;bottom:14%;width:5px;border-radius:3px;background:#0a0b0e;box-shadow:inset 0 1px 2px #000}
.pkTopuz{position:absolute;left:calc(4px * var(--s));top:50%;width:calc(24px * var(--s));height:calc(24px * var(--s));margin-top:calc(-12px * var(--s));border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffe066,#d39b00 70%,#7a5800);box-shadow:0 3px 6px #000c;transition:top .12s;z-index:3;pointer-events:none}
.pkPedal{display:flex;align-items:flex-end;justify-content:center;border-radius:12px;color:#e7ecf3;font:900 calc(11px * var(--s)) Nunito,sans-serif;letter-spacing:1px;cursor:pointer;touch-action:none;-webkit-tap-highlight-color:transparent;box-shadow:0 6px 0 #05070a,0 8px 16px #000a;transition:transform .05s;position:relative;
  background:repeating-linear-gradient(180deg,#4a515c 0 6px,#2d333c 6px 11px);border:2px solid #6b7480}
.pkPedal span{background:#000a;border-radius:6px;padding:1px 6px;margin-bottom:6px;pointer-events:none}
.pkFren{grid-area:fren;width:calc(86px * var(--s));height:calc(84px * var(--s))}
.pkGaz{grid-area:gaz;width:calc(60px * var(--s));height:calc(134px * var(--s))}
.pkPedal.bas{transform:translateY(5px) scale(.97);box-shadow:0 1px 0 #05070a,0 3px 8px #000a}
.pkFren.bas{border-color:#ff5a4e;box-shadow:0 1px 0 #05070a,0 0 18px #ff3b3077}
.pkGaz.bas{border-color:#38e07b;box-shadow:0 1px 0 #05070a,0 0 18px #38e07b77}
.pkKap.dikey .pkGosterge{bottom:8px}

/* ---------- modallar */
.pkYildizlar{display:flex;justify-content:center;gap:6px;margin:-4px 0 6px}
.pkY{font-size:48px;color:#ffffff22;transform:scale(.4);opacity:0;animation:pkYil .5s forwards cubic-bezier(.3,1.6,.5,1)}
.pkY.dolu{color:#ffd23f;text-shadow:0 0 18px #ffd23f99,0 3px 0 #a87b00}
@keyframes pkYil{to{transform:scale(1);opacity:1}}
.pkKayipE{font-size:56px;line-height:1;margin-bottom:4px}
.pkNot{font-size:14px;background:#ffffff0d;border-radius:10px;padding:8px 10px}
.pkOzet{margin:0 0 8px}
.pkBolumler{max-height:min(54vh,430px);overflow:auto;margin:0 -6px 6px;padding:0 6px;text-align:left;overscroll-behavior:contain;touch-action:pan-y}
.pkGrup{display:flex;align-items:center;gap:6px;font:800 14px Nunito,sans-serif;color:#ffd23f;margin:10px 0 6px}
.pkGrup span{font-size:18px}.pkGrup small{color:var(--soluk);margin-left:auto}
.pkHarita{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.pkHarita button{position:relative;height:54px;border-radius:12px;border:2px solid #2e3a6b;background:#232d55;color:#fff;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:inherit;padding:0}
.pkHarita button b{font:800 18px/1 'Baloo 2',Nunito,sans-serif}
.pkHarita button i{font-style:normal;font-size:10px;color:#ffd23f;letter-spacing:1px;line-height:1.3}
.pkHarita button i u{text-decoration:none;color:#ffffff30}
.pkHarita button em{position:absolute;top:2px;right:4px;font-style:normal;font-size:9px}
.pkHarita button.gecti{background:#1f4a3a;border-color:#2f8f5b}
.pkHarita button.siradaki{background:linear-gradient(180deg,#ffe066,#f5b800);border-color:#fff;color:#2a1f00;animation:pkNab 1.2s infinite}
.pkHarita button.siradaki i{color:#2a1f00}
.pkHarita button:disabled{opacity:.45;cursor:not-allowed}
@keyframes pkNab{50%{box-shadow:0 0 0 4px #ffd23f55}}
.pkYardim{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:6px 0 8px;text-align:left}
.pkYardim>div{display:flex;gap:8px;align-items:center;background:#ffffff0b;border-radius:12px;padding:7px 8px;font-size:13px;line-height:1.3}
.pkYardim svg{flex:0 0 44px;width:44px;height:44px}
.pkYardim b{color:#ffd23f}
.pkYardimL{text-align:left;font-size:13.5px;margin:4px 0 6px;padding-left:18px;color:#cdd4ee}
.pkYardimL li{margin:3px 0}
.pkAyar{display:flex;flex-direction:column;gap:8px;text-align:left;margin:8px 0}
.pkAyar label{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#ffffff0b;border-radius:12px;padding:9px 12px;font-weight:800;cursor:pointer}
.pkAyar label small{display:block;font-weight:600;color:var(--soluk);font-size:12px}
.pkAyar input[type=checkbox]{width:22px;height:22px;accent-color:#ffd23f;flex:0 0 auto}
.pkAyar .secimler{display:flex;gap:6px}
.pkAyar .secimler button{padding:6px 10px;border-radius:9px;border:2px solid #2e3a6b;background:#232d55;color:#fff;font:800 13px Nunito,sans-serif;cursor:pointer}
.pkAyar .secimler button.aktif{background:#ffd23f;color:#2a1f00;border-color:#fff}
@media (max-height:460px){.pkHarita button{height:46px}.pkBolumler{max-height:48vh}.pkYardim svg{flex-basis:34px;width:34px;height:34px}.pkYardim>div{padding:5px 7px;font-size:12px}}

/* dar ekran (dikey telefon): üst bilgi tek satır + araçlar */
.pkKap.dar .pkBolK{display:none}
.pkKap.dar .pkMenuBtn{padding:4px 10px 4px 9px;font-size:17px;height:40px}
.pkKap.dar .pkStat{min-width:46px;height:40px;padding:2px 6px}
.pkKap.dar .pkStat b{font-size:16px}
.pkKap.dar #pkHasar{font-size:12px;letter-spacing:0}
.pkKap.dar #pkYildiz{font-size:13px;letter-spacing:0}
.pkKap.dar .pkIkon{min-width:40px;height:40px}
.pkKap.dar .pkArac{min-width:38px;height:38px;font-size:17px}
.pkKap.dar .pkUst{left:6px;right:6px;top:6px}
.pkKap.dar .pkSol{gap:5px}
.pkKap.dar .pkSag{gap:5px}