:root{
  --bg:#f7f7f5; --panel:#fff; --ink:#1b1b19; --muted:#6b6b63;
  --line:#e2e2dc; --accent:#8a4b2a; --accent-soft:#f2e9e3;
}
@media (prefers-color-scheme:dark){
  :root{ --bg:#16161a; --panel:#1e1e23; --ink:#eceae5; --muted:#9c9a92;
         --line:#2e2e35; --accent:#d99a6c; --accent-soft:#2a2320; }
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);
  font:16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;}
a{color:var(--accent)}
.wrap{max-width:920px;margin:0 auto;padding:0 20px}

/* Başlık */
header.site{background:var(--panel);border-bottom:1px solid var(--line)}

.top-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:10px 20px}
.brand{font-weight:700;font-size:20px;text-decoration:none;color:var(--ink);
  white-space:nowrap;flex:0 0 auto;line-height:1.4}
.brand span{color:var(--accent)}

.search{display:flex;gap:6px;flex:1 1 240px;min-width:200px}
.search input{flex:1;min-width:0;padding:8px 12px;border:1px solid var(--line);
  border-radius:8px;background:var(--bg);color:var(--ink);font:inherit}
.search button{padding:8px 14px;border:1px solid var(--accent);border-radius:8px;
  background:var(--accent);color:#fff;cursor:pointer;font-size:15px;white-space:nowrap}

.account{display:flex;align-items:center;gap:12px;flex:0 0 auto}
.account form{margin:0}
.account a{text-decoration:none;white-space:nowrap}
.account .cta{background:var(--accent);color:#fff;padding:7px 14px;border-radius:8px}
.who{color:var(--muted);font-size:14px;max-width:160px;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
button.link{background:none;border:0;color:var(--accent);cursor:pointer;padding:0;
  font:inherit;text-decoration:underline}

/* Bölüm bağlantıları: dar ekranda yatay kaydırılır, asla kırpılmaz. */
.site-nav{border-top:1px solid var(--line);background:var(--bg)}
.nav-inner{display:flex;gap:2px;flex-wrap:wrap;padding:0 20px}
.nav-inner a{flex:0 0 auto;padding:11px 13px;text-decoration:none;color:var(--muted);
  font-size:14px;white-space:nowrap;border-bottom:2px solid transparent}
.nav-inner a:hover{color:var(--ink);background:var(--panel)}
.nav-inner a.active{color:var(--accent);border-bottom-color:var(--accent);font-weight:600}

@media (max-width:640px){
  .top-row{gap:10px}
  .brand{font-size:18px}
  .search{order:3;flex-basis:100%}
}

/* Ana sayfa */
.hero h1{margin:32px 0 8px;font-size:30px}
.hero p{color:var(--muted);margin:0 0 24px}
.grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));padding-bottom:40px}
.card{display:block;padding:18px;background:var(--panel);border:1px solid var(--line);
  border-radius:12px;text-decoration:none;color:var(--ink)}
.card:hover{border-color:var(--accent)}
.card h2{margin:0 0 6px;font-size:18px}

/* Genel */
main.wrap{padding-bottom:60px}
h1{font-size:26px;margin:28px 0 6px}
h2{font-size:20px;margin:32px 0 10px;padding-bottom:6px;border-bottom:1px solid var(--line)}
h3.group{font-size:16px;color:var(--accent);margin:24px 0 8px}
.meta{color:var(--muted);font-size:14px}
/* Sınava kalan gün sayacı (Sınav Analizi başlığının altı) */
.countdown{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;
  margin:8px 0 4px;font-size:15px;color:var(--ink)}
.countdown strong{color:var(--accent);font-size:22px;font-weight:700}
.crumbs{margin-top:20px;font-size:14px;color:var(--muted)}
.crumbs a{text-decoration:none}
.empty{color:var(--muted)}

/* Ders sayfası */
.grade h2{margin-top:28px}
ul.units{list-style:none;padding:0;margin:0}
ul.units li{padding:10px 0;border-bottom:1px solid var(--line)}
ul.units a{text-decoration:none;font-weight:600}
ul.units .meta{display:block}

/* Ünite sayfası */
.unit-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.bookmark{background:var(--panel);color:var(--ink);white-space:nowrap;margin-top:28px}
.bookmark.on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}
.outcome{background:var(--panel);border:1px solid var(--line);border-radius:10px;
  padding:14px 16px;margin:12px 0;scroll-margin-top:80px}
