.rewarded-ad {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 14px;
  text-align: left;
  background: #edf4ee;
  border: 1px solid #cfdfd2;
  padding: 15px;
  border-radius: 18px;
  margin-top: 22px;
}
.ad-reward-icon { width: 46px; height: 46px; display: grid; place-items: center; background: var(--sage); color: white; border-radius: 14px; }
.rewarded-ad span { display: block; color: var(--muted); font-size: 12px; margin-top: 3px; }
.rewarded-ad .primary { padding: 11px 14px; box-shadow: none; }
.rewarded-ad .primary:disabled { background: #9ca69f; }
.ad-status { font-size: 11px; color: var(--sage); margin: 6px 0 18px; }
.ad-overlay { position: fixed; inset: 0; background: rgba(21,29,24,.82); z-index: 90; display: none; place-items: center; backdrop-filter: blur(10px); }
.ad-overlay.open { display: grid; }
.ad-player { width: min(480px,calc(100% - 32px)); background: var(--paper); border-radius: 28px; padding: 40px; text-align: center; position: relative; box-shadow: var(--shadow); }
.ad-label { font-size: 10px; letter-spacing: .16em; color: var(--muted); font-weight: 800; }
.ad-close { top: 11px; }
.ad-scene { height: 150px; margin: 20px 0; display: flex; align-items: center; justify-content: center; gap: 24px; background: linear-gradient(135deg,#f8dcc5,#e6edcf); border-radius: 22px; font-size: 50px; overflow: hidden; }
.ad-scene i { width: 70px; height: 4px; background: rgba(82,116,91,.35); border-radius: 4px; position: relative; }
.ad-scene i::after { content: ""; position: absolute; width: 15px; height: 15px; background: var(--sage); border-radius: 50%; top: -6px; left: 0; animation: adDot 1s ease-in-out infinite alternate; }
.ad-player h2 { font: 700 31px Fredoka; margin: 8px; }
.ad-player p { color: var(--muted); }
.ad-progress { height: 8px; background: #e7e2d9; border-radius: 9px; overflow: hidden; margin: 22px 0 10px; }
.ad-progress i { display: block; height: 100%; width: 0; background: var(--peach); }
.ad-player > strong { font-size: 12px; color: var(--muted); }
@keyframes adDot { to { left: 55px; } }
@media (max-width: 560px) {
  .rewarded-ad { grid-template-columns: auto 1fr; }
  .rewarded-ad .primary { grid-column: 1 / -1; }
  .ad-player { padding: 30px 22px; }
}