:root{font-family:Arial,Helvetica,sans-serif;color:#182a39;background:#f7f8fa;font-synthesis:none;--muted:#64717e;--line:#e0e5ea;--blue:#2855c5;--lime:#d3ef9c}
*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}button,select,input{font:inherit}button,a,select,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:3px solid #2855c5;outline-offset:5px}button:disabled,select:disabled{opacity:.55;cursor:wait}.wrap{width:min(1160px,calc(100% - 80px));margin-inline:auto}.header{height:105px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:24px}.brand{display:flex;align-items:center;gap:12px;font-size:19px;letter-spacing:2px;font-weight:800}.brand-mark{width:38px;height:38px;display:flex;align-items:center;justify-content:center;background:#182a39;color:white;border-radius:10px;font-size:27px;letter-spacing:-3px;padding-right:4px}.brand-mark span{color:var(--lime)}nav{display:flex;gap:32px}.nav-link{font-size:14px;color:var(--muted);padding:14px 0}.nav-link:hover,.nav-link.active{color:#182a39}.nav-link.active{border-bottom:2px solid #182a39}.environment{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12px}.environment>span{width:6px;height:6px;border-radius:50%;background:#709a3f}.hero{position:relative;padding:79px 0 74px;min-height:483px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700;color:var(--muted);margin:0 0 22px}.hero h1{font-size:clamp(40px,5vw,62px);line-height:1.07;letter-spacing:-2.8px;margin:0;font-weight:700}.hero h1>span{color:var(--blue)}.hero-copy{font-size:16px;line-height:1.7;color:var(--muted);margin:24px 0 29px}.button{display:inline-flex;align-items:center;justify-content:center;gap:28px;padding:15px 21px;border:1px solid transparent;border-radius:7px;font-size:13px;font-weight:600;min-height:46px}.button span{font-size:20px;line-height:14px}.primary{background:#182a39;color:#fff}.primary:hover{background:#2c4355}.hero-caption{display:block;color:var(--muted);font-size:11px;margin-top:13px}.hero-art{position:absolute;right:0;top:55px;width:365px;height:365px;overflow:hidden;border-radius:22px;background:#e6edf7;border:1px solid #d8e1ed}.art-label{position:absolute;left:28px;top:26px;letter-spacing:2px;font-size:13px;font-weight:bold}.art-grid{position:absolute;inset:80px 30px 72px;background:linear-gradient(#cdd7e666 1px,transparent 1px),linear-gradient(90deg,#cdd7e666 1px,transparent 1px);background-size:38px 38px}.art-bars{position:absolute;left:53px;right:49px;bottom:80px;height:185px;display:flex;align-items:end;gap:12px;transform:skewY(-8deg)}.art-bars i{flex:1;background:#2855c5;border-radius:7px 7px 2px 2px;height:38%;box-shadow:6px 8px 0 #c7d4e9}.art-bars i:nth-child(2){height:52%;background:#6283d7}.art-bars i:nth-child(3){height:69%;background:#406bd0}.art-bars i:nth-child(4){height:83%;background:#2855c5}.art-bars i:nth-child(5){height:100%;background:#c4e98c}.orbit{position:absolute;width:350px;height:350px;border:1px solid #d4deec;border-radius:50%;top:-115px;right:-130px}.orbit-two{width:270px;height:270px;top:-75px;right:-90px}.art-caption{position:absolute;bottom:26px;left:28px;right:28px;font-size:9px;letter-spacing:1.5px;display:flex;justify-content:space-between}.art-caption span{font-size:20px}.module-section{padding:18px 0 0}.section-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:24px}.section-heading .eyebrow{margin-bottom:10px}.section-heading>.muted{font-size:12px}h2{font-size:25px;letter-spacing:-.5px;margin:0}.muted{color:var(--muted)}.module-card{background:#fff;border:1px solid var(--line);border-radius:13px;padding:32px;display:flex;align-items:center;gap:27px;transition:border-color .15s,box-shadow .15s}.module-card:hover{border-color:#9caecd;box-shadow:0 6px 20px #182a3908}.module-icon{width:85px;height:85px;background:#edf2fb;color:#2855c5;border-radius:18px;display:grid;place-items:center;font-size:45px;flex-shrink:0}.pill{display:inline-flex;align-items:center;border:1px solid #d7e4c5;background:#f1f7e7;color:#4b652c;padding:5px 9px;border-radius:5px;font-size:10px;font-weight:600;white-space:nowrap}.module-description h3{font-size:22px;letter-spacing:-.5px;margin:10px 0}.module-description p{font-size:14px;line-height:1.6;color:var(--muted);margin:0 0 17px}.module-tags{font-size:11px;color:var(--muted)}.module-tags span{padding:0 10px}.card-arrow{margin-left:auto;border:1px solid var(--line);width:40px;height:40px;display:grid;place-items:center;border-radius:50%;font-size:22px;flex-shrink:0}.next-step{display:flex;gap:18px;align-items:center;padding:24px 0 40px;color:var(--muted)}.next-step p{font-size:12px;line-height:1.8;margin:0}.next-step strong{font-weight:500;color:#344658}.small-symbol{width:34px;height:34px;display:grid;place-items:center;border:1px dashed #b6c2cc;border-radius:8px;font-size:22px}.footer{border-top:1px solid var(--line);padding-block:23px;display:flex;justify-content:space-between;color:var(--muted);font-size:10px;line-height:1.6;gap:20px}.footer-slash{padding:0 12px;color:#b0bbc4}.skip-link{position:absolute;top:-80px;left:20px;z-index:10;background:white;padding:15px}.skip-link:focus{top:10px}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.dashboard{padding-top:30px;padding-bottom:45px}.back-link{font-size:12px;color:var(--muted)}.back-link:hover{color:var(--blue)}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:33px 0 27px}.page-heading .eyebrow{margin-bottom:12px}.page-heading h1{font-size:34px;letter-spacing:-1.1px;line-height:1.2;margin:0}.page-heading p.muted{font-size:14px;margin:12px 0 0}.notice{padding:15px 20px;background:#edf2fb;border:1px solid #dce5f4;border-radius:9px;display:flex;gap:15px;align-items:center;color:#435673;font-size:12px;line-height:1.7}.notice p{margin:0}.notice strong{font-weight:600}.notice-icon{display:grid;place-items:center;border:1px solid #7f95b7;width:21px;height:21px;border-radius:50%;font-weight:bold;flex-shrink:0}.toolbar{display:flex;align-items:end;justify-content:space-between;gap:20px;margin:27px 0 22px}.field{display:grid;gap:9px}.field label{font-size:11px;color:var(--muted)}select{min-width:230px;border:1px solid #cfd8e1;background:white;color:#182a39;padding:12px 14px;border-radius:7px;min-height:46px}.secondary{background:#fff;border-color:#cfd8e1}.secondary:hover{background:#edf2fb}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:30px}.metric{border:1px solid var(--line);border-radius:10px;background:white;padding:22px}.metric>span{font-size:12px;color:#53616d}.metric strong{display:block;font-size:36px;line-height:1.1;letter-spacing:-1px;margin:19px 0 13px;font-weight:600}.metric small{font-size:10px;color:var(--muted)}.metric.accent{background:#f0f5e8;border-color:#dbe6ca}.results{border:1px solid var(--line);border-radius:12px;background:white;overflow:hidden}.results-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px 24px 8px}.results-heading h2{font-size:19px}.checkbox{display:flex;align-items:center;gap:8px;font-size:12px;line-height:1.5;cursor:pointer}.checkbox input{width:16px;height:16px;accent-color:var(--blue)}.table-status{font-size:11px;color:var(--muted);padding:0 24px;margin:8px 0 22px}.table-scroll{overflow-x:auto}table{width:100%;border-collapse:collapse;text-align:left;font-size:12px;white-space:nowrap}thead{background:#f7f9fb;color:#64717e}th,td{padding:16px 17px;border-bottom:1px solid #edf0f3}thead th{font-weight:500;font-size:10px}th:first-child,td:first-child{padding-left:24px}.student-name{font-weight:500}.grade{text-align:center;font-variant-numeric:tabular-nums}.low{color:#a14534;font-weight:700}.status{display:inline-block;font-size:10px;padding:5px 8px;border-radius:4px}.status.clear{background:#eef4e7;color:#4d6733}.status.debt{background:#fff0e9;color:#9b4935}.table-note{padding:17px 24px;margin:0;color:var(--muted);font-size:10px;line-height:1.8;max-width:900px}.error{background:#fff0e9;color:#9b4935;padding:16px;border-radius:8px;font-size:13px}.error[hidden]{display:none}
@media(min-width:1400px){.hero{padding-top:92px;padding-bottom:90px}.hero-art{top:65px}}@media(max-width:1000px){.hero-art{width:280px;height:325px;top:70px}.art-bars{left:34px;right:34px;gap:9px}.hero h1{font-size:49px}.hero-copy{max-width:430px}.desktop-break{display:none}.environment{display:none}.metrics{grid-template-columns:repeat(2,1fr)}.metric{padding:20px}.page-heading h1{font-size:29px}}
@media(max-width:740px){.wrap{width:calc(100% - 36px)}.header{height:85px;gap:16px}.brand{font-size:14px;letter-spacing:1.2px;gap:8px}.brand-mark{width:30px;height:30px;font-size:23px;border-radius:8px}nav{gap:17px}.nav-link{font-size:11px}.hero{padding:48px 0 32px;min-height:auto}.hero h1{font-size:44px;letter-spacing:-1.8px}.hero-art{position:relative;top:auto;right:auto;width:100%;height:240px;margin-top:33px}.art-bars{left:27%;right:20%;bottom:57px;height:140px;gap:13px}.art-caption{bottom:19px}.art-grid{inset:50px 30px}.hero-copy{font-size:15px}.section-heading>.muted{font-size:10px}.module-card{padding:23px 19px;gap:15px;align-items:start}.module-icon{width:44px;height:44px;border-radius:10px;font-size:29px}.module-description h3{font-size:19px;line-height:1.3}.module-description p{font-size:12px}.module-tags{font-size:10px}.module-tags span{padding:0 4px}.card-arrow{display:none}.module-section{padding-top:10px}.next-step{padding:22px 0 30px}.footer{flex-direction:column;gap:7px;padding-block:19px}.page-heading{align-items:start;margin-top:25px}.page-heading h1{font-size:27px}.page-heading>.pill{display:none}.toolbar{align-items:stretch;flex-direction:column;gap:14px}.toolbar .button{align-self:start}select{width:100%}.metrics{gap:10px}.metric{padding:17px 13px}.metric>span{font-size:11px}.metric strong{font-size:31px;margin-block:15px 9px}.metric small{font-size:9px}.results-heading{align-items:start;flex-direction:column;padding:20px 16px 8px;gap:14px}.table-status{padding-inline:16px}.table-note{padding:16px}.notice{padding:14px}.eyebrow{font-size:9px;letter-spacing:1.5px}}

