/* 2026-08-06 — 16:9 cover carousel and direct cover-to-reader transition. */
.chxStoriesHeader{
  min-height:58px;
  display:grid!important;
  grid-template-columns:max-content minmax(260px,420px) 1fr max-content;
  align-items:center!important;
  gap:15px!important;
  padding:0 4px 11px!important;
}
.chxStoriesHeader h2{
  margin:0!important;
  font:1000 clamp(21px,1.8vw,30px)/1 Inter,sans-serif!important;
  letter-spacing:.1em!important;
}
.chxStoriesHeader .chxStoriesSearch{grid-column:2;width:100%;box-sizing:border-box}
.chxStoriesHeader .chxStoriesUnlockProgress{grid-column:4;justify-self:end}

.chxStoriesCarousel{position:relative;min-height:0;padding:18px 38px 8px}
.chxStoriesGrid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:clamp(12px,1.1vw,18px)!important;
  align-content:start;
}
.chxStoryTile{
  position:relative;
  min-width:0!important;
  min-height:0!important;
  aspect-ratio:16/9;
  display:block!important;
  padding:0!important;
  overflow:hidden;
  border:1px solid rgba(91,222,247,.25)!important;
  border-radius:0!important;
  clip-path:none!important;
  background:#03111a!important;
  cursor:pointer;
  transform:translateZ(0);
  transition:transform .3s cubic-bezier(.18,.74,.2,1),border-color .2s,box-shadow .28s,opacity .2s!important;
}
.chxStoryTile:hover,.chxStoryTile:focus-visible{
  z-index:4;
  outline:0;
  border-color:rgba(104,229,250,.72)!important;
  box-shadow:0 18px 42px rgba(0,0,0,.46),0 0 28px rgba(69,211,239,.11)!important;
  transform:translateY(-3px) scale(1.018)!important;
}
.chxStoryTile.isOpening{pointer-events:none;opacity:.55;transform:scale(.985)!important}
.chxStoryTileVisual{position:absolute!important;inset:0;min-height:0!important;display:block;overflow:hidden;background:#03111a}
.chxStoryTileVisual:before{display:none!important}
.chxStoryTileVisual:after{
  content:"";
  position:absolute;
  z-index:1;
  inset:0;
  background:rgba(1,7,12,.12)!important;
  opacity:0;
  transition:opacity .28s ease;
}
.chxStoryTileVisual>img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .55s cubic-bezier(.18,.74,.2,1),filter .3s!important}
.chxStoryTile:hover .chxStoryTileVisual>img,.chxStoryTile:focus-visible .chxStoryTileVisual>img{filter:brightness(.58) saturate(.92)!important;transform:scale(1.045)!important}
.chxStoryTile:hover .chxStoryTileVisual:after,.chxStoryTile:focus-visible .chxStoryTileVisual:after{opacity:1}
.chxStoryTile.isLocked .chxStoryTileVisual>img{filter:saturate(.38) brightness(.54)}
.chxStoryInteractiveTag{
  position:absolute;
  z-index:5;
  top:9px;
  left:9px;
  padding:6px 8px;
  border:1px solid rgba(111,211,235,.42)!important;
  color:#c9f4fb!important;
  background:rgba(32,118,143,.56)!important;
  box-shadow:none!important;
  font:950 6px/1 Inter,sans-serif!important;
  letter-spacing:.11em;
  backdrop-filter:blur(5px);
}
.chxStoryTileOverlay{
  position:absolute;
  z-index:4;
  inset:0;
  display:grid;
  grid-template-rows:auto 1fr auto;
  align-items:center;
  gap:12px;
  padding:clamp(18px,2.1vw,32px);
  box-sizing:border-box;
  color:#fff;
  background:linear-gradient(180deg,rgba(1,7,12,.62),rgba(1,7,12,.24) 34%,rgba(1,7,12,.35) 64%,rgba(1,7,12,.78));
  opacity:0;
  transform:scale(.985);
  transition:opacity .27s ease,transform .4s cubic-bezier(.18,.74,.2,1);
  pointer-events:none;
}
.chxStoryTile:hover .chxStoryTileOverlay,.chxStoryTile:focus-visible .chxStoryTileOverlay{opacity:1;transform:none}
.chxStoryTileOverlay>strong{align-self:start;padding:0 12%;font:1000 clamp(15px,1.25vw,23px)/1.08 Inter,sans-serif;letter-spacing:.035em;text-align:center;text-shadow:0 3px 12px #000}
.chxStoryTileOverlay>p{max-width:88%;max-height:7.2em;margin:0 auto;overflow:hidden;display:-webkit-box;color:#f3fbfd;font:750 clamp(10px,.72vw,13px)/1.5 Inter,sans-serif;text-align:center;text-shadow:0 2px 9px #000;-webkit-box-orient:vertical;-webkit-line-clamp:5}
.chxStoryTileOverlay>span{align-self:end;display:flex;align-items:end;justify-content:space-between;gap:15px;border-top:1px solid rgba(121,223,243,.26);padding-top:10px}
.chxStoryTileOverlay b{font:1000 clamp(10px,.78vw,14px)/1 Inter,sans-serif;letter-spacing:.04em}
.chxStoryTileOverlay em{color:#8adcf0;font:900 clamp(7px,.55vw,10px)/1 Inter,sans-serif;letter-spacing:.11em;font-style:normal;text-transform:uppercase}

.chxStoriesArrow{
  position:absolute;
  z-index:7;
  top:50%;
  width:36px;
  height:74px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid rgba(91,222,247,.36);
  color:#72e5fa;
  background:rgba(3,22,32,.9);
  box-shadow:0 10px 30px rgba(0,0,0,.34);
  font:400 28px/1 Arial,sans-serif;
  cursor:pointer;
  transform:translateY(-50%);
}
.chxStoriesArrow.previous{left:-2px}.chxStoriesArrow.next{right:-2px}
.chxStoriesArrow:hover:not(:disabled){color:#03131b;background:#63e4fb}
.chxStoriesArrow:disabled{opacity:.2;cursor:default}
.chxStoriesArrow[hidden]{display:none!important}
.chxStoriesEmpty{min-height:320px;aspect-ratio:auto}

/* Transform-only FLIP: the selected cover becomes the reader cover without a hard cut. */
.chxStoryPortal{background:rgba(0,5,11,0)!important;transition:background .42s ease,opacity .24s ease!important}
.chxStoryPortalBook{
  left:0!important;
  top:0!important;
  width:var(--story-target-w)!important;
  height:var(--story-target-h)!important;
  border:1px solid rgba(85,222,248,.35)!important;
  transform:translate3d(var(--story-source-x),var(--story-source-y),0) scale(var(--story-source-scale-x),var(--story-source-scale-y))!important;
  transform-origin:0 0!important;
  transition:transform .58s cubic-bezier(.16,.78,.18,1),box-shadow .45s ease!important;
  will-change:transform;
}
.chxStoryPortalBook>img{width:100%;height:100%;object-fit:cover}
.chxStoryPortal.active{background:rgba(0,5,11,.96)!important}
.chxStoryPortal.active .chxStoryPortalBook,.chxStoryPortal.returning .chxStoryPortalBook{
  transform:translate3d(var(--story-target-x),var(--story-target-y),0) scale(1)!important;
  box-shadow:0 28px 90px rgba(0,0,0,.7)!important;
}
.chxStoryPortal.readerReady{opacity:0!important}
.chxStoryPortal.readerReady .chxStoryPortalBook{filter:none!important;transform:translate3d(var(--story-target-x),var(--story-target-y),0) scale(1)!important}
.chxStoryPortal.leaving{opacity:0!important}
.chxStoryPortal.leaving .chxStoryPortalBook{filter:none!important}

@media(max-width:1499px){
  .chxStoriesGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:850px){
  .chxStoriesHeader{grid-template-columns:max-content minmax(0,1fr)!important;align-items:center!important;flex-direction:initial!important}
  .chxStoriesHeader .chxStoriesSearch{grid-column:1/-1;grid-row:2;width:100%!important}
  .chxStoriesHeader .chxStoriesUnlockProgress{grid-column:2;grid-row:1}
  .chxStoriesCarousel{padding-inline:30px}
}
@media(max-width:619px){
  .chxStoriesGrid{grid-template-columns:1fr!important}
  .chxStoriesCarousel{padding:12px 24px 6px}
  .chxStoriesArrow{width:30px;height:62px}
  .chxStoryTileOverlay{padding:18px}
  .chxStoryTileOverlay>p{font-size:10px;-webkit-line-clamp:3}
}
@media(prefers-reduced-motion:reduce){
  .chxStoryTile,.chxStoryTileVisual>img,.chxStoryTileOverlay,.chxStoryPortalBook{transition-duration:.01ms!important}
}
