/* Piksir Okul paneli — sayfaya özgü stiller (katmansız → v2 katmanlarının üstünde).
   Ortak parçalar: shared/styles/v2/panel.css. Tasarım dili: docs/TASARIM_SISTEMI.md ("Kareli Defter"). */

body.okul { background: var(--v2-paper); }
.okul-ic-sm { width: 18px; height: 18px; }

/* ---------------------------------------------------------------- Giriş ekranı */
.okul-login { min-height: 100vh; display: grid; align-content: start; justify-items: center; padding: 24px var(--v2-gutter) 48px; }
@media (min-width: 640px) { .okul-login { align-content: center; padding-top: 48px; } }
.okul-auth { width: min(560px, 100%); display: grid; gap: var(--v2-space-4); }
.okul-auth__brand { display: flex; align-items: center; gap: 12px; text-decoration: none; color: var(--v2-ink); }
.okul-auth__brand svg { width: 56px; height: 56px; flex: none; }
.okul-auth__brand h1 { font-size: clamp(1.9rem, 1.5rem + 2vw, 2.6rem); }
.okul-auth__brand small { display: block; font-family: var(--v2-font-body); font-weight: 700; font-size: var(--v2-text-sm); color: var(--v2-ink-2); letter-spacing: 0; }
.okul-auth .v2-card { padding: 20px; }
@media (min-width: 640px) { .okul-auth .v2-card { padding: 28px; } }
.okul-auth__legal { text-align: center; font-size: var(--v2-text-sm); color: var(--v2-ink-2); }
/* D61/U135: hesapsız ziyaretçinin yolu (giris/ kapısının misafir bölümü) */
.okul-guest { text-align: center; font-weight: 700; margin: 0; }
.okul-guest a { display: inline-flex; align-items: center; min-height: 48px; padding-inline: 4px; text-underline-offset: 3px; }
/* Üç sekme (Öğrenci · Öğretmen-Müdür · Veli) dar ekranda yatay kaydırmaya düşmesin: ikonlar gizlenir */
@media (max-width: 479.98px) {
  .okul-tabs > button { padding: 0 10px; gap: 6px; }
  .okul-tabs > button .v2-icon { display: none; }
}
/* D61: oturum yokken ortak site kabuğu görünür (okul.js siteChrome); giriş alanı üst menünün altında kalır */
body.okul--site .okul-login { min-height: 0; }
@media (min-width: 640px) { body.okul--site .okul-login { min-height: calc(100vh - 69px); } }
.okul-noscript { padding: 16px; }

/* Öğrenci adımları: gerçek bir sıra (kod → ad → PIN), bu yüzden numaralı */
.okul-steps { display: flex; gap: 6px; margin: 0 0 var(--v2-space-4); padding: 0; list-style: none; counter-reset: st; }
.okul-steps li { flex: 1; display: flex; align-items: center; gap: 8px; font-size: var(--v2-text-xs); font-weight: var(--v2-weight-heavy); color: var(--v2-ink-2); counter-increment: st; }
.okul-steps li::before { content: counter(st); width: 26px; height: 26px; flex: none; display: grid; place-items: center; border-radius: 8px; border: var(--v2-stroke-soft) solid var(--v2-ink-3); font-family: var(--v2-font-mono); background: var(--v2-surface); }
.okul-steps li[aria-current="step"] { color: var(--v2-ink); }
.okul-steps li[aria-current="step"]::before { background: var(--v2-yellow); border-color: var(--v2-ink); }
.okul-steps li.is-done::before { background: var(--v2-green-tint); border-color: var(--v2-ink); color: var(--v2-green-ink); }