#collection {
  margin-bottom: 22px;
}
#collect-cancel[hidden] {
  display: none;
}
#collect-groups {
  margin-left: 1.4rem;
  padding-top: 0;
}
#collect-groups li {
  margin-block: 0.25rem;
}

#owner-account {
  max-width: 520px;
  padding-top: 14px;
}
#collection[hidden],
#monitoring-login[hidden],
#admin-login[hidden],
.account-form[hidden] {
  display: none;
}
.account-form {
  display: grid;
  gap: 12px;
  padding: 0 24px 20px;
}
#kab-credentials {
  padding: 0;
}
.account-form .button {
  justify-self: start;
}
.account-form input {
  box-sizing: border-box;
  width: min(100%, 420px);
  font: inherit;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
}
#monitoring-login a {
  text-decoration: underline;
}
.header-account {
  padding: 8px 12px;
  min-height: 36px;
  max-width: min(22ch, 38vw);
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
[data-admin-link][hidden] {
  display: none;
}
.header nav {
  flex-wrap: wrap;
}
.admin-panel > section + section {
  margin-top: 20px;
}
.module-card + .module-card {
  margin-top: 14px;
}
@media (max-width: 480px) {
  .header {
    display: grid;
    grid-template-columns: 1fr auto;
    height: auto;
    padding-top: 12px;
    gap: 2px 12px;
  }
  .header nav {
    grid-column: 1 / -1;
    grid-row: 2;
  }
  .header-account {
    grid-column: 2;
    grid-row: 1;
  }
}

#gradebook {
  margin-top: 26px;
}
.gradebook-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 14px 0;
}
.gradebook-tabs button {
  padding: 9px 13px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  color: inherit;
}
.gradebook-tabs button[aria-selected="true"] {
  background: #182a39;
  color: #fff;
}
#gradebook [role="tabpanel"][hidden] {
  display: none;
}
#saved-grades .results-heading h3 {
  margin: 0;
  font-size: 19px;
}
.interim-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 8px;
  margin: 0 0 16px;
}
.interim-summary[hidden] {
  display: none;
}
.interim-summary > div {
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #f7f9fb;
}
.interim-summary dt {
  font-size: 12px;
  color: var(--muted);
}
.interim-summary dd {
  margin: 4px 0 0;
  font-size: 19px;
  font-weight: 600;
}
.organization-directory {
  padding: 20px 24px;
}
.organization-directory .table-status {
  padding: 0;
  margin-top: 0;
}
.organization-directory h2 {
  font-size: 20px;
  margin: 18px 0 12px;
}
.organization-directory ul {
  margin: 10px 0;
  padding-left: 18px;
  border-left: 1px solid var(--line);
  list-style: none;
}
.organization-directory li {
  margin: 10px 0;
}
.organization-directory small {
  display: inline-block;
  margin-left: 10px;
  color: var(--muted);
}
.organization-directory details {
  margin: 6px 0 0;
}
.organization-directory summary {
  color: var(--blue);
  cursor: pointer;
}
#organization-login[hidden] {
  display: none;
}
#weekly-report {
  margin-top: 20px;
}
.weekly-form {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 14px;
  padding: 10px 24px 14px;
}
.weekly-form label {
  display: grid;
  gap: 6px;
  font-size: 12px;
}
.weekly-form input {
  min-height: 46px;
  border: 1px solid #cfd8e1;
  border-radius: 7px;
  padding: 8px 10px;
  background: white;
}
#weekly-download[hidden] {
  display: none;
}
#metrics {
  grid-template-columns: repeat(2, minmax(0, 1fr)) minmax(0, 2fr);
}
.debt-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 12px 0 0;
}
.debt-metrics dt {
  color: var(--muted);
  font-size: 11px;
}
.debt-metrics dd {
  margin: 0;
}
.debt-metrics strong {
  margin: 6px 0 0;
}
.grade-filters {
  display: grid;
  grid-template-columns: minmax(120px, 1fr) minmax(140px, 1fr) auto auto;
  align-items: end;
}
.choice-filter {
  position: relative;
  min-width: 0;
}
.choice-filter summary {
  cursor: pointer;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
  padding: 9px 11px;
}
.choice-menu {
  position: absolute;
  z-index: 5;
  top: 100%;
  left: 0;
  width: max(100%, min(360px, 82vw));
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
  box-shadow: 0 4px 14px #15273620;
}
.choice-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 8px;
}
.choice-actions button {
  border: 1px solid var(--line);
  background: white;
  border-radius: 5px;
  padding: 4px 8px;
  font: inherit;
  cursor: pointer;
}
.grade-choices {
  display: grid;
  gap: 5px;
  max-height: 16rem;
  overflow-y: auto;
}
.grade-choices label {
  display: flex;
  align-items: start;
  gap: 6px;
}
.person-journals {
  min-width: 160px;
  max-width: 400px;
  white-space: normal;
}
.person-journals summary {
  cursor: pointer;
}
.person-journals > div {
  margin-top: 8px;
  max-height: 14rem;
  overflow-y: auto;
}
.person-journals p,
[hidden] { display: none !important; }
.organization-form {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  gap: 16px;
  padding-block: 18px;
}
.organization-form label, #course-panel label {
  display: grid;
  gap: 6px;
}
.organization-form input, .organization-form select, #course-panel select {
  width: 100%;
  min-width: 0;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #fff;
  color: inherit;
  font: inherit;
}
.organization-form textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  resize: vertical;
  font: inherit;
}
.organization-form .wide-field { grid-column: 1 / -1; }
.organization-form .checkbox { display: flex; align-items: center; gap: 10px; }
.organization-form input[type="checkbox"] { width: 16px; min-height: 16px; padding: 0; flex: 0 0 16px; }
.account-actions { display: flex; flex-wrap: wrap; align-items: end; gap: 12px; margin-block: 16px; }
.account-actions label { display: grid; gap: 6px; }
.document-text { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.6; padding-block: 12px; }
.organization-form button {
  align-self: end;
  justify-self: start;
}
.organization-form .table-note {
  margin: 0;
}
.organization-form fieldset {
  min-width: 0;
  padding: 16px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
}
#course-panel label {
  max-width: 480px;
}
#course-panel {
  padding: clamp(16px, 2vw, 24px);
}
#course-panel .table-status {
  padding: 0;
  margin: 8px 0 0;
}
.organization-form fieldset, .organization-form .table-note {
  grid-column: 1 / -1;
}
#period-group-names {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
}
.person-journals ul {
  margin: 2px 0 8px;
}
.person-journals ul {
  padding: 0;
  list-style: none;
  line-height: 1.5;
}
#saved-grades th:first-child {
  position: sticky;
  left: 0;
  background: #fff;
}
#saved-grades thead th:first-child {
  background: #f4f6f8;
}
thead th:has(.sort-header) {
  padding-block: 0;
}
.sort-header {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 7px;
  min-height: 44px;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
}
.sort-header:hover,
th[aria-sort] .sort-header {
  color: var(--blue);
}
.sort-header:focus-visible {
  outline-offset: -2px;
}
.sort-header span {
  font-size: 13px;
}
@media (max-width: 680px) {
  #metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .debt-metric {
    grid-column: 1 / -1;
  }
  .grade-filters {
    grid-template-columns: 1fr;
  }
  .grade-filters .button {
    justify-self: start;
  }
}

