*,
*::before,
*::after {
  box-sizing: border-box;
}

:root {
  --bp1-gadget-color: #adff2f;
  --bp2-gadget-color: #0efbff;
  --temp-color: #ffff00;
}

html {
  height: 100%;
}

body {
  margin: 0;
  height: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  overflow: hidden;
  background: #1e1e1e;
  font-family: "Segoe UI", "Yu Gothic UI", "Meiryo", sans-serif;
  display: flex;
  align-items: center;
  justify-content: center;
}

.monitor {
  position: relative;
  /* 16:9 をビューポート内に収める（上下・左右とも切れない） */
  width: min(100vw, calc(100vh * 1920 / 1080), 1920px);
  width: min(100vw, calc(100dvh * 1920 / 1080), 1920px);
  max-height: 100vh;
  max-height: 100dvh;
  aspect-ratio: 1920 / 1080;
  container-type: size;
  container-name: monitor;
  background: #1e1e1e;
  overflow: hidden;
  flex-shrink: 0;
}

.monitor__raster {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: fill;
  object-position: center;
  display: block;
  pointer-events: none;
  user-select: none;
}

/* 個別レイヤーPNGは合成画像と二重になるため非表示（assets/layers に保管） */
.figma-layers {
  display: none;
}

/* プラント外気温 — Figma 171:7 / 143:5・143:9
   ※背景画像には含まれない。HTMLオーバーレイで描画する */
.plant-header-layer {
  position: absolute;
  inset: 0;
  z-index: 20;
  pointer-events: none;
}

.plant-header {
  position: absolute;
  pointer-events: none;
  overflow: visible;
  background: transparent;
}

/* No1 — Figma 143:5 x=945 y=30 w=235 h=45 */
.plant-header--bp1 {
  left: calc(945 / 1920 * 100%);
  top: calc(30 / 1080 * 100%);
  width: calc(235 / 1920 * 100%);
  height: calc(45 / 1080 * 100%);
}

/* No2 — Figma 143:9 x=1671 y=24 w=235 h=45 */
.plant-header--bp2 {
  left: calc(1671 / 1920 * 100%);
  top: calc(24 / 1080 * 100%);
  width: calc(235 / 1920 * 100%);
  height: calc(45 / 1080 * 100%);
}

.plant-header__name,
.plant-header__outs-label,
.plant-header__outs-value,
.plant-header__dtime-label,
.plant-header__dtime-value {
  position: absolute;
  margin: 0;
  padding: 0;
  font-family: "Inter", "Segoe UI", "Yu Gothic UI", "Meiryo", sans-serif;
  font-weight: 700;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  text-shadow:
    0 0 2px #000,
    0 1px 2px #000;
  white-space: nowrap;
  user-select: none;
}

/* 143:2 / 143:15 — NoN プラント（24px @ 1080） */
.plant-header__name {
  left: calc(3 / 235 * 100%);
  top: calc(0 / 45 * 100%);
  font-size: calc(24 / 1080 * 100cqh);
  letter-spacing: -0.08em;
  color: #fff;
}

@supports not (font-size: 1cqh) {
  .plant-header__name {
    font-size: clamp(14px, 1.25vw, 24px);
  }
}

/* 143:3 / 143:10 — 外気温ピル */
.plant-header__outs-pill {
  position: absolute;
  left: calc(142 / 235 * 100%);
  top: calc(7 / 45 * 100%);
  width: calc(93 / 235 * 100%);
  height: calc(18 / 45 * 100%);
  display: block;
  object-fit: fill;
  pointer-events: none;
  user-select: none;
}

/* 143:4 / 143:11 — 外気温ラベル（14px @ 1080） */
.plant-header__outs-label {
  left: calc(149 / 235 * 100%);
  top: calc(8 / 45 * 100%);
  font-size: calc(14 / 1080 * 100cqh);
  letter-spacing: -0.08em;
  color: #fff;
  opacity: 0.85;
}

