/* /Components/FamilyStructureExample.razor.rz.scp.css */
.family-example[b-qv5e01sil7] {
    max-width: 1180px;
    margin: 0 auto;
    padding: clamp(2.5rem, 6vw, 5rem) clamp(1rem, 3vw, 2rem);
    color: #263b48;
}

.family-example-intro[b-qv5e01sil7] { max-width: 720px; margin: 0 auto 2.2rem; text-align: center; }
.family-example-kicker[b-qv5e01sil7] { margin: 0 0 .65rem; color: #568271; font-size: .8rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.family-example-intro h2[b-qv5e01sil7] { margin: 0; font-size: clamp(1.8rem, 3.6vw, 2.9rem); font-weight: 900; letter-spacing: -.045em; line-height: 1.1; }
.family-example-intro > p:last-child[b-qv5e01sil7] { max-width: 690px; margin: .9rem auto 0; color: #667781; font-size: 1rem; line-height: 1.7; }
.family-chart[b-qv5e01sil7] { padding: clamp(1rem, 3vw, 2rem); border: 1px solid #e6e8df; border-radius: 22px; background: linear-gradient(150deg, #fffdf8, #f7faf7); box-shadow: 0 10px 32px rgba(47,65,64,.07); }
.family-generation-label[b-qv5e01sil7] { margin: .15rem 0 .7rem; color: #65766d; font-size: .76rem; font-weight: 900; letter-spacing: .1em; text-align: center; text-transform: uppercase; }
.family-grandparents[b-qv5e01sil7] { display: flex; align-items: center; justify-content: center; gap: .65rem; }
.family-person[b-qv5e01sil7] { display: inline-flex; align-items: center; gap: .45rem; min-width: 0; padding: .45rem .6rem; border: 1px solid #e6e9e6; border-radius: 10px; background: #fff; box-shadow: 0 2px 5px rgba(40,60,54,.04); }
.family-person b[b-qv5e01sil7], .family-person small[b-qv5e01sil7] { display: block; white-space: nowrap; }
.family-person b[b-qv5e01sil7] { font-size: .81rem; }
.family-person small[b-qv5e01sil7] { margin-top: .07rem; color: #78847d; font-size: .68rem; }
.family-person-icon[b-qv5e01sil7] { display: grid; width: 1.65rem; height: 1.65rem; flex: 0 0 auto; place-items: center; border-radius: 50%; font-size: .8rem; }
.family-icon-sage[b-qv5e01sil7] { background: #e0ede1; color: #56806a; }
.family-icon-blue[b-qv5e01sil7] { background: #e0ebf2; color: #5e8197; }
.family-icon-rose[b-qv5e01sil7] { background: #f7e5df; color: #b26f61; }
.family-icon-gold[b-qv5e01sil7] { background: #f6edd9; color: #a67e38; }
.family-partner-link[b-qv5e01sil7] { color: #c87d6c; font-size: 1rem; }
.family-connector[b-qv5e01sil7] { width: 2px; height: 24px; margin: 0 auto; background: #bdd0c1; }
.family-branches[b-qv5e01sil7] { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.family-branches[b-qv5e01sil7]::before { position: absolute; top: -1px; right: 16.66%; left: 16.66%; height: 2px; background: #bdd0c1; content: ""; }
.family-branch[b-qv5e01sil7] { position: relative; min-width: 0; padding: .85rem .7rem .7rem; border: 1px solid #e5e9e4; border-top: 3px solid #84a78d; border-radius: 11px; background: rgba(255,255,255,.92); }
.family-branch[b-qv5e01sil7]::before { position: absolute; top: -15px; left: 50%; width: 2px; height: 13px; background: #bdd0c1; content: ""; }
.family-branch-rose[b-qv5e01sil7] { border-top-color: #d08b78; }
.family-branch-blue[b-qv5e01sil7] { border-top-color: #7f9fb3; }
.family-branch-gold[b-qv5e01sil7] { border-top-color: #d0ad62; }
.family-branch-parent[b-qv5e01sil7] { display: flex; align-items: center; justify-content: center; gap: .25rem; }
.family-branch-parent .family-person[b-qv5e01sil7] { gap: .3rem; padding: .35rem; }
.family-branch-parent .family-person b[b-qv5e01sil7] { font-size: .72rem; }
.family-branch-parent .family-person small[b-qv5e01sil7] { font-size: .63rem; }
.family-branch-parent .family-person-icon[b-qv5e01sil7] { width: 1.35rem; height: 1.35rem; font-size: .66rem; }
.family-branch-plus[b-qv5e01sil7] { color: #7c8980; font-size: .75rem; }
.family-child-link[b-qv5e01sil7] { width: 2px; height: 12px; margin: 0 auto; background: #d3ddd4; }
.family-children[b-qv5e01sil7] { display: flex; justify-content: center; flex-wrap: wrap; gap: .3rem; }
.family-child[b-qv5e01sil7] { display: inline-flex; align-items: center; gap: .23rem; padding: .25rem .4rem; border: 1px solid #e6eae6; border-radius: 999px; background: #f8faf8; color: #40574c; font-size: .72rem; font-weight: 800; }
.family-child span[b-qv5e01sil7] { color: #6d9b79; }
.family-inlaw[b-qv5e01sil7] { display: grid; gap: .2rem; margin-top: .6rem; padding: .5rem; border-radius: 7px; background: #f3f4f1; color: #68756d; font-size: .68rem; line-height: 1.45; }
.family-inlaw b[b-qv5e01sil7] { color: #53625b; font-size: .72rem; }
.family-example-caption[b-qv5e01sil7] { margin: .65rem 0 0; color: #748078; font-size: .71rem; line-height: 1.5; text-align: center; }
.family-groups-heading[b-qv5e01sil7] { display: flex; align-items: end; justify-content: space-between; gap: .75rem; margin: 1.4rem 0 .6rem; }
.family-groups-heading > div > span[b-qv5e01sil7], .family-groups-heading small[b-qv5e01sil7] { display: block; }
.family-groups-heading > div > span[b-qv5e01sil7] { font-size: .91rem; font-weight: 900; }
.family-groups-heading small[b-qv5e01sil7], .family-groups-note[b-qv5e01sil7] { color: #748078; font-size: .72rem; }
.family-group-grid[b-qv5e01sil7] { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .6rem; }
.family-group-card[b-qv5e01sil7] { position: relative; min-width: 0; padding: .75rem; border: 1px solid #e5e9e5; border-top: 3px solid #78977e; border-radius: 10px; background: white; }
.family-group-grand[b-qv5e01sil7] { border-top-color: #78977e; }
.family-group-rose[b-qv5e01sil7] { border-top-color: #d08b78; }
.family-group-blue[b-qv5e01sil7] { border-top-color: #7f9fb3; }
.family-group-gold[b-qv5e01sil7] { border-top-color: #d0ad62; }
.family-group-card b[b-qv5e01sil7] { display: block; padding-right: 3.7rem; font-size: .82rem; }
.family-group-card p[b-qv5e01sil7] { min-height: 2.35em; margin: .35rem 0; color: #5f6e66; font-size: .72rem; line-height: 1.5; }
.family-group-count[b-qv5e01sil7] { float: right; padding: .18rem .3rem; border-radius: 999px; background: #edf2ed; color: #52735b; font-size: .63rem; font-weight: 900; }
.family-group-members[b-qv5e01sil7] { display: block; color: #6e7b73; font-size: .65rem; line-height: 1.5; }
.family-sharing-note[b-qv5e01sil7] { max-width: 940px; margin: .9rem auto 0; color: #5f7066; font-size: .82rem; line-height: 1.65; text-align: center; }
.family-sharing-note strong[b-qv5e01sil7] { color: #405b4a; }
.family-photo-example[b-qv5e01sil7] { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); align-items: center; gap: 1.25rem; margin-top: 1.2rem; padding: clamp(.85rem, 2.5vw, 1.5rem); border: 1px solid #e4e9e3; border-radius: 15px; background: #f9fbf8; }
.family-photo-copy h3[b-qv5e01sil7] { margin: 0; font-size: clamp(1.1rem, 2vw, 1.55rem); font-weight: 900; letter-spacing: -.03em; line-height: 1.15; }
.family-photo-copy > p:not(.family-example-kicker)[b-qv5e01sil7] { margin: .5rem 0 0; color: #5f7066; font-size: .84rem; line-height: 1.55; }
.family-photo-demo[b-qv5e01sil7] { display: grid; grid-template-columns: minmax(0, .75fr) repeat(2, minmax(0, 1fr)); align-items: stretch; gap: .45rem; }
.family-photo-demo > img[b-qv5e01sil7] { width: 100%; height: 100%; min-height: 126px; object-fit: cover; border-radius: 8px; }
.family-photo-group[b-qv5e01sil7] { min-width: 0; padding: .5rem; border: 1px solid #e2e7e2; border-radius: 8px; background: white; }
.family-photo-group > div[b-qv5e01sil7] { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; gap: .25rem; }
.family-photo-group b[b-qv5e01sil7] { color: #334c3c; font-size: .72rem; }
.family-photo-group small[b-qv5e01sil7] { display: block; margin: .3rem 0 .25rem; color: #6d7972; font-size: .65rem; }
.family-sync-off[b-qv5e01sil7] { display: inline-block; padding: .12rem .28rem; border-radius: 999px; background: #f0f1ef; color: #59665e; font-size: .6rem; font-weight: 800; white-space: nowrap; }
.family-photo-tag[b-qv5e01sil7] { display: inline-block; margin: .12rem .08rem .08rem 0; padding: .16rem .32rem; border-radius: 999px; background: #e8eef2; color: #435c70; font-size: .64rem; font-weight: 800; }

@media (max-width: 820px) {
    .family-example[b-qv5e01sil7] { padding-right: .5rem; padding-left: .5rem; }
    .family-branches[b-qv5e01sil7] { gap: .45rem; }
    .family-branch[b-qv5e01sil7] { padding-right: .35rem; padding-left: .35rem; }
    .family-branch-parent[b-qv5e01sil7] { flex-wrap: wrap; gap: .1rem; }
    .family-branch-parent .family-person[b-qv5e01sil7] { padding: .25rem; }
    .family-branch-parent .family-person-icon[b-qv5e01sil7] { width: 1.15rem; height: 1.15rem; }
    .family-group-grid[b-qv5e01sil7] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
    .family-example[b-qv5e01sil7] { padding: 2rem .25rem; }
    .family-chart[b-qv5e01sil7] { padding: .8rem .55rem; border-radius: 15px; }
    .family-grandparents[b-qv5e01sil7] { gap: .25rem; }
    .family-grandparent[b-qv5e01sil7] { padding: .35rem; }
    .family-grandparent .family-person-icon[b-qv5e01sil7] { width: 1.35rem; height: 1.35rem; }
    .family-grandparent b[b-qv5e01sil7] { font-size: .72rem; }
    .family-branches[b-qv5e01sil7] { grid-template-columns: minmax(0, 1fr); gap: .75rem; margin-top: .7rem; }
    .family-branches[b-qv5e01sil7]::before { top: -8px; bottom: 30px; left: 11px; width: 2px; height: auto; }
    .family-branch[b-qv5e01sil7] { margin-left: .45rem; padding: .65rem; }
    .family-branch[b-qv5e01sil7]::before { top: 1.2rem; left: -9px; width: 9px; height: 2px; }
    .family-branch-parent[b-qv5e01sil7] { justify-content: flex-start; gap: .35rem; }
    .family-branch-parent .family-person[b-qv5e01sil7] { padding: .35rem; }
    .family-branch-parent .family-person b[b-qv5e01sil7] { font-size: .7rem; }
    .family-branch-parent .family-person-icon[b-qv5e01sil7] { width: 1.3rem; height: 1.3rem; }
    .family-child-link[b-qv5e01sil7] { margin-left: 1.2rem; }
    .family-children[b-qv5e01sil7] { justify-content: flex-start; margin-left: .55rem; }
    .family-inlaw[b-qv5e01sil7] { margin-left: .45rem; }
    .family-groups-heading[b-qv5e01sil7] { align-items: flex-start; flex-direction: column; }
    .family-groups-note[b-qv5e01sil7] { font-size: .68rem; }
    .family-group-grid[b-qv5e01sil7] { gap: .4rem; }
    .family-group-card[b-qv5e01sil7] { padding: .55rem; }
    .family-group-card b[b-qv5e01sil7] { font-size: .76rem; }
    .family-group-card p[b-qv5e01sil7] { min-height: 0; font-size: .68rem; }
    .family-group-members[b-qv5e01sil7] { font-size: .62rem; }
    .family-photo-example[b-qv5e01sil7] { grid-template-columns: minmax(0, 1fr); }
    .family-photo-demo[b-qv5e01sil7] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .family-photo-demo > img[b-qv5e01sil7] { grid-column: 1 / -1; height: 145px; min-height: 0; }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-qyf6zed4wl] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    min-height: 100vh;
}

main[b-qyf6zed4wl] {
    min-width: 0;
    width: 100%;
}

.sidebar[b-qyf6zed4wl] {
    min-width: 0;
    background: #14212e;
}

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

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

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

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

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

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

@media (min-width: 641px) {
    .page[b-qyf6zed4wl] {
        grid-template-columns: 250px minmax(0, 1fr);
        align-items: start;
    }

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

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

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

    .top-row[b-qyf6zed4wl], article[b-qyf6zed4wl] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-qyf6zed4wl] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-qyf6zed4wl] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-ec03io6rxl] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: calc(0.5rem + env(safe-area-inset-top));
    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-ec03io6rxl] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-ec03io6rxl] {
    min-height: 3.5rem;
    padding-top: env(safe-area-inset-top);
    background-color: rgba(0,0,0,0.4);
}

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

.navbar-subtitle[b-ec03io6rxl] {
    font-size: 0.72rem;
    line-height: 1.1;
    color: rgba(255, 255, 255, 0.75);
    padding-bottom: 0.35rem;
}

.bi[b-ec03io6rxl] {
    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-ec03io6rxl] {
    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-plus-square-fill-nav-menu[b-ec03io6rxl] {
    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-ec03io6rxl] {
    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");
}

.bi-lock-nav-menu[b-ec03io6rxl] {
    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 d='M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2zM5 8h6a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1z'/%3E%3C/svg%3E");
}

.bi-person-nav-menu[b-ec03io6rxl] {
    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' viewBox='0 0 16 16'%3E%3Cpath d='M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm2-3a2 2 0 1 1-4 0 2 2 0 0 1 4 0Zm4 8c0 1-1 1-1 1H3s-1 0-1-1 1-4 6-4 6 3 6 4Zm-1-.004c-.001-.246-.154-.986-.832-1.664C11.516 10.68 10.289 10 8 10c-2.29 0-3.516.68-4.168 1.332-.678.678-.83 1.418-.832 1.664h10Z'/%3E%3C/svg%3E");
}

.bi-person-badge-nav-menu[b-ec03io6rxl] {
    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-badge' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 2a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1h-3zM11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0z'/%3E%3Cpath d='M4.5 0A2.5 2.5 0 0 0 2 2.5V14a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2.5A2.5 2.5 0 0 0 11.5 0h-7zM3 2.5A1.5 1.5 0 0 1 4.5 1h7A1.5 1.5 0 0 1 13 2.5v10.795a4.2 4.2 0 0 0-.776-.492C11.392 12.387 10.063 12 8 12s-3.392.387-4.224.803a4.2 4.2 0 0 0-.776.492V2.5z'/%3E%3C/svg%3E");
}

.bi-person-fill-nav-menu[b-ec03io6rxl] {
    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-arrow-bar-left-nav-menu[b-ec03io6rxl] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-arrow-bar-left' viewBox='0 0 16 16'%3E%3Cpath d='M12.5 15a.5.5 0 0 1-.5-.5v-13a.5.5 0 0 1 1 0v13a.5.5 0 0 1-.5.5ZM10 8a.5.5 0 0 1-.5.5H3.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L3.707 7.5H9.5a.5.5 0 0 1 .5.5Z'/%3E%3C/svg%3E");
}

.nav-scrollable[b-ec03io6rxl] {
    display: none;
    max-height: calc(100vh - 3.5rem);
    overflow-y: auto;
}

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

.nav-content[b-ec03io6rxl] {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    padding: 0.35rem 0 0.75rem;
}

.nav-section[b-ec03io6rxl] {
    margin-bottom: 0.35rem;
}

.nav-section-title[b-ec03io6rxl] {
    display: block;
    padding: 0.75rem 1rem 0.4rem;
    color: #b7c4d2;
    font-size: 0.73rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1.2;
    text-transform: uppercase;
}

details > summary.nav-section-title[b-ec03io6rxl] {
    cursor: pointer;
    list-style: none;
}

details > summary.nav-section-title[b-ec03io6rxl]::-webkit-details-marker {
    display: none;
}

details > summary.nav-section-title[b-ec03io6rxl]::after {
    content: "+";
    float: right;
    color: #aebdcb;
    font-size: 1rem;
    line-height: 0.9;
}

details[open] > summary.nav-section-title[b-ec03io6rxl]::after {
    content: "-";
}

.nav-current-group[b-ec03io6rxl] {
    margin: 0 0.35rem 0.2rem;
}

.nav-current-group > summary.nav-section-title[b-ec03io6rxl] {
    padding-left: 1rem;
    color: #f1f5f9;
    font-size: 0.7rem;
}

.nav-subheading[b-ec03io6rxl] {
    padding: 0.45rem 1rem 0.15rem;
    color: #94a6b8;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.nav-item[b-ec03io6rxl] {
    padding: 0 0.5rem 0.12rem;
    font-size: 0.88rem;
}

.nav-item.px-3[b-ec03io6rxl] {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
}

.nav-item[b-ec03io6rxl]  .nav-link {
    color: #e1e8f0;
    background: none;
    border: none;
    border-radius: 0.4rem;
    min-height: 2.45rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    line-height: 1.25;
    padding: 0.55rem 0.75rem;
    text-align: left;
    width: 100%;
}

.nav-item[b-ec03io6rxl]  a.active {
    background-color: rgba(255,255,255,0.16);
    color: #fff;
    font-weight: 600;
}

.nav-item[b-ec03io6rxl]  .nav-link:hover,
.nav-item[b-ec03io6rxl]  .nav-link:focus-visible {
    background-color: rgba(255,255,255,0.1);
    color: #fff;
}

.nav-badge[b-ec03io6rxl] {
    margin-left: auto;
    padding: 0.12rem 0.42rem;
    border-radius: 999px;
    background: #314b63;
    color: #f4f8fc;
    font-size: 0.7rem;
    font-weight: 700;
    line-height: 1.3;
}

.nav-account[b-ec03io6rxl] {
    margin-top: auto;
    padding: 0.85rem 1rem 0.65rem;
    border-top: 1px solid rgba(255,255,255,0.14);
}

.nav-account-identity[b-ec03io6rxl] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    gap: 0.12rem;
    margin-bottom: 0.5rem;
}

.nav-account-label[b-ec03io6rxl] {
    color: #b7c4d2;
    font-size: 0.7rem;
}

.nav-account-name[b-ec03io6rxl] {
    color: #fff;
    font-size: 0.92rem;
    overflow-wrap: anywhere;
}

.nav-account-email[b-ec03io6rxl] {
    color: #c4ced8;
    font-size: 0.74rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav-account-actions form[b-ec03io6rxl] {
    margin: 0;
}

.nav-account-actions[b-ec03io6rxl]  .nav-link {
    display: flex;
    align-items: center;
    min-height: 2.35rem;
    width: 100%;
    padding: 0.5rem 0.65rem;
    border: 0;
    border-radius: 0.4rem;
    background: transparent;
    color: #e1e8f0;
    text-align: left;
    text-decoration: none;
}

.nav-account-actions[b-ec03io6rxl]  .nav-link:hover,
.nav-account-actions[b-ec03io6rxl]  .nav-link:focus-visible {
    background: rgba(255,255,255,0.1);
    color: #fff;
}

.nav-account-actions[b-ec03io6rxl]  .nav-signout {
    color: #ffe0e0;
}

.nav-about[b-ec03io6rxl] {
    padding: 0.35rem 0.5rem 0;
    border-top: 1px solid rgba(255,255,255,0.12);
}

.nav-about a[b-ec03io6rxl] {
    display: block;
    padding: 0.55rem 0.75rem;
    color: #d0dae4;
    font-size: 0.84rem;
    text-decoration: none;
}

.nav-about a:hover[b-ec03io6rxl],
.nav-about a:focus-visible[b-ec03io6rxl] {
    color: #fff;
}

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

    .nav-scrollable[b-ec03io6rxl] {
        /* 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/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-vvh2ke9rzf],
.components-reconnect-repeated-attempt-visible[b-vvh2ke9rzf],
.components-reconnect-failed-visible[b-vvh2ke9rzf],
.components-pause-visible[b-vvh2ke9rzf],
.components-resume-failed-visible[b-vvh2ke9rzf],
.components-rejoining-animation[b-vvh2ke9rzf] {
    display: none;
}

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


#components-reconnect-modal[b-vvh2ke9rzf] {
    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-vvh2ke9rzf 0.5s both;
    &[open]

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

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

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

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

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

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

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

@keyframes components-rejoining-animation-b-vvh2ke9rzf {
    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/AdminQuizifyCatalog.razor.rz.scp.css */
.catalog-policy[b-yu422bip0a] {
    min-height: 24rem;
    font-family: monospace;
    white-space: pre;
}

.catalog-types[b-yu422bip0a] {
    min-width: 1100px;
}

.catalog-types th:nth-child(2)[b-yu422bip0a],
.catalog-types th:nth-child(3)[b-yu422bip0a] {
    width: 16%;
}

.catalog-types th:nth-child(4)[b-yu422bip0a] {
    width: 20%;
}

.catalog-filter[b-yu422bip0a] {
    max-width: 28rem;
}

.catalog-errors[b-yu422bip0a] {
    max-height: 24rem;
    overflow: auto;
}
/* /Components/Pages/Discover.razor.rz.scp.css */
.discover-page[b-sowspv2my2] {
    --discover-ink: #243746;
    --discover-muted: #5f6d76;
    --discover-blue: #3975a6;
    margin: -1.1rem -1.5rem 0;
    overflow: hidden;
    background: #fffdf9;
    color: var(--discover-ink);
}

.discover-hero[b-sowspv2my2] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, .95fr);
    align-items: center;
    gap: clamp(2rem, 5vw, 5rem);
    max-width: 1320px;
    min-height: 610px;
    margin: 0 auto;
    padding: clamp(3.5rem, 8vw, 7rem) clamp(1.5rem, 6vw, 6rem);
}

.discover-hero-copy[b-sowspv2my2] {
    max-width: 650px;
}

.discover-kicker[b-sowspv2my2] {
    margin: 0 0 1rem;
    color: #557c71;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .12em;
    line-height: 1.4;
    text-transform: uppercase;
}

.discover-hero h1[b-sowspv2my2] {
    margin: 0;
    font-size: clamp(2.5rem, 5.1vw, 4.4rem);
    font-weight: 900;
    letter-spacing: -.055em;
    line-height: 1.04;
}

.discover-hero h1 span[b-sowspv2my2] {
    color: #4d806e;
}

.discover-lead[b-sowspv2my2] {
    max-width: 550px;
    margin: 1.5rem 0 0;
    color: var(--discover-muted);
    font-size: clamp(1.05rem, 1.45vw, 1.25rem);
    line-height: 1.7;
}

.discover-actions[b-sowspv2my2] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem 1.5rem;
    margin-top: 2rem;
}

.discover-button[b-sowspv2my2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    min-height: 3.1rem;
    padding: .8rem 1.25rem;
    border: 1px solid #3f806a;
    border-radius: 999px;
    background: #3f806a;
    color: #fff;
    font-weight: 800;
    text-decoration: none;
    transition: transform .16s ease, background-color .16s ease;
}

.discover-button:hover[b-sowspv2my2],
.discover-button:focus-visible[b-sowspv2my2] {
    transform: translateY(-2px);
    background: #316c58;
    color: #fff;
}

.discover-button:focus-visible[b-sowspv2my2],
.discover-text-link:focus-visible[b-sowspv2my2] {
    outline: 3px solid #e7a44d;
    outline-offset: 3px;
}

.discover-button span[b-sowspv2my2] {
    font-size: 1.2rem;
    line-height: 1;
}

.discover-text-link[b-sowspv2my2] {
    color: var(--discover-blue);
    font-weight: 800;
    text-decoration-thickness: 1px;
    text-underline-offset: 4px;
}

.discover-note[b-sowspv2my2] {
    margin: 1.5rem 0 0;
    color: #738078;
    font-size: .88rem;
}

.discover-hero-art[b-sowspv2my2] {
    width: 100%;
    max-width: 560px;
    justify-self: center;
}

.discover-hero-art img[b-sowspv2my2],
.discover-art img[b-sowspv2my2] {
    display: block;
    width: 100%;
    height: auto;
}

.discover-feature[b-sowspv2my2] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, .9fr);
    align-items: center;
    gap: clamp(2.5rem, 7vw, 7rem);
    max-width: 1120px;
    margin: 0 auto;
    padding: clamp(3.5rem, 7vw, 6.5rem) clamp(1.5rem, 4vw, 3.25rem);
}

.discover-feature-reverse .discover-art[b-sowspv2my2] {
    order: 2;
}

.discover-feature-reverse .discover-copy[b-sowspv2my2] {
    order: 1;
}

.discover-art[b-sowspv2my2] {
    overflow: hidden;
    border-radius: 34px;
    padding: clamp(.75rem, 2vw, 1.4rem);
}

.discover-art-sand[b-sowspv2my2] { background: #f8f0df; }
.discover-art-rose[b-sowspv2my2] { background: #faece7; }
.discover-art-mint[b-sowspv2my2] { background: #eaf3e9; }
.discover-art-blue[b-sowspv2my2] { background: #eaf1f7; }
.discover-art-peach[b-sowspv2my2] { background: #fff0e5; }

.discover-copy[b-sowspv2my2] {
    max-width: 440px;
}

.discover-copy .discover-kicker[b-sowspv2my2] {
    margin-bottom: .9rem;
}

.discover-copy h2[b-sowspv2my2],
.discover-finale h2[b-sowspv2my2] {
    margin: 0;
    font-size: clamp(2rem, 3.2vw, 3.15rem);
    font-weight: 900;
    letter-spacing: -.045em;
    line-height: 1.12;
}

.discover-copy p:not(.discover-kicker)[b-sowspv2my2] {
    margin: 1.1rem 0 0;
    color: var(--discover-muted);
    font-size: 1.06rem;
    line-height: 1.75;
}

.discover-finale[b-sowspv2my2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    max-width: 1120px;
    margin: 1rem auto clamp(3rem, 7vw, 6rem);
    padding: clamp(2rem, 5vw, 4rem);
    border-radius: 30px;
    background: #293f4a;
    color: #fff;
}

.discover-finale > div[b-sowspv2my2] {
    max-width: 630px;
}

.discover-finale .discover-kicker[b-sowspv2my2] {
    color: #b5d7c6;
}

.discover-finale h2[b-sowspv2my2] {
    max-width: 570px;
}

.discover-finale p:not(.discover-kicker)[b-sowspv2my2] {
    margin: .9rem 0 0;
    color: #d7e1e2;
    font-size: 1.03rem;
    line-height: 1.65;
}

.discover-button-light[b-sowspv2my2] {
    flex: 0 0 auto;
    border-color: #f8ebd0;
    background: #f8ebd0;
    color: #293f4a;
}

.discover-button-light:hover[b-sowspv2my2],
.discover-button-light:focus-visible[b-sowspv2my2] {
    border-color: #fff7e8;
    background: #fff7e8;
    color: #293f4a;
}

@media (max-width: 850px) {
    .discover-hero[b-sowspv2my2] {
        grid-template-columns: minmax(0, 1fr) minmax(240px, .8fr);
        min-height: 0;
    }

    .discover-hero h1[b-sowspv2my2] {
        font-size: clamp(2.4rem, 6vw, 3.7rem);
    }

    .discover-feature[b-sowspv2my2] {
        gap: 2.5rem;
    }
}

@media (max-width: 640px) {
    .discover-page[b-sowspv2my2] {
        margin-top: -1.1rem;
    }

    .discover-hero[b-sowspv2my2] {
        grid-template-columns: 1fr;
        gap: 2rem;
        padding: 3.25rem 1.35rem 3.5rem;
    }

    .discover-hero-art[b-sowspv2my2] {
        max-width: 440px;
    }

    .discover-feature[b-sowspv2my2] {
        grid-template-columns: 1fr;
        gap: 1.75rem;
        padding: 3rem 1.35rem;
    }

    .discover-feature-reverse .discover-art[b-sowspv2my2],
    .discover-feature-reverse .discover-copy[b-sowspv2my2] {
        order: initial;
    }

    .discover-art[b-sowspv2my2] {
        border-radius: 26px;
        padding: .75rem;
    }

    .discover-finale[b-sowspv2my2] {
        align-items: flex-start;
        flex-direction: column;
        margin: 1rem 1.1rem 3rem;
        padding: 2rem 1.5rem;
        border-radius: 24px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .discover-button[b-sowspv2my2] {
        transition: none;
    }
}
/* /Components/Pages/DiscoverHome.razor.rz.scp.css */
.discover-page[b-byo8e03jfn] {
    --discover-ink: #243746;
    --discover-muted: #5f6d76;
    --discover-blue: #3975a6;
    margin: -1.1rem -1.5rem 0;
    overflow: hidden;
    background: #fffdf9;
    color: var(--discover-ink);
}

.discover-hero[b-byo8e03jfn] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, .9fr);
    align-items: center;
    gap: clamp(2rem, 5vw, 5rem);
    max-width: 1320px;
    margin: 0 auto;
    padding: clamp(3.5rem, 8vw, 6.5rem) clamp(1.5rem, 6vw, 6rem);
}

.discover-hero-copy[b-byo8e03jfn] { max-width: 660px; }
.discover-kicker[b-byo8e03jfn] { margin: 0 0 .85rem; color: #557c71; font-size: .78rem; font-weight: 800; letter-spacing: .12em; line-height: 1.4; text-transform: uppercase; }
.discover-hero h1[b-byo8e03jfn] { margin: 0; font-size: clamp(2.5rem, 5.1vw, 4.35rem); font-weight: 900; letter-spacing: -.055em; line-height: 1.04; }
.discover-hero h1 span[b-byo8e03jfn] { color: #4d806e; }
.discover-lead[b-byo8e03jfn] { max-width: 560px; margin: 1.35rem 0 0; color: var(--discover-muted); font-size: clamp(1.05rem, 1.45vw, 1.22rem); line-height: 1.7; }
.discover-actions[b-byo8e03jfn] { display: flex; align-items: center; flex-wrap: wrap; gap: .9rem 1.4rem; margin-top: 1.7rem; }
.discover-button[b-byo8e03jfn] { display: inline-flex; align-items: center; justify-content: center; gap: .65rem; min-height: 3.1rem; padding: .8rem 1.25rem; border: 1px solid #3f806a; border-radius: 999px; background: #3f806a; color: #fff; font-weight: 800; text-decoration: none; transition: transform .16s ease, background-color .16s ease; }
.discover-button:hover[b-byo8e03jfn], .discover-button:focus-visible[b-byo8e03jfn] { transform: translateY(-2px); background: #316c58; color: #fff; }
.discover-button:focus-visible[b-byo8e03jfn], .discover-text-link:focus-visible[b-byo8e03jfn] { outline: 3px solid #e7a44d; outline-offset: 3px; }
.discover-button span[b-byo8e03jfn] { font-size: 1.2rem; line-height: 1; }
.discover-text-link[b-byo8e03jfn] { color: var(--discover-blue); font-weight: 800; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.discover-note[b-byo8e03jfn] { margin: 1.2rem 0 0; color: #738078; font-size: .88rem; }
.discover-hero-art[b-byo8e03jfn] { width: 100%; max-width: 560px; justify-self: center; }
.discover-hero-art img[b-byo8e03jfn], .discover-art img[b-byo8e03jfn] { display: block; width: 100%; height: auto; }
.discover-feature[b-byo8e03jfn] { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); align-items: center; gap: clamp(2.5rem, 7vw, 7rem); max-width: 1120px; margin: 0 auto; padding: clamp(3.25rem, 6vw, 5.5rem) clamp(1.5rem, 4vw, 3.25rem); }
.discover-feature-reverse .discover-art[b-byo8e03jfn] { order: 2; }
.discover-feature-reverse .discover-copy[b-byo8e03jfn] { order: 1; }
.discover-art[b-byo8e03jfn] { overflow: hidden; padding: clamp(.75rem, 2vw, 1.4rem); border-radius: 30px; }
.discover-art-sand[b-byo8e03jfn] { background: #f8f0df; }
.discover-art-blue[b-byo8e03jfn] { background: #eaf1f7; }
.discover-copy[b-byo8e03jfn] { max-width: 470px; }
.discover-copy h2[b-byo8e03jfn], .discover-finale h2[b-byo8e03jfn] { margin: 0; font-size: clamp(2rem, 3.2vw, 3.1rem); font-weight: 900; letter-spacing: -.045em; line-height: 1.12; }
.discover-copy p:not(.discover-kicker)[b-byo8e03jfn] { margin: 1rem 0 0; color: var(--discover-muted); font-size: 1.03rem; line-height: 1.7; }
.discover-copy > a.discover-text-link[b-byo8e03jfn] { display: inline-block; margin-top: 1.2rem; }
.discover-copy > p > a.discover-text-link[b-byo8e03jfn] { display: inline-block; margin-top: .3rem; }
.discover-finale[b-byo8e03jfn] { display: flex; align-items: center; justify-content: space-between; gap: 2rem; max-width: 1120px; margin: 1rem auto clamp(3rem, 7vw, 6rem); padding: clamp(2rem, 5vw, 4rem); border-radius: 28px; background: #293f4a; color: #fff; }
.discover-finale > div[b-byo8e03jfn] { max-width: 650px; }
.discover-finale .discover-kicker[b-byo8e03jfn] { color: #b5d7c6; }
.discover-finale p:not(.discover-kicker)[b-byo8e03jfn] { margin: .9rem 0 0; color: #d7e1e2; font-size: 1.03rem; line-height: 1.65; }
.discover-button-light[b-byo8e03jfn] { flex: 0 0 auto; border-color: #f8ebd0; background: #f8ebd0; color: #293f4a; }
.discover-button-light:hover[b-byo8e03jfn], .discover-button-light:focus-visible[b-byo8e03jfn] { border-color: #fff7e8; background: #fff7e8; color: #293f4a; }

@media (max-width: 850px) {
    .discover-hero[b-byo8e03jfn] { grid-template-columns: minmax(0, 1fr) minmax(240px, .8fr); }
    .discover-hero h1[b-byo8e03jfn] { font-size: clamp(2.35rem, 6vw, 3.7rem); }
    .discover-feature[b-byo8e03jfn] { gap: 2.5rem; }
}

@media (max-width: 640px) {
    .discover-page[b-byo8e03jfn] { margin-top: -1.1rem; }
    .discover-hero[b-byo8e03jfn] { grid-template-columns: 1fr; gap: 2rem; padding: 3.25rem 1.35rem 3.5rem; }
    .discover-hero-art[b-byo8e03jfn] { max-width: 440px; }
    .discover-feature[b-byo8e03jfn] { grid-template-columns: 1fr; gap: 1.75rem; padding: 3rem 1.35rem; }
    .discover-feature-reverse .discover-art[b-byo8e03jfn], .discover-feature-reverse .discover-copy[b-byo8e03jfn] { order: initial; }
    .discover-art[b-byo8e03jfn] { border-radius: 24px; padding: .75rem; }
    .discover-finale[b-byo8e03jfn] { align-items: flex-start; flex-direction: column; margin: 1rem 1.1rem 3rem; padding: 2rem 1.5rem; border-radius: 22px; }
}

@media (prefers-reduced-motion: reduce) {
    .discover-button[b-byo8e03jfn] { transition: none; }
}
/* /Components/Pages/GameGuideImage.razor.rz.scp.css */
.game-guide-image-viewer[b-vhul31uiwx] {
    position: fixed;
    inset: 0;
    display: grid;
    place-items: center;
    overflow: hidden;
    background: #101820;
}

.game-guide-image-viewer img[b-vhul31uiwx] {
    display: block;
    width: 100vw;
    height: 100dvh;
    padding: clamp(.75rem, 2vw, 2rem);
    box-sizing: border-box;
    object-fit: contain;
}

.game-guide-image-back[b-vhul31uiwx] {
    position: fixed;
    z-index: 1;
    top: max(.75rem, env(safe-area-inset-top));
    left: max(.75rem, env(safe-area-inset-left));
    padding: .6rem .9rem;
    border: 1px solid #ffffff66;
    border-radius: .5rem;
    background: #101820dd;
    color: #fff;
    font: 600 .9rem/1.2 "Segoe UI", Aptos, sans-serif;
    text-decoration: none;
}

.game-guide-image-back:focus-visible[b-vhul31uiwx] {
    outline: 3px solid #82c7ff;
    outline-offset: 3px;
}
/* /Components/Pages/GameOverview.razor.rz.scp.css */
.game-overview[b-32826v6fr3] {
    --game-ink: #233744;
    --game-muted: #60717c;
    --game-green: #477965;
    max-width: 1320px;
    margin: -1.1rem auto 0;
    padding: 0 clamp(1rem, 4vw, 3.5rem) 4rem;
    color: var(--game-ink);
}

.game-overview-hero[b-32826v6fr3] { max-width: 900px; margin: 0 auto; padding: clamp(2rem, 6vw, 5rem) 0 3rem; text-align: center; }
.game-overview-back[b-32826v6fr3], .game-overview-link[b-32826v6fr3] { color: #3975a6; font-weight: 800; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.game-overview-back[b-32826v6fr3] { display: inline-block; margin-bottom: 2rem; text-decoration: none; }
.game-overview-kicker[b-32826v6fr3] { margin: 0 0 .65rem; color: #568271; font-size: .75rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.game-overview-hero h1[b-32826v6fr3] { margin: 0; font-size: clamp(2.4rem, 5.4vw, 4.4rem); font-weight: 900; letter-spacing: -.055em; line-height: 1.04; }
.game-overview-hero h1 span[b-32826v6fr3] { color: var(--game-green); }
.game-overview-hero > p:not(.game-overview-kicker)[b-32826v6fr3] { max-width: 730px; margin: 1.2rem auto 0; color: var(--game-muted); font-size: 1.1rem; line-height: 1.75; }
.game-overview-actions[b-32826v6fr3] { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 1rem 1.5rem; margin-top: 1.7rem; }
.game-overview-button[b-32826v6fr3] { display: inline-flex; align-items: center; justify-content: center; gap: .55rem; min-height: 2.9rem; padding: .75rem 1.15rem; border-radius: 999px; background: var(--game-green); color: white; font-weight: 800; text-decoration: none; }
.game-overview-button:hover[b-32826v6fr3], .game-overview-button:focus-visible[b-32826v6fr3] { background: #356753; color: white; }
.game-overview-button:focus-visible[b-32826v6fr3], .game-overview-back:focus-visible[b-32826v6fr3], .game-overview-link:focus-visible[b-32826v6fr3] { outline: 3px solid #e7a44d; outline-offset: 3px; }
.game-overview-card[b-32826v6fr3] { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); align-items: center; gap: clamp(2rem, 5vw, 5rem); padding: clamp(2rem, 5vw, 4rem) 0; border-top: 1px solid #e7ece8; }
.game-overview-card-reverse .game-overview-copy[b-32826v6fr3] { order: 2; }
.game-overview-card-reverse .game-overview-screen[b-32826v6fr3] { order: 1; }
.game-overview-copy[b-32826v6fr3] { max-width: 490px; }
.game-overview-copy h2[b-32826v6fr3], .game-overview-how h2[b-32826v6fr3], .game-overview-finale h2[b-32826v6fr3] { margin: 0; font-size: clamp(1.9rem, 3.5vw, 3rem); font-weight: 900; letter-spacing: -.045em; line-height: 1.1; }
.game-overview-copy > p:not(.game-overview-kicker)[b-32826v6fr3] { color: var(--game-muted); line-height: 1.7; }
.game-overview-copy ul[b-32826v6fr3] { display: grid; gap: .55rem; margin: 1.1rem 0 0; padding-left: 1.2rem; color: #425962; line-height: 1.5; }
.game-overview-screen[b-32826v6fr3] { min-width: 0; margin: 0; overflow: hidden; border: 1px solid #dce3e5; border-radius: 14px; background: #f4f7f9; box-shadow: 0 14px 40px rgba(42, 62, 73, .12); }
.game-overview-screen img[b-32826v6fr3] { display: block; width: 100%; height: auto; }
.game-overview-screen figcaption[b-32826v6fr3] { padding: .65rem .8rem; color: #687982; font-size: .76rem; line-height: 1.5; }
.game-overview-schematic[b-32826v6fr3] { display: grid; gap: .9rem; min-height: 280px; padding: clamp(.8rem, 2.5vw, 1.5rem); background: linear-gradient(145deg, #f4f7f9, #fff 70%, #edf4ef); font-family: system-ui, sans-serif; }
.yearify-timeline-ui[b-32826v6fr3] { background: #f3f5f4; border: 1px solid #dfe6e3; border-radius: 12px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.28); }
.game-ui-top[b-32826v6fr3] { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .5rem; padding-bottom: .65rem; border-bottom: 1px solid #dce4e7; color: #53656f; font-size: .65rem; }
.game-ui-top strong[b-32826v6fr3] { color: #293f4a; font-size: .86rem; letter-spacing: .08em; }
.game-ui-top span[b-32826v6fr3] { letter-spacing: .08em; }
.game-ui-pips[b-32826v6fr3] { display: inline-flex; align-items: center; gap: .35rem; }
.game-ui-pips span[b-32826v6fr3] { display: inline-block; width: .55rem; height: .55rem; border-radius: 50%; background: #d3d9d6; }
.game-ui-pips .is-on[b-32826v6fr3] { background: #203d4a; }
.game-ui-status[b-32826v6fr3] { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .5rem; color: #657780; font-size: .67rem; }
.game-ui-status strong[b-32826v6fr3] { color: #263b48; font-size: .9rem; }
.game-ui-audio[b-32826v6fr3] { display: flex; align-items: center; gap: .7rem; padding: .8rem; border: 1px solid #dfe7e9; border-radius: 9px; background: #edf3f1; }
.game-ui-audio > i[b-32826v6fr3] { width: 2.3rem; height: 2.3rem; flex: 0 0 auto; border-radius: 7px; background: linear-gradient(135deg, #dfeae4, #b4c9bf); }
.game-ui-audio > span[b-32826v6fr3] { display: grid; gap: .15rem; min-width: 0; }
.game-ui-audio strong[b-32826v6fr3] { color: #304651; font-size: .77rem; }
.game-ui-audio small[b-32826v6fr3], .game-ui-audio > b[b-32826v6fr3] { color: #72818a; font-size: .65rem; }
.game-ui-audio > b[b-32826v6fr3] { margin-left: auto; }
.game-ui-timeline[b-32826v6fr3] { display: flex; align-items: center; justify-content: center; gap: .45rem; padding: .55rem 0; }
.game-ui-timeline > div[b-32826v6fr3] { display: grid; gap: .2rem; min-width: 3.6rem; padding: .48rem; border: 1px solid #cdded2; border-radius: 7px; background: rgba(255,255,255,.6); text-align: center; }
.game-ui-timeline small[b-32826v6fr3] { color: #71817b; font-size: .52rem; font-weight: 800; letter-spacing: .07em; }
.game-ui-timeline strong[b-32826v6fr3] { color: #477965; font-size: 1.05rem; }
.game-ui-line[b-32826v6fr3] { width: clamp(.5rem, 3vw, 2rem); border-top: 2px solid #8baa94; }
.game-ui-actions[b-32826v6fr3] { display: flex; justify-content: center; flex-wrap: wrap; gap: .45rem; margin-top: auto; }
.game-ui-actions > span[b-32826v6fr3] { padding: .48rem .62rem; border: 1px solid #cbd9dd; border-radius: 6px; background: #fff; color: #455c68; font-size: .63rem; font-weight: 800; }
.game-ui-actions > span.is-selected[b-32826v6fr3] { border-color: #477965; background: #477965; color: white; }
.identify-match-ui[b-32826v6fr3] { gap: .6rem; padding: 1rem 1rem .9rem; border: 1px solid #dfe5e5; border-radius: 12px; background: #f6f7f5; }
.identify-ui-heading[b-32826v6fr3], .identify-ui-row[b-32826v6fr3] { display: grid; grid-template-columns: 2.2rem minmax(0, 1fr) minmax(110px, .9fr); align-items: center; gap: .6rem; }
.identify-ui-heading[b-32826v6fr3] { padding: 0 .2rem; color: #76858b; font-size: .55rem; font-weight: 800; letter-spacing: .08em; }
.identify-ui-heading > span:first-child[b-32826v6fr3] { grid-column: 2; }
.identify-ui-row[b-32826v6fr3] { min-height: 2.7rem; padding: .42rem .6rem; border: 1px solid #dfe5e8; border-radius: 7px; background: rgba(255,255,255,.72); color: #475d68; font-size: .68rem; }
.identify-ui-row > b[b-32826v6fr3] { display: grid; width: 1.75rem; height: 1.75rem; place-items: center; border-radius: 5px; background: #edf2f4; color: #61747d; font-size: .62rem; }
.identify-ui-row > span[b-32826v6fr3] { color: #2f4651; }
.identify-ui-row > strong[b-32826v6fr3] { display: flex; align-items: center; justify-content: space-between; gap: .35rem; min-height: 1.8rem; padding: .3rem .45rem; border: 1px solid #d3dfe6; border-radius: 5px; background: #fff; color: #435a66; font-size: .62rem; }
.identify-ui-row > strong i[b-32826v6fr3] { color: #477965; font-style: normal; font-weight: 900; }
.identify-ui-row-active[b-32826v6fr3] { border-color: #9ac4ea; background: rgba(233,244,255,.78); box-shadow: inset 0 0 0 1px rgba(94,155,214,.45); }
.identify-ui-row-active > strong[b-32826v6fr3] { border-color: #7aafe4; color: #3170ad; }
.identify-match-ui .game-ui-actions[b-32826v6fr3] { justify-content: flex-end; margin-top: .1rem; }
.identify-match-ui .game-ui-actions > span[b-32826v6fr3] { min-width: 10rem; text-align: center; }
.identify-match-ui .game-ui-actions > span.is-selected[b-32826v6fr3] { border-color: #4a8f5d; background: #4a8f5d; }
.game-overview-how[b-32826v6fr3] { padding: clamp(2rem, 5vw, 4rem) 0; text-align: center; }
.game-overview-how-grid[b-32826v6fr3] { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin: 1.6rem 0; text-align: left; }
.game-overview-how-grid > div[b-32826v6fr3] { padding: 1.25rem; border: 1px solid #e0e9e4; border-radius: 14px; background: #f6f9f5; }
.game-overview-how-grid span[b-32826v6fr3] { display: inline-grid; width: 2rem; height: 2rem; place-items: center; border-radius: 50%; background: #deece0; color: #477965; font-size: .78rem; font-weight: 900; }
.game-overview-how-grid h3[b-32826v6fr3] { margin: .8rem 0 .35rem; font-size: 1.1rem; font-weight: 900; }
.game-overview-how-grid p[b-32826v6fr3] { margin: 0; color: var(--game-muted); font-size: .92rem; line-height: 1.6; }
.game-overview-finale[b-32826v6fr3] { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding: clamp(1.5rem, 4vw, 3rem); border-radius: 22px; background: #293f4a; color: white; }
.game-overview-finale > div[b-32826v6fr3] { max-width: 650px; }
.game-overview-finale .game-overview-kicker[b-32826v6fr3] { color: #b5d7c6; }
.game-overview-finale p:not(.game-overview-kicker)[b-32826v6fr3] { color: #d8e2e3; line-height: 1.6; }
.game-overview-button-light[b-32826v6fr3] { flex: 0 0 auto; background: #f5e8cc; color: #293f4a; }
.game-overview-button-light:hover[b-32826v6fr3], .game-overview-button-light:focus-visible[b-32826v6fr3] { background: #fff5e2; color: #293f4a; }

@media (max-width: 800px) {
    .game-overview-card[b-32826v6fr3] { grid-template-columns: minmax(0, 1fr); }
    .game-overview-card-reverse .game-overview-copy[b-32826v6fr3], .game-overview-card-reverse .game-overview-screen[b-32826v6fr3] { order: initial; }
}

@media (max-width: 620px) {
    .game-overview-how-grid[b-32826v6fr3] { grid-template-columns: minmax(0, 1fr); }
    .game-overview-finale[b-32826v6fr3] { align-items: flex-start; flex-direction: column; border-radius: 16px; }
}
/* /Components/Pages/GettingStarted.razor.rz.scp.css */
.guide-page[b-zgkb2pusya] {
    --guide-ink: #263b48;
    --guide-muted: #667781;
    --guide-blue: #4a80c0;
    --guide-green: #477965;
    max-width: 1480px;
    margin: -1.1rem auto 0;
    padding: 0 clamp(.75rem, 2vw, 2rem) 3rem;
    color: var(--guide-ink);
}

.guide-hero[b-zgkb2pusya] {
    max-width: 900px;
    margin: 0 auto;
    padding: clamp(2rem, 5vw, 4rem) 0 2rem;
    text-align: center;
}

.guide-back[b-zgkb2pusya] {
    display: inline-block;
    margin-bottom: 2.5rem;
    color: var(--guide-blue);
    font-size: .9rem;
    font-weight: 800;
    text-decoration: none;
}

.guide-back:hover[b-zgkb2pusya] { text-decoration: underline; }

.guide-kicker[b-zgkb2pusya] {
    margin: 0 0 .65rem;
    color: #568271;
    font-size: .75rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.guide-hero h1[b-zgkb2pusya] {
    max-width: 780px;
    margin: 0 auto;
    font-size: clamp(2.4rem, 5vw, 4rem);
    font-weight: 900;
    letter-spacing: -.05em;
    line-height: 1.04;
}

.guide-hero > p:not(.guide-kicker)[b-zgkb2pusya] {
    max-width: 670px;
    margin: 1rem auto 1.4rem;
    color: var(--guide-muted);
    font-size: 1.1rem;
    line-height: 1.7;
}

.guide-start-link[b-zgkb2pusya] {
    display: inline-flex;
    align-items: center;
    gap: .65rem;
    min-height: 2.9rem;
    padding: .72rem 1.1rem;
    border: 0;
    border-radius: 999px;
    background: var(--guide-green);
    color: white;
    font-size: .95rem;
    font-weight: 800;
    text-decoration: none;
}

.guide-start-link:hover[b-zgkb2pusya], .guide-start-link:focus-visible[b-zgkb2pusya] { background: #356753; color: white; }
.guide-start-link:focus-visible[b-zgkb2pusya], .guide-back:focus-visible[b-zgkb2pusya] { outline: 3px solid #e7a44d; outline-offset: 3px; }

.guide-step[b-zgkb2pusya] {
    display: grid;
    grid-template-columns: minmax(210px, .68fr) minmax(0, 1.55fr);
    align-items: center;
    gap: clamp(1.5rem, 4vw, 4rem);
    max-width: 1280px;
    margin: 0 auto;
    padding: clamp(2.4rem, 5vw, 4.4rem) 0;
}

.guide-step-reverse .guide-step-copy[b-zgkb2pusya] { order: 2; }
.guide-step-reverse .guide-screen-wrap[b-zgkb2pusya] { order: 1; }

.guide-step-copy[b-zgkb2pusya] { position: relative; max-width: 380px; padding-left: .25rem; }
.guide-step-number[b-zgkb2pusya] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.45rem;
    height: 2.45rem;
    margin-bottom: 1.3rem;
    border-radius: 50%;
    background: #e5f0e8;
    color: #477965;
    font-size: .86rem;
    font-weight: 900;
}

.guide-step-copy h2[b-zgkb2pusya], .guide-finale h2[b-zgkb2pusya] {
    margin: 0;
    font-size: clamp(1.8rem, 3vw, 2.65rem);
    font-weight: 900;
    letter-spacing: -.045em;
    line-height: 1.1;
}

.guide-step-copy > p:last-child[b-zgkb2pusya], .guide-finale > div > p:last-child[b-zgkb2pusya] {
    margin: .9rem 0 0;
    color: var(--guide-muted);
    font-size: 1rem;
    line-height: 1.7;
}

.guide-screen-wrap[b-zgkb2pusya] { min-width: 0; }
.guide-screen[b-zgkb2pusya] {
    overflow: hidden;
    border: 1px solid #dce3e5;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 14px 40px rgba(42, 62, 73, .12), 0 2px 6px rgba(42, 62, 73, .06);
    color: #293540;
    font-family: 'Nunito', system-ui, sans-serif;
}

.guide-screen-caption[b-zgkb2pusya] { margin: .65rem .25rem 0; color: #77868c; font-size: .76rem; line-height: 1.45; }
.guide-login-screen[b-zgkb2pusya] { min-height: 350px; padding: 1.1rem; background: linear-gradient(145deg, #f4f7f9, #fff 55%, #eff5f2); }
.guide-login-brand[b-zgkb2pusya] { display: flex; align-items: center; gap: .55rem; }
.guide-brand-mark[b-zgkb2pusya] { display: grid; width: 2rem; height: 2rem; place-items: center; border-radius: 9px; background: #3e6f61; color: white; font-weight: 900; }
.guide-login-brand strong[b-zgkb2pusya], .guide-login-brand small[b-zgkb2pusya] { display: block; }
.guide-login-brand strong[b-zgkb2pusya] { font-size: .82rem; }
.guide-login-brand small[b-zgkb2pusya] { color: #75818a; font-size: .66rem; }
.guide-login-card[b-zgkb2pusya] { width: min(360px, 92%); margin: 1.3rem auto 0; padding: 1.1rem 1.35rem; border: 1px solid #e5e9eb; border-radius: 13px; background: rgba(255,255,255,.94); box-shadow: 0 6px 24px rgba(40,60,70,.07); }
.guide-eyebrow[b-zgkb2pusya] { color: #59816f; font-size: .66rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.guide-login-card h3[b-zgkb2pusya] { margin: .35rem 0; font-size: 1.3rem; font-weight: 900; }
.guide-login-card p[b-zgkb2pusya] { margin: 0 0 .85rem; color: #687780; font-size: .75rem; line-height: 1.5; }
.guide-provider[b-zgkb2pusya] { display: flex; align-items: center; gap: .55rem; margin-top: .5rem; padding: .58rem .7rem; border: 1px solid #dce1e4; border-radius: 7px; background: #fff; font-size: .78rem; font-weight: 800; }
.guide-provider-icon[b-zgkb2pusya] { display: grid; width: 1.2rem; height: 1.2rem; place-items: center; font-size: .85rem; font-weight: 900; }
.guide-ms-icon[b-zgkb2pusya] { color: #4585bd; }
.guide-google-icon[b-zgkb2pusya] { color: #4285f4; }

.guide-app-head[b-zgkb2pusya] { display: flex; align-items: center; justify-content: space-between; min-height: 2.6rem; padding: .5rem .8rem; background: #243746; color: #eaf0f2; font-size: .64rem; }
.guide-app-head > span:last-child[b-zgkb2pusya] { color: #c0d0d8; }
.guide-brand-small[b-zgkb2pusya] { font-weight: 900; letter-spacing: .02em; }
.guide-app-layout[b-zgkb2pusya] { display: grid; grid-template-columns: 145px minmax(0, 1fr); min-height: 275px; }
.guide-app-sidebar[b-zgkb2pusya] { display: flex; flex-direction: column; gap: .35rem; padding: .8rem .55rem; background: #2d4050; color: #e2eaf0; font-size: .69rem; }
.guide-app-sidebar strong[b-zgkb2pusya] { padding: .3rem .4rem; color: #aebdca; font-size: .58rem; letter-spacing: .08em; }
.guide-app-sidebar > span[b-zgkb2pusya] { padding: .45rem .5rem; border-radius: 5px; }
.guide-app-sidebar .guide-side-active[b-zgkb2pusya] { background: rgba(255,255,255,.17); color: white; font-weight: 800; }
.guide-sidebar-account[b-zgkb2pusya] { margin-top: auto; padding: .55rem .4rem 0; border-top: 1px solid rgba(255,255,255,.15); color: #c5d0d8; font-size: .62rem; line-height: 1.7; }
.guide-app-content[b-zgkb2pusya] { min-width: 0; padding: 1rem; background: #f7f9fb; }
.guide-screen-title-row[b-zgkb2pusya], .guide-gallery-title[b-zgkb2pusya] { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-bottom: .7rem; }
.guide-screen-title-row h3[b-zgkb2pusya], .guide-gallery-title h3[b-zgkb2pusya] { margin: 0; font-size: 1.1rem; font-weight: 900; }
.guide-screen-title-row p[b-zgkb2pusya] { margin: .15rem 0 0; color: #74818a; font-size: .68rem; }
.guide-mini-button[b-zgkb2pusya] { flex: 0 0 auto; padding: .35rem .55rem; border: 1px solid #8bb2d7; border-radius: 5px; background: #fff; color: #3975a6; font-size: .62rem; font-weight: 800; }
.guide-group-row[b-zgkb2pusya] { display: flex; align-items: center; gap: .65rem; margin-top: .5rem; padding: .48rem; border: 1px solid #e5e9ec; border-radius: 7px; background: white; }
.guide-group-art[b-zgkb2pusya] { width: 48px; height: 43px; overflow: hidden; flex: 0 0 auto; border-radius: 5px; background: #dfece4; }
.guide-group-art img[b-zgkb2pusya] { width: 100%; height: 100%; object-fit: cover; }
.guide-group-row b[b-zgkb2pusya], .guide-group-row small[b-zgkb2pusya] { display: block; }
.guide-group-row b[b-zgkb2pusya] { font-size: .75rem; }
.guide-group-row small[b-zgkb2pusya] { margin-top: .1rem; color: #73818a; font-size: .62rem; }
.guide-row-arrow[b-zgkb2pusya] { margin-left: auto; color: #71808a; font-size: 1.3rem; }

.guide-gallery-body[b-zgkb2pusya] { padding: .8rem; background: #f7f9fb; }
.guide-gallery-title[b-zgkb2pusya] { margin-bottom: .5rem; }
.guide-gallery-title span:not(.guide-mini-button)[b-zgkb2pusya] { display: block; margin-top: .1rem; color: #71808a; font-size: .63rem; }
.guide-gallery-toolbar[b-zgkb2pusya] { display: flex; align-items: center; gap: .3rem; margin-bottom: .6rem; }
.guide-tab[b-zgkb2pusya] { padding: .28rem .45rem; border: 1px solid #dfe5e8; border-radius: 4px; background: #fff; color: #52616b; font-size: .61rem; }
.guide-tab-active[b-zgkb2pusya] { background: #526b7a; color: #fff; }
.guide-tool-spacer[b-zgkb2pusya] { flex: 1; }
.guide-gallery-examples[b-zgkb2pusya] { display: grid; gap: 1rem; }
.guide-example-label[b-zgkb2pusya] { margin: 0 0 .45rem; color: #435c70; font-size: .78rem; font-weight: 900; }
.guide-date-navigation[b-zgkb2pusya] { display: flex; align-items: center; gap: .75rem; margin-bottom: .6rem; color: #52616b; font-size: .7rem; }
.guide-period-grid[b-zgkb2pusya] { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; }
.guide-period-grid-years[b-zgkb2pusya] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.guide-period-tile[b-zgkb2pusya] { position: relative; aspect-ratio: 1; overflow: hidden; border-radius: 7px; background: #e8e5db; }
.guide-period-tile img[b-zgkb2pusya] { position: absolute; width: 100%; height: 100%; object-fit: cover; }
.guide-period-tile > div[b-zgkb2pusya] { position: absolute; right: 0; bottom: 0; left: 0; display: grid; gap: .12rem; padding: 1.4rem .5rem .5rem; background: linear-gradient(transparent, rgba(23,39,42,.85)); color: #fff; }
.guide-period-tile b[b-zgkb2pusya] { font-size: clamp(.68rem, 1.3vw, 1rem); }
.guide-period-tile small[b-zgkb2pusya] { font-size: .65rem; }
.guide-photo-grid[b-zgkb2pusya] { display: grid; gap: .45rem; margin-top: .45rem; }
.guide-grid-three[b-zgkb2pusya] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.guide-photo-tile[b-zgkb2pusya] { position: relative; height: clamp(74px, 12vw, 138px); overflow: hidden; border-radius: 6px; background: #e8e5db; }
.guide-photo-tile img[b-zgkb2pusya] { width: 100%; height: 100%; object-fit: cover; }
.guide-photo-tile span[b-zgkb2pusya] { position: absolute; right: 0; bottom: 0; left: 0; padding: .7rem .4rem .28rem; background: linear-gradient(transparent, rgba(23,39,42,.72)); color: white; font-size: .56rem; font-weight: 800; }
.guide-grid-short .guide-photo-tile[b-zgkb2pusya] { height: clamp(58px, 8vw, 82px); }
.guide-timeline-note[b-zgkb2pusya] { display: flex; align-items: center; gap: .4rem; margin-top: .6rem; color: #667982; font-size: .63rem; }
.guide-timeline-dot[b-zgkb2pusya] { width: .48rem; height: .48rem; border-radius: 50%; background: #6e9a7d; box-shadow: 0 0 0 3px #e0ece2; }

.guide-detail-toolbar[b-zgkb2pusya] { display: flex; justify-content: space-between; padding: .55rem .75rem; border-bottom: 1px solid #e7ebed; color: #667781; font-size: .66rem; }
.guide-close-mark[b-zgkb2pusya] { font-size: 1rem; line-height: .8; }
.guide-detail-layout[b-zgkb2pusya] { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(250px, .95fr); gap: .8rem; padding: .75rem; }
.guide-detail-art[b-zgkb2pusya] { display: grid; align-self: start; aspect-ratio: 4 / 3; place-items: center; overflow: hidden; border-radius: 7px; background: #e8efeb; }
.guide-detail-art img[b-zgkb2pusya] { width: 100%; height: 100%; object-fit: contain; }
.guide-detail-meta[b-zgkb2pusya] { min-width: 0; }
.guide-taken[b-zgkb2pusya] { display: block; margin: .15rem 0 .5rem; color: #74818a; font-size: .61rem; }
.guide-tag-panel[b-zgkb2pusya] { overflow: hidden; border: 1px solid #e4e8ea; border-radius: 7px; background: white; }
.guide-tag-heading[b-zgkb2pusya] { display: flex; align-items: center; justify-content: space-between; gap: .3rem; padding: .55rem; border-bottom: 1px solid #e8ebed; font-size: .69rem; font-weight: 900; }
.guide-tag-block[b-zgkb2pusya] { display: flex; align-items: center; flex-wrap: wrap; gap: .28rem; padding: .47rem .55rem; border-bottom: 1px solid #f0f1f1; }
.guide-tag-block:last-child[b-zgkb2pusya] { border: 0; }
.guide-tag-block > b[b-zgkb2pusya] { flex-basis: 100%; margin-bottom: .05rem; font-size: .62rem; }
.guide-chip[b-zgkb2pusya] { display: inline-flex; align-items: center; padding: .2rem .4rem; border-radius: 999px; font-size: .57rem; font-weight: 800; }
.guide-chip-person[b-zgkb2pusya] { background: #e8edf2; color: #435c70; }
.guide-chip-event[b-zgkb2pusya] { background: #dff0f3; color: #3a6f78; }
.guide-chip-place[b-zgkb2pusya] { background: #e2efe4; color: #426c4e; }
.guide-chip-group[b-zgkb2pusya] { background: #384b57; color: white; }
.guide-description[b-zgkb2pusya] { display: grid; gap: .25rem; margin-top: .65rem; padding: .55rem; border: 1px solid #e6e9e9; border-radius: 7px; background: #fff; }
.guide-description b[b-zgkb2pusya] { font-size: .64rem; }
.guide-description span[b-zgkb2pusya] { color: #64737b; font-size: .61rem; line-height: 1.5; }
.guide-description .guide-mini-button[b-zgkb2pusya] { justify-self: start; color: #3975a6; }
.guide-memory-feedback[b-zgkb2pusya] { margin-top: .65rem; padding: .55rem; border: 1px solid #e6e9e9; border-radius: 7px; background: #fff; color: #64737b; font-size: .64rem; }
.guide-memory-likes[b-zgkb2pusya] { display: flex; align-items: center; flex-wrap: wrap; gap: .4rem; margin-bottom: .6rem; }
.guide-like-button[b-zgkb2pusya] { padding: .3rem .5rem; border: 1px solid #b96068; border-radius: 5px; color: #a43c49; font-weight: 800; }
.guide-memory-feedback p[b-zgkb2pusya] { margin: .35rem 0 .6rem; line-height: 1.5; }
.guide-comment-entry[b-zgkb2pusya] { display: flex; align-items: center; justify-content: space-between; gap: .4rem; padding: .3rem .35rem; border: 1px solid #dfe4e7; border-radius: 5px; }

.guide-album-screen[b-zgkb2pusya] { padding: .75rem; background: #f8fafb; }
.guide-album-top[b-zgkb2pusya] { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .25rem .15rem .7rem; }
.guide-breadcrumb[b-zgkb2pusya], .guide-album-subtitle[b-zgkb2pusya] { display: block; color: #74818a; font-size: .61rem; }
.guide-album-top h3[b-zgkb2pusya] { display: inline-block; margin: .12rem .35rem .08rem 0; font-size: 1.1rem; font-weight: 900; }
.guide-smart-badge[b-zgkb2pusya] { display: inline-block; padding: .19rem .4rem; border-radius: 999px; background: #d8f3f6; color: #286975; font-size: .57rem; font-weight: 900; vertical-align: middle; }
.guide-album-actions[b-zgkb2pusya] { display: flex; align-items: center; gap: .35rem; }
.guide-play-button[b-zgkb2pusya] { padding: .36rem .55rem; border-radius: 5px; background: #3975a6; color: #fff; font-size: .63rem; font-weight: 900; }
.guide-album-settings[b-zgkb2pusya] { overflow: hidden; border: 1px solid #e2e7e9; border-radius: 8px; background: white; }
.guide-settings-heading[b-zgkb2pusya] { display: flex; align-items: center; justify-content: space-between; padding: .6rem .7rem; border-bottom: 1px solid #e7ebed; }
.guide-settings-heading b[b-zgkb2pusya], .guide-settings-heading small[b-zgkb2pusya] { display: block; }
.guide-settings-heading b[b-zgkb2pusya] { font-size: .73rem; }
.guide-settings-heading small[b-zgkb2pusya] { margin-top: .1rem; color: #73818a; font-size: .58rem; }
.guide-selected-tags[b-zgkb2pusya] { display: flex; flex-wrap: wrap; gap: .25rem; padding: .55rem .65rem; }
.guide-album-tabs[b-zgkb2pusya] { display: flex; flex-wrap: wrap; gap: .25rem; padding: .35rem .5rem; border-bottom: 1px solid #e7ebed; background: #fafbfc; }
.guide-album-tabs span[b-zgkb2pusya] { padding: .3rem .42rem; border-radius: 4px; color: #53656f; font-size: .58rem; }
.guide-album-tabs .guide-album-tab-active[b-zgkb2pusya] { background: #3975a6; color: white; font-weight: 800; }
.guide-filter-row[b-zgkb2pusya] { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .38rem .65rem; border-bottom: 1px solid #f0f1f2; color: #4d5c65; font-size: .62rem; }
.guide-filter-select[b-zgkb2pusya] { display: flex; justify-content: space-between; gap: 1.5rem; min-width: 145px; padding: .35rem .45rem; border: 1px solid #dfe4e7; border-radius: 5px; background: white; color: #56656d; }
.guide-rule-hint[b-zgkb2pusya] { padding: .4rem .65rem; color: #71818a; font-size: .57rem; }
.guide-album-preview[b-zgkb2pusya] { padding-top: .65rem; }
.guide-album-preview > span[b-zgkb2pusya] { color: #5f6c74; font-size: .64rem; font-weight: 900; }
.guide-album-preview .guide-photo-tile[b-zgkb2pusya] { height: clamp(64px, 9vw, 94px); }

.guide-slideshow-screen[b-zgkb2pusya] { position: relative; display: grid; grid-template-columns: 150px minmax(0, 1fr); grid-template-rows: minmax(260px, 365px) auto; padding: .55rem; background: #24313c; color: #fff; }
.guide-slideshow-title[b-zgkb2pusya] { display: flex; flex-direction: column; justify-content: center; padding: 1rem; background: #253945; }
.guide-slideshow-title span[b-zgkb2pusya] { color: #b8c9cc; font-size: .63rem; }
.guide-slideshow-title b[b-zgkb2pusya] { margin-top: .3rem; font-size: 1.05rem; }
.guide-slideshow-image[b-zgkb2pusya] { position: relative; display: grid; min-width: 0; place-items: center; overflow: hidden; background: #293840; }
.guide-slideshow-image img[b-zgkb2pusya] { width: 100%; height: 100%; max-height: 365px; object-fit: cover; }
.guide-slide-caption[b-zgkb2pusya] { position: absolute; right: .65rem; bottom: .6rem; left: .65rem; padding: .65rem .5rem .2rem; background: linear-gradient(transparent, rgba(0,0,0,.62)); color: white; font-size: .76rem; font-weight: 800; }
.guide-slide-counter[b-zgkb2pusya] { position: absolute; top: .55rem; right: .6rem; padding: .25rem .4rem; border-radius: 4px; background: rgba(0,0,0,.5); color: #fff; font-size: .58rem; }
.guide-slideshow-controls[b-zgkb2pusya] { grid-column: 1 / -1; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: .55rem; min-height: 2.45rem; color: #e1e8ec; font-size: .72rem; }
.guide-slideshow-play[b-zgkb2pusya] { display: grid; width: 1.55rem; height: 1.55rem; place-items: center; border-radius: 50%; background: #e4eee8; color: #29443a; }
.guide-control-divider[b-zgkb2pusya] { height: 1rem; border-left: 1px solid #667680; }
.guide-speed[b-zgkb2pusya] { padding: .25rem .4rem; border: 1px solid #596a76; border-radius: 4px; font-size: .62rem; }
.guide-slide-counter-small[b-zgkb2pusya] { color: #b9c4c9; font-size: .62rem; }

.guide-finale[b-zgkb2pusya] { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; max-width: 1280px; margin: 1rem auto 0; padding: clamp(1.5rem, 4vw, 3rem); border-radius: 22px; background: #293f4a; color: white; }
.guide-finale > div[b-zgkb2pusya] { max-width: 640px; }
.guide-finale .guide-kicker[b-zgkb2pusya] { color: #b5d7c6; }
.guide-finale > div > p:last-child[b-zgkb2pusya] { color: #d8e2e3; }
.guide-finale .guide-start-link[b-zgkb2pusya] { flex: 0 0 auto; background: #f5e8cc; color: #293f4a; }
.guide-finale .guide-start-link:hover[b-zgkb2pusya] { background: #fff5e2; }

.guide-privacy-note[b-zgkb2pusya] { max-width: 900px; margin: -.7rem auto 1rem; color: #7b8780; font-size: .7rem; line-height: 1.5; text-align: center; }
.guide-download-note[b-zgkb2pusya] { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; max-width: 1280px; margin: 1.5rem auto 2rem; padding: clamp(1.25rem, 3vw, 2.25rem); border: 1px solid #dce8de; border-radius: 18px; background: #f0f6ef; }
.guide-download-note > div[b-zgkb2pusya] { max-width: 760px; }
.guide-download-note .guide-kicker[b-zgkb2pusya] { margin-bottom: .45rem; }
.guide-download-note h2[b-zgkb2pusya] { margin: 0; font-size: clamp(1.35rem, 2.3vw, 1.9rem); font-weight: 900; letter-spacing: -.035em; }
.guide-download-note > div > p:last-child[b-zgkb2pusya] { margin: .45rem 0 0; color: #62736b; font-size: .88rem; line-height: 1.6; }
.guide-download-icon[b-zgkb2pusya] { display: grid; width: 3.1rem; height: 3.1rem; flex: 0 0 auto; place-items: center; border-radius: 50%; background: #deece0; color: #477965; font-size: 1.6rem; font-weight: 900; }

@media (max-width: 850px) {
    .guide-step[b-zgkb2pusya] { grid-template-columns: minmax(175px, .55fr) minmax(0, 1fr); gap: 1.5rem; }
    .guide-app-layout[b-zgkb2pusya] { grid-template-columns: 110px minmax(0, 1fr); }
    .guide-detail-layout[b-zgkb2pusya] { grid-template-columns: minmax(0, 1fr); }
    .guide-detail-art[b-zgkb2pusya] { max-height: 240px; }
    .guide-detail-meta[b-zgkb2pusya] { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: .5rem; }
    .guide-taken[b-zgkb2pusya] { grid-column: 1 / -1; margin-bottom: -.3rem; }
    .guide-description[b-zgkb2pusya] { margin-top: 0; }
    .guide-memory-feedback[b-zgkb2pusya] { grid-column: 1 / -1; margin-top: 0; }
}

@media (max-width: 620px) {
    .guide-page[b-zgkb2pusya] { padding-right: .2rem; padding-left: .2rem; }
    .guide-hero[b-zgkb2pusya] { padding-top: 1.5rem; }
    .guide-back[b-zgkb2pusya] { margin-bottom: 2rem; }
    .guide-step[b-zgkb2pusya], .guide-step-reverse[b-zgkb2pusya] { grid-template-columns: minmax(0, 1fr); gap: 1.25rem; padding: 2.5rem 0; }
    .guide-step-reverse .guide-step-copy[b-zgkb2pusya], .guide-step-reverse .guide-screen-wrap[b-zgkb2pusya] { order: initial; }
    .guide-step-copy[b-zgkb2pusya] { max-width: none; }
    .guide-step-number[b-zgkb2pusya] { margin-bottom: .75rem; }
    .guide-app-layout[b-zgkb2pusya] { grid-template-columns: 88px minmax(0, 1fr); }
    .guide-app-sidebar[b-zgkb2pusya] { font-size: .61rem; }
    .guide-app-content[b-zgkb2pusya] { padding: .65rem; }
    .guide-screen-title-row h3[b-zgkb2pusya], .guide-gallery-title h3[b-zgkb2pusya] { font-size: .94rem; }
    .guide-tab[b-zgkb2pusya] { padding: .25rem .33rem; font-size: .55rem; }
    .guide-photo-grid[b-zgkb2pusya] { gap: .3rem; }
    .guide-detail-meta[b-zgkb2pusya] { grid-template-columns: minmax(0, 1fr); }
    .guide-taken[b-zgkb2pusya] { grid-column: auto; }
    .guide-slideshow-screen[b-zgkb2pusya] { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(220px, 60vw) auto; }
    .guide-slideshow-title[b-zgkb2pusya] { padding: .6rem .75rem; }
    .guide-slideshow-title b[b-zgkb2pusya] { font-size: .9rem; }
    .guide-slideshow-image[b-zgkb2pusya] { grid-row: 2; }
    .guide-slideshow-controls[b-zgkb2pusya] { grid-row: 3; gap: .42rem; }
    .guide-finale[b-zgkb2pusya] { align-items: flex-start; flex-direction: column; border-radius: 17px; }
    .guide-download-note[b-zgkb2pusya] { align-items: flex-start; border-radius: 15px; }
    .guide-download-icon[b-zgkb2pusya] { width: 2.5rem; height: 2.5rem; }
}
/* /Components/Pages/GroupPage.razor.rz.scp.css */
.pending-delete-float[b-4ux10o889w] {
    position: fixed;
    z-index: 1040;
    width: min(340px, calc(100vw - 16px));
    max-height: min(240px, calc(100dvh - 16px));
    overflow-y: auto;
    margin: 0;
    padding: 0.75rem;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
    left: clamp(8px, calc(var(--delete-click-x, 100vw) + 12px), max(8px, calc(100vw - 348px)));
    top: clamp(8px, calc(var(--delete-click-y, 100dvh) + 12px), max(8px, calc(100dvh - 248px)));
}

/* Mobile-only overrides — desktop (>=641px) layout is untouched */
@media (max-width: 640.98px) {
    .container[b-4ux10o889w] {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

    /* Stack search fields full-width instead of cramming narrow inline-width controls */
    .mobile-search-form > input[b-4ux10o889w],
    .mobile-search-form > select[b-4ux10o889w],
    .mobile-search-form > button[b-4ux10o889w] {
        flex: 1 1 100% !important;
        max-width: none !important;
        width: 100%;
    }

    /* Stack selection-mode action buttons full width so each is an easy, unambiguous tap target */
    .mobile-toolbar[b-4ux10o889w] {
        flex-direction: column;
        align-items: stretch !important;
    }

        .mobile-toolbar > span[b-4ux10o889w] {
            text-align: center;
        }

        .mobile-toolbar > button[b-4ux10o889w],
        .mobile-toolbar > select[b-4ux10o889w] {
            width: 100%;
        }
}
/* /Components/Pages/GroupPeopleLinks.razor.rz.scp.css */
.people-links-page[b-3ecx8emnpc] {
    max-width: 1120px;
}

.people-links-explainer[b-3ecx8emnpc] {
    max-width: 1000px;
}

.people-links-grid[b-3ecx8emnpc] {
    max-height: 70vh;
}

.people-links-grid th[b-3ecx8emnpc],
.people-links-grid td[b-3ecx8emnpc] {
    min-width: 190px;
}

.linked-review-image[b-3ecx8emnpc] {
    width: 120px;
    height: 90px;
    object-fit: cover;
    border-radius: 0.375rem;
    background: var(--bs-tertiary-bg);
}

.people-links-grid th:first-child[b-3ecx8emnpc],
.people-links-grid td:first-child[b-3ecx8emnpc] {
    min-width: 150px;
    position: sticky;
    left: 0;
    z-index: 1;
    background: var(--bs-body-bg);
}

.people-links-grid thead th[b-3ecx8emnpc] {
    position: sticky;
    top: 0;
    z-index: 2;
}

.people-links-grid thead th:first-child[b-3ecx8emnpc] {
    z-index: 3;
}

.people-link-cell-linked[b-3ecx8emnpc] {
    background-color: #e8f5e9;
}

.people-link-cell-unlinked[b-3ecx8emnpc] {
    background-color: #fff8dc;
}

.people-link-select-linked[b-3ecx8emnpc] {
    border-color: #75b798;
    background-color: #dff3e4;
}

.people-link-select-unlinked[b-3ecx8emnpc] {
    border-color: #e6c85c;
    background-color: #fff3bf;
}

@media (max-width: 640.98px) {
    .people-links-page[b-3ecx8emnpc] {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

    .people-links-page .btn-sm[b-3ecx8emnpc] {
        min-height: 40px;
        white-space: normal;
    }

    .people-links-page .list-group-item[b-3ecx8emnpc] {
        align-items: flex-start !important;
    }
}
/* /Components/Pages/Groups.razor.rz.scp.css */
.group-overview-photo[b-tnxtx7r0sm] {
    width: 72px;
    height: 72px;
    flex: 0 0 72px;
    object-fit: cover;
}

.group-overview-placeholder[b-tnxtx7r0sm] {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--bs-secondary-color);
    font-size: 1.5rem;
}

.group-overview-details[b-tnxtx7r0sm] {
    min-width: 0;
    overflow-wrap: anywhere;
}
/* /Components/Pages/MediaDetail.razor.rz.scp.css */
.detail-fullscreen-root[b-izw580m73o] {
    position: fixed;
    inset: 0;
    z-index: 1080;
    background: #000;
    display: flex;
    align-items: center;
    justify-content: center;
    outline: none;
}

.detail-fullscreen-stage[b-izw580m73o] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.detail-fullscreen-media[b-izw580m73o] {
    max-width: 100%;
    max-height: 100%;
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    background: #000;
}

.detail-fullscreen-caption[b-izw580m73o] {
    position: absolute;
    left: 50%;
    bottom: 4.5rem;
    transform: translateX(-50%);
    max-width: 80%;
    padding: .35rem .75rem;
    border-radius: .5rem;
    background: rgba(0, 0, 0, .55);
    color: #fff;
    font-size: .9rem;
    text-align: center;
}

.detail-fullscreen-controls[b-izw580m73o] {
    position: absolute;
    left: 50%;
    bottom: 1rem;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .4rem .6rem;
    border-radius: 2rem;
    background: rgba(0, 0, 0, .55);
    opacity: .35;
    transition: opacity .2s ease-in-out;
}

.detail-fullscreen-root:hover .detail-fullscreen-controls[b-izw580m73o] {
    opacity: 1;
}

/* Mobile-only: icon-round overlay buttons get an explicit 44x44 touch target,
   and fullscreen controls stay fully visible since touch devices have no :hover. */
@media (max-width: 640.98px) {
    .detail-fullscreen-controls[b-izw580m73o] {
        opacity: 1;
        bottom: max(1rem, env(safe-area-inset-bottom));
    }

    [b-izw580m73o] .btn-icon-round {
        width: 44px;
        height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0;
    }
}
/* /Components/Pages/MediaSlideshow.razor.rz.scp.css */
.slideshow-root[b-b3bh4m8x0u] {
    position: fixed;
    inset: 0;
    z-index: 1080;
    background: #000;
    display: flex;
    align-items: center;
    justify-content: center;
    outline: none;
}

.slideshow-stage[b-b3bh4m8x0u] {
    position: absolute;
    inset: 0;
    z-index: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.slideshow-backdrop[b-b3bh4m8x0u] {
    position: absolute;
    inset: -2rem;
    z-index: 0;
    width: calc(100% + 4rem);
    height: calc(100% + 4rem);
    object-fit: cover;
    filter: blur(1.5rem) brightness(.48) saturate(1.15);
    transform: scale(1.08);
}

.slideshow-media[b-b3bh4m8x0u] {
    max-width: 100%;
    max-height: 100%;
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    background: #000;
    position: relative;
    z-index: 1;
    box-shadow: 0 .5rem 2.5rem rgba(0, 0, 0, .5);
}

.slideshow-media.media-fill[b-b3bh4m8x0u] {
    object-fit: cover;
}

.slideshow-landscape .slideshow-media[b-b3bh4m8x0u] {
    background: transparent;
}

.slideshow-taken-date[b-b3bh4m8x0u] {
    position: absolute;
    left: 50%;
    top: 1rem;
    transform: translateX(-50%);
    max-width: 80%;
    padding: .3rem .8rem;
    border-radius: 2rem;
    background: rgba(0, 0, 0, .7);
    color: #fff;
    font-size: .95rem;
    font-weight: 600;
    letter-spacing: .01em;
    text-align: center;
    white-space: nowrap;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .9);
}

.slideshow-caption[b-b3bh4m8x0u] {
    position: absolute;
    left: 50%;
    bottom: 4.5rem;
    transform: translateX(-50%);
    max-width: 80%;
    padding: .35rem .75rem;
    border-radius: .5rem;
    background: rgba(0, 0, 0, .55);
    color: #fff;
    font-size: .9rem;
    text-align: center;
}

.slideshow-controls[b-b3bh4m8x0u] {
    position: absolute;
    left: 50%;
    bottom: 1rem;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .4rem .6rem;
    border-radius: 2rem;
    background: rgba(0, 0, 0, .55);
    opacity: .35;
    transition: opacity .2s ease-in-out;
}

.slideshow-root:hover .slideshow-controls[b-b3bh4m8x0u] {
    opacity: 1;
}

.slideshow-interval[b-b3bh4m8x0u] {
    width: auto;
}

.slideshow-position[b-b3bh4m8x0u] {
    color: #fff;
    font-size: .85rem;
    padding: 0 .35rem;
    white-space: nowrap;
}

/* Mobile: no :hover on touch devices, so keep controls visible; and let the
   control pill wrap onto two rows instead of overflowing/clipping narrow screens. */
@media (max-width: 640.98px) {
    .slideshow-taken-date[b-b3bh4m8x0u] {
        top: max(0.5rem, env(safe-area-inset-top));
        font-size: .85rem;
    }

    .slideshow-controls[b-b3bh4m8x0u] {
        opacity: 1;
        flex-wrap: wrap;
        justify-content: center;
        max-width: calc(100vw - 1.5rem);
        bottom: max(0.75rem, env(safe-area-inset-bottom));
    }

    .slideshow-controls .btn[b-b3bh4m8x0u] {
        min-height: 40px;
    }
}

/* Portrait photos and videos can use the otherwise empty side areas on a landscape display. */
.slideshow-side-left[b-b3bh4m8x0u],
.slideshow-side-right[b-b3bh4m8x0u] {
    display: none;
}

@media (orientation: landscape) {
    .slideshow-landscape .slideshow-side-left[b-b3bh4m8x0u],
    .slideshow-landscape .slideshow-side-right[b-b3bh4m8x0u] {
        position: absolute;
        inset-block: 0;
        z-index: 2;
        display: flex;
        box-sizing: border-box;
        width: var(--slideshow-side-space, 0px);
        flex-direction: column;
        overflow-y: auto;
        padding: .85rem;
        background: linear-gradient(180deg, rgba(10, 17, 29, .26), rgba(10, 17, 29, .42));
        transition: width .15s ease-out, padding .15s ease-out;
    }

    .slideshow-landscape .slideshow-side-left[b-b3bh4m8x0u] {
        left: 0;
        border-right: 1px solid #444;
    }

    .slideshow-landscape .slideshow-side-right[b-b3bh4m8x0u] {
        right: 0;
        border-left: 1px solid #444;
    }
}

.slideshow-title-panel[b-b3bh4m8x0u] {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: .75rem 0;
}

.slideshow-title-card[b-b3bh4m8x0u] {
    padding: 1rem .75rem;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 1rem;
    background: linear-gradient(145deg, rgba(255, 177, 104, .25), rgba(126, 90, 255, .22));
    box-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .18);
}

.slideshow-title-kicker[b-b3bh4m8x0u] {
    display: block;
    color: #ffd9ac;
    font-size: .65rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-align: center;
    text-transform: uppercase;
}

.slideshow-title[b-b3bh4m8x0u] {
    color: white;
    font-weight: 700;
    line-height: 1.2;
    word-wrap: break-word;
    overflow-wrap: break-word;
    text-align: center;
    margin: 0;
    font-size: clamp(1.1rem, 2.5vw, 2rem);
    text-shadow: 0 .15rem .5rem rgba(0, 0, 0, .5);
}

.slideshow-tags-panel[b-b3bh4m8x0u] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.slideshow-metadata-section[b-b3bh4m8x0u] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.slideshow-metadata-title[b-b3bh4m8x0u] {
    color: #f8dfc7;
    font-size: .7rem;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
}

.slideshow-metadata-list[b-b3bh4m8x0u] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.slideshow-tag-list[b-b3bh4m8x0u] {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

.slideshow-tag-chip[b-b3bh4m8x0u] {
    max-width: 100%;
    padding: .25rem .5rem;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 999px;
    color: #fff;
    font-size: .72rem;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.slideshow-tag-chip.people[b-b3bh4m8x0u] {
    background: rgba(111, 168, 255, .28);
}

.slideshow-tag-chip.event[b-b3bh4m8x0u] {
    background: rgba(233, 120, 171, .3);
}

.slideshow-tag-chip.location[b-b3bh4m8x0u] {
    background: rgba(80, 190, 146, .3);
}
/* /Components/Pages/MembersCard.razor.rz.scp.css */
/* Mobile-only overrides — desktop (>=641px) layout is untouched */
@media (max-width: 640.98px) {
    .member-row[b-20z4uiig9x] {
        flex-wrap: wrap;
    }

    .member-actions[b-20z4uiig9x] {
        width: 100%;
        justify-content: flex-start;
        margin-top: 0.5rem;
        padding-left: calc(56px + 1rem); /* align under the name, past the avatar */
    }

        .member-actions .btn[b-20z4uiig9x],
        .member-actions select[b-20z4uiig9x] {
            flex: 1 1 auto;
            min-width: 0;
        }
}

@media (max-width: 420px) {
    .member-actions[b-20z4uiig9x] {
        padding-left: 0;
    }
}

.member-email[b-20z4uiig9x] { overflow-wrap: anywhere; }
.member-editor[b-20z4uiig9x] { max-width: 480px; }
.member-dialog-backdrop[b-20z4uiig9x] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    padding: 1rem;
}
.member-dialog[b-20z4uiig9x] {
    background: white;
    border-radius: 8px;
    padding: 1rem;
    max-width: 480px;
    width: 100%;
}

.person-root[b-20z4uiig9x] { border-left: 4px solid var(--bs-primary); }
.person-proxy-child[b-20z4uiig9x] {
    margin-left: 1.5rem;
    border-left: 4px solid var(--bs-info);
    padding-left: 1.25rem;
    background: var(--bs-tertiary-bg, #f1f5f9);
}
.proxy-group-label[b-20z4uiig9x] { margin-top: .35rem; }
.member-sync-select[b-20z4uiig9x] { font-weight: 600; font-size: .8rem; padding-block: .15rem; }
/* /Components/Pages/MyMembers.razor.rz.scp.css */
.person-root[b-pefv74df7k] { border-left: 4px solid var(--bs-primary); }
.person-proxy-child[b-pefv74df7k] {
    margin-left: 1.5rem;
    border-left: 4px solid var(--bs-info);
    padding-left: 1.25rem;
    background: var(--bs-tertiary-bg, #f1f5f9);
}
.proxy-group-label[b-pefv74df7k] { margin-top: .35rem; }
.member-email[b-pefv74df7k] { overflow-wrap: anywhere; }
/* /Components/Pages/PresentationDetail.razor.rz.scp.css */
/* Mobile-only overrides — desktop (>=641px) layout and drag-and-drop reordering are untouched */

/* HTML5 drag-and-drop doesn't work on touch devices, so mobile gets explicit
   move up/down buttons instead; desktop keeps the existing drag interaction. */
@media (min-width: 641px) {
    .mobile-reorder-btns[b-4zs2fnebhe] {
        display: none !important;
    }
}

@media (max-width: 640.98px) {
    .container[b-4zs2fnebhe] {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

    .reorder-hint[b-4zs2fnebhe] {
        display: none;
    }

    .mobile-reorder-btns .btn[b-4zs2fnebhe] {
        min-height: 32px;
        padding: 0.15rem 0.5rem;
    }
}
/* /Components/Pages/Presentations.razor.rz.scp.css */
/* Mobile-only overrides — desktop (>=641px) layout is untouched */
@media (max-width: 640.98px) {
    .container[b-ja3jxc2z7l] {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

    .presentation-row[b-ja3jxc2z7l] {
        flex-wrap: wrap;
    }

        .presentation-row > div:last-child[b-ja3jxc2z7l] {
            width: 100%;
        }

            .presentation-row > div:last-child .btn[b-ja3jxc2z7l] {
                flex: 1 1 0;
            }
}
/* /Components/Pages/Profile.razor.rz.scp.css */
/* Mobile-only overrides — desktop (>=641px) layout is untouched.
   Profile.razor now uses standard Bootstrap form-control/form-select/btn classes
   (see Profile.razor), which are already full-width/touch-friendly by default,
   so no raw-element overrides are needed here anymore. */
@media (max-width: 640.98px) {
    .container[b-sodpcqdlxg] {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
}
/* /Components/Pages/QuizifyPlayer.razor.rz.scp.css */
.quizify-player-progress[b-dobbiik9j3] { color: #6c757d; font-size: 14px; margin-bottom: .5rem; }
.player-question-title[b-dobbiik9j3] { margin: .75rem 0 0; }
.player-actions[b-dobbiik9j3] { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.answered-summary[b-dobbiik9j3] { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; padding: .45rem .7rem; border-left: 3px solid #198754; background: var(--bs-tertiary-bg, #f8f9fa); }
.connection-story[b-dobbiik9j3] { margin-top: .6rem; padding-left: .75rem; border-left: 3px solid #0d6efd; line-height: 1.35; }
.next-question-preview[b-dobbiik9j3] { margin-top: .6rem; padding: .65rem .8rem; border: 1px solid var(--bs-border-color, #dee2e6); border-radius: .6rem; background: var(--bs-tertiary-bg, #f8f9fa); }
.next-question-title[b-dobbiik9j3] { margin: .45rem 0 .55rem; font-size: clamp(1.05rem, 2.1vw, 1.45rem); line-height: 1.3; }
.quizify-answer-modes > .btn[b-dobbiik9j3] { display: flex; flex: 1 1 14rem; flex-direction: column; align-items: flex-start; gap: .25rem; text-align: left; }
.quizify-answer-modes small[b-dobbiik9j3] { font-weight: 400; line-height: 1.35; white-space: normal; }
.answer-reveal[b-dobbiik9j3] { display: flex; align-items: baseline; gap: .5rem; flex-wrap: wrap; padding: .4rem .6rem; border-radius: .4rem; background: var(--bs-tertiary-bg, #f8f9fa); }
.preparation-phases[b-dobbiik9j3] { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.phase-label[b-dobbiik9j3] { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 0 .25rem; margin-bottom: .25rem; font-size: 14px; line-height: 1.3; }
.preparation-compact .progress[b-dobbiik9j3] { height: 4px; }
@media (max-width: 575.98px) {
    .player-question-card .player-actions > .btn[b-dobbiik9j3] { flex: 1 1 auto; }
    .preparation-phases[b-dobbiik9j3] { gap: .4rem; }
}
/* /Components/Pages/QuizifyPromptLibrary.razor.rz.scp.css */
.quizify-prompt-dialog[b-2egr2l1wh2] { position: fixed; inset: 0; z-index: 1100; background: var(--bs-body-bg, white); color: var(--bs-body-color, #212529); display: flex; flex-direction: column; }
.quizify-prompt-workspace[b-2egr2l1wh2] { display: grid; grid-template-columns: minmax(220px, 25%) 1fr; flex: 1; min-height: 0; }
.quizify-prompt-text[b-2egr2l1wh2] { min-height: 55vh; resize: vertical; font-size: .9rem; }
pre[b-2egr2l1wh2] { white-space: pre-wrap; overflow-wrap: anywhere; }
@media (max-width: 700px) { .quizify-prompt-workspace[b-2egr2l1wh2] { grid-template-columns: 1fr; overflow: auto; } .quizify-prompt-workspace aside[b-2egr2l1wh2] { max-height: 35vh; } }
/* /Components/Pages/Yearify/YearifyPlay.razor.rz.scp.css */
.team-controller-links[b-78cekpjep3] {
    padding: 18px;
    background: #f8fafc;
    border: 1px solid #cbd5e1;
    border-radius: 18px;
}

.team-controller-link-grid[b-78cekpjep3] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 14px;
}

.team-controller-link-card[b-78cekpjep3] {
    display: grid;
    justify-items: center;
    gap: 10px;
    padding: 14px;
    background: white;
    border: 1px solid #dbeafe;
    border-radius: 14px;
    text-align: center;
}

.team-controller-link-card h6[b-78cekpjep3] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 900;
}

.team-controller-link-card img[b-78cekpjep3] {
    width: 150px;
    height: 150px;
}

.play-toggle-btn[b-78cekpjep3] {
    min-width: 220px;
    font-weight: 800;
}

.check-response-btn[b-78cekpjep3] {
    min-width: 220px;
    font-weight: 900;
}

.scoreboard-years[b-78cekpjep3] {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
}

.scoreboard-years.years-align-center[b-78cekpjep3] {
    justify-content: center;
}

.scoreboard-years.years-align-start[b-78cekpjep3] {
    justify-content: flex-start;
}

.scoreboard-selection-help[b-78cekpjep3] {
    margin-bottom: 8px;
    font-size: 0.82rem;
    font-weight: 800;
    text-align: center;
}

.scoreboard-selection-help.text-start[b-78cekpjep3] {
    text-align: left;
}

.selected-generation-label[b-78cekpjep3] {
    display: block;
    margin-top: 4px;
    color: #fff7ed;
    font-size: 0.95rem;
    font-weight: 800;
}

.scoreboard-decade-selector[b-78cekpjep3] {
    display: grid;
    gap: 8px;
    text-align: center;
}

.scoreboard-decade-selector .scoreboard-years[b-78cekpjep3] {
    flex-wrap: nowrap;
    gap: 8px;
}

.scoreboard-empty[b-78cekpjep3] {
    padding: 10px 14px;
    color: rgba(255, 255, 255, 0.86);
    background: rgba(255, 255, 255, 0.14);
    border: 1px dashed rgba(255, 255, 255, 0.4);
    border-radius: 14px;
    font-weight: 800;
}

.timeline-display[b-78cekpjep3] {
    padding: 18px;
    background: white;
    border-radius: 14px;
    border: 1px solid #e0e0e0;
}

.years-row[b-78cekpjep3] {
    display: flex;
    justify-content: center;
    gap: 15px;
    flex-wrap: wrap;
}

.year-badge[b-78cekpjep3] {
    background: #16a34a;
    color: white;
    min-height: 44px;
    min-width: 72px;
    padding: 7px 11px;
    border-radius: 11px;
    font-weight: 900;
    font-size: clamp(1rem, 1.8vw, 1.35rem);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.18);
}

.year-badge.reference[b-78cekpjep3] {
    background: #111827;
}

.year-badge.locked[b-78cekpjep3] {
    background: #16a34a;
}

.year-badge.at-risk[b-78cekpjep3] {
    background: #dc2626;
}

.year-count-tag[b-78cekpjep3] {
    border-radius: 999px;
    padding: 2px 7px;
    font-size: 0.72em;
    font-weight: 700;
    line-height: 1.4;
    background: rgba(255, 255, 255, 0.22);
    color: white;
    border: 1px solid rgba(255, 255, 255, 0.35);
}

.year-count-tag.locked-tag[b-78cekpjep3] {
    background: #15803d;
}

.year-count-tag.at-risk-tag[b-78cekpjep3] {
    background: #b91c1c;
}

.scoreboard-year[b-78cekpjep3] {
    width: 176px;
    min-height: 116px;
    padding: 16px 18px;
    border: 2px solid rgba(255, 255, 255, 0.35);
    font-size: clamp(1.8rem, 3vw, 2.5rem);
}

.scoreboard-year.multi-song-year[b-78cekpjep3] {
    width: auto;
    min-width: 88px;
    min-height: 58px;
    padding: 9px 14px;
    font-size: clamp(1.1rem, 1.9vw, 1.5rem);
}

.year-badge-btn[b-78cekpjep3] {
    border: 2px solid transparent;
    cursor: pointer;
    transition: all 0.15s ease;
    font-family: inherit;
    appearance: none;
}

.year-badge-btn:hover[b-78cekpjep3] {
    transform: translateY(-2px);
}

.year-badge-btn.selected[b-78cekpjep3] {
    background: #ea580c;
    border-color: #ffffff;
    box-shadow: 0 0 0 5px #ffffff, 0 0 0 10px #ea580c, 0 8px 18px rgba(0, 0, 0, 0.32);
    transform: scale(1.06);
}

.scoreboard-choice[b-78cekpjep3] {
    color: white;
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.72);
}

.scoreboard-choice.selected[b-78cekpjep3] {
    color: #ffffff;
    background: #ea580c;
    border-color: #ffffff;
    box-shadow: 0 0 0 4px #ffffff, 0 0 0 8px #ea580c;
}

.decade-choice[b-78cekpjep3] {
    width: 104px;
    min-height: 64px;
    padding: 8px;
    color: white;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.62);
    border-radius: 10px;
    font-size: clamp(1rem, 1.5vw, 1.3rem);
    font-weight: 800;
}

.decade-choice.selected[b-78cekpjep3] {
    color: #111827;
    background: #facc15;
    border-color: #facc15;
}

.before-after-btn[b-78cekpjep3] {
    background: white;
    color: #2563eb;
    border: 2px solid #2563eb;
    border-radius: 14px;
    min-height: 58px;
    padding: 12px 18px;
    font-weight: 900;
    font-size: clamp(1.1rem, 2vw, 1.7rem);
    cursor: pointer;
    transition: all 0.15s ease;
}

.before-after-btn:hover[b-78cekpjep3] {
    transform: translateY(-2px);
}

.before-after-btn.selected[b-78cekpjep3] {
    background: #2563eb;
    color: white;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.4);
}

.years-dense[b-78cekpjep3] {
    gap: 10px;
}

.years-dense .year-badge[b-78cekpjep3],
.years-dense .before-after-btn[b-78cekpjep3] {
    width: 110px;
    min-height: 72px;
    padding: 10px 12px;
    font-size: clamp(1.1rem, 1.8vw, 1.45rem);
}

.years-dense .decade-choice[b-78cekpjep3] {
    width: 90px;
    min-height: 56px;
    font-size: clamp(0.9rem, 1.2vw, 1.1rem);
}

.years-dense .multi-song-year[b-78cekpjep3] {
    width: auto;
    min-height: 54px;
    min-width: 76px;
}

.years-compact[b-78cekpjep3] {
    gap: 7px;
}

.years-compact .year-badge[b-78cekpjep3],
.years-compact .before-after-btn[b-78cekpjep3] {
    width: 84px;
    min-height: 54px;
    padding: 7px 9px;
    border-radius: 11px;
    font-size: clamp(0.95rem, 1.45vw, 1.15rem);
}

.years-compact .decade-choice[b-78cekpjep3] {
    width: 76px;
    min-height: 48px;
    font-size: clamp(0.8rem, 1.1vw, 0.95rem);
}

.years-compact .multi-song-year[b-78cekpjep3] {
    width: auto;
    min-height: 46px;
    min-width: 68px;
}

.team-count-medium .scoreboard-year[b-78cekpjep3] {
    width: 132px;
    min-height: 86px;
    font-size: clamp(1.25rem, 2vw, 1.65rem);
}

.team-count-many .scoreboard-year[b-78cekpjep3] {
    width: 84px;
    min-height: 54px;
    padding: 7px 9px;
    font-size: clamp(0.95rem, 1.45vw, 1.15rem);
}

.external-playback-panel[b-78cekpjep3] {
    margin-top: 8px;
}

.qr-wrapper img.qr-img[b-78cekpjep3] {
    max-width: min(280px, 80vw);
    width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
    border: 3px solid #e5e7eb;
    border-radius: 8px;
    padding: 6px;
    background: white;
}

.qr-mobile-toggle[b-78cekpjep3],
.qr-mobile[b-78cekpjep3] {
    display: none;
}

@media (max-width: 767.98px) {
    .scoreboard-years[b-78cekpjep3] {
        justify-content: flex-start;
    }

    .qr-desktop[b-78cekpjep3] {
        display: none;
    }

    .qr-mobile-toggle[b-78cekpjep3],
    .qr-mobile[b-78cekpjep3] {
        display: block;
    }
}

.decade-buttons[b-78cekpjep3] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: center;
}

.decade-buttons .btn[b-78cekpjep3] {
    min-width: 70px;
    padding: 8px 12px;
    font-size: 14px;
    font-weight: 600;
}