/* =========================
   Deep Red Weekend
========================= */

.drw-page {
  max-width: 960px;
  margin: 0 auto;
  padding: 40px 20px;
  background: #ddd;
}

.drw-month-nav {
  display: flex;
  gap: 12px;
}

.drw-month-nav a {
  padding: 6px 12px;
  border: 1px solid #ccc;
  text-decoration: none;
  color: #333;
  font-size: 14px;
}

.drw-month-nav a.active {
  background: #8f1d1d;
  color: #fff;
  border-color: #8f1d1d;
}

/* =========================
   DRW Block
========================= */

.drw-block {
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 24px;
  padding: 32px 0;
}

@media (max-width: 768px) {
  .drw-block {
    grid-template-columns: 1fr;
  }
}

/* =========================
   Player
========================= */

.drw-player {
  text-align: center;
}

.drw-player img {
  width: 120px;
  height: 120px;
  object-fit: cover;
  border-radius: 50%;
  margin-bottom: 12px;
}

.drw-player h2 {
  font-size: 18px;
  margin: 0;
}

.drw-player p {
  font-size: 13px;
  color: #666;
  margin: 4px 0 0;
}

/* =========================
   Match
========================= */

.drw-match {
  border-left: 4px solid #8f1d1d;
  padding-left: 16px;
  margin-bottom: 16px;
}

.drw-match .date {
  font-size: 12px;
  color: #8f1d1d;
  margin-bottom: 4px;
}

.drw-match .score {
  font-weight: bold;
  margin-top: 4px;
}

/* =========================
   Note
========================= */

.drw-note {
  font-size: 15px;
  line-height: 1.8;
  margin-bottom: 16px;
}

/* =========================
   YouTube
========================= */

.drw-youtube iframe {
  aspect-ratio: 16 / 9;
}


.drw-page hr {
  border: none;
  border-top: 1px solid #eee;
  margin: 40px 0;
}


.drw-page h1 {
  font-size: 28px;
  margin-bottom: 24px;
  letter-spacing: 0.08em;
}



/* ===== DRW Card ===== */

.drw-block {
  display: flex;
  gap: 24px;
  padding: 32px 0;
}

/* 左：選手 */
.drw-player {
  width: 180px;
  text-align: center;
}

.drw-player-image {
  width: 120px;
  height: 120px;
  object-fit: cover;
  border-radius: 50%;
  margin-bottom: 12px;
}

.drw-player-name h2 {
  font-size: 18px;
  margin: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
}

.drw-player-name p {
  font-size: 14px;
  margin: 4px 0 0;
  opacity: 0.7;
}

/* 国旗 */
.drw-flag {
  width: 20px;
  height: auto;
}


.drw-player-image {
  display: block;
  width: 160px;
  height: 160px;

  border-radius: 50%;
  object-fit: cover;

  margin: 0 auto 12px;
}


/* =========================
   DRW Base
========================= */
.drw-page {
  max-width: 1200px;
  margin: 0 auto;
  padding: 48px 20px 80px;
}

.drw-head h1 {
  margin: 0 0 16px;
  font-size: 40px;
  letter-spacing: 0.02em;
}

/* =========================
   Month Nav
========================= */
.drw-month-nav {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.drw-month-nav a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 14px;
  border: 1px solid #ddd;
  text-decoration: none;
  font-size: 14px;
  color: #111;
  background: #fff;
}

.drw-month-nav a.active {
  background: #7c1013;
  border-color: #7c1013;
  color: #fff;
}

/* =========================
   Item wrapper
========================= */
.drw-item {
  position: relative;
  margin: 0 0 32px;
  --left-col: 220px;
}


.drw-date-icon {
  width: 16px;
  height: 16px;
  background: #e6374a;
  display: inline-block;
  border-radius: 3px;
}

/* =========================
   Block layout
========================= */
.drw-block {
  display: flex;
  gap: 48px;
  align-items: flex-start;
}

/* 左：選手 */
.drw-left {
  width: var(--left-col);
  flex-shrink: 0;
  text-align: center;
  padding-top: 10px;
}

.drw-player-image {
  width: 160px;
  height: 160px;
  border-radius: 50%;
  object-fit: cover;
  display: block;
  margin: 0 auto 14px;
}

/* 名前 + 国旗 横並び */
.drw-name-row {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: center;
}

.drw-name-jp {
  font-size: 24px;
  color: #666;
  font-weight: 600;
}

.drw-flag {
  width: 22px;
  height: auto;
  display: inline-block;
  transform: translateY(1px);
  border-radius: 3px;
}

/* 右：カード */
.drw-right {
  position: relative;
  padding-left: 28px;
  padding-top: 14px;
  padding-bottom: 14px;
  min-width: 0;
}

.drw-right::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: #7c1013;
}

