/* ============================================================
   IGS lightweight video player (YouTube式 facade + HLS適応配信)
   - 再生するまで動画本体を一切読み込まない（ポスター画像のみ）→ ページが重くならない
   - HLS適応ビットレート（1080/720/480p 自動切替）＋ MP4フォールバック
   - ネイティブ controls によりフルスクリーン対応
   ============================================================ */
.igsvp{
  position:relative;width:100%;aspect-ratio:2028/1080;
  background:#05100b center/cover no-repeat;background-image:var(--igsvp-poster);
  border-radius:16px;overflow:hidden;cursor:pointer;
  border:1px solid rgba(46,196,127,.28);
  box-shadow:0 20px 54px rgba(0,0,0,.5),0 0 0 1px rgba(46,196,127,.06);
  -webkit-tap-highlight-color:transparent;
}
.igsvp::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.4));transition:background .2s}
.igsvp:hover::after{background:rgba(0,0,0,.2)}
.igsvp-btn{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;
  width:clamp(60px,9vw,84px);height:clamp(60px,9vw,84px);border:0;border-radius:50%;cursor:pointer;
  display:grid;place-items:center;
  background:linear-gradient(140deg,#2ee08f,#0fb98a);
  box-shadow:0 12px 32px rgba(39,224,160,.5),0 0 0 6px rgba(39,224,160,.14);
  transition:transform .16s ease,box-shadow .2s;
}
.igsvp:hover .igsvp-btn{transform:translate(-50%,-50%) scale(1.09);box-shadow:0 16px 40px rgba(39,224,160,.6),0 0 0 9px rgba(39,224,160,.18)}
.igsvp-btn svg{width:38%;height:38%;fill:#06120d;margin-left:6%}
.igsvp-cap{
  position:absolute;left:13px;bottom:12px;z-index:2;
  font-size:13px;font-weight:700;color:#eafff6;letter-spacing:.01em;
  background:rgba(6,16,11,.66);padding:6px 13px;border-radius:9px;backdrop-filter:blur(5px);
  border:1px solid rgba(46,196,127,.22);
}
.igsvp video{position:absolute;inset:0;z-index:0;width:100%;height:100%;background:#000;display:block}
.igsvp.igsvp-on{cursor:default}
.igsvp.igsvp-on video{z-index:3}
.igsvp.igsvp-on::after,.igsvp.igsvp-on .igsvp-btn,.igsvp.igsvp-on .igsvp-cap{display:none}