:root { --chi-radius: 16px; --chi-shadow: 0 10px 30px rgba(2,6,23,.08); }
.chi-box { border-radius: var(--chi-radius); box-shadow: var(--chi-shadow); overflow: hidden; }

.chi-video { 
  --chi-play-size: 76px;
  --chi-play-bg: #fff;
  --chi-play-icon: #0F72AC;
  --chi-play-radius: 9999px;
  --chi-play-scale: 1.06;
  --chi-play-shadow: 0 8px 30px rgba(0,0,0,.2);
  --chi-play-shadow-hover: 0 12px 36px rgba(0,0,0,.28);
}
.chi-video__play{
  position:absolute; inset:0; margin:auto;
  display:grid; place-items:center;
  width: var(--chi-play-size); height: var(--chi-play-size);
  background: var(--chi-play-bg);
  border-radius: var(--chi-play-radius);
  border: 0; cursor: pointer;
  box-shadow: var(--chi-play-shadow);
  transition: transform .18s ease, box-shadow .18s ease;
}
.chi-video__play:hover{ transform: scale(var(--chi-play-scale)); box-shadow: var(--chi-play-shadow-hover); }
.chi-video__play > span{
  display:block;
  border-style: solid;
  border-width: 14px 0 14px 22px;
  border-color: transparent transparent transparent var(--chi-play-icon);
  margin-left: 6px;
}
.chi-video__play:focus-visible{ outline: 3px solid #3B8FC4; outline-offset: 2px; }