/* 説明の帯は出さない（10-18: 対戦の決まりは戦いの準備の「ルール・ほうしゅう」へ・js/pve-ui.js）。ランクの札を差し込む目印としてだけ残す（js/ranked-ui.js） */
#s-versus .vs-guide { display: none; }
#s-versus .bar { padding: 0 12px; justify-content: flex-start; gap: 20px; }
.pve-tabs { display: flex; gap: 8px; padding: 5px 12px 10px; }
.pve-tabs .btn { flex: 1; font-size: 14px; padding: 8px 3px; }
.pve-tabs .selected { border-color: #ffd767; box-shadow: 0 0 0 2px #ffd76766; }
#s-versus #vs-levels { display: flex; flex-direction: column; gap: 14px; margin: 2px 0; padding: 5px 12px 18px; flex: 1; min-height: 0; overflow-y: auto; touch-action: pan-y; }
#vs-levels > *, .pve-level { flex-shrink: 0; }
#vs-levels .btn { width: 100%; padding: 9px 6px; font-size: 16px; }
#vs-levels small { font-size: 11px; line-height: 1.5; margin-top: 3px; display: block; white-space: normal; }
.pve-titles { color: #ffda78; font-size: 12px; line-height: 1.7; }
/* 非操作中もカード帯は不透明。城壁が透ける原因だった親opacityを外す。 */
.versus .vs-inactive { opacity: 1; }
.versus .vs-inactive .card { filter: brightness(.65) saturate(.6); }
.versus .strip { background: #0d1530; }
.versus .vs-hud { font-size: 11px; padding: 4px 7px; row-gap: 2px; line-height: 1.2; }
.versus .vs-hud .vs-style { grid-column: 1 / -1; color: #c9def5; font-size: 11px; line-height: 1.2; }
.versus .vs-hud b { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.versus .vs-red:has(.ranked-thinking) { display: flex; gap: 4px; }
.versus .vs-red:has(.ranked-thinking) > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.ranked-thinking { flex-shrink: 0; font-size: 10px; color: #ffcfaf; }
/* 観戦タブが増えて3つ並ぶので、狭い画面では文字を少し小さくして1行に収める */
.pve-tabs .btn { min-width: 0; white-space: nowrap; font-size: clamp(12px, 3.7vw, 14px); letter-spacing: -.02em; }
/* AI戦の段（10-18）: ステージ選択の札（.stage-card・style.css）をそのまま使う。段の名前＝大きな名前、小札＝相手の作戦の一言、右に相手3人の立ち絵。
   最後の「最強」は今の最強の系譜（js/strongest-direct.js）。帯の下は問い1行（.upper-stage-tip）だけ。 */
.stage-card.vs-card::before { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(90deg, #000c 0, #0007 38%, #0000 72%); }
.stage-card.vs-card .rvs { position: absolute; right: 4px; bottom: 0; height: 62%; z-index: 1; display: flex; align-items: flex-end; pointer-events: none; }
.stage-card.vs-card .rvs .rv { height: 100%; width: auto; margin-left: -9%; filter: drop-shadow(0 3px 3px #000b); }
.stage-card.vs-card .rvs .rv:nth-child(2) { height: 108%; }
.stage-card.vs-card .sname { font-weight: bold; letter-spacing: .04em; }
.stage-card.vs-card .ssub { max-width: 62%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stage-card.vs-card:disabled { filter: grayscale(.8) brightness(.7); cursor: default; }
.pve-level.stage-wrap { display: flex; flex-direction: column; gap: 4px; flex: none; }
.vs-ask { min-height: 18px; }
.pve-strongest .stage-card.vs-card .ssub { max-width: 58%; }
/* 戦いの準備の「ルール・ほうしゅう」: 画面の下に固定していた規則の帯の代わり（対戦の決まり・相手・報酬） */
.battle-content > .vs-info { display: none; }
.versus .vs-info { position: absolute; left: 50%; transform: translateX(-50%); top: calc(44% - 38px); z-index: 6; height: 32px; padding: 0 14px; font-size: 12px; letter-spacing: 0; white-space: nowrap; } /* 戦場の真ん中（相手の陣と案内の文のあいだ・マスのない所）に置く */
.versus.vsinfo-on .vs-info { display: block; }
.modal .win .vs-rule { font-size: 11px; opacity: .85; }
.modal .win h3 + p { margin-top: 4px; }
/* ランクの札: 中断中は「降参して編成からやり直す」を札の下に（再開より目立たせず・40px以上で押せる・10-18） */
.ranked-card .ranked-giveup { display: block; width: 100%; min-height: 44px; margin-top: 4px; padding: 6px 10px; border: 1px solid #b86a6a; border-radius: 8px; background: #2a1420cc; color: #ffc9c9; font: inherit; font-size: 12px; cursor: pointer; }
.ranked-card.has-active .ranked-more { bottom: 52px; }
/* おまかせを札の下から1回で（10-18）。くわしくは札の中に残すので、下の行の高さ分だけ上へ */
.ranked-card .ranked-auto { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 44px; margin-top: 4px; padding: 6px 10px; border: 1px solid #e7c979; border-radius: 8px; background: linear-gradient(#2c2a52, #1b1a3a); color: #ffe5a2; font: inherit; font-size: 14px; font-weight: bold; cursor: pointer; }
.ranked-card .ranked-auto small { font-size: 11px; font-weight: normal; color: #d6cfa8; }
.ranked-card .ranked-auto:disabled { opacity: .45; cursor: default; }
.ranked-card .ranked-more { bottom: 52px; }
.ranked-card.has-active .ranked-more { bottom: 100px; }
.ranked-card .ranked-auto { white-space: nowrap; }
@media (max-width: 359px) { .ranked-card .ranked-auto small { display: none; } }
/* 3つのタブ: 選んだタブは金色ではっきり・ランクの報酬が残っているときは赤い点（10-18） */
.pve-tabs .btn.selected { background: linear-gradient(#ffd75e, #e09a1c); color: #3a2200; }
.pve-tabs .btn.has-reward { position: relative; }
.pve-tabs .btn.has-reward::after { content: ''; position: absolute; top: 4px; right: 6px; width: 9px; height: 9px; border-radius: 50%; background: #ff4d4d; box-shadow: 0 0 0 2px #fff; }
#vs-levels .ranked-card { margin: 0 0 8px; }