:root {
  color-scheme: dark;
  --header-height: 44px;
  --footer-height: 18px;
  --color-pos: #42ff9e;
  --color-neg: #fe7676;
  --color-holding-total: #4176af;
  --color-asset-total:   #ffcb70;
  --color-disabled-zone: rgba(255,165,60,0.14);  /* 指数グラフ 無効時間帯(warmup/切断)の背景tint */
  --color-suppress-zone: rgba(255,255,255,0.05);  /* 大グラフ 取引抑制時間帯(仕掛時間外)の背景tint */
  /* ページ全体のスクロールバー (標準仕様 / Chrome 121+ / Firefox / Edge) */
  scrollbar-color: #2637489c #15120dab;
  scrollbar-width: thin;
}

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

html,
body {
  height: 100%;
}

body {
  position: relative;
  isolation: isolate;
  margin: 0;
  min-height: 100vh;
  height: 100vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background-color: #040608;
  background-image:
    radial-gradient(140% 120% at 8% 6%, #ffffff38 0%, #ffffff0a 28%, #ffffff00 58%),
    radial-gradient(120% 120% at 88% 8%, #6ca5dc2e 0%, #6ca5dc0d 32%, #6ca5dc00 62%),
    radial-gradient(120% 140% at 18% 88%, #58b2a524 0%, #58b2a50a 34%, #58b2a500 66%),
    linear-gradient(128deg, #1a2531 0%, #101722 24%, #0a1018 48%, #060b11 74%, #030608 100%);
  color: #f4f8ffbb;
  font-family: "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(108deg, #ffffff24 0%, #ffffff0d 24%, #ffffff03 46%, #ffffff1a 70%, #ffffff03 100%),
    radial-gradient(65% 45% at 68% 22%, #ffffff29 0%, #ffffff00 72%);
  mix-blend-mode: screen;
  opacity: 0.42;
  z-index: -1;
}

 .ai-mark-group {
  position: fixed;
  bottom: -0.55rem;
  left: 0.45rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  pointer-events: none;
  z-index: 12;
}
.ai-mark {
  width: 3.8rem;
  height: 3.8rem;
  border-radius: 0.65rem;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: visible;
  font-size: 0.88rem;
  /* allow the cube to grow outside the bounding box */
}
.ai-mark canvas {
  width: 100%;
  height: 100%;
  display: block;
  background-color: transparent;
  background: transparent;
}
.ai-mark-labels {
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 0.78rem;
  line-height: 1.1;
  color: #d2e6ff;
  text-shadow: 0 0 4px rgba(12, 20, 32, 0.65);
  letter-spacing: 0.02em;
  transform: translate(-4px, 2px);
}
.ai-mark-labels span:first-child {
  color: #7fa7d8;
}
.ai-mark-labels span:nth-child(2) {
  font-size: 0.9rem;
  font-weight: 600;
}
.ai-mark .ai-mark-fallback {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.95rem;
  color: #9ad6ff;
  pointer-events: none;
  transition: opacity 0.3s ease;
  z-index: 1;
}
.ai-mark.ai-mark--three-ready .ai-mark-fallback {
  opacity: 0;
  pointer-events: none;
}

.header-bar {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  height: var(--header-height);
  padding: 0 1rem 0 0.5rem;
  background: #03060a94;
  border-top: 1px solid #ffffff29;
  backdrop-filter: blur(8px);
  order: 999;  /* body (flex column) 内で最下部に配置 */
}

/* ★ 2026-07-03 携帯モード: header-bar を折り返して全要素を表示 (iPhone は片手操作で下部が広い方が見やすい)。
   PC は横一列(justify-content:flex-end)のまま。 携帯だけ wrap + 左寄せ + 下部に大きめスペース。
   キューブ+Einstein文字(ai-mark-group)は position:fixed で左下の別レイヤーなので、
   死活ボタン1個目の margin-left:180px(キューブ避け)は携帯では不要 → 打ち消す。
   最下行が fixed キューブと被らないよう padding-bottom を大きめに確保。 */
body.is-mobile .header-bar {
  flex-wrap: wrap;
  height: auto;
  justify-content: flex-start;
  align-content: flex-start;
  gap: 6px;
  padding: 6px 6px 3rem 6px;
}
body.is-mobile .header-bar > button[id^="header-chrome-ext-btn-"] {
  margin-left: 0 !important;
  margin-right: 0 !important;
  flex: 1 1 46% !important;   /* 死活ボタンは2個/行 */
  max-width: none !important;
}

.main-content {
  width: 100%;
  flex: 1;
  min-height: 0;
  overflow: hidden;
  display: grid;
  /* 表示順: pane-3 (左) → pane-1 (中) → pane-2 (右、細い) */
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 0.5fr);
  transition: grid-template-columns 0.38s cubic-bezier(0.4, 0, 0.2, 1);
}

body.pane-1-hidden .main-content {
  /* pane-3 (監視株) を隠す: 1列目を 0fr に */
  grid-template-columns: 0fr minmax(0, 1fr) minmax(0, 0.5fr);
}

body.pane-1-hidden .pane-3::after {
  opacity: 0;
}

body.no-transition * {
  transition: none !important;
}

.main-pane {
  position: relative;
  min-height: 0;
  padding: 1rem;
  display: flex;
}

.pane-1 {
  overflow: hidden;
  min-width: 0;
}

.pane-3 {
  overflow: hidden;
  min-width: 0;
  transition: transform 0.38s cubic-bezier(0.4, 0, 0.2, 1),
              padding 0.38s cubic-bezier(0.4, 0, 0.2, 1);
}

body.pane-1-hidden .pane-3 {
  transform: translateX(-100%);
  padding-left: 0;
  padding-right: 0;
}

.pane-1,
.pane-2 {
  border-right: none;
}

.pane-1::after,
.pane-2::after {
  content: "";
  position: absolute;
  top: 0.75rem;
  right: 0;
  width: 3px;
  height: calc(100% - 1.5rem);
  border-radius: 999px;
  background:
    linear-gradient(
      180deg,
      #ffffff8c 0%,
      #c9e9ff42 22%,
      #ffffff14 52%,
      #c4ecff4c 78%,
      #ffffff80 100%
    );
  box-shadow:
    inset 1px 0 0 #ffffff80,
    inset -1px 0 0 #78b4dc47,
    0 0 0 1px #ffffff29,
    0 0 16px #a6deff59,
    0 0 32px #85c1eb3d;
  backdrop-filter: blur(8px);
  opacity: 0.1;
}

.pane-card {
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
  width: 100%;
  border: 1px solid #0000;
  border-radius: 16px;
  background-color: #070c129e;
  background-image:
    linear-gradient(165deg, #ffffff24 0%, #9facb01f 36%, #ffffff05 100%),
    linear-gradient(160deg, #05060ac2 0%, #080d13c7 100%);
  padding: 1rem;
  box-shadow:
    inset 0 1px 0 #ffffff3d,
    inset 0 -1px 0 #ffffff0f,
    0 10px 26px #01040857;
  backdrop-filter: blur(12px) saturate(122%);
}

.pane-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(112deg, #ffffff24 0%, #ffffff00 48%);
  mix-blend-mode: screen;
  opacity: 0.36;
}

.pane-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1px;
  background:
    linear-gradient(
      138deg,
      #091a07ad 0%,
      #0d0f13b3 18%,
      #194e3724 42%,
      #040d08ad 72%,
      #172d2294 100%
    );
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  box-shadow:
    inset 0 0 0 1px #ffffff2e,
    0 0 16px #aae2ff24;
  pointer-events: none;
}

.pane-title {
  margin: 0;
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: #7d8a94;
  text-shadow: 0 1px 0 #000000b2, 0 0 14px #b6e6ff47;
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}
.pane-title .pane-title-right,
.pane-title .pane-title-sub,
.pane-title .pane-title-total { cursor: default; }
.pane-title-left {
  display: flex;
  align-items: center;
  gap: 6px;
}
#pane-yakujo .pane-title-left { white-space: nowrap; }
/* 資産パネル ヘッダ: 各ペア (信用余力 / 前日比 / 資産合計) を強制 1 行 + ペア間で折り返し可
   ペア内は baseline 揃え。 親側 align-items: last baseline で大きい値の baseline で揃える */
#pane-asset .asset-title-pair {
  display: inline-flex;
  align-items: baseline;
  white-space: nowrap;
}
/* 信用新規建余力 + 前日比: デフォルトは横 1 行、 親に余裕がない時はコンテナクエリで縦 2 段
   align-items: last baseline で 2 ペアの主要値 baseline 揃え (= 親の last baseline と一致) */
#pane-asset .asset-title-stack {
  display: inline-flex;
  flex-direction: row;
  align-items: last baseline;
  column-gap: 8px;
  row-gap: 1px;
  line-height: 1.0;
}
/* 親 (.pane-title-total) の幅が狭くなったら stack を縦 2 段に切替
   閾値 560px は実測調整値。 「stack 1 行 + 資産合計」 が横に入る境界 */
@container (max-width: 565px) {
  #pane-asset .asset-title-stack {
    flex-direction: column;
  }
}
/* 折り畳みボタン + 「資産」 を 1 塊で改行禁止 */
#pane-asset .pane-title-head {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}
.pane-title-right {
  margin-left: auto;
  font-size: 0.78rem;
  font-weight: 400;
  color: #6a8a9a;
  display: flex;
  align-items: center;
  gap: 5px;
  cursor: pointer;
  letter-spacing: 0;
}
.yakujo-filter-group {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 0;
  flex-wrap: wrap;
  justify-content: flex-end;
  row-gap: 4px;
}
.yakujo-filter-label {
  font-size: 0.78rem;
  font-weight: 400;
  color: #6a8a9a;
  display: flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
  letter-spacing: 0;
  white-space: nowrap;
  padding: 0 6px;
  border-left: 1px solid #1a3a54;
}
.yakujo-filter-label:first-child { border-left: none; }
.pending-filter-group {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 0;
}
.pending-filter-label {
  font-size: 0.78rem;
  font-weight: 400;
  color: #6a8a9a;
  display: flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
  letter-spacing: 0;
  white-space: nowrap;
  padding: 0 6px;
  border-left: 1px solid #1a3a54;
}
.pending-filter-label:first-child { border-left: none; }
.pending-error {
  font-size: 0.78rem;
  color: #e57373;
  white-space: normal;       /* 折り返し可 */
  word-break: break-word;
  min-width: 200px;
}
.yakujo-pl-estimate,
.yakujo-order-pl,
.yakujo-loss-limit,
.yakujo-min-profit,
.yakujo-elapsed-sec {
  font-size: 0.648rem;  /* = 旧 0.9em × .holding-table 0.72rem。 em 化合避け rem 固定で利確/反転を確実に同サイズに */
  white-space: nowrap;
}
/* 約定からの経過秒数: 数字 = 白太字、 単位 sec = グレー */
.yakujo-elapsed-num {
  color: #fff;
  font-weight: bold;
}
.yakujo-elapsed-unit {
  color: #888;
}
.yakujo-loss-limit-paren,
.yakujo-min-profit-paren {
  color: #888;
}
.yakujo-min-profit-row {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 5px;
}
/* 約定待ち 狙い td: 矢印 + 「反転」 ボタンを縦並び */
.yakujo-aim-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
}
.yakujo-reverse-btn,
.yakujo-evac-btn {
  font-size: 9px;
  padding: 2px 4px 0px 4px;
  border-radius: 3px;
  border: 1px solid #4a5568;
  background: #2d3748;
  color: #cbd5e0;
  cursor: pointer;
  white-space: nowrap;
  line-height: 1.1;
}
/* 即時撤収ボタンのみ「取消」ボタンと同形式の暗赤に上書き (= 反転ボタンは触らない) */
.yakujo-evac-btn {
  background: #3a1a1a;
  color: var(--color-neg);
  border-color: var(--color-neg);
}
.yakujo-reverse-btn:hover,
.yakujo-evac-btn:hover { background: #3a4a5c; }
.yakujo-evac-btn:hover { background: #5a2a2a; }
/* 段階撤収ボタン: 即時撤収と似た形だが赤めのオレンジ。 右マージン 20px */
.yakujo-stage-btn {
  font-size: 9px;
  padding: 2px 4px 0px 4px;
  border-radius: 3px;
  background: #4a2010;
  color: #ff9f79;
  border: 1px solid #ff9f79;
  cursor: pointer;
  white-space: nowrap;
  line-height: 1.1;
}
/* 約定待ち 価格修正 td 内の壁情報 (= 2026-06-03 追加) */
.yakujo-wall-info { line-height: 1.2; margin-top: 2px; text-align: right; }
.yakujo-wall-info .yakujo-wall-sell,
.yakujo-wall-info .yakujo-wall-buy {
  color: #aaa;
  white-space: nowrap;
  padding: 0 4px;
  border-radius: 2px;
}
.yakujo-wall-info .yakujo-wall-sell { background: color-mix(in srgb, var(--color-pos) 25%, transparent); }
.yakujo-wall-info .yakujo-wall-buy  { background: color-mix(in srgb, var(--color-neg) 25%, transparent); }
/* ★ 2026-07-02 壁が無い時の空プレースホルダ( )は背景透明に (高さだけ確保) */
.yakujo-wall-empty .yakujo-wall-sell,
.yakujo-wall-empty .yakujo-wall-buy { background: transparent; }
.yakujo-wall-info .yakujo-wall-price { font-size: 1.0em; font-weight: 500; color: #ccc; }
.yakujo-wall-info .yakujo-wall-qty   { font-size: 0.75em; font-weight: bold; }
.yakujo-stage-btn:hover    { background: #6a3015; }
.yakujo-stage-btn:disabled { opacity: 0.4; cursor: default; }
.yakujo-stage-btns {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  margin-top: 3px;
}
.yakujo-reverse-btn:disabled,
.yakujo-evac-btn:disabled { opacity: 0.4; cursor: default; }
/* 価格修正 td: 撤収ボタンを行の下に縦配置 (= 狙い td の反転ボタンと同じ縦並び) */
.yakujo-evac-btns {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  margin-top: 3px;
}
.yakujo-min-profit-left {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  line-height: 0.95em;
}
/* 建値 td 最低利確行 3 行目: 実効利確% (色は asset-pos/neg、 太字解除、 他2行と同じ 0.9em) */
.yakujo-min-profit-pct {
  font-weight: normal;
  font-size: 0.648rem;
}
/* 実効利確% の「%」 だけ薄く (数値はプラス/マイナス色のまま) */
.yakujo-pct-unit {
  opacity: 0.7;
}
/* 現在値 td 4 行目: 反転価格 (建値から反転攻勢_閾値% 逆行した価格) */
.yakujo-reverse-price {
  font-size: 0.648rem;
  white-space: nowrap;
}
/* 「反転」 の文字だけ字面がデカく見えるので一回り小さく (カッコ・数字は 0.648rem のまま) */
.yakujo-reverse-label {
  font-size: 0.601rem;
  display: inline-block;
  transform: translateY(-0.4px);
}
/* 損切ブロック (3行目) / 反転攻勢ブロック (4〜6行目): 親 yakujo-cur-inner と同じ縦積み・右寄せ */
.yakujo-losscut-block,
.yakujo-counter-block {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
/* 反転div: 建値td 3〜5行目 (yakujo-min-profit-left) と同じ詰め具合に。
   font-size は子 .yakujo-reverse-price が既に 0.9em で一致済 → line-height だけ揃える
   (block に font-size を足すと 0.9em×0.9em で縮むので付けない) */
.yakujo-counter-block {
  line-height: 0.95em;
  margin-top: 1.3px;
}
.yakujo-cur-inner {
  padding-top: 5px;
}
/* 現在値 td 1 行目: 現在値本体 → 建値 td 1 行目 (.yakujo-tatene-val) と同じ */
/* 2026-05-29: 色設定パネル「現在値」 カラーで描画 (= sparkline 黄色◀ マーカーと連動) */
.yakujo-cur-val {
  font-size: 1.1em;
  line-height: 1em;
  color: var(--color-current);
}
/* 現在値 td 2 行目: 現在値での損益 → 建値 td 2 行目 (.yakujo-tatene-qty) と同じ font-size/line-height */
.yakujo-cur-inner .yakujo-order-pl {
  font-weight: bold;
  font-size: 1em;
  line-height: 14px;
}
.yakujo-tatene-inner,
.yakujo-cur-inner {
  font-weight: bold;
}
.yakujo-order-price-display,
.yakujo-cur-inner,
.yakujo-tatene-inner {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
/* ★ 2026-07-02 現在値td: 上壁(全幅) / v3(左)+現在値損益(右) / 下壁(全幅) の3段grid */
/* ★ 2026-07-16 grid は td 直付けでなく内側 div に(td を display:grid にすると匿名セルにラップされ
   行高より短くなり、 行選択の inset box-shadow 下辺がズレるため)。 td は通常の table-cell に。 */
.yakujo-cur-td { vertical-align: middle; }
.yakujo-cur-grid {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  column-gap: 4px;
  height: 100%;   /* セル高いっぱいに(旧 grid-td 相当・行選択枠が全高で揃う) */
}
.yakujo-cur-grid > .yakujo-wall-info { grid-column: 1 / -1; }
.yakujo-cur-v3 { grid-column: 1; justify-self: start; }
.yakujo-cur-main { grid-column: 2; }
/* 建値 td 1 行目: 建値本体 + 狙い矢印を横並び (2026-07-01 狙い列から移設) */
.yakujo-tatene-line1 { display: flex; align-items: center; justify-content: flex-end; gap: 3px; }
.yakujo-tatene-val {
  font-size: 1.1em;
}
/* 建値 td 2 行目: 数量 (旧「数量」 列を統合)。 建値より控えめに */
.yakujo-tatene-qty {
  font-size: 1em;
  font-weight: normal;
  color: #aaa;
  white-space: nowrap;
  line-height: 0.45em;
}
/* 建値 td 2 行目の [追加] 極小ボタン (2026-07-09) */
.yakujo-add-btn {
  display: inline-block;
  vertical-align: middle;
  background: transparent;
  border: 1px solid #2a4a64;
  color: #7fa8cc;
  font-size: 8px;
  line-height: 1;
  padding: 1px 2px;
  margin-right: 2px;
  border-radius: 2px;
  cursor: pointer;
  user-select: none;
}
.yakujo-add-btn:hover {
  background: #1a3048;
  border-color: #4e9de0;
  color: #cde4ff;
}
/* パネル横断・行選択ハイライト (2026-07-10) —— 下げ狙いの背景色の上でも見えるよう、
   セルの inset box-shadow でボーダーとして描く(レイアウトを動かさない/背景色を潰さない)。 */
#holding-tbody tr.ein-row-selected > td,
#yakujo-tbody  tr.ein-row-selected > td {
  box-shadow: inset 0 3px 0 0 #00c8ff, inset 0 -3px 0 0 #00c8ff;
}
#holding-tbody tr.ein-row-selected > td:first-child,
#yakujo-tbody  tr.ein-row-selected > td:first-child {
  box-shadow: inset 3px 0 0 0 #00c8ff, inset 0 3px 0 0 #00c8ff, inset 0 -3px 0 0 #00c8ff;
}
/* ★ 2026-07-16 約定待ちは第1td(yakujo-type-cell)が display:none のため、左枠を最初の可視セル=第2td に付ける */
#yakujo-tbody tr.ein-row-selected > td:nth-child(2) {
  box-shadow: inset 3px 0 0 0 #00c8ff, inset 0 3px 0 0 #00c8ff, inset 0 -3px 0 0 #00c8ff;
}
#holding-tbody tr.ein-row-selected > td:last-child,
#yakujo-tbody  tr.ein-row-selected > td:last-child {
  box-shadow: inset -3px 0 0 0 #00c8ff, inset 0 3px 0 0 #00c8ff, inset 0 -3px 0 0 #00c8ff;
}

/* まとめ返済(Phase1): 同銘柄同方向の重複返済ハイライト + [まとめ]ボタン (2026-07-09) */
tr.yakujo-dup > td { background: rgba(255, 176, 64, 0.09); }
.yakujo-consolidate-btn {
  background: #3a2a10;
  border: 1px solid #c8912a;
  color: #ffcf7f;
  font-size: 9px;
  line-height: 1;
  padding: 1px 4px;
  margin-left: 2px;
  border-radius: 2px;
  cursor: pointer;
  user-select: none;
}
.yakujo-consolidate-btn:hover { background: #4a3616; border-color: #ffcf7f; }
.yakujo-cancel-btn {
  margin-top: 3px;
  padding: 1px 4px;
  font-size: 0.7em;
  background: #3a1a1a;
  color: var(--color-neg);
  border: 1px solid var(--color-neg);
  border-radius: 3px;
  cursor: pointer;
  line-height: 1.4;
}
.yakujo-cancel-btn:hover { background: #5a2a2a; }
.yakujo-cancel-btn:disabled { opacity: 0.4; cursor: default; }
.yakujo-ita-qty { font-size: 10px; line-height: 10px; vertical-align: top; color: #888; }
.yakujo-ita-price { font-size: 10px; line-height: 10px; vertical-align: top; text-align: left; white-space: nowrap; color: #888; }
.ita-int { display: inline-block; text-align: right; min-width: 24px; }
.ita-dec { display: inline-block; }
.result-filter-group {
  margin-left: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 8px 6px;    /* 折り返した時の行間 8px、 同じ行なら column 6px のみ */
}
.result-pl-sub {
  margin-right: 8px;
  /* width: 175px; 2026-05-20 廃止: 金額が短い時の余白除去・natural width に */
  text-align: right;
  font-size: 2.2rem;
  font-weight: 600;
  color: #8aa8c0;        /* pos/neg クラスが付かない時のフォールバック色 */
  letter-spacing: 0;
  line-height: 1;
  margin-top: -6px;
  margin-bottom: -6px;
  white-space: nowrap;
}
/* pos/neg 時のみ font-size だけ specificity を上げて prevail させ、
   color は .pane-title-pl-pos / .pane-title-pl-neg 側の指定 (緑/赤) を継承させる */
.result-pl-sub.pane-title-pl-pos,
.result-pl-sub.pane-title-pl-neg {
  font-size: 2.2rem;
}
.result-pl-sub .result-unit {
  font-size: 1.2rem;
  color: #94a2b2;
  opacity: 0.7;
  margin-left: 0.2em;
}
.result-today-label {
  font-size: 0.78rem;
  font-weight: 400;
  color: #6a8a9a;
  display: flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
  letter-spacing: 0;
  white-space: nowrap;
  transform: translateY(1px);
  margin-right: 8px;
}
/* 通算表示 / 終日グラフ の 2 label を縦並び (2026-05-20 追加)。 累計サブは外側で横位置維持 */
.result-toggles {
  display: flex;
  flex-direction: column;
}
.result-today-label input[type="checkbox"] {
  width: 11px;
  height: 11px;
  cursor: pointer;
}
.pane-title-sub {
  margin-left: auto;
  margin-right: 5px;
  padding-right: 20px;
  font-size: 0.7rem;
  font-weight: 400;
  color: #8aa8c0;
  letter-spacing: 0;
  transform: translateY(1px);
}
.pane-title-total {
  display: inline;
  align-self: flex-end;
  font-size: 1.35rem;
  font-weight: 600;
  color: #c8dff0;
  letter-spacing: 0;
  margin-right: 6px;
}
.pane-title-total-label {
  font-size: 0.7rem;
  font-weight: 400;
  color: #6a92b0;
  margin-right: 16px;
}
.pane-title-shinyo-val {
  font-size: 0.82rem;
  margin-right: 10px;
}
.yakujo-filter-group .pane-title-total-label,
.pending-filter-group .pane-title-total-label {
  margin-left: 16px;
  margin-right: 8px;
}
.yakujo-filter-group .pane-title-shinyo-val,
.pending-filter-group .pane-title-shinyo-val,
.holding-card .pane-title-right .pane-title-shinyo-val {
  color: #f0f6fe;
  font-size: 0.78rem;
  font-variant-numeric: tabular-nums;
}
.yakujo-filter-group .pane-title-shinyo-val .asset-unit,
.pending-filter-group .pane-title-shinyo-val .asset-unit,
.holding-card .pane-title-right .pane-title-shinyo-val .asset-unit {
  color: #94a2b2;
  font-size: 0.85em;
  opacity: 0.7;
}
.pane-title-pl-pos {
  font-size: 1.8rem;
  color: var(--color-pos);
  line-height: 1;
}
.pane-title-pl-neg {
  font-size: 1.8rem;
  color: var(--color-neg);
  margin-right: 10px;
  line-height: 1;
}
/* 資産パネルだけは元のサイズに戻す（投資結果パネルだけ大きい字にする） */
#pane-asset .pane-title-pl-pos,
#pane-asset .pane-title-pl-neg {
  font-size: 0.82rem;
  line-height: normal;
}
/* 資産パネルのヘッダ右側 (信用余力 / 前日比 / 資産合計) を右寄せ + ペア間で折り返し可
   align-items: last baseline で各ペアの「主要な大きい値の baseline」 を揃える */
#pane-asset .pane-title-total {
  display: flex;            /* inline-flex だと container 幅が中身依存になり不安定 */
  flex: 1;                  /* 親 h2 の残り幅を固定取得 → container query 安定 */
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: last baseline;
  margin-left: auto;
  row-gap: 4px;
  column-gap: 8px;
  container-type: inline-size;
}
#asset-title-total {
  transform: translateY(3px);
}
/* 資産合計の値だけ投資結果パネル (.result-pl-sub) と同サイズで強調 */
.asset-title-total-val {
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 1;
  color: #c8dff0;
  letter-spacing: 0;
}
.asset-title-total-val + .asset-unit {
  font-size: 1.3rem;
  color: #94a2b2;
  opacity: 0.7;
}
.pane-title-pl-rate {
  font-size: 0.82em;
  opacity: 0.8;
}

/* ── 色設定パネル ── */
#color-settings-btn {
  background: #1a2e42;
  border: 1px solid #2a4a64;
  color: #8ab4d0;
  font-size: 0.72rem;
  padding: 4px 8px;
  border-radius: 4px;
  cursor: pointer;
  opacity: 0.7;
  transition: opacity 0.15s;
  white-space: nowrap;
}
#color-settings-btn:hover {
  opacity: 1;
}
#color-settings-panel {
  display: none;
  position: fixed;
  bottom: 48px;
  right: 12px;
  z-index: 901;
  background: #0f1e2d;
  border: 1px solid #2a4a64;
  border-radius: 6px;
  padding: 12px 14px;
  min-width: 200px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.5);
}
#color-settings-panel.is-open {
  display: block;
}
#color-settings-panel h4 {
  margin: 0 0 10px;
  font-size: 0.78rem;
  color: #8ab4d0;
  letter-spacing: 0.03em;
}
.cs-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}
.cs-row label {
  font-size: 0.75rem;
  color: #6a92b0;
  flex: 1;
}
.cs-row input[type="color"] {
  width: 36px;
  height: 24px;
  padding: 1px 2px;
  border: 1px solid #2a4a64;
  border-radius: 3px;
  background: transparent;
  cursor: pointer;
}
.cs-reset {
  margin-top: 4px;
  font-size: 0.7rem;
  color: #4a7a9a;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  text-decoration: underline;
}
.cs-reset:hover {
  color: #8ab4d0;
}
.pane-collapse-btn {
  background: none;
  border: none;
  padding: 0 2px;
  cursor: pointer;
  color: #8aa0ad;
  font-size: 0.65rem;
  line-height: 1.1;
  transition: transform 0.2s;
}
.pane-collapse-btn::before {
  content: '▽';
}
.pane-card.is-collapsed .pane-collapse-btn::before {
  content: '▷';
}

