/* M.E. Standard editorial headline carousel — 12 Oct 2026.
   Presentation only. Story eligibility/provenance remain governed by app.js. */
body[data-mes-surface="newsroom"] .front-story-carousel{
  position:absolute;
  top:22px;
  right:24px;
  z-index:6;
  display:flex;
  align-items:center;
  gap:9px;
  min-height:40px;
  padding:7px 9px;
  border:1px solid rgba(255,255,255,.20);
  background:rgba(2,10,18,.78);
  box-shadow:0 10px 34px rgba(0,0,0,.22);
  backdrop-filter:blur(10px);
}
body[data-mes-surface="newsroom"] .front-story-carousel[hidden]{display:none!important}
body[data-mes-surface="newsroom"] .front-carousel-arrow{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.04);
  color:#f5f1e8;
  font-size:15px;
  cursor:pointer;
}
body[data-mes-surface="newsroom"] .front-carousel-arrow:hover,
body[data-mes-surface="newsroom"] .front-carousel-arrow:focus-visible{
  border-color:rgba(219,184,104,.72);
  background:rgba(219,184,104,.10);
  outline:none;
}
body[data-mes-surface="newsroom"] .front-carousel-dots{
  display:flex;
  align-items:center;
  gap:7px;
}
body[data-mes-surface="newsroom"] .front-carousel-dots button{
  width:24px;
  height:30px;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  display:grid;
  place-items:center;
}
body[data-mes-surface="newsroom"] .front-carousel-dots button span{
  width:18px;
  height:3px;
  display:block;
  background:rgba(255,255,255,.34);
  transition:width .18s ease,background .18s ease;
}
body[data-mes-surface="newsroom"] .front-carousel-dots button.is-active span{
  width:24px;
  background:#d8b86f;
}
body[data-mes-surface="newsroom"] .front-carousel-dots button:focus-visible{
  outline:1px solid #d8b86f;
  outline-offset:2px;
}
body[data-mes-surface="newsroom"] .front-carousel-count{
  min-width:34px;
  color:#d6dde1;
  font-size:10px;
  letter-spacing:.08em;
  text-align:center;
}
@media(max-width:700px){
  body[data-mes-surface="newsroom"] .front-story-carousel{
    top:14px;
    right:14px;
    gap:5px;
    padding:5px 6px;
  }
  body[data-mes-surface="newsroom"] .front-carousel-arrow{width:28px;height:28px}
  body[data-mes-surface="newsroom"] .front-carousel-dots{gap:4px}
  body[data-mes-surface="newsroom"] .front-carousel-dots button{width:18px;height:28px}
  body[data-mes-surface="newsroom"] .front-carousel-dots button span{width:12px}
  body[data-mes-surface="newsroom"] .front-carousel-dots button.is-active span{width:18px}
  body[data-mes-surface="newsroom"] .front-carousel-count{font-size:9px;min-width:30px}
}
@media(prefers-reduced-motion:reduce){
  body[data-mes-surface="newsroom"] .front-carousel-dots button span{transition:none}
}