/* exxam.ru — физика: схемы, графики, векторы, цепи и шкалы приборов.
   Скоуп — body.physics (страницы раздела физики). Базовые компоненты
   (.card, .figrow, .mono, .fx) берутся из base.css/content.css/task.css,
   здесь только то, чего нет в информатике. */

body.physics {
  --phys-a: #58c7ff;
  --phys-b: #ffc857;
  --phys-soft: rgba(88, 199, 255, .12);
}
[data-theme="light"] body.physics {
  --phys-a: #0b6b8a;
  --phys-b: #9a6a00;
  --phys-soft: rgba(11, 107, 138, .1);
}
@media (prefers-color-scheme: light) {
  :root:not([data-theme]) body.physics {
    --phys-a: #0b6b8a;
    --phys-b: #9a6a00;
    --phys-soft: rgba(11, 107, 138, .1);
  }
}

body.physics .phys-fig {
  margin: 16px 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel-2);
}

body.physics .phys-fig svg {
  display: block;
  width: 100%;
  height: auto;
}

body.physics .phys-fig figcaption {
  margin-top: 8px;
  color: var(--muted);
  font-size: 13px;
  text-align: center;
}

/* Векторы на схеме: стрелка + подпись. */
body.physics .vec-line {
  stroke: var(--mint);
  stroke-width: 2.4;
  fill: none;
}

body.physics .vec-head {
  fill: var(--mint);
}

body.physics .vec-label {
  fill: var(--ink);
  font-size: 14px;
  font-weight: 600;
}

/* Графики v(t), x(t), p(V): оси и сетка. */
body.physics .graph-axis {
  stroke: var(--muted);
  stroke-width: 1.4;
}

body.physics .graph-axis-head {
  fill: var(--muted);
  stroke: none;
}

body.physics .graph-grid {
  stroke: var(--line);
  stroke-width: 1;
}

body.physics .graph-dash {
  stroke: var(--phys-b);
  stroke-width: 1.2;
  stroke-dasharray: 5 5;
  opacity: .55;
}

body.physics .graph-line {
  stroke: var(--phys-a);
  stroke-width: 2.8;
  fill: none;
  stroke-linejoin: round;
  stroke-linecap: round;
}

body.physics .graph-point {
  fill: var(--phys-b);
  stroke: var(--panel);
  stroke-width: 2;
}

body.physics .graph-area {
  fill: var(--phys-soft);
  stroke: none;
}

body.physics .graph-label,
body.physics .graph-axis-label {
  fill: var(--muted);
  font-family: var(--mono);
  font-size: 13px;
}

/* Математические подписи внутри SVG (foreignObject + KaTeX). */
body.physics .fig-math {
  display: flex;
  align-items: center;
  height: 100%;
  overflow: visible;
  white-space: nowrap;
  color: var(--ink);
  font-family: var(--sans);
  font-size: 15px;
  line-height: 1;
}

body.physics .fig-math.center {
  justify-content: center;
  text-align: center;
}

body.physics .fig-math.left {
  justify-content: flex-start;
  text-align: left;
}

body.physics .fig-math.right {
  justify-content: flex-end;
  text-align: right;
}

/* Внутри подписи формула и единицы выравниваются по базовой линии,
   а внешний flex только центрирует всю подпись по высоте. */
body.physics .fig-inner {
  display: inline-flex;
  align-items: baseline;
  white-space: nowrap;
}

body.physics .fig-math .katex {
  font-size: 1.05em;
}

/* Единицы у осей — заметно мельче самих обозначений. */
body.physics .fig-unit {
  font-size: .4em;
}

body.physics .ref-thumb-in .fig-math {
  font-size: 28px;
}

body.physics .viewer .fig-math {
  font-size: 26px;
}

/* Подписи осей — крупнее остальных математических подписей. */
body.physics .fig-math.axis-title {
  font-size: 20px;
}

body.physics .ref-thumb-in .fig-math.axis-title {
  font-size: 34px;
}

body.physics .viewer .fig-math.axis-title {
  font-size: 30px;
}

body.physics .graph-axis-label {
  fill: var(--ink);
  font-size: 12px;
}

body.physics .graph-area-a {
  fill: color-mix(in srgb, var(--phys-a) 20%, transparent);
  stroke: none;
}

body.physics .graph-area-b {
  fill: color-mix(in srgb, var(--phys-b) 18%, transparent);
  stroke: none;
}

/* ---------- механика: пружины, тело, силы ---------- */
body.physics .phys-wall,
body.physics .phys-wall-tick {
  stroke: var(--ink);
  stroke-width: 2;
  fill: none;
}

body.physics .phys-spring {
  stroke: var(--phys-a);
  stroke-width: 2.4;
  fill: none;
  stroke-linejoin: round;
}