.policy-title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.policy-title-row .pane-title {
  flex: 1;
}
/* 自動仕掛/撤収 ON 色 (= トグルボタンと投資方針 th 帯で共有) */
#pane-policy { --policy-on-bg: #1a3a5c; }
.policy-toggle-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 2px 8px 1px;
  font-size: 0.78rem;
  line-height: 1.3;
  border-radius: 4px;
  border: 1px solid #4a5568;
  background: #2d3748;
  color: #8a9bb0;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.policy-toggle-btn.is-on {
  background: var(--policy-on-bg, #1a3a5c);
  border-color: #4a90d9;
  color: #7ec8f7;
}
/* 売買反転 ON 強調 (= 通常 ON より派手・ON 中であることを強く意識させる) */
.policy-toggle-btn-swap.is-on {
  background: #5b21b6;            /* 派手な紫 */
  border-color: #c084fc;
  color: #fff;
  font-weight: bold;
  box-shadow: 0 0 8px 1px rgba(192, 132, 252, 0.65);
  animation: policy-swap-pulse 1.6s ease-in-out infinite;
}
@keyframes policy-swap-pulse {
  0%, 100% { box-shadow: 0 0 6px 1px rgba(192, 132, 252, 0.55); }
  50%      { box-shadow: 0 0 12px 2px rgba(192, 132, 252, 0.95); }
}
/* トレンド反転 ON 強調 (= 売買反転とは別色・橙系で区別) */
.policy-toggle-btn-trendrev.is-on {
  background: #b45309;            /* 派手な橙 */
  border-color: #fbbf24;
  color: #fff;
  font-weight: bold;
  box-shadow: 0 0 8px 1px rgba(251, 191, 36, 0.65);
  animation: policy-trendrev-pulse 1.6s ease-in-out infinite;
}
@keyframes policy-trendrev-pulse {
  0%, 100% { box-shadow: 0 0 6px 1px rgba(251, 191, 36, 0.55); }
  50%      { box-shadow: 0 0 12px 2px rgba(251, 191, 36, 0.95); }
}
.policy-toggle-sub {
  font-size: 0.5rem;
  opacity: 0.7;
}
.policy-subtitle {
  display: block;
  width: 5em;
  flex: 0 0 5em;
  text-align: right;
  font-size: 10px;
  font-weight: bold;
  margin-right: 1.5em;
  white-space: nowrap;
}
.em02 {
  width: 2em;
  flex: 0 0 2em;
}
.em07 {
  width: 7em;
  flex: 0 0 7em;
}
.normal {
  font-weight: normal;
}
.rm08 {
  margin-right: 8px;
}
.lm08 {
  margin-left: 8px;
}
.policy-last-updated {
  font-size: 0.7rem;
  color: #5a6a7a;
  white-space: nowrap;
  text-align: right;
}
/* 投資方針パネル 段階的グリッド化 (2026-05-15): 行ごと独立 2 カラム
   (= ラベル 5em | コントロール残り)。 親は flex のままで .policy-grid-row が
   width:100% で 1 行占有するので、 未変換セクションと共存して順次移行できる */
.policy-grid-row {
  width: 100%;
  box-sizing: border-box;
  position: relative;                /* 「初期値に戻す」 絶対配置の基準点 */
  display: grid;
  grid-template-columns: 6.8em 1fr;  /* 最長ラベル「閉場後注文」 5 文字 + padding が収まる幅 */
  align-items: stretch;          /* セルを行高いっぱいに伸ばす = 左列が帯になる */
  gap: 0;
  background: #0002;
  border-radius: 8px;
  margin: 0 0 1px 0;             /* 縦余白を 1/3 に詰めた (旧 3px) */
  overflow: hidden;              /* 角丸からセル背景がはみ出さない */
}
.policy-grid-row > .policy-subtitle {
  width: auto;
  flex: none;
  margin-right: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;     /* ラベル右寄せ・縦中央 */
  background: #ffffff14;         /* セクション列の背景帯 */
  padding: 1px 8px;              /* 縦余白を 1/3 に詰めた (旧 4px) */
  box-sizing: border-box;
}
/* 自動仕掛/撤収 ON のとき、 対応分類のセクション th 帯を ON 色に
   (= data-policy-grp に buy / sell を空白区切りで複数持てる) */
#investment-policy-form.is-auto-buy  .policy-grid-row[data-policy-grp~="buy"]  > .policy-subtitle,
.policy-grid-ctrl {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1px 8px;                  /* 縦 gap を 1/3 に詰めた (旧 4px) */
  min-width: 0;
  padding: 1px 8px;              /* 縦余白を 1/3 に詰めた (旧 4px) */
  box-sizing: border-box;
}
/* reset を持つ行だけ右 80px を予約 (= 「初期値に戻す」 絶対配置と重ならない)。 reset 無し行は通常 padding */
.policy-grid-ctrl:has(> .policy-reset-row) {
  padding-right: 68px;
}
/* 「初期値に戻す」: grid-row 右上に絶対配置。 コントロールは grid-ctrl の右 padding 予約領域に入らないので重ならない */
.policy-reset-row {
  position: absolute;
  top: 1px;                      /* policy-grid-ctrl の上 padding 1px と揃えた (旧 3px) */
  right: 8px;
  z-index: 1;
  display: flex;
  margin: 0;
}
/* コントロール列内の前場/後場ペアは横並び・縦中央揃え (= 元の縦積み block を上書き) */
.policy-grid-ctrl .policy-time-pair {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  margin-bottom: 0;
}

