/* Standard screen header (Gary, Oct 25 header audit). One header for every full screen that has a <:
   - a plain < (no circle) on the left and the black X on the right, each the same distance from the top of the screen as
     from its side (--ya-head-inset);
   - the title on the left beside the <, one size everywhere.
   index.html marks these headers .ya-std-head and measures how far the header sits from the screen's edges (--ya-el,
   --ya-er, --ya-et) so the < and X land on the screen's edges whatever padding the screen has. Loaded last on purpose: it is
   the single owner of this header's geometry. Pop-up cards (X only) and confirmations keep their own styles. */
:root{--ya-head-inset:14px;--ya-head-x:30px;--ya-head-back:30px;--ya-head-title:20px;--ya-head-color:#14325a}
html body #overlayRoot .sheet>.sheet-head.ya-std-head:not(#_):not(#__):not(#___){
 --ya-head-top:calc(env(safe-area-inset-top,0px) + var(--ya-head-inset) - var(--ya-et,0px));
 position:relative!important;display:flex!important;align-items:flex-start!important;flex-wrap:nowrap!important;gap:8px!important;
 grid-template-columns:none!important;min-height:calc(var(--ya-head-x) + 6px)!important;box-sizing:border-box!important;overflow:visible!important;
 padding-top:max(0px,var(--ya-head-top))!important;padding-bottom:6px!important;
 padding-left:calc(var(--ya-head-inset) - var(--ya-el,0px) + var(--ya-head-back) + 6px)!important;
 padding-right:calc(var(--ya-head-inset) - var(--ya-er,0px) + var(--ya-head-x) + 8px)!important}
html body #overlayRoot .sheet>.sheet-head.ya-std-head:not(#_):not(#__):not(#___)>h2{
 flex:1 1 auto!important;min-width:0!important;margin:0!important;padding:0!important;grid-column:auto!important;justify-self:auto!important;
 font:800 var(--ya-head-title)/var(--ya-head-x) var(--mc-font,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif)!important;
 color:var(--ya-head-color)!important;text-align:left!important;letter-spacing:-.01em!important;
 white-space:normal!important;overflow:hidden!important;text-overflow:ellipsis!important;display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:2!important}
/* The < : whichever control goes back on this screen */
html body #overlayRoot .sheet>.sheet-head.ya-std-head:not(#_):not(#__):not(#___)>:is(.settings-back,.ya-settings-back,.ya-group-home-back,#groupPanelBack,.close:not(.ya-more-x)){
 position:absolute!important;left:calc(var(--ya-head-inset) - var(--ya-el,0px))!important;right:auto!important;top:max(0px,var(--ya-head-top))!important;transform:none!important;
 width:var(--ya-head-back)!important;height:var(--ya-head-back)!important;min-width:0!important;min-height:0!important;margin:0!important;padding:0!important;
 border:0!important;border-radius:0!important;box-shadow:none!important;outline-offset:2px;
 background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2314325a' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 5l-7 7 7 7'/%3E%3C/svg%3E") left center/24px 24px no-repeat!important;
 font-size:0!important;color:transparent!important;display:block!important;z-index:3!important}
html body #overlayRoot .sheet>.sheet-head.ya-std-head:not(#_):not(#__):not(#___)>:is(.settings-back,.ya-settings-back,.ya-group-home-back,#groupPanelBack,.close:not(.ya-more-x))>*{display:none!important}
html body #overlayRoot .sheet>.sheet-head.ya-std-head:not(#_):not(#__):not(#___)>:is(.settings-back,.ya-settings-back,.ya-group-home-back,#groupPanelBack).hidden{display:none!important}
html body #overlayRoot .sheet>.sheet-head.ya-std-head:not(#_):not(#__):not(#___)>#groupPanelBack:not(.hidden)~:is(.ya-group-home-back,#group-close){display:none!important}
/* The X */
html body #overlayRoot .sheet>.sheet-head.ya-std-head:not(#_):not(#__):not(#___)>.ya-more-x{
 position:absolute!important;right:calc(var(--ya-head-inset) - var(--ya-er,0px))!important;left:auto!important;top:max(0px,var(--ya-head-top))!important;transform:none!important;
 width:var(--ya-head-x)!important;height:var(--ya-head-x)!important;min-width:0!important;min-height:0!important;margin:0!important;padding:0!important;border:0!important;
 border-radius:50%!important;background:transparent!important;box-shadow:none!important;display:block!important;z-index:3!important}
