/* Ödev Takip: tek sütun, büyük dokunma alanları, bol renk.
   Renk kuralı: ders = simge karesi ve kart kenarı; çocuk = baş harf yuvarlağı; tür = rozet; aciliyet = kalan süre ve sayaçlar. */
:root {
  --zemin: #111a2e; --yuzey: #1c2742; --yuzey2: #26355a; --cizgi: #33415f; --cizgi-g: #4a5a7d;
  --yazi: #edf1f8; --soluk: #a9b5ca; --altin: #f2b84b; --altin-y: #f7d38b;
  --okul: #6ea8fe; --ozel: #c4a1ff; --proje: #3fd8c9;
  --iyi: #4fd1a1; --dikkat: #f6b94c; --kotu: #ff7b88; --bilgi: #6ea8fe;
  --r: 16px; --h: 50px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; font-size: 16px; color: var(--yazi); background: var(--zemin);
  color-scheme: dark;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; padding-bottom: env(safe-area-inset-bottom);
  background: radial-gradient(900px 420px at 85% -120px, #3b2f7a66, transparent 70%), radial-gradient(700px 380px at -10% 10%, #1f6f8b44, transparent 70%), var(--zemin);
  background-attachment: fixed; }
a { color: var(--altin); }
:focus-visible { outline: 3px solid var(--altin); outline-offset: 2px; }
[hidden] { display: none !important; }
code { background: var(--yuzey2); padding: 1px 6px; border-radius: 6px; }

/* Çocuk renkleri */
.r-mavi { --renk: #6ea8fe; } .r-yesil { --renk: #4fd1a1; } .r-turuncu { --renk: #ffa23a; } .r-mor { --renk: #b794f6; }
.r-pembe { --renk: #f472b6; } .r-kirmizi { --renk: #ff7b88; } .r-turkuaz { --renk: #2dd4bf; } .r-sari { --renk: #f7d38b; }
.nokta { display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: var(--renk, var(--soluk)); flex: none; }
.avatar { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; flex: none; font-weight: 800; font-size: .9rem; color: #10192b; background: var(--renk, var(--soluk)); box-shadow: 0 0 0 2px color-mix(in srgb, var(--renk, #fff) 35%, transparent); }
.avatar.k { width: 26px; height: 26px; font-size: .8rem; }

/* Ders renkleri: --ders */
.ders-mat { --ders: #6ea8fe; } .ders-turkce { --ders: #ff7b88; } .ders-fen { --ders: #4fd1a1; } .ders-sosyal { --ders: #f6b94c; }
.ders-ing { --ders: #b794f6; } .ders-din { --ders: #2dd4bf; } .ders-hayat { --ders: #a3e635; } .ders-sanat { --ders: #f472b6; }
.ders-muzik { --ders: #e879f9; } .ders-beden { --ders: #fb923c; } .ders-bilisim { --ders: #38bdf8; } .ders-trafik { --ders: #facc15; }
.ders-felsefe { --ders: #a78bfa; }
.ders-x0 { --ders: #f87171; } .ders-x1 { --ders: #34d399; } .ders-x2 { --ders: #60a5fa; } .ders-x3 { --ders: #fbbf24; }
.ders-x4 { --ders: #a78bfa; } .ders-x5 { --ders: #f472b6; }

/* Üst çubuk */
.ust { display: flex; align-items: center; gap: 12px; padding: 14px max(16px, calc((100vw - 680px) / 2)); padding-top: max(14px, env(safe-area-inset-top));
  background: linear-gradient(100deg, #2a2f6e, #1d4f7a 60%, #1b6d7c); border-bottom: 1px solid #ffffff22; box-shadow: 0 6px 20px #0006; position: sticky; top: 0; z-index: 15; }
.marka { font-weight: 800; letter-spacing: .14em; color: var(--altin-y); text-decoration: none; display: inline-flex; align-items: center; gap: 8px; }
.marka::before { content: "📒"; letter-spacing: 0; }
.marka span { color: #fff; }
.kim { color: #dbe6fa; font-size: .9rem; margin-left: auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ayar { display: grid; place-items: center; min-width: 44px; height: 44px; font-size: 1.3rem; text-decoration: none; color: var(--yazi); border-radius: 12px; background: #ffffff18; }
.ust .marka + .ayar { margin-left: auto; }

.sayfa { max-width: 680px; margin: 0 auto; padding: 20px 16px 120px; }
h1 { font-size: 1.7rem; line-height: 1.2; margin: 6px 0 14px; }
h2 { font-size: 1.05rem; margin: 0 0 10px; }
h3 { font-size: 1.1rem; margin: 0; }
.aciklama { color: var(--soluk); line-height: 1.5; margin: 0 0 12px; }
.yukleniyor { padding: 40px 16px; text-align: center; }

/* Form */
label { display: block; font-weight: 600; margin: 0 0 14px; }
label small { display: block; font-weight: 400; color: var(--soluk); margin-top: 4px; }
input, select, textarea { display: block; width: 100%; min-height: var(--h); margin-top: 6px; padding: 10px 12px; border-radius: 12px; border: 1.5px solid var(--cizgi-g); background: var(--zemin); color: var(--yazi); font: inherit; }
input:focus, select:focus, textarea:focus { border-color: var(--altin); outline: none; box-shadow: 0 0 0 3px color-mix(in srgb, var(--altin) 30%, transparent); }
textarea { resize: vertical; margin-top: 0; }
input[type=hidden] { display: none; }
fieldset { border: 0; padding: 0; margin: 0 0 16px; min-width: 0; }
legend { font-weight: 600; padding: 0; margin-bottom: 8px; }
.satir { display: flex; gap: 10px; align-items: center; }
.alt-dugmeler { margin-top: 8px; }
.alt-dugmeler .buyuk { flex: 1; }
.alt-dugmeler .ikincil { flex: none; }
.hata-metin { color: var(--kotu); margin: 0 0 12px; font-weight: 600; }
.renkler { display: flex; flex-wrap: wrap; gap: 8px; }
.renkler legend { width: 100%; }
.renk-sec { margin: 0; position: relative; }
.renk-sec input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.renk-sec span { display: block; width: 44px; height: 44px; border-radius: 50%; background: var(--renk); border: 3px solid transparent; }
.renk-sec input:checked + span { border-color: #fff; box-shadow: 0 0 0 2px var(--renk); }
.renk-sec input:focus-visible + span { outline: 3px solid var(--altin); outline-offset: 2px; }
.renk-sec em { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* Ödev formu: numaralı renkli adımlar */
#odev-form { counter-reset: adim; }
.adim { counter-increment: adim; background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--r); padding: 16px; margin-bottom: 14px; }
.adim h2 { display: flex; align-items: center; gap: 10px; font-size: 1.05rem; margin: 0 0 12px; }
.adim h2 small { color: var(--soluk); font-weight: 500; }
.adim-no { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: linear-gradient(135deg, var(--altin), #ff9b54); color: #1a2238; font-weight: 800; font-size: .9rem; flex: none; }
.adim-no::before { content: counter(adim); }
.adim label { margin: 12px 0 0; }

/* Çipler ve seçenekler */
.filtre, .secenekler { display: flex; flex-wrap: wrap; gap: 8px; }
.filtre { margin-bottom: 14px; }
.cip { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border-radius: 999px; border: 1.5px solid var(--cizgi-g); background: var(--zemin); color: var(--yazi); font: inherit; font-size: .95rem; font-weight: 600; cursor: pointer; }
.cip b { font-size: .78rem; color: var(--soluk); }
.cip[aria-pressed="true"] { background: var(--altin); border-color: var(--altin); color: #1a2238; }
.cip[aria-pressed="true"] b { color: #1a2238; }
.cip:disabled { opacity: .6; cursor: not-allowed; }
.cocuk-cip { padding-left: 8px; border-color: color-mix(in srgb, var(--renk) 60%, var(--cizgi-g)); }
.cocuk-cip[aria-pressed="true"] { background: color-mix(in srgb, var(--renk) 38%, var(--yuzey)); border-color: var(--renk); color: var(--yazi); box-shadow: inset 0 0 0 1px var(--renk); }
.cocuk-cip[aria-pressed="true"] b { color: var(--yazi); }

.turler { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.tur { --kat: var(--okul); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; min-height: 82px; border-radius: 14px; border: 1.5px solid color-mix(in srgb, var(--kat) 45%, var(--cizgi-g)); background: color-mix(in srgb, var(--kat) 8%, var(--zemin)); color: var(--yazi); font: inherit; font-weight: 700; cursor: pointer; }
.tur span { font-size: 1.7rem; }
.tur.kat-ozel { --kat: var(--ozel); } .tur.kat-proje { --kat: var(--proje); }
.tur[aria-pressed="true"] { border-color: var(--kat); background: color-mix(in srgb, var(--kat) 28%, var(--zemin)); box-shadow: inset 0 0 0 1.5px var(--kat); }

/* Ders çipleri */
.ders-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.ders-cip { display: flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 12px; text-align: left; border-radius: 12px; border: 1.5px solid color-mix(in srgb, var(--ders, #94a3b8) 60%, var(--cizgi-g)); background: color-mix(in srgb, var(--ders, #94a3b8) 14%, var(--zemin)); color: var(--yazi); font: inherit; font-size: .92rem; font-weight: 600; line-height: 1.2; cursor: pointer; }
.ders-cip span { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; background: color-mix(in srgb, var(--ders, #94a3b8) 45%, var(--zemin)); font-size: 1.1rem; flex: none; }
.ders-cip[aria-pressed="true"] { background: color-mix(in srgb, var(--ders, #94a3b8) 36%, var(--zemin)); border-color: var(--ders, #94a3b8); box-shadow: inset 0 0 0 1.5px var(--ders, #94a3b8); }
.ders-cip[aria-pressed="true"]::after { content: "✓"; margin-left: auto; font-weight: 800; color: var(--ders, #94a3b8); }
.ders-baska { margin-top: 10px; }

/* Tarih ve saat seçici */
.gun-cip[aria-pressed="true"] { background: var(--altin); }
.secici-satir { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 10px; margin-top: 12px; }
.alan { display: block; width: 100%; min-width: 0; height: var(--h); padding: 0 14px; border: 1.5px solid var(--cizgi-g); border-radius: 12px; background: var(--zemin); color: var(--yazi); font: inherit; font-size: 1rem; margin: 0; }
.secici { display: flex; align-items: center; gap: 10px; text-align: left; cursor: pointer; font-weight: 700; }
.secici i { font-style: normal; font-size: 1.2rem; }
.secici span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.secici.tarih i { filter: none; } .secici.tarih { border-color: color-mix(in srgb, var(--okul) 60%, var(--cizgi-g)); }
.secici.saat { border-color: color-mix(in srgb, var(--ozel) 60%, var(--cizgi-g)); }
.secici[aria-expanded=true] { border-color: var(--altin); box-shadow: 0 0 0 3px color-mix(in srgb, var(--altin) 25%, transparent); }
.acilir { margin-top: 12px; padding: 16px; background: var(--yuzey2); border: 1.5px solid var(--cizgi-g); border-radius: var(--r); }
.takvim-ust { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.takvim-ust b { font-size: 1.15rem; }
.takvim-ust .ok { width: 44px; height: 44px; border-radius: 12px; border: 1.5px solid var(--cizgi-g); background: var(--zemin); color: var(--yazi); font-size: 1.5rem; line-height: 1; cursor: pointer; }
.takvim-ust .ok:disabled { opacity: .3; cursor: default; }
.gunler { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.gunler span { text-align: center; font-size: .82rem; font-weight: 700; color: var(--altin-y); padding-bottom: 4px; }
.gunler span.hs { color: var(--kotu); }
.gunler button { position: relative; aspect-ratio: 1; min-height: 40px; max-height: 56px; width: 100%; border-radius: 12px; border: 1.5px solid transparent; background: var(--zemin); color: var(--yazi); font: inherit; font-size: 1.05rem; font-weight: 600; cursor: pointer; }
.gunler button.haftasonu { color: #ffb3bb; background: color-mix(in srgb, var(--kotu) 10%, var(--zemin)); }
.gunler button.bugun { border-color: var(--okul); }
.gunler button.dolu i { position: absolute; bottom: 5px; left: 50%; width: 7px; height: 7px; margin-left: -3.5px; border-radius: 50%; background: var(--ozel); font-size: 0; }
.gunler button[aria-pressed=true] { background: var(--altin); color: #1a2238; border-color: var(--altin); }
.gunler button[aria-pressed=true] i { background: #1a2238; }
.gunler button:disabled { opacity: .3; cursor: default; }
.gunler button:not(:disabled):hover { border-color: var(--altin); }
.takvim-not { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; margin: 12px 0 0; color: var(--soluk); font-size: .82rem; }
.bugun-isaret, .dolu-isaret { display: inline-block; width: 14px; height: 14px; border-radius: 5px; }
.bugun-isaret { border: 1.5px solid var(--okul); } .dolu-isaret { background: var(--ozel); margin-left: 6px; }
.etiket { display: block; font-size: .88rem; color: var(--altin-y); font-weight: 700; margin: 0; }
.izgara { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 8px 0 14px; }
.izgara button { height: 44px; border-radius: 12px; border: 1.5px solid var(--cizgi-g); background: var(--zemin); color: var(--yazi); font: inherit; font-size: 1.05rem; font-weight: 600; cursor: pointer; }
.izgara button[aria-pressed=true] { background: var(--ozel); color: #1a2238; border-color: var(--ozel); }
.acilir .tamam { width: 100%; }
.acilir button:focus-visible, .secici:focus-visible { outline: 3px solid var(--altin); outline-offset: 2px; }

/* Düğmeler */
.dugme { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: var(--h); padding: 0 20px; border-radius: 12px; border: 1.5px solid transparent; font: inherit; font-weight: 700; cursor: pointer; text-decoration: none; }
.dugme.ana { background: linear-gradient(135deg, #f7c65f, #ff9f55); color: #1a2238; box-shadow: 0 4px 14px #ff9f5533; }
.dugme.ikincil { background: transparent; color: var(--yazi); border-color: var(--cizgi-g); }
.dugme.uyari { background: var(--dikkat); color: #1a2238; }
.dugme.tehlike { background: transparent; color: var(--kotu); border-color: var(--kotu); }
.dugme.buyuk { min-height: 56px; font-size: 1.05rem; width: 100%; }
.dugme.kucuk { min-height: 40px; padding: 0 14px; font-size: .9rem; width: auto; }
.dugme.ana.kucuk { background: linear-gradient(135deg, #5be0b0, #35b88c); color: #06281d; box-shadow: none; }
.dugme:disabled { opacity: .6; cursor: wait; }
.baglanti { background: none; border: 0; color: var(--soluk); font: inherit; font-size: .9rem; font-weight: 600; cursor: pointer; padding: 10px 8px; min-height: 40px; border-radius: 10px; }
.baglanti:hover { background: #ffffff10; color: var(--yazi); }
.baglanti.tehlike { color: var(--kotu); }

/* Giriş */
.giris { max-width: 420px; margin: 0 auto; padding: 32px 16px; }
.giris-ust { text-align: center; margin-bottom: 18px; }
.giris-ikon { display: grid; place-items: center; width: 76px; height: 76px; margin: 0 auto 12px; border-radius: 22px; font-size: 2.4rem; background: linear-gradient(135deg, #4f46e5, #0ea5a4); box-shadow: 0 10px 30px #4f46e566; }
.giris h1 { margin: 0 0 6px; background: linear-gradient(90deg, var(--altin-y), #fff 60%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.giris-ozellikler { list-style: none; display: grid; gap: 8px; margin: 0 0 20px; padding: 0; }
.giris-ozellikler li { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; background: var(--yuzey); border: 1px solid var(--cizgi); font-size: .93rem; }
.giris-ozellikler li span { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; font-size: 1.1rem; flex: none; }
.giris-ozellikler li:nth-child(1) span { background: #6ea8fe33; } .giris-ozellikler li:nth-child(2) span { background: #4fd1a133; } .giris-ozellikler li:nth-child(3) span { background: #f6b94c33; }
.giris form { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--r); padding: 16px; }
.alt-baglanti { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 4px; margin-top: 8px; }
.hos-ikon { font-size: 2.6rem; margin: 0; }

/* Bildirim ve uyarılar */
.bildirim { background: color-mix(in srgb, var(--iyi) 18%, var(--yuzey)); border: 1px solid var(--iyi); border-radius: 12px; padding: 12px 14px; margin: 0 0 16px; }
.bildirim.hata { background: color-mix(in srgb, var(--kotu) 18%, var(--yuzey)); border-color: var(--kotu); }
#bildirim { position: fixed; left: 50%; bottom: max(84px, calc(env(safe-area-inset-bottom) + 84px)); transform: translateX(-50%); max-width: min(92vw, 520px); z-index: 20; background: var(--yuzey2); border: 1px solid var(--iyi); border-radius: 12px; padding: 12px 16px; box-shadow: 0 8px 24px #0008; }
#bildirim.hata { border-color: var(--kotu); }

/* Ana ekran: başlık, sayaçlar */
.gun-baslik { margin-bottom: 4px; }
.gun-tarih { margin: 0; color: var(--altin-y); font-weight: 700; font-size: .95rem; }
.gun-baslik h1 { margin: 2px 0 12px; }
.sayaclar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 18px; }
.sayac { --s: var(--okul); display: grid; justify-items: center; gap: 2px; padding: 10px 4px; border-radius: 14px; background: color-mix(in srgb, var(--s) 18%, var(--yuzey)); border: 1px solid color-mix(in srgb, var(--s) 55%, transparent); }
.sayac b { font-size: 1.6rem; line-height: 1.1; color: var(--s); }
.sayac span { font-size: .78rem; font-weight: 700; color: var(--yazi); }
.s-gecti { --s: var(--kotu); } .s-bugun { --s: var(--dikkat); } .s-yarin { --s: var(--ozel); } .s-sonra { --s: var(--okul); }
.sayac.bos-sayac { opacity: .5; }

/* Bölümler */
.bolum { margin-bottom: 22px; }
.bolum h2 { display: flex; align-items: center; gap: 8px; font-size: 1.1rem; margin: 0 0 10px; padding: 8px 12px; border-radius: 12px; background: color-mix(in srgb, var(--bol, var(--okul)) 16%, transparent); color: var(--bol, var(--yazi)); }
.bolum h2 .adet { margin-left: auto; min-width: 26px; text-align: center; padding: 1px 8px; border-radius: 999px; background: var(--bol, var(--okul)); color: #10192b; font-size: .85rem; font-weight: 800; }
.b-kontrol { --bol: #ffd166; } .b-gecti { --bol: var(--kotu); } .b-bugun { --bol: var(--dikkat); } .b-yarin { --bol: var(--ozel); } .b-hafta { --bol: var(--okul); } .b-sonra { --bol: var(--proje); }

/* Kartlar */
.kart { background: linear-gradient(180deg, color-mix(in srgb, var(--ders, var(--okul)) 9%, var(--yuzey)), var(--yuzey) 70%); border: 1px solid var(--cizgi); border-left: 6px solid var(--ders, var(--okul)); border-radius: var(--r); padding: 14px; margin-bottom: 12px; box-shadow: 0 4px 14px #0003; }
.kart.bitik { opacity: .72; }
.kart header { display: flex; align-items: flex-start; gap: 12px; }
.ders-ikon { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; background: color-mix(in srgb, var(--ders, var(--okul)) 45%, var(--zemin)); font-size: 1.5rem; flex: none; }
.kart-baslik { flex: 1; min-width: 0; }
.kart-baslik h3 { color: color-mix(in srgb, var(--ders, var(--okul)) 55%, #fff); }
.meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 4px 0 0; color: var(--soluk); font-size: .85rem; }
.rozet { font-size: .76rem; font-weight: 700; padding: 2px 10px; border-radius: 999px; background: var(--okul); color: #10192b; }
.rozet.kat-ozel { background: var(--ozel); } .rozet.kat-proje { background: var(--proje); }
.kalan { font-size: .82rem; font-weight: 800; padding: 4px 10px; border-radius: 999px; background: var(--yuzey2); color: var(--soluk); white-space: nowrap; flex: none; }
.kalan.yakin { background: color-mix(in srgb, var(--dikkat) 24%, var(--yuzey)); color: var(--dikkat); }
.kalan.gecti { background: color-mix(in srgb, var(--kotu) 24%, var(--yuzey)); color: var(--kotu); }
.konu { margin: 12px 0 4px; line-height: 1.45; font-size: 1.02rem; overflow-wrap: anywhere; }
.alt { margin: 0 0 8px; color: var(--soluk); font-size: .88rem; overflow-wrap: anywhere; }
.kisiler { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 6px; }
.kisi { display: flex; align-items: center; gap: 8px; min-height: 44px; flex-wrap: wrap; padding: 4px 8px; border-radius: 12px; background: color-mix(in srgb, var(--renk, #888) 12%, transparent); }
.kisi-ad { font-weight: 700; }
.durum-etiket { color: var(--soluk); font-size: .85rem; }
.kisi.d-kontrol .durum-etiket { color: var(--iyi); font-weight: 700; }
.kisi.d-kontrol .durum-etiket::before { content: "✓ "; }
.kisi.d-tamam .durum-etiket { color: var(--dikkat); font-weight: 700; }
.kisi.d-geri .durum-etiket { color: var(--kotu); font-weight: 700; }
.kisi-islem { margin-left: auto; display: flex; gap: 6px; }
.kart footer { display: flex; align-items: center; justify-content: flex-end; gap: 4px; margin-top: 8px; border-top: 1px solid var(--cizgi); padding-top: 4px; }
.onay { color: var(--kotu); font-weight: 700; margin-right: auto; }
.biten { margin-top: 12px; }
.biten summary { cursor: pointer; color: var(--iyi); font-weight: 700; padding: 10px 0; }
.bos { text-align: center; padding: 36px 16px; color: var(--soluk); border: 1.5px dashed var(--cizgi-g); border-radius: var(--r); background: #ffffff06; }
.bos-ikon { font-size: 3rem; margin: 0 0 6px; }
.bos-baslik { font-size: 1.2rem; font-weight: 800; color: var(--yazi); margin: 0 0 6px; }
.fab { position: fixed; right: max(16px, calc((100vw - 680px) / 2 + 16px)); bottom: max(20px, env(safe-area-inset-bottom)); z-index: 10; display: inline-flex; align-items: center; min-height: 58px; padding: 0 26px; border-radius: 999px; background: linear-gradient(135deg, #f7c65f, #ff8f5a); color: #1a2238; font-weight: 800; font-size: 1.02rem; text-decoration: none; box-shadow: 0 10px 28px #ff8f5a55, 0 4px 12px #0009; }

/* Kontrol akışı */
.kisi-not { flex-basis: 100%; color: var(--dikkat); font-size: .82rem; font-weight: 600; padding-left: 38px; }
.kisi-not.geri { color: var(--kotu); }
.geri-secenekler { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-left: auto; justify-content: flex-end; }
.kucuk-cip { min-height: 36px; padding: 0 12px; font-size: .85rem; border-color: var(--kotu); }
.kisi.d-tamam { background: color-mix(in srgb, var(--dikkat) 14%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--dikkat) 45%, transparent); }

/* Mesajdan ekle */
.mesaj-kutu { background: linear-gradient(135deg, #25d36622, var(--yuzey) 60%); border: 1.5px dashed #25d36699; border-radius: var(--r); padding: 12px 14px; margin-bottom: 18px; }
.mesaj-kutu summary { cursor: pointer; font-weight: 700; min-height: 32px; display: flex; align-items: center; gap: 8px; }
.mesaj-ikon { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; background: #25d36633; }
.mesaj-kutu textarea { margin: 8px 0 10px; }
.oneriler { display: grid; gap: 8px; margin: 12px 0; }
.oneri { text-align: left; background: color-mix(in srgb, var(--ders, #4a5a7d) 14%, var(--yuzey2)); border: 1.5px solid var(--ders, #4a5a7d); border-radius: 12px; color: var(--yazi); font: inherit; padding: 10px 12px; cursor: pointer; display: grid; gap: 2px; }
.oneri span { color: var(--soluk); font-size: .9rem; overflow-wrap: anywhere; }
.oneri em { font-style: normal; color: var(--altin-y); font-size: .85rem; font-weight: 700; }

/* Ayarlar: kontrolcü seçimi ve ders listeleri */
.kontrolculer { margin-top: 4px; padding: 12px; border: 1px solid var(--cizgi); border-radius: 14px; background: color-mix(in srgb, #ffd166 6%, var(--zemin)); }
.kontrolculer legend { color: var(--altin-y); font-weight: 700; padding: 0 6px; }
.kontrolculer .aciklama { margin-bottom: 10px; font-size: .9rem; }
.kontrolcu-veli { cursor: default; padding-left: 8px; border-color: var(--iyi); background: color-mix(in srgb, var(--iyi) 16%, var(--zemin)); }
.kontrolcu-veli small { color: var(--soluk); font-size: .72rem; font-weight: 600; }
.avatar.veli { background: var(--iyi); font-size: .8rem; }
.kontrolcu-sec { position: relative; margin: 0; }
.kontrolcu-sec input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; min-height: 0; margin: 0; cursor: pointer; }
.kontrolcu-sec:has(input:checked) { background: color-mix(in srgb, var(--renk) 38%, var(--yuzey)); border-color: var(--renk); box-shadow: inset 0 0 0 1px var(--renk); }
.kontrolcu-sec:has(input:checked)::after { content: "✓"; font-weight: 800; color: var(--renk); }
.kontrolcu-sec:has(input:focus-visible) { outline: 3px solid var(--altin); outline-offset: 2px; }
.not-kucuk { display: block; margin-top: 10px; color: var(--soluk); font-size: .8rem; line-height: 1.4; }
.ders-liste { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0; }
.ders-etiket { display: inline-flex; align-items: center; gap: 6px; padding: 4px 4px 4px 8px; border-radius: 999px; font-weight: 600; font-size: .9rem; border: 1.5px solid color-mix(in srgb, var(--ders, #94a3b8) 60%, var(--cizgi-g)); background: color-mix(in srgb, var(--ders, #94a3b8) 16%, var(--zemin)); }
.ders-etiket button { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; border: 0; background: #ffffff14; color: var(--soluk); font-size: .85rem; cursor: pointer; }
.ders-etiket button:hover { background: var(--kotu); color: #10192b; }
.ders-ekle { display: flex; gap: 8px; margin-bottom: 6px; }
.ders-ekle input { margin-top: 0; flex: 1; min-width: 0; }
.ders-ekle .dugme { flex: none; }
.ders-ekle-btn { margin-top: 6px; color: var(--altin-y); }
.blok .cip[aria-pressed="true"].kat-okul { background: var(--okul); border-color: var(--okul); }
.blok .cip[aria-pressed="true"].kat-ozel { background: var(--ozel); border-color: var(--ozel); }
.blok .cip[aria-pressed="true"].kat-proje { background: var(--proje); border-color: var(--proje); }

/* Ayarlar */
.blok { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--r); padding: 14px; margin-bottom: 16px; }
.blok h2 { color: var(--altin-y); }
.blok p { margin: 0 0 8px; }
.cocuk-satir { border-top: 1px solid var(--cizgi); padding: 4px 0; }
.cocuk-satir summary { display: flex; align-items: center; gap: 10px; cursor: pointer; min-height: 52px; }
.cocuk-satir .cocuk-form { padding: 6px 0 12px; }

@media (max-width: 480px) {
  h1 { font-size: 1.5rem; }
  .adim { padding: 14px 12px; }
  .ders-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kart-alt .dugme { flex: 1; }
}
@media (max-width: 380px) { .secici i { display: none; } .secici { justify-content: center; } }
@media (prefers-reduced-motion: no-preference) {
  .cip, .tur, .dugme, .ders-cip { transition: background-color .15s, border-color .15s, transform .1s; }
  .ders-cip:active, .tur:active, .cip:active { transform: scale(.97); }
}