/* 時間 */
.drw-time {
  font-size: 22px;
  font-weight: 700;
  color: #111;
  margin-bottom: 8px;
}

/* リーグ＋節 */
.drw-meta {
  font-size: 18px;
  color: #333;
  margin-bottom: 10px;
}

/* 対戦カード */
.drw-score {
  font-size: 22px;
  font-weight: 800;
  letter-spacing: 0.02em;
  margin-bottom: 18px;

  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: baseline;
}

.drw-score .num  { color: #111; }
.drw-score .dash { color: #111; }

/* 文章 */
.drw-note {
  font-size: 18px;
  line-height: 1.9;
  color: #111;
  margin-top: 32px;
}

/* YouTube */
.drw-youtube {
  margin-top: 18px;
}

.drw-youtube iframe {
  width: 100%;
  aspect-ratio: 16 / 9;
  height: auto;
  max-width: 550px;
}


/* =========================
   Responsive
========================= */
@media (max-width: 860px) {
  .drw-head h1 {
    font-size: 34px;
    margin-top: 60px;
  }

  .drw-block {
    flex-direction: column;
    gap: 18px;
  }

  .drw-item {
    --left-col: 0px;
  }

  .drw-date-label {
    position: static;
    margin-bottom: 14px;
  }

  .drw-left {
    width: 100%;
    text-align: left;
    display: flex;
    align-items: center;
    gap: 16px;
    padding-top: 0;
  }

  .drw-player-image {
    width: 92px;
    height: 92px;
    margin: 0;
  }

  .drw-name-row {
    justify-content: flex-start;
  }

  .drw-right {
    padding-left: 20px;
  }
}


.drw-header {
  text-align: center;
  margin-bottom: 48px;
}

.drw-month-nav {
  display: inline-flex;
  gap: 12px;
}

.drw-date {
  text-align: center;
  font-size: 28px;
  font-weight: 600;
  margin: 64px 0 32px;
}
.drw-time {
  font-size: 18px;
  font-weight: 600;
}

.drw-time .kickoff {
  font-size: 18px;
  margin-left: 4px;
  color: #777;
  letter-spacing: 0.08em;
}


.drw-head {
  display: flex;
  flex-direction: column;
  align-items: center; 
  gap: 20px;
  margin-bottom: 32px;
}

.drw-head h1 {
  margin-bottom: 20px;
}


.drw-month-nav {
  display: flex;
  gap: 12px;
  justify-content: center;
}

.drw-item {
  position: relative;
  margin-top: 40px;
}



.drw-date-icon {
  display: none;
}

.is-player-club {
  color: #8f1013;
  font-weight: 700;
}


.drw-block {
  max-width: 800px; 
  margin: 0 auto;
}


/* =========================
   DRW Design Reset（縦型）
========================= */

/* 全体 */
.drw-page {
  max-width: 100%;
  background: #ddd;
}


/* 1ブロック */
.drw-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;

  max-width: 720px;
  margin: 20px auto 100px;
  padding: 0 20px;
}

.drw-left,
.drw-right {
  width: 100%;
  padding: 0;
  text-align: center;
}

.drw-right::before {
  display: none;
}

/* 選手画像 */
.drw-player-image {
  width: 180px;
  height: 180px;
  border-radius: 0; 
}

/* 名前行 */
.drw-name-row {
  justify-content: center;
}

.drw-name-jp {
  font-size: 20px;
  font-weight: 600;
  color: #333;
}

/* 時間 */
.drw-time {
  font-size: 18px;
  font-weight: 500;
}

/* メタ */
.drw-meta {
  font-size: 18px;
  opacity: 0.8;
}

/* スコア */
.drw-score {
  justify-content: center;
  font-size: 24px;
}

/* 本文 */
.drw-note {
  max-width: 500px;
  margin: 20px auto 0;
  font-size: 18px;
  line-height: 1.9;
  text-align: left;
}

/* YouTube */
.drw-youtube {
  width: 100%;
  margin: 32px auto 0;
}


/* =========================
   DRW Gate（Orange）
========================= */

.drw-gate {
  display: flex;
  align-items: center;
  justify-content: center;

  gap: 0;
  margin: 24px auto 32px;
}

.drw-gate-side {
  width: 120px;
  height: 120px;

  background: #c47a00;
  color: #fff;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 16px;
  letter-spacing: 0.08em;
}

.drw-gate-center {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 220px;
  height: 120px;

  background: #bfae95; 
  gap: 12px;
}

.drw-gate-door {
  width: 70px;
  height: 90px;
  background: #d9d9d9;
}


/* =========================
   DRW Gate
========================= */

.drw-gate{
  width: min(760px, 100%);
  margin: 24px auto 32px;

  position: relative;
  background: #cfcfcf; 
  padding-top: 18px;
}

.drw-gate::before{
  content:"";
  position:absolute;
  left:0; right:0; top:0;
  height: 18px;
  background: #b47908;
}

.drw-gate-side,
.drw-gate-center{
  height: 140px;
}

.drw-gate-side{
  width: 190px;
  background:#c47a00;
  color:#fff;

  display:flex;
  align-items:center;
  justify-content:center;
}

.drw-gate-label{
  display:flex;
  align-items:flex-end;
  line-height: 1;
}
.drw-gate-label strong{
  font-size: 56px;
  font-weight: 700;
}
.drw-gate-label small{
  font-size: 20px;
  letter-spacing: .08em;
  transform: translateY(-6px);
}

.drw-gate-center{
  flex: 1;
  min-width: 260px;

  position: relative;
  background: #a9a9a9;
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 22px;
}

.drw-gate-center::before{
  content:"";
  position:absolute;
  left:0; right:0; top:0;
  height: 14px;
  background: rgba(0,0,0,.18);
}

.drw-gate-door{
  width: 150px;
  height: 105px;

  background:#d7d7d7;
}


/* ===== Gate: center gray too much fix ===== */

.drw-gate-center{
  background: #b3b3b3;
  gap: 16px;
  padding: 0 18px; 
}

.drw-gate-center::before{
  height: 10px;
  background: rgba(0,0,0,.12);
}

.drw-gate-door{
  width: 150px;
  height: 105px;
  background:#e0e0e0;
}


/* Gate: center top strip remove */
.drw-gate-center::before {
  content: none !important;
  display: none !important;
}


/* Gate: center gray top/bottom cut */
.drw-gate-center{
  position: relative;
}

.drw-gate-center::before,
.drw-gate-center::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  height:10px; 
  background:#ffffff;
  z-index: 2; 
  pointer-events:none;
}