/* Личная ведомость: даты объединяют отдельные занятия, первый столбец остаётся видимым. */
.personal-toolbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.personal-matrix { width: max-content; min-width: 100%; }
.personal-matrix th, .personal-matrix td { min-width: 88px; text-align: center; }
.personal-matrix .matrix-discipline { position: sticky; left: 0; z-index: 1; min-width: 180px; max-width: 280px; white-space: normal; text-align: left; background: #fff; }
.personal-matrix thead .matrix-discipline { background: #f7f9fb; z-index: 2; }
.personal-matrix th[scope="colgroup"] { border-bottom: 1px solid var(--line); }
#personal-results { max-width: 100%; }
#saved-grades .student-name a { color: var(--blue); text-decoration: underline; text-underline-offset: 3px; white-space: normal; }
#saved-grades .student-name { min-width: 180px; }
.person-debts { text-align: left; white-space: normal; min-width: 130px; }
.person-debts summary { cursor: pointer; text-align: center; color: #a14534; font-weight: 700; }
.person-debts > div { width: min(300px, 65vw); max-height: 300px; overflow-y: auto; margin-top: 12px; line-height: 1.6; }
.person-debts ul { padding: 0; list-style: none; margin: 5px 0 14px; }
#person-page-status { margin: 16px 0; }

.page-heading:has(#personal-refresh) { flex-wrap: wrap; align-items: center; }

@media (max-width: 680px) {
  #personal-grades.organization-directory { padding: 16px 12px; }
  .personal-matrix .matrix-discipline { width: 160px; min-width: 160px; max-width: 160px; }
}
