﻿/* 460_サバゲ.css — サバゲでGo! 専用スタイル */

/* ---- サバゲセクション全体 ---- */
/* v0.6.96: z-index階層降り直し (ユーザー指示「Phase 2 z-index完全降り直し必須」)。
   旧: 90000 (タイトル幕2000・拠点89998と近接で混在原因) → 新: 2000 (タイトル幕1000・拠点1500の上層)。
   サバゲ内モーダル (キャラ詳細/オンラインマッチ等) は サバゲ画面+10〜+100 で 2010-2100 に整理。
   フルスクリーンモーダル (倉庫/編成) は 100050+ で Lv10共通UI(100000)より前面、 サバゲ画面と独立。 */
#サバゲ画面 { display:none; position:fixed; inset:0; background:#111; z-index:2000; overflow:hidden; font-size:15px; }
#サバゲ画面.active { display:block; }

/* ---- ロビー (v0.4.41 リッチ化, v0.4.62 マップ25個対応で5列+全体スクロール+編成下配置) ---- */
#go-lobby {
    padding: 24px 20px;
    max-width: 1400px; margin: 0 auto;
    color: #eee;
    font-family: 'Hiragino Kaku Gothic ProN','Noto Sans JP',sans-serif;
    /* v0.4.62: 親 #サバゲ画面 が overflow:hidden のため、ロビー自身をスクロール可能に */
    height: 100vh;
    overflow-y: auto;
    box-sizing: border-box;
    background:
        radial-gradient(ellipse at top right, rgba(80,40,40,0.15) 0%, transparent 50%),
        radial-gradient(ellipse at bottom left, rgba(60,80,140,0.18) 0%, transparent 50%);
}
#go-lobby h2 {
    font-size: 24px; color: #ffd700;
    margin: 0;
    text-shadow: 0 0 14px rgba(255,215,0,0.4), 0 2px 4px rgba(0,0,0,0.5);
    letter-spacing: 0.05em;
    white-space: nowrap;
}
/* v0.4.64: ヘッダー右寄せ — 左サイドバーアイコン群との被り解消 */
.go-lobby-header {
    display: flex; justify-content: flex-end; align-items: center; gap: 14px;
    padding-right: 8px; padding-left: 240px;
    margin-bottom: 14px;
}
.go-lobby-header .go-lobby-subtitle {
    font-size: 13px; color: #aaa; margin: 0;
}
.go-lobby-grid {
    display: grid;
    /* v0.4.62: 3列→5列に拡張(マップ25個対応、auto-fillで狭い画面にも対応) */
    grid-template-columns: repeat(5, 1fr);
    gap: 8px;
    margin-bottom: 18px;
}
@media(max-width:1200px) { .go-lobby-grid { grid-template-columns: repeat(4, 1fr); } }
@media(max-width:960px)  { .go-lobby-grid { grid-template-columns: repeat(3, 1fr); } }
/* v0.4.64: マップカード縦圧縮 — 25枚一覧をスクロール最小限に */
.go-map-card {
    background:
        linear-gradient(180deg, rgba(40,55,90,0.5), rgba(20,30,50,0.7)),
        radial-gradient(ellipse at top, rgba(255,215,0,0.05), transparent 70%);
    border: 2px solid rgba(150,180,255,0.2);
    border-radius: 8px;
    padding: 8px 10px;
    cursor: pointer;
    transition: all 0.2s;
    text-align: center;
    position: relative;
    overflow: hidden;
    box-shadow: 0 2px 6px rgba(0,0,0,0.3);
}
.go-map-card:hover {
    border-color: #ffd700;
    transform: translateY(-3px);
    box-shadow: 0 8px 22px rgba(255,215,0,0.3), 0 0 0 1px rgba(255,215,0,0.4);
}
.go-map-card.selected {
    border-color: #ffd700;
    background: linear-gradient(180deg, rgba(120,90,30,0.4), rgba(70,50,15,0.6));
    box-shadow: 0 0 22px rgba(255,215,0,0.45), inset 0 0 12px rgba(255,215,0,0.15);
}
/* v0.4.64: 縦圧縮 — h3 18px→15px, p 13px→11px, marginタイト */
.go-map-card h3 { font-size: 15px; margin: 0 0 2px; color: #fff; text-shadow: 0 1px 3px rgba(0,0,0,0.5); line-height: 1.2; }
.go-map-card p  { font-size: 11px; color: #aaa; margin: 0; line-height: 1.3; }
.go-settings {
    display: flex; gap: 14px; flex-wrap: wrap;
    margin-bottom: 18px;
    background: rgba(0,0,0,0.25);
    padding: 14px;
    border-radius: 8px;
    border: 1px solid rgba(255,255,255,0.05);
}
.go-settings label {
    font-size: 15px; color: #ccc;
    display: flex; align-items: center; gap: 8px;
    font-weight: 600;
}
.go-settings select {
    font-size: 15px;
    background: linear-gradient(180deg, #2a3a55, #1a2540);
    color: #fff;
    border: 1px solid #4a6090;
    border-radius: 5px;
    padding: 7px 10px;
    cursor: pointer;
    font-weight: 600;
}
.go-settings select:focus {
    outline: 1px solid #ffd700;
    border-color: #ffd700;
}
.go-start-btn {
    font-size: 22px;
    padding: 14px 36px;
    background: linear-gradient(180deg, #2a6a2a, #1a4a1a);
    color: #afa;
    border: 2px solid #6a9a4a;
    border-radius: 8px;
    cursor: pointer;
    font-weight: bold;
    text-shadow: 0 1px 3px rgba(0,0,0,0.5);
    box-shadow: 0 4px 14px rgba(80,200,80,0.3), inset 0 1px 0 rgba(255,255,255,0.1);
    transition: all 0.2s;
    letter-spacing: 0.05em;
}
.go-start-btn:hover {
    background: linear-gradient(180deg, #3a8a3a, #2a6a2a);
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(80,200,80,0.5);
}

/* v0.5.17: オンラインマッチ通知トグルスイッチ (CSSのみで実装、 JSは状態保存のみ) */
.go-match-notify-toggle {
    display: inline-flex; align-items: center; gap: 8px; cursor: pointer;
    padding: 6px 12px; background: rgba(0,0,0,0.3); border: 1px solid rgba(120,180,255,0.25);
    border-radius: 20px; user-select: none;
}
.go-match-notify-toggle input { display: none; }
.go-match-notify-track {
    position: relative; width: 38px; height: 20px;
    background: #444; border-radius: 10px; transition: background 0.2s;
    flex-shrink: 0;
}
.go-match-notify-thumb {
    position: absolute; top: 2px; left: 2px; width: 16px; height: 16px;
    background: #ddd; border-radius: 50%; transition: left 0.2s, background 0.2s;
}
/* v0.5.28: 限定セレクタ撤廃で 全 input:checked + .go-match-notify-track が反応するように汎用化 (音量設定モーダルのテーマOFFトグル等にも適用) */
input:checked + .go-match-notify-track {
    background: linear-gradient(180deg, #4a9eff, #2a6acc) !important;
}
input:checked + .go-match-notify-track .go-match-notify-thumb {
    left: 20px !important; background: #fff !important;
}
.go-match-notify-label {
    font-size: 13px; color: #cce; white-space: nowrap;
}

/* v0.5.17: 募集中ルーム中央通知 (大きく目立つ表示でユーザーに気付かせる) */
#go-match-notice {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    z-index: 80000;
    background: linear-gradient(135deg, rgba(20,40,80,0.96), rgba(40,20,80,0.96));
    border: 3px solid #4a9eff;
    border-radius: 16px;
    padding: 28px 36px;
    min-width: 480px; max-width: 90vw;
    color: #fff;
    box-shadow: 0 0 60px rgba(74,158,255,0.55), 0 20px 60px rgba(0,0,0,0.7);
    animation: go-match-notice-pulse 2s ease-in-out infinite;
    text-align: center;
}
@keyframes go-match-notice-pulse {
    0%, 100% { box-shadow: 0 0 60px rgba(74,158,255,0.55), 0 20px 60px rgba(0,0,0,0.7); }
    50%      { box-shadow: 0 0 80px rgba(74,158,255,0.9),  0 20px 60px rgba(0,0,0,0.7); }
}
#go-match-notice .gmn-title {
    font-size: 22px; font-weight: 800; color: #88ddff;
    letter-spacing: 0.1em; margin-bottom: 12px;
    text-shadow: 0 0 12px rgba(136,221,255,0.7);
}
#go-match-notice .gmn-map {
    font-size: 18px; color: #ffd700; font-weight: 700; margin-bottom: 6px;
}
#go-match-notice .gmn-rules {
    font-size: 14px; color: #ccd; margin-bottom: 12px;
}
#go-match-notice .gmn-players {
    font-size: 15px; color: #fff; margin-bottom: 16px; line-height: 1.6;
}
#go-match-notice .gmn-players b { color: #ffd700; }
#go-match-notice .gmn-actions {
    display: flex; gap: 10px; justify-content: center; flex-wrap: wrap;
}
#go-match-notice .gmn-btn {
    padding: 10px 22px; font-size: 14px; font-weight: 700;
    background: linear-gradient(180deg, #2a8aff, #1a4acc);
    color: #fff; border: 2px solid #88ccff; border-radius: 8px;
    cursor: pointer; transition: all 0.15s;
}
#go-match-notice .gmn-btn:hover {
    background: linear-gradient(180deg, #4aaaff, #2a6aff);
    transform: translateY(-1px);
    box-shadow: 0 4px 14px rgba(74,158,255,0.5);
}
#go-match-notice .gmn-btn-other {
    background: linear-gradient(180deg, #555, #333);
    border-color: #888;
}
#go-match-notice .gmn-close {
    position: absolute; top: 8px; right: 12px;
    background: transparent; border: none; color: #aaa;
    font-size: 22px; cursor: pointer;
}
#go-match-notice .gmn-close:hover { color: #fff; }