.drw-gate-center::before{ top:0; }
.drw-gate-center::after{ bottom:0; }


.drw-gate-center::before {
  content: none !important;
  display: none !important;
}


.drw-gate-center{
  position: relative;
}

/* 上下10pxを背景色でマスク */
.drw-gate-center::before,
.drw-gate-center::after{
  content:"" !important;
  display:block !important;

  position:absolute;
  left:0;
  right:0;
  height:10px;

  background:#ddd; 
  z-index: 10;
  pointer-events:none;
}

.drw-gate-center::before{ top:0; }
.drw-gate-center::after{ bottom:0; }

/* DRW page background */
.drw-page{
  background: #ddd !important;
}

/* GeneratePress: content wrappers (DRW page only) */
.page-template-page-drw .site-content,
.page-template-page-drw .content-area,
.page-template-page-drw .inside-article,
.page-template-page-drw .entry-content{
  background: #ddd !important;
}


.page-template-page-drw .drw-gate{
  margin: 0 auto 0; 
}

.page-template-page-drw .site-content{
  background:#ddd !important;
}


/* Gate: overall smaller */
.drw-gate{
  width: min(560px, 92%);  
}

/* =========================
   Gate 360px fixed (no overflow)
========================= */

.drw-gate{
  width: 460px;
  padding-top: 14px; 
}

.drw-gate::before{
  height: 14px;
}

.drw-gate-side,
.drw-gate-center{
  height: 120px;
}

.drw-gate-side{
  width: 80px; 
}

.drw-gate-center{
  flex: 1;
  min-width: 0; 
  padding: 0 10px;
  gap: 10px;
}

.drw-gate-door{
  width: 135px;
  height: 80px;
}

.drw-gate-label strong{ font-size: 26px; }
.drw-gate-label small{ font-size: 10px; transform: translateY(-5px); }

/* Gate: move "1 page" to top */
.drw-gate-side{
  align-items: flex-start;
  padding-top: 20px;
}


/* =========================
   Gate Door Filter UI
========================= */

.drw-gate-center{
  position: relative;
}

.drw-door-filter{
  border: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background:#d9d9d9;
  color:#111;
  font-weight: 700;
}

.drw-door-filter:focus{
  outline: 2px solid rgba(0,0,0,.25);
  outline-offset: 2px;
}

.drw-door-label{
  font-size: 14px;
  letter-spacing: .06em;
}

.drw-door-caret{
  font-size: 12px;
  opacity: .7;
  transform: translateY(1px);
}

/* ドロップダウン本体 */
.drw-door-menu{
  position: absolute;
  left: 50%;
  top: calc(100% + 10px);
  transform: translateX(-50%);

  width: 220px;
  background: #efefef;
  border: 1px solid rgba(0,0,0,.15);
  box-shadow: 0 10px 24px rgba(0,0,0,.12);
  padding: 10px;
  display: none;
  z-index: 999;
}

.drw-door-menu.is-open{
  display: block;
}

.drw-door-item{
  width: 100%;
  border: 0;
  background: transparent;
  padding: 10px 12px;
  text-align: left;
  cursor: pointer;
  font-size: 14px;
  letter-spacing: .06em;
}

