/*
 * Start / mobile-first
 *
 * Jedyny właściciel mobilnej kompozycji Startu. Desktop i tablet pozostają
 * w margines-start.css. Pełny spis jest dostępny bez utraty funkcji.
 */

body.student-dashboard-page .start-index-details {
  display: block;
}

body.student-dashboard-page .start-index-toggle {
  display: none;
}

@media (max-width: 720px) {
  body.student-dashboard-page .start-notebook::before {
    display: none;
  }

  body.student-dashboard-page .start-decision {
    min-height: 370px;
    padding: 34px 22px 28px 30px;
    background:
      linear-gradient(90deg, transparent 0 28px, rgba(117, 102, 164, .12) 28px 29px, transparent 29px),
      var(--notebook-paper);
  }

  body.student-dashboard-page .start-decision h1 {
    max-width: 11ch;
    margin-top: 12px;
  }

  body.student-dashboard-page .start-verdict {
    margin-bottom: 22px;
  }

  body.student-dashboard-page .start-folio {
    top: 342px;
  }

  body.student-dashboard-page .start-register {
    padding: 24px 20px 22px 30px;
    background: var(--notebook-paper-soft);
  }

  body.student-dashboard-page .start-register header {
    display: flex;
    padding-bottom: 14px;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;
  }

  body.student-dashboard-page .start-register header strong {
    max-width: 19ch;
    font-size: 1.05rem;
    text-align: right;
  }

  body.student-dashboard-page .register-score {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto auto;
    gap: 7px 18px;
    padding: 18px 0 16px;
    align-items: end;
  }

  body.student-dashboard-page .register-score > span:first-child {
    grid-row: 1 / 3;
    font-size: clamp(2.7rem, 13vw, 3.35rem);
  }

  body.student-dashboard-page .register-score p {
    margin: 0;
    align-self: end;
    font-size: .66rem;
    letter-spacing: .02em;
    text-transform: none;
  }

  body.student-dashboard-page .register-score .trace-meter,
  body.student-dashboard-page .register-score .trace-meter-empty {
    width: 100%;
    margin: 0;
    align-self: start;
  }

  body.student-dashboard-page .register-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  body.student-dashboard-page .register-metrics div,
  body.student-dashboard-page .register-metrics div + div {
    padding: 11px 8px;
    border-top: 0;
    border-left: 1px solid rgba(23, 18, 24, .12);
  }

  body.student-dashboard-page .register-metrics div:first-child {
    padding-left: 0;
    border-left: 0;
  }

  body.student-dashboard-page .register-metrics dt {
    font-size: var(--pismo-mikro);
    letter-spacing: .01em;
    text-transform: none;
  }

  body.student-dashboard-page .register-metrics dd {
    margin-top: 5px;
    font-size: 1.05rem;
  }

  body.student-dashboard-page .profile-switcher-compact {
    margin-top: 18px;
    padding-top: 0;
  }

  body.student-dashboard-page .register-link {
    margin-top: 12px;
  }

  body.student-dashboard-page .start-notebook > .material-index {
    margin-top: 12px;
    padding-bottom: 34px;
  }

  body.student-dashboard-page .material-index .index-heading {
    padding: 20px 18px 16px;
  }

  body.student-dashboard-page .material-index .index-heading h2 {
    font-size: clamp(1.85rem, 10vw, 2.55rem);
  }

  body.student-dashboard-page .material-index .index-heading > p {
    max-width: 24ch;
    font-size: .78rem;
  }

  body.student-dashboard-page .start-index-details {
    border-top: 1px solid var(--linia-mocna);
  }

  body.student-dashboard-page .start-index-toggle {
    display: flex;
    min-height: 58px;
    padding: 11px 18px;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    cursor: pointer;
    color: var(--notebook-ink);
    list-style: none;
  }

  body.student-dashboard-page .start-index-toggle::-webkit-details-marker {
    display: none;
  }

  body.student-dashboard-page .start-index-toggle > span {
    display: grid;
    gap: 3px;
  }

  body.student-dashboard-page .start-index-toggle strong {
    font: 650 .82rem/1.2 var(--display);
  }

  body.student-dashboard-page .start-index-toggle small {
    color: var(--notebook-muted);
    font: .72rem/1.3 var(--display);
  }

  body.student-dashboard-page .start-index-toggle i {
    position: relative;
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
  }

  body.student-dashboard-page .start-index-toggle i::before,
  body.student-dashboard-page .start-index-toggle i::after {
    position: absolute;
    top: 8px;
    left: 3px;
    width: 12px;
    height: 1px;
    background: currentColor;
    content: "";
    transition: transform var(--motion-fast);
  }

  body.student-dashboard-page .start-index-toggle i::after {
    transform: rotate(90deg);
  }

  body.student-dashboard-page .start-index-details[open] .start-index-toggle i::after {
    transform: rotate(0);
  }

  body.student-dashboard-page .start-index-details:not([open]) + .material-folio {
    bottom: 12px;
  }
}

@media (max-width: 430px) {
  body.student-dashboard-page .start-decision,
  body.student-dashboard-page .start-register {
    padding-right: 18px;
  }

  body.student-dashboard-page .profile-control {
    grid-template-columns: minmax(0, 1fr) auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.student-dashboard-page .start-index-toggle i::after {
    transition: none;
  }
}