.okul-code-input { font-family: var(--v2-font-mono); font-weight: 700; font-size: clamp(1.8rem, 1.4rem + 2vw, 2.4rem); letter-spacing: .32em; text-align: center; text-transform: uppercase; min-height: 76px; padding-left: .32em; }
.okul-classline { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.okul-classline b { display: block; font-size: var(--v2-text-lg); }
.okul-classline span { font-size: var(--v2-text-sm); color: var(--v2-ink-2); }

.okul-kids { display: grid; grid-template-columns: repeat(auto-fill, minmax(124px, 1fr)); gap: 12px; max-height: 56vh; overflow: auto; padding: 4px 4px 10px; margin: 0; list-style: none; }
.okul-kid {
  width: 100%; min-height: 136px; display: grid; justify-items: center; align-content: center; gap: 8px; padding: 12px 8px;
  border: var(--v2-stroke) solid var(--v2-ink); border-radius: var(--v2-radius); background: var(--v2-surface); color: var(--v2-ink);
  font-weight: var(--v2-weight-heavy); font-size: 1.0625rem; line-height: 1.2; text-align: center; overflow-wrap: anywhere;
  box-shadow: 0 var(--v2-offset) 0 var(--v2-shadow-color);
  transition: transform var(--v2-dur-fast) var(--v2-ease), box-shadow var(--v2-dur-fast) var(--v2-ease);
}
.okul-kid:hover { background: var(--v2-yellow-tint); }
.okul-kid:active { transform: translateY(var(--v2-offset)); box-shadow: none; }
.okul-kid svg { width: 64px; height: 64px; }
.okul-whoami { display: flex; align-items: center; justify-content: center; gap: 12px; }
.okul-whoami svg { width: 56px; height: 56px; }
.okul-whoami b { font-family: var(--v2-font-display); font-size: 1.6rem; }
.okul-pinmsg { text-align: center; min-height: 1.5em; }
.okul-avpick { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.okul-avpick button { aspect-ratio: 1; min-height: 48px; padding: 4px; border: var(--v2-stroke-soft) solid var(--v2-line); border-radius: 14px; background: var(--v2-surface); display: grid; place-items: center; }
.okul-avpick button[aria-pressed="true"] { border: var(--v2-stroke) solid var(--v2-ink); background: var(--v2-yellow); box-shadow: 0 3px 0 var(--v2-shadow-color); }
.okul-avpick svg { width: 100%; height: 100%; max-width: 48px; }
.okul-av { width: 32px; height: 32px; flex: none; display: inline-block; vertical-align: middle; }
.okul-namecell { display: inline-flex; align-items: center; gap: 10px; }
.v2-pinpad button:disabled { opacity: .45; cursor: not-allowed; }
details > summary::-webkit-details-marker { display: none; }
details > summary { list-style: none; }
.okul-dev { border-top: var(--v2-stroke-soft) dashed var(--v2-line); padding-top: var(--v2-space-4); display: grid; gap: 8px; }

/* ---------------------------------------------------------------- Üst bar */
.okul-topbar .v2-brand { font-size: 1.3rem; }
.okul-topbar .v2-brand svg { width: 40px; height: 40px; }
.okul-topbar .v2-brand small { font-family: var(--v2-font-body); font-weight: 800; font-size: var(--v2-text-xs); color: var(--v2-ink-2); display: block; margin-top: 2px; }
.okul-topbar .v2-topbar__end .v2-btn { padding-inline: 12px; }
/* F4.5 (1.4.10): 320px'de rol etiketi + iki düğme marka ile tek satıra sığmaz → satır kırılır, yatay kaydırma olmaz */
@media (max-width: 399.98px) { .okul-topbar .v2-topbar__in { flex-wrap: wrap; row-gap: 4px; padding-block: 6px; } }
@media (max-width: 479.98px) { .okul-topbar .v2-btn__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); } .okul-topbar .v2-brand > span > span { display: none; } }

/* ---------------------------------------------------------------- İMZA: sınıf defter sekmesi
   Sol kenarda sınıf bandı rengi (1–2 sarı, 3–4 yeşil, 5–6 mavi, 7–8 domates). Düzeyi girilmemiş sınıfta
   bant çizgili domates olur ve uyarı kartın İÇİNDE, tek tıkla düzeltilecek biçimde durur (F1.2b). */
.okul-classes { display: grid; gap: var(--v2-space-4); grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); margin: 0; padding: 0; list-style: none; }
.okul-class {
  position: relative; display: grid; gap: 14px; align-content: start; padding: 18px 18px 18px 34px;
  background: var(--v2-surface); border: var(--v2-stroke) solid var(--v2-ink); border-radius: var(--v2-radius-lg);
  box-shadow: 0 var(--v2-offset) 0 var(--v2-shadow-color); overflow: hidden;
}
.okul-class::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 18px; background: var(--band, var(--v2-sunken)); border-right: var(--v2-stroke) solid var(--v2-ink); }
.okul-class.is-nograde::before { background: repeating-linear-gradient(135deg, var(--v2-tomato) 0 6px, var(--v2-tomato-tint) 6px 12px); }
.okul-class__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.okul-class__name { font-family: var(--v2-font-display); font-size: 1.6rem; line-height: 1.1; overflow-wrap: anywhere; }
.okul-class__grade { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; font-size: var(--v2-text-sm); font-weight: var(--v2-weight-heavy); color: var(--band-ink, var(--v2-ink-2)); }
.okul-class__facts { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: var(--v2-text-sm); color: var(--v2-ink-2); }
.okul-class__facts b { color: var(--v2-ink); font-family: var(--v2-font-mono); }
.okul-class__menu { display: flex; flex-wrap: wrap; gap: 8px; }
.okul-class__menu .v2-btn { flex: 1 1 auto; }
.okul-gradefix { display: grid; gap: 10px; padding: 12px 14px; border: var(--v2-stroke-soft) solid var(--v2-tomato-ink); border-radius: var(--v2-radius); background: var(--v2-tomato-tint); }
.okul-gradefix p { font-size: var(--v2-text-sm); }
.okul-gradefix b { color: var(--v2-tomato-ink); }
.okul-gradefix.is-soft { border-color: var(--v2-yellow-ink); background: var(--v2-yellow-tint); }
.okul-gradefix.is-soft b { color: var(--v2-yellow-ink); }
.okul-gradefix__row { display: flex; gap: 8px; flex-wrap: wrap; }
.okul-gradefix__row .v2-input { flex: 1 1 140px; min-height: var(--v2-tap-min); }

