/* Integration methods (calculus-bc/assets/tools/integration-methods.js). OWNED BY THIS TOOL ONLY
   (builder T3). The plot colours of the other trainers (Okabe-Ito based): the integrand in the
   course ink with its area tinted; in the parts picture ∫u dv blue and ∫v du orange; the two
   partial fractions blue dashed and green dash-dot; limits green dashed. Lighter in dark mode;
   dash and shape carry the meaning too. */
.im-card{display:grid;gap:14px;grid-template-columns:minmax(0,1fr);}
.im-fig{display:flex;flex-direction:column;gap:6px;min-width:0;}
.im-head{display:flex;flex-direction:column;gap:6px;align-items:center;}
.im-eq{margin:0;font:600 15px var(--font-ui);color:var(--ink);text-align:center;overflow-x:auto;max-width:100%;}
.im-big{font-size:18px;}
.im-plots{display:grid;gap:8px;grid-template-columns:minmax(0,1fr);min-width:0;}
.im-plots.is-wide{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
.im-p{min-width:0;}
.im-p[hidden]{display:none;}
.im-p svg{display:block;width:100%;height:auto;touch-action:none;user-select:none;-webkit-user-select:none;}
.ls-root .im-fig{flex:1;min-height:0;}
.ls-root .im-plots{flex:1;min-height:0;}
.ls-root .im-plots:not(.is-wide){grid-template-rows:minmax(0,1fr);grid-auto-rows:minmax(0,1fr);}
.ls-root .im-p{position:relative;min-height:130px;}
.ls-root .im-p svg{position:absolute;inset:0;width:100%;height:100%;}

.im-uv-card{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;width:100%;max-width:560px;}
.im-cell{display:flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:4px 6px;border:2px solid var(--line);border-radius:10px;background:var(--paper);font:600 15px var(--font-ui);color:var(--ink);}
.im-cell.is-q{color:var(--ink-2,#777);border-style:dashed;}
.im-k{font:800 12px var(--font-ui);color:var(--cink);text-transform:none;}
.im-legend{margin:0;display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;justify-content:center;font:600 13px var(--font-ui);color:var(--ink-2,#555);}
.im-key{display:inline-block;width:22px;height:0;border-top:3px solid #B0123A;vertical-align:middle;}
.im-key-1{border-top:3px dashed #0072B2;} .im-key-2{border-top:3px dashed #009E73;}
.im-warn{border-left:4px solid #D55E00;padding:6px 10px;background:rgba(213,94,0,.08);border-radius:6px;}

.im-ctl{display:flex;flex-direction:column;gap:10px;}
.im-scenes{display:grid;grid-template-columns:repeat(3,1fr);border:2px solid var(--line);border-radius:12px;padding:3px;gap:3px;background:var(--paper);}
.im-scene{min-height:40px;border:0;border-radius:9px;background:transparent;color:var(--ink);font:800 13.5px var(--font-ui);cursor:pointer;padding:0 4px;}
.im-scene[aria-pressed="true"]{background:var(--cink);color:#fff;}
:root[data-theme="dark"] .im-scene[aria-pressed="true"]{background:#D6BFF5;color:#1E0F33;}
.im-chips{display:flex;flex-wrap:wrap;gap:6px;}
.im-chip{min-height:44px;padding:0 13px;border-radius:999px;border:2px solid var(--line);background:var(--paper);color:var(--ink);font:800 14px var(--font-ui);cursor:pointer;white-space:nowrap;}
.im-chip[aria-pressed="true"]{border-color:var(--cink);background:var(--cink);color:#fff;}
:root[data-theme="dark"] .im-chip[aria-pressed="true"]{background:#D6BFF5;border-color:#D6BFF5;color:#1E0F33;}
@media (max-width:640px){.ls-root .im-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;}.ls-root .im-chips::-webkit-scrollbar{display:none;}}

.calc-plot .im-f{fill:none;stroke:#B0123A;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;}
.calc-plot .im-area{fill:#B0123A;fill-opacity:.16;stroke:none;}
.calc-plot .im-area.is-done{fill-opacity:.26;}
.calc-plot .im-area.is-fade{fill-opacity:.12;}
.calc-plot .im-udv{fill:#0072B2;fill-opacity:.24;stroke:none;}
.calc-plot .im-vdu{fill:#D55E00;fill-opacity:.24;stroke:none;}
.calc-plot .im-small{fill:var(--paper,#fff);stroke:var(--ink-2,#666);stroke-dasharray:3 3;}
.calc-plot .im-rect{fill:none;stroke:var(--ink,#222);stroke-width:1.5;stroke-dasharray:6 4;}
.calc-plot .im-uv{fill:none;stroke:#7a4fa0;stroke-width:3;stroke-linecap:round;}
.calc-plot .im-lab{font:800 12.5px var(--font-ui);fill:var(--ink);paint-order:stroke;stroke:var(--white,#fff);stroke-width:4px;stroke-linejoin:round;}
.calc-plot .im-lab-u{fill:#00609A;} .calc-plot .im-lab-v{fill:#B34E00;} .calc-plot .im-lab-a{fill:#B0123A;}
.calc-plot .im-asym{stroke:var(--ink-2,#666);stroke-width:1.4;stroke-dasharray:4 4;}
.calc-plot .im-p1c{fill:none;stroke:#0072B2;stroke-width:2.4;stroke-dasharray:8 5;}
.calc-plot .im-p2c{fill:none;stroke:#009E73;stroke-width:2.4;stroke-dasharray:10 4 2 4;}
.calc-plot .im-xl{stroke:var(--ink-2,#666);stroke-opacity:.6;stroke-width:1;}
.calc-plot .im-d1{fill:#0072B2;} .calc-plot .im-d2{fill:#009E73;} .calc-plot .im-df{fill:#B0123A;stroke:var(--white,#fff);stroke-width:2;}
.calc-plot .im-lim{stroke:#009E73;stroke-width:2;stroke-dasharray:9 5;}
.calc-plot .im-limlab{fill:#00805C;font:800 12px var(--font-ui);paint-order:stroke;stroke:var(--white,#fff);stroke-width:4px;}
.calc-plot .im-ib{fill:none;stroke:#0072B2;stroke-width:3;stroke-linecap:round;}
.calc-plot .im-now{fill:#B0123A;stroke:var(--white,#fff);stroke-width:2;}
:root[data-theme="dark"] .calc-plot .im-f{stroke:#F590AC;} :root[data-theme="dark"] .calc-plot .im-area{fill:#F590AC;}
:root[data-theme="dark"] .calc-plot .im-udv{fill:#6BB4E8;} :root[data-theme="dark"] .calc-plot .im-vdu{fill:#F29A5C;}
:root[data-theme="dark"] .calc-plot .im-rect{stroke:#ddd;} :root[data-theme="dark"] .calc-plot .im-uv{stroke:#C7A2E6;}
:root[data-theme="dark"] .calc-plot .im-lab{stroke:#1c1c1e;}
:root[data-theme="dark"] .calc-plot .im-lab-u{fill:#6BB4E8;} :root[data-theme="dark"] .calc-plot .im-lab-v{fill:#F29A5C;} :root[data-theme="dark"] .calc-plot .im-lab-a{fill:#F590AC;}
:root[data-theme="dark"] .calc-plot .im-p1c,:root[data-theme="dark"] .calc-plot .im-ib{stroke:#6BB4E8;} :root[data-theme="dark"] .calc-plot .im-p2c,:root[data-theme="dark"] .calc-plot .im-lim{stroke:#52CFA6;}
:root[data-theme="dark"] .calc-plot .im-d1{fill:#6BB4E8;} :root[data-theme="dark"] .calc-plot .im-d2{fill:#52CFA6;} :root[data-theme="dark"] .calc-plot .im-df,:root[data-theme="dark"] .calc-plot .im-now{fill:#F590AC;stroke:#1c1c1e;}
:root[data-theme="dark"] .calc-plot .im-limlab{fill:#52CFA6;stroke:#1c1c1e;}
:root[data-theme="dark"] .im-key{border-top-color:#F590AC;} :root[data-theme="dark"] .im-key-1{border-top-color:#6BB4E8;} :root[data-theme="dark"] .im-key-2{border-top-color:#52CFA6;}

.im-handle{cursor:ew-resize;outline:none;touch-action:none;}
.im-handle .im-hitc{fill:transparent;pointer-events:all;}
.im-handle .im-halo{fill:var(--cink);fill-opacity:.15;}
.im-handle .im-dot{fill:var(--cink);stroke:var(--white,#fff);stroke-width:2.5;}
.im-handle:focus-visible .im-halo{fill-opacity:.32;stroke:var(--cink);stroke-width:2;}
:root[data-theme="dark"] .im-handle .im-dot{fill:#D6BFF5;stroke:#1c1c1e;} :root[data-theme="dark"] .im-handle .im-halo{fill:#D6BFF5;}

/* the tabular table */
.im-tab{display:block;width:100%;max-width:420px;height:auto;margin:0 auto;}
.im-th{font:800 13px var(--font-ui);fill:var(--ink-2,#555);}
.im-cellm{display:flex;align-items:center;justify-content:center;height:34px;font:600 16px var(--font-ui);color:var(--ink);}
.im-cellm.is-q{color:var(--cink);font-weight:800;}
.im-diag{stroke:#0072B2;stroke-width:2;}
.im-arrh{fill:#0072B2;}
.im-sgn-c{fill:var(--paper,#fff);stroke:#0072B2;stroke-width:2;}
.im-sgn{font:800 15px var(--font-ui);fill:#0072B2;dominant-baseline:middle;}
:root[data-theme="dark"] .im-diag,:root[data-theme="dark"] .im-sgn-c{stroke:#6BB4E8;} :root[data-theme="dark"] .im-arrh,:root[data-theme="dark"] .im-sgn{fill:#6BB4E8;}

/* Test yourself figures */
.im-qparts{display:flex;flex-direction:column;gap:8px;align-items:center;width:100%;}
.im-qparts .cd-fig,.im-qimp .cd-fig{margin:0;width:100%;}
.im-qparts svg,.im-qimp svg{display:block;width:100%;height:auto;}
.im-qimp{display:grid;gap:8px;grid-template-columns:minmax(0,1fr);width:100%;}
.im-qimp.is-wide{grid-template-columns:minmax(0,11fr) minmax(0,9fr);align-items:center;}
.im-qtab{display:flex;flex-direction:column;gap:8px;align-items:center;margin:0;}
.im-qchoose{display:flex;flex-direction:column;gap:12px;align-items:center;justify-content:center;margin:0;min-height:180px;text-align:center;}
.im-bigint{font-size:26px;color:var(--ink);overflow-x:auto;max-width:100%;}
.im-note{margin:0;max-width:520px;font:600 15px var(--font-ui);color:var(--ink);line-height:1.5;}
.im-note.is-q{color:var(--ink-2,#666);}

/* Phones: keep the lower-right corner of the plot (an axis label, the last tick) clear of the Enlarge button,
   which sits 8px from the stage corner (BC review, tools-exams). */
@media (max-width:640px){.ls-root .im-fig{padding-bottom:40px;}}