/* v4 (pokeka_prototype_v4.html) の最終レイアウトを踏襲した対戦UI */
@import url('https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New:wght@400;700;900&family=JetBrains+Mono:wght@400;600&display=swap');
:root{
  --bg:#12141c; --panel:#1b1f2c; --panel-alt:#232840; --panel-light:#2b3252; --line:#3a4368;
  --gold:#e8b64c; --teal:#49c2b1; --danger:#f0707a; --text:#eef0f5; --dim:#aeb4d2; --dim-strong:#7d84a3;
  --cpu:#a58bfa;
}
*{box-sizing:border-box;}
body{margin:0;}
#pk-root{
  font-family:'Zen Kaku Gothic New','Hiragino Sans',sans-serif;
  background:radial-gradient(circle at 20% -10%, #1c2140 0%, var(--bg) 55%);
  color:var(--text); min-height:100vh; padding:16px; display:flex; flex-direction:column; gap:12px;
}
.pk-mono{font-family:'JetBrains Mono',monospace;}

/* ロビー */
.pk-lobby{max-width:520px; margin:8vh auto 0; display:flex; flex-direction:column; gap:16px;}
.pk-lobby h1{font-size:18px; color:var(--gold); letter-spacing:.04em;}
.pk-lobby-box{background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:20px; display:flex; flex-direction:column; gap:14px;}
.pk-lobby-box label{font-size:13px; display:flex; gap:10px; align-items:center;}
.pk-lobby-box input{background:var(--panel-alt); color:var(--text); border:1px solid var(--line); border-radius:8px; padding:8px 10px; font-size:14px;}
#lobby-code{width:7em; font-family:'JetBrains Mono',monospace;}
.pk-mode-choice{display:flex; gap:16px; font-size:13px;}
.pk-mode-choice label{display:flex; gap:6px; align-items:center; cursor:pointer;}
.pk-lobby-actions{display:flex; gap:10px; align-items:center; flex-wrap:wrap;}
.pk-lobby-or{color:var(--dim); font-size:12px;}
.pk-lobby-status{font-size:13px; color:var(--teal); min-height:1.4em;}
.pk-lobby-status.err{color:var(--danger);}