.investment-policy-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 3px;
  margin-top: 0;
  font-size: 10px;
}
.investment-policy-row select {
  font-size: 12px;
  color: #fff;
}
.policy-main {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  font-size: 10px;
}
.policy-time-btn-row {
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 16px;
}
.policy-time-rows {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.policy-time-row {
  display: block;
}
.policy-time-row > .policy-subtitle,
.policy-time-row > .policy-time-pairs,
.policy-time-row > .policy-exit-time {
  display: inline-block;
  vertical-align: bottom;
}
/* 撤収行の「開始 [セレクタ]」「完了 [セレクタ]」「(ロック株含む)」 を 1 塊として改行禁止 (2026-05-21) */
.policy-exit-time,
/* ロック株含む label: チェックボックス周りの視覚バランス調整 (2026-05-22)
   左: カッコとの密着しすぎを 1px 戻す / 右: input 自体の clickable area 余白を負マージンで詰める */
.policy-exit-locked-label input,
.policy-post-close-locked-label input {
  margin: 0 -4px 0 2px;
}
.policy-time-pairs {
  display: inline-block;
  vertical-align: bottom;
}
.policy-time-pair {
  display: block;
  margin-bottom: 4px;
}
.policy-time-pair:last-child {
  margin-bottom: 0;
}
.policy-btn-side {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
}
.policy-time-select {
  font-weight: normal;
  color: #aaa;
}
.policy-unit-row {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-right: 20px;
}
.policy-unit-select {
  font-weight: normal;
  color: #aaa;
  text-align: right;
}
.policy-label {
  font-size: 10px;
  font-family: "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
}
.policy-slowst-group, .policy-v3-group {
  display: flex;
  align-items: center;
  margin-left: 0;
}
.policy-slowst-values,
.policy-v3-values {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.policy-slowst-reset-btn,
.policy-v3-reset-btn {
  margin-left: auto;
}
.policy-slowst-row,
.policy-v3-row {
  display: flex;
  align-items: center;
  gap: 4px;
}
.policy-slowst-row {
  margin-bottom: 3px;
}
.policy-num-input {
  width: 3.2em;
  text-align: center;
  font-size: 11px;
  vertical-align: middle;
  line-height: normal;
  padding-top: 0;
  padding-bottom: 0;
  box-sizing: border-box;
}
.policy-num-input-wide { width: 4.2em; }
.policy-num-input-median { width: 5.2em; }
.policy-num-input-vol { width: 5.2em; }
/* 作戦別上限 (= 作戦ごとの投入資金枠) の枠無しテーブル */
.policy-sakusen-cap-table { border: 0; border-collapse: collapse; font-size: 11px; }
.policy-sakusen-cap-table td { border: 0; padding: 1px 4px 1px 0; vertical-align: middle; white-space: nowrap; }
.policy-cap-input { width: 7em; text-align: right; }
.policy-cap-unit { margin-left: 3px; }
/* 株価制限: 最大 999999.9 (7桁+小数1桁) なので個別に広げる。 視力対応 (user_expert_engineer.md) */
#policy-min-price { width: 7em; }
.policy-btn.policy-slowst-reset-btn,
.policy-btn.policy-v3-reset-btn {
  font-size: 10px;
  padding: 0 4px;
  margin-left: auto;
  transform: translateY(-2px);
}
.investment-policy {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.policy-suffix {
  font-size: 10px;
  margin-left: -4px;
  margin-right: -4px;
}
.policy-check-group {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.policy-btn-group {
  display: flex;
  flex-direction: row;
  gap: 6px;
}
.policy-btn {
  padding: 1.5px 5px;
  font-size: 10px;
  border-radius: 4px;
  border: 1px solid #4a5568;
  background: #2d3748;
  color: #cbd5e0;
  cursor: pointer;
  white-space: nowrap;
}
/* 同一銘柄禁止 / 決算銘柄禁止 / EMA短期 / 長期 のラベル line-height を 1em に詰める */
.policy-restrict span,
.policy-trend-group .policy-label {
  line-height: 1em;
}
.policy-btn:hover { background: #3a4a5c; }
.policy-btn-cancel { flex: 1; white-space: nowrap; }
.policy-btn-save { flex: 2; white-space: nowrap; }
.policy-btn-save { border-color: #4a90d9; color: #7ec8f7; }
.policy-btn-save:hover:not(:disabled) { background: #1e3a5a; }
.policy-btn-save:disabled,
.policy-btn-cancel:disabled { border-color: #3a4050; color: #4a5568; cursor: default; }
.policy-note {
  margin: 0 0 0 12px;
  font-size: 0.72rem;
  color: #6b7a8a;
  line-height: 1.5;
  max-width: 12em;
}
.policy-check-label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  cursor: pointer;
  color: #888;
}
.policy-check-label:has(input:checked) {
  color: inherit;
}
.policy-check-label:has(input:disabled) {
  color: #555c66;
  cursor: default;
}
.policy-check-label input:disabled {
  opacity: 0.3;
}
.policy-radio-label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  cursor: pointer;
  color: #888;
}
.policy-radio-label:has(input:checked) {
  color: inherit;
}

/* === 投資方針パネル インライン集約ユーティリティ (2026-05-16) ===
   親 .investment-policy-row が font-size:10px を継承させるので各所の font-size 指定は不要 */
/* ラベル+input+単位を 1 かたまりで折り返さないインライングループ。 行頭折り返し時の左端ズレ防止のため間隔は margin でなく gap で持つ */
.policy-ig { display:inline-flex; align-items:center; white-space:nowrap; gap:4px; }
.policy-ig.g0 { gap:0; }
.policy-ig.g6 { gap:6px; }
/* チェックボックス付きインラインラベル */
.policy-chk { display:inline-flex; align-items:center; gap:6px; white-space:nowrap; cursor:pointer; }
/* チェックボックスと文字の隙間を詰める (2026-05-22): gap 6px + margin-right -4px = net 2px */
.policy-chk input { margin-right: -4px; }
/* 数値 input 直後の全角％ (= 密着回避の僅かな逃げ) */
.policy-pct { margin-left:1px; }
/* input 幅バリアント */
.policy-w35 { width:3.5em; }
.policy-w40 { width:4em; }
.policy-w45 { width:4.5em; }
/* flex コンテナを強制改行させる 0 高さスペーサー */
.policy-rowbreak { flex-basis:100%; height:0; }
/* 最終更新行 (右寄せ・パネル上端に詰める) */
.policy-last-updated-row { width:100%; text-align:right; line-height:23px; margin:0 0 -5px 0; }
/* ヘッダの自動仕掛/撤収トグル囲い */
.policy-auto-toggle-group { display:inline-flex; gap:6px; }
/* ブラウザセクション: 縦スタック + 名称/メイン行ボックス */
.policy-br-stack { display:flex; flex-direction:column; gap:4px; flex:1; }
.policy-br-row { display:flex; align-items:center; gap:6px; border-radius:8px; }
.policy-br-row.bg2 { background:#0002; }
.policy-br-row.bg4 { background:#0004; }
.policy-br-row > input,
.policy-br-row > select { flex:1; min-width:0; }
.policy-br-row > input[type=text] { padding:2px 6px; }
.policy-subtitle.tal { text-align:left; }
/* 制限セクションの右寄せ small select (.investment-policy-row select の 12px を 10px に戻す)。 幅は銘柄により異なるので個別指定 */
.policy-sel-r { font-size:10px; text-align:right; }

.tasks-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
}

.pane-1-stack {
  width: 100%;
  min-height: 0;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.pane-1-stack > .pane-card {
  min-height: 0;
  flex: 0 0 auto;  /* デフォルト: 自然高さで固定。他ペーンが圧縮されないように */
}

/* 保有株/約定待ち は JS で flex-basis (自然高さ) と flex-grow:1 を動的設定。
   余りは flex-grow:1 同士で 1:1 に分配されるので「余白均等」 が自然に実現する。
   min-height は開いている時のみ適用 (折り畳み時はタイトルだけのコンパクト表示) */
.pane-1-stack > #pane-holding:not(.is-collapsed),
.pane-1-stack > #pane-yakujo:not(.is-collapsed) {
  min-height: 80px;
}

.pane-2-stack {
  width: 100%;
  min-height: 0;
  flex: 1 1 auto;
  display: grid;
  grid-template-rows: auto auto auto auto minmax(0, 1fr) auto;
  gap: 0.75rem;
}

.pane-2-stack > .pane-card {
  min-height: 0;
}

.pane-3-stack {
  width: 100%;
  min-height: 0;
  flex: 1 1 auto;
  display: grid;
  /* 2026-06-14 指標カード(auto=内容高)を上に追加・監視株(1fr=残り)が下 */
  grid-template-rows: auto minmax(0, 1fr);
  gap: 0.75rem;
}

.indicator-card {
  min-height: 0;
}

.indicator-placeholder {
  margin: 0;
  padding: 0.4rem 0.25rem;
  font-size: 0.72rem;
  color: #6b7d8a;
}

/* 指標パネル ヘッダ部 (= 折り畳んでも残るタイトル行右寄せ。 上がる/下がる/解除) */
/* 投資結果ヘッダ: 「投資結果」ラベルを少し上へ + その下に日付ブロックを縦積み (2026-07-15) */
.result-title-col {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
  align-self: flex-start;   /* h2内で上寄せ = ラベルが少し上へ */
  margin-top: -2px;
}
.result-title-col .ind-date-block { margin-left: 0; }   /* タイトル直下に左揃え */
/* 折り畳みボタンの三角を「投資結果」ラベルの高さに合わせる = 上寄せ(トップアンカー)。
   幅が狭くヘッダが縦に伸びても常にラベルと揃う (中央寄せだと下がる)。 */
#pane-result .pane-collapse-btn { align-self: flex-start; margin-top: 2px; }

/* 指標ヘッダ 日付ブロック (2026-07-15) : ◁ 7月5日(水) ▷ */
.ind-date-block {
  display: inline-flex;
  align-items: center;
  gap: 0;
  margin-left: 10px;
  font-size: 0.82rem;
  color: #cfe0f0;
  white-space: nowrap;
}
.ind-date-label {
  text-align: center;
  font-variant-numeric: tabular-nums;
  font-size: 0.72rem;
  margin: 0 1px;
  transform: translateY(1px);
}
.ind-date-arrow {
  border: none;
  background: transparent;
  color: #9fc0e0;
  cursor: pointer;
  font-size: 0.95rem;
  line-height: 1;
  padding: 1px 0;
  border-radius: 3px;
  display: inline-flex;
  align-items: center;
}
.ind-date-last { margin-left: 1.5px; }   /* skip(▷|)だけ ▷ から少し離す */
.ind-date-tri { height: 0.95em; width: auto; display: block; }   /* ◁▷ = skip三角と同じパス・同スケール */
.ind-date-arrow:hover { color: #ffffff; background: #ffffff1f; }
/* 最終開場日ジャンプ = SVGアイコン(三角+縦棒)。 グリフ合成だと上下ズレするためSVG化(2026-07-15) */
.ind-date-last { display: inline-flex; align-items: center; }
.ind-date-last-svg { width: 0.95em; height: 0.95em; display: block; }
.ind-date-arrow:disabled { opacity: 0.3; cursor: default; }
.ind-date-arrow:disabled:hover { background: transparent; color: #9fc0e0; }
/* 履歴中(今日以外を選択): 日付ブロックを橙で強調＝ライブでないことを明示 */
.ind-date-block.is-history { color: #ffcf8f; }
.ind-date-block.is-history .ind-date-label { font-weight: 700; }
.ind-date-block.is-history .ind-date-arrow { color: #ffbf6f; }

.indicator-header {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 6px;
  justify-content: flex-end;
}
/* ★ 2026-07-02 指標パネルのタイトル行を flex に → 「指標」ラベル左・日経225/TOPIX/4dグラフ/矢印を右端へ寄せる
   (pane-title が block のままだと indicator-header の margin-left:auto が効かなかった) */
#pane-indicator .pane-title { display: flex; align-items: center; width: 100%; }
/* ★ 2026-07-02 indicator-btn-group が広く場所を取るのを抑える (幅 17% 固定・grow させない) */
#pane-indicator .indicator-btn-group { flex: 0 0 3%; }
.indicator-btn {
  font-size: 0.7rem;
  padding: 2px 4px;
  border-radius: 4px;
  border: 1px solid #2a5070;
  background: #0a1929cc;
  color: #b8d2e8;
  cursor: pointer;
  white-space: nowrap;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.indicator-btn:hover { border-color: #4a90c0; }
.indicator-btn-up    { color: var(--color-pos, #7affc6); border-color: var(--color-pos, #7affc6); }
.indicator-btn-up:hover    { box-shadow: 0 0 8px var(--color-pos, #7affc6); }
.indicator-btn-down  { color: var(--color-neg, #79bcff); border-color: var(--color-neg, #79bcff); }
.indicator-btn-down:hover  { box-shadow: 0 0 8px var(--color-neg, #79bcff); }
.indicator-btn-flat  { color: #e0e6ea; border-color: #8a97a1; }
.indicator-btn-flat:hover  { box-shadow: 0 0 8px rgba(224,230,234,0.25); }
/* アイコン3ボタン(上/下/フラット)は固定正方形+中央寄せ=横長解消・サイズ統一 */
.indicator-btn-up, .indicator-btn-down, .indicator-btn-flat {
  display: inline-flex; align-items: center; justify-content: center;
  width: 18px; height: 18px; padding: 0; box-sizing: border-box;
}
.indicator-btn-clear { color: #9fb0bd; padding: 1px 4px; font-size: 0.62rem; }
/* ★ 2026-07-02 手動ボタンの矢印(➡)を iPhone でカラー絵文字化させずテキスト表示に (VS15 と併用) */
.indicator-btn .holding-aim-arrow { font-variant-emoji: text; }
/* タイマー有効中: 現在設定のボタンを点灯 */
.indicator-btn-up.active    { box-shadow: 0 0 8px var(--color-pos, #7affc6); border-color: var(--color-pos, #7affc6); }
.indicator-btn-down.active  { box-shadow: 0 0 8px var(--color-neg, #79bcff); border-color: var(--color-neg, #79bcff); }
.indicator-btn-flat.active  { box-shadow: 0 0 8px rgba(224,230,234,0.55); border-color: #e0e6ea; }
/* ボタン4つを縦グループ化: 上段=ボタン行 / 下段=解除タイマー */
.indicator-btn-group { display: inline-flex; align-items: center; position: relative; justify-content: flex-end; }
.indicator-btn-row { display: inline-flex; align-items: flex-end; gap: 3px; position: relative; top: 4px; }
/* タイマーは絶対配置=ボタンを押し出さず上にはみ出すだけ */
.ind-arrow-timer { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); margin-bottom: -1px; font-size: 0.68rem; color: #9aa5b0; line-height: 1; white-space: nowrap; }

/* 指標パネル 中身ブロック (その他 / 日経225 / TOPIX) */
.indicator-block {
  background: #0002;
  border-radius: 8px;
  padding: 6px 8px;
  margin-bottom: 6px;
}
.indicator-block:last-child { margin-bottom: 0; }
#indicator-block-other { background: transparent; margin-top: 8px; }
.indicator-block-title {
  font-size: 0.72rem;
  font-weight: 600;
  color: #b8d2e8;
}

/* その他ブロック: NYダウ/ドル円 を左右に並べる (タイトルは全幅で上) (2026-06-15) */
#indicator-block-other {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 4px 12px;
}
#indicator-block-other > .indicator-block-title {
  display: none;
}

/* 指標パネル: 各指標のラベルと値を確実に縦積み (何らかの flex-direction:row 上書きを打ち消す) (2026-06-15) */
#indicator-body .wmi-main {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start;
}
/* ラベルと値の行間を詰める (= 値を上に引き上げ) (2026-06-15) */
#indicator-body .wmi-val {
  margin-top: -2px;
}

/* 日経225/TOPIXブロック: 非表示要素(前日比/率・日経トレンド矢印)を常時表示 (2026-06-15) */
#indicator-body .wmi-diffs {
  display: inline-grid !important;
  position: static !important;
  background: none !important;
  border: none !important;
  padding: 0 !important;
  margin-top: 0 !important;
}
#indicator-body #wmi-nk-trend {
  display: inline-flex !important;
}

/* 指標パネル 4x4 テーブル (罫線 1px #aaa) (2026-06-15) */
.indicator-table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 6px;
}
.indicator-table td {
  border: 1px solid #3f4b53;
  padding: 4px;
  text-align: center;
  vertical-align: middle;
}
/* テーブルセル内: ラベル左・グラフ右・垂直中央 (2026-06-15) */
.ind-cell-flex {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
}
.ind-graph-label {
  font-size: 11px;
  color: #b8d2e8;
  white-space: nowrap;
}
/* トレンド調整: ラベル前のラジオ (ラジオ+ラベルを一体・タイトに、 グラフとの 0.5em gap は維持) */
.ind-trend-pick {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  cursor: pointer;
}
.ind-trend-pick input[type="radio"] { margin: 0; cursor: pointer; }
.ind-label-fixed {
  width: 4em;
  text-align: right;
}
.indicator-arrows { display: inline-flex; gap: 10px; margin-right: 12px; font-size: 11px; align-items: center; vertical-align: middle; }
.ind-arrow-item { display: inline-flex; align-items: center; gap: 3px; color: #b8d2e8; }
.ind-arrow { display: inline-flex; min-width: 14px; justify-content: center; }
.ind-arrow-flat { color: #e0e6ea; font-weight: bold; }
.ind-arrow-none { color: #5a6673; }
.ind-header-graph { display: inline-block; width: 160px; height: 40px; vertical-align: middle; margin-left: 12px; background: linear-gradient(to bottom, #0003, #0006); border-radius: 2px; }
.ind-final-big { font-size: 1.9rem; line-height: 1; }
/* 最終(発注用)の値だけ枠で囲む */
.ind-arrow-item:has(#ind-arrow-1), .ind-arrow-item:has(#ind-arrow-3) { gap: 6px; }
.ind-arrow-item:has(#ind-arrow-1) .ind-arrow-label { display: none; }
/* ★ 2026-07-02 指標パネルのチェック/ラジオラベルの字間を詰めて幅を狭く */
#pane-indicator label { letter-spacing: -0.08em; }
.ind-arrow-item:has(#ind-arrow-2) { display: none; }   /* 手動はボタンだけ見えればOK=ラベル+矢印/×を非表示 */
#ind-arrow-1, #ind-arrow-3 { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; padding: 0; border: 1px solid #2a5070; border-radius: 4px; box-sizing: border-box; }
/* ★ 2026-07-02 大矢印の中身(ind-final-big=1.9rem固定 / holding-aim-arrow)を枠(30px)に合わせて縮小 */
#ind-arrow-1 .ind-final-big, #ind-arrow-3 .ind-final-big,
#ind-arrow-1 .holding-aim-arrow, #ind-arrow-3 .holding-aim-arrow { font-size: 1.3rem; }

.pane-3-stack > .pane-card {
  min-height: 0;
}

.steps-card-compact {
  padding: 0.75rem;
}

.steps-card-compact .steps-panel {
  margin-top: 0.45rem;
}

.summary-card {
  display: flex;
  flex-direction: column;
}

.asset-card {
  min-height: 0;
  height: auto;
  max-height: none;
}

.asset-error,
.asset-empty {
  margin: 0.6rem 0 0;
  font-size: 0.78rem;
  color: #d9e7f6;
}

.asset-grid {
  margin-top: 0.55rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.4rem;
  min-height: 0;
  overflow: hidden;
}

.asset-chart-tf-btns {
  display: flex;
  gap: 4px;
  margin-top: 0.5rem;
  margin-bottom: -20px;
  position: relative;
  z-index: 1;
}
.asset-tf-btn, .ind-tf-btn {
  padding: 2px 10px;
  font-size: 11px;
  background: #1a2e40;
  border: 1px solid #2a4a64;
  color: #6a9ab8;
  border-radius: 3px;
  cursor: pointer;
}
.asset-tf-btn:hover, .ind-tf-btn:hover { color: #aed4f0; border-color: #4a7a9a; }
.asset-tf-btn.is-active, .ind-tf-btn.is-active { background: #1e4060; border-color: #5a9aca; color: #aed4f0; font-weight: 600; }
/* TOPIX / トレンド調整: 折り返さず同じ高さに揃える (テキスト長差で縦伸び・字面差が出るのを防ぐ) */
.ind-tf-btn { white-space: nowrap; line-height: 1.4; flex-shrink: 0; box-sizing: border-box; }
/* TOPIX / トレンド調整 の表示切替を高さアニメーションで (display:none だとパッと切替=アニメ不可のため max-height) */
#ind-trend-table-wrap, #ind-topix-wrap { overflow: hidden; max-height: 0; transition: max-height 0.3s ease; }
#ind-trend-table-wrap.ind-open, #ind-topix-wrap.ind-open { max-height: 300px; }

.asset-chart-wrap {
  margin-top: 0.52rem;
  height: 160px;
  border: 1px solid #b6d6ef26;
  border-radius: 8px;
  background: #060b115c;
  padding: 0.3rem 0.35rem;
}

.asset-chart-canvas {
  width: 100%;
  height: 100%;
}

.asset-chart-empty {
  margin: 0.45rem 0 0;
  font-size: 0.72rem;
  color: #c8d8ea;
}

.asset-item {
  display: flex;
  flex-direction: column;
  min-width: 0;
  border: 1px solid #b6d6ef26;
  border-radius: 8px;
  padding: 0.35rem 0.45rem;
  background: #060b115c;
}

.asset-label {
  font-size: 0.62rem;
  color: #c8d8ea;
  opacity: 0.9;
}

.asset-value {
  margin-top: 0.12rem;
  font-size: 0.78rem;
  color: #f0f6fe;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.asset-line {
  flex-direction: row;
  align-items: center;
  gap: 0.5rem;
}

.asset-line .asset-label {
  font-size: 0.72rem;
}

.asset-line .asset-value {
  margin-top: 0;
  margin-left: auto;
  text-align: right;
}

.asset-line-full {
  grid-column: 1 / -1;
}

.asset-side-summary {
  display: flex;
  flex-direction: row;
  gap: 1rem;
}
.asset-side-col {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  flex: 1;
}

.asset-side-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}

.asset-side-row .asset-label {
  font-size: 0.72rem;
  color: #6a8ea8;
}
.asset-side-row .asset-label-sub {
  color: #c8d8ea;
}

.asset-side-row .asset-value {
  margin-top: 0;
  margin-left: auto;
  text-align: right;
  font-size: 0.74rem;
  white-space: nowrap;
  min-width: 11ch;
}

.asset-side-row .asset-main-amount {
  display: inline-block;
  margin-left: 0.55em;
}

.asset-item-total .asset-label {
  font-size: 0.68rem;
}

.asset-item-total .asset-value {
  font-size: 2.1rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.05;
  color: #f7fbff99;
}

.asset-item-total .asset-value .asset-unit {
  display: inline-block;
  margin-left: 0.06em;
  font-size: 0.38em;
  font-weight: 500;
  opacity: 0.92;
  vertical-align: baseline;
}

.asset-card .asset-unit {
  color: #94a2b2;
  font-size: 0.85em;
  opacity: 0.7;
}

.asset-pos {
  color: var(--color-pos);
}

.asset-neg {
  color: var(--color-neg);
}

/* ── 資産v2パネル ── */
.asset-v2-grid {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 6px;
}
.av2-main {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding-bottom: 6px;
  border-bottom: 1px solid #1e3a55;
}
.av2-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.av2-row-total .av2-value-total {
  font-size: 1.35rem;
  font-weight: 600;
  color: #dbe9f9;
}
.av2-pl-label {
  min-width: unset;
  padding-left: 12px;
}
.av2-pl-value {
  font-size: 0.9rem;
  white-space: nowrap;
}
.av2-rate-value {
  font-size: 0.85rem;
  white-space: nowrap;
  flex: 1;
}
.av2-label {
  font-size: 0.7rem;
  color: #6a92b0;
  min-width: 6em;
  flex-shrink: 0;
}
.av2-value {
  font-size: 0.9rem;
  color: #b8d4ec;
  margin-left: auto;
  text-align: right;
  white-space: nowrap;
}
.av2-sub {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 3px 24px;
  padding-bottom: 6px;
  border-bottom: 1px solid #1e3a55;
}
.av2-market {
  overflow-x: auto;
}
.watch-market-info {
  display: inline-flex;
  gap: 6px;
  margin-left: 20px;
  font-size: 0.72rem;
  font-weight: 400;
  transform: translateY(-10px);
  vertical-align: middle;
  white-space: nowrap;
}
.wmi-item {
  position: relative;
  z-index: 1;
  display: inline-flex;
  flex-direction: row;
  align-items: flex-end;
  align-self: end;
  gap: 4px;
  text-shadow: 0 0 2px #000;
  font-size: 0.72rem;
}
.wmi-label {
  color: #8ab4d0;
  line-height: 1.1;
  white-space: nowrap;
}
.wmi-block {
  display: inline-grid;
}
.wmi-block > * {
  grid-area: 1 / 1;
}
.wmi-block-wide {
  padding-left: 0;
}
.wmi-graph {
  display: flex;
  pointer-events: none;
  align-self: stretch;
  flex-shrink: 0;   /* セル幅で縮めない (= 中の canvas を 160px 表示に保つ) */
}
.wmi-sparkline {
  display: block;
  width: 160px;   /* HiDPI 化で bitmap 属性を変えるため CSS 幅を明示 (= clientWidth 暴走防止)。 ヘッダ大グラフ(160)と幅統一 */
  height: 42px;
  flex-shrink: 0;   /* flex/テーブル幅で縮められると HiDPI の clientWidth も縮む → 160 を保持 */
  background: linear-gradient(to bottom, #0003, #0006);
}
/* ドル円 / NYダウ / 日経平均グラフ: 縦横サイズ調整 + 下寄せ配置 */
#wmi-fx-graph-4d,
#wmi-dj-graph-4d,
#wmi-nasdaq-graph-4d,
#wmi-nk-graph-4d,
#wmi-tx-graph-4d {
  width: 96px;
  height: 30px;
}
/* NYダウ・ドル円の4dグラフは少し低く 30->26px (2026-06-15) */
#wmi-dj-graph-4d,
#wmi-fx-graph-4d,
#wmi-nasdaq-graph-4d {
  height: 26px;
}
/* 日経平均・TOPIX「今日」 グラフだけ拡大 (横 2 倍 / 縦 1.5 倍) */
#wmi-nk-graph-1d,
#wmi-tx-graph-1d,
#wmi-nk-fut-graph-1d,
#wmi-tx-fut-graph-1d {
  width: 160px;
  height: 45px;
}
/* 短期EMAグラフも同サイズ (2026-06-15) */
#wmi-nk-graph-short-1d,
#wmi-tx-graph-short-1d,
#wmi-nk-graph-agree-1d,
#wmi-tx-graph-agree-1d,
#wmi-nktx-graph-agree-1d {
  width: 160px;
  height: 45px;
}
#wmi-fx-graph,
#wmi-dj-graph,
#wmi-nk-graph {
  align-self: flex-end;
  align-items: flex-end;
}
/* 指標パネルへ移動したグラフ: 縦ブロックでは align-self:flex-end が右寄せになるので左寄せに戻す (2026-06-15) */
.indicator-block #wmi-dj-graph,
.indicator-block #wmi-fx-graph { align-self: flex-start; }
/* ドル円 / NYダウブロックの差分は通常非表示、 ホバー時に tooltip 表示 */
#wmi-fx,
#wmi-dj,
#wmi-nk,
#wmi-tx { position: relative; }
#wmi-fx .wmi-diffs,
#wmi-dj .wmi-diffs,
#wmi-nk .wmi-diffs,
#wmi-tx .wmi-diffs { display: none; }
#wmi-fx:hover .wmi-diffs,
#wmi-dj:hover .wmi-diffs,
#wmi-nk:hover .wmi-diffs,
#wmi-tx:hover .wmi-diffs {
  display: flex;
  gap: 6px;
  position: absolute;
  top: 100%;
  left: 0;
  margin-top: 2px;
  padding: 4px 8px;
  background: #000d;
  border: 1px solid #fff3;
  border-radius: 4px;
  white-space: nowrap;
  z-index: 100;
  font-size: 0.78rem;
}
.wmi-main {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
}
/* 日経平均・TOPIX・NYダウ・ドル円は「ラベル + 金額」を横並びに */
#wmi-nk-main,
#wmi-tx-main,
#wmi-dj-main,
#wmi-fx-main {
  flex-direction: row;
  align-items: baseline;
  gap: 6px;
}
/* 日経平均・TOPIX・NYダウ・ドル円の金額は拡大せず標準サイズ */
#wmi-nk-main .wmi-val,
#wmi-tx-main .wmi-val,
#wmi-dj-main .wmi-val,
#wmi-fx-main .wmi-val {
  font-size: 1em;
}
/* 指標ヘッダ 日経225 / TOPIX の値(2行目)は 1.8 倍に拡大 (NY/ドル円は据置) */
#wmi-nk-main .wmi-val,
#wmi-tx-main .wmi-val {
  font-size: 1.8em;
}
.wmi-val {
  color: #b8d4ec;
  font-size: 1.2em;
  line-height: 1.1;
  white-space: nowrap;
}
.wmi-val .asset-unit {
  font-size: 0.75em;
  color: #94a2b2;
  opacity: 0.7;
}
/* 日経平均の金額表示はトレンド矢印と同色 (up=var(--color-pos)/down=var(--color-neg))。
   矢印未表示 (中立/未取得) のときは .wmi-val 既定色 (#b8d4ec) を維持。
   .asset-unit は固有色 (#94a2b2) を継承で上書きせず控えめに残す。 */
#wmi-nk-item:has(.holding-aim-arrow.up)   .wmi-val { color: var(--color-pos); }
#wmi-nk-item:has(.holding-aim-arrow.down) .wmi-val { color: var(--color-neg); }
#wmi-tx-item:has(.holding-aim-arrow.up)   .wmi-val { color: var(--color-pos); }
#wmi-tx-item:has(.holding-aim-arrow.down) .wmi-val { color: var(--color-neg); }
/* 指標ヘッダ 左右ブロック: 矢印をグラフ右下に重ねるため、値色は共通祖先 :has で当てる */
.ind-hdr-mkt:has(.holding-aim-arrow.up)   .wmi-val { color: var(--color-pos); }
.ind-hdr-mkt:has(.holding-aim-arrow.down) .wmi-val { color: var(--color-neg); }
.ind-hdr-arrow { position: absolute; right: 3px; bottom: 1px; z-index: 2; pointer-events: none; filter: drop-shadow(0 0 2px #000A); }
/* 日経/TOPIX とも矢印を表示 (2026-06-16 ヘッダ移動で対称化)。
   値の色付け :has と自動発注ガードの querySelector も併用。 */
#wmi-nk-trend { display: inline-flex; }
.wmi-diffs {
  display: inline-grid;
  grid-template-columns: auto auto;
  align-items: baseline;
  font-size: 0.9em;
  line-height: 1.3;
  column-gap: 3px;
}
.wmi-trend {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1em;
  line-height: 1;
}
.wmi-diff {
  display: contents;
}
.wmi-diff > span:first-child {
  text-align: right;
}
.wmi-diff .asset-unit {
  text-align: left;
  font-size: 1em;
  color: #94a2b2;
  opacity: 0.7;
}
.av2-market-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.78rem;
}
.av2-market-table th, .av2-market-table td {
  padding: 2px 6px;
  text-align: right;
  white-space: nowrap;
}
.av2-market-table thead th {
  color: #5a82a0;
  font-weight: normal;
  border-bottom: 1px solid #1e3a55;
}
.av2-market-table tbody th {
  text-align: left;
  color: #7aa8c8;
  font-weight: normal;
}
.av2-market-table tbody td {
  color: #b8d4ec;
}
.av2-time {
  color: #5a7a90 !important;
  font-size: 0.7rem;
}

.holding-card {
  min-height: 0;
}

#pane-hatchu .holding-scroll {
  flex: 1;
  min-height: 0;
  max-height: none;         /* 上限なし: 行数ぶんだけ縦に伸びる (内部スクロールしない) */
  overflow-x: auto;         /* 横にはみ出せばスクロール */
  overflow-y: visible;      /* 縦は cap が無いので内部スクロール不要 */
}
#pane-holding .holding-scroll {
  flex: 1;
  min-height: 0;
  max-height: none;
  overflow-x: auto;
}
#pane-yakujo .holding-scroll {
  flex: 1;
  min-height: 0;
  max-height: none;
}
#pane-result .pane-body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
#pane-result .result-scroll {
  flex: 1;
  min-height: 0;
  max-height: none;
}
#pane-hatchu .holding-table th,
#pane-hatchu .holding-table td {
  padding-top: 1px;
  padding-bottom: 1px;
  line-height: 1;
}

.holding-error,
.holding-empty {
  margin: 0.6rem 0 0;
  font-size: 0.78rem;
  color: #d9e7f6;
}
.hatchu-delete-btn {
  background: none;
  border: none;
  color: #e05555;
  cursor: pointer;
  font-size: 0.85rem;
  padding: 0;
  line-height: 1;
}
.hatchu-delete-btn:hover { color: #ff6b6b; }
.hatchu-delete-btn:disabled { opacity: 0.4; cursor: default; }
.hatchu-reverse {
  color: #ff9d5c;
  font-weight: 700;
  font-size: 0.68rem;
}
/* 発注処理中 (注文開始日時セット済・未終了 = 拡張が楽天で発注作業中) の行を薄く強調。
   赤(削除/エラー)・橙(反転)と被らないシアン系。 box-shadow は inset でレイアウト不変 */
#pane-hatchu .ea-first-row td {
  background: rgba(64, 190, 224, 0.10);
}
#pane-hatchu .ea-first-row td:first-child {
  box-shadow: inset 3px 0 0 0 #40bee0cc;
}
.pending-empty {
  text-align: center !important;
  color: #4a5a6a;
  font-size: 0.78rem;
  height: 40px;
  vertical-align: middle;
}

.holding-scroll {
  margin-top: 0.55rem;
  min-height: 100px;
  overflow: hidden;
  border: 1px solid #b6d6ef30;
  border-radius: 10px;
  background: #060b11b5;
}

.yakujo-scroll,
.holding-scroll-y {
  overflow-y: auto;
}
/* ニュースパネル (2026-07-10) —— 複数ソースを 95_ニュース に集約し各行にニュース元バッジ */
.news-list {
  margin-top: 0.55rem;
  max-height: 280px;
  overflow-y: auto;
  border: 1px solid #b6d6ef30;
  border-radius: 10px;
  padding: 2px 0;
}
.news-empty {
  color: #8fa8bd;
  font-size: 0.82rem;
  text-align: center;
  padding: 14px 0;
}
.news-filter-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 11px;
  background: rgba(64, 150, 255, 0.14);
  border-bottom: 1px solid #b6d6ef33;
  position: sticky;
  top: 0;
  z-index: 1;
}
.news-filter-label { font-size: 0.82rem; color: #dbe9f7; }
.news-filter-label b { color: #ffffff; }

/* レーティング(みんかぶ 目標株価コンセンサス) サマリ行 */
.news-rating {
  display: block;
  padding: 6px 11px;
  border-bottom: 1px solid #b6d6ef1f;
  background: rgba(120, 90, 200, 0.12);
  text-decoration: none;
  color: inherit;
}
a.news-rating:hover { background: rgba(120, 90, 200, 0.22); }
.news-rating-body { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.news-src-minkabu { background: #4a3a6e; color: #ddd0f5; }   /* みんかぶ=紫系バッジ */
.news-rating-vals { font-size: 0.86rem; color: #e6ecf5; }
.news-rating-vals b { color: #ffffff; font-size: 0.94rem; }
.news-rating-date { font-size: 0.7rem; color: #9fb6cc; margin-left: auto; }

.news-item {
  display: block;
  padding: 7px 11px;
  border-bottom: 1px solid #b6d6ef1f;
  text-decoration: none;
  color: inherit;
}
.news-item:last-child { border-bottom: none; }
a.news-item:hover { background: #b6d6ef14; }
.news-item-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 3px;
}
.news-src {
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  padding: 1px 7px;
  border-radius: 4px;
  background: #3a4a5c;
  color: #cfe0f0;
  flex-shrink: 0;
}
.news-src-tdnet { background: #1f5c3a; color: #b6f0cf; }   /* TDnet=一次開示: 緑系 */
.news-time {
  font-size: 0.72rem;
  color: #9fb6cc;
  flex-shrink: 0;
  font-variant-numeric: tabular-nums;
}
.news-title {
  font-size: 0.9rem;
  line-height: 1.35;
  color: #e2edf6;
}
a.news-item:hover .news-title { color: #ffffff; }

.result-scroll {
  margin-top: 0.55rem;
  max-height: 200px;
  overflow-y: auto;
  border: 1px solid #b6d6ef30;
  border-radius: 10px;
  background: #060b11b5;
}
.result-datetime {
  font-size: 1em;
  color: #6a9ab8;
  white-space: nowrap;
  text-align: center !important;
}
/* 投資結果パネル: 新規価格セルを 3 行表示 (1行目=新規日時 / 2行目=新規価格 / 3行目=空) */
.result-table .result-cell-line {
  display: block;
  line-height: 1.2;
  white-space: nowrap;
}
/* 日時系の行 (新規日時 / 返済日時 / 保有時間) は青系の色 */
.result-table .result-cell-dt,
.result-table .result-cell-line.result-held {
  color: #6a9ab8;
}
/* 損益 td の 1 行目 (損益額) を強調 */
.result-table .result-cell-line.result-pl-amount {
  font-size: 1.6em;
  line-height: 1.1;
}
/* ★ 最後の価格修正理由バッジ = 約定待ちと同一クラス (yakujo-modify-*-mark) を流用。 損益td では左マージンだけ調整 2026-06-12 */
.result-table .yakujo-modify-v3-mark,
.result-table .yakujo-modify-hosei-mark,
.result-table .yakujo-modify-shinki-mark,
.result-table .yakujo-modify-other-mark {
  margin-left: 5px;
  margin-bottom: 0;
  vertical-align: middle;
}
/* 右マージンスペーサー */
.rSpacer {
  margin-right: 0.8em;
}
/* 投資結果テーブル: 全列 横 padding 0 で隣接圧縮 */
.result-table th,
.result-table td {
  padding-left: 0;
  padding-right: 0;
}
/* 売買 (2列目) td は矢印 1 文字なので幅を最小化 */
.result-table th:nth-child(2),
.result-table td:nth-child(2) {
  width: 1em;
  max-width: 1em;
}
.result-table td:nth-child(2) {
  transform: translateX(-6px);
}
.result-table .holding-aim-arrow {
  font-size: 1em;
}
/* 投資結果パネル: 銘柄 td 背面の現在値スパークライン (canvas は HTML attribute で 160×40 固定) */
.result-name-cell {
  padding: 0 0.3em;
  display: flex;
  align-items: center;
  gap: 4px;
}
/* 投資結果パネル: 投資結果グラフ(右)の左に日足ローソク。約定待ちの日足を流用 */
.result-daily-candle {
  display: block;
  flex-shrink: 0;
  height: 40px;
}
.result-sparkline-wrap {
  position: relative;
  display: block;
  width: 160px;
  height: 40px;
}
.result-sparkline {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0.55;
  display: block;
}
.result-name-text {
  position: absolute;
  top: 50%;
  right: 0.4em;
  transform: translateY(-50%);
  z-index: 1;
  display: inline-block;
}
/* 反転処理の「処分」 で返済された結果行のタグ (銘柄列 2 行目・オレンジ・小さめ太字) */
.result-reverse-dispose {
  position: absolute;
  bottom: 1px;
  right: 0.4em;
  z-index: 1;
  color: #ff9800;
  font-size: 0.68em;
  font-weight: bold;
  pointer-events: none;
}
/* ★ 2026-06-19 作戦列を 種別取引(1) の右=2列目に挿入 → 旧2列目以降の nth-child は +1 */
#pane-yakujo .holding-table th:nth-child(1) {
  width: 4em;
}
/* 種別取引列 (1列目) を非表示 (取消ボタンは作戦td へ移動済) */
#pane-yakujo .holding-table .yakujo-type-th,
#pane-yakujo .holding-table .yakujo-type-cell { display: none; }
/* コード・銘柄 td: セル幅をはみ出しても描画 (クリップ解除・他パネルは据え置き) */
#pane-yakujo .watch-name-cell { overflow: visible; }
#pane-yakujo .watch-name-cell .watch-text-clip { overflow: visible; text-overflow: clip; }
/* 作戦 (2列目・class指定で nth-child シフトに巻き込まれない) */
#pane-yakujo .holding-table th.yakujo-sakusen-th { text-align: center; width: 3em; }
#pane-yakujo .holding-table td.yakujo-sakusen { text-align: left; }
#pane-yakujo .holding-table th:nth-child(4) {   /* SlowSt (旧3) */
  text-align: center;
}
#pane-yakujo .holding-table th:nth-child(3) {   /* コード・銘柄 (旧2) */
  width: 22em;
}
#pane-yakujo .holding-table th:nth-child(9) {   /* 板 (旧8) */
  width: 4em;
  text-align: center;
}
/* v5 (板の右・普段 zoom 0.2 で縮小表示なので列も狭く) */
#pane-yakujo .holding-table th:nth-child(10) {  /* v5 (旧9) */
  width: 2.5em;
  text-align: center;
}
/* v5平滑 */
#pane-yakujo .holding-table th:nth-child(11) {  /* v5平滑 (旧10) */
  width: 5em;
  text-align: center;
}
.yakujo-v5-smooth-cell { font-size: 11px; line-height: 1.2; text-align: center !important; vertical-align: middle; padding: 2px 4px; }
/* 約定待ち TOPIX連動 td (= 合成EMA 大/上段・長期EMA 左下/短期EMA 右下) 2026-06-24 */
.yakujo-ema-th { width: auto; padding-left: 0; padding-right: 0; }
.yakujo-ema-cell { text-align: center !important; vertical-align: middle; padding: 1px 0; line-height: 1; }
.yakujo-ema-top { display: flex; justify-content: center; align-items: center; }
.yakujo-ema-top .ind-final-big { font-size: 1.3rem; }   /* 合成: 大きめ (行に収まる範囲) */
.yakujo-ema-top svg { width: 18px; height: 18px; }       /* 合成x の × を縮小 */
.yakujo-ema-bot { display: flex; justify-content: center; align-items: center; gap: 0; margin-top: 1px; }
.yakujo-ema-bot .holding-aim-arrow { font-size: 0.82rem; }  /* 長期/短期: 小さめ */
.yakujo-ema-bot svg { width: 11px; height: 11px; }          /* 長期/短期x の × を縮小 */
/* 監視株 v5平滑 td (= 勢力(全) v2-cell と同パターン: 左=数字ブロック・右=矢印) */
.watch-v5-smooth-cell { padding: 2px 4px !important; vertical-align: middle; text-align: right; }
.watch-v5-smooth-cell > div { display: inline-flex; vertical-align: middle; }
.watch-v5-smooth-left  { flex-direction: column; align-items: flex-end; gap: 1px; }
.watch-v5-smooth-right { flex-direction: column; align-items: center; justify-content: center; margin-left: 4px; font-size: 1.1em; opacity: 0.8; width: 1.4em; flex-shrink: 0; }
.watch-v5-smooth-num   { font-size: 0.92em; line-height: 1.2; white-space: nowrap; color: #bbb; }
.watch-v5-smooth-num-small { font-size: 0.8em; opacity: 0.85; }
.yakujo-v5-smooth-row  { white-space: nowrap; }
.yakujo-v5-smooth-row1 { font-size: 0.9em; opacity: 0.85; }
.yakujo-v5-smooth-pos  { color: var(--color-pos); }
.yakujo-v5-smooth-neg  { color: var(--color-neg); }
#pane-yakujo .holding-table th:nth-child(5) {   /* v3 (旧4) */
  text-align: center;
}
#pane-yakujo .holding-table th:nth-child(7),    /* 狙い (旧6) */
#pane-yakujo .holding-table td:nth-child(7) {
  width: 4em;
  text-align: center;
}
#pane-yakujo .holding-table th:nth-child(8),    /* 現在値 (旧7) */
#pane-yakujo .holding-table td:nth-child(8) {
  text-align: center;
}
.yakujo-order-price {
  padding: 0;
}
.yakujo-modify-cell {
  padding: 0 4px;
  width: 4em;
}
.yakujo-modify-row {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 3px;
}
.yakujo-modify-left {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
.yakujo-spin-btns {
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.yakujo-price-input {
  width: 4em;
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--color-order);
  color: var(--color-order);
  font-size: inherit;
  font-family: inherit;
  text-align: center;
  padding: 1px 2px;
  outline: none;
}
.yakujo-price-modify {
  color: var(--color-modify);
  min-width: 3.5em;
  text-align: center;
  display: inline-block;
}
/* 最後の価格修正が v3 だった目印 (2026-06-08) */
/* 価格修正バッジ (= 最終訂正理由の表示)。v3=青/補正(建値補正)=緑/新規(未訂正)=灰/その他理由=紫 */
.yakujo-modify-v3-mark,
.yakujo-modify-hosei-mark,
.yakujo-modify-shinki-mark,
.yakujo-modify-other-mark {
  display: inline-block;
  font-size: 9px;
  font-weight: bold;
  line-height: 1.3;
  color: #fff;
  padding: 0 4px;
  border-radius: 3px;
  margin-bottom: 1px;
  letter-spacing: 0.5px;
}
.yakujo-modify-v3-mark     { background: #2563eb; } /* 青 = v3 */
.yakujo-modify-hosei-mark  { background: #16a34a; } /* 緑 = 補正 (建値補正・自動) */
.yakujo-modify-shinki-mark { background: #6b7280; } /* 灰 = 新規 (価格修正なし) */
.yakujo-modify-other-mark  { background: #9333ea; } /* 紫 = その他訂正理由 (手動/反転利確/段階撤収/強制撤収/反転) */
/* v3 バッジ横の経過表示 (2026-06-08) */
.yakujo-modify-age {
  display: inline-block;
  font-size: 9px;
  color: #94a2b2;
  margin-left: 3px;
  font-variant-numeric: tabular-nums;
  vertical-align: middle;
}
.yakujo-spin-btn {
  background: transparent;
  border: 1px solid #2a4a64;
  color: var(--color-modify);
  font-size: 9px;
  line-height: 1;
  padding: 2px 3px;
  border-radius: 2px;
  cursor: pointer;
  user-select: none;
  flex-shrink: 0;
}
.yakujo-spin-btn:hover {
  background: #1a3048;
  border-color: var(--color-modify);
}
.yakujo-commit-flash {
  text-shadow: 0 0 2px currentColor, 0 0 6px currentColor, 0 0 12px currentColor, 0 0 22px currentColor, 0 0 40px currentColor;
}
#pane-yakujo .holding-table tbody td {
  height: 60px;
}

.holding-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.72rem;
}

.holding-table th,
.holding-table td {
  padding: 0.3rem 0.4rem;
  border-bottom: 1px solid #d2e2f11f;
  text-align: left;
  white-space: nowrap;
}
/* ★ 2026-07-02 約定待ちパネルは td 横方向 padding を半分(0.4rem→0.2rem)にして列間を詰める */
#pane-yakujo .holding-table th,
#pane-yakujo .holding-table td {
  padding-left: 0.2rem;
  padding-right: 0.2rem;
}
#pending-orders-table th,
#pending-orders-table td {
  padding: 0.075rem 0.4rem;
}

.th-center {
  text-align: center !important;
}
.td-center {
  text-align: center !important;
}
.unit-label {
  font-size: 0.9em;
  color: #8aaabb;
  margin-left: 2px;
}
.holding-table th {
  position: sticky;
  top: 0;
  z-index: 3;
  background: #152535e6;
  color: #eef5fc;
  font-weight: 600;
}
/* 約定待ちパネルの th 全て: 行高を詰める */
#pane-yakujo .holding-table th {
  line-height: 1.1em;
}
/* ヘッダ commit(仮想メモリ)使用率インジケータ (黄60% / 赤80%) */
.header-commit {
  margin-left: 16px; padding: 4px 10px; border-radius: 6px;
  font-weight: bold; font-size: 13px; white-space: nowrap; flex-shrink: 0;
  border: 1px solid #2a4a64; background: #1a2e42; color: #9aa6b2;
  align-self: center;
}
.header-commit::before { content: 'MEM '; font-size: 10px; opacity: 0.6; }
.header-commit-green  { background: #163a2a; border-color: #2a6a4a; color: #7fdca0; }
.header-commit-yellow { background: #4a3f10; border-color: #8a7a20; color: #ffe16a; }
.header-commit-red    { background: #5a1a1a; border-color: #a03030; color: #ff8a8a; animation: commitFlash 1s infinite; }
/* コミットバースト警告バナー (赤=80%以上で表示) */
#commit-warning-banner {
  position: fixed; top: 0; left: 0; right: 0; z-index: 99999;
  background: #c0392b; color: #fff; text-align: center;
  padding: 7px 12px; font-weight: bold; font-size: 14px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.6); animation: commitFlash 1s infinite;
}
@keyframes commitFlash { 0%,100% { opacity: 1; } 50% { opacity: 0.5; } }
#pane-holding .holding-table th:nth-child(1) {
  width: 2em;
}
#pane-holding .holding-table th:nth-child(2) {
  width: 3em;
}
#pane-holding .holding-table td:nth-child(2) {
  text-align: center;
}
#pane-holding .holding-table th:nth-child(3) {
  width: 3em;
}
#pane-holding .holding-table th:nth-child(4),
#pane-holding .holding-table th:nth-child(5),
#pane-holding .holding-table th:nth-child(6),
#pane-holding .holding-table th:nth-child(7),
#pane-holding .holding-table th:nth-child(8),
#pane-holding .holding-table th:nth-child(9),
#pane-holding .holding-table th:nth-child(10),
#pane-holding .holding-table th:nth-child(11),
#pane-holding .holding-table th:nth-child(12),
#pane-holding .holding-table th:nth-child(14) {
  text-align: center;
}
/* tbody は ロック+作戦 を colspan=2 で統合したぶん td 番号が1つ前にズレる (thead は据え置き) */
#pane-holding .holding-table td:nth-child(6),
#pane-holding .holding-table td:nth-child(7),
#pane-holding .holding-table td:nth-child(10),
#pane-holding .holding-table td:nth-child(11) {
  text-align: center;
}
/* 統合セル: ロック チェックボックスと作戦ボックスを左右に並べる */
#pane-holding .holding-table td.holding-lock-sakusen .holding-ls-flex {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2px;
}
/* 保有株パネルのみ 種別・v3 列を非表示 (th/td 両方・他パネルの holding-table には波及させない) */
#pane-holding .holding-table .holding-type,
#pane-holding .holding-table .watch-v3-cell {
  display: none;
}
/* 作戦列: th は中央寄せ・td は左揃え */
#pane-holding .holding-table th.holding-sakusen-th { text-align: center; }
#pane-holding .holding-table td.holding-sakusen { text-align: left; }
/* 作戦別の背景色 (色設定パネルで color+alpha 指定・localStorage・CSS変数で反応的) */
.holding-sakusen-box.sak-jun { background: var(--color-sakusen-junbari); }
.holding-sakusen-box.sak-han { background: var(--color-sakusen-handou); }
.holding-sakusen-box.sak-topix { background: var(--color-sakusen-topix); }
/* 投資方針ヘッダの作戦トグルボタン (保有株の作戦ボックス風・順張り青/反動橙・on=発光/off=減光) */
.policy-sakusen-btn {
  border: 1px solid rgba(173, 200, 228, 0.4);
  border-radius: 4px;
  padding: 2px 6px;
  font-size: 10px;
  line-height: 1.15;
  text-align: center;
  color: #dce8f5;
  cursor: pointer;
  white-space: nowrap;
  transition: opacity 0.12s, box-shadow 0.12s, filter 0.12s;
}
.policy-sakusen-btn.sak-jun { background: var(--color-sakusen-junbari); }
.policy-sakusen-btn.sak-han { background: var(--color-sakusen-handou); }
.policy-sakusen-btn.sak-topix { background: var(--color-sakusen-topix); }
/* OFF: 減光 (グレー寄せ+不透明度) */
.policy-sakusen-btn:not(.is-on) { opacity: 0.4; filter: grayscale(0.55); }
/* ON: 発光 (枠を明るく+影) */
.policy-sakusen-btn.is-on { border-color: rgba(173, 200, 228, 0.95); box-shadow: 0 0 6px 1px rgba(173, 200, 228, 0.45); }
/* 作戦の値を枠付きの箱で2行表示 (トレンド方向<br>反動狙い)・保有株/約定待ち/投資結果 で共用 */
.holding-sakusen-box {
  display: inline-block;
  border: 1px solid rgba(173, 200, 228, 0.4);
  border-radius: 4px;
  padding: 1px 2px 1px 1px;
  font-size: 8.5px;
  line-height: 9px;
  text-align: center;
  transform: scaleY(1.15);
}
/* 投資結果パネル: 作戦ボックスを損益td の左上に重ねて表示 */
#pane-result .result-table td.result-pl-cell { position: relative; }
#pane-result .result-table td.result-pl-cell .result-sakusen-abs {
  position: absolute;
  top: 8px;
  left: 5px;
  z-index: 1;
}
/* 投資結果の作戦ボックスは少し小さく (共通の scaleY(1.15) を上書き・左上基準)。
   損益td の plCls (緑/赤) を継承して文字が読めなくなるので標準色を明示 */
#pane-result .result-table .holding-sakusen-box {
  transform: scale(0.8);
  transform-origin: top left;
  color: #dce8f5;
}
.holding-aim {
  font-size: 1.1em;
}
.holding-aim-arrow {
  display: inline-block;
}
.holding-aim-arrow.up {
  transform: rotate(-35deg);
  color: var(--color-pos);
}
.holding-aim-arrow.down {
  transform: rotate(35deg);
  color: var(--color-neg);
}

.holding-table td:nth-child(3),
.holding-table td:nth-child(4) {
  max-width: 8.5rem;
  overflow: hidden;
  text-overflow: ellipsis;
}

.holding-num,
td.num {
  text-align: right !important;
  font-variant-numeric: tabular-nums;
}

.holding-pl-pos {
  color: var(--color-pos);
}

.holding-pl-neg {
  color: var(--color-neg);
}

.holding-action-btn {
  font-size: 10px;
  padding: 1px 6px;
  border-radius: 3px;
  cursor: pointer;
  font-family: inherit;
  font-weight: 600;
  white-space: nowrap;
  border: 1px solid currentColor;
  background: transparent;
  line-height: 1.6;
}
.holding-action-btn.btn-sell  { color: #e07070; }
.holding-action-btn.btn-repay { color: #70a8e0; }
.holding-action-btn.btn-repay-stop { color: #e0a050; }   /* S高/S安返済 = 琥珀色 (最低利確返済の青と区別してミスクリック防止) */
.holding-action-btn:hover { opacity: 0.75; }
.holding-action-btn:disabled { opacity: 0.4; cursor: not-allowed; }

.tasks-title-row {
  margin-top: 0.05rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.task-state-filters {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.26rem;
}

.task-state-filter {
  height: 1.35rem;
  border: 1px solid #b8d2e852;
  border-radius: 999px;
  background: #050a10a6;
  color: #cfe1f4;
  font-size: 0.63rem;
  padding: 0 0.4rem;
  cursor: pointer;
}

.task-state-filter.is-on {
  border-color: #9dd7f29e;
  background: #1a3a5499;
  color: #eef7ff;
}

.task-state-filter:hover {
  border-color: #b4dbf29c;
}

.task-state-filter[data-status="queued"] {
  color: #f1d88b;
}

.task-state-filter[data-status="running"] {
  color: #8fd6ff;
}

.task-state-filter[data-status="done"] {
  color: #9be2b3;
}

.task-state-filter[data-status="error"] {
  color: #ff9797;
}

.task-state-filter[data-status="paused"] {
  color: #c9b2ff;
}

.task-create-form {
  display: flex;
  gap: 0.45rem;
  margin-top: 0.7rem;
}

.task-create-input {
  flex: 1 1 auto;
  min-width: 0;
  height: 1.95rem;
  border: 1px solid #b8d2e84d;
  border-radius: 8px;
  background: #050a10a6;
  color: #f4f8ff;
  font-size: 0.78rem;
  padding: 0 0.58rem;
}

.task-create-input::placeholder {
  color: #dce8f59c;
}

.task-create-input:focus {
  outline: none;
  border-color: #aae2ff94;
  box-shadow: 0 0 0 1px #aae2ff52;
}

.task-create-btn {
  flex: 0 0 auto;
  height: 1.95rem;
  border: 1px solid #a9d7f08f;
  border-radius: 8px;
  background: #1a3a5499;
  color: #eaf4ff;
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  padding: 0 0.72rem;
  cursor: pointer;
}

.task-create-btn:hover {
  background: #225173bb;
}

.task-create-btn:disabled {
  opacity: 0.62;
  cursor: default;
}

.task-filter-wrap {
  position: relative;
  flex: 0 0 6.8rem;
  width: 6.8rem;
  display: inline-flex;
  align-items: center;
}

.task-filter-icon {
  position: absolute;
  left: 0.48rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.7rem;
  line-height: 1.1;
  color: #dce8f5ba;
  pointer-events: none;
}

.task-filter-input {
  flex: 1 1 auto;
  width: 100%;
  height: 1.9rem;
  margin-top: 0;
  border: 1px solid #b8d2e84d;
  border-radius: 8px;
  background: #050a10a6;
  color: #f4f8ff;
  font-size: 0.74rem;
  padding: 0 0.58rem 0 1.55rem;
}

.task-filter-input::placeholder {
  color: #dce8f59c;
}

.task-filter-input:focus {
  outline: none;
  border-color: #aae2ff94;
  box-shadow: 0 0 0 1px #aae2ff52;
}

.task-filter-reset {
  flex: 0 0 auto;
  width: 1.9rem;
  height: 1.9rem;
  border: 1px solid #b8d2e84d;
  border-radius: 8px;
  background: #050a10a6;
  color: #d9e8f8;
  font-size: 0.82rem;
  line-height: 1.1;
  cursor: pointer;
}

.task-filter-reset:hover {
  border-color: #aae2ff94;
  background: #132131b0;
}

.task-filter-reset.is-default-active {
  border-color: #f0d98bb8;
  box-shadow: 0 0 0 1px #f0d98b66, 0 0 12px #f0d98b52;
  color: #f6e6b0;
}

.task-create-error {
  margin: 0.45rem 0 0;
  font-size: 0.76rem;
  color: #ffb2b2;
}

.task-create-error[hidden] {
  display: none;
}

.tasks-scroll {
  position: relative;
  flex: 1 1 auto;
  margin-top: 0.7rem;
  min-height: 0;
  overflow: auto;
  padding-right: 0.25rem;
}

.tasks-empty,
.tasks-error {
  margin: 0.7rem 0 0;
  font-size: 0.85rem;
}

.tasks-error {
  color: #ff9a9a;
}

.task-filter-empty {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  margin: 0;
  font-size: 0.86rem;
  color: #d5e2f2cc;
  text-align: center;
  pointer-events: none;
}

.task-tree {
  list-style: none;
  margin: 0;
  padding: 0;
}

.task-tree .task-tree {
  margin-top: 0.35rem;
  margin-left: 0.55rem;
  padding-left: 0.65rem;
  border-left: 1px solid #badaf042;
}

.task-node {
  margin: 0 0 0.45rem;
}

.task-node.dragging {
  opacity: 0.68;
}

.task-node.drop-before > .task-item {
  box-shadow: inset 0 2px 0 #8bd2ff;
}

.task-node.drop-after > .task-item {
  box-shadow: inset 0 -2px 0 #8bd2ff;
}

.task-node.drop-invalid > .task-item {
  border-color: #ff8a8a;
  box-shadow: inset 0 0 0 1px #ff8a8a;
}

.task-item {
  border: 1px solid #b8d2e833;
  border-radius: 10px;
  background: #050a1045;
  padding: 0.45rem 0.55rem;
  cursor: pointer;
}

.task-item.filter-parent-hit {
  opacity: 0.45;
}

.task-item.active {
  border-color: #aae2ffad;
  box-shadow: 0 0 0 1px #aae2ff66, 0 0 20px #78c8ff42;
}

.task-item.editing {
  cursor: default;
}

.task-head {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}

.task-tree-toggle,
.task-tree-toggle-spacer {
  flex: 0 0 auto;
  width: 0.72rem;
  height: 0.72rem;
}

.task-tree-toggle {
  border: 0;
  padding: 0;
  border-radius: 0.18rem;
  background: #0000;
  color: #dce8f5d4;
  font-size: 0.58rem;
  line-height: 1.1;
  cursor: pointer;
}

.task-tree-toggle:hover {
  color: #f4f8ff;
  background: #ffffff1a;
}

.task-tree-toggle:focus-visible {
  outline: 1px solid #8bd2ff;
  outline-offset: 1px;
}

.task-drag-handle {
  flex: 0 0 auto;
  width: 0.55rem;
  height: 1.1rem;
  border-radius: 0.2rem;
  cursor: grab;
  opacity: 0.82;
  background-image: radial-gradient(circle, #dce8f5cc 0.08rem, #0000 0.09rem);
  background-size: 0.28rem 0.28rem;
  background-position: 0 0.02rem;
  user-select: none;
  -webkit-user-select: none;
  touch-action: none;
}

.task-drag-handle:active {
  cursor: grabbing;
}

body.tasks-dragging {
  user-select: none;
  -webkit-user-select: none;
}

body.tasks-dragging .task-drag-handle {
  cursor: grabbing;
}

body.tasks-drop-invalid,
body.tasks-drop-invalid * {
  cursor: not-allowed !important;
}

.task-node.collapsed > .task-tree {
  display: none;
}

.task-id {
  font-size: 0.72rem;
  opacity: 0.88;
}

.task-steps {
  font-size: 0.68rem;
  letter-spacing: 0.02em;
  color: #dce8f5d6;
}

.task-status {
  font-size: 0.67rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  padding: 0.1rem 0.38rem;
  border-radius: 999px;
  border: 1px solid #ffffff33;
  background: #ffffff14;
}

.task-status.status-queued {
  color: #f1d88b;
}

.task-status.status-running {
  color: #8fd6ff;
}

.task-status.status-done {
  color: #9be2b3;
}

.task-status.status-error {
  color: #ff9797;
}

.task-status.status-paused {
  color: #c9b2ff;
}

.task-goal {
  margin: 0;
  flex: 1;
  min-width: 0;
  font-size: 0.78rem;
  line-height: 1.2;
  color: #f3f8ffbb;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.task-node > .task-item[data-pinned="1"] {
  background: #2a060660;
  border-color: #882020aa;
}
.task-node > .task-item[data-pinned="2"] {
  background: #480a0a90;
  border-color: #bb2828bb;
}
.task-node > .task-item[data-pinned="3"] {
  background: #5a0a0aaa;
  border-color: #dd2828cc;
}

.task-pin-btn {
  flex: 0 0 auto;
  width: 1.25rem;
  height: 1.25rem;
  border: 1px solid #b39c5e8a;
  border-radius: 999px;
  background: #463a0e99;
  color: #d4c48c;
  font-size: 0.72rem;
  line-height: 1.1;
  padding: 0;
  cursor: pointer;
}

.task-pin-btn i {
  font-size: 0.66rem;
  transform: translateY(-0.01rem) rotate(22deg);
}

.task-pin-btn:hover {
  background: #7c6b1cbb;
  color: #fff6d8;
}

.task-pin-btn.is-pinned {
  border-color: #f6d66faa;
  background: #9c7b19cc;
  color: #fff8de;
}

.task-pin-btn:disabled {
  opacity: 0.55;
  cursor: default;
}

.task-edit-input {
  width: 100%;
  min-width: 0;
  height: 1.65rem;
  border: 1px solid #b8d2e84d;
  border-radius: 7px;
  background: #050a10d1;
  color: #f4f8ff;
  font-size: 0.75rem;
  padding: 0 0.45rem;
}

.task-edit-input:focus {
  outline: none;
  border-color: #aae2ff94;
  box-shadow: 0 0 0 1px #aae2ff52;
}

.task-edit-controls {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}

.task-edit-save,
.task-edit-cancel {
  height: 1.2rem;
  border-radius: 999px;
  font-size: 0.62rem;
  font-weight: 700;
  line-height: 1.1;
  padding: 0 0.42rem;
  cursor: pointer;
}

.task-edit-save {
  border: 1px solid #9fd7b699;
  background: #0f4e3399;
  color: #d8ffe9;
}

.task-edit-save:hover {
  background: #1a6a47bb;
}

.task-edit-cancel {
  border: 1px solid #ffffff52;
  background: #4a546299;
  color: #e6edf7;
}

.task-edit-cancel:hover {
  background: #5c6878bb;
}

.task-edit-save:disabled,
.task-edit-cancel:disabled {
  opacity: 0.55;
  cursor: default;
}

.task-add-btn {
  flex: 0 0 auto;
  width: 1.25rem;
  height: 1.25rem;
  border: 1px solid #7fb1978a;
  border-radius: 999px;
  background: #0b3f2999;
  color: #bfe8d1bb;
  font-size: 0.8rem;
  line-height: 1.1;
  padding: 0;
  cursor: pointer;
}

.task-add-btn:hover {
  background: #1a6a47bb;
  color: #eefff6;
}

.task-add-btn:disabled {
  opacity: 0.55;
  cursor: default;
}

.task-delete-btn {
  flex: 0 0 auto;
  width: 1.25rem;
  height: 1.25rem;
  border: 1px solid #ff9a9a99;
  border-radius: 999px;
  background: #5a101099;
  color: #ffd7d7bb;
  font-size: 0.72rem;
  line-height: 1.1;
  padding: 0;
  cursor: pointer;
}

.task-delete-btn:hover {
  background: #7f1717bb;
  color: #fff2f2;
}

.task-delete-btn:disabled {
  opacity: 0.55;
  cursor: default;
}

.task-inline-create {
  margin-top: 0.38rem;
  margin-left: 1.75rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 0.35rem;
  align-items: center;
}

.task-inline-input {
  min-width: 0;
  height: 1.75rem;
  border: 1px solid #b8d2e84d;
  border-radius: 7px;
  background: #050a10a6;
  color: #f4f8ff;
  font-size: 0.74rem;
  padding: 0 0.48rem;
}

.task-inline-input::placeholder {
  color: #dce8f59c;
}

.task-inline-input:focus {
  outline: none;
  border-color: #aae2ff94;
  box-shadow: 0 0 0 1px #aae2ff52;
}

.task-inline-submit,
.task-inline-cancel {
  height: 1.75rem;
  border-radius: 7px;
  font-size: 0.7rem;
  font-weight: 700;
  padding: 0 0.52rem;
  cursor: pointer;
}

.task-inline-submit {
  border: 1px solid #9fd7b699;
  background: #0f4e3399;
  color: #d8ffe9;
}

.task-inline-submit:hover {
  background: #1a6a47bb;
}

.task-inline-cancel {
  border: 1px solid #ffffff4d;
  background: #4a546299;
  color: #e6edf7;
}

.task-inline-cancel:hover {
  background: #5c6878bb;
}

.task-inline-submit:disabled,
.task-inline-cancel:disabled {
  opacity: 0.55;
  cursor: default;
}

.task-inline-error {
  grid-column: 1 / -1;
  margin: 0;
  font-size: 0.72rem;
  color: #ffb2b2;
}

.steps-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
}

.steps-panel {
  margin-top: 0.7rem;
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  display: grid;
  gap: 0.5rem;
  align-content: start;
  padding-right: 0.25rem;
}

.steps-empty {
  margin: 0;
  font-size: 0.82rem;
  color: #e6eff8b8;
}

.steps-meta {
  margin: 0;
  font-size: 0.72rem;
  color: #e6eff8d1;
}

.step-block {
  border: 1px solid #b8d2e83d;
  border-radius: 10px;
  background: #050a1085;
  padding: 0.5rem 0.58rem;
}

.step-block-title {
  margin: 0 0 0.28rem;
  font-size: 0.72rem;
  font-weight: 700;
  color: #cddff2e6;
}

.step-block-text {
  margin: 0;
  font-size: 0.76rem;
  line-height: 1.3;
  color: #f3f8ff;
  white-space: pre-wrap;
  word-break: break-word;
}

.watch-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
}

.watch-add-form {
  display: grid;
  grid-template-columns: auto auto auto auto;
  gap: 0.35rem;
  justify-content: start;
  align-items: center;
}

.watch-add-label,
.watch-search-label,
.watch-sort-label,
.watch-limit-label {
  font-size: 0.7rem;
  color: #b8d2e8cc;
  white-space: nowrap;
}

.watch-add-row {
  margin-top: 0.7rem;
  display: none;
  align-items: center;
  gap: 0.35rem;
}

.watch-search-label,
.watch-sort-label,
.watch-limit-label {
  margin-left: 20px;
}

.watch-limit-label {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.watch-limit-input {
  width: 60px;
}

.watch-input {
  min-width: 0;
  height: 1.85rem;
  border: 1px solid #b8d2e84d;
  border-radius: 7px;
  background: #050a10a6;
  color: #f4f8ff;
  font-size: 0.72rem;
  padding: 0 0.45rem;
}

.watch-priority {
  width: 3.2rem;
  min-width: 3.2rem;
  padding-left: 0.3rem;
  padding-right: 0.2rem;
}

.watch-query,
#watch-search {
  max-width: 180px;
}

.watch-input:focus {
  outline: none;
  border-color: #aae2ff94;
  box-shadow: 0 0 0 1px #aae2ff52;
}

.watch-add-btn {
  height: 1.85rem;
  border: 1px solid #9fd7b699;
  border-radius: 7px;
  background: #0f4e3399;
  color: #d8ffe9;
  font-size: 0.7rem;
  font-weight: 700;
  padding: 0 0.6rem;
  cursor: pointer;
}

.watch-add-btn:hover {
  background: #1a6a47bb;
}

.watch-add-btn:disabled {
  opacity: 0.6;
  cursor: default;
}

.watch-error {
  margin: 0.45rem 0 0;
  font-size: 0.75rem;
  color: #ffb2b2;
}

.watch-error[hidden] {
  display: none;
}

.watch-suggest {
  margin-top: 0.35rem;
  border: 1px solid #b8d2e84d;
  border-radius: 8px;
  background: #070e16f2;
  height: 44rem;
  overflow: auto;
}

.watch-suggest[hidden] {
  display: none;
}

.watch-suggest-item {
  width: 100%;
  border: 0;
  border-bottom: 1px solid #ffffff1f;
  background: #0000;
  color: #f4f8ff;
  padding: 0.42rem 0.5rem;
  text-align: left;
  display: grid;
  gap: 0.14rem;
  cursor: pointer;
}

.watch-suggest-item:last-child {
  border-bottom: 0;
}

.watch-suggest-item:hover {
  background: #ffffff1a;
}

.watch-suggest-symbol {
  font-size: 0.72rem;
  font-weight: 700;
  color: #d8e8fa;
}

.watch-suggest-name {
  font-size: 0.73rem;
  color: #f4f8ff;
}

.watch-suggest-meta {
  font-size: 0.66rem;
  color: #c8d9eb;
}

.watch-tools {
  margin-top: 0.45rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.35rem;
  align-items: center;
}

.watch-tool-input,
.watch-tool-select {
  min-width: 0;
  height: 1.8rem;
  border: 1px solid #b8d2e84d;
  border-radius: 7px;
  background: #050a10a6;
  color: #f4f8ff;
  font-size: 0.7rem;
  padding: 0 0.45rem;
}

.watch-tool-input:focus,
.watch-tool-select:focus {
  outline: none;
  border-color: #aae2ff94;
  box-shadow: 0 0 0 1px #aae2ff52;
}

.watch-scroll {
  margin-top: 0.55rem;
  min-height: 0;
  flex: 1 1 auto;
  overflow: auto;
  border-radius: 10px;
}

.watch-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.7rem;
  table-layout: fixed; /* th/col の width 指定どおりに列幅を固定描画 (未指定列は残り幅を均等割り) */
}

.watch-table th,
.watch-table td {
  border-bottom: 1px solid #ffffff1f;
  padding: 0.28rem 0.32rem;
  text-align: left;
  white-space: nowrap;
}

@keyframes watch-row-checking-flash {
  from { background-color: rgba(255, 220, 60, 0.5); }
  to   { background-color: rgba(255, 220, 60, 0.15); }
}
.watch-row-checking {
  background-color: rgba(255, 220, 60, 0.15) !important;
  animation: watch-row-checking-flash 0.4s ease-out forwards;
}

.watch-name-cell,
.watch-col-left  { text-align: left !important; }
.watch-col-center { text-align: center !important; }
.watch-col-right  { text-align: right !important; }
.watch-correl-cell { text-align: center !important; font-variant-numeric: tabular-nums; white-space: nowrap; }

.watch-name-cell {
  position: relative;
  overflow: hidden;
}
/* コード・銘柄 td: 約定からの経過時間 (= 旧 現在値 td 2 行目を移設)。
   2026-05-20 DevTool で実時間調整: right:33px がベスト (本人決定)。
   sparkline の右端付近・現在値マーカー◀ の少し左の位置。 sparkline 文字とは重なるが
   現在値マーカー位置 (グラフ最右) は読めるので、 時間とグラフ両方拾える折衷点。 */
.yakujo-elapsed-time-label {
  position: absolute;
  top: 4px;
  right: 33px;
  text-align: right;
  z-index: 2;
  font-size: 0.9em;
  white-space: nowrap;
  opacity: 0.7;
}
.watch-slowst-cell {
  padding: 2px 4px !important;
  white-space: nowrap;
}
.watch-slowst-cell {
  display: table-cell;
  vertical-align: middle;
}
/* 約定待ち SlowSt td: グラフ(canvas)を背面、値/トレンドを手前に重ねる。
   監視株/保有株と class 共有だが #yakujo-tbody スコープ限定なので従来の横並びは不変 */
#yakujo-tbody .watch-slowst-cell {
  position: relative;
  width: 60px;
  height: 60px;
  padding: 0 0 0 4px !important;
  text-align: left;
}
#yakujo-tbody .watch-slowst-cell .watch-slowst {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 0;
}
#yakujo-tbody .watch-slowst-cell .watch-slowst-val,
#yakujo-tbody .watch-slowst-cell .watch-slowst-trend {
  position: relative;
  z-index: 1;
  margin: 0;
  opacity: 0.85;
}
.watch-daily-head {
  white-space: nowrap;
}
.watch-v3-cell {
  padding: 2px 4px !important;
  white-space: nowrap;
  vertical-align: middle;
}
/* ★ 2026-07-02 約定待ちの v3 td は列幅を超えてもはみ出し描画 (v3 th と同じ挙動) */
#yakujo-tbody .watch-v3-cell { overflow: visible; }
/* 監視株パネル 勢力(全/近): 常時は矢印(watch-v2-right)だけ表示。数値(watch-v2-left=株数/％)は
   セル(矢印)にマウスをロールオーバーした時だけツールチップ表示 (2026-07-29)。#watch-table-body 限定で
   約定待ち/保有には波及させない。全=.watch-v2-cell / 近=.watch-v2-cell.watch-v2-near-cell の両方に効く。 */
#watch-table-body .watch-v2-cell { position: relative; cursor: default; }
#watch-table-body .watch-v2-cell .watch-v2-left { display: none; }
#watch-table-body .watch-v2-cell:hover .watch-v2-left {
  display: flex; flex-direction: column; align-items: center;
  position: absolute; left: 50%; bottom: 100%;
  transform: translateX(-50%) translateY(9px); margin-bottom: 3px;
  background: rgba(20,28,40,0.96); border: 1px solid rgba(173,200,228,0.4);
  border-radius: 4px; padding: 4px 9px; font-size: 13px; line-height: 1.3;
  z-index: 30; box-shadow: 0 2px 8px rgba(0,0,0,0.5); white-space: nowrap;
}
.watch-v3-inner {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  vertical-align: middle;
  line-height: 1;
}
.watch-v3-left {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
  align-items: flex-end;
}
.watch-v3-k {
  font-size: 0.92em;
  color: rgba(130, 190, 255, 0.9);
}
.watch-v3-cross {
  font-size: 0.92em;
  font-weight: bold;
  color: #999;
}
/* 売建系の行ハイライト (= 値下がり狙いの可視化、 色設定パネル「売建背景色」 で調整可・2026-05-28 追加)
   ★ 配置順注意: 後段の 約定/出来無 CSS が同特異度で上書きできるよう必ずこの前に置く */
#holding-tbody tr[data-baibai="売建"],
#yakujo-tbody  tr[data-side="売建"],
#yakujo-tbody  tr[data-side="買埋"] {
  background: var(--color-uridate-bg);
}
#holding-tbody .watch-v3-cross-btn,
#yakujo-tbody tr[data-yakujo-status="約定"] {
  background: #181508;
}
#yakujo-tbody tr[data-yakujo-status*="出来無"] {
  background: #211;
}
#yakujo-tbody .watch-v3-cross-btn {
  cursor: pointer;
}
#holding-tbody .watch-v3-cross-btn:hover,
#yakujo-tbody .watch-v3-cross-btn:hover {
  color: #fff;
}
.watch-v3-cross.is-inf {
  transform: scale(1.8);
  transform-origin: center center;
  display: inline-block;
}
.watch-v3-right {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 1.2em;
}
.watch-v4-cell {
  padding: 2px 4px !important;
  vertical-align: middle;
  text-align: center;
}
/* 反動 v4R: v4セルに同居表示 (1矢印=v4 / 2矢印=v4R)。2矢印を横並び 2026-06-24 */
.watch-v4r-arrows {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 2px;
  line-height: 1;
}
.watch-v4r-arrows .holding-aim-arrow { font-size: 0.9em; }
.watch-v4r-secs {
  font-size: 0.95em;
  color: #fff;
  font-weight: bold;
  font-variant-numeric: tabular-nums;
}
/* 監視株パネル 勢力(全) / 勢力(近) 列 非表示ルール (= 2026-06-02 一時非表示 → 2026-06-02 v4sort 復帰で再表示) */
/* .watch-table thead th:has(#watch-sort-v2rate-btn),
.watch-table thead th:has(#watch-sort-v2rate-near-btn),
.watch-v2-cell { display: none; } */
.watch-vol-cell {
  padding: 2px 0 !important;
  text-align: right !important;
  font-size: 11px;
  white-space: nowrap;
  color: #bbb;
  width: 3em;
  max-width: 3em;
}
/* 出来高 th も同じ幅に揃える (= button のある th セルを :has で特定。 id は唯一なのでこれで OK) */
th:has(#watch-sort-vol-btn) {
  width: 3em;
  padding: 2px 0 !important;
}
/* 出来高 button 自体の左右 padding も 0 (= 共通 .watch-th-sort-btn は 0.1em 0.5em) */
#watch-sort-vol-btn {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
/* 決算セル: 過去日はグレーで弱調。 サイズ感は 前日比 td と統一 (0.92em / line-height 1.2) */
.watch-earnings-cell {
  white-space: nowrap;
  line-height: 1.2;
}
.watch-earnings-cell.is-past {
  color: #666;
}
.watch-earnings-date,
.watch-earnings-rel {
  font-size: 0.92em;
}
/* 前日比 td: 1 行目 (前日比) + 2 行目 (比率) を v2-num の 0.92em / line-height 1.2 に揃える */
.watch-diff-cell {
  line-height: 1.2;
}
.watch-diff-cell .watch-price-int {
  font-size: 0.92em;
}
/* 前日比 td では小数部の幅確保は不要 (普通に右寄せ) */
.watch-diff-cell .watch-price-dec {
  width: auto;
}
.watch-diff-cell .watch-price-dec-empty {
  display: none;
}
.watch-rate-sub {
  font-size: 0.92em;
  line-height: 1.2;
}
.watch-daily-cell {
  padding: 2px 4px !important;
  white-space: nowrap;
  vertical-align: middle;
  text-align: center;
  opacity: 0.65;
}
.watch-daily-cell canvas {
  vertical-align: middle;
}
.watch-daily-arrow-cell,
.watch-v1-head {
  display: none !important;
}
.watch-daily-arrow-cell {
  padding: 2px 4px !important;
  white-space: nowrap;
  vertical-align: middle;
  text-align: center;
  opacity: 0.65;
}
.watch-daily-arrow {
  vertical-align: middle;
  font-size: 1.3em;
}
.watch-v2-cell {
  padding: 2px 4px !important;
  vertical-align: middle;
  text-align: right;
}
.watch-v2-cell > div {
  display: inline-flex;
  vertical-align: middle;
}
.watch-v2-left {
  flex-direction: column;
  align-items: flex-end;
  gap: 1px;
  width: 5em;
}
.watch-v2-right {
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-left: 4px;
  font-size: 1.1em;
  opacity: 0.8;
  width: 1.4em;
  flex-shrink: 0;
}
.watch-v2-num {
  font-size: 0.92em;
  line-height: 1.2;
  white-space: nowrap;
  color: #bbb;
}
.watch-v2-pos { color: var(--color-pos); }
.watch-v2-neg { color: var(--color-neg); }
.watch-v2-unit { color: #888; margin-left: 2px; font-size: 0.89em; }
.watch-v2-arrow { display: inline-block; }
.watch-v2-arrow-up-l { transform: rotate(-50deg); color: var(--color-pos); }
.watch-v2-arrow-up-s { transform: rotate(-15deg); color: var(--color-pos); opacity: 0.5; }
.watch-v2-arrow-flat { transform: rotate(0deg);   color: #888; }
.watch-v2-arrow-dn-s { transform: rotate(15deg);  color: var(--color-neg); opacity: 0.5; }
.watch-v2-arrow-dn-l { transform: rotate(50deg);  color: var(--color-neg); }

/* 約定待ち 売 td (= yakujo-ita-qty-sell) の最下段に勢力(近) を絶対位置オーバーレイで表示
   レイアウト: 矢印を上・数値を下に縦並び (= 2026-05-26 仕様変更) */
.yakujo-ita-qty-sell { position: relative; }
.yakujo-seiryoku-near-overlay {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 3px;
  display: flex;
  flex-direction: column;
  align-items: center;
  pointer-events: none;          /* 板表示のクリック操作を妨げない */
  padding: 1px 2px;
  z-index: 2;
  font-size: 1.4em;              /* 全体大きく */
  line-height: 1.0;
}
.yakujo-seiryoku-near-label { order: -1; font-size: 10px; color: #aaa; letter-spacing: 0.5px; line-height: 1.1; }  /* 2026-05-29 追加: 矢印の上に「勢力(近)」 ラベル */
.yakujo-seiryoku-near-right { order: 0; font-size: 1.3em; }   /* 矢印を上 + さらに拡大 */
.yakujo-seiryoku-near-left  {
  order: 1;                                                   /* 数値を下 */
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 1.05;
}
.yakujo-seiryoku-near-left .watch-v2-num { font-size: 0.8em; }
/* 矢印の色を「狙いと一致/不一致」 で上書き (2026-05-26 仕様)。 既定の up_l/up_s/dn_l/dn_s の色より優先 */
.yakujo-seiryoku-near-right.is-pos  .watch-v2-arrow { color: var(--color-pos); }
.yakujo-seiryoku-near-right.is-neg  .watch-v2-arrow { color: var(--color-neg); }
.yakujo-seiryoku-near-right.is-flat .watch-v2-arrow { color: #888; }
/* オーバーレイ専用: 弱い (= up_s / dn_s) 矢印の opacity を 0.5 → 0.7 に上書き (= 監視株側は 0.5 のまま) */
.yakujo-seiryoku-near-right .watch-v2-arrow-up-s,
.yakujo-seiryoku-near-right .watch-v2-arrow-dn-s { opacity: 0.7; }
.yakujo-seiryoku-near-overlay:empty,
.yakujo-seiryoku-near-left:empty + .yakujo-seiryoku-near-right:empty { display: none; }

/* 約定待ち 買 td (= yakujo-ita-qty-buy) の右上に v5 ブロックを絶対位置オーバーレイで表示 (2026-05-29 追加) */
.yakujo-ita-qty-buy { position: relative; }
.yakujo-v5-overlay {
  position: absolute;
  top: 2px;
  right: 3px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  pointer-events: none;
  z-index: 2;
  line-height: 1.1;
}
.yakujo-v5-label { font-size: 10px; color: #aaa; letter-spacing: 0.5px; }
.yakujo-v5-row   { font-size: 10px; color: #aaa; line-height: 10px; font-family: monospace; display: flex; gap: 4px; align-items: baseline; }  /* 2026-05-30 追加: v5 ラベル + 値 横並び */
.yakujo-v5-tag   { color: #aaa; font-weight: normal; }
.yakujo-v5-val   { color: #ddd; font-weight: normal; }
/* ±4 行: ±N 部分と値だけ太字 / : はそのまま normal */
.yakujo-v5-row-emphasis .yakujo-v5-tag-num { font-weight: bold; }
.yakujo-v5-row-emphasis .yakujo-v5-val { font-weight: bold; }
.yakujo-v5-val.v5-up { color: var(--color-pos); }   /* 現在値より上 = 買優勢 */
.yakujo-v5-val.v5-dn { color: var(--color-neg); }   /* 現在値より下 = 売優勢 */
/* v5 オーバーレイを v5 列セルへ移設 (2026-06-10): 板右上の絶対配置を解除して列セルの通常フローで表示 */
.yakujo-v5-cell { vertical-align: middle; padding: 2px 4px; }
.yakujo-v5-cell .yakujo-v5-overlay { position: static; top: auto; right: auto; align-items: center; pointer-events: auto; zoom: 0.6; cursor: default; }
/* v5 も板と同様: 普段 zoom 0.2 で縮小、hover で scale 5 拡大 (= 0.2×5=100%・2026-06-10) */
.yakujo-v5-cell .yakujo-v5-overlay:hover {
  transform: scale(2);
  transform-origin: center 35%;
  will-change: transform;
  backface-visibility: hidden;
  position: relative;
  z-index: 100;
  background: #000;
  padding: 4px 8px;
}
/* v5 hover 中も scroll コンテナの overflow を解放 (板と同じ) */
.holding-scroll.yakujo-scroll:has(.yakujo-v5-overlay:hover) {
  overflow: visible;
}

/* 約定待ち 買 td の上から 8 行 (= 最良買気配 bp1〜bp8 帯) にプラス色背景 (2026-05-29 追加・2026-06-01 透明度半減) */
.yakujo-buy-near-bg {
  display: inline-block;
  width: 100%;
  background-color: color-mix(in srgb, var(--color-pos) 18%, transparent);
}
/* 約定待ち 売 td の下から 8 行 (= 最良売気配 up1〜up8 帯) にマイナス色背景 (2026-05-29 追加・2026-06-01 透明度半減) */
.yakujo-sell-near-bg {
  display: inline-block;
  width: 100%;
  background-color: color-mix(in srgb, var(--color-neg) 18%, transparent);
}
/* 約定待ち 板の壁検出マーカー (= 中央値 ×10 以上の異常 qty・心理的な板表示外への壁配置を検知)
   2026-06-01: 売はマイナス色 / 買はプラス色 の ● を値の前に付加。 near-bg と独立して併存可能。 */
.yakujo-wall-mark-sell { color: var(--color-neg); margin-right: 2px; }
.yakujo-wall-mark-buy  { color: var(--color-pos); margin-right: 2px; }

/* 約定待ち板 子テーブル: zoom でレイアウト含めて 0.1 倍縮小 / hover で 1.0 倍 (2026-06-01 試行) */
.yakujo-ita-table {
  zoom: 0.28;
  border-collapse: collapse;
  table-layout: fixed;
  cursor: default;
}
.yakujo-ita-table td {
  padding: 0;
  border: 0;
  line-height: 10px;            /* 既存の .yakujo-ita-price / .yakujo-ita-qty と一致 */
  font-size: 10px;
  vertical-align: top;
}
/* 板の 21 行は <br> で改行 → 親の line-height がそのまま行高 */
/* 10px × 21 = 210px × zoom 0.2 = 42px (整数)・scale 5 で 210px = 全部整数 → 等間隔保証 */
.yakujo-ita-table:hover {
  transform: scale(5);          /* 0.2 × 5 = 100% (= 整数倍で px 整数化) */
  transform-origin: center 35%;
  will-change: transform;       /* GPU レイヤー化 = サブピクセル丸め安定化 */
  backface-visibility: hidden;  /* 同上 */
  position: relative;
  z-index: 100;
  background: #000;
}
/* 板 hover 中は scroll コンテナの overflow を解放 → 約定待ちパネル全体まで広がる */
.holding-scroll.yakujo-scroll:has(.yakujo-ita-table:hover) {
  overflow: visible;
}

/* 値段 td 現在値±4 行の強い背景色 (= 上昇方向プラス色 / 下降方向マイナス色 / 現在値行は現在値色・2026-06-01) */
.yakujo-price-bg-up {
  display: inline-block;
  width: 100%;
  background-color: color-mix(in srgb, var(--color-pos) 60%, transparent);
}
.yakujo-price-bg-down {
  display: inline-block;
  width: 100%;
  background-color: color-mix(in srgb, var(--color-neg) 60%, transparent);
}
.yakujo-price-bg-current {
  display: inline-block;
  width: 100%;
  background-color: var(--color-current);
}
.watch-slowst {
  display: inline-block;
  vertical-align: middle;
}
.watch-slowst-val {
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  vertical-align: middle;
  margin-left: 4px;
  font-size: 10px;
  line-height: 1.4;
  font-variant-numeric: tabular-nums;
  width: 32px;
  text-align: right;
}
.watch-slowst-k { color: rgba(130,190,255,0.9); font-size: 12px; line-height: 1.1; }
.watch-slowst-d { color: rgba(255,210,80,0.9); line-height: 1.1; }
.watch-slowst-k.is-alert { color: #a8d8ff; font-weight: bold; }
.watch-slowst-d.is-alert { color: #ffe566; font-weight: bold; }
.watch-slowst-trend {
  display: inline-flex;
  flex-direction: column;
  vertical-align: middle;
  align-items: center;
  margin-left: 3px;
  gap: 1px;
  font-size: 11px;
}
.watch-slowst-trend-arrow {
  font-size: 8px;
  line-height: 1.1;
  text-align: center;
}
.watch-slowst-trend-arrow.up   { color: var(--color-pos); }
.watch-slowst-trend-arrow.down { color: var(--color-neg); }
.watch-slowst-trend-arrow.flat { color: rgba(150,160,170,0.45); }
.yakujo-daily-candle {
  position: absolute;
  right: 178px;          /* yakujo-sparkline(166w, right:8px) の左 + 4px gap */
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  opacity: 0.7;
}
.watch-sparkline {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 0;
  pointer-events: none;
  opacity: 0.55;
}
/* 約定待ちの現在値グラフは右端から 4px 空ける (.watch-sparkline と同特異度、後勝ち。監視株パネルは不変) */
.yakujo-sparkline {
  right: 8px;
}
.watch-name-cell .watch-text-clip {
  position: relative;
  z-index: 1;
}

.watch-price-cell {
  white-space: nowrap;
}
/* 現在値 td の色を SlowSt トレンド矢印と同色に (up=pos / down=neg / flat=デフォルト) */
#watch-table-body tr[data-slowst-trend="up"]   .watch-price-cell { color: var(--color-pos); }
#watch-table-body tr[data-slowst-trend="down"] .watch-price-cell { color: var(--color-neg); }

/* 壁 td (= 値段 td / 数量 td の 2 列構成・売壁プラス色 / 買壁マイナス色・2026-05-30 追加)
   フォントは 勢力(近) td の .watch-v2-num に合わせる */
.watch-wall-price-cell { text-align: right; padding: 2px 2px 2px 4px; white-space: nowrap; vertical-align: middle; }
.watch-wall-qty-cell   { text-align: left;  padding: 2px 4px 2px 2px; white-space: nowrap; vertical-align: middle; }
.watch-wall-row { font-size: 0.92em; line-height: 1.2; }
/* 値段 cell のみ売壁/買壁色を適用・数量 cell は標準色 */
.watch-wall-price-cell .watch-wall-row.watch-wall-sell { color: var(--color-pos); }
.watch-wall-price-cell .watch-wall-row.watch-wall-buy  { color: var(--color-neg); }
/* 壁直前値 / 壁直前率 (= 壁の 1 つ手前の呼値とその対現在値率・2026-06-02 追加) */
.watch-wall-before-cell, .watch-wall-before-rate-cell { text-align: right; padding: 2px 4px; white-space: nowrap; vertical-align: middle; }
.watch-wall-before-cell .watch-wall-row.watch-wall-sell,
.watch-wall-before-rate-cell .watch-wall-row.watch-wall-sell { color: var(--color-pos); }
.watch-wall-before-cell .watch-wall-row.watch-wall-buy,
.watch-wall-before-rate-cell .watch-wall-row.watch-wall-buy { color: var(--color-neg); }

.watch-price-wrap {
  display: inline-flex;
  align-items: baseline;
}

.watch-price-int {
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.watch-price-dec {
  font-size: 0.78em;
  width: 1.8ch;
  text-align: left;
  font-variant-numeric: tabular-nums;
}

.watch-price-dec-empty {
  visibility: hidden;
}

.watch-price-pos {
  color: var(--color-pos);
}

.watch-price-neg {
  color: var(--color-neg);
}

.watch-price-empty {
  color: #6a7a8a;
}

.watch-name-cell .watch-text-clip {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* 監視株テーブルの銘柄名: 異様に長い名称があるので最大 15em (= 約 15 文字) に制限 + 末尾 ... */
#watch-table-body .watch-name-cell .watch-text-clip {
  max-width: 15em;
}

.watch-th-sort-btn {
  background: none;
  border: none;
  color: inherit;
  font: inherit;
  cursor: pointer;
  padding: 0.1em 0.5em;
  border-radius: 4px;
  transition: text-shadow 0.18s, background 0.18s;
}

.watch-th-sort-btn:hover {
  background: rgba(99, 181, 255, 0.12);
  text-shadow: 0 0 8px rgba(99, 181, 255, 0.9), 0 0 16px rgba(99, 181, 255, 0.5);
}

.watch-th-sort-btn.is-active {
  color: #f0c97a;
  text-shadow: 0 0 6px rgba(240, 201, 122, 0.8), 0 0 14px rgba(240, 201, 122, 0.4);
}

.watch-th-sort-btn.is-active:hover {
  background: rgba(240, 201, 122, 0.1);
  text-shadow: 0 0 10px rgba(240, 201, 122, 1), 0 0 22px rgba(240, 201, 122, 0.6);
}

.watch-drag-head,
.watch-drag-cell {
  width: 1.4rem;
  padding-left: 0.18rem;
  padding-right: 0.18rem;
  text-align: center;
}

.watch-drag-handle {
  display: inline-block;
  color: #cfe4f8a6;
  font-size: 0.78rem;
  line-height: 1.1;
  cursor: grab;
  user-select: none;
}

.watch-table tr[data-watch-id].watch-dragging {
  opacity: 0.58;
}

.watch-table tr.watch-drop-before td {
  box-shadow: inset 0 2px 0 #9fd7b6cc;
}

.watch-table tr.watch-drop-after td {
  box-shadow: inset 0 -2px 0 #9fd7b6cc;
}

.watch-table th {
  color: #cfe4f8;
  font-weight: 700;
  position: sticky;
  top: 0;
  background: #152535e6;
  z-index: 3;
}

.watch-cell-input {
  width: 100%;
  min-width: 5rem;
  height: 1.5rem;
  border: 1px solid #b8d2e84d;
  border-radius: 6px;
  background: #050a10a6;
  color: #f4f8ff;
  font-size: 0.68rem;
  padding: 0 0.35rem;
}

.watch-symbol-input {
  width: 7ch;
  min-width: 7ch;
}

.watch-priority-select {
  min-width: 2.8rem;
}

.watch-actions {
  display: flex;
  gap: 0.28rem;
}

.watch-delete-btn {
  height: 1.45rem;
  border-radius: 999px;
  font-size: 0.62rem;
  font-weight: 700;
  line-height: 1.1;
  padding: 0 0.42rem;
  cursor: pointer;
}

.watch-delete-btn {
  border: 1px solid #ff9a9a99;
  background: #5a101099;
  color: #ffd7d7bb;
}

.watch-delete-btn:hover {
  background: #7f1717bb;
}

.watch-delete-btn:disabled {
  opacity: 0.55;
  cursor: default;
}

/* 売買 td: 2 行 × 2 列 配置 (HTML で 2 個目 button の後に <br> を挿入することで 2 行化)
   td は通常の table-cell のまま vertical-align: middle で縦中央。 button 間の inline 余白除去 */
.watch-order-cell {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  vertical-align: middle;
  text-align: center;
  white-space: nowrap;
  font-size: 0;
  line-height: 0;
}
.watch-order-cell .watch-order-btn {
  font-size: 0.45rem;
  vertical-align: middle;
  margin: 0 0.5px;
}
.watch-order-btn {
  width: 1.0rem;
  height: 0.8rem;
  line-height: 0.9rem;
  border-radius: 3px;
  font-family: inherit;
  font-size: 0.45rem;
  font-weight: 700;
  padding: 0;
  cursor: pointer;
  border: 1px solid #5aaaffcc;
  background: #1a4a7acc;
  color: #a8d8ffee;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.watch-order-btn:hover {
  background: #2a6aabcc;
}
.watch-order-btn:disabled {
  border-color: #2a5080aa;
  background: #061520cc;
  color: #4a7a9a99;
  cursor: default;
}
.watch-order-btn.watch-order-done {
  border-color: #4aaa8899;
  background: #0a3a2a99;
  color: #4aaa88cc;
}
.watch-order-btn .holding-aim-arrow {
  color: inherit;
}
.watch-order-btn-double {
  width: 1.0rem;
  height: 0.8rem;
  gap: 0;
  overflow: hidden;
  background: #1b2530cc;
}
.watch-order-btn-double-l .holding-aim-arrow {
  margin: 0 -1px;
}
.watch-order-btn-double-r .holding-aim-arrow {
  margin: 0 0px;
}
.watch-order-btn-double-r .holding-aim-arrow.straight-up {
  color: color-mix(in srgb, var(--color-pos) 50%, transparent);
}
.holding-aim-arrow.straight-down {
  transform: rotate(90deg);
  color: color-mix(in srgb, var(--color-neg) 50%, transparent);
}
.holding-aim-arrow.straight-up {
  transform: rotate(-90deg);
  color: color-mix(in srgb, var(--color-neg) 50%, transparent);
}
.watch-order-btn:disabled .holding-aim-arrow.straight-down,
.watch-order-btn:disabled .holding-aim-arrow.straight-up {
  color: color-mix(in srgb, currentColor 50%, transparent);
}

.task-meta {
  margin-top: 0.3rem;
  display: flex;
  gap: 0.6rem;
  font-size: 0.66rem;
  letter-spacing: 0.02em;
  color: #dce8f5c2;
}

.pane1-toggle-btn {
  position: fixed;
  top: 50%;
  left: calc(40vw - 16px);
  transform: translateY(-50%);
  z-index: 300;
  width: 1.3rem;
  height: 3.2rem;
  padding: 0;
  background: #0a1929cc;
  border: 1px solid #2a5070;
  border-left: none;
  border-radius: 0 8px 8px 0;
  color: #7aa8cc;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.6rem;
  backdrop-filter: blur(8px);
  transition: left 0.38s cubic-bezier(0.4, 0, 0.2, 1),
              color 0.2s,
              box-shadow 0.2s,
              border-color 0.2s;
}

.pane1-toggle-btn:hover {
  color: #63b5ff;
  border-color: #4a90c0;
  box-shadow: 2px 0 12px rgba(99, 181, 255, 0.25), inset 0 0 6px rgba(99, 181, 255, 0.08);
}

body.pane-1-hidden .pane1-toggle-btn {
  left: 0;
}

.pane1-toggle-icon {
  transition: transform 0.38s cubic-bezier(0.4, 0, 0.2, 1);
}

body.pane-1-hidden .pane1-toggle-icon {
  transform: scaleX(-1);
}

.footer-bar {
  display: none;
}

.footer-note {
  margin: 0;
  max-width: 100%;
  font-size: 8px;
  line-height: 1.1;
  color: #f8fbff57;
  letter-spacing: 0.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  user-select: none;
}

.time {
  display: inline-flex;
  align-items: baseline;
  gap: 0.55rem;
  font-size: clamp(1.1rem, 2.5vw, 2rem);
  line-height: 1.1;
  color: #f8fbff;
  background: #0000;
  border: 0;
  padding: 0;
  border-radius: 0;
  text-shadow: 0 1px 0 #000000bf;
  box-shadow: none;
  backdrop-filter: none;
}

.time-date {
  font-size: 0.68em;
  opacity: 0.92;
}

.time-weekday {
  font-size: 0.68em;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: #d6e2f2;
}

.time-weekday.sunday {
  color: #ff6f7f;
}

.time-weekday.saturday {
  color: #6ea8ff;
}

.time-clock {
  font-size: 1em;
}

.clock-hour-ten.muted {
  color: #f8fbffa6;
}

.clock-colon {
  display: inline-block;
  width: 0.45em;
  text-align: center;
}

.clock-colon.off {
  opacity: 0;
}

.watch-v4-stack {
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 1;
}
.watch-v4-secs {
  font-size: 0.95em;
  color: #fff;
  font-weight: bold;
  font-variant-numeric: tabular-nums;
}
.yakujo-uketsukeno-label {
  font-size: 0.95em;
  color: #94a2b2;
  font-variant-numeric: tabular-nums;
  padding: 0.4em 0 0;
}
.yakujo-name-info {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
  text-shadow: 2px 2px 4px #000, 2px 2px 4px #000, 2px 2px 4px #000;
}
/* 反転攻勢の約定待ち注文タグ (コード・銘柄 td: 銘柄名の下に割り込み・オレンジ小さめ太字) */
.yakujo-reverse-attack {
  color: #ff9800;
  font-size: 0.68em;
  font-weight: bold;
}
.yakujo-forced-exit {
  color: #d97706;
  font-size: 0.68em;
  font-weight: bold;
  margin-left: 4px;
}
.yakujo-forced-exit:empty {
  display: none;
}
.watch-v4-secs-unit {
  color: #94a2b2;
  font-weight: normal;
}

.policy-post-close-locked-label.is-disabled,
.policy-post-close-extra.is-disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.policy-post-close-locked-label.is-disabled input,
.policy-post-close-extra.is-disabled input,
.policy-post-close-extra.is-disabled select {
  cursor: not-allowed;
}

/* ── 携帯（モバイル）レイアウト ─────────────────────────────────────────── */
/* JS が初期判定とユーザー手動切替で body.is-mobile を付け外しする */
body.is-mobile,
body.is-mobile html {
  height: auto;
  min-height: 100vh;
  overflow: auto;
}
body.is-mobile .main-content {
  display: flex;
  flex-direction: column;
  overflow: visible;
  height: auto;
}
/* タスクパネル & Steps パネルを含む pane-1 を非表示 */
/* ★ 2026-06-30 携帯版の作り直し: 一旦すべてのパネルを表示する (非表示は新設計で個別に行う)。
   従来は pane-1(左列)を display:none で丸ごと隠していた。 まず全列表示にしてから削減を設計する。 */
body.is-mobile .pane-1 {
  width: 100%;
  flex: none;
  padding: 0.5rem;
}
/* ★ 2026-06-30 携帯版: 監視株パネルは枠(table/#watch-table-body 等)を残して JS の null 参照を防ぎつつ、
   見た目だけ隠す。 中の tr は watch_rows 空(SSR)・ポーリング<w>も空なのでデータ転送は軽量。 */
body.is-mobile .watch-card { display: none; }
/* ★ 2026-07-02 携帯モードは指標パネルの日経4dグラフを非表示 */
body.is-mobile #wmi-nk-graph-4d { display: none; }
/* ★ 2026-07-02 携帯モードは選択トレンドの中サイズグラフ(ind-header-graph)を非表示 */
body.is-mobile .ind-header-graph { display: none; }
/* ★ 2026-07-02 携帯モードは大きな矢印(indicator-arrows)の後で改行 → ボタン列を次行に */
body.is-mobile .indicator-header { flex-wrap: wrap; }
body.is-mobile #ind-trend-table-wrap { overflow-x: auto; }  /* トレンド調整テーブルの横はみ出しを横スクロールで対処 */
body.is-mobile .indicator-btn-group { flex-basis: 100%; }
/* ★ 2026-07-03 携帯モード: 投資結果パネルの「通算表示」トグルだけ非表示 (終日グラフは残す) */
body.is-mobile .result-today-label:has(> #result-today-chk) { display: none; }
/* ★ 2026-07-03 携帯モード: 投資結果ヘッダの損益 font-size 調整 (数字1.8rem/単位1.0rem)。
   pos/neg 色付き時は .pane-title-pl-pos/neg が 2.2rem で prevail するので、そちらも一緒に上書き。 */
body.is-mobile .result-pl-sub,
body.is-mobile .result-pl-sub.pane-title-pl-pos,
body.is-mobile .result-pl-sub.pane-title-pl-neg { font-size: 1.8rem; }
body.is-mobile .result-pl-sub .result-unit { font-size: 1.0rem; }
/* ★ 2026-07-03 携帯モード: 投資結果テーブルの損益列(3列目)を広げる。
   .holding-table は table-layout:auto なので width 指定は内容優先で無視される → min-width で最低幅を強制。 */
body.is-mobile .result-table th:nth-child(3),
body.is-mobile .result-table td:nth-child(3) { min-width: 11.3em; }
/* ★ 2026-07-03 携帯モード: ind-arrow-timer を絶対配置→通常フローに戻し、indicator-btn-row の横に並べる */
body.is-mobile .ind-arrow-timer {
  position: static;
  transform: none;
  bottom: auto;
  left: auto;
  margin-bottom: 0;
  margin-left: 4px;
}
/* ★ 2026-07-03 携帯モードは手動ボタン(上/下/フラット/解除)を大きく 30x30 に */
body.is-mobile .indicator-btn-up,
body.is-mobile .indicator-btn-down,
body.is-mobile .indicator-btn-flat,
body.is-mobile .indicator-btn-clear {
  width: 30px; height: 30px;
}
/* 解除はテキストボタンなので中央寄せ+padding詰めて正方形に収める */
body.is-mobile .indicator-btn-clear {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0; box-sizing: border-box;
}
/* ★ 2026-07-03 携帯モード: ボタン列の top:4px オフセットを消して #ind-arrow-3 と縦位置(高さ)を揃える */
body.is-mobile .indicator-btn-row { top: 0; align-items: center; }
/* ★ 2026-07-02 携帯モードは同一/反転トレンドラインのラベル文字だけ消してチェックボックスは残す */
body.is-mobile label:has(#ind-topix-chk-same-trend),
body.is-mobile label:has(#ind-topix-chk-rev-trend) { font-size: 0; }
/* ★ 2026-07-03 携帯モードは NASDAQ / NYダウ / ドル円 を丸ごと(ラベル・値・グラフ)非表示 */
body.is-mobile div:has(> #wmi-nasdaq),
body.is-mobile div:has(> #wmi-dj),
body.is-mobile div:has(> #wmi-fx) { display: none !important; }
/* ★ 2026-07-03 携帯モードは資産ヘッダの 買付可能額/預り金/信用保証金/出金可能額 の行を非表示 */
body.is-mobile .av2-row:has(#asset-val-buyable),
body.is-mobile .av2-row:has(#asset-val-deposit),
body.is-mobile .av2-row:has(#asset-val-margin),
body.is-mobile .av2-row:has(#asset-val-withdraw) { display: none; }
/* ★ 2026-07-03 携帯モードは資産合計の値を 1.8rem → 1.2rem に */
body.is-mobile .asset-title-total-val { font-size: 1.2rem; }
/* ★ 2026-07-03 携帯モードは約定待ちヘッダの「信用新規建余力」を非表示 */
body.is-mobile .yakujo-shinyo-pair:has(#yakujo-shinyo-power) { display: none; }
/* ★ 2026-07-03 携帯モードは資産ヘッダ前日比の％表示だけ非表示 (円の金額は残す) */
body.is-mobile .pane-title-pl-rate { display: none; }
/* ★ 2026-07-03 資産ヘッダ「信用新規建余力」: PCはフル・携帯モードは「新規建余力」に短縮 (はみ出し対策) */
.ptl-short { display: none; }
body.is-mobile .ptl-full  { display: none; }
body.is-mobile .ptl-short { display: inline; }
/* ★ 2026-07-03 携帯モードは pane-title-total-label の右マージンを 7px に */
body.is-mobile .pane-title-total-label { margin-right: 7px; }
/* ★ 2026-07-03 携帯モードは資産カード内の単位(円/%等)を小さく 0.5em に */
body.is-mobile .asset-card .asset-unit { font-size: 0.5em; }
/* ★ 2026-07-02 携帯モードは日経225/TOPIX の値・前日比を小さく */
body.is-mobile #wmi-nk .wmi-val,  body.is-mobile #wmi-nk .wmi-diff,
body.is-mobile #wmi-tx .wmi-val,  body.is-mobile #wmi-tx .wmi-diff {
  font-size: 1.2em;
}
/* ★ 2026-06-30 左列パネルを画面外へ移動する切替ボタン(#pane1-toggle)は PC専用。 携帯では邪魔なので隠す。 */
body.is-mobile #pane1-toggle { display: none; }
/* ★ 2026-06-30 携帯版: 保有株/約定待ちパネルのテーブルは内部スクロールさせず行数ぶん縦に伸ばす。
   高さ制約(flex:1)を外せば overflow-y:auto のままでもスクロールバーは出ない(中身が収まる)。 */
body.is-mobile #pane-holding .holding-scroll,
body.is-mobile #pane-yakujo .holding-scroll {
  flex: none;
  max-height: none;
  height: auto;
  min-height: 0;
}
/* ★ 2026-07-03 携帯モードは約定待ちテーブルを横スクロール可に (列が多くはみ出すため) */
body.is-mobile #pane-yakujo .holding-scroll { overflow-x: auto; }
/* ★ 2026-07-03 携帯モードは発注待ちヘッダの 実質余力/発注予定/発注余力 (ラベル+値) を非表示 */
body.is-mobile #hatchu-jissitsu-yoryoku,
body.is-mobile .pane-title-total-label:has(+ #hatchu-jissitsu-yoryoku),
body.is-mobile #hatchu-hatchu-yotei,
body.is-mobile .pane-title-total-label:has(+ #hatchu-hatchu-yotei),
body.is-mobile #hatchu-hatchu-yoryoku,
body.is-mobile .pane-title-total-label:has(+ #hatchu-hatchu-yoryoku) { display: none; }
/* ★ 2026-07-03 携帯モードは投資方針ヘッダのボタンの横padding を半分に (保存/ｷｬﾝｾﾙ 5→2.5px・作戦 6→3px) */
body.is-mobile .policy-btn-save,
body.is-mobile .policy-btn-cancel { padding-left: 2.5px; padding-right: 2.5px; }
body.is-mobile .policy-sakusen-btn { padding-left: 3px; padding-right: 3px; }
body.is-mobile .main-pane {
  width: 100%;
  flex: none;
  padding: 0.5rem;
}
body.is-mobile .pane-1-stack,
body.is-mobile .pane-2-stack,
body.is-mobile .pane-3-stack {
  display: flex;
  flex-direction: column;
  grid-template-rows: none;
  grid-template-columns: none;
  gap: 0.75rem;
  height: auto;
  min-height: 0;
}
/* ★ pane-1-stack も追加 (2026-06-30): 保有株/約定待ち/資産/発注待ちは pane-1 にあり、
   ここが抜けていると pane-card が高さ固定のままで中のテーブルがクリップされ下が見れない。 */
body.is-mobile .pane-1-stack > .pane-card,
body.is-mobile .pane-2-stack > .pane-card,
body.is-mobile .pane-3-stack > .pane-card {
  min-height: 0;
  height: auto;
}

/* ★ 2026-07-03 携帯モード: パネルを1枚単位で自由並び替え。
   section(main-pane) と stack を display:contents でフラット化し、全 pane-card を
   main-content(flex column) の直接子に昇格 → order で順序制御。PCは body.is-mobile 限定で無影響。
   contents で消える stack の gap / pane の padding は main-content 側に移設。 */
body.is-mobile .main-content { gap: 0.3rem; padding: 0; }
body.is-mobile .main-pane,
body.is-mobile .pane-1-stack,
body.is-mobile .pane-2-stack,
body.is-mobile .pane-3-stack { display: contents; }
/* 並び順: 投資方針→資産→指標→保有株→約定待ち→発注待ち→投資結果 (監視株は非表示なので対象外) */
body.is-mobile #pane-policy    { order: 1; }
body.is-mobile #pane-asset     { order: 2; }
body.is-mobile #pane-indicator { order: 3; }
body.is-mobile #pane-holding   { order: 4; }
body.is-mobile #pane-yakujo    { order: 5; }
body.is-mobile #pane-hatchu    { order: 6; }
body.is-mobile #pane-result    { order: 7; }

/* ★ 2026-07-03 携帯モード: 約定待ち行をカード風に。tr の display:grid を確実に効かせるため
   tbody を block 化する(table-row-group のままだと tr の grid が無視される=これが「変わらない」原因)。
   thead は列対応しないので非表示。コード銘柄を全幅・大フォントで最上段、残り項目を4列gridで下に折り返し(3行程度)。 */
body.is-mobile .pending-table thead { display: none; }
body.is-mobile .pending-table tbody { display: block; }
body.is-mobile .pending-table tbody tr {
  display: flex;
  flex-wrap: wrap;          /* ブロックを横に並べ、幅が尽きたら折り返す(gridの列共有の縛りが無い) */
  gap: 2px 0;
  align-items: stretch;
  border-bottom: 1px solid #ffffff1f;
  padding: 8px 0;
}
body.is-mobile .pending-table td {
  max-width: none !important;
  height: 60px !important;    /* 全ブロック高さ60px固定(min-heightだと中身多いブロックが伸びてバラつく) */
  overflow: hidden;           /* 60pxを超える中身はクリップ */
  flex: none;                 /* width で幅固定・縮ませない = 各ブロック独立幅 */
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: center;    /* 中身を縦方向中央揃え */
}
/* ★ 2026-07-03 取消/反転ボタン: PCは従来どおり縦、携帯は横並び(縦の細ボタンは指で押しにくいため) */
.yakujo-btn-row { display: flex; flex-direction: column; gap: 2px; }
body.is-mobile .yakujo-btn-row { flex-direction: row; gap: 6px; margin-top: 4px; }
body.is-mobile .yakujo-btn-row button { flex: 1; }
/* 1行目: 作戦64 / コード銘柄256 / SlowSt60 (計380pxで自然折り返し)。order で先頭に */
body.is-mobile .pending-table td:nth-child(2) { order: -3; width: 64px;  min-height: 60px; }                     /* 作戦 */
body.is-mobile .pending-table td:nth-child(3) { order: -2; width: 256px; min-height: 60px; font-size: 0.7rem; } /* コード銘柄 */
body.is-mobile .pending-table td:nth-child(4) { order: -1; width: 60px;  min-height: 60px; align-items: flex-start; } /* SlowSt */
/* 2行目以降(order:0のまま・flex-wrapで折り返し)。各ブロック幅を個別指定 */
body.is-mobile .pending-table td:nth-child(5) { width: 86px; min-width: 86px; max-width: 86px !important; align-items: flex-start; font-size: 0.65rem; }  /* 建値 幅86px固定 */
body.is-mobile .pending-table td:nth-child(6) { width: 66px; min-width: 66px; max-width: 66px !important; font-size: 0.6rem; margin-left: 8px !important; }  /* 現在値 幅66px固定。 gridは内側 .yakujo-cur-grid へ(2026-07-16 行選択枠ズレ対策でtd直付けを廃止) */
body.is-mobile .yakujo-cur-grid { align-content: center; grid-auto-rows: min-content; }  /* v3左/現在値右(PC同様)・行の間延び防止。 height:100%は基底ルール */
body.is-mobile .yakujo-v5-row { font-size: 4px; line-height: 5px; }  /* v5(現在値の右)を携帯だけ小さく */
body.is-mobile .yakujo-v5-smooth-cell { font-size: 6px; }  /* v5平滑(v5の右)を携帯だけ小さく */
/* td6(yakujo-cur-td)内の隙間を全て0に(gap/margin/padding全部・携帯のみ) */
body.is-mobile .yakujo-cur-td,
body.is-mobile .yakujo-cur-td * {
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
}
body.is-mobile .yakujo-v5-cell .yakujo-v5-overlay { zoom: normal; }  /* v5ブロックのzoomを携帯だけ解除(等倍) */
body.is-mobile .yakujo-v5-cell { margin-left: 10px; }  /* v5ブロックの左マージンを携帯だけ10px追加 */
body.is-mobile .pending-table td:last-child { width: 80px; line-height: 12px; }  /* 価格修正(最後のブロック) */
body.is-mobile .pending-table td:nth-last-child(2) { line-height: 11px; width: 55px; min-width: 55px; max-width: 55px !important; align-items: flex-end; }  /* 発注価格(価格修正の一つ左) 幅55px固定・右寄せ */
body.is-mobile .yakujo-stage-btn,
body.is-mobile .yakujo-evac-btn { font-size: 8px; }  /* 段階撤収/即時撤収ボタンを携帯だけ小さく */
body.is-mobile .yakujo-spin-up,
body.is-mobile .yakujo-spin-down { font-size: 16px; padding: 4px 5px; }  /* 価格調整▲▼(価格修正列)だけ携帯で約1.8倍。最低利確スピナー(yakujo-min-profit-*)は対象外 */
/* 板(7列目)は iOS Safari で子テーブルがうまく描画されないため非表示 */
body.is-mobile .pending-table td:nth-child(7) {
  display: none;
}

#layout-toggle-btn {
  background: #1a2e42;
  border: 1px solid #2a4a64;
  color: #8ab4d0;
  font-size: 0.72rem;
  padding: 4px 8px;
  border-radius: 4px;
  cursor: pointer;
  opacity: 0.7;
  transition: opacity 0.15s;
  white-space: nowrap;
  margin-right: 6px;
}
#layout-toggle-btn:hover {
  opacity: 1;
}
/* ★ 2026-06-30 携帯版リロードトグル: 通常(PC)は非表示・is-mobile時のみ表示。押下で2分間ポーリング、走行中は緑+残り秒。 */
#mobile-reload-btn {
  display: none;
  background: #1a2e42;
  border: 1px solid #2a4a64;
  color: #8ab4d0;
  font-size: 0.72rem;
  padding: 4px 8px;
  border-radius: 4px;
  cursor: pointer;
  white-space: nowrap;
  margin-right: 6px;
}
body.is-mobile #mobile-reload-btn { display: inline-block; }
#mobile-reload-btn.is-polling {
  background: #14401f;
  border-color: #2a6a3a;
  color: #7fe0a0;
}