:root{--paper:#f2f4f7;--surface:#fff;--ink:#16202e;--soft:#5c6a7c;--faint:#93a1b2;--rule:#dce2ea;
--accent:#1f4f82;--accent-soft:#e8eff7;--g:#e3f1e7;--g-ink:#2f6b4f;--y:#fbeccc;--y-ink:#8a5c0e;--r:#f6d9d3;--r-ink:#993528;--o:#fde3cf;--o-ink:#a14a0c;--h:#eef1f5;--mine:#fff8e1}
@media (prefers-color-scheme:dark){:root{--paper:#10151b;--surface:#171d25;--ink:#e7edf4;--soft:#9aa8b9;--faint:#6b7a8c;--rule:#28313c;
--accent:#84b6e9;--accent-soft:#1c2a3a;--g:#16291f;--g-ink:#7cc79c;--y:#2c2415;--y-ink:#dfb05e;--r:#2e1a17;--r-ink:#e08a7c;--o:#33210f;--o-ink:#f0a868;--h:#1c232c;--mine:#2a2614}}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:14px/1.45 system-ui,-apple-system,"Segoe UI",sans-serif}
a{color:var(--accent)}
code{font:12.5px ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--h);padding:1px 5px;border-radius:4px}
h1{font-size:22px;margin:0 0 4px}h2{font-size:17px;margin:0 0 4px}
.muted,.meta{color:var(--soft);font-size:13px}.meta{margin:0 0 16px}

.top{padding:0 24px;background:var(--surface);border-bottom:1px solid var(--rule)}
.bar{display:flex;align-items:center;gap:20px;flex-wrap:wrap;border-bottom:1px solid var(--rule)}
.brand{font-weight:700;font-size:15px;padding:12px 0}
.admin{display:flex;gap:4px;align-items:center;flex-wrap:wrap;margin-left:auto;font-size:13px}
.admin .lbl{color:var(--faint);margin-right:4px}
.admin a{padding:4px 10px;border-radius:6px;color:var(--soft);text-decoration:none}
.admin a:hover{color:var(--ink);background:var(--h)}.admin a.on{color:var(--accent);background:var(--accent-soft);font-weight:600}
.tabs{display:flex;gap:2px;overflow-x:auto}
.tabs a{padding:15px 12px 13px;color:var(--soft);text-decoration:none;border-bottom:2px solid transparent;white-space:nowrap}
.tabs a:hover{color:var(--ink)}.tabs a.on{color:var(--accent);border-bottom-color:var(--accent);font-weight:600}
.tabs a.soon{color:var(--faint)}
.who{display:flex;gap:12px;align-items:center;color:var(--soft);font-size:13px;margin-left:auto}
.admin+.who{margin-left:0}
.region{display:flex;gap:4px;font-size:13px;font-weight:600}
.region a{padding:4px 10px;border-radius:999px;color:var(--ink);text-decoration:none;border:1px solid var(--rule)}
.region a:hover{background:var(--h)}.region a.on{background:var(--accent);border-color:var(--accent);color:#fff}
.netname{font-size:13px;font-weight:600;color:var(--faint)}
.sub.nets{padding-top:8px;padding-bottom:8px}
.lang{display:flex;gap:2px;margin-left:auto;font-size:12px;font-weight:600}
.admin+.lang,.lang+.who{margin-left:0}
.lang a{padding:3px 8px;border-radius:6px;color:var(--faint);text-decoration:none;letter-spacing:.03em}
.lang a:hover{color:var(--ink);background:var(--h)}.lang a.on{color:var(--accent);background:var(--accent-soft)}
.lang-top{display:flex;justify-content:flex-end;padding:12px 24px 0}
.who form{margin:0}
button.link{background:none;border:0;color:var(--accent);cursor:pointer;font:inherit;padding:0}
.sub{display:flex;gap:6px;padding:10px 24px;flex-wrap:wrap;border-bottom:1px solid var(--rule)}
.sub a{padding:5px 12px;border-radius:999px;color:var(--ink);text-decoration:none;font-size:13px;border:1px solid var(--rule);background:var(--surface)}
.sub a.on{background:var(--accent);border-color:var(--accent);color:#fff}

.page{max-width:1400px;margin:0 auto;padding:20px 24px 32px}
.card{background:var(--surface);border:1px solid var(--rule);border-radius:10px;padding:16px;margin-bottom:16px}
.empty{color:var(--soft)}
.crumbs{margin:0 0 6px;font-size:13px}
.foot{color:var(--faint);font-size:11.5px;text-align:center;padding:0 16px 24px}

.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:16px}
.stat{background:var(--surface);border:1px solid var(--rule);border-radius:10px;padding:12px 14px}
.stat .label{color:var(--soft);font-size:12px}.stat .value{font-size:24px;font-weight:700;font-variant-numeric:tabular-nums;margin-top:2px}
.stat .note{color:var(--soft);font-size:12px}
.stat.g .value{color:var(--g-ink)}.stat.y .value{color:var(--y-ink)}.stat.r .value{color:var(--r-ink)}

.tw{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums}
th,td{border-bottom:1px solid var(--rule);padding:6px 8px;text-align:center;white-space:nowrap}
th{font-size:12px;color:var(--soft);font-weight:600;background:var(--h)}
td.l,th.l{text-align:left}td.b{font-weight:700}
td.g{background:var(--g);color:var(--g-ink)}td.y{background:var(--y);color:var(--y-ink)}td.r{background:var(--r);color:var(--r-ink);font-weight:600}
td.warn{color:var(--r-ink)}
tr.par td{background:var(--paper);color:var(--faint);font-size:11px;text-transform:uppercase;letter-spacing:.04em;text-align:left;padding:4px 8px}
tr.tot td{background:var(--h);font-weight:700}tr.sum td{font-weight:600;border-bottom-color:var(--faint)}
tr.mine td:not(.g):not(.y):not(.r){background:var(--mine)}
tr.nomarks td{color:var(--faint)}
td a{text-decoration:none}td a:hover{text-decoration:underline}
.bands{display:inline-flex;gap:3px}.bands span{min-width:26px;padding:1px 5px;border-radius:4px;font-size:12px}
.bands .g,.chip.g{background:var(--g);color:var(--g-ink)}.bands .y,.chip.y{background:var(--y);color:var(--y-ink)}.bands .r,.chip.r{background:var(--r);color:var(--r-ink)}
.chip{display:inline-block;padding:1px 7px;border-radius:4px;font-size:12px;background:var(--h);color:var(--soft)}
.legend{color:var(--soft);font-size:12px;margin:12px 0 0}

.flash{padding:10px 14px;border-radius:8px;margin-bottom:14px;border:1px solid}
.flash.ok{background:var(--g);color:var(--g-ink);border-color:var(--g-ink)}
.flash.err{background:var(--r);color:var(--r-ink);border-color:var(--r-ink)}
.pw{font-size:15px;user-select:all}
.btn{background:var(--accent);color:#fff;border:0;border-radius:8px;padding:9px 16px;font:inherit;font-weight:600;cursor:pointer}
.btn.sm{padding:5px 10px;font-size:12.5px}.btn.ghost{background:none;color:var(--accent);border:1px solid var(--rule)}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.actions form{display:flex;gap:6px;justify-content:flex-end;margin:0}
ul.plain{margin:0;padding-left:18px;color:var(--soft);font-size:13px}

.login{max-width:360px;margin:10vh auto 0;display:flex;flex-direction:column;gap:12px}
.login label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--soft)}
.login input{font:inherit;padding:9px 10px;border:1px solid var(--rule);border-radius:8px;background:var(--paper);color:var(--ink)}

@media (max-width:760px){
  .top,.sub,.page{padding-left:16px;padding-right:16px}
  .bar{gap:0 12px}.admin{order:3;flex-basis:100%;margin-left:0;padding-bottom:8px}.who,.admin+.who,.lang{margin-left:auto}.lang+.who{margin-left:0}
}
td.wrap{white-space:normal;min-width:160px;max-width:320px;font-size:12.5px;color:var(--soft)}
tr.zero td:first-child{box-shadow:inset 3px 0 0 var(--r-ink)}
.cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:start}
.cols .card{margin-bottom:0}
@media (max-width:900px){.cols{grid-template-columns:1fr}}
@media (max-width:760px){.stats{grid-template-columns:1fr 1fr}}

/* недели: даты в две строки; таблица открывается с правого края (последние недели и итог),
   первая колонка закреплена */
th.wk{font-size:11px;line-height:1.25;font-weight:500;padding:5px 6px}
.tw{direction:rtl}.tw>table{direction:ltr}
.tw th:first-child,.tw td:first-child{position:sticky;left:0;z-index:1;background:var(--surface);box-shadow:inset -1px 0 0 var(--rule)}
.tw th:first-child{background:var(--h)}
.tw tr.tot td:first-child{background:var(--h)}
.tw tr.par td:first-child{position:static;box-shadow:none;background:var(--paper)}
.tw tr.par td span{position:sticky;left:8px}
.tw tr.mine td:first-child{background:var(--mine)}
.tw tr.zero td:first-child{box-shadow:inset 3px 0 0 var(--r-ink),inset -1px 0 0 var(--rule)}
/* табель: две строки на учителя, компактная сетка дней */
table.ts td,table.ts th{padding:3px 4px;font-size:12px}
table.ts tbody.t{border-bottom:1px solid var(--faint)}
table.ts tr.plan td{border-bottom:1px dotted var(--rule);color:var(--soft)}
table.ts td.k{font-size:11px;color:var(--faint);text-align:left}
table.ts td.z{color:var(--faint)}
table.ts tbody.tot td{background:var(--h);font-weight:700}
.subj{font-weight:400;font-size:11px;color:var(--soft);white-space:normal;max-width:220px;line-height:1.3}
.months{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 14px}
.months a{padding:4px 10px;border-radius:999px;border:1px solid var(--rule);background:var(--surface);color:var(--ink);text-decoration:none;font-size:13px}
.months a.on{background:var(--ink);color:var(--surface);border-color:var(--ink)}
table.ts tr.fact td:first-child{position:static;box-shadow:none;background:transparent}
table.ts tbody.tot tr.fact td:first-child{background:var(--h)}
/* контрольные: месяцы → предметы, названия предметов вертикально */
table.kr th.vs{vertical-align:bottom;padding:6px 2px;height:150px;font-weight:500;font-size:11px}
table.kr th.vs span{writing-mode:vertical-rl;transform:rotate(180deg);white-space:nowrap;display:inline-block;max-height:140px;overflow:hidden;text-overflow:ellipsis}
table.kr td{padding:4px 3px;min-width:24px;font-size:12.5px}
table.kr td.has{background:var(--g);color:var(--g-ink);font-weight:700}
table.kr td.z{color:var(--faint)}
table.kr td.sum,table.kr th.sumh{border-right:2px solid var(--faint);font-weight:700;background:var(--h)}
.check{display:flex;gap:8px;align-items:center;margin:0 0 12px}
/* главная метрика рейтинга */
th.key,td.key{background:var(--accent-soft);color:var(--accent);font-weight:700;font-size:15px;border-left:2px solid var(--accent);border-right:2px solid var(--accent)}
th.key{font-size:12px}
tr.tot td.key{background:var(--accent-soft)}
td.rank{font-weight:700;color:var(--soft);width:44px}
.stat.key{border:2px solid var(--accent);background:var(--accent-soft)}.stat.key .value{color:var(--accent)}
table.kr th.idp,table.kr td.idp{box-shadow:inset 2px 0 0 var(--accent),inset -2px 0 0 var(--accent)}
.delta{font-size:.82em;font-weight:600;margin-left:2px}.delta.up{color:var(--g-ink)}.delta.down{color:var(--r-ink)}
/* админы сети: форма добавления */
.inp{font:inherit;padding:7px 10px;border:1px solid var(--rule);border-radius:8px;background:var(--paper);color:var(--ink);min-width:200px}
.row.mt{margin-top:12px}
table.kr th.vs.grp{color:var(--faint)}

/* телефон: ряды кнопок — одной прокручиваемой строкой, компактные карточки, таблицы на всю ширину карточки */
@media (max-width:760px){
  .sub,.months,.admin{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .sub::-webkit-scrollbar,.months::-webkit-scrollbar,.admin::-webkit-scrollbar,.tabs::-webkit-scrollbar{display:none}
  .sub{padding:8px 12px;gap:6px}
  .sub a,.months a,.admin a{flex-shrink:0;white-space:nowrap}
  .months{margin:0 -12px 12px;padding:0 12px}
  .tabs{scrollbar-width:none}.tabs a{padding:12px 10px 10px}
  .brand{padding:10px 0;font-size:14px}
  .lang a{padding:6px 9px}
  .page{padding:14px 12px 24px}
  h1{font-size:18px;line-height:1.3}h2{font-size:15px}
  .meta{font-size:12px;margin-bottom:12px}
  .stats{gap:8px;margin-bottom:12px}
  .stat{padding:8px 10px}.stat .value{font-size:20px}.stat .label,.stat .note{font-size:11.5px}
  .card{padding:12px;border-radius:8px;margin-bottom:12px}
  .card>.tw{margin:0 -12px;border-top:1px solid var(--rule)}
  .card>.tw:first-child{margin-top:-12px;border-top:0;border-radius:8px 8px 0 0}
  .admin .lbl{display:none}
  .card>h2+.tw,.card>h2+.muted+.tw{margin-top:8px}
  th,td{padding:5px 6px}
  td{font-size:13px}
  table.kr th.vs{height:110px}table.kr th.vs span{max-height:100px}
  .legend{font-size:11.5px}
  .login{margin-top:4vh}
  .login input{font-size:16px}
}
th .w2{display:inline-block;white-space:normal;min-width:64px;max-width:120px;line-height:1.25}

/* Белсенділік пен пікір: колонка месяца, «нет предмета / уроков», комментарии в скобках */
table.gr td.mo,table.gr th.mo{background:var(--h);font-weight:700}
table.gr td.na{background:var(--h);color:var(--faint)}
table.gr td.r{font-weight:600}
table.gr .cm{color:var(--faint);font-size:11px;font-weight:400}
table.gr td.miss{color:var(--r-ink)}
table.gr td.key.r{background:var(--r);color:var(--r-ink)}table.gr td.key.y{background:var(--y);color:var(--y-ink)}
table.gr tr.th td{background:var(--h);font-weight:600;text-align:left}
table.gr td.num.r{background:var(--r);color:var(--r-ink)}table.gr td.num.y{background:var(--y);color:var(--y-ink)}
table.gr td.y{background:var(--y);color:var(--y-ink)}table.gr td.r{background:var(--r);color:var(--r-ink)}
.months .muted{align-self:center;margin-right:2px}

/* Домашние задания: четвёртый уровень нормы — оранжевый (10–24%), зелёный в ключевой колонке */
.chip.o{background:var(--o);color:var(--o-ink)}.stat.o .value{color:var(--o-ink)}
table.gr td.o,table.gr td.num.o,table.gr td.key.o{background:var(--o);color:var(--o-ink)}
table.gr td.key.g,table.gr td.num.g{background:var(--g);color:var(--g-ink)}
table.gr td.key .cm{font-size:11px}
.pform{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 12px}.pform label{color:var(--soft);font-size:13px}
.pform .inp{min-width:220px}
.tw.nost{direction:ltr}
.tw.nost th:first-child,.tw.nost td:first-child{position:static;box-shadow:none}
.tw.nost tr.th td:first-child{background:var(--h)}
table.gr td.g{background:var(--g);color:var(--g-ink)}table.gr td.key.g,table.gr td.num.g{background:var(--g);color:var(--g-ink)}
.stat.key.g .value{color:var(--g-ink)}.stat.key.y .value{color:var(--y-ink)}.stat.key.r .value{color:var(--r-ink)}
/* сортировка по клику на заголовок (tsort.py) */
th a.so{color:inherit;text-decoration:none;display:inline-block}
th a.so:hover{color:var(--accent)}
th a.so.on{color:var(--ink)}
th a.so .ar{font-style:normal;font-size:9px;margin-left:3px;vertical-align:1px}
table.kr th.vs a.so{display:inline-flex;flex-direction:column;align-items:center}