@supports not (font-size: 1cqh) {
  .plant-header__outs-label {
    font-size: clamp(9px, 0.73vw, 14px);
  }
}

/* bp1_temp.outs / bp2_temp.outs（ピル内・黄色） */
.plant-header__outs-value {
  left: calc(198 / 235 * 100%);
  top: calc(8 / 45 * 100%);
  min-width: calc(30 / 235 * 100%);
  padding: 0 2px;
  box-sizing: border-box;
  font-size: calc(14 / 1080 * 100cqh);
  letter-spacing: -0.08em;
  color: var(--temp-color);
  background: transparent;
}

@supports not (font-size: 1cqh) {
  .plant-header__outs-value {
    font-size: clamp(9px, 0.73vw, 14px);
  }
}

.plant-header__outs-value--flash {
  text-shadow:
    0 0 8px rgba(255, 255, 0, 0.9),
    0 0 2px #000;
}

/* 143:7 / 143:13 */
.plant-header__dtime-label {
  left: calc(0 / 235 * 100%);
  top: calc(28 / 45 * 100%);
  font-size: calc(14 / 1080 * 100cqh);
  letter-spacing: -0.08em;
  color: var(--temp-color);
}

/* 143:8 / 143:14 — dtime */
.plant-header__dtime-value {
  left: calc(94 / 235 * 100%);
  top: calc(28 / 45 * 100%);
  font-size: calc(14 / 1080 * 100cqh);
  letter-spacing: -0.08em;
  color: var(--temp-color);
}

@supports not (font-size: 1cqh) {
  .plant-header__dtime-label,
  .plant-header__dtime-value {
    font-size: clamp(9px, 0.73vw, 14px);
  }
}

.plant-header__dtime-value--flash {
  text-shadow:
    0 0 8px rgba(255, 255, 0, 0.9),
    0 0 2px #000;
}

.monitor-gadgets-layer {
  position: absolute;
  inset: 0;
  z-index: 10;
  pointer-events: none;
}

/* BP1 計量槽 — Figma bp1 計量槽（2:51288）上段・bp2-kei（75:2）と同型の黒枠 */
.bp1-gadget {
  position: absolute;
  width: calc(50 / 1920 * 100%);
  height: calc(66 / 1080 * 100%);
  pointer-events: none;
  container-type: size;
  container-name: bp1-gadget-cq;
}

.bp1-gadget--kei {
  left: calc(549 / 1920 * 100%);
  top: calc(334 / 1080 * 100%);
}

/* BP1 ミキサー — Figma 2:51288 中段（出荷番号 y=415 → 枠 top 416） */
.bp1-gadget--mixer {
  left: calc(549 / 1920 * 100%);
  top: calc(416 / 1080 * 100%);
}

/* BP1 ホッパー — Figma 2:51288 下段（出荷番号 y=495 → 枠 top 498） */
.bp1-gadget--hopper {
  left: calc(549 / 1920 * 100%);
  top: calc(498 / 1080 * 100%);
}

.bp1-gadget__text-face {
  position: absolute;
  inset: 0;
}

.bp1-gadget__txt {
  position: absolute;
  margin: 0;
  padding: 0 2px;
  overflow: hidden;
  box-sizing: border-box;
  font-family: "Inter", "Segoe UI", "Yu Gothic UI", "Meiryo", sans-serif;
  font-weight: 700;
  font-size: 15cqh;
  line-height: 1;
  color: var(--bp1-gadget-color);
  text-shadow:
    0 0 2px #000,
    0 1px 2px #000;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  user-select: none;
}

@supports not (font-size: 1cqh) {
  .bp1-gadget__txt {
    font-size: calc(15 / 1080 * 100vh);
  }
}

.bp1-gadget__txt--k2-ship,
.bp1-gadget__txt--m-2-ship,
.bp1-gadget__txt--h-2-ship {
  left: 0;
  top: 0;
  width: 50%;
  height: calc(18 / 66 * 100%);
  justify-content: center;
}

