/* Generated by scripts/split_platform_styles.py; edit frontend/platform-styles. */
/* SkillMetric feature presentation. Shared primitives/shell live in design-system.css. */
.main {min-width: 0;}
.search {min-width: 260px; max-width: 380px;}
@media (max-width: 640px) {
.search {min-width: 100%;}}
.success-text {align-items: center;}
.shell {min-height: 100svh; display: flex; min-width: 0; flex-direction: column;}
.main {flex: 1; width: 100%; min-width: 0; display: flex; flex-direction: column;}
thead th {color: var(--ds-text-secondary); background: var(--ds-surface-subtle); border-color: var(--ds-border); font-size: 12px; text-transform: uppercase; letter-spacing: .045em;}
tbody td {border-color: var(--ds-border); vertical-align: middle;}
.table-primary {display: grid; gap: 3px;}
.table-primary > strong,
.table-primary > a {color: var(--ds-text); font-weight: 700;}
.table-secondary {color: var(--ds-text-secondary); font-size: 13px; line-height: 1.4;}
.admin-author-avatar,
.author-editor-photo {overflow: hidden;
  background: linear-gradient(145deg, #e4f7f2, #f5faf8);
  border: 1px solid #cce7df;}
.admin-author-avatar img,
.author-editor-photo img {width: 100%; height: 100%; object-fit: cover;}
.mono {font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;}
.check-row {display: flex; align-items: flex-start; gap: 10px; padding: 12px 13px; background: var(--ds-surface-subtle); border: 1px solid var(--ds-border); border-radius: var(--ds-radius-md); cursor: pointer;}
.check-row input {width: 18px; height: 18px; margin-top: 1px; accent-color: var(--ds-accent);}
.check-row > span {display: grid; gap: 3px;}
.check-row small {line-height: 1.4;}
.content {padding: 30px; max-width: 1440px; margin: 0 auto;}
.module-label {font-size: 11px; text-transform: uppercase; letter-spacing: .05em; font-weight: 800; color: var(--ds-text-muted); margin: 18px 8px 7px;}
.block-actions {display: flex; justify-content: flex-end; margin-top: 14px;}
@media (max-width: 1000px) {
.content {padding: 20px 16px;}}
@media (max-width: 640px) {
.content {padding-top: 18px;}}
.spinner {width: 16px; height: 16px; border-radius: 50%; border: 2px solid rgba(56,103,242,.25); border-top-color: var(--ds-accent); animation: spin .75s linear infinite;}
.module-lessons {padding-bottom:5px;}
.success-text {color:#2c7659; font-weight:700;}
@media (max-width: 760px) {
.continue-learning,
.course-complete-banner,
.lesson-footer-nav {align-items:flex-start; flex-direction:column;}}
.content {width: 100%;
  max-width: 1680px;
  padding-inline: clamp(18px, 2.2vw, 40px);}
@media (min-width: 1560px) {
.content {max-width: 1760px;}}
@media (max-width: 1180px) {
.content {padding-inline: 22px;}}
@media (max-width: 760px) {
.content {padding: 16px 14px 28px;}}
@media (max-width: 380px) {
.content {padding-inline: 10px;}}
.inline-code {display: inline;
  padding: .16em .42em .18em;
  border: 1px solid #cdd8ff;
  border-radius: 7px;
  background: linear-gradient(180deg, #f4f6ff 0%, #edf1ff 100%);
  color: #4054b8;
  box-shadow: inset 0 -1px 0 rgba(64, 84, 184, .08), 0 1px 2px rgba(30, 41, 59, .05);
  font-family: "Cascadia Code", "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size: .9em;
  font-weight: 650;
  line-height: 1.35;
  letter-spacing: -.01em;
  overflow-wrap: anywhere;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;}
mark {padding: .05em .18em;
  border-radius: 4px;
  background: #fff0a6;
  color: inherit;}
.check-marker {flex: 0 0 20px;
  width: 20px;
  height: 20px;
  margin-top: 3px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1.5px solid #b6c2d2;
  border-radius: 6px;
  background: white;
  color: white;
  font-size: 12px;
  font-weight: 900;}
.check-marker.checked {border-color: var(--ds-success); background: var(--ds-success);}
.nested-list {margin: 8px 0 2px; padding-left: 1.3rem;}
.nested-list li {margin: 5px 0;}
.learning-outcomes {margin-top: 18px;
  padding: 15px 17px;
  border: 1px solid #dce5f1;
  border-radius: 14px;
  background: #f8faff;}
.learning-outcomes > strong {display: block; margin-bottom: 8px; color: #26354d;}
.learning-outcomes ul {margin: 0; padding-left: 1.2rem;}
.learning-outcomes li {margin: 5px 0; color: #475569;}
.progress-summary-grid {display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 10px; margin-bottom: 18px;}
.progress-summary-grid > div {padding: 14px; border: 1px solid var(--ds-border); border-radius: 12px; background: #f8fafc;}
.progress-summary-grid span {display: block; color: var(--ds-text-muted); font-size: 12px;}
.progress-summary-grid strong {display: block; margin-top: 4px; font-size: 22px;}
body.drawer-open {overflow: hidden;}
@media (max-width: 760px) {
.progress-summary-grid {grid-template-columns: repeat(2, minmax(0,1fr));}}
@media (max-width: 520px) {
.progress-summary-grid {grid-template-columns: 1fr 1fr;}
.learning-outcomes {padding: 13px 14px;}}
[hidden] {display: none !important;}
.sr-only {position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;}
:where(button, a, input, select, textarea, summary, [tabindex]):focus-visible {outline: 3px solid rgba(56, 103, 242, .32);
  outline-offset: 2px;}
.quiz-feedback-title .ui-icon,
.success-text .ui-icon {width: 14px; height: 14px;}
.math-inline-source {white-space: nowrap;}
.math-display-source,
.latex-formula-render,
mjx-container[display="true"] {max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;}
.math-display-source,
.latex-formula-render {padding: 8px 2px;}
mjx-container {line-height: 1.2;}
mjx-container svg {max-width: none;}
.teacher-course-card,
.teacher-student-card,
.admin-teacher-card {border: 1px solid var(--border, #d8dee8);
  border-radius: 14px;
  padding: 16px;
  background: var(--surface, #fff);
  min-width: 0;}
.content {width: min(1440px, 100%); max-width: 1440px; margin: 0 auto; padding: 38px 28px 48px; flex: 1;}
.module-label {font-size: 12px;}
.learning-outcomes {background: #f0f5eb; border-color: #dde8d5;}
.learning-outcomes > strong {color: #375640;}
.learning-outcomes li {color: #53674e;}
.inline-code {background: #edf3e8; border-color: #dbe6d1; color: #536b41;}
@media (max-width: 760px) {
.content {padding: 26px 18px 36px;}}
.content,
.standalone-course-content,
.course-reader,
.course-nav,
.lesson-card,
.reader-head,
.question,
.practice,
.quiz,
.learning-outcomes,
.collapsible-block,
.media-group,
.download-block {color: var(--ds-text);}
@keyframes spin { to { transform: rotate(360deg); } }

/* Course JSON 2.1 — изолированные custom web blocks */
.custom-web-block { display: grid; gap: 6px; min-width: 0; margin: 12px 0; }
.custom-web-block-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.custom-web-block-head strong { min-width: 0; overflow-wrap: anywhere; }
.custom-web-frame { display: block; width: 100%; min-width: 0; min-height: 120px; border: 1px solid var(--ds-border); border-radius: var(--ds-radius-md, 12px); background: #fff; }
.custom-web-error { padding: 10px 12px; border: 1px solid color-mix(in srgb, var(--ds-danger, #b42318) 28%, var(--ds-border)); border-radius: var(--ds-radius-md, 12px); background: color-mix(in srgb, var(--ds-danger, #b42318) 8%, #fff); color: var(--ds-danger, #b42318); font-size: 13px; line-height: 1.45; }
@media (max-width: 760px) {
  .custom-web-frame { border-radius: 10px; }}
.essay-answer,.code-runner-answer {width:100%; min-height:180px; resize:vertical;}
.file-upload-question {display:grid; gap:10px; margin-top:12px;}
.file-upload-picker {display:flex; align-items:center; justify-content:center; min-height:52px; padding:10px 14px; border:2px dashed var(--ds-border); border-radius:12px; cursor:pointer; background:var(--ds-surface);}
.file-upload-picker input {position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0);}
.file-upload-picker:focus-within {outline:3px solid var(--ds-accent-soft); outline-offset:2px;}

@media (max-width: 760px) {
  [data-course-progress-modal] .table-wrap > table {display: block; width: 100%; min-width: 0;}
  [data-course-progress-modal] .table-wrap thead {position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;}
  [data-course-progress-modal] .table-wrap tbody {display: grid; gap: 10px; padding: 10px;}
  [data-course-progress-modal] .table-wrap tbody tr {display: grid; gap: 10px; min-width: 0; padding: 12px; border: 1px solid var(--ds-border); border-radius: 12px;}
  [data-course-progress-modal] .table-wrap tbody td {display: block; min-width: 0; padding: 0; border: 0; overflow-wrap: anywhere;}
  [data-course-progress-modal] .table-wrap tbody td::before {content: attr(data-label); display: block; margin-bottom: 4px; color: var(--ds-text-muted); font-size: 11px; font-weight: 800; letter-spacing: .045em; text-transform: uppercase;}}
.quiz > fieldset[data-assessment-preview], .qb-preview-question { border: 0; padding: 0; margin: 0; min-width: 0; }
/* Bounded, searchable collections across role workspaces. */
.collection-pagination {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; padding:12px 0 18px; min-width:0;}
.collection-page-controls, .collection-page-jump, .collection-page-size {display:flex; align-items:center; gap:8px; min-width:0;}
.collection-page-controls {flex-wrap:wrap;}
.collection-page-jump {flex-shrink:0;}
.collection-page-jump > span {white-space:nowrap;}
.collection-page-jump > input {width:64px; min-width:64px; text-align:center;}
.collection-page-size > select {width:80px;}
.collection-filter-bar, .collection-secondary-filters {display:flex; flex-wrap:wrap; gap:10px; align-items:center;}
.collection-filter-bar > select, .collection-secondary-filters > select {width:auto; max-width:240px;}
.collection-picker {display:grid; gap:8px; min-width:0;}
.collection-picker .collection-pagination {padding:0; gap:8px;}
.collection-picker .collection-page-controls {flex-wrap:wrap;}
.collection-picker .collection-range {font-size:11px;}
@media (max-width: 760px) {
  .collection-filter-bar > select, .collection-secondary-filters > select {flex:1 1 140px; max-width:none; min-width:0;}}
@media (max-width: 520px) {
  .collection-pagination {gap:10px;}
  .collection-range {flex-basis:100%;}
  .collection-page-controls {width:100%; justify-content:space-between;}
  .collection-page-jump {gap:5px;}
  .collection-page-jump > span:first-child {display:none;}
  .collection-page-jump > input {width:54px; min-width:54px;}
  .collection-page-size {margin-left:auto;}
  .collection-picker .collection-page-controls {gap:6px;}
  .collection-picker .collection-page-jump > span:first-child {display:none;}}

.collection-filter-toolbar {display:flex; flex-wrap:wrap; align-items:center; gap:10px;}
.collection-filter-toolbar > input {flex:1 1 260px; min-width:0; width:auto;}
.collection-filter-toolbar > select {width:auto; max-width:240px;}
.collection-advanced-filters {margin:10px 0;}
.collection-date-range {display:flex; flex-wrap:wrap; gap:12px; padding:12px 0;}
[data-teacher-panel][hidden], #teacherDirectory[hidden] {display:none;}
@media (max-width: 640px) {
  .collection-filter-bar > .course-catalog-search, .course-admin-search, .collection-filter-toolbar > input {flex:0 0 auto; width:100%;}
  .collection-filter-toolbar > select {width:100%; max-width:none;}}

.collection-filter-options {min-width:0;}
.collection-filter-options-body {display:flex; flex-wrap:wrap; align-items:center; gap:10px; min-width:0;}
.collection-filter-options-body > select {width:auto; max-width:240px;}
@media (min-width: 641px) {
  .collection-filter-options[open] > summary {display:none;}
  .collection-filter-options {display:contents;}}
@media (max-width: 640px) {
  .collection-filter-bar {display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center;}
  .collection-filter-bar > select, .collection-secondary-filters > select {flex:0 0 auto; width:100%; max-width:none;}
  .collection-filter-options[open] {grid-column:1/-1;}
  .collection-filter-options-body {flex-direction:column; align-items:stretch; margin-top:12px;}
  .collection-filter-options-body > select {flex:0 0 auto; width:100%; max-width:none;}}
[data-analytics-assessments], .analytics-assessment-card, .analytics-history-section {min-width:0; max-width:100%;}
@keyframes sm-feedback-in {from {opacity: .72;} to {opacity: 1;}}

/* Stable media frames. Course JSON metadata supplies the original aspect ratio. */
.content:empty + .platform-footer {visibility:hidden;}