.outcome .code{display:inline-block;font:600 13px/1 ui-monospace,monospace;
  background:var(--accent-soft);color:var(--accent);padding:4px 8px;border-radius:6px}
.outcome .text{margin:8px 0 0;font-weight:600}
ol.steps{margin:10px 0 0;padding-left:22px;color:var(--muted)}
ol.steps li{margin:4px 0}
ul.plain{padding-left:22px}
.concepts{display:flex;flex-wrap:wrap;gap:8px}
.tag{background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:4px 12px;font-size:14px}
.pager{display:flex;justify-content:space-between;gap:16px;margin:40px 0 0;font-size:14px}
.pager .right{margin-left:auto;text-align:right}

/* Arama & kaydedilenler */
ul.results{list-style:none;padding:0}
ul.results li{padding:12px 0;border-bottom:1px solid var(--line)}
ul.results a{text-decoration:none;font-weight:600;display:block}
ul.results .meta{display:block;margin-top:2px}

/* Kimlik formları */
.auth{max-width:400px;margin:40px auto;background:var(--panel);
  border:1px solid var(--line);border-radius:12px;padding:28px}
.auth h1{margin:0 0 18px}
.auth label{display:block;margin:14px 0 4px;font-weight:600;font-size:14px}
.auth input{width:100%;padding:10px 12px;border:1px solid var(--line);
  border-radius:8px;background:var(--bg);color:var(--ink);font-size:15px}