.drw-door-item:hover{
  background: rgba(0,0,0,.06);
}

.drw-door-dummy{
  background:#d9d9d9;
}


.drw-door-menu{
  display:none;
}
.drw-door-menu.is-open{
  display:block;
}


/* =========================
   DRW Gate Dropdown (Month)
========================= */

.drw-door-filter{
  appearance: none;
  border: 0;
  background: #d9d9d9;
  cursor: pointer;
}

.drw-door-filter .drw-door-label{
  font-weight: 700;
  letter-spacing: .02em;
}

.drw-door-filter .drw-door-caret{
  font-size: 12px;
  transform: translateY(-1px);
}

.drw-door-menu{
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%);
  width: min(240px, 90vw);

  background: #fff;
  border: 1px solid rgba(0,0,0,.15);
  box-shadow: 0 10px 28px rgba(0,0,0,.18);
  border-radius: 10px;
  padding: 10px;
  z-index: 50;

  display: none;
}

.drw-door-menu.is-open{ display: block; }

.drw-door-item{
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;

  padding: 10px 12px;
  border-radius: 8px;

  color: #111; 
  font-size: 14px;
  cursor: pointer;
}

.drw-door-item:hover{
  background: #f1f1f1;
}


.drw-gate-side{
  position: relative;
}

.drw-gate-side::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 44px;
  height: .4px;
  background: rgb(221 221 221);
}


.drw-door-menu{
  display: none;
}
.drw-door-menu.is-open{
  display: block;
}




/* =========================
   DRW: Always vertical + Center
========================= */

.drw-page{
  padding-left: 16px;
  padding-right: 16px;
}

/* =========================
   DRW Date Label（最終版）
   - どの幅でも中央
   - 下線は文字幅だけ
========================= */
.drw-date-label{
  position: static;          /* absoluteは禁止 */
  display: table;            /* 文字幅で箱が決まる（inline-blockでもOK） */
  margin: 64px auto 16px;    /* 上下の余白はここで調整 */
  padding-bottom: 10px;

  font-size: 32px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-align: center;

  border-bottom: 2px solid #8f1013; /* 下線はテキスト幅だけ */
}

/* カード全体：どの幅でも縦積み固定 */
.drw-block{
  display: flex;
  flex-direction: column !important;  /* ← ここが最重要 */
  align-items: center;
  gap: 4px;
}

