:is(
    [data-unit-visual-extension="photon_quantum_scale"],
    [data-unit-visual-extension="photon_energy_momentum_ledger"],
    [data-unit-visual-extension="photoelectric_electroscope_evidence"],
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="photoelectric_graph_evidence"],
    [data-unit-visual-extension="wave_particle_evidence_map"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"],
    [data-unit-visual-extension="line_spectrum_builder"]
) {
    --ch22-ink: #19333d;
    --ch22-muted: #617783;
    --ch22-line: #77909a;
    --ch22-grid: #dce8eb;
    --ch22-surface: #f4f9fa;
    --ch22-primary: #126f87;
    --ch22-secondary: #b05a27;
    --ch22-electron: #6b4ea2;
    --ch22-photon: #c38b17;
    --ch22-positive: #2d7a5f;
    --ch22-danger: #a6463f;
    margin: clamp(1.1rem, 2.5vw, 1.75rem) 0;
    padding: clamp(0.9rem, 2.5vw, 1.4rem);
    border: 1px solid color-mix(in srgb, var(--ch22-primary) 18%, transparent);
    border-radius: 1.2rem;
    background: linear-gradient(145deg, #fefefe 0%, var(--ch22-surface) 100%);
    color: var(--ch22-ink);
    box-shadow: 0 0.78rem 1.9rem rgb(25 51 61 / 0.07);
    overflow: clip;
}

:is(
    [data-unit-visual-extension="photon_quantum_scale"],
    [data-unit-visual-extension="photon_energy_momentum_ledger"],
    [data-unit-visual-extension="photoelectric_electroscope_evidence"],
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="photoelectric_graph_evidence"],
    [data-unit-visual-extension="wave_particle_evidence_map"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"],
    [data-unit-visual-extension="line_spectrum_builder"]
) .ch22-visual-heading {
    display: grid;
    gap: 0.18rem;
    margin-bottom: 0.82rem;
}

:is(
    [data-unit-visual-extension="photon_quantum_scale"],
    [data-unit-visual-extension="photon_energy_momentum_ledger"],
    [data-unit-visual-extension="photoelectric_electroscope_evidence"],
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="photoelectric_graph_evidence"],
    [data-unit-visual-extension="wave_particle_evidence_map"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"],
    [data-unit-visual-extension="line_spectrum_builder"]
) :is(.ch22-visual-heading h3, .ch22-visual-kicker, .ch22-visual-caption) {
    margin: 0;
}

:is(
    [data-unit-visual-extension="photon_quantum_scale"],
    [data-unit-visual-extension="photon_energy_momentum_ledger"],
    [data-unit-visual-extension="photoelectric_electroscope_evidence"],
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="photoelectric_graph_evidence"],
    [data-unit-visual-extension="wave_particle_evidence_map"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"],
    [data-unit-visual-extension="line_spectrum_builder"]
) .ch22-visual-heading h3 {
    color: var(--ch22-ink);
    font-size: var(--unit-text-heading-medium, 17px);
    line-height: 1.22;
}

:is(
    [data-unit-visual-extension="photon_quantum_scale"],
    [data-unit-visual-extension="photon_energy_momentum_ledger"],
    [data-unit-visual-extension="photoelectric_electroscope_evidence"],
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="photoelectric_graph_evidence"],
    [data-unit-visual-extension="wave_particle_evidence_map"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"],
    [data-unit-visual-extension="line_spectrum_builder"]
) .ch22-visual-kicker {
    color: var(--ch22-primary);
    font-size: max(12px, var(--unit-text-micro, 11px));
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

:is(
    [data-unit-visual-extension="photon_quantum_scale"],
    [data-unit-visual-extension="photon_energy_momentum_ledger"],
    [data-unit-visual-extension="photoelectric_electroscope_evidence"],
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="photoelectric_graph_evidence"],
    [data-unit-visual-extension="wave_particle_evidence_map"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"],
    [data-unit-visual-extension="line_spectrum_builder"]
) .ch22-visual-controls {
    display: grid;
    grid-template-columns: repeat(var(--ch22-control-count, 4), minmax(0, 1fr));
    gap: 0.42rem;
    width: 100%;
    min-width: 0;
    margin-bottom: 0.78rem;
}

:is(
    [data-unit-visual-extension="photon_quantum_scale"],
    [data-unit-visual-extension="photon_energy_momentum_ledger"],
    [data-unit-visual-extension="photoelectric_electroscope_evidence"],
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="photoelectric_graph_evidence"],
    [data-unit-visual-extension="wave_particle_evidence_map"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"],
    [data-unit-visual-extension="line_spectrum_builder"]
) .ch22-visual-control {
    min-width: 0;
    height: 40px;
    padding: 0.44rem 0.34rem;
    border: 1px solid color-mix(in srgb, var(--ch22-line) 62%, transparent);
    border-radius: 0.68rem;
    background: rgb(255 255 255 / 0.94);
    color: var(--ch22-ink);
    font: inherit;
    font-size: var(--unit-text-meta, 12px);
    font-weight: 750;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
}

:is(
    [data-unit-visual-extension="photon_quantum_scale"],
    [data-unit-visual-extension="photon_energy_momentum_ledger"],
    [data-unit-visual-extension="photoelectric_electroscope_evidence"],
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="photoelectric_graph_evidence"],
    [data-unit-visual-extension="wave_particle_evidence_map"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"],
    [data-unit-visual-extension="line_spectrum_builder"]
) .ch22-visual-control:is(:hover, :focus-visible) {
    border-color: var(--ch22-primary);
    outline: none;
}

:is(
    [data-unit-visual-extension="photon_quantum_scale"],
    [data-unit-visual-extension="photon_energy_momentum_ledger"],
    [data-unit-visual-extension="photoelectric_electroscope_evidence"],
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="photoelectric_graph_evidence"],
    [data-unit-visual-extension="wave_particle_evidence_map"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"],
    [data-unit-visual-extension="line_spectrum_builder"]
) .ch22-visual-control:focus-visible {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--ch22-primary) 24%, transparent);
}