/* ---- ゲーム画面: フルスクリーンマップ ---- */
#go-game { display:none; position:fixed; inset:0; background:#0a0a0a; }

/* マップ: 画面全体・中央基準 */
/* v0.4.102: flex center を解除 — flex の align/justify center は scrollLeft/Top の負方向移動を
   ブラウザが許容しないためコンテンツ左上方向にスクロール不可能になるバグ(v0.4.97 で発覚)。
   代替策として中央寄せは GoDraw.サイズ更新() で wrap.scrollLeft/Top を初期/ズーム時に
   (innerサイズ - wrapサイズ)/2 にセットして実現。
   v0.4.104: transition で left の変化を滑らかに (サイドバー開閉時の動きと同期)。 */
/* v0.5.16: マップwrap の left を 0 → 340px に変更 (ユーザー指示「マップの左余白をもっと多くとれるように」 + スクショ)。
   理由: フローティングユニットリスト(#go-panel-units 320px幅, left:8px) が常時マップに被さってスクロールしても左端が見えない問題。
   マップwrap自体を 340px (パネル幅320+余白20) 右にずらすことで、 マップ左端のキャラもユニットリスト下に隠れずに表示可能。 */
#go-map-wrap { position:absolute; top:0; right:0; bottom:0; left:340px; overflow:auto; cursor:crosshair; transition:left 0.3s cubic-bezier(0.4,0,0.2,1); }
/* v0.4.104: 左サイドバー(menu/style.css #左サイドバー 255px幅) 開放時はマップ wrap を右に
   ずらして左上のキャラがサイドバーに被って選択不能になるバグ防止。閉じている時はフルスクリーン。
   検知は main_dg.js の MutationObserver が body に dg-side-open クラスを付け外し。
   v0.5.16: 既定340pxにしたため、 サイドバー開放時(255px) は340pxの方が大きく自然に上回る。 さらに左サイドバー幅+ユニットリスト幅でも収まるよう 360pxに余裕設定。 */
