/* PIANO ARMY · three partials on the stand (web/army-queue.css). Lionel, 10-17: "we should have 3 partials show up at
   any one time ... however all notes only go to the 1st partial". The live card first, full size, amber-edged and
   tagged "Play now"; the next two after it, smaller and dimmed, tagged "Next" and "Then" (army-sheet.js,
   army-stage.js showPartial). Landscape: one row, the live card twice as wide as each of the others; portrait: the
   live card across the strip, the other two under it side by side. */
#strip .queue { flex: 1; min-width: 0; max-width: 1280px; display: flex; gap: 10px; align-items: stretch; justify-content: center; }
#strip .paper { min-width: 0; max-width: none; }
#strip .paper.live { flex: 2 1 0; box-shadow: 0 0 0 3px #e9a93a, 0 4px 16px rgba(233, 169, 58, .35); }
#strip .paper.live.done { box-shadow: 0 0 0 3px #f0cf85, 0 0 26px rgba(240, 207, 133, .8); }
#strip .paper.next { flex: 1 1 0; opacity: .68; box-shadow: 0 2px 6px rgba(0, 0, 0, .4); }
#strip .paper .tag { flex: none; font: 800 11px/1 "Barlow Condensed", Barlow, sans-serif; letter-spacing: .7px; text-transform: uppercase; padding: 3px 7px; border-radius: 5px; background: #d4891a; color: #fff; }
#strip .paper.next .tag { background: #8d8572; }
#strip .paper.next .head b { font-size: 14px; }
#strip .paper .pc { font-size: 12px; }
#strip .side { position: static; flex: 0 0 170px; width: auto; max-width: none; align-self: flex-start; margin-top: 2px; }
@media (max-width: 1180px) { #strip .side { display: none; } }

#stage[data-orient="portrait"] #strip .queue { flex-wrap: wrap; gap: 6px; }
#stage[data-orient="portrait"] #strip .paper.live { flex: 1 1 100%; }
#stage[data-orient="portrait"] #strip .paper.next { flex: 1 1 0; padding: 2px 6px; }
#stage[data-orient="portrait"] #strip .paper.next .head { font-size: 11px; gap: 5px; }
#stage[data-orient="portrait"] #strip .paper.next .head b { font-size: 12px; }
#stage[data-orient="portrait"] #strip .paper.next .pc { display: none; }
#stage[data-orient="portrait"] #strip .paper.next .sheet { min-height: 40px; }

/* THE STRIP HOLDS STILL: one height whatever the cards on it (a grand staff fits it, smaller), so the arena under it
   never changes size between two partials and the field is never laid out again mid-round (it was 134 to 220 px tall
   with the cards' own heights at 1440x900, and the field zoomed with it once army-stage.js relaid it out) */
#strip { height: 160px; min-height: 0; }
#strip .queue, #strip .paper { min-height: 0; }
#strip .paper { overflow: hidden; }
#stage[data-orient="portrait"] #strip { height: 230px; min-height: 0; }
/* every card's sheet the room left under its head, the staff centred in it (a card wider than its room scrolls from
   its start: "safe" centring) */
#strip .paper .sheet { flex: 1 1 0; min-height: 0; display: flex; align-items: safe center; justify-content: safe center; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
#strip .paper .sheet svg { display: block; flex: none; }
/* portrait: the live card across the top and the taller row, the other two under it; its name before its count */
#stage[data-orient="portrait"] #strip .queue { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: minmax(0, 1.4fr) minmax(0, 1fr); gap: 6px; }
#stage[data-orient="portrait"] #strip .paper.live { grid-column: 1 / -1; }
#stage[data-orient="portrait"] #strip .paper.live #pcount { display: none; }