@charset "utf-8";

/* ============================================ */
/* ============ CSS VARIABLES ================= */
/* ============================================ */
:root{
  --c-primary:#17256c;
  --c-primary-2:#2c2a6d;
  --c-primary-3:#5f5f94;
  --c-primary-4:#8b8bb4;
  --c-accent:#b52025;
  --c-accent-2:#d72638;
  --c-text:#333;
  --c-text-sub:#666;
  --c-bg:#eaeaea;
  --c-card:#ffffff;
  --c-line:#dedede;
  --c-line-2:#9898bc;
  --c-row-alt:#f6f6fa;
  --c-row-hover:#fff5d6;
  --c-label:#595959;
  --c-gold-1:#d4af37;
  --c-gold-2:#f7e98e;
  --c-silver-1:#c0c0c0;
  --c-silver-2:#eaeaea;
  --c-bronze-1:#cd7f32;
  --c-bronze-2:#ffd9a8;
  --c-pos:#1f8a3a;
  --c-neg:#c0392b;
  --shadow-md:0 0 5px 5px rgba(0,0,0,.3);
  --transition:.3s ease-in-out;
}
/* ===== RESET ===== */
*,*::before,*::after{box-sizing:border-box}
html,body,div,h1,h2,h3,h4,h5,h6,p,address,blockquote,
ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,input{margin:0;padding:0;font-size:100%}
body{
  font-family:"メイリオ","MS PGothic","Osaka","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Geneva,Arial,Helvetica,sans-serif;
  color:var(--c-text);font-size:13px;line-height:1.0;text-align:center;
  background:var(--c-bg);-webkit-text-size-adjust:100%;
  transition:background var(--transition),color var(--transition);
}
h1,h2,h3,h4,h5,h6,dt,dd,th{font-weight:normal}
table{border-collapse:collapse;border-spacing:0}
ul li{list-style:none}
img{border:0;vertical-align:bottom;max-width:100%;height:auto}
a{text-decoration:none;color:inherit;transition:var(--transition)}
a:hover{opacity:.7}
button{background:none;border:0;cursor:pointer;font:inherit;color:inherit}
input{font:inherit}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--c-primary);color:#fff;padding:10px 16px;z-index:9999}
.skip-link:focus{left:8px;top:8px}
:focus-visible{outline:2px solid #ffb400;outline-offset:2px;border-radius:2px}

.inner{width:1120px;margin:0 auto}
.content{
  width:1140px;margin:0 auto;
  box-shadow:var(--shadow-md);background:var(--c-card);
  position:relative;transition:background var(--transition);
}

/* ============================================ */
/* ===== HEADER ===============================  */
/* ============================================ */
#header{
  background:var(--c-primary);
  height:67px;position:relative;z-index:10;
}
#header .inner{
  padding:0 16px;
  height:67px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  width:1120px;
  max-width:100%;
  margin:0 auto;
  position:relative;
}
#header .logo{text-align:left;display:flex;align-items:center;flex-shrink:0}
#header .logo img{height:50px;width:auto;display:block}
#header #nav{
  display:flex;
  align-items:center;
  margin-left:auto;
}
#header #nav ul{display:flex;align-items:center;gap:8px;margin:0}
#header #nav li{position:relative;display:flex;align-items:center}
#header #nav li a{display:flex;align-items:center;line-height:1}
#header #nav li a img{height:40px;width:auto;display:block}

/* ============================================ */
/* === ヘッダーナビボタン（洗練デザイン） ===== */
/* ============================================ */
.nav-btn{
  display:inline-flex !important;
  align-items:center;
  gap:8px;
  height:38px;
  padding:0 16px;
  border-radius:999px;
  color:#fff !important;
  font-size:13px;
  font-weight:bold;
  letter-spacing:.06em;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  transition:color .2s,transform .15s;
}
/* グラデーション背景レイヤー */
.nav-btn::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(135deg,rgba(255,255,255,.14),rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.22);
  z-index:-1;
  transition:background .25s,border-color .25s,box-shadow .25s;
}
/* ホバー時の光彩 */
.nav-btn::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:radial-gradient(ellipse at top, rgba(255,255,255,.25), transparent 60%);
  opacity:0;
  z-index:-1;
  transition:opacity .25s;
}
.nav-btn:hover{
  opacity:1;
  transform:translateY(-1px);
}
.nav-btn:hover::before{
  background:linear-gradient(135deg,rgba(255,255,255,.24),rgba(255,255,255,.08));
  border-color:rgba(255,255,255,.42);
  box-shadow:0 4px 14px rgba(0,0,0,.18);
}
.nav-btn:hover::after{opacity:1}

.nav-btn-ico{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;height:18px;
  flex-shrink:0;
  color:#fff;
}
.nav-btn-ico svg{display:block}
.nav-btn-text{
  white-space:nowrap;
  font-feature-settings:"palt";
}

