/* ============================================================
   画面の骨組みの作り直し（2026-10-31 ユーザー指示）
   「システム内すべてが対象。実機と比べてパクったなと感じる所には手を加える。言い回しより見た目の変化。
    統一感はほしいので角のある枠は無し」
   - 各画面の上の下線タブ（実機と同じ形）→ PC は左の縦の一覧（コミックの左の一覧と同じ見た目）、スマホは角丸の横並び。
   - 見出し・カード・ボタン・入力欄・表を角丸でそろえる（サイドバーと全体の色の雰囲気は元のまま）。
   ============================================================ */
:root {
  --s2-ink: #1c2333;
  --s2-sub: #5b6475;
  --s2-line: #e3e7ee;
  --s2-soft: #f6f8fb;
  --s2-blue: #2f6feb;
  --s2-blue-d: #1f55c9;
  --s2-blue-soft: #eaf1ff;
  --s2-r: 12px;
}

/* ---------- 見出し ---------- */
.module__header { margin-bottom: 16px; }
.module__header h1 { display: flex; align-items: center; gap: 10px; font-size: 22px; font-weight: 800; color: var(--s2-ink); letter-spacing: .02em; }
.module__header h1::before { content: ""; width: 6px; height: 24px; border-radius: 3px; background: linear-gradient(180deg, var(--s2-blue), #6aa0ff); }

/* ---------- 画面の中のメニュー ----------
   2026-10-31 ユーザー指示「これは戻す、画面が小さくなる。上段固定」→ 左の縦の一覧はやめ、PC もスマホも上の段の横並び（角丸）。 */
.module > nav.topbar {
  border: 1px solid var(--s2-line); border-radius: var(--s2-r); background: #fff; padding: 4px; gap: 2px; margin-bottom: 14px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
}
.module > nav.topbar .topbar__item { border: 0; border-radius: 8px; }
.module > nav.topbar .topbar__item:hover:not(:disabled) { background: var(--s2-soft); }
.module > nav.topbar .topbar__item--active { background: var(--s2-blue-soft); color: var(--s2-blue-d); font-weight: 700; }
.module > nav.topbar .topbar__item--active::after { content: none; }
.module > nav.topbar .topbar__sep { width: 1px; align-self: stretch; margin: 6px 4px; background: var(--s2-line); }
.module > nav.topbar .topbar__sep::before { content: none; }
.module > nav.topbar .topbar-more__toggle { border-radius: 8px; }
@media (max-width: 900px) { .module > nav.topbar .topbar__sep { display: none; } }

/* ---------- カード・ボタン・入力・表（角丸でそろえる） ---------- */
.main .card { border-radius: 14px; border-color: var(--s2-line); box-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 6px 16px rgba(16, 24, 40, .03); }
.main .btn { border-radius: 8px; }
.main .btn--primary { background: var(--s2-blue); border-color: var(--s2-blue); }
.main .btn--primary:hover:not(:disabled) { background: var(--s2-blue-d); }
.main :where(input[type="text"], input[type="number"], input[type="search"], input[type="date"], input[type="email"], input[type="password"], input[type="tel"], input[type="url"], select, textarea) { border-radius: 8px; }
.main :where(button) { border-radius: 8px; }
.main :where(details, fieldset, pre, dialog) { border-radius: 10px; }
.main .order-table { border-radius: 10px; overflow: hidden; }
.main .order-table thead th { background: #f1f4f9; color: var(--s2-sub); font-weight: 700; }

/* ---------- 計器盤（状態と数字をまとめる。DataBank と同じ見た目を共通部品に） ---------- */
.hx-visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.hx-hero {
  position: relative; overflow: hidden; color: #e6eef7; border-radius: 14px; padding: 16px 16px 12px; margin-bottom: 16px;
  background: radial-gradient(circle at 1px 1px, rgba(255,255,255,.07) 1px, transparent 0) 0 0 / 14px 14px, linear-gradient(135deg, #0b1a2c 0%, #12304d 60%, #163a5c 100%);
  box-shadow: 0 8px 24px rgba(11, 26, 44, .22), inset 0 1px 0 rgba(255,255,255,.06);
}
.hx-hero__top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.hx-hero__title { font-size: 17px; color: #fff; letter-spacing: .05em; }
.hx-hero__sub { font-size: 12.5px; color: #a9bdd2; overflow-wrap: anywhere; margin-left: auto; }
.hx-hero__note { font-size: 11.5px; color: #8aa0b8; margin-top: 8px; }
.hx-hero .pt-badge { display: inline-flex; align-items: center; gap: 7px; padding: 4px 11px 4px 9px; border-radius: 8px; font-size: 13px; font-weight: 700;
  color: #cfd8e3; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14); }
.hx-hero .pt-badge::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: #7d8a99; }
.hx-hero .pt-badge.run { color: #b9f6d4; border-color: rgba(52,211,153,.45); background: rgba(52,211,153,.12); }
.hx-hero .pt-badge.run::before { background: #34d399; box-shadow: 0 0 0 3px rgba(52,211,153,.25), 0 0 10px #34d399; animation: dbkPulse 1.4s ease-in-out infinite; }
.hx-hero .pt-badge.stop { color: #fecaca; border-color: rgba(248,113,113,.45); background: rgba(248,113,113,.12); }
.hx-hero .pt-badge.stop::before { background: #f87171; }
.hx-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.hx-tile { padding: 10px 12px 9px; border-radius: 10px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.11); min-width: 0; }
.hx-tile > span { display: block; font-size: 11.5px; color: #9fb3c8; letter-spacing: .04em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hx-tile > b { font-size: 22px; font-weight: 700; color: #fff; font-variant-numeric: tabular-nums; }
.hx-tile > small { margin-left: 4px; font-size: 11.5px; color: #9fb3c8; }
@media (min-width: 721px) { .hx-tiles--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.hx-cols { display: grid; grid-template-columns: 1fr; gap: 16px; margin-bottom: 16px; }
@media (min-width: 1000px) { .hx-cols { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; } }
.rp-top .pt-card.hx-control, .rp-top .pt-card.hx-loglite, .rp-top .pt-card.hx-logmain { border-radius: 14px; border-color: var(--s2-line); box-shadow: 0 1px 2px rgba(16,24,40,.04), 0 6px 16px rgba(16,24,40,.03); }
.rp-top .pt-card .pt-h small { font-weight: 400; font-size: 12px; color: var(--s2-sub); margin-left: 6px; }
@media (max-width: 720px) { .hx-tiles--5 > .hx-tile:last-child { grid-column: 1 / -1; } }

/* ---------- 出荷作業: 今日の出荷（計器盤）＋番号の丸と線でつないだ流れ ---------- */
.hx-hero__btn { margin-left: 4px; padding: 5px 12px; border-radius: 8px; border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.08); color: #e6eef7; font-size: 12.5px; cursor: pointer; }
.hx-hero__btn:hover { background: rgba(255,255,255,.16); }
.hx-hero .hx-hero__sub strong { color: #fff; margin-left: 4px; }
.hx-hero .progress-status-text { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 8px; font-size: 12.5px; font-weight: 700; color: #fde4a8; background: rgba(251,191,36,.12); border: 1px solid rgba(251,191,36,.4); margin: 0; }
.hx-hero .progress-status-text--done { color: #b9f6d4; background: rgba(52,211,153,.12); border-color: rgba(52,211,153,.45); }
.hx-ship { display: grid; grid-template-columns: 1fr; gap: 10px; }
@media (min-width: 721px) { .hx-ship { grid-template-columns: 220px minmax(0, 1fr); } }
.hx-tile--big > b { font-size: 34px; line-height: 1.15; display: block; }
.hx-tile--big > small { display: block; margin: 4px 0 0; }
.hx-ship__cap { display: block; font-size: 11.5px; color: #9fb3c8; margin-bottom: 6px; }
.hx-hero .hx-methods { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.hx-hero .hx-methods > li { display: flex; flex-direction: column; gap: 2px; padding: 9px 12px; border-radius: 10px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.11); color: #cfe0f1; font-size: 12.5px; }
.hx-hero .hx-methods > li strong { color: #fff; font-size: 20px; font-variant-numeric: tabular-nums; }
.hx-hero .hx-methods > li.ship-method-summary__excluded { border-color: rgba(251,191,36,.4); }
.hx-hero .hx-methods > li.ship-method-summary__exlist { grid-column: 1 / -1; display: block; font-size: 12px; line-height: 1.7; }
.hx-hero .hx-methods a { color: #93c5fd; }
.hx-hero .hx-bar { height: 8px; border-radius: 99px; background: rgba(255,255,255,.12); overflow: hidden; margin: 12px 0 4px; border: 0; }
.hx-hero .hx-bar .progress-bar__fill { height: 100%; border-radius: 99px; background: linear-gradient(90deg, #38bdf8, #34d399) !important; box-shadow: 0 0 10px rgba(56,189,248,.6); }
.hx-hero__help { margin-top: 6px; font-size: 12px; color: #a9bdd2; line-height: 1.7; border: 0; background: none; }
.hx-hero__help > summary { cursor: pointer; color: #cfe0f1; font-size: 12px; }

.hx-flow { position: relative; counter-reset: hxstep; padding-left: 50px; }
.hx-flow::before { content: ""; position: absolute; left: 19px; top: 18px; bottom: 30px; width: 2px; border-radius: 2px; background: linear-gradient(180deg, #bcd0f5, #e3e7ee); }
.hx-flow > .hx-step { position: relative; counter-increment: hxstep; margin-bottom: 14px; }
.hx-flow > .hx-step > h2 { display: flex; align-items: center; gap: 10px; font-size: 17px; }
.hx-flow > .hx-step > h2::before {
  content: counter(hxstep); position: absolute; left: -50px; top: 14px; width: 40px; height: 40px; border-radius: 12px;
  display: grid; place-items: center; font-size: 17px; font-weight: 800; color: #fff;
  background: linear-gradient(135deg, var(--s2-blue), #5b8def); box-shadow: 0 4px 10px rgba(47,111,235,.3), 0 0 0 4px #f4f6fa;
}
.hx-flow > .hx-step > .card__header-row h2::before { content: none; }
@media (max-width: 720px) {
  .hx-flow { padding-left: 38px; }
  .hx-flow::before { left: 14px; }
  .hx-flow > .hx-step > h2::before { left: -38px; width: 30px; height: 30px; font-size: 14px; border-radius: 9px; top: 16px; }
}

/* ---------- 設定画面（js/hx_settings.js が並べ替えたもの） ---------- */
.hx-sform { max-width: none !important; display: block; }
.hx-sform__nav { position: sticky; top: 0; z-index: 5; display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; margin: 4px 0 14px; padding: 8px 0;
  background: linear-gradient(#fff 80%, rgba(255,255,255,0)); }
.hx-sform__nav::-webkit-scrollbar { display: none; }
.hx-sform__nav > button { flex: none; padding: 6px 12px; border-radius: 8px; border: 1px solid var(--s2-line); background: var(--s2-soft); color: var(--s2-ink); font-size: 12.5px; cursor: pointer; white-space: nowrap; }
.hx-sform__nav > button:hover { background: var(--s2-blue-soft); border-color: #bcd0f5; color: var(--s2-blue-d); }
.hx-sform__grid { column-gap: 16px; }
@media (min-width: 1100px) { .hx-sform__grid { column-count: 2; } }
.hx-sform__grid > fieldset {
  break-inside: avoid; display: block; width: 100%; margin: 0 0 16px; padding: 0 16px 14px; scroll-margin-top: 64px;
  border: 1px solid var(--s2-line); border-radius: 14px; background: #fff; box-shadow: 0 1px 2px rgba(16,24,40,.04);
}
.hx-sform__grid > fieldset > legend {
  float: left; width: calc(100% + 32px); margin: 0 -16px 12px; padding: 11px 16px; box-sizing: border-box;
  font-size: 14px; font-weight: 700; color: var(--s2-ink); background: linear-gradient(90deg, #eef3fc, #f8fafd); border-bottom: 1px solid var(--s2-line);
  border-radius: 14px 14px 0 0; display: flex; align-items: center; gap: 8px;
}
.hx-sform__grid > fieldset > legend::before { content: ""; width: 8px; height: 8px; border-radius: 3px; background: var(--s2-blue); }
.hx-sform__grid > fieldset > legend + * { clear: both; }
.hx-sform__grid > fieldset > * + * { margin-top: 10px; }
.hx-sform .settings-field > label:not(.settings-field__checkbox) { font-size: 12.5px; color: var(--s2-sub); font-weight: 600; }
@media (min-width: 721px) {
  .hx-sform__grid .settings-field:has(> label:first-child + input, > label:first-child + select) { display: grid; grid-template-columns: minmax(120px, 42%) minmax(0, 1fr); align-items: center; gap: 10px; }
}
.hx-sform__grid fieldset fieldset { border: 1px dashed var(--s2-line); border-radius: 10px; padding: 10px 12px; }
.hx-sform__grid fieldset fieldset > legend { font-size: 12.5px; color: var(--s2-sub); padding: 0 6px; }
.hx-savebar { position: sticky; bottom: 0; z-index: 5; display: flex; justify-content: flex-end; gap: 10px; margin: 6px -4px 0; padding: 10px 12px;
  background: rgba(255,255,255,.94); backdrop-filter: blur(6px); border: 1px solid var(--s2-line); border-radius: 12px; box-shadow: 0 -4px 16px rgba(16,24,40,.06); }
.hx-savebar .btn { min-width: 160px; min-height: 42px; font-weight: 700; }
@media (min-width: 901px) { .hx-sform__nav { flex-wrap: wrap; overflow: visible; } }

/* ---------- 共通部品: 見出し＋右の操作、ツールバー、数字タイル（明るい）、入力の横並び、状態の帯 ---------- */
.hx-head { display: flex; align-items: center; gap: 10px 16px; flex-wrap: wrap; margin-bottom: 12px; }
.hx-head > h2 { margin: 0 !important; }
.hx-head > :last-child:not(h2) { margin-left: auto; }
.hx-toolbar { display: flex !important; align-items: center; gap: 8px; flex-wrap: wrap; padding: 6px; border: 1px solid var(--s2-line); border-radius: 12px; background: var(--s2-soft); margin: 0 !important; }
.hx-toolbar > div { display: flex; align-items: center; gap: 6px; }
.hx-toolbar label { font-size: 12.5px; color: var(--s2-sub); }
.hx-toolbar input { min-height: 34px; border: 1px solid var(--s2-line); background: #fff; padding: 2px 8px; }
.hx-toolbar .btn { min-height: 34px; padding: 4px 18px; }
.hx-kpis { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0 0 14px; }
@media (min-width: 721px) { .hx-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .hx-kpis { grid-template-columns: 1.4fr repeat(7, minmax(0, 1fr)); } }
.hx-kpi { padding: 10px 12px; border-radius: 12px; background: #fff; border: 1px solid var(--s2-line); min-width: 0; }
.hx-kpi > span { display: block; font-size: 11.5px; color: var(--s2-sub); white-space: nowrap; }
.hx-kpi > b { font-size: 17px; color: var(--s2-ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.hx-kpi--main { background: linear-gradient(135deg, #0b1a2c, #163a5c); border-color: transparent; }
.hx-kpi--main > span { color: #9fb3c8; }
.hx-kpi--main > b { color: #fff; font-size: 21px; }
.hx-subcard { border: 1px solid #d6e2f7; border-radius: 12px; background: #f7faff; padding: 12px 14px 14px; margin: 12px 0 18px; }
.hx-subcard__h { font-size: 13.5px; font-weight: 700; color: var(--s2-blue-d); margin-bottom: 10px; display: flex; align-items: center; gap: 8px; }
.hx-subcard__h::before { content: ""; width: 8px; height: 8px; border-radius: 3px; background: var(--s2-blue); }
.hx-subcard__h--plain { color: var(--s2-ink); margin-top: 6px; }
.hx-formgrid { display: grid; grid-template-columns: 1fr; gap: 10px 12px; align-items: end; }
@media (min-width: 721px) { .hx-formgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.hx-formgrid .settings-field { display: grid; gap: 4px; margin: 0; }
.hx-formgrid .settings-field label { font-size: 12px; color: var(--s2-sub); font-weight: 600; }
.hx-formgrid input { background: #fff; }
.hx-formgrid .spapi-actions { grid-column: 1 / -1; display: flex; justify-content: flex-end; margin: 0; }
.hx-statuspill { margin: 0; padding: 6px 12px; border-radius: 10px; background: var(--s2-blue-soft); color: var(--s2-blue-d); font-size: 12.5px; }

/* ---------- 評価リクエスト予約: 長い一列の表 → 小さなカードの並び（PC・スマホとも） ---------- */
#review-requests-table { border: 0; background: none; }
#review-requests-table thead { display: none; }
#review-requests-table tbody { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 8px; }
#review-requests-table tbody tr { display: grid; grid-template-columns: auto 1fr auto; grid-template-rows: auto auto; column-gap: 10px; align-items: center;
  padding: 9px 10px; border: 1px solid var(--s2-line); border-radius: 12px; background: #fff; }
#review-requests-table tbody tr:has(.review-request-check:checked) { border-color: #f3b1b1; background: #fff7f7; }
#review-requests-table tbody td { border: 0 !important; padding: 0 !important; background: none !important; }
#review-requests-table tbody td:nth-child(1) { grid-row: 1 / span 2; }
#review-requests-table tbody td:nth-child(2) { font-family: ui-monospace, Consolas, monospace; font-size: 12.5px; color: var(--s2-ink); }
#review-requests-table tbody td:nth-child(3) { grid-column: 2; grid-row: 2; font-size: 11.5px; color: var(--s2-sub); }
#review-requests-table tbody td:nth-child(3)::before { content: "送信予定 "; }
#review-requests-table tbody td:nth-child(4) { grid-column: 3; grid-row: 1 / span 2; }
#review-requests-table tbody td.empty-row { grid-column: 1 / -1; }

/* ---------- 表の中の入力欄・削除ボタン（実機と同じ黒い太枠・真っ赤な四角をやめる） ---------- */
.main table :where(input[type="text"], input[type="number"], input:not([type]), select) {
  border: 1px solid #cfd8e3 !important; border-radius: 8px !important; min-height: 32px; padding: 3px 8px; background: #fff; box-shadow: none;
}
.main table :where(input, select):focus { outline: none; border-color: var(--s2-blue) !important; box-shadow: 0 0 0 3px rgba(47,111,235,.15) !important; }
.main table .btn--danger { background: #fff; color: #c53030; border: 1px solid #f1c4c4; font-weight: 600; min-height: 30px; padding: 3px 12px; }
.main table .btn--danger:hover:not(:disabled) { background: #fff1f1; border-color: #e69a9a; }
.main .order-table { border: 1px solid var(--s2-line); }
.main .order-table tbody tr:hover td { background: #f8fafd; }
/* 配送経費設定: 上から順に判定するので、行の頭に順番の札を付ける */
#cost-rules-table tbody { counter-reset: hxrule; }
#cost-rules-table tbody tr { counter-increment: hxrule; }
#cost-rules-table tbody td:first-child { position: relative; padding-left: 44px !important; }
#cost-rules-table tbody td:first-child::before { content: counter(hxrule); position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
  width: 22px; height: 22px; border-radius: 7px; display: grid; place-items: center; font-size: 12px; font-weight: 700; color: var(--s2-blue-d); background: var(--s2-blue-soft); }
@media (max-width: 720px) {
  .hx-hero .hx-methods { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hx-flow > .hx-step > .row { grid-template-columns: 1fr !important; display: grid; gap: 12px; }
}
.hx-sform__grid fieldset, .hx-sform { min-width: 0; } .hx-sform__grid .table-wrap, .hx-sform__grid table { max-width: 100%; } .hx-sform__grid .table-wrap { overflow-x: auto; }
@media (max-width: 720px) { .hx-sform__grid fieldset table { display: block; overflow-x: auto; } .hx-sform__grid .settings-field { min-width: 0; max-width: 100%; } .hx-sform__grid .settings-field :where(input, select, textarea) { max-width: 100%; box-sizing: border-box; } }

/* ---------- TOP: 入口の計器盤＋設定の一覧（行）＋困ったとき ---------- */
.hx-launch { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
@media (min-width: 900px) { .hx-launch { grid-template-columns: repeat(4, minmax(0, 1fr)) 1.4fr; } }
.hx-launch__btn { display: flex; flex-direction: column; gap: 2px; padding: 12px 14px; border-radius: 10px; text-decoration: none;
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.13); color: #fff; transition: background .15s, transform .15s; }
.hx-launch__btn:hover { background: rgba(255,255,255,.14); transform: translateY(-1px); }
.hx-launch__btn b { font-size: 16px; letter-spacing: .04em; }
.hx-launch__btn small { font-size: 11.5px; color: #9fb3c8; }
.hx-hero .hx-disk { grid-column: 1 / -1; margin: 0; padding: 10px 14px; border-radius: 10px; background: rgba(255,255,255,.05) !important; border: 1px dashed rgba(255,255,255,.2); box-shadow: none; color: #cfe0f1; }
@media (min-width: 900px) { .hx-hero .hx-disk { grid-column: auto; } }
.hx-hero .hx-disk .disk-title { font-size: 11.5px; color: #9fb3c8; font-weight: 600; }
.hx-hero .hx-disk .disk-main { font-size: 13.5px; color: #fff; font-weight: 700; margin: 2px 0; }
.hx-hero .hx-disk .disk-sub { font-size: 10.5px; color: #8aa0b8; }
.hx-hero .hx-disk.warn { border-color: rgba(251,191,36,.6); }
.hx-hero .hx-disk.danger { border-color: rgba(248,113,113,.7); background: rgba(248,113,113,.1); }
.hx-topcols { display: grid; grid-template-columns: 1fr; gap: 16px; align-items: start; }
@media (min-width: 1100px) { .hx-topcols { grid-template-columns: minmax(0, 1fr) 360px; } }
.hx-golists { display: grid; gap: 14px; }
.hx-golist { background: #fff; border: 1px solid var(--s2-line); border-radius: 14px; overflow: hidden; box-shadow: 0 1px 2px rgba(16,24,40,.04); }
.hx-golist__h { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; margin: 0; padding: 12px 16px; font-size: 15px; background: #f8fafd; border-bottom: 1px solid var(--s2-line); }
.hx-golist__h small { font-size: 12px; font-weight: 400; color: var(--s2-sub); }
.hx-golist__no { width: 24px; height: 24px; border-radius: 8px; display: grid; place-items: center; font-size: 13px; color: #fff; background: var(--s2-blue); }
.hx-go { display: flex; align-items: center; gap: 14px; padding: 12px 16px; text-decoration: none; color: inherit; border-top: 1px solid #eef1f5; }
.hx-golist__h + .hx-go { border-top: 0; }
.hx-go:hover { background: #f5f8ff; }
.hx-go .tile-icon { flex: none; width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; background: var(--s2-blue-soft); color: var(--s2-blue-d); margin: 0; }
.hx-go .tile-icon svg { width: 21px; height: 21px; }
.hx-go__t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.hx-go__t b { font-size: 14.5px; color: var(--s2-ink); }
.hx-go__t small { font-size: 12px; color: var(--s2-sub); line-height: 1.5; }
.hx-go__arrow { flex: none; width: 8px; height: 8px; border-right: 2px solid #9aa6b8; border-bottom: 2px solid #9aa6b8; transform: rotate(-45deg); margin-right: 4px; }
.hx-go:hover .hx-go__arrow { border-color: var(--s2-blue); }
.hx-maint > .card { margin: 0; }
.hx-maint .maint-grid { display: grid; grid-template-columns: 1fr !important; gap: 12px; }
.hx-maint .maint-box { border-radius: 12px; }
@media (min-width: 1100px) { .hx-maint { position: sticky; top: 12px; } }

/* ---------- カードの見出し（全画面共通）: 左に小さな色の印 ---------- */
.main .card > h2, .main .card > .card__header-row > h2, .main .card > .hx-head > h2 { display: flex; align-items: center; gap: 8px; font-size: 16px; }
.main .card > h2::before, .main .card > .card__header-row > h2::before, .main .card > .hx-head > h2::before {
  content: ""; flex: none; width: 4px; height: 17px; border-radius: 2px; background: linear-gradient(180deg, var(--s2-blue), #6aa0ff); }
.hx-flow > .hx-step > h2::before { width: 40px; height: 40px; }
@media (max-width: 720px) { .hx-flow > .hx-step > h2::before { width: 30px; height: 30px; } }
/* 検索・絞り込みの入力欄を横に並べる */
.hx-formgrid--search { margin: 12px 0 10px; padding: 12px; border-radius: 12px; background: var(--s2-soft); border: 1px solid var(--s2-line); }
/* カードを PC で 2 列に */
@media (min-width: 1100px) {
  .hx-cardgrid:not([hidden]) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
  .hx-cardgrid > .card { margin: 0; }
}
.main .hx-flow > .hx-step > h2::before {
  content: counter(hxstep); position: absolute; left: -50px; top: 14px; width: 40px; height: 40px; border-radius: 12px;
  display: grid; place-items: center; font-size: 17px; font-weight: 800; color: #fff;
  background: linear-gradient(135deg, var(--s2-blue), #5b8def); box-shadow: 0 4px 10px rgba(47,111,235,.3), 0 0 0 4px #f4f6fa;
}
@media (max-width: 720px) { .main .hx-flow > .hx-step > h2::before { left: -38px; width: 30px; height: 30px; font-size: 14px; border-radius: 9px; top: 16px; } }

/* ---------- 仕入判定設定: プロファイルを札で切り替え、中はまとまりごとのカード ---------- */
#purchase-judge-profiles .jp-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-bottom: 14px; }
#purchase-judge-profiles .jp-tabs { display: flex; flex-wrap: wrap; gap: 6px; }
#purchase-judge-profiles .jp-tab { display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px 7px 7px; border-radius: 10px; border: 1px solid var(--s2-line); background: #fff; cursor: pointer; font-size: 13.5px; color: var(--s2-ink); }
#purchase-judge-profiles .jp-tab:hover { border-color: #bcd0f5; }
#purchase-judge-profiles .jp-tab.is-on { background: var(--s2-blue-soft); border-color: var(--s2-blue); color: var(--s2-blue-d); font-weight: 700; }
#purchase-judge-profiles .jp-tab__no { width: 24px; height: 24px; border-radius: 7px; display: grid; place-items: center; font-size: 12px; font-weight: 800; color: #fff; background: #94a3b8; }
#purchase-judge-profiles .jp-tab.is-on .jp-tab__no { background: var(--s2-blue); }
#purchase-judge-profiles .jp-tab__use { font-style: normal; font-size: 11px; padding: 1px 6px; border-radius: 6px; color: #065f46; background: #d1fae5; }
#purchase-judge-profiles .jp-active { margin-left: auto; display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--s2-sub); padding: 6px 10px; border-radius: 10px; background: var(--s2-soft); border: 1px solid var(--s2-line); }
#purchase-judge-profiles .jp-block { border: 0 !important; padding: 0 !important; background: none !important; box-shadow: none !important; margin: 0 !important; }
#purchase-judge-profiles .jp-head { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; justify-content: space-between; padding: 10px 14px; border-radius: 12px; background: linear-gradient(135deg, #0b1a2c, #163a5c); color: #cfe0f1; margin-bottom: 12px; border: 0; }
#purchase-judge-profiles .jp-name { display: flex; align-items: center; gap: 8px; font-size: 12.5px; }
#purchase-judge-profiles .jp-name input { width: 220px !important; max-width: 60vw; min-height: 34px; border-radius: 8px; border: 1px solid rgba(255,255,255,.25); background: rgba(255,255,255,.1); color: #fff; padding: 2px 10px; font-weight: 700; }
#purchase-judge-profiles .jp-head .btn { background: transparent; color: #cfe0f1; border: 1px solid rgba(255,255,255,.3); }
#purchase-judge-profiles .jp-grid { display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 1100px) { #purchase-judge-profiles .jp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } #purchase-judge-profiles .jp-sec--wide { grid-column: 1 / -1; } }
#purchase-judge-profiles .jp-sec { border: 1px solid var(--s2-line); border-radius: 14px; background: #fff; padding: 0 14px 12px; min-width: 0; overflow-x: auto; }
#purchase-judge-profiles .jp-sec > h3 { margin: 0 -14px 10px; padding: 10px 14px; font-size: 14px; background: linear-gradient(90deg, #eef3fc, #f8fafd); border-bottom: 1px solid var(--s2-line); display: flex; align-items: center; gap: 8px; }
#purchase-judge-profiles .jp-sec > h3::before { content: ""; width: 8px; height: 8px; border-radius: 3px; background: var(--s2-blue); }
#purchase-judge-profiles .jp-sec table { width: 100%; border-collapse: collapse; }
#purchase-judge-profiles .jp-sec table td, #purchase-judge-profiles .jp-sec table th { border: 0; border-bottom: 1px solid #eef1f5; padding: 6px 6px; font-size: 13px; vertical-align: middle; }
#purchase-judge-profiles .jp-sec table tr:last-child td { border-bottom: 0; }
#purchase-judge-profiles .jp-sec input[type="number"], #purchase-judge-profiles .jp-sec input[type="text"], #purchase-judge-profiles .jp-sec select { border: 1px solid #cfd8e3; border-radius: 8px; min-height: 30px; padding: 2px 6px; background: #fff; }
#purchase-judge-profiles .jp-kv { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 6px 0; font-size: 13px; border-bottom: 1px solid #eef1f5; }
#purchase-judge-profiles .checkbox-group { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 6px 12px; font-size: 13px; }
#purchase-panel-judge-settings { max-width: none !important; margin: 0 !important; }
#purchase-panel-judge-settings .card { background: #fff !important; border: 1px solid var(--s2-line) !important; border-radius: 14px !important; padding: 16px !important; }
#purchase-panel-judge-settings #purchase-judge-save-button { position: static !important; left: auto !important; right: auto !important; bottom: auto !important; min-width: 180px; min-height: 42px; font-weight: 700; box-shadow: none; }
#purchase-panel-judge-settings .card > .spapi-actions { position: sticky; bottom: 0; z-index: 5; display: flex; justify-content: flex-end; padding: 10px 12px; margin: 14px -4px 0 !important;
  background: rgba(255,255,255,.94); backdrop-filter: blur(6px); border: 1px solid var(--s2-line); border-radius: 12px; box-shadow: 0 -4px 16px rgba(16,24,40,.06); }
.hx-toolbar--labels { margin-bottom: 12px !important; }
.hx-toolbar--labels > label { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--s2-sub); }
.appraisal-export { border-radius: 12px !important; border: 1px dashed var(--s2-line) !important; background: #fff !important; }
.hx-sform__grid .settings-field > :not(label):not(input):not(select) { grid-column: 1 / -1; }

/* ---------- 電脳: 左「カテゴリを選ぶ」・右「条件を決めて送る」＋キューはカード ---------- */
.dn2-hero { padding-bottom: 14px; }
.dn2-hero .hx-hero__sub { margin-left: 0; }
.dn2-hero .dn2-today { margin: 0 0 0 auto !important; padding: 5px 12px; border-radius: 8px; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.18); color: #fff !important; font-size: 13px !important; font-weight: 700; }
.dn2 { display: grid; grid-template-columns: 1fr; gap: 16px; margin-bottom: 16px; }
@media (min-width: 1000px) { .dn2 { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); align-items: start; } }
.dn2-pane { background: #fff; border: 1px solid var(--s2-line); border-radius: 14px; padding: 0 16px 16px; box-shadow: 0 1px 2px rgba(16,24,40,.04); min-width: 0; }
.dn2-h { display: flex; align-items: center; gap: 10px; margin: 0 -16px 14px; padding: 12px 16px; font-size: 15.5px; border-bottom: 1px solid var(--s2-line); background: linear-gradient(90deg, #eef3fc, #fafbfd); border-radius: 14px 14px 0 0; }
.dn2-h > span { width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; color: #fff; font-size: 13px; background: linear-gradient(135deg, var(--s2-blue), #5b8def); }
.dn2-shop { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; font-size: 12.5px; color: var(--s2-sub); }
.dn2-shop select { min-height: 36px; border: 1px solid var(--s2-line); border-radius: 8px; padding: 2px 8px; background: #fff; }
.dn2-pane--cat .dn-catbox { max-height: 520px; border-color: var(--s2-line); border-radius: 12px; background: #fbfcfe; margin-bottom: 8px; }
@media (min-width: 1000px) { .dn2-pane--cond { position: sticky; top: 12px; } }
.dn2-selected { margin: 0 0 14px !important; border: 1px solid #d6e2f7 !important; background: #f7faff !important; border-radius: 12px !important; max-height: 160px; overflow: auto; }
.dn2-cap { font-size: 12px; font-weight: 700; color: var(--s2-blue-d); margin-bottom: 4px; }
.dn2-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.dn2-f { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.dn2-f > span { font-size: 12px; font-weight: 600; color: var(--s2-sub); }
.dn2-f--wide { grid-column: 1 / -1; }
.dn2-f :where(input[type="number"], select) { width: 100%; min-height: 38px; font-size: 15px; padding: 4px 10px; border: 1px solid #cfd8e3; border-radius: 8px; background: #fff; box-sizing: border-box; }
.dn2-range { display: flex; align-items: center; gap: 6px; }
.dn2-range i { font-style: normal; color: var(--s2-sub); }
.dn2-auto-opts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 10px; border-radius: 10px; border: 1px dashed var(--s2-line); }
.dn-chain { display: inline-block; margin-top: 2px; font-size: 11px; padding: 1px 6px; border-radius: 6px; background: var(--s2-soft); border: 1px solid var(--s2-line); color: var(--s2-sub); white-space: nowrap; }
.dn-btn-stop { color: #c00; border-color: #e8b4b4; background: #fff; }
.dn2-check { flex-direction: row; align-items: center; gap: 8px; font-size: 13.5px; padding: 8px 10px; border-radius: 10px; background: var(--s2-soft); border: 1px solid var(--s2-line); }
.dn2-note { margin-top: 10px; font-size: 11.5px; line-height: 1.6; }
.dn2-send { margin-top: 14px; display: flex; flex-direction: column; gap: 6px; }
.dn2-send .btn { width: 100%; min-height: 48px; font-size: 16px; font-weight: 800; border-radius: 10px; }
.dn2-lists { margin-bottom: 16px; }

/* 抽出キュー: 1 件ずつのカード */
#purchase-panel-dennou .dn-queue-table { border: 0 !important; background: none; }
#purchase-panel-dennou .dn-queue-table thead { display: none; }
#purchase-panel-dennou .dn-queue-table tbody { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 10px; }
#purchase-panel-dennou .dn-queue-table tbody tr { display: grid; grid-template-columns: auto 1fr auto; grid-template-areas:
  "id st op" "cat cat cat" "bar bar bar" "meta meta meta"; gap: 6px 10px; padding: 12px 14px; border: 1px solid var(--s2-line); border-radius: 14px; background: #fff; }
#purchase-panel-dennou .dn-queue-table tbody tr.scan-unviewed { border-color: #f5c46b; box-shadow: 0 0 0 3px rgba(245,196,107,.18); }
#purchase-panel-dennou .dn-queue-table tbody td { border: 0 !important; padding: 0 !important; background: none !important; display: block; }
#purchase-panel-dennou .dn-queue-table tbody td[colspan] { grid-column: 1 / -1; }
#purchase-panel-dennou .dn-queue-table td:nth-child(1) { grid-area: id; font-weight: 800; color: var(--s2-sub); }
#purchase-panel-dennou .dn-queue-table td:nth-child(1)::before { content: "#"; }
#purchase-panel-dennou .dn-queue-table td:nth-child(2) { grid-area: st; justify-self: start; padding: 2px 10px !important; border-radius: 7px; font-size: 12px; font-weight: 700; background: var(--s2-soft) !important; }
#purchase-panel-dennou .dn-queue-table td.dn-st--searched { background: #e7f8ef !important; color: #046c4e; }
#purchase-panel-dennou .dn-queue-table td.dn-st--error { background: #fff1f1 !important; color: #c53030; }
#purchase-panel-dennou .dn-queue-table td:nth-child(12) { grid-area: op; }
#purchase-panel-dennou .dn-queue-table td:nth-child(9) { grid-area: cat; font-weight: 700; color: var(--s2-ink); display: flex; flex-wrap: wrap; gap: 4px 8px; }
#purchase-panel-dennou .dn-queue-table td:nth-child(8) { grid-area: bar; display: flex; align-items: center; gap: 8px; font-size: 12px; }
#purchase-panel-dennou .dn-queue-table td:nth-child(8) .purchase-progress-bar { flex: 1; height: 8px; border-radius: 99px; }
#purchase-panel-dennou .dn-queue-table td:nth-child(3) { display: none; }
#purchase-panel-dennou .dn-queue-table td:nth-child(4), #purchase-panel-dennou .dn-queue-table td:nth-child(5), #purchase-panel-dennou .dn-queue-table td:nth-child(6),
#purchase-panel-dennou .dn-queue-table td:nth-child(7), #purchase-panel-dennou .dn-queue-table td:nth-child(10), #purchase-panel-dennou .dn-queue-table td:nth-child(11) {
  grid-column: span 1; font-size: 11.5px; color: var(--s2-sub); }
#purchase-panel-dennou .dn-queue-table tbody tr > td:nth-child(n+4):nth-child(-n+7)::before,
#purchase-panel-dennou .dn-queue-table tbody tr > td:nth-child(10)::before, #purchase-panel-dennou .dn-queue-table tbody tr > td:nth-child(11)::before { content: attr(data-label) "："; color: #8a94a6; }
#purchase-panel-dennou .dn-queue-table tbody tr > td:nth-child(n+4):nth-child(-n+7), #purchase-panel-dennou .dn-queue-table tbody tr > td:nth-child(10), #purchase-panel-dennou .dn-queue-table tbody tr > td:nth-child(11) { grid-column: 1 / -1; }
#purchase-panel-dennou .dn-queue-table td > div { display: inline; }
#purchase-panel-dennou .dn-queue-table .dn-dl { margin-left: 6px; padding: 1px 8px; min-height: 0; font-size: 11px; }
#purchase-panel-dennou .dn-queue-table tbody tr > td:is(:nth-child(2), :nth-child(8), :nth-child(9), :nth-child(12))::before { content: none !important; display: none !important; } #purchase-panel-dennou .dn-queue-table tbody tr > td { width: auto !important; }
.main input[type="file"]::file-selector-button { border: 1px solid #cfd8e3; border-radius: 8px; background: #fff; padding: 6px 12px; margin-right: 10px; cursor: pointer; color: var(--s2-ink); } .main input[type="file"]::file-selector-button:hover { background: var(--s2-blue-soft); border-color: #bcd0f5; }

/* ---------- 価格改定 › 値付け設定: 枠線の囲み（実機と同じ）→ 見出し帯のカード、期間別の表は列の色分け＋左の列を固定 ---------- */
#price-panel-settings .rp-cfg .wrap { max-width: none; }
#price-panel-settings .rp-cfg h1 { padding: 14px 16px; border-radius: 14px; color: #fff; font-size: 17px; margin: 0 0 16px;
  background: radial-gradient(circle at 1px 1px, rgba(255,255,255,.07) 1px, transparent 0) 0 0 / 14px 14px, linear-gradient(135deg, #0b1a2c, #163a5c); }
#price-panel-settings .rp-cfg h1 .btn-ghost { border-radius: 8px; border: 1px solid rgba(255,255,255,.3); background: rgba(255,255,255,.08); color: #e6eef7; padding: 6px 12px; }
#price-panel-settings .rp-cfg fieldset { border: 1px solid var(--s2-line) !important; background: #fff !important; border-radius: 14px !important; padding: 0 16px 16px !important; margin: 0 0 16px; box-shadow: 0 1px 2px rgba(16,24,40,.04); min-width: 0; }
#price-panel-settings .rp-cfg fieldset > legend { float: left; width: calc(100% + 32px); margin: 0 -16px 14px; padding: 11px 16px; box-sizing: border-box; font-size: 15px; font-weight: 700;
  background: linear-gradient(90deg, #eef3fc, #f8fafd); border-bottom: 1px solid var(--s2-line); border-radius: 14px 14px 0 0; display: flex; align-items: center; gap: 8px; }
#price-panel-settings .rp-cfg fieldset > legend::before { content: ""; width: 8px; height: 8px; border-radius: 3px; background: var(--s2-blue); }
#price-panel-settings .rp-cfg fieldset > legend + * { clear: both; }
@media (min-width: 1100px) {
  #price-panel-settings .rp-cfg fieldset:first-of-type { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 18px; align-items: start; }
  #price-panel-settings .rp-cfg fieldset:first-of-type > legend { grid-column: 1 / -1; }
  #price-panel-settings .rp-cfg fieldset:first-of-type > h2 { grid-column: 1 / -1; }
}
#price-panel-settings .rp-cfg h2 { display: flex; align-items: center; gap: 8px; font-size: 14.5px; margin: 14px 0 8px; }
#price-panel-settings .rp-cfg h2::before { content: ""; width: 4px; height: 15px; border-radius: 2px; background: var(--s2-blue); }
#price-panel-settings .rp-cfg .boxed-thin, #price-panel-settings .rp-cfg .boxed { border: 1px solid #d6e2f7; background: #f7faff; border-radius: 12px; }
#price-panel-settings .rp-cfg .pattern-card { border-radius: 12px; border-color: var(--s2-line); }
#price-panel-settings .rp-cfg :where(input[type="number"], input[type="text"], select, textarea) { border: 1px solid #cfd8e3 !important; border-radius: 8px !important; background: #fff; }
#price-panel-settings .rp-cfg .btn-plain { border-radius: 8px; }
/* 期間別の表 */
#price-panel-settings .rp-cfg .period-table-wrap { border: 1px solid var(--s2-line); border-radius: 12px; }
#price-panel-settings .rp-cfg .period-table th, #price-panel-settings .rp-cfg .period-table td { border: 0 !important; border-bottom: 1px solid #eef1f5 !important; padding: 7px 8px; }
#price-panel-settings .rp-cfg .period-table th:first-child { position: sticky; left: 0; z-index: 2; background: #f6f8fb !important; color: var(--s2-ink); text-align: left; border-right: 1px solid var(--s2-line) !important; }
#price-panel-settings .rp-cfg .period-table td:nth-child(odd) { background: #fafcff; }
#price-panel-settings .rp-cfg .period-table tr:first-child td { background: #0f2741 !important; color: #cfe0f1; font-weight: 700; position: sticky; top: 0; z-index: 1; }
#price-panel-settings .rp-cfg .period-table tr:first-child td input { background: rgba(255,255,255,.12) !important; color: #fff; border-color: rgba(255,255,255,.3) !important; font-weight: 700; }
#price-panel-settings .rp-cfg .period-table tr:first-child th:first-child { background: #0f2741 !important; color: #fff; }
#price-panel-settings .rp-cfg .period-table tr:hover td { background: #f1f6ff; }
/* 保存ボタン: 右下の丸い浮きボタン → 下に固定の帯 */
#price-panel-settings .rp-cfg .actions { position: sticky !important; bottom: 0; left: auto !important; right: auto !important; top: auto !important; z-index: 6; display: flex; justify-content: flex-end; padding: 10px 12px; margin-top: 12px;
  background: rgba(255,255,255,.94); backdrop-filter: blur(6px); border: 1px solid var(--s2-line); border-radius: 12px; box-shadow: 0 -4px 16px rgba(16,24,40,.06); width: auto !important; }
#price-panel-settings .rp-cfg .actions .btn-save { border-radius: 10px; min-width: 180px; min-height: 42px; background: var(--s2-blue); border: 0; box-shadow: none; }

/* ---------- 価格改定 › 値付けプレビュー ---------- */
#price-panel-preview .rp-pv > h2 { padding: 14px 16px; border-radius: 14px; color: #fff; font-size: 17px; margin: 0 0 16px;
  background: radial-gradient(circle at 1px 1px, rgba(255,255,255,.07) 1px, transparent 0) 0 0 / 14px 14px, linear-gradient(135deg, #0b1a2c, #163a5c); }
#price-panel-preview .rp-pv fieldset { border: 1px solid var(--s2-line) !important; background: #fff !important; border-radius: 14px !important; padding: 0 16px 16px !important; min-width: 0; }
#price-panel-preview .rp-pv fieldset > legend { float: left; width: calc(100% + 32px); margin: 0 -16px 14px; padding: 11px 16px; box-sizing: border-box; font-size: 15px; font-weight: 700;
  background: linear-gradient(90deg, #eef3fc, #f8fafd); border-bottom: 1px solid var(--s2-line); border-radius: 14px 14px 0 0; }
#price-panel-preview .rp-pv fieldset > legend + * { clear: both; }
#price-panel-preview .rp-pv :where(input[type="text"], input[type="number"], select) { border: 1px solid #cfd8e3 !important; border-radius: 8px !important; min-height: 36px; background: #fff; }
#price-panel-preview .rp-pv label { font-size: 12px; color: var(--s2-sub); font-weight: 600; }
#price-panel-preview .rp-pv table { border-collapse: separate; border-spacing: 0; border: 1px solid var(--s2-line); border-radius: 12px; overflow: hidden; }
#price-panel-preview .rp-pv table th { background: #f1f4f9; color: var(--s2-sub); border: 0 !important; }
#price-panel-preview .rp-pv table td { border: 0 !important; border-top: 1px solid #eef1f5 !important; }
#price-panel-preview .rp-pv button { border-radius: 8px; }

/* ---------- 価格改定 › 在庫データ・上限管理: 見出しは紺の帯、検索欄は薄い面にまとめる ---------- */
#price-panel-inventory .rp-inv > h2, #price-panel-inventory .rp-inv > h1, #price-panel-limits .rp-lim h1, #price-panel-limits .rp-lim .wrap > h2 {
  padding: 14px 16px; border-radius: 14px; color: #fff !important; font-size: 17px; margin: 0 0 16px;
  background: radial-gradient(circle at 1px 1px, rgba(255,255,255,.07) 1px, transparent 0) 0 0 / 14px 14px, linear-gradient(135deg, #0b1a2c, #163a5c); }
#price-panel-inventory .rp-inv .card, #price-panel-limits .rp-lim .card { border-radius: 14px; border: 1px solid var(--s2-line); background: #fff; }
#price-panel-inventory .rp-inv .filters { padding: 12px; border-radius: 12px; background: var(--s2-soft); border: 1px solid var(--s2-line); }
#price-panel-inventory .rp-inv :where(input, select), #price-panel-limits .rp-lim :where(input, select) { border: 1px solid #cfd8e3 !important; border-radius: 8px !important; background: #fff; }
#price-panel-inventory .rp-inv .btn, #price-panel-limits .rp-lim button { border-radius: 8px !important; }
#price-panel-limits .rp-lim .primary, #price-panel-limits .rp-lim .toolbar button { background: var(--s2-blue) !important; color: #fff; border: 0; }
#price-panel-limits .rp-lim .section { padding: 12px; border-radius: 12px; background: #f7faff; border: 1px solid #d6e2f7 !important; margin-top: 12px; }
#price-panel-inventory .rp-inv table thead th, #price-panel-limits .rp-lim table thead th { background: #f1f4f9 !important; color: var(--s2-sub); }

/* ---------- 出品: 実機と同じ見出し（wt_txt）→ 紺の帯。カード・入力欄を角丸でそろえる ---------- */
#module-listing .wt_txt { display: flex; align-items: center; gap: 10px; padding: 13px 16px; border-radius: 14px; color: #fff !important; font-size: 16.5px !important; margin: 18px 0 12px !important; border: 0 !important;
  background: radial-gradient(circle at 1px 1px, rgba(255,255,255,.07) 1px, transparent 0) 0 0 / 14px 14px, linear-gradient(135deg, #0b1a2c, #163a5c) !important; }
#module-listing .wt_txt::before, #module-listing .wt_txt::after { content: none !important; display: none !important; }
#module-listing .tab-panel > .wrap > .wt_txt:first-child, #module-listing .wrap > .wt_txt:first-of-type { margin-top: 0 !important; }
#module-listing .card { border-radius: 14px !important; border-color: var(--s2-line) !important; box-shadow: 0 1px 2px rgba(16,24,40,.04) !important; }
#module-listing :where(input[type="text"], input[type="number"], input[type="date"], input:not([type]), select, textarea) { border-radius: 8px !important; border-color: #cfd8e3 !important; }
#module-listing #sessionCard .sessionStack > *, #module-listing #sessionCard .twoCol { border-radius: 12px; }
#module-listing #sessionCard .sessionHr { display: none; }
#module-listing #sessionCard .field { padding: 10px 12px; border-radius: 12px; background: var(--s2-soft); border: 1px solid var(--s2-line); margin-bottom: 10px; }
#module-listing #sessionCard .twoCol { gap: 10px; }
#module-listing #sessionCard .twoCol > .field { margin-bottom: 0; }
#module-listing #resetBox button { border-radius: 8px !important; }
#module-listing .lcf-page .wrap > form > .card, #module-listing .lcf-page .card { margin-bottom: 14px; }
#module-listing .lcf-page .card h2, #module-listing .lcf-page .card h3 { display: flex; align-items: center; gap: 8px; }
#module-listing .wt_txt { flex: 1 1 auto; }
/* 丸い（錠剤形の）ボタンはやめる（ユーザー指示「〇ボタンは嫌」）: 画面内のボタンは角丸 8px にそろえる */
.main button:not(.jp-tab):not(.hx-launch__btn), .main .btn, .main a.btn { border-radius: 8px !important; }

/* ---------- 利益分析: 合計のタイル、表は色の格子をやめて細い線＋見出しの下に色の線 ---------- */
.fin-page .hx-hero--fin { margin: 4px 0 14px; padding: 12px; }
.fin-page .title-row h1, .fin-page .wrap > h1, .fin-page .wrap > h2:first-child { display: flex; align-items: center; gap: 8px; }
.fin-page .title-row h1::before, .fin-page .wrap > h1::before { content: ""; width: 4px; height: 18px; border-radius: 2px; background: var(--s2-blue); }
.fin-page .print-btn { border-radius: 8px !important; }
.fin-page .fin-form, .fin-page form.fin-form { border-radius: 14px !important; }
.fin-page .legend .tag { border-radius: 8px !important; border-color: var(--s2-line) !important; }
.fin-page .legend .swatch { border-radius: 4px; }
.fin-page .table-scroll { border-radius: 14px !important; border-color: var(--s2-line) !important; }
.fin-page .table-scroll table { border-collapse: separate !important; border-spacing: 0; }
.fin-page .table-scroll th, .fin-page .table-scroll td { border: 0 !important; border-bottom: 1px solid #eef1f5 !important; }
.fin-page .table-scroll thead th { background: #fff !important; color: var(--s2-sub); font-weight: 700; border-bottom: 3px solid #cbd5e1 !important; }
.fin-page .table-scroll thead th.g-date { border-bottom-color: #94a3b8 !important; }
.fin-page .table-scroll thead th.g-tran { border-bottom-color: #60a5fa !important; }
.fin-page .table-scroll thead th.g-cost { border-bottom-color: #f59e0b !important; }
.fin-page .table-scroll thead th.g-list { border-bottom-color: #a78bfa !important; }
.fin-page .table-scroll thead th.g-ship { border-bottom-color: #f87171 !important; }
.fin-page .table-scroll thead th.g-settle { border-bottom-color: #f472b6 !important; }
.fin-page .table-scroll thead th.g-calc { border-bottom-color: #34d399 !important; }
.fin-page .table-scroll tbody tr:nth-child(even) td { background: #fafbfd; }
.fin-page .table-scroll tbody tr:hover td { background: #f1f6ff; }
.fin-page .table-scroll tfoot td { background: #0f2741 !important; color: #fff !important; font-weight: 700; border: 0 !important; }
.fin-page .table-scroll tfoot td.neg, .fin-page .table-scroll tfoot td.always-red { color: #fca5a5 !important; }
.fin-page .table-scroll tfoot td.posblue { color: #93c5fd !important; }

/* ---------- 発送方法編集（別ページ method_edit.html） ---------- */
.me-page > h1 { display: flex; align-items: center; gap: 10px; font-size: 22px; margin: 18px 0 14px; }
.me-page > h1::before { content: ""; width: 6px; height: 24px; border-radius: 3px; background: linear-gradient(180deg, #2f6feb, #6aa0ff); }
.me-page .me-hero { color: #cfe0f1; border: 0 !important; border-radius: 14px !important;
  background: radial-gradient(circle at 1px 1px, rgba(255,255,255,.07) 1px, transparent 0) 0 0 / 14px 14px, linear-gradient(135deg, #0b1a2c, #163a5c) !important; }
.me-page .me-hero .method-edit-overall { color: #fff; font-size: 14px; font-weight: 700; margin: 10px 0 4px; }
.me-page .me-hero .module__desc { color: #9fb3c8; }
.me-page .me-hero .btn:not(.btn--primary):not(.btn--danger) { background: rgba(255,255,255,.1); color: #fff; border-color: rgba(255,255,255,.25); }
.me-page .card { border-radius: 14px; }
.me-page .btn, .stickyBar .btn, .me-page button { border-radius: 8px !important; }
.me-page table .btn--danger { background: #fff; color: #c53030; border: 1px solid #f1c4c4; }
.me-page table { border-radius: 12px; overflow: hidden; }
.me-page table thead th { background: #f1f4f9; color: #5b6475; }

/* ---------- マニュアル: 旧ツールのマニュアルサイトと同じ「全面の濃紺・左の白線メニュー」をやめ、
   システムの他の画面と同じ明るい背景＋見出しの紺の帯＋白いカードの目次にする ---------- */
#module-manual { margin: 0 !important; padding: 0 !important; }
#module-manual .mn-root { background: none !important; color: var(--s2-ink); min-height: 0; padding-bottom: 30px; }
#module-manual .mn-header { height: auto; justify-content: flex-start; gap: 14px; padding: 16px 18px; margin: 0 0 16px; border: 0; border-radius: 14px;
  background: radial-gradient(circle at 1px 1px, rgba(255,255,255,.07) 1px, transparent 0) 0 0 / 14px 14px, linear-gradient(135deg, #0b1a2c, #163a5c) !important; }
#module-manual .mn-header h2 { font-size: 20px; color: #fff; }
#module-manual .mn-logo { width: 42px; height: 42px; font-size: 20px; border-radius: 10px; background: var(--s2-blue); border: 0; }
#module-manual .mn-logo::before { content: none; }
#module-manual .mn-layout { max-width: none; padding: 0; gap: 16px; }
#module-manual .mn-nav-wrap { flex-basis: 260px; top: 12px; max-height: calc(100vh - 24px); }
#module-manual .mn-nav { padding: 10px; border: 1px solid var(--s2-line) !important; border-radius: 14px; background: #fff; box-shadow: 0 1px 2px rgba(16,24,40,.04); }
#module-manual .mn-nav__top { color: var(--s2-ink); border: 0; background: var(--s2-soft); border-radius: 10px; margin-bottom: 8px; }
#module-manual .mn-nav__top.is-current, #module-manual .mn-nav__top:hover { background: var(--s2-blue-soft); color: var(--s2-blue-d); }
#module-manual .mn-nav__group { margin-bottom: 6px; }
#module-manual .mn-nav__head { color: var(--s2-ink); border: 0; background: none; border-radius: 10px; font-size: 14px; padding: 9px 10px; }
#module-manual .mn-nav__head:hover { background: var(--s2-soft); }
#module-manual .mn-nav__list { margin: 2px 0 6px; padding: 0 0 0 6px; }
#module-manual .mn-nav__list li { border: 0; }
#module-manual .mn-nav__list a { color: var(--s2-sub); font-size: 13.5px; padding: 6px 10px; border-radius: 8px; }
#module-manual .mn-nav__list a:hover { color: var(--s2-blue-d); background: var(--s2-soft); text-decoration: none; }
#module-manual .mn-nav__list a.is-current { color: var(--s2-blue-d); background: var(--s2-blue-soft); }
#module-manual .mn-main { padding-top: 0; }
#module-manual .mn-content { border: 1px solid var(--s2-line); border-radius: 14px; box-shadow: 0 1px 2px rgba(16,24,40,.04); padding: 20px 22px 40px; }
#module-manual .mn-content h2 { background: none; border-left: 0; padding: 0 0 8px; border-bottom: 2px solid var(--s2-line); border-radius: 0; display: flex; align-items: center; gap: 10px; }
#module-manual .mn-content h2::before { content: ""; width: 6px; height: 22px; border-radius: 3px; background: linear-gradient(180deg, var(--s2-blue), #6aa0ff); }
#module-manual .mn-title { background: var(--s2-blue-soft); border-color: #d6e2f7; }
#module-manual .mn-scroll { border-radius: 10px !important; }
@media (max-width: 900px) { #module-manual .mn-navtoggle { border-radius: 8px; } }

/* ---------- 横に動くメニューの目印（js/hx_scrollhint.js） ----------
   続きがある側の端に、白いぼかし＋矢印（スクロールしても端に貼り付く）を出す */
.hx-hscroll { position: relative; }
.hx-hscroll::after, .hx-hscroll::before { position: sticky; z-index: 2; flex: 0 0 34px; align-self: stretch; display: none; place-items: center;
  font-size: 22px; font-weight: 800; color: var(--s2-blue); pointer-events: none; }
.hx-hscroll--right::after { content: "›"; display: grid; right: 0; margin-left: -34px; background: linear-gradient(90deg, rgba(255,255,255,0), #fff 55%); }
.hx-hscroll--left::before { content: "‹"; display: grid; left: 0; margin-right: -34px; order: -1; background: linear-gradient(270deg, rgba(255,255,255,0), #fff 55%); }
@media (max-width: 900px) {
  .module > nav.topbar.hx-hscroll { overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; }
  .module > nav.topbar.hx-hscroll::-webkit-scrollbar { display: none; }
}
#purchase-panel-dennou .dn2-today { display: block; margin: 0 0 10px !important; font-weight: 700; font-size: 14px; color: var(--s2-ink); }
#purchase-panel-ocr .p2j-head { justify-content: flex-end; }
/* 電脳のキューの「仕入検索済」などの札: 文字を札の真ん中に */
#purchase-panel-dennou .dn-queue-table td:nth-child(2) { display: inline-flex !important; align-items: center; justify-content: center; align-self: center; text-align: center; line-height: 1.3; min-height: 26px; white-space: nowrap; }
#purchase-panel-dennou .dn-queue-table td:nth-child(1), #purchase-panel-dennou .dn-queue-table td:nth-child(12) { align-self: center; }

/* ---------- 結果表示の外部リンク（js/purchase.js）: まとまりごとの角丸の札 ---------- */
.krt-links { display: flex; flex-wrap: wrap; gap: 6px 10px; margin: 6px 0; }
.krt-outg { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 4px; padding: 3px 4px 3px 8px; border-radius: 10px; background: #f6f8fb; border: 1px solid #e3e7ee; }
.krt-outg__name { font-size: 10.5px; font-weight: 700; color: #8a94a6; margin-right: 2px; letter-spacing: .04em; }
.krt-links a.krt-out { display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px; border-radius: 7px; background: #fff; border: 1px solid #dbe3ee;
  color: #1c2333; font-size: 12px; font-weight: 600; text-decoration: none; border-bottom-width: 1px; margin: 0; line-height: 1.5; white-space: nowrap; }
.krt-links a.krt-out:hover { border-color: #93b4ef; background: #f3f7ff; }
.krt-out > i { width: 8px; height: 8px; border-radius: 3px; background: #94a3b8; flex: none; }
.krt-out--amz > i { background: #ff9900; }
.krt-out--rev > i { background: #f5c518; }
.krt-out--keepa > i { background: #2a7de1; }
.krt-out--mnsr > i { background: #13a38a; }
.krt-out--bo > i { background: #f2c200; }
.krt-out--suruga > i { background: #0d4fa2; }
.krt-out--netoff > i { background: #e85a24; }
.krt-out--merc > i { background: #ff333f; }
#purchase-panel-ocr #p2j-refresh { background: #fff !important; color: #1c2333 !important; border: 1px solid #d1d5db !important; font-weight: 400; }

/* ---------- 仕入れの結果表示（js/purchase.js purchaseResultCardHtml）: 1冊ずつのカード ---------- */
.krt-item.rc { margin: 0 0 12px; padding: 14px 16px; border: 1px solid var(--s2-line) !important; border-radius: 14px; background: #fff; font-size: 14px; color: var(--s2-ink);
  box-shadow: 0 1px 2px rgba(16,24,40,.04); border-bottom: 1px solid var(--s2-line) !important; }
.krt-item.rc.rc--buy { border-color: #9fd9b8 !important; box-shadow: 0 0 0 1px #c8ecd8 inset, 0 1px 2px rgba(16,24,40,.04); background: linear-gradient(180deg, #f3fbf6, #fff 120px); }
.rc-top { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px; margin-bottom: 10px; }
.rc-pos { font-size: 15px; font-weight: 800; color: var(--s2-ink); font-variant-numeric: tabular-nums; }
.rc-pos small { font-size: 12px; font-weight: 600; color: var(--s2-sub); }
.rc-shelf { font-size: 11.5px; padding: 2px 8px; border-radius: 6px; background: var(--s2-soft); color: var(--s2-sub); border: 1px solid var(--s2-line); }
.rc-badge { font-size: 12.5px; font-weight: 800; padding: 3px 10px; border-radius: 7px; }
.rc-badge--buy { background: #0f9d58; color: #fff; }
.rc-badge--warn { background: #fdecec; color: #c53030; border: 1px solid #f3b1b1; }
.rc-main { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 14px; align-items: start; }
.rc-cover .krt-img { width: 84px; height: auto; margin: 0; border-radius: 6px; border: 1px solid var(--s2-line); background: #fff; display: block; }
.rc-info { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
a.rc-title, .rc-title { font-size: 15.5px; font-weight: 700; line-height: 1.45; color: #1f55c9; text-decoration: none; }
a.rc-title:hover { text-decoration: underline; }
.rc-kpis { display: grid; grid-template-columns: minmax(90px, 1fr) minmax(70px, .7fr) minmax(150px, 1.6fr); gap: 6px; max-width: 560px; }
.rc-kpi { padding: 7px 10px; border-radius: 10px; background: var(--s2-soft); border: 1px solid var(--s2-line); min-width: 0; }
.rc-kpi > span { display: block; font-size: 11px; color: var(--s2-sub); white-space: nowrap; }
.rc-kpi > b { font-size: 18px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rc-kpi > small { display: block; font-size: 11px; color: var(--s2-sub); white-space: nowrap; }
.rc--buy .rc-kpi--profit { background: #e7f8ee; border-color: #a9e0c1; }
.rc--buy .rc-kpi--profit > b { color: #0b7a43; }
.rc-kpi--profit.is-minus > b { color: #c53030; }
.rc-kpi--max { background: var(--s2-blue-soft); border-color: #cfdcf7; }
.rc-kpi--max > b { color: var(--s2-blue-d); }
.rc-rank { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-size: 13px; color: var(--s2-sub); }
.rc-rank > b { color: var(--s2-ink); font-size: 13.5px; }
.rc-rank.is-warn > p { flex-basis: 100%; margin: 2px 0 0; color: #c53030; font-size: 12.5px; }
.rc-tag { display: inline-block; font-size: 11px; font-weight: 700; padding: 1px 7px; border-radius: 6px; background: #eef1f5; color: #475467; }
.rc-tag--warn { background: #fdecec; color: #c53030; }
.rc-tag--blue { background: var(--s2-blue-soft); color: var(--s2-blue-d); }
.rc-calc { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 4px; margin: 12px 0 0; padding: 8px 10px; border-radius: 10px; background: #f8fafc; border: 1px dashed #d5dce6; }
.rc-cell { display: inline-flex; flex-direction: column; padding: 2px 6px; font-size: 13.5px; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1.25; }
.rc-cell small { font-size: 10.5px; font-weight: 500; color: var(--s2-sub); }
.rc-op { font-style: normal; color: #98a2b3; font-weight: 700; }
.rc-judge { font-size: 18px; font-weight: 900; padding: 0 6px; }
.rc-judge.is-ok { color: #0b7a43; }
.rc-judge.is-ng { color: #c53030; }
.rc-cell--need { background: #fff; border: 1px solid var(--s2-line); border-radius: 8px; padding: 3px 8px; }
.rc-sub { display: grid; grid-template-columns: 1fr; gap: 10px; margin-top: 12px; }
@media (min-width: 1000px) { .rc-sub { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); } }
.rc-spec { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; margin: 0; border: 1px solid var(--s2-line); border-radius: 10px; overflow: hidden; }
.rc-spec > div { display: grid; grid-template-columns: 82px minmax(0, 1fr); border-top: 1px solid #eef1f5; font-size: 12.5px; }
.rc-spec > div:nth-child(-n+2) { border-top: 0; }
.rc-spec > div:nth-child(odd) { border-right: 1px solid #eef1f5; }
.rc-spec dt { padding: 5px 8px; background: #f8fafc; color: var(--s2-sub); }
.rc-spec dd { margin: 0; padding: 5px 8px; overflow-wrap: anywhere; }
.rc-stats__cap { font-size: 11.5px; color: var(--s2-sub); margin-bottom: 4px; }
.rc-stats__row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.rc-stat { padding: 6px 8px; border-radius: 10px; border: 1px solid var(--s2-line); background: #fff; min-width: 0; }
.rc-stat span { display: block; font-size: 11px; color: var(--s2-sub); }
.rc-stat b { font-size: 15px; font-variant-numeric: tabular-nums; }
.rc-stat small { display: block; font-size: 11px; color: var(--s2-sub); white-space: nowrap; }
.krt-item.rc .krt-bkrate-box { margin-top: 10px; }
.krt-item.rc .krt-bkrate-btn { border-radius: 8px !important; background: #1c2333; padding: 6px 14px; font-size: 12.5px; }
.rc-offers { margin-top: 12px; }
.rc-offers__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin-bottom: 6px; font-size: 12.5px; color: var(--s2-sub); }
.rc-offers__head b { font-size: 13.5px; color: var(--s2-ink); }
.rc-offers__note { color: #8a6d1f; }
.rc-offers__list { display: flex; flex-wrap: wrap; gap: 4px; }
.rc-o { display: inline-flex; align-items: center; gap: 3px; padding: 3px 8px; border-radius: 7px; border: 1px solid var(--s2-line); background: #fff; font-size: 12.5px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rc-o__k { font-style: normal; font-size: 10px; font-weight: 800; padding: 0 4px; border-radius: 4px; background: #eef1f5; color: #475467; }
.rc-o__k.is-new { background: #fdecec; color: #c53030; }
.rc-o__k.is-fba { background: #e6efff; color: #1f55c9; }
.rc-o__k.is-coll { background: #f1f1f1; color: #6b7280; }
.rc-o.is-basis { border-color: #1c2333; font-weight: 800; }
.rc-o.is-ref { background: #1c2333; border-color: #1c2333; color: #fff; font-weight: 800; }
.rc-o.is-out { color: #98a2b3; background: #f8fafc; text-decoration: line-through; }
.rc-o.is-out.is-slow { text-decoration-color: #7a38ff; }
.rc-offers__time { margin-top: 6px; font-size: 11.5px; color: var(--s2-sub); }
.krt-item.rc .krt-links { margin-top: 10px; }
.krt-item.rc .krt-muted { font-size: 12px; color: var(--s2-sub); }
/* 見つからなかったもの: 1行 */
.krt-item.rc.rc--miss { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; padding: 8px 14px; background: #fafbfc; box-shadow: none; }
.rc-miss__code { font-family: ui-monospace, Consolas, monospace; font-size: 13px; color: var(--s2-ink); }
.rc-miss__msg { font-size: 12.5px; color: #c53030; }
@media (max-width: 720px) {
  .krt-item.rc { padding: 12px; }
  .rc-main { gap: 10px; }
  .rc-cover .krt-img { width: 64px; }
  .rc-kpis { grid-template-columns: 1fr 1fr; }
  .rc-kpi--max { grid-column: 1 / -1; }
  .rc-spec { grid-template-columns: 1fr; }
  .rc-spec > div:nth-child(2) { border-top: 1px solid #eef1f5; }
  .rc-spec > div:nth-child(odd) { border-right: 0; }
  .rc-calc { gap: 2px; }
  .rc-cell { font-size: 12.5px; padding: 2px 3px; }
}
/* 結果の見出し・段の区切り・合計 */
#purchase-scan-tbody > tr > td { border: 0 !important; padding: 0 !important; background: none !important; }
#purchase-scan-tbody tr.rc-secrow > td { position: sticky; top: 0; z-index: 50; }
.rc-sec { display: flex; align-items: center; gap: 10px; margin: 4px 0 10px; padding: 6px 4px; background: rgba(244,246,250,.94); backdrop-filter: blur(4px); }
.rc-sec__lv { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 800; color: var(--s2-blue-d); padding: 3px 12px; border-radius: 8px; background: var(--s2-blue-soft); border: 1px solid #cfdcf7; }
.rc-sec--top { padding: 10px 14px; border-radius: 12px; color: #fff; background: linear-gradient(135deg, #0b1a2c, #163a5c); }
.rc-sec__memo { font-size: 15px; }
.rc-sec__count { font-size: 12.5px; color: #9fb3c8; margin-left: auto; }
#purchase-scan-tbody tr.rc-secrow--top > td { position: static; }
.rc-total { display: flex; justify-content: flex-end; align-items: baseline; gap: 16px; margin: 6px 0 4px; padding: 12px 16px; border-radius: 12px; background: #fff; border: 1px solid var(--s2-line); font-size: 13.5px; color: var(--s2-sub); }
.rc-total b { font-size: 18px; color: var(--s2-ink); }
/* 買取査定モードのカード */
.rc-kpi--profit.is-warn > b { color: #c53030; }
.rc--bb .rc-kpi--profit { background: #fff7e6; border-color: #f3d59a; }
.rc--bb .rc-kpi--profit > b { color: #9a5b00; }
.rc-bb { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.rc-bb__amt { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--s2-sub); font-weight: 700; }
.rc-bb__amt input { width: 170px; min-height: 38px; font-size: 16px; padding: 4px 10px; border: 1px solid #cfd8e3 !important; border-radius: 8px !important; background: #fff; }
.rc-bb__exc { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; padding: 6px 10px; border-radius: 8px; background: var(--s2-soft); border: 1px solid var(--s2-line); }
.krt-item.rc.is-excluded { opacity: .55; }
.rc-more { margin-top: 12px; border: 1px solid var(--s2-line) !important; border-radius: 10px !important; padding: 0 12px; background: #fff; }
.rc-more > summary { cursor: pointer; padding: 9px 0; font-size: 13px; font-weight: 700; color: var(--s2-blue-d); }
.rc-more[open] > summary { border-bottom: 1px solid var(--s2-line); margin-bottom: 4px; }
.rc-more .krt-dd-body { padding-bottom: 12px; }
.rc-bbcalc { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 10px; }
.rc-bbcalc > div { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; padding: 8px 10px; border-radius: 10px; background: var(--s2-soft); border: 1px solid var(--s2-line); font-size: 12.5px; }
.rc-bbcalc span { color: var(--s2-sub); flex-basis: 100%; }
.rc-bbcalc b { font-size: 15px; }
.rc-bbcalc em { font-style: normal; font-size: 12px; color: var(--s2-sub); }
.rc-more .rc-rank { margin-top: 10px; }
@media (max-width: 720px) { .rc-bbcalc { grid-template-columns: 1fr; } .rc-bb__amt input { width: 140px; } }
.rc-more > summary { background: none !important; border: 0 !important; padding: 9px 0 !important; border-radius: 0 !important; }
/* 買取査定の上の帯（買取番号・査定総額・完了） */
#purchase-scan-detail-buyback-area:not([hidden]) { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin: 10px 0 14px !important; padding: 12px 14px; border-radius: 12px; background: #fff7e6; border: 1px solid #f3d59a; }
#purchase-scan-detail-buyback-area label { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: #7a4a00; }
#purchase-scan-detail-buyback-area input { min-height: 36px; width: 180px; border: 1px solid #e6c37a !important; border-radius: 8px !important; padding: 2px 10px; background: #fff; }
#purchase-scan-detail-buyback-area > span:not(.hint-text) { font-size: 13px; color: #7a4a00; }
#purchase-scan-detail-buyback-area strong { font-size: 18px; color: #1c2333; }
#purchase-scan-detail-complete-appraisal { margin-left: auto; }
/* 2026-10-31 追加: 画像の横を使う・ほかの出品は枠の中でスクロール・リンクは隠せる */
.rc-nums { display: grid; grid-template-columns: 1fr; gap: 8px; }
@media (min-width: 1100px) { .rc-nums { grid-template-columns: minmax(0, 560px) minmax(0, 1fr); align-items: stretch; } }
.rc-nums .rc-stats { min-width: 0; }
.rc-nums .rc-stats__cap { margin-bottom: 3px; }
.rc-info .rc-calc { margin-top: 2px; }
.rc-info .rc-spec { margin-top: 2px; }
.rc-offers__list { max-height: 112px; overflow-y: auto; padding: 2px 4px 2px 0; overscroll-behavior: contain; scrollbar-width: thin; }
@media (max-width: 720px) { .rc-offers__list { max-height: 150px; } }
.rc-offers__list.is-more { box-shadow: inset 0 -10px 8px -8px rgba(16,24,40,.18); }
.rc-linktoggle { margin-left: 12px; padding: 4px 12px; border-radius: 8px !important; border: 1px solid rgba(255,255,255,.3); background: rgba(255,255,255,.1); color: #fff; font-size: 12.5px; cursor: pointer; }
.rc-linktoggle:hover { background: rgba(255,255,255,.2); }
/* （まとめて隠すボタンは廃止。カードごとの「リンクを表示」へ） */
@media (max-width: 720px) { .rc-sec--top { flex-wrap: wrap; } .rc-sec__count { margin-left: 0 !important; } .rc-linktoggle { margin-left: auto; } }
@media (min-width: 1100px) {
  .rc-info .rc-spec { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .rc-info .rc-spec > div { border-top: 1px solid #eef1f5; border-right: 1px solid #eef1f5; }
  .rc-info .rc-spec > div:nth-child(-n+3) { border-top: 0; }
  .rc-info .rc-spec > div:nth-child(3n) { border-right: 0; }
  .rc-info .rc-spec > div { grid-template-columns: 74px minmax(0, 1fr); }
}
/* 2026-10-31 ユーザー指示「複数・OCRの結果も長くならないように」: 商品情報は表をやめて1〜2行の小さな札、グラフのボタンはほかの出品の見出しの横 */
.rc-info .rc-spec { display: flex !important; flex-wrap: wrap; gap: 3px 6px; border: 0; border-radius: 0; overflow: visible; }
.rc-info .rc-spec > div { display: inline-flex !important; align-items: baseline; gap: 4px; padding: 2px 8px; border: 1px solid #eef1f5 !important; border-radius: 7px; background: #fafbfc; font-size: 12px; }
.rc-info .rc-spec dt { padding: 0; background: none; font-size: 11px; }
.rc-info .rc-spec dd { padding: 0; }
.krt-item.rc { padding: 12px 14px; margin-bottom: 10px; }
.rc-top { margin-bottom: 6px; }
.rc-info { gap: 6px; }
.rc-kpi { padding: 5px 9px; }
.rc-kpi > b { font-size: 17px; }
.rc-calc { padding: 5px 8px; }
.rc-offers { margin-top: 8px; position: relative; }
.rc-offers .krt-bkrate-box { position: absolute; right: 0; top: -4px; margin: 0 !important; }
.rc-offers .krt-bkrate-box .krt-bkrate-chart:not([hidden]), .rc-offers .krt-bkrate-box .krt-bkrate-status:not([hidden]) { position: static; }
.rc-offers .krt-bkrate-box:has(.krt-bkrate-chart:not([hidden])) { position: static; margin: 0 0 8px !important; }
.rc-offers .krt-bkrate-btn { padding: 4px 12px !important; font-size: 12px !important; margin: 0 !important; }
.rc-offers__head { padding-right: 110px; }
.krt-item.rc .krt-links { margin-top: 8px; }
@media (max-width: 720px) {
  .rc-main { grid-template-columns: 56px minmax(0, 1fr); gap: 8px 10px; }
  .rc-info { display: contents; }
  .rc-cover { grid-row: 1; grid-column: 1; }
  .rc-cover .krt-img { width: 56px; }
  .rc-info > .rc-title { grid-row: 1; grid-column: 2; align-self: center; font-size: 14.5px; }
  .rc-info > :not(.rc-title) { grid-column: 1 / -1; }
  .rc-kpis { grid-template-columns: 1fr .8fr 1.6fr; }
  .rc-kpi--max { grid-column: auto; }
  .rc-kpi > b { font-size: 15px; }
  .rc-kpi > span, .rc-kpi > small { font-size: 10px; white-space: normal; }
  .rc-stats__cap { display: none; }
  .rc-offers__head { padding-right: 96px; }
  .rc-offers__list { max-height: 104px; }
  .krt-links { gap: 4px; }
  .krt-outg { padding: 2px 3px 2px 6px; }
}

/* ---------- 2026-10-31 結果カードは枠で囲まず文字の行で（短く・見やすく） ---------- */
.rc-line { font-size: 13.5px; line-height: 1.55; color: var(--s2-ink); }
.rc-line small { font-size: 11.5px; color: var(--s2-sub); }
.rc-line--main { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 14px; font-size: 14px; }
.rc-line--main b { font-size: 18px; font-variant-numeric: tabular-nums; }
.rc--buy .rc-profit b { color: #0b7a43; }
.rc-profit.is-minus b { color: #c53030; }
.rc-maxl b { color: var(--s2-blue-d); }
.rc-line--stats b { font-variant-numeric: tabular-nums; }
.rc-lbl { font-size: 11.5px; font-weight: 700; color: var(--s2-sub); margin-right: 6px; }
.rc-dot { font-style: normal; color: #b4bcc8; margin: 0 3px; }
.rc-line--calc { font-family: ui-monospace, Consolas, monospace; font-size: 12.5px; color: #3b4556; }
.rc-line--calc .rc-judge { font-size: 15px; padding: 0 2px; }
.rc-line--spec { font-size: 12px; color: var(--s2-sub); }
.rc-ship { margin-left: 4px; font-size: 11px; color: var(--s2-blue-d); }
.rc-rank.is-warn p { margin: 0; color: #c53030; font-size: 12px; }
.rc-info { gap: 1px !important; }
.rc-info > .rc-title { margin-bottom: 3px; }
.rc-linkdd { margin-top: 6px; }
.rc-linkdd > summary { cursor: pointer; font-size: 12px; font-weight: 700; color: var(--s2-blue-d); list-style: none; display: inline-flex; align-items: center; gap: 4px; padding: 2px 0; }
.rc-linkdd > summary::-webkit-details-marker { display: none; }
.rc-linkdd > summary::before { content: "▸"; }
.rc-linkdd[open] > summary::before { content: "▾"; }
.rc-linkdd[open] > summary { margin-bottom: 4px; }
@media (max-width: 720px) {
  .rc-line--main { gap: 0 10px; }
  .rc-line--main b { font-size: 16px; }
  .rc-offers__note { display: none; }
}
@media (max-width: 720px) {
  .rc-line--stats small, .rc-line--calc small, .rc-line--main small { display: none; }
  .rc-offers__time { display: none; }
}
/* 2026-10-31 ユーザー指示: スマホでも平均の安い〜高いを出す（1種類ずつ行を分ける）／「買い」の緑は赤に */
@media (max-width: 720px) {
  .rc-line--stats small { display: inline !important; }
  .rc-line--stats { display: flex; flex-direction: column; }
  .rc-line--stats .rc-dot { display: none; }
}
.rc-badge--buy { background: #d91c1c !important; color: #fff !important; }
.krt-item.rc.rc--buy { border-color: #f1b3b3 !important; box-shadow: 0 0 0 1px #f9d6d6 inset, 0 1px 2px rgba(16,24,40,.04) !important; background: linear-gradient(180deg, #fff5f5, #fff 120px) !important; }
.rc--buy .rc-profit b, .rc--buy .rc-kpi--profit > b { color: #d91c1c !important; }
.rc--buy .rc-kpi--profit { background: #fdecec; border-color: #f3b1b1; }
.rc-line--calc .rc-judge.is-ok { color: #d91c1c; }
@media (max-width: 720px) { .rc-line--stats .rc-lbl { display: none; } .rc-st small { font-size: 12px; } }
/* 2026-10-31 ユーザー指示「赤は買いの文字の部分だけ。その他は緑」 */
.krt-item.rc.rc--buy { border-color: #9fd9b8 !important; box-shadow: 0 0 0 1px #c8ecd8 inset, 0 1px 2px rgba(16,24,40,.04) !important; background: linear-gradient(180deg, #f3fbf6, #fff 120px) !important; }
.rc--buy .rc-profit b, .rc--buy .rc-kpi--profit > b { color: #0b7a43 !important; }
.rc--buy .rc-kpi--profit { background: #e7f8ee; border-color: #a9e0c1; }
.rc-line--calc .rc-judge.is-ok { color: #0b7a43; }
/* 2026-10-31 ユーザー指示: 利益の行 → ランク → 平均 の順。PCは詰め込まず1項目ずつ行を分けて見やすく */
.rc-line--stats { display: flex; flex-direction: column; }
.rc-line--stats .rc-dot, .rc-line--stats .rc-lbl { display: none; }
.rc-st small { display: inline !important; }
@media (min-width: 721px) {
  .rc-info { gap: 4px !important; }
  .rc-info > .rc-title { font-size: 16px; margin-bottom: 4px; }
  .rc-line { font-size: 14.5px; line-height: 1.7; }
  .rc-line--main { font-size: 15px; }
  .rc-line--main b { font-size: 20px; }
  .rc-rank > b { font-size: 15px; }
  .rc-line--stats b { font-size: 15px; }
  .rc-st small { font-size: 13px; }
  .rc-line--calc { font-size: 13.5px; margin-top: 4px; }
  .rc-line--spec { font-size: 13px; }
  .rc-cover .krt-img { width: 96px; }
  .krt-item.rc { padding: 16px 18px; margin-bottom: 14px; }
}
@media (max-width: 720px) { .rc-line--main small { display: inline !important; } }
/* 2026-10-31 ユーザー指示: 太字（利益○円・発送方法・出品数・EAN）、細字（ほかの出品）、出品数は大きく */
.rc-line--main small { font-weight: 700; color: var(--s2-ink); }
.rc-shipname, .rc-ean { font-weight: 700; color: var(--s2-ink); }
.rc-offers__head > b { font-weight: 400 !important; color: var(--s2-sub) !important; font-size: 12.5px !important; }
.rc-offers__cnt { font-size: 15px; font-weight: 700; color: var(--s2-ink); }

/* ---------- 2026-10-31 ユーザー指示「ここは改行したほうが見やすくなる所を深く調査し見やすい形へ」（全画面） ----------
   1) 見出し・ラベル・表の中の日本語は、文字の途中で折り返さず、空白や「（」の前など区切りの良い所でだけ改行する
   2) コード（SKU・ASIN・EAN）・件数「42 / 42」・金額・ボタン・札は1行のまま（途中で切らない） */
.main :where(th, label, dt, button, .btn, .tag, .rc-tag, .cm-tag, legend, h2, h3, .pt-h, .topbar__item, summary) { word-break: keep-all; overflow-wrap: anywhere; line-break: strict; }
.main :where(td, dd, small, .hint, .help, .hint-text, .note, p) { line-break: strict; }
.main :where(button, .btn, a.btn, .rc-badge, .rc-o, .krt-out, .rc-shipname, .rc-offers__cnt, .dn-cat-count, .tag, .unviewed-badge, .purchase-scan-batch-processing) { white-space: nowrap; }
.main :where(.col-sku, .rc-ean, .ame-go, .mono, code, kbd) { white-space: nowrap; }
/* 件数（N / N）の列 */
#sp-batch-table td:nth-child(2), #p2j-batch-table td:nth-child(2), #purchase-scan-batch-table td:nth-child(2), #os-batch-table td:nth-child(2) { white-space: nowrap; }
/* 価格改定の履歴のSKUリンク */
#rpt-log-autorun a, #rpt-log-inactive a { white-space: nowrap; }
/* 日付と時刻は日付の後ろでだけ改行 */
#p2j-batch-table td:nth-child(4) { word-break: keep-all; }
/* スマホの狭い表の見出しは少し小さく */
@media (max-width: 720px) {
  .main th { font-size: 11.5px; }
  #sp-batch-table th, #p2j-batch-table th { padding-left: 2px !important; padding-right: 2px !important; }
}
@media (max-width: 720px) {
  /* 複数・OCRの一覧: 結果表示ボタンを1行に（メモの列を少し狭く） */
  #sp-batch-table th:nth-child(5), #sp-batch-table td:nth-child(5), #p2j-batch-table th:nth-child(5), #p2j-batch-table td:nth-child(5) { width: 70px !important; }
  #sp-batch-table .purchase-scan-batch-show, #p2j-batch-table .purchase-scan-batch-show { white-space: nowrap; font-size: 12px !important; padding: 6px 4px !important; }
  #sp-batch-table th:nth-child(3), #p2j-batch-table th:nth-child(3) { white-space: nowrap; }
  /* 判定設定のランク表 */
  #purchase-judge-profiles .jp-sec table.compact-table th { font-size: 11px; line-height: 1.3; word-break: keep-all; overflow-wrap: normal; }
  /* 値付け設定の期間別の表: 入力欄を枠の幅に収める */
  #price-panel-settings .rp-cfg .period-table :where(input, select) { width: 100% !important; min-width: 0 !important; box-sizing: border-box; }
}
@media (max-width: 720px) {
  #purchase-judge-profiles .jp-sec table.compact-table { table-layout: fixed; }
  #purchase-judge-profiles .jp-sec table.compact-table tr > :first-child { width: 58px; font-size: 10.5px; word-break: break-all; overflow-wrap: anywhere; padding-right: 4px !important; }
  #purchase-judge-profiles .jp-sec table.compact-table td input[type="number"], #purchase-judge-profiles .jp-sec table.compact-table td input[type="text"] { width: 100% !important; min-width: 0 !important; box-sizing: border-box; padding: 2px 3px !important; text-align: center; font-size: 14px; }
  #purchase-judge-profiles .jp-sec table.compact-table td, #purchase-judge-profiles .jp-sec table.compact-table th { padding: 4px 2px !important; }
}

/* ===== DVD仕入の店舗選び（2026-10-31 ユーザー指示「androidのDVDの店舗選択を見やすく」）: 選択欄をやめてボタン＋一覧 ===== */
.dvd-page .dvd-shopf { position: relative; }
.dvd-shopbtn { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 44px; padding: 6px 12px; border: 1px solid var(--s2-line, #ccc); border-radius: 10px; background: #fff; color: var(--s2-ink); font: inherit; font-size: 15px; text-align: left; cursor: pointer; }
.dvd-shopbtn[aria-expanded="true"] { border-color: var(--s2-blue); box-shadow: 0 0 0 2px color-mix(in srgb, var(--s2-blue) 20%, transparent); }
.dvd-shopbtn__t { flex: 1; min-width: 0; display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 8px; }
.dvd-shopbtn__t b { font-weight: 700; }
.dvd-shopbtn__t small, .dvd-shopbtn > i { color: var(--s2-sub); font-size: 12px; font-style: normal; }
.dvd-page em { font-style: normal; }
.dvd-shopbtn__t em, .dvd-shopi__n em { font-size: 11px; padding: 0 6px; border-radius: 6px; background: var(--s2-soft, #eef3f0); color: var(--s2-sub); white-space: nowrap; }
.dvd-shoplist { position: absolute; z-index: 30; left: 0; right: 0; top: 100%; margin-top: 4px; background: #fff; border: 1px solid var(--s2-line, #ccc); border-radius: 12px; box-shadow: 0 10px 28px rgba(0,0,0,.16); overflow: hidden; }
.dvd-shoplist__q { display: block; width: calc(100% - 16px) !important; margin: 8px; min-height: 40px; }
.dvd-shoplist ul { list-style: none; margin: 0; padding: 0; max-height: min(60vh, 440px); overflow-y: auto; overscroll-behavior: contain; }
.dvd-shoplist li + li { border-top: 1px solid var(--s2-line, #eee); }
.dvd-shoplist li button { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 54px; padding: 8px 12px; border: 0; background: none; font: inherit; color: var(--s2-ink); text-align: left; cursor: pointer; }
.dvd-shoplist li button:hover, .dvd-shoplist li button:focus-visible { background: var(--s2-soft, #f3f6f4); }
.dvd-shoplist li button.is-on { background: color-mix(in srgb, var(--s2-blue) 12%, #fff); }
.dvd-shopi__n { flex: 1; min-width: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 6px; }
.dvd-shopi__n b { font-size: 15px; font-weight: 700; }
.dvd-shopi__n small { flex-basis: 100%; font-size: 12px; color: var(--s2-sub); }
.dvd-shopi__c { flex: none; display: flex; flex-direction: column; align-items: flex-end; line-height: 1.15; }
.dvd-shopi__c b { font-size: 17px; font-weight: 700; color: var(--s2-blue); }
.dvd-shopi__c small { font-size: 11px; color: var(--s2-sub); }
@media (max-width: 640px) {
  .dvd-shoplist { position: fixed; left: 8px; right: 8px; top: auto; bottom: 8px; margin: 0; box-shadow: 0 0 0 100vmax rgba(15,20,30,.35); }
  .dvd-shoplist ul { max-height: 62vh; }
}

/* 2026-10-31 ユーザー指示: 仕入れの「複数・コミック・OCR・電脳・DVD」の文字は太字 */
#module-purchase .topbar__item:is([data-panel="smart"], [data-panel="setsearch"], [data-panel="ocr"], [data-panel="dennou"], [data-panel="dvd"]) { font-weight: 700 !important; }
#module-purchase .topbar__item:is([data-panel="smart"], [data-panel="setsearch"], [data-panel="ocr"], [data-panel="dennou"], [data-panel="dvd"]):not(.topbar__item--active) { color: var(--s2-ink) !important; }
@media (max-width: 640px) { #module-purchase .topbar__item:is([data-panel="smart"], [data-panel="setsearch"], [data-panel="ocr"], [data-panel="dennou"], [data-panel="dvd"]) { font-size: 13px !important; } }
/* 電脳: 取得開始位置・取得件数の補足（スマホは出さない） */
.dn2-hint { display: block; margin-top: 2px; font-size: 11.5px; color: var(--s2-sub); font-weight: 400; }
@media (max-width: 640px) { .dn2-hint { display: none; } }

/* 2026-10-31 ユーザー指示: TOPメニューのディスク空き容量はスマホでは出さない */
@media (max-width: 640px) { #top-disk-card { display: none !important; } }
/* ディスク空き容量（TOPの右の列の一番上） */
.hx-maint #top-disk-card { margin: 0 0 12px; padding: 12px 16px; border-radius: 12px; background: #fff; border: 1px solid var(--s2-line); box-shadow: none; }
.hx-maint #top-disk-card .disk-title { font-size: 12px; color: var(--s2-sub); font-weight: 700; }
.hx-maint #top-disk-card .disk-main { font-size: 15px; color: var(--s2-ink); font-weight: 700; margin: 2px 0; }
.hx-maint #top-disk-card .disk-sub { font-size: 11px; color: var(--s2-sub); }
.hx-maint #top-disk-card.warn { border-color: #f5b83d; background: #fff8e6; }
.hx-maint #top-disk-card.danger { border-color: #e5484d; background: #fff1f1; }

/* 2段階認証（システム設定）2026-10-31 実機 v2.5.9 */
.totp-box { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--s2-line); }
.totp-box__h { margin: 0 0 4px; font-size: 15px; }
.totp-box__state { margin: 6px 0 10px; font-size: 14px; }
.totp-steps { margin: 0 0 10px; padding-left: 1.4em; font-size: 13px; line-height: 1.8; color: var(--s2-sub); }
.totp-qr { width: 200px; max-width: 100%; margin: 10px 0; background: #fff; padding: 6px; border: 1px solid var(--s2-line); border-radius: 10px; }
.totp-qr:empty { display: none; }
.totp-qr svg { display: block; width: 100%; height: auto; }
#totp-secret { font-size: 13px; letter-spacing: .05em; word-break: break-all; }
#totp-code, #totp-off-code { max-width: 160px; font-size: 18px; letter-spacing: .2em; }

/* 出荷＞メルカリ発送（2026-11-01、js/mercari_labels.js） */
#mc-paste { width: 100%; box-sizing: border-box; font-size: 15px; padding: 8px 10px; border: 1px solid var(--s2-line); border-radius: 10px; resize: vertical; }
.mc-grid { display: grid; grid-template-columns: 140px 1fr; gap: 8px 12px; margin-top: 10px; }
.mc-grid .mc-wide { grid-column: span 1; }
.mc-grid input { width: 100%; box-sizing: border-box; }
.mc-msg { margin-left: 10px; font-size: 13px; }
.mc-msg.is-ok { color: #1e7a46; } .mc-msg.is-ng { color: #c0392b; }
.mc-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin: 8px 0 10px; font-size: 14px; }
.mc-list { display: flex; flex-direction: column; gap: 8px; }
.mc-item { display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; border: 1px solid var(--s2-line); border-radius: 12px; background: var(--s2-card, #fff); }
.mc-item.is-done { opacity: .6; }
.mc-item__chk input { width: 20px; height: 20px; margin-top: 2px; }
.mc-item__body { flex: 1; min-width: 0; }
.mc-item__name { font-weight: 700; font-size: 15px; }
.mc-item__addr { font-size: 13px; word-break: break-all; }
.mc-item__meta { font-size: 12px; color: var(--s2-sub); margin-top: 2px; }
.mc-item__del { border: 0; background: none; font-size: 20px; line-height: 1; color: var(--s2-sub); cursor: pointer; padding: 2px 6px; }
@media (max-width: 640px) {
  .mc-pc { display: none; }
  .mc-grid { grid-template-columns: 1fr; }
  .mc-bar #mc-print, .mc-bar #mc-clickpost { width: 100%; }
}
.mc-sender { margin: 0 0 12px; padding: 10px 12px; border: 1px solid var(--s2-line); border-radius: 12px; }
.mc-sender summary { cursor: pointer; font-size: 14px; }
.mc-sender summary b { font-weight: 600; }
.mc-sender select { width: 100%; }

/* 2026-11-01 ユーザー指示「OCRのスキャン結果一覧の字が重なっている」: スマホで「状況」の進み具合のバーが狭い列からはみ出し、
   隣の件数（104 / 104）に重なっていた。バーを列の幅に収め、件数は1行で読める幅を確保する（複数・単品・他書店の一覧も同じ表） */
@media (max-width: 900px) {
  #p2j-batch-table td:nth-child(3) .purchase-progress-bar, #sp-batch-table td:nth-child(3) .purchase-progress-bar,
  #os-batch-table td:nth-child(3) .purchase-progress-bar, #purchase-scan-batch-table td:nth-child(3) .purchase-progress-bar { width: 100% !important; min-width: 0 !important; max-width: 100%; box-sizing: border-box; }
  #p2j-batch-table th:nth-child(2), #p2j-batch-table td:nth-child(2), #sp-batch-table th:nth-child(2), #sp-batch-table td:nth-child(2),
  #os-batch-table th:nth-child(2), #os-batch-table td:nth-child(2) { width: auto; min-width: 58px; white-space: nowrap; }
  #p2j-batch-table th:nth-child(3), #p2j-batch-table td:nth-child(3), #sp-batch-table th:nth-child(3), #sp-batch-table td:nth-child(3),
  #os-batch-table th:nth-child(3), #os-batch-table td:nth-child(3) { width: 46px; overflow: hidden; }
  #p2j-batch-table td:nth-child(3) .purchase-progress-text, #sp-batch-table td:nth-child(3) .purchase-progress-text, #os-batch-table td:nth-child(3) .purchase-progress-text { font-size: 11px; white-space: nowrap; }
}

/* 出品＞共通コメントの「全文を隠す／表示」（2026-11-01） */
#listing-panel-work .cc-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
#listing-panel-work .cc-toggle { padding: 5px 10px; font-size: 12.5px; border: 1px solid var(--s2-line, #d0d5dd); border-radius: 8px; background: #fff; color: var(--s2-ink, #1f2937); cursor: pointer; white-space: nowrap; }
#listing-panel-work .cc-toggle:hover { background: #f3f4f6; }