:is(
    [data-unit-visual-extension="photon_quantum_scale"],
    [data-unit-visual-extension="photon_energy_momentum_ledger"],
    [data-unit-visual-extension="photoelectric_electroscope_evidence"],
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="photoelectric_graph_evidence"],
    [data-unit-visual-extension="wave_particle_evidence_map"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"],
    [data-unit-visual-extension="line_spectrum_builder"]
) .ch22-visual-control[aria-pressed="true"] {
    border-color: var(--ch22-primary);
    background: var(--ch22-primary);
    color: #fff;
    box-shadow: 0 0.32rem 0.82rem rgb(18 111 135 / 0.2);
}

:is(
    [data-unit-visual-extension="photon_quantum_scale"],
    [data-unit-visual-extension="photon_energy_momentum_ledger"],
    [data-unit-visual-extension="photoelectric_electroscope_evidence"],
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="photoelectric_graph_evidence"],
    [data-unit-visual-extension="wave_particle_evidence_map"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"],
    [data-unit-visual-extension="line_spectrum_builder"]
) :is(.ch22-visual-stage, .ch22-visual-panel, .ch22-timeline) {
    min-width: 0;
}

:is(
    [data-unit-visual-extension="photon_quantum_scale"],
    [data-unit-visual-extension="photon_energy_momentum_ledger"],
    [data-unit-visual-extension="photoelectric_electroscope_evidence"],
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="photoelectric_graph_evidence"],
    [data-unit-visual-extension="wave_particle_evidence_map"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"],
    [data-unit-visual-extension="line_spectrum_builder"]
) .ch22-visual-panel[hidden] {
    display: none !important;
}

:is(
    [data-unit-visual-extension="photon_quantum_scale"],
    [data-unit-visual-extension="photon_energy_momentum_ledger"],
    [data-unit-visual-extension="photoelectric_electroscope_evidence"],
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="photoelectric_graph_evidence"],
    [data-unit-visual-extension="wave_particle_evidence_map"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"],
    [data-unit-visual-extension="line_spectrum_builder"]
) .ch22-visual-drawing {
    position: relative;
    width: 100%;
    aspect-ratio: 720 / 400;
    border: 1px solid rgb(119 144 154 / 0.18);
    border-radius: 0.92rem;
    background: rgb(255 255 255 / 0.9);
    container-type: inline-size;
    overflow: clip;
}

:is(
    [data-unit-visual-extension="photon_quantum_scale"],
    [data-unit-visual-extension="photon_energy_momentum_ledger"],
    [data-unit-visual-extension="photoelectric_electroscope_evidence"],
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="photoelectric_graph_evidence"],
    [data-unit-visual-extension="wave_particle_evidence_map"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"],
    [data-unit-visual-extension="line_spectrum_builder"]
) .ch22-visual-drawing > svg {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-height: none;
    overflow: visible;
}

