/* DYNO / TEST SÜRÜŞÜ — DYNO-P2 birinci şahıs kokpit: tam ekran kokpit görseli, ekrana oturan TFT canvas'ı,
   üstte başlık, altta kontroller, sağda açılır "Veri" paneli. style.css değişkenleri. */
.dyno-ac-btn{position:absolute;z-index:4;left:50%;top:calc(24% + 66px);transform:translateX(-50%);white-space:nowrap;background:#0c1422e6;border:1px solid var(--blue);color:#bfefff;border-radius:40px;padding:11px 18px;font-size:11px;letter-spacing:1.1px;font-weight:800;box-shadow:0 0 22px #17b9e633;cursor:pointer}
.dyno-ac-btn[hidden]{display:none}.dyno-ac-btn span{color:var(--gold);margin-left:6px}
.dyno{position:relative;height:100svh;overflow:hidden;background:#05080e}
.dyno-head{position:absolute;z-index:3;left:0;right:0;top:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;padding:16px 140px 26px 200px;background:linear-gradient(180deg,#05080ef0 0,#05080ec0 60%,#05080e00 100%);pointer-events:none}
.dyno-head strong{font-size:22px;letter-spacing:.5px}.dyno-head small{color:var(--muted);font-size:11px}
.dyno-not{flex-basis:100%;margin:2px 0 0;font-size:10px;color:#f3cc58;letter-spacing:.3px;text-shadow:0 1px 3px #000}
/* Kokpit (P4 kamera): görsel kutusu dyno-ekran.js yerlesim() ile (kokpitKadraj: geri çekilmiş, kenarları yumuşak maskeli);
   arkasında bulanık/koyu dolgu (kenar şeritleri gerilmiş), üstte vinyet. JS'ten önce cover yedeği. */
.kokpit{position:absolute;inset:0;overflow:hidden;background:#05080e}
.kokpit::after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(ellipse 72% 72% at 50% 60%,#05080e00 42%,#05080e66 78%,#05080ed0 100%)}
.kokpit-dolgu{position:absolute;inset:0;width:100%;height:100%;transform:scale(1.08);filter:blur(18px) brightness(.8) saturate(.85);pointer-events:none}
.kokpit-dolgu[hidden]{display:none}
.kokpit-resim{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 100%;user-select:none;-webkit-user-select:none;pointer-events:none}
.kokpit-tft{position:absolute;left:0;top:0;transform-origin:0 0;border-radius:14px;pointer-events:none}
.kokpit-tft[hidden]{display:none}
/* KOKPIT-3 sağ el tuvali: kokpit görseliyle aynı kutu (tam boy taban + el bölgesi; gaz değişince bölgeye kare çizilir, JS). */
.kokpit-el{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-select:none;pointer-events:none}
.kokpit-el[hidden]{display:none}
.kokpit-hud{position:absolute;z-index:3;left:18px;bottom:112px;display:flex;flex-direction:column;gap:2px;padding:7px 11px;border:1px solid #2c3a4e;border-radius:10px;background:#05080ed0;font-size:12px;color:#d7e2ee;font-variant-numeric:tabular-nums}
.kokpit-hud b{font-size:16px;color:#fff}.kokpit-hud small{font-size:9px;color:var(--muted)}
.dyno-uyari{position:absolute;z-index:3;left:50%;bottom:118px;transform:translateX(-50%);font-size:12px;font-weight:800;letter-spacing:1px;color:var(--red);text-shadow:0 1px 4px #000;white-space:nowrap}
.dyno-veri-ac[aria-expanded="true"]{border-color:var(--blue);color:#bfefff}
.dyno-veri{position:absolute;z-index:4;right:14px;top:62px;bottom:112px;width:min(400px,44vw);overflow:auto;display:flex;flex-direction:column;gap:10px;padding:10px;border:1px solid var(--line);border-radius:14px;background:#070c16eb;backdrop-filter:blur(6px)}
.dyno-veri[hidden]{display:none}
.dyno-olcumler{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.dyno-kart{border:1px solid var(--line);border-radius:10px;background:#0b1424cc;padding:8px 10px}
.dyno-kart small{display:block;font-size:8px;letter-spacing:1px;color:var(--muted);font-weight:800}
.dyno-kart b{display:block;font-size:18px;margin-top:3px;font-variant-numeric:tabular-nums}.dyno-kart b i{font-style:normal;font-size:10px;color:var(--muted)}
.dyno-kart em{display:block;font-style:normal;font-size:9px;color:#b9c8d9}
.dyno-tablo-kutu,.dyno-egri-kutu{border:1px solid var(--line);border-radius:12px;background:#0a1222cc;padding:10px 12px;min-width:0}
#dyno-tablo{width:100%;border-collapse:collapse;margin-top:6px;font-size:11px;font-variant-numeric:tabular-nums}
#dyno-tablo th{font-size:8px;letter-spacing:.8px;color:var(--muted);text-align:left;padding:4px;border-bottom:1px solid var(--line)}
#dyno-tablo td{padding:4px;border-bottom:1px solid #1a2332}#dyno-tablo tr.aktif td{color:var(--gold);font-weight:800}
.dyno-oran-not{font-size:9px;color:#b9c8d9;margin:6px 0 0}
#dyno-egri{width:100%;height:150px;display:block;margin-top:6px}
.dyno-kontrol{position:absolute;z-index:4;left:0;right:0;bottom:0;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;padding:14px 16px 10px;background:linear-gradient(0deg,#05080ef2 0,#05080ec0 70%,#05080e00 100%)}
.dyno-tus{border-radius:14px;border:1px solid #33435a;background:#111a2ae6;color:#e8f0f8;font-weight:900;letter-spacing:1px;cursor:pointer;touch-action:none;user-select:none;-webkit-user-select:none}
.vites-tus{padding:14px 18px;font-size:12px}.vites-tus[hidden]{display:none}
.gaz-tus{padding:18px 54px;font-size:18px;border-color:#2fa86a;background:linear-gradient(180deg,#14402a,#0c2a1b);color:#9ff0c2}
.gaz-tus.basili{background:linear-gradient(180deg,#1f8a52,#126b3c);color:#fff;box-shadow:0 0 24px #2fd88066}
.dyno-yan{display:flex;gap:8px}.dyno-kucuk{border:1px solid #33435a;background:#0d1524e6;color:#c8d8e8;border-radius:10px;padding:9px 12px;font-size:10px;letter-spacing:.8px;cursor:pointer}
.dyno-ipucu{flex-basis:100%;text-align:center;font-size:9px;color:var(--muted)}
/* DYNO-P3b TEMA düğmesi: aktif tema adı küçük yazı; kokpiti olmayan modelde gizli. */
.dyno-tema[hidden]{display:none}.dyno-tema small{font-size:9px;color:#9fdcff;letter-spacing:.4px}
@container stage (max-width:700px){
  .dyno-ac-btn{top:calc(27% + 52px);padding:10px 14px;font-size:10px}
  .dyno{display:flex;flex-direction:column;height:auto;min-height:100svh;overflow:visible;padding:0 0 150px}
  .dyno-head{position:relative;padding:62px 12px 8px;background:none}
  .dyno-head strong{font-size:17px}
  /* Dikeyde kokpit kutusu ~%68 ekran yüksekliği: cover kırpmasında ekran + bezel + gidon ortası/ayna kolları görünür. */
  .kokpit{position:relative;inset:auto;height:68svh;min-height:300px;flex-shrink:0}
  .kokpit-hud{left:10px;bottom:10px;font-size:11px}.kokpit-hud b{font-size:14px}
  .dyno-uyari{bottom:14px;left:auto;right:10px;transform:none;font-size:10px}
  .dyno-veri{position:static;width:auto;margin:10px 12px 0;overflow:visible;backdrop-filter:none}
  .dyno-olcumler{grid-template-columns:repeat(2,1fr)}
  .dyno-kart{padding:6px 7px}.dyno-kart b{font-size:15px}#dyno-tablo{font-size:10px}
  .dyno-kontrol{position:fixed;left:0;right:0;bottom:0;z-index:8;background:#060a14f2;border-top:1px solid var(--line);padding:10px 10px calc(10px + env(safe-area-inset-bottom));display:grid;grid-template-columns:1fr 1.6fr 1fr;gap:8px}
  .gaz-tus{padding:22px 0;font-size:20px}.vites-tus{padding:22px 0}
  .dyno.cvt .gaz-tus{grid-column:1/-1}
  .dyno-yan{grid-column:1/-1;justify-content:center;flex-wrap:wrap;gap:6px}.dyno-ipucu{display:none}
  .dyno-kucuk{padding:9px 9px;letter-spacing:.5px}
}
/* DYNO-P5 sonuç paneli (dyno-ekran.js sonucKur ile dinamik): hp/tork eğrisi, 0-100 sen/ideal, vites tablosu, veri kaynağı etiketi. */
.dyno-sonuc{position:absolute;z-index:6;left:50%;top:58px;transform:translateX(-50%);width:min(760px,94vw);max-height:calc(100% - 180px);overflow:auto;display:flex;flex-direction:column;gap:9px;padding:12px 14px;border:1px solid var(--blue);border-radius:16px;background:#070c16f2;box-shadow:0 10px 40px #000a;backdrop-filter:blur(6px)}
.dyno-sonuc[hidden]{display:none}
.dyno-sonuc header{display:flex;justify-content:space-between;align-items:center;gap:10px}.dyno-sonuc header strong{font-size:16px;letter-spacing:.5px}
.dyno-sonuc-kaynak{margin:0;font-size:10px;color:#f3cc58;line-height:1.4}
.dyno-sonuc-kartlar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.dyno-sonuc-g100{margin:0;font-size:11px;color:#b9c8d9}
.dyno-sonuc-ipucu{margin:0;padding:7px 10px;border-left:3px solid var(--gold);background:#f3cc5812;font-size:12px;color:#f2e6c0}
#dyno-sonuc-egri{width:100%;height:210px;display:block;margin-top:6px}
#dyno-sonuc-tablo{width:100%;border-collapse:collapse;margin-top:6px;font-size:11px;font-variant-numeric:tabular-nums}
#dyno-sonuc-tablo th{font-size:8px;letter-spacing:.8px;color:var(--muted);text-align:left;padding:4px;border-bottom:1px solid var(--line)}
#dyno-sonuc-tablo td{padding:4px;border-bottom:1px solid #1a2332}
.dyno-ses-kaynak{align-self:center;font-size:10px;color:#9fdcff;text-decoration:underline;letter-spacing:.3px}
@container stage (max-width:700px){
  .dyno-sonuc{position:fixed;left:8px;right:8px;top:56px;bottom:auto;transform:none;width:auto;max-height:calc(100svh - 200px);z-index:9}
  .dyno-sonuc-kartlar{grid-template-columns:repeat(2,minmax(0,1fr))}
  #dyno-sonuc-egri{height:170px}
}
/* DYNO-P6 FREN düğmesi (GAZ'ın solunda; basılı tutulur, gazdan baskın) ve HUD "FREN" uyarısı; sonuç panelinde dyno ↔ yol kıyası. */
.fren-tus{padding:18px 26px;font-size:15px;border-color:#b8433a;background:linear-gradient(180deg,#4a1712,#2c0d0a);color:#ffb3a8}
.fren-tus.basili{background:linear-gradient(180deg,#c8372a,#8e2016);color:#fff;box-shadow:0 0 24px #ff4a3a66}
.dyno-uyari.fren{color:#fff;background:#c8372ae6;padding:3px 10px;border-radius:8px;text-shadow:none}
.dyno-kiyas-kutu[hidden]{display:none}
.dyno-sonuc-satir{margin:4px 0 0;font-size:12px;color:#e8f0f8;font-variant-numeric:tabular-nums}
#dyno-sonuc-azami-dyno{color:#9ff0c2;font-weight:700}#dyno-sonuc-azami-yol{color:#b9c8d9}
#dyno-sonuc-kiyas{width:100%;border-collapse:collapse;margin-top:6px;font-size:11px;font-variant-numeric:tabular-nums}
#dyno-sonuc-kiyas th{font-size:8px;letter-spacing:.8px;color:var(--muted);text-align:left;padding:4px;border-bottom:1px solid var(--line)}
#dyno-sonuc-kiyas td{padding:4px;border-bottom:1px solid #829bc01a}#dyno-sonuc-kiyas td:nth-child(2){color:#9ff0c2}
@container stage (max-width:700px){
  .dyno-kontrol{grid-template-columns:1fr 1.15fr 1.6fr 1fr}
  .fren-tus{padding:22px 0;font-size:16px}
  .dyno.cvt .fren-tus{grid-column:1/2}.dyno.cvt .gaz-tus{grid-column:2/-1}
}
@container stage (max-width:700px){
  /* P6: mobilde sabit kontrol çubuğu kokpitin altını örtüyor → FREN / SINIRLAYICI uyarısı çubuğun üstünde görünsün. */
  .dyno-uyari{bottom:50px}
}
/* KURAL-1 (ISTEK 36/37/49): dyno'da da aynı yerleşim — SOL ALT VİTES ▲▼ (CVT'de gizli), SAĞ ALT GAZ (üst) + FREN (alt),
   orta boş (kokpit görünür); küçük düğmeler sağ üstte. Dokunma hedefi ≥56 px. */
.dyno-kontrol{position:absolute;inset:0;z-index:4;display:block;padding:0;background:none;pointer-events:none}
.dyno-sol,.dyno-sag{position:absolute;bottom:calc(14px + env(safe-area-inset-bottom));display:flex;flex-direction:column-reverse;gap:10px;pointer-events:auto}
.dyno-sol{left:calc(14px + env(safe-area-inset-left))}.dyno-sag{right:calc(14px + env(safe-area-inset-right))}
.dyno-kontrol .dyno-tus{min-width:72px;min-height:56px;padding:8px 14px}
.dyno-kontrol .gaz-tus{min-width:104px;min-height:96px;padding:0 18px;font-size:18px}.dyno-kontrol .fren-tus{min-width:104px;min-height:56px;padding:0 18px}
.dyno-kontrol .vites-tus{min-height:64px;font-size:13px}
.dyno-kontrol .dyno-yan{position:absolute;top:58px;right:12px;flex-wrap:wrap;justify-content:flex-end;max-width:46%;pointer-events:auto}
.dyno-kontrol .dyno-ipucu{position:absolute;left:50%;bottom:6px;transform:translateX(-50%);width:auto;white-space:nowrap}
.dyno.cvt .dyno-sol{display:none}
@container stage (max-width:700px){
  .dyno-kontrol{position:fixed;inset:auto 0 0 0;height:calc(176px + env(safe-area-inset-bottom));display:block;background:#060a14f2;border-top:1px solid var(--line);padding:0;z-index:8}
  /* Portre: küçük düğmeler iki köşe arasındaki orta sütunda (köşeler GAZ/FREN ve VİTES'e ayrılır). */
  .dyno-kontrol .dyno-yan{top:10px;bottom:10px;left:122px;right:122px;max-width:none;justify-content:center;align-content:center;gap:5px}
  .dyno-kontrol .dyno-yan .dyno-kucuk{padding:7px 7px;font-size:9px}
  .dyno.cvt .dyno-kontrol .dyno-yan{left:10px}
  .dyno-sol,.dyno-sag{bottom:calc(10px + env(safe-area-inset-bottom));gap:8px}
  .dyno-kontrol .gaz-tus{min-height:72px;padding:0 22px;font-size:18px}.dyno-kontrol .fren-tus{min-height:56px;padding:0 22px}
  .dyno-kontrol .vites-tus{min-height:60px;padding:0 18px}
  .dyno{padding-bottom:190px}
}
@media (orientation:landscape) and (max-height:500px){
  .dyno-head{padding:8px 150px 10px 150px}.dyno-head strong{font-size:15px}.dyno-not{display:none}
  .dyno-kontrol .dyno-yan{top:8px;right:118px}.dyno-kontrol .dyno-ipucu{display:none}
  .kokpit-hud{left:50%;transform:translateX(-50%);bottom:10px}
}
/* KOKPIT-4 oda plakası (dyno-ekran.js odaCiz; #dyno-kokpit'in ilk çocuğu → kokpit, el ve TFT'nin arkasında; kamera titreşimi yok). */
.kokpit-oda{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.kokpit-oda[hidden]{display:none}