/* Sınıf kodu: altı ayrı tuş kapağı (öğrencinin yazacağı şey tam olarak bu) */
.okul-code { display: inline-flex; gap: 4px; }
.okul-code > span {
  width: 30px; height: 38px; display: grid; place-items: center;
  border: var(--v2-stroke-soft) solid var(--v2-ink); border-radius: 8px; background: var(--v2-paper);
  font-family: var(--v2-font-mono); font-weight: 700; font-size: 1.1rem; box-shadow: 0 2px 0 var(--v2-shadow-color);
}
.okul-code--lg > span { width: 42px; height: 54px; font-size: 1.6rem; border-radius: 10px; }
.okul-pinbig { font-family: var(--v2-font-mono); font-weight: 700; font-size: 1.35rem; letter-spacing: .12em; }

/* ---------------------------------------------------------------- Güvenlik kuyruğu (yetişkine yönelik, sade) */
.okul-alerts { display: grid; gap: var(--v2-space-4); margin: 0; padding: 0; list-style: none; }
.okul-alert { display: grid; gap: 12px; padding: 18px; background: var(--v2-surface); border: var(--v2-stroke) solid var(--v2-ink); border-radius: var(--v2-radius-lg); border-left-width: 10px; }
.okul-alert.is-acik { border-left-color: var(--v2-tomato); }
.okul-alert.is-inceleniyor { border-left-color: var(--v2-yellow); }
.okul-alert.is-kapandi { border-left-color: var(--v2-line); background: var(--v2-paper); }
.okul-alert__top { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; justify-content: space-between; }
.okul-alert__title { font-size: var(--v2-text-lg); font-weight: var(--v2-weight-heavy); }
.okul-alert__meta { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: var(--v2-text-sm); color: var(--v2-ink-2); }
.okul-alert__meta b { color: var(--v2-ink); }
.okul-alert[tabindex="-1"]:focus { outline: 3px solid var(--v2-focus); outline-offset: 3px; }
.okul-alert__quote { margin: 0; padding: 10px 14px; border-left: 4px solid var(--v2-ink); background: var(--v2-sunken); border-radius: 0 10px 10px 0; font-size: var(--v2-text-sm); white-space: pre-wrap; overflow-wrap: anywhere; }
.okul-alert__quote small { display: block; color: var(--v2-ink-2); font-size: var(--v2-text-xs); margin-bottom: 4px; }
/* D36: 1–4. sınıf cihazda algılanan, metinsiz sinyal notu */
.okul-alert__device { margin: 0; display: flex; gap: 8px; align-items: flex-start; padding: 10px 14px; border-left: 4px solid var(--v2-ink); background: var(--v2-sunken); border-radius: 0 10px 10px 0; font-size: var(--v2-text-sm); }
.okul-alert__device .v2-icon { flex: 0 0 auto; margin-top: 2px; }
.okul-alert details summary { cursor: pointer; font-weight: var(--v2-weight-heavy); min-height: 48px; display: flex; align-items: center; }
.okul-sev { font-family: var(--v2-font-mono); font-size: var(--v2-text-xs); font-weight: 700; padding: 2px 8px; border-radius: 6px; border: 1.5px solid var(--v2-ink); }
.okul-now { padding: 14px 16px; border: var(--v2-stroke) solid var(--v2-tomato-ink); border-radius: var(--v2-radius); background: var(--v2-tomato-tint); display: grid; gap: 8px; }
.okul-now h4 { display: flex; align-items: center; gap: 8px; font-size: var(--v2-text-md); color: var(--v2-tomato-ink); }
.okul-now ol { margin: 0; padding-left: 1.3em; display: grid; gap: 4px; font-size: var(--v2-text-sm); }
.okul-now a[href^="tel:"] { color: var(--v2-tomato-ink); font-weight: 800; }
.okul-filter { display: flex; flex-wrap: wrap; gap: 8px; }

/* ---------------------------------------------------------------- Öğrenci paneli */
.okul-hello { display: grid; grid-template-columns: auto 1fr; gap: 16px; align-items: center; }
.okul-hello svg.okul-hello__spark { width: 72px; height: 72px; }
.okul-hello h2 { font-size: var(--v2-text-2xl); }
.okul-assign { display: grid; gap: var(--v2-space-4); grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); margin: 0; padding: 0; list-style: none; }
.okul-assign .v2-game { padding-top: 22px; }
.okul-assign .v2-game__flag { top: -14px; left: 14px; right: auto; }
[data-density="minik"] .okul-assign { grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); }
[data-density="minik"] .okul-assign .v2-game__flag { left: 50%; transform: translateX(-50%); }
[data-density="minik"] .okul-hello h2 { font-size: 2rem; }
[data-density="genc"] .okul-assign { grid-template-columns: 1fr; }
.okul-done a { text-decoration: none; }
.okul-done { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }

