/* The device ecosystems deck. deck.css and the design system draw the slide; this adds its tables, its figures and its live slides. Roles only, but for the live slide's zoom, explained where it is set. */
.facts { width: 100%; border-collapse: collapse; font-size: var(--ds-type-small); line-height: var(--ds-leading-ui) }
.facts :is(th, td) { padding: var(--ds-space-2) var(--ds-space-3) var(--ds-space-2) 0; border-top: var(--ds-line) solid var(--ds-rule); font-weight: var(--ds-weight-regular); text-align: start; vertical-align: top }
.facts thead th { border-top: 0; color: var(--ds-text-2) }
.facts tbody th { font-weight: var(--ds-weight-semibold) }
.facts .n { text-align: end; font-variant-numeric: tabular-nums; white-space: nowrap }
.facts .c { text-align: center }
.two-by-two td { font-size: 1.4em; padding-block: var(--ds-space-5) }
.two-by-two tbody th { width: 32% }
.glyph { width: 2.4em; height: 1em; vertical-align: -.1em; margin-inline-end: .3em }
.refs { font-size: var(--ds-type-small) }
.ds-slide-canvas[data-ds-canvas="fit"] .flow .step { padding: var(--ds-space-3) }

/* A live slide: the page itself, its view alone (html.embed in its own stylesheet), edge to edge above the slide's footer. It takes the pointer, because pointing and orbiting are how it explains
   itself, and hands the keys that move slides back to the deck. Zoomed out a little against the canvas, as Pockets's are, so it is laid out about the size of the tool on a laptop. */
.ds-slide-canvas[data-ds-canvas="fit"].ds-slide--bleed.live-slide { gap: 0 }
.ds-slide-canvas[data-ds-canvas="fit"].live-slide > .live { flex: 1 1 0; min-height: 0; height: auto; width: 100%; aspect-ratio: auto; zoom: .8533; pointer-events: auto }
.ds-slide-canvas[data-ds-canvas="fit"].ds-slide--bleed.live-slide > .ds-slide-foot { position: static; margin: 0; padding: var(--ds-space-1) var(--ds-space-3) }