.bp1-gadget__txt--k3-ship,
.bp1-gadget__txt--m-3-ship,
.bp1-gadget__txt--h-3-ship {
  left: 50%;
  top: 0;
  width: 50%;
  height: calc(18 / 66 * 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.bp1-gadget__txt--k0-mix,
.bp1-gadget__txt--m-0-mix,
.bp1-gadget__txt--h-0-mix {
  left: 0;
  top: calc(16 / 66 * 100%);
  width: 100%;
  height: calc(18 / 66 * 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.bp1-gadget__txt--k1-amount,
.bp1-gadget__txt--m-1-amount,
.bp1-gadget__txt--h-1-amount {
  left: 0;
  top: calc(32 / 66 * 100%);
  width: 100%;
  height: calc(18 / 66 * 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.bp1-gadget__txt--k4-batch,
.bp1-gadget__txt--m-4-batch,
.bp1-gadget__txt--h-4-batch {
  left: 0;
  top: calc(48 / 66 * 100%);
  width: 100%;
  height: calc(18 / 66 * 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.bp1-gadget__txt--flash {
  color: var(--bp1-gadget-color);
  text-shadow:
    0 0 8px rgba(173, 255, 47, 0.95),
    0 0 2px #000;
}

/* Figma bp2-kei（75:2）— 計量槽・出荷番号行のデータ枠 */
.bp2-gadget {
  position: absolute;
  width: calc(50 / 1920 * 100%);
  height: calc(66 / 1080 * 100%);
  pointer-events: none;
  container-type: size;
  container-name: bp2-gadget-cq;
}

.bp2-gadget--kei {
  left: calc(1637 / 1920 * 100%);
  top: calc(305 / 1080 * 100%);
}

/* ミキサーA — Figma bp2-mixA（77:2）81×66 */
.bp2-gadget--mixA {
  left: calc(1337 / 1920 * 100%);
  top: calc(395 / 1080 * 100%);
  width: calc(81 / 1920 * 100%);
  overflow: visible;
}

/* 出荷番号行 — Figma 44:23 m1_2 / 44:26 m1_3 @ 枠幅81（微調整済み） */
.bp2-gadget--mixA .bp2-gadget__txt--m1-2-ship {
  left: calc(5 / 81 * 100%);
  top: 0;
  width: calc(34 / 81 * 100%);
  height: calc(18 / 66 * 100%);
}

.bp2-gadget--mixA .bp2-gadget__txt--m1-3-ship {
  left: calc(30 / 81 * 100%);
  top: 0;
  width: calc(42 / 81 * 100%);
  height: calc(18 / 66 * 100%);
  padding: 0;
  box-sizing: border-box;
  transform: translateX(-4%);
}

/* 配合番号・出荷量・バッチNo. — 黒枠の中央（Figma 値セル位置） */
.bp2-gadget--mixA .bp2-gadget__txt--m1-0-mix {
  left: calc(18 / 81 * 100%);
  top: calc(16 / 66 * 100%);
  width: calc(38 / 81 * 100%);
  height: calc(18 / 66 * 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.bp2-gadget--mixA .bp2-gadget__txt--m1-1-amount {
  left: calc(18 / 81 * 100%);
  top: calc(32 / 66 * 100%);
  width: calc(35 / 81 * 100%);
  height: calc(18 / 66 * 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.bp2-gadget--mixA .bp2-gadget__txt--m1-4-batch {
  left: calc(18 / 81 * 100%);
  top: calc(48 / 66 * 100%);
  width: calc(38 / 81 * 100%);
  height: calc(18 / 66 * 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

/* ミキサーB — Figma bp2-mixB（77:3）79×66 */
.bp2-gadget--mixB {
  left: calc(1721 / 1920 * 100%);
  top: calc(395 / 1080 * 100%);
  width: calc(79 / 1920 * 100%);
  overflow: visible;
}

.bp2-gadget--mixB .bp2-gadget__txt--m2-2-ship {
  left: calc(5 / 79 * 100%);
  top: 0;
  width: calc(34 / 79 * 100%);
  height: calc(18 / 66 * 100%);
}

.bp2-gadget--mixB .bp2-gadget__txt--m2-3-ship {
  left: calc(30 / 79 * 100%);
  top: 0;
  width: calc(42 / 79 * 100%);
  height: calc(18 / 66 * 100%);
  padding: 0;
  box-sizing: border-box;
  transform: translateX(-4%);
}

.bp2-gadget--mixB .bp2-gadget__txt--m2-0-mix {
  left: calc(12 / 79 * 100%);
  top: calc(16 / 66 * 100%);
  width: calc(41 / 79 * 100%);
  height: calc(18 / 66 * 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.bp2-gadget--mixB .bp2-gadget__txt--m2-1-amount {
  left: calc(12 / 79 * 100%);
  top: calc(32 / 66 * 100%);
  width: calc(41 / 79 * 100%);
  height: calc(18 / 66 * 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.bp2-gadget--mixB .bp2-gadget__txt--m2-4-batch {
  left: calc(12 / 79 * 100%);
  top: calc(48 / 66 * 100%);
  width: calc(41 / 79 * 100%);
  height: calc(18 / 66 * 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

/* ホッパーA — Figma bp2-hopA（77:4）70×66 */
.bp2-gadget--hopA {
  left: calc(1344 / 1920 * 100%);
  top: calc(477 / 1080 * 100%);
  width: calc(70 / 1920 * 100%);
  overflow: visible;
}

.bp2-gadget--hopA .bp2-gadget__txt--h1-2-ship {
  left: calc(5 / 70 * 100%);
  top: 0;
  width: calc(28 / 70 * 100%);
  height: calc(18 / 66 * 100%);
}

.bp2-gadget--hopA .bp2-gadget__txt--h1-3-ship {
  left: calc(28 / 70 * 100%);
  top: 0;
  width: calc(40 / 70 * 100%);
  height: calc(18 / 66 * 100%);
  padding: 0;
  box-sizing: border-box;
  transform: translateX(-4%);
}

.bp2-gadget--hopA .bp2-gadget__txt--h1-0-mix,
.bp2-gadget--hopA .bp2-gadget__txt--h1-1-amount,
.bp2-gadget--hopA .bp2-gadget__txt--h1-4-batch {
  left: calc(14 / 70 * 100%);
  width: calc(34 / 70 * 100%);
  height: calc(18 / 66 * 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.bp2-gadget--hopA .bp2-gadget__txt--h1-0-mix {
  top: calc(16 / 66 * 100%);
}

.bp2-gadget--hopA .bp2-gadget__txt--h1-1-amount {
  top: calc(32 / 66 * 100%);
}

.bp2-gadget--hopA .bp2-gadget__txt--h1-4-batch {
  top: calc(48 / 66 * 100%);
}

/* ホッパーB — Figma bps-hopB（77:5）75×66 */
.bp2-gadget--hopB {
  left: calc(1722 / 1920 * 100%);
  top: calc(477 / 1080 * 100%);
  width: calc(75 / 1920 * 100%);
  overflow: visible;
}

.bp2-gadget--hopB .bp2-gadget__txt--h2-2-ship {
  left: calc(5 / 75 * 100%);
  top: 0;
  width: calc(30 / 75 * 100%);
  height: calc(18 / 66 * 100%);
}

.bp2-gadget--hopB .bp2-gadget__txt--h2-3-ship {
  left: calc(28 / 75 * 100%);
  top: 0;
  width: calc(40 / 75 * 100%);
  height: calc(18 / 66 * 100%);
  padding: 0;
  box-sizing: border-box;
  transform: translateX(-4%);
}

.bp2-gadget--hopB .bp2-gadget__txt--h2-0-mix,
.bp2-gadget--hopB .bp2-gadget__txt--h2-1-amount,
.bp2-gadget--hopB .bp2-gadget__txt--h2-4-batch {
  left: calc(14 / 75 * 100%);
  width: calc(37 / 75 * 100%);
  height: calc(18 / 66 * 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.bp2-gadget--hopB .bp2-gadget__txt--h2-0-mix {
  top: calc(16 / 66 * 100%);
}

.bp2-gadget--hopB .bp2-gadget__txt--h2-1-amount {
  top: calc(32 / 66 * 100%);
}

.bp2-gadget--hopB .bp2-gadget__txt--h2-4-batch {
  top: calc(48 / 66 * 100%);
}

.bp2-gadget__text-face {
  position: relative;
  width: 100%;
  height: 100%;
}

.bp2-gadget__txt {
  position: absolute;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0 2px;
  overflow: hidden;
  text-align: center;
  font-weight: 700;
  line-height: 1;
  font-size: calc(15 / 66 * 100cqh);
  color: var(--bp2-gadget-color);
  text-shadow:
    0 0 2px #000,
    0 1px 2px #000;
  white-space: nowrap;
  user-select: none;
}

@supports not (font-size: 1cqh) {
  .bp2-gadget__txt {
    font-size: calc(15 / 1080 * 100vh);
  }
}

/* k2 — 出荷番号の黒枠・左半分（枠 50×66 の上段） */
.bp2-gadget__txt--k2-ship {
  left: 0;
  top: 0;
  width: 50%;
  height: calc(18 / 66 * 100%);
  justify-content: center;
}

/* k3 — 出荷番号の黒枠・右半分（Figma 44:57） */
.bp2-gadget__txt--k3-ship {
  left: 50%;
  top: 0;
  width: 50%;
  height: calc(18 / 66 * 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

/* k0 — 配合番号の黒枠の中央（2行目・Figma 44:56 y=321） */
.bp2-gadget__txt--k0-mix {
  left: 0;
  top: calc(16 / 66 * 100%);
  width: 100%;
  height: calc(18 / 66 * 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

/* k1 — 出荷量の黒枠の中央（3行目・Figma 44:55） */
.bp2-gadget__txt--k1-amount {
  left: 0;
  top: calc(32 / 66 * 100%);
  width: 100%;
  height: calc(18 / 66 * 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

/* k4 — バッチNo.の黒枠の中央（4行目・Figma 44:54 y=353） */
.bp2-gadget__txt--k4-batch {
  left: 0;
  top: calc(48 / 66 * 100%);
  width: 100%;
  height: calc(18 / 66 * 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.bp2-gadget__txt--flash {
  color: #fff;
  text-shadow:
    0 0 8px rgba(14, 251, 255, 0.9),
    0 0 2px #000;
}

/* 稼働状況（オレンジ文字）— Figma 2:51602 */
.status-frame {
  position: absolute;
  z-index: 15;
  left: calc(639 / 1920 * 100%);
  top: calc(335 / 1080 * 100%);
  width: calc(1014 / 1920 * 100%);
  height: calc(106 / 1080 * 100%);
  pointer-events: none;
  overflow: visible;
}

/* 白枠 — Figma Group 6:57（5 つの Vector） */
.status-frame__boxes {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: fill;
  object-position: center;
  display: block;
  pointer-events: none;
  user-select: none;
}

.status-text-layer {
  z-index: 1;
  position: absolute;
  inset: 0;
  container-type: size;
  container-name: status;
  pointer-events: none;
}

.status-slot {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0 2px;
  overflow: hidden;
  box-sizing: border-box;
  font-family: "Inter", "Segoe UI", "Yu Gothic UI", "Meiryo", sans-serif;
  font-weight: 700;
  line-height: 1;
  color: #ff9500;
  -webkit-font-smoothing: antialiased;
  text-shadow:
    0 0 2px #000,
    0 1px 2px #000;
  white-space: nowrap;
  letter-spacing: 0.06em;
  font-size: calc(9 / 104.21 * 100cqh);
  user-select: none;
}

@supports not (font-size: 1cqh) {
  .status-slot {
    font-size: clamp(7px, 0.85vw, 9px);
  }
}

/* 白枠（Vector）と同じ外接矩形 — Figma Group 6:57 */
.status-slot[data-box-node-id="2:51604"] {
  left: 0%;
  top: 0%;
  width: 5.1149%;
  height: 12.1198%;
  font-size: calc(9 / 104.21 * 100cqh);
  letter-spacing: 0.08em;
  padding: 0 1px;
}

@supports not (font-size: 1cqh) {
  .status-slot[data-box-node-id="2:51604"] {
    font-size: clamp(9px, 1vw, 11px);
  }
}

.status-slot[data-box-node-id="2:51611"] {
  left: 0.0445%;
  top: 33.3692%;
  width: 5.1149%;
  height: 12.1198%;
  font-size: calc(9 / 104.21 * 100cqh);
  letter-spacing: 0.08em;
  padding: 0 1px;
}

@supports not (font-size: 1cqh) {
  .status-slot[data-box-node-id="2:51611"] {
    font-size: clamp(9px, 1vw, 11px);
  }
}

.status-slot[data-box-node-id="2:51625"] {
  left: 77.2097%;
  top: 87.8812%;
  width: 5.1149%;
  height: 12.1198%;
  font-size: calc(9 / 104.21 * 100cqh);
  letter-spacing: 0.08em;
  padding: 0 1px;
}

@supports not (font-size: 1cqh) {
  .status-slot[data-box-node-id="2:51625"] {
    font-size: clamp(9px, 1vw, 11px);
  }
}

.status-slot[data-box-node-id="2:51618"] {
  left: 86.0571%;
  top: 27.078%;
  width: 5.1149%;
  height: 12.1198%;
  font-size: calc(9 / 104.21 * 100cqh);
  letter-spacing: 0.08em;
  padding: 0 1px;
}

@supports not (font-size: 1cqh) {
  .status-slot[data-box-node-id="2:51618"] {
    font-size: clamp(9px, 1vw, 11px);
  }
}

.status-slot[data-box-node-id="2:51632"] {
  left: 94.8864%;
  top: 87.8812%;
  width: 5.1149%;
  height: 12.1198%;
  font-size: calc(9 / 104.21 * 100cqh);
  letter-spacing: 0.08em;
  padding: 0 1px;
}

@supports not (font-size: 1cqh) {
  .status-slot[data-box-node-id="2:51632"] {
    font-size: clamp(9px, 1vw, 11px);
  }
}

.status-slot--flash {
  text-shadow:
    0 0 8px rgba(255, 149, 0, 0.95),
    0 0 2px #000;
}

/* 温度 — Figma 2:51638 x=459 y=32 w=1437 h=592 */
.temperature-frame {
  position: absolute;
  z-index: 8;
  left: calc(459 / 1920 * 100%);
  top: calc(32 / 1080 * 100%);
  width: calc(1437 / 1920 * 100%);
  height: calc(592 / 1080 * 100%);
  pointer-events: none;
  overflow: visible;
  container-type: size;
  container-name: temperature;
}

.temp-probe {
  position: absolute;
  right: auto;
  bottom: auto;
  display: block;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  text-align: left;
  font-family: "Inter", "Segoe UI", "Yu Gothic UI", "Meiryo", sans-serif;
  font-size: calc(11 / 1437 * 100cqw);
  font-weight: 700;
  line-height: 1;
  color: var(--temp-color);
  background: transparent;
  -webkit-font-smoothing: antialiased;
  text-shadow:
    0 0 2px #000,
    0 1px 2px #000;
  white-space: nowrap;
  user-select: none;
}

@supports not (font-size: 1cqw) {
  .temp-probe {
    font-size: clamp(9px, 0.6vw, 11px);
  }
}

/* Figma 2:51638 相対座標（絶対x-459, 絶対y-32）+ 左方向に 2px 補正 */
.temp-probe[data-node-id="6:3"] { left: 7.5852%; top: 31.7568%; }
.temp-probe[data-node-id="6:6"] { left: 11.3431%; top: 31.9257%; }
.temp-probe[data-node-id="6:5"] { left: 9.4642%; top: 31.9257%; }
.temp-probe[data-node-id="6:4"] { left: 16.1447%; top: 28.7162%; }
.temp-probe[data-node-id="171:9"] { left: 16.4231%; top: 12.5000%; }
.temp-probe[data-node-id="171:10"] { left: 16.4231%; top: 14.8649%; }
.temp-probe[data-node-id="6:10"] { left: 13.5699%; top: 62.8378%; }
.temp-probe[data-node-id="6:11"] { left: 33.1942%; top: 70.1014%; }
.temp-probe[data-node-id="6:13"] { left: -0.1392%; top: 97.9730%; }
.temp-probe[data-node-id="6:14"] { left: 2.5748%; top: 97.9730%; }
.temp-probe[data-node-id="6:12"] { left: 29.6451%; top: 61.8243%; }
.temp-probe[data-node-id="171:8"] { left: 32.4983%; top: 61.6554%; }
.temp-probe[data-node-id="168:2"] { left: 40.5706%; top: 30.7432%; }
.temp-probe[data-node-id="168:3"] { left: 43.5630%; top: 30.7432%; }
.temp-probe[data-node-id="168:4"] { left: 46.3466%; top: 30.7432%; }
.temp-probe[data-node-id="168:5"] { left: 49.1301%; top: 30.7432%; }
.temp-probe[data-node-id="6:7"] { left: 23.5908%; top: 28.5473%; }
.temp-probe[data-node-id="6:8"] { left: 21.7119%; top: 28.5473%; }
.temp-probe[data-node-id="6:9"] { left: 19.9026%; top: 28.5473%; }
.temp-probe[data-node-id="6:18"] { left: 68.1280%; top: 30.7432%; }
.temp-probe[data-node-id="6:20"] { left: 74.8086%; top: 34.4595%; }
.temp-probe[data-node-id="171:12"] { left: 76.7571%; top: 34.4595%; }
.temp-probe[data-node-id="171:13"] { left: 78.1489%; top: 14.3581%; }
.temp-probe[data-node-id="171:14"] { left: 78.1489%; top: 16.3851%; }
.temp-probe[data-node-id="6:19"] { left: 72.9297%; top: 34.4595%; }
.temp-probe[data-node-id="6:15"] { left: 60.6820%; top: 30.7432%; }
.temp-probe[data-node-id="6:16"] { left: 62.5609%; top: 30.7432%; }
.temp-probe[data-node-id="6:17"] { left: 64.4398%; top: 30.7432%; }
.temp-probe[data-node-id="6:21"] { left: 90.5358%; top: 45.2703%; }
.temp-probe[data-node-id="6:22"] { left: 93.1802%; top: 45.4392%; }
.temp-probe[data-node-id="6:23"] { left: 80.3758%; top: 73.4797%; }
.temp-probe[data-node-id="6:24"] { left: 67.7801%; top: 72.9730%; }
.temp-probe[data-node-id="6:25"] { left: 52.4704%; top: 64.0203%; }
.temp-probe[data-node-id="171:11"] { left: 55.1844%; top: 64.0203%; }
.temp-probe[data-node-id="6:26"] { left: 51.4962%; top: 72.2973%; }

.temp-probe--flash {
  text-shadow:
    0 0 8px rgba(255, 255, 0, 0.9),
    0 0 2px #000;
}

/* 2.2 など整数部が1桁のとき、見た目を揃えるためわずかに右へ */
.temp-probe--short {
  transform: translateX(0.35em);
}

.sync-status {
  position: absolute;
  right: 12px;
  bottom: 8px;
  z-index: 10;
  margin: 0;
  padding: 4px 10px;
  font-size: 11px;
  color: #94a3b8;
  background: rgba(0, 0, 0, 0.65);
  border-radius: 4px;
}

.sync-status--ok {
  color: #34d399;
}

.sync-status--err {
  color: #f87171;
}