/* 5. bölüm: yarı iletkenler ve diyot */

/* alt sıra: şema (ya da osiloskop/grafik) + ölçüm sütunu */
.c5-bottom { display: grid; grid-template-columns: 1.5fr minmax(190px, 1fr); gap: 14px; min-height: 0; }
.c5-bottom.c5-bottom-scope { grid-template-columns: 1fr minmax(150px, 172px); }
.c5-side { display: flex; flex-direction: column; justify-content: center; gap: 10px; min-width: 0; }
.c5-side .meters { gap: 8px; }
.c5-side .meter { flex: 1 1 120px; }
.c5-side-narrow .meters { flex-direction: column; flex-wrap: nowrap; }
.c5-side-narrow .meter { flex: 0 0 auto; padding: 3px 9px 4px; }
.c5-side-narrow .meter b { font-size: 0.98rem; }
.c5-status {
  margin: 0; font-family: var(--f-display); font-stretch: 92%; font-size: 0.86rem; line-height: 1.35;
  color: var(--silk-2); border-left: 2px solid var(--line); padding: 2px 0 2px 10px;
}
.c5-status.on { border-left-color: var(--copper-2); color: var(--silk); }
.c5-status.bad { border-left-color: var(--heat); color: #ffc08a; }

.c5-crystal { min-height: 220px; }
.c5-scope { display: flex; flex-direction: column; }
.c5-scope .scope { flex: 1; }
.c5-slow {
  position: absolute; right: 8px; top: 30px; z-index: 2; pointer-events: none;
  font-family: var(--f-display); font-stretch: 85%; font-size: 0.72rem; color: var(--muted);
}
.c5-view[hidden], .c5-grp[hidden] { display: none; }
.c5-view { flex: 1; }
.c5-grp { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }

@media (max-width: 860px) {
  .c5-bottom, .c5-bottom.c5-bottom-scope { grid-template-columns: 1fr; grid-auto-rows: minmax(210px, auto); }
  .c5-side { justify-content: flex-start; }
  .c5-side-narrow .meters { flex-direction: row; flex-wrap: wrap; }
  .c5-side-narrow .meter { flex: 1 1 130px; }
  .c5-split { display: flex; flex-direction: column; }
  .c5-split > .pane { flex: none; height: 290px; }
  .c5-split > .c5-crystal { height: 330px; }
  .c5-split .c5-bottom > .pane { height: 240px; }
  .c5-split .c5-bottom > .c5-scope { height: 340px; }
}