/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-7swnrhyxj8] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-7swnrhyxj8] {
    flex: 1;
}

.sidebar[b-7swnrhyxj8] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-7swnrhyxj8] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-7swnrhyxj8]  a, .top-row[b-7swnrhyxj8]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-7swnrhyxj8]  a:hover, .top-row[b-7swnrhyxj8]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-7swnrhyxj8]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-7swnrhyxj8] {
        justify-content: space-between;
    }

    .top-row[b-7swnrhyxj8]  a, .top-row[b-7swnrhyxj8]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-7swnrhyxj8] {
        flex-direction: row;
    }

    .sidebar[b-7swnrhyxj8] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-7swnrhyxj8] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-7swnrhyxj8]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-7swnrhyxj8], article[b-7swnrhyxj8] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-1yxz5ujbgy] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-1yxz5ujbgy] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-1yxz5ujbgy] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-1yxz5ujbgy] {
    font-size: 1.1rem;
}

.bi[b-1yxz5ujbgy] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-1yxz5ujbgy] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-person-fill-nav-menu[b-1yxz5ujbgy] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-fill' viewBox='0 0 16 16'%3E%3Cpath d='M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-1yxz5ujbgy] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-1yxz5ujbgy] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-1yxz5ujbgy] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-1yxz5ujbgy] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-1yxz5ujbgy] {
        padding-bottom: 1rem;
    }

    .nav-item[b-1yxz5ujbgy]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
    }

.nav-item[b-1yxz5ujbgy]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-1yxz5ujbgy]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable[b-1yxz5ujbgy] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-1yxz5ujbgy] {
    display: block;
}

@media (min-width: 641px) {
    .navbar-toggler[b-1yxz5ujbgy] {
        display: none;
    }

    .nav-scrollable[b-1yxz5ujbgy] {
        /* Never collapse the sidebar for wide screens */
        display: block;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}
/* /Components/Layout/ProblemReporter.razor.rz.scp.css */
/* The widget sits in the corner and stays out of the way: a pill until it is wanted, a
   card the width of a phone once it is. Above the content, below the reconnect modal
   (which is a <dialog> in the top layer) and beside the error bar, which is bottom-anchored
   and full-width — so the pill lifts when that bar shows, rather than hiding behind it. */
.problem-reporter[b-ttjn200i6t] {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    z-index: 1030;
    font-size: 0.9rem;
    max-width: calc(100vw - 2rem);
}

.pill[b-ttjn200i6t] {
    border: 1px solid #d6d5d5;
    border-radius: 999px;
    background: #fff;
    color: #3a0647;
    padding: 0.35rem 0.9rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    opacity: 0.85;
    cursor: pointer;
}

    .pill:hover[b-ttjn200i6t], .pill:focus-visible[b-ttjn200i6t] {
        opacity: 1;
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
    }

.panel[b-ttjn200i6t] {
    width: 22rem;
    max-width: 100%;
    background: #fff;
    border: 1px solid #d6d5d5;
    border-radius: 0.5rem;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
    overflow: hidden;
}

    .panel header[b-ttjn200i6t] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0.6rem 0.9rem;
        background: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 100%);
        color: #fff;
    }

    .panel header .btn-close[b-ttjn200i6t] {
        filter: invert(1);
        opacity: 0.85;
    }

.body[b-ttjn200i6t] {
    padding: 0.8rem 0.9rem;
    max-height: calc(100vh - 6rem);
    overflow-y: auto;
}

/* Capped and scrolling on its own, so opening "What goes with it" never pushes the Send
   button off the bottom of a phone. */
.facts[b-ttjn200i6t] {
    display: grid;
    grid-template-columns: max-content 1fr;
    column-gap: 0.6rem;
    row-gap: 0.1rem;
    max-height: 9rem;
    overflow-y: auto;
}

    .facts dt[b-ttjn200i6t] {
        font-weight: 500;
    }

    .facts dd[b-ttjn200i6t] {
        margin: 0;
        overflow-wrap: anywhere;
    }

@media (max-width: 640.98px) {
    .problem-reporter[b-ttjn200i6t] {
        right: 0.5rem;
        bottom: 0.5rem;
    }

    .panel[b-ttjn200i6t] {
        width: calc(100vw - 1rem);
    }
}

@media print {
    .problem-reporter[b-ttjn200i6t] {
        display: none;
    }
}

.screenshot .preview[b-ttjn200i6t] {
    display: block;
    max-width: 100%;
    max-height: 8rem;
    border: 1px solid #d6d5d5;
    border-radius: 0.25rem;
}

/* While the module grabs a frame of the tab, the widget is not in the picture. */
.problem-reporter.capturing[b-ttjn200i6t] {
    visibility: hidden;
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-i1jxdrcrbh],
.components-reconnect-repeated-attempt-visible[b-i1jxdrcrbh],
.components-reconnect-failed-visible[b-i1jxdrcrbh],
.components-pause-visible[b-i1jxdrcrbh],
.components-resume-failed-visible[b-i1jxdrcrbh],
.components-rejoining-animation[b-i1jxdrcrbh] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-i1jxdrcrbh],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-i1jxdrcrbh],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-i1jxdrcrbh],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-i1jxdrcrbh],
#components-reconnect-modal.components-reconnect-retrying[b-i1jxdrcrbh],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-i1jxdrcrbh],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-i1jxdrcrbh],
#components-reconnect-modal.components-reconnect-failed[b-i1jxdrcrbh],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-i1jxdrcrbh] {
    display: block;
}


