/* Atölye tek ekran düzeni (D169) — Python Defteri, YZ Laboratuvarı, Devre Tezgâhı, Oyun Stüdyosu.
   Sahip: "atölyeleri ve elementlerini tek sayfaya sığdır, scroll'dan kaçın; akıllı tahtada öğrencilerle oynanacak".
   Yalnız <body class="... at-tek"> sayfalarda etkilidir. Geniş ekranda (≥ 1000 × 600) sayfa kaymaz: body pencere
   yüksekliğinde bir sütundur, üstte site menüsü, altında tek satırlık atölye çubuğu (geri + ad + araçlar + bilgi),
   kalan alan atölyenin çalışma alanıdır; uzun listeler kendi kutusunun içinde kayar. Alt bilgi geniş ekranda gizli
   (atölye bir araç ekranı; alt bilgi bağlantıları Atölye sayfasında). Dar ekranda sayfa normal akar.
   :not(#_) — ada-cam.css'in uzun seçicilerini yenmek için (agentblocks-tek.css ile aynı yöntem). */

/* ---------- Atölye çubuğu: geri + ad + (sayfanın araçları) + bilgi ---------- */
.at-cubuk { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; min-width: 0; }
body.at-tek:not(#_) :is(.at-cubuk > h1, .at-cubuk__ad) { margin: 0; font-size: 1.3rem; line-height: 1.1; white-space: nowrap; }
.at-cubuk__ara { flex: 1 1 auto; }
body.at-tek:not(#_) .at-geri {
  display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px 0 10px; border-radius: 999px;
  font-weight: 800; font-size: var(--v2-text-sm); text-decoration: none; white-space: nowrap;
}
body.at-tek:not(#_) .at-geri .v2-icon { width: 18px; height: 18px; }

/* Bilgi kutucuğu: (i) düğmesi; açılınca çubuğun altında yüzen kart. Gerekli ama yer kaplayan açıklamalar burada. */
.at-bilgi { position: relative; }
.at-bilgi > summary {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 40px; min-height: 40px; padding: 0 12px;
  border: 1px solid var(--ac-kenar, var(--v2-line)); border-radius: 999px; background: rgba(255,255,255,.78); color: var(--ac-metin, var(--v2-ink));
  font-weight: 800; font-size: var(--v2-text-sm); cursor: pointer; list-style: none; user-select: none;
}
.at-bilgi > summary::-webkit-details-marker { display: none; }
.at-bilgi > summary .v2-icon { width: 20px; height: 20px; }
.at-bilgi > summary:focus-visible { outline: 3px solid var(--v2-blue-ink); outline-offset: 2px; }
.at-bilgi[open] > summary { background: #FFFFFF; box-shadow: 0 0 0 2px rgba(91,72,255,.35); }
.at-bilgi__kart {
  position: absolute; z-index: 90; top: calc(100% + 8px); right: 0; width: min(30rem, calc(100vw - 32px)); max-height: min(70vh, 36rem); overflow: auto;
  display: grid; gap: 10px; padding: 16px 18px; border: 1px solid var(--ac-kenar, var(--v2-line)); border-radius: 18px;
  background: rgba(255,255,255,.97); color: var(--ac-metin, var(--v2-ink)); font-size: var(--v2-text-sm); line-height: 1.5;
  box-shadow: 0 18px 40px -16px rgba(40,30,110,.45);
}
.at-bilgi--sol .at-bilgi__kart { right: auto; left: 0; }
.at-bilgi__kart :is(h2, h3) { margin: 4px 0 0; font-size: var(--v2-text-md); }
.at-bilgi__kart p, .at-bilgi__kart ul, .at-bilgi__kart ol { margin: 0; }
.at-bilgi__kart ul, .at-bilgi__kart ol { padding-left: 1.2em; display: grid; gap: 4px; }
.at-bilgi__kart code { font-family: var(--v2-font-mono); font-weight: 700; }
.at-bilgi__guven { display: flex; gap: 8px; align-items: flex-start; color: var(--ac-metin-2, var(--v2-ink-2)); }
.at-bilgi__guven .v2-icon { flex: none; width: 20px; height: 20px; color: #0B6E66; }
@media (max-width: 700px) { .at-bilgi { position: static; } .at-bilgi__kart { left: 16px; right: 16px; width: auto; } }

/* ---------- Dar ekran (telefon/tablet dikey): sayfa akar, kenar boşluğu main'de ---------- */
@media (max-width: 999.98px), (max-height: 599.98px) {
  body.at-tek:not(#_) > main { padding: 10px 16px 24px; display: grid; gap: 12px; }
  body.at-tek:not(#_) > main .v2-container { max-width: none; padding-inline: 0; }
}

/* ---------- Geniş ekran: tek ekran ---------- */
@media (min-width: 1000px) and (min-height: 600px) {
  /* Kök kaymaz: tema süsü html::after 60 px aşağı taşar (canli-ada) — ölçüde scrollHeight değil main'in altı esas alınır */
  html:has(> body.at-tek) { overflow: hidden; }
  body.at-tek:not(#_) { display: flex; flex-direction: column; height: 100dvh; min-height: 0; overflow: hidden; }
  body.at-tek:not(#_) > .v2-topbar { flex: none; }
  body.at-tek:not(#_) > :is(.v2-sitefoot, .v2-bottomnav) { display: none; }
  body.at-tek:not(#_) > main {
    flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; gap: 10px; padding: 10px 16px 12px; box-sizing: border-box; overflow: hidden;
    --v2-tap: 42px; --v2-tap-min: 40px;
  }
  body.at-tek:not(#_) > main > .at-cubuk { flex: none; }
  /* Sayfanın kendi kapsayıcıları tam genişlik (kenar boşluğu main'de) */
  body.at-tek:not(#_) > main .v2-container { max-width: none; width: auto; margin: 0; padding-inline: 0; }
  /* Kompakt düğmeler: akıllı tahtada hâlâ rahat (≥ 40 px), satıra sığar */
  body.at-tek:not(#_) > main .v2-btn { min-height: 40px; padding-inline: 14px; font-size: var(--v2-text-sm); gap: 6px; }
  body.at-tek:not(#_) > main .v2-btn .v2-icon { width: 18px; height: 18px; }
  body.at-tek:not(#_) > main .v2-btn--square { width: 40px; padding: 0; }
  /* Çalışma alanı: kalan yüksekliğin tamamı */
  body.at-tek:not(#_) .at-alan { flex: 1 1 auto; min-height: 0; }
  /* Erişilebilirlik düğmesi alt köşede küçük kalsın */
  body.at-tek:not(#_) .a11y-fab { bottom: 14px !important; }
}