:is(
    [data-unit-visual-extension="photon_quantum_scale"],
    [data-unit-visual-extension="photon_energy_momentum_ledger"],
    [data-unit-visual-extension="photoelectric_electroscope_evidence"],
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="photoelectric_graph_evidence"],
    [data-unit-visual-extension="wave_particle_evidence_map"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"],
    [data-unit-visual-extension="line_spectrum_builder"]
) .ch22-overlay {
    position: absolute;
    z-index: 5;
    max-width: 42%;
    color: var(--ch22-ink);
    font-size: max(12px, clamp(0.75rem, 2.15cqw, 0.96rem));
    font-weight: 620;
    line-height: 1.08;
    white-space: nowrap;
    pointer-events: none;
    transform: translate(-50%, -50%);
}

:is(
    [data-unit-visual-extension="photon_quantum_scale"],
    [data-unit-visual-extension="photon_energy_momentum_ledger"],
    [data-unit-visual-extension="photoelectric_electroscope_evidence"],
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="photoelectric_graph_evidence"],
    [data-unit-visual-extension="wave_particle_evidence_map"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"],
    [data-unit-visual-extension="line_spectrum_builder"]
) .ch22-overlay[data-overlay-anchor="start"] {
    transform: translate(0, -50%);
    text-align: left;
}

:is(
    [data-unit-visual-extension="photon_quantum_scale"],
    [data-unit-visual-extension="photon_energy_momentum_ledger"],
    [data-unit-visual-extension="photoelectric_electroscope_evidence"],
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="photoelectric_graph_evidence"],
    [data-unit-visual-extension="wave_particle_evidence_map"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"],
    [data-unit-visual-extension="line_spectrum_builder"]
) .ch22-overlay[data-overlay-anchor="end"] {
    transform: translate(-100%, -50%);
    text-align: right;
}

:is(
    [data-unit-visual-extension="photoelectric_graph_evidence"]
) .ch22-overlay.is-y-axis {
    transform: translate(-50%, -50%) rotate(-90deg);
}

:is(
    [data-unit-visual-extension="photon_quantum_scale"],
    [data-unit-visual-extension="photon_energy_momentum_ledger"],
    [data-unit-visual-extension="photoelectric_electroscope_evidence"],
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="photoelectric_graph_evidence"],
    [data-unit-visual-extension="wave_particle_evidence_map"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"],
    [data-unit-visual-extension="line_spectrum_builder"]
) .ch22-overlay.is-formula {
    font-size: max(12px, clamp(0.78rem, 2.45cqw, 1.08rem));
    font-weight: 680;
}

:is(
    [data-unit-visual-extension="photon_quantum_scale"],
    [data-unit-visual-extension="photon_energy_momentum_ledger"],
    [data-unit-visual-extension="photoelectric_electroscope_evidence"],
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="photoelectric_graph_evidence"],
    [data-unit-visual-extension="wave_particle_evidence_map"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"],
    [data-unit-visual-extension="line_spectrum_builder"]
) .ch22-overlay:is(.is-muted, .is-measure) {
    color: var(--ch22-muted);
}

:is(
    [data-unit-visual-extension="photon_quantum_scale"],
    [data-unit-visual-extension="photon_energy_momentum_ledger"],
    [data-unit-visual-extension="photoelectric_electroscope_evidence"],
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="photoelectric_graph_evidence"],
    [data-unit-visual-extension="wave_particle_evidence_map"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"],
    [data-unit-visual-extension="line_spectrum_builder"]
) .ch22-overlay:is(.is-emphasis, .is-heading) {
    color: var(--ch22-primary);
    font-weight: 760;
}

:is(
    [data-unit-visual-extension="photon_quantum_scale"],
    [data-unit-visual-extension="photon_energy_momentum_ledger"],
    [data-unit-visual-extension="photoelectric_electroscope_evidence"],
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="photoelectric_graph_evidence"],
    [data-unit-visual-extension="wave_particle_evidence_map"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"],
    [data-unit-visual-extension="line_spectrum_builder"]
) .ch22-visual-caption {
    display: grid;
    gap: 0.18rem;
    padding: 0.68rem 0.15rem 0;
    color: var(--ch22-muted);
    font-size: var(--unit-text-body-small, 13px);
    line-height: 1.42;
}

:is(
    [data-unit-visual-extension="photon_quantum_scale"],
    [data-unit-visual-extension="photon_energy_momentum_ledger"],
    [data-unit-visual-extension="photoelectric_electroscope_evidence"],
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="photoelectric_graph_evidence"],
    [data-unit-visual-extension="wave_particle_evidence_map"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"],
    [data-unit-visual-extension="line_spectrum_builder"]
) .ch22-visual-caption strong {
    color: var(--ch22-ink);
    font-size: var(--unit-text-body, 14px);
}

