/* JNN Broadcast Desk Phase 2 — approved still + independent illustrated paper edge.
 * The paper motion is a stylized overlay, not real hand-performance footage. */
.jnn-broadcast__visual{
  position:absolute;inset:0;z-index:0;width:100%;height:100%;
  overflow:hidden;isolation:isolate;background:#0b1625;
}
.jnn-broadcast__visual>img{
  position:absolute;inset:0;width:100%;height:100%;display:block;
  object-fit:cover;object-position:50% 50%;pointer-events:none;
}
.jnn-broadcast__visual .jnn-broadcast__scene{
  filter:brightness(.9) saturate(.9) contrast(1.03);
}
.jnn-broadcast__actor{
  opacity:0;pointer-events:none;transform:translateZ(0);
}
.jnn-broadcast__actor--mouth{
  -webkit-mask-image:radial-gradient(ellipse 2.8% 2.1% at 37.4% 33.5%,#000 34%,transparent 95%);
  mask-image:radial-gradient(ellipse 2.8% 2.1% at 37.4% 33.5%,#000 34%,transparent 95%);
  transform-origin:37.4% 33.5%;
  filter:brightness(.9) saturate(.9) contrast(1.03);
}
.jnn-broadcast__actor--hand{
  z-index:3;
  -webkit-mask-image:radial-gradient(ellipse 8% 9% at 59% 86%,#000 43%,transparent 89%);
  mask-image:radial-gradient(ellipse 8% 9% at 59% 86%,#000 43%,transparent 89%);
  filter:brightness(.9) saturate(.9) contrast(1.03);
}
.jnn-broadcast__paper-rig{
  position:absolute;inset:0;z-index:2;width:100%;height:100%;
  overflow:visible;opacity:0;pointer-events:none;
  transform-origin:52.5% 83%;
}
.jnn-broadcast__paper-contact,
.jnn-broadcast__paper-sheet{
  transform-box:fill-box;transform-origin:center center;
}
.jnn-broadcast[data-desk-state="preparing"] .jnn-broadcast__paper-rig{
  animation:jnn-paper-handled .84s cubic-bezier(.27,.66,.3,1) both;
}
.jnn-broadcast[data-desk-state="preparing"] .jnn-broadcast__actor--hand{opacity:1}
.jnn-broadcast[data-desk-state="preparing"] .jnn-broadcast__paper-contact{
  animation:jnn-paper-shadow .84s ease-in-out both;
}
.jnn-broadcast[data-desk-state="reading"] .jnn-broadcast__actor--mouth{
  opacity:.98;animation:jnn-desk-speaking-cue 1.36s ease-in-out infinite both;
}
@keyframes jnn-paper-handled{
  0%{opacity:0;transform:translate3d(0,0,0) rotate(0)}
  13%{opacity:.35;transform:translate3d(0,0,0) rotate(0)}
  27%{opacity:.84;transform:translate3d(-2px,-2px,0) rotate(-.2deg)}
  46%{opacity:.94;transform:translate3d(-5px,-6px,0) rotate(-.6deg)}
  62%{opacity:.91;transform:translate3d(-1px,-4px,0) rotate(.3deg)}
  78%{opacity:.82;transform:translate3d(1px,-1px,0) rotate(-.1deg)}
  100%{opacity:0;transform:translate3d(0,0,0) rotate(0)}
}
@keyframes jnn-paper-shadow{
  0%,100%{opacity:.3;transform:translateY(0)}
  43%{opacity:.14;transform:translate(3px,2px)}
  78%{opacity:.32;transform:translateY(0)}
}
@keyframes jnn-desk-speaking-cue{
  0%,100%{transform:none;opacity:.65}
  12%{transform:scaleY(1.065);opacity:.98}
  22%{transform:scaleY(.992);opacity:.82}
  35%{transform:scaleY(1.095);opacity:.98}
  44%{transform:scaleY(1.013);opacity:.8}
  55%{transform:scaleY(1.054);opacity:.96}
  67%{transform:scaleY(1.005);opacity:.76}
  79%{transform:scaleY(1.072);opacity:.97}
  91%{transform:scaleY(.99);opacity:.78}
}
.jnn-broadcast-screen--active .jnn-broadcast__visual{animation:jnn-broadcast-focus 2.4s ease-out both}
.jnn-broadcast-screen--active .jnn-broadcast__scene{animation:none!important}
.jnn-broadcast::after{
  z-index:1;background:linear-gradient(180deg,#08121b78 0%,transparent 24%,transparent 70%,#08111c9a 100%);
}
.jnn-broadcast__top{z-index:5}
.jnn-broadcast__lower{z-index:5}
.jnn-broadcast__title{
  display:block;-webkit-line-clamp:unset;overflow:visible;max-height:none;
  overflow-wrap:anywhere;line-height:1.17;text-wrap:balance;
}
.jnn-broadcast__excerpt{
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;
  overflow:hidden;margin:6px 0 10px;color:#dfd1bb;
  font:500 clamp(.65rem,.92vw,.84rem)/1.45 system-ui,sans-serif;
}
.jnn-broadcast__excerpt[hidden]{display:none}
.jnn-broadcast__reading-cue{
  display:inline-block;font:800 .52rem/1.35 system-ui,sans-serif;
  letter-spacing:.085em;color:#e5c38a;text-transform:uppercase;
}
.jnn-broadcast[data-desk-state="preparing"] .jnn-broadcast__title,
.jnn-broadcast[data-desk-state="preparing"] .jnn-broadcast__kicker,
.jnn-broadcast[data-desk-state="preparing"] .jnn-broadcast__excerpt{
  opacity:.08;transform:translateY(-5px);transition:opacity .18s ease,transform .18s ease;
}
.jnn-broadcast[data-desk-state="revealing"] .jnn-broadcast__kicker{
  animation:jnn-headline-arrive .32s ease-out both;
}
.jnn-broadcast[data-desk-state="revealing"] .jnn-broadcast__title{
  animation:jnn-headline-arrive .44s .07s ease-out both;
}
.jnn-broadcast[data-desk-state="revealing"] .jnn-broadcast__excerpt{
  animation:jnn-headline-arrive .45s .16s ease-out both;
}
@keyframes jnn-headline-arrive{
  from{opacity:.1;transform:translateY(9px)}
  to{opacity:1;transform:translateY(0)}
}
.jnn-broadcast__actions{gap:8px}
.jnn-broadcast__actions a,.jnn-broadcast__actions button{
  min-height:42px;font-size:clamp(.56rem,.78vw,.66rem);
}
.jnn-broadcast__actions button:disabled{opacity:.5;cursor:not-allowed}
.jnn-intro-dialog__skip{
  display:inline-flex;align-items:center;justify-content:center;
  padding:11px 15px;border:1px solid #b68d54;color:#f3dcae;
  background:#162437;text-decoration:none;
  font:800 .68rem/1.3 system-ui,sans-serif;
  letter-spacing:.08em;min-height:44px;
}
.jnn-intro-dialog__skip:focus-visible,.jnn-intro-dialog__skip:hover{
  outline:2px solid #f8dfaf;outline-offset:2px;
  background:#d4ac68;color:#10151f;
}
/* Keep the inline homepage player stacked: room for the complete approved still
   and a legible article strip at any homepage grid width. */
.jnn-press-ident__screen.jnn-broadcast-screen--active{
  aspect-ratio:auto;height:clamp(530px,calc(32vw + 225px),735px);
}
@media(min-width:481px) and (max-width:900px){
  .jnn-press-ident__screen.jnn-broadcast-screen--active{
    height:clamp(490px,calc(56.25vw + 210px),735px);
  }
}
.jnn-press-ident__screen .jnn-broadcast{
  display:flex;flex-direction:column;
}
.jnn-press-ident__screen .jnn-broadcast__visual{
  position:relative;inset:auto;flex:none;width:100%;height:auto;aspect-ratio:16/9;
}
.jnn-press-ident__screen .jnn-broadcast__lower{
  position:relative;inset:auto;flex:1;min-height:0;
  width:100%;max-width:none;max-height:none;
  margin:0;padding:12px clamp(12px,2.5vw,22px);
  overflow:auto;background:linear-gradient(110deg,#0c1628,#09111f);
  border:0;border-top:2px solid #c5a36c;box-shadow:none;
}
.jnn-press-ident__screen .jnn-broadcast__title{
  font-size:clamp(.97rem,1.65vw,1.26rem);margin:3px 0 6px;
}
.jnn-press-ident__screen .jnn-broadcast__excerpt{-webkit-line-clamp:2;font-size:clamp(.68rem,1.1vw,.82rem)}
/* Full-size intro dialog on desktop becomes ONE broadcast frame: a compact
   translucent right-hand news script, above rather than over the paper gesture. */
@media(min-width:860px){
  .jnn-intro-dialog__screen.jnn-broadcast-screen--active{
    aspect-ratio:16/9;height:auto;
  }
  .jnn-intro-dialog__screen.jnn-broadcast-screen--active .jnn-broadcast{display:block}
  .jnn-intro-dialog__screen.jnn-broadcast-screen--active .jnn-broadcast__visual{
    position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;
  }
  .jnn-intro-dialog__screen.jnn-broadcast-screen--active .jnn-broadcast__lower{
    position:absolute;left:auto;top:20%;right:2.3%;bottom:auto;
    width:min(40%,365px);max-width:365px;max-height:74%;
    padding:clamp(10px,1.2vw,17px);margin:0;overflow:auto;
    border:1px solid #bfa06ca8;border-left:3px solid #d6b173;
    background:linear-gradient(115deg,#08121eeb,#111e30e7);
    box-shadow:0 16px 38px #060b18aa;backdrop-filter:blur(2px);
  }
  .jnn-intro-dialog__screen .jnn-broadcast__title{
    font-size:clamp(.89rem,1.2vw,1.17rem);margin:5px 0 8px;
  }
  .jnn-intro-dialog__screen .jnn-broadcast__excerpt{
    font-size:clamp(.64rem,.85vw,.77rem);-webkit-line-clamp:2;
  }
  .jnn-intro-dialog__screen .jnn-broadcast__top{
    top:11px;left:15px;right:15px;
  }
  .jnn-intro-dialog__screen .jnn-broadcast__reading-cue{
    max-width:200px;font-size:.48rem;letter-spacing:.05em;
  }
}
@media(min-width:860px) and (max-height:740px){
  /* Shrink the frame rather than hiding the controls behind dialog scrolling. */
  .jnn-intro-dialog{
    width:min(940px,calc((100dvh - 200px)*16/9),calc(100% - 24px));
  }
  .jnn-intro-dialog__screen .jnn-broadcast__lower{
    top:16%;max-height:81%;padding:9px 12px;
  }
  .jnn-intro-dialog__screen .jnn-broadcast__excerpt{-webkit-line-clamp:1}
  .jnn-intro-dialog__screen .jnn-broadcast__title{font-size:clamp(.83rem,1.17vw,1.04rem)}
}
/* On stacked/mobile broadcasts, the headline-desk label remains, but its
   horizontal border must not cross the presenter's forehead. */
@media(max-width:859px){
  .jnn-broadcast__top{border-bottom:0;padding-bottom:0}
}
/* Smaller screens: preserve the complete still, then stack the editorial strip. */
@media(max-width:859px){
  .jnn-intro-dialog__screen.jnn-broadcast-screen--active{
    aspect-ratio:auto;height:clamp(450px,81vw,640px);
  }
  .jnn-intro-dialog__screen.jnn-broadcast-screen--active .jnn-broadcast{
    display:flex;flex-direction:column;
  }
  .jnn-intro-dialog__screen.jnn-broadcast-screen--active .jnn-broadcast__visual{
    position:relative;inset:auto;flex:none;width:100%;height:auto;aspect-ratio:16/9;
  }
  .jnn-intro-dialog__screen.jnn-broadcast-screen--active .jnn-broadcast__lower{
    position:relative;inset:auto;flex:1;min-height:0;
    width:100%;max-width:none;max-height:none;margin:0;
    padding:12px clamp(12px,2.5vw,22px);overflow:auto;
    background:linear-gradient(115deg,#0d1828,#07101d);
    border:0;border-top:2px solid #c5a36c;box-shadow:none;
  }
  .jnn-intro-dialog__screen .jnn-broadcast__title{
    font-size:clamp(.97rem,1.7vw,1.28rem);
  }
}
@media(max-width:480px){
  .jnn-press-ident__screen.jnn-broadcast-screen--active{height:clamp(420px,110vw,510px)}
  .jnn-intro-dialog__screen.jnn-broadcast-screen--active{height:clamp(430px,116vw,525px)}
  .jnn-broadcast__top{font-size:.45rem;letter-spacing:.06em}
  .jnn-broadcast__top strong{display:block;font-size:.42rem}
  .jnn-broadcast__kicker{font-size:.59rem}
  .jnn-intro-dialog__screen .jnn-broadcast__title,
  .jnn-press-ident__screen .jnn-broadcast__title{
    font-size:clamp(.89rem,3.43vw,1.06rem);line-height:1.15;
  }
  .jnn-broadcast__actions a,.jnn-broadcast__actions button{
    min-height:42px;font-size:.58rem;padding:8px 10px;
  }
  .jnn-broadcast__count,.jnn-broadcast__reading-cue{font-size:.54rem}
  .jnn-intro-dialog__skip{font-size:.58rem}
}
@media(prefers-reduced-motion:reduce){
  .jnn-broadcast__visual,.jnn-broadcast__paper-rig,
  .jnn-broadcast__actor,.jnn-broadcast__paper-contact,
  .jnn-broadcast__title,.jnn-broadcast__excerpt,.jnn-broadcast__kicker{
    animation:none!important;transition:none!important;
  }
  .jnn-broadcast__paper-rig,.jnn-broadcast__actor{display:none!important}
}

/* Fit the short desktop broadcast without forcing the headline into a scroll area. */
@media(min-width:860px) and (max-height:600px){
  .jnn-intro-dialog__screen.jnn-broadcast-screen--active .jnn-broadcast__lower{
    width:min(47%,320px);max-width:320px;
  }
}
/* Remove excessive empty space below the story strip on wider phones.
 * Smallest phones retain their original reading height. */
@media(min-width:390px) and (max-width:480px){
  .jnn-intro-dialog__screen.jnn-broadcast-screen--active{
    height:clamp(425px,105vw,465px);
  }
}


/* Phase 3: independent upper sheet, lower stack and contact shadow.
   These are stylized overlays of the approved still, not real hand footage. */
.jnn-broadcast__paper-under,.jnn-broadcast__paper-top{
  transform-box:fill-box;transform-origin:78% 79%;will-change:transform;
}
.jnn-broadcast__paper-rig{transform-origin:52.5% 83%}
.jnn-broadcast[data-desk-state="preparing"] .jnn-broadcast__paper-under{
  animation:jnn-paper-lower-align .88s cubic-bezier(.2,.64,.34,1) both;
}
.jnn-broadcast[data-desk-state="preparing"] .jnn-broadcast__paper-top{
  animation:jnn-paper-top-lift .88s cubic-bezier(.24,.6,.29,1) both;
}
.jnn-broadcast[data-desk-state="preparing"] .jnn-broadcast__paper-top-shadow{
  animation:jnn-paper-contact-depth .88s ease-in-out both;
}
.jnn-broadcast[data-desk-state="preparing"] .jnn-broadcast__paper-contact{
  animation:jnn-paper-contact-depth .88s ease-in-out both;
}
.jnn-broadcast[data-desk-state="preparing"] .jnn-broadcast__paper-rig{
  animation:jnn-paper-phase3-visible .88s linear both;
}
@keyframes jnn-paper-phase3-visible{
  0%{opacity:0}
  11%{opacity:.2}
  24%,75%{opacity:.98}
  94%{opacity:.25}
  100%{opacity:0}
}
@keyframes jnn-paper-lower-align{
  0%,100%{transform:none}
  35%{transform:translate3d(-2px,-2px,0) rotate(-.1deg)}
  63%{transform:translate3d(2px,-5px,0) rotate(.28deg)}
  80%{transform:translate3d(-1px,-1px,0)}
}
@keyframes jnn-paper-top-lift{
  0%,12%,100%{transform:none}
  24%{transform:translate3d(-4px,-6px,0) rotate(-.4deg)}
  43%{transform:translate3d(-10px,-27px,0) rotate(-1.55deg)}
  57%{transform:translate3d(-7px,-23px,0) rotate(-1deg)}
  76%{transform:translate3d(2px,-4px,0) rotate(.35deg)}
  86%{transform:translate3d(-1px,1px,0) rotate(-.18deg)}
}
@keyframes jnn-paper-contact-depth{
  0%,100%{opacity:.45}
  35%{opacity:.3}
  50%{opacity:.13}
  75%{opacity:.29}
  86%{opacity:.55}
}
.jnn-broadcast__approved-performance{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  object-position:50% 50%;pointer-events:none;z-index:1;opacity:0;
  transition:opacity .34s ease-in-out;
}
.jnn-broadcast__approved-performance[hidden]{display:none!important}
/* Suppress old artificial mouth motion while approved video is configured. */
.jnn-broadcast[data-motion-configured="true"] .jnn-broadcast__actor--mouth{display:none!important}
.jnn-broadcast__approved-performance[data-performance-ready="true"]{opacity:1}
.jnn-broadcast[data-performance-mode] .jnn-broadcast__paper-rig,
.jnn-broadcast[data-performance-mode] .jnn-broadcast__actor{display:none!important}
@media(prefers-reduced-motion:reduce){
  .jnn-broadcast__paper-top,.jnn-broadcast__paper-under,
  .jnn-broadcast__paper-top-shadow,.jnn-broadcast__paper-contact,
  .jnn-broadcast__approved-performance{animation:none!important;transition:none!important}
}