/* 会員向けの視聴ページ（2026-09-17 MOST工房裁定）。labo-v4.css の上に重ねる。
   非会員ページと同じ二列だが、左は静止画ではなく再生画面なので、左の列を広げて
   これまでの視聴ページ（最大956px）と同じくらいの大きさを保つ。
   1440px 幅で動画 940px。1280px 幅で 836px。960px 以下は縦に積み、動画が先・文章があと。 */

/* ━ A 舞台 ━ */
.labo-v4--member .labo-v4-stage{padding:40px 0 52px}

/* 再生画面。角と影は非会員ページのサムネイルと揃える（無料公開の札は枠の外に置く） */
.labo-v4--member .labo-v4-stage__player .labo-player{border-radius:4px;overflow:hidden;box-shadow:0 18px 44px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.07)}
/* 「無料公開中」の札は shortcode が色を直に書いているので、黒い地で読める赤に上書きする */
.labo-v4--member .labo-v4-stage__player .labo-free{margin:0 0 10px!important;font-size:13px!important;letter-spacing:.06em;color:#e58b84!important}

/* 右の列（400px）に合わせた段。題は2行に収める */
@media (min-width:1181px){
  .labo-v4--member .labo-v4-stage__grid{max-width:1428px;grid-template-columns:minmax(0,940fr) minmax(0,400fr);column-gap:48px}
  .labo-v4.labo-v4--member .labo-v4-stage__title{font-size:28px;line-height:1.4}
  .labo-v4.labo-v4--member .labo-v4-stage__title--long{font-size:24px}
  .labo-v4.labo-v4--member .labo-v4-stage__title--xlong{font-size:20px}
}
/* 1180px 以下のノートPC幅：右の列を 340px に固定し、残りを全部動画に回す */
@media (min-width:961px) and (max-width:1180px){
  .labo-v4--member .labo-v4-stage__grid{grid-template-columns:minmax(0,1fr) 340px;column-gap:32px}
  .labo-v4.labo-v4--member .labo-v4-stage__title{font-size:24px;line-height:1.4}
  .labo-v4.labo-v4--member .labo-v4-stage__title--long{font-size:21px}
  .labo-v4.labo-v4--member .labo-v4-stage__title--xlong{font-size:18px}
}
@media (min-width:961px){
  .labo-v4.labo-v4--member .labo-v4-stage__cat{margin-bottom:12px}
  .labo-v4.labo-v4--member .labo-v4-stage__date{margin-top:8px}
  .labo-v4.labo-v4--member .labo-v4-stage__greeting{margin-top:18px;font-size:14.5px}
  .labo-v4.labo-v4--member .labo-v4-stage__invite p{font-size:15.5px;line-height:1.75}
  .labo-v4--member .labo-v4-stage__fav{margin-top:24px}
}
.labo-v4--member .labo-v4-stage__cat a{color:inherit;text-decoration:none}
.labo-v4--member .labo-v4-stage__cat a:hover{text-decoration:underline;text-underline-offset:3px}
/* 公開日の横のシリーズ名（作り直す前の会員ページにあったリンクを戻した。2026-09-17） */
/* 幅が足りないときは「｜シリーズ「…」」ごと次の行へ送る。名前の途中では折らない（2026-09-17） */
/* シリーズ名は一つの塊で次の行へ送る。nowrap だと最長28字がスマホ幅からはみ出すので、行より長いときだけ中で折れる（2026-09-21） */
.labo-v4--member .labo-v4-stage__series{display:inline-block;max-width:100%}
.labo-v4--member .labo-v4-stage__series a{color:rgba(255,255,255,.82);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.labo-v4--member .labo-v4-stage__series a:hover{color:#fff}

/* ━ お気に入り（非会員ページで赤い扉があった位置） ━
   枠の形・大きさ・太さは labo.css の .labo-fav のまま。黒い地で控えめに見えるよう色だけ替える。
   押したあとは赤で分かるようにする */
.labo-v4--member .labo-v4-stage__fav{margin-top:28px}
.labo-v4--member .labo-fav{background:transparent;border-color:rgba(255,255,255,.34);color:#fff}
.labo-v4--member .labo-fav:hover{background:rgba(255,255,255,.08);border-color:#fff;color:#fff}
.labo-v4--member .labo-fav.is-on{background:rgba(179,38,30,.18);border-color:var(--red);color:#fff}
.labo-v4--member .labo-fav.is-on svg{fill:var(--red);stroke:var(--red)}

/* ━ D 旧説明文・A組の3ポイント（非会員ページ lite と同じ形。labo-v4-lite.css は会員側では読まない） ━ */
.labo-v4--member .labo-v4-olddesc{background:#fff;padding:64px 0 72px}
.labo-v4--member .labo-v4-olddesc__inner{max-width:720px;margin:0 auto}
.labo-v4.labo-v4--member .labo-v4-olddesc__text{margin:0 0 16px;font-size:17px;line-height:1.8;color:var(--ink-2)}
.labo-v4.labo-v4--member .labo-v4-olddesc__head{margin-top:40px}
.labo-v4.labo-v4--member .labo-v4-olddesc__inner > .labo-v4-olddesc__head:first-child{margin-top:0}
.labo-v4--member .labo-v4-olddesc__inner--prose{font-size:17px;line-height:1.9;color:var(--ink-2)}
.labo-v4--member .labo-v4-olddesc__inner--prose p{margin:0 0 1.2em}
.labo-v4--member .labo-v4-olddesc__inner--prose ul,.labo-v4--member .labo-v4-olddesc__inner--prose ol{margin:0 0 1.2em;padding-left:1.4em}
.labo-v4--member .labo-v4-olddesc__inner--prose a{color:var(--red);text-decoration:underline}
.labo-v4--member .labo-v4-points{background:#fff;padding:64px 0 72px}
.labo-v4--member .labo-v4-points__inner{max-width:720px;margin:0 auto}
.labo-v4.labo-v4--member .labo-v4-stage__headline{margin:18px 0 0;font-family:var(--serif);font-size:19px;font-weight:600;line-height:1.5;letter-spacing:.03em;color:#fff}
.labo-v4--member.labo-v4--copy .labo-v4-stage__invite{margin-top:12px}
.labo-v4--member.labo-v4--desc .labo-v4-stage__invite{margin-top:16px}

/* ━ F ラボには、こんな回があります ━
   会員には最下部の黒い帯を出さないので、ここが最後になる。舞台の黒と続けて一枚に見えないよう明るい地にする */
.labo-v4--member .labo-v4-more{background:var(--paper);color:var(--ink);padding:64px 0 72px}
.labo-v4.labo-v4--member .labo-v4-more__head{color:var(--ink)}
.labo-v4--member a.labo-v4-card{color:var(--ink)}
.labo-v4--member .labo-v4-card__title{color:var(--ink-2)}
.labo-v4--member .labo-v4-card__thumb{box-shadow:0 1px 6px rgba(0,0,0,.10)}
.labo-v4--member .labo-v4-card:hover .labo-v4-card__thumb{box-shadow:0 10px 24px rgba(0,0,0,.18)}

/* ━ スマホ（動画が先・文章があと。grid が縦に積む順で決まる） ━ */
@media (max-width:640px){
  .labo-v4--member .labo-v4-stage{padding:0 0 40px}
  /* 再生画面は画面いっぱいに。角と影は外す（非会員ページのサムネイルと同じ扱い） */
  .labo-v4--member .labo-v4-stage__player{margin:0 -16px}
  .labo-v4--member .labo-v4-stage__player .labo-player{border-radius:0;box-shadow:none}
  .labo-v4--member .labo-v4-stage__player .labo-free{margin:0 16px 8px!important}
  .labo-v4.labo-v4--member .labo-v4-stage__title{font-size:26px}
  .labo-v4.labo-v4--member .labo-v4-stage__title--long{font-size:23px}
  .labo-v4.labo-v4--member .labo-v4-stage__title--xlong{font-size:20px}
  .labo-v4--member .labo-v4-stage__fav{margin-top:22px}
  .labo-v4--member .labo-fav{width:100%;justify-content:center}
  .labo-v4--member .labo-v4-olddesc{padding:48px 0 56px}
  .labo-v4.labo-v4--member .labo-v4-olddesc__text{font-size:16px}
  .labo-v4.labo-v4--member .labo-v4-olddesc__head{margin-top:32px}
  .labo-v4--member .labo-v4-points{padding:48px 0 56px}
  .labo-v4--member .labo-v4-more{padding:48px 0 56px}
}
