main.tuning-page {
  padding-bottom: var(--space-8);
  background-color: var(--color-asphalt);
  background-image: linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
  background-size: 36px 36px;
}

.tuning-page .tuning-section {
  padding-top: var(--space-8);
}

.tuning-page .tuning-section + .tuning-section {
  padding-top: var(--space-8);
}

.tuning-page .tuning-section__head {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: var(--space-5);
  align-items: end;
  margin-bottom: var(--space-6);
}

.tuning-page .tuning-section__head > * {
  min-width: 0;
}

.tuning-page .tuning-section__intro {
  max-width: 66ch;
}

.tuning-page .tuning-section__intro > :last-child,
.tuning-page .tuning-section__note > :last-child {
  margin-bottom: 0;
}

.tuning-page .tuning-section__note {
  max-width: 36ch;
  justify-self: end;
  color: var(--color-steel);
  font-size: var(--text-compact);
}

.tuning-page .tuning-hero {
  padding-top: var(--space-6);
}

.tuning-page .tuning-hero__frame {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(300px, 5fr);
  gap: var(--space-5);
  min-height: 520px;
  overflow: hidden;
  border: var(--border-default);
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
  isolation: isolate;
}

.tuning-page .tuning-hero__media,
.tuning-page .tuning-hero__overlay {
  position: absolute;
  inset: 0;
  z-index: -2;
}

.tuning-page .tuning-hero__media img {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: 35% center;
}

.tuning-page .tuning-hero__overlay {
  z-index: -1;
  background: linear-gradient(90deg, rgba(10,10,12,.94) 0%, rgba(10,10,12,.78) 47%, rgba(10,10,12,.48) 100%);
}

.tuning-page .tuning-hero__copy,
.tuning-page .tuning-hero__verdict {
  min-width: 0;
  align-self: center;
}

.tuning-page .tuning-hero__copy {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  grid-column: 1;
  padding: var(--space-7);
}

.tuning-page .tuning-hero__copy > * {
  min-width: 0;
  margin: 0;
}

.tuning-page .tuning-hero__title {
  max-width: 18ch;
}

.tuning-page .tuning-hero__lead {
  max-width: 58ch;
  color: var(--color-paper);
  font-size: var(--text-lead);
  font-weight: 500;
  line-height: 1.4;
}

.tuning-page .tuning-hero__verdict {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  grid-column: 2;
  margin: var(--space-5);
  padding: var(--space-5);
  border: var(--border-default);
  background: rgba(18,18,21,.94);
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
  transition: border-color var(--transition-standard);
}

.tuning-page .tuning-hero__verdict:hover {
  border-color: var(--color-magenta);
}

.tuning-page .tuning-hero__verdict > * {
  min-width: 0;
  margin: 0;
}

.tuning-page .tuning-hero__priority {
  color: var(--color-yellow);
  font-family: var(--font-mono);
  font-size: clamp(1.5rem, 3vw, 2.35rem);
  font-weight: 700;
  letter-spacing: .05em;
  line-height: 1;
}

.tuning-page .tuning-hero__annotation {
  max-width: 34ch;
  color: var(--color-steel);
  font-size: var(--text-compact);
}

.tuning-page .tuning-meter-stack,
.tuning-page .tuning-profile__meters {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.tuning-page .tuning-meter-stack > *,
.tuning-page .tuning-profile__meters > * {
  min-width: 0;
}

.tuning-page .tuning-meter-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(96px, 1fr);
  gap: var(--space-3);
  align-items: center;
}

.tuning-page .tuning-meter-row > * {
  min-width: 0;
}

.tuning-page .tuning-meter {
  overflow: hidden;
}

.tuning-page .tuning-meter .meter__segment {
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 420ms ease;
}

.tuning-page .tuning-meter--revealed .meter__segment--active,
.tuning-page .tuning-meter--revealed .meter__segment--accent {
  transform: scaleX(1);
}

.tuning-page .tuning-download {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  align-items: flex-start;
}

.tuning-page .tuning-download > * {
  min-width: 0;
  margin: 0;
}

.tuning-page .tuning-download .button {
  width: 100%;
  min-height: 48px;
}

