/* Platforms visuals, stage eight. */
.vis-plat.p2{container-type:inline-size;font-family:var(--sans);width:100%;min-width:0;color:var(--hi)}
.vis-plat.p2 *{box-sizing:border-box}
.vis-plat.p2 .tnum{font-variant-numeric:tabular-nums}
.vis-plat.p2 .p2-credit{margin:22px 0 0;font-size:15px;line-height:1.5;color:var(--mid);max-width:72ch}

/* store view: a navy screen, two states */
.vis-plat.vp-store.p2 .p2-win{background:var(--navy);color:var(--light);border-radius:2px}
.vis-plat.vp-store.p2 .p2-bar{height:44px;border-bottom:1px solid var(--rulen);display:flex;align-items:center;gap:24px;padding:0 22px;font-size:14px;color:var(--light2)}
.vis-plat.vp-store.p2 .p2-mk{width:12px;height:12px;border:1px solid var(--light2);flex:none}
.vis-plat.vp-store.p2 .p2-srch{flex:0 1 180px;min-width:30px;height:18px;border:1px solid var(--rulen);margin-left:auto}
.vis-plat.vp-store.p2 .p2-panes{display:grid;grid-template-columns:minmax(0,1.1fr) 72px minmax(0,1fr)}
.vis-plat.vp-store.p2 .p2-pa,.vis-plat.vp-store.p2 .p2-pb{padding:24px 22px 22px;min-width:0}
.vis-plat.vp-store.p2 .p2-hero{display:grid;grid-template-columns:minmax(0,56%) minmax(0,1fr);gap:20px}
.vis-plat.vp-store.p2 .p2-hero img{width:100%;aspect-ratio:268/151;object-fit:cover;height:auto;display:block;border-radius:2px}
.vis-plat.vp-store.p2 .p2-meta{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.vis-plat.vp-store.p2 .p2-ttl{font-size:21px;font-weight:500;line-height:1.25}
.vis-plat.vp-store.p2 .p2-bar1{display:block;width:62%;height:5px;background:var(--rulen);margin:12px 0 18px}
.vis-plat.vp-store.p2 .p2-btns{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.vis-plat.vp-store.p2 .p2-row{display:flex;gap:8px;flex-wrap:wrap}
.vis-plat.vp-store.p2 .p2-b{display:inline-flex;align-items:center;height:30px;padding:0 12px;font-size:13.5px;font-weight:500;border:1px solid var(--light2);color:var(--light);white-space:nowrap;line-height:1;border-radius:2px}
.vis-plat.vp-store.p2 .p2-try{background:var(--orange);border-color:var(--orange);color:var(--navy)}
.vis-plat.vp-store.p2 .p2-blk{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:20px}
.vis-plat.vp-store.p2 .p2-blk i{display:block;aspect-ratio:16/6;border:1px solid var(--rulen);border-radius:2px}
.vis-plat.vp-store.p2 .p2-gut{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:22px 0}
.vis-plat.vp-store.p2 .p2-ln{width:1px;flex:1;background:var(--rulen)}
.vis-plat.vp-store.p2 .p2-gt{font-size:13px;font-weight:500;color:var(--light2);writing-mode:vertical-rl;transform:rotate(180deg);white-space:nowrap}
.vis-plat.vp-store.p2 .p2-by{display:block;font-size:13.5px;font-weight:500;color:var(--blue);border-top:1px solid var(--blue);padding-top:6px;margin:-6px 0 10px}
.vis-plat.vp-store.p2 .p2-crop{position:relative;overflow:hidden;width:100%;aspect-ratio:952/535;background:#000;border-radius:2px}
.vis-plat.vp-store.p2 .p2-crop img{position:absolute;display:block;max-width:none;width:134.45%;height:auto;left:-17.23%;top:-13.64%}
.vis-plat.vp-store.p2 .p2-ctrl{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:12px}
.vis-plat.vp-store.p2 .p2-m{font-size:13px;color:var(--light2);text-align:center;min-width:0}
.vis-plat.vp-store.p2 .p2-caps{display:grid;grid-template-columns:minmax(0,1.1fr) 72px minmax(0,1fr);margin-top:8px}
.vis-plat.vp-store.p2 .p2-cap{display:grid;grid-template-columns:28px minmax(0,1fr);margin:16px 0 0;font-size:15.5px;line-height:1.5;color:var(--mid)}
.vis-plat.vp-store.p2 .p2-cap+.p2-cap{grid-column:3}
.vis-plat.vp-store.p2 .p2-n{font-size:14px;font-weight:500;color:var(--acc);padding-top:1px}
.vis-plat.vp-store.p2 .p2-cap b{font-weight:500;color:var(--hi)}
@container (max-width:760px){
  .vis-plat.vp-store.p2 .p2-panes{grid-template-columns:minmax(0,1fr)}
  .vis-plat.vp-store.p2 .p2-gut{flex-direction:row;padding:12px 22px;gap:14px}
  .vis-plat.vp-store.p2 .p2-ln{height:1px;width:auto}
  .vis-plat.vp-store.p2 .p2-gt{writing-mode:horizontal-tb;transform:none}
  .vis-plat.vp-store.p2 .p2-pb{padding-top:26px}
  .vis-plat.vp-store.p2 .p2-caps{grid-template-columns:minmax(0,1fr)}
  .vis-plat.vp-store.p2 .p2-cap+.p2-cap{grid-column:1}
}
@container (max-width:480px){
  .vis-plat.vp-store.p2 .p2-pa,.vis-plat.vp-store.p2 .p2-pb{padding:16px}
  .vis-plat.vp-store.p2 .p2-pb{padding-top:20px}
  .vis-plat.vp-store.p2 .p2-hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
  .vis-plat.vp-store.p2 .p2-ttl{font-size:17px}
  .vis-plat.vp-store.p2 .p2-bar1{margin:8px 0 10px}
  .vis-plat.vp-store.p2 .p2-blk{display:none}
  .vis-plat.vp-store.p2 .p2-bar{gap:14px;padding:0 16px}
  .vis-plat.vp-store.p2 .p2-hs{display:none}
  .vis-plat.vp-store.p2 .p2-ctrl{flex-wrap:wrap}
  .vis-plat.vp-store.p2 .p2-m{order:3;flex:1 0 100%;text-align:left}
}

/* what runs where */
.vis-plat.vp-runs.p2 .p2-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:140px repeat(5,minmax(0,1fr));grid-template-rows:auto 1px auto}
.vis-plat.vp-runs.p2 .p2-lane{grid-column:1;font-size:15px;font-weight:500;line-height:1.4;color:var(--hi)}
.vis-plat.vp-runs.p2 .p2-lt{grid-row:1;padding:8px 0 28px}
.vis-plat.vp-runs.p2 .p2-lb{grid-row:3;padding-top:28px}
.vis-plat.vp-runs.p2 .p2-line{grid-column:1/-1;grid-row:2;background:var(--blue)}
.vis-plat.vp-runs.p2 .p2-x{grid-row:2;align-self:start;justify-self:start;position:relative;width:1px;height:84px;margin-top:-42px;background:var(--light2);margin-left:-1px}
.vis-plat.vp-runs.p2 .p2-x::after{content:"";position:absolute;left:-3px;top:39px;width:7px;height:7px;background:var(--hi)}
.vis-plat.vp-runs.p2 .p2-x1{grid-column:3}
.vis-plat.vp-runs.p2 .p2-x2{grid-column:4}
.vis-plat.vp-runs.p2 .p2-st{display:block;min-width:0;padding:0 14px 0 18px}
.vis-plat.vp-runs.p2 .p2-p{grid-row:1;padding-bottom:28px;padding-top:8px}
.vis-plat.vp-runs.p2 .p2-i{grid-row:3;padding-top:28px}
.vis-plat.vp-runs.p2 .p2-s1{grid-column:2}
.vis-plat.vp-runs.p2 .p2-s2{grid-column:3}
.vis-plat.vp-runs.p2 .p2-s3{grid-column:4}
.vis-plat.vp-runs.p2 .p2-s5{grid-column:6}
.vis-plat.vp-runs.p2 .p2-tg{display:flex;gap:10px;font-size:13.5px;font-weight:500;color:var(--mid);margin-bottom:10px}
.vis-plat.vp-runs.p2 .p2-who{display:none}
.vis-plat.vp-runs.p2 .p2-big{display:block;font-size:clamp(21px,2.4cqw,26px);font-weight:500;letter-spacing:-.01em;line-height:1.1;margin-bottom:10px}
.vis-plat.vp-runs.p2 .p2-sm{display:block;font-size:14.5px;line-height:1.5;color:var(--mid)}
.vis-plat.vp-runs.p2 .p2-fail{display:block;margin-top:12px;font-size:13.5px;color:var(--mid);border-top:1px solid var(--rule);padding-top:8px;max-width:170px}
.vis-plat.vp-runs.p2 .p2-s4{grid-column:5;grid-row:1/4;display:grid;grid-template-rows:subgrid;padding:0 6px}
.vis-plat.vp-runs.p2 .p2-up{grid-row:1;align-self:stretch;display:flex;flex-direction:column;border:1px solid var(--rule);border-bottom:0;padding:7px 12px 16px;border-radius:2px 2px 0 0}
.vis-plat.vp-runs.p2 .p2-up>.p2-sm{margin-top:auto}
.vis-plat.vp-runs.p2 .p2-dn{grid-row:3;align-self:start;display:block;border:1px solid var(--rule);border-top:0;padding:16px 12px 14px;border-radius:0 0 2px 2px}
.vis-plat.vp-runs.p2 .p2-lt2{display:block;font-size:13px;color:var(--mid);margin-bottom:3px}
.vis-plat.vp-runs.p2 .p2-dn .p2-lt2{color:var(--acc)}
@container (max-width:859px){
  .vis-plat.vp-runs.p2 .p2-grid{display:block}
  .vis-plat.vp-runs.p2 .p2-lane,.vis-plat.vp-runs.p2 .p2-line,.vis-plat.vp-runs.p2 .p2-x{display:none}
  .vis-plat.vp-runs.p2 .p2-st{padding:2px 0 2px 20px;margin-bottom:26px;border-left:1px solid var(--rule)}
  .vis-plat.vp-runs.p2 .p2-i{border-left-color:var(--blue)}
  .vis-plat.vp-runs.p2 .p2-s4{display:block;border-left:0;padding:0}
  .vis-plat.vp-runs.p2 .p2-up,.vis-plat.vp-runs.p2 .p2-dn{border:0;padding:2px 0 2px 20px;border-radius:0}
  .vis-plat.vp-runs.p2 .p2-up{border-left:1px solid var(--rule);padding-bottom:12px}
  .vis-plat.vp-runs.p2 .p2-dn{border-left:1px solid var(--blue)}
  .vis-plat.vp-runs.p2 .p2-st:last-child{margin-bottom:0}
  .vis-plat.vp-runs.p2 .p2-who{display:inline;font-size:13.5px;color:var(--mid)}
  .vis-plat.vp-runs.p2 .p2-i .p2-who{color:var(--acc)}
  .vis-plat.vp-runs.p2 .p2-both .p2-who{display:none}
  .vis-plat.vp-runs.p2 .p2-big{font-size:24px}
  .vis-plat.vp-runs.p2 .p2-sm{max-width:48ch}
  .vis-plat.vp-runs.p2 .p2-fail{max-width:none}
}

/* deployment summary (navy band) */
.vis-plat.vp-note.p2 .p2-sum{max-width:860px}
.vis-plat.vp-note.p2 .p2-l{font-size:15px;color:var(--mid);margin:0}
.vis-plat.vp-note.p2 .p2-sh{display:flex;justify-content:space-between;align-items:baseline;gap:12px 24px;flex-wrap:wrap;padding-bottom:16px;border-bottom:1px solid var(--rule)}
.vis-plat.vp-note.p2 .p2-sht{font-weight:500;font-size:22px;margin:0;letter-spacing:-.005em;line-height:1.25}
.vis-plat.vp-note.p2 .p2-list{list-style:none;margin:0;padding:0;border-bottom:1px solid var(--rule)}
.vis-plat.vp-note.p2 .p2-it{display:grid;grid-template-columns:minmax(0,1fr) 180px;column-gap:24px;padding:16px 0;border-top:1px solid var(--rule);font-size:17px;line-height:1.5}
.vis-plat.vp-note.p2 .p2-it:first-child{border-top:0}
.vis-plat.vp-note.p2 .p2-src{font-size:14px;color:var(--mid);padding-top:3px;text-align:right}
.vis-plat.vp-note.p2 .p2-agreed{margin:22px 0 0;font-size:16px;line-height:1.55;color:var(--mid);max-width:62ch}
@container (max-width:640px){.vis-plat.vp-note.p2 .p2-it{grid-template-columns:minmax(0,1fr)}.vis-plat.vp-note.p2 .p2-src{text-align:left;padding-top:4px}}
