/* BatchMath v12.9.C — Unit 6 practice styles: region and graph figures, slices and cross-section pictures, the Show Graph
   toggle, and the integral-setup answer control.
   Loaded after unit5.css (the staged multi-part answers, calculator badge and review tag come from there).
   Figures scale with the column; nothing here creates a nested scroll box. */
/* ---------- figures ---------- */
.u6-figure{margin:10px auto 4px;width:100%;max-width:460px}
.u6-graph-figure{max-width:520px}
/* compact figures (Area Below and Between Curves): the width cap is set per figure so the height stays near 265px */
.u6-figure-compact .u6-tick{font-size:inherit} /* the compact svg sets the size that keeps ticks about 11.5px on screen */
.u6-figure-compact .u6-curve,.u6-figure-compact .u6-axis,.u6-figure-compact .u6-grid,.u6-figure-compact .u6-rot,.u6-figure-compact .u6-slice,.u6-figure-compact .u6-radius-r{vector-effect:non-scaling-stroke}
.u6-svg{display:block;width:100%;height:auto;background:#050505;border:1px solid #303030;border-radius:10px}
.u6-grid{stroke:#1f1f1f;stroke-width:1}
.u6-axis{stroke:#8a8a8a;stroke-width:1.4}
.u6-tick{fill:#bdbdbd;font-size:11px;font-family:inherit;text-anchor:middle}
.u6-tick-y{text-anchor:end}
.u6-tick-start{text-anchor:start} /* y labels when the y-axis is at or past the frame's left edge (v12.9.C) */
.u6-shade{fill:rgba(255,212,0,.2);stroke:none}
.u6-curve{fill:none;stroke-width:2.4;stroke-linejoin:round;stroke-linecap:round}
.u6-graph-f{stroke:#4fb3ff;stroke-width:2.6}
.u6-rot{stroke:#ff8f93;stroke-width:2;stroke-dasharray:7 5}
.u6-mark{fill:#f4f4f4}
.u6-legend{display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:center;font-size:.86rem;color:#ddd;margin-top:6px}
.u6-key{display:inline-flex;align-items:center;gap:6px;white-space:nowrap} /* one legend entry never wraps inside itself (v12.9.C) */
.u6-swatch{display:inline-block;width:22px;height:4px;border-radius:2px;background:#4fb3ff}
.u6-swatch-rot{height:0;background:none;border-radius:0;border-top:3px dashed #ff8f93}
.u6-swatch-f{background:#4fb3ff}

/* v12.9.B: a representative slice on a region graph, one cross section drawn flat, figures side by side */
.u6-slice{stroke:#ffd400;stroke-width:3.4;stroke-linecap:round}
.u6-slice-end{fill:#ffd400}
.u6-swatch-slice{background:#ffd400}
.u6-cs-figure{max-width:230px}
.u6-cs-svg{display:block;width:100%;height:auto;background:#050505;border:1px solid #303030;border-radius:10px}
.u6-cs-shape{fill:rgba(79,179,255,.2);stroke:#4fb3ff;stroke-width:2;stroke-linejoin:round}
.u6-cs-center{fill:#f4f4f4}
/* solids: the radius R (yellow, as the slice) and r (white) from the axis, the shell drawing */
.u6-radius-r{stroke:#fff;stroke-width:2.6;stroke-linecap:round}
.u6-radius-end{fill:#fff}
.u6-axis-pt{fill:#ff8f93}
.u6-swatch-r{background:#fff}
.u6-slice-label{fill:#fff;font-family:"Times New Roman",Times,serif;font-style:italic;font-weight:700;paint-order:stroke;stroke:#050505;stroke-width:3px;stroke-linejoin:round}
.u6-cs-axis{stroke:#ff8f93;stroke-width:1.6;stroke-dasharray:7 5}
.u6-cs-hidden{fill:none;stroke:#4fb3ff;stroke-width:1.4;stroke-dasharray:4 4;opacity:.8}
.u6-cs-mark{fill:none;stroke:#bdbdbd;stroke-width:1.4}
.u6-cs-label{fill:#f4f4f4;font-family:"Times New Roman",Times,serif;font-style:italic;font-size:17px}
.u6-fig-row{display:flex;flex-wrap:wrap;gap:4px 14px;justify-content:center;align-items:flex-start;margin:4px 0}
.u6-fig-row>.u6-figure{flex:1 1 200px;width:auto;margin:6px 0}
/* the optional graph in a question: closed at first, opened and closed by the student */
.u6-graph-toggle{width:100%;margin-top:12px;text-align:center}
.u6-graph-toggle>summary{list-style:none}
.u6-graph-toggle>summary::-webkit-details-marker{display:none}
.u6-graph-btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:8px 18px;border:1px solid #454545;border-radius:9px;background:#111;color:#f4f4f4;font-weight:800;font-size:1rem;cursor:pointer}
.u6-graph-btn:hover,.u6-graph-btn:focus-visible{border-color:var(--yellow);color:var(--yellow)}
.u6-graph-toggle[open] .u6-when-closed,.u6-graph-toggle:not([open]) .u6-when-open{display:none}

/* ---------- integral setup (v12.9.C): one blank field; the setup keypad adds the integral, dx and dy keys ---------- */
.u6-setup-row{width:100%}
.bm-u6-integral-key span{font-family:"Times New Roman",Times,serif;font-size:1.45em;line-height:1}
/* v12.9.D: a piecewise brace in a split explanation cannot wrap; on narrow phones it is set a little smaller */
@media (max-width:420px){.u6-piecewise{font-size:86%}}
/* v13.0.A/B (experimental): the 3D model of a solid with known cross sections (Volume by Cross Sections) */
.u6-3d{width:100%;margin-top:12px;text-align:center}
.u6-3d-stage{margin:12px auto 0;max-width:760px;border:1px solid #2f2f2f;border-radius:14px;background:#050505;overflow:hidden;text-align:left}
.u6-3d-view{width:100%;min-height:260px}
.u6-3d-canvas{display:block;width:100%;touch-action:none;cursor:grab}
.u6-3d-canvas:active{cursor:grabbing}
.u6-3d-bar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px 12px;padding:8px 12px;border-top:1px solid #1f1f1f;font-size:.9rem;color:#bdbdbd}
.u6-3d-reset,.u6-3d-slice{min-height:34px;padding:4px 12px;border:1px solid #454545;border-radius:8px;background:#111;color:#f4f4f4;font-weight:700;font-size:.9rem;cursor:pointer}
.u6-3d-reset:hover,.u6-3d-reset:focus-visible,.u6-3d-slice:hover,.u6-3d-slice:focus-visible{border-color:var(--yellow);color:var(--yellow)}
/* v13.0.D (experimental): Transparent / Opaque display control beside Reset view */
.u6-3d-actions{display:inline-flex;flex-wrap:wrap;align-items:center;gap:8px}
.u6-3d-display{display:inline-flex;border:1px solid #454545;border-radius:8px;overflow:hidden}
.u6-3d-mode{min-height:34px;padding:4px 11px;border:0;background:#111;color:#bdbdbd;font-weight:700;font-size:.9rem;cursor:pointer}
.u6-3d-mode+.u6-3d-mode{border-left:1px solid #454545}
.u6-3d-mode[aria-pressed="true"]{background:#2b2b2b;color:var(--yellow)}
.u6-3d-mode[aria-pressed="false"]:hover{color:#f4f4f4}
.u6-3d-mode:focus-visible{outline:2px solid var(--yellow);outline-offset:-2px}
/* v13.0.E (experimental): Hide / Show the highlighted slice (styled like Reset view); its legend entry dims while hidden */
.u6-3d-legend .u6-3d-off{opacity:.45}
.u6-3d-legend{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 16px;padding:0 12px 12px;font-size:.9rem;color:#d8d8d8}
.u6-3d-key{display:inline-block;width:14px;height:14px;border-radius:3px;margin-right:6px;vertical-align:-2px}
.u6-3d-key-base{background:rgba(255,212,0,.32);border:1px solid #f4f4f4}
.u6-3d-key-solid{background:rgba(74,163,255,.45);border:1px solid #9fd0ff}
.u6-3d-key-slice{background:#ffd400}
.u6-3d-note{margin:0;padding:28px 14px;color:#bdbdbd;text-align:center}
.u6-3d-s{font-family:"Times New Roman",Times,serif;font-style:italic;font-size:1.1em}
/* v13.0.C (experimental): Solids of Revolution models (the axis of rotation in pink; which rotation a model shows) */
.u6-3d-key-axis{background:#ff4fa3;height:4px;vertical-align:3px}
.u6-3d-for{margin:0 auto 6px;font-size:.92rem;color:#d8d8d8}
.u6-3d-title{padding:10px 12px 0;font-size:.95rem;font-weight:700;color:#f4f4f4;text-align:center}