body.physics .phys-body {
  fill: var(--panel);
  stroke: var(--ink);
  stroke-width: 2;
}

body.physics .phys-arrow {
  stroke: var(--ink);
  stroke-width: 2.4;
  fill: none;
}

body.physics .phys-arrow-head {
  fill: var(--ink);
}

body.physics .phys-label {
  fill: var(--ink);
  font-family: var(--mono);
  font-size: 13px;
}

body.physics .phys-dim {
  stroke: var(--muted);
  stroke-width: 1.4;
  stroke-dasharray: 4 4;
}

body.physics .phys-floor {
  stroke: var(--muted);
  stroke-width: 2;
}

body.physics .force-arrow {
  stroke: var(--coral);
  stroke-width: 2.6;
  fill: none;
}

body.physics .force-arrow-head {
  fill: var(--coral);
}

body.physics .force-label {
  fill: var(--coral);
  font-family: var(--mono);
  font-size: 14px;
  font-weight: 700;
}

/* ---------- электродинамика: заряды и цепи ---------- */
body.physics .phys-charge {
  fill: var(--phys-soft);
  stroke: var(--phys-a);
  stroke-width: 2.4;
}

body.physics .circuit-wire {
  stroke: var(--ink);
  stroke-width: 2.4;
  fill: none;
}

body.physics .circuit-comp {
  stroke: var(--phys-a);
  stroke-width: 2.6;
  fill: none;
}

body.physics .circuit-comp-fill {
  fill: var(--panel);
  stroke: var(--phys-a);
  stroke-width: 2.4;
}

body.physics .circuit-label {
  fill: var(--ink);
  font-family: var(--mono);
  font-size: 14px;
  font-weight: 700;
}

body.physics .circuit-arrow {
  stroke: var(--phys-b);
  stroke-width: 2;
  fill: none;
}

body.physics .circuit-arrow-head {
  fill: var(--phys-b);
}

/* ---------- ядро и распады ---------- */
body.physics .nucleus {
  fill: var(--phys-soft);
  stroke: var(--phys-a);
  stroke-width: 2.4;
}

body.physics .nucleus-alt {
  fill: color-mix(in srgb, var(--phys-b) 16%, transparent);
  stroke: var(--phys-b);
}

body.physics .nucleus-label {
  fill: var(--ink);
  font-family: var(--mono);
  font-size: 18px;
  font-weight: 700;
}

body.physics .nucleus-note {
  fill: var(--muted);
  font-family: var(--mono);
  font-size: 12px;
}

body.physics .nucleus-plus {
  fill: var(--muted);
  font-family: var(--mono);
  font-size: 22px;
}

body.physics .nucleus-arrow {
  stroke: var(--muted);
  stroke-width: 2;
  fill: none;
}

body.physics .nucleus-arrow-head {
  fill: var(--muted);
}

/* ---------- приборы: шкалы и термометр ---------- */
body.physics .gauge-arc {
  stroke: var(--muted);
  stroke-width: 2;
  fill: none;
}

body.physics .gauge-tick {
  stroke: var(--muted);
  stroke-width: 1.2;
}

body.physics .gauge-tick.major {
  stroke: var(--ink);
  stroke-width: 2;
}

body.physics .gauge-label {
  fill: var(--ink);
  font-family: var(--mono);
  font-size: 13px;
}

body.physics .gauge-needle {
  stroke: var(--coral);
  stroke-width: 3;
  stroke-linecap: round;
}

body.physics .gauge-hub {
  fill: var(--coral);
}

body.physics .gauge-unit {
  fill: var(--muted);
  font-family: var(--mono);
  font-size: 14px;
}

body.physics .gauge-caption {
  fill: var(--phys-b);
  font-family: var(--mono);
  font-size: 14px;
  font-weight: 700;
}

body.physics .thermo-tube {
  fill: var(--panel);
  stroke: var(--muted);
  stroke-width: 2;
}

body.physics .thermo-fill {
  fill: var(--coral);
}

body.physics .thermo-bulb {
  fill: var(--panel);
  stroke: var(--muted);
  stroke-width: 2;
}

body.physics .thermo-fill-bulb {
  fill: var(--coral);
}

body.physics .thermo-tick {
  stroke: var(--muted);
  stroke-width: 1.4;
}

body.physics .thermo-label,
body.physics .thermo-unit,
body.physics .thermo-note {
  fill: var(--muted);
  font-family: var(--mono);
  font-size: 13px;
}

/* Электрические цепи. */
body.physics .circuit-wire {
  stroke: var(--ink);
  stroke-width: 2;
  fill: none;
}

body.physics .circuit-node {
  fill: var(--ink);
}

body.physics .circuit-label {
  fill: var(--muted);
  font-size: 13px;
}

