/* Tonight's programme: a page of the idle poster (programme-view.js). The
   hero word sits in columns 1-4 over its date and the two actions; the
   evening's songs run in two ruled columns over columns 5-12. */
.programme { display: none; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 2; background: var(--ink); color: var(--paper); }
.programme.shown { display: block; }
.programme::before { content: ""; position: absolute; left: 5vw; right: 5vw; top: 10.5vh; border-top: var(--hair) solid var(--rule); }
.programme p, .programme h1, .programme ol { margin: 0; padding: 0; }
.programme-target, .programme-count { position: absolute; top: 6vh; font-size: 2.2vh; font-weight: 500; letter-spacing: .01em; color: var(--paper-2); }
.programme-target { left: 5vw; right: 40vw; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.programme-count { right: 5vw; font-feature-settings: "tnum"; }
.programme-word { position: absolute; left: 5vw; width: 29.16vw; top: 13vh; font-size: 13.6vh; line-height: .9; font-weight: 820; font-stretch: 80%; font-variation-settings: "wdth" 80; letter-spacing: -.02em; white-space: nowrap; }
.programme-date { position: absolute; left: 5vw; width: 29.16vw; top: 27.5vh; font-size: 5vh; line-height: 1.05; font-weight: 750; font-stretch: 88%; font-variation-settings: "wdth" 88; }
.programme-actions { position: absolute; left: 5vw; width: 29.16vw; bottom: 11vh; }
.programme-actions button { display: block; width: 100%; min-height: 7vh; margin: 0; padding: 1.2vh 1vw; box-sizing: border-box; border: 0; border-bottom: var(--hair) solid var(--rule); background: transparent; color: var(--paper); font: inherit; text-align: left; cursor: pointer; }
.programme-actions button:first-child { border-top: var(--hair) solid var(--rule); }
.programme-actions button span:first-child { display: block; font-size: 2.6vh; font-weight: 700; }
.programme-actions button span:last-child { display: block; font-size: 2.2vh; font-weight: 500; color: var(--paper-2); }
.programme-actions button span:last-child:empty { display: none; }
.programme-actions button.selected { background: var(--paper); color: var(--ink); outline: none; }
.programme-actions button.selected span:last-child { color: var(--ink); }
.programme-actions button.chosen span:first-child::before { content: ""; display: inline-block; width: 2.2vh; height: 2.2vh; margin-right: .6vw; vertical-align: -.2vh; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3.5 12.5l5.5 5.5L20.5 6' fill='none' stroke='black' stroke-width='3.2' stroke-linecap='square'/%3E%3C/svg%3E") center / contain no-repeat; }
.programme-list { position: absolute; left: 35.42vw; right: 5vw; top: 13vh; bottom: 6vh; display: flex; }
.programme-col { flex: 1; list-style: none; }
.programme-col + .programme-col { margin-left: 1.25vw; }
.programme-col li { display: flex; align-items: center; height: 6.6vh; border-bottom: var(--hair) solid var(--rule); }
.programme-number { width: 2.6vw; flex-shrink: 0; font-size: 2.2vh; font-weight: 500; font-feature-settings: "tnum"; color: var(--paper-2); }
.programme-words { flex: 1; min-width: 0; }
.programme-words strong, .programme-words span { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.programme-words strong { font-size: 2.6vh; font-weight: 700; }
.programme-words span { font-size: 2.1vh; font-weight: 500; color: var(--paper-2); }
.programme-words span:empty { display: none; }
.programme-time { margin-left: 1vw; flex-shrink: 0; font-size: 2.2vh; font-weight: 500; font-feature-settings: "tnum"; color: var(--paper-2); }
.programme-more strong { font-weight: 600; color: var(--paper-2); }