.vh-concert{position:absolute;z-index:24;left:20px;top:94px;width:min(360px,calc(100% - 40px));padding:17px 19px;border:1px solid #c9b984;border-radius:12px;background:#f3eddcfa;color:#332d28;box-shadow:0 8px 30px #10132445;font:13px/1.5 Georgia,serif;max-height:calc(100% - 220px);overflow:auto}.vh-concert[hidden],.vh-concert [hidden]{display:none!important}.vh-heading{display:flex;align-items:center;gap:10px}.vh-heading small{font:8px/1.4 Arial,sans-serif;letter-spacing:1.5px;color:#81704f;display:block}.vh-heading strong{display:block;font-size:17px}.vh-mark{font-size:26px;color:#a28742}.vh-concert button,.vh-dialog button{border:1px solid #b9ab87;background:#f8f4e8;color:#3c3740;border-radius:6px;padding:8px 11px;font:12px/1.3 Georgia,serif;cursor:pointer;min-height:34px}.vh-concert button:hover,.vh-dialog button:hover{background:#e7dfc9}.vh-concert button:disabled,.vh-dialog button:disabled{opacity:.55;cursor:default}.vh-concert button:focus-visible,.vh-dialog button:focus-visible,.vh-dialog input:focus-visible,.vh-dialog select:focus-visible{outline:3px solid #697fc0;outline-offset:2px}.vh-heading .vh-programme-btn{margin-left:auto;font-size:11px;padding:7px 9px}.vh-now{font-size:12px;margin:15px 0 12px;color:#5a5145}.vh-actions{display:flex;gap:7px;flex-wrap:wrap}.vh-actions .vh-listen{flex:1;background:#33456b;color:#fff;border-color:#53638b}.vh-actions [data-do=stage]{font-size:11px}.vh-volume{display:flex;justify-content:space-between;align-items:center;font-size:10px;margin-top:14px;gap:12px}.vh-volume input{width:56%;accent-color:#445785}.vh-reactions{display:flex;gap:5px;flex-wrap:wrap;margin-top:15px;padding-top:12px;border-top:1px solid #d7ccb0}.vh-reactions button{font-size:11px;padding:7px}.vh-rating{border:0;border-top:1px solid #d7ccb0;padding:13px 0 0;margin:16px 0 0}.vh-rating legend{font-size:12px;padding:0 0 7px}.vh-rating legend small{font-size:9px;color:#81745c;margin-left:8px}.vh-rating>div{display:grid;grid-template-columns:repeat(8,1fr);gap:4px}.vh-rating button{padding:5px 0;min-width:0;min-height:31px}.vh-rating button[aria-pressed=true]{background:#34476d;color:white}.vh-rating-note,.vh-notice{font-size:10px;line-height:1.5;color:#766449;margin:9px 0 0}.vh-notice:empty{display:none}.vh-dialog{color:#332d28;background:#f4eedf;border:1px solid #b7a674;border-radius:15px;box-shadow:0 20px 100px #0007;padding:32px;width:min(640px,calc(100% - 28px));max-height:calc(100dvh - 48px);overflow:auto;font:14px/1.6 Georgia,serif}.vh-dialog::backdrop{background:#101828a8;backdrop-filter:blur(3px)}.vh-dialog h2{font-size:30px;font-weight:normal;line-height:1.15;margin:0 0 16px}.vh-dialog h2 em{color:#485d8c}.vh-dialog h3{font-size:17px;margin:14px 0 8px}.vh-eyebrow{color:#847042;letter-spacing:2px;font:9px Arial,sans-serif;margin:0 0 14px}.vh-dialog .vh-close{position:absolute;right:12px;top:10px;border:0;background:none;font-size:25px;padding:1px 10px}.vh-ready{width:min(455px,calc(100% - 28px))}.vh-ready-piece{font-size:16px;margin:24px 0 10px}.vh-ready-clock,.vh-ready-error,.vh-programme-note,.vh-lookup-error{font-size:12px;color:#75684e;line-height:1.7}.vh-ready-error,.vh-lookup-error{color:#923e38}.vh-ready-buttons{display:flex;gap:10px;margin-top:25px}.vh-ready-buttons button{flex:1;min-height:43px}.vh-ready-buttons button:last-child,.vh-dialog button[type=submit]{background:#354971;color:white;border-color:#354971}.vh-dialog label{display:block;font-size:12px;margin:13px 0}.vh-dialog input,.vh-dialog select{display:block;width:100%;border:1px solid #bcb193;background:#fffaf0;color:#3f3830;padding:10px;border-radius:5px;font:14px Georgia,serif;margin-top:5px}.vh-entry{display:flex;align-items:center;gap:14px;border-bottom:1px solid #d9cfb6;padding:12px 0}.vh-entry>b{color:#a18b53;font-size:20px;width:23px}.vh-entry>div{flex:1}.vh-entry span,.vh-booking span{display:block;font-size:12px;color:#796d57}.vh-entry small{font:10px Arial,sans-serif;color:#696282}.vh-recital{border:1px solid #c8ba98;border-radius:9px;padding:16px;margin:15px 0}.vh-recital h3{margin:0}.vh-recital p{font-size:12px;color:#766b55;margin:6px 0 13px}.vh-recital button{margin:0 7px 6px 0}.vh-dialog details{border-top:1px solid #cfc3a6;padding-top:14px;margin-top:19px}.vh-dialog summary{cursor:pointer;font-weight:bold}.vh-host small{display:block;font-size:10px;color:#827252;margin-top:9px}.vh-booking{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #d7ccb4;gap:15px;padding:12px 0;font-size:12px}.vh-empty{font-style:italic;color:#847655;padding:12px 0}.tw-listening{position:absolute;left:50%;bottom:calc(100% + 20px);transform:translateX(-50%);padding:4px 8px;border-radius:12px;background:#eef2ffeF;border:1px solid #98a8cf;color:#23375a;font:bold 10px Arial,sans-serif;white-space:nowrap;pointer-events:none;box-shadow:0 2px 8px #0004}.tw-concert-performer{position:absolute;pointer-events:none;transform:translate(-50%,-100%)}.tw-concert-performer>img{display:block;width:100%;height:100%;object-fit:contain;transform-origin:50% 75%;pointer-events:auto;cursor:pointer}.tw-concert-performer.is-playing>img{animation:vh-playing 1.4s ease-in-out infinite alternate}.tw-concert-performer>.tw-name{position:absolute;left:50%;top:-23px;bottom:auto;transform:translateX(-50%);white-space:nowrap;background:#1e2943d9;color:#ffe7a3;border:1px solid #bcab72;border-radius:6px;padding:3px 7px;font:bold 11px Arial,sans-serif;line-height:1.3;display:block!important;pointer-events:auto;cursor:pointer}.tw-concert-performer>.tw-name:hover{background:#2b3a5ee8;border-color:#ffd98a}.tw-concert-performer>.tw-name:focus-visible{outline:3px solid #ffd98a;outline-offset:2px}.tw-concert-reaction{position:absolute;left:50%;bottom:110%;font-size:26px;pointer-events:none;animation:vh-reaction 2.4s ease-out forwards}.concert-run-error{position:fixed;z-index:3000;left:50%;top:24px;transform:translateX(-50%);background:#382a32;color:#fff2dd;border:1px solid #b68163;border-radius:10px;padding:15px 20px;max-width:90%;font:14px Georgia,serif}.concert-run-error button{margin-left:13px;padding:7px 11px;cursor:pointer}@keyframes vh-playing{from{transform:rotate(-.4deg)}to{transform:rotate(.4deg)}}@keyframes vh-reaction{0%{opacity:0;transform:translate(-50%,12px) scale(.6)}18%{opacity:1;transform:translate(-50%,0) scale(1)}80%{opacity:1}100%{opacity:0;transform:translate(-50%,-40px) scale(1.15)}}@media(max-width:720px){.vh-concert{left:10px;top:74px;width:min(310px,calc(100% - 20px));padding:12px 14px;max-height:calc(100dvh - 200px)}.vh-heading strong{font-size:15px}.vh-now{font-size:11px;margin:10px 0}.vh-dialog{padding:25px 20px}.vh-dialog h2{font-size:27px}.vh-entry{gap:8px}.vh-ready-buttons button{font-size:12px}.vh-concert .vh-mark{font-size:22px}}@media(prefers-reduced-motion:reduce){.tw-concert-performer.is-playing>img,.tw-concert-reaction{animation:none}.tw-concert-reaction{opacity:1}}

.vh-concert .vh-listen:hover,.vh-ready-buttons button:last-child:hover,.vh-dialog button[type=submit]:hover{background:#435b88;color:#fff}.tw-hslabel[hidden]{display:none!important}

/* ---- the hall card folds to an edge TAB on the LEFT (js/concert-hall.mjs,
   js/fold.js "concert-card"; Lionel, 2026-09-11: hidable like the map, the
   profile and the tournament blocks). The rail tabs' shape mirrored, rounded
   on the right and flush with the screen edge, in the card's own parchment.
   Folded, the whole tab is the handle; a red dot on the ✦ while a pianist plays. */
.vh-concert .vh-fold{flex:none;min-height:0;padding:4px 6px;border:0;background:none;color:#81704f;font:13px/1 Arial,sans-serif}
.vh-concert .vh-fold:hover{background:none;color:#332d28}
.vh-fold::before{content:"\25C2"}
.vh-concert.shut{left:0;width:auto;min-width:0;max-height:none;padding:8px 8px 8px 12px;border-left:0;border-radius:0 12px 12px 0;overflow:visible;cursor:pointer;box-shadow:4px 2px 12px #10132466}
.vh-concert.shut>:not(.vh-heading){display:none!important}
.vh-concert.shut .vh-heading{gap:4px}
.vh-concert.shut .vh-heading>div,.vh-concert.shut .vh-programme-btn{display:none}
.vh-concert.shut .vh-mark{font-size:22px;position:relative}
.vh-concert.shut .vh-fold::before{content:"\25B8"}
.vh-concert.shut:hover{filter:brightness(1.04)}
.vh-concert.shut.vh-live .vh-mark::after{content:"";position:absolute;right:-4px;top:2px;width:8px;height:8px;border-radius:50%;background:#d9483b;box-shadow:0 0 0 2px #f3eddc;animation:vh-dot 1.2s infinite}
@keyframes vh-dot{50%{opacity:.35}}

/* ---- the open concert grand (js/concert-hall.mjs, 2026-09-11): the Play now
   dialog and the pianist's panel, five minutes at the grand in the card's parchment. */
.vh-piano{width:min(470px,calc(100% - 28px))}
.vh-piano-lede{font-size:14px;margin:0}
.vh-piano-state{font-size:13px;color:#5b4e37;background:#ebe2cb;border-radius:8px;padding:10px 12px;margin:16px 0 0}
.vh-concert .vh-grand-btn{flex:1}
.vh-play[hidden]{display:none!important}
.vh-play{position:absolute;z-index:27;left:50%;bottom:18px;transform:translateX(-50%);width:min(640px,calc(100% - 24px));padding:12px 14px;border:1px solid #c9b984;border-radius:14px;background:#f3eddcfa;color:#332d28;box-shadow:0 10px 36px #10132466;font:13px/1.4 Georgia,serif}
.vh-play-head{display:flex;align-items:center;gap:12px}
.vh-play-head>div{flex:1;min-width:0}
.vh-play-head small{display:block;font:9px/1.4 Arial,sans-serif;letter-spacing:1.6px;color:#81704f}
.vh-play-note{font-size:12px;color:#5a5145}
.vh-play-clock{font:600 26px/1 Georgia,serif;font-variant-numeric:tabular-nums;color:#33456b;min-width:74px;text-align:right}
.vh-play.low .vh-play-clock{color:#b3392f}
.vh-play button{border:1px solid #b9ab87;background:#f8f4e8;color:#3c3740;border-radius:6px;padding:7px 11px;font:12px/1.2 Georgia,serif;cursor:pointer;min-height:34px}
.vh-play button:hover{background:#e7dfc9}
.vh-play button:disabled{opacity:.5;cursor:default}
.vh-play button:focus-visible{outline:3px solid #697fc0;outline-offset:2px}
.vh-play [data-play=stop]{background:#354971;color:#fff;border-color:#354971}
.vh-play [data-play=stop]:hover{background:#435b88}
.vh-play [data-play=pedal][aria-pressed=true]{background:#34476d;color:#fff}
.vh-play-keys{position:relative;display:flex;height:104px;margin:10px 0 8px;user-select:none;-webkit-user-select:none;touch-action:none}
.vh-play .vh-key{flex:1;min-width:0;min-height:0;padding:0;border:1px solid #9d917a;border-radius:0 0 5px 5px;background:linear-gradient(#fffdf6,#efe8d6);box-shadow:inset 0 -4px 0 #d9d0bb}
.vh-play .vh-key:hover{background:linear-gradient(#fffdf6,#efe8d6)}
.vh-play .vh-key.on{background:linear-gradient(#e7ecff,#c3cef2);box-shadow:inset 0 -1px 0 #9fb0dc}
.vh-play .vh-key-black{position:absolute;top:0;width:4.6%;height:62%;transform:translateX(-50%);z-index:1;border-color:#1b1a1f;background:linear-gradient(#3a3940,#15141a);box-shadow:inset 0 -4px 0 #000}
.vh-play .vh-key-black:hover{background:linear-gradient(#3a3940,#15141a)}
.vh-play .vh-key-black.on{background:linear-gradient(#52679a,#33456b)}
.vh-play-foot{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.vh-play-oct{font:bold 11px Arial,sans-serif;color:#5a5145;min-width:26px;text-align:center}
.vh-play-input{flex:1;min-width:0;font-size:11px;color:#766449;text-align:right}
@media(max-width:720px){.vh-play{bottom:8px;padding:9px 10px}.vh-play-clock{font-size:21px;min-width:58px}.vh-play-note{display:none}.vh-play-keys{height:88px}.vh-play-input{display:none}}
@media(pointer:coarse){.vh-play-input{display:none}}

/* 🎤 MIC MODE AT THE OPEN GRAND (2026-09-13). The dialog asks HOW the hall
   will hear this turn before it asks for the seat, because the two sound
   paths are not interchangeable for the audience: the note relay reaches
   everyone standing in the Rotunda, guests included, and a microphone
   broadcast reaches only the signed-in. Radios rather than a segment: this
   is a choice with consequences worth reading, not a pill to flick. */
.vh-piano-mode{border:1px solid #cabb96;border-radius:9px;padding:12px 14px 6px;margin:18px 0 0}
.vh-piano-mode[hidden]{display:none}
.vh-piano-mode legend{font:9px Arial,sans-serif;letter-spacing:1.6px;color:#847042;padding:0 6px}
.vh-piano-mode label{display:flex;align-items:flex-start;gap:9px;margin:0 0 10px;cursor:pointer}
.vh-piano-mode input{width:auto;display:inline;margin:3px 0 0;flex:none;accent-color:#354971}
.vh-piano-mode b{display:block;font-size:13px;font-weight:normal}
.vh-piano-mode small{display:block;font-size:11px;line-height:1.5;color:#7a6d55;margin-top:2px}
.vh-piano-mode label:has(input:disabled){opacity:.5;cursor:default}
/* which input goes on air: the picker belongs to the 🎤 answer, indented under
   it so it reads as part of that choice rather than a third option. */
.vh-mic-dev{margin:-4px 0 10px 27px}
.vh-mic-dev[hidden]{display:none}
.vh-mic-dev label{display:block;margin:0;font:9px Arial,sans-serif;letter-spacing:1.4px;text-transform:uppercase;color:#847042;cursor:default}
.vh-mic-dev select,.vh-play-mic select{display:block;width:100%;margin-top:4px;padding:5px 7px;border:1px solid #cabb96;border-radius:6px;background:#fffdf6;font-size:12px;color:#3b3423}
.vh-mic-dev small{display:block;font-size:11px;line-height:1.5;color:#7a6d55;margin-top:5px}
.vh-play-voice{display:flex;align-items:center;gap:10px;margin:8px 0 0;padding:7px 9px;border:1px solid #cfc2a0;border-radius:8px;background:#fbf7ea;font-size:12px;color:#4d4638}
.vh-play-voice[hidden]{display:none}
.vh-play-voice.off{border-color:#d8b9a6;background:#fbefe6;color:#7b4a32}
.vh-play-voice-line{flex:1;min-width:0}
.vh-play-voice button{flex:0 0 auto;min-height:30px;padding:5px 9px;font-size:11px}
.vh-play-voice button[aria-pressed=true]{background:#e4efe0;border-color:#93ad8c}
.vh-play-voice button[hidden]{display:none}
@media(max-width:720px){.vh-play-voice{margin-top:6px;padding:6px 8px;font-size:11px}}
.vh-play-mic{padding:0 14px 12px}
.vh-play-mic[hidden]{display:none}
.vh-play-mic label{display:block;font:9px Arial,sans-serif;letter-spacing:1.4px;text-transform:uppercase;color:#9a8c6d}
.vh-play-mic select{background:#1b1206;border-color:#7a5c4e;color:#f0e2cc;max-width:420px}
/* on air, the panel is a clock and a way down: the on-screen keys and the
   octave controls belong to a turn the GAME is sounding, and this one is a
   real instrument going out through a microphone. */
.vh-play.mic .vh-play-keys,.vh-play.mic .vh-play-foot{display:none}
.vh-play.mic .vh-play-kicker{color:#9d3226;font-weight:bold}
.vh-play.mic{border-color:#c08a7e}

/* 📜 A PHONE CAN ALWAYS GET OUT (2026-09-29). Found while looking into
   Patricia's report from the Rotunda (what held her was her walking piano:
   js/town.js groundAt), and a trap of its own. With the weekly
   bookings open the programme is 1,251 px on a 670 px screen; the × was
   position:absolute inside the dialog's own scroll, so the first swipe took
   it off the top and nothing else closed the card. Now the × is pinned: sticky
   at the top of the scroll, on a disc of its own so the list can pass under
   it. margin:auto undoes style.css's `* { margin: 0 }`, which had jammed every
   hall dialog into the top-left corner (.pf-dialog already sets it). A tap
   outside the card closes it too (js/concert-hall.mjs).
   Chrome measures a sticky `top` from INSIDE the scroller's padding, so both
   `top` and the negative margins are 10px minus the dialog's padding (32px,
   or 25px 20px on a phone): the × sits 10px from the card's corner. And
   right:auto drops the old absolute rule's right:12px, which a sticky box
   reads as a constraint (it dragged the × 22px to the left). */
.vh-dialog{margin:auto;overscroll-behavior:contain}
.vh-dialog .vh-close{position:sticky;top:-22px;right:auto;float:right;z-index:2;width:40px;height:40px;min-height:0;margin:-22px -22px 0 12px;padding:0;border:1px solid #cdbf98;border-radius:50%;background:#f4eedf;color:#3c3740;font:22px/1 Arial,sans-serif;box-shadow:0 2px 8px #33241433}
@media(max-width:720px){.vh-dialog .vh-close{top:-15px;width:44px;height:44px;margin:-15px -10px 0 10px}}