:is(
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"]
) .ch22-timeline-controls {
    display: grid;
    grid-template-columns: 10rem minmax(0, 1fr) 8.8rem;
    align-items: center;
    gap: 0.6rem;
    margin-top: 0.6rem;
    padding: 0.52rem 0.62rem;
    border: 1px solid rgb(119 144 154 / 0.22);
    border-radius: 0.76rem;
    background: rgb(255 255 255 / 0.82);
}

:is(
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"]
) .ch22-timeline-play {
    min-height: 38px;
    padding: 0.45rem 0.72rem;
    border: 1px solid var(--ch22-primary);
    border-radius: 0.6rem;
    background: var(--ch22-primary);
    color: #fff;
    font: inherit;
    font-size: var(--unit-text-meta, 12px);
    font-weight: 760;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: 0 0.32rem 0.72rem rgb(18 111 135 / 0.24);
}

:is(
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"]
) .ch22-timeline-play:is(:hover, :focus-visible) {
    background: #0d5d72;
    outline: none;
    box-shadow: 0 0 0 3px rgb(18 111 135 / 0.2), 0 0.32rem 0.72rem rgb(18 111 135 / 0.24);
}

:is(
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"]
) .ch22-timeline-label {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0.55rem;
    min-width: 0;
    color: var(--ch22-muted);
    font-size: var(--unit-text-meta, 12px);
    font-weight: 700;
}

:is(
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"]
) .ch22-timeline-range {
    width: 100%;
    min-width: 0;
    accent-color: var(--ch22-primary);
}

:is(
    [data-unit-visual-extension="photoelectric_interaction_timeline"],
    [data-unit-visual-extension="electron_diffraction_timeline"],
    [data-unit-visual-extension="atomic_energy_transition_timeline"]
) .ch22-timeline-output {
    color: var(--ch22-ink);
    font-size: var(--unit-text-meta, 12px);
    font-weight: 720;
    text-align: right;
    white-space: nowrap;
}

.ch22-grid {
    stroke: var(--ch22-grid);
    stroke-width: 1.1;
}

.ch22-guide {
    fill: none;
    stroke: var(--ch22-line);
    stroke-width: 1.3;
    stroke-dasharray: 7 6;
}

.ch22-guide.is-gradient,
.ch22-guide.is-selected {
    stroke: var(--ch22-secondary);
    stroke-width: 1.8;
}

.ch22-axis {
    fill: none;
    stroke: var(--ch22-ink);
    stroke-width: 1.4;
}

.ch22-arrowhead {
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.65;
}

.ch22-arrowhead.is-axis { stroke: var(--ch22-ink); }
.ch22-arrowhead.is-primary { stroke: var(--ch22-primary); }
.ch22-arrowhead.is-secondary { stroke: var(--ch22-secondary); }
.ch22-arrowhead.is-electron { stroke: var(--ch22-electron); }

.ch22-vector {
    fill: none;
    stroke-width: 2.2;
    stroke-linecap: round;
}

.ch22-vector.is-primary { stroke: var(--ch22-primary); }
.ch22-vector.is-secondary { stroke: var(--ch22-secondary); }
.ch22-vector.is-electron { stroke: var(--ch22-electron); }
.ch22-vector.is-transition { stroke-dasharray: 5 4; }