/* Шкалы измерительных приборов. */
body.physics .scale-arc {
  stroke: var(--muted);
  stroke-width: 1.6;
  fill: none;
}

body.physics .scale-tick {
  stroke: var(--muted);
  stroke-width: 1.2;
}

body.physics .scale-needle {
  stroke: var(--coral);
  stroke-width: 2.4;
}

body.physics .scale-value {
  fill: var(--ink);
  font-size: 13px;
  font-weight: 600;
}

/* Ключевая формула в «Разборе задачи»: отдельный акцентный блок. */
body.physics .phys-formula {
  margin: 22px 0 24px;
  padding: 20px 24px;
  border: 1px solid var(--phys-a);
  border-left: 4px solid var(--phys-b);
  border-radius: 14px;
  background:
    radial-gradient(circle at 0 0, color-mix(in srgb, var(--phys-b) 10%, transparent), transparent 55%),
    var(--panel-2);
  box-shadow: 0 18px 40px -34px var(--phys-a);
}

body.physics .phys-formula-label {
  display: block;
  margin-bottom: 8px;
  font-family: var(--mono);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--phys-b);
}

body.physics .phys-formula-body {
  overflow-x: auto;
  text-align: center;
  line-height: 1.25;
}

body.physics .phys-formula-body .katex {
  font-size: 2em;
}

body.physics .phys-formula-note {
  margin: 12px 0 0;
  color: var(--muted);
  font-size: 14.5px;
  line-height: 1.6;
}

@media (max-width: 680px) {
  body.physics .phys-formula {
    padding: 16px;
  }
  body.physics .phys-formula-body .katex {
    font-size: 1.7em;
  }
}

/* Формулы в условиях и разборах: на физике они несут основную нагрузку,
   поэтому крупнее, чем в информатике. В шагах решения — ещё заметнее. */
body.physics .katex {
  font-size: 1.3em;
}

body.physics .step .body .katex,
body.physics .theory-body .katex,
body.physics .intro .katex,
body.physics .ref-given .katex {
  font-size: 1.4em;
}

/* Ключевая формула важнее общего правила для intro. */
body.physics .intro .phys-formula-body .katex {
  font-size: 2em;
}

@media (max-width: 680px) {
  body.physics .intro .phys-formula-body .katex {
    font-size: 1.7em;
  }
}

body.physics .katex-display {
  margin: 12px 0;
  font-size: 1.4em;
}

body.physics .katex .text {
  font-family: var(--sans);
}

/* Миниатюра графика в панели «Условие задачи». */
body.physics .ref-thumb-in svg {
  width: 100%;
  height: auto;
  display: block;
}

/* В правой панели и в увеличенном просмотре SVG масштабируется целиком,
   поэтому подписи внутри увеличиваем отдельно — примерно в два раза. */
body.physics .ref-thumb-in .graph-label,
body.physics .viewer .graph-label {
  font-size: 21px;
}

body.physics .ref-thumb-in .graph-axis-label,
body.physics .viewer .graph-axis-label {
  font-size: 24px;
}

/* Точки на графике и пунктирные засечки — тоже крупнее в миниатюре и просмотре. */
body.physics .ref-thumb-in .graph-point,
body.physics .viewer .graph-point {
  r: 7px;
  stroke-width: 3;
}

body.physics .ref-thumb-in .graph-dash,
body.physics .viewer .graph-dash {
  stroke-width: 2.4;
}

body.physics .ref-thumb-in .phys-label,
body.physics .viewer .phys-label {
  font-size: 26px;
}

body.physics .ref-thumb-in .force-label,
body.physics .viewer .force-label,
body.physics .ref-thumb-in .circuit-label,
body.physics .viewer .circuit-label {
  font-size: 28px;
}

body.physics .ref-thumb-in .nucleus-label,
body.physics .viewer .nucleus-label {
  font-size: 34px;
}

body.physics .ref-thumb-in .nucleus-note,
body.physics .viewer .nucleus-note,
body.physics .ref-thumb-in .nucleus-plus,
body.physics .viewer .nucleus-plus {
  font-size: 24px;
}

body.physics .ref-thumb-in .gauge-label,
body.physics .viewer .gauge-label,
body.physics .ref-thumb-in .thermo-label,
body.physics .viewer .thermo-label {
  font-size: 26px;
}

body.physics .ref-thumb-in .gauge-unit,
body.physics .viewer .gauge-unit,
body.physics .ref-thumb-in .gauge-caption,
body.physics .viewer .gauge-caption,
body.physics .ref-thumb-in .thermo-unit,
body.physics .viewer .thermo-unit,
body.physics .ref-thumb-in .thermo-note,
body.physics .viewer .thermo-note {
  font-size: 26px;
}
