.course-mark{display:inline-grid;place-items:center;width:2.2rem;height:2.2rem;border:1px solid currentColor;border-radius:50%;font-size:.7rem;letter-spacing:.08em}.signal-rule{height:3px;background:linear-gradient(90deg,var(--blue) 0 20%,transparent 20% 25%,var(--cyan) 25% 55%,transparent 55% 60%,#e66b19 60% 100%);margin:2rem 0;max-width:240px}.course-note{font-family:Georgia,serif;font-size:1.2rem;color:var(--blue-dark)}

.system-groups{display:grid;grid-template-columns:3fr 1fr 4fr;gap:.8rem;margin:2rem 0}.system-group{padding:1rem;border:1px solid var(--line);border-radius:var(--radius);background:#fff}.system-group__label{font-size:.72rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase;color:var(--blue);margin-bottom:.8rem}.system-flow{display:flex;align-items:stretch;gap:.45rem}.system-block{flex:1;min-width:0;border:1px solid var(--line);border-radius:10px;background:#f8fafc;color:var(--ink);padding:.75rem .5rem;text-align:center;font-weight:750;font-size:.82rem}.system-block:hover,.system-block:focus-visible,.system-block.is-active{border-color:var(--blue);background:#eef5ff;color:var(--blue-dark)}.system-arrow{display:grid;place-items:center;color:var(--blue);font-weight:900}.system-explanation{min-height:4.5rem;padding:1rem 1.2rem;background:#eef5ff;border-radius:12px}.classification-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.classification-card{padding:1.35rem;border-top:3px solid var(--blue);background:#fff}.classification-card ul{padding-left:1.2rem}.signal-vocabulary{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:2rem 0}.signal-vocabulary>div{padding:1.25rem;border:1px solid var(--line);border-radius:var(--radius);background:#fff}.signal-vocabulary strong{display:block;color:var(--blue);margin-bottom:.4rem}.am-chain{display:flex;align-items:center;gap:.4rem;overflow-x:auto;padding:1rem 0 1.4rem}.am-chain span{flex:0 0 auto;padding:.7rem .9rem;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:.82rem}.am-chain b{color:var(--blue)}.spectrum-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:1.5rem 0}.spectrum-panel{padding:1.2rem;border:1px solid var(--line);border-radius:var(--radius);background:#fff}.spectrum-lines{height:120px;position:relative;border-bottom:1px solid #8b96a5;background:repeating-linear-gradient(90deg,transparent 0 49px,#edf1f5 50px)}.spectrum-line{position:absolute;bottom:0;width:3px;background:var(--blue);height:var(--height,65%);left:var(--left,50%)}.spectrum-line::after{content:attr(data-label);position:absolute;bottom:-1.8rem;left:50%;transform:translateX(-50%);font-size:.75rem;white-space:nowrap;color:var(--muted)}.spectrum-line--carrier{background:#e66b19;height:92%}.widget__plots{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.widget__plots--three{grid-template-columns:repeat(3,1fr)}.widget__plot h4{margin:.25rem .5rem .6rem;font-size:.85rem;color:var(--muted)}.widget canvas.am-canvas{height:240px}.comparison-switch{display:inline-flex;gap:.25rem;padding:.25rem;border:1px solid var(--line);border-radius:999px;background:#f3f5f8}.comparison-switch button{border:0;border-radius:999px;background:transparent;padding:.55rem .85rem;color:var(--muted);font-weight:750}.comparison-switch button.is-active{background:var(--blue);color:#fff}.status-pill{display:inline-flex;align-items:center;padding:.35rem .7rem;border-radius:999px;background:#eef5ff;color:var(--blue-dark);font-weight:800}.status-pill[data-state="over"]{background:#fff1f0;color:var(--red)}.status-pill[data-state="full"]{background:#fff7e8;color:var(--amber)}.lecture-pager{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:2rem 0;border-top:1px solid var(--line)}.lecture-pager a{text-decoration:none;font-weight:750}.reference-box{padding:1.25rem;border:1px solid var(--line);border-radius:var(--radius);background:#fff}.download-link{display:inline-flex;align-items:center;gap:.5rem;font-weight:800}.bandwidth-map{display:grid;grid-template-columns:1fr auto 2fr;align-items:center;gap:1rem;margin:2rem 0}.band{padding:1rem;text-align:center;border:1px solid var(--line);border-radius:12px;background:#fff}.band--split{display:grid;grid-template-columns:1fr 1fr;padding:0;overflow:hidden}.band--split span{padding:1rem}.band--split span:first-child{background:#eef5ff;border-right:1px solid var(--line)}.band--split span:last-child{background:#ecf9fb}

@media(max-width:900px){.system-groups{grid-template-columns:1fr}.widget__plots--three{grid-template-columns:1fr}.signal-vocabulary{grid-template-columns:1fr}.system-flow{flex-wrap:wrap}.system-block{min-width:120px}.system-arrow{transform:rotate(90deg)}}
@media(max-width:700px){.classification-grid,.widget__plots,.spectrum-strip{grid-template-columns:1fr}.bandwidth-map{grid-template-columns:1fr}.bandwidth-map>strong{transform:rotate(90deg);justify-self:center}.lecture-pager{align-items:stretch}.lecture-pager a{max-width:48%}.am-chain{flex-wrap:wrap;overflow:visible}.am-chain b{transform:rotate(90deg)}}

.system-groups{grid-template-columns:minmax(0,3fr) minmax(0,1fr) minmax(0,4fr)}
.system-group{min-width:0}
@media(max-width:1200px){.system-groups{grid-template-columns:1fr}.system-flow{flex-wrap:wrap}.system-block{min-width:120px}.system-arrow{transform:rotate(90deg)}}

/* ---------------------------------------------------------------------------
   Week 4 slide deck (week-04/index.html).

   The deck reuses the shared lecture-deck engine and its canonical 16:9 slide
   geometry. Everything here is scoped either to .lecture-slide, which exists
   only on a deck page, or to the new .ssb-* / .try-it classes, so the Week 1-3
   reading views are untouched.
   --------------------------------------------------------------------------- */

/* lecture.css gives .equation overflow-x:auto, which makes it a scroll
   container. A scroll container has an automatic minimum size of zero, so on a
   fixed-height slide the grid silently squashes the equation instead of the
   slide reporting overflow. Restore a real intrinsic height on slides only. */
/* Equation and sub-heading sizes are presentation typography and live in the
   shared deck stylesheet, so both courses set maths at the same size. Only the
   course accent colour is stated here. */
.lecture-slide .equation mjx-container[display="true"]{margin:.2em 0}
.lecture-slide .ssb-equation--hero{font-size:clamp(1.15rem,2.6vw,1.75rem);padding:.9rem 0}
.lecture-slide .ssb-equation--result{padding:.55rem .9rem;border-left:4px solid var(--blue);background:#f2f6fe;border-radius:0 8px 8px 0}
.lecture-slide h3{color:var(--blue-dark)}
.lecture-slide .callout{margin:.5rem 0 0;padding:.7rem .9rem}
.lecture-slide .callout p{margin:0;font-size:.94rem}
.lecture-slide .comparison{margin:.2rem 0;font-size:.92rem}
.lecture-slide .comparison th,.lecture-slide .comparison td{padding:.4rem .55rem}
.lecture-slide .bandwidth-map{margin:.4rem 0 .9rem}
.lecture-slide .reference-box{margin:.6rem 0 .5rem;padding:.7rem .9rem;font-size:.88rem}
.lecture-slide .reference-box p{margin:0}

/* Native diagrams. Height is capped so a figure can never push a slide past
   the canonical canvas; the viewBox keeps every label inside the drawing. */
.ssb-figure{margin:.3rem 0 0;border:0;padding:0;display:grid;gap:.4rem;justify-items:center}
.ssb-figure svg{display:block;width:100%;height:auto;max-height:12rem}
.ssb-figure--wide svg{max-height:11rem}
.ssb-figure figcaption{font-size:.83rem;line-height:1.5;color:var(--muted);text-align:center;max-width:60ch}
.lecture-slide[data-slide-type="figure"] .ssb-figure svg{max-height:13.5rem}

/* Interactive teaching widgets. */
.ssb-widget{display:grid;gap:.45rem;margin:.4rem 0 0;padding:.6rem .75rem;border:1px solid var(--line);border-radius:12px;background:#fff}
.ssb-widget .widget__controls{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1.1rem;margin:0;padding:0;border:0;background:none}
.ssb-widget .control{display:flex;align-items:center;gap:.5rem;margin:0;font-size:.9rem;font-weight:650}
.ssb-widget .control input[type="range"]{width:min(15rem,42vw)}
.ssb-widget .control__value{font-variant-numeric:tabular-nums;font-weight:800;color:var(--blue-dark);min-width:4.2rem}
.ssb-readout{flex:1 1 16rem;margin:0;font-size:.88rem;line-height:1.45;color:var(--muted)}
.ssb-plot{width:100%}
.ssb-plot svg{display:block;width:100%;height:auto;max-height:10rem}
.ssb-canvas{display:block;width:100%;height:8rem}

.ssb-toggle{display:flex;gap:.3rem;flex-wrap:wrap}
.ssb-toggle button{padding:.32rem .8rem;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--muted);font-size:.85rem;font-weight:750}
.ssb-toggle button:hover{border-color:var(--blue)}
.ssb-toggle button[aria-pressed="true"]{background:var(--blue);border-color:var(--blue);color:#fff}

.ssb-details{margin:.5rem 0 0;font-size:.9rem}
.ssb-details summary{cursor:pointer;font-weight:750;color:var(--blue-dark)}
.ssb-details p{margin:.4rem 0 0;color:var(--muted)}

.ssb-questions{margin:.3rem 0 0;padding-left:1.3rem;display:grid;gap:.34rem;font-size:1rem}
.ssb-questions li{padding-left:.2rem}
.ssb-questions--checks{font-size:.96rem}
.lecture-slide[data-slide-type="summary"] .ssb-questions{color:#fff}
.lecture-slide[data-slide-type="summary"] .reference-box{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.3);color:#fff}
.lecture-slide[data-slide-type="summary"] .reference-box cite{color:#fff}

/* Launch links into the existing AM visualizer. */
.try-it{margin:.55rem 0 0;display:flex;flex-wrap:wrap;gap:.5rem}
.lecture-slide .try-it .button{padding:.5rem .95rem;font-size:.9rem}

@media(max-width:1023px){
  .ssb-figure svg,.ssb-figure--wide svg,.lecture-slide[data-slide-type="figure"] .ssb-figure svg{max-height:none}
  .ssb-plot svg{max-height:none}
}
@media(max-width:800px){
  .ssb-widget .control input[type="range"]{width:100%}
  .ssb-widget .control{flex:1 1 100%}
  .ssb-readout{flex-basis:100%}
  .ssb-canvas{height:8rem}
}
@media(max-width:520px){
  .lecture-slide .ssb-equation--hero{font-size:1.05rem}
  .ssb-figure figcaption{font-size:.78rem}
  .ssb-questions{font-size:.94rem}
}

/* Progressive reveal on the two derivation slides. The controls are hidden
   until the script un-hides them, so with JavaScript off every step is simply
   visible and the slide still reads as a complete proof. */
.ssb-steps{display:grid;gap:.15rem}
.ssb-steps__controls{display:flex;align-items:center;gap:.5rem;margin:.45rem 0 0;font-size:.84rem;color:var(--muted)}
.ssb-steps__controls[hidden]{display:none}
.ssb-steps__controls button{padding:.3rem .85rem;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink);font-size:.84rem;font-weight:750}
.ssb-steps__controls button:hover:not(:disabled){border-color:var(--blue)}
.ssb-steps__controls button:disabled{opacity:.4;cursor:default}

/* The cancellation stems carry three stacked spectra, so they need more height
   than the single-axis plots to stay readable from the back of a room. */
.ssb-plot--tall svg{max-height:14.5rem}
@media(max-width:1023px){
  .ssb-plot--tall svg{max-height:none}
}

/* ---------------------------------------------------------------------------
   Fit corrections from rendered validation at 1920x1080.

   Measured slide-body height on the canonical canvas is 413 px (520 px on the
   carrier-free summary slide). Five slides exceeded it: quadrature +17,
   phase-vs-delay +73, cancellation +32, usb-vs-lsb +48, readiness +35.

   Only spacing and media caps are adjusted here. No equation, diagram, label
   or teaching sentence was changed.
   --------------------------------------------------------------------------- */
.lecture-slide .slide-body>p{margin-bottom:.55em}
.lecture-slide .equation{padding:.3rem 0}
.lecture-slide .callout{padding:.55rem .8rem}
.lecture-slide .callout p{font-size:.9rem;line-height:1.45}

.lecture-slide#quadrature .ssb-canvas{height:7rem}
.lecture-slide#phase-vs-delay .ssb-figure svg{max-height:9rem}
.lecture-slide#phase-vs-delay .ssb-figure figcaption{font-size:.78rem}
.lecture-slide#cancellation .ssb-plot--tall svg{max-height:12.5rem}
.lecture-slide#usb-vs-lsb .ssb-plot svg{max-height:8rem}
.lecture-slide#readiness .reference-box{padding:.55rem .8rem;font-size:.82rem}
.lecture-slide#readiness .reference-box p{margin:0 0 .3em}
.lecture-slide#readiness .lecture-pager{margin-top:.45rem}

/* Mobile releases the canonical ratio, so the caps above are lifted again. */
@media(max-width:1023px){
  .lecture-slide#quadrature .ssb-canvas{height:8rem}
  .lecture-slide#phase-vs-delay .ssb-figure svg,
  .lecture-slide#cancellation .ssb-plot--tall svg,
  .lecture-slide#usb-vs-lsb .ssb-plot svg{max-height:none}
}

/* Second fit pass. The phase-response caption was wrapping to two lines inside
   a 60ch limit while the figure itself is 862 px wide, so releasing the caption
   width recovers the last 12 px without shrinking the diagram. The summary
   slide recovers its 31 px from the reference box and pager chrome. */
.lecture-slide#phase-vs-delay .ssb-figure figcaption{max-width:none;font-size:.76rem}
.lecture-slide#readiness .reference-box{font-size:.78rem;margin-top:.4rem}
.lecture-slide#readiness .reference-box p{margin:0 0 .25em}
.lecture-slide#readiness .lecture-pager{margin-top:.2rem;padding-block:.3rem;font-size:.9rem}

/* Third fit pass: MathJax typesetting makes the paired equations on the
   USB-versus-LSB slide slightly taller than the pre-typeset measurement. */
.lecture-slide#usb-vs-lsb .ssb-plot svg{max-height:7.5rem}

/* Grid items keep an automatic minimum size of auto, so a wide MathJax block
   inside a stepped derivation refused to shrink and pushed the slide sideways
   at 375 px. Allowing the tracks to shrink lets the equation use its own
   sanctioned horizontal scroll instead. */
.ssb-steps,.ssb-steps>*{min-width:0}

/* Fourth pass: use the slide area. With the fit corrections above in place,
   three diagrams were still letterboxed well inside their boxes (two-branches
   drawn 553 px inside 862 px, at only 63% slide fill). Raising just those caps
   scales each drawing up without pushing any slide past the canvas.
       two-branches      553 -> 819 px wide, fill 63% -> 88%
       hilbert-response  488 -> 634 px wide, fill 76% -> 87%
       ssb-sc            538 -> 606 px wide, fill 80% -> 86%          */
.lecture-slide#two-branches .ssb-figure svg{max-height:20rem}
.lecture-slide#hilbert-response .ssb-plot svg{max-height:12rem}
.lecture-slide#ssb-sc .ssb-figure svg{max-height:12.4rem}
@media(max-width:1023px){
  .lecture-slide#two-branches .ssb-figure svg,
  .lecture-slide#hilbert-response .ssb-plot svg,
  .lecture-slide#ssb-sc .ssb-figure svg{max-height:none}
}

/* ---------------------------------------------------------------------------
   Weeks 1-3 slide decks (week-01, week-02, week-03 index.html).

   The three earlier weeks were converted from long-scroll reading pages to the
   same shared lecture-deck shell that Week 4 uses, so the four EE 351 weeks
   read as one presentation series. Unlike Week 4, which draws its own .ssb-*
   figures, these decks carry the article components the reading pages already
   used: widgets, spectrum strips, classification cards, quizzes and MATLAB
   listings.

   Everything below is therefore scoped to
   .lecture-deck--article .lecture-slide. The deck class keeps these rules off
   the Week 4 deck, whose instruments share the same .widget class name, and
   .lecture-slide keeps them off any long-form article page.

   The article components were authored for a page that can grow downwards. A
   slide cannot: its height is fixed by --deck-ratio. These rules therefore
   tighten local spacing and cap plot heights only. No equation, diagram,
   label, code line or teaching sentence is changed by them.
   --------------------------------------------------------------------------- */

/* Interactive widgets. The card chrome is redundant inside a slide, which is
   already a bounded white surface. */
.lecture-deck--article .lecture-slide .widget{margin:.35rem 0 0;padding:.5rem .6rem;box-shadow:none}
.lecture-deck--article .lecture-slide .widget__controls{padding:.15rem .2rem .45rem;gap:.5rem .9rem;font-size:.9rem}
.lecture-deck--article .lecture-slide .widget__controls .control{gap:.2rem}
.lecture-deck--article .lecture-slide .widget__plots{gap:.7rem}
.lecture-deck--article .lecture-slide .widget__plot h4{margin:.1rem .3rem .3rem;font-size:.78rem}
.lecture-deck--article .lecture-slide .widget canvas{height:15rem;border-radius:10px}
.lecture-deck--article .lecture-slide .widget__legend{font-size:.8rem}
.lecture-deck--article .lecture-slide .status-pill{justify-self:start}

/* Per-instrument caps. Each is the tallest plot that still leaves room for the
   widget's own controls and readouts on the canonical canvas. */
.lecture-deck--article .lecture-slide#translation .widget__plots canvas{height:5.6rem}
.lecture-deck--article .lecture-slide#translation .widget>.widget__plot canvas{height:6.2rem}
.lecture-deck--article .lecture-slide#comparison .widget canvas{height:11.5rem}
.lecture-deck--article .lecture-slide#index-explorer .widget canvas{height:13.5rem}
.lecture-deck--article .lecture-slide#signal-explorer-slide .widget canvas{height:13rem}
.lecture-deck--article .lecture-slide#convolution-explorer .widget canvas{height:13rem}
.lecture-deck--article .lecture-slide#spectrum-views .widget canvas{height:12.5rem}
.lecture-deck--article .lecture-slide#wavelength-explorer .widget canvas{height:11.3rem}

/* Spectrum strips and stem panels. */
.lecture-deck--article .lecture-slide .spectrum-strip{margin:.3rem 0;gap:.7rem}
.lecture-deck--article .lecture-slide .spectrum-panel{padding:.75rem .85rem}
.lecture-deck--article .lecture-slide .spectrum-panel .equation{padding:.15rem 0;font-size:1.05rem}
.lecture-deck--article .lecture-slide .spectrum-panel p{margin:0}
.lecture-deck--article .lecture-slide .spectrum-panel p+p{margin-top:.3rem}
.lecture-deck--article .lecture-slide .spectrum-lines{height:8.5rem;margin-bottom:1.7rem}

/* Summary and comparison grids. */
.lecture-deck--article .lecture-slide .summary-grid{gap:.8rem;margin:.2rem 0}
.lecture-deck--article .lecture-slide .summary-grid div{padding:.75rem .9rem}
.lecture-deck--article .lecture-slide .summary-grid p{margin:0}
.lecture-deck--article .summary-grid--three{grid-template-columns:repeat(3,minmax(0,1fr))}
.lecture-deck--article .lecture-slide .classification-grid{gap:.8rem}
.lecture-deck--article .lecture-slide .classification-card{padding:.8rem .9rem}
.lecture-deck--article .lecture-slide .classification-card p{margin:0 0 .35rem}
.lecture-deck--article .lecture-slide .classification-card ul{margin:0;padding-left:1.1rem}
.lecture-deck--article .lecture-slide .signal-vocabulary{margin:.3rem 0;gap:.8rem}
.lecture-deck--article .lecture-slide .signal-vocabulary>div{padding:.85rem .9rem}
.lecture-deck--article .lecture-slide .signal-vocabulary p{margin:0}
.lecture-deck--article .lecture-slide .convolution-steps{gap:.8rem;margin:.3rem 0}
.lecture-deck--article .lecture-slide .convolution-steps li{padding:.7rem .2rem 0}
.lecture-deck--article .lecture-slide .meta-list{margin:.3rem 0}
.lecture-deck--article .lecture-slide .meta-list div{padding:.3rem 0;border-bottom-color:var(--line)}

/* The communication-chain instrument: three groups of clickable blocks plus a
   live explanation region. */
.lecture-deck--article .lecture-slide .system-groups{margin:.3rem 0;gap:.6rem}
.lecture-deck--article .lecture-slide .system-group{padding:.7rem}
.lecture-deck--article .lecture-slide .system-group__label{margin-bottom:.5rem}
.lecture-deck--article .lecture-slide .system-block{padding:.6rem .4rem;font-size:.8rem}
.lecture-deck--article .lecture-slide .system-explanation{min-height:3.4rem;padding:.7rem .9rem;margin:.3rem 0 0;font-size:.94rem}
.lecture-deck--article .lecture-slide .am-chain{padding:.4rem 0 .6rem;gap:.35rem;flex-wrap:wrap;justify-content:center;overflow:visible}
/* The nine-stage radio chain is wider than a slide. A slide cannot scroll
   sideways without hiding stages, so it wraps onto a second row instead. */
.lecture-deck--article .lecture-slide .am-chain span{padding:.5rem .7rem;font-size:.78rem}

/* Quizzes are the slide on a check-yourself slide, so the card border is
   dropped and the options are tightened. */
.lecture-deck--article .lecture-slide .quiz h3{margin:0 0 .5rem;font-size:1.05rem}
.lecture-deck--article .lecture-slide .quiz__options{margin:.6rem 0}
.lecture-deck--article .lecture-slide .quiz__option{padding:.6rem .7rem}
.lecture-deck--article .lecture-slide .quiz__feedback{margin-top:.7rem;padding:.7rem .8rem}

/* MATLAB listings. A slide cannot scroll, so long lines wrap instead of
   sliding out of view; every character of the original script stays visible
   and the downloadable .m file remains the working copy. */
.lecture-deck--article .lecture-slide pre.deck-code{margin:.25rem 0 0;padding:.75rem .95rem;font-size:.76rem;line-height:1.5;white-space:pre-wrap;overflow:visible}
/* lecture.css makes every <pre> its own scroll container. Nested inside a
   fixed-height slide that hides code rather than reporting the fit, so the
   slide body owns the scrolling here. */
.lecture-deck--article .lecture-slide pre.deck-code code{display:block}

/* Miscellaneous article components used inside slides. */
.lecture-deck--article .lecture-slide .concept-bridge{margin:.3rem 0 .8rem}
.lecture-deck--article .lecture-slide .concept-bridge li{padding:.5rem .9rem;font-size:.92rem}
.lecture-deck--article .lecture-slide .download-link{font-size:.95rem}
.lecture-deck--article .lecture-slide .lecture-pager{padding:.9rem 0 0;margin-top:.6rem}
.lecture-deck--article .lecture-slide .slide-split h3{margin-bottom:.3rem}

/* Below 1024 px the navigator collapses and the canvas narrows, so the desktop
   plot caps above are lifted. Between 801 and 1023 px the shared shell still
   holds the 16:9 ratio, so the instruments stay compact there; below 800 px the
   slide reflows vertically and each one returns to a comfortable height. */
@media(max-width:1023px){
  .lecture-deck--article .lecture-slide .widget canvas,
  .lecture-deck--article .lecture-slide#comparison .widget canvas,
  .lecture-deck--article .lecture-slide#index-explorer .widget canvas,
  .lecture-deck--article .lecture-slide#signal-explorer-slide .widget canvas,
  .lecture-deck--article .lecture-slide#convolution-explorer .widget canvas,
  .lecture-deck--article .lecture-slide#spectrum-views .widget canvas,
  .lecture-deck--article .lecture-slide#wavelength-explorer .widget canvas{height:12rem}
  .lecture-deck--article .lecture-slide .spectrum-lines{height:7rem}
}
/* The translation explorer carries four plots. Stacking them one per row in
   this band would push the slide's own scroll region hundreds of pixels deep,
   so the three waveforms stay side by side while the ratio is still held. */
@media(min-width:801px) and (max-width:1023px){
  .lecture-deck--article .lecture-slide pre.deck-code{font-size:.7rem}
  .lecture-deck--article .lecture-slide#wavelength-explorer .widget canvas{height:9rem}
  .lecture-deck--article .lecture-slide .system-block{padding:.5rem .35rem;font-size:.76rem}
  .lecture-deck--article .lecture-slide .system-explanation{min-height:3rem}
  .lecture-deck--article .lecture-slide .widget__plots--three{grid-template-columns:repeat(3,minmax(0,1fr))}
  .lecture-deck--article .lecture-slide#translation .widget__plots canvas{height:6rem}
  .lecture-deck--article .lecture-slide#translation .widget>.widget__plot canvas{height:6.5rem}
}
@media(max-width:800px){
  .lecture-deck--article .lecture-slide .widget__controls{grid-template-columns:1fr}
  .lecture-deck--article .lecture-slide .summary-grid,.lecture-deck--article .summary-grid--three{grid-template-columns:1fr}
  .lecture-deck--article .lecture-slide .widget canvas,
  .lecture-deck--article .lecture-slide#translation .widget__plots canvas,
  .lecture-deck--article .lecture-slide#translation .widget>.widget__plot canvas,
  .lecture-deck--article .lecture-slide#comparison .widget canvas,
  .lecture-deck--article .lecture-slide#index-explorer .widget canvas,
  .lecture-deck--article .lecture-slide#signal-explorer-slide .widget canvas,
  .lecture-deck--article .lecture-slide#convolution-explorer .widget canvas,
  .lecture-deck--article .lecture-slide#spectrum-views .widget canvas,
  .lecture-deck--article .lecture-slide#wavelength-explorer .widget canvas{height:14rem}
}
@media(max-width:520px){
  .lecture-deck--article .lecture-slide pre.deck-code{font-size:.72rem;padding:.6rem .7rem}
  .lecture-deck--article .lecture-slide .concept-bridge li{font-size:.85rem;padding:.42rem .75rem}
}