body.dg-side-open #go-map-wrap { left: 360px; }
#go-wrap-inner { position:relative; flex-shrink:0; }
#go-map-wrap canvas { position:absolute; top:0; left:0; image-rendering:pixelated; }

/* ---- フローティングHUD（右上） ---- */
/* v0.6.46: top 8→60px ─ 右上の「🎵 BGM/音量」フローティングボタン (main_dg.js dg-bgm-button, top:14px height:~40px) との被り解消、 「開始/一時停止」 ボタンが重ならないようにマージン確保。 */
.go-hud { position:fixed; top:60px; right:8px; z-index:2010;
    display:flex; align-items:center; gap:10px; padding:6px 14px;
    background:rgba(0,0,0,0.7); backdrop-filter:blur(6px);
    border:1px solid rgba(255,255,255,0.1); border-radius:8px; font-size:16px; color:#ccc; }
.go-hud .go-team { display:flex; align-items:center; gap:4px; }
.go-hud .go-team-a { color:#4af; }
.go-hud .go-team-b { color:#f44; }
.go-hud-buttons { display:flex; gap:4px; margin-left:8px; }
.go-hud-buttons button { font-size:15px; padding:4px 10px; background:rgba(255,255,255,0.08); color:#eee; border:1px solid rgba(255,255,255,0.15); border-radius:4px; cursor:pointer; }
.go-hud-buttons button:hover { background:rgba(255,255,255,0.18); }

/* v0.4.102: 右上HUD作りこみ — 2行構成 (操作系↑ / 設定系↓) でラベル付き */
/* v0.5.69: HUD縦型レイアウト (ユーザー指示「縦型に。 左列大きい再生 / 速度・音量見やすく大きく / 縦長右列に全配置 / スペースで分類」)
 * 全ボタンを縦に配置、 各行 padding大きめ、 font-size 13→15px に拡大、 区切り線でグループ分け。 */
/* v0.5.86: HUD全体拡大 (ユーザー指示「画面右上のメニューが小さくて見えない」)。
   min-width 200→280px / font-size 15→17px / padding 10x14→13x16 で確実に視認できる大きさに。 */
.go-hud { flex-direction:column !important; align-items:stretch !important; gap:10px !important; padding:14px 16px !important; min-width:280px; max-width:320px; }
.go-hud-row { display:flex; flex-direction:column !important; align-items:stretch !important; gap:6px; flex-wrap:nowrap; }
.go-hud-row.sub { border-top:2px solid rgba(255,255,255,0.18); padding-top:12px; margin-top:5px; }
.go-hud-action {
    display:flex; align-items:center; justify-content:flex-start; gap:10px;
    font-size:17px; padding:13px 16px;
    background:linear-gradient(180deg, rgba(255,255,255,0.12), rgba(255,255,255,0.04));
    color:#eee; border:1px solid rgba(255,255,255,0.20); border-radius:7px;
    cursor:pointer; white-space:nowrap; transition:all 0.15s;
    box-shadow:0 1px 0 rgba(255,255,255,0.10) inset, 0 2px 4px rgba(0,0,0,0.4);
    width:100%;
}
/* v0.5.86: 再生ボタンを更に大型化 (font 22→26 / padding 22x16 / min-height 76px) */
.go-hud-action.play { font-size:26px !important; padding:22px 16px !important; font-weight:900 !important; min-height:76px; }
.go-hud-action.play .lbl { font-size:22px !important; font-weight:900 !important; color:#fff !important; }
.go-hud-action .lbl { font-size:14px; color:#cdd; }
.go-hud-action:hover { background:linear-gradient(180deg, rgba(255,255,255,0.22), rgba(255,255,255,0.08)); transform:translateY(-1px); border-color:rgba(255,215,0,0.50); }
.go-hud-action:active { transform:translateY(0); }
/* アクション別アクセントカラー */
.go-hud-action.play    { border-color:rgba(120,255,120,0.40); }
.go-hud-action.play:hover    { border-color:rgba(120,255,120,0.80); box-shadow:0 0 12px rgba(120,255,120,0.30); }
/* v0.4.105: play.active = ループ実行中 (⏸表示)。橙系で識別 */
.go-hud-action.play.active { border-color:rgba(255,200,80,0.80); background:linear-gradient(180deg, rgba(255,200,80,0.20), rgba(255,200,80,0.05)); box-shadow:0 0 12px rgba(255,200,80,0.40); }
.go-hud-action.pause   { border-color:rgba(255,200,80,0.40); }
.go-hud-action.pause:hover   { border-color:rgba(255,200,80,0.80); box-shadow:0 0 12px rgba(255,200,80,0.30); }
.go-hud-action.next    { border-color:rgba(255,80,80,0.40); }
.go-hud-action.next:hover    { border-color:rgba(255,80,80,0.80); box-shadow:0 0 12px rgba(255,80,80,0.30); }
.go-hud-action.shuffle { border-color:rgba(180,140,255,0.40); }
.go-hud-action.shuffle:hover { border-color:rgba(180,140,255,0.80); box-shadow:0 0 12px rgba(180,140,255,0.30); }
.go-hud-action.toggle { border-color:rgba(80,200,255,0.40); }
.go-hud-action.toggle:hover { border-color:rgba(80,200,255,0.80); box-shadow:0 0 12px rgba(80,200,255,0.30); }
/* 全体表示モード時のアクティブ状態(ボタン押下中の見た目維持) */
.go-hud-action.toggle.active { background:linear-gradient(180deg, rgba(80,200,255,0.32), rgba(80,200,255,0.12)); border-color:rgba(80,200,255,1.0); box-shadow:0 0 16px rgba(80,200,255,0.50), inset 0 1px 0 rgba(255,255,255,0.20); }
.go-hud-action.back    { border-color:rgba(150,150,150,0.30); margin-left:auto; }
.go-hud-action.back:hover    { border-color:rgba(255,255,255,0.50); }
/* v0.6.46: グレーアウト ─ BGM停止中 or 音量0 のとき BGMボタンを非アクティブ表示。 pointer-events:none で クリックも遮断。 */
.go-hud-action.is-disabled {
    opacity:0.35 !important;
    cursor:not-allowed !important;
    pointer-events:none !important;
    filter:grayscale(0.7);
    border-color:rgba(120,120,120,0.40) !important;
    box-shadow:none !important;
}
/* v0.5.69: 縦型対応 ─ 速度/作戦selectを大きく見やすく */
.go-hud-sel { display:flex; flex-direction:column; align-items:stretch; gap:4px; font-size:13px; color:#aaa; width:100%; }
.go-hud-sel .lbl { color:#cdd; font-size:12px; letter-spacing:0.05em; font-weight:700; }
.go-hud-sel select { font-size:14px !important; background:rgba(0,0,0,0.50); color:#eee; border:1px solid rgba(255,255,255,0.25); border-radius:5px; padding:7px 10px; cursor:pointer; width:100%; }
.go-hud-sel select:hover { border-color:rgba(255,215,0,0.60); }
.go-hud-record { font-size:13px; color:#cdd; padding:6px 4px; text-align:center; border-top:1px solid rgba(255,255,255,0.10); margin-top:4px; }
/* v0.5.69: 「back」 ボタンの margin-left:auto を縦型では無効化 (横配置でなく縦下端に来る) */
.go-hud-action.back { margin-left:0 !important; margin-top:4px; border-top:1px dashed rgba(255,255,255,0.15); }

/* ---- フローティングユニットリスト（左上・大型） ---- */
#go-panel-units { position:fixed; top:70px; left:8px; z-index:2010; width:320px;
    background:rgba(0,0,0,0.75); backdrop-filter:blur(6px);
    border:1px solid rgba(255,255,255,0.1); border-radius:8px;
    max-height:calc(100vh - 100px); overflow-y:auto; scrollbar-width:thin; }
#go-panel-units .go-tab-bar { display:flex; border-bottom:1px solid #333; }
#go-panel-units .go-tab { flex:1; padding:8px; text-align:center; cursor:pointer; font-size:14px; color:#888; transition:0.2s; }
#go-panel-units .go-tab.active { color:#ffd700; border-bottom:2px solid #ffd700; }
#go-panel-units .go-tab:hover { color:#fff; }
.go-unit-item { display:flex; align-items:center; gap:8px; padding:8px 12px; font-size:15px; border-left:4px solid transparent; transition:all 0.2s; }
.go-unit-item.selected { border-left-color:#33ff66; background:rgba(50,255,100,0.15); box-shadow:inset 0 0 8px rgba(50,255,100,0.1); }
.go-unit-item.dead { opacity:0.3; }
.go-dot { width:10px; height:10px; border-radius:50%; flex-shrink:0; }
.go-uname { flex:1; color:#eee; }
.go-ustat { font-size:12px; color:#888; }

/* ---- フローティングログ（左下） ----
   v0.4.60: menu/lv10mp3 ミニバー(高さ56px, bottom:0, 左)と被らないよう bottom を 72px に。
   ミニバー幅は300px(PC)/100vw(スマホ)、本ログ幅は400px(PC) — PC時は被るので必ず上にずらす。 */
#go-log { position:fixed; bottom:72px; left:8px; z-index:2010; width:400px;
    background:rgba(0,0,0,0.35); backdrop-filter:blur(4px);
    border:1px solid rgba(255,255,255,0.06); border-radius:8px;
    padding:8px 12px; font-size:16px; line-height:1.8; color:#ccc;
    max-height:180px; overflow:hidden; pointer-events:none; }
#go-log .ev-kill { color:#f77; font-weight:600; }
#go-log .ev-shot { color:#fa7; }
#go-log .ev-spot { color:#7af; }
#go-log .ev-move { color:#555; }
#go-log .ev-start { color:#ffd700; font-weight:600; }

/* リザルト画面 (v0.4.17 アニメーション強化) */
#go-result {
    position:fixed; inset:0; z-index:2015;
    background:radial-gradient(ellipse at center, rgba(20,30,50,0.7), rgba(0,0,0,0.92));
    display:flex; align-items:center; justify-content:center;
    backdrop-filter:blur(6px);
    animation: go-result-fadein 0.6s ease-out;
}
@keyframes go-result-fadein {
    from { opacity: 0; backdrop-filter: blur(0); }
    to   { opacity: 1; backdrop-filter: blur(6px); }
}
.go-result-box {
    background: linear-gradient(135deg, #1a2030, #0f1525);
    border: 1px solid rgba(255,215,0,0.3);
    border-radius: 14px;
    padding: 24px 32px;
    max-width: 640px; width: 92%;
    max-height: 86vh; overflow-y: auto;
    color: #eee;
    box-shadow: 0 16px 48px rgba(0,0,0,0.7), 0 0 80px rgba(255,215,0,0.08);
    animation: go-result-slidein 0.7s cubic-bezier(0.2, 1.2, 0.4, 1) 0.1s backwards;
}
@keyframes go-result-slidein {
    from { transform: translateY(40px) scale(0.94); opacity: 0; }
    to   { transform: translateY(0) scale(1); opacity: 1; }
}
.go-result-title {
    font-size: 27px; font-weight: 700;
    text-align: center; margin-bottom: 16px;
    letter-spacing: 0.05em;
    animation: go-title-glow 2.4s ease-in-out infinite alternate;
}
.go-result-title.win-a { color:#4af; text-shadow: 0 0 14px rgba(80,160,255,0.6), 0 0 4px rgba(80,160,255,0.4); }
.go-result-title.win-b { color:#f44; text-shadow: 0 0 14px rgba(255,80,80,0.6), 0 0 4px rgba(255,80,80,0.4); }
@keyframes go-title-glow {
    from { filter: brightness(1); }
    to   { filter: brightness(1.25); }
}
.go-result-table { width:100%; border-collapse:collapse; font-size:15px; }
.go-result-table th {
    text-align:left; padding:8px 8px;
    color:#ffd700; border-bottom:1px solid #333; font-size:11px;
    letter-spacing: 0.1em; text-transform: uppercase;
}
.go-result-table td { padding:7px 8px; border-bottom:1px solid #222; }
.go-result-table tbody tr {
    animation: go-row-slidein 0.4s ease-out backwards;
    transition: background 0.2s;
}
.go-result-table tbody tr:nth-child(1)  { animation-delay: 0.5s; }
.go-result-table tbody tr:nth-child(2)  { animation-delay: 0.6s; }
.go-result-table tbody tr:nth-child(3)  { animation-delay: 0.7s; }
.go-result-table tbody tr:nth-child(4)  { animation-delay: 0.8s; }
.go-result-table tbody tr:nth-child(5)  { animation-delay: 0.9s; }
.go-result-table tbody tr:nth-child(6)  { animation-delay: 1.0s; }
.go-result-table tbody tr:nth-child(7)  { animation-delay: 1.1s; }
.go-result-table tbody tr:nth-child(8)  { animation-delay: 1.2s; }
.go-result-table tbody tr:nth-child(9)  { animation-delay: 1.3s; }
.go-result-table tbody tr:nth-child(10) { animation-delay: 1.4s; }
@keyframes go-row-slidein {
    from { transform: translateX(-24px); opacity: 0; }
    to   { transform: translateX(0); opacity: 1; }
}
.go-result-table tr.mvp {
    background: linear-gradient(90deg, rgba(255,215,0,0.06), rgba(255,215,0,0.18), rgba(255,215,0,0.06));
    animation: go-row-slidein 0.4s ease-out backwards, go-mvp-pulse 2.2s ease-in-out 1.6s infinite alternate;
}
@keyframes go-mvp-pulse {
    from { box-shadow: inset 0 0 0 rgba(255,215,0,0); }
    to   { box-shadow: inset 0 0 28px rgba(255,215,0,0.25); }
}
.go-result-table tr:hover { background: rgba(255,255,255,0.04); }
.go-result-table .rank {
    font-weight:800; color:#ffd700; width:34px; text-align:center;
    font-variant-numeric: tabular-nums;
    text-shadow: 0 0 4px rgba(255,215,0,0.3);
}
.go-result-table .name { font-weight:600; }
.go-result-table .team-a { color:#5ab5ff; }
.go-result-table .team-b { color:#ff7070; }
.go-result-table .score { color:#ffd700; font-weight:700; font-variant-numeric: tabular-nums; }
.go-result-table .dead { opacity:0.45; }
.go-result-btns { display:flex; gap:10px; justify-content:center; margin-top:18px; }
.go-result-btns button {
    font-size:15px; padding:10px 22px;
    background: linear-gradient(180deg, #2a3a55, #1a2540);
    color:#fff; border:1px solid #4a6090;
    border-radius:6px; cursor:pointer;
    font-weight: 600;
    transition: all 0.2s;
}
.go-result-btns button:hover {
    background: linear-gradient(180deg, #3a4a65, #2a3550);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(80,120,200,0.35);
}

/* 編成パネル (v0.4.41 リッチ化) */
.go-char-card {
    width: 134px;
    background:
        linear-gradient(180deg, rgba(40,55,90,0.55), rgba(20,30,50,0.7)),
        radial-gradient(circle at top, rgba(255,215,0,0.06), transparent 60%);
    border: 2px solid rgba(150,180,255,0.25);
    border-radius: 10px;
    padding: 10px 8px 8px;
    cursor: pointer;
    transition: all 0.25s;
    text-align: center;
    position: relative;
    overflow: hidden;
    box-shadow: 0 3px 10px rgba(0,0,0,0.35);
}
.go-char-card:hover {
    border-color: #ffd700;
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(255,215,0,0.3), 0 0 0 1px rgba(255,215,0,0.4);
}
.go-char-card.active {
    border-color: #33ff66;
    background: linear-gradient(180deg, rgba(50,120,80,0.5), rgba(30,80,50,0.7));
    box-shadow: 0 0 18px rgba(50,255,100,0.35);
}
.go-char-card.disabled { opacity: 0.4; border-color: #333; }
/* v0.6.39: 顔が上に切れる対策 ─ ズーム弱め+下シフトで頭頂上に余白。
   旧: scale(1.55) translateY(-7.5%) ─ 上カット強くて頭頂・髪上部が切れていた
   新: scale(1.30) translateY(8%) ─ 拡大穏やか+表示中心を画像上寄りに(=画像を下にずらす)
   結果: 拡大後画像の上端 ≒ 元画像の5%地点が表示矩形上端、 顔は上1/3〜中央に位置、 肩〜胸まで見える */
.go-char-card { overflow: hidden; }
.go-char-card .cc-portrait-wrap {
    width: 100%; height: 180px;
    border-radius: 8px;
    overflow: hidden;
    margin: 0 auto 6px;
    border: 2px solid rgba(255,255,255,0.2);
    box-shadow: 0 2px 6px rgba(0,0,0,0.4);
    background: rgba(0,0,0,0.3);
    position: relative;
}
.go-char-card .cc-portrait-wrap img {
    width: 100%; height: 100%;
    object-fit: cover; object-position: center top;
    transform: scale(1.30) translateY(8%);
    transform-origin: center center;
    display: block;
}
/* 旧 imgの円形スタイル無効化(ラッパ未使用環境のフォールバック) */
.go-char-card > img {
    width: 100%; height: 180px;
    border-radius: 8px;
    object-fit: cover; object-position: center 18%;
    margin: 0 auto 6px;
    display: block;
    border: 2px solid rgba(255,255,255,0.2);
    box-shadow: 0 2px 6px rgba(0,0,0,0.4);
    background: rgba(0,0,0,0.3);
}
.go-char-card.active .cc-portrait-wrap,
.go-char-card.active > img { border-color: #33ff66; box-shadow: 0 0 12px rgba(50,255,100,0.5); }
.go-char-card .cc-name {
    font-size: 13px; color: #fff;
    font-weight: 700;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.go-char-card .cc-rank {
    position: absolute; top: 5px; left: 5px;
    font-size: 13px; font-weight: 800; color: #fff;
    background: rgba(0,0,0,0.78);
    padding: 2px 7px;
    border-radius: 4px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    z-index: 2;
    line-height: 1.2;
}
.go-char-card .cc-class {
    position: absolute; top: 5px; right: 5px;
    font-size: 13px; font-weight: 800;
    padding: 2px 7px;
    border-radius: 4px;
    color: #000;
    box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    z-index: 2;
    line-height: 1.2;
}
.go-char-card .cc-stats {
    font-size: 13px; color: #cce;
    margin-top: 5px;
    background: rgba(0,0,0,0.3);
    padding: 3px 4px;
    border-radius: 3px;
    font-variant-numeric: tabular-nums;
}
.go-char-card .cc-weapon {
    font-size: 13px; color: #fff;
    margin-top: 5px;
    padding: 4px 6px;
    background: linear-gradient(180deg, rgba(60,90,140,0.5), rgba(30,50,90,0.6));
    border: 1px solid rgba(120,160,220,0.3);
    border-radius: 4px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.go-char-card .cc-weapon a {
    font-size: 13px;
    color: #88c0ff;
}
.go-char-card .cc-weapon a:hover {
    color: #fff;
    text-decoration: underline;
}

/* ドロップダウンセレクト */
#サバゲ画面 select { background:#1a1a1a !important; color:#eee !important; border:1px solid #555 !important; border-radius:4px; padding:4px 8px; font-size:13px; }
#サバゲ画面 select option { background:#1a1a1a; color:#eee; padding:6px 8px; }
#サバゲ画面 select:focus { outline:1px solid #ffd700; }

/* 戦況メーター(画面上部中央): 両軍残存数の比率バー
   v0.4.65: 経過時間/HUD と被らないよう margin-top確保 + 透明度UP(背景0.55→0.20、ゲージ色も透過) */
#go-warmeter {
    position: fixed; top: 48px; left: 50%; transform: translateX(-50%);
    width: 340px; height: 22px;
    z-index: 2011;
    background: rgba(0,0,0,0.20);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 11px;
    overflow: hidden;
    backdrop-filter: blur(2px);
    display: flex;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.04);
    opacity: 0.85;
}
#go-warmeter:hover { opacity: 1; }
#go-warmeter .go-warmeter-a {
    background: linear-gradient(90deg, rgba(42,120,204,0.55), rgba(74,158,255,0.55));
    height: 100%;
    transition: width 0.5s cubic-bezier(0.2, 0.8, 0.2, 1);
    box-shadow: inset 0 0 6px rgba(80,160,255,0.25);
}
#go-warmeter .go-warmeter-b {
    background: linear-gradient(90deg, rgba(255,80,80,0.55), rgba(204,56,56,0.55));
    height: 100%;
    transition: width 0.5s cubic-bezier(0.2, 0.8, 0.2, 1);
    box-shadow: inset 0 0 6px rgba(255,100,100,0.25);
}
#go-warmeter .go-warmeter-text {
    position: absolute; top: 0; left: 0; right: 0;
    text-align: center; line-height: 24px;
    font-size: 12px; color: #fff; font-weight: 700;
    text-shadow: 0 1px 3px rgba(0,0,0,0.9), 0 0 4px rgba(0,0,0,0.7);
    pointer-events: none;
    letter-spacing: 0.05em;
}

/* スマホ対応 */
@media(max-width:768px) {
    .go-lobby-grid { grid-template-columns:1fr 1fr; }
    #go-panel-units { width:160px; }
    /* v0.5.16: スマホ時はパネル幅160pxに合わせてマップwrapも縮小オフセット (160+余白20=180px) */
    #go-map-wrap { left: 180px; }
    body.dg-side-open #go-map-wrap { left: 200px; }
    /* v0.4.60: スマホでは mp3ミニバーが横幅100vw(高さ50px)で被るので bottom 66px に上げる */
    #go-log { width:calc(100vw - 180px); bottom:66px; }
    #go-warmeter { width: 240px; height: 20px; }
    #go-warmeter .go-warmeter-text { line-height: 20px; font-size: 13px; }
}

/* ============================================================
 *  v0.4.35 フォントサイズ統一: 下限13px / 強調15px / 見出し22px
 * ============================================================ */

/* 見出しレベル (22px) */
#go-lobby h2 { font-size: 22px; }
.go-result-title { font-size: 28px; }
.go-start-btn { font-size: 22px; padding: 14px 36px; }

/* 強調レベル (15px) */
.go-map-card h3 { font-size: 18px; margin-bottom: 6px; }
.go-settings label { font-size: 15px; }
.go-settings select { font-size: 15px; padding: 6px 10px; }
.go-tab { font-size: 15px; padding: 10px; }
.go-unit-item { font-size: 15px; padding: 10px 14px; }
.go-uname { font-size: 15px; font-weight: 700; }
.go-hud { font-size: 16px; }
.go-hud-buttons button { font-size: 15px; padding: 6px 12px; }
.go-log { font-size: 16px; }

/* 通常レベル (13px下限) */
.go-map-card p { font-size: 13px; }
.go-result-table th { font-size: 13px; padding: 9px; letter-spacing: 0.08em; }
.go-result-table td { font-size: 15px; padding: 8px; }
.go-result-btns button { font-size: 15px; padding: 11px 24px; }
.go-result-table .rank { font-size: 16px; width: 38px; }
.go-ustat { font-size: 13px; }
.go-char-card .cc-name { font-size: 13px; }
.go-char-card .cc-rank { font-size: 13px; padding: 2px 6px; }
.go-char-card .cc-class { font-size: 13px; padding: 2px 6px; }
.go-char-card .cc-stats { font-size: 13px; margin-top: 3px; }
.go-char-card .cc-weapon { font-size: 13px; }
.go-warmeter-text { font-size: 14px; }

/* HUDセレクト系も大きく */
.go-hud select { font-size: 13px !important; padding: 4px 8px !important; }
#go-win-record { font-size: 13px !important; }

/* ============================================================
 *  v0.4.39 リザルト画面リッチ化
 * ============================================================ */

/* MVPサマリ: 上部に大ポートレート + ACE POINT */
.go-result-mvp-banner {
    display: flex; gap: 16px;
    background: linear-gradient(135deg, rgba(255,215,0,0.12), rgba(180,120,0,0.06));
    border: 1px solid rgba(255,215,0,0.4);
    border-radius: 10px;
    padding: 12px;
    margin-bottom: 16px;
    align-items: center;
    box-shadow: inset 0 0 20px rgba(255,215,0,0.1);
    animation: go-mvp-banner-glow 3s ease-in-out infinite alternate;
}
@keyframes go-mvp-banner-glow {
    from { box-shadow: inset 0 0 20px rgba(255,215,0,0.08); }
    to   { box-shadow: inset 0 0 32px rgba(255,215,0,0.18), 0 0 40px rgba(255,215,0,0.15); }
}
.go-result-mvp-portrait {
    width: 90px; height: 110px;
    border-radius: 8px;
    border: 2px solid #ffd700;
    object-fit: cover;
    object-position: center 20%;
    box-shadow: 0 0 20px rgba(255,215,0,0.4);
    flex-shrink: 0;
    background: #222;
}
.go-result-mvp-info {
    flex: 1; min-width: 0;
}
.go-result-mvp-label {
    font-size: 13px; color: #ffd700;
    letter-spacing: 0.2em;
    font-weight: 700;
}
.go-result-mvp-name {
    font-size: 22px; color: #fff;
    font-weight: 800;
    text-shadow: 0 0 8px rgba(255,215,0,0.5);
    margin: 2px 0;
}
.go-result-mvp-stats {
    display: flex; gap: 14px;
    font-size: 13px; color: #aaa;
}
.go-result-mvp-stats span strong { color: #fff; font-size: 15px; }

/* バトルサマリ (時間/ターン/総キル) */
.go-result-summary {
    display: grid; grid-template-columns: repeat(4, 1fr);
    gap: 8px;
    margin-bottom: 14px;
}
.go-result-summary-cell {
    background: rgba(0,0,0,0.4);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 6px;
    padding: 10px;
    text-align: center;
}
.go-result-summary-label {
    font-size: 13px; color: #888;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.go-result-summary-value {
    font-size: 22px; color: #fff;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    margin-top: 4px;
}
.go-result-summary-value.win-a { color: #5ab5ff; }
.go-result-summary-value.win-b { color: #ff7070; }

/* テーブル列拡張 (Lv追加) */
.go-result-table .lv {
    color: #ffd700;
    font-weight: 700;
    text-align: center;
    width: 40px;
}

/* キャラアイコン強化 */
.go-result-table .name img {
    width: 30px !important; height: 30px !important;
    border: 2px solid currentColor;
    box-shadow: 0 1px 4px rgba(0,0,0,0.5);
}