/* スコア管理：強調アクセント */
.nav-btn-score::before{
  background:linear-gradient(135deg,rgba(255,180,0,.22),rgba(181,32,37,.18));
  border-color:rgba(255,200,80,.35);
}
.nav-btn-score:hover::before{
  background:linear-gradient(135deg,rgba(255,180,0,.36),rgba(181,32,37,.30));
  border-color:rgba(255,200,80,.6);
  box-shadow:0 4px 16px rgba(181,32,37,.35);
}
.nav-btn-score .nav-btn-ico{color:#ffd66b}

/* メニュー：開いている時の状態 */
.nav-btn-menu[aria-expanded="true"]::before{
  background:linear-gradient(135deg,rgba(255,255,255,.28),rgba(255,255,255,.12));
  border-color:rgba(255,255,255,.5);
}

/* ナビメニューパネル */
#header #nav .nav-menu{position:relative}
.nav-menu-body{
  position:absolute;
  right:0;
  top:64px;
  width:320px;
  background:linear-gradient(180deg,#fff 0%,#fafbff 100%);
  border:0;
  border-radius:10px;
  font-size:14px;
  padding:10px;
  display:none;
  opacity:0;
  transform:translateY(-8px) scale(.96);
  transform-origin:top right;
  z-index:50;
  text-align:left;
  box-shadow:0 18px 50px rgba(15,20,55,.28),0 2px 6px rgba(15,20,55,.08);
  transition:opacity .22s ease,transform .22s ease;
}
.nav-menu-body::before{
  content:"";
  position:absolute;
  top:-6px;right:18px;
  width:12px;height:12px;
  background:#fff;
  transform:rotate(45deg);
  box-shadow:-2px -2px 4px rgba(15,20,55,.05);
}
.nav-menu-body.open{
  display:block;
  animation:menuFadeIn .22s ease forwards;
}
@keyframes menuFadeIn{
  to{opacity:1;transform:translateY(0) scale(1)}
}
.nav-menu-body ul{
  display:flex !important;
  flex-wrap:wrap;
  gap:6px !important;
  margin:0;
  padding:0;
}
.nav-menu-body ul + ul{margin-top:0}
.nav-menu-body li{
  width:calc(50% - 3px);
  text-align:center;
  position:relative;
}
.nav-menu-body li a{
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border-radius:8px;
  background:transparent;
  transition:background .18s,transform .15s;
  position:relative;
  overflow:hidden;
}
.nav-menu-body li a::before{
  content:"";
  position:absolute;
  left:0;top:0;bottom:0;
  width:3px;
  background:var(--c-accent);
  transform:scaleY(0);
  transform-origin:center;
  transition:transform .18s;
}
.nav-menu-body li a:hover{
  background:rgba(44,42,109,.06);
  opacity:1;
  transform:translateX(2px);
}
.nav-menu-body li a:hover::before{transform:scaleY(1)}
.nav-menu-body li a img{
  height:28px !important;
  width:28px !important;
  margin:0 !important;
  object-fit:contain;
  flex-shrink:0;
}
.nav-menu-body li a p{
  color:var(--c-primary-2);
  font-size:13px;
  padding:0;
  font-weight:bold;
  letter-spacing:.02em;
  text-align:left;
  line-height:1.2;
}
/* Non-navigable menu entry (page not hosted yet) — reuses the link layout
   but is dimmed and not interactive. */
.nav-menu-body li a.nav-menu-static{
  cursor:default;
  opacity:.4;
}
.nav-menu-body li a.nav-menu-static:hover{
  background:transparent;
  transform:none;
  opacity:.4;
}
.nav-menu-body li a.nav-menu-static:hover::before{transform:scaleY(0)}
/* Current page — shown at full opacity with a soft highlight. */
.nav-menu-body li a.nav-menu-static.is-current{
  opacity:1;
  background:rgba(44,42,109,.08);
}
.nav-menu-body li a.nav-menu-static.is-current:hover{
  background:rgba(44,42,109,.08);
}

/* ============================================ */
/* ===== KEY VISUAL ==========================  */
/* ============================================ */
#main{position:relative}
.kv-wrap{position:relative;overflow:hidden}
#main .kv{width:100%;height:auto;display:block}

/* オーバーレイ */
.kv-overlay{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  background:linear-gradient(135deg,rgba(23,37,108,.94),rgba(44,42,109,.9));
  color:#fff;
  padding:22px 28px 24px;
  border-radius:6px;
  text-align:center;
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  box-shadow:0 8px 24px rgba(0,0,0,.5);
  min-width:280px;
  max-width:360px;
  z-index:3;
}
.kv-tag{font-size:10px;letter-spacing:.3em;color:#ffb400;font-weight:bold;margin-bottom:6px}
.kv-next{font-size:24px;font-weight:bold;line-height:1.1;margin-bottom:4px}
.kv-next span{font-size:14px;opacity:.85}
/* 取得中はスケルトン (薄い帯) を出し、partials.js が日付を書き込んだ瞬間
   .is-loading を外し .is-ready でフェードインさせる。動作不能時 (JS無効や
   API失敗) のフォールバックとして JS 起動時に確実に .is-loading が付く。 */
.kv-next.is-loading{color:transparent;display:inline-block;border-radius:4px;
  background:linear-gradient(90deg,rgba(255,255,255,.18) 0%,rgba(255,255,255,.36) 50%,rgba(255,255,255,.18) 100%);
  background-size:200% 100%;animation:kvNextShimmer 1.4s linear infinite;
  min-width:9.5em;height:1.1em;vertical-align:middle}
.kv-next.is-loading span{visibility:hidden}
.kv-next.is-ready{animation:kvNextFadeIn .35s ease both}
.kv-next-tba{font-size:18px;letter-spacing:.08em;color:#ffd35e}
@keyframes kvNextShimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
@keyframes kvNextFadeIn{from{opacity:0;transform:translateY(2px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){
  .kv-next.is-loading{animation:none}
  .kv-next.is-ready{animation:none}
}
.kv-next-sub{font-size:12px;opacity:.85;margin-bottom:14px;line-height:1.4}
.kv-cta{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-top:14px;
  background:var(--c-accent);
  color:#fff !important;
  padding:10px 20px;
  font-size:13px;
  font-weight:bold;
  letter-spacing:.12em;
  border-radius:3px;
  transition:background .2s,transform .15s;
}
.kv-cta:hover{background:var(--c-accent-2);opacity:1;transform:translateX(2px)}

/* 数値カード */
.kv-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  background:var(--c-card);
  border-bottom:1px solid var(--c-line);
}
.kv-stats li{
  padding:18px 10px;text-align:center;
  border-right:1px solid var(--c-line);
  display:flex;flex-direction:column;gap:6px;
}
.kv-stats li:last-child{border-right:0}
.ks-num{font-size:28px;font-weight:bold;color:var(--c-primary);letter-spacing:.04em;line-height:1}
.ks-lbl{font-size:10px;letter-spacing:.3em;color:var(--c-text-sub);font-weight:bold}

/* スコア管理への導線（トップページ目立つ位置） */
.kv-score{
  background:var(--c-card);
  border-bottom:1px solid var(--c-line);
  padding:18px 20px;
  display:flex;
  justify-content:center;
}
.kv-score-btn{
  display:inline-flex;
  align-items:center;
  gap:14px;
  max-width:560px;
  width:100%;
  padding:16px 24px;
  background:linear-gradient(135deg,var(--c-primary) 0%,var(--c-primary-2) 100%);
  color:#fff !important;
  border-radius:10px;
  box-shadow:0 6px 18px rgba(23,37,108,.28);
  transition:transform .15s,box-shadow .15s;
}
.kv-score-btn:hover{
  opacity:1;
  transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(23,37,108,.36);
}
.kv-score-ico{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:44px;height:44px;
  flex-shrink:0;
  border-radius:50%;
  background:rgba(255,214,107,.18);
  color:#ffd66b;
}
.kv-score-text{
  display:flex;
  flex-direction:column;
  gap:3px;
  text-align:left;
  flex:1;
}
.kv-score-title{font-size:17px;font-weight:bold;letter-spacing:.04em}
.kv-score-sub{font-size:11px;color:rgba(255,255,255,.78)}
.kv-score-arrow{font-size:20px;flex-shrink:0;color:#ffd66b}

/* チームロゴ帯 */
#main .team-logs{
  display:flex;flex-wrap:wrap;
  justify-content:center;align-items:center;
  gap:14px 21px;padding:18px 20px;
  background:var(--c-card);
  border-bottom:1px solid var(--c-line);
}
#main .team-logs li{display:flex;align-items:center;justify-content:center;height:30px}
#main .team-logs li img{height:26px;width:auto;object-fit:contain}

/* ============================================ */
/* ===== SEASON DATA =========================  */
/* ============================================ */
#season-data{margin:60px auto 0;padding-bottom:60px}
#season-data h2{font-size:33px;margin:0 auto 30px;text-align:center}
#season-data h2 img{width:420px;max-width:90%}
#season-data .inner{overflow:hidden;margin:0 auto;padding:0 0 30px}

/* 順位表ツールバー */
.standings-toolbar{
  display:flex;align-items:center;justify-content:space-between;
  padding:0 10px 12px;flex-wrap:wrap;gap:10px;
}
.standings-title{
  font-size:18px;font-weight:bold;color:var(--c-primary-2);
  position:relative;padding-left:14px;text-align:left;
}
.standings-title::before{
  content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:5px;height:18px;background:var(--c-accent);
}
.standings-title small{font-size:12px;color:var(--c-text-sub);font-weight:normal;margin-left:6px}
.view-toggle{
  display:inline-flex;background:var(--c-bg);
  border:1px solid var(--c-line);border-radius:4px;padding:3px;
}
.vt-btn{padding:6px 14px;font-size:12px;font-weight:bold;border-radius:3px;color:var(--c-text-sub);transition:background .2s,color .2s}
.vt-btn.active{background:var(--c-primary-2);color:#fff}
.vt-btn:hover:not(.active){background:rgba(0,0,0,.05)}

/* 順位表 */
#season-data .league-data{margin:0 auto 60px;padding:0 10px}
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
#season-data table{width:100%;min-width:920px;border:1px solid var(--c-primary-2);table-layout:auto}
#season-data .label{background:var(--c-label);color:#fff;font-size:12px;border:1px solid var(--c-label)}
#season-data .label th{padding:6px 4px;line-height:1.2;font-weight:normal;text-align:center;border:1px solid #888}
#season-data .label th.th-team{width:140px}

#season-data td{
  border:1px solid #929292;padding:6px 4px;font-size:12px;
  text-align:center;background:var(--c-card);height:38px;color:var(--c-text);
  vertical-align:middle;
}
#season-data td.team-td{
  text-align:left;padding-left:8px;
  cursor:pointer;line-height:1.25;
  max-width:160px;
  overflow:hidden;
}
#season-data td.team-td img{
  display:inline-block;width:24px;height:24px;
  object-fit:contain;vertical-align:middle;margin-right:6px;
  float:left;
}
#season-data td.team-td .ltlabel{
  display:block;
  font-size:12px;font-weight:bold;color:var(--c-primary-2);
  overflow:hidden;
  padding-top:4px;
  word-break:break-all;
}
#season-data td.team-td a{
  display:block;color:inherit;text-decoration:none;
}
#season-data td.team-td a:hover .ltlabel{text-decoration:underline}

/* 順位バッジ */
#season-data td.rk{font-weight:bold;color:var(--c-primary-2);width:54px}
.rank-badge{
  display:inline-flex;align-items:center;justify-content:center;
  width:26px;height:26px;border-radius:50%;
  font-weight:bold;font-size:13px;color:#fff;
  box-shadow:0 1px 3px rgba(0,0,0,.25);
}
.rank-badge.gold{background:linear-gradient(135deg,var(--c-gold-2),var(--c-gold-1))}
.rank-badge.silver{background:linear-gradient(135deg,var(--c-silver-2),var(--c-silver-1));color:#444}
.rank-badge.bronze{background:linear-gradient(135deg,var(--c-bronze-2),var(--c-bronze-1))}

/* 上位3チームの行 */
.rank-1 td{background:linear-gradient(90deg,rgba(212,175,55,.18),rgba(212,175,55,0) 40%)}
.rank-2 td{background:linear-gradient(90deg,rgba(192,192,192,.22),rgba(192,192,192,0) 40%)}
.rank-3 td{background:linear-gradient(90deg,rgba(205,127,50,.18),rgba(205,127,50,0) 40%)}

/* 勝率セル - 太字のみ、背景なし */
#season-data td.th-rate{font-weight:bold;color:var(--c-primary-2)}
.rank-1 td.th-rate b{color:var(--c-accent)}

.diff-pos{color:var(--c-pos);font-weight:bold}
.diff-neg{color:var(--c-neg);font-weight:bold}

#season-data .league-I tr:nth-child(even) td{background:var(--c-row-alt)}
#season-data .league-I tr.rank-1:nth-child(even) td,
#season-data .league-I tr.rank-2:nth-child(even) td,
#season-data .league-I tr.rank-3:nth-child(even) td{background:initial}
#season-data .league-I tbody tr:hover td{background:var(--c-row-hover) !important;transition:.15s}

/* コンパクトビュー */
.league-I[data-view="compact"] .col-full{display:none}

.update{text-align:right;font-size:11px;color:var(--c-text-sub);margin-top:10px;padding-right:6px}

/* ============================================ */
/* ===== PERSONAL DATA (タブ) =================  */
/* ============================================ */
#season-data .inner .personal-data{
  float:left;
  width:778px;
  padding-left:10px;
  box-sizing:border-box;
  overflow:hidden;
}

/* === タブ - 画像ベース（元サイト準拠） === */
.personal-data .tabs{
  display:block;
  overflow:hidden;
  margin-bottom:0;
}
.personal-data .tabs li{
  width:33.12%;
  float:left;
  margin-left:0.32%;
  background:#e6e6e6;
  list-style:none;
}
.personal-data .tabs li:first-child{margin-left:0}
.personal-data .tabs li a{
  display:block;
  height:40px;
  font-size:16px;
  padding:12px 0;
  box-sizing:border-box;
  text-indent:-9999px;
  background-repeat:no-repeat;
  background-position:center 15px;
}
/* 各タブの画像（このCSSは assets/ 内にあるため画像はファイル名のみで参照） */
.personal-data .tabs li.batterranking a{background-image:url(batterranking_o.png)}
.personal-data .tabs li.batterranking a.active{background-image:url(batterranking.png)}
.personal-data .tabs li.pitcherranking a{background-image:url(pitcherranking_o.png)}
.personal-data .tabs li.pitcherranking a.active{background-image:url(pitcherranking.png)}
.personal-data .tabs li.matchresults a{background-image:url(matchresults_o.png)}
.personal-data .tabs li.matchresults a.active{background-image:url(matchresults.png)}
.personal-data .tabs li a.active{
  background-color:var(--c-primary-2);
}
.personal-data .tabs li a:hover{opacity:.85}

/* === タブパネル基本表示制御 === */
.table-index{
  display:none;
  padding:5px;
  background:var(--c-primary-2);
}
.table-index.active{display:block}

/* ===================================================== */
/* === BATTER / PITCHER RANKING - カード型UI（モバイルファースト） === */
/* ===================================================== */
.rank-panel{
  display:none;
  background:#f0f1f8;
  padding:14px;
  border-radius:0 0 6px 6px;
}
.rank-panel.active{display:block}

/* セクションヘッダ */
.rank-head{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-bottom:14px;
}
.rank-title{
  font-size:16px;
  font-weight:bold;
  color:var(--c-primary-2);
  padding-left:10px;
  border-left:4px solid var(--c-accent);
  line-height:1.2;
}
/* ソートピル */
.rank-sort{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.rank-sort::-webkit-scrollbar{display:none}
.rs-btn{
  flex-shrink:0;
  padding:7px 14px;
  font-size:12px;
  font-weight:bold;
  color:var(--c-primary-2);
  background:#fff;
  border:1px solid #d4d6e3;
  border-radius:999px;
  cursor:pointer;
  transition:all .18s;
  white-space:nowrap;
}
.rs-btn:hover{
  background:#f0f1f8;
  border-color:var(--c-primary-2);
}
.rs-btn.active{
  background:var(--c-primary-2);
  color:#fff;
  border-color:var(--c-primary-2);
  box-shadow:0 2px 6px rgba(44,42,109,.25);
}

/* ランキング一覧 */
.rank-list{
  display:flex;
  flex-direction:column;
  gap:8px;
  list-style:none;
  padding:0;
  margin:0;
}
/* 0除外・上位30名表示制御 */
.rank-item.is-hidden,
.rank-item.is-over-limit{display:none}

/* ローディング/エラー表示 */
.rank-status{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:32px 16px;
  background:#fff;
  border-radius:8px;
  color:var(--c-text-sub);
  font-size:13px;
  text-align:center;
  list-style:none;
  position:relative;
}
.rank-status::before{
  content:"";
  display:inline-block;
  width:14px;height:14px;
  margin-right:10px;
  border:2px solid var(--c-line);
  border-top-color:var(--c-primary-2);
  border-radius:50%;
  animation:spin 0.8s linear infinite;
}
.rank-status.is-error{
  color:var(--c-accent);
  background:#fff5f5;
  border:1px solid #f5d4d4;
}
.rank-status.is-error::before{
  content:"⚠";
  border:0;
  width:auto;height:auto;
  font-size:16px;
  animation:none;
  color:var(--c-accent);
}
@keyframes spin{
  to{transform:rotate(360deg)}
}

/* カード本体 */
.rank-item{
  display:grid;
  grid-template-columns:32px 36px 1fr auto;
  grid-template-areas:
    "no team info main"
    "stats stats stats stats";
  gap:6px 10px;
  align-items:center;
  background:#fff;
  padding:10px 12px;
  border-radius:8px;
  box-shadow:0 1px 3px rgba(15,20,55,.06);
  position:relative;
  transition:transform .15s,box-shadow .15s;
}
.rank-item:hover{
  transform:translateY(-1px);
  box-shadow:0 4px 12px rgba(15,20,55,.1);
}
/* 上位3名にアクセント（同率対応） */
.rank-item.is-rank-1{
  background:linear-gradient(135deg,#fffceb 0%,#fff 60%);
  border-left:3px solid #d4af37;
}
.rank-item.is-rank-2{
  background:linear-gradient(135deg,#f7f7f9 0%,#fff 60%);
  border-left:3px solid #c0c0c0;
}
.rank-item.is-rank-3{
  background:linear-gradient(135deg,#fdf3eb 0%,#fff 60%);
  border-left:3px solid #cd7f32;
}

/* 順位バッジ */
.rk-no{
  grid-area:no;
  display:flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  font-size:13px;
  font-weight:bold;
  color:var(--c-primary-2);
  background:#f0f1f8;
  border-radius:50%;
}
.rank-item.is-rank-1 .rk-no{
  background:linear-gradient(135deg,#f7e98e,#d4af37);
  color:#fff;
  box-shadow:0 2px 4px rgba(212,175,55,.4);
}
.rank-item.is-rank-2 .rk-no{
  background:linear-gradient(135deg,#eaeaea,#c0c0c0);
  color:#444;
}
.rank-item.is-rank-3 .rk-no{
  background:linear-gradient(135deg,#ffd9a8,#cd7f32);
  color:#fff;
}

/* チームロゴ */
.rk-team{
  grid-area:team;
  display:flex;
  align-items:center;
  justify-content:center;
}
.rk-team img{
  width:32px;
  height:32px;
  object-fit:contain;
  border-radius:4px;
}

/* 選手情報 */
.rk-info{
  grid-area:info;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.rk-name{
  font-size:13px;
  font-weight:bold;
  color:#222;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  line-height:1.25;
}
.rk-no2{
  font-size:11px;
  color:var(--c-text-sub);
  font-weight:normal;
  margin-left:4px;
}
.rk-team-name{
  font-size:10px;
  color:var(--c-text-sub);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  line-height:1.2;
}

/* メイン指標（大きく表示） */
.rk-main{
  grid-area:main;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:1px;
  padding-left:6px;
  min-width:55px;
}
.rk-main-v{
  font-size:20px;
  font-weight:bold;
  color:var(--c-primary-2);
  line-height:1;
  font-feature-settings:"tnum";
  font-variant-numeric:tabular-nums;
}
.rk-main-v.hot{color:var(--c-accent)}
.rk-main-l{
  font-size:10px;
  color:var(--c-text-sub);
  font-weight:normal;
  letter-spacing:.05em;
}

/* サブ統計 */
.rk-stats{
  grid-area:stats;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:3px;
  list-style:none;
  padding:8px 0 0;
  margin:6px 0 0;
  border-top:1px dashed #e0e1eb;
}
.rk-stats li{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:1px;
  padding:2px 0;
}
.rs-l{
  font-size:9px;
  color:var(--c-text-sub);
  letter-spacing:.04em;
}
.rs-v{
  font-size:12px;
  font-weight:bold;
  color:#333;
  font-feature-settings:"tnum";
}
.rs-v.hot{color:var(--c-accent)}

/* PC表示時の最適化 */
@media (min-width:641px){
  .rank-panel{padding:18px}
  .rank-head{
    flex-direction:row;
    justify-content:space-between;
    align-items:center;
    margin-bottom:18px;
  }
  .rank-title{font-size:18px}
  .rank-item{
    grid-template-columns:40px 44px 1fr 120px;
    gap:8px 14px;
    padding:14px 18px;
  }
  .rk-no{width:34px;height:34px;font-size:15px}
  .rk-team img{width:38px;height:38px}
  .rk-name{font-size:15px}
  .rk-no2{font-size:12px}
  .rk-team-name{font-size:11px}
  .rk-main-v{font-size:26px}
  .rk-main-l{font-size:11px}
  .rk-stats{grid-template-columns:repeat(8,1fr);gap:4px;padding-top:10px;margin-top:10px}
  .rs-l{font-size:10px}
  .rs-v{font-size:13px}
}

/* 個人成績テーブル - 元サイト準拠 */
.personal-data table{
  font-size:13px;
}
.personal-data table .label th{
  border:1px solid #fff;
  background:#8b8bb4;
  color:#fff;
  vertical-align:middle;
  line-height:1.4;
  font-weight:normal;
  padding:0;
  text-align:center;
}
.personal-data table .label th.StrongPoint{background:#5f5f94}
.personal-data table td{
  border:1px solid #9898bc;
  text-align:center;
  background:#fff;
  color:#333;
  padding:0;
}
.personal-data table td.nm{
  text-align:center;
  white-space:nowrap;
  color:#333;
}
.personal-data table td img{
  margin:0;
  display:inline-block;
  vertical-align:middle;
}
.personal-data table td.hot{color:#ff0000;font-weight:bold}
.personal-data table td.hot b{color:#ff0000}

/* ============================================ */
/* ===== MatchResults ========================  */
/* ============================================ */
.match-grid{padding:14px 16px;background:var(--c-card)}
.match-h{
  font-size:15px;font-weight:bold;color:var(--c-primary-2);
  padding:8px 12px;border-left:5px solid var(--c-accent);
  margin-bottom:14px;text-align:left;
}

/* === アコーディオン === */
.match-accordion{
  display:flex;
  flex-direction:column;
  gap:6px;
}
/* 試合結果の取得中 / 取得失敗 / 0件 表示 */
.match-empty{
  margin:0;
  padding:32px 16px;
  background:#fff;
  border-radius:8px;
  color:var(--c-text-sub);
  font-size:13px;
  text-align:center;
}
.match-empty.is-error{
  color:var(--c-accent);
  background:#fff5f5;
  border:1px solid #f5d4d4;
}
.acc-item{
  border:1px solid var(--c-line);
  border-radius:4px;
  background:var(--c-card);
  overflow:hidden;
}
.acc-head{
  display:flex;
  align-items:center;
  gap:12px;
  width:100%;
  padding:14px 16px;
  background:linear-gradient(180deg,#fafbff,#f0f1f8);
  text-align:left;
  cursor:pointer;
  transition:background .2s;
  border-bottom:1px solid transparent;
}
.acc-head:hover{background:linear-gradient(180deg,#f0f1f8,#e6e8f3)}
.acc-item.open .acc-head{
  background:var(--c-primary-2);
  color:#fff;
  border-bottom-color:var(--c-accent);
}
.acc-item.open .acc-head:hover{background:var(--c-primary-2)}
.acc-date{
  flex:1;
  font-size:14px;
  font-weight:bold;
  color:var(--c-primary-2);
}
.acc-item.open .acc-date{color:#fff}
.acc-count{
  font-size:11px;
  color:var(--c-text-sub);
  padding:3px 8px;
  background:rgba(0,0,0,.06);
  border-radius:3px;
  flex-shrink:0;
}
.acc-item.open .acc-count{background:rgba(255,255,255,.18);color:#fff}
.acc-arr{
  font-size:11px;
  color:var(--c-primary-2);
  transition:transform .2s;
  flex-shrink:0;
}
.acc-item.open .acc-arr{
  color:#fff;
  transform:rotate(180deg);
}
.acc-body{
  display:none;
  padding:12px 14px;
}
.acc-item.open .acc-body{display:block}
.acc-body .match-list{margin:0}
.match-list{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.match-list li{
  display:grid;grid-template-columns:1fr auto 1fr;
  align-items:center;gap:12px;
  padding:12px 14px;border:1px solid var(--c-line);
  background:var(--c-card);font-size:12px;
  position:relative;border-radius:4px;
  transition:transform .15s,box-shadow .15s;
}
.match-list li:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.06)}
.match-list .vs{display:flex;align-items:center;gap:6px;min-width:0}
.match-list .vs.vs-r{justify-content:flex-end;text-align:right}
.match-list .vs img{width:24px;height:24px;object-fit:contain;flex-shrink:0}
.match-list .vs b{font-size:12px;font-weight:bold;color:var(--c-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.match-list .score{
  font-size:20px;font-weight:bold;color:#888;
  font-feature-settings:"tnum";white-space:nowrap;
  display:inline-flex;align-items:baseline;gap:4px;
}
.match-list .score em{font-style:normal;color:#888}
.match-list .score em.dash{font-size:14px;color:#aaa}
.match-list .score em.win{color:var(--c-accent);font-size:24px}

/* === 星取表 === */
.star-table-wrap{
  background:var(--c-card);
  border-radius:6px;
}
.star-table-scroll{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border:1px solid var(--c-line);
  border-radius:6px;
  background:#fff;
}
.star-table{
  border-collapse:separate;
  border-spacing:0;
  width:max-content;
  min-width:100%;
  font-size:13px;
  table-layout:fixed;
}
.star-table th,
.star-table td{
  border-right:1px solid var(--c-line);
  border-bottom:1px solid var(--c-line);
  background:#fff;
  text-align:center;
  vertical-align:middle;
  padding:0;
  width:56px;
  min-width:56px;
  height:56px;
  box-sizing:border-box;
}
.star-table thead th{
  position:sticky;
  top:0;
  z-index:3;
  background:linear-gradient(180deg,#f0f1f8,#e6e8f3);
  border-bottom:2px solid var(--c-primary-2);
}
.star-table .st-corner{
  position:sticky;
  left:0;
  top:0;
  z-index:5;
  background:linear-gradient(180deg,#f0f1f8,#e6e8f3);
  border-right:2px solid var(--c-primary-2);
  width:120px;
  min-width:120px;
}
.star-table .st-head-row{
  position:sticky;
  left:0;
  z-index:2;
  background:#fafbff;
  border-right:2px solid var(--c-primary-2);
  width:120px;
  min-width:120px;
  text-align:left;
  padding:0 6px;
}
.st-team-head{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:2px;
  text-decoration:none;
  color:var(--c-primary-2);
  font-weight:bold;
  padding:4px 2px;
  font-size:10px;
  line-height:1.15;
}
.st-team-head img{
  object-fit:contain;
  display:block;
}
.st-team-head-name{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:100%;
  word-break:break-all;
}
.st-team-head-row{
  flex-direction:row;
  justify-content:flex-start;
  gap:6px;
  text-align:left;
  font-size:11px;
}
.st-team-head-row .st-team-head-name{
  -webkit-line-clamp:2;
}
.star-table tbody th.st-head-row:hover,
.star-table thead th .st-team-head:hover{
  background:#eef0fa;
}
.st-self{
  background:repeating-linear-gradient(45deg,#f4f5fb,#f4f5fb 6px,#eaecf5 6px,#eaecf5 12px);
  color:var(--c-text-sub);
  font-weight:bold;
}
.st-empty{
  background:#fff;
}
.st-cell{padding:0}
.st-mark{
  appearance:none;
  border:0;
  background:transparent;
  width:100%;
  height:100%;
  cursor:pointer;
  font-size:22px;
  font-weight:bold;
  line-height:1;
  font-family:inherit;
  transition:background .15s, transform .15s;
}
.st-mark:hover,
.st-mark:focus-visible{
  background:rgba(23,37,108,.08);
  outline:none;
}
.st-mark:focus-visible{
  box-shadow:inset 0 0 0 2px var(--c-accent);
}
.st-mark:active{transform:scale(.94)}
.st-win .st-mark{color:#d8362c}
.st-lose .st-mark{color:#444}
.st-draw .st-mark{color:#888}
.star-legend{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin:10px 4px 2px;
  font-size:12px;
  color:var(--c-text-sub);
}
.st-leg{font-weight:bold;margin-right:2px}
.st-leg-win{color:#d8362c}
.st-leg-lose{color:#444}
.st-leg-draw{color:#888}
.st-leg-note{margin-left:auto;font-size:11px;color:var(--c-text-sub)}

/* === 試合詳細ダイアログ === */
.match-dialog{
  border:0;
  border-radius:10px;
  padding:0;
  width:min(420px, 92vw);
  background:#fff;
  box-shadow:0 20px 60px rgba(0,0,0,.25);
}
.match-dialog::backdrop{
  background:rgba(15,20,40,.55);
  backdrop-filter:blur(2px);
}
.match-dialog .md-close{
  position:absolute;
  top:8px;
  right:10px;
  width:32px;
  height:32px;
  border:0;
  background:transparent;
  font-size:24px;
  color:var(--c-text-sub);
  cursor:pointer;
  line-height:1;
}
.match-dialog .md-close:hover{color:var(--c-accent)}
.match-dialog .md-title{
  margin:0;
  padding:14px 44px 12px 18px;
  font-size:15px;
  font-weight:bold;
  color:#fff;
  background:var(--c-primary-2);
  border-bottom:2px solid var(--c-accent);
  border-radius:10px 10px 0 0;
}
.md-body{padding:18px}
.md-card{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:12px;
  padding:14px 10px;
  background:#fafbff;
  border:1px solid var(--c-line);
  border-radius:8px;
}
.md-team{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  min-width:0;
}
.md-team img{
  width:48px;
  height:48px;
  object-fit:contain;
}
.md-team-name{
  font-size:12px;
  font-weight:bold;
  color:var(--c-text);
  text-align:center;
  word-break:break-all;
  line-height:1.2;
}
.md-score{
  display:flex;
  align-items:baseline;
  gap:6px;
  font-weight:bold;
  font-feature-settings:"tnum";
}
.md-score-val{
  font-size:32px;
  color:#888;
  min-width:1.2em;
  text-align:center;
}
.md-score-val.is-win{color:var(--c-accent);font-size:38px}
.md-score-sep{font-size:22px;color:#aaa}
.md-result-label{
  margin:12px 0 0;
  text-align:center;
  font-weight:bold;
  font-size:14px;
}
.md-result-win-label{color:var(--c-accent)}
.md-result-lose-label{color:#444}
.md-result-draw-label{color:var(--c-text-sub)}

/* ランキングカード - クリッカブル */
.rank-item.is-clickable{
  cursor:pointer;
}
.rank-item.is-clickable:hover{
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(0,0,0,.08);
}
.rank-item-link{
  position:absolute;
  inset:0;
  z-index:1;
  border-radius:inherit;
  text-indent:-9999px;
  overflow:hidden;
  white-space:nowrap;
}
.rank-item-link:focus-visible{
  outline:2px solid var(--c-accent);
  outline-offset:2px;
}

/* ============================================ */
/* ===== SIDE ================================  */
/* ============================================ */
#side{
  float:right;
  width:300px;
  padding:5px 10px 0 0;
  text-align:left;
}

/* TEAMS見出し - 元サイト風 */
.side-h{
  font-size:24px;
  font-weight:bold;
  color:var(--c-primary-2);
  padding:0;
  margin:0 auto 30px;
  text-align:center;
  letter-spacing:.15em;
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
}
.side-h-img{display:none}
.side-h-text{
  display:inline-block;
  position:relative;
  padding:0 24px 12px;
  font-family:'Georgia','Times New Roman',serif;
  font-style:italic;
  font-size:30px;
  letter-spacing:.05em;
}
.side-h-text::before,.side-h-text::after{
  content:"";
  position:absolute;
  bottom:0;
  height:3px;
  background:var(--c-primary-2);
}
.side-h-text::before{left:0;width:30%}
.side-h-text::after{right:0;width:30%;background:var(--c-accent)}

#side .lst_team{margin:0 0 30px}
#side .lst_team li{
  border-bottom:1px solid var(--c-line);
  padding:10px 4px;
  text-align:left;
  transition:background .15s;
}
#side .lst_team li:hover{background:rgba(44,42,109,.05)}
#side .lst_team li a{display:flex;align-items:center;gap:10px}
#side .lst_team li img{width:26px;height:26px;object-fit:contain;flex-shrink:0}
#side .lst_team li p{font-size:13px;color:var(--c-text)}

/* バナー - 画像 */
.bnr{display:flex;flex-direction:column;gap:18px}
.bnr_space{margin:0}
.bnr_space a{display:block;line-height:0}
.bnr_space img{width:100%;height:auto;display:block}

/* ===== FOOTER ===== */
#footer{background:#282828;padding:24px 0 18px;text-align:center}
#footer .copyright{font-size:12px;color:#fff;letter-spacing:.04em}

/* SNS シェアボタン */
.footer-share{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  margin-bottom:18px;
}
.footer-share-label{
  font-size:11px;
  letter-spacing:.18em;
  color:#9a9aa6;
  font-weight:bold;
}
.footer-share-list{
  display:flex;
  gap:12px;
  margin:0;
  padding:0;
}
.sns-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  border-radius:50%;
  color:#fff;
  background:#3a3a3f;
  transition:transform .14s,background .14s,opacity .14s;
}
.sns-btn:hover{
  opacity:1;
  transform:translateY(-3px);
}
.sns-x:hover{background:#000}
.sns-line:hover{background:#06c755}
.sns-fb:hover{background:#1877f2}
.sns-btn svg{display:block}

.inner::after,#season-data .inner::after{content:"";display:block;clear:both}

/* ============================================ */
/* ===== カレンダーモーダル ================== */
/* ============================================ */
.cal-modal{
  position:fixed;inset:0;
  background:rgba(0,0,0,.65);
  display:none;
  align-items:center;justify-content:center;
  z-index:10000;
  padding:20px;
}
.cal-modal.open{display:flex}
.cal-modal-inner{
  background:#fff;
  border-radius:8px;
  width:100%;max-width:520px;
  max-height:90vh;
  display:flex;flex-direction:column;
  overflow:hidden;
  box-shadow:0 20px 60px rgba(0,0,0,.5);
}
.cal-modal-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 18px;
  background:var(--c-primary-2);
  color:#fff;
}
.cal-modal-head h3{font-size:16px;font-weight:bold;letter-spacing:.15em}
.cal-close{
  width:32px;height:32px;
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:24px;line-height:1;border-radius:50%;
  transition:background .2s;
}
.cal-close:hover{background:rgba(255,255,255,.2)}
.cal-modal-body{padding:14px 16px;overflow-y:auto}
.cal-modal-body iframe{width:100%;height:400px;border:0}
.cal-note{font-size:11px;color:#cc0000;margin-top:10px;line-height:1.5;text-align:left}

/* ============================================ */
/* ============= RESPONSIVE  ================== */
/* ============================================ */
@media (max-width:1180px){
  .inner{width:100%;padding:0 12px}
  #header .inner{width:100%;padding:0 16px}
  .content{width:100%;box-shadow:none}
}

@media (max-width:960px){
  #season-data{margin-top:30px;padding-bottom:40px}
  #season-data h2{margin-bottom:24px}
  #season-data h2 img{width:340px}

  .kv-overlay{padding:16px 20px;min-width:240px;max-width:300px}
  .kv-next{font-size:20px}
  .kv-score{padding:14px 16px}
  .kv-score-btn{padding:14px 18px;gap:12px}
  .kv-score-ico{width:38px;height:38px}
  .kv-score-title{font-size:15px}

  #season-data .inner .personal-data{float:none;width:100%;padding-left:0}
  #side{float:none;width:100%;padding:0;margin-top:40px}
  #side .lst_team{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:0 16px;
    margin-bottom:24px;
  }
  .bnr{flex-direction:row;flex-wrap:wrap;justify-content:center}
  .bnr_space{flex:1;min-width:240px;max-width:300px}
}

@media (max-width:640px){
  body{font-size:13px}
  .inner{padding:0 8px}

  /* ヘッダー */
  #header{height:54px}
  #header .inner{height:54px;padding:0 10px}
  #header .logo img{height:36px}
  #header #nav{margin-left:auto}
  #header #nav ul{gap:6px}
  #header #nav li a img{height:28px}
  /* スマホはアイコンのみ */
  .nav-btn-text{display:none}
  .nav-btn{
    width:40px;
    height:40px;
    padding:0;
    gap:0;
    justify-content:center;
    border-radius:50%;
  }
  .nav-btn-ico{width:20px;height:20px}
  .nav-btn-ico svg{width:20px;height:20px}
  .nav-menu-body{width:calc(100vw - 16px);right:0;max-width:340px;padding:10px;top:56px}
  .nav-menu-body li a img{height:32px !important}
  .nav-menu-body li a p{font-size:11px;padding:6px 0 0}

  /* スマホではKVオーバーレイをKV下に */
  .kv-wrap{display:flex;flex-direction:column}
  .kv-wrap picture{order:0}
  .kv-overlay{
    order:1;
    position:static;
    left:auto;
    top:auto;
    transform:none;
    margin:0;
    padding:16px 16px 20px;
    border-radius:0;
    min-width:0;
    max-width:none;
    width:100%;
    box-shadow:none;
    text-align:center;
  }
  .kv-next{font-size:20px}
  .kv-stats li{padding:14px 6px}
  .ks-num{font-size:22px}
  .ks-lbl{font-size:9px}
  #main .team-logs{gap:8px 12px;padding:12px 8px}
  #main .team-logs li{height:24px}
  #main .team-logs li img{height:22px}

  /* season-data */
  #season-data{margin-top:20px;padding-bottom:30px}
  #season-data h2{margin-bottom:20px}
  #season-data h2 img{width:80%;max-width:300px}
  #season-data .inner{padding-bottom:10px;padding:0 12px}
  #season-data .league-data{padding:0;margin-bottom:30px}

  /* === コンパクトビューは横スクロール無し・1画面に収める === */
  .league-I[data-view="compact"]{overflow:hidden;width:100%}
  .league-I[data-view="compact"] .table-wrap{overflow:hidden;width:100%}
  .league-I[data-view="compact"] table{
    min-width:0 !important;
    width:100% !important;
    table-layout:fixed;
  }
  .league-I[data-view="compact"] td,
  .league-I[data-view="compact"] th{
    font-size:10px;padding:4px 1px;
    word-break:keep-all;
    overflow:hidden;
  }
  .league-I[data-view="compact"] .label th{font-size:9px;padding:5px 1px;line-height:1.2}
  /* 列幅固定 - コンパクト: 順位/チーム/試合/勝/敗/勝率 */
  .league-I[data-view="compact"] tr.label th:nth-child(1){width:12%}  /* 順位 */
  .league-I[data-view="compact"] tr.label th:nth-child(2){width:43%}  /* チーム */
  .league-I[data-view="compact"] tr.label th:nth-child(3){width:11%}  /* 試合 */
  .league-I[data-view="compact"] tr.label th:nth-child(4){width:9%}   /* 勝 */
  .league-I[data-view="compact"] tr.label th:nth-child(5){width:9%}   /* 敗 */
  .league-I[data-view="compact"] tr.label th.th-rate{width:16%}       /* 勝率 */
  .league-I[data-view="compact"] td.rk{width:auto;padding:4px 0}
  .league-I[data-view="compact"] td.team-td{padding:4px 4px;max-width:none}
  .league-I[data-view="compact"] td.team-td img{
    width:16px;height:16px;margin-right:3px;
    display:inline-block;float:none;vertical-align:middle;
  }
  .league-I[data-view="compact"] td.team-td .ltlabel{
    display:inline-block;
    font-size:10px;
    padding-top:0;
    vertical-align:middle;
    line-height:1.15;
    max-width:calc(100% - 22px);
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .league-I[data-view="compact"] td.th-rate{font-size:10px}
  .rank-badge{width:20px;height:20px;font-size:10px}

  /* 詳細ビューは横スクロール */
  .league-I[data-view="full"] table{min-width:720px}
  .league-I[data-view="full"] td{font-size:11px;padding:5px 3px;height:34px}
  .league-I[data-view="full"] .label th{font-size:10px;padding:5px 2px}

  /* タブ - SP時は画像を縮小し枠内に収納 */
  .personal-data .tabs li a{
    height:32px;
    font-size:0;
    padding:0;
    background-size:contain !important;
    background-repeat:no-repeat !important;
    background-position:center center !important;
    background-origin:content-box !important;
    padding:6px 4px !important;
    box-sizing:border-box;
  }
  .table-index{padding:3px}

  /* match results */
  .match-list{grid-template-columns:1fr;gap:6px}
  .match-grid{padding:10px 8px}
  .match-h{font-size:13px;padding:6px 10px;margin-bottom:10px}
  .match-list li{padding:10px 12px;gap:8px}
  .match-list .vs b{font-size:11px}
  .match-list .vs img{width:20px;height:20px}
  .match-list .score{font-size:17px}
  .match-list .score em.win{font-size:20px}

  /* 星取表 (スマホ) */
  .star-table{font-size:11px}
  .star-table th,
  .star-table td{width:42px;min-width:42px;height:42px}
  .star-table .st-corner,
  .star-table .st-head-row{width:78px;min-width:78px}
  .st-team-head{font-size:9px;padding:2px}
  .st-team-head img{width:22px;height:22px}
  .st-team-head-row{gap:3px;font-size:9px}
  .st-team-head-row img{width:18px;height:18px}
  .st-mark{font-size:18px}
  .star-legend{font-size:11px;gap:8px}
  .st-leg-note{font-size:10px;width:100%;margin-left:0;margin-top:4px}

  /* 試合詳細ダイアログ */
  .match-dialog{width:min(360px, 94vw)}
  .md-body{padding:14px}
  .md-team img{width:40px;height:40px}
  .md-team-name{font-size:11px}
  .md-score-val{font-size:26px}
  .md-score-val.is-win{font-size:32px}

  /* === SIDE - スマホ余白追加 === */
  #side{padding:0 12px}
  .side-h{margin-bottom:24px}
  .side-h-text{font-size:24px}
  #side .lst_team{grid-template-columns:1fr;max-height:none;overflow:visible}
  #side .lst_team li{padding:8px 4px}
  #side .lst_team li p{font-size:13px}

  /* === bnr - スマホ余白追加 === */
  .bnr{flex-direction:column;padding:0;gap:14px;margin-top:30px}
  .bnr_space{flex:none;min-width:0;max-width:none;width:100%}
  .bnr_space img{margin:0 auto}

  #footer .copyright{font-size:10px;padding:0 8px}

  /* カレンダーモーダル */
  .cal-modal{padding:10px}
  .cal-modal-body iframe{height:340px}
}

@media (max-width:420px){
  .rank-item{
    grid-template-columns:28px 32px 1fr auto;
    padding:10px;
    gap:5px 8px;
  }
  .rk-no{width:24px;height:24px;font-size:12px}
  .rk-team img{width:28px;height:28px}
  .rk-name{font-size:12px}
  .rk-main-v{font-size:18px}
  .rk-stats{grid-template-columns:repeat(4,1fr)}
  .rs-l{font-size:8px}
  .rs-v{font-size:11px}
}

@media (max-width:380px){
  #header .logo img{height:32px}
  #season-data h2 img{max-width:260px}
  .personal-data .tabs li a{font-size:11px}
  .kv-stats li{padding:10px 4px}
  .ks-num{font-size:18px}
  .league-I[data-view="compact"] td.team-td .ltlabel{font-size:9px}
  .rank-item{
    grid-template-columns:24px 28px 1fr auto;
    padding:8px;
    gap:4px 6px;
  }
  .rk-no{width:22px;height:22px;font-size:11px}
  .rk-team img{width:26px;height:26px}
  .rk-name{font-size:11px}
  .rk-team-name{font-size:9px}
  .rk-main-v{font-size:16px}
  .rs-v{font-size:10px}
}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
}


/* ============================================ */
/* === 共通セクション見出し（全ページ統一） ==== */
/* ============================================ */
/* Used by team / player / result / regulations / join sub-pages.
   Red accent dot + gradient underline, league navy. */
.profile-section-title,
.stats-section-title,
.subpage-sec-title{
  position:relative;
  display:flex;
  align-items:center;
  gap:10px;
  font-size:17px;
  font-weight:800;
  color:var(--c-primary);
  margin:28px 0 14px;
  padding:0 0 10px;
  letter-spacing:.04em;
  border-left:none;
  text-align:left;
  line-height:1.4;
}
.profile-section-title::before,
.stats-section-title::before,
.subpage-sec-title::before{
  content:"";
  flex-shrink:0;
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--c-accent-2);
  box-shadow:0 0 0 4px rgba(215,38,61,.18);
}
.profile-section-title::after,
.stats-section-title::after,
.subpage-sec-title::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:56px;
  height:3px;
  border-radius:2px;
  background:linear-gradient(90deg,#17256c 0%,#2c4cc4 100%);
}