/* Dalga 4 — sınıf/yarışma eklentileri: soru ödevi (so-), panel sınıf sekmeleri (ps-), beceri radarı + karne (sv-).
   Tokenlar ortak.css'ten. Chromium 80: flex gap yok (margin), grid gap var, inset/aspect-ratio/:is yok. Önekli sınıf adları. */

/* =============================================================== SORU ÖDEVİ (öğrenci telefonu) */
.so-sayfa .kap.so-kap { max-width: 620px; padding-top: 10px; padding-bottom: 28px; }
.so-ust { display: flex; align-items: center; min-height: 52px; }
.so-ust .marka { font-size: 20px; }
.so-ust .marka svg { width: 36px; height: 36px; margin-right: 10px; }
@media (max-width: 440px) { .so-ust .marka span { display: none; } }
.so-kim { margin-left: auto; display: flex; align-items: center; background: var(--yuzey); border: 1.5px solid var(--cizgi); border-radius: 999px; padding: 3px 14px 3px 3px; font-weight: 800; font-size: 17px; box-shadow: 0 1px 2px rgba(26,43,76,.06); }
.so-kim img { width: 34px; height: 34px; border-radius: 50%; margin-right: 8px; }
.so-ikon { width: 52px; height: 52px; margin-left: 10px; flex: none; display: grid; place-items: center; border: 1.5px solid var(--cizgi); border-radius: 16px; background: var(--yuzey); color: var(--metin); padding: 0; }
.so-ikon .bk-simge { width: 24px; height: 24px; }
.so-kim[hidden] + .so-ikon { margin-left: auto; }
.so-ekran { margin-top: 10px; }
.so-kart { background: var(--yuzey); border: 1.5px solid var(--cizgi); border-radius: 24px; padding: 20px 18px 22px; box-shadow: 0 2px 4px rgba(26,43,76,.05), 0 18px 40px -26px rgba(26,43,76,.45); }
.so-cip { display: inline-block; background: var(--birincil-acik); color: var(--birincil-koyu); border-radius: 999px; padding: 4px 12px; font-weight: 800; font-size: 14px; margin-bottom: 6px; }
.so-baslik { font: 800 clamp(26px, 7vw, 36px)/1.12 var(--baslik); letter-spacing: -.02em; margin: 0 0 6px; }
.so-soru { font: 800 22px/1.2 var(--baslik); margin: 16px 0 2px; }
.so-alt { color: var(--metin-2); margin: 0 0 12px; font-size: 16px; }
.so-not { background: var(--uyari-zemin); color: var(--uyari-koyu); border-radius: 14px; padding: 10px 14px; font-weight: 700; margin: 6px 0 0; }
.so-no-izgara { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); grid-gap: 8px; }
@media (max-width: 520px) { .so-no-izgara { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.so-no { min-height: 56px; border: 1.5px solid var(--cizgi); border-radius: 14px; background: var(--yuzey); color: var(--metin); font: 800 22px/1 var(--baslik); font-variant-numeric: tabular-nums; padding: 0; touch-action: manipulation; transition: background-color .15s ease, transform .12s ease; }
.so-no:active { transform: scale(.94); }
.so-no[aria-pressed="true"] { background: var(--birincil); border-color: var(--birincil); color: #fff; box-shadow: 0 8px 18px -8px rgba(42,75,215,.6); }
.so-av-izgara { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); grid-gap: 10px; }
@media (max-width: 520px) { .so-av-izgara { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.so-av { border: 0; background: transparent; padding: 3px; border-radius: 50%; min-height: 56px; touch-action: manipulation; transition: transform .12s ease; }
.so-av img { display: block; width: 100%; height: auto; border-radius: 50%; box-shadow: 0 0 0 1.5px var(--cizgi); }
.so-av:active { transform: scale(.93); }
.so-av[aria-checked="true"] img { box-shadow: 0 0 0 5px var(--birincil), 0 8px 18px -8px rgba(42,75,215,.6); }
.so-ana, .so-ikinci { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 64px; border-radius: 18px; font: 800 22px/1 var(--baslik); margin-top: 18px; padding: 0 20px; touch-action: manipulation; }
.so-ana { border: 0; background: var(--birincil); color: #fff; box-shadow: 0 12px 24px -12px rgba(42,75,215,.7); }
.so-ana[disabled] { opacity: .45; box-shadow: none; }
.so-ikinci { border: 1.5px solid var(--cizgi); background: var(--yuzey); color: var(--metin); margin-top: 10px; }
.so-tehlike { background: var(--hata); box-shadow: none; }
.so-kvkk { display: flex; align-items: flex-start; color: var(--metin-2); font-size: 14px; margin: 14px 0 0; }
.so-kvkk .bk-simge { width: 20px; height: 20px; flex: none; margin-right: 8px; }
.so-yuk { display: flex; justify-content: center; margin: 80px auto 16px; }
.so-yuk i { width: 18px; height: 18px; border-radius: 6px; margin: 0 6px; animation: soZipla 1.4s ease-in-out infinite; }
.so-yuk i:nth-child(1) { background: var(--sik-1); } .so-yuk i:nth-child(2) { background: var(--sik-2); animation-delay: .15s; } .so-yuk i:nth-child(3) { background: var(--sik-3); animation-delay: .3s; } .so-yuk i:nth-child(4) { background: var(--sik-4); animation-delay: .45s; }
@keyframes soZipla { 0%, 60%, 100% { transform: none; } 30% { transform: translateY(-8px); } }
.so-yuk-yazi { text-align: center; font-weight: 700; font-size: 19px; color: var(--metin-2); max-width: 420px; margin: 0 auto; }
.so-yuk-maskot { display: block; margin: 60px auto 10px; }
/* seri */
.so-bolumler { list-style: none; margin: 12px 0 0; padding: 0; }
.so-bolumler li + li { margin-top: 10px; }
.so-bolum { width: 100%; min-height: 72px; display: flex; align-items: center; justify-content: space-between; border: 1.5px solid var(--cizgi); border-radius: 18px; background: var(--yuzey); color: var(--metin); padding: 10px 16px; text-align: left; touch-action: manipulation; }
.so-bolum b { font: 800 22px/1 var(--baslik); }
.so-bolum.so-kilitli { background: var(--yuzey-2); color: var(--metin-2); }
.so-bolum.so-bitti { border-color: #9ED9B4; background: var(--basari-zemin); }
.so-b-durum { display: flex; align-items: center; font-weight: 700; font-size: 16px; }
.so-b-durum .bk-simge { margin-right: 6px; }
.so-b-acik { color: var(--birincil-koyu); } .so-b-tamam { color: var(--basari-koyu); } .so-b-yarim { color: var(--uyari-koyu); }
.so-rozet { display: flex; align-items: center; margin-top: 16px; background: var(--yuzey-2); border-radius: 20px; padding: 12px 16px; }
.so-rozet img { width: 64px; height: auto; flex: none; margin-right: 14px; filter: grayscale(1) opacity(.5); transition: filter .5s ease; }
.so-rozet.so-rozet-var { background: #FFF6CC; box-shadow: inset 0 0 0 2px #FFD84D; }
.so-rozet.so-rozet-var img { filter: none; }
.so-rozet b { display: block; font: 800 20px/1.15 var(--baslik); }
.so-rozet span { display: block; color: var(--metin-2); font-size: 15px; margin-top: 2px; }
.so-cubuk { display: block; height: 10px; border-radius: 999px; background: var(--yuzey-3); margin-top: 8px; overflow: hidden; }
.so-cubuk > i { display: block; height: 100%; background: var(--basari); border-radius: 999px; }
/* giriş */
.so-kurallar { list-style: none; margin: 12px 0 0; padding: 0; }
.so-kurallar li { display: flex; align-items: flex-start; font-size: 18px; line-height: 1.4; margin-bottom: 10px; }
.so-kural-no { flex: none; width: 32px; height: 32px; border-radius: 10px; background: var(--birincil-acik); color: var(--birincil-koyu); display: grid; place-items: center; font: 800 17px/1 var(--baslik); margin-right: 12px; }
.so-devam { display: flex; align-items: center; background: var(--uyari-zemin); color: var(--uyari-koyu); border-radius: 14px; padding: 12px 14px; font-size: 17px; margin: 12px 0 0; }
.so-devam .bk-simge { flex: none; margin-right: 10px; }
/* soru */
.so-soru-ust { display: flex; align-items: center; }
.so-etiket { display: inline-flex; align-items: center; min-height: 34px; background: var(--yuzey); border: 1.5px solid var(--cizgi); border-radius: 999px; padding: 2px 14px; font-weight: 800; font-size: 16px; margin-right: 8px; }
.so-kip-etiket { background: var(--birincil-acik); border-color: transparent; color: var(--birincil-koyu); }
.so-sure { margin-left: auto; display: inline-flex; align-items: center; background: var(--yuzey); border: 1.5px solid var(--cizgi); border-radius: 999px; padding: 4px 14px; font: 800 20px/1 var(--baslik); font-variant-numeric: tabular-nums; }
.so-sure .bk-simge { width: 20px; height: 20px; margin-right: 6px; }
.so-sure.so-sure-az { background: var(--hata-zemin); color: var(--hata); border-color: #FFCDBE; }
.so-noktalar { display: flex; flex-wrap: wrap; margin: 12px 0 4px; }
.so-noktalar i { width: 14px; height: 14px; border-radius: 50%; background: var(--yuzey-3); margin: 0 6px 6px 0; transition: background-color .25s ease, transform .25s ease; }
.so-noktalar .so-n-simdi { background: var(--birincil); transform: scale(1.25); }
.so-noktalar .so-n-gitti { background: var(--bos-cizgi); }
.so-noktalar .so-n-D { background: var(--basari); } .so-noktalar .so-n-K { background: var(--uyari); } .so-noktalar .so-n-Y { background: var(--hata); } .so-noktalar .so-n-B { background: var(--bos-cizgi); }
.so-metin { font: 700 clamp(21px, 5.6vw, 28px)/1.3 var(--baslik); margin: 8px 0 6px; }
.so-gorsel { text-align: center; }
.so-gorsel svg { max-width: 100%; height: auto; max-height: 200px; }
.so-secenekler.secenekler { grid-template-columns: 1fr; grid-gap: 12px; gap: 12px; margin-top: 10px; }
@media (min-width: 900px) and (min-height: 640px) { .so-secenekler.secenekler { grid-template-columns: 1fr 1fr; } }
.so-secenekler .secenek { min-height: 80px; font-size: clamp(21px, 5.8vw, 28px); padding: 12px 18px; width: 100%; text-align: left; color: var(--metin); }
.so-secenekler .secenek .sec-resim svg { width: auto; height: 76px; max-width: 150px; }
.so-secenekler.so-onay-bekle .secenek:not(.secili) { opacity: .62; }
.so-secenekler .secenek.dogru { opacity: 1; background: var(--basari); color: #fff; outline: 4px solid var(--metin); outline-offset: 3px; }
.so-secenekler .secenek.dogru .sekil { color: var(--metin); }
.so-secenekler .secenek.yanlis { opacity: .32; }
.so-sayfa .dogru-sekil { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 9px; vertical-align: middle; margin-right: 8px; flex: none; color: var(--metin); }
.so-sayfa .dogru-sekil .sekil { width: 20px; height: 20px; padding: 0; background: transparent; }
.so-sayfa .so-dk-satir .dogru-sekil { width: 28px; height: 28px; }
.so-secenekler .secenek.secili { opacity: 1; outline: 5px solid var(--metin); outline-offset: 3px; transform: scale(1.01); }
.so-medya-dugmeler { display: flex; flex-wrap: wrap; margin: 10px 0 2px; }
.so-medya-d { display: inline-flex; align-items: center; min-height: 64px; border: 0; border-radius: 18px; background: var(--birincil); color: #fff; font: 800 20px/1 var(--baslik); padding: 0 22px 0 16px; margin: 0 10px 8px 0; box-shadow: 0 10px 22px -12px rgba(42,75,215,.7); touch-action: manipulation; }
.so-medya-d .bk-simge { margin-right: 10px; }
.so-medya-izle { background: var(--metin); }
.so-medya-d.so-caliyor { animation: soNabiz .9s ease-in-out 2; }
@keyframes soNabiz { 50% { transform: scale(1.06); } }
.so-video { margin: 4px 0 8px; }
.so-video-oran { position: relative; padding-top: 56.25%; border-radius: 18px; overflow: hidden; background: #0d1530; }
.so-video-oran iframe, .so-video-oran video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }
.so-geri { margin-top: 14px; border-radius: 18px; padding: 14px 16px; font-size: 17px; }
.so-geri p { margin: 6px 0 0; }
.so-g-bas { display: flex; align-items: center; font: 800 24px/1.1 var(--baslik); }
.so-g-bas .bk-simge { margin-right: 10px; flex: none; }
.so-g-dogru { background: var(--basari-zemin); color: var(--basari-koyu); }
.so-g-kismi { background: var(--uyari-zemin); color: var(--uyari-koyu); }
.so-g-tekrar { background: var(--bilgi-zemin); color: var(--birincil-koyu); }
.so-g-yanlis { background: var(--hata-zemin); color: var(--metin); }
.so-dogru-cevap { display: flex; align-items: center; font-weight: 800; font-size: 20px; }
.so-dogru-cevap .sec-resim svg { height: 48px; width: auto; }
.so-aciklama { color: var(--metin); }
.so-alt-cubuk { position: -webkit-sticky; position: sticky; bottom: 0; padding: 12px 0 calc(8px + env(safe-area-inset-bottom)); background: linear-gradient(rgba(252,253,255,0), var(--kagit) 18px); z-index: 3; }
.so-gonder { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 72px; border: 0; border-radius: 20px; background: var(--birincil); color: #fff; font: 800 clamp(23px, 6.6vw, 28px)/1 var(--baslik); box-shadow: 0 12px 24px -12px rgba(42,75,215,.75); touch-action: manipulation; transition: opacity .2s ease; }
.so-gonder .bk-simge { width: 30px; height: 30px; margin: 0 10px; }
.so-gonder[disabled] { opacity: .4; box-shadow: none; }
/* sonuç */
.so-sonuc-bas { display: flex; align-items: center; }
.so-sonuc-bas img { width: 104px; height: 104px; flex: none; margin-right: 12px; }
.so-dkyb { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-gap: 10px; margin: 14px 0 4px; }
.so-dkyb:not(:empty) .so-d:nth-child(3):last-child { grid-column: span 2; }
@media (max-width: 420px) { .so-dkyb { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.so-d { border-radius: 18px; padding: 12px 10px; text-align: center; }
.so-d b { display: block; font: 800 40px/1 var(--baslik); font-variant-numeric: tabular-nums; }
.so-d span { display: block; font-weight: 800; font-size: 17px; margin-top: 4px; }
.so-d small { display: block; font-size: 13px; color: var(--metin-2); min-height: 1em; }
.so-d-d { background: var(--basari-zemin); color: var(--basari-koyu); } .so-d-k { background: var(--uyari-zemin); color: var(--uyari-koyu); }
.so-d-y { background: var(--hata-zemin); color: var(--hata); } .so-d-b { background: var(--yuzey-2); color: var(--metin-2); }
.so-ara-baslik { font: 800 22px/1.2 var(--baslik); margin: 18px 0 6px; }
.so-dokum { list-style: none; margin: 0; padding: 0; }
.so-dokum li { display: flex; align-items: flex-start; border: 1.5px solid var(--cizgi); border-radius: 16px; padding: 10px 12px; margin-bottom: 8px; }
.so-dk-no { flex: none; width: 34px; height: 34px; border-radius: 10px; background: var(--yuzey-2); display: grid; place-items: center; font: 800 17px/1 var(--baslik); margin-right: 10px; }
.so-dokum li > div { flex: 1; min-width: 0; }
.so-dk-soru { margin: 0 0 4px; font-weight: 700; }
.so-dk-satir { display: flex; align-items: center; flex-wrap: wrap; margin: 2px 0; font-size: 16px; }
.so-dk-satir small { color: var(--metin-2); margin-right: 8px; min-width: 96px; }
.so-dk-satir .sec-resim svg { height: 36px; width: auto; }
.so-dk-isaret { flex: none; margin-left: 8px; }
.so-dk-D { border-color: #9ED9B4 !important; } .so-dk-D .so-dk-isaret { color: var(--basari); }
.so-dk-Y .so-dk-isaret { color: var(--hata); } .so-dk-B .so-dk-isaret { color: var(--metin-2); }
.so-gitti { display: flex; align-items: center; color: var(--metin-2); font-weight: 700; margin: 14px 0 0; }
.so-gitti .bk-simge { margin-right: 8px; flex: none; }
.so-gitti.so-gitti-ok { color: var(--basari-koyu); }
.so-onay { border: 0; border-radius: 22px; padding: 22px 20px 18px; width: min(92vw, 420px); background: var(--yuzey); color: var(--metin); box-shadow: 0 30px 70px -30px rgba(26,43,76,.6); }
.so-onay::backdrop { background: rgba(26,43,76,.4); }
.so-onay h2 { font: 800 26px/1.15 var(--baslik); margin: 0 0 8px; }
.so-onay p { color: var(--metin-2); margin: 0 0 6px; font-size: 17px; }
.so-onay-dugmeler { display: grid; grid-template-columns: 1fr 1fr; grid-gap: 10px; }
.so-onay-dugmeler > * { margin-top: 12px; font-size: 19px; }
.so-bildirim { position: fixed; left: 50%; top: 14px; transform: translateX(-50%); z-index: 80; background: var(--metin); color: #fff; border-radius: 14px; padding: 11px 18px; font-weight: 700; font-size: 16px; max-width: calc(100vw - 32px); box-shadow: 0 14px 30px -12px rgba(26,43,76,.6); }
.so-sayfa .og-oo .so-metin { display: none; }

/* =============================================================== PANEL: sınıf sekmeleri (ps-) */
.ps-iki { display: grid; grid-template-columns: minmax(0, 1fr) 360px; grid-gap: 20px; align-items: start; }
@media (max-width: 1060px) { .ps-iki { grid-template-columns: minmax(0, 1fr); } }
.ps-satir { display: flex; flex-wrap: wrap; align-items: flex-end; margin: 0 -8px; }
.ps-satir > * { margin: 0 8px 12px; }
.ps-kip { display: grid; grid-template-columns: 1fr 1fr; grid-gap: 10px; }
.ps-kip label { display: block; border: 1.5px solid var(--cizgi); border-radius: 16px; padding: 12px 14px; cursor: pointer; background: var(--yuzey); min-height: 64px; }
.ps-kip input { position: absolute; opacity: 0; pointer-events: none; }
.ps-kip input:checked + label { border-color: var(--birincil); background: var(--secili-zemin); box-shadow: inset 0 0 0 1px var(--birincil); }
.ps-kip input:focus + label { outline: 3px solid var(--odak); outline-offset: 2px; }
.ps-kip b { display: block; font: 800 18px/1.2 var(--baslik); }
.ps-kip small { display: block; color: var(--metin-2); font-size: 14px; margin-top: 2px; }
.ps-sorular { list-style: none; margin: 0; padding: 0; counter-reset: ps; }
.ps-soru { display: flex; align-items: flex-start; border: 1.5px solid var(--cizgi); border-radius: 16px; padding: 10px 12px; margin-bottom: 8px; background: var(--yuzey); }
.ps-soru-no { flex: none; width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: var(--yuzey-2); font: 800 16px/1 var(--baslik); margin-right: 10px; }
.ps-soru-ic { flex: 1; min-width: 0; }
.ps-soru-ic p { margin: 0 0 4px; font-weight: 700; }
.ps-soru-ic .ps-sec { display: flex; flex-wrap: wrap; font-size: 14.5px; color: var(--metin-2); }
.ps-soru-ic .ps-sec span { margin: 0 10px 2px 0; }
.ps-soru-ic .ps-sec .ps-dogru { color: var(--basari-koyu); font-weight: 800; }
.ps-soru-ic .ps-sec svg { max-height: 28px; width: auto; vertical-align: middle; }
.ps-kod { font-size: 12.5px; color: var(--metin-2); }
.ps-medya-ozet { display: flex; flex-wrap: wrap; margin-top: 4px; }
.ps-medya-ozet span { display: inline-flex; align-items: center; background: var(--birincil-acik); color: var(--birincil-koyu); border-radius: 999px; padding: 2px 10px; font-weight: 700; font-size: 13px; margin: 0 6px 4px 0; }
.ps-medya-ozet .bk-simge { width: 16px; height: 16px; margin-right: 4px; }
.ps-soru-eylem { display: flex; flex-direction: column; margin-left: 8px; }
.ps-soru-eylem > * + * { margin-top: 6px; }
.ps-medya-form { margin-top: 8px; background: var(--yuzey-2); border-radius: 14px; padding: 10px 12px; }
.ps-medya-form label { display: block; font-weight: 700; font-size: 14px; margin: 6px 0 4px; }
.ps-medya-form .ps-not { font-size: 13px; color: var(--metin-2); margin: 4px 0 0; }
.ps-seri-tablo { width: 100%; border-collapse: collapse; margin-top: 8px; font-size: 15px; }
.ps-seri-tablo th, .ps-seri-tablo td { padding: 6px 8px; border-bottom: 1px solid var(--cizgi); text-align: left; }
.ps-hucre { display: inline-block; min-width: 54px; text-align: center; border-radius: 8px; padding: 2px 6px; font-weight: 800; }
.ps-h-y { background: #CDEFD9; } .ps-h-o { background: #FFF1B8; } .ps-h-d { background: #FFD9CC; } .ps-h-b { background: var(--yuzey-2); color: var(--metin-2); }
.ps-rozet-k { display: inline-flex; align-items: center; font-weight: 800; color: var(--basari-koyu); }
.ps-rozet-k img { width: 22px; height: auto; margin-right: 4px; }
.ps-dkyb-bas th { font-size: 13px; }
/* Haftanın Yıldızları */
.ps-lig-bas { display: flex; flex-wrap: wrap; align-items: center; margin-bottom: 12px; }
.ps-lig-bas > * { margin: 0 12px 8px 0; }
.ps-formul { display: flex; align-items: center; background: var(--uyari-zemin); border-radius: 16px; padding: 12px 16px; margin-bottom: 14px; }
.ps-formul img { width: 46px; height: 46px; flex: none; margin-right: 12px; }
.ps-formul b { display: block; font: 800 19px/1.2 var(--baslik); }
.ps-formul span { display: block; color: var(--uyari-koyu); font-size: 14.5px; }
.ps-lig { list-style: none; margin: 0; padding: 0; }
.ps-lig li { display: grid; grid-template-columns: 44px 44px minmax(0, 1fr) repeat(4, 76px) 92px; grid-gap: 8px; align-items: center; border-bottom: 1px solid var(--cizgi); padding: 8px 4px; }
.ps-lig li.ps-lig-bas2 { font-size: 13px; color: var(--metin-2); font-weight: 700; border-bottom-width: 2px; }
.ps-lig .ps-yer { font: 800 20px/1 var(--baslik); text-align: center; }
.ps-lig li:nth-child(2) .ps-yer { background: var(--vurgu); color: var(--vurgu-metin); border-radius: 10px; padding: 6px 0; }
.ps-lig img { width: 40px; height: 40px; border-radius: 50%; }
.ps-lig .ps-ad { font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ps-lig .ps-say { text-align: right; font-variant-numeric: tabular-nums; }
.ps-lig .ps-yildiz { font: 800 20px/1 var(--baslik); color: var(--birincil-koyu); text-align: right; }
.ps-lig .ps-kura { font-size: 12px; color: var(--uyari-koyu); font-weight: 800; }
@media (max-width: 760px) { .ps-lig li { grid-template-columns: 34px 36px minmax(0, 1fr) 64px 80px; } .ps-lig .ps-gizle { display: none; } }
.ps-no-pul { display: inline-grid; place-items: center; border-radius: 50%; background: var(--birincil-acik); color: var(--birincil-koyu); font-family: var(--baslik); font-weight: 800; flex: none; }
.sv-ogr-liste .ps-no-pul { margin-right: 10px; } .sv-k-bas .ps-no-pul { margin-right: 14px; }
.ps-kod-kutu { background: var(--yuzey-2); border-radius: 14px; padding: 10px 14px; font-size: 14.5px; margin-top: 12px; }
.ps-kod-kutu code { font-weight: 800; letter-spacing: .04em; word-break: break-all; }

/* =============================================================== BECERİ RADARI + KARNE (sv-) */
.sv-karne-kap { display: grid; grid-template-columns: 260px minmax(0, 1fr); grid-gap: 20px; align-items: start; }
@media (max-width: 900px) { .sv-karne-kap { grid-template-columns: minmax(0, 1fr); } }
.sv-ogr-liste { list-style: none; margin: 0; padding: 0; max-height: 70vh; overflow: auto; }
.sv-ogr-liste button { width: 100%; display: flex; align-items: center; border: 0; background: transparent; border-radius: 12px; padding: 6px 8px; min-height: 52px; text-align: left; color: var(--metin); font-weight: 700; }
.sv-ogr-liste button[aria-current="true"] { background: var(--secili-zemin); box-shadow: inset 0 0 0 1.5px var(--birincil); }
.sv-ogr-liste img { width: 36px; height: 36px; border-radius: 50%; margin-right: 10px; }
.sv-ogr-liste .sv-oran { margin-left: auto; font-variant-numeric: tabular-nums; color: var(--metin-2); }
.sv-karne { background: #fff; border: 1.5px solid var(--cizgi); border-radius: 20px; padding: 22px 24px; color: var(--metin); }
.sv-karne + .sv-karne { margin-top: 18px; }
.sv-k-bas { display: flex; align-items: center; border-bottom: 2px solid var(--metin); padding-bottom: 10px; margin-bottom: 14px; }
.sv-k-bas img { width: 64px; height: 64px; border-radius: 50%; margin-right: 14px; box-shadow: 0 0 0 2px var(--cizgi); }
.sv-k-bas h3 { font: 800 26px/1.1 var(--baslik); margin: 0; }
.sv-k-bas p { margin: 2px 0 0; color: var(--metin-2); font-size: 14.5px; }
.sv-k-bas .sv-logo { margin-left: auto; text-align: right; font: 800 14px/1.2 var(--baslik); color: var(--metin-2); }
.sv-k-govde { display: grid; grid-template-columns: minmax(0, 330px) minmax(0, 1fr); grid-gap: 18px; align-items: start; }
@media (max-width: 760px) { .sv-k-govde { grid-template-columns: minmax(0, 1fr); } }
.sv-radar { width: 100%; height: auto; display: block; }
.sv-lejant { display: flex; flex-wrap: wrap; font-size: 13.5px; color: var(--metin-2); margin-top: 4px; }
.sv-lejant span { display: inline-flex; align-items: center; margin-right: 14px; }
.sv-lejant i { width: 22px; height: 0; border-top: 3px solid #3B36D9; margin-right: 6px; }
.sv-lejant i.sv-l-gecen { border-top: 3px dashed #858FA5; }
.sv-tablo { width: 100%; border-collapse: collapse; font-size: 15px; }
.sv-tablo th, .sv-tablo td { padding: 7px 8px; border-bottom: 1px solid var(--cizgi); text-align: center; }
.sv-tablo th:first-child, .sv-tablo td:first-child { text-align: left; }
.sv-tablo thead th { font-size: 13px; color: var(--metin-2); }
.sv-tablo .sv-c-d { color: var(--basari-koyu); font-weight: 800; } .sv-tablo .sv-c-k { color: var(--uyari-koyu); font-weight: 800; }
.sv-tablo .sv-c-y { color: var(--hata); font-weight: 800; } .sv-tablo .sv-c-b { color: var(--metin-2); font-weight: 800; }
.sv-degisim { font-weight: 800; font-size: 13.5px; }
.sv-artti { color: var(--basari-koyu); } .sv-azaldi { color: var(--hata); } .sv-ayni { color: var(--metin-2); }
.sv-kaz { margin-top: 12px; font-size: 14px; }
.sv-kaz h4 { font: 800 16px/1.2 var(--baslik); margin: 10px 0 6px; }
.sv-kaz-l { list-style: none; margin: 0; padding: 0; columns: 2; column-gap: 18px; }
@media (max-width: 760px) { .sv-kaz-l { columns: 1; } }
.sv-kaz-l li { break-inside: avoid; display: flex; align-items: baseline; padding: 3px 0; border-bottom: 1px dotted var(--cizgi); }
.sv-kaz-l code { font-weight: 800; margin-right: 6px; white-space: nowrap; font-size: 12.5px; }
.sv-kaz-l span { flex: 1; min-width: 0; color: var(--metin-2); text-align: left; }
.sv-kaz-l b { margin-left: 6px; white-space: nowrap; font-size: 12.5px; }
.sv-not-satir { margin-top: 14px; border-top: 1.5px dashed var(--cizgi); padding-top: 10px; font-size: 14px; color: var(--metin-2); min-height: 70px; }
.sv-oneri { margin-top: 10px; background: var(--birincil-acik); border-radius: 12px; padding: 8px 12px; font-size: 14.5px; }

/* A4 yazdırma: yalnız karneler basılır, her öğrenci ayrı sayfa */
@media print {
  @page { size: A4 portrait; margin: 12mm; }
  html.sv-baski body { background: #fff !important; }
  html.sv-baski body > *:not(#svBaskiKap) { display: none !important; }
  html.sv-baski #svBaskiKap { display: block; width: 100%; }
  html.sv-baski .sv-c-d { color: #1B6B3A !important; } html.sv-baski .sv-c-k { color: #7A5C00 !important; }
  html.sv-baski .sv-c-y { color: #B03A20 !important; } html.sv-baski .sv-c-b { color: #555 !important; }
  html.sv-baski .sv-artti { color: #1B6B3A !important; } html.sv-baski .sv-azaldi { color: #B03A20 !important; }
  html.sv-baski .sv-karne { border: 0; border-radius: 0; padding: 0; page-break-after: always; break-after: page; box-shadow: none; }
  html.sv-baski .sv-karne:last-child { page-break-after: auto; break-after: auto; }
  html.sv-baski .sv-k-govde { grid-template-columns: 74mm minmax(0, 1fr); }
  html.sv-baski .sv-tablo { font-size: 10.5pt; }
  html.sv-baski .sv-kaz-l { columns: 2; font-size: 9pt; }
  html.sv-baski * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
#svBaskiKap { display: none; }
@media print { html.sv-baski #svBaskiKap { display: block; } }