html body #overlayRoot .sheet>.sheet-head.ya-std-head:not(#_):not(#__):not(#___)>.ya-more-x .close-icon{width:var(--ya-head-x)!important;height:var(--ya-head-x)!important;display:block!important;opacity:1!important}
/* Anything else in the header (Save, Saved, Preview) sits just left of the X, lined up with it */
html body #overlayRoot .sheet>.sheet-head.ya-std-head:not(#_):not(#__):not(#___)>:not(h2):not(.ya-more-x):not(.ya-home):not(.ya-head-help):not(.settings-back):not(.ya-settings-back):not(.ya-group-home-back):not(#groupPanelBack):not(.close):not(.hidden){
 position:static!important;transform:none!important;flex:none!important;align-self:flex-start!important;margin:0!important;right:auto!important;top:auto!important;min-height:var(--ya-head-x)!important}
/* Members > Invite page (inside Members, not a pop-up screen): same < and title, measured from the page's own top and left */
html body :is(#membersView,#overlayRoot .sheet.members-sheet):not(#_):not(#__):not(#___) .ya-invite-head{display:flex!important;align-items:flex-start!important;grid-template-columns:none!important;min-height:calc(var(--ya-head-x) + 2 * var(--ya-head-inset))!important;padding:var(--ya-head-inset) var(--ya-head-inset) 6px calc(2 * var(--ya-head-inset) + var(--ya-head-back) - 8px)!important;box-sizing:border-box!important}
html body :is(#membersView,#overlayRoot .sheet.members-sheet):not(#_):not(#__):not(#___) .ya-invite-head h2{flex:1 1 auto!important;text-align:left!important;margin:0!important;grid-column:auto!important;font:800 var(--ya-head-title)/var(--ya-head-x) var(--mc-font,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif)!important;color:var(--ya-head-color)!important}
html body :is(#membersView,#overlayRoot .sheet.members-sheet):not(#_):not(#__):not(#___) .ya-invite-back{position:absolute!important;left:var(--ya-head-inset)!important;top:var(--ya-head-inset)!important;width:var(--ya-head-back)!important;height:var(--ya-head-back)!important;min-width:0!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;
 background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2314325a' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 5l-7 7 7 7'/%3E%3C/svg%3E") left center/24px 24px no-repeat!important;font-size:0!important;color:transparent!important}
html body :is(#membersView,#overlayRoot .sheet.members-sheet):not(#_):not(#__):not(#___) .ya-invite-back>*,html body :is(#membersView,#overlayRoot .sheet.members-sheet):not(#_):not(#__):not(#___) .ya-invite-back::before,html body :is(#membersView,#overlayRoot .sheet.members-sheet):not(#_):not(#__):not(#___) .ya-invite-back::after{display:none!important;content:none!important}
/* Every X is a black circle with a white X (Gary, Oct 25): Share, and the unsaved-changes question */
html body #overlayRoot .sheet.quick-share-sheet:not(#_):not(#__):not(#___)>.sheet-head>.close{width:var(--ya-head-x)!important;height:var(--ya-head-x)!important;min-width:0!important;min-height:0!important;padding:0!important;border:0!important;border-radius:50%!important;background:transparent!important;box-shadow:none!important;font-size:0!important;color:transparent!important}
html body #overlayRoot .sheet.quick-share-sheet:not(#_):not(#__):not(#___)>.sheet-head>.close img{display:block!important;width:var(--ya-head-x)!important;height:var(--ya-head-x)!important;opacity:1!important}
html body #overlayRoot .sheet.quick-share-sheet:not(#_):not(#__):not(#___)>.sheet-head>.close::before,html body #overlayRoot .sheet.quick-share-sheet:not(#_):not(#__):not(#___)>.sheet-head>.close::after{display:none!important;content:none!important}
html body .unsaved-backdrop .unsaved-card:not(#_):not(#__):not(#___) .unsaved-close{top:14px!important;right:14px!important;width:var(--ya-head-x)!important;height:var(--ya-head-x)!important;min-width:0!important;min-height:0!important;padding:0!important;border:0!important;border-radius:50%!important;font-size:0!important;color:transparent!important;box-shadow:none!important;background:transparent url(/icons/close-dismiss.png) center/100% 100% no-repeat!important}
html body .unsaved-backdrop .unsaved-card:not(#_):not(#__):not(#___) .unsaved-close::before,html body .unsaved-backdrop .unsaved-card:not(#_):not(#__):not(#___) .unsaved-close::after{display:none!important;content:none!important}
/* Full-screen Set List Preview: only the X shows (it leaves full screen) */
html body #overlayRoot .sheet.setlist-preview-full>.sheet-head.ya-std-head:not(#_):not(#__):not(#___)>:is(.settings-back,h2,#ya-none){display:none!important}
/* X stepping back through set list screens (Gary, Oct 25, BETA-7.9): screens passed on the way are not shown */
html body #overlayRoot.ya-flow-closing .sheet{visibility:hidden!important}
/* « back further (Gary, Oct 29, BETA-7.34; was the Main house, BETA-7.13): on screens two or more levels deep a « sits in
   the corner where the < was, and the < moves one place right. It steps back to the screen the flow started from, asking
   Save? on the way. The right side has ? (Help for this screen) just left of the X; Save / Saved stays under the X. */
html body #overlayRoot .sheet>.sheet-head.ya-std-head:not(#_):not(#__):not(#___)>.ya-home{
 position:absolute!important;left:calc(var(--ya-head-inset) - var(--ya-el,0px))!important;right:auto!important;top:max(0px,var(--ya-head-top))!important;transform:none!important;
 width:var(--ya-head-back)!important;height:var(--ya-head-back)!important;min-width:0!important;min-height:0!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;
 display:grid!important;place-items:center start!important;color:var(--ya-head-color)!important;z-index:3!important;cursor:pointer;-webkit-tap-highlight-color:transparent}
html body #overlayRoot .sheet>.sheet-head.ya-std-head:not(#_):not(#__):not(#___)>.ya-home svg{display:block!important;width:24px!important;height:24px!important}
html body #overlayRoot .sheet>.sheet-head.ya-std-head.has-home:not(#_):not(#__):not(#___)>:is(.settings-back,.ya-settings-back,.ya-group-home-back,#groupPanelBack,.close:not(.ya-more-x)){left:calc(var(--ya-head-inset) - var(--ya-el,0px) + var(--ya-head-back) + 6px)!important}
html body #overlayRoot .sheet>.sheet-head.ya-std-head.has-home:not(#_):not(#__):not(#___){padding-left:calc(var(--ya-head-inset) - var(--ya-el,0px) + 2 * var(--ya-head-back) + 12px)!important}
html body #overlayRoot .sheet>.sheet-head.ya-std-head:not(#_):not(#__):not(#___):not(#____)>.ya-head-help{
 position:absolute!important;right:calc(var(--ya-head-inset) - var(--ya-er,0px) + var(--ya-head-x) + 10px)!important;left:auto!important;top:var(--ya-help-t,max(0px,var(--ya-head-top)))!important;transform:none!important;
 width:var(--ya-head-x)!important;height:var(--ya-head-x)!important;min-width:0!important;min-height:0!important;margin:0!important;padding:0!important;box-sizing:border-box!important;
 border:2px solid var(--ya-head-color)!important;border-radius:50%!important;background:#fff!important;box-shadow:none!important;color:var(--ya-head-color)!important;
 display:grid!important;place-items:center!important;font:800 17px/1 var(--mc-font,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif)!important;z-index:3!important;cursor:pointer;-webkit-tap-highlight-color:transparent}
html body #overlayRoot .sheet>.sheet-head.ya-std-head:not(#_):not(#__):not(#___):not(#____)>.ya-head-help:active{background:#e3e9f3!important}
html body #overlayRoot .sheet>.sheet-head.ya-std-head.has-help:not(#_):not(#__):not(#___){padding-right:calc(var(--ya-head-inset) - var(--ya-er,0px) + 2 * var(--ya-head-x) + 16px)!important}
/* The full-screen Preview keeps only its X (no Main button) */
html body #overlayRoot .sheet.setlist-preview-full>.sheet-head:not(#_):not(#__):not(#___):not(#____)>.ya-head-help.ya-head-help,html body #overlayRoot .setlist-preview-full .sheet-head:not(#_):not(#__):not(#___):not(#____)>.ya-head-help.ya-head-help{display:none!important}/* nor a ? (it becomes full screen after the header is set up) */
html body #overlayRoot .setlist-preview-full .sheet>.sheet-head.ya-std-head:not(#_):not(#__):not(#___)>.ya-home.ya-home,html body #overlayRoot .sheet.setlist-preview-full>.sheet-head.ya-std-head:not(#_):not(#__):not(#___)>.ya-home.ya-home,html body #overlayRoot .setlist-preview-full .sheet-head:not(#_):not(#__):not(#___)>.ya-home.ya-home.ya-home{display:none!important}
/* Main (house) button: a plain cover hides the screens it steps back through (BETA-7.14); dialogs stay above it */
#yaHomeCover{position:fixed;inset:0;z-index:13000;background:#f2f2f7;display:grid;place-items:center;pointer-events:none}
#yaHomeCover .ya-busy-spin{width:26px;height:26px;border-radius:50%;border:3px solid #d6e2f3;border-top-color:#2f6fd6;animation:ya-busy-turn .8s linear infinite}
/* Gary, Oct 27 (BETA-7.19): the still copy of the last screen shown while the app starts */
#app.ya-warm-start.screen{position:fixed!important;inset:0!important;z-index:9000!important;background:#f2f2f7;overflow:hidden!important;pointer-events:auto}
/* the still copy uses the same full-screen layout as the app (body.ya-app-scroll-lock) */
html.ya-warm-lock #app.ya-warm-start{position:fixed;inset:0;height:100dvh!important;max-height:100dvh!important;display:flex;flex-direction:column;overflow:hidden!important;padding:env(safe-area-inset-top) env(safe-area-inset-right) 0 env(safe-area-inset-left)!important}
html.ya-warm-lock #app.ya-warm-start>.topbar{position:relative!important;flex:0 0 var(--ya-app-header-height);width:100%;left:auto!important;right:auto!important;top:auto!important}
html.ya-warm-lock #app.ya-warm-start.ya-update-available>.topbar{margin-bottom:var(--ya-update-banner-height)}
html.ya-warm-lock #app.ya-warm-start #classicFilters{position:relative;flex:none}
html.ya-warm-lock #app.ya-warm-start>.main{flex:1;min-height:0;height:auto!important;max-height:none!important;overflow:hidden!important;display:flex;flex-direction:column}
html.ya-warm-lock #app.ya-warm-start #tableView:not(.hidden){flex:1;min-height:0;display:flex;flex-direction:column}
html.ya-warm-lock #app.ya-warm-start .table-wrap{flex:1;min-height:0;height:auto!important;max-height:none!important;overflow-y:auto!important;overscroll-behavior-y:contain!important}
html.ya-warm-lock #app.ya-warm-start #calendarView:not(.hidden){flex:1;min-height:0;overflow-y:auto!important;overscroll-behavior-y:contain!important}
html.ya-warm-lock #app.ya-warm-start>#utilityBar,html.ya-warm-lock #app.ya-warm-start>.bottomnav{position:relative!important;inset:auto!important;flex:none;width:100%}
/* Save / Saved / Saving… sit under the X on every screen, so the title has room (Gary, Oct 28, BETA-7.25; first on Edit
   Layout in BETA-7.24): the Set List Editor's Save/Saved, Edit Layout's Saved, and the Saving… shown while a screen saves. */
html body #overlayRoot .sheet>.sheet-head.ya-std-head:not(#_):not(#__):not(#___)>:is(.mc-editor-top-save,.save-status,.ge-saved):not(#____):not(#_____){
 position:absolute!important;left:auto!important;right:calc(var(--ya-head-inset) - var(--ya-er,0px) - 10px)!important;top:calc(max(0px,var(--ya-head-top)) + var(--ya-head-x) + 3px)!important;
 transform:none!important;width:calc(var(--ya-head-x) + 20px)!important;height:auto!important;min-height:0!important;margin:0!important;padding:2px 0!important;
 border:0!important;background:transparent!important;box-shadow:none!important;display:block!important;text-align:center!important;white-space:nowrap!important;
 font:600 13px/1.15 var(--mc-font,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif)!important;z-index:3!important}
/* An unsaved Save under the X reads as a button: a small standard-blue pill */
html body #overlayRoot .sheet>.sheet-head.ya-std-head:not(#_):not(#__):not(#___)>.mc-editor-top-save.is-dirty:not(#____):not(#_____){padding:4px 0!important;border-radius:8px!important;background:var(--mc-blue,#3877c8)!important;color:#fff!important}