.auth small{color:var(--muted);font-size:13px}
.auth button{width:100%;margin-top:22px;padding:11px}
.auth .alt{margin:18px 0 0;font-size:14px;color:var(--muted)}
.errors,.notice{border-radius:8px;padding:10px 14px;font-size:14px;margin-bottom:8px}
.errors{background:#fdecea;border:1px solid #f5c2bd;color:#8c1d18}
.notice{background:var(--accent-soft);border:1px solid var(--line);color:var(--ink)}
.errors ul{margin:0;padding-left:18px}
@media (prefers-color-scheme:dark){ .errors{background:#3a1d1a;border-color:#5c2b26;color:#f3b8b2} }

footer.site{border-top:1px solid var(--line);background:var(--panel);
  padding:20px 0;color:var(--muted);font-size:13px}
.foot-row{display:flex;align-items:center;justify-content:space-between;
  gap:12px;flex-wrap:wrap}
.foot-row a{color:var(--muted)}
.foot-row a:hover{color:var(--ink)}

/* Yönetim panelindeki geri bildirim gövdesi */
.fb-body{margin:6px 0 0;white-space:normal;max-width:52ch;color:var(--muted)}

/* Veri girişi */
.entry-forms{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin-top:20px}
.entry{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px}
.entry label{display:block;font-weight:600;font-size:14px;margin-bottom:6px}
.entry textarea,.entry input[type=file]{width:100%;padding:10px 12px;border:1px solid var(--line);
  border-radius:8px;background:var(--bg);color:var(--ink);font:inherit}
.entry small{display:block;color:var(--muted);font-size:13px;margin-top:6px}
.entry button{margin-top:14px;padding:10px 16px;border:0;border-radius:8px;
  background:var(--accent);color:#fff;cursor:pointer;font-size:15px}
.result{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px;margin-top:8px}
.result blockquote{margin:8px 0 0;padding-left:12px;border-left:3px solid var(--line);color:var(--ink)}
.result .shot{max-height:320px;border-radius:8px;border:1px solid var(--line);display:block;margin-bottom:12px}
ol.candidates{list-style:none;padding:0;margin:0}
ol.candidates li{display:flex;justify-content:space-between;align-items:center;gap:12px;
  background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin:8px 0}
ol.candidates li.picked{border-color:var(--accent);background:var(--accent-soft)}
.cand-main{display:flex;gap:12px;align-items:flex-start;min-width:0}
.cand-main a{text-decoration:none;font-weight:600}
.cand-main .meta{display:block}
.score{font:600 13px/1.6 ui-monospace,monospace;color:var(--accent);white-space:nowrap}
ol.candidates form{margin:0}
ol.candidates .bookmark{margin-top:0}

/* Analiz / tablolar */
.page-head h1{margin-bottom:4px}
.legend{display:flex;flex-wrap:wrap;gap:16px;margin:16px 0;font-size:13px;color:var(--muted)}
.legend .dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px}

/* AYT alan filtresi — JS açana kadar gizli. */
.field-filter{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:16px 0 0}
.field-filter[hidden]{display:none}
.field-filter .meta{margin-right:2px}
.field-filter .btn-tiny.active{background:var(--accent-soft);color:var(--accent);
  border-color:var(--accent);font-weight:600}
.lvl-0{background:#d9534f}.lvl-1{background:#e8833a}.lvl-2{background:#e8a33a}
.lvl-3{background:#c8bf3a}.lvl-4{background:#4b9b53}

details.course{background:var(--panel);border:1px solid var(--line);border-radius:10px;
  margin:10px 0;padding:0 14px}
details.course>summary{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  padding:12px 0;cursor:pointer;list-style:none}
details.course>summary::-webkit-details-marker{display:none}
details.course>summary::before{content:"▸";color:var(--muted);font-size:12px}
details.course[open]>summary::before{content:"▾"}
details.course[open]>summary{border-bottom:1px solid var(--line)}

.badge{display:inline-block;font-size:12px;padding:2px 8px;border-radius:999px;
  background:var(--bg);border:1px solid var(--line);color:var(--muted);white-space:nowrap}
.badge-tyt{background:var(--accent-soft);color:var(--accent);border-color:var(--accent)}
.badge-ayt{background:#e7eef7;color:#2a5b8a;border-color:#b9cde3}
.badge-ok{background:#e6f3e8;color:#2f6b38;border-color:#bcdcc2}
.badge-warn{background:#fdf1e0;color:#8a5a1d;border-color:#eed6ae}
.badge-danger{background:#fdecea;color:#8c1d18;border-color:#f5c2bd}
@media (prefers-color-scheme:dark){
  .badge-ayt{background:#1e2a38;color:#9dc2e8;border-color:#2f4359}
  .badge-ok{background:#1d3222;color:#96d3a2;border-color:#2c4a33}
  .badge-warn{background:#332a1a;color:#e0b878;border-color:#4a3d24}
  .badge-danger{background:#3a1d1a;color:#f3b8b2;border-color:#5c2b26}
}

.bar{position:relative;display:block;height:18px;min-width:110px;background:var(--bg);
  border:1px solid var(--line);border-radius:9px;overflow:hidden}
.bar.wide{min-width:180px;flex:1;max-width:280px}
.bar .fill{position:absolute;inset:0 auto 0 0;border-radius:9px 0 0 9px}
.bar-label{position:relative;display:block;text-align:center;font-size:11px;line-height:18px;
  font-weight:600;mix-blend-mode:difference;color:#fff}

.table-scroll{overflow-x:auto}
table.data{width:100%;border-collapse:collapse;font-size:14px;margin:8px 0 16px}
table.data th,table.data td{padding:8px 10px;border-bottom:1px solid var(--line);
  text-align:left;vertical-align:top}
table.data th{font-size:12px;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);
  font-weight:600;white-space:nowrap}
table.data td.num,table.data th.num{text-align:right;font-variant-numeric:tabular-nums}
table.data small{display:block;font-weight:400}
table.data.kv th{width:180px}
.ok{color:#2f6b38;font-weight:600}.bad{color:#a3372f;font-weight:600}
@media (prefers-color-scheme:dark){.ok{color:#8ecf9b}.bad{color:#f0a49c}}
.footnote{margin-top:24px;font-size:13px}

/* Formlar */
.entry-form{background:var(--panel);border:1px solid var(--line);border-radius:12px;
  padding:18px;margin:12px 0}
.entry-form .row{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
  margin-bottom:6px}
.entry-form label{display:block;font-weight:600;font-size:14px;margin-bottom:4px}
.entry-form input,.entry-form select{width:100%;padding:9px 11px;border:1px solid var(--line);
  border-radius:8px;background:var(--bg);color:var(--ink);font:inherit}
.entry-form small{display:block;color:var(--muted);font-size:12px;margin-top:4px}
.entry-form button{margin-top:16px;padding:10px 18px;border:0;border-radius:8px;
  background:var(--accent);color:#fff;cursor:pointer;font-size:15px}
.entry-form h2{margin-top:26px}
.course-picker{display:flex;gap:10px;align-items:end;margin:16px 0}
.course-picker select{padding:9px 11px;border:1px solid var(--line);border-radius:8px;
  background:var(--panel);color:var(--ink);font:inherit;min-width:260px}
table.data input{width:90px;padding:6px 8px;border:1px solid var(--line);border-radius:6px;
  background:var(--bg);color:var(--ink);text-align:right}

/* Özet kartları */
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;
  padding:18px;margin:14px 0}
.card-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.card-head h2{margin:0;border:0;padding:0}
.proj-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));margin:14px 0}
.proj{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:12px;text-align:center}
.proj.primary{border-color:var(--accent);background:var(--accent-soft)}
.proj.muted-box{opacity:.72}
.proj .label{display:block;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.03em}
.proj .val{display:block;font-size:26px;font-weight:700;margin:4px 0;font-variant-numeric:tabular-nums}

/* Yönetim */
.stat-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin:18px 0}
.stat{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:14px;
  font-size:13px;color:var(--muted)}
.stat .n{display:block;font-size:26px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.admin-link{color:var(--ink);border:1px solid var(--line);border-radius:6px;padding:3px 9px}

/* Yönetim: kullanıcı işlemleri */
.user-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.user-actions form{margin:0}
button.link.danger{color:#a3372f}
@media (prefers-color-scheme:dark){button.link.danger{color:#f0a49c}}
tr.pw-row td{padding-top:0;border-bottom:2px solid var(--line)}
.inline-form{display:flex;gap:8px;align-items:center;flex-wrap:wrap;
  background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:8px 10px}
.inline-form label{font-size:13px;color:var(--muted);font-weight:600}
.inline-form input{width:auto;min-width:150px;padding:6px 9px;border:1px solid var(--line);
  border-radius:6px;background:var(--panel);color:var(--ink);font:inherit;text-align:left}
.inline-form button{padding:6px 12px;border:1px solid var(--line);border-radius:6px;
  background:var(--panel);color:var(--ink);cursor:pointer;font-size:13px}
.inline-form button:hover{border-color:var(--accent);color:var(--accent)}
.pw-actions{display:flex;gap:10px;align-items:stretch;flex-wrap:wrap}
.pw-actions form{margin:0}
/* Kullanıcı arama: başlıktaki arama kutusunun panel içindeki dar hâli. */
.admin-search{flex:0 1 420px;align-items:center;margin:0 0 12px}
.admin-search a.link{font-size:14px;white-space:nowrap}

/* Vekâleten giriş şeridi */
.impersonation{background:var(--accent);color:#fff;font-size:14px}
.impersonation .wrap{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:8px 20px}
.impersonation form{margin:0}
.impersonation button.link{color:#fff}

/* Soru → konu yardımcısı */
.ai-helper{background:var(--accent-soft);border:1px solid var(--line);border-radius:12px;
  padding:0 16px;margin:14px 0}
.ai-helper>summary{padding:12px 0;cursor:pointer;font-weight:600}
.ai-helper .meta{font-weight:400}
.ai-forms{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  padding-bottom:12px}
.ai-forms form{display:flex;gap:6px;align-items:center;margin:0}
.ai-forms input[type=text]{flex:1;min-width:0;padding:8px 11px;border:1px solid var(--line);
  border-radius:8px;background:var(--panel);color:var(--ink);font:inherit}
.ai-forms input[type=file]{flex:1;min-width:0;font-size:13px;color:var(--muted)}
.ai-forms button{padding:8px 14px;border:1px solid var(--accent);border-radius:8px;
  background:var(--accent);color:#fff;cursor:pointer;white-space:nowrap}
.ai-query{padding:6px 0;border-top:1px solid var(--line)}
ul.ai-picks{list-style:none;padding:0;margin:0 0 14px;display:grid;gap:6px}
ul.ai-picks form{margin:0}
button.pick{display:flex;gap:10px;align-items:baseline;width:100%;text-align:left;
  padding:9px 12px;border:1px solid var(--line);border-radius:8px;background:var(--panel);
  color:var(--ink);cursor:pointer;font:inherit;flex-wrap:wrap}
button.pick:hover{border-color:var(--accent)}
button.pick.on{border-color:var(--accent);background:var(--accent-soft)}
button.pick .pick-topic{font-weight:600}
/* Aday satırı: seçim düğmesi + yanında "Detay". */
ul.ai-picks li.pick-row{display:flex;gap:6px;align-items:stretch}
ul.ai-picks li.pick-row form{flex:1;min-width:0}
a.btn-tiny.js-topic-detail{display:flex;align-items:center;
  text-decoration:none;font-weight:600;color:var(--muted)}
a.btn-tiny.js-topic-detail:hover{color:var(--accent);text-decoration:none}

/* Konu detay penceresinin bölümleri */
.detail-block{margin:0 0 12px}
.detail-block>.meta{display:block;font-size:11px;text-transform:uppercase;
  letter-spacing:.03em;margin-bottom:4px}
.detail-block p{margin:0}
.kw-list{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0}
.kw-list .kw{padding:2px 8px;border:1px solid var(--line);border-radius:999px;
  background:var(--panel);font-size:12px;color:var(--muted)}
.mode-switch{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;margin:10px 0}
details.topic-block{border:1px solid var(--line);border-radius:8px;margin:8px 0;padding:0 12px;
  background:var(--bg)}
details.topic-block>summary{padding:10px 0;cursor:pointer;font-weight:600;font-size:14px}
tr.unit-row td{background:var(--bg);font-size:12px;text-transform:uppercase;
  letter-spacing:.03em;color:var(--muted);font-weight:600}
tr.focus{background:var(--accent-soft)}
tr.focus td:first-child{font-weight:600}

/* Grafikler (Chart.js) */
.chart-wrap{position:relative;height:320px;margin:12px 0;background:var(--panel);
  border:1px solid var(--line);border-radius:10px;padding:10px}
.chart-wrap canvas{width:100%!important;height:100%!important}
.course-picker select.field-input{padding:9px 11px;border:1px solid var(--line);
  border-radius:8px;background:var(--panel);color:var(--ink);font:inherit;min-width:260px}
@media (max-width:640px){.chart-wrap{height:260px}}
.btn-tiny{padding:4px 10px;border:1px solid var(--line);border-radius:6px;
  background:var(--panel);color:var(--ink);font:inherit;font-size:12px;cursor:pointer;
  white-space:nowrap}
.btn-tiny:hover{border-color:var(--accent);color:var(--accent)}

/* Konu detay modalı */
.modal-backdrop{position:fixed;inset:0;z-index:50;background:rgba(15,23,42,.45);
  display:flex;align-items:center;justify-content:center;padding:20px}
.modal-backdrop[hidden]{display:none}
.modal{background:var(--bg);border:1px solid var(--line);border-radius:12px;
  width:min(860px,100%);max-height:90vh;overflow:auto;box-shadow:0 18px 48px rgba(0,0,0,.28)}
.modal-head{display:flex;align-items:baseline;gap:12px;justify-content:space-between;
  padding:14px 18px;border-bottom:1px solid var(--line)}
.modal-head h3{margin:0;font-size:16px}
.modal-head .close{border:0;background:none;color:var(--muted);font-size:22px;
  line-height:1;cursor:pointer;padding:0 4px}
.modal-head .close:hover{color:var(--ink)}
.modal-body{padding:14px 18px 18px}
.topic-stats{display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
.stat-mini{display:flex;flex-direction:column;gap:2px;padding:8px 10px;
  border:1px solid var(--line);border-radius:8px;background:var(--panel)}
.stat-mini .meta{font-size:11px}
.stat-mini strong{font-size:14px}

/* Bar dolgu genişlikleri: satır içi style CSP'ye takıldığı için sınıfla verilir. */
.bar .fill.w-0{width:0%}.bar .fill.w-1{width:1%}.bar .fill.w-2{width:2%}.bar .fill.w-3{width:3%}.bar .fill.w-4{width:4%}.bar .fill.w-5{width:5%}.bar .fill.w-6{width:6%}.bar .fill.w-7{width:7%}.bar .fill.w-8{width:8%}.bar .fill.w-9{width:9%}
.bar .fill.w-10{width:10%}.bar .fill.w-11{width:11%}.bar .fill.w-12{width:12%}.bar .fill.w-13{width:13%}.bar .fill.w-14{width:14%}.bar .fill.w-15{width:15%}.bar .fill.w-16{width:16%}.bar .fill.w-17{width:17%}.bar .fill.w-18{width:18%}.bar .fill.w-19{width:19%}
.bar .fill.w-20{width:20%}.bar .fill.w-21{width:21%}.bar .fill.w-22{width:22%}.bar .fill.w-23{width:23%}.bar .fill.w-24{width:24%}.bar .fill.w-25{width:25%}.bar .fill.w-26{width:26%}.bar .fill.w-27{width:27%}.bar .fill.w-28{width:28%}.bar .fill.w-29{width:29%}
.bar .fill.w-30{width:30%}.bar .fill.w-31{width:31%}.bar .fill.w-32{width:32%}.bar .fill.w-33{width:33%}.bar .fill.w-34{width:34%}.bar .fill.w-35{width:35%}.bar .fill.w-36{width:36%}.bar .fill.w-37{width:37%}.bar .fill.w-38{width:38%}.bar .fill.w-39{width:39%}
.bar .fill.w-40{width:40%}.bar .fill.w-41{width:41%}.bar .fill.w-42{width:42%}.bar .fill.w-43{width:43%}.bar .fill.w-44{width:44%}.bar .fill.w-45{width:45%}.bar .fill.w-46{width:46%}.bar .fill.w-47{width:47%}.bar .fill.w-48{width:48%}.bar .fill.w-49{width:49%}
.bar .fill.w-50{width:50%}.bar .fill.w-51{width:51%}.bar .fill.w-52{width:52%}.bar .fill.w-53{width:53%}.bar .fill.w-54{width:54%}.bar .fill.w-55{width:55%}.bar .fill.w-56{width:56%}.bar .fill.w-57{width:57%}.bar .fill.w-58{width:58%}.bar .fill.w-59{width:59%}
.bar .fill.w-60{width:60%}.bar .fill.w-61{width:61%}.bar .fill.w-62{width:62%}.bar .fill.w-63{width:63%}.bar .fill.w-64{width:64%}.bar .fill.w-65{width:65%}.bar .fill.w-66{width:66%}.bar .fill.w-67{width:67%}.bar .fill.w-68{width:68%}.bar .fill.w-69{width:69%}
.bar .fill.w-70{width:70%}.bar .fill.w-71{width:71%}.bar .fill.w-72{width:72%}.bar .fill.w-73{width:73%}.bar .fill.w-74{width:74%}.bar .fill.w-75{width:75%}.bar .fill.w-76{width:76%}.bar .fill.w-77{width:77%}.bar .fill.w-78{width:78%}.bar .fill.w-79{width:79%}
.bar .fill.w-80{width:80%}.bar .fill.w-81{width:81%}.bar .fill.w-82{width:82%}.bar .fill.w-83{width:83%}.bar .fill.w-84{width:84%}.bar .fill.w-85{width:85%}.bar .fill.w-86{width:86%}.bar .fill.w-87{width:87%}.bar .fill.w-88{width:88%}.bar .fill.w-89{width:89%}
.bar .fill.w-90{width:90%}.bar .fill.w-91{width:91%}.bar .fill.w-92{width:92%}.bar .fill.w-93{width:93%}.bar .fill.w-94{width:94%}.bar .fill.w-95{width:95%}.bar .fill.w-96{width:96%}.bar .fill.w-97{width:97%}.bar .fill.w-98{width:98%}.bar .fill.w-99{width:99%}
.bar .fill.w-100{width:100%}

.wrap.wide{max-width:1180px}

/* Konu özeti (müfredat content alanı) */
.topic-content {
  margin: .6rem 0 1rem;
  padding: .7rem .9rem;
  border-left: 3px solid var(--accent);
  background: var(--panel);
  line-height: 1.55;
}

.ai-forms button[disabled]{opacity:.6;cursor:progress}
.ai-result .errors,.ai-result .notice{margin:8px 0 12px}

/* ---------- Veli/öğretmen ve ödev ---------- */

/* Öğrenci görüntüleme şeridi: vekâlet şeridinin daha yumuşak hâli — kalıcı
   olduğu için dikkat çekmeli ama rahatsız etmemeli. */
.impersonation.viewing{background:var(--accent-soft);color:var(--ink);
  border-bottom:1px solid var(--line)}
.impersonation.viewing a{color:var(--accent)}

/* Davet kodu: elle okunup yazılacağı için büyük ve monospace. */
.invite-code{font:600 28px/1.3 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.12em;margin:.2em 0;color:var(--accent)}

/* Kayıt formundaki hesap türü ve ödev formundaki öğrenci seçimi */
.role-pick,.hw-students{border:1px solid var(--line);border-radius:10px;
  padding:10px 14px;margin:14px 0}
.role-pick legend,.hw-students legend{padding:0 6px;font-weight:600;font-size:14px}
label.radio{display:flex;gap:8px;align-items:baseline;margin:6px 0;font-weight:400}
/* .auth input{width:100%} kayıt formundaki radyo düğmesini de kaplıyordu:
   düğme satırı doldurunca etiket kutunun dışına taşıyordu. */
label.radio input{margin:0;flex:0 0 auto;width:auto}
.hw-students{display:flex;flex-wrap:wrap;gap:4px 18px}
.hw-students label.radio{flex:0 0 auto}
.hw-students button.link{flex-basis:100%;text-align:left;padding:4px 0}

/* Ödev durumları */
.badge.hw-done{background:#e6f3e8;color:#2f6b38;border-color:#bcdcc2}
.badge.hw-pending{background:var(--accent-soft);color:var(--accent);border-color:var(--accent)}
.badge.hw-late{background:#fdecea;color:#8c1d18;border-color:#f5c2bd}
@media (prefers-color-scheme:dark){
  .badge.hw-done{background:#1d3222;color:#96d3a2;border-color:#2c4a33}
  .badge.hw-late{background:#3a1d1a;color:#f3b8b2;border-color:#5c2b26}
}

.hw-list{list-style:none;padding:0;margin:14px 0}
.hw-list li{padding:10px 0;border-bottom:1px solid var(--line)}
.hw-list li small{display:block}
.hw-list li.hw-row-done{opacity:.65}
.hw-body{white-space:pre-line;background:var(--panel);border:1px solid var(--line);
  border-radius:10px;padding:12px 14px}

/* Teslim düğmesi ve yanındaki canlı durum yazısı */
.hw-submit-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px}
.hw-submit-row button{margin-top:0}
.hw-status{font-size:13px;color:var(--muted)}
.hw-status.ok{color:#2f6b38;font-weight:600}
.hw-status.bad{color:#8c1d18}
@media (prefers-color-scheme:dark){
  .hw-status.ok{color:#8ecf9b}
  .hw-status.bad{color:#f0a49c}
}

/* Teslim fotoğrafları */
.hw-shots{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0}
.hw-shots img{width:160px;height:160px;object-fit:cover;border:1px solid var(--line);
  border-radius:10px;display:block}

/* Yalnızca ekran okuyucu için (ör. tablodaki rol seçicisinin etiketi) */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* Yönetim panelindeki ödev temizliği düğmeleri */
.purge-row{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:baseline;margin:12px 0}
.purge-row form{display:flex;gap:6px;align-items:baseline;margin:0}
.purge-row button[disabled]{opacity:.45;cursor:not-allowed;text-decoration:none}

/* Kullanıcı adı denetimi: panelde ad onayı, kara liste ve model bölümleri.
   Ret sonrası ad değiştirme ekranındaki "çıkış yap" düğmesi bağlantı gibi
   görünür — çıkış POST istediği için gerçek bir bağlantı olamıyor. */
button.linkish{background:none;border:0;padding:0;color:var(--accent);
  font:inherit;cursor:pointer;text-decoration:underline}
button.linkish:hover{opacity:.8}
.auth form.alt{margin-top:14px}

/* Ad onay kuyruğu: karar verilen satır listeden hemen silinmez, ne yapıldığı
   görünsün diye soldurulur (bkz. public/assets/js/admin-queue.js). */
tr.queue-done{opacity:.55}
tr.queue-done td{text-decoration:line-through;text-decoration-color:var(--line)}
tr.queue-done td.meta{text-decoration:none;font-weight:600}
tr.queue-fade{opacity:.3;transition:opacity .6s ease}
tr.quant-active td{font-weight:600}
[data-filter-note].errors{padding:8px 12px;margin:8px 0}