.tuning-page .tuning-download__link {
  font-size: var(--text-sm);
  font-weight: 700;
}

.tuning-page .tuning-criteria {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
}

.tuning-page .tuning-criteria > * {
  min-width: 0;
}

.tuning-page .tuning-criterion,
.tuning-page .tuning-profile,
.tuning-page .tuning-explore-card,
.tuning-page .tuning-check-item {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  min-width: 0;
  min-height: 100%;
  margin: 0;
}

.tuning-page .tuning-criterion > *,
.tuning-page .tuning-profile > *,
.tuning-page .tuning-explore-card > *,
.tuning-page .tuning-check-item > * {
  min-width: 0;
  margin: 0;
}

.tuning-page .tuning-card-number {
  color: var(--color-paper);
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: .08em;
}

.tuning-page .tuning-criterion::after {
  width: 72px;
  height: 2px;
  margin-top: auto;
  background: var(--color-magenta);
  content: "";
  transition: width var(--transition-standard), background-color var(--transition-standard);
}

.tuning-page .tuning-criterion:hover::after {
  width: 100%;
}

.tuning-page .tuning-readout {
  padding: var(--space-3);
  border-left: 2px solid var(--color-magenta);
  background: var(--color-track);
  color: var(--color-paper);
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: .07em;
  line-height: 1.5;
  text-transform: uppercase;
}

.tuning-page .tuning-method {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: var(--space-6);
  align-items: start;
}

.tuning-page .tuning-method > * {
  min-width: 0;
}

.tuning-page .tuning-method__copy {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  max-width: 68ch;
}

.tuning-page .tuning-method__copy > * {
  min-width: 0;
  margin: 0;
}

.tuning-page .tuning-method__lead {
  font-size: var(--text-lead);
  font-weight: 500;
  line-height: 1.4;
}

.tuning-page .tuning-trial {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  max-width: 50ch;
  padding: var(--space-4);
  border-left: 2px solid var(--color-magenta);
  background: rgba(18,18,21,.72);
}

.tuning-page .tuning-trial > * {
  min-width: 0;
  margin: 0;
}

.tuning-page .tuning-trial__steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-2);
  padding: 0;
  list-style: none;
}

.tuning-page .tuning-trial__steps > li {
  min-width: 0;
  color: var(--color-paper);
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: .06em;
  line-height: 1.45;
  text-transform: uppercase;
}

.tuning-page .tuning-method__media {
  width: 100%;
  min-width: 0;
  margin: 0;
}

.tuning-page .tuning-method__media img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.tuning-page .tuning-profiles {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
}

.tuning-page .tuning-profiles > * {
  min-width: 0;
}

.tuning-page .tuning-profile__tradeoff {
  margin-top: auto !important;
  padding-top: var(--space-3);
  border-top: 1px solid var(--color-edge);
  color: var(--color-steel);
  font-size: var(--text-compact);
}

.tuning-page .tuning-profile__tradeoff strong {
  display: block;
  margin-bottom: var(--space-1);
  color: var(--color-yellow);
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.tuning-page .tuning-diagnostic {
  border: var(--border-default);
  background: var(--color-carbon);
  overflow: hidden;
}

.tuning-page .tuning-diagnostic__row {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 5fr) minmax(0, 4fr);
  gap: var(--space-5);
  min-width: 0;
  padding: var(--space-5);
  border-bottom: 1px solid var(--color-edge);
}

.tuning-page .tuning-diagnostic__row:last-child {
  border-bottom: 0;
}

.tuning-page .tuning-diagnostic__row > * {
  min-width: 0;
}

.tuning-page .tuning-diagnostic__row--head {
  padding-block: var(--space-3);
  background: var(--color-track);
}

.tuning-page .tuning-diagnostic__row h3,
.tuning-page .tuning-diagnostic__row p {
  margin: 0;
}