.ch22-wave,
.ch22-photon-wave,
.ch22-beam,
.ch22-plot {
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.ch22-wave {
    stroke: var(--ch22-primary);
    stroke-width: 2.25;
}

.ch22-wave.is-red { stroke: #c94d3f; }
.ch22-wave.is-uv { stroke: #7354ad; }
.ch22-wave.is-gamma { stroke: #8642a4; }
.ch22-wave.is-evidence,
.ch22-wave.is-matter { stroke: var(--ch22-electron); }

.ch22-photon-wave {
    stroke: var(--ch22-photon);
    stroke-width: 1.9;
}

.ch22-beam {
    stroke: var(--ch22-electron);
    stroke-width: 2.1;
    stroke-dasharray: 6 4;
}

.ch22-photon {
    fill: #fff5ce;
    stroke: var(--ch22-photon);
    stroke-width: 2;
}

.ch22-photon.is-red { fill: #ffe6df; stroke: #c94d3f; }
.ch22-photon.is-uv,
.ch22-photon.is-gamma { fill: #eee6fb; stroke: #7354ad; }
.ch22-photon.is-ledger { fill: #fff5ce; }
.ch22-photon-core { fill: var(--ch22-photon); }

.ch22-electron {
    fill: var(--ch22-electron);
    stroke: #fff;
    stroke-width: 1.7;
}

.ch22-electron.is-excited {
    filter: drop-shadow(0 0 5px rgb(107 78 162 / 0.75));
}

.ch22-metal {
    fill: #e7eff1;
    stroke: #9bafb7;
    stroke-width: 1.2;
}

.ch22-lamp-body {
    fill: #e9f2f4;
    stroke: var(--ch22-ink);
    stroke-width: 1.8;
}

.ch22-lamp-aperture {
    fill: var(--ch22-ink);
    stroke: var(--ch22-ink);
    stroke-width: 1.2;
}

.ch22-lamp-bulb {
    fill: #fff1b8;
    stroke: var(--ch22-photon);
    stroke-width: 2;
}

.ch22-glass {
    fill: rgb(126 191 211 / 0.24);
    stroke: #548da0;
    stroke-width: 1.8;
}

.ch22-zinc-plate {
    fill: #d7e2e5;
    stroke: var(--ch22-ink);
    stroke-width: 2;
}

.ch22-conductor,
.ch22-leaf {
    fill: none;
    stroke: var(--ch22-ink);
    stroke-linecap: round;
}

.ch22-conductor {
    stroke-width: 4;
}

.ch22-electroscope-housing {
    fill: rgb(230 242 245 / 0.42);
    stroke: #78939d;
    stroke-width: 2;
}

.ch22-leaf-pivot {
    fill: var(--ch22-ink);
    stroke: #fff;
    stroke-width: 1.4;
}

.ch22-leaf {
    stroke: var(--ch22-secondary);
    stroke-width: 4.2;
}

.ch22-leaf.is-fixed {
    stroke: var(--ch22-ink);
}

.ch22-surface {
    stroke: var(--ch22-ink);
    stroke-width: 2;
}

.ch22-plot {
    stroke-width: 2.35;
}

.ch22-plot.is-primary { stroke: var(--ch22-primary); }
.ch22-plot.is-secondary { stroke: var(--ch22-secondary); }
.ch22-plot.is-extrapolation {
    stroke: var(--ch22-primary);
    stroke-width: 1.4;
    stroke-dasharray: 7 6;
}
.ch22-plot.is-intensity-overlay {
    stroke: var(--ch22-secondary);
    stroke-width: 1.35;
    stroke-dasharray: 4 5;
}

.ch22-point {
    fill: var(--ch22-primary);
    stroke: #fff;
    stroke-width: 1.5;
}

.ch22-photon.is-discrete {
    fill: var(--ch22-photon);
    stroke: #fff;
    stroke-width: 1.4;
}

.ch22-wavefront {
    fill: none;
    stroke: var(--ch22-primary);
    stroke-width: 1.7;
    stroke-linecap: round;
}

.ch22-wavefront.is-diffracted {
    stroke-width: 1.55;
}

.ch22-aperture,
.ch22-electron-source {
    fill: #d8e4e7;
    stroke: var(--ch22-line);
    stroke-width: 1.25;
}

.ch22-evidence-screen {
    fill: #edf5f1;
    stroke: #78938a;
    stroke-width: 1.35;
}

.ch22-diffraction-maximum {
    fill: color-mix(in srgb, var(--ch22-photon) 68%, #fff);
    stroke: var(--ch22-photon);
    stroke-width: 1;
}

.ch22-electron-path {
    fill: none;
    stroke: color-mix(in srgb, var(--ch22-electron) 48%, #fff);
    stroke-width: 1.25;
    stroke-dasharray: 5 5;
}

.ch22-impact.is-evidence-impact {
    stroke: #fff;
    stroke-width: 1.25;
}

.ch22-crystal {
    fill: #d8e4e7;
    stroke: var(--ch22-line);
    stroke-width: 1.3;
}

.ch22-screen {
    fill: #eef5f1;
    stroke: #78938a;
    stroke-width: 1.6;
}

.ch22-ring {
    fill: none;
    stroke: var(--ch22-electron);
    stroke-width: 1.35;
}

.ch22-ring.is-guide {
    stroke-dasharray: 6 5;
}

.ch22-ring.is-evidence-ring {
    stroke-width: 1.75;
}

.ch22-impact {
    fill: var(--ch22-electron);
}

.ch22-energy-level {
    stroke: var(--ch22-ink);
    stroke-width: 1.7;
}

.ch22-energy-level.is-limit {
    stroke: var(--ch22-line);
    stroke-dasharray: 7 6;
}

.ch22-spectrum-band,
.ch22-spectrum-dark {
    stroke: var(--ch22-line);
    stroke-width: 1.15;
}

.ch22-spectrum-dark { fill: #15242b; }

.ch22-spectrum-line {
    stroke-width: 3.2;
}

.ch22-spectrum-line.is-absorption {
    stroke: #16272d;
    stroke-width: 4;
}

@media (max-width: 600px) {
    :is(
        [data-unit-visual-extension="photon_quantum_scale"],
        [data-unit-visual-extension="photon_energy_momentum_ledger"],
        [data-unit-visual-extension="photoelectric_electroscope_evidence"],
        [data-unit-visual-extension="photoelectric_interaction_timeline"],
        [data-unit-visual-extension="photoelectric_graph_evidence"],
        [data-unit-visual-extension="wave_particle_evidence_map"],
        [data-unit-visual-extension="electron_diffraction_timeline"],
        [data-unit-visual-extension="atomic_energy_transition_timeline"],
        [data-unit-visual-extension="line_spectrum_builder"]
    ) {
        padding: 0.78rem;
        border-radius: 1rem;
    }

    :is(
        [data-unit-visual-extension="photon_quantum_scale"],
        [data-unit-visual-extension="photon_energy_momentum_ledger"],
        [data-unit-visual-extension="photoelectric_electroscope_evidence"],
        [data-unit-visual-extension="photoelectric_interaction_timeline"],
        [data-unit-visual-extension="photoelectric_graph_evidence"],
        [data-unit-visual-extension="wave_particle_evidence_map"],
        [data-unit-visual-extension="electron_diffraction_timeline"],
        [data-unit-visual-extension="atomic_energy_transition_timeline"],
        [data-unit-visual-extension="line_spectrum_builder"]
    ) .ch22-visual-controls {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.38rem;
    }

    :is(
        [data-unit-visual-extension="photon_quantum_scale"],
        [data-unit-visual-extension="photon_energy_momentum_ledger"],
        [data-unit-visual-extension="photoelectric_electroscope_evidence"],
        [data-unit-visual-extension="photoelectric_interaction_timeline"],
        [data-unit-visual-extension="photoelectric_graph_evidence"],
        [data-unit-visual-extension="wave_particle_evidence_map"],
        [data-unit-visual-extension="electron_diffraction_timeline"],
        [data-unit-visual-extension="atomic_energy_transition_timeline"],
        [data-unit-visual-extension="line_spectrum_builder"]
    ) .ch22-visual-control {
        height: 38px;
        font-size: max(12px, var(--unit-text-meta, 11px));
    }

    :is(
        [data-unit-visual-extension="photoelectric_interaction_timeline"],
        [data-unit-visual-extension="electron_diffraction_timeline"],
        [data-unit-visual-extension="atomic_energy_transition_timeline"]
    ) .ch22-timeline-controls {
        grid-template-columns: minmax(0, 1fr);
        gap: 0.45rem;
        padding: 0.46rem;
    }

    :is(
        [data-unit-visual-extension="photoelectric_interaction_timeline"],
        [data-unit-visual-extension="electron_diffraction_timeline"],
        [data-unit-visual-extension="atomic_energy_transition_timeline"]
    ) .ch22-timeline-play {
        width: 100%;
        min-height: 42px;
    }

    :is(
        [data-unit-visual-extension="photoelectric_interaction_timeline"],
        [data-unit-visual-extension="electron_diffraction_timeline"],
        [data-unit-visual-extension="atomic_energy_transition_timeline"]
    ) .ch22-timeline-output {
        grid-column: 1 / -1;
        text-align: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    :is(
        [data-unit-visual-extension="photon_quantum_scale"],
        [data-unit-visual-extension="photon_energy_momentum_ledger"],
        [data-unit-visual-extension="photoelectric_electroscope_evidence"],
        [data-unit-visual-extension="photoelectric_interaction_timeline"],
        [data-unit-visual-extension="photoelectric_graph_evidence"],
        [data-unit-visual-extension="wave_particle_evidence_map"],
        [data-unit-visual-extension="electron_diffraction_timeline"],
        [data-unit-visual-extension="atomic_energy_transition_timeline"],
        [data-unit-visual-extension="line_spectrum_builder"]
    ) * {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}