{# The MOMENTUM SPACE panel: the 2D map with its colorbar, the 3D density,
and the header toggle between them. Nothing here is orbital-specific - what
is being transformed is the controller's business.

`subheader_id`, if the including template sets it, adds an empty band under
the title for that page to name what it is transforming - the exciton page
writes the Dyson orbital's equation there. `ekin_strip` adds a vertical
energy spectrum at the left edge, mirroring the colorbar at the right.
`band_map` adds the E vs k∥ view, which shares the 2D slot and its colorbar
with the map; only a page with a list of ground-state orbitals has one.
`real_space_view` brings the real-space scene into this panel as a third view,
for a page that has no REAL SPACE panel of its own. #}
{# Momentum Space #}
<section class="panel momentum-space" data-tour="momentum-space">
    <h2 class="panel-title"
        title="I(kx, ky) = |A·k|² |ψ̃(k)|² on the hemisphere |k| = √(2 E_kin).
Intensity in arbitrary units; kx, ky in Å⁻¹.
Drag to zoom, double-click to reset, right-click for export formats."
        data-real-space-title="Ball-and-stick model with the orbital isosurface ψ(r).
Drag to rotate, scroll to zoom. Right-click for export formats.
Voxel size and isovalue are under Sampling in Plot Controls.">
        <span class="panel-title-name" id="momentum-panel-name">MOMENTUM SPACE<button type="button" class="help-badge"
                data-help="What an ARPES experiment measures: the angular distribution of the photocurrent, read as the momentum-space modulus of the orbital it came from. Within the plane-wave final-state approximation the pattern is |ψ̃(k)|², cut on the hemisphere that energy conservation fixes.">?</button></span>
        {% if real_space_view %}<span class="panel-title-name" id="real-space-panel-name" hidden>REAL SPACE<button
                type="button" class="help-badge"
                data-help="The same excited state drawn around the molecule it belongs to. The two lobe colours are the sign of the orbital; the charge density has no sign, so switching to it drops that distinction.">?</button></span>{% endif %}
        <span class="panel-title-note" id="energy-label">(E<sub>kin</sub> = 30 eV)</span>
        {% if real_space_view %}<span class="panel-title-note" id="real-space-label" hidden></span>{% endif %}
        {# Two groups, split by a rule: which space the panel is showing, then
        the options belonging to whichever one that is. #}
        <span class="panel-title-actions">
            {% if real_space_view %}<span class="badge-anchor"><button id="momentum-real-toggle"
                    class="header-toggle"
                    title="Switch between the momentum map I(kx, ky) and the real-space orbital ψ(r)">Real</button>
                <button type="button" class="help-badge"
                    data-help="The same state seen in real space rather than in momentum space. The momentum map is the Fourier transform of this orbital cut on the photoemission hemisphere, so the two views are one object in two representations.">?</button></span>
            <span class="title-actions-divider" aria-hidden="true"></span>{% endif %}
            <span class="badge-anchor"><button id="momentum-view-toggle" class="header-toggle"
                    title="Switch between the 2D momentum map and the full 3D momentum-space density">3D</button>
                <button type="button" class="help-badge"
                    data-help="Swaps the single hemisphere cut for the whole momentum-space density |ψ̃(k)|² on a Cartesian grid. The 2D map is the intersection of that density with the hemisphere, so the two are the same quantity sampled differently.">?</button></span>
            {% if real_space_view %}<span class="real-space-actions" id="real-space-actions"
                hidden>{% include "_panel_real_space_toggles.html" %}</span>{% endif %}
            {% if band_map %}<span class="badge-anchor"><button id="momentum-band-toggle"
                    class="header-toggle"
                    title="Switch between the momentum map and the band map E vs k∥.
One row per loaded orbital, cut along the k-Path set under Sampling.">Band</button>
                <button type="button" class="help-badge"
                    data-help="Energy against momentum, the second half of what an ARPES experiment records. Every orbital the list has loaded contributes a row at its own energy, cut along one line in the k-plane, so a whole valence region is read at once. The line and the energy window it is drawn over are both under Sampling, and a dashed rule marks where a bent path turns.">?</button></span>{% endif %}
        </span>
    </h2>
    {% if subheader_id %}<div class="panel-subheader" id="{{ subheader_id }}"></div>{% endif %}
    <div id="momentum-2d" class="plot-with-colorbar">
        {# Left edge, opposite the colorbar: the kinetic energy the map is cut
        at is the other axis of the same measurement, so it belongs beside the
        map rather than in a panel of its own. #}
        {% if ekin_strip %}<div id="ekin-strip"
            title="Photoemission intensity against kinetic energy: one peak per photohole of the selected exciton.
E_kin = hν + E_orbital + Ω, weighted by that hole's share of the state.
The blue rule marks the hole the map shows; the ground-state overlay is in Plot Controls.">
        </div>{% endif %}
        <div id="main-plot"></div>
        {# Shares the slot and the colorbar with the map: same intensity, same
        arbitrary units, and only one of the two is ever visible. #}
        {% if band_map %}<div id="band-plot" hidden></div>{% endif %}
        {# Title is set live by viewer.js's updateColorbarScale() (shared by
        entry.js and exciton-page.js) - it has to name the unit and, for a
        signed (dichroism) map, the symmetric range, none of which a static
        string can say. #}
        <div class="colorbar" id="colorbar">
            <button type="button" class="help-badge"
                data-help="The intensity the colours stand for, in arbitrary units. Whether the range is this map's own or shared with every other map on the page is set by Intensity Scale in Plot Controls. Nothing is drawn past the emission horizon |k| = √(2 E_kin): there is no intensity there to colour, which is not the same as an intensity of zero.">?</button>
            <span class="colorbar-label" id="colorbar-max">—</span>
            {# The stop handles are built by controls.js renderColorbarStops
            and sit over the gradient, so a colormap stop is edited where it
            is actually seen. The zero mark and cursor label are separate
            siblings so that layer's replaceChildren() never touches them. #}
            <div class="colorbar-gradient">
                <div class="colorbar-zero" id="colorbar-zero" hidden></div>
                <div class="colorbar-cursor" id="colorbar-cursor"></div>
                <div class="colorbar-stops"></div>
            </div>
            <span class="colorbar-label" id="colorbar-min">—</span>
        </div>
    </div>
    <div id="momentum-3d" hidden></div>
    {% if real_space_view %}<div id="real-space-3d" hidden></div>{% endif %}
</section>