#components-reconnect-modal[b-i1jxdrcrbh] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-i1jxdrcrbh 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-i1jxdrcrbh 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-i1jxdrcrbh 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-i1jxdrcrbh]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-i1jxdrcrbh 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-i1jxdrcrbh {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-i1jxdrcrbh {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-i1jxdrcrbh {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-i1jxdrcrbh] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-i1jxdrcrbh] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-i1jxdrcrbh] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-i1jxdrcrbh] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-i1jxdrcrbh] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-i1jxdrcrbh] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-i1jxdrcrbh] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-i1jxdrcrbh 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-i1jxdrcrbh] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-i1jxdrcrbh {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/Bands/RenumberSongs.razor.rz.scp.css */
/* Save and "Back to the top" jump to the first element on the page. The layout's top row
   is sticky and would cover a target scrolled flush to the viewport, so the margin is made
   larger than anything above the element: the browser cannot scroll past zero, and the jump
   lands at the very top with the heading and the summary in full view. */
#renumber-top[b-lwx7hyj5jz] {
    scroll-margin-top: 100vh;
}

/* A blank is dashed and a pixel heavier than a song row's border; the padding gives that
   pixel back so the number and the label line up with the songs' (px-3 is 1rem). */
.renumber-blank[b-lwx7hyj5jz] {
    border-style: dashed !important;
    padding-left: calc(1rem - 1px);
    padding-right: calc(1rem - 1px);
}
/* /Components/Pages/SetLists/PrintLayout.razor.rz.scp.css */
/* A page of paper on screen, and the paper itself when printed. */

.print-page[b-skl16ge1ri] {
    max-width: 46rem;
    margin: 0 auto;
    padding: 2rem 1.25rem 4rem;
}

@media print {
    /* The browser supplies the margin at print time, so the screen padding that made the
       document readable in a window would otherwise be added to it. */
    .print-page[b-skl16ge1ri] {
        max-width: none;
        margin: 0;
        padding: 0;
    }
}
/* /Components/Pages/SetLists/SetListPrint.razor.rz.scp.css */
/*
    The whole visual design of the printable set list, in one place, because there is only one
    page that looks like this and it is not part of the application chrome.
*/

.chooser[b-183rptruz7] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.5rem;
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid #ddd;
}

.chooser label[b-183rptruz7] {
    font-weight: 600;
}

.chooser a[b-183rptruz7] {
    margin-left: auto;
}

.setlist header[b-183rptruz7] {
    margin-bottom: 1.5rem;
}

.setlist .band[b-183rptruz7] {
    margin-bottom: 0;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-size: 0.8rem;
}

.setlist h1[b-183rptruz7] {
    margin: 0.1rem 0;
}

.setlist .date[b-183rptruz7],
.setlist .for[b-183rptruz7] {
    margin: 0;
    color: #555;
}

.setlist .songs[b-183rptruz7] {
    padding-left: 1.6rem;
}

.setlist .songs > li[b-183rptruz7] {
    /* The whole entry moves to the next sheet together, so a song never ends up on one page
       with its chart line on the next. */
    break-inside: avoid;
    margin-bottom: 0.9rem;
}

.setlist .song[b-183rptruz7] {
    margin: 0;
}

.setlist .title[b-183rptruz7] {
    font-weight: 600;
}

.setlist .artist[b-183rptruz7]::before {
    content: " — ";
}

.setlist .artist[b-183rptruz7] {
    color: #555;
}

.setlist .notes[b-183rptruz7],
.setlist .addendum[b-183rptruz7],
.setlist .chart[b-183rptruz7] {
    margin: 0.1rem 0 0;
    font-size: 0.92rem;
}

.setlist .notes[b-183rptruz7],
.setlist .addendum[b-183rptruz7] {
    color: #555;
}

.setlist .served[b-183rptruz7] {
    color: #555;
}

.setlist .served[b-183rptruz7]::before {
    content: " · ";
}

/* The one annotation that changes what a player is holding, so it is the one that is loud
   enough to notice at a music stand. */
.setlist .fallback[b-183rptruz7] {
    color: #8a4b00;
    font-weight: 600;
}

.setlist .none[b-183rptruz7] {
    font-style: italic;
}

.setlist .empty[b-183rptruz7] {
    color: #555;
}

@media print {
    /* The chooser is how you asked for this document; it is not part of it. */
    .chooser[b-183rptruz7] {
        display: none;
    }

    .setlist a[b-183rptruz7] {
        /* A printed link is text. The URL is no use on paper and the colour costs ink. */
        color: inherit;
        text-decoration: none;
    }

    .setlist .served[b-183rptruz7]::before {
        content: " — ";
    }
}
/* /Components/Pages/Songs/VersionsSection.razor.rz.scp.css */
/* A tag chip's × appears on hover (and on keyboard focus, so it is reachable without a
   mouse); the chip keeps its width either way so the row does not jitter. */
.tag-chip[b-8h17h3fss7] {
    position: relative;
    padding-right: 1.1rem;
}

.tag-remove[b-8h17h3fss7] {
    position: absolute;
    right: 0.15rem;
    top: 50%;
    transform: translateY(-50%);
    border: 0;
    padding: 0 0.15rem;
    line-height: 1;
    font-weight: 700;
    color: #fff;
    background: #dc3545;
    border-radius: 999px;
    opacity: 0;
    transition: opacity 0.1s ease-in;
}

.tag-chip:hover .tag-remove[b-8h17h3fss7],
.tag-chip:focus-within .tag-remove[b-8h17h3fss7] {
    opacity: 1;
}

.tag-add[b-8h17h3fss7] {
    line-height: 1;
    padding: 0 0.4rem;
    border-radius: 999px;
    font-weight: 700;
}

/* Invisible, over the whole page, under the list: the click-away that closes it. */
.tag-menu-backdrop[b-8h17h3fss7] {
    position: fixed;
    inset: 0;
    z-index: 999;
}

.tag-menu[b-8h17h3fss7] {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    max-height: 16rem;
    overflow-y: auto;
}