/* 左（選手）も縦積み固定 */
.drw-left{
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* 画像はセンター */
.drw-player-image{
  display: block;
  margin: 0 auto 10px;
}

/* 名前行は「名前＋国旗」だけ横並びでセンター */
.drw-name-row{
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
}

/* 右（本文側）：全部センター寄せ */
.drw-right{
  width: 100%;
  text-align: center;
}

/* wpautopのpもセンター寄せにする */
.drw-note,
.drw-note p{
  text-align: left;
  font-size: 18px;
  margin-bottom: -12px;
}

/* 念のため：どこかでfloat等が入ってたら潰す */
.drw-left *, .drw-right *{
  float: none !important;
}




/* =========================
   Date label (center + underline fits text)
========================= */
.drw-date-label{
  display: inline-block;
  margin: 40px auto 30px;
  padding-bottom: 6px;

  font-size: 32px;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: #111;

  border-bottom: 2px solid #8f1013;
}

/* 日付ラベルの “親” は常に中央寄せ（inline-blockを活かす） */
.drw-item.has-date{
  text-align: center;
}


/* =========================
   Note frame (border avoids score)
========================= */
.drw-note-frame{
  position: relative;
  width: min(720px, 92%);
  margin: 42px auto 55px;
  padding: 36px 32px 32px;

  background: transparent; /* まずは透明。白にしたいなら下で変える */
}





/* playerフィルター時：ページ上部に1回だけ出す選手ヘッダー */
.drw-player-hero{
  margin: 80px auto 8px;
  text-align: center;
}

.drw-player-hero-image{
  display: block;
  width: min(240px, 60vw);
  height: auto;
  margin: 0 auto 10px;
}

.drw-player-hero-name{
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.drw-player-hero-jp{
  font-weight: 700;
  font-size: 22px;
}

/* playerフィルター時はカード内の選手枠が無い前提で整える */
.is-player-filtered .drw-left{
  display: none;
}


/* =========================
   DRW Pager (3 buttons) - clean
   - 3つ同じサイズ
   - 左右だけ中身を少しズラす（矢印のため）
   - 矢印と×は同じ高さで重ねる（矢印は残す）
========================= */

.drw-pagination{
  margin: 80px auto 10px;
  width: 300px; /* ← 全体が横長すぎるならここを詰める（520〜620くらい） */
  text-align: center;
}

.drw-pager{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

/* 共通ボタン */
.drw-pager-item{
  position: relative;
  height: 64px;                 /* ← 3つ同じ高さ */
  border: 2px solid rgb(208 208 208);
  color: #fff;
  text-decoration: none;
  user-select: none;

  display: flex;
  align-items: center;           /* 縦センター */
  justify-content: center;       /* いったん中央 */
  gap: 2px;                     /* PAGE と数字の距離 */

  box-sizing: border-box;
}

/* 色：前=緑 / 現在=橙 / 次=黄 */
.drw-pager-item.is-prev    { background: #5f7f73; }
.drw-pager-item.is-current { background: #c86a1a; }
.drw-pager-item.is-next    { background: #b6a200; }

/* 左右だけ：矢印スペース分、PAGE+数字をずらす */
.drw-pager-item.is-prev { padding-left: 46px; }  /* ←分だけ右へ */
.drw-pager-item.is-next { padding-right: 46px; } /* →分だけ左へ */
/* 真ん中はそのまま中央 */

/* PAGE + 数字（横並び） */
.drw-pager-label{
  font-size: 18px;          /* 少し大きく */
  letter-spacing: 0.06em;
  line-height: 1;
  transform: translateY(-1px); /* 少し下へ（数字に寄せる） */
}

.drw-pager-num{
  font-size: 36px;
  font-weight: 900;
  line-height: 1;
}

/* 矢印（常に出す） */
.drw-pager-arrow{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 40px;
  font-weight: 900;
  line-height: 1;
  opacity: 0.95;
}
.drw-pager-arrow.is-left  { left: 6px; }
.drw-pager-arrow.is-right { right: 6px; }

/* ×（矢印の上に重ねる：矢印は残す） */
.drw-pager-x{
  position: absolute;
  top: 44%;
  transform: translateY(-50%);
  font-size: 44px;
  font-weight: 900;
  line-height: 1;
  color: rgba(90,90,90);
  pointer-events: none;
}
.drw-pager-x.is-left  { left: 9px; }
.drw-pager-x.is-right { right: 9px; }

/* 無効化（押せない） */
.drw-pager-item.is-disabled{
  pointer-events: none;
}

.drw-pager--2{
  grid-template-columns: repeat(2, minmax(0, 1fr));
}


/* 範囲 */
.drw-pager-item[data-color="green"]  { background: #6c9c8a; } /* 4〜6 */
.drw-pager-item[data-color="yellow"] { background: #e8ce67; } /* 7〜 */

/* 個別（0〜3） */
.drw-pager-item[data-page="0"] { background: #6c9c8a; }
.drw-pager-item[data-page="1"] { background: #e8ce67; }
.drw-pager-item[data-page="2"] { background: #d4975d; }
.drw-pager-item[data-page="3"] { background: #6c9c8a; }




/* PAGE + 数字を「塊」にする */
.drw-pager-text{
  display: inline-flex;
  align-items: baseline;
}

/* 左は -20px（左へ） */
.drw-pager-text--left{
  transform: translateX(-6px);
}

/* 右は +20px（右へ） */
.drw-pager-text--right{
  transform: translateX(6px);
}








/* GeneratePressの a:hover を DRW pager だけ上書き */
.page-template-page-drw .drw-pagination .drw-pager-item,
.page-template-page-drw .drw-pagination .drw-pager-item:hover,
.page-template-page-drw .drw-pagination .drw-pager-item:focus,
.page-template-page-drw .drw-pagination .drw-pager-item:active{
  color: #Fff ;
}

/* page1 だけ文字を黒 */
.drw-pager-item[data-page="1"]{
  color: #444 !important;
}

/* 矢印は span に直接色を持たせることがあるので念押し */
.drw-pager-item[data-page="1"] .drw-pager-arrow{
  color: #444 !important;
}

/* × も黒にしたいなら（無効時に出るやつ） */
.drw-pager-item[data-page="1"] .drw-pager-x{
  color: #444 !important;
}


/* 7以降（yellow）だけ文字を黒 */
.drw-pager-item[data-color="yellow"]{
  color: #444 !important;
}

.drw-pager-item[data-color="yellow"] .drw-pager-arrow{
  color: #444 !important;
}

.drw-pager-item[data-color="yellow"] .drw-pager-x{
  color: #444 !important;
}

/* =========================
   Player Illustration (統一・見切れ防止)
========================= */

/* 画像を入れる枠の高さを固定（全員同じ大きさ） */
.page-template-page-drw .drw-player-image,
.page-template-page-drw .drw-player-hero-image{
  display: block;
  width: 100%;
  object-fit: contain;              /* ← これで見切れない */
  object-position: center bottom;   /* 足を揃えたいなら bottom 推奨 */
}

/* もし親が overflow:hidden で切ってたら無効化 */
.page-template-page-drw .drw-left{
  overflow: visible;
}

/* =========================
   Player Filter Hero Image
   “高さ基準”で統一（全身を入れつつデカくなりすぎない）
========================= */
.page-template-page-drw .drw-player-hero-image{
  display: block;
  margin: 0 auto 10px;

  /* ★ここが肝：高さを揃える */
  height: 230px;         /* ←大きすぎるなら 220px とかに */
  width: auto;
  object-fit: contain;
  object-position: center bottom; /* 足を下に揃える */
}


/* 右左の "1 page" を少し上へ */
.page-template-page-drw .drw-gate-label{
  transform: translateY(-12px); /* ←好みで -4〜-10px */
}




/* SP */
@media (max-width: 768px) {

  .drw-gate{
    max-width: 340px;
  }
}

/* =========================
   DRW Score (Mobile)
   2-lines: team left / score right
========================= */
@media (max-width: 520px) {
  .page-template-page-drw .drw-score{
    display: grid !important;
    grid-template-columns: 1fr auto; /* 左=チーム名 / 右=スコア */
    column-gap: 14px;
    row-gap: 8px;
    align-items: baseline;

    /* 既存の中央寄せを潰す */
    justify-content: stretch !important;
    text-align: left !important;
  }

  /* dashは不要 */
  .page-template-page-drw .drw-score .dash{
    display: none !important;
  }

  /* 1行目（ホーム） */
  .page-template-page-drw .drw-score .team:first-of-type{
    grid-row: 1;
    grid-column: 1;
    min-width: 0;
    overflow-wrap: anywhere;
  }
  .page-template-page-drw .drw-score .num:first-of-type{
    grid-row: 1;
    grid-column: 2;
    text-align: right;
    justify-self: end;
  }

  /* 2行目（アウェイ） */
  .page-template-page-drw .drw-score .team:last-of-type{
    grid-row: 2;
    grid-column: 1;
    min-width: 0;
    overflow-wrap: anywhere;
  }
  .page-template-page-drw .drw-score .num:last-of-type{
    grid-row: 2;
    grid-column: 2;
    text-align: right;
    justify-self: end;
  }

  .drw-score{
    font-size: 20px;
  }
}





/* ===== DRW: AI base + optional blocks ===== */

.drw-human-note{
  margin-top: 18px;
  font-size: 20px;        /* AIより少し大きく */
  font-weight: 600;
  line-height: 1.9;
}

.drw-ai-note{
  margin-top: 18px;
  font-size: 16px;
  line-height: 1.9;
  opacity: .92;
}

.drw-events{
  margin-top: 10px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  font-size: 12px;
  opacity: .85;
}

.drw-events-col.is-right{
  text-align: right;
}

.drw-event-row{
  display: inline-flex;
  gap: 6px;
  align-items: baseline;
  margin: 2px 0;
}
.drw-event-row .m{ opacity: .8x; }
.drw-event-row .i{ opacity: .95; }
.drw-event-row .n{ opacity: .95; }

.drw-stats{
  margin-top: 18px;
  padding-top: 12px;
  border-top: 1px solid rgba(0,0,0,.12);
  font-size: 12px;
}

.drw-stats-title{
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  background: #222;
  padding: 4px;
  color: #fff;
  opacity: .75;
  margin-bottom: 10px;
}

.drw-stats-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 8px 12px;
}

.drw-stat{
  display: flex;
  justify-content: space-between;
  gap: 10px;
}
.drw-stat .k{ opacity: .7; }
.drw-stat .v{ font-weight: 700; }

.drw-match-stats .row{
  display:flex;
  justify-content: space-between;
  gap: 10px;
  margin: 4px 0;
}
.drw-match-stats .k{ opacity: .7; }
.drw-match-stats .v{ font-weight: 700;font-size: 14px; }


/* =========================
   Match row + Events row (same width)
   3 columns: Home | Score | Away
========================= */

.page-template-page-drw .drw-match-grid{
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  column-gap: 14px;
  row-gap: 10px;
  align-items: baseline;

  /* 幅を揃えたいならここで統一（今の縦積みmax幅に合わせる） */
  width: min(720px, 92%);
  margin: 0 auto;
}

.page-template-page-drw .drw-match-team{
  font-size: 20px;
  font-weight: 800;
  letter-spacing: 0.02em;
  min-width: 0;
  overflow-wrap: anywhere;
}

.page-template-page-drw .drw-match-team--home{
  text-align: left;
  justify-self: start;
}

.page-template-page-drw .drw-match-team--away{
  text-align: left;      /* ★右側も「セル内で左揃え」 */
  justify-self: start;   /* ★右端寄せにしない */
}

.page-template-page-drw .drw-match-score{
  font-size: 22px;
  font-weight: 900;
  letter-spacing: 0.02em;
  justify-self: center;
  white-space: nowrap;
}

.page-template-page-drw .drw-match-events{
  font-size: 12px;
  opacity: .85;
  text-align: left;
}

.page-template-page-drw .drw-match-events-spacer{
  /* スコア列の下を空けるだけ */
}

/* 既存の .drw-event-row をそのまま使う（左揃え維持） */


/* =========================
   Match Row (3 columns) - balanced
   Home(right) / Score(center) / Away(left)
========================= */

.page-template-page-drw .drw-match-grid{
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  column-gap: 18px;
  row-gap: 10px;
  align-items: baseline;
  margin-top: 8px;
}

/* チーム名：スコアに寄せてバランス */
.page-template-page-drw .drw-match-team--home{
  justify-self: end;
  text-align: right;
  padding-right: 6px;   /* ←スコアとの間隔（好みで 4〜12） */
  min-width: 0;
}

.page-template-page-drw .drw-match-team--away{
  justify-self: start;
  text-align: left;
  padding-left: 6px;    /* ←スコアとの間隔（好みで 4〜12） */
  min-width: 0;
}

/* スコア：ど真ん中固定 */
.page-template-page-drw .drw-match-score{
  justify-self: center;
  text-align: center;
  font-weight: 800;
  min-width: 84px;      /* ←スコアがブレないための芯（好みで調整） */
}

/* 長いチーム名でも壊れないように（任意だけどおすすめ） */
.page-template-page-drw .drw-match-team{
  overflow: hidden;
  text-overflow: ellipsis;
}


/* =========================
   Events (vertical stack)
========================= */

.page-template-page-drw .drw-match-events{
  display: flex;
  flex-direction: column;  /* ←縦積み */
  gap: 4px;
  font-size: 12px;
  line-height: 1.35;
  min-width: 0;
}

/* Home側イベント：スコア寄せ（右寄せ） */
.page-template-page-drw .drw-match-events--home{
  justify-self: end;
  text-align: left;
  padding-right: 6px;
}
.page-template-page-drw .drw-match-events--home .drw-event-row{
  display: flex;
  justify-content: flex-start;  /* ←右寄せで縦積み */
  gap: 6px;
}

/* Away側イベント：左寄せ */
.page-template-page-drw .drw-match-events--away{
  justify-self: start;
  text-align: left;
  padding-left: 6px;
}
.page-template-page-drw .drw-match-events--away .drw-event-row{
  display: flex;
  justify-content: flex-start;
  gap: 6px;
}

/* 真ん中のスペーサーは“何も表示しない” */
.page-template-page-drw .drw-match-events-spacer{
  display: block;
}


/* =========================
   Note Boxes (Human / AI)
   - border only
   - label cuts the top border
========================= */

/* まず背景色を変数化（ラベルの塗りに使う） */
.page-template-page-drw .drw-page{
  --drw-bg: #ddd; /* 今のページ背景に合わせる */
  --drw-human: #8f1013; /* 人間：赤系（好みで） */
  --drw-ai: #222;       /* AI：黒系（好みで） */
}

/* 箱 */
.page-template-page-drw .drw-note-box{
  position: relative;
  width: min(720px, 92%);
  margin: 22px auto 0;
  padding: 22px 18px 18px;

  background: transparent;     /* 塗り無し */
  border: 1px solid;           /* 色は下の is-* で決める */
  border-radius: 0;            /* 角丸いらなければ0（丸めたいなら 10px とか） */
}

/* 色分け */
.page-template-page-drw .drw-note-box.is-human{ border-color: var(--drw-human); }
.page-template-page-drw .drw-note-box.is-ai{ border-color: var(--drw-ai); }

/* ラベル：上線を“消す”ために背景色で被せる */
.page-template-page-drw .drw-note-box__label{
  position: absolute;
  top: -11px;
  left: 14px;

  padding: 0 10px;
  height: 22px;
  display: inline-flex;
  align-items: center;

  background: var(--drw-bg);   /* ←ここで上線を隠す */
  font-size: 12px;
  letter-spacing: .10em;
  line-height: 1;
  font-weight: 600;            /* ラベルだけ少し強め（不要なら400） */
}

/* ラベルも色分け */
.page-template-page-drw .drw-note-box.is-human .drw-note-box__label{ color: var(--drw-human); }
.page-template-page-drw .drw-note-box.is-ai .drw-note-box__label{ color: var(--drw-ai); }

/* 本文：人間を太字にしない（ここが要望） */
.page-template-page-drw .drw-note-box__body{
  font-size: 16px;
  line-height: 1.9;
  font-weight: 400;          /* ←人間もAIも太字にしない */
  color: #111;
  text-align: left;        /* 今のレイアウトに合わせる（左寄せにしたければ left） */
}

/* wpautopのpの余白を整える */
.page-template-page-drw .drw-note-box__body p{
  margin: 0 0 12px;
}
.page-template-page-drw .drw-note-box__body p:last-child{
  margin-bottom: 0;
}


.drw-stats-grid.is-1col{
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  justify-items: center;
}

.drw-stats-grid.is-1col .drw-stat{
  display: inline-flex;
  justify-content: center;
  align-items: baseline;
  gap: .5ch;
  width: max-content;
}

/* 3 columns: Player / Home / Away */
.drw-stats-triptych{
  margin-top: 16px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 18px;
  align-items: start;
}

/* Player の右側に薄い線 */
.drw-stats-col--player{
  padding-right: 18px;
  border-right: 1px solid rgba(0,0,0,.18);
}

/* 既存の “1カラムセンター寄せ” はそのまま使う想定 */
.drw-stats-grid.is-1col{
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  justify-items: center;
}
.drw-stats-grid.is-1col .drw-stat{
  display: inline-flex;
  justify-content: center;
  align-items: baseline;
  gap: .5ch;
  width: max-content;
}

/* SP は縦積み（線も下に移動） */
@media (max-width: 760px){
  .drw-stats-triptych{
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .drw-stats-col--player{
    border-right: none;
    padding-right: 0;
    padding-bottom: 14px;
  }
}

/* 基本 */
.drw-stats-triptych{
  margin-top: 16px;
  display: grid;
  gap: 18px;
  align-items: start;
}

/* Player Stats がある → 3カラム */
.drw-stats-triptych.has-player{
  grid-template-columns: 1fr 1fr 1fr;
}

/* Player Stats がない → 2カラム（Home / Away） */
.drw-stats-triptych.no-player{
  grid-template-columns: 1fr 1fr;
}

/* Player の右側に薄い線（Playerがある時だけ） */
.drw-stats-triptych.has-player .drw-stats-col--player{
  padding-right: 18px;
}

/* no-player の時は線いらない */
.drw-stats-triptych.no-player .drw-stats-col--player{
  border-right: none;
  padding-right: 0;
}

/* SPは縦積み */
@media (max-width: 760px){
  .drw-stats-triptych.has-player,
  .drw-stats-triptych.no-player{
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .drw-stats-triptych.has-player .drw-stats-col--player{
    border-right: none;
    padding-right: 0;
    padding-bottom: 14px;
  }
}


.drw-stats-title .drw-stats-player{
  color: #ff4040; /* いつもの赤 */
}


/* ✅ センター寄せ解除（チームスタッツもPlayer Statsも左寄せ） */
.drw-match-stats{
  text-align: left;
}


.drw-stats-triptych{
  display: grid;
  gap: 14px;
}

.drw-stats-triptych.cols-1{
  grid-template-columns: 1fr;
}

.drw-stats-triptych.cols-2{
  grid-template-columns: 1fr 1fr;
}

.drw-stats-triptych.cols-3{
  grid-template-columns: 1fr 1fr 1fr;
}

/* 1カラムのときは仕切り線いらない */
.drw-stats-triptych.cols-1 .drw-stats-col--player{
  border-right: none;
  padding-right: 0;
}

/* モバイルでは仕切り線いらない（幅は好みで調整OK） */
@media (max-width: 640px){
  .drw-stats-triptych.has-player-divider .drw-stats-col--player{
    border-right: none;
    padding-right: 0;
  }
}

@media (max-width: 640px){
.drw-stats-triptych.cols-1{
  grid-template-columns: 1fr;
  margin: 22px;
}

.drw-stats-triptych.cols-2{
  grid-template-columns: 1fr;
  margin: 22px;
}

.drw-stats-triptych.cols-3{
  grid-template-columns: 1fr;
  margin: 22px;
}

.drw-page{
  padding: 0 0;
}
.drw-block{
  padding: 8px;
  margin: 20px auto 0px;
}


.page-template-page-drw .drw-match-grid{
  width: 98%;
}


.page-template-page-drw .drw-match-grid{
  column-gap: 0px;
}


.page-template-page-drw .drw-match-team--home{
  padding-right: 0px;
}

.page-template-page-drw .drw-match-team--away{
  padding-left: 0px;
}

.page-template-page-drw .drw-match-score{
  font-size: 20px;
  min-width: 70px;
}

.page-template-page-drw .drw-match-score{
  padding-right: 0px;
}

.page-template-page-drw .drw-match-events--away{
  padding-left: 0px;
}

.page-template-page-drw .drw-match-events--home{
  padding-right: 0px;
}
.page-template-page-drw .drw-match-events--away{
  padding-right: 0px;
}


}

/* note label icons */
.drw-note-box.is-human .drw-note-box__label::before{
  content: "🙋";
    margin-right: 4px;

}

.drw-note-box.is-ai .drw-note-box__label::before{
  content: "🤖";
  margin-right: 4px;
}

/* drw-block の一番下に薄いボーダー */
.drw-block{
  border-bottom: 1px solid rgba(0,0,0,.10);
  padding-bottom: 18px;   /* 線と中身が近いなら */
  margin-bottom: 18px;    /* 次の要素と間隔 */
}