/* =====================================================================
   迷宮・出撃・帰還 (WP-D) — 行動ドック・手帳・階の情報・今回の収穫・覗き見・
   出撃シート・戦果シート・全滅・踏破・帰還の報告
   ui.css のトークン (--iron-*, --gold*, --t-*, --sp-*) と kit の部品を土台に重ねる。押せる所は 44px 以上。
   ===================================================================== */

/* ===================== 行動ドック (#hint を置き換える) ===================== */
#hint.dg-dock {
  display: flex; align-items: stretch; gap: 6px;
  min-height: calc(56px + var(--safe-bottom)); padding: 4px 6px calc(4px + var(--safe-bottom));
  font-size: inherit; color: inherit; letter-spacing: 0;
  background: var(--grain), linear-gradient(180deg, #120e12 0%, #0b080b 100%);
  border-top: 1px solid #241c20;
  box-shadow: inset 0 1px 0 rgba(255,236,200,0.04);
}
#hint.dg-dock.hidden { display: none !important; }
.dk-btn {
  flex: 1 1 0; min-width: 0; min-height: 48px;
  display: flex; align-items: center; justify-content: center; gap: 10px; padding: 4px 12px;
  font-family: var(--font); color: var(--ink); text-align: left; cursor: pointer;
  background: var(--grain), var(--dg-iron-hi);
  border: 1px solid #4d3f37; border-radius: 3px;
  box-shadow: inset 0 1px 0 rgba(255,236,200,0.1), inset 0 -2px 0 rgba(0,0,0,0.6), 0 3px 0 #070507, 0 4px 10px rgba(0,0,0,0.6);
  -webkit-tap-highlight-color: transparent; touch-action: manipulation;
  transition: transform var(--t-tap) ease-out, filter var(--t-tap) ease-out;
}
.dk-btn.dk-down:disabled { opacity: 0.4; cursor: default; animation: none; }
.dk-btn:not(:disabled):active { transform: translateY(2px); box-shadow: inset 0 2px 6px rgba(0,0,0,0.85), 0 1px 0 #070507; }
.dk-ic { flex: 0 0 auto; width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linejoin: round; stroke-linecap: round; filter: drop-shadow(0 1px 0 #000); }
.dk-t { display: flex; flex-direction: column; min-width: 0; line-height: 1.15; }
.dk-l { font-size: 15.5px; font-weight: 800; letter-spacing: 0.12em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-shadow: 0 1px 0 #000; }
.dk-s { font-size: 10.5px; font-weight: 700; letter-spacing: 0.06em; color: #9a8e78; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 2px; }
/* ▼ 降りる: 燻した金の縁で呼ぶ */
.dk-down.k-primary {
  color: var(--dg-gold-hi); border-color: #8a6d2e;
  background: var(--grain), radial-gradient(120% 90% at 30% 0%, rgba(243,213,139,0.14), rgba(0,0,0,0) 60%), linear-gradient(180deg, #2c2318 0%, #1c160f 60%, #130f0a 100%);
  box-shadow: inset 0 1px 0 rgba(255,226,160,0.16), inset 0 -2px 0 rgba(0,0,0,0.6), 0 0 0 1px rgba(201,162,74,0.25), 0 3px 0 #070507, 0 0 16px rgba(201,162,74,0.22);
  animation: dk-call 2.6s ease-in-out infinite;
}
.dk-down.k-primary .dk-s { color: #c9ab72; }
/* 主の間: 血に濡れた鉄 */
.dk-down.k-danger {
  color: #ffd2c4; border-color: #8a2a1e;
  background: var(--grain), radial-gradient(120% 90% at 30% 0%, rgba(255,120,80,0.16), rgba(0,0,0,0) 60%), linear-gradient(180deg, #4a1712 0%, #2c0d0b 55%, #170605 100%);
  box-shadow: inset 0 1px 0 rgba(255,210,170,0.2), inset 0 -2px 0 rgba(0,0,0,0.6), 0 0 0 1px rgba(201,162,74,0.25), 0 3px 0 #070507, 0 0 18px rgba(200,40,20,0.3);
}
.dk-down.k-danger .dk-s { color: #d9a98a; }
/* ⌂ 帰還: 帰還陣の青白い光 */
.dk-home { color: #c8f6f8; border-color: #3f8a92; box-shadow: inset 0 1px 0 rgba(200,250,255,0.12), inset 0 -2px 0 rgba(0,0,0,0.6), 0 0 0 1px rgba(90,220,235,0.18), 0 3px 0 #070507, 0 0 14px rgba(90,220,235,0.2); }
.dk-home .dk-s { color: #8fc6cc; }
#hint.dg-dock:not(.one) .dk-home { flex: 0 1 38%; }
/* ✚ 全員を回復: 帰還の右。手当ての要る時だけ癒しの緑に灯る */
.dk-heal { color: #a89f8c; }
.dk-heal .dk-s { color: #7a7060; }
.dk-heal.hot { color: #d4f5c8; border-color: #4f8a45; box-shadow: inset 0 1px 0 rgba(220,255,200,0.12), inset 0 -2px 0 rgba(0,0,0,0.6), 0 0 0 1px rgba(120,220,100,0.18), 0 3px 0 #070507, 0 0 14px rgba(120,220,100,0.18); }
.dk-heal.hot .dk-s { color: #9ccf8e; }
.dk-heal .dk-l { letter-spacing: 0.04em; }
/* 降りる・待機の横では、回復は文字の幅だけ取る (残りは降りる・案内へ)。間に浮遊が挟まっても同じ。
   縮むのは案内の文 (…で切れる) だけで、ボタンの文字は切らない */
#hint.dg-dock .dk-idle ~ .dk-heal, #hint.dg-dock.has-down .dk-heal { flex: 0 0 auto; }
#hint.dg-dock .dk-idle { flex: 1 1 0; min-width: 0; }
/* 降りる・帰還・回復の3つ並び: 帰還と回復を詰める */
#hint.dg-dock.has-down.has-home .dk-btn { gap: 6px; padding: 4px 8px; }
#hint.dg-dock.has-down.has-home .dk-l { letter-spacing: 0.04em; }
#hint.dg-dock.has-down.has-home .dk-home { flex: 0 0 auto; }
#hint.dg-dock.has-down.has-home .dk-heal .dk-ic { display: none; }
/* 浮遊 (迷宮で唱える技): 小さめの札。浮いている間は淡い青緑に光る */
.dk-float { flex: 0 0 auto; color: #a8b8b4; }
.dk-float .dk-s { color: #7a8a86; }
.dk-float.on { color: #c8f4ec; border-color: #3f8a80; box-shadow: inset 0 1px 0 rgba(200,255,240,0.12), inset 0 -2px 0 rgba(0,0,0,0.6), 0 0 0 1px rgba(120,230,210,0.18), 0 3px 0 #070507, 0 0 14px rgba(120,230,210,0.18); }
.dk-float.on .dk-s { color: #8fcfc2; }
#hint.dg-dock.has-float .dk-float .dk-ic, #hint.dg-dock.has-float.has-down .dk-heal .dk-ic { display: none; }
#hint.dg-dock.has-float .dk-btn { gap: 6px; padding: 4px 8px; }
/* 降りる・帰還・浮遊・回復の4つ並び: 帰還の絵も外し、降りるが残りの幅を取る (文字は切らない) */
#hint.dg-dock.has-float.has-down.has-home .dk-home .dk-ic { display: none; }
#hint.dg-dock.has-float.has-down.has-home .dk-btn { gap: 4px; padding: 4px 6px; }
/* 札 (絵 + 短い名前): 迷宮の術が2つ以上ならそれぞれ、ボタンが混む時 (.tight) は帰還・回復 (さらに混めば降りる) もこの形 */
#hint.dg-dock .dk-btn.dk-tag { flex: 0 0 auto; flex-direction: column; gap: 2px; min-width: 58px; padding: 3px 3px; text-align: center; }
.dk-tag .dk-ic { display: block !important; width: 22px; height: 22px; }
.dk-sl { max-width: 100%; overflow: hidden; font-size: 10.5px; font-weight: 800; letter-spacing: 0; white-space: nowrap; line-height: 1.1; text-shadow: 0 1px 0 #000; }
#hint.dg-dock .dk-down.dk-tag { flex: 1 1 auto; }
/* 宝探し = 青 (宝箱) に灯る (浮遊・道しるべは .dk-float.on の青緑) */
.dk-float.k-chest.on { color: #c4dcff; border-color: #3a5a8a; box-shadow: inset 0 1px 0 rgba(200,220,255,0.12), inset 0 -2px 0 rgba(0,0,0,0.6), 0 0 0 1px rgba(80,150,255,0.22), 0 3px 0 #070507, 0 0 14px rgba(70,140,255,0.3); }
.dk-float.k-chest.on .dk-s { color: #9ab8e0; }
/* オート移動: いつも札の形で右端。ON の間は琥珀色に灯って脈打つ */
.dk-auto { color: #a89f8c; }
.dk-auto.on { color: #ffe2a8; border-color: #9a6a24; box-shadow: inset 0 1px 0 rgba(255,230,180,0.14), inset 0 -2px 0 rgba(0,0,0,0.6), 0 0 0 1px rgba(240,170,60,0.24), 0 3px 0 #070507, 0 0 14px rgba(240,160,50,0.3); animation: dk-call 1.8s ease-in-out infinite; }
/* 混む時: 間を詰め、札が残りの幅を等しく分け合う (押しやすく)。降りるは札2つ分の幅まで (2026-10、ユーザーの指示) */
#hint.dg-dock.tight { gap: 4px; }
#hint.dg-dock.tight .dk-btn:not(.dk-tag) { gap: 4px; padding: 4px 6px; }
#hint.dg-dock.tight .dk-l { letter-spacing: 0.02em; }
#hint.dg-dock.tight .dk-down .dk-ic { display: none; }
#hint.dg-dock.tight .dk-btn.dk-tag { flex: 1 1 0; min-width: max-content; }
#hint.dg-dock.tight .dk-down .dk-l { font-size: 14px; letter-spacing: 0; }
#hint.dg-dock.tight .dk-down:not(.dk-tag) { flex: 2 1 0; }
@keyframes dk-call { 0%, 100% { filter: brightness(1); } 50% { filter: brightness(1.12); } }
.dk-idle {
  flex: 1 1 auto; display: flex; align-items: center; justify-content: center; gap: 9px; min-height: 48px; padding: 0 10px;
  color: #6e6457; font-size: 11px; letter-spacing: 0.12em; text-align: center; line-height: 1.5;
  border: 1px dashed #2a2226; border-radius: 3px;
}
.dk-idle-t { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dk-idle-mark { flex: 0 0 auto; width: 6px; height: 6px; transform: rotate(45deg); background: #4a3d36; }

/* ===================== 見出し: 手帳・迷宮名 ===================== */
#topbar .topbar-left #settings-btn, #topbar .topbar-left #descend-btn, #topbar .topbar-left #return-btn { display: none !important; }
#dg-book {
  width: 48px; height: 46px; min-width: 46px; padding: 3px 0 2px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px;
  color: #d8c9a8; font-family: var(--font); cursor: pointer;
  background: var(--grain), var(--dg-iron-hi); border: 1px solid #4d3f37; border-radius: 3px; box-shadow: var(--dg-edge);
  -webkit-tap-highlight-color: transparent; touch-action: manipulation;
}
#dg-book svg { width: 21px; height: 21px; fill: none; stroke: #c9ae7c; stroke-width: 1.7; stroke-linejoin: round; stroke-linecap: round; filter: drop-shadow(0 1px 0 #000); }
#dg-book .dg-book-l { font-size: 9.5px; font-weight: 800; letter-spacing: 0.2em; padding-left: 0.2em; color: #a8916a; line-height: 1; }
#dg-book:active { transform: scale(0.95); }
#floor-info[role="button"] { cursor: pointer; min-height: 44px; -webkit-tap-highlight-color: transparent; }
#floor-info .fi-more { font-size: 15px; font-weight: 800; color: #8a6d2e; line-height: 1; margin-left: -2px; }

/* ===================== 迷宮のシート共通 ===================== */
.dg-sheet .ui-sheet-body { text-align: left; }
.dg-sec { display: flex; align-items: baseline; gap: 8px; margin: 14px 2px 8px; }
.dg-sec-mark { flex: 0 0 auto; width: 7px; height: 7px; transform: rotate(45deg) translateY(-1px); background: linear-gradient(135deg, #f3d58b, #8a6d2e); box-shadow: 0 0 6px rgba(201,162,74,0.6); }
.dg-sec-t { font-size: 14px; font-weight: 800; letter-spacing: 0.14em; color: var(--accent-hi); }
.dg-sec-s { font-size: 11.5px; color: var(--ink-dim); letter-spacing: 0.06em; }
.dg-note { margin: 8px 2px; font-size: 12px; line-height: 1.65; color: #9a8e78; }
.dg-note.gold { color: #e8d08a; }
.dg-line { margin: 4px 2px; font-size: 13px; line-height: 1.6; color: #d6cbb2; }
.dg-line.up { color: var(--up); } .dg-line.bad { color: #ffb0a4; }
.dg-floorhead { display: flex; flex-direction: column; align-items: center; gap: 2px; width: 100%; padding: 4px 8px 10px; background: none; border: 0; color: inherit; font-family: var(--font); text-align: center; }
.dg-floorhead.tap { cursor: pointer; min-height: 56px; border: 1px solid #2c2427; border-radius: 3px; background: rgba(8,6,9,0.55); margin-bottom: 8px; }
.dg-fh-name { font-size: 12px; font-weight: 700; letter-spacing: 0.3em; color: #a8916a; }
.dg-fh-row { display: flex; align-items: center; gap: 9px; }
.dg-fh-depth { font-size: 26px; font-weight: 800; letter-spacing: 3px; color: var(--dg-gold-hi); text-shadow: 0 0 14px rgba(201,162,74,0.45), 0 2px 0 #000; }
.dg-fh-meta { font-size: 12px; color: #b2a68f; letter-spacing: 0.08em; }
.dg-fh-tag { font-size: 10px; font-weight: 800; color: #d7b8ff; border: 1px solid currentColor; border-radius: 2px; padding: 2px 5px; }
.dg-pips { display: inline-flex; gap: 5px; align-items: center; }
.dg-pips i { width: 8px; height: 8px; transform: rotate(45deg); background: #1a1416; border: 1px solid #5a4a36; }
.dg-pips i.done { background: linear-gradient(135deg, #8a6d2e, #4a3a18); border-color: #8a6d2e; }
.dg-pips i.now { background: linear-gradient(135deg, #fff1c4, #c9a24a); border-color: #f3d58b; box-shadow: 0 0 8px rgba(243,213,139,0.85); }
.dg-pips i.boss { border-color: #a8231c; background: #2a0606; }
.dg-pips i.boss.now { background: linear-gradient(135deg, #ff8a70, #9a1a12); border-color: #ff9a80; }
.dg-pips-of { font-size: 12px; color: #8c7a5a; }
.dg-row-ic { width: 22px; height: 22px; fill: none; stroke: #c9ae7c; stroke-width: 1.7; stroke-linejoin: round; stroke-linecap: round; }
.dg-sheet .ui-row { margin: 6px 0; }
.dg-sheet .ui-row-sub { white-space: normal; line-height: 1.45; }

.dg-fact { display: flex; gap: 10px; align-items: flex-start; margin: 8px 0; padding: 10px 12px; border: 1px solid #33292a; border-left: 3px solid var(--fact, #c9a24a); border-radius: 3px; background: var(--grain), var(--plate); }
.dg-fact.t-bad { --fact: #d4504e; }
.dg-fact-ic { flex: 0 0 auto; display: inline-flex; padding-top: 2px; }
.dg-fact-ic canvas { width: 32px; height: 32px; image-rendering: pixelated; }
.dg-fact-h { font-size: 14px; font-weight: 800; color: var(--fact, var(--accent-hi)); letter-spacing: 0.06em; margin-bottom: 3px; }
.dg-fact-l { font-size: 12.5px; line-height: 1.6; color: #cfc4ab; }
.dg-tally { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin: 6px 0 4px; }
.dg-tally-c { padding: 8px 4px; text-align: center; border: 1px solid #2c2427; border-radius: 3px; background: rgba(8,6,9,0.6); }
.dg-tally-n { display: flex; align-items: center; justify-content: center; font-size: 17px; font-weight: 800; color: var(--accent-hi); font-variant-numeric: tabular-nums; }
/* 大きな収穫も枠内に収め、押した正確な数字は省かず折り返す。 */
.dg-tally-c { min-width: 0; font: inherit; }
button.dg-tally-c { cursor: pointer; min-height: 44px; }
.dg-tally-value { min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 600px) {
  .dg-tally { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.dg-tally-l { font-size: 10.5px; color: var(--ink-dim); letter-spacing: 0.1em; margin-top: 2px; }
.dg-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(64px, 1fr)); gap: 8px 6px; margin: 6px 0; }
.dg-tilecell { display: flex; flex-direction: column; align-items: center; gap: 3px; min-width: 0; }
.dg-tile-who { max-width: 100%; font-size: 10.5px; color: var(--ink-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dg-souls { display: flex; flex-wrap: wrap; gap: 6px; }
.dg-soul { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 2px 10px 2px 4px; font-size: 12.5px; font-weight: 700; color: #e6dbc2; border: 1px solid #3a3029; border-radius: 3px; background: rgba(8,6,9,0.6); box-shadow: 0 0 8px color-mix(in srgb, var(--glow, #000) 25%, transparent); }
button.dg-soul { font-family: inherit; cursor: pointer; }
button.dg-soul:active { transform: translateY(1px); }
.dg-soul canvas { width: 28px; height: 28px; image-rendering: pixelated; }
.dg-soul.r-rare, .dg-soul.r-epic, .dg-soul.r-legend { border-color: var(--glow, #8a6d2e); }
.dg-chip { display: inline-flex; align-items: center; min-height: 26px; padding: 2px 8px; font-size: 11.5px; font-weight: 700; color: #cbb991; border: 1px solid #4d3f37; border-radius: 2px; background: rgba(0,0,0,0.35); }
.dg-chip.bad { color: #ffb0a4; border-color: #7a2a24; } .dg-chip.up { color: var(--up); border-color: #2e6b48; }
.dg-toggles { display: grid; gap: 6px; }
.dg-toggle {
  display: flex; align-items: center; gap: 12px; width: 100%; min-height: 56px; padding: 8px 12px;
  font-family: var(--font); color: var(--ink); text-align: left; cursor: pointer;
  background: var(--grain), var(--plate); border: 1px solid #33292a; border-radius: 3px; box-shadow: var(--plate-edge);
  touch-action: manipulation;
}
.dg-toggle-t { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.dg-toggle-l { font-size: 13.5px; font-weight: 700; }
.dg-toggle-s { font-size: 11.5px; color: var(--ink-dim); line-height: 1.4; }
.dg-switch { flex: 0 0 auto; position: relative; width: 46px; height: 26px; border-radius: 13px; background: #120d10; border: 1px solid #3a3029; box-shadow: inset 0 1px 4px rgba(0,0,0,0.8); transition: background var(--t-fast) ease-out, border-color var(--t-fast) ease-out; }
.dg-switch i { position: absolute; left: 3px; top: 3px; width: 18px; height: 18px; border-radius: 50%; background: radial-gradient(circle at 40% 35%, #8c7d68, #3e342d); box-shadow: 0 1px 2px #000; transition: transform var(--t-fast) ease-out, background var(--t-fast) ease-out; }
.dg-toggle.on .dg-switch { background: linear-gradient(180deg, #3a2c14, #1f170b); border-color: #8a6d2e; }
.dg-toggle.on .dg-switch i { transform: translateX(20px); background: radial-gradient(circle at 40% 35%, #fff1c4, #c9a24a); box-shadow: 0 0 8px rgba(243,213,139,0.7), 0 1px 2px #000; }
.dg-menu .ui-sheet-foot .ui-btn { min-height: 56px; }
.dg-logfull { display: flex; flex-direction: column; gap: 2px; font-size: 12.5px; line-height: 1.6; }
.dg-logfull .l-sys { color: var(--ink-dim); } .dg-logfull .l-hit { color: #8aa8ff; } .dg-logfull .l-dmg { color: #e8706a; } .dg-logfull .l-heal { color: #7fd68a; } .dg-logfull .l-win { color: var(--accent-hi); font-weight: 700; }
/* 覗き見 */
.dg-peek-top { display: flex; gap: 14px; align-items: center; margin: 2px 0 8px; }
.dg-peek-tx { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.dg-peek-n { font-size: 17px; font-weight: 800; color: var(--ink); }
.dg-peek-c { font-size: 12px; color: var(--ink-dim); }
.dg-peek-bar { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; align-items: center; gap: 8px; }
.dg-peek-bar.wide { margin: 8px 0; }
.dg-peek-bl { font-size: 11px; font-weight: 800; color: #b2a68f; }
.dg-peek-bv { font-size: 12px; font-weight: 700; color: #e6dbc2; font-variant-numeric: tabular-nums; }
.dg-peek-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 10px; }
.dg-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.dg-stat { display: flex; justify-content: space-between; align-items: center; min-height: 40px; padding: 4px 10px; border: 1px solid #2c2427; border-radius: 3px; background: rgba(8,6,9,0.6); }
.dg-stat-l { font-size: 11px; font-weight: 800; color: #b2a68f; letter-spacing: 0.1em; }
.dg-stat-v { font-size: 16px; font-weight: 800; color: var(--accent-hi); font-variant-numeric: tabular-nums; }
/* 人業の様子 (戦闘中の長押し): いまの戦力・能力の上下・技 */
.dg-stat.up .dg-stat-v { color: var(--up); } .dg-stat.down .dg-stat-v { color: #ff9a8a; }
.dg-stat-b { margin-left: 5px; font-size: 10px; font-weight: 700; color: #8f8370; }
.dg-num { flex-direction: column; align-items: stretch; justify-content: center; gap: 1px; padding: 4px 9px; }
.dg-num-h { display: flex; justify-content: space-between; align-items: baseline; gap: 6px; }
.dg-num-s { font-size: 10px; color: #8f8370; line-height: 1.3; }
.dg-num.warn .dg-stat-v { color: #ff9a8a; }
.dg-peek-skills { margin-bottom: 4px; }
.dg-skill { gap: 6px; cursor: pointer; }
.dg-skill-mp { font-size: 10.5px; color: #8fb1e6; }
.dg-skill.off { opacity: 0.42; }
.dg-skill.manual { border-style: dashed; }
.dg-enemy .ui-sheet-body { text-align: center; }
.dg-en-meta { font-size: 12.5px; color: #b2a68f; letter-spacing: 0.1em; }
.dg-en-elem { display: flex; justify-content: center; }
.dg-en-elem .ui-tag { font-size: 13px; }
.dg-traits { display: grid; gap: 6px; text-align: left; }
.dg-trait { display: flex; gap: 10px; align-items: center; padding: 8px 10px; border: 1px solid #33292a; border-left: 3px solid #a8231c; border-radius: 3px; background: var(--grain), var(--plate); }
.dg-trait-h { flex: 0 0 auto; min-width: 5.2em; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.dg-trait b { font-size: 13px; color: #ffb4a0; }
.dg-trait > span { font-size: 12.5px; color: #cfc4ab; line-height: 1.5; }
.dg-enemy .ui-affinity { margin: 8px 0 2px; }
.dg-en-desc { margin: 10px 2px 2px; font-size: 12px; line-height: 1.75; color: #9a8e78; text-align: left; }

/* ===================== 出撃シート ===================== */
/* 開いている層の門・隊の備え・異変・門をくぐる が 390×844 で巻かずに収まるよう詰める */
.ui-sheet.dp-sheet, .ui-sheet.rs-sheet, .ui-sheet.dg-menu { max-height: calc(100vh - 28px); max-height: calc(100dvh - 28px); }
.dp-sheet .ui-grab { height: 16px; }
.dp-sheet .ui-sheet-banner { margin: 0 0 2px; }
.dp-sheet .ui-sheet-body { text-align: left; padding-top: 0; padding-bottom: 6px; }
.dp-layer { margin: 2px 0 4px; border: 1px solid #2c2427; border-radius: 3px; background: rgba(8,6,9,0.45); }
.dp-layer-h {
  display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 12px; cursor: pointer; list-style: none;
  border-bottom: 1px solid #241d22; background: linear-gradient(90deg, color-mix(in srgb, var(--layer, #c9a24a) 14%, transparent), rgba(0,0,0,0) 70%);
}
.dp-layer-h::-webkit-details-marker { display: none; }
.dp-layer-n { font-size: 11.5px; font-weight: 800; letter-spacing: 0.2em; color: var(--layer, var(--accent-hi)); }
.dp-layer-name { flex: 1 1 auto; font-size: 14px; font-weight: 800; letter-spacing: 0.18em; color: var(--ink); }
.dp-layer-p { font-size: 11px; font-weight: 700; color: var(--ink-dim); font-variant-numeric: tabular-nums; }
.dp-layer-p.done { color: var(--accent-hi); }
.dp-gates { display: grid; gap: 0; }
.dp-gate {
  position: relative; display: flex; align-items: center; gap: 9px; width: 100%; min-height: 50px; padding: 3px 10px 3px 10px;
  font-family: var(--font); color: var(--ink); text-align: left; cursor: pointer;
  background: none; border: 0; border-top: 1px solid #1e181c; touch-action: manipulation;
}
.dp-gates .dp-gate:first-child { border-top: 0; }
.dp-gate.sel { background: linear-gradient(90deg, rgba(201,162,74,0.16), rgba(201,162,74,0.03) 70%); box-shadow: inset 3px 0 0 var(--accent); }
.dp-radio { flex: 0 0 auto; width: 16px; height: 16px; border-radius: 50%; border: 2px solid #5a4a36; box-shadow: inset 0 1px 3px #000; }
.dp-gate.sel .dp-radio { border-color: var(--accent-hi); background: radial-gradient(circle, #fff1c4 0 3px, #c9a24a 4px 5px, transparent 6px); box-shadow: 0 0 8px rgba(243,213,139,0.6); }
.dp-gate-ic { position: relative; flex: 0 0 auto; width: 28px; height: 36px; display: inline-flex; align-items: center; justify-content: center; }
.dp-gate-ic canvas { width: 26px; height: auto; image-rendering: pixelated; }
.dp-gate-no { position: absolute; right: -4px; bottom: -2px; font-size: 10px; font-weight: 800; color: var(--accent-hi); text-shadow: 0 1px 0 #000, 0 0 3px #000; }
.dp-gate-i { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.dp-gate-n { font-size: 14.5px; font-weight: 800; letter-spacing: 0.04em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dp-gate-c { font-size: 11px; color: var(--ink-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dp-gate-st { flex: 0 0 auto; font-size: 10.5px; font-weight: 800; letter-spacing: 0.08em; color: #7d7468; padding: 2px 6px; border: 1px solid #3a3029; border-radius: 2px; }
.dp-gate-st.done { color: var(--accent-hi); border-color: #8a6d2e; }
.dp-gate-st.perfect { color: #fff1c4; border-color: #d9b45a; background: linear-gradient(180deg, rgba(120,92,30,0.55), rgba(60,44,12,0.55)); box-shadow: 0 0 8px rgba(243,213,139,0.45); }
.dp-gate-st.quest { color: #ffcfb0; border-color: #a8231c; background: rgba(120,20,12,0.35); box-shadow: 0 0 8px rgba(200,40,20,0.35); }
.dp-gate-st.sealed { color: #8c7a5a; border-style: dashed; }
.dp-sealed { cursor: default; min-height: 44px; margin: 0 0 4px; border: 1px dashed #3a3029; border-radius: 3px; opacity: 0.8; background: repeating-linear-gradient(135deg, rgba(0,0,0,0) 0 10px, rgba(60,50,40,0.12) 10px 20px); }
.dp-sealed .dp-gate-ic { height: 30px; }
.dp-sealed .dp-gate-n { font-size: 13px; color: #9a8e78; }
.dp-abyss { margin: 4px 0; border: 1px solid #4a3a6a; border-radius: 3px; background: linear-gradient(90deg, rgba(120,80,200,0.16), rgba(0,0,0,0) 70%); }
.dp-rematch { border-color: #6a4a2a; background: linear-gradient(90deg, rgba(200,120,60,0.16), rgba(0,0,0,0) 70%); }
.dp-party { display: flex; align-items: center; gap: 6px; margin: 8px 0 2px; }
.dp-swap { display: inline-flex; align-items: center; justify-content: center; gap: 4px; min-width: 56px; min-height: 48px; padding: 0 8px; margin-left: auto; font-family: var(--font); font-size: 13px; font-weight: 800; letter-spacing: 0.1em; color: var(--accent-hi); background: rgba(8,6,9,0.6); border: 1px solid #4d3f37; border-radius: 3px; cursor: pointer; }
.dp-swap-c { color: #8a6d2e; font-size: 16px; }
.dp-issue { display: flex; align-items: center; gap: 8px; margin: 6px 0 0; padding: 2px 4px 2px 10px; min-height: 48px; border: 1px solid #33292a; border-left: 3px solid #c9a24a; border-radius: 3px; background: var(--grain), var(--plate); }
.dp-issue.t-bad { border-left-color: #d4504e; }
.dp-issue.t-dim { border-left-color: #4a3d36; }
.dp-issue-mark { flex: 0 0 auto; width: 7px; height: 7px; transform: rotate(45deg); background: currentColor; color: #c9a24a; }
.dp-issue.t-bad .dp-issue-mark { color: #e4554f; box-shadow: 0 0 6px rgba(228,85,79,0.7); }
.dp-issue.t-dim .dp-issue-mark { color: #6e6457; }
/* 注意の文は省略せず折り返して全文を見せる (本文ごと縦にスクロールする) */
.dp-issue-t { flex: 1 1 auto; min-width: 0; padding: 6px 0; font-size: 12.5px; line-height: 1.5; color: #e6dbc2; white-space: normal; }
.dp-issue.t-dim .dp-issue-t { color: #9a8e78; }
.dp-issue .ui-btn.s-sm { flex: 0 0 auto; width: auto; min-width: 88px; padding: 2px 10px; font-size: 12.5px; gap: 6px; }
.dp-issue .ui-cost { padding: 1px 5px; font-size: 11px; }
.dp-brief { margin: 8px 0 0; padding: 6px 10px 6px; border: 1px solid #2c5a6a; border-radius: 3px; background: rgba(20,50,64,0.25); }
.dp-brief-h { font-size: 12px; font-weight: 800; letter-spacing: 0.1em; color: #a8e4f4; margin-bottom: 2px; }
.dp-brief-h::before { content: "◆"; margin-right: 6px; font-size: 9px; color: #7fd0ff; }
.dp-brief-l { font-size: 12px; line-height: 1.55; color: #cfe6ec; }
.dp-back { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 12px 0 6px; margin: 2px 0 2px; font-family: var(--font); font-size: 13px; font-weight: 700; color: #cdbf9f; background: none; border: 0; cursor: pointer; }
.dp-back-c { font-size: 20px; color: #8a6d2e; }
.dp-sheet .ui-sheet-foot { padding: 8px var(--sp-4) 12px; }
.dp-sheet .ui-sheet-foot .ui-btn.dp-cta { min-height: 58px; font-size: 17px; letter-spacing: 0.2em; }
.dp-sheet .ui-sheet-foot .ui-btn.dp-cta .ui-btn-l::before, .dp-sheet .ui-sheet-foot .ui-btn.dp-cta .ui-btn-l::after { content: "◆"; font-size: 0.6em; margin: 0 0.6em; vertical-align: 0.2em; color: #c9a24a; }
/* 潜り始める階を出撃の札に組み込む: 札の上の縁に階の札を横に並べ、ひとつの枠にする */
.dp-go { display: flex; flex-direction: column; min-width: 0; }
.dp-go .ui-btn.dp-cta { min-width: 0; border-top-left-radius: 0; border-top-right-radius: 0; border-top-color: #3a2f22; }
.dp-go.danger .ui-btn.dp-cta { border-top-color: #3a1c18; }
.dp-go-fl { display: flex; align-items: center; gap: 4px; padding: 4px; border: 1px solid #8a6d2e; border-bottom: 0; border-radius: 3px 3px 0 0; background: var(--grain), linear-gradient(180deg, #1c160f 0%, #120e09 100%); }
.dp-go.danger .dp-go-fl { border-color: #7a2a24; background: var(--grain), linear-gradient(180deg, #1c0e0e 0%, #120808 100%); }
.dp-go-l { flex: 0 0 auto; padding: 0 6px 0 4px; font-size: 11px; font-weight: 800; letter-spacing: 0.1em; color: #a08a62; }
.dp-go-f { flex: 1 1 0; min-width: 0; min-height: 32px; padding: 0 4px; font-family: var(--font); font-size: 14px; font-weight: 800; letter-spacing: 0.08em; color: var(--ink-dim); background: rgba(8,6,9,0.6); border: 1px solid #33292a; border-radius: 2px; cursor: pointer; -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
.dp-go-f.sel { color: var(--accent-hi); border-color: #b8913e; background: linear-gradient(180deg, #3a2e1a, #241c10); box-shadow: 0 0 8px rgba(201,162,74,0.3); }
.dp-go.danger .dp-go-f.sel { color: #ffd0c4; border-color: #c25a48; background: linear-gradient(180deg, #3a1a16, #24100e); box-shadow: 0 0 8px rgba(194,90,72,0.3); }
.dp-go-f:active { filter: brightness(0.9); }

/* ===================== 戦果シート ===================== */
.rs-sheet .ui-sheet-title { font-size: 16px; }
.rs { text-align: left; }
.rs-gain { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 6px 0 4px; }
.rs-gain-c { padding: 8px 6px 6px; text-align: center; border: 1px solid #3a3029; border-radius: 3px; background: radial-gradient(90% 80% at 50% 0%, rgba(201,162,74,0.12), rgba(0,0,0,0) 70%), rgba(8,6,9,0.6); }
.rs-gain-n { display: flex; align-items: center; justify-content: center; font-size: 24px; font-weight: 800; font-variant-numeric: tabular-nums; text-shadow: 0 0 12px rgba(201,162,74,0.35), 0 2px 0 #000; }
.rs-gain-c.c-gold .rs-gain-n { color: #f3d58b; } .rs-gain-c.c-soul .rs-gain-n { color: #b4e6ff; }
.rs-fled { margin: 0 0 4px; text-align: center; font-size: 12px; color: #cfd8e6; opacity: 0.8; }
.rs-gain.has-red { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rs-gain-c.c-red .rs-gain-n { color: #ef7777; }
.rs-gain-l { font-size: 10.5px; letter-spacing: 0.2em; color: var(--ink-dim); }
.rs-list { display: grid; gap: 6px; margin: 8px 0 2px; }
.rs-line { display: flex; align-items: flex-start; gap: 10px; width: 100%; padding: 8px 10px; min-height: 44px; font-family: var(--font); color: var(--ink); text-align: left; background: rgba(8,6,9,0.55); border: 1px solid #2c2427; border-radius: 3px; }
button.rs-line { cursor: pointer; touch-action: manipulation; }
.rs-line-t { flex: 1 1 auto; min-width: 0; font-size: 13.5px; line-height: 1.45; }
.rs-line-t b { font-weight: 800; }
.rs-lvnum { color: var(--accent-hi); font-weight: 800; }
.rs-subtag { display: inline-block; margin-left: 6px; padding: 0 5px; font-size: 10.5px; font-weight: 700; letter-spacing: 0.05em; line-height: 1.6; vertical-align: 1px; color: #c8b6e8; border: 1px solid #5a4a78; border-radius: 2px; background: rgba(90,74,120,0.22); }
.rs-lv-sub .rs-lvnum { color: #c8b6e8; }
/* レベルアップの予告 (閉じた後に祝祭カード) */
.rs-lvup { border-color: #8a6d2e; background: linear-gradient(90deg, rgba(255,215,122,0.14), rgba(8,6,9,0.55) 70%); }
.rs-lvup b { color: #ffd77a; text-shadow: 0 0 10px rgba(255,215,122,0.6); }
.rs-sub { font-size: 11.5px; color: var(--ink-dim); line-height: 1.5; margin-top: 2px; }
.rs-sub.up { color: var(--up); font-weight: 700; }
.rs-ic { flex: 0 0 auto; width: 9px; height: 9px; margin-top: 6px; transform: rotate(45deg); }
.rs-ic.up { background: linear-gradient(135deg, #b9f0b0, #3c9a5a); box-shadow: 0 0 8px rgba(110,220,140,0.7); }
.rs-ic.up.sub { background: linear-gradient(135deg, #e0d0ff, #6a52a8); box-shadow: 0 0 8px rgba(170,140,240,0.7); }
.rs-ic.sk { background: linear-gradient(135deg, #bfe0ff, #3c78c8); box-shadow: 0 0 8px rgba(110,170,255,0.7); }
.rs-chev { flex: 0 0 auto; align-self: center; color: #8a6d2e; font-size: 16px; font-weight: 800; }
.rs-soul { border-color: color-mix(in srgb, var(--glow, #8a6d2e) 45%, #2c2427); }
.rs-soul.rare { box-shadow: 0 0 12px color-mix(in srgb, var(--glow, #c9a24a) 35%, transparent); }
.rs-soul-ic canvas { width: 32px; height: 32px; image-rendering: pixelated; }
.rs-rar { font-size: 11px; color: var(--glow, #c9a24a); font-weight: 800; }
.rs-chest { margin: 10px 0 2px; padding: 10px; border: 1px solid #5a4838; border-radius: 3px; background: var(--grain), radial-gradient(90% 70% at 20% 0%, rgba(201,162,74,0.12), rgba(0,0,0,0) 70%), var(--plate); box-shadow: var(--plate-edge); }
.rs-chest-h { display: flex; align-items: center; gap: 12px; }
.rs-chest-art canvas { width: 48px; height: 48px; image-rendering: pixelated; filter: drop-shadow(0 0 8px rgba(243,213,139,0.35)); }
.rs-chest-n { font-size: 15px; font-weight: 800; color: var(--accent-hi); letter-spacing: 0.08em; }
.rs-chest-s { font-size: 11.5px; color: var(--ink-dim); }
.rs-chest-acts { display: grid; gap: 8px; margin-top: 10px; }
.rs-others { border: 1px solid #33292a; border-radius: 3px; }
.rs-others-s { min-height: 44px; display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 13px; font-weight: 700; color: #b2a68f; list-style: none; }
.rs-others-s::-webkit-details-marker { display: none; }
.rs-others-s::after { content: "▾"; margin-left: 6px; color: #8a6d2e; }
.rs-others[open] .rs-others-s::after { content: "▴"; }
.rs-others-l { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 6px; padding: 0 6px 6px; }
.rs-chest-out { display: grid; gap: 6px; margin-top: 8px; }
.rs-chest-out:empty { display: none; }
.rs-out { display: flex; align-items: center; gap: 8px; padding: 6px 10px; min-height: 36px; font-size: 13px; line-height: 1.45; border-radius: 3px; background: rgba(0,0,0,0.35); border: 1px solid #2c2427; color: #e6dbc2; }
.rs-out.t-good { color: #cfeec4; border-color: #3c6a30; }
.rs-out.t-bad { color: #ffc4b8; border-color: #7a2a24; }
.rs-out.t-info { color: #9a8e78; }
.rs-out.t-gold { color: #f3d58b; border-color: #6a5426; }
.rs-item .ui-tile { flex: 0 0 auto; }
.rs-item-t { min-width: 0; }
.rs-item-n { font-size: 14px; font-weight: 800; }
.rs-item.rar-sr, .rs-item.rar-lr { box-shadow: 0 0 14px color-mix(in srgb, var(--tile-edge, #ff9a2e) 30%, transparent); }
.rs-num { font-variant-numeric: tabular-nums; }
.rs-sheet.k-boss { --sheet-accent: #ffd84a; }
/* 全滅 */
.rs-note { margin: 8px 2px; font-size: 13px; line-height: 1.65; color: #d6cbb2; text-align: center; }
.rs-note.gold { color: #f3d58b; } .rs-note.dim { color: #8c7a5a; font-size: 12px; }
.rs-loss { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin: 4px 0 8px; }
.rs-loss-c { padding: 8px 4px; text-align: center; border: 1px solid #5a2420; border-radius: 3px; background: rgba(60,10,8,0.35); }
.rs-loss-n { display: flex; align-items: center; justify-content: center; font-size: 19px; font-weight: 800; color: #ffb0a4; font-variant-numeric: tabular-nums; }
.rs-loss-l { font-size: 10.5px; color: #c08a80; letter-spacing: 0.12em; }
.rs-keep { margin: 4px 2px 6px; font-size: 12.5px; line-height: 1.6; color: #b4e6ff; text-align: center; }
.rs-wipe-sheet .ui-art canvas.spr { filter: grayscale(0.5) drop-shadow(0 0 10px rgba(200,30,20,0.5)); }
.rs-clear .ui-sheet-title { font-size: 20px; color: #ffe9a8; letter-spacing: 0.1em; }

/* ===================== 帰還の報告 (広場の札) ===================== */
.rr-card {
  position: relative; margin: 8px 12px 12px; padding: 10px 12px 8px;
  background:
    var(--corner-tl) top 4px left 4px / 16px 16px no-repeat, var(--corner-tr) top 4px right 4px / 16px 16px no-repeat,
    var(--grain), radial-gradient(120% 60% at 50% 0%, rgba(201,162,74,0.12), rgba(0,0,0,0) 60%), linear-gradient(180deg, #1e181e 0%, #141015 60%, #0e0b0f 100%);
  border: 1px solid #8a6d2e; border-radius: 3px;
  box-shadow: 0 0 0 1px #000, 0 0 18px rgba(201,162,74,0.18), 0 8px 20px rgba(0,0,0,0.7);
  text-align: left; color: var(--ink);
}
.rr-card.t-bad { border-color: #7a2a24; box-shadow: 0 0 0 1px #000, 0 0 18px rgba(200,40,20,0.18), 0 8px 20px rgba(0,0,0,0.7); }
.rr-head { display: flex; align-items: flex-start; gap: 8px; }
.rr-head-t { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.rr-banner { font-size: 14px; font-weight: 800; letter-spacing: 0.24em; color: var(--accent-hi); }
.rr-card.t-bad .rr-banner { color: #ffb0a4; }
.rr-where { font-size: 12px; color: var(--ink-dim); letter-spacing: 0.06em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rr-x { flex: 0 0 auto; width: 44px; height: 44px; margin: -8px -8px 0 0; font-size: 20px; line-height: 1; color: #8c7a5a; background: none; border: 0; cursor: pointer; font-family: var(--font); }
.rr-haul { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; margin: 6px 0 2px; }
.rr-stat { display: inline-flex; align-items: center; gap: 2px; font-size: 13px; }
.rr-stat b { font-size: 17px; font-weight: 800; color: var(--accent-hi); font-variant-numeric: tabular-nums; }
.rr-stat small { font-size: 11.5px; color: var(--ink-dim); margin-left: 3px; }
.rr-special { display: flex; flex-wrap: wrap; gap: 4px 10px; margin: 2px 0; font-size: 12.5px; font-weight: 800; }
.rr-line { margin: 4px 0; font-size: 12.5px; line-height: 1.55; color: #d6cbb2; }
.rr-line.up { color: var(--up); } .rr-line.bad { color: #ffb0a4; } .rr-line.dim { color: #8c7a5a; }
.rr-dead { display: flex; align-items: baseline; gap: 4px; flex-wrap: wrap; }
.rr-cross { color: #e4554f; font-weight: 800; }
.rr-acts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 10px 0 4px; }
.rr-acts .ui-btn { min-height: 48px; padding: 6px 8px; font-size: 14px; gap: 6px; }
.rr-acts .ui-btn:only-child, .rr-acts .ui-btn.k-primary:first-child:nth-last-child(odd) { grid-column: 1 / -1; }
.rr-more { display: flex; align-items: center; justify-content: flex-end; gap: 4px; width: 100%; min-height: 44px; padding: 0 2px; font-family: var(--font); font-size: 12.5px; font-weight: 700; color: #b2a68f; background: none; border: 0; cursor: pointer; }
.rr-more-c { color: #8a6d2e; font-size: 16px; }
.rr-sheet .rr-card { margin: 4px 0 8px; }

/* ===================== 戦闘のコマンド板 (WP-D の足し) ===================== */
#combat-menu .cmd-main.has-quick { grid-template-columns: 1.45fr 1fr 1fr; }
#combat-menu .cmd-main .btn.cmd .cmd-s { max-width: 100%; }
#combat-menu .cmd-main.has-quick .btn.cmd { font-size: 15px; letter-spacing: 1px; padding: 6px 6px; gap: 5px; }
#combat-menu .cmd-main.has-quick .btn.cmd.primary { font-size: 17px; letter-spacing: 3px; }
#combat-menu .btn.cmd-quick { border-left: 3px solid var(--sp-col, #c9a24a); }
#combat-menu .btn.cmd-quick .cmd-ic { color: var(--sp-col, #c9a24a); }
#combat-menu .btn.cmd-quick .cmd-l { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
#combat-menu .btn.cmd-quick.locked { opacity: 0.45; filter: grayscale(0.6); }
:is(#combat-menu, .battle-skill-picker) .btn.spell.last { box-shadow: inset 0 0 0 1px rgba(201,162,74,0.45), 0 2px 0 #070507; }
#combat-menu .cmd-autorow { display: grid; grid-template-columns: minmax(0, 1fr) 104px; gap: 6px; }
#combat-menu .btn.cmd-keep { flex-direction: column; gap: 2px; min-height: 46px; padding: 4px; text-align: center; }
#combat-menu .btn.cmd-keep .cmd-t { align-items: center; }
#combat-menu .btn.cmd-keep .cmd-s { font-size: 10px; }

/* タブレット (タッチ端末で、スマホの縦画面の戦闘以外): 命令の6つを同じ大きさにそろえる (2026-11-15 ユーザー指定)。
   主の段・下の段とも3列・同じ高さ・同じ文字の大きさ。持ち替えがある時だけ下の段は4列になる。PC (pc-input) は別の配置 */
html:not(.pc-input) #app:not(.phone-combat) #combat-menu .cmd-main { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
html:not(.pc-input) #app:not(.phone-combat) #combat-menu .cmd-sub { gap: 6px; }
html:not(.pc-input) #app:not(.phone-combat) #combat-menu :is(.cmd-main, .cmd-sub) .btn.cmd {
  flex-direction: row; justify-content: center; gap: 6px; min-height: 52px; height: 52px; padding: 5px 6px;
  font-size: 15px; letter-spacing: 1px; text-align: left;
}
html:not(.pc-input) #app:not(.phone-combat) #combat-menu :is(.cmd-main, .cmd-sub) .cmd-ic { display: block; width: 20px; height: 20px; }
html:not(.pc-input) #app:not(.phone-combat) #combat-menu :is(.cmd-main, .cmd-sub) .cmd-t { align-items: flex-start; min-width: 0; }
html:not(.pc-input) #app:not(.phone-combat) #combat-menu :is(.cmd-main, .cmd-sub) .cmd-s { font-size: 9.5px; margin-top: 1px; }

@media (max-width: 370px) {
  .dk-l { font-size: 14px; letter-spacing: 0.06em; }
  .dk-btn { gap: 7px; padding: 4px 8px; }
  #hint.dg-dock.tight .dk-down .dk-l { font-size: 13px; }
  .dk-sl { font-size: 9.5px; }
  .dg-tally { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #combat-menu .cmd-main.has-quick .btn.cmd .cmd-ic { display: none; }
}
@media (max-width: 340px) {
  .dk-sl { font-size: 8.5px; }
  #hint.dg-dock.tight { gap: 3px; }
}
@media (prefers-reduced-motion: reduce) {
  .dk-down.k-primary { animation: none !important; }
  .dk-auto.on { animation: none !important; }
}
/* 戦果: 自動で進む時の残り時間 (ボタンの下端の細い金線) */
.ui-btn.rs-auto { overflow: hidden; }
.rs-auto-bar { position: absolute; left: 0; bottom: 0; height: 2px; width: 100%; background: linear-gradient(90deg, #8a6d2e, #f3d58b); box-shadow: 0 0 6px rgba(243,213,139,0.7); transform-origin: left center; animation: rs-countdown linear forwards; }
@keyframes rs-countdown { from { transform: scaleX(1); } to { transform: scaleX(0); } }
/* 戦闘中も手帳は開ける (閉じるまで戦闘は止まる。帰還・隊の編成はできない) */
/* 手帳: 2列の札・帰還の帯・2×2 のスイッチ (390×844 で巻かずに収まる) */
.dg-menu .ui-grab { height: 16px; }
.dg-menu .dg-floorhead.tap { min-height: 52px; padding: 4px 8px 6px; margin-bottom: 6px; }
.dg-menu .dg-fh-depth { font-size: 22px; }
.dg-fh-more { font-size: 18px; font-weight: 800; color: #8a6d2e; }
.dg-mgrid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 6px; }
.dg-mtile {
  display: flex; align-items: center; gap: 10px; min-width: 0; min-height: 60px; padding: 6px 10px; text-align: left;
  font-family: var(--font); color: var(--ink); cursor: pointer;
  background: var(--grain), var(--plate); border: 1px solid #33292a; border-radius: 3px; box-shadow: var(--plate-edge);
  touch-action: manipulation; transition: transform var(--t-tap) ease-out, filter var(--t-tap) ease-out;
}
.dg-mtile:active:not(:disabled) { transform: scale(0.98); filter: brightness(0.92); }
.dg-mtile.wide { width: 100%; margin-top: 6px; }
.dg-mtile.t-gold { border-color: #8a6d2e; box-shadow: var(--plate-edge), 0 0 12px rgba(201,162,74,0.18); }
.dg-mtile.t-red { border-color: #6e2c2a; }
.dg-mtile.t-red .dg-mtile-ic { stroke: #d4706a; }
.dg-mtile.off { opacity: 0.6; cursor: default; }
.dg-mtile-ic { flex: 0 0 auto; width: 22px; height: 22px; fill: none; stroke: #c9ae7c; stroke-width: 1.7; stroke-linejoin: round; stroke-linecap: round; }
.dg-mtile-t { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.dg-mtile-l { font-size: 14px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dg-mtile-s { font-size: 11px; color: var(--ink-dim); line-height: 1.35; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 600px) {
  .dg-menu .dg-mtile-l { white-space: normal; overflow: visible; overflow-wrap: anywhere; }
}

.dg-toggles.grid { grid-template-columns: 1fr 1fr; }
.dg-toggles.grid .dg-toggle { min-height: 60px; padding: 6px 8px 6px 10px; gap: 6px; }
.dg-toggles.grid .dg-toggle-l { font-size: 12.5px; }
.dg-toggles.grid .dg-toggle-s { font-size: 10.5px; }
.dg-toggles.grid .dg-switch { width: 40px; height: 24px; }
.dg-toggles.grid .dg-switch i { width: 16px; height: 16px; }
.dg-toggles.grid .dg-toggle.on .dg-switch i { transform: translateX(16px); }
.dg-menu .dg-sec { margin: 10px 2px 6px; }
/* 戦果: 1行に詰めた成長・技 */
.rs-sheet .ui-grab { height: 16px; }
.rs-line { align-items: center; min-height: 44px; padding: 6px 10px; }
.rs-line-t.one { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rs-delta { font-size: 11.5px; font-weight: 700; color: var(--up); }
.rs-delta.dim { color: var(--ink-dim); font-weight: 500; }
.rs-ic { margin-top: 0; }
.rs-gain-c { padding: 6px 6px 4px; }
.rs-gain-n { font-size: 22px; }
.dg-toggles.grid .dg-toggle-l { font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dg-toggles.grid .dg-toggle-s { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.dp-gate { min-height: 48px; }
.dp-issue { min-height: 46px; }
.dp-more { justify-content: center; min-height: 44px; color: #b2a68f; font-size: 13px; font-weight: 700; letter-spacing: 0.1em; }
.dp-more-c { color: #8a6d2e; margin-left: 6px; }
@media (max-height: 700px) {
  .rs-gain-n { font-size: 19px; }
  .rs-gain-c { padding: 4px; }
  .rs-chest { padding: 8px; }
  .rs-chest-art canvas { width: 40px; height: 40px; }
  .rs-sheet .ui-sheet-title { font-size: 15px; margin: 0; }
}
.rs-list, .rs-chest-out { grid-template-columns: minmax(0, 1fr); }
.rs-line, .rs-out { min-width: 0; }
.rs-item.tap { cursor: pointer; }
.rs-item .rs-item-t { flex: 1 1 auto; }
.rs-item .ui-btn.s-sm { flex: 0 0 auto; width: auto; min-width: 64px; }
/* 帰還の報告: 「詳細 ›」は見出しの右に (札の背を低く) */
.rr-head .rr-more { flex: 0 0 auto; width: auto; min-width: 56px; min-height: 44px; margin: -8px -2px 0 0; justify-content: center; }
.rr-acts { margin-bottom: 2px; }
.rr-card { padding-bottom: 10px; }

/* スキルの種別・属性の札 (戦闘のスキル一覧・早出しボタン) */
:is(#combat-menu, .battle-skill-picker) .sp-tags { margin-left: auto; }
:is(#combat-menu, .battle-skill-picker) .sp-tags .ui-tag { font-size: 9.5px; }
/* 技名・札・説明を別の段にし、2列の狭い札でも名前を読めるようにする。 */
:is(#combat-menu, .battle-skill-picker) .btn.spell-skill { height: max-content; min-width: 0; grid-auto-rows: max-content; }
:is(#combat-menu, .battle-skill-picker) .spell-skill .sp-top { align-items: flex-start; }
:is(#combat-menu, .battle-skill-picker) .spell-skill .sp-n { flex: 1 1 auto; min-width: 0; white-space: normal; overflow: visible; }
:is(#combat-menu, .battle-skill-picker) .sp-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 3px 6px; min-width: 0; }
:is(#combat-menu, .battle-skill-picker) .sp-meta .sp-tags { margin-left: 0; flex-shrink: 1; flex-wrap: wrap; white-space: normal; }

:is(#combat-menu, .battle-skill-picker) .cmd-s .sp-tags { margin-left: 4px; }
:is(#combat-menu, .battle-skill-picker) .cmd-s .sp-tags .ui-tag { font-size: 8.5px; }
/* 技の属性の有利・不利 (属性の明かされた敵に対して)。対象選択では「弱点」「耐性」 */
:is(#combat-menu, .battle-skill-picker) .sp-edges { display: inline-flex; gap: 2px; flex: 0 0 auto; }
:is(#combat-menu, .battle-skill-picker) .sp-edges.lead { margin-left: auto; }
:is(#combat-menu, .battle-skill-picker) .cmd-s .sp-edges { margin-left: 4px; vertical-align: middle; }
:is(#combat-menu, .battle-skill-picker) .sp-edge { display: inline-block; font-size: 8.5px; font-weight: 800; line-height: 1; padding: 2px; border-radius: 2px; letter-spacing: 0; }
:is(#combat-menu, .battle-skill-picker) .sp-edge.good { color: #b8f5c0; background: rgba(30,96,46,0.55); border: 1px solid #4fbf68; }
:is(#combat-menu, .battle-skill-picker) .sp-edge.bad { color: #ffc2bc; background: rgba(110,32,30,0.55); border: 1px solid #d0564c; }
:is(#combat-menu, .battle-skill-picker) .tgt-hp .sp-edge { margin-right: 4px; }
.dg-en-kills { margin: -2px 0 6px; font-size: 12.5px; color: #b2a68f; letter-spacing: 0.12em; font-variant-numeric: tabular-nums; }

/* ---- 迷宮の地図 (台帳): 新しく現れた迷宮・危うさの札・潜り始める階 ---- */
.dp-map .dp-layer-h { cursor: default; }
.dp-new { display: inline-block; margin-left: 6px; padding: 0 4px; font-size: 10px; font-weight: 800; line-height: 15px; color: #1a0d05; background: #f3d58b; border-radius: 2px; vertical-align: 2px; }
.dp-qmark { display: inline-block; margin-left: 6px; padding: 0 5px 0 4px; font-size: 10px; font-weight: 800; line-height: 13px; color: #ffe2b0; border: 1px solid #d0832e; background: rgba(150,72,14,0.55); border-radius: 2px; vertical-align: 2px; white-space: nowrap; }
.dp-qmark::before { content: "!"; display: inline-block; margin-right: 3px; padding: 0 3px; color: #1a0d05; background: #f0a640; border-radius: 1px; }
.dp-rmark { display: inline-block; margin-left: 6px; padding: 0 5px; font-size: 10px; font-weight: 800; line-height: 13px; color: #e6dcff; border: 1px solid #8a6fd0; background: rgba(70,44,140,0.55); border-radius: 2px; vertical-align: 2px; white-space: nowrap; }
.dp-gate-st.danger { color: #ffd2a0; border-color: #b0661c; background: rgba(140,70,10,0.32); }
.dp-gate-st.reckless { color: #ffc6bc; border-color: #c0281e; background: rgba(140,16,10,0.45); box-shadow: 0 0 8px rgba(220,40,20,0.35); }
.dp-sealed .dp-gate-c.dp-hint { white-space: normal; line-height: 1.35; color: #b5a888; }
/* 長い説明 (推奨Lv・師の手がかり…) で行が枠を押し広げないように (grid の既定 min-width: auto を外す) */
.dp-gates { grid-template-columns: minmax(0, 1fr); }
.dp-gate { box-sizing: border-box; min-width: 0; }
/* 階の情報: ここで果たせる依頼 (札の印は酒場と同じ qb-mark を小さく) */
.dg-sheet .ui-row .qb-mark { width: 32px; height: 32px; }
.dg-sheet .ui-row .qb-mark .ui-tile { width: 30px; height: 30px; }
.dg-sheet .ui-row .qb-mark-c { font-size: 16px; }

/* ===== 出撃シート (2026-10 改): 上半分 = 迷宮の顔 / 門の一覧は本文と一緒に巻く / 異変は門をくぐる欄へ ===== */
/* 顔を縮めた時にブラウザが巻き位置を戻して (スクロールアンカー) 伸び縮みを繰り返さないよう、アンカーは切る */
.dp-sheet .ui-sheet-body { overflow-anchor: none; }
.ui-sheet.dp-sheet.dp-full { height: calc(100vh - 28px); height: calc(100dvh - 28px); }
/* イラストから迷宮の掟までは本文を巻いても動かない (ユーザーの指示、2026-10)。本文の上の余白 (2px) ぶん上へずらして貼り付け、
   左右も本文の余白まで広げて下を巻く門の一覧が透けないようにする */
.dp-hero { position: sticky; top: -2px; z-index: 3; margin: -2px calc(-1 * var(--sp-4)) 8px; padding: 2px var(--sp-4) 8px; background: linear-gradient(180deg, #1a151a, #141015); border-bottom: 1px solid #2c2427; box-shadow: 0 8px 12px -6px rgba(0,0,0,0.85); }
.dp-after { margin: 0 0 8px; }
.dp-vista { position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: clamp(150px, 30vh, 270px); min-height: clamp(150px, 30dvh, 270px); margin: 0 calc(-1 * var(--sp-4)); overflow: hidden; background: #050407; border-top: 1px solid #241d22; border-bottom: 1px solid #2c2427; }
.dp-vista-cv { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 62%; image-rendering: pixelated; }
/* 名前・説明・記録の札はイラストの下側に重ねる (札は押せる) */
.dp-vista-cap { position: relative; z-index: 1; text-align: left; padding: 40px var(--sp-4) 8px; background: linear-gradient(180deg, rgba(8,6,9,0), rgba(8,6,9,0.62) 34%, rgba(8,6,9,0.88) 70%); }
.dp-vista-top { display: flex; align-items: flex-end; gap: 8px; }
.dp-hero-t { flex: 1 1 auto; min-width: 0; }
.dp-hero-s { margin-top: 1px; font-size: 11.5px; letter-spacing: 0.04em; color: #c8bca4; text-shadow: 0 1px 0 #000, 0 0 6px #000; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dp-hero-n { font-size: 20px; font-weight: 800; letter-spacing: 0.12em; line-height: 1.3; color: #f3e6c8; text-shadow: 0 1px 0 #000, 0 0 10px #000; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dp-vista-cap .dp-gate-st { flex: 0 0 auto; margin-bottom: 3px; background: rgba(8,6,9,0.7); }
.dp-vista-cap .dp-gate-st.perfect { background: linear-gradient(180deg, rgba(120,92,30,0.75), rgba(40,30,8,0.8)); }
.dp-hero-about { margin: 4px 0 6px; font-size: 12.5px; line-height: 1.55; color: #ddd0b2; text-shadow: 0 1px 0 #000, 0 0 6px #000; }
.dp-facts { display: flex; flex-wrap: wrap; gap: 5px 6px; }
.dp-fact { display: inline-flex; align-items: baseline; gap: 5px; padding: 3px 8px; font-size: 11px; line-height: 1.3; border: 1px solid #3a3029; border-radius: 2px; background: rgba(8,6,9,0.78); }
.dp-fact-l { color: #9a8e78; letter-spacing: 0.06em; }
.dp-fact-v { font-size: 12px; font-weight: 800; color: #f0e2c0; font-variant-numeric: tabular-nums; }
.dp-fact.full { border-color: #8a6d2e; }
.dp-fact.full .dp-fact-v { color: var(--accent-hi); }
.dp-fact.none .dp-fact-v { font-size: 11px; font-weight: 700; color: #7d7468; }
/* 押せる記録 (発見した魔物・固有クエスト → 詳細のポップアップ) */
.dp-fact.tap { font: inherit; font-size: 11px; color: inherit; text-align: left; cursor: pointer; border-color: #5a4630; -webkit-tap-highlight-color: transparent; }
.dp-fact.tap:active { filter: brightness(1.25); transform: scale(0.97); }
.dp-fact-c { align-self: center; margin-left: 1px; font-size: 13px; line-height: 1; color: var(--accent-hi); }
/* 門の一覧は本文と一緒に巻く (一覧だけを巻く入れ子のスクロールは iPad で本文が動かなくなるのでやめた ― ユーザーの指示、2026-10) */
.dp-gates { position: relative; --dp-row: 50px; border: 1px solid #2c2427; border-radius: 3px; background: rgba(8,6,9,0.45); }
/* 師の手がかり・依頼の説明は省略せず、折り返した分だけ門の高さを広げる。 */
.dp-gates .dp-gate { height: auto; min-height: var(--dp-row); flex: 0 0 auto; }
.dp-gates .dp-gate-c { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; line-height: 1.4; }
/* 章の区切り (第一章「師の灯」…) */
.dp-chap { display: flex; align-items: baseline; gap: 2px; padding: 7px 12px 5px; text-align: left; background: linear-gradient(90deg, rgba(201,162,74,0.16), rgba(201,162,74,0) 70%); border-top: 1px solid #3a2f22; border-bottom: 1px solid #241d1a; }
.dp-gates > .dp-chap:first-child, .dp-gates .dp-chap + .dp-gate { border-top: 0; }
.dp-chap-n { font-size: 12.5px; font-weight: 800; letter-spacing: 0.14em; color: var(--accent-hi); text-shadow: 0 1px 0 #000; }
.dp-chap-t { font-size: 12px; letter-spacing: 0.06em; color: #b9a98a; }
.dp-gates .dp-sealed, .dp-gates .dp-abyss { margin: 0; border: 0; border-top: 1px solid #1e181c; border-radius: 0; }
.dp-gates .dp-sealed .dp-gate-c.dp-hint { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; white-space: normal; font-size: 11.5px; line-height: 1.35; }
.dp-gates .dp-sealed .dp-gate-ic { height: 30px; }
.dp-sheet .ui-sheet-foot { grid-template-columns: minmax(0, 1fr); }
.dp-ready { min-width: 0; }
.dp-ready .dp-party { flex-wrap: wrap; margin-bottom: 0; }
.dp-ready .ui-port { flex: 1 1 0; min-width: 0; max-width: 48px; }
.dp-ready .ui-port canvas { max-width: 100%; height: auto; }
.dp-ready .dp-swap { min-width: 44px; padding: 0 4px; }
.dp-mut-sw { flex: 0 0 auto; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; min-width: 84px; min-height: 52px; padding: 4px 6px; font-family: var(--font); font-size: 10.5px; font-weight: 800; letter-spacing: 0.04em; color: #b2a68f; background: rgba(8,6,9,0.6); border: 1px solid #4d3f37; border-radius: 3px; cursor: pointer; touch-action: manipulation; }
.dp-mut-sw[aria-checked="true"] .dg-switch { background: linear-gradient(180deg, #3a2c14, #1f170b); border-color: #8a6d2e; }
.dp-mut-sw[aria-checked="true"] .dg-switch i { transform: translateX(20px); background: radial-gradient(circle at 40% 35%, #fff1c4, #c9a24a); box-shadow: 0 0 8px rgba(243,213,139,0.7), 0 1px 2px #000; }
/* 札の短い名 (狭い画面だけ) */
.dp-fact-ls { display: none; }
/* 迷宮の掟と異変を1列に並べる札 (ユーザーの指示、2026-10-11)。札には名だけを出し、押すと全文のポップアップ。
   異変の札の右端は「異変ごと潜る / 鎮まるのを待つ」の切り替え */
.dp-rules { display: flex; gap: 6px; margin-top: 8px; }
.dp-rule { flex: 1 1 0; min-width: 0; display: flex; align-items: center; gap: 6px; min-height: 40px; padding: 4px 10px; font-family: var(--font); color: inherit; text-align: left; border: 1px solid color-mix(in srgb, var(--mut, #8e6fd0) 55%, #000); border-radius: 3px; background: linear-gradient(180deg, color-mix(in srgb, var(--mut, #8e6fd0) 12%, transparent), rgba(0,0,0,0) 80%); }
button.dp-rule, .dp-rule-b { cursor: pointer; touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
button.dp-rule:active, .dp-rule-b:active { filter: brightness(1.25); }
.dp-rule-b { flex: 1 1 auto; min-width: 0; align-self: stretch; display: flex; align-items: center; gap: 6px; padding: 0; font: inherit; color: inherit; text-align: left; background: none; border: 0; }
.dp-rule-k { flex: 0 0 auto; font-size: 11.5px; font-weight: 800; letter-spacing: 0.14em; color: #b2a68f; }
.dp-rule-ks { display: none; }
.dp-rule-n { flex: 1 1 auto; min-width: 0; font-size: 14px; font-weight: 800; color: var(--mut, #d7b8ff); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dp-rule-c { flex: 0 0 auto; font-size: 14px; line-height: 1; color: var(--accent-hi); }
.dp-mutr { padding-right: 4px; }
.dp-mutr:not(.on) .dp-rule-b { opacity: 0.55; }
.dp-mutr .dp-mut-sw { flex-direction: row; gap: 6px; min-width: 0; min-height: 32px; padding: 3px 8px; }
.dp-mutr.on .dp-mut-sw { color: var(--mut, #d7b8ff); border-color: color-mix(in srgb, var(--mut, #8e6fd0) 60%, #000); }
/* 二つ並ぶ時は、切り替えの文字を外してつまみだけにする (文はポップアップと門をくぐる札に出る) */
.dp-rules.two .dp-mut-sw-l { display: none; }
.dp-rules.two .dp-mut-sw { padding: 3px 5px; }
/* 異変の札は切り替えのつまみの分だけ広く取る */
.dp-rules.two .dp-mutr { flex-grow: 1.35; }
/* 掟・異変の全文のポップアップ */
.dp-rule-l { text-align: left; }
.dp-rule-l.bad { color: #ffb0a4; } .dp-rule-l.good { color: #f3d58b; }
/* スマホ (幅560px以下) と低い画面: 固定した上部を詰めて、下の迷宮の一覧に高さを残す (ユーザーの指示、2026-10)
   - イラストを低く、説明は2行まで、記録の札は短い名で1行に
   - 掟・異変の札を低く */
@media (max-width: 560px), (max-height: 760px) {
  .dp-hero { padding-bottom: 6px; margin-bottom: 6px; }
  .dp-vista { min-height: clamp(104px, 19vh, 190px); min-height: clamp(104px, 19dvh, 190px); }
  .dp-vista-cap { padding: 22px var(--sp-4) 6px; }
  .dp-hero-n { font-size: 18px; }
  .dp-hero-about { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin: 2px 0 5px; font-size: 11.5px; line-height: 1.45; }
  .dp-facts { flex-wrap: nowrap; gap: 5px; }
  .dp-fact { flex: 0 1 auto; min-width: 0; padding: 3px 7px; white-space: nowrap; }
  .dp-fact-l.has-short .dp-fact-lf { display: none; }
  .dp-fact-l.has-short .dp-fact-ls { display: inline; }
  .dp-rules { margin-top: 5px; gap: 5px; }
  .dp-rule { min-height: 36px; padding: 3px 8px; gap: 5px; }
  .dp-mutr { padding-right: 3px; }
  .dp-rule-k { font-size: 10.5px; letter-spacing: 0.08em; }
  .dp-rule-n { font-size: 13px; }
  .dp-mutr .dp-mut-sw { min-height: 30px; padding: 2px 5px; font-size: 9.5px; gap: 4px; }
}
/* とても低い画面 (iPhone SE など): 説明の文は畳み、イラストをさらに低く */
@media (max-height: 700px) {
  .dp-hero-about { display: none; }
  .dp-vista { min-height: 92px; }
  .dp-vista-cap { padding-top: 18px; }
}
@media (max-width: 560px) {
  .dp-rules.two .dp-rule-kf { display: none; }
  .dp-rules.two .dp-rule-ks { display: inline; }
}
@media (max-width: 390px) {
  .dp-sheet .ui-sheet-foot .ui-btn.dp-cta { letter-spacing: 0.08em; font-size: 16px; }
}
/* 出撃前の確認: 修復・宿泊・出撃を縦に並べ、狭い画面でも操作できる。 */
.dp-woes .ui-sheet-foot { grid-template-columns: minmax(0, 1fr); max-height: 55vh; max-height: 55dvh; overflow-y: auto; overscroll-behavior: contain; }
.dp-woes .ui-sheet-title { color: #e9cf9a; }
.dp-woes .ui-sheet-line { text-align: left; }
.dp-woes .ui-btn { min-width: 0; }

/* 門衛の忠告と、弟子本人の魂の安定度 */
.dp-gatekeeper { position:relative; margin:0 0 12px; border:1px solid #487583; background:#101c24; }
.dp-gatekeeper img { display:block; width:100%; height:auto; image-rendering:pixelated; }
.dp-brief-sheet .dp-brief-l {
  width: 100%; max-width: 36em; margin: 0 auto 14px;
  text-align: left; font-size: clamp(13px, 1.6vw, 15px); line-height: 1.85;
  word-break: keep-all; overflow-wrap: break-word; line-break: strict;
  text-wrap: pretty;
}

/* ===== 無限迷宮 (src/ui/infinite.js): 入口の魂の3択・風だまり・回収人・灯番・結果 ===== */
.inf-sheet .ui-sheet-body { text-align: left; }
.inf-note { margin: 6px 0; font-size: 13px; line-height: 1.75; color: var(--ink); }
.inf-note.dim { color: var(--ink-dim); font-size: 12px; }
.inf-note.gold { color: var(--accent-hi); font-weight: 700; }
.inf-note.warn { color: #e8a080; font-size: 12px; }
.inf-h { margin: 12px 0 6px; font-size: 12px; font-weight: 800; letter-spacing: 0.2em; color: var(--accent); }
.inf-cur { margin: 4px 0 8px; font-size: 12px; color: var(--accent-hi); }
.inf-picked { display: grid; grid-template-columns: repeat(6, 1fr); gap: 4px; margin: 8px 0; }
.inf-pk { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 4px 2px; min-height: 52px;
  border: 1px solid var(--border); border-radius: 3px; background: rgba(20,16,24,0.6); }
.inf-pk.now { border-color: var(--accent); box-shadow: 0 0 6px rgba(201,162,74,0.35); }
.inf-pk.done { border-color: #54463d; }
.inf-pk-q { font-size: 18px; line-height: 30px; color: var(--accent-hi); }
.inf-pk-n { font-size: 10px; color: var(--ink-dim); white-space: nowrap; }
/* 品の行方 (売った品は残る・装備と持ち物は全滅で失う) */
.inf-rule { margin: 8px 0; padding: 8px 10px; border: 1px solid #5a4a30; border-radius: 3px; background: rgba(30,24,14,0.55); }
.inf-rule-h { font-size: 11px; font-weight: 800; letter-spacing: 0.2em; color: var(--accent); margin-bottom: 4px; }
.inf-rule-r { display: flex; align-items: flex-start; gap: 8px; margin: 4px 0; font-size: 12.5px; line-height: 1.6; color: var(--ink); }
.inf-rule-m { flex: 0 0 auto; min-width: 2.6em; padding: 1px 5px; border-radius: 2px; font-size: 11px; font-weight: 800; text-align: center; }
.inf-rule-r.keep .inf-rule-m { color: #0e1a0e; background: #7fd06a; }
.inf-rule-r.lose .inf-rule-m { color: #1a0e0e; background: #e8806a; }
.inf-rule-t b { color: var(--accent-hi); }
.inf-bust { display: inline-flex; flex: 0 0 auto; }
.inf-swap-row { display: flex; align-items: stretch; gap: 6px; margin: 6px 0; }
.inf-swap-row .ui-row { flex: 1 1 auto; min-width: 0; margin: 0; }
.inf-swap-row .ui-row-sub { white-space: normal; line-height: 1.45; }
.inf-swap-row.inf-sub-taken .ui-row { border-color: #71c4ed; background: linear-gradient(90deg, #1b3b50, #132430); box-shadow: inset 4px 0 0 #71c4ed; }
.inf-swap-row.inf-sub-taken .ui-row-sub { color: #a6d9f2; }
/* 灯番の魂比較: 増減は色と記号を併記し、狭い候補行では1列に収める。 */
.inf-stat-preview { display: block; margin-top: 8px; padding-top: 6px; border-top: 1px solid #52616b; text-align: left; }
.inf-stat-head { font-size: 11px; color: var(--ink-dim); margin: 3px 0 5px; }
.inf-stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr)); gap: 3px 12px; }
.inf-stat-cell { display: grid; grid-template-columns: 4em 1fr auto; align-items: baseline; gap: 5px; font-size: 12px; line-height: 1.5; font-variant-numeric: tabular-nums; }
.inf-stat-label { color: var(--ink-dim); white-space: nowrap; }
.inf-stat-values { color: var(--ink); white-space: nowrap; }
.inf-stat-delta { white-space: nowrap; }
.inf-stat-delta.up { color: #9de3a0; }
.inf-stat-delta.down { color: #ffaaa0; }
.inf-swap-b { flex: 0 0 auto; align-self: center; white-space: nowrap; }
.inf-bust canvas { image-rendering: pixelated; }
.inf-choice { display: flex; align-items: center; gap: 10px; width: 100%; margin: 6px 0; padding: 8px 10px; min-height: 64px;
  text-align: left; color: var(--ink); background: linear-gradient(180deg, #221b25, #17121b); border: 1px solid var(--border);
  border-left: 3px solid var(--glow, var(--accent)); border-radius: 3px; cursor: pointer; font: inherit; }
.inf-choice:active { transform: scale(0.985); filter: brightness(0.92); }
.inf-choice-t { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.inf-choice-n { font-size: 15px; font-weight: 800; }
.inf-choice-r { font-size: 11px; color: var(--ink-dim); letter-spacing: 0.1em; }
.inf-choice-s { font-size: 11.5px; color: var(--ink-dim); line-height: 1.5; }
.inf-codex { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.inf-vessel { display: flex; gap: 10px; align-items: flex-start; margin: 6px 0; padding: 8px; border: 1px solid var(--border); border-radius: 3px; background: rgba(20,16,24,0.6); }
.inf-vessel.dead { opacity: 0.6; }
.inf-vessel-t { flex: 1 1 auto; min-width: 0; }
.inf-vessel-n { font-size: 14px; font-weight: 800; }
.inf-vessel-hit { display: block; width: 100%; padding: 0; margin: 0; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; border-radius: 3px; }
.inf-vessel-hit:hover, .inf-vessel-hit:focus-visible { background: rgba(127,208,255,0.06); }
.inf-vessel-go { float: right; font-size: 11px; font-weight: 600; color: #7fd0ff; opacity: 0.85; }
.inf-vessel-s { font-size: 12px; color: var(--ink-dim); line-height: 1.6; }
.inf-vessel-a { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.inf-sub-box { margin: 6px 0 10px; }
.inf-sub-box .inf-swap-row { margin: 0; }
.inf-sub-box .inf-vessel-a { justify-content: flex-end; }
.inf-items { display: flex; flex-wrap: wrap; gap: 4px 10px; margin: 4px 0; font-size: 12.5px; }
.inf-item.rar-c { color: #e6e0d0; } .inf-item.rar-uc { color: #7fd06a; } .inf-item.rar-r { color: #6fa8ff; }
.inf-item.rar-sr { color: #f0a040; } .inf-item.rar-lr { color: #ff6060; }
.inf-afx-c { margin: 8px 0 12px; }
.inf-afx-opt { display: flex; flex-direction: column; gap: 2px; width: 100%; margin: 4px 0; padding: 8px 10px; text-align: left; font: inherit; color: var(--ink);
  background: rgba(20,16,24,0.6); border: 1px solid var(--border); border-radius: 3px; cursor: pointer; }
.inf-afx-opt.on { border-color: var(--accent); box-shadow: 0 0 6px rgba(201,162,74,0.35); background: rgba(60,46,20,0.45); }
.inf-afx-tag { font-size: 11px; color: var(--accent-hi); letter-spacing: 0.05em; }
.inf-afx-ln { font-size: 12.5px; line-height: 1.6; }
.wpc-srow.afx { box-shadow: inset 3px 0 0 #c9a227; }

/* 無限迷宮の称号 (見た目だけ) */
.dp-title { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; margin-top: 8px; }
.dp-title .dp-gate-s { font-size: 11px; opacity: .75; }
.inf-title { cursor: pointer; }
.inf-title.on { outline: 1px solid #c9a227; background: rgba(201, 162, 39, .08); }
.inf-title.dim { opacity: .5; cursor: default; }

/* 持ち物がいっぱいの時に捨てる品を選ぶ (ui/discard.js) */
.dc-in { display: flex; align-items: center; gap: 10px; padding: 8px; margin-bottom: 6px; border: 1px solid rgba(201, 162, 39, .35); border-radius: 4px; background: rgba(201, 162, 39, .06); }
.dc-in-t { min-width: 0; }
.dc-in-n { font-weight: bold; }
.dc-in-s { font-size: 11px; opacity: .7; }
.dc-note { font-size: 12px; line-height: 1.6; margin: 4px 0 8px; opacity: .85; }
.dc-note.dim { opacity: .6; }
.dc-in.tap { width: 100%; text-align: left; color: inherit; font: inherit; cursor: pointer; }
.dc-line { display: flex; align-items: stretch; gap: 8px; }
.dc-row { flex: 1 1 auto; min-width: 0; width: auto; text-align: left; }
.dc-drop { flex: 0 0 auto; align-self: center; min-width: 72px; }
/* 回収人の「売る」: 行を押すと品の詳細、右の札で売る */
.inf-sell-r { display: inline-flex; align-items: center; gap: 10px; }
.inf-sell-p { white-space: nowrap; }
.inf-sell-r .ui-btn { width: auto; min-width: 64px; }
.inf-held { color: var(--accent-hi); font-weight: 700; }
.inf-held.none { color: var(--ink-dim); font-weight: 400; }

/* 魂の記憶: 同じ器・同じ部位の前後を並べ、本文だけをスクロールする。 */
.ui-sheet.inf-sheet { min-width: 0; }
.inf-sheet .ui-row-title { white-space: normal; overflow-wrap: anywhere; }
.inf-sheet .ui-row-sub { line-height: 1.6; }
.inf-sheet .ui-sheet-foot .ui-btn { min-height: 44px; }
.inf-sheet .ui-sheet-foot { padding-bottom: max(14px,env(safe-area-inset-bottom)); }
.inf-pk { min-width: 0; }
.inf-pk-n { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.inf-sell-r { gap: 6px; }
.inf-vessel-a .ui-btn { min-height: 44px; }
.inf-vessels { display: grid; gap: 10px; }
.inf-vessels .inf-vessel { margin: 0; }
.ui-sheet.inf-memory-sheet { max-width: 1040px; }
.inf-memory-sheet .ui-sheet-body { overflow-x: hidden; }
.inf-memory-destination { margin: 4px 0 8px; color: #b8a9e7; font-size: 13px; font-weight: 700; }
.inf-memory-help { margin: 12px 0 4px; padding: 4px 10px; border: 1px solid #413449; border-radius: 5px; background: #18131c; }
.inf-memory-help summary { min-height: 44px; display: list-item; align-content: center; cursor: pointer; font-size: 12px; color: #d4c5e8; }
.inf-memory-help summary:focus-visible { outline: 2px solid #c9a24a; outline-offset: 3px; }
.inf-memory-party, .inf-memory-list { display: grid; gap: 12px; margin: 12px 0; align-items: start; }
.inf-memory-list .ui-row { margin: 0; }
.inf-memory-member { min-width: 0; padding: 12px; margin: 12px 0; border: 1px solid #4a3a50; border-radius: 6px; background: linear-gradient(150deg, #201923, #151018); }
.inf-memory-party .inf-memory-member { margin: 0; }
.inf-memory-member-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.inf-memory-member-head > div { min-width: 0; }
.inf-memory-face { display: inline-flex; align-items: center; flex: 0 0 auto; }
.inf-memory-name { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0 0 10px; font-size: 15px; line-height: 1.5; color: #eee0c7; overflow-wrap: anywhere; }
.inf-memory-member-head .inf-memory-name { margin-bottom: 3px; }
.inf-memory-status { flex: 0 0 auto; font-size: 11px; font-weight: 500; color: #b8a9e7; }
.inf-memory-small, .inf-memory-affix { margin-top: 4px; font-size: 12px; line-height: 1.7; color: #c5b7d0; }
.inf-memory-affix { color: #dbc582; }
.inf-memory-muted { color: #a69aa9; font-size: 12px; }
.inf-memory-label { font-size: 12px; color: #c7bba7; line-height: 1.6; }
.inf-memory-saved-gear { display: grid; grid-template-columns: 58px minmax(0,1fr); gap: 8px; margin: 10px 0; }
.inf-memory-equipment { margin: 10px 0; border-top: 1px solid #413348; }
.inf-memory-equipment summary { min-height: 44px; align-content: center; cursor: pointer; font-size: 12px; color: #dbc582; }
.inf-memory-equipment summary:focus-visible { outline: 2px solid #c9a24a; outline-offset: 2px; }
.inf-memory-summary { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; margin: 12px 0 8px; }
.inf-memory-summary > div { display: flex; flex-direction: column; gap: 2px; align-items: center; padding: 9px 4px; border: 1px solid #554263; background: #251b2c; border-radius: 5px; }
.inf-memory-summary strong { font-size: 24px; color: #ddcbfa; line-height: 1.2; font-variant-numeric: tabular-nums; }
.inf-memory-summary span { font-size: 11px; color: #d5c6de; text-align: center; }
.inf-memory-toolbar { position: sticky; top: -2px; z-index: 2; display: flex; flex-direction: column; gap: 6px; padding: 6px 0; background: #18121c; box-shadow: 0 5px 8px #18121c; }
.inf-memory-filter { width: 100%; }
.inf-memory-filter .ui-btn { width: auto; padding: 8px; letter-spacing: .04em; }
.inf-memory-legend { text-align: center; font-size: 11px; color: #bbaaC8; }
.inf-memory-group { margin: 12px 0 0; }
.inf-memory-group-title { font-size: 12px; color: #b8a9e7; margin: 0; padding: 6px 0; }
.inf-memory-row { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border-top: 1px solid #3c3042; }
.inf-memory-row > .inf-memory-label { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; gap: 6px; padding: 8px 6px 4px; font-weight: 700; }
.inf-memory-value { min-width: 0; padding: 6px; line-height: 1.6; font-size: 13px; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.inf-memory-value.after { border-left: 1px solid #413348; background: #281e31; }
.inf-memory-cell-label { display: block; margin-bottom: 3px; font-size: 10px; color: #aa9eb5; }
.inf-memory-value-text { display: block; }
.inf-memory-value-title { font-size: 13px; font-weight: 700; color: #e6d8ef; }
.inf-memory-job { display: flex; align-items: center; gap: 6px; min-width: 0; flex-wrap: wrap; }
.inf-memory-job > span:last-child { flex: 1 1 70px; }
.inf-memory-delta { display: inline-block; flex: 0 0 auto; padding: 1px 6px; border-radius: 3px; background: #382941; color: #d3bdf0; font-size: 11px; font-weight: 700; }
.inf-memory-delta.up { color: #a8e0b0; background: #233b2c; }
.inf-memory-delta.down { color: #ffc1ac; background: #492b27; }
.inf-memory-comparison:not(.show-all) .same { display: none; }
.inf-memory-gear { min-width: 0; }
.inf-memory-item.ui-btn { display: flex; align-items: flex-start; justify-content: flex-start; gap: 6px; min-height: 44px; padding: 6px 0; width: 100%; text-align: left; font-size: 12px; letter-spacing: 0; }
.inf-memory-item .ui-btn-l { min-width: 0; white-space: normal; overflow-wrap: anywhere; line-height: 1.6; text-decoration: underline; text-underline-offset: 3px; }
.inf-memory-item > :first-child:not(.ui-btn-l) { flex: 0 0 28px; }
.inf-memory-item:focus-visible { outline: 2px solid #e0bc65; outline-offset: 2px; }
@media (min-width: 600px) {
  .ui-sheet.inf-sheet { max-width: 820px; width: calc(100% - 32px); max-height: calc(100dvh - 32px); margin-bottom: 16px; border-radius: 8px; }
  .ui-sheet.inf-memory-sheet { max-width: 1040px; }
  .inf-memory-party, .inf-memory-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .inf-vessels { grid-template-columns: repeat(2,minmax(0,1fr)); align-items: start; }
  .inf-memory-sheet .ui-sheet-foot { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .inf-memory-sheet .ui-sheet-foot > :only-child { grid-column: 1 / -1; }
  .inf-memory-row { grid-template-columns: 120px repeat(2,minmax(0,1fr)); }
  .inf-memory-row > .inf-memory-label { grid-column: auto; padding: 10px 6px; flex-direction: column; align-items: flex-start; justify-content: center; }
  .inf-memory-value { padding: 10px 12px; }
  .inf-memory-name { font-size: 17px; }
  .inf-memory-filter { max-width: 280px; }
  .inf-memory-toolbar { flex-direction: row; align-items: center; justify-content: space-between; }
  .inf-memory-summary > div { flex-direction: row; justify-content: center; gap: 10px; }
  .inf-memory-cell-label { font-size: 11px; }
}
@media (max-width: 359px) {
  .inf-memory-member { padding: 8px; }
  .inf-memory-value { padding: 5px; }
  .inf-memory-name { font-size: 13px; }
  .inf-memory-sheet .ui-sheet-body, .inf-memory-sheet .ui-sheet-foot { padding-left: 10px; padding-right: 10px; }
  .inf-sell-r { flex-direction: column; gap: 2px; }
}
@media (max-height: 600px) {
  .ui-sheet.inf-sheet { max-height: calc(100dvh - 12px); }
  .inf-sheet .ui-sheet-foot { gap: 4px; padding-top: 6px; padding-bottom: max(6px,env(safe-area-inset-bottom)); }
  .inf-memory-sheet .ui-sheet-foot .ui-btn { min-height: 44px; padding-top: 6px; padding-bottom: 6px; }
}

/* 技の付与成功率。長い名前や複合技も札の内側で折り返す。 */
.sp-status-rates { display: flex; flex-direction: column; gap: 2px; min-width: 0; max-width: 100%; font-size: 10px; line-height: 1.4; color: #c5b5db; white-space: normal; overflow-wrap: anywhere; }
.sp-status-label { color: #a99c87; font-size: 9px; }
:is(#combat-menu, .battle-skill-picker) .tgt > .sp-status-rates { grid-column: 1 / -1; }
.ui-skill .sp-status-rates { margin-top: 12px; font-size: 12px; }

/* スマホの技選択は画面の約8割を使い、見出しと戻るを残して一覧だけを巻く。 */
.battle-skill-picker.ui-sheet { height: 78vh; height: 78dvh; max-height: 80vh; max-height: 80dvh; }
.battle-skill-picker .ui-sheet-banner { white-space: normal; letter-spacing: 0.03em; line-height: 1.5; }
.battle-skill-picker .ui-sheet-body { min-height: 0; text-align: left; }
:is(#combat-menu, .battle-skill-picker).battle-skill-picker .target-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; overflow: visible; }
:is(#combat-menu, .battle-skill-picker).battle-skill-picker .btn.spell { min-height: 56px; width: 100%; padding: 8px 10px; font-size: 14px; gap: 4px; }
.battle-skill-picker .btn.spell.locked { opacity: 0.5; }
.battle-skill-picker .ui-sheet-foot { flex: 0 0 auto; }

/* 人業の様子: 正確な数値は省略せず、狭い画面では項目名と分けて読む。 */
.dg-peek .dg-peek-bv { min-width: 0; display: flex; flex-wrap: wrap; justify-content: flex-end; }
.dg-peek .dg-peek-bv > span { min-width: 0; overflow-wrap: anywhere; }
.dg-peek .dg-stat, .dg-peek .dg-num-h, .dg-peek .dg-stat-v,
.dg-peek .dg-chip, .dg-peek .dg-skill-n, .dg-peek .dg-skill-mp { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
.dg-peek .dg-chip { flex-wrap: wrap; white-space: normal; }
@media (max-width: 600px) {
  .dg-peek .dg-peek-top { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 4px 12px; }
  .dg-peek .dg-peek-top > .ui-port { grid-row: 1 / span 2; align-self: center; }
  .dg-peek .dg-peek-tx { display: contents; }
  .dg-peek .dg-peek-n, .dg-peek .dg-peek-c { grid-column: 2; min-width: 0; overflow-wrap: anywhere; }
  .dg-peek .dg-peek-bar { grid-column: 1 / -1; grid-template-columns: 28px minmax(0, 1fr); gap: 4px 8px; margin-top: 6px; }
  .dg-peek .dg-peek-bl { grid-column: 1; grid-row: 1; }
  .dg-peek .dg-peek-bv { grid-column: 2; grid-row: 1; }
  .dg-peek .dg-peek-bar > .ui-bar { grid-column: 1 / -1; grid-row: 2; width: 100%; }
  .dg-peek .dg-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .dg-peek .dg-stat, .dg-peek .dg-num-h { flex-direction: column; align-items: stretch; gap: 4px; }
  .dg-peek .dg-stat { padding: 8px 10px; }
  .dg-peek .dg-stat-v { text-align: right; line-height: 1.4; }
  .dg-peek .dg-stat-b { display: block; margin: 3px 0 0; line-height: 1.4; }
  .dg-peek .dg-num-s { margin-top: 3px; }
  .dg-peek .dg-skill { min-height: 44px; }
}

/* 戦闘の内訳: 数値の幅を確保し、狭い画面では項目を次の行へ送る。 */
.bp { --bp-damage:#f0c671; --bp-taken:#f1948b; --bp-healing:#93d7b3; margin:14px 0; text-align:left; }
.bp-heading { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:10px; }
.bp-heading h3 { margin:0; color:var(--gold,#d9bd80); font-size:16px; letter-spacing:.08em; }
.bp-rounds,.bp-job { font-size:11px; color:#b5ada1; }
.bp-member { padding:12px; margin:0 0 8px; border:1px solid #ae91502e; border-radius:10px; background:linear-gradient(110deg,#c9a24a0c,#0002); min-width:0; }
.bp-who { display:flex; align-items:center; gap:10px; min-width:0; margin-bottom:10px; }
.bp-index { color:#ab9571; font:12px monospace; flex:none; }
.bp-identity { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 10px; min-width:0; }
.bp-name { font-size:14px; color:#f1e8d8; overflow-wrap:anywhere; min-width:0; }
.bp-metrics { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr)); gap:12px; min-width:0; }
.bp-metric { min-width:0; color:var(--bp-damage); }
.bp-taken { color:var(--bp-taken); } .bp-healing { color:var(--bp-healing); }
.bp-label { display:block; font-size:11px; line-height:1.5; color:#c3b9a9; }
.bp-number { display:block; font-size:20px; font-variant-numeric:tabular-nums; line-height:1.6; white-space:nowrap; overflow-wrap:normal; }
.bp-number.small { font-size:14px; }
.bp-track { height:4px; overflow:hidden; border-radius:3px; background:#ffffff0d; }
.bp-track i { display:block; height:100%; border-radius:inherit; background:currentColor; }
.bp-note,.bp-partial { font-size:11px; line-height:1.8; color:#b5ada1; margin:10px 2px 0; }
.bp-partial { color:#ecc984; }
@media (min-width:700px) {
  .rs-sheet.has-performance { max-width:800px; }
  .bp-member { display:grid; grid-template-columns:minmax(130px,1fr) minmax(0,2fr); align-items:center; gap:16px; padding:14px 16px; }
  .bp-who { margin:0; } .bp-identity { display:block; } .bp-job { display:block; margin-top:4px; }
  .bp-number { font-size:23px; }
}
@media (max-width:359px) {
  .bp-member { padding:10px; } .bp-metrics { gap:8px; } .bp-number { font-size:17px; } .bp-number.small { font-size:12px; }
}

/* 戦闘の内訳は初期状態を閉じ、見出しから必要な時だけ開く。 */
.bp > summary { cursor:pointer; list-style:none; min-height:44px; align-items:center; }
.bp > summary::-webkit-details-marker { display:none; }
.bp > summary::before { content:"▸"; color:var(--gold,#d9bd80); }
.bp[open] > summary::before { content:"▾"; }
.bp > summary h3 { flex:1; }
.bp > summary:focus-visible { outline:2px solid var(--gold,#d9bd80); outline-offset:3px; }
.bp:not([open]) > summary { margin-bottom:0; }

/* 回収人の鍛え直し・武魂は商会と同じ装備欄を内側でスクロールする。 */
.ui-sheet.inf-trader-crafting { height: calc(100dvh - 24px); max-height: calc(100dvh - 24px); }
.inf-trader-crafting .ui-sheet-body { display: flex; flex-direction: column; gap: 4px; }
.inf-trader-crafting .ui-sheet-body > * { flex-shrink: 0; }
.inf-trader-crafting .ui-sheet-body > .wpc-shop { flex: 1 1 auto; min-height: 160px; overflow: hidden; }
.inf-trader-crafting .bk-panel { flex: 1 1 auto; }
.inf-trader-crafting .bk-equipment { flex: 1 1 auto; min-height: 80px; }

/* 記録欄と全文履歴は同じ配色と行構造を使う。色に加えて文字の印を残す。 */
:root { --log-party: #97dc9f; --log-enemy: #ff9b92; --log-info: #b8ad9a; --log-reward: #edd19a; }
:is(#log, .dg-logfull) .log-line { overflow-wrap: anywhere; }
:is(#log, .dg-logfull) .log-line.l-sys { color: var(--log-info); }
:is(#log, .dg-logfull) .log-line:is(.l-hit, .l-heal) { color: var(--log-party); }
:is(#log, .dg-logfull) .log-line.l-dmg { color: var(--log-enemy); }
:is(#log, .dg-logfull) .log-line.l-rar-r { color: #4fa6ff; font-weight: 700; }
:is(#log, .dg-logfull) .log-line.l-rar-sr { color: #ff9a2e; font-weight: 700; }
:is(#log, .dg-logfull) .log-line.l-rar-lr { color: #ff3b3b; font-weight: 800; }
:is(#log, .dg-logfull) .log-line.l-win { color: var(--log-reward); }
:is(#log, .dg-logfull) .log-line.log-party { color: var(--log-party); }
:is(#log, .dg-logfull) .log-line.log-enemy { color: var(--log-enemy); }
:is(#log, .dg-logfull) .log-start { border-top: 1px solid #61554360; padding-top: 3px; margin-top: 3px; }
:is(#log, .dg-logfull) .log-follow { padding-left: 8px; border-left: 2px solid currentColor; }
.log-badge { display: inline; font-size: .85em; font-weight: 700; margin-right: .45em; white-space: nowrap; }
.log-badge::before { content: "【"; } .log-badge::after { content: "】"; }
.log-value { font-weight: 800; }
.log-note, .log-source { opacity: .8; font-size: .92em; }
:is(#log, .dg-logfull) .log-important { font-weight: 700; background: #b0a08012; box-shadow: inset 2px 0 currentColor; padding-left: 5px; }
:is(#log, .dg-logfull) .log-divider { color: var(--log-info); text-align: center; border-block: 1px solid #61554380; padding: 3px 0; margin: 4px 0; font-weight: 700; }

.inf-buyback-search { width: 100%; box-sizing: border-box; margin: 6px 0 10px; padding: 10px; color: var(--ink); background: var(--bg); border: 1px solid var(--line); border-radius: 4px; font: inherit; }