/* Stories span the page; the horizontal rail stays under the reader's control. */
.rf-body .rf-stories {
  --stories-plum:#28132e;
  --stories-muted:#71596d;
  --stories-gold:#ae7840;
  --stories-gutter:clamp(24px,5.2vw,84px);
  position:relative;
  padding-block:70px 35px;
  overflow:hidden;
  background:#faedf3;
  color:var(--stories-plum);
  border-block:1px solid #eadce6;
}
.rf-stories .rf-stories__header {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:32px;
  margin-bottom:30px;
}
.rf-stories__intro { max-width:740px; }
.rf-stories__intro h2 {
  margin:0 0 16px;
  color:var(--stories-plum);
  font:500 clamp(40px,4.5vw,65px)/1.05 "Fraunces",Georgia,serif;
  letter-spacing:-.045em;
  text-wrap:balance;
}
.rf-stories__intro > p { margin:0; color:var(--stories-muted); font-size:15px; line-height:1.6; }
.rf-stories__rating { flex:none; max-width:244px; padding-bottom:3px; text-align:right; }
.rf-stories__rating > div { display:flex; align-items:center; justify-content:flex-end; gap:13px; }
.rf-stories__rating .rf-stars { gap:3px; font-size:17px; }
.rf-stories__rating .rf-score-stars__base .rf-stars { color:#e0cbd7; }
.rf-stories__rating .rf-score-stars__fill .rf-stars { color:var(--stories-gold); }
.rf-stories__rating b { font:500 29px/1 "Fraunces",Georgia,serif; letter-spacing:-.05em; }
.rf-stories__rating b > span { font:400 15px/1 var(--rf-sans); letter-spacing:0; color:var(--stories-muted); }
.rf-stories__rating p { margin:10px 0 0; font-size:10px; line-height:1.5; color:var(--stories-muted); }
.rf-stories__rows { display:grid; gap:12px; }
.rf-stories__rail {
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:316px;
  gap:14px;
  align-items:stretch;
  padding:3px var(--stories-gutter) 9px;
  overflow-x:auto;
  overscroll-behavior-x:contain;
  scroll-snap-type:x proximity;
  scroll-padding-inline:var(--stories-gutter);
  scrollbar-width:thin;
  scrollbar-color:#bda2b8 transparent;
}
.rf-stories__rail::-webkit-scrollbar { height:3px; }
.rf-stories__rail::-webkit-scrollbar-thumb { border-radius:5px; background:#bda2b8; }
.rf-stories__rail::-webkit-scrollbar-track { margin-inline:var(--stories-gutter); }
.rf-stories__rail:focus-visible { outline:2px solid #a74477; outline-offset:-2px; }
.rf-story {
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:224px;
  padding:22px;
  border:1px solid #e1dce3;
  border-radius:7px;
  background:#fff;
  color:var(--stories-plum);
  scroll-snap-align:start;
}
.rf-story > .rf-stars { align-self:flex-start; margin:13px 0 10px; color:var(--stories-gold); gap:3px; font-size:10px; }
.rf-story blockquote { margin:0; font:400 14px/1.65 var(--rf-sans,"Archivo",sans-serif); letter-spacing:0; text-wrap:pretty; }
.rf-story__author { display:flex; align-items:center; gap:13px; }
.rf-story__identity { min-width:0; }
.rf-story__avatar { flex:none; display:grid; place-items:center; width:64px; height:64px; overflow:hidden; border:1px solid #ddc8d8; border-radius:50%; background:#f2e5ef; color:#9d5f88; }
.rf-story__avatar img { display:block; width:100%; height:100%; object-fit:cover; border-radius:inherit; }
.rf-story__avatar .rf-ico { width:17px; height:17px; }
.rf-story__author b { display:block; margin-bottom:7px; font-size:14px; font-weight:600; line-height:1.3; }
.rf-story__author .rf-verified { width:12px; height:12px; color:#5b705e; }
.rf-stories__rail:nth-child(2) { padding-left:calc(var(--stories-gutter) + 54px); scroll-padding-left:calc(var(--stories-gutter) + 54px); }
.rf-stories .rf-stories__footer { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:20px; }
.rf-stories__hint { display:flex; align-items:center; gap:10px; margin:0; color:var(--stories-muted); font-size:12px; line-height:1.5; }
.rf-stories__hint .rf-ico { flex:none; width:16px; height:16px; color:#9d5f88; }
.rf-stories__browsers { display:flex; gap:25px; }
.rf-stories__navigation { display:flex; align-items:center; gap:7px; }
.rf-stories__navigation[hidden] { display:none; }
.rf-stories__row-label { color:var(--stories-muted); font-size:10px; white-space:nowrap; }
.rf-stories__position { display:flex; gap:3px; min-width:26px; margin-right:3px; font-size:10px; font-variant-numeric:tabular-nums; color:var(--stories-muted); }
.rf-stories__position b { color:var(--stories-plum); font-weight:600; }
.rf-stories__navigation button {
  display:grid;
  place-items:center;
  flex:none;
  width:37px;
  height:37px;
  padding:9px;
  border:1px solid #cdb4c5;
  border-radius:50%;
  background:transparent;
  color:var(--stories-plum);
  cursor:pointer;
  transition:background .18s,color .18s,border-color .18s;
}
.rf-stories__navigation button .rf-ico { width:18px; height:18px; }
.rf-stories__navigation [data-rf-stories-previous] .rf-ico { transform:rotate(180deg); }
.rf-stories__navigation button:hover:not(:disabled) { border-color:#28132e; background:#28132e; color:#fff; }
.rf-stories__navigation button:focus-visible { outline:3px solid #cf086b; outline-offset:4px; }
.rf-stories__navigation button:disabled { opacity:.33; cursor:default; }
/* Single-row variant (unlock page): one long carousel with slightly larger cards. */
.rf-stories--single .rf-stories__rail { grid-auto-columns:364px; gap:18px; padding-bottom:12px; }
.rf-stories--single .rf-story { min-height:262px; padding:27px; border-radius:9px; }
.rf-stories--single .rf-story blockquote { font-size:15px; line-height:1.7; }
.rf-stories--single .rf-story__avatar { width:68px; height:68px; }
.rf-stories--single .rf-story__author b { font-size:15px; }
@media (max-width:959px) {
  .rf-stories .rf-stories__header { align-items:flex-start; gap:24px; }
  .rf-stories__intro { max-width:480px; }
  .rf-stories__rating { max-width:175px; padding-top:5px; }
  .rf-stories__rating > div { flex-wrap:wrap; gap:8px; }
  .rf-stories__intro > p { font-size:14px; }
  .rf-stories .rf-stories__footer { flex-wrap:wrap; }
}
@media (max-width:640px) {
  .rf-body .rf-stories { --stories-gutter:24px; padding-block:48px 27px; }
  .rf-stories .rf-stories__header { display:block; margin-bottom:25px; }
  .rf-stories__intro h2 { margin-bottom:13px; font-size:41px; }
  .rf-stories__intro > p { max-width:32ch; }
  .rf-stories__rating { max-width:none; margin-top:23px; padding:0; text-align:left; }
  .rf-stories__rating > div { justify-content:flex-start; flex-wrap:nowrap; }
  .rf-stories__rating b { font-size:24px; }
  .rf-stories__rating p { margin-top:7px; }
  .rf-stories__rows { gap:9px; }
  .rf-stories__rail { grid-auto-columns:min(86vw,316px); gap:11px; }
  .rf-stories__rail:nth-child(2) { padding-left:var(--stories-gutter); scroll-padding-left:var(--stories-gutter); }
  .rf-story { min-height:222px; padding:18px; }
  .rf-story__avatar { width:56px; height:56px; }
  .rf-stories--single .rf-stories__rail { grid-auto-columns:min(88vw,340px); gap:13px; }
  .rf-stories--single .rf-story { min-height:240px; padding:21px; }
  .rf-stories--single .rf-story blockquote { font-size:14.5px; }
  .rf-stories--single .rf-story__avatar { width:58px; height:58px; }
  .rf-stories--single .rf-stories__browsers { justify-content:center; }
  .rf-stories .rf-stories__footer { display:block; margin-top:17px; }
  .rf-stories__hint { justify-content:center; margin-bottom:16px; font-size:10px; gap:8px; }
  .rf-stories__browsers { justify-content:space-between; gap:12px; }
  .rf-stories__navigation { gap:5px; }
  .rf-stories__row-label { font-size:9px; }
  .rf-stories__position { margin-right:1px; font-size:9px; }
  .rf-stories__navigation button { width:34px; height:34px; padding:8px; }
}
@media (max-width:359px) {
  .rf-body .rf-stories { --stories-gutter:20px; }
  .rf-stories__intro h2 { font-size:36px; }
  .rf-story { padding-inline:17px; }
  .rf-stories__navigation { gap:4px; }
  .rf-stories__navigation button { width:31px; height:31px; padding:7px; }
  .rf-stories__hint .rf-ico { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  .rf-stories__navigation button { transition:none; }
}
