/* MechDimension interactive tools (extends md-sim.css). Fonts: Inter (UI), Plus Jakarta Sans (headings). */
.md-tool { font-family: Inter, 'Segoe UI', Roboto, Arial, sans-serif; }
.md-tool__title { font-family: 'Plus Jakarta Sans', Inter, sans-serif; letter-spacing: -0.01em; }
.md-tool__eyebrow { font-family: 'Plus Jakarta Sans', Inter, sans-serif; font-weight: 700; letter-spacing: .07em; }
.md-tool .md-seg__btn, .md-tool .md-btn, .md-tool .md-mini-q__opt, .md-tool .md-card-chip { font-family: Inter, 'Segoe UI', Roboto, Arial, sans-serif; }
.md-tool__body { grid-template-columns: minmax(0, 1fr); }
.md-tool__body > *, .md-tool__grid2 > * { min-width: 0; }
.md-tool__body > * + * { margin-top: 0; }
.md-tool__fine { font-size: 13px; }
.md-tool__count { margin: 8px 0 0; color: var(--sim-text); font-weight: 600; font-size: 14px; }
.md-tool__live { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.md-tool__note { margin-top: 10px; background: var(--sim-panel); border-left: 3px solid var(--sim-blue); border-radius: 8px; padding: 10px 12px; color: var(--sim-text); font-size: 14.5px; }
.md-tool__eq { background: var(--sim-panel); border-radius: 10px; padding: 10px 14px; overflow-x: auto; overflow-y: hidden; color: #fff; }
.md-tool__eq .katex, .md-db__eq .katex, .md-db__work .katex, .md-db__latex .katex { color: #fff; }
.md-tool__eq .katex-display { margin: .4em 0; }
.md-tool__eq:has(.md-eq-part) { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px 28px; }
.md-eq-part { display: inline-block; max-width: 100%; overflow-x: auto; overflow-y: hidden; padding: 4px 0; white-space: nowrap; }
.md-eq-part .katex { font-size: 1.12em; }
.md-db__work.md-tool__eq { justify-content: flex-start; margin-top: 8px; }
.md-tool__readouts { margin-top: 12px; }
.md-tool__assume { margin-top: 4px; }
.md-tool__save { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.md-tool__save p { margin: 0; }
.md-tool .md-ctl { margin-bottom: 12px; }
.md-tool h4 { font-family: 'Plus Jakarta Sans', Inter, sans-serif; letter-spacing: -0.005em; }

/* Hotspot scenes */
.md-tool .md-scene { touch-action: manipulation; }
.md-tool .md-hotspot { font-family: Inter, sans-serif; display: inline-flex; align-items: center; justify-content: center; padding: 0; min-width: 40px; min-height: 40px; }
.md-tool .md-hotspot:hover { transform: translate(-50%, -50%) scale(1.08); }
@media (prefers-reduced-motion: reduce) { .md-tool .md-hotspot:hover { transform: translate(-50%, -50%); } }
.md-fa__card h4, .md-fm__card h4 { margin-top: 8px; }
.md-fa__tag { border: 1px solid var(--sim-line); border-radius: 10px; padding: 8px 12px 10px; margin: 10px 0 0; }
.md-fa__tag legend { font-weight: 700; padding: 0 4px; color: #fff; }
.md-fa__fb { margin: 6px 0 0; min-height: 1.4em; }
.md-fa__gauge { margin: 4px 0 0; }
.md-fm__scene { width: 100%; }

/* Timeline */
.md-timeline { margin-top: 12px; }
.md-timeline:focus-visible { outline: 3px solid var(--sim-gold); outline-offset: 2px; }
.md-timeline__card { display: flex; flex-direction: column; gap: 4px; }
.md-timeline__card p { margin: 2px 0; }
.md-timeline__year { font-family: 'Plus Jakarta Sans', Inter, sans-serif; font-size: 17px; }
.md-timeline__tags { display: flex; gap: 6px; flex-wrap: wrap; }
.md-timeline__btn { margin-top: 6px; align-self: flex-start; }
.md-timeline__anim { width: 100%; height: 120px; margin-top: 8px; border-radius: 8px; border: 1px solid var(--sim-line); display: block; }
.md-tor { margin-top: 16px; }
.md-tor__canvas { width: 100%; height: 240px; border-radius: 8px; border: 1px solid var(--sim-line); background: #0B1116; display: block; }

/* Sorter */
.md-sorter__pool { min-height: 52px; padding: 10px; border-radius: 10px; background: var(--sim-panel); margin: 10px 0 12px; }
.md-sorter__drop { appearance: none; width: 100%; text-align: left; background: transparent; border: 0; color: #fff; font: 700 16px 'Plus Jakarta Sans', Inter, sans-serif; padding: 4px 2px 8px; cursor: pointer; min-height: 44px; }
.md-sorter__drop:focus-visible { outline: 3px solid var(--sim-gold); outline-offset: 2px; }
.md-sorter__bin { transition: background .15s, border-color .15s; }
.md-card-chip { display: flex; flex-direction: column; gap: 4px; max-width: 100%; touch-action: none; user-select: none; }
.md-card-chip__back { font-size: 13.5px; color: var(--sim-text); font-weight: 400; }
.md-card-chip__retry { font-size: 12px; color: var(--sim-gold); }
.md-card-chip--ghost { position: fixed; z-index: 9999; pointer-events: none; opacity: .9; box-shadow: 0 8px 24px rgba(0, 0, 0, .45); }
.md-cross-row { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.md-cross { font-size: 12px; padding: 1px 7px; border-radius: 99px; }
.md-cross--yes { background: rgba(46, 167, 221, .2); color: #7FCFF3; }
.md-cross--no { background: rgba(255, 255, 255, .06); color: var(--sim-muted); }
.md-boundary { margin-top: 16px; }
.md-boundary__scene { max-width: 760px; background: #0B1116; border: 1px solid var(--sim-line); border-radius: 10px; overflow: hidden; margin: 8px 0 12px; }
.md-boundary__scene svg { width: 100%; height: auto; display: block; touch-action: none; }
.md-boundary__inputs { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; margin: 6px 0 10px; }
.md-boundary__inputs label { display: flex; flex-direction: column; gap: 4px; font-size: 14px; }
.md-boundary__out p { margin: 4px 0; }
.md-boundary__dm { font-size: 17px; }

/* Dimension Builder */
.md-db__pane { margin-top: 12px; }
.md-db__label, .md-db__row label { display: flex; flex-direction: column; gap: 4px; font-size: 14px; max-width: 360px; margin-bottom: 12px; }
.md-db__row { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px; }
.md-db__row label { max-width: none; margin-bottom: 0; }
.md-db__blocks { display: flex; flex-wrap: wrap; gap: 8px; align-content: flex-start; padding: 14px; background: #0B1116; border: 1px solid var(--sim-line); border-radius: 10px; min-height: 120px; }
.md-db__block { display: inline-flex; align-items: center; justify-content: center; min-width: 52px; height: 52px; padding: 0 10px; border-radius: 8px; font: 700 18px 'Plus Jakarta Sans', Inter, sans-serif; color: #04131C; background: #2EA7DD; }
.md-db__block--L { background: #F5B83D; }
.md-db__block--T { background: #9CE37D; }
.md-db__block--th { background: #E879C9; }
.md-db__block.is-neg { background: transparent; color: #fff; border: 2px dashed currentColor; }
.md-db__block--L.is-neg { color: #F5B83D; }
.md-db__block--T.is-neg { color: #9CE37D; }
.md-db__latex { overflow-x: auto; }
.md-db__table { margin-top: 12px; }
.md-db__table tr.is-current th, .md-db__table tr.is-current td { color: var(--sim-gold); font-weight: 700; }
.md-db__table td { font-variant-numeric: tabular-nums; }
.md-db__check { margin-bottom: 10px; }
.md-db__eq { overflow-x: auto; }
.md-db__btns { display: flex; flex-wrap: wrap; gap: 8px; }
.md-db__btns .is-correct { border-color: #1E8E5A; background: rgba(30, 142, 90, .25); }
.md-db__btns .is-wrong { border-color: #C8402F; background: rgba(200, 64, 47, .22); }
.md-db__fb p { margin: 8px 0 0; }
.md-db__work { overflow-x: auto; overflow-y: hidden; padding: 2px 0; }

/* Channel Flow */
.md-cf__canvas { width: 100%; height: 230px; border-radius: 10px; border: 1px solid var(--sim-line); background: #0B1116; display: block; }

/* Pump Power */
.md-pp__h { margin: 4px 0 10px; color: #fff; font-size: 16px; }
.md-pp__row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 12px; }
.md-pp__row label { display: flex; flex-direction: column; gap: 4px; font-size: 14px; }
.md-pp__bar { display: flex; height: 22px; border-radius: 6px; overflow: hidden; background: #0A0F13; border: 1px solid var(--sim-line); }
.md-pp__seg { display: block; height: 100%; }
.md-pp__seg--water { background: #2EA7DD; }
.md-pp__seg--pump { background: #F5B83D; }
.md-pp__seg--motor { background: #C8402F; }
.md-pp__key { color: var(--sim-muted); line-height: 1.8; }
.md-pp__dot { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 5px; vertical-align: middle; }

/* Gear Train */
.md-gear__wrap { position: relative; width: 100%; aspect-ratio: 16 / 10; background: #0B1116; border: 1px solid var(--sim-line); border-radius: 10px; overflow: hidden; }
.md-gear__canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }

.md-tool-mount:not([data-ready]) { min-height: 280px; background: #0F151A; border-radius: 14px; display: flex; align-items: center; justify-content: center; color: #9FB0BD; }
.md-tool-mount:not([data-ready])::before { content: 'Loading interactive…'; font: 600 15px Inter, sans-serif; }

@media (max-width: 600px) {
	.md-pp__row { grid-template-columns: 1fr; }
	.md-tool .md-hotspot { width: 34px; height: 34px; min-width: 34px; min-height: 34px; font-size: 13px; box-shadow: 0 0 0 4px rgba(46, 167, 221, .25); }
	.md-tor__canvas { height: 200px; }
	.md-db__block { min-width: 44px; height: 44px; font-size: 16px; }
}
