/* Chapter 7: diffraction and the sharpest aperture (two-view lab layout lives in site.css) */

/* Pixel view */
.pixels{max-height:360px;margin:auto;border-radius:6px;background:#0C0E10}
.pixels .px{fill:#F5A623;stroke:#ffffff1f;stroke-width:1}
.pixels .airy{fill:none;stroke:#E7E9E4;stroke-width:1.5;stroke-dasharray:4 5}

/* Sharpness curve: one series, hairline grid, 2px line, marker with a surface ring */
.curve-wrap{position:relative;margin:auto 0}
.curve{cursor:crosshair;touch-action:pan-y}
.curve .grid{stroke:#ffffff17;stroke-width:1}
.curve .axis{stroke:#ffffff40;stroke-width:1}
.curve .tick{fill:var(--on-body-muted);font-size:13px;font-variant-numeric:tabular-nums}
.curve .zone{fill:#ffffff0a}
.curve .zone-label{fill:var(--on-body-muted);font-size:13px}
.curve .wash{fill:#F5A623;fill-opacity:.1}
.curve .line{fill:none;stroke:#F5A623;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.curve .now-line{stroke:#F5A62366;stroke-width:1}
.curve .dot{fill:#F5A623;stroke:var(--body);stroke-width:2}
.curve .hair{stroke:#E7E9E4;stroke-width:1;pointer-events:none}
.curve-tip{position:absolute;transform:translate(-50%,calc(-100% - 12px));padding:6px 10px;border-radius:8px;background:#0C0E10;border:1px solid #ffffff26;font-family:var(--sans);white-space:nowrap;pointer-events:none}
.curve-tip strong{display:block;font-size:16px;color:var(--on-body)}
.curve-tip span{font-size:12px;color:var(--on-body-muted)}
.curve-tip[hidden]{display:none}

/* Four sensor options in two rows */
.segmented.stack-2{grid-auto-flow:row;grid-template-columns:repeat(2,minmax(0,1fr));border-radius:18px}
.verdict-line{margin:14px 0 0;padding-left:14px;border-left:3px solid var(--amber);font-family:var(--sans);font-size:16px;font-weight:600}

.table-view{margin-top:8px;font-family:var(--sans);font-size:15px}
.table-view summary{cursor:pointer;color:var(--muted);font-weight:600}
.table-view table{max-width:520px}
.after-rules{margin-top:14px!important}

@media (max-width:760px){
  .curve .tick,.curve .zone-label{font-size:18px}
}