/* ---------------------------------------------------------------- Yazdırma: A4'e 8 giriş kartı */
#printArea { display: none; }
@page { size: A4; margin: 10mm; }
@media print {
  body { background: #fff !important; color: #000 !important; }
  .okul > .v2-topbar, .okul > .v2-sitefoot, .okul > .v2-bottomnav, .okul > .v2-skip { display: none !important; }
  body.printing > *:not(#printArea) { display: none !important; }
  body.printing #printArea { display: block; }
  .pc-page { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: repeat(4, 1fr); gap: 4mm; height: 276mm; break-after: page; page-break-after: always; }
  .pc-page:last-child { break-after: auto; page-break-after: auto; }
  .pc { border: 1.5px dashed #444; border-radius: 4mm; padding: 4mm 5mm; display: flex; gap: 4mm; align-items: center; break-inside: avoid; color: #000; overflow: hidden; font-family: "Atkinson Hyperlegible Next", system-ui, sans-serif; }
  .pc svg { width: 24mm; height: 24mm; flex: none; }
  .pc-sch { font-size: 8.5pt; color: #333; }
  .pc-name { font-size: 14pt; font-weight: 800; margin: 1mm 0 2mm; line-height: 1.15; }
  .pc-row { font-size: 11pt; margin: .6mm 0; }
  .pc-row b { font-family: "Atkinson Hyperlegible Mono", Consolas, monospace; font-size: 15pt; letter-spacing: .12em; }
  .pc-url { font-size: 7.5pt; color: #333; margin-top: 1.5mm; }
  /* F2.2/U6 resimli şifre (1–2. sınıf): rakamın altında 4 resim + adı; PIN'siz kartta 4 boş kutu + 0–9 anahtarı */
  .pc--pic { align-items: flex-start; padding: 3mm 4mm; }
  .pc--pic > svg { width: 16mm; height: 16mm; }
  .pc--pic .pc-name { font-size: 12pt; margin: .5mm 0 1mm; }
  .pc--pic .pc-row { font-size: 10pt; margin: .3mm 0; }
  .pc--pic .pc-row b { font-size: 13pt; }
  .pc .pc-pics { display: flex; gap: 2mm; margin: 1.2mm 0 .5mm; }
  .pc .pc-pic { display: grid; justify-items: center; width: 14mm; min-height: 11mm; border: 1.2px solid #444; border-radius: 2mm; padding: .6mm .4mm; position: relative; }
  .pc .pc-pics--blank .pc-pic { height: 11mm; border-style: dashed; }
  .pc .pc-pic svg { width: 8.5mm; height: 8.5mm; }
  .pc .pc-pic b { font-size: 6.5pt; font-weight: 800; line-height: 1.1; }
  .pc .pc-pic i { position: absolute; top: .2mm; right: .8mm; font-style: normal; font-size: 6pt; color: #333; }
  .pc .pc-key { display: flex; gap: .7mm; margin-top: 1mm; }
  .pc .pc-key span { display: grid; justify-items: center; width: 5.6mm; }
  .pc .pc-key svg { width: 5.2mm; height: 5.2mm; }
  .pc .pc-key i { font-style: normal; font-size: 6pt; font-weight: 800; line-height: 1; }
  .pc--pic .pc-url { margin-top: 1mm; }
  /* F2.3: sınıf QR'ı avatarın altında (sol sütun) — yazı alanı ve 1–2. sınıf resim satırları daralmaz */
  .pc .pc-side { display: grid; justify-items: center; gap: 2mm; flex: none; }
  .pc .pc-qr svg { width: 22mm; height: 22mm; }
  .pc--pic .pc-side > svg { width: 16mm; height: 16mm; }
  .pc--pic .pc-qr svg { width: 16mm; height: 16mm; } /* avatarla aynı genişlik: metin sütunu eskisiyle birebir */
}

/* Giriş türü sekmeleri: dar ekranda iki eşit sütun, metin kaydırmaz, sarar */
.okul-auth .v2-seg > button { flex: 1 1 0; white-space: normal; line-height: 1.15; padding: 6px 10px; text-align: left; }
.okul-auth .v2-seg > button .v2-icon { flex: none; }

/* ---------------------------------------------------------------- F8.2 Kazanım ustalığı (ısı haritası, telafi, bahçe)
   Seviye üç yolla ayrılır (WCAG 1.4.1): renk + desen + harf (– B G Y U). Öğretmen işareti: sağ üst köşe üçgeni + metin. */
.okul-cell {
  --_pat: none; position: relative; display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0;
  border: 1.5px solid var(--v2-ink); border-radius: 10px; background-color: var(--v2-surface); background-image: var(--_pat);
  color: var(--v2-ink); font-family: var(--v2-font-mono); font-weight: 800; font-size: 1rem; line-height: 1; cursor: default;
}
button.okul-cell { cursor: pointer; }
button.okul-cell:hover { outline: 2px solid var(--v2-ink); outline-offset: 1px; }
.okul-cell--0 { border-style: dashed; border-color: var(--v2-ink-3); color: var(--v2-ink-2); font-weight: 700; }
.okul-cell--1 { background-color: var(--v2-tomato-tint); --_pat: radial-gradient(circle, rgba(180, 46, 19, .38) 1.3px, transparent 1.7px); background-size: 7px 7px; color: var(--v2-tomato-ink); }
.okul-cell--2 { background-color: var(--v2-yellow-tint); --_pat: repeating-linear-gradient(45deg, rgba(122, 86, 0, .24) 0 2px, transparent 2px 7px); color: var(--v2-yellow-ink); }
.okul-cell--3 { background-color: var(--v2-green-tint); --_pat: repeating-linear-gradient(0deg, rgba(12, 110, 62, .24) 0 2px, transparent 2px 6px); color: var(--v2-green-ink); }
.okul-cell--4 { background-color: var(--v2-green-ink); color: #fff; }
.okul-cell.is-elle::after { content: ""; position: absolute; top: -1.5px; right: -1.5px; width: 0; height: 0; border-top: 14px solid var(--v2-yellow); border-left: 14px solid transparent; border-top-right-radius: 9px; }
.okul-cell.is-elle::before { content: ""; position: absolute; top: 2px; right: 2px; width: 4px; height: 4px; border-radius: 50%; background: var(--v2-ink); z-index: 1; }
.okul-legend { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 0 0 var(--v2-space-3); padding: 0; list-style: none; font-size: var(--v2-text-sm); color: var(--v2-ink-2); }
.okul-legend li, .okul-cellinfo, .okul-mtable__n { display: inline-flex; align-items: center; gap: 8px; }
.okul-legend .okul-cell, .okul-cellinfo .okul-cell, .okul-mtable__n .okul-cell, .okul-telafi__lvl .okul-cell { width: 28px; height: 28px; font-size: .8rem; border-radius: 7px; }
.okul-heat__head { flex-wrap: wrap; gap: 10px; }
.okul-heat-wrap { overflow: auto; max-height: 70vh; border: var(--v2-stroke-soft) solid var(--v2-line); border-radius: var(--v2-radius-sm); background: var(--v2-surface); }
.okul-heat-wrap:focus-visible { outline: 3px solid var(--v2-focus); outline-offset: 2px; }
.okul-heat { border-collapse: separate; border-spacing: 3px; margin: 0; }
.okul-heat td { padding: 0; text-align: center; }
.okul-heat thead th { position: sticky; top: 0; z-index: 2; background: var(--v2-surface); vertical-align: bottom; padding: 6px 0; }
.okul-heat__corner { left: 0; z-index: 3 !important; text-align: left; padding-left: 8px !important; font-size: var(--v2-text-sm); }
.okul-heat__st span { display: inline-block; writing-mode: vertical-rl; transform: rotate(180deg); max-height: 110px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--v2-text-sm); font-weight: 700; }
.okul-heat__sumh { font-size: var(--v2-text-xs); padding: 0 6px !important; }
.okul-heat__kz { position: sticky; left: 0; z-index: 1; background: var(--v2-surface); text-align: left; min-width: 150px; max-width: 200px; padding: 2px 8px 2px 8px; font-weight: 400; }
.okul-heat__kz b { display: block; font-size: var(--v2-text-sm); line-height: 1.2; }
.okul-heat__kz small { font-family: var(--v2-font-mono); font-size: var(--v2-text-xs); color: var(--v2-ink-2); }
.okul-heat__sum { font-family: var(--v2-font-mono); font-size: var(--v2-text-sm); color: var(--v2-ink-2); padding: 0 6px !important; white-space: nowrap; }
@media (max-width: 600px) { .okul-heat__kz { min-width: 112px; max-width: 132px; } .okul-heat .okul-cell { width: 40px; height: 40px; } }
.okul-mtable .num { white-space: nowrap; }
/* Telafi kartı */
.okul-telafi__list { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--v2-space-3); }
.okul-telafi__item { border-top: 1.5px dashed var(--v2-line); padding-top: var(--v2-space-3); display: grid; gap: 8px; }
.okul-telafi__item:first-child { border-top: 0; padding-top: 0; }
.okul-telafi__top { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; flex-wrap: wrap; }
.okul-telafi__metin { font-size: var(--v2-text-sm); margin-top: 2px; }
.okul-telafi__lvl { display: inline-flex; align-items: center; gap: 8px; font-size: var(--v2-text-sm); font-weight: 700; }
.okul-telafi__why { display: flex; gap: 8px; align-items: flex-start; font-size: var(--v2-text-sm); }
.okul-telafi__acts { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.okul-telafi__acts > li.v2-row { background: var(--v2-sunken); border-radius: var(--v2-radius-sm); padding: 8px 10px; flex-wrap: nowrap; }
.okul-telafi__acts > li.v2-row > span { min-width: 0; }
.okul-telafi__acts .v2-btn, .okul-telafi__acts .v2-status { flex: none; }
.okul-telafi__ex summary { cursor: pointer; font-weight: 700; font-size: var(--v2-text-sm); min-height: 48px; display: flex; align-items: center; }
.okul-telafi__ex ul { list-style: disc; padding-left: 1.2em; font-size: var(--v2-text-sm); color: var(--v2-ink-2); display: grid; gap: 4px; }
.okul-telafi__sub { margin: var(--v2-space-3) 0 var(--v2-space-2); font-size: var(--v2-text-md); }
/* Bitkiler (öğrenci + veli) */
.okul-plant { width: 34px; height: 34px; flex: none; color: var(--v2-green-ink); }
.okul-plant--0 { color: var(--v2-ink-2); }
.okul-plant--3 .okul-plant__crown, .okul-plant--4 .okul-plant__crown { fill: var(--v2-green-tint); }
.okul-garden { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 170px), 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.okul-garden__item { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: var(--v2-stroke-soft) solid var(--v2-line); border-radius: var(--v2-radius); background: var(--v2-surface); }
.okul-garden__item--4 { border-color: var(--v2-green-ink); background: var(--v2-green-tint); }
.okul-garden__item b { display: block; line-height: 1.2; }
.okul-garden__item small { font-size: var(--v2-text-sm); color: var(--v2-ink-2); font-weight: 700; }
[data-density="minik"] .okul-garden { grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); }
[data-density="minik"] .okul-plant { width: 48px; height: 48px; }
.okul-kidgarden { border-top: 1.5px dashed var(--v2-line); padding-top: var(--v2-space-3); margin-bottom: var(--v2-space-4); display: grid; gap: 6px; }
.okul-kidgarden h4 { font-size: var(--v2-text-md); }
.okul-kidgarden__row { display: flex; gap: 8px; align-items: flex-start; font-size: var(--v2-text-sm); }
.okul-kidgarden__row .okul-plant { width: 26px; height: 26px; }
/* Müdür: dağılım çubuğu */
.okul-dist { display: flex; min-width: 120px; height: 16px; border: 1.5px solid var(--v2-ink); border-radius: 6px; overflow: hidden; }
.okul-dist__seg.okul-cell--1, .okul-dist__seg.okul-cell--2, .okul-dist__seg.okul-cell--3, .okul-dist__seg.okul-cell--4 { display: block; width: auto; height: auto; border: 0; border-radius: 0; background-image: var(--_pat); }
@media (prefers-reduced-motion: reduce) { button.okul-cell:hover { outline-offset: 0; } }

/* F4.5 (3.3.8 / 3.2.6): PIN ekranında sabit yardım satırı */
.okul-pinhelp { text-align: center; max-width: 34ch; margin: var(--v2-space-4) auto 0; }
/* F2.2/U6 resimli şifre: kip değiştirme bağlantısı + alt yönerge (ızgara stili SB.picturePin içinde) */
.okul-pinswitch { display: flex; justify-content: center; margin-top: var(--v2-space-2); }
.okul-pichint { text-align: center; font-weight: 700; margin: 0 0 var(--v2-space-2); }

/* U13: alt bilgi bağlantısı ≥ 48px dokunma hedefi (WCAG 2.5.8 + D30 büyük dokunma hedefleri) */
.okul .v2-panel__foot { margin: 0; }
.okul .v2-panel__foot a { display: inline-flex; align-items: center; min-height: 48px; min-width: 48px; padding-inline: var(--v2-space-2, 8px); text-underline-offset: 3px; }

/* F2.3: giriş kartı penceresinde sınıf QR'ı (ekranda; tahtaya yansıtılabilir) */
.okul-qrbox { display: grid; gap: 6px; justify-items: start; max-width: 220px; }
.okul-qrbox svg { width: 160px; height: 160px; border: 1.5px solid var(--v2-line); border-radius: var(--v2-radius-sm); }
.okul-qrbox[hidden] { display: none; }

/* F8.4 Öğretmen Yardımcısı: öneri kartları (gerekçe her zaman görünür) */
.okul-hints { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--v2-space-3); }
.okul-hint { border: var(--v2-stroke-soft) solid var(--v2-line); border-left-width: 5px; border-radius: var(--v2-radius-sm); padding: 10px 12px; display: grid; gap: 6px; background: var(--v2-surface); }
.okul-hint--takilmis, .okul-hint--ortak_takilma { border-left-color: var(--v2-tomato-ink); }
.okul-hint--oynanmamis { border-left-color: var(--v2-yellow-ink); }
.okul-hint--hazir { border-left-color: var(--v2-green-ink); }
.okul-hint__top { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.okul-hint__top b { font-size: var(--v2-text-md); line-height: 1.25; }
.okul-hint__who { display: flex; gap: 8px; align-items: flex-start; font-size: var(--v2-text-sm); font-weight: 700; }
.okul-hint__why { display: grid; gap: 2px 12px; grid-template-columns: minmax(0, max-content) minmax(0, 1fr); margin: 0; padding: 8px 10px; background: var(--v2-sunken); border-radius: var(--v2-radius-sm); font-size: var(--v2-text-sm); }
.okul-hint__why > div { display: contents; }
.okul-hint__why dt { font-weight: 700; color: var(--v2-ink-2); }
.okul-hint__why dd { margin: 0; overflow-wrap: anywhere; }
.okul-hint__src { margin: 0; }
.okul-hint__act { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.okul-hint__rules { margin: 0; padding-left: 1.2em; list-style: disc; display: grid; gap: 6px; font-size: var(--v2-text-sm); }
.okul-assist { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--v2-space-4); }
.okul-assist__kid { display: grid; gap: var(--v2-space-2); border-top: 1.5px dashed var(--v2-line); padding-top: var(--v2-space-3); }
.okul-assist__kid:first-child { border-top: 0; padding-top: 0; }
.okul-assist__kid h4 { font-size: var(--v2-text-md); }
@media (max-width: 480px) { .okul-hint__why { grid-template-columns: 1fr; } }
/* F8.5 Aile görevleri: veli "Bu hafta" kartı + görev listesi; öğretmen atama penceresi */
.okul-week { border-top: 1.5px dashed var(--v2-line); padding-top: var(--v2-space-3); margin-bottom: var(--v2-space-4); display: grid; gap: var(--v2-space-2); }
.okul-week h4 { display: flex; gap: 8px; align-items: center; font-size: var(--v2-text-md); }
.okul-week__sub { margin-top: var(--v2-space-2); }
.okul-week__text { display: grid; gap: 6px; line-height: 1.5; }
.okul-ftasks { display: grid; gap: var(--v2-space-3); list-style: none; margin: 0; padding: 0; }
.okul-ftask { border: 1.5px solid var(--v2-line); border-radius: var(--v2-radius-sm); padding: var(--v2-space-3); display: grid; gap: 6px; background: var(--v2-surface); }
.okul-ftask.is-done { border-color: var(--v2-green-ink); background: var(--v2-green-tint); }
.okul-ftask__head { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: space-between; }
.okul-ftask__head h5 { font-size: var(--v2-text-md); margin: 0; }
.okul-ftask details summary { cursor: pointer; font-weight: 700; min-height: 44px; display: flex; gap: 6px; align-items: center; list-style: none; }
.okul-ftask details summary::-webkit-details-marker { display: none; }
.okul-ftask details[open] summary .v2-icon { transform: rotate(180deg); }
.okul-ftask details ol, .okul-ftask details ul { margin: 4px 0 4px 20px; display: grid; gap: 4px; }
.okul-ftask details ol { list-style: decimal; }
.okul-ftask details ul { list-style: disc; }
.okul-fnote { display: flex; gap: 6px; align-items: flex-start; font-size: var(--v2-text-sm); color: var(--v2-ink-2); }
small.okul-fnote { display: block; font-weight: 400; margin-top: 2px; }
.okul-fform { border-top: 1.5px dashed var(--v2-line); padding-top: var(--v2-space-4); margin-top: var(--v2-space-4); }
.okul-fprev:empty { display: none; }
.okul-fprev { border-left: 4px solid var(--v2-line); padding: 4px 0 4px 10px; display: grid; gap: 4px; }

/* ---------------------------------------------------------------- D63: boş durumlar (Piksir + açıklama + tek birincil eylem) */
.okul-empty { grid-template-columns: auto 1fr; align-items: start; justify-items: stretch; gap: 14px; }
.okul-empty svg.okul-empty__spark { width: 44px; height: 44px; flex: none; }
.okul-empty__body { display: grid; gap: 10px; justify-items: start; min-width: 0; }
.okul-empty__body p { margin: 0; max-width: 62ch; }
@media (max-width: 399.98px) { .okul-empty { grid-template-columns: 1fr; } .okul-empty svg.okul-empty__spark { width: 36px; height: 36px; } }

/* ---------------------------------------------------------------- D63: Başlangıç rehberi (müdür / öğretmen ilk kullanım) */
.okul-start { display: grid; gap: var(--v2-space-4); border-color: var(--v2-ink); background: var(--v2-surface); }
.okul-start__head { display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: center; }
.okul-start__head svg.okul-start__spark { width: 56px; height: 56px; }
.okul-start__head h3 { font-size: var(--v2-text-xl); }
.okul-start__head h3:focus { outline: none; }
.okul-start__head p { margin: 2px 0 0; }
.okul-start__count { margin: 0; padding: 6px 12px; border: var(--v2-stroke-soft) solid var(--v2-line); border-radius: var(--v2-radius-pill); background: var(--v2-yellow-tint); color: var(--v2-ink); font-size: var(--v2-text-sm); white-space: nowrap; }
.okul-start__steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; counter-reset: none; }
.okul-step { display: grid; grid-template-columns: 40px 1fr; gap: 12px; align-items: start; padding: 12px; border: var(--v2-stroke-soft) dashed var(--v2-line); border-radius: var(--v2-radius); }
.okul-step__no { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; border: var(--v2-stroke) solid var(--v2-ink); background: var(--v2-surface); font-family: var(--v2-font-display); font-weight: 800; color: var(--v2-ink); }
.okul-step__no .v2-icon { width: 22px; height: 22px; }
.okul-step__body { display: grid; gap: 6px; min-width: 0; }
.okul-step__body h4 { font-size: var(--v2-text-md); margin: 0; }
.okul-step__body p { margin: 0; color: var(--v2-ink-2); }
.okul-step.is-next { border-style: solid; border-color: var(--v2-ink); background: var(--v2-yellow-tint); }
.okul-step.is-next .okul-step__no { background: var(--v2-yellow); }
.okul-step.is-done .okul-step__no { background: var(--v2-green-tint); border-color: var(--v2-green-ink); color: var(--v2-green-ink); }
.okul-step.is-done h4 { color: var(--v2-ink-2); }
.okul-step.is-wait { opacity: 1; }
.okul-step.is-wait .okul-step__no { border-style: dashed; color: var(--v2-ink-2); }
.okul-step.is-info .okul-step__no { background: var(--v2-blue-tint); border-color: var(--v2-blue-ink); color: var(--v2-blue-ink); }
.okul-start__foot { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; border-top: 1.5px dashed var(--v2-line); padding-top: var(--v2-space-3); }
.okul-start-mini { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; }
@media (max-width: 559.98px) {
  .okul-start__head { grid-template-columns: auto 1fr; }
  .okul-start__head svg.okul-start__spark { width: 44px; height: 44px; }
  .okul-start__count { grid-column: 1 / -1; justify-self: start; }
  .okul-step { grid-template-columns: 34px 1fr; padding: 10px; gap: 10px; }
  .okul-step__no { width: 34px; height: 34px; }
  .okul-step .v2-actions .v2-btn { width: 100%; justify-content: center; }
}
@media print { .okul-start, .okul-start-mini { display: none !important; } }
/* D63: panelde gizlenen site kabuğu (siteChrome) gerçekten gizli kalsın — .v2-bottomnav'ın display kuralı [hidden]'ı eziyordu */
.okul #siteNav[hidden], .okul #top[hidden] { display: none !important; }
/* D72: sınıf ve öğrenci ekleme Piksir ekibinde — bilgi notu ve "nasıl eklenir" adımları */
.okul-adminnote { margin-bottom: var(--v2-space-4); }
.okul-adminsteps { margin: var(--v2-space-3) 0 0 1.2em; list-style: decimal; display: grid; gap: var(--v2-space-2); }
/* U162/R11: robotik ünitesi ödev grupları (öğretmen tablosu, öğrenci listesi) ve çıkış bileti cevap anahtarı */
.okul-unitrow th { text-align: left; background: var(--v2-sunken); padding: var(--v2-space-3) var(--v2-space-3); font-weight: 600; }
.okul-unitrow th .v2-btn { margin-left: var(--v2-space-2); }
.okul-unitrow__t { display: inline-flex; align-items: center; gap: 8px; }
.okul-unitrow__m { margin-left: var(--v2-space-2); font-weight: 400; color: var(--v2-ink-2); }
.okul-unitgrp { margin-top: var(--v2-space-5); }
.okul-unitgrp__t { display: flex; align-items: center; gap: 8px; font-size: var(--v2-text-lg); overflow-wrap: anywhere; }
.okul-unitgrp__m { margin: var(--v2-space-1) 0 var(--v2-space-4); }
.okul-unitprev { margin-top: var(--v2-space-3); }
.okul-keylist { margin: var(--v2-space-3) 0 0 1.2em; list-style: decimal; display: grid; gap: var(--v2-space-4); }
.okul-keylist ul { margin: var(--v2-space-2) 0 0; padding: 0; list-style: none; display: grid; gap: 4px; }
.okul-key--ok { font-weight: 700; }

/* D194 (Faz 3): Ders akışı — sınıf için ünite aç/kapat. Satırlar dar ekranda alt alta dizilir (yatay kaydırma yok). */
.okul-akis__sel { display: grid; gap: var(--v2-space-1); max-width: 360px; margin-bottom: var(--v2-space-4); }
.okul-akis { gap: var(--v2-space-4); }
.okul-akis__switch { display: flex; align-items: center; gap: var(--v2-space-3); min-height: 44px; font-size: var(--v2-text-lg); }
.okul-akis__serbest .v2-hint { margin-top: var(--v2-space-1); }
.okul-akis__gozu { display: flex; align-items: flex-start; gap: var(--v2-space-2); margin: 0; padding: var(--v2-space-3); background: var(--v2-sunken); border-radius: var(--v2-radius, 12px); overflow-wrap: anywhere; }
.okul-akis__phead { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--v2-space-3); }
.okul-akis__phead h3 { display: inline-flex; align-items: center; gap: 8px; margin: 0; }
.okul-akis__kad { margin: var(--v2-space-4) 0 var(--v2-space-2); }
.okul-akis__list { list-style: none; margin: var(--v2-space-3) 0 0; padding: 0; display: grid; gap: var(--v2-space-2); }
.okul-akis__unit { border: 1.5px solid var(--v2-line); border-radius: var(--v2-radius, 12px); padding: var(--v2-space-3); min-width: 0; }
.okul-akis__unit.is-acik { background: var(--v2-green-tint, var(--v2-sunken)); }
.okul-akis__row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto auto; align-items: center; gap: var(--v2-space-3); }
.okul-akis__name { display: grid; gap: 2px; min-width: 0; overflow-wrap: anywhere; }
.okul-akis__acts { display: flex; flex-wrap: wrap; gap: var(--v2-space-2); justify-content: flex-end; }
.okul-akis__not { margin: var(--v2-space-2) 0 0; }
.okul-akis__games { margin-top: var(--v2-space-2); }
.okul-akis__games summary { cursor: pointer; min-height: 32px; display: inline-flex; align-items: center; color: var(--v2-ink-2); }
.okul-akis__games ul { list-style: none; margin: var(--v2-space-2) 0 0; padding: 0; display: grid; gap: var(--v2-space-1); }
.okul-akis__games li { display: flex; align-items: center; justify-content: space-between; gap: var(--v2-space-3); overflow-wrap: anywhere; }
@media (max-width: 720px) {
  .okul-akis__row { grid-template-columns: minmax(0, 1fr) auto; }
  .okul-akis__name { grid-column: 1 / -1; }
  .okul-akis__acts { grid-column: 1 / -1; justify-content: flex-start; }
  .okul-akis__acts .v2-btn { flex: 1 1 120px; justify-content: center; min-height: 44px; }
  .okul-akis__phead .v2-actions { width: 100%; }
  .okul-akis__phead .v2-actions .v2-btn { flex: 1 1 140px; justify-content: center; min-height: 44px; }
}