added advertising

src/styles/card.css

@@ -444,3 +444,130 @@ button.f-card-reward-btn:focus-visible {
     font-size: .95rem;
   }
 }
+
+/* ── Advertisement card ── */
+.ad-slot-placeholder {
+  min-height: 250px; /* высота типичного ad-card — резервируем место, чтобы не дёргалась лента */
+}
+
+.ad-card {
+  position: relative;
+  border-radius: 12px;
+  overflow: hidden;
+  margin: 12px 0;
+}
+
+.ad-card__label {
+  position: absolute;
+  top: 8px;
+  left: 8px;
+  background: rgba(0, 0, 0, 0.6);
+  color: #fff;
+  font-size: 11px;
+  padding: 2px 8px;
+  border-radius: 4px;
+  z-index: 2;
+}
+
+.ad-card__media {
+  width: 100%;
+  height: auto;
+  display: block;
+  cursor: pointer;
+}
+
+.ad-card__close,
+.ad-card__skip-timer {
+  position: absolute;
+  top: 8px;
+  right: 8px;
+  background: rgba(0, 0, 0, 0.6);
+  color: #fff;
+  border: none;
+  border-radius: 50%;
+  width: 28px;
+  height: 28px;
+  font-size: 12px;
+  z-index: 2;
+}
+
+.ad-card__skip-timer {
+  border-radius: 14px;
+  width: auto;
+  padding: 0 10px;
+}
+
+/* ── Полноэкранная реклама (триггер по активному скроллу ленты) ── */
+.fs-ad-overlay {
+  position: fixed;
+  inset: 0;
+  z-index: 300; /* выше всех модалок (.f-viewer-bg = 200, .f-modal-bg = 100) */
+  background: #000;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  animation: mfadeIn .2s ease;
+  cursor: pointer;
+}
+.fs-ad-video {
+  width: 100%;
+  height: 100%;
+  object-fit: contain;
+  display: block;
+}
+.fs-ad-label {
+  position: absolute;
+  top: 16px;
+  left: 16px;
+  background: rgba(0, 0, 0, 0.6);
+  color: #fff;
+  font-size: 11px;
+  padding: 2px 8px;
+  border-radius: 4px;
+  z-index: 2;
+}
+.fs-ad-close,
+.fs-ad-skip-timer {
+  position: absolute;
+  top: 16px;
+  right: 16px;
+  background: rgba(0, 0, 0, 0.6);
+  color: #fff;
+  border: none;
+  z-index: 2;
+}
+.fs-ad-skip-timer {
+  border-radius: 20px;
+  padding: 8px 16px;
+  font-size: 13px;
+  font-weight: 600;
+}
+.fs-ad-close {
+  width: 40px;
+  height: 40px;
+  border-radius: 50%;
+  font-size: 16px;
+  cursor: pointer;
+  transition: background .15s;
+}
+.fs-ad-close:hover {
+  background: rgba(0, 0, 0, 0.85);
+}
+.fs-ad-sound {
+  position: absolute;
+  bottom: 16px;
+  right: 16px;
+  width: 40px;
+  height: 40px;
+  border-radius: 50%;
+  background: rgba(0, 0, 0, 0.6);
+  border: none;
+  color: #fff;
+  font-size: 16px;
+  cursor: pointer;
+  z-index: 2;
+  transition: background .15s;
+}
+.fs-ad-sound:hover {
+  background: rgba(0, 0, 0, 0.85);
+}