.tuning-page .tuning-diagnostic__cell {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.tuning-page .tuning-diagnostic__cell > * {
  min-width: 0;
}

.tuning-page .tuning-diagnostic__tag {
  align-self: flex-start;
}

.tuning-page .tuning-car-context {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: var(--space-6);
  align-items: start;
}

.tuning-page .tuning-car-context > * {
  min-width: 0;
}

.tuning-page .tuning-car-context__media {
  margin: 0;
}

.tuning-page .tuning-car-context__media img {
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
}

.tuning-page .tuning-car-context__copy {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  max-width: 68ch;
}

.tuning-page .tuning-car-context__copy > * {
  min-width: 0;
  margin: 0;
}

.tuning-page .tuning-test-order {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  max-width: 46ch;
  padding: var(--space-4);
  border: var(--border-default);
  background: var(--color-track);
}

.tuning-page .tuning-test-order > * {
  min-width: 0;
  margin: 0;
}

.tuning-page .tuning-test-order ol {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-3);
  padding: 0;
}

.tuning-page .tuning-test-order li {
  min-width: 0;
  color: var(--color-paper);
  font-size: var(--text-compact);
}

.tuning-page .tuning-test-order li span {
  display: block;
  margin-bottom: var(--space-1);
  color: var(--color-yellow);
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: .08em;
}

.tuning-page .tuning-direction-link {
  align-self: flex-start;
  font-weight: 700;
}

.tuning-page .tuning-explore__head {
  max-width: 58ch;
  margin-bottom: var(--space-6);
}

.tuning-page .tuning-explore__head > :last-child {
  margin-bottom: 0;
}

.tuning-page .tuning-explore {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-5);
}

.tuning-page .tuning-explore > * {
  min-width: 0;
}

.tuning-page .tuning-explore-card__link {
  margin-top: auto !important;
  padding-top: var(--space-3);
  border-top: 1px solid var(--color-edge);
  font-weight: 700;
}

.tuning-page .tuning-checklist {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-5);
  padding: 0;
  list-style: none;
}

.tuning-page .tuning-checklist > * {
  min-width: 0;
}

.tuning-page .tuning-check-item__number {
  color: var(--color-yellow);
  font-family: var(--font-mono);
  font-size: var(--text-score);
  font-weight: 700;
  letter-spacing: .02em;
  line-height: 1;
}

.tuning-page .tuning-check-item__readout {
  margin-top: auto !important;
  padding-top: var(--space-3);
  border-top: 2px solid var(--color-yellow);
  color: var(--color-paper);
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: .06em;
}

.tuning-page .tuning-check-summary {
  max-width: 60ch;
  margin-top: var(--space-5);
  margin-bottom: 0;
  color: var(--color-steel);
}

.tuning-page .tuning-final {
  padding-bottom: var(--space-8);
}

.tuning-page .tuning-final__panel {
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(220px, 4fr);
  gap: var(--space-6);
  align-items: center;
  padding: var(--space-7);
  border: var(--border-default);
  background: var(--color-carbon);
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
}

.tuning-page .tuning-final__panel > * {
  min-width: 0;
}

.tuning-page .tuning-final__copy {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  max-width: 56ch;
}

.tuning-page .tuning-final__copy > * {
  min-width: 0;
  margin: 0;
}

.tuning-page .tuning-final__copy .button {
  align-self: flex-start;
  min-width: 260px;
  min-height: 48px;
}

.tuning-page .tuning-final__platform {
  color: var(--color-steel);
}

.tuning-page .tuning-final__note {
  max-width: 50ch;
  padding-top: var(--space-3);
  border-top: 2px solid var(--color-magenta);
  color: var(--color-steel);
  font-size: var(--text-sm);
}

.tuning-page .tuning-final__readout {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  min-width: 0;
  padding: var(--space-5);
  border-left: 1px solid var(--color-edge);
  color: var(--color-yellow);
  font-family: var(--font-mono);
  font-size: clamp(1.5rem, 3vw, 2.65rem);
  font-weight: 700;
  letter-spacing: .08em;
  line-height: 1;
  text-align: right;
}

