:root{ --tf-green:#006600; --tf-white:#ffffff; }
body.rsntf-lock { overflow:hidden; height:100%; overscroll-behavior-y:none; }

.rsntf-inline.rsntf-fixed-full{
  position: fixed; inset: 0; width: 100vw;
  height: 100svh; height: 100dvh; height: 100vh;
  margin:0; padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
  background:#000; overflow:hidden; z-index: 9990; touch-action:none; overscroll-behavior:contain;
}
.rsntf-feed{ position:absolute; inset:0; overflow:hidden; background:#000; }
.rsntf-loader{ position:absolute; inset:0; display:grid; place-items:center; }
.rsntf-loader::after{ content:""; width:44px; height:44px; border:3px solid rgba(0,102,0,.25);
  border-top-color: var(--tf-green); border-radius:50%; animation: tf-spin 1s linear infinite; }
@keyframes tf-spin{ to{ transform: rotate(360deg);} }

.rsntf-slide{ position:absolute; left:0; right:0; top:0; bottom:0;
  display:grid; grid-template-rows:1fr auto; background:#111 center/cover no-repeat;
  opacity:0; transform:translateY(100%); transition: transform .35s ease, opacity .35s ease; }
.rsntf-slide.active{ opacity:1; transform:translateY(0); }
.rsntf-slide.out{ opacity:0; transform:translateY(-100%); }

/* Overlay link for clickable image */
.rsntf-img-link{ position:absolute; inset:0; z-index:1; display:block; cursor:pointer; }

/* Text layer */
.rsntf-meta{ align-self:end; z-index:2; background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.55) 60%, rgba(0,0,0,.9) 100%);
  color:#ffffff; padding:20px 16px calc(28px + env(safe-area-inset-bottom)); text-shadow:0 2px 6px rgba(0,0,0,.5); }
.rsntf-title{ font-size: clamp(20px, 4vw, 28px); font-weight:800; margin:0 0 8px; }
.rsntf-title a{ color:#ffffff !important; text-decoration:none; }
.rsntf-title a:hover{ text-decoration:underline; }
.rsntf-excerpt{ font-size:16px; line-height:1.35; color:#ffffff;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.rsntf-excerpt a{ color:#ffffff !important; text-decoration:none; }

/* Dots */
.rsntf-dots{ position:absolute; left:50%; transform:translateX(-50%); bottom:12px; display:flex; gap:8px; }
.rsntf-dot{ width:34px; height:4px; background: rgba(0,102,0,.25); border-radius:4px; }
.rsntf-dot.active{ background: var(--tf-green); }

/* No-image fallback */
.rsntf-slide.no-image{ background: linear-gradient(180deg, #e8f0e8, #cfe2cf); }

/* Promo slot */
.rsntf-slide.rsntf-promo{
  background:#fff; color:#111; display:grid; grid-template-rows:1fr; place-items:center;
  padding-bottom: env(safe-area-inset-bottom); box-sizing: border-box;
}
.rsntf-slot-frame{
  width: 100vw; height: 100svh; height: 100dvh; height: 820px;
  border: none; display: block; margin: 0; padding: 0; pointer-events:auto;
}

/* Intro overlay (over first post) */
.rsntf-intro-overlay{
  position: absolute; inset: 0; z-index: 4;
  background: rgba(0,0,0,.55);
  display: grid; place-items: center;
  text-align: center; color: var(--tf-white);
  padding: 48px 24px;
}
.rsntf-intro-box{
  max-width: 720px;
  background: rgba(0,102,0,.85);
  border-radius: 16px;
  padding: 28px 22px;
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
}
.rsntf-intro-title{ font-size: clamp(24px, 6vw, 36px); margin: 0 0 8px; font-weight: 800; }
.rsntf-intro-sub{ font-size: clamp(16px, 3.8vw, 20px); margin: 0 0 16px; }
.rsntf-intro-tip{ font-size: 14px; opacity: .9; }

.rsntf-intro-close{
  position: absolute; top: 20px; right: 20px;
  width: 40px; height: 40px; border-radius: 999px;
  display: grid; place-items: center;
  background: rgba(0,0,0,.45);
  color: #fff; font-size: 18px; border: 0; cursor: pointer; z-index:5;
}
.rsntf-intro-icon{
  margin: 14px auto 0; width: 30px; height: 40px; border: 2px solid #fff; border-radius: 16px; position: relative; opacity:.9;
}
.rsntf-intro-icon::after{
  content: ''; position: absolute; left: 50%; transform: translateX(-50%);
  width: 6px; height: 12px; border-radius: 3px; background: #fff; top: 6px;
  animation: rsntf-swipe 1.2s ease-in-out infinite;
}
@keyframes rsntf-swipe{
  0%{ transform: translate(-50%,0); opacity:1; }
  70%{ transform: translate(-50%,12px); opacity: .2; }
  100%{ transform: translate(-50%,0); opacity:1; }
}


/* In-feed ad slot */
.rsntf-card-ad{ display:flex; align-items:center; justify-content:center; min-height: 160px; background:#f7f7f7; border-radius:12px; margin: 8px 0; }
.rsntf-ad-slot{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; min-height:160px; }
.rsntf-card, .rsntf-card-ad{ contain: layout paint; will-change: transform; }