/* おうえんコーナー（ショップ下部のカード）と動画広告オーバーレイ */
.ouen-corner {
  margin: 18px auto 8px; padding: 16px 14px 18px; max-width: 420px;
  background: #fff; border-radius: 18px;
  box-shadow: 0 4px 14px rgba(180, 120, 150, .18);
  text-align: center;
}
.ouen-head { font-weight: 800; font-size: 1.05rem; color: #5a3a48; }
.ouen-desc { margin: 8px 0 2px; font-size: .92rem; color: #6b4a57; line-height: 1.6; }
.ouen-desc b { color: #d3387a; }
.ouen-note { margin: 4px 0 12px; font-size: .78rem; color: #a08a94; line-height: 1.6; }
.ouen-btn {
  display: block; width: 100%; padding: 14px 10px;
  border: none; border-radius: 999px; cursor: pointer;
  background: linear-gradient(180deg, #f27ca2, #e75f8e);
  color: #fff; font-weight: 800; font-size: 1.02rem;
  box-shadow: 0 4px 10px rgba(215, 90, 140, .35);
}
.ouen-btn:active { transform: translateY(1px); }

/* 動画広告オーバーレイ（内蔵の特製CM） */
.ad-overlay {
  position: fixed; inset: 0; z-index: 1000;
  background: rgba(20, 10, 18, .88);
  display: flex; align-items: center; justify-content: center; padding: 18px;
}
.ad-frame {
  position: relative; width: min(92vw, 420px);
  background: #17111c; border-radius: 14px; overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .5);
  padding-bottom: 12px;
}
.ad-tag {
  position: absolute; left: 10px; top: 10px; z-index: 2;
  background: rgba(0, 0, 0, .55); color: #fff; font-size: .72rem; font-weight: 700;
  padding: 3px 8px; border-radius: 6px; letter-spacing: 1px;
}
.ad-count {
  position: absolute; right: 10px; top: 10px; z-index: 2;
  background: rgba(0, 0, 0, .55); color: #fff; font-size: .78rem; font-weight: 700;
  padding: 3px 8px; border-radius: 6px;
}
.ad-stagearea {
  position: relative; height: 240px;
  background: linear-gradient(180deg, #ffd6e7 0%, #ffeef5 60%, #fff 100%);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.ad-pig { width: 130px; height: 122px; animation: adPigBounce .7s ease-in-out infinite; }
@keyframes adPigBounce {
  0%, 100% { transform: translateY(0) rotate(-3deg); }
  50% { transform: translateY(-8px) rotate(3deg); }
}
.ad-line {
  margin-top: 10px; min-height: 1.6em;
  font-weight: 800; font-size: 1.08rem; color: #d3387a; text-align: center; padding: 0 12px;
}
.ad-line.ad-line-pop { animation: adLinePop .45s ease; }
@keyframes adLinePop {
  0% { transform: scale(.8); opacity: 0; }
  100% { transform: scale(1); opacity: 1; }
}
.ad-progress { height: 5px; background: #2b2233; }
.ad-progress-fill { height: 100%; width: 0; background: linear-gradient(90deg, #f27ca2, #ffd23d); transition: width .2s linear; }
.ad-close[hidden] { display: none; } /* 再生中は出さない（display:blockに負けないように） */
.ad-close {
  display: block; margin: 12px auto 2px; padding: 12px 18px;
  border: none; border-radius: 999px; cursor: pointer;
  background: linear-gradient(180deg, #f2b34c, #e79a2e);
  color: #fff; font-weight: 800; font-size: .95rem;
  box-shadow: 0 4px 10px rgba(200, 140, 40, .4);
}