.pk-topbar{display:flex; justify-content:space-between; align-items:center; background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:10px 16px; flex-wrap:wrap; gap:8px;}
.pk-topbar h1{font-size:14px; margin:0; letter-spacing:.04em; color:var(--gold); font-weight:700;}
.pk-topbar-btns{display:flex; gap:8px;}
.pk-turn{font-size:13px; padding:4px 10px; border-radius:8px; font-weight:700;}
.pk-turn.me{background:rgba(73,194,177,.15); color:var(--teal);}
.pk-turn.cpu{background:rgba(139,111,242,.15); color:var(--cpu);}
.pk-btn{background:var(--panel-alt); color:var(--text); border:1px solid var(--line); border-radius:8px; padding:6px 12px; font-size:12px; cursor:pointer; transition:.15s border-color, .15s transform;}
.pk-btn:hover{border-color:var(--gold); transform:translateY(-1px);}
.pk-btn:disabled{opacity:.45; cursor:not-allowed;}
.pk-active-row{display:grid; grid-template-columns:1fr auto 1fr; align-items:center; width:100%; column-gap:8px;}
.pk-active-row > .pk-active-slot{grid-column:2; grid-row:1;}
/* スタジアム欄：自分側はバトル場の右、相手側は左（180度回転で一致）。空でも同じ大きさの枠を出す */
.pk-stadium-slot{grid-row:1; box-sizing:border-box; width:150px; max-width:100%; height:81px; display:flex; align-items:center; gap:8px; padding:4px 8px; border:1px solid var(--line); border-radius:10px; background:var(--panel); cursor:pointer; overflow:hidden;}
.pk-stadium-slot.right{grid-column:3; justify-self:start;}
.pk-stadium-slot.left{grid-column:1; justify-self:end;}
.pk-stadium-slot:hover{border-color:var(--gold);}
.pk-stadium-slot.pk-stadium-empty{border:1px dashed var(--line); background:transparent; cursor:default; justify-content:center; opacity:.7;}
.pk-stadium-slot.pk-stadium-empty:hover{border-color:var(--line);}
.pk-stadium-slot.pk-stadium-empty .pk-zone-label{margin:0;}
.pk-stadium-art .pk-thumb{width:48px; height:67px; border-radius:6px; background:#151827; overflow:hidden; display:flex; align-items:center; justify-content:center;}
.pk-stadium-art .pk-thumb img{width:100%; height:100%; object-fit:cover;}
.pk-stadium-info{display:flex; flex-direction:column; font-size:11px; min-width:0;}
.pk-stadium-info b{overflow-wrap:anywhere;}
/* 選択肢のカード画像（カード名の左に出す小さなサムネイル） */
.pk-menu-item.pk-has-thumb{flex-direction:row; align-items:center; gap:10px;}
.pk-choice-thumb{flex:none; width:34px; height:48px;}
.pk-choice-thumb .pk-thumb{width:100%; height:100%; border-radius:4px; background:#151827; overflow:hidden; display:flex; align-items:center; justify-content:center;}
.pk-choice-thumb .pk-thumb img{width:100%; height:100%; object-fit:cover;}
.pk-choice-thumb .pk-thumb span{font-size:16px !important;}
.pk-choice-hp{font-size:10px; font-weight:400; color:var(--dim); margin-left:4px;}
.pk-choice-thumb{cursor:zoom-in;}
#card-id-preview-overlay{z-index:55;}
.pk-discard-row{cursor:pointer !important;}
.pk-discard-row .pk-choice-thumb{cursor:inherit;}
.pk-choice-text{display:flex; flex-direction:column; gap:4px; flex:1; min-width:0;}
.pk-stadium{background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:8px 14px; display:flex; gap:10px; align-items:center; font-size:12px;}
.pk-stadium .pk-empty-tag{color:var(--dim);}
.pk-stadium.pk-clickable{cursor:pointer;}
.pk-stadium.pk-clickable:hover{border-color:var(--gold);}

.pk-side-panel{background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:12px;}
.pk-side-panel.cpu{border-color:rgba(139,111,242,.4);}
.pk-side-panel.me{border-color:rgba(73,194,177,.4);}
.pk-side-header{display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; flex-wrap:wrap; gap:6px;}
.pk-side-header .pk-side-name{font-size:12px; font-weight:700;}
.pk-side-header.cpu .pk-side-name{color:var(--cpu);}
.pk-side-header.me .pk-side-name{color:var(--teal);}
.pk-counters-row{display:flex; gap:8px; flex-wrap:wrap;}
.pk-counter-chip{background:var(--panel-alt); border:1px solid var(--line); border-radius:8px; padding:4px 10px; font-size:11px; display:flex; gap:5px; align-items:center;}
.pk-counter-chip.pk-clickable{cursor:pointer;}
.pk-counter-chip.pk-clickable:hover{border-color:var(--gold);}
.pk-counter-chip b{color:var(--gold); font-family:'JetBrains Mono',monospace;}
.pk-zone-label{font-size:9px; color:var(--dim); margin-bottom:2px;}

/* 本来のポケカ配置：バトル場が前列中央・ベンチが後列横一列（両者のバトル場が画面中央で向き合う） */
.pk-battlefield{display:flex; flex-direction:column; gap:10px; align-items:center; margin-top:10px;}
.pk-active-slot{display:flex; flex-direction:column; gap:4px; align-items:center;}
.pk-bench-row{display:flex; flex-direction:row; gap:8px; flex-wrap:wrap; justify-content:center;}
.pk-bench-slot{display:flex; flex-direction:column; gap:2px; align-items:center;}
.pk-bench-num{font-size:9px; color:var(--dim-strong); letter-spacing:.06em;}
/* ベンチは一回り小さくして縦の伸びを抑える */
.pk-bench-slot .pk-card{width:88px; min-height:122px;}
.pk-bench-slot .pk-card .pk-thumb{height:44px;}
.pk-bench-slot .pk-card .pk-name{font-size:9.5px;}
.pk-card{width:110px; min-height:150px; background:var(--panel-alt); border:1px solid var(--line); border-radius:12px; padding:7px; cursor:pointer; position:relative; transition:.15s transform, .15s border-color, .15s box-shadow; display:flex; flex-direction:column; gap:3px;}
.pk-card:hover{transform:translateY(-3px); border-color:var(--gold); box-shadow:0 8px 20px rgba(232,182,76,.15);}
.pk-card.pk-inactive-side{cursor:default; opacity:.55;}
.pk-card.pk-inactive-side:hover{transform:none; border-color:var(--line); box-shadow:none;}
.pk-card.pk-empty{display:flex; align-items:center; justify-content:center; color:var(--dim); font-size:11px; border-style:dashed; cursor:default;}
.pk-card.pk-empty:hover{transform:none; border-color:var(--line); box-shadow:none;}
.pk-card.pk-facedown{cursor:default; align-items:center; justify-content:center; background:linear-gradient(145deg,#2a2f52,#181c30); border-color:var(--line);}
.pk-card.pk-facedown:hover{transform:none; box-shadow:none; border-color:var(--line);}
.pk-facedown-mark{font-size:26px; font-weight:900; color:rgba(255,255,255,.18);}
.pk-card .pk-name{font-size:10.5px; font-weight:700; line-height:1.25;}
.pk-card .pk-hp{font-size:9.5px; color:var(--dim);}
.pk-card .pk-hp .pk-dmg{color:var(--danger); font-weight:700;}
.pk-card .pk-thumb{width:100%; height:58px; border-radius:8px; background:#151827; display:flex; align-items:center; justify-content:center; font-size:9px; color:var(--dim); overflow:hidden; text-align:center; padding:2px;}
.pk-card .pk-thumb img{width:100%; height:100%; object-fit:cover;}
.pk-stage-badge{position:absolute; top:-7px; left:-6px; background:var(--teal); color:#12141c; font-size:8px; font-weight:700; padding:2px 5px; border-radius:8px;}
.pk-ability-dot{position:absolute; top:-7px; right:-6px; background:var(--gold); color:#12141c; font-size:8px; font-weight:700; padding:2px 5px; border-radius:8px;}
.pk-tool-tag{font-size:8px; color:var(--gold);}
.pk-status-tags{display:flex; gap:3px; flex-wrap:wrap;}
.pk-status-chip{font-size:7.5px; padding:1px 4px; border-radius:5px; background:var(--danger); color:#fff;}
.pk-energy-row{display:flex; gap:3px; flex-wrap:wrap;}
.pk-energy-chip{font-size:8.5px; padding:1px 4px; border-radius:6px; background:#12141c; border:1px solid var(--line);}

.pk-hand-wrap{background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:12px; margin-top:10px;}
.pk-hand{display:flex; gap:8px; overflow-x:auto; padding-bottom:4px;}
.pk-log{background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:12px; max-height:150px; overflow-y:auto; font-size:12px; color:var(--dim); line-height:1.6;}
.pk-log .pk-log-entry{color:var(--text);}
.pk-log-header{font-size:11px; color:var(--dim); margin-bottom:4px; text-transform:uppercase; letter-spacing:.08em; cursor:pointer; display:flex; justify-content:space-between; align-items:center;}
.pk-log-more{font-size:10px; color:var(--teal); text-transform:none; letter-spacing:0;}
/* overlay()はdocument.bodyへ直接追加されるため#pk-rootの文字色を継承しない。
   既存の各要素は個別にcolorを指定して回避しているが、ここで既定値を与えて
   指定漏れ（黒文字化）を防ぐ */
.pk-menu-overlay{position:fixed; inset:0; background:rgba(10,11,16,.6); display:flex; align-items:center; justify-content:center; z-index:50; color:var(--text);}
.pk-menu{background:var(--panel-alt); border:1px solid var(--gold); border-radius:14px; padding:16px; min-width:280px; max-width:440px; max-height:70vh; overflow-y:auto;}
.pk-log-menu{max-width:520px; width:92vw; max-height:80vh; display:flex; flex-direction:column;}
.pk-log-full-list{overflow-y:auto; flex:1; background:var(--panel-light); border:1px solid var(--line); border-radius:10px; padding:10px 12px; font-size:12px; line-height:1.7; color:var(--text); margin-bottom:10px;}
.pk-log-full-entry{padding:3px 0; border-bottom:1px solid rgba(255,255,255,.05);}
.pk-log-full-entry:last-child{border-bottom:none;}
.pk-menu h3{margin:0 0 10px; font-size:13px; color:var(--gold);}
.pk-menu-item{display:flex; flex-direction:column; gap:4px; padding:10px 12px; border-radius:8px; margin-bottom:6px; cursor:pointer; font-size:13px; font-weight:600; color:var(--text); background:#343e72; border:1px solid var(--line);}
.pk-menu-item:hover:not(.pk-disabled){border-color:var(--teal); background:#3e4a8c;}
.pk-menu-item.pk-disabled{cursor:not-allowed; background:#1e2439; border-color:var(--line);}
.pk-menu-item.pk-readonly{cursor:default; flex-direction:row; justify-content:space-between; align-items:center; font-weight:400; background:var(--panel-light);}
.pk-menu-item.pk-readonly:hover{border-color:var(--line); background:var(--panel-light);}
.pk-menu-item .pk-reason{font-size:11px; font-weight:400; color:var(--danger); text-align:left;}
.pk-menu-item .pk-note{font-size:11px; font-weight:400; color:var(--dim); text-align:left;}
.pk-menu-close{margin-top:8px; width:100%; text-align:center;}
/* カード詳細プレビュー（v4踏襲） */
.pk-preview-card{background:var(--panel-alt); border:1px solid var(--gold); border-radius:16px; padding:18px; width:360px; max-width:92vw; max-height:86vh; overflow-y:auto;}
.pk-preview-top{display:flex; gap:14px; margin-bottom:12px;}
.pk-preview-art{width:130px; height:182px; flex-shrink:0; border-radius:10px; background:#151827; border:1px solid var(--line); overflow:hidden; display:flex; align-items:center; justify-content:center; font-size:11px; color:var(--dim); text-align:center; padding:0;}
.pk-preview-art img{width:100%; height:100%; object-fit:contain;}
.pk-preview-meta{flex:1; min-width:0;}
.pk-preview-meta .pk-preview-name{font-size:16px; font-weight:900; color:var(--text); line-height:1.3; margin-bottom:4px;}
.pk-preview-meta .pk-preview-sub{font-size:11px; color:var(--dim); margin-bottom:8px;}
.pk-preview-tagrow{display:flex; gap:6px; flex-wrap:wrap;}
.pk-preview-tag{font-size:10px; padding:2px 8px; border-radius:20px; background:var(--panel-light); border:1px solid var(--line); color:var(--text);}
.pk-preview-block{background:var(--panel-light); border:1px solid var(--line); border-radius:10px; padding:10px 12px; margin-bottom:10px;}
.pk-preview-block .pk-preview-block-title{font-size:11px; font-weight:700; color:var(--gold); margin-bottom:4px; display:flex; justify-content:space-between; align-items:center;}
.pk-preview-block .pk-preview-block-body{font-size:12px; color:var(--text); line-height:1.6;}
.pk-preview-actions{margin-top:12px; display:flex; flex-direction:column; gap:8px;}
.pk-action-btn{display:flex; flex-direction:column; gap:2px; padding:11px 13px; border-radius:10px; cursor:pointer; font-size:13px; font-weight:700; background:var(--panel-light); border:1px solid var(--teal); color:var(--text); text-align:left;}
.pk-action-btn:hover{background:#2f6a63; border-color:var(--teal);}
.pk-action-btn .pk-action-reason{font-size:10px; font-weight:400; color:var(--danger);}
.pk-action-btn.pk-disabled{cursor:not-allowed; background:#1e2439; border-color:var(--line); color:var(--text);}
.pk-action-btn.pk-disabled:hover{background:#1e2439;}

/* シールド戦：パック開封・デッキ構築 */
.pk-sealed-section{margin-bottom:14px;}
.pk-sealed-section-title{font-size:11px; color:var(--dim); text-transform:uppercase; letter-spacing:.06em; margin-bottom:6px;}
.pk-sealed-row{display:flex; gap:8px; flex-wrap:wrap;}
.pk-sealed-energy{background:var(--panel-light); border:1px solid var(--line); border-radius:8px; padding:8px 10px; display:flex; flex-direction:column; gap:6px; align-items:center; font-size:12px; min-width:92px;}
.pk-sealed-stepper{display:flex; align-items:center; gap:8px;}
.pk-sealed-stepper button{width:26px; height:26px; padding:0; font-size:14px; font-weight:900; border-radius:6px;}
.pk-sealed-drawn-grid{display:flex; gap:8px; flex-wrap:wrap; max-height:36vh; overflow-y:auto; padding:4px;}
/* タップ＝追加／長押し＝詳細プレビューをpointerイベントで判定するため、長押し中に
   スクロールやテキスト選択・コンテキストメニューが割り込まないようにする */
.pk-sealed-drawn{cursor:pointer; touch-action:manipulation; -webkit-user-select:none; user-select:none; -webkit-touch-callout:none;}
.pk-sealed-badge{cursor:pointer; background:var(--gold);}
/* シールド戦のカードはトリミングせず全体を表示する（通常の対戦画面のサムネは
   意図的にcoverでトリミングしているため、ここだけ上書きする） */
.pk-sealed-card{width:126px;}
.pk-sealed-card .pk-thumb{height:160px; background:#151827 !important;}
.pk-sealed-card .pk-thumb img{object-fit:contain;}
/* シールド戦カードの拡大プレビュー（.pk-preview-artは対戦画面用の130x182固定なので、
   ここだけ画面に応じて大きく表示できる専用サイズにする） */
.pk-sealed-preview-card{width:420px; max-width:94vw;}
.pk-sealed-preview-art{width:100%; max-width:340px; aspect-ratio:5/7; margin:0 auto 14px; border-radius:14px; background:#151827; border:1px solid var(--line); overflow:hidden; display:flex; align-items:center; justify-content:center;}
.pk-sealed-preview-art img{width:100%; height:100%; object-fit:contain;}

/* コイン投げの結果をフィールド上に見せる演出。ロジック側は関与せず、view.coinFlipsの
   新規ぶんが届いたときだけクライアントが再生する（pointer-events:noneで操作を奪わない） */
.pk-coin-overlay{position:fixed; inset:0; display:flex; align-items:center; justify-content:center; pointer-events:none; z-index:40; perspective:700px;}
.pk-coin-wrap{display:flex; flex-direction:column; align-items:center; gap:10px; perspective:700px; animation:pk-coin-in .18s ease-out both;}
.pk-coin{width:84px; height:84px; position:relative; transform-style:preserve-3d; animation-name:pk-coin-flip; animation-timing-function:ease-out; animation-fill-mode:forwards;}
.pk-coin-face{position:absolute; inset:0; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:30px; font-weight:900; backface-visibility:hidden; box-shadow:0 8px 22px rgba(0,0,0,.45);}
.pk-coin-face.front{background:linear-gradient(160deg,#f2cb6e,#a97a1e); color:#1b1f2c;}
.pk-coin-face.back{background:linear-gradient(160deg,#6b7290,#2b3252); color:#eef0f5; transform:rotateY(180deg);}
.pk-coin-result-label{font-size:13px; font-weight:700; color:var(--gold); background:rgba(10,11,16,.7); padding:3px 12px; border-radius:20px; opacity:0; animation:pk-coin-label-in .2s ease-out forwards; animation-delay:calc(var(--pk-coin-spin-ms, 400ms) * .8);}
/* 回転はコイン本体、フェード＋拡大は外側のwrap、と分けてある。コイン本体のkeyframesに
   opacity/scaleを混ぜると、その要素が合成でフラット化されてtransform-style:preserve-3dが
   無効になり、子のbackface-visibility:hiddenが効かなくなる——結果、裏のときに裏面ではなく
   「表」の面が鏡文字で表示された（2026-08-10にブラウザ実機で確認・修正）。
   コイン本体のkeyframesは回転だけに保つこと。 */
@keyframes pk-coin-flip{
  0%{transform:rotateY(0deg);}
  100%{transform:rotateY(var(--pk-coin-end, 1080deg));}
}
@keyframes pk-coin-in{0%{opacity:0; transform:scale(.5);} 60%{opacity:1;} 100%{opacity:1; transform:scale(1);}}
@keyframes pk-coin-label-in{from{opacity:0; transform:translateY(4px);} to{opacity:1; transform:translateY(0);}}
@media (max-width: 640px){
  .pk-coin{width:56px; height:56px;}
  .pk-coin-face{font-size:20px;}
  .pk-coin-result-label{font-size:11px; padding:2px 9px;}
}

/* 一人回しモード：#solo-game は既存の .pk-side-panel / .pk-battlefield / .pk-hand-wrap 等
   （#game と同じクラス）をそのまま使い回しているので、既存のレスポンシブ規則は自動的に効く。
   ここでは「手番側の強調」と「操作ボタン列」だけを追加する */
.pk-solo-panel-btns{display:flex; gap:6px; margin-left:auto; flex-wrap:wrap;}
#solo-panel-p1, #solo-panel-p2{transition:.15s border-color, .15s box-shadow; border-color:var(--line);}
#solo-panel-p1.pk-solo-active-turn, #solo-panel-p2.pk-solo-active-turn{
  border-color:var(--gold); box-shadow:0 0 0 1px var(--gold) inset;
}
/* 手番でない側は誤操作しやすいので手札を少し暗くして区別する（クリック自体は禁止しない＝
   プレビューは開ける。実行不能な行動はaction一覧が空になるためプレビュー側で弾かれる） */
#solo-panel-p1:not(.pk-solo-active-turn) .pk-hand,
#solo-panel-p2:not(.pk-solo-active-turn) .pk-hand{opacity:.55;}

.pk-toast{position:fixed; top:20px; left:50%; transform:translateX(-50%); background:var(--danger); color:#fff; font-weight:700; padding:10px 18px; border-radius:10px; z-index:60; font-size:13px; animation:pk-pop .25s ease-out;}
.pk-toast.info{background:var(--gold); color:#1b1f2c;}
@keyframes pk-pop{from{transform:translate(-50%,-10px); opacity:0;} to{transform:translate(-50%,0); opacity:1;}}

@media (max-width: 640px){
  #pk-root{padding:6px; gap:6px;}
  .pk-topbar{padding:6px 8px; gap:5px;}
  .pk-topbar h1{display:block; order:-1; width:100%; font-size:10px; white-space:normal; overflow-wrap:break-word; margin:0 0 2px;}
  .pk-btn{padding:4px 6px; font-size:9.5px; border-radius:6px;}
  .pk-turn{font-size:10px; padding:3px 7px;}
  .pk-stadium{padding:5px 8px; font-size:10px; gap:6px;}
  .pk-active-row{column-gap:4px;}
  .pk-stadium-slot{width:96px; height:50px; padding:2px 6px; gap:5px;}
  .pk-stadium-art .pk-thumb{width:30px; height:42px;}
  .pk-stadium-info{font-size:8px;}
  .pk-side-panel{padding:5px; border-radius:10px;}
  .pk-side-header{margin-bottom:4px; gap:4px;}
  .pk-side-header .pk-side-name{font-size:10px;}
  .pk-counters-row{gap:4px;}
  .pk-counter-chip{font-size:8.5px; padding:2px 5px; border-radius:6px; gap:3px;}
  .pk-battlefield{gap:4px; margin-top:4px;}
  .pk-bench-row{gap:4px;}
  .pk-bench-num{font-size:6px;}
  .pk-bench-slot .pk-card{width:54px; min-height:78px;}
  .pk-bench-slot .pk-card .pk-thumb{height:24px;}
  .pk-bench-slot .pk-card .pk-name{font-size:6.5px;}
  .pk-preview-card{width:100%; padding:12px;}
  .pk-preview-top{flex-direction:column;}
  .pk-preview-art{width:130px; height:182px; align-self:center;}
  .pk-zone-label{font-size:7px; margin-bottom:1px;}
  .pk-card{width:58px; min-height:84px; padding:3px; gap:1px; border-radius:8px;}
  .pk-card .pk-name{font-size:7px; line-height:1.15;}
  .pk-card .pk-hp{font-size:6.5px;}
  .pk-card .pk-thumb{height:28px; border-radius:5px;}
  .pk-card .pk-thumb span{font-size:11px !important;}
  .pk-stage-badge, .pk-ability-dot{font-size:6px; padding:1px 3px; top:-5px;}
  .pk-status-chip{font-size:5.5px; padding:0 2px;}
  .pk-energy-chip{font-size:6px; padding:0 3px;}
  .pk-tool-tag{font-size:6px;}
  .pk-card.pk-facedown .pk-facedown-mark{font-size:16px;}
  .pk-hand-wrap{padding:5px; margin-top:4px; border-radius:10px;}
  .pk-hand{gap:4px;}
  .pk-log{padding:6px; max-height:70px; font-size:9.5px; border-radius:10px;}
  .pk-menu{min-width:0; width:92vw;}
  /* シールド戦（パック開封・デッキ構築）のカードは、対戦盤面用の縮小（直前の.pk-card
     ルール）を上書きして、モバイルでも視認できる大きさを保つ */
  .pk-sealed-card{width:104px; min-height:150px; padding:5px; gap:2px;}
  .pk-sealed-card .pk-name{font-size:9px;}
  .pk-sealed-card .pk-thumb{height:132px;}
  .pk-sealed-preview-art{max-width:88vw;}
}

/* 一人回しの決着後に出る「このログを残すか」バー。学習データの質を保つため、
   質の悪い対局（操作ミス・投了）をユーザー自身に捨ててもらう */
.pk-replay-bar{display:flex; align-items:center; gap:10px; flex-wrap:wrap; background:var(--panel); border:1px solid var(--teal); border-radius:12px; padding:10px 16px; font-size:12px; color:var(--text);}
.pk-replay-bar.done{border-color:var(--line); color:var(--dim);}

/* マイデッキ・プリセットの管理（2026-09-30） */
.pk-lobby-sub{margin-top:12px; gap:10px;}
.pk-lobby-sub summary{cursor:pointer; font-size:13px; font-weight:700; color:var(--teal);}
.pk-deck-list{display:flex; flex-direction:column; gap:6px;}
.pk-deck-row{display:flex; align-items:center; gap:8px; font-size:12px; background:var(--panel-alt); border:1px solid var(--line); border-radius:8px; padding:6px 10px;}
.pk-deck-row .pk-deck-name{flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.pk-deck-row .pk-deck-code{color:var(--dim); font-family:'JetBrains Mono',monospace;}
.pk-deck-row .pk-btn{padding:3px 10px; font-size:11px;}