@media (max-width: 959px) {
  .tuning-page .tuning-section__head {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-3);
  }

  .tuning-page .tuning-section__note {
    justify-self: start;
  }

  .tuning-page .tuning-criteria,
  .tuning-page .tuning-profiles {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tuning-page .tuning-criteria > :last-child,
  .tuning-page .tuning-profiles > :last-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 899px) {
  .tuning-page .tuning-hero__frame,
  .tuning-page .tuning-method,
  .tuning-page .tuning-car-context {
    grid-template-columns: minmax(0, 1fr);
  }

  .tuning-page .tuning-hero__frame {
    min-height: 0;
    overflow: visible;
    border: 0;
    clip-path: none;
  }

  .tuning-page .tuning-hero__media,
  .tuning-page .tuning-hero__overlay {
    position: relative;
    inset: auto;
    grid-column: 1;
    grid-row: 2;
  }

  .tuning-page .tuning-hero__media {
    height: auto;
    z-index: 0;
    overflow: hidden;
    border: var(--border-default);
  }

  .tuning-page .tuning-hero__media img {
    height: auto;
    aspect-ratio: 4 / 3;
    object-position: 38% center;
  }

  .tuning-page .tuning-hero__overlay {
    display: none;
  }

  .tuning-page .tuning-hero__copy {
    grid-column: 1;
    grid-row: 1;
    padding: 0;
  }

  .tuning-page .tuning-hero__verdict {
    grid-column: 1;
    grid-row: 3;
    margin: 0;
  }

  .tuning-page .tuning-method__media {
    grid-row: 2;
  }

  .tuning-page .tuning-method__copy {
    grid-row: 1;
  }

  .tuning-page .tuning-car-context__media {
    grid-row: 2;
  }

  .tuning-page .tuning-car-context__copy {
    grid-row: 1;
  }
}

@media (max-width: 819px) {
  .tuning-page .tuning-diagnostic {
    border: 0;
    background: transparent;
    overflow: visible;
  }

  .tuning-page .tuning-diagnostic__row {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: 18px;
    border: var(--border-default);
    background: var(--color-carbon);
    clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
  }

  .tuning-page .tuning-diagnostic__row--head {
    display: none;
  }

  .tuning-page .tuning-diagnostic__cell::before {
    color: var(--color-steel);
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: .08em;
    line-height: var(--line-label);
    text-transform: uppercase;
  }

  .tuning-page .tuning-diagnostic__cell--symptom::before { content: "Objaw"; }
  .tuning-page .tuning-diagnostic__cell--direction::before { content: "Kierunek"; }
  .tuning-page .tuning-diagnostic__cell--test::before { content: "Test"; }
}

@media (max-width: 779px) {
  .tuning-page .tuning-final__panel {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-5);
  }

  .tuning-page .tuning-final__readout {
    order: -1;
    flex-direction: row;
    flex-wrap: wrap;
    padding: 0 0 var(--space-3);
    border-left: 0;
    border-bottom: 1px solid var(--color-edge);
    font-size: var(--text-telemetry);
    text-align: left;
  }
}

@media (max-width: 679px) {
  .tuning-page .tuning-explore {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 559px) {
  .tuning-page .tuning-section {
    padding-top: var(--space-7);
  }

  .tuning-page .tuning-section + .tuning-section {
    padding-top: var(--space-7);
  }

  .tuning-page .tuning-hero {
    padding-top: var(--space-5);
  }

  .tuning-page .tuning-hero__title {
    max-width: 16ch;
  }

  .tuning-page .tuning-hero__lead {
    font-size: 1.125rem;
  }

  .tuning-page .tuning-meter-row {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-2);
  }

  .tuning-page .tuning-criteria,
  .tuning-page .tuning-profiles,
  .tuning-page .tuning-checklist {
    grid-template-columns: minmax(0, 1fr);
  }

  .tuning-page .tuning-criteria > :last-child,
  .tuning-page .tuning-profiles > :last-child {
    grid-column: auto;
  }

  .tuning-page .tuning-trial__steps,
  .tuning-page .tuning-test-order ol {
    grid-template-columns: minmax(0, 1fr);
  }

  .tuning-page .tuning-final__panel {
    padding: 18px;
  }

  .tuning-page .tuning-final__copy .button {
    width: 100%;
    min-width: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .tuning-page .tuning-meter .meter__segment {
    transform: scaleX(1);
  }
}

ul { list-style: none !important; }
.nav-toggle { flex-direction: column; }
