/* Publishers visuals, stage eight. decide (vb-decide), dashboard view (vb-dash), pause figure (vb-control). */
.vis-pub{container-type:inline-size;font-family:var(--sans);color:var(--hi)}
.vis-pub *,.vis-pub *::before,.vis-pub *::after{box-sizing:border-box}
.vis-pub h3,.vis-pub p,.vis-pub ol{margin:0;padding:0}
.vis-pub ol{list-style:none}
.vis-pub i,.vis-pub b{font-style:normal;font-weight:inherit}
.vis-pub .p2-crop{position:relative;display:block;overflow:hidden;background:#000;width:100%;border-radius:2px}
.vis-pub .p2-crop img{position:absolute;max-width:none;height:auto;display:block}

/* annotated frames */
.vis-pub .d2-main{display:grid;grid-template-columns:minmax(0,1fr) 300px;column-gap:60px;grid-template-areas:"frame notes" "row src";justify-content:start}
.vis-pub .d2-frame{grid-area:frame;position:relative;aspect-ratio:16/9;background:#000;border-radius:2px;overflow:hidden}
.vis-pub .d2-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vis-pub .d2-ov{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.vis-pub .d2-ghost{fill:none;stroke:var(--light);stroke-opacity:.85;stroke-width:1;stroke-dasharray:3 4;vector-effect:non-scaling-stroke}
.vis-pub .d2-dot{stroke:var(--light);stroke-opacity:.4;stroke-width:1;stroke-dasharray:1 4;vector-effect:non-scaling-stroke}
.vis-pub .d2-br{fill:none;stroke:var(--light);stroke-width:1;vector-effect:non-scaling-stroke}
.vis-pub .d2-box{fill:none;stroke:var(--orange);stroke-width:1.5;vector-effect:non-scaling-stroke}
.vis-pub .d2-chip{position:absolute;transform:translate(-50%,-50%);display:grid;place-items:center;min-width:20px;height:20px;padding:0 5px;background:var(--navy);border:1px solid var(--light2);color:var(--light);font-size:11.5px;font-weight:500;line-height:1;font-variant-numeric:tabular-nums;border-radius:2px}
.vis-pub .d2-ct{display:none}
.vis-pub .d2-notes{grid-area:notes;position:relative;min-width:0}
.vis-pub .d2-note{position:absolute;left:0;width:300px;top:calc(var(--y) - 9px)}
.vis-pub .d2-note::before{content:"";position:absolute;right:calc(100% + 12px);top:9px;height:1px;background:var(--light2);width:calc(48px + var(--lx) * (100cqw - 360px))}
.vis-pub .d2-num{display:block;font-size:14px;font-weight:500;color:var(--acc);line-height:1.3;font-variant-numeric:tabular-nums}
.vis-pub .d2-note h3,.vis-pub .d2-item h3{font-size:17px;font-weight:500;line-height:1.3;letter-spacing:-.005em;margin:4px 0 6px}
.vis-pub .d2-note p,.vis-pub .d2-item p{font-size:14.5px;line-height:1.5;color:var(--mid)}
.vis-pub .d2-row{grid-area:row;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:40px;padding-top:40px}
.vis-pub .d2-cw{position:relative;display:block}
.vis-pub .d2-item .d2-num{margin-top:16px}
.vis-pub .d2-store{position:absolute;display:block;border:1.5px solid var(--orange)}
.vis-pub .d2-src{grid-area:src;align-self:start;padding-top:40px;font-size:14.5px;line-height:1.5;color:var(--mid);max-width:62ch}
.vis-pub.vb-dash .d2-main{grid-template-areas:"frame notes" "src notes"}
.vis-pub.vb-dash .d2-src{padding-top:18px}
@container (max-width:879px){
  .vis-pub .d2-main{grid-template-columns:minmax(0,1fr);grid-template-areas:"frame" "notes" "row" "src"}
  .vis-pub.vb-dash .d2-main{grid-template-areas:"frame" "notes" "src"} /* the dashboard view's two-column areas outranked the line above, squeezing its caption into a sliver */
  .vis-pub .d2-notes{display:grid;gap:18px;padding-top:24px}
  .vis-pub .d2-note{position:static;width:auto}
  .vis-pub .d2-note::before{display:none}
  .vis-pub .d2-ct{display:grid}
  .vis-pub .d2-row{padding-top:30px;column-gap:24px}
  .vis-pub .d2-src{padding-top:24px}
}
@container (max-width:560px){
  .vis-pub .d2-row{grid-template-columns:minmax(0,1fr);row-gap:28px;padding-top:28px}
}

/* pause figure */
.vis-pub.vb-control{max-width:760px}
.vis-pub .c2-cl{font-size:15px;color:var(--mid)}
.vis-pub .c2-big{margin-top:10px;font-size:22px;font-weight:500;line-height:1.25;letter-spacing:-.005em;max-width:30ch}
.vis-pub .c2-sub{margin-top:36px;font-size:14.5px;color:var(--mid)}
.vis-pub .c2-tl{position:relative;margin-top:34px}
.vis-pub .c2-tl svg{display:block;width:100%;height:126px;overflow:visible}
.vis-pub .c2-bars rect{fill:none;stroke:var(--mid);stroke-width:1;vector-effect:non-scaling-stroke}
.vis-pub .c2-bars rect.c2-x{fill:rgba(244,114,33,.25);stroke:var(--orange);stroke-width:1.25}
.vis-pub .c2-pl{stroke:var(--orange);stroke-width:1.5;vector-effect:non-scaling-stroke}
.vis-pub .c2-plab{position:absolute;top:-26px;margin-left:-1px;border-left:1.5px solid var(--orange);padding-left:8px;font-size:14px;line-height:22px;font-weight:500;white-space:nowrap}
.vis-pub .c2-after{position:absolute;bottom:34px;padding-left:10px;font-size:13.5px;line-height:1.3;color:var(--mid);white-space:nowrap}
.vis-pub .c2-time{display:block;border-top:1px solid var(--rule);margin-top:6px;padding-top:8px;font-size:13.5px;color:var(--mid)}
.vis-pub .c2-key{display:flex;gap:10px 28px;flex-wrap:wrap;margin-top:16px;font-size:14px;line-height:1.4;color:var(--mid)}
.vis-pub .c2-key span{display:inline-flex;align-items:center;gap:8px}
.vis-pub .c2-key span::before{content:"";width:18px;height:7px;border:1px solid var(--mid);flex:none}
.vis-pub .c2-key .c2-k1::before{border-color:var(--orange);background:rgba(244,114,33,.25)}
.vis-pub .c2-txt{margin-top:22px;font-size:15.5px;line-height:1.55;color:var(--mid);max-width:62ch}
@container (max-width:460px){.vis-pub .c2-tl svg{height:96px}.vis-pub .c2-after{display:none}}